/* ==========================================================================
   CA Fuel Supply - styles.css
   Palette + type derived from the company logo (red + amber on warm neutrals).
   No framework, no Tailwind. Hand-authored.
   ========================================================================== */

/* ---- Fonts (self-hosted Barlow / Barlow Condensed) ---------------------- */
@font-face{font-family:'Barlow';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/Barlow_400.woff2') format('woff2');}
@font-face{font-family:'Barlow';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/Barlow_500.woff2') format('woff2');}
@font-face{font-family:'Barlow';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/Barlow_600.woff2') format('woff2');}
@font-face{font-family:'Barlow';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/Barlow_700.woff2') format('woff2');}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/Barlow_Condensed_500.woff2') format('woff2');}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/Barlow_Condensed_600.woff2') format('woff2');}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/Barlow_Condensed_700.woff2') format('woff2');}
/* Oswald (variable) for sharp, readable nav and small UI text */
@font-face{font-family:'Oswald';font-style:normal;font-weight:300 600;font-display:swap;src:url('../fonts/Oswald.woff2') format('woff2');}

/* ---- Tokens ------------------------------------------------------------- */
:root{
  --ink:#242019;
  --asphalt:#1d1813;
  --steel:#2C333A;
  --red:#d92d20;
  --red-deep:#b3241a;
  --amber:#d9961f;
  --amber-deep:#8f5f10;
  --paper:#f8f4ec;
  --bone:#fdfbf6;
  --line:#e7e0d3;
  --near:#242019;
  --body:#2b261f;
  --muted:#6f665b;
  --tan:#d8c7aa;
  --white:#ffffff;

  /* One clean, normal-width system stack everywhere. No condensed/decorative
     display faces; weight + letter-spacing carry the hierarchy instead. */
  --sans:system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  --disp:var(--sans);
  --ui:var(--sans);

  --wrap:1200px;
  --gut:clamp(20px,5vw,40px);
  --sect:clamp(64px,9vw,120px);
  --radius:4px;
  --shadow:0 18px 40px -24px rgba(23,18,14,.45);
  --shadow-sm:0 8px 20px -16px rgba(23,18,14,.5);
  --ring:0 0 0 3px rgba(216,154,44,.55);
}

