/* ==========================================================
   Maximum Earthworks — maximumearthworks.com
   ========================================================== */

:root{
  /* brand — sampled from the Maximum Earthworks email signature + ute livery */
  --navy:#123F52;
  --brand:#195771;
  --brand-2:#1E6B8C;
  --brand-3:#2E93BE;
  --sky:#E8F2F7;
  --accent:#E8761E;        /* CTA only — high-contrast against the teal */
  --accent-dk:#C85F0F;

  --ink:#16242B;
  --body:#43585F;
  --line:#DCE6EB;
  --bg:#FFFFFF;
  --bg-tint:#F4F8FA;

  --wrap:1180px;
  --r:14px;
  --shadow:0 2px 4px rgba(18,63,82,.05), 0 12px 28px rgba(18,63,82,.09);
  --shadow-lg:0 4px 8px rgba(18,63,82,.06), 0 24px 56px rgba(18,63,82,.14);

  --h:'Montserrat', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --b:'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:88px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

body{
  margin:0; background:var(--bg); color:var(--body);
  font-family:var(--b); font-size:17px; line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; height:auto; display:block}
a{color:var(--brand-2); text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{font-family:var(--h); color:var(--ink); margin:0 0 .5em; line-height:1.14; letter-spacing:-.015em}
h1{font-size:clamp(2.1rem,5.4vw,3.6rem); font-weight:800}
h2{font-size:clamp(1.7rem,3.6vw,2.6rem); font-weight:800}
h3{font-size:1.13rem; font-weight:700; letter-spacing:-.005em}
p{margin:0 0 1em}
ul,ol{margin:0; padding:0; list-style:none}

.wrap{width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:22px}
.wrap--narrow{max-width:860px}
.sec{padding:clamp(56px,7vw,100px) 0}
.sec--tint{background:var(--bg-tint)}
.sec--dark{background:var(--navy); color:#C9DCE5}
.sec--dark h2,.sec--dark h3{color:#fff}

.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;z-index:999;background:#fff;padding:10px 16px;border-radius:8px}
:focus-visible{outline:3px solid var(--accent); outline-offset:2px; border-radius:4px}

.eyebrow{
  font-family:var(--h); font-weight:700; font-size:.76rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--brand-3); margin:0 0 .8em;
}
.eyebrow--dark{color:var(--brand-2)}
.lede{font-size:1.09rem; max-width:62ch}
.sechead{margin-bottom:clamp(30px,4vw,52px); max-width:72ch}

/* ── logo ─────────────────────────────────────────────────── */
.logo{display:inline-block; text-decoration:none; line-height:1; color:#fff}
.logo:hover{text-decoration:none}
.logo__main{
  display:block; font-family:var(--h); font-weight:800; font-size:1.42rem;
  letter-spacing:.14em; color:inherit;
}
.logo__sub{
  display:flex; align-items:center; gap:7px; margin-top:5px;
  font-family:var(--h); font-style:italic; font-weight:500;
  font-size:.6rem; letter-spacing:.3em; color:inherit; opacity:.92;
}
.logo__sub i{flex:1; height:1px; background:currentColor; opacity:.6}
.hdr .logo,.hdr .logo__main{color:#fff}
.hdr.is-stuck .logo,.hdr.is-stuck .logo__main{color:#fff}

/* ── buttons ──────────────────────────────────────────────── */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  font-family:var(--h); font-weight:700; font-size:.95rem; letter-spacing:.01em;
  padding:13px 22px; border-radius:10px; border:2px solid transparent;
  cursor:pointer; text-decoration:none; transition:transform .12s ease, box-shadow .18s ease, background .18s ease;
  white-space:nowrap;
}
.btn:hover{text-decoration:none; transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn svg{width:18px;height:18px;fill:currentColor;flex:none}
.btn--lg{padding:16px 28px; font-size:1.02rem}
.btn--full{width:100%}
.btn--primary{background:var(--accent); color:#fff; box-shadow:0 6px 18px rgba(232,118,30,.32)}
.btn--primary:hover{background:var(--accent-dk); box-shadow:0 10px 24px rgba(232,118,30,.38)}
.btn--ghost{background:rgba(255,255,255,.1); color:#fff; border-color:rgba(255,255,255,.55); backdrop-filter:blur(4px)}
.btn--ghost:hover{background:rgba(255,255,255,.2)}
.btn--call{background:#fff; color:var(--navy)}
.btn--call:hover{background:var(--sky)}

.ticks{display:grid; gap:11px; margin:0 0 26px}
.ticks li{position:relative; padding-left:30px}
.ticks li::before{
  content:""; position:absolute; left:0; top:.42em; width:18px; height:18px; border-radius:50%;
  background:var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M9.3 17.2 4.6 12.5l1.6-1.6 3.1 3.1 8-8 1.6 1.6z'/%3E%3C/svg%3E") center/13px no-repeat;
}
.ticks--sm li{font-size:.94rem}

/* ── top bar ──────────────────────────────────────────────── */
.topbar{background:var(--navy); color:#9FC0CE; font-size:.83rem}
.topbar__in{display:flex; justify-content:space-between; align-items:center; gap:14px; min-height:38px; flex-wrap:wrap}
.topbar a{color:#CFE3EC}
.topbar__links{display:flex; gap:18px; align-items:center}
.topbar__tel{font-weight:700; color:#fff!important}
@media (max-width:640px){.topbar__area{display:none} .topbar__in{justify-content:center}}

/* ── header ───────────────────────────────────────────────── */
.hdr{
  position:sticky; top:0; z-index:60;
  background:linear-gradient(180deg, rgba(18,63,82,.96), rgba(18,63,82,.88));
  backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(255,255,255,.1);
  transition:background .2s ease, box-shadow .2s ease;
}
.hdr.is-stuck{background:var(--navy); box-shadow:0 6px 24px rgba(0,0,0,.22)}
.hdr__in{display:flex; align-items:center; gap:22px; min-height:74px}
.nav{margin-left:auto; display:flex; align-items:center; gap:26px}
.nav a{
  font-family:var(--h); font-weight:600; font-size:.92rem; color:#D7E7EE; text-decoration:none;
  padding:6px 0; border-bottom:2px solid transparent;
}
.nav a:hover{color:#fff; border-bottom-color:var(--accent); text-decoration:none}
.nav__cta{display:none}
.hdr__call{padding:11px 18px; font-size:.92rem}
.burger{display:none; background:none; border:0; padding:8px; cursor:pointer; margin-left:auto}
.burger span{display:block; width:26px; height:2.5px; background:#fff; border-radius:2px; margin:5px 0; transition:.2s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}

@media (max-width:1000px){
  .hdr__call span{display:none}
  .hdr__call{padding:11px 13px}
  .nav{gap:18px}
}
@media (max-width:880px){
  .burger{display:block}
  .hdr__call{margin-left:auto}
  .nav{
    position:absolute; top:100%; left:0; right:0; margin:0;
    flex-direction:column; align-items:stretch; gap:0;
    background:var(--navy); border-top:1px solid rgba(255,255,255,.12);
    max-height:0; overflow:hidden; transition:max-height .28s ease;
  }
  .nav.is-open{max-height:520px}
  .nav a{padding:15px 22px; border-bottom:1px solid rgba(255,255,255,.08)}
  .nav a:hover{border-bottom-color:rgba(255,255,255,.08)}
  .nav__cta{display:block; color:var(--accent)!important; font-weight:800}
}

/* ── hero ─────────────────────────────────────────────────── */
.hero{position:relative; isolation:isolate; color:#fff; display:flex; align-items:center;
  min-height:clamp(560px,82vh,780px); padding:clamp(60px,9vw,110px) 0}
.hero__bg{position:absolute; inset:0; z-index:-2}
.hero__bg img{width:100%; height:100%; object-fit:cover; object-position:50% 55%}
.hero::after{
  content:""; position:absolute; inset:0; z-index:-1;
  background:
    linear-gradient(100deg, rgba(11,42,56,.90) 0%, rgba(11,42,56,.74) 40%, rgba(11,42,56,.30) 72%, rgba(11,42,56,.14) 100%),
    linear-gradient(0deg, rgba(11,42,56,.55), rgba(11,42,56,0) 42%);
}
.hero__in{max-width:800px}
.hero h1{color:#fff; margin-bottom:.42em; text-wrap:balance}
.hero h1 span{color:#8ED0EE}
.hero__sub{font-size:clamp(1.05rem,1.9vw,1.25rem); color:#D5E7EF; max-width:56ch; margin-bottom:1.9em}
.hero__cta{display:flex; flex-wrap:wrap; gap:14px; margin-bottom:28px}
.hero__ticks{display:flex; flex-wrap:wrap; gap:10px 26px; font-size:.92rem; color:#BFD9E4}
.hero__ticks li{position:relative; padding-left:24px}
.hero__ticks li::before{
  content:""; position:absolute; left:0; top:.36em; width:15px; height:15px; border-radius:50%;
  background:rgba(255,255,255,.16) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%238ED0EE'%3E%3Cpath d='M9.3 17.2 4.6 12.5l1.6-1.6 3.1 3.1 8-8 1.6 1.6z'/%3E%3C/svg%3E") center/11px no-repeat;
}
@media (max-width:520px){
  .hero__cta .btn{width:100%}
  .hero .eyebrow{font-size:.68rem; letter-spacing:.13em}
  .hero__ticks{gap:8px 18px; font-size:.87rem}
}

/* ── trust strip ──────────────────────────────────────────── */
.strip{background:var(--brand); color:#fff}
.strip__in{display:grid; grid-template-columns:repeat(4,1fr); gap:2px; padding-block:0}
.strip__i{padding:26px 20px; text-align:center; position:relative}
.strip__i+.strip__i::before{content:""; position:absolute; left:0; top:22%; bottom:22%; width:1px; background:rgba(255,255,255,.22)}
.strip__i b{display:block; font-family:var(--h); font-weight:800; font-size:1.5rem; letter-spacing:-.01em}
.strip__i span{display:block; font-size:.86rem; color:#B9D8E5; margin-top:3px}
@media (max-width:760px){
  .strip__in{grid-template-columns:repeat(2,1fr)}
  .strip__i:nth-child(odd)::before{display:none}
  .strip__i:nth-child(n+3)::after{content:"";position:absolute;left:12%;right:12%;top:0;height:1px;background:rgba(255,255,255,.2)}
}

/* ── services ─────────────────────────────────────────────── */
.svc{display:grid; grid-template-columns:repeat(auto-fit,minmax(268px,1fr)); gap:18px}
.svc li{
  background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:26px 24px;
  transition:transform .16s ease, box-shadow .18s ease, border-color .18s ease;
  border-top:3px solid var(--brand-3);
}
.svc li:hover{transform:translateY(-3px); box-shadow:var(--shadow); border-color:var(--line); border-top-color:var(--accent)}
.svc h3{margin-bottom:.4em; color:var(--navy)}
.svc p{margin:0; font-size:.96rem}
.svc--cta{background:var(--navy)!important; border-color:var(--navy)!important; border-top-color:var(--accent)!important; color:#C9DCE5}
.svc--cta:hover{transform:translateY(-3px)}
.svc--cta h3{color:#fff}
.svc--cta p{margin-bottom:1.2em}

/* ── why ──────────────────────────────────────────────────── */
.why{display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(30px,5vw,64px); align-items:center}
.why h2{margin-bottom:.5em}
.why__img img{border-radius:var(--r); box-shadow:var(--shadow-lg)}
.sec--dark .ticks li::before{background-color:var(--brand-3)}
@media (max-width:900px){.why{grid-template-columns:1fr} .why__img{order:-1}}

/* ── gallery ──────────────────────────────────────────────── */
.gal{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}
.gal__i{margin:0; position:relative; border-radius:var(--r); overflow:hidden; background:var(--navy)}
.gal__i img{width:100%; height:100%; aspect-ratio:3/2; object-fit:cover; transition:transform .5s ease}
.gal__i:hover img{transform:scale(1.045)}
.gal__i figcaption{
  position:absolute; left:0; right:0; bottom:0; padding:34px 18px 14px;
  font-family:var(--h); font-weight:700; font-size:.92rem; color:#fff;
  background:linear-gradient(0deg, rgba(11,42,56,.88), rgba(11,42,56,0));
}
@media (max-width:900px){.gal{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.gal{grid-template-columns:1fr}}

/* ── steps ────────────────────────────────────────────────── */
.steps{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:22px; counter-reset:s}
.steps li{background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:30px 26px 26px; position:relative}
.steps__n{
  display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px;
  border-radius:11px; background:var(--navy); color:#fff;
  font-family:var(--h); font-weight:800; font-size:1.1rem; margin-bottom:16px;
}
.steps li:last-child .steps__n{background:var(--accent)}
.steps h3{color:var(--navy)}
.steps p{margin:0; font-size:.97rem}
.steps__cta{margin:34px 0 0; text-align:center}

/* ── about ────────────────────────────────────────────────── */
.about{display:grid; grid-template-columns:.95fr 1.05fr; gap:clamp(30px,5vw,64px); align-items:center}
.about__img img{border-radius:var(--r); box-shadow:var(--shadow-lg)}
.about__meta{display:flex; align-items:center; gap:20px; flex-wrap:wrap; margin-top:26px; padding-top:24px; border-top:1px solid var(--line)}
.about__meta b{display:block; font-family:var(--h); font-size:1.05rem; color:var(--navy)}
.about__meta span{font-size:.9rem}
@media (max-width:900px){.about{grid-template-columns:1fr}}

/* ── FAQ ──────────────────────────────────────────────────── */
.faq details{background:#fff; border:1px solid var(--line); border-radius:12px; margin-bottom:12px; overflow:hidden}
.faq details[open]{box-shadow:var(--shadow); border-color:#C6DCE6}
.faq summary{
  list-style:none; cursor:pointer; padding:19px 54px 19px 22px; position:relative;
  font-family:var(--h); font-weight:700; font-size:1.02rem; color:var(--navy);
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:""; position:absolute; right:20px; top:50%; width:13px; height:13px; margin-top:-7px;
  border-right:2.5px solid var(--brand-3); border-bottom:2.5px solid var(--brand-3);
  transform:rotate(45deg); transition:transform .2s ease;
}
.faq details[open] summary::after{transform:rotate(-135deg); margin-top:-3px}
.faq details p{margin:0; padding:0 22px 22px; font-size:1rem}

/* ── quote ────────────────────────────────────────────────── */
.quote{background:var(--navy); color:#C4DAE4}
.quote h2{color:#fff}
.quote__in{display:grid; grid-template-columns:.95fr 1.05fr; gap:clamp(32px,5vw,64px); align-items:start}
.bigcall,.bigmail{
  display:flex; align-items:center; gap:15px; padding:16px 20px; margin-bottom:12px;
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.16);
  border-radius:12px; color:#fff; text-decoration:none; transition:.16s ease;
}
.bigcall:hover,.bigmail:hover{background:rgba(255,255,255,.14); text-decoration:none; transform:translateY(-2px)}
.bigcall svg,.bigmail svg{width:26px;height:26px;fill:var(--accent);flex:none}
.bigcall small,.bigmail small{display:block; font-size:.76rem; letter-spacing:.1em; text-transform:uppercase; color:#8FB4C4}
.bigcall b,.bigmail b{font-family:var(--h); font-size:1.24rem; letter-spacing:-.01em; word-break:break-word}
.bigmail b{font-size:1rem}
.quote .ticks{margin-top:24px}
.quote .ticks li::before{background-color:var(--brand-3)}

/* ── footer ───────────────────────────────────────────────── */
.ftr{background:#0D3243; color:#9BBECD; padding:clamp(44px,5vw,66px) 0 0; font-size:.94rem}
.ftr__in{display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:34px}
.ftr h4{color:#fff; font-size:.82rem; letter-spacing:.13em; text-transform:uppercase; margin-bottom:14px}
.ftr a{color:#9BBECD}
.ftr a:hover{color:#fff}
.ftr__col li{margin-bottom:9px}
.ftr__brand .logo{margin-bottom:16px}
.ftr__brand p{max-width:34ch; font-size:.92rem}
.ftr__areas{display:flex; flex-wrap:wrap; gap:5px 12px}
.ftr__base{
  display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap;
  margin-top:40px; padding-top:20px; padding-bottom:20px; border-top:1px solid rgba(255,255,255,.1);
  font-size:.85rem; color:#7CA3B4;
}
.ftr__base p{margin:0}
@media (max-width:880px){.ftr__in{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.ftr__in{grid-template-columns:1fr; gap:26px}}

/* ── sticky mobile call bar ───────────────────────────────── */
.callbar{
  position:fixed; left:0; right:0; bottom:0; z-index:70; display:none;
  gap:1px; background:rgba(13,50,67,.4);
  padding-bottom:env(safe-area-inset-bottom);
  box-shadow:0 -6px 22px rgba(0,0,0,.22);
  transform:translateY(110%); transition:transform .28s ease;
}
.callbar.is-on{transform:translateY(0)}
.callbar a{
  flex:1; display:flex; align-items:center; justify-content:center; gap:9px;
  padding:15px 10px; font-family:var(--h); font-weight:800; font-size:1rem;
  text-decoration:none; color:#fff;
}
.callbar svg{width:19px;height:19px;fill:currentColor}
.callbar__call{background:var(--accent)}
.callbar__quote{background:var(--navy)}
@media (max-width:768px){
  .callbar{display:flex}
  body{padding-bottom:74px}
}

/* ── thank you page ───────────────────────────────────────── */
.ty{min-height:70vh; display:flex; align-items:center; text-align:center; padding:80px 0}
.ty__box{max-width:620px; margin-inline:auto}
.ty__cta{display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-top:28px}

/* ==========================================================
   Multi-page additions
   ========================================================== */

/* logo as image */
.logo{display:flex; align-items:center; line-height:0}
.logo img{height:44px; width:auto; display:block}
.ftr__logo{height:38px; width:auto; margin-bottom:16px}
@media (max-width:520px){ .logo img{height:34px} }

/* active nav state */
.nav a.is-active{color:#fff; border-bottom-color:var(--accent)}
@media (max-width:880px){ .nav a.is-active{background:rgba(255,255,255,.06); border-bottom-color:rgba(255,255,255,.08)} }

/* outline button */
.btn--outline{background:transparent; color:var(--navy); border-color:var(--line)}
.btn--outline:hover{background:var(--sky); border-color:var(--brand-3)}
.sec--dark .btn--outline,.ctaband .btn--outline{color:#fff; border-color:rgba(255,255,255,.4)}

/* section head with a button on the right */
.sechead--row{display:flex; align-items:flex-end; justify-content:space-between; gap:24px; max-width:none}
.sechead--row>div{max-width:64ch}
@media (max-width:760px){ .sechead--row{display:block} .sechead--row .btn{margin-top:18px} }

/* interior page hero */
.phero{position:relative; isolation:isolate; color:#fff; padding:clamp(60px,8vw,104px) 0 clamp(48px,6vw,80px)}
.phero__bg{position:absolute; inset:0; z-index:-2}
.phero__bg img{width:100%; height:100%; object-fit:cover; object-position:50% 55%}
.phero::after{content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(100deg, rgba(11,42,56,.95) 0%, rgba(11,42,56,.88) 45%, rgba(11,42,56,.62) 100%)}
.phero__in{max-width:760px}
.phero h1{color:#fff; font-size:clamp(1.95rem,4.6vw,3.1rem); margin-bottom:.4em; text-wrap:balance}
.phero__sub{font-size:clamp(1rem,1.7vw,1.16rem); color:#D2E5ED; max-width:58ch; margin:0}

/* service cards that link */
.svc--link li{padding:0}
.svc--link li a{display:block; padding:26px 24px; color:inherit; text-decoration:none}
.svc--link li a:hover{text-decoration:none}
.svc__more{display:inline-block; margin-top:14px; font-family:var(--h); font-weight:700;
  font-size:.85rem; color:var(--brand-2)}
.svc__more::after{content:" →"}
.svc--link li:hover .svc__more{color:var(--accent)}

/* service detail rows */
.srows .srow{display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(26px,4vw,56px);
  align-items:center; padding:clamp(30px,4vw,52px) 0; border-top:1px solid var(--line); scroll-margin-top:100px}
.srows .srow:first-child{border-top:0; padding-top:0}
.srow--alt .srow__img{order:2}
.srow__img img{border-radius:var(--r); box-shadow:var(--shadow)}
.srow__copy h2{font-size:clamp(1.4rem,2.6vw,1.95rem); margin-bottom:.4em}
.srow__short{font-size:1.08rem; color:var(--navy); font-weight:500}
.srow__copy .btn{margin-top:8px}
@media (max-width:860px){ .srows .srow{grid-template-columns:1fr} .srow--alt .srow__img{order:0} }

/* gallery with captions */
.gal--captions .gal__i figcaption{
  position:static; background:none; padding:14px 2px 2px; color:var(--body);
  font-family:var(--b); font-weight:400; font-size:.92rem;
}
.gal--captions .gal__i{background:none; border-radius:0; overflow:visible}
.gal--captions .gal__i picture{display:block; border-radius:var(--r); overflow:hidden; background:var(--navy)}
.gal--captions .gal__i figcaption b{display:block; font-family:var(--h); font-size:.98rem; color:var(--navy); margin-bottom:3px}
.gal--captions .gal__i img{border-radius:var(--r)}

/* testimonial */
.testi{margin:0; background:#fff; border:1px solid var(--line); border-radius:var(--r);
  padding:clamp(28px,4vw,46px); box-shadow:var(--shadow); position:relative}
.sec--tint .testi{background:#fff}
.testi__stars{color:#F2B01E; font-size:1.5rem; letter-spacing:.14em; line-height:1; margin-bottom:18px}
.testi blockquote{margin:0; font-size:1.06rem; color:var(--ink)}
.testi blockquote p:last-child{margin-bottom:0}
.testi figcaption{margin-top:22px; padding-top:20px; border-top:1px solid var(--line)}
.testi figcaption b{display:block; font-family:var(--h); font-size:1.05rem; color:var(--navy)}
.testi figcaption span{font-size:.92rem}

/* CTA band */
.ctaband{background:var(--brand); color:#D3E7F0; padding:clamp(40px,5vw,64px) 0}
.ctaband h2{color:#fff; font-size:clamp(1.45rem,2.8vw,2.05rem); margin-bottom:.35em}
.ctaband p{margin:0; max-width:56ch}
.ctaband__in{display:flex; align-items:center; justify-content:space-between; gap:28px; flex-wrap:wrap}
.ctaband__btns{display:flex; gap:12px; flex-wrap:wrap}
@media (max-width:640px){ .ctaband__btns{width:100%} .ctaband__btns .btn{flex:1 1 100%} }

/* values grid */
.vals{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:26px}
.vals h3{color:#fff; margin-bottom:.4em}
.vals p{margin:0; font-size:.97rem}

/* kit section */
.kit{display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(30px,5vw,64px); align-items:center}
.kit__img img{border-radius:var(--r); box-shadow:var(--shadow-lg)}
@media (max-width:900px){ .kit{grid-template-columns:1fr} }

/* tyre-tread texture accent */
.tread{position:relative; overflow:hidden}
.tread::before{
  content:""; position:absolute; right:-6%; top:-30%; width:70%; height:160%;
  background:url("/assets/img/tread.png") center/contain no-repeat;
  opacity:.05; pointer-events:none; transform:rotate(-8deg);
}

/* contact page form heading */

/* footer badges */
.ftr__badges{display:flex; gap:8px; flex-wrap:wrap; margin-top:14px}
.ftr__badges span{font-size:.76rem; letter-spacing:.08em; text-transform:uppercase;
  font-family:var(--h); font-weight:600; color:#B6D5E2;
  border:1px solid rgba(255,255,255,.2); border-radius:99px; padding:5px 11px}

/* thank-you / 404 headings */
.ty h1{font-size:clamp(1.9rem,4.4vw,2.9rem)}
.ty .lede{margin-inline:auto}

/* keep the image column the same width on alternating service rows */
@media (min-width:861px){
  .srow--alt{grid-template-columns:1.1fr .9fr}
}

/* form heading sits on a white card inside the dark quote section */

/* ==========================================================
   Contact page — phone + email only
   ========================================================== */

.contact2{display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-bottom:clamp(38px,5vw,60px)}
.ccard{
  display:block; padding:clamp(26px,3.4vw,38px); border-radius:var(--r);
  background:var(--accent); color:#fff; text-decoration:none;
  box-shadow:0 10px 30px rgba(232,118,30,.28);
  transition:transform .14s ease, box-shadow .2s ease;
}
.ccard:hover{transform:translateY(-3px); text-decoration:none; box-shadow:0 16px 40px rgba(232,118,30,.36)}
.ccard--alt{background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.22); box-shadow:none}
.ccard--alt:hover{background:rgba(255,255,255,.15); box-shadow:none}
.ccard__ic{display:block; margin-bottom:16px}
.ccard__ic svg{width:30px; height:30px; fill:#fff}
.ccard small{display:block; font-family:var(--h); font-weight:700; font-size:.74rem;
  letter-spacing:.15em; text-transform:uppercase; opacity:.85; margin-bottom:8px}
.ccard b{display:block; font-family:var(--h); font-weight:800; letter-spacing:-.015em;
  font-size:clamp(1.3rem,2.6vw,1.85rem); line-height:1.15; word-break:break-word}
.ccard em{display:block; font-style:normal; font-size:.92rem; opacity:.8; margin-top:10px}
@media (max-width:760px){ .contact2{grid-template-columns:1fr} }

.prep{display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(26px,4vw,52px);
  padding-top:clamp(30px,4vw,44px); border-top:1px solid rgba(255,255,255,.14)}
.prep__copy h2{color:#fff; font-size:clamp(1.3rem,2.4vw,1.8rem)}
.prep__copy p{margin:0}
.prep__list{counter-reset:pp; display:grid; gap:14px}
.prep__list li{position:relative; padding-left:44px; counter-increment:pp}
.prep__list li::before{
  content:counter(pp); position:absolute; left:0; top:0;
  width:29px; height:29px; border-radius:8px;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--h); font-weight:800; font-size:.82rem; color:#fff;
}
.prep__list b{display:block; font-family:var(--h); font-size:1rem; color:#fff}
.prep__list span{font-size:.94rem}
@media (max-width:760px){ .prep{grid-template-columns:1fr} }

.ticks--row{display:flex; flex-wrap:wrap; gap:12px 30px; margin:clamp(30px,4vw,44px) 0 0;
  padding-top:clamp(24px,3vw,32px); border-top:1px solid rgba(255,255,255,.14)}
.ticks--row li{margin:0}

.areas{display:flex; flex-wrap:wrap; gap:10px}
.areas li{
  font-family:var(--h); font-weight:600; font-size:.92rem; color:var(--navy);
  background:#fff; border:1px solid var(--line); border-radius:99px; padding:9px 17px;
}
.areas__note{margin:20px 0 0; font-size:.95rem}

/* email address is long — size it so it doesn't break mid-word */
.ccard--alt b{font-size:clamp(1rem,1.9vw,1.32rem); overflow-wrap:anywhere}