/* ===========================================================
   TOKENS — extraídos do estático aprovado
   preto, cinza, taupe (#C49E80) e bronze (#8C7350)
   =========================================================== */
:root{
  --preto:#0D0D0D;
  --grafite:#151515;
  --carvao:#1B1B1B;
  --linha:#2E2A26;
  --taupe:#C49E80;
  --taupe-claro:#DCC3AC;
  --bronze:#8C7350;
  --bronze-escuro:#6B5739;
  --cinza-texto:#A5A19D;
  --branco:#F3F1EF;
  --radius:2px;

  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --preto:#0D0D0D; --grafite:#151515; --carvao:#1B1B1B; --linha:#2E2A26;
    --taupe:#C49E80; --taupe-claro:#DCC3AC; --bronze:#8C7350; --bronze-escuro:#6B5739;
    --cinza-texto:#A5A19D; --branco:#F3F1EF;
  }
}
:root[data-theme="dark"]{
  --preto:#0D0D0D; --grafite:#151515; --carvao:#1B1B1B; --linha:#2E2A26;
  --taupe:#C49E80; --taupe-claro:#DCC3AC; --bronze:#8C7350; --bronze-escuro:#6B5739;
  --cinza-texto:#A5A19D; --branco:#F3F1EF;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-padding-top:env(safe-area-inset-top,0px); -webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--preto); color:var(--branco);
  font-family:'Mulish',system-ui,-apple-system,'Segoe UI',sans-serif;
  font-size:17px; line-height:1.64; -webkit-font-smoothing:antialiased;
}
img{max-width:100%}

/* ===========================================================
   ESTRUTURA
   =========================================================== */
.wrap{width:100%; max-width:1100px; margin:0 auto; padding:0 48px}
@media (max-width:900px){ .wrap{padding:0 30px} }
@media (max-width:520px){ .wrap{padding:0 22px} }
.band{padding:84px 0; background:var(--preto)}
.band.alt{background:var(--grafite)}
.grid{display:grid; grid-template-columns:minmax(0,192px) minmax(0,1fr); gap:44px; align-items:start}
@media (max-width:820px){ .grid{grid-template-columns:1fr; gap:18px} .band{padding:58px 0} }

.side{
  font-family:'Poppins',sans-serif; font-weight:500; font-size:12px;
  letter-spacing:.2em; text-transform:uppercase; color:var(--cinza-texto); padding-top:10px;
}
.side::before{content:""; display:block; width:30px; height:2px; background:var(--bronze); margin-bottom:14px}

