/* ITERA — investidor.css. Página "Para o investidor" (investidor.html), a partir do handoff do Claude Design
   (design_handoff_pagina_investidor, 25/09/2026). Tudo aqui vale só dentro de .iv ou de body.page-investidor.
   Não mexe em v3.css, bundle.css nem brand.css. Seções marcadas S1…S11. Breakpoint único do handoff: 768px. */

/* ===== Núcleo =====
   29/09/2026: os valores da página viraram apelidos dos tokens do site (DS 2.0 via tokens.css): preto #0A0A0A, amarelo
   #FEF133, claro #F2F2F2/#E5E5E5 (o alta renda usa os mesmos neutros do DS, sem tom próprio), texto no claro #0A0A0A e
   #646464 (dois níveis), destaque no claro #6B6515. Margens da página = --gut do site; conteúdo até --page (1240px). */
.iv{
  --iv-ease:var(--ease,cubic-bezier(.2,.8,.2,1));
  --iv-black:var(--bg);
  --iv-ink:var(--ink-text);
  --iv-yellow:var(--yellow);
  --iv-gold:var(--gold-dim);
  --iv-cream:var(--cream);
  --iv-sand:var(--cream-2);
  --iv-t2:var(--ink-muted);
  --iv-t3:var(--ink-dim);
  --iv-d2:var(--muted);
  --iv-line:rgba(10,10,10,.1);
  --iv-line2:rgba(10,10,10,.14);
  --iv-dline:var(--line);
  --iv-dline2:var(--line-2);
  --iv-pad:var(--gut);
  font-family:var(--font,'Manrope',sans-serif);
  color:var(--iv-ink);
  background:var(--iv-cream);
  overflow-x:clip;
  line-height:1.5;
}
/* resets com especificidade de uma classe (0,1,0): vencem os seletores de elemento do bundle.css (ex.: h2 com
   max-width:22ch) e perdem para as classes da página, que vêm depois no arquivo */
.iv :where(h1,h2,h3,h4){text-transform:none;max-width:none;margin:0}
.iv :where(p,figure){margin:0}
.iv :where(ul,ol){list-style:none;margin:0;padding:0}
.iv :where(a){color:inherit}
.iv :where(h1,h2,p){text-wrap:pretty}
.iv :where(em){font-style:normal;font-weight:600}
.iv a,.iv button{scroll-margin-top:calc(var(--header-h,76px) + 8px)}
.iv section[id]{scroll-margin-top:var(--header-h,76px)}

/* seções: o #main vence as regras de dobra do v3.css ("main section" e "main section:not(#atributos):not(.hero)",
   que põem min-height, flex e padding em ≥1000px); a base abaixo empata em especificidade com a do v3.css e vence por vir depois; a regra de cada seção começa com "#main .iv".
   O hero (.hero, assets/hero.css) fica de fora: :not(:where()) não muda a especificidade (1,1,2). */
