/* =====================================================================
   SGF PROTOTYPE STYLESHEET — v3 premium rebuild
   One stylesheet for both pages. Prefixes:
     hp-  = homepage (index.html)
     dm-  = destinations map (destinations.html)
     st-  = shared site chrome (header, nav, footer) used by both pages
   Design language: modeled on award-winning large-hub airport sites:
   floating translucent navigation bar, diagonal photographic hero,
   soft blue-gray page surface with white elevated cards, calibrated
   motion. All WCAG 2.1 AA behavior is engineered in, not decorated on.
   ===================================================================== */

/* ---------------------------------------------------------------------
   TOKENS
   --------------------------------------------------------------------- */
:root{
  /* Springfield-Branson National Airport verified brand palette,
     extracted from SGF's own published SVG and page assets (saved
     copies of flyspringfield.com supplied by the client):
       lime #B8CA2E     signature accent, their most-used brand color
       slate #2B4957    primary dark surface (headers, footer)
       deep #033850     deepest navy, high-contrast text on light
       blue #005C86     interactive brand blue
       pale #D8EAF4     tinted surfaces, served states on the map
       cream #EAE4DD    warm alternate section background
       tan #C7B190      warm accent band
       sage #A2C9B8     secondary green accent
     Lime is never used as text on white (insufficient contrast);
     it appears as fills, arcs, pins and large shapes with dark
     slate text on top. Semantic status colors below are
     contrast-calibrated, not brand colors. */
  --sgf-navy:#033850;        /* headings and high-contrast text, 12.5:1 on white */
  --sgf-blue:#005C86;        /* interactive, links, focus, 6.8:1 on white */
  --sgf-sky:#D8EAF4;         /* tinted surfaces */
  --sgf-lime:#B8CA2E;        /* signature accent, fills and shapes only */
  --sgf-lime-deep:#5A6316;   /* olive text over lime tints, 6.5:1 on white */
  --sgf-slate-dark:#2B4957;  /* primary dark surface */
  --sgf-cream:#EAE4DD;       /* warm alternate band */
  --sgf-tan:#C7B190;         /* warm accent band */
  --sgf-sage:#A2C9B8;        /* secondary accent */
  --sgf-gold:#B8CA2E;        /* legacy alias, = lime */
  --sgf-ink:#12171C;
  --sgf-slate:#55636F;       /* secondary text, 4.5:1 on white */
  --sgf-line:#D5DDE4;
  --sgf-bg:#FFFFFF;
  --sgf-ontime:#1B6B3A;
  --sgf-delayed:#9A4A00;
  --sgf-cancel:#A11B24;
  --radius:10px;
  --maxw:1200px;
  --sgf-font: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --sgf-font-mono: ui-monospace, "SF Mono", "Cascadia Code", "Segoe UI Mono", Consolas, monospace;

  /* page surface + elevated card system (large-hub style light blue-gray) */
  --surface:#EFF2F4;
  --card:#FFFFFF;
  --card-radius:18px;
  --hairline:#DEE7EC;

  /* deep header/hero gradient endpoints, SGF slate-navy family */
  --deep-1:#033850;
  --deep-2:#2B4957;
  --deep-3:#0A6B94;

  /* fluid type scale */
  --fs-hero: clamp(2.3rem, 1.7rem + 2.6vw, 4.1rem);
  --fs-display: clamp(1.65rem, 1.4rem + 1.1vw, 2.25rem);
  --fs-h3: 1.12rem;
  --fs-eyebrow: .78rem;
  --fs-lede: 1.12rem;
  --fs-small: .875rem;

  /* 8px spacing scale */
  --sp-3xs:.25rem; --sp-2xs:.5rem; --sp-xs:.75rem; --sp-sm:1rem;
  --sp-md:1.5rem; --sp-lg:2.25rem; --sp-xl:3.5rem; --sp-2xl:5rem; --sp-3xl:7rem;

  /* slate-tinted diffuse elevation, never pure black */
  --shadow-sm:0 1px 2px rgba(6,42,60,.08), 0 1px 1px rgba(6,42,60,.05);
  --shadow-md:0 14px 34px -18px rgba(6,42,60,.3), 0 2px 6px rgba(6,42,60,.07);
  --shadow-lg:0 32px 70px -26px rgba(6,42,60,.38), 0 6px 18px rgba(6,42,60,.09);

  --ease-out:cubic-bezier(.16,1,.3,1);
  --dur-sm:.3s;
  --dur-md:.6s;

  --header-h:64px;
}

*, *::before, *::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0;
  font-family:var(--sgf-font);
  font-size:16px;
  line-height:1.6;
  color:var(--sgf-ink);
  background:var(--surface);
  overflow-x:hidden;
}
h1,h2,h3,h4,h5,h6{ line-height:1.2; margin:0 0 .5em; font-weight:700; }
p{ margin:0 0 1em; }
img,svg{ max-width:100%; display:block; }
[hidden]{ display:none !important; }
a{ color:var(--sgf-blue); text-decoration-thickness:2px; text-underline-offset:2px; }
ul{ margin:0; padding:0; list-style:none; }
button{ font-family:inherit; }
table{ border-collapse:collapse; }

/* visible, consistent focus ring everywhere */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible{
  outline:3px solid var(--sgf-blue);
  outline-offset:2px;
  border-radius:4px;
}
a:focus:not(:focus-visible),
button:focus:not(:focus-visible){ outline:none; }
/* on dark chrome the blue ring can vanish; use white there */
.st-bar a:focus-visible,
.st-bar button:focus-visible,
.st-bar select:focus-visible,
.hp-hero a:focus-visible,
.hp-hero input:focus-visible,
.hp-hero button:focus-visible{
  outline-color:#fff;
}

.sr-only{
  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:8px; top:-56px;
  background:var(--sgf-navy);
  color:#fff;
  padding:.75em 1.25em;
  border-radius:0 0 8px 8px;
  z-index:1000;
  transition:top .15s ease;
  font-weight:600;
}
.skip-link:focus{ top:0; }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *, *::before, *::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
}

[id]{ scroll-margin-top:96px; }

