@layer legacy {
html, body { margin: 0; padding: 0; min-height: 100%; }
body { overflow-x: clip; }
.theme-preview, .theme-preview *, .theme-preview *::before, .theme-preview *::after { box-sizing: border-box; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] {
--illuminate-surface: #f7fbfc; --illuminate-raised: #fff; --illuminate-ink: #07131d;
--illuminate-muted: #526978; --illuminate-line: rgba(7, 19, 29, .13);
--illuminate-link: #0b7777; /* WCAG AA ≥4.5:1 on white/surface — brand teal */
--illuminate-canvas:#f7fbfc; --illuminate-mist:#e8f5f6; --illuminate-depth:#07131d;
--illuminate-glass:rgba(255,255,255,.76); --illuminate-luminous:#91eee6;
--illuminate-pointer-x:72%; --illuminate-pointer-y:42%;
--brand-sunset: #28e0d1; --brand-sunset-dark:#0b7777; --brand-sunset-darker:#075d63;
--brand-coral: #28e0d1; --brand-action: #28e0d1;
/* Illuminate's authored display face is Cormorant Garamond. Ocean
Charter's Recoleta selectors consume this tenant remap instead of
overriding the brand-book contract. */
--brand-font-recoleta: var(--brand-font-heading, 'Cormorant Garamond', Georgia, serif);
background: var(--illuminate-surface); color: var(--illuminate-ink);
transition: background-color 320ms ease, color 320ms ease;
}
/* Keep the homepage decode-safe by leaving its pointer listener disabled in
the script, but do not flatten the authored header/logo/footer light. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-page-key='home'][data-illuminate-effects='full'] .trust-pill-strip__marquee-track {
animation: trust-marquee-h2 36s linear infinite !important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where([aria-label='split-story:home.night-reef-preview'],[aria-label='split-story:pitch-lights-on-the-bay.manta-concept']) {
position:relative;
isolation:isolate;
overflow:hidden;
--illuminate-beam-radius: clamp(180px, 22vw, 330px);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hero__overlay { z-index:0; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where([aria-label='split-story:home.night-reef-preview'],[aria-label='split-story:pitch-lights-on-the-bay.manta-concept']) .split-story__image::before {
content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
background:rgba(1,6,21,.72);
-webkit-mask-image:radial-gradient(circle var(--illuminate-beam-radius) at var(--illuminate-pointer-x) var(--illuminate-pointer-y),transparent 0 26%,rgba(0,0,0,.16) 48%,rgba(0,0,0,.76) 76%,#000 100%);
mask-image:radial-gradient(circle var(--illuminate-beam-radius) at var(--illuminate-pointer-x) var(--illuminate-pointer-y),transparent 0 26%,rgba(0,0,0,.16) 48%,rgba(0,0,0,.76) 76%,#000 100%);
transition:opacity 240ms ease;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where([aria-label='split-story:home.night-reef-preview'],[aria-label='split-story:pitch-lights-on-the-bay.manta-concept']) .split-story__image::after {
content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;
background:
radial-gradient(circle clamp(28px,3.2vw,48px) at var(--illuminate-pointer-x) var(--illuminate-pointer-y),rgba(255,255,255,.82),rgba(145,238,230,.54) 34%,rgba(40,224,209,.18) 58%,transparent 78%),
radial-gradient(ellipse clamp(190px,23vw,350px) clamp(120px,15vw,220px) at var(--illuminate-pointer-x) var(--illuminate-pointer-y),rgba(145,238,230,.3),rgba(40,224,209,.1) 54%,transparent 76%);
mix-blend-mode:normal;
transition:opacity 240ms ease;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where([aria-label='split-story:home.night-reef-preview'],[aria-label='split-story:pitch-lights-on-the-bay.manta-concept'])[data-illuminate-beam='tracking'] .split-story__image::after { opacity:1; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where([aria-label='split-story:home.night-reef-preview'],[aria-label='split-story:pitch-lights-on-the-bay.manta-concept']) .split-story__grid { position:relative;z-index:2; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hero__content { z-index:2; }
/* Preserve the OJ #1618 compositor stack against the tenant's legacy hero
overrides: poster 0 / video 1 / overlay 2 / content 3. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hero--video .hero__overlay { z-index:2; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hero--video :where(.hero__content,.hero__scroll-cue) { z-index:3; }
@media (min-width:721px) {
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hero__content {
/* Keep the first location signal clear of the 80px header. The base
hero is bottom-aligned, so reducing its bottom inset moves the whole
content stack down without adding a top-padding box that would grow
upward into the navigation. */
padding-bottom:12px;
}
}
/* After scroll-back the header returns to position:absolute over the hero.
.hero{overflow:hidden} then clips the top of the frosted location pill when
the content stack sits near the chrome. Allow vertical overflow for the
badge and reserve a top floor so the pill stays fully rounded. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hero {
overflow-x: clip;
overflow-y: visible;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hero__location-badge {
position: relative;
z-index: 3;
flex-shrink: 0;
}
@media (min-width:721px) {
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hero {
/* Absolute transparent header overlays ~80px; keep the location pill
below that band even after sticky→absolute scroll-back jump. */
padding-top: 88px;
box-sizing: border-box;
}
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-effects='full'] .hero__content { animation:illuminate-hero-arrive 780ms cubic-bezier(.22,1,.36,1) both; }
@keyframes illuminate-hero-arrive { from{opacity:0;transform:translateY(18px)} to{opacity:1;transform:none} }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(h1,h2,h3,.hero__title,.inner-page-hero__title) {
font-family: var(--brand-font-heading, 'Cormorant Garamond', Georgia, serif);
font-weight: 600;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(h4,h5,h6) {
font-family: var(--brand-font-body, Manrope, system-ui, sans-serif);
font-weight: 700;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] ::selection {
color: #07131d;
background: #91eee6;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.hero__title,.section h2,.split-story__heading,.cta-banner__headline) {
text-transform: none;
letter-spacing: -.025em;
text-wrap: balance;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hero__title {
font-size: clamp(46px, 7vw, 72px);
line-height: .96;
max-width: 10.5ch;
margin-bottom: 22px;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .inner-page-hero__title {
font-size: clamp(42px, 7vw, 72px);
line-height: 1.02;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.section h2,.split-story__heading,.cruise-listing__heading) {
font-size: clamp(34px, 4.5vw, 48px);
line-height: 1.08;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.hero__subtitle,.section-intro,.split-story__paragraph,.card__description,.text-block p) {
font-size: clamp(16px, 1.25vw, 18px);
line-height: 1.65;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hero__subtitle {
max-width: 52ch;
text-wrap: pretty;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__logo-container {
background: transparent !important;
padding: 0;
position:relative;
overflow:visible;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header--transparent,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__brand-link {
overflow: visible;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header--transparent {
background-color:rgba(1,6,21,.72);
background-image:
radial-gradient(ellipse 34% 130% at 14% 50%,rgba(40,224,209,.12),transparent 72%),
linear-gradient(108deg,transparent 14%,rgba(145,238,230,.035) 34%,rgba(244,212,166,.055) 50%,rgba(145,238,230,.035) 66%,transparent 86%);
background-size:100% 100%,220% 100%;
box-shadow:inset 0 -1px 0 rgba(145,238,230,.15),0 10px 34px rgba(1,6,21,.12);
backdrop-filter:blur(14px) saturate(132%);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header--transparent .header__logo {
filter:brightness(1.16) saturate(1.2) drop-shadow(0 0 8px rgba(145,238,230,.28));
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-effects='full'] .header--transparent {
animation:illuminate-header-current 8s cubic-bezier(.4,0,.2,1) infinite;
}
@keyframes illuminate-header-current { 0%,58%{background-position:0 0,-72% 0} 82%,100%{background-position:0 0,72% 0} }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header:not(.header--transparent) .header__logo {
filter: none;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985']:not([data-illuminate-mode='night']) .header:not(.header--transparent) {
background:#f7fbfc;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .footer__brand-logo-tile {
display:grid;place-items:center;width:min(320px,100%);min-height:180px;
background:radial-gradient(circle at 50% 65%,rgba(40,224,209,.12),transparent 62%);
padding:12px 0;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .footer__logo {
width:min(290px,100%);height:auto;max-width:none;max-height:none!important;object-fit:contain;filter:none!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .footer-columns__col--brand .footer-brand-block {
width: min(320px, 100%);
gap: 14px;
align-items: flex-start;
background: radial-gradient(circle at 48% 54%, rgba(40,224,209,.12), transparent 68%);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .footer-brand-block__logo {
display: block;
width: min(300px, 100%);
height: auto !important;
max-width: none;
max-height: none !important;
align-self: flex-start;
object-fit: contain;
filter:brightness(1.06) saturate(1.08) drop-shadow(0 0 14px rgba(40,224,209,.18)) !important;
mix-blend-mode:screen;
}
/* Hannah H3: the footer is a dark, illuminated wayfinding surface in both
First Light and After Dark. Keep the live IA, while letting the scenic
mark and teal light bloom carry the visual identity instead of a pale or
photo-heavy slab. This late, site-scoped rule intentionally wins over the
shared footer overlay variants without changing their defaults. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .footer-columns,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .footer-columns--with-bg {
background-color:#06233c!important;
background-image:
radial-gradient(ellipse 46% 105% at 10% 52%,rgba(40,224,209,.18),transparent 68%),
radial-gradient(ellipse 32% 78% at 88% 18%,rgba(75,151,194,.13),transparent 72%),
linear-gradient(132deg,#041b31 0%,#092f50 52%,#061f38 100%)!important;
background-blend-mode:screen,screen,normal;
color:#f7fbfc;
isolation:isolate;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .footer-columns__overlay {
background:
linear-gradient(90deg,rgba(3,21,38,.18),rgba(5,31,55,.42)),
radial-gradient(circle at 16% 50%,rgba(145,238,230,.10),transparent 38%)!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .footer-columns__heading,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .footer-columns__business-name {
color:#fff!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .footer-columns__links a,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .footer-columns__contact,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .footer-columns__biz-line,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .footer-brand-block__blurb,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .footer-brand-block__tagline {
color:#d8e8ef!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .footer-columns__biz-icon,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .footer-columns__address-icon {
color:#91eee6!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .footer-columns__legal {
color:#bfced8;
border-top-color:rgba(145,238,230,.24);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .footer-columns__legal-links a {
color:#d8e8ef;
}
@media (max-width: 767px) {
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .footer-columns__col--brand .footer-brand-block {
width: min(270px, 100%);
align-items: center;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .footer-brand-block__logo {
width: min(250px, 100%);
align-self: center;
}
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__mobile-sheet-logo { width:auto;height:38px;max-width:180px;padding:5px 10px;object-fit:contain;background:#010615;border:1px solid rgba(40,224,209,.25);border-radius:8px; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header--transparent .header__hamburger { color:#f7fbfc!important;border-color:rgba(145,238,230,.34); }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header:not(.header--transparent) .header__hamburger { color:#07131d!important;border-color:rgba(7,19,29,.28); }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header:not(.header--transparent) .header__hamburger-bar { background:#07131d; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] .header .header__hamburger {
color:#f7fbfc!important;
border-color:rgba(145,238,230,.5);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] .header .header__hamburger-bar {
background:currentColor;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .section {
--brand-section-py: clamp(56px, 7vw, 100px);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .section--bg-white {
background:
radial-gradient(circle at 84% 12%, rgba(40,224,209,.07), transparent 25rem),
#fff;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .section--bg-soft {
background:
linear-gradient(180deg, rgba(216,239,244,.36), transparent 18rem),
var(--illuminate-surface);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .testimonials.section--bg-soft :where(.eyebrow,.testimonials__heading) {
color: var(--illuminate-ink, #07131d);
text-shadow: none;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .testimonials.section--bg-soft .eyebrow::before {
background: var(--illuminate-teal-deep, #087979);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .contact-panel {
background:
radial-gradient(circle at 80% 18%, rgba(40,224,209,.16), transparent 26rem),
linear-gradient(145deg, #eef9f8, #dceff2);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .contact-panel :where(.contact-panel__heading,.contact-panel__intro,.contact-panel__detail-value) {
color: var(--illuminate-ink, #07131d);
opacity: 1;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .contact-panel__detail-label {
color: var(--illuminate-teal-deep, #087979);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .eyebrow {
font-size: 12px;
letter-spacing: .16em;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .card {
border: 1px solid rgba(7,19,29,.1);
border-radius: 10px;
box-shadow: 0 12px 34px rgba(2,35,52,.08);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .card:hover {
transform: translateY(-2px);
box-shadow: 0 20px 44px rgba(2,35,52,.13);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .split-story__image {
border-radius: 10px;
box-shadow: 0 22px 55px rgba(2,35,52,.14);
}
/* Feature bullets: drop the pale disc behind the icon. The shared kit paints
.split-story__feature-icon with background #e6f4f3, which reads as a white
circle on Illuminate's dark panels. Scoped here rather than edited in
packages/theme-ocean-charter, which is shared with the other sites on this
theme. The 22px box is kept so row alignment and gap are unchanged. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .split-story__feature-icon {
background: transparent;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .cta-banner {
border-radius: 10px;
box-shadow: 0 28px 70px rgba(40,224,209,.16), 0 0 44px rgba(244,212,166,.1);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .cta-banner__headline {
max-width: 15ch;
}
/* Illuminate interaction family: conversion pill, ghost, inline detail,
filters, and mode switch all share Manrope, focus treatment, and a 44px
target floor. Variant colors remain owned by the existing theme rules. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.btn,.mc-btn,.card__cta-link,.split-story__secondary-cta,.ip-chip,.header__hamburger,.header__mobile-sheet-close,.header__mobile-sheet-row,.testimonial-arrow,.testimonial-dot,.split-story__reel-dot) {
font-family: var(--brand-font-button, var(--brand-font-body, Manrope, system-ui, sans-serif));
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.btn,.mc-btn,.card__cta-link,.split-story__secondary-cta) {
min-height: 44px;
border-radius: 999px;
font-size: 13px;
font-weight: 700;
line-height: 1.15;
letter-spacing: .06em;
text-transform: uppercase;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__mobile-sheet-foot .btn {
min-height: 48px;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .light-wake-cta {
min-height: 48px;
color: #010615;
background: linear-gradient(112deg, #f4d4a6 0%, #91eee6 52%, #f4d4a6 100%);
border: 1px solid rgba(1,6,21,.35);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .light-wake-cta:hover { filter:none; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .light-wake-cta:hover .light-wake-cta__icon { transform:none; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .light-wake-cta__icon {
width:30px;height:30px;flex-basis:30px;padding:8px;margin-right:-9px;
color:#91eee6;background:#07131d;border:1px solid rgba(145,238,230,.58);border-radius:999px;
box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 4px 14px rgba(1,6,21,.28);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.mc-btn--variant_primary,.mc-btn--variant_booking,.mc-btn--variant_cta) > .btn__icon--trailing {
width:28px;height:28px;flex-basis:28px;padding:7px;margin-right:-7px;
color:#91eee6;background:#010615;border:1px solid rgba(145,238,230,.46);border-radius:999px;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .mc-btn--variant_cta {
color:#010615;background:linear-gradient(112deg,#f4d4a6 0%,#91eee6 52%,#f4d4a6 100%);border-color:rgba(1,6,21,.35);box-shadow:0 12px 30px rgba(1,6,21,.22);
}
/* Supporting action family. These actions share the horizon/water language
without repeating Light Wake's conversion-only glow. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.mc-btn--variant_primary,.mc-btn--variant_booking,.btn--primary,.btn--teal,.card__cta-link,.cruise-card__btn) {
color: #fff;
background: linear-gradient(180deg,#0b3047 0%,#061d2d 100%);
border: 1px solid rgba(40,224,209,.56);
box-shadow: inset 0 1px 0 rgba(255,255,255,.1),0 8px 20px rgba(2,35,52,.16);
transition: transform 180ms ease,border-color 180ms ease,background 180ms ease,box-shadow 180ms ease;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.mc-btn--variant_primary,.mc-btn--variant_booking,.btn--primary,.btn--teal,.card__cta-link,.cruise-card__btn):hover {
color: #07131d;
background: #91eee6;
border-color: #28e0d1;
transform: translateY(-2px);
box-shadow: 0 12px 28px rgba(40,224,209,.2);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.btn--ghost,.btn--ghost-hero,.btn--ghost-light,.btn--ghost-sunset,.mc-btn--variant_ghost) {
color: currentColor;
background: color-mix(in srgb,currentColor 5%,transparent);
border: 1px solid color-mix(in srgb,currentColor 58%,transparent);
box-shadow: inset 0 0 0 1px color-mix(in srgb,#91eee6 18%,transparent);
backdrop-filter: blur(10px) saturate(125%);
transition: transform 180ms ease,border-color 180ms ease,background-color 180ms ease,box-shadow 180ms ease;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.btn--ghost,.btn--ghost-hero,.btn--ghost-light,.btn--ghost-sunset,.mc-btn--variant_ghost):hover {
color: currentColor;
background: color-mix(in srgb,#91eee6 16%,transparent);
border-color: #91eee6;
transform: translateY(-1px);
box-shadow: inset 0 0 0 1px rgba(255,255,255,.18),0 8px 22px rgba(40,224,209,.12);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.btn--text,.mc-btn--variant_text,.split-story__secondary-cta) {
position: relative;
color: #075d63;
background: transparent;
border: 0;
border-radius: 0;
box-shadow: inset 0 -1px 0 rgba(7,93,99,.34);
transition: color 180ms ease,box-shadow 180ms ease;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.btn--text,.mc-btn--variant_text,.split-story__secondary-cta):hover {
color: #07131d;
background: transparent;
box-shadow: inset 0 -3px 0 #28e0d1;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.split-story .mc-btn--variant_booking,.two-col .mc-btn--variant_primary) {
color: #fff;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.btn__icon,.btn svg,.mc-btn svg) {
width: 16px;
height: 16px;
flex: 0 0 16px;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .btn--text {
min-height: 44px;
padding-inline: 0;
border-radius: 0;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .ip-chip {
min-height: 44px;
min-width: 44px;
border-radius: 999px;
font-size: 12px;
font-weight: 700;
letter-spacing: .05em;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.btn,.mc-btn,.card__cta-link,.split-story__secondary-cta,.ip-chip,.header__hamburger,.header__mobile-sheet-close,.header__mobile-sheet-row,.testimonial-arrow):focus-visible {
outline: 3px solid #f4d4a6;
outline-offset: 3px;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__mobile-sheet-foot .btn:focus {
outline: 3px solid #f4d4a6;
outline-offset: 3px;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.btn,.mc-btn)[aria-disabled='true'] {
cursor: not-allowed;
opacity: .62;
box-shadow: none;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] {
--brand-background: #010615; --brand-text: #f7fbfc; --brand-primary: #28e0d1;
--brand-secondary: #f4d4a6; --brand-accent: #f4d4a6; --brand-navy: #f7fbfc;
--illuminate-surface: #010615; --illuminate-raised: #091522; --illuminate-ink: #f7fbfc;
--illuminate-muted: #a7bac6; --illuminate-line: rgba(130, 151, 166, .24);
--illuminate-link: #91eee6; /* WCAG AA ≥4.5:1 on raised #091522 / surface #010615 */
background: radial-gradient(circle at 72% 18%, rgba(40,224,209,.09), transparent 34rem), linear-gradient(155deg,#010615 0%,#071321 58%,#121446 140%);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] .hero::before { background:rgba(1,6,21,.88); }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] .hero::after {
background:
radial-gradient(circle clamp(30px,3.4vw,52px) at var(--illuminate-pointer-x) var(--illuminate-pointer-y),rgba(255,255,255,.95),rgba(145,238,230,.72) 30%,rgba(40,224,209,.22) 58%,transparent 78%),
radial-gradient(ellipse clamp(210px,25vw,380px) clamp(130px,16vw,235px) at var(--illuminate-pointer-x) var(--illuminate-pointer-y),rgba(40,224,209,.42),rgba(0,103,112,.14) 56%,transparent 78%);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.section,.card__body,.value-prop,.faq__item,.header:not(.header--transparent),.header__mobile-sheet,.header__nav-dropdown,.header__nav-megamenu) {
transition: background-color 320ms ease,border-color 320ms ease,color 320ms ease,box-shadow 320ms ease;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] :where(.section:not(.hero):not(.cta-banner):not(.split-story--dark-navy),.card__body,.value-prop,.faq__item,.header:not(.header--transparent),.header__mobile-sheet,.header__nav-dropdown,.header__nav-megamenu) {
background-color: var(--illuminate-raised); color: var(--illuminate-ink); border-color: var(--illuminate-line);
}
/* Legal copy must use opaque, theme-aware ink rather than alpha-mutating
light text over the shared component's hard-coded white panels. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .privacy-tabs {
background: var(--illuminate-surface);
color: var(--illuminate-ink);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .privacy-tabs :where(.privacy-tabs__heading,.privacy-tabs__text,.privacy-tabs__bullets,.privacy-tabs__row-title,.ip-acc__summary,.ip-acc__body) {
color: var(--illuminate-ink);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .privacy-tabs :where(.privacy-tabs__text,.privacy-tabs__row-desc,.ip-acc__body p,.ip-acc__body ul) {
color: var(--illuminate-muted);
opacity: 1;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .privacy-tabs :where(.privacy-tabs__row,.ip-acc) {
background: var(--illuminate-raised);
border-color: var(--illuminate-line);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] .privacy-tabs :where(.ip-acc__chev,.privacy-tabs__row-tag) {
color: #91eee6;
border-color: #91eee6;
}
/* Shared legal/prose/accordion link token. Do NOT use --brand-primary here:
Tina/logo navy (#010615) stays as brand-primary even in After Dark, which
yields ~1:1 dark-on-dark against --illuminate-raised/#010615 panels.
Specificity must beat layered .theme-preview a { color: var(--brand-primary) }. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .privacy-tabs a,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .ip-acc__body a,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .faq__answer a,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .section-intro a,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .two-col__text a,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .split-story__paragraph a,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .card__description a,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .value-prop__body a,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .legal-prose a,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .page-body .prose a,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .boat-detail a,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .tour-tabs__related-body a {
color: var(--illuminate-link);
opacity: 1;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] .section:not(.hero):not(.cta-banner):not(.split-story--dark-navy) {
background: var(--illuminate-raised) !important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] :where(.hero,.inner-page-hero) :where(h1,h2,h3,p,.eyebrow,.breadcrumb,.breadcrumb a,.inner-page-hero__title,.inner-page-hero__breadcrumbs,.inner-page-hero__crumb) {
color: #fff;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] :where(.cruise-listing,.cruise-listing__compare,.cruise-card,.cruise-card__body) {
background: var(--illuminate-raised) !important;
color: var(--illuminate-ink);
border-color: var(--illuminate-line);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] :where(.cruise-listing,.cruise-card,.cruise-listing__compare) :where(h1,h2,h3,h4,p,span) {
color: inherit;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] :where(.section:not(.hero):not(.cta-banner):not(.split-story--dark-navy) h1,.section:not(.hero):not(.cta-banner):not(.split-story--dark-navy) h2,.section:not(.hero):not(.cta-banner):not(.split-story--dark-navy) h3,.section:not(.hero):not(.cta-banner):not(.split-story--dark-navy) h4,.card__title,.value-prop__title,.faq__question,.header:not(.header--transparent) a,.header__mobile-sheet a) { color: var(--illuminate-ink); }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] :where(.card__description,.card__duration,.value-prop__body,.faq__answer,.split-story__paragraph,.section-intro p,.two-col__text p) { color: var(--illuminate-muted); }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] :where(.card,.value-prop) { box-shadow: 0 18px 55px rgba(0,0,0,.32),0 0 0 1px rgba(40,224,209,.08); }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] :where(.mc-btn--variant_primary,.mc-btn--variant_booking,.btn--primary,.btn--teal,.card__cta-link,.cruise-card__btn) {
color:#07131d;background:linear-gradient(180deg,#b9fff8 0%,#78ddd5 100%);border-color:#91eee6;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] :where(.btn--text,.mc-btn--variant_text,.split-story__secondary-cta) { color:#91eee6; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] :where(.header__nav-dropdown::before,.header__nav-megamenu::before) { background:var(--illuminate-raised)!important;border-color:var(--illuminate-line)!important;box-shadow:-2px -2px 4px rgba(0,0,0,.28)!important; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.header__nav-dropdown,.header__nav-megamenu) {
background: var(--illuminate-raised);
color: var(--illuminate-ink);
border: 1px solid var(--illuminate-line);
box-shadow: 0 22px 64px rgba(1,6,21,.2), 0 0 0 1px rgba(40,224,209,.06);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header { padding-inline:calc((100vw - min(var(--brand-container-max,1200px),100vw))/2 + 48px); }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.header__nav-dropdown,.header__nav-megamenu)::after { content:"";position:absolute;top:-8px;left:0;right:0;height:8px;background:transparent; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__nav-dropdown { display:none; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__nav-megamenu { display:none;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(200px,.8fr); }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__nav-group:hover .header__nav-dropdown,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__nav-group:focus-within .header__nav-dropdown { display:block; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__nav-group:hover .header__nav-megamenu,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__nav-group:focus-within .header__nav-megamenu { display:grid; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.header__nav-dropdown::before,.header__nav-megamenu::before) { background:var(--illuminate-raised);border-top:1px solid var(--illuminate-line);border-left:1px solid var(--illuminate-line); }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__nav-megamenu__feature-label {
font-family: var(--brand-font-heading,'Cormorant Garamond',Georgia,serif);
font-weight:600; letter-spacing:-.015em; text-transform:none;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.header__nav-megamenu__col-title,.header__mobile-sheet-group-title) {
font-family:var(--brand-font-body,Manrope,system-ui,sans-serif);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__nav-megamenu__feature-tag { color:#f4d4a6;background:transparent; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.inner-page-hero__badge-dot,.featured__eyebrow-dot) { color:#f4d4a6;background-color:#f4d4a6; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.eyebrow,.featured__price-amount,.inner-page-hero__badge,.cruise-card__time,.ip-acc__chev) { color:#0b7777;border-color:#28e0d1; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.hero .eyebrow,.featured .eyebrow,.split-story--dark-navy .eyebrow,.cta-banner .eyebrow) { color:#f4d4a6; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.card__badge--sunset,.cruise-card__badge) { color:#07131d;background:#91eee6;border-color:#28e0d1; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.header__nav-dropdown-icon,.trust-pill-strip__icon-svg,.featured__meta-icon,.boat-detail__spec-icon) { color:#28e0d1 !important; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.header__nav-dropdown-icon,.featured__meta-icon,.boat-detail__spec-icon) {
position:relative;border:1px solid rgba(40,224,209,.52);border-radius:50%;background:linear-gradient(145deg,#07131d,#0b3047);box-shadow:inset 0 1px 0 rgba(244,212,166,.4),0 8px 22px rgba(1,6,21,.15);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .trust-pill-strip__item { position:relative; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .trust-pill-strip__item::after { content:"";width:4px;height:4px;border-radius:50%;background:#f4d4a6;box-shadow:0 0 10px rgba(244,212,166,.5); }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .trust-pill-strip--marquee {
border-color:rgba(244,212,166,.28);
background:linear-gradient(90deg,#07131d 0%,#123244 48%,#07131d 100%);
box-shadow:inset 0 1px 0 rgba(244,212,166,.14),inset 0 -1px 0 rgba(244,212,166,.1);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .trust-pill-strip--marquee :where(.trust-pill-strip__icon-svg,.trust-pill-strip__pill::after) {
color:#f4d4a6 !important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.charter-inquiry__occasion,.ip-info-item,.contact-panel__field input,.contact-panel__field textarea,.ip-field select,.ip-field textarea,.tour-tabs__quote,.cruise-listing__compare-time) {
background:linear-gradient(145deg,var(--illuminate-glass),rgba(232,245,246,.66));border:1px solid rgba(11,119,119,.2);box-shadow:0 12px 30px rgba(2,35,52,.07),inset 0 1px 0 rgba(255,255,255,.72);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .charter-inquiry__occasion { border-radius:14px; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .charter-inquiry__occasion:hover { border-color:#28e0d1;transform:translateY(-2px); }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] :where(.header__nav-megamenu__col-title,.header__nav-megamenu__label,.header__nav-megamenu__feature-label,.header__nav-megamenu__foot,.header__mobile-sheet-group-title,.header__mobile-sheet-item strong,.header__mobile-sheet-row) { color:#f7fbfc; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] :where(.header__nav-megamenu__desc,.header__nav-megamenu__feature-desc,.header__mobile-sheet-item div) { color:#a7bac6; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.header__nav,.header__nav-dropdown,.header__nav-megamenu,.header__mobile-sheet) {
font-family:var(--brand-font-body,Manrope,system-ui,sans-serif);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__nav-item {
color:#07131d;
font-family:var(--brand-font-body,Manrope,system-ui,sans-serif);
font-size:12px;
font-weight:700;
letter-spacing:.075em;
line-height:1.2;
text-transform:uppercase;
text-shadow:none;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__nav > .header__nav-item,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__nav > .header__nav-group > .header__nav-item {
color:var(--illuminate-ink) !important;
text-shadow:none;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header--transparent .header__nav-item {
color:#f7fbfc !important;
text-shadow:none;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header--transparent .header__nav-parent-link {
color:inherit !important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985']:has(.inner-page-hero) .header .header__nav-item {
color:#f7fbfc !important;
text-shadow:none;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985']:has(.inner-page-hero) .header {
background-color:rgba(1,6,21,.9);
background-image:linear-gradient(108deg,rgba(40,224,209,.08),transparent 30%,rgba(244,212,166,.04) 58%,transparent 86%);
border-bottom-color:rgba(145,238,230,.16);
box-shadow:inset 0 -1px 0 rgba(145,238,230,.12),0 10px 34px rgba(1,6,21,.14);
backdrop-filter:blur(14px) saturate(132%);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985']:has(.inner-page-hero) .header .header__nav-parent-link {
color:inherit !important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__nav-item::after {
background:linear-gradient(90deg,#28e0d1,#f4d4a6);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.header__nav-megamenu__label,.header__nav-dropdown-item__label,.header__nav-megamenu__feature-label) {
font-family:var(--brand-font-heading,'Cormorant Garamond',Georgia,serif);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] :where(.header__nav-dropdown-item,.header__nav-dropdown-item__label) { color:#f7fbfc; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] .header__nav-dropdown-item__sub { color:#b8c8d2; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] :where(.header__nav-dropdown-item:hover,.header__nav-dropdown-item:focus-visible,.header__nav-megamenu__item:hover,.header__nav-megamenu__item:focus-visible) {
color:#fff;background:linear-gradient(100deg,rgba(40,224,209,.18),rgba(244,212,166,.09));
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985']:not([data-illuminate-mode='night']) :where(.header__nav-dropdown-item:hover,.header__nav-dropdown-item:focus-visible,.header__nav-megamenu__item:hover,.header__nav-megamenu__item:focus-visible) {
color:#07131d;background:linear-gradient(100deg,rgba(40,224,209,.2),rgba(244,212,166,.18));
box-shadow:inset 3px 0 0 #0b7777;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .inner-page-hero__inner {
padding-top:clamp(132px,13vw,176px);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .inner-page-hero__badge {
color:#f7fbfc;
background:rgba(1,6,21,.58);
border-color:rgba(145,238,230,.72);
box-shadow:0 10px 30px rgba(1,6,21,.22),inset 0 1px 0 rgba(255,255,255,.12);
backdrop-filter:blur(12px) saturate(130%);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .inner-page-hero__badge-dot {
color:#f4d4a6;background:#f4d4a6;box-shadow:0 0 10px rgba(244,212,166,.6);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .brand-timeline__list::before { background:rgba(11,119,119,.22); }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .brand-timeline__dot { background:#28e0d1;box-shadow:0 0 0 4px rgba(40,224,209,.16),0 0 18px rgba(40,224,209,.28); }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .brand-timeline__year { color:#0b7777; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] :where(.header__mobile-sheet,.header__mobile-sheet-section,.header__mobile-sheet-foot,.header__mobile-sheet-head) { background:#091522; border-color:rgba(130,151,166,.24); }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] .header__mobile-sheet-close { color:#f7fbfc;background:#121446; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .boat-detail__spec {
display:grid; grid-template-columns:44px 1fr; column-gap:14px; align-items:center;
color:#f7fbfc; background:linear-gradient(145deg,#07131d,#0b3047);
border:1px solid rgba(40,224,209,.35); border-radius:16px;
box-shadow:0 16px 38px rgba(1,6,21,.14),inset 0 1px 0 rgba(255,255,255,.08);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .boat-detail__spec-icon {
grid-row:1 / span 2; width:44px;height:44px;padding:10px;border-radius:50%;
background:rgba(40,224,209,.12);box-shadow:0 0 24px rgba(40,224,209,.15);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .boat-detail__spec-desc { color:#a7bac6; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .boat-detail__spec-label { color:#f7fbfc; }
@supports (color:color(display-p3 1 1 1)) {
@media (dynamic-range: high) and (prefers-reduced-motion:no-preference) {
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-effects='full'] :where(.illuminate-mode-toggle__orb,.light-wake-cta,.boat-detail__spec-icon,.featured__meta-icon) { filter:drop-shadow(0 0 8px color(display-p3 .08 .93 .84 / .32)) drop-shadow(0 0 24px color(display-p3 1 .79 .51 / .18)); }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-effects='full'] .header--transparent .header__logo { filter:brightness(1.22) saturate(1.34) drop-shadow(0 0 9px color(display-p3 .08 .93 .84 / .48)) drop-shadow(0 0 24px color(display-p3 1 .79 .51 / .18)); }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-effects='full'] :where([aria-label='split-story:home.night-reef-preview'],[aria-label='split-story:pitch-lights-on-the-bay.manta-concept']) .split-story__image::after {
opacity:1;
filter:drop-shadow(0 0 18px color(display-p3 .08 .93 .84 / .38)) saturate(1.22);
}
}
}
.illuminate-mode-control { position:fixed;z-index:10020;display:flex;align-items:center;gap:3px;padding:4px;border:1px solid rgba(145,238,230,.32);border-radius:999px;background:rgba(1,6,21,.9);box-shadow:0 12px 34px rgba(1,6,21,.34),inset 0 1px 0 rgba(255,255,255,.1);touch-action:none;transition:left 180ms ease,top 180ms ease,box-shadow 180ms ease; }
.illuminate-mode-control[hidden] { display:none!important; }
.illuminate-mode-control[data-dragging='true'] { transition:none;box-shadow:0 18px 48px rgba(1,6,21,.48),0 0 0 2px rgba(40,224,209,.32); }
body.header-mobile-menu-open .illuminate-mode-control { opacity:0;pointer-events:none;visibility:hidden; }
/* Circular hover ≈ sun↔moon orb (26px). 44px hit target stays; visible fill is centered circle. */
.illuminate-mode-drag,.illuminate-mode-dismiss { position:relative;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;color:#d8e8ef;background:transparent;cursor:pointer; }
.illuminate-mode-drag { touch-action:none;cursor:grab;transition:color 180ms ease,transform 180ms ease; }
.illuminate-mode-drag:active { cursor:grabbing; }
.illuminate-mode-drag svg { position:relative;z-index:1;width:14px;height:20px;fill:currentColor; }
.illuminate-mode-dismiss { font:400 20px/1 Manrope,system-ui,sans-serif; }
.illuminate-mode-dismiss__glyph,.illuminate-mode-dismiss > *,.illuminate-mode-drag > * { position:relative;z-index:1; }
.illuminate-mode-dismiss__glyph { display:inline-block;line-height:1;color:inherit; }
.illuminate-mode-drag::before,.illuminate-mode-dismiss::before { content:"";position:absolute;left:50%;top:50%;z-index:0;width:26px;height:26px;margin:-13px 0 0 -13px;border-radius:50%;background:transparent;box-shadow:none;transition:background-color 180ms ease,box-shadow 180ms ease,transform 180ms ease;pointer-events:none; }
.illuminate-mode-drag:is(:hover,:focus-visible),.illuminate-mode-dismiss:is(:hover,:focus-visible) { color:#07131d;background:transparent;outline:none; }
.illuminate-mode-drag:is(:hover,:focus-visible)::before,.illuminate-mode-dismiss:is(:hover,:focus-visible)::before { background:#91eee6;box-shadow:0 6px 16px rgb(40 224 209 / 28%);transform:translateY(-1px); }
.illuminate-mode-drag:focus-visible::before,.illuminate-mode-dismiss:focus-visible::before { box-shadow:0 0 0 3px #f4d4a6,0 6px 16px rgb(40 224 209 / 28%); }
.illuminate-mode-toggle:is(:hover,:focus-visible) .illuminate-mode-toggle__orb { box-shadow:0 0 0 3px rgba(145,238,230,.55),0 2px 8px rgba(1,6,21,.38),0 0 18px rgba(40,224,209,.5); }
.illuminate-mode-toggle:is(:hover,:focus-visible) { border-color:#28e0d1; }
.illuminate-mode-restore { display:inline-flex;align-items:center;justify-content:center;min-height:44px;margin:18px auto 0;padding:10px 16px;border:1px solid rgba(145,238,230,.56);border-radius:999px;color:#f7fbfc;background:rgba(7,19,29,.72);font:700 11px/1.2 Manrope,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;cursor:pointer; }
.illuminate-mode-restore[hidden] { display:none!important; }
.illuminate-mode-restore:is(:hover,:focus-visible) { color:#07131d;background:#91eee6;outline:3px solid #f4d4a6;outline-offset:3px; }
body.header-mobile-menu-open [data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__hamburger { pointer-events:none;visibility:hidden; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__hamburger[aria-expanded='true'] { pointer-events:none;visibility:hidden; }
.illuminate-mode-toggle { position:relative;display:inline-flex;align-items:center;gap:10px;min-height:44px;min-width:44px;padding:5px 6px;border:1px solid rgba(255,255,255,.28);border-radius:999px;color:#fff;background:rgba(1,6,21,.82);box-shadow:inset 0 1px 0 rgba(255,255,255,.1);cursor:pointer;font:700 11px/1 Manrope,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase; }
.illuminate-mode-toggle__label { position:absolute;top:calc(100% + 8px);left:50%;padding:7px 10px;border:1px solid rgba(145,238,230,.28);border-radius:8px;color:#f7fbfc;background:rgba(1,6,21,.92);box-shadow:0 8px 22px rgba(1,6,21,.25);opacity:0;visibility:hidden;white-space:nowrap;pointer-events:none;transform:translateX(-50%);transition:opacity 180ms ease,visibility 180ms ease; }
.illuminate-mode-toggle:hover .illuminate-mode-toggle__label,
.illuminate-mode-toggle:focus-visible .illuminate-mode-toggle__label { opacity:1;visibility:visible; }
.illuminate-mode-toggle:hover { border-color:#28e0d1; }
.illuminate-mode-toggle:focus-visible { outline:3px solid #f4d4a6;outline-offset:3px; }
.illuminate-effects-dock { position:fixed;right:0;top:62%;z-index:89;transform:translateY(-50%); }
body.header-mobile-menu-open .illuminate-effects-dock { opacity:0;pointer-events:none;visibility:hidden; }
.illuminate-effects-toggle { position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:48px;min-height:48px;padding:0 12px;border:1px solid rgba(145,238,230,.34);border-right:0;border-radius:14px 0 0 14px;color:#fff;background:rgba(1,6,21,.88);box-shadow:0 10px 28px rgba(1,6,21,.26),inset 0 1px 0 rgba(255,255,255,.1);backdrop-filter:blur(16px) saturate(130%);cursor:pointer;font:700 11px/1 Manrope,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;transition:background-color 180ms ease,border-color 180ms ease,box-shadow 180ms ease; }
.illuminate-effects-toggle__icon { width:22px;height:22px;fill:none;stroke:#91eee6;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round; }
.illuminate-effects-toggle__label { position:absolute;right:calc(100% + 9px);top:50%;max-width:none;padding:8px 10px;border:1px solid rgba(145,238,230,.28);border-radius:8px;color:#f7fbfc;background:rgba(1,6,21,.94);box-shadow:0 8px 22px rgba(1,6,21,.25);opacity:0;visibility:hidden;white-space:nowrap;pointer-events:none;transform:translateY(-50%);transition:opacity 180ms ease,visibility 180ms ease; }
.illuminate-effects-toggle:hover .illuminate-effects-toggle__label,
.illuminate-effects-toggle:focus-visible .illuminate-effects-toggle__label { opacity:1;visibility:visible; }
.illuminate-effects-toggle:hover { border-color:#28e0d1;background:rgba(7,19,29,.96); }
.illuminate-effects-toggle[aria-pressed='true'] { color:#f4d4a6;border-color:#f4d4a6;background:rgba(7,19,29,.96); }
.illuminate-effects-toggle:focus-visible { outline:3px solid #f4d4a6;outline-offset:3px; }
.illuminate-mode-toggle__track { position:relative;display:grid;grid-template-columns:1fr 1fr;align-items:center;width:54px;height:32px;padding-inline:8px;border:1px solid rgba(145,238,230,.18);border-radius:999px;color:#f4d4a6;background:linear-gradient(135deg,#18234f,#07131d);box-shadow:inset 0 2px 7px rgba(0,0,0,.38); }
.illuminate-mode-toggle__sun,.illuminate-mode-toggle__moon { position:relative;z-index:2;width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;pointer-events:none; }
.illuminate-mode-toggle__moon { justify-self:end;color:#28e0d1; }
.illuminate-mode-toggle__orb { position:absolute;left:3px;width:26px;height:26px;border-radius:50%;background:linear-gradient(145deg,#fff4dc,#f4d4a6);box-shadow:0 2px 8px rgba(1,6,21,.38),0 0 16px rgba(244,212,166,.42);transition:transform 360ms cubic-bezier(.22,1,.36,1),background-color 360ms ease,box-shadow 360ms ease; }
[data-illuminate-mode='night'] .illuminate-mode-toggle__orb { transform:translateX(22px);background:linear-gradient(145deg,#b9fff8,#28e0d1);box-shadow:0 2px 8px rgba(1,6,21,.42),0 0 20px rgba(40,224,209,.64); }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] .header__nav-dropdown::before,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] .header__nav-megamenu::before {
background:#091522!important;
border-color:rgba(130,151,166,.24)!important;
}
::view-transition-old(root) { animation:illuminate-fade-out 360ms ease both; }
::view-transition-new(root) { animation:illuminate-reveal 720ms cubic-bezier(.22,1,.36,1) both; }
@keyframes illuminate-fade-out { to { opacity:.45;filter:saturate(.75); } }
@keyframes illuminate-reveal { from { clip-path:circle(0 at calc(100% - 58px) 102px);filter:brightness(1.18) saturate(1.2); } to { clip-path:circle(150% at calc(100% - 58px) 102px);filter:brightness(1) saturate(1); } }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .card__offer-slot {
min-width: 0;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .card__offer {
box-sizing: border-box;
max-width: 100%;
white-space: normal;
justify-content: center;
text-align: center;
line-height: 1.35;
}
@media(max-width:720px) {
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__mobile-sheet { z-index:10004; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__mobile-sheet {
overflow:hidden;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__mobile-sheet-body {
min-height:0;
overflow-y:auto;
overscroll-behavior:contain;
-webkit-overflow-scrolling:touch;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__mobile-sheet-foot {
position:sticky;
z-index:2;
bottom:0;
padding-bottom:calc(22px + env(safe-area-inset-bottom));
flex:none;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__mobile-sheet-foot .btn {
min-height:48px;
margin:0;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header { padding-inline:22px; }
.illuminate-mode-control{max-width:calc(100vw - 24px)}
.illuminate-mode-toggle__label{display:none}
.illuminate-mode-toggle{padding:7px}
.illuminate-effects-dock{top:auto;right:0;bottom:calc(88px + env(safe-area-inset-bottom));transform:none}
.illuminate-effects-toggle__label{display:none}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .card__offer {
overflow-wrap: anywhere;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .inner-page-hero__title {
font-size: clamp(38px, 10vw, 44px);
max-width: 13ch;
overflow-wrap: normal;
word-break: normal;
hyphens: none;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .inner-page-hero__inner { padding-top:128px; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__mobile-sheet-logo {
width:min(210px,65vw)!important;height:auto!important;max-width:none!important;
padding:0!important;background:transparent!important;border:0!important;border-radius:0!important;object-fit:contain;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985']:not([data-illuminate-mode='night']) .header__mobile-sheet :where(.header__mobile-sheet-row,.header__mobile-sheet-item,.header__mobile-sheet-item strong,.header__mobile-sheet-group-title) { color:#07131d!important; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__mobile-mode-toggle {
display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;width:100%;min-height:48px;padding:10px 16px;
border:1px solid rgba(7,19,29,.24);border-radius:999px;color:#07131d;background:#e8f5f6;
font:750 12px/1.2 var(--brand-font-body,Manrope,sans-serif);letter-spacing:.06em;text-transform:uppercase;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] .header__mobile-mode-toggle { color:#f7fbfc;border-color:rgba(145,238,230,.4);background:#121f2d; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] .header__mobile-sheet-foot .btn {
color:#07131d!important;
background:#91eee6!important;
border-color:#91eee6!important;
text-shadow:none!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__mobile-mode-toggle:focus-visible { outline:3px solid #0b7777;outline-offset:3px; }
}
@media(min-width:721px) and (max-width:1240px) {
.illuminate-mode-control{right:274px}
}
@media(max-width:300px) {
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .trust-pill-strip { padding-inline:0;overflow:clip; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .trust-pill-strip__marquee-track { width:calc(100% - 4px);margin-inline:2px;transform:none!important; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .trust-pill-strip--marquee .trust-pill-strip__pill { max-width:100%; }
}
@media(prefers-reduced-motion:reduce) { [data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'],[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] *,.illuminate-mode-toggle__orb,.illuminate-effects-toggle,.illuminate-effects-toggle__label{transition-duration:.01ms!important;animation:none!important} [data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.btn,.mc-btn,.card__cta-link,.cruise-card__btn):hover{transform:none}[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header--transparent{animation:none!important;background-position:0 0,50% 0}::view-transition-old(root),::view-transition-new(root){animation:none} }
@media(prefers-reduced-motion:reduce) {
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header--transparent .header__logo,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .footer-brand-block__logo { filter:none!important; }
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-effects='calm'] :where([aria-label='split-story:home.night-reef-preview'],[aria-label='split-story:pitch-lights-on-the-bay.manta-concept']) .split-story__image::before,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-effects='calm'] :where([aria-label='split-story:home.night-reef-preview'],[aria-label='split-story:pitch-lights-on-the-bay.manta-concept']) .split-story__image::after,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-effects='calm'] :where(.light-wake-cta__ripple,.light-wake-cta__shimmer) { animation:none!important;transition:none!important;filter:none!important; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-effects='calm'] .header--transparent { animation:none!important;background-position:0 0,50% 0; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-effects='calm'] .header--transparent .header__logo,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-effects='calm'] .footer-brand-block__logo { filter:none!important; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-effects='calm'] :where(.footer__brand-logo-tile,.footer-columns__col--brand .footer-brand-block) { background-image:none!important; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-effects='calm'] :where([aria-label='split-story:home.night-reef-preview'],[aria-label='split-story:pitch-lights-on-the-bay.manta-concept']) .split-story__image::before { background:rgba(1,6,21,.48);mask-image:none;-webkit-mask-image:none; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-effects='calm'] :where([aria-label='split-story:home.night-reef-preview'],[aria-label='split-story:pitch-lights-on-the-bay.manta-concept']) .split-story__image::after { opacity:0; }
/* Important-pass PDP legibility. Related cards remain a single accessible
link, with a visible booking label below their authored body copy. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .tour-tabs__related-body::after {
content:'Book Now';display:inline-flex;align-items:center;justify-content:center;
min-height:40px;margin-top:14px;padding:0 18px;border-radius:999px;
color:#f7fbfc;background:#07131d;border:1px solid #07131d;
font:750 12px/1 var(--brand-font-body,Manrope,system-ui,sans-serif);
letter-spacing:.07em;text-transform:uppercase;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] :where(.hw-product-body,.tour-tabs,.tour-tabs__panel,.tour-sequence__story,.tour-perspective__details,.tour-tabs__related) {
background:#07131d!important;color:#f7fbfc!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] .tour-tabs__related-card {
background:#102b38!important;color:#f7fbfc!important;border-color:rgba(145,238,230,.3)!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] :where(.tour-tabs__related-body h3,.tour-tabs__related-body p,.tour-tabs__heading,.tour-tabs__subhead,.tour-tabs__tl-what,.tour-tabs__tl-desc,.ip-info-item__label,.ip-info-item__value,.ip-acc__summary,.ip-acc__body,.tour-sequence__story h2,.tour-sequence__story h3,.tour-sequence__story p) {
color:#f7fbfc!important;opacity:1!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] .tour-tabs__related-body::after {
color:#07131d;background:#91eee6;border-color:#91eee6;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .testimonial-card::before,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .testimonial-card::after { display:none!important;content:none!important; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] [aria-label='cta-banner:home.cta'] .cta-banner__content {
justify-content:center;gap:18px;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] [aria-label='cta-banner:home.cta'] .cta-banner__actions { margin-top:6px; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-page-key='the-vessel'] [aria-label='cta-banner:the-vessel.cta'] .cta-banner__overlay {
background:linear-gradient(180deg,rgba(1,6,21,.34),rgba(1,6,21,.72));
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-page-key='the-vessel'] [aria-label='cta-banner:the-vessel.cta'] :where(.cta-banner__eyebrow,.cta-banner__headline,.cta-banner__subheadline) {
color:#f7fbfc!important;text-shadow:0 2px 18px rgba(1,6,21,.55);
}
@media(max-width:720px) {
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.section,.mega) { border-radius:0!important; }
/* ...but .featured and .cta-banner do NOT go full-bleed at this width: they
keep a 24px inset each side (421px wide in a 469px viewport). Squaring
them leaves a floating card with hard corners. Restore the kit's
small-screen radius for those two only. .split-story / .photo-gallery are
genuinely edge-to-edge here, so they stay square. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.featured,.cta-banner) { border-radius:14px!important; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .eyebrow { font-size:12px!important;line-height:1.35; }
/* ── Mobile sweep 2026-09-25 ────────────────────────────────────────────
Measured at 390px across home + PDPs. Three inconsistencies normalised
here rather than in packages/theme-ocean-charter (shared with the other
ocean-charter sites).
1) RADIUS — content surfaces carried 8 different values sitewide
(4/8/10/12/14/16/18/22px). 14px is already the most common on mobile
(featured, cta-banner, photo-gallery__link, light-reveal__point) and
matches the kit's own <=640px value, so everything lands there.
Header chrome (hamburger 8px, logo 4px) is deliberately left alone —
it is chrome, not content. Intentionally-asymmetric corners
(.illuminate-inline-booking__title 17/17/0/0, .split-story__pullquote
0/6/6/0) are also left, since those are structural, not accidental. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(
.card, .wildlife__card, .testimonial-card, .split-story__image,
.split-story__media-reveal, .split-story__vessel-stamp, .hw-product-fact,
.hw-product-related__card, .illuminate-inline-booking, .photo-gallery__link,
.light-reveal__point, .featured, .cta-banner,
.tour-overview-simple__details details,
.cruise-card, .cruise-listing__compare-row, .cruise-listing__compare-time,
.illuminate-inline-booking__widget-shell, .boat-detail__spec,
.contact-panel__photo, .contact-panel__map
) { border-radius:14px!important; }
/* .split-story__grid carries a 22px radius but runs edge-to-edge at this
width (390px of a 390px viewport), so the rounded corners cut into the
section background with no inset to sit in. Square it while full-bleed. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .split-story__grid {
border-radius:0!important;
}
/* 2) VERTICAL RHYTHM — standard section padding is 56px, but testimonials
ran 80px and a few ran 0/20px, so the gaps between bands read unevenly
while scrolling. Normalise the standard content bands to 56px. Heroes
and the inset .featured / .cta-banner cards keep their own spacing. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(section.section, .photo-gallery) {
padding-top:56px!important; padding-bottom:56px!important;
}
/* 3) TEXT FLOOR — smallest rendered text was 9px (.wildlife__tag) with
prices at 10px and durations at 11px. No WCAG SC sets a minimum size,
but these sit under both iOS HIG (>=11pt) and Material (>=12sp).
Floor incidental text at 12px and interactive labels at 14px. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(
.wildlife__tag, .value-prop__tag, .card__badge, .card__offer, .card__duration,
.hw-product-fact dt, .footer-columns__copyright, .inner-page-hero__crumb-sep
) { font-size:12px!important; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.btn__label, .mc-btn__label) { font-size:14px!important; }
}
@media(prefers-contrast:more),(forced-colors:active) { [data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where([aria-label='split-story:home.night-reef-preview'],[aria-label='split-story:pitch-lights-on-the-bay.manta-concept']) .split-story__image::before,[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where([aria-label='split-story:home.night-reef-preview'],[aria-label='split-story:pitch-lights-on-the-bay.manta-concept']) .split-story__image::after,[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.light-wake-cta__ripple,.light-wake-cta__shimmer){display:none!important} [data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header--transparent{animation:none!important;background-image:none!important;backdrop-filter:none!important} [data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.header__nav-dropdown-icon,.featured__meta-icon,.boat-detail__spec-icon,.header__logo){filter:none;box-shadow:none;backdrop-filter:none} }
/* Hannah reconciliation: two deliberately related CTA surfaces. Existing
booking behavior and Light Wake click/ripple semantics remain untouched. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.btn,.mc-btn,.card__cta-link,.cruise-card__btn,.header__cta,.tour-overview__book-btn,.split-story__secondary-cta) {
min-height:44px;border-radius:999px;font-family:var(--brand-font-button,var(--brand-font-body,Manrope,system-ui,sans-serif));font-size:13px;font-weight:700;line-height:1.15;letter-spacing:.06em;text-transform:uppercase;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.mc-btn--variant_primary,.mc-btn--variant_booking,.mc-btn--variant_cta,.light-wake-cta,.btn--primary,.btn--teal,.card__cta-link,.cruise-card__btn,.header__cta,.tour-overview__book-btn) {
color:#010615;background:linear-gradient(112deg,#f4d4a6 0%,#91eee6 52%,#f4d4a6 100%);border-color:rgba(1,6,21,.35);box-shadow:0 12px 30px rgba(1,6,21,.22);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.btn--ghost,.btn--ghost-hero,.btn--ghost-light,.btn--ghost-sunset,.mc-btn--variant_ghost,.split-story__secondary-cta) {
color:#010615;background:linear-gradient(180deg,#b9fff8 0%,#78ddd5 100%);border-color:#91eee6;box-shadow:0 12px 30px rgba(1,6,21,.18);
}
/* Clarke's First Light carousel tokens, measured from the approved kit.
Keep the luminous CTA family everywhere else. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .activity-card-grid--overlap-carousel .card__offer {
color:#1a7a4c!important;background:#eaf7ee!important;border:1px solid #c7e8d1!important;border-radius:999px!important;padding:4px 9px!important;font:700 10px/16px var(--brand-font-body,Manrope,system-ui,sans-serif)!important;letter-spacing:.08em!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985']:not([data-illuminate-mode='night']) .activity-card-grid--overlap-carousel .card__cta-link {
color:#fff!important;background:linear-gradient(#0b3047,#061d2d)!important;border:1px solid rgba(40,224,209,.56)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 8px 20px rgba(2,35,52,.16)!important;padding:12px 10px!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985']:not([data-illuminate-mode='night']) .activity-card-grid--overlap-carousel .card__cta-link--secondary {
color:#000!important;background:transparent!important;background-image:none!important;border:1px solid #000!important;box-shadow:none!important;padding:12px 10px!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985']:not([data-illuminate-mode='night']) .activity-card-grid--overlap-carousel .card__cta-link--secondary:is(:hover,:focus-visible) {
color:#fff!important;background:#07131d!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.btn,.mc-btn,.card__cta-link,.cruise-card__btn,.header__cta,.tour-overview__book-btn,.split-story__secondary-cta):focus-visible{outline:3px solid #f4d4a6;outline-offset:3px}
/* Chris/Evan alignment pass: keep the booking pill on the same optical
midline as the desktop navigation, and make the two narrow-card actions
one equal-height row even when the secondary label is longer. */
@media(min-width:768px) {
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__cta {
align-self:center;
display:inline-flex;
align-items:center;
justify-content:center;
box-sizing:border-box;
margin:0;
line-height:1;
}
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .activity-card-grid--overlap-carousel .card__cta-row {
align-items:stretch;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .activity-card-grid--overlap-carousel .card__cta-row :is(.card__cta-link,.card__cta-link--secondary) {
display:inline-flex;
align-items:center;
justify-content:center;
box-sizing:border-box;
min-height:44px;
height:44px;
margin:0;
line-height:1.15;
}
@media(max-width:720px) {
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .activity-card-grid--overlap-carousel .card__cta-row :is(.card__cta-link,.card__cta-link--secondary) {
padding-inline:8px!important;
font-size:10px;
letter-spacing:.025em;
white-space:nowrap;
}
}
@media(forced-colors:active) {
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .light-wake-cta {
color:ButtonText;
background:ButtonFace;
background-image:none;
border:2px solid ButtonText;
box-shadow:none;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.btn,.mc-btn,.card__cta-link,.cruise-card__btn,.split-story__secondary-cta) {
color:ButtonText;background:ButtonFace;background-image:none;border:2px solid ButtonText;box-shadow:none;backdrop-filter:none;
}
}
/* Final mobile navigation state contract. Keep this last so the legacy
scrolled-header palette cannot repaint After Dark controls. */
@media(max-width:720px) {
body [data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night']
.header:not(.header--transparent) button.header__hamburger {
color:#f7fbfc!important;
border-color:rgba(145,238,230,.5)!important;
}
body [data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night']
.header:not(.header--transparent) button.header__hamburger .header__hamburger-bar {
background:currentColor!important;
}
}
/* /cruises is a composed listing rather than a generic raised section.
Pin its accessible night palette after the legacy mode rules so the
selected filter, schedule badge, and card surface keep distinct roles. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-page-key='cruises'][data-illuminate-mode='night']
.cruise-listing {
background:linear-gradient(180deg,#07131d,#0b2637)!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-page-key='cruises'][data-illuminate-mode='night']
.cruise-card {
background:#173d52!important;
border-color:#527083!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-page-key='cruises'][data-illuminate-mode='night']
.cruise-card__body {
background:#173d52!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-page-key='cruises'][data-illuminate-mode='night']
.cruise-card :where(.cruise-card__title,.cruise-card__meta,.cruise-card__desc,.cruise-card__highlight,.cruise-card__price) {
color:#f7fbfc!important;
opacity:1!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-page-key='cruises'][data-illuminate-mode='night']
.cruise-card__badge {
color:#07131d!important;
background:#91eee6!important;
border-color:#28b8b0!important;
}
/* BoatDetail predates the shared `.section` shell, so it needs an explicit
Illuminate After Dark surface contract instead of inheriting its white
base. Preserve the teal/navy hierarchy used by home and /cruises. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-page-key='the-vessel'][data-illuminate-mode='night']
.boat-detail {
background:
radial-gradient(circle at 88% 0%,rgba(40,224,209,.12),transparent 32rem),
linear-gradient(180deg,#07131d,#0b2637)!important;
color:#f7fbfc!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-page-key='the-vessel'][data-illuminate-mode='night']
.boat-detail :where(.boat-detail__heading,.boat-detail__subhead,.boat-detail__text,.boat-detail__spec-label,.ip-acc__summary,.ip-acc__body) {
color:#f7fbfc!important;
opacity:1!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-page-key='the-vessel'][data-illuminate-mode='night']
.boat-detail__spec {
background:#173d52!important;
border:1px solid #527083!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-page-key='the-vessel'][data-illuminate-mode='night']
.boat-detail__spec-desc {
color:#dce9ed!important;
opacity:1!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-page-key='the-vessel'][data-illuminate-mode='night']
.boat-detail .ip-acc {
background:#102c3e!important;
border-color:#527083!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-page-key='the-vessel'][data-illuminate-mode='night']
.boat-detail .ip-acc__chev {
color:#91eee6!important;
}
/* ── Mobile sweep 2026-09-25, part 2 ───────────────────────────────────────
Placed at the end of the sheet deliberately: the text floor earlier in this
file loses on the cascade to two later, more specific blocks —
the "Clarke's First Light carousel tokens" rule above sets
`font:700 10px/16px ...!important` at (0,3,0), and the footer/chrome rules
sit in the shared kit. These are the same 12px floor / 14px interactive
rules, re-stated here so they actually land.
NOTE for review: the carousel price pill at 10px is an APPROVED kit token,
not an accident. It is raised to 12px on mobile ONLY — desktop keeps
Clarke's 10px. Revert this one block if the kit value must hold on phones. */
@media (max-width:720px) {
/* Plain (not :where) so this reaches (0,3,0) and ties the carousel token
rule above; being later in the sheet, it then wins. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .activity-card-grid--overlap-carousel .card__offer {
font-size:12px!important; line-height:16px!important;
}
/* The two card CTAs sit side by side at ~103px each. At the 14px label
floor "Explore Cruise →" needs 130px and `white-space:nowrap` pushed it
outside its own border. Stack them on mobile instead of shrinking the
label back: full-width rows also give a comfortable tap target. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .activity-card-grid--overlap-carousel .card__cta-row {
flex-direction:column!important; align-items:stretch!important; gap:8px!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .activity-card-grid--overlap-carousel :where(.card__cta-link, .card__cta-link--secondary) {
font-size:14px!important; width:100%!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(
.split-story__vessel-stamp-tagline, .split-story__media-reveal-kicker,
.footer-brand-block__tagline, .footer-brand-block__follow-label,
.footer-columns__heading, .footer-columns__legal-links a,
.header__mobile-sheet-group-title, .hero__location-badge span
) { font-size:12px!important; }
/* Inline booking panel: eyebrow 10px, topline + footnote 11px, and the
mobile booking bar's `small` at 9px — the smallest text on any PDP,
sitting right on the primary Book path. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(
.illuminate-inline-booking__eyebrow, .illuminate-inline-booking__footnote,
.illuminate-inline-booking__hint, .illuminate-inline-booking__safety,
.illuminate-inline-booking__topline span, .illuminate-mobile-booking-bar small
) { font-size:12px!important; }
/* The PDP eyebrow/kicker family is authored at .72rem = 11.52px, which
lands just under the floor once rem resolves. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(
.hw-product-glance__eyebrow, .hw-product-related__eyebrow,
.tour-overview-simple__story span, .manifest-guest-poc__eyebrow,
.cruise-listing__compare-time, .cruise-listing__compare-status
) { font-size:12px!important; }
/* "Book Now" on the related-cruise cards renders as a bare `em` at .72rem.
It is a link label, so it takes the 14px interactive floor, not 12px. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hw-product-related__card em { font-size:14px!important; font-style:normal; }
}
/* ── Desktop spacing pass 2026-09-29 ───────────────────────────────────────
Two sources of dead vertical space, both measured at 1440px on home.
1) SPLIT-STORY PANEL GAP — 258px of empty page background between the two
navy panels. NOT padding: the section carries `min-height:760px` while
its panel is only 502px tall, so the panel centres and leaves ~129px
above and below. Reducing padding alone did nothing (verified at 56/40/
28px — the gap stayed exactly 258). Releasing the min-height lets the
section size to its content; 28px padding then yields a 56px panel gap,
which matches the site's other inset gaps (cta-banner 56, value-prop 48).
Section height 760 -> 558.
2) FEATURED BANNER — `aspect-ratio:16/9` forced 720px at the 1280px max
width, and `.featured__content` used `justify-content:space-between`,
which pushed the meta row and the CTA 215px apart. Group the content and
let a 520px min-height set the banner: 720 -> 520, gap 215 -> 28, and the
section plus its 48px margins (616px) now clears a 900px viewport. */
@media (min-width:721px) {
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] section.split-story {
min-height:0!important; padding-top:28px!important; padding-bottom:28px!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .featured.mega { aspect-ratio:auto!important; min-height:520px!important; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .featured.mega .featured__content {
justify-content:flex-start!important; gap:28px!important;
}
}
/* ── Accordion carets 2026-09-29 ───────────────────────────────────────────
Audited every `details` on the site. `.ip-acc` on the-vessel already ships a
caret (a 10px span, 2px border, #28e0d1, rotated 45deg). The other two
families had NO affordance at all — no marker, no pseudo-element, no icon:
.faq__items details home, /faq, and every PDP (7 + 14 + ...)
.tour-overview-simple__details details PDP info cards (9 on snorkel)
Same geometry and colour as the existing .ip-acc__chev so all three match.
The summaries were already flex/space-between, so the caret lands right. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] summary.faq__question,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .tour-overview-simple__details > details > summary {
list-style:none;
display:flex; align-items:center; justify-content:space-between; gap:16px;
cursor:pointer;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] summary.faq__question::-webkit-details-marker,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .tour-overview-simple__details > details > summary::-webkit-details-marker {
display:none;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] summary.faq__question::after,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .tour-overview-simple__details > details > summary::after {
content:""; flex:0 0 auto; width:10px; height:10px;
border-right:2px solid #28e0d1; border-bottom:2px solid #28e0d1;
transform:rotate(45deg) translate(-2px,-2px);
transition:transform .2s ease;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] details[open] > summary.faq__question::after,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .tour-overview-simple__details > details[open] > summary::after {
transform:rotate(-135deg) translate(-2px,-2px);
}
/* F1a fix 2026-09-29 — FAQ page carets.
The theme ships a page-scoped kill-switch that suppressed the caret on /faq only:
packages/theme-ocean-charter/src/styles.css:10762
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-page-key='faq'] .faq__question::after { content:none; display:none }
That is specificity (0,3,0) and the open-state variant (.faq__item[open] …) is (0,4,0),
both of which beat the (0,2,1) caret rule above, so the caret rendered everywhere
EXCEPT /faq. Restore content+display at (0,3,1)/(0,4,1) plus !important; the caret's
size, borders and rotation still come from the rules above. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-page-key='faq'] summary.faq__question::after,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-page-key='faq'] .faq__item[open] summary.faq__question::after {
content:""!important; display:block!important;
}
@media (prefers-reduced-motion:reduce) {
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] summary.faq__question::after,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .tour-overview-simple__details > details > summary::after { transition:none; }
}
/* ── Dark-mode contrast 2026-09-29 ─────────────────────────────────────────
Feedback doc: "product pages ... ensure ALL text has high contrast" in dark
mode. Dark backgrounds already work; the failures are the accent teals.
#087F85 and #0B7777 are declared with no mode qualifier, so one value serves
both palettes: 3.92:1 and 3.50:1 on the #07131D night surface (need 4.5).
Remap to #91EEE6 in night only — 13.9:1 on page, 11.9:1 on the cards.
First Light is untouched.
Both selector forms on purpose: locally the mode attribute lands on the
.theme-preview div only, while apex also sets html.illuminate-mode-night. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] :where(
.hw-product-glance__eyebrow, .hw-product-related__eyebrow,
.tour-overview-simple__tagline, .tour-overview-simple__story span,
.manifest-guest-poc__eyebrow, .eyebrow,
.featured__price-amount, .inner-page-hero__badge,
.cruise-card__time, .ip-acc__chev,
.cruise-listing__compare-time, .cruise-listing__compare-status
),
html.illuminate-mode-night :where(
.hw-product-glance__eyebrow, .hw-product-related__eyebrow,
.tour-overview-simple__tagline, .tour-overview-simple__story span,
.manifest-guest-poc__eyebrow, .eyebrow,
.featured__price-amount, .inner-page-hero__badge,
.cruise-card__time, .ip-acc__chev,
.cruise-listing__compare-time, .cruise-listing__compare-status
) { color:#91EEE6!important; }
/* Feedback doc: "Carets don't have enough contrast on the dropdown in dark
mode." Lift the caret to the same night teal as the text above. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] summary.faq__question::after,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] .tour-overview-simple__details > details > summary::after,
html.illuminate-mode-night summary.faq__question::after,
html.illuminate-mode-night .tour-overview-simple__details > details > summary::after {
border-right-color:#91EEE6!important; border-bottom-color:#91EEE6!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] .ip-acc__chev,
html.illuminate-mode-night .ip-acc__chev { border-color:#91EEE6!important; }
/* ── Feedback doc pass 2026-09-29 ──────────────────────────────────────────
"Sitewide - there is too much space between sections, I would honestly
reduce the space by half." Desktop content bands ran 100px top and bottom
(photo-gallery 104, testimonials 80). Halving lands on 56px, which is also
the rhythm already used on mobile and the split-story panel gap, so the
whole site now shares one value. Heroes and the inset featured / cta cards
keep their own spacing. */
@media (min-width:721px) {
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(section.section, .photo-gallery) {
padding-top:56px!important; padding-bottom:56px!important;
}
}
/* "In places with galleries, please make even rows so there isn't any blank
space to the right." The photo-gallery grid was 4 columns while the galleries
hold 3 items (PDPs) and 6 (home) — leaving 1 and 2 empty cells. Three columns
divides both evenly. The /gallery page keeps its own feature-first layout. */
@media (min-width:721px) {
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .photo-gallery__grid { grid-template-columns:repeat(3,minmax(0,1fr))!important; }
}
/* "Get rid of the white background of the 'From fitted gear...' section - just
let it be the light grey. Also in dark mode it doesn't need a new background
colour." Let the gallery band inherit the page surface in both modes. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .photo-gallery,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] .photo-gallery,
html.illuminate-mode-night .photo-gallery { background:transparent!important; }
/* ── Leaked ocean-charter accent removal 2026-09-29 ────────────────────────
Both of these paint #FF7A3E — `--brand-sunset`, an ocean-charter demo value
that rides along in the brand book. Nothing on Illuminate should be orange.
1) The 22x1px horizontal rule before eyebrows. It only appears inside
.split-story--dark-navy, which is why it shows up "sometimes":
.theme-preview .split-story--dark-navy .eyebrow::before
{ content:''; width:22px; height:1px; background:var(--brand-sunset,#ff7a3e) }
2) The dots flanking the CTA-banner eyebrow ("First light · reef light ·
golden light · after dark").
Left alone: .inner-page-hero__badge-dot is sand #F4D4A6, not the orange, and
reads as the location pin's marker — say if that should go too. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .split-story--dark-navy .eyebrow::before {
content:none!important; display:none!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .cta-banner__eyebrow-dot { display:none!important; }
/* ── Header nav 2026-09-29 ─────────────────────────────────────────────────
1) UNDERLINE WIDTH. The kit animates .header__nav-item::after from
`right:100%` to `right:12px` with `left:12px`, which assumed the old
`padding: 8px 12px`. Kit "Phase Q2" changed the item to `padding: 8px 2px`
but left the underline insets at 12px, so the rule sat ~10px short of the
text on each side. Matching the insets to the real padding makes it span
the full text width. (Pre-existing kit mismatch, not a content issue.)
2) SPACING. Nav gap was 6px; widened so the links breathe. Gap is used
rather than item padding so the underline stays exactly text-width. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__nav { gap:26px!important; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__nav-item::after { left:2px!important; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__nav-group:hover .header__nav-item::after,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__nav-item:hover::after,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__nav-item:focus-visible::after,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .header__nav-group:focus-within .header__nav-item::after { right:2px!important; }
/* ── Alignment + light-reveal parity 2026-09-29 ────────────────────────────
1) INNER-PAGE BANNER. `.inner-page-hero__inner` is a `.container`
(max-width 1200, margin auto) but was shrink-to-fit — 598px wide at a
1280 viewport, so `margin: 0 auto` pushed it to left:341 while the page
content below sits at left:50. Giving it full width lets the container's
own max-width + auto margins land its text on the same 50px margin.
2) EYEBROWS left-aligned. Two blocks are deliberately centred as a whole —
.light-reveal and .cta-banner — so their eyebrows stay centred with their
own headings rather than becoming the odd element out.
3) LIGHT-REVEAL on PDPs sits inside the constrained .hw-product-body, so it
rendered inset at 1180px while the homepage version is full-bleed.
Break it out to match. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .inner-page-hero__inner {
width:100%!important; text-align:left!important; align-items:flex-start!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .inner-page-hero__inner :where(.inner-page-hero__title,.inner-page-hero__subtitle,.inner-page-hero__badge,.inner-page-hero__actions) {
text-align:left!important; margin-left:0!important; margin-right:auto!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.eyebrow, .hw-product-glance__eyebrow, .hw-product-related__eyebrow, .photo-gallery__eyebrow, .faq__eyebrow, .testimonials__eyebrow) {
text-align:left!important;
}
/* Eyebrows follow their own H2. These blocks centre their heading, so the
eyebrow centres with it rather than sitting left of a centred title:
.activity-card-grid "Choose your light"
.testimonials "From the water"
.wildlife / .value-prop-grid "Start with the decision"
.light-reveal, .cta-banner (centred throughout)
Everywhere else the heading is left, so the eyebrow stays left. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(
.activity-card-grid, .testimonials, .wildlife, .value-prop-grid,
.light-reveal, .cta-banner
) :where(.eyebrow, [class*="__eyebrow"]) { text-align:center!important; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hw-product-body .light-reveal {
width:100vw!important; max-width:100vw!important;
margin-left:calc(50% - 50vw)!important; margin-right:calc(50% - 50vw)!important;
}
/* PDP body gutter: the site standard is `.container` — max-width 1200 with
24px padding, so content starts 64px in at a 1280 viewport. `.hw-product-body`
used its own 1180px track, landing content at 50px, which is why the product
pages' text never lined up with their banner or with the other pages.
Matching the container's effective content width (1200 - 48 = 1152) puts PDP
content on the same 64px margin as everything else. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hw-product-body {
padding-inline: max(24px, calc((100vw - 1152px) / 2))!important;
}
/* ── Radius unification, all breakpoints 2026-09-29 ────────────────────────
The earlier pass only normalised <=720px. At 768 and 1280 the site still
carried SEVEN values on content surfaces: 10px (card, split-story__image,
vessel-stamp, cta-banner), 12px (wildlife/testimonial cards, compare rows,
widget shell), 14px, 16px (featured, media-reveal, product facts, details,
boat specs), 18px (cruise-card, inline booking, related cards, contact
panel photo/map) and 22px (split-story grid). All land on 14px now, which
is what mobile already used and what the kit itself drops to at <=640px.
Deliberately untouched:
- True chrome: header logo (4px), hamburger, mobile-sheet close, effects
toggle. These are UI furniture, not content containers.
- Intentionally asymmetric corners: .illuminate-effects-toggle (14/0/0/14,
docked to an edge), .split-story__pullquote (0/6/6/0, left accent bar),
.illuminate-inline-booking__topline (17/17/0/0, panel header). Squaring
these would break the shapes they are meant to make. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(
.card, .cruise-card, .wildlife__card, .testimonial-card,
.split-story__image, .split-story__media-reveal, .split-story__vessel-stamp,
.split-story__grid,
.featured, .cta-banner, .photo-gallery__link, .light-reveal__point,
.hw-product-fact, .hw-product-related__card,
.tour-overview-simple__details details,
.illuminate-inline-booking, .illuminate-inline-booking__widget-shell,
.boat-detail__spec, .boat-detail__main-img, .boat-detail__thumb,
.contact-panel__photo, .contact-panel__map,
.cruise-listing__compare-row, .cruise-listing__compare-time
) { border-radius:14px!important; }
/* Images sitting inside a rounded container must be clipped by it, otherwise
the photo keeps square corners over a rounded card. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(
.card, .cruise-card, .hw-product-related__card, .featured, .cta-banner,
.photo-gallery__link, .split-story__image, .contact-panel__photo
) { overflow:hidden; }
/* ── Product card layout 2026-09-29 ────────────────────────────────────────
Asked: price above the title and left aligned, buttons closer to the body
copy, whole card shorter.
The price lives in .card__offer-slot, which is nested inside .card__foot —
so `order` alone could not lift it above .card__title (order only sorts
siblings). `display:contents` on .card__foot promotes its three children to
be direct flex children of .card__body, after which order works. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .card__body { gap:8px!important; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .card__foot { display:contents!important; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .card__offer-slot {
order:-1!important;
justify-content:flex-start!important;
margin:0 0 2px!important;
min-width:0!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .card__offer-group { justify-content:flex-start!important; margin:0!important; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .card__divider { order:0!important; margin:6px 0 0!important; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .card__cta-row { order:1!important; margin-top:8px!important; }
/* Shorter card: the description was the main source of height. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .card__description { margin:0!important; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .card__body { padding-top:14px!important; padding-bottom:14px!important; }
/* ── One margin rule, all breakpoints 2026-09-29 ───────────────────────────
Painted inset panels used three different geometries:
.featured width:calc(100% - 48px), max 1280 -> 24 / 24 / 24 / 80
.container/.split-story__grid max 1200 -> -- / -- / 40 / 120
.cta-banner inside .hw-product-body (its own track) -> 48 / 48 / 88 / 168
(390 / 768 / 1280 / 1440)
Standardising on the .container geometry — the narrower one — since that is
the panel width that reads correctly: cap at 1200px, otherwise a 24px
gutter. `min(1200px, 100% - 48px)` expresses both in one value.
Panels inside .hw-product-body sit in a padded parent, so `margin:auto`
alone would centre them in the body's content box, not the viewport. The
calc escapes the body padding first (`50% - 50vw` puts the left edge at the
viewport edge) and then adds the same gutter back, so they line up with the
panels on every other page. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] :where(.featured.mega, .cta-banner.mega) {
width: min(1200px, 100% - 48px)!important;
max-width: none!important;
margin-inline: auto!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hw-product-body :where(.featured.mega, .cta-banner.mega) {
width: min(1200px, calc(100vw - 48px))!important;
max-width: none!important;
margin-left: calc(50% - 50vw + max(24px, (100vw - 1200px) / 2))!important;
margin-right: calc(50% - 50vw + max(24px, (100vw - 1200px) / 2))!important;
}
/* Related cards now carry two real links instead of a decorative `em`.
These live here, not in PageShell: PageShell's own global style block
is not winning the cascade in dev, so rules added there never landed.
NOTE: this block must stay OUTSIDE the mobile media query — it was nested
inside `@media (max-width:720px)` and therefore only applied under 720px.
Specificity note: `.hw-product-related__card span` (0,2,1) styles EVERY span
in the card as a padded grid cell, which was flattening both the button row
and the visually-hidden label. `span.`class`` reaches (0,3,1) and beats it. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hw-product-related__card span.hw-product-related__actions {
display:flex!important; flex-wrap:wrap!important; gap:10px!important;
margin-top:10px!important; padding:0!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hw-product-related__card .hw-product-related__btn {
display:inline-flex!important; align-items:center!important; justify-content:center!important;
min-height:40px!important; padding:0 18px!important; border-radius:999px!important;
font:normal 750 .72rem/1 Manrope, system-ui, sans-serif!important;
letter-spacing:.08em!important; text-transform:uppercase!important;
text-decoration:none!important; width:auto!important;
transition:background .2s ease, color .2s ease, border-color .2s ease;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hw-product-related__card .hw-product-related__btn--book {
background:#07131d!important; color:#f7fbfc!important; border:1px solid #07131d!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hw-product-related__card .hw-product-related__btn--book:hover { background:#0d2332!important; border-color:#0d2332!important; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hw-product-related__card .hw-product-related__btn--learn {
background:transparent!important; color:#07131d!important; border:1px solid rgba(7,19,29,.4)!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hw-product-related__card .hw-product-related__btn--learn:hover { background:#07131d!important; color:#f7fbfc!important; border-color:#07131d!important; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hw-product-related__card .hw-product-related__btn:focus-visible { outline:3px solid #28e0d1!important; outline-offset:3px!important; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] .hw-product-related__card .hw-product-related__btn--book,
html.illuminate-mode-night .hw-product-related__card .hw-product-related__btn--book {
background:#91eee6!important; color:#07131d!important; border-color:#91eee6!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] .hw-product-related__card .hw-product-related__btn--learn,
html.illuminate-mode-night .hw-product-related__card .hw-product-related__btn--learn {
color:#f7fbfc!important; border-color:rgba(145,238,230,.55)!important;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] .hw-product-related__card .hw-product-related__btn--learn:hover,
html.illuminate-mode-night .hw-product-related__card .hw-product-related__btn--learn:hover {
background:#91eee6!important; color:#07131d!important; border-color:#91eee6!important;
}
/* Visually-hidden label inside the buttons. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hw-product-related__card span.sr-only {
position:absolute!important; width:1px!important; height:1px!important;
padding:0!important; margin:-1px!important; overflow:hidden!important;
clip:rect(0 0 0 0)!important; white-space:nowrap!important; border:0!important;
}
/* Booking panel top strip: the panel is now 14px, but its dark header kept a
17px top radius, so the panel's near-white background showed through at the
corners as a thin white outline above the dark bar. Match the panel radius
and clip the panel so no child can bleed past it again. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .illuminate-inline-booking { overflow:hidden!important; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .illuminate-inline-booking__topline { border-radius:14px 14px 0 0!important; }
/* Gallery head sat 70px above the filter chips: 24px of margin under the H2
plus a 46px gap between the children of .photo-gallery__inner. Tightened to
~28px total so the chips read as belonging to the heading. The same gap also
governs chips -> grid, so that closes up consistently. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .photo-gallery__heading { margin-bottom:0!important; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .photo-gallery__inner { gap:28px!important; }
/* Mobile: the four experience-spectrum cards are sized by `aspect-ratio: 3/4`,
which at 342px wide makes each one 456px tall — four of them ran to nearly
two full screens. Halving the height means halving the ratio's vertical
term: 3/4 -> 3/2 gives 342 x 2/3 = 228px. Desktop is untouched. */
@media (max-width:720px) {
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .wildlife__card { aspect-ratio:3 / 2!important; }
}
/* Shepard tip overlay — LightReveal tan-dot removal (Hannah LightReveal.astro) */
.light-reveal__point::after,
.light-reveal__point[data-astro-cid-y3i6hhb6]::after {
content: none !important;
display: none !important;
background: none !important;
box-shadow: none !important;
}
/* Accent eyebrow/cta dots suppressed (Hannah stylistic) */
.split-story--dark-navy .eyebrow::before,
.cta-banner__eyebrow-dot {
content: none !important;
display: none !important;
}
/* PageShell related-cruise split links (tip HTML overlay) */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hw-product-related__card {
display: grid; overflow: hidden; border: 1px solid rgba(7, 19, 29, .12);
border-radius: 18px; background: #fff; color: #07131d;
text-decoration: none; box-shadow: 0 14px 38px rgba(7,19,29,.08);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hw-product-related__card > a { text-decoration: none; color: inherit; }
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hw-product-related__actions {
display: flex; flex-wrap: wrap; gap: 10px; margin-top: 6px;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hw-product-related__btn {
display: inline-flex; align-items: center; justify-content: center;
padding: 8px 14px; border-radius: 999px; font-style: normal; font-weight: 700;
font-size: .85rem; text-decoration: none;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hw-product-related__btn--book {
background: #28E0D1; color: #07131d;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hw-product-related__btn--learn {
background: transparent; color: #0b7777; border: 1px solid rgba(11,119,119,.35);
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] .hw-product-related__card,
html.illuminate-mode-night [data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hw-product-related__card {
border-color: rgba(145,238,230,.3); background: #102b38; color: #f7fbfc;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] .hw-product-related__btn--book,
html.illuminate-mode-night [data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hw-product-related__btn--book {
background: #91eee6; color: #07131d;
}
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] .hw-product-related__btn--learn,
html.illuminate-mode-night [data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] .hw-product-related__btn--learn {
color: #91eee6; border-color: rgba(145,238,230,.45);
}
}
/* r3 2026-10-02 — dropdown double carets.
summary.faq__question already ships svg.faq__chevron (same markup as apex).
The ::after caret added 2026-09-29 painted a second chevron. Hide ::after
so only the apex SVG remains. Tour-overview summaries have no SVG; their
single ::after caret is not a double and is left alone. */
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'] summary.faq__question::after,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-page-key='faq'] summary.faq__question::after,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-page-key='faq'] .faq__item[open] summary.faq__question::after,
[data-website-id='web_85b8192b-d816-469f-a4a6-be3227ba3985'][data-illuminate-mode='night'] summary.faq__question::after,
html.illuminate-mode-night summary.faq__question::after,
html.illuminate-mode-night .faq__item[open] summary.faq__question::after {
content: none !important;
display: none !important;
border: 0 !important;
width: 0 !important;
height: 0 !important;
}