/* =========================================================================
   Orlandando Travel · style.css
   Base: 07-design-system.json (v1.0.0) + 06-mega-menu.md + 00-documento-mestre.md
   Layout: grade de 12 colunas, seções alternando claro, neutro e escuro,
   amarelo só como destaque funcional (botões, ícones e números).
   ========================================================================= */

:root {
  /* Cores (tokens.colors) */
  --c-primary: #F4B305;
  --c-primary-hover: #D99E00;
  --c-primary-soft: #FFF4CE;
  --c-accent: #FFCC33;
  --c-text: #000000;
  --c-text-muted: #555555;
  --c-text-inverse: #FFFFFF;
  --c-text-inverse-muted: #DDE4E8;
  --c-surface: #FFFFFF;
  --c-surface-alt: #F0F3F5;
  --c-surface-dark: #303F4A;
  --c-surface-dark-deep: #202A33;
  --c-border: #D8DEE3;
  --c-border-strong: #8997A2;
  --c-success: #166534;
  --c-success-hover: #14532D;
  --c-error: #B42318;
  --c-focus: #2459B3;
  --c-focus-inverse: #FFCC33;
  --c-overlay-hero: linear-gradient(90deg, rgba(20,29,38,0.82) 0%, rgba(20,29,38,0.55) 55%, rgba(20,29,38,0.25) 100%);
  --c-overlay-dark: rgba(12,19,26,0.76);

  /* Tipografia (tokens.typography) */
  --f-heading: "Barlow Condensed", "Arial Narrow", Arial, sans-serif;
  --f-body: "Inter", Arial, sans-serif;
  --fs-h1: clamp(2.75rem, 5.2vw, 5rem);
  --fs-h2: clamp(2.25rem, 4vw, 3.75rem);
  --fs-h3: clamp(1.875rem, 3vw, 2.75rem);
  --fs-h4: clamp(1.5rem, 2.2vw, 2rem);
  --fs-h5: clamp(1.25rem, 1.6vw, 1.5rem);
  --fs-h6: clamp(1rem, 1.2vw, 1.125rem);
  --fs-body-lg: clamp(1.0625rem, 1.25vw, 1.25rem);
  --fs-body: clamp(1rem, 1.05vw, 1.0625rem);
  --fs-caption: 0.875rem;

  /* Espaçamento (tokens.spacing) */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-6: 24px;
  --s-8: 32px; --s-12: 48px; --s-16: 64px; --s-24: 96px; --s-32: 128px;
  --section: 64px;
  --gutter: 16px;
  --card-gap: 16px;

  /* Raios, sombras, bordas e transições */
  --r-sm: 4px; --r-md: 8px; --r-pill: 9999px;
  --sh-sm: 0 4px 12px rgba(20,29,38,0.08);
  --sh-md: 0 10px 30px rgba(20,29,38,0.10);
  --sh-lg: 0 20px 50px rgba(20,29,38,0.15);
  --b-subtle: 1px solid var(--c-border);
  --t-default: 180ms ease;
  --t-medium: 240ms ease;
  --t-slow: 400ms ease;

  /* Layout */
  --max: 1200px;
  --reading: 760px;
  --header-h: 68px;
  --topbar-h: 36px;

  color-scheme: light;
}

@media (min-width: 768px) {
  :root { --section: 72px; --gutter: 24px; --card-gap: 24px; }
}
@media (min-width: 1024px) {
  :root { --section: 80px; --gutter: 32px; --header-h: 84px; }
}
@media (min-width: 1280px) {
  :root { --section: 96px; }
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 96px; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
  margin: 0;
  background: var(--c-surface);
  color: var(--c-text);
  font-family: var(--f-body);
  font-size: var(--fs-body);
  line-height: 1.7;
  text-rendering: optimizeLegibility;
}
img { display: block; max-width: 100%; height: auto; }
h1, h2, h3, h4, h5, h6 { margin: 0; text-wrap: balance; color: inherit; }
h1 { font: 700 var(--fs-h1)/1.02 var(--f-heading); letter-spacing: -0.025em; }
h2 { font: 700 var(--fs-h2)/1.08 var(--f-heading); letter-spacing: -0.02em; max-width: 20ch; }
h3 { font: 700 var(--fs-h5)/1.3 var(--f-body); letter-spacing: -0.015em; }
h4 { font: 700 var(--fs-h6)/1.4 var(--f-body); }
p { margin: 0; }
strong { font-weight: 700; }
ul, ol { margin: 0; padding: 0; }
[role="list"] { list-style: none; }
a { color: var(--c-surface-dark); font-weight: 600; text-decoration: underline; text-underline-offset: 0.2em; transition: color var(--t-default); }
a:hover { color: var(--c-text); }
:focus-visible { outline: 3px solid var(--c-focus); outline-offset: 3px; }
.section--dark :focus-visible, .hero :focus-visible, .footer :focus-visible, .topbar :focus-visible { outline-color: var(--c-focus-inverse); }
address { font-style: normal; }
table { border-collapse: collapse; }

.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.i { width: 24px; height: 24px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.i--sm { width: 18px; height: 18px; }
.i--lg { width: 32px; height: 32px; stroke-width: 1.75; }

.skip-link {
  position: absolute; left: var(--s-4); top: -100px; z-index: 600;
  background: var(--c-primary); color: var(--c-text); padding: var(--s-3) var(--s-4);
  border-radius: var(--r-sm); font-weight: 700;
}
.skip-link:focus { top: var(--s-4); }

.container {
  width: 100%;
  max-width: calc(var(--max) + 2 * var(--gutter));
  margin-inline: auto;
  padding-left: max(var(--gutter), env(safe-area-inset-left, 0px));
  padding-right: max(var(--gutter), env(safe-area-inset-right, 0px));
}
.container--narrow { max-width: calc(var(--reading) + 2 * var(--gutter)); }

.eyebrow {
  font: 700 0.875rem/1.4 var(--f-body); letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--c-surface-dark); display: inline-flex; align-items: center; gap: var(--s-2);
}
.eyebrow::before { content: ""; width: 24px; height: 3px; background: var(--c-primary); border-radius: 2px; }
.eyebrow--inverse { color: var(--c-accent); }
.eyebrow--inverse::before { background: var(--c-accent); }

/* ---------- Botões ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--s-2);
  min-height: 48px; padding: 12px var(--s-6);
  font: 700 0.875rem/1.3 var(--f-body); text-decoration: none; text-align: center;
  border-radius: var(--r-sm); border: 1px solid transparent; cursor: pointer;
  transition: background-color var(--t-default), color var(--t-default), border-color var(--t-default), transform var(--t-default);
}
.btn--lg { min-height: 56px; font-size: 1rem; }
.btn--block { width: 100%; }
.btn--primary { background: var(--c-primary); color: var(--c-text); border-color: var(--c-primary); }
.btn--primary:hover { background: var(--c-primary-hover); border-color: var(--c-primary-hover); color: var(--c-text); }
.btn--secondary { background: var(--c-surface-dark); color: var(--c-text-inverse); border-color: var(--c-surface-dark); }
.btn--secondary:hover { background: var(--c-surface-dark-deep); color: var(--c-text-inverse); }
.btn--ghost { background: transparent; color: var(--c-surface-dark); border-color: var(--c-border-strong); }
.btn--ghost:hover { background: var(--c-primary-soft); border-color: var(--c-surface-dark); color: var(--c-surface-dark); }
.btn--outline-inverse { background: transparent; color: var(--c-text-inverse); border-color: rgba(255,255,255,0.7); }
.btn--outline-inverse:hover { background: rgba(255,255,255,0.12); color: var(--c-text-inverse); border-color: var(--c-text-inverse); }
.btn--whatsapp { background: var(--c-success); color: var(--c-text-inverse); border-color: var(--c-success); }
.btn--whatsapp:hover { background: var(--c-success-hover); color: var(--c-text-inverse); }
@media (prefers-reduced-motion: no-preference) {
  .btn--primary:hover, .btn--secondary:hover, .btn--whatsapp:hover { transform: translateY(-2px); }
  .btn:active { transform: translateY(0); }
}
.btn-group { display: flex; flex-wrap: wrap; gap: var(--s-3); }

/* ---------- Topbar ---------- */
.topbar { background: var(--c-surface-dark-deep); color: var(--c-text-inverse); font-size: 0.8125rem; }
.topbar__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--s-4); min-height: var(--topbar-h); }
.topbar__contacts { display: flex; gap: var(--s-6); }
.topbar a { color: var(--c-text-inverse); text-decoration: none; font-weight: 600; display: inline-flex; align-items: center; gap: var(--s-2); min-height: 36px; }
.topbar a:hover { text-decoration: underline; color: var(--c-text-inverse); }
.topbar__area { display: none; align-items: center; gap: var(--s-2); color: var(--c-text-inverse-muted); }
@media (min-width: 768px) { .topbar__area { display: inline-flex; } }

