/* ==========================================================================
   OPERACAO TRAFEGO - tema FUTURISTA (dark-tech)
   Base charcoal + accent laranja unico. Glow controlado, hairlines, mono.
   ========================================================================== */

:root{
  --bg:        #060814;   /* deep space */
  --bg-2:      #0b1028;   /* banda alternativa */
  --surface:   #11163a;   /* cards (azul-roxo) */
  --surface-2: #191f4c;   /* hover / elevado */
  --line:      rgba(150,160,255,.13);
  --line-2:    rgba(150,160,255,.26);
  --text:      #F4F5FF;
  --text-mut:  #9aa0c6;
  --text-dim:  #6a6f95;
  --accent:    #4f8dff;   /* azul primario (Andromeda) */
  --accent-2:  #7db4ff;
  --glow:      rgba(79,141,255,.42);
  --purple:    #b06bff;   /* roxo nebulosa */
  --orange:    #F94E03;   /* spot Claude */
  --meta:      #3b9bff;   /* azul Meta */
  --radius:    16px;
  --radius-sm: 12px;
  --pill:      9999px;
  --maxw:      1180px;
  --sp:        clamp(100px, 11vw, 172px);
  --font:      'Poppins', system-ui, sans-serif;
  --display:   'Poppins', system-ui, sans-serif;
  --mono:      'JetBrains Mono', ui-monospace, monospace;
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  font-family:var(--font);
  color:var(--text);
  background:var(--bg);
  line-height:1.6;
  font-weight:400;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}
