@layer components{.hero-stage{background:var(--color-linen);height:100svh;min-height:680px;max-height:1200px;position:relative;overflow:clip}.hero-content{grid-template-columns:.94fr 1.06fr;gap:6%;height:100%;padding-block:124px 92px;display:grid;position:relative}.hero-copy-area{grid-area:1/1;align-items:center;min-width:0;display:grid}.hero-intro,.story-copy-middle,.story-finish{grid-area:1/1}.story-copy-middle,.story-finish{visibility:hidden;opacity:0}.hero-intro-note{align-items:center;gap:14px;margin-bottom:30px;font-size:12px;display:flex}.hero-intro h1{letter-spacing:-.055em;font-size:clamp(76px,8.5vw,139px);line-height:.85}.hero-intro h1 span{display:block}.hero-intro h1 em,.story-finish h2 em{font-style:italic;font-weight:inherit;color:var(--color-thread)}.hero-description{margin-block:28px 26px;font-size:13px;line-height:1.8}.hero-photography{grid-area:1/2;grid-template-rows:minmax(0,1fr) auto;gap:14px;min-width:0;min-height:0;margin:0;display:grid}.hero-photo-frame{isolation:isolate;background:#e5dbc9;position:relative;overflow:hidden}.hero-photo{object-fit:cover;object-position:50% 61%;transform-origin:51% 62%;width:100%;height:100%;position:absolute;inset:0}.hero-photo-caption{color:#6b6256;align-items:center;gap:12px;font-size:11px;display:flex}.hero-thread-swatch{border-block:1px solid var(--color-thread);flex-shrink:0;width:27px;height:7px;transform:skewY(-10deg)}.story-copy h2,.story-finish h2{letter-spacing:-.045em;font-size:clamp(64px,7vw,112px);line-height:.95}.story-step-label{margin-bottom:26px;font-size:12px}.story-copy>p:last-child,.story-finish>h2+p{margin-top:26px;font-size:13px;line-height:1.8}.story-finish .button{margin-top:26px}.hero-bottom{position:absolute;bottom:26px;left:0;right:0}.scroll-cue{align-items:center;gap:14px;width:fit-content;font-size:11px;display:flex}.scroll-cue-line{background:var(--color-ink);width:1px;height:32px;position:relative}.scroll-cue-line:after{content:"";border-bottom:1px solid;border-right:1px solid;width:5px;height:5px;position:absolute;bottom:0;left:-2px;rotate:45deg}.scroll-cue-sub{color:#6b6256;margin-top:2px;font-size:10px;display:block}}@media (width<=899px){.hero-stage{min-height:640px;max-height:1200px}.hero-content{grid-template-rows:auto minmax(0,1fr);grid-template-columns:1fr;gap:24px;padding-block:106px 70px}.hero-copy-area{grid-area:1/1;align-items:start}.hero-photography{grid-area:2/1;gap:9px}.hero-intro-note{margin-bottom:16px;font-size:10px}.hero-intro h1{font-size:clamp(44px,12.3vw,74px);line-height:.9}.hero-intro h1 span:nth-child(-n+2){display:inline}.hero-intro h1 span:first-child:after{content:" "}.hero-description{margin-block:16px;font-size:12px}.hero-intro .button,.story-finish .button{gap:26px;min-height:44px;padding:11px 20px;font-size:12px}.hero-photo-caption{font-size:10px}.story-copy h2,.story-finish h2{font-size:clamp(48px,12vw,74px);line-height:.93}.story-step-label{margin-bottom:16px;font-size:10px}.story-copy>p:last-child,.story-finish>h2+p{margin-top:16px;font-size:12px}.story-finish .button{margin-top:16px}.hero-bottom{bottom:18px}.scroll-cue{gap:12px;font-size:10px}.scroll-cue-line{height:25px}.scroll-cue-sub{display:none}}@media (width<=767px){.hero-content{padding-top:94px}}@media (height<=750px) and (width>=900px){.hero-stage{min-height:600px}.hero-content{padding-block:108px 72px}.hero-intro h1{font-size:clamp(76px,7vw,100px)}.hero-intro-note,.story-step-label{margin-bottom:20px}.hero-description{margin-block:20px}.story-copy h2,.story-finish h2{font-size:clamp(64px,6vw,90px)}.hero-bottom{bottom:20px}}@media (height<=540px) and (orientation:landscape){.hero-stage{height:100svh;min-height:360px}.hero-content{grid-template-rows:minmax(0,1fr);grid-template-columns:1fr 1fr;gap:30px;padding-block:80px 48px}.hero-copy-area{align-items:center}.hero-photography{grid-area:1/2;gap:6px}.hero-intro h1{font-size:clamp(38px,5.4vw,56px);line-height:.9}.hero-intro h1 span:nth-child(-n+2){display:inline}.hero-intro h1 span:first-child:after{content:" "}.hero-intro-note,.story-step-label{margin-bottom:10px;font-size:10px}.hero-description{margin-block:10px;font-size:10px}.hero-intro .button,.story-finish .button{gap:12px;min-height:40px;padding:8px 14px;font-size:10px}.hero-photo-caption{gap:8px;font-size:9px}.hero-thread-swatch{width:18px}.story-copy h2,.story-finish h2{font-size:clamp(38px,5.5vw,56px)}.story-copy>p:last-child,.story-finish>h2+p{margin-top:10px;font-size:10px}.story-finish .button{margin-top:12px}.hero-bottom{bottom:12px}.scroll-cue-line{height:18px}.scroll-cue-sub{display:none}}