/* KOVE hero: brand statement, live bike stage and a single model-detail action. */
/* Equal visible width and ground line, independent of transparent source padding. */
.showroom-current,.showroom-peek,.model-photo:has(.bike-frame){container-type:size}
.model-photo:has(.bike-frame){display:flex;align-items:center;justify-content:center}
.bike-frame{position:relative;display:block;flex:none;width:min(100cqw,160cqh);aspect-ratio:1.6;pointer-events:none}
.bike-frame img{position:absolute;max-width:none;width:var(--bike-width)!important;height:var(--bike-height)!important;left:var(--bike-left);top:var(--bike-top);padding:0!important;object-fit:fill!important}
:root{--site-header-height:94px}
.header{height:var(--site-header-height)}
.showroom{background:white;overflow:clip}
.showroom-scene{height:calc(100svh - var(--site-header-height));height:calc(100dvh - var(--site-header-height));position:relative;isolation:isolate;background:#f8f9f9;overflow:clip}
.showroom-accent{position:absolute;inset:0 0 0 var(--section-split);background:var(--accent);z-index:-3}
.showroom-terrain{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.045;mix-blend-mode:multiply;z-index:-2}
.showroom-wordmark{position:absolute;left:-2%;bottom:18px;font-family:var(--display);font-weight:800;font-style:italic;font-size:35vw;line-height:.8;letter-spacing:-.045em;opacity:.055;z-index:-1;pointer-events:none}
.showroom-intro{position:absolute;top:42px;left:var(--gutter);z-index:3;pointer-events:none}
.showroom-intro h1{font-family:var(--display);font-size:clamp(76px,6.7vw,128px);line-height:.88;font-weight:800;letter-spacing:-.025em}
.showroom-intro>p{margin-top:22px;font-size:18px;line-height:1.4;color:var(--muted)}
.showroom-heading{position:absolute;top:46px;right:var(--gutter);text-align:right;z-index:3;pointer-events:none}

.showroom-heading h2{font-size:clamp(72px,6vw,116px);font-style:italic;line-height:.95;font-weight:700;text-transform:uppercase;letter-spacing:-.025em}
#showroom-price{font-size:clamp(40px,3vw,56px);font-weight:600;line-height:1;margin-top:16px;letter-spacing:-.035em;font-variant-numeric:tabular-nums}
.showroom-stage{position:absolute;inset:165px 0 82px;touch-action:pan-y;z-index:1;isolation:isolate}
/* Transparent bike cutouts render in their original colours above the scene. */
.showroom-stage:focus-visible{outline-offset:-5px}
.showroom-current{position:absolute;inset:0 13% 0 20%;display:flex;align-items:center;justify-content:center;z-index:2;outline-offset:-6px}
.showroom-current img{width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none;transition:transform var(--duration-slow) var(--ease)}
.showroom-current:hover img{transform:scale(1.02)}
.showroom-peek{position:absolute;top:31%;bottom:4%;width:30%;background:transparent;padding:0 0 24px;display:flex;align-items:center;justify-content:center;z-index:1}
.showroom-peek-prev{left:-16%}.showroom-peek-next{right:-16%}
.showroom-peek img{height:100%;width:100%;object-fit:contain;opacity:1;user-select:none;-webkit-user-drag:none;transition:transform var(--duration-slow) var(--ease)}
.showroom-peek:hover img,.showroom-peek:focus-visible img{transform:scale(1.04)}
.showroom-peek>span:not(.bike-frame){position:absolute;bottom:0;font-size:14px;font-weight:500}
.showroom-peek-prev>span:not(.bike-frame){right:16px}.showroom-peek-next>span:not(.bike-frame){left:16px}
.showroom-toolbar{position:absolute;bottom:22px;left:var(--gutter);right:var(--gutter);display:grid;grid-template-columns:1fr;gap:20px;align-items:center;z-index:4}
.showroom-categories{display:flex;align-items:center;gap:4px;justify-self:center;background:#e8eeee;padding:4px;border-radius:999px}
.showroom-categories button{padding:10px 19px;min-height:44px;border-radius:999px;font-size:15px;background:transparent;transition:background var(--duration-fast)}
.showroom-categories button[aria-pressed=true]{background:var(--ink);color:white}
.showroom-categories button:hover{background:#d1dede}.showroom-categories button[aria-pressed=true]:hover{background:#2c4245}

.model-line{align-items:baseline;gap:14px}.model-line h3{font-size:clamp(38px,3vw,48px)}.model-line p{font-size:26px;letter-spacing:-.035em}
@media(min-width:1700px){.showroom-stage{top:190px;bottom:90px}.showroom-current{inset-inline:20% 13%}.showroom-intro{top:48px}}
@media(max-width:1100px){
 .showroom-intro h1{font-size:78px}.showroom-intro>p{font-size:16px}.showroom-heading h2{font-size:64px}#showroom-price{font-size:38px}
 .showroom-stage{top:230px;bottom:90px}.showroom-current{inset-inline:15% 12%}.showroom-peek{top:28%;bottom:6%}
 .showroom-toolbar{grid-template-columns:1fr;gap:14px}
 
}
@media(max-width:800px){
 
 :root{--site-header-height:80px}.showroom-intro{top:32px}.showroom-intro h1{font-size:clamp(54px,8.5vw,69px)}.showroom-heading{top:36px;max-width:42%}.showroom-heading h2{font-size:clamp(50px,7vw,60px)}#showroom-price{font-size:36px}
 .showroom-stage{top:260px;bottom:95px}.showroom-current{inset-inline:9%}.showroom-peek-prev{left:-20%}.showroom-peek-next{right:-20%}.showroom-peek>span:not(.bike-frame){display:none}
 .showroom-categories button{padding-inline:14px}
}
@media(max-width:600px){
 :root{--site-header-height:76px}.showroom-accent{inset:350px 0 0;clip-path:polygon(0 9%,100% 0,100% 100%,0 100%)}
 .showroom-intro{left:20px;top:28px}.showroom-intro h1{font-size:clamp(54px,13.8vw,82px)}.showroom-intro>p{margin-top:18px;font-size:16px}
 .showroom-heading{top:245px;left:20px;right:20px;max-width:none;text-align:left;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:8px 12px}
 .showroom-heading h2{font-size:clamp(44px,11.6vw,60px)}#showroom-price{font-size:32px;margin:0;line-height:1}
 .showroom-wordmark{font-size:56vw;bottom:115px;left:-5%;opacity:.07}
 .showroom-stage{top:365px;bottom:133px}.showroom-current{inset-inline:2%}.showroom-peek{width:35%;top:34%;bottom:10%}.showroom-peek-prev{left:-26%}.showroom-peek-next{right:-26%}
 .showroom-toolbar{left:20px;right:20px;bottom:18px;grid-template-columns:1fr;gap:15px}.showroom-categories{width:100%;justify-self:stretch;display:grid;grid-template-columns:1.2fr 1fr 1.2fr}.showroom-categories button{font-size:14px;padding:9px 10px}

 .model-line h3{font-size:38px}.model-line p{font-size:26px}
}
@media(max-width:360px){.showroom-intro h1{font-size:49px}.showroom-heading{top:225px}.showroom-heading h2{font-size:40px}#showroom-price{font-size:28px}.showroom-accent{top:330px}.showroom-stage{top:345px;bottom:131px}.model-line h3{font-size:34px}.model-line p{font-size:24px}}
@media(prefers-reduced-motion:reduce){.showroom *{animation:none!important;transition:none!important}}

.showroom-more{pointer-events:auto;background:var(--ink);color:white;margin-top:24px;min-height:48px;padding:12px 22px;border-radius:999px;font-size:15px;gap:28px}
.showroom-more:hover{background:white;color:var(--ink)}
@media(max-width:600px){.showroom-more{grid-column:1/-1;justify-self:start;margin-top:10px;min-height:44px;padding:10px 19px;font-size:14px}.showroom-heading{gap:8px 12px}}

/* Keep the complete phone composition inside the same full-height opening. */
@media(max-width:600px){
 .showroom-scene{display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;gap:14px;padding:24px 20px 18px}
 .showroom-intro,.showroom-heading,.showroom-toolbar{position:relative;inset:auto}
 .showroom-intro h1{font-size:clamp(42px,12.3vw,68px)}
 .showroom-intro>p{margin-top:12px}
 .showroom-heading h2{font-size:clamp(40px,11.6vw,60px)}
 .showroom-stage{position:relative;inset:auto;min-height:0}
 .showroom-accent{inset:42% 0 0}
 .showroom-wordmark{bottom:80px}
 .showroom-toolbar{display:block}
}
@media(max-width:600px) and (max-height:740px){
 .showroom-scene{gap:8px;padding-block:16px 14px}
 .showroom-intro h1{font-size:clamp(36px,10.8vw,46px)}
 .showroom-intro>p{font-size:13px;line-height:1.35;margin-top:8px}
 .showroom-heading{gap:6px 10px}
 .showroom-heading h2{font-size:clamp(34px,10vw,42px)}
 #showroom-price{font-size:28px}
 .showroom-more{min-height:40px;padding:8px 16px;font-size:13px;margin-top:0}
 .showroom-categories button{min-height:40px;padding:8px;font-size:12px}
}

/* The selected bike's verified monthly instalment sits beside its cash price. */
.showroom-pricing{display:grid;grid-template-columns:auto auto;justify-content:end;align-items:center;gap:16px 28px;margin-top:16px}
.showroom-installment{grid-column:1;grid-row:1/3;display:inline-flex;align-items:baseline;gap:5px;pointer-events:auto;min-height:44px;min-width:0;white-space:nowrap;text-align:left;padding:4px 0;border-radius:8px}
.showroom-installment>span{font-size:14px;line-height:1.4}
.showroom-installment strong{font-size:clamp(28px,2.2vw,40px);font-weight:600;line-height:1.1;letter-spacing:-.025em;font-variant-numeric:tabular-nums;margin:0}
.showroom-installment:hover strong{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.showroom-pricing #showroom-price{grid-column:2;grid-row:1;margin:0}
.showroom-pricing .showroom-more{grid-column:2;grid-row:2;justify-self:end;margin:0}
@media(max-width:1100px){.showroom-pricing{column-gap:22px}.showroom-installment strong{font-size:28px}}
@media(min-width:601px) and (max-width:800px){
 .showroom-pricing{grid-template-columns:minmax(0,1fr);justify-items:end;gap:6px;margin-top:12px}
 .showroom-pricing #showroom-price{grid-column:1;grid-row:1}
 .showroom-installment{grid-column:1;grid-row:2;justify-self:end;min-height:34px;padding:0;align-items:center}
 .showroom-installment strong{font-size:22px}
 .showroom-installment>span{font-size:12px}
 .showroom-pricing .showroom-more{grid-column:1;grid-row:3;min-height:44px;padding:10px 18px;font-size:14px;gap:20px}
}
@media(max-width:600px){
 .showroom-pricing{display:contents}
 .showroom-heading>h2{grid-column:1;grid-row:1}
 .showroom-pricing #showroom-price{grid-column:2;grid-row:1}
 .showroom-pricing .showroom-more{grid-column:1;grid-row:2;justify-self:start;margin:0}
 .showroom-installment{grid-column:2;grid-row:2;display:inline-flex;justify-content:end;align-items:center;gap:3px;justify-self:end;text-align:right;min-width:0;padding:0}
 .showroom-installment>span{font-size:11px}
 .showroom-installment strong{font-size:18px;margin:0}
}
