/* Vliegseintje shared visual system.
   Native CSS, evolved from the approved homepage. All theme rules are scoped to
   .site-page, so the homepage and standalone onboarding keep their own layout. */
@font-face { font-family: Barlow; src: url('homepage/barlow-700.woff2') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: Manrope; src: url('homepage/manrope-600.woff2') format('woff2'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: Manrope; src: url('homepage/manrope-700.woff2') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }

/* Brand tokens also feed the existing, structural style.css components. */
body.site-page {
  color-scheme: dark;
  --navy: #0b2340;
  --surface: #112d50;
  --surface-raised: #17385c;
  --yellow: #ffd631;
  --white: #f7f8fa;
  --muted: #b8c7d9;
  --line: #35506e;
  --color-primary: var(--yellow);
  --color-primary-hover: #ffe16b;
  --color-primary-soft: var(--surface-raised);
  --color-accent: var(--yellow);
  --color-accent-hover: #ffe16b;
  --color-bg: var(--navy);
  --color-surface: var(--surface);
  --color-ink: var(--white);
  --color-body: #d7e0eb;
  --color-muted: var(--muted);
  --color-border: var(--line);
  --color-success: #91dfbd;
  --color-success-soft: #153e3c;
  --color-danger: #ffb7b5;
  --color-danger-soft: #452e3b;
  --color-warning: var(--yellow);
  --font-body: Manrope, Arial, sans-serif;
  --font-head: Barlow, 'Arial Narrow', sans-serif;
  --font-display: var(--font-head);
  --r-input: 6px;
  --r-card: 12px;
  --r-avatar: 8px;
  --shadow-card: none;
  --shadow-lift: 0 12px 30px rgb(2 13 29 / .19);
  --container: 1392px;
  --fs-h1: clamp(2.25rem, 1.4rem + 2.7vw, 3.75rem);
  --fs-h2: clamp(1.8rem, 1.35rem + 1.25vw, 2.65rem);
  --fs-h3: clamp(1.25rem, 1.08rem + .6vw, 1.65rem);
  --fs-lead: clamp(1rem, .94rem + .25vw, 1.125rem);
  margin: 0;
  background: var(--navy);
  color: var(--color-body);
  font: 600 15px/1.75 var(--font-body);
}
.site-page ::selection { background: var(--yellow); color: var(--navy); }
.site-page :where(h1, h2, h3, h4) { font-family: var(--font-head); font-weight: 700; color: var(--white); line-height: 1.1; letter-spacing: -.025em; text-wrap: balance; }
.site-page h1 { margin-bottom: 20px; }
.site-page h2 { margin-bottom: 16px; }
.site-page h3 { letter-spacing: -.012em; }
.site-page strong { font-weight: 700; }
.site-page a { text-underline-offset: 4px; text-decoration-thickness: 1px; }
.site-page :where(a, button, input, select, textarea, summary) { -webkit-tap-highlight-color: transparent; }
.site-page :focus-visible { outline: 3px solid var(--yellow); outline-offset: 4px; }
.site-page #main:focus { outline: none; }
.site-page .skip-link { position: fixed; color: var(--navy); font-weight: 700; z-index: 100; }
.site-page #main { min-height: 45vh; }
.site-page .container { padding-inline: 56px; }
.site-page .section { padding-block: 72px; }
.site-page .section--tight { padding-block: 32px 64px; }
.site-page .section--surface { background: var(--surface); }
.site-page .section__head { max-width: 740px; margin-bottom: 36px; }
.site-page .section__head .sub { font-size: 16px; line-height: 1.8; }
.site-page .lead { max-width: 65ch; line-height: 1.8; }
.site-page :where(.eyebrow, .page-kicker) { color: var(--yellow); font: 700 12px/1.5 var(--font-body); letter-spacing: .11em; text-transform: uppercase; margin-bottom: 14px; }
.site-page .eyebrow2 { font: 700 12px/1.5 var(--font-body); letter-spacing: .08em; }
.site-page .page-hero { padding-block: 64px 44px; }
.site-page .page-lead { font-size: var(--fs-lead); max-width: 65ch; color: var(--muted); }
.site-page .section-heading { margin-bottom: 32px; }
.site-page .content-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.site-page :where(.grid, .plans, .dest-grid, .deal-grid) > * { min-width: 0; }
.site-page :where(p, li, .card, .app-content, .prose) { overflow-wrap: anywhere; }

/* Header: same silhouette, plane and wordmark as the approved homepage. */
.site-page .site-header { background: var(--navy); border-color: rgb(184 199 217 / .16); position: relative; }
.site-page .nav__inner { height: 80px; gap: 26px; }
.site-page .brand { color: var(--white); font-family: var(--font-body); font-size: 25px; font-weight: 700; letter-spacing: -1.1px; white-space: nowrap; gap: 10px; line-height: 1.3; }
.site-page .brand__mark { width: 35px; height: 31px; object-fit: contain; }
.site-page .nav__links { gap: 22px; }
.site-page .navlink { font-size: 13px; font-weight: 600; color: var(--white); white-space: nowrap; }
.site-page .navlink:hover, .site-page .navlink[aria-current='page'] { color: var(--yellow); }
.site-page .nav__actions { gap: 20px; }
.site-page .nav__actions .btn { padding: 12px 16px; min-height: 42px; font-size: 13px; white-space: nowrap; }
.site-page .nav__toggle { color: var(--white); width: auto; min-height: 44px; padding: 10px 12px; gap: 10px; font: 700 13px/1 var(--font-body); }
.site-page .nav__toggle[hidden], .site-page .nav__panel[hidden] { display: none; }
.site-page .nav__toggle-icon { position: relative; display: block; width: 16px; height: 12px; border-block: 1.5px solid currentColor; }
.site-page .nav__toggle-icon::after { content: ''; position: absolute; top: 4px; left: 0; width: 16px; border-top: 1.5px solid currentColor; }
.site-page .nav-is-open .nav__toggle { background: var(--surface); border-color: var(--yellow); color: var(--yellow); }

/* Controls: yellow signifies the primary action; outlined actions stay quiet. */
.site-page .btn { min-height: 46px; padding: 13px 20px; border-radius: 6px; color: var(--navy); background: var(--yellow); font-weight: 700; font-size: 14px; line-height: 1.35; box-shadow: none; }
.site-page .btn:hover { background: #ffe16b; color: var(--navy); transform: none; }
.site-page .btn:active { transform: translateY(1px); }
.site-page .btn.lg { padding: 16px 24px; min-height: 52px; font-size: 15px; }
.site-page .btn.sm { min-height: 38px; padding: 9px 13px; font-size: 12px; }
.site-page .btn.secondary, .site-page .btn.ghost { background: transparent; border: 1px solid #71859d; color: var(--white); }
.site-page .btn.secondary:hover, .site-page .btn.ghost:hover { background: var(--surface-raised); color: var(--white); border-color: var(--muted); }
.site-page .btn.accent { background: var(--yellow); color: var(--navy); }
.site-page .btn.danger { background: transparent; border-color: #ba7c82; color: var(--color-danger); }
.site-page .btn.danger:hover { background: var(--color-danger-soft); color: #ffd3d2; }
.site-page .btn:disabled { background: #60718a; color: #eef1f6; border-color: transparent; cursor: wait; transform: none; }
.site-page .cta-row { align-items: center; gap: 12px; }
.site-page :where(.btn, .navlink, .side-link, .reistile, .dest-card-link) { transition: background-color .18s, color .18s, border-color .18s; }

/* Panels share the modest radius and flat navy surfaces of the homepage. */
.site-page :where(.card, .surface, .deal-card, .dest-card, .plan-card, .dcard, .metric, .stat, .cms-card, .deal, .reistile) { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; box-shadow: none; }
.site-page .card, .site-page .surface { padding: 28px; }
.site-page .card--pad-lg { padding: 36px; }
.site-page .feature__icon, .site-page .feature__icon.accent { color: var(--yellow); background: var(--surface-raised); border-radius: 8px; }
.site-page .step__num { color: var(--navy); background: var(--yellow); font-size: 19px; }
.site-page .steps-flow { gap: 36px; }
.site-page .steps-flow .step { padding-top: 22px; }
.site-page .steps-flow .step.is-amber .num { color: var(--yellow); }
.site-page .vprops { background: var(--surface); }
.site-page .vprops .vprop { padding: 32px; }
.site-page .vprops .vprop h3 { font-size: 24px; }
.site-page .hero::before { display: none; }
.site-page .hero__phone { background: var(--surface); border-radius: 12px; box-shadow: none; }
.site-page .cta-band { background: var(--surface-raised); color: var(--white); border: 1px solid var(--line); padding: 52px 36px; border-radius: 12px; }
.site-page .cta-band p { color: var(--muted); }
.site-page .cta-band .btn.accent { box-shadow: none; }

/* Labels and states retain distinct meaning without introducing light islands. */
.site-page .badge { font-size: 12px; padding: 5px 11px; font-weight: 700; }
.site-page .badge.free, .site-page .badge.neutral, .site-page .tag, .site-page .cms-pill.off { background: var(--surface-raised); color: var(--muted); }
.site-page .badge.premium, .site-page .dscore.hot { background: var(--yellow); color: var(--navy); }
.site-page .badge.success, .site-page .dscore.good, .site-page .cms-pill.on { background: var(--color-success-soft); color: #a6edcd; }
.site-page .dscore.info { background: var(--surface-raised); color: #d7e0eb; }
.site-page .flash, .site-page .cms-flash { padding: 16px 18px; font-size: 14px; border-radius: 8px; }
.site-page .flash.ok, .site-page .cms-flash { color: #b5efcf; background: #163e39; border-color: #3e7c65; }
.site-page .flash.err, .site-page .cms-flash.err, .site-page .vo-expired { color: #ffd0ce; background: #452e3b; border-color: #99646d; }
.site-page .flash.info { color: #e1eaf5; background: var(--surface-raised); border-color: #6b829e; }
.site-page .flash.warn, .site-page .field-warn, .site-page .warn-banner, .site-page .vo-note { color: #ffe59b; background: #3c382b; border-color: #8f7b48; }
.site-page .warn-banner .btn { color: var(--navy); }
.site-page .flash a { color: inherit; text-decoration: underline; }
.site-page .empty, .site-page .empty-state { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 48px 28px; text-align: center; }
.site-page .empty h1 { font-size: clamp(2rem, 4.5vw, 2.75rem); }
.site-page .empty__icon { color: var(--yellow); background: var(--surface-raised); border-radius: 12px; }

/* Form fields: strong boundary contrast and native keyboard controls. */
.site-page label { font-size: 14px; font-weight: 700; }
.site-page input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=submit]):not([type=button]):not([type=range]),
.site-page select, .site-page textarea {
  max-width: 100%; min-width: 0; min-height: 46px;
  background: var(--navy); border: 1px solid #71859d; border-radius: 6px;
  padding: 12px 14px; font: 600 15px/1.5 var(--font-body); color: var(--white);
}
.site-page input::placeholder, .site-page textarea::placeholder { color: #aabbd0; opacity: 1; }
.site-page input:focus, .site-page select:focus, .site-page textarea:focus { border-color: var(--yellow); outline: 2px solid var(--yellow); outline-offset: 2px; box-shadow: none; }
.site-page input[type=checkbox], .site-page input[type=radio] { accent-color: var(--yellow); width: 17px; height: 17px; vertical-align: middle; }
.site-page input[type=file]::file-selector-button { background: var(--surface-raised); border: 1px solid var(--line); border-radius: 4px; color: var(--white); padding: 7px 9px; margin-right: 10px; font: inherit; }
.site-page :where(.help, .field-help, .cms-hint) { color: var(--muted); font-size: 13px; line-height: 1.65; }
.site-page .field-label { font-size: 23px; font-weight: 700; }
.site-page .field-block { margin-bottom: 36px; padding-bottom: 28px; border-bottom: 1px solid var(--line); }
.site-page .field-block:last-of-type { border: 0; }
.site-page #prefs-controls:disabled :disabled { cursor: not-allowed; }
.site-page .checkrow label, .site-page .day-chip, .site-page .country-chip, .site-page .seg-item, .site-page .choice-card { color: var(--white); background: var(--surface); border-color: #71859d; }
.site-page .checkrow label:has(input:checked), .site-page .day-chip.is-on, .site-page .country-chip.is-on, .site-page .seg-item:has(input:checked), .site-page .choice-card:has(input:checked) { color: var(--yellow); border-color: var(--yellow); background: var(--surface-raised); }
.site-page .checkrow label, .site-page .seg-item { position: relative; min-height: 44px; }
.site-page .checkrow input, .site-page .seg-item input { display: block; position: absolute; opacity: 0; width: 1px; height: 1px; }
.site-page .checkrow label:focus-within, .site-page .seg-item:focus-within, .site-page .choice-card:focus-within { outline: 3px solid var(--yellow); outline-offset: 3px; }
.site-page .choice-card.is-locked { opacity: 1; color: var(--muted); background: var(--navy); }
.site-page .choice-title { font-size: 20px; }
.site-page .chip { background: var(--surface-raised); color: var(--yellow); border: 1px solid var(--line); }
.site-page .chip-x { color: var(--yellow); min-width: 28px; min-height: 28px; }
.site-page .picker-list { background: var(--surface-raised); border-color: #71859d; box-shadow: var(--shadow-lift); }
.site-page .picker-item { font-family: var(--font-body); }
.site-page .picker-item:hover, .site-page .picker-item.is-active { background: var(--navy); }
.site-page .euro-input { background: var(--navy); border-color: #71859d; border-radius: 6px; }
.site-page .euro-input input[type=number] { border: none; background: transparent; }
.site-page .euro-input:focus-within { border-color: var(--yellow); box-shadow: none; outline: 2px solid var(--yellow); outline-offset: 2px; }
.site-page .euro-input input:focus { outline: none; }

/* App navigation and personal settings form an intentional workspace. */
.site-page .app-shell { grid-template-columns: 208px minmax(0, 1fr); gap: 48px; padding-block: 48px 64px; }
.site-page .app-side { top: 24px; padding: 20px 0; background: transparent; }
.site-page .app-side__title { margin: 0 14px 20px; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.site-page .app-side__links { display: grid; gap: 6px; }
.site-page .app-side .side-link { min-height: 48px; font-size: 14px; color: var(--muted); border-radius: 6px; border: 1px solid transparent; }
.site-page .app-side .side-link:hover { color: var(--white); background: var(--surface); }
.site-page .app-side .side-link.active { background: var(--surface-raised); color: var(--yellow); border-color: var(--line); }
.site-page .app-content { min-width: 0; }
.site-page .app-content h1 { font-size: clamp(2.2rem, 1.7rem + 1.3vw, 3rem); }
.site-page .app-content > .section__head { max-width: 720px; }
.site-page .dash-metrics { gap: 12px; margin-block: 28px 20px; }
.site-page .metric { border-color: var(--line); padding: 18px 16px; }
.site-page .metric .value { font-size: 29px; font-weight: 700; }
.site-page .metric .value.ok { color: #a6edcd; font-size: 17px; }
.site-page .dash-chip { background: var(--surface); border-color: var(--line); color: var(--muted); }
.site-page .dash-chip--edit { color: var(--yellow); background: transparent; }
.site-page .dash-chip--edit:hover { background: var(--surface-raised); }
.site-page .upsell { background: var(--surface); padding: 24px; }
.site-page .upsell strong { font-size: 22px; }

/* Live flight cards and filters; prices remain clear, links unchanged. */
.site-page .deal-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: 20px; }
.site-page .dcard { padding: 22px; }
.site-page .dcard__img { margin: -22px -22px 20px; }
.site-page .dcard__top { align-items: baseline; gap: 16px; }
.site-page .dcard__price { font-size: 36px; color: var(--yellow); font-variant-numeric: tabular-nums; line-height: 1.1; }
.site-page .dcard__city { font-size: 20px; text-wrap: balance; line-height: 1.2; }
.site-page .dcard__meta { margin-top: 16px; line-height: 1.8; }
.site-page .dcard__go { padding-top: 14px; margin-top: auto; font: 700 12px/1.5 var(--font-body); }
.site-page a.dcard[href]:hover { background: var(--surface-raised); border-color: #7890a9; box-shadow: none; transform: none; }
.site-page .dcard .btn { margin-top: 18px; }
.site-page .deal-hero { background: var(--surface-raised); border-color: var(--yellow); border-radius: 12px; box-shadow: none; padding: 30px; }
.site-page .dhero__price { color: var(--yellow); font-size: 56px; }
.site-page .dhero__city { font-size: 29px; }
.site-page .dhero__nudge a { color: var(--yellow); }
.site-page .filterbar { gap: 12px; margin-block: 24px; }
.site-page .filterbar select { background: var(--surface); max-width: 100%; min-height: 42px; font-size: 13px; }
.site-page .sortseg { background: var(--surface); border-color: var(--line); border-radius: 6px; }
.site-page .sortseg :where(span, button) { border-radius: 4px; }
.site-page .sortseg button { padding: 7px 13px; min-height: 44px; border: 0; background: transparent; color: var(--color-body); font: 600 13px/1.4 var(--font-body); cursor: pointer; }
.site-page .sortseg button:hover { background: var(--surface-raised); color: var(--white); }
.site-page .sortseg span.on, .site-page .sortseg button.on { background: var(--yellow); color: var(--navy); font-weight: 700; }
.site-page .sortseg button:focus-visible { outline-offset: -3px; outline-color: var(--white); }
.site-page .sortseg button.on:focus-visible { outline-color: var(--navy); }
.site-page .deals-gate__cta { background: var(--surface-raised); border-color: #71859d; padding: 30px; border-radius: 12px; }
.site-page .deals-gate__lock { color: var(--yellow); background: var(--navy); }
.site-page .deals-gate__overlay:hover .btn { color: var(--navy); background: #ffe16b; box-shadow: none; transform: none; }
.site-page .deal .price-tag { color: var(--yellow); }

/* Destination and editorial content. The photo, not decoration, leads. */
.site-page .dest-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.site-page .dest-card .city { font-size: 25px; line-height: 1.2; }
.site-page .dest-card .pricelabel { font-size: 27px; color: var(--yellow); }
.site-page .dest-card__body { padding: 24px; }
.site-page .dest-card__blurb { margin-block: 14px 20px; }
.site-page .dest-card:hover, .site-page .blog-card:hover, .site-page .deal-card:hover, .site-page .card-lift:hover { transform: none; box-shadow: none; }
.site-page .dest-card-link:hover { text-decoration: none; }
.site-page .dest-card-link:hover .dest-card { border-color: #7890a9; }
.site-page .blog-card { padding: 0; }
.site-page .blog-card__body { padding: 26px; gap: 4px; }
.site-page .blog-card h3 { font-size: 27px; line-height: 1.15; }
.site-page .blog-card h3 a:hover { color: var(--yellow); }
.site-page .blog-card .meta { font-size: 12px; padding-top: 18px; }
.site-page .blog-card .tag-row { margin-bottom: 14px; }
.site-page .prose { max-width: 864px; line-height: 1.9; }
.site-page .prose h1 { font-size: clamp(2.25rem, 1.5rem + 2.6vw, 3.65rem); }
.site-page .prose h2 { font-size: clamp(1.65rem, 1.25rem + 1vw, 2.2rem); margin-top: 44px; }
.site-page .prose h3 { font-size: 26px; margin-top: 32px; }
.site-page .prose p { margin-bottom: 22px; }
.site-page .prose .btn { text-decoration: none; }
.site-page .prose blockquote { background: var(--surface-raised); border-color: var(--line); padding: 22px 26px; color: var(--color-body); }
.site-page .blog-hero { margin-block: 30px 36px; }
.site-page :where(pre, code) { font-size: .88em; background: var(--surface-raised); color: var(--white); border-radius: 4px; }
.site-page code { padding: 3px 6px; }
.site-page pre { padding: 18px; overflow-x: auto; }
.site-page pre code { padding: 0; }
.site-page .reistiles { grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); }
.site-page .reistile:hover { background: var(--surface-raised); box-shadow: none; transform: none; text-decoration: none; }
.site-page .reistile__label { font-size: 19px; }

/* Pricing, checkout choices, FAQ and legal disclosure surfaces. */
.site-page .plans { gap: 28px; max-width: 1032px; margin-inline: auto; align-items: stretch; }
.site-page .plan-card { padding: 36px; }
.site-page .plan-card.featured { background: var(--surface-raised); border: 1px solid var(--yellow); box-shadow: none; }
.site-page .plan-card .price { font-size: 56px; margin-block: 24px 16px; }
.site-page .plan-card .price small { font-family: var(--font-body); font-size: 13px; }
.site-page .plan-pick { margin-top: 18px; }
.site-page .plan-pick [role=radiogroup] label { background: var(--navy); color: var(--white); font-size: 14px; transition: background-color .18s; }
.site-page .plan-pick [role=radiogroup] label:has(input:checked) { background: var(--surface-raised); box-shadow: inset 0 0 0 1px var(--yellow); }
.site-page .plan-pick [role=radiogroup] label:focus-within { outline: 3px solid var(--yellow); outline-offset: 3px; }
.site-page .plan-pick [role=radiogroup] small { color: var(--muted); }
.site-page .plan-pick > .muted { margin-top: 22px; }
.site-page .ticks { margin-block: 24px; }
.site-page .ticks li { padding-block: 8px; font-size: 14px; }
.site-page .ticks li::before { background: transparent; }
.site-page .ticks li::after { border-color: var(--yellow); }
.site-page .plan-toggle { background: var(--navy); border-radius: 6px; }
.site-page .plan-toggle label { border-radius: 4px; }
.site-page #plan-annual:checked ~ .plan-toggle label[for=plan-annual], .site-page #plan-monthly:checked ~ .plan-toggle label[for=plan-monthly] { color: var(--navy); }
.site-page .compare { background: var(--navy); border-color: var(--line); font-size: 14px; }
.site-page .compare th, .site-page .compare td { padding: 18px 22px; }
.site-page .compare thead th { font-family: var(--font-body); font-size: 13px; background: var(--surface-raised); color: var(--white); }
.site-page .compare tbody tr:nth-child(even) { background: var(--surface); }
.site-page .accordion { background: transparent; border: 0; border-radius: 0; }
.site-page .accordion details { border-bottom: 1px solid var(--line); }
.site-page .accordion details:first-child { border-top: 1px solid var(--line); }
.site-page .accordion details:last-child { border-bottom: 1px solid var(--line); }
.site-page .accordion summary { font-family: var(--font-body); font-weight: 700; font-size: 15px; line-height: 1.6; padding: 23px 0; }
.site-page .accordion summary:hover { color: var(--yellow); }
.site-page .accordion summary::after { color: var(--yellow); }
.site-page .accordion .acc__body { padding: 0 32px 24px 0; color: var(--muted); }

/* Flight details dialog follows the page theme. Its integration is untouched. */
.site-page .vo__panel { background: var(--surface); border: 1px solid var(--line); max-height: 90dvh; }
.site-page .vo__close { color: var(--white); background: var(--navy); border: 1px solid var(--line); width: 44px; height: 44px; }
.site-page .vo-city { font-size: 29px; }
.site-page .vo-price { color: var(--yellow); }
.site-page .vo-spark--btn { background: var(--navy); }
.site-page .vo-spark--btn:hover { background: var(--surface-raised); }
.site-page .vo-weather { background: var(--surface-raised); }
.site-page .vo-alt:hover, .site-page .vo-tile:hover { background: var(--surface-raised); }
.site-page .vo-chart__min { fill: var(--navy); }
.site-page .vo-chart__now { stroke: var(--navy); }
.site-page .vo-chart__svg #voGrad stop { stop-color: var(--yellow); }

/* Admin is deliberately compact: the same tokens, readable operational data. */
.site-page .adminnav { gap: 4px; }
.site-page .adminnav a { font-size: 13px; padding: 10px 12px; }
.site-page .cms-card { padding: 24px; background: var(--surface); border-color: var(--line); }
.site-page .cms-card .cms-field > label { color: var(--muted); font-size: 13px; }
.site-page .cms-card .cms-field input, .site-page .cms-card .cms-field textarea, .site-page .deal-controls input, .site-page .deal-controls select { background: var(--navy); color: var(--white); border-color: #71859d; }
.site-page .cms-thumb { background: var(--surface-raised); }
.site-page table.cms-table { background: var(--surface); border-color: var(--line); }
.site-page table.cms-table th { background: var(--surface-raised); color: var(--white); font-weight: 700; }
.site-page table.cms-table td, .site-page table.cms-table th { padding: 14px 16px; font-size: 13px; }
.site-page table.cms-table tbody tr:hover { background: var(--surface-raised); }
.site-page .stat { background: var(--surface); }
.site-page .stat__value { font-family: var(--font-head); font-size: 35px; font-weight: 700; }
.site-page .stat-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr)); }
.site-page .kv { gap: 18px; }

/* Footer stays in the same navy family, with a quiet border and ample air. */
.site-page .site-footer { background: var(--navy); color: var(--muted); border-top: 1px solid var(--line); margin-top: 64px; padding: 64px 0 28px; }
.site-page .footer__cols { grid-template-columns: 1.65fr 1fr 1fr 1fr; gap: 48px; }
.site-page .footer__brand p { color: var(--muted); font-size: 13px; line-height: 1.8; }
.site-page .footer h2 { color: var(--white); font: 700 13px/1.5 var(--font-body); letter-spacing: 0; text-transform: none; margin-bottom: 20px; }
.site-page .footer ul li { font-size: 13px; margin-bottom: 12px; }
.site-page .site-footer a { color: var(--muted); }
.site-page .site-footer .brand { color: var(--white); }
.site-page .site-footer a:hover { color: var(--yellow); }
.site-page .footer__bottom { color: var(--muted); border-color: var(--line); margin-top: 48px; padding-top: 24px; font-size: 11px; gap: 16px; }
.site-page .footer__bottom > span { max-width: 100%; overflow-wrap: anywhere; }

@media (max-width: 1279px) {
  .site-page .container { padding-inline: 40px; }
  .site-page .nav__inner { gap: 20px; }
  .site-page .nav__links { gap: 16px; }
  .site-page .nav__actions { gap: 14px; }
  .site-page .app-shell { gap: 32px; grid-template-columns: 185px minmax(0, 1fr); }
}
@media (max-width: 1099px) {
  .site-page .nav__inner { height: auto; min-height: 80px; flex-wrap: wrap; gap: 0; }
  .site-page .nav__inner > .nav__links, .site-page .nav__inner > .nav__actions { display: none; }
  .site-page .nav__toggle:not([hidden]) { display: inline-flex; }
  .site-page .nav__panel { position: static; display: block; width: 100%; background: var(--navy); border-top: 1px solid var(--line); padding: 20px 0 24px; z-index: 39; }
  .site-page .nav-ready .nav__inner { height: 80px; flex-wrap: nowrap; }
  .site-page .nav-ready .nav__panel { position: absolute; top: 80px; left: 0; right: 0; max-height: calc(100dvh - 80px); overflow-y: auto; padding: 16px 40px 28px; box-shadow: 0 15px 30px rgb(0 8 23 / .22); }
  .site-page .nav__panel .nav__links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 24px; }
  .site-page .nav__panel .navlink { font-size: 16px; padding: 14px 0; border-bottom: 1px solid var(--line); }
  .site-page .nav__panel .nav__actions { display: flex; align-items: stretch; flex-direction: row; gap: 14px; margin-top: 24px; }
  .site-page .nav__panel .nav__actions > * { flex: 1; }
  .site-page .nav__panel .nav__actions .btn { width: 100%; }
  .site-page .app-shell { grid-template-columns: 1fr; gap: 30px; padding-top: 20px; }
  .site-page .app-side { position: static; display: block; padding: 0 0 18px; border-bottom: 1px solid var(--line); overflow: visible; }
  .site-page .app-side__title { display: none; }
  .site-page .app-side__links { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
  .site-page .app-side .side-link { justify-content: center; }
  .site-page .app-content { width: 100%; }
  .site-page .dest-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .site-page .footer__cols { gap: 32px; grid-template-columns: 1.4fr 1fr 1fr; }
  .site-page .footer__brand { grid-column: 1 / -1; }
  .site-page .footer__brand p { max-width: 50ch !important; }
}
@media (max-width: 767px) {
  .site-page .container { padding-inline: 24px; }
  .site-page .section { padding-block: 48px; }
  .site-page .section--tight { padding-block: 20px 48px; }
  .site-page .section__head { margin-bottom: 28px; }
  .site-page .page-hero { padding-block: 44px 30px; }
  .site-page .section__head .sub { font-size: 15px; }
  .site-page .brand { font-size: 23px; gap: 8px; }
  .site-page .brand__mark { width: 31px; height: 28px; }
  .site-page .nav-ready .nav__panel { padding-inline: 24px; }
  .site-page .grid.cols-2, .site-page .grid.cols-3, .site-page .grid.cols-4, .site-page .plans, .site-page .content-grid { grid-template-columns: 1fr; }
  .site-page .plan-card { padding: 28px; }
  .site-page .card, .site-page .surface { padding: 24px; }
  .site-page .blog-card { padding: 0; }
  .site-page .app-shell { padding-bottom: 36px; }
  .site-page .app-side__links { gap: 4px; }
  .site-page .app-side .side-link { padding: 10px 4px; gap: 7px; font-size: 12px; }
  .site-page .app-side .side-link svg { width: 16px; height: 16px; }
  .site-page .dash-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .site-page .deal-hero { grid-template-columns: 1fr; padding: 24px; gap: 20px; }
  .site-page .dhero__right { min-width: 0; text-align: left; }
  .site-page .compare { font-size: 12px; }
  .site-page .compare th, .site-page .compare td { padding: 12px 10px; overflow-wrap: anywhere; }
  .site-page .compare thead th { font-size: 12px; }
  .site-page .cms-grow { min-width: min(220px, 100%); }
  .site-page table.cms-table { display: block; max-width: 100%; overflow-x: auto; }
  .site-page table.cms-table :where(th, td) { min-width: 100px; }
  .site-page .cms-card { padding: 20px; }
  .site-page .reistiles { grid-template-columns: 1fr; }
  .site-page .cta-band { padding: 36px 24px; }
  .site-page .site-footer { padding-top: 44px; margin-top: 40px; }
  .site-page .footer__cols { gap: 28px 20px; }
  .site-page .footer__bottom { margin-top: 32px; }
}
@media (max-width: 559px) {
  .site-page .container { padding-inline: 20px; }
  .site-page .nav-ready .nav__panel { padding-inline: 20px; }
  .site-page .nav__panel .nav__links { grid-template-columns: 1fr; }
  .site-page .nav__panel .nav__actions { flex-direction: column; }
  .site-page .dest-grid { grid-template-columns: 1fr; }
  .site-page .app-side .side-link { flex-direction: column; gap: 6px; font-size: 11px; }
  .site-page .app-side .side-link svg { width: 19px; height: 19px; }
  .site-page .plan-card { padding: 26px 20px; }
  .site-page .card, .site-page .surface { padding: 24px 20px; }
  .site-page .blog-card { padding: 0; }
  .site-page .compare { table-layout: fixed; width: 100%; }
  .site-page .compare th:first-child, .site-page .compare td:first-child { width: 43%; }
  .site-page .compare th, .site-page .compare td { padding: 12px 8px; }
  .site-page .filterbar select { flex: 1 1 150px; width: 100%; }
  .site-page .sortseg { width: 100%; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .site-page .sortseg button { padding-inline: 7px; font-size: 12px; }
  .site-page .deal { flex-wrap: wrap; }
  .site-page .deal .when { margin-left: 0; }
  .site-page .deals-gate__overlay { padding: 12px; }
  .site-page .deals-gate__cta { padding: 24px 18px; }
  .site-page .empty { padding: 36px 20px; }
  .site-page .empty .cta-row { flex-direction: column; align-items: stretch; }
  .site-page .footer__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .site-page .footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 359px) {
  .site-page .container { padding-inline: 16px; }
  .site-page .nav-ready .nav__panel { padding-inline: 16px; }
  .site-page .brand { font-size: 21px; }
  .site-page .brand__mark { width: 27px; }
  .site-page .nav__toggle { padding-inline: 9px; }
  .site-page .metric { padding: 14px 12px; }
  .site-page .cta-row .btn { max-width: 100%; }
  .site-page .card, .site-page .surface { padding: 22px 16px; }
  .site-page .blog-card { padding: 0; }
  .site-page .dcard { padding: 18px; }
  .site-page .dcard__img { margin: -18px -18px 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .site-page *, .site-page *::before, .site-page *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .site-page .btn:active, .site-page a.dcard[href]:hover, .site-page .reistile:hover { transform: none; }
}
