/* ============================================================
   ALEXPRAV LLC — Philadelphia mechanical & construction
   Palette + concept derived from the company's own brand assets:
     · the "fire and ice" HVAC card  → ice-cyan ↔ ember-amber on near-black
     · the brushed plaque logo       → brass, reserved for the pools tier
   ============================================================ */

/* === defensive base — injected by harden_css.py; do not hand-edit === */
*, *::before, *::after { box-sizing: border-box; min-width: 0; }
html { scroll-padding-top: calc(var(--nav-h, 72px) + 1rem); }
img, svg, video, iframe, canvas, table { display: block; max-width: 100%; }
p, li, h1, h2, h3, h4, blockquote, td, dd, dt { overflow-wrap: anywhere; }
/* === end defensive base === */

:root{
  --ink:      #08090C;
  --ink-2:    #0D1015;
  --ink-3:    #13171E;
  --ink-4:    #1B212A;
  --line:     #242C38;

  --chalk:    #EEF2F6;
  --steel:    #99A3B2;
  --steel-dk: #6B7684;

  --ice:      #5CC9F0;
  --ice-dk:   #2A93C4;
  --ember:    #FF7A2E;
  --ember-dk: #D9541A;
  --brass:    #C9A24B;
  --brass-lt: #E7D19A;

  --nav-h: 4.25rem;
  --wrap: 76rem;
  --pad: clamp(1.15rem, 4vw, 2.5rem);

  --f-disp: "Big Shoulders Display", "Arial Narrow", sans-serif;
  --f-body: "Archivo", system-ui, sans-serif;
  --f-ser:  "Bodoni Moda", Georgia, serif;

  --r: 3px;
  --ease: cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{ box-sizing:border-box; }

html{ -webkit-text-size-adjust:100%; }

body{
  margin:0;
  background:var(--ink);
  color:var(--chalk);
  font-family:var(--f-body);
  font-size:clamp(.97rem,.93rem + .18vw,1.06rem);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

/* blueprint grid + grain over the whole page ------------------ */
body::before{
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size:88px 88px;
  opacity:.28;
  mask-image:radial-gradient(ellipse 120% 80% at 50% 0%, #000 30%, transparent 78%);
}
body::after{
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none; opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}
main,.nav,.foot{ position:relative; z-index:1; }

img,svg,video{ max-width:100%; height:auto; display:block; }
a{ color:inherit; }

.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--pad); }

.skip{
  position:absolute; left:.5rem; top:.5rem; z-index:99;
  width:1px; height:1px; padding:0; overflow:hidden;
  clip-path:inset(50%); white-space:nowrap;
  background:var(--ember); color:#160A02; font-weight:700;
  border-radius:var(--r); text-decoration:none;
}
.skip:focus{
  width:auto; height:auto; padding:.7rem 1.1rem; clip-path:none;
}

:focus-visible{ outline:2px solid var(--ice); outline-offset:3px; }

/* ---------------- type ---------------- */
h1,h2,h3{
  font-family:var(--f-disp);
  font-weight:700;
  line-height:.94;
  letter-spacing:.004em;
  text-transform:uppercase;
  margin:0;
}

.eyebrow{
  display:flex; align-items:center; gap:.55rem;
  font-family:var(--f-body);
  font-size:.7rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
  color:var(--steel); margin:0;
}
.eyebrow__dot{
  width:.42rem; height:.42rem; flex:none; border-radius:50%;
  background:var(--ember); box-shadow:0 0 0 3px rgba(255,122,46,.16);
}
.eyebrow--brass{ color:var(--brass-lt); }
.eyebrow--brass .eyebrow__dot{ background:var(--brass); box-shadow:0 0 0 3px rgba(201,162,75,.18); }

.ice{ color:var(--ice); }
.hot{ color:var(--ember); }

/* ---------------- buttons ---------------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.82rem 1.35rem;
  font-family:var(--f-body); font-size:.83rem; font-weight:700;
  letter-spacing:.09em; text-transform:uppercase; text-decoration:none;
  border-radius:var(--r); border:1px solid transparent;
  transition:transform .2s var(--ease), background-color .2s, border-color .2s, color .2s, box-shadow .2s;
  cursor:pointer; text-align:center;
}
.btn--lg{ padding:1rem 1.7rem; font-size:.87rem; }

.btn--ember{
  background:linear-gradient(180deg,var(--ember),var(--ember-dk));
  color:#160A02;
  box-shadow:0 1px 0 rgba(255,255,255,.22) inset, 0 8px 22px -12px rgba(255,122,46,.9);
}
.btn--ember:hover{ transform:translateY(-2px); box-shadow:0 1px 0 rgba(255,255,255,.28) inset, 0 14px 30px -12px rgba(255,122,46,1); }

.btn--brass{
  background:linear-gradient(180deg,var(--brass-lt),var(--brass));
  color:#1B1405;
  box-shadow:0 1px 0 rgba(255,255,255,.3) inset, 0 8px 22px -12px rgba(201,162,75,.85);
}
.btn--brass:hover{ transform:translateY(-2px); }

.btn--ghost{
  border-color:var(--line); color:var(--chalk); background:rgba(255,255,255,.02);
}
.btn--ghost:hover{ border-color:var(--ice); color:var(--ice); transform:translateY(-2px); }

/* ---------------- nav ---------------- */
.nav{
  position:sticky; top:0; z-index:50;
  height:var(--nav-h);
  background:rgba(8,9,12,.82);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.nav__in{ height:100%; display:flex; align-items:center; justify-content:space-between; gap:1rem; }

.brand{ display:flex; align-items:center; gap:.6rem; text-decoration:none; min-width:0; }
.brand__mark{ width:1.85rem; flex:none; fill:var(--brass); }
.brand__txt{ display:flex; flex-direction:column; line-height:1; min-width:0; }
.brand__name{
  font-family:var(--f-ser); font-size:1.02rem; font-weight:600;
  letter-spacing:.06em; color:var(--chalk); white-space:nowrap;
}
.brand__name em{ font-style:normal; color:var(--brass); margin-left:.34em; font-size:.8em; letter-spacing:.1em; }
.brand__sub{
  font-size:.56rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--steel-dk); margin-top:.28rem; white-space:nowrap;
}

.nav__links{ display:flex; align-items:center; gap:1.5rem; }
.nav__links a{
  text-decoration:none; font-size:.79rem; font-weight:600;
  letter-spacing:.11em; text-transform:uppercase; color:var(--steel);
  transition:color .2s;
}
.nav__links a:hover{ color:var(--chalk); }
.nav__cta{ color:#160A02 !important; }

.burger{
  display:none; width:2.6rem; height:2.6rem; padding:0;
  background:none; border:1px solid var(--line); border-radius:var(--r);
  flex-direction:column; align-items:center; justify-content:center; gap:.28rem; cursor:pointer;
}
.burger span{ width:1.05rem; height:1.5px; background:var(--chalk); transition:transform .25s, opacity .2s; }
.burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(.43rem) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-.43rem) rotate(-45deg); }

