@font-face {
  font-family: "Gobold Extra2";
  src: url("../fonts/gobold-extra2.woff2") format("woff2");
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Gobold Extra2";
  src: url("../fonts/gobold-extra2-italic.woff2") format("woff2");
  font-weight: 400 800;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Chantal;
  src: url("../fonts/chantal-medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Chantal;
  src: url("../fonts/chantal-bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --ocean-abyss: #041d3a;
  --ocean-navy: #082f57;
  --ocean-blue: #00aeef;
  --ocean-cyan: #29c3f5;
  --kriativa-purple: #7b1fa2;
  --kriativa-purple-deep: #57127a;
  --kriativa-magenta: #e5007e;
  --magenta-glow: #ff5aa8;
  --sunset-gold: #ffc20e;
  --sunset-deep: #f7941e;
  --action: #7b1fa2;
  --action-hover: #57127a;
  --action-ink: #7b1fa2;
  --action-strong: #57127a;
  --purple-glow: #e7a9f0;
  --foam-white: #ffffff;
  --mist-100: #eef4fb;
  --surface-0: #ffffff;
  --surface-1: #f2f6fc;
  --surface-2: #e7eef8;
  --surface-card: #ffffff;
  --dark-abyss: #041d3a;
  --dark-navy: #082f57;
  --dark-navy-2: #0a3a68;
  --tour-bg: var(--kriativa-purple-deep);
  --tour-surface: var(--kriativa-purple);
  --ink-invert: #ffffff;
  --ink-invert-soft: rgba(233, 242, 251, 0.80);
  --ink-invert-faint: rgba(233, 242, 251, 0.62);
  --line-invert: rgba(133, 201, 245, 0.20);
  --fill-invert: rgba(133, 201, 245, 0.06);
  --line-soft: rgba(13, 41, 78, 0.10);
  --line-mid: rgba(13, 41, 78, 0.16);
  --fill-soft: rgba(13, 41, 78, 0.04);
  --fill-mid: rgba(13, 41, 78, 0.07);
  --ink-strong: #0d2242;
  --ink-soft: rgba(13, 34, 66, 0.78);
  --ink-faint: rgba(13, 34, 66, 0.60);
  --ink-on-light: #14213d;
  --font-display: 'Gobold Extra2', 'Bricolage Grotesque', system-ui, sans-serif;
  --font-body: 'Montserrat', 'Hanken Grotesk', system-ui, sans-serif;
  --font-script: 'Chantal', 'Segoe Script', cursive;
  --r-sm: 6px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-pill: 6px;
  --sp-xs: 8px;
  --sp-sm: 16px;
  --sp-md: 24px;
  --sp-lg: 48px;
  --sp-xl: clamp(64px, 9vw, 120px);
  --container: 1200px;
  --gutter: clamp(20px, 5vw, 64px);
  --ease-quart: cubic-bezier(0.25, 1, 0.5, 1);
  --ease-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 120ms;
  --dur-state: 260ms;
  --dur-hero: 700ms;
  --glow-action: 0 12px 40px rgba(123, 31, 162, 0.45);
  --lift-card: 0 20px 60px rgba(8, 47, 87, 0.16);
  --z-nav: 100;
  --z-drawer: 200;
  --z-top: 300;
  --incl-navy: #031b35;
  --incl-paper: #f4f1e8;
  --incl-paper-ink: #082845;
  --incl-paper-copy: #35506a;
  --incl-coral: #f06b4f;
  --incl-coral-ink: #b64231;
  --incl-cyan: #29c3f5;
  --incl-rule-dark: rgba(238, 246, 252, 0.22);
  --incl-rule-light: rgba(4, 29, 58, 0.22);
  --incl-copy: rgba(244, 248, 252, 0.78);
  --incl-transition: 220ms var(--ease-quart);
}

*,
::before,
::after {
  box-sizing: border-box;
}

* {
  margin: 0px;
}

html {
  text-size-adjust: 100%;
  scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

body {
  font-family: var(--font-body);
  font-size: clamp(1rem, 0.96rem + 0.2vw, 1.125rem);
  line-height: 1.6;
  color: var(--ink-strong);
  background: var(--surface-0);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizelegibility;
  overflow-x: hidden;
}

img,
video {
  max-width: 100%;
  display: block;
  height: auto;
}

a {
  color: inherit;
}

button {
  font: inherit;
  color: inherit;
  cursor: pointer;
}

h1,
h2,
h3,
h4 {
  font-family: var(--font-display);
  font-weight: 800;
  line-height: 1.02;
  letter-spacing: 0.005em;
  text-wrap: balance;
}

.container {
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.section {
  padding-block: var(--sp-xl);
  position: relative;
}

.eyebrow {
  font-weight: 700;
  font-size: 0.8125rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--action-ink);
}

.eyebrow--urgent,
.section--dark .eyebrow--urgent,
.section--gradient .eyebrow--urgent {
  color: var(--magenta-glow);
}

.lead {
  color: var(--ink-soft);
  max-width: 62ch;
  font-size: 1.075rem;
}

.u-mt-md {
  margin-top: var(--sp-md);
}

.u-mt-lg {
  margin-top: var(--sp-lg);
}

.u-center {
  margin-inline: auto;
  text-align: center;
}

.u-lead-center {
  margin-inline: auto;
}

.u-lead-footnote {
  margin: var(--sp-md) auto 0;
  text-align: center;
}

.u-lead-tip {
  text-align: center;
  margin-top: var(--sp-lg);
}

.h2--sm {
  font-size: clamp(1.6rem, 3.5vw, 2.4rem);
}

.h2--md {
  font-size: clamp(1.8rem, 4vw, 2.8rem);
}

.link-action {
  color: var(--action-ink);
}

.link-action--bold {
  color: var(--action-ink);
  font-weight: 600;
}

.skip-link {
  position: absolute;
  left: var(--sp-sm);
  top: -60px;
  z-index: var(--z-top);
  background: var(--action);
  color: var(--foam-white);
  padding: 12px 20px;
  border-radius: var(--r-pill);
  font-weight: 700;
  text-decoration: none;
  transition: top var(--dur-state) var(--ease-quart);
}

.skip-link:focus {
  top: var(--sp-sm);
}

:focus-visible {
  outline: 2px solid var(--ocean-blue);
  outline-offset: 3px;
  border-radius: var(--r-sm);
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.55em;
  font-family: var(--font-body);
  font-weight: 700;
  letter-spacing: 0.01em;
  text-decoration: none;
  border-width: medium;
  border-style: none;
  border-color: currentcolor;
  border-image: initial;
  border-radius: var(--r-pill);
  padding: 16px 32px;
  transition: transform var(--dur-state) var(--ease-quart),
    background var(--dur-state) var(--ease-quart), box-shadow var(--dur-state) var(--ease-quart),
    border-color var(--dur-state) var(--ease-quart), color var(--dur-state) var(--ease-quart);
}

.btn--primary {
  background: var(--action);
  color: var(--foam-white);
}

.header-manual-link {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 8px 18px;
  border: 1px solid rgba(255, 255, 255, 0.85);
  border-radius: var(--r-pill, 6px);
  background: var(--foam-white, #ffffff);
  color: var(--action, #71206c);
  text-decoration: none;
  white-space: nowrap;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.16);
  transition: transform var(--dur-state) var(--ease-quart),
    background var(--dur-state) var(--ease-quart),
    box-shadow var(--dur-state) var(--ease-quart),
    border-color var(--dur-state) var(--ease-quart),
    color var(--dur-state) var(--ease-quart);
}

.header-manual-link:hover {
  background: #f0f4f8;
  border-color: #ffffff;
  color: var(--action-hover, #57127a);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.22);
}

.header-manual-link:focus-visible {
  outline: 3px solid var(--ocean-cyan);
  outline-offset: 3px;
}

.header-manual-link__icon {
  flex-shrink: 0;
  color: var(--action, #71206c);
  transition: transform var(--dur-state) var(--ease-quart), color var(--dur-state) var(--ease-quart);
}

.header-manual-link:hover .header-manual-link__icon {
  transform: scale(1.08);
  color: var(--action-hover, #57127a);
}

.header-manual-link__lines {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  text-align: left;
  line-height: 1.18;
}

.header-manual-link__sub {
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  color: rgba(113, 32, 108, 0.82);
  display: block;
}

.header-manual-link__title {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--action, #71206c);
  display: block;
  white-space: nowrap;
}

.header-manual-link__title strong {
  font-weight: 800;
  color: var(--action-hover, #57127a);
  letter-spacing: 0.01em;
}

.btn--primary:hover {
  background: var(--action-hover);
  color: var(--foam-white);
  transform: translateY(-2px);
  box-shadow: var(--glow-action);
}

.btn--primary:active {
  transform: translateY(0px);
}

.btn--disabled,
.btn[aria-disabled="true"],
.btn:disabled {
  cursor: not-allowed;
  pointer-events: none;
  background: #cbd5e1;
  color: #64748b;
  opacity: 0.65;
  box-shadow: none;
  transform: none;
}

.btn--disabled:hover,
.btn[aria-disabled="true"]:hover,
.btn:disabled:hover {
  background: #cbd5e1;
  color: #64748b;
  box-shadow: none;
  transform: none;
}

.btn--ghost {
  background: transparent;
  color: var(--action);
  border: 1px solid var(--line-mid);
}

.btn--ghost:hover {
  background: var(--fill-soft);
  border-color: var(--action);
}

.hero .btn--ghost {
  color: var(--foam-white);
  background: var(--ocean-abyss);
  border-color: rgba(255, 255, 255, 0.58);
}

.hero .btn--ghost:hover {
  background: var(--ocean-navy);
  border-color: rgba(255, 255, 255, 0.85);
}

.btn--lg {
  padding: 19px 44px;
  font-size: 1.0625rem;
}

.btn__wa {
  width: 1.15em;
  height: 1.15em;
  fill: currentcolor;
  flex: 0 0 auto;
}

.nav {
  position: fixed;
  top: 0px;
  left: 0px;
  right: 0px;
  z-index: var(--z-nav);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-md);
  padding: 14px var(--gutter);
  background: transparent;
  backdrop-filter: none;
  border-bottom: 1px solid transparent;
  transform: translateY(0px);
  opacity: 1;
  transition: background var(--dur-state) var(--ease-quart), backdrop-filter var(--dur-state) var(--ease-quart), border-color var(--dur-state) var(--ease-quart), transform var(--dur-state) var(--ease-quart), opacity var(--dur-state) var(--ease-quart);
}

.nav::before {
  content: "";
  position: absolute;
  inset: 0px;
  z-index: -1;
  pointer-events: none;
  background: transparent;
  opacity: 0;
  transition: opacity var(--dur-state) var(--ease-quart);
}

.nav[data-hidden="true"] {
  transform: translateY(-100%);
  opacity: 0;
  pointer-events: none;
  transition: transform var(--dur-state) var(--ease-quart), opacity var(--dur-state) var(--ease-quart), background var(--dur-state) var(--ease-quart), backdrop-filter var(--dur-state) var(--ease-quart), border-color var(--dur-state) var(--ease-quart);
}

.nav[data-scrolled="true"] {
  background: rgba(8, 57, 102, 0.98);
  backdrop-filter: blur(14px);
  border-bottom-color: rgba(255, 255, 255, 0.12);
}

.nav__brand {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}

.nav__brand img {
  height: 78px;
  width: auto;
}

/* A largura pode encolher no desktop sem comprimir a proporção da marca. */
.nav > .nav__brand {
  --nav-brand-height: 78px;
  min-height: var(--nav-brand-height);
  flex-shrink: 0;
}

.nav > .nav__brand img {
  height: auto;
  max-height: var(--nav-brand-height);
}

.nav__brand {
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--dur-state) var(--ease-quart);
}

.nav[data-scrolled="true"] .nav__brand {
  opacity: 1;
  pointer-events: auto;
}

.nav__links {
  display: flex;
  align-items: center;
  gap: 4px;
}

/* Primeira dobra: menu ocupa o espaço centralizado e seletor de idioma disponível no canto direito. */
.nav[data-scrolled="false"] .nav__brand {
  display: none;
}

.nav[data-scrolled="false"] .nav__right {
  display: flex;
}

.nav[data-scrolled="false"] .nav__links {
  flex: 1 1 auto;
  justify-content: center;
  gap: clamp(3px, 0.5vw, 6px);
}

/* "O evento", "O que inclui" e "Manual de Bordo" só aparecem no menu da 1ª dobra (Hero).
   No desktop, o seletor de idioma some ao rolar para dar lugar à marca e ao botão de reserva. */
.nav[data-scrolled="true"] .nav__link--fold1 {
  display: none;
}

@media (min-width: 901px) {
  .nav[data-scrolled="true"] .lang-switch:not(.lang-switch--mobile) {
    display: none;
  }
}

.nav__links a,
.nav__links a:hover,
.nav__links a:focus,
.nav__links a:focus-visible,
.nav__links a:active,
.nav__links a:visited {
  text-decoration: none !important;
  text-decoration-line: none !important;
}

.nav__links a {
  color: rgba(255, 255, 255, 0.82);
  text-decoration: none !important;
  font-weight: 500;
  padding: 8px clamp(6px, 0.6vw, 9px);
  font-size: .85rem;
  white-space: nowrap;
  border-radius: var(--r-pill);
  transition: color var(--dur-state) var(--ease-quart), background var(--dur-state) var(--ease-quart), box-shadow var(--dur-state) var(--ease-quart);
}

.nav__links a:hover {
  color: var(--foam-white);
  background: rgba(255, 255, 255, 0.08);
}

.nav[data-scrolled="true"] .nav__links a {
  color: rgba(255, 255, 255, 0.86);
}

.nav[data-scrolled="true"] .nav__links a:hover {
  color: var(--foam-white);
  background: rgba(255, 255, 255, 0.14);
}

.nav__links a.is-active,
.nav__links a[aria-current="true"] {
  color: var(--foam-white) !important;
  background: rgba(255, 255, 255, 0.12) !important;
  box-shadow: none !important;
}

.nav[data-scrolled="true"] .nav__links a.is-active,
.nav[data-scrolled="true"] .nav__links a[aria-current="true"] {
  color: var(--foam-white) !important;
  background: rgba(255, 255, 255, 0.16) !important;
  box-shadow: none !important;
}

.nav[data-scrolled="true"] .btn--primary {
  background: linear-gradient(135deg, rgba(113, 32, 108, 0.95) 0%, rgba(142, 43, 136, 0.98) 100%);
  color: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.35);
  box-shadow: 0 4px 16px rgba(113, 32, 108, 0.32);
}

.nav[data-scrolled="true"] .btn--primary:hover {
  background: linear-gradient(135deg, #872681 0%, #a4339d 100%);
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.6);
  box-shadow: 0 8px 24px rgba(113, 32, 108, 0.5);
  transform: translateY(-2px);
}

.nav[data-scrolled="false"] .nav__right .btn--primary {
  position: absolute;
  opacity: 0;
  transform: translateY(-6px);
  pointer-events: none;
  visibility: hidden;
}

.nav[data-scrolled="true"] .nav__right .btn--primary {
  position: relative;
}

.nav__right .btn--primary {
  order: 2;
  transition: opacity var(--dur, .3s) ease, transform var(--dur, .3s) ease, background .2s ease, color .2s ease;
}

@media (prefers-reduced-motion: reduce) {
  .nav__right .btn--primary {
    transition: none;
  }
}

.nav__right {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  flex-shrink: 0;
  margin-left: auto;
}

/* Ordem Desktop Padrão:
   - No topo (data-scrolled="false"): o link do manual aparece no menu,
     com o seletor de idiomas à direita.
   - Ao rolar (data-scrolled="true"): o botão do manual fica à direita, posicionado imediatamente
     ao lado esquerdo de "Garantir minha vaga" (.btn--primary), ambos com o mesmo tamanho (58px). */
.nav__right .lang-switch:not(.lang-switch--mobile) {
  order: 0;
  flex-shrink: 0;
}

.nav__right .header-manual-link {
  order: 1;
}

.nav__right .btn--primary {
  order: 2;
}

.nav__right .lang-switch--mobile {
  order: 3;
  display: none;
}

.nav__right .nav__toggle {
  order: 4;
}

@media (min-width: 1321px) {
  .nav .header-manual-link {
    height: 58px;
    min-height: 58px;
    box-sizing: border-box;
    padding: 0 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--r-pill, 6px);
  }

  .nav[data-scrolled="false"] .nav__links {
    margin: 0 auto;
    flex: 0 1 auto;
  }

  .nav[data-scrolled="false"] .lang-switch:not(.lang-switch--mobile) {
    margin-left: auto;
    flex-shrink: 0;
  }

  /* Ao rolar (data-scrolled="true"):
     .nav__right fica alinhado à direita contendo o botão do manual à esquerda
     e o botão 'Garantir minha vaga' à direita, ambos com exatamente 58px de altura */
  .nav[data-scrolled="true"] .nav__right {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-left: auto;
  }

  .nav[data-scrolled="true"] .header-manual-link {
    display: inline-flex;
    position: relative;
    order: 1;
    margin: 0;
    transform: none;
  }

  .nav[data-scrolled="true"] .header-manual-link:hover {
    transform: translateY(-2px);
  }

  /* Garante que o botão primário tenha exatamente o mesmo tamanho (58px de altura) e proporção */
  .nav[data-scrolled="true"] .nav__right .btn--primary {
    height: 58px;
    min-height: 58px;
    box-sizing: border-box;
    padding: 0 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--r-pill, 6px);
    order: 2;
  }
}

/* O botão só é redundante quando o menu completo está visível. */
@media (min-width: 1321px) {
  .nav[data-scrolled="false"] .header-manual-link {
    display: none;
  }
}

/* Language Switcher - Segmented Square Clean Design */
.lang-switch {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  height: 44px;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: var(--r-sm);
  padding: 3px;
  font-family: var(--font-body);
  user-select: none;
  box-shadow: none;
  box-sizing: border-box;
  transition: background var(--dur-fast) ease, border-color var(--dur-fast) ease;
}

.lang-switch:hover {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.45);
}

.lang-switch__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 36px;
  padding: 0;
  border-radius: 4px;
  color: rgba(255, 255, 255, 0.76);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-decoration: none;
  line-height: 1;
  box-sizing: border-box;
  transition: color 180ms cubic-bezier(0.16, 1, 0.3, 1), background 180ms cubic-bezier(0.16, 1, 0.3, 1);
}

.lang-switch__btn:hover:not(.is-active) {
  color: #ffffff;
  background: rgba(255, 255, 255, 0.12);
  text-decoration: none;
}

.lang-switch__btn:focus-visible {
  outline: 2px solid var(--sunset-gold);
  outline-offset: 2px;
}

.lang-switch__btn.is-active {
  color: #ffffff;
  background: rgba(255, 255, 255, 0.22);
  font-weight: 800;
  box-shadow: none;
  cursor: default;
  pointer-events: none;
}

.lang-switch__sep {
  display: none;
}

/* Seletor de Idioma Mobile - quando no drawer (legado) ou no header */
.drawer .lang-switch--mobile {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 3px;
  background: rgba(4, 29, 58, 0.05);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border: 1px solid rgba(4, 29, 58, 0.12);
  padding: 3px;
  border-radius: 6px;
  margin: 0;
  box-shadow: none;
}

.drawer .lang-switch--mobile .lang-switch__btn {
  min-width: 38px;
  height: 34px;
  padding: 0 10px;
  color: var(--ink-soft, #47627d);
  font-size: 0.82rem;
  font-weight: 700;
  border-radius: 4px;
}

.drawer .lang-switch--mobile .lang-switch__btn:hover:not(.is-active) {
  color: var(--ocean-abyss, #041d3a);
  background: rgba(4, 29, 58, 0.08);
}

.drawer .lang-switch--mobile .lang-switch__btn.is-active {
  color: #ffffff;
  background: var(--ocean-navy, #0b4d7c);
  box-shadow: 0 2px 6px rgba(11, 77, 124, 0.25);
  font-weight: 800;
}

.drawer .lang-switch--mobile .lang-switch__sep {
  display: none;
}

.drawer__home-language {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  gap: 10px;
  padding: 12px 0 20px;
  margin-bottom: 12px;
  border-bottom: 1px solid var(--line-soft);
  color: var(--ink-soft);
  font: 700 .875rem/1.4 var(--font-body);
}

.drawer__home-language[hidden] {
  display: none;
}

.drawer__home-language .lang-switch--mobile .lang-switch__btn {
  flex: 1;
  min-width: 44px;
  height: 44px;
  font-size: 1rem;
}

/* No desktop, o seletor mobile fica estritamente oculto */
@media (min-width: 1321px) {
  .nav__right .lang-switch--mobile {
    display: none !important;
  }
}

/* No mobile/tablet, o seletor desktop e o header-manual-link ficam ocultos e o seletor mobile translúcido é exibido ao lado do nav__toggle */
@media (max-width: 1320px) {
  .nav .nav__right {
    margin-left: auto;
    justify-content: flex-end;
    gap: 8px;
  }

  .nav .nav__right > .header-manual-link,
  .nav .nav__right .lang-switch:not(.lang-switch--mobile),
  .nav .nav__right .btn--primary,
  .nav__right .btn--primary,
  .nav[data-scrolled="true"] .nav__right .btn--primary,
  .nav[data-scrolled="false"] .nav__right .btn--primary {
    display: none !important;
  }

  .nav .nav__right .lang-switch--mobile {
    display: inline-flex !important;
    order: 1;
    flex-shrink: 0;
  }

  .nav .nav__right .nav__toggle {
    display: inline-flex !important;
    order: 2;
  }
}

@media (max-width: 600px) {
  .nav .lang-switch--mobile .lang-switch__btn {
    width: 30px;
    font-size: 0.75rem;
  }
}

@media (max-width: 380px) {
  .nav .lang-switch--mobile {
    gap: 1px;
    padding: 2px;
  }

  .nav .lang-switch--mobile .lang-switch__btn {
    width: 27px;
    font-size: 0.7rem;
  }
}

.nav__toggle {
  display: none;
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: var(--r-sm);
  width: 44px;
  height: 44px;
  color: var(--foam-white, #ffffff);
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  cursor: pointer;
  transition: background var(--dur-fast) ease, border-color var(--dur-fast) ease;
}

.nav__toggle:hover,
.nav__toggle:focus-visible {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.45);
}

.nav__toggle svg {
  width: 22px;
  height: 22px;
  stroke: var(--foam-white);
}

.drawer {
  position: fixed;
  inset: 0px;
  z-index: var(--z-drawer);
  background: var(--surface-0);
  display: flex;
  flex-direction: column;
  padding: max(14px, env(safe-area-inset-top, 14px)) var(--gutter) max(20px, env(safe-area-inset-bottom, 20px));
  transform: translateX(100%);
  transition: transform var(--dur-state) var(--ease-quart);
  overflow-y: auto;
}

.drawer[data-open="true"] {
  transform: translateX(0px);
}

.drawer__head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

.drawer__close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 1px solid var(--line-mid);
  border-radius: var(--r-sm);
  width: 44px;
  height: 44px;
  cursor: pointer;
  margin-left: auto;
}

.drawer__close svg {
  width: 22px;
  height: 22px;
  stroke: var(--ink-strong);
}

.drawer nav {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.drawer nav a {
  color: var(--ink-strong);
  text-decoration: none;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.5rem;
  padding: 10px 0px;
  border-bottom: 1px solid var(--line-soft);
}

.drawer .btn {
  margin-top: auto;
}

.drawer__actions {
  display: grid;
  grid-template-columns: 1fr;
  grid-auto-rows: 1fr;
  flex-shrink: 0;
  gap: 12px;
  margin-top: auto;
  padding-top: 24px;
}

.drawer__actions > .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 64px;
  min-height: 64px;
  margin: 0;
  padding: 6px 18px;
  box-sizing: border-box;
  border-radius: var(--r-sm);
}

.drawer__actions > .header-manual-link {
  border: 1px solid #083965;
  background: #083965;
  color: #ffffff;
  box-shadow: none;
  white-space: normal;
}

.drawer__actions > .header-manual-link:hover {
  background: #052646;
  border-color: #052646;
  color: #ffffff;
}

.drawer__actions .header-manual-link__lines { min-width: 0; line-height: 1.3; }
.drawer__actions .header-manual-link__sub {
  color: #ffffff;
  opacity: 0.9;
}
.drawer__actions .header-manual-link__title {
  font-size: .875rem;
  white-space: normal;
  color: #ffffff;
}
.drawer__actions .header-manual-link__title strong {
  color: #ffffff;
}
.drawer__actions .header-manual-link__icon {
  color: #ffffff;
}
.drawer__actions > .header-manual-link:hover .header-manual-link__icon {
  color: #ffffff;
}


.hero,
.hero h1,
.hero__meta {
  color: var(--foam-white);
}

.hero__sub {
  color: var(--foam-white) !important;
}

.hero .eyebrow {
  color: var(--purple-glow) !important;
}

.hero {
  position: relative;
  min-height: 100svh;
  display: flex;
  align-items: center;
  overflow: hidden;
  isolation: isolate;
}

.hero::after {
  content: "";
  position: absolute;
  left: 0px;
  right: 0px;
  bottom: -1px;
  z-index: 1;
  height: clamp(140px, 28vh, 310px);
  pointer-events: none;
  background: linear-gradient(rgba(6, 50, 88, 0) 0%, rgba(6, 50, 88, 0.62) 54%, rgb(6, 50, 88) 100%);
}

.hero__bg {
  position: absolute;
  inset: 0px;
  z-index: 0;
  container-type: size;
  background: rgb(6, 50, 88);
}

.hero__bg img,
.hero__bg video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero__video,
.hero__canvas,
.hero__fallback {
  filter: contrast(1.06) saturate(1.1) brightness(1.01);
}

.hero__video,
.hero__fallback,
.hero__canvas {
  position: absolute;
  inset: 0px;
}

.hero__video,
.hero__canvas {
  opacity: 0;
  transition: opacity 480ms var(--ease-quart);
}

.hero__video#heroDive {
  z-index: 1;
}

.hero__video#heroLoop {
  z-index: 0;
}

.hero__canvas {
  z-index: 2;
}

.hero__video[data-show="true"],
.hero__canvas[data-show="true"] {
  opacity: 1;
}

.hero__bg[data-handoff="direct"] .hero__video,
.hero__bg[data-handoff="direct"] .hero__canvas {
  transition: none;
}

.hero__canvas {
  width: 100%;
  height: 100%;
}

.hero__fallback {
  opacity: 1;
  z-index: -1;
  transition: opacity 600ms var(--ease-quart);
}

.hero__bg[data-media-live="true"] .hero__fallback {
  opacity: 0;
}

.hero__bg[data-scrub-origin="fallback"] .hero__canvas {
  transition-duration: 900ms;
}

@media (prefers-reduced-motion: reduce) {

  .hero__fallback,
  .hero__bg[data-scrub-origin="fallback"] .hero__canvas {
    transition: none;
  }
}

.hero__bg::before {
  content: "";
  position: absolute;
  inset: 0px;
  z-index: 1;
  pointer-events: none;
  opacity: 0.06;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 140px 140px;
}

.hero__bg::after {
  content: "";
  position: absolute;
  inset: 0px;
  z-index: 2;
  background: linear-gradient(rgba(0, 92, 140, 0.28) 0%, rgba(0, 120, 175, 0.05) 34%, rgba(6, 47, 87, 0.42) 70%, rgba(6, 50, 88, 0.94) 98%, rgb(6, 50, 88) 99%, rgb(6, 50, 88) 100%), radial-gradient(95% 78% at 8% 82%, rgba(4, 22, 44, 0.88) 0%, rgba(4, 22, 44, 0.62) 34%, rgba(4, 22, 44, 0.2) 60%, rgba(4, 22, 44, 0) 78%), linear-gradient(90deg, rgba(4, 22, 44, 0.55) 0%, rgba(4, 22, 44, 0.28) 30%, rgba(4, 22, 44, 0) 55%), radial-gradient(120% 95% at 82% 4%, rgba(0, 174, 239, 0.3) 0%, rgba(0, 174, 239, 0) 55%), radial-gradient(120% 95% at 86% 12%, rgba(123, 31, 162, 0.26) 0%, rgba(123, 31, 162, 0) 60%), radial-gradient(90% 70% at 95% 6%, rgba(247, 148, 30, 0.14) 0%, rgba(247, 148, 30, 0) 45%);
  opacity: 0.6;
  transition: opacity 900ms var(--ease-quart);
}

.hero[data-intro="done"] .hero__bg::after {
  opacity: 1;
}

.hero__watermark-shade {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 3;
  width: max(100%, calc(100cqh * 16 / 9));
  height: max(100%, calc(100cqw * 9 / 16));
  transform: translate(-50%, -50%);
  pointer-events: none;
  opacity: 0.72;
  background: linear-gradient(135deg,
      rgba(6, 50, 88, 0) 0%,
      rgba(6, 50, 88, 0) 68%,
      rgba(6, 50, 88, 0.14) 76%,
      rgba(6, 50, 88, 0.52) 88%,
      rgba(6, 50, 88, 0.86) 100%);
  transition: opacity 480ms var(--ease-quart);
}

.hero__bg[data-watermark-shade="strong"] .hero__watermark-shade {
  opacity: 1;
}

.hero>.container {
  width: calc(100% - (2 * var(--gutter)));
  padding-inline: 0;
}

.hero__inner {
  position: relative;
  z-index: 2;
  min-height: 100svh;
  padding-block: clamp(112px, 14svh, 156px) clamp(88px, 10svh, 112px);
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
  grid-template-areas: "content logo";
  align-items: center;
  gap: clamp(32px, 6vw, 88px);
  opacity: 1;
}

html.js .hero__inner {
  transform-origin: 50% 45%;
  animation: hero-inner-arrival 900ms var(--ease-expo) both;
}

@keyframes hero-inner-arrival {
  from {
    transform: translate3d(0, 8px, 0) scale(0.996);
  }

  to {
    transform: translate3d(0, 0, 0) scale(1);
  }
}

.hero__content {
  grid-area: content;
  width: 100%;
  max-width: 700px;
}

.hero__logo {
  grid-area: logo;
  justify-self: end;
  width: clamp(280px, 27vw, 390px);
  height: auto;
  filter: drop-shadow(rgba(7, 28, 53, 0.55) 0px 12px 40px);
}

@media (min-width: 1280px) {
  .hero__inner {
    grid-template-columns: minmax(0, 1fr) clamp(420px, 37vw, 520px);
    gap: clamp(32px, 3vw, 40px);
  }

  .hero__logo {
    width: 100%;
    max-width: 520px;
  }
}

.hero__logo,
.hero h1,
.hero__sub,
.hero__meta,
.hero__cta {
  opacity: 1;
  transform: none;
  transition: transform 680ms var(--ease-expo), filter 680ms var(--ease-quart);
}

/* Marca e título já compõem o primeiro paint: a entrada cinematográfica
   acontece no fundo e no conteúdo de apoio, sem postergar o LCP. */
.hero__logo,
.hero h1 {
  transition: none;
}

.hero__logo {
  transform-origin: 50% 55%;
  transition-duration: 760ms;
}

html.js .hero:not([data-intro="done"]) .hero__logo {
  transform: none;
  filter: drop-shadow(rgba(7, 28, 53, 0.55) 0px 12px 40px);
}

html.js .hero:not([data-intro="done"]) .hero__sub,
html.js .hero:not([data-intro="done"]) .hero__meta,
html.js .hero:not([data-intro="done"]) .hero__cta {
  transform: translate3d(0, 10px, 0);
}

.hero[data-intro="done"] .hero__logo {
  transition-delay: 40ms;
}

.hero[data-intro="done"] h1 {
  transition-delay: 80ms;
}

.hero[data-intro="done"] .hero__sub {
  transition-delay: 140ms;
}

.hero[data-intro="done"] .hero__meta {
  transition-delay: 200ms;
}

.hero[data-intro="done"] .hero__cta {
  transition-delay: 260ms;
}

html.js .hero:not([data-intro="done"]) .hero__scroll {
  opacity: 0;
  transform: translate(-50%, 10px);
}

@media (prefers-reduced-motion: reduce) {

  html.js .hero__inner {
    animation: none;
    transform: none;
  }

  .hero__bg::after,
  .hero__video,
  .hero__canvas,
  .hero__logo,
  .hero h1,
  .hero__sub,
  .hero__meta,
  .hero__cta,
  .hero__scroll {
    transition: none;
  }

  html.js .hero:not([data-intro="done"]) .hero__logo,
  html.js .hero:not([data-intro="done"]) h1,
  html.js .hero:not([data-intro="done"]) .hero__sub,
  html.js .hero:not([data-intro="done"]) .hero__meta,
  html.js .hero:not([data-intro="done"]) .hero__cta,
  html.js .hero:not([data-intro="done"]) .hero__scroll {
    opacity: 1;
    transform: none;
    filter: none;
  }

  html.js .hero:not([data-intro="done"]) .hero__scroll {
    transform: translateX(-50%);
  }
}

.hero h1 {
  width: auto;
  height: auto;
  margin-top: 0;
  max-width: 100%;
  font-size: clamp(3.75rem, 6.4vw, 5.5rem);
  line-height: 1.1em;
  letter-spacing: 0.01em;
  -webkit-text-stroke: 0.55px rgba(4, 29, 58, 0.76);
  text-shadow: #041d3a 0px 1px 2px, rgba(4, 22, 44, 0.72) 0px 2px 10px, rgba(4, 22, 44, 0.5) 0px 4px 30px;
}

.hero h1 .accent {
  font-family: var(--font-script);
  font-weight: 700;
  font-style: normal;
  color: var(--sunset-gold);
  font-size: 1.2em;
  letter-spacing: 0.01em;
  line-height: 0.9;
  -webkit-text-stroke: 1px rgba(4, 29, 58, 0.92);
  text-shadow: #041d3a 0px 1px 2px, rgba(4, 22, 44, 0.72) 0px 2px 12px, rgba(4, 22, 44, 0.55) 0px 4px 30px;
  position: relative;
  top: -4px;
}

.hero__sub {
  margin-top: clamp(18px, 2.6vh, 28px);
  font-size: clamp(1.05rem, 1.3vw, 1.25rem);
  line-height: 1.55;
  color: var(--ink-soft);
  max-width: 52ch;
  text-shadow: #041d3a 0px 1px 2px, rgba(4, 29, 58, 0.82) 0px 2px 8px;
}

.hero__meta {
  width: min(100%, 680px);
  margin-top: clamp(20px, 3vh, 32px);
  padding-block: 12px;
  display: grid;
  grid-template-columns: 1.45fr 0.8fr 0.9fr;
  gap: 0;
  border-block: 1px solid rgba(255, 255, 255, 0.24);
  color: var(--foam-white);
  font-size: 0.9rem;
  font-weight: 600;
  text-shadow: #041d3a 0px 1px 2px, rgba(4, 29, 58, 0.82) 0px 2px 8px;
}

.hero__meta span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding-inline: clamp(12px, 1.5vw, 20px);
}

