/* =========================================================
   ExploraBora Viagens — Sistema de Design (CSS Tokens)
   Paleta oficial da apresentação da marca:
   #0080C5 azul-bora  |  #273850 azul-noite  |  #4D26A5 roxo profundo
   #9B47DB lavanda    |  #5540C2 índigo       |  #848688 grafite
   ========================================================= */

:root {
  /* Marca */
  --bora-blue: #0080C5;
  --bora-blue-dark: #006BA6;
  --bora-night: #273850;
  --bora-purple-deep: #4D26A5;
  --bora-purple: #5540C2;
  --bora-lavender: #9B47DB;
  --bora-gray: #848688;

  /* Neutros */
  --ink: #11192B;
  --ink-soft: #344056;
  --muted: #6B7280;
  --line: #E6E9EE;
  --bg: #FFFFFF;
  --bg-soft: #F4F7FB;
  --bg-deep: #0E1729;

  /* Accent / utilidades */
  --whatsapp: #25D366;
  --whatsapp-dark: #1ebe5d;
  --gold: #E4B95B;
  --success: #16A34A;
  --error: #DC2626;

  /* Tipografia */
  --font-display: "Quicksand","Nunito","Filson","Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --font-body: "Inter","Quicksand",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;

  /* Layout */
  --container: 1200px;
  --container-narrow: 880px;
  --radius: 14px;
  --radius-lg: 22px;
  --shadow-sm: 0 1px 2px rgba(15,23,42,.06), 0 2px 8px rgba(15,23,42,.04);
  --shadow: 0 4px 16px rgba(15,23,42,.08), 0 12px 32px rgba(15,23,42,.06);
  --shadow-lg: 0 16px 48px rgba(15,23,42,.14);

  --transition: 220ms cubic-bezier(.2,.7,.2,1);
}

/* ====== Reset enxuto ====== */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.6;
  color: var(--ink);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img, svg, video { max-width: 100%; display: block; }
a { color: var(--bora-blue); text-decoration: none; transition: color var(--transition); }
a:hover { color: var(--bora-purple); }
button { font: inherit; cursor: pointer; }
ul, ol { padding: 0; margin: 0; list-style: none; }

/* Acessibilidade */
.skip-link {
  position: absolute; top: -100px; left: 16px; background: var(--bora-night); color: #fff;
  padding: 12px 16px; border-radius: 10px; z-index: 1000;
}
.skip-link:focus { top: 16px; }
:focus-visible { outline: 3px solid var(--bora-lavender); outline-offset: 3px; border-radius: 6px; }
.visually-hidden {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

/* ====== Layout ====== */
.container { width: 100%; max-width: var(--container); margin: 0 auto; padding: 0 24px; }
.container.narrow { max-width: var(--container-narrow); }
.center { text-align: center; }

/* ====== Tipografia ====== */
h1, h2, h3, h4, h5 { font-family: var(--font-display); color: var(--bora-night); margin: 0 0 .5em; line-height: 1.15; letter-spacing: -.01em; }
h1 { font-size: clamp(2.2rem, 5vw, 3.6rem); font-weight: 700; }
h1 em { font-style: normal; color: var(--bora-blue); }
h2 { font-size: clamp(1.6rem, 3.4vw, 2.4rem); font-weight: 700; }
h3 { font-size: 1.25rem; font-weight: 700; }
p  { margin: 0 0 1em; color: var(--ink-soft); }
.lead { font-size: clamp(1.05rem, 1.6vw, 1.2rem); color: var(--ink-soft); }

.eyebrow {
  display: inline-block;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: .78rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--bora-blue);
  background: rgba(0,128,197,.08);
  border: 1px solid rgba(0,128,197,.18);
  padding: 6px 12px;
  border-radius: 999px;
  margin: 0 0 18px;
}
.eyebrow.gold { color: #8a6a1a; background: rgba(228,185,91,.16); border-color: rgba(228,185,91,.4); }
.eyebrow.center { display: inline-block; }

/* ====== Botões ====== */
.btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 12px 22px; border-radius: 999px; font-family: var(--font-display);
  font-weight: 700; font-size: .98rem; letter-spacing: .01em;
  border: 1.5px solid transparent; cursor: pointer; transition: all var(--transition);
  text-decoration: none; line-height: 1;
}
.btn-lg { padding: 16px 28px; font-size: 1.05rem; }
.btn-primary {
  background: var(--whatsapp); color: #fff;
  box-shadow: 0 8px 24px rgba(37,211,102,.3);
}
.btn-primary:hover { background: var(--whatsapp-dark); transform: translateY(-1px); color: #fff; }
.btn-secondary {
  background: var(--bora-blue); color: #fff;
}
.btn-secondary:hover { background: var(--bora-blue-dark); color: #fff; transform: translateY(-1px); }
.btn-ghost {
  background: transparent; color: var(--bora-night);
  border-color: rgba(39,56,80,.2);
}
.btn-ghost:hover { background: rgba(0,128,197,.06); color: var(--bora-blue); border-color: var(--bora-blue); }
.btn-gold {
  background: linear-gradient(135deg, #d6a23f, #f3cf78);
  color: #2a1d05;
  border-color: rgba(0,0,0,0);
  box-shadow: 0 8px 24px rgba(214,162,63,.3);
}
.btn-gold:hover { transform: translateY(-1px); color: #1a1305; }

/* ====== Header ====== */
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255,255,255,.92);
  backdrop-filter: saturate(140%) blur(10px);
  border-bottom: 1px solid var(--line);
}
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 14px 0; }
/* === Logo oficial explora bora — abordagem robusta com 2 SVGs ===
   Header e demais contextos light: src="symbol-azul.svg" (cor azul-bora)
   Footer escuro: substitui via CSS para "symbol-branco.svg" (cor branca)
   Sem mask, sem currentColor, sem dependência de http:// — funciona
   inclusive em file:// e qualquer browser. */
.brand {
  display: inline-flex; align-items: center; gap: 10px;
  color: var(--bora-blue);
  font-family: var(--font-display); font-weight: 700; font-size: 1.4rem;
  letter-spacing: -.02em; text-transform: lowercase;
  text-decoration: none;
  transition: opacity 220ms cubic-bezier(.23,1,.32,1);
}
.brand:hover { opacity: .85; color: var(--bora-blue); }
.brand .brand-mark {
  display: inline-block;
  height: 40px; width: auto;
  /* Resetar qualquer mask/background residual de versões anteriores */
  background: none !important;
  -webkit-mask: none !important;
          mask: none !important;
}
.brand-name { color: var(--bora-blue); font-weight: 700; }
.brand-name strong { color: var(--bora-night); font-weight: 700; }
/* Footer escuro: troca o src do símbolo para a versão branca via content-image */
.site-footer .brand .brand-mark {
  content: url("../img/logo/symbol-branco.svg");
}

.nav-main { display: none; }
.nav-main ul { display: flex; gap: 28px; align-items: center; }
.nav-main a, .nav-main button {
  color: var(--bora-night); font-family: var(--font-display); font-weight: 600; font-size: .98rem;
  background: none; border: 0; padding: 4px 0; position: relative;
}
.nav-main a:hover, .nav-main button:hover { color: var(--bora-blue); }
.nav-main .link-accent { color: var(--bora-purple-deep); }
.nav-main .link-accent::after { content: "✦"; margin-left: 6px; color: var(--bora-lavender); }

.has-mega { position: relative; }
.has-mega .mega {
  /* Visualmente parece com gap de 12px do trigger,
     mas a área de hit começa COLADA no trigger via ::before bridge — fix do dropdown que sumia. */
  position: absolute; left: -16px; top: 100%; min-width: 320px;
  margin-top: 12px;
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow-lg); padding: 8px;
  /* Estado fechado: invisível mas ainda no DOM (não usar display:none — quebra animação) */
  opacity: 0; visibility: hidden; pointer-events: none;
  transform: translateY(-4px);
  transition: opacity 200ms var(--ease-spring),
              transform 240ms var(--ease-spring),
              visibility 0s linear 200ms;
}
/* Bridge invisível que preenche o gap entre trigger e mega.
   Sem isso, o cursor "cai" no vazio e o hover é perdido. */
.has-mega .mega::before {
  content: ""; position: absolute;
  left: 0; right: 0; top: -16px; height: 16px;
  pointer-events: auto;
}
/* Abre por hover, focus interno OU clique (aria-expanded=true) */
.has-mega:hover .mega,
.has-mega:focus-within .mega,
.has-mega > button[aria-expanded="true"] + .mega {
  opacity: 1; visibility: visible; pointer-events: auto;
  transform: translateY(0);
  transition: opacity 200ms var(--ease-spring),
              transform 240ms var(--ease-spring),
              visibility 0s;
}
/* Botão de trigger com indicador de seta */
.has-mega > button {
  background: transparent; border: 0; padding: 8px 4px;
  font: inherit; color: var(--ink); cursor: pointer;
  display: inline-flex; align-items: center; gap: 4px;
}
.has-mega > button::after {
  content: "›"; display: inline-block; transform: rotate(90deg);
  font-size: 1.1em; line-height: 1; opacity: .55;
  transition: transform 240ms var(--ease-spring), opacity 200ms ease;
}
.has-mega:hover > button::after,
.has-mega:focus-within > button::after,
.has-mega > button[aria-expanded="true"]::after {
  transform: rotate(-90deg) scaleX(-1);
  opacity: 1;
}
.has-mega .mega a {
  display: block; padding: 12px 14px; border-radius: 10px;
}
.has-mega .mega a:hover { background: var(--bg-soft); }
.has-mega .mega strong { display: block; color: var(--bora-night); font-size: .98rem; }
.has-mega .mega span { display: block; font-size: .85rem; color: var(--muted); margin-top: 2px; }

.header-cta { display: none; }
.nav-toggle {
  display: inline-flex; flex-direction: column; gap: 4px;
  width: 40px; height: 40px; border-radius: 10px; border: 1px solid var(--line); background: #fff;
  align-items: center; justify-content: center;
}
.nav-toggle span { width: 18px; height: 2px; background: var(--bora-night); border-radius: 2px; }

@media (min-width: 980px) {
  .nav-main { display: block; }
  .header-cta { display: inline-flex; }
  .nav-toggle { display: none; }
}

