/* Refinos de layout de 21/10/2026: aberturas com imagem, imagens nos cards,
   linha do tempo, seções em duas colunas e botão de orçamento sólido. */

/* 1. Abertura das páginas internas: quadro do filme ou textura da marca */
.page-hero{min-height:min(78vh,760px);display:flex;flex-direction:column;justify-content:flex-end;isolation:isolate}
.page-hero-copy{position:relative;z-index:1;max-width:1000px}
.page-hero-bg{position:absolute;inset:0;z-index:-2;width:100%;height:100%;max-width:none;object-fit:cover;animation:hero-drift 16s ease-out both}
.page-hero.has-media:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#051c2df5 0%,#051c2dcc 42%,#051c2d33 88%),linear-gradient(0deg,#051c2d 0%,transparent 50%)}
.hero-texture{position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 78% 35%,#143651 0%,#051c2d 62%)}
.hero-texture:after{content:"";position:absolute;right:-8%;top:46%;width:min(1150px,95vw);aspect-ratio:1000/420;transform:translateY(-50%);background:var(--stripes) no-repeat center/contain;opacity:.14}
.page-hero.is-brand>.stripes,.page-hero.has-media>.stripes{display:none}
.page-hero .hero-actions .featured-play{margin-top:0}
.quote-hero{min-height:0;padding-top:190px}
@keyframes hero-drift{from{transform:scale(1.12)}to{transform:scale(1.02)}}

/* 2. Imagens no topo dos cards de "Para quem é" (o quadro que seguia o cursor foi removido a pedido do usuário) */
.audience-card{padding:0 0 30px;overflow:hidden}
.audience-card>:not(.audience-media){margin:0 30px}
.audience-media{aspect-ratio:16/7;overflow:hidden;margin-bottom:6px;background:#0a2638}
.audience-media img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.16,1,.3,1)}
.audience-card:hover .audience-media img{transform:scale(1.06)}
.audience-media.is-texture{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 420'%3E%3Cpath d='M180 266L1000 48V110L180 328Z' fill='%23426c85'/%3E%3Cpath d='M420 372L1000 218V258L420 412Z' fill='%23fefcf5'/%3E%3C/svg%3E") no-repeat 85% 55%/62% auto,radial-gradient(ellipse at 70% 40%,#143651,#0a2638 70%)}

/* 3. "Como funciona" como linha do tempo: a faixa se desenha e liga as etapas */
.timeline{position:relative;border-top:0;padding-top:0}
.timeline.reveal-on-scroll{opacity:1;transform:none}
.timeline:before,.timeline:after{content:"";position:absolute;left:0;right:0;top:10px;height:1px;background:var(--hair-2)}
.timeline:after{height:3px;top:9px;background:var(--editorial);transform:scaleX(0);transform-origin:left;transition:transform 1.8s cubic-bezier(.65,0,.35,1) .2s}
.timeline.is-visible:after,.timeline:not(.reveal-on-scroll):after{transform:scaleX(1)}
.timeline li{padding:58px 34px 0 0}
.timeline li:before{display:none}
.step-mark{position:absolute;top:2px;left:0;width:46px;height:18px;background:var(--editorial);clip-path:polygon(0 76%,100% 0,100% 24%,0 100%);z-index:1}
.timeline .step-num{display:block;font-family:Arial,Helvetica,sans-serif;font-size:clamp(46px,4.2vw,66px);font-weight:600;line-height:1;letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1px #9fbdd0}
.timeline h3{margin-top:20px}

/* 4. Ritmo: títulos menores onde a seção é de apoio, e dúvidas em duas colunas */
.section-head.is-compact h2{font-size:clamp(32px,3.3vw,52px)}
.steps-section,.faq-section{padding-top:96px;padding-bottom:96px}
.split-section{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:6%;align-items:start}
.split-section>.section-head{position:sticky;top:120px;margin-bottom:0}
.split-section .faq-list{max-width:none}

/* 5. Botão de orçamento sólido no cabeçalho e no menu do celular */
.desktop-nav .nav-cta,.desktop-nav .nav-cta[aria-current]{background:var(--paper);color:var(--deep);border-color:var(--paper);font-weight:600}
.desktop-nav .nav-cta:hover{background:#d7e5ee;border-color:#d7e5ee}
.mobile-nav .mobile-cta{align-self:flex-start;padding:15px 22px;border-radius:4px;background:var(--paper);color:var(--deep);font-weight:600}

/* 6. Capa da home mais limpa (sem rótulo e sem linha de base) */
.home-page .hero-copy{margin:auto 0 13vh}

@media(max-width:1000px){.split-section{display:block}.split-section>.section-head{position:static;margin-bottom:34px}}
@media(max-width:700px){
 .page-hero{min-height:68svh}.quote-hero{min-height:0;padding-top:130px}
 .audience-card>:not(.audience-media){margin:0 24px}
 .timeline:before,.timeline:after{left:21px;right:auto;top:0;bottom:0;width:1px;height:auto}
 .timeline:after{width:3px;left:20px;transform:scaleY(0);transform-origin:top}
 .timeline.is-visible:after,.timeline:not(.reveal-on-scroll):after{transform:scaleY(1)}
 .timeline li{padding:0 0 38px 64px}
 .step-mark{top:6px;left:0}
 .timeline .step-num{font-size:44px}
 .home-page .hero-copy{margin-bottom:9vh}
}
@media(prefers-reduced-motion:reduce){.page-hero-bg{animation:none}.timeline:after{transition:none}}