@font-face{font-family:'Josefin Sans';font-style:normal;font-weight:300 700;font-display:swap;src:url(assets/josefin-sans-latin.woff2) format('woff2')}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:300 700;font-display:swap;src:url(assets/hanken-grotesk-latin.woff2) format('woff2')}
:root{--ink:#15181C;--graphite:#2C313A;--aluminium:#A7ADB4;--silver:#E7EAEC;--paper:#FAFAFA;--bronze:#B0742E;--deep-bronze:#6E4A1E;--slate:#2F6E7A;--slate-deep:#204A52;--white:#FFFFFF;--accent:var(--bronze);color-scheme:dark;font-family:'Hanken Grotesk',sans-serif;color:var(--silver);background:var(--ink);font-synthesis:none}
*{box-sizing:border-box;fill:currentColor}
html{scroll-behavior:smooth}
body{margin:0;font-size:16px;line-height:24px}
button,input,select,textarea{font:inherit}
button,a,input,select,textarea{-webkit-tap-highlight-color:rgba(176,116,46,.16)}
a{color:inherit;text-decoration:none}
button{cursor:pointer}
button:disabled{cursor:wait}
img{display:block;max-width:100%;object-fit:contain}
figure,p,h1,h2,h3{margin:0}
ul{padding:0;margin:0;list-style:none}
button,input,select,textarea{color:inherit}
button{border:0}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
section[id],#main,#footer{scroll-margin-top:var(--landing,176px)}
section{position:relative}
h1,h2{font-family:'Josefin Sans',sans-serif;font-weight:600;color:var(--paper)}
h2{font-size:40px;line-height:48px;letter-spacing:.01em}
h3{font-weight:400}
.wrap{width:calc(100% - 192px);max-width:1248px;margin-inline:auto}
.eyebrow,.annotation,.scroll-cue{font-size:11px;font-weight:600;line-height:16px;letter-spacing:.1em}
.eyebrow{color:var(--aluminium)}
.product-intro .eyebrow::before,.enquiry-intro .eyebrow::before,.page-hero .hero-copy .eyebrow::before{content:'';display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--accent);vertical-align:2px;margin-right:12px}
.caption{font-size:12px;line-height:16px;letter-spacing:.01em;color:var(--aluminium)}
.button,.text-link{display:inline-flex;align-items:center;justify-content:space-between;gap:16px;min-height:40px;font-size:14px;font-weight:600;line-height:20px;transition:background-color 160ms,border-color 160ms}
.button{border-radius:999px;padding:10px 20px;background:var(--paper);color:var(--ink);border:1px solid var(--paper);white-space:nowrap}
.button:hover{background:var(--silver);border-color:var(--bronze)}
.text-link:hover{color:var(--paper)}
.arrow{font-size:17px;line-height:20px;display:inline-block;transition:transform 160ms}
a:hover .arrow,button:hover .arrow{transform:translateX(3px)}
html.has-motion .arrow{transition:none}
.skip-link{position:fixed;z-index:60;top:8px;left:24px;padding:12px 20px;background:var(--paper);color:var(--ink);transform:translateY(-200%)}
.skip-link:focus{transform:none}
.site-header{position:fixed;inset:0 0 auto;height:152px;z-index:20;pointer-events:none}
.site-header::before{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(21,24,28,.97) 0%,rgba(21,24,28,.9) 45%,rgba(21,24,28,.6) 72%,rgba(21,24,28,0) 100%);opacity:0;transition:opacity .24s;pointer-events:none}
.site-header.is-scrolled::before{opacity:1}
.site-header.over-paper::before{background:linear-gradient(to bottom,rgba(250,250,250,.97) 0%,rgba(250,250,250,.9) 45%,rgba(250,250,250,.6) 72%,rgba(250,250,250,0) 100%)}
.site-header>*{pointer-events:auto}
.brand-link{position:absolute;left:max(32px,calc((100vw - 1440px)/2 + 64px));top:28px;width:120px;height:120px}
.brand-link img{width:100%;height:100%;object-fit:contain}
.brand-link .logo-black{display:none}
.site-header.over-paper .logo-white{display:none}
.site-header.over-paper .logo-black{display:block}
.site-header.over-paper{--accent:var(--slate)}
.site-header.over-photo .brand-link::before{content:'';position:absolute;inset:-8px;background:rgba(21,24,28,.72);z-index:-1}
.header-pill{background:rgba(21,24,28,.88);border:1px solid rgba(250,250,250,.16);border-radius:999px;color:var(--paper);height:40px}
.primary-nav{position:absolute;top:32px;left:50%;transform:translateX(-50%);width:512px;padding:3px;display:flex}
.primary-nav>a,.primary-nav summary{display:flex;align-items:center;justify-content:center;border-radius:999px;font-size:12px;font-weight:600;line-height:16px;transition:background-color 160ms}
.primary-nav>:nth-child(1){width:56px}.primary-nav>:nth-child(2){width:88px}.primary-nav>:nth-child(3){width:80px}.primary-nav>:nth-child(4){width:72px}.primary-nav>:nth-child(5){width:128px}.primary-nav>:nth-child(6){width:80px}
.primary-nav a[aria-current],.primary-nav a:hover,.primary-nav summary:hover,.nav-products[open]>summary,.nav-products.is-current>summary{background:var(--graphite)}
.nav-progress{position:absolute;left:16px;right:16px;top:calc(100% + 6px);height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left center;border-radius:1px}
.header-whatsapp{position:absolute;top:32px;right:max(32px,calc((100vw - 1440px)/2 + 64px));width:144px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;font-size:14px;font-weight:600}
.menu-button{display:none}
#intro{overflow-x:clip;background:var(--ink)}
.hero-stage{position:relative;max-width:1440px;height:900px;margin-inline:auto}
.hero-stage::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 62% 20%,rgba(250,250,250,.08),rgba(250,250,250,0) 60%);pointer-events:none}
.hero-eyebrow{position:absolute;left:6.6667%;top:236px;width:320px;z-index:4}
.hero-art{position:absolute;left:33.8889%;top:150px;width:61.1111%;height:660px;z-index:1;isolation:isolate;mask-image:linear-gradient(to right,rgba(21,24,28,0),var(--ink) 8%,var(--ink) 94%,rgba(21,24,28,0)),linear-gradient(to bottom,rgba(21,24,28,0),var(--ink) 10%,var(--ink) 90%,rgba(21,24,28,0));mask-composite:intersect}
.study-viewport{overflow:clip;position:relative}
.sweep{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;opacity:1}
.pergola-crop .sweep{transform:scale(1.25);transform-origin:60% 40%}
.leaders{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;color:var(--aluminium)}
.annotations.is-drawn .annotation i{visibility:hidden}
.hero-art.study-viewport{position:absolute}
/* one media window, one crop: poster and film share it exactly */
.hero-picture,.hero-poster,.hero-film{position:absolute;inset:0;width:100%;height:100%;display:block}
.hero-poster,.hero-film{object-fit:cover;object-position:50% 50%;max-width:none}
.hero-film{border:0;background:transparent;opacity:0;pointer-events:none}
.hero-film.is-live{opacity:1}
.hero-art::after{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(to bottom,var(--ink),rgba(21,24,28,0) 8%,rgba(21,24,28,0) 87%,var(--ink))}
/* construction annotations sit over the media window, outside its edge blend */
.hero-annotations{position:absolute;left:33.8889%;top:150px;width:61.1111%;height:660px;z-index:3;pointer-events:none;color:var(--aluminium)}
.hero-leaders{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.hero-annotation{position:absolute;font-size:10px;line-height:14px;font-weight:500;letter-spacing:.06em;white-space:nowrap;opacity:0}
[data-hero-label=beam]{left:67.2727%;top:64px}
[data-hero-label=post]{left:12.0455%;top:460px}
h1{position:absolute;left:6.6667%;top:540px;width:440px;font-size:42px;line-height:44px;letter-spacing:.02em;text-transform:uppercase;z-index:4}
h1 span{display:block;white-space:nowrap}
.hero-description{position:absolute;top:704px;left:6.6667%;width:400px;font-size:18px;line-height:24px;z-index:4}
.hero-actions{position:absolute;top:768px;left:6.6667%;height:44px;display:flex;align-items:center;gap:16px;z-index:4}
.hero-actions .button{width:160px;height:44px;padding:11px 17px}
.hero-actions .text-link{width:168px}
.hero-caption{position:absolute;top:808px;right:6.6667%;width:144px;text-align:right;font-size:12px;line-height:16px;color:var(--silver);z-index:5}
.hero-caption .desktop-caption>span{color:var(--aluminium)}
.hero-motion{position:absolute;top:804px;left:78.8889%;width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:999px;background:rgba(250,250,250,.06);color:var(--silver);transition:background-color 120ms ease-out;z-index:5}
.hero-motion:hover{background:rgba(250,250,250,.12)}
.hero-motion[data-state=playing] .icon-play{display:none}
.hero-motion[data-state=paused] .icon-pause{display:none}
.mobile-caption{display:none}
.hero-bottom{position:absolute;top:856px;left:6.6667%;width:280px}
.scroll-cue{position:absolute;top:844px;right:6.6667%;min-height:40px;width:144px;display:flex;align-items:center;justify-content:space-between;color:var(--aluminium);font-size:10px;letter-spacing:.06em}
.scroll-arrow{font-size:20px;display:inline-block}
#weather{min-height:640px;height:clamp(640px,80svh,900px);overflow:clip;isolation:isolate}
.weather-stage{position:absolute;inset:0;z-index:-2;overflow:clip}
.weather-parallax{position:absolute;inset:0;transform:scale(1.06);transform-origin:50% 50%;will-change:transform}
.weather-media{position:absolute;inset:0;display:block}
.weather-media img,.weather-video{width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.weather-video{position:absolute;inset:0;display:none;opacity:0;transition:opacity 240ms linear;background:transparent}
.weather-video.is-attached{display:block}
.weather-video.is-playing{opacity:1}
.weather-scrim{position:absolute;inset:0;background:linear-gradient(90deg,rgba(21,24,28,.72),rgba(21,24,28,.48) 40%,rgba(21,24,28,.16) 70%,rgba(21,24,28,.08));z-index:-1}
.weather-play{position:absolute;right:max(24px,6.6667%);bottom:56px;display:inline-flex;align-items:center;gap:12px;min-height:40px;padding:9px 18px;border-radius:999px;background:rgba(21,24,28,.88);border:1px solid rgba(250,250,250,.32);color:var(--paper);font-size:13px;font-weight:600;line-height:20px;transition:background-color 160ms,border-color 160ms}
.weather-play:hover{background:rgba(21,24,28,.96);border-color:var(--bronze)}
.weather-play-icon{font-size:10px;line-height:20px}
.weather-copy{padding-top:96px}
.weather-copy h2{font-size:48px;line-height:56px;letter-spacing:.02em}
.weather-copy p{font-size:18px;line-height:28px;max-width:360px;margin-top:24px}
.weather-caption{position:absolute;left:0;right:0;bottom:64px;color:var(--paper)}
.product-section{overflow-x:clip}
.product-grid{display:grid;position:relative;column-gap:48px}
.product-intro h2{text-transform:uppercase;margin-top:16px}
.product-description h3{font-size:24px;line-height:32px;letter-spacing:-.01em;margin-bottom:16px;color:var(--paper)}
.product-description p{font-size:18px;line-height:28px}
.blind-grid{min-height:800px;grid-template-columns:minmax(0,800fr) minmax(0,400fr);grid-template-rows:192px auto 24px auto 32px auto 1fr}
.blind-grid .product-intro{grid-column:2;grid-row:2}
.blind-grid .product-description{grid-column:2;grid-row:4}
.blind-grid .product-action{grid-column:2;grid-row:6}
.blind-figure{grid-column:1;grid-row:1/-1;padding-top:104px;min-width:0}
.blind-viewport{height:600px}
.blind-parallax,.blind-arrival{position:relative;width:100%;height:100%}
.blind-arrival picture,.blind-arrival img{display:block;width:100%;height:100%;object-fit:cover}
.blind-viewport{mask-image:linear-gradient(to bottom,rgba(21,24,28,0),var(--ink) 10%,var(--ink) 90%,rgba(21,24,28,0))}
.annotations{position:absolute;inset:0;pointer-events:none}
.annotation{color:var(--aluminium)}
.annotations .annotation{position:absolute}
.annotation i{display:block;position:absolute;top:8px;width:96px;height:1px;background:var(--aluminium)}
.annotation i::after{content:'';position:absolute;right:0;top:-1.5px;width:4px;height:4px;background:var(--aluminium);border-radius:50%}
.guide-label{left:78%;top:48%}.guide-label i{right:calc(100% + 16px);width:112px}
.guide-label i::after{left:0}
.fabric-label{left:70%;top:72%}.fabric-label i{right:calc(100% + 16px);width:112px}
.fabric-label i::after{left:0}
.blind-figure figcaption{display:flex;justify-content:space-between;gap:16px;margin-top:16px}
.options-caption{font-size:10px}
.pergola-grid{min-height:792px;grid-template-columns:minmax(0,400fr) minmax(0,800fr);grid-template-rows:192px auto 24px auto 32px auto 1fr}
.pergola-grid .product-intro{grid-column:1;grid-row:2}
.pergola-grid .product-description{grid-column:1;grid-row:4}
.pergola-grid .product-action{grid-column:1;grid-row:6}
.pergola-figure{grid-column:2;grid-row:1/-1;padding-top:96px;min-width:0}
.pergola-viewport{height:600px;mask-image:linear-gradient(to right,rgba(21,24,28,0),var(--ink) 6%,var(--ink) 94%,rgba(21,24,28,0)),linear-gradient(to bottom,rgba(21,24,28,0),var(--ink) 8%,var(--ink) 90%,rgba(21,24,28,0));mask-composite:intersect}
.pergola-arrival,.pergola-crop{width:100%;height:100%;position:relative}
.pergola-crop picture,.pergola-crop picture img{width:100%;height:100%;display:block;object-fit:cover}
.pergola-crop picture{transform:scale(1.25);transform-origin:60% 40%}
.pergola-crop .catalogue-standin{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:636px;max-width:100%;height:auto}
.pergola-figure figcaption{text-align:right;margin-top:16px}
.roof-label{left:70%;top:82%}.roof-label i{left:50%;top:auto;bottom:calc(100% + 12px);width:1px;height:80px}
.roof-label i::after{right:auto;left:-1.5px;top:0}
.corner-label{left:1%;top:24%}.corner-label i{left:calc(100% + 12px);width:44px}

.frame-label{left:1%;top:64%}.frame-label i{left:calc(100% + 12px);width:60px}
#maker{min-height:512px;padding:64px 24px}
.maker-inner{max-width:720px;margin-inline:auto;text-align:center}
.maker-mark{margin:0 auto 24px;width:48px;height:48px}
.maker-inner>p{margin-top:24px;font-size:18px;line-height:28px}
.maker-reasons{margin-top:32px}
.maker-reasons li{font-size:24px;line-height:40px;letter-spacing:-.01em;color:var(--paper)}
#range{padding:64px 0 40px;min-height:520px;background:var(--graphite);overflow-x:clip}
.range-rows{margin-top:32px}
.range-row{position:relative;display:grid;grid-template-columns:144px 336px minmax(0,1fr) 112px;gap:32px;align-items:center;min-height:112px;padding:8px 0}
.range-row::before{content:'';position:absolute;left:0;right:0;top:0;height:1px;background:rgba(250,250,250,.25);transform:scaleX(var(--rule,1));transform-origin:left center;transition:background-color 180ms}
.range-row:hover::before,.range-row:focus-within::before{background:rgba(250,250,250,.65)}
.range-thumb{width:144px;height:96px;overflow:clip}
.range-row h3{font-size:20px;line-height:28px;font-weight:600;color:var(--paper)}
.range-row p{color:var(--silver);max-width:424px}
.range-row img{width:100%;height:100%;object-fit:cover;transition:transform 240ms cubic-bezier(.33,1,.68,1)}
.range-row:hover img,.range-row:focus-within img{transform:scale(1.025)}
#proof{min-height:584px;padding:64px 24px}
.proof-inner{max-width:1024px;margin-inline:auto}
.proof-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;margin-top:32px}
.photo-mount{background:var(--paper);padding:24px}
.photo-mount{overflow:clip}
.photo-mount img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.proof-grid figcaption{margin-top:16px;color:var(--aluminium);font-size:12px;line-height:16px}
.showcase-link{margin-top:48px}
.showcase-link .showcase-cta{position:relative;display:inline-flex}
.showcase-link .showcase-cta::after{content:'';position:absolute;left:0;bottom:2px;width:20px;height:1px;background:var(--accent);transition:width 200ms cubic-bezier(.33,1,.68,1)}
.showcase-link .showcase-cta:hover::after,.showcase-link .showcase-cta:focus-visible::after{width:36px}
.showcase-note{margin-top:12px}
#partners{background:var(--paper);color:var(--ink);--accent:var(--slate);color-scheme:light;min-height:560px;padding:96px 0}
.partner-types{grid-column:2;min-width:0}
.partner-types ul{list-style:none;padding:0;margin:16px 0 0}
.partner-types li{position:relative;padding:17px 0 16px;font-size:20px;line-height:28px}
.partner-types li::before{content:'';position:absolute;left:0;right:0;top:0;height:1px;background:rgba(21,24,28,.12);transform:scaleX(var(--rule,1));transform-origin:left center}
.partner-types li:last-child{padding-bottom:17px}
.partner-types li:last-child::after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:rgba(21,24,28,.12);transform:scaleX(var(--rule,1));transform-origin:left center}
.partner-types .button{margin-top:32px}
.trade-fields{margin-top:24px}
.trade-fields+.field,.trade-fields .field+.field{margin-top:24px}
.trade-fields[hidden]{display:none}
.enquiry-grid{display:grid;grid-template-columns:minmax(0,400fr) minmax(0,720fr);gap:0 128px;align-items:start}
.enquiry-intro h2{margin:16px 0 24px}
.enquiry-intro>p:not(.eyebrow){font-size:18px;line-height:28px}
.enquiry-intro>.text-link,.enquiry-intro>.button{margin-top:32px}
#partners h2{color:var(--ink)}
#partners .eyebrow{color:var(--slate)}
#partners .text-link{color:var(--slate-deep)}
.trade-button{background:var(--slate-deep);color:var(--white);border-color:var(--slate-deep)}
.trade-button:hover{background:var(--slate);border-color:var(--slate)}
.form-area{min-width:0;grid-column:2;grid-row:1/3}
fieldset{border:0;padding:0;margin:0;min-width:0}
.field+.field,.field+.field-pair,.field-pair+.field{margin-top:24px}
.field-pair{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.field-pair .field{margin:0;min-width:0}
label{display:block;font-size:14px;line-height:20px;font-weight:500;margin-bottom:8px}
input,select,textarea{width:100%;min-width:0;border:1px solid rgba(167,173,180,.48);background:var(--graphite);border-radius:8px;padding:11px 14px;font-size:16px;line-height:24px;color:var(--paper);box-shadow:none}
input,select{height:48px}
select{appearance:none;padding-right:40px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='m1 1 5 5 5-5' fill='none' stroke='%23A7ADB4' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center}
textarea{height:112px;min-height:112px;resize:vertical;display:block}
#partners input,#partners select,#partners textarea{background-color:var(--paper);border-color:var(--slate);color:var(--ink)}
.field-error{font-size:13px;line-height:20px;color:var(--paper);margin-top:8px}
.field-error:not([hidden]){display:block}
.field-error::before{content:'!';border:1px solid currentColor;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;font-size:10px;margin-right:8px}
#partners .field-error{color:var(--ink)}
[aria-invalid=true]{border-color:var(--accent);border-width:2px;padding:10px 13px}
.form-actions{display:flex;align-items:center;gap:24px;margin-top:32px}
.form-actions .button{flex-shrink:0}
.data-use{font-size:12px;line-height:16px;color:var(--aluminium);max-width:240px}
#partners .data-use{color:var(--graphite)}
.form-status:not(:empty){margin-top:24px;padding-top:24px;border-top:1px solid rgba(167,173,180,.48)}
.form-status h3{font-family:'Josefin Sans',sans-serif;font-size:28px;line-height:36px;margin-bottom:16px;color:inherit}
.form-continuation{margin-top:16px}
.nojs-form{margin-top:24px}
fieldset:disabled{opacity:1}
#contact{min-height:704px;padding:96px 0}
.contact-details{font-style:normal;grid-column:1;grid-row:2;margin-top:40px;font-size:14px;line-height:22px}
.contact-details p+p{margin-top:16px;color:var(--aluminium)}
.contact-details .text-link{margin-top:8px}
.contact-details a[href^=tel]{display:inline-flex;align-items:center;min-height:40px}
#faq{padding:64px 24px}
.faq-inner{max-width:960px;margin-inline:auto}
.faq-list{margin-top:32px}
details{border-top:1px solid rgba(250,250,250,.12)}
details:last-child{border-bottom:1px solid rgba(250,250,250,.12)}
summary{list-style:none;cursor:pointer;min-height:64px;padding:20px 48px 20px 0;position:relative;font-weight:500;color:var(--paper)}
summary::-webkit-details-marker{display:none}
.disclosure-icon{position:absolute;right:8px;top:24px;width:16px;height:16px}
.disclosure-icon::before,.disclosure-icon::after{content:'';position:absolute;top:7px;left:0;width:16px;height:1px;background:var(--aluminium)}
.disclosure-icon::after{transform:rotate(90deg);transform-origin:50% 50%;transition:transform 200ms cubic-bezier(.33,1,.68,1)}
details[open] .disclosure-icon::after{transform:rotate(0deg)}
details[data-closing] .disclosure-icon::after{transform:rotate(90deg)}
details>p{overflow:clip}
details>p{max-width:720px;padding-bottom:24px;color:var(--silver)}
#footer{position:relative;min-height:256px;background:var(--graphite);padding:64px 0}
#footer::before{content:'';position:absolute;left:0;right:0;top:0;height:1px;background:rgba(250,250,250,.16);transform:scaleX(var(--rule,1));transform-origin:left center}
.footer-inner{display:grid;grid-template-columns:96px 1fr auto;gap:48px;align-items:center}
.footer-logo img{width:120px;height:120px}
.legal{font-size:14px;line-height:24px}
.legal span{color:var(--aluminium);font-size:12px}
.footer-links{font-size:14px;line-height:20px}
.footer-links>div{display:flex;flex-wrap:wrap;gap:0 24px}
.footer-links>div a{display:inline-flex;align-items:center;min-height:44px;gap:12px}
.footer-links>.text-link{display:flex;margin-top:12px;color:var(--aluminium)}
[hidden]{display:none!important}
@media(min-width:1000px) and (max-width:1250px){.wrap{width:calc(100% - 96px)}.enquiry-grid{column-gap:64px}.range-row{grid-template-columns:144px 1fr 1fr 90px;gap:24px}.product-grid{column-gap:32px}.hero-art,.hero-annotations{left:35%;width:62%}.hero-caption{right:48px}.hero-motion{left:auto;right:176px}.header-whatsapp{right:32px}.brand-link{left:32px}.primary-nav{width:448px}.primary-nav a{flex:1}.pergola-grid .product-intro h2{font-size:34px;line-height:40px}.form-actions{flex-wrap:wrap}}
@media(max-width:999px){
  body{font-size:15px;line-height:24px}
  section[id],#main,#footer{scroll-margin-top:var(--landing,128px)}
  .wrap{width:calc(100% - 48px);max-width:640px}
  h2{font-size:28px;line-height:32px}
  .button,.text-link{min-height:44px}
  .button{padding-block:11px}
  .site-header{height:104px}
  .brand-link{left:24px;top:16px;width:80px;height:80px}
  .menu-button{display:block;position:absolute;right:160px;top:24px;width:64px;height:44px;font-size:14px;font-weight:600}
  .header-whatsapp{top:24px;right:24px;width:128px;height:44px;padding-inline:14px}
  .primary-nav{display:none;left:24px;right:24px;top:112px;transform:none;width:auto;height:auto;padding:8px;border-radius:16px;z-index:30;background:var(--ink)}
  .primary-nav.is-open{display:block}
  .primary-nav>:nth-child(n){width:100%}
  .primary-nav>a,.primary-nav summary,.nav-panel a{min-height:48px;justify-content:flex-start;padding-inline:16px;font-size:14px;border-radius:12px}
  .primary-nav{max-height:calc(100vh - 136px);max-height:calc(100dvh - 136px);overflow-y:auto}
  .hero-stage{height:844px;width:100%;max-width:688px}
  .hero-eyebrow{left:24px;top:124px;width:calc(100% - 48px)}
  .hero-art.study-viewport{left:24px;top:156px;width:calc(100% - 48px);height:330px}
  .hero-annotations{left:24px;top:156px;width:calc(100% - 48px);height:330px}
  .hero-poster,.hero-film{object-position:75% 50%}
  [data-hero-label=beam]{left:54.9708%;top:24px}
  [data-hero-label=post]{left:55.8480%;top:275px}
  .hero-art{mask-image:linear-gradient(to right,rgba(21,24,28,0),var(--ink) 5%,var(--ink) 95%,rgba(21,24,28,0)),linear-gradient(to bottom,rgba(21,24,28,0),var(--ink) 10%,var(--ink) 90%,rgba(21,24,28,0))}
  h1{left:24px;top:534px;width:calc(100% - 48px);font-size:31px;line-height:34px;letter-spacing:.02em}
  .hero-description{left:24px;top:655px;width:calc(100% - 48px);font-size:16px;line-height:24px}
  .hero-actions{left:24px;right:24px;top:715px;gap:12px;display:grid;grid-template-columns:164px minmax(0,1fr)}
  .hero-actions .button{width:164px;height:44px;padding-inline:17px}
  .hero-actions .text-link{width:100%;min-width:0;gap:8px}
  .hero-caption{left:24px;right:80px;width:auto;top:490px;text-align:left;display:block;font-size:10px;letter-spacing:.04em;line-height:16px}
  .hero-motion{top:485px;left:auto;right:24px}
  .desktop-caption{display:none}
  .mobile-caption{display:block}
  .hero-bottom{top:788px;left:24px;width:216px;font-size:10px}
  .scroll-cue{top:774px;right:24px;width:118px;min-height:44px;font-size:9px;letter-spacing:.04em}
  .nav-progress{display:none}
  .leaders{display:none}
  .hero-leaders{display:block}
  #weather{min-height:620px;height:max(620px,82svh)}
  .weather-copy{padding-top:64px}
  .weather-copy h2{font-size:36px;line-height:40px}
  .weather-copy p{font-size:16px;line-height:24px;max-width:288px;margin-top:24px}
  .weather-media img,.weather-video{object-position:68% 50%}
  .weather-scrim{background:linear-gradient(to bottom,rgba(21,24,28,.76),rgba(21,24,28,.60) 45%,rgba(21,24,28,.20))}
  .weather-caption{bottom:32px}
  .weather-play{right:24px;bottom:28px;min-height:44px;padding-block:11px}
  .product-section{padding:64px 0}
  .product-grid{display:flex;flex-direction:column;min-height:0}
  .product-intro h2{margin-top:16px}
  .product-description{margin-top:16px}
  .product-description h3{font-size:20px;line-height:28px;margin-bottom:16px}
  .product-description p{font-size:16px;line-height:24px}
  .product-figure{padding:0;margin-top:32px;width:100%}
  .blind-viewport{height:352px;overflow:visible;mask-image:none}
  .blind-parallax,.blind-arrival{height:352px}
  .blind-arrival picture{overflow:clip;height:352px;mask-image:linear-gradient(to bottom,rgba(21,24,28,0),var(--ink) 5%,var(--ink) 95%,rgba(21,24,28,0))}
  .blind-arrival img{height:calc(100% + 96px);position:relative;top:-48px;object-position:50% 50%}
  .annotations{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px;inset:auto}
  .annotations .annotation{position:static;font-size:10px;line-height:16px}
  .annotations i{display:none}
  .blind-figure figcaption{margin-top:56px;display:flex;flex-direction:column;gap:8px}
  .options-caption{font-size:9px}
  .product-action{margin-top:24px}
  .pergola-grid .product-intro{order:0}
  .pergola-figure{order:1}
  .pergola-grid .product-description{order:2;margin-top:24px}
  .pergola-grid .product-action{order:3}
  .pergola-viewport{height:372px;mask-image:none}
  .pergola-arrival{height:auto}
  .pergola-crop{height:320px;overflow:clip;mask-image:linear-gradient(to bottom,rgba(21,24,28,0),var(--ink) 5%,var(--ink) 95%,rgba(21,24,28,0))}
  .pergola-crop picture{transform:scale(1.25);transform-origin:60% 40%}
  .pergola-annotations{grid-template-columns:1fr 1.2fr;gap:4px 8px}
  .pergola-annotations .frame-label{grid-column:1/-1}
  .pergola-figure figcaption{margin-top:16px;text-align:left}
  #maker{min-height:0;padding:64px 24px}
  .maker-inner{max-width:640px}
  .maker-mark{width:40px;height:40px;margin-bottom:24px}
  .maker-inner>p{font-size:16px;line-height:24px;margin-top:24px}
  .maker-reasons li{font-size:20px;line-height:40px}
  #range{padding:64px 0;min-height:0}
  .range-rows{margin-top:40px}
  .range-row{grid-template-columns:112px minmax(0,1fr);gap:0 16px;align-items:start;min-height:160px;padding:24px 0}
  .range-thumb{width:112px;height:80px;grid-row:1/4}
  .range-row h3{font-size:18px;line-height:24px;grid-column:2}
  .range-row p{font-size:14px;line-height:20px}
  .range-copy{grid-column:2;margin-top:8px}
  .range-row .text-link{grid-column:2;margin-top:16px;justify-content:flex-start;min-height:44px}
  #proof{padding:64px 24px;min-height:0}
  .proof-inner{max-width:640px}
  .proof-grid{grid-template-columns:1fr;gap:32px;margin-top:32px}
  .photo-mount{padding:16px}
  #partners,#contact{padding:64px 0;min-height:0}
  .enquiry-grid{display:flex;flex-direction:column;gap:0}
  .enquiry-intro>p:not(.eyebrow){font-size:16px;line-height:24px}
  .enquiry-intro h2{margin:16px 0 24px}
  .enquiry-intro>.text-link,.enquiry-intro>.button{margin-top:24px}
  .form-area{margin-top:40px;width:100%}
  .field-pair{display:flex;flex-direction:column;gap:24px}
  .form-actions{flex-direction:column;align-items:flex-start;gap:16px;margin-top:32px}
  .data-use{max-width:none}
  .contact-details{margin-top:48px;font-size:15px;line-height:24px}
  .contact-details a[href^=tel]{min-height:44px}
  .contact-details p+p{margin-top:16px}
  #faq{padding:64px 24px}
  .faq-inner{max-width:640px}
  summary{font-size:16px;line-height:24px;padding-right:40px}
  details>p{font-size:15px;line-height:24px}
  #footer{padding:48px 0;min-height:0}
  .footer-inner{grid-template-columns:80px minmax(0,1fr);gap:32px 24px}
  .footer-logo img{width:96px;height:96px}
  .legal{font-size:13px;line-height:22px}
  .footer-links{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px;font-size:13px}
  .footer-links>div{flex:1 1 100%;gap:0 16px}
  .showcase-link{margin-top:40px}
  .footer-links>.text-link{margin:0;gap:12px;font-size:13px}
  .footer-links>div a{gap:8px}
}
@media(max-width:389px){h1{font-size:30px;line-height:33px}.hero-description{top:652px}.hero-actions{top:712px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}.weather-parallax,.blind-parallax,.blind-arrival,.pergola-parallax,.pergola-arrival{transform:none!important;filter:none!important}.maker-reasons li{opacity:1!important;filter:none!important}.sweep{display:none}.weather-video{display:none!important}.nav-progress{transition:none}}

/* motion support: states used only while an arrival or disclosure is running */
.is-measuring{overflow:clip!important}
.trade-fields{overflow:clip}
@media(min-width:1000px){.blind-parallax,.pergola-parallax{will-change:transform}}

/* ---- sub-page system ----
   Shared header disclosure, breadcrumb, compact hero and catalogue mount, answer block,
   specification table, care column, related links, enquiry band, footer link groups, and
   the About, Selangor and Privacy variants. Base CSS is the completed state: every rule and
   heading is fully visible without JavaScript. Region coordinates follow spec A6. */

/* header Products disclosure (all pages) */
.nav-products{position:relative;display:flex;flex-direction:column;border:0;min-width:0}
.nav-products>summary{flex:1;min-height:0;padding:0;gap:6px;font-weight:600;color:var(--paper)}
.nav-products>summary::after{content:'';width:5px;height:5px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:translateY(-2px) rotate(45deg);opacity:.85;transition:transform 160ms}
.nav-products[open]>summary::after{transform:translateY(1px) rotate(225deg)}
.nav-products.is-current>summary::before{content:'';width:4px;height:4px;border-radius:50%;background:var(--bronze);flex:none}
.nav-panel{position:absolute;top:44px;left:0;width:304px;padding:8px;border-radius:12px;background:var(--ink);border:1px solid rgba(250,250,250,.16);z-index:5}
.nav-panel a{display:flex;align-items:center;min-height:48px;padding:0 16px;border-radius:8px;font-size:14px;font-weight:600;line-height:20px;color:var(--paper);transition:background-color 160ms}

/* breadcrumb */
.breadcrumb ol{display:flex;flex-wrap:wrap;gap:0 8px;padding:0;margin:0;list-style:none;font-size:14px;line-height:20px;color:var(--aluminium)}
.breadcrumb li{display:inline-flex;align-items:center;min-height:20px}
.breadcrumb li+li::before{content:'/';margin-right:8px;opacity:.6}
.breadcrumb a:hover{color:var(--paper)}
.breadcrumb [aria-current]{color:var(--silver)}

/* compact hero */
.subpage h1{position:static;left:auto;top:auto;width:auto;max-width:720px;min-height:96px;margin-top:16px;font-size:44px;line-height:48px;letter-spacing:.02em;text-transform:uppercase;z-index:auto}
.subpage h1 span{display:block;white-space:normal}
.page-hero{background:var(--ink);padding:176px 0 32px;min-height:616px}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) 480px;column-gap:48px;align-items:start}
.hero-grid>*{min-width:0}
.hero-copy .eyebrow{margin-top:28px}
.lede{margin-top:16px;max-width:720px;font-size:18px;line-height:28px;color:var(--silver)}
.hero-figure{margin-top:40px}
.hero-figure figcaption{margin-top:16px}
.hero-logo{width:144px;height:144px;margin-top:40px}
.hero-mark{width:64px;height:64px;margin-top:40px}
.catalogue-mount{position:relative;background:var(--paper);padding:24px;overflow:clip}
.catalogue-mount::before{content:'';position:absolute;left:0;right:0;top:0;height:1px;background:var(--aluminium);z-index:1}
.mount-sweep{position:absolute;left:0;top:0;width:18%;height:1px;background:linear-gradient(90deg,rgba(255,255,255,0),#fff,rgba(255,255,255,0));opacity:0;pointer-events:none;z-index:2}
.catalogue-mount img{width:100%;height:auto;aspect-ratio:3/2;object-fit:contain;background:var(--paper)}

/* answer block */
.answer-block{background:var(--ink)}
.answer-block>.wrap{border-top:1px solid rgba(167,173,180,.4)}
.answer-grid{display:grid;grid-template-columns:280px minmax(0,720px);column-gap:72px;padding:64px 0;align-items:start}
.answer-grid>*{min-width:0}
.answer-heading{font-size:28px;line-height:32px;letter-spacing:.01em}
.answer-prose{max-width:720px;font-size:18px;line-height:28px;color:var(--silver)}
.answer-prose p+p{margin-top:16px}

/* choices and specifications */
.spec-section{background:var(--graphite);padding:96px 0}
.spec-grid{display:grid;grid-template-columns:minmax(0,480px) 672px;column-gap:96px;align-items:start}
.spec-grid>*{min-width:0}
.spec-intro p{margin-top:24px}
.spec-table{width:100%;max-width:672px;border-collapse:collapse;table-layout:fixed;--label-w:208px}
.spec-table caption{caption-side:top;text-align:left;padding-bottom:16px;font-size:14px;line-height:20px;font-weight:500;color:var(--paper)}
.spec-table th{width:var(--label-w);padding:16px 24px 16px 0;text-align:left;vertical-align:top;font-size:14px;line-height:20px;font-weight:500;color:var(--aluminium)}
.spec-table td{position:relative;padding:16px 0;vertical-align:top;font-size:16px;line-height:24px;color:var(--silver);overflow-wrap:anywhere}
.spec-table td::before,.spec-table tr:last-child td::after{content:'';position:absolute;left:calc(-1 * var(--label-w));right:0;top:0;height:1px;background:rgba(167,173,180,.4);transform:scaleX(var(--rule,1));transform-origin:left center}
.spec-table tr:last-child td::after{top:auto;bottom:0}
.step-rows{margin-top:32px;max-width:720px}
.step-row{display:grid;grid-template-columns:96px minmax(0,1fr);gap:0 24px;padding:24px 0;border-top:1px solid rgba(167,173,180,.4)}
.step-row:last-child{border-bottom:1px solid rgba(167,173,180,.4)}
.step-row .eyebrow{padding-top:6px}
.step-row h3{font-size:20px;line-height:28px;font-weight:600;color:var(--paper)}
.step-row p{margin-top:8px}

/* installation, care or published terms; also the Privacy reading column */
.care-section{background:var(--ink);padding:64px 0}
.care-grid{display:grid;grid-template-columns:280px minmax(0,720px);column-gap:72px}
.care-copy{grid-column:2;min-width:0;max-width:720px}
.care-copy h2+p,.care-copy h2+ul{margin-top:24px}
.care-copy p+p{margin-top:16px}
.care-copy h2+h2,.care-copy p+h2,.care-copy ul+h2,.care-copy p+h3{margin-top:48px}
.care-copy h3{font-size:20px;line-height:28px;font-weight:600;color:var(--paper)}
.care-copy h3+p{margin-top:16px}
.notice-date{margin-top:24px;font-size:14px;line-height:20px;color:var(--aluminium)}
.care-copy .utility-links{display:flex;flex-direction:column;align-items:flex-start;margin-top:24px}
.care-copy .utility-links .text-link{min-height:40px}

/* FAQ sizing on sub-pages */
.subpage #faq{background:var(--ink)}
.subpage .faq-list summary{font-size:16px;line-height:24px}
.subpage .faq-list details>p{font-size:15px;line-height:24px}

/* related products and other ruled link rows */
.related-section{background:var(--graphite);padding:64px 0}
.link-rows{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 32px;margin-top:32px}
.link-rows.is-stack{grid-template-columns:minmax(0,720px)}
.link-rows a{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:80px;padding:24px 0;font-size:20px;line-height:28px;font-weight:600;color:var(--paper)}
.link-rows a::before{content:'';position:absolute;left:0;right:0;top:0;height:1px;background:rgba(250,250,250,.25);transform:scaleX(var(--rule,1));transform-origin:left center;transition:background-color 180ms}
.link-rows a:hover::before,.link-rows a:focus-visible::before{background:rgba(250,250,250,.65)}
.link-rows.is-stack a:last-child::after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:rgba(250,250,250,.25)}
.link-rows .arrow{flex:none}

/* enquiry band */
.enquiry-band{background:var(--ink);padding:64px 0}
.enquiry-band-grid{display:grid;grid-template-columns:minmax(0,608fr) minmax(0,480fr);column-gap:160px;align-items:start}
.enquiry-band-grid>*{min-width:0}
.enquiry-copy .eyebrow+h2{margin-top:16px}
.enquiry-copy p{margin-top:24px;font-size:18px;line-height:28px}
.enquiry-buttons{display:flex;flex-wrap:wrap;gap:16px}
.enquiry-utility{display:flex;flex-direction:column;align-items:flex-start;margin-top:24px}
.enquiry-utility .text-link{min-height:40px}

/* About: trade section (Paper ground, Ink text, Slate accents) */
.trade-section{background:var(--paper);color:var(--ink);--accent:var(--slate);color-scheme:light;padding:96px 0}
.trade-section h2{color:var(--ink)}
.trade-section .eyebrow{color:var(--slate)}
.trade-section .text-link{color:var(--slate-deep)}
.trade-section .text-link:hover{color:var(--slate)}
/* About: photograph placeholders (text placeholders, removed entirely if a photo does not arrive) */
.inside-section{background:var(--ink);padding:64px 24px}
.inside-inner{max-width:1024px;margin-inline:auto}
.inside-grid{display:grid;grid-template-columns:repeat(2,480px);gap:64px;justify-content:center;margin-top:32px}
.inside-grid.is-single{grid-template-columns:480px}
.photo-placeholder{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:3/2;padding:16px;background:var(--graphite);border:1px solid var(--aluminium);color:var(--aluminium);text-align:center;font-size:14px;line-height:20px}
.inside-grid figcaption{margin-top:16px}

/* footer link groups */
.footer-groups{grid-column:1/-1;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:24px 32px;padding-top:32px;border-top:1px solid rgba(250,250,250,.12)}
.footer-group .eyebrow{margin-bottom:4px}
.footer-group a{display:inline-flex;align-items:center;min-height:40px;gap:12px;font-size:14px;line-height:20px}
.footer-group a:hover{color:var(--paper)}
.footer-group a[aria-current=page]{color:var(--paper);text-decoration:underline;text-underline-offset:4px}
.data-use a{text-decoration:underline;text-underline-offset:3px}
.data-use a:hover{color:var(--paper)}
/* home product chapters: WhatsApp action plus the Read-about link beneath it */
.product-action{display:flex;flex-direction:column;align-items:flex-start}
.range-row h3 a:hover{text-decoration:underline;text-underline-offset:4px}

@media(min-width:1000px) and (max-width:1250px){
  .hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,400px);column-gap:32px}
  .answer-grid,.care-grid{grid-template-columns:240px minmax(0,1fr);column-gap:32px}
  .spec-grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:32px}
  .enquiry-band-grid{column-gap:32px}
  .inside-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:999px){
  .nav-products{width:100%}
  .nav-products>summary{justify-content:flex-start;min-height:48px;padding-inline:16px}
  .nav-products>summary::after{margin-left:auto}
  .nav-panel{position:static;width:auto;padding:0 0 4px;border:0;border-radius:0;background:none}
  .nav-panel a{padding-inline:32px 16px}
  .subpage h1{min-height:72px;font-size:32px;line-height:36px}
  .page-hero{padding:128px 0 48px;min-height:0}
  .hero-grid{display:flex;flex-direction:column}
  .hero-copy .eyebrow{margin-top:20px}
  .lede{font-size:16px;line-height:24px}
  .hero-figure{margin-top:32px;width:100%}
  .hero-logo{width:96px;height:96px;margin-top:32px}
  .hero-mark{display:none}
  .hero-figure-mark{display:none}
  .catalogue-mount{padding:16px}
  .answer-grid{display:flex;flex-direction:column;padding:64px 0}
  .answer-heading{font-size:24px;line-height:28px}
  .answer-prose{margin-top:24px;font-size:16px;line-height:24px}
  .spec-section{padding:64px 0}
  .spec-grid{display:flex;flex-direction:column}
  .spec-table{margin-top:32px;--label-w:120px}
  .spec-table th{padding-right:16px}
  .spec-table td{font-size:15px}
  .step-row{grid-template-columns:minmax(0,1fr);gap:8px 0}
  .care-section{padding:64px 0}
  .care-grid{display:block}
  .related-section{padding:64px 0}
  .link-rows{grid-template-columns:minmax(0,1fr);margin-top:24px}
  .link-rows a{font-size:18px;line-height:24px}
  .enquiry-band{padding:64px 0}
  .enquiry-band-grid{display:flex;flex-direction:column}
  .enquiry-copy p{font-size:16px;line-height:24px}
  .enquiry-actions{margin-top:24px;width:100%}
  .enquiry-buttons{flex-direction:column;align-items:stretch;gap:12px}
  .enquiry-buttons .button{min-height:44px;white-space:normal}
  .enquiry-utility{margin-top:24px}
  .enquiry-utility .text-link,.care-copy .utility-links .text-link{min-height:44px}
  .trade-section{padding:64px 0}
  .inside-section{padding:64px 24px}
  .inside-grid,.inside-grid.is-single{grid-template-columns:minmax(0,1fr);gap:32px}
  .footer-groups{gap:16px 24px;padding-top:24px}
  .footer-group a{min-height:44px;font-size:13px}
}
@media(prefers-reduced-motion:reduce){.mount-sweep{display:none}.spec-table td::before,.spec-table tr:last-child td::after,.link-rows a::before{transform:none!important}}

/* hoisted from wave-2 pages (about, privacy) */
.spec-detail .text-link{margin-top:24px}
.care-copy section[lang],.care-copy section[lang]+h2{margin-top:48px}
/* notice pages (privacy): hero collapses to content, no 616px reserve */
.page-hero-notice{min-height:0;padding-bottom:64px}
.subpage .page-hero-notice h1{min-height:0}