/* ============================================================
   SSVT — "Modern Corporate Navy" theme layer
   Loaded after style.css / animations.css / responsive.css.
   Palette: deep navy #0a192f + amber accent, Outfit / Figtree.
   ============================================================ */

:root{
  /* surfaces */
  --white:#ffffff;
  --off-white:#f4f7fb;
  --sand:#e8edf3;
  --charcoal:#0a192f;
  --ink:#0f1b3d;
  --deep-grey:#1e3a5f;
  --grey:#5b6b85;
  --light-grey:#9bb0c8;
  --line:#e2e8f0;

  /* accent (legacy tokens keep their names, new values) */
  --red:#f59e0b;
  --red-dark:#d97706;
  --red-soft:rgba(245,158,11,.14);

  /* navy support tokens */
  --navy:#0a192f;
  --navy-2:#112240;
  --navy-3:#1e3a5f;
  --amber:#f59e0b;
  --amber-2:#fbbf24;

  /* squarer, more corporate geometry */
  --radius-s:8px;
  --radius:12px;
  --radius-l:16px;

  --shadow-s:0 2px 8px rgba(10,25,47,.08);
  --shadow:0 14px 40px -18px rgba(10,25,47,.30);
  --shadow-l:0 32px 70px -30px rgba(10,25,47,.45);

  --font-display:"Outfit","Space Grotesk",system-ui,sans-serif;
  --font-body:"Figtree","DM Sans",system-ui,-apple-system,sans-serif;
}

h1,h2,h3,h4{font-weight:800;letter-spacing:-.025em;}

