/* =========================================================================
   Barrie Insulation Systems — style.css
   Brand: red #9F1515 · navy #2C588D · gold #F9CD08 · deep #051C2A
   Mobile-first. Headings Open Sans, body Source Sans 3.
   ========================================================================= */

:root{
  --red:#9F1515;
  --red-dark:#7C1010;
  --red-tint:#FBF1F1;
  --navy:#2C588D;
  --navy-dark:#1E3E66;
  --navy-tint:#F1F5FA;
  --gold:#F9CD08;
  --deep:#051C2A;
  --ink:#272727;
  --muted:#5B6470;
  --grey:#EEEEEE;
  --grey-2:#F7F8F9;
  --line:#E1E4E9;
  --white:#fff;

  --wrap:1200px;
  --narrow:820px;
  --radius:14px;
  --radius-sm:8px;
  --shadow:0 1px 2px rgba(5,28,42,.04), 0 8px 24px rgba(5,28,42,.06);
  --shadow-lg:0 2px 4px rgba(5,28,42,.06), 0 18px 48px rgba(5,28,42,.12);
  --section-y:clamp(3.5rem, 8vw, 6.5rem);
  --header-h:72px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 16px)}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}
body{
  margin:0;
  font-family:"Source Sans 3","Source Sans Pro",system-ui,-apple-system,Segoe UI,sans-serif;
  font-size:17px;line-height:1.7;color:var(--ink);background:var(--white);
  -webkit-font-smoothing:antialiased;
}
img,svg,iframe{max-width:100%}
img{height:auto;display:block}
h1,h2,h3,h4{font-family:"Open Sans",system-ui,sans-serif;font-weight:800;line-height:1.15;
  letter-spacing:-.02em;color:var(--deep);margin:0 0 .6em}
h1{font-size:clamp(2rem,5.6vw,3.4rem)}
h2{font-size:clamp(1.6rem,3.6vw,2.4rem)}
h3{font-size:1.18rem;font-weight:700;letter-spacing:-.01em}
p{margin:0 0 1.1em}
a{color:var(--navy);text-underline-offset:3px}
a:hover{color:var(--red)}
ul,ol{margin:0 0 1.1em;padding-left:1.2em}
hr{border:0;border-top:1px solid var(--line);margin:2.5rem 0}
strong{font-weight:600}
:focus-visible{outline:3px solid var(--navy);outline-offset:2px;border-radius:3px}
.site-footer :focus-visible,.hero :focus-visible,.cta-band :focus-visible{outline-color:var(--gold)}

.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:20px}
.wrap.narrow{max-width:var(--narrow)}
@media(min-width:700px){.wrap{padding-inline:32px}}

.skip-link{position:absolute;left:-9999px;top:0;z-index:200;background:var(--deep);color:#fff;
  padding:12px 20px;border-radius:0 0 var(--radius-sm) 0;font-weight:600}
