:root{--story-wine:#461923;--story-wine-deep:#2b1217;--story-rose:#b84a63;--story-ink:#2b1820;--story-gold:#bd8b52;--story-paper:#fbf7f1;--story-line:#e5d2ba}
.story-page{background:#fff;color:var(--story-ink)}
.story-page #main-content{max-width:none;padding:0}
.story{display:block;grid-template-columns:none;background:#fff;color:var(--story-ink);font:16px/1.75 Manrope,sans-serif;overflow:hidden}
.story h1,.story h2{margin:0;font-family:"Cormorant Garamond",serif;font-weight:600;line-height:.96;letter-spacing:-.04em}
.story-kicker{display:block;margin-bottom:17px;color:var(--story-rose);font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase}
.story-kicker--light{color:#e7b992}

.story-hero{min-height:calc(100svh - 122px);display:grid;grid-template-columns:44% 56%;background:var(--story-wine)}
.story-hero__copy{display:flex;flex-direction:column;justify-content:center;padding:clamp(60px,7vw,108px);color:#fff5ed}
.story-hero h1{font-size:clamp(62px,6.2vw,96px)}
.story-hero h1 em{color:#eab1b9;font-weight:500}
.story-hero__copy>p{max-width:560px;margin:28px 0;color:#e0c9c4;font-size:17px;line-height:1.75}
.story-hero__actions{display:flex;align-items:center;gap:28px}
.story-action{display:flex;justify-content:space-between;gap:35px;min-width:220px;padding:12px 0;border-bottom:1px solid var(--story-gold);font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase}
.story-action--quiet{min-width:auto;border:0;color:#e0c9c4}
.story-hero__notes{display:flex;flex-wrap:wrap;gap:18px;margin-top:42px;color:#d7bdb9;font-size:10px;letter-spacing:.08em;text-transform:uppercase}
.story-hero__notes span+span:before{content:"·";margin-right:18px;color:#df9f73}
.story-hero__visual{position:relative;min-width:0;margin:0;padding:clamp(28px,4vw,64px);display:grid;place-items:center;background:linear-gradient(145deg,#f8efe4,#e7cdb3)}
.story-hero__visual:before{content:"";position:absolute;inset:5% 7%;border:1px solid rgba(118,70,39,.18)}
.story-hero__visual img{position:relative;display:block;width:100%;height:100%;max-height:calc(100svh - 180px);object-fit:contain}
.story-hero__visual figcaption,.story-step figcaption{position:absolute;right:22px;bottom:22px;padding:8px 11px;background:rgba(255,255,255,.9);color:#5b2932;font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}

.story-route{position:sticky;top:88px;z-index:8;display:grid;grid-template-columns:1.2fr repeat(5,1fr);align-items:stretch;background:#fff;border-bottom:1px solid var(--story-line);box-shadow:0 10px 28px rgba(56,25,21,.05)}
.story-route>span,.story-route a{display:flex;align-items:center;min-height:66px;padding:0 28px;border-right:1px solid var(--story-line);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.story-route>span{color:#9c7160;font-size:10px;font-weight:600;letter-spacing:.16em}
.story-route a{gap:12px;color:#4b3530;font-weight:600;transition:background .2s,color .2s}
.story-route a:hover{background:var(--story-wine);color:#fff}
.story-route b{color:#b69071;font-size:10px}

.story-overview{padding:clamp(78px,8vw,125px) 6vw;background:var(--story-paper)}
.story-overview__copy{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,520px);align-items:end;gap:7vw;max-width:1460px;margin:0 auto 48px}
.story-overview h2{font-size:clamp(52px,5.4vw,82px)}
.story-overview__copy>p{margin:0;color:#706057;font-size:16px;line-height:1.8}
.story-overview figure{max-width:1460px;margin:0 auto;border:1px solid var(--story-line);background:#fff}
.story-overview img{display:block;width:100%;height:auto}

.story-process{padding:clamp(72px,8vw,120px) 5vw;background:#fff}
.story-step{scroll-margin-top:170px;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(360px,.88fr);min-height:620px;max-width:1460px;margin:0 auto 46px;border:1px solid var(--story-line);background:#fff;box-shadow:0 24px 70px rgba(61,29,20,.07)}
.story-step--reverse{grid-template-columns:minmax(360px,.88fr) minmax(0,1.12fr)}
.story-step--reverse figure{order:2}
.story-step figure{position:relative;min-width:0;margin:0;overflow:hidden;background:#eee2d4}
.story-step figure img{display:block;width:100%;height:100%;object-fit:cover}
.story-step__product{padding:40px;background:linear-gradient(145deg,#f8efe4,#ead5bf)!important}
.story-step__product img{object-fit:contain!important}
.story-step__copy{display:flex;flex-direction:column;justify-content:center;padding:clamp(52px,6vw,92px)}
.story-number{display:block;margin-bottom:36px;color:#aa8468;font-size:12px;font-weight:600;letter-spacing:.15em}
.story-step h2{font-size:clamp(48px,4.6vw,72px)}
.story-step__copy>p{max-width:600px;margin:25px 0 0;color:#6f6058;font-size:16px;line-height:1.8}
.story-facts{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px}
.story-facts span{padding:9px 13px;border:1px solid #dfc7ad;border-radius:999px;color:#58443b;font-size:12px}
.story-note{padding:18px 20px;border-left:3px solid var(--story-gold);background:var(--story-paper);font-size:14px!important}

.story-finale{display:grid;grid-template-columns:56% 44%;min-height:720px;background:var(--story-wine-deep);color:#fff4e9}
.story-finale figure{min-width:0;margin:0;padding:clamp(35px,5vw,76px);background:#f4e6d6}
.story-finale figure img{display:block;width:100%;height:100%;object-fit:contain}
.story-finale>div{display:flex;flex-direction:column;justify-content:center;padding:clamp(56px,7vw,104px)}
.story-finale h2{font-size:clamp(50px,5vw,78px)}
.story-finale p{max-width:520px;margin:26px 0;color:#d9c2bc;font-size:16px;line-height:1.8}
.story-finale__actions{display:grid;gap:8px;width:min(370px,100%)}
.story-finale__actions a{display:flex;justify-content:space-between;padding:14px 0;border-bottom:1px solid rgba(226,178,128,.72);font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase}

@media(max-width:1000px){
  .story-hero{min-height:0;grid-template-columns:1fr}
  .story-hero__copy{min-height:620px;padding:70px 7vw}
  .story-hero__visual{min-height:65svh}
  .story-route{grid-template-columns:repeat(5,minmax(130px,1fr));overflow-x:auto;top:88px}
  .story-route>span{display:none}
  .story-route a{min-height:58px;white-space:nowrap;padding:0 20px}
  .story-overview__copy{grid-template-columns:1fr;gap:20px}
  .story-step,.story-step--reverse{grid-template-columns:1fr;min-height:0}
  .story-step--reverse figure{order:0}
  .story-step figure{min-height:58svh}
  .story-step__copy{padding:64px 7vw 72px}
  .story-finale{grid-template-columns:1fr}
  .story-finale figure{min-height:66svh}
}

@media(max-width:600px){
  .story{font-size:15px}
  .story-hero__copy{min-height:auto;padding:56px 6vw 62px}
  .story-hero h1{font-size:50px}
  .story-hero__copy>p{font-size:15px}
  .story-hero__actions{align-items:flex-start;flex-direction:column;gap:12px}
  .story-action{width:100%;min-width:0}
  .story-action--quiet{width:auto}
  .story-hero__notes{gap:10px 14px;margin-top:32px;line-height:1.6}
  .story-hero__notes span+span:before{margin-right:14px}
  .story-hero__visual{min-height:58svh;padding:22px}
  .story-hero__visual figcaption,.story-step figcaption{right:12px;bottom:12px;font-size:9px}
  .story-route{top:72px}
  .story-route a{min-height:54px;padding:0 16px;font-size:11px}
  .story-overview{padding:64px 5vw}
  .story-overview h2{font-size:43px}
  .story-overview__copy>p{font-size:15px}
  .story-overview figure{overflow:hidden}
  .story-overview figure img{width:100%;max-width:100%}
  .story-process{padding:54px 4vw}
  .story-step{scroll-margin-top:135px;margin-bottom:24px}
  .story-step figure{min-height:43svh}
  .story-step__product{padding:20px}
  .story-step__copy{padding:46px 6vw 52px}
  .story-number{margin-bottom:24px}
  .story-step h2{font-size:42px}
  .story-step__copy>p{font-size:15px}
  .story-facts span{font-size:11px}
  .story-finale figure{min-height:52svh;padding:24px}
  .story-finale>div{padding:58px 6vw 66px}
  .story-finale h2{font-size:44px}
  .story-finale p{font-size:15px}
}