/* Three chapters, one quiet product story. */
html{scroll-behavior:smooth;scroll-padding-top:72px}body{display:block;background:#080a0c}main{display:block}.page-section{scroll-margin-top:0}.site-header{position:sticky;top:0;z-index:20;height:72px;margin:0;padding:0 5.5%;display:grid;grid-template-columns:1fr auto 1fr;gap:20px;background:rgba(8,10,12,.9);backdrop-filter:blur(18px);border-bottom:1px solid #ffffff0c}.wordmark{grid-column:1;justify-self:start;font-size:18px}.page-nav{grid-column:2;display:flex;gap:28px;align-items:center;height:100%}.page-nav a{position:relative;display:grid;place-items:center;min-height:44px;text-decoration:none;color:#9da9aa;font-size:12px;white-space:nowrap;transition:color .2s}.page-nav a::after{content:'';position:absolute;bottom:1px;left:50%;height:2px;width:14px;background:var(--lime);transform:translateX(-50%) scaleX(0);transition:transform .25s}.page-nav a[aria-current=page]{color:#eff5eb}.page-nav a[aria-current=page]::after{transform:translateX(-50%) scaleX(1)}.page-nav a:hover{color:#fff}.languages{grid-column:3}.home-section{min-height:calc(100svh - 72px);display:flex;flex-direction:column;justify-content:center;background:radial-gradient(ellipse at 50% 48%,#11161a 0,#0a0c0f 44%,#080a0c 76%)}.home-section footer{width:100%;margin-top:auto}.home-section .showroom{flex:1}.section-kicker{font-size:11px;line-height:1.5;letter-spacing:.16em;color:#9aaba8;margin:0 0 24px}.order-section{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(340px,.8fr);gap:clamp(40px,6vw,100px);padding:108px 7% 112px;max-width:1600px;margin:auto;border-top:1px solid #ffffff0d;align-items:start}.order-visual{position:sticky;top:124px;min-width:0}.order-visual h2,.contact-intro h2{font-weight:400;font-size:clamp(30px,3.4vw,48px);line-height:1.4;letter-spacing:-.045em;margin:0;color:#dce7dd;text-wrap:balance}.keychain-stage{position:relative;width:100%;height:clamp(350px,38vw,570px);margin:2px 0 0;background:radial-gradient(ellipse at 50% 46%,#3042381e,transparent 70%)}#keychain-canvas{width:100%;height:100%;display:block;touch-action:pan-y;outline-offset:-5px}.keychain-loading{position:absolute;left:0;right:0;top:45%;text-align:center;color:#9ea9aa;font-size:12px;pointer-events:none}.keychain-fallback{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#aeb9b6;font-size:12px;text-align:center}.keychain-fallback img{height:70%;max-width:85%;object-fit:contain}.keychain-caption{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:44px;border-top:1px solid #cce1d01c;color:#a3b1aa;font-size:12px;line-height:1.6}.keychain-caption p{margin:0}.keychain-caption span{color:#dbe7d8;white-space:nowrap}.order-panel{width:100%;max-width:480px;justify-self:end;min-width:0;padding-top:4px}.order-heading-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.order-heading-row h3{font-size:21px;font-weight:450;margin:0;letter-spacing:-.025em}.demo-badge{font-size:10px;line-height:1.5;letter-spacing:.045em;color:#b5c5b4;border:1px solid #b0c8a82b;border-radius:30px;padding:5px 10px;white-space:nowrap}.unit-price{padding:22px 0 26px;display:flex;justify-content:space-between;gap:15px;align-items:center;border-bottom:1px solid var(--line);color:#a2afab;font-size:12px}.unit-price p{margin:0;text-align:right}.unit-price strong{font-size:25px;letter-spacing:-.03em;color:#e5eedf;font-weight:450;font-variant-numeric:tabular-nums}.fx-reference{display:block;min-height:0;font-size:12px;color:#a8bba4;line-height:1.6;font-variant-numeric:tabular-nums}.fx-reference:empty{display:none}fieldset{border:0;padding:0;min-width:0;margin:0}legend{padding:0;font-size:14px;font-weight:450;color:#d2dfd4;margin-bottom:16px;width:100%}.color-fieldset{margin-top:26px}.order-line{display:grid;grid-template-columns:minmax(0,1fr) 80px 36px;align-items:end;gap:10px;margin-bottom:12px}.order-line label{display:block}.order-line .label-text{display:block;font-size:11px;color:#a7b3ad;margin-bottom:7px}.color-select-wrap{display:flex;align-items:center;position:relative;min-width:0}.color-swatch{position:absolute;left:12px;width:12px;height:12px;border:1px solid #ffffff40;border-radius:50%;pointer-events:none}.order-panel input,.order-panel select{font:inherit;font-size:14px;color:#e0e9e1;background:#ffffff04;border:1px solid #a1baa52c;border-radius:7px;height:46px;min-width:0;max-width:100%;width:100%;padding:10px 12px;transition:border-color .18s,background .18s;box-shadow:none}.order-panel select{padding-left:34px;padding-right:24px;cursor:pointer}.order-panel option{background:#151b18;color:#e0e9e1}.order-panel input:focus,.order-panel select:focus{outline:2px solid #c2dfab;outline-offset:2px;border-color:#c2dfab66;background:#ffffff08}.order-panel [aria-invalid=true]{border-color:#e1a38c}.remove-line{width:36px;height:46px;padding:0;border:0;border-radius:6px;color:#9baba0;font-size:22px;background:none}.remove-line:hover{background:#ffffff08;color:#e0e9e1}.remove-line:disabled{opacity:.25}.add-order-line{border:0;display:inline-flex;align-items:center;gap:8px;background:transparent;color:#bfd3b2;font-size:12px;min-height:44px;padding:4px 0}.add-order-line>span:first-child{font-size:23px;font-weight:300}.add-order-line:disabled{opacity:.4}.shipping-fieldset{margin-top:26px}.shipping-fieldset label{display:block;font-size:12px;color:#adbbb2;line-height:1.5;margin-bottom:14px}.shipping-fieldset label>span{display:block;margin-bottom:7px}.field-grid,.address-grid{display:grid;gap:12px;grid-template-columns:1fr 1fr}.address-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.order-total{display:flex;justify-content:space-between;align-items:center;padding:20px 0 17px;border-top:1px solid var(--line);font-size:13px;color:#c8d6ca}.order-total p{margin:0;text-align:right}.order-total strong{font-size:26px;font-weight:450;letter-spacing:-.04em;font-variant-numeric:tabular-nums}.fx-status{color:#92a199;font-size:11px;line-height:1.7;margin:0 0 18px}.fx-status a{color:inherit;text-underline-offset:3px}.fx-status button{background:none;border:0;padding:8px;color:#c2d8b2;font-size:12px;min-height:44px}.confirm-order{display:block;min-height:50px;width:100%;border-radius:8px;border:1px solid #c9e8af;background:#c9e8af;color:#1a271b;font-size:14px;transition:background .2s,box-shadow .2s}.confirm-order:hover{background:#def7c9;box-shadow:0 0 35px #d5f6b212}.demo-note{font-size:11px;color:#98a49d;line-height:1.7;margin:14px 0 0;text-align:center}.order-error{font-size:12px;line-height:1.6;color:#f2b8a5}.order-success{min-height:590px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;outline-offset:12px}.success-mark{display:grid;place-items:center;width:60px;height:60px;border:1px solid #c6e7a843;border-radius:50%;background:#bedf9b0b;margin-bottom:36px;box-shadow:0 0 60px #bedf9b0b}.success-mark svg{width:24px;height:24px;fill:none;stroke:#c9e8af;stroke-width:1.5}.order-success h3{font-size:clamp(28px,2.8vw,39px);font-weight:400;line-height:1.6;letter-spacing:-.035em;margin:0 0 20px;text-wrap:balance}.order-success p:not(.section-kicker){font-size:13px;line-height:1.9;color:#a6b4a9;max-width:330px;margin:0 0 30px}.quiet-link{background:none;border:0;border-bottom:1px solid #8ca783;padding:12px 0;font-size:13px;color:#c9dfb6;min-height:44px}.contact-section{min-height:80svh;padding:128px 7% 38px;max-width:1600px;margin:auto;display:grid;grid-template-columns:1.2fr 1fr;column-gap:10%;row-gap:120px;align-content:center;border-top:1px solid #ffffff0f}.contact-intro>p:last-child{font-size:14px;line-height:1.9;color:#9eafa6;max-width:360px;margin-top:26px}.contact-offices{display:grid;grid-template-columns:1fr;gap:48px;padding-top:10px}.office-region{font-size:12px;color:#9bad9f;letter-spacing:.1em;margin:0 0 13px}.contact-offices h3{font-size:22px;font-weight:450;letter-spacing:.01em;margin:0 0 13px;color:#dae5db}.contact-offices a{display:inline-flex;align-items:center;min-height:44px;font-size:15px;text-decoration:none;text-underline-offset:6px;color:#a5b2ac;overflow-wrap:anywhere;word-break:break-word}.contact-offices a:hover{color:#dfebd9;text-decoration:underline}.contact-signature{grid-column:1/-1;display:flex;justify-content:space-between;gap:20px;padding:27px 0 0;border-top:1px solid #ffffff0c;color:#87968e;font-size:11px;line-height:1.7}.contact-signature>span:first-child{letter-spacing:.1em}.order-section,.contact-section{transition:opacity .45s,visibility .45s}body[data-night=true]{overflow:hidden}body[data-night=true] .order-section,body[data-night=true] .contact-section{opacity:0;visibility:hidden;pointer-events:none}input,select{scroll-margin-top:130px}
@media(min-width:1700px){.order-section,.contact-section{padding-left:80px;padding-right:80px}}
@media(max-width:1050px){.site-header{padding:0 4%;gap:12px}.page-nav{gap:22px}.order-section{padding:84px 5%;gap:35px;grid-template-columns:minmax(0,1fr) minmax(330px,1fr)}.order-visual h2,.contact-intro h2{font-size:33px}.keychain-stage{height:410px}.contact-section{padding:100px 6% 36px;column-gap:7%}}
@media(max-width:800px){html{scroll-padding-top:112px}.page-section{scroll-margin-top:0}.site-header{height:112px;min-height:112px;display:grid;grid-template-columns:1fr auto;grid-template-rows:56px 44px;padding:6px 5% 6px;gap:0 5px}.wordmark{grid-column:1;grid-row:1;font-size:16px;align-self:center}.languages{grid-column:2;grid-row:1;gap:0}.languages button{min-width:36px;padding:5px;font-size:11px}.page-nav{grid-column:1/-1;grid-row:2;justify-content:center;gap:38px}.page-nav a{font-size:12px;min-width:52px}.home-section{min-height:calc(100svh - 112px)}.home-section .showroom{flex:none}.order-section{display:flex;flex-direction:column;padding:68px 7% 76px;gap:48px}.order-visual{position:static;width:100%}.order-visual h2{font-size:32px}.section-kicker{font-size:10px;margin-bottom:20px}.keychain-stage{height:clamp(300px,82vw,480px);margin-top:8px}.keychain-caption{font-size:11px;gap:10px}.order-panel{max-width:none;width:100%;padding:0}.order-heading-row h3{font-size:22px}.order-panel input,.order-panel select{font-size:16px}.order-line{grid-template-columns:minmax(0,1fr) 76px 32px;gap:8px}.remove-line{width:32px}.order-success{min-height:390px}.contact-section{display:block;min-height:700px;padding:80px 7% 28px}.contact-intro h2{font-size:36px}.contact-intro>p:last-child{font-size:13px}.contact-offices{margin-top:60px;gap:38px}.contact-offices h3{font-size:21px}.contact-signature{margin-top:72px;font-size:10px;flex-wrap:wrap;gap:8px}.address-grid{gap:8px}.shipping-fieldset label{font-size:11px}}
@media(max-width:380px){.site-header{padding-left:4%;padding-right:4%}.wordmark{font-size:15px}.languages button{min-width:33px}.page-nav{gap:26px}.order-section,.contact-section{padding-left:6%;padding-right:6%}.order-visual h2{font-size:29px}.field-grid{grid-template-columns:1fr;gap:0}.address-grid{grid-template-columns:1fr 1fr}.address-grid label:last-child{grid-column:1/-1}.keychain-caption{align-items:flex-start;flex-direction:column;gap:2px;padding:10px 0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.page-nav a::after{transition:none}}

/* Payment preview stays deliberately local: two clearly labelled sample codes. */
.order-success{padding:28px 0 10px;min-height:620px}.order-success .success-mark{width:44px;height:44px;margin-bottom:22px}.order-success .section-kicker{margin-bottom:13px}.order-success h3{font-size:clamp(26px,2.5vw,35px);margin-bottom:12px}.order-success p:not(.section-kicker){margin-bottom:22px;font-size:12px}.payment-preview{width:100%;margin:0 0 24px}.payment-methods legend{font-size:12px;color:#aebcb0;margin-bottom:12px}.payment-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}.payment-choice{position:relative;min-width:0;cursor:pointer}.payment-choice input{position:absolute;width:1px;height:1px;padding:0;border:0;clip-path:inset(50%);overflow:hidden}.payment-choice>span{display:flex;justify-content:center;align-items:center;gap:9px;min-height:48px;border:1px solid #aec4ad2b;border-radius:8px;font-size:12px;line-height:1.5;color:#a9b5ad;padding:10px 8px;background:#ffffff03;transition:background .2s,border-color .2s,color .2s}.payment-choice input:checked+span{background:#c7dfb90c;border-color:#c7dfb977;color:#e4eddf}.payment-choice input:focus-visible+span{outline:2px solid var(--lime);outline-offset:3px}.payment-choice:hover>span{background:#ffffff08}.payment-dot{display:block;width:8px;height:8px;border-radius:50%;flex:none}.alipay-dot{background:#51aeff;box-shadow:0 0 16px #51aeff33}.wechat-dot{background:#7ee696;box-shadow:0 0 16px #7ee69622}.payment-panel{display:flex;align-items:center;gap:22px;margin-top:18px;padding:20px;border:1px solid #b0c6b11b;border-radius:12px;background:#ffffff02}.payment-code{flex:none;width:174px;padding:8px 8px 10px;background:#f7faf4;border-radius:7px;text-align:center}.payment-code img{width:100%;height:auto;aspect-ratio:1;display:block;image-rendering:pixelated}.qr-demo-mark{display:block;color:#555f58;font-size:10px;line-height:1.5;letter-spacing:.09em;margin-top:2px}.payment-caption{min-width:0}.payment-caption strong{display:block;font-size:13px;font-weight:500;line-height:1.6;color:#cadbd1;margin-bottom:9px}.payment-caption>span{display:block;font-size:11px;color:#99aaa0;line-height:1.8;max-width:180px}.payment-panel[data-provider=alipay] .payment-caption strong{color:#94caff}.payment-panel[data-provider=wechat] .payment-caption strong{color:#a9e4b2}
/* One full-size front-facing product, independent of order quantity. */
.order-visual{top:104px}.order-visual h2{font-size:clamp(30px,2.8vw,40px)}.order-visual .keychain-stage{height:clamp(440px,calc(100svh - 340px),620px);margin-top:8px}.keychain-caption{min-height:46px}.keychain-caption span{font-size:11px;letter-spacing:.03em}.keychain-fallback img{height:92%;width:100%;max-width:none;object-fit:contain}
@media(max-width:1050px) and (min-width:801px){.payment-panel{gap:14px;padding:14px}.payment-code{width:150px}.order-visual .keychain-stage{height:clamp(440px,calc(100svh - 320px),560px)}}
@media(max-width:800px){.order-visual .keychain-stage{height:clamp(480px,119vw,610px)}.order-success{padding-top:0;min-height:580px}.payment-panel{padding:18px;gap:20px}.payment-code{width:176px}.payment-choice>span{font-size:13px}}
@media(max-width:420px){.payment-panel{flex-direction:column;text-align:center;gap:14px}.payment-code{width:202px}.payment-caption strong{margin-bottom:4px}.payment-caption>span{max-width:none}.order-success h3{font-size:27px}}

/* One four-step guide across phone, tablet and desktop. */
.order-section{padding-top:72px}.order-visual{position:static}.order-visual .section-kicker{margin-bottom:16px}.order-visual h2{font-size:clamp(28px,2.8vw,34px)}
@media(max-width:800px){.order-section{padding-top:68px}}

/* Each complete action has its own media column and readable copy. */
 .assembly-mobile{display:grid;gap:0;margin:24px 0 0;padding:0;list-style:none}
 .assembly-step{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);align-items:center;gap:20px;padding:24px 0;border-bottom:1px solid #cce1d01c;min-width:0}
 .assembly-step:first-child{padding-top:4px}.assembly-step:last-child{border-bottom:0;padding-bottom:0}
 .assembly-step-media{width:100%;min-width:0;background:#000;border-radius:8px;overflow:hidden}
 .assembly-step-media video{display:block;width:100%;height:auto;object-fit:contain;background:#000}
 .assembly-step-copy{min-width:0;align-self:center}
 .assembly-step-number{display:block;font-size:10px;line-height:1.5;letter-spacing:.14em;color:#8d9e93;font-variant-numeric:tabular-nums;margin-bottom:6px}
 .assembly-step-copy h3{font-size:15px;line-height:1.5;font-weight:500;letter-spacing:0;color:#e0eadf;margin:0 0 8px;text-wrap:pretty;overflow-wrap:break-word}
 .assembly-step-copy>p{font-size:13px;line-height:1.7;color:#a9bab0;margin:0;text-wrap:pretty;overflow-wrap:break-word}
 .assembly-step-toggle{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:8px 4px 8px 0;margin-top:5px;border:0;background:none;font:inherit;font-size:12px;color:#c5dbb6;text-align:left;cursor:pointer;touch-action:manipulation}
 .assembly-step-toggle:focus-visible{outline:2px solid var(--lime);outline-offset:3px;border-radius:3px}
 .assembly-step-toggle:disabled{opacity:.45;cursor:default}
 .assembly-step-toggle svg{width:13px;height:13px;flex:none;fill:currentColor;stroke:none}
 .assembly-step-toggle .step-pause-icon{display:none;fill:none;stroke:currentColor;stroke-width:1.8}
 .assembly-step-toggle[data-playing=true] .step-play-icon{display:none}
 .assembly-step-toggle[data-playing=true] .step-pause-icon{display:block}
 .assembly-step-copy>.assembly-step-error{font-size:12px;line-height:1.6;color:#c3d1c8}
 .assembly-step-error a{color:var(--lime);text-underline-offset:3px}
 html[lang=ko] .assembly-step-copy{word-break:keep-all;overflow-wrap:break-word}
@media(min-width:600px) and (max-width:800px){
 .assembly-mobile{max-width:600px;margin-left:auto;margin-right:auto}
 .assembly-step{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;padding:28px 0}
 .assembly-step-media{max-width:250px;justify-self:center}
 .assembly-step-copy h3{font-size:17px}.assembly-step-copy>p{font-size:14px}
}
@media(max-width:380px){
 .assembly-step{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;padding:22px 0}
 .assembly-step-copy h3{font-size:14px}.assembly-step-copy>p{font-size:12px;line-height:1.7}
}

/* Two paired guides share the form height; copy follows each current action. */
@media(min-width:801px){
 .order-section{max-width:1580px;padding:72px 3% 96px;grid-template-columns:minmax(0,1.75fr) minmax(270px,.85fr);column-gap:clamp(24px,3vw,44px);align-items:stretch}
 .order-visual{display:flex;flex-direction:column;max-height:1040px}.order-visual h2{font-size:30px;line-height:1.4}
 .order-panel{max-width:390px;padding-top:32.5px;align-self:start}
 .order-heading-row{min-height:42px;align-items:center}
 .order-heading-row h3{font-size:24px;line-height:1.4}
 .assembly-mobile{grid-template-columns:minmax(0,1fr);gap:0;max-width:none;margin-top:24px;flex:1;grid-template-rows:minmax(min-content,1fr) minmax(min-content,1.35fr)}
 .assembly-step{grid-template-columns:minmax(0,300px) minmax(140px,1fr);gap:clamp(24px,3vw,44px);padding:24px 0;align-items:center;border:0}
 .assembly-step:first-child{padding-top:0;border-bottom:1px solid #cce1d01c}
 .assembly-step:last-child{padding-bottom:0}
 .assembly-step-media{max-width:none;justify-self:stretch}
 .assembly-step-copy h3{font-size:17px;line-height:1.55;margin-bottom:8px}
 .assembly-step-copy>p{font-size:13px;line-height:1.75}
 .assembly-step-toggle{font-size:11px;gap:6px}
 .unit-price{padding:16px 0 20px}
 .color-fieldset,.shipping-fieldset{margin-top:22px}
 .shipping-fieldset label{margin-bottom:12px}
 .order-panel input,.order-panel select{height:44px}
}
@media(min-width:1200px){
 .assembly-step-copy h3{font-size:18px}
 .assembly-step-copy>p{font-size:14px}
 .assembly-step-toggle{font-size:12px}
}

/* Both phase copies share a grid cell; invisible translations reserve only the
   space actually needed, keeping the product still when its instruction changes. */
.assembly-phase-copy{display:grid;min-width:0}
.assembly-phase-copy>div{grid-area:1/1;min-width:0}
.assembly-caption-reserve{visibility:hidden;pointer-events:none}
.assembly-caption-reserve strong{display:block;font-size:15px;line-height:1.5;font-weight:500;letter-spacing:0;margin:0 0 8px;text-wrap:pretty;overflow-wrap:break-word}
.assembly-phase-copy p{font-size:13px;line-height:1.7;color:#a9bab0;margin:0;text-wrap:pretty;overflow-wrap:break-word}
@media(max-width:380px){.assembly-caption-reserve strong{font-size:14px}.assembly-phase-copy p{font-size:12px}}
@media(min-width:600px) and (max-width:800px){.assembly-caption-reserve strong{font-size:17px}.assembly-phase-copy p{font-size:14px}}
@media(min-width:801px){.assembly-caption-reserve strong{font-size:17px;line-height:1.55}.assembly-phase-copy p{font-size:13px;line-height:1.75}}
@media(min-width:1200px){.assembly-caption-reserve strong{font-size:18px}.assembly-phase-copy p{font-size:14px}}

/* All language/phase measurements occupy the same cell. Only the visible
   caption changes opacity, never position or size. JS uses the media clock. */
.assembly-caption-current{opacity:1}
.assembly-caption-reserve{word-break:normal}
.assembly-caption-reserve[lang=ko]{word-break:keep-all;overflow-wrap:break-word}
/* Translation and exchange-rate lines may resize the form. Keep the films at
   their own intrinsic heights instead of redistributing that extra space. */
@media(min-width:801px){
 .assembly-mobile{flex:0 0 auto;grid-template-rows:max-content max-content;align-content:start}
}

/* The order returns to its original single light-preview product. */
.order-visual{display:block;max-height:none}
.order-visual h2{font-size:clamp(30px,2.8vw,40px)}
@media(min-width:801px){
 .order-section{max-width:1500px;padding:72px 5% 96px;grid-template-columns:minmax(0,1.2fr) minmax(340px,.8fr);column-gap:clamp(36px,5vw,80px);align-items:start}
 .order-visual{position:sticky;top:104px}
 .order-panel{max-width:440px}
}

/* The teaching films have their own chapter and share one pixel scale.
   Center the shorter cover film so its absent topper leaves no empty header. */
.guide-section{--guide-stage:clamp(450px,58svh,620px);max-width:1380px;padding:44px 4% 48px;margin:auto;border-top:1px solid #ffffff0d;min-height:calc(100svh - 72px)}
.guide-intro .section-kicker{margin-bottom:12px}
.guide-intro h2{font-size:clamp(28px,2.8vw,34px);font-weight:400;line-height:1.4;letter-spacing:-.035em;color:#dce7dd;margin:0}
.guide-section .assembly-mobile{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto;gap:clamp(24px,4vw,56px);margin:16px 0 0;max-width:none;flex:none}
.guide-section .assembly-step{display:flex;flex-direction:column;align-items:stretch;gap:16px;padding:0;border:0}
.guide-section .assembly-step-media{display:grid;place-items:center;width:100%;height:var(--guide-stage);max-width:none;background:transparent;border-radius:0;overflow:visible}
.guide-section .assembly-step-media video{width:min(100%,calc(var(--guide-stage)*.69444444));height:auto;max-height:100%;object-fit:contain;mix-blend-mode:screen;background:transparent}
.guide-section .assembly-step-copy{width:100%;max-width:440px;align-self:center;padding-top:12px;border-top:1px solid #cce1d01c}
.guide-section .assembly-step-number{margin-bottom:6px}
.guide-section .assembly-caption-current{opacity:1}
.guide-section .assembly-step-toggle{margin-top:4px}
body[data-night=true] .guide-section{opacity:0;visibility:hidden;pointer-events:none}
.guide-section{transition:opacity .45s,visibility .45s}
@media(max-width:800px){
 .page-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;width:100%}
 .page-nav a{min-width:0;font-size:11px;line-height:1.3;text-align:center}
 .guide-section{min-height:0;padding:56px 7% 64px}
 .guide-section .assembly-mobile{grid-template-columns:minmax(0,1fr);gap:0;margin-top:20px}
 .guide-section .assembly-step{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:center;gap:18px;padding:22px 0;border-bottom:1px solid #cce1d01c}
 .guide-section .assembly-step:first-child{padding-top:0}
 .guide-section .assembly-step:last-child{padding-bottom:0;border:0}
 .guide-section .assembly-step-media{display:block;height:auto}
 .guide-section .assembly-step-media video{width:100%;max-height:none}
 .guide-section .assembly-step-copy{max-width:none;padding:0;border:0}
}
@media(max-width:380px){
 .page-nav a{font-size:10px}
 .guide-section{padding-left:6%;padding-right:6%}
 .guide-section .assembly-step{grid-template-columns:1fr 1fr;gap:14px}
}
@media(prefers-reduced-motion:reduce){.guide-section{transition:none}}

/* Desktop: larger, level case bodies with their instructions alongside.
   Source x25..355 is a safe empty-edge trim: every moving part stays within
   x37..339. Both films retain one scale, and cover y28+219 matches topper y247.
   Mobile retains the preceding V29 layout without any changed declaration. */
@media(min-width:801px){
 .guide-section{--guide-film-height:clamp(500px,calc(100svh - 240px),720px);--guide-column-gap:clamp(16px,2vw,32px);max-width:1536px;min-height:0;padding:28px 2% 24px}
 .guide-intro .section-kicker{margin-bottom:8px}
 .guide-section .assembly-mobile{gap:var(--guide-column-gap);margin-top:-68px;align-items:start}
 .guide-section .assembly-step{--guide-label-width:clamp(100px,10vw,144px);--guide-copy-gap:clamp(12px,1.4vw,20px);--guide-viewport-width:min(calc(100% - var(--guide-label-width) - var(--guide-copy-gap)),calc(var(--guide-film-height)*330/648));position:relative;display:grid;grid-template-columns:var(--guide-viewport-width) var(--guide-label-width);column-gap:var(--guide-copy-gap);row-gap:0;justify-content:center;align-items:start}
 .guide-section .assembly-step-media{position:relative;display:block;grid-column:1;width:100%;height:auto;aspect-ratio:330/648;overflow:hidden}
 .guide-section .assembly-step-media video{position:absolute;left:calc(-100%*25/330);top:0;width:calc(100%*450/330);height:auto;max-height:none;object-fit:contain}
 .guide-section .assembly-step[data-guide=cover] .assembly-step-media video{top:calc(100%*219/648)}
 /* Vertical percentage margins use the containing block's width; this is
    the same resolved viewport width used by the film, even on narrow laptops. */
 .guide-section .assembly-step-copy{position:absolute;top:0;right:calc((100% - var(--guide-viewport-width) - var(--guide-label-width) - var(--guide-copy-gap))/2);width:var(--guide-label-width);max-width:none;margin-top:calc(var(--guide-viewport-width)*434.5/330);padding:0;border:0;transform:translateY(-50%);align-self:start}
 .guide-section .assembly-step-copy h3,.guide-section .assembly-caption-reserve strong{font-size:clamp(15px,1.25vw,18px);line-height:1.5;margin-bottom:8px}
 .guide-section .assembly-phase-copy p{font-size:clamp(12px,1vw,14px);line-height:1.75}
 .guide-section .assembly-step-number{font-size:10px;line-height:1.55;letter-spacing:.08em}
 .guide-section .assembly-step-toggle{font-size:12px;min-height:44px}
}

/* Compact mobile labels keep the new App chapter in the existing header row. */
.nav-short{display:none}
@media(max-width:800px){
 .page-nav{grid-template-columns:repeat(5,minmax(0,1fr))}
 .page-nav .nav-full{display:none}.page-nav .nav-short{display:inline}
}

/* V47 company line stays readable in every contact layout. */
.contact-offices article{min-width:0}.contact-offices .office-company{margin:0 0 10px;font-size:14px;line-height:1.75;color:#a5b2ac;overflow-wrap:anywhere}.contact-offices h3{overflow-wrap:anywhere}