.skip-link:focus{left:0;color:#fff}

/* ------------------------------------------------------------- buttons -- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  font-family:"Open Sans",sans-serif;font-weight:700;font-size:.98rem;letter-spacing:.01em;
  padding:.85em 1.6em;border-radius:var(--radius-sm);border:2px solid transparent;
  text-decoration:none;cursor:pointer;transition:transform .15s ease,background .15s ease,box-shadow .15s ease;
  text-align:center;line-height:1.2;
}
.btn:hover{transform:translateY(-1px)}
.btn-red{background:var(--red);color:#fff;box-shadow:0 6px 18px rgba(159,21,21,.24)}
.btn-red:hover{background:var(--red-dark);color:#fff}
.btn-ghost{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.65);backdrop-filter:blur(2px)}
.btn-ghost:hover{background:#fff;color:var(--deep)}
.btn-outline{background:transparent;color:var(--navy);border-color:var(--navy)}
.btn-outline:hover{background:var(--navy);color:#fff}
.btn-lg{padding:1em 1.9em;font-size:1.05rem}
.btn-block{display:flex;width:100%}
.text-link{display:inline-flex;align-items:center;gap:.35em;font-weight:700;color:var(--navy);
  font-family:"Open Sans",sans-serif;font-size:.95rem;text-decoration:none;border-bottom:2px solid transparent}
a:hover .text-link,.text-link:hover{color:var(--red);border-bottom-color:var(--red)}

/* ------------------------------------------------------- needs / chips -- */
.needs{display:inline-block;background:#FFF4D6;color:#6B4C00;border:1px dashed #D8A400;
  border-radius:6px;padding:.1em .5em;font-size:.82em;font-weight:600;line-height:1.4}

/* -------------------------------------------------------------- topbar -- */
.topbar{background:var(--deep);color:#C7D2DC;font-size:.86rem;display:none}
@media(min-width:1000px){
  .topbar{display:block}
  .topbar-inner{display:flex;gap:1.6rem;align-items:center;min-height:40px;padding-block:.4rem}
}
.tb-item{display:inline-flex;align-items:center;gap:.4em}
.tb-link{font-weight:700;color:#fff!important;text-decoration:none;position:relative;padding-bottom:1px}
.tb-link::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--gold);
  transform:scaleX(0);transition:transform .18s}
.tb-link:hover::after{transform:scaleX(1)}
.tb-hours{padding-left:1.6rem;border-left:1px solid rgba(255,255,255,.22);color:#C7D2DC}
.tb-area{margin-left:auto;color:#93A6B4}
.topbar a{color:#fff;font-weight:600;text-decoration:none}
.topbar a:hover{color:var(--gold)}

/* -------------------------------------------------------------- header -- */
.site-header{position:sticky;top:0;z-index:100;background:#fff;border-bottom:1px solid var(--line);
  box-shadow:0 2px 12px rgba(5,28,42,.05)}
.header-inner{display:flex;align-items:center;gap:1rem;min-height:var(--header-h);padding-block:.6rem}
@media(min-width:1000px){.header-inner{gap:1.6rem}}
.logo{display:inline-flex;align-items:center;gap:.6rem;text-decoration:none;flex:0 0 auto}
.logo .mark{width:34px;height:41px;flex:0 0 auto}
.logo-text{display:flex;flex-direction:column;line-height:1.05}
.logo-name{font-family:"Open Sans",sans-serif;font-weight:800;font-size:1.02rem;color:var(--deep);letter-spacing:-.02em}
.logo-sub{font-family:"Open Sans",sans-serif;font-weight:700;font-size:.66rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--red)}
.logo.inverse .logo-name{color:#fff}
.logo.inverse .logo-sub{color:var(--gold)}
@media(min-width:1000px){.logo .mark{width:42px;height:50px}.logo-name{font-size:1.22rem}.logo-sub{font-size:.72rem}}

.header-actions{display:flex;align-items:center;gap:.6rem;margin-left:auto;flex:0 0 auto}
.hdr-phone{display:none}
@media(min-width:1000px){
  .hdr-phone{display:inline-flex;align-items:center;gap:.65rem;text-decoration:none;color:var(--deep);
    padding:.35rem .9rem .35rem .35rem;border-radius:99px;border:1px solid var(--line);background:var(--grey-2)}
  .hdr-phone:hover{border-color:var(--red);background:var(--red-tint)}
  .hdr-phone svg{width:34px;height:34px;padding:7px;border-radius:50%;background:var(--red-tint);color:var(--red);flex:0 0 auto}
  .hdr-phone-text{display:flex;flex-direction:column;line-height:1.15}
  .hdr-phone small{font-size:.72rem;color:var(--muted);letter-spacing:.04em;text-transform:uppercase}
  .hdr-phone strong{font-family:"Open Sans",sans-serif;font-size:1.08rem;font-weight:800;letter-spacing:-.01em}
  .hdr-phone:hover strong{color:var(--red)}
}
.hdr-cta{display:none}

.nav-toggle{display:inline-flex;flex-direction:column;justify-content:center;gap:5px;
  width:46px;height:44px;padding:10px;background:var(--grey-2);border:1px solid var(--line);
  border-radius:var(--radius-sm);cursor:pointer}
.nav-toggle span{display:block;height:2.5px;background:var(--deep);border-radius:2px;transition:transform .2s,opacity .2s}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
@media(min-width:1000px){.nav-toggle{display:none}}

/* mobile drawer */
.site-nav{position:fixed;inset:0 0 0 auto;width:min(360px,88vw);background:#fff;
  transform:translateX(101%);transition:transform .25s ease;box-shadow:-8px 0 40px rgba(5,28,42,.2);
  padding:calc(var(--header-h) + 16px) 20px 120px;overflow-y:auto;z-index:99;visibility:hidden}
.site-nav.open{transform:translateX(0);visibility:visible}
.nav-list{list-style:none;margin:0;padding:0}
.nav-list>li{border-bottom:1px solid var(--line);position:relative}
.nav-list>li>a{display:block;padding:.9rem .2rem;font-family:"Open Sans",sans-serif;font-weight:700;
  font-size:1.05rem;color:var(--deep);text-decoration:none}
.nav-list>li>a.active{color:var(--red)}
.drop-toggle{position:absolute;top:4px;right:0;width:46px;height:46px;background:none;border:0;
  cursor:pointer;color:var(--muted);display:grid;place-items:center}
.drop-toggle svg{width:14px;height:10px;transition:transform .2s}
.drop-toggle[aria-expanded="true"] svg{transform:rotate(180deg)}
.drop{list-style:none;margin:0;padding:0;display:none}
.has-drop.open .drop{display:block;padding-bottom:.6rem}
.drop a{display:block;padding:.5rem .2rem .5rem .9rem;text-decoration:none;border-left:2px solid var(--line)}
.drop a:hover{border-left-color:var(--red);background:var(--grey-2)}
.d-name{display:block;font-weight:700;font-family:"Open Sans",sans-serif;font-size:.95rem;color:var(--deep)}
.d-desc{display:block;font-size:.85rem;color:var(--muted);line-height:1.4}
.drop a:hover .d-name{color:var(--red)}
.drop-all a{font-weight:700;color:var(--navy)}
.nav-cta{border-bottom:0!important;padding-top:1rem}
.nav-cta .btn{width:100%}

@media(min-width:1000px){
  .site-nav{position:static;width:auto;transform:none;visibility:visible;box-shadow:none;
    padding:0;overflow:visible;background:none}
  .nav-list{display:flex;align-items:center;gap:.1rem;justify-content:flex-start;flex-wrap:nowrap}
  .nav-list>li{border-bottom:0;white-space:nowrap}
  .nav-list>li>a{padding:.7rem .62rem;font-size:.95rem;position:relative}
  .nav-list>li>a::after{content:"";position:absolute;left:.62rem;right:.62rem;bottom:.15rem;height:3px;
    background:var(--red);border-radius:2px;transform:scaleX(0);transition:transform .18s}
  .nav-list>li>a:hover::after,.nav-list>li>a.active::after{transform:scaleX(1)}
  .has-drop{display:flex;align-items:center}
  .drop-toggle{position:static;width:22px;height:22px;margin-left:-.55rem}
  .drop{position:absolute;top:100%;left:0;display:block;background:#fff;min-width:290px;
    border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-lg);
    padding:.5rem;opacity:0;visibility:hidden;transform:translateY(6px);transition:.16s ease;z-index:5}
  .has-drop:hover .drop,.has-drop:focus-within .drop,.has-drop.open .drop{opacity:1;visibility:visible;transform:translateY(0)}
  .drop a{border-left:0;border-radius:var(--radius-sm);padding:.55rem .7rem}
  .drop a:hover{background:var(--red-tint)}
  .nav-cta,.only-mobile{display:none}
}
@media(min-width:1120px){.nav-list>li>a{padding:.7rem .8rem;font-size:.98rem}}
.nav-scrim{position:fixed;inset:0;background:rgba(5,28,42,.45);opacity:0;visibility:hidden;
  transition:.2s;z-index:98}
.nav-scrim.show{opacity:1;visibility:visible}
@media(min-width:1000px){.nav-scrim{display:none}}
body.nav-open{overflow:hidden}

/* ---------------------------------------------------------------- hero -- */
.hero{position:relative;background:var(--deep) center/cover no-repeat;color:#fff;isolation:isolate;
  padding:clamp(3rem,9vw,6rem) 0}
.hero-large{padding:clamp(4rem,12vw,8.5rem) 0}
.hero-shade{position:absolute;inset:0;z-index:-1;
  background:linear-gradient(105deg,rgba(5,28,42,.94) 0%,rgba(5,28,42,.82) 45%,rgba(5,28,42,.55) 100%)}
.hero.no-photo{background:
  radial-gradient(1200px 500px at 12% -10%, rgba(44,88,141,.55), transparent 60%),
  linear-gradient(160deg,#051C2A 0%,#0B2C42 60%,#123650 100%)}
.hero.no-photo .hero-shade{background:none}
.hero-inner{position:relative;max-width:760px}
.hero h1,.hero .hero-title{color:#fff;margin-bottom:.45em}
.hero-title{font-family:"Open Sans",sans-serif;font-weight:800;font-size:clamp(2.1rem,6.2vw,3.6rem);
  line-height:1.08;letter-spacing:-.025em}
.hero-sub{font-size:clamp(1.05rem,2.3vw,1.28rem);color:#D8E2EA;max-width:60ch;margin-bottom:1.8em}
.hero-ctas{display:flex;flex-wrap:wrap;gap:.8rem}
.kicker{font-family:"Open Sans",sans-serif;font-weight:700;font-size:.82rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--red);margin:0 0 .9em}
.hero .kicker{color:var(--gold)}
.kicker-gold{color:var(--gold)}
.hero-ph-note{display:inline-block;margin-top:2rem;font-size:.8rem;color:#9FB3C2;
  border:1px dashed rgba(255,255,255,.35);border-radius:6px;padding:.35em .7em}
.hero-ph-note code{color:var(--gold);font-size:.95em}

/* ----------------------------------------------------------- trust bar -- */
.trust-bar{background:var(--deep);color:#fff;border-top:4px solid var(--red)}
.trust-bar ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr)}
.trust-bar li{padding:1.15rem .6rem;text-align:center;border-bottom:1px solid rgba(255,255,255,.1)}
.trust-bar li:nth-child(odd){border-right:1px solid rgba(255,255,255,.1)}
.trust-bar strong{display:block;font-family:"Open Sans",sans-serif;font-weight:800;font-size:1.5rem;
  color:var(--gold);letter-spacing:-.02em}
.trust-bar span{display:block;font-size:.86rem;color:#B9C8D4;line-height:1.35;margin-top:.15rem}
@media(min-width:820px){
  .trust-bar ul{grid-template-columns:repeat(4,1fr)}
  .trust-bar li{border-bottom:0;border-right:1px solid rgba(255,255,255,.1)}
  .trust-bar li:last-child{border-right:0}
}

/* ------------------------------------------------------------ sections -- */
.section{padding-block:var(--section-y)}
.section.alt{background:var(--grey-2)}
.section-head{max-width:66ch;margin-bottom:clamp(2rem,4vw,3rem)}
.section-title{margin-bottom:.5em}
.section-title-sm{font-size:clamp(1.3rem,2.6vw,1.7rem)}
.section-lead{font-size:1.1rem;color:var(--muted);margin-bottom:0}
.lead-p{font-size:1.12rem;color:var(--muted)}
.center-cta{margin-top:2.2rem;text-align:center}
.small-note{font-size:.9rem;color:var(--muted)}
.mono-line{font-weight:600;color:var(--deep)}

/* --------------------------------------------------------------- photo -- */
.photo{margin:0;border-radius:var(--radius);overflow:hidden;background:var(--grey);
  aspect-ratio:var(--ratio,16/10);position:relative}
.photo img{width:100%;height:100%;object-fit:cover}
.photo.is-placeholder{background:repeating-linear-gradient(135deg,#EDEFF2 0 12px,#E6E9ED 12px 24px);
  border:2px dashed #B9C2CC;display:grid;place-items:center;padding:1rem}
.photo-ph{display:flex;flex-direction:column;align-items:center;gap:.25rem;text-align:center;
  color:#5B6470;font-size:.8rem;line-height:1.35;max-width:100%}
.photo-ph-tag{font-family:"Open Sans",sans-serif;font-weight:800;font-size:.68rem;letter-spacing:.14em;
  text-transform:uppercase;color:#fff;background:var(--navy);padding:.2em .7em;border-radius:99px}
.photo-ph-file{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.76rem;color:var(--deep);
  font-weight:600;word-break:break-all}
.photo-ph-alt{font-style:italic;max-width:34ch}
.photo-ph-size{font-size:.72rem;color:#8A929C}

/* ------------------------------------------------------- service cards -- */
.svc-grid{display:grid;gap:1.25rem;grid-template-columns:1fr}
@media(min-width:640px){.svc-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1080px){.svc-grid{grid-template-columns:repeat(4,1fr);gap:1.5rem}}
.svc-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  box-shadow:var(--shadow);transition:transform .18s ease,box-shadow .18s ease}
.svc-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.svc-link{display:flex;flex-direction:column;height:100%;text-decoration:none;color:inherit}
.svc-photo{border-radius:0}
.svc-body{padding:1.4rem 1.3rem 1.5rem;display:flex;flex-direction:column;flex:1;position:relative}
.svc-icon{width:40px;height:40px;padding:8px;border-radius:10px;background:var(--red-tint);color:var(--red);
  margin:-3.2rem 0 .9rem;position:relative;box-shadow:0 4px 14px rgba(5,28,42,.14);background-color:#fff}
.svc-body h3{margin-bottom:.4em;color:var(--deep)}
.svc-body p{color:var(--muted);font-size:.98rem;flex:1}
.svc-grid.compact .svc-photo,.svc-grid.compact .svc-icon{display:none}
.svc-grid.compact .svc-body{padding:1.1rem}
@media(min-width:1080px){.svc-grid.compact{grid-template-columns:repeat(2,1fr)}}

/* ----------------------------------------------------------- why / usp -- */
.why-grid{display:grid;gap:2.5rem}
@media(min-width:980px){.why-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:4rem;align-items:start}}
.why-cards{display:grid;gap:1rem}
@media(min-width:620px){.why-cards{grid-template-columns:repeat(2,1fr)}}
@media(min-width:980px){.why-cards-row{grid-template-columns:repeat(4,1fr)}}
.why-card{background:#fff;border:1px solid var(--line);border-left:4px solid var(--red);
  border-radius:var(--radius);padding:1.4rem 1.3rem}
.why-card h3{margin-bottom:.4em}
.why-card p{margin:0;color:var(--muted);font-size:.97rem}
.savings-callout{background:var(--deep);color:#fff;border-radius:var(--radius);padding:1.6rem 1.5rem;
  margin-top:1.8rem;border-top:4px solid var(--gold)}
.savings-figure{display:block;font-family:"Open Sans",sans-serif;font-size:clamp(2.4rem,6vw,3.2rem);
  font-weight:800;color:var(--gold);line-height:1;letter-spacing:-.03em;margin-bottom:.35rem}
.savings-callout p{color:#D8E2EA;margin-bottom:.6em}
.savings-note{font-size:.88rem;color:#9FB3C2;margin-bottom:0}
.why-list{list-style:none;margin:0;padding:0;display:grid;gap:1.5rem}
@media(min-width:700px){.why-list{grid-template-columns:repeat(2,1fr);gap:1.6rem 2.5rem}}
@media(min-width:1080px){.why-list{grid-template-columns:repeat(3,1fr)}}
.why-list li{padding-left:2.1rem;position:relative}
.why-list li::before{content:"";position:absolute;left:0;top:.25rem;width:1.35rem;height:1.35rem;
  border-radius:50%;background:var(--red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/.85rem no-repeat}
.why-list h3{margin-bottom:.25em}
.why-list p{margin:0;color:var(--muted);font-size:.97rem}

/* ------------------------------------------------------------- gallery -- */
.gal-grid{display:grid;gap:1rem;grid-template-columns:repeat(2,1fr)}
@media(min-width:900px){.gal-grid{grid-template-columns:repeat(3,1fr);gap:1.4rem}}
.gal-item{margin:0}
.gal-item figcaption{font-size:.92rem;color:var(--muted);margin-top:.6rem;line-height:1.45}

/* --------------------------------------------------------------- steps -- */
.steps{list-style:none;margin:0;padding:0;display:grid;gap:1.1rem;counter-reset:step}
@media(min-width:620px){.steps{grid-template-columns:repeat(2,1fr);gap:1.4rem}}
@media(min-width:900px){.steps{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1140px){.steps{grid-template-columns:repeat(5,1fr);gap:1.2rem}}
@media(min-width:1140px){.steps .step{padding:1.3rem 1.1rem}}
.step{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.4rem 1.2rem;
  box-shadow:var(--shadow)}
.step-num{display:grid;place-items:center;width:2.2rem;height:2.2rem;border-radius:50%;
  background:var(--navy);color:#fff;font-family:"Open Sans",sans-serif;font-weight:800;font-size:1rem;
  margin-bottom:.9rem}
.step h3{margin-bottom:.35em;font-size:1.05rem}
.step p{margin:0;color:var(--muted);font-size:.94rem}
.mini-steps{margin:0;padding-left:1.2rem;color:var(--muted)}
.mini-steps li{margin-bottom:.5rem}

/* ------------------------------------------------------------- reviews -- */
.review-grid{display:grid;gap:1.25rem}
@media(min-width:760px){.review-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1040px){.review-grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:760px){.review-grid.two-up{grid-template-columns:repeat(2,1fr)}}
.review-card{margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:1.5rem 1.4rem;box-shadow:var(--shadow);display:flex;flex-direction:column}
.section.alt .review-card{background:#fff}
.stars{display:flex;gap:.15rem;color:var(--gold);margin-bottom:.9rem}
.stars svg{width:19px;height:19px}
.stars .star-empty{color:#D6DAE0}
.stars-lg svg{width:26px;height:26px}
.review-text{font-size:1.02rem;color:var(--ink);flex:1;margin-bottom:1.1em}
.review-text::before{content:"\201C"}
.review-text::after{content:"\201D"}
.review-meta{font-size:.88rem;color:var(--muted);display:flex;flex-wrap:wrap;gap:.4rem;
  align-items:center;border-top:1px solid var(--line);padding-top:.9rem}
.review-src{margin-left:auto;font-weight:600;color:var(--navy)}
.rating-summary{background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:1.8rem;display:grid;gap:1.5rem}
@media(min-width:760px){.rating-summary{grid-template-columns:auto 1fr;gap:2.5rem;align-items:center}}
.rating-score{text-align:center}
.rating-score strong{display:block;font-family:"Open Sans",sans-serif;font-size:3.6rem;font-weight:800;
  line-height:1;color:var(--deep);letter-spacing:-.03em}
.rating-score .stars{justify-content:center;margin:.5rem 0 .4rem}
.rating-score span{font-size:.9rem;color:var(--muted)}
.rating-note{margin:0;color:var(--muted)}

/* -------------------------------------------------------------- embeds -- */
.map-embed{border-radius:var(--radius);overflow:hidden;background:var(--grey);min-height:260px}
.map-embed iframe{display:block;width:100%;height:100%;min-height:260px;border:0}
.reviews-widget{min-height:220px}
.embed-ph{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  gap:.6rem;min-height:260px;padding:2rem 1.25rem;border:2px dashed #B9C2CC;border-radius:var(--radius);
  background:repeating-linear-gradient(135deg,#EDEFF2 0 12px,#E6E9ED 12px 24px);color:var(--muted)}
.embed-ph svg{width:40px;height:40px;color:var(--navy)}
.embed-ph-title{font-family:"Open Sans",sans-serif;font-weight:800;color:var(--deep);margin:0;font-size:1rem}
.embed-ph-note{margin:0;font-size:.86rem;max-width:52ch}
.reviews-widget .embed-ph{min-height:200px}

/* ------------------------------------------------------------ cta band -- */
.cta-band{background:
  radial-gradient(900px 400px at 85% 0%, rgba(44,88,141,.5), transparent 60%),
  linear-gradient(140deg,#7C1010 0%,#9F1515 55%,#8A1212 100%);
  color:#fff;padding-block:clamp(3rem,7vw,5rem)}
.cta-grid{display:grid;gap:2.2rem}
@media(min-width:940px){.cta-grid{grid-template-columns:1.05fr .95fr;gap:3.5rem;align-items:center}}
.cta-copy h2{color:#fff;font-size:clamp(1.7rem,3.6vw,2.5rem)}
.cta-sub{color:#F6DEDE;font-size:1.08rem}
.cta-points{list-style:none;margin:1.4rem 0;padding:0;display:grid;gap:.6rem}
.cta-points li{position:relative;padding-left:1.9rem;color:#FCEFEF}
.cta-points li::before{content:"";position:absolute;left:0;top:.35rem;width:1.2rem;height:1.2rem;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='none' stroke='%23F9CD08' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/.8rem no-repeat}
.cta-phone{font-family:"Open Sans",sans-serif;font-weight:800;font-size:1.6rem;margin:0}
.cta-phone a{color:#fff;text-decoration:none}
.cta-phone a:hover{color:var(--gold)}

/* --------------------------------------------------------------- forms -- */
.form-shell{background:#fff;border-radius:var(--radius);padding:1.5rem 1.4rem;box-shadow:var(--shadow-lg);color:var(--ink)}
.cta-form .form-shell{border-top:5px solid var(--gold)}
.quote-form{display:grid;gap:.9rem;margin:0}
@media(min-width:560px){.quote-form{grid-template-columns:repeat(2,1fr)}}
.ff{margin:0;display:flex;flex-direction:column;gap:.3rem}
.ff.full{grid-column:1/-1}
.ff-label{font-family:"Open Sans",sans-serif;font-weight:700;font-size:.85rem;color:var(--deep)}
.quote-form input,.quote-form select,.quote-form textarea{
  font-family:inherit;font-size:1rem;padding:.7em .85em;border:1px solid var(--line);
  border-radius:var(--radius-sm);background:var(--grey-2);color:var(--ink);width:100%}
.quote-form input:disabled,.quote-form select:disabled,.quote-form textarea:disabled{cursor:not-allowed;opacity:.85}
.ff-consent{grid-column:1/-1;margin:0;font-size:.86rem;color:var(--muted);display:flex;gap:.55rem;align-items:flex-start}
.quote-form input[type="checkbox"]{width:1.05rem;height:1.05rem;flex:0 0 auto;padding:0;margin:.2rem 0 0;
  accent-color:var(--red);align-self:flex-start}
.form-alt{grid-column:1/-1;margin:0;font-size:.92rem;color:var(--muted);text-align:center}
.ghl-live{background:#fff;border-radius:var(--radius);padding:.5rem}
.cta-form .ghl-live{box-shadow:var(--shadow-lg)}

/* ----------------------------------------------------------- crumbs ----- */
.crumbs{background:var(--grey-2);border-bottom:1px solid var(--line);font-size:.88rem}
.crumbs ol{list-style:none;margin:0;padding:.7rem 0;display:flex;flex-wrap:wrap;gap:.35rem}
.crumbs li+li::before{content:"/";color:#9AA3AD;margin-right:.35rem}
.crumbs a{color:var(--muted);text-decoration:none}
.crumbs a:hover{color:var(--red)}
.crumbs [aria-current]{color:var(--deep);font-weight:600}

/* ------------------------------------------------------- service pages -- */
.svc-layout{display:grid;gap:2.5rem}
@media(min-width:960px){.svc-layout{grid-template-columns:minmax(0,1fr) 340px;gap:3.5rem;align-items:start}}
.svc-main>p{max-width:70ch}
.svc-aside{position:static}
@media(min-width:960px){.svc-aside{position:sticky;top:calc(var(--header-h) + 20px)}}
.spec-card,.fact-card,.info-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:1.5rem 1.4rem;box-shadow:var(--shadow)}
.spec-card{border-top:5px solid var(--red)}
.spec-card h2,.fact-card h2,.info-card h2{font-size:1.15rem;margin-bottom:.9em}
.spec-list{margin:0 0 1.3rem;display:grid;gap:.75rem}
.spec{display:grid;gap:.1rem;padding-bottom:.75rem;border-bottom:1px solid var(--line)}
.spec:last-child{border-bottom:0;padding-bottom:0}
.spec dt{font-family:"Open Sans",sans-serif;font-weight:700;font-size:.78rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted)}
.spec dd{margin:0;font-weight:600;color:var(--deep)}
.spec-call{margin:.8rem 0 0;text-align:center;font-size:.92rem;color:var(--muted)}
.highlight-section{padding-block:0;margin-top:calc(var(--section-y) * -.45);margin-bottom:var(--section-y)}
.highlight{background:var(--navy-tint);border:1px solid #D8E3F0;border-left:5px solid var(--navy);
  border-radius:var(--radius);padding:1.8rem 1.6rem}
.highlight h2{font-size:1.4rem;margin-bottom:.7em}
.highlight-list{list-style:none;margin:0;padding:0;display:grid;gap:.9rem}
.highlight-list li{position:relative;padding-left:1.6rem;color:var(--ink)}
.highlight-list li::before{content:"";position:absolute;left:0;top:.62em;width:.5rem;height:.5rem;
  border-radius:50%;background:var(--navy)}
.benefit-grid,.where-grid{list-style:none;margin:0;padding:0;display:grid;gap:1.2rem}
@media(min-width:700px){.benefit-grid,.where-grid{grid-template-columns:repeat(2,1fr);gap:1.4rem}}
@media(min-width:1040px){.benefit-grid{grid-template-columns:repeat(3,1fr)}.where-grid{grid-template-columns:repeat(4,1fr)}}
.benefit,.where-item{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.3rem 1.25rem;
  box-shadow:var(--shadow)}
.where-item{border-top:3px solid var(--navy)}
.benefit h3,.where-item h3{margin-bottom:.35em;font-size:1.05rem}
.benefit p,.where-item p{margin:0;color:var(--muted);font-size:.95rem}
.other-grid{display:grid;gap:1rem}
@media(min-width:700px){.other-grid{grid-template-columns:repeat(3,1fr)}}
.other-svc{display:block;background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:1.1rem 1.2rem;text-decoration:none;transition:.15s}
.other-svc:hover{border-color:var(--red);box-shadow:var(--shadow)}
.other-svc span{display:block;font-family:"Open Sans",sans-serif;font-weight:700;color:var(--deep);margin-bottom:.25rem}
.other-svc small{display:block;color:var(--muted);font-size:.9rem;line-height:1.5}
.other-svc:hover span{color:var(--red)}

/* --------------------------------------------------------------- table -- */
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:#fff;
  box-shadow:var(--shadow)}
.compare{border-collapse:collapse;width:100%;min-width:680px;font-size:.95rem}
.compare caption{text-align:left;padding:1rem 1.2rem;font-weight:600;color:var(--muted);font-size:.9rem}
.compare th,.compare td{padding:.85rem 1rem;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.compare thead th{background:var(--deep);color:#fff;font-family:"Open Sans",sans-serif;font-size:.92rem;
  position:sticky;top:0}
.compare tbody th{font-family:"Open Sans",sans-serif;font-weight:700;color:var(--deep);background:var(--grey-2);
  width:180px}
.compare tbody tr:last-child th,.compare tbody tr:last-child td{border-bottom:0}

/* ----------------------------------------------------------------- faq -- */
.faq-list{display:grid;gap:.7rem}
.faq-item{background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);overflow:hidden}
.faq-item summary{cursor:pointer;list-style:none;padding:1.1rem 3rem 1.1rem 1.3rem;position:relative;
  font-family:"Open Sans",sans-serif;font-weight:700;color:var(--deep);font-size:1.02rem;line-height:1.4}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"";position:absolute;right:1.2rem;top:1.35rem;width:14px;height:14px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239F1515' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform .2s}
.faq-item[open] summary::after{transform:rotate(45deg)}
.faq-item[open] summary{background:var(--red-tint)}
.faq-item summary:hover{background:var(--grey-2)}
.faq-a{padding:0 1.3rem 1.2rem}
.faq-a p{margin:0;color:var(--muted)}
.faq-more{margin:1.6rem 0 0;text-align:center}
.faq-nav{background:var(--grey-2);border:1px solid var(--line);border-radius:var(--radius);
  padding:1rem 1.2rem;margin-bottom:2.5rem}
.faq-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
.faq-nav a{display:inline-block;padding:.35em .9em;background:#fff;border:1px solid var(--line);
  border-radius:99px;font-size:.9rem;font-weight:600;text-decoration:none}
.faq-nav a:hover{border-color:var(--red);color:var(--red)}
.faq-group{margin-bottom:3rem}
.faq-group:last-child{margin-bottom:0}

/* --------------------------------------------------------------- about -- */
.about-layout{display:grid;gap:2.5rem}
@media(min-width:960px){.about-layout{grid-template-columns:minmax(0,1fr) 340px;gap:3.5rem;align-items:start}}
.about-main p{max-width:70ch}
.fact-card{border-top:5px solid var(--navy)}
.value-grid{list-style:none;margin:0;padding:0;display:grid;gap:1.2rem}
@media(min-width:700px){.value-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1040px){.value-grid{grid-template-columns:repeat(4,1fr)}}
.value{background:#fff;border:1px solid var(--line);border-top:4px solid var(--gold);
  border-radius:var(--radius);padding:1.35rem 1.25rem;box-shadow:var(--shadow)}
.value h3{margin-bottom:.35em;font-size:1.05rem}
.value p{margin:0;color:var(--muted);font-size:.95rem}
.team-grid{display:grid;gap:1.5rem}
@media(min-width:700px){.team-grid{grid-template-columns:repeat(2,1fr)}}
.team-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  box-shadow:var(--shadow);display:grid;grid-template-columns:1fr}
@media(min-width:520px){.team-card{grid-template-columns:180px 1fr}}
.team-photo{border-radius:0;height:100%}
.team-body{padding:1.4rem 1.3rem}
.team-body h3{margin-bottom:.2em}
.team-role{font-family:"Open Sans",sans-serif;font-weight:700;font-size:.85rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--red);margin-bottom:.7em}
.team-body p:last-child{margin:0;color:var(--muted);font-size:.96rem}
.cred-grid{display:grid;gap:1.2rem}
@media(min-width:700px){.cred-grid{grid-template-columns:repeat(2,1fr)}}
.cred-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.4rem;
  box-shadow:var(--shadow);display:grid;gap:1.1rem}
@media(min-width:480px){.cred-card{grid-template-columns:96px 1fr;align-items:start}}
.cred-badge .photo{border-radius:10px}
.cred-body h3{margin-bottom:.35em}
.cred-body p{margin:0;color:var(--muted);font-size:.96rem}
.check-list{list-style:none;margin:0;padding:0;display:grid;gap:.8rem}
.check-list li{position:relative;padding-left:2rem;color:var(--ink)}
.check-list li::before{content:"";position:absolute;left:0;top:.3rem;width:1.25rem;height:1.25rem;border-radius:50%;
  background:var(--navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/.8rem no-repeat}

/* --------------------------------------------------------------- areas -- */
.areas-grid{display:grid;gap:2rem}
@media(min-width:900px){.areas-grid{grid-template-columns:1fr 1fr;gap:3rem;align-items:center}}
.area-links{list-style:none;margin:1.2rem 0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
.area-links a{display:inline-block;padding:.4em 1em;background:#fff;border:1px solid var(--line);
  border-radius:99px;font-weight:600;font-size:.94rem;text-decoration:none}
.area-links a:hover{border-color:var(--red);color:var(--red)}
.area-promise{color:var(--muted);font-size:.95rem}
.area-grid{display:grid;gap:1.5rem}
@media(min-width:820px){.area-grid{grid-template-columns:repeat(3,1fr)}}
.area-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  box-shadow:var(--shadow);display:flex;flex-direction:column}
.area-photo{border-radius:0}
.area-body{padding:1.4rem 1.3rem;display:flex;flex-direction:column;flex:1}
.area-body h3{margin-bottom:.4em;font-size:1.25rem}
.area-body h3 a{color:var(--deep);text-decoration:none}
.area-body h3 a:hover{color:var(--red)}
.area-body>p{color:var(--muted);font-size:.96rem}
.place-list{list-style:none;margin:0 0 1.1rem;padding:0;display:flex;flex-wrap:wrap;gap:.35rem;flex:1}
.place-list li{font-size:.84rem;color:var(--muted);background:var(--grey-2);border:1px solid var(--line);
  border-radius:99px;padding:.15em .7em}
.place-list-col{flex-direction:column;gap:.3rem}
.place-list-col li{background:none;border:0;padding:0;border-bottom:1px solid var(--line);
  padding-bottom:.3rem;width:100%;font-size:.95rem}
.sister-note{background:var(--navy-tint);border:1px solid #D8E3F0;border-radius:var(--radius);padding:1.6rem}
.sister-note h2{font-size:1.3rem;margin-bottom:.5em}
.sister-note p{margin:0;color:var(--muted)}

/* ------------------------------------------------------------- contact -- */
.contact-grid{display:grid;gap:2.5rem}
@media(min-width:960px){.contact-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:3.5rem;align-items:start}}
.info-card{border-top:5px solid var(--navy)}
.info-list{list-style:none;margin:0 0 1.5rem;padding:0;display:grid;gap:1rem}
.info-list li{display:grid;gap:.15rem;padding-bottom:1rem;border-bottom:1px solid var(--line)}
.info-list li:last-child{border-bottom:0;padding-bottom:0}
.info-label{font-family:"Open Sans",sans-serif;font-weight:700;font-size:.76rem;letter-spacing:.09em;
  text-transform:uppercase;color:var(--muted)}
.info-big{font-family:"Open Sans",sans-serif;font-weight:800;font-size:1.3rem;color:var(--deep);
  text-decoration:none;letter-spacing:-.01em}
.info-big:hover{color:var(--red)}
.info-sub{font-size:1rem;margin-bottom:.6em}
.hours-list{list-style:none;margin:0 0 1rem;padding:0;display:grid;gap:.4rem;font-size:.95rem}
.hours-list li{display:flex;justify-content:space-between;gap:1rem;padding-bottom:.4rem;
  border-bottom:1px dotted var(--line)}
.hours-list li span:last-child{color:var(--muted);font-weight:600}
.reassure{margin-top:1.5rem;background:var(--navy-tint);border:1px solid #D8E3F0;border-radius:var(--radius);
  padding:1.4rem}
.reassure h3{font-size:1.05rem;margin-bottom:.6em}

/* ---------------------------------------------------------------- blog -- */
.post-grid{display:grid;gap:1.5rem}
@media(min-width:760px){.post-grid{grid-template-columns:repeat(3,1fr)}}
.post-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  box-shadow:var(--shadow);transition:transform .18s,box-shadow .18s}
.post-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.post-link{display:flex;flex-direction:column;height:100%;text-decoration:none;color:inherit}
.post-photo{border-radius:0}
.post-body{padding:1.4rem 1.3rem;display:flex;flex-direction:column;flex:1}
.post-body h2{font-size:1.22rem;margin-bottom:.35em}
.post-body p{color:var(--muted);font-size:.96rem}
.post-tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.8rem}
.tag{font-family:"Open Sans",sans-serif;font-size:.7rem;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:var(--red);background:var(--red-tint);border-radius:99px;padding:.25em .8em}
.post-meta{font-size:.86rem;color:var(--muted);margin-bottom:.7em}
.post-body p:last-of-type{flex:1}
.post-header{background:var(--grey-2);border-bottom:1px solid var(--line);padding:clamp(2.5rem,6vw,4rem) 0 2rem}
.post-title{font-size:clamp(1.9rem,4.6vw,2.9rem);margin-bottom:.3em}
.post-hero{margin-top:-1.5rem;margin-bottom:2.5rem}
@media(min-width:760px){.post-hero{margin-top:-2.5rem}}
.post-hero-photo{box-shadow:var(--shadow-lg)}
.post-content{padding-bottom:var(--section-y)}
.post-content h2{font-size:clamp(1.35rem,2.8vw,1.8rem);margin-top:2.2em}
.post-lead{font-size:1.18rem;color:var(--muted);border-left:4px solid var(--red);padding-left:1.1rem}
.post-content p,.post-content li{max-width:72ch}
.post-list{display:grid;gap:.6rem;padding-left:1.3rem}
.post-callout{background:var(--navy-tint);border-left:4px solid var(--navy);border-radius:0 var(--radius) var(--radius) 0;
  padding:1.2rem 1.4rem;margin:2rem 0}
.post-callout p{margin:0;font-weight:600;color:var(--deep)}
.post-rule{margin:3rem 0 1.5rem}
.post-outro{color:var(--muted)}

/* --------------------------------------------------------------- legal -- */
.page-title{font-size:clamp(1.9rem,4.4vw,2.7rem)}
.legal h2{font-size:1.25rem;margin-top:2em}
.legal p{max-width:72ch;color:var(--ink)}
.legal-updated{color:var(--muted);font-size:.9rem}
.legal-note{background:#FFF9E8;border:1px solid #F0DFA8;border-radius:var(--radius);padding:1rem 1.2rem;
  font-size:.94rem}
.notfound{text-align:left}
.notfound .check-list{margin-bottom:2rem}

/* -------------------------------------------------------------- footer -- */
.site-footer{background:var(--deep);color:#B9C8D4;font-size:.95rem;padding-top:clamp(3rem,6vw,4.5rem)}
.footer-grid{display:grid;gap:2.5rem;padding-bottom:3rem}
@media(min-width:700px){.footer-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1040px){.footer-grid{grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:3rem}}
.site-footer h2,.site-footer h3{color:#fff}
.f-head{font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);
  margin-bottom:1.1em;font-weight:800}
.f-head-gap{margin-top:1.8em}
.site-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:.55rem}
.site-footer a{color:#D3DEE7;text-decoration:none}
.site-footer a:hover{color:#fff;text-decoration:underline}
.f-tag{font-family:"Open Sans",sans-serif;font-weight:800;color:var(--gold);font-size:1.05rem;
  margin:1.1rem 0 .5rem;letter-spacing:-.01em}
.f-desc{color:#93A6B4;max-width:38ch}
.f-social{display:flex!important;flex-wrap:wrap;gap:.8rem;margin-top:1rem!important}
.f-hours li{display:flex;justify-content:space-between;gap:1rem;color:#93A6B4}
.f-contact li{color:#D3DEE7}
.f-phone{font-family:"Open Sans",sans-serif;font-weight:800;font-size:1.35rem;color:#fff!important}
.f-cta{margin:1.2rem 0}
.f-contact-col .map-embed{min-height:180px;border:1px solid rgba(255,255,255,.14)}
.f-contact-col .embed-ph{min-height:180px;background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.2);
  color:#93A6B4;padding:1.2rem}
.f-contact-col .embed-ph-title{color:#fff;font-size:.9rem}
.f-contact-col .embed-ph svg{width:28px;height:28px;color:var(--gold)}
.f-bottom{border-top:1px solid rgba(255,255,255,.12);padding-block:1.3rem;font-size:.88rem}
.f-bottom-inner{display:flex;flex-wrap:wrap;gap:.6rem 1.5rem;justify-content:space-between;align-items:center}
.f-bottom p{margin:0;color:#8FA2B0}
.f-legal a{color:#B9C8D4}

/* --------------------------------------------------------- mobile bar --- */
.mobile-bar{position:fixed;left:0;right:0;bottom:0;z-index:97;display:grid;grid-template-columns:1fr 1fr;
  background:#fff;border-top:1px solid var(--line);box-shadow:0 -4px 20px rgba(5,28,42,.14)}
.mobile-bar a{display:flex;align-items:center;justify-content:center;gap:.45rem;padding:.95rem .5rem;
  font-family:"Open Sans",sans-serif;font-weight:700;font-size:.95rem;text-decoration:none}
.mb-call{background:var(--deep);color:#fff}
.mb-call svg{width:18px;height:18px}
.mb-quote{background:var(--red);color:#fff}
.mb-call:hover,.mb-quote:hover{color:#fff}
@media(min-width:1000px){.mobile-bar{display:none}}
@media(max-width:999px){body{padding-bottom:56px}.site-nav{padding-bottom:140px}}

@media print{
  .site-header,.topbar,.mobile-bar,.cta-band,.site-footer,.nav-scrim{display:none!important}
  body{font-size:11pt}
  .hero{background:none;color:#000;padding:1rem 0}
  .hero-title,.hero h1{color:#000}
}

.site-header.is-stuck{box-shadow:0 4px 22px rgba(5,28,42,.12)}

@media(max-width:520px){
  .kicker{letter-spacing:.1em;font-size:.74rem}
  .hero-sub{font-size:1.05rem}
}

/* ------------------------------------------------------------ our work -- */
.filter-bar{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.8rem}
.filter-btn{font-family:"Open Sans",sans-serif;font-weight:700;font-size:.9rem;
  padding:.5em 1.1em;border-radius:99px;border:1px solid var(--line);background:#fff;
  color:var(--deep);cursor:pointer;transition:.15s}
.filter-btn:hover{border-color:var(--red);color:var(--red)}
.filter-btn.is-on{background:var(--red);border-color:var(--red);color:#fff}
.gal-zoom{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in;position:relative;
  border-radius:var(--radius);overflow:hidden}
.gal-zoom .photo{border-radius:var(--radius);transition:transform .3s ease}
.gal-zoom:hover .photo{transform:scale(1.03)}
.gal-cat{position:absolute;left:.6rem;top:.6rem;z-index:2;font-family:"Open Sans",sans-serif;
  font-size:.68rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:#fff;
  background:rgba(5,28,42,.78);padding:.25em .7em;border-radius:99px;backdrop-filter:blur(3px)}
.gal-item[hidden]{display:none}
.gal-empty{text-align:center;color:var(--muted);padding:2rem 0}

.project-list{display:grid;gap:clamp(2.5rem,5vw,4rem)}
.project{display:grid;gap:1.5rem;background:#fff;border:1px solid var(--line);
  border-radius:var(--radius);padding:clamp(1.2rem,2.5vw,2rem);box-shadow:var(--shadow)}
@media(min-width:900px){
  .project{grid-template-columns:1.15fr .85fr;gap:2.5rem;align-items:start}
  .project .pj-thumbs{grid-column:1/-1}
  .project.alt-row .pj-lead{order:2}
  .project.alt-row .pj-body{order:1}
}
.pj-hero{margin:0}
.pj-hero figcaption,.pj-thumb figcaption{font-size:.9rem;color:var(--muted);margin-top:.6rem;line-height:1.45}
.pj-body h3{font-size:clamp(1.3rem,2.6vw,1.75rem);margin-bottom:.5em}
.pj-summary{font-size:1.05rem}
.pj-body p{color:var(--muted)}
.pj-facts{margin-top:1.4rem;margin-bottom:0}
.pj-thumbs{display:grid;gap:1.2rem}
@media(min-width:640px){.pj-thumbs{grid-template-columns:repeat(2,1fr)}}
.pj-thumb{margin:0}

.lightbox{position:fixed;inset:0;z-index:200;background:rgba(5,28,42,.94);
  display:flex;align-items:center;justify-content:center;padding:clamp(1rem,4vw,3rem)}
.lightbox[hidden]{display:none}
.lb-figure{margin:0;max-width:min(1200px,94vw);text-align:center}
.lb-img{max-width:100%;max-height:78vh;width:auto;border-radius:var(--radius);
  box-shadow:0 24px 70px rgba(0,0,0,.5)}
.lb-cap{color:#D8E2EA;font-size:.98rem;margin-top:1rem;max-width:70ch;margin-inline:auto}
.lb-close{position:absolute;top:1rem;right:1.2rem;width:48px;height:48px;font-size:2rem;line-height:1;
  color:#fff;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3);
  border-radius:50%;cursor:pointer}
.lb-close:hover{background:var(--red);border-color:var(--red)}

/* ------------------------------------------------- supplied logo lockup -- */
.logo.has-img{display:block}
.logo-img{height:46px;width:auto;display:block}
@media(min-width:1000px){.logo-img{height:56px}}
@media(min-width:1200px){.logo-img{height:62px}}
.logo{flex:0 0 auto}
.site-footer .logo-img{height:56px}

/* ------------------------------------------- ported detail from old site -- */
.detail-section .section-head{margin-bottom:2rem}
.detail-block{margin-bottom:2.6rem}
.detail-block:last-child{margin-bottom:0}
.detail-block h2{font-size:clamp(1.25rem,2.6vw,1.6rem);margin-bottom:.7em;padding-bottom:.5rem;
  border-bottom:2px solid var(--red);display:inline-block}
.detail-block p{color:var(--ink)}
.detail-list{list-style:none;margin:0 0 1.2em;padding:0;display:grid;gap:.65rem}
.detail-list li{position:relative;padding-left:1.7rem;color:var(--ink)}
.detail-list li::before{content:"";position:absolute;left:0;top:.55em;width:.55rem;height:.55rem;
  border-radius:50%;background:var(--red)}
.detail-photo{margin:1.6rem 0;text-align:center}
.detail-photo .photo{aspect-ratio:auto;background:var(--grey-2);border:1px solid var(--line)}
.detail-photo img{width:100%;height:auto;object-fit:contain}
.detail-photo figcaption{font-size:.92rem;color:var(--muted);margin-top:.7rem}
.detail-photo .gal-zoom{cursor:zoom-in}
.detail-photo .gal-zoom{max-width:min(100%, var(--ph-max, 680px));margin-inline:auto}
.detail-photo .photo{max-width:min(100%, var(--maxw, 680px));margin-inline:auto}

/* ------------------------------------------------------------ go green --- */
.go-green{background:var(--navy-tint);border-left:5px solid #2E7D32;border-radius:var(--radius);
  padding:1.8rem 1.6rem}
.go-green h2{font-size:1.4rem;margin-bottom:.6em}
.go-green p:last-child{margin-bottom:0}
.res-com{margin-top:1.8rem;text-align:center}
.lead-time{margin-top:1rem;padding:.8rem 1rem;background:#FFF9E8;border:1px solid #F0DFA8;
  border-radius:var(--radius-sm);font-size:.92rem;color:var(--ink)}
.sister-note{display:grid;gap:1.4rem}
@media(min-width:640px){.sister-note{grid-template-columns:200px 1fr;align-items:center}}
.sister-logo .photo{background:none;border:0}
.sister-logo img{object-fit:contain}

/* --------------------------------------------------- in-post job photos -- */
.post-figure{margin:2.2rem 0}
.post-figure .photo{aspect-ratio:auto;max-width:100%;background:var(--grey-2);border:1px solid var(--line)}
.post-figure img{width:100%;height:auto;object-fit:contain}
.post-figure figcaption{font-size:.92rem;color:var(--muted);margin-top:.7rem;font-style:italic}
.post-content h3{font-size:1.12rem;margin-top:1.8em;margin-bottom:.5em;color:var(--deep)}
.post-hero-photo{aspect-ratio:16/9}

/* ----------------------------------------------------- aerial map band --- */
.map-embed.is-aerial{min-height:420px;border:1px solid var(--line);box-shadow:var(--shadow)}
.map-embed.is-aerial iframe{min-height:420px}
@media(min-width:900px){.map-embed.is-aerial,.map-embed.is-aerial iframe{min-height:520px}}
.aerial-section .small-note{max-width:70ch;margin-inline:auto}

/* -------------------------------------------------------- photo credits -- */
.hero-credit{display:block;margin-top:.6rem;font-size:.78rem;color:#8FA6B6;max-width:60ch}
.hero-credit a{color:#B9C8D4;text-decoration:underline;text-underline-offset:2px}
.hero-credit a:hover{color:var(--gold)}
.credits-table td{vertical-align:middle}
.credits-table .credit-thumb{width:150px;border-radius:var(--radius-sm)}
.credits-table tbody th,.credits-table td:first-child{width:170px}

/* ------------------------------------------------------- hero trust row -- */
.hero-trust{list-style:none;margin:1.8rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem .6rem}
.hero-trust li{position:relative;padding:.35em .9em .35em 2.1em;font-size:.86rem;color:#DCE6EE;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);border-radius:99px;
  backdrop-filter:blur(3px)}
.hero-trust li::before{content:"";position:absolute;left:.7em;top:.62em;width:.95rem;height:.95rem;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F9CD08' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat}

/* ------------------------------------------------------------ truck band -- */
.truck-band{background:
  radial-gradient(900px 420px at 78% 20%, rgba(44,88,141,.55), transparent 62%),
  linear-gradient(155deg,#051C2A 0%,#0B2C42 58%,#123650 100%);
  color:#fff;padding-block:clamp(3rem,7vw,5rem);overflow:hidden}
.truck-grid{display:grid;gap:2rem;align-items:center}
@media(min-width:900px){.truck-grid{grid-template-columns:1fr 1.05fr;gap:3rem}}
.truck-copy h2{color:#fff;font-size:clamp(1.8rem,3.8vw,2.6rem)}
.truck-copy p{color:#C7D6E1}
.truck-points{list-style:none;margin:1.4rem 0;padding:0;display:grid;gap:.6rem}
.truck-points li{position:relative;padding-left:1.9rem;color:#DCE6EE}
.truck-points li::before{content:"";position:absolute;left:0;top:.42em;width:1.15rem;height:1.15rem;border-radius:50%;
  background:rgba(255,255,255,.14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F9CD08' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/.75rem no-repeat}
.truck-cta{display:flex;flex-wrap:wrap;gap:.8rem;margin:0}
.truck-img{position:relative}
.truck-img .photo{background:none;border:0;aspect-ratio:auto;overflow:visible}
.truck-img img{width:100%;height:auto;object-fit:contain;
  filter:drop-shadow(0 26px 34px rgba(0,0,0,.55)) drop-shadow(0 2px 6px rgba(0,0,0,.4))}
.truck-img::after{content:"";position:absolute;left:8%;right:8%;bottom:-6px;height:26px;border-radius:50%;
  background:radial-gradient(ellipse at center, rgba(0,0,0,.55), transparent 72%);z-index:-1}

/* ------------------------------------------------------------- selector -- */
.selector{background:#fff;border:1px solid var(--line);border-top:5px solid var(--red);
  border-radius:var(--radius);padding:clamp(1.4rem,3vw,2.2rem);box-shadow:var(--shadow-lg)}
.sel-step{border:0;margin:0;padding:0;min-width:0}
.sel-step legend{display:flex;align-items:center;gap:.7rem;font-family:"Open Sans",sans-serif;
  font-weight:800;font-size:clamp(1.05rem,2.2vw,1.28rem);color:var(--deep);margin-bottom:1.1rem;padding:0}
.sel-num{display:grid;place-items:center;width:2rem;height:2rem;border-radius:50%;background:var(--navy);
  color:#fff;font-size:.95rem;flex:0 0 auto}
.sel-opts{display:grid;gap:.6rem}
@media(min-width:620px){.sel-opts{grid-template-columns:repeat(2,1fr)}}
.sel-opt{text-align:left;font-family:inherit;font-size:1rem;color:var(--ink);background:var(--grey-2);
  border:1px solid var(--line);border-radius:var(--radius-sm);padding:.85em 1em;cursor:pointer;transition:.15s}
.sel-opt:hover{border-color:var(--red);background:var(--red-tint);color:var(--deep)}
.sel-opt.is-on{background:var(--red);border-color:var(--red);color:#fff}
.sel-result{outline:none}
.sel-result .sel-head{font-size:clamp(1.3rem,2.8vw,1.8rem);margin-bottom:.4em}
.sel-why{font-size:1.05rem;color:var(--muted)}
.sel-actions{display:flex;flex-wrap:wrap;gap:.7rem;margin:1.4rem 0 1rem}
.sel-foot{font-size:.9rem;color:var(--muted);margin:0;padding-top:1rem;border-top:1px solid var(--line)}
.selector-section .section-head{text-align:center;margin-inline:auto}
.rating-avg{display:block;margin-top:.5rem;font-size:.85rem;color:var(--muted)}

/* =========================================================================
   Sky bands — the old site used a literal cloud photo behind content. Here the
   clouds sit UNDER the brand gradient as a texture, so they read as atmosphere
   rather than as a picture competing with the type. Gradient opacities are set
   so the lightest cloud never lifts the background above roughly #4a6a82,
   which keeps white body text at 5:1+ contrast.
   ========================================================================= */
.has-sky{position:relative;isolation:isolate}
.has-sky::before{content:"";position:absolute;inset:0;z-index:-1;
  background-image:url("/barrieinsulation-site/assets/img/sky-clouds-band.jpg");
  background-size:cover;background-position:center 48%;background-repeat:no-repeat;
  /* softened so no cloud becomes a hot spot behind type, but kept bright */
  filter:blur(1px) saturate(1) brightness(1.1)}
.has-sky::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(163deg,rgba(5,28,42,.80) 0%,rgba(9,38,58,.62) 45%,rgba(16,50,74,.78) 100%)}

/* the truck band is where the sky earns its place — the cut-out truck reads as
   being out on the road rather than floating on a flat colour */
.truck-band{background:none}
.truck-band::before{background-position:center 62%;filter:blur(.8px) saturate(1.05) brightness(1.16)}
.truck-band::after{background:
  radial-gradient(880px 420px at 68% 0%, rgba(120,180,232,.14), transparent 72%),
  linear-gradient(174deg,rgba(5,28,42,.66) 0%,rgba(7,32,50,.30) 44%,rgba(8,34,52,.74) 100%)}
/* the copy column gets its own soft scrim so text never sits on a cloud edge */
.truck-copy{position:relative}
/* the copy sits on its own scrim so no line of text lands on a bright cloud */
.truck-copy::before{content:"";position:absolute;inset:-1.75rem -2.5rem;z-index:-1;border-radius:26px;
  background:radial-gradient(135% 115% at 26% 50%, rgba(4,24,38,.86) 0%, rgba(4,24,38,.72) 46%,
             rgba(4,24,38,0) 78%)}
@media(max-width:899px){.truck-copy::before{inset:-1.25rem -1.25rem;
  background:linear-gradient(180deg, rgba(4,24,38,.82), rgba(4,24,38,.7))}}
.truck-copy p{color:#DCE6EE}

/* a quieter ribbon under the hero */
.trust-bar{background:none}
.trust-bar::after{background:linear-gradient(180deg,rgba(5,28,42,.84),rgba(5,28,42,.76))}
.trust-bar::before{background-position:center 22%;opacity:1;filter:blur(1px) saturate(1) brightness(1.14)}

/* hero fallback when a page has no photo yet */
.hero.no-photo{background:none}
.hero.no-photo::before{content:"";position:absolute;inset:0;z-index:-2;
  background:url("/barrieinsulation-site/assets/img/sky-clouds-band.jpg") center 34%/cover no-repeat}
.hero.no-photo .hero-shade{background:
  radial-gradient(1100px 480px at 12% -10%, rgba(44,88,141,.5), transparent 60%),
  linear-gradient(160deg,rgba(5,28,42,.93) 0%,rgba(9,38,58,.86) 55%,rgba(16,50,74,.9) 100%)}

@media (prefers-reduced-motion: no-preference){
  .has-sky::before{transform:translateZ(0)}
}
@media print{.has-sky::before,.has-sky::after{display:none}}

/* =========================================================================
   Light sky — the bright counterpart. The sky sits at the TOP of a section and
   is masked away as it descends, so headings get open sky and the body copy
   lands on clean background. Dark text on pale sky reads at 9:1, far better
   than white-on-navy, which is why this is the brighter of the two treatments.
   ========================================================================= */
.sky-light{position:relative;isolation:isolate;background:var(--white)}
.sky-light.alt{background:var(--grey-2)}
.sky-light::before{content:"";position:absolute;inset:0 0 auto 0;z-index:-1;
  height:clamp(230px,42%,460px);
  background:url("/barrieinsulation-site/assets/img/sky-clouds-band.jpg") center 20%/cover no-repeat;
  filter:saturate(1.05) brightness(1.12);
  -webkit-mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.92) 38%,rgba(0,0,0,.45) 72%,transparent 100%);
  mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.92) 38%,rgba(0,0,0,.45) 72%,transparent 100%)}
/* a wash keeps the sky from ever getting saturated enough to fight dark text */
.sky-light::after{content:"";position:absolute;inset:0 0 auto 0;z-index:-1;
  height:clamp(230px,42%,460px);
  background:linear-gradient(180deg,rgba(255,255,255,.34) 0%,rgba(255,255,255,.52) 60%,rgba(255,255,255,.85) 100%)}
.sky-light.alt::after{background:linear-gradient(180deg,rgba(247,248,249,.36) 0%,rgba(247,248,249,.56) 60%,rgba(247,248,249,.9) 100%)}
/* muted greys are too light against sky — darken the copy inside the sky zone */
.sky-light .section-lead,.sky-light .lead-p{color:#33414D}
.sky-light .section-title{color:var(--deep)}
@media print{.sky-light::before,.sky-light::after{display:none}}

/* ==================================================== applicator badge ====
   The figure is lifted from the truck's own signwriting. He turns on the spot
   inside a fixed medallion — rotating the badge itself would make the whole
   thing vanish edge-on twice a cycle, which reads as a glitch in a header.
   ========================================================================= */
.mascot-badge{flex:0 0 auto;width:42px;height:42px;border-radius:50%;overflow:hidden;
  display:grid;place-items:center;perspective:220px;
  background:radial-gradient(circle at 50% 32%, #2f6eab 0%, #14406e 78%);
  border:2px solid #fff;box-shadow:0 2px 9px rgba(5,28,42,.3)}
.mascot-badge img{height:40px;width:auto;display:block;transform-origin:50% 50%;
  animation:mascot-turn 9s cubic-bezier(.45,.05,.25,1) infinite}
/* One full turn, then he faces forward for seven seconds. A continuous spin
   leaves him edge-on half the time, which just reads as a flickering blob. */
@keyframes mascot-turn{
  0%{transform:rotateY(0deg)}
  24%{transform:rotateY(360deg)}
  100%{transform:rotateY(360deg)}}
@media(min-width:1000px){.mascot-badge{width:50px;height:50px}.mascot-badge img{height:48px}}
.mascot-badge:hover img{animation-duration:3.4s}
@media (prefers-reduced-motion: reduce){.mascot-badge img{animation:none}}

/* ======================================================= truck drive-in ===
   The truck rolls in from the right and settles when the band scrolls into
   view. Held off until .is-in so it never plays above the fold or on a
   browser that never fires the observer.
   ========================================================================= */
.truck-img{will-change:transform}
@media (prefers-reduced-motion: no-preference){
  .js .truck-img{transform:translate3d(115%,0,0);opacity:0}
  .js .truck-band.is-in .truck-img{
    transform:translate3d(0,0,0);opacity:1;
    transition:transform 1.25s cubic-bezier(.17,.72,.26,1), opacity .55s ease-out}
  /* the nose dips as it stops, the way a truck settles on its springs */
  .js .truck-band.is-in .truck-img .photo{animation:truck-settle .5s ease-out 1.05s both}
  @keyframes truck-settle{
    0%{transform:rotate(0deg)}
    38%{transform:rotate(-1.1deg)}
    70%{transform:rotate(.45deg)}
    100%{transform:rotate(0deg)}}
}

/* ==================================================== warm home hero =====
   The homepage hero photo is a finished interior — warm stone, wood ceiling,
   green through the glass. The standard navy shade buried all of it, so this
   one lifts the overlay and adds an amber wash, then protects the copy with
   its own radial scrim instead of darkening the whole frame. Scoped to the
   home hero: the aerial heroes are already bright and need the opposite.
   ========================================================================= */
.hero-warm .hero-shade{background:
  linear-gradient(104deg, rgba(10,26,34,.80) 0%, rgba(16,32,36,.52) 46%, rgba(40,36,28,.18) 100%),
  linear-gradient(180deg, rgba(158,98,36,.22) 0%, rgba(158,98,36,.07) 100%)}
.hero-warm .hero-inner{position:relative}
.hero-warm .hero-inner::before{content:"";position:absolute;z-index:-1;border-radius:28px;
  inset:-2.5rem -3rem -2rem -3rem;
  background:radial-gradient(125% 108% at 22% 52%, rgba(6,20,30,.80) 0%,
             rgba(6,20,30,.58) 48%, rgba(6,20,30,0) 80%)}
@media(max-width:760px){
  .hero-warm .hero-inner::before{inset:-1.5rem -1.4rem;border-radius:18px;
    background:linear-gradient(180deg, rgba(6,20,30,.72), rgba(6,20,30,.62))}
}

/* ================================================ branching quote form ====
   The visitor picks their audience first, because a contractor and a homeowner
   need completely different questions asked of them.
   ========================================================================= */
.audience-form{display:grid;gap:1.6rem}
.aud-choose{background:var(--navy-tint);border:1px solid #D8E3F0;border-radius:var(--radius);
  padding:1.4rem 1.3rem}
.aud-prompt{font-size:1.12rem;margin-bottom:.35em}
.aud-note{font-size:.94rem;color:var(--muted);margin-bottom:1.1rem}
.aud-tabs{display:grid;gap:.75rem}
@media(min-width:560px){.aud-tabs{grid-template-columns:repeat(2,1fr)}}
.aud-btn{display:grid;grid-template-columns:auto 1fr;grid-template-areas:"i l" "i b";
  gap:.15rem .8rem;align-items:center;text-align:left;cursor:pointer;
  background:#fff;border:2px solid var(--line);border-radius:var(--radius);
  padding:1rem 1.1rem;font-family:inherit;transition:.15s}
.aud-btn:hover{border-color:var(--red);box-shadow:var(--shadow)}
.aud-btn[aria-selected="true"]{border-color:var(--red);background:var(--red-tint);
  box-shadow:0 0 0 3px rgba(159,21,21,.12)}
.aud-icon{grid-area:i;width:34px;height:34px;color:var(--red)}
.aud-label{grid-area:l;font-family:"Open Sans",sans-serif;font-weight:800;font-size:1rem;color:var(--deep)}
.aud-blurb{grid-area:b;font-size:.86rem;color:var(--muted);line-height:1.35}
.aud-panel[hidden]{display:none}
.aud-intro{font-size:1rem;color:var(--muted);margin-bottom:1.1rem}
.ff-label{display:block}
.req{color:var(--red);text-decoration:none;border:0;font-weight:700}