img{max-width:100%;height:auto}
:root{
  --ink:#0a3445;--teal:#0f6a8b;--ice:#eaf4f7;--ice2:#d6e9ef;--ember:#e8502a;--ember-d:#b93a18;--sun:#f5a623;--white:#fff;
  --display:'Barlow Condensed','Arial Narrow',sans-serif;--body:'Source Sans 3',system-ui,sans-serif;
}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{font-family:var(--body);color:var(--ink);background:var(--white);font-size:1.05rem;line-height:1.6}
h1,h2,h3,h4{font-family:var(--display);text-transform:uppercase;letter-spacing:.01em;line-height:1;font-weight:700}
a{color:var(--teal)}
.eyebrow{font-family:var(--display);font-weight:600;letter-spacing:.22em;text-transform:uppercase;font-size:.9rem;color:var(--ember-d)}
.on-dark .eyebrow{color:var(--sun)}
section{padding:96px 0;position:relative}
.sec-title{font-size:clamp(2.6rem,6vw,4.4rem);margin:.4rem 0 1.2rem}

/* utility bar + nav */
.utility{background:var(--ink);color:#fff;font-size:.95rem}
.utility a{color:#fff;text-decoration:none;font-weight:600}
.utility .bar{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.45rem 0;flex-wrap:wrap}
.utility .hot{background:var(--ember);padding:.15rem .7rem;border-radius:2px;font-family:var(--display);letter-spacing:.08em;text-transform:uppercase}
.navbar{background:rgba(255,255,255,.97);border-bottom:3px solid var(--ember);padding:.5rem 0}
.navbar-brand{display:flex;align-items:center;gap:.7rem;color:var(--ink);font-family:var(--display);font-weight:700;font-size:1.5rem;text-transform:uppercase;line-height:1}
.navbar-brand img{height:46px;width:auto}
.navbar-brand small{display:block;font-size:.72rem;letter-spacing:.18em;color:var(--teal);font-weight:600}
.navbar .nav-link{font-family:var(--display);font-weight:600;text-transform:uppercase;letter-spacing:.1em;font-size:1.05rem;color:var(--ink)!important}
.navbar .nav-link:hover{color:var(--ember)!important}
.btn-ember{background:var(--ember);border:2px solid var(--ember);color:#fff;font-family:var(--display);font-weight:700;letter-spacing:.1em;text-transform:uppercase;font-size:1.15rem;padding:.6rem 1.6rem;border-radius:2px}
.btn-ember:hover{background:var(--ember-d);border-color:var(--ember-d);color:#fff}
.btn-line{border:2px solid var(--ink);color:var(--ink);font-family:var(--display);font-weight:700;letter-spacing:.1em;text-transform:uppercase;font-size:1.15rem;padding:.6rem 1.6rem;border-radius:2px}
.btn-line:hover{background:var(--ink);color:#fff}
.on-dark .btn-line{border-color:#fff;color:#fff}
.on-dark .btn-line:hover{background:#fff;color:var(--ink)}

/* hero */
.hero{background:var(--ice);padding:72px 0 96px;overflow:hidden}
.hero h1{font-size:clamp(3rem,6.5vw,5.4rem);line-height:.95;margin:.5rem 0 1rem;color:var(--ink)}
.hero h1 .hot{color:var(--ember)}
.hero h1 .cold{color:var(--teal)}
.hero p.lead{max-width:34rem;font-size:1.25rem}
.hero .callbig{font-family:var(--display);font-weight:700;font-size:clamp(2rem,4vw,2.8rem);color:var(--ember-d);text-decoration:none;letter-spacing:.02em}
.dial{position:relative;width:min(440px,86vw);margin:0 auto}
.dial svg.ring{position:absolute;inset:-34px;width:calc(100% + 68px);height:calc(100% + 68px);pointer-events:none}
.dial .arch{border-radius:999px 999px 8px 8px;overflow:hidden;aspect-ratio:2/3;background:var(--ice2);border:6px solid #fff;box-shadow:14px 14px 0 var(--ember)}
.dial .arch img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;display:block}
.dial .cap{position:absolute;left:-10px;bottom:28px;background:var(--ink);color:#fff;padding:.6rem 1rem;font-family:var(--display);text-transform:uppercase;letter-spacing:.08em;line-height:1.1}
.dial .cap small{display:block;color:var(--sun);font-size:.85rem;letter-spacing:.18em}
.hero .badge-bbb{display:inline-block;margin-top:1.4rem;font-family:var(--display);letter-spacing:.1em;text-transform:uppercase;font-weight:600;border:2px solid var(--teal);color:var(--teal);padding:.2rem .8rem}

/* temp ruler divider */
.ruler{height:54px;background:linear-gradient(90deg,var(--teal),#7fb8c9 35%,var(--sun) 70%,var(--ember));position:relative}
.ruler::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(255,255,255,.85) 0 2px,transparent 2px 20px) bottom/100% 18px no-repeat,repeating-linear-gradient(90deg,rgba(255,255,255,.85) 0 3px,transparent 3px 100px) bottom/100% 32px no-repeat}
.ruler span{position:absolute;top:6px;font-family:var(--display);font-weight:700;color:#fff;letter-spacing:.12em;font-size:1rem}
.ruler .l{left:16px}.ruler .r{right:16px}

/* services index */
.svc-list{border-top:3px solid var(--ink)}
.svc{display:grid;grid-template-columns:90px 1fr;gap:1.2rem 2rem;padding:1.8rem 0;border-bottom:1px solid rgba(10,52,69,.25);align-items:start}
.svc .temp{font-family:var(--display);font-weight:700;font-size:2.6rem;line-height:1}
.svc.heat .temp{color:var(--ember)}.svc.cool .temp{color:var(--teal)}.svc.air .temp{color:var(--sun)}
.svc h3{font-size:clamp(2rem,4.5vw,3.2rem);margin:0 0 .4rem}
.svc p{margin:0 0 .5rem;max-width:46rem}
.svc .tags{font-family:var(--display);letter-spacing:.1em;text-transform:uppercase;color:var(--teal);font-weight:600;font-size:.95rem}
.photo-offset{position:relative}
.photo-offset img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border:6px solid #fff;box-shadow:12px 12px 0 var(--teal)}

/* maintenance */
.maint{background:var(--ink);color:#fff}
.maint h2,.maint h3{color:#fff}
.price-card{background:#fff;color:var(--ink);padding:2rem;height:100%;border-top:8px solid var(--ember)}
.price-card.cool{border-top-color:var(--teal)}
.price-card h3{font-size:2rem;margin-bottom:1rem}
.price-row{display:flex;justify-content:space-between;gap:1rem;padding:.55rem 0;border-bottom:1px dashed rgba(10,52,69,.3)}
.price-row b{font-family:var(--display);font-size:1.6rem;color:var(--ember-d);line-height:1.1;white-space:nowrap}
.price-card.cool .price-row b{color:var(--teal)}
.check{list-style:none;padding:0;margin:0}
.check li{padding-left:1.8rem;position:relative;margin:.45rem 0}
.check li::before{content:"";position:absolute;left:0;top:.5em;width:.9rem;height:.5rem;border-left:3px solid var(--sun);border-bottom:3px solid var(--sun);transform:rotate(-45deg)}
.fine{font-size:.9rem;opacity:.85}

/* clients */
.clients{background:var(--ice)}
.chip{display:inline-block;margin:.25rem .2rem;padding:.4rem 1rem;background:#fff;border:2px solid var(--ink);font-family:var(--display);text-transform:uppercase;letter-spacing:.08em;font-weight:600;font-size:1.1rem}
.chip:nth-child(3n+1){border-color:var(--teal)}.chip:nth-child(3n+2){border-color:var(--ember)}

/* iaq */
.iaq .stat{font-family:var(--display);font-weight:700;font-size:4rem;color:var(--teal);line-height:1}
.resto{columns:2;column-gap:2rem;list-style:none;padding:0;margin:0}
.resto li{break-inside:avoid;padding:.6rem 0;border-bottom:1px solid rgba(10,52,69,.2)}
.resto b{font-family:var(--display);text-transform:uppercase;letter-spacing:.04em;font-size:1.25rem;display:block;line-height:1.1}
.resto span{font-size:.92rem;opacity:.8}
@media(max-width:575px){.resto{columns:1}}

/* about / team */
.fleet{position:relative;min-height:420px;background:var(--ink) url('img/fleet.webp') center/cover no-repeat}
.fleet::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(10,52,69,.85),rgba(10,52,69,0) 55%)}
.fleet .cap{position:absolute;z-index:2;left:0;right:0;bottom:24px;color:#fff;font-family:var(--display);text-transform:uppercase;letter-spacing:.08em;font-size:1.3rem}
.team-card img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:50% 25%;display:block;border-bottom:5px solid var(--ember)}
.team-card h4{font-size:1.6rem;margin:.8rem 0 .1rem}
.team-card .role{color:var(--teal);font-weight:600}
.team-card .ph{font-size:.95rem}
.team-card a{text-decoration:none;color:inherit}
.pillars .p{border-left:5px solid var(--ember);padding:.2rem 0 .2rem 1rem;margin-bottom:1.2rem}
.pillars h4{font-size:1.5rem;margin:0 0 .2rem}

/* area */
.area{background:var(--ice)}
.area img.map{width:100%;max-width:640px;display:block;margin:0 auto}
.towns{columns:3;list-style:none;padding:0;font-family:var(--display);text-transform:uppercase;letter-spacing:.06em;font-size:1.15rem;font-weight:600}
@media(max-width:575px){.towns{columns:2}}

/* testimonials */
.quote{font-size:clamp(1.4rem,3vw,2rem);font-family:var(--body);font-weight:600;line-height:1.35}
.quote-band{background:var(--teal);color:#fff}
.quote-band cite{display:block;margin-top:1rem;font-family:var(--display);font-style:normal;text-transform:uppercase;letter-spacing:.14em;font-size:1.1rem;color:var(--sun)}
.qmark{font-family:var(--display);font-size:8rem;line-height:.6;color:var(--sun);opacity:.8}

/* careers */
.jobs .job{background:#fff;border:2px solid var(--ink);padding:1.2rem 1.4rem;height:100%}
.jobs h4{font-size:1.5rem;margin:0 0 .3rem}
.benefit{font-family:var(--display);text-transform:uppercase;letter-spacing:.06em;font-size:1.2rem;font-weight:600;padding:.5rem 0;border-bottom:1px solid rgba(255,255,255,.25)}
.careers{background:var(--ink);color:#fff}
.careers h2,.careers h3{color:#fff}
.careers .job{color:var(--ink)}
.gal img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}

/* contact */
.contact .big{font-family:var(--display);font-weight:700;font-size:clamp(2.4rem,6vw,3.8rem);line-height:1;text-decoration:none;display:block;color:var(--ember-d)}
.contact .big.t{color:var(--teal)}
.contact .lbl{font-family:var(--display);letter-spacing:.18em;text-transform:uppercase;font-size:.9rem;font-weight:600;margin-top:1.2rem}
.contact iframe{width:100%;height:100%;min-height:340px;border:0;display:block}

/* footer */
footer{background:var(--ink);color:#cfe3ea;padding:56px 0 32px}
footer a{color:#fff}
.logo-chip{display:inline-block;background:#fff;padding:.5rem .8rem;border-radius:4px}
.logo-chip img{height:48px;width:auto;display:block}
.powered{font-size:.9rem;margin-top:2rem;border-top:1px solid rgba(255,255,255,.2);padding-top:1rem}

@media(max-width:767px){
  section{padding:64px 0}
  .svc{grid-template-columns:1fr;gap:.3rem}
  .hero{padding:48px 0 72px}
  .dial .cap{left:0}
  .dial .arch{box-shadow:8px 8px 0 var(--ember)}
  .navbar-brand{font-size:1.25rem}
}