/* ---------------- hero ---------------- */
.hero{
  position:relative;
  min-height:calc(100svh - var(--nav-h));
  display:flex; align-items:center;
  padding-block:clamp(1.5rem,4vh,3rem);
  overflow-x:clip;              /* the thermal glows bleed on purpose */
}
.hero__bg{
  position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(60rem 40rem at 8% 4%,  rgba(92,201,240,.20), transparent 62%),
    radial-gradient(52rem 38rem at 96% 92%, rgba(255,122,46,.22), transparent 60%),
    radial-gradient(40rem 30rem at 60% 50%, rgba(201,162,75,.06), transparent 70%);
}
.hero__grid{
  display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  gap:clamp(1.6rem,4vw,3.5rem); align-items:center;
}

.hero__copy{
  container-type:inline-size;      /* children size in cqi → can't overflow the column */
  display:flex; flex-direction:column;
  gap:clamp(.7rem,2.2cqi,1.35rem);
  min-width:0;
}
.hero__title{
  font-size:clamp(2.05rem,11cqi,5.1rem);
  line-height:.9;
  letter-spacing:-.005em;
  text-wrap:balance;
}
.hero__sub{
  margin:0; color:var(--steel);
  font-size:clamp(.95rem,3.1cqi,1.1rem);
  max-width:46ch;
}
.hero__cta{ display:flex; flex-wrap:wrap; gap:.7rem; }

