/* ===================================================================
   FLIP FLOP FAM — Oceanic Design System
   Client brand (NOT POM AI). Light-led: turquoise on warm white + sand.
   Built with web-design-enforcer surface system · $50K Luxury Editorial polish
   Contrast locked to WCAG 2.2 AA. Fonts: Fraunces (display) + Mulish (body).
   =================================================================== */

:root{
  /* — Oceanic brand — */
  --turquoise:#19B5C4; --teal-deep:#0E7C8B; --turquoise-light:#5FD2DC;
  --coral:#FF7A66; --coral-deep:#E65F4C;
  --sand:#E8D3A9; --sand-soft:#F3E7CF;
  --shell:#FBF7EF; --shell-card:#FFFFFF;
  --deep-sea:#0B2A33; --deep-sea-2:#08222A; --deep-sea-card:#103641;
  --ink:#1A3A40; --ink-soft:#4A6670;
  --on-dark:#EAF6F7; --on-dark-soft:#9FBEC4;

  /* — surface-system aliases (so the enforcer logic carries over) — */
  --charcoal-deep:#08222A; --charcoal:#0B2A33;
  --cream:#FBF7EF; --cream-dark:#F3E7CF; --cream-deeper:#E8D3A9; --white:#FFFFFF;
  --stone:#9FBEC4; --stone-light:#4A6670; --stone-deep:#1A3A40;
  --gold:#19B5C4; --gold-light:#5FD2DC; --gold-deep:#0E7C8B;
  --copper:#FF7A66; --copper-light:#FF9B8A;

  /* — type — */
  --display:"Fraunces",Georgia,"Times New Roman",serif;
  --body:"Mulish",system-ui,-apple-system,BlinkMacSystemFont,sans-serif;

  /* — space + radius + shadow — */
  --r-sm:10px; --r-md:16px; --r-lg:24px; --r-xl:32px; --r-full:999px;
  --shadow-sm:0 2px 10px rgba(11,42,51,.06);
  --shadow-md:0 14px 40px rgba(11,42,51,.10);
  --shadow-lg:0 30px 70px rgba(11,42,51,.16);
  /* dual-layer focus ring: white inner + teal-deep outer so one layer always
     clears WCAG 1.4.11's 3:1 on both light (shell/white/sand) and dark (deep-sea) surfaces */
  --ring:0 0 0 2px #FFFFFF,0 0 0 5px var(--teal-deep);
  --ease:cubic-bezier(.16,1,.3,1);
  --maxw:1240px;

  /* — default surface = LIGHT (light-led brand) — */
  --bg:var(--shell); --text:var(--ink); --title:var(--teal-deep);
  --muted:var(--ink-soft); --accent:var(--teal-deep); --accent-bright:var(--turquoise);
  --card-bg:var(--white); --card-text:var(--ink); --card-title:var(--teal-deep);
  --hairline:rgba(14,124,139,.16);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;background:var(--shell);color:var(--ink);
  font-family:var(--body);font-weight:400;font-size:16px;line-height:1.7;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{max-width:100%;display:block;height:auto}
a{color:var(--accent);text-decoration:none;transition:color .2s var(--ease)}
a:hover{color:var(--turquoise)}
/* outline (not box-shadow) so elements with their own shadows cannot override the ring;
   teal-deep clears 3:1 on shell, white, sand-soft AND deep-sea */
:focus-visible{outline:3px solid var(--teal-deep);outline-offset:2px;box-shadow:var(--ring);border-radius:6px}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:50%;transform:translateX(-50%) translateY(-130%);top:8px;z-index:2000;background:var(--teal-deep);color:#fff;padding:12px 22px;border-radius:var(--r-full);font-weight:700;transition:transform .25s var(--ease)}
.skip-link:focus{transform:translateX(-50%) translateY(0);color:#fff}

/* — Typography — */
h1,h2,h3,h4{font-family:var(--display);color:var(--title);font-weight:600;line-height:1.12;letter-spacing:-.015em;margin:0 0 .5em}
h1{font-size:clamp(2.4rem,5.4vw,4.3rem);font-weight:600}
h2{font-size:clamp(1.9rem,3.4vw,2.85rem)}
h3{font-size:clamp(1.25rem,1.8vw,1.55rem)}
h4{font-size:1.12rem}
p{margin:0 0 1.1rem}
.lede{font-size:clamp(1.1rem,1.4vw,1.32rem);line-height:1.6;color:var(--text)}
.eyebrow{font-family:var(--body);font-weight:800;font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);display:inline-flex;align-items:center;gap:.55rem;margin:0 0 1rem}
.eyebrow::before{content:"";width:26px;height:2px;background:var(--turquoise);border-radius:2px}
.script{font-family:var(--display);font-style:italic;font-weight:500}
strong{font-weight:700;color:var(--ink)}

/* — Layout — */
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,4vw,40px)}
.section{position:relative;padding:clamp(64px,9vw,128px) 0;background:var(--bg);color:var(--text)}
.section--tight{padding:clamp(48px,6vw,80px) 0}
.section-cream,.section-light,.section-white{--bg:var(--shell);--text:var(--ink);--title:var(--teal-deep);--muted:var(--ink-soft);--accent:var(--teal-deep);--card-bg:var(--white);--card-text:var(--ink);--card-title:var(--teal-deep);--hairline:rgba(14,124,139,.16)}
.section-white{--bg:var(--white)}
.section-sand{--bg:var(--sand-soft);--text:var(--ink);--title:var(--teal-deep);--muted:var(--ink-soft);--accent:var(--teal-deep);--card-bg:var(--white);--card-text:var(--ink);--card-title:var(--teal-deep);--hairline:rgba(14,124,139,.18)}
.section-deep,.section-dark{--bg:var(--deep-sea);--text:var(--on-dark);--title:var(--on-dark);--muted:var(--on-dark-soft);--accent:var(--turquoise-light);--accent-bright:var(--turquoise-light);--card-bg:var(--deep-sea-card);--card-text:var(--on-dark);--card-title:var(--on-dark);--hairline:rgba(95,210,220,.18)}
.section-deep h1,.section-deep h2,.section-deep h3,.section-deep h4,.section-dark h1,.section-dark h2,.section-dark h3,.section-dark h4{color:var(--on-dark)}
.section-deep strong,.section-dark strong{color:#fff}
.section-deep .eyebrow,.section-dark .eyebrow{color:var(--turquoise-light)}
.section-deep .eyebrow::before,.section-dark .eyebrow::before{background:var(--turquoise-light)}
.section-deep a:hover,.section-dark a:hover{color:#fff}
.center{text-align:center}
.section-head{max-width:760px;margin:0 auto clamp(40px,5vw,64px)}
.center .section-head{margin-left:auto;margin-right:auto}
.muted{color:var(--muted)}

/* — Buttons — */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;font-family:var(--body);font-weight:800;font-size:.98rem;letter-spacing:.005em;padding:15px 30px;min-height:52px;border-radius:var(--r-full);border:2px solid transparent;cursor:pointer;transition:transform .25s var(--ease),background .25s var(--ease),color .25s var(--ease),box-shadow .25s var(--ease),border-color .25s var(--ease);text-decoration:none;line-height:1}
.btn svg{width:18px;height:18px}
.btn-primary{background:var(--turquoise);color:var(--ink);box-shadow:0 10px 26px rgba(25,181,196,.32)}
.btn-primary:hover{background:var(--teal-deep);color:#fff;transform:translateY(-3px);box-shadow:0 16px 34px rgba(14,124,139,.4)}
.btn-secondary{background:var(--coral);color:var(--ink);box-shadow:0 10px 26px rgba(255,122,102,.30)}
.btn-secondary:hover{background:var(--coral-deep);color:#fff;transform:translateY(-3px)}
.btn-ghost{background:transparent;color:var(--accent);border-color:currentColor}
.btn-ghost:hover{background:var(--teal-deep);color:#fff;border-color:var(--teal-deep);transform:translateY(-3px)}
.section-deep .btn-ghost,.section-dark .btn-ghost{color:var(--on-dark);border-color:rgba(234,246,247,.4)}
.section-deep .btn-ghost:hover,.section-dark .btn-ghost:hover{background:var(--turquoise);color:var(--ink);border-color:var(--turquoise)}
.btn-lg{padding:18px 38px;min-height:58px;font-size:1.05rem}
.btn-row{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.center .btn-row{justify-content:center}
.textlink{font-weight:800;color:var(--accent);display:inline-flex;align-items:center;gap:.4rem}
.textlink svg{width:16px;height:16px;transition:transform .25s var(--ease)}
.textlink:hover svg{transform:translateX(4px)}

/* ===== HEADER + MEGA MENU ===== */
.lux-header{position:fixed;top:0;left:0;right:0;z-index:1000;transition:transform .25s var(--ease),background .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease);border-bottom:1px solid transparent}
.lux-header[data-scrolled="true"]{background:rgba(251,247,239,.92);backdrop-filter:saturate(1.1) blur(8px);-webkit-backdrop-filter:saturate(1.1) blur(8px);box-shadow:0 6px 30px rgba(11,42,51,.08);border-bottom-color:var(--hairline)}
.lux-header.nav-hidden{transform:translateY(-100%)}
.lux-header__inner{max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,4vw,40px);height:74px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.lux-header__logo{display:flex;align-items:center;flex:0 0 auto}
.lux-header__logo img{height:40px;width:auto}
.lux-nav{display:flex;align-items:center;gap:6px}
.lux-nav__list{list-style:none;display:flex;align-items:center;gap:2px;margin:0;padding:0}
.lux-nav__list>li{position:relative}
.lux-nav__link,.mega-trigger__btn{font-family:var(--body);font-weight:700;font-size:.95rem;color:var(--ink);background:none;border:none;cursor:pointer;padding:10px 16px;border-radius:var(--r-full);display:inline-flex;align-items:center;gap:.35rem;transition:color .2s var(--ease),background .2s var(--ease);min-height:44px}
.lux-nav__link:hover,.mega-trigger__btn:hover,.mega-trigger[data-open="true"] .mega-trigger__btn{color:var(--teal-deep);background:rgba(25,181,196,.10)}
.mega-trigger__chevron{width:14px;height:14px;transition:transform .25s var(--ease)}
.mega-trigger[data-open="true"] .mega-trigger__chevron{transform:rotate(180deg)}
.lux-header__cta{display:flex;align-items:center;gap:10px;flex:0 0 auto}

/* Mega menu (editorial, featured photo — $50K) */
.mega-menu{position:absolute;top:calc(100% + 14px);left:50%;transform:translateX(-50%) translateY(10px);width:min(760px,92vw);background:var(--white);border:1px solid var(--hairline);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);padding:26px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .26s var(--ease),transform .26s var(--ease),visibility .26s;display:grid;grid-template-columns:1.15fr .85fr;gap:26px;z-index:1001}
.mega-trigger[data-open="true"] .mega-menu{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.mega-menu__col h4{font-family:var(--body);font-weight:800;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--teal-deep);margin:0 0 14px}
.mega-list{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.mega-list a{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:var(--r-sm);color:var(--ink);transition:background .2s var(--ease),transform .2s var(--ease)}
.mega-list a:hover{background:var(--shell);transform:translateX(3px)}
.mega-list a span{font-weight:700;font-size:.98rem;color:var(--ink)}
.mega-list a small{color:var(--ink-soft);font-size:.82rem;font-weight:400}
.mega-feature{position:relative;border-radius:var(--r-md);overflow:hidden;min-height:230px;display:flex;align-items:flex-end;color:#fff}
.mega-feature img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.mega-feature:hover img{transform:scale(1.06)}
.mega-feature__scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,34,42,0) 30%,rgba(8,34,42,.82) 100%)}
.mega-feature__body{position:relative;padding:18px 20px}
.mega-feature__body .eyebrow{color:var(--turquoise-light);margin-bottom:.4rem}
.mega-feature__body .eyebrow::before{background:var(--turquoise-light)}
.mega-feature__body h5{font-family:var(--display);font-size:1.18rem;color:#fff;margin:0 0 4px}
.mega-feature__body p{margin:0;font-size:.86rem;color:rgba(234,246,247,.86)}

.hamburger{display:none;width:48px;height:48px;border:none;background:none;cursor:pointer;align-items:center;justify-content:center;border-radius:var(--r-full)}
.hamburger:hover{background:rgba(25,181,196,.1)}
.hamburger span,.hamburger span::before,.hamburger span::after{content:"";display:block;width:24px;height:2px;background:var(--ink);border-radius:2px;transition:transform .3s var(--ease),opacity .2s var(--ease)}
.hamburger span{position:relative}
.hamburger span::before{position:absolute;top:-7px}
.hamburger span::after{position:absolute;top:7px}

/* ===== MOBILE OVERLAY (full-screen) ===== */
.mobile-overlay{position:fixed;inset:0;z-index:1500;background:var(--deep-sea);color:var(--on-dark);display:flex;flex-direction:column;padding:24px clamp(22px,7vw,40px) calc(24px + env(safe-area-inset-bottom));opacity:0;visibility:hidden;pointer-events:none;transition:opacity .3s var(--ease),visibility .3s}
.mobile-overlay[data-open="true"]{opacity:1;visibility:visible;pointer-events:auto}
.mobile-overlay__top{display:flex;align-items:center;justify-content:space-between}
.mobile-overlay__top img{height:38px}
.mobile-close{width:48px;height:48px;border:none;background:rgba(255,255,255,.06);border-radius:var(--r-full);color:var(--on-dark);font-size:1.6rem;cursor:pointer;display:flex;align-items:center;justify-content:center}
.mobile-nav{list-style:none;margin:auto 0;padding:0;display:flex;flex-direction:column;gap:6px}
.mobile-nav a{font-family:var(--display);font-size:clamp(1.7rem,7vw,2.3rem);color:var(--on-dark);font-weight:500;padding:8px 0;display:block;opacity:0;transform:translateY(14px);transition:color .2s var(--ease)}
.mobile-overlay[data-open="true"] .mobile-nav a{animation:overlayIn .5s var(--ease) forwards}
.mobile-nav a:hover{color:var(--turquoise-light)}
.mobile-nav li:nth-child(1) a{animation-delay:.06s}.mobile-nav li:nth-child(2) a{animation-delay:.11s}.mobile-nav li:nth-child(3) a{animation-delay:.16s}.mobile-nav li:nth-child(4) a{animation-delay:.21s}.mobile-nav li:nth-child(5) a{animation-delay:.26s}.mobile-nav li:nth-child(6) a{animation-delay:.31s}
@keyframes overlayIn{to{opacity:1;transform:translateY(0)}}
.mobile-overlay__cta{display:grid;gap:12px;padding-top:18px;border-top:1px solid rgba(255,255,255,.1)}
.mobile-overlay__cta .btn{width:100%}

/* ===== HERO ===== */
.hero{position:relative;padding:clamp(132px,17vh,168px) 0 clamp(56px,8vw,96px);overflow:hidden;color:#fff;isolation:isolate}
.hero__bg{position:absolute;inset:0;z-index:-2}
.hero__bg img{width:100%;height:100%;object-fit:cover;object-position:72% center}
.hero__scrim{position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,rgba(8,34,42,.86) 0%,rgba(8,34,42,.6) 42%,rgba(8,34,42,.12) 74%,rgba(8,34,42,0) 100%)}
.hero__inner{max-width:680px}
.hero .eyebrow{color:var(--turquoise-light)}
.hero .eyebrow::before{background:var(--turquoise-light)}
.hero h1{color:#fff;margin-bottom:.4em;text-shadow:0 2px 30px rgba(8,34,42,.4)}
.hero h1 em{font-style:italic;color:var(--turquoise-light);font-weight:500}
.hero__sub{font-size:clamp(1.08rem,1.5vw,1.32rem);color:rgba(234,246,247,.94);max-width:560px;margin-bottom:1.8rem;line-height:1.6}
.hero__trust{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:30px;padding-top:24px;border-top:1px solid rgba(255,255,255,.16)}
.hero__trust span{display:inline-flex;align-items:center;gap:.5rem;font-size:.86rem;font-weight:700;color:rgba(234,246,247,.92)}
.hero__trust svg{width:18px;height:18px;color:var(--turquoise-light);flex:0 0 auto}
.hero__sub-secondary{font-size:.9rem;color:rgba(234,246,247,.7);margin-top:14px}

/* ===== TRUST STRIP ===== */
.trust-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:18px}
.trust-item{display:flex;gap:14px;align-items:flex-start;padding:22px;background:var(--card-bg);border-radius:var(--r-md);border:1px solid var(--hairline);box-shadow:var(--shadow-sm)}
.trust-item__icon{flex:0 0 auto;width:46px;height:46px;border-radius:var(--r-full);background:rgba(25,181,196,.14);display:flex;align-items:center;justify-content:center;color:var(--teal-deep)}
.section-deep .trust-item__icon,.section-dark .trust-item__icon{background:rgba(95,210,220,.16);color:var(--turquoise-light)}
.trust-item__icon svg{width:22px;height:22px}
.trust-item h4{margin:0 0 3px;color:var(--card-title);font-family:var(--body);font-weight:800;font-size:1rem;letter-spacing:0}
.trust-item p{margin:0;font-size:.88rem;color:var(--muted)}

/* ===== GENERIC GRID + CARDS ===== */
.grid{display:grid;gap:24px}
.grid-2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.grid-3{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.grid-4{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.card{background:var(--card-bg);border:1px solid var(--hairline);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-sm);transition:transform .3s var(--ease),box-shadow .3s var(--ease);display:flex;flex-direction:column}
.card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md)}
.card__media{position:relative;aspect-ratio:3/2;overflow:hidden}
.card__media img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.card:hover .card__media img{transform:scale(1.06)}
.card__tag{position:absolute;top:14px;left:14px;background:rgba(8,34,42,.78);color:#fff;font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:6px 12px;border-radius:var(--r-full)}
.card__tag--coral{background:var(--coral);color:var(--ink)}
.card__body{padding:24px;display:flex;flex-direction:column;gap:10px;flex:1}
.card__body h3{margin:0;color:var(--card-title)}
.card__body p{margin:0;color:var(--muted);font-size:.92rem}
.card__meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:auto;padding-top:6px}
.rating{display:inline-flex;align-items:center;gap:4px;font-weight:800;color:var(--teal-deep);font-size:.9rem}
.rating svg{width:15px;height:15px;color:var(--coral)}
.chip{display:inline-flex;align-items:center;gap:.4rem;font-size:.76rem;font-weight:700;padding:5px 12px;border-radius:var(--r-full);background:rgba(25,181,196,.12);color:var(--teal-deep);border:1px solid rgba(25,181,196,.2)}
.chip--sand{background:rgba(232,211,169,.4);color:#7a5d2a;border-color:rgba(232,211,169,.7)}
.section-deep .chip,.section-dark .chip{background:rgba(95,210,220,.14);color:var(--turquoise-light);border-color:rgba(95,210,220,.28)}

/* destination tile */
.dest-tile{position:relative;border-radius:var(--r-lg);overflow:hidden;min-height:320px;display:flex;align-items:flex-end;color:#fff;box-shadow:var(--shadow-sm);transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.dest-tile:hover{transform:translateY(-6px);box-shadow:var(--shadow-md)}
.dest-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.dest-tile:hover img{transform:scale(1.07)}
.dest-tile__scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,34,42,0) 35%,rgba(8,34,42,.85) 100%)}
.dest-tile__body{position:relative;padding:26px}
.dest-tile__body h3{color:#fff;margin:0 0 4px}
.dest-tile__body p{margin:0;color:rgba(234,246,247,.85);font-size:.9rem}
.dest-tile__body .textlink{color:var(--turquoise-light);margin-top:10px}

/* stat */
.stat{display:flex;flex-direction:column;gap:4px}
.stat__num{font-family:var(--display);font-weight:600;font-size:clamp(2.2rem,4vw,3.2rem);color:var(--accent);line-height:1}
.section-deep .stat__num,.section-dark .stat__num{color:var(--turquoise-light)}
.stat__label{font-size:.9rem;color:var(--muted);font-weight:600}

/* steps */
.step{display:flex;gap:18px;align-items:flex-start}
.step__num{flex:0 0 auto;width:46px;height:46px;border-radius:var(--r-full);background:var(--turquoise);color:var(--ink);display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:600;font-size:1.2rem}
.step h4{margin:0 0 4px;color:var(--card-title);font-family:var(--body);font-weight:800;font-size:1.05rem}
.step p{margin:0;color:var(--muted);font-size:.92rem}

/* split (image + text) */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:center}
.split--reverse .split__media{order:2}
.split__media{position:relative;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-md);aspect-ratio:4/5}
.split__media img{width:100%;height:100%;object-fit:cover}
.split__media--wide{aspect-ratio:4/3}
.split__badge{position:absolute;bottom:18px;left:18px;right:18px;background:rgba(251,247,239,.94);backdrop-filter:blur(6px);border-radius:var(--r-md);padding:14px 18px;display:flex;align-items:center;gap:12px;box-shadow:var(--shadow-sm)}
.split__badge svg{width:26px;height:26px;color:var(--teal-deep);flex:0 0 auto}
.split__badge p{margin:0;font-size:.84rem;color:var(--ink);font-weight:600;line-height:1.4}

