/* Top Hat Transportation — the white version, for Patrick to compare against the dark one.
   Loaded AFTER site.css and overrides it. Nothing here touches the live dark site.

   Two rules drove every value below:
   1. The brand gold stays bright (#e3b04a) wherever it is a BACKGROUND, because dark text on it
      reads at about 9:1. Wherever gold is TEXT it has to darken to #8f6614, because #e3b04a on
      white is 1.9:1 and unreadable, and half his customers are over 60.
   2. The dark site's depth comes from glows on black. On white, glows read as smudges, so they
      come down hard and the depth comes from hairlines and soft shadow instead. */

:root{
  --ground:#ffffff;
  --ground-2:#f7f5f1;          /* alternating bands, so the page still has rhythm */
  --cream:#1b1e21;             /* was the light text colour, now the ink */
  --cream-dim:#4a5157;
  --cream-faint:#6c747b;
  --edge:rgba(27,30,33,.15);
  --ink-gold:#8f6614;          /* gold that survives on white: 5.2:1 */
}

/* the film grain is lovely on black and dirty on white */
body::after{opacity:.022}

/* ---------- nav ---------- */
.nav{background:rgba(255,255,255,.92);border-bottom:1px solid rgba(27,30,33,.1)}
.brand .wm b{color:var(--ink-gold)}
.nav .links a{color:var(--cream-dim)}
.nav .links a:hover,.nav .links a[aria-current]{color:var(--ink-gold);text-shadow:none}
.navphone{color:var(--cream)}
.burger{color:var(--cream)}
.navcta{box-shadow:0 4px 16px rgba(168,122,36,.28)}
.navcta:hover{box-shadow:0 6px 22px rgba(168,122,36,.42)}

/* ---------- the glows come down ---------- */
.hero::before{background:radial-gradient(circle,rgba(227,176,74,.2),transparent 65%)}
.hero::after{background:radial-gradient(circle,rgba(143,179,201,.18),transparent 65%)}
.band::before{background:radial-gradient(circle,rgba(227,176,74,.18),transparent 66%)}
.band::after{background:radial-gradient(circle,rgba(143,179,201,.14),transparent 66%)}
.banner::before{background:radial-gradient(circle,rgba(227,176,74,.16),transparent 65%)}
.hero .mark img{filter:drop-shadow(0 18px 44px rgba(20,24,28,.18))}

/* ---------- type ---------- */
.eyebrow{color:var(--ink-gold);text-shadow:none}
.hero h1 em{color:var(--ink-gold);text-shadow:none}
.prose strong,.prose h3,.legal b{color:var(--cream)}

/* ---------- 24/7 strip ---------- */
.hours247{background:linear-gradient(120deg,rgba(227,176,74,.16),rgba(27,30,33,.02));
  border-color:rgba(168,122,36,.3)}
.hours247 b{color:var(--ink-gold);text-shadow:none}

/* ---------- buttons ---------- */
.btn{box-shadow:0 6px 20px rgba(168,122,36,.26)}
.btn:hover{box-shadow:0 10px 28px rgba(168,122,36,.4)}
.btn.ghost{color:var(--cream);border:1px solid rgba(27,30,33,.28)}
.btn.ghost:hover{border-color:var(--ink-gold);box-shadow:none}

/* ---------- cards, rate table, slots ---------- */
.card{background:linear-gradient(158deg,rgba(27,30,33,.035),rgba(27,30,33,.012));
  box-shadow:0 12px 34px rgba(20,24,28,.07)}
.card:hover{border-color:rgba(168,122,36,.45);
  box-shadow:0 16px 40px rgba(20,24,28,.11)}
.card .ic{background:linear-gradient(90deg,var(--gold),rgba(227,176,74,.2));box-shadow:none}
.rates{background:linear-gradient(158deg,rgba(27,30,33,.03),rgba(27,30,33,.01))}
.rates .grp{border-top-color:rgba(27,30,33,.1)}
.rate{border-top:1px solid rgba(27,30,33,.09)}
.rate .p{color:var(--ink-gold);text-shadow:none}
.chip{color:var(--ink-gold);border-color:rgba(168,122,36,.4)}
.ratefoot b{color:var(--ink-gold)}
.slot{background:linear-gradient(158deg,rgba(227,176,74,.08),rgba(27,30,33,.012));
  border-color:rgba(168,122,36,.42)}
.slot b{color:var(--ink-gold)}
.trust span::before{box-shadow:none}
.prose li::before{box-shadow:none}

/* ---------- form ---------- */
.field label{color:var(--ink-gold)}
.field input,.field textarea{background:#fff;color:var(--cream);border-color:rgba(27,30,33,.22)}
.field input::placeholder,.field textarea::placeholder{color:#9aa1a7}
.field input:focus,.field textarea:focus{border-color:var(--ink-gold);
  box-shadow:0 0 0 3px rgba(168,122,36,.16)}
.thanks{background:linear-gradient(158deg,rgba(227,176,74,.14),rgba(27,30,33,.02));
  border-color:rgba(168,122,36,.4)}
.thanks h3{color:var(--ink-gold)}
.formnote a,.legal a{color:var(--ink-gold)}
.consent input[type=checkbox]{accent-color:var(--ink-gold)}

/* ---------- footer ---------- */
.ft{background:#f2efe9;border-top:1px solid rgba(27,30,33,.1)}
.ft h4{color:var(--ink-gold)}
.ft a:hover{color:var(--ink-gold)}
.ft .bot{border-top-color:rgba(27,30,33,.1)}

/* ---------- phone drawer ---------- */
@media(max-width:1400px){
  .drawer{background:rgba(255,255,255,.985);border-bottom-color:rgba(27,30,33,.12)}
  .drawer a{color:var(--cream);border-bottom-color:rgba(27,30,33,.08)}
}

/* ---------- photos ---------- */
.photoband img{border-color:rgba(27,30,33,.12)}