.hero__proof{
  list-style:none; margin:0; padding:0;
  display:flex; flex-wrap:wrap; gap:.5rem 1.4rem;
  font-size:.74rem; letter-spacing:.1em; text-transform:uppercase; color:var(--steel-dk);
}
.hero__proof li{ display:flex; align-items:baseline; gap:.4rem; }
.hero__proof strong{ font-family:var(--f-disp); font-size:1.15rem; color:var(--chalk); letter-spacing:.02em; }

/* hero thermal card */
.tcard{
  position:relative;
  background:linear-gradient(165deg, rgba(27,33,42,.92), rgba(13,16,21,.92));
  border:1px solid var(--line); border-radius:var(--r);
  padding:1.5rem 1.4rem 1.35rem;
  overflow:hidden;
  box-shadow:0 30px 60px -40px #000;
}
.tcard__rail{
  position:absolute; left:0; top:0; bottom:0; width:3px;
  background:linear-gradient(180deg,var(--ice),var(--brass) 52%,var(--ember));
}
.tcard__label{
  margin:0 0 .9rem; font-size:.64rem; font-weight:700;
  letter-spacing:.2em; text-transform:uppercase; color:var(--steel-dk);
}
.tcard__list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.62rem; }
.tcard__list li{
  font-size:.86rem; color:var(--steel); line-height:1.4;
  padding-bottom:.62rem; border-bottom:1px solid rgba(36,44,56,.7);
}
.tcard__list li:last-child{ border-bottom:0; padding-bottom:0; }
.tcard__list span{ font-weight:700; }
.tcard__foot{
  margin:1rem 0 0; font-size:.72rem; letter-spacing:.09em; text-transform:uppercase;
  color:var(--brass-lt);
}

/* ---------------- generic section ---------------- */
.sec{ padding-block:clamp(4rem,10vh,7.5rem); }
.sec__head{ max-width:44rem; margin-bottom:clamp(2rem,5vh,3.25rem); display:flex; flex-direction:column; gap:1rem; }
.sec__head--center{ margin-inline:auto; text-align:center; align-items:center; }
.sec__title{ font-size:clamp(1.9rem,5.2vw,3.5rem); }
.sec__lede{ margin:0; color:var(--steel); max-width:52ch; }

.grid{ display:grid; gap:1px; }
/* 6 services — pinned to 3 cols so the row never leaves an empty grey cell */
.grid--svc{
  grid-template-columns:repeat(3,minmax(0,1fr));
  background:var(--line); border:1px solid var(--line);
}
@media (max-width:64rem){ .grid--svc{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:44rem){ .grid--svc{ grid-template-columns:1fr; } }

/* services */
.svc{
  background:var(--ink-2);
  padding:clamp(1.5rem,3vw,2.1rem);
  display:flex; flex-direction:column; gap:.55rem;
  position:relative; transition:background-color .3s;
  min-width:0;
}
.svc:hover{ background:var(--ink-3); }
.svc__idx{
  font-family:var(--f-disp); font-size:.85rem; letter-spacing:.14em; color:var(--ember);
}
.svc__name{ font-size:clamp(1.4rem,2.6vw,1.85rem); }
.svc__ru{
  margin:0; font-size:.74rem; letter-spacing:.08em; color:var(--steel-dk);
  text-transform:none;
}
.svc__txt{ margin:.3rem 0 0; color:var(--steel); font-size:.92rem; }
.svc__cta{
  margin-top:auto; padding-top:1.1rem;
  font-size:.75rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--chalk); text-decoration:none; transition:color .2s, gap .2s;
  display:inline-flex; gap:.45rem; align-items:center;
}
.svc__cta:hover{ color:var(--ember); gap:.75rem; }
.svc--brass .svc__idx{ color:var(--brass); }
.svc--brass .svc__cta:hover{ color:var(--brass-lt); }

