.design-review{margin:20px 0 100px;scroll-margin-top:110px}.story-intro{max-width:780px;margin-bottom:54px}.story-intro h2{font-size:clamp(42px,5.4vw,76px)}.story-intro>p{font-size:16px;line-height:1.8;max-width:590px;margin-top:25px}.story-disclosure{display:block;font-size:9px;color:var(--muted);margin-top:23px}.design-story{list-style:none;margin:0;padding:0}.story-chapter{display:grid;grid-template-columns:minmax(240px,.8fr) minmax(0,1.3fr);gap:65px;align-items:center;padding:38px 0;border-top:1px solid var(--line)}.story-copy{position:relative;padding:25px 0 25px 48px}.story-number{position:absolute;left:0;top:30px;font-family:var(--mono);font-size:12px;color:var(--lime)}.story-copy:after{content:'';position:absolute;left:9px;top:57px;bottom:10px;width:1px;background:linear-gradient(var(--lime),#c8f78300);opacity:.4}.story-copy h3{font-size:clamp(28px,3vw,42px);line-height:1.12;margin-bottom:21px}.story-copy p{font-size:14px;line-height:1.8;max-width:335px}.story-scene{position:relative;isolation:isolate;min-width:0;height:390px;margin:0;background:#171d19;border:1px solid #404a39;overflow:hidden}.story-scene canvas{position:absolute;inset:0;width:100%;height:100%}.story-eye{height:330px}.story-caption{position:absolute;left:18px;bottom:16px;font-family:var(--mono);text-transform:uppercase;letter-spacing:.1em;font-size:9px;background:#101512dc;color:#cad3bd;padding:7px 10px}.story-pin{position:absolute;max-width:250px;transform:translate(-50%,-100%);color:#f2c58c;background:#30291ef2;border:1px solid #aa8759;border-radius:4px;padding:7px 10px;white-space:nowrap;font-size:10px;box-shadow:0 4px 20px #0003;pointer-events:none}.story-pin:after{content:'';position:absolute;left:50%;bottom:-17px;height:16px;width:1px;background:#efc586}.story-quote{position:absolute;left:18px;right:18px;bottom:15px;margin:0;padding:12px 15px;background:#1e261ef5;border-left:2px solid #d4ab74;color:#ece4d4;font-family:var(--display);font-size:17px;line-height:1.5;letter-spacing:-.02em}.story-recall{border-color:var(--lime);color:#e1efc9}.story-memory{position:absolute;bottom:15px;left:18px;right:18px;background:#1e291bf5;border:1px solid #607b42;padding:11px 15px}.story-memory .micro{font-size:8px;color:var(--lime)}.story-memory strong{display:block;font-size:14px;font-weight:500;margin:5px 0;color:#e3edcf}.story-memory small{font-size:10px;color:var(--muted)}.story-result{display:grid;grid-template-columns:.8fr 1.3fr;gap:65px;border-top:1px solid var(--line);padding:35px 0}.story-result>.micro{color:var(--lime);font-size:9px;padding-top:6px}.story-result p{font-family:var(--display);font-size:29px;line-height:1.3;color:var(--ink);letter-spacing:-.04em}.story-result p span{display:block;font-family:var(--sans);font-size:14px;line-height:1.8;color:var(--muted);letter-spacing:0;margin-top:13px}
@media(max-width:1000px){.story-chapter{gap:30px;grid-template-columns:minmax(200px,.85fr) minmax(0,1.3fr)}.story-copy{padding-left:33px}.story-scene{height:350px}.story-quote{font-size:15px}.story-result{gap:30px}.story-memory strong{font-size:12px}}
@media(max-width:700px){.design-review{margin-bottom:65px}.story-intro{margin-bottom:34px}.story-intro h2{font-size:48px}.story-intro>p{font-size:14px;margin-top:20px}.story-intro .number{font-size:9px}.story-chapter{grid-template-columns:1fr;gap:20px;padding:30px 0}.story-copy{padding:0 0 0 35px}.story-number{top:7px;font-size:11px}.story-copy:after{top:34px;bottom:0}.story-copy h3{font-size:32px;margin-bottom:14px}.story-copy h3 br{display:none}.story-copy p{font-size:14px;max-width:100%}.story-scene{height:355px}.story-eye{height:255px}.story-pin{font-size:8px;padding:6px 8px}.story-quote{left:12px;right:12px;bottom:12px;font-size:15px;padding:10px 12px}.story-memory{left:12px;right:12px;bottom:12px;padding:10px 12px}.story-memory strong{font-size:12px}.story-memory small{font-size:9px}.story-result{grid-template-columns:1fr;gap:15px;padding:28px 0}.story-result p{font-size:27px}}
.story-scroll{height:440svh;position:relative}.story-sticky{position:sticky;top:104px;height:calc(100svh - 128px);min-height:440px;max-height:840px;display:flex;align-items:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);isolation:isolate}.story-sticky:after{content:'';position:absolute;left:0;bottom:-1px;width:100%;height:2px;background:var(--lime);transform:scaleX(var(--story-progress,0));transform-origin:left;z-index:4}.has-scroll-story .design-story{position:relative;width:100%;height:100%;margin:0}.has-scroll-story .story-chapter{position:absolute;inset:0;width:100%;height:100%;border:0;opacity:0;padding:20px 0;will-change:opacity}.has-scroll-story .story-chapter:first-child{opacity:1}.has-scroll-story .story-copy{will-change:transform}.has-scroll-story .story-scene{height:min(490px,calc(100svh - 200px));min-height:320px;will-change:transform}.has-scroll-story .story-eye{height:min(490px,calc(100svh - 200px))}
@media(max-width:800px){.story-sticky{top:86px;height:calc(100svh - 106px)}}
@media(max-width:700px){.story-scroll{height:460svh}.story-sticky{top:82px;height:calc(100svh - 98px);min-height:500px}.has-scroll-story .story-chapter{grid-template-rows:auto minmax(0,1fr);align-content:center;gap:18px;padding:18px 0}.has-scroll-story .story-copy{align-self:end}.has-scroll-story .story-copy h3{font-size:30px;margin-bottom:10px}.has-scroll-story .story-copy p{font-size:13px;line-height:1.65}.has-scroll-story .story-scene,.has-scroll-story .story-eye{height:100%;min-height:0;max-height:470px;align-self:start}.has-scroll-story .story-quote{font-size:14px}.has-scroll-story .story-number{top:5px}}
@media(max-width:700px){.has-scroll-story .story-chapter{grid-template-rows:180px minmax(0,1fr)}}
@media(max-height:620px) and (min-width:701px){.story-sticky{top:94px;height:calc(100svh - 110px);min-height:300px}.has-scroll-story .story-scene,.has-scroll-story .story-eye{height:calc(100svh - 160px);min-height:250px}.has-scroll-story .story-copy h3{font-size:28px}.has-scroll-story .story-copy p{font-size:12px}}
@media(max-height:650px) and (max-width:700px){.story-sticky{top:76px;height:calc(100svh - 86px);min-height:390px}.has-scroll-story .story-chapter{gap:10px;padding:10px 0}.has-scroll-story .story-copy h3{font-size:25px;margin-bottom:6px}.has-scroll-story .story-copy p{font-size:12px}.has-scroll-story .story-scene{max-height:none}.has-scroll-story .story-quote{font-size:12px}.has-scroll-story .story-memory strong{font-size:11px}}
@media(max-height:650px) and (max-width:700px){.has-scroll-story .story-chapter{grid-template-rows:145px minmax(0,1fr)}}