main#main .iv > section:not(:where(.hero)){min-height:0;display:block;align-items:normal;padding:0}
.iv-wrap{max-width:var(--page);margin:0 auto}
#main .iv .iv-sec{padding:140px var(--iv-pad);position:relative}
.iv-sec--dark,.iv-s4,.iv-s6{color:#fff}

/* títulos (o H1 é o .hero-h1 de assets/hero.css) */
/* títulos de seção no DS 2.0 (29/09, aprovado pelo Paulo): primeira parte em 500 e o em em 300, no destaque
   (amarelo no escuro, #6B6515 no claro). Antes: 300 com o em em 600 */
.iv-h2{font-weight:700;font-size:clamp(44px,5.6vw,80px);line-height:1.02;letter-spacing:-.03em;color:var(--iv-ink)}
.iv-h2 em,.iv-s9-title em{font-weight:700}
.iv-h2 em{color:var(--iv-gold)}
.iv-s4 .iv-h2,.iv-s6 .iv-h2,.iv-s11 .iv-h2{color:#fff}
.iv-s4 .iv-h2 em,.iv-s6 .iv-h2 em,.iv-s11 .iv-h2 em,.iv-s9 em{color:var(--iv-yellow)}
.iv-h3{font-weight:600;font-size:18px;line-height:1.3;letter-spacing:0}
.iv-eyebrow{font-weight:600;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--iv-gold)}
.iv-lead{margin:28px auto 0;max-width:560px;font-size:18px;line-height:1.55;color:var(--iv-t2)}
.iv-head{max-width:720px;margin:0 auto;text-align:center}
.iv-ico{width:24px;height:24px;flex:0 0 auto;fill:none;stroke:var(--iv-gold);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}

/* botões: Button lg do DS 2.0 (29/09): 52px, raio 8, 500, 16px, sem caixa alta; primário amarelo no escuro e preto
   no claro (--dark), ghost com borda de 1px na cor do texto. Mesmos valores do .btn.btn--lg do hero. */
.iv-btns{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
.iv-btn{display:inline-flex;align-items:center;justify-content:center;height:52px;padding:0 var(--space-6,24px);border-radius:var(--radius-md,8px);
  border:1px solid transparent;font-weight:500;font-size:16px;line-height:1;letter-spacing:0;text-transform:none;white-space:nowrap;text-decoration:none;
  transition:background-color 150ms var(--iv-ease),border-color 150ms var(--iv-ease),color 150ms var(--iv-ease),transform 150ms var(--iv-ease)}
.iv-btn:active{transform:scale(.98)}
.iv .iv-btn--yellow{background:var(--cta);border-color:var(--cta);color:var(--cta-text);font-weight:600}
.iv .iv-btn--yellow:hover{background:var(--cta-hover);border-color:var(--cta-hover)}
.iv .iv-btn--dark{background:var(--deep-black);border-color:var(--deep-black);color:var(--neutral-000);box-shadow:var(--shadow-cta-light);font-weight:600}
.iv .iv-btn--dark:hover{background:var(--graphite);border-color:var(--graphite)}
.iv .iv-btn--ghost{background:transparent;color:var(--text);border-color:var(--text)}
.iv .iv-btn--ghost:hover{background:rgba(255,255,255,.06)}
.iv .iv-btn--ghost-strong{border-color:var(--text)}
.iv-cta{text-align:center}
.iv-cta--48{margin-top:48px}
.iv-cta--56{margin-top:56px}
.iv-btn:focus-visible,.iv-textlink:focus-visible,.iv-faq-q:focus-visible,.iv-cue:focus-visible{outline:2px solid var(--iv-yellow);outline-offset:3px}
.iv-s2 .iv-btn:focus-visible,.iv-s3 .iv-btn:focus-visible,.iv-s7 .iv-btn:focus-visible,.iv-faq-q:focus-visible{outline-color:var(--iv-ink)}

/* selo "Em breve": Tag do DS 2.0 (bloco de canto 4px; no claro preto com texto branco, no escuro amarelo com preto) */
.iv-tag-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.iv-tag{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:var(--radius-xs,4px);background:var(--deep-black);color:var(--neutral-000);
  font-weight:600;font-size:11px;line-height:16px;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.iv-tag--yellow{background:var(--itera-yellow);color:var(--deep-black)}

/* revelar ao rolar (só com JS; sem JS tudo aparece) */
.js .iv [data-iv-rv]{opacity:0;transform:translateY(16px);transition:opacity .6s var(--iv-ease),transform .6s var(--iv-ease)}
.js .iv [data-iv-rv].in{opacity:1;transform:none}
.js .iv [data-iv-rv] em{opacity:0;transition:opacity .5s var(--iv-ease) .4s}
.js .iv [data-iv-rv].in em{opacity:1}

/* Header, menu e rodapé: os do site, sem ajuste por página (item ativo é regra global do v3.css, 29/09/2026) */

/* ===== S1 Hero: assets/hero.css (hero padrão do site, 29/09/2026). Aqui só a deixa "Role para conhecer" ===== */
.iv-cue{position:absolute;left:50%;bottom:60px;transform:translateX(-50%);z-index:2;display:flex;flex-direction:column;align-items:center;gap:14px;
  color:var(--iv-d2);font-weight:600;font-size:11px;letter-spacing:.16em;text-transform:uppercase;text-decoration:none}
.iv .iv-cue{color:var(--iv-d2)}
.iv-cue-line{position:relative;display:block;width:1px;height:36px;background:var(--iv-dline2);overflow:hidden}
.iv-cue-line span{position:absolute;inset:0;background:var(--iv-yellow);animation:ivCue 2.2s cubic-bezier(.6,0,.2,1) infinite}
@keyframes ivCue{0%{transform:translateY(-100%)}60%,100%{transform:translateY(100%)}}

/* ===== S2 O que a Itera oferece ===== */
#main .iv .iv-s2{z-index:2;margin-top:-40px;border-radius:40px 40px 0 0;background:var(--iv-cream)}
.iv-s2-title{margin:0 auto 72px;max-width:720px;text-align:center}
.iv-cols5{display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}
.iv-col5{padding:0 28px;border-left:1px solid var(--iv-line);display:flex;flex-direction:column;gap:18px}
.iv-col5:first-child{padding-left:0;border-left:0}
.iv-col5:last-child{padding-right:0}
.iv-col5-t{font-size:16px;line-height:1.5;color:var(--iv-t2)}
.iv-p22{margin:72px auto 0;max-width:720px;text-align:center;font-size:22px;line-height:1.5;color:var(--iv-ink)}

/* ===== S3 Da análise ao ajuste ===== */
#main .iv .iv-s3{background:var(--iv-sand);padding-top:112px;padding-bottom:112px}
.iv-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.iv-s3-two{gap:72px;align-items:center;margin-top:56px}
.iv-steps-box{max-width:520px;margin:0 0 0 auto}
.iv-steps{position:relative;padding-left:28px}
.iv-steps-list{display:flex;flex-direction:column;gap:32px}
.iv-steps-rail,.iv-steps-fill{position:absolute;left:0;top:0;bottom:0;width:1px;background:var(--iv-line2)}
.iv-steps-fill{background:var(--iv-gold);transform-origin:top;transform:scaleY(1)}
.js .iv-steps-fill{transform:scaleY(0)}
.iv-step{display:grid;grid-template-columns:32px minmax(0,1fr);gap:12px;transition:opacity .4s var(--iv-ease)}
.js .iv-step{opacity:.3}
.js .iv-step.is-on{opacity:1}
.iv-step-n{font-weight:600;font-size:12px;letter-spacing:.16em;color:var(--iv-gold);padding-top:4px;font-variant-numeric:tabular-nums}
.iv-step-t{margin-top:6px;font-size:16px;line-height:1.5;color:var(--iv-t2)}

.iv-card{background:#fff;border-radius:20px;padding:28px 32px;box-shadow:0 40px 80px -40px rgba(0,0,0,.28),0 2px 6px rgba(0,0,0,.04)}
.iv-card-head{font-weight:600;font-size:15px;padding-bottom:16px;border-bottom:1px solid var(--iv-line)}
.iv-card-head span{color:var(--iv-t3);font-weight:400}
.iv-card-sum{margin-top:16px;font-size:14px;color:var(--iv-t2)}
.iv-card-sum b{color:var(--iv-ink);font-weight:600;font-variant-numeric:tabular-nums}
.iv-card-chart{display:flex;align-items:center;gap:32px;margin-top:24px;flex-wrap:wrap}
.iv-donut{position:relative;width:132px;height:132px;flex:0 0 auto}
.iv-donut svg{display:block;width:100%;height:100%;transform:rotate(-90deg)}
.iv-donut circle{fill:none;stroke-width:11;stroke-dasharray:var(--d);stroke-dashoffset:var(--o);
  transition:stroke-dasharray .7s var(--iv-ease);transition-delay:calc(var(--i) * .12s)}
.js .iv-card:not(.is-drawn) .iv-donut circle{stroke-dasharray:0 100}
.iv-donut-c{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.iv-donut-c b{font-weight:600;font-size:22px;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.iv-donut-c span{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--iv-t3);font-weight:600}
.iv-legend{display:grid;gap:10px;font-size:14px;flex:1 1 160px}
.iv-legend li{display:flex;align-items:center;justify-content:space-between;gap:12px}
.iv-legend li span{display:flex;align-items:center;gap:10px}
.iv-legend i{width:10px;height:10px;border-radius:2px;flex:0 0 auto}
.iv-legend b{font-variant-numeric:tabular-nums;font-weight:600}
.iv-card-eyebrow{font-weight:600;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--iv-gold)}
.iv-card > .iv-card-eyebrow{margin-top:24px}
.iv-alerts{margin-top:8px;display:flex;flex-direction:column}
.iv-alerts li{display:flex;align-items:baseline;gap:12px;padding:10px 0;border-top:1px solid var(--iv-line);font-size:14px;line-height:1.5}
.iv-alerts i{width:7px;height:7px;border-radius:999px;background:#c58a1a;flex:0 0 auto;position:relative;top:-1px}
.iv-alerts b{font-weight:600}
.iv-alerts span{color:var(--iv-t2)}

/* ===== S4 Acompanhamento (foto do assessor só no topo da dobra, 05/10/2026) ===== */
#main .iv .iv-s4{background:var(--iv-black);padding:140px var(--iv-pad) 112px;overflow:hidden}
/* mídia dentro da coluna externa do site (--page-outer, 1336px), centrada; o fundo da dobra sobra nas laterais (29/09) */
.iv-s4-photo,.iv-s11-img{position:absolute;top:0;bottom:0;left:50%;width:min(100%,var(--page-outer,1336px));height:100%;transform:translateX(-50%)}
@media (min-width:1337px){
  .iv-s4-photo,.iv-s11-img{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 72px,#000 calc(100% - 72px),transparent 100%);
    mask-image:linear-gradient(90deg,transparent 0,#000 72px,#000 calc(100% - 72px),transparent 100%)}
}
/* 05/10/2026: a foto deixa de cobrir a dobra inteira (furava a página e, no celular, tomava tudo) e vira hero da seção:
   altura fixa no topo (760px; 125vw no celular), máscara de 70% a 100% e cards mais acima (prévia inv2-assessor aprovada) */
.iv-s4-photo,.iv-s4-veil{bottom:auto;height:760px}
.iv-s4-photo{overflow:hidden;-webkit-mask-image:linear-gradient(180deg,#000 70%,transparent 100%);mask-image:linear-gradient(180deg,#000 70%,transparent 100%)}
@media (min-width:1337px){
  .iv-s4-photo{-webkit-mask-image:linear-gradient(180deg,#000 70%,transparent 100%),linear-gradient(90deg,transparent 0,#000 72px,#000 calc(100% - 72px),transparent 100%);-webkit-mask-composite:source-in;
    mask-image:linear-gradient(180deg,#000 70%,transparent 100%),linear-gradient(90deg,transparent 0,#000 72px,#000 calc(100% - 72px),transparent 100%);mask-composite:intersect}
}
.iv-s4-img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover}
.iv-s4-veil{position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(10,10,10,.75) 0%,rgba(10,10,10,.25) 40%,rgba(10,10,10,.35) 70%,#0a0a0a 100%)}
.iv-s4-body{position:relative;z-index:1}
.iv-s4 .iv-lead{color:#e6e6e6}
.iv-grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.iv-s4-grid{margin-top:200px;gap:32px}
.iv-s4-grid li{padding-top:20px;border-top:1px solid rgba(255,255,255,.28)}
.iv-s4-grid .iv-h3{color:#fff}
.iv-s4-grid p{margin-top:10px;font-size:15px;line-height:1.5;color:#d9d9d9}

/* ===== S5 Investimentos, conta e cartão ===== */
#main .iv .iv-s5{background:var(--iv-sand)}
.iv-s5-body{margin-top:72px}
.iv-block-t{padding-bottom:20px;border-bottom:1px solid var(--iv-line)}
.iv-s5-grid{gap:40px 48px;margin-top:40px}
.iv-s5-grid li{display:flex;flex-direction:column;gap:12px}
.iv-s5-grid p,.iv-s5-list p{font-size:15px;line-height:1.5;color:var(--iv-t2)}
.iv-s5-account{margin-top:80px}
.iv-s5-two{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:64px;margin-top:40px;align-items:center}
.iv-s5-list{display:flex;flex-direction:column;gap:28px}
.iv-s5-list p{margin-top:8px}
.iv-s5-note{margin-top:48px;padding-top:24px;border-top:1px solid var(--iv-line);font-size:15px;line-height:1.5;color:var(--iv-t2)}
.iv-cards{position:relative;height:250px;width:356px;margin:0 auto}
.iv-ccard{position:absolute;width:300px;height:188px;border-radius:14px;padding:20px 22px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}
.iv-ccard--infinite{left:56px;top:8px;background:#111;border:1px solid rgba(255,255,255,.08);transform:rotate(-6deg);box-shadow:0 30px 60px -30px rgba(0,0,0,.5)}
.iv-ccard--legacy{left:0;top:44px;background:linear-gradient(135deg,#3b3b3a 0%,#1d1d1c 45%,#2c2c2b 100%);border:1px solid rgba(255,255,255,.12);transform:rotate(4deg);box-shadow:0 40px 70px -30px rgba(0,0,0,.6)}
.iv-ccard--legacy::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 1px,transparent 1px 3px)}
.iv-ccard-xp{position:relative;font-weight:800;font-size:13px;letter-spacing:.02em;color:#5a5a5a}
.iv-ccard-name{position:relative;font-size:12px;letter-spacing:.08em;color:#8a8a8a}
.iv-ccard--legacy .iv-ccard-xp{color:#7a7a78}
.iv-ccard--legacy .iv-ccard-name{color:var(--iv-d2)}
.iv-legal{margin-top:72px;font-size:12px;line-height:1.5;color:var(--iv-t3)}

/* ===== S6 Plataforma XP ===== */
#main .iv .iv-s6{background:var(--iv-black);padding:96px var(--iv-pad) 0;overflow:hidden;text-align:center}
.iv-s6-eyebrow{color:var(--iv-d2)}
.iv-s6-title{margin:28px auto 0;max-width:720px}
.iv-s6 .iv-lead{color:var(--iv-d2)}
.iv-phone{position:relative;width:min(360px,100%);margin:48px auto 0;display:flex;justify-content:center}
.iv-phone img{display:block;width:100%;height:auto;
  -webkit-mask-image:linear-gradient(180deg,#000 72%,transparent 96%);mask-image:linear-gradient(180deg,#000 72%,transparent 96%)}

/* ===== S7 Faixas de assessoria ===== */
#main .iv .iv-s7{background:var(--iv-cream)}
.iv-tiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:72px}
.iv-tier{background:var(--iv-sand);border-radius:28px;padding:12px;display:flex;flex-direction:column}
.iv-tier-head{position:relative;background:var(--iv-ink);border-radius:20px;padding:32px 28px;overflow:hidden}
.iv-tier-head::before{content:"";position:absolute;inset:0;background:url(img/investidor-textura.svg) 0 0/160px auto repeat;opacity:.06}
.iv-tier--private .iv-tier-head{background:linear-gradient(180deg,#181818 0%,#0b0b0b 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.22)}
.iv-tier-name{position:relative;font-weight:600;font-size:32px;line-height:1.2;letter-spacing:-.02em;color:#fff}
.iv-tier-range{position:relative;margin-top:8px;font-size:15px;color:var(--iv-d2)}
.iv-tier-body{padding:28px 20px 20px;display:flex;flex-direction:column;flex:1}
.iv-tier-desc{font-size:16px;line-height:1.55;color:var(--iv-ink)}
.iv-tier-eyebrow{margin-top:28px}
.iv-checks{margin-top:14px;display:flex;flex-direction:column;gap:10px;font-size:15px;line-height:1.45;color:var(--iv-t2)}
.iv-checks li{display:flex;gap:10px}
.iv-checks svg{width:18px;height:18px;flex:0 0 auto;margin-top:2px;fill:none;stroke:var(--iv-gold);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.iv-s7-notes{margin:40px auto 0;display:flex;flex-direction:column;gap:10px;max-width:800px;text-align:center;font-size:13px;line-height:1.55;color:var(--iv-t2)}


/* ===== S9 Faixa do trader ===== */
#main .iv .iv-s9{background:var(--iv-black);padding:80px var(--iv-pad);color:#fff}
.iv-s9-row{display:flex;align-items:center;justify-content:space-between;gap:48px}
.iv-s9-text{max-width:640px}
.iv-s9-title{font-weight:700;font-size:clamp(44px,5.6vw,80px);line-height:1.02;letter-spacing:-.03em;color:#fff}
.iv-s9-text p{margin-top:16px;font-size:16px;line-height:1.55;color:var(--iv-d2)}
.iv-s9-actions{display:flex;align-items:center;gap:28px;flex-wrap:wrap;flex:0 0 auto}
/* 05/10/2026 (noite): foto da Camila no fundo da dobra (coluna de 1336px, bordas esmaecidas), texto por cima.
   Desktop: ela fica à direita; texto e botões empilhados à esquerda, sobre o véu que escurece desse lado */
#main .iv .iv-s9{position:relative;overflow:hidden;min-height:720px;display:flex;align-items:center;padding:120px var(--iv-pad)}
.iv-s9 .iv-s9-row{position:relative;z-index:1;width:100%;flex-direction:column;align-items:flex-start;justify-content:center;gap:40px}
.iv-s9-foto{position:absolute;top:0;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,var(--page-outer,1336px));overflow:hidden;pointer-events:none}
@media (min-width:1337px){
  .iv-s9-foto{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 72px,#000 calc(100% - 72px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 72px,#000 calc(100% - 72px),transparent 100%)}
}
/* desktop: a foto é vertical; ancorada à direita e mais estreita, mostra a Camila inteira até o ombro, esmaecendo à esquerda */
.iv-s9-foto img{position:absolute;top:0;right:0;width:58%;height:100%;max-width:none;object-fit:cover;object-position:50% 30%;-webkit-user-select:none;user-select:none;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 30%);mask-image:linear-gradient(90deg,transparent 0,#000 30%)}
.iv-s9-veu{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,10,10,.82) 0%,rgba(10,10,10,.6) 40%,rgba(10,10,10,.1) 70%,rgba(10,10,10,.2) 100%),linear-gradient(180deg,#0a0a0a 0%,transparent 16%,transparent 80%,#0a0a0a 100%)}
.iv-s9-text p{color:#e6e6e6}
/* 05/10/2026 (noite, 2ª passada): padrão do site, texto centralizado com a pessoa atrás. Título curto ("Já opera com a Itera?"),
   o resto da frase foi para o subtítulo; véu escurece o centro, atrás do texto */
.iv-s9 .iv-s9-row{align-items:center;text-align:center;gap:36px}
.iv-s9-text{max-width:760px;margin:0 auto}
.iv-s9-text p{max-width:600px;margin:24px auto 0;font-size:18px;line-height:1.55}
.iv-s9-actions{justify-content:center}
.iv-s9-veu{background:radial-gradient(ellipse 46% 60% at 50% 50%,rgba(10,10,10,.72) 0%,rgba(10,10,10,.4) 60%,transparent 100%),linear-gradient(90deg,rgba(10,10,10,.6) 0%,rgba(10,10,10,.3) 45%,rgba(10,10,10,.15) 70%,rgba(10,10,10,.3) 100%),linear-gradient(180deg,#0a0a0a 0%,transparent 16%,transparent 80%,#0a0a0a 100%)}
.iv .iv-textlink{color:#fff;font-weight:600;font-size:15px;white-space:nowrap;text-decoration:none;transition:opacity .3s var(--iv-ease)}
.iv-textlink:hover{opacity:.86}

/* ===== S10 Perguntas ===== */
#main .iv .iv-s10{background:var(--iv-cream)}
.iv-s10-wrap{max-width:800px}
.iv-s10-title{text-align:center}
.iv-faq{margin-top:72px;border-bottom:1px solid var(--iv-line)}
.iv-faq-item{border-top:1px solid var(--iv-line)}
.iv-faq h3{font:inherit}
.iv-faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:24px;text-align:left;padding:26px 0;background:transparent;border:0;cursor:pointer;
  color:var(--iv-ink);font-family:inherit;font-weight:600;font-size:20px;line-height:1.3}
.iv-faq-ico{position:relative;width:28px;height:28px;flex:0 0 auto;border:1px solid rgba(0,0,0,.18);border-radius:999px}
.iv-faq-ico::before,.iv-faq-ico::after{content:"";position:absolute;background:var(--iv-ink)}
.iv-faq-ico::before{left:8px;right:8px;top:12.5px;height:1.5px}
.iv-faq-ico::after{top:8px;bottom:8px;left:12.5px;width:1.5px;transition:transform .3s var(--iv-ease)}
.iv-faq-q[aria-expanded="true"] .iv-faq-ico::after{transform:rotate(90deg)}
.iv-faq-a p{padding:0 64px 28px 0;font-size:17px;line-height:1.6;color:var(--iv-t2)}
.iv-faq-a[hidden]{display:none}

/* ===== S11 Fecho ===== */
#main .iv .iv-s11{position:relative;background:var(--iv-black);min-height:720px;display:flex;align-items:center;justify-content:center;padding:160px var(--iv-pad);overflow:hidden}
.iv-s11-img{max-width:none;object-fit:cover;object-position:60% 50%}
.iv-s11-veil{position:absolute;inset:0;background:linear-gradient(180deg,#0a0a0a 0%,rgba(10,10,10,.55) 45%,rgba(10,10,10,.35) 100%)}
.iv-s11-body{position:relative;z-index:1;text-align:center;max-width:720px}
.iv-s11 .iv-lead{color:#fff}
.iv-s11 .iv-btns{margin-top:40px}
.iv-s11-note{margin-top:32px;font-size:13px;line-height:1.5;color:var(--iv-d2)}

/* ===== Mobile (< 768px) ===== */
@media (max-width:767.98px){
  #main .iv .iv-sec,#main .iv .iv-s3,#main .iv .iv-s4{padding:88px var(--iv-pad)}
  #main .iv .iv-s6{padding:88px var(--iv-pad) 0}
  .iv-h2{font-size:max(44px,11.5vw)}
  .iv-cue{display:none}
  /* a S2 sobe 40px sobre o hero (margin-top:-40px): no celular o hero termina logo depois da nota, então ganha os
     40px embaixo para a nota não ficar sob a S2 */
  #main .iv .hero{padding-bottom:calc(32px + 40px)}

  .iv-btns{flex-direction:column;width:100%}
  .iv-btns .iv-btn{width:100%}

  .iv-cols5{grid-template-columns:1fr}
  .iv-col5,.iv-col5:first-child,.iv-col5:last-child{border-left:0;border-top:1px solid var(--iv-line);padding:24px 0}
  .iv-col5:first-child{border-top:0;padding-top:0}
  .iv-p22{font-size:18px}

  .iv-two,.iv-grid3,.iv-tiers,.iv-s5-two{grid-template-columns:1fr}
  .iv-steps-box{margin:0 auto}
  .iv-card{padding:24px 22px}
  .iv-s4-photo,.iv-s4-veil{height:125vw}
  .iv-s4-grid{margin-top:96px}
  .iv-cards{margin:0;transform:scale(.8);transform-origin:left center}
  .iv-s9-row{flex-direction:column;align-items:flex-start}
  .iv-s9-title{font-size:max(44px,11.5vw)}
  /* celular: título no topo, a foto (Camila) entre o título e o texto, texto e botões na base esmaecida */
  #main .iv .iv-s9{display:block;min-height:0;padding:88px var(--iv-pad)}
  .iv-s9 .iv-s9-row{gap:28px}
  .iv-s9-foto{top:46vw;bottom:auto;height:124vw;-webkit-mask-image:linear-gradient(180deg,#000 75%,transparent 100%);mask-image:linear-gradient(180deg,#000 75%,transparent 100%)}
  .iv-s9-foto img{position:static;width:100%;object-position:70% 20%;-webkit-mask-image:none;mask-image:none}
  .iv-s9-veu{background:linear-gradient(180deg,#0a0a0a 0%,rgba(10,10,10,.55) 22%,rgba(10,10,10,.1) 45%,rgba(10,10,10,.5) 70%,#0a0a0a 92%)}
  .iv-s9-text p{margin-top:92vw;font-size:17px}
  .iv-s9-actions{flex-direction:column;width:100%;gap:20px}
  .iv-s9-actions .iv-btn{width:100%;justify-content:center}
  .iv-phone{width:100%;margin-top:56px}
  .iv-faq-a p{padding-right:0}
  #main .iv .iv-s11{min-height:0;padding:120px var(--iv-pad)}
}

/* ===== Movimento reduzido ===== */
@media (prefers-reduced-motion:reduce){
  .js .iv [data-iv-rv],.js .iv [data-iv-rv] em{opacity:1;transform:none;transition:none}
  .iv-cue-line span{animation:none}
  .iv-btn,.iv-btn:hover{transition:none;transform:none}
}