/* ---------------- stats ---------------- */
.stats{
  border-block:1px solid var(--line);
  background:linear-gradient(90deg, rgba(92,201,240,.05), rgba(255,122,46,.05));
}
.stats__grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,10rem),1fr));
  gap:clamp(1.5rem,4vw,2rem);
  padding-block:clamp(2.2rem,5vh,3rem);
}
.stat{ display:flex; flex-direction:column; gap:.3rem; min-width:0; }
.stat__n{
  font-family:var(--f-disp); font-weight:700; line-height:1;
  font-size:clamp(2.1rem,5vw,3.1rem); color:var(--chalk);
}
.stat__l{ font-size:.72rem; letter-spacing:.13em; text-transform:uppercase; color:var(--steel-dk); }

/* ---------------- pools (brass tier) ---------------- */
.sec--pools{
  background:
    radial-gradient(50rem 34rem at 88% 30%, rgba(201,162,75,.10), transparent 62%),
    var(--ink-2);
  border-bottom:1px solid var(--line);
  overflow-x:clip;
}
.pools__grid{
  display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:clamp(2rem,5vw,4rem); align-items:center;
}
.pools__copy{ display:flex; flex-direction:column; gap:1.1rem; min-width:0; }
.pools__title{ font-size:clamp(2rem,5.4vw,3.6rem); color:var(--brass-lt); }
.pools__lede{ margin:0; color:var(--steel); max-width:48ch; }
.pools__list{
  list-style:none; margin:.2rem 0 0; padding:0;
  display:flex; flex-direction:column; gap:.6rem;
}
.pools__list li{
  position:relative; padding-left:1.5rem; font-size:.92rem; color:var(--chalk);
}
.pools__list li::before{
  content:""; position:absolute; left:0; top:.62em;
  width:.55rem; height:1px; background:var(--brass);
}
.pools__cta{ display:flex; flex-wrap:wrap; gap:.7rem; margin-top:.5rem; }
.pools__note{ margin:0; font-size:.78rem; color:var(--steel-dk); }
.pools__note a{ color:var(--brass-lt); text-decoration:none; white-space:nowrap; }
.pools__note a:hover{ text-decoration:underline; }

.pools__plaque{ display:flex; justify-content:center; min-width:0; }
.plaque{
  width:min(100%,22rem); aspect-ratio:4/3;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.5rem;
  padding:2rem 1.5rem;
  background:linear-gradient(150deg,#8A7133,#D9BC72 28%,#F0E0B4 44%,#C9A24B 62%,#7C6329);
  border-radius:var(--r);
  box-shadow:0 40px 70px -45px #000, 0 0 0 1px rgba(255,255,255,.14) inset;
  transform:rotate(-1.4deg);
}
.plaque__mark{ width:3.4rem; fill:#3A2E0F; opacity:.9; }
.plaque__name{
  margin:0; font-family:var(--f-ser); font-size:clamp(1.05rem,3.6vw,1.5rem); font-weight:600;
  letter-spacing:.08em; color:#2E2409; text-align:center;
}
.plaque__sub{
  margin:0; font-size:.66rem; letter-spacing:.24em; text-transform:uppercase; color:#4A3B12;
}

/* ---------------- process ---------------- */
.steps{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr));
  gap:clamp(1.5rem,3vw,2.25rem);
}
.step{ display:flex; flex-direction:column; gap:.5rem; min-width:0; padding-top:1.1rem; border-top:1px solid var(--line); }
.step__n{
  font-family:var(--f-disp); font-size:2.4rem; line-height:1; color:var(--ice); opacity:.85;
}
.step__h{ font-size:1.15rem; }
.step p{ margin:0; color:var(--steel); font-size:.9rem; }

