/* Self-hosted variable fonts — no third-party request, no GDPR exposure.
   Optical-size axis dropped: 119KB -> 49KB for the serif, no visible difference
   at the sizes used here. latin-ext only downloads if a page needs those glyphs. */

@font-face{
  font-family:'Source Sans 3';
  font-style:normal;
  font-weight:400 800;
  font-display:swap;
  src:url('../fonts/source-sans-3-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face{
  font-family:'Source Sans 3';
  font-style:normal;
  font-weight:400 800;
  font-display:swap;
  src:url('../fonts/source-sans-3-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Source Serif 4';
  font-style:italic;
  font-weight:400 600;
  font-display:swap;
  src:url('../fonts/source-serif-4-italic-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face{
  font-family:'Source Serif 4';
  font-style:italic;
  font-weight:400 600;
  font-display:swap;
  src:url('../fonts/source-serif-4-italic-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Source Serif 4';
  font-style:normal;
  font-weight:400 700;
  font-display:swap;
  src:url('../fonts/source-serif-4-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face{
  font-family:'Source Serif 4';
  font-style:normal;
  font-weight:400 700;
  font-display:swap;
  src:url('../fonts/source-serif-4-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/* ==========================================================================
   PG Lakin — shared site stylesheet
   Tokens, reset, utilities, buttons and the shared chrome (top bar, header,
   mobile menu, footer, sticky action bar). Page-specific sections stay in a
   <style> block on each page.
   ========================================================================== */

/* ---------------------------------------------------------------- tokens */
:root{
  --muted-on-dark:#B7AFA6;
  --paper:#FBF9F5;
  --paper-2:#F2EDE4;
  --white:#FFFFFF;
  --ink:#26211E;
  --ink-2:#2E2620;
  --muted:#57504B;
  --muted-2:#6E6760;
  --muted-3:#8A8177;
  --line:#E1D9CC;
  --line-2:#E7DFD1;
  --line-3:#C9C0B2;
  --line-4:#E4DCCE;
  --red:#C0261A;
  --red-dark:#9E1D13;
  --red-tint:#F6E7E3;
  --red-line:#E4B4AC;
  --maroon:#7C100C;
  --band:#661310;
  --band-rose:#E8A79B;
  --dark:#24201D;
  --darker:#191512;
  --dark-line:#453E38;
  --dark-line-2:#37302A;
  --cream:#FFFFFF;
  --cream-2:#DAD4CC;
  --gold:#C9910D;
  --serif:'Source Serif 4',Georgia,'Times New Roman',serif;
  --sans:'Source Sans 3',system-ui,-apple-system,'Segoe UI',Helvetica,Arial,sans-serif;
  --gutter:clamp(20px,5vw,72px);
  --maxw:1296px;
  --section-y:88px;
}

/* ----------------------------------------------------------------- reset */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-size:16px;line-height:1.5;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img,svg{display:block;max-width:100%}
h1,h2,h3,h4,p,figure,blockquote,ul,ol{margin:0;padding:0}
ul,ol{list-style:none}
a{color:var(--red);text-decoration:none}
a:hover{color:var(--red-dark)}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--red);outline-offset:3px;border-radius:4px}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
}

/* ------------------------------------------------------------- utilities */
.wrap{width:100%;max-width:var(--maxw);margin-inline:auto}
.pad{padding-inline:var(--gutter)}
.section{padding:var(--section-y) var(--gutter)}
.visually-hidden{
  position:absolute;width:1px;height:1px;margin:-1px;padding:0;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}
.skip-link{
  position:absolute;left:12px;top:-60px;z-index:200;
  background:var(--red);color:#FDF8F3;font-weight:600;
  padding:12px 18px;border-radius:0 0 10px 10px;transition:top .18s ease;
}
.skip-link:focus{top:0;color:#FDF8F3}
.eyebrow{
  font-weight:600;font-size:12.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--red);margin-bottom:12px;
}
.stars{color:var(--gold);letter-spacing:2px}
.arrow{transition:transform .18s ease}
.textlink{font-weight:600;font-size:15px;color:var(--red)}
.textlink:hover .arrow{transform:translateX(3px)}

h1,h2,h3{font-family:var(--serif);font-weight:700;letter-spacing:-.005em;text-wrap:pretty}
.h2{font-size:36px;line-height:1.15}
.section-head{
  display:flex;justify-content:space-between;align-items:flex-end;
  gap:40px;margin-bottom:44px;
}
.section-head__note{font-size:15px;color:var(--muted-2);max-width:38ch;text-align:right}

/* ---------------------------------------------------- shared card grid */
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card-grid--4{grid-template-columns:repeat(4,1fr);gap:20px}

/* --------------------------------------------------------------- buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-weight:600;font-size:15px;line-height:1.2;
  padding:14px 26px;border-radius:10px;border:1.5px solid transparent;
  min-height:48px;text-align:center;
  transition:background-color .18s ease,color .18s ease,border-color .18s ease;
}
.btn--lg{font-size:16px;padding:16px 30px}
.btn--primary{background:var(--red);color:#FDF8F3}
.btn--primary:hover{background:var(--red-dark);color:#FDF8F3}
.btn--primary-shadow{box-shadow:0 10px 26px -8px rgba(0,0,0,.55)}
.btn--outline{border-color:var(--ink);color:var(--ink)}
.btn--outline:hover{background:var(--ink);color:var(--paper)}
.btn--on-image{border-color:rgba(247,243,236,.72);color:#FBF9F5}
.btn--on-image:hover{background:#FBF9F5;color:var(--ink)}
.btn--light{background:var(--paper);color:var(--band)}
.btn--light:hover{background:#EFE2D6;color:var(--band)}
.btn--ghost-rose{border-color:#9B534B;color:#F5EBE2}
.btn--ghost-rose:hover{border-color:var(--band-rose);color:#F5EBE2}
.btn--ghost-dark{border-color:#5A5148;color:var(--cream)}
.btn--ghost-dark:hover{border-color:var(--band-rose);color:var(--cream)}
.btn--block{width:100%}

/* ---------------------------------------------------------------- topbar */
.topbar{background:var(--maroon);color:#F0C9C3;font-weight:600;font-size:12.5px}
.topbar__inner{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-block:9px}
.topbar__group{display:flex;gap:24px;align-items:center}
.topbar__item{display:flex;align-items:center;gap:6px}
.topbar a{color:#F0C9C3}
.topbar a:hover{color:#FFFFFF}

/* ---------------------------------------------------------------- header */
.site-header{
  background:var(--white);border-bottom:1px solid var(--line-4);
  position:sticky;top:0;z-index:70;
}
.site-header__inner{display:flex;justify-content:space-between;align-items:center;gap:28px;padding-block:18px}
.brand img{height:50px;width:auto}
.nav{display:flex;gap:28px;align-items:center;font-weight:600;font-size:15px}
.nav__link{
  color:var(--ink-2);padding-bottom:4px;
  border-bottom:2px solid transparent;display:flex;align-items:center;gap:5px;
}
.nav__link:hover,.nav__link[aria-expanded="true"]{color:var(--red);border-bottom-color:var(--red)}
.nav__caret{font-size:10px;color:var(--red);transition:transform .18s ease}
.nav__link[aria-expanded="true"] .nav__caret{transform:rotate(180deg)}
.nav__sep{width:1px;height:34px;background:var(--line-4);margin-inline:4px}
.nav__actions{display:flex;align-items:center;gap:18px}

.has-menu{position:relative}
.submenu{
  position:absolute;top:calc(100% + 14px);left:-14px;min-width:250px;
  background:var(--white);border:1px solid var(--line-2);border-radius:12px;
  box-shadow:0 22px 44px -20px rgba(38,33,30,.4);
  padding:8px;display:none;z-index:80;
}
.submenu[data-open="true"]{display:block}
.submenu a{
  display:block;padding:10px 14px;border-radius:8px;
  font-size:14.5px;font-weight:600;color:var(--ink-2);
}
.submenu a:hover{background:var(--paper-2);color:var(--red)}

.phone-cta{display:flex;align-items:center;gap:11px}
.phone-cta__icon{
  width:44px;height:44px;border-radius:50%;background:var(--red);
  display:grid;place-items:center;flex:none;transition:background-color .18s ease;
}
.phone-cta:hover .phone-cta__icon{background:var(--red-dark)}
.phone-cta__label{display:block;font-weight:700;font-size:10px;letter-spacing:.16em;color:#9A8F84}
.phone-cta__number{display:block;font-weight:800;font-size:22px;color:var(--ink);letter-spacing:.01em;line-height:1.12}

.header-mobile{display:none;gap:8px;align-items:center}
.icon-btn{
  width:44px;height:44px;border-radius:10px;display:grid;place-items:center;flex:none;
  transition:background-color .18s ease;
}
.icon-btn--red{background:var(--red)}
.icon-btn--red:hover{background:var(--red-dark)}
.icon-btn--outline{border:1px solid #D9D1C3}
.burger{display:flex;flex-direction:column;gap:4px;align-items:center;justify-content:center}
.burger span{width:17px;height:2px;background:var(--ink);border-radius:2px}

/* ----------------------------------------------------------- mobile menu */
.mobile-menu{
  position:fixed;inset:0;z-index:100;background:var(--paper);
  display:flex;flex-direction:column;
  transform:translateY(-100%);visibility:hidden;
  transition:transform .28s ease,visibility .28s;
  overflow-y:auto;overscroll-behavior:contain;
}
.mobile-menu[data-open="true"]{transform:translateY(0);visibility:visible}
.mobile-menu__top{
  display:flex;justify-content:space-between;align-items:center;
  padding:12px var(--gutter);border-bottom:1px solid var(--line);background:var(--white);
}
.mobile-menu__top img{height:30px;width:auto}
.mobile-menu__body{padding:22px var(--gutter) 40px;display:flex;flex-direction:column;gap:6px}
.mobile-menu__link{
  display:flex;justify-content:space-between;align-items:center;
  font-family:var(--serif);font-weight:700;font-size:21px;color:var(--ink);
  padding:14px 0;border-bottom:1px solid var(--line);min-height:52px;
}
.mobile-menu__sub{display:none;padding:4px 0 14px;flex-direction:column;gap:2px}
.mobile-menu__sub[data-open="true"]{display:flex}
.mobile-menu__sub a{
  font-size:16px;font-weight:600;color:var(--muted);
  padding:11px 0 11px 16px;border-left:2px solid var(--line);min-height:44px;display:flex;align-items:center;
}
.mobile-menu__sub a:hover{color:var(--red);border-left-color:var(--red)}
.mobile-menu__actions{display:flex;flex-direction:column;gap:10px;margin-top:22px}

/* ---------------------------------------------------------------- footer */
.site-footer{background:var(--darker);color:var(--cream-2);padding:60px var(--gutter) 34px}
.site-footer a{color:var(--cream-2)}
.site-footer a:hover{color:var(--cream)}
.footer__grid{
  display:grid;grid-template-columns:1.4fr 1fr 1fr 1.1fr;gap:48px;
  padding-bottom:44px;border-bottom:1px solid var(--dark-line-2);
}
.footer__brand img{height:32px;width:auto}
.footer__address{font-size:13.5px;line-height:1.7;margin-top:16px}
.footer__address strong{color:var(--cream)}
.footer__title{font-weight:600;font-size:11px;letter-spacing:.12em;color:var(--muted-on-dark);margin-bottom:14px}
.footer__links{display:flex;flex-direction:column;gap:9px;font-size:13.5px}
.footer__badges{display:flex;flex-wrap:wrap;gap:8px}
.footer__badge{
  border:1px solid var(--dark-line-2);color:var(--cream-2);
  font-weight:600;font-size:10.5px;letter-spacing:.08em;padding:7px 11px;border-radius:6px;
}
.footer__base{
  display:flex;justify-content:space-between;align-items:center;gap:24px;
  padding-top:22px;font-size:12px;color:var(--muted-on-dark);flex-wrap:wrap;
}
.footer__legal{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.footer__legal a{color:var(--muted-on-dark)}
.footer__rule{width:1px;height:15px;background:var(--dark-line-2)}
.footer__credit{display:flex;align-items:center;gap:8px;color:var(--muted-on-dark)}
.footer__credit img{height:15px;width:auto}

/* ------------------------------------------------------------ sticky bar */
.sticky-bar{
  position:fixed;left:0;right:0;bottom:0;z-index:90;display:none;
  border-top:1px solid var(--line);background:var(--paper);
  box-shadow:0 -6px 18px rgba(38,33,30,.12);
  transform:translateY(110%);transition:transform .26s ease;
  padding-bottom:env(safe-area-inset-bottom);
}
.sticky-bar[data-visible="true"]{transform:translateY(0)}
.sticky-bar a{
  flex:1;display:flex;align-items:center;justify-content:center;gap:8px;
  font-weight:600;font-size:15px;padding:15px 0;min-height:48px;
}
.sticky-bar__call{background:var(--red);color:#FDF8F3}
.sticky-bar__call:hover{background:var(--red-dark);color:#FDF8F3}
.sticky-bar__quote{background:var(--ink);color:var(--cream)}
.sticky-bar__quote:hover{background:var(--darker);color:var(--cream)}

/* =================================================== tablet · under 1080 */
@media (max-width:1079px){
  .card-grid--4{grid-template-columns:repeat(3,1fr)}
  .nav{display:none}
  .header-mobile{display:flex}
  .site-header__inner{padding-block:12px}
  .brand img{height:40px}
  .topbar__group--wide{display:none}
  .topbar__inner{justify-content:center}
  .footer__grid{grid-template-columns:1fr 1fr;gap:36px}
}

/* ==================================================== small · under 1000 */
@media (max-width:999px){
  :root{
  --section-y:64px}
  .card-grid{grid-template-columns:1fr 1fr}
  .card-grid--4{grid-template-columns:1fr 1fr}
  .section-head{flex-direction:column;align-items:flex-start;gap:16px;margin-bottom:32px}
  .section-head__note{text-align:left}
  .h2{font-size:30px}
}

/* ============================================= mobile · 390 design frame */
@media (max-width:767px){
  :root{
  --section-y:44px}

  .topbar{font-weight:400;font-size:11.5px;color:#F2D9D5}
  .topbar__inner{padding-block:7px}
  .topbar__item svg{display:none}

  .site-header{position:static}
  .brand img{height:30px}

  .h2{font-size:25px;line-height:1.2}
  .eyebrow{font-size:11px;letter-spacing:.15em;margin-bottom:10px}
  .section-head{margin-bottom:20px}
  .section-head__note{font-size:14px}
  .card-grid{grid-template-columns:1fr;gap:10px}
  .card-grid--4{grid-template-columns:1fr;gap:10px}

  .site-footer{padding:44px var(--gutter) 28px}
  .footer__grid{grid-template-columns:1fr;gap:28px;padding-bottom:28px}
  .footer__base{flex-direction:column;align-items:flex-start;gap:14px}

  .sticky-bar{display:flex}
  body{padding-bottom:calc(62px + env(safe-area-inset-bottom))}
}

/* ==========================================================================
   Enquiry form — shared component, skinned per page.
   Add .enquiry-form for the layout and field styling; the page supplies the
   card chrome. .enquiry-form--dark reskins it for a dark panel.
   ========================================================================== */
.enquiry-form{
  --form-label:var(--ink);
  --form-input-bg:var(--white);
  --form-input-border:var(--line-3);
  --form-input-ink:var(--ink);
  --form-placeholder:var(--muted-3);
  --form-legend:var(--muted);
  --form-consent:var(--muted-2);
  --form-note:var(--muted-3);
  --form-accent:var(--red);
  display:flex;flex-direction:column;gap:14px;
}
.enquiry-form--dark{
  --form-label:#EDE7DF;
  --form-input-bg:var(--paper);
  --form-input-border:#4A423B;
  --form-legend:#D9D0C5;
  --form-consent:var(--cream-2);
  --form-note:var(--muted-on-dark);
  --form-accent:var(--band-rose);
}
.field label,.fieldset__legend{display:block;font-weight:600;font-size:12px;margin-bottom:5px;color:var(--form-label)}
.field .req{color:var(--form-accent)}
.field input,.field select,.field textarea{
  width:100%;border:1px solid var(--form-input-border);border-radius:10px;
  background:var(--form-input-bg);color:var(--form-input-ink);
  padding:0 13px;height:44px;font-size:14.5px;
  transition:border-color .18s ease,box-shadow .18s ease;
}
.field textarea{height:88px;padding:11px 13px;line-height:1.5;resize:vertical}
.field select{appearance:none;padding-right:34px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%236E6760' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 13px center;
}
.field input:focus,.field select:focus,.field textarea:focus{
  border-color:var(--red);box-shadow:0 0 0 3px rgba(192,38,26,.14);outline:none;
}
.field input::placeholder,.field textarea::placeholder{color:var(--form-placeholder)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fieldset{border:0;padding:0;margin:0}
.radio-row{display:flex;gap:16px;align-items:center;font-size:13px;color:var(--form-legend);flex-wrap:wrap}
.radio-row .fieldset__legend{margin-bottom:0}
.choice{display:flex;align-items:center;gap:7px;min-height:32px}
.choice input{width:16px;height:16px;accent-color:var(--form-accent);margin:0;flex:none}
.consent{display:flex;gap:9px;align-items:flex-start;font-size:12px;color:var(--form-consent);line-height:1.45}
.consent input{width:16px;height:16px;accent-color:var(--form-accent);margin:1px 0 0;flex:none}
.form-note{font-size:12px;color:var(--form-note);text-align:center}

/* Honeypot: off-screen rather than display:none, and kept out of the tab
   order and the accessibility tree. Server rejects any request that fills it. */
.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}

@media (max-width:767px){
  .field-row{grid-template-columns:1fr}
}

/* ------------------------------------------------------------- breadcrumb */
.breadcrumb{display:flex;gap:7px;flex-wrap:wrap;font-size:13px;color:var(--muted-3);margin-bottom:22px}
.breadcrumb a{color:var(--muted-3)}
.breadcrumb a:hover{color:var(--red)}
.breadcrumb [aria-current="page"]{color:var(--ink);font-weight:600}

/* ==========================================================================
   Dark header — service-page variant (see 02 Heating Services design).
   Desktop only: below 1080 the header collapses to the shared light bar with
   a burger, exactly as the 390 frame shows.
   ========================================================================== */
.brand__light{display:none}
@media (min-width:1080px){
  .site-header--dark{background:#221E1B;border-bottom:3px solid var(--red)}
  .site-header--dark .site-header__inner{padding-block:15px}
  .site-header--dark .brand__light{display:block}
  .site-header--dark .brand__dark{display:none}
  .site-header--dark .brand img{height:46px}
  .site-header--dark .nav__link{color:#E8DFD5}
  .site-header--dark .nav__link:hover{color:#FFFFFF;border-bottom-color:#7A4A44}
  .site-header--dark .nav__link[aria-current="page"],
  .site-header--dark .nav__link[aria-expanded="true"]{color:#FFFFFF;border-bottom-color:var(--red)}
  .site-header--dark .nav__caret{color:#C48B82}
  .site-header--dark .nav__sep{display:none}
  .site-header--dark .nav{gap:30px}
  .site-header--dark .phone-cta__label{color:#B9A69F}
  .site-header--dark .phone-cta__number{color:#FCF4EC}
  .site-header--dark .phone-cta__icon{box-shadow:0 4px 14px rgba(192,38,26,.4)}
  .site-header--dark .nav__actions{gap:20px}
  .site-header--dark .btn--primary{background:#D62A1C;box-shadow:0 6px 18px rgba(214,42,28,.4);padding:15px 26px;font-weight:700}
  .site-header--dark .btn--primary:hover{background:#B8231A}
  .site-header--dark .submenu{border-color:#3A322D}
}


/* ==========================================================================
   Page: home
   ========================================================================== */
/* ------------------------------------------------------------------ hero */
.hero{
  --hero-eyebrow:#EEB1A4;--hero-ink:#FFFFFF;--hero-lede:#EADFD6;
  position:relative;display:flex;align-items:center;
  min-height:540px;background:#1B1512;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(72deg,rgba(18,12,10,.9) 2%,rgba(18,12,10,.58) 42%,rgba(18,12,10,.12) 74%,rgba(18,12,10,0) 100%);
}
.hero-copy{
  position:relative;z-index:2;width:100%;
  max-width:calc(var(--maxw) + var(--gutter) * 2);
  margin-inline:auto;padding:56px var(--gutter);
}
.hero-copy>*{max-width:820px}
.hero__eyebrow{
  font-weight:600;font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--hero-eyebrow);margin-bottom:18px;
}
.hero h1{
  font-size:54px;line-height:1.1;color:var(--hero-ink);
  margin-bottom:20px;text-shadow:0 2px 24px rgba(0,0,0,.4);
}
.hero__lede{
  font-size:18.5px;line-height:1.6;color:var(--hero-lede);
  margin-bottom:32px;max-width:56ch;text-shadow:0 1px 12px rgba(0,0,0,.35);
}
.hero__actions{display:flex;gap:14px;align-items:center;margin-bottom:24px;flex-wrap:wrap}
.hero__rating{display:flex;align-items:center;gap:10px;font-size:14.5px;color:var(--hero-lede)}
.hero__rating strong{color:#fff}
.hero .stars{color:#F0C24B;font-size:15px}

/* ------------------------------------------------------------ trust band */
.trust{background:var(--dark);color:var(--cream);padding:32px var(--gutter)}
/* Stats only. The accreditation marks live in their own white band below —
   most of that artwork is drawn for white and looks weak boxed on the dark. */
.trust__inner{display:flex}
.trust__stats{display:flex;gap:48px;flex-wrap:nowrap;align-items:center}
.trust__rule{width:1px;background:var(--dark-line);align-self:stretch}
.stat__n{display:block;font-family:var(--serif);font-weight:700;font-size:30px;line-height:1.1}
.stat__l{display:block;font-size:13px;color:var(--cream-2);margin-top:3px;line-height:1.4}
.badges{display:flex;gap:9px;flex-wrap:wrap}
.badge{
  border:1px solid #5A5148;color:#EDE4D8;font-weight:600;font-size:11px;
  letter-spacing:.07em;padding:8px 12px;border-radius:6px;white-space:nowrap;
  display:flex;align-items:center;
}
/* Accreditation strip: its own white band, marks spread across the full
   width so there is no dead space, and sized to actually be read. The grid
   gives every mark an equal column whatever its aspect ratio. */
.accreditations{background:var(--white);border-bottom:1px solid var(--line);padding:30px var(--gutter)}
.accreditations__list{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:24px 36px;align-items:center;justify-items:center;
}
.accreditations__item{display:flex;align-items:center;justify-content:center;width:100%}
.accreditations__item img{
  height:96px;width:auto;max-width:100%;object-fit:contain;display:block;
}
.accreditations__name{
  font-weight:600;font-size:12px;letter-spacing:.07em;text-transform:uppercase;
  color:var(--muted);text-align:center;
}

/* -------------------------------------------------------------- services */
.service-card{
  position:relative;overflow:hidden;
  background:var(--white);border:1px solid var(--line-2);border-radius:14px;
  display:flex;flex-direction:column;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.service-card__body{
  padding:24px 24px 22px;display:flex;flex-direction:column;gap:14px;flex:1;
}
/* Photo caps the card. 16:10 keeps every card the same height whatever the
   source crop, so the grid stays on a line. */
.service-card__media{aspect-ratio:16/10;overflow:hidden;background:var(--paper-2)}
.service-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.service-card:hover .service-card__media img{transform:scale(1.04)}
.service-card--media .service-card__body{padding-top:20px}
.service-card:hover{
  border-color:var(--red);transform:translateY(-4px);
  box-shadow:0 20px 36px -22px rgba(38,33,30,.4);
}
.service-card__icon{
  width:48px;height:48px;border-radius:13px;background:var(--red-tint);
  color:var(--red);display:grid;place-items:center;flex:none;
}
.service-card__title{font-size:21px;color:var(--ink)}
.service-card__text{font-size:14.5px;line-height:1.55;color:var(--muted);margin:0}
.service-card__link{
  display:inline-flex;align-items:center;gap:7px;font-weight:600;font-size:14px;
  color:var(--red);margin-top:auto;padding-top:14px;border-top:1px solid #EFE7DA;
}
/* the card's single link, stretched so the whole card is one target */
.service-card__link::after{content:"";position:absolute;inset:0;border-radius:inherit}
.service-card:hover .service-card__link .arrow{transform:translateX(4px)}

.brand-strip{
  display:flex;align-items:center;gap:28px;
  margin-top:40px;padding-top:26px;border-top:1px solid var(--line);
}
.brand-strip__label{font-weight:600;font-size:11px;letter-spacing:.12em;color:var(--muted-3);flex:none}
.brand-strip__list{
  display:flex;gap:26px;flex-wrap:wrap;align-items:center;
  font-family:var(--serif);font-weight:600;font-size:15px;color:var(--muted-2);
}
.brand-strip__list li{display:flex;align-items:center;gap:26px}
.brand-strip__list li:not(:last-child)::after{content:"\00B7";color:var(--line-3)}

/* -------------------------------------------------------------- aga band */
.aga{
  background:var(--band);color:#F5EBE2;
  padding:84px var(--gutter);
  display:grid;grid-template-columns:520px 1fr;gap:64px;align-items:center;
  max-width:calc(var(--maxw) + var(--gutter) * 2);margin-inline:auto;
}
.aga-band{background:var(--band)}
.aga-media{height:420px;border-radius:14px;overflow:hidden}
.aga-media img{width:100%;height:100%;object-fit:cover}
.aga__eyebrow{color:var(--band-rose)}
.aga h2{font-size:38px;line-height:1.15;margin-bottom:18px}
.aga__lede{font-size:16.5px;line-height:1.65;color:#F0DED4;margin-bottom:26px;max-width:58ch}
.aga__list{
  display:grid;grid-template-columns:1fr 1fr;gap:11px 28px;
  margin-bottom:30px;font-size:15px;
}
.aga__list li{display:flex;gap:10px;align-items:center}
.aga__list svg{flex:none}
.aga__actions{display:flex;gap:14px;flex-wrap:wrap}

/* ------------------------------------------------------------------- why */
/* Tinted band. The projects section that used to separate this from the
   reviews below was removed, leaving two paper sections back to back. */
.why-band{
  background:var(--paper-2);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.why{display:grid;grid-template-columns:380px 1fr;gap:64px}
.why__intro p{font-size:15.5px;line-height:1.6;color:var(--muted)}
.why__intro h2{margin-bottom:16px}
.why__grid{display:grid;grid-template-columns:1fr 1fr;gap:34px 40px}
.why__item{border-top:2px solid var(--ink);padding-top:16px}
.why__item h3{font-family:var(--sans);font-weight:600;font-size:17px;margin-bottom:7px}
.why__item p{font-size:14.5px;line-height:1.55;color:var(--muted)}

/* --------------------------------------------------------------- reviews */
.reviews__head{text-align:center;margin-bottom:44px}
.reviews__head h2{margin-bottom:10px}
.reviews__meta{font-size:14.5px;color:var(--muted-2)}
.carousel{position:relative;max-width:1240px;margin-inline:auto}
.carousel__viewport{overflow:hidden}
.carousel__track{display:flex;transition:transform .55s cubic-bezier(.4,0,.2,1)}
.quote{
  flex:0 0 100%;display:flex;flex-direction:column;align-items:center;
  text-align:center;padding:6px 70px 4px;
}
.quote__mark{
  font-family:var(--serif);font-weight:700;font-size:92px;line-height:.9;
  color:#E4B2A7;margin-bottom:6px;user-select:none;
}
.quote blockquote{
  font-family:var(--serif);font-style:italic;font-weight:500;
  font-size:30px;line-height:1.5;color:var(--ink);max-width:880px;margin-bottom:30px;
}
.quote__stars{color:var(--gold);letter-spacing:3px;font-size:16px;margin-bottom:15px}
.quote figcaption{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:center}
.quote__name{font-weight:600;font-size:15px;color:var(--ink)}
.quote__dot{width:4px;height:4px;border-radius:50%;background:var(--line-3)}
.quote__tag{
  font-weight:600;font-size:11px;letter-spacing:.08em;color:var(--muted-2);
  background:var(--paper-2);padding:5px 11px;border-radius:6px;
}
.carousel__btn{
  position:absolute;top:40%;transform:translateY(-50%);
  width:52px;height:52px;border-radius:50%;background:var(--white);
  border:1px solid var(--line);display:grid;place-items:center;
  box-shadow:0 8px 20px -10px rgba(38,33,30,.3);
  transition:border-color .18s ease,background-color .18s ease;
}
.carousel__btn:hover{border-color:var(--red);background:#FBF3F1}
.carousel__btn--prev{left:-4px}
.carousel__btn--next{right:-4px}
.carousel__dots{display:flex;gap:9px;justify-content:center;align-items:center;margin-top:38px}
.carousel__dot{
  width:9px;height:9px;border-radius:99px;background:#D8CFC0;padding:0;
  transition:width .3s ease,background-color .3s ease;
}
.carousel__dot[aria-current="true"]{width:26px;background:var(--red)}

/* ----------------------------------------------------------------- areas */
.areas{background:var(--paper-2);border-top:1px solid var(--line);padding:84px var(--gutter)}
.areas__grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.areas__intro h2{margin-bottom:18px}
.areas__intro p{font-size:15.5px;line-height:1.65;color:var(--muted);margin-bottom:20px;max-width:52ch}
.areas__list{
  display:grid;grid-template-columns:repeat(3,1fr);gap:9px 24px;
  font-size:14.5px;color:var(--muted);padding-top:8px;
}
.areas__list li{border-bottom:1px solid var(--line);padding-bottom:8px}
.areas__list li:last-child{font-weight:600;color:var(--red)}

/* --------------------------------------------------------------- contact */
.contact{background:var(--dark);color:var(--cream);padding:84px var(--gutter)}
.contact__grid{display:grid;grid-template-columns:1fr 520px;gap:72px}
.contact__eyebrow{color:var(--band-rose)}
.contact h2{font-size:38px;line-height:1.15;margin-bottom:16px}
.contact__lede{font-size:16px;line-height:1.65;color:var(--cream-2);margin-bottom:34px;max-width:50ch}
.contact__rows{display:flex;flex-direction:column;gap:18px;font-size:15.5px}
.contact__row{display:flex;gap:14px;align-items:baseline}
.contact__row dt{font-weight:600;font-size:11px;letter-spacing:.1em;color:var(--muted-on-dark);width:76px;flex:none}
.contact__row dd{margin:0}
.contact__row a{color:var(--cream)}
.contact__row a:hover{color:var(--band-rose)}
.contact__number{font-size:20px;font-weight:700}
.contact__aside{color:var(--cream-2)}

.quote-form{
  background:var(--paper);color:var(--ink);border-radius:14px;
  padding:34px 32px;
}
.quote-form h3{font-size:21px;margin-bottom:2px}

/* =================================================== tablet · under 1080 */
@media (max-width:1079px){
  .accreditations__item img{height:76px}
  .trust__stats{gap:32px}
  .aga{grid-template-columns:1fr;gap:36px;padding-block:64px}
  .aga-media{height:340px}
  .contact{padding-block:64px}
  .contact__grid{grid-template-columns:1fr;gap:44px}
  .why{grid-template-columns:1fr;gap:36px}
}

/* ==================================================== small · under 1000 */
@media (max-width:999px){
  .areas{padding-block:64px}
  .areas__grid{grid-template-columns:1fr;gap:32px}
  .hero h1{font-size:42px}
  .aga h2,.contact h2{font-size:30px}
  .quote blockquote{font-size:24px}
  .quote{padding-inline:56px}
}

/* ============================================= mobile · 390 design frame */
@media (max-width:767px){
  /* ------ hero: text, then photo, then the two actions ------ */
  .hero{
    --hero-eyebrow:var(--red);--hero-ink:var(--ink);--hero-lede:var(--muted);
    display:flex;flex-direction:column;align-items:stretch;
    min-height:0;background:var(--paper);
    padding:34px var(--gutter) 38px;
  }
  .hero-copy{display:contents}
  .hero-copy>*{max-width:none}
  .hero__eyebrow{order:1;font-size:11px;letter-spacing:.15em;margin-bottom:12px}
  .hero h1{order:2;font-size:31px;line-height:1.16;margin-bottom:14px;text-shadow:none}
  .hero__lede{order:3;font-size:15.5px;margin-bottom:20px;text-shadow:none;max-width:none}
  .hero-media{
    order:4;position:static;height:230px;margin-bottom:20px;
    border-radius:14px;overflow:hidden;
  }
  .hero-media::after{display:none}
  .hero__actions{order:5;flex-direction:column;gap:10px;margin-bottom:0}
  .hero__actions .btn{width:100%}
  .hero .btn--on-image{border-color:var(--ink);color:var(--ink)}
  .hero .btn--on-image:hover{background:var(--ink);color:var(--paper)}
  .hero__rating{order:6;justify-content:center;font-size:13px;margin-top:14px;text-align:center}
  .hero__rating strong{color:var(--ink)}
  .hero .stars{letter-spacing:1.5px}

  /* ------ trust band ------ */
  .trust{padding:22px var(--gutter)}
  .trust__inner{display:block}
  .trust__stats{display:grid;grid-template-columns:1fr 1fr;gap:14px 10px;flex-wrap:wrap}
  .trust__rule{display:none}
  .stat__n{font-size:21px}
  .stat__l{font-size:11.5px}


  .badge{font-size:9.5px;letter-spacing:.06em;padding:6px 9px}
  .accreditations{padding:22px var(--gutter)}
  .accreditations__list{grid-template-columns:repeat(2,1fr);gap:20px 24px}
  .accreditations__item img{height:64px}

  /* ------ services become tappable rows ------ */
  .service-card{
    display:grid;grid-template-columns:1fr auto;align-items:center;
    gap:0 14px;background:var(--paper-2);border-color:var(--line);
    border-radius:10px;padding:16px 18px;min-height:56px;
  }
  .service-card:hover{transform:none;box-shadow:none;border-color:var(--red)}
  .service-card__body{display:contents}
  .service-card__icon{display:none}
  .service-card__title{grid-column:1;grid-row:1;font-size:17px}
  .service-card__text{grid-column:1;grid-row:2;font-size:12.5px;line-height:1.45;color:var(--muted)}
  /* the link collapses to its arrow; its text stays as the accessible name */
  .service-card__link{
    grid-column:2;grid-row:1 / span 2;align-self:center;
    margin-top:0;padding-top:0;border-top:0;gap:0;font-size:0;
  }
  .service-card__link .arrow{font-size:16px}

  /* With a photo the row gains a thumbnail column rather than a banner —
     a full-width image per row would turn the list into a long scroll. */
  .service-card--media{grid-template-columns:auto 1fr auto;padding:12px 14px}
  .service-card--media .service-card__media{
    grid-column:1;grid-row:1 / span 2;aspect-ratio:1;
    width:60px;height:60px;border-radius:8px;
  }
  .service-card--media .service-card__title{grid-column:2}
  .service-card--media .service-card__text{grid-column:2}
  .service-card--media .service-card__link{grid-column:3}
  .brand-strip{flex-direction:column;align-items:flex-start;gap:12px;margin-top:26px;padding-top:20px}
  .brand-strip__list{gap:14px;font-size:14px}
  .brand-strip__list li{gap:14px}

  /* ------ aga band ------ */
  .aga{padding:40px var(--gutter);gap:0;display:flex;flex-direction:column;align-items:stretch}
  .aga-body{display:contents}
  .aga__eyebrow{order:1}
  .aga h2{order:2;font-size:25px;line-height:1.2;margin-bottom:12px}
  .aga__lede{order:3;font-size:14.5px;margin-bottom:16px}
  .aga-media{order:4;height:190px;margin-bottom:16px}
  .aga__list{order:5;grid-template-columns:1fr;gap:9px;margin-bottom:20px;font-size:14.5px}
  .aga__actions{order:6;gap:10px}
  .aga__actions .btn{flex:1;padding-inline:12px;font-size:14.5px}

  .why__grid{grid-template-columns:1fr;gap:22px}

  /* ------ reviews ------ */
  .reviews__head{margin-bottom:20px}
  .carousel__btn{display:none}
  .quote{
    padding:24px 22px;background:var(--paper);
    border:1px solid var(--line);border-radius:10px;
  }
  .quote__mark{display:none}
  .quote blockquote{font-size:15.5px;line-height:1.6;margin-bottom:14px;text-align:left;align-self:stretch}
  .quote__stars{font-size:13px;letter-spacing:2px;margin-bottom:12px}
  .quote figcaption{
    align-self:stretch;justify-content:space-between;
    border-top:1px solid var(--line);padding-top:12px;gap:8px;
  }
  .quote__name{font-size:12.5px;color:var(--muted)}
  .quote__dot{display:none}
  .quote__tag{font-size:10px}
  .carousel__viewport{margin-inline:-2px;padding-inline:2px}
  .carousel__dots{margin-top:18px}

  /* ------ areas ------ */
  .areas{padding-block:44px}
  .areas__grid{gap:24px}
  .areas__list{grid-template-columns:1fr 1fr;gap:8px 18px}

  /* ------ contact ------ */
  .contact{padding-block:44px}
  .contact__grid{gap:28px}
  .contact h2{font-size:25px;line-height:1.2;margin-bottom:8px}
  .contact__lede{font-size:14px;margin-bottom:22px}
  .contact__rows{font-size:14px;gap:14px}
  .contact__row{flex-direction:column;gap:2px}
  .contact__row dt{width:auto}
  .quote-form{padding:24px 20px;border-radius:12px}
}

@media (max-width:380px){
  .aga__actions{flex-direction:column}
  .aga__actions .btn{width:100%}
}

/* ==========================================================================
   Page: service page (02 Heating)
   ========================================================================== */
/* ------------------------------------------------------------ service hero */
.svc-hero{
  display:grid;grid-template-columns:1fr 520px;gap:64px;align-items:center;
  padding:56px var(--gutter) 72px;
  max-width:calc(var(--maxw) + var(--gutter) * 2);margin-inline:auto;
}
.svc-hero h1{font-size:46px;line-height:1.14;margin-bottom:20px}
.svc-hero__lede{font-size:17.5px;line-height:1.62;color:var(--muted);margin-bottom:28px;max-width:58ch}
.svc-hero__actions{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-bottom:24px}
.svc-hero__media{height:400px;border-radius:14px;overflow:hidden}
.svc-hero__media img{width:100%;height:100%;object-fit:cover}

.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{
  border:1px solid #D9D1C3;background:var(--paper-2);color:var(--muted);
  font-weight:600;font-size:10.5px;letter-spacing:.07em;
  padding:7px 11px;border-radius:6px;white-space:nowrap;
}

/* ------------------------------------------------------------- work we do */
.work-band{
  background:var(--paper-2);
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:72px var(--gutter);
}
.work-band .section-head{margin-bottom:38px}
.work-band h2{font-size:32px;line-height:1.15}
.work-band__note{font-size:14.5px;color:var(--muted-2)}
.work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.work-card{
  background:var(--paper);border:1px solid var(--line);border-radius:10px;
  padding:24px 24px 22px;
}
.work-card h3{font-size:18px;margin-bottom:8px}
.work-card p{font-size:14px;line-height:1.55;color:var(--muted)}

/* ------------------------------------------- problems / process two-column */
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:72px}
.two-col h2{font-size:32px;line-height:1.15;margin-bottom:14px}
.two-col__lede{font-size:15px;line-height:1.6;color:var(--muted);margin-bottom:26px}

.problems{display:flex;flex-direction:column;gap:14px}
.problem{display:flex;gap:14px;align-items:flex-start;font-size:15px;line-height:1.55}
.problem__mark{
  width:26px;height:26px;border-radius:50%;background:#F6E3DF;color:var(--red);
  display:grid;place-items:center;font-weight:700;font-size:13px;flex:none;
}
.problem strong{color:var(--ink)}
.problem span{color:var(--muted)}

.steps{display:flex;flex-direction:column}
.step{display:flex;gap:18px;padding:18px 0;border-top:1px solid var(--line)}
.step:last-child{border-bottom:1px solid var(--line)}
.step__n{
  font-family:var(--serif);font-weight:600;font-style:italic;font-size:20px;
  color:var(--red);width:34px;flex:none;
}
.step h3{font-family:var(--sans);font-weight:600;font-size:16px}
.step p{font-size:14px;line-height:1.55;color:var(--muted);margin-top:4px}

/* ------------------------------------------------------- case-study band */
.case-band{background:var(--dark);color:var(--cream);padding:64px var(--gutter)}
.case-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.case-band .eyebrow{color:var(--band-rose);font-size:12px;letter-spacing:.15em}
.case-band h2{font-size:30px;line-height:1.2;margin-bottom:12px}
.case-band__lede{font-size:15px;line-height:1.62;color:var(--cream-2);margin-bottom:18px}
.case-quote{margin-bottom:22px;border-left:2px solid var(--red);padding-left:18px}
.case-quote blockquote{
  font-family:var(--serif);font-style:italic;font-weight:500;
  font-size:16px;line-height:1.6;color:var(--cream);
}
.case-quote figcaption{font-size:12.5px;color:var(--muted-on-dark);margin-top:8px}
.case-band__link{color:var(--band-rose);font-weight:600;font-size:15px}
.case-band__link:hover{color:#F2C4BA}
.case-band__link:hover .arrow{transform:translateX(3px)}
.case-media{height:340px;border-radius:14px;overflow:hidden}
.case-media img{width:100%;height:100%;object-fit:cover}

/* -------------------------------------------------------------------- faq */
.faq{display:grid;grid-template-columns:400px 1fr;gap:72px}
.faq h2{font-size:32px;line-height:1.15;margin-bottom:14px}
.faq__lede{font-size:15px;line-height:1.6;color:var(--muted);margin-bottom:20px}
.faq__related{font-size:13.5px;color:var(--muted)}
.faq__list{display:flex;flex-direction:column}
.faq-item{border-top:1px solid var(--line)}
.faq-item:last-child{border-bottom:1px solid var(--line)}
.faq-item summary{
  display:flex;justify-content:space-between;align-items:center;gap:20px;
  font-weight:600;font-size:16.5px;padding:20px 0;cursor:pointer;
  min-height:44px;list-style:none;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover{color:var(--red)}
.faq-item__sign{color:var(--muted-3);font-size:20px;font-weight:400;flex:none;line-height:1}
.faq-item__sign::after{content:"+"}
.faq-item[open] .faq-item__sign{color:var(--red)}
.faq-item[open] .faq-item__sign::after{content:"\2212"}
.faq-item p{
  font-size:14.5px;line-height:1.6;color:var(--muted);
  max-width:70ch;padding-bottom:20px;margin-top:-4px;
}

/* --------------------------------------------------------- areas cta strip */
.cta-strip{
  background:var(--paper-2);border-top:1px solid var(--line);
  padding:40px var(--gutter);
}
.cta-strip__inner{display:flex;justify-content:space-between;align-items:center;gap:40px}
.cta-strip__text{font-size:15px;color:var(--muted);max-width:72ch}
.cta-strip__text strong{color:var(--ink)}
.cta-strip__text a{white-space:nowrap}
.cta-strip__actions{display:flex;gap:12px;flex:none;flex-wrap:wrap}

/* =================================================== tablet · under 1080 */
@media (max-width:1079px){
  .svc-hero{grid-template-columns:1fr;gap:36px;padding-block:40px 56px}
  .svc-hero__media{height:340px}
  .two-col{grid-template-columns:1fr;gap:44px}
  .case-grid{grid-template-columns:1fr;gap:36px}
  .faq{grid-template-columns:1fr;gap:32px}
}

/* ==================================================== small · under 1000 */
@media (max-width:999px){
  .work-band{padding-block:56px}
  .work-grid{grid-template-columns:1fr 1fr}
  .svc-hero h1{font-size:38px}
  .work-band h2,.two-col h2,.faq h2{font-size:28px}
  .case-band{padding-block:56px}
  .cta-strip__inner{flex-direction:column;align-items:flex-start;gap:22px}
}

/* ============================================= mobile · 390 design frame */
@media (max-width:767px){
  .breadcrumb{font-size:12px;gap:6px;margin-bottom:14px}

  /* hero: copy, photo, then the actions — as the 390 frame stacks it */
  .svc-hero{
    display:flex;flex-direction:column;align-items:stretch;gap:0;
    padding:26px var(--gutter) 34px;
  }
  .svc-hero__body{display:contents}
  .svc-hero .breadcrumb{order:1}
  .svc-hero h1{order:2;font-size:27px;line-height:1.18;margin-bottom:12px}
  .svc-hero__lede{order:3;font-size:15px;margin-bottom:16px;max-width:none}
  .svc-hero__media{order:4;height:200px;margin-bottom:16px}
  .svc-hero__actions{order:5;flex-direction:column;gap:10px;margin-bottom:14px}
  .svc-hero__actions .btn{width:100%}
  .chips{order:6;gap:6px;justify-content:center}
  .chip{font-size:9.5px;letter-spacing:.06em;padding:6px 9px}

  /* work: the six cards become the frame's compact ticked rows */
  .work-band{padding:34px var(--gutter)}
  .work-band .section-head{margin-bottom:16px}
  .work-band h2,.two-col h2,.faq h2{font-size:22px;line-height:1.2}
  .work-band__note{font-size:13.5px}
  .work-grid{grid-template-columns:1fr;gap:8px}
  .work-card{
    display:grid;grid-template-columns:auto 1fr;gap:2px 10px;
    padding:13px 15px;align-items:center;
  }
  .work-card::before{
    content:"";grid-column:1;grid-row:1;align-self:center;width:13px;height:13px;
    background:no-repeat center/13px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23C0261A' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
  }
  .work-card h3{grid-column:2;grid-row:1;font-size:15.5px;margin-bottom:0}
  .work-card p{grid-column:2;grid-row:2;font-size:13px;line-height:1.45}

  /* problems / process */
  .two-col{gap:34px}
  .two-col__lede{font-size:14.5px;margin-bottom:18px}
  .problem{font-size:14.5px}
  .step{gap:14px;padding:13px 0}
  .step__n{font-size:17px;width:24px}
  .step h3{font-size:15px}
  .step p{font-size:13.5px}

  /* case study */
  .case-band{padding:34px var(--gutter)}
  .case-band h2{font-size:22px;line-height:1.2}
  .case-band__lede{font-size:14px}
  .case-media{height:200px}

  /* faq */
  .faq-item summary{font-size:14.5px;padding:15px 0;gap:14px}
  .faq-item__sign{color:var(--red)}
  .faq-item p{font-size:14px;padding-bottom:16px}

  /* areas + cta */
  .cta-strip{padding:34px var(--gutter)}
  .cta-strip__inner{flex-direction:column;align-items:stretch;gap:18px}
  .cta-strip__text{font-size:14.5px}
  .cta-strip__actions{flex-direction:column}
  .cta-strip__actions .btn{width:100%}
}

/* ==========================================================================
   Page: areas we cover
   ========================================================================== */
/* ------------------------------------------------------------------ intro */
.areas-intro{
  padding:52px var(--gutter) 40px;
  max-width:calc(var(--maxw) + var(--gutter) * 2);margin-inline:auto;
}
.areas-intro>*{max-width:1000px}
.areas-intro h1{font-size:44px;line-height:1.14;margin-bottom:18px}
.areas-intro p{font-size:17px;line-height:1.62;color:var(--muted)}
.areas-intro strong{color:var(--ink)}

/* ------------------------------------------------------------ map + lists */
.areas-map{
  padding:0 var(--gutter) 72px;
  display:grid;grid-template-columns:1fr 420px;gap:40px;align-items:stretch;
  max-width:calc(var(--maxw) + var(--gutter) * 2);margin-inline:auto;
}
.map-col{display:flex;flex-direction:column;gap:12px}
.map-card{
  border:1px solid var(--line);border-radius:14px;overflow:hidden;
  min-height:560px;position:relative;flex:1;background:#EAE6DE;
}
.map-card iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.map-legend{
  display:flex;gap:20px;flex-wrap:wrap;align-items:center;
  font-size:12.5px;color:var(--muted);
}
.map-legend li{display:flex;align-items:center;gap:8px}
.map-legend .swatch{width:12px;height:12px;border-radius:50%;flex:none}
.swatch--core{background:rgba(192,38,26,.15);border:1.5px solid var(--red)}
.swatch--base{background:var(--red)}
.map-legend .muted{color:var(--muted-3)}

.area-col{display:flex;flex-direction:column;gap:16px}
.area-card{
  background:var(--paper-2);border:1px solid var(--line);
  border-radius:14px;padding:24px 26px;
}
.area-card__title{
  font-weight:600;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--red);margin-bottom:12px;
}
.area-list{
  display:grid;grid-template-columns:1fr 1fr;gap:7px 18px;
  font-size:14.5px;color:var(--muted);
}
.area-card--all{background:var(--band);border-color:var(--band);color:#F5EBE2}
.area-card--all .area-card__title{color:var(--band-rose)}
.area-card--all p{font-size:14.5px;line-height:1.6;color:#F0DED4}
.area-card--all a{
  display:inline-block;margin-top:12px;color:#F5EBE2;
  font-weight:600;font-size:13.5px;border-bottom:1px solid #9B534B;
}
.area-card--all a:hover{color:var(--band-rose)}
.area-note{font-size:13.5px;line-height:1.6;color:var(--muted-2);padding-inline:4px}
.area-note strong{color:var(--ink)}

/* -------------------------------------------------------------- distance */
.distance{
  background:var(--paper-2);border-top:1px solid var(--line);
  padding:56px var(--gutter);
}
.distance h2{font-size:28px;margin-bottom:26px}
.info-card{
  background:var(--paper);border:1px solid var(--line);
  border-radius:10px;padding:22px 24px;
}
.info-card h3{font-family:var(--sans);font-weight:600;font-size:16px;margin-bottom:8px}
.info-card p{font-size:14px;line-height:1.6;color:var(--muted)}

/* -------------------------------------------------------------- cta band */
.cta-band{background:var(--dark);color:var(--cream);padding:48px var(--gutter)}
.cta-band__inner{display:flex;justify-content:space-between;align-items:center;gap:40px}
.cta-band h2{font-size:26px;margin-bottom:5px}
.cta-band p{font-size:14.5px;color:var(--cream-2)}
.cta-band__actions{display:flex;gap:12px;flex:none;flex-wrap:wrap}

/* =================================================== tablet · under 1080 */
@media (max-width:1079px){
  .areas-map{grid-template-columns:1fr;gap:28px;padding-bottom:56px}
  .map-card{min-height:420px}
}

/* ==================================================== small · under 1000 */
@media (max-width:999px){
  .areas-intro{padding-block:40px 32px}
  .areas-intro h1{font-size:36px}
  .distance{padding-block:48px}
  .distance h2{font-size:26px}
  .cta-band{padding-block:40px}
  .cta-band__inner{flex-direction:column;align-items:flex-start;gap:22px}
}

/* ================================================= mobile · single column */
@media (max-width:767px){
  .areas-intro{padding:26px var(--gutter) 26px}
  .areas-intro h1{font-size:28px;line-height:1.18;margin-bottom:12px}
  .areas-intro p{font-size:15px}
  .areas-map{padding:0 var(--gutter) 40px;gap:22px}
  .map-card{min-height:300px}
  .map-legend{gap:10px;flex-direction:column;align-items:flex-start;font-size:12px}
  .area-card{padding:20px 20px;border-radius:12px}
  .area-list{font-size:14px;gap:6px 14px}
  .distance{padding:40px var(--gutter)}
  .distance h2{font-size:22px;line-height:1.2;margin-bottom:16px}
  .info-card{padding:18px 18px}
  .cta-band{padding:34px var(--gutter)}
  .cta-band__inner{gap:18px;align-items:stretch}
  .cta-band h2{font-size:22px;line-height:1.25}
  .cta-band__actions{flex-direction:column}
  .cta-band__actions .btn{width:100%}
}

/* ==========================================================================
   Page: contact
   ========================================================================== */
/* --------------------------------------------------------------- layout */
.contact-top{
  padding:52px var(--gutter) 64px;
  display:grid;grid-template-columns:1fr 560px;gap:72px;align-items:start;
  max-width:calc(var(--maxw) + var(--gutter) * 2);margin-inline:auto;
}
.contact-top h1{font-size:44px;line-height:1.14;margin-bottom:16px}
.contact-top__lede{font-size:16.5px;line-height:1.62;color:var(--muted);margin-bottom:36px;max-width:52ch}

/* ------------------------------------------------------ contact methods */
.methods{display:flex;flex-direction:column}
.method{display:flex;gap:18px;align-items:center;padding:18px 0;border-top:1px solid var(--line)}
.method:last-child{border-bottom:1px solid var(--line)}
.method__icon{
  width:44px;height:44px;border-radius:50%;background:var(--paper-2);
  display:grid;place-items:center;flex:none;
}
.method__icon--call{background:#F6E3DF}
.method__value{display:block;font-weight:700;font-size:17px;color:var(--ink)}
.method__value--lead{font-size:19px}
.method a.method__value:hover{color:var(--red)}
.method__note{display:block;font-size:13.5px;color:var(--muted-2);margin-top:2px;line-height:1.5}

.expect{
  background:var(--paper-2);border:1px solid var(--line);border-radius:10px;
  padding:18px 22px;margin-top:26px;
  font-size:14px;line-height:1.6;color:var(--muted);
}
.expect strong{color:var(--ink)}

/* ----------------------------------------------------------- form panel */
.contact-form{background:var(--dark);border-radius:14px;padding:36px 34px;color:var(--cream)}
.contact-form h2{font-size:24px;margin-bottom:4px}
.contact-form__sub{font-size:13.5px;color:var(--cream-2);margin-bottom:22px}
.contact-form .btn{margin-top:4px}
.contact-form a{color:var(--band-rose)}
.contact-form a:hover{color:#F2C4BA}

/* ------------------------------------------------------------ map strip */
.map-strip{border-top:1px solid var(--line);position:relative;height:380px;background:#EAE6DE}
.map-strip iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* =================================================== tablet · under 1080 */
@media (max-width:1079px){
  .contact-top{grid-template-columns:1fr;gap:40px;padding-block:40px 48px}
}

/* ==================================================== small · under 1000 */
@media (max-width:999px){
  .contact-top h1{font-size:36px}
  .map-strip{height:320px}
}

/* ================================================= mobile · single column */
@media (max-width:767px){
  .contact-top{padding:26px var(--gutter) 34px;gap:28px}
  .contact-top h1{font-size:28px;line-height:1.18;margin-bottom:12px}
  .contact-top__lede{font-size:15px;margin-bottom:22px;max-width:none}
  .method{gap:14px;padding:15px 0}
  .method__icon{width:38px;height:38px}
  .method__value{font-size:16px}
  .method__value--lead{font-size:18px}
  .method__note{font-size:13px}
  .expect{margin-top:20px;padding:16px 18px;font-size:13.5px}
  .contact-form{padding:24px 20px;border-radius:12px}
  .contact-form h2{font-size:21px}
  .map-strip{height:260px}
}
/* ==========================================================================
   WordPress additions — components that only exist once the site is dynamic.
   ========================================================================== */

/* Highlighted place in the homepage areas list (was :last-child in the
   static build; now driven by a per-row toggle). */
.areas__list li.is-highlight{font-weight:600;color:var(--red)}
.areas__list li:last-child{font-weight:inherit;color:inherit}
.areas__list li.is-highlight:last-child{font-weight:600;color:var(--red)}


/* Form status message. */
.form-message{
  font-size:13.5px;line-height:1.5;padding:11px 14px;border-radius:8px;
  background:#EEF3EA;border:1px solid #CBD9C2;color:#3E4A3D;
}
.form-message--error{background:#FBEDEB;border-color:#E4B4AC;color:#8A231A}
.enquiry-form--dark .form-message{background:#2E2A26;border-color:#4A423B;color:#F2EBE1}
.enquiry-form--dark .form-message--error{background:#3A2320;border-color:#7A4A44;color:#F4D3CE}

/* Editor content on the fallback templates. */
.prose{max-width:70ch;font-size:16px;line-height:1.65;color:var(--muted)}
.prose h2,.prose h3{color:var(--ink);margin:1.6em 0 .5em}
.prose p{margin-bottom:1em}
.prose ul,.prose ol{margin:0 0 1em 1.2em;list-style:revert}
.prose a{font-weight:600}

/* ==========================================================================
   Service gallery
   ========================================================================== */

/* Gallery of real job photos. */
.gallery-band{background:var(--paper-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.gallery__item figure{
  margin:0;background:var(--paper);border:1px solid var(--line);
  border-radius:10px;overflow:hidden;height:100%;
  display:flex;flex-direction:column;
}
.gallery__item img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.gallery__item figcaption{
  padding:14px 16px;font-size:13.5px;line-height:1.5;color:var(--muted);
}
.gallery__lede{text-align:left;max-width:52ch}

/* Brand strip with real logos. */
.brand-strip__list li.has-logo{gap:26px}
.brand-strip__list li.has-logo img{
  height:30px;width:auto;max-width:130px;object-fit:contain;display:block;
  opacity:.75;transition:opacity .18s ease;
}
.brand-strip__list li.has-logo:hover img{opacity:1}

@media (max-width:999px){
  .gallery{grid-template-columns:repeat(2,1fr);gap:16px}
}
@media (max-width:767px){
  .gallery{grid-template-columns:1fr;gap:12px}
  .brand-strip__list li.has-logo img{height:24px;max-width:100px}
}

/* ==========================================================================
   Cookie notice + map consent placeholder
   ========================================================================== */
.cookie-notice{
  position:fixed;left:0;right:0;bottom:0;z-index:95;
  background:var(--darker);color:var(--cream);
  border-top:3px solid var(--red);
  box-shadow:0 -10px 30px rgba(0,0,0,.28);
  transform:translateY(110%);transition:transform .26s ease;
  padding-bottom:env(safe-area-inset-bottom);
}
.cookie-notice[data-visible="true"]{transform:translateY(0)}
.cookie-notice__inner{
  max-width:var(--maxw);margin-inline:auto;padding:20px var(--gutter);
  display:flex;align-items:center;gap:32px;
}
.cookie-notice__text{font-size:14px;line-height:1.55;color:var(--cream-2)}
.cookie-notice__title{font-weight:700;font-size:15px;color:var(--cream);margin-bottom:4px}
.cookie-notice__text a{color:var(--band-rose);font-weight:600;text-decoration:underline}
.cookie-notice__text a:hover{color:#F2C4BA}
.cookie-notice__actions{display:flex;gap:10px;flex:none}
.cookie-notice__actions .btn--outline{border-color:#5A5148;color:var(--cream)}
.cookie-notice__actions .btn--outline:hover{background:var(--cream);color:var(--ink)}

/* Sits above the sticky call bar, so the two never overlap. */
.cookie-notice[data-visible="true"] ~ .sticky-bar{transform:translateY(110%)}

.map-consent{
  position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:14px;text-align:center;
  padding:28px var(--gutter);background:var(--paper-2);
}
.map-consent__text{font-size:14.5px;line-height:1.55;color:var(--muted);max-width:46ch}
.map-consent__addr{font-size:13.5px;color:var(--muted-2)}

@media (max-width:767px){
  .cookie-notice__inner{flex-direction:column;align-items:stretch;gap:16px;padding:18px var(--gutter)}
  .cookie-notice__actions{flex-direction:column}
  .cookie-notice__actions .btn{width:100%}
  .cookie-notice__text{font-size:13.5px}
}

/* Consent categories + the reopen link */
.cookie-notice__choices{
  display:flex;flex-direction:column;gap:10px;
  margin-top:14px;padding-top:14px;border-top:1px solid var(--dark-line);
}
.cookie-choice{display:flex;gap:10px;align-items:flex-start;cursor:pointer;font-size:13.5px}
.cookie-choice input{width:16px;height:16px;margin:2px 0 0;accent-color:var(--red);flex:none}
.cookie-choice strong{display:block;color:var(--cream);font-size:14px}
.cookie-choice__note{display:block;color:var(--cream-2);line-height:1.5;margin-top:2px}
.cookie-notice__toggle{
  background:none;border:0;padding:0 6px 0 0;font:600 13.5px var(--sans);
  color:var(--band-rose);text-decoration:underline;cursor:pointer;
}
.cookie-notice__toggle:hover{color:#F2C4BA}
.cookie-settings-link{
  background:none;border:0;padding:0;font:inherit;color:var(--muted-on-dark);
  cursor:pointer;text-decoration:underline;
}
.cookie-settings-link:hover{color:var(--cream)}

@media (max-width:767px){
  .cookie-notice__actions{flex-direction:column}
  .cookie-notice__toggle{order:3;padding:6px 0;text-align:center}
}