/* ============================================================
   styles.css — componentes visuais do site (Protocolo de Posicionamento)
   Construído sobre tokens.css + base.css. Segue as regras do design
   system: 3 cores, raios contidos, sombras curtas, sem gradiente
   decorativo, movimento curto sem bounce.
   ============================================================ */

.container{max-width:var(--container-lg);margin:0 auto;padding:0 clamp(16px,4vw,32px)}

/* ——— Header ——— */
.site-header{position:fixed;top:0;left:0;right:0;z-index:60;height:64px;background:var(--brand-brown)}
.site-header .container{height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:flex;align-items:center;gap:14px;min-width:0}
.brand-mark{position:relative;width:1.25em;height:.85em;flex:0 0 auto;font-family:var(--font-display);font-weight:450;font-variation-settings:var(--fraunces-heading);line-height:1;font-size:40px}
.brand-mark span{position:absolute;left:0;top:-.125em}
.brand-mark span.ghost{left:.55em;color:rgba(245,238,217,.55)}
.brand-mark span.solid{color:var(--brand-cream)}
.brand-rule{width:1px;height:32px;background:rgba(245,238,217,.3);flex:0 0 1px}
.brand-name{display:flex;flex-direction:column;gap:2px;min-width:0}
.brand-name strong{font-family:var(--font-display);font-weight:var(--weight-semibold);font-variation-settings:var(--fraunces-heading);font-size:17px;letter-spacing:var(--tracking-heading);line-height:1.1;color:var(--brand-cream);white-space:nowrap}
.brand-name span{font-size:9.5px;font-weight:var(--weight-medium);line-height:1.1;text-transform:uppercase;letter-spacing:var(--tracking-eyebrow);color:rgba(245,238,217,.7);white-space:nowrap}

@media (max-width:640px){
  .brand-mark{font-size:30px}
  .brand-name,.brand-rule{display:none}
}

/* ——— Botões ——— */
.btn{display:inline-block;font-weight:var(--weight-semibold);font-size:17px;line-height:1;padding:20px 30px;border-radius:0;transition:background var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out);border:none;cursor:pointer}
.btn:active{transform:translateY(1px)}
.btn--primary{background:var(--brand-petrol);color:var(--cream-100)}
.btn--primary:hover{background:var(--petrol-800);color:var(--cream-100)}
.btn--on-dark{background:var(--brand-cream);color:var(--brand-petrol)}
.btn--on-dark:hover{background:var(--cream-500)}
.btn--nav{padding:11px 16px;font-size:13px;background:var(--brand-cream);color:var(--brand-brown)}
.btn--nav:hover{background:var(--cream-500);color:var(--brand-brown)}
.btn.is-pending{background:var(--brown-200);color:var(--ink-500);cursor:not-allowed}
.btn.is-pending:hover{background:var(--brown-200)}

/* ——— Seções ——— */
.section{padding:clamp(56px,9vw,104px) clamp(24px,5vw,64px)}
.section--hero{padding-top:clamp(60px,10vw,120px)}
.section--inverse{background:var(--brand-brown);color:var(--brand-cream)}
.section--accent{background:var(--brand-petrol);color:var(--brand-cream)}
.section-title{font-size:clamp(28px,4vw,44px);line-height:1.1;margin-bottom:clamp(24px,3vw,32px)}
.stack{display:flex;flex-direction:column;gap:clamp(22px,2.6vw,30px)}
.stack > p{font-size:17px;line-height:1.65}
.measure{max-width:62ch}

.pull{border-left:2px solid var(--brand-petrol);padding-left:24px;font-size:clamp(19px,2.2vw,23px);line-height:1.5;font-weight:var(--weight-semibold)}

/* ——— Hero ——— */
.hero-title{font-size:clamp(38px,7.4vw,84px);line-height:1.02;letter-spacing:var(--tracking-display);margin-bottom:clamp(24px,3vw,32px)}
.hero-lede{font-size:clamp(17px,2vw,21px);line-height:1.62;color:rgba(78,51,29,.75);max-width:62ch;margin-bottom:clamp(32px,4vw,44px)}
.hero-meta{font-size:14px;color:rgba(78,51,29,.65);margin-top:16px}

/* ——— Grid pra quem é / não é ——— */
.split{display:flex;flex-wrap:wrap;gap:clamp(28px,4vw,44px);align-items:stretch}
.split-item{flex:1 1 300px;border-left:3px solid var(--brand-petrol);padding-left:24px}
.split-item:last-child{border-left-color:var(--brand-brown)}
.split-divider{flex:0 0 1px;align-self:stretch;min-height:1px;background:var(--border-hairline)}
.split-item h3{font-size:clamp(22px,2.6vw,28px);margin-bottom:16px}
.split-item p{font-size:17px;line-height:1.65}

