:root{--paper:#f7f6f0;--ink:#19201e;--muted:#525a54;--line:#c9cdc2;--gold:#ecd678;--green:#334b3e;--mono:Consolas,"Courier New",monospace}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.55 "Segoe UI",Arial,sans-serif}
.frame{width:min(1180px,90%);margin-inline:auto}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible{outline:3px solid #b8750b;outline-offset:4px}
.skip{position:absolute;left:1em;top:-6em;background:white;padding:1em;z-index:3}
.skip:focus{top:1em}
header{border-bottom:1px solid var(--line)}
.bar,.brand,nav,.action,.cover figcaption,footer .frame{display:flex;align-items:center}
.bar{justify-content:space-between;min-height:72px}
.brand{gap:12px;font-weight:700;font-size:18px;letter-spacing:-.04em}
.mark{display:grid;place-items:center;background:var(--ink);color:var(--gold);width:38px;height:38px;font:bold 18px/1 var(--mono);letter-spacing:-.1em;border-radius:3px}
nav{gap:28px;font-size:14px;font-weight:600}
nav a:hover,footer a:hover{text-decoration:underline;text-underline-offset:4px}
.hero{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,90px);align-items:center;padding-block:clamp(32px,4.7vw,75px)}
.intro{padding-block:14px}
.label,dt,.cover figcaption{font:600 11px/1.5 var(--mono);letter-spacing:.085em;text-transform:uppercase}
.label{margin:0 0 18px;color:#465247}
.accent{display:flex;align-items:center;gap:10px}
.accent:before{content:"";width:22px;height:4px;background:#a88732;flex:none}
.accent span{color:#92978b}
h1,h2,h3,p,figure,dl,dd{margin:0}
h1,h2,h3{font-family:"Segoe UI",Arial,sans-serif;line-height:1.04}
h1{font-size:clamp(56px,6.85vw,104px);letter-spacing:-.076em;line-height:.98;font-weight:700}
.lead{font-size:clamp(19px,1.85vw,27px);line-height:1.3;letter-spacing:-.04em;font-weight:600;margin-top:25px}
.summary,.process p:not(.label),.result p:not(.label){color:var(--muted);line-height:1.65}
.summary{margin-top:12px;max-width:47ch}
.action{display:inline-flex;background:var(--green);color:white;gap:24px;border-radius:3px;padding:12px 16px;margin-top:24px;font-weight:600;font-size:14px}
.action:hover{background:#23352b}.action span{color:var(--gold);font-size:20px;line-height:1}
.meta{display:flex;flex-wrap:wrap;gap:12px 32px;padding-top:16px;border-top:1px solid var(--line);margin-top:clamp(22px,3vw,45px)}
dt{color:var(--muted);font-size:10px;margin-bottom:3px}dd{font-size:13px;font-weight:600}
.cover{background:#202522;border-radius:4px;overflow:hidden}
.cover img{width:100%;height:clamp(410px,38vw,555px);display:block;object-fit:cover;object-position:center 48%}
.cover figcaption{gap:10px;padding:13px 18px;color:white;font-size:10px}
.square{height:7px;width:7px;background:var(--gold)}
.cap-right{margin-left:auto;color:#c5cac3}
.process,.result{padding-block:clamp(48px,6vw,90px)}
.process{border-top:1px solid var(--line)}
.process .label,.assembly .label,.result .label{margin-bottom:12px}
h2{font-size:clamp(38px,4.4vw,66px);letter-spacing:-.064em;font-weight:650}
h3{font-size:24px;letter-spacing:-.04em}
.process-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(22px,3vw,45px);margin-top:32px}
.process-grid img,.result img{width:100%;display:block;object-fit:cover;border-radius:3px}
.process-grid img{aspect-ratio:1.65;object-fit:contain;background:#e7e7e7}
.process-grid figcaption{padding-top:20px}
.process-grid p,.model p{margin-top:8px;max-width:58ch}
.assembly{background:#202c26;color:#f4f5ed;padding-block:clamp(50px,6vw,90px)}
.assembly .label{color:#dacc90}.assembly .accent:before{background:var(--gold)}
.viewer{display:grid;grid-template-columns:.75fr 1.25fr;gap:clamp(28px,6vw,94px);margin-top:30px}
.hint{font-size:15px;color:#d4dcd2;margin:0 0 18px}
#parts{display:grid}
#parts button{display:flex;justify-content:space-between;align-items:center;border:0;border-top:1px solid #57665c;background:transparent;color:inherit;padding:17px 14px;text-align:left;cursor:pointer;font:600 18px/1.3 "Segoe UI",Arial,sans-serif}
#parts button:last-child{border-bottom:1px solid #57665c}
#parts button:hover{background:#344139}
#parts button[aria-pressed=true]{background:var(--gold);color:var(--ink);border-color:var(--gold)}
.model img{display:block;width:100%;height:clamp(225px,26vw,345px);object-fit:contain;padding:18px;background:#e7e7e7;border-radius:3px}
.model figcaption{padding-top:16px}.model p{color:#d5ddd4}
.result{display:grid;grid-template-columns:1fr 1fr;gap:clamp(35px,6vw,85px);align-items:center}
.result p:not(.label){margin-top:16px;max-width:48ch}
.result .team-result{border-left:3px solid #ac903c;padding-left:14px}
footer{border-top:1px solid var(--line)}footer .frame{justify-content:space-between;padding-block:23px;font-size:14px;font-weight:600}
@media(max-width:760px){.hero,.result{grid-template-columns:1fr}.intro{padding:0}.hero{gap:24px}.cover img{height:clamp(310px,78vw,540px)}.bar{min-height:60px}.brand{font-size:16px}.mark{width:30px;height:30px;font-size:15px}nav{gap:12px;font-size:12px}.viewer{grid-template-columns:1fr;gap:18px}#parts{display:flex;flex-wrap:wrap;gap:5px}#parts button,#parts button:last-child{border:1px solid #57665c;border-radius:2px;padding:9px;font-size:14px;gap:5px}.model img{height:240px}.meta{margin-top:24px}.process-grid{grid-template-columns:1fr;gap:30px}.result{gap:24px}}
@media(max-width:425px){nav a:first-child{display:none}.hero{padding-top:30px}.brand{gap:8px}.label{font-size:10px}.cover figcaption{font-size:9px}.cap-right{letter-spacing:.04em}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.page-nav a:first-child { display: inline-flex; align-items: center; min-height: 42px; padding-inline: 8px; font-size: 15px; }