:root{--black:#090909;--ink:#111;--paper:#f2f1ed;--white:#fff;--line:rgba(17,17,17,.18);--gray:#aaa;--pad:clamp(22px,4vw,70px)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Inter","Noto Sans JP",sans-serif;-webkit-font-smoothing:antialiased}body.loading{overflow:hidden}a{color:inherit;text-decoration:none}img{width:100%;height:100%;display:block;object-fit:cover}.loader{position:fixed;inset:0;z-index:100;background:#060606;color:#fff;display:grid;place-items:center;transition:transform .9s cubic-bezier(.76,0,.24,1) .35s}.loader span{font-size:12px;letter-spacing:.28em}.loader i{position:absolute;left:0;bottom:0;height:2px;background:#fff;animation:load 1.5s ease forwards}.loader.done{transform:translateY(-100%)}@keyframes load{from{width:0}to{width:100%}}
.site-header{height:82px;padding:0 var(--pad);position:absolute;z-index:20;top:0;left:0;right:0;color:#fff;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;border-bottom:1px solid rgba(255,255,255,.25)}.brand{display:flex;flex-direction:column;width:max-content}.brand span{font-size:18px;font-weight:600;letter-spacing:.09em}.brand small{font-size:7px;letter-spacing:.23em;margin-top:3px}.site-header nav{display:flex;gap:34px;font-size:10px;letter-spacing:.18em}.site-header nav a{position:relative}.site-header nav a:after{content:"";position:absolute;left:0;bottom:-8px;width:0;height:1px;background:#fff;transition:.3s}.site-header nav a:hover:after{width:100%}.header-cta{justify-self:end;font-size:10px;letter-spacing:.16em;border:1px solid rgba(255,255,255,.7);padding:13px 16px}.header-cta span{margin-left:18px}
.hero{height:100svh;min-height:680px;background:#050505;position:relative;overflow:hidden;color:#fff}.hero-panels{position:absolute;inset:0;display:grid;grid-template-columns:1.1fr .72fr 1.05fr .74fr 1.1fr;gap:6px;transform:scale(1.035)}.panel{overflow:hidden;opacity:.75;filter:grayscale(1) contrast(1.08);animation:panelReveal 1.2s both cubic-bezier(.22,1,.36,1);transform-origin:center}.panel img{height:118%;will-change:transform;animation:drift 14s ease-in-out infinite alternate}.panel-1,.panel-5{margin-top:-7vh}.panel-2,.panel-4{margin-top:7vh;height:94%}.panel-3{height:106%;margin-top:-3vh}.panel-2 img,.panel-4 img{animation-direction:alternate-reverse;animation-duration:17s}@keyframes panelReveal{from{clip-path:inset(100% 0 0)}to{clip-path:inset(0)}}@keyframes drift{from{transform:translateY(-3%) scale(1.02)}to{transform:translateY(-13%) scale(1.08)}}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.3),rgba(0,0,0,.05) 50%,rgba(0,0,0,.3)),linear-gradient(0deg,rgba(0,0,0,.55),transparent 60%)}.hero-copy{position:absolute;z-index:2;left:50%;top:51%;transform:translate(-50%,-50%);text-align:center;width:90%;text-shadow:0 2px 25px #000}.eyebrow{font-size:10px;letter-spacing:.34em;margin:0 0 25px}.hero h1{font-size:clamp(48px,8.2vw,132px);line-height:.82;letter-spacing:-.075em;margin:0;font-weight:600}.hero h1 span{display:block}.hero-ja{font-size:clamp(15px,1.5vw,23px);letter-spacing:.2em;margin-top:35px}.scroll-cue{position:absolute;z-index:2;left:var(--pad);bottom:30px;font-size:8px;letter-spacing:.2em;display:flex;align-items:center;gap:15px}.scroll-cue i{display:block;width:70px;height:1px;background:#fff;position:relative;overflow:hidden}.scroll-cue i:after{content:"";position:absolute;inset:0;background:#555;animation:scrollLine 2s infinite}@keyframes scrollLine{from{transform:translateX(-100%)}to{transform:translateX(100%)}}.hero-index{position:absolute;right:var(--pad);bottom:22px;font-size:11px;letter-spacing:.2em}.hero-index span{color:#888;margin:0 10px}
.section{padding:130px var(--pad)}.section-index{padding-bottom:22px;border-bottom:1px solid var(--line);font-size:9px;letter-spacing:.22em;color:#666}.intro-grid{display:grid;grid-template-columns:1.1fr .75fr;gap:12vw;padding:90px 5vw}.display{font-size:clamp(48px,7.2vw,112px);line-height:1.05;letter-spacing:-.07em;margin:0;font-weight:500}.display em{font-style:normal;color:#aaa}.intro-copy{padding-top:6vw;max-width:510px}.intro-copy .lead{font-size:clamp(20px,2.3vw,32px);line-height:1.7;margin:0 0 40px;font-weight:500}.intro-copy p:not(.lead),.pocket-intro p,.detail-copy p{font-size:14px;line-height:2.15;color:#555}.image-stage{height:min(66vw,900px);overflow:hidden}.image-stage img{object-position:center 53%}
.results{background:#0a0a0a;color:#fff;padding:115px var(--pad)}.results-head{display:flex;justify-content:space-between;align-items:flex-start;padding-bottom:55px;border-bottom:1px solid #333}.results-head span{font-size:9px;letter-spacing:.25em;color:#888}.results-head p{font-size:clamp(18px,2vw,28px);line-height:1.7;margin:0;width:38%}.stats{display:grid;grid-template-columns:1.25fr 1fr 1fr}.stat{padding:65px 2.5vw 55px 0;border-bottom:1px solid #333}.stat+.stat{border-left:1px solid #333;padding-left:2.5vw}.stat small{display:block;color:#999;font-size:11px;letter-spacing:.14em;margin-bottom:30px}.stat strong{font-size:clamp(44px,6vw,100px);font-weight:400;letter-spacing:-.07em}.stat span{font-size:15px;margin-left:8px}.text-link{display:flex;justify-content:space-between;width:250px;margin:45px 0 0 auto;border-bottom:1px solid #777;padding-bottom:13px;font-size:10px;letter-spacing:.17em}
.section-title{display:grid;grid-template-columns:1fr 1fr;align-items:end;margin:80px 0}.section-title p{font-size:9px;letter-spacing:.2em;color:#777}.section-title h2{font-size:clamp(50px,7vw,108px);line-height:1.07;letter-spacing:-.07em;margin:0;font-weight:500}.twoway-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:12px}.media-card{margin:0;background:#ddd;position:relative;overflow:hidden;height:min(65vw,850px)}.media-card:first-child{height:min(52vw,710px);align-self:end}.media-card img{object-fit:cover}.media-card.dark img{object-fit:contain;filter:grayscale(1);background:#e9e9e7}.media-card figcaption{position:absolute;left:0;right:0;bottom:0;background:rgba(5,5,5,.88);color:#fff;padding:20px 24px;display:flex;justify-content:space-between;gap:30px}.media-card figcaption span{font-size:8px;letter-spacing:.2em;color:#aaa}.media-card figcaption b{font-size:12px;font-weight:400}
.pockets{background:#e7e7e4}.pocket-intro{display:grid;grid-template-columns:1fr .7fr;align-items:end;gap:10vw;margin:85px 5vw}.pocket-intro p{max-width:520px}.pocket-visual{height:min(57vw,760px);background:#fff}.pocket-visual img{object-fit:contain;filter:grayscale(.95)}.pocket-notes{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);margin-top:60px}.pocket-notes>div{padding:35px 3vw 0 0}.pocket-notes>div+div{border-left:1px solid var(--line);padding-left:3vw}.pocket-notes span{font-size:10px;color:#888}.pocket-notes h3{font-size:17px;letter-spacing:.08em}.pocket-notes p{font-size:12px;line-height:1.8;color:#666}
.technology{height:100svh;min-height:760px;position:relative;color:#fff;display:grid;align-items:end;padding-bottom:80px;overflow:hidden;background:#000}.technology-bg{position:absolute;inset:0}.technology-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.85),rgba(0,0,0,.15)),linear-gradient(0deg,#050505,transparent 60%)}.technology-bg img{filter:grayscale(1);object-position:center 35%}.tech-content{position:relative;z-index:1}.technology .section-index{border-color:#555;color:#aaa}.overline{font-size:9px;letter-spacing:.23em;margin:70px 0 25px}.tech-content h2{font-size:clamp(40px,5.5vw,82px);line-height:1.2;letter-spacing:-.055em;margin:0 0 60px;font-weight:500}.function-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #555}.function-grid span{font-size:10px;letter-spacing:.08em;padding:16px 0;border-bottom:1px solid #444}
.detail{background:#111;color:#fff}.detail .section-index{border-color:#333;color:#999}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:80px}.detail-copy{padding:7vw 5vw;background:#191919;display:flex;flex-direction:column;justify-content:center;min-height:620px}.detail-copy span{font-size:9px;letter-spacing:.25em;color:#999}.detail-copy h2{font-size:clamp(38px,4.8vw,74px);line-height:1.18;letter-spacing:-.06em;margin:35px 0}.detail-copy p{color:#aaa;max-width:450px}.detail-grid figure{margin:0;min-height:620px;background:#ddd}.detail-media-stack{display:grid;gap:12px}.detail-media-stack figure{min-height:0;aspect-ratio:4/3}.detail-grid>figure:last-child{grid-column:1/3;height:min(58vw,850px)}.detail-grid figure img{object-fit:contain}.detail-impact{position:relative;height:min(88vw,1120px);margin:12px 0 0;overflow:hidden;background:#080808}.detail-impact:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.12) 30%,rgba(0,0,0,.82) 100%)}.detail-impact img{width:100%;height:100%;object-fit:cover;object-position:center 44%}.detail-impact figcaption{position:absolute;z-index:1;left:clamp(24px,6vw,90px);right:clamp(24px,6vw,90px);bottom:clamp(30px,6vw,90px)}.detail-impact p{margin:0 0 24px;font-size:clamp(13px,1.4vw,20px);letter-spacing:.12em}.detail-impact h2{margin:0;font-size:clamp(42px,7.5vw,118px);line-height:.95;letter-spacing:-.055em}.detail-impact span{display:block;margin-top:24px;font-size:clamp(17px,2.2vw,32px);letter-spacing:.03em}
.looks{overflow:hidden;background:#0a0a0a;padding:8px 0}.looks{overflow:hidden;background:#0a0a0a;padding:8px 0}.look-track{display:grid;grid-template-columns:repeat(14,35vw);gap:8px;width:max-content;animation:lookScroll 65s linear infinite}.look-track figure{height:75vh;min-height:600px;margin:0;position:relative;filter:grayscale(1)}.look-track figcaption{position:absolute;left:20px;bottom:20px;color:#fff;font-size:9px;letter-spacing:.2em}@keyframes lookScroll{to{transform:translateX(calc(-7 * (35vw + 8px)))}}
.final-cta{min-height:78vh;background:#f0efeb;padding:120px var(--pad);text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center}.final-cta h2{font-size:clamp(46px,7vw,105px);line-height:1.12;letter-spacing:-.07em;margin:0 0 70px;font-weight:500}.circle-link{width:180px;height:180px;border:1px solid #222;border-radius:50%;display:flex;align-items:center;justify-content:center;position:relative;transition:.4s}.circle-link:hover{background:#111;color:#fff;transform:scale(1.06)}.circle-link span{font-size:11px;letter-spacing:.18em;line-height:1.6}.circle-link b{position:absolute;right:35px;top:35px;font-weight:400}footer{background:#090909;color:#fff;padding:65px var(--pad);display:grid;grid-template-columns:1fr 1fr 1fr;align-items:end}footer p{font-size:10px;letter-spacing:.2em;text-align:center}footer>small{font-size:7px;color:#777;text-align:right;letter-spacing:.1em}
.reveal{opacity:0;transform:translateY(35px);transition:opacity .8s ease,transform .8s cubic-bezier(.22,1,.36,1)}.reveal.visible{opacity:1;transform:none}
@media(max-width:800px){.site-header{height:70px;grid-template-columns:1fr auto}.site-header nav{display:none}.header-cta{font-size:0;padding:11px}.header-cta span{font-size:15px;margin:0}.hero{min-height:650px}.hero-panels{grid-template-columns:.8fr 1.1fr .8fr;gap:3px}.panel-1,.panel-5{display:none}.panel-2,.panel-4{height:100%;margin-top:0}.hero h1{font-size:15vw}.hero-ja{letter-spacing:.12em}.hero-index{display:none}.section{padding:90px var(--pad)}.intro-grid,.section-title,.pocket-intro{grid-template-columns:1fr;gap:40px;padding:65px 0;margin:0}.intro-copy{padding-top:0}.image-stage{height:110vw}.results{padding:80px var(--pad)}.results-head{display:block}.results-head p{width:100%;margin-top:30px}.stats{grid-template-columns:1fr}.stat+.stat{border-left:0;padding-left:0}.stat{padding:38px 0}.stat strong{font-size:16vw}.twoway-grid{grid-template-columns:1fr}.media-card,.media-card:first-child{height:115vw}.media-card figcaption{display:block}.media-card figcaption b{display:block;margin-top:10px}.pocket-visual{height:75vw}.pocket-notes{grid-template-columns:1fr}.pocket-notes>div+div{border-left:0;padding-left:0}.pocket-notes>div{border-bottom:1px solid var(--line);padding:25px 0}.technology{height:auto;min-height:850px}.function-grid{grid-template-columns:repeat(2,1fr)}.detail-grid{grid-template-columns:1fr}.detail-copy{min-height:auto}.detail-grid figure{min-height:0;height:80vw}.detail-media-stack figure{height:auto}.detail-grid>figure:last-child{grid-column:auto;height:70vw}.look-track{grid-template-columns:repeat(14,85vw);animation:none}.look-track figure{height:68vh}.final-cta{min-height:75vh}.circle-link{width:150px;height:150px}footer{grid-template-columns:1fr;gap:35px}footer p,footer>small{text-align:left}}
@media(max-width:800px){.detail-impact{height:140vw}.detail-impact p{margin-bottom:18px}.detail-impact span{margin-top:16px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.panel img,.look-track,.scroll-cue i:after{animation:none!important}.reveal{opacity:1;transform:none}.loader{display:none}}

/* Hero typography follows the left-aligned RE:LORE editorial system. */
.hero-shade{background:linear-gradient(90deg,rgba(0,0,0,.68),rgba(0,0,0,.08) 72%,rgba(0,0,0,.25)),linear-gradient(0deg,rgba(0,0,0,.55),transparent 60%)}
.hero-copy{left:var(--pad);top:50%;transform:translateY(-46%);text-align:left;width:min(88vw,1120px)}
.hero-copy .eyebrow{font-weight:700;margin-bottom:28px}
.hero h1{font-size:clamp(48px,7vw,108px);line-height:.82;letter-spacing:-.078em;font-weight:700}
.hero h1 .hero-line{display:block;width:max-content;max-width:100%;white-space:nowrap}
.hero h1 .hero-line-moon{letter-spacing:-.07em}
.hero-ja{font-size:clamp(14px,1.25vw,20px);letter-spacing:.18em;line-height:1.7;margin-top:38px}

@media(max-width:800px){
  .hero-copy{top:49%;width:calc(100vw - var(--pad)*2)}
  .hero h1{font-size:11.2vw;line-height:.84;letter-spacing:-.073em}
  .hero h1 .hero-line-moon{font-size:.94em}
  .hero-ja{font-size:13px;letter-spacing:.1em;margin-top:28px}
  .hero-copy .eyebrow{font-size:8px;letter-spacing:.25em;margin-bottom:20px}
}

/* Detachable-sleeve GIF: compact, balanced spacing and color reveal. */
.media-card.dark{height:auto;align-self:end;background:#e9e9e7}
.media-card.dark img{height:auto;aspect-ratio:13/7;object-fit:contain;margin:clamp(18px,2vw,28px) 0;filter:grayscale(1);transition:filter 1.25s ease,opacity .6s ease}
.media-card.dark.visible img{filter:grayscale(0)}
.media-card.dark figcaption{position:static}

@media(max-width:800px){
  .media-card.dark{height:auto}
  .media-card.dark img{margin:16px 0}
}

/* Use the former gap above the GIF as a purposeful headline area. */
.twoway-season{display:block;margin:62px 0 32px}
.twoway-season p{margin:0}
.twoway-top{display:grid;grid-template-columns:.82fr 1.18fr;gap:12px;align-items:center;margin-bottom:12px}
.twoway-heading{font-size:clamp(50px,5.5vw,84px);line-height:1.07;letter-spacing:-.07em;margin:0;padding-right:4vw;font-weight:500;white-space:nowrap}
.twoway-top .media-card.dark{width:100%}
.twoway-models{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;min-width:0}
.twoway-models .media-card{height:min(65vw,850px)}
.twoway-models .media-card img{object-position:center top}
.twoway-models .media-card figcaption{padding:18px 16px;display:block}
.twoway-models .media-card figcaption b{display:block;margin-top:9px;font-size:10px;line-height:1.6}

@media(max-width:800px){
  .twoway-season{margin:44px 0 28px;padding:0}
  .twoway-top{grid-template-columns:1fr;gap:36px;margin-bottom:8px}
  .twoway-heading{font-size:clamp(48px,14vw,72px);padding-right:0}
  .twoway-models{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .twoway-models .media-card{height:110vw}
  .twoway-models .media-card figcaption{padding:14px 10px}
  .twoway-models .media-card figcaption b{font-size:9px}
}

/* Storage GIF: reveal its original colors as the section enters view. */
.pocket-visual img{filter:grayscale(1);transition:filter 1.25s ease}
.pocket-visual.visible img{filter:grayscale(0)}

.site-header nav .nav-current:before{content:"";position:absolute;left:0;right:0;bottom:-8px;height:1px;background:#fff}

/* Look gallery: continuously breathe between monochrome and full color. */
.look-track figure{animation:lookColorCycle 12s ease-in-out infinite}
@keyframes lookColorCycle{
  0%,50%,100%{filter:grayscale(1)}
  25%,75%{filter:grayscale(0)}
}

@media(prefers-reduced-motion:reduce){
  .look-track figure{animation:none;filter:grayscale(0)}
}