/* ---------- Header ---------- */
.header {
  position: sticky; top: env(safe-area-inset-top, 0px); z-index: 100;
  background: var(--c-surface); border-bottom: var(--b-subtle);
  transition: box-shadow var(--t-medium);
}
.header.is-scrolled { box-shadow: var(--sh-sm); }
.header__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--s-6); min-height: var(--header-h); }
.logo { display: inline-flex; align-items: center; gap: var(--s-3); text-decoration: none; color: var(--c-text); min-height: 44px; }
.logo:hover { color: var(--c-text); }
.logo__img { height: 44px; width: auto; }
@media (min-width: 1024px) { .logo__img { height: 56px; } }
.logo__mark {
  width: 40px; height: 40px; border-radius: var(--r-md); background: var(--c-primary);
  display: grid; place-items: center; font: 700 1.5rem/1 var(--f-heading);
}
.logo__text { font: 700 1.625rem/1 var(--f-heading); letter-spacing: -0.01em; }
.logo__text span { color: var(--c-surface-dark); font-weight: 600; }

.menu-toggle {
  display: none; width: 44px; height: 44px; border: var(--b-subtle); border-radius: var(--r-sm);
  background: var(--c-surface); color: var(--c-surface-dark); cursor: pointer; place-items: center;
}
.menu-toggle__close { display: none; }

.nav { display: flex; align-items: center; gap: var(--s-6); }
.nav__list { display: flex; align-items: center; gap: var(--s-2); }
.nav__link {
  display: inline-flex; align-items: center; gap: var(--s-1); min-height: 44px; padding: 0 var(--s-3);
  font: 600 0.9375rem/1 var(--f-body); color: var(--c-text); text-decoration: none;
  background: none; border: 0; cursor: pointer; position: relative;
}
.nav__link::after {
  content: ""; position: absolute; left: var(--s-3); right: var(--s-3); bottom: 6px; height: 3px;
  background: var(--c-primary); transform: scaleX(0); transform-origin: left; transition: transform var(--t-default);
}
.nav__link:hover { color: var(--c-text); }
.nav__link:hover::after, .nav__link[aria-current="page"]::after, .has-mega.is-open > .nav__trigger::after { transform: scaleX(1); }
.nav__trigger .i { transition: transform var(--t-default); }
.has-mega.is-open > .nav__trigger .i { transform: rotate(180deg); }
.nav__actions { display: flex; gap: var(--s-3); }
.nav__whatsapp { display: none; }

/* Mega menu (desktop) */
@media (min-width: 1024px) {
  .has-mega { position: static; }
  .mega {
    position: absolute; left: 50%; top: 100%;
    width: min(100vw - 48px, 1200px);
    background: var(--c-surface); border-radius: 0 0 var(--r-md) var(--r-md); box-shadow: var(--sh-lg);
    border-top: 3px solid var(--c-primary);
    padding: var(--s-8);
    opacity: 0; visibility: hidden; transform: translate(-50%, 8px);
    transition: opacity 150ms ease-out, transform 150ms ease-out, visibility 0s linear 300ms;
  }
  .has-mega:hover > .mega, .has-mega:focus-within > .mega, .has-mega.is-open > .mega {
    opacity: 1; visibility: visible; transform: translate(-50%, 0);
    transition: opacity 150ms ease-out, transform 150ms ease-out, visibility 0s;
  }
  .has-mega.is-suppressed > .mega { opacity: 0; visibility: hidden; }
  .mega__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) minmax(0, 1.15fr); gap: var(--s-6); }
  .mega__summary { display: none; }
}
.mega__title { display: block; font: 700 1.375rem/1.2 var(--f-heading); color: var(--c-text); text-decoration: none; padding-bottom: var(--s-3); margin-bottom: var(--s-2); border-bottom: var(--b-subtle); }
.mega__title:hover { color: var(--c-surface-dark); text-decoration: underline; }
.mega__items { display: grid; gap: var(--s-1); }
.mega__link {
  display: flex; gap: var(--s-3); align-items: flex-start; padding: var(--s-2); margin-inline: calc(-1 * var(--s-2));
  border-radius: var(--r-sm); text-decoration: none; color: var(--c-text); font-weight: 400; min-height: 44px;
  transition: background-color var(--t-default);
}
.mega__link:hover { background: var(--c-primary-soft); color: var(--c-text); }
.mega__link .i { color: var(--c-surface-dark); margin-top: 2px; }
.mega__link strong { display: block; font-size: 0.9375rem; line-height: 1.35; }
.mega__link small { display: block; font-size: 0.8125rem; line-height: 1.4; color: var(--c-text-muted); }
.mega__all { display: inline-flex; align-items: center; gap: var(--s-1); margin-top: var(--s-3); font-size: 0.875rem; min-height: 44px; }
.mega__feature { background: var(--c-surface-alt); border-radius: var(--r-md); padding: var(--s-4); display: flex; flex-direction: column; gap: var(--s-3); }
.mega__feature img { border-radius: var(--r-sm); aspect-ratio: 4 / 3; object-fit: cover; width: 100%; }
.mega__feature-title { font: 700 1.375rem/1.15 var(--f-heading); }
.mega__feature-text { font-size: 0.875rem; color: var(--c-text-muted); line-height: 1.5; }
.mega__feature .btn { margin-top: auto; }
.mega__strip {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-4);
  margin-top: var(--s-6); padding-top: var(--s-4); border-top: var(--b-subtle); font-size: 0.8125rem;
}
.mega__strip a, .mega__strip span { display: inline-flex; align-items: center; gap: var(--s-2); min-height: 44px; color: var(--c-surface-dark); text-decoration: none; font-weight: 600; }
.mega__strip a:hover { text-decoration: underline; }

/* Sem animação do menu até a página terminar de carregar */
.js:not(.is-ready) .mega, .js:not(.is-ready) .nav { transition: none !important; }

/* Navegação mobile (até 1023 px) */
@media (max-width: 1023px) {
  .menu-toggle { display: grid; }
  .header__inner { gap: var(--s-4); }
  .nav {
    flex-direction: column; align-items: stretch; gap: var(--s-6);
    width: 100%;
  }
  /* sem JavaScript, o menu aparece aberto abaixo do cabeçalho */
  .no-js .header__inner { flex-wrap: wrap; }
  .no-js .menu-toggle { display: none; }
  .no-js .nav { padding-bottom: var(--s-6); }
  .js .nav {
    position: fixed; inset: 0; z-index: 300; background: var(--c-surface);
    padding: calc(var(--header-h) + env(safe-area-inset-top, 0px)) max(var(--gutter), env(safe-area-inset-right, 0px)) calc(var(--s-6) + env(safe-area-inset-bottom, 0px)) max(var(--gutter), env(safe-area-inset-left, 0px));
    overflow-y: auto; overscroll-behavior: contain;
    visibility: hidden; opacity: 0; transition: opacity 180ms ease-out, visibility 0s linear 180ms;
  }
  .js .menu-open .nav { visibility: visible; opacity: 1; transition: opacity 180ms ease-out, visibility 0s; }
  /* com o menu aberto, o cabeçalho fica no topo da tela, acima da barra de contatos, para o logo não cobrir o menu */
  .js .header.menu-open { position: fixed; top: env(safe-area-inset-top, 0px); left: 0; right: 0; }
  .js .menu-open .menu-toggle { position: relative; z-index: 310; }
  .js .menu-open .logo { position: relative; z-index: 310; }
  .menu-open .menu-toggle__open { display: none; }
  .menu-open .menu-toggle__close { display: block; }
  .nav__list { flex-direction: column; align-items: stretch; gap: 0; }
  .nav__item { border-bottom: var(--b-subtle); }
  .nav__link { width: 100%; justify-content: space-between; min-height: 56px; padding: 0; font-size: 1.0625rem; }
  .nav__link::after { display: none; }
  .nav__trigger { display: none; }
  .mega { padding: 0 0 var(--s-4); }
  .mega__grid { display: grid; gap: 0; }
  .mega__col { border-bottom: var(--b-subtle); }
  .mega__col:last-of-type { border-bottom: 0; }
  .mega__summary {
    display: flex; align-items: center; justify-content: space-between; min-height: 56px;
    font: 700 1.25rem/1.2 var(--f-heading); cursor: pointer; list-style: none;
  }
  .mega__summary::-webkit-details-marker { display: none; }
  .mega__col[open] > .mega__summary .i { transform: rotate(180deg); }
  .mega__title { font: 600 0.9375rem/1.4 var(--f-body); border: 0; padding: var(--s-2) 0; margin: 0; text-decoration: underline; }
  .mega__col > .mega__items, .mega__col > .mega__all { margin-bottom: var(--s-3); }
  .mega__feature { display: none; }
  .mega__strip { grid-template-columns: 1fr; gap: 0; margin-top: var(--s-4); }
  .nav__actions { flex-direction: column; }
  .nav__actions .btn { width: 100%; min-height: 48px; }
  .nav__whatsapp { display: inline-flex; }
}
.menu-locked { overflow: hidden; }