/* ---------------- service area ---------------- */
.sec--area{ background:var(--ink-2); border-top:1px solid var(--line); }
.area__grid{
  display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
  gap:clamp(2rem,5vw,4rem); align-items:center;
}
.area__copy{ display:flex; flex-direction:column; gap:1.1rem; min-width:0; }
.area__txt{ margin:0; color:var(--steel); max-width:50ch; }
.area__facts{ margin:.4rem 0 0; display:flex; flex-direction:column; gap:0; }
.area__facts div{
  display:flex; flex-wrap:wrap; gap:.4rem 1rem; justify-content:space-between;
  padding:.72rem 0; border-bottom:1px solid var(--line);
}
.area__facts dt{ font-size:.72rem; letter-spacing:.13em; text-transform:uppercase; color:var(--steel-dk); }
.area__facts dd{ margin:0; font-size:.92rem; font-weight:500; }
.area__facts a{ color:var(--ice); text-decoration:none; }
.area__facts a:hover{ text-decoration:underline; }

.area__panel{
  background:var(--ink-3); border:1px solid var(--line); border-radius:var(--r);
  padding:clamp(1.6rem,3.5vw,2.4rem);
  display:flex; flex-direction:column; gap:1.1rem; min-width:0;
}
.thermo{ display:flex; align-items:center; gap:.75rem; font-size:.62rem; letter-spacing:.22em; }
.thermo__ice{ color:var(--ice); }
.thermo__hot{ color:var(--ember); }
.thermo__bar{ flex:1; height:2px; background:linear-gradient(90deg,var(--ice),var(--brass),var(--ember)); }
.area__pull{
  margin:0; font-family:var(--f-ser); font-size:clamp(1.1rem,2.6vw,1.5rem);
  line-height:1.35; color:var(--chalk);
}
.area__attr{ margin:0; font-size:.72rem; letter-spacing:.13em; text-transform:uppercase; color:var(--steel-dk); }

/* ---------------- final CTA ---------------- */
.cta{ position:relative; padding-block:clamp(4rem,11vh,7rem); overflow-x:clip; text-align:center; }
.cta__bg{
  position:absolute; inset:0; z-index:-1;
  background:
    radial-gradient(44rem 26rem at 20% 100%, rgba(92,201,240,.16), transparent 62%),
    radial-gradient(44rem 26rem at 80% 0%,  rgba(255,122,46,.20), transparent 62%);
}
.cta__in{ display:flex; flex-direction:column; align-items:center; gap:1.1rem; }
.cta__title{ font-size:clamp(2.1rem,6.5vw,4.2rem); }
.cta__sub{ margin:0; color:var(--steel); max-width:44ch; }
.cta__row{ display:flex; flex-wrap:wrap; gap:.75rem; justify-content:center; }
.cta__alt{ margin:.35rem 0 0; font-size:.83rem; color:var(--steel-dk); }
.cta__alt a{ color:var(--ice); text-decoration:none; }
.cta__alt a:hover{ text-decoration:underline; }

/* ---------------- footer ---------------- */
.foot{ border-top:1px solid var(--line); background:var(--ink-2); }
.foot__grid{
  display:grid; grid-template-columns:minmax(0,1.4fr) repeat(2,minmax(0,1fr));
  gap:clamp(1.75rem,4vw,3rem);
  padding-block:clamp(2.5rem,6vh,4rem);
}
.foot__brand .brand__mark{ width:2.1rem; fill:var(--brass); margin-bottom:.9rem; }
.foot__name{ margin:0; font-family:var(--f-ser); font-size:1.15rem; letter-spacing:.08em; }
.foot__tag{ margin:.5rem 0 0; font-size:.82rem; color:var(--steel-dk); line-height:1.7; }
.foot__col{ display:flex; flex-direction:column; gap:.55rem; min-width:0; }
.foot__col h3{
  font-family:var(--f-body); font-size:.68rem; font-weight:700;
  letter-spacing:.18em; color:var(--steel-dk); margin-bottom:.35rem;
}
.foot__col a{ font-size:.86rem; color:var(--steel); text-decoration:none; transition:color .2s; }
.foot__col a:hover{ color:var(--chalk); }
.foot__bar{
  display:flex; flex-wrap:wrap; gap:.5rem 1.5rem; justify-content:space-between;
  padding-block:1.3rem; border-top:1px solid var(--line);
  font-size:.74rem; color:var(--steel-dk);
}
.foot__bar p{ margin:0; }

