:root{--burgundy:#a6082b;--burgundy-dark:#6f071f;--blue:#55afe0;--silver:#c9c9c9;--ink:#202638;--muted:#5f6673;--pale:#eef8fd;--white:#fff;--max:1200px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.55;background:#fff}a{color:inherit}.skip{position:absolute;left:-9999px}.skip:focus{left:12px;top:12px;z-index:100;background:#fff;padding:10px}
.site-header{background:#fff;position:relative;z-index:20;box-shadow:0 2px 12px rgba(20,30,45,.08)}.masthead{display:block;height:158px;background:url('assets/cityair-calgary-masthead-v15.png') center/cover no-repeat}.nav-row{min-height:72px;max-width:var(--max);margin:auto;padding:0 24px;display:flex;align-items:center;gap:28px}.emergency{text-decoration:none;font-weight:800;letter-spacing:.06em;white-space:nowrap}.emergency span{color:var(--burgundy);font-size:1.45rem;margin-right:8px}.nav{display:flex;align-items:center;gap:25px;margin-left:auto}.nav a{text-decoration:none;text-transform:uppercase;font-size:.78rem;font-weight:800;letter-spacing:.04em}.nav a:hover,.nav a:focus{color:var(--burgundy)}.request-link{background:var(--burgundy);color:#fff!important;padding:13px 18px}.menu-button{display:none;margin-left:auto;background:var(--burgundy);color:#fff;border:0;padding:13px 16px;font:inherit;font-weight:800}.trust-ribbon{display:block;text-align:center;text-decoration:none;text-transform:uppercase;letter-spacing:.11em;font-size:.78rem;font-weight:800;padding:10px 20px;background:var(--pale);border-top:1px solid #dcecf4;color:var(--ink)}.trust-ribbon:before,.trust-ribbon:after{content:"";display:inline-block;width:80px;height:2px;background:var(--burgundy);vertical-align:middle;margin:0 24px}
.hero{position:relative;min-height:510px;color:#fff;background:linear-gradient(90deg,rgba(103,5,30,.94) 0%,rgba(130,7,36,.78) 48%,rgba(74,2,19,.16) 100%),url('assets/calgary-hvac-hero.png') center/cover no-repeat}.hero-inner{max-width:var(--max);margin:auto;padding:70px 24px 78px}.eyebrow{margin:0 0 18px;text-transform:uppercase;letter-spacing:.2em;font-size:.78rem;font-weight:800}.eyebrow.dark{color:var(--burgundy)}h1,h2,h3{font-family:Georgia,'Times New Roman',serif}.hero h1{font-size:clamp(2.35rem,4.5vw,4rem);line-height:1.06;max-width:720px;margin:0 0 22px}.hero-copy{font-size:1.22rem;max-width:660px;margin:0}.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}.button{display:inline-flex;align-items:center;justify-content:center;background:var(--burgundy);border:2px solid var(--burgundy);color:#fff;text-decoration:none;text-transform:uppercase;font-weight:800;letter-spacing:.045em;padding:15px 24px}.button-light{background:#fff;color:var(--burgundy)}.button-outline{background:transparent;color:var(--burgundy)}
.proof{display:grid;grid-template-columns:repeat(4,1fr);max-width:var(--max);margin:auto;border-bottom:1px solid #dbe1e5}.proof a{padding:25px 24px;text-decoration:none;border-right:1px solid #dbe1e5}.proof a:last-child{border:0}.proof strong,.proof span{display:block}.proof strong{text-transform:uppercase;font-size:.86rem}.proof span{font-size:.85rem;color:var(--muted);margin-top:4px}.section{max-width:var(--max);margin:auto;padding:82px 24px}.section-heading{max-width:800px;margin-bottom:38px}.section h2,.page-hero h1{font-size:clamp(1.9rem,3.4vw,3rem);line-height:1.14;color:var(--burgundy-dark);margin:0 0 16px}.section-heading>p:last-child{color:var(--muted);font-size:1.08rem}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.service-card{border:1px solid #d6dce0;padding:28px;text-decoration:none;transition:.18s ease}.service-card:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(20,30,45,.1);border-color:var(--blue)}.service-card>span{color:var(--blue);font-weight:800}.service-card h3{font-size:1.45rem;color:var(--burgundy-dark);margin:14px 0 8px}.service-card p{color:var(--muted)}.service-card b{color:var(--burgundy);font-size:.88rem}.process-section{background:var(--pale)}.mini-process{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid #d9e7ef}.mini-process a{background:#fff;padding:27px;text-decoration:none;border-right:1px solid #d9e7ef}.mini-process a:last-child{border:0}.mini-process b,.mini-process strong,.mini-process span{display:block}.mini-process b{color:var(--blue);margin-bottom:20px}.mini-process strong{color:var(--burgundy-dark);font-family:Georgia,serif;font-size:1.16rem}.mini-process span{color:var(--muted);font-size:.9rem;margin-top:8px}.cta{display:flex;align-items:center;justify-content:space-between;gap:30px}.cta .section-heading{margin:0}.footer{background:var(--ink);color:#fff;padding:46px max(24px,calc((100vw - var(--max))/2));display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:30px}.footer strong{font-family:Georgia,serif;font-size:1.45rem}.footer p{color:#cbd0d8}.footer a{display:block;text-decoration:none;margin-bottom:6px}.footer nav{display:grid;grid-template-columns:1fr 1fr}.footer small{grid-column:1/-1;border-top:1px solid #444b5b;padding-top:16px;color:#aeb5c1}
/* Existing linked subpages */.topline{height:5px;background:var(--blue)}.header-inner{max-width:var(--max);margin:auto;min-height:82px;padding:0 24px;display:flex;align-items:center;gap:28px}.brand{display:flex;align-items:center;gap:12px;text-decoration:none}.brand-mark{width:45px;height:58px;background:url('assets/city-air-logo-original.png') center/cover no-repeat;font-size:0}.brand-name{font-family:Georgia,serif;font-weight:700;font-size:1.2rem}.brand-tag{display:block;color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.1em}.service-call{background:var(--burgundy);color:#fff!important;padding:12px 15px}.page-hero{background:var(--pale);border-bottom:1px solid #d7e4ea}.page-hero-inner{max-width:var(--max);margin:auto;padding:64px 24px}.page-hero p{max-width:760px;color:var(--muted);font-size:1.08rem}.detail-grid,.grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.detail,.card{border:1px solid #d7dde1;border-top:4px solid var(--burgundy);padding:28px;background:#fff}.detail h2,.detail h3,.card h3{color:var(--burgundy-dark)}.detail.full{grid-column:1/-1}.band{background:var(--pale)}.split,.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px}.feature-panel,.form{background:var(--pale);padding:34px}.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#d7e3e9}.process-step{background:#fff;padding:28px}.industries{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.industry{border:1px solid #d7dde1;padding:20px}.faq-list details{border-bottom:1px solid #d7dde1}.faq-list summary{cursor:pointer;padding:20px 40px 20px 0;font-family:Georgia,serif;font-weight:700}.faq-answer{color:var(--muted);padding-bottom:20px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.field{display:flex;flex-direction:column;gap:6px}.field.full{grid-column:1/-1}.field input,.field select,.field textarea{padding:12px;font:inherit;border:1px solid #aab4ba}.field textarea{min-height:120px}.notice{padding:20px;border-left:4px solid var(--blue);background:var(--pale)}
@media(max-width:900px){.masthead{height:210px;background-image:url('assets/cityair-calgary-masthead-v15.png');background-size:cover}.nav-row{min-height:88px}.menu-button{display:block}.nav{display:none;position:absolute;top:298px;left:0;right:0;background:#fff;padding:18px 24px;flex-direction:column;align-items:stretch;box-shadow:0 12px 20px rgba(0,0,0,.12)}.nav.open{display:flex}.trust-ribbon:before,.trust-ribbon:after{width:30px;margin:0 12px}.proof,.service-grid,.mini-process{grid-template-columns:1fr 1fr}.cta{align-items:flex-start;flex-direction:column}.header-inner .nav{top:82px}.split,.contact-grid{grid-template-columns:1fr}.process-grid,.industries{grid-template-columns:1fr 1fr}.footer{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.masthead{height:140px;background-image:url('assets/cityair-calgary-masthead-mobile-v15.png');background-size:auto 140px;background-position:center top}.nav-row{padding:0 18px}.emergency{font-size:.95rem}.menu-button{padding:13px}.nav{top:228px}.trust-ribbon{font-size:.7rem;padding:10px 12px}.trust-ribbon:before,.trust-ribbon:after{width:18px;margin:0 7px}.hero{min-height:760px;background-position:65% center}.hero-inner{padding:42px 22px 64px}.hero h1{font-size:2.05rem;line-height:1.12}.hero-copy{font-size:1.03rem}.hero-actions .button{flex:1;min-width:150px;padding:14px 13px}.proof,.service-grid,.mini-process,.detail-grid,.grid,.process-grid,.industries,.form-grid{grid-template-columns:1fr}.proof a{border-right:0;border-bottom:1px solid #dbe1e5}.section,.page-hero-inner{padding:58px 20px}.detail.full,.field.full{grid-column:auto}.footer{grid-template-columns:1fr;padding:40px 20px}.footer nav{grid-template-columns:1fr 1fr}.brand-tag{display:none}}

/* Branded loading transition and fixed Calgary hero */
.site-loader{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;background:#11151d;color:#fff;opacity:1;visibility:visible;transition:opacity .55s ease,visibility .55s ease}
.site-loader.is-loaded{opacity:0;visibility:hidden;pointer-events:none}
.loader-brand{display:grid;justify-items:center;gap:18px}
.loader-mark{position:relative;width:154px;height:154px;display:grid;place-items:center}
.loader-mark:before,.loader-mark:after{content:"";position:absolute;border-radius:50%;border:8px solid transparent}
.loader-mark:before{inset:0;border-top-color:var(--blue);border-left-color:var(--blue);animation:cityair-spin 1.15s linear infinite}
.loader-mark:after{inset:18px;border-right-color:var(--burgundy);border-bottom-color:var(--burgundy);animation:cityair-spin-reverse .9s linear infinite}
.loader-mark img{width:64px;height:92px;object-fit:contain;position:relative;z-index:1}
.loader-name{font-family:Georgia,'Times New Roman',serif;font-size:clamp(1.7rem,4vw,2.5rem);letter-spacing:.025em}
.loader-tag{margin-top:-10px;color:#c9c9c9;text-transform:uppercase;letter-spacing:.2em;font-size:.72rem;font-weight:800}
@keyframes cityair-spin{to{transform:rotate(360deg)}}
@keyframes cityair-spin-reverse{to{transform:rotate(-360deg)}}
body[data-page="home"]{background:#1a1d24 url('assets/calgary-hvac-hero.png') center center/cover fixed no-repeat}
body[data-page="home"] .hero{min-height:calc(100svh - 240px);display:flex;align-items:center;background:linear-gradient(90deg,rgba(103,5,30,.95) 0%,rgba(130,7,36,.78) 48%,rgba(74,2,19,.18) 100%)}
body[data-page="home"] .hero-inner{width:100%}
body[data-page="home"] .proof,body[data-page="home"] .section,body[data-page="home"] .process-section,body[data-page="home"] .footer{position:relative;z-index:1}
body[data-page="home"] .proof{background:#fff;box-shadow:0 -18px 36px rgba(10,18,28,.2)}
body[data-page="home"] .section{background:#fff}
body[data-page="home"] .process-section{background:var(--pale)}
body[data-page="home"] .process-section .section{background:transparent}
@media(max-width:620px){body[data-page="home"]{background-attachment:scroll;background-position:65% center}body[data-page="home"] .hero{min-height:calc(100svh - 228px);background:linear-gradient(90deg,rgba(103,5,30,.94),rgba(130,7,36,.68))}.loader-mark{width:132px;height:132px}.loader-mark img{width:56px;height:82px}}
@media(prefers-reduced-motion:reduce){.loader-mark:before,.loader-mark:after{animation:none}.site-loader{transition-duration:.15s}body[data-page="home"]{background-attachment:scroll}}

/* Fixed visual layer keeps the Calgary image anchored on mobile too. */
body[data-page="home"]{position:relative;background:#1a1d24}
.city-fixed-backdrop{position:fixed;inset:0;z-index:0;background:url('assets/calgary-hvac-hero.png') center center/cover no-repeat;pointer-events:none}
body[data-page="home"]> :not(.city-fixed-backdrop):not(.site-loader){position:relative;z-index:1}
@media(max-width:620px){.city-fixed-backdrop{background-position:65% center}}

/* Lighter tint and city-over-scroll treatment across the full site. */
body{position:relative;background:#1a1d24}
body> :not(.city-fixed-backdrop):not(.site-loader){position:relative;z-index:1}
body[data-page="home"] .hero{background:linear-gradient(90deg,rgba(103,5,30,.80) 0%,rgba(130,7,36,.58) 48%,rgba(74,2,19,.10) 100%)}
body:not([data-page="home"]) .page-hero{background:rgba(237,248,254,.68);backdrop-filter:blur(2px)}
body:not([data-page="home"]) main>.section{background:rgba(255,255,255,.75);box-shadow:0 18px 38px rgba(10,18,28,.14)}
body:not([data-page="home"]) main>.band{background:rgba(237,248,254,.92)}
body:not([data-page="home"]) main>.band>.section{background:transparent;box-shadow:none}
@media(max-width:620px){body[data-page="home"] .hero{background:linear-gradient(90deg,rgba(103,5,30,.78),rgba(130,7,36,.54))}body:not([data-page="home"]) .page-hero{background:rgba(237,248,254,.66)}body:not([data-page="home"]) main>.section{background:rgba(255,255,255,.74)}}

/* Shorter floating panels reveal the burgundy Calgary backdrop between sections. */
.city-fixed-backdrop:after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(103,5,30,.272),rgba(166,8,43,.16) 55%,rgba(55,4,18,.096))}
main{padding-bottom:1px}
body[data-page="home"] .proof{margin:30px auto;background:rgba(255,255,255,.76)}
body[data-page="home"] main>.section{margin:34px auto;padding:54px 34px;background:rgba(255,255,255,.76);box-shadow:0 18px 38px rgba(10,18,28,.18)}
body[data-page="home"] .process-section{margin:34px 0;padding:0;background:transparent}
body[data-page="home"] .process-section>.section{margin:0 auto;padding:54px 34px;background:rgba(237,248,254,.75)}
body:not([data-page="home"]) .page-hero{margin-bottom:30px}
body:not([data-page="home"]) .page-hero-inner{padding-top:46px;padding-bottom:46px}
body:not([data-page="home"]) main>.section{margin:30px auto;padding:50px 34px}
body:not([data-page="home"]) main>.band{margin:30px 0;padding:0;background:transparent}
body:not([data-page="home"]) main>.band>.section{margin:0 auto;padding:50px 34px;background:rgba(237,248,254,.74);box-shadow:0 18px 38px rgba(10,18,28,.14)}
@media(max-width:620px){body[data-page="home"] .proof{margin:18px 0}body[data-page="home"] main>.section{margin:18px 0;padding:38px 20px}body[data-page="home"] .process-section{margin:18px 0}body[data-page="home"] .process-section>.section{padding:38px 20px}body:not([data-page="home"]) .page-hero{margin-bottom:18px}body:not([data-page="home"]) .page-hero-inner{padding:36px 20px}body:not([data-page="home"]) main>.section{margin:18px 0;padding:38px 20px}body:not([data-page="home"]) main>.band{margin:18px 0}body:not([data-page="home"]) main>.band>.section{padding:38px 20px}}

/* Translucent white content cards reveal the fixed Calgary image. */
.mini-process a,.detail,.card,.process-step{background:rgba(255,255,255,.80)}

/* Calgary date, time and weather widget. */
body>.weather-widget.weather-widget{position:fixed;right:18px;top:18px;bottom:auto;z-index:60;width:min(340px,calc(100vw - 36px));color:#fff;background:rgba(32,38,56,.95);border:1px solid rgba(255,255,255,.22);box-shadow:0 14px 40px rgba(0,0,0,.28);backdrop-filter:blur(12px)}
.weather-toggle{display:none;width:100%;border:0;background:transparent;color:#fff;padding:12px 14px;align-items:center;gap:10px;font:inherit;text-align:left}
.weather-toggle-place{font-weight:800;text-transform:uppercase;letter-spacing:.08em;font-size:.76rem}
.weather-toggle-summary{margin-left:auto;font-family:Georgia,'Times New Roman',serif;font-size:1.08rem;font-weight:700}
.weather-chevron{font-size:1.1rem;transition:transform .2s ease}
.weather-panel{padding:16px 18px 14px}
.weather-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.18)}
.weather-heading strong,.weather-heading span{display:block}
.weather-heading strong{text-transform:uppercase;letter-spacing:.1em;font-size:.73rem;color:#8fd1f3}
.weather-date{color:#d8dde5;font-size:.8rem;margin-top:3px}
.weather-time{font-family:Georgia,'Times New Roman',serif;font-size:1.35rem;font-weight:700;white-space:nowrap}
.weather-current{display:flex;align-items:center;gap:12px;padding:14px 0}
.weather-icon{font-size:2rem;line-height:1}
.weather-current strong,.weather-current span{display:block}
.weather-temp{font-family:Georgia,'Times New Roman',serif;font-size:1.65rem}
.weather-label{font-size:.8rem;color:#d8dde5}
.weather-details{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0}
.weather-details>div{background:rgba(255,255,255,.09);padding:9px 10px}
.weather-details dt{font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;color:#bfc7d2}
.weather-details dd{margin:2px 0 0;font-weight:800;font-size:.92rem}
.weather-note{margin:8px 0 0;color:#aeb8c5;font-size:.66rem;text-align:right}
.weather-widget[data-state="error"] .weather-details{display:none}
@media(max-width:620px){
  body>.weather-widget.weather-widget{right:10px;top:10px;bottom:auto;width:min(280px,calc(100vw - 20px))}
  .weather-toggle{display:flex}
  .weather-widget.is-collapsed .weather-panel{display:none}
  .weather-widget:not(.is-collapsed) .weather-chevron{transform:rotate(180deg)}
}
@media(prefers-reduced-motion:reduce){.weather-chevron{transition:none}}

/* Slim floating weather chyron. */
body>.weather-widget.weather-widget{position:fixed!important;top:18px!important;right:18px!important;bottom:auto!important;left:auto!important;z-index:100!important;width:auto!important;max-width:calc(100vw - 36px);border-radius:999px;background:rgba(255,255,255,.84);color:var(--ink);border-color:rgba(166,8,43,.18);box-shadow:0 8px 24px rgba(20,30,45,.14)}
.weather-line{display:flex;align-items:center;gap:9px;min-height:42px;padding:8px 15px;white-space:nowrap;font-size:.76rem}
.weather-place{text-transform:uppercase;letter-spacing:.1em;color:#8fd1f3}
.weather-date{color:var(--muted)}
.weather-divider{width:1px;height:18px;background:rgba(32,38,56,.22)}
.weather-line .weather-icon{font-size:1.15rem;line-height:1}
.weather-line .weather-temp{font-family:Georgia,'Times New Roman',serif;font-size:1rem}
.weather-line .weather-label{color:var(--muted)}
.weather-line .weather-humidity,.weather-line .weather-pressure{font-size:.8rem}
.weather-widget[data-state="error"] .weather-line>:not(.weather-place):not(.weather-label){display:none}
@media(max-width:620px){
  body>.weather-widget.weather-widget{right:10px!important;top:10px!important;bottom:auto!important;width:auto!important;max-width:calc(100vw - 20px)}
  .weather-line{min-height:40px;padding:7px 12px;gap:7px;font-size:.7rem}
  .weather-line .weather-date,.weather-line .weather-label{display:none}
}

/* Remove the coloured rule above the banner image. */
.topline{display:none}

/* Lift the tower mark higher into the banner's white space. */
.masthead{position:relative;overflow:visible}
.masthead:after{content:"";position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:157px;height:178px;background:url('assets/city-air-logo-modern-white-desktop.png') center bottom/contain no-repeat;pointer-events:none;z-index:2}
@media(max-width:620px){.masthead:after{width:154px;height:175px;background-image:url('assets/city-air-logo-modern-white-mobile.png')}}

/* Rebuilt clean masthead: one skyline layer and one exact logo layer. */
.masthead{background-image:url('assets/cityair-calgary-masthead-clean-v34.png')}
@media(max-width:620px){.masthead{background-image:url('assets/cityair-calgary-masthead-mobile-clean-v34.png')}}

/* Approved v35 banner is the first visible site element. The logo, white cap,
   skyline, blue rule and cast shadow are one locked image, preventing any
   lower page layer from showing through above it. */
html,body{margin:0;padding:0}
.site-header{margin:0;padding:0}
.masthead{
  height:clamp(158px,17.95vw,300px);
  background:#fff url('assets/city-air-banner-approved-desktop-v35.jpg') center top/cover no-repeat;
  overflow:hidden;
}
.masthead:after{content:none}
@media(max-width:620px){
  .masthead{
    height:42.97vw;
    min-height:220px;
    max-height:440px;
    background-image:url('assets/city-air-banner-approved-v35.jpg');
    background-size:cover;
    background-position:center top;
  }
}

/* v36: keep the weather chyron clear of the masthead and deliberately
   colour the otherwise exposed fixed-background strip above it black. */
.city-fixed-backdrop:before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:56px;
  background:#000;
}
body>.weather-widget.weather-widget{
  top:auto!important;
  right:18px!important;
  bottom:18px!important;
  left:auto!important;
}
@media(max-width:620px){
  body>.weather-widget.weather-widget{
    top:auto!important;
    right:10px!important;
    bottom:10px!important;
    left:10px!important;
    width:auto!important;
    max-width:none;
  }
  .weather-line{justify-content:center;overflow:hidden}
}