.hero__meta span:first-child {
  padding-left: 0;
}

.hero__meta span+span {
  border-left: 1px solid rgba(255, 255, 255, 0.2);
}

.hero__meta svg {
  width: 1.15em;
  height: 1.15em;
  flex: 0 0 auto;
}

.hero__meta span:nth-child(1) svg,
.hero__meta span:nth-child(3) svg {
  color: var(--ocean-cyan);
}

.hero__meta span:nth-child(2) svg {
  color: var(--sunset-gold);
}

.hero__cta {
  margin-top: clamp(24px, 3.5vh, 38px);
  display: inline-grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  gap: var(--sp-sm);
  max-width: 100%;
}

.hero__cta .btn {
  width: 100%;
  border: 1px solid transparent;
}

.hero__cta .btn--ghost {
  border-color: rgba(255, 255, 255, 0.58);
}

.hero__cta .btn--primary::after {
  content: "";
  width: 0.62em;
  height: 0.62em;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: rotate(45deg);
  transition: transform var(--dur-state) var(--ease-quart);
}

.hero__cta .btn--primary:hover::after {
  transform: translateX(4px) rotate(45deg);
}

.hero__cta .btn--primary:active::after {
  transform: translateX(1px) rotate(45deg);
}

.hero__scroll {
  position: absolute;
  bottom: max(8px, env(safe-area-inset-bottom));
  left: 50%;
  transform: translate(-50%, calc(var(--hero-scroll-progress, 0) * 12px));
  z-index: 2;
  color: var(--sunset-gold);
  font-family: var(--font-display);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  line-height: 1;
  text-shadow: 0 2px 10px rgba(4, 29, 58, 0.82);
  text-transform: uppercase;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
  opacity: calc(1 - var(--hero-scroll-progress, 0));
  transition: opacity 480ms var(--ease-quart), transform 560ms var(--ease-expo);
}

.hero__scroll::before {
  content: "";
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--ocean-cyan);
  box-shadow: -38px 0 0 rgba(255, 255, 255, 0.5), 38px 0 0 rgba(255, 255, 255, 0.5), 0 0 10px rgba(41, 195, 245, 0.8);
  transform: translateY(5px);
}

.hero__scroll span {
  position: relative;
  overflow: hidden;
  width: 2px;
  height: 40px;
  background: linear-gradient(to bottom, rgba(41, 195, 245, 0.72), rgba(255, 255, 255, 0.4) 58%, transparent);
}

.hero__scroll span::after {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 4px;
  height: 10px;
  border-radius: 999px;
  background: var(--sunset-gold);
  box-shadow: 0 0 8px rgba(255, 192, 82, 0.9);
  transform: translate(-50%, -120%);
}

@media (prefers-reduced-motion: no-preference) {
  .hero__scroll span::after {
    animation: hero-scroll-pulse 1.6s var(--ease-expo) infinite;
  }
}

@keyframes hero-scroll-pulse {
  from {
    transform: translate(-50%, -120%);
  }

  to {
    transform: translate(-50%, 460%);
  }
}

@media (max-width: 1024px) {
  .hero__inner {
    grid-template-columns: minmax(0, 1.3fr) minmax(220px, 0.7fr);
    gap: clamp(24px, 4vw, 44px);
    padding-block: clamp(96px, 12svh, 128px) clamp(80px, 9svh, 104px);
  }

  .hero__logo {
    width: clamp(240px, 31vw, 320px);
  }

  .hero h1 {
    max-width: 100%;
    font-size: clamp(3.2rem, 7.2vw, 4.65rem);
  }

  .hero__sub {
    max-width: 46ch;
  }

  .hero__cta .btn {
    padding: 16px 20px;
    font-size: 0.95rem;
  }
}

@media (max-width: 820px) {
  .hero {
    min-height: 100svh;
    align-items: stretch;
  }

  .hero__inner {
    min-height: 100svh;
    padding-block: max(84px, calc(env(safe-area-inset-top) + 64px)) max(82px, calc(env(safe-area-inset-bottom) + 64px));
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 0;
  }

  .hero__logo {
    width: clamp(170px, 44vw, 240px);
    margin-bottom: clamp(12px, 2svh, 20px);
  }

  .hero h1 {
    max-width: 11ch;
    font-size: clamp(2.7rem, 11.4vw, 4.1rem);
    line-height: 0.95;
  }

  .hero__sub {
    max-width: 40ch;
    margin-top: 16px;
    font-size: clamp(1rem, 3.6vw, 1.1rem);
    line-height: 1.5;
  }

  .hero__meta {
    margin-top: 20px;
    padding-block: 10px;
    grid-template-columns: 1fr 1fr;
    font-size: 0.82rem;
  }

  .hero__meta span {
    padding-inline: 12px;
  }

  .hero__meta span:first-child {
    grid-column: 1 / -1;
    padding-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.16);
  }

  .hero__meta span:nth-child(2) {
    padding-left: 0;
    border-left: 0;
  }

  .hero__cta {
    width: 100%;
    margin-top: 24px;
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .hero__cta .btn {
    width: 100%;
    min-height: 54px;
    padding: 14px 18px;
    font-size: 1.0625rem;
  }
}

@media (max-width: 520px) {
  .hero__inner {
    padding-block: max(64px, calc(env(safe-area-inset-top) + 48px)) max(82px, calc(env(safe-area-inset-bottom) + 64px));
  }

  .hero__logo {
    width: clamp(148px, 40vw, 190px);
    margin-bottom: 10px;
  }

  .hero h1 {
    font-size: clamp(2.5rem, 10.7vw, 3.25rem);
  }

  .hero__sub {
    margin-top: 12px;
  }

  .hero__meta {
    margin-top: 14px;
    padding-block: 6px;
  }

  .hero__meta span {
    min-height: 40px;
  }

  .hero__cta {
    margin-top: 18px;
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .hero__cta .btn {
    min-height: 50px;
    padding: 12px 16px;
  }

  .hero__scroll {
    font-size: 0.68rem;
  }
}

.section--dark {
  --action-ink: var(--ocean-cyan);
}

.section--dark,
.section--dark h2,
.section--dark h3 {
  color: var(--ink-invert);
}

.section--dark .eyebrow {
  color: var(--ocean-cyan);
}

.section--dark .lead,
.section--dark p {
  color: var(--ink-invert-soft);
}

.section--abyss {
  background: var(--dark-abyss);
}

.section--navy {
  background: radial-gradient(120% 90% at 85% 0%, rgba(0, 174, 239, 0.10) 0%, rgba(0, 174, 239, 0) 55%),
    var(--dark-navy);
}

.section--deepest {
  background: radial-gradient(110% 80% at 15% 0%, rgba(123, 31, 162, 0.16) 0%, rgba(123, 31, 162, 0) 60%),
    var(--dark-navy);
}

.ship-video {
  position: relative;
  width: 100%;
  height: clamp(420px, 78vh, 860px);
  overflow: hidden;
  background: var(--dark-abyss);
}

.ship-video__media {
  position: absolute;
  inset: 0px;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  display: block;
}

.ship-video__veil {
  position: absolute;
  inset: 0px;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(4, 20, 40, 0.48) 0%, rgba(4, 20, 40, 0.12) 30%, rgba(4, 20, 40, 0) 52%),
    linear-gradient(0deg, var(--dark-navy) 0%, rgba(6, 30, 58, 0.35) 42%, rgba(6, 30, 58, 0) 62%),
    rgba(4, 20, 40, 0.22);
}

.ship-video__cap {
  position: absolute;
  left: 0px;
  right: 0px;
  bottom: clamp(24px, 5vh, 56px);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  text-align: center;
  padding: 0px 24px;
}

.ship-video__eyebrow {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ocean-cyan, #5fd3e6);
}

.ship-video__title {
  font-family: var(--font-display, "Hanken Grotesk", sans-serif);
  font-weight: 800;
  font-size: clamp(1.6rem, 4vw, 2.8rem);
  line-height: 1.05;
  color: var(--foam-white, #eaf6ff);
  text-shadow: rgba(4, 20, 40, 0.6) 0px 2px 24px;
  max-width: 18ch;
}

@media (max-width: 720px) {
  .ship-video {
    height: clamp(320px, 64vh, 560px);
  }
}

.section--deep {
  background: linear-gradient(180deg, var(--dark-navy-2) 0%, var(--dark-abyss) 100%);
}

.section--from-hero {
  margin-top: -1px;
  padding-top: clamp(var(--sp-lg), 7vw, var(--sp-2xl));
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background: linear-gradient(rgb(6, 50, 88) 0%, rgb(6, 50, 88) 18%, rgba(6, 50, 88, 0) 34%), radial-gradient(70% 62% at 82% 18%, rgba(123, 31, 162, 0.42) 0%, rgba(123, 31, 162, 0) 62%), radial-gradient(54% 46% at 18% 74%, rgba(0, 174, 239, 0.24) 0%, rgba(0, 174, 239, 0) 64%), radial-gradient(46% 38% at 74% 82%, rgba(255, 194, 14, 0.12) 0%, rgba(255, 194, 14, 0) 66%), linear-gradient(rgb(6, 50, 88) 0%, rgb(7, 31, 63) 54%, #000d35 100%);
}

.section--from-hero::before {
  content: "";
  position: absolute;
  margin-top: var(--sp-lg);
  inset: clamp(28px, 5vw, 72px) max(18px, 5vw) auto;
  height: 2px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.28), transparent);
  opacity: 0.8;
  z-index: -1;
}

.section--from-hero::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  z-index: 1;
  height: clamp(140px, 28vh, 310px);
  pointer-events: none;
  background: linear-gradient(rgba(87, 18, 122, 0) 0%, rgba(55, 27, 142, 0.62) 54%, #3a1560 100%);
}

.section--from-hero,
.section--from-hero h2 {
  color: var(--foam-white);
}

.section--from-hero .lead {
  color: rgba(255, 255, 255, 0.82);
}

#navio.section--deepest,
#hospedagem.section--abyss,
#faq.section--abyss {
  background: var(--surface-1);
}

#navio,
#hospedagem,
#faq {
  color: var(--ink-strong);
}

#navio h2,
#navio h3,
#hospedagem h2,
#hospedagem h3,
#faq h2,
#faq h3 {
  color: var(--ink-strong);
}

#navio .eyebrow,
#hospedagem .eyebrow,
#faq .eyebrow {
  color: var(--action-strong);
}

#navio .lead,
#navio p,
#hospedagem .lead,
#hospedagem p,
#faq .lead,
#faq p {
  color: var(--ink-soft);
}

.section--gradient {
  background: radial-gradient(120% 100% at 78% 8%, rgba(0, 174, 239, 0.22) 0%, rgba(0, 174, 239, 0) 55%),
    linear-gradient(165deg, var(--kriativa-purple) 0%, var(--kriativa-purple-deep) 100%);
}

.section--gradient,
.section--gradient h2,
.section--gradient .final-cta p {
  color: var(--foam-white);
}

.section--gradient .eyebrow {
  color: var(--sunset-gold);
}

.section--gradient .lead,
.section--gradient .final-cta p {
  color: rgba(255, 255, 255, 0.86);
}

.section--gradient .btn--ghost {
  color: var(--foam-white);
  border-color: rgba(255, 255, 255, 0.4);
}

.section--gradient .btn--ghost:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.85);
}

.section--gradient .btn--primary {
  background: var(--foam-white);
  color: var(--action-strong);
}

.section--gradient .btn--primary:hover {
  background: var(--mist-100);
  color: var(--action-hover);
  box-shadow: rgba(0, 0, 0, 0.28) 0px 14px 44px;
}

.section--dark .incl li {
  color: var(--ink-invert-soft);
}

.section--dark .incl__yes svg {
  stroke: var(--ocean-cyan);
}

.section--dark .incl__no li {
  color: var(--ink-invert-faint);
}

.section--dark .incl__no svg {
  stroke: var(--ink-invert-faint);
}

.section--dark .incl h3 {
  color: var(--ink-invert);
}

.section--dark .quote {
  background: var(--fill-invert);
  border-color: var(--line-invert);
}

.section--dark .quote p {
  color: var(--ink-invert);
}

.section--dark .quote footer {
  color: var(--ocean-cyan);
}

.section--dark .quote footer span {
  color: var(--ink-invert-faint);
}

.section--dark .sponsors__group h3 {
  color: var(--ink-invert-soft);
}

.board-motif {
  position: relative;
}

.board-motif>* {
  position: relative;
  z-index: 1;
}

.board-motif::before {
  content: "";
  position: absolute;
  inset: 0px;
  z-index: 0;
  pointer-events: none;
  background-image: radial-gradient(rgba(13, 41, 78, 0.1) 1.6px, transparent 1.7px);
  background-size: 26px 26px;
  mask-image: radial-gradient(130% 100% at 50% 0%, rgb(0, 0, 0) 0%, transparent 72%);
}

.section--gradient.board-motif::before,
.section--dark.board-motif::before {
  background-image: radial-gradient(rgba(133, 201, 245, 0.16) 1.6px, transparent 1.7px);
}

.section__head {
  max-width: 760px;
  margin-bottom: var(--sp-lg);
}

.section__head h2 {
  font-size: clamp(2rem, 4.5vw, 3.25rem);
}

.section__head p {
  margin-top: var(--sp-sm);
}

.section--center .section__head {
  margin-inline: auto;
  text-align: center;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0px;
  margin: -1px;
  overflow: hidden;
  clip: rect(0px, 0px, 0px, 0px);
  white-space: nowrap;
  border: 0px;
}

.event-stage {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0px, 1.08fr) minmax(310px, 0.82fr);
  gap: clamp(28px, 5vw, 76px);
  align-items: center;
}

.event-stage__head {
  grid-column: 1 / -1;
  display: flex;
  justify-content: center;
}

.event-stage__copy {
  max-width: 760px;
}

.event-stage__copy h2+h2 {
  margin-top: clamp(8px, 1vw, 12px);
}

.event-title__accent {
  display: inline-block;
  font-family: var(--font-script);
  font-size: 0.94em;
  font-weight: 700;
  line-height: 0.88;
  letter-spacing: 0.01em;
  color: var(--sunset-gold);
  -webkit-text-stroke: 1px rgba(4, 29, 58, 0.72);
  text-shadow: #041d3a 0 1px 2px, rgba(4, 22, 44, 0.6) 0 3px 16px;
}

.event-kicker {
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
  border-radius: 0;
  margin-top: var(--sp-lg);
  font-family: var(--font-display);
  font-size: clamp(0.82rem, 1.5vw, 1.05rem);
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-align: center;
  color: color-mix(in oklab, var(--foam-white) 82%, transparent);
}

.event-kicker::before,
.event-kicker::after {
  content: "";
  flex: 0 1 clamp(24px, 8vw, 68px);
  height: 1px;
  background: linear-gradient(90deg, transparent, color-mix(in oklab, var(--foam-white) 42%, transparent));
  box-shadow: none;
}

.event-kicker::after {
  background: linear-gradient(90deg, color-mix(in oklab, var(--foam-white) 42%, transparent), transparent);
}

.event-board h2 {
  font-size: clamp(2.55rem, 7.4vw, 5.6rem);
  line-height: 0.93;
  letter-spacing: -0.035em;
  text-wrap: balance;
}

.event-board .lead {
  max-width: 64ch;
  text-wrap: pretty;
}

.event-score {
  --sand-progress: 0;
  --sand-remaining: 1;
  position: relative;
  width: min(100%, 568px);
  max-width: 100%;
  padding: 18px 20px 20px;
  color: var(--foam-white);
  background: linear-gradient(145deg, #781fa0, #4a0f6a 72%);
  clip-path: polygon(0 14px, 14px 0, calc(100% - 34px) 0, 100% 34px, 100% calc(100% - 14px), calc(100% - 14px) 100%, 34px 100%, 0 calc(100% - 34px));
  box-shadow: 0 8px 0 #310847, 0 15px 8px rgba(4, 16, 34, 0.24);
  isolation: isolate;
}

.event-score::before,
.event-score::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--sunset-gold);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.7), 0 2px 0 #a8520a;
}

.event-score::before {
  top: 13px;
  left: 13px;
}

.event-score::after {
  right: 13px;
  bottom: 13px;
}

.event-score__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 0 18px 12px 0;
}

.event-score__label {
  font-family: var(--font-display);
  font-size: 1.5rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--sunset-gold);
}

.event-score__date {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.72);
}

.event-score__body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 138px;
  align-items: center;
  gap: 18px;
}

.event-score__clock {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}

.event-score .tlc {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 14px 8px 11px;
  background: #fff8e8;
  color: var(--action-strong);
  box-shadow: 0 5px 0 #2f0a46, inset 0 1px rgba(255, 255, 255, 0.9);
  clip-path: polygon(0 8px, 8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%);
  transition: transform 220ms var(--ease-quart), box-shadow 220ms var(--ease-quart);
}

.event-score .tlc::before {
  content: "";
  position: absolute;
  top: 7px;
  right: 7px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--ocean-cyan);
  opacity: 0.72;
}

.event-score .tlc__num {
  min-width: 0;
  font-family: var(--font-display);
  font-size: clamp(1.8rem, 3vw, 2.45rem);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  letter-spacing: 0.01em;
  color: var(--action-strong);
}

.event-score .tlc:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 0 #2f0a46, inset 0 1px rgba(255, 255, 255, 0.9);
}

.event-score .tlc__label {
  font-family: var(--font-display);
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--action-strong);
}

.turn-hourglass {
  position: relative;
  display: grid;
  justify-items: center;
  align-self: stretch;
  padding-left: 17px;
}

.turn-hourglass::before {
  content: "";
  position: absolute;
  inset: 12px auto 22px 0;
  width: 1px;
  background: linear-gradient(transparent, rgba(255, 255, 255, 0.36) 18%, rgba(255, 255, 255, 0.36) 82%, transparent);
}

.turn-hourglass__svg {
  width: 112px;
  height: 140px;
  overflow: visible;
  filter: drop-shadow(0 5px 2px rgba(31, 4, 49, 0.32));
  transition: transform 420ms var(--ease-quart);
}

.event-score:hover .turn-hourglass__svg {
  transform: translateY(-2px);
}

.turn-hourglass__glass {
  fill: url(#turn-glass);
  stroke: rgba(209, 246, 255, 0.88);
  stroke-width: 2;
}

.turn-hourglass__sand {
  fill: url(#turn-sand);
  transform-box: fill-box;
  transform-origin: 50% 100%;
}

.event-score.is-ready .turn-hourglass__sand {
  transition: transform 30s linear;
}

.turn-hourglass__sand--upper {
  transform: scaleY(var(--sand-remaining));
}

.turn-hourglass__sand--lower {
  transform: scaleY(var(--sand-progress));
}

.turn-hourglass__stream {
  fill: none;
  stroke: #ffc20e;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-dasharray: 3 5;
  animation: turn-sand-stream 760ms linear infinite;
}

.turn-hourglass__grain {
  fill: #ffc20e;
  transform-box: fill-box;
  transform-origin: center;
  animation: turn-sand-grain 1.25s var(--ease-quart) infinite;
}

.turn-hourglass__grain--two {
  animation-delay: 540ms;
}

.turn-hourglass__shine {
  fill: none;
  stroke: rgba(255, 255, 255, 0.56);
  stroke-width: 2;
  stroke-linecap: round;
}

.turn-hourglass__post {
  fill: #5cd7f4;
}

.turn-hourglass__rail {
  fill: #00aeef;
  stroke: #c5f5ff;
  stroke-width: 1;
}

.event-score[data-complete="true"] .turn-hourglass__stream,
.event-score[data-complete="true"] .turn-hourglass__grain {
  display: none;
}

.event-score[data-complete="true"] .event-score__label {
  color: #8ff0aa;
}

@keyframes turn-sand-stream {
  to {
    stroke-dashoffset: -8;
  }
}

@keyframes turn-sand-grain {

  0%,
  20% {
    opacity: 0;
    transform: translateY(-4px) scale(0.7);
  }

  46% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    transform: translateY(13px) scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {

  .event-score .tlc,
  .turn-hourglass__svg,
  .turn-hourglass__sand {
    transition: none;
  }

  .turn-hourglass__stream,
  .turn-hourglass__grain {
    animation: none;
  }
}

.event-table {
  position: relative;
  display: grid;
  place-items: end center;
  justify-self: center;
  width: min(520px, 100%);
  min-height: min(720px, 82vw);
  margin: 0px;
  perspective: 1000px;
}

.event-table::before {
  content: "";
  position: absolute;
  inset: 11% 0px 5% 8%;
  border-radius: 18px;
  background: linear-gradient(140deg, rgba(123, 31, 162, 0.9), rgba(0, 174, 239, 0.72));
  transform: rotate(-8.6deg) skewY(0deg);
  box-shadow: rgba(0, 0, 0, 0.18) 0px 8px 0px;
  opacity: 0.9;
}


@media (max-width: 900px) {
  .event-table::before {
    transform: rotate(-5.6deg) skewY(0deg);
  }
}

.event-table img {
  position: relative;
  z-index: 2;
  width: min(500px, 104%);
  height: 96%;
  max-height: 860px;
  margin-bottom: 1%;
  object-fit: cover;
  object-position: 59% 0%;
  /* base cropada na mesma angulação do card degradê (rotate(-4deg) skewY(-2deg)
     ≈ 6° combinados, canto direito mais alto). desnível vertical calibrado à
     largura/altura reais da caixa para casar os 6° da base do card */
  clip-path: polygon(0% 0%, 100% 0%, 100% 91.4%, 7% 100%);
}

.event-orbit {
  position: absolute;
  inset: 0px;
  z-index: 3;
  pointer-events: none;
}

.event-piece {
  position: absolute;
  display: grid;
  place-items: center;
  will-change: transform;
}

.event-piece--die {
  width: 62px;
  height: 62px;
  border-radius: 14px;
  color: var(--action-strong);
  background: rgb(255, 250, 240);
  box-shadow: rgba(0, 0, 0, 0.22) 0px 7px 0px;
}

.event-piece--die span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentcolor;
  box-shadow: currentcolor -14px -14px 0px, currentcolor 14px -14px 0px, currentcolor -14px 14px 0px, currentcolor 14px 14px 0px;
}

.event-piece--die-1 {
  top: 8%;
  right: 3%;
  transform: rotate(8deg);
}

.event-piece--die-2 {
  top: 20%;
  left: 4%;
  width: 48px;
  height: 48px;
  color: var(--kriativa-purple);
  transform: rotate(-12deg);
}

.event-piece--die-2 span {
  width: 6px;
  height: 6px;
  box-shadow: currentcolor 0px 0px 0px;
}

.event-piece--meeple {
  width: 58px;
  height: 58px;
  overflow: visible;
  filter: drop-shadow(rgba(0, 0, 0, 0.24) 0px 8px 0px);
}

.event-piece--meeple-gold {
  top: 40%;
  left: 0px;
  transform: rotate(-11deg);
}

.event-piece--meeple-cyan {
  top: 60%;
  right: 6%;
  width: 52px;
  height: 52px;
  transform: rotate(9deg);
}

.event-piece--meeple-purple {
  bottom: 6%;
  left: 12%;
  width: 46px;
  height: 46px;
  transform: rotate(-6deg);
}

.event-piece--meeple-coral {
  top: 6%;
  left: 34%;
  width: 44px;
  height: 44px;
  transform: rotate(14deg);
}

.event-track-wrap {
  position: relative;
  z-index: 2;
  margin-top: clamp(var(--sp-lg), 6vw, var(--sp-2xl));
}

.swipe-hint {
  display: none;
  align-items: center;
  justify-content: center;
  gap: 12px;
  color: rgba(255, 255, 255, 0.72);
  font-family: var(--font-body);
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  line-height: 1;
  text-transform: uppercase;
  transition: opacity 220ms ease, transform 220ms ease;
}

.swipe-hint.is-used {
  opacity: 0;
  transform: translateY(-4px);
  pointer-events: none;
}

.swipe-hint__motion {
  position: relative;
  display: block;
  width: 58px;
  height: 12px;
}

.swipe-hint__motion::before {
  content: "";
  position: absolute;
  top: 5px;
  right: 2px;
  left: 0;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(41, 195, 245, 0.22), var(--ocean-cyan));
}

.swipe-hint__motion::after {
  content: "";
  position: absolute;
  top: 2px;
  right: 1px;
  width: 7px;
  height: 7px;
  border-top: 2px solid var(--ocean-cyan);
  border-right: 2px solid var(--ocean-cyan);
  transform: rotate(45deg);
}

.swipe-hint__motion i {
  position: absolute;
  z-index: 1;
  top: 3px;
  left: 1px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--sunset-gold);
  box-shadow: 0 0 0 3px rgba(255, 210, 63, 0.14);
}

.event-track {
  --event-node: 55px;
  --event-node-w: 92px;
  counter-reset: event-step 0;
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, minmax(0px, 1fr));
  gap: clamp(16px, 3vw, 34px);
  list-style: none;
  margin: 0px;
  padding: calc(var(--event-node) + 18px) 0 0;
}

.event-track::before {
  content: "";
  position: absolute;
  top: calc(var(--event-node) / 2 - 2px);
  left: calc(var(--event-node) / 2);
  right: calc(var(--event-node) / 2);
  height: 5px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--ocean-cyan), var(--kriativa-purple), var(--sunset-gold));
  opacity: 0.9;
}

.event-step {
  counter-increment: event-step 1;
  position: relative;
  min-width: 0px;
  color: var(--foam-white);
}

.event-step::before {
  content: attr(data-year);
  position: absolute;
  top: calc((var(--event-node) + 18px) * -1);
  left: 0px;
  width: var(--event-node-w);
  height: var(--event-node);
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: var(--ocean-abyss);
  font-family: var(--font-display);
  font-size: 2rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.01em;
  line-height: 1;
  color: var(--sunset-gold);
  box-shadow: inset 0 0 0 2px var(--ocean-cyan),
    inset 0 0 0 5px rgba(41, 195, 245, 0.18),
    rgba(0, 0, 0, 0.3) 0px 5px 0px;
}

.event-step--now::before {
  content: attr(data-year);
  background: var(--kriativa-purple);
  color: var(--foam-white);
  box-shadow: inset 0 0 0 2px var(--purple-glow),
    inset 0 0 0 5px rgba(231, 169, 240, 0.22),
    rgba(0, 0, 0, 0.3) 0px 5px 0px;
  z-index: 1;
}

.event-step--now .event-step__ring {
  content: "";
  position: absolute;
  top: calc((var(--event-node) + 18px) * -1 - 4px);
  left: -4px;
  width: calc(var(--event-node-w) + 8px);
  height: calc(var(--event-node) + 8px);
  border-radius: 18px;
  background: conic-gradient(from var(--ring-angle, 0deg), rgba(41, 195, 245, 0) 0deg, rgb(41 195 245) 250deg, var(--ocean-cyan) 340deg, rgba(41, 195, 245, 0) 360deg);
  -webkit-mask: linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  mask-composite: exclude;
  padding: 2px;
  z-index: 0;
  pointer-events: none;
}

.event-step--now::after {
  content: none;
}

.event-step__year {
  display: none;
}

.event-step--now .event-step__year {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 7px;
  font-size: 0;
  color: var(--kriativa-purple);
}

.event-step--now .event-step__year::before {
  content: "";
  flex: none;
  width: 1.15rem;
  height: 1.15rem;
  background-color: var(--kriativa-purple);
  -webkit-mask: url('data:image/svg+xml,%3Csvg%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%20241%20348%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20xml%3Aspace%3D%22preserve%22%20xmlns%3Aserif%3D%22http%3A%2F%2Fwww.serif.com%2F%22%20style%3D%22fill-rule%3Aevenodd%3Bclip-rule%3Aevenodd%3Bstroke-linejoin%3Around%3Bstroke-miterlimit%3A2%3B%22%3E%3Cg%20id%3D%22Fundo%22%20fill%3D%22%23000%22%3E%3Cpath%20d%3D%22M194.247%2C127.473c-14.862%2C15.149%20-39.885%2C34.752%20-42.902%2C41.014c-6.557%2C13.611%203.72%2C18.345%2026.992%2C40.157c18.603%2C17.437%2040.45%2C31.748%2040.472%2C87.23c0.006%2C16.056%20-0.403%2C17.693%201.343%2C17.733c10.222%2C0.234%2019.874%2C-1.952%2019.94%2C5.529c0.199%2C22.762%200.31%2C22.906%20-0.782%2C24.539c-1.876%2C2.805%20-2.648%2C2.415%20-46.183%2C2.415c-61.5%2C-0%20-123%2C-0%20-184.5%2C-0c-8.508%2C-0.003%20-7.048%2C-3.825%20-7.045%2C-23.216c0.002%2C-8.761%202.075%2C-9.348%2010.795%2C-9.349c5.085%2C-0.001%2010.322%2C0.867%2010.336%2C-1.903c0.149%2C-31.057%20-2.412%2C-63.126%2029.496%2C-92.909c30.035%2C-28.034%2040.166%2C-33.648%2039.983%2C-43.598c-0.188%2C-10.258%20-11.516%2C-16.22%20-41.749%2C-44.796c-41.069%2C-38.817%20-22.291%2C-96.097%20-29.048%2C-96.341c-9.987%2C-0.36%20-19.642%2C2.318%20-19.807%2C-5.848c-0.472%2C-23.329%200.359%2C-24.044%201.902%2C-25.373c1.622%2C-1.396%201.929%2C-1.233%2086.138%2C-1.233c146.345%2C0%20146.432%2C-0.072%20147.631%2C0.585c0.36%2C0.197%202.715%2C1.487%202.81%2C4.293c0.834%2C24.752%20-0.361%2C25.503%20-2.171%2C26.64c-3.572%2C2.244%20-18.361%2C-0.445%20-19.015%2C1.9c-0.76%2C2.723%201.812%2C30.756%20-3.066%2C51.725c-5.945%2C25.557%20-18.882%2C37.829%20-21.566%2C40.804l-132.027%2C96.026c-27.057%2C24.557%20-29.655%2C43.65%20-29.139%2C88.133c0.014%2C1.221%200.194%2C1.823%201.775%2C1.84c3.652%2C0.04%20161.2%2C-0.072%20171.018%2C0.053c1.945%2C0.025%202.517%2C0.091%202.531%2C-1.894c0.335%2C-49.947%20-1.718%2C-65.162%20-38.966%2C-97.107c-5.776%2C-4.954%20-19.473%2C-17.768%20-21.147%2C-19.334c-11.159%2C-10.439%20-12.798%2C-27.322%20-0%2C-39.38c45.067%2C-42.461%2060.185%2C-44.702%2060.185%2C-105.186c0%2C-15.332%200.567%2C-16.643%20-1.848%2C-16.66c-13.68%2C-0.094%20-101.784%2C-0.701%20-171.004%2C-0c-4.155%2C0.042%20-2.541%2C2.051%20-2.544%2C6.16c-0.022%2C34.477%20-1.693%2C60.991%2030.632%2C88.878c1.894%2C1.634%2030.808%2C28.038%2031.021%2C28.257c10.748%2C11.057%2010.056%2C27.238%20-1.46%2C38.005c-9.285%2C8.681%20-28.555%2C25.991%20-31.053%2C28.235l132.027%2C-96.026Z%22%20style%3D%22fill-opacity%3A1%3B%22%2F%3E%3Cpath%20d%3D%22M65.989%2C254.173c40.556%2C-45.264%2096.323%2C-25.336%20116.264%2C9.664c6.642%2C11.658%2013.051%2C34.357%206.316%2C37.925c-1.214%2C0.643%20-1.301%2C0.571%20-109.444%2C0.571c-25.258%2C0%20-28.892%2C1.129%20-28.962%2C-5.704c-0.223%2C-21.665%2013.611%2C-39.586%2015.826%2C-42.455Z%22%20style%3D%22fill-opacity%3A1%3B%22%2F%3E%3Cpath%20d%3D%22M165.024%2C126.753c-0.089%2C0.079%20-27.846%2C26.305%20-30.184%2C29.044c-7.537%2C8.829%20-3.42%2C21.801%20-15.212%2C20.051c-11.77%2C-1.747%20-2.792%2C-10.904%20-15.473%2C-22.774c-3.481%2C-3.259%20-43.912%2C-41.707%20-44.938%2C-43.428c-1.477%2C-2.48%20-3.928%2C-7.214%2016.109%2C-12.687c46.209%2C-12.621%2060.177%2C19.897%2098.953%2C0.718c0.785%2C-0.388%2012.408%2C-8.189%2014.535%2C-0.611c1.805%2C6.432%20-13.027%2C19.488%20-23.791%2C29.688Z%22%20style%3D%22fill-opacity%3A1%3B%22%2F%3E%3Cpath%20d%3D%22M117.017%2C189.815c5.277%2C-4.705%208.547%2C0.73%208.828%2C2.525c1.393%2C8.906%20-14.941%2C6.344%20-8.828%2C-2.525Z%22%2F%3E%3Cpath%20d%3D%22M117.031%2C216.675c-3.414%2C-4.903%200.463%2C-8.275%204.08%2C-8.309c8.373%2C-0.079%204.069%2C15.543%20-4.08%2C8.309Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E') center / contain no-repeat;
  mask: url('data:image/svg+xml,%3Csvg%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%20241%20348%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20xml%3Aspace%3D%22preserve%22%20xmlns%3Aserif%3D%22http%3A%2F%2Fwww.serif.com%2F%22%20style%3D%22fill-rule%3Aevenodd%3Bclip-rule%3Aevenodd%3Bstroke-linejoin%3Around%3Bstroke-miterlimit%3A2%3B%22%3E%3Cg%20id%3D%22Fundo%22%20fill%3D%22%23000%22%3E%3Cpath%20d%3D%22M194.247%2C127.473c-14.862%2C15.149%20-39.885%2C34.752%20-42.902%2C41.014c-6.557%2C13.611%203.72%2C18.345%2026.992%2C40.157c18.603%2C17.437%2040.45%2C31.748%2040.472%2C87.23c0.006%2C16.056%20-0.403%2C17.693%201.343%2C17.733c10.222%2C0.234%2019.874%2C-1.952%2019.94%2C5.529c0.199%2C22.762%200.31%2C22.906%20-0.782%2C24.539c-1.876%2C2.805%20-2.648%2C2.415%20-46.183%2C2.415c-61.5%2C-0%20-123%2C-0%20-184.5%2C-0c-8.508%2C-0.003%20-7.048%2C-3.825%20-7.045%2C-23.216c0.002%2C-8.761%202.075%2C-9.348%2010.795%2C-9.349c5.085%2C-0.001%2010.322%2C0.867%2010.336%2C-1.903c0.149%2C-31.057%20-2.412%2C-63.126%2029.496%2C-92.909c30.035%2C-28.034%2040.166%2C-33.648%2039.983%2C-43.598c-0.188%2C-10.258%20-11.516%2C-16.22%20-41.749%2C-44.796c-41.069%2C-38.817%20-22.291%2C-96.097%20-29.048%2C-96.341c-9.987%2C-0.36%20-19.642%2C2.318%20-19.807%2C-5.848c-0.472%2C-23.329%200.359%2C-24.044%201.902%2C-25.373c1.622%2C-1.396%201.929%2C-1.233%2086.138%2C-1.233c146.345%2C0%20146.432%2C-0.072%20147.631%2C0.585c0.36%2C0.197%202.715%2C1.487%202.81%2C4.293c0.834%2C24.752%20-0.361%2C25.503%20-2.171%2C26.64c-3.572%2C2.244%20-18.361%2C-0.445%20-19.015%2C1.9c-0.76%2C2.723%201.812%2C30.756%20-3.066%2C51.725c-5.945%2C25.557%20-18.882%2C37.829%20-21.566%2C40.804l-132.027%2C96.026c-27.057%2C24.557%20-29.655%2C43.65%20-29.139%2C88.133c0.014%2C1.221%200.194%2C1.823%201.775%2C1.84c3.652%2C0.04%20161.2%2C-0.072%20171.018%2C0.053c1.945%2C0.025%202.517%2C0.091%202.531%2C-1.894c0.335%2C-49.947%20-1.718%2C-65.162%20-38.966%2C-97.107c-5.776%2C-4.954%20-19.473%2C-17.768%20-21.147%2C-19.334c-11.159%2C-10.439%20-12.798%2C-27.322%20-0%2C-39.38c45.067%2C-42.461%2060.185%2C-44.702%2060.185%2C-105.186c0%2C-15.332%200.567%2C-16.643%20-1.848%2C-16.66c-13.68%2C-0.094%20-101.784%2C-0.701%20-171.004%2C-0c-4.155%2C0.042%20-2.541%2C2.051%20-2.544%2C6.16c-0.022%2C34.477%20-1.693%2C60.991%2030.632%2C88.878c1.894%2C1.634%2030.808%2C28.038%2031.021%2C28.257c10.748%2C11.057%2010.056%2C27.238%20-1.46%2C38.005c-9.285%2C8.681%20-28.555%2C25.991%20-31.053%2C28.235l132.027%2C-96.026Z%22%20style%3D%22fill-opacity%3A1%3B%22%2F%3E%3Cpath%20d%3D%22M65.989%2C254.173c40.556%2C-45.264%2096.323%2C-25.336%20116.264%2C9.664c6.642%2C11.658%2013.051%2C34.357%206.316%2C37.925c-1.214%2C0.643%20-1.301%2C0.571%20-109.444%2C0.571c-25.258%2C0%20-28.892%2C1.129%20-28.962%2C-5.704c-0.223%2C-21.665%2013.611%2C-39.586%2015.826%2C-42.455Z%22%20style%3D%22fill-opacity%3A1%3B%22%2F%3E%3Cpath%20d%3D%22M165.024%2C126.753c-0.089%2C0.079%20-27.846%2C26.305%20-30.184%2C29.044c-7.537%2C8.829%20-3.42%2C21.801%20-15.212%2C20.051c-11.77%2C-1.747%20-2.792%2C-10.904%20-15.473%2C-22.774c-3.481%2C-3.259%20-43.912%2C-41.707%20-44.938%2C-43.428c-1.477%2C-2.48%20-3.928%2C-7.214%2016.109%2C-12.687c46.209%2C-12.621%2060.177%2C19.897%2098.953%2C0.718c0.785%2C-0.388%2012.408%2C-8.189%2014.535%2C-0.611c1.805%2C6.432%20-13.027%2C19.488%20-23.791%2C29.688Z%22%20style%3D%22fill-opacity%3A1%3B%22%2F%3E%3Cpath%20d%3D%22M117.017%2C189.815c5.277%2C-4.705%208.547%2C0.73%208.828%2C2.525c1.393%2C8.906%20-14.941%2C6.344%20-8.828%2C-2.525Z%22%2F%3E%3Cpath%20d%3D%22M117.031%2C216.675c-3.414%2C-4.903%200.463%2C-8.275%204.08%2C-8.309c8.373%2C-0.079%204.069%2C15.543%20-4.08%2C8.309Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E') center / contain no-repeat;
}