/* ---------------- scroll reveal (below the fold only) ---------------- */
.reveal{ opacity:0; transform:translateY(20px); transition:opacity .75s var(--ease), transform .75s var(--ease); }
.reveal.in{ opacity:1; transform:none; }

/* ---------------- responsive ---------------- */
@media (max-width:56rem){
  .foot__grid{ grid-template-columns:1fr 1fr; }
  .foot__brand{ grid-column:1 / -1; }
}

@media (max-width:52rem){
  .nav__links{
    display:none;                       /* actually hidden, not just [hidden] */
    position:absolute; left:0; right:0; top:var(--nav-h);
    flex-direction:column; align-items:stretch; gap:0;
    background:var(--ink-2); border-bottom:1px solid var(--line);
    padding:.5rem var(--pad) 1.25rem;
    box-shadow:0 24px 40px -30px #000;
  }
  .nav__links.is-open{ display:flex; }
  .nav__links a{ padding:.85rem 0; border-bottom:1px solid var(--line); font-size:.85rem; }
  .nav__cta{ margin-top:.9rem; border-bottom:0 !important; }
  .burger{ display:flex; }

  .hero__grid{ grid-template-columns:1fr; gap:1.6rem; }
  .pools__grid,.area__grid{ grid-template-columns:1fr; }
  .pools__plaque{ order:-1; }
  .plaque{ width:min(100%,20rem); }
}

@media (max-width:34rem){
  .hero__cta .btn{ width:100%; }
  .hero__proof{ gap:.4rem 1.1rem; }
  .foot__grid{ grid-template-columns:1fr; }
  .foot__bar{ flex-direction:column; }
}

/* short viewports — keep the hero core above the fold */
@media (max-height:44rem) and (min-width:52rem){
  .hero__title{ font-size:clamp(1.9rem,8.2cqi,3.4rem); }
  .hero__copy{ gap:.65rem; }
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important; scroll-behavior:auto !important;
  }
  .reveal{ opacity:1; transform:none; }
}

/* ============================================================
   CONTACT PAGE
   ============================================================ */

.sr-only{
  position:absolute !important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0;
}
.is-gone{ display:none !important; }

.chero{
  position:relative; overflow-x:clip;
  padding-block:clamp(3rem,9vh,5.5rem) clamp(2rem,5vh,3rem);
}
.chero__bg{
  position:absolute; inset:0; z-index:-1;
  background:
    radial-gradient(46rem 28rem at 6% 0%, rgba(92,201,240,.18), transparent 62%),
    radial-gradient(40rem 26rem at 94% 90%, rgba(255,122,46,.16), transparent 62%);
}
/* NB: this element also carries .wrap — capping its width here would override
   .wrap's 76rem and re-centre the block, indenting it away from the form below.
   Cap the children instead. */
.chero__in{ display:flex; flex-direction:column; gap:1rem; }
.chero__title{ max-width:20ch; }
.chero__title{ font-size:clamp(2.1rem,7vw,4rem); }
.chero__sub{ margin:0; color:var(--steel); max-width:46ch; }

.sec--contact{ padding-top:clamp(1.5rem,4vh,2.5rem); }
.contact__grid{
  display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  gap:clamp(2rem,5vw,4rem); align-items:start;
}
.contact__form-col{ min-width:0; }
.contact__h2{ font-size:clamp(1.7rem,4.4vw,2.6rem); }
.contact__lede{ margin:.85rem 0 1.9rem; color:var(--steel); max-width:44ch; }