/* grid tenue + brilho superior global */
body::before{
  content:""; position:fixed; inset:0; z-index:-2; pointer-events:none;
  background:
    radial-gradient(1100px 800px at 22% 15%, rgba(120,90,255,.06), transparent 60%),
    linear-gradient(90deg, transparent 55%, rgba(6,8,20,.12) 74%, rgba(6,8,20,.4) 100%),
    linear-gradient(180deg, rgba(6,8,20,.1), rgba(6,8,20,.2));
}
.bg-globe{
  position:fixed; inset:0; z-index:-3; pointer-events:none;
  background:#04060f center/cover no-repeat;
}
.bg-globe.is-fallback{ background-image:url("assets/globe.webp"); background-size:auto 108%; }
.bg-globe canvas{
  display:block; width:100%; height:100%;
}
body::after{
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none; opacity:.28;
  background-image:
    radial-gradient(1.3px 1.3px at 12% 18%, rgba(255,255,255,.8), transparent),
    radial-gradient(1px 1px at 28% 42%, rgba(255,255,255,.5), transparent),
    radial-gradient(1.1px 1.1px at 44% 12%, rgba(255,255,255,.7), transparent),
    radial-gradient(1px 1px at 58% 30%, rgba(255,255,255,.5), transparent),
    radial-gradient(1.4px 1.4px at 72% 20%, rgba(255,255,255,.85), transparent),
    radial-gradient(1px 1px at 86% 44%, rgba(255,255,255,.5), transparent),
    radial-gradient(1.2px 1.2px at 18% 66%, rgba(255,255,255,.6), transparent),
    radial-gradient(1px 1px at 38% 82%, rgba(255,255,255,.5), transparent),
    radial-gradient(1.3px 1.3px at 64% 72%, rgba(255,255,255,.7), transparent),
    radial-gradient(1px 1px at 82% 86%, rgba(255,255,255,.45), transparent),
    radial-gradient(1.1px 1.1px at 92% 12%, rgba(255,255,255,.6), transparent),
    radial-gradient(1px 1px at 6% 90%, rgba(255,255,255,.5), transparent);
  background-repeat:no-repeat;
  mask-image:linear-gradient(180deg, #000 0%, rgba(0,0,0,.5) 55%, transparent 92%);
  -webkit-mask-image:linear-gradient(180deg, #000 0%, rgba(0,0,0,.5) 55%, transparent 92%);
}
/* efeito: estrelas piscando (segunda camada, fora de fase) */
.fx-stars{
  position:fixed; inset:0; z-index:-1; pointer-events:none;
  background-image:
    radial-gradient(1.5px 1.5px at 20% 24%, #fff, transparent),
    radial-gradient(1.2px 1.2px at 52% 16%, #fff, transparent),
    radial-gradient(1.6px 1.6px at 76% 32%, #fff, transparent),
    radial-gradient(1.3px 1.3px at 40% 52%, #fff, transparent),
    radial-gradient(1.5px 1.5px at 90% 60%, #fff, transparent),
    radial-gradient(1.2px 1.2px at 14% 70%, #fff, transparent),
    radial-gradient(1.5px 1.5px at 66% 82%, #fff, transparent),
    radial-gradient(1.2px 1.2px at 34% 90%, #fff, transparent),
    radial-gradient(1.3px 1.3px at 8% 40%, #fff, transparent),
    radial-gradient(1.2px 1.2px at 96% 24%, #fff, transparent);
  background-repeat:no-repeat;
  mask-image:linear-gradient(180deg, #000 0%, rgba(0,0,0,.5) 55%, transparent 92%);
  -webkit-mask-image:linear-gradient(180deg, #000 0%, rgba(0,0,0,.5) 55%, transparent 92%);
  opacity:.5;
}
/* efeito: meteoros caindo sobre o planeta, com a cabeca pegando fogo */
/* camada fixa: os meteoros caem sobre o planeta na pagina inteira, atras do conteudo */
.fx-meteors{ position:fixed; inset:0; z-index:-1; overflow:hidden; pointer-events:none; }
.meteor{
  position:absolute; top:var(--top,0); left:var(--left,50%);
  width:var(--len,200px); height:3px; border-radius:3px;
  /* rastro: frio na cauda, esquentando ate virar brasa na cabeca */
  background:linear-gradient(90deg,
    rgba(120,170,255,0) 0%,
    rgba(150,190,255,.42) 48%,
    rgba(214,228,255,.78) 74%,
    rgba(255,206,130,.92) 90%,
    #ffe6b0 100%);
  filter:drop-shadow(0 0 8px rgba(255,150,60,.55));
  transform:rotate(var(--rot,150deg));
  opacity:0;
  animation:meteor-fall var(--dur,12s) linear var(--delay,0s) infinite;
  will-change:transform, opacity;
}
/* labareda: fogo saindo da pedra para TRAS, no sentido contrario ao da viagem */
.meteor::before{
  content:""; position:absolute; right:-3px; top:50%; transform:translateY(-50%);
  transform-origin:100% 50%;              /* encolhe grudada na pedra */
  width:44px; height:13px;
  border-radius:58% 42% 42% 58% / 50% 50% 50% 50%;
  background:radial-gradient(ellipse 72% 100% at 90% 50%,
    rgba(255,242,175,.8) 0%,
    rgba(255,178,50,.5) 22%,
    rgba(244,96,12,.26) 46%,
    rgba(190,44,4,.09) 68%,
    rgba(160,30,2,0) 88%);
  filter:blur(1.3px);
  animation:
    queima-halo var(--dur,12s) linear var(--delay,0s) infinite,
    labareda 170ms linear infinite;
}
/* cabeca: pedra em brasa - silhueta angular, borda chamuscada, nucleo quente */
.meteor::after{
  content:""; position:absolute; right:-5px; top:50%; transform:translateY(-50%);
  width:11px; height:10px;
  /* recorte irregular: da o contorno de pedra, nao de bola */
  clip-path:polygon(48% 0%, 78% 9%, 96% 33%, 92% 66%, 70% 92%, 40% 100%, 14% 82%, 2% 52%, 10% 20%, 26% 6%);
  background:radial-gradient(circle at 64% 30%,
    #fffdf2 0%, #ffe08a 18%, #ffab30 40%, #f2700d 62%, #b23a04 82%, #5c1a01 100%);
  /* drop-shadow acompanha o recorte; box-shadow seria cortado pelo clip-path */
  filter:
    drop-shadow(0 0 3px rgba(255,200,100,.95))
    drop-shadow(0 0 9px rgba(255,120,25,.6))
    drop-shadow(0 0 18px rgba(226,66,8,.32));
  animation:
    queima-pedra var(--dur,12s) linear var(--delay,0s) infinite,
    tremula-pedra 260ms ease-in-out infinite;
}
/* a pedra gira e vai encolhendo ate sumir, como se estivesse queimando */
@keyframes queima-pedra{
  0%,4%    { transform:translateY(-50%) rotate(0deg) scale(1); }
  44%,100% { transform:translateY(-50%) rotate(210deg) scale(.12); }
}
@keyframes queima-halo{
  0%,4%    { transform:translateY(-50%) scale(1); }
  44%,100% { transform:translateY(-50%) scale(.08); }
}
/* tremulacao do fogo: so opacidade, para nao brigar com o encolhimento */
@keyframes tremula-pedra{
  0%,100%{ opacity:1; }
  50%    { opacity:.85; }
}
/* crepitar da labareda: variacao irregular, so opacidade */
@keyframes labareda{
  0%  { opacity:1; }
  25% { opacity:.68; }
  50% { opacity:.95; }
  75% { opacity:.6; }
  100%{ opacity:.86; }
}
@keyframes meteor-fall{
  0%{ transform:translate(0,0) rotate(var(--rot,150deg)); opacity:0; }
  4%{ opacity:1; }
  26%{ opacity:.92; }
  38%{ opacity:.5; }
  44%{ transform:translate(var(--dx,-520px), var(--dy,320px)) rotate(var(--rot,150deg)); opacity:0; }
  100%{ transform:translate(var(--dx,-520px), var(--dy,320px)) rotate(var(--rot,150deg)); opacity:0; }
}
@media (prefers-reduced-motion:reduce){ .fx-meteors{ display:none; } }
img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; border:none; background:none; }

/* ---------- layout ---------- */
.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:24px; position:relative; }
.section{ padding-block:var(--sp); position:relative; }
.bg-cream, .bg-black{ background:transparent; }
.bg-white, .bg-cream2{
  background:linear-gradient(180deg, rgba(120,160,255,.035), transparent 70%);
}
/* globo transparece atras do conteudo: pelicula bem leve, so pra leitura */
.section:not(.hero), .footer{ background-color:rgba(6,8,20,.34); }
/* transicao longa do hero (globo) para o conteudo, sem vinco */
.hero + .section{ background-image:linear-gradient(180deg, rgba(6,8,20,0) 0%, rgba(6,8,20,.34) 300px); background-color:transparent; }
/* protege textos que ficam sobre o globo */
.section:not(.hero) .h2, .section:not(.hero) .lead, .section:not(.hero) .eyebrow,
.section:not(.hero) .h3, .section:not(.hero) .big, .section:not(.hero) .role{ text-shadow:0 2px 20px rgba(4,6,15,.9); }

/* ---------- typography ---------- */
.eyebrow{
  font-family:var(--mono); font-weight:500; font-size:.74rem; letter-spacing:.22em;
  text-transform:uppercase; color:var(--accent); margin-bottom:18px;
  display:inline-flex; align-items:center; gap:10px;
}
.eyebrow::before{ content:""; width:24px; height:1px; background:var(--accent); opacity:.7; }
h1,h2,h3{ font-family:var(--display); font-weight:600; line-height:1.08; letter-spacing:-0.02em; color:var(--text); }
.h1{ font-size:clamp(2rem, 4.4vw, 3.05rem); font-weight:300; letter-spacing:-0.01em; }
.h1 .accent, .h1 .meta-accent{ font-weight:700; }
.h2{ font-size:clamp(1.6rem, 3.2vw, 2.35rem); }
.h3{ font-size:clamp(1.1rem, 1.8vw, 1.32rem); }
.lead{ font-size:clamp(1rem, 1.2vw, 1.12rem); color:var(--text-mut); font-weight:400; }
.center{ text-align:center; }
.section-head{ max-width:700px; margin-inline:auto; margin-bottom:84px; }
.meta-accent{ color:var(--meta); }
.brand-logo{ width:20px; height:20px; flex:0 0 auto; }

/* ---------- buttons (futurista) ---------- */
.btn{
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:9px;
  font-family:var(--display); font-weight:600; font-size:.95rem; letter-spacing:.015em;
  padding:15px 30px; border-radius:var(--pill); color:#F87000;
  background:transparent;
  border:2px solid #F87000;
  box-shadow:0 0 24px -10px rgba(248,112,0,.55);
  transition:transform .2s cubic-bezier(.16,1,.3,1), box-shadow .28s ease, background-color .22s ease, color .2s ease;
  text-align:center; line-height:1.15;
}
.btn:hover{
  transform:translateY(-2px);
  background:rgba(248,112,0,.12);
  box-shadow:0 0 0 1px rgba(248,112,0,.55), 0 16px 38px -14px rgba(248,112,0,.6);
}
.btn:active{ transform:translateY(0); }
.btn svg{ transition:transform .2s ease; }
.btn:hover svg{ transform:translateX(3px); }
.btn--sm{ padding:11px 20px; font-size:.85rem; border-radius:11px; }
.btn--ghost{
  background:transparent; color:var(--text); border:1px solid var(--line-2);
  box-shadow:none;
}
.btn--ghost:hover{
  border-color:var(--accent); color:#fff;
  box-shadow:0 0 0 1px var(--accent), 0 10px 30px -12px var(--glow);
}
.btn--block{ width:100%; }

/* ---------- header ---------- */
.header{
  position:sticky; top:0; z-index:50;
  background:rgba(7,11,22,.74); backdrop-filter:saturate(140%) blur(14px);
  border-bottom:1px solid var(--line);
}
.header .wrap{ display:flex; align-items:center; justify-content:space-between; padding-block:15px; }
.brand{ font-family:var(--display); font-weight:700; font-size:1.1rem; letter-spacing:.01em; display:flex; align-items:center; gap:10px; white-space:nowrap; }
.brand .dot{ width:11px; height:11px; border-radius:50%; background:var(--accent); box-shadow:0 0 12px 1px var(--glow); }
.brand b{ color:var(--accent); }
.header-cta{ display:flex; align-items:center; gap:16px; }
.header-price{ font-family:var(--mono); font-weight:500; font-size:.85rem; color:var(--text-mut); }
.header-price s{ color:var(--text-dim); margin-right:6px; }

/* ---------- hero ---------- */
.hero{
  position:relative;
  padding:36px 0 clamp(56px,7vw,100px);
}
.hero > .wrap{ position:relative; z-index:3; }
.hero-photo{ display:none; }
.hero .h1, .hero-sub{ text-shadow:0 2px 18px rgba(2,4,12,.6), 0 1px 3px rgba(2,4,12,.45); }
.hero .accent, .hero .meta-accent, .hero-sub .meta-accent{ text-shadow:none; }
/* capa sem foto: coluna unica, conteudo centralizado */
.hero-grid{ display:block; }
.hero-copy{ max-width:840px; margin:0 auto; text-align:center; }
.hero-badge{
  display:inline-flex; align-items:center; gap:9px; font-family:var(--mono); font-weight:500; font-size:.78rem;
  color:var(--text-mut); background:var(--surface); border:1px solid var(--line-2); border-radius:var(--pill);
  padding:8px 16px; margin-bottom:26px;
}
.hero-badge svg{ color:var(--accent); }
.header-badge{ margin-bottom:0; }
/* Instagram no cabecalho (link) */
.ig-badge{ text-decoration:none; transition:border-color .2s ease, color .2s ease, background-color .2s ease; }
.ig-badge:hover{ color:var(--text); border-color:var(--accent); background:rgba(249,78,3,.08); }
.ig-badge svg{ color:var(--accent); }
/* badge do aulao acima do CTA */
.cta-badge{ margin-top:2px; margin-bottom:16px; }

/* lockup de ferramentas: imagem Claude Code -> Meta (preto some no navy) */
.lockup-img{ width:min(340px, 80%); height:auto; display:block; margin:-6px auto 20px auto; }
@media (max-width:600px){ .lockup-img{ width:min(300px, 90%); } }
.hero h1{ margin-bottom:22px; }
.hero .accent{ background:linear-gradient(90deg,#6aa0ff 0%,#38dcff 100%); -webkit-background-clip:text; background-clip:text; color:transparent; }
.meta-accent{ background:linear-gradient(90deg,#4f9dff,#8f6bff); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hero-sub{ font-size:1.1rem; color:var(--text-mut); max-width:580px; margin:0 auto 32px; line-height:1.7; }
.hero-meta{ display:flex; flex-wrap:wrap; justify-content:center; gap:12px 26px; margin:28px 0 34px; font-weight:500; font-size:.9rem; color:var(--text-mut); }
.hero-meta span{ display:inline-flex; align-items:center; gap:8px; }
.hero-actions{ display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:18px; }
.hero-note{ font-family:var(--mono); font-size:.8rem; color:var(--text-dim); }

/* countdown */
.countdown{ display:flex; gap:10px; margin-top:26px; align-items:flex-end; }
.cd-box{
  background:var(--surface); color:var(--text); border:1px solid var(--line-2);
  border-radius:var(--radius-sm); box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
  min-width:66px; padding:11px 6px; text-align:center;
}
.cd-box b{ font-family:var(--mono); font-size:1.7rem; font-weight:700; display:block; line-height:1; color:#fff; }
.cd-box small{ font-family:var(--mono); font-size:.6rem; text-transform:uppercase; letter-spacing:.14em; color:var(--text-dim); }
.cd-label{ font-weight:600; font-size:.8rem; color:var(--accent); align-self:center; }

/* scarcity */
.scarcity{ max-width:520px; margin:0 auto 28px; }
.scarcity-top{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; font-weight:600; font-size:.88rem; margin-bottom:9px; color:var(--text); }
.scarcity-top .pct{ font-family:var(--mono); color:var(--accent); font-size:1.05rem; }
.scarcity-track{ height:12px; border-radius:var(--pill); background:rgba(255,255,255,.07); border:1px solid var(--line); overflow:hidden; }
.scarcity-fill{ height:100%; width:87%; border-radius:var(--pill); background:linear-gradient(90deg,var(--accent),var(--accent-2)); box-shadow:0 0 14px 0 var(--glow); }
.scarcity-note{ font-family:var(--mono); font-size:.76rem; color:var(--text-dim); margin-top:9px; }

/* lote timer */
.lote-timer{
  display:inline-flex; align-items:center; gap:10px; margin-top:16px;
  background:var(--surface); border:1px solid var(--line-2); border-radius:var(--pill);
  padding:11px 20px; font-weight:600; font-size:.92rem; color:var(--text);
}
.lote-timer .dot{ width:8px; height:8px; border-radius:50%; background:var(--accent); box-shadow:0 0 10px 1px var(--glow); flex:0 0 auto; }
.lote-timer .lt-nums{ font-family:var(--mono); color:var(--accent); letter-spacing:.03em; }
.lote-timer .lt-nums b{ font-weight:700; }
.lote-timer .lt-nums small{ font-size:.72em; font-weight:500; }

/* hero photo */
.hero-photo{
  position:relative; background:transparent; border:none; box-shadow:none;
  border-radius:0; overflow:visible; aspect-ratio:1/1;
}
.hero-photo::after{ display:none; }
.hero-photo img{
  width:100%; height:100%; object-fit:cover; object-position:66% 26%; display:block;
  -webkit-mask-image:radial-gradient(80% 86% at 60% 40%, #000 34%, rgba(0,0,0,0) 80%);
  mask-image:radial-gradient(80% 86% at 60% 40%, #000 34%, rgba(0,0,0,0) 80%);
}
.photo-fallback{
  position:absolute; inset:0; display:none; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; color:var(--text-mut); gap:10px; padding:24px;
}
.photo-fallback.show{ display:flex; }
.photo-fallback .ring{ width:74px; height:74px; border-radius:50%; border:1px solid var(--accent); display:grid; place-items:center; color:var(--accent); box-shadow:0 0 24px -4px var(--glow); }
.photo-fallback b{ color:#fff; font-size:1.05rem; font-family:var(--display); }
.photo-tag{
  position:absolute; left:16px; bottom:16px; z-index:2;
  background:rgba(10,11,14,.7); backdrop-filter:blur(8px); color:#fff;
  border:1px solid var(--line-2); border-radius:var(--pill); padding:7px 15px;
  font-family:var(--mono); font-weight:500; font-size:.76rem;
}

/* ---------- comparison ---------- */
.compare{ display:grid; grid-template-columns:1fr 1fr; gap:32px; }
.compare-col{ border:1px solid var(--line); border-radius:var(--radius); padding:40px; background:var(--surface); box-shadow:inset 0 1px 0 rgba(255,255,255,.04); }
.compare-col.win{ background:linear-gradient(180deg, rgba(249,78,3,.09), var(--surface)); border-color:rgba(249,78,3,.4); box-shadow:0 20px 50px -24px var(--glow), inset 0 1px 0 rgba(255,255,255,.06); }
.compare-col h3{ margin-bottom:22px; font-size:1.15rem; display:flex; align-items:center; gap:9px; }
.compare-col.bad h3{ color:var(--text-mut); }
.cmp-list{ list-style:none; display:flex; flex-direction:column; gap:15px; }
.cmp-list li{ display:flex; gap:12px; align-items:flex-start; font-weight:400; color:var(--text-mut); }
.win .cmp-list li{ color:var(--text); }
.cmp-ico{ flex:0 0 22px; margin-top:1px; }
.bad .cmp-ico{ color:var(--text-dim); }
.win .cmp-ico{ color:var(--accent); }

/* ---------- modulos (cards do conteudo) ---------- */
.modules{ display:grid; grid-template-columns:repeat(4, 1fr); gap:26px; }
.module-card{
  display:flex; flex-direction:column; overflow:hidden;
  border:1px solid var(--line); border-radius:var(--radius);
  background:var(--surface); box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  transition:transform .28s cubic-bezier(.16,1,.3,1), border-color .28s ease, box-shadow .28s ease;
}
.module-card:hover{
  transform:translateY(-6px);
  border-color:color-mix(in srgb, var(--mc) 60%, var(--line));
  box-shadow:0 26px 54px -28px var(--mc), inset 0 1px 0 rgba(255,255,255,.06);
}
.mc-cover{
  position:relative; aspect-ratio:1 / 1;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px;
  border-bottom:2px solid var(--mc);
  background:
    radial-gradient(130% 80% at 50% 4%, color-mix(in srgb, var(--mc) 45%, transparent), transparent 68%),
    linear-gradient(180deg, color-mix(in srgb, var(--mc) 20%, #0a1030), #070b1c);
}
.mc-num{
  position:absolute; top:14px; left:16px; font-family:var(--mono); font-size:.78rem;
  letter-spacing:.16em; color:color-mix(in srgb, var(--mc) 75%, #ffffff);
}
.mc-ico{
  width:60px; height:60px; display:grid; place-items:center; color:#fff; border-radius:16px;
  border:1px solid color-mix(in srgb, var(--mc) 60%, transparent);
  background:color-mix(in srgb, var(--mc) 18%, transparent);
  box-shadow:0 0 34px -6px var(--mc);
}
.mc-cover-title{
  font-family:var(--display); font-weight:800; font-size:1.5rem; letter-spacing:.01em; color:#fff;
  text-shadow:0 2px 22px color-mix(in srgb, var(--mc) 65%, transparent);
}
.mc-logo{
  display:inline-flex; align-items:center; gap:7px; margin-top:-4px;
  padding:5px 12px; border-radius:999px;
  background:rgba(0,0,0,.28); border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(2px);
}
.mc-logo img{ width:19px; height:19px; display:block; }
.mc-logo span{ font-weight:600; font-size:.92rem; color:#eef1f8; letter-spacing:.01em; }
/* selo com duas marcas (Meta + TikTok) */
.mc-logo--duo{ gap:5px; padding:5px 11px; }
.mc-logo--duo img{ width:17px; height:17px; }
.mc-logo--duo span{ font-size:.82rem; margin-left:2px; }
.mc-body{ padding:22px 22px 26px; }
.mc-label{
  font-family:var(--mono); font-size:.72rem; letter-spacing:.15em; text-transform:uppercase;
  color:var(--text-mut); margin-bottom:16px;
}
.mc-label b{ color:var(--mc); font-weight:600; }
.mc-list{ list-style:none; display:flex; flex-direction:column; gap:11px; }
.mc-list li{
  position:relative; padding-left:28px; font-size:.95rem; line-height:1.45; color:var(--text);
}
.mc-list li::before{
  content:""; position:absolute; left:0; top:2px; width:18px; height:18px; background:var(--mc);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat;
}
@media (max-width:1000px){ .modules{ grid-template-columns:repeat(2, 1fr); gap:22px; } }
@media (max-width:560px){ .modules{ grid-template-columns:1fr; } .mc-cover{ aspect-ratio:16 / 9; } }

/* ---------- prova social (mural de conversas) ---------- */
.testi{ overflow-x:clip; }
.testi .section-head{ max-width:820px; margin-bottom:52px; }
.o-accent{ color:#F87000; }
.testi-marquee{
  width:100vw; margin-left:calc(50% - 50vw);
  display:flex; flex-direction:column; gap:20px; padding:14px 0 4px;
  -webkit-mask-image:linear-gradient(to right, transparent 0, #000 6%, #000 94%, transparent 100%);
  mask-image:linear-gradient(to right, transparent 0, #000 6%, #000 94%, transparent 100%);
}
.testi-track{ display:flex; align-items:flex-start; width:max-content; }
.track-left{ animation:marq-l 62s linear infinite; }
.track-right{ animation:marq-r 68s linear infinite; }
.testi-marquee:hover .testi-track{ animation-play-state:paused; }
@keyframes marq-l{ from{ transform:translate3d(0,0,0); } to{ transform:translate3d(-50%,0,0); } }
@keyframes marq-r{ from{ transform:translate3d(-50%,0,0); } to{ transform:translate3d(0,0,0); } }
@media (prefers-reduced-motion:reduce){ .testi-track{ animation:none; } }

/* card = recorte de tela de chat (estilo Discord) */
.tcard{
  position:relative; flex:0 0 228px; width:228px; margin-right:12px;
  background:#2b2d31; border:1px solid rgba(255,255,255,.06); border-radius:10px;
  padding:10px 12px 11px; box-shadow:0 10px 26px -18px rgba(0,0,0,.75);
}
/* variante fundo branco */
.tcard.light{ background:#fff; border-color:rgba(0,0,0,.08); box-shadow:0 16px 34px -18px rgba(0,0,0,.5); }
.tcard.light .tc-text{ color:#33363d; }
.tcard.light .tc-time{ color:#8a9099; }
.tcard.light .tc-tools{ background:#eef0f2; border-color:rgba(0,0,0,.1); box-shadow:0 4px 12px -4px rgba(0,0,0,.22); }
.tcard.light .tc-tools svg{ color:#8a9099; }
.tcard.light .tc-tools svg:hover{ background:rgba(0,0,0,.05); color:#54565b; }
.tcard.light .tc-react{ background:#f0f2f5; border-color:rgba(0,0,0,.08); color:#54565b; }
/* variante cortada reto embaixo (print recortado) */
.tcard.cut{ border-bottom-left-radius:0; border-bottom-right-radius:0; padding-bottom:0; }
.tcard.cut .tc-text{ max-height:2.7em; overflow:hidden; }
.tcard.cut .tc-react{ display:none; }
.tc-tools{
  position:absolute; top:-12px; right:12px; z-index:2;
  display:flex; align-items:center; gap:0;
  background:#1e1f22; border:1px solid rgba(255,255,255,.08); border-radius:8px;
  box-shadow:0 4px 12px -4px rgba(0,0,0,.6); padding:1px;
}
.tc-tools svg{ width:27px; height:27px; padding:5px; color:#b5bac1; border-radius:5px; }
.tc-tools svg:hover{ background:rgba(255,255,255,.06); color:#dbdee1; }
.tc-row{ display:flex; gap:9px; }
.tc-row.noav{ padding-left:0; }
.tc-av{
  width:29px; height:29px; flex:0 0 29px; border-radius:50%;
  object-fit:cover; display:block; background:#3a3d44;
}
.tc-content{ min-width:0; flex:1; }
.tc-line{ display:flex; align-items:baseline; gap:6px; margin-bottom:2px; flex-wrap:wrap; }
.tc-name{ font-weight:600; font-size:.8rem; color:var(--nc,#e67ec2); }
.tc-time{ font-family:var(--mono); font-size:.6rem; color:#949ba4; }
.tc-text{ font-size:.775rem; color:#dbdee1; line-height:1.46; }
.tc-react{
  display:inline-flex; align-items:center; gap:4px; margin-top:7px;
  font-size:.68rem; font-weight:600; color:#c9d0e0;
  background:rgba(88,101,242,.15); border:1px solid rgba(120,130,255,.42); border-radius:6px; padding:1px 7px;
}
.tc-react svg{ width:12px; height:12px; color:#ff5a6a; }
@media (max-width:640px){ .tcard{ flex-basis:200px; width:200px; margin-right:10px; } }

/* ---------- benefits ---------- */
.benefits{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:22px; margin-top:8px; }
.benefit{
  display:flex; gap:14px; align-items:center;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
  padding:26px 24px; transition:transform .25s cubic-bezier(.16,1,.3,1), border-color .25s ease, box-shadow .25s ease;
}
.benefit:hover{ transform:translateY(-4px); border-color:rgba(249,78,3,.45); box-shadow:0 22px 44px -26px var(--glow); }
.benefit .b-ico{
  flex:0 0 40px; width:40px; height:40px; border-radius:11px; display:grid; place-items:center;
  background:rgba(249,78,3,.12); color:var(--accent); border:1px solid rgba(249,78,3,.3);
}
.benefit b{ font-size:.98rem; font-weight:600; }

/* ---------- placeholders / chat ---------- */
.ph-row{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:26px; }
.ph-card{
  border:1px dashed var(--line-2); border-radius:var(--radius); padding:30px; background:var(--surface);
  display:flex; flex-direction:column; gap:14px; min-height:190px;
}
.ph-badge{ font-family:var(--mono); font-size:.7rem; font-weight:500; letter-spacing:.1em; text-transform:uppercase; color:var(--accent); }
.ph-stars{ color:var(--accent); display:flex; gap:3px; }
.ph-lines span{ display:block; height:9px; border-radius:6px; background:rgba(255,255,255,.09); margin-bottom:9px; }
.ph-lines span:nth-child(2){ width:88%; } .ph-lines span:nth-child(3){ width:70%; }
.ph-user{ display:flex; align-items:center; gap:10px; margin-top:auto; color:var(--text-mut); font-weight:500; font-size:.9rem; }
.ph-avatar{ width:36px; height:36px; border-radius:50%; background:var(--surface-2); border:1px solid var(--line-2); }

.chat{ max-width:720px; margin-inline:auto; display:flex; flex-direction:column; gap:14px; }
.bubble{
  align-self:flex-start; max-width:78%; background:var(--surface); border:1px solid var(--line);
  border-radius:16px 16px 16px 4px; padding:14px 18px; font-weight:400; color:var(--text);
}
.bubble.alt{ align-self:flex-end; background:linear-gradient(180deg, rgba(249,78,3,.16), rgba(249,78,3,.06)); border-color:rgba(249,78,3,.4); border-radius:16px 16px 4px 16px; }
.bubble small{ display:block; font-family:var(--mono); font-size:.7rem; color:var(--text-dim); margin-top:6px; }

/* ---------- market proof ---------- */
.proof{ max-width:860px; margin-inline:auto; text-align:center; }
.proof .big{ font-family:var(--display); font-size:clamp(1.5rem,3.2vw,2.4rem); font-weight:600; line-height:1.2; margin-bottom:26px; letter-spacing:-0.015em; }
.proof .big em{ color:var(--accent); font-style:normal; }

/* ---------- program ---------- */
.days{ display:grid; grid-template-columns:1fr 1fr; gap:32px; }
.day{ border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); overflow:hidden; box-shadow:inset 0 1px 0 rgba(255,255,255,.04); }
.day-head{ background:linear-gradient(180deg, rgba(249,78,3,.1), transparent); padding:24px 26px; border-bottom:1px solid var(--line); }
.day-head .tag{ font-family:var(--mono); color:var(--accent); font-weight:500; font-size:.76rem; letter-spacing:.12em; text-transform:uppercase; }
.day-head h3{ font-size:1.3rem; margin-top:8px; }
.day-head span{ font-family:var(--mono); font-size:.82rem; color:var(--text-mut); }
.day ol{ list-style:none; counter-reset:d; padding:12px 26px 30px; }
.day ol li{ counter-increment:d; display:flex; gap:16px; padding:14px 0; border-bottom:1px solid var(--line); font-weight:400; color:var(--text-mut); align-items:flex-start; }
.day ol li:last-child{ border-bottom:none; }
.day ol li::before{ content:counter(d,decimal-leading-zero); font-family:var(--mono); font-weight:500; color:var(--accent); flex:0 0 auto; font-size:.82rem; padding-top:2px; }

/* ---------- topics ---------- */
.topics{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.topic{ border:1px solid var(--line); border-radius:var(--radius); padding:36px 30px; background:var(--surface); transition:transform .25s cubic-bezier(.16,1,.3,1), border-color .25s ease, box-shadow .25s ease; }
.topic:hover{ transform:translateY(-5px); border-color:rgba(249,78,3,.4); box-shadow:0 26px 50px -28px var(--glow); }
.topic .t-ico{ width:46px; height:46px; border-radius:12px; background:rgba(249,78,3,.12); color:var(--accent); display:grid; place-items:center; border:1px solid rgba(249,78,3,.3); margin-bottom:20px; }
.topic h3{ font-size:1.1rem; margin-bottom:10px; }
.topic p{ color:var(--text-mut); font-weight:400; font-size:.95rem; }
.metric-chip{ display:inline-flex; gap:12px; margin-top:18px; font-family:var(--mono); font-size:.8rem; background:var(--bg); color:var(--text-mut); border:1px solid var(--line-2); border-radius:10px; padding:9px 14px; }
.metric-chip b{ color:var(--accent); }

/* ---------- personas ---------- */
.personas{ display:grid; grid-template-columns:1fr 1fr; gap:26px; }
.persona{ display:flex; gap:18px; align-items:flex-start; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:32px; transition:border-color .25s ease, transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s ease; }
.persona:hover{ border-color:rgba(249,78,3,.4); transform:translateY(-4px); box-shadow:0 24px 46px -28px var(--glow); }
.persona .p-ico{ flex:0 0 52px; width:52px; height:52px; border-radius:13px; background:rgba(249,78,3,.12); color:var(--accent); display:grid; place-items:center; border:1px solid rgba(249,78,3,.3); }
.persona h3{ font-size:1.05rem; margin-bottom:6px; }
.persona p{ color:var(--text-mut); font-weight:400; font-size:.94rem; }

/* ---------- pricing ---------- */
.price-card{
  max-width:560px; margin-inline:auto; position:relative;
  background:linear-gradient(180deg, var(--surface-2), var(--surface));
  border:1px solid var(--line-2); border-radius:24px;
  box-shadow:0 40px 90px -40px var(--glow), inset 0 1px 0 rgba(255,255,255,.06);
  padding:46px 40px; text-align:center; overflow:hidden;
}
.price-card::before{ content:""; position:absolute; top:0; left:0; right:0; height:1px; background:linear-gradient(90deg, transparent, var(--accent), transparent); }
.price-card .tag{ display:inline-block; font-family:var(--mono); background:rgba(249,78,3,.14); color:var(--accent); border:1px solid rgba(249,78,3,.4); border-radius:var(--pill); padding:6px 16px; font-weight:500; font-size:.74rem; letter-spacing:.1em; text-transform:uppercase; margin-bottom:22px; }
.price-old{ font-family:var(--mono); color:var(--text-dim); text-decoration:line-through; font-size:1.05rem; }
.price-now{ font-family:var(--display); font-size:clamp(3rem,7vw,4.4rem); font-weight:700; line-height:1; margin:6px 0 4px; color:#fff; }
.price-now sup{ font-size:1.4rem; top:-1.4em; margin-right:4px; color:var(--accent); }
.price-sub{ color:var(--text-mut); font-weight:400; margin-bottom:26px; }
.price-includes{ list-style:none; text-align:left; display:flex; flex-direction:column; gap:13px; margin:26px 0; }
.price-includes li{ display:flex; gap:11px; font-weight:400; color:var(--text); }
.price-includes .cmp-ico{ color:var(--accent); }
.price-pay{ display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin-top:18px; font-family:var(--mono); color:var(--text-dim); font-weight:400; font-size:.82rem; }
.guarantee{ display:inline-flex; align-items:center; gap:10px; margin-top:20px; font-weight:500; font-size:.9rem; color:var(--text-mut); }

/* ---------- mentor ---------- */
.mentor-grid{ display:grid; grid-template-columns:.85fr 1.15fr; gap:52px; align-items:center; }
.mentor-photo{ position:relative; border:1px solid var(--line-2); border-radius:22px; box-shadow:0 30px 70px -30px rgba(0,0,0,.8), inset 0 0 0 1px rgba(249,78,3,.16); overflow:hidden; aspect-ratio:1/1; background:radial-gradient(120% 120% at 60% 15%, #241a2f 0%, #140f20 45%, #0a0712 100%); }
.mentor-photo img{ width:100%; height:100%; object-fit:cover; object-position:center 22%; }
.mentor h2{ margin-bottom:6px; }
.mentor .role{ font-family:var(--mono); color:var(--accent); font-weight:500; font-size:.92rem; margin-bottom:20px; }
.mentor p{ color:var(--text-mut); font-weight:400; margin-bottom:16px; }
.mentor .todo-note{ font-family:var(--mono); font-size:.8rem; color:var(--accent); border-left:2px solid var(--accent); padding-left:12px; }

/* ---------- requirements ---------- */
.reqs{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:22px; counter-reset:r; }
.req{ border:1px solid var(--line); border-radius:var(--radius); padding:30px 26px; background:var(--surface); counter-increment:r; }
.req::before{ content:counter(r,decimal-leading-zero); font-family:var(--mono); font-weight:500; font-size:1.3rem; color:var(--accent); display:block; margin-bottom:12px; }
.req b{ display:block; font-size:1rem; font-weight:600; margin-bottom:6px; }
.req span{ color:var(--text-mut); font-size:.9rem; font-weight:400; }

/* ---------- faq ---------- */
.faq{ max-width:780px; margin-inline:auto; }
.faq-item{ border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); margin-bottom:12px; overflow:hidden; transition:border-color .2s ease; }
.faq-item.open{ border-color:rgba(249,78,3,.4); }
.faq-q{ width:100%; text-align:left; display:flex; justify-content:space-between; align-items:center; gap:16px; padding:20px 24px; font-family:var(--display); font-weight:600; font-size:1rem; color:var(--text); }
.faq-q .chev{ flex:0 0 auto; transition:transform .25s ease; color:var(--accent); }
.faq-item.open .chev{ transform:rotate(180deg); }
.faq-a{ max-height:0; overflow:hidden; transition:max-height .3s ease; }
.faq-a p{ padding:0 24px 22px; color:var(--text-mut); font-weight:400; }

/* ---------- final ---------- */
.final{ text-align:center; }
.final h2{ max-width:820px; margin:0 auto 20px; }
.final .lead{ max-width:620px; margin:0 auto 34px; }

/* ---------- footer ---------- */
.footer{ padding-block:52px; text-align:center; border-top:1px solid var(--line); }
.footer .brand{ justify-content:center; margin-bottom:16px; }
.footer p{ color:var(--text-mut); font-size:.86rem; margin-bottom:8px; }
.footer .legal{ font-family:var(--mono); font-size:.78rem; color:var(--text-dim); }
.footer a{ color:var(--text-mut); font-weight:500; }
.footer .links{ margin-top:12px; display:flex; gap:14px; justify-content:center; }

/* ---------- reveal ---------- */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .6s ease, transform .6s ease; }
.reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
  html{ scroll-behavior:auto; }
  .btn{ transition:none; }
}

/* ---------- focus ---------- */
a:focus-visible, button:focus-visible{ outline:2px solid var(--accent); outline-offset:3px; border-radius:6px; }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:920px){
  .hero-photo{ max-width:420px; }
  .mentor-grid{ grid-template-columns:1fr; gap:32px; }
  .mentor-photo{ max-width:360px; }
  .compare, .days, .personas{ grid-template-columns:1fr; }
  .topics{ grid-template-columns:1fr; }
}
@media (max-width:600px){
  :root{ --sp:clamp(56px,12vw,80px); }
  .header-price{ display:none; }
  .brand{ font-size:.9rem; gap:8px; }
  .brand .dot{ width:9px; height:9px; }
  .header .wrap{ padding-inline:16px; }
  .wrap{ padding-inline:16px; }
  .btn{ padding:15px 26px; }
  .hero-actions{ flex-direction:column; align-items:stretch; }
  .hero-actions .btn{ width:100%; }
  .countdown{ justify-content:space-between; }
  .cd-box{ min-width:0; flex:1; }
  .price-card{ padding:36px 22px; }
  .price-card .btn{ width:100%; }
}