/* =====================================================================
   Carnaval Rio de Janeiro 2027 · Tu Goxxxta! · Juca na Balada
   Visual da família dos descritivos Juca (referência: Réveillon no
   Caribe): capa em vídeo, azul-petróleo, dourado e turquesa, títulos em
   duas cores com divisor, cartões claros e simulador escuro.
   Acentos de Carnaval (sol, coral, rosa) só no bordão e nos cartazes.
   Folha única, mobile primeiro.
   ===================================================================== */

:root {
  /* azuis da família */
  --azul-x: #00283B;     /* texto escuro sobre turquesa/dourado */
  --azul-xx: #003A55;    /* painel do resumo */
  --azul-d: #004C6E;     /* capa, configurador, rodapé */
  --azul: #00618C;       /* seção de pacotes, títulos de cartão */
  --azul-2: #007CB2;
  --azul-3: #1189C2;
  /* turquesa e dourado */
  --tq: #24BFA7;
  --tq-d: #0F9480;       /* texto grande em fundo claro */
  --tq-t: #0B7A68;       /* texto pequeno em fundo claro */
  --tq-c: #7FE3D3;       /* texto sobre azul */
  --ouro: #F2C14E;
  --ouro-c: #F7DC92;
  --ouro-t: #9A6A00;     /* texto dourado em fundo claro */
  /* Carnaval */
  --sol: #FFD447;
  --coral: #FF6338;
  --laranja: #E66728;    /* linha e marcadores de “O pacote inclui” (cor do print da Juca) */
  --rosa: #EE2A7B;
  --rosa-t: #C2185B;
  /* neutros quentes */
  --branco: #FFFFFF;
  --creme: #FCF1D3;
  --creme-2: #FFF9EA;
  --tinta: #3F4A52;
  --tinta-2: #5E6870;
  --linha: rgba(0, 76, 110, .12);
  --verde: #15803D;
  --verde-2: #166534;

  --f-txt: 'Overpass', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --f-tit: 'Space Grotesk', 'Overpass', Helvetica, Arial, sans-serif;
  --f-letra: 'Shrikhand', 'Arial Black', Impact, sans-serif;

  --maxw: 1240px;
  --g: 16px;
  --topo-h: 64px;
  --raio: 6px;
  --sombra: 0 1px 2px rgba(0, 40, 60, .06), 0 14px 32px -18px rgba(0, 40, 60, .32);
  --ease: cubic-bezier(.22, .61, .36, 1);
}
@media (min-width: 768px) { :root { --g: 32px; --topo-h: 76px; } }
@media (min-width: 1280px) { :root { --g: 40px; } }

/* ---------------------------------------------------------------------
   BASE
   --------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: calc(var(--topo-h) + 12px); color-scheme: light; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
/* a barra fixa do celular nunca cobre o elemento que recebe o foco */
@media (max-width: 899px) { html { scroll-padding-bottom: calc(92px + env(safe-area-inset-bottom, 0px)); } }
body {
  margin: 0; font-family: var(--f-txt); font-size: 16.5px; line-height: 1.65;
  color: var(--tinta); background: var(--branco); -webkit-font-smoothing: antialiased;
}
img, svg, video { max-width: 100%; }
img { display: block; height: auto; }
a { color: inherit; }
p { margin: 0 0 1em; }
h1, h2, h3 { margin: 0; font-family: var(--f-tit); }
ul, ol { margin: 0; padding: 0; }
button { font: inherit; }
code { font-family: ui-monospace, 'Cascadia Mono', Consolas, monospace; font-size: .92em; }
main:focus { outline: none; }

.sr-only {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0;
}
.no-js .needs-js { display: none !important; }
.js .no-js-only { display: none !important; }
[hidden] { display: none !important; }