#estimate-form{ display:flex; flex-direction:column; gap:1.15rem; }

.field{ display:flex; flex-direction:column; gap:.45rem; min-width:0; }
.field label{
  font-size:.72rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
  color:var(--steel);
}
.field input,
.field textarea{
  width:100%; min-width:0;
  font-family:var(--f-body); font-size:.95rem; color:var(--chalk);
  background:var(--ink-2);
  border:1px solid var(--line); border-radius:var(--r);
  padding:.85rem .95rem;
  transition:border-color .2s, background-color .2s, box-shadow .2s;
}
.field textarea{ resize:vertical; min-height:7.5rem; line-height:1.6; }
.field input::placeholder,
.field textarea::placeholder{ color:#4E5866; }
.field input:focus,
.field textarea:focus{
  outline:none; border-color:var(--ice); background:var(--ink-3);
  box-shadow:0 0 0 3px rgba(92,201,240,.14);
}
.field input:user-invalid,
.field textarea:user-invalid{ border-color:var(--ember-dk); }
.field__hint{ margin:.1rem 0 0; font-size:.74rem; color:var(--steel-dk); }

.btn--block{ width:100%; }
.btn:disabled{ opacity:.85; cursor:default; transform:none !important; }

.form-status{
  margin:0; padding:.95rem 1.1rem; border-radius:var(--r);
  font-size:.9rem; line-height:1.5; border:1px solid var(--line);
  background:var(--ink-2);
}
.form-status.is-ok{
  display:block; border-color:rgba(92,201,240,.5); background:rgba(92,201,240,.08); color:var(--chalk);
}
.form-status.is-err{
  display:block; border-color:rgba(255,122,46,.55); background:rgba(255,122,46,.09); color:var(--chalk);
}
.form-status a{ color:var(--ice); }
.form-fine{ margin:0; font-size:.74rem; color:var(--steel-dk); }

.contact__aside{ display:flex; flex-direction:column; gap:1.1rem; min-width:0; }
.ccard{
  position:relative; overflow:hidden;
  background:linear-gradient(165deg, rgba(27,33,42,.92), rgba(13,16,21,.92));
  border:1px solid var(--line); border-radius:var(--r);
  padding:clamp(1.5rem,3vw,2rem);
}
.ccard__h{ font-size:1.4rem; margin-bottom:1.1rem; }
.ccard__list{ margin:0; display:flex; flex-direction:column; gap:0; }
.ccard__list div{ padding:.85rem 0; border-bottom:1px solid rgba(36,44,56,.75); }
.ccard__list div:last-child{ border-bottom:0; padding-bottom:0; }
.ccard__list dt{
  font-size:.66rem; letter-spacing:.15em; text-transform:uppercase; color:var(--steel-dk);
  margin-bottom:.3rem;
}
.ccard__list dd{ margin:0; font-size:.95rem; font-weight:500; }
.ccard__list a{ color:var(--ice); text-decoration:none; }
.ccard__list a:hover{ text-decoration:underline; }
.ccard__social{
  display:flex; flex-wrap:wrap; gap:.6rem 1.1rem; margin-top:1.2rem;
  padding-top:1.1rem; border-top:1px solid rgba(36,44,56,.75);
  font-size:.74rem; letter-spacing:.12em; text-transform:uppercase;
}
.ccard__social a{ color:var(--steel); text-decoration:none; }
.ccard__social a:hover{ color:var(--chalk); }
.ccard__note{ margin:0; font-size:.8rem; color:var(--steel-dk); line-height:1.65; }

@media (max-width:52rem){
  .contact__grid{ grid-template-columns:1fr; }
}

/* Cloudflare Turnstile widget (injected by ensure_turnstile.py) */
.turnstile-box { margin-bottom: 1.25rem; min-height: 65px; }