/* SPL Transportation — light theme (Kinesina, oct 2026)
   Palette: navy #0B1B3A · royal #1E3A8A · periwinkle #A1B2D6 · cream #E7E2D9 · gold #B48A5A
   Loaded after the page's inline <style>. The site is built on CSS variables, so the light
   theme remaps them; dark areas (hero, top bar, final CTA, footer, photo cards) get the
   dark values back through a scoped block. */

:root{
  --navy:#0B1B3A; --royal:#1E3A8A; --peri:#A1B2D6; --cream:#E7E2D9; --gold:#B48A5A;
  --gold-dark:#8A6436;          /* gold for small text on light backgrounds (AA) */
  --gold-light:#D8B98E;         /* gold for small text on navy */
  --paper:#F7F4EF;              /* page background */
  --card:#FFFFFF;

  /* remap of the original variables (light) */
  --black:#F7F4EF;              /* page / surface background */
  --black-soft:#EFEAE1;         /* alternate band */
  --white:#0B1B3A;              /* main text + primary button */
  --silver:#3C4A66;             /* body text (7.9:1 on paper) */
  --silver-dim:#5A6680;         /* labels / small caps (5.4:1) */
  --line:#DCD4C6;
  --blue:#1E3A8A;
  --blue-light:#A1B2D6;
}

/* ---------- dark scopes: same variables, dark values ---------- */
.ticker-bar, .hero, .booking, footer,
.service-card .label, .fleet-spec, .team-label, .lstrip-section{
  --black:#0B1B3A; --black-soft:#13254A; --white:#F7F4EF;
  --silver:#D3DAEA; --silver-dim:#A1B2D6; --line:rgba(161,178,214,.22);
  color:var(--white);
}

body{background:var(--paper); color:var(--navy);}
::selection{background:var(--peri); color:var(--navy);}
:focus-visible{outline:2px solid var(--royal); outline-offset:3px;}

/* ---------- top bar ---------- */
.ticker-bar{background:var(--navy); border-bottom:0;}
.ticker-track .ok{color:var(--gold-light);}

