/* ============================================================
   Tezex Comex: folha de estilo
   Paleta: fundo azul claro da marca, tipografia em azul escuro.
   Cores derivadas da identidade visual da marca (logo TZX).
   ============================================================ */

:root{
  /* ---- MARCA ---- */
  --navy:#101f8a;            /* azul do logo */
  --navy-deep:#0a1550;
  --yellow:#f9b233;
  --yellow-dark:#d99413;
  --green:#157a43;
  --cyan:#12a5e8;
  --cyan-dark:#0679c4;
  --whats:#1faa53;

  /* ---- TIPOGRAFIA (azul escuro / azul médio) ---- */
  --ink:#0b1e4a;             /* texto principal */
  --ink-soft:#16376e;        /* texto secundário */
  --ink-accent:#0f2a86;      /* rótulos e detalhes */

  /* ---- FUNDOS ----
     --bg é o azul claro da marca. Para trocar o tom do site inteiro,
     basta ajustar estas quatro linhas.                            */
  --bg:#bfddf3;              /* fundo padrão da página */
  --bg-muted:#aad3ee;        /* seções alternadas */
  --bg-deep:#95c7e8;         /* faixas de destaque e rodapé */
  --surface:#ffffff;         /* cartões */

  --line:#d3e7f2;                     /* bordas dentro dos cartões brancos */
  --line-on-bg:rgba(11,30,74,.20);    /* divisórias sobre o fundo azul */

  /* ---- SISTEMA ---- */
  --radius:14px;
  --radius-lg:22px;
  --shadow-sm:0 1px 2px rgba(11,30,74,.10), 0 6px 18px rgba(11,30,74,.12);
  --shadow-md:0 12px 32px rgba(11,30,74,.18);
  --shadow-lg:0 24px 56px rgba(11,30,74,.24);
  --maxw:1180px;
  --pad:clamp(18px, 5vw, 40px);

  /* Header: grande no topo da página, compacto depois que o
     visitante rola. A classe .is-scrolled é aplicada pelo main.js. */
  --header-h:172px;         /* altura em repouso */
  --header-h-min:92px;      /* altura depois de rolar */
  --logo-h:132px;           /* logo em repouso */
  --logo-h-min:62px;        /* logo depois de rolar */

  --font-display:"Manrope", system-ui, sans-serif;
  --font-body:"Inter", system-ui, sans-serif;
}

*,*::before,*::after{ box-sizing:border-box; }
html{
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--header-h-min) + 8px);
  -webkit-text-size-adjust:100%;
}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--bg);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a, button, summary{ -webkit-tap-highlight-color:rgba(18,165,232,.18); }
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; }

h1,h2,h3,h4{ font-family:var(--font-display); line-height:1.14; margin:0 0 .5em; letter-spacing:-.02em; color:var(--ink); }
h1{ font-size:clamp(2.05rem, 4.8vw, 3.35rem); font-weight:800; }
h2{ font-size:clamp(1.65rem, 3.5vw, 2.45rem); font-weight:800; }
h3{ font-size:1.16rem; font-weight:700; }
h4{ font-size:.9rem; font-weight:700; text-transform:uppercase; letter-spacing:.09em; }
p{ margin:0 0 1em; }

.container{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--pad); }
.container--narrow{ max-width:840px; }

.eyebrow{
  font-family:var(--font-display);
  font-size:.79rem; font-weight:800; letter-spacing:.15em; text-transform:uppercase;
  color:var(--ink-accent); margin:0 0 .8rem;
}
.hl{ color:var(--navy); }
.hl-y{
  background:linear-gradient(transparent 62%, rgba(249,178,51,.62) 62%);
  padding:0 .1em;
}

