:root{
  --navy:#08295F; --asphalt:#0B1526; --asphalt2:#12203A; --asphalt3:#1B2C49;
  --orange:#FF6908; --orange-deep:#F23800; --amber:#FFB442;
  --paper:#FFFFFF; --mist:#F4F6F9; --line:#E4E8EF;
  --ink:#0C1B33; --body:#4A5462; --muted:#8A94A4;
  --wrap:1200px;
  --disp:"Saira SemiCondensed",system-ui,sans-serif;
  --sans:"Inter",system-ui,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;font-family:var(--sans);color:var(--ink);background:var(--paper);
  font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3{font-family:var(--disp);font-weight:700;line-height:1.02;letter-spacing:-.01em;margin:0}
p{margin:0}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
.mark{display:block}
.flame{display:inline-block;vertical-align:middle}

/* progress */
#prog{position:fixed;top:0;left:0;height:3px;width:0;background:var(--orange);z-index:60;
  box-shadow:0 0 12px rgba(255,106,0,.6)}

/* nav */
.nav{--nav-h:92px;position:sticky;top:0;z-index:50;background:rgba(255,255,255,.97);
  backdrop-filter:blur(12px);border-bottom:1px solid rgba(8,41,95,.12);
  box-shadow:0 8px 24px rgba(8,41,95,.06);transition:background .3s,box-shadow .3s}
