/* ==========================================================================
   Toro Digital — Landing Page (Google Ads)
   Design tokens herdados do material de marca fornecido: petróleo + prata +
   azul, Playfair Display (display) + Open Sans (texto).
   ========================================================================== */

:root{
  --petrol:#0D1B2A;
  --petrol-soft:#142235;
  --blue:#003366;
  --blue-light:#1d4e89;
  --accent:#7fa9d1;
  --action:#FF6B00;
  --action-dark:#E85A00;
  --positive:#9fc4a8;
  --warn:#c98a3b;
  --silver:#C0C0C0;
  --paper:#F6F5F2;
  --white:#FFFFFF;
  --ink:#0D1B2A;
  --ink-soft:#4a5a68;
  --ink-mute:#7a8a99;
  --line:rgba(185,197,192,.22);
  --line-dark:rgba(16,29,36,.13);
  --serif:'Playfair Display', Georgia, serif;
  --sans:'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --ease:cubic-bezier(.22,1,.36,1);
  --radius-lg:18px;
  --radius:14px;
  --radius-sm:8px;
  --header-h:78px;
}

/* ===== Reset ===== */
*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
}
body{
  font-family:var(--sans);
  background:var(--paper);
  color:var(--ink);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
a{ color:inherit; text-decoration:none; }
img,svg{ display:block; max-width:100%; }
button{ font-family:inherit; cursor:pointer; }
ul{ list-style:none; }
h1,h2,h3,h4{ font-family:var(--serif); font-weight:600; }
.wrap{ max-width:1180px; margin:0 auto; padding:0 32px; }
@media(max-width:640px){ .wrap{ padding:0 20px; } }

/* ===== Acessibilidade ===== */
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0,0,0,0); white-space:nowrap; border:0;
}
.skip-link{
  position:absolute; left:12px; top:-60px; z-index:1000;
  background:var(--white); color:var(--petrol); padding:12px 18px; border-radius:6px;
  font-weight:600; font-size:14px; transition:top .2s var(--ease);
}
.skip-link:focus{ top:12px; }
:focus-visible{ outline:2.5px solid var(--accent); outline-offset:2px; }

/* ===== Placeholder marker ===== */
.ph{
  background:rgba(201,138,59,.14);
  border:1px dashed rgba(201,138,59,.6);
  padding:.03em .4em;
  border-radius:4px;
  font-style:normal;
}

/* ===== Reveal on scroll ===== */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.reveal.in{ opacity:1; transform:translateY(0); }
.reveal-delay-1.in{ transition-delay:.1s; }
.reveal-delay-2.in{ transition-delay:.2s; }
.reveal-delay-3.in{ transition-delay:.3s; }
@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1; transform:none; }
}

/* Garante que o atributo [hidden] nunca seja sobrescrito por display de componente */
[hidden]{ display:none !important; }

/* ===== Botões ===== */
.btn-primary{
  background:var(--action); color:var(--white); padding:15px 26px; border:none; border-radius:999px;
  font-weight:600; font-size:15px; display:inline-flex; align-items:center; justify-content:center; gap:10px;
  box-shadow:0 10px 25px rgba(255,107,0,.3); transition:background .25s, transform .25s, box-shadow .25s;
}
.btn-primary:hover{ background:var(--action-dark); transform:translateY(-2px); box-shadow:0 14px 30px rgba(255,107,0,.38); }
.btn-ghost{
  border:1px solid rgba(255,255,255,.32); color:var(--white); padding:15px 26px; border-radius:999px;
  font-weight:600; font-size:15px; background:transparent; transition:border-color .25s, background .25s;
}
.btn-ghost:hover{ border-color:rgba(255,255,255,.6); background:rgba(255,255,255,.05); }
.btn-ghost-dark{
  border:1px solid var(--line-dark); color:var(--ink); padding:14px 24px; border-radius:999px;
  font-weight:600; font-size:14.5px; background:transparent; transition:border-color .25s, background .25s;
}
.btn-ghost-dark:hover{ border-color:var(--ink-mute); background:rgba(16,29,36,.04); }
.btn-whatsapp{
  background:#1f7a52; color:var(--white); padding:15px 26px; border-radius:999px; font-weight:600; font-size:15px;
  display:inline-flex; align-items:center; gap:10px; transition:background .25s, transform .25s;
}
.btn-whatsapp:hover{ background:#186142; transform:translateY(-2px); }
.btn-primary[disabled]{ opacity:.55; cursor:not-allowed; transform:none; }

/* ==========================================================================
   HEADER
   ========================================================================== */
header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  background:rgba(13,27,42,.86); backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(185,197,192,.16);
}
.nav{ display:flex; align-items:center; justify-content:space-between; height:var(--header-h); }
.logo{ display:flex; align-items:center; gap:12px; }
.logo-mark{ width:28px; height:auto; border-radius:5px; }
.logo-text{ font-family:var(--serif); font-size:20px; color:var(--white); font-weight:600; }
.logo-tag{ display:block; font-family:var(--sans); font-size:10px; color:var(--silver); letter-spacing:1.6px; text-transform:uppercase; margin-top:1px; }
.nav-links{ display:flex; gap:30px; align-items:center; }
.nav-links a{ color:var(--silver); font-size:13.5px; font-weight:500; transition:color .25s; }
.nav-links a:hover{ color:var(--white); }
.nav-cta{ padding:12px 20px; font-size:13.5px; }
.nav-toggle{ display:none; background:none; border:none; padding:6px; }
.nav-toggle span{ display:block; width:24px; height:2px; background:var(--white); margin:5px 0; transition:transform .3s var(--ease), opacity .3s var(--ease); }
.nav-toggle.open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav-toggle.open span:nth-child(2){ opacity:0; }
.nav-toggle.open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }
.mobile-panel{
  display:none; position:fixed; top:var(--header-h); left:0; right:0; background:var(--petrol);
  border-bottom:1px solid var(--line); padding:0 20px; z-index:99; max-height:0; overflow:hidden;
  transition:max-height .35s var(--ease);
}
.mobile-panel.open{ max-height:360px; padding-bottom:22px; }
.mobile-panel a{ display:block; color:var(--silver); font-size:15px; padding:14px 0; border-top:1px solid var(--line); }
.mobile-panel a:first-child{ border-top:none; }
.mobile-panel .nav-cta{ display:inline-flex; margin-top:14px; }
@media(max-width:900px){
  .nav-links{ display:none; }
  .nav-cta.desktop-only{ display:none; }
  .nav-toggle{ display:block; }
  .mobile-panel{ display:block; }
}