/* ---------------- BOTÕES ---------------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  font-family:var(--font-display); font-weight:800; font-size:.95rem;
  padding:.88rem 1.6rem; border-radius:999px; border:2px solid transparent;
  text-decoration:none; cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
  white-space:nowrap; line-height:1.2;
}
.btn svg{ width:19px; height:19px; flex:none; }

/* CTA principal — verde WhatsApp */
.btn--primary{ background:var(--whats); color:#f2fff7; box-shadow:0 10px 24px rgba(31,170,83,.30); }
.btn--primary:hover{ background:#178f44; transform:translateY(-2px); }

/* CTA secundário — amarelo da marca com texto azul escuro */
.btn--yellow{ background:var(--yellow); color:var(--navy-deep); box-shadow:0 10px 24px rgba(249,178,51,.34); }
.btn--yellow:hover{ background:var(--yellow-dark); transform:translateY(-2px); }

.btn--navy{ background:var(--navy); color:#eaf2ff; }
.btn--navy:hover{ background:#0b1873; transform:translateY(-2px); }

/* Contornados — usados sobre os fundos azuis claros */
.btn--ghost{ border-color:var(--navy); color:var(--navy); background:rgba(255,255,255,.55); }
.btn--ghost:hover{ background:var(--navy); color:#eaf2ff; }
.btn--outline{ border-color:var(--navy); color:var(--navy); }
.btn--outline:hover{ background:var(--navy); color:#eaf2ff; }

.btn--sm{ padding:.62rem 1.2rem; font-size:.87rem; }
.btn--lg{ padding:1.05rem 2.1rem; font-size:1.02rem; }
.btn--block{ width:100%; }

/* ---------------- HEADER ---------------- */
.header{
  position:sticky; top:0; z-index:60;
  background:rgba(255,255,255,.88);
  backdrop-filter:saturate(160%) blur(12px);
  border-bottom:1px solid var(--line);
}
.header__inner{
  display:flex; align-items:center; gap:1.4rem;
  height:var(--header-h);
  transition:height .28s ease;
}
.logo{ display:block; flex:none; }
.logo img{
  height:var(--logo-h); width:auto;
  transition:height .28s ease;
}

/* depois que o visitante rola, o header encolhe e libera a tela */
.header.is-scrolled .header__inner{ height:var(--header-h-min); }
.header.is-scrolled .logo img{ height:var(--logo-h-min); }

.nav{ display:flex; gap:1.5rem; margin-left:auto; }
.nav a{
  color:var(--ink-soft); text-decoration:none; font-size:.93rem; font-weight:600;
  padding:.3rem 0; border-bottom:2px solid transparent; transition:color .18s, border-color .18s;
}
.nav a:hover{ color:var(--navy); border-color:var(--yellow); }

.burger{ display:none; background:none; border:0; width:44px; height:44px; padding:0; cursor:pointer; }
.burger span{ display:block; width:24px; height:2.5px; background:var(--navy); margin:5px auto; border-radius:2px; transition:transform .25s, opacity .2s; }
.burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(7.5px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7.5px) rotate(-45deg); }

/* ---------------- HERO ---------------- */
.hero{
  position:relative; overflow:hidden; color:var(--ink);
  padding:clamp(52px,8vw,92px) 0 clamp(56px,8vw,96px);
  background:
    radial-gradient(780px 460px at 84% 6%, rgba(255,255,255,.55), transparent 64%),
    radial-gradient(700px 430px at 4% 98%, rgba(11,30,74,.10), transparent 62%),
    linear-gradient(165deg, #d3e8f8 0%, #bfddf3 52%, #a9d1ec 100%);
  border-bottom:1px solid var(--line-on-bg);
}
.hero__inner{ display:grid; grid-template-columns:1.02fr .98fr; gap:clamp(28px,4vw,56px); align-items:center; position:relative; z-index:1; }
.hero h1{ margin-bottom:.55em; }
.hero__lead{ font-size:clamp(1.02rem,1.5vw,1.15rem); color:var(--ink-soft); max-width:34em; }
.hero__actions{ display:flex; flex-wrap:wrap; gap:.9rem; margin:1.9rem 0 2rem; }

.hero__trust{ list-style:none; margin:0; padding:1.3rem 0 0; border-top:1px solid var(--line-on-bg); display:grid; grid-template-columns:repeat(3,1fr); gap:1.1rem; }
.hero__trust li{ display:flex; flex-direction:column; }
.hero__trust strong{ font-family:var(--font-display); font-size:1.4rem; font-weight:800; color:var(--navy); line-height:1.1; }
.hero__trust span{ font-size:.85rem; color:var(--ink-soft); line-height:1.35; }

.hero__media{ position:relative; }

/* frase acima do avião, em formato de balão (referência: artes do Instagram) */
.hero__claim{
  position:relative;
  background:var(--surface); color:var(--ink);
  border:1px solid var(--line); border-radius:18px;
  padding:1.05rem 1.4rem; margin:0 0 1.6rem;
  box-shadow:var(--shadow-md);
  font-family:var(--font-display); font-weight:800;
  font-size:clamp(1rem, 1.5vw, 1.16rem); line-height:1.35; text-align:center;
}
.hero__claim::after,
.hero__claim::before{
  content:""; position:absolute; left:50%; transform:translateX(-50%);
  width:0; height:0; border-left:14px solid transparent; border-right:14px solid transparent;
}
.hero__claim::before{ bottom:-15px; border-top:15px solid var(--line); }
.hero__claim::after{ bottom:-13px; border-top:14px solid var(--surface); }

.hero__plane{ border-radius:var(--radius-lg); box-shadow:var(--shadow-lg); border:1px solid rgba(255,255,255,.9); width:100%; }
.hero__badge{
  margin-top:1rem;
  background:var(--surface); color:var(--ink); border:1px solid var(--line);
  border-radius:16px; padding:.9rem 1.15rem;
  box-shadow:var(--shadow-md); display:inline-flex; align-items:center; gap:.75rem;
}
.hero__badge svg{ width:34px; height:34px; color:var(--green); flex:none; }
.hero__badge strong{ display:block; font-family:var(--font-display); font-size:.95rem; line-height:1.25; }
.hero__badge span{ font-size:.8rem; color:var(--ink-soft); }

/* ---------------- FAIXA DE NÚMEROS ---------------- */
.stripe{ background:var(--bg-deep); color:var(--ink); padding:1.7rem 0; border-bottom:1px solid var(--line-on-bg); }
.stripe__inner{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem; text-align:center; }
.stripe strong{ display:block; font-family:var(--font-display); font-weight:800; font-size:clamp(1.5rem,2.6vw,2rem); color:var(--navy); line-height:1.15; }
.stripe span{ font-size:.85rem; color:var(--ink); }

/* ---------------- SEÇÕES ---------------- */
.section{ padding:clamp(54px,7.5vw,98px) 0; }
.section--muted{ background:var(--bg-muted); }
/* mantém o nome da classe; agora é a variação azul mais saturada, sempre clara */
.section--navy{ background:var(--bg-deep); color:var(--ink); }
.section__head{ max-width:760px; margin-bottom:clamp(30px,4.5vw,52px); }
.section__head--center{ margin-inline:auto; text-align:center; }
.section__sub{ color:var(--ink-soft); font-size:1.03rem; }
.section__cta{ margin-top:clamp(30px,4vw,46px); text-align:center; }

.grid{ display:grid; gap:1.4rem; }
.grid--2{ grid-template-columns:repeat(2,1fr); }
.grid--3{ grid-template-columns:repeat(3,1fr); }

/* ---------------- SERVIÇOS ---------------- */
.card{
  position:relative; background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius-lg); padding:1.8rem 1.6rem;
  box-shadow:var(--shadow-sm); transition:transform .2s, box-shadow .2s, border-color .2s;
}
.card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:var(--cyan); }
.card__icon{
  width:52px; height:52px; border-radius:14px; display:grid; place-items:center;
  background:linear-gradient(135deg, var(--cyan), var(--navy)); color:#fff; margin-bottom:1.1rem;
}
.card__icon svg{ width:27px; height:27px; stroke-linecap:round; stroke-linejoin:round; }
.card h3{ margin-bottom:.4em; }
.card p{ color:var(--ink-soft); font-size:.95rem; margin:0; }

/* ---------------- BLOCO IMAGEM + TEXTO ---------------- */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,4.5vw,60px); align-items:center; }
.split--rev .split__media{ order:2; }
.split__media img{ border-radius:var(--radius-lg); box-shadow:var(--shadow-md); border:1px solid rgba(255,255,255,.9); width:100%; }
.split__media--tall img{ height:clamp(340px, 44vw, 520px); object-fit:cover; object-position:center top; }

.ticks{ list-style:none; margin:1.4rem 0 0; padding:0; display:grid; gap:.7rem; }
.ticks li{ position:relative; padding-left:1.9rem; font-size:.96rem; color:var(--ink-soft); }
.ticks li::before{
  content:""; position:absolute; left:0; top:.4em; width:15px; height:8px;
  border-left:2.5px solid var(--green); border-bottom:2.5px solid var(--green);
  transform:rotate(-45deg);
}

/* ---------------- PASSOS ---------------- */
.steps{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; }
.steps li{ position:relative; padding-top:1.5rem; border-top:3px solid rgba(11,30,74,.28); }
.steps li:first-child{ border-color:var(--yellow); }
.steps__num{ font-family:var(--font-display); font-weight:800; font-size:.88rem; color:var(--ink-accent); letter-spacing:.12em; display:block; margin-bottom:.6rem; }
.steps h3{ color:var(--ink); }
.steps p{ color:var(--ink-soft); font-size:.93rem; margin:0; }

/* ---------------- COTAÇÃO / PROMO ---------------- */
.promo{
  border-radius:var(--radius-lg); overflow:hidden;
  background:var(--surface); border:1px solid var(--line);
  color:var(--ink); display:grid; grid-template-columns:1.25fr .75fr; align-items:center;
  box-shadow:var(--shadow-md);
}
.promo__copy{ padding:clamp(26px,3.5vw,44px); }
/* rótulo de seção, nunca um botão */
.promo__tag{
  display:flex; align-items:center; gap:.65rem;
  color:var(--ink-accent); font-family:var(--font-display); font-weight:800;
  font-size:.78rem; letter-spacing:.16em; text-transform:uppercase; margin-bottom:.9rem;
}
.promo__tag::before{
  content:""; flex:none; width:28px; height:2px; border-radius:2px; background:var(--yellow);
}
.promo h2{ font-size:clamp(1.5rem,2.8vw,2.1rem); }
.promo p{ color:var(--ink-soft); }
.promo__routes{ list-style:none; display:flex; flex-wrap:wrap; gap:.5rem; margin:1.2rem 0 1.6rem; padding:0; }
.promo__routes li{ background:#eaf6fb; border:1px solid var(--line); color:var(--ink); border-radius:999px; padding:.35rem .95rem; font-size:.86rem; font-weight:600; }
.promo__media{ height:100%; }
.promo__media img{ width:100%; height:100%; min-height:260px; object-fit:cover; }
.promo__fine{ font-size:.78rem; color:var(--ink-soft); opacity:.85; margin:1rem 0 0; }

/* ---------------- DIFERENCIAIS ---------------- */
.diff{ display:flex; gap:1rem; }
.diff__ico{
  width:44px; height:44px; flex:none; border-radius:12px; display:grid; place-items:center;
  background:var(--surface); border:1px solid var(--line); color:var(--ink-accent);
}
.diff__ico svg{ width:23px; height:23px; stroke-linecap:round; stroke-linejoin:round; }
.diff h3{ margin-bottom:.3em; font-size:1.06rem; }
.diff p{ color:var(--ink-soft); font-size:.94rem; margin:0; }

/* ---------------- O QUE ENVIAR ---------------- */
.chips{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:.65rem; }
.chips li{
  background:var(--surface); border:1px solid var(--line); border-radius:999px;
  padding:.58rem 1.1rem; font-size:.92rem; font-weight:600; color:var(--ink-soft);
}
.notice{
  margin-top:1.8rem; background:#fff7e6; border:1px solid #eed9a8; border-left:4px solid var(--yellow);
  border-radius:12px; padding:1.1rem 1.3rem; font-size:.93rem; color:#5f4a17;
}
.notice strong{ color:#3f3007; }
.notice p:last-child{ margin:0; }

/* ---------------- FAQ ---------------- */
.faq{ display:grid; gap:.75rem; }
.faq details{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-sm); overflow:hidden; }
.faq summary{
  cursor:pointer; list-style:none; padding:1.1rem 3.2rem 1.1rem 1.3rem; position:relative;
  font-family:var(--font-display); font-weight:700; font-size:1.01rem; color:var(--ink);
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{
  content:""; position:absolute; right:1.4rem; top:1.45rem; width:9px; height:9px;
  border-right:2.5px solid var(--ink-accent); border-bottom:2.5px solid var(--ink-accent);
  transform:rotate(45deg); transition:transform .2s, top .2s;
}
.faq details[open] summary::after{ transform:rotate(-135deg); top:1.72rem; }
.faq p{ margin:0; padding:0 1.6rem 1.3rem 1.3rem; color:var(--ink-soft); font-size:.95rem; }

/* ---------------- CONTATO ---------------- */
.section--cta{
  color:var(--ink);
  border-top:1px solid var(--line-on-bg);
  background:
    radial-gradient(700px 420px at 14% 12%, rgba(255,255,255,.50), transparent 64%),
    linear-gradient(150deg, #a8d0ec 0%, #c6e1f5 100%);
}
.contato{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,4.5vw,60px); align-items:start; }
.contato__copy p{ color:var(--ink-soft); }
.contato__list{ list-style:none; margin:2rem 0 0; padding:0; display:grid; gap:1rem; }
.contato__list li{ display:flex; flex-direction:column; gap:.1rem; }
.contato__list strong{ font-size:.74rem; letter-spacing:.13em; text-transform:uppercase; color:var(--ink-accent); font-family:var(--font-display); }
.contato__list a{ color:var(--navy); text-decoration:none; font-weight:800; font-size:1.08rem; }
.contato__list a:hover{ text-decoration:underline; }
.contato__list span{ color:var(--ink); }

.cta-card{
  background:var(--surface); color:var(--ink); border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:clamp(24px,3vw,34px); box-shadow:var(--shadow-lg);
}
.cta-card h3{ font-size:1.1rem; margin-bottom:.2em; }
.cta-card .ticks{ margin-bottom:1.8rem; }
.cta-card__note{ margin:.9rem 0 0; font-size:.82rem; color:var(--ink-soft); text-align:center; }

/* ---------------- FOOTER ---------------- */
.footer{
  background:var(--bg-deep); color:var(--ink);
  border-top:1px solid var(--line-on-bg);
  padding:clamp(44px,6vw,72px) 0 1.5rem; font-size:.93rem;
}
.footer h4{ color:var(--ink); margin-bottom:1rem; }
.footer{ color:var(--ink); }
.footer__brand p{ max-width:34em; }
.footer__inner{ display:grid; grid-template-columns:1.7fr 1fr 1.2fr; gap:2.4rem; }
.footer__logo{ display:inline-block; margin-bottom:1.1rem; }
.footer__logo img{ height:96px; width:auto; }
.footer__nav, .footer__contact{ display:flex; flex-direction:column; gap:.5rem; }
.footer__nav a, .footer__contact a{ color:var(--ink); text-decoration:none; }
.footer__nav a:hover, .footer__contact a:hover{ color:var(--navy); text-decoration:underline; }
.footer__contact p{ margin:0; font-size:.86rem; color:var(--ink); }
.footer__bottom{
  display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap;
  margin-top:2.4rem; padding-top:1.4rem; border-top:1px solid var(--line-on-bg);
  font-size:.83rem; color:var(--ink);
}
.footer__bottom p{ margin:0; }
.footer__bottom a{ color:var(--ink); text-decoration:none; }
.footer__bottom a:hover{ color:var(--navy); }

/* ---------------- WHATSAPP FLUTUANTE ---------------- */
.wa-float{
  position:fixed; right:20px; bottom:20px; z-index:70;
  width:58px; height:58px; border-radius:50%;
  background:var(--whats); color:#f2fff7; display:grid; place-items:center;
  box-shadow:0 10px 26px rgba(31,170,83,.42); transition:transform .2s;
}
.wa-float:hover{ transform:scale(1.08); }
.wa-float svg{ width:32px; height:32px; }


/* ============================================================
   RESPONSIVO
   ============================================================ */

/* ---- Tablet paisagem / notebook pequeno ---- */
@media (max-width:1024px){
  .hero__inner{ grid-template-columns:1fr; }
  .hero__media{ max-width:560px; }
  .steps{ grid-template-columns:repeat(2,1fr); }
  .footer__inner{ grid-template-columns:1fr 1fr; }
  .promo{ grid-template-columns:1fr; }
  .promo__media{ order:-1; }
  .promo__media img{ height:240px; min-height:0; }
}

/* ---- Tablet retrato: menu vira hambúrguer ---- */
@media (max-width:860px){
  :root{ --header-h:150px; --header-h-min:84px; --logo-h:112px; --logo-h-min:56px; }

  .grid--3{ grid-template-columns:1fr 1fr; }
  .contato{ grid-template-columns:1fr; }
  .split{ grid-template-columns:1fr; }
  .split--rev .split__media{ order:0; }
  .split__media--tall img{ height:auto; max-height:460px; }
  .stripe__inner{ grid-template-columns:repeat(2,1fr); gap:1.6rem; }


  .burger{ display:block; margin-left:auto; }
  .header__cta{ display:none; }
  .nav{
    position:fixed; inset:var(--header-h-min) 0 auto 0; margin:0;
    flex-direction:column; gap:0; background:var(--surface);
    border-bottom:1px solid var(--line); box-shadow:var(--shadow-md);
    padding:.5rem var(--pad) 1.4rem;
    max-height:calc(100dvh - var(--header-h-min)); overflow-y:auto;
    transform:translateY(-12px); opacity:0; pointer-events:none;
    transition:opacity .2s, transform .2s;
  }
  .nav.is-open{ transform:none; opacity:1; pointer-events:auto; }
  .nav a{ padding:.95rem 0; font-size:1rem; border-bottom:1px solid var(--line); }
  .nav a:hover{ border-color:var(--line); }
}

/* ---- Celular ---- */
@media (max-width:640px){
  /* header menor no celular, mas a logo ainda entra grande */
  :root{ --header-h:132px; --header-h-min:74px; --logo-h:100px; --logo-h-min:50px; }

  body{ font-size:16px; }

  .grid--2, .grid--3, .steps{ grid-template-columns:1fr; }
  .section{ padding:48px 0; }
  .section__head{ margin-bottom:28px; }

  /* hero */
  .hero{ padding:40px 0 48px; }
  .hero h1{ font-size:2rem; line-height:1.18; }
  .hero__lead{ font-size:1rem; }
  .hero__actions{ margin:1.5rem 0 1.7rem; }
  .hero__actions .btn{ width:100%; }
  .hero__claim{ padding:.9rem 1.1rem; margin-bottom:1.3rem; font-size:1rem; }
  .hero__trust{ grid-template-columns:1fr 1fr; gap:1rem; }
  .hero__trust li:last-child{ grid-column:1 / -1; }
  .hero__trust strong{ font-size:1.25rem; }
  .hero__badge{ display:flex; }

  /* números */
  .stripe{ padding:1.3rem 0; }
  .stripe__inner{ gap:1.3rem; }

  /* cards e blocos */
  .card{ padding:1.5rem 1.3rem; }
  .promo__routes li{ font-size:.82rem; }
  .chips li{ font-size:.87rem; padding:.5rem .95rem; }
  .split__media--tall img{ max-height:400px; }
  .cta-card{ padding:22px 18px; }

  /* faq */
  .faq summary{ font-size:.97rem; padding:1rem 2.8rem 1rem 1.1rem; }
  .faq summary::after{ right:1.1rem; top:1.35rem; }
  .faq details[open] summary::after{ top:1.6rem; }
  .faq p{ padding:0 1.2rem 1.15rem 1.1rem; }

  /* botões: alvo de toque confortável.
     Os que ocupam a largura toda podem quebrar linha — o rótulo
     "Faça sua cotação sem compromisso" não cabe em uma linha só
     num celular estreito. */
  .btn{ padding:.9rem 1.2rem; }
  .btn--lg{ width:100%; padding:1rem 1.2rem; font-size:.98rem; }
  .btn--sm{ padding:.72rem 1.1rem; }
  .btn--block, .btn--lg, .hero__actions .btn{
    white-space:normal; text-align:center; line-height:1.25;
  }

  /* rodapé */
  .footer__inner{ grid-template-columns:1fr; gap:1.9rem; }
  .footer__bottom{ flex-direction:column; align-items:flex-start; gap:.5rem; }

  /* a bolinha do WhatsApp fica no canto direito, em qualquer tela */
  .wa-float{ right:16px; bottom:16px; width:56px; height:56px; }
  .wa-float svg{ width:30px; height:30px; }
}

/* ---- Celular pequeno ---- */
@media (max-width:380px){
  :root{ --header-h:116px; --header-h-min:66px; --logo-h:84px; --logo-h-min:44px; }

  .hero h1{ font-size:1.78rem; }
  .hero__claim{ font-size:.95rem; }
  .btn--lg, .btn--block{ font-size:.94rem; padding-inline:1rem; }

  .hero__trust{ grid-template-columns:1fr; }
  .hero__trust li:last-child{ grid-column:auto; }
  .stripe__inner{ grid-template-columns:1fr; }
}

/* ---- Celular deitado ---- */
@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition:none !important; }
  html{ scroll-behavior:auto; }
}