.event-step--now .event-step__year::after {
  content: "PRÓXIMO";
  font-family: var(--font-body);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  padding: 0.34em 0.7em 0.3em;
  border-radius: 999px;
  color: var(--foam-white);
  background: var(--kriativa-purple);
  line-height: 1;
  white-space: nowrap;
}

.event-step__body strong {
  display: block;
  margin-bottom: 5px;
  color: var(--foam-white);
}

.event-step__body span {
  display: block;
  max-width: 27ch;
  color: rgba(255, 255, 255, 0.76);
  font-size: 0.92rem;
  line-height: 1.45;
  text-wrap: pretty;
}

.event-step__token {
  display: inline-flex;
  margin-top: 12px;
  padding: 7px 12px;
  border-radius: 10px;
  font-family: var(--font-body);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ocean-abyss);
  background: var(--sunset-gold);
}

@media (prefers-reduced-motion: no-preference) {
  .event-piece--die-1 {
    animation: event-float-a 7s var(--ease-quart) infinite;
  }

  .event-piece--die-2 {
    animation: event-float-d 8.2s var(--ease-quart) infinite;
  }

  .event-piece--meeple-gold {
    animation: event-float-b 8.5s var(--ease-quart) infinite;
  }

  .event-piece--meeple-cyan {
    animation: event-float-c 7.8s var(--ease-quart) infinite;
  }

  .event-piece--meeple-purple {
    animation: event-float-a 9.1s var(--ease-quart) infinite;
  }

  .event-piece--meeple-coral {
    animation: event-float-b 6.6s var(--ease-quart) infinite;
  }

  .event-step--now::before,
  .event-step--now .event-step__year::before {
    animation: event-now-pulse 1.8s var(--ease-quart) infinite;
  }

  .event-step--now .event-step__ring {
    animation: event-ring-spin 4.5s linear infinite;
  }

  .js-reveal .event-track.reveal .event-step {
    opacity: 0;
    transform: translateY(16px) rotate(-1deg);
    transition: opacity 620ms var(--ease-expo), transform 620ms var(--ease-expo);
  }

  .js-reveal .event-track.reveal.is-in .event-step {
    opacity: 1;
    transform: none;
    transition-delay: calc(90ms + var(--i) * 120ms);
  }

  @supports (animation-timeline: view()) {
    .event-table {
      animation-duration: auto;
      animation-timing-function: linear;
      animation-delay: 0s;
      animation-iteration-count: 1;
      animation-direction: normal;
      animation-fill-mode: both;
      animation-play-state: running;
      animation-name: event-table-drift;
      animation-timeline: view();
      animation-range: entry -10% exit 80%;
    }
  }
}

@keyframes event-float-a {

  0%,
  100% {
    transform: translate3d(0px, 0px, 0px) rotate(8deg);
  }

  50% {
    transform: translate3d(-12px, -18px, 0px) rotate(18deg);
  }
}

@keyframes event-float-b {

  0%,
  100% {
    transform: translate3d(0px, 0px, 0px) rotate(-11deg);
  }

  50% {
    transform: translate3d(14px, 18px, 0px) rotate(-2deg);
  }
}

@keyframes event-float-c {

  0%,
  100% {
    transform: translate3d(0px, 0px, 0px) rotate(-6deg);
  }

  50% {
    transform: translate3d(-8px, 14px, 0px) rotate(-12deg);
  }
}

@keyframes event-float-d {

  0%,
  100% {
    transform: translate3d(0px, 0px, 0px) rotate(5deg);
  }

  50% {
    transform: translate3d(10px, -12px, 0px) rotate(11deg);
  }
}

@keyframes event-now-pulse {

  0%,
  100% {
    transform: translateY(0px) scale(1);
  }

  50% {
    transform: translateY(-3px) scale(1.04);
  }
}

@property --ring-angle {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}

@keyframes event-ring-spin {
  to {
    --ring-angle: 360deg;
  }
}

@keyframes event-table-drift {
  0% {
    transform: rotateX(2deg) translateY(28px);
  }

  100% {
    transform: rotateX(0deg) translateY(-18px);
  }
}

#navio.section--deepest {
  margin-top: -1px;
  padding-block: clamp(88px, 9vw, 132px) clamp(132px, 12vw, 184px);
  overflow: hidden;
  isolation: isolate;
  color: var(--foam-white);
  background: radial-gradient(62% 42% at 8% 34%, color-mix(in oklab, var(--kriativa-purple) 28%, transparent), transparent 72%),
    radial-gradient(52% 34% at 92% 72%, color-mix(in oklab, var(--ocean-cyan) 18%, transparent), transparent 74%),
    linear-gradient(180deg, oklch(0.24 0.06 250.82) 0%, color-mix(in oklab, var(--ocean-navy) 64%, oklch(0.3 0.08 253.08)) 8%, var(--ocean-navy) 18%, var(--ocean-abyss) 72%, #031326 100%);
}

#navio.section--deepest::before {
  content: "";
  position: absolute;
  inset: 18% -20% auto;
  height: 62%;
  z-index: 0;
  pointer-events: none;
  background: radial-gradient(ellipse at center, color-mix(in oklab, var(--ocean-blue) 13%, transparent), transparent 68%);
  transform: rotate(-7deg);
}

#navio .ship-command {
  position: relative;
  z-index: 1;
}

#navio .ship-command__head {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
  gap: clamp(28px, 6vw, 84px);
  align-items: end;
  max-width: none;
  text-align: left;
}

#navio .ship-command__status {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0;
  color: rgba(255, 255, 255, 0.76);
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.ship-command__status::before {
  content: "";
  width: 42px;
  height: 2px;
  background: var(--ocean-cyan);
}

.ship-command__status span+span::before {
  content: "•";
  margin-right: 14px;
  color: var(--sunset-gold);
}

#navio .ship-command__head h2 {
  margin: 0;
  max-width: 12ch;
  color: var(--foam-white);
  font-size: clamp(3rem, 6.4vw, 5.6rem);
  line-height: 0.94;
  letter-spacing: -0.03em;
  text-wrap: balance;
}

#navio .ship-command__head h2 span {
  color: var(--sunset-gold);
}

#navio .ship-command__head .lead {
  align-self: end;
  max-width: 58ch;
  margin: 0 0 0.35em;
  color: rgba(255, 255, 255, 0.82);
  font-size: clamp(1rem, 1.3vw, 1.16rem);
  line-height: 1.65;
  text-wrap: pretty;
}

.ship-grid {
  margin-top: clamp(52px, 7vw, 96px);
}

.ship-show {
  --ship-tilt-x: 0deg;
  --ship-tilt-y: 0deg;
  --ship-pan-x: 0px;
  --ship-pan-y: 0px;
  position: relative;
  margin-bottom: clamp(92px, 9vw, 124px);
  aspect-ratio: 21 / 9;
  overflow: visible;
  background: transparent;
  perspective: 1600px;
  transform-style: preserve-3d;
}

.ship-show:not([data-ready="true"]) .ship-show__btn,
.ship-show:not([data-ready="true"]) .ship-show__dots {
  display: none;
}

.ship-show__viewport {
  position: absolute;
  inset: 0;
  overflow: hidden;
  border-radius: var(--r-lg);
  background: var(--ocean-abyss);
  box-shadow: 0 26px 80px rgba(1, 12, 27, 0.48);
  transform: rotateX(var(--ship-tilt-y)) rotateY(var(--ship-tilt-x)) translateZ(0);
  transform-origin: center;
  transform-style: preserve-3d;
  transition: transform 360ms var(--ease-quart);
  will-change: transform;
}

.ship-show__viewport::before {
  content: "";
  position: absolute;
  inset: 14px;
  z-index: 4;
  pointer-events: none;
  opacity: 0.7;
  background: linear-gradient(var(--ocean-cyan), var(--ocean-cyan)) left top / 34px 2px no-repeat,
    linear-gradient(var(--ocean-cyan), var(--ocean-cyan)) left top / 2px 34px no-repeat,
    linear-gradient(var(--sunset-gold), var(--sunset-gold)) right bottom / 34px 2px no-repeat,
    linear-gradient(var(--sunset-gold), var(--sunset-gold)) right bottom / 2px 34px no-repeat;
}

.ship-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  clip-path: inset(0 7% 0 7%);
  pointer-events: none;
  transition: opacity 620ms var(--ease-expo), clip-path 760ms var(--ease-expo), visibility 760ms;
}

.ship-slide[data-active="true"] {
  opacity: 1;
  visibility: visible;
  clip-path: inset(0);
}

.ship-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: translate3d(var(--ship-pan-x), var(--ship-pan-y), 0) scale(1.09);
  transition: transform 6s var(--ease-expo);
  will-change: transform;
}

.ship-slide[data-active="true"] img {
  transform: translate3d(var(--ship-pan-x), var(--ship-pan-y), 0) scale(1.035);
}

.ship-slide::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(3, 19, 38, 0.18) 0%, transparent 38%, rgba(3, 19, 38, 0.9) 100%);
}

.ship-slide figcaption {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 2;
  max-width: min(74%, 680px);
  padding: clamp(24px, 4vw, 48px);
}

.ship-slide figcaption b {
  display: block;
  color: var(--foam-white);
  font-family: var(--font-display);
  font-size: clamp(1.8rem, 3.5vw, 3rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1;
  text-wrap: balance;
}

.ship-slide figcaption span {
  display: block;
  margin-top: 8px;
  color: rgba(255, 255, 255, 0.82);
  font-size: clamp(0.92rem, 1.2vw, 1.06rem);
  line-height: 1.45;
  text-wrap: pretty;
}

.ship-show__hud {
  position: absolute;
  top: clamp(18px, 2vw, 26px);
  left: clamp(18px, 2vw, 26px);
  right: clamp(18px, 2vw, 26px);
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: space-between;
  pointer-events: none;
}

.ship-show__hud-label,
.ship-show__counter {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 8px 12px;
  color: var(--foam-white);
  background: rgba(3, 19, 38, 0.88);
  border-radius: var(--r-sm);
  font-family: var(--font-display);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  line-height: 1;
  text-transform: uppercase;
}

.ship-show__counter {
  gap: 6px;
  color: rgba(255, 255, 255, 0.64);
  font-variant-numeric: tabular-nums;
}

.ship-show__counter b {
  color: var(--sunset-gold);
  font-size: 1.12rem;
}

.ship-show__counter i {
  font-style: normal;
}

.ship-show__btn {
  position: absolute;
  top: 50%;
  z-index: 6;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  padding: 0;
  color: var(--foam-white);
  background: rgba(3, 19, 38, 0.92);
  border: 0;
  border-radius: var(--r-sm);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.2);
  transform: translateY(-50%);
  transition: color 180ms var(--ease-quart), background 180ms var(--ease-quart), transform 180ms var(--ease-quart);
}

.ship-show__btn:hover {
  color: var(--sunset-gold);
  background: var(--action-strong);
  transform: translateY(-50%) scale(1.06);
}

.ship-show__btn:focus-visible {
  outline: 3px solid var(--ocean-cyan);
  outline-offset: 3px;
}

.ship-show__btn svg {
  width: 26px;
  height: 26px;
}

.ship-show__prev {
  left: clamp(12px, 2vw, 24px);
}

.ship-show__next {
  right: clamp(12px, 2vw, 24px);
}

.ship-show__dots {
  position: absolute;
  left: 50%;
  bottom: clamp(-98px, -7vw, -78px);
  z-index: 7;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: clamp(7px, 1.2vw, 14px);
  width: min(78%, 760px);
  transform: translateX(-50%);
}

.ship-show__dots::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  height: 1px;
  z-index: -1;
  background: rgba(41, 195, 245, 0.32);
}

.ship-show__dots button {
  position: relative;
  width: 100%;
  min-height: 46px;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  padding: 0;
  color: var(--foam-white);
  background-color: var(--ocean-abyss);
  background-image: var(--ship-thumb);
  background-position: center;
  background-size: cover;
  border: 0;
  border-radius: var(--r-sm);
  opacity: 0.48;
  filter: grayscale(0.42) brightness(0.68);
  transform: perspective(500px) rotateX(5deg);
  transform-origin: center bottom;
  transition: opacity 220ms var(--ease-quart), filter 220ms var(--ease-quart), transform 260ms var(--ease-quart);
}

.ship-show__dots button span {
  position: absolute;
  left: 7px;
  bottom: 5px;
  z-index: 2;
  font-family: var(--font-display);
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1;
  text-shadow: 0 1px 2px var(--ocean-abyss);
}

.ship-show__dots button::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 42%, rgba(3, 19, 38, 0.82));
}

.ship-show__dots button::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 3px;
  background: var(--sunset-gold);
  transform: scaleX(0);
  transform-origin: left;
}

.ship-show__dots button:hover,
.ship-show__dots button:focus-visible {
  opacity: 0.88;
  filter: none;
  transform: translateY(-5px);
}

.ship-show__dots button:focus-visible {
  outline: 3px solid var(--sunset-gold);
  outline-offset: 3px;
}

.ship-show__dots button[aria-current="true"] {
  opacity: 1;
  filter: none;
  outline: 2px solid var(--ocean-cyan);
  outline-offset: 3px;
  box-shadow: 0 8px 0 rgba(1, 12, 27, 0.52);
  transform: translateY(-10px) scale(1.03);
}

@media (prefers-reduced-motion: no-preference) {
  .ship-show__dots button[aria-current="true"]::after {
    animation: ship-thumb-progress 5s linear forwards;
  }

  .ship-show[data-paused="true"] .ship-show__dots button[aria-current="true"]::after {
    animation-play-state: paused;
  }
}

@keyframes ship-thumb-progress {
  to {
    transform: scaleX(1);
  }
}

@media (max-width: 900px) {
  #navio .ship-command__head {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  #navio .ship-command__head h2 {
    max-width: 13ch;
  }

  #navio .ship-command__head .lead {
    max-width: 64ch;
  }
}

@media (max-width: 640px) {
  #navio.section--deepest {
    padding-block: 80px 118px;
  }

  .ship-command__status {
    flex-wrap: wrap;
    gap: 8px 12px;
    font-size: 0.72rem;
  }

  .ship-command__status::before {
    width: 28px;
  }

  .ship-command__status span+span {
    flex-basis: 100%;
    padding-left: 40px;
  }

  .ship-command__status span+span::before {
    display: none;
  }

  #navio .ship-command__head h2 {
    max-width: 12ch;
    font-size: clamp(2.65rem, 13vw, 3.5rem);
  }

  .ship-grid {
    margin-top: 42px;
  }

  .ship-show {
    margin-bottom: 70px;
    aspect-ratio: 4 / 5;
  }

  .ship-show__viewport {
    border-radius: var(--r-md);
    transform: none !important;
  }

  .ship-show__viewport::before {
    inset: 9px;
  }

  .ship-slide figcaption {
    max-width: calc(100% - 32px);
    padding: 22px 20px;
  }

  .ship-slide figcaption b {
    font-size: clamp(1.8rem, 9vw, 2.35rem);
  }

  .ship-show__hud {
    top: 14px;
    left: 14px;
    right: 14px;
  }

  .ship-show__hud-label {
    display: none;
  }

  .ship-show__btn {
    width: 44px;
    height: 44px;
  }

  .ship-show__dots {
    bottom: -55px;
    gap: 6px;
    width: 100%;
  }

  .ship-show__dots button span {
    display: none;
  }
}

@media (hover: none),
(pointer: coarse) {
  .ship-show__viewport {
    transform: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {

  .ship-show__viewport,
  .ship-slide,
  .ship-slide img,
  .ship-show__dots button {
    transition: none !important;
  }

  .ship-show__viewport,
  .ship-slide img,
  .ship-slide[data-active="true"] img {
    transform: none !important;
  }

  .ship-show__dots button::after {
    animation: none !important;
  }
}

#incluso {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: var(--foam-white);
  background: var(--incl-navy);
}

.incluso__intro {
  display: grid;
  grid-template-columns: minmax(150px, 0.55fr) minmax(0, 1.45fr);
  align-items: start;
  gap: clamp(36px, 7vw, 112px);
  margin-bottom: clamp(28px, 3vw, 42px);
  padding-bottom: clamp(24px, 3vw, 36px);
  border-bottom: 1px solid var(--incl-rule-dark);
}

.incluso__intro h2 {
  max-width: 12ch;
  margin: 0;
  color: var(--incl-coral);
  font-size: clamp(1.125rem, 1.6vw, 1.45rem);
  line-height: 1.08;
  letter-spacing: 0.015em;
  text-wrap: balance;
}

.incluso__intro .lead {
  max-width: 58ch;
  margin: 0;
  justify-self: end;
  color: rgba(255, 255, 255, 0.86);
  text-wrap: pretty;
}

.incl {
  display: flex;
  flex-direction: column;
  gap: clamp(36px, 4vw, 56px);
}

.incl ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.incl__yes {
  display: grid;
  grid-template-columns: minmax(0, 1.85fr) minmax(280px, 1fr);
  align-items: stretch;
  border-bottom: 1px solid var(--incl-rule-dark);
}

.incl h3 {
  margin: 0;
}

.incl__manifest {
  min-width: 0;
  padding: clamp(38px, 5vw, 72px) clamp(32px, 5vw, 68px) clamp(42px, 5vw, 72px) 0;
}

.incl__label {
  margin: 0 0 18px;
  color: var(--incl-cyan);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  line-height: 1;
  text-transform: uppercase;
}

.incl__manifest h3 {
  max-width: 10ch;
  margin-bottom: clamp(42px, 5vw, 68px);
  color: var(--foam-white);
  font-size: clamp(3.15rem, 5.2vw, 4.9rem);
  line-height: 0.92;
  letter-spacing: 0.005em;
  text-wrap: balance;
}

.incl__manifest ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: clamp(28px, 4vw, 52px);
}

.incl__manifest li,
.incl__no li {
  display: grid;
  align-items: start;
}

.incl__manifest li {
  grid-template-columns: 2.3rem minmax(0, 1fr);
  gap: 12px;
  min-height: 112px;
  padding: 18px 0 22px;
  border-top: 1px solid var(--incl-rule-dark);
  color: var(--foam-white);
  transition: transform var(--incl-transition), border-color var(--incl-transition);
}

.incl li span,
.incl li strong,
.incl li small {
  display: block;
}

.incl__index {
  padding-top: 0.32em;
  color: var(--incl-cyan);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1;
  transition: color var(--incl-transition);
}

.incl__manifest li strong {
  color: var(--foam-white);
  font-size: clamp(1.05rem, 1.45vw, 1.3rem);
  line-height: 1.18;
}

.incl__manifest li small {
  max-width: 29ch;
  margin-top: 7px;
  color: var(--incl-copy);
  font-size: 0.875rem;
  line-height: 1.5;
  text-wrap: pretty;
}

@media (hover: hover) {
  .incl__manifest li:hover {
    border-color: var(--incl-cyan);
    transform: translateX(4px);
  }

  .incl__manifest li:hover .incl__index {
    color: var(--incl-coral);
  }
}

.incl__playtime {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  min-width: 0;
  padding: clamp(38px, 5vw, 68px) clamp(30px, 4vw, 52px);
  color: var(--incl-paper-ink);
  text-align: left;
  background: var(--incl-paper);
}

.incl__playtime::before {
  content: "";
  width: 42px;
  height: 3px;
  margin-bottom: clamp(42px, 5vw, 72px);
  background: var(--incl-coral);
}

.incl__callout {
  width: 100%;
  min-width: 0;
}

#incluso .incl__callout h3 {
  width: 100%;
  color: var(--incl-paper-ink);
  font-size: clamp(3.2rem, 4.3vw, 3.8rem);
  line-height: 0.96;
  letter-spacing: 0.005em;
  text-wrap: balance;
}

#incluso .incl__signature {
  margin: 20px 0 0;
  color: var(--incl-coral-ink);
  font-family: var(--font-display);
  font-size: clamp(1.25rem, 2vw, 1.65rem);
  font-style: italic;
  line-height: 1;
}

.incl__playtime-copy {
  max-width: 27ch;
  margin: auto 0 0;
  padding-top: 22px;
  border-top: 1px solid var(--incl-rule-light);
}

.incl__playtime-copy strong,
.incl__playtime-copy span {
  display: block;
}

.incl__playtime-copy strong {
  color: var(--incl-paper-ink);
  font-size: 1.08rem;
  line-height: 1.35;
}

.incl__playtime-copy span {
  margin-top: 8px;
  color: var(--incl-paper-copy);
  font-size: 0.88rem;
  line-height: 1.55;
}

.incl__no {
  display: grid;
  grid-template-columns: minmax(220px, 0.68fr) minmax(0, 2.32fr);
  align-items: start;
  gap: clamp(36px, 6vw, 92px);
  padding-top: clamp(6px, 1vw, 12px);
}

.incl__no h3 {
  color: var(--foam-white);
  font-size: clamp(1.3rem, 2vw, 1.7rem);
  line-height: 1;
}

.incl__no-head p {
  max-width: 30ch;
  margin: 12px 0 0;
  color: var(--incl-copy);
  font-size: 0.9rem;
  line-height: 1.55;
}

.incl__no ul {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(24px, 3vw, 40px);
}

.incl__no li {
  grid-template-columns: 16px minmax(0, 1fr);
  gap: 12px;
  padding-top: 14px;
  border-top: 1px solid var(--incl-rule-dark);
  color: var(--incl-copy);
}

.incl__no li::before {
  content: "—";
  color: var(--incl-coral);
  font-size: 0.8rem;
  line-height: 1.35;
}

.incl__no li strong {
  color: var(--foam-white);
  font-size: 0.92rem;
  line-height: 1.35;
}

.incl__no li small {
  margin-top: 5px;
  color: var(--incl-copy);
  font-size: 0.8rem;
  line-height: 1.5;
}

@media (max-width: 900px) {

  .incluso__intro,
  .incl__yes,
  .incl__no {
    grid-template-columns: 1fr;
  }

  .incluso__intro {
    align-items: start;
    gap: 18px;
  }

  .incluso__intro .lead {
    justify-self: start;
  }

  .incl__manifest {
    padding-right: 0;
  }

  .incl__playtime {
    min-height: 410px;
  }

  .incl__playtime-copy {
    max-width: 42ch;
  }

  .incl__no {
    gap: 28px;
  }
}

@media (max-width: 680px) {
  .incluso__intro h2 {
    max-width: 14ch;
    font-size: 1.125rem;
  }

  .incl__manifest {
    padding: 30px 0 18px;
  }

  .incl__manifest h3 {
    max-width: 9ch;
    margin-bottom: 34px;
    font-size: clamp(2.75rem, 13vw, 3.9rem);
  }

  .incl__manifest ul,
  .incl__no ul {
    grid-template-columns: 1fr;
  }

  .incl__manifest li {
    min-height: 0;
    padding: 17px 0 20px;
  }

  .incl__playtime {
    min-height: 360px;
    padding: 30px 24px 34px;
  }

  #incluso .incl__callout h3 {
    font-size: clamp(3.15rem, 17vw, 4.25rem);
  }

  .incl__playtime-copy {
    margin-top: 32px;
  }

  .incl__no {
    gap: 28px;
  }
}

@media (prefers-reduced-motion: reduce) {

  .incl__manifest li,
  .incl__index {
    transition: none;
  }

  .incl__manifest li:hover {
    transform: none;
  }
}

#itinerario {
  background: radial-gradient(85% 65% at 22% 38%, rgba(123, 31, 162, 0.07) 0%, rgba(123, 31, 162, 0) 60%),
    var(--surface-1);
  color: var(--ink-strong);
}

#itinerario h2 {
  color: var(--ink-strong);
}

#itinerario .lead {
  color: var(--ink-soft);
}

#itinerario .eyebrow {
  color: var(--action-strong);
}

.itin {
  display: grid;
  grid-template-columns: minmax(0px, 1.05fr) minmax(0px, 0.95fr);
  gap: clamp(24px, 4vw, 64px);
  align-items: center;
}

.itin__map {
  margin: 0px;
  position: relative;
}

.route {
  display: block;
  width: 100%;
  height: auto;
  overflow: hidden;
  border-radius: var(--r-lg);
}

.route__seabg {
  fill: rgba(0, 174, 239, 0.1);
}

.route__land {
  fill: rgba(13, 34, 66, 0.12);
}

.route__coast {
  fill: none;
  stroke: var(--line-mid);
  stroke-width: 2;
  stroke-dasharray: 3, 9;
  stroke-linecap: round;
}

.route__region {
  fill: var(--ink-faint);
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-anchor: middle;
  opacity: 0.55;
}

.route__sea {
  fill: var(--action-strong);
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-anchor: middle;
  opacity: 0.6;
}

.route__wake {
  fill: none;
  stroke: var(--kriativa-purple);
  stroke-width: 12;
  stroke-linecap: round;
  opacity: 0.14;
  filter: blur(4px);
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
}

.route__line {
  fill: none;
  stroke: url("#routeGrad");
  stroke-width: 3.5;
  stroke-linecap: round;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
}

.route__ship {
  offset-path: path("M 180 281 C 250 430 230 540 340 520 C 430 505 470 430 470 322");
  offset-distance: 0%;
  offset-rotate: auto;
  color: var(--ocean-abyss);
}

.route__ship path {
  stroke: currentColor;
  transform: translateY(-11px) scale(1.3);
  transform-box: fill-box;
  transform-origin: center;
}

.route__port-ring {
  fill: none;
  stroke: var(--ocean-blue);
  stroke-width: 2;
}

.route__port-ring--gold {
  stroke: var(--sunset-deep);
}

.route__port-dot {
  fill: var(--ocean-blue);
}

.route__port-dot--gold {
  fill: var(--sunset-deep);
}

.route__label {
  text-anchor: middle;
  font-family: var(--font-display);
}

.route__label--port {
  fill: var(--ink-strong);
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.route__label--sub {
  fill: var(--ink-faint);
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.02em;
}

.itin__days {
  list-style: none;
  margin: 0px;
  padding: 0px;
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.itin__days::before {
  content: "";
  position: absolute;
  left: 21px;
  top: 22px;
  bottom: 22px;
  width: 2px;
  background: linear-gradient(var(--ocean-blue) 0%, var(--kriativa-purple) 48%, var(--sunset-deep) 100%);
  opacity: 0.35;
}

.iday {
  position: relative;
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: var(--sp-sm);
  padding: 14px 0px;
  align-items: start;
}

.iday__marker {
  position: relative;
  z-index: 1;
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--surface-0);
  border: 2px solid var(--ocean-blue);
  color: var(--ocean-blue);
  box-shadow: 0 0 0 6px var(--surface-1);
}

.iday__marker svg {
  width: 20px;
  height: 20px;
}

.iday--dest .iday__marker {
  border-color: var(--sunset-deep);
  color: var(--sunset-deep);
}

.iday--sail .iday__marker {
  border-color: var(--kriativa-purple);
  color: var(--kriativa-purple);
  box-shadow: 0 0 0 6px var(--surface-1), 0 6px 20px rgba(123, 31, 162, 0.28);
}

.iday__date {
  display: inline-block;
  font-family: var(--font-display);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--action-strong);
}

.iday--dest .iday__date {
  color: var(--sunset-deep);
}

.iday--sail .iday__date {
  color: var(--action-strong);
}

.iday__title {
  margin: 4px 0px 6px;
  font-size: 1.22rem;
  line-height: 1.2;
  color: var(--ink-strong);
}

.iday__text {
  margin: 0px;
  color: var(--ink-soft);
  font-size: 0.98rem;
  line-height: 1.55;
  max-width: 46ch;
}

.iday__text b {
  color: var(--action-strong);
  font-weight: 700;
}

.itin .route__wake,
.itin .route__line {
  transition: stroke-dashoffset 3900ms var(--ease-quart);
}

.reveal.is-in .itin__map .route__line,
.reveal.is-in .route__line {
  stroke-dashoffset: 0;
}

.reveal.is-in .route__wake {
  stroke-dashoffset: 0;
}

.route__ship {
  opacity: 0;
}

.reveal.is-in .route__ship {
  animation: shipSail 3900ms var(--ease-quart) forwards;
}

@keyframes shipSail {
  0% {
    offset-distance: 0%;
    opacity: 0;
  }

  8% {
    opacity: 1;
  }

  54% {
    opacity: 1;
  }

  66% {
    opacity: 0;
  }

  100% {
    offset-distance: 100%;
    opacity: 0;
  }
}

.itin__days .iday {
  opacity: 0;
  transform: translateY(14px);
}

.reveal.is-in .itin__days .iday {
  animation: idayIn 560ms var(--ease-quart) both;
  animation-delay: calc(280ms + var(--i) * 130ms);
}

@keyframes idayIn {
  100% {
    opacity: 1;
    transform: none;
  }
}

@media (max-width: 860px) {
  .itin {
    grid-template-columns: 1fr;
    gap: var(--sp-lg);
  }
}

@media (prefers-reduced-motion: reduce) {

  .itin .route__wake,
  .itin .route__line {
    transition: none;
    stroke-dashoffset: 0;
  }

  .route__ship {
    display: none;
  }

  .itin__days .iday {
    opacity: 1;
    transform: none;
    animation: auto ease 0s 1 normal none running none;
  }
}

.price-grid-wrap {
  position: relative;
  width: 100%;
}

.price-stamp-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  user-select: none;
  z-index: 10;
  padding: var(--sp-md);
}

.price-stamp-badge {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  transform: rotate(-12deg);
  border: 4px solid #dc2626;
  outline: 2px dashed #dc2626;
  outline-offset: -7px;
  border-radius: 8px;
  padding: clamp(10px, 2.2vw, 18px) clamp(24px, 4.5vw, 48px);
  background: rgba(255, 255, 255, 0.78);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  box-shadow: 0 14px 40px rgba(220, 38, 38, 0.22),
              inset 0 0 0 1px rgba(220, 38, 38, 0.35);
  pointer-events: none;
  user-select: none;
  max-width: 90%;
  box-sizing: border-box;
}

.price-stamp-badge__inner {
  font-family: var(--font-display);
  font-size: clamp(2rem, 5.5vw, 3.8rem);
  font-weight: 900;
  letter-spacing: 0.18em;
  text-indent: 0.18em;
  text-transform: uppercase;
  color: #dc2626;
  line-height: 1;
  text-shadow: 1px 1px 0 rgba(185, 28, 28, 0.4);
  white-space: nowrap;
}

@media (max-width: 680px) {
  .price-stamp-badge {
    padding: 8px 20px;
    outline-offset: -5px;
  }
  .price-stamp-badge__inner {
    font-size: clamp(1.65rem, 6.5vw, 2.2rem);
    letter-spacing: 0.14em;
    text-indent: 0.14em;
  }
}

.price-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--sp-md);
  align-items: stretch;
}

.price-slider__controls {
  display: none;
}