/* ——— Cadeia de copilotos ——— */
.chain{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(14px,1.8vw,20px);border-top:1px solid var(--border-hairline);padding-top:clamp(28px,3.5vw,36px);margin:clamp(40px,5vw,56px) 0 0}
.chain-item .num{font-size:12px;font-weight:var(--weight-medium);letter-spacing:var(--tracking-eyebrow);color:var(--brand-petrol);font-variant-numeric:tabular-nums}
.chain-item .name{font-family:var(--font-display);font-weight:var(--weight-black);font-variation-settings:var(--fraunces-heading);font-size:20px;line-height:1.2;letter-spacing:var(--tracking-heading);margin:8px 0 6px}
.chain-item .desc{font-size:14px;line-height:1.5;color:rgba(78,51,29,.7)}
@media (max-width:880px){
  .chain{grid-template-columns:1fr;gap:20px}
  .chain-item{border-left:1px solid var(--border-hairline);padding-left:16px}
}

/* ——— Módulos de prova ——— */
.proof-intro{max-width:62ch;margin-bottom:clamp(32px,4vw,44px)}
.proof-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.5vw,28px)}
.proof-grid--2{grid-template-columns:repeat(2,1fr)}
@media (max-width:880px){
  .proof-grid,.proof-grid--2{grid-template-columns:1fr}
}
.proof-card{background:var(--surface-card);border:1px solid var(--border-hairline);overflow:hidden}
.proof-card img{width:100%;height:auto;border-bottom:1px solid var(--border-hairline);cursor:zoom-in}
.proof-card figcaption{padding:14px 16px;font-size:14px;line-height:1.5;color:var(--text-muted)}
.proof-disclaimer{margin-top:20px;font-size:13px;line-height:1.6;color:var(--text-subtle);max-width:62ch}

/* Terceiro print de um módulo 2+1: mesma largura de uma coluna do grid
   acima, centralizado — nunca esticado nem alinhado à esquerda. */
.proof-card--single{width:calc((100% - clamp(20px,2.5vw,28px)) / 2);margin:clamp(20px,2.5vw,28px) auto 0}
@media (max-width:880px){
  .proof-card--single{width:100%}
}

/* Lightbox simples pra ampliar print no mobile/desktop sem sair da página */
.lightbox{position:fixed;inset:0;background:var(--overlay-scrim);display:flex;align-items:center;justify-content:center;padding:24px;z-index:100;cursor:zoom-out}
.lightbox img{max-width:100%;max-height:100%;border:1px solid var(--border-inverse)}

/* ——— Quem sou eu ——— */
.about{display:flex;flex-wrap:wrap;gap:clamp(28px,4vw,56px);align-items:center}
.about-photo{flex:4 1 300px}
.about-photo img{width:100%;aspect-ratio:4/5;object-fit:cover}
.about-text{flex:6 1 340px}
.about-text p{font-size:17px;line-height:1.65;color:rgba(245,238,217,.86)}

/* ——— O que você recebe ——— */
.checklist{max-width:760px;border-top:1px solid var(--border-hairline)}
.checklist-item{display:grid;grid-template-columns:32px 1fr;gap:16px;align-items:start;padding:22px 0;border-bottom:1px solid var(--border-hairline)}
.checklist-item .title{font-size:18px;font-weight:var(--weight-semibold);line-height:1.4}
.checklist-item .desc{font-size:16px;line-height:1.6;color:rgba(78,51,29,.65);margin-top:4px}
.checklist-mark{width:24px;height:24px;border:1.75px solid var(--brand-brown);border-radius:999px;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:var(--brand-brown)}
.not-this{max-width:760px;margin-top:clamp(32px,4vw,44px);background:rgba(78,51,29,.06);padding:clamp(24px,3vw,32px)}
.not-this .title{font-size:18px;font-weight:var(--weight-semibold);margin-bottom:10px}
.not-this p{font-size:17px;line-height:1.65}

/* ——— FAQ ——— */
.faq{max-width:62ch;border-top:1px solid var(--border-hairline)}
.faq-item{padding:clamp(24px,3vw,32px) 0;border-bottom:1px solid var(--border-hairline)}
.faq-item h3{font-size:21px;line-height:1.25;margin-bottom:12px}
.faq-item p{font-size:17px;line-height:1.65;color:rgba(78,51,29,.85)}

