/* Homepage: foreground sections scroll over a softly blended background scene. */
.hp-hero-background { background: #e9eeef; color: #17272e; }
/* Let the registered photo fade into the page instead of stretching a second
   copy of the larger building into the phone's surrounding space. */
.hp-hero-background .hp-scene-photo { background: #e9eeef; }
.hp-hero-background .hp-scene-photo-backdrop { display: none; }
.hp-hero-background .hp-site-photo { z-index: 1; opacity: calc(1 - var(--closing-settle,0)); }
.hp-hero-background .hp-hero-media, .hp-hero-background .hp-hero-scrim { visibility: hidden; }
.hp-hero-background .hp-hero-in, .hp-hero-background .hp-hero-foot { z-index: 2; }
.hp-hero-background .hp-hero-in h1 { color: #17272e; }
.hp-hero-background :is(.hp-hero-body,.hp-eyebrow,.hp-act-note,.hp-hero-support) { color: #263c46; }
.home .hp-hero-background .hp-btn-ghost { color: #17272e; border-color: #89999f; background: #e9eeef; }
.hp-hero-plan {
  position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; mix-blend-mode: multiply; opacity: .88;
  -webkit-mask-image: linear-gradient(180deg,#000 88%,transparent);
  mask-image: linear-gradient(180deg,#000 88%,transparent);
}
.hp-hero-plan img {
  position: absolute; left: calc(60% - max(292.5px,32.142857vw)); top: calc(47% - max(266.5px,29.285714vw));
  width: max(910px,100vw); height: auto; max-width: none; transform-origin: 0 0;
  /* Hero art focuses on the room; the complete sheet retains its schedules and title block. */
  -webkit-mask-image: none;
  mask-image: none;
  -webkit-mask-composite: source-in; mask-composite: intersect;
}
.hp-scroll-story .hp-hero-background .hp-scene-frame {
  right: -12%; width: 84%; height: 100%; top: 50%; opacity: calc((.85 + var(--plant-focus,0)*.15)*(1 - var(--closing-settle,0))); border-radius: 0;
  -webkit-mask-image: linear-gradient(180deg,transparent,#000 16%,#000 80%,transparent), linear-gradient(90deg,transparent,#000 12%);
  mask-image: linear-gradient(180deg,transparent,#000 16%,#000 80%,transparent), linear-gradient(90deg,transparent,#000 12%);
  -webkit-mask-composite: source-in; mask-composite: intersect;
}
.hp-hero-background::after {
  opacity: calc(1 - var(--plant-focus,0));
  content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  /* One continuous wash across the scene keeps copy legible without a card edge. */
  background: linear-gradient(90deg,#e9eeef,rgba(233,238,239,.98) 25%,rgba(233,238,239,.88) 39%,rgba(233,238,239,.30) 57%,transparent 76%);
}
/* The indoor evaporator card and outdoor plant labels follow their equipment. */
.hp-hero-background .hp-equipment-card h2 { position: static; width: auto; height: auto; overflow: visible; clip-path: none; white-space: normal; margin: 0 0 8px; font: 600 18px/1.2 var(--font); }
.hp-est-lead-continued { display: none; }
.hp-est-with-plan > .wrap { grid-template-areas: "lead ." "summary ."; }
.hp-plan-summary { grid-area: summary; }
.hp-est-with-plan .hp-plan-summary .hp-est-preview { margin: 28px 0 0; }
/* Technical outputs stay as compact rows in the copy flow. The wrapper and first
   row id remain stable for the animated equipment leaders. */
.hp-spec-lines { display: grid; width: min(680px,100%); margin-top: 22px; border-top: 1px solid rgba(189,201,205,.72); }
.hp-spec-line { display: grid; grid-template-columns: minmax(112px, 0.72fr) minmax(0, 2fr); gap: 18px; min-width: 0; margin: 0; padding: 8px 0; border-bottom: 1px solid rgba(189,201,205,.72); font: 400 12px/1.35 'Courier New',monospace; color: #263c46; }
.hp-spec-line span { min-width: 0; overflow-wrap: anywhere; }
.hp-spec-line span:first-child { color: #46555c; }
.hp-est:not(.hp-flow-chapter) .hp-spec-line { border-color: rgba(255,255,255,.26); color: rgba(255,255,255,.9); }
.hp-est:not(.hp-flow-chapter) .hp-spec-line span:first-child { color: rgba(255,255,255,.68); }
.hp-est .hp-plan-specs { width: min(680px,100%); margin-top: 22px; padding: 0; border: 0; background: none; color: inherit; }
.hp-plan-specs .hp-spec-lines { margin-top: 0; }
.hp-plan-specs h3, .hp-plan-specs ul, .hp-plan-specs .hp-equipment-note { display: none; }
.hp-equipment-cards-inline .hp-equipment-leader { stroke: #476c76; stroke-width: 1.4; }
.hp-equipment-cards-inline .hp-equipment-pin { fill: #476c76; }
/* Operation annotations share the plan's exact perspective and scroll timing. */
.hp-operations { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; opacity: 0; visibility: hidden; }
.hp-operations-sheet { position: absolute; left: 0; top: 0; width: 1400px; height: 1200px; max-width: none; transform-origin: 0 0; overflow: visible; }
.hp-pallet-position { fill: #48827b; fill-opacity: .24; stroke: #376d69; stroke-width: 1.2; }
.hp-forklift-route { fill: none; stroke: #377eae; stroke-width: 1.15; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; }
.hp-traffic-arrow { fill: none; stroke: #247b80; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.hp-operations-key { position: absolute; left: 0; top: 0; width: 240px; padding: 12px 14px; background: rgba(233,238,239,.94); border-top: 2px solid #48827b; color: #263c46; font-family: 'Courier New',monospace; }
.hp-operations-capacity { display: flex; align-items: center; gap: 12px; font-size: 13px; line-height: 1.45; }
.hp-operations-capacity strong { min-width: 2ch; font: 600 36px/1 var(--font); font-variant-numeric: tabular-nums; }
.hp-operations-capacity small { font-size: 10px; }
.hp-operations-key .hp-operations-route-label { margin-top: 10px; font-size: 11px; }
.hp-operations-route-label::before { content: '→'; margin-right: 8px; color: #247b80; }
.hp-operations-key .hp-operations-note { margin-top: 5px; font-size: 9px; }
@media (max-width:767px) {
  .hp-spec-line { grid-template-columns: minmax(92px, .72fr) minmax(0, 2fr); gap: 10px; padding: 7px 0; font-size: 11px; }
  .hp-operations-key { width: 208px; padding: 8px 10px; }
  .hp-operations-capacity strong { font-size: 26px; }
  .hp-operations-capacity { font-size: 11px; }
  .hp-operations-key .hp-operations-route-label { margin-top: 5px; }
  .hp-operations-key-inline { position: relative; width: 100%; margin-top: 14px; padding: 8px 0 0; background: none; display: grid; grid-template-columns: 1fr auto; gap: 4px 8px; align-items: center; }
  .hp-operations-key-inline .hp-operations-capacity { gap: 8px; }
  .hp-operations-key-inline .hp-operations-capacity small { font-size: 9px; white-space: nowrap; }
  .hp-operations-key-inline .hp-operations-route-label { margin: 0; font-size: 9px; }
  .hp-operations-key-inline .hp-operations-note { grid-column: 1 / -1; margin: 0; font-size: 9px; }
}
@media (max-width: 767px) {
  .hp-scroll-story .hp-hero-background .hp-scene-frame {
    position: absolute; top: var(--mobile-scene-top,48%); right: -4%; width: 108%; height: var(--mobile-scene-height,52%); transform: none; opacity: calc((.85 + var(--plant-focus,0)*.15)*(1 - var(--closing-settle,0)));
    -webkit-mask-image: linear-gradient(180deg,transparent,#000 10%,#000 90%,transparent);
    mask-image: linear-gradient(180deg,transparent,#000 10%,#000 90%,transparent);
  }
  .hp-hero-background::after {
    background: linear-gradient(180deg,rgba(233,238,239,.95),rgba(233,238,239,.85) 24%,rgba(233,238,239,.6) 52%,rgba(233,238,239,.2) 80%,rgba(233,238,239,.35));
  }
  .hp-hero-plan img { width: 840px; left: calc(34% - 270px); top: calc(68% - 246px); }
}
/* The introduction and planning copy scroll over one sticky scene. */
.hp-scroll-story.hp-scroll-copy-flow { display: grid; grid-template-columns: minmax(0,1fr); height: auto; }
.hp-scroll-copy-flow > .hp-hero, .hp-scroll-copy-flow > .hp-flow-content { grid-area: 1 / 1; min-width: 0; }
.hp-scroll-copy-flow > .hp-hero { align-self: start; }
.hp-scroll-copy-flow .hp-hero-in { display: none; }
.hp-flow-content { position: relative; z-index: 2; pointer-events: none; display: flex; flex-direction: column; gap: clamp(120px,24svh,240px); padding-top: clamp(32px,6svh,64px); }
/* Give assembly, pullback, the photo wash and its final hold their own scroll space. */
.hp-finish-runway { display: block; height: 280svh; min-height: 1500px; flex-shrink: 0; pointer-events: none; }
.hp-scroll-copy-flow > .hp-equipment-cards-inline { grid-area:1 / 1; position:sticky; inset:auto; top:var(--story-header); align-self:start; width:100%; z-index:3; pointer-events:none; }
.hp-scroll-copy-flow > .hp-equipment-cards-drawing { grid-area:1 / 1; position:sticky; inset:auto; top:var(--story-header); align-self:start; width:100%; z-index:3; pointer-events:none; }
.hp-drawing-label { position:absolute; left:0; top:0; width:max-content; padding:4px 6px; color:#35535e; background:rgba(233,238,239,.88); font:400 11px/1.45 "Courier New",monospace; border-top:1px solid #789095; visibility:hidden; clip-path:inset(0 calc((1 - var(--label-print,0))*100%) 0 0); }
.hp-drawing-label :is(strong,span) { display:block; white-space:nowrap; }
.hp-drawing-label strong { font-weight:600; }
.hp-equipment-cards-drawing .hp-equipment-leader { stroke:#597c86; stroke-width:1; }
.hp-equipment-cards-drawing .hp-equipment-pin { fill:#597c86; }
@media(max-width:767px) { .hp-drawing-label { font-size:10px; padding:3px 5px; } }
.hp-flow-panel { display: block; padding: 0; pointer-events: none; }
.hp-flow-intro { min-height: calc(100svh - var(--story-header) - clamp(32px,6svh,64px)); }
.hp-flow-panel > .wrap { width: 100%; }
.hp-scroll-copy-flow .hp-flow-content :is(.hp-flow-message,.hp-plan-summary,.hp-story-card) { position: relative; isolation: isolate; width: min(76%,860px); margin-left: 4%; pointer-events: auto; }
.hp-scroll-copy-flow .hp-flow-content :is(.hp-flow-message,.hp-plan-summary,.hp-story-card) {
  padding: clamp(24px,2.5vw,36px);
  border: 1px solid rgba(255,255,255,.16); border-radius: 30px;
  background: linear-gradient(135deg,rgba(255,255,255,.28),rgba(241,247,249,.08) 52%,rgba(255,255,255,.18));
  -webkit-backdrop-filter: var(--liquid-filter,blur(2.5px)) blur(2.5px) saturate(1.12);
  backdrop-filter: var(--liquid-filter,blur(2.5px)) blur(2.5px) saturate(1.12);
  box-shadow: inset 0 1px 1px rgba(255,255,255,.32), 0 8px 28px rgba(36,59,69,.035);
}
.hp-liquid-filters { position: absolute; width: 0; height: 0; pointer-events: none; }
.hp-scroll-copy-flow .hp-flow-content :is(.hp-flow-message,.hp-plan-summary,.hp-story-card) p { color: #263c46; }
.hp-scroll-copy-flow .hp-flow-content :is(.hp-flow-message,.hp-plan-summary,.hp-story-card)::before,
.hp-scroll-copy-flow .hp-flow-content :is(.hp-flow-message,.hp-plan-summary,.hp-story-card)::after {
  content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
}
/* A narrow changing reflection defines the curved rim, with a clear center. */
.hp-scroll-copy-flow .hp-flow-content :is(.hp-flow-message,.hp-plan-summary,.hp-story-card)::before {
  opacity: .32;
  padding: 2px;
  background: linear-gradient(var(--glass-light-angle,135deg),rgba(255,255,255,.98),rgba(255,255,255,.1) 27%,rgba(62,91,103,.18) 48%,rgba(255,255,255,.1) 65%,rgba(255,255,255,.9));
  -webkit-mask: linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  mask: linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
}
.hp-scroll-copy-flow .hp-flow-content :is(.hp-flow-message,.hp-plan-summary,.hp-story-card)::after {
  background: radial-gradient(ellipse at var(--glass-light-x,18%) var(--glass-light-y,0%),rgba(255,255,255,.3),transparent 58%);
  box-shadow: inset 0 0 12px rgba(255,255,255,.22);
  z-index: -1;
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .hp-scroll-copy-flow .hp-flow-content :is(.hp-flow-message,.hp-plan-summary,.hp-story-card) { background: rgba(245,249,250,.94); }
}
.hp-scroll-copy-flow .hp-flow-content .hp-flow-message .hp-eyebrow { font-size: 12px; color: #46555c; }
.home .hp-scroll-copy-flow .hp-flow-content .hp-flow-message :is(h1,h2) { color: #17272e; font-size: clamp(42px,4.2vw + 4px,66px); font-weight: 700; line-height: 1; letter-spacing: -.035em; margin-top: 8px; text-wrap: initial; }
.home .hp-scroll-copy-flow .hp-flow-content :is(.hp-flow-message,.hp-plan-summary,.hp-story-card) h2 { font-size: clamp(34px,3.5vw,52px); line-height: 1.05; max-width: none; margin-top: 0; }
.hp-scroll-copy-flow .hp-flow-content .hp-flow-message :is(.hp-hero-body,.promise) { max-width: 650px; color: #263c46; font-size: 17px; line-height: 1.5; margin-top: 10px; }
/* Actions participate in the same document flow as their section's copy. */
.hp-scroll-copy-flow .hp-flow-content .hp-flow-message .hp-acts { margin-top: 0; max-width: none; }
.hp-scroll-copy-flow .hp-flow-content .hp-flow-message .hp-hero-actions { margin-top: 16px; }
.hp-scroll-copy-flow .hp-flow-content .hp-flow-message .hp-acts, .hp-est-intro-actions .hp-acts { display: flex; flex-wrap: wrap; gap: 8px; }
.hp-scroll-copy-flow .hp-flow-content .hp-flow-message .btn, .hp-est-intro-actions .btn { min-height: 48px; padding: 0 14px; font-size: 14px; }
.home .hp-scroll-copy-flow .hp-flow-content .hp-flow-message .hp-btn-ghost { color: #17272e; border-color: #89999f; background: #e9eeef; }
.hp-scroll-copy-flow .hp-flow-content .hp-flow-message .hp-act-note, .hp-est-intro-actions .hp-act-note { font-size: 12px; line-height: 1.4; margin-top: 6px; }
.hp-scroll-copy-flow .hp-flow-content .hp-flow-message .hp-act-note { color: #46555c; }
.hp-scroll-copy-flow .hp-flow-content .hp-flow-message .hp-hero-foot { position: static; padding: 10px 0 0; opacity: 1; }
.hp-scroll-copy-flow .hp-flow-content .hp-flow-message .hp-hero-support { font: 600 12px/1.4 var(--font); color: #46555c; }
.hp-est-intro-actions { margin-top: 16px; }
/* Every chapter follows the same column while the room moves behind it. */
.hp-flow-content .hp-flow-chapter { background: transparent; color: #17272e; overflow: visible; isolation: auto; padding: 0; display: block; }
.hp-flow-content .hp-flow-chapter > .wrap { width: 100%; display: block; }
.hp-flow-content .hp-flow-chapter .wrap > :not(.hp-op-fig) { position: relative; isolation: isolate; grid-row: auto; min-width: 0; pointer-events: auto; }
.hp-flow-content .hp-flow-chapter .hp-est-lead { grid-column: 1 / 8; }
.hp-flow-content .hp-flow-chapter .hp-plan-summary { grid-column: 2 / 10; }
.hp-flow-content .hp-plan-summary > .promise { max-width: 650px; font-size: 17px; line-height: 1.5; margin-top: 10px; }
.hp-flow-content .hp-flow-chapter .hp-est-preview { grid-column: 9 / -1; align-self: center; }
.hp-flow-content .hp-flow-chapter .hp-est-outputs { grid-column: 2 / -1; }
.hp-flow-content .hp-flow-chapter .hp-est-follow { grid-column: 4 / 12; }
.hp-flow-content .hp-flow-chapter .hp-op-head { grid-column: 2 / 10; }
.hp-flow-content .hp-flow-chapter .hp-op-body { grid-column: 4 / -1; }
.hp-flow-content .hp-flow-chapter .hp-op-fig { display: none; }
.hp-flow-content .hp-est-with-plan::before { display: none; }
.hp-flow-content .hp-est-plan-background { opacity: 0; } /* The shared live plan supplies this background. */
.hp-flow-content .hp-est-plan-background img { filter: none; mix-blend-mode: multiply; }
.hp-flow-content .hp-flow-chapter :is(h2,h3,.hp-est-plan-link) { color: #17272e; }
.hp-flow-content .hp-flow-chapter :is(p,.hp-eyebrow,.prompt,.caveat,.hp-caption) { color: #46555c; }
.hp-flow-content .hp-flow-chapter h2 { font-size: clamp(34px,3.5vw,52px); line-height: 1.05; max-width: 23ch; }
.hp-flow-content .hp-est-preview { justify-self: start; margin: 0; }
.hp-flow-content .hp-est-outputs { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 28px; border-color: #bdc9cd; }
.hp-flow-content .hp-est-outputs li { padding: 0; border: 0; }
.hp-flow-content .hp-est-follow { display: block; border-color: #bdc9cd; }
.hp-flow-content .hp-est-follow p { margin-top: 10px; }
.hp-flow-content .hp-op-body > p { max-width: 60ch; }
.hp-flow-content .hp-principles { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 28px; }
.hp-flow-content .hp-principles li { display: block; }
.hp-flow-content .hp-principles h3 { margin-top: 16px; }
.hp-flow-content .hp-principles p { margin-top: 10px; }
.hp-flow-content .hp-choice { padding: 18px; }
.hp-flow-content :is(.hp-choice,.hp-est-plan-link):focus-visible { outline: 2px solid #b72f29; outline-offset: 4px; }
@media (min-width:768px) and (max-width:1100px) {
  .hp-scroll-copy-flow .hp-flow-content :is(.hp-flow-message,.hp-plan-summary,.hp-story-card) { width: 86%; }
  .hp-flow-content .hp-flow-chapter > .wrap { column-gap: 16px; }
  .hp-flow-content .hp-flow-chapter .hp-est-preview { grid-column: 8 / -1; }
  .hp-flow-content .hp-flow-chapter :is(.hp-est-follow,.hp-op-body) { grid-column: 2 / -1; }
  .home .hp-scroll-copy-flow .hp-flow-content .hp-flow-message h1 { font-size: 46px; }
  .home .hp-scroll-copy-flow .hp-flow-content :is(.hp-flow-message,.hp-plan-summary,.hp-story-card) h2 { font-size: 40px; }
  .hp-scroll-copy-flow .hp-flow-content :is(.hp-flow-message,.hp-plan-summary,.hp-story-card) :is(.hp-hero-body,.promise) { font-size: 15px; }
  .hp-scroll-copy-flow .hp-flow-content .hp-flow-message .hp-eyebrow { font-size: 11px; }
  .hp-scroll-copy-flow .hp-flow-content .hp-flow-message .btn { min-height: 46px; font-size: 14px; }
}
@media (max-width:767px) {
  .hp-est-with-plan > .wrap { grid-template-areas: "lead" "summary"; }
  .hp-hero-background[data-scene-obscured="true"] .hp-equipment-cards:not(.hp-equipment-cards-inline) { visibility: hidden; }
  .hp-hero-background[data-scene-crowded="true"] :is(.hp-scene-frame,.hp-hero-plan,.hp-operations-sheet) { visibility: hidden; }
  .hp-flow-content .hp-flow-chapter > .wrap { grid-template-columns: minmax(0,1fr); gap: 40px; }
  .hp-flow-content .hp-flow-chapter .wrap > :not(.hp-op-fig) { grid-column: 1 / -1; }
  .hp-flow-content .hp-est-outputs, .hp-flow-content .hp-principles { grid-template-columns: minmax(0,1fr); }
  .hp-flow-content .hp-principles { gap: 0; }
  .hp-flow-content .hp-flow-chapter h2 { font-size: 34px; }
  .hp-flow-content .hp-flow-chapter p { font-size: 14px; line-height: 1.45; }
  .hp-est .hp-plan-specs { padding: 0; }
  .hp-plan-specs li { font-size: 11px; }
  .hp-est .hp-plan-specs .hp-equipment-note { font-size: 10px; }
  .hp-scroll-copy-flow .hp-flow-content :is(.hp-flow-message,.hp-plan-summary,.hp-story-card) { width: 100%; margin-left: 0; }
  .hp-scroll-copy-flow .hp-flow-content :is(.hp-flow-message,.hp-plan-summary,.hp-story-card) { padding: 22px; border-radius: 26px; }
  .home .hp-scroll-copy-flow .hp-flow-content .hp-flow-message :is(h1,h2) { font-size: 34px; margin-top: 8px; }
  .home .hp-scroll-copy-flow .hp-flow-content :is(.hp-flow-message,.hp-plan-summary,.hp-story-card) h2 { font-size: 34px; margin-top: 0; }
  .hp-scroll-copy-flow .hp-flow-content .hp-flow-message .hp-eyebrow { font-size: 11px; }
  .hp-scroll-copy-flow .hp-flow-content :is(.hp-flow-message,.hp-plan-summary,.hp-story-card) :is(.hp-hero-body,.promise) { font-size: 13px; line-height: 1.4; margin-top: 8px; }
  .hp-scroll-copy-flow .hp-flow-content :is(.hp-flow-message,.hp-plan-summary,.hp-story-card) .hp-acts { flex-wrap: nowrap; gap: 8px; }
  .hp-scroll-copy-flow .hp-flow-content :is(.hp-flow-message,.hp-plan-summary,.hp-story-card) .btn { flex: 1; min-width: 0; min-height: 42px; padding: 8px; font-size: 13px; line-height: 1.3; text-align: center; }
  .hp-scroll-copy-flow .hp-flow-content .hp-flow-message .hp-act-note { font-size: 11px; }
  .hp-scroll-copy-flow .hp-flow-content .hp-flow-message .hp-hero-support { font-size: 10px; }
}
@media (max-width:767px) and (max-height:720px) {
  .hp-scroll-copy-flow .hp-flow-content :is(.hp-flow-message,.hp-plan-summary,.hp-story-card) { padding: 18px; }
  .home .hp-scroll-copy-flow .hp-flow-content .hp-flow-message :is(h1,h2) { font-size: 28px; margin-top: 6px; }
  .home .hp-scroll-copy-flow .hp-flow-content :is(.hp-flow-message,.hp-plan-summary,.hp-story-card) h2 { font-size: 28px; margin-top: 0; }
  .hp-scroll-copy-flow .hp-flow-content :is(.hp-flow-message,.hp-plan-summary,.hp-story-card) :is(.hp-hero-body,.promise) { font-size: 12px; line-height: 1.35; margin-top: 7px; }
  .hp-scroll-copy-flow .hp-flow-content .hp-flow-message .hp-hero-actions { margin-top: 10px; }
  .hp-hero-background .hp-equipment-card { padding: 7px 9px; }
  .hp-hero-background .hp-equipment-card li { font-size: 10px; line-height: 1.35; }
  .hp-hero-background .hp-equipment-card .hp-equipment-note { font-size: 9px; line-height: 1.3; margin-top: 5px; }
}
@media (max-width:360px) {
  .home .hdr-in { gap: 6px; }
  .home .hdr-logo img { height: 26px; }
  .home .hdr .btn-sm { padding: 0 8px; font-size: 12px; }
}

/* Compact technical lines follow the reference: text, separators, then leaders. */
.hp-spec-lines { border:0; gap:2px; align-items:start; }
.hp-spec-line, .hp-flow-content .hp-spec-line { display:flex; flex-wrap:wrap; width:fit-content; max-width:100%; gap:3px 9px; margin:0; padding:7px 0; border:0; font:400 13px/1.5 "Courier New",monospace; color:#263c46; }
.hp-spec-line span:first-child::after { content:" |"; margin-left:9px; color:#789095; }
.hp-spec-line span:last-child { flex:0 1 auto; }
@media(max-width:767px) { .hp-spec-line, .hp-flow-content .hp-spec-line { font-size:11px; gap:2px 7px; padding:6px 0; } }

/* Only technical annotations print and erase; copy and actions keep native flow. */
.hp-scroll-story .hp-spec-line { clip-path:inset(0 calc((1 - var(--spec-print,0))*100%) 0 0); }

/* The operation chapter alternates storage and traffic in one reserved position. */
.hp-scroll-story .hp-flow-estimate .hp-spec-lines > .hp-spec-line { grid-area:1 / 1; align-self:start; }

/* The supporting chapters use the same reading column as the opening three. */
.hp-narrative { background: #e9eeef; border: 0; padding: clamp(48px,8svh,80px) 0; }
.home :is(.hp-narrative,.hp-est,#contact,#founders) { scroll-margin-top: 104px; }
.hp-narrative > .wrap { display: block; }
.hp-narrative .hp-story-card { min-width: 0; }
.hp-narrative .hp-sec-head { display: block; margin-bottom: 24px; }
.hp-narrative .hp-sec-head .intro { margin-top: 12px; max-width: 58ch; }
.hp-narrative .hp-story-card p { font-size: 17px; line-height: 1.5; }
.hp-narrative .hp-story-card h2 { max-width: 22ch; }
.hp-narrative .hp-story-card .hp-eyebrow { font-size: 12px; margin-bottom: 12px; }
.hp-narrative .hp-room-grid { display: block; border: 0; }
.hp-narrative .hp-room {
  display: grid; grid-template-columns: 64px minmax(0,1fr); gap: 6px 16px;
  padding: 20px 0; border: 0; border-top: 1px solid #c0cccf;
}
.hp-narrative .hp-room:last-child { padding-bottom: 0; }
.hp-narrative .hp-room .lbl { grid-column: 1; grid-row: 1 / span 3; margin: 5px 0 0; font-size: 11px; }
.hp-narrative .hp-room :is(h3,p,.go) { grid-column: 2; margin: 0; max-width: none; }
.hp-narrative .hp-room h3 { font-size: 23px; }
.hp-narrative .hp-room p { font-size: 16px; }
.hp-narrative .hp-room .go { justify-self: start; font-size: 14px; margin-top: 3px; }
.hp-narrative .hp-part-row { display: block; }
.hp-narrative .hp-part { border: 0; border-bottom: 1px solid #c0cccf; padding: 18px 0; }
.hp-narrative .hp-part:last-child { border-bottom: 0; padding-bottom: 0; }
.hp-narrative .hp-part .t { font-size: 22px; }
.hp-narrative .hp-part .d { max-width: none; font-size: 16px; }
.hp-narrative .hp-op-body p { max-width: 62ch; }
.hp-narrative .hp-op-body p:first-child { margin-top: 16px; }
.hp-plan-benefits { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; list-style: none; padding: 0; margin: 22px 0 16px; }
.hp-plan-benefits li { padding-top: 10px; border-top: 2px solid #8ba7ae; font-size: 18px; font-weight: 600; line-height: 1.3; }
.hp-scroll-copy-flow .hp-flow-content .hp-plan-summary .hp-estimate-note { margin-top: 12px; font-size: 13px; line-height: 1.5; color: #46555c; }
.hp-room-parts { margin-top: 24px; border-top: 1px solid #c0cccf; }
.hp-room-parts summary { cursor: pointer; padding-top: 18px; font-size: 18px; font-weight: 600; line-height: 1.4; }
.hp-room-parts summary::marker { color: #476c76; }
.hp-room-parts summary:focus-visible { outline: 2px solid #b72f29; outline-offset: 5px; }
.hp-room-parts > p { margin: 12px 0 18px; }
.hp-narrative .hp-proof-heading { margin-top: 28px; margin-bottom: 16px; font-size: 22px; line-height: 1.25; }
.home #capabilities { scroll-margin-top: 104px; }
.hp-narrative .hp-recs { gap: 28px; }
.hp-narrative .hp-rec { padding: 20px 0; gap: 18px; }
.hp-narrative .hp-rec .n { font-size: 48px; }
.hp-narrative .hp-rec dl { grid-template-columns: 66px minmax(0,1fr); gap: 6px 10px; font-size: 15px; }
.hp-narrative .hp-rec dd:first-of-type { font-size: 17px; }
.hp-narrative .hp-rec dt { font-size: 12px; }
.hp-narrative .hp-figs { background: transparent; border-color: #c0cccf; margin-top: 12px; }
.hp-proof-figures { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 20px; padding: 20px 0; }
.hp-proof-figures .v { font-size: 24px; line-height: 1.15; }
.hp-proof-figures .k { font-size: 12px; line-height: 1.4; }

/* A full-width split close follows the uninterrupted whole-room reveal. */
.hp-story-close { position: relative; background: #e9eeef; color: #17272e; }
.hp-story-close > .wrap {
  display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 4%; align-items: center;
  min-height: min(800px,calc(100svh - 80px)); padding-top: 72px; padding-bottom: 72px;
}
.hp-close-copy { padding-left: calc(8% + 36px); min-width: 0; }
.hp-close-copy h2 { font-size: clamp(34px,3.5vw,52px); line-height: 1.05; max-width: 18ch; }
.hp-close-copy p { margin-top: 18px; max-width: 38ch; font-size: 17px; }
.hp-close-phone { display: inline-block; margin-top: 20px; color: #46555c; font-size: 16px; text-underline-offset: 4px; }
.hp-close-figure { margin: 0; min-width: 0; }
.hp-close-figure img {
  display: block; width: 100%; height: auto;
  -webkit-mask-image: radial-gradient(ellipse 72% 70% at 49% 54%,#000 48%,transparent 75%),linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent),linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent);
  mask-image: radial-gradient(ellipse 72% 70% at 49% 54%,#000 48%,transparent 75%),linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent),linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent);
  -webkit-mask-composite: source-in; mask-composite: intersect;
}
.hp-flow-content .hp-story-close.hp-flow-chapter { background: #e9eeef; pointer-events: auto; }
.hp-flow-content .hp-story-close.hp-flow-chapter > .wrap { display: grid; }
.hp-flow-content .hp-story-close h2 { max-width: 18ch; }
.home .hp-faq { background: #f4f7f7; padding: clamp(56px,8svh,88px) 0; }
.home .hp-faq .wrap { grid-template-columns: minmax(0,5fr) minmax(0,7fr); gap: 48px; }
.home .hp-contact { background: #e9eeef; border-color: #d5dfe1; padding: clamp(56px,8svh,88px) 0; }
.home .hp-contact .form-card { border-radius: 26px; border-color: #fff; background: rgba(255,255,255,.42); padding: 32px; }
.home .hp-contact .field { background: rgba(255,255,255,.82); border-color: #c0cccf; }
.home :is(.hp-faq,.hp-contact) h2 { font-size: clamp(34px,3.5vw,52px); line-height: 1.05; }
@media (max-width:1100px) and (min-width:768px) {
  .hp-close-copy { padding-left: calc(8% + 24px); }
}
@media (max-width:767px) {
  .home :is(.hp-narrative,.hp-est,#contact,#founders) { scroll-margin-top: 92px; }
  .home #capabilities { scroll-margin-top: 92px; }
  .hp-plan-benefits { grid-template-columns: minmax(0,1fr); gap: 8px; margin: 18px 0 14px; }
  .hp-plan-benefits li { border-top: 0; border-left: 2px solid #8ba7ae; padding: 2px 0 2px 12px; font-size: 16px; }
  .hp-room-parts summary { font-size: 16px; }
  .hp-narrative .hp-proof-heading { font-size: 19px; }
  .hp-narrative .hp-story-card p { font-size: 14px; }
  .hp-narrative .hp-room { grid-template-columns: 1fr; gap: 7px; padding: 18px 0; }
  .hp-narrative .hp-room .lbl { grid-column: 1; grid-row: auto; margin: 0; }
  .hp-narrative .hp-room :is(h3,p,.go) { grid-column: 1; }
  .hp-narrative .hp-room h3,.hp-narrative .hp-part .t { font-size: 21px; }
  .hp-narrative .hp-part .d { font-size: 14px; }
  .hp-narrative .hp-recs { grid-template-columns: 1fr; gap: 8px; }
  .hp-narrative .hp-rec { grid-template-columns: 1fr 1.3fr; align-items: start; gap: 12px; }
  .hp-narrative .hp-rec .n { font-size: 36px; }
  .hp-narrative .hp-rec .n small { display: block; margin: 8px 0 0; font-size: 12px; }
  .hp-narrative .hp-rec dl { grid-template-columns: 1fr; gap: 4px; font-size: 14px; }
  .hp-narrative .hp-rec dd:first-of-type { font-size: 15px; }
  .hp-narrative .hp-rec dt:not(:first-child) { margin-top: 8px; }
  .hp-proof-figures { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
  .hp-proof-figures .v { font-size: 24px; }
  .hp-story-close > .wrap,.hp-flow-content .hp-story-close.hp-flow-chapter > .wrap {
    grid-template-columns: minmax(0,1fr); gap: 32px; min-height: 0; padding-top: 40px; padding-bottom: 48px;
  }
  .hp-close-copy { padding: 0 22px; }
  .hp-close-copy h2,.hp-flow-content .hp-story-close h2 { max-width: 15ch; }
  .hp-close-copy p { font-size: 15px; }
  .hp-close-figure { width: 100%; max-width: 520px; justify-self: center; }
  .home .hp-faq .wrap { grid-template-columns: minmax(0,1fr); gap: 24px; }
  .home .hp-faq details.faq summary { font-size: 17px; }
  .home .hp-faq details.faq p { font-size: 15px; }
  .home .hp-contact .form-card { padding: 22px; }
}

/* Give the opening drawing a clear right-hand column above the fold. */
.hp-hero-outputs { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; list-style: none; padding: 0; margin: 0 0 24px; }
.hp-hero-outputs li { border-top: 2px solid #8ba7ae; padding-top: 10px; color: #263c46; font-size: 15px; font-weight: 600; line-height: 1.3; }
.home .hp-hero-foot { display: block; }
.hp-hero-project { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 18px; padding-top: 20px; margin-top: 20px; border-top: 1px solid #c0cccf; text-decoration: none; color: #263c46; pointer-events: auto; }
.hp-hero-project strong { font-size: 32px; letter-spacing: -.035em; line-height: 1.1; white-space: nowrap; }
.hp-hero-project strong small { font-size: 13px; font-weight: 400; letter-spacing: 0; }
.hp-hero-project > span { font-size: 14px; line-height: 1.4; }
.hp-hero-project > span small { display: block; font-size: 12px; color: #46555c; margin-top: 3px; }
.hp-hero-project .hp-project-arrow { font-size: 22px; color: #b72f29; }
.hp-hero-project:hover { border-color: #b72f29; }
.hp-hero-project:focus-visible { outline: 2px solid #b72f29; outline-offset: 6px; }
@media (min-width:1100px) {
  .hp-scroll-copy-flow .hp-flow-content .hp-flow-intro .hp-flow-message { width: min(44%,560px); }
  .home .hp-scroll-copy-flow .hp-flow-content .hp-flow-intro h1 { font-size: clamp(42px,3.8vw,56px); }
}
@media (max-width:767px) {
  .hp-hero-outputs { gap: 10px; margin-bottom: 18px; }
  .hp-hero-outputs li { font-size: 12px; padding-top: 8px; }
  .hp-hero-project { gap: 12px; padding-top: 16px; margin-top: 16px; }
  .hp-hero-project strong { font-size: 26px; }
  .hp-hero-project strong small { display: block; font-size: 11px; margin-top: 3px; }
  .hp-hero-project > span { font-size: 12px; }
  .hp-hero-project > span small { font-size: 11px; }
}
/* Static fallback must keep the project record in flow below the offer. */
.home main > .hp-hero-background .hp-hero-foot { position: relative; padding-top: 0; padding-bottom: 28px; }

/* Finished installation first; the illustration resolves into the working plan. */
.hp-hero-background::before { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(180deg,rgba(10,23,30,.12),transparent 70%); opacity: var(--opening-copy,1); }
.hp-hero-background::after { opacity: calc((1 - var(--plant-focus,0))*(1 - var(--opening-photo,1))*(1 - var(--opening-copy,1))); }
.hp-hero-background .hp-opening-photo { visibility: visible; position: absolute; inset: 0; z-index: 0; overflow: hidden; background: #172a31; opacity: var(--opening-photo,1); }
/* Tighten the registered crop another 5%, trimming the right and bottom yard.
   The 3D camera reads this box, so its opening view follows the same crop. */
/* v8 photograph is framed for the page: full bleed, no enlargement. */
.hp-opening-photo img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 50% 50%; transform: none; }
.hp-opening-photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg,rgba(10,23,30,.3),transparent 45%); }
.hp-hero-plan { mix-blend-mode: multiply; }
.home .hp-intro-drawing-note { position: absolute; bottom: 22px; left: 28px; z-index: 1; margin: 0; color: #d9e4e8; font: 400 10px/1.5 'Courier New',monospace; opacity: var(--opening-photo,1); pointer-events: none; }
.hp-intro-drawing-note span { display: none; }
.hp-scroll-copy-flow .hp-flow-content .hp-flow-intro .hp-flow-message { width: min(88%,1000px); margin-left: 0; margin-right: auto; padding: clamp(24px,2.2vw,32px); background: linear-gradient(135deg,rgba(255,255,255,.78),rgba(242,248,250,.68) 65%,rgba(255,255,255,.74)); }
.home .hp-scroll-copy-flow .hp-flow-content .hp-flow-intro h1 { font-size: clamp(42px,4.2vw,60px); line-height: 1.05; letter-spacing: -.04em; margin-top: 14px; max-width: none; color: #17272e; }
.hp-scroll-copy-flow .hp-flow-content .hp-flow-intro :is(.hp-hero-body,.hp-eyebrow,.hp-act-note,.hp-hero-support) { color: #263c46; }
.hp-scroll-copy-flow .hp-flow-content .hp-flow-intro .hp-hero-body { font-size: 18px; line-height: 1.55; max-width: none; margin-top: 18px; }
.hp-scroll-copy-flow .hp-flow-content .hp-flow-intro .hp-hero-actions { margin-top: 22px; }
.hp-scroll-copy-flow .hp-flow-content .hp-flow-intro .btn { min-height: 56px; padding-inline: 25px; font-size: 16px; border-radius: 5px; }
.hp-scroll-copy-flow .hp-flow-content .hp-flow-intro .hp-hero-foot { padding-top: 18px; }
.hp-scroll-copy-flow .hp-flow-content .hp-flow-intro .hp-hero-support { font-size: 13px; line-height: 1.6; max-width: none; }
.hp-flow-intro > .wrap { padding-top: 0; }
@media(min-width:768px) {
  .hp-scroll-copy-flow .hp-flow-content { padding-top: 24px; }
  .hp-flow-intro { min-height: calc(100svh - var(--story-header) - 24px); }
  .hp-scroll-copy-flow .hp-flow-content .hp-flow-intro .hp-hero-actions { display: flex; align-items: center; gap: 20px; }
  .hp-scroll-copy-flow .hp-flow-content .hp-flow-intro .hp-act-note { margin: 0; max-width: 29ch; }
  .hp-scroll-copy-flow .hp-flow-content .hp-flow-intro .hp-hero-foot { padding-top: 14px; }
}
@media(min-width:768px) and (max-width:1099px) {
  .home .hp-scroll-copy-flow .hp-flow-content .hp-flow-intro h1 { font-size: clamp(40px,5vw,54px); }
  .hp-scroll-copy-flow .hp-flow-content .hp-flow-intro .hp-flow-message { width: 94%; }
  .hp-scroll-copy-flow .hp-flow-content .hp-flow-intro .hp-hero-body { font-size: 16px; }
  .hp-opening-photo img { object-position: 68% center; }
}
@media(max-width:767px) {
  .hp-flow-intro > .wrap { padding-top: 0; }
  .hp-scroll-copy-flow .hp-flow-content .hp-flow-intro .hp-flow-message { width: 100%; margin-left: 0; padding: 22px; }
  .home .hp-scroll-copy-flow .hp-flow-content .hp-flow-intro h1 { font-size: clamp(30px,8.7vw,40px); margin-top: 14px; max-width: none; }
  .hp-scroll-copy-flow .hp-flow-content .hp-flow-intro .hp-hero-body { font-size: 14px; margin-top: 14px; }
  .hp-scroll-copy-flow .hp-flow-content .hp-flow-intro .hp-hero-actions { margin-top: 18px; }
  .hp-scroll-copy-flow .hp-flow-content .hp-flow-intro .btn { min-height: 50px; }
  .hp-scroll-copy-flow .hp-flow-content .hp-flow-intro .hp-hero-foot { padding-top: 16px; }
  .hp-scroll-copy-flow .hp-flow-content .hp-flow-intro .hp-hero-support { font-size: 11px; max-width: none; }
  .hp-opening-photo img { position: absolute; left: -37.6%; right: auto; top: auto; bottom: 5%; width: 175.2%; max-width: none; height: auto; transform: none; -webkit-mask-image: linear-gradient(180deg,transparent,#000 26%,#000 82%,transparent); mask-image: linear-gradient(180deg,transparent,#000 26%,#000 82%,transparent); }
  .hp-hero-background::before { background: linear-gradient(180deg,rgba(23,42,49,.14),transparent 65%); }
  .hp-opening-photo::after { background: none; }
  .hp-intro-drawing-note { left: 16px; bottom: 12px; font-size: 9px; }
}
/* Keep the wide offer when motion/WebGL is unavailable. */
.home main > .hp-hero-background { min-height: calc(100svh - 80px); }
.home main > .hp-hero-background .hp-hero-in { align-items: flex-start; margin: 32px var(--hp-inset) 20px; width: min(calc(100% - 2*var(--hp-inset)),1000px); padding: 32px; border: 1px solid rgba(255,255,255,.32); border-radius: 30px; background: rgba(247,251,252,.78); backdrop-filter: blur(6px) saturate(1.12); -webkit-backdrop-filter: blur(6px) saturate(1.12); box-shadow: inset 0 1px 1px rgba(255,255,255,.32); }
.home main > .hp-hero-background .hp-hero-in > * { width: 100%; max-width: none; }
.home main > .hp-hero-background .hp-hero-in h1 { font-size: clamp(42px,4.8vw,74px); color: #17272e; }
.home main > .hp-hero-background .hp-hero-in :is(.hp-hero-body,.hp-eyebrow,.hp-act-note) { color: #263c46; }
.home main > .hp-hero-background .hp-hero-foot { width: min(88%,920px); margin-left: var(--hp-inset); margin-right: auto; padding: 0 0 40px; }
.home main > .hp-hero-background .hp-hero-plan { display: none; }
@media(max-width:767px) {
  .home main > .hp-hero-background .hp-hero-in { padding: 22px; }
  .home main > .hp-hero-background .hp-hero-in > * { width: 100%; }
  .home main > .hp-hero-background .hp-hero-in h1 { font-size: clamp(30px,8.7vw,40px); }
  .home main > .hp-hero-background .hp-hero-foot { width: auto; margin-inline: var(--hp-inset); }
}