/* ---------- Hero ---------- */
.hero { position: relative; background: var(--c-surface-dark); color: var(--c-text-inverse); isolation: isolate; overflow: hidden; }
.hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 62% center; z-index: -2; }
.hero::before { content: ""; position: absolute; inset: 0; background: var(--c-overlay-hero); z-index: -1; }
.hero__inner { padding-block: var(--s-16) calc(var(--s-16) + 72px); display: grid; gap: var(--s-12); }
.hero__content { max-width: 680px; display: grid; gap: var(--s-6); }
.hero h1 { color: var(--c-text-inverse); }
.hero__intro { font-size: var(--fs-body-lg); color: var(--c-text-inverse-muted); max-width: 52ch; }
.hero__intro strong { color: var(--c-text-inverse); }
.hero__promise { font-size: var(--fs-body-lg); font-weight: 600; color: var(--c-text-inverse); max-width: 52ch; padding-left: var(--s-4); border-left: 3px solid var(--c-primary); }
.hero__proofs { display: grid; grid-template-columns: 1fr; gap: var(--s-3); max-width: 960px; }
.hero__proofs li {
  display: flex; align-items: center; gap: var(--s-3); padding: var(--s-3) var(--s-4);
  background: rgba(20,29,38,0.55); border: 1px solid rgba(255,255,255,0.16); border-radius: var(--r-md);
  font-weight: 600; font-size: 0.9375rem; line-height: 1.4;
}
@media (min-width: 768px) {
  .hero__inner { padding-block: var(--s-24) calc(var(--s-24) + 64px); }
  .hero__proofs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.icon-box {
  width: 56px; height: 56px; border-radius: var(--r-md); background: var(--c-primary); color: var(--c-text);
  display: grid; place-items: center; flex: none;
}
.icon-box--compact { width: 40px; height: 40px; border-radius: var(--r-sm); }
.icon-box--compact .i { width: 20px; height: 20px; }

/* ---------- Faixa de confiança ---------- */
.trust { position: relative; z-index: 2; margin-top: -64px; }
.trust__grid {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  background: var(--c-surface); border-radius: var(--r-md); box-shadow: var(--sh-md); overflow: hidden;
}
.trust__grid li {
  display: grid; justify-items: center; text-align: center; gap: var(--s-1);
  padding: var(--s-6) var(--s-4); border-right: var(--b-subtle); border-bottom: var(--b-subtle);
}
.trust__grid li:nth-child(2n) { border-right: 0; }
.trust__grid li:nth-child(n+3) { border-bottom: 0; }
.trust__grid .i { color: var(--c-surface-dark); margin-bottom: var(--s-1); }
.trust__num { font: 700 clamp(2rem, 3vw, 3rem)/1 var(--f-heading); color: var(--c-text); font-variant-numeric: tabular-nums; }
.trust__num::after { content: ""; display: block; width: 32px; height: 3px; background: var(--c-primary); margin: var(--s-2) auto 0; border-radius: 2px; }
.trust__label { font-size: 0.875rem; color: var(--c-text-muted); line-height: 1.4; }
@media (min-width: 1024px) {
  .trust__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .trust__grid li { border-bottom: 0; }
  .trust__grid li:nth-child(2n) { border-right: var(--b-subtle); }
  .trust__grid li:last-child { border-right: 0; }
}

/* ---------- Seções ---------- */
.section { padding-block: var(--section); }
.section--alt { background: var(--c-surface-alt); }
.section--dark { background: var(--c-surface-dark); color: var(--c-text-inverse); }
.section--dark a:not(.btn) { color: var(--c-accent); }
.section--dark a:not(.btn):hover { color: var(--c-text-inverse); }
.section__head { display: grid; gap: var(--s-3); margin-bottom: var(--s-8); max-width: var(--reading); }
.section__head h2 { margin-top: 0; }
.section__head--center { margin-inline: auto; text-align: center; justify-items: center; }
.section__head--center h2 { max-width: 24ch; }
.section__lead { font-size: var(--fs-body-lg); color: var(--c-text-muted); max-width: 70ch; margin-top: var(--s-1); }
.section--dark .section__lead { color: var(--c-text-inverse-muted); }
.section__foot { margin-top: var(--s-8); max-width: 70ch; color: var(--c-text-inverse-muted); }
.section__foot--center { text-align: center; margin-inline: auto; }
.section--alt .section__foot, .section .section__foot--center { color: inherit; }

.grid { display: grid; gap: var(--card-gap); grid-template-columns: 1fr; }
@media (min-width: 768px) {
  .grid--2, .grid--3, .grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
  .grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* Cards com imagem (serviços e blog) */
.card {
  display: flex; flex-direction: column; height: 100%;
  background: var(--c-surface); border: var(--b-subtle); border-radius: var(--r-md); overflow: hidden;
  transition: transform var(--t-medium), box-shadow var(--t-medium);
}
.card__img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; background: var(--c-surface-alt); transition: transform var(--t-slow); }
.card__body { position: relative; display: flex; flex-direction: column; gap: var(--s-3); padding: var(--s-6); flex: 1; }
.card__icon {
  position: absolute; top: -28px; right: var(--s-6);
  width: 56px; height: 56px; border-radius: var(--r-md); background: var(--c-primary); color: var(--c-text);
  display: grid; place-items: center; box-shadow: var(--sh-sm);
}
.card__tag { font: 700 0.75rem/1.4 var(--f-body); letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-surface-dark); }
.card h3 { font-size: 1.25rem; }
.card p:not(.card__tag) { color: var(--c-text-muted); }
.card__link, .area .card__link { margin-top: auto; display: inline-flex; align-items: center; gap: var(--s-2); font-size: 0.9375rem; min-height: 44px; }
.card__link .i { transition: transform var(--t-default); }
@media (prefers-reduced-motion: no-preference) {
  .card:hover { transform: translateY(-4px); box-shadow: var(--sh-md); }
  .card:hover .card__img { transform: scale(1.03); }
  .card__link:hover .i { transform: translateX(3px); }
}
.card:focus-within { box-shadow: 0 0 0 3px rgba(36,89,179,0.22); }