/* ==========================================================================
   HERO
   ========================================================================== */
.hero{
  position:relative; overflow:hidden; color:var(--white);
  padding:var(--header-h) 0 80px;
  background:
    radial-gradient(circle at 78% 22%, rgba(0,51,102,.4), transparent 32%),
    linear-gradient(135deg,#0D1B2A 0%, #142235 58%, #0D1B2A 100%);
}
@media(min-width:960px){
  .hero{ padding:calc(var(--header-h) + 72px) 0 96px; }
}
.hero::before{
  content:''; position:absolute; width:480px; height:480px; right:-160px; top:80px;
  border:1px solid rgba(192,192,192,.2); border-radius:50%;
  box-shadow:0 0 0 36px rgba(192,192,192,.045), 0 0 0 72px rgba(192,192,192,.025);
  pointer-events:none;
}
.hero::after{
  content:''; position:absolute; inset:0;
  background-image:linear-gradient(rgba(192,192,192,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(192,192,192,.05) 1px, transparent 1px);
  background-size:56px 56px;
  mask-image:linear-gradient(to bottom, black, transparent 82%);
  pointer-events:none;
}
.hero-inner{ position:relative; z-index:2; max-width:760px; }

/* ==========================================================================
   HERO — grade com rotator de fotos de clientes reais
   Mobile: foto em tela cheia (sangria), badge no canto, título por cima com
   sombra escura. Desktop (≥960px): foto some para uma coluna ao lado, título
   volta a ficar em texto simples, sem sobrepor a imagem.
   ========================================================================== */
.hero-grid{
  position:relative; z-index:2; display:grid; grid-template-columns:1fr;
  max-width:1180px; margin:0 auto;
}
.hero-photo-rotator{
  grid-column:1; grid-row:1;
  position:relative; overflow:hidden; aspect-ratio:3/4.4;
  border-radius:0 0 28px 28px; background:var(--petrol-soft);
  box-shadow:0 30px 70px rgba(0,0,0,.4);
}
.hpr-slide{ position:absolute; inset:0; opacity:0; transition:opacity 1.1s var(--ease); }
.hpr-slide.is-active{ opacity:1; z-index:2; }
/* object-position joga o enquadramento pra cima: o rosto fica na metade
   superior da foto, sobrando ombro/fundo (não rosto) na parte de baixo,
   que é onde o título fica sobreposto. */
.hpr-slide img{ width:100%; height:100%; object-fit:cover; object-position:50% 12%; display:block; }
.hpr-slide::after{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(to bottom, rgba(13,27,42,0) 26%, rgba(13,27,42,.7) 52%, rgba(13,27,42,.96) 76%, rgba(13,27,42,.98) 100%);
}
.hpr-badge{
  position:absolute; left:18px; top:18px; z-index:3;
  background:rgba(13,27,42,.88); backdrop-filter:blur(6px); border-left:3px solid var(--positive);
  border-radius:0 12px 12px 0; padding:9px 16px;
}
.hpr-badge em{ display:block; font-style:normal; font-size:9.5px; letter-spacing:1.3px; text-transform:uppercase; color:var(--silver); margin-bottom:3px; }
.hpr-badge strong{ display:block; font-size:14.5px; color:var(--white); font-weight:700; line-height:1.2; }
.hpr-badge span{ display:block; font-size:11.5px; color:var(--accent); margin-top:1px; }

.hpr-dots{
  position:absolute; left:0; right:0; bottom:16px; z-index:5;
  display:flex; justify-content:center; gap:9px;
}
.hpr-dot{
  width:9px; height:9px; border-radius:50%; border:none; padding:0;
  background:rgba(255,255,255,.4); box-shadow:0 0 0 1px rgba(0,0,0,.15);
  transition:background .25s, transform .25s; cursor:pointer;
}
.hpr-dot:hover{ background:rgba(255,255,255,.7); }
.hpr-dot.is-active{ background:var(--positive); transform:scale(1.25); }

.hero-copy-overlay{
  grid-column:1; grid-row:1; align-self:end; position:relative; z-index:4;
  padding:0 32px 28px;
}
.hero-copy-overlay h1{ font-size:clamp(26px,7vw,42px); max-width:14ch; }
.hero-copy-overlay .hero-sub{ color:#e7ebee; font-size:15.5px; margin-top:14px; }
.hero-copy-below{ grid-column:1; grid-row:2; padding-top:32px; }
@media(max-width:640px){
  .hero-copy-overlay{ padding-left:20px; padding-right:20px; }
}

@media(min-width:960px){
  .hero-grid{ grid-template-columns:1.1fr .95fr; column-gap:56px; padding:0 32px; }
  .hero-photo-rotator{
    grid-column:2; grid-row:1 / span 2; align-self:center;
    aspect-ratio:4/5; border-radius:var(--radius-lg);
  }
  .hero-copy-overlay{ grid-column:1; grid-row:1; align-self:end; padding:0; }
  .hero-copy-overlay h1{ font-size:clamp(32px,5.6vw,54px); max-width:15ch; }
  .hero-copy-overlay .hero-sub{ font-size:17.5px; }
  .hero-copy-below{ grid-column:1; grid-row:2; padding-top:0; }
  .hero-copy-below.wrap{ max-width:none; margin:0; padding:0; }
}
@media(max-width:640px){
  .hero-photo-rotator{ aspect-ratio:3/4.6; }
}

.eyebrow{
  display:inline-flex; align-items:center; gap:9px; font-size:12px; letter-spacing:2px;
  text-transform:uppercase; color:var(--silver); margin-bottom:26px;
}
.eyebrow-dot{ width:6px; height:6px; border-radius:50%; background:var(--positive); box-shadow:0 0 0 5px rgba(159,196,168,.18); }
h1{
  font-size:clamp(32px,5.6vw,54px); line-height:1.12; letter-spacing:-.6px; color:var(--white); max-width:15ch;
}
.hero-sub{ font-size:17.5px; color:var(--silver); max-width:56ch; margin:24px 0 0; line-height:1.7; }
.hero-trust{ font-size:13.5px; color:var(--accent); margin:16px 0 32px; font-weight:600; letter-spacing:.2px; }
.hero-ctas{ display:flex; gap:14px; flex-wrap:wrap; margin-bottom:16px; }
.hero-microcopy{ font-size:13px; color:var(--ink-mute); margin-bottom:40px; }
.dor-link{ font-size:15px; font-weight:600; color:var(--blue); }
.dor-link:hover{ text-decoration:underline; }
.trust-bar{ display:flex; flex-wrap:wrap; border-top:1px solid var(--line); padding-top:30px; max-width:720px; }
.trust-item{ padding-right:32px; margin-right:32px; border-right:1px solid var(--line); }
.trust-item:last-child{ border-right:none; margin-right:0; padding-right:0; }
.trust-num{ font-family:var(--serif); font-size:25px; color:var(--white); font-weight:600; }
.trust-label{ font-size:12px; color:var(--ink-mute); margin-top:4px; max-width:20ch; }
@media(max-width:700px){ .trust-item{ padding-right:20px; margin-right:20px; margin-bottom:16px; } }
@media(max-width:640px){
  .hero{ padding-bottom:64px; }
  .hero-ctas a,.hero-ctas button{ width:100%; }
  .hero::before{ width:280px; height:280px; right:-140px; top:60px; }
}

/* ===== Gauge (elemento de assinatura visual) ===== */
.gauge-section{ background:var(--petrol); padding:0 0 96px; position:relative; z-index:2; }
.gauge-wrap{ max-width:820px; margin:0 auto; text-align:center; }
.gauge-label{ color:var(--ink-mute); font-size:12px; letter-spacing:2px; text-transform:uppercase; margin-bottom:16px; }
.gauge-svg{ width:100%; height:auto; }
.gauge-caption{ display:flex; justify-content:space-between; gap:10px; margin-top:12px; font-size:13px; color:var(--silver); flex-wrap:wrap; }
.gauge-caption span:nth-child(2){ color:var(--positive); font-weight:600; }
#needle{ transform:translateX(-220px); transition:transform 1.4s var(--ease) .2s; }
.gauge-wrap.in #needle{ transform:translateX(0); }
#needleLanding{ opacity:0; transition:opacity .5s ease 1.5s; }
.gauge-wrap.in #needleLanding{ opacity:1; }
@media(max-width:640px){ .gauge-caption{ font-size:11px; } }

/* ==========================================================================
   SECTION GENÉRICA
   ========================================================================== */
section{ padding:100px 0; }
/* Duas seções seguidas com o mesmo fundo (sem contraste de cor pra separar)
   não precisam do espaçamento inteiro dobrado — some visualmente como buraco.
   Reduz os dois lados do encontro (base da primeira + topo da segunda). */
.section-light + .section-light,
.section-dark + .section-dark{ padding-top:40px; }
.section-light:has(+ .section-light),
.section-dark:has(+ .section-dark){ padding-bottom:40px; }
.section-light{ background:var(--paper); }
.section-dark{ background:var(--petrol); color:var(--white); }
.kicker{ font-size:12px; letter-spacing:2px; text-transform:uppercase; color:var(--blue); font-weight:700; margin-bottom:14px; }
.section-dark .kicker{ color:var(--accent); }
h2{ font-size:clamp(27px,3.6vw,40px); line-height:1.2; letter-spacing:-.4px; max-width:17ch; }
.section-intro{ display:flex; justify-content:space-between; align-items:flex-end; gap:40px; margin-bottom:58px; flex-wrap:wrap; }
.section-intro p{ max-width:40ch; color:var(--ink-soft); font-size:15.5px; }
.section-dark .section-intro p{ color:var(--silver); }
@media(max-width:640px){
  section{ padding:72px 0; }
  .section-light + .section-light,
  .section-dark + .section-dark{ padding-top:32px; }
  .section-intro{ margin-bottom:40px; }
}

/* ===== Segmentos (Para quem é) ===== */
.segment-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.segment-card{
  background:var(--white); border:1px solid var(--line-dark); border-radius:var(--radius);
  padding:28px 22px; text-align:center; box-shadow:0 14px 30px rgba(16,29,36,.08);
}
.segment-card svg{ width:26px; height:26px; color:var(--action); margin:0 auto 16px; }
.segment-card h4{
  font-family:var(--sans); font-size:12.5px; letter-spacing:1px; text-transform:uppercase;
  font-weight:700; color:var(--action); margin-bottom:10px;
}
.segment-card p{ font-size:13.5px; color:var(--ink-soft); line-height:1.65; }
@media(max-width:860px){ .segment-grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:520px){ .segment-grid{ grid-template-columns:1fr; } }

/* ===== Nossos serviços ===== */
.service-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.service-card{
  background:var(--white); border:1px solid var(--line-dark); border-radius:var(--radius);
  padding:30px 24px; text-align:center; display:flex; flex-direction:column;
  box-shadow:0 14px 30px rgba(16,29,36,.045);
}
.service-card h3{ font-size:17px; margin-bottom:12px; line-height:1.25; }
.service-card p{ font-size:13.5px; color:var(--ink-soft); line-height:1.65; margin-bottom:22px; flex:1; }
.service-card .btn-primary{ font-size:13px; padding:12px 18px; align-self:center; }
.service-whatsapp{
  display:inline-flex; align-items:center; gap:6px; margin-top:14px; align-self:center;
  font-size:12.5px; color:#1f7a52; font-weight:600;
}
.service-whatsapp:hover{ text-decoration:underline; }
@media(max-width:900px){ .service-grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:520px){ .service-grid{ grid-template-columns:1fr; } }

/* ===== Pra quem é, na prática ===== */
.fit-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:14px; margin-bottom:56px; }
.fit-card{
  background:var(--blue); border:none; border-radius:var(--radius);
  padding:26px 18px; text-align:center; box-shadow:0 14px 30px rgba(0,51,102,.18);
}
.fit-card svg{ width:28px; height:28px; margin:0 auto 16px; color:var(--white); }
.fit-card p{ font-size:13.5px; color:rgba(255,255,255,.9); line-height:1.6; }
@media(max-width:960px){ .fit-grid{ grid-template-columns:repeat(3,1fr); } }
@media(max-width:640px){ .fit-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:420px){ .fit-grid{ grid-template-columns:1fr; } }

/* ===== Transformação (antes/depois) ===== */

.shift{ display:grid; grid-template-columns:1fr auto 1fr; gap:28px; align-items:stretch; margin-top:8px; }
.shift-col{ background:var(--white); border:1px solid var(--line-dark); border-radius:var(--radius); padding:30px 28px; }
.shift-col h4{ font-size:13px; letter-spacing:1.5px; text-transform:uppercase; margin-bottom:18px; color:var(--ink-soft); }
.shift-col ul li{ font-size:14.5px; color:var(--ink-soft); padding:10px 0; border-top:1px solid var(--line-dark); display:flex; gap:10px; }
.shift-col ul li:first-child{ border-top:none; padding-top:0; }
.shift-col.after{ background:var(--blue); border-color:var(--blue); box-shadow:0 22px 48px rgba(0,51,102,.28); }
.shift-col.after h4{ color:#bcd2eb; }
.shift-col.after ul li{ color:var(--white); border-top-color:rgba(255,255,255,.16); }
.shift-col.before ul li::before{ content:'✕'; color:#b43c3c; font-weight:700; font-size:13px; line-height:1.6; flex-shrink:0; }
.shift-col.after ul li::before{ content:'✓'; color:var(--positive); font-weight:700; font-size:14px; line-height:1.6; flex-shrink:0; }
.shift-arrow{ display:flex; align-items:center; color:var(--ink-mute); }
@media(max-width:760px){ .shift{ grid-template-columns:1fr; } .shift-arrow{ display:none; } }

/* ===== Feature rows ===== */
.feature-row{ display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center; padding:64px 0; border-top:1px solid var(--line-dark); }
.feature-row:first-child{ border-top:none; padding-top:0; }
.feature-row.rev .f-text{ order:2; }
.feature-num{ font-size:11px; text-transform:uppercase; letter-spacing:2px; color:var(--blue); font-weight:700; margin-bottom:12px; }
.f-text h3{ font-size:27px; margin-bottom:14px; letter-spacing:-.3px; line-height:1.15; }
.f-text p{ color:var(--ink-soft); font-size:15.5px; line-height:1.75; }
.f-visual{
  background:linear-gradient(145deg,var(--petrol-soft),var(--blue)); border-radius:var(--radius-lg);
  aspect-ratio:4/3; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden;
  box-shadow:0 22px 50px rgba(16,29,36,.18);
}
.f-visual::after{ content:''; position:absolute; inset:18px; border:1px solid rgba(192,192,192,.18); border-radius:12px; }
.f-visual svg.icon{ width:32%; position:relative; z-index:2; }
@media(max-width:800px){
  .feature-row,.feature-row.rev{ grid-template-columns:1fr; gap:28px; padding:48px 0; }
  .feature-row.rev .f-text{ order:0; }
}

/* ===== Comparativo ===== */
.compare{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; align-items:start; }
.compare-col{ background:transparent; border:none; border-top:3px solid var(--line-dark); border-radius:0; padding:26px 10px 0; box-shadow:none; }
.compare-col.mid{ background:var(--blue); color:var(--white); border-top:none; border-radius:var(--radius); padding:32px 26px; transform:translateY(-12px); box-shadow:0 22px 48px rgba(0,51,102,.32); }
.compare-head{ font-family:var(--serif); font-size:21px; font-weight:600; margin-bottom:4px; }
.compare-price{ font-size:13.5px; color:var(--ink-soft); margin-bottom:22px; }
.compare-col.mid .compare-price{ color:#bcd2eb; margin-bottom:8px; }
.compare-highlight{ font-size:13px; color:var(--white); font-weight:600; margin-bottom:22px; }
.compare-row{ display:flex; gap:10px; align-items:flex-start; font-size:14px; padding:10px 0; border-top:1px solid var(--line-dark); }
.compare-col.mid .compare-row{ border-top:1px solid rgba(255,255,255,.16); }
.compare-row:first-of-type{ border-top:none; }
.compare-col:not(.mid) .compare-row::before{ content:'✕'; color:#b43c3c; font-weight:700; font-size:13px; line-height:1.6; flex-shrink:0; }
.compare-col.mid .compare-row::before{ content:'✓'; color:var(--positive); font-weight:700; font-size:14px; line-height:1.6; flex-shrink:0; }
.tag-mid{ display:inline-block; background:rgba(255,255,255,.18); color:var(--white); font-size:10.5px; font-weight:700; letter-spacing:1.3px; text-transform:uppercase; padding:5px 12px; border-radius:999px; margin-bottom:14px; }
.tag-outer{ display:block; font-size:10.5px; font-weight:700; letter-spacing:1.3px; text-transform:uppercase; color:var(--ink-soft); margin-bottom:10px; }

/* Mobile: régua vertical — escondida no desktop */
.compare-ruler,.compare-why{ display:none; }

@media(max-width:860px){
  .compare{ display:none; }
  .compare-ruler{ display:block; }
  .compare-why{ display:block; }

  .ruler-step{ background:var(--white); border:1px solid var(--line-dark); border-radius:var(--radius); padding:24px 22px; }
  .ruler-label{ display:block; font-size:10.5px; font-weight:700; letter-spacing:1.2px; text-transform:uppercase; color:var(--ink-soft); margin-bottom:8px; }
  .ruler-step h3{ font-family:var(--serif); font-size:19px; font-weight:600; margin-bottom:4px; }
  .ruler-price{ font-size:14px; color:var(--ink-soft); margin-bottom:12px; }
  .ruler-desc{ font-size:13.5px; color:var(--ink-soft); line-height:1.65; }
  .ruler-desc::before{ content:'✕ '; color:#b43c3c; font-weight:700; }

  .ruler-arrow{ text-align:center; color:var(--ink-soft); font-size:20px; line-height:1; padding:10px 0; }

  .ruler-step.mid{
    background:var(--blue); border-color:var(--blue); color:var(--white);
    padding:30px 26px; box-shadow:0 22px 44px rgba(0,51,102,.3); position:relative; z-index:1;
  }
  .ruler-step.mid .ruler-label{ color:#bcd2eb; }
  .ruler-step.mid h3{ color:var(--white); font-size:23px; }
  .ruler-step.mid .ruler-price{ color:var(--silver); font-size:15px; font-weight:600; margin-bottom:16px; }
  .ruler-features{ display:grid; gap:0; }
  .ruler-features li{
    display:flex; gap:9px; align-items:flex-start; font-size:13.5px; color:#e4eaf0;
    padding:10px 0; border-top:1px solid rgba(255,255,255,.16);
  }
  .ruler-features li:first-child{ border-top:none; }
  .ruler-features li::before{ content:'✓'; color:var(--positive); font-weight:700; flex-shrink:0; }

  .compare-why{
    margin-top:28px; background:var(--white); border:1px solid var(--line-dark);
    border-radius:var(--radius); padding:24px 22px;
  }
  .compare-why h4{ font-family:var(--serif); font-size:16.5px; font-weight:600; color:var(--ink); margin-bottom:10px; }
  .compare-why p{ font-size:13.5px; color:var(--ink-soft); line-height:1.7; }
}

/* ===== Como funciona (divisão de responsabilidade) ===== */
.routine-split{
  display:grid; grid-template-columns:1fr 1.7fr; border-radius:var(--radius-lg); overflow:hidden;
  box-shadow:0 22px 50px rgba(16,29,36,.12);
}
.routine-col{ padding:40px 34px; color:var(--white); }
.routine-col.yours{ background:var(--petrol); }
.routine-col.ours{ background:var(--blue); }
.routine-col h3{ font-family:var(--serif); font-size:17px; font-weight:600; line-height:1.35; max-width:20ch; margin-bottom:28px; }
.routine-col.yours h3{ color:var(--silver); }
.routine-steps{ display:grid; grid-template-columns:repeat(2,1fr); gap:22px; }
.routine-col.ours .routine-steps{ grid-template-columns:repeat(4,1fr); }
.routine-num{ display:block; font-family:var(--serif); font-size:26px; font-weight:700; margin-bottom:8px; }
.routine-col.yours .routine-num{ color:var(--silver); }
.routine-col.ours .routine-num{ color:var(--positive); }
.routine-step p{ font-size:13px; line-height:1.6; color:rgba(255,255,255,.85); }
@media(max-width:900px){
  .routine-split{ grid-template-columns:1fr; }
  .routine-col.ours .routine-steps{ grid-template-columns:repeat(2,1fr); }
}
@media(max-width:520px){
  .routine-steps, .routine-col.ours .routine-steps{ grid-template-columns:1fr; }
}

/* ===== Como funciona ===== */
.steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:40px; }
.step{ position:relative; padding-top:24px; }
.step-line{ position:absolute; top:11px; left:34px; right:-40px; height:1px; background:var(--line); }
.step:last-child .step-line{ display:none; }
.step-dot{ width:22px; height:22px; border-radius:50%; border:2px solid var(--positive); background:var(--petrol); margin-bottom:18px; }
.step h4{ font-size:18px; margin-bottom:8px; }
.step p{ font-size:14px; color:var(--silver); }
@media(max-width:800px){ .steps{ grid-template-columns:1fr; gap:28px; } .step-line{ display:none; } }

/* ===== Atendimento / Autoridade ===== */
.support-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:64px; align-items:center; }
.support-list{ margin-top:24px; }
.support-item{ display:flex; gap:14px; padding:16px 0; border-top:1px solid rgba(255,255,255,.12); }
.support-item:first-child{ border-top:none; padding-top:0; }
.support-icon{ flex-shrink:0; width:20px; height:20px; margin-top:2px; color:var(--accent); }
.support-item strong{ display:block; font-size:15px; margin-bottom:3px; color:var(--white); }
.support-item span{ font-size:13.5px; color:var(--silver); }
.support-signature{ margin-top:24px; padding-top:20px; border-top:1px solid rgba(255,255,255,.12); font-size:13.5px; color:var(--accent); font-weight:600; }
.support-signature span{ color:var(--silver); font-weight:400; margin:0 4px; }
.credential-card{ background:var(--petrol-soft); border:1px solid var(--line); border-radius:var(--radius-lg); padding:34px; }
.credential-map{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:16px; padding-bottom:28px; margin-bottom:6px; border-bottom:1px solid var(--line); }
.credential-map img{ width:220px; height:auto; max-width:100%; }
.credential-map strong{ display:block; font-size:16px; color:var(--white); margin-bottom:4px; }
.credential-map span{ font-size:13px; color:var(--silver); }
.credential-row{ display:flex; justify-content:space-between; gap:14px; padding:15px 0; border-top:1px solid var(--line); font-size:13.5px; }
.credential-row:first-child{ border-top:none; padding-top:0; }
.credential-row span:first-child{ color:var(--silver); }
.credential-row span:last-child{ color:var(--white); font-weight:600; text-align:right; }
@media(max-width:860px){ .support-grid{ grid-template-columns:1fr; gap:36px; } }

/* ===== Elegibilidade ===== */
#elegibilidade{ background:linear-gradient(135deg,var(--blue),#001f3f); }
.elig-box{
  background:var(--petrol-soft); border:1px solid var(--line); border-radius:var(--radius-lg); padding:44px;
  opacity:0; transform:scale(.97); transition:opacity .7s var(--ease), transform .7s var(--ease);
}
.elig-box.in{ opacity:1; transform:scale(1); }
.elig-check{
  display:flex; gap:16px; align-items:flex-start; padding:16px 14px; border-top:1px solid var(--line);
  margin:0 -14px; border-radius:var(--radius-sm); cursor:pointer; transition:background .2s;
}
.elig-check:first-child{ border-top:none; }
.elig-check:hover{ background:rgba(255,255,255,.05); }
.elig-input{ position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
.elig-check .check-circle{ flex-shrink:0; width:24px; height:24px; margin-top:2px; }
.elig-check .check-circle circle{ fill:none; stroke:var(--silver); stroke-width:1.5; transition:stroke .2s; }
.elig-check .check-circle path{
  fill:none; stroke:var(--positive); stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round;
  stroke-dasharray:20; stroke-dashoffset:20; transition:stroke-dashoffset .3s ease;
}
.elig-check:has(.elig-input:checked){ background:rgba(159,196,168,.1); }
.elig-check:has(.elig-input:checked) .check-circle circle{ stroke:var(--positive); }
.elig-check:has(.elig-input:checked) .check-circle path{ stroke-dashoffset:0; }
.elig-check:has(.elig-input:checked) strong{ color:var(--positive); }
.elig-check strong{ font-size:15px; display:block; margin-bottom:2px; color:var(--white); transition:color .2s; }
.elig-check span{ font-size:13.5px; color:var(--silver); }
.elig-solution{
  display:block; font-size:13px !important; color:var(--positive) !important; font-weight:600;
  max-height:0; overflow:hidden; opacity:0; margin-top:0;
  transition:max-height .3s ease, opacity .3s ease, margin-top .3s ease;
}
.elig-check:has(.elig-input:checked) .elig-solution{ max-height:80px; opacity:1; margin-top:8px; }
.elig-counter{ text-align:center; margin-top:20px; font-size:14px; color:var(--accent); font-weight:600; min-height:1.4em; }

/* ===== Prova social ===== */
.testimonial-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(270px,1fr)); gap:20px; align-items:stretch; }
.testimonial-card{
  background:var(--white); border:1px solid var(--line-dark); border-radius:var(--radius);
  padding:26px 24px; box-shadow:0 14px 30px rgba(16,29,36,.045);
  display:flex; flex-direction:column;
}
.testimonial-card p{ font-size:14px; color:var(--ink-soft); line-height:1.7; flex:1; }
.testimonial-card p strong{ color:var(--ink); }
.testimonial-head{ display:flex; align-items:flex-start; gap:12px; margin-bottom:16px; }
.testimonial-avatar{
  flex-shrink:0; width:38px; height:38px; border-radius:50%; background:var(--line-dark);
  display:flex; align-items:center; justify-content:center; font-weight:700; color:var(--ink-mute); font-size:15px;
}
.testimonial-avatar.c1{ background:rgba(0,51,102,.12); color:var(--blue); }
.testimonial-avatar.c2{ background:rgba(159,196,168,.22); color:#4f7d5b; }
.testimonial-avatar.c3{ background:rgba(127,169,209,.22); color:var(--blue-light); }
.testimonial-avatar.c4{ background:rgba(255,107,0,.14); color:var(--action-dark); }
.testimonial-avatar.c5{ background:rgba(31,122,82,.16); color:#1f7a52; }
.testimonial-head > div{ flex:1; }
.testimonial-who{ font-size:13.5px; color:var(--ink); font-weight:700; }
.testimonial-meta{ display:block; font-size:11px; color:var(--ink-mute); margin-top:1px; }
.testimonial-stars{ display:block; font-size:12.5px; color:#e8a33d; letter-spacing:1px; margin-top:3px; }
.testimonial-time{ color:var(--ink-mute); font-size:11px; letter-spacing:0; font-weight:400; }
.testimonial-google{ flex-shrink:0; width:18px; height:18px; margin-top:2px; }
.testimonial-shot{ padding:10px; justify-content:center; }
.testimonial-shot img{ width:100%; border-radius:8px; display:block; }
@media(max-width:640px){ .testimonial-grid{ grid-template-columns:1fr; } }

/* ===== Objeções / FAQ ===== */
.faq-list{ max-width:820px; }
details.faq-item{
  border-top:1px solid var(--line-dark); padding:20px 0;
}
details.faq-item:last-child{ border-bottom:1px solid var(--line-dark); }
details.faq-item summary{
  list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:20px;
  font-size:16px; font-weight:600; color:var(--ink);
}
details.faq-item summary::-webkit-details-marker{ display:none; }
details.faq-item summary .plus{ flex-shrink:0; width:22px; height:22px; position:relative; }
details.faq-item summary .plus::before,
details.faq-item summary .plus::after{ content:''; position:absolute; background:var(--blue); transition:transform .25s var(--ease); }
details.faq-item summary .plus::before{ left:0; top:50%; width:100%; height:2px; transform:translateY(-50%); }
details.faq-item summary .plus::after{ top:0; left:50%; width:2px; height:100%; transform:translateX(-50%); }
details.faq-item[open] summary .plus::after{ transform:translateX(-50%) rotate(90deg); opacity:0; }
details.faq-item p{ margin-top:14px; font-size:14.5px; color:var(--ink-soft); max-width:64ch; line-height:1.75; }

/* ===== Preço / Oferta ===== */
.price-grid{ display:flex; justify-content:center; }
.price-card{
  background:linear-gradient(145deg,var(--petrol),var(--blue)); color:var(--white);
  border-radius:var(--radius-lg); padding:46px 42px; text-align:center; position:relative; overflow:hidden;
  max-width:480px; width:100%;
}
.price-card::before{ content:''; position:absolute; top:-40%; right:-20%; width:70%; height:140%; background:radial-gradient(circle, rgba(0,51,102,.55), transparent 65%); }
.price-value{ font-family:var(--serif); font-size:52px; font-weight:700; position:relative; z-index:2; margin:10px 0 4px; }
.price-value span{ font-size:16px; color:var(--silver); font-weight:400; font-family:var(--sans); }
.price-note{ color:var(--silver); font-size:13.5px; margin-bottom:26px; position:relative; z-index:2; max-width:32ch; margin-inline:auto; }
.price-list{ text-align:left; position:relative; z-index:2; margin-bottom:26px; }
.price-list li{ display:flex; gap:12px; padding:10px 0; font-size:14px; color:#dfe6ec; border-top:1px solid rgba(255,255,255,.1); }
.price-list li:first-child{ border-top:none; }
.price-fine{ font-size:12px; color:var(--silver); position:relative; z-index:2; }
.scope-out{ background:var(--white); border:1px solid var(--line-dark); border-radius:var(--radius); padding:34px 30px; }
.scope-out h4{ font-size:15px; margin-bottom:16px; color:var(--ink); }
.scope-out ul li{ font-size:14px; color:var(--ink-soft); padding:9px 0; border-top:1px solid var(--line-dark); }
.scope-out ul li:first-child{ border-top:none; }
@media(max-width:860px){ .price-grid{ grid-template-columns:1fr; } }

/* ==========================================================================
   FORMULÁRIO MULTIETAPA
   ========================================================================== */
#elegibilidade-form{ background:var(--petrol); }
.form-shell{
  max-width:640px; margin:0 auto; background:var(--white); border:1px solid var(--line-dark);
  border-radius:var(--radius-lg); padding:44px; box-shadow:0 24px 60px rgba(0,0,0,.28);
}
@media(max-width:640px){ .form-shell{ padding:26px 22px; } }
.form-intro{ font-size:14.5px; color:var(--ink-soft); line-height:1.6; margin-bottom:24px; }
.form-progress{ height:5px; background:var(--line-dark); border-radius:4px; overflow:hidden; margin-bottom:14px; }
.form-progress-bar{ display:block; height:100%; width:25%; background:var(--positive); transition:width .4s var(--ease); border-radius:4px; }
.form-steps-label{ font-size:12px; letter-spacing:1px; text-transform:uppercase; color:var(--ink-mute); margin-bottom:28px; }
.lead-form legend{ font-family:var(--serif); font-size:22px; color:var(--ink); margin-bottom:6px; font-weight:600; }
.step-hint{ font-size:13.5px; color:var(--ink-soft); margin-bottom:22px; }
.radio-group{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
@media(max-width:520px){ .radio-group{ grid-template-columns:1fr; } }
.radio-card{
  display:flex; align-items:center; gap:10px; border:1px solid var(--line-dark); border-radius:var(--radius-sm);
  padding:15px 16px; cursor:pointer; transition:border-color .2s, background .2s; font-size:14.5px; color:var(--ink);
}
.radio-card:hover{ border-color:var(--ink-mute); }
.radio-card input{ accent-color:var(--positive); width:17px; height:17px; flex-shrink:0; }
.radio-card:has(input:checked){ border-color:var(--positive); background:rgba(159,196,168,.1); }
.step-note{ margin-top:16px; font-size:13px; color:var(--warn); background:rgba(201,138,59,.12); border:1px solid rgba(201,138,59,.4); border-radius:var(--radius-sm); padding:12px 14px; }
.field{ margin-bottom:18px; }
.field label{ display:block; font-size:13.5px; color:var(--ink-soft); margin-bottom:7px; font-weight:600; }
.field input,.field select{
  width:100%; background:var(--paper); border:1px solid var(--line-dark); border-radius:var(--radius-sm);
  padding:13px 14px; font-size:15px; color:var(--ink); font-family:inherit;
}
.field input:focus,.field select:focus{ border-color:var(--positive); background:var(--white); }
.field input::placeholder{ color:var(--ink-mute); }
.consent{ display:flex; gap:10px; align-items:flex-start; font-size:13px; color:var(--ink-soft); line-height:1.6; margin-top:10px; }
.consent input{ accent-color:var(--positive); margin-top:3px; flex-shrink:0; width:16px; height:16px; }
.consent a{ color:var(--accent); text-decoration:underline; }
.form-error{ background:rgba(180,60,60,.1); border:1px solid rgba(180,60,60,.4); color:#a33; border-radius:var(--radius-sm); padding:12px 14px; font-size:13.5px; margin-top:16px; }
.form-nav{ display:flex; gap:12px; margin-top:28px; }
.form-nav .btn-primary,.form-nav .btn-ghost-dark{ flex:1; padding:12px 20px; font-size:13.5px; }
.form-nav .btn-ghost-dark:hover{ background:rgba(16,29,36,.04); }
.form-microcopy{ text-align:center; font-size:12.5px; color:var(--ink-mute); margin-top:18px; }

/* ===== CTA final ===== */
.final-cta{ background:linear-gradient(135deg,var(--blue),#001f3f); color:var(--white); text-align:center; padding:120px 0; }
.final-cta h2{ max-width:16ch; margin:0 auto 20px; }
.final-cta p{ color:var(--silver); max-width:48ch; margin:0 auto 36px; font-size:16px; }
.final-cta .hero-ctas{ justify-content:center; margin-bottom:0; }

/* ===== Rodapé ===== */
footer{ background:var(--petrol); border-top:1px solid var(--line); padding:52px 0 30px; color:var(--silver); font-size:13px; }
.foot-top{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:34px; margin-bottom:36px; }
.foot-brand p{ max-width:32ch; margin-top:12px; color:var(--ink-mute); font-size:12.5px; }
.foot-social{ display:inline-flex; align-items:center; gap:8px; margin-top:16px; font-size:12.5px; color:var(--silver); transition:color .2s; }
.foot-social:hover{ color:var(--white); }
.foot-links{ display:flex; gap:28px; flex-wrap:wrap; }
.foot-links a:hover{ color:var(--white); }
.foot-legal{ border-top:1px solid var(--line); padding-top:22px; font-size:11.5px; line-height:1.85; color:var(--ink-mute); }

/* ===== Cookie / LGPD banner ===== */
.cookie-bar{
  position:fixed; left:16px; right:16px; bottom:16px; z-index:200; max-width:640px; margin:0 auto;
  background:var(--petrol); color:var(--silver); border:1px solid var(--line); border-radius:var(--radius);
  padding:20px 22px; box-shadow:0 20px 45px rgba(0,0,0,.35); display:flex; gap:16px; align-items:center; flex-wrap:wrap;
  transform:translateY(140%); transition:transform .5s var(--ease);
}
.cookie-bar.show{ transform:translateY(0); }
.cookie-bar p{ font-size:12.5px; flex:1; min-width:220px; }
.cookie-bar a{ color:var(--accent); text-decoration:underline; }
.cookie-actions{ display:flex; gap:10px; }
.cookie-actions button{ font-size:12.5px; padding:10px 16px; border-radius:999px; border:1px solid var(--line); background:transparent; color:var(--white); }
.cookie-actions .accept{ background:var(--blue); border-color:var(--blue); }

/* ===== Página de obrigado ===== */
.thanks-hero{
  min-height:70vh; display:flex; align-items:center; color:var(--white);
  background:linear-gradient(135deg,#0D1B2A 0%, #142235 60%, #0D1B2A 100%);
  padding:calc(var(--header-h) + 60px) 0 60px;
}
.thanks-check{ width:56px; height:56px; margin-bottom:26px; }
.thanks-hero h1{ max-width:18ch; }
.thanks-steps{ margin-top:36px; display:grid; gap:14px; max-width:520px; }
.thanks-step{ display:flex; gap:14px; font-size:14.5px; color:var(--silver); }
.thanks-step b{ color:var(--white); }

/* ===== Página de privacidade ===== */
.legal-page{ padding:calc(var(--header-h) + 60px) 0 100px; max-width:760px; margin:0 auto; }
.legal-page h1{ font-size:clamp(28px,4vw,38px); margin-bottom:10px; }
.legal-page .updated{ color:var(--ink-soft); font-size:13px; margin-bottom:40px; }
.legal-page h2{ font-size:20px; margin:36px 0 12px; color:var(--ink); }
.legal-page p, .legal-page li{ color:var(--ink-soft); font-size:14.5px; line-height:1.8; margin-bottom:10px; }
.legal-page ul{ padding-left:20px; list-style:disc; }