h1,h2,h3{font-family:'Poppins',sans-serif; margin:0; color:var(--branco)}
h2{font-size:clamp(25px,3.5vw,35px); font-weight:600; line-height:1.2; letter-spacing:-.015em; margin-bottom:20px}
h3{font-size:18px; font-weight:600; line-height:1.34; margin-bottom:7px}
p{margin:0 0 17px; max-width:66ch; color:#CFCAC5}
.lead{font-size:clamp(17px,2vw,20px); line-height:1.58; color:var(--branco)}

/* ===========================================================
   BOTÕES
   =========================================================== */
.actions{display:flex; flex-wrap:wrap; gap:12px; margin-top:30px}
.btn{
  display:inline-flex; align-items:center; justify-content:center; text-align:center;
  font-family:'Poppins',sans-serif; font-weight:600; font-size:15px; letter-spacing:.02em;
  padding:16px 28px; border-radius:var(--radius); text-decoration:none;
  border:1px solid transparent; cursor:pointer;
  transition:background .15s ease, border-color .15s ease, color .15s ease;
}
.btn-pay{background:var(--taupe); color:#100E0C; border-color:var(--taupe)}
.btn-pay:hover{background:var(--taupe-claro); border-color:var(--taupe-claro)}
.btn-zap{background:transparent; color:var(--branco); border-color:var(--bronze)}
.btn-zap:hover{background:var(--bronze); color:#0D0D0D; border-color:var(--bronze)}
.btn:focus-visible,a:focus-visible{outline:2px solid var(--taupe); outline-offset:3px}

/* ===========================================================
   HERO
   =========================================================== */
.hero{position:relative; overflow:hidden; background:var(--preto); border-bottom:1px solid var(--linha)}
.hero-photo{
  position:absolute; inset:0; z-index:0;
  background-image:url("/site/immersion/foto-hero-itc.jpg");
  background-size:cover; background-position:72% center; background-repeat:no-repeat;
}
.hero-veil{
  position:absolute; inset:0; z-index:1;
  background:
    linear-gradient(90deg, #0D0D0D 0%, rgba(13,13,13,.97) 30%, rgba(13,13,13,.80) 52%, rgba(13,13,13,.42) 76%, rgba(13,13,13,.28) 100%),
    linear-gradient(180deg, rgba(13,13,13,.5) 0%, rgba(13,13,13,0) 34%, rgba(13,13,13,.5) 100%);
}
.hero-in{position:relative; z-index:2; padding:76px 0 84px; max-width:610px}
@media (max-width:1040px){
  .hero-in{max-width:558px}
  .hero-veil{background:linear-gradient(90deg,#0D0D0D 0%,rgba(13,13,13,.97) 42%,rgba(13,13,13,.76) 68%,rgba(13,13,13,.4) 100%)}
}
@media (max-width:820px){
  .hero{display:flex; flex-direction:column}
  .hero-photo{position:relative; inset:auto; width:100%; height:236px; background-position:center}
  .hero-veil{top:0; left:0; right:0; bottom:auto; height:236px;
    background:linear-gradient(180deg, rgba(13,13,13,.16) 0%, rgba(13,13,13,.08) 46%, rgba(13,13,13,.86) 84%, #0D0D0D 100%)}
  .hero-in{max-width:none; padding:34px 0 54px}
}
.brandline{
  font-family:'Poppins',sans-serif; font-weight:600; font-size:13px;
  letter-spacing:.3em; text-transform:uppercase; color:var(--branco); margin:0 0 6px;
}
.brandsub{
  font-family:'Poppins',sans-serif; font-weight:300; font-size:11px;
  letter-spacing:.17em; text-transform:uppercase; color:var(--cinza-texto); margin:0 0 34px;
}
.kicker{
  font-family:'Poppins',sans-serif; font-weight:500; font-size:clamp(13px,1.6vw,15px);
  letter-spacing:.3em; text-transform:uppercase; color:var(--branco); margin:0 0 8px;
}
.dateline{
  font-family:'Poppins',sans-serif; font-weight:400; font-size:clamp(15px,1.9vw,19px);
  letter-spacing:.05em; text-transform:uppercase; color:var(--branco); margin:0 0 22px;
}
.hero h1{
  font-family:'Poppins',sans-serif; font-weight:700; text-transform:uppercase;
  font-size:clamp(33px,5.8vw,60px); line-height:1.02; letter-spacing:-.018em;
  color:var(--taupe); margin-bottom:18px;
}
.deck{
  font-family:'Poppins',sans-serif; font-weight:400; text-transform:uppercase;
  font-size:clamp(14px,1.8vw,18px); line-height:1.45; letter-spacing:.08em;
  color:var(--branco); margin:0 0 24px; max-width:34ch;
}
.hero .lead{max-width:56ch; margin-bottom:26px; color:#CFCAC5}
.factline{display:flex; flex-wrap:wrap; gap:14px 30px; padding:22px 0 0; border-top:1px solid var(--linha); margin-top:26px}
.fact{font-size:15px; color:var(--branco)}
.fact b{display:block; font-family:'Poppins',sans-serif; font-weight:500; font-size:11px;
  letter-spacing:.2em; text-transform:uppercase; color:var(--cinza-texto); margin-bottom:3px}
.limited{
  display:inline-flex; align-items:center; gap:10px; margin-top:24px;
  font-family:'Poppins',sans-serif; font-weight:600; font-size:13px;
  letter-spacing:.16em; text-transform:uppercase; color:var(--taupe);
}
.limited::before{content:""; width:9px; height:9px; background:var(--taupe); border-radius:50%}

@media (prefers-reduced-motion: no-preference){
  .anim{opacity:0; transform:translateY(13px); animation:rise .7s cubic-bezier(.2,.7,.3,1) forwards}
  .anim:nth-child(1){animation-delay:.04s} .anim:nth-child(2){animation-delay:.09s}
  .anim:nth-child(3){animation-delay:.16s} .anim:nth-child(4){animation-delay:.23s}
  .anim:nth-child(5){animation-delay:.3s}  .anim:nth-child(6){animation-delay:.37s}
  .anim:nth-child(7){animation-delay:.44s} .anim:nth-child(8){animation-delay:.51s}
  .anim:nth-child(9){animation-delay:.58s} .anim:nth-child(10){animation-delay:.65s}
  @keyframes rise{to{opacity:1; transform:none}}
}

/* ===========================================================
   BLOCOS
   =========================================================== */
.gains{display:grid; grid-template-columns:repeat(auto-fit,minmax(224px,1fr)); gap:30px 34px}
.gain::before{content:""; display:block; width:22px; height:2px; background:var(--bronze); margin-bottom:13px}
.gain p{font-size:16px; margin:0}

.who{display:grid; grid-template-columns:repeat(auto-fit,minmax(248px,1fr)); gap:26px 40px}
.who ul{list-style:none; margin:10px 0 0; padding:0}
.who li{position:relative; padding-left:22px; margin-bottom:10px; font-size:16px; color:#CFCAC5}
.who li::before{content:""; position:absolute; left:0; top:11px; width:9px; height:2px; background:var(--taupe)}
.who .out li{color:#79736D}
.who .out li::before{background:#453F39}

.mod{background:var(--carvao); border:1px solid var(--linha); border-radius:var(--radius); padding:32px; margin-bottom:20px}
.mod-day{font-family:'Poppins',sans-serif; font-weight:600; font-size:12px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--taupe); display:block; margin-bottom:10px}
.mod h3{font-size:22px; letter-spacing:-.01em}
.mod-sub{font-size:16px; color:var(--cinza-texto); margin:0 0 20px}
.mod ul{list-style:none; margin:0; padding:0; columns:2; column-gap:38px}
@media (max-width:700px){ .mod ul{columns:1} .mod{padding:24px} }
.mod li{position:relative; padding-left:22px; margin-bottom:11px; font-size:16px; color:#CFCAC5; break-inside:avoid}
.mod li::before{content:""; position:absolute; left:0; top:11px; width:9px; height:2px; background:var(--bronze)}
.mod-foot{margin:22px 0 0; padding-top:18px; border-top:1px solid var(--linha); font-size:15px; color:var(--cinza-texto)}

/* painel do corpo docente, espelhando a moldura do estático */
.panel{border:1px solid var(--bronze); background:rgba(255,255,255,.045); padding:32px; border-radius:var(--radius); margin-top:6px}
@media (max-width:700px){ .panel{padding:24px} }
.faculty{display:block}
.fac{
  display:grid;
  grid-template-columns:176px minmax(0,1fr);
  grid-template-areas:"photo id" "photo bio";
  grid-template-rows:auto 1fr;
  column-gap:34px; row-gap:12px; align-content:start;
  padding:30px 0; border-top:1px solid rgba(140,115,80,.4);
}
.fac:first-child{padding-top:0; border-top:0}
.fac:last-child{padding-bottom:0}
.fac-photo{
  grid-area:photo; display:block; width:100%; height:auto; aspect-ratio:4/5;
  object-fit:cover; object-position:center top;
  border:1px solid var(--bronze); border-radius:var(--radius); background:var(--carvao);
}
.fac-id{grid-area:id}
.fac-bio{grid-area:bio; margin:0; font-size:16px; line-height:1.62; color:#CFCAC5; max-width:62ch}
@media (max-width:760px){
  .fac{
    grid-template-columns:96px minmax(0,1fr);
    grid-template-areas:"photo id" "bio bio";
    grid-template-rows:auto auto;
    column-gap:18px; row-gap:16px; padding:24px 0;
  }
  .fac-id{align-self:center}
}
.fac h3{font-family:'Poppins',sans-serif; font-weight:600; font-size:19px; text-transform:uppercase; letter-spacing:.02em; margin-bottom:6px}
.fac span{font-family:'Poppins',sans-serif; font-weight:400; font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:var(--taupe)}
.fac em{display:block; font-style:normal; font-size:13px; color:#79736D; margin-top:7px}

/* investimento */
.plans{display:grid; grid-template-columns:repeat(auto-fit,minmax(264px,1fr)); gap:20px; margin-top:4px}
.plan{background:var(--carvao); border:1px solid var(--linha); border-radius:var(--radius); padding:28px; display:flex; flex-direction:column}
.plan.key{border-color:var(--taupe)}
.badge{
  display:inline-block; font-family:'Poppins',sans-serif; font-weight:600; font-size:11px;
  letter-spacing:.18em; text-transform:uppercase; color:#100E0C; background:var(--taupe);
  padding:5px 11px; border-radius:var(--radius); margin-bottom:14px;
}
.pix{color:var(--taupe-claro)}
.plan h3{font-family:'Poppins',sans-serif; font-weight:600; font-size:17px; text-transform:uppercase; letter-spacing:.1em}
.plan .desc{font-size:15px; color:var(--cinza-texto); margin:14px 0 22px}
.price{font-family:'Poppins',sans-serif; font-weight:700; font-size:33px; color:var(--taupe);
  line-height:1.1; letter-spacing:-.02em; margin-bottom:22px}
.price small{display:block; font-family:'Mulish',sans-serif; font-weight:400; font-size:14px;
  color:var(--cinza-texto); letter-spacing:0; margin-top:8px}
.plan .btn{width:100%; margin-top:auto}
.paynote{margin-top:24px; font-size:15px; color:var(--cinza-texto)}
.zapline{margin-top:24px; padding-top:22px; border-top:1px solid var(--linha)}

.obj{border-top:1px solid var(--linha); padding:24px 0}
.obj:last-of-type{border-bottom:1px solid var(--linha)}
.obj h3{font-size:18px; margin-bottom:8px; color:var(--branco)}
.obj p{margin:0; font-size:16px}

.close-in{max-width:740px}
.close-in h2{color:var(--taupe); text-transform:uppercase; font-weight:700; letter-spacing:-.01em}

footer{background:var(--preto); border-top:1px solid var(--bronze-escuro); padding:34px 0; font-size:14px; color:#79736D}
footer p{margin:0 0 6px; max-width:none; color:#79736D}
footer .fname{font-family:'Poppins',sans-serif; font-weight:600; letter-spacing:.28em; text-transform:uppercase; color:var(--branco); margin-bottom:10px}

.dock{display:none}
@media (max-width:820px){
  .dock{display:flex; gap:10px; position:fixed; left:0; right:0; bottom:0; z-index:40;
    background:var(--grafite); border-top:1px solid var(--linha);
    padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px))}
  .dock .btn{flex:1; padding:14px 8px; font-size:14px}
  body{padding-bottom:86px}
}
.actions-compact{margin-top:14px}
.plan .sold-out{opacity:.6;pointer-events:none}
.plan .remaining{font-size:13px;color:var(--cinza-texto);margin:0 0 12px}
.plan .remaining.empty{color:#f2aaa1}
.hero-in{max-width:680px}
.hero .actions{flex-wrap:nowrap}
@media(max-width:580px){.hero .actions{flex-wrap:wrap}}
