/* hero */
.hero{position:relative;min-height:max(640px,100svh);display:flex;align-items:flex-end;color:var(--icing);background:var(--licorice);overflow:hidden}
.hero--inner{min-height:max(560px,86svh)}
.hero-media{position:absolute;inset:0}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,60% 55%);transform-origin:60% 60%}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(22,17,15,.9) 0%,rgba(22,17,15,.62) 38%,rgba(22,17,15,.08) 72%),linear-gradient(0deg,rgba(22,17,15,.75),rgba(22,17,15,0) 45%);pointer-events:none}
.hero-copy{position:relative;z-index:2;width:min(100% - 2*var(--gutter),1440px);margin-inline:auto;padding:calc(var(--header) + 3rem) 0 clamp(3rem,2rem + 4vw,6rem)}
.hero-copy > *{max-width:min(760px,100%)}
.hero h1{margin-bottom:1.5rem}
.hero .lede{color:#EFE6D8;margin-bottom:2rem}
.hero .eyebrow{color:var(--parchment)}
.split-words .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.06em;margin-bottom:-.06em}
.split-words .w > span{display:inline-block}
.js-anim .split-words .w > span{transform:translateY(105%)}
.scroll-cue{position:absolute;z-index:2;right:var(--gutter);bottom:clamp(3rem,2rem + 4vw,6rem);font:700 .7rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;writing-mode:vertical-rl;color:#CDBFAE;display:flex;gap:1rem;align-items:center}
.scroll-cue::after{content:"";width:1px;height:64px;background:currentColor}
@media (max-width:760px){
  .hero-media img{object-position:var(--pos-sm,50% 60%)}
  .hero::after{background:linear-gradient(0deg,rgba(22,17,15,.94) 0%,rgba(22,17,15,.7) 45%,rgba(22,17,15,.15) 75%,rgba(22,17,15,.35) 100%)}
  .scroll-cue{display:none}
  .hero .actions .btn{flex:1 1 auto}
}

/* proof rail */
.rail{background:var(--licorice);color:var(--icing);border-block:1px solid rgba(242,234,219,.1);overflow:hidden;padding-block:1.2rem}
.rail-track{display:flex;width:max-content;animation:rail 48s linear infinite}
.rail:hover .rail-track,.rail:focus-within .rail-track{animation-play-state:paused}
.rail ul{display:flex;list-style:none;margin:0;padding:0}
.rail li{display:flex;align-items:center;gap:1.1rem;padding-right:1.1rem;font:400 clamp(1.15rem,1rem + .6vw,1.6rem)/1.2 var(--display);white-space:nowrap}
.rail li::after{content:"✦";font-size:.7em;color:var(--rose)}
@keyframes rail{to{transform:translateX(-50%)}}

/* two ways */
.ways-head{display:grid;grid-template-columns:1fr 1fr;gap:2rem 4rem;align-items:end;margin-bottom:clamp(2.5rem,2rem + 3vw,5rem)}
.ways{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(1.5rem,1rem + 3vw,4.5rem);align-items:start}
.way{position:relative}
.way figure{margin:0;overflow:hidden;background:var(--cocoa)}
.way img{width:100%;aspect-ratio:var(--ar,3/2);object-fit:cover}
.way-copy{position:relative;margin:-4.5rem 0 0 clamp(1rem,3vw,3rem);background:var(--icing);padding:clamp(1.4rem,1rem + 1.6vw,2.4rem);max-width:520px;box-shadow:0 24px 60px -30px rgba(22,17,15,.45)}
.way-copy h3{font:400 clamp(1.7rem,1.3rem + 1.4vw,2.6rem)/1.05 var(--display);margin-bottom:.9rem}
.way-copy p{color:#3F3530}
.way:nth-child(2){margin-top:clamp(0rem,8vw,9rem)}
.way:nth-child(2) img{--ar:4/5}
@media (max-width:860px){.ways-head,.ways{grid-template-columns:1fr}.way:nth-child(2){margin-top:0}.way-copy{margin:-3rem .75rem 0}}

/* flavour board */
.board{overflow:hidden}
.board-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:1.5rem;margin-bottom:2.5rem}
.board-track{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter);padding:0 var(--gutter) 1.5rem;scrollbar-width:thin;scrollbar-color:var(--rose) transparent}
.board.is-pinned .board-track{overflow:visible;scroll-snap-type:none;will-change:transform}
.board-intro{flex:0 0 min(420px,78vw);scroll-snap-align:start;display:flex;flex-direction:column;gap:1rem}
.board-intro img{width:100%;aspect-ratio:4/5;object-fit:cover}
.flavour{flex:0 0 clamp(210px,160px + 9vw,300px);scroll-snap-align:start;background:var(--c,var(--vanilla));color:var(--licorice);padding:1.6rem 1.6rem 1.4rem;display:flex;flex-direction:column;justify-content:space-between;min-height:clamp(300px,260px + 8vw,420px)}
.flavour .no{font:700 var(--label)/1 var(--mono);letter-spacing:.14em;text-transform:uppercase}
.flavour .num{font:400 clamp(4.5rem,3rem + 6vw,10rem)/.85 var(--display);letter-spacing:-.04em}
.flavour h3{font:400 clamp(1.45rem,1.2rem + .9vw,2rem)/1.05 var(--display)}
.flavour:nth-child(4n+2){--c:var(--vanilla)}
.flavour:nth-child(4n+3){--c:#E7C9C2}
.flavour:nth-child(4n){--c:var(--parchment)}
.flavour:nth-child(4n+1){--c:#CBD6C6}
.flavour{position:relative;overflow:hidden;isolation:isolate}
.flavour > :not(.fp){position:relative;z-index:2}
.flavour .num{margin-top:auto;padding-top:.5rem}
.fp{position:absolute;z-index:0;margin:0;overflow:hidden;left:1.1rem;right:1.1rem;top:3.2rem;height:46%;background:var(--licorice)}
.fp img{width:100%;height:100%;max-width:none;object-fit:cover;object-position:var(--p,50% 50%);transform:scale(var(--s,1));transform-origin:var(--p,50% 50%);transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.flavour:hover .fp img{transform:scale(calc(var(--s,1) * 1.06))}
.flavour--full{color:var(--icing)}
.flavour--full .fp{inset:0;height:auto}
.flavour--full::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,rgba(22,17,15,.86) 0%,rgba(22,17,15,.25) 50%,rgba(22,17,15,.55) 100%);pointer-events:none}
.flavour--full .num{color:var(--icing)}
.flavour--full .no{color:var(--parchment)}
.board-end{flex:0 0 min(360px,78vw);scroll-snap-align:start;display:flex;flex-direction:column;justify-content:center;gap:1.4rem;padding:1rem}
.board-end h3{font:400 clamp(2rem,1.5rem + 1.5vw,3rem)/1.05 var(--display)}

/* full-bleed media band */
.photoband{position:relative;min-height:clamp(560px,82vh,900px);display:flex;align-items:flex-end;overflow:hidden;color:var(--icing);background:var(--licorice)}
.photoband > .media{position:absolute;inset:-8% 0;margin:0}
.photoband > .media img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,50% 50%)}
.photoband::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(22,17,15,.82),rgba(22,17,15,.15) 55%,rgba(22,17,15,0));pointer-events:none}
.photoband .wrap{position:relative;z-index:2;padding-block:clamp(3rem,2rem + 4vw,6rem)}
.glass{max-width:620px;padding:clamp(1.4rem,1rem + 1.5vw,2.4rem);background:rgba(22,17,15,.5);border:1px solid rgba(242,234,219,.16);backdrop-filter:blur(14px) saturate(1.1);-webkit-backdrop-filter:blur(14px) saturate(1.1)}
.glass h2{margin-bottom:1rem}
.inset{position:absolute;z-index:2;right:var(--gutter);top:clamp(4rem,10vh,8rem);width:clamp(150px,12vw + 60px,300px);margin:0;border:6px solid var(--icing);box-shadow:0 30px 70px -20px rgba(0,0,0,.6);transform:rotate(3deg)}
.inset img{width:100%;aspect-ratio:3/4;object-fit:cover}
@media (max-width:760px){.inset{width:130px;top:calc(var(--header) + 1rem)}}
/* open photoband: copy on a lower-left gradient instead of a glass box, so the photo shows */
.photoband--open::after{background:linear-gradient(0deg,rgba(22,17,15,.9) 0%,rgba(22,17,15,.35) 38%,rgba(22,17,15,0) 62%),linear-gradient(90deg,rgba(22,17,15,.72) 0%,rgba(22,17,15,.2) 34%,rgba(22,17,15,0) 55%)}
.photoband--open .copy{max-width:440px}
.photoband--open .copy h2{margin-bottom:1rem}
.photoband--open .copy p:not(.eyebrow){color:#EFE6D8}

/* gallery */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,.5rem + 2vw,2.5rem);align-items:start}
.gallery figure{margin:0}
.gallery img{width:100%;object-fit:cover}
.gallery figcaption{font:700 var(--label)/1.4 var(--mono);letter-spacing:.1em;text-transform:uppercase;margin-top:.75rem;display:flex;gap:.8rem}
.gallery figcaption span{color:var(--rose)}
.gallery .col{display:flex;flex-direction:column;gap:clamp(1rem,.5rem + 2vw,2.5rem)}
.gallery .col:nth-child(2){margin-top:clamp(2rem,8vw,8rem)}
.gallery .col:nth-child(3){margin-top:clamp(1rem,4vw,4rem)}
.gal-more{border-top:2px solid var(--licorice);padding-top:1.2rem}
.gal-more .mono{font-size:var(--label);letter-spacing:.12em;text-transform:uppercase;color:#8A5A53;margin-bottom:.6rem}
.gal-more p:not(.mono){font:400 clamp(1.4rem,1.1rem + 1vw,2rem)/1.15 var(--display);margin-bottom:1.2rem}
@media (max-width:760px){.gallery{grid-template-columns:1fr 1fr}.gallery .col:nth-child(3){grid-column:1/-1;flex-direction:row}.gallery .col:nth-child(3) figure{flex:1}.gallery .col:nth-child(2){margin-top:3rem}}

/* close */
.close{text-align:left}
.close-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:3rem 5rem;align-items:end}
.close h2{font-size:clamp(2.4rem,1.3rem + 5vw,6rem);line-height:.98}
.facts{list-style:none;margin:0;padding:0;border-top:1px solid rgba(242,234,219,.18)}
.facts li{display:grid;grid-template-columns:7.5rem 1fr;gap:1rem;padding:1rem 0;border-bottom:1px solid rgba(242,234,219,.18)}
.facts li > span:first-child{font:700 var(--label)/1.6 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--rose)}
.facts a{text-decoration:none;border-bottom:1px solid rgba(242,234,219,.35)}
.close-grid > *{min-width:0}
.facts a{overflow-wrap:anywhere}
@media (max-width:860px){.close-grid{grid-template-columns:minmax(0,1fr)}}
@media (max-width:420px){.facts li{grid-template-columns:1fr;gap:.3rem}.hours-list li{flex-wrap:wrap;column-gap:1rem}}
.band--light .facts,.band--light .facts li{border-color:rgba(22,17,15,.16)}
.band--light .facts li > span:first-child{color:#8A5A53}
.band--light .facts a{border-color:rgba(22,17,15,.35)}