.container{ max-width:var(--maxw); margin-inline:auto; padding-inline:1.25rem; }
@media (min-width:640px){ .container{ padding-inline:2rem; } }

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5em;
  font-weight:700; font-size:1rem; line-height:1.2;
  padding:.85em 1.5em; border-radius:999px; border:2px solid transparent;
  cursor:pointer; text-decoration:none; min-height:48px;
  transition:transform var(--dur-sm) var(--ease-out), box-shadow var(--dur-sm) var(--ease-out),
             background var(--dur-sm) var(--ease-out), border-color var(--dur-sm) var(--ease-out);
}
.btn-primary{ background:var(--sgf-lime); color:#033850; border-color:var(--sgf-lime); box-shadow:var(--shadow-sm); }
.btn-primary:hover{ background:#C7D845; border-color:#C7D845; transform:translateY(-2px); box-shadow:var(--shadow-md); }
.btn-primary:active{ transform:translateY(0) scale(.98); }
.btn-secondary{ background:transparent; color:#fff; border-color:rgba(255,255,255,.75); }
.btn-secondary:hover{ background:rgba(255,255,255,.14); transform:translateY(-2px); border-color:#fff; }
.btn-secondary:active{ transform:translateY(0) scale(.98); }
.btn-outline{ background:#fff; color:var(--sgf-navy); border-color:var(--sgf-line); }
.btn-outline:hover{ border-color:var(--sgf-blue); color:var(--sgf-blue); transform:translateY(-2px); box-shadow:var(--shadow-sm); }
.btn-outline:active{ transform:translateY(0) scale(.98); }

/* pill "quiet" action, large-hub outlined card buttons */
.pill-link{
  display:inline-flex; align-items:center; justify-content:center; gap:.5em;
  border:1.5px solid var(--sgf-line); border-radius:999px;
  padding:.7em 1.3em; font-weight:700; font-size:.92rem; color:var(--sgf-navy);
  text-decoration:none; min-height:44px; background:#fff;
  transition:border-color var(--dur-sm) var(--ease-out), color var(--dur-sm) var(--ease-out),
             transform var(--dur-sm) var(--ease-out), box-shadow var(--dur-sm) var(--ease-out);
}
.pill-link svg{ width:16px; height:16px; transition:transform var(--dur-sm) var(--ease-out); }
.pill-link:hover{ border-color:var(--sgf-blue); color:var(--sgf-blue); box-shadow:var(--shadow-sm); }
.pill-link:hover svg{ transform:translateX(3px); }
.pill-link:active{ transform:scale(.98); }

/* =====================================================================
   AIRLINE MARKS — constructed inline SVG marks for Delta, American,
   United and Allegiant. Third-party trademarks, shown for illustration
   only inside this concept demo (noted in the footer disclaimer docs).
   Rendered small and always beside the airline's name in text.
   ===================================================================== */
.airline-cell{ display:inline-flex; align-items:center; gap:.45em; min-width:0; }
.airline-mark{ width:17px; height:17px; flex:none; display:inline-block; }

/* =====================================================================
   SHARED SITE CHROME (st-) — floating translucent bar, both pages
   ===================================================================== */
.st-header{
  position:sticky; top:0; z-index:80;
  padding:.65rem 1rem 0;
  pointer-events:none; /* restored on the bar itself */
}
.st-bar{
  pointer-events:auto;
  max-width:1280px; margin-inline:auto;
  display:flex; flex-wrap:wrap; align-items:center; gap:.4rem 1rem;
  padding:.5rem .75rem .5rem 1.1rem;
  border-radius:18px;
  background:linear-gradient(105deg, rgba(6,42,60,.96) 0%, rgba(0,70,107,.93) 45%, rgba(18,114,159,.9) 100%);
  color:#fff;
  box-shadow:0 18px 40px -18px rgba(6,42,60,.55), 0 2px 8px rgba(6,42,60,.18),
             inset 0 1px 0 rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.08);
}
@supports (backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px)){
  .st-bar{
    background:linear-gradient(105deg, rgba(6,42,60,.88) 0%, rgba(0,70,107,.82) 45%, rgba(18,114,159,.76) 100%);
    -webkit-backdrop-filter:saturate(150%) blur(16px);
    backdrop-filter:saturate(150%) blur(16px);
  }
}

.st-wordmark{ display:flex; align-items:center; gap:.6rem; text-decoration:none; margin-right:auto; min-width:0; flex:0 1 auto; overflow:hidden; }
.st-wordmark-mark{ width:34px; height:34px; color:var(--sgf-lime); flex:none; }
.st-wordmark-text{ display:flex; flex-direction:column; line-height:1.06; min-width:0; }
.st-wordmark-site{ font-weight:800; font-size:1.06rem; color:#fff; white-space:nowrap; letter-spacing:-.01em; }
.st-wordmark-code{ font-size:.64rem; font-weight:700; letter-spacing:.09em; color:#A9C1D6; white-space:nowrap; text-transform:uppercase; overflow:hidden; text-overflow:ellipsis; }

/* --- primary nav (desktop) --- */
.st-nav{ display:none; }
.st-nav > ul{ display:flex; align-items:center; gap:.15rem; }
.st-nav a, .st-nav-btn{
  display:inline-flex; align-items:center; gap:.4em;
  color:#fff; text-decoration:none; font-weight:600; font-size:.97rem;
  padding:.65em .85em; border-radius:10px; background:transparent; border:0; cursor:pointer;
  transition:background var(--dur-sm) var(--ease-out);
  white-space:nowrap;
}
.st-nav a:hover, .st-nav-btn:hover{ background:rgba(255,255,255,.12); }
.st-nav-btn .st-caret{ width:14px; height:14px; transition:transform var(--dur-sm) var(--ease-out); opacity:.8; }
.st-nav-btn[aria-expanded="true"] .st-caret{ transform:rotate(180deg); }
.st-nav-item{ position:relative; }

.st-menu{
  position:absolute; top:calc(100% + 10px); left:0; min-width:250px;
  background:#fff; border-radius:14px; box-shadow:var(--shadow-lg);
  border:1px solid var(--hairline);
  padding:.5rem; z-index:90;
}
.st-menu[hidden]{ display:none; }
@media (prefers-reduced-motion: no-preference){
  .st-menu{ animation:st-menu-in .22s var(--ease-out); }
}
@keyframes st-menu-in{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:none; } }
.st-menu a{
  display:flex; align-items:center; gap:.6em;
  color:var(--sgf-ink); text-decoration:none; font-weight:600; font-size:.94rem;
  padding:.6em .75em; border-radius:9px;
  transition:background var(--dur-sm) var(--ease-out), color var(--dur-sm) var(--ease-out);
}
.st-menu a:hover{ background:var(--sgf-sky); color:var(--sgf-navy); }
.st-menu a svg{ width:16px; height:16px; color:var(--sgf-blue); flex:none; }
.st-menu-sep{ height:1px; background:var(--hairline); margin:.4rem .5rem; }

/* accessibility gets a top-level plain link, kept prominent */
.st-nav a.st-nav-a11y svg{ width:15px; height:15px; color:var(--sgf-lime); }

/* --- right tools: search pill + language + burger --- */
.st-tools{ display:flex; align-items:center; gap:.5rem; flex:none; }
.st-search{
  display:inline-flex;
  width:42px; height:42px; padding:0; justify-content:center;
  align-items:center; gap:.5em;
  background:rgba(255,255,255,.13); color:#fff; border:1px solid rgba(255,255,255,.28);
  font-weight:700; font-size:.92rem;
  border-radius:999px; min-height:42px; cursor:pointer;
  transition:background var(--dur-sm) var(--ease-out), border-color var(--dur-sm) var(--ease-out);
}
.st-search svg{ width:18px; height:18px; flex:none; }
.st-search:hover{ background:rgba(255,255,255,.24); border-color:rgba(255,255,255,.5); }

.st-lang{ position:relative; }
.st-lang-select{
  appearance:none; -webkit-appearance:none;
  background:rgba(255,255,255,.13) url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat right .55rem center/13px 13px;
  border:1px solid rgba(255,255,255,.28); color:#fff; font-weight:700;
  border-radius:999px; padding:.5em 1.75rem .5em .85em; min-height:42px; cursor:pointer;
  font-size:.85rem; max-width:118px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  transition:background var(--dur-sm) var(--ease-out), border-color var(--dur-sm) var(--ease-out);
}
.st-lang-select:hover{ background-color:rgba(255,255,255,.24); border-color:rgba(255,255,255,.5); }
.st-lang-select option{ color:var(--sgf-ink); background:#fff; }

.st-burger{
  display:inline-flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.13); border:1px solid rgba(255,255,255,.28); color:#fff;
  border-radius:12px; cursor:pointer; width:42px; height:42px; flex:none;
  transition:background var(--dur-sm) var(--ease-out);
}
.st-burger:hover{ background:rgba(255,255,255,.24); }
.st-burger:active{ transform:scale(.95); }
.st-burger svg{ width:20px; height:20px; }

@media (max-width:479px){
  .st-bar{ padding-left:.8rem; gap:.3rem .5rem; }
  .st-lang-select{ max-width:88px; font-size:.78rem; padding:.45em 1.5rem .45em .6em; min-height:38px; }
  .st-search{ width:38px; height:38px; }
  .st-burger{ width:38px; height:38px; border-radius:10px; }
  .st-wordmark-mark{ width:28px; height:28px; }
  .st-wordmark-site{ font-size:.98rem; }
  .st-wordmark-code{ display:none; }
}

/* --- mobile expanding panel inside the floating bar --- */
.st-mobile{ display:none; width:100%; }
.st-mobile.is-open{ display:block; order:20; }
.st-mobile-inner{ padding:.5rem .25rem .75rem; border-top:1px solid rgba(255,255,255,.16); margin-top:.6rem; }
.st-acc{ border-radius:12px; overflow:hidden; }
.st-acc + .st-acc{ margin-top:.15rem; }
.st-acc-btn{
  display:flex; width:100%; align-items:center; justify-content:space-between; gap:.5em;
  background:transparent; border:0; color:#fff; cursor:pointer;
  font-weight:700; font-size:1rem; padding:.8em .75em; border-radius:12px; text-align:left;
  transition:background var(--dur-sm) var(--ease-out);
}
.st-acc-btn:hover{ background:rgba(255,255,255,.1); }
.st-acc-btn .st-caret{ width:16px; height:16px; transition:transform var(--dur-sm) var(--ease-out); opacity:.75; flex:none; }
.st-acc-btn[aria-expanded="true"] .st-caret{ transform:rotate(180deg); }
.st-acc-panel{ padding:.1rem .35rem .5rem; }
.st-acc-panel[hidden]{ display:none; }
.st-acc-panel a{
  display:flex; align-items:center; gap:.6em;
  color:#DCE8F3; text-decoration:none; font-weight:600; font-size:.95rem;
  padding:.68em .85em; border-radius:9px;
  transition:background var(--dur-sm) var(--ease-out), color var(--dur-sm) var(--ease-out);
}
.st-acc-panel a:hover{ background:rgba(255,255,255,.12); color:#fff; }
.st-acc-panel a svg{ width:16px; height:16px; color:var(--sgf-lime); flex:none; }
.st-mobile-links a{
  display:flex; align-items:center; gap:.6em;
  color:#fff; text-decoration:none; font-weight:700; font-size:1rem;
  padding:.8em .75em; border-radius:12px;
  transition:background var(--dur-sm) var(--ease-out);
}
.st-mobile-links a:hover{ background:rgba(255,255,255,.1); }
.st-mobile-links a svg{ width:16px; height:16px; color:var(--sgf-lime); flex:none; }

.st-search-label{ display:none; }
@media (min-width:1020px){
  .st-nav{ display:block; }
  .st-burger{ display:none; }
  .st-search{ width:auto; height:auto; padding:.55em 1.15em; justify-content:flex-start; }
  .st-search-label{ display:inline; }
}

/* --- search panel that drops below the floating bar --- */
.st-search-panel{
  pointer-events:auto;
  max-width:1280px; margin:.5rem auto 0;
  background:#fff; border-radius:16px; box-shadow:var(--shadow-lg); border:1px solid var(--hairline);
  padding:1rem 1.1rem;
}
.st-search-panel[hidden]{ display:none; }
@media (prefers-reduced-motion: no-preference){
  .st-search-panel{ animation:st-menu-in .25s var(--ease-out); }
}
.st-search-form{ display:flex; gap:.6rem; align-items:flex-end; flex-wrap:wrap; }
.st-search-form .hp-field{ flex:1 1 240px; }
.st-search-form label{ display:block; font-size:.85rem; font-weight:700; margin-bottom:.3em; color:var(--sgf-navy); }
.st-search-form input{
  width:100%; padding:.65em 1em; border:2px solid var(--sgf-line); border-radius:999px; font-size:1rem; min-height:46px;
}
.st-search-form input:focus-visible{ border-color:var(--sgf-blue); outline-offset:1px; }

/* =====================================================================
   HOMEPAGE (hp-)
   ===================================================================== */

/* ---- scroll reveal: content is ALWAYS visible by default. Only when
   JS confirms IntersectionObserver support AND motion is allowed does
   the html.js-reveal class arm the hidden initial state; app.js also
   force-reveals everything on load fallback and pagehide, so a screenshot,
   print or a JS failure can never leave content invisible. ---- */
.hp-reveal{ opacity:1; transform:none; }
@media (prefers-reduced-motion: no-preference){
  html.js-reveal .hp-reveal{
    opacity:0; transform:translateY(22px);
    transition:opacity .65s var(--ease-out), transform .65s var(--ease-out);
    transition-delay:calc(var(--hp-i, 0) * 80ms);
  }
  html.js-reveal .hp-reveal.is-in{ opacity:1; transform:none; }
}
.hp-stagger > :nth-child(1){ --hp-i:0; } .hp-stagger > :nth-child(2){ --hp-i:1; }
.hp-stagger > :nth-child(3){ --hp-i:2; } .hp-stagger > :nth-child(4){ --hp-i:3; }
.hp-stagger > :nth-child(5){ --hp-i:4; } .hp-stagger > :nth-child(6){ --hp-i:5; }

/* ---- alert banner ---- */
.hp-alert-bar{
  background:var(--sgf-slate-dark);
  color:#fff;
  border-bottom:2px solid var(--sgf-sage);
  position:relative; z-index:81;
}
.hp-alert-inner{
  max-width:var(--maxw); margin-inline:auto; padding:.6rem 1.25rem;
  display:flex; align-items:flex-start; gap:.75rem;
}
.hp-alert-icon{ flex:none; width:20px; height:20px; margin-top:2px; color:var(--sgf-lime); }
.hp-alert-text{ flex:1 1 auto; margin:0; font-size:.9rem; }
.hp-alert-dismiss{
  flex:none; background:transparent; border:2px solid transparent; color:#fff;
  width:34px; height:34px; border-radius:8px; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
.hp-alert-dismiss:hover{ background:rgba(255,255,255,.15); }
.hp-alert-dismiss svg{ width:16px; height:16px; }
.hp-alert-bar[hidden]{ display:none; }

/* ---- hero: photo with diagonal navy panel, floating nav overlaps ---- */
.hp-hero{
  position:relative; overflow:hidden; color:#fff;
  background:linear-gradient(115deg, var(--deep-1) 0%, var(--deep-2) 48%, var(--deep-3) 100%);
  margin-top:calc(-1 * (var(--header-h) + 1rem));
  padding-top:calc(var(--header-h) + 1rem);
  border-radius:0 0 28px 28px;
  box-shadow:var(--shadow-lg);
}
.hp-hero-media{ position:relative; }
.hp-hero-photo{
  width:100%; aspect-ratio:16/10; object-fit:cover; object-position:center 40%; display:block;
}
.hp-hero-media::after{
  content:""; position:absolute; inset:auto 0 0 0; height:46%;
  background:linear-gradient(0deg, var(--deep-2) 4%, rgba(6,42,60,0) 100%);
  pointer-events:none;
}
.hp-hero-fan{ display:none; }
.hp-hero-content{
  position:relative; z-index:2; max-width:var(--maxw); margin-inline:auto;
  padding:1.4rem 1.25rem 2.4rem;
}
.hp-hero-eyebrow{
  text-transform:lowercase; letter-spacing:.02em; font-size:1.05rem; font-weight:700;
  color:var(--sgf-lime); margin-bottom:.35rem;
}
.hp-hero-heading{
  font-size:var(--fs-hero); max-width:14ch; margin-bottom:.4em;
  letter-spacing:-.02em; font-weight:800; text-wrap:balance;
  line-height:1.06;
}
.hp-hero-sub{ font-size:var(--fs-lede); max-width:44ch; color:#DCE8F3; margin-bottom:1.5em; line-height:1.55; }

/* hero action row: white search pill + gold CTA, large-hub pattern */
.hp-hero-actions{ display:flex; flex-wrap:wrap; gap:.8rem; align-items:center; margin-bottom:1.6rem; }
.hp-hero-search{
  display:flex; align-items:center; gap:.6em; flex:1 1 260px; max-width:430px;
  background:#fff; border-radius:999px; padding:.35em .5em .35em 1.15em;
  box-shadow:var(--shadow-md);
}
.hp-hero-search svg{ width:19px; height:19px; color:var(--sgf-navy); flex:none; }
.hp-hero-search input{
  flex:1 1 auto; min-width:0; border:0; background:transparent; font-size:1rem; color:var(--sgf-ink);
  padding:.55em 0; min-height:44px;
}
.hp-hero-search input::placeholder{ color:var(--sgf-slate); }
.hp-hero-search input:focus{ outline:none; }
.hp-hero-search:focus-within{ outline:3px solid #fff; outline-offset:3px; border-radius:999px; }
.hp-hero-search-btn{
  flex:none; background:var(--sgf-sky); color:var(--sgf-navy); border:0; cursor:pointer;
  width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  transition:background var(--dur-sm) var(--ease-out);
}
.hp-hero-search-btn:hover{ background:#d8e6f3; }
.hp-hero-search-btn svg{ width:17px; height:17px; }

.hp-hero-facts{ display:flex; flex-wrap:wrap; gap:1.1rem 2rem; padding-top:1.25rem; border-top:1px solid rgba(255,255,255,.2); }
.hp-hero-fact{ display:flex; align-items:baseline; gap:.5em; }
.hp-hero-fact strong{ font-family:var(--sgf-font-mono); font-size:1.3rem; font-weight:700; color:var(--sgf-lime); font-variant-numeric:tabular-nums; }
.hp-hero-fact span{ font-size:.8rem; color:#A9C1D6; letter-spacing:.02em; }

@media (prefers-reduced-motion: no-preference){
  .hp-hero-eyebrow{ animation:hp-fade-up .7s var(--ease-out) both; }
  .hp-hero-heading{ animation:hp-fade-up .8s var(--ease-out) .08s both; }
  .hp-hero-sub{ animation:hp-fade-up .8s var(--ease-out) .16s both; }
  .hp-hero-actions{ animation:hp-fade-up .8s var(--ease-out) .24s both; }
  .hp-hero-facts{ animation:hp-fade-up .8s var(--ease-out) .32s both; }
  .hp-hero-photo{ animation:hp-hero-zoom 2.2s var(--ease-out) both; }
}
@keyframes hp-fade-up{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:none; } }
@keyframes hp-hero-zoom{ from{ transform:scale(1.045); } to{ transform:none; } }

/* desktop: diagonal split, text panel left over gradient, photo right */
@media (min-width:880px){
  .hp-hero{ border-radius:0 0 32px 32px; }
  .hp-hero-media{ position:absolute; inset:0; z-index:0; }
  .hp-hero-photo{
    position:absolute; right:0; top:0; height:100%; width:63%; aspect-ratio:auto;
    clip-path:polygon(17% 0, 100% 0, 100% 100%, 0 100%);
    object-position:center 18%;
  }
  .hp-hero-media::after{
    inset:0; height:auto;
    background:linear-gradient(97deg, var(--deep-2) 39.5%, rgba(6,42,60,.18) 52%, rgba(6,42,60,0) 66%);
  }
  /* subtle fan motif on the gradient panel, large-hub style, decorative */
  .hp-hero-fan{
    display:block; position:absolute; left:-60px; bottom:-80px; width:520px; height:520px;
    color:rgba(255,255,255,.05); pointer-events:none; z-index:1;
  }
  .hp-hero-content{ padding:4.5rem 2rem 4.25rem; max-width:var(--maxw); }
  .hp-hero-heading{ max-width:13ch; }
  .hp-hero-sub{ max-width:38ch; }
  .hp-hero-facts{ max-width:560px; }
}
@media (min-width:1280px){
  .hp-hero-content{ padding:5.5rem 2rem 5rem; }
}

/* hero Departures / Arrivals quick buttons beside the search pill */
.hp-hero-quick{ display:flex; gap:.6rem; flex-wrap:wrap; }
.hp-hero-quick .btn{ padding:.75em 1.25em; }

/* ---- "I am" persona selector: journey-based quick links ---- */
.hp-persona{
  background:var(--card); border-radius:var(--card-radius); box-shadow:var(--shadow-md);
  border:1px solid rgba(255,255,255,.6);
  padding:1.1rem 1.25rem 1.2rem; margin-bottom:var(--sp-sm);
}
.hp-persona-head{ display:flex; align-items:center; gap:.9rem; flex-wrap:wrap; margin-bottom:.9rem; }
.hp-persona-label{
  font-weight:800; color:var(--sgf-navy); font-size:1.12rem; letter-spacing:-.01em; flex:none;
}
.hp-persona-tabs{ display:flex; gap:.4rem; flex-wrap:wrap; }
.hp-persona-tab{
  border:1.5px solid var(--sgf-line); background:#fff; color:var(--sgf-navy);
  font-weight:700; font-size:.9rem; border-radius:999px; padding:.55em 1.1em;
  min-height:42px; cursor:pointer;
  transition:background var(--dur-sm) var(--ease-out), color var(--dur-sm) var(--ease-out),
             border-color var(--dur-sm) var(--ease-out), transform var(--dur-sm) var(--ease-out);
}
.hp-persona-tab:hover{ border-color:var(--sgf-blue); color:var(--sgf-blue); }
.hp-persona-tab:active{ transform:scale(.97); }
.hp-persona-tab[aria-selected="true"]{ background:var(--sgf-navy); border-color:var(--sgf-navy); color:#fff; }
.hp-persona-panel{ display:flex; flex-wrap:wrap; gap:.55rem; }
.hp-persona-panel[hidden]{ display:none; }
@media (prefers-reduced-motion: no-preference){
  .hp-persona-panel:not([hidden]) .hp-persona-link{ animation:hp-fade-up .45s var(--ease-out) both; animation-delay:calc(var(--p-i, 0) * 45ms); }
}
.hp-persona-panel > :nth-child(1){ --p-i:0; } .hp-persona-panel > :nth-child(2){ --p-i:1; }
.hp-persona-panel > :nth-child(3){ --p-i:2; } .hp-persona-panel > :nth-child(4){ --p-i:3; }
.hp-persona-panel > :nth-child(5){ --p-i:4; }
.hp-persona-link{
  display:inline-flex; align-items:center; gap:.5em;
  background:var(--sgf-sky); color:var(--sgf-navy); text-decoration:none;
  font-weight:700; font-size:.92rem; border-radius:999px; padding:.6em 1.1em; min-height:44px;
  border:1px solid transparent;
  transition:background var(--dur-sm) var(--ease-out), transform var(--dur-sm) var(--ease-out),
             box-shadow var(--dur-sm) var(--ease-out);
}
.hp-persona-link svg{ width:17px; height:17px; color:var(--sgf-blue); flex:none; }
.hp-persona-link:hover{ background:#CBE2F0; transform:translateY(-2px); box-shadow:var(--shadow-sm); }
.hp-persona-link:active{ transform:translateY(0) scale(.98); }

/* ---- live widget row: the two configurable cards + concept caption ---- */
.hp-widgets{ position:relative; z-index:3; margin-top:-1.75rem; padding-bottom:var(--sp-md); }
.hp-widgets-grid{ display:grid; grid-template-columns:1fr; gap:var(--sp-sm); }
@media (min-width:880px){
  .hp-widgets{ margin-top:-2.5rem; }
  .hp-widgets-grid{ grid-template-columns:1fr 1fr; gap:var(--sp-md); }
}
.hp-widget{
  background:var(--card); border-radius:var(--card-radius); box-shadow:var(--shadow-md);
  padding:var(--sp-md); border:1px solid rgba(255,255,255,.6);
  display:flex; flex-direction:column;
}
.hp-widget-head{ display:flex; align-items:center; justify-content:space-between; gap:.75rem; margin-bottom:.9rem; }
.hp-widget-head h2{ font-size:1.28rem; color:var(--sgf-navy); margin:0; letter-spacing:-.01em; }
.hp-widget-live{
  display:inline-flex; align-items:center; gap:.45em; flex:none;
  color:var(--sgf-slate); font-size:.75rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase;
}
.hp-widget-live-dot{ width:8px; height:8px; border-radius:50%; background:var(--sgf-sage); flex:none; }
@media (prefers-reduced-motion: no-preference){
  .hp-widget-live-dot{ animation:hp-pulse 2.2s ease-in-out infinite; }
}
@keyframes hp-pulse{ 0%,100%{ opacity:1; transform:scale(1); } 50%{ opacity:.45; transform:scale(.8); } }

.hp-lot-list{ display:flex; flex-direction:column; }
.hp-lot{
  display:flex; align-items:center; justify-content:space-between; gap:.75rem;
  padding:.7em .15em; border-bottom:1px solid var(--hairline);
}
.hp-lot:last-child{ border-bottom:0; }
.hp-lot-name{ font-weight:700; color:var(--sgf-ink); font-size:.97rem; }
.hp-lot-note{ display:block; font-weight:500; color:var(--sgf-slate); font-size:.8rem; }
.hp-lot-status{
  display:inline-flex; align-items:center; gap:.4em; font-weight:800; font-size:.9rem;
  padding:.25em .7em .25em .45em; border-radius:999px; flex:none;
}
.hp-lot-status svg{ width:15px; height:15px; flex:none; }
.hp-lot-status--open{ color:var(--sgf-ontime); background:rgba(27,107,58,.1); }
.hp-lot-status--full{ color:var(--sgf-cancel); background:rgba(161,27,36,.1); }

.hp-dep-list{ display:flex; flex-direction:column; }
.hp-dep{
  display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:.35rem .8rem;
  padding:.62em .15em; border-bottom:1px solid var(--hairline);
}
.hp-dep:last-child{ border-bottom:0; }
.hp-dep-time{ font-family:var(--sgf-font-mono); font-weight:700; color:var(--sgf-navy); font-variant-numeric:tabular-nums; font-size:.94rem; }
.hp-dep-city{ min-width:0; }
.hp-dep-city strong{ display:block; font-size:.95rem; color:var(--sgf-ink); font-weight:700; line-height:1.3; }
@media (min-width:880px){ .hp-dep-city strong{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } }
.hp-dep-city span{ display:flex; align-items:center; gap:.4em; color:var(--sgf-slate); font-size:.79rem; white-space:nowrap; }
.hp-dep-city .airline-mark{ width:14px; height:14px; }

.hp-widget-foot{ margin-top:auto; padding-top:1rem; display:flex; align-items:center; justify-content:space-between; gap:.75rem; flex-wrap:wrap; }
.hp-widget-updated{ color:var(--sgf-slate); font-size:.8rem; margin:0; }

/* parking donut rings: percentage + text pill, never color alone */
.hp-donut-row{ display:grid; grid-template-columns:repeat(3,1fr); gap:.75rem; }
.hp-donut-cell{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:.45rem; padding:.4rem 0; }
.hp-donut{ position:relative; width:86px; height:86px; }
.hp-donut svg{ width:86px; height:86px; transform:rotate(-90deg); }
.hp-donut-track{ fill:none; stroke:#E3EAEF; stroke-width:4.4; }
.hp-donut-val{ fill:none; stroke-width:4.4; stroke-linecap:round; transition:stroke-dasharray .9s var(--ease-out); }
.hp-donut--open .hp-donut-val{ stroke:var(--sgf-ontime); }
.hp-donut--almost .hp-donut-val{ stroke:var(--sgf-delayed); }
.hp-donut--full .hp-donut-val{ stroke:var(--sgf-cancel); }
.hp-donut-pct{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-family:var(--sgf-font-mono); font-weight:700; font-size:1rem; color:var(--sgf-navy);
  font-variant-numeric:tabular-nums;
}
.hp-donut-name{ font-weight:700; color:var(--sgf-ink); font-size:.88rem; line-height:1.25; }
.hp-donut-note{ color:var(--sgf-slate); font-size:.74rem; line-height:1.35; }
.hp-lot-status{ 
  display:inline-flex; align-items:center; gap:.35em; font-weight:800; font-size:.78rem;
  padding:.28em .7em .28em .5em; border-radius:999px; flex:none;
}
.hp-lot-status svg{ width:14px; height:14px; flex:none; }
.hp-lot-status--open{ color:var(--sgf-ontime); background:rgba(27,107,58,.1); }
.hp-lot-status--almost{ color:var(--sgf-delayed); background:rgba(154,74,0,.12); }
.hp-lot-status--full{ color:var(--sgf-cancel); background:rgba(161,27,36,.1); }
@media (max-width:419px){
  .hp-donut{ width:74px; height:74px; }
  .hp-donut svg{ width:74px; height:74px; }
}

/* the visible concept caption: a deliberate design element, not a footnote */
.hp-widgets-note{
  margin-top:var(--sp-sm);
  background:linear-gradient(105deg, rgba(184,202,46,.1), rgba(0,92,134,.06));
  border:1px dashed rgba(140,160,28,.55);
  border-radius:14px; padding:.9rem 1.1rem;
  display:flex; gap:.7rem; align-items:flex-start;
}
.hp-widgets-note svg{ width:19px; height:19px; flex:none; color:var(--sgf-blue); margin-top:.15em; }
.hp-widgets-note p{ margin:0; font-size:.88rem; color:#3c4c5c; max-width:110ch; }
.hp-widgets-note strong{ color:var(--sgf-navy); }

/* ---- section rhythm ---- */
.hp-section{ padding:var(--sp-xl) 0; }
.hp-section-head{ margin-bottom:var(--sp-lg); }
.hp-section-head h2{ font-size:var(--fs-display); color:var(--sgf-navy); letter-spacing:-.015em; }
.hp-section-lede{ color:var(--sgf-slate); max-width:66ch; font-size:var(--fs-lede); }

/* ---- flight board ---- */
.hp-flights{ padding-top:var(--sp-lg); }
.hp-flights-head{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:1rem; margin-bottom:var(--sp-md); }
.hp-flights-head h2{ font-size:var(--fs-display); color:var(--sgf-navy); letter-spacing:-.015em; margin:0; }
.hp-badge-sample{
  display:inline-flex; align-items:center; gap:.4em;
  background:#FFF6E0; color:#6b4f00; border:1px solid #E7C766;
  font-size:.8rem; font-weight:700; padding:.35em .75em; border-radius:999px;
}
.hp-badge-sample svg{ width:14px; height:14px; }

.hp-flightboard{
  border-radius:var(--card-radius); overflow:hidden; background:var(--card);
  box-shadow:var(--shadow-md); border:1px solid rgba(255,255,255,.6);
}
.hp-tablist{ display:flex; gap:.4rem; padding:.9rem .9rem 0; background:var(--card); }
.hp-tab{
  flex:0 1 auto; background:transparent; border:0;
  padding:.7em 1.35em; font-size:.98rem; font-weight:700; color:var(--sgf-slate); cursor:pointer;
  min-height:48px; display:flex; align-items:center; gap:.5em;
  border-radius:999px; position:relative;
  transition:color var(--dur-sm) var(--ease-out), background var(--dur-sm) var(--ease-out);
}
.hp-tab svg{ width:17px; height:17px; }
.hp-tab[aria-selected="true"]{ color:#fff; background:var(--sgf-navy); box-shadow:var(--shadow-sm); }
.hp-tab[aria-selected="false"]:hover{ color:var(--sgf-navy); background:var(--sgf-sky); }

.hp-tabpanel{ padding:1rem 1.1rem 1.3rem; }
.hp-tabpanel[hidden]{ display:none; }
@media (prefers-reduced-motion: no-preference){
  .hp-tabpanel:not([hidden]){ animation:hp-panel-in .35s var(--ease-out); }
  .hp-flight-table tbody tr{ animation:hp-row-in .5s var(--ease-out) both; animation-delay:calc(var(--row-i, 0) * 45ms); }
}
@keyframes hp-panel-in{ from{ opacity:0; } to{ opacity:1; } }
@keyframes hp-row-in{ from{ opacity:0; transform:translateY(7px); } to{ opacity:1; transform:none; } }
.hp-flight-table tbody tr.hp-row-still{ animation:none; }

.hp-table-scroll{ overflow-x:auto; border-radius:10px; }
.hp-flight-table{ width:100%; min-width:640px; border-collapse:collapse; font-size:.95rem; }
.hp-flight-table caption{ text-align:left; padding-bottom:.5em; color:var(--sgf-slate); font-size:.85rem; }
.hp-flight-table th, .hp-flight-table td{ text-align:left; padding:.68em .7em; border-bottom:1px solid var(--hairline); white-space:nowrap; }
.hp-flight-table thead th{
  color:var(--sgf-navy); font-size:.72rem; text-transform:uppercase; letter-spacing:.07em;
  border-bottom:2px solid var(--sgf-line); background:transparent;
}
.hp-flight-table tbody tr:last-child td{ border-bottom:0; }
.hp-flight-table tbody tr{ transition:background var(--dur-sm) var(--ease-out); }
.hp-flight-table tbody tr:hover{ background:var(--sgf-sky); }
.hp-flight-table tbody tr.hp-row-hidden{ display:none; }
.hp-flight-table td.hp-col-city{ white-space:normal; }
.hp-flight-table td.hp-col-flight, .hp-flight-table td.hp-col-time, .hp-flight-table td.hp-col-gate{
  font-family:var(--sgf-font-mono); font-variant-numeric:tabular-nums; font-weight:600; color:var(--sgf-navy);
}
.hp-flight-empty{ color:var(--sgf-slate); font-style:italic; padding:1rem .7em; }

.hp-status{
  display:inline-flex; align-items:center; gap:.4em; font-weight:700;
  padding:.28em .65em .28em .35em; border-radius:999px; font-size:.87rem;
}
.hp-status svg{ width:15px; height:15px; flex:none; }
.hp-status-ontime{ color:var(--sgf-ontime); background:rgba(27,107,58,.1); }
.hp-status-delayed{ color:var(--sgf-delayed); background:rgba(154,74,0,.1); }
.hp-status-cancelled{ color:var(--sgf-cancel); background:rgba(161,27,36,.1); }
.hp-status-boarding{ color:var(--sgf-blue); background:rgba(22,104,179,.1); }
.hp-status-landed{ color:var(--sgf-ontime); background:rgba(27,107,58,.1); }

.hp-board-foot{ display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-top:1rem; }
.hp-filter-status{ color:var(--sgf-slate); font-size:.85rem; margin:0; }

.hp-board-controls{
  display:flex; align-items:center; justify-content:space-between; gap:.75rem; flex-wrap:wrap;
  padding:.85rem 1.1rem 0;
}
.hp-board-asof{ margin:0; color:var(--sgf-slate); font-size:.82rem; font-variant-numeric:tabular-nums; }
.pill-link--warn{ border-color:#E7C766; color:#6b4f00; background:#FFFBEF; font-size:.82rem; min-height:38px; padding:.5em 1em; }
.pill-link--warn:hover{ border-color:#C9A227; color:#5a4200; }
.pill-link--warn[aria-pressed="true"]{ background:#6b4f00; color:#fff; border-color:#6b4f00; }
.hp-degraded{
  display:flex; gap:.6rem; align-items:flex-start;
  margin:.75rem 1.1rem 0; padding:.8rem 1rem; border-radius:12px;
  background:#FCF4E4; border:1px solid #E7C766; color:#6b4f00; font-size:.9rem; font-weight:600;
}
.hp-degraded svg{ width:18px; height:18px; flex:none; margin-top:.1em; }
.hp-flightboard.is-degraded .hp-flight-table tbody{ opacity:.55; }
.hp-flightboard.is-degraded .hp-tab{ }

/* ---- journey cards ---- */
.hp-journey-intro{ display:flex; flex-direction:column; gap:var(--sp-lg); margin-bottom:var(--sp-lg); }
.hp-journey-intro-photo{
  border-radius:var(--card-radius); overflow:hidden; box-shadow:var(--shadow-md); position:relative;
  min-height:160px;
}
.hp-journey-intro-photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.hp-journey-intro-caption{
  position:absolute; left:0; right:0; bottom:0; padding:1rem 1.1rem;
  background:linear-gradient(0deg, rgba(6,42,60,.82) 0%, rgba(6,42,60,0) 100%);
  color:#fff; font-size:.85rem; font-weight:600;
}
@media (min-width:860px){
  .hp-journey-intro{ flex-direction:row; align-items:flex-end; justify-content:space-between; gap:var(--sp-xl); }
  .hp-journey-intro-text{ max-width:46ch; flex:1 1 auto; }
  .hp-journey-intro-photo{ width:340px; height:200px; flex:none; }
}

.hp-journey-grid{ display:grid; grid-template-columns:1fr; gap:var(--sp-sm); }
.hp-journey-card{
  display:flex; flex-direction:column; gap:.6rem;
  background:var(--card); border:1px solid rgba(255,255,255,.6); border-radius:var(--card-radius);
  padding:var(--sp-md); text-decoration:none; color:var(--sgf-ink);
  min-height:44px; box-shadow:var(--shadow-sm);
  transition:transform var(--dur-sm) var(--ease-out), box-shadow var(--dur-sm) var(--ease-out);
}
.hp-journey-card:hover{ box-shadow:var(--shadow-md); transform:translateY(-4px); }
.hp-journey-card:active{ transform:translateY(-1px); }
.hp-journey-icon{
  width:48px; height:48px; border-radius:14px; background:var(--sgf-sky); color:var(--sgf-blue);
  display:flex; align-items:center; justify-content:center; flex:none;
  transition:transform var(--dur-sm) var(--ease-out), background var(--dur-sm) var(--ease-out);
}
.hp-journey-card:hover .hp-journey-icon{ transform:scale(1.08) rotate(-3deg); }
.hp-journey-icon svg{ width:24px; height:24px; }
.hp-journey-title{ font-size:var(--fs-h3); font-weight:800; color:var(--sgf-navy); margin:0; letter-spacing:-.01em; }
.hp-journey-desc{ margin:0; color:var(--sgf-slate); font-size:.92rem; }

.hp-journey-feature{
  flex-direction:row; align-items:center; gap:1.4rem;
  background:linear-gradient(135deg, var(--deep-1) 0%, #123F52 55%, #0A5578 100%);
  color:#fff; border:0;
  padding:var(--sp-lg); box-shadow:var(--shadow-md);
  position:relative; overflow:hidden;
}
.hp-journey-feature::before{
  content:""; position:absolute; inset:0; opacity:.55; pointer-events:none;
  background:radial-gradient(520px 260px at 88% -10%, rgba(184,202,46,.24), transparent 70%);
}
.hp-journey-feature .hp-journey-icon{ background:rgba(255,255,255,.14); color:var(--sgf-lime); width:60px; height:60px; position:relative; }
.hp-journey-feature .hp-journey-icon svg{ width:30px; height:30px; }
.hp-journey-feature .hp-journey-title{ color:#fff; font-size:1.42rem; position:relative; }
.hp-journey-feature .hp-journey-desc{ color:#D9E6F2; position:relative; max-width:42ch; }
.hp-journey-feature:hover{ box-shadow:var(--shadow-lg); transform:translateY(-4px); }
.hp-journey-badge{
  display:inline-flex; align-self:flex-start; align-items:center; gap:.35em;
  background:var(--sgf-lime); color:#033850; font-size:.7rem; font-weight:800;
  text-transform:uppercase; letter-spacing:.05em; padding:.32em .65em; border-radius:999px; margin-bottom:.3rem;
  position:relative;
}
.hp-journey-feature-text{ flex:1 1 auto; position:relative; display:flex; flex-direction:column; align-items:flex-start; gap:.45rem; }
.hp-journey-feature-text .hp-journey-desc{ display:block; }

.hp-journey-card--security{ flex-direction:row; align-items:center; gap:1.1rem; }
.hp-journey-card--security .hp-journey-desc{ margin:0; }

@media (min-width:640px){
  .hp-journey-grid{
    grid-template-columns:repeat(2,1fr);
    grid-template-areas:"feature feature" "parking directions" "book rental" "security security";
  }
  .hp-journey-feature{ grid-area:feature; }
  .hp-journey-card--parking{ grid-area:parking; }
  .hp-journey-card--directions{ grid-area:directions; }
  .hp-journey-card--book{ grid-area:book; }
  .hp-journey-card--rental{ grid-area:rental; }
  .hp-journey-card--security{ grid-area:security; }
}
@media (min-width:960px){
  .hp-journey-grid{
    grid-template-columns:repeat(4,1fr);
    grid-template-areas:"feature feature parking directions" "feature feature book rental" "security security security security";
  }
  .hp-journey-feature{ flex-direction:column; align-items:flex-start; justify-content:center; }
  .hp-journey-feature .hp-journey-icon{ margin-bottom:.4rem; }
}

/* ---- destinations teaser ---- */
.hp-dest-teaser{ background:linear-gradient(115deg, var(--deep-1) 0%, var(--deep-2) 55%, #0d5c86 100%); color:#fff; position:relative; overflow:hidden; border-radius:28px; margin:0 .75rem; }
@media (min-width:1280px){ .hp-dest-teaser{ margin:0 auto; max-width:1280px; } }
.hp-dest-teaser::before{
  content:""; position:absolute; inset:0; opacity:.6; pointer-events:none;
  background:radial-gradient(700px 340px at 100% 0%, rgba(22,104,179,.4), transparent 65%);
}
.hp-dest-teaser .container{ position:relative; padding-top:var(--sp-xl); padding-bottom:var(--sp-xl); }
.hp-dest-teaser-inner{ position:relative; display:flex; flex-direction:column; gap:var(--sp-lg); }
.hp-dest-teaser h2{ color:#fff; font-size:var(--fs-display); margin-bottom:.4em; letter-spacing:-.015em; }
.hp-dest-teaser-text p{ color:#D9E6F2; max-width:58ch; }
.hp-dest-teaser-actions{ display:flex; }
.hp-dest-teaser-visual{ display:flex; flex-direction:column; gap:var(--sp-md); }

.hp-dest-photos{ display:grid; grid-template-columns:1fr; gap:var(--sp-sm); }
.hp-dest-photo-card{
  position:relative; border-radius:16px; overflow:hidden; text-decoration:none;
  aspect-ratio:4/3; box-shadow:var(--shadow-md);
  transition:transform var(--dur-sm) var(--ease-out), box-shadow var(--dur-sm) var(--ease-out);
}
.hp-dest-photo-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.hp-dest-photo-card img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .8s var(--ease-out); }
.hp-dest-photo-card:hover img{ transform:scale(1.06); }
.hp-dest-photo-scrim{
  position:absolute; inset:0;
  background:linear-gradient(0deg, rgba(6,22,40,.88) 0%, rgba(6,22,40,.08) 55%, transparent 100%);
}
.hp-dest-photo-label{ position:absolute; left:0; right:0; bottom:0; padding:.9rem 1rem; color:#fff; }
.hp-dest-photo-city{ display:block; font-weight:800; font-size:1.05rem; }
.hp-dest-photo-code{ display:block; font-family:var(--sgf-font-mono); font-size:.78rem; letter-spacing:.08em; color:#C8D8E8; margin-top:.15em; }

.hp-dest-all-label{
  display:block; text-transform:uppercase; letter-spacing:.08em; font-size:.72rem; font-weight:800;
  color:#9FB6CC; margin-bottom:.7rem;
}
.hp-dest-chips{ display:flex; flex-wrap:wrap; gap:.55rem; }
.hp-dest-chip{
  display:inline-flex; align-items:center; gap:.5em;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.28); color:#fff;
  padding:.5em .9em; border-radius:999px; font-weight:700; font-size:.85rem; text-decoration:none;
  transition:background var(--dur-sm) var(--ease-out), border-color var(--dur-sm) var(--ease-out), transform var(--dur-sm) var(--ease-out);
}
.hp-dest-chip:hover{ background:rgba(255,255,255,.18); border-color:var(--sgf-lime); transform:translateY(-2px); }
.hp-dest-chip--seasonal{ border-style:dashed; }
.hp-dest-chip-badge{
  display:inline-flex; align-items:center; gap:.3em;
  background:rgba(184,202,46,.14); color:#B8CA2E;
  border:1px solid rgba(184,202,46,.5);
  padding:.2em .5em; border-radius:999px; font-size:.7rem; font-weight:800;
  text-transform:uppercase; letter-spacing:.04em;
}
.hp-dest-chip-badge svg{ width:11px; height:11px; }

@media (min-width:640px){
  .hp-dest-photos{ grid-template-columns:repeat(3,1fr); }
}
@media (min-width:960px){
  .hp-dest-teaser-inner{ display:grid; grid-template-columns:1fr 1.35fr; gap:var(--sp-2xl); align-items:start; }
  .hp-dest-teaser-text{ max-width:none; }
}

/* ---- parking detail ---- */
.hp-parking-grid{ display:grid; grid-template-columns:1fr; gap:var(--sp-sm); }
.hp-parking-card{
  background:var(--card); border:1px solid rgba(255,255,255,.6); border-radius:var(--card-radius); padding:var(--sp-md);
  box-shadow:var(--shadow-sm); position:relative;
  transition:transform var(--dur-sm) var(--ease-out), box-shadow var(--dur-sm) var(--ease-out);
}
.hp-parking-card:hover{ box-shadow:var(--shadow-md); transform:translateY(-4px); }
.hp-parking-card-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:.75rem; margin-bottom:.2em; }
.hp-parking-card h3{ font-size:var(--fs-h3); color:var(--sgf-navy); margin:0; }
.hp-parking-best{
  display:inline-flex; align-items:center; gap:.3em; flex:none;
  background:rgba(184,202,46,.18); color:var(--sgf-lime-deep); border:1px solid rgba(184,202,46,.6);
  font-size:.66rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em;
  padding:.28em .6em; border-radius:999px;
}
.hp-parking-rate{ display:flex; align-items:baseline; gap:.4em; margin:.5rem 0 .8rem; }
.hp-parking-rate strong{
  font-family:var(--sgf-font-mono); font-variant-numeric:tabular-nums;
  font-size:1.9rem; color:var(--sgf-navy); font-weight:700; letter-spacing:-.02em;
}
.hp-parking-rate span{ color:var(--sgf-slate); font-size:.88rem; }
.hp-parking-meta{ display:flex; flex-direction:column; gap:.5rem; margin:0; padding:0; list-style:none; color:var(--sgf-slate); font-size:.92rem; }
.hp-parking-meta li{ display:flex; gap:.5em; align-items:flex-start; }
.hp-parking-meta svg{ width:18px; height:18px; flex:none; color:var(--sgf-blue); margin-top:.1em; }

@media (min-width:640px){ .hp-parking-grid{ grid-template-columns:repeat(3,1fr); } }

/* ---- news + subscribe: warm cream brand band ---- */
.hp-news{ background:var(--sgf-cream); border-radius:28px; margin:0 .75rem; }
@media (min-width:1280px){ .hp-news{ margin:0 auto; max-width:1280px; } }
.hp-news-grid{ display:grid; grid-template-columns:1fr; gap:var(--sp-sm); margin-bottom:var(--sp-xl); }
.hp-news-card{
  background:var(--card); border:1px solid rgba(255,255,255,.6); border-radius:var(--card-radius); padding:var(--sp-md);
  box-shadow:var(--shadow-sm); transition:transform var(--dur-sm) var(--ease-out), box-shadow var(--dur-sm) var(--ease-out);
}
.hp-news-card:hover{ box-shadow:var(--shadow-md); transform:translateY(-4px); }
.hp-news-card time{ display:block; color:var(--sgf-slate); font-size:.78rem; margin-bottom:.6em; text-transform:uppercase; letter-spacing:.05em; font-weight:700; }
.hp-news-card h3{ font-size:1.05rem; margin-bottom:.4em; line-height:1.3; }
.hp-news-card h3 a{ color:var(--sgf-navy); text-decoration:none; }
.hp-news-card h3 a:hover{ color:var(--sgf-blue); text-decoration:underline; }
.hp-news-card p{ color:var(--sgf-slate); font-size:.92rem; margin-bottom:0; }
.hp-chip{
  display:inline-block; font-size:.7rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em;
  padding:.32em .65em; border-radius:999px; margin-bottom:.7em;
}
.hp-chip-news{ background:#E4EEF9; color:var(--sgf-blue); }
.hp-chip-construction{ background:#FCEEDF; color:var(--sgf-delayed); }
.hp-chip-alerts{ background:#FBE7E8; color:var(--sgf-cancel); }
.hp-chip-deals{ background:#EAF4EC; color:var(--sgf-ontime); }

.hp-subscribe{
  background:var(--card); border:1px solid rgba(255,255,255,.6); border-radius:var(--card-radius); padding:var(--sp-lg);
  box-shadow:var(--shadow-md);
}
.hp-subscribe h3{ font-size:1.25rem; color:var(--sgf-navy); margin-bottom:.3em; }
.hp-subscribe > p{ color:var(--sgf-slate); margin-bottom:var(--sp-md); max-width:66ch; }
.hp-form-grid{ display:grid; grid-template-columns:1fr; gap:1.1rem; }
.hp-field label{ display:block; font-weight:700; margin-bottom:.35em; color:var(--sgf-ink); }
.hp-field input[type="email"],
.hp-field input[type="tel"]{
  width:100%; padding:.7em 1em; border:2px solid var(--sgf-line); border-radius:12px; font-size:1rem; min-height:46px;
  transition:border-color var(--dur-sm) var(--ease-out);
}
.hp-field input:focus-visible{ border-color:var(--sgf-blue); }
.hp-field input:invalid{ box-shadow:none; }
.hp-field-error{
  color:var(--sgf-cancel); font-size:.88rem; font-weight:700; margin-top:.4em;
  display:flex; align-items:center; gap:.35em;
}
.hp-field-error[hidden]{ display:none; }
.hp-field-error svg{ width:16px; height:16px; flex:none; }
.hp-field.has-error input{ border-color:var(--sgf-cancel); }

.hp-checkbox-fieldset{ border:0; padding:0; margin:0; }
.hp-checkbox-fieldset legend{ font-weight:700; padding:0 0 .5em; color:var(--sgf-ink); }
.hp-checkbox-group{ display:grid; grid-template-columns:1fr; gap:.65rem; }
.hp-checkbox{ display:flex; align-items:flex-start; gap:.6em; }
.hp-checkbox input[type="checkbox"]{ width:20px; height:20px; margin-top:.15em; flex:none; accent-color:var(--sgf-blue); }
.hp-checkbox label{ font-weight:500; margin:0; }

.hp-sms-block{ border-top:1px solid var(--hairline); padding-top:1rem; margin-top:.25rem; }
.hp-sms-phone{ margin-top:.75rem; max-width:280px; }
.hp-sms-phone[hidden]{ display:none; }

.hp-subscribe-actions{ display:flex; align-items:center; gap:1rem; flex-wrap:wrap; }
.hp-form-success{
  display:flex; align-items:flex-start; gap:.6em; background:#EAF4EC; border:1px solid #BFE0C6; color:#134321;
  padding:.9em 1em; border-radius:12px; font-weight:600;
}
.hp-form-success[hidden]{ display:none; }
.hp-form-success svg{ width:20px; height:20px; flex:none; color:var(--sgf-ontime); }

@media (min-width:640px){ .hp-checkbox-group{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:900px){
  .hp-form-grid{ grid-template-columns:1.1fr 1fr; column-gap:1.75rem; }
  #hp-email-field{ grid-column:1; grid-row:1; }
  #hp-categories-field{ grid-column:2; grid-row:1 / span 2; }
  .hp-sms-block{ grid-column:1; grid-row:2; }
  .hp-subscribe-actions{ grid-column:1 / -1; }
}
@media (min-width:960px){
  .hp-news-grid{ grid-template-columns:repeat(3,1fr); }
}

/* ---- footer (shared st- styling, hp- ids preserved) ---- */
.hp-footer{ background:var(--sgf-slate-dark); color:#D9E6F2; padding-top:var(--sp-xl); margin-top:var(--sp-xl); border-top:3px solid var(--sgf-sage); }
.hp-footer-grid{ display:grid; grid-template-columns:1fr; gap:2rem; padding-bottom:2rem; border-bottom:1px solid rgba(255,255,255,.16); }
.hp-footer-heading{ color:#fff; font-size:.82rem; text-transform:uppercase; letter-spacing:.09em; margin-bottom:.9em; }
.hp-footer-col ul{ display:flex; flex-direction:column; gap:.6rem; }
.hp-footer-col a{ color:#C6D6E5; text-decoration:none; transition:color var(--dur-sm) var(--ease-out); }
.hp-footer-col a:hover{ color:#fff; text-decoration:underline; }
.hp-footer-contact{ font-style:normal; color:#C6D6E5; line-height:1.7; }
.hp-footer-wordmark{ display:flex; align-items:center; gap:.6rem; margin-bottom:.9rem; }
.hp-footer-wordmark svg{ width:30px; height:30px; color:var(--sgf-lime); }
.hp-footer-wordmark span{ font-weight:800; color:#fff; font-size:1.05rem; }

/* compact accessibility commitment, replaces the old verbose block */
.hp-footer-a11y{
  display:flex; gap:.6rem; align-items:flex-start;
  padding:1.1rem 0 0;
}
.hp-footer-a11y svg{ width:18px; height:18px; flex:none; color:var(--sgf-lime); margin-top:.2em; }
.hp-footer-a11y p{ margin:0; font-size:.88rem; color:#C6D6E5; max-width:88ch; }
.hp-footer-a11y strong{ color:#fff; }

.hp-footer-bottom{ padding:.75rem 0 2rem; display:flex; flex-direction:column; gap:1rem; }
.hp-disclaimer{
  font-size:.85rem; color:#9FB6CC; border-top:1px dashed rgba(255,255,255,.22); padding-top:1.25rem; max-width:80ch;
}
.hp-footer-meta{ display:flex; flex-wrap:wrap; gap:1rem; font-size:.85rem; color:#9FB6CC; }
.hp-footer-meta a{ color:#C6D6E5; }

@media (min-width:640px){ .hp-footer-grid{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:960px){ .hp-footer-grid{ grid-template-columns:repeat(4,1fr) 1.4fr; } }

/* =====================================================================
   DESTINATIONS MAP (dm-)
   ===================================================================== */

.dm-hero-band{
  background:linear-gradient(115deg, var(--deep-1) 0%, var(--deep-2) 48%, var(--deep-3) 100%);
  color:#fff;
  margin-top:calc(-1 * (var(--header-h) + 1rem));
  padding-top:calc(var(--header-h) + 2.4rem);
  padding-bottom:4.25rem;
  border-radius:0 0 28px 28px;
  box-shadow:var(--shadow-lg);
  position:relative; overflow:hidden;
}
.dm-hero-band::after{
  content:""; position:absolute; inset:0; opacity:.5; pointer-events:none;
  background:radial-gradient(640px 320px at 100% 0%, rgba(22,104,179,.45), transparent 65%);
}
.dm-page-head{ position:relative; z-index:1; }
.dm-eyebrow{
  display:block; text-transform:lowercase; letter-spacing:.02em; font-size:1rem; font-weight:700;
  color:var(--sgf-lime); margin-bottom:.4rem;
}
.dm-title{ font-size:clamp(1.9rem, 1.5rem + 1.8vw, 3rem); color:#fff; max-width:22ch; letter-spacing:-.02em; }
.dm-intro{ color:#DCE8F3; max-width:72ch; font-size:1.02rem; }
.dm-badge-sample{
  display:inline-flex; align-items:center; gap:.4em; margin-top:.5rem;
  background:rgba(255,246,224,.14); color:#F4DFA1; border:1px solid rgba(231,199,102,.5);
  font-size:.8rem; font-weight:700; padding:.35em .75em; border-radius:999px;
}
.dm-badge-sample svg{ width:14px; height:14px; }
@media (prefers-reduced-motion: no-preference){
  .dm-eyebrow{ animation:hp-fade-up .6s var(--ease-out) both; }
  .dm-title{ animation:hp-fade-up .7s var(--ease-out) .07s both; }
  .dm-intro{ animation:hp-fade-up .7s var(--ease-out) .14s both; }
  .dm-badge-sample{ animation:hp-fade-up .7s var(--ease-out) .21s both; }
}

.dm-content{ position:relative; z-index:2; margin-top:-2.4rem; }

/* ---- filters ---- */
.dm-filters{
  border:1px solid rgba(255,255,255,.6); border-radius:var(--card-radius); background:var(--card);
  padding:1.1rem 1.25rem; margin:0 0 1rem; box-shadow:var(--shadow-md);
}
.dm-filters-legend{ float:left; width:100%; font-weight:800; color:var(--sgf-navy); padding:0 0 .6rem; font-size:1rem; }
.dm-filters-row{ display:flex; flex-direction:column; gap:1rem; clear:both; }
.dm-field{ display:flex; flex-direction:column; gap:.4rem; min-width:0; }
.dm-field-label{ font-weight:700; font-size:.88rem; color:var(--sgf-ink); }
.dm-select{
  appearance:none; -webkit-appearance:none;
  background:#fff url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B2C4D' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat right .65rem center/16px 16px;
  border:2px solid var(--sgf-line); color:var(--sgf-ink); font-weight:600;
  border-radius:12px; padding:.6em 2.2rem .6em .8em; min-height:44px; cursor:pointer; font-size:.95rem; width:100%;
  transition:border-color var(--dur-sm) var(--ease-out);
}
.dm-select:hover{ border-color:var(--sgf-blue); }
.dm-radio-group{ display:flex; flex-wrap:wrap; gap:.5rem .9rem; }
.dm-radio{ display:flex; align-items:center; gap:.5em; min-height:44px; }
.dm-radio input{ width:20px; height:20px; accent-color:var(--sgf-blue); flex:none; }
.dm-radio label{ font-weight:500; }
.dm-filter-actions{ display:flex; }
.dm-reset-btn{
  background:#fff; color:var(--sgf-navy); border:1.5px solid var(--sgf-line); border-radius:999px;
  font-weight:700; padding:.6em 1.2em; min-height:44px; cursor:pointer;
  transition:border-color var(--dur-sm) var(--ease-out), color var(--dur-sm) var(--ease-out);
}
.dm-reset-btn:hover{ border-color:var(--sgf-blue); color:var(--sgf-blue); }

@media (min-width:720px){
  .dm-filters-row{ flex-direction:row; flex-wrap:wrap; align-items:flex-end; }
  .dm-field{ flex:1 1 220px; }
  .dm-filter-actions{ margin-left:auto; }
}

/* ---- live status line ---- */
.dm-status{
  font-weight:700; color:var(--sgf-navy); font-size:.95rem; margin:0 0 1.25rem;
  padding:.6em .95em; border-left:4px solid var(--sgf-blue); background:#fff; border-radius:0 12px 12px 0;
  box-shadow:var(--shadow-sm);
}

/* ---- layout ---- */
.dm-layout{ display:grid; grid-template-columns:1fr; gap:1.75rem; padding-bottom:3rem; }
@media (min-width:960px){
  .dm-layout{ grid-template-columns:1.5fr 1fr; align-items:start; }
}

.dm-panel{ border:1px solid rgba(255,255,255,.6); border-radius:var(--card-radius); background:var(--card); padding:1.25rem; box-shadow:var(--shadow-md); }
.dm-panel-head{ margin-bottom:.9rem; }
.dm-panel-head h2{ font-size:1.2rem; color:var(--sgf-navy); margin-bottom:.3em; }
.dm-map-instructions{ color:var(--sgf-slate); font-size:.9rem; margin:0; }

/* ---- map: real Albers-projected geography (reused from the verified
   Allegiant interactive route map: same projection, same state path
   data, coordinate space 721x452). Soft blue water, white landmass,
   hairline state borders. ---- */
.dm-map-wrap{
  position:relative; width:100%; aspect-ratio:960/600;
  background:#F4F9FC;
  border-radius:14px 14px 10px 10px; overflow:hidden; border:1px solid var(--hairline);
  border-bottom:8px solid var(--sgf-tan);
}
.dm-svg{ position:absolute; inset:0; width:100%; height:100%; display:block; }
#dm-svg .st{
  fill:#FFFFFF; stroke:#B9C6CF; stroke-width:.9; stroke-linejoin:round;
  transition:fill var(--dur-sm) var(--ease-out);
}
/* states with SGF nonstop service, pale brand blue; Missouri, the home
   state, anchored in dark slate, both matching SGF's own flight map.
   The served set tracks the active filters (see updateServedStates). */
#dm-svg .st.served{ fill:var(--sgf-sky); }
#dm-svg .st.home{ fill:var(--sgf-slate-dark); stroke:#22404D; }

.dm-arc{ stroke:#85991A; stroke-width:2; opacity:.95; stroke-linecap:round; fill:none; }
.dm-arc--seasonal{ stroke-dasharray:6 4.5; }
.dm-arc.is-active{ stroke:var(--sgf-blue); stroke-width:2.8; opacity:1; }
.dm-arc.is-selected{ stroke:var(--sgf-navy); stroke-width:3; opacity:1; }
@media (prefers-reduced-motion: no-preference){
  .dm-arc--seasonal{ animation:dm-flow 6s linear infinite; }
  .dm-arc.is-drawn{ }
}
@keyframes dm-flow{ to{ stroke-dashoffset:-105; } }
@media (prefers-reduced-motion: reduce){
  .dm-arc--seasonal{ animation:none; }
}

.dm-dot{ fill:var(--sgf-lime); stroke:var(--sgf-slate-dark); stroke-width:1.2; }
.dm-dot.is-active{ stroke:var(--sgf-blue); r:6; }
.dm-dot.is-selected{ stroke:var(--sgf-navy); stroke-width:2.5; r:6; }

#dm-hub-dot circle{ fill:var(--sgf-lime); stroke:#fff; stroke-width:2; }
#dm-hub-dot .dm-hub-core{ r:8; }
#dm-hub-dot .dm-hub-ring{ fill:none; stroke:var(--sgf-lime); stroke-width:1.3; opacity:.55; r:13; }
@media (prefers-reduced-motion: no-preference){
  #dm-hub-dot .dm-hub-ring{ animation:dm-hub-pulse 3.2s ease-in-out infinite; transform-origin:center; transform-box:fill-box; }
}
@keyframes dm-hub-pulse{ 0%,100%{ opacity:.55; } 50%{ opacity:.2; } }
.dm-hub-chip{
  position:absolute; transform:translate(-50%, 13px);
  background:var(--sgf-navy); color:#fff; font-size:10px; font-weight:800; letter-spacing:.03em;
  padding:.2em .55em; border-radius:999px; white-space:nowrap; pointer-events:none;
  border:1px solid var(--sgf-lime);
}

.dm-pin{
  position:absolute; transform:translate(-50%,-50%);
  width:38px; height:38px; padding:0; margin:0; border:0; background:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center; border-radius:50%;
  transition:transform .14s var(--ease-out);
}
.dm-pin-svg{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.dm-pin-core{ fill:var(--sgf-lime); stroke:var(--sgf-slate-dark); stroke-width:1.8; }
.dm-pin-diamond{ fill:var(--sgf-lime); stroke:var(--sgf-slate-dark); stroke-width:1.8; stroke-linejoin:round; }
.dm-pin-mixed-ring{ fill:none; stroke:var(--sgf-slate-dark); stroke-width:1.6; stroke-dasharray:2.4 2.2; opacity:.85; }
.dm-pin-selected-ring{ fill:none; stroke:var(--sgf-navy); stroke-width:2.4; opacity:0; }
.dm-pin-code{
  position:relative; font-size:10.5px; font-weight:800; color:#033850; letter-spacing:.01em;
  pointer-events:none;
}
@media (max-width:640px){
  .dm-pin{ width:30px; height:30px; }
  .dm-pin-code{ font-size:8.5px; }
}
.dm-pin:hover, .dm-pin:focus-visible, .dm-pin.is-active{ transform:translate(-50%,-50%) scale(1.16); z-index:2; }
.dm-pin:hover .dm-pin-core, .dm-pin:focus-visible .dm-pin-core, .dm-pin.is-active .dm-pin-core,
.dm-pin:hover .dm-pin-diamond, .dm-pin:focus-visible .dm-pin-diamond, .dm-pin.is-active .dm-pin-diamond{
  fill:#C7D845; stroke:var(--sgf-blue); stroke-width:2.4;
}
.dm-pin[aria-pressed="true"]{ transform:translate(-50%,-50%) scale(1.22); z-index:3; }
.dm-pin[aria-pressed="true"] .dm-pin-selected-ring{ opacity:1; }
.dm-pin:focus-visible{ outline:3px solid var(--sgf-blue); outline-offset:3px; border-radius:50%; }
.dm-pin[hidden]{ display:none; }

.dm-legend{ display:flex; flex-wrap:wrap; gap:.9rem 1.4rem; margin-top:1rem; }
.dm-legend-item{ display:flex; align-items:center; gap:.5em; font-size:.85rem; color:var(--sgf-ink); }
.dm-legend-swatch{ flex:none; overflow:visible; }
.dm-legend-line{ flex:none; }

.dm-detail{
  margin-top:1.1rem; padding:1.05rem 1.15rem; border:1px solid var(--hairline); border-radius:14px; background:var(--sgf-sky);
  min-height:120px;
}
.dm-detail-heading{ font-size:1.05rem; color:var(--sgf-navy); margin-bottom:.5em; }
.dm-detail-multi-note{ font-size:.85rem; color:var(--sgf-slate); font-style:italic; margin:0 0 .75rem; }
.dm-detail-route + .dm-detail-route{ margin-top:.85rem; padding-top:.85rem; border-top:1px dashed var(--sgf-line); }
.dm-detail-list{ margin:0 0 .4rem; display:flex; flex-direction:column; gap:.4rem; }
.dm-detail-row{ display:flex; gap:.5em; flex-wrap:wrap; font-size:.92rem; }
.dm-detail-row dt{ font-weight:700; color:var(--sgf-navy); min-width:6.5em; }
.dm-detail-row dd{ margin:0; color:var(--sgf-ink); display:flex; align-items:center; gap:.4em; }
.dm-detail-note{ margin:0 0 .3rem; color:var(--sgf-slate); font-size:.82rem; font-style:italic; }
.dm-detail-blurb{ margin:.75rem 0 0; color:var(--sgf-slate); font-size:.9rem; }

.dm-list-caption{ color:var(--sgf-slate); font-size:.85rem; text-align:left; padding-bottom:.6em; }
.dm-table-wrap{ overflow-x:auto; border-radius:10px; }
@media (min-width:960px){
  .dm-table-wrap{ max-height:640px; overflow-y:auto; border:1px solid var(--hairline); }
  .dm-table thead th{ position:sticky; top:0; background:#fff; z-index:1; }
}
.dm-table-wrap:focus-visible{ outline:3px solid var(--sgf-blue); outline-offset:-2px; }
.dm-table{ width:100%; border-collapse:collapse; font-size:.9rem; table-layout:fixed; }
.dm-table th, .dm-table td{ text-align:left; padding:.65em .55em; border-bottom:1px solid var(--hairline); vertical-align:top; overflow-wrap:break-word; hyphens:auto; }
.dm-table thead th{ color:var(--sgf-navy); font-size:.74rem; text-transform:uppercase; letter-spacing:.015em; border-bottom:2px solid var(--sgf-line); }
.dm-table th:nth-child(1){ width:28%; }
.dm-table th:nth-child(2){ width:23%; }
.dm-table th:nth-child(3){ width:24%; }
.dm-table th:nth-child(4){ width:25%; }
@media (max-width:599px){
  .dm-table{ font-size:.8rem; }
  .dm-table th, .dm-table td{ padding:.55em .35em; }
  .dm-table thead th{ font-size:.64rem; letter-spacing:0; padding-bottom:.4em; }
  .dm-table th:nth-child(1){ width:27%; }
  .dm-table th:nth-child(2){ width:23%; }
  .dm-table th:nth-child(3){ width:24%; }
  .dm-table th:nth-child(4){ width:26%; }
  .dm-sort-btn{ flex-direction:column; align-items:flex-start; gap:.15em; }
  .dm-season-badge{ font-size:.78rem; padding:.24em .5em; }
  .dm-table .airline-mark{ display:none; }
}
.dm-table tbody tr{ transition:background var(--dur-sm) var(--ease-out); }
.dm-table tbody tr:last-child td{ border-bottom:0; }
.dm-table tbody tr:hover{ background:var(--sgf-sky); cursor:pointer; }
.dm-table tbody tr[data-code].is-active{ background:#F1F4D9; }
.dm-empty-row td{ color:var(--sgf-slate); font-style:italic; padding:1rem .55em; }

.dm-sort-btn{
  display:inline-flex; align-items:flex-start; gap:.35em; background:none; border:0; padding:0; margin:0;
  font:inherit; font-weight:800; text-transform:uppercase; letter-spacing:.015em; font-size:.76rem;
  color:var(--sgf-navy); cursor:pointer; min-height:44px; max-width:100%; text-align:left;
}
.dm-sort-btn > span:first-child{ min-width:0; overflow-wrap:break-word; }
.dm-sort-btn:hover{ color:var(--sgf-blue); }
.dm-sort-icon{ font-size:.85em; color:var(--sgf-slate); flex:none; }
.dm-table th[aria-sort="ascending"] .dm-sort-icon,
.dm-table th[aria-sort="descending"] .dm-sort-icon{ color:var(--sgf-blue); }

.dm-season-badge{
  display:inline-flex; align-items:flex-start; gap:.3em; font-weight:700; font-size:.85rem;
  padding:.22em .5em; border-radius:999px; white-space:normal; line-height:1.3;
  max-width:100%; box-sizing:border-box;
}
.dm-season-badge > span{ min-width:0; overflow-wrap:normal; word-break:normal; }
.dm-season-badge--year{ background:#EAF4EC; color:var(--sgf-ontime); }
.dm-season-badge--seasonal{ background:#FCEEDF; color:var(--sgf-delayed); }
.dm-season-icon{ width:12px; height:12px; flex:none; }

/* ---- dm footer mirrors hp footer ---- */
.dm-footer{ background:var(--sgf-slate-dark); color:#D9E6F2; padding:2.25rem 0 2rem; margin-top:1rem; border-top:3px solid var(--sgf-sage); }
.dm-footer-inner{ display:flex; flex-direction:column; gap:1rem; }
.dm-footer-links{ display:flex; flex-wrap:wrap; gap:1.25rem; }
.dm-footer-links a{ color:#fff; font-weight:700; text-decoration:none; }
.dm-footer-links a:hover{ text-decoration:underline; }
.dm-disclaimer{
  font-size:.85rem; color:#9FB6CC; border-top:1px dashed rgba(255,255,255,.22); padding-top:1.1rem; max-width:80ch; margin:0;
}
.dm-footer-meta{ font-size:.85rem; color:#9FB6CC; margin:0; }

@media (min-width:640px){
  .dm-footer-inner{ flex-direction:row; flex-wrap:wrap; justify-content:space-between; align-items:flex-start; }
}

@media print{
  .hp-reveal{ opacity:1 !important; transform:none !important; }
  .st-header{ position:static; }
}
