/* ============================================================
   TORIBOX — Dark Theme Landing Page
   ============================================================ */

/* ---------- RESET & BASE ---------- */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}

body{
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  line-height:1.6;
  color:#E5E7EB;
  background:#0B0F19;
  overflow-x:hidden;
}

a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
ul,ol{list-style:none}

/* ---------- UTILITY ---------- */
.container{max-width:1200px;margin:0 auto;padding:0 24px}
.section-label{
  display:inline-flex;align-items:center;gap:6px;
  font-size:.75rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;
  color:#FF6A00;margin-bottom:12px;
}
.section-label .dot{width:6px;height:6px;border-radius:50%;background:#FF6A00}

/* ---------- NAVBAR ---------- */
.navbar{
  position:fixed;top:0;left:0;width:100%;z-index:1000;
  padding:16px 0;
  background:transparent;
  transition:background .35s,box-shadow .35s,padding .35s;
}
.navbar.scrolled{
  background:rgba(11,15,25,.97);
  box-shadow:0 2px 20px rgba(0,0,0,.4);
  padding:10px 0;
  backdrop-filter:blur(12px);
}
.navbar .container{display:flex;align-items:center;justify-content:space-between}

.nav-brand{display:flex;align-items:center;gap:10px}
.nav-brand img{width:36px;height:36px;border-radius:8px}
.nav-brand span{font-size:1.25rem;font-weight:800;color:#fff}
.nav-brand span b{color:#FF6A00}

.nav-links{display:flex;align-items:center;gap:32px;list-style:none}
.nav-links a{
  font-size:.85rem;font-weight:600;color:rgba(255,255,255,.7);
  letter-spacing:.5px;text-transform:uppercase;
  transition:color .25s;
}
.nav-links a:hover{color:#FF6A00}

.nav-right{display:flex;align-items:center;gap:16px}
.nav-search{
  background:none;border:none;color:rgba(255,255,255,.7);
  font-size:1.1rem;cursor:pointer;padding:6px;transition:color .25s;
}
.nav-search:hover{color:#fff}
.nav-cta{
  padding:10px 22px;border:2px solid #FF6A00;border-radius:50px;
  color:#FF6A00;font-size:.85rem;font-weight:700;
  background:transparent;cursor:pointer;transition:all .25s;
}
.nav-cta:hover{background:#FF6A00;color:#fff}

/* Hamburger */
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:6px;background:none;border:none}
.hamburger span{display:block;width:24px;height:2.5px;background:#fff;border-radius:2px;transition:.3s}

/* Mobile menu */
.mobile-menu{
  display:none;
  position:fixed;top:0;left:0;width:100%;height:100vh;
  background:rgba(11,15,25,.98);
  flex-direction:column;align-items:center;justify-content:center;
  gap:28px;z-index:999;
  backdrop-filter:blur(12px);
}
.mobile-menu.active{display:flex}
.mobile-menu a{font-size:1.2rem;font-weight:600;color:#fff;text-transform:uppercase;letter-spacing:1px}
.mobile-menu a:hover{color:#FF6A00}
.mobile-close{
  position:absolute;top:20px;right:24px;
  font-size:2rem;color:#fff;background:none;border:none;cursor:pointer;
}

/* ---------- HERO ---------- */
.hero{
  position:relative;
  padding:140px 0 100px;
  min-height:100vh;
  display:flex;align-items:center;
  overflow:hidden;
  background:radial-gradient(ellipse at 70% 20%,rgba(255,106,0,.08) 0%,transparent 60%),
             radial-gradient(ellipse at 20% 80%,rgba(255,106,0,.04) 0%,transparent 50%),
             #0B0F19;
}
.hero .container{display:flex;align-items:center;justify-content:space-between;gap:60px}

.hero-text{flex:1;max-width:600px}
.hero-badge{
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(255,106,0,.12);border:1px solid rgba(255,106,0,.25);
  padding:8px 18px;border-radius:50px;
  font-size:.75rem;font-weight:700;letter-spacing:1px;text-transform:uppercase;
  color:#FF6A00;margin-bottom:24px;
}
.hero-badge svg{width:14px;height:14px;fill:#FF6A00}

.hero-text h1{
  font-size:3.6rem;font-weight:900;line-height:1.08;
  color:#fff;margin-bottom:24px;
}
.hero-text h1 .orange{color:#FF6A00}

.hero-subtitle{
  border-left:3px solid #FF6A00;
  padding-left:16px;
  font-size:1.05rem;color:#9CA3AF;
  line-height:1.7;margin-bottom:32px;
}

/* Waitlist form */
.waitlist-form{
  display:flex;gap:0;margin-bottom:20px;
  max-width:520px;
}
.waitlist-form input{
  flex:1;padding:16px 20px;
  background:#151B28;border:1px solid rgba(255,255,255,.1);
  border-radius:12px 0 0 12px;
  color:#fff;font-size:.95rem;
  outline:none;transition:border-color .25s;
}
.waitlist-form input::placeholder{color:#6B7280}
.waitlist-form input:focus{border-color:#FF6A00}
.waitlist-form button{
  padding:16px 28px;
  background:linear-gradient(135deg,#FF6A00,#FF8533);
  border:none;border-radius:0 12px 12px 0;
  color:#fff;font-size:.9rem;font-weight:700;
  cursor:pointer;white-space:nowrap;
  transition:opacity .25s;
}
.waitlist-form button:hover{opacity:.9}

.hero-stores{display:flex;align-items:center;gap:12px;margin-top:8px}
.hero-stores img{height:42px;opacity:.7;transition:opacity .25s;cursor:pointer}
.hero-stores img:hover{opacity:1}
.hero-stores .coming-label{font-size:.75rem;color:#FF6A00;font-weight:600}

.hero-status{font-size:.8rem;color:#9CA3AF;margin-top:8px}

/* Hero phone mockup */
.hero-phone{
  flex:0 0 340px;position:relative;
}
.hero-phone img{
  width:100%;border-radius:32px;
  box-shadow:0 20px 60px rgba(0,0,0,.5);
}

/* Trending pill — bouncing */
.trending-pill{
  position:absolute;top:30px;left:-30px;
  display:flex;align-items:center;gap:8px;
  background:rgba(255,106,0,.95);
  padding:10px 18px;border-radius:50px;
  color:#fff;font-size:.8rem;font-weight:700;
  box-shadow:0 4px 20px rgba(255,106,0,.4);
  animation:bounce-pill 2s ease-in-out infinite;
  cursor:pointer;z-index:5;
  white-space:nowrap;
}
.trending-pill svg{width:16px;height:16px;fill:#fff}
@keyframes bounce-pill{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-10px)}
}

/* ---------- GENRES BAR ---------- */
.genres-bar{
  padding:30px 0;
  border-top:1px solid rgba(255,255,255,.05);
  border-bottom:1px solid rgba(255,255,255,.05);
  overflow:hidden;
}
.genres-track{
  display:flex;align-items:center;gap:50px;
  animation:scroll-genres 20s linear infinite;
}
.genres-track span{
  font-size:.95rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;
  color:rgba(255,255,255,.2);white-space:nowrap;
}
@keyframes scroll-genres{
  0%{transform:translateX(0)}
  100%{transform:translateX(-50%)}
}

/* ---------- FEATURES / BUILT FOR CULTURE ---------- */
.features-section{padding:100px 0}
.features-header{text-align:center;margin-bottom:60px}
.features-header h2{
  font-size:2.8rem;font-weight:800;color:#fff;margin-bottom:16px;
}
.features-header h2 em{font-style:italic;font-family:'Georgia','Times New Roman',serif}
.features-header p{font-size:1.05rem;color:#9CA3AF;max-width:640px;margin:0 auto;line-height:1.7}

.features-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:24px;
}
.feature-card{
  background:#141B27;
  border:1px solid rgba(255,255,255,.06);
  border-radius:20px;padding:36px 28px;
  position:relative;overflow:hidden;
  transition:transform .3s,border-color .3s;
}
.feature-card:hover{
  transform:translateY(-6px);
  border-color:rgba(255,106,0,.25);
}
.feature-card .card-badge{
  position:absolute;top:16px;right:16px;
  background:rgba(255,106,0,.15);color:#FF6A00;
  font-size:.65rem;font-weight:700;letter-spacing:1px;text-transform:uppercase;
  padding:4px 12px;border-radius:20px;
}
.feature-icon{
  width:52px;height:52px;border-radius:14px;
  background:rgba(255,106,0,.1);
  display:flex;align-items:center;justify-content:center;
  margin-bottom:20px;font-size:1.6rem;
}
.feature-card h3{font-size:1.2rem;font-weight:700;color:#fff;margin-bottom:10px}
.feature-card p{font-size:.95rem;color:#9CA3AF;line-height:1.6}

/* ---------- TRENDING NOW ---------- */
.trending-section{padding:100px 0}
.trending-header{
  display:flex;align-items:flex-end;justify-content:space-between;
  margin-bottom:40px;
}
.trending-header h2{font-size:2.2rem;font-weight:800;color:#fff}
.trending-header p{font-size:.95rem;color:#6B7280;margin-top:4px}
.trending-arrows{display:flex;gap:12px}
.trending-arrows button{
  width:44px;height:44px;border-radius:50%;
  border:1px solid rgba(255,255,255,.15);
  background:rgba(255,255,255,.05);
  color:#fff;font-size:1.1rem;
  cursor:pointer;transition:all .25s;
  display:flex;align-items:center;justify-content:center;
}
.trending-arrows button:hover{
  background:#FF6A00;border-color:#FF6A00;
}

.trending-track-wrapper{overflow:hidden;position:relative}
.trending-track{
  display:flex;gap:20px;
  transition:transform .45s ease;
}
.show-card{
  flex:0 0 220px;
  border-radius:16px;overflow:hidden;
  background:#141B27;
  border:1px solid rgba(255,255,255,.06);
  transition:transform .3s,border-color .3s;
  cursor:pointer;position:relative;
}
.show-card:hover{
  transform:translateY(-6px);
  border-color:rgba(255,106,0,.3);
}
.show-poster{
  width:100%;height:300px;
  position:relative;overflow:hidden;
}
.show-poster img{width:100%;height:100%;object-fit:cover}
.show-poster .poster-gradient{
  position:absolute;bottom:0;left:0;width:100%;height:50%;
  background:linear-gradient(transparent,#141B27);
}
.show-genre{
  position:absolute;top:12px;left:12px;
  background:rgba(255,106,0,.9);color:#fff;
  font-size:.65rem;font-weight:700;letter-spacing:.5px;text-transform:uppercase;
  padding:4px 10px;border-radius:6px;
}
.show-new{
  position:absolute;top:12px;right:12px;
  background:#22C55E;color:#fff;
  font-size:.6rem;font-weight:700;letter-spacing:.5px;text-transform:uppercase;
  padding:4px 8px;border-radius:6px;
}
.show-info{padding:16px}
.show-info h4{font-size:1rem;font-weight:700;color:#fff;margin-bottom:6px}
.show-meta{display:flex;align-items:center;gap:12px;font-size:.8rem;color:#6B7280}
.show-meta .rating{color:#FBBF24;font-weight:600}
.show-meta .rating svg{width:12px;height:12px;fill:#FBBF24;vertical-align:-1px;margin-right:2px}

/* ---------- COIN PACKS ---------- */
.coins-section{
  padding:100px 0;
  background:radial-gradient(ellipse at 50% 0%,rgba(255,106,0,.06) 0%,transparent 60%),#0B0F19;
}
.coins-header{text-align:center;margin-bottom:60px}
.coins-header h2{font-size:2.4rem;font-weight:800;color:#fff;margin-bottom:12px}
.coins-header p{font-size:1.05rem;color:#9CA3AF;max-width:560px;margin:0 auto}

.coins-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:20px;
}
.coin-card{
  background:#141B27;
  border:1px solid rgba(255,255,255,.06);
  border-radius:20px;padding:32px 24px;
  text-align:center;position:relative;
  transition:transform .3s,border-color .3s;
}
.coin-card:hover{
  transform:translateY(-6px);
  border-color:rgba(255,106,0,.25);
}
.coin-card.popular{
  border:2px solid #FF6A00;
  box-shadow:0 0 30px rgba(255,106,0,.15);
}
.coin-card .popular-tag{
  position:absolute;top:-14px;left:50%;transform:translateX(-50%);
  background:linear-gradient(135deg,#FF6A00,#FF8533);
  color:#fff;font-size:.7rem;font-weight:700;letter-spacing:.5px;text-transform:uppercase;
  padding:6px 18px;border-radius:20px;white-space:nowrap;
}
.coin-icon{
  width:64px;height:64px;border-radius:50%;
  margin:0 auto 20px;
  display:flex;align-items:center;justify-content:center;
  font-size:1.8rem;
}
.coin-icon.tier-1{background:rgba(255,106,0,.1)}
.coin-icon.tier-2{background:rgba(255,106,0,.15)}
.coin-icon.tier-3{background:rgba(255,106,0,.2)}
.coin-icon.tier-4{background:rgba(255,106,0,.25)}

.coin-card .tier-name{font-size:.75rem;color:#6B7280;font-weight:600;text-transform:uppercase;letter-spacing:1px;margin-bottom:4px}
.coin-card h3{font-size:1.3rem;font-weight:700;color:#fff;margin-bottom:4px}
.coin-card .coin-episodes{font-size:.85rem;color:#9CA3AF;margin-bottom:16px}
.coin-card .coin-price{font-size:2rem;font-weight:800;color:#fff;margin-bottom:20px}
.coin-card .coin-price small{font-size:.9rem;font-weight:400;color:#6B7280}
.coin-btn{
  width:100%;padding:14px 0;border:none;border-radius:12px;
  font-size:.9rem;font-weight:700;cursor:pointer;
  transition:all .25s;
}
.coin-btn.primary{
  background:linear-gradient(135deg,#FF6A00,#FF8533);color:#fff;
}
.coin-btn.primary:hover{opacity:.9;transform:scale(1.02)}
.coin-btn.secondary{
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.1);
  color:#fff;
}
.coin-btn.secondary:hover{
  background:rgba(255,106,0,.1);border-color:#FF6A00;color:#FF6A00;
}

/* ---------- WATCH ANYWHERE ---------- */
.watch-section{padding:100px 0}
.watch-section .container{display:flex;align-items:center;gap:60px}
.watch-text{flex:1}
.watch-text .coming-badge{
  display:inline-block;
  background:rgba(255,106,0,.12);border:1px solid rgba(255,106,0,.25);
  padding:6px 16px;border-radius:50px;
  font-size:.7rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;
  color:#FF6A00;margin-bottom:20px;
}
.watch-text h2{font-size:2.4rem;font-weight:800;color:#fff;margin-bottom:16px}
.watch-text p{font-size:1.05rem;color:#9CA3AF;line-height:1.7;margin-bottom:28px}
.watch-stores{display:flex;gap:14px;flex-wrap:wrap}
.watch-stores img{height:48px;cursor:pointer;opacity:.8;transition:opacity .25s}
.watch-stores img:hover{opacity:1}
.watch-phones{flex:0 0 260px;position:relative}
.watch-phones img{
  width:100%;border-radius:20px;
  box-shadow:0 20px 60px rgba(0,0,0,.4);
}

/* ---------- TESTIMONIALS ---------- */
.testimonials-section{
  padding:100px 0;
  background:radial-gradient(ellipse at 30% 50%,rgba(255,106,0,.04) 0%,transparent 50%),#0B0F19;
}
.testimonials-header{text-align:center;margin-bottom:60px}
.testimonials-header h2{font-size:2.2rem;font-weight:800;color:#fff;margin-bottom:12px}
.testimonials-header p{font-size:1rem;color:#9CA3AF}

.testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.testimonial-card{
  background:#141B27;border:1px solid rgba(255,255,255,.06);
  border-radius:20px;padding:32px 28px;
  transition:transform .3s,border-color .3s;
}
.testimonial-card:hover{
  transform:translateY(-4px);border-color:rgba(255,106,0,.2);
}
.testimonial-quote{
  font-size:2.5rem;line-height:1;color:rgba(255,106,0,.3);
  margin-bottom:12px;font-family:Georgia,serif;
}
.testimonial-card blockquote{
  font-size:.95rem;color:#D1D5DB;line-height:1.7;
  margin-bottom:20px;font-style:italic;
}
.testimonial-author{display:flex;align-items:center;gap:12px}
.testimonial-avatar{
  width:44px;height:44px;border-radius:50%;
  background:linear-gradient(135deg,#FF6A00,#FF8533);
  display:flex;align-items:center;justify-content:center;
  font-size:.9rem;font-weight:700;color:#fff;
}
.testimonial-name{font-size:.9rem;font-weight:600;color:#fff}
.testimonial-stars{color:#FBBF24;font-size:.8rem;margin-top:2px}

/* ---------- FAQ ---------- */
.faq-section{padding:100px 0}
.faq-header{text-align:center;margin-bottom:60px}
.faq-header h2{font-size:2.2rem;font-weight:800;color:#fff;margin-bottom:12px}
.faq-header p{font-size:1rem;color:#9CA3AF}

.faq-list{max-width:720px;margin:0 auto}
.faq-item{
  border:1px solid rgba(255,255,255,.06);
  border-radius:16px;margin-bottom:12px;
  overflow:hidden;background:#141B27;
  transition:border-color .3s;
}
.faq-item.active{border-color:rgba(255,106,0,.25)}
.faq-question{
  display:flex;align-items:center;justify-content:space-between;
  padding:20px 24px;cursor:pointer;
  font-size:1rem;font-weight:600;color:#fff;
  transition:color .25s;
}
.faq-question:hover{color:#FF6A00}
.faq-toggle{
  width:28px;height:28px;border-radius:50%;
  background:rgba(255,255,255,.05);
  display:flex;align-items:center;justify-content:center;
  font-size:1.2rem;color:#9CA3AF;
  transition:transform .3s,background .3s;
  flex-shrink:0;
}
.faq-item.active .faq-toggle{
  transform:rotate(45deg);background:rgba(255,106,0,.15);color:#FF6A00;
}
.faq-answer{
  max-height:0;overflow:hidden;
  transition:max-height .35s ease,padding .35s;
}
.faq-item.active .faq-answer{max-height:300px;padding:0 24px 20px}
.faq-answer p{font-size:.95rem;color:#9CA3AF;line-height:1.7}

/* ---------- FOOTER ---------- */
.site-footer{
  padding:60px 0 30px;
  border-top:1px solid rgba(255,255,255,.06);
  background:#080C14;
}
.footer-grid{
  display:grid;grid-template-columns:2fr 1fr 1fr 1.5fr;gap:40px;
  margin-bottom:40px;
}
.footer-brand .nav-brand{margin-bottom:12px}
.footer-brand p{font-size:.9rem;color:#6B7280;line-height:1.6;max-width:280px}

.footer-col h4{
  font-size:.8rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;
  color:rgba(255,255,255,.4);margin-bottom:16px;
}
.footer-col a{
  display:block;font-size:.9rem;color:#9CA3AF;
  margin-bottom:10px;transition:color .25s;
}
.footer-col a:hover{color:#FF6A00}

.footer-newsletter{display:flex;gap:0;margin-top:8px}
.footer-newsletter input{
  flex:1;padding:12px 14px;
  background:#141B27;border:1px solid rgba(255,255,255,.1);
  border-radius:10px 0 0 10px;
  color:#fff;font-size:.85rem;outline:none;
}
.footer-newsletter input::placeholder{color:#6B7280}
.footer-newsletter button{
  padding:12px 18px;
  background:#FF6A00;border:none;border-radius:0 10px 10px 0;
  color:#fff;font-size:.85rem;font-weight:700;cursor:pointer;
  transition:opacity .25s;
}
.footer-newsletter button:hover{opacity:.85}

.footer-social{display:flex;gap:16px;margin-top:16px}
.footer-social a{
  width:36px;height:36px;border-radius:50%;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);
  display:flex;align-items:center;justify-content:center;
  color:#9CA3AF;font-size:.9rem;transition:all .25s;
}
.footer-social a:hover{background:#FF6A00;border-color:#FF6A00;color:#fff}

.footer-bottom{
  display:flex;align-items:center;justify-content:space-between;
  padding-top:24px;border-top:1px solid rgba(255,255,255,.06);
  font-size:.8rem;color:#6B7280;
}
.footer-bottom-links{display:flex;gap:20px}
.footer-bottom-links a{color:#6B7280;transition:color .25s}
.footer-bottom-links a:hover{color:#FF6A00}

/* ---------- PAYMENT MODAL ---------- */
.modal{
  display:none;position:fixed;top:0;left:0;width:100%;height:100%;
  background:rgba(0,0,0,.7);
  justify-content:center;align-items:center;
  z-index:2000;backdrop-filter:blur(6px);
}
.modal-content{
  background:#1A2033;border:1px solid rgba(255,255,255,.1);
  border-radius:20px;padding:36px 32px;
  max-width:420px;width:90%;text-align:center;
  box-shadow:0 20px 60px rgba(0,0,0,.5);
}
.modal-content h3{font-size:1.2rem;font-weight:700;color:#fff;margin-bottom:20px}
.modal-content input{
  width:100%;padding:14px 16px;margin-bottom:12px;
  background:#141B27;border:1px solid rgba(255,255,255,.1);
  border-radius:10px;color:#fff;font-size:.95rem;outline:none;
}
.modal-content input::placeholder{color:#6B7280}
.modal-content input:focus{border-color:#FF6A00}
.modal-buttons{display:flex;gap:12px;margin-top:8px}
.modal-buttons button{
  flex:1;padding:14px;border:none;border-radius:10px;
  font-size:.9rem;font-weight:700;cursor:pointer;transition:opacity .25s;
}
.modal-buttons button:first-child{background:#FF6A00;color:#fff}
.modal-buttons button:first-child:hover{opacity:.85}
.modal-buttons button:last-child{
  background:rgba(255,255,255,.06);color:#9CA3AF;
  border:1px solid rgba(255,255,255,.1);
}
.modal-buttons button:last-child:hover{color:#fff}

/* ---------- PDF MODAL ---------- */
.pdf-modal{
  display:none;position:fixed;z-index:9999;top:0;left:0;width:100%;height:100%;
  background:rgba(0,0,0,.85);justify-content:center;align-items:center;
  backdrop-filter:blur(4px);
}
.pdf-modal-content{
  position:relative;width:90%;max-width:800px;height:85vh;
  background:#111;border-radius:10px;overflow:hidden;
  display:flex;flex-direction:column;
  animation:fadeIn .3s ease;box-shadow:0 0 25px rgba(0,0,0,.6);
}
.pdf-modal-content iframe{flex:1;width:100%;height:100%;border:none;background:#111}
.pdf-close{
  color:#fff;position:absolute;top:12px;right:18px;
  font-size:28px;font-weight:bold;cursor:pointer;z-index:10;
  text-shadow:0 2px 6px rgba(0,0,0,.8);transition:color .3s;
  background:none;border:none;
}
.pdf-close:hover{color:#FF4444}
@keyframes fadeIn{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}

/* ---------- MOBILE BOTTOM NAV ---------- */
.mobile-bottom-nav{
  display:none;
  position:fixed;bottom:0;left:0;width:100%;
  background:rgba(11,15,25,.97);
  border-top:1px solid rgba(255,255,255,.06);
  backdrop-filter:blur(12px);
  z-index:900;
  padding:8px 0 env(safe-area-inset-bottom,4px);
}
.mobile-bottom-nav ul{
  display:flex;justify-content:space-around;align-items:center;
  list-style:none;padding:0;margin:0;
}
.mobile-bottom-nav li{
  display:flex;flex-direction:column;align-items:center;gap:2px;
  padding:6px 12px;cursor:pointer;transition:color .25s;
  color:#6B7280;font-size:.65rem;font-weight:600;
}
.mobile-bottom-nav li.active{color:#FF6A00}
.mobile-bottom-nav li svg{width:22px;height:22px}

/* ========== RESPONSIVE ========== */

/* Tablet */
@media(max-width:1024px){
  .hero{padding:120px 0 80px;min-height:auto}
  .hero .container{flex-direction:column;text-align:center;gap:40px}
  .hero-text{max-width:100%}
  .hero-text h1{font-size:2.8rem}
  .hero-subtitle{text-align:left;display:inline-block}
  .waitlist-form{max-width:480px;margin:0 auto 20px}
  .hero-stores{justify-content:center}
  .hero-phone{flex:0 0 auto;width:280px;margin:0 auto}
  .trending-pill{left:50%;transform:translateX(-50%);top:-20px;animation:bounce-pill-mobile 2s ease-in-out infinite}
  @keyframes bounce-pill-mobile{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-10px)}}

  .features-grid{grid-template-columns:repeat(2,1fr)}
  .coins-grid{grid-template-columns:repeat(2,1fr)}
  .watch-section .container{flex-direction:column;text-align:center}
  .watch-text{text-align:center}
  .watch-stores{justify-content:center}
  .watch-phones{flex:0 0 auto;width:220px;margin:0 auto}
  .testimonials-grid{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:repeat(2,1fr)}
}

/* Mobile */
@media(max-width:768px){
  .nav-links{display:none}
  .nav-cta{display:none}
  .hamburger{display:flex}

  .hero{padding:100px 0 60px}
  .hero-text h1{font-size:2.2rem}
  .hero-subtitle{font-size:.95rem}
  .waitlist-form{flex-direction:column;gap:12px;border-radius:12px}
  .waitlist-form input{border-radius:12px;text-align:center}
  .waitlist-form button{border-radius:12px;width:100%}

  .features-grid{grid-template-columns:1fr}
  .features-header h2{font-size:2rem}

  .trending-header{flex-direction:column;align-items:flex-start;gap:16px}

  .coins-grid{grid-template-columns:1fr 1fr;gap:14px}
  .coins-header h2{font-size:1.8rem}

  .testimonials-grid{grid-template-columns:1fr}

  .footer-grid{grid-template-columns:1fr 1fr}

  .mobile-bottom-nav{display:block}
  body{padding-bottom:72px}

  .footer-bottom{flex-direction:column;gap:12px;text-align:center}
}

/* Small mobile */
@media(max-width:480px){
  .hero-text h1{font-size:1.8rem}
  .coins-grid{grid-template-columns:1fr}
  .hero-phone{width:240px}
  .footer-grid{grid-template-columns:1fr}
}