.nav.solid{background:rgba(255,255,255,.99);box-shadow:0 10px 28px rgba(8,41,95,.10)}
.nav__in{display:flex;align-items:center;gap:28px;height:var(--nav-h)}
.brand{display:flex;align-items:center;gap:11px;color:var(--navy);flex:0 0 auto}
.brand .mark{width:78px;height:78px;object-fit:contain;display:block}
.brand b{font-family:var(--disp);font-weight:800;font-size:20px;letter-spacing:.02em;line-height:1}
.brand b span{color:var(--amber);font-weight:600;font-size:12px;display:block;letter-spacing:.14em;margin-top:2px}
.nav__links{display:flex;gap:26px;margin-left:auto}
.nav__links a{color:#516078;font-weight:600;font-size:15px;transition:color .2s}
.nav__links a:hover{color:var(--navy)}
.btn{display:inline-flex;align-items:center;justify-content:center;font-family:var(--sans);
  font-weight:600;font-size:15px;padding:12px 20px;border-radius:6px;cursor:pointer;
  border:1px solid transparent;transition:transform .15s,background .2s,border-color .2s;white-space:nowrap}
.btn:active{transform:translateY(1px)}
.btn--orange{background:var(--orange);color:#fff}
.btn--orange:hover{background:var(--orange-deep)}
.btn--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.35)}
.btn--ghost:hover{border-color:#fff;background:rgba(255,255,255,.06)}
.btn--navy{background:var(--navy);color:#fff}
.btn--navy:hover{background:#0a367f}
.btn--out{background:transparent;color:var(--navy);border-color:var(--line)}
.btn--out:hover{border-color:var(--navy)}
.nav__cta{margin-left:2px}
.burger{display:none;margin-left:auto;background:none;border:0;color:var(--navy);font-size:26px;cursor:pointer;padding:4px 8px}

/* sections */
section{position:relative}
.dark{background:var(--asphalt);color:#DDE4EE}
.dark h1,.dark h2,.dark h3{color:#fff}
.pad{padding:112px 0}
.eyebrow{font-family:var(--sans);font-weight:600;font-size:13px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--orange);margin-bottom:18px}
.lead{font-size:19px;line-height:1.65;color:var(--body);max-width:60ch}
.dark .lead{color:#AEB9CA}

/* hero */
.hero{min-height:calc(88vh - var(--nav-h,92px));display:flex;align-items:center;overflow:hidden;
  background:radial-gradient(110% 85% at 86% 12%,#142746 0%,var(--asphalt) 58%)}
.hero__glow{position:absolute;right:-6%;top:6%;width:min(620px,60vw);opacity:.62;
  filter:drop-shadow(0 0 44px rgba(255,105,8,.20));pointer-events:none}
.hero__glow .flame{width:100%;height:auto;opacity:.10}
.hero__in{position:relative;z-index:2;max-width:820px}
.hero h1{font-size:clamp(46px,7.4vw,92px);font-weight:800;color:#fff}
.hero h1 em{font-style:normal;color:#FFB442}
.hero .lead{margin-top:24px;font-size:20px;max-width:52ch}
.hero__cta{display:flex;gap:14px;margin-top:36px;flex-wrap:wrap}
.hero__meta{display:flex;gap:30px;margin-top:52px;flex-wrap:wrap;
  border-top:1px solid rgba(255,255,255,.1);padding-top:26px}
.hero__meta div{max-width:180px}
.hero__meta b{font-family:var(--disp);font-weight:700;font-size:15px;letter-spacing:.03em;color:#fff;display:block;margin-bottom:3px}
.hero__meta span{font-size:14px;color:#94A1B6}

/* section heading block */
.head{max-width:70ch;margin-bottom:56px}
.head h2{font-size:clamp(32px,4.4vw,52px);font-weight:800}
.head .lead{margin-top:18px}

/* positioning statement */
.statement .big{font-family:var(--disp);font-weight:800;font-size:clamp(30px,4.6vw,58px);
  line-height:1.05;max-width:20ch;color:var(--ink)}
.statement .big em{font-style:normal;color:var(--orange)}

/* supply process = genuine sequence -> connected timeline */
.flow{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:8px;
  border-top:1px solid var(--line)}
.step{padding:36px 30px 34px 0;position:relative}
.step:not(:last-child){border-right:1px solid var(--line)}
.step:not(:last-child){padding-right:34px}
.step:not(:first-child){padding-left:34px}
.step__n{font-family:var(--disp);font-weight:700;font-size:15px;letter-spacing:.14em;
  color:var(--orange);display:flex;align-items:center;gap:10px;margin-bottom:16px}
.step__n .flame{width:20px;height:20px}
.step h3{font-size:24px;color:var(--ink);margin-bottom:10px}
.step p{color:var(--body);font-size:16px}

/* services = text-forward blocks with left rule (not identical cards) */
.svc{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:10px;overflow:hidden}
.svc__item{background:var(--paper);padding:34px 32px;border-left:3px solid transparent;transition:border-color .2s,background .2s}
.svc__item:hover{border-left-color:var(--orange);background:#fff}
.svc__item h3{font-size:22px;color:var(--ink);margin-bottom:9px}
.svc__item p{color:var(--body);font-size:15.5px;max-width:46ch}

/* products = two large split panels */
.prod{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.panel{border-radius:12px;padding:44px 40px;min-height:340px;display:flex;flex-direction:column;
  justify-content:flex-end;position:relative;overflow:hidden;color:#fff}
.panel--gas{background:linear-gradient(150deg,#12203A 0%,#06275F 100%)}
.panel--diesel{background:linear-gradient(150deg,#241a12 0%,#7a2600 60%,#F43A00 140%)}
.panel .flame{position:absolute;top:26px;right:26px;width:56px;height:auto;opacity:.9}
.panel .kicker{font-family:var(--sans);font-weight:600;font-size:13px;letter-spacing:.15em;
  text-transform:uppercase;color:var(--amber);margin-bottom:12px}
.panel h3{font-size:34px;color:#fff;margin-bottom:12px}
.panel p{color:rgba(255,255,255,.86);font-size:15.5px;max-width:42ch}
.panel .note{margin-top:16px;font-size:13.5px;color:rgba(255,255,255,.6)}

/* product grade chips + secondary products */
.grades{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.grades li{font-size:13px;color:#fff;background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.20);padding:5px 12px;border-radius:999px}
.panel .note{margin-top:14px}
.prod2{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:22px}
.minicard{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:26px 28px}
.minicard h4{font-family:var(--disp);font-weight:700;font-size:19px;color:var(--ink);margin:0 0 6px;letter-spacing:-.01em}
.minicard p{color:var(--body);font-size:15px;margin:0}
.prod-ask{margin-top:26px;font-size:15.5px;color:var(--body)}
.prod-ask a{color:var(--orange);font-weight:600}
/* why = safe trust points */
.why{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.why__item{padding-top:22px;border-top:2px solid var(--navy)}
.why__item h3{font-size:20px;color:var(--ink);margin-bottom:8px}
.why__item p{color:var(--body);font-size:15.5px}

/* final cta */
.final{background:radial-gradient(120% 120% at 20% 0%,#16294a 0%,var(--asphalt) 60%)}
.final h2{font-size:clamp(34px,5vw,60px);font-weight:800;color:#fff;max-width:16ch}
.final .lead{margin-top:20px;color:#AEB9CA;max-width:56ch}
.final__cta{display:flex;gap:14px;margin-top:34px;flex-wrap:wrap}

/* footer */
.foot{background:var(--mist);color:var(--body);padding:64px 0 34px;border-top:1px solid var(--line)}
.foot__top{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;padding-bottom:40px;
  border-bottom:1px solid var(--line)}
.foot .brand{color:var(--navy);margin-bottom:16px}
.foot .brand .mark{width:148px;height:148px}
.foot p.desc{font-size:15px;color:var(--body);max-width:38ch}
.foot .tagline{color:var(--orange);font-family:var(--disp);font-weight:600;
  letter-spacing:.04em;margin-top:14px;font-size:15px}
.foot h4{font-family:var(--disp);font-weight:600;color:var(--navy);font-size:14px;
  letter-spacing:.12em;text-transform:uppercase;margin:0 0 16px}
.foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px}
.foot ul a{color:var(--body);font-size:15px}
.foot ul a:hover{color:var(--navy)}
.foot__bar{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  padding-top:26px;font-size:13.5px;color:#7A8494}
.foot__bar a{color:#7A8494}.foot__bar a:hover{color:var(--navy)}
.tbc{color:var(--orange);font-weight:600}

/* reveal (progressive enhancement) */
.no-js .reveal{opacity:1;transform:none}
.js .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.js .reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .js .reveal{opacity:1;transform:none;transition:none}
}

/* responsive */
@media (max-width:900px){
  .nav{--nav-h:78px}
  .brand .mark{width:64px;height:64px}
  .pad{padding:80px 0}
  .nav__links,.nav__cta{display:none}
  .burger{display:block}
  .nav.open .nav__links{display:flex;position:absolute;top:var(--nav-h);left:0;right:0;
    flex-direction:column;gap:0;background:var(--paper);padding:8px 24px 20px;
    border-top:1px solid var(--line);box-shadow:0 18px 30px rgba(8,41,95,.12)}
  .nav.open .nav__links a{padding:13px 0;border-bottom:1px solid var(--line)}
  .nav.open .nav__cta{display:flex;margin:14px 24px 4px}
  .flow{grid-template-columns:1fr}
  .step{border-right:0!important;border-bottom:1px solid var(--line);padding:28px 0!important}
  .svc,.prod,.prod2,.why{grid-template-columns:1fr}
  .hero{min-height:auto;padding:96px 0 72px}
  .hero__glow{opacity:.5;top:auto;bottom:2%}
  .foot__top{grid-template-columns:1fr}
}

/* ---- multipage routes ---- */
.route{display:none}
.route.active{display:block}
.nav__links a.on{color:var(--navy)}
.page-hero{background:radial-gradient(120% 90% at 80% 10%,#16294a 0%,var(--asphalt) 62%);padding:126px 0 76px;color:#DDE4EE}
.page-hero h1{font-size:clamp(38px,5.6vw,68px);font-weight:800;color:#fff;max-width:20ch}
.page-hero .lead{margin-top:20px;color:#AEB9CA;max-width:62ch}
.svc6{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.svc6 .svc__item{background:var(--paper)}
.about-block{max-width:66ch;margin-bottom:44px}
.about-block h2{font-size:clamp(28px,3.6vw,40px);font-weight:800;color:var(--ink);margin-bottom:14px}
.about-block p{color:var(--body);font-size:17px}
.about-mw{background:var(--asphalt);border-radius:14px;padding:40px 38px;color:#DDE4EE;max-width:none}
.about-mw h2{color:#fff}
.about-mw p{color:#AEB9CA}
/* ---- contact form ---- */
.contact-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:40px;align-items:start}
.form{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:34px 32px}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
.f{display:flex;flex-direction:column;gap:6px}
.f.full{grid-column:1 / -1}
.f label{font-size:13px;font-weight:600;color:var(--ink)}
.f label span{color:var(--muted);font-weight:400}
.f input,.f select,.f textarea{font-family:var(--sans);font-size:15px;color:var(--ink);
  padding:11px 13px;border:1px solid var(--line);border-radius:8px;background:#fff;width:100%}
.f input:focus,.f select:focus,.f textarea:focus{outline:2px solid var(--orange);outline-offset:0;border-color:var(--orange)}
.f textarea{min-height:96px;resize:vertical}
.form__submit{margin-top:8px}
.form__note{font-size:13px;color:var(--muted);margin-top:14px}
.success{display:none;background:#0d2a1a;border:1px solid #1f7a4d;color:#c8f2d9;
  border-radius:12px;padding:22px 24px;font-size:16px}
.success.show{display:block}
.cside{background:var(--mist);border:1px solid var(--line);border-radius:14px;padding:30px 28px}
.cside h3{font-family:var(--disp);font-weight:700;font-size:20px;color:var(--ink);margin:0 0 16px}
.cside .row{margin-bottom:16px}
.cside .k{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:3px}
.cside .v{font-size:15.5px;color:var(--ink)}
.cside .v a{color:var(--navy);font-weight:600}
@media (max-width:900px){
  .svc6{grid-template-columns:1fr}
  .contact-grid{grid-template-columns:1fr}
  .frow{grid-template-columns:1fr}
  .page-hero{padding:100px 0 60px}
}

:root{
  --navy:#08295F; --asphalt:#0B1526; --asphalt2:#12203A; --asphalt3:#1B2C49;
  --orange:#FF6908; --orange-deep:#F23800; --amber:#FFB442;
  --paper:#FFFFFF; --mist:#F4F6F9; --line:#E4E8EF;
  --ink:#0C1B33; --body:#4A5462; --muted:#8A94A4;
  --wrap:1200px;
  --disp:"Saira SemiCondensed",system-ui,sans-serif;
  --sans:"Inter",system-ui,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;font-family:var(--sans);color:var(--ink);background:var(--paper);
  font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3{font-family:var(--disp);font-weight:700;line-height:1.02;letter-spacing:-.01em;margin:0}
p{margin:0}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
.mark{display:block}
.flame{display:inline-block;vertical-align:middle}

/* progress */
#prog{position:fixed;top:0;left:0;height:3px;width:0;background:var(--orange);z-index:60;
  box-shadow:0 0 12px rgba(255,106,0,.6)}

/* nav */
.nav{--nav-h:92px;position:sticky;top:0;z-index:50;background:rgba(255,255,255,.97);
  backdrop-filter:blur(12px);border-bottom:1px solid rgba(8,41,95,.12);
  box-shadow:0 8px 24px rgba(8,41,95,.06);transition:background .3s,box-shadow .3s}
.nav.solid{background:rgba(255,255,255,.99);box-shadow:0 10px 28px rgba(8,41,95,.10)}
.nav__in{display:flex;align-items:center;gap:28px;height:var(--nav-h)}
.brand{display:flex;align-items:center;gap:11px;color:var(--navy);flex:0 0 auto}
.brand .mark{width:78px;height:78px;object-fit:contain;display:block}
.brand b{font-family:var(--disp);font-weight:800;font-size:20px;letter-spacing:.02em;line-height:1}
.brand b span{color:var(--amber);font-weight:600;font-size:12px;display:block;letter-spacing:.14em;margin-top:2px}
.nav__links{display:flex;gap:26px;margin-left:auto}
.nav__links a{color:#516078;font-weight:600;font-size:15px;transition:color .2s}
.nav__links a:hover{color:var(--navy)}
.btn{display:inline-flex;align-items:center;justify-content:center;font-family:var(--sans);
  font-weight:600;font-size:15px;padding:12px 20px;border-radius:6px;cursor:pointer;
  border:1px solid transparent;transition:transform .15s,background .2s,border-color .2s;white-space:nowrap}
.btn:active{transform:translateY(1px)}
.btn--orange{background:var(--orange);color:#fff}
.btn--orange:hover{background:var(--orange-deep)}
.btn--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.35)}
.btn--ghost:hover{border-color:#fff;background:rgba(255,255,255,.06)}
.btn--navy{background:var(--navy);color:#fff}
.btn--navy:hover{background:#0a367f}
.btn--out{background:transparent;color:var(--navy);border-color:var(--line)}
.btn--out:hover{border-color:var(--navy)}
.nav__cta{margin-left:2px}
.burger{display:none;margin-left:auto;background:none;border:0;color:var(--navy);font-size:26px;cursor:pointer;padding:4px 8px}

/* sections */
section{position:relative}
.dark{background:var(--asphalt);color:#DDE4EE}
.dark h1,.dark h2,.dark h3{color:#fff}
.pad{padding:112px 0}
.eyebrow{font-family:var(--sans);font-weight:600;font-size:13px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--orange);margin-bottom:18px}
.lead{font-size:19px;line-height:1.65;color:var(--body);max-width:60ch}
.dark .lead{color:#AEB9CA}

/* hero */
.hero{min-height:calc(88vh - var(--nav-h,92px));display:flex;align-items:center;overflow:hidden;
  background:radial-gradient(110% 85% at 86% 12%,#142746 0%,var(--asphalt) 58%)}
.hero__glow{position:absolute;right:-6%;top:6%;width:min(620px,60vw);opacity:.62;
  filter:drop-shadow(0 0 44px rgba(255,105,8,.20));pointer-events:none}
.hero__glow .flame{width:100%;height:auto;opacity:.10}
.hero__in{position:relative;z-index:2;max-width:820px}
.hero h1{font-size:clamp(46px,7.4vw,92px);font-weight:800;color:#fff}
.hero h1 em{font-style:normal;color:#FFB442}
.hero .lead{margin-top:24px;font-size:20px;max-width:52ch}
.hero__cta{display:flex;gap:14px;margin-top:36px;flex-wrap:wrap}
.hero__meta{display:flex;gap:30px;margin-top:52px;flex-wrap:wrap;
  border-top:1px solid rgba(255,255,255,.1);padding-top:26px}
.hero__meta div{max-width:180px}
.hero__meta b{font-family:var(--disp);font-weight:700;font-size:15px;letter-spacing:.03em;color:#fff;display:block;margin-bottom:3px}
.hero__meta span{font-size:14px;color:#94A1B6}

/* section heading block */
.head{max-width:70ch;margin-bottom:56px}
.head h2{font-size:clamp(32px,4.4vw,52px);font-weight:800}
.head .lead{margin-top:18px}

/* positioning statement */
.statement .big{font-family:var(--disp);font-weight:800;font-size:clamp(30px,4.6vw,58px);
  line-height:1.05;max-width:20ch;color:var(--ink)}
.statement .big em{font-style:normal;color:var(--orange)}

/* supply process = genuine sequence -> connected timeline */
.flow{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:8px;
  border-top:1px solid var(--line)}
.step{padding:36px 30px 34px 0;position:relative}
.step:not(:last-child){border-right:1px solid var(--line)}
.step:not(:last-child){padding-right:34px}
.step:not(:first-child){padding-left:34px}
.step__n{font-family:var(--disp);font-weight:700;font-size:15px;letter-spacing:.14em;
  color:var(--orange);display:flex;align-items:center;gap:10px;margin-bottom:16px}
.step__n .flame{width:20px;height:20px}
.step h3{font-size:24px;color:var(--ink);margin-bottom:10px}
.step p{color:var(--body);font-size:16px}

/* services = text-forward blocks with left rule (not identical cards) */
.svc{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:10px;overflow:hidden}
.svc__item{background:var(--paper);padding:34px 32px;border-left:3px solid transparent;transition:border-color .2s,background .2s}
.svc__item:hover{border-left-color:var(--orange);background:#fff}
.svc__item h3{font-size:22px;color:var(--ink);margin-bottom:9px}
.svc__item p{color:var(--body);font-size:15.5px;max-width:46ch}

/* products = two large split panels */
.prod{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.panel{border-radius:12px;padding:44px 40px;min-height:340px;display:flex;flex-direction:column;
  justify-content:flex-end;position:relative;overflow:hidden;color:#fff}
.panel--gas{background:linear-gradient(150deg,#12203A 0%,#06275F 100%)}
.panel--diesel{background:linear-gradient(150deg,#241a12 0%,#7a2600 60%,#F43A00 140%)}
.panel .flame{position:absolute;top:26px;right:26px;width:56px;height:auto;opacity:.9}
.panel .kicker{font-family:var(--sans);font-weight:600;font-size:13px;letter-spacing:.15em;
  text-transform:uppercase;color:var(--amber);margin-bottom:12px}
.panel h3{font-size:34px;color:#fff;margin-bottom:12px}
.panel p{color:rgba(255,255,255,.86);font-size:15.5px;max-width:42ch}
.panel .note{margin-top:16px;font-size:13.5px;color:rgba(255,255,255,.6)}

/* product grade chips + secondary products */
.grades{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.grades li{font-size:13px;color:#fff;background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.20);padding:5px 12px;border-radius:999px}
.panel .note{margin-top:14px}
.prod2{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:22px}
.minicard{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:26px 28px}
.minicard h4{font-family:var(--disp);font-weight:700;font-size:19px;color:var(--ink);margin:0 0 6px;letter-spacing:-.01em}
.minicard p{color:var(--body);font-size:15px;margin:0}
.prod-ask{margin-top:26px;font-size:15.5px;color:var(--body)}
.prod-ask a{color:var(--orange);font-weight:600}
/* why = safe trust points */
.why{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.why__item{padding-top:22px;border-top:2px solid var(--navy)}
.why__item h3{font-size:20px;color:var(--ink);margin-bottom:8px}
.why__item p{color:var(--body);font-size:15.5px}

/* final cta */
.final{background:radial-gradient(120% 120% at 20% 0%,#16294a 0%,var(--asphalt) 60%)}
.final h2{font-size:clamp(34px,5vw,60px);font-weight:800;color:#fff;max-width:16ch}
.final .lead{margin-top:20px;color:#AEB9CA;max-width:56ch}
.final__cta{display:flex;gap:14px;margin-top:34px;flex-wrap:wrap}

/* footer */
.foot{background:var(--mist);color:var(--body);padding:64px 0 34px;border-top:1px solid var(--line)}
.foot__top{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;padding-bottom:40px;
  border-bottom:1px solid var(--line)}
.foot .brand{color:var(--navy);margin-bottom:16px}
.foot .brand .mark{width:148px;height:148px}
.foot p.desc{font-size:15px;color:var(--body);max-width:38ch}
.foot .tagline{color:var(--orange);font-family:var(--disp);font-weight:600;
  letter-spacing:.04em;margin-top:14px;font-size:15px}
.foot h4{font-family:var(--disp);font-weight:600;color:var(--navy);font-size:14px;
  letter-spacing:.12em;text-transform:uppercase;margin:0 0 16px}
.foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px}
.foot ul a{color:var(--body);font-size:15px}
.foot ul a:hover{color:var(--navy)}
.foot__bar{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  padding-top:26px;font-size:13.5px;color:#7A8494}
.foot__bar a{color:#7A8494}.foot__bar a:hover{color:var(--navy)}
.tbc{color:var(--orange);font-weight:600}

/* reveal (progressive enhancement) */
.no-js .reveal{opacity:1;transform:none}
.js .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.js .reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .js .reveal{opacity:1;transform:none;transition:none}
}

/* responsive */
@media (max-width:900px){
  .nav{--nav-h:78px}
  .brand .mark{width:64px;height:64px}
  .pad{padding:80px 0}
  .nav__links,.nav__cta{display:none}
  .burger{display:block}
  .nav.open .nav__links{display:flex;position:absolute;top:var(--nav-h);left:0;right:0;
    flex-direction:column;gap:0;background:var(--paper);padding:8px 24px 20px;
    border-top:1px solid var(--line);box-shadow:0 18px 30px rgba(8,41,95,.12)}
  .nav.open .nav__links a{padding:13px 0;border-bottom:1px solid var(--line)}
  .nav.open .nav__cta{display:flex;margin:14px 24px 4px}
  .flow{grid-template-columns:1fr}
  .step{border-right:0!important;border-bottom:1px solid var(--line);padding:28px 0!important}
  .svc,.prod,.prod2,.why{grid-template-columns:1fr}
  .hero{min-height:auto;padding:96px 0 72px}
  .hero__glow{opacity:.5;top:auto;bottom:2%}
  .foot__top{grid-template-columns:1fr}
}

/* ---- multipage routes ---- */
.route{display:none}
.route.active{display:block}
.nav__links a.on{color:var(--navy)}
.page-hero{background:radial-gradient(120% 90% at 80% 10%,#16294a 0%,var(--asphalt) 62%);padding:126px 0 76px;color:#DDE4EE}
.page-hero h1{font-size:clamp(38px,5.6vw,68px);font-weight:800;color:#fff;max-width:20ch}
.page-hero .lead{margin-top:20px;color:#AEB9CA;max-width:62ch}
.svc6{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.svc6 .svc__item{background:var(--paper)}
.about-block{max-width:66ch;margin-bottom:44px}
.about-block h2{font-size:clamp(28px,3.6vw,40px);font-weight:800;color:var(--ink);margin-bottom:14px}
.about-block p{color:var(--body);font-size:17px}
.about-mw{background:var(--asphalt);border-radius:14px;padding:40px 38px;color:#DDE4EE;max-width:none}
.about-mw h2{color:#fff}
.about-mw p{color:#AEB9CA}
/* ---- contact form ---- */
.contact-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:40px;align-items:start}
.form{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:34px 32px}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
.f{display:flex;flex-direction:column;gap:6px}
.f.full{grid-column:1 / -1}
.f label{font-size:13px;font-weight:600;color:var(--ink)}
.f label span{color:var(--muted);font-weight:400}
.f input,.f select,.f textarea{font-family:var(--sans);font-size:15px;color:var(--ink);
  padding:11px 13px;border:1px solid var(--line);border-radius:8px;background:#fff;width:100%}
.f input:focus,.f select:focus,.f textarea:focus{outline:2px solid var(--orange);outline-offset:0;border-color:var(--orange)}
.f textarea{min-height:96px;resize:vertical}
.form__submit{margin-top:8px}
.form__note{font-size:13px;color:var(--muted);margin-top:14px}
.success{display:none;background:#0d2a1a;border:1px solid #1f7a4d;color:#c8f2d9;
  border-radius:12px;padding:22px 24px;font-size:16px}
.success.show{display:block}
.cside{background:var(--mist);border:1px solid var(--line);border-radius:14px;padding:30px 28px}
.cside h3{font-family:var(--disp);font-weight:700;font-size:20px;color:var(--ink);margin:0 0 16px}
.cside .row{margin-bottom:16px}
.cside .k{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:3px}
.cside .v{font-size:15.5px;color:var(--ink)}
.cside .v a{color:var(--navy);font-weight:600}
@media (max-width:900px){
  .svc6{grid-template-columns:1fr}
  .contact-grid{grid-template-columns:1fr}
  .frow{grid-template-columns:1fr}
  .page-hero{padding:100px 0 60px}
}