@media (max-width: 1024px) {
  .value-panel .price-grid {
    display: flex;
    gap: var(--sp-md);
    align-items: stretch;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 2px;
    padding: 8px 2px 20px;
    scrollbar-width: none;
  }

  .value-panel .price-grid::-webkit-scrollbar {
    display: none;
  }

  .value-panel .price-grid>.price-card {
    flex: 0 0 calc((100% - var(--sp-md)) / 2);
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }

  .price-slider__controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
    margin-top: 4px;
  }

  .price-slider__dot {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
  }

  .price-slider__dot::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.38);
    transform: scale(1);
    transition: transform var(--dur-fast) var(--ease-quart), background var(--dur-fast) var(--ease-quart);
  }

  .price-slider__dot[aria-current="true"]::before {
    transform: scale(1.25);
    background: var(--foam-white);
  }

  .price-slider__dot:hover::before {
    background: var(--foam-white);
  }

  .price-slider__dot:focus-visible {
    outline: 2px solid var(--foam-white);
    outline-offset: -8px;
    border-radius: 50%;
  }
}

@media (max-width: 680px) {
  .value-panel .price-grid>.price-card {
    flex-basis: min(88%, 340px);
  }
}

.price-card {
  position: relative;
  background: var(--foam-white);
  border: 1px solid var(--line-soft);
  border-radius: var(--r-lg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: rgba(13, 41, 78, 0.12) 0px 20px 50px;
  transition: transform var(--dur-state) var(--ease-quart), box-shadow var(--dur-state) var(--ease-quart);
}

.price-card:hover {
  transform: translateY(-6px);
  box-shadow: rgba(13, 41, 78, 0.18) 0px 28px 64px;
}

.price-card__head {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 30px 28px 42px;
  background: linear-gradient(135deg, var(--kriativa-purple) 0%, var(--kriativa-purple-deep) 100%);
  color: var(--foam-white);
  clip-path: polygon(0px 0px, 100% 0px, 100% 78%, 0px 100%);
}

.price-card__cabin {
  font-size: 0.75rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.82);
}

.price-card__type {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 1.7rem;
  line-height: 1.05;
  margin-top: 2px;
  min-height: calc(3.57rem);
  display: flex;
  align-items: flex-start;
}

.price-card__body {
  padding: 8px 28px 28px;
  display: flex;
  flex-direction: column;
  flex: 1 1 0%;
  color: var(--ink-on-light);
}

.price-card__from {
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgb(90, 100, 120);
  font-weight: 700;
}

/* Preço promocional: valor antigo riscado acima do preço em destaque */
.price-card__was {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  font-size: 0.85rem;
  font-weight: 600;
  color: rgb(90, 100, 120);
}

.price-card__was s {
  color: rgb(90, 100, 120);
  text-decoration-color: var(--kriativa-magenta);
  text-decoration-thickness: 2px;
}

.price-card__was::after {
  content: "Promoção";
  padding: 3px 10px;
  border-radius: 999px;
  background: var(--kriativa-magenta);
  color: #fff;
  font-family: var(--font-display);
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.price-card__value {
  font-family: var(--font-display);
  font-weight: 800;
  line-height: 1;
  color: var(--ink-on-light);
  font-variant-numeric: tabular-nums;
  display: flex;
  align-items: flex-end;
  gap: 8px;
  margin-top: 6px;
}

.price-card__value .amount {
  font-size: clamp(2.6rem, 4vw, 3.2rem);
}

.price-card__value .cur {
  font-size: 1rem;
  font-weight: 700;
  color: rgb(90, 100, 120);
  margin-bottom: 8px;
}

.price-card__value .per {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 0.85rem;
  color: rgb(90, 100, 120);
  margin-bottom: 6px;
}

.price-card--sold .price-card__value,
.price-card__value--sold {
  color: #828f9f;
  opacity: 0.7;
}

.price-card--sold .price-card__value .cur,
.price-card--sold .price-card__value .per,
.price-card--sold .price-card__value .dec,
.price-card__value--sold .cur,
.price-card__value--sold .per,
.price-card__value--sold .dec {
  color: #9aa7b7;
  opacity: 0.85;
}

/* Discreet decimals (,00) on cabine prices — smaller, less prominent than the main number */
#panel-cabines .price-card__value .amount .dec,
#panel-bebidas .price-card__value .amount .dec {
  font-size: 0.42em;
  font-weight: 700;
  color: rgb(90, 100, 120);
  margin-left: 1px;
}

#panel-cabines .price-card__list li span .dec {
  font-size: 0.78em;
  font-weight: 500;
  opacity: 0.6;
}

.price-card__entry {
  font-size: 0.88rem;
  color: rgb(90, 100, 120);
  margin-top: 6px;
}

.price-card__rule {
  height: 1px;
  background: rgb(227, 232, 240);
  margin: 20px 0px;
}

.price-card__list {
  list-style: none;
  padding: 0px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.price-card__list li {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  font-size: 0.95rem;
  color: rgb(56, 65, 90);
}

.price-card__list li span:last-child:not(:first-child) {
  font-weight: 700;
  color: var(--ink-on-light);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.price-card__list li.is-sold {
  color: rgb(107, 116, 136);
}

.price-card__list li.is-sold span:last-child {
  color: var(--kriativa-magenta);
  font-weight: 700;
  text-transform: uppercase;
  font-size: 0.7rem;
  letter-spacing: 0.1em;
}

.price-card .btn {
  margin-top: auto;
  width: 100%;
}

.price-card__list {
  margin-bottom: 24px;
}

.price-card--featured {
  outline: 2px solid var(--action-ink);
  outline-offset: 0px;
}

.price-card__flag {
  position: absolute;
  top: 0px;
  right: 0px;
  z-index: 3;
  padding: 7px 16px;
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  background: var(--sunset-gold);
  color: var(--ocean-abyss);
  border-bottom-left-radius: var(--r-sm);
}

.price-card--featured .price-card__type {
  max-width: 76%;
}

.price-card__details {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  margin-top: auto;
  margin-bottom: 10px;
  background: none;
  border-color: transparent;
  padding: 4px 0px;
  align-self: center;
  font-family: var(--font-body);
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ocean-blue);
  cursor: pointer;
  transition: color var(--dur-fast) var(--ease-quart), border-color var(--dur-fast) var(--ease-quart);
}

.price-card__details:hover {
  color: var(--action-hover);
}

.price-card__details:focus-visible {
  outline: 2px solid var(--ocean-blue);
  outline-offset: 3px;
  border-radius: 2px;
}

.price-card__details+.btn {
  margin-top: 0px;
}

/* Aviso de disponibilidade de cabines e valores sob consulta */
.cabins-alert {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px 20px;
  margin-top: clamp(16px, 2.5vw, 24px);
  margin-bottom: clamp(12px, 2vw, 18px);
  padding: 14px 20px;
  background: linear-gradient(135deg, rgba(229, 0, 126, 0.14) 0%, rgba(123, 31, 162, 0.16) 50%, rgba(4, 29, 58, 0.8) 100%);
  border: 1px solid rgba(229, 0, 126, 0.35);
  border-radius: var(--r-md, 12px);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 6px 24px rgba(4, 29, 58, 0.35), 0 0 16px rgba(229, 0, 126, 0.1);
  position: relative;
  overflow: hidden;
}

.cabins-alert__main {
  flex: 1 1 300px;
  display: flex;
  align-items: center;
  gap: 12px;
}

.cabins-alert__icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.15);
  color: var(--sunset-gold, #ffc20e);
}

.cabins-alert__text {
  margin: 0px;
  font-family: var(--font-body, system-ui, sans-serif);
  font-size: 0.94rem;
  line-height: 1.45;
  color: var(--foam-white, #ffffff);
}

.cabins-alert__link {
  color: var(--sunset-gold, #ffc20e);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color var(--dur-fast, 180ms) ease;
}

.cabins-alert__link:hover {
  color: var(--ocean-cyan, #29c3f5);
}

.cabins-alert__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 9px 18px;
  border-radius: var(--r-pill, 999px);
  background: #25d366;
  color: #041d3a;
  font-family: var(--font-body, system-ui, sans-serif);
  font-size: 0.88rem;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 4px 14px rgba(37, 211, 102, 0.32);
  white-space: nowrap;
  flex-shrink: 0;
  transition: transform var(--dur-fast, 180ms) ease, box-shadow var(--dur-fast, 180ms) ease, background-color var(--dur-fast, 180ms) ease;
}

.cabins-alert__btn:hover {
  background: #20ba59;
  color: #041d3a;
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(37, 211, 102, 0.42);
}

.cabins-alert__btn:active {
  transform: translateY(0px);
}

.cabins-alert__btn .btn__wa {
  width: 1.15em;
  height: 1.15em;
  fill: #041d3a;
}

@media (max-width: 860px) {
  .cabins-alert {
    padding: 12px 14px;
    gap: 10px;
    margin-top: 14px;
    margin-bottom: 12px;
    border-radius: 10px;
  }
  .cabins-alert__main {
    gap: 10px;
    align-items: flex-start;
    flex: 1 1 100%;
    width: 100%;
  }
  .cabins-alert__icon {
    width: 26px;
    height: 26px;
    border-radius: 6px;
    margin-top: 2px;
  }
  .cabins-alert__icon svg {
    width: 15px;
    height: 15px;
  }
  .cabins-alert__text {
    font-size: 0.82rem;
    line-height: 1.4;
  }
  .cabins-alert__btn {
    width: 100%;
    padding: 8px 14px;
    font-size: 0.82rem;
    min-height: 38px;
    border-radius: 8px;
    margin-top: 2px;
  }
}

/* Pacotes de bebidas: acento laranja no lugar do roxo (escopo #panel-bebidas) */
#panel-bebidas .price-card__head {
  background: linear-gradient(135deg, #f7941e 0%, #d97706 100%);
}

#panel-bebidas .price-card__details {
  color: #d97706;
}

#panel-bebidas .price-card__details:hover {
  color: #b45f09;
}

#panel-bebidas .price-card--featured {
  outline-color: #f7941e;
}

/* "Ver detalhes" das bebidas: botão sólido laranja (estilo btn--primary) */
#panel-bebidas .price-card__details.btn--primary {
  margin-top: auto;
  margin-bottom: 0;
  align-self: stretch;
  background: #f7941e;
  color: var(--foam-white);
  border: none;
  border-radius: var(--r-pill);
  padding: 16px 32px;
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
}

#panel-bebidas .price-card__details.btn--primary:hover {
  background: #d97706;
  color: var(--foam-white);
  border-bottom-color: transparent;
  transform: translateY(-2px);
  box-shadow: rgba(247, 148, 30, 0.42) 0px 12px 30px;
}

#panel-bebidas .price-card__details.btn--primary:active {
  transform: translateY(0px);
}

#panel-bebidas .btn--primary {
  background: #f7941e;
  color: var(--foam-white);
}

#panel-bebidas .btn--primary:hover {
  background: #d97706;
  color: var(--foam-white);
  box-shadow: rgba(247, 148, 30, 0.42) 0px 12px 30px;
}

#tab-bebidas[aria-selected="true"] {
  background: linear-gradient(135deg, #f7941e, #d97706);
  color: #fff;
  box-shadow: 0 6px 20px -8px rgba(247, 148, 30, 0.9);
}

/* Abas de valores (cabines | bebidas) */
.value-tabs {
  display: flex;
  gap: 4px;
  width: max-content;
  max-width: 100%;
  margin: 0 auto var(--sp-md);
  padding: 5px;
  border-radius: 999px;
  background: rgba(133, 201, 245, 0.1);
  border: 1px solid rgba(133, 201, 245, 0.18);
}

.value-tab {
  appearance: none;
  border: 0;
  background: none;
  padding: 10px 22px;
  border-radius: 999px;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 0.9rem;
  letter-spacing: 0.02em;
  color: rgba(255, 255, 255, 0.72);
  cursor: pointer;
  transition: background var(--dur-state) var(--ease-quart), color var(--dur-state) var(--ease-quart);
}

.value-tab:hover {
  color: #fff;
}

.value-tab[aria-selected="true"] {
  background: linear-gradient(135deg, var(--kriativa-purple), var(--kriativa-purple-deep));
  color: #fff;
  box-shadow: 0 6px 20px -8px rgba(123, 31, 162, 0.9);
}

.value-tab:focus-visible {
  outline: 2px solid var(--sunset-gold);
  outline-offset: 3px;
}

.value-panel:focus-visible {
  outline: none;
}

.cabin-modal {
  margin: auto;
  border: 0px;
  padding: 0px;
  max-width: min(560px, 92vw);
  width: 100%;
  border-radius: var(--r-lg);
  background: var(--surface-0);
  color: var(--ink-strong);
  box-shadow: rgba(4, 22, 44, 0.5) 0px 40px 120px;
  overflow: hidden;
}

.cabin-modal__figure {
  position: relative;
  margin: 0px;
  aspect-ratio: 16 / 9;
  background: var(--fill-mid);
  overflow: hidden;
}

.cabin-modal__figure img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.cabin-modal__figure::after {
  content: "";
  position: absolute;
  inset: 0px;
  background: linear-gradient(rgba(4, 22, 44, 0.28) 0%, rgba(4, 22, 44, 0) 34%);
  pointer-events: none;
}

.cabin-modal::backdrop {
  background: rgba(4, 22, 44, 0.62);
  backdrop-filter: blur(3px);
}

.cabin-modal__inner {
  position: relative;
  padding: 0px;
  max-height: 88vh;
  overflow-y: auto;
}

.cabin-modal__content {
  padding: clamp(24px, 4.5vw, 40px);
}

.cabin-modal__close {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 2;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, 0.55);
  border-radius: 50%;
  background: rgba(4, 22, 44, 0.42);
  backdrop-filter: blur(6px);
  color: var(--foam-white);
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-quart), border-color var(--dur-fast) var(--ease-quart);
}

.cabin-modal__close svg {
  width: 20px;
  height: 20px;
}

.cabin-modal__close:hover {
  background: var(--action-ink);
  border-color: var(--action-ink);
}

.cabin-modal__close:focus-visible {
  outline: 2px solid var(--foam-white);
  outline-offset: 2px;
}

.cabin-modal__eyebrow {
  display: block;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--action-strong);
  margin-bottom: 6px;
}

.cabin-modal__title {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: clamp(1.6rem, 3.5vw, 2.1rem);
  line-height: 1.05;
  max-width: 88%;
}

.cabin-modal__lead {
  margin-top: 10px;
  color: var(--ink-soft);
  font-size: 1.02rem;
}

.cabin-modal__body {
  margin-top: 20px;
}

.cabin-modal__body h4 {
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--ink-strong);
  margin: 18px 0px 8px;
}

.cabin-modal__body ul {
  list-style: none;
  padding: 0px;
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.cabin-modal__body li {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px;
  align-items: start;
  color: var(--ink-soft);
  font-size: 0.95rem;
  line-height: 1.45;
}

.cabin-modal__body li::before {
  content: "";
  width: 7px;
  height: 7px;
  margin-top: 8px;
  border-radius: 2px;
  background: var(--ocean-blue);
  flex: 0 0 auto;
}

.cabin-modal__note {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--line-soft);
  color: var(--ink-faint);
  font-size: 0.8rem;
  line-height: 1.5;
}

.cabin-modal__currency-hint {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 8px;
  margin-top: 10px;
  padding: 8px 12px;
  border-radius: 6px;
  background: rgba(0, 174, 239, 0.08);
  border: 1px solid rgba(0, 174, 239, 0.18);
  color: var(--ink-faint, #666);
  font-size: 0.76rem;
  line-height: 1.4;
}

.cabin-modal__currency-hint strong {
  color: var(--ocean-abyss, #041d3a);
  font-weight: 700;
}

.cabin-modal__cta {
  margin-top: 22px;
  width: 100%;
}

/* O atributo hidden precisa vencer o display:inline-flex herdado de .btn */
.cabin-modal__cta[hidden] {
  display: none;
}

.insurance-modal {
  max-width: min(780px, 92vw);
}

.insurance-modal .cabin-modal__content {
  padding-top: clamp(54px, 7vw, 64px);
}

.insurance-modal .cabin-modal__close {
  background: var(--ocean-navy);
  border-color: var(--ocean-navy);
}

.insurance-modal .cabin-modal__title {
  max-width: 90%;
}

.insurance-coverage {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 24px;
}

.insurance-coverage__group {
  padding: 18px;
  border: 1px solid var(--line-soft);
  border-radius: var(--r-md);
  background: var(--surface-1);
}

.insurance-coverage__group:last-child {
  grid-column: 1 / -1;
}

.insurance-coverage__group h4 {
  margin: 0 0 12px;
  color: var(--kriativa-purple);
  font-family: var(--font-display);
  font-size: 1rem;
  letter-spacing: 0.02em;
}

.insurance-coverage__group dl {
  display: grid;
  gap: 0;
  margin: 0;
}

.insurance-coverage__group dl div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  padding: 9px 0;
  border-top: 1px solid var(--line-soft);
}

.insurance-coverage__group dt,
.insurance-coverage__group dd {
  margin: 0;
  font-size: 0.84rem;
  line-height: 1.35;
}

.insurance-coverage__group dt {
  color: var(--ink-soft);
}

.insurance-coverage__group dd {
  color: var(--ink-strong);
  font-weight: 800;
  white-space: nowrap;
}

.insurance-coverage--guidance .insurance-coverage__group dl div {
  grid-template-columns: 1fr;
  gap: 6px;
}

.insurance-coverage--guidance dt {
  font-weight: 700;
}

.insurance-coverage--guidance dd {
  font-weight: 400;
  white-space: normal;
}

@media (max-width: 680px) {
  .insurance-coverage {
    grid-template-columns: 1fr;
  }

  .insurance-coverage__group:last-child {
    grid-column: auto;
  }
}

/* Escopo bebidas: acento laranja (#f7941e) no modal compartilhado */
.cabin-modal[data-kind="bebida"] .cabin-modal__eyebrow {
  color: #d97706;
}

.cabin-modal[data-kind="bebida"] .cabin-modal__close:hover {
  background: #d97706;
  border-color: #d97706;
}

.cabin-modal[data-kind="bebida"] .cabin-modal__cta.btn--primary {
  background: #f7941e;
}

.cabin-modal[data-kind="bebida"] .cabin-modal__cta.btn--primary:hover {
  background: #d97706;
}

@media (prefers-reduced-motion: no-preference) {
  .cabin-modal[open] {
    animation: cabinModalIn 260ms var(--ease-expo);
  }

  @keyframes cabinModalIn {
    0% {
      opacity: 0;
      transform: translateY(12px) scale(0.98);
    }

    100% {
      opacity: 1;
      transform: none;
    }
  }
}

.cabin-tour-btn {
  position: absolute;
  left: 14px;
  bottom: 14px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 10px 16px 10px 13px;
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: var(--r-pill);
  background: rgba(4, 22, 44, 0.5);
  backdrop-filter: blur(8px);
  color: var(--foam-white);
  font-family: var(--font-body);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-quart), transform var(--dur-fast) var(--ease-quart), border-color var(--dur-fast) var(--ease-quart);
}

.cabin-tour-btn[hidden] {
  display: none;
}

.cabin-tour-btn svg {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
}

.cabin-tour-btn:hover {
  background: var(--action-ink);
  border-color: var(--action-ink);
  transform: translateY(-1px);
}

.cabin-tour-btn:focus-visible {
  outline: 2px solid var(--foam-white);
  outline-offset: 2px;
}

.tour360 {
  margin: auto;
  width: min(1180px, 94vw);
  max-width: 94vw;
  height: min(760px, 90vh);
  padding: 0px;
  border: 0px;
  border-radius: var(--r-lg);
  background: var(--tour-bg);
  color: var(--foam-white);
  box-shadow: rgba(4, 22, 44, 0.6) 0px 50px 140px;
  overflow: hidden;
}

.tour360::backdrop {
  background: rgba(20, 6, 38, 0.82);
  backdrop-filter: blur(6px);
}

.tour360__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 12px 12px 20px;
  background: var(--tour-surface);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.tour360__label {
  font-family: var(--font-display);
  font-size: clamp(1.15rem, 0.95rem + 0.85vw, 1.75rem);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.01em;
  text-transform: none;
  color: var(--foam-white);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tour360__actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.tour360__icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  flex: 0 0 auto;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 50%;
  background: transparent;
  color: var(--foam-white);
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-quart), border-color var(--dur-fast) var(--ease-quart);
}

.tour360__icon-btn svg {
  width: 20px;
  height: 20px;
}

.tour360__maximize:hover {
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.5);
}

.tour360__icon-min {
  display: none;
}

.tour360.is-maximized .tour360__maximize .tour360__icon-max,
.shiptour.is-maximized .shiptour__maximize .tour360__icon-max {
  display: none;
}

.tour360.is-maximized .tour360__maximize .tour360__icon-min,
.shiptour.is-maximized .shiptour__maximize .tour360__icon-min {
  display: block;
}

.tour360__close:hover {
  background: var(--kriativa-magenta);
  border-color: var(--kriativa-magenta);
}

.tour360__icon-btn:focus-visible {
  outline: 2px solid var(--purple-glow);
  outline-offset: 2px;
}

.tour360.is-maximized {
  inset: 0px;
  width: 100vw;
  max-width: 100vw;
  height: 100dvh;
  max-height: 100dvh;
  margin: 0px;
  border-radius: 0px;
}

.tour360__stage {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: calc(100% - 65px);
  background: var(--tour-bg);
  --tour-crop-right: 45px;
  --tour-crop-bottom: 60px;
}

.tour360__frame {
  position: absolute;
  z-index: 1;
  top: 0px;
  left: 0px;
  display: block;
  width: calc(100% + var(--tour-crop-right));
  height: calc(100% + var(--tour-crop-bottom));
  border: 0px;
}

.tour360__spinner {
  position: absolute;
  inset: 0px;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: clamp(18px, 3vw, 26px);
  background: var(--tour-bg);
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--dur-state) var(--ease-quart), visibility var(--dur-state) var(--ease-quart);
}

.tour360__stage.is-loading .tour360__spinner {
  opacity: 1;
  visibility: visible;
}

.tour360__spinner::after {
  content: "Carregando ambiente…";
  font-size: clamp(1.05rem, 1rem + 1.2vw, 1.5rem);
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--ink-invert-soft);
}

.tour360__spinner-dots {
  display: flex;
  gap: clamp(12px, 2vw, 18px);
}

.tour360__spinner span {
  width: clamp(16px, 1.2rem + 0.8vw, 24px);
  height: clamp(16px, 1.2rem + 0.8vw, 24px);
  border-radius: 50%;
  background: var(--magenta-glow);
  opacity: 0.35;
  animation: tour360Pulse 1s var(--ease-quart) infinite;
}

.tour360__spinner span:nth-child(2) {
  animation-delay: 0.15s;
}

.tour360__spinner span:nth-child(3) {
  animation-delay: 0.3s;
}

@keyframes tour360Pulse {

  0%,
  100% {
    opacity: 0.3;
    transform: scale(0.85);
  }

  50% {
    opacity: 1;
    transform: scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .tour360__spinner span {
    animation: auto ease 0s 1 normal none running none;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .tour360[open] {
    animation: tour360In 280ms var(--ease-expo);
  }

  @keyframes tour360In {
    0% {
      opacity: 0;
      transform: scale(0.97);
    }

    100% {
      opacity: 1;
      transform: none;
    }
  }
}

@media (max-width: 640px) {
  .tour360 {
    width: 100vw;
    max-width: 100vw;
    height: 100dvh;
    border-radius: 0px;
  }

  .tour360__maximize {
    display: none;
  }
}

.ship-video__tour-btn {
  position: absolute;
  top: clamp(16px, 3vw, 28px);
  right: clamp(16px, 3vw, 28px);
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 15px 28px;
  border: 0px;
  border-radius: var(--r-pill);
  background: var(--kriativa-magenta);
  color: var(--foam-white);
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
  box-shadow: rgba(229, 0, 126, 0.35) 0px 10px 30px;
  animation: ship-tour-btn-float 3.6s ease-in-out infinite;
  transition: transform var(--dur-state) var(--ease-quart), box-shadow var(--dur-state) var(--ease-quart), background var(--dur-fast) var(--ease-quart);
}

.ship-video__tour-btn svg {
  width: 22px;
  height: 22px;
}

.ship-video__tour-btn:hover {
  animation-play-state: paused;
  transform: translateY(-3px) scale(1.015);
  background: var(--magenta-glow);
  box-shadow: rgba(229, 0, 126, 0.45) 0px 16px 40px;
}

@keyframes ship-tour-btn-float {

  0%,
  100% {
    transform: translateY(0);
    box-shadow: rgba(229, 0, 126, 0.30) 0px 10px 30px;
  }

  50% {
    transform: translateY(-5px);
    box-shadow: rgba(229, 0, 126, 0.42) 0px 16px 38px;
  }
}

.ship-video__tour-btn:focus-visible {
  outline: 2px solid var(--foam-white);
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  .ship-video__tour-btn {
    animation: none;
  }

  .ship-video__tour-btn:hover {
    transform: none;
  }
}

.ship-video__play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  display: grid;
  place-items: center;
  width: clamp(72px, 9vw, 104px);
  height: clamp(72px, 9vw, 104px);
  padding: 0px;
  border: 0px;
  border-radius: 50%;
  background: color-mix(in oklab, var(--foam-white) 92%, transparent);
  color: var(--dark-navy, #062038);
  cursor: pointer;
  box-shadow: rgba(4, 20, 40, 0.45) 0px 12px 40px;
  transition: transform var(--dur-state) var(--ease-quart), background var(--dur-fast) var(--ease-quart), box-shadow var(--dur-state) var(--ease-quart);
}

.ship-video__play-icon {
  width: 38%;
  height: 38%;
  position: relative;
  z-index: 1;
}

.ship-video__play-ring {
  position: absolute;
  inset: 0px;
  border-radius: 50%;
  border: 2px solid var(--foam-white);
  opacity: 0.75;
  animation: 2.4s ease-out 0s infinite normal none running play-pulse;
}

@keyframes play-pulse {
  0% {
    transform: scale(1);
    opacity: 0.7;
  }

  70% {
    transform: scale(1.5);
    opacity: 0;
  }

  100% {
    transform: scale(1.5);
    opacity: 0;
  }
}

.ship-video__play:hover {
  transform: translate(-50%, -50%) scale(1.06);
  background: var(--foam-white);
  box-shadow: rgba(4, 20, 40, 0.55) 0px 18px 52px;
}

.ship-video__play:focus-visible {
  outline: 3px solid var(--ocean-cyan, #5fd3e6);
  outline-offset: 4px;
}

@media (prefers-reduced-motion: reduce) {
  .ship-video__play-ring {
    animation: auto ease 0s 1 normal none running none;
  }

  .ship-video__play:hover {
    transform: translate(-50%, -50%);
  }
}

.videobox {
  margin: auto;
  width: min(1120px, 94vw);
  max-width: 94vw;
  padding: 0px;
  border: 0px;
  background: transparent;
  overflow: visible;
}

.videobox::backdrop {
  background: rgba(3, 14, 28, 0.86);
  backdrop-filter: blur(6px);
}

.videobox__frame {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: var(--r-lg, 18px);
  overflow: hidden;
  background: rgb(0, 0, 0);
  box-shadow: rgba(0, 0, 0, 0.6) 0px 30px 90px;
}

.videobox__frame iframe {
  position: absolute;
  inset: 0px;
  width: 100%;
  height: 100%;
  border: 0px;
}

.videobox__close {
  position: absolute;
  top: -14px;
  right: -14px;
  z-index: 3;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 0px;
  border-radius: 50%;
  background: var(--foam-white);
  color: var(--dark-navy, #062038);
  cursor: pointer;
  box-shadow: rgba(0, 0, 0, 0.4) 0px 8px 24px;
  transition: transform var(--dur-fast) var(--ease-quart), background var(--dur-fast) var(--ease-quart);
}

.videobox__close svg {
  width: 22px;
  height: 22px;
}

.videobox__close:hover {
  transform: scale(1.08);
  background: var(--ocean-cyan, #5fd3e6);
}

.videobox__close:focus-visible {
  outline: 3px solid var(--ocean-cyan, #5fd3e6);
  outline-offset: 3px;
}

@media (max-width: 560px) {
  .videobox__close {
    top: -46px;
    right: 0px;
  }
}

.shiptour {
  margin: auto;
  width: min(1280px, 96vw);
  max-width: 96vw;
  height: min(820px, 92vh);
  padding: 0px;
  border: 0px;
  border-radius: var(--r-lg);
  background: radial-gradient(90% 70% at 12% 0%, rgba(123, 31, 162, 0.10) 0%, rgba(123, 31, 162, 0) 56%),
    linear-gradient(180deg, var(--foam-white) 0%, var(--dark-navy) 100%);
  color: var(--foam-white);
  box-shadow: rgba(4, 22, 44, 0.34) 0px 50px 140px;
  overflow: hidden;
}

.shiptour::backdrop {
  background: rgba(20, 6, 38, 0.82);
  backdrop-filter: blur(6px);
}

.shiptour__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 14px 14px 24px;
  background: var(--dark-navy-2);
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.shiptour__label {
  font-family: var(--font-display);
  font-size: clamp(1.15rem, 0.95rem + 0.85vw, 1.75rem);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.01em;
  text-transform: none;
  color: var(--foam-white);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.shiptour__actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
}

.shiptour .tour360__icon-btn {
  border-color: rgba(255, 255, 255, 0.3);
  background: rgba(255, 255, 255, 0.08);
  color: var(--foam-white);
}

.shiptour__maximize:hover,
.shiptour__close:hover {
  background: rgba(255, 255, 255, 0.16);
  border-color: rgba(255, 255, 255, 0.5);
}

.shiptour__close:hover {
  background: var(--kriativa-magenta);
  border-color: var(--kriativa-magenta);
  color: var(--foam-white);
}

.shiptour__body {
  position: relative;
  display: grid;
  grid-template-columns: 264px 1fr;
  height: calc(100% - 65px);
}

.shiptour__nav {
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 16px 12px 24px;
  background: var(--dark-navy);
  border-right: 1px solid rgba(255, 255, 255, 0.12);
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, 0.4) transparent;
}

.shiptour__nav::-webkit-scrollbar {
  width: 8px;
}

.shiptour__nav::-webkit-scrollbar-track {
  background: transparent;
}

.shiptour__nav::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: padding-box rgba(255, 255, 255, 0.35);
  border: 2px solid transparent;
  transition: background var(--dur-fast) var(--ease-quart);
}

.shiptour__nav:hover::-webkit-scrollbar-thumb {
  background: padding-box rgba(255, 255, 255, 0.55);
}

.shiptour__group+.shiptour__group {
  margin-top: 6px;
}

.shiptour__group-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  padding: 10px 8px;
  border: 0px;
  border-radius: var(--r-md);
  background: transparent;
  color: rgba(255, 255, 255, 0.7);
  font-family: var(--font-body);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  text-align: left;
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-quart);
}

.shiptour__group-head:hover {
  background: rgba(255, 255, 255, 0.08);
}

.shiptour__group-head:focus-visible {
  outline: 2px solid var(--ocean-cyan);
  outline-offset: 2px;
}

.shiptour__chevron {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  transition: transform var(--dur-state) var(--ease-quart);
}

.shiptour__group.is-open .shiptour__chevron {
  transform: rotate(180deg);
}

.shiptour__group-panel {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows var(--dur-state) var(--ease-quart);
}

.shiptour__group-list {
  min-height: 0px;
  overflow: hidden;
}

.shiptour__group.is-open .shiptour__group-panel {
  grid-template-rows: 1fr;
}

.shiptour__group.is-open .shiptour__group-list {
  padding-top: 4px;
}

@media (prefers-reduced-motion: reduce) {

  .shiptour__group-panel,
  .shiptour__chevron {
    transition: none;
  }
}

.shiptour__item {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 8px;
  border: 1px solid transparent;
  border-radius: var(--r-md);
  background: transparent;
  color: rgba(255, 255, 255, 0.86);
  font-family: var(--font-body);
  font-size: 0.9rem;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-quart), color var(--dur-fast) var(--ease-quart);
}

.shiptour__item+.shiptour__item {
  margin-top: 2px;
}

.shiptour__item img {
  width: 72px;
  height: 44px;
  flex: 0 0 auto;
  object-fit: cover;
  border-radius: var(--r-sm);
  background: rgba(255, 255, 255, 0.08);
}

.shiptour__item:hover {
  background: rgba(255, 255, 255, 0.08);
  color: var(--foam-white);
}

.shiptour__item[aria-current="true"] {
  background: rgba(41, 195, 245, 0.16);
  border-color: rgba(41, 195, 245, 0.5);
  color: var(--foam-white);
}

.shiptour__item:focus-visible {
  outline: 2px solid var(--ocean-cyan);
  outline-offset: 2px;
}

.shiptour__stage {
  position: relative;
  overflow: hidden;
  background: var(--dark-navy);
  --tour-crop-right: 45px;
  --tour-crop-bottom: 60px;
}

.shiptour__frame {
  position: absolute;
  z-index: 1;
  top: 0px;
  left: 0px;
  display: block;
  width: calc(100% + var(--tour-crop-right));
  height: calc(100% + var(--tour-crop-bottom));
  border: 0px;
}

.shiptour__spinner {
  position: absolute;
  inset: 0px;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: clamp(18px, 3vw, 26px);
  background: var(--dark-navy);
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--dur-state) var(--ease-quart), visibility var(--dur-state) var(--ease-quart);
}

.shiptour__stage.is-loading .shiptour__spinner {
  opacity: 1;
  visibility: visible;
}

.shiptour__spinner::after {
  content: "Carregando ambiente…";
  font-size: clamp(1.05rem, 1rem + 1.2vw, 1.5rem);
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--foam-white);
}

.shiptour__spinner-dots {
  display: flex;
  gap: clamp(12px, 2vw, 18px);
}

.shiptour__spinner span {
  width: clamp(16px, 1.2rem + 0.8vw, 24px);
  height: clamp(16px, 1.2rem + 0.8vw, 24px);
  border-radius: 50%;
  background: var(--magenta-glow);
  opacity: 0.35;
  animation: tour360Pulse 1s var(--ease-quart) infinite;
}

.shiptour__spinner span:nth-child(2) {
  animation-delay: 0.15s;
}

.shiptour__spinner span:nth-child(3) {
  animation-delay: 0.3s;
}

.shiptour__nav-toggle {
  display: none;
  align-items: center;
  gap: 8px;
  margin: 12px 12px 0px;
  padding: 10px 14px;
  border: 1px solid rgba(123, 31, 162, 0.24);
  border-radius: var(--r-pill);
  background: var(--foam-white);
  color: var(--kriativa-purple);
  font-family: var(--font-body);
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
}

.shiptour__nav-toggle svg {
  width: 18px;
  height: 18px;
}

.shiptour.is-maximized {
  inset: 0px;
  width: 100vw;
  max-width: 100vw;
  height: 100dvh;
  max-height: 100dvh;
  margin: 0px;
  border-radius: 0px;
}

