/* ==========================================================================
   Dynamic Heating & Cooling, Refrigeration
   Website refresh 2026 — shared stylesheet
   Brand colours sampled from the existing site so the refresh reads as the
   same company: navy #08208C, red #EC1B22, Open Sans.
   ========================================================================== */

/* ---------- tokens ---------------------------------------------------- */
:root{
  /* brand, sampled from the live site */
  --navy:#08208C;
  --navy-deep:#061761;
  --navy-tint:#EEF1FA;
  --red:#EC1B22;
  --red-deep:#BF1218;
  --red-tint:#FDEDEE;

  /* neutrals, biased slightly toward the navy so greys read as chosen */
  --ink:#1B2330;
  --body:#3C4655;
  --muted:#6B7686;
  --faint:#98A1AE;
  --line:#DCE0E7;
  --line-soft:#E9ECF1;
  --paper:#FFFFFF;
  --band:#F1F1F1;
  --wash:#F7F8FA;

  --ok:#1F7A4D;

  /* type */
  --font:"Open Sans","Segoe UI",Helvetica,Arial,sans-serif;

  /* scale */
  --step--1:.8125rem;
  --step-0:1.0625rem;
  --step-1:1.1875rem;
  --step-2:1.4375rem;
  --step-3:1.75rem;
  --step-4:2.125rem;
  --step-5:2.625rem;

  --gutter:24px;
  --maxw:1200px;
  --readw:68ch;

  --shadow:0 1px 2px rgba(27,35,48,.06),0 4px 14px rgba(27,35,48,.06);
  --shadow-lift:0 2px 4px rgba(27,35,48,.08),0 10px 28px rgba(27,35,48,.10);
}

/* ---------- reset ----------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important}
}
body{
  margin:0;background:var(--paper);color:var(--body);
  font-family:var(--font);font-size:var(--step-0);line-height:1.65;
  -webkit-font-smoothing:antialiased;
  /* room for the sticky mobile call bar */
  padding-bottom:0;
}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4{color:var(--ink);font-weight:700;line-height:1.2;margin:0 0 .5em;
  letter-spacing:-.015em;text-wrap:balance}
h1{font-size:var(--step-5)}
h2{font-size:var(--step-3)}
h3{font-size:var(--step-2);font-size:clamp(1.25rem,2.4vw,1.4375rem)}
h4{font-size:var(--step-1)}
p{margin:0 0 1.15em}
a{color:var(--red);text-decoration:none}
a:hover{color:var(--red-deep);text-decoration:underline}
ul,ol{margin:0 0 1.15em;padding-left:1.25em}
li{margin-bottom:.45em}
strong,b{font-weight:700;color:var(--ink)}
hr{border:0;border-top:1px solid var(--line);margin:2.5rem 0}
:focus-visible{outline:3px solid var(--red);outline-offset:2px;border-radius:2px}
.skip{position:absolute;left:-9999px;top:0;background:var(--navy);color:#fff;
  padding:12px 20px;z-index:200;font-weight:700}
