:root{--cream:#f7f3ea;--ink:#1d1914;--gold:#e4a600;--blue:#2048ff;--orange:#ee7612;--line:rgba(44,35,25,.2)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:Inter,"Noto Sans SC",sans-serif}
a{color:inherit;text-decoration:none}
img{display:block;width:100%}
.detail-nav{position:fixed;inset:0 0 auto;z-index:20;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:24px 4vw;font-size:10px;letter-spacing:.2em;background:linear-gradient(var(--cream) 25%,transparent)}
.detail-nav .brand{font-weight:600}
.detail-nav span{text-align:right}
.detail-hero{min-height:100vh;display:grid;grid-template-columns:58% 42%;padding:86px 4vw 4vw;gap:4vw;align-items:center}
.hero-product{position:relative;min-height:78vh;display:flex;align-items:center;justify-content:center}
.hero-product img{max-height:76vh;object-fit:contain;filter:drop-shadow(0 22px 22px rgba(42,31,17,.16))}
.image-note{position:absolute;left:0;bottom:0;font-size:9px;letter-spacing:.2em}
.hero-copy{padding-right:4vw}
.eyebrow{font-size:10px;letter-spacing:.22em;color:var(--orange);font-weight:600}
h1,h2{font-family:"Archivo Black",sans-serif;letter-spacing:-.065em}
h1{font-size:clamp(64px,7vw,128px);line-height:.8;margin:28px 0 30px;color:var(--gold)}
h1 span,.material-head h2 span{color:var(--blue)}
.cn-title{font-size:clamp(22px,2.3vw,38px);line-height:1.35;font-weight:700;max-width:610px}
.intro{font-size:14px;line-height:1.9;color:#62584d;max-width:590px}
dl{margin:42px 0 0}
dl div{display:grid;grid-template-columns:115px 1fr;border-top:1px solid var(--line);padding:14px 0}
dt{font-size:9px;letter-spacing:.18em;color:#7b7064}
dd{font-size:12px;margin:0}
.scroll-link{display:inline-block;margin-top:34px;color:var(--blue);font-size:9px;letter-spacing:.18em}
.concept,.material{padding:10vw 6vw}
.section-no{border-top:1px solid var(--line);padding-top:12px;margin-bottom:7vw;color:#796f62;font-size:9px;letter-spacing:.2em}
.concept-grid{display:grid;grid-template-columns:20% 48% 32%;gap:3vw;align-items:start}
.concept h2{font-family:Inter,"Noto Sans SC",sans-serif;font-size:clamp(42px,5vw,82px);line-height:1.14;font-weight:500;margin:0;letter-spacing:-.05em}
.concept h2 em{color:var(--gold);font-style:normal}
.concept-grid>p:last-child,.material-head p{font-size:14px;line-height:1.9;color:#62584d;margin:0}
.flat-art{display:grid;grid-template-columns:1fr 1fr;gap:2vw;padding:0 6vw 10vw}
figure{margin:0;position:relative;overflow:hidden}
.flat-art figure{background:#e9e1d4}
.flat-art img{aspect-ratio:1.515/1;object-fit:cover;transition:transform .7s cubic-bezier(.2,.8,.2,1)}
figure:hover img{transform:scale(1.018)}
figcaption{position:absolute;left:16px;bottom:14px;background:var(--gold);padding:9px 12px;font-size:9px;letter-spacing:.16em;font-weight:600}
.material-head{display:grid;grid-template-columns:2fr 1fr;gap:10vw;align-items:end;margin-bottom:7vw}
.material-head h2{font-size:clamp(56px,7.8vw,124px);line-height:.82;margin:0;color:var(--gold)}
.mockup-wide{background:#ece4d7;height:78vh}
.mockup-wide img{height:100%;object-fit:cover;mix-blend-mode:multiply}
.contain-mockup{height:auto;min-height:68vh;padding:3vw}
.contain-mockup img{height:auto;max-height:78vh;object-fit:contain;margin:auto}
.map-art figure{height:min(78vh,900px);display:flex;align-items:center;justify-content:center;padding:2.5vw;background:#ece4d7}
.map-art img{width:100%;height:100%;aspect-ratio:auto;object-fit:contain}
.application-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:2vw;margin-top:2vw}
.application-grid figure{height:70vh;background:#eee6d9}
.application-grid img{height:100%;object-fit:contain}
.real-view img{object-fit:cover}
.product-only{height:72vh;margin-top:2vw;background:transparent}
.product-only img{height:100%;object-fit:contain;filter:drop-shadow(0 18px 18px rgba(42,31,17,.13))}
.sticker-sheet,.fan-view{height:88vh}
.sticker-sheet img,.fan-view img{object-fit:contain;filter:none}
.towel-art img{object-fit:cover}
footer{border-top:1px solid var(--line);padding:28px 4vw;display:flex;justify-content:space-between;font-size:9px;letter-spacing:.16em}
@media(max-width:900px){.detail-nav{grid-template-columns:1fr auto}.detail-nav span{display:none}.detail-hero{grid-template-columns:1fr;padding-top:90px}.hero-product{min-height:50vh}.hero-product img{max-height:48vh}.concept-grid,.material-head{grid-template-columns:1fr}.concept-grid{gap:32px}.flat-art,.application-grid{grid-template-columns:1fr}.mockup-wide,.application-grid figure{height:55vh}.contain-mockup{height:auto;min-height:45vh;padding:5vw}.map-art figure{height:68vh}footer{gap:20px;flex-wrap:wrap}}