:root{--paper:var(--hc-color-paper);--ink:var(--hc-color-ink);--red:var(--hc-color-brand);--muted:var(--hc-color-muted)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font:var(--hc-text-body)/1.6 var(--hc-font-body);color:var(--ink);background:var(--paper)}a{color:inherit;text-decoration:none}a:hover{color:var(--red)}a:focus-visible{outline:0.125rem solid var(--red);outline-offset:0.375rem}.shell{max-width:var(--hc-content-width);margin:auto;padding:0 var(--hc-space-64)}.page{overflow:hidden}.logo{width:10.5625rem;height:3.5625rem;object-fit:contain}nav{height:5.25rem;display:flex;align-items:center;justify-content:space-between}.navlinks{display:flex;gap:var(--hc-space-32);align-items:center;font-size:var(--hc-text-s)}.hero{height:41.25rem;position:relative;color:white;background:#0a0b0b;isolation:isolate}.hero-photo{position:absolute;width:100%;height:100%;object-fit:cover;object-position:70% 52%;z-index:-3}.shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(8,10,10,.9),rgba(8,10,10,.55) 30%,transparent 68%)}.hero .shell{height:100%;display:flex;align-items:flex-end;padding-bottom:var(--hc-space-58);position:relative}.hero-copy{max-width:30.625rem}.hero h1{font:400 var(--hc-heading-hero)/1.08 RC;margin:0 0 var(--hc-space-20);letter-spacing:-0.03125rem}.hero p{max-width:25rem;color:#e1e4e2;font-size:var(--hc-text-m);margin:0 0 var(--hc-space-27)}.cta{display:inline-flex;align-items:center;gap:var(--hc-space-35);background:var(--red);color:white;padding:var(--hc-space-12) var(--hc-space-19);border-radius:0.25rem;font-size:var(--hc-text-s)}.cta:hover{background:var(--hc-color-brand-hover);color:white}.ghost-hex{position:absolute;right:2.75rem;bottom:2.375rem;width:13.5rem;height:11.875rem;fill:none;stroke:#ffffff69;stroke-width:.7}.intro{padding-top:var(--hc-space-95);padding-bottom:var(--hc-space-95);position:relative}.intro h2{font:400 var(--hc-heading-section)/1.13 RC;max-width:33.75rem;margin:0 0 var(--hc-space-27)}.intro p{max-width:34.0625rem;color:var(--muted);margin:0 0 var(--hc-space-18)}.intro .mark{position:absolute;right:7.1875rem;top:5.125rem;width:20.625rem;height:15.625rem;fill:none;stroke:#d7dcd9;stroke-width:.7}.textlink{display:inline-flex;gap:var(--hc-space-34);font-size:var(--hc-text-link);padding-bottom:var(--hc-space-5);border-bottom:0.0625rem solid #a2a7a4}.product{margin:0 var(--hc-space-24);background:var(--hc-color-ink);color:var(--paper);border-radius:0.4375rem;position:relative;overflow:hidden}.product-inner{max-width:82rem;margin:auto;padding:var(--hc-space-65) var(--hc-space-40) var(--hc-space-50)}.product-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:var(--hc-space-65);align-items:center}.product-picture{width:100%;height:26.5625rem;object-fit:cover;clip-path:url(#rounded-hex);border-radius:0.5rem}.product h2{font:400 var(--hc-heading-product)/1.1 RC;margin:0 0 var(--hc-space-24)}.product p{color:#d4d8d5;margin:0 0 var(--hc-space-28);font-size:var(--hc-text-body)}.models{display:flex;gap:var(--hc-space-36);margin-bottom:var(--hc-space-33)}.models>div{flex:1}.models strong{font:400 2rem RC}.models p{font-size:var(--hc-text-s);margin:var(--hc-space-7) 0 0;max-width:10rem}.product .textlink{border-color:#777f7b}.product-bottom{display:flex;gap:var(--hc-space-60);border-top:0.0625rem solid #4d5450;margin-top:var(--hc-space-45);padding-top:var(--hc-space-23);font-size:var(--hc-text-s);color:#c9ceca}.product-bottom span:first-child{color:white}.solution{padding-top:var(--hc-space-110);padding-bottom:var(--hc-space-105)}.solution-head{max-width:36.25rem;margin-bottom:var(--hc-space-50)}.solution h2{font:400 var(--hc-heading-section)/1.13 RC;margin:0 0 var(--hc-space-24)}.solution-head p{color:var(--muted);margin:0}.uses{display:grid;grid-template-columns:1fr 1fr;gap:var(--hc-space-68);margin-left:22%}.uses h3{font:400 1.8125rem/1.2 RC;margin:0 0 var(--hc-space-16)}.uses p{color:var(--muted);font-size:var(--hc-text-m);margin:0;max-width:25.625rem}.uses .redline{width:2.625rem;height:0.1875rem;background:var(--red);margin-bottom:var(--hc-space-22)}.planning{display:grid;grid-template-columns:1fr 1fr;gap:var(--hc-space-80);align-items:center;padding-bottom:var(--hc-space-105)}.planning-image{height:25.625rem;width:100%;object-fit:cover;border-radius:0.375rem}.planning h2{font:400 2.6875rem/1.15 RC;margin:0 0 var(--hc-space-24)}.planning p{color:var(--muted);margin:0 0 var(--hc-space-28);max-width:27.5rem}.contact{background:var(--hc-color-neutral);padding:var(--hc-space-58) 0;position:relative}.contact .shell{display:flex;justify-content:space-between;align-items:center;gap:var(--hc-space-40)}.contact h2{font:400 2.5rem/1.15 RC;margin:0 0 var(--hc-space-12)}.contact p{margin:0;color:var(--muted);font-size:var(--hc-text-m)}footer{min-height:8.625rem;display:flex;justify-content:space-between;align-items:center;font-size:var(--hc-text-s)}.footer-links{display:flex;gap:var(--hc-space-32)}.defs{position:absolute;width:0;height:0;overflow:hidden}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* v5: actual hexagon proportions; user-requested rounded surfaces and bento. */
.cta{border-radius:0.625rem}.product{border-radius:var(--hc-radius-panel)}.product-picture{width:min(100%,30.625rem);height:auto;aspect-ratio:1.154700538;justify-self:center;object-fit:cover}.ghost-hex{width:13.5rem;height:auto;aspect-ratio:110/95}.intro .mark{width:20.625rem;height:auto;aspect-ratio:180/145}.product-bottom{gap:var(--hc-space-45)}.hex-button{display:inline-flex;align-items:center;justify-content:space-between;gap:var(--hc-space-25);background:#ebece8;border-radius:0.75rem;padding:var(--hc-space-12) var(--hc-space-12) var(--hc-space-12) var(--hc-space-21);font-size:var(--hc-text-link);min-height:3.625rem;transition:background .18s,color .18s}.hex-button svg{width:2.375rem;height:2.0625rem;fill:var(--red);transition:transform .18s}.hex-button:hover{background:#e1e3dd;color:var(--ink)}.hex-button:hover svg{transform:rotate(60deg)}.product .hex-button{background:#414644;color:white}.product .hex-button:hover{background:#535a56}.product .hex-button svg{fill:#fff}.solution{padding-top:var(--hc-space-95);padding-bottom:var(--hc-space-75)}.solution-head{max-width:41.875rem;margin-bottom:var(--hc-space-38)}.bento{display:grid;grid-template-columns:1.13fr 1fr;grid-template-rows:1fr 1fr;gap:var(--hc-space-20)}.bento article{border-radius:var(--hc-radius-card);overflow:hidden}.bento h3{font:400 var(--hc-heading-card)/1.13 RC;margin:0 0 var(--hc-space-18)}.bento p{font-size:var(--hc-text-m);color:var(--muted);margin:0;max-width:25.625rem}.bento-main{grid-row:span 2;background:var(--hc-color-neutral);display:flex;flex-direction:column}.bento-main img{width:100%;height:17.8125rem;object-fit:cover;mix-blend-mode:multiply}.bento-main>div{padding:var(--hc-space-32) var(--hc-space-38) var(--hc-space-38)}.bento-air,.bento-heat{padding:var(--hc-space-38) var(--hc-space-38) var(--hc-space-34);display:flex;flex-direction:column;justify-content:space-between;gap:var(--hc-space-24)}.bento-air{background:var(--hc-color-sage)}.bento-heat{background:var(--hc-color-clay)}.planning-v5{display:grid;grid-template-columns:1fr 1fr;gap:var(--hc-space-80);align-items:center;padding-top:var(--hc-space-30);padding-bottom:var(--hc-space-90)}.planning-v5 h2{font:400 var(--hc-heading-planning)/1.15 RC;margin:0}.planning-v5 p{margin:0 0 var(--hc-space-25);color:var(--muted);max-width:29.375rem}.footer-v5{display:block;background:#111413;color:var(--hc-color-paper);padding:0;border-radius:0;position:relative;overflow:hidden}.footer-contact{display:flex;align-items:center;justify-content:space-between;gap:var(--hc-space-40);padding:var(--hc-space-68) 0 var(--hc-space-60)}.footer-label{font-size:var(--hc-text-link);color:#bdc6c0;margin:0 0 var(--hc-space-22)}.footer-contact h2{font:400 var(--hc-heading-footer)/1.12 RC;letter-spacing:-0.03125rem;margin:0 0 var(--hc-space-31)}.footer-v5 .hex-button{background:#f6f6f2;color:#202423}.footer-v5 .hex-button:hover{background:white}.footer-hex{width:15.625rem;height:auto;flex-shrink:0;fill:none;stroke:#535d56;stroke-width:.6}.footer-bottom{border-top:0.0625rem solid #37413a;display:flex;align-items:center;justify-content:space-between;gap:var(--hc-space-80);padding:var(--hc-space-36) 0 var(--hc-space-45)}.footer-brand{background:var(--hc-color-paper);padding:var(--hc-space-4) var(--hc-space-15);border-radius:0.625rem;display:block;line-height:0}.footer-brand .logo{width:9.1875rem;height:3.25rem}.footer-columns{display:flex;gap:var(--hc-space-65);font-size:var(--hc-text-s)}.footer-columns>div{display:grid;gap:var(--hc-space-10)}.footer-columns a{color:#d5dcd7}.footer-columns a:hover{color:white}@media(prefers-reduced-motion:reduce){.hex-button,.hex-button svg{transition:none}.hex-button:hover svg{transform:none}}

/* User refinement: small regular hexagon attached to the underline. */
.hex-button{position:relative;min-height:3rem;padding:var(--hc-space-9) 0 var(--hc-space-14);gap:var(--hc-space-26);border-radius:0;background:transparent;color:inherit;border-bottom:0.0625rem solid var(--red)}
.hex-button svg{width:1.443375rem;height:1.25rem;align-self:flex-end;margin-bottom:calc(-1 * var(--hc-space-24));fill:var(--red);transform:none}
.hex-button:hover{background:transparent;color:var(--red)}
.hex-button:hover svg{transform:none;fill:#a80c12}
.product .hex-button,.product .hex-button:hover{background:transparent;color:var(--hc-color-paper)}
.product .hex-button svg{fill:var(--red)}
.footer-v5 .hex-button,.footer-v5 .hex-button:hover{background:transparent;color:var(--hc-color-paper)}
.footer-v5 .hex-button svg{fill:var(--red)}

/* Stem and hexagon beside the label, aligned to its vertical centre. */
.hex-button{border-bottom:0;padding:var(--hc-space-12) 0;gap:var(--hc-space-20);min-height:3rem}
.hex-button svg{align-self:center;margin-bottom:0;width:1.443375rem;height:1.25rem;margin-left:var(--hc-space-36);position:relative}
.hex-button::after{content:"";position:absolute;right:0.7216875rem;top:50%;width:2.9716875rem;height:0.0625rem;background:var(--red);transform:translateY(-50%);pointer-events:none}

/* Compact brand-colour button with a 12 px stem. */
.hex-button,.product .hex-button,.footer-v5 .hex-button{background:var(--red);color:#fff;border-radius:0.5625rem;padding:var(--hc-space-11) var(--hc-space-16);min-height:2.75rem;gap:var(--hc-space-14);font-size:var(--hc-text-s)}
.hex-button svg,.product .hex-button svg,.footer-v5 .hex-button svg{width:1.1546875rem;height:1rem;margin-left:var(--hc-space-12);margin-bottom:0;fill:#fff;flex-shrink:0}
.hex-button::after{right:1.57734375rem;width:1.32734375rem;background:#fff}
.hex-button:hover,.product .hex-button:hover,.footer-v5 .hex-button:hover{background:var(--hc-color-brand-hover);color:#fff}
.hex-button:hover svg,.product .hex-button:hover svg,.footer-v5 .hex-button:hover svg{fill:#fff}

/* Compact monochrome text link; dark surfaces use a readable light variant. */
.hex-button{background:transparent;color:var(--hc-color-link);padding:var(--hc-space-10) 0;gap:var(--hc-space-13);border-radius:0;font-size:var(--hc-text-link);min-height:2.75rem}
.hex-button svg{width:0.866rem;height:0.75rem;margin-left:var(--hc-space-7);fill:currentColor}
.hex-button::after{right:0.433rem;width:0.8705rem;height:0.125rem;background:currentColor}
.hex-button:hover{background:transparent;color:var(--hc-color-link)}
.hex-button:hover svg{fill:currentColor}
.product .hex-button,.product .hex-button:hover,.footer-v5 .hex-button,.footer-v5 .hex-button:hover{background:transparent;color:var(--hc-color-paper);padding:var(--hc-space-10) 0;border-radius:0;font-size:var(--hc-text-link)}
.product .hex-button svg,.footer-v5 .hex-button svg,.product .hex-button:hover svg,.footer-v5 .hex-button:hover svg{width:0.866rem;height:0.75rem;margin-left:var(--hc-space-7);fill:currentColor}

/* Bold text variant with the short stem closer to the label. */
.hex-button,.product .hex-button,.footer-v5 .hex-button{font-weight:700;gap:var(--hc-space-6)}

/* Bold red link on light surfaces; lighter red for readable dark-surface links. */
.hex-button,.hex-button:hover{color:var(--hc-color-link-hover);font-weight:700}
.product .hex-button,.product .hex-button:hover,.footer-v5 .hex-button,.footer-v5 .hex-button:hover{color:var(--hc-color-link-inverse-hover);font-weight:700}

/* Bold monochrome links with a dotted underline beneath the label. */
.hex-button,.hex-button:hover{color:var(--hc-color-link);font-weight:700}
.product .hex-button,.product .hex-button:hover,.footer-v5 .hex-button,.footer-v5 .hex-button:hover{color:var(--hc-color-paper);font-weight:700}
.hex-button>span{position:relative}
.hex-button>span::after{content:"";position:absolute;left:0;right:0;bottom:-0.3125rem;border-bottom:0.125rem dotted currentColor}


/* Refined link hierarchy and matching pointer/keyboard emphasis. */
.hex-button,.product .hex-button,.footer-v5 .hex-button{font-weight:500}
.hex-button>span::after{bottom:-0.1875rem;border-bottom-width:0.0625rem}
.hex-button:hover,.hex-button:focus-visible{color:var(--hc-color-link-hover)}
.product .hex-button:hover,.product .hex-button:focus-visible,.footer-v5 .hex-button:hover,.footer-v5 .hex-button:focus-visible{color:var(--hc-color-link-inverse-hover)}

/* Hero primary action uses the same compact hexagon mark. */
.hero-cta{position:relative;gap:var(--hc-space-13);font-weight:500}
.hero-cta svg{width:0.866rem;height:0.75rem;fill:currentColor;flex-shrink:0}
.hero-cta::after{content:"";position:absolute;right:1.6205rem;top:50%;width:0.8705rem;height:0.125rem;background:currentColor;transform:translateY(-50%);pointer-events:none}

/* Reveal the short stem as the hexagon slides out; keep layout stable. */
.hex-button>span::after{content:"";opacity:.5}
.hex-button svg,.hero-cta svg{transform:translateX(-0.4375rem);transition:transform .24s ease}
.hex-button::after,.hero-cta::after{transform-origin:left center;transform:translateY(-50%) scaleX(0);transition:transform .24s ease}
.hex-button:hover svg,.hex-button:focus-visible svg,.hero-cta:hover svg,.hero-cta:focus-visible svg{transform:translateX(0)}
.hex-button:hover::after,.hex-button:focus-visible::after,.hero-cta:hover::after,.hero-cta:focus-visible::after{transform:translateY(-50%) scaleX(1)}
@media(prefers-reduced-motion:reduce){.hex-button svg,.hero-cta svg,.hex-button::after,.hero-cta::after{transition:none}}
.intro .mark{right:5.9375rem;top:4.375rem;width:26.875rem;height:auto;aspect-ratio:208/186;pointer-events:none}
.footer-brand{background:transparent;padding:0;border-radius:0}
.intro .mark{top:7.8125rem;aspect-ratio:158/92;stroke-width:.5}.footer-hex{aspect-ratio:158/92}
.footer-v5{background:var(--hc-color-footer)}

/* Primary button expands to make room for the revealed stem. */
.hero-cta{border-radius:var(--hc-radius-button);padding-right:var(--hc-space-12);gap:var(--hc-space-6);transition:padding-right .24s ease,gap .24s ease,background .18s ease}
.hero-cta svg{transform:none}
.hero-cta::after{right:1.183rem;transition:transform .24s ease,right .24s ease}
.hero-cta:hover,.hero-cta:focus-visible{padding-right:var(--hc-space-19);gap:var(--hc-space-13)}
.hero-cta:hover::after,.hero-cta:focus-visible::after{right:1.6205rem}
@media(prefers-reduced-motion:reduce){.hero-cta,.hero-cta::after{transition:none}}
.intro .mark{width:33.125rem;right:4rem;top:6.25rem;stroke-width:.4}.footer-hex{width:23.75rem;stroke-width:.4}
header .logo{width:12.1875rem;height:4.0625rem}.navlinks a{color:#111;font-weight:700}.navlinks a:hover,.navlinks a:focus-visible{color:var(--red)}

/* Responsive layout and keyboard interaction. Breakpoints follow content fit. */
body{font-family:var(--hc-font-body)}
.shell{padding-inline:var(--hc-gutter)}
a:focus-visible,button:focus-visible{outline:var(--hc-focus-width) solid currentColor;outline-offset:.375rem}
.skip-link{position:fixed;inset-block-start:1rem;inset-inline-start:1rem;z-index:100;background:var(--hc-color-paper);color:var(--hc-color-ink);padding:1rem;transform:translateY(-200%)}
.skip-link:focus{transform:none}
.menu-toggle{display:none;font:500 var(--hc-text-m)/1.2 var(--hc-font-body);color:var(--hc-color-ink);background:transparent;border:var(--hc-border-thin) solid currentColor;border-radius:var(--hc-radius-button);min-block-size:var(--hc-touch-target);padding:.625rem .875rem;cursor:pointer}
.navlinks a,.footer-columns a{display:inline-flex;align-items:center;min-block-size:var(--hc-touch-target)}
.footer-columns{row-gap:.25rem}
/* Content-fit breakpoints, independent of ACSS presets. */
@media (max-width:75rem){
 :root{--hc-gutter:2rem}
 .navlinks{gap:1.25rem}
 .intro .mark{width:36%;right:var(--hc-gutter);top:8rem}
 .product-grid{gap:2.5rem}
 .footer-hex{width:27%}
 .planning-v5{gap:3rem}
}
@media (max-width:60rem){
 :root{--hc-gutter:1.5rem}
 header nav{height:auto;min-height:5.25rem;flex-wrap:wrap;gap:.75rem;padding-block:.625rem}
 header .logo{width:10.5rem;height:auto}
 .js .menu-toggle{display:inline-flex;align-items:center}
 .navlinks{width:100%;flex-direction:column;align-items:stretch;gap:0;padding-block:.5rem}
 .js .navlinks{display:none}
 .js .navlinks[data-open="true"]{display:flex}
 .navlinks a{padding:.625rem 0;border-top:var(--hc-border-thin) solid #d7dcd9}
 .hero{height:auto;min-height:36rem}
 .hero .shell{min-height:36rem;padding-block:7rem 3rem;align-items:flex-end}
 .hero-copy{max-width:29rem}
 .hero h1{font-size:clamp(2.5rem,5.5vw,3.5rem)}
 .hero-photo{object-position:60% center}
 .shade{background:linear-gradient(90deg,rgba(8,10,10,.9),rgba(8,10,10,.5) 65%,rgba(8,10,10,.15))}
 .ghost-hex{width:8rem;right:1.5rem;bottom:2rem;opacity:.5}
 .intro{padding-block:4rem}
 .intro h2,.intro p{max-width:65%}
 .intro .mark{width:29%;top:6rem}
 .product{margin-inline:1rem}
 .product-inner{padding:2.5rem 1.5rem}
 .product-grid{grid-template-columns:1fr;gap:2.5rem}
 .product-picture{width:min(100%,26rem)}
 .product-bottom{flex-wrap:wrap;gap:.75rem 1.5rem;margin-top:2rem}
 .solution{padding-block:4rem}
 .bento{grid-template-columns:1fr 1fr;grid-template-rows:auto;gap:1rem}
 .bento-main{grid-column:1/-1;grid-row:auto}
 .bento-main img{height:19rem;object-position:center}
 .bento-air,.bento-heat,.bento-main>div{padding:1.75rem}
 .planning-v5{gap:2rem;padding-block:0 4rem}
 .footer-contact{padding-block:3rem;gap:2rem}
 .footer-contact h2{font-size:2.5rem}
 .footer-bottom{gap:2rem;padding-block:2rem;align-items:flex-start}
 .footer-columns{gap:2rem;flex-wrap:wrap}
}
@media (max-width:40rem){
 :root{--hc-gutter:1.25rem}
 .hero,.hero .shell{min-height:34rem}
 .hero .shell{padding-block:6rem 2.5rem}
 .hero h1{font-size:2.625rem}
 .hero p{max-width:23rem}
 .ghost-hex{display:none}
 .intro h2,.intro p{max-width:none}
 .intro h2,.solution h2,.product h2,.planning-v5 h2{font-size:2.25rem}
 .intro .mark{position:static;display:block;width:70%;max-width:20rem;margin:2.5rem auto 0}
 .hex-button{max-width:100%;justify-content:flex-start}
 .hex-button>span{min-width:0}
 .product .hex-button,.footer-v5 .hex-button{max-width:100%}
 .models{gap:1.5rem}
 .bento{grid-template-columns:1fr}
 .bento-main{grid-column:auto}
 .bento h3{font-size:2rem}
 .bento-main img{height:15rem}
 .planning-v5{grid-template-columns:1fr}
 .footer-contact{flex-direction:column;align-items:flex-start}
 .footer-contact h2{font-size:2.25rem}
 .footer-contact h2 br{display:none}
 .footer-hex{width:65%;max-width:19rem;align-self:flex-end}
 .footer-bottom{flex-direction:column}
 .footer-columns{display:grid;grid-template-columns:1fr 1fr;gap:1rem 2rem;width:100%}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}
/* Full-window mobile dialog: logo / centred navigation / contact action. */
.menu-toggle{gap:.625rem;align-items:center;border:0;padding:.625rem 0 .625rem .625rem}
.menu-icon{display:inline-flex;position:relative;inline-size:1.875rem;block-size:1.5rem;align-items:center}
.menu-icon::before,.menu-icon::after{content:"";position:absolute;inset-inline-start:0;block-size:.125rem;background:currentColor;border-radius:.0625rem}
.menu-icon::before{inset-block-start:.3125rem;inline-size:1.75rem}
.menu-icon::after{inset-block-end:.3125rem;inline-size:1.125rem}
.menu-icon svg{position:absolute;inset-inline-end:0;inset-block-end:.05rem;inline-size:.72rem;block-size:.625rem;fill:currentColor}
.mobile-menu{position:fixed;inset:0;border:0;margin:0;inline-size:100%;max-inline-size:none;block-size:100dvh;max-block-size:none;padding:0;background:var(--hc-color-paper);color:var(--hc-color-ink);overflow:auto}
.mobile-menu::backdrop{background:var(--hc-color-paper)}
.mobile-menu__inner{min-block-size:100%;display:flex;flex-direction:column;max-inline-size:40rem;margin-inline:auto;padding: max(1rem,env(safe-area-inset-top)) max(1.25rem,env(safe-area-inset-right)) max(1.5rem,env(safe-area-inset-bottom)) max(1.25rem,env(safe-area-inset-left))}
.mobile-menu__header{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.mobile-menu__logo{inline-size:10.5rem;block-size:auto}
.mobile-menu__close{display:inline-flex;align-items:center;gap:.625rem;min-block-size:var(--hc-touch-target);padding:.625rem 0 .625rem .625rem;border:0;background:transparent;color:inherit;font:500 var(--hc-text-m)/1.2 var(--hc-font-body);cursor:pointer}
.mobile-menu__close-icon{font-size:1.75rem;font-weight:400}
.mobile-menu__links{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem;padding-block:3rem}
.mobile-menu__links a{font:400 clamp(1.75rem,6vw,2.5rem)/1.2 var(--hc-font-heading);min-block-size:var(--hc-touch-target);display:flex;align-items:center;text-align:center}
.mobile-menu__action{align-self:center;text-align:center;padding-block-end:.5rem}
html:has(.mobile-menu[open]){overflow:hidden}
@media(max-width:60rem){.js .navlinks,.js .navlinks[data-open="true"]{display:none}}
.preview-nav{position:relative;color:#111;font-weight:700}
.preview-nav summary{min-block-size:var(--hc-touch-target);display:flex;align-items:center;gap:.5rem;cursor:pointer;list-style:none}
.preview-nav summary::-webkit-details-marker{display:none}
.preview-nav summary::after{content:'+';font-size:1.25rem;font-weight:400}
.preview-nav[open] summary::after{content:'−'}
.preview-nav summary:focus-visible{outline:var(--hc-focus-width) solid currentColor;outline-offset:.375rem}
.preview-nav__links{position:absolute;inset-block-start:100%;inset-inline-end:0;z-index:20;min-inline-size:13rem;padding:1rem 1.25rem;background:var(--hc-color-paper);border:var(--hc-border-thin) solid #d7dcd9;border-radius:var(--hc-radius-button);box-shadow:0 .5rem 1.5rem #0002}
.preview-nav__links a{white-space:nowrap}
.mobile-menu__guide{align-self:center;font-size:var(--hc-text-s);min-block-size:var(--hc-touch-target);display:flex;align-items:center;margin-block-end:.5rem;text-decoration:underline;text-underline-offset:.25rem}
@media(min-width:60.001rem) and (max-width:75rem){.navlinks{gap:.875rem}header .logo{width:10.5rem}}
.product-grid>*{min-inline-size:0}
.footer-contact>div{min-inline-size:0;max-inline-size:100%}
@media(max-width:40rem){
 .product h2,.footer-contact h2{overflow-wrap:anywhere;hyphens:auto}
 .product-grid,.bento,.planning-v5{min-inline-size:0}
}

/* Equal breathing room above and below the header logo. */
header nav{height:auto;padding-block:var(--hc-space-16)}
header nav>a:first-child{display:block;line-height:0}
header .logo{display:block}

.product{background:var(--hc-color-product)}

/* Matte graphite steel: restrained directional light and fine static grain. */
.product,.footer-v5{isolation:isolate;background:var(--hc-color-graphite)}
.product::before,.footer-v5::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(115deg,rgba(255,255,255,.055),transparent 38%,rgba(0,0,0,.14) 75%,rgba(255,255,255,.025)),repeating-linear-gradient(0deg,rgba(255,255,255,.012) 0,rgba(255,255,255,.012) .0625rem,transparent .0625rem,transparent .25rem)}
.hero{background:var(--hc-color-graphite)}
.shade{background:linear-gradient(90deg,#242626 0%,rgba(36,38,38,.92) 15%,rgba(36,38,38,.66) 32%,rgba(36,38,38,.16) 58%,transparent 78%),linear-gradient(0deg,rgba(36,38,38,.75),transparent 24%)}
@media(max-width:60rem){.shade{background:linear-gradient(90deg,rgba(36,38,38,.97),rgba(36,38,38,.82) 38%,rgba(36,38,38,.4)),linear-gradient(0deg,#242626,transparent 38%)}}

/* More pronounced steel lighting, with deeper dark areas. */
.product::before,.footer-v5::before{background:repeating-linear-gradient(0deg,rgba(255,255,255,.012) 0,rgba(255,255,255,.012) .0625rem,transparent .0625rem,transparent .25rem),linear-gradient(to top,#050606 0%,#101212 45%,#242626 100%)}

/* Product benefits from customer copy, 15 September 2026. */
.benefits{padding-block:var(--hc-space-80) 0}
.benefits__heading{max-inline-size:42rem;margin-block-end:var(--hc-space-40)}
.benefits h2{font:400 var(--hc-heading-section)/1.13 var(--hc-font-heading);margin:0 0 var(--hc-space-24)}
.benefits__heading p,.benefits__item p{color:var(--hc-color-muted);margin:0}
.benefits__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--hc-space-40) var(--hc-space-64)}
.benefits__item{border-block-start:var(--hc-border-thin) solid #d7dcd9;padding-block-start:var(--hc-space-24)}
.benefits h3{font:400 1.875rem/1.2 var(--hc-font-heading);margin:0 0 var(--hc-space-16)}
.benefits__item p{font-size:var(--hc-text-m);max-inline-size:32rem}
@media(max-width:40rem){.benefits{padding-block-start:var(--hc-space-64)}.benefits h2{font-size:2.25rem}.benefits__grid{grid-template-columns:1fr;gap:var(--hc-space-32)}.benefits h3{overflow-wrap:anywhere;hyphens:auto}}

/* Desktop logo: 10% larger; align the wordmark h (SVG x=197.54) to the content edge. */
@media(min-width:60.001rem){
 header .logo{width:13.40625rem;height:auto}
 header nav>a:first-child{transform:translateX(max(-27.427957%,calc(1rem - var(--hc-gutter) - max(0rem, (100vw - var(--hc-content-width)) / 2))))}
}
@media(min-width:60.001rem) and (max-width:75rem){header .logo{width:11.55rem}}

/* Contact is the last primary navigation action. */
.navlinks .nav-contact{margin:0;margin-inline-start:clamp(1.25rem,2.5vw,2.5rem);min-height:2.5rem;padding-block:.5rem;line-height:1.2;white-space:nowrap;border-radius:var(--hc-radius-button);color:#fff;background:var(--hc-color-brand);font-size:.875rem}
.navlinks .nav-contact:hover,.navlinks .nav-contact:focus-visible{color:#fff;background:var(--hc-color-brand-hover)}

/* Footer navigation follows the main menu in reading order. */
.footer-bottom{flex-wrap:wrap}
.footer-columns.footer-menu{display:flex;flex-wrap:wrap;align-items:center;gap:1rem clamp(2rem,3vw,3.5rem);width:auto}
.footer-columns.footer-menu a{white-space:nowrap}
@media(max-width:60rem){.footer-columns.footer-menu{width:100%;column-gap:2rem;row-gap:1rem}}

/* Separate utility action, outside the footer navigation. */
.footer-return{display:flex;justify-content:flex-end;padding-block:.5rem 2rem}
.footer-v5 .footer-back-top{display:inline-flex;align-items:center;justify-content:center;gap:.75rem;min-height:2.75rem;padding:.625rem 1.125rem;border:1px solid #454d49;border-radius:var(--hc-radius-button);background:transparent;color:#EEF0EF;font-family:var(--hc-font-body);font-size:.875rem;line-height:1.4;text-decoration:none;transition:background .18s,border-color .18s}
.footer-back-top svg{width:1.125rem;height:1.125rem;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.footer-v5 .footer-back-top:hover{background:#39413e;border-color:#737c78;color:#fff}
.footer-v5 .footer-back-top:focus-visible{outline:2px solid #fff;outline-offset:4px}
@media(max-width:40rem){.footer-return{justify-content:flex-start}}
@media(prefers-reduced-motion:reduce){.footer-v5 .footer-back-top{transition:none}}

/* Bring the separate back-to-top action closer to the footer menu. */
.footer-v5 .footer-dark-lower .footer-bottom{padding-bottom:1.5rem}

/* Standard three-line mobile navigation icon. */
.menu-toggle{justify-content:center;min-inline-size:var(--hc-touch-target);padding:.625rem}
.menu-icon{inline-size:1.5rem;block-size:1.5rem}
.menu-icon::before,.menu-icon::after{content:none}
.menu-icon svg{position:static;inline-size:100%;block-size:100%;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}

/* Opening and closing icons share the same position and touch target. */
.mobile-menu[open] .mobile-menu__close{position:fixed;left:var(--menu-control-left);top:var(--menu-control-top);width:var(--menu-control-width);height:var(--menu-control-height);justify-content:center;padding:.625rem;box-sizing:border-box;border-radius:var(--hc-radius-button);z-index:1}
.mobile-menu__close-icon{display:flex;align-items:center;justify-content:center;inline-size:1.5rem;block-size:1.5rem;line-height:1}
.mobile-menu__close-icon svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}