@media (prefers-reduced-motion: reduce) {
  .shiptour__spinner span {
    animation: auto ease 0s 1 normal none running none;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .shiptour[open] {
    animation: tour360In 280ms var(--ease-expo);
  }
}

@media (max-width: 860px) {
  .shiptour__body {
    grid-template-columns: 1fr;
    grid-template-rows: auto 1fr;
  }

  .shiptour__nav-toggle {
    display: inline-flex;
  }

  .shiptour__nav {
    display: none;
    border-right: 0px;
    border-bottom: 1px solid rgba(123, 31, 162, 0.14);
    max-height: 42vh;
  }

  .shiptour__nav.is-open {
    display: block;
  }

  .shiptour__maximize {
    display: none;
  }
}

.price-note {
  margin-top: var(--sp-lg);
  color: var(--ink-faint);
  font-size: 0.85rem;
  text-align: center;
}

.travel-insurance {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 6px 12px;
  margin-top: var(--sp-lg);
  color: var(--foam-white);
  text-align: center;
}

.price-note+.travel-insurance,
.travel-insurance+.price-note {
  margin-top: 14px;
}

.travel-insurance__label {
  font-weight: 800;
}

.travel-insurance__price {
  font-size: 0.95rem;
}

.travel-insurance__price strong {
  color: inherit;
  font: inherit;
  font-weight: 800;
}

.travel-insurance__link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 6px 2px;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
  transition: opacity var(--dur-fast) var(--ease-quart);
}

.travel-insurance__link:hover {
  opacity: 0.72;
}

.travel-insurance__link:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
  border-radius: 2px;
}

/* International Currency & Exchange Rate Notice in #valores */
.currency-notice {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 24px;
  margin-top: clamp(24px, 4vw, 36px);
  padding: 18px 22px;
  background: rgba(255, 255, 255, 0.04);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(0, 174, 239, 0.22);
  border-radius: 12px;
  color: var(--foam-white);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

.currency-notice__title {
  width: 100%;
  flex: 0 0 100%;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.98rem;
  font-weight: 700;
  color: var(--sunset-gold, #ffca28);
  padding-bottom: 2px;
}

.currency-notice__content {
  flex: 1 1 340px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.currency-notice__desc {
  margin: 0;
  font-size: 0.84rem;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.74);
}

.currency-notice__rates {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.currency-notice__rate-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: rgba(0, 174, 239, 0.1);
  border: 1px solid rgba(0, 174, 239, 0.28);
  border-radius: 8px;
  font-family: var(--font-body);
  font-size: 0.82rem;
  font-weight: 600;
  color: #6edaff;
  letter-spacing: 0.02em;
}

.currency-notice__rate-chip strong {
  color: #ffffff;
  font-weight: 700;
}

.currency-notice__live-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.72rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.6);
  padding: 2px 6px;
}

.currency-notice__dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #00e676;
  box-shadow: 0 0 6px #00e676;
  animation: pulseDot 2s infinite ease-in-out;
}

@keyframes pulseDot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.4; transform: scale(0.85); }
}

.quotes {
  columns: 300px 3;
  column-gap: var(--sp-md);
  margin-top: var(--sp-lg);
}

.quote {
  padding: 28px 28px 26px;
  border-radius: var(--r-lg);
  background: var(--fill-soft);
  border: 1px solid var(--line-soft);
  display: flex;
  flex-direction: column;
  gap: 16px;
  break-inside: avoid;
  margin-bottom: var(--sp-md);
  position: relative;
  overflow: hidden;
}

.quote::before {
  content: "“";
  position: absolute;
  top: -14px;
  right: 14px;
  font-family: var(--font-display);
  font-size: 5.5rem;
  line-height: 1;
  color: var(--ocean-cyan);
  opacity: 0.14;
  pointer-events: none;
}

.quote p {
  color: var(--ink-strong);
  position: relative;
  z-index: 1;
}

.quote footer {
  color: var(--action-ink);
  font-weight: 700;
  font-family: var(--font-display);
}

.quote footer span {
  display: block;
  color: var(--ink-faint);
  font-weight: 400;
  font-family: var(--font-body);
  font-size: 0.85rem;
}

/* #depoimentos overdrive: designers fixos + mosaico de vozes sorteadas */
#depoimentos {
  position: relative;
  isolation: isolate;
  overflow: clip;
  padding-block: clamp(76px, 8vw, 118px);
  text-align: left;
  background: radial-gradient(circle at 88% 12%, rgba(0, 174, 239, 0.13), #03a9f42e 29%), radial-gradient(circle at 7% 82%, rgba(41, 195, 245, 0.1), transparent 31%), linear-gradient(180deg, #fff 0%, #f3faff 54%, #fff 100%);
}

#depoimentos::before {
  content: "“";
  position: absolute;
  z-index: -1;
  top: -0.31em;
  right: -0.03em;
  color: rgba(0, 92, 137, 0.045);
  font-family: var(--font-display);
  font-size: min(54vw, 760px);
  line-height: 1;
  pointer-events: none;
}

.voices-tide {
  position: absolute;
  z-index: 0;
  right: 0;
  bottom: 2%;
  left: 0;
  width: 100%;
  height: min(36vw, 420px);
  pointer-events: none;
}

.voices-tide path {
  vector-effect: non-scaling-stroke;
  stroke-width: 1.25;
}

.voices-deck {
  position: relative;
  z-index: 1;
}

.voices-deck__head {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(310px, 0.85fr);
  align-items: end;
  gap: clamp(32px, 6vw, 88px);
}

#depoimentos .voices-deck__head h2 {
  max-width: 13ch;
  margin: 0;
  color: var(--ocean-abyss);
  font-size: clamp(3rem, 5.8vw, 5.25rem);
  line-height: 0.96;
  letter-spacing: -0.035em;
  text-wrap: balance;
}

.voices-deck__intro {
  display: grid;
  gap: 22px;
}

#depoimentos .voices-deck__intro .lead {
  max-width: 48ch;
  margin: 0;
  color: #315875;
  font-size: clamp(1rem, 1.45vw, 1.18rem);
  line-height: 1.7;
  text-wrap: pretty;
}

#depoimentos .voices {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: clamp(10px, 1.2vw, 16px);
  margin-top: clamp(34px, 5vw, 60px);
  columns: auto;
  perspective: 1400px;
}

#depoimentos .quote {
  grid-column: span 4;
  min-width: 0;
  margin: 0;
  padding: clamp(22px, 2.5vw, 34px);
  border: 1px solid rgba(0, 117, 169, 0.2);
  border-radius: 12px;
  background: #fff;
  transform-style: preserve-3d;
  transition: border-color 220ms var(--ease-quart);
}

#depoimentos .quote[hidden] {
  display: none;
}

#depoimentos .quote::before {
  top: -0.2em;
  right: 0.16em;
  color: var(--ocean-cyan);
  font-size: clamp(4.6rem, 8vw, 7rem);
  opacity: 0.1;
}

#depoimentos .quote p {
  max-width: 72ch;
  margin: 0;
  color: #173b57;
  font-size: clamp(0.93rem, 1.05vw, 1.02rem);
  line-height: 1.64;
  text-wrap: pretty;
}

#depoimentos .quote footer {
  margin-top: auto;
  color: var(--ocean-abyss);
  font-size: clamp(0.92rem, 1.1vw, 1.04rem);
  line-height: 1.25;
}

#depoimentos .quote footer span {
  margin-top: 5px;
  color: #276b8d;
  font-size: 0.82rem;
}

#depoimentos .quote--featured {
  min-height: clamp(250px, 22vw, 320px);
  border-color: rgba(123, 31, 162, 0.24);
  background: linear-gradient(145deg, #f4eafa, #fff 76%);
}

#depoimentos .quote--vital {
  grid-column: span 7;
}

#depoimentos .quote--david {
  grid-column: span 5;
  border-color: rgba(0, 143, 204, 0.26);
  background: linear-gradient(145deg, #e7f7ff, #fff 76%);
}

#depoimentos .quote--featured p {
  color: #102f49;
  font-size: clamp(1.12rem, 1.65vw, 1.38rem);
  line-height: 1.55;
}

#depoimentos .quote--david p {
  max-width: 25ch;
  font-size: clamp(1.28rem, 2vw, 1.7rem);
  line-height: 1.42;
}

#depoimentos .quote[data-voice-slot="1"] {
  grid-column: span 5;
}

#depoimentos .quote[data-voice-slot="2"] {
  grid-column: span 7;
}

#depoimentos .quote[data-voice-slot="3"] {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(160px, auto);
  align-items: end;
  gap: clamp(24px, 5vw, 72px);
}

#depoimentos .quote[data-voice-slot="3"] footer {
  margin-top: 0;
  text-align: right;
}

#depoimentos .quote__seal {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  align-self: flex-start;
  width: fit-content;
  padding: 6px 12px;
  border: 1px solid rgba(176, 121, 0, 0.42);
  border-radius: 999px;
  color: #735000;
  background: #fff6d9;
  font-family: var(--font-display);
  font-size: 0.68rem;
  letter-spacing: 0.11em;
  line-height: 1;
  text-transform: uppercase;
}

#depoimentos .quote__seal::before {
  content: "★";
  font-size: 0.72rem;
}

#depoimentos .quote__trans-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 10px;
  margin-bottom: 4px;
  padding: 3px 8px;
  border: 1px solid rgba(0, 117, 169, 0.2);
  border-radius: 6px;
  background: rgba(240, 248, 255, 0.7);
  color: #0b6994;
  font-family: inherit;
  font-size: 0.74rem;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  width: fit-content;
  text-decoration: none;
  transition: all 180ms ease;
  user-select: none;
}

#depoimentos .quote__trans-btn:hover {
  background: rgba(0, 117, 169, 0.12);
  border-color: rgba(0, 117, 169, 0.45);
  color: #004566;
}

#depoimentos .quote__trans-btn:focus-visible {
  outline: 2px solid var(--ocean-cyan);
  outline-offset: 2px;
}

#depoimentos .quote__trans-btn svg {
  width: 12px;
  height: 12px;
  opacity: 0.85;
  flex-shrink: 0;
}

.voices-expand {
  display: none;
  align-items: center;
  gap: 14px;
  margin: clamp(26px, 4vw, 42px) auto 0;
  padding: 0;
  border: 0;
  color: var(--ocean-abyss);
  background: transparent;
  font-family: var(--font-display);
  font-size: 0.95rem;
  letter-spacing: 0.06em;
}

.js .voices-expand {
  display: flex;
}

.voices-expand__icon {
  display: grid;
  width: 46px;
  height: 46px;
  place-items: center;
  border: 1px solid rgba(41, 195, 245, 0.72);
  border-radius: 50%;
  color: var(--ocean-cyan);
  font-family: var(--font-body);
  font-size: 1.5rem;
  font-weight: 300;
  transition: transform 360ms var(--ease-quart), background 240ms ease, color 240ms ease;
}

.voices-expand:hover .voices-expand__icon,
.voices-expand:focus-visible .voices-expand__icon {
  color: var(--ocean-abyss);
  background: var(--ocean-cyan);
  transform: rotate(90deg);
}

.voices-expand[aria-expanded="true"] .voices-expand__icon {
  transform: rotate(45deg);
}

.voices-expand:focus-visible {
  outline: 2px solid var(--sunset-gold);
  outline-offset: 8px;
}

@media (hover: hover) and (pointer: fine) {
  #depoimentos .quote:hover {
    border-color: rgba(0, 117, 169, 0.5);
  }
}

/* Profundidade por scroll aprimora um default totalmente visível. */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    #depoimentos .quote:not([hidden]) {
      animation: voice-rise linear both;
      animation-timeline: view();
      animation-range: entry 0% cover 38%;
    }

    @keyframes voice-rise {
      from {
        opacity: 0.62;
        transform: translateY(calc(18px + var(--depth, 1) * 8px)) rotateX(4deg);
      }

      to {
        opacity: 1;
        transform: translateY(0) rotateX(0deg);
      }
    }
  }
}

@media (max-width: 900px) {
  .voices-deck__head {
    grid-template-columns: 1fr;
    align-items: start;
    gap: 26px;
  }

  #depoimentos .voices-deck__head h2 {
    max-width: 15ch;
    font-size: clamp(2.8rem, 8vw, 4.6rem);
  }

  #depoimentos .voices {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #depoimentos .quote,
  #depoimentos .quote--vital,
  #depoimentos .quote--david,
  #depoimentos .quote[data-voice-slot="1"],
  #depoimentos .quote[data-voice-slot="2"] {
    grid-column: auto;
  }

  #depoimentos .quote[data-voice-slot="3"],
  #depoimentos .quote[data-voice-slot="6"] {
    grid-column: 1 / -1;
  }
}

@media (max-width: 620px) {
  #depoimentos {
    padding-block: 72px;
  }

  #depoimentos .voices-deck__head h2 {
    font-size: clamp(2.55rem, 13vw, 3.7rem);
  }

  #depoimentos .voices {
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 30px;
  }

  #depoimentos .quote,
  #depoimentos .quote--vital,
  #depoimentos .quote--david,
  #depoimentos .quote[data-voice-slot="1"],
  #depoimentos .quote[data-voice-slot="2"],
  #depoimentos .quote[data-voice-slot="3"],
  #depoimentos .quote[data-voice-slot="6"] {
    grid-column: 1;
  }

  #depoimentos .quote {
    padding: 22px;
  }

  #depoimentos .quote--featured {
    min-height: 0;
  }

  #depoimentos .quote[data-voice-slot="3"] {
    display: flex;
    gap: 16px;
  }

  #depoimentos .quote[data-voice-slot="3"] footer {
    margin-top: auto;
    text-align: left;
  }

}

.gallery {
  display: flex;
  gap: 14px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  padding-bottom: 12px;
  scrollbar-width: none;
}

.gallery::-webkit-scrollbar {
  display: none;
}

.gallery a {
  flex: 0 0 clamp(240px, 32%, 360px);
  scroll-snap-align: start;
  border-radius: var(--r-lg);
  overflow: hidden;
  aspect-ratio: 4 / 3;
  cursor: zoom-in;
}

.gallery img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--dur-state) var(--ease-quart);
}

.gallery a:hover img {
  transform: scale(1.06);
}

@media (max-width: 640px) {
  .gallery a {
    flex-basis: 82%;
    aspect-ratio: 4 / 3;
  }
}

/* Edição 2025 — constelação de memórias */
#edicao2025.section--navy {
  position: relative;
  isolation: isolate;
  overflow: clip;
  padding-block: clamp(96px, 10vw, 154px);
  background:
    radial-gradient(circle at 84% 22%, rgba(123, 31, 162, 0.34), transparent 31%),
    radial-gradient(circle at 12% 76%, rgba(0, 174, 239, 0.2), transparent 34%),
    linear-gradient(180deg, var(--dark-navy), var(--ocean-abyss) 48%, var(--dark-navy));
}

#edicao2025::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -24%;
  right: -18%;
  width: min(74vw, 980px);
  aspect-ratio: 1;
  border: 1px solid rgba(41, 195, 245, 0.17);
  border-radius: 50%;
  pointer-events: none;
}

#edicao2025::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: 13%;
  right: 8%;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--sunset-gold);
  box-shadow: -16vw 13vh 0 1px rgba(41, 195, 245, 0.68), -34vw 2vh 0 rgba(255, 255, 255, 0.58), -53vw 19vh 0 1px rgba(229, 0, 126, 0.54), 4vw 31vh 0 rgba(255, 255, 255, 0.46), -22vw 46vh 0 1px rgba(255, 194, 14, 0.46), -61vw 58vh 0 rgba(41, 195, 245, 0.52);
  pointer-events: none;
}

.edition-2025 {
  position: relative;
  z-index: 1;
}

.edition-2025__head {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(300px, 0.8fr);
  align-items: end;
  gap: clamp(28px, 6vw, 88px);
  text-align: left;
}

.edition-2025__signal {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0;
  color: rgba(255, 255, 255, 0.72);
  font-family: var(--font-display);
  font-size: 0.82rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.edition-2025__signal::before {
  content: "";
  width: 42px;
  height: 2px;
  background: var(--ocean-cyan);
}

.edition-2025__signal span+span::before {
  content: "·";
  margin-right: 14px;
  color: var(--sunset-gold);
}

#edicao2025 .edition-2025__head h2 {
  max-width: 12ch;
  margin: 0;
  color: var(--foam-white);
  font-size: clamp(3rem, 6.4vw, 5.5rem);
  line-height: 0.94;
  letter-spacing: -0.035em;
  text-wrap: balance;
}

#edicao2025 .edition-2025__head h2 span {
  display: block;
  color: var(--sunset-gold);
}

#edicao2025 .edition-2025__head .lead {
  max-width: 46ch;
  margin: 0 0 0.35em;
  color: rgba(255, 255, 255, 0.78);
  font-size: clamp(1rem, 1.5vw, 1.2rem);
  line-height: 1.7;
}

.edition-film {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(250px, 0.55fr);
  gap: clamp(28px, 5vw, 70px);
  align-items: center;
  width: 100%;
  margin-top: clamp(48px, 7vw, 88px);
  padding: clamp(22px, 2.8vw, 34px) 0;
  border: 0;
  border-block: 1px solid rgba(133, 201, 245, 0.22);
  color: var(--foam-white);
  background: transparent;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.edition-film__frame {
  position: relative;
  display: block;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--dark-navy-2);
  clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 0 100%);
}

.edition-film__frame::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 44%, rgba(4, 29, 58, 0.82) 100%);
  pointer-events: none;
}

.edition-film__frame img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 720ms var(--ease-expo), filter 420ms var(--ease-quart);
}

.edition-film__play {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  display: grid;
  width: clamp(58px, 6vw, 76px);
  aspect-ratio: 1;
  place-items: center;
  border-radius: 50%;
  color: var(--ocean-abyss);
  background: var(--sunset-gold);
  transform: translate(-50%, -50%);
  transition: color 220ms var(--ease-quart), background-color 220ms var(--ease-quart), transform 320ms var(--ease-expo);
}

.edition-film__play::after {
  content: "";
  position: absolute;
  inset: -9px;
  border: 1px solid rgba(255, 194, 14, 0.72);
  border-radius: 50%;
  opacity: 0;
  transform: scale(0.76);
  transition: opacity 480ms var(--ease-quart), transform 620ms var(--ease-expo);
}

.edition-film__play svg {
  width: 34%;
  height: 34%;
  transform: translateX(7%);
}

.edition-film__timecode {
  position: absolute;
  z-index: 2;
  right: 16px;
  bottom: 12px;
  left: 16px;
  display: flex;
  justify-content: space-between;
  color: rgba(255, 255, 255, 0.86);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.7rem;
  letter-spacing: 0.08em;
}

.edition-film__timecode::before {
  content: "";
  position: absolute;
  right: 0;
  bottom: -5px;
  left: 0;
  height: 2px;
  background: linear-gradient(90deg, var(--sunset-gold), var(--kriativa-purple));
}

.edition-film__copy {
  display: grid;
  gap: 14px;
  align-content: center;
}

.edition-film__label {
  color: var(--ocean-cyan);
  font-family: var(--font-display);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.edition-film__copy>strong {
  max-width: 10ch;
  color: var(--foam-white);
  font-family: var(--font-display);
  font-size: clamp(2rem, 3.6vw, 3.45rem);
  line-height: 0.98;
  letter-spacing: -0.025em;
  text-wrap: balance;
}

.edition-film__copy>span:not(.edition-film__label, .edition-film__action) {
  max-width: 34ch;
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.96rem;
  line-height: 1.55;
}

.edition-film__action {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: fit-content;
  margin-top: 8px;
  color: var(--sunset-gold);
  font-family: var(--font-display);
  font-size: 0.86rem;
  font-weight: 800;
}

.edition-film__action svg {
  width: 20px;
  height: 20px;
  transition: transform 220ms var(--ease-quart);
}

.edition-film:hover .edition-film__frame img,
.edition-film:focus-visible .edition-film__frame img {
  filter: saturate(1.1) contrast(1.04);
  transform: scale(1.035);
}

.edition-film:hover .edition-film__play,
.edition-film:focus-visible .edition-film__play {
  color: #fff;
  background: var(--kriativa-purple);
  transform: translate(-50%, -50%) scale(1.07);
}

.edition-film:hover .edition-film__play::after,
.edition-film:focus-visible .edition-film__play::after {
  opacity: 1;
  transform: scale(1.18);
}

.edition-film:hover .edition-film__action svg,
.edition-film:focus-visible .edition-film__action svg {
  transform: translateX(4px);
}

.edition-film:focus-visible {
  outline: 3px solid var(--sunset-gold);
  outline-offset: 6px;
}

.videobox--edition {
  width: min(1060px, 94vw);
}

.edition-video__frame {
  isolation: isolate;
}

.edition-video__end {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 12px;
  padding: clamp(24px, 6vw, 72px);
  color: var(--foam-white);
  background:
    radial-gradient(circle at 50% 20%, rgba(123, 31, 162, 0.38), transparent 42%),
    var(--ocean-abyss);
  text-align: center;
}

.edition-video__end[hidden] {
  display: none;
}

.edition-video__end-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
}

.edition-video__end-actions button {
  min-height: 46px;
  padding: 12px 18px;
  color: var(--ocean-abyss);
  border: 0;
  background: var(--sunset-gold);
  font: 800 0.86rem/1 var(--font-display);
  transition: transform 220ms var(--ease-quart), background-color 220ms var(--ease-quart);
}

.edition-video__end-actions button+button {
  color: var(--foam-white);
  border: 1px solid rgba(255, 255, 255, 0.42);
  background: transparent;
}

.edition-video__end-actions button:hover,
.edition-video__end-actions button:focus-visible {
  transform: translateY(-2px);
}

.edition-video__end-actions button:focus-visible {
  outline: 3px solid var(--ocean-cyan);
  outline-offset: 3px;
}

#edicao2025 .edition-constellation {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-auto-flow: dense;
  grid-auto-rows: clamp(68px, 6.7vw, 104px);
  gap: clamp(7px, 0.85vw, 12px);
  margin-top: clamp(34px, 5vw, 62px);
  padding: 0;
  overflow: visible;
  scroll-snap-type: none;
}

#edicao2025 .edition-memory {
  position: relative;
  grid-column: span 3;
  grid-row: span 2;
  order: 100;
  min-width: 0;
  aspect-ratio: auto;
  overflow: hidden;
  border-radius: 5px;
  cursor: zoom-in;
  background: var(--dark-navy-2);
  isolation: isolate;
}

#edicao2025 .edition-memory[data-highlight] {
  order: var(--highlight-slot, 50);
}

/* Destaques sorteados pelo JS recebem data-highlight + --highlight-slot (1..8);
   o mosaico assimétrico deriva do slot, não da ordem fixa no HTML. */
#edicao2025 .edition-memory[data-highlight][style*="--highlight-slot: 1"] {
  grid-column: span 7;
  grid-row: span 4;
}

#edicao2025 .edition-memory[data-highlight][style*="--highlight-slot: 2"],
#edicao2025 .edition-memory[data-highlight][style*="--highlight-slot: 3"] {
  grid-column: span 5;
  grid-row: span 2;
}

#edicao2025 .edition-memory[data-highlight][style*="--highlight-slot: 4"] {
  grid-column: span 6;
  grid-row: span 3;
}

#edicao2025 .edition-memory[data-highlight][style*="--highlight-slot: 5"],
#edicao2025 .edition-memory[data-highlight][style*="--highlight-slot: 8"] {
  grid-column: span 6;
  grid-row: span 3;
}

#edicao2025 .edition-memory[data-highlight][style*="--highlight-slot: 6"],
#edicao2025 .edition-memory[data-highlight][style*="--highlight-slot: 7"] {
  grid-column: span 3;
  grid-row: span 3;
}

#edicao2025 .edition-constellation .edition-memory--portrait[data-highlight] {
  grid-column: span 3 !important;
  grid-row: span 4 !important;
}

#edicao2025 .edition-memory img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 900ms var(--ease-quart), filter 400ms var(--ease-quart);
}

#edicao2025 .edition-memory:hover img,
#edicao2025 .edition-memory:focus-visible img {
  transform: scale(1.045);
  filter: saturate(1.08) contrast(1.03);
}

#edicao2025 .edition-memory:focus-visible {
  outline: 3px solid var(--sunset-gold);
  outline-offset: 3px;
}

#edicao2025 .edition-memory[data-memory]:not([hidden]) {
  animation: edition-memory-reveal 560ms var(--ease-quart) both;
  animation-delay: min(calc(var(--archive-order) * 18ms), 700ms);
}

.edition-expand {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: clamp(32px, 5vw, 54px) auto 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--foam-white);
  font-family: var(--font-display);
  font-size: 0.95rem;
  letter-spacing: 0.06em;
}

.edition-expand__icon {
  display: grid;
  width: 46px;
  height: 46px;
  place-items: center;
  border: 1px solid rgba(41, 195, 245, 0.72);
  border-radius: 50%;
  color: var(--ocean-cyan);
  font-family: var(--font-body);
  font-size: 1.5rem;
  font-weight: 300;
  transition: transform 360ms var(--ease-quart), background 240ms ease, color 240ms ease;
}

.edition-expand:hover .edition-expand__icon,
.edition-expand:focus-visible .edition-expand__icon {
  background: var(--ocean-cyan);
  color: var(--ocean-abyss);
  transform: rotate(90deg);
}

.edition-expand[aria-expanded="true"] .edition-expand__icon {
  transform: rotate(45deg);
}

.edition-expand:focus-visible {
  outline: 2px solid var(--sunset-gold);
  outline-offset: 8px;
}

@keyframes edition-memory-reveal {
  from {
    opacity: 0;
    transform: translateY(18px) scale(0.985);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@media (max-width: 900px) {
  .edition-2025__head {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  #edicao2025 .edition-2025__head h2 {
    max-width: 11ch;
  }

  #edicao2025 .edition-2025__head .lead {
    max-width: 58ch;
  }

  .edition-film {
    grid-template-columns: minmax(0, 1.2fr) minmax(220px, 0.8fr);
    gap: 30px;
  }

  #edicao2025 .edition-constellation {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    grid-auto-rows: clamp(72px, 11vw, 96px);
  }

  #edicao2025 .edition-constellation>.edition-memory {
    grid-column: span 2;
    grid-row: span 2;
  }

  #edicao2025 .edition-memory[data-highlight][style*="--highlight-slot: 1"] {
    grid-column: span 4;
    grid-row: span 4;
  }

  #edicao2025 .edition-memory[data-highlight][style*="--highlight-slot: 2"],
  #edicao2025 .edition-memory[data-highlight][style*="--highlight-slot: 3"] {
    grid-column: span 2;
    grid-row: span 2;
  }

  #edicao2025 .edition-constellation>.edition-memory--portrait[data-highlight] {
    grid-column: span 2 !important;
    grid-row: span 3 !important;
  }
}

@media (max-width: 640px) {
  #edicao2025::after {
    display: none;
  }

  #edicao2025.section--navy {
    padding-block: 80px 96px;
  }

  .edition-2025__signal {
    flex-wrap: wrap;
    gap: 8px 12px;
    font-size: 0.72rem;
  }

  .edition-2025__signal::before {
    width: 28px;
  }

  #edicao2025 .edition-2025__head h2 {
    font-size: clamp(2.65rem, 14vw, 4rem);
  }

  .edition-film {
    grid-template-columns: 1fr;
    gap: 24px;
    margin-top: 44px;
    padding-block: 18px 26px;
  }

  .edition-film__copy {
    gap: 10px;
  }

  .edition-film__copy>strong {
    max-width: 14ch;
    font-size: clamp(2.2rem, 11vw, 3rem);
  }

  .edition-film__action {
    margin-top: 4px;
  }

  .videobox--edition.is-ended .edition-video__frame {
    min-height: min(520px, 70vh);
    aspect-ratio: auto;
  }

  .edition-video__end {
    padding: 28px 20px;
  }

  .edition-video__end h3 {
    font-size: clamp(2rem, 10vw, 2.8rem);
  }

  .edition-video__end-actions {
    width: 100%;
    flex-direction: column;
  }

  .edition-video__end-actions button {
    width: 100%;
  }

  #edicao2025 .edition-constellation {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: clamp(116px, 36vw, 146px);
    gap: 7px;
  }

  #edicao2025 .edition-constellation>.edition-memory {
    grid-column: span 1;
    grid-row: span 1;
  }

  /* Paired slots always fit the two-column grid, including portrait photos. */
  #edicao2025 .edition-constellation>.edition-memory[data-highlight] {
    grid-column: span 1 !important;
    grid-row: span 2 !important;
  }

  #edicao2025 .edition-memory[data-highlight][style*="--highlight-slot: 1"] {
    grid-column: span 2 !important;
    grid-row: span 2 !important;
  }

  #edicao2025 .edition-memory[data-highlight][style*="--highlight-slot: 4"],
  #edicao2025 .edition-memory[data-highlight][style*="--highlight-slot: 5"],
  #edicao2025 .edition-memory[data-highlight][style*="--highlight-slot: 8"] {
    grid-column: span 2 !important;
    grid-row: span 1 !important;
  }

  .edition-expand {
    font-size: 0.84rem;
  }
}

@media (prefers-reduced-motion: reduce) {

  #edicao2025 .edition-memory,
  #edicao2025 .edition-memory img,
  .edition-expand__icon,
  .edition-film *,
  .edition-video__end-actions button {
    animation: none !important;
    transition: none !important;
  }
}

.lightbox {
  border-width: medium;
  border-style: none;
  border-color: currentcolor;
  border-image: initial;
  padding: 0px;
  background: transparent;
  max-width: 100vw;
  max-height: 100vh;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.lightbox::backdrop {
  background: rgba(8, 26, 51, 0.92);
  backdrop-filter: blur(6px);
}

.lightbox__inner {
  position: fixed;
  inset: 0px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: clamp(16px, 4vw, 48px);
  gap: 16px;
}

.lightbox__figure {
  margin: 0px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  max-width: 100%;
  max-height: 100%;
}

.lightbox__img {
  max-width: min(92vw, 1200px);
  max-height: 80vh;
  width: auto;
  height: auto;
  border-radius: var(--r-md);
  box-shadow: rgba(0, 0, 0, 0.5) 0px 30px 80px;
}

.lightbox__cap {
  color: var(--foam-white);
  font-family: var(--font-body);
  font-size: 0.95rem;
  text-align: center;
}

.lightbox__cap b {
  color: var(--action-ink);
  font-weight: 600;
  margin-left: 8px;
  font-variant-numeric: tabular-nums;
}

.lightbox__btn {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  width: 56px;
  height: 56px;
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.2);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--foam-white);
  transition: background var(--dur-state) var(--ease-quart), transform var(--dur-state) var(--ease-quart);
}

.lightbox__btn:hover {
  background: var(--action);
  border-color: transparent;
}

.lightbox__btn svg {
  width: 26px;
  height: 26px;
}

.lightbox__prev {
  left: clamp(12px, 3vw, 40px);
}

.lightbox__next {
  right: clamp(12px, 3vw, 40px);
}

.lightbox__close {
  position: fixed;
  top: clamp(16px, 3vw, 32px);
  right: clamp(16px, 3vw, 32px);
  width: 48px;
  height: 48px;
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.2);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--foam-white);
  transition: background var(--dur-state) var(--ease-quart);
}

.lightbox__close:hover {
  background: var(--action);
  border-color: transparent;
}

.lightbox__close svg {
  width: 24px;
  height: 24px;
}

@media (max-width: 600px) {
  .lightbox__btn {
    width: 46px;
    height: 46px;
    top: auto;
    bottom: 24px;
    transform: none;
  }

  .lightbox__prev {
    left: 24px;
  }

  .lightbox__next {
    right: 24px;
  }

  .lightbox__img {
    max-height: 68vh;
  }
}

.faq {
  margin-top: var(--sp-xl);
  display: grid;
  grid-template-columns: 300px 1fr;
  gap: clamp(32px, 5vw, 72px);
  align-items: start;
}

.faq__nav {
  position: sticky;
  top: 100px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.faq__nav-eyebrow {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 0.72rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ocean-cyan);
  margin-bottom: 14px;
  padding-left: 2px;
}

.faq__nav-item {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 13px 16px;
  border-radius: var(--r-md);
  border: 1px solid transparent;
  background: transparent;
  color: var(--ink-soft);
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 0.98rem;
  text-align: left;
  cursor: pointer;
  text-decoration: none;
  transition: background var(--dur-state) var(--ease-quart),
    color var(--dur-state) var(--ease-quart),
    border-color var(--dur-state) var(--ease-quart);
}

.faq__nav-item:hover {
  background: var(--fill-soft);
  color: var(--ink, #0d2242);
}

.faq__nav-item.is-active {
  background: var(--surface-card);
  border-color: var(--line-soft);
  color: var(--action-ink);
  box-shadow: rgba(13, 41, 78, 0.08) 0px 8px 26px;
}

.faq__nav-item .faq__nav-count {
  flex: 0 0 auto;
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 0.72rem;
  font-weight: 500;
  color: var(--ocean-cyan);
  background: rgba(41, 195, 245, 0.12);
  border-radius: 999px;
  padding: 2px 9px;
  line-height: 1.6;
}

.faq__panels {
  display: flex;
  flex-direction: column;
  gap: var(--sp-xl);
  min-width: 0px;
}

.faq__panel {
  scroll-margin-top: 110px;
}

.faq__panel-head {
  display: flex;
  align-items: center;
  margin-bottom: var(--sp-md);
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line-soft);
}