/* ——— Investimento ——— */
.price-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:clamp(12px,2vw,28px);margin-bottom:clamp(20px,2.5vw,28px)}
.price-value{font-family:var(--font-display);font-weight:var(--weight-black);font-variation-settings:var(--fraunces-heading);font-size:clamp(48px,9vw,96px);line-height:.92;letter-spacing:var(--tracking-display);font-variant-numeric:tabular-nums}
.price-meta{font-size:16px;font-weight:var(--weight-medium);color:rgba(245,238,217,.8)}

.final-cta{border-top:1px solid var(--border-inverse);padding-top:clamp(40px,5vw,64px)}
.final-cta h2{font-size:clamp(28px,4.2vw,48px);line-height:1.08;max-width:24ch;margin-bottom:clamp(20px,2.5vw,28px)}
.final-cta p{font-size:17px;line-height:1.65;color:rgba(245,238,217,.8);max-width:62ch;margin-bottom:clamp(32px,4vw,44px)}

/* ——— Estados de vagas encerradas ——— */
.closed-badge{display:inline-block;background:var(--brand-petrol);color:var(--cream-100);font-size:12px;font-weight:var(--weight-semibold);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;padding:6px 12px;margin-bottom:24px}
.closed-note{font-size:14px;color:var(--text-muted);margin-top:16px}

/* ——— Páginas utilitárias (aplicar / lista de espera) ——— */
.utility-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}
.utility-card{max-width:480px;text-align:center}
.utility-card h1{font-size:clamp(26px,4vw,34px);margin-bottom:16px}
.utility-card p{font-size:16px;line-height:1.6;color:var(--text-muted);margin:0 auto 24px}

footer.site-footer{padding:32px clamp(24px,5vw,64px);font-size:13px;color:var(--text-subtle);text-align:center}

/* Componentes da estrutura aprovada, usando os tokens existentes. */
.hero-badge{margin-bottom:24px;font-size:14px}
.section-after{margin-top:clamp(32px,4vw,44px)}
.conversation .split-item{min-width:0}
.conversation .split-item p:first-child{font-family:var(--font-display);font-size:clamp(22px,2.6vw,28px);line-height:1.3;color:var(--brand-brown)}
.steps{list-style:none;counter-reset:step;max-width:760px;margin:0;padding:0;border-top:1px solid var(--border-hairline)}
.steps li{counter-increment:step;position:relative;padding:24px 0 24px 48px;border-bottom:1px solid var(--border-hairline)}
.steps li:before{content:counter(step,decimal-leading-zero);position:absolute;left:0;top:26px;font-size:14px;color:var(--brand-petrol);font-variant-numeric:tabular-nums}
.steps h3{font-size:23px;margin-bottom:14px}
.proof-card{margin:0;min-width:0}
.image-expand{display:block;width:100%;padding:0;border:0;background:transparent;cursor:zoom-in}
.image-expand img{width:100%;height:auto}
.manual-preview{max-width:940px}
.fit h2{font-size:clamp(22px,2.6vw,28px);margin-bottom:16px}
.fit ul{padding-left:22px;margin:0 0 24px}
.fit li{font-size:17px;line-height:1.65;margin-bottom:16px}
.faq summary{font-family:var(--font-display);font-size:21px;line-height:1.3;cursor:pointer;padding-right:30px;position:relative;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:'+';position:absolute;right:0;top:0;font-family:var(--font-body)}
.faq details[open] summary:after{content:'−'}
.faq details[open] summary{margin-bottom:16px}
.payment-line{line-height:1.6!important}
.offer-price{display:block;font-family:var(--font-display);font-size:clamp(48px,9vw,96px);line-height:1.1;margin-bottom:12px;font-weight:var(--weight-black);letter-spacing:var(--tracking-display)}
.section--inverse .proof-disclaimer{color:rgba(245,238,217,.8)}
.section--inverse .proof-card{color:var(--text-body)}
.lightbox{background:rgba(18,16,13,.94);padding:64px 24px 24px}
.lightbox-close{position:absolute;right:20px;top:12px;width:44px;height:44px;border:1px solid var(--border-inverse);background:var(--brand-cream);color:var(--brand-brown);font-size:30px;cursor:pointer}
.lightbox-scroll{max-width:100%;max-height:100%;overflow:auto;cursor:auto}
.lightbox-scroll img{max-width:none;max-height:none;width:auto;height:auto;max-width:100%;cursor:zoom-in}
.lightbox-scroll.is-zoomed img{max-width:none}
@media(max-width:640px){.btn{max-width:100%;font-size:16px;padding:18px 20px;line-height:1.3}.lightbox{padding:64px 12px 12px}.about-photo,.about-text{min-width:0;flex-basis:100%}}