:focus-visible { outline: 3px solid var(--tq-d); outline-offset: 3px; border-radius: 4px; }
.topo :focus-visible, .hero :focus-visible, .sec-azul :focus-visible, .sec-azul-escuro :focus-visible,
.final :focus-visible, .rodape :focus-visible, .porque :focus-visible, .barra :focus-visible,
.rota :focus-visible, .avisos :focus-visible { outline-color: var(--ouro); }
.wa-flut:focus-visible { outline: 3px solid var(--azul-x); outline-offset: 2px; box-shadow: 0 0 0 7px #fff; }
/* controles do carrossel ficam sobre a foto: anel branco dentro da pílula escura */
.car-ctrl :focus-visible { outline: 2px solid #fff; outline-offset: 1px; }

.pular {
  position: absolute; left: 12px; top: -60px; z-index: 100; background: var(--ouro); color: var(--azul-x);
  padding: 10px 16px; border-radius: 4px; font-weight: 700; text-decoration: none;
}
.pular:focus { top: 12px; }
.ico { display: inline-flex; flex-shrink: 0; line-height: 0; font-style: normal; }
.ic { display: block; }

/* foto de banco: sem arquivo, fica só a cor de fundo do contêiner */
.foto { width: 100%; height: 100%; object-fit: cover; }
.foto.quebrada { visibility: hidden; }

/* ---------------------------------------------------------------------
   BOTÕES
   --------------------------------------------------------------------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 48px; padding: 12px 24px; border-radius: 3px; border: 1.5px solid transparent;
  font-family: var(--f-tit); font-weight: 600; font-size: 15px; letter-spacing: .02em;
  text-decoration: none; line-height: 1.15; text-align: center; cursor: pointer; background: none; color: inherit;
  transition: background-color .2s var(--ease), color .2s, border-color .2s, transform .2s var(--ease);
}
.btn:hover { transform: translateY(-1px); }
.btn-g { min-height: 54px; padding: 14px 30px; font-size: 16px; }
.btn-tq { background: var(--tq); color: var(--azul-x); }
.btn-tq:hover { background: #3dd0b9; }
.btn-verde { background: var(--verde); color: #fff; }
.btn-verde:hover { background: var(--verde-2); }
.btn-azul { background: var(--azul); color: #fff; }
.btn-azul:hover { background: var(--azul-d); }
.btn-contorno { border-color: rgba(255, 255, 255, .7); color: #fff; }
.btn-contorno:hover { background: rgba(255, 255, 255, .1); border-color: #fff; }
.btn-contorno-azul { border-color: var(--azul); color: var(--azul); }
.btn-contorno-azul:hover { background: var(--azul); color: #fff; }
.btn-linha-clara { border-color: rgba(255, 255, 255, .45); color: #fff; }
.btn-linha-clara:hover { background: #fff; color: var(--azul-d); }
.btn-txt {
  background: none; border: 0; padding: 8px 0; cursor: pointer; color: var(--azul);
  font-weight: 600; text-decoration: underline; text-underline-offset: 3px;
}

/* ---------------------------------------------------------------------
   FAIXA DE REVISÃO (prévia)
   --------------------------------------------------------------------- */
.revisao { background: repeating-linear-gradient(-45deg, #FFD447 0 14px, #FFCB2E 14px 28px); color: var(--azul-x); font-size: 14px; position: relative; z-index: 60; }
.revisao-in { max-width: 1320px; margin: 0 auto; padding: 10px var(--g); display: flex; flex-wrap: wrap; gap: 8px 20px; align-items: center; justify-content: space-between; }
.revisao-txt { display: flex; gap: 10px; align-items: flex-start; margin: 0; line-height: 1.4; }
.revisao-erro { display: block; color: #8A1C00; }
.revisao-acoes { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; }
.revisao-btn { background: var(--azul-d); color: var(--ouro); border: 0; border-radius: 999px; padding: 7px 14px; font-weight: 700; font-size: 13px; cursor: pointer; }
.revisao-btn[aria-pressed="true"] { background: #8A1C00; color: #fff; }
.revisao-lista summary { cursor: pointer; font-weight: 700; text-decoration: underline; }
.revisao-lista > ul { list-style: none; margin: 10px 0; padding: 14px 16px; background: #fff; border-radius: 8px; max-height: 55vh; overflow: auto; box-shadow: var(--sombra); max-width: 640px; }
.revisao-lista > ul > li { margin-bottom: 10px; }
.revisao-lista ul ul { list-style: none; margin-top: 4px; }
.revisao-lista ul ul li { padding: 3px 0; font-size: 13px; }
.revisao-lista em { font-style: normal; font-size: 12px; font-weight: 700; color: #8A1C00; text-transform: uppercase; letter-spacing: .04em; }
.revisao-lista p { margin: 0; font-size: 13px; }
.rev { display: flex; gap: 8px; align-items: flex-start; margin: 10px 0; padding: 7px 10px; background: #FFF1B8; color: #4A3700; border-left: 3px solid #D99A00; border-radius: 4px; font-size: 12.5px; line-height: 1.4; text-align: left; }
.rev .ic { margin-top: 1px; color: #9A6B00; }
.rev-tag { font-weight: 800; text-transform: uppercase; letter-spacing: .08em; font-size: 12px; }
body.ver-pendencias [data-pend] { outline: 2px dashed #E0A800; outline-offset: 3px; box-shadow: 0 0 0 6px rgba(255, 212, 71, .3); }

/* ---------------------------------------------------------------------
   CABEÇALHO
   --------------------------------------------------------------------- */
.topo {
  position: -webkit-sticky; position: sticky; top: env(safe-area-inset-top, 0px); z-index: 50;
  background: rgba(0, 58, 85, .97); color: #fff; transition: background-color .3s, box-shadow .3s;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .06);
}
.js .topo.sobre-capa { background: linear-gradient(rgba(0, 30, 45, .55), rgba(0, 30, 45, 0)); box-shadow: none; }
.topo-in { max-width: 1320px; margin: 0 auto; padding: 0 var(--g); height: var(--topo-h); display: flex; align-items: center; gap: 14px; }
/* área de proteção do logo: 50% da altura do "J" */
.marca { display: block; padding: 6px 13px 6px 0; flex-shrink: 0; }
.marca img { height: 26px; width: auto; }
@media (min-width: 768px) { .marca img { height: 30px; } .marca { padding-right: 15px; } }
.topo-camp { display: none; flex-direction: column; line-height: 1.1; border-left: 1px solid rgba(255, 255, 255, .25); padding-left: 14px; }
.topo-camp b { font-family: var(--f-tit); font-weight: 700; font-size: 14px; letter-spacing: .14em; text-transform: uppercase; }
.topo-bordao { font-family: var(--f-letra); font-size: 13px; color: var(--ouro); margin-top: 2px; }
@media (min-width: 480px) { .topo-camp { display: flex; } }
/* entre 1100 e 1279px o menu aparece inteiro e não sobra espaço para o rótulo da campanha */
@media (min-width: 1100px) and (max-width: 1279px) { .topo-camp { display: none; } }
.topo-camp b, .menu li a { white-space: nowrap; }
/* serpentinas: liga/desliga ao lado do menu (estado em aria-pressed) */
.serp-btn {
  margin-left: auto; position: relative; width: 46px; height: 46px; flex: none; display: inline-grid; place-items: center;
  background: none; border: 1.5px solid rgba(255, 255, 255, .35); color: #fff; border-radius: 3px; cursor: pointer;
  transition: color .2s, border-color .2s;
}
.serp-btn[aria-pressed="true"] { color: var(--ouro); border-color: rgba(242, 193, 78, .7); }
.serp-btn:hover { border-color: rgba(255, 255, 255, .7); }
.serp-risco { position: absolute; width: 26px; height: 1.5px; border-radius: 1px; background: currentColor; transform: rotate(-45deg); }
.serp-btn[aria-pressed="true"] .serp-risco { display: none; }
.serp-btn[aria-pressed="false"] { color: rgba(255, 255, 255, .78); }
/* canvas das serpentinas: por cima do conteúdo, abaixo do cabeçalho e das barras; não recebe cliques */
.serp-canvas { position: fixed; top: 0; left: 0; z-index: 35; pointer-events: none; }
.menu-btn {
  margin-left: 0; width: 46px; height: 46px; flex: none; display: inline-grid; place-items: center;
  background: none; border: 1.5px solid rgba(255, 255, 255, .35); color: #fff; border-radius: 3px; cursor: pointer;
}
.topo-cta { display: none; min-height: 42px; padding: 8px 16px; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; border-color: var(--ouro); color: var(--ouro); }
.topo-cta:hover { background: var(--ouro); color: var(--azul-x); }
@media (min-width: 640px) { .topo-cta { display: inline-flex; } }

.menu {
  position: fixed; top: 0; right: 0; bottom: 0; width: min(400px, 100%); background: var(--azul-d); z-index: 70;
  padding: calc(18px + env(safe-area-inset-top, 0px)) 24px calc(32px + env(safe-area-inset-bottom, 0px));
  display: flex; flex-direction: column; gap: 20px; overflow-y: auto;
  transform: translateX(100%); visibility: hidden; transition: transform .3s var(--ease), visibility 0s linear .3s;
}
.menu.aberto { transform: none; visibility: visible; transition: transform .3s var(--ease); }
.menu-fundo { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 65; background: rgba(0, 15, 25, .6); }
body.menu-aberto { overflow: hidden; }
body.menu-aberto .topo { z-index: 80; }
.menu-cab { display: flex; align-items: center; justify-content: space-between; }
.menu-cab-t { font-family: var(--f-tit); font-weight: 600; text-transform: uppercase; letter-spacing: .2em; font-size: 12px; color: var(--ouro); }
.menu-fechar { width: 44px; height: 44px; border-radius: 3px; border: 1.5px solid rgba(255, 255, 255, .3); background: none; color: #fff; display: grid; place-items: center; cursor: pointer; }
.menu ul { list-style: none; display: flex; flex-direction: column; }
.menu li a { display: block; padding: 12px 0; text-decoration: none; color: #fff; font-family: var(--f-tit); font-weight: 600; font-size: 24px; border-bottom: 1px solid rgba(255, 255, 255, .1); }
.menu li a:hover { color: var(--ouro); }
.menu-cta { align-self: flex-start; }
@media (prefers-reduced-motion: reduce) { .menu, .menu.aberto { transition: none; } }
.no-js .topo-in { flex-wrap: wrap; height: auto; padding-top: 10px; padding-bottom: 10px; }
.no-js .menu { position: static; transform: none; visibility: visible; width: 100%; padding: 0; background: none; overflow: visible; order: 5; }
.no-js .menu ul { flex-direction: row; flex-wrap: wrap; gap: 4px 14px; }
.no-js .menu li a { font-size: 15px; border: 0; padding: 6px 0; }
.no-js .menu-cta { display: none; }
@media (min-width: 1100px) {
  .menu-btn { display: none; }
  .menu { position: static; transform: none; visibility: visible; width: auto; padding: 0; background: none; overflow: visible; flex-direction: row; margin-left: 4px; transition: none; }
  .menu-cab, .menu-cta { display: none !important; }
  .menu ul { flex-direction: row; gap: 2px; }
  .menu li a { font-size: 14.5px; font-weight: 500; border: 0; padding: 10px 11px; }
  .no-js .menu { order: 0; width: auto; }
}

/* ---------------------------------------------------------------------
   CAPA EM VÍDEO
   --------------------------------------------------------------------- */
.hero { position: relative; margin-top: calc(-1 * var(--topo-h)); background: var(--azul-d); color: #fff; overflow: hidden; isolation: isolate; }
.hero-midia { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -2; background-color: var(--azul-d); }
.hero-video { width: 100%; height: 100%; object-fit: cover; display: block; }
.hero-veu {
  position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1;
  background:
    radial-gradient(ellipse at 50% 45%, rgba(0, 30, 45, .15), rgba(0, 30, 45, .55) 75%),
    linear-gradient(180deg, rgba(0, 35, 52, .55) 0%, rgba(0, 35, 52, .3) 30%, rgba(0, 35, 52, .45) 65%, rgba(0, 30, 45, .9) 100%);
}
.hero-in {
  max-width: 1000px; margin: 0 auto; text-align: center; display: flex; flex-direction: column; align-items: center;
  padding: calc(var(--topo-h) + 40px) var(--g) 64px;
}
@media (min-width: 768px) { .hero-in { padding-top: calc(var(--topo-h) + 36px); padding-bottom: 72px; } }
.hero-selo {
  display: inline-block; margin: 0 0 14px; padding: 6px 14px; background: var(--tq); color: var(--azul-x);
  font-family: var(--f-tit); font-weight: 600; font-size: 13px; letter-spacing: .04em; border-radius: 2px;
}
.lockup { display: flex; flex-direction: column; align-items: center; margin-bottom: 14px; }
.lk-pre { display: flex; align-items: center; gap: 12px; margin: 0 0 6px; }
/* área de proteção do logo respeitada pelo gap e pela margem */
.lk-logo { height: 30px; width: auto; margin: 8px 0; }
@media (min-width: 768px) { .lk-logo { height: 38px; } }
.lk-pre span { font-family: var(--f-tit); font-weight: 600; font-size: 13px; letter-spacing: .3em; text-transform: uppercase; color: var(--ouro); }
.lk-bordao { margin: 0; line-height: .8; }
.lettering {
  position: relative; display: inline-block; font-family: var(--f-letra); font-weight: 400; color: #fff;
  font-size: clamp(64px, min(15vw, 15vh), 150px); line-height: .86; letter-spacing: -.005em; text-align: left;
  text-shadow: 0 6px 34px rgba(0, 20, 30, .45);
}
.lt-tu { display: block; width: max-content; font-size: .44em; line-height: 1; color: var(--tq-c); transform: rotate(-7deg); transform-origin: left bottom; margin: 0 0 .04em .08em; }
.lt-linha { position: relative; z-index: 1; display: block; white-space: nowrap; }
/* os três "x" são letras reais (transparentes) com a fita vetorial por cima */
.lt-x { position: relative; display: inline-block; color: transparent; margin: 0 -.025em; text-shadow: none; }
.lt-x3 { margin-right: -.075em; }
.lt-x svg { position: absolute; left: -10%; width: 120%; bottom: .14em; height: .64em; overflow: visible; filter: drop-shadow(0 4px 10px rgba(0, 20, 30, .35)); }
.lt-x path { fill: none; stroke: currentColor; stroke-width: 22; stroke-linecap: round; }
.lt-x .lt-x-luz { stroke: rgba(255, 255, 255, .45); stroke-width: 5; }
.lt-x1 svg { color: var(--sol); transform: translateY(.02em) rotate(-7deg) skewX(-8deg); }
.lt-x2 svg { color: var(--coral); transform: translateY(-.03em) rotate(5deg) skewX(-8deg); }
.lt-x3 svg { color: var(--rosa); transform: translateY(.01em) rotate(-3deg) skewX(-8deg); }
.lt-fita { position: absolute; z-index: 0; left: 22%; right: -2%; bottom: -.1em; height: .2em; overflow: visible; }
.lt-fita path { fill: none; stroke: var(--tq); stroke-width: 9; stroke-linecap: round; }
.lk-dest { margin: .38em 0 0; font-family: var(--f-tit); font-weight: 700; font-size: clamp(28px, 5.2vw, 58px); line-height: 1.02; letter-spacing: -.025em; text-shadow: 0 4px 24px rgba(0, 20, 30, .4); text-wrap: balance; }
.lk-a { color: #fff; }
.lk-b { color: var(--ouro); }
@media (prefers-reduced-motion: no-preference) {
  .lt-x svg { animation: x-pop .8s cubic-bezier(.3, 1.7, .5, 1) both; }
  .lt-x2 svg { animation-delay: .12s; }
  .lt-x3 svg { animation-delay: .24s; }
  .lt-fita path { stroke-dasharray: 460; stroke-dashoffset: 460; animation: risca 1.1s .35s ease-out forwards; }
}
/* só escala: o bordão nunca fica invisível, nem no primeiro quadro */
@keyframes x-pop { from { scale: .55; } to { scale: 1; } }
@keyframes risca { to { stroke-dashoffset: 0; } }

.hero-sub { margin: 6px 0 2px; font-family: var(--f-tit); font-weight: 500; font-size: clamp(19px, 2.3vw, 26px); color: var(--tq-c); line-height: 1.25; }
.hero-apoio { max-width: 52ch; color: rgba(255, 255, 255, .88); font-size: 16.5px; margin-bottom: 10px; }
.hero-datas { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 6px 14px; margin: 4px 0 18px; font-family: var(--f-tit); font-weight: 500; font-size: 14px; letter-spacing: .26em; text-transform: uppercase; }
.hero-datas i { width: 22px; height: 1.5px; background: var(--ouro); }
/* onde fica a hospedagem: selo discreto junto aos dados da viagem */
.hero-local { display: inline-flex; align-items: center; gap: 8px; margin: -6px auto 16px; padding: 7px 16px; border-radius: 999px; background: rgba(0, 30, 45, .62); border: 1px solid rgba(242, 193, 78, .65); font-family: var(--f-tit); font-weight: 500; font-size: 15px; color: #fff; }
.hero-local strong { color: var(--ouro); font-weight: 700; }
.hero-local .ic { flex: none; color: var(--ouro); }
.hero-chips { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-bottom: 16px; }
.hero-chips li {
  padding: 7px 13px; border: 1px solid rgba(255, 255, 255, .28); background: rgba(0, 30, 45, .45);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  font-family: var(--f-tit); font-weight: 600; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; border-radius: 2px;
}
.hero-preco {
  display: grid; justify-items: center; gap: 0; margin: 0 0 20px; padding: 9px 22px;
  background: rgba(0, 30, 45, .6); border: 1px solid rgba(255, 255, 255, .16); border-radius: 3px;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.hp-rot { font-family: var(--f-tit); font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--ouro); font-weight: 600; }
.hp-val { font-family: var(--f-tit); font-weight: 700; font-size: 30px; line-height: 1.1; font-variant-numeric: tabular-nums; }
.hp-ref { font-size: 13px; color: rgba(255, 255, 255, .8); }
.hero-ctas { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.hero-pausa {
  position: absolute; right: 16px; bottom: 16px; z-index: 3; display: inline-flex; align-items: center; gap: 8px;
  padding: 7px 12px 7px 9px; border: 1px solid rgba(255, 255, 255, .3); background: rgba(0, 20, 30, .5); color: #fff;
  border-radius: 999px; font-size: 12.5px; font-weight: 600; cursor: pointer;
}
.hero-pausa .ic { width: 16px; height: 16px; }

/* faixa rolante */
.faixa { position: relative; background: var(--azul-d); border-top: 1px solid rgba(255, 255, 255, .12); border-bottom: 1px solid rgba(0, 0, 0, .12); overflow: hidden; }
.faixa-pausa { position: absolute; right: 8px; top: 50%; margin-top: -18px; width: 36px; height: 36px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .35); background: var(--azul-xx); color: #fff; display: grid; place-items: center; cursor: pointer; }
.faixa.parada .faixa-trilho { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) { .faixa-pausa { display: none; } }
.faixa-trilho { display: flex; width: max-content; }
.faixa-grupo { display: flex; align-items: center; gap: 28px; padding: 16px 14px; }
.faixa-grupo span { font-family: var(--f-tit); font-weight: 600; font-size: 14.5px; letter-spacing: .2em; text-transform: uppercase; color: var(--ouro-c); white-space: nowrap; }
.faixa-grupo i { width: 6px; height: 6px; border-radius: 50%; background: var(--tq); flex-shrink: 0; }
@media (prefers-reduced-motion: no-preference) {
  .faixa-trilho { animation: faixa 48s linear infinite; }
  .faixa:hover .faixa-trilho { animation-play-state: paused; }
}
@keyframes faixa { to { transform: translateX(-50%); } }

/* ---------------------------------------------------------------------
   SEÇÕES — cabeçalho no padrão dos descritivos Juca
   --------------------------------------------------------------------- */
.sec { padding: 72px 0; position: relative; }
@media (min-width: 1024px) { .sec { padding: 108px 0; } }
.sec-in { max-width: var(--maxw); margin: 0 auto; padding: 0 var(--g); }
.sec-branco { background: var(--branco); }
.sec-creme { background: linear-gradient(180deg, var(--creme-2), var(--creme)); }
.sec-azul { background: var(--azul); color: #fff; }
.sec-azul-escuro { background: radial-gradient(ellipse at 80% 0%, rgba(17, 137, 194, .35), transparent 55%), var(--azul-d); color: #fff; }

.sec-cab { text-align: center; margin: 0 auto 44px; max-width: 860px; }
.kicker { display: inline-flex; align-items: center; gap: 12px; margin: 0 0 14px; font-family: var(--f-tit); font-weight: 600; font-size: 14px; color: var(--tq-t); }
.kicker-fio { width: 30px; height: 2px; background: var(--tq); }
.sec-azul .kicker, .sec-azul-escuro .kicker, .kicker-claro { color: var(--tq-c); }
.tit { font-weight: 700; font-size: clamp(34px, 4.8vw, 58px); line-height: 1.04; letter-spacing: -.025em; text-wrap: balance; }
.tit-a { color: var(--tinta); }
.tit-b { color: var(--tq-d); display: inline-block; }
.tit-sub { display: block; margin-top: .3em; font-size: .52em; font-weight: 600; letter-spacing: -.01em; color: var(--ouro-t); }
.sec-azul .tit-a, .sec-azul-escuro .tit-a { color: #fff; }
.sec-azul .tit-b, .sec-azul-escuro .tit-b { color: var(--ouro); }
.sec-azul .tit-sub, .sec-azul-escuro .tit-sub { color: var(--tq-c); }
.sec-creme .tit-sub { color: #8A5E00; }
.tit-esq { text-align: left; }
.divisor { display: flex; align-items: center; justify-content: center; gap: 14px; margin: 26px auto 22px; max-width: 460px; }
.divisor span { flex: 1; height: 1px; background: linear-gradient(90deg, transparent, var(--ouro), transparent); }
.divisor i { width: 8px; height: 8px; background: var(--ouro); transform: rotate(45deg); }
.divisor-esq { margin-left: 0; justify-content: flex-start; max-width: 320px; }
.divisor-esq span:first-child { display: none; }
.lead { font-size: clamp(16.5px, 1.6vw, 18.5px); color: var(--tinta-2); max-width: 64ch; margin: 0 auto; }
.sec-azul .lead, .sec-azul-escuro .lead { color: rgba(255, 255, 255, .82); }
.nota-sec { display: flex; gap: 10px; align-items: flex-start; justify-content: center; text-align: left; margin: 30px auto 0; max-width: 820px; font-size: 14px; color: var(--tinta-2); }
.nota-sec .ic { width: 18px; height: 18px; margin-top: 2px; flex-shrink: 0; }
.sec-azul .nota-sec { color: rgba(255, 255, 255, .9); }

/* ---------------------------------------------------------------------
   02 · A EXPERIÊNCIA
   --------------------------------------------------------------------- */
.exp { display: grid; gap: 40px; align-items: center; }
@media (min-width: 980px) { .exp { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 64px; } }
.exp-texto { min-width: 0; }
.exp-lead { font-family: var(--f-tit); font-weight: 500; font-size: clamp(19px, 2vw, 22px); line-height: 1.45; color: var(--azul); }
.exp-texto p:not(.exp-lead):not(.kicker) { color: var(--tinta-2); }
.exp-ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.exp-foto { position: relative; margin: 0; border-radius: var(--raio); overflow: hidden; aspect-ratio: 4 / 5; max-width: 100%; background-color: var(--azul-3); box-shadow: var(--sombra); }
@media (min-width: 600px) and (max-width: 979px) { .exp-foto { aspect-ratio: 16 / 10; } }
.exp-foto figcaption {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 90px 26px 24px; color: #fff;
  background: linear-gradient(rgba(0, 30, 45, 0), rgba(0, 30, 45, .72) 40%, rgba(0, 30, 45, .92)); display: flex; flex-direction: column; gap: 4px;
}
.exp-foto figcaption span { font-family: var(--f-tit); font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--ouro-c); font-weight: 600; }
.exp-foto figcaption strong { font-family: var(--f-tit); font-size: clamp(20px, 2.2vw, 26px); font-weight: 600; line-height: 1.2; }

/* carrossel: fotos sobrepostas, troca por fusão */
.car-grupo { position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
.car { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 0; }
.car-slide { position: absolute; top: 0; left: 0; opacity: 0; transition: opacity 1.2s ease; }
.car-slide.ativo { opacity: 1; z-index: 2; }
/* a foto que sai fica inteira por baixo enquanto a nova aparece: sem “piscar” o fundo */
.car-slide.saindo { opacity: 1; z-index: 1; transition: none; }
.car-ctrl { position: absolute; top: 10px; right: 10px; z-index: 4; display: flex; align-items: center; gap: 2px; padding: 3px 6px 3px 3px; border-radius: 999px; background: rgba(0, 20, 30, .6); }
.car-pausa { width: 30px; height: 30px; margin-right: 2px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .45); background: transparent; color: #fff; display: grid; place-items: center; cursor: pointer; }
.car-pausa .ic { width: 14px; height: 14px; }
.car-ponto { width: 24px; height: 30px; padding: 0; border: 0; background: none; display: grid; place-items: center; cursor: pointer; }
.car-ponto::before { content: ''; width: 8px; height: 8px; border-radius: 4px; background: rgba(255, 255, 255, .6); transition: width .3s ease, background-color .3s ease; }
.car-ponto[aria-current="true"]::before { width: 18px; background: var(--ouro); }
@media (prefers-reduced-motion: reduce) { .car-slide, .car-ponto::before { transition: none; } }

/* ---------------------------------------------------------------------
   03 · INCLUSO + DESTAQUES + NÚMEROS
   --------------------------------------------------------------------- */
/* O PACOTE INCLUI: um bloco branco, lista contínua; cada quadrado acompanha o
   seu item e a linha tracejada liga um quadrado ao próximo (quebra de linha
   não desalinha nada) */
.inc-cab { text-align: center; margin: 0 auto 22px; }
.inc-tit { font-weight: 700; font-size: clamp(26px, 3.4vw, 38px); line-height: 1.1; letter-spacing: .01em; text-transform: uppercase; color: var(--tinta); }
.inc-traco { display: block; width: 92px; height: 4px; margin: 14px auto 0; background: var(--laranja); border-radius: 2px; }
.inc-bloco { max-width: 760px; margin: 0 auto; background: var(--branco); border: 1px solid var(--linha); border-radius: 4px; padding: 20px 18px; box-shadow: 0 1px 2px rgba(0, 40, 60, .05); }
@media (min-width: 600px) { .inc-bloco { padding: 26px 34px; } }
.inc-lista { list-style: none; margin: 0; padding: 0; }
.inc-lista li { position: relative; padding-left: 30px; font-size: 16px; line-height: 1.5; color: var(--tinta); }
.inc-lista li + li { margin-top: 14px; }
.inc-lista li::before { content: ''; position: absolute; left: 0; top: calc(.75em - 6px); width: 12px; height: 12px; background: var(--laranja); }
.inc-lista li:not(:last-child)::after { content: ''; position: absolute; left: 5px; top: .75em; height: calc(100% + 14px); border-left: 2px dashed var(--laranja); }
.inc-nota { display: flex; gap: 8px; align-items: center; justify-content: center; max-width: 760px; margin: 12px auto 0; font-size: 14px; color: var(--tinta-2); text-align: left; }
.inc-nota .ic { flex: none; color: var(--ouro-t); }

.dest-grade { display: grid; gap: 16px; margin-top: 18px; }
@media (min-width: 900px) { .dest-grade { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.dest { position: relative; min-height: 360px; border-radius: 3px; overflow: hidden; display: flex; background-color: var(--azul); color: #fff; isolation: isolate; }
.dest .dest-foto { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -2; }
.dest::before { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; background: linear-gradient(180deg, rgba(0, 76, 110, .15) 0%, rgba(0, 60, 88, .55) 45%, rgba(0, 40, 60, .94) 100%); }
.dest-in { margin-top: auto; padding: 26px 24px 24px; display: flex; flex-direction: column; gap: 6px; }
.dest-tag { position: absolute; top: 14px; right: 14px; padding: 3px 9px; background: rgba(0, 20, 30, .6); border: 1px solid rgba(255, 255, 255, .55); font-family: var(--f-tit); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; font-weight: 600; border-radius: 2px; }
.dest-ico { width: 42px; height: 42px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .45); display: grid; place-items: center; margin-bottom: 6px; color: var(--ouro); }
.dest h3 { font-weight: 700; font-size: 23px; line-height: 1.15; }
.dest p { margin: 0; font-size: 15px; color: rgba(255, 255, 255, .9); }
.dest .dest-nota { margin-top: 6px; font-size: 12.5px; color: var(--ouro-c); }

.numeros { list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 18px; background: var(--creme-2); border: 1px solid var(--linha); }
@media (min-width: 600px) { .numeros { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .numeros { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.numeros li { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 22px 10px; text-align: center; border: 1px solid var(--linha); margin: -1px 0 0 -1px; }
.numeros .ico { color: var(--ouro-t); }
.numeros span { font-family: var(--f-tit); font-size: 12px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--tinta-2); line-height: 1.5; }

/* ---------------------------------------------------------------------
   04 · PACOTES (cartões com foto)
   --------------------------------------------------------------------- */
.pac-grade { display: grid; gap: 20px; }
@media (min-width: 980px) { .pac-grade { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.pac { display: flex; flex-direction: column; background: rgba(0, 40, 60, .25); border: 1px solid rgba(255, 255, 255, .14); border-radius: 3px; overflow: hidden; }
.pac-foto { position: relative; aspect-ratio: 16 / 10; max-width: 100%; background-color: var(--azul-2); }
.pac-dias { position: absolute; left: 14px; bottom: 14px; z-index: 2; padding: 6px 12px; background: rgba(0, 40, 60, .82); font-family: var(--f-tit); font-weight: 600; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; border-radius: 2px; }
.pac-dias b { color: var(--ouro); font-size: 20px; letter-spacing: 0; margin-right: 4px; }
.pac-corpo { padding: 24px 24px 26px; display: flex; flex-direction: column; flex: 1; }
.pac-mod { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font-family: var(--f-tit); font-size: 12px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: #A8F0E4; }
.pac-tit { font-weight: 700; font-size: 26px; line-height: 1.1; letter-spacing: -.01em; }
.pac-per { margin: 6px 0 14px; font-family: var(--f-tit); font-weight: 600; font-size: 16.5px; color: var(--ouro-c); }
.pac-prop { color: rgba(255, 255, 255, .9); font-size: 15.5px; }
.pac-lista { list-style: none; display: grid; gap: 8px; margin-bottom: 18px; }
.pac-lista li { position: relative; padding-left: 18px; font-size: 14px; color: rgba(255, 255, 255, .9); }
.pac-hotel { display: grid; gap: 6px; margin: -6px 0 18px; padding: 10px 12px; border-left: 3px solid var(--ouro); background-color: rgba(255, 255, 255, .07); }
.pac-hotel div { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 8px; }
.pac-hotel dt { font-family: var(--f-tit); font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--ouro-c); }
.pac-hotel dd { margin: 0; font-size: 14.5px; font-weight: 600; color: #fff; }
.pac-lista li::before { content: ''; position: absolute; left: 2px; top: .62em; width: 6px; height: 6px; background: var(--ouro); transform: rotate(45deg); }
.pac-precos { margin: auto 0 20px; padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, .14); }
.pac-precos-t { margin: 0 0 6px; font-family: var(--f-tit); font-size: 12px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: #A8F0E4; }
.pac-precos ul { list-style: none; }
.pac-precos li { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 6px 0; }
.pac-precos li span { color: rgba(255, 255, 255, .85); font-size: 15px; }
.pac-precos strong { font-family: var(--f-tit); font-weight: 700; font-size: 22px; font-variant-numeric: tabular-nums; }
.pac-parc { margin: 8px 0 0; font-size: 13px; color: rgba(255, 255, 255, .88); }
.pac-btn { width: 100%; }

/* régua de períodos (sobre azul) */
.regua { margin: 26px 0 0; padding: 22px 18px 18px; background: rgba(0, 40, 60, .3); border: 1px solid rgba(255, 255, 255, .12); border-radius: 3px; }
.regua-leg { font-size: 13px; color: rgba(255, 255, 255, .88); margin-bottom: 14px; }
.reg-cab { display: grid; margin-bottom: 6px; }
.reg-dia { display: flex; flex-direction: column; align-items: center; line-height: 1.05; padding: 4px 0; border-left: 1px dashed rgba(255, 255, 255, .18); }
.reg-dia:first-child { border-left: 0; }
.reg-sem { font-size: 12px; text-transform: uppercase; letter-spacing: .1em; color: rgba(255, 255, 255, .7); font-weight: 600; }
.reg-num { font-family: var(--f-tit); font-weight: 700; font-size: 20px; }
.reg-linhas { list-style: none; display: grid; gap: 12px; }
.reg-linha { display: grid; gap: 4px; }
.reg-nome { font-size: 13.5px; font-weight: 600; }
.reg-nome small { font-weight: 400; color: rgba(255, 255, 255, .85); margin-left: 6px; font-size: 12.5px; }
.reg-trilho { display: grid; align-items: center; min-height: 34px; background: rgba(255, 255, 255, .06); border-radius: 999px; }
.reg-barra { display: flex; align-items: center; justify-content: space-between; gap: 6px; height: 30px; padding: 0 12px; border-radius: 999px; font-size: 12.5px; font-weight: 700; color: var(--azul-x); min-width: 0; }
.reg-diarias { font-family: var(--f-tit); text-transform: uppercase; letter-spacing: .08em; font-size: 12px; white-space: nowrap; }
.reg-ponta { display: none; white-space: nowrap; }
.reg-rec4 .reg-barra { background: var(--tq); }
.reg-rod3 .reg-barra { background: var(--ouro); }
.reg-rod4 .reg-barra { background: var(--coral); }
@media (min-width: 560px) { .reg-ponta { display: inline; } }
@media (min-width: 900px) {
  .regua { padding: 24px 28px; }
  .reg-cab { margin-left: 266px; }
  .reg-linha { grid-template-columns: 250px minmax(0, 1fr); gap: 16px; align-items: center; }
  .reg-nome small { display: block; margin: 2px 0 0; }
}

/* ---------------------------------------------------------------------
   05 · CONFIGURADOR
   --------------------------------------------------------------------- */
.cfg-nojs { background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .14); border-radius: 3px; padding: 20px; }
.cfg-nojs a { color: var(--ouro); }
.cfg { display: grid; gap: 24px; }
@media (min-width: 1024px) { .cfg { grid-template-columns: minmax(0, 1fr) 380px; gap: 32px; align-items: start; } }
.cfg-form { min-width: 0; display: grid; gap: 18px; }
.cfg-passo { position: relative; border: 1px solid rgba(255, 255, 255, .12); background: rgba(255, 255, 255, .04); border-radius: 4px; margin: 0; padding: 20px 18px 22px; min-width: 0; }
@media (min-width: 768px) { .cfg-passo { padding: 24px 26px 26px; } }
.cfg-passo legend { float: left; width: 100%; display: flex; align-items: center; gap: 12px; padding: 0; margin: 0 0 16px; font-family: var(--f-tit); font-weight: 600; font-size: 21px; }
.cfg-n { width: 34px; height: 34px; border-radius: 50%; border: 1.5px solid var(--ouro-c); color: #fff; display: inline-grid; place-items: center; font-size: 15px; font-weight: 600; flex-shrink: 0; }
.cfg-dica-topo { display: none; position: absolute; top: 32px; right: 26px; font-family: var(--f-tit); font-size: 12px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: rgba(255, 255, 255, .8); }
@media (min-width: 768px) { .cfg-dica-topo { display: block; } }
.cfg-ops { display: grid; gap: 12px; clear: both; }
@media (min-width: 640px) { .cfg-ops-2 { grid-template-columns: 1fr 1fr; } }
@media (min-width: 768px) { .cfg-ops-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.cfg-dica { display: flex; gap: 10px; align-items: flex-start; margin: 14px 0 0; font-size: 14px; color: rgba(255, 255, 255, .8); }
.cfg-dica .ic { width: 18px; height: 18px; margin-top: 2px; color: var(--ouro); }

.op { position: relative; z-index: 0; display: flex; gap: 12px; padding: 16px 16px 16px 18px; cursor: pointer; color: #fff; }
.op input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.op-corpo { display: flex; flex-direction: column; gap: 3px; min-width: 0; flex: 1; }
.op-corpo::before {
  content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; border-radius: 3px;
  background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .16); transition: border-color .15s, background-color .15s;
}
.op:hover .op-corpo::before { border-color: rgba(255, 255, 255, .4); }
.op input:checked ~ .op-corpo::before { border: 2px solid var(--ouro); background: rgba(242, 193, 78, .1); }
.op input:focus-visible ~ .op-corpo::before { outline: 3px solid var(--ouro); outline-offset: 3px; }
.op-marca { width: 22px; height: 22px; border-radius: 50%; border: 1.5px solid rgba(255, 255, 255, .45); display: grid; place-items: center; flex-shrink: 0; color: transparent; }
.op-opc .op-marca { border-radius: 5px; }
.op input:checked ~ .op-marca { background: var(--ouro); border-color: var(--ouro); color: var(--azul-x); }
.op-tit { font-family: var(--f-tit); font-weight: 600; font-size: 18px; line-height: 1.2; }
.op-fmt { font-family: var(--f-txt); font-size: 12px; font-weight: 600; color: var(--tq-c); margin-left: 4px; white-space: nowrap; }
.op-sub { font-size: 13.5px; color: rgba(255, 255, 255, .85); }
.op-preco { font-size: 14.5px; font-weight: 600; color: var(--ouro); margin-top: 2px; }
.op-cond .op-preco { font-family: var(--f-tit); font-size: clamp(18px, 1.6vw, 21px); }
.op .op-preco.vazio { font-family: var(--f-txt); font-size: 13.5px; font-weight: 400; color: rgba(255, 255, 255, .82); }
.op-precos { display: grid; gap: 2px; margin-top: 8px; padding-top: 8px; border-top: 1px solid rgba(255, 255, 255, .12); font-size: 13.5px; }
.op-precos-t { font-size: 12px; text-transform: uppercase; letter-spacing: .14em; color: rgba(255, 255, 255, .82); font-weight: 600; }
.op-pl { display: flex; justify-content: space-between; gap: 8px; }
.op-pl strong { color: var(--ouro-c); white-space: nowrap; font-variant-numeric: tabular-nums; }
.op-compat { font-size: 13px; margin-top: 4px; color: rgba(255, 255, 255, .75); }
.op-compat:empty { display: none; }
.compat-dentro { color: var(--tq-c); }
.compat-antes, .compat-depois { color: var(--ouro); font-weight: 600; }

.cfg-resumo { position: relative; }
@media (min-width: 1024px) { .cfg-resumo { position: -webkit-sticky; position: sticky; top: calc(var(--topo-h) + 16px + env(safe-area-inset-top, 0px)); } }
.rs-in { background: var(--azul-xx); border: 1px solid rgba(255, 255, 255, .14); border-radius: 4px; padding: 22px 20px; box-shadow: 0 24px 50px -24px rgba(0, 0, 0, .55); }
.rs-titulo { margin: 0 0 2px; font-family: var(--f-tit); font-size: 12px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--ouro); }
.rs-nome { margin: 0 0 12px; font-family: var(--f-tit); font-weight: 700; font-size: 22px; line-height: 1.2; }
.rs-lista { margin: 0; border-top: 1px solid rgba(255, 255, 255, .12); }
.rs-l { display: flex; justify-content: space-between; gap: 14px; padding: 8px 0; border-bottom: 1px solid rgba(255, 255, 255, .08); }
.rs-l dt { font-size: 13px; color: rgba(255, 255, 255, .8); flex-shrink: 0; }
.rs-l dd { margin: 0; text-align: right; font-weight: 600; font-size: 13.5px; }
.rs-vazio dd { color: rgba(255, 255, 255, .78); font-weight: 400; font-style: italic; }
.rs-valor { margin: 16px 0; padding: 16px 16px 14px; border: 1px solid rgba(255, 255, 255, .14); background: rgba(255, 255, 255, .05); border-radius: 3px; text-align: center; }
.rs-valor-rot { margin: 0 0 2px; font-family: var(--f-tit); font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--ouro); font-weight: 600; }
.rs-valor-num { margin: 0; font-family: var(--f-tit); font-weight: 700; font-size: 38px; line-height: 1.1; font-variant-numeric: tabular-nums; }
.rs-valor-num small { font-size: 17px; font-weight: 500; color: rgba(255, 255, 255, .8); }
.rs-valor-tot { margin: 6px 0 0; font-size: 13px; color: rgba(255, 255, 255, .75); }
.rs-valor-nota { display: flex; gap: 6px; align-items: center; justify-content: center; margin: 8px 0 0; font-size: 12px; color: rgba(255, 255, 255, .7); }
.rs-valor-vazio .rs-valor-rot { margin: 0; font-size: 12px; letter-spacing: .08em; }
.rs-comp, .rs-ops { margin: 0 0 16px; }
.rs-comp-t { font-family: var(--f-tit); font-size: 12px; text-transform: uppercase; letter-spacing: .18em; font-weight: 600; color: var(--ouro); margin-bottom: 6px; }
.rs-tab { width: 100%; border-collapse: collapse; font-size: 13px; font-variant-numeric: tabular-nums; }
.rs-tab th, .rs-tab td { text-align: left; padding: 7px 4px; border-bottom: 1px solid rgba(255, 255, 255, .08); }
.rs-tab thead th { font-size: 12px; text-transform: uppercase; letter-spacing: .1em; color: rgba(255, 255, 255, .8); font-weight: 600; }
.rs-tab td:last-child, .rs-tab thead th:last-child { text-align: right; }
.rs-tab td:last-child { font-weight: 700; white-space: nowrap; }
.rs-tab tr.on th, .rs-tab tr.on td { color: var(--ouro); }
.rs-comp-n { margin: 6px 0 0; font-size: 12px; color: rgba(255, 255, 255, .8); }
.rs-ops ul { list-style: none; display: grid; gap: 8px; }
.rs-ops li { display: flex; flex-direction: column; font-size: 14px; }
.rs-op-n { font-size: 12.5px; color: rgba(255, 255, 255, .7); }
.rs-op-antes, .rs-op-depois { color: var(--ouro); font-weight: 600; }
.rs-cta { width: 100%; }
.rs-limpar { display: block; margin: 10px auto 0; background: none; border: 0; color: rgba(255, 255, 255, .7); text-decoration: underline; cursor: pointer; font-size: 13.5px; padding: 6px; }
.rs-aviso { margin: 10px 0 0; font-size: 12px; color: rgba(255, 255, 255, .8); text-align: center; }

/* ---------------------------------------------------------------------
   06 · PROGRAMAÇÃO
   --------------------------------------------------------------------- */
.aviso-prog { display: flex; gap: 12px; align-items: flex-start; margin: 0 auto 28px; padding: 14px 18px; background: var(--creme); border-left: 4px solid var(--ouro); color: var(--tinta); max-width: 860px; font-size: 15px; }
.aviso-prog .ic { margin-top: 2px; color: var(--ouro-t); flex-shrink: 0; }
.rt-caixa { background: var(--branco); border: 1px solid var(--linha); border-radius: 3px; padding: 20px 16px 16px; box-shadow: var(--sombra); }
@media (min-width: 768px) { .rt-caixa { padding: 26px 28px 20px; } }
.rt-t { margin: 0 0 12px; font-family: var(--f-tit); font-weight: 700; font-size: 20px; color: var(--azul); }
.rt-t span { display: block; font-family: var(--f-txt); font-weight: 400; font-size: 13.5px; color: var(--tinta-2); }
.rt-rolagem { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.rt { width: 100%; min-width: 680px; border-collapse: collapse; font-size: 14.5px; }
.rt th, .rt td { padding: 12px 10px; text-align: left; border-bottom: 1px solid var(--linha); vertical-align: middle; }
.rt thead th { font-family: var(--f-tit); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--tinta-2); font-weight: 600; }
.rt-dia b { display: block; font-family: var(--f-tit); font-size: 18px; color: var(--azul); }
.rt-dia small { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--tinta-2); font-weight: 600; }
.rt-prog { color: var(--tinta); }
.rt-p, .rt-st { text-align: center !important; }
.rt-rot { display: none; }
/* celular: cada dia vira um bloco (data e programa em cima, as três
   modalidades embaixo com o nome ao lado do status); sem rolagem lateral */
@media (max-width: 599px) {
  .rt { min-width: 0; }
  .rt thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
  .rt, .rt tbody, .rt tr, .rt th, .rt td { display: block; }
  .rt tr { padding: 12px 0; border-bottom: 1px solid var(--linha); }
  .rt th, .rt td { padding: 0; border: 0; }
  .rt-dia { display: flex !important; align-items: baseline; gap: 10px; }
  .rt-dia b { display: inline; font-size: 17px; }
  .rt-prog { margin: 4px 0 8px; }
  .rt-st { display: flex !important; align-items: center; justify-content: space-between; gap: 10px; padding: 3px 0 !important; text-align: left !important; }
  .rt-rot { display: block; font-size: 13.5px; color: var(--tinta-2); }
}
.st { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; letter-spacing: .03em; white-space: nowrap; }
.st-periodo { background: #DFF5F1; color: #0A5E50; }
.st-fonte { background: var(--azul); color: #fff; }
.st-confirmar { background: #FFEDB5; color: #5C4100; }
.st-outro { background: #EEE9DE; color: var(--tinta-2); }
.st-fora { background: transparent; color: var(--tinta-2); box-shadow: inset 0 0 0 1px #CFC8B8; }
.legenda { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 14px; font-size: 13px; color: var(--tinta-2); }
.lg { display: inline-flex; align-items: center; gap: 6px; }
.lg::before, .mini { content: ''; width: 11px; height: 11px; border-radius: 50%; flex-shrink: 0; display: inline-block; }
.lg-periodo::before, .mini-periodo { background: var(--tq); }
.lg-fonte::before, .mini-fonte { background: var(--azul); }
.lg-confirmar::before, .mini-confirmar { background: var(--ouro); box-shadow: inset 0 0 0 2px #B8860B; }
.lg-outro::before, .mini-outro { background: transparent; box-shadow: inset 0 0 0 2px #8C99A6; }
.lg-fora::before, .mini-fora { background: #D9D2C3; }

.lug-grade { display: grid; gap: 16px; margin: 22px 0; }
@media (min-width: 600px) { .lug-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .lug-grade { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.lug { position: relative; min-height: 380px; border-radius: 3px; overflow: hidden; display: flex; background-color: var(--azul-2); color: #fff; isolation: isolate; }
.lug .foto { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -2; }
.lug::before { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; background: linear-gradient(180deg, rgba(0, 40, 60, .05) 15%, rgba(0, 40, 60, .62) 42%, rgba(0, 30, 45, .96) 100%); }
.lug-in { margin-top: auto; padding: 22px 20px 22px; }
.lug-data { display: inline-block; margin: 0 0 6px; padding: 2px 8px; border-radius: 2px; background: rgba(0, 25, 38, .8); font-family: var(--f-tit); font-size: 12px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--ouro-c); }
.lug h3 { font-weight: 700; font-size: 28px; line-height: 1.05; }
.lug-reg { margin: 2px 0 10px; font-size: 12px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: rgba(255, 255, 255, .78); }
.lug-txt { margin: 0; font-size: 14.5px; color: rgba(255, 255, 255, .92); }
.lug-nota { margin: 8px 0 0; font-size: 12.5px; color: var(--ouro-c); }

.rota { background: var(--azul-d); color: #fff; border-radius: 3px; padding: 24px; margin-bottom: 40px; }
.rota-t { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 20px; }
.rota-t .ic { color: var(--tq); }
.rota-linha { list-style: none; margin: 18px 0 14px; }
.rota-linha li { position: relative; padding: 0 0 18px 34px; display: flex; flex-direction: column; }
.rota-linha li::before { content: ''; position: absolute; left: 0; top: 3px; width: 16px; height: 16px; border-radius: 50%; border: 4px solid var(--tq); background: var(--azul-d); z-index: 1; }
.rota-linha li::after { content: ''; position: absolute; left: 6px; top: 12px; bottom: -3px; width: 4px; background: var(--tq); }
.rota-linha li:last-child::after { display: none; }
.rota-linha li:nth-child(3)::before { border-color: var(--ouro); }
.rota-p { font-family: var(--f-tit); font-weight: 600; font-size: 16px; }
.rota-d { font-size: 13.5px; color: rgba(255, 255, 255, .8); }
.rota-n { margin: 0; font-size: 13px; color: var(--ouro-c); }
@media (min-width: 900px) {
  .rota { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 8px 32px; align-items: start; padding: 28px 32px; }
  .rota-linha { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; }
  .rota-linha li { padding: 28px 16px 0 0; }
  .rota-linha li::before { top: 0; left: 0; }
  .rota-linha li::after { left: 16px; right: 0; top: 6px; bottom: auto; width: auto; height: 4px; }
  .rota-n { grid-column: 2; }
}

.prog-cab { display: flex; flex-wrap: wrap; gap: 14px 24px; align-items: flex-end; justify-content: space-between; margin-bottom: 16px; }
.prog-cab-t { font-weight: 700; font-size: 24px; color: var(--azul); }
.prog-cab-t span { display: block; font-family: var(--f-txt); font-weight: 400; font-size: 13.5px; color: var(--tinta-2); }
.prog-ctrl { display: flex; flex-wrap: wrap; gap: 10px 22px; align-items: flex-end; }
.filtro { border: 0; margin: 0; padding: 0; min-width: 0; }
.filtro legend { padding: 0; margin-bottom: 8px; font-family: var(--f-tit); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .18em; color: var(--tinta-2); }
.filtro-ops { display: flex; flex-wrap: wrap; gap: 8px; }
.filtro label { position: relative; cursor: pointer; }
.filtro input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.filtro span { display: inline-flex; align-items: center; min-height: 38px; padding: 7px 14px; border-radius: 2px; border: 1.5px solid var(--azul); color: var(--azul); font-family: var(--f-tit); font-weight: 600; font-size: 13.5px; background: var(--branco); }
.filtro input:checked + span { background: var(--azul); color: #fff; }
.filtro input:focus-visible + span { outline: 3px solid var(--tq-d); outline-offset: 3px; }

.prog { display: grid; gap: 10px; }
.dia { background: var(--branco); border: 1px solid var(--linha); border-radius: 3px; }
.dia[open] { border-color: rgba(36, 191, 167, .6); }
.dia > summary { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 14px; align-items: center; padding: 16px 18px; cursor: pointer; list-style: none; }
.dia > summary::-webkit-details-marker { display: none; }
.dia-quando { grid-column: 1; font-family: var(--f-tit); font-weight: 600; font-size: 13px; letter-spacing: .18em; text-transform: uppercase; color: var(--azul); }
.dia-chamada { grid-column: 1; font-size: 14.5px; color: var(--tinta-2); }
.dia-minis { display: none; gap: 5px; }
.dia-mais { grid-column: 2; grid-row: 1 / span 2; width: 16px; height: 16px; position: relative; }
.dia-mais::before, .dia-mais::after { content: ''; position: absolute; left: 0; right: 0; top: 7px; height: 2px; background: var(--ouro-t); transition: transform .2s; }
.dia-mais::after { transform: rotate(90deg); }
.dia[open] .dia-mais::after { transform: rotate(0); }
@media (min-width: 700px) {
  .dia > summary { grid-template-columns: 210px minmax(0, 1fr) auto auto; padding: 16px 22px; }
  .dia-quando, .dia-chamada { grid-column: auto; }
  .dia-minis { display: inline-flex; }
  .dia-mais { grid-column: auto; grid-row: auto; }
}
.dia-corpo { padding: 0 18px 20px; }
@media (min-width: 700px) { .dia-corpo { padding: 0 22px 24px 246px; } }
.bloco { border-top: 1px dashed rgba(0, 76, 110, .2); padding-top: 14px; margin-top: 2px; }
.bloco + .bloco { margin-top: 18px; }
.bloco-trecho { margin: 0 0 10px; font-family: var(--f-tit); font-weight: 600; font-size: 12px; text-transform: uppercase; letter-spacing: .14em; color: var(--tq-t); }
.aplic { list-style: none; display: grid; gap: 6px; margin-bottom: 8px; }
.ap { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 10px; align-items: baseline; font-size: 13.5px; }
.ap-st { grid-row: 1; grid-column: 1; display: inline-block; padding: 2px 9px; border-radius: 999px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; }
.ap-nome { grid-row: 1; grid-column: 2; font-weight: 600; }
.ap-nota { grid-column: 2; font-size: 13px; color: var(--tinta-2); display: none; }
.ap-periodo .ap-st { background: #DFF5F1; color: #0A5E50; }
.ap-fonte .ap-st { background: var(--azul); color: #fff; }
.ap-confirmar .ap-st { background: #FFEDB5; color: #5C4100; }
.ap-outro .ap-st { background: #EEE9DE; color: var(--tinta-2); }
.ap-fora .ap-st { background: transparent; color: var(--tinta-2); box-shadow: inset 0 0 0 1px #CFC8B8; }
.ap-fora .ap-nome { color: var(--tinta-2); font-weight: 400; }
.ap-confirmar .ap-nota, .ap-fonte .ap-nota, .ap-outro .ap-nota { display: block; }
.prog[data-filtro="rec4"] .ap:not([data-prod="rec4"]),
.prog[data-filtro="rod3"] .ap:not([data-prod="rod3"]),
.prog[data-filtro="rod4"] .ap:not([data-prod="rod4"]) { display: none; }
.prog:not([data-filtro="todos"]) .ap .ap-nota { display: block; }
.prog:not([data-filtro="todos"]) .ap { font-size: 14.5px; }
.prog[data-filtro="rec4"] .mini:not([data-prod="rec4"]),
.prog[data-filtro="rod3"] .mini:not([data-prod="rod3"]),
.prog[data-filtro="rod4"] .mini:not([data-prod="rod4"]) { display: none; }
.prog[data-filtro="rec4"] .bloco:is([data-st-rec4="fora"], [data-st-rec4="outro"]) .itens,
.prog[data-filtro="rod3"] .bloco:is([data-st-rod3="fora"], [data-st-rod3="outro"]) .itens,
.prog[data-filtro="rod4"] .bloco:is([data-st-rod4="fora"], [data-st-rod4="outro"]) .itens { opacity: .45; }
.itens { list-style: none; margin-top: 6px; }
.it { display: grid; grid-template-columns: 74px minmax(0, 1fr); gap: 12px; padding: 10px 0; border-bottom: 1px solid rgba(0, 76, 110, .07); }
.it:last-child { border-bottom: 0; }
.it-hora { font-family: var(--f-tit); font-weight: 700; font-size: 17px; line-height: 1.25; display: flex; flex-direction: column; color: var(--azul); }
.it-hora .ast { color: var(--rosa-t); }
.it-madr { font-family: var(--f-txt); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--rosa-t); margin-top: 2px; }
.it-txt { font-size: 15.5px; }
.it-det { display: block; font-size: 14px; color: var(--tinta-2); margin-top: 3px; }
.it-praia .it-hora { color: var(--tq-t); }
.it-bloco .it-hora { color: #B3400F; }
.it-noite .it-hora { color: var(--rosa-t); }
.prog-ast { display: flex; gap: 10px; align-items: flex-start; margin: 14px 0 0; font-size: 14px; color: var(--tinta-2); }
.prog-ast .ic { margin-top: 2px; flex-shrink: 0; }

/* ---------------------------------------------------------------------
   COMO VOCÊ CHEGA
   --------------------------------------------------------------------- */
.tr-grade { display: grid; gap: 18px; }
@media (min-width: 900px) { .tr-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.tr { background: var(--branco); border: 1px solid var(--linha); border-radius: 3px; padding: 24px 22px; box-shadow: var(--sombra); }
.tr-cab { display: flex; align-items: center; gap: 14px; }
.tr-ico { width: 52px; height: 52px; border-radius: 50%; background: var(--azul); color: #fff; display: grid; place-items: center; flex-shrink: 0; }
.tr-cab h3 { font-weight: 700; font-size: 24px; color: var(--azul); line-height: 1.1; }
.tr-cab p { margin: 2px 0 0; font-family: var(--f-tit); font-size: 12px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--ouro-t); }
.tr-prods { margin: 14px 0 6px; font-size: 13.5px; color: var(--tinta-2); }
.tr-lista { margin: 0; }
.tr-l { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 12px; padding: 11px 0; border-top: 1px solid var(--linha); align-items: baseline; }
.tr-l dt { font-family: var(--f-tit); font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--tinta-2); }
.tr-l dd { margin: 0; font-family: var(--f-tit); font-weight: 600; font-size: 16px; color: var(--azul); }
/* embarque e retorno do rodoviário (quando informados em data.rodoviario) */
.tr-emb { margin-top: 14px; }
.tr-emb-t { font-weight: 700; font-size: 18px; color: var(--azul); margin-bottom: 6px; }
.tr-emb-op + .tr-emb-op { margin-top: 16px; padding-top: 12px; border-top: 2px solid var(--linha); }
.tr-emb-prod { margin: 0 0 6px; font-family: var(--f-tit); font-weight: 600; font-size: 14px; color: var(--ouro-t); }
.tr-emb-b + .tr-emb-b { margin-top: 10px; }
.tr-emb-sub { margin: 0 0 2px; font-family: var(--f-tit); font-size: 12px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--tq-t); }
.tr-emb-pend { margin: 0; font-size: 15px; color: var(--tinta-2); }
.tr-emb-vei { margin: 12px 0 0; font-size: 15px; }
.tr-emb-ori { margin: 8px 0 0; padding-left: 18px; font-size: 14.5px; color: var(--tinta-2); display: grid; gap: 4px; }
.tr-l dd small { display: block; font-family: var(--f-txt); font-weight: 400; font-size: 12.5px; color: var(--tinta-2); }
.tr-pend dd { color: var(--ouro-t); font-weight: 500; font-style: italic; }

/* ---------------------------------------------------------------------
   08 · HOSPEDAGEM
   --------------------------------------------------------------------- */
.hotel { display: grid; gap: 28px; }
@media (min-width: 900px) { .hotel { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 48px; align-items: center; } }
.hotel-galeria { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.hg-item { margin: 0; border-radius: 3px; overflow: hidden; aspect-ratio: 4 / 3; max-width: 100%; position: relative; background-color: var(--creme); }
.hg-grande { grid-column: 1 / -1; aspect-ratio: 16 / 9; }
.hg-item img { width: 100%; height: 100%; object-fit: cover; }
.hg-item figcaption { position: absolute; left: 8px; bottom: 8px; padding: 3px 8px; border-radius: 2px; background-color: rgba(0, 20, 30, .62); font-family: var(--f-tit); font-size: 12px; font-weight: 600; color: #fff; }
.hotel-fotos-nota { font-size: 13.5px; color: var(--tinta-2); margin: 0 0 12px; }
/* com fotos: grande em cima e três quadrados embaixo (quarto, café, “+N”) */
.hotel-galeria.hg-fotos { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.hg-fotos .hg-item { aspect-ratio: 1 / 1; }
.hg-fotos .hg-grande { aspect-ratio: 16 / 9; }
.hg-link { display: block; width: 100%; height: 100%; color: #fff; text-decoration: none; }
.hg-fotos figcaption { pointer-events: none; }
.hg-link img { transition: transform .4s ease; }
.hg-link:hover img { transform: scale(1.04); }
.hg-link:focus-visible { outline: 3px solid #fff; outline-offset: -8px; border-radius: 3px; }
.hg-item:has(.hg-link:focus-visible) { box-shadow: 0 0 0 3px var(--tq-d); }
.hg-mais-in { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; background-color: rgba(0, 40, 60, .62); font-family: var(--f-tit); font-weight: 700; font-size: 15px; letter-spacing: .02em; transition: background-color .2s ease; }
.hg-mais:hover .hg-mais-in { background-color: rgba(0, 40, 60, .74); }
.hg-mais-ico { width: 52px; height: 52px; border-radius: 50%; border: 2px solid #fff; display: grid; place-items: center; }
@media (max-width: 479px) {
  .hg-fotos .hg-item:not(.hg-grande) figcaption { display: none; }
  .hg-mais-ico { width: 40px; height: 40px; }
  .hg-mais-ico .ic { width: 22px; height: 22px; }
  .hg-mais-in { font-size: 13px; gap: 6px; }
}
@media (prefers-reduced-motion: reduce) { .hg-link img, .hg-mais-in { transition: none; } .hg-link:hover img { transform: none; } }

/* janela com todas as fotos do hotel */
.hg-vis { width: min(1100px, calc(100% - 24px)); max-width: none; max-height: calc(100% - 24px); padding: 0; border: 0; background: transparent; color: #fff; overflow: visible; }
.hg-vis::backdrop { background: rgba(0, 18, 28, .93); }
.hg-vis :focus-visible { outline-color: var(--ouro); }
.hg-vis-topo { display: flex; align-items: center; gap: 14px; margin-bottom: 10px; }
.hg-vis-tit { margin: 0; font-family: var(--f-tit); font-weight: 700; font-size: 17px; }
.hg-vis-cont { margin: 0 auto 0 0; font-size: 14px; color: rgba(255, 255, 255, .8); font-variant-numeric: tabular-nums; }
.hg-vis-btn { width: 44px; height: 44px; flex: none; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .55); background: rgba(0, 20, 30, .7); color: #fff; display: grid; place-items: center; cursor: pointer; }
.hg-vis-btn:hover { background: rgba(0, 40, 60, .95); }
.hg-vis-palco { position: relative; }
.hg-vis-lista { list-style: none; margin: 0; padding: 0; }
.hg-vis-lista figure { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.hg-vis-lista img { display: block; width: auto; height: auto; max-width: 100%; max-height: calc(100vh - 150px); border-radius: 3px; }
.hg-vis-lista figcaption { font-family: var(--f-tit); font-weight: 600; font-size: 15px; }
.hg-vis-ant, .hg-vis-prox { position: absolute; top: 50%; margin-top: -38px; }
.hg-vis-ant { left: 8px; }
.hg-vis-ant .ic { transform: rotate(180deg); }
.hg-vis-prox { right: 8px; }
.hg-ph { background-color: var(--azul); background-image: linear-gradient(135deg, var(--azul-2), var(--azul-d)); color: rgba(255, 255, 255, .85); }
.hg-ph-in { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; text-align: center; padding: 12px; font-family: var(--f-tit); font-weight: 600; font-size: 15px; }
/* cabeçalho do hotel: bairro em destaque, nome e cidade logo abaixo */
.hotel-tit .tit-b { display: block; }
.hotel-cab-nome { margin: 16px 0 0; font-family: var(--f-tit); font-weight: 700; font-size: clamp(17px, 2vw, 21px); letter-spacing: .14em; text-transform: uppercase; color: var(--azul); }
.hotel-cab-sub { margin: 4px 0 0; font-size: 15.5px; color: var(--tinta-2); }
.hotel-nome { font-weight: 700; font-size: clamp(32px, 4vw, 44px); line-height: 1.05; color: var(--azul); }
.hotel-sub { margin: 6px 0 14px; font-family: var(--f-tit); font-weight: 600; font-size: 17px; color: var(--ouro-t); }
.hotel-desc { color: var(--tinta-2); }
.hotel-inc { list-style: none; display: grid; gap: 8px; margin: 16px 0; }
.hotel-inc li { display: flex; gap: 10px; align-items: center; font-weight: 600; }
.hotel-inc .ic { color: var(--tq-t); }
.hotel-nota { font-size: 14px; background: var(--creme-2); border-left: 3px solid var(--ouro); padding: 12px 14px; margin: 0; }

/* ---------------------------------------------------------------------
   09 · BALADAS (cartaz | texto, alternados)
   --------------------------------------------------------------------- */
.opc-lista { display: grid; gap: 22px; }
.opc { display: grid; background: var(--branco); border: 1px solid var(--linha); border-radius: 3px; overflow: hidden; box-shadow: var(--sombra); }
@media (min-width: 900px) {
  .opc { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); min-height: 380px; }
  .opc-inv .cartaz { order: 2; }
}
.cartaz {
  position: relative; display: flex; flex-direction: column; justify-content: flex-end; gap: 8px; min-height: 240px; padding: 28px 30px;
  background-color: var(--rosa-t); color: #fff; overflow: hidden;
  background-image: radial-gradient(circle at 18% 22%, rgba(255, 255, 255, .16) 0 3px, transparent 4px), radial-gradient(circle at 70% 64%, rgba(255, 212, 71, .5) 0 3px, transparent 4px);
  background-size: 60px 60px, 84px 84px;
}
.opc-1 .cartaz { background-color: var(--azul-d); }
.opc-2 .cartaz { background-color: var(--ouro); color: var(--azul-x); }
.cartaz-fmt { font-family: var(--f-tit); font-size: 12px; font-weight: 700; letter-spacing: .24em; text-transform: uppercase; }
.cartaz-nome { font-family: var(--f-tit); font-weight: 700; font-size: clamp(34px, 4.6vw, 54px); line-height: .98; letter-spacing: -.02em; text-transform: uppercase; max-width: 12ch; }
.cartaz-data { align-self: flex-start; margin-top: 6px; padding: 4px 10px; border: 1.5px solid currentColor; font-family: var(--f-tit); font-weight: 600; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; border-radius: 2px; }
.cartaz-x { position: absolute; top: 22px; right: 22px; display: flex; gap: 6px; }
.cartaz-x i { position: relative; width: 26px; height: 26px; }
.cartaz-x i::before, .cartaz-x i::after { content: ''; position: absolute; left: 50%; top: 0; width: 7px; height: 100%; margin-left: -3.5px; border-radius: 4px; background: var(--sol); transform: rotate(35deg); }
.cartaz-x i::after { transform: rotate(-35deg); }
.cartaz-x i:nth-child(2)::before, .cartaz-x i:nth-child(2)::after { background: var(--coral); }
.cartaz-x i:nth-child(3)::before, .cartaz-x i:nth-child(3)::after { background: var(--tq); }
.cartaz-seguro { background-color: var(--tq); color: var(--azul-x); align-items: flex-start; justify-content: center; }

/* cartaz com foto de fundo: foto nítida, sem véu; o texto fica num bloco de
   cor sólida (a cor de cada cartaz), que garante o contraste */
.cartaz.cartaz-com-foto { min-height: 400px; padding: 18px; }
@media (min-width: 900px) { .cartaz.cartaz-com-foto { padding: 24px; } }
.cartaz-foto { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 0; }
.cartaz-bloco { position: relative; z-index: 1; align-self: flex-start; max-width: 100%; display: flex; flex-direction: column; gap: 6px; padding: 16px 18px 18px; border-radius: 2px; background-color: var(--rosa-t); color: #fff; box-shadow: 0 10px 28px rgba(0, 0, 0, .28); }
.opc-1 .cartaz-bloco { background-color: var(--azul-d); }
.opc-2 .cartaz-bloco { background-color: var(--ouro); color: var(--azul-x); }
.cartaz-bloco .cartaz-nome { font-size: clamp(26px, 3vw, 38px); }
.cartaz-com-foto .cartaz-x { z-index: 1; filter: drop-shadow(0 1px 3px rgba(0, 0, 0, .45)); }
.opc-txt { padding: 30px 26px; display: flex; flex-direction: column; }
@media (min-width: 900px) { .opc-txt { padding: 40px 44px; } }
.opc-txt h3 { font-weight: 700; font-size: clamp(26px, 3vw, 34px); line-height: 1.08; color: var(--azul); }
.opc-sub { margin: 6px 0 10px; font-family: var(--f-tit); font-weight: 600; font-size: 17px; color: var(--ouro-t); }
.opc-data { display: flex; align-items: center; gap: 8px; font-family: var(--f-tit); font-weight: 600; font-size: 14px; color: var(--azul); }
.opc-txt > p:not(.opc-sub):not(.opc-data):not(.opc-quando) { color: var(--tinta-2); font-size: 15.5px; }
.opc-precos { display: flex; flex-wrap: wrap; gap: 10px; margin: 4px 0 14px; }
.opc-preco { border: 1px solid rgba(0, 76, 110, .2); padding: 8px 14px; border-radius: 2px; }
.opc-preco dt { font-family: var(--f-tit); font-size: 12px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--tinta-2); }
.opc-preco dd { margin: 2px 0 0; font-family: var(--f-tit); font-weight: 700; font-size: 22px; color: var(--ouro-t); font-variant-numeric: tabular-nums; }
.opc-quando { font-size: 13.5px; color: var(--tinta-2); padding-top: 12px; border-top: 1px solid var(--linha); }
.opc-quando b { color: var(--ouro-t); }
.btn-interesse { margin-top: auto; align-self: flex-start; border-color: var(--azul); color: var(--azul); }
.btn-interesse:hover { background: rgba(0, 97, 140, .08); }
.btn-interesse[aria-pressed="true"] { background: var(--azul); color: #fff; }
.btn-interesse .bi-on, .btn-interesse[aria-pressed="true"] .bi-off { display: none; }
.btn-interesse[aria-pressed="true"] .bi-on { display: inline; }
.opc-seguro { margin-top: 22px; }
.opc-seguro .cartaz { min-height: 200px; }


/* avisos de pagamento e validade, logo abaixo dos cartões de pacote */
.pac-notas { margin: 14px 0 0; padding-left: 18px; display: grid; gap: 6px; font-size: 14px; color: rgba(255, 255, 255, .82); max-width: 80ch; }

/* ---------------------------------------------------------------------
   11 · POR QUE (faixa com foto)
   --------------------------------------------------------------------- */
.porque { position: relative; padding: 96px 0 104px; color: #fff; background-color: var(--azul-d); overflow: hidden; isolation: isolate; }
.porque-foto { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -2; }
.porque-veu { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; background: linear-gradient(90deg, rgba(0, 40, 60, .95) 0%, rgba(0, 40, 60, .8) 50%, rgba(0, 40, 60, .25) 100%); }
.porque-in { position: relative; }
.porque-tit { max-width: 18ch; font-weight: 700; font-size: clamp(32px, 4.4vw, 52px); line-height: 1.06; letter-spacing: -.02em; text-wrap: balance; }
.porque-tit span { display: block; color: var(--ouro); }
.porque-lead { max-width: 58ch; margin-top: 20px; font-size: 17.5px; color: rgba(255, 255, 255, .9); }
.porque-lista { list-style: none; display: grid; gap: 22px; margin-top: 34px; max-width: 980px; }
@media (min-width: 700px) { .porque-lista { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.porque-lista li { display: flex; flex-direction: column; gap: 4px; padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, .28); }
.porque-lista .ico { color: var(--ouro); margin-bottom: 6px; }
.porque-lista strong { font-family: var(--f-tit); font-weight: 600; font-size: 19px; }
.porque-lista span { font-size: 15px; color: rgba(255, 255, 255, .85); }

/* ---------------------------------------------------------------------
   12 · INFORMAÇÕES E DÚVIDAS
   --------------------------------------------------------------------- */
.info-grade { display: grid; gap: 16px; margin-bottom: 36px; }
@media (min-width: 640px) { .info-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .info-grade { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.info { border-top: 3px solid var(--ouro); background: var(--creme-2); padding: 20px 20px 18px; }
.info h3 { font-weight: 600; font-size: 13px; letter-spacing: .2em; text-transform: uppercase; color: var(--azul); margin-bottom: 8px; }
.info p { margin: 0; font-size: 15px; color: var(--tinta-2); }
.faq { display: grid; gap: 10px; max-width: 960px; margin: 0 auto; }
.faq details { background: var(--branco); border: 1px solid var(--linha); border-radius: 3px; }
.faq details[open] { border-color: rgba(36, 191, 167, .6); }
.faq summary { position: relative; padding: 18px 52px 18px 20px; cursor: pointer; list-style: none; font-family: var(--f-tit); font-weight: 600; font-size: 14.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--azul); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::before, .faq summary::after { content: ''; position: absolute; right: 22px; top: 50%; width: 14px; height: 2px; margin-top: -1px; background: var(--ouro-t); transition: transform .2s; }
.faq summary::after { transform: rotate(90deg); }
.faq details[open] summary::after { transform: rotate(0); }
.faq-r { padding: 0 20px 18px; color: var(--tinta-2); }
.faq-r ul { padding-left: 18px; margin-bottom: 1em; }
.faq-r p:last-child { margin-bottom: 0; }
.avisos { max-width: 960px; margin: 28px auto 0; background: var(--azul-d); color: #fff; border-radius: 3px; padding: 22px 24px; }
.avisos h3 { display: flex; gap: 10px; align-items: center; font-weight: 700; font-size: 18px; margin-bottom: 12px; }
.avisos h3 .ico { color: var(--ouro); }
.avisos ul { padding-left: 18px; display: grid; gap: 8px; font-size: 14.5px; color: rgba(255, 255, 255, .88); }

/* ---------------------------------------------------------------------
   13 · CTA FINAL E RODAPÉ
   --------------------------------------------------------------------- */
.final { position: relative; color: #fff; text-align: center; background-color: var(--azul-d); overflow: hidden; isolation: isolate; }
.final-foto { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -2; }
.final-veu { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; background: linear-gradient(180deg, rgba(0, 40, 60, .78), rgba(0, 40, 60, .9)); }
.final-in { max-width: 900px; margin: 0 auto; padding: 96px var(--g) 88px; }
.final-kicker { font-family: var(--f-tit); font-weight: 600; font-size: 13px; letter-spacing: .24em; text-transform: uppercase; color: var(--tq-c); }
.final-titulo { font-weight: 700; font-size: clamp(34px, 5vw, 58px); line-height: 1.04; letter-spacing: -.025em; margin: 8px 0 18px; text-wrap: balance; }
.final-titulo span { display: block; color: var(--ouro); }
.final-txt { max-width: 58ch; margin: 0 auto 28px; font-size: 17.5px; color: rgba(255, 255, 255, .88); }
.final-ctas { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.final-mini { margin: 18px 0 0; font-family: var(--f-tit); font-size: 12px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: rgba(255, 255, 255, .65); }
.final-bordao { margin: 38px 0 0; font-family: var(--f-tit); font-weight: 600; font-size: clamp(22px, 3vw, 32px); color: var(--ouro-c); line-height: 1.3; }
.final-lt { display: inline-block; font-family: var(--f-letra); font-weight: 400; color: #fff; font-size: 1.15em; white-space: nowrap; }
.fx { font-weight: 400; display: inline-block; }
.fx1 { color: var(--sol); transform: rotate(-8deg); }
.fx2 { color: var(--coral); transform: rotate(6deg) translateY(-.04em); }
.fx3 { color: #FF7DB0; transform: rotate(-4deg); }
.final-nojs { margin-top: 18px; font-size: 14px; }

.rodape { background: var(--azul-d); color: rgba(255, 255, 255, .85); padding: 48px 0 calc(110px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid rgba(255, 255, 255, .08); }
@media (min-width: 900px) { .rodape { padding-bottom: 48px; } }
.rodape-in { max-width: var(--maxw); margin: 0 auto; padding: 0 var(--g); display: grid; gap: 22px; }
.rod-topo { display: grid; gap: 22px; align-items: center; }
@media (min-width: 900px) { .rod-topo { grid-template-columns: auto minmax(0, 1fr) auto; gap: 40px; } }
.rod-marca img { height: 34px; width: auto; margin: 0 0 10px; }
.rod-marca p { margin: 0; font-size: 14px; }
.rod-dados { list-style: none; display: grid; gap: 4px; font-size: 14px; }
.rod-dados span { color: var(--ouro); font-weight: 600; }
.rod-pend { display: flex; gap: 8px; align-items: flex-start; margin: 0; font-size: 13px; color: var(--ouro-c); }
.rod-cta { justify-self: start; }
.rod-legal { margin: 0; font-size: 12.5px; color: rgba(255, 255, 255, .78); max-width: 100ch; border-top: 1px solid rgba(255, 255, 255, .1); padding-top: 20px; }
.rod-cred { font-size: 12px; color: rgba(255, 255, 255, .78); margin: 0; }
.rod-cred summary { cursor: pointer; text-decoration: underline; }
.rod-cred ul { margin: 8px 0 0; padding-left: 18px; display: grid; gap: 3px; }

/* ---------------------------------------------------------------------
   BARRA DO CELULAR, BOTÃO FLUTUANTE E DEMONSTRAÇÃO DO WHATSAPP
   --------------------------------------------------------------------- */
.barra {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; background: var(--azul-xx); border-top: 1px solid rgba(255, 255, 255, .14);
  padding: 10px var(--g) calc(10px + env(safe-area-inset-bottom, 0px)); transform: translateY(110%); transition: transform .25s var(--ease);
}
.barra.visivel { transform: none; }
.barra-in { display: flex; align-items: center; gap: 12px; max-width: 680px; margin: 0 auto; }
.barra-resumo { display: flex; flex-direction: column; min-width: 0; flex: 1; text-decoration: none; color: #fff; }
/* o rótulo quebra em até duas linhas (nada cortado); o valor é curto */
.barra-val { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.barra-rot { font-size: 12px; line-height: 1.3; color: rgba(255, 255, 255, .75); }
.barra-val { font-family: var(--f-tit); font-weight: 700; font-size: 16px; color: var(--ouro); font-variant-numeric: tabular-nums; }
.barra-cta { flex-shrink: 0; min-height: 46px; padding: 10px 16px; }
@media (max-width: 379px) {
  .barra-cta { width: 52px; padding: 0; }
  .barra-cta span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
  .barra-val { font-size: 15px; }
}
@media (min-width: 900px) { .barra { display: none; } }
@media (prefers-reduced-motion: reduce) { .barra { transition: none; } }

.wa-flut {
  position: fixed; right: 24px; bottom: calc(24px + env(safe-area-inset-bottom, 0px)); z-index: 40; display: none; align-items: center; gap: 10px;
  padding: 12px 20px 12px 14px; border-radius: 999px; background: var(--verde); color: #fff;
  font-family: var(--f-tit); font-weight: 600; font-size: 14px; letter-spacing: .04em; text-decoration: none;
  box-shadow: 0 12px 30px -10px rgba(0, 0, 0, .45); opacity: 0; transform: translateY(20px); pointer-events: none; transition: opacity .25s, transform .25s;
}
.wa-flut.visivel { opacity: 1; transform: none; pointer-events: auto; }
@media (min-width: 900px) { .wa-flut { display: inline-flex; } }

.wa-demo { border: 0; padding: 0; border-radius: 6px; width: min(560px, calc(100% - 32px)); max-height: calc(100% - 32px); background: var(--branco); color: var(--tinta); box-shadow: 0 30px 80px -20px rgba(0, 0, 0, .6); }
.wa-demo::backdrop { background: rgba(0, 20, 30, .72); }
.wa-demo-in { padding: 24px 22px 22px; }
.wa-demo-tag { display: inline-block; margin: 0 0 8px; padding: 3px 10px; border-radius: 2px; background: var(--ouro); color: var(--azul-x); font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; }
.wa-demo h2 { font-weight: 700; font-size: 24px; line-height: 1.1; margin-bottom: 8px; color: var(--azul); }
.wa-demo-txt { font-size: 15px; color: var(--tinta-2); }
.wa-demo textarea { width: 100%; border: 1px solid var(--linha); border-radius: 3px; padding: 12px 14px; font: 13.5px/1.5 ui-monospace, 'Cascadia Mono', Consolas, monospace; background: var(--creme-2); color: var(--tinta); resize: vertical; }
.wa-demo-acoes { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0 10px; }
.wa-demo-n { margin: 0; font-size: 12.5px; color: var(--tinta-2); }

/* celular: menos espaço vazio entre e dentro das seções (devolutiva de 07/10/2026);
   textos, preços e conteúdo não mudam */
@media (max-width: 599px) {
  .sec { padding: 52px 0; }
  .sec-cab { margin-bottom: 30px; }
  .divisor { margin: 16px auto 14px; }
  .dest { min-height: 300px; }
  .lug { min-height: 320px; }
  .cartaz.cartaz-com-foto { min-height: 360px; }
  .porque { padding: 64px 0 68px; }
  .final-in { padding: 64px var(--g) 60px; }
}

@media print {
  .topo, .barra, .wa-flut, .revisao, .hero-midia, .faixa, .hero-pausa, .car-ctrl, .serp-canvas { display: none !important; }
  .cartaz-bloco { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}