
/* Native product moments preserve the approved image and demo composition. */
.hxa-home .home-showcase-sparo{display:contents!important}
.hxa-home .showcase-photo .home-showcase-image{position:absolute;inset:0;margin:0!important;padding:0!important;height:100%;width:100%}
.hxa-home .showcase-photo .home-showcase-image figure{margin:0!important;height:100%;width:100%}
.hxa-home .home-moments-intro p{margin:0;color:var(--muted);font-size:1.05rem}
@media(min-width:701px) and (max-width:1100px){.hxa-home .home-moments-headline{grid-column:2;grid-row:1}.hxa-home .home-moments-intro{grid-column:2;grid-row:2}}
@media(max-width:700px){.hxa-home .home-moments-headline,.hxa-home .home-moments-intro{grid-column:1;grid-row:auto}}
:root{color-scheme:dark;--ink:#050505;--paper:#f4f4f0;--muted:#9a9a94;--line:#292927;--signal:#e0061c;--ease:cubic-bezier(.2,.8,.2,1)}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:92px}body{margin:0;background:var(--ink);color:var(--paper);font-family:Inter,"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:16px;line-height:1.55;overflow-x:hidden}a{color:inherit}button,summary{font:inherit}.shell{width:min(1480px,100%);margin:0 auto;padding-inline:clamp(20px,4.4vw,72px)}.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}.skip-link{position:fixed;left:16px;top:-60px;z-index:100;padding:12px 16px;background:#fff;color:#000;transition:top .2s}.skip-link:focus{top:12px}.site-header{position:fixed;inset:0 0 auto;z-index:30;background:linear-gradient(to bottom,rgba(5,5,5,.98),rgba(5,5,5,.78),transparent)}.nav-bar{min-height:86px;display:flex;align-items:center;gap:30px}.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-family:"Open Sans",Inter,"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:1.45rem;font-weight:600;letter-spacing:-.03em;white-space:nowrap}.brand:after{content:"";width:2px;height:20px;background:var(--signal)}.main-nav{flex:1;display:flex;justify-content:center;align-items:center;gap:clamp(14px,1.8vw,30px)}.main-nav>a,.main-nav summary,.nav-cta{color:#c9c9c4;text-decoration:none;text-transform:uppercase;font-size:.72rem;letter-spacing:.09em;white-space:nowrap}.main-nav>a:hover,.main-nav summary:hover,.main-nav>a:focus-visible,.main-nav summary:focus-visible{color:#fff}.main-nav details{position:relative}.main-nav summary{list-style:none;cursor:pointer}.main-nav summary::-webkit-details-marker{display:none}.main-nav summary:after{content:"+";margin-left:6px;color:var(--signal)}.main-nav details[open] summary:after{content:"−"}.mega-menu{position:absolute;top:calc(100% + 22px);left:50%;width:min(630px,80vw);padding:12px;border:1px solid #333330;background:rgba(12,12,11,.98);transform:translateX(-50%);display:grid;grid-template-columns:1fr 1fr;box-shadow:0 24px 80px rgba(0,0,0,.45)}.mega-menu.compact{width:410px;grid-template-columns:1fr}.mega-menu a{display:flex;gap:14px;align-items:center;padding:15px;text-decoration:none;border:1px solid transparent;font-size:.9rem}.mega-menu a:hover,.mega-menu a:focus-visible{border-color:#3a3a37;background:#171715}.mega-menu a span{color:var(--signal);font-size:.67rem;letter-spacing:.1em}.nav-cta{margin-left:auto;padding:11px 14px;border:1px solid #4b4b47;color:#fff}.nav-cta:hover{color:var(--ink);background:var(--paper)}.menu-toggle{display:none;margin-left:auto;border:1px solid #444440;background:transparent;color:#fff;padding:9px 12px;text-transform:uppercase;font-size:.75rem;letter-spacing:.08em}
.hero{position:relative;min-height:100svh;display:grid;align-items:end;isolation:isolate;border-bottom:1px solid var(--line)}#field,.hero-shade{position:absolute;inset:0;width:100%;height:100%;z-index:-2}.hero-shade{z-index:-1;background:linear-gradient(90deg,rgba(5,5,5,.95) 0%,rgba(5,5,5,.42) 58%,rgba(5,5,5,.8) 100%),linear-gradient(0deg,#050505 0%,transparent 55%)}.hero-grid{width:100%;display:grid;grid-template-columns:1.5fr .7fr;gap:clamp(44px,8vw,126px);align-items:end;padding-top:150px;padding-bottom:clamp(82px,12vh,130px)}.eyebrow{display:flex;align-items:center;gap:12px;margin:0 0 28px;color:#c5c5c0;font-size:.76rem;letter-spacing:.14em;text-transform:uppercase}.eyebrow:before{content:"";width:40px;height:1px;background:var(--signal)}.hero-positioning{align-items:flex-start;line-height:1.65}.hero-positioning:before{margin-top:.62em;flex:0 0 40px}.hero-title{margin:0;max-width:1050px;font-size:clamp(3.5rem,8.2vw,8.3rem);line-height:.86;letter-spacing:-.075em;font-weight:430}.hero-title span{display:block}.hero-title .outline{color:transparent;-webkit-text-stroke:1px rgba(244,244,240,.52)}.hero-lead{margin:0 0 30px;color:#d2d2ce;font-size:clamp(1.05rem,1.35vw,1.3rem)}.button-row{display:flex;flex-wrap:wrap;gap:12px}.button{min-width:200px;display:inline-flex;align-items:center;justify-content:space-between;gap:25px;padding:16px 18px;text-decoration:none;border:1px solid #53534f;text-transform:uppercase;letter-spacing:.08em;font-size:.76rem;transition:.25s ease}.button-icon{display:block;flex:0 0 16px;width:16px;height:16px;object-fit:contain}.button.primary{background:var(--paper);color:var(--ink);border-color:var(--paper)}.button.primary:hover,.button.primary:focus-visible{background:var(--signal);color:#fff;border-color:var(--signal)}.button.quiet:hover,.button.quiet:focus-visible{background:var(--paper);color:var(--ink);border-color:var(--paper)}.hero-facts{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);display:flex;gap:28px;color:#74746f;font-size:.67rem;letter-spacing:.11em;text-transform:uppercase}.hero-facts span{display:flex;align-items:center;gap:12px}.hero-facts span:not(:last-child):after{content:"";width:4px;height:4px;background:var(--signal)}
section{border-bottom:1px solid var(--line)}.section-index{color:var(--signal);font-size:.72rem;letter-spacing:.13em;text-transform:uppercase}.statement{padding-block:clamp(90px,13vw,180px)}.statement-grid{display:grid;grid-template-columns:.55fr 2fr 1fr;gap:clamp(30px,5vw,85px);align-items:start}.statement h2{margin:0;font-size:clamp(2.7rem,5.7vw,6.6rem);line-height:.95;letter-spacing:-.065em;font-weight:430}.statement h2 em{color:#6d6d68;font-style:normal}.statement p{margin:8px 0 0;color:#aaa9a4;font-size:1.05rem}.portfolio-section{padding-block:clamp(78px,10vw,140px)}.portfolio-section.alt{background:var(--paper);color:var(--ink)}.section-head{display:grid;grid-template-columns:1.4fr .6fr;gap:50px;align-items:end;margin-bottom:58px}.section-head h2,.automation-grid h2,.integration h2,.about h2{margin:10px 0 0;font-size:clamp(2.5rem,5vw,5.2rem);line-height:.96;letter-spacing:-.058em;font-weight:430}.section-head>p{max-width:44ch;margin:0 0 5px auto;color:var(--muted);font-size:1.06rem}.alt .section-head>p{color:#63635f}.product-grid{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}.product-grid.two{grid-template-columns:repeat(2,1fr);border-color:#cfcfca}.product-card{padding:clamp(26px,4vw,54px);border-right:1px solid var(--line);border-bottom:1px solid var(--line);min-height:480px;display:flex;flex-direction:column}.product-card.feature{grid-column:1/-1;min-height:0}.product-card.dark{border-color:#cfcfca;min-height:440px}.card-top{display:flex;justify-content:space-between;gap:20px;color:var(--muted);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase}.card-top span:first-child{color:var(--signal)}.product-card h3,.service-flow h3{margin:auto 0 20px;padding-top:60px;font-size:clamp(2rem,4vw,4.5rem);line-height:.94;letter-spacing:-.055em;font-weight:450}.product-card.feature h3{margin-top:65px}.card-lead{max-width:61ch;margin:0 0 26px;font-size:1.05rem;color:#b6b6b0}.dark .card-lead{color:#565652}.feature-list{list-style:none;margin:0;padding:0;display:grid;gap:10px;color:#9b9b95}.dark .feature-list{color:#4d4d49}.feature-list li{display:flex;gap:12px}.feature-list li:before{content:"↳";color:var(--signal)}.product-details{margin-top:30px;border-top:1px solid var(--line)}.product-details summary{padding:18px 0;cursor:pointer;list-style:none;text-transform:uppercase;font-size:.72rem;letter-spacing:.1em}.product-details summary:after{content:"+";float:right;color:var(--signal)}.product-details[open] summary:after{content:"−"}.product-details p{color:#a6a6a1;max-width:80ch}.detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:26px 48px;padding-bottom:10px}.detail-grid h4{margin:0 0 8px;font-size:1rem}.detail-grid p{margin:0}
.service-flow{display:grid;grid-template-columns:1fr auto 1fr;align-items:stretch;border:1px solid var(--line)}.service-flow article{padding:clamp(30px,4.5vw,65px)}.service-flow h3{margin-top:30px;padding-top:0}.service-flow p{color:var(--muted);max-width:50ch}.flow-no{color:var(--signal);font-size:.73rem}.flow-arrow{display:grid;place-items:center;width:70px;color:var(--signal);font-size:1.8rem;border-inline:1px solid var(--line)}
.automation-section{padding-block:clamp(95px,13vw,180px)}.automation-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(50px,9vw,140px);align-items:center}.automation-map{position:relative;aspect-ratio:1;max-width:610px;border:1px solid #31312e;background:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:44px 44px;overflow:hidden}.orbit{position:absolute;left:50%;top:50%;border:1px solid #333330;border-radius:50%;transform:translate(-50%,-50%)}.orbit.one{width:35%;aspect-ratio:1}.orbit.two{width:65%;aspect-ratio:1}.orbit.three{width:94%;aspect-ratio:1}.auto-node{position:absolute;padding:8px 10px;border:1px solid #474742;background:#0b0b0a;color:#c8c8c3;font-size:.68rem;letter-spacing:.09em;text-transform:uppercase}.auto-node.core{left:50%;top:50%;transform:translate(-50%,-50%);border-color:var(--signal);color:#fff}.auto-node.light{left:12%;top:26%}.auto-node.climate{right:8%;top:30%}.auto-node.air{left:17%;bottom:14%}.auto-node.power{right:13%;bottom:12%}.section-lead{color:#aaa9a4;font-size:1.12rem;max-width:51ch}.automation-points{margin-top:44px;border-top:1px solid var(--line)}.automation-points div{padding:20px 0;display:grid;grid-template-columns:.75fr 1.25fr;gap:28px;border-bottom:1px solid var(--line)}.automation-points p{margin:0;color:var(--muted)}
.integration{padding-block:clamp(80px,11vw,150px);background:#11110f}.integration-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px}.integration-list{border-top:1px solid #353531}.integration-list div{display:flex;justify-content:space-between;gap:30px;padding:22px 0;border-bottom:1px solid #353531}.integration-list span{color:var(--muted);text-align:right}.about{padding-block:clamp(90px,14vw,190px)}.about-grid{display:grid;grid-template-columns:.55fr 2fr;gap:clamp(40px,8vw,130px)}.about h2{max-width:1000px;margin-top:0}.about p{max-width:68ch;color:var(--muted);font-size:1.1rem}.about .quote{margin-top:55px;color:var(--paper);font-size:clamp(1.35rem,2.2vw,2.2rem);line-height:1.28;letter-spacing:-.03em}.quote-author{color:var(--signal);font-size:.76rem;letter-spacing:.08em;text-transform:uppercase}.closing{padding-block:clamp(110px,17vw,230px);text-align:center}.eyebrow.centered{justify-content:center}.closing h2{margin:0;font-size:clamp(3.5rem,8vw,8rem);line-height:.9;letter-spacing:-.07em;font-weight:430}.closing>.shell>p:not(.eyebrow){margin:30px auto 40px;max-width:56ch;color:var(--muted);font-size:1.1rem}.centered-row{justify-content:center}.site-footer{padding-block:42px}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr .7fr auto;gap:45px;align-items:start;color:#777772;font-size:.76rem}.footer-grid p{max-width:26ch}.footer-grid nav{display:grid;gap:9px}.footer-grid nav a{text-decoration:none}.footer-grid nav a:hover{color:#fff}[data-reveal]{opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease),transform .8s var(--ease)}[data-reveal].visible{opacity:1;transform:none}
@media(max-width:1120px){.menu-toggle{display:block}.main-nav{display:none;position:absolute;top:72px;left:20px;right:20px;max-height:calc(100svh - 90px);overflow:auto;padding:18px;background:#0d0d0c;border:1px solid #343431;align-items:stretch;flex-direction:column}.main-nav.open{display:flex}.main-nav details{position:static}.main-nav summary,.main-nav>a{display:block;padding:11px 0}.mega-menu,.mega-menu.compact{position:static;width:100%;transform:none;margin-top:8px;grid-template-columns:1fr;box-shadow:none}.nav-cta{margin-left:0}}@media(max-width:860px){.nav-bar{min-height:72px}.hero-grid,.statement-grid,.section-head,.automation-grid,.integration-grid,.about-grid{grid-template-columns:1fr}.hero-grid{gap:45px}.hero-side{max-width:620px}.hero-facts{position:static;transform:none;padding-bottom:22px;flex-wrap:wrap}.statement-grid,.about-grid{gap:28px}.section-head>p{margin-left:0}.product-grid,.product-grid.two{grid-template-columns:1fr}.product-card.feature{grid-column:auto}.service-flow{grid-template-columns:1fr}.flow-arrow{width:auto;min-height:54px;border-inline:0;border-block:1px solid var(--line);transform:rotate(90deg)}.automation-map{order:2}.footer-grid{grid-template-columns:1fr 1fr}}@media(max-width:560px){.hero-title{font-size:clamp(3.7rem,19vw,5.8rem)}.hero-grid{padding-top:120px;padding-bottom:66px}.hero-facts{display:none}.button{width:100%}.detail-grid,.footer-grid{grid-template-columns:1fr}.automation-points div{grid-template-columns:1fr;gap:7px}.integration-list div{flex-direction:column;gap:5px}.integration-list span{text-align:left}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* HXA.io hero identity and particle stream, based on the original HXA.io art direction. */
.hero{align-items:stretch;overflow:hidden}
#particleCanvas{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:0}
.hero-shade{z-index:1;background:linear-gradient(0deg,#050505 0%,rgba(5,5,5,.15) 46%,rgba(5,5,5,.08) 100%),linear-gradient(90deg,rgba(5,5,5,.3),transparent 45%,rgba(5,5,5,.25))}
.hero-identity{position:absolute;z-index:2;top:clamp(116px,18vh,180px);left:50%;width:min(920px,88vw);transform:translateX(-50%);display:grid;grid-template-columns:minmax(290px,1fr) 6px minmax(245px,.75fr);align-items:center;gap:clamp(18px,2vw,30px);pointer-events:none}
.identity-brand{display:flex;flex-direction:column;align-items:flex-end}
.identity-logo{font-family:"Open Sans",Inter,"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:clamp(5.4rem,9.8vw,8.8rem);font-weight:600;line-height:.88;letter-spacing:-.045em;white-space:nowrap}
.powered-text{margin-top:.65rem;padding-right:.4rem;font-size:clamp(.8rem,1.55vw,1.28rem);line-height:1;white-space:nowrap}
.identity-divider{display:block;width:100%;height:clamp(105px,18vh,160px);background:var(--signal)}
.identity-claim{align-self:start;margin:clamp(17px,2.7vh,25px) 0 0;font-size:clamp(.72rem,.9vw,.88rem);line-height:1.42;color:#fff}
.hero-grid{position:relative;z-index:2;align-self:end;padding-top:clamp(450px,60vh,650px);padding-bottom:clamp(82px,10vh,112px)}
.hero-facts{z-index:2}

/* Interactive HXA.io office explorer, adapted from the original showroom motif. */
.showroom{padding-block:clamp(76px,9vw,132px);background:#0b0b0a}
.showroom-intro{display:grid;grid-template-columns:.55fr 2.45fr;gap:clamp(28px,5vw,82px);align-items:start;margin-bottom:clamp(34px,5vw,64px)}
.showroom-intro h2{max-width:1050px;margin:0;font-size:clamp(2.7rem,5.6vw,6.2rem);font-weight:430;line-height:.94;letter-spacing:-.06em}
.showroom-intro p{max-width:65ch;margin:22px 0 0;color:#aaa9a4;font-size:1.05rem}
.showroom-tabs{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid #343431;border-bottom:0;background:#343431;gap:1px}
.showroom-tab{min-height:84px;padding:16px 18px;border:0;background:#10100f;color:#c7c7c2;text-align:left;cursor:pointer;transition:background .2s var(--ease),color .2s var(--ease)}
.showroom-tab span{display:block;margin-bottom:8px;color:var(--signal);font-size:.68rem;letter-spacing:.12em}
.showroom-tab:hover,.showroom-tab:focus-visible{background:#1a1a18;color:#fff;outline:none}
.showroom-tab:focus-visible{box-shadow:inset 0 0 0 2px var(--signal)}
.showroom-tab.is-active,.showroom-tab[aria-selected="true"]{background:var(--paper);color:var(--ink)}
.showroom-stage{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(310px,.65fr);border:1px solid #343431;background:#10100f}
.showroom-visual{position:relative;aspect-ratio:1920/1281;min-width:0;overflow:hidden;background:#171715}
.showroom-visual::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(5,5,5,.12),transparent 28%,transparent 72%,rgba(5,5,5,.18)),linear-gradient(0deg,rgba(5,5,5,.28),transparent 28%)}
.showroom-visual picture{display:block;width:100%;height:100%}.showroom-visual img{display:block;width:100%;height:100%;object-fit:cover}
.showroom-hotspot{position:absolute;z-index:2;width:66px;height:66px;padding:0;border:0;border-radius:50%;background:transparent;color:#fff;cursor:pointer;transform:translate(-50%,-50%)}
.hotspot-board{left:4%;top:57%}.hotspot-booking{left:42.5%;top:50%}.hotspot-sparo{left:59.5%;top:52%}.hotspot-environment{left:calc(87% + 8px);top:calc(68% - 11px)}
.hotspot-marker{position:absolute;inset:50% auto auto 50%;width:45px;height:45px;border:2px solid rgba(255,255,255,.56);border-radius:50%;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:0 3px 12px rgba(0,0,0,.24);transform:translate(-50%,-50%);transition:border-color .25s var(--ease),box-shadow .25s var(--ease),transform .25s var(--ease)}
.hotspot-booking .hotspot-marker{transform:translate(-50%,-50%) scaleX(-1)}
.hotspot-marker::before{content:"";position:absolute;inset:-7px;border-radius:50%;background:conic-gradient(from -48deg,var(--signal) 0 96deg,transparent 96deg 360deg);-webkit-mask:radial-gradient(farthest-side,transparent 78%,#000 81%);mask:radial-gradient(farthest-side,transparent 78%,#000 81%);filter:drop-shadow(0 0 2px rgba(224,6,28,.35));transition:transform .3s var(--ease),filter .3s var(--ease)}
.hotspot-marker::after{content:"";position:absolute;width:6px;height:6px;right:-7px;top:5px;border:1px solid rgba(255,255,255,.66);border-radius:50%;background:var(--signal);box-shadow:0 0 6px rgba(224,6,28,.55);transition:transform .3s var(--ease)}
.showroom-hotspot:hover .hotspot-marker,.showroom-hotspot:focus-visible .hotspot-marker,.showroom-hotspot.is-active .hotspot-marker{border-color:rgba(255,255,255,.68);box-shadow:0 3px 15px rgba(0,0,0,.28);transform:translate(-50%,-50%) scale(1.2)}
.hotspot-booking:hover .hotspot-marker,.hotspot-booking:focus-visible .hotspot-marker,.hotspot-booking.is-active .hotspot-marker{transform:translate(-50%,-50%) scale(-1.2,1.2)}
.showroom-hotspot:hover .hotspot-marker::before,.showroom-hotspot:focus-visible .hotspot-marker::before,.showroom-hotspot.is-active .hotspot-marker::before{transform:rotate(28deg);filter:drop-shadow(0 0 4px rgba(224,6,28,.5))}
.showroom-hotspot:hover .hotspot-marker::after,.showroom-hotspot:focus-visible .hotspot-marker::after,.showroom-hotspot.is-active .hotspot-marker::after{transform:translate(2px,-1px) scale(1.12)}
.showroom-hotspot:focus-visible{outline:2px solid #fff;outline-offset:3px}
.hotspot-label{position:absolute;left:calc(100% + 5px);top:50%;padding:7px 9px;background:rgba(5,5,5,.9);border-left:2px solid var(--signal);font-size:.69rem;letter-spacing:.04em;line-height:1;white-space:nowrap;opacity:0;transform:translateY(-50%) translateX(-4px);transition:opacity .2s var(--ease),transform .2s var(--ease);pointer-events:none}
.hotspot-booking .hotspot-label,.hotspot-environment .hotspot-label{left:auto;right:calc(100% + 5px);border-left:0;border-right:2px solid var(--signal)}
.showroom-hotspot:hover .hotspot-label,.showroom-hotspot:focus-visible .hotspot-label,.showroom-hotspot.is-active .hotspot-label{opacity:1;transform:translateY(-50%) translateX(0)}
.showroom-panel{display:flex;flex-direction:column;padding:clamp(28px,3.5vw,52px);background:var(--paper);color:var(--ink)}
.showroom-panel h3{margin:auto 0 20px;font-size:clamp(2rem,3.4vw,4rem);font-weight:450;line-height:.94;letter-spacing:-.055em}
.showroom-panel>p:not(.showroom-hint){margin:0 0 30px;color:#51514d;font-size:1rem}
.showroom-link{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:15px 0;border-block:1px solid #c8c8c2;color:var(--ink);text-decoration:none;text-transform:uppercase;font-size:.72rem;letter-spacing:.08em}
.showroom-link .button-icon{flex-basis:16px}.showroom-link:hover,.showroom-link:focus-visible{color:var(--signal)}
.showroom-hint{margin:auto 0 0;padding-top:26px;color:#74746e;font-size:.76rem;line-height:1.5}

/* Header wordmark stays clean; the red divider remains part of the large hero logo. */
.site-header .brand::after,.site-footer .brand::after{content:none}
.language-switch{display:flex;align-items:center;gap:7px;color:#666661;font-size:.67rem;letter-spacing:.12em}.language-switch a{color:#777772;text-decoration:none}.language-switch a:hover,.language-switch a:focus-visible,.language-switch a[aria-current="page"]{color:#fff}.language-switch span{color:var(--signal)}.mobile-language{display:none}

/* Keep every product card top-aligned, including when a neighbouring details panel opens. */
.product-card h3,.service-flow h3{margin:0 0 20px}
.product-card.feature h3{margin-top:0}

/* Original first-concept automation map. */
.signal-map{position:relative;aspect-ratio:1/.82;border:1px solid #2f2f2c;background:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:42px 42px;overflow:hidden}
.signal-map::before{content:"";position:absolute;width:54%;aspect-ratio:1;left:22%;top:10%;border:1px solid rgba(255,255,255,.24);border-radius:50%;box-shadow:0 0 0 40px rgba(255,255,255,.025),0 0 0 90px rgba(255,255,255,.018);animation:signal-pulse 4s ease-in-out infinite}
.signal-line{position:absolute;height:1px;background:rgba(255,255,255,.25);transform-origin:left center}
.signal-line.one{width:54%;left:31%;top:36%;transform:rotate(29deg)}
.signal-line.two{width:43%;left:19%;top:68%;transform:rotate(-49deg)}
.signal-line.three{width:39%;left:48%;top:67%;transform:rotate(-113deg)}
.node{position:absolute;width:12px;height:12px;margin:-6px;border-radius:50%;background:var(--paper);box-shadow:0 0 0 8px rgba(245,245,242,.08)}
.node::after{content:attr(data-label);position:absolute;top:20px;left:0;color:#b3b3ae;font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.node.core{left:50%;top:49%;background:var(--signal);box-shadow:0 0 0 10px rgba(224,6,28,.12)}
.node.room{left:17%;top:23%}
.node.people{left:82%;top:30%}
.node.energy{left:74%;top:78%}
.node.mobility{left:22%;top:78%}
@keyframes signal-pulse{0%,100%{transform:scale(.94);opacity:.5}50%{transform:scale(1.04);opacity:1}}

@media(max-width:860px){
  .hero-identity{top:112px;width:calc(100% - 40px);grid-template-columns:minmax(0,1.2fr) 4px minmax(155px,.9fr);gap:14px}
  .identity-logo{font-size:clamp(4.15rem,16vw,7rem)}
  .identity-divider{height:clamp(90px,16vh,125px)}
  .identity-claim{margin-top:14px;font-size:clamp(.63rem,1.75vw,.78rem)}
  .hero-grid{padding-top:clamp(390px,55vh,500px)}
  .showroom-intro{grid-template-columns:1fr;gap:18px}
  .showroom-tabs{grid-template-columns:repeat(2,1fr)}
  .showroom-stage{grid-template-columns:1fr}
  .showroom-panel{min-height:340px}
  .showroom-panel h3{margin-top:45px}
}

@media(max-width:1120px){
  .desktop-language{display:none}
  .main-nav .mobile-language{display:flex;padding:11px 0}
}

@media(max-width:560px){
  .hero{min-height:auto}
  .hero-identity{top:105px;grid-template-columns:minmax(0,1.15fr) 3px minmax(118px,.9fr);gap:10px}
  .identity-logo{font-size:clamp(3.65rem,17.5vw,5rem)}
  .powered-text{font-size:.7rem;margin-top:.45rem}
  .identity-divider{height:90px}
  .identity-claim{margin-top:10px;font-size:.57rem;line-height:1.45}
  .hero-grid{padding-top:350px;padding-bottom:70px;gap:36px}
  .showroom-tabs{grid-template-columns:minmax(0,1fr);border-bottom:1px solid #343431}
  .showroom-tab{min-width:0;min-height:76px}
  /* Keep the full image and its shared hotspot coordinates on mobile. */
  .hotspot-label{display:none}
  .showroom-panel{min-height:0}
  .showroom-panel h3{margin:36px 0 16px}
  .showroom-hint{display:none}
}

/* Product moments: real installation photography paired with a privacy-safe Sparo AI demo. */
.product-showcase{padding-block:clamp(86px,11vw,156px);background:#090908;border-bottom:1px solid var(--line)}
.showcase-head{margin-bottom:clamp(36px,5vw,64px)}
.showcase-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(12px,1.6vw,24px)}
.showcase-card{position:relative;min-width:0;overflow:hidden;border:1px solid #343431;background:#121210}
.showcase-sparo{grid-column:span 6;grid-row:span 2;min-height:680px;padding:clamp(26px,3vw,46px);display:grid;grid-template-columns:minmax(230px,1fr) minmax(250px,280px);gap:clamp(18px,2vw,32px);align-items:end;background:linear-gradient(145deg,#171714 0%,#0b0b0a 64%,#10100e 100%)}
.showcase-sparo:before{content:"";position:absolute;width:330px;height:330px;right:-150px;top:-100px;border:1px solid rgba(224,6,28,.35);border-radius:50%;box-shadow:0 0 0 48px rgba(224,6,28,.04),0 0 0 96px rgba(224,6,28,.025)}
.showcase-text{position:relative;z-index:1;align-self:start}.showcase-text>span,.photo-caption>span{display:block;color:var(--signal);font-size:.7rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase}.showcase-text h3{max-width:8ch;margin:16px 0 20px;font-size:clamp(2.25rem,4.2vw,4.5rem);line-height:.91;letter-spacing:-.065em;font-weight:430}.showcase-text p{max-width:29ch;margin:0;color:#aaa9a4;font-size:1rem}
.sparo-phone{position:relative;z-index:1;justify-self:end;width:100%;max-width:280px;min-height:0;aspect-ratio:9/17;padding:25px 13px 14px;border:7px solid #090909;border-radius:31px;background:#f5f5f1;color:#242421;box-shadow:0 30px 55px rgba(0,0,0,.42);font-family:Inter,"Helvetica Neue",Helvetica,Arial,sans-serif}.phone-island{width:76px;height:19px;margin:-16px auto 13px;border-radius:20px;background:#0b0b0a}.phone-title{text-align:center;font-size:.75rem;font-weight:700}.phone-title b{margin-left:3px;color:var(--signal)}.chat{max-width:91%;margin-top:26px;padding:12px 13px;border-radius:15px;font-size:.67rem;line-height:1.38}.chat-user{margin-left:auto;background:var(--signal);color:#fff;border-bottom-right-radius:4px}.chat-ai{display:flex;gap:8px;background:#e7e8e3;border-bottom-left-radius:4px}.chat-ai i{flex:0 0 21px;width:21px;height:21px;display:grid;place-items:center;border-radius:50%;background:var(--signal);color:#fff;font-size:.73rem;font-style:normal}.chat-ai p{margin:0}.booking-confirm{display:flex;gap:9px;align-items:center;margin-top:14px;padding:10px;border:1px solid #d4d5d0;border-radius:11px;background:#fff}.booking-confirm>span{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#242421;color:#fff;font-size:.68rem}.booking-confirm strong,.booking-confirm small{display:block}.booking-confirm strong{font-size:.62rem}.booking-confirm small{margin-top:2px;color:#767671;font-size:.55rem}.chat-input{position:absolute;right:12px;bottom:14px;left:12px;padding:10px 9px;border-radius:14px;background:#e4e5e0;color:#9a9b96;font-size:.56rem}.chat-input .button-icon{float:right;width:11px;height:11px}
/* Make the CSS-rendered Sparo screen read as a physical iPhone mockup. */
.sparo-phone{border:9px solid #090909;border-radius:42px;outline:2px solid #858581;outline-offset:0;background-clip:padding-box;box-shadow:0 0 0 1px #020202,0 30px 55px rgba(0,0,0,.55),inset 0 0 0 1px rgba(255,255,255,.38)}
.sparo-phone::before,.sparo-phone::after{content:"";position:absolute;z-index:-1;width:4px;background:linear-gradient(90deg,#4a4a47,#a2a29d 45%,#454542);box-shadow:0 0 0 1px #111}
.sparo-phone::before{left:-14px;top:91px;height:30px;border-radius:3px 0 0 3px;box-shadow:0 43px 0 #747470,0 82px 0 #747470,0 0 0 1px #111}
.sparo-phone::after{right:-14px;top:126px;height:78px;border-radius:0 3px 3px 0}
.sparo-phone.sparo-interactive{display:flex;flex-direction:column;height:490px;aspect-ratio:auto;max-width:280px;min-width:0}
.sparo-interactive .phone-island,.sparo-interactive .phone-title{flex-shrink:0}
.sparo-demo-toolbar{display:flex;align-items:center;justify-content:space-between;gap:6px;margin:8px 0 4px;color:#66675f;font-size:10px}
.sparo-interactive .sparo-demo-button{appearance:none;cursor:pointer;font-family:inherit;line-height:1.3;letter-spacing:normal;text-transform:none;box-shadow:none}
.sparo-demo-toolbar .sparo-demo-button{border:0;background:transparent;color:#45463f;padding:6px 2px;min-height:32px;font-size:10px;text-decoration:underline;text-underline-offset:3px}
.sparo-demo-log{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:0 3px 8px}
.sparo-demo-log .chat{margin-top:12px;padding:11px 12px;font-size:12px;line-height:1.45;overflow-wrap:anywhere}
.sparo-demo-log .chat-ai{display:block}
.sparo-demo-status{flex-shrink:0;min-height:24px;padding:4px 3px;color:#66675f;font-size:10px}
.sparo-demo-choices{display:flex;flex-wrap:wrap;gap:6px;flex-shrink:0;padding-top:8px;border-top:1px solid #d7d8d1}
.sparo-demo-choices .sparo-demo-button{flex:1 1 auto;min-height:36px;max-width:100%;padding:8px 10px;border:1px solid #cccdc5;border-radius:13px;background:#fff;color:#30312c;font-size:11px;font-weight:600;transition:background .15s,border-color .15s}
.sparo-demo-choices .sparo-demo-button:hover:not(:disabled){background:#eeeede;border-color:#77786e}
.sparo-interactive .sparo-demo-button:disabled{cursor:wait;opacity:.5}
.sparo-interactive .sparo-demo-button:focus-visible,.sparo-demo-log:focus-visible{outline:2px solid #4f5700;outline-offset:2px}
@media(prefers-reduced-motion:reduce){.sparo-demo-choices .sparo-demo-button{transition:none}}
.phone-island{box-shadow:inset 0 0 0 1px rgba(255,255,255,.06),0 1px 2px rgba(0,0,0,.35)}
.showcase-photo{min-height:330px}.showcase-photo picture{display:block;width:100%;height:100%}.showcase-photo img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .7s var(--ease)}.showcase-photo:hover img{transform:scale(1.035)}.showcase-room{grid-column:span 6;min-height:392px}.showcase-door,.showcase-environment{grid-column:span 3}.showcase-environment{background:#e8e8e3}.showcase-environment img{object-position:center}.photo-caption{position:absolute;inset:auto 0 0;padding:clamp(20px,2.5vw,34px);background:linear-gradient(0deg,rgba(0,0,0,.84),rgba(0,0,0,.34) 76%,transparent);color:#fff}.photo-caption h3{max-width:16ch;margin:10px 0 0;font-size:clamp(1.55rem,2.8vw,3rem);line-height:.95;letter-spacing:-.055em;font-weight:430}.photo-caption p{max-width:46ch;margin:13px 0 0;color:#d0d0cb;font-size:.9rem}.showcase-environment .photo-caption{background:linear-gradient(0deg,rgba(0,0,0,.88),rgba(0,0,0,.28) 76%,transparent)}
@media(max-width:980px){.showcase-sparo{grid-column:span 12;grid-row:auto;min-height:550px}.showcase-room{grid-column:span 12}.showcase-door,.showcase-environment{grid-column:span 6;min-height:330px}}@media(max-width:720px){.showcase-sparo{min-height:640px;grid-template-columns:1fr;padding:28px}.showcase-text h3{max-width:none}.sparo-phone{justify-self:center;width:min(100%,260px)}.showcase-door,.showcase-environment{grid-column:span 12;min-height:310px}.showcase-room{min-height:330px}.photo-caption h3{font-size:2rem}}

/* HXA.io story, trust and Room Booking availability. */
.hxa-film{padding-block:clamp(82px,11vw,150px);background:#0d0d0c}.film-frame{position:relative;overflow:hidden;border:1px solid #3b3b37;background:#000;box-shadow:0 30px 90px rgba(0,0,0,.32)}.film-frame video{display:block;width:100%;aspect-ratio:16/9;background:#000}.used-by{padding-block:clamp(68px,8vw,112px);background:var(--paper);color:var(--ink)}.used-by-head{display:grid;grid-template-columns:1.4fr .6fr;grid-template-areas:"index copy" "title copy";column-gap:50px;row-gap:0;align-items:end;margin-bottom:clamp(38px,5vw,66px)}.used-by-head>.section-index{grid-area:index}.used-by-head h2{grid-area:title;margin:10px 0 0;font-size:clamp(3rem,6vw,6.6rem);line-height:.86;letter-spacing:-.065em;font-weight:430}.used-by-head p{grid-area:copy;max-width:32ch;margin:0 0 5px auto;color:#62625e}.logo-cloud{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));border-top:1px solid #c9c9c3;border-left:1px solid #c9c9c3}.logo-cloud img{width:100%;height:82px;padding:22px;object-fit:contain;filter:grayscale(1) contrast(1.12);opacity:.72;border-right:1px solid #c9c9c3;border-bottom:1px solid #c9c9c3}.logo-note{max-width:75ch;margin:20px 0 0;color:#777772;font-size:.73rem;line-height:1.5}.store-links{margin-top:auto;padding-top:26px}.store-links>span{display:block;margin-bottom:10px;color:#777772;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase}.store-links>div{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.store-links a{display:block;line-height:0}.store-links img{height:34px;width:auto;transition:transform .2s var(--ease)}.store-links a:hover img,.store-links a:focus-visible img{transform:translateY(-2px)}.service-experience{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);border:1px solid var(--line)}.service-experience figure{min-height:100%;margin:0;background:#e9e9e4;border-right:1px solid var(--line)}.service-experience figure img{display:block;width:100%;height:100%;object-fit:cover}.service-experience .service-flow{border:0}
@media(max-width:860px){.used-by-head{grid-template-columns:1fr;grid-template-areas:"index" "title" "copy";row-gap:0}.used-by-head p{margin:22px 0 0}.service-experience{grid-template-columns:1fr}.service-experience figure{min-height:360px;border-right:0;border-bottom:1px solid var(--line)}}@media(max-width:560px){.logo-cloud{grid-template-columns:repeat(2,minmax(0,1fr))}.logo-cloud img{height:72px;padding:18px}.service-experience figure{min-height:245px}.store-links img{height:31px}}

/* Preserve the complete Room Booking + Room Service interface at every size. */
.service-experience{align-items:start}.service-experience figure{min-height:0;align-self:start}.service-experience figure img{height:auto;aspect-ratio:760/513;object-fit:contain}
.service-experience-stacked{display:block}.service-experience-stacked figure{border-right:0;border-bottom:1px solid var(--line)}.service-experience figure picture{display:block;width:100%}.service-experience-stacked figure img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}.service-experience-stacked .service-flow{border:0}
.room-booking-device{padding-block:clamp(90px,12vw,165px);background:#11110f}.room-booking-device .section-head{margin-bottom:clamp(38px,5vw,68px)}.device-feature{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(330px,.88fr);gap:clamp(32px,6vw,96px);align-items:center;padding:clamp(24px,3vw,48px);border:1px solid #343431;background:linear-gradient(125deg,#171715,#0b0b0a)}.device-feature figure{margin:0;min-height:400px;display:grid;place-items:center;background:radial-gradient(circle at 50% 54%,rgba(40,255,146,.13),transparent 55%)}.device-feature figure img{width:min(100%,640px);height:auto}.device-feature h3,.platform-proof h3{margin:14px 0 18px;font-size:clamp(2.3rem,4.1vw,4.6rem);line-height:.9;letter-spacing:-.062em;font-weight:430}.device-feature p,.platform-proof p{max-width:50ch;margin:0;color:#aaa9a4;font-size:1.03rem}.device-specs{margin:32px 0 0;padding:0;list-style:none;border-top:1px solid #353531}.device-specs li{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:14px 0;border-bottom:1px solid #353531}.device-specs strong{color:#f1f1ed}.device-specs span{color:#8d8d87}.platform-proof{display:grid;grid-template-columns:.72fr 1.28fr;gap:clamp(32px,5vw,78px);align-items:end;margin-top:clamp(62px,8vw,110px)}.platform-proof h3{max-width:12ch}.platform-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.platform-grid figure{min-width:0;margin:0;border:1px solid #343431;background:#171715}.platform-grid img{display:block;width:100%;height:clamp(160px,15vw,230px);padding:12px;object-fit:contain}.platform-grid figcaption{display:grid;gap:4px;padding:14px;border-top:1px solid #343431}.platform-grid figcaption strong{font-size:.9rem}.platform-grid figcaption span{color:#999993;font-size:.77rem}
@media(max-width:860px){.device-feature,.platform-proof{grid-template-columns:1fr}.device-feature figure{min-height:0}.platform-proof{align-items:start}.platform-proof h3{max-width:none}}@media(max-width:560px){.device-feature{padding:18px}.device-specs li{grid-template-columns:1fr;gap:3px}.platform-grid{grid-template-columns:1fr}.platform-grid img{height:220px}}
.platform-grid{grid-template-columns:repeat(4,minmax(0,1fr))}@media(max-width:860px){.platform-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:560px){.platform-grid{grid-template-columns:1fr}}

/* Consistent 16:9 product photography with a restrained, neutral presentation grade. */
.product-card .product-visual{margin:18px 0 26px;aspect-ratio:16/9;overflow:hidden;border:1px solid var(--line);background:#161614}.product-card .product-visual img{display:block;width:100%;height:100%;object-fit:cover;object-position:56% 50%;filter:brightness(.93) contrast(1.1) saturate(.84)}

/* Smart Desk: decoded renders cross-fade in one controlled sequence with synchronized state labels. */
#smart-desk .smart-desk-visual{--desk-state:#38ed79;position:relative;isolation:isolate;background:#eee}
#smart-desk .smart-desk-visual[data-state="pending"]{--desk-state:#ffd247}
#smart-desk .smart-desk-visual[data-state="busy"]{--desk-state:#ef2237}
#smart-desk .smart-desk-frame{position:absolute;inset:0;z-index:0;opacity:0;object-position:center;filter:none;transition:opacity .9s linear;will-change:opacity;backface-visibility:hidden;transform:translateZ(0)}
#smart-desk .smart-desk-frame.is-active{z-index:1;opacity:1}
#smart-desk .smart-desk-status{position:absolute;z-index:3;left:12px;bottom:12px;display:inline-flex;align-items:center;gap:8px;margin:0;padding:8px 10px;border:1px solid rgba(255,255,255,.38);background:rgba(8,8,7,.84);color:#fff;box-shadow:0 8px 20px rgba(0,0,0,.22);font-size:.66rem;line-height:1;font-weight:600;letter-spacing:.09em;text-transform:uppercase}
#smart-desk .smart-desk-status span{width:8px;height:8px;flex:0 0 auto;border-radius:50%;background:var(--desk-state);box-shadow:0 0 10px var(--desk-state);transition:background-color .35s ease,box-shadow .35s ease}
#smart-desk .smart-desk-status strong{font:inherit}
#smart-desk .smart-desk-replay{position:absolute;right:12px;bottom:12px;z-index:3;display:grid;place-items:center;width:40px;height:40px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;opacity:1;cursor:pointer}
#smart-desk .smart-desk-replay:hover{background:transparent;opacity:1}
#smart-desk .smart-desk-replay:focus-visible{background:transparent;opacity:1;outline:1px solid rgba(17,17,17,.7);outline-offset:2px;box-shadow:none}
#smart-desk .smart-desk-replay img{display:block;width:20px;height:20px;object-fit:contain;filter:none;transition:transform .35s ease}
#smart-desk .smart-desk-replay:hover img,#smart-desk .smart-desk-replay:focus-visible img{transform:rotate(-35deg)}
@media(prefers-reduced-motion:reduce){#smart-desk .smart-desk-frame{transition:none}}

/* The dashboard is permanently composited into the delivered image asset, not layered in CSS. */
#sparo .sparo-dashboard-visual{position:relative;background:#10100f}#sparo .sparo-dashboard-visual .sparo-office-photo{display:block;width:100%;height:100%;object-fit:cover;object-position:center;filter:none}#sparo .sparo-dashboard-visual .sparo-dashboard-screen{display:none}
.bos-stack{margin-top:clamp(56px,8vw,108px);border-top:1px solid #343431}.bos-row{display:grid;grid-template-columns:72px minmax(190px,.75fr) minmax(0,1.7fr);gap:clamp(20px,3vw,48px);align-items:center;min-height:94px;border-bottom:1px solid #343431}.bos-row.is-core{position:relative;background:linear-gradient(90deg,rgba(224,6,28,.16),rgba(224,6,28,.025) 58%,transparent);color:#fff}.bos-row.is-core:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--signal)}.bos-no{color:var(--signal);font-size:.72rem;letter-spacing:.14em}.bos-row strong{font-size:clamp(1rem,1.5vw,1.3rem);font-weight:600}.bos-items{display:flex;flex-wrap:wrap;gap:9px 0;color:#92928d}.bos-items span{padding:0 14px;border-left:1px solid #3a3a36;font-size:.87rem}.bos-items span:first-child{padding-left:0;border-left:0}.bos-row.is-core .bos-items{color:#d0d0cb}.bos-caption{max-width:66ch;margin:28px 0 0 auto;color:#8f8f89;font-size:1rem}.operating-cycle strong{color:#f1f1ed}.operating-cycle div{align-items:start}.about-grid>div>p:not(.quote)+p:not(.quote){margin-top:18px}@media(max-width:860px){.bos-row{grid-template-columns:48px 1fr;gap:10px 20px;padding:20px 0}.bos-items{grid-column:2}.bos-caption{margin-left:68px}}@media(max-width:560px){.bos-row{grid-template-columns:34px 1fr}.bos-items{grid-column:1/-1;padding-left:54px}.bos-items span{width:100%;padding:4px 0;border-left:0}.bos-caption{margin-left:0}}
.contact-section{padding-block:clamp(86px,10vw,142px);background:#efefec;color:var(--ink)}.contact-head{max-width:920px;margin:0 auto clamp(52px,7vw,86px);text-align:center}.contact-head h2{margin:14px 0 22px;font-size:clamp(2.8rem,5.2vw,5.7rem);line-height:.94;letter-spacing:-.06em;font-weight:430}.contact-head>p{max-width:58ch;margin:0 auto;color:#62625e;font-size:1.05rem}.contact-head:after{content:"";display:block;width:64px;height:2px;margin:32px auto 0;background:var(--signal)}.contact-direct{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 34px;margin-top:28px}.contact-direct a{display:flex;gap:10px;align-items:baseline;text-decoration:none}.contact-direct span{color:#7a7a75;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase}.contact-direct strong{font-size:.93rem;font-weight:600}.contact-direct a:hover strong,.contact-direct a:focus-visible strong{color:var(--signal)}.contact-form{max-width:1180px;margin:0 auto}.contact-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(30px,5vw,64px)}.contact-column{display:grid;gap:20px;align-content:start}.contact-fields label{display:grid;gap:8px}.contact-fields label>span{font-size:.75rem;letter-spacing:.04em}.contact-fields input,.contact-fields select,.contact-fields textarea{width:100%;min-height:52px;padding:13px 15px;border:1px solid #d1d1cc;border-radius:0;outline:0;background:#fff;color:var(--ink);font:inherit;transition:border-color .2s ease,box-shadow .2s ease}.contact-fields select{appearance:auto}.contact-fields textarea{min-height:214px;resize:vertical;line-height:1.5}.contact-fields input:focus,.contact-fields select:focus,.contact-fields textarea:focus{border-color:var(--signal);box-shadow:0 0 0 1px var(--signal)}.contact-fields textarea::placeholder{color:#9a9a95}.contact-consent{display:flex;gap:12px;align-items:flex-start;max-width:760px;margin:34px 0 0;color:#5f5f5a;font-size:.82rem;line-height:1.5}.contact-consent input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--signal);flex:0 0 auto}.contact-consent a{color:var(--signal);text-decoration:none}.contact-consent a:hover,.contact-consent a:focus-visible{text-decoration:underline;text-underline-offset:3px}.contact-action{display:grid;justify-items:center;gap:14px;margin-top:34px}.contact-action button{min-height:52px;padding:0 28px;border:1px solid var(--signal);background:var(--signal);color:#fff;font:inherit;font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:background .2s ease,border-color .2s ease,color .2s ease}.contact-action button:hover,.contact-action button:focus-visible{border-color:var(--ink);background:var(--ink)}.contact-action .button-icon{display:inline-block;margin-left:22px;vertical-align:middle}.contact-status{max-width:45ch;margin:0;color:#5f5f5a;text-align:center;font-size:.82rem;line-height:1.45}.contact-honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}@media(max-width:760px){.contact-fields{grid-template-columns:1fr;gap:20px}.contact-head{margin-bottom:48px}.contact-direct{gap:10px 22px}.contact-consent{margin-top:28px}}@media(max-width:560px){.contact-head h2{font-size:clamp(2.7rem,12vw,4rem)}.contact-direct{display:grid}.contact-fields input,.contact-fields select{min-height:50px}.contact-fields textarea{min-height:180px}.contact-action button{width:100%}}

/* Smart Cube: contextual product image, cropped wide without competing with the product copy. */
#smart-cube .cube-visual{display:grid;place-items:start center;height:clamp(250px,24vw,340px);margin:20px 0 24px;overflow:hidden;border:1px solid #3a3a36;background:linear-gradient(145deg,#f1f1ed,#cfcfca)}
#smart-cube .cube-visual img{display:block;width:auto;height:112%;max-width:90%;object-fit:contain;object-position:center top;transition:transform .7s var(--ease)}
#smart-cube:hover .cube-visual img{transform:scale(1.025)}
@media(max-width:560px){#smart-cube .cube-visual{height:290px;margin:18px 0 22px}}

/* Smart Glass: the supplied motion demo makes the opaque/transparent transition immediately tangible. */
#smart-glass .glass-visual{height:clamp(210px,20vw,280px);margin:20px 0 24px;overflow:hidden;border:1px solid #3a3a36;background:#d8d8d4}
#smart-glass .glass-visual img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .7s var(--ease)}
#smart-glass:hover .glass-visual img{transform:scale(1.025)}
@media(max-width:560px){#smart-glass .glass-visual{height:250px;margin:18px 0 22px}}

/* Smart Cube detail view: compact card, full render and click-to-zoom when needed. */
#smart-cube .cube-visual-trigger{position:relative;width:100%;padding:0;color:inherit;font:inherit;text-align:left;cursor:zoom-in}
#smart-cube .cube-visual-trigger>span{position:absolute;right:12px;bottom:12px;padding:8px 10px;background:rgba(8,8,7,.83);color:#f3f3ef;font-size:.66rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase;opacity:0;transform:translateY(5px);transition:opacity .2s var(--ease),transform .2s var(--ease)}
#smart-cube .cube-visual-trigger>span .button-icon{display:inline-block;width:12px;height:12px;margin-left:6px;vertical-align:-2px;transform:none}
#smart-cube .cube-visual-trigger:hover>span,#smart-cube .cube-visual-trigger:focus-visible>span{opacity:1;transform:translateY(0)}
.product-modal{width:min(1100px,calc(100vw - 32px));max-height:calc(100vh - 32px);margin:auto;padding:0;border:1px solid #42423d;background:#10100f;color:var(--paper);overflow:hidden;box-shadow:0 34px 90px rgba(0,0,0,.6)}
.product-modal::backdrop{background:rgba(0,0,0,.82);backdrop-filter:blur(5px)}
.product-modal-inner{position:relative;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(280px,.88fr);min-height:min(690px,calc(100vh - 32px))}
.product-modal-close{position:absolute;z-index:2;top:14px;right:14px;box-sizing:border-box;display:grid;place-items:center;width:42px;height:42px;padding:0;border:1px solid rgba(255,255,255,.45);border-radius:50%;outline:0;background:rgba(10,10,9,.85);color:#fff;appearance:none;font:300 1.65rem/1 Arial,sans-serif;letter-spacing:0;text-align:center;text-transform:none;cursor:pointer}
.product-modal-close:hover{padding:0;border-color:#fff;background:#1b1b19;color:#fff}
.product-modal-close:focus,.product-modal-close:focus-visible{padding:0;border-color:#fff;outline:2px solid rgba(255,255,255,.72);outline-offset:3px;background:#1b1b19;color:#fff;text-decoration:none}
.product-modal-zoom{position:relative;display:grid;place-items:center;min-height:0;padding:28px;border:0;background:linear-gradient(145deg,#f3f3ef,#cacac5);overflow:auto;cursor:zoom-in}
.product-modal-zoom img{display:block;max-width:100%;max-height:calc(100vh - 88px);width:auto;height:auto;transform-origin:center;transition:transform .35s var(--ease)}
.product-modal-zoom span{position:absolute;bottom:18px;left:18px;padding:8px 10px;background:rgba(10,10,9,.8);color:#fff;font-size:.66rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase}
.product-modal-zoom.is-zoomed{align-items:start;cursor:zoom-out}.product-modal-zoom.is-zoomed img{max-width:none;max-height:none;width:155%;transform:none}
.product-modal-text{align-self:end;padding:clamp(34px,5vw,72px) clamp(28px,4vw,58px);background:linear-gradient(145deg,#1a1a17,#0d0d0c)}
.product-modal-text h2{margin:16px 0 20px;font-size:clamp(2.5rem,4.6vw,5rem);line-height:.9;letter-spacing:-.065em;font-weight:430}.product-modal-text p{max-width:34ch;margin:0;color:#aaa9a4;font-size:1rem;line-height:1.55}.product-modal-text .product-modal-hint{margin-top:28px;color:#777772;font-size:.77rem}
@media(max-width:760px){.product-modal{width:calc(100vw - 20px);max-height:calc(100vh - 20px)}.product-modal-inner{grid-template-columns:1fr;min-height:0;max-height:calc(100vh - 20px);overflow:auto}.product-modal-zoom{min-height:360px;padding:20px}.product-modal-zoom img{max-height:480px}.product-modal-text{padding:30px 24px}.product-modal-text h2{font-size:2.7rem}.product-modal-close{top:10px;right:10px}.product-modal-zoom.is-zoomed img{width:200%}}

/* Room Board: a real foyer installation makes the live overview immediately legible. */
#room-board .room-board-visual{height:clamp(188px,18vw,238px);margin:20px 0 24px;overflow:hidden;border:1px solid #3a3a36;background:#e9e9e4}
#room-board .room-board-visual img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .7s var(--ease)}
#room-board:hover .room-board-visual img{transform:scale(1.025)}
@media(max-width:560px){#room-board .room-board-visual{height:220px;margin:18px 0 22px}}

/* Product-image contract: every product card uses one responsive image-box geometry. */
.product-card{--product-image-box-height:clamp(220px,20vw,280px)}
.product-card .product-visual,#smart-cube .cube-visual,#smart-glass .glass-visual,#room-board .room-board-visual{height:var(--product-image-box-height)}
@media(max-width:560px){.product-card{--product-image-box-height:250px}}

/* Smart Glass stays still until visitors deliberately choose a privacy state. */
#smart-glass .glass-visual:not(.glass-visual-toggle)>img{visibility:hidden}
#smart-glass .glass-visual-toggle{position:relative;isolation:isolate}
#smart-glass .glass-visual-toggle .glass-switch-image{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.glass-switch-controls{position:absolute;z-index:1;right:12px;bottom:12px;display:flex;border:1px solid rgba(255,255,255,.48);background:rgba(9,9,8,.86);box-shadow:0 8px 20px rgba(0,0,0,.26)}
.glass-switch-controls button{min-height:36px;margin:0!important;padding:0 12px;border:0;border-left:1px solid rgba(255,255,255,.25);background:transparent;color:#e7e7e1;font:600 .66rem/1 Inter,"Helvetica Neue",Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}.glass-switch-controls button:first-child{border-left:0}.glass-switch-controls button[aria-pressed="true"]{background:var(--signal);color:#fff}.glass-switch-controls button:hover,.glass-switch-controls button:focus-visible{color:#fff;outline:1px solid var(--signal);outline-offset:-1px}
@media(max-width:560px){.glass-switch-controls{right:10px;bottom:10px}.glass-switch-controls button{min-height:34px;padding:0 9px;font-size:.59rem}}

/* Workplaces: both product tracks must remain exactly equal, independent of image or copy width. */
#workplaces .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}#workplaces .product-card{min-width:0}@media(max-width:860px){#workplaces .product-grid{grid-template-columns:1fr}}

/* Door & Reception: both product images share one frame, ratio and spacing. */
#door-connect .card-top{order:-2}
#door-connect:before,#room-board .room-board-visual{display:block;width:100%;height:auto;aspect-ratio:16/9;margin:18px 0 26px;overflow:hidden;border:1px solid #cfcfca;background-color:#e9e9e5}
#door-connect:before{content:"";order:-1;background-image:url("/files/hxa/seo-2026/assets/hxa-door-connect-tablet.jpeg");background-position:center;background-size:cover;background-repeat:no-repeat}
#room-board .room-board-visual img{width:100%;height:100%;object-fit:cover;object-position:center}

/* Shift the Sparo phone toward the optical centre of the 16:9 product frame. */
#sparo .sparo-office-photo{transform:scale(1.12) translateX(9%);transform-origin:center center}

/* Keep the Building OS row numbers clear of the active red marker. */
.bos-row .bos-no{padding-left:14px}

/* Global section-header system: label / headline / summary. */
:is(.showroom-intro,.statement-grid,.section-head,.used-by-head,.contact-head,.closing>.shell){display:grid;grid-template-columns:minmax(140px,.55fr) minmax(0,2fr) minmax(220px,1fr);grid-template-areas:none;column-gap:clamp(30px,5vw,85px);row-gap:0;align-items:start;text-align:left}
.showroom-intro>div,.section-head>div{display:contents}
:is(.showroom-intro,.statement-grid,.section-head,.used-by-head,.contact-head,.closing>.shell) h2{margin:0}
.showroom-intro p,.statement-grid>p,.section-head>p,.used-by-head>p,.contact-head>p,.closing>.shell>p:not(.eyebrow){max-width:none;margin:0;color:var(--muted);font-size:1.05rem}
.alt .section-head>p,.used-by-head>p,.contact-head>p{color:#62625e}
.used-by-head>.section-index,.used-by-head h2,.used-by-head p{grid-area:auto}
.contact-head{max-width:none;margin:0 0 clamp(52px,7vw,86px)}
.contact-head:after{display:none}
.contact-direct{grid-column:2/-1;justify-content:flex-start;margin-top:28px}
.closing{text-align:left}
.eyebrow.centered{justify-content:flex-start}
.closing .button-row{grid-column:2/-1;justify-content:flex-start;margin-top:32px}
.integration .section-head,.about .section-head,.automation-section .section-head{margin-bottom:clamp(42px,6vw,78px)}
.integration-list{margin-top:0}
.about-body{max-width:68ch;margin-left:calc(18% + 40px)}
.about-body>p{color:var(--muted);font-size:1.1rem}
.about-body>p:first-child{margin-top:0}

@media (min-width:701px) and (max-width:1100px){
  :is(.showroom-intro,.statement-grid,.section-head,.used-by-head,.contact-head,.closing>.shell){grid-template-columns:minmax(130px,.55fr) minmax(0,2.45fr);column-gap:clamp(28px,5vw,58px);row-gap:14px}
  .showroom-intro>.section-index,.statement-grid>.section-index,.section-head .section-index,.used-by-head>.section-index,.contact-head>.section-index,.closing>.shell>.eyebrow{grid-column:1;grid-row:1/span 2}
  .showroom-intro>div>h2,.statement-grid>h2,.section-head h2,.used-by-head>h2,.contact-head>h2,.closing>.shell>h2{grid-column:2;grid-row:1}
  .showroom-intro>div>p,.statement-grid>p,.section-head>p,.used-by-head>p,.contact-head>p,.closing>.shell>p:not(.eyebrow){grid-column:2;grid-row:2}
  .contact-direct,.closing .button-row{grid-column:2}
  .about-body{margin-left:calc(30% + 28px)}
}

@media (max-width:700px){
  :is(.showroom-intro,.statement-grid,.section-head,.used-by-head,.contact-head,.closing>.shell){grid-template-columns:1fr;column-gap:0;row-gap:14px}
  .showroom-intro>.section-index,.statement-grid>.section-index,.section-head .section-index,.used-by-head>.section-index,.contact-head>.section-index,.closing>.shell>.eyebrow,.showroom-intro>div>h2,.statement-grid>h2,.section-head h2,.used-by-head>h2,.contact-head>h2,.closing>.shell>h2,.showroom-intro>div>p,.statement-grid>p,.section-head>p,.used-by-head>p,.contact-head>p,.closing>.shell>p:not(.eyebrow){grid-column:1;grid-row:auto}
  .contact-direct,.closing .button-row{grid-column:1;justify-content:flex-start}
  .about-body{margin-left:0}
}

/* Avoid the Inter T/umlaut collision caused by the otherwise tight display tracking. */
#entrance .section-head h2{letter-spacing:-.015em}

/* Smartphone hero: keep the identity markup available for reactivation. */
@media (max-width:767px), (max-width:1100px) and (max-height:560px) and (pointer:coarse){
  .hero{min-height:100svh}
  .hero-identity{display:none}
  .hero-grid{align-self:stretch;align-content:end;grid-template-columns:1fr;grid-template-rows:auto auto;padding-top:clamp(230px,30svh,280px);padding-bottom:calc(20px + env(safe-area-inset-bottom,0px));gap:24px}
  .hero-title{font-size:clamp(3.7rem,19vw,5.8rem)}
  .hero-facts{display:none}
  .hero-side{display:flex;flex-direction:column;align-self:stretch;max-width:none;opacity:1;transform:none}
  .hero-lead{margin-bottom:22px}
  .hero .button-row{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:10px;margin-top:auto}
  .hero .button{min-width:0;width:100%;min-height:48px;padding:14px 12px;gap:8px;font-size:.7rem}
  /* Keep the skyline high even when the first section grows to screen height. */
  .hero #hxaParticleCanvas{height:min(100%,680px);transform:translateY(clamp(-240px,-29svh,-190px))}
  .hero .button-row{
    padding:0;border:0;border-radius:0;
    background:none;box-shadow:none;
    -webkit-backdrop-filter:none;backdrop-filter:none;
  }
  .hero .button{border-radius:0}
}

/* Short smartphone viewports need less space above the headline. */
@media (max-width:767px) and (orientation:landscape), (max-width:1100px) and (max-height:560px) and (pointer:coarse) and (orientation:landscape){
  .hero-grid{padding-top:clamp(120px,35svh,180px)}
  .hero-title{font-size:clamp(3rem,8vw,4.5rem)}
}

@media (max-width:380px){
  .hero .button-row{grid-template-columns:1fr}
}

/* Keep the portrait headline and supporting content together at the hero bottom. */
@media (max-width:767px) and (orientation:portrait){
  .hero .hero-grid{display:flex;flex-direction:column;justify-content:flex-end;align-self:stretch;gap:24px}
  .hero .hero-text,.hero .hero-side{flex:0 0 auto;width:100%;min-height:0;margin:0;padding:0}
  .hero .hero-title{margin:0!important}
  .hero .hero-side{gap:22px}
  .hero .hero-lead,.hero .button-row{margin:0}
}

/* Main Room Booking display: 15% larger within its existing image stage. */
.room-booking-device .device-feature figure img{transform:scale(1.15);transform-origin:center}

/* Shared homepage links to product pages, in both languages. */
.button.product-page-link {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  width: 100%;
  min-width: 0;
  min-height: 52px;
  padding: 15px 18px;
  border: 1px solid #777772;
  border-radius: 0;
  background: transparent;
  color: inherit;
  font-family: inherit;
  font-size: .875rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: .06em;
  text-align: left;
  text-transform: uppercase;
  text-decoration: none;
  box-shadow: none;
  transition: border-color .2s ease, background-color .2s ease;
}
.product-card > .product-page-link { margin-top: 24px; }
.button.product-page-link:hover,
.button.product-page-link:focus-visible {
  border-color: var(--signal);
  background: rgba(224, 6, 28, .08);
  color: inherit;
}
.button.product-page-link:focus-visible {
  outline: 2px solid var(--signal);
  outline-offset: 4px;
}
.button.product-page-link .button-icon { flex: 0 0 16px; }
@media (prefers-reduced-motion: reduce) {
  .button.product-page-link { transition: none; }
}

/* Native Contao home shell, using the shared ONEO navigation. */
body.hxa-home,body.hxa-home #wrapper,body.hxa-home .page{background:#050505;color:#f4f4f0}
body.hxa-home .content-wrapper,body.hxa-home #container,body.hxa-home #main,body.hxa-home #main>.inside,body.hxa-home .mod_article{width:100%;max-width:none;margin:0;padding:0;background:transparent}
body.hxa-home #main>.inside{display:block}
body.hxa-home .mod_article::before,body.hxa-home .mod_article::after{display:none;content:none}
body.hxa-home .mod_article>.ce_html{margin:0;padding:0}

/* Native ONEO elements preserve the approved home colours and action icons. */
.hxa-home .mod_article h1,.hxa-home .mod_article h2,.hxa-home .mod_article h3,.hxa-home .mod_article h4{color:#f4f4f0!important}
.hxa-home .hero .button.home-discover-action{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.hxa-home .hero .button.home-discover-action:hover,.hxa-home .hero .button.home-discover-action:focus-visible{background:var(--signal);color:#fff;border-color:var(--signal)}
.hxa-home .hero .button.home-discover-action::after,.hxa-home .hero .button.home-login-action::after{content:"";display:block;flex:0 0 16px;width:16px;height:16px;background:url("/files/hxa/seo-2026/assets/hxa-arrow-down-right.svg") center/contain no-repeat}
.hxa-home .hero .button.home-login-action::after{background-image:url("/files/hxa/seo-2026/assets/hxa-arrow-up-right.svg")}
.hxa-home .home-operating-caption .bos-caption{margin:28px 0 0 auto}
@media(max-width:767px){.hxa-home .home-operating-caption .bos-caption{margin-left:0}}

/* Native home headings retain contrast in light sections and responsive grid positions. */
.hxa-home .mod_article :is(.used-by,.alt,.contact) h2{color:var(--ink)!important}
.hxa-home .home-trust-intro p{max-width:none;margin:0;color:#62625e;font-size:1.05rem}
@media(min-width:768px) and (max-width:1150px){.hxa-home :is(.home-operating-headline,.home-film-headline,.home-trust-headline){grid-column:2;grid-row:1}.hxa-home :is(.home-operating-intro,.home-film-intro,.home-trust-intro){grid-column:2;grid-row:2}}
@media(max-width:767px){.hxa-home :is(.home-operating-headline,.home-film-headline,.home-trust-headline,.home-operating-intro,.home-film-intro,.home-trust-intro){grid-column:1;grid-row:auto}}
	
/* Shared approved native Contao form design, scoped to the home drafts. */
/* Contao contact form integration. */
.contact-direct .contact-email {
  display: flex;
  gap: 10px;
  align-items: baseline;
}
.hxa-home .contao-contact-form form,
.hxa-home .contao-contact-form .formbody {
  width: 100%;
}
.hxa-home .contao-contact-form .formbody {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px clamp(30px, 5vw, 64px);
}
.hxa-home .contao-contact-form .widget {
  min-width: 0;
}
.hxa-home .contao-contact-form .widget > label,
.hxa-home .contao-contact-form .widget > fieldset > legend {
  display: block;
  margin: 0 0 8px;
  color: var(--ink);
  font-size: .75rem;
  font-weight: 400;
  letter-spacing: .04em;
}
.hxa-home .contao-contact-form :is(input[type="text"], input[type="email"], input[type="tel"], select, textarea) {
  width: 100%;
  min-height: 52px;
  padding: 13px 15px;
  border: 1px solid #d1d1cc;
  border-radius: 0;
  outline: 0;
  background: #fff;
  color: var(--ink);
  font: inherit;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.hxa-home .contao-contact-form textarea {
  min-height: 214px;
  resize: vertical;
  line-height: 1.5;
}
.hxa-home .contao-contact-form :is(input[type="text"], input[type="email"], input[type="tel"], select, textarea):focus {
  border-color: var(--signal);
  box-shadow: 0 0 0 1px var(--signal);
}
.hxa-home .contao-contact-form :is(.widget-textarea, .widget-checkbox, .widget-captcha, .widget-submit) {
  grid-column: 1 / -1;
}
.hxa-home .contao-contact-form fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}
.hxa-home .contao-contact-form .widget-checkbox span {
  display: inline-flex;
  gap: 8px;
  align-items: flex-start;
  margin: 0 18px 8px 0;
}
.hxa-home .contao-contact-form input[type="checkbox"] {
  display: inline-block !important;
  width: 18px !important;
  min-width: 18px !important;
  max-width: 18px !important;
  height: 18px !important;
  min-height: 18px !important;
  margin: 2px 0 0 !important;
  padding: 0 !important;
  accent-color: var(--signal);
  flex: 0 0 18px;
}
.hxa-home .contao-contact-form .contact-consent {
  max-width: 820px;
  color: #5f5f5a;
  font-size: .82rem;
  line-height: 1.5;
}
.hxa-home .contao-contact-form .contact-consent legend {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.hxa-home .contao-contact-form .contact-consent a {
  color: var(--signal);
  text-decoration: none;
}
.hxa-home .contao-contact-form .contact-consent a:hover,
.hxa-home .contao-contact-form .contact-consent a:focus-visible {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.hxa-home .contao-contact-form .widget-captcha {
  color: #5f5f5a;
  font-size: .82rem;
}
.hxa-home .contao-contact-form .widget-submit {
  display: grid;
  justify-items: center;
  margin-top: 14px;
}
.hxa-home .contao-contact-form .widget-submit button,
.hxa-home .contao-contact-form .widget-submit input[type="submit"] {
  min-height: 52px;
  padding: 0 28px;
  border: 1px solid var(--signal);
  border-radius: 0;
  background: var(--signal);
  color: #fff;
  font: inherit;
  font-size: .76rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  cursor: pointer;
}
.hxa-home .contao-contact-form .widget-submit :is(button, input[type="submit"]):hover,
.hxa-home .contao-contact-form .widget-submit :is(button, input[type="submit"]):focus-visible {
  border-color: var(--ink);
  background: var(--ink);
}
.hxa-home .contao-contact-form .error {
  color: var(--signal);
}


.hxa-home #contact{--ink:#050505;--signal:#e0061c;background:#efefec;color:#050505;color-scheme:light}
.hxa-home #contact :is(h2,h3,strong){color:#050505}
.hxa-home #contact p{color:#62625e}
.hxa-home #contact a{color:#050505}
.hxa-home #contact a:hover{color:#e0061c}
.hxa-home #contact .contact-form{max-width:1180px;margin:0 auto}
.hxa-home #contact .contao-contact-form .widget{margin:0}
.hxa-home #contact .contao-contact-form :is(.widget-altcha,.contao-preview-note){grid-column:1/-1}
.hxa-home #contact .contao-contact-form .contact-consent{display:block}
.hxa-home #contact .contao-contact-form .contact-consent a{color:#e0061c}
.hxa-home #contact .contao-contact-form button:disabled{cursor:not-allowed}
.hxa-home #contact .contao-contact-form button{margin:0;box-shadow:none}
.hxa-home #contact .contao-preview-note{font-size:14px;margin:0 0 24px;padding:12px 0;border-bottom:1px solid #d1d1cc}
.hxa-home #contact .contao-contact-form .widget-altcha p{font-size:14px;margin:0}
.hxa-home #contact .contao-contact-form :is(a,button):focus-visible{outline:2px solid #e0061c;outline-offset:4px}

.hxa-home .mod_article .contact-section h2{color:var(--ink)!important}
.hxa-home .home-about-intro p,.hxa-home .home-trial-intro p{max-width:none;margin:0;color:var(--muted);font-size:1.05rem}
.hxa-home .home-about-body>p:not(.quote){color:var(--muted);font-size:1.1rem}
.hxa-home .home-about-body>p:first-child{margin-top:0}
.hxa-home .home-contact-intro p{max-width:none;margin:0;color:#62625e;font-size:1.05rem}
.hxa-home .home-contact-direct>p{display:flex;flex-wrap:wrap;gap:10px 34px;margin:0}
.hxa-home #contact .contao-contact-form{max-width:1180px;margin:0 auto}
.hxa-home #contact .contao-contact-form .widget{margin:0}
.hxa-home #contact .contao-contact-form :is(.widget-altcha,.contao-preview-note){grid-column:1/-1}
.hxa-home :is(.home-register-action,.home-trial-login-action)::after{content:"";display:block;flex:0 0 16px;width:16px;height:16px;background:url("/files/hxa/seo-2026/assets/hxa-arrow-up-right.svg") center/contain no-repeat}
@media(min-width:768px) and (max-width:1150px){.hxa-home :is(.home-about-headline,.home-trial-headline,.home-contact-headline){grid-column:2;grid-row:1}.hxa-home :is(.home-about-intro,.home-trial-intro,.home-contact-intro){grid-column:2;grid-row:2}.hxa-home .home-trial-eyebrow{grid-column:1;grid-row:1/span 2}}
@media(max-width:767px){.hxa-home :is(.home-about-headline,.home-trial-headline,.home-contact-headline,.home-about-intro,.home-trial-intro,.home-contact-intro,.home-trial-eyebrow){grid-column:1;grid-row:auto}.hxa-home .contao-contact-form .formbody{grid-template-columns:1fr;gap:20px}.hxa-home .contao-contact-form .widget{grid-column:1}.hxa-home .contao-contact-form .widget-submit :is(button,input[type="submit"]){width:100%}}
/* Native editable showroom elements retain the approved panel layout. */
.hxa-home .home-showroom-image,.hxa-home .home-showroom-image figure{margin:0!important;padding:0!important;width:100%}
.hxa-home .home-showroom-image img{display:block;width:100%;height:auto}
.hxa-home .home-showroom-panel{display:contents!important}
.hxa-home .showroom-panel h3{color:var(--ink)!important}
@media(min-width:701px) and (max-width:1100px){.hxa-home .home-showroom-headline{grid-column:2;grid-row:1}.hxa-home .home-showroom-intro{grid-column:2;grid-row:2}}
@media(max-width:700px){.hxa-home .home-showroom-headline,.hxa-home .home-showroom-intro{grid-column:1;grid-row:auto}}
/* Native automation content participates in the shared section grid. */
.hxa-home .home-automation-cycle{display:contents!important}
.hxa-home .home-automation-intro p{margin:0;color:var(--muted);font-size:1.05rem}
@media(min-width:701px) and (max-width:1100px){.hxa-home .home-automation-headline,.hxa-home .home-integration-headline{grid-column:2;grid-row:1}.hxa-home .home-automation-intro,.hxa-home .home-integration-intro{grid-column:2;grid-row:2}}
@media(max-width:700px){.hxa-home .home-automation-headline,.hxa-home .home-automation-intro,.hxa-home .home-integration-headline,.hxa-home .home-integration-intro{grid-column:1;grid-row:auto}}

/* Native room-service image and text use the approved stacked experience. */
.hxa-home .home-services-image,.hxa-home .home-services-image figure{margin:0!important;padding:0!important;width:100%}
.hxa-home .home-services-image img{display:block;width:100%;height:auto}
.hxa-home .home-services-flow{display:contents!important}
.hxa-home .home-services-intro p{margin:0;color:var(--muted);font-size:1.05rem}
@media(min-width:701px) and (max-width:1100px){.hxa-home .home-services-headline{grid-column:2;grid-row:1}.hxa-home .home-services-intro{grid-column:2;grid-row:2}}
@media(max-width:700px){.hxa-home .home-services-headline,.hxa-home .home-services-intro{grid-column:1;grid-row:auto}}

/* Editable native entrance cards retain the common product-card layout. */
.hxa-home .home-entrance-card{display:contents!important}
.hxa-home .home-entrance-intro p{margin:0;color:#62625e;font-size:1.05rem}
.hxa-home .product-card .home-product-action{margin-top:auto}
@media(min-width:701px) and (max-width:1100px){.hxa-home .home-entrance-headline{grid-column:2;grid-row:1}.hxa-home .home-entrance-intro{grid-column:2;grid-row:2}}
@media(max-width:700px){.hxa-home .home-entrance-headline,.hxa-home .home-entrance-intro{grid-column:1;grid-row:auto}}

/* The approved light entrance area uses dark product headings. */
.hxa-home .alt h3{color:var(--ink)!important}

/* Native Home hardware comparison and photo captions. */
.hxa-home .home-device-intro p{margin:0;color:var(--muted);font-size:1.05rem}
.hxa-home .home-device-image{min-width:0;margin:0}
.hxa-home .home-device-image figure{margin:0}
.hxa-home .home-device-details>p:first-child,.hxa-home .home-platform-heading>p:first-child,.hxa-home .home-showcase-caption>p:first-child{margin:0}
.hxa-home .home-showcase-caption .showcase-eyebrow{color:var(--signal);font-size:.7rem;letter-spacing:.13em;text-transform:uppercase}
.hxa-home .room-booking-device .platform-grid{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch}
.hxa-home .home-platform-image{min-width:0;margin:0}
.hxa-home .home-platform-image figure{height:100%;display:grid;grid-template-rows:auto 1fr}
.hxa-home .home-platform-image figcaption{align-content:start}
@media(min-width:701px) and (max-width:1100px){.hxa-home .home-device-headline{grid-column:2;grid-row:1}.hxa-home .home-device-intro{grid-column:2;grid-row:2}}
@media(max-width:700px){.hxa-home .home-device-headline,.hxa-home .home-device-intro{grid-column:1;grid-row:auto}}
@media(max-width:560px){.hxa-home .room-booking-device .platform-grid{grid-template-columns:1fr}}

.hxa-home .home-platform-image figcaption{display:grid!important;gap:4px;padding:14px!important;color:var(--paper)!important;text-align:left!important;position:static!important}
.hxa-home .home-platform-image figcaption strong{display:block;color:var(--paper)!important;font-size:.9rem}
.hxa-home .home-platform-image figcaption .platform-detail{display:block;color:#999993;font-size:.77rem}

/* Native Home workplaces product cards. */
.hxa-home .home-workplaces-card,.hxa-home .home-sparo-details{display:contents!important}
.hxa-home .home-workplaces-intro p{margin:0;color:var(--muted);font-size:1.05rem}
.hxa-home .home-sparo-office-photo,.hxa-home .home-room-booking-image,.hxa-home .home-smart-cube-image{width:100%;height:100%;margin:0}
.hxa-home .home-sparo-office-photo figure,.hxa-home .home-room-booking-image figure,.hxa-home .home-smart-cube-image figure{margin:0;height:100%}
.hxa-home .home-sparo-office-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.12) translateX(9%);transform-origin:center center}
.hxa-home .home-sparo-dashboard-screen{display:none}
.hxa-home .home-room-booking-image img{display:block;width:100%;height:100%;object-fit:cover}
.hxa-home #smart-cube .home-smart-cube-image img{width:auto;height:112%;max-width:90%;object-fit:contain;object-position:center top;margin-inline:auto}
@media(min-width:701px) and (max-width:1100px){.hxa-home .home-workplaces-headline{grid-column:2;grid-row:1}.hxa-home .home-workplaces-intro{grid-column:2;grid-row:2}}
@media(max-width:700px){.hxa-home .home-workplaces-headline,.hxa-home .home-workplaces-intro{grid-column:1;grid-row:auto}}

.hxa-home details.home-sparo-details{display:block!important}
.hxa-home #workplaces .home-sparo-office-photo figure,.hxa-home #workplaces .home-room-booking-image figure{width:100%!important;float:none!important}
.hxa-home #workplaces details.product-details .accordion{padding:0}
.hxa-home #workplaces details.product-details summary strong{font-weight:inherit}

.hxa-home #workplaces details.product-details{background:transparent!important;border-inline:0;border-bottom:0}
.hxa-home #workplaces details.product-details>summary{background:transparent!important;color:var(--paper)!important;border:0!important;padding:18px 0!important}
.hxa-home #workplaces details.product-details>.accordion{background:transparent!important;border:0!important;color:var(--muted);padding:0 0 10px!important}
.hxa-home #workplaces details.product-details>summary:focus-visible{outline:2px solid var(--signal);outline-offset:4px}

/* Native hero canvas uses the approved HXA canvas identifier. */
.hxa-home #hxaParticleCanvas{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:0}
.hxa-home .hero-grid,.hxa-home .hero-text,.hxa-home .hero-side,.hxa-home .hero-title,.hxa-home .hero-lead{min-width:0;max-width:100%}
.hxa-home .hero-title p{margin:0;font:inherit;line-height:inherit;letter-spacing:inherit;white-space:normal}
.hxa-home .hero-lead p{margin:0;font:inherit;line-height:inherit;white-space:normal}
.hxa-home .home-smart-cube-image figure{display:grid;place-items:start center;width:100%;float:none}
/* Preserve the approved one-pixel showroom tab grid. */
.hxa-home .showroom-tab{margin:0}
/* Native ONEO action wrappers retain one border and one action arrow. */
.hxa-home :is(.about,.closing) .button-box{display:contents}
.hxa-home :is(.about,.closing) .button-box::before,.hxa-home :is(.about,.closing) .button-box::after{display:none;content:none}
.hxa-home :is(.about,.closing) .button-box>a.button{display:inline-flex;align-items:center;justify-content:space-between;gap:25px;width:auto;min-width:200px;margin:0;padding:16px 18px;border:1px solid #53534f;border-radius:0;background:transparent;color:var(--paper);font-family:inherit;font-size:.76rem;font-weight:400;line-height:1.55;letter-spacing:.08em;text-align:left;text-transform:uppercase;text-decoration:none;box-shadow:none}
.hxa-home .closing .button-box>a.button.primary{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.hxa-home .closing .button-box>a.button.primary:hover,.hxa-home .closing .button-box>a.button.primary:focus-visible{background:var(--signal);color:#fff;border-color:var(--signal)}
.hxa-home :is(.about,.closing) .button-box>a.button.quiet:hover,.hxa-home :is(.about,.closing) .button-box>a.button.quiet:focus-visible{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.hxa-home :is(.about,.closing) .button-box>a.button:focus-visible{outline:2px solid var(--signal);outline-offset:4px}
@media(max-width:700px){.hxa-home :is(.about,.closing) .button-box>a.button{width:100%;min-width:0}}

/* Native hero actions preserve the approved flex layout and single arrow. */
.hxa-home .hero .button-box{display:contents}
.hxa-home .hero .button-box::before,.hxa-home .hero .button-box::after{display:none;content:none}
.hxa-home .hero .button-box>a.button{display:inline-flex;align-items:center;justify-content:space-between;gap:25px;width:auto;min-width:200px;margin:0;padding:16px 18px;border:1px solid #53534f;border-radius:0;background:transparent;color:var(--paper);font-family:inherit;font-size:.76rem;font-weight:400;line-height:1.55;letter-spacing:.08em;text-align:left;text-transform:uppercase;text-decoration:none;box-shadow:none}
.hxa-home .hero .button-box>a.button.home-discover-action{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.hxa-home .hero .button-box>a.button.home-discover-action:hover,.hxa-home .hero .button-box>a.button.home-discover-action:focus-visible{background:var(--signal);color:#fff;border-color:var(--signal)}
.hxa-home .hero .button-box>a.button.home-login-action:hover,.hxa-home .hero .button-box>a.button.home-login-action:focus-visible{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.hxa-home .hero .button-box>a.button:focus-visible{outline:2px solid var(--signal);outline-offset:4px}
@media(max-width:767px),(max-width:1100px) and (max-height:560px) and (pointer:coarse){.hxa-home .hero .button-box>a.button{min-width:0;width:100%;min-height:48px;padding:14px 12px;gap:8px;font-size:.7rem}}

/* Keep native Showroom markers independent of ONEO button states. */
.hxa-home .showroom-hotspot,
.hxa-home .showroom-hotspot:hover,
.hxa-home .showroom-hotspot:focus,
.hxa-home .showroom-hotspot:focus-visible,
.hxa-home .showroom-hotspot:active {
  box-sizing: border-box;
  width: 66px;
  min-width: 66px;
  max-width: 66px;
  height: 66px;
  min-height: 66px;
  max-height: 66px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
}
.hxa-home .showroom-hotspot:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}