.skip:focus{left:0;color:#fff}

/* ---------- layout helpers -------------------------------------------- */
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter)}
.read{max-width:var(--readw)}
.section{padding:clamp(44px,6vw,76px) 0}
.section--wash{background:var(--wash)}
.section--navy{background:var(--navy);color:#D8DEF4}
.section--navy h2,.section--navy h3{color:#fff}
.section--tight{padding:clamp(32px,4vw,52px) 0}
.center{text-align:center}
.stack>*+*{margin-top:1.15em}

/* eyebrow: the site's existing uppercase letterspaced treatment, kept as a
   label device only, never as a heading */
.eyebrow{
  font-size:var(--step--1);font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--red);margin:0 0 .65em;line-height:1.4;
}
.eyebrow--navy{color:var(--navy)}
.eyebrow--light{color:#9FB0E8}

.lede{font-size:clamp(1.0625rem,2vw,1.1875rem);line-height:1.6;color:var(--body)}
.lede strong{color:var(--ink)}

/* the short navy rule the current site uses under centred headings */
.rule{width:150px;height:4px;background:var(--navy);border:0;margin:20px auto 30px}
.rule--left{margin-left:0;margin-right:0}

/* ---------- buttons --------------------------------------------------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-family:var(--font);font-size:var(--step--1);font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;line-height:1.25;
  padding:15px 26px;border:2px solid transparent;border-radius:2px;
  cursor:pointer;text-align:center;transition:background .15s,color .15s,border-color .15s;
  /* the old site clipped button labels; never again */
  min-height:52px;white-space:normal;overflow-wrap:break-word;max-width:100%;
}
.btn:hover{text-decoration:none}
.btn--red{background:var(--red);color:#fff}
.btn--red:hover{background:var(--red-deep);color:#fff}
.btn--navy{background:var(--navy);color:#fff}
.btn--navy:hover{background:var(--navy-deep);color:#fff}
.btn--ghost{background:transparent;color:var(--navy);border-color:var(--navy)}
.btn--ghost:hover{background:var(--navy);color:#fff}
.btn--ghost-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.6)}
.btn--ghost-light:hover{background:#fff;color:var(--navy)}
.btn--wide{width:100%}
.btn-row{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 1.15em}
.btn svg{flex:none;width:17px;height:17px;fill:currentColor}

/* ---------- header ---------------------------------------------------- */
.utility{background:var(--paper);border-bottom:1px solid var(--line-soft)}
.utility .wrap{
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  gap:20px;padding-top:16px;padding-bottom:16px;
}
.utility-col{display:flex;flex-direction:column;gap:9px;align-items:flex-start}
.utility-col--right{align-items:flex-end;text-align:right}
.utility-lbl{
  font-size:var(--step--1);font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink);
  padding-bottom:8px;border-bottom:2px solid var(--navy);
}
.tel{
  font-size:1.375rem;font-weight:800;color:var(--red);letter-spacing:-.01em;
  white-space:nowrap;
}
.tel:hover{color:var(--red-deep);text-decoration:none}
.brandmark{display:block;text-align:center;text-decoration:none}
.brandmark:hover{text-decoration:none}
.brandmark .name{
  display:block;font-size:clamp(1.75rem,4vw,2.25rem);font-weight:800;
  color:var(--red);letter-spacing:.02em;line-height:1;text-transform:uppercase;
}
.brandmark .sub{
  display:block;font-size:var(--step--1);font-weight:600;color:var(--ink);
  margin-top:5px;letter-spacing:.01em;
}

/* ---------- nav ------------------------------------------------------- */
.nav{background:var(--navy);position:relative;z-index:60}
.nav .wrap{display:flex;align-items:stretch;justify-content:center}
.nav-toggle{display:none}
.menu{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;
  margin:0;padding:0;gap:0}
.menu>li{position:relative;margin:0}
.menu>li>a{
  display:flex;align-items:center;gap:6px;height:100%;
  padding:16px 15px;color:#fff;font-size:var(--step--1);font-weight:700;
  letter-spacing:.075em;text-transform:uppercase;line-height:1.3;
}
.menu>li>a:hover,.menu>li>a[aria-expanded="true"]{background:var(--navy-deep);
  color:#fff;text-decoration:none}
.menu>li[aria-current] > a,.menu>li>a[aria-current="page"]{
  background:var(--navy-deep);box-shadow:inset 0 -4px 0 var(--red)}
.caret{width:9px;height:9px;fill:currentColor;flex:none;transition:transform .15s}
[aria-expanded="true"] .caret{transform:rotate(180deg)}
.submenu{
  list-style:none;margin:0;padding:8px 0;position:absolute;top:100%;left:0;
  min-width:264px;background:#fff;box-shadow:var(--shadow-lift);
  border-top:4px solid var(--red);display:none;z-index:70;
}
.submenu li{margin:0}
.submenu a{
  display:block;padding:10px 20px;color:var(--ink);font-size:var(--step--1);
  font-weight:600;line-height:1.4;
}
.submenu a:hover{background:var(--navy-tint);color:var(--navy);text-decoration:none}
.menu>li.open>.submenu{display:block}

/* ---------- hero ------------------------------------------------------ */
.hero{position:relative;background:var(--navy-deep);overflow:hidden}
.hero-media{position:absolute;inset:0}
.hero-media img{width:100%;height:100%;object-fit:cover}
.hero-media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(100deg,rgba(6,23,70,.96) 0%,rgba(6,23,70,.82) 44%,rgba(10,16,32,.12) 100%);
}
.hero-inner{position:relative;z-index:2;padding:clamp(46px,6vw,78px) 0}
.hero-inner>.wrap{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);align-items:center;gap:56px}
.hero-copy{max-width:36rem;color:#E4E9F7}
.hero-credential{color:#fff;font-size:.82rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;border-left:4px solid var(--red);padding-left:12px;margin:0 0 18px}
.hero-area{color:#D3DAF0;font-size:.94rem;max-width:45ch}
.hero-offer{font-size:.82rem;color:#D3DAF0;margin:18px 0 0}
.hero-trane{justify-self:end;align-self:end;background:#fff;color:var(--ink);padding:28px 30px;border-top:5px solid var(--red);max-width:290px;margin-bottom:28px;box-shadow:0 12px 36px rgba(6,23,70,.2)}
.hero-trane>span{display:block;color:var(--red);font-size:3.6rem;line-height:1;font-weight:800;letter-spacing:-.04em}
.hero-trane>strong{display:block;margin-top:8px;font-size:1.08rem}
.hero-trane>p{margin:18px 0;font-size:.95rem;line-height:1.55}
.hero-trane>a{font-size:.85rem;font-weight:800}
.hero-photo-label{position:absolute;right:20px;bottom:10px;z-index:2;color:#fff;background:rgba(10,16,32,.55);font-size:.65rem;padding:3px 7px}
.utility-credential{color:var(--red);max-width:23ch}
.trane-band{background:#fff;border-bottom:1px solid var(--line)}
.trane-band>.wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:19px;padding-bottom:19px}
.trane-band>.wrap>div{display:flex;align-items:center;gap:12px;flex-shrink:0}
.trane-band-name{color:var(--red);font-weight:800;font-size:1.7rem;letter-spacing:-.04em;line-height:1}
.trane-band strong{font-size:.83rem;line-height:1.3;max-width:12ch}
.trane-band p{font-size:.83rem;margin:0;color:var(--muted)}
.trane-band p span{padding:0 8px;color:var(--line)}
.trane-band a{font-size:.8rem;font-weight:800}
@media(max-width:900px){
  .hero-inner>.wrap{grid-template-columns:1fr;gap:0}
  .hero-trane{display:none}
  .hero-media::after{background:rgba(6,23,70,.84)}
  .trane-band>.wrap{flex-wrap:wrap;gap:12px 24px}
  .trane-band p{flex:1 1 230px}
}
@media(max-width:600px){
  .hero-photo-label{font-size:.58rem}
  .trane-band>.wrap{padding-top:16px;padding-bottom:16px}
  .trane-band p{flex-basis:100%}
}
.hero h1{color:#fff;font-size:clamp(2rem,5.2vw,3.05rem);letter-spacing:-.022em;
  margin-bottom:.45em}
.hero .lede{color:#D3DAF0;font-size:clamp(1.0625rem,2.1vw,1.25rem)}
.hero .lede strong{color:#fff}
.hero .btn-row{margin-top:26px}
.hero-badges{
  display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:26px;padding-top:22px;
  border-top:1px solid rgba(255,255,255,.22);
}
.hero-badges span{
  font-size:var(--step--1);font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:#AEBCEC;
}

/* promo card, the offer box the current hero carries */
.promo{
  background:rgba(6,20,72,.86);border-left:5px solid var(--red);
  padding:20px 24px;margin-bottom:28px;max-width:29rem;
}
.promo .k{font-size:var(--step--1);font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:#9FB0E8;margin:0 0 4px}
.promo .v{font-size:clamp(1.25rem,3vw,1.5rem);font-weight:800;color:#fff;
  line-height:1.2;margin:0}

/* ---------- service strip (the site's existing dark quick-nav) --------- */
.strip{background:var(--ink);position:relative;z-index:3}
.strip ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap}
.strip li{margin:0;flex:1 1 auto}
.strip a{
  display:flex;align-items:center;justify-content:center;gap:8px;height:100%;
  padding:18px 18px;color:#fff;font-size:var(--step--1);font-weight:700;
  letter-spacing:.11em;text-transform:uppercase;text-align:center;line-height:1.3;
}
.strip a:hover{background:#2A3444;color:#fff;text-decoration:none}
.strip .is-urgent{background:var(--red)}
.strip .is-urgent:hover{background:var(--red-deep)}

/* ---------- page title band (interior pages) -------------------------- */
.pagehead{background:var(--band);border-bottom:1px solid var(--line)}
.pagehead .wrap{padding-top:clamp(32px,5vw,60px);padding-bottom:clamp(32px,5vw,60px)}
.pagehead h1{color:var(--ink);font-size:clamp(1.75rem,4.4vw,2.625rem);margin-bottom:0}
.pagehead .lede{margin-top:14px;max-width:60ch}
.crumbs{
  font-size:var(--step--1);color:var(--muted);margin:0 0 14px;
  display:flex;flex-wrap:wrap;gap:6px;align-items:center;
}
.crumbs a{color:var(--muted);font-weight:600}
.crumbs a:hover{color:var(--navy)}
.crumbs span[aria-current]{color:var(--ink);font-weight:700}
.crumbs .sep{color:var(--faint)}

/* full-width navy call band */
.callband{background:var(--navy);color:#fff}
.callband .wrap{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:16px 28px;padding-top:22px;padding-bottom:22px;
}
.callband p{margin:0;font-size:clamp(1.0625rem,2.2vw,1.3125rem);font-weight:700;
  color:#fff;line-height:1.35;max-width:44ch}
.callband .tel{color:#fff;font-size:1.5rem}
.callband .tel:hover{color:#fff;text-decoration:underline}

/* ---------- content + sidebar ----------------------------------------- */
.layout{
  display:grid;grid-template-columns:296px minmax(0,1fr);
  gap:clamp(28px,4vw,52px);align-items:start;
}
.layout--rev{grid-template-columns:minmax(0,1fr) 296px}
.aside{position:sticky;top:20px}
.prose{min-width:0}
.prose h2{margin-top:2em}
.prose h2:first-child{margin-top:0}
.prose h3{margin-top:1.6em;font-weight:700}
.prose>p:last-child{margin-bottom:0}

/* sidebar service nav, rebuilt from the current grey list */
.sidenav{border:1px solid var(--line);background:#fff;margin-bottom:22px}
.sidenav h2{
  background:var(--navy);color:#fff;font-size:var(--step-0);font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;margin:0;padding:15px 20px;
}
.sidenav ul{list-style:none;margin:0;padding:0}
.sidenav li{margin:0;border-top:1px solid var(--line-soft)}
.sidenav li:first-child{border-top:0}
.sidenav a{
  display:block;padding:13px 20px;color:var(--ink);font-weight:600;
  font-size:var(--step--1);line-height:1.45;
}
.sidenav a:hover{background:var(--navy-tint);color:var(--navy);text-decoration:none}
.sidenav a[aria-current="page"]{
  background:var(--navy-tint);color:var(--navy);
  box-shadow:inset 4px 0 0 var(--red);
}

/* sidebar promo card */
.sidecard{border:1px solid var(--line);border-top:4px solid var(--red);
  background:#fff;padding:22px 20px;margin-bottom:22px}
.sidecard h2,.sidecard h3{font-size:var(--step-1);margin-bottom:.5em}
.sidecard p{font-size:var(--step--1);margin-bottom:1em}
.sidecard p:last-of-type{margin-bottom:1.15em}
.sidecard--navy{background:var(--navy);border-color:var(--navy);color:#D3DAF0}
.sidecard--navy h2,.sidecard--navy h3{color:#fff}
.sidecard--navy .tel{color:#fff;font-size:1.5rem;display:block;margin-bottom:10px}

/* ---------- cards / grids --------------------------------------------- */
.grid{display:grid;gap:20px}
.grid--2{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.grid--3{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.grid--4{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}

.card{
  background:#fff;border:1px solid var(--line);padding:24px 22px;
  display:flex;flex-direction:column;
}
.card h3{font-size:var(--step-1);margin-bottom:.45em}
.card p{font-size:var(--step--1);line-height:1.6;margin-bottom:1em}
.card p:last-child{margin-bottom:0}
.card .more{margin-top:auto;padding-top:6px;font-size:var(--step--1);
  font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--red)}
/* a whole card can be a link: keep its body text reading as text, not as a link */
a.card{color:var(--body);text-decoration:none}
a.card h3{color:var(--ink)}
a.card:hover{color:var(--body);text-decoration:none}
a.card:hover h3{color:var(--navy)}
a.card:hover .more{color:var(--red-deep)}
.card--link:hover{border-color:var(--navy);box-shadow:var(--shadow)}

/* icon feature row, matching the red circular icons already on the site */
.feature{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start}
.feature .ico{
  width:44px;height:44px;border-radius:50%;background:var(--red);
  display:flex;align-items:center;justify-content:center;flex:none;
}
.feature .ico svg{width:22px;height:22px;fill:#fff}
.feature h3{font-size:var(--step-0);margin-bottom:.3em}
.feature p{font-size:var(--step--1);margin-bottom:0;line-height:1.6}

/* numbered process steps: used only where order is real information */
.steps{list-style:none;margin:0;padding:0;display:grid;gap:18px}
.steps li{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start;margin:0}
.steps .n{
  width:38px;height:38px;flex:none;background:var(--navy);color:#fff;
  font-weight:800;font-size:var(--step-0);display:flex;align-items:center;
  justify-content:center;
}
.steps h3{font-size:var(--step-0);margin-bottom:.25em}
.steps p{font-size:var(--step--1);margin-bottom:0}

/* chevron list, the site's existing bullet style */
.chev{list-style:none;padding:0;margin:0 0 1.15em}
.chev li{display:grid;grid-template-columns:auto 1fr;gap:11px;margin-bottom:.6em}
.chev li::before{
  content:"";width:8px;height:8px;margin-top:.52em;
  border-right:2px solid var(--red);border-bottom:2px solid var(--red);
  transform:rotate(-45deg);
}
.chev--navy li::before{border-color:var(--navy)}

/* trust bar */
.trust{border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  background:#fff}
.trust ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;
  justify-content:center;gap:14px 40px}
.trust li{margin:0;font-size:var(--step--1);font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:9px}
.trust li::before{content:"";width:7px;height:7px;background:var(--red);flex:none}

/* ---------- licensed service photography ----------------------------- */
.service-photo{margin:0;overflow:hidden;background:#fff}
.service-photo img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover}
.service-photo--tall img{aspect-ratio:3/4}
.service-photo figcaption{padding:12px 0 0;color:var(--muted);font-size:.72rem;line-height:1.5}
.service-photo figcaption span{color:var(--muted);white-space:nowrap}
.prose>.service-photo{margin:32px 0}
.prose>.service-photo:first-child{margin-top:0}
@media(max-width:900px){.service-photo--tall img{aspect-ratio:16/10}}

/* ---------- FAQ / accordion (feeds FAQPage schema) -------------------- */
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{
  cursor:pointer;list-style:none;padding:20px 44px 20px 0;position:relative;
  font-size:var(--step-1);font-weight:700;color:var(--ink);line-height:1.4;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";position:absolute;right:10px;top:50%;width:11px;height:11px;
  margin-top:-8px;border-right:2px solid var(--red);border-bottom:2px solid var(--red);
  transform:rotate(45deg);transition:transform .18s;
}
.faq details[open] summary::after{transform:rotate(-135deg);margin-top:-3px}
.faq summary:hover{color:var(--navy)}
.faq .answer{padding:0 0 22px;max-width:var(--readw)}
.faq .answer>*:last-child{margin-bottom:0}

/* answer capsule: the liftable first sentence for AI answers */
.capsule{
  background:var(--navy-tint);border-left:4px solid var(--navy);
  padding:16px 20px;margin:0 0 1.15em;
}
.capsule p{margin:0;font-weight:600;color:var(--ink)}

/* ---------- notes / callouts ------------------------------------------ */
.callout{border:1px solid var(--line);border-left:4px solid var(--red);
  background:var(--red-tint);padding:18px 22px;margin:0 0 1.15em}
.callout p{margin:0;font-size:var(--step--1)}
.callout p+p{margin-top:.7em}
.callout--navy{background:var(--navy-tint);border-left-color:var(--navy)}
.callout strong{color:var(--ink)}



/* ---------- forms ----------------------------------------------------- */
.form{display:grid;gap:16px}
.field label{display:block;font-size:var(--step--1);font-weight:700;color:var(--ink);
  margin-bottom:6px}
.field .hint{display:block;font-weight:400;color:var(--muted);margin-top:3px}
.field input,.field select,.field textarea{
  width:100%;font-family:var(--font);font-size:var(--step-0);color:var(--ink);
  background:#fff;border:1px solid var(--line);border-radius:2px;padding:13px 14px;
  min-height:50px;
}
.field textarea{min-height:130px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{
  border-color:var(--navy);outline:3px solid rgba(8,32,140,.18);outline-offset:0}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}

/* ---------- footer ---------------------------------------------------- */
.footer{background:var(--ink);color:#AEB6C4;padding:clamp(44px,6vw,64px) 0 0}
.footer a{color:#D6DBE4}
.footer a:hover{color:#fff}
.footer h2{color:#fff;font-size:var(--step-0);font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;margin-bottom:1em}
.footer-grid{display:grid;gap:34px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.footer ul{list-style:none;margin:0;padding:0}
.footer li{margin-bottom:.6em;font-size:var(--step--1)}
.footer .tel{color:#fff;font-size:1.375rem}
.footer .tel:hover{color:#fff}
.footer address{font-style:normal;font-size:var(--step--1);line-height:1.7}
.footer .legal{
  border-top:1px solid rgba(255,255,255,.14);margin-top:38px;padding:22px 0 28px;
  font-size:var(--step--1);display:flex;flex-wrap:wrap;gap:8px 24px;
  justify-content:space-between;color:#8B93A2;
}
.footer .legal p{margin:0}
/* agency credit: present but quiet, so it never competes with the client's own
   contact details sitting directly above it */
.footer .legal .credit{width:100%;padding-top:14px;margin-top:2px;
  border-top:1px solid rgba(255,255,255,.08);color:#767E8C}
.footer .legal .credit a{color:#9AA3B2;font-weight:600}
.footer .legal .credit a:hover{color:#fff;text-decoration:underline}

/* social profiles, footer business column */
.footer .social{display:flex;gap:10px;margin:16px 0 0;padding:0;list-style:none}
.footer .social li{margin:0}
.footer .social a{display:flex;align-items:center;justify-content:center;
  width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.08);
  transition:background .15s ease}
.footer .social a:hover{background:var(--red)}
.footer .social svg{width:18px;height:18px;fill:#D6DBE4}
.footer .social a:hover svg{fill:#fff}

/* the small print under an external application button */
.finestprint{font-size:var(--step--1);color:var(--muted);margin:10px 0 0}
.licenses{font-size:var(--step--1);color:#8B93A2;line-height:1.7;margin-top:1em}

/* ---------- sticky mobile call bar ------------------------------------ */
.callbar{
  display:none;position:fixed;left:0;right:0;bottom:0;z-index:120;
  background:var(--red);box-shadow:0 -2px 14px rgba(0,0,0,.22);
}
.callbar a{
  display:flex;align-items:center;justify-content:center;gap:10px;
  padding:15px 16px;color:#fff;font-size:var(--step-0);font-weight:800;
  letter-spacing:.05em;text-transform:uppercase;
}
.callbar a:hover{color:#fff;text-decoration:none}
.callbar svg{width:19px;height:19px;fill:#fff}

/* ---------- responsive ------------------------------------------------ */
@media (max-width:1000px){
  .layout,.layout--rev{grid-template-columns:minmax(0,1fr)}
  .aside{position:static;order:2}
  .prose{order:1}
}
@media (max-width:900px){
  :root{--gutter:18px}
  /* compact header: logo and the phone number only. The reviews link lives in
     the nav and the footer, and the phone is the conversion on mobile. */
  .utility .wrap{grid-template-columns:1fr;gap:12px;text-align:center}
  .utility-col,.utility-col--right{align-items:center;text-align:center}
  .brandmark{order:-1}
  .utility-col:not(.utility-col--right){display:none}
  .utility-col--right .utility-lbl{border-bottom:0;padding-bottom:0}

  /* mobile drawer nav */
  .nav .wrap{display:block;padding:0}
  .nav-toggle{
    display:flex;align-items:center;justify-content:space-between;width:100%;
    gap:12px;background:var(--navy);color:#fff;border:0;
    font-family:var(--font);font-size:var(--step-0);font-weight:700;
    letter-spacing:.1em;text-transform:uppercase;padding:16px var(--gutter);
    cursor:pointer;min-height:56px;
  }
  .nav-toggle .bars{display:grid;gap:4px;flex:none}
  .nav-toggle .bars i{display:block;width:22px;height:2px;background:#fff}
  .menu{
    display:none;flex-direction:column;background:var(--navy-deep);
    padding:6px 0 12px;
  }
  .menu.is-open{display:flex}
  .menu>li>a{padding:14px var(--gutter);justify-content:space-between;
    border-top:1px solid rgba(255,255,255,.10)}
  .submenu{
    position:static;display:none;min-width:0;box-shadow:none;border-top:0;
    background:rgba(0,0,0,.22);padding:0;
  }
  .menu>li.open>.submenu{display:block}
  .submenu a{color:#D3DAF0;padding:12px var(--gutter) 12px calc(var(--gutter) + 18px);
    font-weight:400}
  .submenu a:hover{background:rgba(0,0,0,.3);color:#fff}

  .strip ul{flex-direction:column}
  .strip a{justify-content:flex-start;padding:15px var(--gutter);
    border-top:1px solid rgba(255,255,255,.12)}
  .strip li:first-child a{border-top:0}

  .callband .wrap{flex-direction:column;align-items:flex-start}
  .form-row{grid-template-columns:1fr}

  body{padding-bottom:56px}
  .callbar{display:block}
}
@media (max-width:600px){
  body{font-size:1rem}
  .btn{width:100%}
  .btn-row{flex-direction:column;align-items:stretch}
  .hero-inner{padding:40px 0}
  .trust ul{flex-direction:column;align-items:flex-start;gap:11px}
}

/* ---------- print ----------------------------------------------------- */
@media print{
  .nav,.strip,.callbar,.utility,.hero-media{display:none!important}
  body{color:#000;font-size:11pt}
  .section{padding:14pt 0}
  a{color:#000;text-decoration:underline}
  .card,.faq details,.callout{break-inside:avoid}
}