.faq__panel h3 {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: clamp(1.2rem, 2.4vw, 1.5rem);
  color: var(--ink, #0d2242);
  margin: 0px;
}

.faq__list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.faq details {
  background: var(--fill-soft);
  border: 1px solid var(--line-soft);
  border-radius: var(--r-md);
  overflow: hidden;
  transition: border-color var(--dur-state) var(--ease-quart),
    background var(--dur-state) var(--ease-quart);
}

.faq details[open] {
  background: var(--surface-card);
  border-color: rgba(123, 31, 162, 0.28);
  box-shadow: rgba(13, 41, 78, 0.07) 0px 10px 30px;
}

.faq summary {
  list-style: none;
  cursor: pointer;
  padding: 18px 22px;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 1.02rem;
  line-height: 1.35;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  transition: color var(--dur-state) var(--ease-quart);
}

.faq summary:hover {
  color: var(--action-ink);
}

.faq summary::-webkit-details-marker {
  display: none;
}

.faq summary::after {
  content: "";
  width: 22px;
  height: 22px;
  flex: 0 0 auto;
  border-radius: 999px;
  background: rgba(123, 31, 162, 0.1);
  position: relative;
  transition: transform var(--dur-state) var(--ease-quart),
    background var(--dur-state) var(--ease-quart);
}

.faq summary::before {
  content: "";
  position: absolute;
  right: 22px;
  top: 50%;
  width: 10px;
  height: 10px;
  margin-top: -5px;
  background: linear-gradient(var(--action-ink), var(--action-ink)) center/10px 2px no-repeat,
    linear-gradient(var(--action-ink), var(--action-ink)) center/2px 10px no-repeat;
  pointer-events: none;
  z-index: 1;
  transition: transform var(--dur-state) var(--ease-quart), opacity var(--dur-state) var(--ease-quart);
}

.faq details[open] summary::after {
  background: var(--action-ink);
}

.faq details[open] summary::before {
  background: linear-gradient(var(--foam-white), var(--foam-white)) center/10px 2px no-repeat;
  transform: rotate(180deg);
}

.faq details>div {
  padding: 0px 22px 20px;
  color: var(--ink-soft);
  line-height: 1.62;
  animation: faqReveal var(--dur-state) var(--ease-quart);
}

@keyframes faqReveal {
  0% {
    opacity: 0;
    transform: translateY(-4px);
  }

  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}

@media (max-width: 900px) {
  .faq {
    grid-template-columns: 1fr;
    gap: var(--sp-lg);
  }

  .faq__nav {
    position: static;
    flex-flow: wrap;
    gap: 8px;
  }

  .faq__nav-eyebrow {
    flex-basis: 100%;
    margin-bottom: 2px;
  }

  .faq__nav-item {
    flex: 1 1 auto;
  }

  .faq__panels {
    gap: var(--sp-lg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .faq details>div {
    animation: auto ease 0s 1 normal none running none;
  }

  .faq summary::after,
  .faq summary::before,
  .faq__nav-item {
    transition: none;
  }
}

.final-cta {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: min(780px, 86vh);
  padding-block: clamp(104px, 11vw, 168px);
  background:
    radial-gradient(72% 110% at 92% 6%, rgba(41, 195, 245, 0.34) 0%, rgba(41, 195, 245, 0) 64%),
    radial-gradient(54% 82% at 4% 94%, rgba(229, 0, 126, 0.26) 0%, rgba(229, 0, 126, 0) 72%),
    linear-gradient(142deg, #7b1fa2 0%, #5b147f 48%, #34105f 100%);
  text-align: left;
}

.final-cta::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    linear-gradient(112deg, transparent 0 44%, rgba(255, 255, 255, 0.055) 44.1% 44.35%, transparent 44.45% 100%),
    radial-gradient(circle at 86% 18%, rgba(255, 194, 14, 0.18) 0 3px, transparent 4px),
    radial-gradient(circle at 14% 78%, rgba(41, 195, 245, 0.22) 0 4px, transparent 5px);
}

.reserve__echo {
  position: absolute;
  right: -0.04em;
  bottom: -0.16em;
  z-index: -1;
  color: transparent;
  font-family: var(--font-display);
  font-size: clamp(9rem, 25vw, 23rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 0.72;
  text-transform: uppercase;
  white-space: nowrap;
  -webkit-text-stroke: 1px rgba(255, 255, 255, 0.10);
  opacity: 0.72;
  transform: rotate(-2deg);
  transform-origin: right bottom;
}

.reserve__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.16fr) minmax(320px, 0.84fr);
  align-items: end;
  gap: clamp(56px, 8vw, 132px);
}

.reserve__copy {
  max-width: 760px;
}

.reserve__copy .eyebrow {
  margin-bottom: clamp(20px, 2.4vw, 34px);
}

.final-cta h2 {
  max-width: 11ch;
  margin: 0;
  margin-top: 20px;
  font-size: clamp(3.5rem, 7.4vw, 6rem);
  line-height: 0.92;
  letter-spacing: -0.025em;
  text-wrap: balance;
}

.final-cta .reserve__copy .lead {
  max-width: 52ch;
  margin: clamp(28px, 3.2vw, 42px) 0 0;
  color: rgba(255, 255, 255, 0.88);
  font-size: clamp(1rem, 1.3vw, 1.16rem);
  line-height: 1.65;
  text-wrap: pretty;
}

.reserve__action {
  width: 100%;
  max-width: 490px;
  justify-self: end;
  padding-bottom: 6px;
}

.reserve__route {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  margin: 0 10px 34px;
  padding: 0;
  list-style: none;
}

.reserve__route::before,
.reserve__route::after {
  content: "";
  position: absolute;
  top: 8px;
  right: calc(16.666% - 1px);
  left: calc(16.666% - 1px);
  height: 2px;
  pointer-events: none;
}

.reserve__route::before {
  background: rgba(255, 255, 255, 0.22);
}

.reserve__route::after {
  background: linear-gradient(90deg, var(--sunset-gold), var(--sunset-deep));
  transform-origin: left center;
}

.reserve__route li {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  gap: 10px;
  color: rgba(255, 255, 255, 0.90);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  line-height: 1;
  text-transform: uppercase;
}

.reserve__route li::before {
  content: "";
  width: 18px;
  height: 18px;
  border: 3px solid rgba(255, 255, 255, 0.94);
  border-radius: 3px;
  background: var(--kriativa-purple-deep);
  box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.10);
  transform: rotate(45deg);
}

.reserve__route li::after {
  content: "";
  position: absolute;
  top: 7px;
  left: 50%;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--foam-white);
  transform: translateX(-50%);
}

.reserve__route li:last-child::before {
  border-color: var(--sunset-gold);
  background: var(--sunset-deep);
  box-shadow: 0 0 0 4px rgba(255, 194, 14, 0.16);
}

.reserve__route li:last-child::after {
  background: var(--kriativa-purple-deep);
}

.reserve__button {
  display: flex;
  width: 100%;
  min-height: 68px;
  justify-content: center;
  gap: 12px;
  color: var(--kriativa-purple-deep);
  font-size: 1.04rem;
}

.reserve__button .btn__wa,
.reserve__button-arrow {
  transition: transform 220ms var(--ease-expo);
}

.reserve__button-arrow {
  font-size: 1.35em;
  line-height: 1;
}

.reserve__button:hover .btn__wa,
.reserve__button:focus-visible .btn__wa {
  transform: rotate(-9deg) scale(1.12);
}

.reserve__button:hover .reserve__button-arrow,
.reserve__button:focus-visible .reserve__button-arrow {
  transform: translateX(5px);
}

.final-cta .reserve__assurance {
  margin: 14px 0 0;
  color: rgba(255, 255, 255, 0.82);
  font-size: 0.84rem;
  line-height: 1.45;
  text-align: center;
}

@media (prefers-reduced-motion: no-preference) {
  .reserve__inner.is-in .reserve__route::after {
    animation: reserve-route-draw 720ms var(--ease-expo) 120ms both;
  }

  .reserve__inner.is-in .reserve__route li::before {
    animation: reserve-node-arrive 420ms var(--ease-expo) calc(180ms + var(--i) * 180ms) both;
  }
}

@keyframes reserve-route-draw {
  from {
    transform: scaleX(0);
  }

  to {
    transform: scaleX(1);
  }
}

@keyframes reserve-node-arrive {
  from {
    opacity: 0.25;
    transform: rotate(45deg) scale(0.62);
  }

  to {
    opacity: 1;
    transform: rotate(45deg) scale(1);
  }
}

@media (max-width: 860px) {
  .final-cta {
    min-height: 0;
    padding-block: clamp(92px, 18vw, 132px);
  }

  .reserve__inner {
    grid-template-columns: 1fr;
    align-items: start;
    gap: clamp(48px, 11vw, 72px);
  }

  .reserve__action {
    max-width: 560px;
    justify-self: start;
  }

  .reserve__echo {
    right: -0.08em;
    bottom: -0.08em;
    font-size: clamp(8rem, 37vw, 16rem);
  }
}

@media (max-width: 560px) {
  .final-cta h2 {
    max-width: 9.5ch;
    font-size: clamp(3rem, 15vw, 4.8rem) !important;
  }

  .final-cta .reserve__copy .lead {
    line-height: 1.58;
  }

  .reserve__route {
    margin-inline: 0;
  }

  .reserve__route li {
    font-size: 0.68rem;
    letter-spacing: 0.055em;
  }

  .reserve__button {
    min-height: 64px;
  }
}

/* ==========================================================================
   PARTNERS & SPONSORS SECTION (CATEGORIZADA E RESPONSIVA)
   ========================================================================== */

.partners-section {
  position: relative;
  overflow: hidden;
}

.partners-container {
  display: flex;
  flex-direction: column;
  gap: clamp(32px, 4vw, 44px);
  max-width: 1140px;
  margin: 0 auto;
  width: 100%;
}

.partners-tier {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.partners-tier__head {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: var(--sp-md);
  position: relative;
  width: 100%;
}

.partners-tier__head::before,
.partners-tier__head::after {
  content: "";
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(133, 201, 245, 0.22));
  max-width: 120px;
}

.partners-tier__head::after {
  background: linear-gradient(90deg, rgba(133, 201, 245, 0.22), transparent);
}

.partners-tier__badge {
  display: inline-block;
  font-family: var(--font-body);
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--foam-white, #ffffff);
  margin: 0 var(--sp-sm);
  padding: 0 4px;
  background: none;
  border: none;
  border-radius: 0;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  white-space: nowrap;
}

.partners-tier--sponsor .partners-tier__badge {
  font-size: 0.875rem;
  letter-spacing: 0.18em;
}

/* Grids */
.partners-grid {
  display: grid;
  width: 100%;
  gap: var(--sp-md);
  align-items: stretch;
}

.partners-grid--sponsors {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(12px, 1.6vw, 18px);
  max-width: 1300px;
  margin: 0 auto;
  width: 100%;
}

.partners-grid--pair {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(14px, 2vw, 22px);
  max-width: 580px;
  margin: 0 auto;
  width: 100%;
}

.partners-grid--trio {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(14px, 2vw, 22px);
  max-width: 820px;
  margin: 0 auto;
  width: 100%;
}

.partners-grid--quad {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(12px, 1.8vw, 18px);
  max-width: 1060px;
  margin: 0 auto;
  width: 100%;
}

.partners-grid--single {
  display: flex;
  justify-content: center;
  width: 100%;
}

/* Partner Cards */
.partner-card {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--surface-0, #ffffff);
  border-radius: var(--r-md, 12px);
  border: 1px solid rgba(255, 255, 255, 0.2);
  box-shadow: 0 4px 18px rgba(4, 29, 58, 0.28);
  text-decoration: none;
  position: relative;
  overflow: hidden;
  transition: transform var(--dur-state) var(--ease-quart),
              box-shadow var(--dur-state) var(--ease-quart),
              border-color var(--dur-state) var(--ease-quart);
  outline-offset: 3px;
}

.partner-card:focus-visible {
  outline: 2px solid var(--ocean-cyan, #00aeef);
}

.partner-card:hover {
  transform: translateY(-4px);
  border-color: rgba(41, 195, 245, 0.5);
  box-shadow: 0 12px 30px rgba(0, 174, 239, 0.2), 0 4px 14px rgba(4, 29, 58, 0.4);
}

.partner-card img {
  display: block;
  object-fit: contain;
  transition: transform var(--dur-state) var(--ease-quart);
}

.partner-card:hover img {
  transform: scale(1.04);
}

/* Patrocinadores (Destaque Principal) */
.partner-card--sponsor {
  width: clamp(150px, 12.5vw, 176px);
  min-height: 108px;
  height: 108px;
  padding: 16px 20px;
}

.partner-card--sponsor img {
  max-height: 60px;
  max-width: 90%;
  width: auto;
  height: auto;
}

/* Parceiros (Nível Intermediário - Maior que Apoio, menor que Patrocinadores) */
.partner-card--partner {
  width: clamp(180px, 24vw, 230px);
  min-height: 92px;
  height: 92px;
  padding: 12px 20px;
}

.partner-card--partner img {
  max-height: 52px;
  max-width: 90%;
  width: auto;
  height: auto;
}

/* Parceria & Apoio e Agência Oficial (Cards Moldados e Uniformes) */
.partner-card--sub {
  width: clamp(160px, 20vw, 196px);
  min-height: 76px;
  height: 76px;
  padding: 10px 18px;
}

.partner-card--sub img {
  max-height: 42px;
  max-width: 88%;
  width: auto;
  height: auto;
}

/* Loja Oficial (Segundo Nível na Hierarquia) */
.partner-card--store {
  width: clamp(190px, 25vw, 240px);
  min-height: 96px;
  height: 96px;
  padding: 14px 22px;
}

.partner-card--store img {
  max-height: 54px;
  max-width: 90%;
  width: auto;
  height: auto;
}

.partner-card--agency {
  width: clamp(170px, 22vw, 210px);
}

/* Fallbacks legados */
.sponsors__group h3 {
  font-size: 0.8125rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-faint);
  font-family: var(--font-body);
  font-weight: 700;
  text-align: center;
  margin-bottom: var(--sp-md);
}

.logo-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: var(--sp-md);
}

/* Responsividade */
@media (max-width: 992px) {
  .partners-grid--sponsors {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    max-width: 600px;
    margin: 0 auto;
  }

  .partners-grid--sponsors > :last-child:nth-child(odd) {
    grid-column: span 2;
    max-width: calc(50% - 5px);
    justify-self: center;
    width: 100%;
  }

  .partners-grid--sponsors .partner-card--sponsor {
    width: 100%;
    max-width: none;
  }

  .partners-grid--quad {
    max-width: 600px;
  }
}

@media (max-width: 560px) {
  .partners-container {
    gap: var(--sp-lg);
  }

  .partners-grid--sponsors {
    max-width: 360px;
    gap: 10px;
  }

  .partner-card--sponsor {
    min-height: 88px;
    height: 88px;
    padding: 12px 16px;
  }

  .partner-card--sponsor img {
    max-height: 46px;
  }

  .partners-grid--pair,
  .partners-grid--trio {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    max-width: 360px;
    gap: 10px;
    margin: 0 auto;
  }

  .partners-grid--pair > :last-child:nth-child(odd),
  .partners-grid--trio > :last-child:nth-child(odd) {
    grid-column: span 2;
    max-width: calc(50% - 5px);
    justify-self: center;
  }

  .partner-card--partner {
    width: 100%;
    min-height: 78px;
    height: 78px;
    padding: 10px 14px;
  }

  .partner-card--partner img {
    max-height: 42px;
  }

  .partners-grid--quad {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    max-width: 360px;
    gap: 10px;
    margin: 0 auto;
  }

  .partners-grid--quad > :last-child:nth-child(odd) {
    grid-column: span 2;
    max-width: calc(50% - 5px);
    justify-self: center;
  }

  .partner-card--sub {
    width: 100%;
    min-height: 68px;
    height: 68px;
    padding: 8px 14px;
  }

  .partner-card--sub img {
    max-height: 36px;
  }

  .partner-card--store {
    width: 100%;
    max-width: 210px;
    min-height: 80px;
    height: 80px;
    padding: 10px 16px;
  }

  .partner-card--store img {
    max-height: 44px;
  }

  .partner-card--agency {
    width: 100%;
    max-width: 180px;
  }

  .partners-tier__badge {
    font-size: 0.75rem;
    padding: 0 2px;
    margin: 0 6px;
  }

  .partners-tier--sponsor .partners-tier__badge {
    font-size: 0.8125rem;
  }

  .partners-tier__head::before,
  .partners-tier__head::after {
    max-width: 48px;
  }
}

.footer {
  --footer-surface: #031a33;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: var(--ink-invert-soft);
  padding-block: clamp(126px, 11vw, 168px) var(--sp-md);
  background:
    radial-gradient(90% 80% at 82% 6%, color-mix(in oklab, var(--kriativa-purple) 24%, transparent), transparent 62%),
    radial-gradient(55% 62% at 12% 24%, color-mix(in oklab, var(--ocean-cyan) 12%, transparent), transparent 68%),
    linear-gradient(180deg, var(--footer-surface) 0%, var(--dark-abyss) 72%);
}

.footer::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  opacity: 0.22;
  pointer-events: none;
  background: radial-gradient(circle at 74% 20%, color-mix(in oklab, var(--foam-white) 24%, transparent) 0 1px, transparent 1.5px);
  background-size: 91px 91px;
}

.footer__inner {
  position: relative;
  z-index: 1;
}

.footer__horizon {
  position: absolute;
  z-index: 0;
  inset: 0 0 auto;
  height: clamp(118px, 13vw, 180px);
  color: var(--ocean-cyan);
  pointer-events: none;
}

.footer__horizon svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.footer__route-shadow,
.footer__route-line {
  fill: none;
  vector-effect: non-scaling-stroke;
}

.footer__route-shadow {
  stroke: color-mix(in oklab, var(--ocean-cyan) 13%, transparent);
  stroke-width: 18;
}

.footer__route-line {
  stroke: color-mix(in oklab, var(--ocean-cyan) 74%, var(--foam-white));
  stroke-width: 2;
  stroke-linecap: round;
}

.footer__route-marker {
  vector-effect: non-scaling-stroke;
  stroke: var(--footer-surface);
  stroke-width: 5;
}

.footer__route-marker--cyan {
  fill: var(--ocean-cyan);
}

.footer__route-marker--magenta {
  fill: var(--kriativa-magenta);
}

.footer__community {
  padding-bottom: clamp(48px, 6vw, 78px);
}

.footer__community-head {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
  gap: 0 clamp(42px, 7vw, 108px);
  align-items: end;
  margin-bottom: clamp(38px, 5vw, 64px);
}

.footer__signal {
  grid-column: 1;
  margin: 0 0 12px;
  color: var(--sunset-gold);
  font-family: var(--font-script);
  font-size: clamp(1.18rem, 2vw, 1.65rem);
  line-height: 1.1;
}

.footer__community h2 {
  grid-column: 1;
  max-width: 12ch;
  margin: 0;
  color: var(--foam-white);
  font-family: var(--font-display);
  font-size: clamp(2.275rem, 3.57vw, 4.2rem);
  line-height: 0.96;
  letter-spacing: -0.025em;
  text-wrap: balance;
}

.footer__community h2 span {
  display: block;
  color: var(--ocean-cyan);
}

.footer__community-head>p:last-child {
  grid-column: 2;
  grid-row: 1 / span 2;
  max-width: 42ch;
  margin: 0 0 8px;
  color: color-mix(in oklab, var(--foam-white) 76%, var(--ocean-cyan));
  font-size: clamp(1rem, 1.25vw, 1.16rem);
  line-height: 1.65;
  text-wrap: pretty;
}

.footer-social {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-block: 1px solid color-mix(in oklab, var(--ocean-cyan) 24%, transparent);
}

.footer-social__link {
  --signal: var(--ocean-cyan);
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr) 24px;
  gap: 16px;
  align-items: center;
  min-width: 0;
  min-height: 122px;
  padding: 22px clamp(18px, 2.4vw, 34px);
  color: var(--foam-white);
  text-decoration: none;
  transition: color var(--dur-state) var(--ease-quart), background-color var(--dur-state) var(--ease-quart);
}

.footer-social__link+.footer-social__link {
  border-inline-start: 1px solid color-mix(in oklab, var(--ocean-cyan) 24%, transparent);
}

.footer-social__link--instagram {
  --signal: var(--kriativa-magenta);
  --signal-ink: var(--foam-white);
}

.footer-social__link--facebook {
  --signal: var(--ocean-cyan);
  --signal-ink: var(--ocean-abyss);
}

.footer-social__link--youtube {
  --signal: var(--sunset-gold);
  --signal-ink: var(--ocean-abyss);
}

.footer-social__instrument {
  position: relative;
  display: grid;
  width: 68px;
  height: 68px;
  place-items: center;
}

.footer-social__orbit {
  position: absolute;
  inset: 0;
  border: 1px solid color-mix(in oklab, var(--signal) 72%, transparent);
  border-radius: 50%;
  transition: transform 620ms var(--ease-expo), border-color var(--dur-state) var(--ease-quart);
}

.footer-social__orbit::before {
  content: "";
  position: absolute;
  inset: 6px;
  border: 1px dashed color-mix(in oklab, var(--signal) 46%, transparent);
  border-radius: inherit;
}

.footer-social__orbit::after {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  top: -4px;
  left: calc(50% - 4px);
  border-radius: 50%;
  background: var(--signal);
}

.footer-social__glyph {
  position: relative;
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border-radius: 50%;
  color: var(--signal-ink);
  background: var(--signal);
  box-shadow: 0 0 0 7px color-mix(in oklab, var(--signal) 12%, transparent);
  transition: transform 520ms var(--ease-expo);
}

.footer-social__glyph svg {
  width: 22px;
  height: 22px;
  fill: currentcolor;
}

.footer-social__link--facebook .footer-social__glyph svg {
  width: 16px;
  height: 26px;
}

.footer-social__copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 4px;
}

.footer-social__copy strong {
  font-family: var(--font-display);
  font-size: clamp(1.18rem, 1.7vw, 1.5rem);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.01em;
}

.footer-social__copy small {
  overflow: hidden;
  color: color-mix(in oklab, var(--foam-white) 66%, var(--ocean-cyan));
  font-size: 0.78rem;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.footer-social__arrow {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: color-mix(in oklab, var(--signal) 82%, var(--foam-white));
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 520ms var(--ease-expo);
}

.footer-social__link:hover {
  background-color: color-mix(in oklab, var(--signal) 9%, transparent);
}

.footer-social__link:hover .footer-social__orbit {
  transform: rotate(62deg);
  border-color: var(--signal);
}

.footer-social__link:hover .footer-social__glyph {
  transform: scale(1.08);
}

.footer-social__link:hover .footer-social__arrow {
  transform: translate(3px, -3px);
}

.footer-social__link:focus-visible,
.footer__col a:focus-visible,
.footer__brand a:focus-visible,
.ksio-powered-line a:focus-visible {
  outline: 2px solid var(--ocean-cyan);
  outline-offset: 5px;
}

.footer__deck {
  display: grid;
  grid-template-columns: minmax(280px, 1.45fr) minmax(160px, 0.65fr) minmax(160px, 0.65fr);
  gap: clamp(38px, 6vw, 96px);
  align-items: start;
  padding-block: clamp(42px, 5vw, 68px);
  border-top: 1px solid color-mix(in oklab, var(--foam-white) 13%, transparent);
}

.footer__inner > .footer__deck:first-child {
  border-top: none;
  padding-top: 0;
}

.footer__brand img {
  display: block;
  width: clamp(172px, 18vw, 230px);
  height: auto;
  margin-bottom: 20px;
  filter: drop-shadow(0 10px 18px rgb(0 0 0 / 28%));
}

.footer__brand p {
  max-width: 38ch;
  margin: 0 0 0px;
  color: color-mix(in oklab, var(--foam-white) 72%, var(--ocean-cyan));
  font-size: 0.96rem;
  line-height: 1.6;
  font-family: var(--font-script);
}

.footer__voyage-code {
  display: inline-flex;
  align-items: left;
  min-height: 34px;
  /* padding-inline: 14px; */
  border-radius: var(--r-pill);
  color: var(--purple-glow);
  /* background: color-mix(in oklab, var(--sunset-gold) 9%, transparent); */
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.footer__col h3 {
  margin: 0 0 16px;
  color: var(--foam-white);
  font-family: var(--font-display);
  font-size: 1.08rem;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.footer__col a {
  display: block;
  width: fit-content;
  min-height: 44px;
  padding-block: 8px;
  color: color-mix(in oklab, var(--foam-white) 72%, var(--ocean-cyan));
  font-size: 0.95rem;
  line-height: 1.5;
  text-decoration: none;
  transition: color var(--dur-state) var(--ease-quart), transform var(--dur-state) var(--ease-quart);
}

.footer__col a:hover {
  color: var(--foam-white);
  transform: translateX(4px);
}

.footer__bottom {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-top: var(--sp-md);
  border-top: 1px solid color-mix(in oklab, var(--foam-white) 13%, transparent);
}

.footer__bottom-main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
}

.footer__privacy-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 18px clamp(18px, 2.4vw, 42px);
}

.footer__privacy-controls a,
.footer__privacy-controls button,
.footer__cookie-preferences,
.footer__cookie-policy {
  display: inline-flex;
  align-items: center;
  border: 0;
  background: transparent;
  padding: 0;
  margin: 0;
  cursor: pointer;
  font: inherit;
  font-family: inherit;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: inherit;
  text-decoration: none;
  text-transform: uppercase;
  color: rgba(233, 242, 251, 0.8);
  transition: color 180ms cubic-bezier(0.22, 0.61, 0.36, 1);
  min-height: auto;
}

.footer__privacy-controls a:hover,
.footer__privacy-controls button:hover,
.footer__cookie-preferences:hover,
.footer__cookie-policy:hover {
  color: #ffffff;
  text-decoration: none;
}

.footer__privacy-controls a:focus-visible,
.footer__privacy-controls button:focus-visible,
.footer__cookie-preferences:focus-visible,
.footer__cookie-policy:focus-visible {
  outline: 2px solid #29c3f5;
  outline-offset: 5px;
}

.footer__legal {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, 0.07);
  color: color-mix(in oklab, var(--foam-white) 55%, var(--ocean-cyan));
  font-size: 0.75rem;
  line-height: 1.5;
}

.footer__legal-sep {
  opacity: 0.4;
  user-select: none;
}

.ksio-powered-line {
  flex: 0 0 auto;
  color: color-mix(in oklab, var(--foam-white) 52%, var(--ocean-cyan));
  font-size: 1rem;
  letter-spacing: 0.035em;
  text-align: right;
  margin-left: auto;
}

.footer__bottom-main > .ksio-powered-line {
  margin-left: auto;
  text-align: right;
}

.ksio-powered-line a {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  color: var(--ocean-cyan);
  font-size: 1.2rem;
  font-weight: 700;
  text-decoration: none;
  transition: color var(--dur-state) var(--ease-quart);
}

.ksio-powered-line a:hover {
  color: var(--foam-white);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.footer__bottom-actions {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
  margin-left: auto;
  justify-content: flex-end;
}

.footer__bottom-actions .lang-switch,
.footer .lang-switch {
  display: inline-flex;
  align-items: center;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: var(--r-sm, 6px);
  padding: 2px;
  font-size: 0.82rem;
  font-weight: 700;
  flex-shrink: 0;
}

.footer .lang-switch__item {
  display: inline-block;
  padding: 3px 8px;
  color: rgba(255, 255, 255, 0.7) !important;
  text-decoration: none !important;
  text-decoration-line: none !important;
  border-radius: 4px;
  transition: color var(--dur-fast) ease, background var(--dur-fast) ease;
}

.footer .lang-switch__item:hover:not(.is-active),
.footer .lang-switch__item:hover {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.16) !important;
  text-decoration: none !important;
  text-decoration-line: none !important;
}

.footer .lang-switch__item.is-active {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.22) !important;
  cursor: default;
  text-decoration: none !important;
  text-decoration-line: none !important;
}

@keyframes footer-route-draw {
  from {
    stroke-dashoffset: 1;
  }

  to {
    stroke-dashoffset: 0;
  }
}

@media (prefers-reduced-motion: no-preference) {
  @supports (animation-timeline: view()) {

    .footer__route-line,
    .footer__route-shadow {
      stroke-dasharray: 1;
      animation: footer-route-draw linear both;
      animation-timeline: view();
      animation-range: entry 0% cover 28%;
    }
  }
}

@media (max-width: 900px) {
  .footer__community-head {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .footer__community-head>p:last-child {
    grid-column: 1;
    grid-row: auto;
    max-width: 58ch;
  }

  .footer-social {
    grid-template-columns: 1fr;
  }

  .footer-social__link {
    min-height: 98px;
  }

  .footer-social__link+.footer-social__link {
    border-inline-start: 0;
    border-top: 1px solid color-mix(in oklab, var(--ocean-cyan) 24%, transparent);
  }

  .footer__deck {
    grid-template-columns: 1fr 1fr;
  }

  .footer__brand {
    grid-column: 1 / -1;
  }
}

@media (max-width: 560px) {
  .footer {
    padding-top: 108px;
  }

  .footer__community h2 {
    max-width: 10ch;
    font-size: clamp(3rem, 16vw, 4.4rem);
  }

  .footer-social__link {
    grid-template-columns: 60px minmax(0, 1fr) 22px;
    gap: 14px;
    min-height: 92px;
    padding: 16px 4px;
  }

  .footer-social__instrument {
    width: 60px;
    height: 60px;
  }

  .footer-social__glyph {
    width: 40px;
    height: 40px;
  }

  .footer-social__copy small {
    white-space: normal;
  }

  .footer__deck {
    grid-template-columns: 1fr;
    gap: 34px;
  }

  .footer__brand {
    grid-column: auto;
  }

  .footer__bottom {
    gap: 18px;
  }

  .footer__bottom-main {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }

  .footer__privacy-controls {
    gap: 12px 18px;
  }

  .footer__bottom-actions {
    width: 100%;
    justify-content: space-between;
  }

  .ksio-powered-line {
    text-align: right;
    margin-left: auto;
  }

  .footer__bottom-main > .ksio-powered-line {
    width: 100%;
    text-align: right;
    align-self: flex-end;
  }

  .footer__legal {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }

  .footer__legal-sep {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {

  .footer-social__link,
  .footer-social__orbit,
  .footer-social__glyph,
  .footer-social__arrow,
  .footer__col a {
    transition: none;
  }
}

.wa-float {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: var(--z-nav);
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: rgb(37, 211, 102);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: rgba(0, 0, 0, 0.3) 0px 6px 8px;
  transition: opacity var(--dur-state) var(--ease-quart), transform var(--dur-state) var(--ease-quart), visibility 0s linear;
}

.wa-float:hover {
  transform: scale(1.08);
}

.wa-float[data-occluded="true"] {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transform: translateY(12px) scale(0.86);
}

.wa-float:focus-visible {
  outline: 3px solid var(--foam-white);
  outline-offset: 3px;
}

.wa-float svg {
  width: 32px;
  height: 32px;
  fill: rgb(255, 255, 255);
}

@media (max-width: 680px) {
  .wa-float {
    right: 12px;
    bottom: max(12px, env(safe-area-inset-bottom));
    width: 52px;
    height: 52px;
  }

  .wa-float svg {
    width: 28px;
    height: 28px;
  }
}

.reveal {
  opacity: 1;
}

@media (prefers-reduced-motion: no-preference) {
  .js-reveal .reveal {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity var(--dur-hero) var(--ease-expo), transform var(--dur-hero) var(--ease-expo);
  }

  .js-reveal .reveal.is-in {
    opacity: 1;
    transform: none;
  }

  .js-reveal .price-grid.reveal>.price-card {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity 620ms var(--ease-expo), transform 620ms var(--ease-expo);
  }

  .js-reveal .price-grid.reveal.is-in>.price-card {
    opacity: 1;
    transform: none;
  }

  .js-reveal .price-grid.reveal.is-in>.price-card:nth-child(1) {
    transition-delay: 60ms;
  }

  .js-reveal .price-grid.reveal.is-in>.price-card:nth-child(2) {
    transition-delay: 130ms;
  }

  .js-reveal .price-grid.reveal.is-in>.price-card:nth-child(3) {
    transition-delay: 200ms;
  }

  .js-reveal .price-grid.reveal ~ .price-stamp-overlay .price-stamp-badge {
    opacity: 0;
    transform: rotate(-12deg) scale(1.2);
    transition: opacity 350ms var(--ease-expo), transform 400ms var(--ease-expo);
  }

  .js-reveal .price-grid.reveal.is-in ~ .price-stamp-overlay .price-stamp-badge {
    opacity: 0.96;
    transform: rotate(-12deg) scale(1);
    transition-delay: 240ms;
  }
}

@media (max-width: 900px) {
  .event-stage {
    grid-template-columns: 1fr;
    gap: var(--sp-xl);
  }

  .event-table {
    width: min(500px, 100%);
    min-height: 620px;
  }

  .event-table img {
    max-height: 560px;
  }

  .event-track {
    grid-template-columns: repeat(2, 1fr);
    row-gap: var(--sp-xl);
  }

  .event-track::before {
    opacity: 0.35;
  }

  .incl {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1320px) {
  .nav__links {
    display: none;
  }

  .nav .nav__right .btn--primary,
  .nav__right .btn--primary,
  .nav[data-scrolled="true"] .nav__right .btn--primary,
  .nav[data-scrolled="false"] .nav__right .btn--primary {
    display: none !important;
  }

  .nav__toggle {
    display: inline-flex;
  }

  /* Tablet/mobile: menu sanduíche e seletor de idioma sempre alinhados à direita */
  .nav__right {
    margin-left: auto;
    justify-content: flex-end;
  }
}

@media (max-width: 600px) {
  .nav { gap: 8px; }
  .nav__brand img { height: 44px; }
  .nav > .nav__brand { --nav-brand-height: 44px; }
  .nav__right { gap: 8px; }
}

@media (max-width: 560px) {
  .event-score {
    padding: 16px 14px 18px;
    clip-path: polygon(0 12px, 12px 0, calc(100% - 28px) 0, 100% 28px, 100% calc(100% - 12px), calc(100% - 12px) 100%, 28px 100%, 0 calc(100% - 28px));
  }

  .event-score__head {
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
    padding: 0 18px 12px 3px;
  }

  .event-score__label {
    font-size: 1.2rem;
  }

  .event-score__date {
    font-size: 0.61rem;
  }

  .event-score__body {
    grid-template-columns: minmax(0, 1fr) 104px;
    gap: 9px;
  }

  .event-score__clock {
    gap: 6px;
  }

  .event-score .tlc {
    gap: 7px;
    padding: 12px 3px 9px;
  }

  .event-score .tlc__num {
    font-size: 1.55rem;
  }

  .event-score .tlc__label {
    font-size: 0.5rem;
    letter-spacing: 0.08em;
  }

  .turn-hourglass {
    padding-left: 8px;
  }

  .turn-hourglass::before {
    inset-block: 10px 18px;
  }

  .turn-hourglass__svg {
    width: 90px;
    height: 113px;
  }

  .event-table {
    min-height: 500px;
  }

  .event-piece--die {
    width: 52px;
    height: 52px;
  }

  .event-piece--die-2 {
    width: 40px;
    height: 40px;
  }

  .event-piece--meeple {
    width: 46px;
    height: 46px;
  }

  .event-piece--meeple-gold {
    width: 48px;
    height: 48px;
    left: 2%;
  }

  .event-piece--meeple-cyan {
    width: 42px;
    height: 42px;
  }

  .event-piece--meeple-coral {
    width: 38px;
    height: 38px;
  }

  .event-track {
    grid-template-columns: 1fr;
    row-gap: var(--sp-lg);
  }

  .event-track::before {
    inset: 22px auto 0px 21px;
    width: 5px;
    height: auto;
    background: linear-gradient(var(--ocean-cyan), var(--kriativa-purple), var(--sunset-gold));
  }

  .event-step {
    padding-left: 64px;
  }

  .event-step::before {
    top: -6px;
    left: 0px;
  }

  .event-step--now::after {
    top: -6px;
    left: 0px;
  }
}

/* #evento — adaptação por contexto, sem alterar a composição desktop */
@media (min-width: 681px) and (max-width: 900px) {
  #evento .event-stage {
    grid-template-columns: minmax(0, 1.05fr) minmax(280px, 0.95fr);
    gap: clamp(26px, 4vw, 38px);
    align-items: center;
  }

  #evento .event-stage__head {
    grid-column: 1 / -1;
  }

  #evento .event-stage__copy h2 {
    font-size: clamp(2.45rem, 5.8vw, 3.35rem);
  }

  #evento .event-kicker {
    font-size: clamp(0.82rem, 1.8vw, 0.98rem) !important;
  }

  #evento .event-table {
    width: 100%;
    min-height: clamp(500px, 68vw, 590px);
  }

  #evento .event-table img {
    max-height: 570px;
  }

  #evento .event-score {
    padding: 16px;
  }

  #evento .event-score__head {
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
    padding-bottom: 12px;
  }

  #evento .event-score__body {
    grid-template-columns: minmax(0, 1fr) 110px;
    gap: 10px;
  }

  #evento .event-score__clock {
    gap: 6px;
  }

  #evento .event-score .tlc {
    padding: 12px 4px 9px;
  }

  #evento .event-score .tlc__num {
    font-size: 1.5rem;
  }

  #evento .turn-hourglass {
    padding-left: 8px;
  }

  #evento .turn-hourglass__svg {
    width: 92px;
    height: 115px;
  }

}