/* ---------- nav ---------- */
nav{background:rgba(247,244,239,.94); border-bottom:1px solid var(--line); box-shadow:0 1px 0 rgba(11,27,58,.03);}
.brand img{border-radius:6px;}
.nav-links a{color:#3C4A66;}
.nav-links a:hover{color:var(--royal);}
.nav-phone{border-color:#CFC6B6;}
.nav-phone svg{color:var(--royal);}
.nav-phone:hover{border-color:var(--navy); color:var(--navy);}
.nav-cta{background:var(--navy); color:var(--paper);}
.nav-cta:hover{background:var(--royal);}
.nav-quote{border-color:var(--navy) !important; color:var(--navy) !important;}
.nav-quote:hover{background:var(--navy); color:var(--paper) !important;}
.lang-toggle{border-color:#CFC6B6;}
.lang-toggle button[aria-pressed="true"], .lang-toggle a[aria-current="true"]{background:var(--navy); color:var(--paper);}
.nav-mobile-toggle{border-color:#CFC6B6; color:var(--navy);}

/* ---------- promo strip ---------- */
.promo{background:var(--royal); color:#F7F4EF;}
.promo code{background:#F7F4EF; color:var(--navy);}
.promo a{color:#F7F4EF;}

/* ---------- hero (photo + navy overlay) ---------- */
.hero{background-color:var(--navy);}
.hero::after{background:linear-gradient(0deg, rgba(11,27,58,.96) 0%, rgba(11,27,58,.62) 42%, rgba(11,27,58,.18) 70%, rgba(11,27,58,.50) 100%);}
.hero h1{color:#F7F4EF;}
.hero h1 em{color:var(--gold-light);}
.hero p.sub{color:#E3E8F3;}
.eyebrow .dot{background:var(--gold); box-shadow:0 0 8px rgba(180,138,90,.8);}
.hero .eyebrow{color:#F7F4EF; text-shadow:0 1px 10px rgba(11,27,58,.9), 0 0 2px rgba(11,27,58,.6);}
.hero .btn-primary, .booking .btn-primary{background:var(--gold); color:var(--navy);}
.hero .btn-primary:hover, .booking .btn-primary:hover{background:var(--gold-light); color:var(--navy);}
.hero .btn-secondary, .booking .btn-secondary{border-color:rgba(247,244,239,.6); color:#F7F4EF;}
.hero .btn-secondary:hover, .booking .btn-secondary:hover{border-color:#F7F4EF; background:rgba(247,244,239,.08);}
.crumbs{color:#E3E8F3; text-shadow:0 1px 10px rgba(11,27,58,.9), 0 0 2px rgba(11,27,58,.6);}
.crumbs a{color:#F7F4EF;}
.hero .eyebrow{font-weight:700;}

/* ---------- buttons on light ---------- */
.btn-primary{background:var(--navy); color:var(--paper);}
.btn-primary:hover{background:var(--royal); color:var(--paper);}
.btn-secondary{border-color:var(--navy); color:var(--navy);}
.btn-secondary:hover{border-color:var(--royal); color:var(--royal); background:rgba(30,58,138,.05);}
.mobile-menu .mm-cta .btn-primary{color:var(--paper);}

/* ---------- section titles ---------- */
.section-head .eyebrow, .section .eyebrow{color:var(--royal);}
.section-head p{color:#3C4A66;}

/* ---------- guarantee + pillars ---------- */
.guarantee{background:var(--card); border-bottom:1px solid var(--line);}
.g-item svg{color:var(--gold);}
.g-item b{color:var(--navy);}
.pillars{background:var(--black-soft);}

/* ---------- rates ---------- */
.rate-card{background:var(--card); border-color:var(--line); box-shadow:0 1px 2px rgba(11,27,58,.04), 0 8px 24px rgba(11,27,58,.05);}
.rate-card:hover{border-color:var(--peri); box-shadow:0 2px 4px rgba(11,27,58,.05), 0 14px 32px rgba(11,27,58,.09);}
.rate-card.featured{border:1.5px solid var(--gold);}
.rate-card .badge{background:var(--gold); color:var(--navy);}
.rate-card .route{color:var(--royal);}
.rate-card .price{color:var(--navy);}
.rate-card li::before{background:var(--gold);}
.rate-card .rate-link{color:var(--royal);}
.rate-card .rate-link:hover{color:var(--navy);}
.more-rates{background:var(--card); border-color:var(--line);}
.mr-grid{background:var(--line); border-color:var(--line);}
.mr-item{background:var(--paper);}
.mr-item .r{color:var(--royal);}

/* ---------- photo cards: navy overlays, light text ---------- */
.service-card::after{background:linear-gradient(0deg, rgba(11,27,58,.94) 0%, rgba(11,27,58,.18) 55%, rgba(11,27,58,.40) 100%);}
.service-card .label h3{color:#F7F4EF;}
.service-card .from, .team-label .role small{color:var(--gold-light);}
.fleet-spec{background:linear-gradient(0deg, rgba(11,27,58,.95), transparent);}
.team-card::after{background:linear-gradient(0deg, rgba(11,27,58,.92) 0%, transparent 48%);}
.services-grid, .team-grid, .fleet-grid, .gallery-strip{background:var(--paper);}
.fleet-card, .team-card, .gallery-item, .service-card{background:var(--navy);}

/* ---------- logo strip ---------- */
.lstrip-section{background:var(--navy); border-color:transparent;}
.lstrip-track-wrap::before{background:linear-gradient(90deg,var(--navy),transparent);}
.lstrip-track-wrap::after{background:linear-gradient(-90deg,var(--navy),transparent);}
.lstrip-item{border-right-color:rgba(161,178,214,.18);}
.lstrip-item img{border-radius:12px; box-shadow:0 6px 18px rgba(0,0,0,.25);}
.lstrip-label{color:var(--peri);}

/* ---------- quote form ---------- */
.quote-form{background:var(--card); border-color:var(--line); box-shadow:0 8px 28px rgba(11,27,58,.06);}
.quote-form label{color:var(--silver-dim);}
.quote-form input, .quote-form select{background:var(--paper); border-color:#D3CABA; color:var(--navy);}
.quote-form input::placeholder{color:#8792A8;}
.quote-form input:focus, .quote-form select:focus{border-color:var(--royal); box-shadow:0 0 0 3px rgba(30,58,138,.12);}
.quote-form .alt a{color:var(--royal);}
.quote-side .resp{background:var(--card); border-color:var(--line);}
.quote-side .resp .dot{background:var(--gold); box-shadow:0 0 8px rgba(180,138,90,.7);}

/* ---------- reviews ---------- */
.trust-section{background:var(--black-soft);}
.google-rating-badge{background:var(--card); border-color:var(--line);}
.testimonials-grid{background:var(--line);}
.tcard{background:var(--card);}
.tcard-text{color:#3C4A66;}
.tcard-avatar{background:var(--royal); color:#F7F4EF;}
.tcard-bbb, .bbb-card{background:var(--paper) !important;}

/* ---------- FAQ ---------- */
.faq-item summary:hover{color:var(--royal);}
.faq-item[open] .faq-icon{color:var(--gold-dark);}

/* ---------- route pages ---------- */
.fact{background:var(--card);}
.facts{background:var(--line); border-color:var(--line);}
.steps li::before{border-color:var(--gold); color:var(--navy); background:var(--card);}

/* ---------- final CTA ---------- */
.booking{background:linear-gradient(135deg, var(--navy) 0%, var(--royal) 100%); border-top:0;}
.booking .eyebrow{color:var(--peri);}
.booking .eyebrow .dot{background:var(--gold); box-shadow:0 0 8px rgba(180,138,90,.8);}
.booking h2{color:#F7F4EF;}
.booking p{color:#DCE3F1;}
.booking-note{color:var(--peri);}

/* ---------- footer ---------- */
footer{background:var(--navy); border-top:0;}
footer .footer-brand img{border-radius:6px;}
.footer-col h4{color:var(--gold-light);}

/* ---------- mobile menu + bottom bar ---------- */
.mobile-menu{background:var(--paper);}
.mobile-menu a{color:var(--navy);}
.mobile-menu .mm-close{color:var(--navy); border-color:#CFC6B6;}
.sticky-cta{background:rgba(247,244,239,.97); border-top:1px solid var(--line); box-shadow:0 -6px 20px rgba(11,27,58,.08);}
.sticky-cta .s-book{background:var(--navy); color:var(--paper);}
.sticky-cta .s-call{border-color:#CFC6B6; color:var(--navy);}
body .sticky-cta .s-quote{border:1px solid var(--navy); color:var(--navy);}
.wa-float{box-shadow:0 8px 24px rgba(11,27,58,.25);}

/* ---------- Book / Quote pop-up (lead.js) ---------- */
body .spl-lead-bg{background:rgba(11,27,58,.55);}
body .spl-lead{background:var(--paper); color:var(--navy); border-color:var(--line); box-shadow:0 24px 60px rgba(11,27,58,.25);}
body .spl-lead h3{color:var(--navy);}
body .spl-lead p.sub, body .spl-lead .foot{color:#3C4A66;}
body .spl-lead .x{color:var(--navy);}
body .spl-lead label{color:var(--silver-dim);}
body .spl-lead input, body .spl-lead select{background:var(--card); border-color:#D3CABA; color:var(--navy);}
body .spl-lead input:focus, body .spl-lead select:focus{border-color:var(--royal);}
body .spl-lead .choice.book{background:var(--navy); color:var(--paper); border-color:var(--navy);}
body .spl-lead .choice.book span{color:#D3DAEA;}
body .spl-lead .choice.quote{background:var(--card); color:var(--navy); border:1.5px solid var(--gold);}
body .spl-lead .choice.quote b{color:var(--gold-dark);}
body .spl-lead .choice.quote span{color:#3C4A66;}
body .spl-lead .err{color:#B42318;}
body .spl-lead .ok p{color:#3C4A66;}
body .spl-lead .ok .row a{background:var(--navy); color:var(--paper);}
body .spl-lead .ok .row button{color:var(--navy); border-color:var(--navy);}

/* ---------- v2: reviews badge, hero rates board, extra routes (oct 2026) ---------- */
.hero-reviews{display:inline-flex; align-items:center; gap:8px; margin-bottom:16px; padding:7px 14px; border-radius:999px;
  background:rgba(11,27,58,.6); border:1px solid rgba(247,244,239,.28); color:#F7F4EF; font-size:13px; font-weight:600;
  letter-spacing:.2px; backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); transition:border-color .2s;}
.hero-reviews .stars{color:#FBBC05; letter-spacing:1px; font-size:13px;}
.hero-reviews:hover{border-color:var(--gold-light);}
.hero-board{margin-top:28px; max-width:440px; background:rgba(11,27,58,.84); border:1px solid rgba(161,178,214,.3);
  border-radius:10px; padding:18px 20px 14px; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  box-shadow:0 18px 40px rgba(0,0,0,.28);}
.hb-head{display:flex; justify-content:space-between; align-items:baseline; gap:12px; margin-bottom:8px; flex-wrap:wrap;}
.hb-head b{font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:.6px; font-size:16px; color:#F7F4EF;}
.hb-head span{font-family:'Space Mono',monospace; font-size:10px; letter-spacing:1px; color:var(--peri); text-transform:uppercase;}
.hb-row{display:flex; justify-content:space-between; align-items:center; gap:14px; padding:9px 0;
  border-top:1px solid rgba(161,178,214,.18); color:#F7F4EF; font-size:14px;}
.hb-row b{font-family:'Oswald',sans-serif; font-size:22px; font-weight:700; color:var(--gold-light); letter-spacing:.3px;}
.hb-row:hover span{text-decoration:underline; text-underline-offset:3px;}
.hb-foot{margin-top:8px; font-size:12px; color:#D3DAEA;}
@media (min-width:1100px){
  .hero.has-board .hero-content{position:relative;}
  .hero.has-board .hero-board{position:absolute; right:28px; bottom:60px; width:390px; margin:0;}
  .hero.has-board h1, .hero.has-board p.sub{max-width:calc(100% - 440px);}
}
@media (max-width:560px){ .hero-board{padding:14px 16px 10px;} .hb-row{font-size:13.5px;} .hb-row b{font-size:20px;} .hero-reviews{font-size:12px;} }
.mr-h2{font-size:18px; margin:6px 0 14px;}
.mr-grid-3{grid-template-columns:repeat(3,1fr);}
@media (max-width:900px){ .mr-grid-3{grid-template-columns:1fr;} }