/* ====== HERO ====== */
.hero { position: relative; overflow: hidden; padding: 80px 0 96px; isolation: isolate; }
.hero-bg {
  position: absolute; inset: 0;
  background:
    radial-gradient(60% 70% at 80% 20%, rgba(155,71,219,.18), transparent 60%),
    radial-gradient(50% 60% at 10% 90%, rgba(0,128,197,.18), transparent 60%),
    linear-gradient(180deg, #F8FAFD 0%, #FFFFFF 70%);
  z-index: -1;
}
.hero h1 { letter-spacing: -.02em; }
.hero .lead { max-width: 640px; }
.cta-row { display: flex; flex-wrap: wrap; gap: 14px; margin: 24px 0 28px; }
.hero-trust {
  display: flex; flex-wrap: wrap; gap: 18px 32px; padding-top: 12px; color: var(--muted);
  font-size: .92rem; border-top: 1px dashed var(--line);
}
.hero-trust li::before { content: "✓ "; color: var(--bora-blue); font-weight: 800; }

/* ====== Faixa de números ====== */
.numbers { background: var(--bora-night); color: #fff; padding: 36px 0; position: relative; overflow: hidden; }
.numbers::before {
  content: ""; position: absolute; inset: 0;
  background:
    radial-gradient(40% 60% at 90% 50%, rgba(85,64,194,.35), transparent 60%),
    radial-gradient(40% 60% at 5% 50%, rgba(0,128,197,.25), transparent 60%);
  pointer-events: none;
}
.numbers-grid {
  display: grid; grid-template-columns: 1fr; gap: 20px; position: relative;
}
@media (min-width: 720px) { .numbers-grid { grid-template-columns: repeat(4, 1fr); } }
.numbers-grid li { text-align: center; }
.numbers-grid .num {
  display: block; font-family: var(--font-display); font-weight: 700;
  font-size: clamp(1.6rem, 3vw, 2.4rem); color: #fff; line-height: 1;
}
.numbers-grid .label { display: block; margin-top: 8px; color: rgba(255,255,255,.78); font-size: .92rem; }

/* ====== Seções genéricas ====== */
section { padding: 80px 0; }
section.tight { padding: 56px 0; }

.quem-somos { background: var(--bg); }
.como-funciona, .servicos, .destinos, .depoimentos, .diferenciais, .faq, .cta-final {
  background: var(--bg);
}
.como-funciona { background: var(--bg-soft); }
.depoimentos { background: var(--bg-soft); }
.faq { background: var(--bg-soft); }

/* Como funciona */
.steps {
  display: grid; grid-template-columns: 1fr; gap: 20px; margin-top: 32px; counter-reset: step;
}
@media (min-width: 720px) { .steps { grid-template-columns: repeat(3, 1fr); } }
.steps li {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg);
  padding: 28px; box-shadow: var(--shadow-sm); transition: transform var(--transition), box-shadow var(--transition);
}
.steps li:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.step-num {
  display: inline-block; font-family: var(--font-display); font-weight: 700;
  font-size: 1rem; color: #fff; background: var(--bora-blue); padding: 6px 14px; border-radius: 999px;
  margin-bottom: 14px;
}

/* Serviços */
.cards {
  display: grid; grid-template-columns: 1fr; gap: 18px; margin-top: 32px;
}
@media (min-width: 640px) { .cards { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 980px) { .cards { grid-template-columns: repeat(3, 1fr); } }
.card {
  display: block; background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg);
  padding: 28px; color: var(--ink); box-shadow: var(--shadow-sm);
  transition: all var(--transition);
}
.card:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color: rgba(0,128,197,.4); color: var(--ink); }
.card-icon {
  display: inline-flex; width: 48px; height: 48px; border-radius: 14px;
  align-items: center; justify-content: center; font-size: 1.5rem;
  background: rgba(0,128,197,.1); color: var(--bora-blue); margin-bottom: 16px;
}
.card-link { display: inline-block; margin-top: 12px; color: var(--bora-blue); font-weight: 700; }
.card-accent {
  background: linear-gradient(135deg, #1F1140 0%, #2A1855 60%, #3a1f70 100%);
  color: #fff; border-color: transparent;
}
.card-accent h3 { color: #fff; }
.card-accent p { color: rgba(255,255,255,.82); }
.card-accent .card-icon { background: rgba(228,185,91,.18); color: #f3cf78; }
.card-accent .card-link { color: #f3cf78; }
.card-accent:hover { color: #fff; }

/* Concierge highlight */
.concierge-highlight {
  background: linear-gradient(120deg, var(--bora-night) 0%, #1a2540 50%, var(--bora-purple-deep) 100%);
  color: #fff; padding: 80px 0;
}
.concierge-highlight h2 { color: #fff; }
.concierge-highlight p { color: rgba(255,255,255,.85); }
.concierge-inner { display: grid; grid-template-columns: 1fr; gap: 40px; align-items: center; }
@media (min-width: 900px) { .concierge-inner { grid-template-columns: 1.4fr 1fr; } }
.concierge-visual { display: flex; gap: 16px; justify-content: center; }
.card-mini {
  display: flex; flex-direction: column; padding: 28px 22px; border-radius: 18px;
  width: 150px; height: 220px; justify-content: flex-end; box-shadow: var(--shadow-lg);
  transform: rotate(-4deg); transition: transform var(--transition);
}
.card-mini:nth-child(2) { transform: rotate(4deg); margin-top: 24px; }
.card-mini:hover { transform: rotate(0); }
.card-mini.gold {
  background: linear-gradient(135deg, #b8862e, #f3cf78);
  color: #1a1305;
}
.card-mini.black {
  background: linear-gradient(135deg, #0a0d18, #2a3550);
  color: #fff;
  border: 1px solid rgba(228,185,91,.4);
}
.card-mini span { font-size: .85rem; opacity: .8; font-family: var(--font-display); }
.card-mini strong { font-family: var(--font-display); font-weight: 700; font-size: 1.6rem; letter-spacing: .02em; }

/* Destinos */
.destinos-grid {
  display: grid; grid-template-columns: 1fr; gap: 18px; margin-top: 32px;
}
@media (min-width: 640px) { .destinos-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 980px) { .destinos-grid { grid-template-columns: repeat(3, 1fr); } }
.destino {
  display: block; border-radius: var(--radius-lg); overflow: hidden; background: #fff;
  border: 1px solid var(--line); color: var(--ink); transition: all var(--transition);
  box-shadow: var(--shadow-sm);
}
.destino:hover { transform: translateY(-4px); box-shadow: var(--shadow); color: var(--ink); }
.destino-img {
  aspect-ratio: 16/10; background: linear-gradient(135deg, #cce6f5, #e9d4f7);
  position: relative;
}
.destino-img::after {
  content: ""; position: absolute; inset: 0;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.6), transparent 60%),
              radial-gradient(circle at 70% 80%, rgba(0,128,197,.25), transparent 60%);
}
.destino-img.orlando { background: linear-gradient(135deg, #ff9472, #ffd166); }
.destino-img.europa { background: linear-gradient(135deg, #b78cf2, #6db3ff); }
.destino-img.caribe { background: linear-gradient(135deg, #25d4a4, #4dd0e1); }
.destino-img.argentina { background: linear-gradient(135deg, #ec407a, #ff7043); }
.destino-img.nordeste { background: linear-gradient(135deg, #ffd166, #ff9472); }
.destino-img.resorts { background: linear-gradient(135deg, #6c91f5, #b78cf2); }
.destino-info { padding: 20px 22px; }
.destino-info h3 { color: var(--bora-night); margin-bottom: 6px; }
.destino-info p { color: var(--muted); font-size: .94rem; margin: 0; }

/* Depoimentos */
.dep-grid {
  display: grid; grid-template-columns: 1fr; gap: 18px; margin-top: 32px;
}
@media (min-width: 720px) { .dep-grid { grid-template-columns: repeat(2, 1fr); } }
.dep {
  background: #fff; padding: 28px; border-radius: var(--radius-lg); border: 1px solid var(--line);
  box-shadow: var(--shadow-sm);
}
.dep p { font-size: 1.05rem; color: var(--ink); }
.dep p::before { content: "“"; font-size: 2.2rem; color: var(--bora-lavender); line-height: 0; vertical-align: -.4em; margin-right: 4px; }
.dep footer { color: var(--muted); font-size: .92rem; }
.dep footer strong { color: var(--bora-night); }

/* Diferenciais */
.dif-list {
  display: grid; grid-template-columns: 1fr; gap: 16px; margin-top: 32px;
}
@media (min-width: 720px) { .dif-list { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1080px) { .dif-list { grid-template-columns: repeat(5, 1fr); } }
.dif-list li {
  border: 1px solid var(--line); padding: 22px; border-radius: var(--radius-lg); background: #fff;
  box-shadow: var(--shadow-sm); position: relative;
}
.dif-list li > span {
  display: inline-flex; width: 36px; height: 36px; border-radius: 999px;
  align-items: center; justify-content: center;
  background: rgba(0,128,197,.1); color: var(--bora-blue);
  font-family: var(--font-display); font-weight: 700; font-size: .9rem;
  margin-bottom: 12px;
}
.dif-list h3 { font-size: 1.05rem; color: var(--bora-night); margin-bottom: 6px; }
.dif-list p { font-size: .94rem; margin: 0; }

/* FAQ */
.faq-list { margin-top: 24px; display: grid; gap: 10px; }
.faq-list details {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  padding: 18px 22px; transition: box-shadow var(--transition);
}
.faq-list details[open] { box-shadow: var(--shadow); border-color: rgba(0,128,197,.3); }
.faq-list summary {
  font-family: var(--font-display); font-weight: 700; color: var(--bora-night);
  cursor: pointer; list-style: none; font-size: 1rem; display: flex; justify-content: space-between; gap: 12px;
}
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: "+"; color: var(--bora-blue); font-size: 1.4rem; line-height: 1; }
.faq-list details[open] summary::after { content: "−"; }
.faq-list details p { margin-top: 10px; }

/* CTA Final */
.cta-final {
  background:
    radial-gradient(50% 60% at 20% 30%, rgba(0,128,197,.18), transparent 70%),
    radial-gradient(50% 60% at 80% 70%, rgba(155,71,219,.18), transparent 70%),
    var(--bg);
  text-align: center;
}

/* Footer */
.site-footer { background: var(--bora-night); color: #fff; padding: 56px 0 24px; }
.site-footer .brand { color: #fff; }
.site-footer .brand-name strong { color: #fff; }
.site-footer h4 { color: #fff; font-size: .9rem; letter-spacing: .14em; text-transform: uppercase; margin: 0 0 14px; }
.site-footer ul li { margin-bottom: 8px; }
.site-footer a { color: rgba(255,255,255,.72); }
.site-footer a:hover { color: #fff; }
.footer-grid {
  display: grid; grid-template-columns: 1fr; gap: 32px; padding-bottom: 32px;
  border-bottom: 1px solid rgba(255,255,255,.12);
}
@media (min-width: 720px) { .footer-grid { grid-template-columns: 1.4fr repeat(4, 1fr); } }
.footer-tag { color: rgba(255,255,255,.7); margin-top: 12px; font-size: .94rem; max-width: 280px; }
.footer-bottom {
  display: flex; flex-direction: column; gap: 12px;
  padding-top: 20px; color: rgba(255,255,255,.5); font-size: .85rem;
}
.footer-bottom a { color: rgba(255,255,255,.7); }

/* === Onda 7 — Footer-legal (CNPJ, endereço, razão social) ============== */
.footer-legal {
  display: flex; flex-direction: column; gap: 4px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.footer-legal-line {
  margin: 0;
  color: rgba(255,255,255,.55);
  font-size: .8rem;
  line-height: 1.5;
}
.footer-legal-line strong {
  color: rgba(255,255,255,.75);
  font-weight: 600;
  letter-spacing: .01em;
}
.footer-legal-row {
  display: flex; flex-wrap: wrap; gap: 12px; justify-content: space-between;
  align-items: center;
  padding-top: 4px;
}

/* WhatsApp flutuante */
.wa-float {
  position: fixed; right: 18px; bottom: 18px; z-index: 60;
  width: 60px; height: 60px; border-radius: 999px;
  background: var(--whatsapp); color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 12px 32px rgba(37,211,102,.4);
  transition: transform var(--transition);
}
.wa-float:hover { transform: scale(1.05); color: #fff; }

/* ====== Páginas internas ====== */
.page-hero {
  padding: 80px 0 56px;
  background:
    radial-gradient(50% 70% at 90% 0%, rgba(155,71,219,.16), transparent 60%),
    radial-gradient(50% 70% at 0% 100%, rgba(0,128,197,.14), transparent 60%),
    linear-gradient(180deg, #F8FAFD 0%, #FFFFFF 100%);
}
.page-hero .lead { max-width: 720px; }
.crumbs { color: var(--muted); font-size: .9rem; margin-bottom: 16px; }
.crumbs a { color: var(--bora-blue); }

/* Tabela comparativa Gold/Black */
.tbl-compare {
  width: 100%; border-collapse: collapse; margin-top: 24px;
  background: #fff; border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-sm);
}
.tbl-compare th, .tbl-compare td {
  padding: 14px 18px; text-align: left; font-size: .96rem;
  border-bottom: 1px solid var(--line);
}
.tbl-compare thead th {
  background: var(--bora-night); color: #fff; font-family: var(--font-display); font-weight: 700;
}
.tbl-compare thead th.gold-col { background: linear-gradient(135deg,#b8862e,#f3cf78); color: #1a1305; }
.tbl-compare thead th.black-col { background: linear-gradient(135deg,#0a0d18,#2a3550); }
.tbl-compare tbody tr:nth-child(even) { background: var(--bg-soft); }
.tbl-compare td.check { text-align: center; color: var(--success); font-size: 1.2rem; font-weight: 700; }
.tbl-compare td.dash { text-align: center; color: var(--muted); }

/* Form */
.form-card {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg);
  padding: 28px; box-shadow: var(--shadow-sm);
}
.form-row { display: grid; gap: 16px; grid-template-columns: 1fr; }
@media (min-width: 720px) { .form-row.two { grid-template-columns: 1fr 1fr; } }
.form-row label { display: block; font-family: var(--font-display); font-weight: 600; font-size: .94rem; color: var(--bora-night); margin-bottom: 6px; }
.form-row input, .form-row textarea, .form-row select {
  width: 100%; padding: 12px 14px; border-radius: 10px; border: 1.5px solid var(--line);
  font-family: inherit; font-size: 1rem; background: #fff; color: var(--ink); transition: border-color var(--transition);
}
.form-row input:focus, .form-row textarea:focus, .form-row select:focus { outline: 0; border-color: var(--bora-blue); }
.form-row textarea { min-height: 120px; resize: vertical; }

/* Blog cards */
.blog-grid {
  display: grid; gap: 24px; grid-template-columns: 1fr; margin-top: 32px;
}
@media (min-width: 720px) { .blog-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1080px) { .blog-grid { grid-template-columns: repeat(3, 1fr); } }
.blog-card {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg);
  overflow: hidden; box-shadow: var(--shadow-sm); display: block; color: var(--ink);
  transition: transform var(--transition), box-shadow var(--transition);
}
.blog-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); color: var(--ink); }
.blog-cover {
  aspect-ratio: 16/9; background: linear-gradient(135deg,#0080C5,#9B47DB);
}
.blog-cover.c1 { background: linear-gradient(135deg,#0080C5,#5540C2); }
.blog-cover.c2 { background: linear-gradient(135deg,#9B47DB,#0080C5); }
.blog-cover.c3 { background: linear-gradient(135deg,#273850,#5540C2); }
.blog-cover.c4 { background: linear-gradient(135deg,#0080C5,#25D4A4); }
.blog-cover.c5 { background: linear-gradient(135deg,#5540C2,#9B47DB); }
.blog-cover.c6 { background: linear-gradient(135deg,#273850,#0080C5); }
.blog-card .pad { padding: 22px; }
.blog-card .tag { display: inline-block; padding: 4px 10px; border-radius: 999px; background: rgba(0,128,197,.1); color: var(--bora-blue); font-size: .76rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; margin-bottom: 10px; }
.blog-card h3 { font-size: 1.1rem; margin-bottom: 6px; }
.blog-card p { font-size: .94rem; margin: 0; color: var(--muted); }

/* Banner CTA reutilizável */
.cta-band {
  background: linear-gradient(120deg, var(--bora-blue), var(--bora-purple-deep));
  color: #fff; border-radius: var(--radius-lg); padding: 40px;
  display: grid; gap: 16px; grid-template-columns: 1fr; align-items: center; margin: 32px 0;
}
@media (min-width: 720px) { .cta-band { grid-template-columns: 1fr auto; } }
.cta-band h3 { color: #fff; font-size: 1.5rem; margin: 0; }
.cta-band p { color: rgba(255,255,255,.85); margin: 0; }

/* Listas com check */
.checks { display: grid; gap: 10px; margin: 16px 0 24px; }
.checks li { padding-left: 28px; position: relative; }
.checks li::before {
  content: "✓"; position: absolute; left: 0; top: 0; color: var(--bora-blue);
  width: 22px; height: 22px; border-radius: 999px; background: rgba(0,128,197,.12);
  display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: .82rem;
}

/* Tags pill */
.pills { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 24px; }
.pill {
  padding: 6px 12px; border-radius: 999px; background: var(--bg-soft); border: 1px solid var(--line);
  color: var(--ink-soft); font-size: .85rem; font-family: var(--font-display); font-weight: 600;
}

/* Utilitários */
.mt-0 { margin-top: 0; }
.mt-1 { margin-top: 8px; }
.mt-2 { margin-top: 16px; }
.mt-3 { margin-top: 24px; }
.mt-4 { margin-top: 32px; }
.mt-6 { margin-top: 48px; }

.split { display: grid; grid-template-columns: 1fr; gap: 32px; }
@media (min-width: 900px) { .split { grid-template-columns: 1fr 1fr; align-items: center; } }
.split.left-narrow { grid-template-columns: 1fr; }
@media (min-width: 900px) { .split.left-narrow { grid-template-columns: .9fr 1.1fr; } }

/* Animação leve para entrada */
@media (prefers-reduced-motion: no-preference) {
  .reveal { opacity: 0; transform: translateY(8px); transition: opacity .5s ease, transform .5s ease; }
  .reveal.visible { opacity: 1; transform: none; }
}

/* =========================================================
   Páginas internas — componentes adicionais
   ========================================================= */

/* Hero genérico de página */
.page-hero {
  padding: 56px 24px 40px;
  background:
    radial-gradient(1200px 400px at 90% -20%, rgba(0,128,197,.10), transparent 60%),
    radial-gradient(900px 300px at -10% 110%, rgba(155,71,219,.08), transparent 60%),
    var(--bg);
  border-bottom: 1px solid var(--line);
}
.page-hero .crumbs { color: var(--muted); font-size: .9rem; margin: 0 0 8px; }
.page-hero .crumbs a { color: var(--muted); }
.page-hero .crumbs a:hover { color: var(--bora-blue); }
.page-hero .eyebrow {
  display: inline-block; margin: 0 0 14px; font-family: var(--font-display);
  font-weight: 700; letter-spacing: 1px; text-transform: uppercase; font-size: .82rem;
  color: var(--bora-purple-deep);
}
.page-hero h1 {
  font-family: var(--font-display); font-weight: 700; letter-spacing: -.5px;
  font-size: clamp(2rem, 4.6vw, 3.4rem); line-height: 1.08; margin: 0 0 18px;
  color: var(--bora-night);
}
.page-hero h1 em { font-style: normal; color: var(--bora-blue); }
.page-hero .lead { color: var(--ink-soft); font-size: 1.12rem; max-width: 720px; }

.hero-ctas { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 24px; }

/* Variantes temáticas */
.hero-concierge {
  background:
    radial-gradient(1200px 460px at 90% -20%, rgba(155,71,219,.16), transparent 60%),
    radial-gradient(800px 360px at 0% 110%, rgba(85,64,194,.10), transparent 60%),
    linear-gradient(180deg, #faf6ff 0%, #ffffff 90%);
}
.hero-concierge .eyebrow { color: var(--bora-purple-deep); }
.hero-corporate {
  background:
    radial-gradient(1100px 440px at 80% -10%, rgba(39,56,80,.10), transparent 60%),
    linear-gradient(180deg, #f4f7fb 0%, #ffffff 90%);
}

.theme-concierge .link-accent { color: var(--bora-purple-deep); font-weight: 600; }

/* Texto auxiliar */
.lead-soft { color: var(--ink-soft); font-size: 1.05rem; font-style: italic; max-width: 700px; }
.micro { color: var(--muted); font-size: .85rem; margin-top: 8px; }
.plan-note { color: var(--muted); font-size: .9rem; margin-top: 18px; }

/* Listas com checks */
.checks { display: grid; gap: 10px; padding: 0; margin: 0; list-style: none; }
.checks li {
  position: relative; padding-left: 28px; line-height: 1.55;
}
.checks li::before {
  content: ""; position: absolute; left: 0; top: .55em; width: 16px; height: 16px;
  background:
    linear-gradient(135deg, var(--bora-blue), var(--bora-purple)) padding-box;
  border-radius: 999px; box-shadow: inset 0 0 0 4px #fff;
}
.checks.tight { gap: 6px; }
.checks.two-cols { grid-template-columns: 1fr; }
@media (min-width: 800px) { .checks.two-cols { grid-template-columns: 1fr 1fr; column-gap: 32px; } }

/* Steps numerados */
.steps { counter-reset: s; display: grid; gap: 18px; }
.steps li {
  background: var(--bg-soft); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 20px 22px; position: relative;
}
.steps li strong { display: block; font-family: var(--font-display); font-size: 1.08rem; color: var(--bora-night); margin-bottom: 4px; }
.steps li p { margin: 0; color: var(--ink-soft); }
.step-num {
  display: inline-grid; place-items: center; width: 32px; height: 32px;
  border-radius: 999px; background: var(--bora-blue); color: #fff;
  font-family: var(--font-display); font-weight: 700; margin-right: 8px;
  vertical-align: middle;
}

/* Grid 3 colunas para cards genéricos */
.grid-3 { display: grid; gap: 18px; grid-template-columns: 1fr; }
@media (min-width: 720px) { .grid-3 { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1000px) { .grid-3 { grid-template-columns: 1fr 1fr 1fr; } }

.card {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  padding: 22px; box-shadow: var(--shadow-sm); transition: transform var(--transition), box-shadow var(--transition);
}
.card:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.card h3 { font-family: var(--font-display); margin: 0 0 8px; color: var(--bora-night); }
.card p { color: var(--ink-soft); margin: 0 0 6px; }
.card ul { margin-top: 6px; padding-left: 18px; list-style: disc; color: var(--ink-soft); }
.card ul li { padding: 0; }

/* Tabela de casos típicos */
.cases-table { display: grid; gap: 14px; }
.cases-table article {
  border-left: 4px solid var(--bora-blue);
  background: var(--bg-soft); padding: 18px 20px; border-radius: 12px;
}
.cases-table article h3 { margin: 0 0 6px; font-family: var(--font-display); color: var(--bora-night); }
.cases-table article p { margin: 0; color: var(--ink-soft); }

/* Lista de cases longa */
.cases-list { display: grid; gap: 22px; }
.case {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg);
  padding: 28px; box-shadow: var(--shadow-sm);
}
.case-tag {
  display: inline-block; font-family: var(--font-display); font-size: .8rem;
  text-transform: uppercase; letter-spacing: 1px; color: var(--bora-purple-deep);
  background: rgba(77,38,165,.08); padding: 5px 10px; border-radius: 999px; margin: 0 0 10px;
}
.case h2 { font-family: var(--font-display); margin: 0 0 12px; color: var(--bora-night); font-size: 1.4rem; }
.case p { color: var(--ink-soft); margin: 8px 0; }
.case blockquote {
  margin: 16px 0 0; padding: 14px 18px;
  background: var(--bg-soft); border-left: 4px solid var(--bora-purple);
  border-radius: 8px; color: var(--ink); font-style: italic;
}
.case blockquote cite { display: block; margin-top: 8px; font-style: normal; color: var(--muted); font-size: .9rem; }

/* Concierge — planos (Gold + Black) */
.plans { display: grid; gap: 22px; grid-template-columns: 1fr; }
@media (min-width: 880px) { .plans { grid-template-columns: 1fr 1fr; align-items: stretch; } }

.plan {
  position: relative; background: #fff; border: 1px solid var(--line);
  border-radius: var(--radius-lg); padding: 28px; box-shadow: var(--shadow-sm);
  display: flex; flex-direction: column; gap: 14px;
}
.plan header { padding-bottom: 6px; border-bottom: 1px solid var(--line); }
.plan h3 { font-family: var(--font-display); margin: 0; color: var(--bora-night); font-size: 1.3rem; }
.plan-tag {
  display: inline-block; font-family: var(--font-display); font-weight: 700;
  letter-spacing: 1px; text-transform: uppercase; font-size: .82rem;
  padding: 4px 10px; border-radius: 999px; margin: 0 0 8px;
}
.plan-gold .plan-tag { color: #8B6E1F; background: linear-gradient(135deg, rgba(228,185,91,.18), rgba(228,185,91,.06)); border: 1px solid rgba(228,185,91,.4); }
.plan-black .plan-tag { color: #fff; background: linear-gradient(135deg, var(--bora-purple-deep), var(--bora-night)); border: 1px solid transparent; }

.plan-black {
  background: linear-gradient(180deg, #faf6ff 0%, #fff 100%);
  border-color: rgba(155,71,219,.25);
}
.plan-black::before {
  content: "★"; position: absolute; top: 14px; right: 18px;
  color: var(--bora-lavender); font-size: 1.2rem;
}

/* Botão accent (concierge) */
.btn-accent {
  background: linear-gradient(135deg, var(--bora-purple-deep), var(--bora-purple));
  color: #fff; border: 1px solid transparent; padding: 12px 22px;
  border-radius: 12px; font-family: var(--font-display); font-weight: 600;
  display: inline-flex; align-items: center; gap: 8px;
  transition: transform var(--transition), box-shadow var(--transition);
}
.btn-accent:hover { transform: translateY(-1px); box-shadow: var(--shadow); color: #fff; }

.cta-band-accent {
  background: linear-gradient(135deg, var(--bora-purple-deep), var(--bora-night));
  color: #fff;
}
.cta-band-accent h3, .cta-band-accent p { color: #fff; }

/* Métricas (corporate) */
.metric {
  background: var(--bg-soft); border-radius: 14px; padding: 22px;
  text-align: center; border: 1px solid var(--line);
}
.metric strong {
  display: block; font-family: var(--font-display); font-size: 2.2rem;
  color: var(--bora-blue); line-height: 1; margin-bottom: 6px;
}
.metric span { color: var(--ink-soft); font-size: .95rem; }

/* Destinos */
.destinos-grid {
  display: grid; gap: 18px; grid-template-columns: 1fr;
}
@media (min-width: 720px) { .destinos-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { .destinos-grid { grid-template-columns: 1fr 1fr 1fr; } }
.destino {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg);
  padding: 24px; box-shadow: var(--shadow-sm);
  display: flex; flex-direction: column; gap: 12px;
  transition: transform var(--transition), box-shadow var(--transition);
}
.destino:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.destino-tag {
  align-self: flex-start; font-family: var(--font-display); font-weight: 700;
  letter-spacing: 1px; text-transform: uppercase; font-size: .78rem;
  background: linear-gradient(135deg, var(--bora-blue), var(--bora-purple));
  color: #fff; padding: 4px 10px; border-radius: 999px;
}
.destino h2 { font-family: var(--font-display); color: var(--bora-night); margin: 0; font-size: 1.4rem; }
.destino p { color: var(--ink-soft); margin: 0; }
.destino .btn { align-self: flex-start; margin-top: 4px; }

/* Blog */
.blog-grid {
  display: grid; gap: 18px; grid-template-columns: 1fr;
}
@media (min-width: 760px) { .blog-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1080px) { .blog-grid { grid-template-columns: 1fr 1fr 1fr; } }
.blog-card {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  padding: 22px; box-shadow: var(--shadow-sm);
  display: flex; flex-direction: column; gap: 8px;
  transition: transform var(--transition), box-shadow var(--transition);
}
.blog-card:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.blog-card h3 { font-family: var(--font-display); margin: 0; color: var(--bora-night); font-size: 1.15rem; line-height: 1.3; }
.blog-card h3 a { color: inherit; }
.blog-card h3 a:hover { color: var(--bora-blue); }
.blog-card p { color: var(--ink-soft); margin: 0; }
.blog-tag {
  font-family: var(--font-display); font-weight: 700; font-size: .76rem;
  letter-spacing: 1px; text-transform: uppercase; color: var(--bora-purple-deep);
  margin: 0;
}
.blog-meta { color: var(--muted); font-size: .85rem; margin-top: 6px; }
.blog-card.pillar { border-color: rgba(0,128,197,.3); background: linear-gradient(180deg, #f4faff 0%, #fff 100%); }

/* FAQ — details */
details {
  border: 1px solid var(--line); border-radius: 12px;
  padding: 14px 18px; margin: 10px 0; background: #fff;
}
details + details { margin-top: 10px; }
details summary {
  font-family: var(--font-display); font-weight: 600; cursor: pointer;
  color: var(--bora-night); list-style: none; position: relative; padding-right: 28px;
}
details summary::-webkit-details-marker { display: none; }
details summary::after {
  content: "+"; position: absolute; right: 0; top: 0;
  font-size: 1.4rem; line-height: 1; color: var(--bora-blue);
  transition: transform var(--transition);
}
details[open] summary::after { content: "−"; }
details p { color: var(--ink-soft); margin: 10px 0 0; }

/* CTA band */
.cta-band {
  display: flex; flex-direction: column; gap: 18px;
  align-items: flex-start; justify-content: space-between;
  background: linear-gradient(135deg, rgba(0,128,197,.06), rgba(85,64,194,.08));
  border: 1px solid var(--line); border-radius: var(--radius-lg);
  padding: 28px;
}
@media (min-width: 760px) {
  .cta-band { flex-direction: row; align-items: center; }
}
.cta-band h3 { font-family: var(--font-display); margin: 0 0 6px; color: var(--bora-night); }
.cta-band p { margin: 0; color: var(--ink-soft); }

/* Numbers (homepage e milhas) */
.numbers { background: var(--bg-soft); border-block: 1px solid var(--line); }
.numbers-grid {
  display: grid; gap: 18px; grid-template-columns: 1fr 1fr;
  margin-top: 18px;
}
@media (min-width: 800px) { .numbers-grid { grid-template-columns: repeat(4, 1fr); } }
.numbers-grid > div {
  background: #fff; border: 1px solid var(--line); border-radius: 14px;
  padding: 18px; text-align: center;
}
.numbers-grid .num {
  display: block; font-family: var(--font-display); font-weight: 700;
  font-size: 1.9rem; color: var(--bora-blue); line-height: 1;
}
.numbers-grid .num small { font-size: .8em; color: var(--muted); font-weight: 500; }
.numbers-grid .num-label { display: block; color: var(--ink-soft); margin-top: 6px; font-size: .9rem; }

/* Contato — formulário */
.contact-grid {
  display: grid; gap: 24px; grid-template-columns: 1fr;
}
@media (min-width: 920px) { .contact-grid { grid-template-columns: 1.2fr .8fr; align-items: start; } }

.form-card {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg);
  padding: 28px; box-shadow: var(--shadow-sm);
}
.form-card h2 { margin: 0 0 6px; font-family: var(--font-display); color: var(--bora-night); }
.form-card form { display: grid; gap: 14px; margin-top: 16px; }
.form-card label { display: grid; gap: 6px; font-family: var(--font-display); font-weight: 600; color: var(--ink-soft); font-size: .92rem; }
.form-card input[type="text"],
.form-card input[type="email"],
.form-card textarea {
  border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px;
  font: inherit; color: var(--ink); background: #fff; transition: border-color var(--transition), box-shadow var(--transition);
}
.form-card input:focus, .form-card textarea:focus {
  outline: none; border-color: var(--bora-blue);
  box-shadow: 0 0 0 4px rgba(0,128,197,.15);
}
.form-card label.check { flex-direction: row; display: flex; align-items: center; gap: 10px; font-weight: 500; }
.form-card label.check input { width: 18px; height: 18px; }

.contact-side { display: grid; gap: 18px; }
.contact-block {
  background: var(--bg-soft); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 20px;
}
.contact-block h3 { font-family: var(--font-display); margin: 0 0 6px; color: var(--bora-night); }
.contact-block p { color: var(--ink-soft); margin: 0 0 12px; }
.contact-block form { display: flex; gap: 8px; flex-wrap: wrap; }
.contact-block form input {
  flex: 1; min-width: 180px;
  border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; font: inherit;
}

/* Tipografia geral em prosa */
section h2 {
  font-family: var(--font-display); font-weight: 700; letter-spacing: -.3px;
  font-size: 1.7rem; margin: 0 0 16px; color: var(--bora-night);
}
section h3 { font-family: var(--font-display); color: var(--bora-night); }

/* container narrow já existe; reforçando */
.container { max-width: var(--container); margin: 0 auto; padding: 0 24px; }
.container.narrow { max-width: var(--container-narrow); }

/* Responsivo — header */
@media (max-width: 900px) {
  .nav-main { display: none; }
  .header-cta { display: inline-flex; }
}

/* =================================================================
   === Onda 1 — Profundidade emocional (29/abr/2026) ==============
   Sistema de profundidade visual: mesh gradients, aurora,
   noise overlay, glass, premium shadows, easing emocional.
   Para reverter: remover este bloco inteiro entre delimitadores.
   ================================================================= */

:root {
  --shadow-premium:
    0 1px 2px rgba(15,23,42,.04),
    0 8px 16px -4px rgba(0,128,197,.10),
    0 24px 56px -16px rgba(85,64,194,.18);
  --shadow-glow-blue: 0 0 0 1px rgba(0,128,197,.10), 0 16px 36px -10px rgba(0,128,197,.30);
  --shadow-glow-purple: 0 0 0 1px rgba(155,71,219,.14), 0 24px 48px -10px rgba(77,38,165,.34);
  --ease-spring: cubic-bezier(.23, 1, .32, 1);
  --ease-out-back: cubic-bezier(.34, 1.56, .64, 1);
  --space-emotive: clamp(72px, 9vw, 120px);
  --noise-url: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.92' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.05  0 0 0 0 0.07  0 0 0 0 0.16  0 0 0 0.6 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

/* ---------- Mesh gradients ---------- */

.bg-mesh {
  background-color: #fafcff;
  background-image:
    radial-gradient(900px 500px at 12% 10%, rgba(0,128,197,.16), transparent 60%),
    radial-gradient(700px 460px at 92% 8%, rgba(155,71,219,.13), transparent 60%),
    radial-gradient(900px 600px at 88% 100%, rgba(85,64,194,.14), transparent 60%),
    radial-gradient(800px 500px at 0% 90%, rgba(0,128,197,.10), transparent 60%);
}
.bg-mesh-night {
  background-color: #0e1729;
  background-image:
    radial-gradient(900px 520px at 14% 8%, rgba(0,128,197,.36), transparent 65%),
    radial-gradient(720px 460px at 86% 12%, rgba(155,71,219,.32), transparent 65%),
    radial-gradient(900px 600px at 90% 100%, rgba(85,64,194,.30), transparent 65%);
  color: #fff;
}
.bg-mesh-concierge {
  background-color: #faf5ff;
  background-image:
    radial-gradient(1000px 540px at 18% 6%, rgba(155,71,219,.22), transparent 60%),
    radial-gradient(800px 500px at 88% 14%, rgba(77,38,165,.16), transparent 60%),
    radial-gradient(900px 620px at 88% 100%, rgba(85,64,194,.20), transparent 60%),
    radial-gradient(820px 500px at 0% 92%, rgba(228,185,91,.10), transparent 60%);
}
.bg-mesh-corporate {
  background-color: #f4f7fb;
  background-image:
    radial-gradient(1000px 520px at 16% 8%, rgba(39,56,80,.14), transparent 60%),
    radial-gradient(800px 460px at 88% 14%, rgba(0,128,197,.14), transparent 60%),
    radial-gradient(900px 600px at 88% 100%, rgba(39,56,80,.10), transparent 60%);
}

/* ---------- Aurora blobs animadas ---------- */

.aurora { position: relative; overflow: hidden; isolation: isolate; }
.aurora::before,
.aurora::after {
  content: ""; position: absolute; z-index: -1;
  width: 60vmax; height: 60vmax; border-radius: 50%;
  filter: blur(90px); opacity: .55; pointer-events: none;
  will-change: transform;
}
.aurora::before {
  top: -25vmax; left: -10vmax;
  background: radial-gradient(closest-side, rgba(0,128,197,.55), transparent 70%);
  animation: auroraDrift 22s var(--ease-spring) infinite alternate;
}
.aurora::after {
  bottom: -28vmax; right: -12vmax;
  background: radial-gradient(closest-side, rgba(155,71,219,.55), transparent 70%);
  animation: auroraDrift 26s var(--ease-spring) infinite alternate-reverse;
}
.aurora.aurora-concierge::before {
  background: radial-gradient(closest-side, rgba(155,71,219,.6), transparent 70%);
}
.aurora.aurora-concierge::after {
  background: radial-gradient(closest-side, rgba(77,38,165,.55), transparent 70%);
}
.aurora.aurora-corporate::before {
  background: radial-gradient(closest-side, rgba(39,56,80,.5), transparent 70%);
}
.aurora.aurora-corporate::after {
  background: radial-gradient(closest-side, rgba(0,128,197,.45), transparent 70%);
}
@keyframes auroraDrift {
  0%   { transform: translate3d(0, 0, 0) scale(1); }
  50%  { transform: translate3d(8vmax, 4vmax, 0) scale(1.08); }
  100% { transform: translate3d(-6vmax, 6vmax, 0) scale(.96); }
}
@media (prefers-reduced-motion: reduce) {
  .aurora::before, .aurora::after { animation: none !important; }
}

/* ---------- Noise overlay sutil ---------- */

.noise { position: relative; }
.noise::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: var(--noise-url);
  background-size: 220px 220px;
  opacity: .04; mix-blend-mode: overlay;
  z-index: 0;
}
.noise > * { position: relative; z-index: 1; }

/* ---------- Topographic pattern (curvas concêntricas) ---------- */

.bg-topo {
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='480' height='480' viewBox='0 0 480 480'><g fill='none' stroke='%230080C5' stroke-opacity='.07' stroke-width='1'><circle cx='240' cy='240' r='40'/><circle cx='240' cy='240' r='80'/><circle cx='240' cy='240' r='120'/><circle cx='240' cy='240' r='160'/><circle cx='240' cy='240' r='200'/><circle cx='240' cy='240' r='240'/></g></svg>");
  background-position: center;
  background-repeat: repeat;
}

/* ---------- Glass card ---------- */

.glass {
  background: rgba(255,255,255,.6);
  backdrop-filter: blur(14px) saturate(1.2);
  -webkit-backdrop-filter: blur(14px) saturate(1.2);
  border: 1px solid rgba(255,255,255,.7);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-premium);
}
.glass.glass-dark {
  background: rgba(14,23,41,.45);
  border-color: rgba(255,255,255,.12);
  color: #fff;
}

/* ---------- Gradient text ---------- */

.grad-text {
  background: linear-gradient(135deg, #0080C5 0%, #5540C2 60%, #9B47DB 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}
.grad-text-warm {
  background: linear-gradient(135deg, #4D26A5 0%, #9B47DB 60%, #E4B95B 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

/* ---------- Hero refinado ---------- */

.page-hero.hero-emo {
  position: relative; isolation: isolate;
  padding: clamp(72px, 10vw, 128px) 24px clamp(56px, 8vw, 96px);
  border-bottom: none;
}
.page-hero.hero-emo .lead {
  font-size: clamp(1.1rem, 1.6vw, 1.25rem);
  line-height: 1.55; max-width: 640px;
  color: #2A3550;
}
.page-hero.hero-emo .eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 6px 14px; border-radius: 999px;
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(0,128,197,.18);
  backdrop-filter: blur(8px);
  color: var(--bora-purple-deep);
  box-shadow: 0 1px 1px rgba(15,23,42,.04);
}
.page-hero.hero-emo h1 {
  font-size: clamp(2.4rem, 5vw, 4rem);
  letter-spacing: -1.2px;
  line-height: 1.04;
  margin-bottom: 22px;
}
.page-hero.hero-emo .crumbs { color: rgba(52, 64, 86, .7); }
.page-hero.hero-night,
.page-hero.hero-night .lead,
.page-hero.hero-night .crumbs,
.page-hero.hero-night .crumbs a { color: rgba(255,255,255,.86); }
.page-hero.hero-night h1 { color: #fff; }
.page-hero.hero-night .eyebrow {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.18);
  color: #DDC8FF;
}

/* Hero card flutuante (preview) */
.hero-stage {
  display: grid; gap: 36px; align-items: center;
  grid-template-columns: 1fr;
}
@media (min-width: 980px) {
  .hero-stage { grid-template-columns: 1.15fr .85fr; gap: 56px; }
}

.hero-card-float {
  position: relative; padding: 22px;
  transform: perspective(1200px) rotateX(2deg) rotateY(-2deg);
  transition: transform 600ms var(--ease-spring);
}
.hero-card-float:hover { transform: perspective(1200px) rotateX(0) rotateY(0); }

.hero-card-float .float-row {
  display: flex; align-items: center; gap: 12px; padding: 14px 16px;
  background: rgba(255,255,255,.85);
  border-radius: 12px; border: 1px solid rgba(0,128,197,.08);
  box-shadow: 0 6px 18px -10px rgba(0,128,197,.18);
  margin-bottom: 10px;
}
.hero-card-float .float-row:last-child { margin-bottom: 0; }
.hero-card-float .float-num {
  font-family: var(--font-display); font-weight: 700; font-size: 1.4rem;
  color: var(--bora-blue);
  min-width: 56px;
}
.hero-card-float .float-label {
  font-size: .92rem; color: var(--ink-soft); line-height: 1.3;
}
.hero-card-float .float-tag {
  display: inline-block; font-family: var(--font-display); font-weight: 700;
  font-size: .72rem; letter-spacing: 1px; text-transform: uppercase;
  color: var(--bora-purple-deep);
  background: rgba(155,71,219,.10); padding: 4px 10px; border-radius: 999px;
  margin-bottom: 14px;
}

/* === Onda 8.2 — Card de evidência editorial (substituiu mock fintech) === */
.hero-card-float.proposal-evidence {
  padding: 28px 26px 24px;
  display: flex; flex-direction: column; gap: 16px;
  text-align: left;
}
.proposal-evidence .evidence-eyebrow {
  margin: 0;
  font-family: var(--font-display); font-weight: 600;
  font-size: .72rem; letter-spacing: 1.4px; text-transform: uppercase;
  color: var(--ink-soft); opacity: .82;
}
.proposal-evidence .evidence-quote {
  margin: 0;
  font-family: var(--font-display); font-weight: 500;
  font-size: clamp(1.25rem, 2.4vw, 1.55rem);
  line-height: 1.35;
  color: var(--ink);
  border: none; padding: 0;
  font-style: normal;
  letter-spacing: -.005em;
}
.proposal-evidence .evidence-attribution {
  margin: 0;
  display: flex; flex-direction: column; gap: 2px;
  font-size: .85rem;
  padding-top: 4px;
  border-top: 1px solid rgba(0,128,197,.10);
}
.proposal-evidence .evidence-name {
  font-weight: 600; color: var(--ink);
}
.proposal-evidence .evidence-context {
  color: var(--ink-soft); opacity: .75; font-size: .78rem;
}
.proposal-evidence .evidence-link {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 4px;
  color: var(--bora-blue);
  font-weight: 500; font-size: .92rem;
  text-decoration: none;
  width: fit-content;
}
.proposal-evidence .evidence-link:hover { text-decoration: underline; text-underline-offset: 4px; }
.proposal-evidence .evidence-link:focus-visible { outline: 2px solid var(--bora-blue); outline-offset: 3px; }

/* Variação para hero com foto (texto branco) */
.hero-emo.has-photo .glass.proposal-evidence .evidence-eyebrow { color: rgba(255,255,255,.72); }
.hero-emo.has-photo .glass.proposal-evidence .evidence-quote { color: #fff; }
.hero-emo.has-photo .glass.proposal-evidence .evidence-attribution { border-top-color: rgba(255,255,255,.18); }
.hero-emo.has-photo .glass.proposal-evidence .evidence-name { color: #fff; }
.hero-emo.has-photo .glass.proposal-evidence .evidence-context { color: rgba(255,255,255,.7); }
.hero-emo.has-photo .glass.proposal-evidence .evidence-link { color: #FFE3A3; }

/* === Onda 7.2 — Card de Proposta clarificado (mockup de proposta real) [DEPRECADO 8.2 — manter por reverso] === */
.hero-card-float.proposal-mock {
  padding: 22px 22px 18px;
  display: flex; flex-direction: column; gap: 14px;
}

/* Header — tag + ID */
.proposal-mock .prop-header {
  display: flex; align-items: center; justify-content: space-between;
  padding-bottom: 12px;
  border-bottom: 1px dashed rgba(0,128,197,.14);
}
.proposal-mock .prop-tag {
  font-family: var(--font-display); font-weight: 700;
  font-size: .68rem; letter-spacing: 1.4px; text-transform: uppercase;
  color: var(--bora-purple-deep);
  background: rgba(155,71,219,.10);
  padding: 5px 11px; border-radius: 999px;
}
.proposal-mock .prop-id {
  font-family: var(--font-display); font-weight: 700;
  font-size: .82rem; color: var(--ink-soft); opacity: .75;
}

/* Perfil — quem é o cliente do exemplo */
.proposal-mock .prop-profile {
  display: flex; flex-direction: column; gap: 2px;
}
.proposal-mock .prop-profile-line {
  margin: 0; font-size: 1.05rem; color: var(--ink); line-height: 1.3;
}
.proposal-mock .prop-profile-sub {
  margin: 0; font-size: .88rem; color: var(--ink-soft); line-height: 1.3;
}

/* Métricas — cada linha de info da proposta */
.proposal-mock .prop-metrics {
  display: flex; flex-direction: column; gap: 10px;
}
.proposal-mock .prop-metric {
  display: flex; flex-direction: column; gap: 2px;
  padding: 12px 14px;
  background: rgba(255,255,255,.85);
  border-radius: 10px;
  border: 1px solid rgba(0,128,197,.08);
}
.proposal-mock .prop-metric--highlight {
  background: linear-gradient(135deg, rgba(255,227,163,.18), rgba(255,209,122,.10));
  border-color: rgba(255,191,87,.32);
}
.proposal-mock .prop-metric-label {
  font-family: var(--font-display); font-weight: 600;
  font-size: .68rem; letter-spacing: 1px; text-transform: uppercase;
  color: var(--ink-soft); opacity: .82;
}
.proposal-mock .prop-metric-value {
  font-family: var(--font-display); font-weight: 700;
  font-size: 1.05rem; color: var(--bora-blue);
  line-height: 1.25;
}
.proposal-mock .prop-strong {
  font-size: 1.4rem; color: var(--bora-purple-deep);
}
.proposal-mock .prop-plus {
  color: var(--ink-soft); font-weight: 500; margin: 0 2px;
}
.proposal-mock .prop-metric-note {
  font-size: .78rem; color: var(--ink-soft); line-height: 1.4;
  opacity: .85;
}

/* CTA dentro do card */
.proposal-mock .prop-cta {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 12px 18px;
  background: linear-gradient(135deg, var(--bora-blue), var(--bora-purple-deep));
  color: #fff !important; font-weight: 600; font-size: .96rem;
  border-radius: 999px;
  text-decoration: none;
  transition: transform 220ms var(--ease-spring), box-shadow 220ms ease;
  box-shadow: 0 6px 18px rgba(77,38,165,.22);
}
.proposal-mock .prop-cta:hover { transform: translateY(-1px); box-shadow: 0 10px 22px rgba(77,38,165,.28); }
.proposal-mock .prop-cta:focus-visible { outline: 2px solid var(--bora-purple-deep); outline-offset: 3px; }

/* Disclaimer pequeno embaixo */
.proposal-mock .prop-disclaimer {
  margin: 0; text-align: center;
  font-size: .72rem; color: var(--ink-soft); opacity: .7;
  font-style: italic;
}

/* Variação para hero com foto (texto branco) */
.hero-emo.has-photo .glass.proposal-mock .prop-header { border-bottom-color: rgba(255,255,255,.18); }
.hero-emo.has-photo .glass.proposal-mock .prop-tag {
  background: rgba(255,227,163,.18);
  color: #FFE3A3;
}
.hero-emo.has-photo .glass.proposal-mock .prop-id { color: rgba(255,255,255,.7); }
.hero-emo.has-photo .glass.proposal-mock .prop-profile-line { color: #fff; }
.hero-emo.has-photo .glass.proposal-mock .prop-profile-sub { color: rgba(255,255,255,.78); }
.hero-emo.has-photo .glass.proposal-mock .prop-metric {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.14);
}
.hero-emo.has-photo .glass.proposal-mock .prop-metric--highlight {
  background: linear-gradient(135deg, rgba(255,227,163,.22), rgba(255,209,122,.12));
  border-color: rgba(255,227,163,.38);
}
.hero-emo.has-photo .glass.proposal-mock .prop-metric-label { color: rgba(255,255,255,.72); }
.hero-emo.has-photo .glass.proposal-mock .prop-metric-value { color: #FFE3A3; }
.hero-emo.has-photo .glass.proposal-mock .prop-strong { color: #FFD17A; }
.hero-emo.has-photo .glass.proposal-mock .prop-plus { color: rgba(255,255,255,.5); }
.hero-emo.has-photo .glass.proposal-mock .prop-metric-note { color: rgba(255,255,255,.75); }
.hero-emo.has-photo .glass.proposal-mock .prop-disclaimer { color: rgba(255,255,255,.6); }

/* ---------- Botões refinados ---------- */

.btn {
  position: relative; isolation: isolate;
  transition: transform 320ms var(--ease-spring),
              box-shadow 320ms var(--ease-spring),
              background-color 220ms ease;
}
.btn-primary {
  background: linear-gradient(180deg, #0086CD 0%, #0080C5 100%);
  border: 1px solid rgba(255,255,255,.18);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.25),
    0 1px 2px rgba(0,128,197,.18),
    0 12px 28px -12px rgba(0,128,197,.55);
}
.btn-primary:hover {
  transform: translateY(-2px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.30),
    0 4px 8px rgba(0,128,197,.20),
    0 22px 40px -16px rgba(0,128,197,.60);
}
.btn-accent {
  background: linear-gradient(135deg, #4D26A5 0%, #5540C2 50%, #9B47DB 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.20),
    0 12px 28px -10px rgba(77,38,165,.55);
}
.btn-accent:hover {
  transform: translateY(-2px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.26),
    0 22px 40px -14px rgba(77,38,165,.60);
}
.btn-lg { padding: 14px 26px; font-size: 1.02rem; }

/* Magnetic effect base — JS adiciona --mx, --my */
.btn-magnetic {
  --mx: 0; --my: 0;
  transform: translate3d(calc(var(--mx) * 1px), calc(var(--my) * 1px), 0);
}
.btn-magnetic:hover {
  transform: translate3d(calc(var(--mx) * 1px), calc(var(--my) * 1px), 0) translateY(-2px);
}

/* ---------- Cards com tilt 3D + premium shadow ---------- */

.card,
.plan,
.destino,
.blog-card,
.case {
  transition: transform 480ms var(--ease-spring),
              box-shadow 480ms var(--ease-spring),
              border-color 240ms ease;
}
.card-tilt {
  --rx: 0deg; --ry: 0deg;
  transform: perspective(900px) rotateX(var(--rx)) rotateY(var(--ry));
  transform-style: preserve-3d;
}
.card-tilt:hover { box-shadow: var(--shadow-premium); }

/* Plan Black com noise + glow */
.plan-black {
  position: relative; overflow: hidden;
  background:
    radial-gradient(700px 360px at 80% -10%, rgba(155,71,219,.18), transparent 60%),
    linear-gradient(180deg, #1B1430 0%, #261541 100%);
  border-color: rgba(155,71,219,.35);
  color: #F4ECFF;
  box-shadow: var(--shadow-glow-purple);
}
.plan-black h3, .plan-black .plan-tag, .plan-black p, .plan-black .checks li { color: #F4ECFF; }
.plan-black .checks li::before {
  background: linear-gradient(135deg, #E4B95B, #9B47DB) padding-box;
  box-shadow: inset 0 0 0 4px #1B1430;
}
.plan-black::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: var(--noise-url);
  background-size: 220px 220px;
  opacity: .05; mix-blend-mode: overlay;
}
.plan-black .btn-accent {
  background: linear-gradient(135deg, #E4B95B 0%, #C9A24A 100%);
  color: #1B1430;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.35),
    0 12px 28px -10px rgba(228,185,91,.45);
}
.plan-black .btn-accent:hover {
  background: linear-gradient(135deg, #EDC76B 0%, #D2AC55 100%);
}

/* Plan Gold em modo refinado */
.plan-gold {
  background: linear-gradient(180deg, #FFFCF4 0%, #FFFFFF 100%);
  border-color: rgba(228,185,91,.45);
  box-shadow:
    0 1px 2px rgba(15,23,42,.04),
    0 14px 32px -16px rgba(228,185,91,.45);
}

/* ---------- CTA band refinado ---------- */

.cta-band {
  position: relative; overflow: hidden;
  background:
    radial-gradient(700px 360px at 80% -20%, rgba(0,128,197,.18), transparent 60%),
    radial-gradient(600px 320px at 0% 120%, rgba(155,71,219,.18), transparent 60%),
    linear-gradient(180deg, #ffffff 0%, #F4F7FB 100%);
  border: 1px solid rgba(0,128,197,.10);
  box-shadow: var(--shadow-premium);
}
.cta-band-accent {
  background:
    radial-gradient(700px 360px at 80% -20%, rgba(155,71,219,.34), transparent 60%),
    linear-gradient(135deg, #2D1858 0%, #4D26A5 100%);
  border-color: rgba(155,71,219,.30);
}
.cta-band::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: var(--noise-url);
  background-size: 220px 220px;
  opacity: .03; mix-blend-mode: overlay;
}

/* ---------- Numbers refinados ---------- */

.numbers {
  position: relative; overflow: hidden;
  background: linear-gradient(180deg, #F4F7FB 0%, #FFFFFF 100%);
}
.numbers-grid > div {
  background: rgba(255,255,255,.85);
  border: 1px solid rgba(0,128,197,.10);
  box-shadow: 0 8px 24px -16px rgba(0,128,197,.30);
  transition: transform 400ms var(--ease-spring), box-shadow 400ms var(--ease-spring);
}
.numbers-grid > div:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 32px -16px rgba(0,128,197,.45);
}
.numbers-grid .num {
  background: linear-gradient(135deg, #0080C5, #5540C2);
  -webkit-background-clip: text; background-clip: text;
  color: transparent; -webkit-text-fill-color: transparent;
  font-size: clamp(1.7rem, 2.6vw, 2.2rem);
}

/* ---------- Steps com linha de jornada ---------- */

.steps.steps-journey { position: relative; padding-left: 6px; }
.steps.steps-journey li {
  background: rgba(255,255,255,.7);
  border: 1px solid rgba(0,128,197,.10);
  box-shadow: 0 6px 18px -12px rgba(0,128,197,.30);
}
.steps.steps-journey .step-num {
  background: linear-gradient(135deg, #0080C5, #5540C2);
  box-shadow: 0 6px 14px -6px rgba(85,64,194,.5);
}

/* ---------- Reveal animation refinado ---------- */

@media (prefers-reduced-motion: no-preference) {
  .reveal { opacity: 0; transform: translateY(14px); transition: opacity .7s var(--ease-spring), transform .7s var(--ease-spring); }
  .reveal.visible { opacity: 1; transform: none; }

  .reveal-stagger > * { opacity: 0; transform: translateY(12px); transition: opacity .6s var(--ease-spring), transform .6s var(--ease-spring); }
  .reveal-stagger.visible > * { opacity: 1; transform: none; }
  .reveal-stagger.visible > *:nth-child(1) { transition-delay: 0ms; }
  .reveal-stagger.visible > *:nth-child(2) { transition-delay: 80ms; }
  .reveal-stagger.visible > *:nth-child(3) { transition-delay: 160ms; }
  .reveal-stagger.visible > *:nth-child(4) { transition-delay: 240ms; }
  .reveal-stagger.visible > *:nth-child(5) { transition-delay: 320ms; }
  .reveal-stagger.visible > *:nth-child(6) { transition-delay: 400ms; }
  .reveal-stagger.visible > *:nth-child(7) { transition-delay: 480ms; }
  .reveal-stagger.visible > *:nth-child(8) { transition-delay: 560ms; }
}

/* ---------- WhatsApp float refinado ---------- */

.wa-float {
  background: linear-gradient(135deg, #25D366 0%, #1ebe5d 100%);
  box-shadow:
    0 1px 2px rgba(0,0,0,.1),
    0 12px 28px -10px rgba(37,211,102,.55);
  transition: transform 320ms var(--ease-spring), box-shadow 320ms var(--ease-spring);
}
.wa-float:hover {
  transform: translateY(-3px) scale(1.04);
  box-shadow:
    0 1px 2px rgba(0,0,0,.1),
    0 22px 40px -14px rgba(37,211,102,.65);
}
.wa-float::after {
  content: ""; position: absolute; inset: -6px;
  border-radius: 999px;
  border: 2px solid rgba(37,211,102,.45);
  animation: waPulse 2.6s ease-out infinite;
  pointer-events: none;
}
@keyframes waPulse {
  0%   { transform: scale(1); opacity: .8; }
  100% { transform: scale(1.5); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) { .wa-float::after { animation: none; } }

/* ---------- Header refinado ---------- */

.site-header {
  background: rgba(255,255,255,.78);
  backdrop-filter: blur(14px) saturate(1.2);
  -webkit-backdrop-filter: blur(14px) saturate(1.2);
  border-bottom: 1px solid rgba(15,23,42,.06);
  transition: box-shadow 320ms var(--ease-spring), background 320ms ease;
}
.site-header.scrolled {
  box-shadow: 0 10px 30px -22px rgba(15,23,42,.30);
  background: rgba(255,255,255,.92);
}

/* ---------- Footer refinado ---------- */

.site-footer {
  position: relative; overflow: hidden;
  background:
    radial-gradient(900px 400px at 12% 0%, rgba(0,128,197,.18), transparent 65%),
    radial-gradient(700px 360px at 88% 0%, rgba(77,38,165,.20), transparent 65%),
    linear-gradient(180deg, #0E1729 0%, #060B17 100%);
  color: rgba(255,255,255,.85);
}
.site-footer::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: var(--noise-url);
  background-size: 220px 220px;
  opacity: .04; mix-blend-mode: overlay;
}
.site-footer h4 { color: #fff; }
.site-footer a { color: rgba(255,255,255,.78); }
.site-footer a:hover { color: #fff; }
.site-footer .footer-tag { color: rgba(255,255,255,.55); }
.site-footer .brand-name { color: #fff; }
.site-footer .brand-mark {
  background: linear-gradient(135deg, #0080C5, #5540C2);
  color: #fff;
}
.site-footer .footer-bottom { border-top-color: rgba(255,255,255,.10); color: rgba(255,255,255,.55); }
.site-footer .footer-bottom small a { color: rgba(255,255,255,.65); }

/* ---------- Cursor halo (opcional, usado no Concierge) ---------- */

.cursor-halo {
  position: fixed; pointer-events: none; z-index: 0;
  width: 360px; height: 360px; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(155,71,219,.20), transparent 70%);
  filter: blur(6px); transform: translate3d(-200%, -200%, 0);
  transition: transform 220ms cubic-bezier(.2,.7,.2,1);
}
@media (prefers-reduced-motion: reduce) { .cursor-halo { display: none; } }

/* Compatibilidade — quando o hero antigo (.hero-bg) coexiste com o novo (.aurora) */
.hero.aurora .hero-bg { display: none; }

/* Numbers da home — antes era dark, agora light com gradiente.
   Override para garantir tipografia visível nesta seção específica. */
.numbers .label,
.numbers .num-label { color: var(--ink-soft); }

/* Hero da home: como ganhou padding emocional, evitar dupla aplicação de padding */
.hero.hero-emo { padding: clamp(72px, 10vw, 128px) 0 clamp(56px, 8vw, 96px); }

/* hero-trust em modo refinado */
.hero.hero-emo .hero-trust {
  border-top: 1px dashed rgba(15,23,42,.10);
  padding-top: 16px; margin-top: 24px;
}
.hero.hero-emo .hero-trust li::before { color: var(--bora-purple); }

/* === fim — Onda 1 — Profundidade emocional ====================== */

/* =================================================================
   === Onda 2 — Imagens cinematográficas (29/abr/2026) =============
   Sistema .media + .hero-photo. Tratamento de marca uniforme,
   skeleton shimmer, gradient fallback, srcset-ready.
   Direção: luxo calmo · luz dourada · cinematográfico · emocional.
   Reverter: remover bloco entre delimitadores + remover <picture>.
   ================================================================= */

/* ---------- Wrapper .media (uso geral em seções) ---------- */

.media {
  position: relative; overflow: hidden;
  border-radius: var(--radius-lg);
  background:
    linear-gradient(135deg, rgba(0,128,197,.20), rgba(85,64,194,.28)),
    #1B1430;
  isolation: isolate;
  box-shadow: var(--shadow-premium);
}
.media::before {
  /* Skeleton shimmer (fica visível enquanto a img carrega) */
  content: ""; position: absolute; inset: 0; z-index: 0;
  background: linear-gradient(110deg,
    rgba(255,255,255,0) 30%,
    rgba(255,255,255,.10) 50%,
    rgba(255,255,255,0) 70%);
  background-size: 200% 100%;
  animation: shimmer 2.4s linear infinite;
}
@keyframes shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
@media (prefers-reduced-motion: reduce) {
  .media::before { animation: none; }
}

.media > img,
.media > picture,
.media > picture > img {
  position: relative; z-index: 1;
  width: 100%; height: 100%;
  object-fit: cover; display: block;
  transition: transform 1200ms var(--ease-spring), filter 600ms ease;
  /* tratamento de marca: dessaturação leve + contraste */
  filter: saturate(.88) contrast(1.04);
}
.media:hover > img,
.media:hover > picture > img { transform: scale(1.04); }

.media-cinematic { aspect-ratio: 21 / 9; }
.media-16-9 { aspect-ratio: 16 / 9; }
.media-4-3 { aspect-ratio: 4 / 3; }
.media-3-4 { aspect-ratio: 3 / 4; }
.media-square { aspect-ratio: 1 / 1; }

/* Tratamento de marca opcional (vinheta + gradient corner) */
.media-treat::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 2;
  background:
    radial-gradient(120% 100% at 50% 50%, transparent 50%, rgba(11,17,33,.32) 100%),
    linear-gradient(180deg, transparent 60%, rgba(11,17,33,.22) 100%),
    linear-gradient(135deg, transparent 65%, rgba(0,128,197,.18) 100%);
}

/* ---------- Hero com foto cinematográfica ---------- */

.hero-photo {
  position: absolute; inset: 0; z-index: -1;
  overflow: hidden; pointer-events: none;
}
.hero-photo > picture,
.hero-photo > picture > img,
.hero-photo > img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
  filter: saturate(.85) contrast(1.05) brightness(.95);
}
.hero-photo::after {
  /* Gradient overlay forte protegendo o texto à esquerda + barra inferior */
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 1;
  background:
    linear-gradient(105deg,
      rgba(11,17,33,.88) 0%,
      rgba(11,17,33,.65) 28%,
      rgba(11,17,33,.30) 55%,
      rgba(11,17,33,.05) 100%),
    linear-gradient(180deg, rgba(11,17,33,.10) 0%, transparent 30%, rgba(11,17,33,.55) 100%);
}

/* Quando o hero tem foto, atenua aurora pra não virar bagunça visual */
.aurora.has-photo::before,
.aurora.has-photo::after {
  opacity: .35;
  mix-blend-mode: screen;
}

/* Texto claro quando o hero tem foto */
.hero-emo.has-photo,
.hero-emo.has-photo .lead { color: rgba(255,255,255,.92); }
.hero-emo.has-photo .crumbs,
.hero-emo.has-photo .crumbs a { color: rgba(255,255,255,.75); }
.hero-emo.has-photo h1 { color: #fff; }
.hero-emo.has-photo h1 em.grad-text {
  background: linear-gradient(135deg, #FFE3A3 0%, #FFFFFF 50%, #C9B6FF 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.hero-emo.has-photo h1 em.grad-text-warm {
  background: linear-gradient(135deg, #FFE3A3 0%, #FFCB6B 60%, #FFFFFF 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.hero-emo.has-photo .eyebrow {
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.22);
  color: #FFE9C2;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.hero-emo.has-photo .hero-trust {
  color: rgba(255,255,255,.7);
  border-color: rgba(255,255,255,.16);
}
.hero-emo.has-photo .hero-trust li::before { color: #FFE3A3; }

/* Botões em hero com foto: ghost vira translúcido claro */
.hero-emo.has-photo .btn-ghost {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.32);
  color: #fff;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.hero-emo.has-photo .btn-ghost:hover {
  background: rgba(255,255,255,.16);
  border-color: rgba(255,255,255,.55);
}

/* ---------- Bloco de imagem 2-col (split com texto) ---------- */

.split-media {
  display: grid; gap: 36px; align-items: center;
  grid-template-columns: 1fr;
}
@media (min-width: 920px) {
  .split-media { grid-template-columns: 1fr 1fr; gap: 56px; }
  .split-media.media-left { direction: rtl; }
  .split-media.media-left > * { direction: ltr; }
}

/* ---------- Glass card sobre foto (visibilidade extra) ---------- */

.hero-emo.has-photo .glass {
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.22);
  color: #fff;
  backdrop-filter: blur(18px) saturate(1.4);
  -webkit-backdrop-filter: blur(18px) saturate(1.4);
}
.hero-emo.has-photo .glass .float-row {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.14);
}
.hero-emo.has-photo .glass .float-num { color: #FFE3A3; }
.hero-emo.has-photo .glass .float-label { color: rgba(255,255,255,.85); }
.hero-emo.has-photo .glass .float-tag {
  background: rgba(255,227,163,.18);
  color: #FFE3A3;
}

/* === fim — Onda 2 — Imagens cinematográficas ==================== */

/* =================================================================
   === Hotfixes pós-Onda 2 (29/abr/2026) ===========================
   1. CTA band Concierge — texto e botão ilegíveis sobre fundo roxo escuro.
   2. Logo no footer escuro — pintar branco (currentColor).
   3. Estado offline: src do SVG do logo não acessível por mask em
      file:// e similares — fallback elegante via background-image.
   ================================================================= */

/* 1. CTA band accent (Concierge) — força textos brancos + botão dourado contrastante */
.cta-band-accent,
.cta-band-accent h3,
.cta-band-accent p,
.cta-band-accent strong { color: #fff !important; }
.cta-band-accent h3 { color: #FFE9C2 !important; font-size: 1.4rem; }
.cta-band-accent p { color: rgba(255,255,255,.86) !important; }

/* Botão dentro do cta-band-accent vira gold (alto contraste sobre roxo) */
.cta-band-accent .btn,
.cta-band-accent .btn-accent,
.cta-band-accent .btn-primary {
  background: linear-gradient(135deg, #F0CD7A 0%, #D9B25A 100%);
  color: #1B1430 !important;
  border: 1px solid rgba(255,255,255,.20);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.45),
    0 8px 18px -6px rgba(0,0,0,.30),
    0 14px 32px -10px rgba(228,185,91,.45);
  font-weight: 700;
}
.cta-band-accent .btn:hover {
  background: linear-gradient(135deg, #F8D788 0%, #E1BC65 100%);
  transform: translateY(-2px);
}

/* 2. Footer escuro — logo símbolo branco
   (a troca do SVG é feita pelo content: url() acima na regra .site-footer .brand .brand-mark) */
.site-footer .brand,
.site-footer .brand-name { color: #fff; }
.site-footer .brand-name strong { color: #fff; }

/* 3. Plan Black — também no Concierge, garantir botão dourado contrastante (substitui regra anterior) */
.plan-black .btn,
.plan-black .btn-accent {
  background: linear-gradient(135deg, #F0CD7A 0%, #D9B25A 100%);
  color: #1B1430 !important;
  font-weight: 700;
}

/* === fim — Hotfixes ============================================= */

/* =================================================================
   === Onda 3 — Atmosfera de viagem (29/abr/2026) =================
   Pictogramas decorativos em SVG (avião, passaporte, compasso).
   Aplicados em pontos específicos. Sutil, sem poluição.
   Reverter: remover bloco entre delimitadores + classes nas páginas.
   ================================================================= */

/* ----- 1. Linha pontilhada com avião viajando entre os steps ----- */

.steps-journey-air {
  position: relative;
  padding-top: 28px;
}
/* Trilha pontilhada que conecta os steps (apenas desktop) */
.steps-journey-air::before {
  content: ""; position: absolute;
  top: 12px; left: 5%; right: 5%; height: 2px;
  background:
    repeating-linear-gradient(
      90deg,
      var(--bora-blue) 0 6px,
      transparent 6px 14px
    );
  opacity: .35;
  z-index: 0;
}
/* Avião pequeno percorrendo a linha — usa SVG colorido direto (sem mask) */
.steps-journey-air::after {
  content: "";
  position: absolute;
  top: -8px; left: 5%;
  width: 36px; height: 36px;
  background-image: url("../img/decoration/plane-azul.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  filter: drop-shadow(0 4px 10px rgba(0,128,197,.45));
  animation: planeJourney 16s ease-in-out infinite;
  z-index: 2;
}
@keyframes planeJourney {
  0%   { left: 5%; opacity: 0; transform: translateY(-2px) rotate(-2deg); }
  8%   { opacity: 1; }
  50%  { transform: translateY(-6px) rotate(2deg); }
  92%  { opacity: 1; }
  100% { left: calc(95% - 28px); opacity: 0; transform: translateY(-2px) rotate(-1deg); }
}
@media (max-width: 760px) {
  .steps-journey-air::before,
  .steps-journey-air::after { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .steps-journey-air::after { animation: none; left: 50%; opacity: .6; }
}

/* ----- 2. Stamp de passaporte sobre cards de case ----- */

.case .passport-stamp {
  position: absolute;
  top: 14px; right: 18px;
  width: 110px; height: 110px;
  pointer-events: none;
  color: var(--bora-purple-deep);
  opacity: 0;
  transform: rotate(-8deg) scale(.92);
  transition: opacity 700ms var(--ease-spring), transform 700ms var(--ease-spring);
  z-index: 1;
}
.case:hover .passport-stamp {
  opacity: .22;
  transform: rotate(-12deg) scale(1);
}
@media (prefers-reduced-motion: reduce) {
  .case .passport-stamp { opacity: .18; transform: rotate(-10deg); transition: none; }
}
/* Em mobile, sempre visível com opacity menor (sem hover) */
@media (max-width: 760px) {
  .case .passport-stamp { width: 80px; height: 80px; opacity: .14; }
}

/* ----- 3. Compasso decorativo nos cards de destino ----- */

.destino { position: relative; overflow: hidden; }
.destino::before {
  content: "";
  position: absolute;
  bottom: -28px; right: -28px;
  width: 130px; height: 130px;
  background-image: url("../img/decoration/compass.svg");
  background-size: contain;
  background-repeat: no-repeat;
  pointer-events: none;
  opacity: .055;
  /* Compasso usa cor escura ao invés de transparente para visibilidade sutil */
  filter: brightness(0) saturate(100%);
  transition: opacity 600ms var(--ease-spring), transform 800ms var(--ease-spring);
  z-index: 0;
}
.destino:hover::before {
  opacity: .12;
  transform: rotate(15deg) scale(1.08);
}
.destino > * { position: relative; z-index: 1; }
@media (prefers-reduced-motion: reduce) {
  .destino::before { transition: none; }
  .destino:hover::before { transform: none; }
}

/* ----- 4. Stamp de passaporte também na page-hero de cases ----- */

.page-hero .passport-stamp-hero {
  position: absolute;
  top: 50%; right: 8%;
  width: 140px; height: 140px;
  transform: translateY(-50%) rotate(-15deg);
  color: rgba(255,255,255,.22);
  pointer-events: none;
  z-index: 0;
}
@media (max-width: 980px) {
  .page-hero .passport-stamp-hero { display: none; }
}

/* ----- 5. Cards de destino com foto integrada (Onda 3.1) ----- */

/* Quando o card .destino tem .media dentro, foto sobe até a borda */
.destino:has(.media) { padding: 0; overflow: hidden; }
.destino:has(.media) > .media {
  border-radius: 0;
  margin: 0;
  box-shadow: none;
}
.destino:has(.media) > *:not(.media) {
  padding-left: 24px; padding-right: 24px;
}
.destino:has(.media) > *:nth-of-type(2) { padding-top: 18px; }
.destino:has(.media) > *:last-child { padding-bottom: 24px; }
/* Tag flutuante sobre a foto */
.destino:has(.media) .destino-tag {
  position: absolute;
  top: 14px; left: 14px;
  z-index: 3;
  background: rgba(255,255,255,.92);
  color: var(--bora-purple-deep);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
/* Compasso fica visível mas atrás da foto — ajuste */
.destino:has(.media)::before {
  bottom: -40px; right: -40px;
  width: 160px; height: 160px;
  z-index: 2;
}

/* ----- 6. Cards da home: foto real substitui gradient ----- */

/* Quando .destino-img tem foto (.media), desliga o gradient e o ::after */
.destino-img.media {
  aspect-ratio: 16/10;
  background: none !important;
  overflow: hidden;
  border-radius: 0;
  box-shadow: none;
}
.destino-img.media::after {
  content: none !important;
  background: none !important;
}
.destino-img.media > picture,
.destino-img.media > picture > img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
}

/* === fim — Onda 3 — Atmosfera de viagem ========================= */

/* =================================================================
   === Onda 4 — Tipografia emocional (30/abr/2026) ================
   Drop caps, sublinhados pintados, aspas decorativas.
   Pontual e cirúrgico. Não decora; pontua narrativa.
   Reverter: remover bloco entre delimitadores + classes nas páginas.
   ================================================================= */

/* ---------- 1. Drop cap (capitular) ---------- */

.lead-cap {
  text-indent: 0;
}
.lead-cap::first-letter {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 4.6em;
  line-height: 0.86;
  float: left;
  margin: 6px 14px 0 0;
  padding: 0;
  background: linear-gradient(135deg, #0080C5 0%, #5540C2 60%, #9B47DB 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  letter-spacing: -3px;
}
/* Variante escura para fundos escuros / hero com foto */
.lead-cap.lead-cap-light::first-letter {
  background: linear-gradient(135deg, #FFE3A3 0%, #FFFFFF 50%, #DDC8FF 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* ---------- 2. Sublinhado pintado à mão ---------- */

.painted-underline {
  position: relative;
  display: inline-block;
  white-space: nowrap;
}
.painted-underline::after {
  content: "";
  position: absolute;
  left: -2%; right: -2%; bottom: -.18em;
  height: .42em;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 18' preserveAspectRatio='none'><path d='M 4,12 C 30,4 60,16 100,10 C 140,4 170,16 196,8' stroke='%230080C5' stroke-width='4' fill='none' stroke-linecap='round'/></svg>");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  pointer-events: none;
  opacity: .85;
  z-index: -1;
}
/* Variante roxa (Concierge) */
.painted-underline.painted-purple::after {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 18' preserveAspectRatio='none'><path d='M 4,12 C 30,4 60,16 100,10 C 140,4 170,16 196,8' stroke='%239B47DB' stroke-width='4' fill='none' stroke-linecap='round'/></svg>");
}
/* Variante dourada (premium / Black) */
.painted-underline.painted-gold::after {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 18' preserveAspectRatio='none'><path d='M 4,12 C 30,4 60,16 100,10 C 140,4 170,16 196,8' stroke='%23E4B95B' stroke-width='4' fill='none' stroke-linecap='round'/></svg>");
}
/* Variante branca (sobre fotos / fundos escuros) */
.painted-underline.painted-white::after {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 18' preserveAspectRatio='none'><path d='M 4,12 C 30,4 60,16 100,10 C 140,4 170,16 196,8' stroke='%23FFFFFF' stroke-width='4' fill='none' stroke-linecap='round'/></svg>");
}
/* Variante animada — desenha o traço em 1.4s ao entrar em viewport */
@media (prefers-reduced-motion: no-preference) {
  .painted-underline.painted-anim::after {
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 1.4s var(--ease-spring, ease);
  }
  .painted-underline.painted-anim.visible::after,
  .reveal.visible .painted-underline.painted-anim::after,
  .reveal-stagger.visible .painted-underline.painted-anim::after {
    transform: scaleX(1);
  }
}

/* ---------- 3. Aspas tipográficas decorativas ---------- */

.case blockquote,
.depoimento blockquote,
.dep blockquote {
  position: relative;
  padding-left: 50px;
  padding-top: 8px;
}
.case blockquote::before,
.depoimento blockquote::before,
.dep blockquote::before {
  content: "\201C"; /* aspa esquerda dupla */
  position: absolute;
  top: -22px; left: 4px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 5.2rem;
  line-height: 1;
  color: var(--bora-purple);
  opacity: 0.32;
  font-weight: 700;
  pointer-events: none;
}
.plan-black blockquote::before,
.plan-black .dep blockquote::before {
  color: #E4B95B;
  opacity: 0.55;
}
/* Aspas decorativas em hero — versão mais sutil */
.hero blockquote::before,
.page-hero blockquote::before {
  font-size: 6rem;
  opacity: 0.18;
  color: var(--bora-blue);
  top: -28px; left: -8px;
}

/* ---------- 4. Pequenos refinamentos tipográficos ---------- */

/* Itálico premium em <em> de leads */
.lead em, .page-hero .lead em {
  font-style: italic;
  font-family: var(--font-display);
  color: var(--bora-purple-deep);
}
.hero-emo.has-photo .lead em {
  color: #FFE3A3;
}

/* Cite refinado em depoimentos */
.case blockquote cite,
.dep blockquote cite,
.depoimento blockquote cite {
  display: block;
  margin-top: 10px;
  font-size: .92rem;
  letter-spacing: .3px;
  color: var(--muted);
  font-style: normal;
}
.case blockquote cite::before,
.dep blockquote cite::before,
.depoimento blockquote cite::before {
  content: "— ";
  color: var(--bora-purple);
}

/* === fim — Onda 4 — Tipografia emocional ======================== */

/* =================================================================
   === Onda 5 — Refinamento humano (30/abr/2026) ==================
   Callouts visuais, mini resumos, escaneabilidade.
   Para conteúdo longo (pillars, posts).
   ================================================================= */

/* ---------- Callouts visuais ---------- */
.callout {
  position: relative;
  padding: 18px 22px 18px 60px;
  border-radius: 14px;
  margin: 28px 0;
  background: var(--bg-soft);
  border-left: 4px solid var(--bora-blue);
  box-shadow: 0 4px 14px -8px rgba(0,128,197,.18);
}
.callout::before {
  content: ""; position: absolute; left: 18px; top: 18px;
  width: 28px; height: 28px;
  border-radius: 999px;
  display: grid; place-items: center;
  background: var(--bora-blue);
  font-family: var(--font-display); font-weight: 700;
  font-size: 1rem; color: #fff;
  line-height: 1;
}
.callout p { margin: 0; color: var(--ink); line-height: 1.55; }
.callout p + p { margin-top: 8px; }
.callout strong { color: var(--bora-night); }
.callout > .callout-title {
  font-family: var(--font-display); font-weight: 700;
  color: var(--bora-night); font-size: 1.02rem;
  margin: 0 0 6px;
}

/* Variantes */
.callout-insight { background: linear-gradient(180deg, #f0f8fd 0%, #fafcff 100%); border-left-color: var(--bora-blue); }
.callout-insight::before { content: "💡"; background: rgba(0,128,197,.12); }

.callout-warn { background: linear-gradient(180deg, #fff8ed 0%, #fffdf9 100%); border-left-color: #E4B95B; }
.callout-warn::before { content: "⚠"; background: rgba(228,185,91,.18); color: #8B6E1F; }

.callout-premium { background: linear-gradient(180deg, #f7f1ff 0%, #fdfbff 100%); border-left-color: var(--bora-purple); }
.callout-premium::before { content: "♦"; background: rgba(155,71,219,.14); color: var(--bora-purple-deep); font-size: .9rem; }

.callout-summary { background: linear-gradient(180deg, #f4f7fb 0%, #fafcff 100%); border-left-color: var(--bora-night); }
.callout-summary::before { content: "✓"; background: rgba(39,56,80,.14); color: var(--bora-night); }

.callout-bora { background: linear-gradient(135deg, rgba(0,128,197,.08), rgba(85,64,194,.08)); border-left-color: var(--bora-blue); }
.callout-bora::before {
  content: "B"; background: linear-gradient(135deg, var(--bora-blue), var(--bora-purple));
  color: #fff; font-style: italic;
}

@media (max-width: 600px) {
  .callout { padding-left: 50px; }
  .callout::before { left: 14px; width: 24px; height: 24px; font-size: .9rem; }
}

/* ---------- Mini resumos no fim de seção ---------- */
.resumo {
  margin: 22px 0 36px;
  padding: 14px 18px;
  border-top: 1px dashed rgba(0,128,197,.3);
  border-bottom: 1px dashed rgba(0,128,197,.3);
  font-size: .96rem;
  color: var(--ink-soft);
  font-style: italic;
}
.resumo::before {
  content: "Em resumo: ";
  font-style: normal; font-weight: 700;
  color: var(--bora-blue);
  font-family: var(--font-display);
  letter-spacing: -.2px;
}

/* ---------- Pull quote (citação destacada) ---------- */
.pull-quote {
  margin: 36px 0;
  padding: 22px 24px 22px 28px;
  font-family: var(--font-display);
  font-weight: 600;
  font-size: clamp(1.2rem, 2.4vw, 1.6rem);
  line-height: 1.35;
  color: var(--bora-night);
  border-left: 5px solid var(--bora-blue);
  background: linear-gradient(90deg, rgba(0,128,197,.04) 0%, transparent 100%);
  letter-spacing: -.3px;
}

/* ---------- Article body — ritmo de leitura ---------- */
.blog-article p {
  font-size: 1.06rem;
  line-height: 1.72;
  color: var(--ink);
  max-width: 70ch;
}
.blog-article h2 {
  font-size: clamp(1.5rem, 2.8vw, 2rem);
  margin-top: 56px;
  margin-bottom: 18px;
  letter-spacing: -.4px;
}
.blog-article h2:first-of-type { margin-top: 24px; }
.blog-article h3 {
  font-size: 1.18rem;
  margin-top: 28px;
  margin-bottom: 10px;
  color: var(--bora-night);
}
.blog-article ul.checks li,
.blog-article ol li {
  font-size: 1.04rem;
  line-height: 1.6;
}
.blog-article details summary { font-size: 1.02rem; }

/* ---------- Mobile ---------- */
@media (max-width: 720px) {
  .blog-article p { font-size: 1rem; line-height: 1.65; }
  .blog-article h2 { margin-top: 40px; }
  .pull-quote { padding: 18px 18px 18px 22px; font-size: 1.15rem; }
}

/* === fim — Onda 5 — Refinamento humano ========================== */

/* =================================================================
   === Onda 6 — Diagnóstico de perfil (30/abr/2026) ===============
   Quiz consultivo elegante para qualificação Concierge.
   Página dedicada, mobile-first, sem hard sell.
   ================================================================= */

/* Layout do diagnóstico */
.diag-page {
  min-height: 100vh;
  background:
    radial-gradient(900px 500px at 14% 8%, rgba(0,128,197,.12), transparent 65%),
    radial-gradient(720px 460px at 86% 12%, rgba(155,71,219,.10), transparent 65%),
    linear-gradient(180deg, #fafcff 0%, #fff 60%);
}

.diag-header {
  display: flex; justify-content: space-between; align-items: center;
  padding: 18px 24px;
  border-bottom: 1px solid rgba(15,23,42,.04);
  background: rgba(255,255,255,.85);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  position: sticky; top: 0; z-index: 10;
}
.diag-header .brand-name { font-size: 1.15rem; }
.diag-header .exit {
  color: var(--muted); font-size: .92rem; text-decoration: none;
  font-family: var(--font-display);
}
.diag-header .exit:hover { color: var(--bora-blue); }

.diag-shell {
  max-width: 720px; margin: 0 auto;
  padding: 56px 24px 80px;
}

/* Progress bar elegante */
.diag-progress {
  display: flex; align-items: center; gap: 12px;
  margin-bottom: 36px;
  font-family: var(--font-display);
  font-size: .82rem; letter-spacing: 1px; text-transform: uppercase;
  color: var(--muted);
}
.diag-progress-bar {
  flex: 1; height: 3px; background: rgba(0,128,197,.14);
  border-radius: 999px; overflow: hidden;
}
.diag-progress-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--bora-blue), var(--bora-purple));
  border-radius: 999px;
  transition: width 600ms var(--ease-spring, ease);
  width: 0%;
}

/* Steps */
.diag-step {
  animation: diagFade 600ms var(--ease-spring) both;
}
@keyframes diagFade {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) { .diag-step { animation: none; } }

.diag-step .eyebrow { color: var(--bora-purple-deep); margin-bottom: 12px; }
.diag-step h1, .diag-step h2 {
  font-family: var(--font-display); font-weight: 700;
  letter-spacing: -.6px;
  line-height: 1.15;
  color: var(--bora-night);
  margin: 0 0 16px;
  font-size: clamp(1.6rem, 3.6vw, 2.3rem);
}
.diag-step .lead {
  color: var(--ink-soft); font-size: 1.06rem;
  line-height: 1.6; margin: 0 0 28px;
  max-width: 56ch;
}
.diag-step .qhint {
  color: var(--muted); font-size: .94rem;
  font-style: italic;
  margin: -6px 0 22px;
}

/* Opções de resposta — cards grandes */
.diag-options {
  display: grid; gap: 12px;
  margin-top: 20px;
}
.diag-options.grid-2 { grid-template-columns: 1fr; }
@media (min-width: 640px) {
  .diag-options.grid-2 { grid-template-columns: 1fr 1fr; }
}

.diag-option {
  position: relative;
  display: flex; align-items: center; gap: 14px;
  padding: 18px 20px;
  background: #fff;
  border: 1.5px solid rgba(15,23,42,.08);
  border-radius: 14px;
  text-align: left;
  font: inherit;
  color: var(--ink);
  cursor: pointer;
  transition: border-color 220ms var(--ease-spring),
              transform 280ms var(--ease-spring),
              box-shadow 280ms var(--ease-spring),
              background 220ms ease;
}
.diag-option:hover {
  border-color: rgba(0,128,197,.36);
  transform: translateY(-1px);
  box-shadow: 0 8px 24px -10px rgba(0,128,197,.18);
}
.diag-option:focus-visible {
  outline: 3px solid var(--bora-lavender);
  outline-offset: 3px;
}
.diag-option[aria-pressed="true"] {
  border-color: var(--bora-blue);
  background: linear-gradient(135deg, rgba(0,128,197,.05), rgba(85,64,194,.05));
  box-shadow: 0 12px 32px -12px rgba(0,128,197,.30);
}
.diag-option .opt-mark {
  flex-shrink: 0;
  width: 22px; height: 22px;
  border-radius: 999px;
  border: 1.5px solid rgba(15,23,42,.18);
  display: grid; place-items: center;
  transition: all 220ms ease;
}
.diag-option[aria-pressed="true"] .opt-mark {
  background: var(--bora-blue);
  border-color: var(--bora-blue);
}
.diag-option[aria-pressed="true"] .opt-mark::after {
  content: "✓"; color: #fff; font-size: .8rem; font-weight: 700; line-height: 1;
}
.diag-option .opt-label {
  font-family: var(--font-display); font-weight: 600;
  color: var(--bora-night);
  line-height: 1.35;
  font-size: 1.02rem;
}
.diag-option .opt-sub {
  display: block;
  color: var(--ink-soft);
  font-family: var(--font-body); font-weight: 400;
  font-size: .9rem;
  margin-top: 2px;
}

/* Navegação */
.diag-nav {
  margin-top: 36px;
  display: flex; justify-content: space-between; align-items: center;
  gap: 12px;
}
.diag-nav .btn {
  padding: 12px 22px;
  font-size: .98rem;
}
.diag-nav .btn-back {
  background: transparent; border: 0;
  color: var(--muted);
  font-family: var(--font-display); font-weight: 600;
  cursor: pointer;
}
.diag-nav .btn-back:hover { color: var(--bora-blue); }
.diag-nav .btn-back[hidden] { visibility: hidden; }

/* Intro especial */
.diag-intro h1 { font-size: clamp(1.9rem, 4.2vw, 2.8rem); }
.diag-intro .quick-facts {
  display: flex; flex-wrap: wrap; gap: 18px 28px;
  margin: 28px 0 36px;
  color: var(--ink-soft);
  font-family: var(--font-display);
}
.diag-intro .quick-facts span {
  display: inline-flex; align-items: center; gap: 8px;
}
.diag-intro .quick-facts span::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: linear-gradient(135deg, var(--bora-blue), var(--bora-purple));
}

/* Input texto (perguntas abertas) */
.diag-input {
  width: 100%;
  padding: 16px 18px;
  font: inherit; font-size: 1.05rem;
  background: #fff;
  border: 1.5px solid rgba(15,23,42,.10);
  border-radius: 14px;
  color: var(--ink);
  transition: border-color 220ms ease, box-shadow 220ms ease;
}
.diag-input:focus {
  outline: none;
  border-color: var(--bora-blue);
  box-shadow: 0 0 0 4px rgba(0,128,197,.12);
}

/* Resultado */
.diag-result {
  text-align: left;
}
.diag-result .result-eyebrow {
  font-family: var(--font-display); font-weight: 700;
  letter-spacing: 2px; text-transform: uppercase;
  font-size: .82rem; color: var(--bora-purple-deep);
  margin-bottom: 10px;
}
.diag-result h2 {
  font-size: clamp(1.7rem, 4vw, 2.4rem);
  margin-bottom: 14px;
}
.diag-result .result-name {
  background: linear-gradient(135deg, #0080C5 0%, #5540C2 60%, #9B47DB 100%);
  -webkit-background-clip: text; background-clip: text;
  color: transparent; -webkit-text-fill-color: transparent;
}
.diag-result .result-card {
  margin-top: 24px;
  padding: 28px 26px;
  border-radius: var(--radius-lg);
  background: linear-gradient(180deg, rgba(0,128,197,.04) 0%, rgba(155,71,219,.05) 100%);
  border: 1px solid rgba(0,128,197,.12);
}
.diag-result .result-card p { color: var(--ink); margin: 0 0 14px; line-height: 1.65; }
.diag-result .result-card p:last-child { margin-bottom: 0; }
.diag-result .result-card strong { color: var(--bora-night); }

.diag-result.result-black .result-card {
  background: linear-gradient(180deg, #1B1430 0%, #2D1858 100%);
  border-color: rgba(155,71,219,.30);
  color: #F4ECFF;
}
.diag-result.result-black .result-card p { color: rgba(255,255,255,.9); }
.diag-result.result-black .result-card strong { color: #FFE3A3; }

.diag-result .result-actions {
  margin-top: 28px;
  display: flex; gap: 12px; flex-wrap: wrap;
}

/* Pequeno detalhe humano */
.diag-result .post-note {
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px dashed rgba(0,128,197,.20);
  color: var(--muted);
  font-size: .92rem;
  font-style: italic;
}

/* Mobile */
@media (max-width: 600px) {
  .diag-shell { padding: 32px 16px 64px; }
  .diag-header { padding: 14px 16px; }
  .diag-step h1, .diag-step h2 { letter-spacing: -.4px; }
  .diag-option { padding: 16px 16px; }
}

/* === fim — Onda 6 — Diagnóstico de perfil ======================= */