@media (max-width: 680px) {
  #evento.section--from-hero {
    padding-top: clamp(48px, 14vw, 68px);
  }

  #evento .event-stage {
    grid-template-columns: minmax(0, 1fr);
    gap: clamp(26px, 8vw, 38px);
  }

  #evento .event-kicker {
    gap: 9px;
    margin-top: 0;
    font-size: clamp(0.76rem, 3.5vw, 0.9rem) !important;
    letter-spacing: 0.12em;
  }

  #evento .event-kicker::before,
  #evento .event-kicker::after {
    flex-basis: clamp(16px, 7vw, 28px);
  }

  #evento .event-stage__copy h2 {
    font-size: clamp(2.12rem, 10.7vw, 2.7rem);
    line-height: 0.96;
    letter-spacing: -0.025em;
  }

  #evento .event-stage__copy h2+h2 {
    margin-top: 7px;
  }

  #evento .event-board .lead {
    font-size: clamp(0.98rem, 4.3vw, 1.06rem);
    line-height: 1.58;
  }

  #evento .event-score {
    margin-top: 28px;
  }

  #evento .event-table {
    width: min(100%, 390px);
    min-height: clamp(410px, 120vw, 470px);
  }

  #evento .event-table img {
    max-height: 470px;
  }

  #evento .event-piece--die-2,
  #evento .event-piece--meeple-purple,
  #evento .event-piece--meeple-coral {
    display: none;
  }

  #evento .event-track-wrap {
    margin-top: clamp(28px, 9vw, 42px);
  }

  #evento .event-track-hint {
    display: flex;
    margin: 8px 0 0;
  }

  #evento .event-track {
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: min(82%, 290px);
    gap: 16px;
    row-gap: 0;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 2px;
    padding: calc(var(--event-node) + 18px) 12% 14px 2px;
    scrollbar-width: none;
  }

  #evento .event-track::-webkit-scrollbar {
    display: none;
  }

  #evento .event-track::before {
    display: none;
  }

  #evento .event-step {
    min-height: 158px;
    padding-left: 0;
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }

  #evento .event-step::before {
    top: calc((var(--event-node) + 18px) * -0.9);
  }

  #evento .event-step--now .event-step__ring {
    top: calc((var(--event-node) + 18px) * -0.9 - 4px);
  }

  #evento .event-step__body span {
    max-width: none;
  }
}

@media (max-width: 680px) and (prefers-reduced-motion: no-preference) {
  .swipe-hint__motion i {
    animation: event-track-swipe-hint 1.8s var(--ease-expo) infinite;
  }
}

@keyframes event-track-swipe-hint {

  0%,
  20% {
    transform: translateX(0);
    opacity: 0.55;
  }

  68% {
    transform: translateX(42px);
    opacity: 1;
  }

  100% {
    transform: translateX(42px);
    opacity: 0;
  }
}

@media (hover: none) {
  #evento .event-score .tlc:hover {
    transform: none;
    box-shadow: 0 5px 0 #2f0a46, inset 0 1px rgba(255, 255, 255, 0.9);
  }
}

@media (min-width: 1181px) {
  .drawer {
    display: none;
  }
}

/* A home ainda usa o menu sanduíche até 1320 px. */
@media (min-width: 1181px) and (max-width: 1320px) {
  .drawer:has(> .drawer__actions) { display: flex; }
}

/* ============================================================
   EMBARQUE / CARTAS — continuação da cena escura de #evento que se abre
   na mesa das cartas. Sem JS/reduced-motion, o leque já nasce aberto.
   ============================================================ */
.deck--cards {
  --deck-table-start: oklch(68% 0.14 238);
  --deck-table-mid: oklch(73% 0.13 226);
  --deck-table-end: oklch(77% 0.11 214);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin-top: -1px;
  padding: clamp(78px, 10vw, 132px) 0 clamp(90px, 12vw, 154px);
  color: var(--ink-strong);
  background:
    linear-gradient(180deg, #3a1560 0%, #3a1560 12%, rgba(58, 21, 96, 0) 24%),
    radial-gradient(82% 34% at 12% 31%, color-mix(in oklab, var(--kriativa-purple) 54%, transparent) 0%, transparent 70%),
    radial-gradient(68% 30% at 88% 38%, color-mix(in oklab, var(--ocean-cyan) 26%, transparent) 0%, transparent 68%),
    radial-gradient(48% 22% at 52% 48%, color-mix(in oklab, var(--sunset-gold) 11%, transparent) 0%, transparent 72%),
    radial-gradient(58% 30% at 16% 82%, color-mix(in oklab, var(--kriativa-magenta) 15%, transparent) 0%, transparent 72%),
    linear-gradient(162deg, transparent 22%, color-mix(in oklab, var(--ocean-cyan) 12%, transparent) 38%, transparent 54%),
    linear-gradient(180deg, #3a1560 0%, #3a1560 16%, color-mix(in oklab, #3a1560 72%, var(--ocean-abyss)) 28%, var(--ocean-navy) 34%, color-mix(in oklab, var(--ocean-navy) 44%, var(--deck-table-start)) 40%, var(--deck-table-start) 46%, var(--deck-table-mid) 68%, var(--deck-table-end) 100%);
}

.deck--cards::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: url("../images/story/deck-felt-grain.png") 0 0 / 128px 128px repeat;
  mix-blend-mode: soft-light;
  opacity: 0.16;
  transform: scale(1.04);
  transform-origin: center;
  will-change: transform;
}

@media (prefers-reduced-motion: no-preference) {
  .deck--cards::before {
    animation: deck-felt-drift 24s var(--ease-quart) infinite alternate;
  }
}

@keyframes deck-felt-drift {
  from {
    transform: translate3d(-1%, -0.5%, 0) scale(1.04);
  }

  to {
    transform: translate3d(1%, 0.5%, 0) scale(1.04);
  }
}

.deck--cards::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  z-index: 0;
  height: clamp(140px, 12vw, 180px);
  pointer-events: none;
}

.deck__wake {
  position: absolute;
  z-index: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: clamp(140px, 12vw, 180px);
  pointer-events: none;
}

.deck__wake path {
  vector-effect: non-scaling-stroke;
  stroke: rgba(255, 255, 255, 0.34);
  stroke-width: 1.4;
}

.deck__wake path:nth-child(n + 3) {
  stroke: rgba(41, 195, 245, 0.42);
  stroke-width: 1;
}

.deck__inner {
  position: relative;
  z-index: 1;
}

.deck__head {
  /* max-width: 760px; */
  margin: 0 auto;
  text-align: center;
}

.deck__head h2 {
  margin: 0;
  color: var(--foam-white);
  font-size: clamp(2rem, 4.8vw, 3.55rem);
  line-height: 0.98;
}

.deck__cue {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: clamp(18px, 2.5vw, 28px);
  color: rgba(255, 255, 255, 0.90);
  font-size: 0.94rem;
  font-weight: 800;
}

.deck__cue::before,
.deck__cue::after {
  content: "";
  width: clamp(34px, 6vw, 76px);
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(41, 195, 245, 0), rgba(41, 195, 245, 0.86));
}

.deck__cue::after {
  background: linear-gradient(90deg, rgba(255, 194, 14, 0.82), rgba(255, 194, 14, 0));
}

.deck__fan {
  position: relative;
  height: clamp(390px, 38vw, 500px);
  max-width: 1120px;
  margin: clamp(0px, 0vw, 72px) auto 0;
  padding: 0;
  list-style: none;
  perspective: 2517px;
}

.deck__fan::before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: clamp(2px, 1vw, 12px);
  width: min(82%, 840px);
  height: clamp(64px, 9vw, 116px);
  pointer-events: none;
  transform: translateX(-50%);
  background: radial-gradient(closest-side, rgba(8, 47, 87, 0.18), rgba(8, 47, 87, 0));
  filter: blur(2px);
}

.deck__fan:focus-visible {
  outline: 2px solid var(--ocean-blue);
  outline-offset: 8px;
}

.deck__card {
  --card-scale: 1;
  --card-hover-scale: 1.2;
  position: absolute;
  left: 50%;
  bottom: clamp(22px, 4vw, 42px);
  z-index: var(--z);
  width: clamp(156px, 18.4vw, 246px);
  opacity: 1;
  transform-origin: 50% 120%;
  transform: translate(calc(-50% + var(--x)), var(--y)) rotate(var(--r)) scale(var(--card-scale));
  transition: opacity 520ms var(--ease-expo), transform 760ms var(--ease-expo), filter 260ms var(--ease-quart);
  transition-delay: calc(var(--i) * 80ms);
  will-change: transform, opacity;
  cursor: zoom-in;
  border-radius: clamp(16px, 1.9vw, 24px);
  overflow: hidden;
}

.deck__card--hero {
  --card-scale: 1.075;
  --card-hover-scale: 1.26;
}

.deck__card::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: clamp(16px, 1.9vw, 24px);
  opacity: 0;
  transform: translateX(-118%) skewX(-15deg);
  background: linear-gradient(112deg, rgba(255, 255, 255, 0) 30%, rgba(255, 255, 255, 0.52) 48%, rgba(255, 255, 255, 0) 66%);
  mix-blend-mode: screen;
  transition: opacity 220ms var(--ease-quart), transform 620ms var(--ease-expo);
}

.deck--cards.is-in .deck__card--hero::after {
  animation: deck-card-glint 1400ms var(--ease-expo) 780ms 1 none;
}

.deck__card img {
  width: 100%;
  height: auto;
  border-radius: clamp(16px, 1.9vw, 24px);
  box-shadow: 0 26px 60px rgba(8, 47, 87, 0.24), 0 8px 18px rgba(4, 29, 58, 0.12);
  filter: saturate(1.04) contrast(1.02);
  background: var(--surface-card);
  transition: filter 260ms var(--ease-quart), transform 260ms var(--ease-quart), box-shadow 260ms var(--ease-quart);
}

.js-reveal .deck--cards .deck__card {
  opacity: 0;
  transform: translate(-50%, 94px) rotate(0deg) scale(0.9);
}

.js-reveal .deck--cards.is-in .deck__card {
  opacity: 1;
  transform: translate(calc(-50% + var(--x)), var(--y)) rotate(var(--r)) scale(var(--card-scale));
}

@media (hover: hover) and (pointer: fine) {
  .deck--cards.is-in .deck__card:hover {
    z-index: 20;
    transition-delay: 0ms;
    transform: translate(calc(-50% + var(--x)), calc(var(--y) - 86px)) rotate(0deg) scale(var(--card-hover-scale));
  }

  .deck--cards.is-in .deck__card:hover img {
    box-shadow: 0 42px 92px rgba(8, 47, 87, 0.34), 0 14px 34px rgba(123, 31, 162, 0.20);
    filter: saturate(1.1) contrast(1.04);
    transform: translateZ(18px);
  }

  .deck--cards.is-in .deck__card:hover::after {
    opacity: 0.84;
    transform: translateX(118%) skewX(-15deg);
  }
}

.deck__cta {
  position: relative;
  max-width: 1160px;
  margin: clamp(68px, 7vw, 96px) auto 0;
  padding: 0;
  perspective: 1600px;
  text-align: left;
}

.deck__bonus-panel {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(230px, 0.72fr) minmax(0, 1.28fr);
  grid-template-areas:
    "card content"
    "action action";
  gap: clamp(28px, 4vw, 58px);
  align-items: center;
  min-height: 590px;
  padding: clamp(42px, 5vw, 68px) clamp(38px, 5vw, 72px) clamp(98px, 9vw, 126px);
  color: var(--ocean-abyss);
  filter: drop-shadow(0 14px 10px rgba(4, 29, 58, 0.2));
  transform-style: preserve-3d;
}

.deck__bonus-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(circle at 8% 16%, rgba(41, 195, 245, 0.12), transparent 28%),
    linear-gradient(145deg, #fff 0%, #f3faff 64%, #e3f4fc 100%);
  clip-path: polygon(0 0, calc(100% - 52px) 0, 100% 52px, 100% calc(100% - 72px), 50% 100%, 0 calc(100% - 72px));
}

.deck__bonus-panel::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  width: min(38%, 360px);
  height: 7px;
  background: linear-gradient(90deg, var(--kriativa-purple), var(--ocean-cyan));
}

.deck__bonus-card {
  position: relative;
  z-index: 2;
  grid-area: card;
  display: block;
  width: min(100%, 274px);
  justify-self: center;
  overflow: hidden;
  border-radius: 16px;
  box-shadow: 0 12px 0 rgba(8, 47, 87, 0.13), 0 24px 38px rgba(8, 47, 87, 0.24);
  transform: rotate(-5deg) translateY(-16px) translateZ(0);
  transform-origin: 50% 85%;
  transition: transform 260ms var(--ease-quart), box-shadow 260ms var(--ease-quart);
}

.deck__bonus-card::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(115deg, transparent 24%, rgba(255, 255, 255, 0.5) 46%, transparent 64%);
  opacity: 0;
  transform: translateX(-112%) skewX(-14deg);
  transition: opacity 220ms var(--ease-quart), transform 680ms var(--ease-expo);
}

.deck__bonus-card:hover,
.deck__bonus-card:focus-visible {
  transform: rotate(-2deg) translateY(-24px) scale(1.035);
  box-shadow: 0 14px 0 rgba(8, 47, 87, 0.13), 0 30px 46px rgba(8, 47, 87, 0.28);
}

.deck__bonus-card:hover::after,
.deck__bonus-card:focus-visible::after {
  opacity: 0.82;
  transform: translateX(118%) skewX(-14deg);
}

.deck__bonus-card img {
  display: block;
  width: 100%;
  height: auto;
}

.deck__bonus-content {
  position: relative;
  z-index: 1;
  grid-area: content;
  display: grid;
  gap: clamp(24px, 3vw, 34px);
  align-content: center;
  min-width: 0;
}

.deck__bonus-head {
  display: grid;
  gap: 12px;
}

.deck__bonus-kicker {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  width: fit-content;
  color: var(--kriativa-purple-deep);
  font-family: var(--font-display);
  font-size: clamp(0.78rem, 1vw, 0.9rem);
  font-weight: 800;
  letter-spacing: 0.12em;
  line-height: 1;
  text-transform: uppercase;
}

.deck__bonus-kicker::before {
  content: "✦";
  color: var(--sunset-gold);
  font-size: 0.86em;
}

.deck__bonus-title {
  max-width: 18ch;
  margin: 0;
  color: var(--ocean-abyss);
  font-size: clamp(2rem, 3.5vw, 3.25rem);
  line-height: 0.98;
  letter-spacing: -0.025em;
  text-wrap: balance;
}

.deck__bonus-title span {
  display: block;
  color: var(--kriativa-purple);
}

.deck__bonus-lead {
  max-width: 52ch;
  margin: 0;
  color: #315875;
  font-size: clamp(0.98rem, 1.25vw, 1.1rem);
  line-height: 1.58;
  text-wrap: pretty;
}

.deck__bonus-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px clamp(22px, 3vw, 38px);
  margin: 0;
  padding: 0;
  list-style: none;
}

.deck__bonus-list li {
  display: grid;
  grid-template-columns: 0.9em minmax(0, 1fr);
  gap: 10px;
  align-items: baseline;
  color: var(--ocean-abyss);
  font-size: clamp(0.96rem, 1.25vw, 1.1rem);
  font-weight: 800;
  line-height: 1.28;
  text-wrap: pretty;
}

.deck__bonus-list li::before {
  content: "◆";
  color: var(--ocean-cyan);
  font-size: 0.58em;
  transform: translateY(-0.12em);
}

.deck__bonus-more {
  width: fit-content;
  margin: 0;
  color: var(--kriativa-purple-deep);
  font-family: var(--font-display);
  font-size: clamp(1rem, 1.55vw, 1.3rem);
  font-weight: 800;
  line-height: 1;
}

.deck__bonus-action {
  position: relative;
  z-index: 1;
  grid-area: action;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  margin-top: clamp(0px, 1vw, 12px);
  padding-top: 24px;
  border-top: 1px solid rgba(8, 47, 87, 0.14);
}

.deck__bonus-route {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin: 0;
  color: #55758c;
  font-size: 0.82rem;
}

.deck__bonus-route strong {
  color: var(--ocean-abyss);
  font-family: var(--font-display);
  font-size: 1.15rem;
  font-weight: 800;
  letter-spacing: 0.04em;
}

.deck__navio-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 50px;
  padding: 14px 20px 14px 24px;
  color: #fff;
  background: var(--kriativa-purple-deep);
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px));
  text-decoration: none;
  transition: background-color 220ms var(--ease-quart), transform 220ms var(--ease-quart);
}

.deck__navio-copy {
  font-family: var(--font-display);
  font-size: 0.88rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  line-height: 1;
  text-transform: uppercase;
}

.deck__navio-link svg {
  width: 22px;
  height: 22px;
  transition: transform 220ms var(--ease-quart);
}

.deck__navio-link:hover {
  color: #fff;
  background: var(--kriativa-purple);
  transform: translateY(-3px);
}

.deck__navio-link:hover svg {
  transform: translateY(4px);
}

.js-reveal .deck__cta .deck__bonus-head,
.js-reveal .deck__cta .deck__bonus-card,
.js-reveal .deck__cta .deck__bonus-list li,
.js-reveal .deck__cta .deck__bonus-more,
.js-reveal .deck__cta .deck__bonus-action {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 620ms var(--ease-expo), transform 720ms var(--ease-expo);
}

.js-reveal .deck__cta .deck__bonus-card {
  transform: translateX(-28px) rotate(-10deg) scale(0.92);
}

.js-reveal .deck__cta .deck__bonus-list li:nth-child(1) {
  transition-delay: 300ms;
}

.js-reveal .deck__cta .deck__bonus-list li:nth-child(2) {
  transition-delay: 360ms;
}

.js-reveal .deck__cta .deck__bonus-list li:nth-child(3) {
  transition-delay: 420ms;
}

.js-reveal .deck__cta .deck__bonus-list li:nth-child(4) {
  transition-delay: 480ms;
}

.js-reveal .deck__cta .deck__bonus-list li:nth-child(5) {
  transition-delay: 540ms;
}

.js-reveal .deck__cta.is-in .deck__bonus-head,
.js-reveal .deck__cta.is-in .deck__bonus-list li,
.js-reveal .deck__cta.is-in .deck__bonus-more,
.js-reveal .deck__cta.is-in .deck__bonus-action {
  opacity: 1;
  transform: none;
}

.js-reveal .deck__cta.is-in .deck__bonus-head {
  transition-delay: 140ms;
}

.js-reveal .deck__cta.is-in .deck__bonus-card {
  opacity: 1;
  transform: rotate(-5deg) translateY(-16px) translateZ(0);
  transition-delay: 220ms;
}

.js-reveal .deck__cta.is-in .deck__bonus-more {
  transition-delay: 620ms;
}

.js-reveal .deck__cta.is-in .deck__bonus-action {
  transition-delay: 690ms;
}

@keyframes deck-card-glint {
  0% {
    opacity: 0;
    transform: translateX(-118%) skewX(-15deg);
  }

  18% {
    opacity: 0.72;
  }

  100% {
    opacity: 0;
    transform: translateX(118%) skewX(-15deg);
  }
}

@media (max-width: 860px) {
  /* .deck__fan {
    height: clamp(390px, 72vw, 560px);
  } */

  .deck__card {
    width: clamp(132px, 25vw, 190px);
  }

  .deck__card--comunidade {
    --x: -102% !important;
    --y: 30px !important;
    --r: -15deg !important;
  }

  .deck__card--sorteio {
    --x: -52% !important;
    --y: 2px !important;
    --r: -8deg !important;
  }

  .deck__card--jogos {
    --x: 52% !important;
    --y: 2px !important;
    --r: 8deg !important;
  }

  .deck__card--monitoria {
    --x: 102% !important;
    --y: 30px !important;
    --r: 15deg !important;
  }
}

@media (max-width: 760px) {
  .deck__cta {
    max-width: min(100%, 620px);
    margin-top: 92px;
  }

  .deck__bonus-panel {
    grid-template-columns: 1fr;
    grid-template-areas:
      "card"
      "content"
      "action";
    gap: 28px;
    min-height: 0;
    padding: 54px clamp(28px, 6vw, 46px) 104px;
  }

  .deck__bonus-panel::before {
    clip-path: polygon(0 0, calc(100% - 38px) 0, 100% 38px, 100% calc(100% - 58px), 50% 100%, 0 calc(100% - 58px));
  }

  .deck__bonus-card {
    width: min(46vw, 226px);
    margin-top: -104px;
  }

  .deck__bonus-content {
    gap: 24px;
  }

  .deck__bonus-title {
    max-width: 16ch;
  }

  .deck__bonus-list {
    gap: 13px 24px;
  }

  .deck__bonus-action {
    margin-top: 4px;
  }

}

@media (max-width: 560px) {
  .deck--cards {
    padding-bottom: clamp(138px, 38vw, 166px);
  }

  .deck__swipe {
    display: flex;
    margin: 8px 0 0;
  }

  .deck__fan {
    display: flex;
    gap: 18px;
    height: auto;
    margin: 24px calc(var(--gutter) * -1) 0;
    padding: 12px var(--gutter) 24px;
    overflow-x: auto;
    overflow-y: visible;
    scroll-padding-inline: var(--gutter);
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-x pan-y;
  }

  .deck__fan::-webkit-scrollbar {
    display: none;
  }

  .deck__fan.is-scroll-driven {
    scroll-snap-type: none;
  }

  .deck--cards.has-pinned-deck {
    --deck-pinned-card-width: min(76vw, 282px, calc((100svh - 68px) * 720 / 1098));
    overflow: clip;
  }

  .has-pinned-deck .deck__pin-track {
    margin-top: 24px;
  }

  .has-pinned-deck .deck__pin-frame {
    position: sticky;
  }

  .has-pinned-deck .deck__fan {
    margin-top: 0;
    min-height: calc(var(--deck-pinned-card-width) * 1098 / 720 + 36px);
  }

  .has-pinned-deck .deck__card {
    flex-basis: var(--deck-pinned-card-width);
    width: var(--deck-pinned-card-width);
  }


  .deck__fan::before {
    display: none;
  }

  .deck__card,
  .deck__card--hero {
    --card-scale: 1;
    --card-hover-scale: 1;
    position: relative;
    left: auto;
    bottom: auto;
    z-index: auto;
    flex: 0 0 min(76vw, 282px);
    width: min(76vw, 282px);
    transform: none;
    scroll-snap-align: center;
    scroll-snap-stop: always;
  }

  .deck__card {
    cursor: grab;
  }

  .deck__card::after {
    display: none;
  }

  .js-reveal .deck--cards .deck__card {
    opacity: 0;
    transform: translateY(26px) scale(0.96);
  }

  .js-reveal .deck--cards.is-in .deck__card {
    opacity: 1;
    transform: none;
  }

  .deck--cards.is-in .deck__card:active {
    transform: translateY(-12px) scale(1.035);
  }

  .deck__cta {
    max-width: 100%;
    margin-top: 104px;
  }

  .deck__bonus-panel {
    gap: 22px;
    padding: 50px 20px 92px;
  }

  .deck__bonus-panel::before {
    clip-path: polygon(0 0, calc(100% - 28px) 0, 100% 28px, 100% calc(100% - 46px), 50% 100%, 0 calc(100% - 46px));
  }

  .deck__bonus-card {
    width: min(60vw, 212px);
    margin-top: -96px;
    transform: rotate(-3deg) translateY(-10px);
  }

  .js-reveal .deck__cta.is-in .deck__bonus-card {
    transform: rotate(-3deg) translateY(-10px) translateZ(0);
  }

  .deck__bonus-content {
    gap: 22px;
  }

  .deck__bonus-title {
    max-width: 15ch;
    font-size: clamp(1.85rem, 9vw, 2.55rem);
  }

  .deck__bonus-list {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .deck__bonus-more {
    font-size: 1.06rem;
    line-height: 1.1;
  }

  .deck__bonus-action {
    flex-direction: column;
    align-items: stretch;
    gap: 18px;
    padding-top: 20px;
  }

  .deck__bonus-route {
    justify-content: space-between;
  }

  .deck__navio-link {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .deck__card {
    transition: none !important;
  }

  .deck__card::after {
    animation: none !important;
    transition: none !important;
  }

  .deck__bonus-head,
  .deck__bonus-card,
  .deck__bonus-card::after,
  .deck__bonus-list li,
  .deck__bonus-more,
  .deck__bonus-action,
  .deck__navio-link,
  .deck__navio-link svg {
    animation: none !important;
    transition: none !important;
  }

  .js-reveal .deck__cta .deck__bonus-head,
  .js-reveal .deck__cta .deck__bonus-list li,
  .js-reveal .deck__cta .deck__bonus-more,
  .js-reveal .deck__cta .deck__bonus-action {
    opacity: 1 !important;
    transform: none !important;
  }

  .js-reveal .deck__cta .deck__bonus-card {
    opacity: 1 !important;
    transform: rotate(-5deg) translateY(-16px) translateZ(0) !important;
  }

  .deck__navio-link svg {
    animation: none !important;
  }

  .js-reveal .deck--cards .deck__card {
    opacity: 1 !important;
    transform: translate(calc(-50% + var(--x)), var(--y)) rotate(var(--r)) scale(var(--card-scale)) !important;
  }
}

@media (prefers-reduced-motion: reduce) and (max-width: 560px) {
  .js-reveal .deck__cta .deck__bonus-card {
    transform: rotate(-3deg) translateY(-10px) translateZ(0) !important;
  }

  .js-reveal .deck--cards .deck__card {
    transform: none !important;
  }
}

@media (prefers-reduced-motion: reduce) and (hover: hover) and (pointer: fine) {
  .deck--cards.is-in .deck__card:hover {
    transform: translate(calc(-50% + var(--x)), calc(var(--y) - 86px)) rotate(0deg) scale(var(--card-hover-scale)) !important;
  }
}

/* O leque sai de trás da carta central antes de alcançar o centro da tela. */
@media (min-width: 561px) and (prefers-reduced-motion: no-preference) {
  .js .deck--cards.is-scroll-fan .deck__card {
    opacity: 1;
    transform: translate(calc(-50% + var(--x) * var(--deck-open, 0)), calc(-34px + (var(--y) + 34px) * var(--deck-open, 0))) rotate(calc(var(--r) * var(--deck-open, 0))) scale(var(--card-scale));
    transition: none;
  }
}

/* A carta bônus acompanha a rolagem sem fixar a seção na tela. */
.js .deck__cta .deck__bonus-card.is-scroll-animated {
  --bonus-base-rotation: -5deg;
  --bonus-base-lift: -16px;
  opacity: 1;
  transform: rotate(calc(var(--bonus-base-rotation) + var(--bonus-turn, 0deg))) translateY(var(--bonus-base-lift)) scale(var(--bonus-scale, 1));
  transition: box-shadow 260ms var(--ease-quart);
  transition-delay: 0s;
}

.js .deck__cta .deck__bonus-card.is-scroll-animated::after {
  opacity: var(--bonus-reflection-opacity, 0);
  transform: translateX(var(--bonus-reflection-x, -112%)) skewX(-14deg);
  transition: none;
}

@media (max-width: 560px) {
  .js .deck__cta .deck__bonus-card.is-scroll-animated {
    --bonus-base-rotation: -3deg;
    --bonus-base-lift: -10px;
  }
}

/* ──────────────────────────────────────────────────────────────────────────
   PRÉ-EMBARQUE — ROTA ATÉ O PORTO + MANUAL DE BORDO
   ────────────────────────────────────────────────────────────────────────── */

#hospedagem.preboard-route {
  isolation: isolate;
  min-height: 820px;
  overflow: hidden;
  padding-block: clamp(82px, 10vw, 140px) clamp(96px, 12vw, 160px);
  color: var(--foam-white);
  background: #06294d;
}

.preboard-route::before,
.preboard-route::after {
  content: "";
  position: absolute;
  z-index: -1;
  border-radius: 50%;
  pointer-events: none;
}

.preboard-route::before {
  width: min(42vw, 620px);
  aspect-ratio: 1;
  top: -30%;
  left: -14%;
  border: 1px solid rgba(41, 195, 245, 0.13);
}

.preboard-route::after {
  display: none;
}

.preboard-route__glow {
  display: none;
}

.preboard-route__head {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
  max-width: 680px;
}

.preboard-route__script,
.faq-manual__script {
  grid-column: 1 / -1;
  width: fit-content;
  font-family: var(--font-script);
  font-size: clamp(1.08rem, 1.5vw, 1.38rem);
  font-weight: 700;
  line-height: 1.2;
  color: var(--ocean-cyan) !important;
  transform: rotate(-1.5deg);
}

#hospedagem.preboard-route h2 {
  max-width: 14ch;
  color: var(--foam-white);
  font-size: clamp(2.275rem, 4.9vw, 4.13rem);
  line-height: 0.99;
  letter-spacing: 0.005em;
}

#hospedagem.preboard-route h2 span {
  display: block;
  color: var(--sunset-gold);
}

#hospedagem.preboard-route .lead {
  max-width: 48ch;
  margin-top: 4px;
  color: rgba(255, 255, 255, 0.82);
  font-size: clamp(1.05rem, 1.4vw, 1.2rem);
  line-height: 1.6;
  text-wrap: pretty;
}

.preboard-route__map {
  --route-link-gap: clamp(36px, 4vw, 52px);
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--route-link-gap) clamp(18px, 2.5vw, 32px);
  min-height: 0;
  margin-top: clamp(72px, 7vw, 96px);
}

/* Carta náutica: batimetria, sondagens, rosa dos ventos e moldura de coordenadas.
   Camadas decorativas atrás da rota; parallax de ponteiro aplicado via JS (transform inline). */
.preboard-route__chart,
.preboard-route__frame {
  position: absolute;
  z-index: 0;
  pointer-events: none;
  will-change: transform;
}

.preboard-route__chart {
  inset: -14px;
  width: calc(100% + 28px);
  height: calc(100% + 28px);
  overflow: visible;
}

.preboard-route__frame {
  inset: clamp(28px, 4vw, 56px);
}

.preboard-route__inner {
  position: relative;
  z-index: 1;
}

.preboard-route__bathy path {
  fill: none;
  stroke: url("#preboardChartFade");
  stroke-width: 1.4;
  stroke-dasharray: 1 9;
  stroke-linecap: round;
}

.preboard-route__soundings circle {
  fill: var(--ocean-cyan);
  fill-opacity: 0.42;
}

.preboard-route__soundings text {
  fill: var(--ocean-cyan);
  fill-opacity: 0.3;
  font: 600 11px/1 var(--font-body);
}

.preboard-route__compass {
  position: absolute;
  bottom: clamp(28px, 4vw, 56px);
  left: clamp(28px, 4vw, 56px);
  z-index: 0;
  width: clamp(72px, 8vw, 96px);
  aspect-ratio: 1;
  opacity: 0.42;
  pointer-events: none;
  will-change: transform;
}

.preboard-route__compass svg {
  width: 100%;
  height: 100%;
}

.preboard-route__compass-ring {
  fill: none;
  stroke: var(--ocean-cyan);
  stroke-opacity: 0.4;
  stroke-width: 1;
}

.preboard-route__compass-ring--dashed {
  stroke-opacity: 0.22;
  stroke-dasharray: 2 5;
}

.preboard-route__compass-n {
  fill: var(--sunset-gold);
  fill-opacity: 0.78;
}

.preboard-route__compass-s {
  fill: var(--ocean-cyan);
  fill-opacity: 0.5;
}

.preboard-route__compass-e {
  fill: var(--ocean-cyan);
  fill-opacity: 0.3;
}

.preboard-route__compass-label {
  fill: var(--sunset-gold);
  fill-opacity: 0.85;
  font: 800 9px/1 var(--font-body);
  text-anchor: middle;
}

.preboard-route__corner {
  position: absolute;
  width: 22px;
  aspect-ratio: 1;
  border: 0 solid rgba(41, 195, 245, 0.4);
}

.preboard-route__corner--tl {
  top: 0;
  left: 0;
  border-top-width: 1.5px;
  border-left-width: 1.5px;
}

.preboard-route__corner--tr {
  top: 0;
  right: 0;
  border-top-width: 1.5px;
  border-right-width: 1.5px;
}

.preboard-route__corner--bl {
  bottom: 0;
  left: 0;
  border-bottom-width: 1.5px;
  border-left-width: 1.5px;
}

.preboard-route__corner--br {
  bottom: 0;
  right: 0;
  border-bottom-width: 1.5px;
  border-right-width: 1.5px;
}

.preboard-route__coord {
  position: absolute;
  color: rgba(41, 195, 245, 0.42);
  font: 700 10px/1 var(--font-body);
  letter-spacing: 0.14em;
}

.preboard-route__coord--lat {
  top: -20px;
  left: 12px;
}

.preboard-route__coord--lng {
  bottom: -20px;
  right: 12px;
}

.route-stop {
  position: relative;
  z-index: 2;
  display: block;
  width: auto;
  min-height: 236px;
  padding: clamp(22px, 2.8vw, 30px) 0 22px;
  border-top: 1px solid rgba(41, 195, 245, 0.34);
  color: var(--foam-white);
  background: transparent;
}

.route-stop::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  width: 1px;
  height: var(--route-link-gap);
  background: linear-gradient(180deg, rgba(41, 195, 245, 0.62), rgba(255, 194, 14, 0.48));
  transform: translateX(-50%);
  pointer-events: none;
}

.route-stop__body {
  min-width: 0;
  width: 100%;
  padding: 0;
}

.route-stop__meta {
  margin-bottom: 8px;
  color: rgba(255, 255, 255, 0.63) !important;
  font-size: 0.7rem !important;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.35;
  text-transform: uppercase;
}

