/* SCOOP: summer, bold, material. Yellow and red, one giant wordmark, big type. */
:root{--paper:#F6DF79;--ink:#20231F;--red:#C53724;--pist:#B5C39A;--flavor:#B5C39A;--cream:#FBF0B8;--focus:#20231F}
body{font-weight:500;background:var(--paper)}
h1,h2,h3{font-weight:900;line-height:1.02}
.sh{position:sticky;top:0;z-index:50;background:#F6DF79ee;backdrop-filter:blur(8px)}
.sh-in{display:flex;align-items:center;justify-content:space-between;min-height:64px}
.sh nav{display:flex;gap:26px;font-weight:700;font-size:16px}
.sh a{text-decoration:none;padding:12px 2px}
.sh nav a:hover{color:var(--red)}
.sh-cta{background:var(--ink);color:var(--paper);padding:0 18px!important;min-height:44px;display:inline-flex;align-items:center;font-weight:800;font-size:15px}
@media(max-width:560px){.sh nav a:nth-child(3){display:none}}

.s-btn{display:inline-flex;align-items:center;gap:12px;min-height:52px;padding:0 28px;background:var(--red);color:#fff;font-weight:800;font-size:18px;text-decoration:none;border:2px solid var(--red);transition:background .2s,color .2s}
.s-btn:hover{background:var(--ink);border-color:var(--ink)}
.s-btn--ink{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.s-btn--ink:hover{background:var(--red);border-color:var(--red);color:#fff}
.s-btn--ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
.s-btn--ghost:hover{background:var(--ink);color:var(--paper)}
.s-btn:focus-visible{outline-color:var(--ink);outline-offset:4px}

.s-hero{position:relative;padding-top:8px}
.s-word{margin:0;font-family:"Archivo Black","Heebo",sans-serif;font-size:min(24.5vw,340px);line-height:.78;letter-spacing:-.025em;color:var(--red);text-align:center;white-space:nowrap;padding-bottom:.04em}
.s-hero-body{position:relative;min-height:clamp(380px,46vw,640px);display:flex;align-items:center}
.s-hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% 42%;z-index:0}
.s-hero-copy{position:relative;z-index:1;display:grid;gap:20px;justify-items:end;padding-block:32px}
.s-hero-copy>*{max-width:520px}
.s-hero h1{font-size:clamp(50px,5.8vw,92px)}
.s-hero-copy p{font-size:clamp(18px,1.6vw,22px);max-width:26ch;font-weight:500}
@media(max-width:820px){
  .s-word{font-size:24.5vw}
  .s-hero-body{display:block;min-height:0}
  .s-hero-img{position:relative;height:auto;aspect-ratio:4/3;object-position:72% 50%}
  .s-hero-copy{padding:28px 0 40px;justify-items:start}
  .s-hero h1{font-size:clamp(46px,13vw,72px)}
}

.s-marquee{overflow:hidden;background:var(--red);color:#fff;padding:14px 0;border-block:2px solid var(--ink)}
.s-track{display:flex;width:max-content;will-change:transform;font-family:"Archivo Black","Heebo",sans-serif;font-size:clamp(22px,3vw,36px);white-space:nowrap}
.s-track span{padding-inline-end:.8em}

.s-head{display:grid;gap:10px;margin-bottom:28px}
.s-num{font-weight:800;letter-spacing:.14em;font-size:14px}
.s-head h2,.s-combo h2,.s-story h2,.s-contact h2{font-size:clamp(38px,5.4vw,84px)}
.s-flavors{padding:clamp(56px,8vw,112px) 0}
.s-filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:32px}
.s-filters button{min-height:48px;padding:0 22px;border:2px solid var(--ink);background:transparent;font-weight:800;font-size:17px}
.s-filters button:hover{background:#20231f14}
.s-filters button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.s-grid{display:grid;grid-template-columns:5fr 7fr;gap:clamp(24px,4vw,64px);align-items:stretch}
.s-list{display:grid;gap:0;border-top:2px solid var(--ink);align-content:start}
.s-list li{border-bottom:2px solid var(--ink)}
.s-pick{display:flex;align-items:center;gap:18px;width:100%;min-height:76px;padding:12px 6px;background:none;border:0;text-align:start;font-size:clamp(24px,2.6vw,34px);font-weight:900;transition:padding .25s,background .25s}
.s-pick i{width:44px;height:44px;border-radius:50%;background:var(--c);box-shadow:inset -6px -6px 0 #0000001f;flex:none}
.s-pick small{margin-inline-start:auto;font-size:14px;font-weight:700;opacity:.7}
.s-pick:hover{background:#20231f10}
.s-pick[aria-current="true"]{padding-inline-start:20px;background:var(--cream)}
.s-pick .tick{display:none;margin-inline-start:6px;color:var(--red)}
.s-pick[data-in-combo="true"] .tick{display:inline}
.s-empty{grid-column:1/-1;padding:32px;border:2px dashed var(--ink);font-size:20px;font-weight:700}
.s-preview{background:var(--flavor);border:2px solid var(--ink);padding:clamp(24px,3vw,48px);display:grid;gap:16px;justify-items:start;align-content:center;transition:background .3s ease;min-height:380px}
.s-scoop{width:clamp(120px,16vw,200px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 32% 28%,#ffffff66 0 14%,transparent 15%),var(--flavor);filter:saturate(1.25) brightness(.94);box-shadow:inset -14px -16px 0 #00000026,0 14px 0 -4px #20231f33;border:2px solid var(--ink)}
.s-preview h3{font-size:clamp(34px,4.4vw,64px)}
.s-preview p{font-size:20px;max-width:30ch}
@media(max-width:820px){.s-grid{grid-template-columns:1fr}.s-preview{min-height:0}}

.s-combo{background:var(--cream);padding:clamp(56px,8vw,112px) 0;border-block:2px solid var(--ink)}
.s-combo-grid{display:grid;grid-template-columns:5fr 7fr;gap:clamp(24px,4vw,64px);align-items:center}
.s-combo-lead{margin-top:14px;font-size:19px;max-width:30ch}
.s-bowl{display:flex;gap:16px;min-height:120px;align-items:center;margin-bottom:20px}
.s-bowl li{width:clamp(76px,10vw,120px);aspect-ratio:1;border-radius:50%;background:var(--c);border:2px solid var(--ink);box-shadow:inset -10px -10px 0 #00000022;animation:s-pop .3s ease both}
.s-bowl li.empty{background:transparent;border-style:dashed;box-shadow:none;animation:none;opacity:.5}
@keyframes s-pop{from{transform:scale(.7)}to{transform:none}}
.s-summary{font-size:clamp(22px,2.4vw,32px);font-weight:900;min-height:1.4em;margin-bottom:20px}
.s-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.s-copied{font-weight:700}
@media(max-width:820px){.s-combo-grid{grid-template-columns:1fr}}

.s-story{padding:clamp(56px,8vw,112px) 0}
.s-story-grid{display:grid;grid-template-columns:7fr 5fr;gap:clamp(24px,4vw,64px);align-items:end}
.s-story p{font-size:20px;max-width:34ch;margin-bottom:14px}
@media(max-width:820px){.s-story-grid{grid-template-columns:1fr}}

.s-contact{background:var(--ink);color:var(--paper);padding:clamp(56px,8vw,104px) 0}
.s-contact-in{display:grid;grid-template-columns:7fr 5fr;gap:clamp(24px,4vw,64px);align-items:end}
.s-contact h2{color:var(--paper)}
.s-contact p{font-size:20px;margin-bottom:20px;max-width:30ch}
.s-contact .s-btn:focus-visible{outline-color:#fff}
.s-note{font-size:14px!important;opacity:.8;margin:18px 0 0!important}
@media(max-width:820px){.s-contact-in{grid-template-columns:1fr}}
.credit{background:var(--ink);color:var(--paper);border-top:1px solid #ffffff22}
.credit a{color:var(--paper)}