/* ---- Reset / base ------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}
body{
  margin:0;font-family:var(--sans);color:var(--body);background:var(--paper);
  font-size:1.0625rem;line-height:1.62;
}
img{max-width:100%;height:auto;display:block;}
a{color:var(--red-deep);text-decoration:none;}
a:hover{color:var(--red);}
h1,h2,h3,h4{font-family:var(--disp);color:var(--ink);line-height:1.06;margin:0 0 .4em;
  font-weight:700;letter-spacing:.01em;}
h1{font-size:clamp(2.5rem,5.4vw,4rem);text-transform:uppercase;}
h2{font-size:clamp(1.85rem,3.6vw,2.7rem);text-transform:uppercase;}
h3{font-size:clamp(1.25rem,2vw,1.55rem);}
p{margin:0 0 1.1em;}
strong{font-weight:600;color:var(--ink);}
:focus-visible{outline:none;box-shadow:var(--ring);border-radius:3px;}
::selection{background:var(--amber);color:var(--ink);}

/* ---- Layout helpers ----------------------------------------------------- */
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut);}
.section{padding-block:var(--sect);}
.section--tight{padding-block:clamp(44px,6vw,72px);}
.section--paper{background:var(--paper);}
.section--bone{background:var(--bone);}
.section--ink{background:var(--ink);color:#E8E0D4;}
.section--ink h1,.section--ink h2,.section--ink h3{color:#fff;}
.section--steel{background:linear-gradient(160deg,var(--ink),var(--steel));color:#E8E0D4;}
.section--steel h2,.section--steel h3{color:#fff;}
.lead{font-size:clamp(1.1rem,1.7vw,1.3rem);color:var(--body);max-width:62ch;}
.section--ink .lead,.section--steel .lead{color:#D9CFBF;}
.center{text-align:center;}
.measure{max-width:64ch;}
.mt0{margin-top:0;} .mb0{margin-bottom:0;}

/* Eyebrow kicker */
.eyebrow{font-family:var(--ui);font-weight:600;text-transform:uppercase;
  letter-spacing:.08em;font-size:.82rem;color:var(--amber-deep);
  display:inline-flex;align-items:center;gap:.6rem;margin-bottom:.7rem;}
.eyebrow::before{content:"";width:26px;height:2px;background:var(--red);display:inline-block;}
.section--ink .eyebrow,.section--steel .eyebrow{color:var(--amber);}

/* ---- Buttons ------------------------------------------------------------ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
  font-family:var(--ui);font-weight:600;text-transform:uppercase;letter-spacing:.04em;
  font-size:1rem;line-height:1;padding:.95rem 1.5rem;border-radius:var(--radius);
  border:2px solid transparent;cursor:pointer;transition:transform .12s ease,background .15s ease,
  color .15s ease,border-color .15s ease;white-space:nowrap;}
.btn:active{transform:translateY(1px);}
.btn--primary{background:var(--red);color:#fff;border-color:var(--red);}
.btn--primary:hover{background:var(--red-deep);border-color:var(--red-deep);color:#fff;}
.btn--ghost{background:transparent;color:var(--ink);border-color:var(--ink);}
.btn--ghost:hover{background:var(--ink);color:#fff;}
.btn--amber{background:var(--amber);color:var(--near);border-color:var(--amber);font-weight:600;}
.btn--amber:hover{background:#c8861a;border-color:#c8861a;color:var(--near);}
.section--ink .btn--ghost,.section--steel .btn--ghost,.hero .btn--ghost,.pagehero .btn--ghost{color:#fff;border-color:rgba(255,255,255,.65);}
.section--ink .btn--ghost:hover,.section--steel .btn--ghost:hover,.hero .btn--ghost:hover,.pagehero .btn--ghost:hover{background:#fff;color:var(--ink);border-color:#fff;}
.btn-row{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:1.4rem;}

/* ---- Brand wordmark (logo lockup, built in markup) ---------------------- */
.brand{display:inline-flex;align-items:center;gap:.6rem;color:inherit;}
.brand__mark{flex:0 0 auto;width:34px;height:34px;}
.brand__word{display:flex;flex-direction:column;line-height:.92;font-family:var(--disp);}
.brand__top{font-weight:700;font-size:1.4rem;letter-spacing:.01em;}
.brand__top .ca{color:var(--amber);}
.brand__top .fuel{color:var(--red);}
.brand__sub{font-weight:600;font-size:.74rem;letter-spacing:.2em;color:var(--amber-deep);
  margin-left:.05em;}
.brand--light .fuel{color:#E8503F;}
.brand--light .brand__sub{color:var(--amber);}

/* ---- Header / nav ------------------------------------------------------- */
.topbar{background:#f7f3ea;color:#2b251f;font-size:.86rem;line-height:1.4;
  border-bottom:1px solid rgba(43,37,31,.06);}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;gap:1rem;
  padding-block:.4rem;}
.topbar a{color:#2b251f;}
.topbar a:hover{color:var(--red);}
.topbar__meta{display:flex;gap:1.4rem;align-items:center;}
.topbar__meta span{display:inline-flex;align-items:center;gap:.4rem;}
/* Mobile: one compact warm bar. Tagline on the first line, phone + email
   tightly together on a second line. No bulky height, no ugly wrap. */
@media (max-width:640px){
  .topbar{font-size:13px;}
  .topbar .wrap{flex-direction:column;align-items:center;justify-content:center;
    gap:.1rem;padding-block:.5rem;}
  .topbar__meta{gap:.15rem .9rem;flex-wrap:nowrap;white-space:nowrap;}
  .topbar__meta span,.topbar__meta a{font-size:13px;}
}
/* Very narrow phones: drop the email, keep the tagline + phone on one tidy row. */
@media (max-width:380px){
  .topbar__meta a[href^="mailto"]{display:none;}
}

/* Clean solid white masthead (no translucent scrim) */
.site-header{position:sticky;top:0;z-index:60;background:var(--paper);
  border-bottom:1px solid var(--line);transition:box-shadow .25s ease;}
.site-header.is-solid{box-shadow:var(--shadow-sm);}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding-block:.8rem;}
.nav{display:flex;align-items:center;gap:.1rem;margin-left:auto;}
.nav .btn--portal{margin-left:.45rem;}
.nav a{font-family:var(--ui);font-weight:500;text-transform:uppercase;letter-spacing:.06em;
  font-size:1rem;color:var(--near);padding:.5rem .85rem;border-radius:3px;position:relative;}
.nav a:hover{color:var(--red);}
.nav a[aria-current="page"]{color:var(--red-deep);}
.nav a[aria-current="page"]::after{content:"";position:absolute;left:.8rem;right:.8rem;bottom:.02rem;
  height:2px;background:var(--red);}
.header-cta{display:flex;align-items:center;gap:.6rem;}
.header-cta .btn{padding:.62rem 1rem;font-size:.92rem;}
.nav a.btn--amber{color:var(--near);}
.nav a.btn--primary{color:#fff;}
.nav-toggle{display:none;}

/* Mobile drawer */
@media (max-width:1060px){
  .header-cta .btn--portal{display:none;}
  .nav-toggle{display:inline-flex;flex-direction:column;justify-content:center;gap:5px;
    width:46px;height:42px;background:transparent;border:1px solid var(--line);
    border-radius:4px;cursor:pointer;}
  .nav-toggle span{height:2px;background:var(--ink);border-radius:2px;transition:.2s;}
  .nav{position:fixed;inset:0 0 0 auto;width:min(82vw,360px);background:var(--ink);
    flex-direction:column;align-items:stretch;gap:0;padding:5.5rem 1.4rem 2rem;
    transform:translateX(100%);transition:transform .28s ease;box-shadow:var(--shadow);
    border-left:3px solid var(--red);}
  .nav.is-open{transform:translateX(0);}
  .nav a{padding:.95rem .4rem;font-size:1.2rem;color:#ece0cb;
    border-bottom:1px solid rgba(255,255,255,.08);}
  .nav a:hover{color:#fff;}
  .nav a[aria-current="page"]{color:var(--red);}
  .nav a[aria-current="page"]::after{display:none;}
  .nav .btn--portal{display:inline-flex;margin-top:1.2rem;}
  body.nav-open{overflow:hidden;}
  .nav-scrim{position:fixed;inset:0;background:rgba(10,8,6,.55);z-index:55;opacity:0;
    visibility:hidden;transition:.25s;}
  .nav-scrim.is-open{opacity:1;visibility:visible;}
}

/* ---- Hero --------------------------------------------------------------- */
.hero{position:relative;color:#EFE8DB;overflow:hidden;
  background:
   linear-gradient(100deg,rgba(16,15,13,.86) 0%,rgba(16,15,13,.52) 45%,rgba(16,15,13,.12) 100%),
   url('../img/station-bg.jpg') right center/cover no-repeat,
   var(--ink);}
.hero::before{content:"";position:absolute;inset:0;opacity:.3;pointer-events:none;
  background:repeating-linear-gradient(90deg,rgba(216,154,44,.08) 0 1px,transparent 1px 64px);}
.hero::after{content:"";position:absolute;right:-12%;bottom:-30%;width:560px;height:560px;
  border-radius:50%;border:2px solid rgba(216,154,44,.16);box-shadow:0 0 0 60px rgba(216,154,44,.04);}
.hero .wrap{position:relative;z-index:2;padding-block:clamp(42px,6vw,80px);}
.hero__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2rem,5vw,4rem);align-items:center;}
.hero h1{color:#fff;margin-bottom:.5rem;}
.hero h1 .accent{color:var(--amber);}
.hero__lead{font-size:clamp(1.12rem,1.7vw,1.32rem);color:#D9CFBF;max-width:54ch;}
.hero__panel{background:rgba(20,15,11,.55);border:1px solid rgba(216,154,44,.28);
  border-radius:6px;padding:1.6rem 1.5rem;}
.hero__panel h3{color:#fff;font-size:1.05rem;text-transform:uppercase;letter-spacing:.07em;
  font-weight:600;margin-bottom:1rem;padding-bottom:.7rem;border-bottom:1px solid rgba(216,154,44,.25);}
.statline{display:grid;grid-template-columns:1fr 1fr;gap:1rem 1.2rem;}
.stat b{display:block;font-family:var(--disp);font-weight:700;font-size:2rem;color:var(--red-deep);line-height:1;}
.stat span{font-size:.86rem;color:var(--body);}
.hero__panel .stat b,.section--ink .stat b,.section--steel .stat b{color:var(--amber);}
.hero__panel .stat span,.section--ink .stat span,.section--steel .stat span{color:#C8BEAE;}
@media (max-width:860px){.hero__grid{grid-template-columns:1fr;}.hero__panel{order:2;}}

/* ---- Home intro: company name + tagline -------------------------------- */
.intro{background:var(--bone);border-bottom:1px solid var(--line);}
.intro .wrap{padding-block:clamp(40px,6vw,76px);text-align:center;}
.intro .eyebrow{justify-content:center;}
.intro h1{font-size:clamp(2.6rem,6vw,4.6rem);margin:.25rem 0 .5rem;}
.intro__tag{font-size:clamp(1.06rem,1.8vw,1.35rem);color:var(--body);max-width:62ch;
  margin:0 auto 1.7rem;line-height:1.5;}
.intro .btn-row{justify-content:center;}
#contact{scroll-margin-top:96px;}

/* ---- Station collage ---------------------------------------------------- */
.collage-band{background:var(--ink);}
.collage-band .wrap{padding-block:clamp(18px,3vw,32px);}
.collage{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:152px;gap:12px;}
.collage__tile{margin:0;position:relative;border-radius:8px;overflow:hidden;
  background:#241d16 center/cover no-repeat;display:flex;align-items:flex-end;}
.collage__tile--lg{grid-column:span 2;grid-row:span 2;}
.collage__tile figcaption{font-family:var(--ui);font-size:.72rem;text-transform:uppercase;
  letter-spacing:.07em;color:#f0e6d4;width:100%;padding:1.4rem .8rem .6rem;
  background:linear-gradient(transparent,rgba(0,0,0,.65));}
.collage__tile--ph{align-items:center;justify-content:center;flex-direction:column;gap:.5rem;
  border:1px dashed rgba(216,154,44,.4);background:#1d1813;}
.collage__tile--ph .brand__mark{width:40px;height:40px;opacity:.65;}
.collage__tile--ph figcaption{background:none;text-align:center;color:#9a8e7c;padding:0;}
@media (max-width:820px){.collage{grid-auto-rows:124px;}}
@media (max-width:560px){.collage{grid-template-columns:repeat(2,1fr);}
  .collage__tile--lg{grid-column:span 2;grid-row:span 1;}}

/* ---- Scrolling brand banner -------------------------------------------- */
.marquee{background:var(--bone);border-top:3px solid var(--red);border-bottom:1px solid var(--line);
  padding-block:1.25rem;display:flex;align-items:center;gap:1.2rem;overflow:hidden;}
.marquee__label{flex:none;padding-left:clamp(1rem,4vw,3rem);font-family:var(--ui);font-weight:600;
  text-transform:uppercase;letter-spacing:.08em;font-size:.8rem;color:var(--amber-deep);}
.marquee__viewport{flex:1;overflow:hidden;display:flex;min-width:0;}
.marquee__track{list-style:none;margin:0;padding:0 clamp(1.6rem,4vw,3rem) 0 0;display:flex;flex:none;
  gap:clamp(1.6rem,4vw,3rem);animation:marquee 28s linear infinite;}
.marquee__track li{display:flex;align-items:center;white-space:nowrap;}
/* Brand text shows by default; the logo image replaces it once it loads cleanly
   (site.js), so a missing/broken logo file degrades to readable text. */
.brand-logo__img{display:none;height:38px;width:auto;object-fit:contain;}
.brand-logo__name{font-family:var(--disp);font-weight:700;font-size:1.5rem;letter-spacing:.04em;
  text-transform:uppercase;color:var(--ink);}
.brand-logo.has-logo .brand-logo__img{display:inline-block;}
.brand-logo.has-logo .brand-logo__name{display:none;}
@keyframes marquee{from{transform:translateX(0);}to{transform:translateX(-100%);}}
.marquee:hover .marquee__track{animation-play-state:paused;}
@media (prefers-reduced-motion:reduce){.marquee__track{animation:none;}.marquee__viewport{overflow-x:auto;}}

/* ---- Home stat band ----------------------------------------------------- */
.statband{display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem;padding-block:1.7rem;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.statband .stat b{display:block;font-family:var(--disp);font-weight:700;font-size:2.4rem;
  color:var(--red-deep);line-height:1;}
.statband .stat span{font-size:.9rem;color:var(--muted);}
@media (max-width:680px){.statband{grid-template-columns:1fr 1fr;}}

/* ---- Brand strip -------------------------------------------------------- */
.brandstrip{background:var(--bone);color:var(--body);border-top:3px solid var(--red);border-bottom:1px solid var(--line);}
.brandstrip .wrap{display:flex;align-items:center;gap:clamp(1rem,3vw,2.4rem);flex-wrap:wrap;
  justify-content:center;padding-block:1.5rem;}
.brandstrip .label{font-family:var(--ui);font-weight:600;text-transform:uppercase;letter-spacing:.08em;
  font-size:.8rem;color:var(--amber-deep);}
.brandstrip ul{list-style:none;display:flex;flex-wrap:wrap;gap:clamp(1rem,3vw,2.2rem);margin:0;padding:0;}
.brandstrip li{font-family:var(--disp);font-weight:700;font-size:1.3rem;letter-spacing:.04em;
  color:var(--ink);text-transform:uppercase;}

/* ---- Grid of cards ------------------------------------------------------ */
.grid{display:grid;gap:clamp(1.1rem,2.4vw,1.8rem);}
.grid--2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));}
.grid--3{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));}
.grid--4{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));}

.card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
  padding:1.6rem 1.5rem;box-shadow:var(--shadow-sm);position:relative;}
/* colored accent bar removed; brand color now comes through the icon, not chrome */
.card h3{margin-bottom:.4rem;}
.card p:last-child{margin-bottom:0;}
.card__num{font-family:var(--disp);font-weight:700;font-size:1rem;color:#fff;background:var(--red);
  width:2.1rem;height:2.1rem;border-radius:50%;display:inline-flex;align-items:center;
  justify-content:center;margin-bottom:.8rem;}
.card__icon{width:42px;height:42px;color:var(--red);margin-bottom:.7rem;}
.section--ink .card,.section--steel .card{background:rgba(255,255,255,.04);
  border-color:rgba(216,154,44,.22);color:#D9CFBF;box-shadow:none;}
.section--ink .card h3{color:#fff;}

/* Feature row (icon + text) */
.feature{display:flex;gap:1rem;align-items:flex-start;}
.feature .card__icon{flex:0 0 auto;margin:0;}

/* ---- Process steps ------------------------------------------------------ */
.steps{counter-reset:step;display:grid;gap:1.2rem;}
.steps--row{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));}
.step{position:relative;padding:1.4rem 1.4rem 1.4rem 1.4rem;background:var(--white);
  border:1px solid var(--line);border-radius:var(--radius);}
.step::before{counter-increment:step;content:counter(step,decimal-leading-zero);
  font-family:var(--disp);font-weight:700;font-size:1.5rem;color:var(--amber-deep);
  display:block;margin-bottom:.4rem;}
.step h3{font-size:1.2rem;color:var(--ink);}
.step p{color:var(--body);}
.section--ink .step,.section--steel .step{background:rgba(255,255,255,.05);border-color:rgba(216,154,44,.22);}
.section--ink .step h3,.section--steel .step h3{color:#fff;}
.section--ink .step p,.section--steel .step p{color:#D9CFBF;}
.section--ink .step::before,.section--steel .step::before{color:var(--amber);}

/* ---- Brand cards (products) --------------------------------------------- */
.brandcard{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
  padding:1.5rem;box-shadow:var(--shadow-sm);}
.brandcard h3{font-size:1.5rem;letter-spacing:.04em;}
.brandcard .tag{font-family:var(--ui);font-weight:500;font-size:.8rem;text-transform:uppercase;
  letter-spacing:.07em;color:var(--muted);}

/* ---- Portal callout ----------------------------------------------------- */
.callout{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(1.5rem,4vw,3rem);align-items:center;}
.callout__media{border-radius:6px;overflow:hidden;border:1px solid rgba(216,154,44,.3);
  box-shadow:var(--shadow);}
.callout ul{list-style:none;margin:1rem 0 0;padding:0;display:grid;gap:.7rem;}
.callout li{display:flex;gap:.7rem;align-items:flex-start;}
.callout li svg{flex:0 0 auto;width:22px;height:22px;color:var(--amber);margin-top:.15rem;}
@media (max-width:820px){.callout{grid-template-columns:1fr;}.callout__media{order:-1;}}

/* ---- Rep directory ------------------------------------------------------ */
.reps{display:grid;gap:1.3rem;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));}
.repgroup h3{font-size:1.1rem;text-transform:uppercase;letter-spacing:.06em;color:var(--red-deep);
  border-bottom:2px solid var(--line);padding-bottom:.5rem;margin-bottom:.9rem;}
.section--ink .repgroup h3{color:var(--amber);border-color:rgba(216,154,44,.3);}
.section--steel .repgroup h3{color:var(--amber);border-color:rgba(216,154,44,.3);}
/* Body links and muted labels read light on dark sections */
.section--ink a:not(.btn),.section--steel a:not(.btn){color:var(--amber);}
.section--ink a:not(.btn):hover,.section--steel a:not(.btn):hover{color:#fff;}
.section--ink .rep .role,.section--steel .rep .role,
.section--ink .muted,.section--steel .muted{color:#B6AC9C;}
.rep{margin-bottom:1rem;}
.rep b{font-family:var(--sans);font-weight:600;color:inherit;display:block;}
.rep a{display:block;font-size:.96rem;}
.rep .role{font-size:.8rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;}

/* ---- CTA band ----------------------------------------------------------- */
.cta-band{background:linear-gradient(135deg,var(--red) 0%,var(--red-deep) 100%);color:#fff;
  position:relative;overflow:hidden;}
.cta-band::after{content:"";position:absolute;right:-60px;top:-60px;width:280px;height:280px;
  border-radius:50%;border:30px solid rgba(255,255,255,.07);}
.cta-band .wrap{position:relative;display:flex;align-items:center;justify-content:space-between;
  gap:1.6rem;flex-wrap:wrap;padding-block:clamp(40px,6vw,64px);}
.cta-band h2{color:#fff;margin:0;}
.cta-band p{margin:.4rem 0 0;color:rgba(255,255,255,.9);}
.cta-band .btn--amber{background:#fff;border-color:#fff;color:var(--red-deep);}
.cta-band .btn--amber:hover{background:var(--ink);border-color:var(--ink);color:#fff;}
.cta-band .btn--ghost{color:#fff;border-color:rgba(255,255,255,.7);}
.cta-band .btn--ghost:hover{background:#fff;color:var(--red-deep);}

/* ---- Page hero (interior) ----------------------------------------------- */
.pagehero{color:#EFE8DB;border-bottom:3px solid var(--red);position:relative;overflow:hidden;
  background:
   linear-gradient(100deg,rgba(20,19,17,.92) 0%,rgba(22,21,18,.82) 50%,rgba(24,22,19,.60) 100%),
   url('../img/station-bg.jpg') center/cover no-repeat,
   var(--ink);}
.pagehero::before{content:"";position:absolute;inset:0;opacity:.45;
  background:repeating-linear-gradient(90deg,rgba(216,154,44,.08) 0 1px,transparent 1px 64px);}
.pagehero .wrap{position:relative;padding-block:clamp(48px,8vw,92px);}
.pagehero h1{color:#fff;}
.pagehero p{max-width:60ch;color:#D9CFBF;}
.crumbs{font-size:.84rem;color:#cdbfa6;margin-bottom:.6rem;font-family:var(--ui);
  text-transform:uppercase;letter-spacing:.07em;}
.crumbs a{color:var(--amber);}

/* ---- Definition / contact info ------------------------------------------ */
.infogrid{display:grid;gap:1.4rem;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));}
.infocard{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
  padding:1.4rem;}
.infocard h3{font-size:1.15rem;}
.infocard a{font-weight:600;}
.kv{margin:0;}
.kv dt{font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-top:.7rem;}
.kv dd{margin:0;font-weight:500;color:var(--ink);}

/* ---- Forms -------------------------------------------------------------- */
.form{display:grid;gap:1.1rem;}
.form .row{display:grid;gap:1.1rem;grid-template-columns:1fr 1fr;}
@media (max-width:620px){.form .row{grid-template-columns:1fr;}}
.field{display:flex;flex-direction:column;gap:.35rem;}
.field label{font-family:var(--ui);font-weight:600;text-transform:uppercase;letter-spacing:.08em;
  font-size:.82rem;color:var(--near);}
.field .req{color:var(--red-deep);}
.field input,.field select,.field textarea{font-family:var(--sans);font-size:1rem;
  padding:.8rem .9rem;border:1px solid var(--line);border-radius:var(--radius);background:#fff;
  color:var(--ink);transition:border-color .15s,box-shadow .15s;}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--amber);
  box-shadow:var(--ring);outline:none;}
.field textarea{resize:vertical;min-height:140px;}
.form__note{font-size:.86rem;color:var(--muted);}
.form__status{display:none;padding:.9rem 1rem;border-radius:var(--radius);font-weight:500;}
.form__status.is-show{display:block;}
.form__status.ok{background:rgba(216,154,44,.16);border:1px solid var(--amber);color:#5a3f08;}

/* ---- Resources list ----------------------------------------------------- */
.linklist{list-style:none;margin:0;padding:0;display:grid;gap:.2rem;}
.linklist li{border-bottom:1px solid var(--line);}
.linklist a{display:flex;justify-content:space-between;align-items:center;gap:1rem;
  padding:.8rem .2rem;color:var(--ink);font-weight:500;}
.linklist a:hover{color:var(--red);}
.linklist a span{color:var(--muted);font-size:.85rem;}
.doc-card{display:flex;gap:1rem;align-items:center;background:var(--ink);color:#EFE8DB;
  padding:1.3rem 1.4rem;border-radius:var(--radius);}
.doc-card svg{width:38px;height:38px;color:var(--amber);flex:0 0 auto;}
.doc-card h3{color:#fff;margin:0 0 .2rem;}
.doc-card p{margin:0;color:#C8BEAE;font-size:.92rem;}
.doc-card .btn{margin-left:auto;}
@media (max-width:600px){.doc-card{flex-wrap:wrap;}.doc-card .btn{margin-left:0;}}

/* ---- Footer ------------------------------------------------------------- */
.site-footer{background:var(--ink);color:var(--tan);padding-block:clamp(48px,7vw,76px) 0;
  border-top:3px solid var(--amber);}
.site-footer a{color:#ece0cb;}
.site-footer a:hover{color:var(--amber);}
.site-footer a.btn--primary{color:#fff;}
.site-footer a.btn--primary:hover{color:#fff;}
.footer-grid{display:grid;gap:2rem clamp(1.5rem,4vw,3rem);
  grid-template-columns:1.4fr 1fr 1fr 1.2fr;}
@media (max-width:880px){.footer-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:520px){.footer-grid{grid-template-columns:1fr;}}
.footer-grid h4{font-family:var(--ui);font-weight:600;text-transform:uppercase;letter-spacing:.07em;
  font-size:.95rem;color:var(--amber);margin:0 0 1rem;}
.footer-grid ul{list-style:none;margin:0;padding:0;display:grid;gap:.5rem;}
.footer-grid .brand{margin-bottom:1rem;}
.footer-about p{font-size:.94rem;color:var(--tan);max-width:34ch;}
.footer-contact span{display:block;font-size:.95rem;margin-bottom:.5rem;}
.footer-brands{font-family:var(--disp);font-weight:600;letter-spacing:.06em;color:#ece0cb;
  text-transform:uppercase;line-height:1.7;}
.footer-bar{border-top:1px solid rgba(255,255,255,.12);margin-top:2.4rem;padding-block:1.3rem;
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:.9rem;
  font-size:.85rem;color:var(--tan);}
.footer-legal{display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem 1.2rem;}
.footer-legal a{color:#ece0cb;}
.footer-legal a:hover{color:#fff;}
.footer-bar__lines{display:flex;flex-direction:column;gap:.3rem;}
.footer-bar__lines a{color:var(--tan);}
.footer-bar__lines a:hover{color:#fff;}

/* ---- Apply: what-you-need checklist ------------------------------------ */
.checklist{list-style:none;margin:1rem 0 0;padding:0;}
.checklist li{display:flex;gap:.7rem;margin-bottom:.8rem;color:var(--body);}
.checklist li svg{flex:0 0 auto;width:20px;height:20px;color:var(--red);margin-top:.15rem;}

/* ---- Apply wizard ------------------------------------------------------- */
.applyhead{display:grid;grid-template-columns:1.4fr .9fr;gap:clamp(1.5rem,4vw,3rem);align-items:end;margin-bottom:2rem;}
.applyhead__alt{background:var(--bone);border:1px solid var(--line);border-radius:8px;padding:1.1rem 1.2rem;}
@media (max-width:820px){.applyhead{grid-template-columns:1fr;}}
.wizard{background:var(--white);border:1px solid var(--line);border-radius:10px;
  padding:clamp(1.2rem,3vw,2.2rem);box-shadow:var(--shadow-sm);scroll-margin-top:90px;}
.wizard__progress{display:flex;gap:.5rem;list-style:none;margin:0 0 1.6rem;padding:0;}
.wizard__progress li{flex:1;height:5px;border-radius:3px;background:var(--line);}
.wizard__progress li.is-on{background:var(--red);}
.wizard__progress li.is-done{background:var(--amber);}
.wizard__step{display:none;border:0;margin:0;padding:0;min-inline-size:0;}
.wizard__step.is-active{display:block;}
.wizard__step legend{font-family:var(--disp);font-weight:700;font-size:1.3rem;color:var(--ink);
  padding:0;margin-bottom:1rem;}
.subcard{border:1px solid var(--line);border-radius:8px;padding:1.1rem;margin-bottom:1.1rem;background:var(--bone);}
.subcard h4{font-family:var(--ui);font-weight:600;text-transform:uppercase;letter-spacing:.06em;
  font-size:.82rem;color:var(--amber-deep);margin:0 0 .9rem;}
.legalbox{max-height:300px;overflow-y:auto;border:1px solid var(--line);border-radius:8px;
  padding:1rem 1.2rem;background:var(--bone);margin-bottom:1.2rem;}
.legalbox h4{margin:.3rem 0 .5rem;font-size:1rem;color:var(--ink);}
.legalbox p{font-size:.9rem;color:var(--body);margin:0 0 .8em;}
.check{display:flex;gap:.6rem;align-items:flex-start;margin:.9rem 0;font-size:.95rem;color:var(--body);}
.check input{margin-top:.25rem;flex:0 0 auto;width:18px;height:18px;}
.sigblock{margin-bottom:1.4rem;}
.sigblock label{display:block;font-family:var(--ui);font-weight:600;text-transform:uppercase;
  letter-spacing:.06em;font-size:.82rem;color:var(--ink);margin-bottom:.4rem;}
.sigpad{width:100%;max-width:640px;height:auto;aspect-ratio:640/170;border:1px dashed var(--muted);
  border-radius:6px;background:#fff;touch-action:none;cursor:crosshair;display:block;}
.sigblock__row{display:flex;gap:.8rem;align-items:center;margin-top:.5rem;flex-wrap:wrap;}
.sigblock__row input{flex:1;min-width:200px;}
.btn--sm{padding:.5rem .9rem;font-size:.82rem;}
.wizard__nav{display:flex;align-items:center;gap:1rem;margin-top:1.8rem;
  padding-top:1.4rem;border-top:1px solid var(--line);}
.wizard__count{font-family:var(--ui);text-transform:uppercase;letter-spacing:.06em;
  font-size:.8rem;color:var(--muted);margin-right:auto;}
.wizard__status{margin-top:1rem;font-size:.95rem;color:var(--body);}
.wizard__status.ok{color:#1c6b2f;}
.wizard__status.err{color:var(--red-deep);}
/* Honeypot: off-screen, never shown to humans */
.hp{position:absolute!important;left:-9999px!important;top:auto;width:1px;height:1px;overflow:hidden;}
/* The hidden attribute must win over .btn{display:inline-flex} */
[hidden]{display:none!important;}
/* Masked fields (SSN, account number) with a show/hide toggle */
.field--mask{position:relative;}
.field--mask input{padding-right:3.4rem;}
.mask-toggle{position:absolute;right:.5rem;bottom:.45rem;background:none;border:0;cursor:pointer;
  font-family:var(--ui);font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;
  color:var(--red-deep);padding:.3rem;}
.bank-extra{position:relative;}
.bank-remove{position:absolute;right:0;top:0;background:none;border:0;cursor:pointer;
  color:var(--red-deep);font-family:var(--ui);font-size:.78rem;}
.btn--add{margin-top:.4rem;}

/* ---- Legal / prose pages ----------------------------------------------- */
.legal{max-width:74ch;}
.legal h2{font-size:clamp(1.3rem,2.4vw,1.7rem);margin:2rem 0 .6rem;}
.legal h2:first-child{margin-top:0;}
.legal p,.legal li{color:var(--body);}
.legal ul{padding-left:1.2rem;margin:0 0 1.1em;}
.legal li{margin-bottom:.4em;}
.legal .updated{font-family:var(--ui);text-transform:uppercase;letter-spacing:.06em;
  font-size:.82rem;color:var(--muted);margin-bottom:1.6rem;}

/* ---- Misc --------------------------------------------------------------- */
.skip{position:absolute;left:-9999px;top:auto;}
.skip:focus{left:1rem;top:.6rem;z-index:200;background:var(--amber);color:var(--ink);
  padding:.6rem 1rem;border-radius:4px;font-weight:600;}
.tickrow{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1rem;}
.pill{font-family:var(--ui);font-weight:500;text-transform:uppercase;letter-spacing:.06em;font-size:.78rem;
  background:rgba(143,95,16,.10);color:#8a5a0c;
  padding:.3rem .7rem;border-radius:999px;}
.section--ink .pill{color:var(--amber);}
.hero .pill,.section--ink .pill,.section--steel .pill{color:#f0d6a4;
  background:rgba(255,255,255,.06);border:1px solid rgba(216,154,44,.42);}
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,3.2rem);align-items:center;}
@media (max-width:820px){.split{grid-template-columns:1fr;}}
.anchor{scroll-margin-top:90px;}