.hub-links { display: grid; grid-template-columns: 1fr; gap: var(--s-3); margin-top: var(--s-8); }
.hub-links a {
  display: flex; align-items: center; gap: var(--s-3); min-height: 56px; padding: var(--s-3) var(--s-4);
  border: var(--b-subtle); border-radius: var(--r-md); background: var(--c-surface-alt); text-decoration: none;
  color: var(--c-surface-dark); font-size: 0.9375rem; transition: background-color var(--t-default), border-color var(--t-default);
}
.hub-links a:hover { background: var(--c-primary-soft); border-color: var(--c-primary); }
@media (min-width: 768px) { .hub-links { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .hub-links { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* Bloco texto + imagem */
.split { display: grid; gap: var(--s-8); align-items: center; }
.split__media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--r-md); box-shadow: var(--sh-md); }
.split__content { display: grid; gap: var(--s-4); min-width: 0; }
.split__content h3 { margin-top: var(--s-4); }
.split__content .btn { justify-self: start; margin-top: var(--s-2); }
@media (min-width: 1024px) {
  .split { grid-template-columns: 5fr 7fr; gap: var(--s-16); }
  .split__media { position: sticky; top: calc(var(--header-h) + 32px); }
}

.list { display: grid; gap: var(--s-3); }
.list li { position: relative; padding-left: 32px; line-height: 1.6; }
.list li::before { content: ""; position: absolute; left: 0; top: 2px; width: 22px; height: 22px; border-radius: var(--r-pill); background-repeat: no-repeat; background-position: center; background-size: 14px; }
.list--check li::before { background-color: var(--c-primary); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E"); }
.list--x li::before { background-color: var(--c-surface); border: 1px solid var(--c-border-strong); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23303F4A' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E"); }

/* Etapas */
.steps { display: grid; gap: var(--card-gap); grid-template-columns: 1fr; counter-reset: none; }
.step { display: flex; flex-direction: column; gap: var(--s-4); padding: var(--s-6); border: var(--b-subtle); border-radius: var(--r-md); background: var(--c-surface); position: relative; height: 100%; }
.step h3 { font-size: 1.1875rem; }
.step p { color: var(--c-text-muted); }
@media (min-width: 768px) { .steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) {
  .steps { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .step:not(:last-child)::after { content: ""; position: absolute; top: 52px; right: calc(-1 * var(--card-gap)); width: var(--card-gap); border-top: 1px solid var(--c-border); }
}

/* Diferenciais (fundo escuro) */
.feature { display: flex; flex-direction: column; gap: var(--s-4); height: 100%; padding: var(--s-6); border-radius: var(--r-md); background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); border-bottom: 3px solid var(--c-primary); }
.feature h3 { font-size: 1.1875rem; color: var(--c-text-inverse); }
.feature p { color: var(--c-text-inverse-muted); }

/* Comparação e checklist */
.compare, .checklist { display: grid; gap: var(--s-4); }
.checklist { margin-top: var(--s-16); }
.compare h3, .checklist h3 { font: 700 var(--fs-h4)/1.2 var(--f-heading); letter-spacing: -0.01em; }
.compare > p, .checklist > p { color: var(--c-text-muted); max-width: 70ch; }
.table-wrap { overflow-x: auto; border: var(--b-subtle); border-radius: var(--r-md); }
.table { width: 100%; min-width: 680px; font-size: 0.9375rem; line-height: 1.5; }
.table caption { text-align: left; padding: var(--s-3) var(--s-4); font-size: var(--fs-caption); color: var(--c-text-muted); caption-side: bottom; border-top: var(--b-subtle); }
.table th, .table td { padding: var(--s-4); text-align: left; vertical-align: top; border-bottom: var(--b-subtle); }
.table thead th { background: var(--c-surface-dark); color: var(--c-text-inverse); font-weight: 700; }
.table thead th.is-highlight { background: var(--c-surface-dark-deep); color: var(--c-accent); }
.table tbody th { font-weight: 700; width: 20%; background: var(--c-surface); }
.table td.is-highlight { background: var(--c-primary-soft); font-weight: 600; }
.table tbody tr:last-child th, .table tbody tr:last-child td { border-bottom: 0; }
.table tbody tr:hover td:not(.is-highlight), .table tbody tr:hover th { background: var(--c-surface-alt); }
.note { font-size: 0.9375rem; color: var(--c-text-muted); }
.checklist__grid { counter-reset: none; }
.check-item { display: flex; flex-direction: column; gap: var(--s-3); padding: var(--s-6); background: var(--c-surface-alt); border-radius: var(--r-md); height: 100%; }
.check-item .icon-box--compact { background: var(--c-primary-soft); color: var(--c-surface-dark); }
.check-item p { color: var(--c-text-muted); font-size: 0.9375rem; line-height: 1.6; }

/* Áreas atendidas */
.area { display: flex; flex-direction: column; gap: var(--s-4); height: 100%; padding: var(--s-8); background: var(--c-surface); border: var(--b-subtle); border-radius: var(--r-md); }
.area h3 { font-size: 1.25rem; }
.area p { color: var(--c-text-muted); }

/* Avaliações */
.review { display: flex; flex-direction: column; gap: var(--s-4); height: 100%; padding: var(--s-6); background: var(--c-surface); color: var(--c-text); border-radius: var(--r-md); }
.review__rating { display: inline-flex; align-items: center; gap: var(--s-2); font-size: 0.875rem; font-weight: 700; color: var(--c-surface-dark); }
.review__rating .i { color: var(--c-primary-hover); fill: var(--c-primary); stroke: var(--c-primary-hover); }
.review__text { margin: 0; font-size: 1.0625rem; line-height: 1.65; padding-left: var(--s-4); border-left: 4px solid var(--c-primary); }
.review__author { margin-top: auto; display: grid; gap: 2px; font-size: 0.875rem; color: var(--c-text-muted); }
.review__author strong { color: var(--c-text); font-size: 1rem; }

/* FAQ */
.faq { border-top: var(--b-subtle); }
.faq__item { border-bottom: var(--b-subtle); }
.faq__item summary {
  display: flex; align-items: center; justify-content: space-between; gap: var(--s-4);
  min-height: 64px; padding: var(--s-4) var(--s-3); cursor: pointer; list-style: none; border-radius: var(--r-sm);
  transition: background-color var(--t-default);
}
.faq__item summary::-webkit-details-marker { display: none; }
.faq__item summary:hover { background: var(--c-surface-alt); }
.faq__item summary h3 { font: 600 1.0625rem/1.45 var(--f-body); letter-spacing: 0; }
.faq__item .i { color: var(--c-surface-dark); }
.faq__minus { display: none; }
.faq__item[open] .faq__plus { display: none; }
.faq__item[open] .faq__minus { display: block; }
.faq__answer { padding: 0 var(--s-3) var(--s-6); color: var(--c-text-muted); max-width: 70ch; }

/* CTA final com formulário */
.cta-final { background: var(--c-primary); color: var(--c-text); padding-block: var(--section); }
.cta-final__inner { display: grid; gap: var(--s-8); align-items: start; }
.cta-final__text { display: grid; gap: var(--s-4); justify-items: start; }
.cta-final__text h2 { color: var(--c-text); }
.cta-final__text > p { font-size: var(--fs-body-lg); max-width: 52ch; }
.list--dark li::before { background-color: var(--c-text); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F4B305' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E"); }
.cta-final__text .btn { margin-top: var(--s-2); }
@media (min-width: 1024px) { .cta-final__inner { grid-template-columns: 5fr 6fr; gap: var(--s-16); } }

.form { display: grid; gap: 20px; background: var(--c-surface); padding: var(--s-8) var(--s-6); border-radius: var(--r-md); box-shadow: var(--sh-lg); min-width: 0; }
@media (min-width: 768px) { .form { padding: var(--s-8); } }
.form__row { display: grid; gap: 20px; align-items: end; }
@media (min-width: 768px) { .form__row { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.field { display: grid; gap: var(--s-2); min-width: 0; }
.field label { font-weight: 600; color: var(--c-surface-dark); font-size: 0.9375rem; line-height: 1.4; }
.field input:not([type="checkbox"]), .field select, .field textarea {
  width: 100%; min-height: 52px; padding: 0 var(--s-4); font: 400 1rem/1.4 var(--f-body); color: var(--c-text);
  background: var(--c-surface); border: 1px solid var(--c-border-strong); border-radius: var(--r-sm);
  transition: border-color var(--t-default);
}
.field select { appearance: none; padding-right: var(--s-12); cursor: pointer;
  background: var(--c-surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23303F4A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 16px center; }
.field input:hover, .field select:hover { border-color: var(--c-surface-dark); }
.field select:focus-visible, .field input:focus-visible { outline: 2px solid var(--c-focus); outline-offset: 2px; border-color: var(--c-focus); }
.field select[aria-invalid="true"], .field input[aria-invalid="true"] { border: 2px solid var(--c-error); }
.field__error { color: var(--c-error); font-size: 0.875rem; font-weight: 600; }
.field--check { grid-template-columns: 24px 1fr; align-items: start; column-gap: var(--s-3); }
.field--check input { width: 22px; height: 22px; margin: 2px 0 0; accent-color: var(--c-surface-dark); }
.field--check label { font-weight: 400; color: var(--c-text-muted); font-size: 0.875rem; }
.field--check .field__error { grid-column: 1 / -1; }
.form__hint { font-size: 0.875rem; color: var(--c-text-muted); text-align: center; }
.form__status:empty { display: none; }
.form__status { font-size: 0.9375rem; font-weight: 600; color: var(--c-success); text-align: center; }
.form__status.is-error { color: var(--c-error); }
.form__status-texto { display: block; }
.form__status-btn { margin-top: var(--s-3); }
.form__error-summary { padding: var(--s-3) var(--s-4); border: 2px solid var(--c-error); border-radius: var(--r-sm); color: var(--c-error); font-weight: 600; font-size: 0.9375rem; }

/* ---------- Rodapé ---------- */
.footer { background: var(--c-surface-dark-deep); color: var(--c-text-inverse); padding-block: 80px var(--s-6); font-size: 0.9375rem; }
.footer a { color: var(--c-text-inverse); font-weight: 400; text-decoration: none; }
.footer a:hover { text-decoration: underline; color: var(--c-text-inverse); }
.footer__grid { display: grid; gap: var(--s-8); grid-template-columns: 1fr; }
@media (min-width: 768px) { .footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .footer__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.footer__title { font: 700 1.375rem/1.2 var(--f-heading); color: var(--c-text-inverse); margin-bottom: var(--s-4); }
.footer__title::after { content: ""; display: block; width: 24px; height: 3px; background: var(--c-primary); margin-top: var(--s-2); border-radius: 2px; }
.footer__col ul { display: grid; gap: var(--s-2); color: var(--c-text-inverse-muted); line-height: 1.55; }
.footer__col a { display: inline-flex; align-items: center; min-height: 32px; color: var(--c-text-inverse-muted); }
.footer__col li > strong { color: var(--c-text-inverse); }
.footer__trust { display: grid; gap: var(--s-6); margin-top: var(--s-12); padding-block: var(--s-8); border-top: 1px solid rgba(255,255,255,0.18); }
.footer__proofs { display: grid; gap: var(--s-3); grid-template-columns: 1fr; }
.footer__proofs li { display: inline-flex; align-items: center; gap: var(--s-2); color: var(--c-text-inverse-muted); }
.footer__proofs a { display: inline-flex; align-items: center; gap: var(--s-2); color: var(--c-text-inverse-muted); }
.footer__proofs .i { color: var(--c-accent); }
@media (min-width: 1024px) { .footer__proofs { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.footer__social { display: flex; gap: var(--s-2); }
.footer__social a { width: 44px; height: 44px; display: grid; place-items: center; border-radius: var(--r-sm); border: 1px solid rgba(255,255,255,0.2); color: var(--c-text-inverse); }
.footer__social a:hover { background: var(--c-primary); color: var(--c-text); border-color: var(--c-primary); }
@media (min-width: 1024px) {
  .footer__trust { grid-template-columns: 1fr auto; align-items: center; }
  .footer__proofs { grid-column: 1 / -1; }
}
.footer__bottom { display: grid; gap: var(--s-3); padding-top: var(--s-6); border-top: 1px solid rgba(255,255,255,0.18); font-size: 0.8125rem; color: var(--c-text-inverse-muted); }
.footer__legal { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-6); }
.footer__legal a { display: inline-flex; min-height: 32px; align-items: center; color: var(--c-text-inverse-muted); text-decoration: underline; }

/* ---------- Aviso de cookies (LGPD) ----------
   Visível já na primeira pintura, só com JS e sem escolha salva (classe consent-ok vem do <head>).
   Fixo no rodapé da tela: não empurra o conteúdo (sem CLS) e o body ganha um respiro do mesmo tamanho. */
.cookie { display: none; }
.js:not(.consent-ok) .cookie {
  position: fixed; z-index: 500; left: 0; right: 0; bottom: 0;
  display: grid; gap: var(--s-3); align-items: center;
  padding: var(--s-3) max(var(--gutter), env(safe-area-inset-right, 0px)) calc(var(--s-3) + env(safe-area-inset-bottom, 0px)) max(var(--gutter), env(safe-area-inset-left, 0px));
  background: var(--c-surface); border-top: 3px solid var(--c-primary); box-shadow: var(--sh-lg); font-size: 0.8125rem; line-height: 1.5;
}
.js:not(.consent-ok) body { padding-bottom: 168px; }
.cookie__titulo { font: 700 1rem/1.2 var(--f-body); margin-bottom: var(--s-1); }
.cookie a, .cookie-prefs a { color: var(--c-text); text-decoration: underline; font-weight: 600; }
.cookie__acoes { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s-2); }
.cookie__btn { min-height: 44px; padding: 8px var(--s-2); font-size: 0.875rem; white-space: nowrap; background: var(--c-surface); color: var(--c-surface-dark); border: 2px solid var(--c-surface-dark); }
.cookie__btn:hover { background: var(--c-primary-soft); color: var(--c-surface-dark); border-color: var(--c-surface-dark); }
@media (min-width: 768px) {
  .js:not(.consent-ok) .cookie { grid-template-columns: 1fr auto; gap: var(--s-6); padding-top: var(--s-4); padding-bottom: calc(var(--s-4) + env(safe-area-inset-bottom, 0px)); }
  .js:not(.consent-ok) body { padding-bottom: 104px; }
  .cookie__texto { max-width: 70ch; }
  .cookie__acoes { grid-template-columns: repeat(3, minmax(132px, auto)); }
}
@media (min-width: 1024px) { .js:not(.consent-ok) .cookie { padding-left: max(var(--gutter), calc((100% - var(--max)) / 2)); padding-right: max(var(--gutter), calc((100% - var(--max)) / 2)); } }

/* Painel de preferências */
.cookie-prefs { width: min(560px, calc(100% - 2 * var(--gutter))); max-height: calc(100dvh - 32px); padding: var(--s-6); border: 0; border-radius: var(--r-md); background: var(--c-surface); color: var(--c-text); box-shadow: var(--sh-lg); overflow: auto; }
.cookie-prefs::backdrop { background: var(--c-overlay-dark); }
.cookie-prefs__head { display: flex; align-items: center; justify-content: space-between; gap: var(--s-4); margin-bottom: var(--s-3); }
.cookie-prefs__head h2 { font: 700 var(--fs-h5)/1.2 var(--f-heading); }
.cookie-prefs__fechar { display: inline-grid; place-items: center; width: 44px; height: 44px; flex: none; border: 0; border-radius: var(--r-pill); background: var(--c-surface-alt); color: var(--c-text); cursor: pointer; }
.cookie-prefs__fechar:hover { background: var(--c-border); }
.cookie-prefs__intro { color: var(--c-text-muted); font-size: 0.9375rem; }
.cookie-prefs__lista { display: grid; gap: var(--s-2); margin: var(--s-4) 0; }
.cookie-cat { display: flex; align-items: center; justify-content: space-between; gap: var(--s-4); padding: var(--s-4); border: var(--b-subtle); border-radius: var(--r-md); }
.cookie-cat__texto { display: grid; gap: var(--s-1); cursor: pointer; }
.cookie-cat:first-child .cookie-cat__texto { cursor: default; }
.cookie-cat__nome { font-weight: 700; }
.cookie-cat__desc { color: var(--c-text-muted); font-size: 0.875rem; line-height: 1.5; }
.cookie-cat__fixo { flex: none; font-size: 0.8125rem; font-weight: 700; color: var(--c-success); }
.cookie-switch { appearance: none; -webkit-appearance: none; flex: none; position: relative; width: 52px; height: 30px; margin: 0; border-radius: var(--r-pill); background: var(--c-border-strong); cursor: pointer; transition: background var(--t-default); }
.cookie-switch::before { content: ""; position: absolute; top: 3px; left: 3px; width: 24px; height: 24px; border-radius: 50%; background: var(--c-surface); box-shadow: var(--sh-sm); transition: transform var(--t-default); }
.cookie-switch:checked { background: var(--c-success); }
.cookie-switch:checked::before { transform: translateX(22px); }
.cookie-switch:focus-visible, .cookie-prefs__fechar:focus-visible { outline: 3px solid var(--c-focus); outline-offset: 2px; }
.cookie-prefs__acoes { grid-template-columns: 1fr; }
.cookie-prefs__acoes .cookie__btn { white-space: normal; }
.cookie-prefs__link { margin-top: var(--s-3); font-size: 0.875rem; text-align: center; }
@media (min-width: 560px) { .cookie-prefs__acoes { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 559px) {
  .cookie-prefs { width: 100%; max-width: none; margin: auto 0 0; padding: var(--s-4) var(--gutter) calc(var(--s-4) + env(safe-area-inset-bottom, 0px)); border-radius: var(--r-md) var(--r-md) 0 0; }
}

/* ---------- Movimento reduzido ---------- */
/* =========================================================
   Hub de categoria
   ========================================================= */
.breadcrumb { padding-block: var(--s-4); background: var(--c-surface-alt); border-bottom: var(--b-subtle); }
.breadcrumb ol { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); font-size: 0.875rem; }
.breadcrumb li { display: inline-flex; align-items: center; gap: var(--s-2); color: var(--c-text-muted); }
.breadcrumb li + li::before { content: ""; width: 6px; height: 6px; border-top: 2px solid var(--c-border-strong); border-right: 2px solid var(--c-border-strong); transform: rotate(45deg); }
.breadcrumb a { display: inline-flex; align-items: center; min-height: 44px; color: var(--c-surface-dark); }
.breadcrumb [aria-current="page"] { color: var(--c-text); font-weight: 600; }

.hub-hero { background: var(--c-surface); padding-block: var(--s-12) var(--s-16); }
.hub-hero__inner { display: grid; gap: var(--s-8); align-items: center; }
.hub-hero__content { display: grid; gap: var(--s-6); }
.hub-hero__sub { font-size: var(--fs-body-lg); color: var(--c-text-muted); max-width: 52ch; }
.hub-hero__media { position: relative; }
.hub-hero__media img { width: 100%; height: auto; border-radius: var(--r-md); box-shadow: var(--sh-lg); aspect-ratio: 4 / 3; object-fit: cover; }
.hub-hero__media::before { content: ""; position: absolute; inset: auto -12px -12px auto; width: 45%; height: 45%; background: var(--c-primary); border-radius: var(--r-md); z-index: -1; }
.hub-hero__media { isolation: isolate; }
.hub-hero__proofs { display: grid; gap: var(--s-3); padding-top: var(--s-2); }
.hub-hero__proofs li { display: flex; align-items: center; gap: var(--s-3); font-weight: 600; font-size: 0.9375rem; }
.hub-hero__proofs .icon-box--compact { background: var(--c-primary-soft); color: var(--c-surface-dark); }
@media (min-width: 1024px) {
  .hub-hero { padding-block: var(--s-16) var(--s-24); }
  .hub-hero__inner { grid-template-columns: 1.1fr 1fr; gap: var(--s-16); }
}

.answer { background: var(--c-surface-dark); color: var(--c-text-inverse); padding-block: var(--s-8); }
.answer__inner { display: grid; gap: var(--s-4); grid-template-columns: auto 1fr; align-items: start; }
.answer .icon-box { background: var(--c-primary); color: var(--c-surface-dark); }
.answer p { font-size: var(--fs-body-lg); line-height: 1.65; max-width: 75ch; color: var(--c-text-inverse-muted); }
.answer strong { color: var(--c-text-inverse); }

.table--compare { min-width: 860px; }
.table--compare tbody th { width: 18%; }
.table--compare tbody th a { display: inline-block; padding-block: var(--s-1); }

.ig-group + .ig-group { margin-top: var(--s-16); }
.ig-group { display: grid; gap: var(--s-4); }
.ig-group > h3 { font: 700 var(--fs-h4)/1.2 var(--f-heading); letter-spacing: -0.01em; display: flex; align-items: center; gap: var(--s-3); }
.ig-group > p { color: var(--c-text-muted); max-width: 70ch; }
.check-item--alert .icon-box--compact { background: #FDE8E6; color: var(--c-error); }

/* =========================================================
   Página de serviço
   ========================================================= */
.svc-hero { position: relative; background: var(--c-surface-dark); color: var(--c-text-inverse); isolation: isolate; overflow: hidden; }
.svc-hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 30% center; z-index: -2; }
.svc-hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(20,29,38,0.9) 0%, rgba(20,29,38,0.78) 60%, rgba(20,29,38,0.6) 100%); z-index: -1; }
.svc-hero__inner { display: grid; gap: var(--s-8); padding-block: var(--s-12); align-items: center; }
.svc-hero__content { display: grid; gap: var(--s-6); min-width: 0; }
.svc-hero h1 { color: var(--c-text-inverse); }
.svc-hero__promise { font-size: var(--fs-body-lg); color: var(--c-text-inverse-muted); max-width: 52ch; }
.svc-hero__proofs { display: grid; gap: var(--s-3); grid-template-columns: 1fr; }
.svc-hero__proofs li { display: flex; align-items: center; gap: var(--s-3); padding: var(--s-3) var(--s-4); background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.14); border-radius: var(--r-md); font-weight: 600; font-size: 0.9375rem; }
.svc-hero__proofs .icon-box--compact { background: var(--c-primary); color: var(--c-surface-dark); flex: none; }
.form__title { font: 700 1.375rem/1.2 var(--f-heading); color: var(--c-surface-dark); }
.form__intro { font-size: 0.9375rem; color: var(--c-text-muted); margin-top: calc(-1 * var(--s-3)); }
@media (min-width: 768px) { .svc-hero__proofs { grid-template-columns: repeat(3, minmax(0, 1fr)); } .svc-hero__proofs li { flex-direction: column; align-items: flex-start; } }
@media (min-width: 1024px) {
  .svc-hero__inner { grid-template-columns: 7fr 5fr; gap: var(--s-16); padding-block: var(--s-16); }
}

.answer--light { background: var(--c-primary-soft); color: var(--c-text); border-bottom: var(--b-subtle); }
.answer--light p { color: var(--c-text); }
.answer--light strong { color: var(--c-text); }
.answer--light .icon-box { background: var(--c-surface-dark); color: var(--c-accent); }

.types { display: grid; gap: var(--card-gap); margin-top: var(--s-4); }
.type { padding: var(--s-6); border: var(--b-subtle); border-left: 3px solid var(--c-primary); border-radius: var(--r-md); background: var(--c-surface); display: grid; gap: var(--s-2); }
.type h3 { font-size: 1.1875rem; }
.type p { color: var(--c-text-muted); }

.signal { display: flex; gap: var(--s-4); align-items: flex-start; height: 100%; padding: var(--s-6); background: var(--c-surface); border: var(--b-subtle); border-radius: var(--r-md); }
.signal .icon-box { flex: none; }
.signal p { color: var(--c-text-muted); }
.signal strong { display: block; color: var(--c-text); margin-bottom: var(--s-1); }
.section--alt .signal { background: var(--c-surface); }

.steps--5 { grid-template-columns: 1fr; }
@media (min-width: 768px) { .steps--5 { grid-template-columns: 1fr; } }
@media (min-width: 1024px) {
  .steps--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
.step__time { display: inline-flex; align-items: center; gap: var(--s-2); align-self: flex-start; margin-top: auto; padding: var(--s-1) var(--s-3); border-radius: var(--r-pill); background: var(--c-primary-soft); color: var(--c-surface-dark); font-size: 0.8125rem; font-weight: 700; }

.addons { margin-top: var(--s-12); display: grid; gap: var(--s-4); }
.addons h3 { font: 700 var(--fs-h4)/1.2 var(--f-heading); }
.addons > p { color: var(--c-text-muted); max-width: 70ch; }

.ig-list { display: grid; gap: var(--s-4); }
.ig-col { display: grid; gap: var(--s-4); align-content: start; padding: var(--s-6); background: var(--c-surface-alt); border-radius: var(--r-md); }
.ig-col h4 { font-size: 1.125rem; display: flex; align-items: center; gap: var(--s-3); }
.ig-col h5 { font-size: 1rem; font-weight: 700; margin-bottom: var(--s-1); }
.ig-col li p { color: var(--c-text-muted); font-size: 0.9375rem; line-height: 1.6; }
.ig-col li { padding-top: var(--s-4); border-top: var(--b-subtle); }

.trust--flat { margin-top: var(--s-12); }
.trust--flat .trust__grid { box-shadow: none; }

.support-box { margin-top: var(--s-12); padding: var(--s-6); border: var(--b-subtle); border-left: 3px solid var(--c-primary); border-radius: var(--r-md); background: var(--c-surface); display: grid; gap: var(--s-3); }
.support-box__title { font: 700 1.25rem/1.2 var(--f-heading); }
.support-box ul { display: grid; gap: var(--s-2); }
.support-box a { display: inline-flex; align-items: center; gap: var(--s-2); min-height: 44px; }
@media (min-width: 1024px) { .support-box ul { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-6); } }

/* =========================================================
   Página Sobre (entity home)
   ========================================================= */
.about-hero { padding-block: var(--s-12) var(--s-16); background: var(--c-surface); }
.about-hero__inner { display: grid; gap: var(--s-12); align-items: start; }
.about-hero__content { display: grid; gap: var(--s-6); min-width: 0; }
.about-hero__def { display: grid; gap: var(--s-4); max-width: 68ch; }
.about-hero__def p { font-size: var(--fs-body-lg); line-height: 1.65; color: var(--c-text-muted); }
.about-hero__def p:first-child { color: var(--c-text); }
.about-hero__def strong { color: var(--c-text); }
.factsheet { background: var(--c-surface-dark); color: var(--c-text-inverse); border-radius: var(--r-md); padding: var(--s-8) var(--s-6); border-top: 4px solid var(--c-primary); }
.factsheet__title { font: 700 1.375rem/1.2 var(--f-heading); margin-bottom: var(--s-4); }
.factsheet dl { display: grid; }
.factsheet dl > div { display: grid; gap: var(--s-1); padding-block: var(--s-3); border-top: 1px solid rgba(255,255,255,0.14); }
.factsheet dt { font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--c-accent); }
.factsheet dd { margin: 0; color: var(--c-text-inverse-muted); }
.factsheet a { color: var(--c-text-inverse); }
.factsheet :focus-visible { outline-color: var(--c-focus-inverse); }
@media (min-width: 1024px) { .about-hero__inner { grid-template-columns: 7fr 4fr; gap: var(--s-16); } .factsheet { position: sticky; top: calc(var(--header-h) + 24px); } }

.timeline { display: grid; gap: var(--card-gap); }
.timeline__item { position: relative; display: grid; gap: var(--s-3); align-content: start; padding: var(--s-6); background: var(--c-surface); border: var(--b-subtle); border-radius: var(--r-md); border-top: 4px solid var(--c-primary); }
.timeline__year { font: 700 2.25rem/1 var(--f-heading); color: var(--c-surface-dark); }
.timeline__item h3 { font-size: 1.125rem; }
.timeline__item p { color: var(--c-text-muted); }
@media (min-width: 768px) { .timeline { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .timeline { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.person { display: grid; gap: 0; background: var(--c-surface); border: var(--b-subtle); border-radius: var(--r-md); overflow: hidden; height: 100%; }
.person__img { width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; }
.person__body { display: grid; gap: var(--s-3); padding: var(--s-6); align-content: start; }
.person__body h3 { font: 700 var(--fs-h4)/1.1 var(--f-heading); }
.person__role { font-weight: 600; color: var(--c-surface-dark); font-size: 0.9375rem; }
.person__body > p:not(.person__role) { color: var(--c-text-muted); }
.person__facts { display: grid; gap: var(--s-2); padding-top: var(--s-3); border-top: var(--b-subtle); font-size: 0.9375rem; }
.person__facts li { display: flex; gap: var(--s-2); align-items: flex-start; }
.person__facts .i { flex: none; margin-top: 3px; color: var(--c-surface-dark); }
@media (min-width: 768px) { .person { grid-template-columns: 2fr 3fr; } .person__img { height: 100%; aspect-ratio: auto; } }

.note--center { text-align: center; margin-top: var(--s-4); }
.trust--static { margin-top: 0; }
.cred-block { display: grid; gap: var(--s-4); }
.cred-block h3, .cred-grid h3 { font: 700 var(--fs-h4)/1.2 var(--f-heading); }
.cred-grid { margin-top: var(--s-12); }
.cred-grid h3 { font-size: 1.375rem; }

.nap { display: grid; gap: var(--s-4); align-content: start; padding: var(--s-8) var(--s-6); background: var(--c-surface-alt); border-radius: var(--r-md); }
.nap h3 { font: 700 1.375rem/1.2 var(--f-heading); }
.nap address { font-style: normal; display: grid; gap: var(--s-3); line-height: 1.6; }
.nap .btn { justify-self: start; }
.nap__hours { display: grid; border-top: var(--b-subtle); }
.nap__hours li { display: flex; justify-content: space-between; gap: var(--s-4); padding-block: var(--s-3); border-bottom: var(--b-subtle); }
.profiles { display: grid; gap: var(--s-2); }
.profiles a { display: flex; align-items: center; gap: var(--s-3); min-height: 52px; padding: var(--s-3) var(--s-4); background: var(--c-surface); border: var(--b-subtle); border-radius: var(--r-sm); text-decoration: none; }
.profiles a:hover { border-color: var(--c-surface-dark); }
.profiles a span { text-decoration: underline; text-underline-offset: 0.2em; }

/* =========================================================
   Página de contato
   ========================================================= */
.field textarea { min-height: 112px; padding: var(--s-3) var(--s-4); resize: vertical; }
.field textarea:focus-visible { outline: 2px solid var(--c-focus); outline-offset: 2px; border-color: var(--c-focus); }
.field__hint { font-size: 0.8125rem; color: var(--c-text-muted); }
.contact-hero { background: var(--c-surface-alt); padding-block: var(--s-12) var(--s-16); }
.contact-hero__inner { display: grid; gap: var(--s-8); align-items: start; }
.contact-hero__content { display: grid; gap: var(--s-6); min-width: 0; }
.contact-hero__intro { font-size: var(--fs-body-lg); color: var(--c-text-muted); max-width: 52ch; }
.contact-facts { display: grid; gap: var(--s-3); }
.contact-facts li { display: flex; gap: var(--s-3); align-items: flex-start; padding: var(--s-4); background: var(--c-surface); border: var(--b-subtle); border-radius: var(--r-md); }
.contact-facts .icon-box--compact { flex: none; background: var(--c-primary-soft); color: var(--c-surface-dark); }
.contact-facts p { color: var(--c-text-muted); font-size: 0.9375rem; }
.contact-facts strong { display: block; color: var(--c-text); }
@media (min-width: 1024px) { .contact-hero__inner { grid-template-columns: 5fr 6fr; gap: var(--s-16); } .contact-hero .form { position: sticky; top: calc(var(--header-h) + 24px); } }
.channel { display: flex; flex-direction: column; gap: var(--s-3); height: 100%; padding: var(--s-6); background: var(--c-surface); border: var(--b-subtle); border-radius: var(--r-md); border-bottom: 3px solid var(--c-primary); }
.channel h3 { font-size: 1.1875rem; }
.channel p { color: var(--c-text-muted); }
.channel .card__link { margin-top: auto; }
.map-wrap { display: grid; gap: var(--card-gap); }
.map { position: relative; border-radius: var(--r-md); overflow: hidden; background: var(--c-surface-alt); aspect-ratio: 16 / 9; }
.map img { width: 100%; height: 100%; object-fit: cover; }
.map .btn { position: absolute; left: 50%; bottom: var(--s-6); transform: translateX(-50%); white-space: nowrap; }
.map.is-loaded iframe { width: 100%; height: 100%; border: 0; display: block; }
.hours { display: grid; gap: var(--s-4); align-content: start; padding: var(--s-6); background: var(--c-surface); border: var(--b-subtle); border-radius: var(--r-md); }
.hours h3 { font: 700 1.375rem/1.2 var(--f-heading); }
.hours address { font-style: normal; line-height: 1.6; }
@media (min-width: 1024px) { .map-wrap { grid-template-columns: 2fr 1fr; } }
.wa-band { background: var(--c-surface-dark); color: var(--c-text-inverse); padding-block: var(--s-12); }
.wa-band__inner { display: grid; gap: var(--s-6); align-items: center; }
.wa-band h2 { color: var(--c-text-inverse); }
.wa-band p { color: var(--c-text-inverse-muted); max-width: 60ch; }
.wa-band :focus-visible { outline-color: var(--c-focus-inverse); }
@media (min-width: 1024px) { .wa-band__inner { grid-template-columns: 1fr auto; gap: var(--s-12); } }

/* =========================================================
   Blog: hub e categoria
   ========================================================= */
.blog-hero { background: var(--c-surface-alt); padding-block: var(--s-12); border-bottom: var(--b-subtle); }
.blog-hero__inner { display: grid; gap: var(--s-4); max-width: 820px; }
.blog-hero__intro { font-size: var(--fs-body-lg); color: var(--c-text-muted); max-width: 64ch; }
.post-meta { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-4); font-size: 0.8125rem; color: var(--c-text-muted); }
.post-meta span { display: inline-flex; align-items: center; gap: var(--s-1); }
.card .post-meta { margin-top: calc(-1 * var(--s-1)); }
.featured { display: grid; background: var(--c-surface); border: var(--b-subtle); border-radius: var(--r-md); overflow: hidden; box-shadow: var(--sh-sm); }
.featured__img { width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.featured__body { display: grid; gap: var(--s-4); padding: var(--s-8) var(--s-6); align-content: center; }
.featured__body h2, .featured__body h3 { font: 700 var(--fs-h3)/1.15 var(--f-heading); }
.featured__body p:not(.card__tag) { color: var(--c-text-muted); }
.featured__body .btn { justify-self: start; }
@media (min-width: 1024px) { .featured { grid-template-columns: 1fr 1fr; } .featured__body { padding: var(--s-12); } }
.grid--featured { display: grid; gap: var(--card-gap); margin-bottom: var(--card-gap); }
@media (min-width: 1024px) { .grid--featured { grid-template-columns: repeat(2, minmax(0, 1fr)); } .grid--featured .featured { grid-template-columns: 1fr; } .grid--featured .featured__body { padding: var(--s-8); } }
.cat-nav { display: grid; gap: var(--s-3); grid-template-columns: 1fr; }
.cat-nav a { display: flex; align-items: center; gap: var(--s-3); height: 100%; min-height: 64px; padding: var(--s-4); background: var(--c-surface); border: var(--b-subtle); border-radius: var(--r-md); text-decoration: none; color: var(--c-text); }
.cat-nav a:hover { border-color: var(--c-surface-dark); background: var(--c-primary-soft); }
.cat-nav .icon-box--compact { flex: none; background: var(--c-primary-soft); color: var(--c-surface-dark); }
.cat-nav strong { display: block; font-size: 0.9375rem; line-height: 1.3; text-decoration: underline; text-underline-offset: 0.2em; }
.cat-nav small { color: var(--c-text-muted); font-size: 0.8125rem; }
@media (min-width: 1024px) { .cat-nav { grid-template-columns: repeat(5, minmax(0, 1fr)); } .cat-nav a { flex-direction: column; align-items: flex-start; } }
.pagination { margin-top: var(--s-12); }
.pagination ol { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--s-2); }
.pagination a, .pagination span { display: inline-flex; align-items: center; justify-content: center; gap: var(--s-1); min-width: 44px; min-height: 44px; padding: 0 var(--s-3); border: var(--b-subtle); border-radius: var(--r-sm); background: var(--c-surface); text-decoration: none; font-weight: 600; }
.pagination a:hover { border-color: var(--c-surface-dark); }
.pagination [aria-current="page"] { background: var(--c-surface-dark); color: var(--c-text-inverse); border-color: var(--c-surface-dark); }
.pagination .is-disabled { color: var(--c-border-strong); }
.blog-cta { display: grid; gap: var(--s-6); align-items: center; padding: var(--s-8) var(--s-6); background: var(--c-primary); border-radius: var(--r-md); }
.blog-cta h2 { font-size: var(--fs-h3); }
.blog-cta p { max-width: 60ch; }
@media (min-width: 1024px) { .blog-cta { grid-template-columns: 1fr auto; padding: var(--s-12); gap: var(--s-12); } }

.cat-nav a[aria-current] { background: var(--c-primary-soft); border-color: var(--c-surface-dark); box-shadow: inset 0 -3px 0 var(--c-primary); }

/* =========================================================
   Artigo do blog
   ========================================================= */
.article__header { padding-block: var(--s-12) var(--s-8); background: var(--c-surface); }
.article__header .container { display: grid; gap: var(--s-6); }
.byline { display: flex; gap: var(--s-4); align-items: center; padding-block: var(--s-4); border-block: var(--b-subtle); }
.byline__img { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; flex: none; }
.byline__name { font-weight: 600; font-size: 0.9375rem; margin-bottom: var(--s-1); }
.article__answer { font-size: var(--fs-body-lg); line-height: 1.65; padding: var(--s-6); background: var(--c-primary-soft); border-left: 4px solid var(--c-primary); border-radius: 0 var(--r-md) var(--r-md) 0; }
.article__body { display: grid; gap: var(--s-12); padding-bottom: var(--s-16); }
.article__body > section { display: grid; gap: var(--s-4); }
.article__body h2 { font: 700 var(--fs-h3)/1.15 var(--f-heading); scroll-margin-top: calc(var(--header-h) + 24px); }
.article__body h3 { font-size: 1.25rem; margin-top: var(--s-4); }
.article__body h4 { font-size: 1.0625rem; margin-top: var(--s-2); }
.article__body p { line-height: 1.75; }
.article__body .lead-answer { font-size: 1.0625rem; font-weight: 600; color: var(--c-text); }
.summary-box, .toc, .cta-box, .author-box { border-radius: var(--r-md); padding: var(--s-6); }
.summary-box { background: var(--c-surface-alt); display: grid; gap: var(--s-3); }
.summary-box__cta { margin-top: var(--s-2); }
.summary-box__cta .btn { width: 100%; }
@media (min-width: 768px) { .summary-box__cta .btn { width: auto; } }
.summary-box__title, .toc__title, .cta-box__title { font: 700 1.25rem/1.2 var(--f-heading); }
.toc { border: var(--b-subtle); display: grid; gap: var(--s-3); }
.toc ol { display: grid; gap: var(--s-1); padding-left: var(--s-6); list-style: decimal; }
.toc a { display: inline-block; padding-block: var(--s-2); }
.cta-box { background: var(--c-surface-dark); color: var(--c-text-inverse); display: grid; gap: var(--s-4); margin-top: var(--s-4); border-bottom: 4px solid var(--c-primary); }
.cta-box p { color: var(--c-text-inverse-muted); }
.cta-box .cta-box__title { color: var(--c-text-inverse); }
.cta-box a:not(.btn) { color: var(--c-text-inverse); }
.cta-box .btn { justify-self: start; background: var(--c-primary); color: var(--c-text); border-color: var(--c-primary); }
.cta-box :focus-visible { outline-color: var(--c-focus-inverse); }
.quiz { display: grid; gap: var(--s-2); counter-reset: q; }
.quiz li { counter-increment: q; display: flex; gap: var(--s-3); align-items: flex-start; padding: var(--s-3) var(--s-4); border: var(--b-subtle); border-radius: var(--r-sm); background: var(--c-surface); }
.quiz li::before { content: counter(q); flex: none; display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--c-primary); font-weight: 700; font-size: 0.875rem; }
.quiz-result .check-item h4 { margin-top: 0; }
.author-box { display: grid; gap: var(--s-6); background: var(--c-surface-alt); align-items: start; }
.author-box__img { width: 96px; height: 96px; border-radius: 50%; object-fit: cover; }
.author-box__label { font-size: 0.75rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-text-muted); }
.author-box__name { font: 700 1.375rem/1.2 var(--f-heading); margin-bottom: var(--s-2); }
.author-box p:not(.author-box__label):not(.author-box__name) { color: var(--c-text-muted); }
@media (min-width: 768px) { .author-box { grid-template-columns: 96px 1fr; } }
.article .faq h3 { margin-top: 0; font-size: 1.0625rem; }

/* ---------- Páginas legais ---------- */
.legal-data { display: grid; gap: var(--s-2); padding: var(--s-6); background: var(--c-surface-alt); border-radius: var(--r-md); }
.legal-data li { line-height: 1.6; }
.legal .table-wrap { margin-top: var(--s-2); }
.legal-links { display: grid; gap: var(--s-3); padding-top: var(--s-6); border-top: var(--b-subtle); }
.legal-links .list { display: grid; gap: var(--s-1); }
.legal-links a { display: inline-block; padding-block: var(--s-2); }

/* ---------- Página de obrigado e 404 ---------- */
.thanks-hero, .error-hero { background: var(--c-surface-alt); padding-block: var(--s-16); border-bottom: var(--b-subtle); }
.thanks-hero__inner, .error-hero__inner { display: grid; gap: var(--s-4); justify-items: center; text-align: center; }
.thanks-hero__icon, .error-hero__icon { width: 64px; height: 64px; background: var(--c-primary-soft); color: var(--c-surface-dark); }
.thanks-hero__icon .i, .error-hero__icon .i { width: 32px; height: 32px; }
.thanks-hero h1, .error-hero h1 { max-width: 22ch; }
.thanks-hero__service { font-size: var(--fs-body-lg); }
.thanks-hero__intro, .error-hero__intro { font-size: var(--fs-body-lg); color: var(--c-text-muted); max-width: 56ch; }
.thanks-deadline { display: flex; gap: var(--s-3); align-items: flex-start; text-align: left; max-width: 60ch; padding: var(--s-4) var(--s-6); background: var(--c-surface); border: var(--b-subtle); border-left: 4px solid var(--c-primary); border-radius: 0 var(--r-md) var(--r-md) 0; }
.thanks-deadline .i { flex: none; margin-top: 2px; }
.thanks-hero__ctas, .error-hero .btn-group { justify-content: center; margin-top: var(--s-2); }
.steps--3 { grid-template-columns: 1fr; }
@media (min-width: 768px) { .steps--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.wa-band .btn-group { align-items: center; }
.wa-band .wa-band__alt { background: transparent; color: var(--c-text-inverse); border-color: var(--c-text-inverse); }
.wa-band .wa-band__alt:hover { background: var(--c-text-inverse); color: var(--c-surface-dark); }

/* Formulário de orçamento: honeypot e estado de carregamento do botão (31/10/2026) */
.form__hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.btn.is-loading { position: relative; cursor: progress; opacity: 0.85; }
.btn.is-loading::before { content: ""; width: 16px; height: 16px; margin-right: var(--s-2); border: 2px solid currentColor; border-right-color: transparent; border-radius: var(--r-pill); animation: girar 700ms linear infinite; }
@keyframes girar { to { transform: rotate(360deg); } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: 0.01ms !important; }
}
/* Pop-ups de captação: orçamento em 2 passos, caixa de canto e barra fixa do celular (31/10/2026) */
.pop { width: min(920px, calc(100% - 2 * var(--gutter))); max-height: calc(100dvh - 32px); padding: 0; border: 0; border-radius: var(--r-md); background: var(--c-surface); box-shadow: var(--sh-lg); color: var(--c-text); overflow: auto; }
.pop::backdrop { background: var(--c-overlay-dark); }
.pop__inner { display: grid; }
.pop__aside { display: grid; gap: var(--s-3); align-content: start; padding: var(--s-6); background: var(--c-surface-dark); color: var(--c-text-inverse); }
.pop__title { font: 700 clamp(1.5rem, 2.4vw, 2rem)/1.1 var(--f-heading); color: var(--c-text-inverse); padding-right: var(--s-12); }
.pop__text { color: var(--c-text-inverse-muted); font-size: 0.9375rem; }
.pop__proofs { display: none; gap: var(--s-2); font-size: 0.875rem; color: var(--c-text-inverse-muted); }
.pop__proofs li { display: flex; gap: var(--s-2); align-items: center; }
.pop__proofs .i { color: var(--c-accent); }
.pop__wa { display: none; align-items: center; gap: var(--s-2); color: var(--c-text-inverse); font-weight: 600; font-size: 0.9375rem; text-underline-offset: 3px; }
.pop .form { box-shadow: none; border-radius: 0; gap: var(--s-4); }
.pop__close { position: absolute; top: var(--s-3); right: var(--s-3); display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: var(--r-pill); background: var(--c-surface); color: var(--c-text); cursor: pointer; box-shadow: var(--sh-sm); }
.pop__close:focus-visible, .pop-corner__close:focus-visible, .pop__back:focus-visible, .pop-card:focus-within { outline: 2px solid var(--c-focus); outline-offset: 2px; }
.pop__steps { display: grid; gap: var(--s-2); font-size: 0.8125rem; font-weight: 600; color: var(--c-text-muted); text-transform: uppercase; letter-spacing: 0.06em; }
.pop__bar { display: block; height: 4px; border-radius: var(--r-pill); background: var(--c-surface-alt); overflow: hidden; }
.pop__bar-fill { display: block; width: 50%; height: 100%; background: var(--c-primary); transition: width var(--t-medium); }
.pop__step { display: grid; gap: var(--s-4); min-width: 0; margin: 0; padding: 0; border: 0; }
.pop__step[hidden] { display: none; }
.pop__step legend { padding: 0; margin-bottom: var(--s-1); font: 700 1.25rem/1.2 var(--f-heading); color: var(--c-surface-dark); }
.pop-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-2); }
.pop-card { position: relative; display: flex; align-items: center; gap: var(--s-2); min-height: 52px; padding: var(--s-2) var(--s-3); border: var(--b-subtle); border-radius: var(--r-sm); font-size: 0.875rem; font-weight: 600; line-height: 1.25; cursor: pointer; transition: border-color var(--t-default), background var(--t-default); }
.pop-card input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.pop-card .i { flex: none; color: var(--c-surface-dark); }
.pop-card:hover { border-color: var(--c-border-strong); }
.pop-card:has(input:checked) { border: 2px solid var(--c-surface-dark); background: var(--c-primary-soft); }
.pop__back { justify-self: center; min-height: 44px; padding: 0 var(--s-3); border: 0; background: none; color: var(--c-text-muted); font: inherit; font-size: 0.875rem; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.pop-corner { position: fixed; z-index: 60; right: var(--s-4); bottom: var(--s-4); width: min(340px, calc(100% - 2 * var(--s-4))); display: grid; gap: var(--s-3); padding: var(--s-6) var(--s-6) var(--s-4); border-top: 4px solid var(--c-primary); border-radius: var(--r-md); background: var(--c-surface); box-shadow: var(--sh-lg); font-size: 0.9375rem; color: var(--c-text-muted); }
.pop-corner__title { font: 700 1.375rem/1.15 var(--f-heading); color: var(--c-surface-dark); padding-right: var(--s-8); }
.pop-corner__close { position: absolute; top: var(--s-2); right: var(--s-2); display: grid; place-items: center; width: 44px; height: 44px; border: 0; background: none; color: var(--c-text-muted); cursor: pointer; }
.pop-bar { position: fixed; z-index: 55; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: 1fr auto; gap: var(--s-2); padding: var(--s-2) var(--gutter) calc(var(--s-2) + env(safe-area-inset-bottom)); background: var(--c-surface); border-top: var(--b-subtle); box-shadow: 0 -6px 20px rgba(20,29,38,0.10); }
.pop-bar .btn--whatsapp { width: 52px; padding: 0; justify-content: center; }
.pop-bar[hidden], .pop-corner[hidden] { display: none; }
@media (max-width: 767px) {
  .pop { width: 100%; max-width: 100%; margin: auto 0 0; max-height: 88dvh; border-radius: var(--r-md) var(--r-md) 0 0; }
  .pop__aside { padding: var(--s-6) var(--gutter) var(--s-4); }
  .pop .form { padding: var(--s-6) var(--gutter); }
  .pop-corner { right: var(--s-2); left: var(--s-2); width: auto; bottom: 76px; }
}
@media (min-width: 768px) {
  .pop__inner { grid-template-columns: 5fr 7fr; }
  .pop__aside { padding: var(--s-8); }
  .pop__proofs, .pop__wa { display: grid; }
  .pop__wa { display: inline-flex; margin-top: auto; }
  .pop__close { background: transparent; box-shadow: none; }
}
@media (max-width: 1023px) { body:has(.pop-bar:not([hidden])) { padding-bottom: 72px; } }
@media (min-width: 1024px) { .pop-bar { display: none; } }
@media (prefers-reduced-motion: no-preference) {
  .pop[open] { animation: pop-entrar var(--t-slow); }
  .pop-corner:not([hidden]) { animation: pop-subir var(--t-slow); }
}
@keyframes pop-entrar { from { opacity: 0; transform: translateY(16px) scale(0.98); } to { opacity: 1; transform: none; } }
@keyframes pop-subir { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) { .btn.is-loading::before { animation: none; } }