/* quote */
.quote{font-family:var(--display);font-size:clamp(1.4rem,2.6vw,2rem);line-height:1.4;color:var(--title);font-weight:500;max-width:880px}
.quote em{color:var(--accent);font-style:italic}
.section-deep .quote,.section-dark .quote{color:var(--on-dark)}
.section-deep .quote em,.section-dark .quote em{color:var(--turquoise-light)}

/* CTA band */
.cta-band{position:relative;border-radius:var(--r-xl);overflow:hidden;padding:clamp(40px,6vw,72px);background:linear-gradient(135deg,#0E7C8B 0%,#0B2A33 100%);color:#fff;box-shadow:var(--shadow-lg)}
.cta-band::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 85% 20%,rgba(95,210,220,.28),transparent 55%);pointer-events:none}
.cta-band h2{color:#fff;position:relative}
.cta-band p{color:rgba(234,246,247,.9);position:relative;max-width:620px}
.cta-band .btn-row{position:relative;margin-top:8px}

/* lead magnet */
.leadmag{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(28px,4vw,56px);align-items:center;background:var(--card-bg);border:1px solid var(--hairline);border-radius:var(--r-xl);padding:clamp(28px,4vw,52px);box-shadow:var(--shadow-md)}
.leadmag__art{position:relative;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:5/4;background:linear-gradient(135deg,var(--sand-soft),var(--turquoise-light))}
.leadmag__art img{width:100%;height:100%;object-fit:cover}

/* forms */
.field{display:flex;flex-direction:column;gap:7px;margin-bottom:16px}
.field label{font-weight:700;font-size:.88rem;color:var(--card-title)}
.field .req{color:var(--coral-deep)}
.input,.select,.textarea{width:100%;font-family:var(--body);font-size:1rem;color:var(--ink);background:var(--white);border:1.5px solid var(--hairline);border-radius:var(--r-sm);padding:14px 16px;min-height:52px;transition:border-color .2s var(--ease),box-shadow .2s var(--ease)}
.textarea{min-height:120px;resize:vertical;line-height:1.6}
.input:focus,.select:focus,.textarea:focus{outline:none;border-color:var(--turquoise);box-shadow:var(--ring)}
.input::placeholder,.textarea::placeholder{color:#9aa9ad}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.inline-form{display:flex;gap:12px;flex-wrap:wrap}
.inline-form .input{flex:1;min-width:200px}
.form-note{font-size:.82rem;color:var(--muted);margin-top:6px}
.chip-select{display:flex;flex-wrap:wrap;gap:10px}
.chip-opt{cursor:pointer;font-weight:700;font-size:.9rem;padding:11px 18px;border-radius:var(--r-full);background:var(--white);border:1.5px solid var(--hairline);color:var(--ink-soft);transition:all .2s var(--ease);user-select:none;min-height:44px;display:inline-flex;align-items:center}
.chip-opt:hover{border-color:var(--turquoise);color:var(--teal-deep)}
.chip-opt input{position:absolute;opacity:0;pointer-events:none}
.chip-opt:has(input:checked){background:var(--turquoise);border-color:var(--turquoise);color:var(--ink)}

/* ===== FOOTER ===== */
.lux-footer{background:var(--deep-sea);color:var(--on-dark);padding:clamp(56px,8vw,88px) 0 32px;position:relative}
.lux-footer::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--turquoise),transparent);opacity:.5}
.lux-footer__inner{max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,4vw,40px);display:flex;flex-direction:column;gap:48px}
.lux-footer__top{display:grid;grid-template-columns:1.2fr 1fr;gap:48px;align-items:start}
.lux-footer__brand img{height:46px;margin-bottom:16px}
.lux-footer__tagline{color:var(--on-dark-soft);max-width:340px;font-size:.95rem}
.lux-footer__news .eyebrow{color:var(--turquoise-light)}
.lux-footer__news .eyebrow::before{background:var(--turquoise-light)}
.lux-footer__news-row{display:flex;gap:10px;flex-wrap:wrap}
.lux-footer__news input{flex:1;min-width:200px;height:52px;padding:0 18px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:var(--r-full);color:#fff;font-family:inherit;font-size:.95rem;transition:border-color .2s var(--ease),background .2s var(--ease)}
.lux-footer__news input::placeholder{color:rgba(234,246,247,.5)}
.lux-footer__news input:focus{outline:none;border-color:var(--turquoise-light);background:rgba(255,255,255,.08)}
.lux-footer__news-note{font-size:.8rem;color:var(--on-dark-soft);margin:10px 0 0}
.lux-footer__rule{border:none;height:1px;background:rgba(95,210,220,.14);margin:0}
.lux-footer__sitemap{display:grid;grid-template-columns:repeat(4,1fr);gap:32px}
.lux-footer__col h3{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--turquoise-light);margin:0 0 16px;font-weight:800;font-family:var(--body)}
.lux-footer__col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px}
.lux-footer__col a{color:var(--on-dark);font-size:.92rem;transition:color .2s var(--ease)}
.lux-footer__col a:hover{color:var(--turquoise-light)}
.lux-footer__bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:18px}
.lux-footer__social{list-style:none;margin:0;padding:0;display:flex;gap:10px}
.lux-footer__social a{display:inline-flex;width:44px;height:44px;align-items:center;justify-content:center;color:var(--on-dark);border-radius:var(--r-full);background:rgba(255,255,255,.05);transition:background .2s var(--ease),color .2s var(--ease),transform .2s var(--ease)}
.lux-footer__social a:hover{background:rgba(95,210,220,.16);color:var(--turquoise-light);transform:translateY(-2px)}
.lux-footer__social svg{width:19px;height:19px}
.lux-footer__legal{display:flex;gap:18px;align-items:center;flex-wrap:wrap;font-size:.82rem;color:var(--on-dark-soft)}
.lux-footer__legal a{color:var(--on-dark-soft)}
.lux-footer__legal a:hover{color:var(--turquoise-light)}
.lux-footer__disclaimer{font-size:.76rem;color:rgba(159,190,196,.65);max-width:760px;line-height:1.6}
/* POM AI signature */
.pom-ai-signature{display:inline-flex;align-items:center;gap:10px}
.pom-ai-signature__eyebrow{font-family:var(--body);font-size:11px;letter-spacing:.06em;color:rgba(234,246,247,.42);white-space:nowrap;text-transform:uppercase;font-weight:700}
.pom-ai-signature__link{display:inline-flex;align-items:center;justify-content:center;filter:drop-shadow(0 0 0 #19B5C4);transition:filter .3s var(--ease);border-radius:var(--r-full)}
.pom-ai-signature__link:hover,.pom-ai-signature__link:focus-visible{filter:drop-shadow(0 0 10px #19B5C4)}
.pom-ai-signature__logo{height:52px;width:52px;border-radius:var(--r-full);object-fit:contain;background:rgba(255,255,255,.04);opacity:.9;transition:opacity .3s var(--ease)}
.pom-ai-signature__link:hover .pom-ai-signature__logo{opacity:1}

/* ===== STICKY CTA (FAB + mobile bar) ===== */
.sticky-fab{position:fixed;bottom:26px;right:26px;z-index:900;display:inline-flex;align-items:center;gap:0;background:var(--turquoise);color:var(--ink);border:none;border-radius:var(--r-full);height:58px;padding:0;width:58px;overflow:hidden;cursor:pointer;box-shadow:0 14px 34px rgba(14,124,139,.4);transform:translateY(140%);opacity:0;visibility:hidden;pointer-events:none;transition:transform .4s var(--ease),opacity .4s var(--ease),width .35s var(--ease),background .25s var(--ease),visibility .4s}
.sticky-fab[data-cta-state="visible"]{transform:translateY(0);opacity:1;visibility:visible;pointer-events:auto}
.sticky-fab__icon{flex:0 0 58px;width:58px;height:58px;display:flex;align-items:center;justify-content:center}
.sticky-fab__icon svg{width:24px;height:24px}
.sticky-fab__label{white-space:nowrap;font-weight:800;font-size:.96rem;opacity:0;max-width:0;transition:opacity .25s var(--ease),max-width .35s var(--ease),padding .35s var(--ease);padding-right:0}
.sticky-fab:hover{width:206px;background:var(--teal-deep);color:#fff}
.sticky-fab:hover .sticky-fab__label{opacity:1;max-width:150px;padding-right:22px}
.sticky-mobile-bar{position:fixed;left:0;right:0;bottom:0;z-index:899;display:none;gap:10px;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:rgba(8,34,42,.96);backdrop-filter:blur(8px);border-top:1px solid rgba(95,210,220,.2);transform:translateY(110%);visibility:hidden;pointer-events:none;transition:transform .3s var(--ease),visibility .3s}
.sticky-mobile-bar[data-cta-state="visible"]{transform:translateY(0);visibility:visible;pointer-events:auto}
.sticky-mobile-bar .btn{flex:1}
body[data-keyboard-open="true"] .sticky-fab,body[data-keyboard-open="true"] .sticky-mobile-bar{transform:translateY(160%)!important}

/* ===== DRAWER (Plan a trip / contact) ===== */
.drawer-scrim{position:fixed;inset:0;z-index:1600;background:rgba(8,34,42,.5);opacity:0;visibility:hidden;transition:opacity .3s var(--ease),visibility .3s;backdrop-filter:blur(2px)}
.drawer-scrim[data-open="true"]{opacity:1;visibility:visible}
.drawer{position:fixed;top:0;right:0;bottom:0;z-index:1601;width:min(480px,100vw);background:var(--shell);box-shadow:-20px 0 60px rgba(8,34,42,.3);transform:translateX(100%);visibility:hidden;pointer-events:none;transition:transform .4s var(--ease),visibility .4s;overflow-y:auto;display:flex;flex-direction:column}
.drawer[data-open="true"]{transform:translateX(0);visibility:visible;pointer-events:auto}
.drawer__head{position:sticky;top:0;background:var(--deep-sea);color:#fff;padding:22px 24px;display:flex;align-items:center;justify-content:space-between;z-index:2}
.drawer__head h3{color:#fff;margin:0;font-size:1.3rem}
.drawer__head p{margin:2px 0 0;font-size:.82rem;color:var(--on-dark-soft)}
.drawer__close{width:42px;height:42px;border:none;background:rgba(255,255,255,.08);color:#fff;border-radius:var(--r-full);font-size:1.4rem;cursor:pointer}
.drawer__body{padding:24px}
.drawer__success{display:none;text-align:center;padding:30px 10px}
.drawer__success svg{width:60px;height:60px;color:var(--turquoise);margin-bottom:14px}

/* ===== EMILY CONCIERGE ===== */
.emily-launch{position:fixed;bottom:26px;left:26px;z-index:880;display:inline-flex;align-items:center;gap:11px;background:var(--white);border:1px solid var(--hairline);border-radius:var(--r-full);padding:8px 18px 8px 8px;cursor:pointer;box-shadow:var(--shadow-md);transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.emily-launch:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.emily-launch__av{width:42px;height:42px;border-radius:var(--r-full);background:linear-gradient(135deg,var(--turquoise),var(--teal-deep));display:flex;align-items:center;justify-content:center;color:#fff;font-family:var(--display);font-weight:600;font-size:1.15rem;position:relative}
.emily-launch__av::after{content:"";position:absolute;right:-1px;bottom:-1px;width:12px;height:12px;border-radius:50%;background:var(--turquoise-light);border:2px solid var(--white)}
.emily-launch__txt{display:flex;flex-direction:column;line-height:1.2}
.emily-launch__txt b{font-size:.9rem;color:var(--ink)}
.emily-launch__txt small{font-size:.74rem;color:var(--ink-soft)}
.emily-panel{position:fixed;bottom:26px;left:26px;z-index:1550;width:min(380px,calc(100vw - 32px));height:min(560px,calc(100vh - 52px));background:var(--shell);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);display:flex;flex-direction:column;overflow:hidden;opacity:0;visibility:hidden;transform:translateY(20px) scale(.98);transform-origin:bottom left;transition:opacity .3s var(--ease),transform .3s var(--ease),visibility .3s}
.emily-panel[data-open="true"]{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
.emily-panel__head{background:linear-gradient(135deg,var(--teal-deep),var(--deep-sea));color:#fff;padding:18px 20px;display:flex;align-items:center;gap:12px}
.emily-panel__head .emily-launch__av{width:44px;height:44px}
.emily-panel__head b{font-size:1rem;display:block}
.emily-panel__head small{font-size:.76rem;color:rgba(234,246,247,.8)}
.emily-panel__close{margin-left:auto;width:36px;height:36px;border:none;background:rgba(255,255,255,.12);color:#fff;border-radius:var(--r-full);cursor:pointer;font-size:1.2rem}
.emily-log{flex:1;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:12px}
/* Quieter supporting text. Used for the affiliate note on Where I Book and
   the sign-off on the unsubscribe page. */
.small{font-size:.88rem;color:var(--ink-soft)}

/* Where I Book. Each card is one destination with her three merchants, and
   the links sit at the bottom so cards of different text lengths still line
   their buttons up. */
.book-card{display:flex;flex-direction:column;padding:26px}
.book-card h3{margin:.15em 0 .4em}
.book-card p{color:var(--ink-soft);line-height:1.65}
.book-card__links{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;padding-top:18px}
.book-card__links .btn{flex:1 1 auto;justify-content:center;min-height:48px}

/* Honeypot. The server has always rejected submissions that fill a field
   called "website", but no form ever rendered one, so the check had never
   caught anything. Now every form carries it.

   Moved off screen rather than display:none or hidden, because both of those
   are trivially detected by a bot deciding which fields to fill, and a field
   it skips catches nobody. aria-hidden and tabindex -1 keep it away from
   screen readers and the tab order, so nobody using the site ever meets it. */
.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}

/* pre-wrap because Emily reads enquiry details back as a short list before
   sending them, and her replies are inserted as textContent (never innerHTML,
   which would make model output an injection route). Without this the line
   breaks collapse and the summary runs together. */
.emily-msg{max-width:84%;padding:12px 15px;border-radius:16px;font-size:.9rem;line-height:1.5;white-space:pre-wrap}
.emily-msg--bot{align-self:flex-start;background:var(--white);border:1px solid var(--hairline);color:var(--ink);border-bottom-left-radius:5px}
.emily-msg--user{align-self:flex-end;background:var(--turquoise);color:var(--ink);border-bottom-right-radius:5px;font-weight:600}
.emily-quick{display:flex;flex-wrap:wrap;gap:8px;padding:0 18px 12px}
.emily-quick button{font-size:.8rem;font-weight:700;padding:9px 14px;border-radius:var(--r-full);border:1.5px solid var(--hairline);background:var(--white);color:var(--teal-deep);cursor:pointer;transition:all .2s var(--ease)}
.emily-quick button:hover{background:var(--turquoise);border-color:var(--turquoise);color:var(--ink)}
.emily-foot{padding:12px 16px;border-top:1px solid var(--hairline);display:flex;gap:8px;background:var(--white)}
.emily-foot input{flex:1;border:1px solid var(--hairline);border-radius:var(--r-full);padding:10px 16px;font-family:inherit;font-size:.88rem;min-height:44px}
.emily-foot input:focus{outline:none;border-color:var(--turquoise)}
.emily-foot button{width:44px;height:44px;border:none;border-radius:var(--r-full);background:var(--turquoise);color:var(--ink);cursor:pointer;display:flex;align-items:center;justify-content:center}
.emily-foot button svg{width:18px;height:18px}
.emily-note{font-size:.68rem;text-align:center;color:var(--ink-soft);padding:0 16px 10px;background:var(--white)}

/* ===== PAGE HEADER (inner pages) ===== */
.page-header{position:relative;padding:clamp(124px,16vh,168px) 0 clamp(48px,6vw,80px);color:#fff;overflow:hidden;isolation:isolate}
.page-header__bg{position:absolute;inset:0;z-index:-2}
.page-header__bg img{width:100%;height:100%;object-fit:cover;object-position:center 38%}
.page-header__scrim{position:absolute;inset:0;z-index:-1;background:linear-gradient(120deg,rgba(8,34,42,.9),rgba(8,34,42,.62))}
.page-header .eyebrow{color:var(--turquoise-light)}
.page-header .eyebrow::before{background:var(--turquoise-light)}
.page-header h1{color:#fff;max-width:760px}
.page-header p{color:rgba(234,246,247,.92);max-width:600px;font-size:clamp(1.05rem,1.4vw,1.25rem)}
.breadcrumb{display:flex;gap:8px;align-items:center;font-size:.82rem;color:rgba(234,246,247,.7);margin-bottom:18px}
.breadcrumb a{color:rgba(234,246,247,.7)}.breadcrumb a:hover{color:#fff}

/* filters */
.filterbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:center;margin-bottom:36px}
.filterbar button{font-weight:700;font-size:.88rem;padding:10px 18px;border-radius:var(--r-full);border:1.5px solid var(--hairline);background:var(--white);color:var(--ink-soft);cursor:pointer;transition:all .2s var(--ease);min-height:44px}
.filterbar button:hover{border-color:var(--turquoise);color:var(--teal-deep)}
.filterbar button[aria-pressed="true"]{background:var(--teal-deep);border-color:var(--teal-deep);color:#fff}

/* blog */
.post-feature{display:grid;grid-template-columns:1.2fr 1fr;gap:0;border-radius:var(--r-xl);overflow:hidden;background:var(--card-bg);border:1px solid var(--hairline);box-shadow:var(--shadow-md)}
.post-feature__media{position:relative;min-height:300px}
.post-feature__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.post-feature__body{padding:clamp(28px,4vw,48px);display:flex;flex-direction:column;gap:14px;justify-content:center}
.post-feature__body h3{font-size:clamp(1.5rem,2.4vw,2rem)}
.post-meta{display:flex;gap:14px;align-items:center;font-size:.8rem;color:var(--muted);font-weight:600}

/* misc */
.divider{height:1px;background:var(--hairline);border:none;margin:0}
.tag-list{display:flex;flex-wrap:wrap;gap:8px}
.note-band{background:rgba(232,211,169,.35);border:1px solid rgba(232,211,169,.7);border-radius:var(--r-md);padding:16px 20px;font-size:.9rem;color:#7a5d2a;display:flex;gap:12px;align-items:flex-start}
.note-band svg{width:20px;height:20px;flex:0 0 auto;color:#b5892c;margin-top:2px}

/* ===== ANIMATIONS ===== */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal.in-view{opacity:1;transform:none}
.reveal[data-delay="1"]{transition-delay:.08s}.reveal[data-delay="2"]{transition-delay:.16s}.reveal[data-delay="3"]{transition-delay:.24s}.reveal[data-delay="4"]{transition-delay:.32s}
.scroll-progress{position:fixed;top:0;left:0;height:3px;width:100%;transform:scaleX(0);transform-origin:0 50%;background:linear-gradient(90deg,var(--turquoise),var(--coral));z-index:1200}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1!important;transform:none!important;transition:none!important}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .scroll-progress{display:none}
}

/* ===== RESPONSIVE ===== */
@media (max-width:1024px){
  .split{grid-template-columns:1fr;gap:32px}
  .split--reverse .split__media{order:0}
  .leadmag{grid-template-columns:1fr}
  .post-feature{grid-template-columns:1fr}
  .post-feature__media{min-height:240px}
  .lux-footer__sitemap{grid-template-columns:repeat(2,1fr);gap:28px}
}
@media (max-width:860px){
  .lux-nav,.lux-header__cta .btn{display:none}
  .hamburger{display:inline-flex}
  .lux-header__cta{gap:0}
  .lux-footer__top{grid-template-columns:1fr;gap:28px}
  .mega-menu{display:none!important}
  .sticky-fab{display:none}
  .sticky-mobile-bar{display:flex}
  .emily-launch__txt{display:none}
  .emily-launch{padding:8px}
}
@media (max-width:560px){
  .field-row{grid-template-columns:1fr}
  .lux-footer__sitemap{grid-template-columns:1fr 1fr}
  .lux-footer__bottom{flex-direction:column;text-align:center;align-items:center}
  .hero__bg img{object-position:68% center}
  .emily-panel{left:16px;right:16px;width:auto}
}
@media (max-width:400px){
  .lux-footer__sitemap{grid-template-columns:1fr}
  .btn{width:100%}
  .hero .btn-row{flex-direction:column;align-items:stretch}
}

/* ===== polish overrides ===== */
.hero .btn-ghost,.page-header .btn-ghost,.cta-band .btn-ghost{color:#fff;border-color:rgba(255,255,255,.55)}
.hero .btn-ghost:hover,.page-header .btn-ghost:hover,.cta-band .btn-ghost:hover{background:#fff;color:var(--teal-deep);border-color:#fff}
.review-cover{position:relative;aspect-ratio:16/10;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;color:#fff;background:linear-gradient(135deg,#19B5C4 0%,#0E7C8B 55%,#0B2A33 100%);overflow:hidden}
.review-cover::after{content:"";position:absolute;right:-30px;bottom:-40px;width:180px;height:180px;border-radius:50%;background:rgba(255,255,255,.08)}
.review-cover__rate{display:inline-flex;align-items:center;gap:5px;font-family:var(--display);font-size:2.1rem;font-weight:600;position:relative}
.review-cover__rate svg{width:22px;height:22px;color:var(--sand)}
.review-cover small{font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;font-weight:800;opacity:.92;position:relative}
.review-cover--photo{background:#0B2A33}
.review-cover--photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.review-cover--photo::after{display:none}
.review-cover--photo::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,34,42,.30) 0%,rgba(8,34,42,.18) 42%,rgba(8,34,42,.62) 100%);z-index:1}
.review-cover--photo .card__tag,.review-cover--photo .review-cover__rate,.review-cover--photo small{z-index:2}
.review-cover--photo .review-cover__rate,.review-cover--photo small{text-shadow:0 1px 10px rgba(8,34,42,.7)}
.section-deep .leadmag{--card-bg:var(--deep-sea-card)}
.kind-empty{max-width:680px;margin:0 auto;text-align:center}
.kind-empty .quote{margin:0 auto 1.4rem}
.dest-tile--grad{background:linear-gradient(150deg,#0E7C8B,#0B2A33)}
.dest-tile--grad::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 78% 18%,rgba(95,210,220,.34),transparent 58%);z-index:0}
.dest-tile--grad .dest-tile__scrim{background:linear-gradient(180deg,rgba(8,34,42,0) 38%,rgba(8,34,42,.62))}
.dest-tile__kicker{position:absolute;top:20px;left:22px;z-index:2;font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--sand)}
.page-header--grad{background:linear-gradient(130deg,#0E7C8B 0%,#0B2A33 72%)}
.page-header--grad::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 80% 14%,rgba(95,210,220,.3),transparent 55%)}
.card__media--grad{background:linear-gradient(135deg,#19B5C4 0%,#0E7C8B 58%,#0B2A33 100%);display:flex;align-items:flex-end;padding:0}
.card__media--grad::after{content:"";position:absolute;right:-28px;bottom:-36px;width:150px;height:150px;border-radius:50%;background:rgba(255,255,255,.08)}
.card__media--grad .card__media-label{position:relative;padding:18px 20px;color:#fff;font-family:var(--display);font-size:1.2rem;font-weight:600}
.faq{max-width:820px;margin:0 auto;display:grid;gap:12px}
.faq details{background:var(--card-bg);border:1px solid var(--hairline);border-radius:var(--r-md);padding:4px 22px;box-shadow:var(--shadow-sm)}
.faq summary{cursor:pointer;list-style:none;padding:18px 0;font-weight:800;color:var(--card-title);font-size:1.05rem;display:flex;justify-content:space-between;align-items:center;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:1.5rem;color:var(--turquoise);font-weight:400;transition:transform .2s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:0 0 18px;color:var(--muted)}
.plan-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(28px,4vw,52px);align-items:start}
.plan-form-card{background:var(--white);border:1px solid var(--hairline);border-radius:var(--r-xl);padding:clamp(24px,3.5vw,40px);box-shadow:var(--shadow-md)}
.plan-aside{display:flex;flex-direction:column;gap:22px;position:sticky;top:96px}
.plan-aside__media{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-md);aspect-ratio:4/3}
.plan-aside__media img{width:100%;height:100%;object-fit:cover}
@media (max-width:980px){.plan-grid{grid-template-columns:1fr}.plan-aside{position:static}}
/* contrast fixes */
.dest-tile__kicker{background:rgba(8,34,42,.6);padding:5px 12px;border-radius:var(--r-full);color:#fff;backdrop-filter:blur(2px);letter-spacing:.12em}
.cta-band .eyebrow{color:#fff!important}
.cta-band .eyebrow::before{background:#fff}

/* ===== revision 2: logo swap, landscape footer sig, Emily avatar, hero focus ===== */
.lux-header__logo img{height:54px;width:auto}
.lux-header__logo .logo--dark{display:none}
.lux-header[data-scrolled="true"] .logo--light{display:none}
.lux-header[data-scrolled="true"] .logo--dark{display:block}
.lux-header__inner{height:90px}
.hero__bg img{object-position:center 52%}
.page-header__bg img{object-position:center 50%}
@media (max-width:560px){.hero__bg img{object-position:center 52%}}
@media (max-width:860px){.lux-header__logo img{height:46px}.lux-header__inner{height:74px}}
/* footer landscape POM AI signature (shows the name) */
.pom-ai-signature{gap:12px}
.pom-ai-signature__logo{height:34px!important;width:auto!important;border-radius:0!important;background:none!important;object-fit:contain}
.pom-ai-signature__link{filter:drop-shadow(0 0 0 rgba(25,181,196,0))}
.pom-ai-signature__link:hover,.pom-ai-signature__link:focus-visible{filter:drop-shadow(0 0 9px rgba(25,181,196,.65))}
@media (max-width:768px){.pom-ai-signature__logo{height:30px!important}}
/* Emily avatar image + airplane badge */
.emily-launch__av{overflow:visible;background:linear-gradient(135deg,var(--turquoise),var(--teal-deep))}
.emily-launch__av img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block}
.emily-launch__av::after{display:none}
.emily-launch__plane{position:absolute;right:-5px;bottom:-5px;width:22px;height:22px;border-radius:50%;background:var(--coral);color:#fff;display:flex;align-items:center;justify-content:center;border:2px solid var(--shell);box-shadow:0 2px 6px rgba(8,34,42,.3)}
.emily-launch__plane svg{width:12px;height:12px}
.emily-panel__head .emily-launch__plane{border-color:var(--teal-deep)}

/* ===== revision 3: header legibility over hero (light at top, dark on scroll) ===== */
.lux-header::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(8,34,42,.55),rgba(8,34,42,0));pointer-events:none;transition:opacity .3s var(--ease)}
.lux-header[data-scrolled="true"]::before{opacity:0}
.lux-nav__link,.mega-trigger__btn{color:#fff;text-shadow:0 1px 14px rgba(8,34,42,.5)}
.lux-nav__link:hover,.mega-trigger__btn:hover,.mega-trigger[data-open="true"] .mega-trigger__btn{color:#fff;background:rgba(255,255,255,.16)}
.hamburger span,.hamburger span::before,.hamburger span::after{background:#fff}
.lux-header[data-scrolled="true"] .lux-nav__link,.lux-header[data-scrolled="true"] .mega-trigger__btn{color:var(--ink);text-shadow:none}
.lux-header[data-scrolled="true"] .lux-nav__link:hover,.lux-header[data-scrolled="true"] .mega-trigger__btn:hover,.lux-header[data-scrolled="true"] .mega-trigger[data-open="true"] .mega-trigger__btn{color:var(--teal-deep);background:rgba(25,181,196,.10)}
.lux-header[data-scrolled="true"] .hamburger span,.lux-header[data-scrolled="true"] .hamburger span::before,.lux-header[data-scrolled="true"] .hamburger span::after{background:var(--ink)}

/* ===== revision 4: inline-icon SVG size guard (fixes oversized breadcrumb separator) ===== */
svg{width:1.15rem;height:1.15rem;flex:0 0 auto}
.breadcrumb svg{width:15px;height:15px}
.step__num svg{width:20px;height:20px}

/* ===== revision 5: footer social row + bigger POM signature + Emily retract at footer ===== */
.lux-footer__follow{display:flex;align-items:center;gap:14px;margin-top:22px;flex-wrap:wrap}
.lux-footer__follow-label{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--turquoise-light);font-weight:800}
.lux-footer{padding-bottom:40px}
.pom-ai-signature__logo{height:46px!important}
.pom-ai-signature__eyebrow{font-size:12px}
@media (max-width:768px){.pom-ai-signature__logo{height:40px!important}}
body[data-at-footer="true"] .emily-launch{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .3s var(--ease),visibility .3s}
@media (max-width:860px){ body[data-at-footer="true"] .sticky-mobile-bar{transform:translateY(110%)} }

/* ===== revision 6: header logo ~2x bigger + clearance ===== */
.lux-header__logo img{height:96px}
.lux-header__inner{height:120px}
.hero{padding-top:clamp(142px,18vh,178px)}
.page-header{padding-top:clamp(140px,16vh,172px)}
@media (max-width:860px){
  .lux-header__logo img{height:60px}
  .lux-header__inner{height:84px}
  .hero{padding-top:124px}
  .page-header{padding-top:118px}
}

/* ===== revision 7: stop logo squish (width:auto) + regular footer logo size + real favicon ===== */
.lux-footer__brand img,.mobile-overlay__top img,.lux-header__logo img{width:auto!important}
.lux-footer__brand img{height:54px}
.mobile-overlay__top img{height:42px}

/* ===== revision 8: footer logo 3x ===== */
.lux-footer__brand img{height:160px}
@media (max-width:768px){ .lux-footer__brand img{height:112px} }

/* ===== revision 9: airplane jet-stream hover on header + footer links ===== */
.lux-nav__link,.mega-trigger__btn,.lux-footer__col a,.lux-footer__legal a{position:relative}
/* clean hover: drop the header pill bg so the jet reads (mega-open pill stays) */
.lux-nav__link:hover,.mega-trigger__btn:hover,
.lux-header[data-scrolled="true"] .lux-nav__link:hover,
.lux-header[data-scrolled="true"] .mega-trigger__btn:hover{background:transparent}
/* the jet stream underline */
.lux-nav__link::after,.mega-trigger__btn::after,.lux-footer__col a::after,.lux-footer__legal a::after{
  content:"";position:absolute;left:0;width:100%;height:2px;border-radius:2px;pointer-events:none;
  background:linear-gradient(90deg,var(--turquoise),var(--turquoise-light));
  transform:scaleX(0);transform-origin:left center;transition:transform .62s var(--ease) .04s}
/* the airplane (inline SVG, nose pointing along the trail) */
.lux-nav__link::before,.mega-trigger__btn::before,.lux-footer__col a::before,.lux-footer__legal a::before{
  content:"";position:absolute;left:0;width:13px;height:13px;opacity:0;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2319B5C4'%3E%3Cpath d='M2 21l20-9L2 3v6.5l13 2.5-13 2.5z'/%3E%3C/svg%3E") center/contain no-repeat}
/* vertical placement per context */
.lux-nav__link::after,.mega-trigger__btn::after{bottom:6px}
.lux-nav__link::before,.mega-trigger__btn::before{bottom:1px}
.lux-footer__col a,.lux-footer__legal a{align-self:flex-start}
.lux-footer__col a::after,.lux-footer__legal a::after{bottom:-4px}
.lux-footer__col a::before,.lux-footer__legal a::before{bottom:-9px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%235FD2DC'%3E%3Cpath d='M2 21l20-9L2 3v6.5l13 2.5-13 2.5z'/%3E%3C/svg%3E")}
/* trigger on hover */
@media (hover:hover){
  .lux-nav__link:hover::after,.mega-trigger__btn:hover::after,.lux-footer__col a:hover::after,.lux-footer__legal a:hover::after{transform:scaleX(1)}
  .lux-nav__link:hover::before,.mega-trigger__btn:hover::before,.lux-footer__col a:hover::before,.lux-footer__legal a:hover::before{animation:jetFly .62s var(--ease) forwards}
}
@keyframes jetFly{
  0%{opacity:0;left:0}
  14%{opacity:1}
  72%{opacity:1}
  100%{opacity:0;left:calc(100% - 6px)}
}
@media (prefers-reduced-motion:reduce){
  .lux-nav__link::before,.mega-trigger__btn::before,.lux-footer__col a::before,.lux-footer__legal a::before{display:none}
  .lux-nav__link::after,.mega-trigger__btn::after,.lux-footer__col a::after,.lux-footer__legal a::after{transition:none}
}

/* ===== revision 10: mega-menu hover bridge ===== */
.mega-menu::before{content:"";position:absolute;left:0;right:0;top:-18px;height:20px}

/* ===== blog article (editorial) ===== */
.article{padding:clamp(34px,5vw,60px) 0 clamp(40px,6vw,76px)}
.article-grid{display:grid;grid-template-columns:230px minmax(0,1fr);gap:clamp(28px,4vw,56px);align-items:start;max-width:1080px;margin:0 auto}
.toc{position:sticky;top:120px}
.toc h4{font-family:var(--body);font-weight:800;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--teal-deep);margin:0 0 14px}
.toc ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.toc a{display:block;padding:7px 14px;border-left:2px solid var(--hairline);color:var(--ink-soft);text-decoration:none;font-size:.9rem;line-height:1.4;transition:color .2s var(--ease),border-color .2s var(--ease),background .2s var(--ease)}
.toc a:hover{color:var(--teal-deep);border-left-color:var(--turquoise)}
.toc a.active{color:var(--teal-deep);border-left-color:var(--turquoise);font-weight:700;background:rgba(25,181,196,.07)}
.prose{max-width:720px}
.prose p{font-size:1.08rem;line-height:1.8;color:var(--ink);margin:0 0 1.3rem}
.prose p.lede{font-size:clamp(1.2rem,1.6vw,1.34rem);line-height:1.6}
/* filter buttons are deep-link targets (resort-reviews#family etc). The sticky header is ~74px, so without this the browser scrolls them underneath it. */
/* CASL consent checkbox: ships unchecked, 48px touch target per the
   Universal Quality Bar, ink text so it passes AA on cream and on deep-sea */
.consent{display:flex;align-items:flex-start;gap:10px;margin:10px 0 2px;font-size:.86rem;line-height:1.45;cursor:pointer;min-height:48px;align-content:center;flex-wrap:wrap}
.consent input[type=checkbox]{flex:0 0 auto;width:20px;height:20px;margin-top:2px;accent-color:var(--teal-deep);cursor:pointer}
.consent span{flex:1 1 220px;color:inherit;opacity:.92}
.consent__warning{margin:2px 0 0;font-size:.84rem;font-weight:700;color:var(--coral-deep)}
.lux-footer .consent span{color:var(--on-dark-soft)}
.filterbar button{scroll-margin-top:120px}
.prose h2{font-size:clamp(1.5rem,2.4vw,2rem);margin:2.5rem 0 1rem;scroll-margin-top:120px;color:var(--teal-deep)}
.prose h3{font-size:1.22rem;margin:1.8rem 0 .6rem;color:var(--ink)}
.prose a{color:var(--teal-deep);font-weight:700;text-decoration:underline;text-decoration-color:rgba(25,181,196,.45);text-underline-offset:3px;transition:text-decoration-color .2s var(--ease)}
.prose a:hover{text-decoration-color:var(--turquoise)}
.prose ul{margin:0 0 1.3rem;padding-left:1.15rem}
.prose li{margin-bottom:.5rem;line-height:1.7;font-size:1.04rem}
.prose figure{margin:2rem 0}
/* Post tables. Rachel's Playa del Carmen post shipped a resort comparison
   table and there was no styling for one, so it rendered as bare browser
   default and ran off the side of a phone. The wrapper scrolls the table on
   its own rather than letting the page scroll sideways. */
.prose .table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:1.8rem 0;border:1px solid var(--sand-deep,#e5ded3);border-radius:12px}
.prose table{border-collapse:collapse;width:100%;min-width:520px;font-size:.98rem}
.prose thead th{background:var(--sand,#f6f1e8);color:var(--teal-deep);text-align:left;font-weight:800;white-space:nowrap}
.prose th,.prose td{padding:.7rem .85rem;border-bottom:1px solid var(--sand-deep,#e5ded3);vertical-align:top;line-height:1.5}
.prose tbody tr:last-child td{border-bottom:0}
.prose tbody tr:nth-child(even){background:rgba(0,0,0,.02)}
.prose figure img{width:100%;border-radius:var(--r-lg);box-shadow:var(--shadow-sm);display:block}
.prose figcaption{font-size:.84rem;color:var(--muted);margin-top:9px;text-align:center;font-style:italic}
.tipbox{background:rgba(25,181,196,.07);border:1px solid rgba(25,181,196,.2);border-left:4px solid var(--turquoise);border-radius:0 var(--r-md) var(--r-md) 0;padding:18px 22px;margin:1.7rem 0}
.tipbox b{color:var(--teal-deep);font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;display:block;margin-bottom:6px}
.tipbox p{margin:0;font-size:1rem}
.pull{font-family:var(--display);font-size:clamp(1.4rem,2.6vw,1.85rem);line-height:1.38;color:var(--teal-deep);border-top:2px solid var(--hairline);border-bottom:2px solid var(--hairline);padding:1.4rem 0;margin:2.2rem 0;font-weight:500;font-style:italic}
.appendix{background:var(--white);border:1px solid var(--hairline);border-radius:var(--r-lg);padding:clamp(22px,3vw,32px);margin:2.4rem 0;box-shadow:var(--shadow-sm)}
.appendix .eyebrow{margin-bottom:.5rem}
.appendix h3{margin:0 0 16px;color:var(--teal-deep);font-size:1.3rem}
.checklist{list-style:none;margin:0;padding:0;columns:2;column-gap:30px}
.checklist li{break-inside:avoid;display:flex;gap:10px;align-items:flex-start;margin-bottom:11px;font-size:.98rem;line-height:1.5}
.checklist li::before{content:"";flex:0 0 auto;width:19px;height:19px;border-radius:5px;background:rgba(25,181,196,.15) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230E7C8B' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") center/12px no-repeat;margin-top:2px}
.article-byline{display:flex;align-items:center;gap:12px;flex-wrap:wrap;color:rgba(234,246,247,.92);font-size:.92rem;font-weight:600;margin-top:18px}
.article-byline .avatar{width:42px;height:42px;border-radius:50%;overflow:hidden;flex:0 0 auto;border:2px solid rgba(255,255,255,.3)}
.article-byline .avatar img{width:100%;height:100%;object-fit:cover}
.article-byline .dot{opacity:.5}
.author-bio{display:flex;gap:20px;align-items:center;background:var(--sand-soft);border-radius:var(--r-lg);padding:24px clamp(20px,3vw,28px);margin:2.6rem 0 0}
.author-bio img{width:88px;height:88px;border-radius:50%;object-fit:cover;flex:0 0 auto}
.author-bio h4{margin:0 0 4px;color:var(--teal-deep);font-family:var(--body);font-weight:800}
.author-bio p{margin:0;font-size:.96rem;color:var(--ink-soft)}
.toc-mobile{display:none}
@media (max-width:900px){
  .article-grid{grid-template-columns:1fr}
  .toc{display:none}
  .toc-mobile{display:block;max-width:720px;margin:0 auto 26px}
  .toc-mobile details{background:var(--white);border:1px solid var(--hairline);border-radius:var(--r-md);padding:2px 20px}
  .toc-mobile summary{cursor:pointer;font-weight:800;color:var(--teal-deep);padding:15px 0;list-style:none}
  .toc-mobile summary::-webkit-details-marker{display:none}
  .toc-mobile ol{list-style:none;margin:0 0 14px;padding:0;display:flex;flex-direction:column;gap:9px}
  .toc-mobile a{color:var(--ink-soft);text-decoration:none;font-weight:600}
  .checklist{columns:1}
  .prose{max-width:none}
  .author-bio{flex-direction:column;text-align:center}
}

/* ===== blog index: coming-soon cards ===== */
.post-soon{margin-top:auto;align-self:flex-start;display:inline-flex;align-items:center;gap:.4rem;font-weight:800;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);background:var(--shell);border:1px dashed rgba(14,124,139,.35);padding:8px 15px;border-radius:var(--r-full)}
.card--soon .card__media--grad{filter:saturate(.6) brightness(.96)}
.card--soon h3{color:var(--ink-soft)}
.card--soon:hover{transform:none;box-shadow:var(--shadow-sm)}

/* Whole-card tap target. The heading holds the only real link; this overlay
   stretches it across the card so a thumb landing anywhere opens the post,
   which is how everyone expects a card to behave on a phone. Focus styling
   moves to the card so keyboard users can still see where they are. */
.card--link{position:relative}
.card--link .card__link{color:inherit;text-decoration:none}
.card--link .card__link::after{content:"";position:absolute;inset:0;z-index:3}
.card--link .card__link:focus-visible{outline:none}
.card--link:focus-within{outline:2px solid var(--teal-deep);outline-offset:3px}
.card--link:hover .card__link{color:var(--teal-deep)}
.card--link .textlink{pointer-events:none}

/* Article share row and the sidebar call to action.

   Two copies exist in the markup, one in the sidebar and one after the
   article. Only one is ever displayed, so only one is ever in the
   accessibility tree. The sidebar is hidden below 980px, which is where the
   inline copy takes over, and that is the traffic a travel blog actually
   gets. */
.share--inline{display:none}
.share{margin-top:28px}
.toc--empty{padding-top:4px}
.share__label{font-family:var(--body);font-weight:800;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--teal-deep);margin:0 0 12px}
.share__row{display:flex;gap:10px;flex-wrap:wrap}
/* 48px square, which is the touch-target floor on this project, so the same
   markup works on a phone without a second set of sizes. */
.share__btn{width:48px;height:48px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--hairline);border-radius:var(--r-md);background:var(--white);color:var(--ink-soft);cursor:pointer;padding:0;transition:color .2s var(--ease),border-color .2s var(--ease),transform .2s var(--ease)}
.share__btn svg{width:20px;height:20px}
.share__btn:hover{color:var(--teal-deep);border-color:var(--turquoise);transform:translateY(-2px)}
.share__btn:focus-visible{outline:2px solid var(--teal-deep);outline-offset:2px}
.share__btn.is-copied{color:var(--teal-deep);border-color:var(--turquoise)}

.aside-cta{margin-top:22px;background:var(--cream-dark);border:1px solid var(--hairline);border-radius:var(--r-md);padding:22px}
.aside-cta h4{font-family:var(--display);font-size:1.15rem;font-weight:600;color:var(--ink);margin:0 0 8px;letter-spacing:0}
.aside-cta p{margin:0 0 14px;color:var(--ink-soft);font-size:.9rem;line-height:1.55}
.aside-cta__link{font-family:var(--body);font-weight:800;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--teal-deep);text-decoration:none;display:inline-flex;align-items:center;gap:8px;min-height:44px}
.aside-cta__link:hover{color:var(--ink)}
.aside-cta__link span{transition:transform .2s var(--ease);display:inline-block}
.aside-cta__link:hover span{transform:translateX(4px)}

@media (max-width:980px){
  .share--aside{display:none}
  .share--inline{display:block;max-width:720px;margin:34px auto 0}
}

/* Copy-link feedback.

   The first version only shifted the icon colour for under two seconds, which
   on a phone is invisible. Jas clicked it and reasonably concluded it was
   broken, when the copy had actually worked. A control that succeeds silently
   reads as a control that failed, so the confirmation is now a shape change
   and a word, not a tint.

   The tick sits inside the same button as the link icon and they swap, which
   avoids any layout shift in the row. The word goes in an aria-live region so
   a screen reader hears it too. */
.share__btn--copy .icon-tick{display:none}
.share__btn--copy.is-copied .icon-link{display:none}
.share__btn--copy.is-copied .icon-tick{display:block}
.share__btn--copy.is-copied{color:var(--white);background:var(--teal-deep);border-color:var(--teal-deep)}
.share__said{display:inline-flex;align-items:center;font-size:.8rem;font-weight:700;color:var(--teal-deep);opacity:0;transform:translateX(-6px);transition:opacity .2s var(--ease),transform .2s var(--ease)}
.share__said.is-shown{opacity:1;transform:none}

/* The trip cost sheet. Designed to be filled in, so the third column is a
   deliberately empty box people can write in on paper or type over on screen.
   Scrolls inside its own container on a phone rather than pushing the page
   sideways. */
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:26px 0}
.cost-sheet{width:100%;min-width:520px;border-collapse:collapse;font-size:.94rem}
.cost-sheet th{text-align:left;background:var(--cream-dark);color:var(--ink);font-family:var(--body);font-weight:800;font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;padding:12px 14px;border-bottom:2px solid var(--hairline)}
.cost-sheet td{padding:13px 14px;border-bottom:1px solid var(--hairline);vertical-align:top;color:var(--ink-soft);line-height:1.5}
.cost-sheet td:first-child{font-weight:700;color:var(--ink);white-space:nowrap}
.cost-sheet td.fill{background:var(--white);border-left:1px solid var(--hairline);min-width:110px}
.cost-sheet tr.total td{background:var(--cream-dark);border-bottom:none;font-size:1rem}
.cost-sheet tr.total td.fill{background:var(--white)}
.print-hint{font-size:.9rem;color:var(--ink-soft);font-style:italic}

@media print{
  .lux-header,.lux-footer,.emily-launch,.emily-panel,.sticky-cta,.page-header__bg,.breadcrumb,.print-hint,.scroll-progress{display:none !important}
  .page-header{padding:0 0 12px}
  .section{padding:0}
  .cost-sheet td.fill{min-height:34px}
  a[href]:after{content:""}
}

/* Fillable cells. The input is the cell, so tapping anywhere in the box on a
   phone starts typing rather than needing a precise hit on a small field. */
.cost-sheet td.fill{padding:0}
.cost-sheet input[data-cost]{width:100%;min-height:48px;border:none;background:var(--white);padding:12px 14px;font:inherit;color:var(--ink);font-weight:700}
.cost-sheet input[data-cost]:focus{outline:2px solid var(--turquoise);outline-offset:-2px;background:#fff}
.cost-sheet output{display:block;padding:13px 14px;font-weight:800;color:var(--teal-deep)}
.cost-sheet tr.total output{font-size:1.05rem;color:var(--ink)}
.sheet-actions{display:flex;gap:12px;flex-wrap:wrap;margin:22px 0 8px}
@media print{ .sheet-actions{display:none !important} .cost-sheet input[data-cost]{border-bottom:1px solid var(--hairline)} }