/* Header P (scripts/build_header_options.py page_p): the Precision Air header, ported to Nero's.
   The live-weather top bar (sky canvas, weather chip, a weather-driven service line, the Google rating), the white floating
   mega panel (colour-coded family columns, a side card that follows the family you point at, a "Not sure what you need?"
   strip) and the accordion phone menu. Nero's tokens only: night, flame #F0641E / ice #1E88D6, Sofia Sans. */

/* ================= live-weather top bar ================= */
.util { position: relative; overflow: hidden; isolation: isolate; color: #CDD9E8; font: 600 13px/1.3 var(--fh);
  background: linear-gradient(90deg, #11202E 0%, #0B1622 55%, #0E1B29 100%); border-bottom: 1px solid rgba(255, 255, 255, .06);
  transition: background .6s ease, border-color .6s ease; }
.util__sky { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.util__sky canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.util__scrim { position: absolute; inset: 0; z-index: 1; pointer-events: none; transition: background .6s ease;
  background: linear-gradient(90deg, rgba(8, 18, 30, .6), rgba(8, 18, 30, .1) 34%, rgba(8, 18, 30, .1) 66%, rgba(8, 18, 30, .6)); }
.util::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; z-index: 3; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .16), transparent); }
.util__in { position: relative; z-index: 2; display: flex; align-items: center; gap: 16px; min-height: 48px; text-shadow: 0 1px 3px rgba(0, 8, 20, .7); }
.uzone { display: flex; align-items: center; min-width: 0; }
.u-left, .u-right { flex: none; }
.u-mid { flex: 1 1 auto; justify-content: center; overflow: hidden; }

.wx { display: inline-flex; align-items: center; gap: 9px; white-space: nowrap; padding: 5px 13px 5px 9px; border-radius: 100px;
  background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .12); }