#hospedagem .route-stop h3 {
  margin-bottom: 10px;
  color: var(--foam-white);
  font-family: var(--font-body);
  font-size: clamp(1.12rem, 1.65vw, 1.38rem);
  line-height: 1.15;
  letter-spacing: -0.01em;
}

#hospedagem .route-stop p:not(.route-stop__meta) {
  color: rgba(255, 255, 255, 0.76);
  font-size: 0.9rem;
  line-height: 1.58;
  text-wrap: pretty;
}

.route-stop__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  margin-top: 6px;
  padding-block: 8px;
  color: var(--foam-white);
  font-size: 0.82rem;
  font-weight: 800;
  text-underline-offset: 4px;
  text-decoration-color: rgba(41, 195, 245, 0.5);
  transition: color var(--dur-state) var(--ease-quart), text-decoration-color var(--dur-state) var(--ease-quart);
}

.route-stop__link span {
  color: var(--ocean-cyan);
  font-size: 1rem;
  transition: transform var(--dur-state) var(--ease-expo);
}

.route-stop__link:hover,
.route-stop__link:focus-visible {
  color: var(--ocean-cyan);
  text-decoration-color: currentcolor;
}

.route-stop__link:hover span,
.route-stop__link:focus-visible span {
  transform: translate(3px, -3px);
}

.route-shuttle {
  position: relative;
  z-index: 2;
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  grid-template-areas:
    "visual copy"
    "visual route"
    "visual cta";
  align-items: center;
  column-gap: clamp(32px, 4.5vw, 68px);
  row-gap: 18px;
  min-width: 0;
  min-height: 0;
  padding: 0 0 clamp(28px, 3.4vw, 40px);
  color: var(--foam-white);
}

.route-shuttle__visual {
  grid-area: visual;
  width: min(100%, 520px);
  aspect-ratio: 1006 / 654;
  justify-self: start;
  align-self: center;
  margin: 0;
}

.route-shuttle__visual img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center center;
}

.route-shuttle__copy {
  grid-area: copy;
  min-width: 0;
}

#hospedagem.preboard-route .route-shuttle h3 {
  margin-bottom: 8px;
  color: var(--foam-white);
  font-family: var(--font-body);
  font-size: clamp(1.35rem, 2vw, 1.75rem);
  line-height: 1.08;
  letter-spacing: -0.02em;
}

#hospedagem.preboard-route .route-shuttle__official {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  color: var(--sunset-gold);
  font-size: 0.68rem !important;
  font-weight: 850;
  letter-spacing: 0.1em;
  line-height: 1.25;
  text-transform: uppercase;
}

.route-shuttle__official::before {
  content: "";
  flex: 0 0 auto;
  width: 7px;
  height: 7px;
  background: currentcolor;
  border-radius: 50%;
}

#hospedagem.preboard-route .route-shuttle__copy p {
  max-width: 44ch;
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.96rem;
  line-height: 1.55;
  text-wrap: pretty;
}

#hospedagem.preboard-route .route-shuttle__schedule {
  margin-top: 14px;
  display: flex;
  flex-direction: column;
  gap: 7px;
}

#hospedagem.preboard-route .route-shuttle__schedule-item {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px;
  font-size: 0.91rem;
  line-height: 1.4;
  color: rgba(255, 255, 255, 0.88);
}

#hospedagem.preboard-route .route-shuttle__schedule-dot {
  flex: 0 0 auto;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--sunset-gold);
  transform: translateY(-2px);
}

#hospedagem.preboard-route .route-shuttle__schedule-name {
  color: var(--foam-white);
  font-weight: 750;
}

#hospedagem.preboard-route .route-shuttle__schedule-time {
  color: rgba(255, 255, 255, 0.92);
}

#hospedagem.preboard-route .route-shuttle__schedule-time strong {
  color: var(--foam-white);
  font-weight: 750;
}

#hospedagem.preboard-route .route-shuttle__schedule-status--sold {
  color: rgba(255, 255, 255, 0.55);
  font-size: 0.82rem;
}

#hospedagem.preboard-route .route-shuttle__schedule-status--open {
  color: var(--ocean-cyan);
  font-weight: 750;
  font-size: 0.86rem;
}

.route-shuttle__route {
  grid-area: route;
  display: grid;
  grid-template-columns: minmax(72px, 0.7fr) minmax(92px, 1fr) minmax(110px, 1.1fr);
  grid-template-areas:
    "badge badge badge"
    "start track arrival";
  align-items: center;
  gap: 14px;
  min-width: 0;
}

.route-shuttle__trip-badge {
  grid-area: badge;
  display: inline-flex;
  align-items: center;
  justify-self: start;
  gap: 6px;
  color: var(--ocean-cyan);
  font-size: 0.66rem;
  font-weight: 850;
  letter-spacing: 0.1em;
  line-height: 1;
  text-transform: uppercase;
}

.route-shuttle__trip-badge svg {
  width: 18px;
  height: 18px;
  stroke: currentcolor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.route-shuttle__stop {
  grid-area: start;
  display: grid;
  gap: 4px;
  color: var(--foam-white);
  font-size: clamp(0.9rem, 1.2vw, 1rem);
  font-weight: 800;
  line-height: 1.15;
}

.route-shuttle__stop small {
  color: rgba(255, 255, 255, 0.56);
  font-size: 0.64rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  line-height: 1;
  text-transform: uppercase;
}

.route-shuttle__stop--arrival {
  grid-area: arrival;
  color: var(--sunset-gold);
}

.route-shuttle__track {
  grid-area: track;
  position: relative;
  display: flex;
  align-items: center;
  min-width: 80px;
  height: 2px;
  margin-inline: 4px;
  background: rgba(255, 255, 255, 0.15);
  border-radius: 2px;
  overflow: visible;
}

.route-shuttle__line {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, var(--ocean-cyan) 0%, var(--sunset-gold) 100%);
  opacity: 0.75;
  border-radius: 2px;
}

.route-shuttle__beacon {
  position: absolute;
  top: -11px;
  left: 0;
  width: 22px;
  height: 22px;
  color: var(--sunset-gold);
  filter: drop-shadow(0 0 6px rgba(254, 179, 44, 0.85));
  animation: shuttleBeacon 5s ease-in-out infinite alternate;
  pointer-events: none;
}

.route-shuttle__beacon svg {
  display: block;
  width: 100%;
  height: 100%;
}

@keyframes shuttleBeacon {
  0% {
    left: 0%;
    transform: scaleX(1);
  }

  45% {
    transform: scaleX(1);
  }

  50% {
    left: calc(100% - 22px);
    transform: scaleX(1);
  }

  55% {
    transform: scaleX(-1);
  }

  95% {
    transform: scaleX(-1);
  }

  100% {
    left: 0%;
    transform: scaleX(-1);
  }
}

.route-shuttle__link {
  grid-area: cta;
  justify-self: start;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  justify-items: start;
  gap: 10px;
  min-height: 48px;
  min-width: 0;
  max-width: 100%;
  padding: 12px 18px;
  border: 0;
  border-radius: 8px;
  color: var(--foam-white);
  background: var(--kriativa-purple);
  font-size: 0.84rem;
  font-weight: 850;
  text-align: left;
  white-space: normal;
  transition: background var(--dur-state) var(--ease-quart), transform var(--dur-state) var(--ease-expo);
}

.route-shuttle__link .transport-sold-out {
  grid-column: 1 / -1;
}

.route-shuttle__link svg {
  width: 18px;
  height: 18px;
  stroke: currentcolor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform var(--dur-state) var(--ease-expo);
}

.route-shuttle__link:hover,
.route-shuttle__link:focus-visible {
  color: var(--foam-white);
  background: var(--kriativa-purple-deep);
  transform: translateY(-2px);
}

.route-shuttle__link:hover svg,
.route-shuttle__link:focus-visible svg {
  transform: translateX(3px);
}

.route-destination {
  position: relative;
  z-index: 2;
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 88px 1fr;
  align-items: center;
  gap: clamp(24px, 3vw, 40px);
  width: 100%;
  min-height: 190px;
  padding: clamp(30px, 4vw, 48px);
  color: var(--ocean-abyss);
  background: var(--sunset-gold);
  border-radius: 10px;
  box-shadow: none;
}

.route-destination__icon {
  display: grid;
  place-items: center;
  width: 88px;
  aspect-ratio: 1;
  border-radius: 50%;
  color: var(--foam-white);
  background: var(--ocean-abyss);
}

.route-destination__icon svg {
  width: 50px;
  stroke: currentcolor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.route-destination__copy {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px clamp(24px, 4vw, 56px);
}

.route-destination__copy small,
.route-destination__copy b,
.route-destination__copy address {
  grid-column: 1;
}

.route-destination__copy b {
  font-family: var(--font-display);
  font-size: clamp(2rem, 3.4vw, 3rem);
  line-height: 0.95;
}

.route-destination__copy small {
  font-size: clamp(0.78rem, 1vw, 0.9rem);
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.route-destination__copy address {
  color: rgba(4, 29, 58, 0.78);
  font-size: clamp(0.94rem, 1.2vw, 1.08rem);
  font-style: normal;
  font-weight: 650;
  line-height: 1.4;
}

.route-destination__link {
  grid-column: 2;
  grid-row: 1 / 4;
  align-self: center;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  width: fit-content;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--ocean-abyss);
  background: transparent;
  font: 800 clamp(1.5rem, 2.2vw, 2.25rem)/1 var(--font-display);
  letter-spacing: 0.02em;
  text-transform: uppercase;
  text-decoration: underline;
  text-decoration-color: rgba(4, 22, 44, 0.45);
  text-underline-offset: 6px;
  cursor: pointer;
  transition: color var(--dur-state) var(--ease-quart), text-decoration-color var(--dur-state) var(--ease-quart);
}

.route-destination__link svg {
  width: 1em;
  height: 1em;
  flex: 0 0 auto;
  stroke: currentcolor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform var(--dur-state) var(--ease-expo);
}

.route-destination__link:hover,
.route-destination__link:focus-visible {
  color: var(--kriativa-purple);
  text-decoration-color: currentcolor;
}

.route-destination__link:hover svg,
.route-destination__link:focus-visible svg {
  transform: translateY(-2px);
}

.route-destination__link:focus-visible {
  outline: 2px solid var(--ocean-abyss);
  outline-offset: 3px;
}

.map-modal[open] {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr);
}

.map-modal__bar {
  position: relative;
  z-index: 3;
  padding: 12px 14px 12px 16px;
  border-bottom-color: rgba(41, 195, 245, 0.28);
}

.map-modal__heading {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.map-modal__heading>span:last-child {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.map-modal__marker {
  flex: 0 0 42px;
  display: grid;
  width: 42px;
  aspect-ratio: 1;
  place-items: center;
  border-radius: 50%;
  color: var(--ocean-abyss);
  background: var(--sunset-gold);
}

.map-modal__marker svg {
  width: 23px;
  stroke: currentcolor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.map-modal__address {
  overflow: hidden;
  color: var(--ink-invert-soft);
  font-size: 0.74rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.map-modal .tour360__icon-btn {
  width: 44px;
  height: 44px;
}

.map-modal__stage {
  height: auto;
  min-height: 0;
  background: #e8edf1;
}

.map-modal__frame {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

.map-modal__spinner::after {
  content: "Carregando mapa…";
}

@media (max-width: 620px) {
  .map-modal {
    width: 94vw;
    height: min(720px, 86dvh);
  }

  .map-modal__address {
    max-width: 52vw;
  }
}

.js-reveal .preboard-route__map.reveal .route-stop,
.js-reveal .preboard-route__map.reveal .route-shuttle,
.js-reveal .preboard-route__map.reveal .route-destination {
  opacity: 0;
  transform: translateY(18px);
}

.js-reveal .preboard-route__map.reveal.is-in .route-stop,
.js-reveal .preboard-route__map.reveal.is-in .route-shuttle,
.js-reveal .preboard-route__map.reveal.is-in .route-destination {
  opacity: 1;
  transform: none;
  transition: opacity 560ms var(--ease-quart), transform 760ms var(--ease-expo);
}

.js-reveal .preboard-route__map.reveal.is-in .route-stop--first {
  transition-delay: 360ms;
}

.js-reveal .preboard-route__map.reveal.is-in .route-stop--second {
  transition-delay: 520ms;
}

.js-reveal .preboard-route__map.reveal.is-in .route-stop--parking {
  transition-delay: 680ms;
}

.js-reveal .preboard-route__map.reveal.is-in .route-shuttle {
  transition-delay: 120ms;
}

.js-reveal .preboard-route__map.reveal.is-in .route-destination {
  transition-delay: 900ms;
}

/* Manual de bordo */

#faq.preboard-faq {
  overflow: clip;
  padding-block: clamp(88px, 11vw, 150px);
  color: var(--ink-strong);
  background:
    radial-gradient(circle at 92% 7%, rgba(41, 195, 245, 0.16), transparent 22%),
    var(--surface-1);
}

#faq.preboard-faq::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 160%;
  height: 42px;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: #0a426d;
}

.faq-manual__head {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: end;
  gap: clamp(38px, 7vw, 110px);
  padding-bottom: clamp(44px, 6vw, 74px);
  border-bottom: 1px solid var(--line-mid);
}

.faq-manual__script {
  margin-bottom: 14px;
  color: var(--kriativa-purple) !important;
}

#faq .faq-manual__title h2 {
  max-width: 10ch;
  color: var(--ink-strong);
  font-size: clamp(3.25rem, 7vw, 5.9rem);
  line-height: 0.99;
  letter-spacing: 0.005em;
}

#faq .faq-manual__title h2 span {
  display: block;
  color: var(--kriativa-purple);
}

#faq .faq-manual__title .lead {
  max-width: 55ch;
  margin-top: 22px;
  color: var(--ink-soft);
  font-size: 1rem;
}

.faq-search {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 20px;
  padding: 0;
  color: #082f57;
  background: transparent;
}

.faq-search__label {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

.faq-search__field {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid #b8c7d5;
  border-radius: 8px;
  background: #fff;
  transition: border-color .18s ease;
}

.faq-search__field:focus-within {
  border-color: #17648a;
  outline: 2px solid #17648a;
  outline-offset: 2px;
}

.faq-search__field svg {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  stroke: #49647a;
  stroke-width: 1.8;
  stroke-linecap: round;
}

.faq-search input {
  width: 100%;
  min-height: 42px;
  min-width: 0;
  border: 0;
  outline: 0;
  color: #082f57;
  background: transparent;
  font: 400 .875rem/1.4 var(--font-body);
}

.faq-search input::placeholder { color: #49647a; }
.faq-search small { min-height: 1.4em; color: #49647a; font-size: .75rem; }

@media (min-width: 901px) {
  #faq .faq__rail { position: sticky; top: 150px; }
  #faq .faq__rail .faq__nav { position: relative; top: auto; }
}

@media (max-width: 900px) {
  .faq__rail { display: contents; }
  .faq-search { margin-bottom: -20px; }
}

#faq .faq {
  grid-template-columns: 280px minmax(0, 1fr);
  gap: clamp(40px, 7vw, 96px);
  margin-top: clamp(48px, 7vw, 84px);
}

#faq .faq__nav {
  top: 112px;
  gap: 8px;
  padding-left: 28px;
}

#faq .faq__nav-eyebrow {
  margin: 0 0 18px -28px;
  padding: 0;
  color: var(--ink-strong);
  font-family: var(--font-body);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.1em;
}

.faq__nav-track {
  position: absolute;
  top: 48px;
  bottom: 12px;
  left: 5px;
  width: 2px;
  overflow: hidden;
  background: rgba(13, 34, 66, 0.12);
}

.faq__nav-track i {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, var(--ocean-cyan), var(--kriativa-purple));
  transform: translateY(calc(-100% + var(--faq-progress)));
  transition: transform 520ms var(--ease-expo);
}

#faq .faq__nav-item {
  position: relative;
  min-height: 52px;
  padding: 12px 14px;
  border: 0;
  border-radius: 8px;
  color: var(--ink-soft);
  background: transparent;
  font-size: 0.9rem;
}

#faq .faq__nav-item::before {
  content: "";
  position: absolute;
  top: 50%;
  left: -28px;
  width: 12px;
  aspect-ratio: 1;
  transform: translateY(-50%);
  border: 3px solid var(--surface-1);
  border-radius: 50%;
  background: #b6c6d9;
  box-shadow: 0 0 0 1px rgba(13, 34, 66, 0.16);
  transition: transform var(--dur-state) var(--ease-expo), background var(--dur-state) var(--ease-quart);
}

#faq .faq__nav-item:hover {
  color: var(--kriativa-purple-deep);
  background: rgba(123, 31, 162, 0.07);
}

#faq .faq__nav-item.is-active {
  color: var(--foam-white);
  background: var(--kriativa-purple);
  box-shadow: none;
}

#faq .faq__nav-item.is-active::before {
  transform: translateY(-50%) scale(1.22);
  background: var(--sunset-gold);
}

#faq .faq__nav-count {
  color: currentcolor;
  background: rgba(255, 255, 255, 0.13);
  font-family: var(--font-body);
  font-size: 0.68rem;
  font-weight: 800;
}

#faq .faq__panels {
  gap: clamp(70px, 9vw, 112px);
}

#faq .faq__panel {
  scroll-margin-top: 120px;
}

#faq .faq__panel-head {
  align-items: flex-end;
  margin-bottom: 8px;
  padding-bottom: 22px;
  border-bottom: 2px solid var(--ink-strong);
}

#faq .faq__panel h3 {
  max-width: 22ch;
  color: var(--ink-strong);
  font-family: var(--font-display);
  font-size: clamp(1.55rem, 3vw, 2.45rem);
  line-height: 0.98;
  letter-spacing: 0.005em;
}

#faq .faq__panel h3 .u-nowrap {
  display: inline;
  color: inherit;
  white-space: nowrap;
}

#faq .faq__list {
  gap: 0;
}

#faq .faq details {
  border: 0;
  border-bottom: 1px solid var(--line-mid);
  border-radius: 0;
  background: transparent;
  padding: 0 10px;
}

#faq .faq details[open] {
  border-color: rgba(123, 31, 162, 0.28);
  background: rgba(123, 31, 162, 0.065);
  box-shadow: none;
}

#faq .faq summary {
  position: relative;
  min-height: 72px;
  padding: 20px 58px 20px 0px;
  color: var(--ink-strong);
  font-size: clamp(0.98rem, 1.35vw, 1.08rem);
  line-height: 1.45;
}

#faq .faq summary::after {
  position: absolute;
  right: 4px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--surface-card);
  box-shadow: 0 0 0 1px var(--line-mid);
}

#faq .faq summary::before {
  right: 15px;
  z-index: 2;
}

#faq .faq details[open] summary {
  color: var(--kriativa-purple-deep);
}

#faq .faq details[open] summary::after {
  background: var(--kriativa-purple);
  box-shadow: none;
}

#faq .faq details>div {
  max-width: 70ch;
  padding: 0 58px 24px 0px;
  color: var(--ink-soft);
  line-height: 1.72;
  text-wrap: pretty;
}

#faq .faq details>div a {
  display: inline;
  color: var(--kriativa-purple-deep);
  font-weight: 700;
  text-decoration: underline;
  text-decoration-color: var(--action);
  text-decoration-thickness: 1.5px;
  text-underline-offset: 3px;
  border-radius: 4px;
  padding: 1px 4px;
  margin: -1px -4px;
  transition: color 0.2s ease,
    background-color 0.2s ease,
    text-decoration-color 0.2s ease;
}

#faq .faq details>div a:hover {
  color: var(--kriativa-magenta);
  background-color: rgba(229, 0, 126, 0.08);
  text-decoration-color: var(--kriativa-magenta);
}

#faq .faq details>div a:focus-visible {
  outline: 2px solid var(--action);
  outline-offset: 2px;
  background-color: rgba(123, 31, 162, 0.12);
}

#faq .faq.is-searching .faq__nav-track {
  opacity: 0.35;
}

#faq .u-lead-tip {
  max-width: 760px;
  margin: clamp(72px, 9vw, 112px) 0 0 auto;
  padding: clamp(28px, 4vw, 42px);
  border-radius: var(--r-lg);
  color: var(--foam-white);
  background: var(--kriativa-purple);
  font-size: clamp(1.05rem, 1.7vw, 1.3rem);
  text-align: left;
}

#faq .u-lead-tip a {
  color: var(--foam-white);
  text-decoration-color: var(--sunset-gold);
  text-underline-offset: 5px;
}

@media (max-width: 980px) {

  .preboard-route__head,
  .faq-manual__head {
    grid-template-columns: 1fr;
  }

  #hospedagem.preboard-route h2,
  #faq .faq-manual__title h2 {
    max-width: 13ch;
  }

  #hospedagem.preboard-route .lead,
  .faq-search {
    max-width: 620px;
  }

  .preboard-route__map {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    min-height: 0;
  }

  .route-stop,
  .route-destination {
    position: relative;
    inset: auto;
    width: auto;
  }

  .route-stop {
    min-height: 220px;
    padding: 24px 0 20px;
    border-top: 1px solid rgba(41, 195, 245, 0.3);
    background: transparent;
  }

  .route-shuttle {
    grid-template-columns: minmax(260px, 1fr) minmax(0, 1.08fr);
    grid-template-areas:
      "visual copy"
      "visual route"
      "visual cta";
    gap: 20px 28px;
  }

  .route-shuttle__visual {
    width: min(100%, 400px);
    aspect-ratio: 1006 / 654;
    justify-self: start;
    align-self: center;
  }

  .route-shuttle__route {
    width: 100%;
  }

  .route-shuttle__link {
    justify-self: start;
  }

  .route-stop::after {
    display: none;
  }

  .route-stop__body {
    padding-left: 0;
  }

  .route-stop--parking {
    background: transparent;
  }

  .route-destination {
    grid-column: auto;
    grid-template-columns: 58px minmax(0, 1fr);
    align-self: stretch;
    gap: 16px;
    min-height: 220px;
    padding: 24px;
  }

  .route-destination__icon {
    width: 58px;
  }

  .route-destination__icon svg {
    width: 36px;
  }

  .route-destination__copy {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }

  .route-destination__link {
    align-self: flex-start;
    min-height: 44px;
    margin-top: 4px;
    padding: 11px 16px;
  }
}

@media (max-width: 900px) {
  #faq .faq {
    grid-template-columns: 1fr;
    gap: 42px;
  }

  #faq .faq__nav {
    position: sticky;
    top: 106px;
    z-index: 3;
    flex-flow: row nowrap;
    margin-inline: calc(var(--gutter) * -1);
    padding: 12px var(--gutter);
    overflow-x: auto;
    border-block: 1px solid var(--line-mid);
    background: rgba(242, 246, 252, 0.96);
    scrollbar-width: none;
  }

  #faq .faq__nav::-webkit-scrollbar {
    display: none;
  }

  #faq .faq__nav-eyebrow,
  #faq .faq__nav-track {
    display: none;
  }

  #faq .faq__nav-item {
    flex: 0 0 auto;
    min-height: 44px;
    white-space: nowrap;
  }

  #faq .faq__nav-item::before {
    display: none;
  }
}

@media (max-width: 620px) {
  #hospedagem.preboard-route {
    min-height: 0;
  }

  .preboard-route__script,
  .faq-manual__script {
    font-size: 1rem;
  }

  #hospedagem.preboard-route h2,
  #faq .faq-manual__title h2 {
    font-size: clamp(2.85rem, 14vw, 4.5rem);
  }

  .preboard-route__map {
    grid-template-columns: 1fr;
    gap: 16px;
    margin-top: 52px;
  }

  .route-stop {
    min-height: 0;
    padding: 22px 0;
  }

  .route-shuttle {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "visual"
      "copy"
      "route"
      "cta";
    gap: 18px;
    padding: 0 0 30px;
  }

  .route-shuttle__visual {
    width: min(100%, 380px);
    aspect-ratio: 1006 / 654;
    justify-self: center;
  }

  .route-shuttle__copy,
  .route-shuttle__route,
  .route-shuttle__link {
    grid-column: auto;
  }

  .route-shuttle__route {
    grid-template-columns: minmax(0, 1fr) minmax(54px, 0.72fr) minmax(0, 1fr);
    gap: 8px;
  }

  .route-shuttle__link {
    width: 100%;
  }

  .route-destination {
    width: 100%;
    margin-top: 8px;
  }

  .faq-search {
    padding: 0;
  }

  .faq-search__field {
    grid-template-columns: 20px 1fr;
  }

  #faq .faq summary {
    min-height: 68px;
    padding: 18px 48px 18px 0;
  }

  #faq .faq summary::after {
    right: 0;
    width: 30px;
    height: 30px;
  }

  #faq .faq summary::before {
    right: 10px;
  }

  #faq .faq details>div {
    padding: 0 12px 22px 0;
  }
}

@media (prefers-reduced-motion: reduce) {

  .js-reveal .preboard-route__map.reveal .route-stop,
  .js-reveal .preboard-route__map.reveal .route-shuttle,
  .js-reveal .preboard-route__map.reveal .route-destination {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .faq__nav-track i,
  .route-stop__link span,
  .route-shuttle__link,
  .route-shuttle__link svg,
  .route-shuttle__beacon {
    animation: none;
    transition: none;
  }
}

/* Links usam cor e movimento como feedback, sem sublinhado em nenhum estado. */
a,
a:hover,
a:focus,
a:focus-visible,
.ksio-powered-line a:hover,
.route-destination__link,
.route-destination__link:hover,
.route-destination__link:focus-visible {
  text-decoration: none;
}

/* Shared mobile menu identity across home, Manual and Busão. */
/* Manual menu: compact identity, quiet navigation and a clear current section. */
.drawer__head {
  min-height: 76px;
  margin-bottom: 20px;
  gap: 16px;
}

.drawer__head .nav__brand {
  opacity: 1;
  gap: 12px;
  min-width: 0;
}

.drawer__head .nav__brand img {
  width: 86px;
  height: auto;
  flex-shrink: 0;
}

.guide-drawer__title {
  max-width: 12ch;
  color: #082f57;
  font: 700 1rem/1.3 var(--font-body);
}

.drawer__close {
  flex-shrink: 0;
  background: #f1f6fa;
  border-color: transparent;
}

.drawer__language {
  margin-bottom: 18px;
  padding: 0 0 20px;
  gap: 8px;
}

.drawer__language > span {
  color: #49647a;
  font-size: .8125rem;
}

.drawer > nav {
  gap: 4px;
}

.drawer > nav > a:not(.btn) {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 50px;
  padding: 12px 14px;
  border: 0;
  border-radius: 10px;
  color: #082f57;
  font: 600 1rem/1.4 var(--font-body);
  text-decoration: none;
  transition: background-color .18s ease, color .18s ease;
}

.drawer > nav > a:not(.btn)::after {
  content: "";
  width: 7px;
  height: 7px;
  border-top: 1.5px solid currentColor;
  border-right: 1.5px solid currentColor;
  transform: rotate(45deg);
  flex-shrink: 0;
  opacity: .6;
}

.drawer > nav > a:not(.btn):is(:hover, :focus-visible, .is-active) {
  color: #082f57;
  background: #e7f4fb;
  text-decoration: none;
}

.drawer > nav > a:not(.btn).is-active {
  font-weight: 800;
}

.drawer :is(a, button):focus-visible {
  outline: 2px solid #17648a;
  outline-offset: 3px;
}


@media (max-width: 359px) {
  .drawer { padding-inline: 16px; }
  .drawer__head .nav__brand { gap: 8px; }
  .drawer__head .nav__brand img { width: 72px; }
}



.drawer { padding-inline: 20px; background: #fff; }
.drawer__home-language { margin-bottom: 18px; padding: 0 0 20px; gap: 8px; }
.drawer__home-language > span { color: #49647a; font-size: .8125rem; }
.drawer__home-language .lang-switch--mobile { width: 100%; box-sizing: border-box; }
.drawer__actions { display: grid; grid-template-columns: 1fr; grid-auto-rows: 1fr; gap: 10px; padding-top: 20px; }
.drawer__actions > .btn { min-height: 56px; height: 100%; padding: 12px 16px; border-radius: 10px; font: 700 .9375rem/1.4 var(--font-body); text-decoration: none; box-sizing: border-box; }
.drawer__actions > .header-manual-link { justify-content: flex-start; gap: 12px; background: #e7f4fb; border-color: #c9dfe9; color: #082f57; }
.drawer__actions > .header-manual-link:hover { background: #d7edf8; border-color: #b8d7e6; color: #082f57; }
.drawer__actions .header-manual-link :is(span, strong, svg),
.drawer__actions > .header-manual-link:hover .header-manual-link__icon { color: #082f57; }
.drawer__actions .header-manual-link__sub { font-size: .75rem; }
.drawer__actions .header-manual-link__title { font-size: .9375rem; }
.drawer > nav > [data-drawer-manual] .btn { margin: 8px 0 0; width: 100%; min-height: 52px; border-radius: 10px; justify-content: flex-start; padding: 12px 14px; background: #e7f4fb; border: 1px solid #c9dfe9; color: #082f57; font: 700 .9375rem/1.4 var(--font-body); text-decoration: none; }
@media (min-width: 768px) { .drawer { left: auto; width: min(400px, 100vw); box-shadow: -10px 0 35px rgba(4,29,58,.22); border-left: 1px solid rgba(8,47,87,.12); } }

/* Home hero: search starts at the left; language and menu stay on the right. */
.nav[data-scrolled="false"] .nav__right { display: contents; }
.nav[data-scrolled="false"] .nav__right > .site-search-trigger {
  order: -1;
  margin-right: auto;
  flex-shrink: 0;
}
@media (max-width: 1320px) {
  .nav[data-scrolled="false"] { gap: 8px; }
}

/* O menu rolado cede espaço antes de comprimir a marca em telas intermediárias. */
@media (min-width: 1321px) and (max-width: 1440px) {
  .nav[data-scrolled="true"] .nav__links { display: none; }
  .nav[data-scrolled="true"] .nav__toggle {
    display: inline-flex;
    width: 58px;
    height: 58px;
  }
  .drawer:has(> .drawer__actions) { display: flex; }
}

/* Guide and charter: social links and credits share the home footer identity. */
.footer.footer--with-social .footer-social { margin-bottom: 0; border-bottom: 0; }
.footer.footer--with-social .footer__legal {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px 24px !important;
  align-items: center !important;
}
.footer.footer--with-social .footer__legal-copy { display: flex; flex-wrap: wrap; gap: 4px 12px; min-width: 0; }
.footer.footer--with-social .footer__legal .ksio-powered-line {
  width: auto !important;
  margin: 0 !important;
  font-size: 1rem !important;
  letter-spacing: 0 !important;
  white-space: nowrap;
}
.footer.footer--with-social .footer__legal .ksio-powered-line a { font-size: 1.2rem !important; }
@media (max-width: 560px) {
  .footer.footer--with-social .footer__legal { grid-template-columns: minmax(0, 1fr); }
  .footer.footer--with-social .footer__legal-copy { flex-direction: column; }
  .footer.footer--with-social .footer__legal .ksio-powered-line { justify-self: start; text-align: left !important; }
}

/* Mobile menus share the navy surfaces and gold accents of the search ticket. */
#drawer {
  --drawer-surface: #0a3a68;
  --drawer-head: #082f57;
  --drawer-control: #174a76;
  --drawer-hover: #205783;
  --drawer-border: #7196b9;
  --drawer-muted: #c1d4e5;
  --drawer-accent: #ffc20e;
  color-scheme: dark;
  color: #fff;
  background: var(--drawer-surface);
  border-color: #406b95;
  padding-top: 0;
  padding-inline: 20px;
  scrollbar-color: var(--drawer-border) var(--drawer-surface);
}
#drawer::selection,
#drawer ::selection { color: var(--drawer-head); background: var(--drawer-accent); }
#drawer .drawer__head {
  min-height: 90px;
  margin-inline: -20px;
  padding: max(14px, env(safe-area-inset-top, 14px)) 20px 18px;
  background: var(--drawer-head);
  border-bottom: 1px dashed var(--drawer-border);
}
#drawer .guide-drawer__title,
#drawer > nav > a { color: #fff; }
#drawer > nav > a:is(:hover, :focus-visible) { color: #fff; background: var(--drawer-hover); }
#drawer > nav > a.is-active { color: var(--drawer-accent); background: var(--drawer-control); }
#drawer > nav > a::after { color: var(--drawer-muted); }
#drawer > nav > a.is-active::after { color: var(--drawer-accent); opacity: 1; }
#drawer .drawer__close { color: #fff; background: var(--drawer-control); border-color: var(--drawer-border); }
#drawer .drawer__close svg { stroke: currentColor; }
#drawer .drawer__close:is(:hover, :focus-visible) { color: var(--drawer-head); background: var(--drawer-accent); border-color: var(--drawer-accent); }
#drawer :is(.drawer__language, .drawer__home-language) { color: var(--drawer-muted); border-color: #406b95; }
#drawer :is(.drawer__language, .drawer__home-language) > span { color: var(--drawer-muted); }
#drawer .lang-switch { background: var(--drawer-head); border-color: var(--drawer-border); }
#drawer :is(.lang-switch__btn, .lang-switch__item) { color: #fff; background: transparent; }
#drawer :is(.lang-switch__btn, .lang-switch__item):is(:hover, :focus-visible) { color: #fff !important; background: var(--drawer-hover) !important; }
#drawer :is(.lang-switch__btn, .lang-switch__item).is-active { color: var(--drawer-head) !important; background: var(--drawer-accent) !important; }
#drawer .lang-switch__sep { color: var(--drawer-muted); }
#drawer .drawer__actions { border-top: 1px dashed var(--drawer-border); }
#drawer :is(.header-manual-link, .guide-drawer__action, .drawer__action-link) {
  color: #fff;
  background: var(--drawer-control);
  border-color: var(--drawer-border);
}
#drawer :is(.header-manual-link, .guide-drawer__action, .drawer__action-link):is(:hover, :focus-visible) {
  color: #fff;
  background: var(--drawer-hover);
  border-color: var(--drawer-muted);
}
#drawer .header-manual-link :is(span, strong, svg) { color: inherit; }
#drawer .drawer__actions > .btn--primary { color: var(--drawer-head); background: var(--drawer-accent); border-color: var(--drawer-accent); }
#drawer .drawer__actions > .btn--primary:is(:hover, :focus-visible) { color: var(--drawer-head); background: #ffd34e; border-color: #ffd34e; }
#drawer :is(a, button):focus-visible { outline-color: var(--drawer-accent); }

/* Disponibilidade do fretado junto aos links de informação, em todas as páginas. */
.transport-sold-out {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  padding: .25em .55em;
  border-radius: 4px;
  background: #fff0f6;
  color: #8c174b;
  font: 800 .75rem/1.35 var(--font-body);
  vertical-align: middle;
  text-transform: none;
  white-space: nowrap;
}
.transport-availability { color: #8c174b; font-weight: 700; }
.drawer__actions .guide-drawer__action:has(.transport-sold-out) { flex-wrap: wrap; }