/* ---------- buttons: amber primary on navy ---------- */
.btn{
  border-radius:10px;
  font-weight:700;
  letter-spacing:.005em;
  box-shadow:0 10px 24px -14px rgba(245,158,11,.85);
}
.btn:not(.btn--ghost):not(.btn--light):not(.btn--outline-light){
  --btn-bg:var(--amber);--btn-fg:#0a192f;
}
.btn:not(.btn--ghost):not(.btn--light):not(.btn--outline-light):hover{
  background:var(--amber-2);
  box-shadow:0 0 22px rgba(245,158,11,.42);
}
.btn--ghost{--btn-fg:var(--navy);--btn-bd:rgba(10,25,47,.18);}
.btn--ghost:hover{--btn-bg:var(--navy);--btn-fg:#fff;--btn-bd:var(--navy);}
.btn--light{--btn-bg:#fff;--btn-fg:var(--navy);}
.btn--light:hover{--btn-bg:var(--amber);--btn-fg:var(--navy);}
.btn--outline-light{--btn-bd:rgba(255,255,255,.28);}
.link-red{color:var(--navy-3);}
.link-red:hover{color:var(--amber-2);}

/* ---------- navigation: always solid navy ---------- */
.nav{
  background:#fff;
  border-bottom:1px solid rgba(0,0,0,.08);
  box-shadow:0 2px 12px -4px rgba(0,0,0,.12);
}
.nav.is-solid,.nav.is-inner{
  background:#fff;
  backdrop-filter:blur(14px);
  border-color:rgba(0,0,0,.08);
}
.brand__mark{
  background:var(--amber);color:var(--navy);border-radius:8px;
  box-shadow:0 8px 20px -12px rgba(245,158,11,.9);
}
.brand__name,.nav.is-solid .brand__name,.nav--over .brand__name{color:#fff;}
.brand__sub,.nav.is-solid .brand__sub,.nav--over .brand__sub{color:var(--amber);}
.nav__menu a,
.nav.is-solid .nav__menu a,
.nav--over .nav__menu a{color:var(--ink);font-weight:600;}
.nav__menu a:hover,
.nav__menu a.is-active{color:var(--amber);}
.nav__menu a::after{background:var(--amber);}
.nav__phone,.nav.is-solid .nav__phone,.nav--over .nav__phone{color:var(--ink);}
.nav__cta .btn{border-radius:999px;}
.burger{background:rgba(0,0,0,.05);border-color:rgba(0,0,0,.15);}
.burger span{background:var(--ink);}
.mobile-panel{background:var(--navy);color:#fff;}
.mobile-panel a{border-bottom-color:rgba(255,255,255,.1);color:#fff;}
.mobile-panel a.is-active{color:var(--amber);}

/* ---------- hero: split-screen navy wash ---------- */
.hero{background:var(--navy);min-height:min(100svh,860px);}

.hero__inner{max-width:min(1280px,92vw);}
.hero__badge{
  background:rgba(245,158,11,.10);
  border:1px solid rgba(245,158,11,.30);
  color:var(--amber);
  border-radius:999px;
  text-transform:uppercase;
  letter-spacing:.10em;
  font-size:.72rem;
  font-weight:800;
}
.hero__badge b{color:var(--amber);}
.hero__badge .dot{background:var(--amber);box-shadow:0 0 0 4px rgba(245,158,11,.22);}
.hero h1{max-width:14ch;font-weight:800;}
.hero h1 em{color:var(--amber);}
.hero__text{color:rgba(203,213,225,.86);}
.hero__highlights .icon{color:var(--amber);}
.hero__scroll{color:rgba(226,232,240,.5);}

/* ---------- inner page hero ---------- */
.page-hero{background:var(--navy);}
.page-hero::after{background:linear-gradient(90deg,rgba(10,25,47,.96),rgba(10,25,47,.55));}
.page-hero__media{opacity:.28;}
.crumbs a:hover{color:var(--amber);}

/* ---------- booking widget: glass card over the hero ---------- */
.booking__card{
  background:rgba(255,255,255,.96);
  border:1px solid var(--line);
  border-radius:16px;
  box-shadow:0 40px 80px -40px rgba(10,25,47,.55);
}
.field label{color:var(--navy-3);letter-spacing:.14em;}
.field input,.field select,.field textarea{
  border-radius:8px;
  border-color:var(--line);
  background:#f8fafc;
}
.field input:focus,.field select:focus,.field textarea:focus{
  border-color:var(--amber);
  box-shadow:0 0 0 4px var(--red-soft);
}
.field .err{color:#dc2626;}
.field.has-error input,.field.has-error select,.field.has-error textarea{border-color:#dc2626;}

/* ---------- accents across sections ---------- */
.eyebrow{color:var(--amber);font-weight:800;}
.eyebrow::before{background:var(--amber);}
.section--dark{background:var(--navy);}
.section--tint{background:var(--off-white);}
.stat b .suffix{color:var(--amber);}
.about-points .icon,.bullets .icon{color:var(--amber);}
.about-media__badge{background:var(--amber);color:var(--navy);}
.about-media img,.rental-block__media{border-radius:16px;}
.rental-block__num{background:rgba(10,25,47,.78);}

.veh-card{border-radius:16px;}
.veh-card:hover{border-color:rgba(245,158,11,.45);}
.veh-card__tag{background:var(--amber);color:var(--navy);}

/* footer + misc dark surfaces */
.footer,.site-footer{background:#fff;color:var(--grey);}
.footer h4{color:var(--ink);}
.footer a{color:var(--grey);}
.footer a:hover{color:var(--amber);}
.footer__links a:hover{color:var(--amber);}
.footer .brand__sub{color:var(--grey);}
.footer .brand__name{color:var(--ink);}
.footer__bottom{border-top-color:var(--line);color:var(--grey);}
.footer__about p{color:var(--grey);}
.socials a{border-color:var(--line);color:var(--grey);}
.socials a:hover{background:var(--amber);border-color:var(--amber);color:#fff;}::selection{background:var(--amber);color:var(--navy);}


/* ============================================================
   SECTION DESIGN ENHANCEMENTS — theme overrides
   ============================================================ */

/* Dot grid pattern on tint sections */
.section--tint {
  background-image: radial-gradient(circle, rgba(245,158,11,.07) 1px, transparent 1px);
  background-size: 30px 30px;
}

/* Eyebrow pill color */
.eyebrow { color:var(--amber); }

/* corporate section */
.section--navy { background-image: linear-gradient(135deg, var(--navy) 0%, #0d2b4e 100%) !important; }