.wx__glyph { width: 22px; height: 22px; flex: none; display: grid; place-items: center; }
.wx__glyph svg { width: 22px; height: 22px; }
.wx__temp { font: 800 15px/1 var(--fh); color: #FFFFFF; font-variant-numeric: tabular-nums; }
.wx__sep { color: rgba(255, 255, 255, .3); }
.wx__loc { color: #AEC0D8; }
.wx__cond { color: #CDD9E8; }
.wx.is-loading .wx__temp { color: #8DA2BF; }
.wx.is-off { display: none; }

.rot { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; min-width: 0; white-space: nowrap; color: #D7E2F0; text-decoration: none;
  transition: opacity .45s cubic-bezier(.16, 1, .3, 1), transform .45s cubic-bezier(.16, 1, .3, 1), color .55s ease; }
.rot.out { opacity: 0; transform: translateY(-4px); }
.rot > svg { flex: none; width: 15px; height: 15px; }
.rot .rot__i { fill: #F7934A; }
.rot .rtxt { overflow: hidden; text-overflow: ellipsis; }
.rot .cta { display: inline-flex; align-items: center; gap: 4px; flex: none; color: #F7934A; font-weight: 800; border-bottom: 1px solid transparent; transition: border-color .2s, gap .2s; }
.rot .cta .i { width: 13px; height: 13px; fill: currentColor; transition: transform .2s; }
.rot:hover .cta, .rot:focus-visible .cta { border-color: currentColor; gap: 6px; }
.rot:hover .cta .i { transform: translateX(2px); }

.wgrev { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; color: inherit; text-decoration: none; }
.wgrev__g { flex: none; }
.wgrev__txt { display: flex; flex-direction: column; line-height: 1.12; }
.wgrev__top { display: flex; align-items: center; gap: 7px; }
.wgrev__rate { font: 800 15px/1 var(--fh); color: #FFFFFF; }
.wgrev__stars { color: #F6B83B; font-size: 12.5px; letter-spacing: .5px; }
.wgrev__sub { font-size: 11.5px; color: #AEC0D8; }
.wgrev__sub b { color: #FFFFFF; font-weight: 800; }
.wgrev:hover .wgrev__sub { text-decoration: underline; text-underline-offset: 2px; }
.util :focus-visible { outline: 2px solid currentColor; outline-offset: -2px; border-radius: 6px; }

/* day: a light sky, dark ink (storms keep a stronger scrim so the line stays readable) */
.util.is-day { background: linear-gradient(90deg, #CFE6F7, #E9F3FB 55%, #DCECF9); border-bottom-color: rgba(20, 55, 95, .12); }
.util.is-day::after { background: linear-gradient(90deg, transparent, rgba(20, 60, 110, .12), transparent); }
.util.is-day .util__scrim { background: linear-gradient(90deg, rgba(255, 255, 255, .5), rgba(255, 255, 255, 0) 32%, rgba(255, 255, 255, 0) 68%, rgba(255, 255, 255, .5)); }
.util.is-day.is-dim .util__scrim { background: linear-gradient(90deg, rgba(255, 255, 255, .62), rgba(255, 255, 255, .36) 32%, rgba(255, 255, 255, .36) 68%, rgba(255, 255, 255, .62)); }
.util.is-day .util__in { text-shadow: 0 1px 2px rgba(255, 255, 255, .7); }
.util.is-day .wx { background: rgba(255, 255, 255, .62); border-color: rgba(18, 52, 92, .16); }
.util.is-day .wx__temp { color: #0B1622; }
.util.is-day .wx__sep { color: rgba(20, 45, 80, .3); }
.util.is-day .wx__loc { color: #34506F; }
.util.is-day .wx__cond { color: #22384F; }
.util.is-day .rot { color: #22384F; }
.util.is-day .rot .rot__i, .util.is-day .rot .cta { color: #A8360F; fill: #A8360F; }
.util.is-day .rot .cta .i { fill: currentColor; }
.util.is-day .wgrev__rate { color: #0B1622; }
.util.is-day .wgrev__stars { color: #C98A00; }
.util.is-day .wgrev__sub { color: #34506F; }
.util.is-day .wgrev__sub b { color: #0B1622; }
.wx, .wx__temp, .wx__loc, .wx__cond, .wx__sep, .wgrev__rate, .wgrev__stars, .wgrev__sub, .wgrev__sub b { transition: color .55s ease, background .55s ease, border-color .55s ease; }

@media (max-width: 1023px) { .u-mid { display: none; } .util__in { justify-content: space-between; } }
@media (max-width: 767px) { .util__in { min-height: 44px; } .wx { padding: 4px 11px 4px 8px; } }
@media (max-width: 520px) { .wx__loc, .wx__sep--c { display: none; } }

/* ================= the bar ================= */
.np .header__in { min-height: 84px; gap: 20px; }
.np .nav__link { font-size: 15.5px; padding: 0 12px; }
.np .np-caret { width: 12px; height: 12px; transition: transform .22s var(--ease); }
.np .np-btn[aria-expanded="true"] { color: var(--blue-ink); }
.np .np-btn[aria-expanded="true"] .np-caret { transform: rotate(180deg); }
.np .header__cta { gap: 12px; }
.np .np-tel { min-height: 52px; padding: 0 18px; border: 1px solid var(--line); border-radius: var(--rb); background: #FFFFFF; font: 800 18px/1 var(--fh);
  box-shadow: 0 1px 0 rgba(11, 22, 34, .04); transition: border-color .2s, box-shadow .2s; }
.np .np-tel:hover { color: var(--night); border-color: #F5B796; box-shadow: 0 10px 22px -14px rgba(232, 84, 31, .5); }

/* ================= the mega panel ================= */
.np-mega { position: absolute; top: calc(100% + 6px); left: 50%; transform: translateX(-50%); z-index: 60; width: min(1360px, calc(100vw - 48px));
  background: #FFFFFF; border: 1px solid var(--line); border-radius: 22px; box-shadow: 0 44px 70px -34px rgba(11, 22, 34, .5), 0 2px 6px rgba(11, 22, 34, .05);
  animation: np-in .22s var(--ease); }
.np-mega::before { content: ""; position: absolute; left: 0; right: 0; top: -8px; height: 8px; }
@keyframes np-in { from { opacity: 0; transform: translate(-50%, 8px); } }
.np-mega[hidden], .np-drop[hidden] { display: none; }
.np-mega a { text-decoration: none; }
.np-mega ul { margin: 0; padding: 0; list-style: none; }
.np-mega__in { display: grid; grid-template-columns: minmax(0, 1fr) 250px; grid-template-areas: "cols side" "foot foot"; }

/* family identities (flame / ice only) */
.np-mega [data-cat="cool"] { --cg1: #4FB0EE; --cg2: #0E67A8; --cak: #0E67A8; --cdot: #1E88D6; --cwash: #E3F1FB; }
.np-mega [data-cat="heat"] { --cg1: #F58A3C; --cg2: #C4411A; --cak: #A8360F; --cdot: #F0641E; --cwash: #FDECE2; }
.np-mega [data-cat="hp"] { --cg1: #F0641E; --cg2: #1E88D6; --cak: #0A4F80; --cdot: #0A4F80; --cwash: #EAF1F8; }
.np-mega [data-cat="water"] { --cg1: #E8541F; --cg2: #A8360F; --cak: #9A2F0C; --cdot: #E8541F; --cwash: #FCE7DD; }
.np-mega [data-cat="iaq"] { --cg1: #7CC2EE; --cg2: #0A4F80; --cak: #0A4F80; --cdot: #3E9FD8; --cwash: #E6F0F8; }
.np-mega [data-cat="com"] { --cg1: #3A526B; --cg2: #0B1622; --cak: #0B1622; --cdot: #5B6774; --cwash: #EEF2F6; }
.np-mega [data-cat="pg"] { --cg1: #F58A3C; --cg2: #C4411A; --cak: #A8360F; --cdot: #F0641E; --cwash: #FDECE2; }
.np-mega [data-cat="mc"] { --cg1: #4FB0EE; --cg2: #0E67A8; --cak: #0E67A8; --cdot: #1E88D6; --cwash: #E3F1FB; }
.np-mega [data-cat="dc"] { --cg1: #E8541F; --cg2: #A8360F; --cak: #9A2F0C; --cdot: #E8541F; --cwash: #FCE7DD; }
.np-mega [data-cat="va"] { --cg1: #7CC2EE; --cg2: #0A4F80; --cak: #0A4F80; --cdot: #3E9FD8; --cwash: #E6F0F8; }

/* column widths follow their longest page name, so the names sit on one line at 1440 */
.np-cols { grid-area: cols; display: grid; grid-template-columns: repeat(4, auto); padding: 18px 4px 16px 10px; }
.np-col { display: flex; flex-direction: column; gap: 10px; min-width: 0; padding: 0 8px; }
.np-col + .np-col { border-left: 1px solid #E8EDF2; }
.np-ch { display: flex; align-items: center; gap: 12px; padding: 4px 8px 14px; margin-bottom: 8px; border-bottom: 1px solid #E8EDF2; }
.np-ci { width: 42px; height: 42px; flex: none; display: grid; place-items: center; border-radius: 13px; color: #FFFFFF;
  background: linear-gradient(140deg, var(--cg1), var(--cg2)); box-shadow: 0 12px 22px -12px rgba(11, 22, 34, .5); transition: transform .3s cubic-bezier(.2, .7, .16, 1); }
.np-grp[data-cat="hp"] .np-ci { background: linear-gradient(135deg, var(--cg1) 0 49%, var(--cg2) 51% 100%); }
.np-ci .i { width: 21px; height: 21px; fill: currentColor; }
.np-grp[data-cat="iaq"] .np-ci .i { stroke: currentColor; stroke-width: 6px; }
.np-grp:hover .np-ci, .np-grp:focus-within .np-ci { transform: translateY(-2px) scale(1.05); }
.np-ct { font: 800 17px/1.1 var(--fh); letter-spacing: -.01em; color: var(--night); white-space: nowrap; transition: color .2s; }
.np-ch:hover .np-ct, .np-ch:focus-visible .np-ct { color: var(--cak); }
.np-grp li a { position: relative; display: flex; align-items: flex-start; gap: 10px; padding: 8px 20px 8px 9px; border-radius: 10px;
  font: 600 14.5px/1.25 var(--fh); color: #33414E; text-wrap: balance; transition: background .18s, color .18s; }
.np-lt { transition: transform .2s; }
.np-grp li a::after { content: "›"; position: absolute; right: 8px; top: 50%; margin-top: -9px; font: 900 17px/1 var(--fh); color: var(--cak); opacity: 0; transform: translateX(-4px); transition: opacity .2s, transform .2s; }
.np-dot { width: 6px; height: 6px; margin-top: 7px; flex: none; border-radius: 50%; background: var(--cdot); transition: transform .2s; }
.np-grp li a:hover, .np-grp li a:focus-visible { background: var(--cwash); color: var(--cak); }
.np-grp li a:hover .np-lt, .np-grp li a:focus-visible .np-lt { transform: translateX(3px); }
.np-grp li a:hover::after, .np-grp li a:focus-visible::after { opacity: 1; transform: none; }
.np-grp li a:hover .np-dot, .np-grp li a:focus-visible .np-dot { transform: translateX(3px) scale(1.4); }
.np-grp + .np-grp { margin-top: 8px; }

/* side card: the emergency card by default, the family's own photo while you point at it */
.np-side { grid-area: side; position: relative; min-height: 330px; overflow: hidden; border-left: 1px solid #E8EDF2; border-radius: 0 21px 0 0; background: var(--alt); }
.np-fam { position: absolute; inset: 0; margin: 0; display: flex; flex-direction: column; opacity: 0; transition: opacity .3s ease; }
.np-fam img { display: block; width: 100%; height: 62%; object-fit: cover; }
.np-fam figcaption { flex: 1; display: flex; flex-direction: column; justify-content: center; gap: 5px; padding: 12px 18px 16px; background: linear-gradient(180deg, var(--cwash, #EEF2F6), #FFFFFF); }
.np-fam figcaption b { font: 800 19px/1.1 var(--fh); letter-spacing: -.01em; color: var(--cak, var(--night)); }
.np-fam figcaption span { font: 500 14.5px/1.35 var(--fh); color: var(--muted); }
.np-mega[data-show="cool"] .np-fam[data-cat="cool"], .np-mega[data-show="heat"] .np-fam[data-cat="heat"], .np-mega[data-show="hp"] .np-fam[data-cat="hp"],
.np-mega[data-show="water"] .np-fam[data-cat="water"], .np-mega[data-show="iaq"] .np-fam[data-cat="iaq"], .np-mega[data-show="com"] .np-fam[data-cat="com"] { opacity: 1; }
.np-fam--on { position: relative; height: 100%; opacity: 1; }
.np-side--areas { min-height: 0; }
.np-side--areas .np-fam figcaption b { font-size: 17px; }

.np-em { position: absolute; inset: 0; z-index: 3; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 16px 16px 18px;
  text-align: center; color: #FFFFFF; background: radial-gradient(120% 80% at 50% 0%, #F0641E 0%, #CF4616 42%, #A8360F 100%); transition: opacity .32s ease; }
.np-mega:not([data-show="em"]) .np-em { opacity: 0; pointer-events: none; }
.np-em__badge { display: inline-flex; align-items: center; gap: 7px; padding: 4px 11px; border-radius: 999px; background: rgba(0, 0, 0, .2); border: 1px solid rgba(255, 255, 255, .3);
  font: 800 11px/1.2 var(--fh); letter-spacing: .14em; text-transform: uppercase; }
.np-em__dot { width: 7px; height: 7px; border-radius: 50%; background: #FFDD7A; animation: np-pulse 1.6s infinite; }
@keyframes np-pulse { 0% { box-shadow: 0 0 0 0 rgba(255, 221, 122, .75); } 70% { box-shadow: 0 0 0 8px rgba(255, 221, 122, 0); } 100% { box-shadow: 0 0 0 0 rgba(255, 221, 122, 0); } }
.np-em__torch { height: 96px; width: auto; filter: drop-shadow(0 10px 14px rgba(70, 8, 4, .4)); }
.np-em__h { margin: 0; font: 900 22px/1.05 var(--fh); letter-spacing: -.02em; text-wrap: balance; }
.np-em__links { display: grid; gap: 0; }
.np-em__links a { display: inline-flex; align-items: center; min-height: 28px; color: #FFFFFF; font: 700 14.5px/1.2 var(--fh);
  text-decoration: underline !important; text-decoration-color: rgba(255, 255, 255, .5) !important; text-underline-offset: 3px; }
.np-em__links a:hover { text-decoration-color: #FFFFFF !important; }
.np-em__cta { margin-top: 4px; display: inline-flex; white-space: nowrap; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border-radius: 11px; background: #FFFFFF; color: #A8360F;
  font: 800 15.5px/1 var(--fh); font-variant-numeric: tabular-nums; box-shadow: 0 10px 22px -8px rgba(60, 6, 3, .55); transition: transform .2s, box-shadow .2s; }
.np-em__cta .i { width: 15px; height: 15px; fill: currentColor; }
.np-em__cta:hover { transform: translateY(-2px); box-shadow: 0 16px 28px -10px rgba(60, 6, 3, .62); }
.np-em :focus-visible { outline: 2px solid #FFFFFF; outline-offset: 2px; }

/* the strip under the panel */
.np-foot { grid-area: foot; position: relative; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 12px 22px;
  border-top: 1px solid #E8EDF2; border-radius: 0 0 21px 21px; background: linear-gradient(180deg, #FFFFFF, var(--alt)); }
.np-foot::before { content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 2px; background: var(--seam); }
.np-foot__l { display: flex; align-items: center; gap: 13px; }
.np-foot__l img { width: 44px; height: 44px; flex: none; border-radius: 10px; }
.np-foot__l b { display: block; font: 800 16px/1.15 var(--fh); color: var(--night); }
.np-foot__l span { font: 500 14px/1.3 var(--fh); color: var(--muted); }
.np-foot__r { display: flex; align-items: center; gap: 20px; }
.np-foot__all { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font: 800 15px/1 var(--fh); color: var(--night); transition: gap .2s, color .2s; }
.np-foot__all .i { width: 14px; height: 14px; fill: currentColor; }
.np-foot__all:hover, .np-foot__all:focus-visible { color: var(--dorange-h); gap: 9px; }
.np-foot__btn { display: inline-flex; align-items: center; min-height: 46px; padding: 0 22px; border-radius: 10px; background: var(--dorange); color: #F7F9FB;
  font: 700 19px/1 var(--fh); box-shadow: 0 10px 22px -12px rgba(232, 84, 31, .7); transition: background .2s, transform .2s; }
.np-foot__btn:hover, .np-foot__btn:focus-visible { background: var(--dorange-h); transform: translateY(-2px); }

/* areas */
.np-cols--areas { grid-template-columns: 1fr 1.55fr 1fr; }
.np-two { columns: 2; column-gap: 6px; }
.np-two li { break-inside: avoid; }
.np-mega--areas .np-grp li a { padding-right: 20px; }

/* About drop */
.np-item--drop { position: relative; }
.np-drop { position: absolute; top: calc(100% + 26px); left: 50%; transform: translateX(-50%); z-index: 60; width: 220px; padding: 8px; background: #FFFFFF;
  border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 30px 50px -24px rgba(11, 22, 34, .4); animation: np-in .2s var(--ease); }
.np-drop::before { content: ""; position: absolute; top: -7px; left: 50%; width: 13px; height: 13px; background: #FFFFFF; border-left: 1px solid var(--line); border-top: 1px solid var(--line); transform: translateX(-50%) rotate(45deg); }
.np-drop::after { content: ""; position: absolute; left: 0; right: 0; top: -28px; height: 28px; }
.np-drop ul { margin: 0; padding: 0; list-style: none; }
.np-drop a { display: flex; align-items: center; min-height: 44px; padding: 0 14px; border-radius: 10px; font: 600 15.5px var(--fh); color: var(--ink); text-decoration: none; }
.np-drop a:hover, .np-drop a:focus-visible { background: var(--alt); color: var(--blue-ink); }

/* ================= phone menu (accordions, the call bar pinned) ================= */
.hv2-menu__body { display: grid; gap: 2px; overflow-y: auto; min-height: 0; margin: 0 -4px; padding: 0 4px; }
.hv2-acc__btn { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 56px; padding: 0; border: 0; border-bottom: 1px solid var(--line); background: none;
  font: 700 19px var(--fh); color: var(--ink); cursor: pointer; text-align: left; }
.hv2-acc__btn .i { width: 16px; height: 16px; transition: transform .22s var(--ease); }
.hv2-acc__btn[aria-expanded="true"] { color: var(--blue-ink); }
.hv2-acc__btn[aria-expanded="true"] .i { transform: rotate(180deg); }
.hv2-acc__panel { padding: 8px 0 14px; border-bottom: 1px solid var(--line); }
.hv2-acc__panel[hidden] { display: none; }
.hv2-mgrp { padding: 8px 0 6px; }
.hv2-mgrp__h { display: inline-flex; align-items: center; min-height: 40px; font: 800 18px/1.1 var(--fh); color: var(--night); text-decoration: none; }
.hv2-mgrp ul, .hv2-mflat { margin: 0; padding: 0; list-style: none; }
.hv2-mgrp ul a { display: flex; align-items: center; min-height: 40px; padding-left: 14px; border-left: 2px solid var(--line); font: 600 16px var(--fh); color: var(--muted); text-decoration: none; }
.hv2-mgrp ul a:hover { color: var(--flame-deep); border-left-color: var(--orange); }
.hv2-mall { display: inline-flex; min-height: 44px; align-items: center; font: 800 14px var(--fh); letter-spacing: .06em; text-transform: uppercase; color: var(--blue-ink); text-decoration: none; }
.hv2-mflat a { display: flex; align-items: center; min-height: 52px; border-bottom: 1px solid var(--line); font: 700 19px var(--fh); color: var(--ink); text-decoration: none; }
.hv2-acc__panel .hv2-mflat a { font-size: 17px; font-weight: 600; min-height: 46px; }
.hv2-menu .menu__cta { padding-top: 12px; border-top: 1px solid var(--line); }
.hv2-menu__rev { display: inline-flex; align-items: center; gap: 6px; margin: 0 0 4px; font: 700 14px var(--fh); color: var(--muted); }
.hv2-menu__rev .i { width: 14px; height: 14px; fill: #F6B83B; }

/* the panels live in the sticky header; below 1200 px the phone menu takes over */
@media (max-width: 1199px) { .np-mega, .np-drop { display: none !important; } }
@media (max-width: 1339px) {
  .np .header__in { gap: 14px; }
  .np .nav__link { padding: 0 9px; font-size: 15px; }
  .np .np-tel { padding: 0 14px; font-size: 17px; }
  .np-mega__in { grid-template-columns: minmax(0, 1fr) 224px; }
  .np-grp li a { font-size: 14px; }
  .np-ct { font-size: 16px; }
  .np-em { padding-inline: 10px; }
  .np-em__cta { padding: 0 12px; font-size: 14px; gap: 6px; }
}
@media (prefers-reduced-motion: reduce) {
  .np-mega, .np-drop { animation: none; }
  .np-em__dot { animation: none; }
  .rot, .np-fam, .np-em, .np-ci, .np-grp li a, .np-lt, .np-dot { transition: none; }
}


/* ===== AM round 2026-11-05 (scripts/sitewide.py; concatenated after header-p.css into options/sitewide.css) =====
   1+2 the estimate popup on every booking link (our own form)   3 section proportions */

/* ---------- 1+2 the estimate popup: every booking link opens our own estimate form (Shoaib 11-05) ---------- */
.estm { width: min(560px, calc(100vw - 32px)); max-width: none; max-height: calc(100dvh - 32px); margin: auto; padding: 0; border: 0; border-radius: 20px; overflow: auto;
  overscroll-behavior: contain; background: transparent; color: var(--ink); }
.estm::backdrop { background: rgba(11, 22, 34, .66); }
.estm[open] { animation: estm-in .24s var(--ease); }
@keyframes estm-in { from { opacity: 0; transform: translateY(14px) scale(.98); } }
.estm .quote--pop { margin: 0; }
.estm .quote--pop .qh { padding-right: 76px; }
.estm .quote--pop .quote__title { font-size: 30px; }
.estm__x { position: absolute; top: 16px; right: 16px; z-index: 3; width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 12px;
  background: #FFFFFF; color: var(--night); font-size: 20px; cursor: pointer; }
.estm__x:hover, .estm__x:focus-visible { background: var(--alt); }
html:has(dialog.estm[open]) { overflow: hidden; }
@media (max-width: 600px) { .estm { width: 100vw; height: 100dvh; max-height: 100dvh; border-radius: 0; } .estm .quote--pop { min-height: 100%; border-radius: 0; } }
@media (prefers-reduced-motion: reduce) { .estm[open] { animation: none; } }

/* ---------- 3 proportions (AM: the offers and "Ready when you are" were out of scale with the page) ---------- */
/* the closing band: its headline at the page's H2 size, a smaller torch */
.cta .cta__h { font-size: 54px; line-height: 1.04; margin-top: 18px; }
.cta .cta__torch { height: 92px; }
@media (max-width: 1279px) { .cta .cta__h { font-size: 46px; } }
@media (max-width: 767px) { .cta .cta__h { font-size: 34px; } .cta .cta__torch { height: 72px; } }
/* the homepage coupons: the figure at H2 scale, the line in the page's text face, a shorter ticket */
.offers--cp .cps { gap: 22px 26px; margin-top: 36px; max-width: 1080px; margin-inline: auto; }
.offers--cp .cp__in { grid-template-columns: 88px minmax(0, 1fr); min-height: 0; }
.offers--cp .cp__stub svg { width: 26px; height: 66px; }
.offers--cp .cp__body { gap: 6px; padding: 24px 28px 24px 24px; }
.offers--cp .cp__v { font-size: 60px; line-height: .9; }
.offers--cp .cp__body p { max-width: 380px; font: 600 16px/1.45 var(--fb); letter-spacing: 0; text-transform: none; }
.offers--cp .cp__logo { width: 52px; right: 20px; bottom: 18px; }
@media (max-width: 767px) { .offers--cp .cp__v { font-size: 50px; } .offers--cp .cp__body p { font-size: 15px; } .offers--cp .cp__in { grid-template-columns: 70px minmax(0, 1fr); } }

/* ---------- 4 the GHL form's fields on our forms (11-05): the Service dropdown styled like the other fields ---------- */
.field select { width: 100%; height: 52px; padding: 0 44px 0 44px; font: 16px var(--fb); color: var(--ink); background: var(--alt); border: 1px solid var(--line);
  border-radius: var(--rb); appearance: none; -webkit-appearance: none; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235B6774' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 14px center; background-size: 18px 18px; }
.field select:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px rgba(30, 136, 214, .3); background-color: #FDFEFE; }
.field select:has(option[value=""]:checked) { color: var(--muted); }
.field select option { color: var(--ink); }

/* ---------- 5 content audit 2026-11-06, comment [a] ("please fix the cut off content"): the homepage service cards show
   their whole Notion paragraph; the 3-line clamp goes, the card layout stays ---------- */
.services .card__body > p { display: block; -webkit-line-clamp: unset; overflow: visible; min-height: 0; }
/* the FAQ heading is now a full sentence (audit #7): the section's side card takes it at the page's H2 scale */
[data-sec="faq"] .faq__side .h2 { font-size: 40px; line-height: 1.06; }
@media (max-width: 1279px) { [data-sec="faq"] .faq__side .h2 { font-size: 36px; } }
@media (max-width: 767px) { [data-sec="faq"] .faq__side .h2 { font-size: 30px; } }