/* GOOD CHIPS — story
   Ported from the supplied static build. Colors and type sizes resolve from
   global theme settings via the --gc-* custom properties emitted by
   components/theme-css-var.html. */

.story { position:relative; width:100%; }
.stage {
  position:relative;
  width:100%;
  height:100vh;
  height:100lvh;
  height:var(--stage-h,100lvh);
  min-height:560px;
  overflow:hidden;
  isolation:isolate;
  background:var(--gc-cream);
}
.panel { position:absolute; inset:0; width:100%; height:100%; overflow:hidden; }
.scene-env { z-index:1; opacity:0; visibility:hidden; display:none; }
.scene-art { z-index:2; pointer-events:none; }
.scene-copy { z-index:4; opacity:0; visibility:hidden; }
.hero { z-index:10; background:var(--gc-cream); }
.hero { contain:paint; }
.hero-bag-scroll { backface-visibility:hidden; -webkit-backface-visibility:hidden; }
.scene1-env,
.scene2-env,
.scene3-env,
.flavors,
.product-showcase { background-clip:padding-box; }
.scene1-env { z-index:20; background:var(--gc-teal); opacity:0; visibility:hidden; }
.scene1-art { z-index:21; }
.scene2-env { z-index:30; background:var(--gc-charcoal); opacity:0; visibility:hidden; }
.scene2-art { z-index:31; }
.scene3-env {
  z-index:40;
  background:
    radial-gradient(circle at 50% 45%, #f7e5cf 0%, #ead1b2 48%, #d7b692 100%);
  opacity:0;
  visibility:hidden;
}
.scene3-art { z-index:41; }
.flavors { z-index:50; background:var(--gc-cream); opacity:0; visibility:hidden; }
.product-showcase { z-index:60; opacity:0; visibility:hidden; }
.scene1-art picture,
.scene2-art picture,
.scene3-art picture {
  display: none;
}
.scene1-art picture.s1-mid,
.scene1-art picture.s1-chip,
.scene1-art picture.s1-front,
.scene2-art picture.s2-visual,
.scene3-art picture.s3-visual {
  display: block;
}
.scene1-art picture.s1-mid,
.scene1-art picture.s1-chip,
.scene1-art picture.s1-front,
.scene2-visual-local,
.scene3-visual-local {
  opacity:0;
  visibility:hidden;
}
.scene2-env > picture,
.scene2-art > picture.s2-visual,
.scene3-art > picture.s3-visual { display:none !important; }
.scene2-visual-local,
.scene3-visual-local {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  background-position:center;
  background-repeat:no-repeat;
  background-size:cover;
  will-change:transform,opacity,filter;
}
.scene2-visual-local {
  background-image:
    var(--gc-layer-bg-d),
    var(--gc-layer-bg-d),
    var(--gc-layer-bg-d),
    var(--gc-layer-bg-d);
}
.scene3-visual-local {
  background-image:var(--gc-layer-bg-d);
  background-position:center bottom;
}
@media (max-aspect-ratio:9/10) {
.hero-bag-replacement {
    inset:auto -4% 0 auto;
    width:96%;
    height:50%;
    object-fit:contain;
    object-position:right bottom;
    transform:translate(10%,24%) scale(.84);
    transform-origin:right bottom;
  }
.scene2-visual-local {
    background-image:
      var(--gc-layer-bg-m, var(--gc-layer-bg-d)),
      var(--gc-layer-bg-m, var(--gc-layer-bg-d));
  }
.scene3-visual-local {
    background-image:var(--gc-layer-bg-m, var(--gc-layer-bg-d));
  }
}
.asset-layer {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  min-height:100%;
  display:block;
  content-visibility: auto;
}
.asset-layer > img {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
}
.asset-layer.bottom-safe > img { object-position:center bottom; }
.hero-bg { z-index:0; }
.hero-bag-scroll { position:absolute; inset:0; z-index:2; backface-visibility:hidden; -webkit-backface-visibility:hidden; transform:translateZ(0); }
body.hero-intro-active .hero-bag-scroll { will-change:transform,opacity,filter; }
.scene-env,
.scene-art { backface-visibility:hidden; transform:translateZ(0); }
.hero-bag-load { position:absolute; inset:0; }
.hero-bag-load > picture { display:none; }
.hero-bag-load > picture.hero-bag-responsive { display:block; position:absolute; inset:0; }
.hero-bag-replacement {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
.hero-wash {
  position:absolute; inset:0; z-index:3; pointer-events:none;
  background:linear-gradient(90deg,rgba(250,246,237,.08),rgba(250,246,237,0) 58%);
}
.hero-header-scroll { position:absolute; inset:0 0 auto 0; z-index:8; will-change:transform,opacity; }
.hero-header {
  width:min(92vw,1680px);
  height:clamp(78px,9dvh,112px);
  margin:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.brand-home { display:block; width:clamp(150px,11vw,210px); }
.brand { display:block; width:100%; height:auto; }
.hero-header > img.brand { display:none; }
.pre,
.primary {
  font-family:var(--gc-sans);
  font-weight:600;
  text-decoration:none;
  border-radius:999px;
}
.pre { background:#191919; color:#fff; padding:13px 25px; font-size:calc((clamp(14px,1vw,17px)) * var(--gc-type-scale, 1)); }
.hero-copy {
  position:absolute;
  z-index:7;
  left:calc((100vw - min(92vw,1680px)) / 2);
  top:51%;
  width:min(46vw,760px);
  transform:translateY(-50%);
}
.hero-title-scroll,
.hero-support-scroll,
.hero-actions-scroll { will-change:transform,opacity; }
.hero-eyebrow {
  margin:0 0 clamp(14px,2dvh,22px);
  font:400 calc((clamp(18px,1.28vw,22px)) * var(--gc-type-scale, 1))/1 var(--gc-sans);
  letter-spacing:.22em;
  text-transform:uppercase;
}
.hero-title {
  margin:0;
  line-height:.90;
  letter-spacing:-.055em;
  font-weight:700;
  font-size:calc((clamp(72px,min(7.7vw,13.5dvh),156px)) * var(--gc-type-scale, 1));
}
.hero-benefits {
  display:flex;
  flex-wrap:wrap;
  gap:10px 18px;
  margin:0 0 clamp(22px,3dvh,32px);
  padding:0;
  list-style:none;
  font:600 calc((clamp(11px,.78vw,14px)) * var(--gc-type-scale, 1))/1.2 var(--gc-sans);
  letter-spacing:.04em;
}
.hero-benefits li { display:flex; align-items:center; gap:7px; }
.hero-benefits li:before {
  content:"✓";
  display:grid;
  place-items:center;
  width:18px;
  height:18px;
  border:1px solid currentColor;
  border-radius:50%;
  font-size:calc((10px) * var(--gc-type-scale, 1));
}
.hero-title .soft {
  display:block;
  font-style:italic;
  color:#494949;
  font-size:calc((.63em) * var(--gc-type-scale, 1));
  line-height:.92;
  letter-spacing:-.035em;
}
.hero-title .good { display:block; font-style:normal; color:#171717; font-size:calc((1em) * var(--gc-type-scale, 1)); }
.support {
  font-size:calc((clamp(17px,min(1.25vw,2.7dvh),24px)) * var(--gc-type-scale, 1));
  line-height:1.28;
  max-width:610px;
  margin:clamp(20px,3dvh,30px) 0 clamp(22px,3.3dvh,34px);
}
.actions {
  display:flex;
  align-items:center;
  gap:clamp(15px,1.6vw,26px);
  flex-wrap:wrap;
}
.primary { position:relative; overflow:hidden; background:var(--gc-teal); color:#fff; padding:15px 28px; font-size:calc((clamp(15px,1.05vw,19px)) * var(--gc-type-scale, 1)); box-shadow:0 12px 28px rgba(var(--gc-teal-rgb),.18); transition:transform .25s ease,box-shadow .25s ease,background .25s ease; }
.primary:hover { transform:translateY(-2px); background:#0b607a; box-shadow:0 16px 34px rgba(var(--gc-teal-rgb),.24); }
.primary:active { transform:translateY(0) scale(.97); }
.secondary {
  display:inline-block;
  padding:12px 0;
  font-family:var(--gc-sans);
  font-size:calc((clamp(12px,0.9vw,16px)) * var(--gc-type-scale, 1));
  font-weight:500;
  text-underline-offset:7px;
}
body:not(.is-ready) .hero-header-scroll,
body:not(.is-ready) .hero-eyebrow,
body:not(.is-ready) .hero-title-scroll,
body:not(.is-ready) .hero-support-scroll,
body:not(.is-ready) .hero-actions-scroll,
body:not(.is-ready) .hero-bag-scroll { opacity:0; }
.copy-block { position:absolute; opacity:0; visibility:hidden; will-change:transform,opacity; }
.eyebrow {
  font-family:var(--gc-sans);
  text-transform:uppercase;
  letter-spacing:.22em;
  font-size:calc((clamp(22px,1.64vw,26px)) * var(--gc-type-scale, 1));
  font-weight:400;
  margin-bottom:11px;
}
.scene-title {
  margin:0;
  font-size:calc((clamp(54px,min(6.8vw,12dvh),122px)) * var(--gc-type-scale, 1));
  line-height:.88;
  letter-spacing:-.04em;
  font-style:italic;
  font-weight:700;
}
.scene1-copy {
  left:max(5vw,48px);
  bottom:35dvh;
  width:min(52vw,880px);
  color:#f3ead8;
}
.scene2-copy {
  right:max(9vw,88px);
  top:49%;
  width:min(45vw,760px);
  /* The scroll timeline owns this block's transform, so its centring is
     declared as an offset the timeline folds into every tween rather than as a
     transform GSAP would overwrite. */
  --gc-copy-y:-50;
  text-align:right;
  color:#f4ecdd;
}
.scene3-copy {
  left:50%;
  top:max(44px,7%);
  width:min(70vw,700px);
  --gc-copy-x:-50;
  text-align:center;
  color:#24211d;
}
.scene3-copy .scene-title { font-size:calc((clamp(56px,min(6.3vw,11dvh),114px)) * var(--gc-type-scale, 1)); }
.nature-line { display:inline; }
@media (min-aspect-ratio:16/9) {
.scene3-copy { top:max(40px,5.5%); width:min(86vw,1100px); }
.scene3-copy .scene-title { white-space:nowrap; }
.scene3-copy .scene-title {
    font-size:calc((clamp(52px,min(5.2vw,8.6dvh),94px)) * var(--gc-type-scale, 1));
  }
}
@media (min-aspect-ratio:19/10) {
.scene3-copy { top:max(36px,4.5%); }
.scene3-copy .scene-title {
    font-size:calc((clamp(48px,min(4.6vw,7.8dvh),84px)) * var(--gc-type-scale, 1));
  }
}
.flavors {
  display:grid;
  place-items:center;
  padding:clamp(56px,8dvh,96px) clamp(36px,6vw,112px);
  text-align:center;
  font-family:var(--gc-product-serif);
}
.flavors-inner {
  opacity:0;
  transform:translateY(24px);
  will-change:transform,opacity;
  width:min(94vw,1760px);
}
.lineup-eyebrow {
  margin:0 0 clamp(18px,2.4dvh,28px);
  font:300 calc((clamp(30px,2.35vw,42px)) * var(--gc-type-scale, 1))/1 var(--gc-product-serif);
  letter-spacing:.18em;
  text-transform:uppercase;
}
.lineup-title {
  margin:0 auto;
  max-width:1680px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:clamp(20px,3dvh,34px);
  font:italic 600 calc((clamp(82px,min(9.3vw,15dvh),178px)) * var(--gc-type-scale, 1))/.84 var(--gc-product-serif);
  letter-spacing:-.052em;
  text-wrap:balance;
}
.lineup-lead,
.lineup-flavor-line { display:block; }
.lineup-good {
  display:inline-flex;
  gap:.015em;
  padding:0 .04em;
  font-family:var(--gc-display);
  font-style:normal;
  font-weight:900;
  letter-spacing:-.09em;
}
.lineup-good > span[aria-hidden] { display:inline-flex; gap:inherit; }
.lineup-good > span[aria-hidden] span:nth-child(1) { color:var(--gc-teal); }
.lineup-good > span[aria-hidden] span:nth-child(2) { color:var(--gc-korean); }
.lineup-good > span[aria-hidden] span:nth-child(3) { color:var(--gc-cheddar); }
.lineup-good > span[aria-hidden] span:nth-child(4) { color:#c0371a; }
.lineup-scroll {
  position:absolute;
  left:50%;
  bottom:clamp(22px,4dvh,42px);
  transform:translateX(-50%);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  margin:0;
  font:400 calc((clamp(9px,.62vw,11px)) * var(--gc-type-scale, 1))/1 var(--gc-product-serif);
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(var(--gc-ink-rgb),.62);
}
.lineup-scroll:after {
  content:"";
  width:1px;
  height:clamp(20px,3dvh,30px);
  background:linear-gradient(var(--gc-ink),transparent);
}
.product-showcase {
  background:var(--gc-cream);
  font-family:var(--gc-product-serif);
}
.product-composition {
  position:absolute;
  left:50%;
  top:50%;
  width:max(100vw,160dvh);
  aspect-ratio:8 / 5;
  transform:translate(-50%,-50%);
  overflow:hidden;
  isolation:isolate;
}
.product-composition-layer {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:fill;
  pointer-events:none;
  user-select:none;
}
.product-composition-layer > img {
  display:block;
  width:100%;
  height:100%;
  object-fit:fill;
}
.product-bg-layer { z-index:1; opacity:0; }
.product-default-layer { z-index:2; opacity:0; }
.product-hover-layer {
  z-index:3;
  opacity:0;
  transition:opacity 320ms cubic-bezier(.22,.61,.36,1);
}
.product-composition.has-hover .product-hover-layer { opacity:1; }
.product-composition { transition:filter 360ms ease; }
.product-composition.has-hover { filter:contrast(1.015) saturate(1.02); }
@media (hover:hover) and (pointer:fine) {
.product-composition { filter:grayscale(1); }
.product-composition.has-hover { filter:grayscale(0) contrast(1.015) saturate(1.02); }
}
.product-showcase.is-showcase-ready .product-bg-layer,
.product-showcase.is-showcase-ready .product-default-layer { opacity:1!important; visibility:visible!important; }
.product-showcase.is-showcase-ready .product-instruction { opacity:1!important; visibility:visible!important; }
.product-hit-surface {
  position:absolute;
  inset:0;
  z-index:5;
  cursor:default;
}
.product-hit-surface.has-flavor { cursor:pointer; }
.product-a11y-trigger {
  position:absolute;
  z-index:6;
  border:0;
  padding:0;
  opacity:0;
  background:transparent;
  pointer-events:auto;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  -webkit-touch-callout:none;
  user-select:none;
  touch-action:manipulation;
}
.product-composition,
.product-instruction { -webkit-tap-highlight-color:transparent; -webkit-touch-callout:none; user-select:none; }
.product-a11y-trigger:focus-visible {
  opacity:1;
  outline:3px solid rgba(var(--gc-ink-rgb),.8);
  outline-offset:7px;
  border-radius:16px;
}
.product-instruction {
  position:absolute;
  z-index:20;
  left:0;
  right:0;
  top:clamp(88px,11dvh,118px);
  width:max-content;
  max-width:calc(100% - 32px);
  margin:0 auto;
  padding:9px 14px;
  border:1px solid rgba(var(--gc-ink-rgb),.18);
  background:rgba(250,246,237,.74);
  backdrop-filter:blur(8px);
  font:500 calc((clamp(10px,.68vw,12px)) * var(--gc-type-scale, 1))/1 var(--gc-sans);
  letter-spacing:.12em;
  text-transform:uppercase;
  white-space:nowrap;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}
.product-instruction-mobile { display:none; }
.post-story-header {
  position:fixed;
  z-index:900;
  top:0;
  left:0;
  width:100%;
  height:clamp(72px,8dvh,94px);
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 max(4vw,28px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:transform 280ms cubic-bezier(.22,.61,.36,1);
}
.post-story-header.is-scroll-hidden { transform:translateY(-110%) !important; }
.post-story-logo {
  display:block;
  pointer-events:auto;
  width:clamp(150px,11vw,210px);
  text-decoration:none;
}
.post-story-logo img { display:block; width:100%; height:auto; }
.post-story-preorder {
  pointer-events:auto;
  text-decoration:none;
  border-radius:999px;
  background:var(--gc-ink);
  color:#fff;
  padding:12px 23px;
  font:600 calc((clamp(12px,.9vw,15px)) * var(--gc-type-scale, 1))/1 var(--gc-sans);
}

/* Cart entry — sits beside the pre-order button in both the hero header and
   the sticky one. The sticky header sets pointer-events:none on itself, so
   every interactive child has to claim them back. */
.post-story-actions,
.hero-header-actions {
  display:flex;
  align-items:center;
  gap:clamp(10px,1vw,16px);
}
.gc-header-cart {
  position:relative;
  pointer-events:auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:clamp(42px,3.2vw,50px);
  height:clamp(42px,3.2vw,50px);
  padding:0;
  border:1px solid rgba(25,25,25,.16);
  border-radius:999px;
  background:rgba(255,255,255,.72);
  color:var(--gc-ink,#191919);
  cursor:pointer;
  -webkit-appearance:none;
  appearance:none;
  transition:transform .28s ease, box-shadow .28s ease, background .28s ease;
}
.gc-header-cart svg { display:block; width:60%; height:auto; }
.gc-header-cart-art { display:block; width:56%; height:auto; object-fit:contain; }
.gc-header-cart-count {
  position:absolute;
  top:-4px;
  inset-inline-end:-4px;
  min-width:19px;
  height:19px;
  padding:0 5px;
  border-radius:999px;
  background:var(--gc-ink,#191919);
  color:#fff;
  font:700 calc((11px) * var(--gc-type-scale, 1))/19px var(--gc-sans);
  text-align:center;
}
.gc-header-cart-count[hidden] { display:none; }
@media (hover:hover) and (pointer:fine) {
.gc-header-cart:hover {
    transform:translateY(-2px);
    background:#fff;
    box-shadow:0 15px 34px rgba(58,43,24,.16);
  }
}
.gc-header-cart:focus-visible { outline:2px solid var(--gc-ink,#191919); outline-offset:3px; }
.quick-view {
  position:fixed;
  inset:0;
  z-index:1000;
  display:grid;
  place-items:center;
  padding:clamp(24px,4vw,68px);
  opacity:0;
  visibility:hidden;
  transition:opacity 260ms ease,visibility 260ms;
  font-family:var(--gc-product-serif);
}
.quick-view.is-open { opacity:1; visibility:visible; }
.quick-view:not(.is-open),
.quick-view:not(.is-open) * { pointer-events:none !important; }
.quick-view-backdrop {
  position:absolute;
  inset:0;
  background:rgba(20,18,15,.20);
  backdrop-filter:blur(7px) saturate(.88);
}
.quick-view-dialog {
  position:relative;
  width:min(91vw,1480px);
  max-height:min(88dvh,940px);
  display:grid;
  grid-template-columns:minmax(420px,1fr) minmax(480px,1fr);
  overflow:auto;
  border:1px solid rgba(255,255,255,.72);
  border-radius:30px;
  background:linear-gradient(135deg,rgba(255,255,255,.58),rgba(244,237,222,.42));
  box-shadow:0 36px 110px rgba(22,18,12,.24),inset 0 1px 0 rgba(255,255,255,.82);
  backdrop-filter:blur(26px) saturate(1.16);
  transform:translateY(18px) scale(.985);
  transition:transform 300ms cubic-bezier(.22,.61,.36,1);
}
.quick-view.is-open .quick-view-dialog { transform:none; }
.quick-view.is-opening .quick-view-frame img,
.quick-view.is-opening .quick-view-title,
.quick-view.is-opening .quick-view-description,
.quick-view.is-opening .quick-view-facts,
.quick-view.is-opening .quick-view-purchase-row,
.quick-view.is-opening .quick-view-actions { will-change:transform,opacity; }
.quick-view-close {
  position:absolute;
  top:20px;
  right:22px;
  z-index:3;
  width:44px;
  height:44px;
  border:1px solid rgba(var(--gc-ink-rgb),.22);
  border-radius:50%;
  background:rgba(255,255,255,.46);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.82),0 8px 25px rgba(var(--gc-ink-rgb),.08);
  backdrop-filter:blur(14px);
  color:var(--gc-ink);
  cursor:pointer;
  font:400 calc((28px) * var(--gc-type-scale, 1))/1 var(--gc-product-serif);
}
.quick-view-media {
  min-height:600px;
  padding:clamp(14px,1.3vw,24px);
  display:grid;
  place-items:center;
  background:linear-gradient(145deg,rgba(255,255,255,.34),rgba(224,209,182,.18));
  border-right:1px solid rgba(255,255,255,.48);
}
.quick-view-frame {
  width:min(100%,640px);
  aspect-ratio:1 / 1;
  padding:14px;
  border-radius:22px;
  background:rgba(255,255,255,.34);
  border:1px solid rgba(255,255,255,.70);
  box-shadow:0 24px 65px rgba(77,55,24,.15),inset 0 1px 0 rgba(255,255,255,.88);
  backdrop-filter:blur(16px);
}
.quick-view-frame img { width:100%; height:100%; object-fit:cover; border-radius:14px; }
.quick-view-info {
  padding:clamp(34px,3.4vw,54px) clamp(40px,4.2vw,72px) clamp(30px,3.2vw,48px);
  align-self:center;
  margin:clamp(22px,2.4vw,38px);
  border:1px solid rgba(255,255,255,.46);
  border-radius:24px;
  background:rgba(255,255,255,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.62);
  backdrop-filter:blur(12px);
}
.quick-view-kicker {
  margin:0 0 16px;
  font-size:calc((clamp(18px,1.25vw,23px)) * var(--gc-type-scale, 1));
  font-weight:400;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.quick-view-title {
  margin:0;
  font:900 calc((clamp(48px,4.4vw,76px)) * var(--gc-type-scale, 1))/.88 var(--gc-display);
  letter-spacing:-.055em;
  color:var(--flavor-color,var(--gc-ink));
}
.quick-view-size {
  display:inline-flex;
  align-items:center;
  gap:6px;
  width:max-content;
  margin:12px 0 0;
  padding:7px 11px;
  border:1px solid rgba(var(--gc-ink-rgb),.16);
  border-radius:999px;
  background:rgba(255,255,255,.58);
  color:var(--flavor-color,var(--gc-ink));
  font:800 calc((11px) * var(--gc-type-scale, 1))/1 var(--gc-sans);
  letter-spacing:.13em;
  text-transform:uppercase;
}
.quick-view-size span { color:rgba(var(--gc-ink-rgb),.58); font-weight:700; letter-spacing:.05em; text-transform:none; }
.quick-view-description {
  margin:14px 0 18px;
  font:italic 600 calc((clamp(22px,1.65vw,30px)) * var(--gc-type-scale, 1))/1.18 var(--gc-product-serif);
}
.quick-view-facts {
  margin:0 0 20px;
  padding:0;
  list-style:none;
  display:grid;
  gap:8px;
  font-size:calc((18px) * var(--gc-type-scale, 1));
  line-height:1.35;
}
.quick-view-ingredients { color:rgba(var(--gc-ink-rgb),.74); }
.quick-view-purchase-row {
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:24px;
  margin:30px 0 22px;
}
.quick-view-plans { display:grid; grid-template-columns:1.15fr 1fr; gap:12px; align-items:stretch; }
.quick-view-plan { position:relative; display:flex; flex-direction:column; gap:3px; padding:16px 16px 13px; border:1.5px solid rgba(var(--gc-ink-rgb),.24); border-radius:14px; background:rgba(255,255,255,.44); text-align:left; cursor:pointer; transition:border-color .2s ease, background .2s ease, box-shadow .2s ease, transform .2s ease; }
.quick-view-plan[aria-checked="true"] { border-color:var(--gc-cheddar); background:#fff; box-shadow:0 10px 26px rgba(var(--gc-cheddar-rgb),.2); }
.quick-view-plan.is-best[aria-checked="true"] { transform:translateY(-2px); }
.qv-plan-tag { position:absolute; top:-11px; left:14px; padding:4px 10px 3px; border-radius:999px; background:var(--gc-cheddar); color:#fff; font:700 calc((10px) * var(--gc-type-scale, 1))/1 var(--gc-sans); letter-spacing:.12em; text-transform:uppercase; }
.qv-plan-name { font:700 calc((13px) * var(--gc-type-scale, 1))/1.2 var(--gc-sans); letter-spacing:.06em; text-transform:uppercase; color:var(--gc-ink); }
.qv-plan-price { font:700 calc((clamp(24px,2vw,32px)) * var(--gc-type-scale, 1))/1 var(--gc-display); color:var(--gc-ink); }
.qv-plan-per { font:400 calc((13.5px) * var(--gc-type-scale, 1))/1.3 var(--gc-product-serif); color:rgba(var(--gc-ink-rgb),.62); }
.qv-plan-ship { display:inline-flex; align-items:center; justify-content:center; gap:7px; width:max-content; max-width:100%; padding:7px 11px; border:1px solid rgba(var(--gc-teal-rgb),.34); border-radius:999px; background:#e1e7dc; background-clip:border-box; box-shadow:none; font:700 calc((10.5px) * var(--gc-type-scale, 1))/1 var(--gc-sans); letter-spacing:.1em; text-transform:uppercase; color:var(--gc-teal); }
.qv-plan-ship::before { content:"✓"; font-size:1.05em; line-height:1; }
.qv-plan-price { display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
.qv-plan-subprice { font:600 calc((12.5px) * var(--gc-type-scale, 1))/1 var(--gc-sans); font-style:normal; letter-spacing:.02em; color:var(--gc-teal); white-space:nowrap; }
.quick-view-plan.is-best .qv-plan-price { color:#9a6c0f; }
.qv-sub-note { margin:10px 0 0; font:italic 500 calc((13.5px) * var(--gc-type-scale, 1))/1.3 var(--gc-product-serif); color:rgba(var(--gc-ink-rgb),.6); }
@media (min-aspect-ratio:9/10) and (max-height:760px) {
.quick-view-dialog { max-height:calc(100dvh - 24px); }
.quick-view-media { min-height:0; }
.quick-view-info { padding:22px 34px 22px; margin:16px; }
.quick-view-kicker { margin-bottom:6px; font-size:calc((13px) * var(--gc-type-scale, 1)); }
.quick-view-title { font-size:calc((clamp(38px,4.6dvh,56px)) * var(--gc-type-scale, 1)); }
.quick-view-description { margin:8px 0 12px; font-size:calc((18px) * var(--gc-type-scale, 1)); }
.quick-view-facts { margin-bottom:14px; gap:4px; font-size:calc((13.5px) * var(--gc-type-scale, 1)); }
.quick-view-plan { padding:12px 12px 10px; }
.qv-plan-price { font-size:calc((22px) * var(--gc-type-scale, 1)); }
.qv-sub-note { margin-top:8px; font-size:calc((12.5px) * var(--gc-type-scale, 1)); }
.quick-view-actions { margin-top:12px; gap:8px; }
.quick-view-action { min-height:46px; }
}
.quantity-control {
  display:grid;
  grid-template-columns:42px 48px 42px;
  align-items:center;
  border:1px solid rgba(var(--gc-ink-rgb),.24);
  border-radius:12px;
  background:rgba(255,255,255,.24);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72);
  backdrop-filter:blur(10px);
  min-height:44px;
}
.quantity-control button {
  height:42px;
  border:0;
  background:transparent;
  cursor:pointer;
  font-size:calc((24px) * var(--gc-type-scale, 1));
}
.quantity-control output { text-align:center; font-size:calc((18px) * var(--gc-type-scale, 1)); }
/* Shown in place of the pack options when a flavour block has no product
   attached, so the panel states the gap instead of showing an authored price
   the store would not charge. */
.quick-view-unlinked {
  margin: 18px 0 0;
  padding: 14px 16px;
  border: 1px dashed rgba(var(--flavor-rgb, 14, 110, 139), 0.4);
  border-radius: 10px;
  color: var(--gc-muted, #6b6b6b);
  font-size: calc(13.5px * var(--gc-type-scale, 1));
  line-height: 1.5;
}

.quick-view-actions { display:grid; gap:10px; margin-top:16px; }
.quick-view-action {
  min-height:54px;
  border:1px solid var(--gc-ink);
  cursor:pointer;
  font:600 calc((16px) * var(--gc-type-scale, 1))/1 var(--gc-product-serif);
  letter-spacing:.08em;
  text-transform:uppercase;
  border-radius:12px;
  backdrop-filter:blur(12px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22);
}
.quick-view-buy { background:rgba(20,20,20,.88); color:#fff; }
.quick-view-cart { background:rgba(255,255,255,.20); color:var(--gc-ink); }
.quick-view-status { min-height:18px; margin:4px 0 0; font:500 calc((13px) * var(--gc-type-scale, 1))/1.4 var(--gc-sans); color:rgba(var(--gc-ink-rgb),.7); }
.quick-view-build {
  justify-self:start;
  padding:9px 0;
  border:0;
  background:transparent;
  text-transform:none;
  text-decoration:underline;
  text-underline-offset:6px;
}
body.quick-view-open { overflow:hidden; }
body.quick-view-open { overscroll-behavior:none; }
.quick-view { overscroll-behavior:none; touch-action:none; }
.quick-view-dialog {
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-y;
}
body.quick-view-open .product-showcase { filter:blur(3px) brightness(.88); transform:scale(.997); }
.primary,
.pre,
.quick-view-action {
  position:relative;
  overflow:hidden;
  isolation:isolate;
}
.primary::before,
.pre::before,
.quick-view-action::before {
  content:"";
  position:absolute;
  z-index:0;
  inset:-45% auto -45% -42%;
  width:32%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.42),transparent);
  transform:translateX(-180%) skewX(-16deg);
  transition:transform .7s cubic-bezier(.2,.7,.2,1);
  pointer-events:none;
}
.primary,
.quick-view-buy { gap:12px; }
.primary::after,
.quick-view-buy::after {
  content:"→";
  display:inline-block;
  font-size:calc((1.18em) * var(--gc-type-scale, 1));
  line-height:.8;
  transition:transform .28s ease;
}
@media (hover:hover) and (pointer:fine) {
.primary:hover::before,
.pre:hover::before,
.quick-view-action:hover::before { transform:translateX(590%) skewX(-16deg); }
.primary:hover::after,
.quick-view-buy:hover::after { transform:translateX(5px); }
.pre:hover,
.quick-view-action:hover { transform:translateY(-2px); box-shadow:0 15px 34px rgba(58,43,24,.16),0 0 0 1px rgba(255,255,255,.32) inset; }
.quantity-control button:hover { color:var(--gc-teal); background:rgba(var(--gc-teal-rgb),.09); }
}
@media (min-aspect-ratio:9/10) {
.scene2-copy {
    right:max(12vw,110px);
    width:min(48vw,820px);
  }
.scene2-copy .scene-title {
    font-size:calc((clamp(68px,min(7.8vw,13dvh),142px)) * var(--gc-type-scale, 1));
  }
}
@media (min-aspect-ratio:9/10) and (max-height:760px) {
.stage { min-height:480px; }
.hero-header { height:76px; }
.hero-copy { top:53%; width:min(48vw,680px); }
.hero-title { font-size:calc((clamp(54px,min(6.4vw,12dvh),92px)) * var(--gc-type-scale, 1)); }
.support { font-size:calc((16px) * var(--gc-type-scale, 1)); margin:16px 0 20px; }
.scene-title { font-size:calc((clamp(48px,min(6vw,11dvh),82px)) * var(--gc-type-scale, 1)); }
.scene2-copy .scene-title { font-size:calc((clamp(58px,min(7vw,12.5dvh),96px)) * var(--gc-type-scale, 1)); }
.scene1-copy { bottom:18dvh; }
}
@media (max-aspect-ratio:9/10) {
.story,
.stage,
.panel { width:100vw; min-width:100vw; max-width:none; }
.post-story-header {
    height:64px;
    padding:0 20px;
    border-bottom:1px solid rgba(255,255,255,.62);
    background:linear-gradient(135deg,rgba(250,246,237,.78),rgba(244,235,216,.62));
    box-shadow:0 10px 28px rgba(58,43,24,.10),inset 0 1px 0 rgba(255,255,255,.9);
    backdrop-filter:blur(16px) saturate(120%);
    -webkit-backdrop-filter:blur(16px) saturate(120%);
  }
.stage {
    min-height:620px;
    height:100vh;
    height:100lvh;
    height:var(--stage-h,100lvh);
  }
.hero {
    background:var(--gc-cream);
  }
.hero-bg { display:none; }
.hero-wash {
    background:linear-gradient(180deg,rgba(247,240,225,.20),rgba(247,240,225,0) 48%);
  }
.hero-bag-load > picture.hero-bag-responsive { display:block; position:absolute; inset:0; width:100%; height:100%; }
.hero-bag-replacement {
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    transform:none;
  }
.hero-header {
    width:calc(100% - clamp(34px,9vw,54px));
    height:clamp(70px,8.5dvh,86px);
  }
.brand { width:clamp(132px,36vw,158px); }
.pre { padding:10px 16px; font-size:calc((14px) * var(--gc-type-scale, 1)); }
.post-story-logo { width:clamp(132px,36vw,150px); }
.post-story-preorder { padding:10px 18px; font-size:calc((13px) * var(--gc-type-scale, 1)); }
.post-story-actions,
.hero-header-actions { gap:10px; }
.gc-header-cart { width:40px; height:40px; }
.hero-copy {
    left:clamp(24px,7vw,34px);
    top:clamp(112px,13.5dvh,142px);
    width:calc(100% - clamp(48px,14vw,68px));
    transform:none;
  }
.hero-title {
    font-size:calc((clamp(62px,min(17.2vw,9.2dvh),86px)) * var(--gc-type-scale, 1));
    line-height:.92;
    letter-spacing:-.06em;
  }
.hero-eyebrow { margin-bottom:20px; font-size:calc((11.5px) * var(--gc-type-scale, 1)); line-height:1.25; font-weight:600; letter-spacing:.24em; color:rgba(var(--gc-ink-rgb),.82); }
.hero-title .soft { font-size:calc((.60em) * var(--gc-type-scale, 1)); line-height:1.06; }
.hero-title .good { margin:.035em 0 .06em; font-family:var(--gc-display); font-size:calc((1.06em) * var(--gc-type-scale, 1)); font-weight:900; line-height:.88; }
.support {
    font-size:calc((clamp(15px,min(4vw,2.1dvh),17px)) * var(--gc-type-scale, 1));
    line-height:1.24;
    max-width:350px;
    margin:27px 0 23px;
  }
.hero-benefits { max-width:360px; gap:8px 12px; margin-bottom:18px; font-size:calc((9px) * var(--gc-type-scale, 1)); }
.hero-benefits li:before { width:16px; height:16px; font-size:calc((9px) * var(--gc-type-scale, 1)); }
.actions { flex-direction:row; flex-wrap:nowrap; align-items:center; gap:18px; white-space:nowrap; }
.primary { font-size:calc((12px) * var(--gc-type-scale, 1)); padding:11px 15px; }
.secondary { font-size:calc((11px) * var(--gc-type-scale, 1)); }
.eyebrow { font-size:calc((12px) * var(--gc-type-scale, 1)); letter-spacing:.20em; margin-bottom:10px; }
.scene-title { font-size:calc((clamp(48px,min(13.5vw,8.2dvh),74px)) * var(--gc-type-scale, 1)); line-height:.87; }
.scene1-copy {
    left:clamp(22px,6vw,34px);
    right:clamp(26px,7vw,44px);
    top:clamp(112px,16dvh,175px);
    bottom:auto;
    width:auto;
    max-width:390px;
  }
.scene2-copy {
    left:auto;
    right:clamp(20px,5vw,32px);
    top:clamp(84px,10.5dvh,120px);
    width:min(84vw,360px);
    --gc-copy-y:0;
    text-align:right;
  }
.scene2-copy .eyebrow {
    margin-bottom:clamp(10px,1.5dvh,15px);
    font-size:calc((clamp(11px,3vw,13px)) * var(--gc-type-scale, 1));
    letter-spacing:.22em;
  }
.scene2-copy .scene-title {
    font-size:calc((clamp(54px,min(15.2vw,8.4svh),76px)) * var(--gc-type-scale, 1));
    line-height:.84;
    letter-spacing:-.055em;
  }
.nature-line { display:block; }
.scene3-copy {
    top:20%;
    width:calc(100% - 48px);
  }
.scene3-copy .scene-title {
    font-size:calc((clamp(49px,min(13vw,8dvh),72px)) * var(--gc-type-scale, 1));
    line-height:.86;
  }
.flavors h2 { font-size:calc((clamp(56px,min(15vw,9dvh),84px)) * var(--gc-type-scale, 1)); }
.lineup-eyebrow { font-size:calc((15px) * var(--gc-type-scale, 1)); }
.product-composition {
    width:max(100vw,calc(var(--stage-h,100lvh) / 2));
    aspect-ratio:1 / 2;
  }
.product-hover-layer { display:none; }
.product-hit-surface { pointer-events:none; }
.product-a11y-trigger[data-flavor="cheddar"] { left:14.7222%!important; top:26.5278%!important; width:35.2778%!important; height:24.4444%!important; }
.product-a11y-trigger[data-flavor="koreanbbq"] { left:54.7222%!important; top:37.9167%!important; width:34.7222%!important; height:25.2778%!important; }
.product-a11y-trigger[data-flavor="seasalt"] { left:27.5%!important; top:55.1389%!important; width:60.8333%!important; height:29.0278%!important; }
.product-instruction-mobile {
    display:block;
    top:72px;
    padding:8px 12px;
    font-size:calc((9px) * var(--gc-type-scale, 1));
  }
.product-instruction-desktop { display:none; }
.quick-view { padding:8px; align-items:center; }
.quick-view-dialog {
    width:calc(100vw - 16px);
    max-height:calc(100dvh - 16px);
    grid-template-columns:1fr;
    border-radius:22px;
  }
.quick-view-close { top:12px; right:12px; width:40px; height:40px; }
.quick-view-media {
    min-height:auto;
    padding:48px 10px 8px;
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.48);
  }
.quick-view-frame { width:clamp(132px,calc(100dvh - 590px),min(100%,46dvh)); aspect-ratio:1 / 1; padding:8px; border-radius:17px; margin:0 auto; }
.quick-view-frame img { border-radius:11px; }
.quick-view-info {
    margin:10px 10px 10px;
    padding:18px 16px 18px;
    border-radius:18px;
  }
.quick-view-kicker { margin-bottom:6px; font-size:calc((13px) * var(--gc-type-scale, 1)); }
.quick-view-title { font-size:calc((clamp(38px,10.5vw,52px)) * var(--gc-type-scale, 1)); }
.quick-view-description { margin:8px 0 12px; font-size:calc((17px) * var(--gc-type-scale, 1)); }
.quick-view-facts { margin-bottom:14px; gap:4px; font-size:calc((13.5px) * var(--gc-type-scale, 1)); }
.quick-view-plans { gap:10px; }
.quick-view-plan { padding:13px 12px 11px; }
.qv-plan-price { font-size:calc((22px) * var(--gc-type-scale, 1)); }
.qv-sub-note { margin-top:8px; font-size:calc((12.5px) * var(--gc-type-scale, 1)); }
.quick-view-actions { margin-top:12px; gap:8px; }
.quick-view-action { min-height:48px; }
.quick-view-purchase-row { margin:20px 0 18px; align-items:center; }
.quick-view-price { font-size:calc((36px) * var(--gc-type-scale, 1)); }
.quantity-control { grid-template-columns:36px 40px 36px; }
.quick-view-action { min-height:49px; font-size:calc((14px) * var(--gc-type-scale, 1)); }
.flavors { padding:0 20px; place-items:center; }
.flavors-inner {
    width:100%;
    place-self:center;
  }
.flavors-copy { padding-top:0; }
.product-placeholder-wrap {
    width:min(72vw,360px);
    max-height:56dvh;
    justify-self:center;
  }
}
@media (prefers-reduced-motion:reduce) {
.hero-header,
.hero-title,
.support,
.actions,
.hero-bag-load { animation:none !important; }
.product-hover-layer,
.quick-view,
.quick-view-dialog,
.quick-view-backdrop { transition-duration:.01ms !important; }
}
@media (min-aspect-ratio:9/10) {
.quick-view { padding:18px 28px; }
.quick-view-dialog {
    width:min(92vw,1080px);
    max-height:calc(100dvh - 32px);
    display:block;
    overflow:auto;
    border-radius:30px;
    background:rgba(250,249,246,.96);
    box-shadow:0 34px 100px rgba(16,18,17,.28),inset 0 1px 0 rgba(255,255,255,.9);
  }
.quick-view-media { display:none; }
.quick-view-info {
    margin:0; padding:44px 72px 40px; border:0; border-radius:30px; background:transparent; box-shadow:none; backdrop-filter:none;
  }
.quick-view-close { top:22px; right:24px; width:48px; height:48px; background:#fff; border-color:rgba(var(--gc-ink-rgb),.10); font:400 calc((30px) * var(--gc-type-scale, 1))/1 var(--gc-sans); }
.quick-view-kicker { margin:0 0 16px; font-size:calc((18px) * var(--gc-type-scale, 1)); letter-spacing:.24em; }
.quick-view-title { font-size:calc((clamp(66px,6.7vw,104px)) * var(--gc-type-scale, 1)); line-height:.82; }
.quick-view-description { margin:22px 0 28px; font-size:calc((clamp(26px,2vw,34px)) * var(--gc-type-scale, 1)); }
.quick-view-facts { margin-bottom:28px; gap:10px; font-size:calc((16px) * var(--gc-type-scale, 1)); }
.qv-section-heading { display:flex; align-items:center; gap:24px; margin:10px 0 24px; font:700 calc((15px) * var(--gc-type-scale, 1))/1 var(--gc-sans); letter-spacing:.16em; text-transform:uppercase; }
.qv-section-heading::before,
.qv-section-heading::after { content:""; flex:1; height:1px; background:rgba(var(--gc-ink-rgb),.18); }
.quick-view-plans { grid-template-columns:1fr 1fr; gap:24px; }
.quick-view-plan { min-height:236px; align-items:center; justify-content:center; gap:8px; padding:34px 28px 24px; border:1.5px solid rgba(var(--gc-ink-rgb),.15); border-radius:24px; background:rgba(255,255,255,.72); text-align:center; box-shadow:0 10px 26px rgba(20,20,20,.035); }
.quick-view-plan[aria-checked="true"] { border:2.5px solid var(--flavor-color); background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,.76)); box-shadow:0 14px 34px color-mix(in srgb,var(--flavor-color) 18%, transparent); transform:none; }
.quick-view-plan.is-best[aria-checked="true"] { transform:none; }
.qv-plan-tag { top:-15px; left:50%; transform:translateX(-50%); padding:7px 16px 6px; background:var(--flavor-color); font-size:calc((12px) * var(--gc-type-scale, 1)); letter-spacing:.12em; white-space:nowrap; }
.qv-plan-name { font-size:calc((17px) * var(--gc-type-scale, 1)); letter-spacing:.12em; }
.qv-plan-price { display:block; font-size:calc((clamp(44px,4vw,62px)) * var(--gc-type-scale, 1)); line-height:1; color:var(--gc-ink)!important; }
.qv-plan-per { font-size:calc((17px) * var(--gc-type-scale, 1)); }
.qv-plan-divider { width:86%; height:1px; background:rgba(var(--gc-ink-rgb),.14); margin:8px 0 4px; }
.qv-plan-ship { font-size:calc((13px) * var(--gc-type-scale, 1)); color:var(--flavor-color); letter-spacing:.12em; }
.qv-purchase-options { display:grid; gap:0; margin-top:26px; border:1px solid rgba(var(--gc-ink-rgb),.16); border-radius:20px; overflow:hidden; background:rgba(255,255,255,.58); }
.qv-purchase-option { display:grid; grid-template-columns:38px 1fr auto; align-items:center; gap:12px; min-height:78px; padding:14px 22px; border:0; border-bottom:1px solid rgba(var(--gc-ink-rgb),.12); background:transparent; color:var(--gc-ink); text-align:left; cursor:pointer; }
.qv-purchase-option:last-child { border-bottom:0; }
.qv-purchase-option[aria-checked="true"] { background:color-mix(in srgb,var(--flavor-color) 7%, white); box-shadow:inset 0 0 0 1.5px var(--flavor-color); }
.qv-radio { width:28px; height:28px; border:2px solid rgba(var(--gc-ink-rgb),.55); border-radius:50%; position:relative; }
.qv-purchase-option[aria-checked="true"] .qv-radio { border-color:var(--flavor-color); }
.qv-purchase-option[aria-checked="true"] .qv-radio::after { content:""; position:absolute; inset:5px; border-radius:50%; background:var(--flavor-color); }
.qv-purchase-copy { display:grid; gap:5px; }
.qv-purchase-copy strong { font:700 calc((15px) * var(--gc-type-scale, 1))/1.15 var(--gc-sans); letter-spacing:.13em; text-transform:uppercase; }
.qv-purchase-option.is-sub .qv-purchase-copy strong,
.qv-sub-total strong { color:var(--flavor-color); }
.qv-purchase-copy small,
.qv-sub-total small { font:400 calc((14px) * var(--gc-type-scale, 1))/1.2 var(--gc-sans); color:rgba(var(--gc-ink-rgb),.58); }
.qv-sub-total { display:grid; min-width:136px; padding:8px 14px; border:1px solid rgba(var(--gc-ink-rgb),.12); border-radius:14px; background:#fff; text-align:center; }
.qv-sub-total strong { font:700 calc((28px) * var(--gc-type-scale, 1))/1 var(--gc-product-serif); }
.qv-perks { display:grid; grid-template-columns:1fr 1.25fr 1.45fr; margin:22px 0 20px; border:1px solid rgba(var(--gc-ink-rgb),.12); border-radius:16px; overflow:hidden; }
.qv-perks span { display:flex; align-items:center; justify-content:center; gap:9px; min-height:58px; padding:10px 14px; border-right:1px solid rgba(var(--gc-ink-rgb),.10); font:400 calc((12px) * var(--gc-type-scale, 1))/1.25 var(--gc-sans); text-align:center; }
.qv-perks span:last-child { border-right:0; }
.qv-perks em { font-style:normal; }
.quick-view-actions { margin-top:0; gap:8px; }
.quick-view-action { min-height:62px; border-radius:14px; font:700 calc((17px) * var(--gc-type-scale, 1))/1 var(--gc-product-serif); letter-spacing:.15em; }
.quick-view-buy { background:#151c21; }
.quick-view-build { justify-self:center; min-height:auto; padding:10px 0 0; font:400 calc((15px) * var(--gc-type-scale, 1))/1.2 var(--gc-sans); letter-spacing:0; text-transform:none; text-underline-offset:6px; }
}
@media (max-aspect-ratio:9/10) {
.quick-view {
    padding:8px;
    align-items:center;
  }
.quick-view-dialog {
    width:calc(100vw - 16px);
    max-height:calc(100dvh - 16px);
    grid-template-columns:1fr;
    overflow:auto;
    border-radius:24px;
    background:rgba(244,239,224,.97);
  }
.quick-view-close {
    top:12px;
    right:12px;
    width:42px;
    height:42px;
    z-index:5;
    background:rgba(255,255,255,.92);
  }
.quick-view-media {
    display:flex;
    min-height:0;
    height:clamp(145px,22dvh,205px);
    padding:10px 48px 0;
    overflow:hidden;
    border-bottom:1px solid rgba(255,255,255,.5);
  }
.quick-view-frame {
    width:min(58vw,220px);
    aspect-ratio:1 / 1;
    padding:6px;
    margin:0 auto;
    transform:translateY(-16%);
    border-radius:18px;
  }
.quick-view-frame img { border-radius:12px; }
.quick-view-info {
    margin:10px;
    padding:22px 18px 20px;
    border-radius:22px;
    background:rgba(250,248,241,.92);
  }
.quick-view-kicker {
    margin:0 0 6px;
    font-size:calc((12px) * var(--gc-type-scale, 1));
    letter-spacing:.22em;
  }
.quick-view-title {
    margin:0;
    font-size:calc((clamp(42px,12vw,58px)) * var(--gc-type-scale, 1));
    line-height:.9;
    color:var(--flavor-color);
  }
.quick-view-description {
    margin:7px 0 14px;
    font-size:calc((18px) * var(--gc-type-scale, 1));
    line-height:1.05;
  }
.quick-view-facts {
    margin:0 0 16px;
    padding:0;
    gap:0;
    font-size:calc((11.5px) * var(--gc-type-scale, 1));
    line-height:1.35;
  }
.quick-view-facts li:first-child { white-space:normal; }
.quick-view-facts li:nth-child(2),
.quick-view-facts li:nth-child(3) { display:none; }
.qv-section-heading {
    display:flex;
    align-items:center;
    gap:12px;
    margin:0 0 13px;
    font:700 calc((12px) * var(--gc-type-scale, 1))/1 var(--gc-sans);
    letter-spacing:.15em;
    text-transform:uppercase;
  }
.qv-section-heading::before,
.qv-section-heading::after {
    content:"";
    flex:1;
    height:1px;
    background:rgba(var(--gc-ink-rgb),.15);
  }
.quick-view-plans {
    grid-template-columns:1fr 1fr;
    gap:10px;
    align-items:stretch;
  }
.quick-view-plan {
    min-height:154px;
    align-items:center;
    justify-content:center;
    gap:4px;
    padding:22px 8px 12px;
    border:1.5px solid rgba(var(--gc-ink-rgb),.18);
    border-radius:17px;
    background:rgba(255,255,255,.66);
    text-align:center;
    box-shadow:none;
  }
.quick-view-plan[aria-checked="true"] {
    border:2px solid var(--flavor-color);
    background:#fff;
    box-shadow:0 8px 20px color-mix(in srgb,var(--flavor-color) 15%, transparent);
    transform:none;
  }
.qv-plan-tag {
    top:-11px;
    left:50%;
    transform:translateX(-50%);
    padding:5px 9px 4px;
    border-radius:999px;
    background:var(--flavor-color);
    font-size:calc((9px) * var(--gc-type-scale, 1));
    letter-spacing:.11em;
    white-space:nowrap;
  }
.qv-plan-name {
    font-size:calc((12px) * var(--gc-type-scale, 1));
    letter-spacing:.1em;
  }
.qv-plan-price {
    display:block;
    font-size:calc((clamp(30px,8vw,39px)) * var(--gc-type-scale, 1));
    line-height:1;
    color:var(--gc-ink)!important;
  }
.quick-view-plan.is-best[aria-checked="true"] .qv-plan-price { color:var(--flavor-color)!important; }
.qv-plan-per { font-size:calc((11px) * var(--gc-type-scale, 1)); }
.qv-plan-divider { display:none; }
.qv-plan-ship {
    margin-top:7px;
    font-size:calc((9.5px) * var(--gc-type-scale, 1));
    color:var(--flavor-color);
    letter-spacing:.1em;
  }
.qv-purchase-options {
    display:grid;
    grid-template-columns:.8fr 1.55fr;
    gap:0;
    margin-top:16px;
    padding:3px;
    border:1px solid rgba(var(--gc-ink-rgb),.16);
    border-radius:999px;
    overflow:hidden;
    background:rgba(255,255,255,.72);
  }
.qv-purchase-option {
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:44px;
    padding:8px 9px;
    border:0!important;
    border-radius:999px;
    background:transparent;
    text-align:center;
    box-shadow:none!important;
  }
.qv-purchase-option[aria-checked="true"] {
    background:var(--flavor-color);
    color:#fff;
  }
.qv-radio,
.qv-purchase-copy small,
.qv-sub-total { display:none; }
.qv-purchase-copy { display:block; }
.qv-purchase-copy strong {
    display:block;
    font:700 calc((10.5px) * var(--gc-type-scale, 1))/1.05 var(--gc-sans);
    letter-spacing:.055em;
    text-transform:uppercase;
    color:inherit!important;
    white-space:nowrap;
  }
.qv-purchase-option.is-sub .qv-purchase-copy strong { color:inherit!important; }
.qv-perks {
    display:block;
    margin:10px 0 14px;
    border:0;
    border-radius:0;
    text-align:center;
  }
.qv-perks span { display:none; }
.qv-perks::before {
    content:"Free shipping · Skip or cancel anytime";
    display:block;
    font:500 calc((11px) * var(--gc-type-scale, 1))/1.3 var(--gc-sans);
    color:rgba(var(--gc-ink-rgb),.68);
  }
.quick-view-actions {
    margin-top:0;
    gap:4px;
  }
.quick-view-action {
    min-height:50px;
    border-radius:13px;
    font-size:calc((13px) * var(--gc-type-scale, 1));
  }
.quick-view-buy {
    background:var(--flavor-color);
    color:#fff;
  }
.quick-view-build {
    min-height:auto;
    padding:10px 0 2px;
    background:transparent;
    color:var(--flavor-color);
    box-shadow:none;
    font:600 calc((12px) * var(--gc-type-scale, 1))/1.2 var(--gc-sans);
    letter-spacing:0;
    text-transform:none;
    text-decoration:underline;
    text-underline-offset:5px;
  }
}
@media (min-width: 900px) {
.quick-view {padding:28px;align-items:center;justify-content:center;}
.quick-view-dialog {
    width:min(1180px,calc(100vw - 56px));
    max-height:calc(100vh - 56px);
    grid-template-columns:minmax(360px,44%) minmax(0,56%);
    border-radius:30px;
    overflow:hidden;
  }
.quick-view-media {
    min-height:720px;
    padding:56px 34px 34px;
  }
.quick-view-frame {
    width:min(88%,520px);
    margin:auto;
  }
.quick-view-info {
    padding:54px 56px 46px;
    display:flex;
    flex-direction:column;
    justify-content:center;
  }
.quick-view-info h2,
.quick-view-title {
    margin-bottom:10px;
  }
.quick-view-benefits {
    display:flex;
    flex-wrap:wrap;
    gap:12px 20px;
    margin:20px 0 18px;
  }
.qv-box-options,
.quick-view-box-options {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px;
    margin-top:18px;
  }
.qv-box-card,
.quick-view-box-card {
    min-height:190px;
    padding:26px 24px 22px;
    border-radius:22px;
  }
.qv-box-price,
.quick-view-box-price {
    font-size:calc((clamp(42px,4vw,58px)) * var(--gc-type-scale, 1));
    line-height:.95;
  }
.qv-purchase-toggle,
.quick-view-purchase-toggle {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:0;
    margin-top:22px;
    border-radius:18px;
    overflow:hidden;
  }
.qv-purchase-toggle button,
.quick-view-purchase-toggle button {
    min-height:64px;
    font-size:calc((15px) * var(--gc-type-scale, 1));
    letter-spacing:.08em;
  }
.qv-sub-note,
.quick-view-sub-note {
    margin-top:12px;
    text-align:center;
    font-size:calc((14px) * var(--gc-type-scale, 1));
  }
.qv-perks,
.quick-view-perks {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;
    margin-top:16px;
  }
.qv-perk,
.quick-view-perk {
    min-height:72px;
    padding:12px 14px;
    border-radius:16px;
  }
.qv-cta,
.quick-view-cta {
    min-height:68px;
    margin-top:22px;
    border-radius:16px;
    font-size:calc((16px) * var(--gc-type-scale, 1));
    letter-spacing:.12em;
  }
.qv-mix-link,
.quick-view-mix-link {
    margin-top:14px;
    text-align:center;
  }
}
@media (min-width:900px) {
.quick-view-dialog {
    overflow:auto !important;
    max-height:calc(100dvh - 48px) !important;
  }
.quick-view-info {
    justify-content:flex-start !important;
    padding:38px 56px 30px !important;
  }
.quick-view-kicker { margin-bottom:8px !important; font-size:calc((14px) * var(--gc-type-scale, 1)) !important; }
.quick-view-title { font-size:calc((clamp(54px,5.2vw,78px)) * var(--gc-type-scale, 1)) !important; line-height:.86 !important; }
.quick-view-description { margin:12px 0 16px !important; font-size:calc((clamp(22px,1.75vw,29px)) * var(--gc-type-scale, 1)) !important; }
.quick-view-facts { margin-bottom:18px !important; gap:5px !important; font-size:calc((13px) * var(--gc-type-scale, 1)) !important; }
.qv-section-heading { margin:4px 0 17px !important; }
.quick-view-plans { gap:18px !important; }
.quick-view-plan {
    min-height:168px !important;
    padding:27px 22px 19px !important;
    border-radius:20px !important;
  }
.qv-plan-tag { top:-13px !important; }
.qv-plan-price { font-size:calc((clamp(40px,3.4vw,52px)) * var(--gc-type-scale, 1)) !important; }
.qv-plan-per { font-size:calc((14px) * var(--gc-type-scale, 1)) !important; }
.qv-purchase-options { margin-top:19px !important; border-radius:16px !important; }
.qv-purchase-option { min-height:62px !important; padding:10px 18px !important; }
.qv-radio { width:23px !important; height:23px !important; }
.qv-purchase-copy strong { font-size:calc((13px) * var(--gc-type-scale, 1)) !important; }
.qv-purchase-copy small,
.qv-sub-total small { font-size:calc((12px) * var(--gc-type-scale, 1)) !important; }
.qv-sub-total { min-width:118px !important; padding:7px 11px !important; }
.qv-sub-total strong { font-size:calc((23px) * var(--gc-type-scale, 1)) !important; }
.qv-perks { margin:14px 0 12px !important; }
.qv-perks span { min-height:46px !important; padding:8px 10px !important; font-size:calc((11px) * var(--gc-type-scale, 1)) !important; }
.quick-view-actions {
    display:grid !important;
    visibility:visible !important;
    opacity:1 !important;
    margin-top:2px !important;
    padding-top:10px !important;
    position:sticky;
    bottom:0;
    z-index:3;
    background:linear-gradient(180deg,rgba(250,249,246,0),rgba(250,249,246,.97) 24%,rgba(250,249,246,.99));
  }
.quick-view-action { min-height:56px !important; }
.quick-view-buy { display:flex !important; }
}
@media (max-width:899px) {
.quick-view-media {
    height:clamp(170px,25dvh,230px) !important;
    padding:8px 52px 0 !important;
    overflow:hidden !important;
    align-items:flex-start !important;
  }
.quick-view-frame {
    width:min(64vw,250px) !important;
    height:100% !important;
    aspect-ratio:auto !important;
    padding:4px !important;
    margin:0 auto !important;
    transform:none !important;
    background:transparent !important;
    box-shadow:none !important;
  }
.quick-view-frame img {
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
    object-position:center top !important;
    border-radius:12px !important;
  }
}
.scene2-visual-local {
  background-image:var(--gc-layer-bg-d) !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  box-shadow:none !important;
  text-shadow:none !important;
}
.scene2-art,
.scene2-env { box-shadow:none !important; filter:none !important; }
@media (max-aspect-ratio:9/10) {
.scene2-visual-local {
    background-image:var(--gc-layer-bg-m, var(--gc-layer-bg-d)) !important;
    background-size:cover !important;
    background-position:center center !important;
  }
}
.pre.has-cart-items,
.post-story-preorder.has-cart-items {
  padding-left:16px!important;
  padding-right:16px!important;
}
@media (min-width:900px) {
.quick-view-actions .quick-view-buy {
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:100% !important;
    min-height:62px !important;
    padding:0 32px !important;
    text-align:center !important;
    font-size:calc((16px) * var(--gc-type-scale, 1)) !important;
    font-weight:700 !important;
    line-height:1 !important;
    letter-spacing:.16em !important;
    text-transform:uppercase !important;
    border-radius:14px !important;
  }
.quick-view-actions .quick-view-buy::after {
    margin-left:14px !important;
    font-size:calc((20px) * var(--gc-type-scale, 1)) !important;
    line-height:1 !important;
    flex:0 0 auto;
  }
.quick-view-actions .quick-view-buy:hover {
    box-shadow:0 16px 34px rgba(var(--flavor-rgb,14,110,139),.18),0 0 0 1px var(--flavor-color) inset !important;
  }
}
.scene2-visual-local {
  background-image:var(--gc-layer-bg-d) !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
}
@media (max-aspect-ratio:9/10) {
.scene2-visual-local {
    background-image:var(--gc-layer-bg-m, var(--gc-layer-bg-d)) !important;
    background-size:cover !important;
    background-position:center center !important;
  }
}
.scene2-visual-local {box-shadow:none!important;filter:none!important;-webkit-filter:none!important;mix-blend-mode:normal!important;}
.scene2-visual-local::before,
.scene2-visual-local::after {content:none!important;display:none!important;}
.scene2-env {
  background:#08090a !important;
}
.scene2-visual-local {
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  overflow:hidden !important;
  background:none !important;
  box-shadow:none !important;
  filter:none !important;
  -webkit-filter:none !important;
  mix-blend-mode:normal !important;
}
.scene2-visual-local::before,
.scene2-visual-local::after {content:none!important;display:none!important;}
.scene2-bg-layer {
  position:absolute;
  inset:0;
  background-image:var(--gc-layer-bg-d);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  z-index:0;
}
.scene2-ingredients-layer {
  position:absolute;
  inset:0;
  display:block !important;
  z-index:1;
  pointer-events:none;
}
.scene2-ingredients-layer img {
  display:block !important;
  position:absolute;
  max-width:none !important;
  box-shadow:none !important;
  filter:none !important;
  -webkit-filter:none !important;
  mix-blend-mode:normal !important;
}
.scene2-copy {z-index:3!important;}
@media (min-aspect-ratio: 9/10) {
.scene2-bg-layer {
    background-size:cover;
    background-position:center center;
  }
.scene2-ingredients-layer img {
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center center;
  }
.scene2-copy {
    left:auto !important;
    right:6.2vw !important;
    width:min(39vw,650px) !important;
    text-align:left !important;
  }
}
@media (max-aspect-ratio: 9/10) {
.scene2-bg-layer {
    background-image:var(--gc-layer-bg-m, var(--gc-layer-bg-d));
    background-size:cover;
    background-position:center center;
  }
.scene2-ingredients-layer img {
    left:0;
    bottom:-1px;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center bottom;
  }
.quick-view-media {
    display:none !important;
  }
.scene2-copy {
    top:9.5dvh !important;
    left:7vw !important;
    right:7vw !important;
    width:auto !important;
    text-align:right !important;
  }
.scene2-copy .eyebrow {margin-bottom:1.8dvh!important;}
.scene2-copy .scene-title {margin:0!important;}
}
.product-a11y-trigger[data-flavor="cheddar"] { left:30.8333%; top:40.3333%; width:12.2917%; height:33.5%; }
.product-a11y-trigger[data-flavor="koreanbbq"] { left:58.75%; top:42.6667%; width:13.125%; height:31.1667%; }
.product-a11y-trigger[data-flavor="seasalt"] { left:41.3542%; top:37%; width:19.375%; height:41.1667%; }

/* ==========================================================================
   Section-driven support
   ========================================================================== */

/* The packaged stylesheet above positions the first three scenes by name. The
   rules below cover any scene, layer or copy block a merchant adds in the
   theme editor, plus the quick-view panel wrapper and the no-motion fallback. */

/* --- artwork layers --------------------------------------------------- */
.gc-scene-art .gc-layer {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  will-change: transform, opacity, filter;
}

.gc-scene-art .gc-layer > img,
.gc-layer-overlay > img {
  width: 100%;
  height: 100%;
  object-fit: var(--gc-layer-fit, cover);
  object-position: var(--gc-layer-position, center center);
}

.gc-layer-bg {
  background-image: var(--gc-layer-bg-d);
  background-size: var(--gc-layer-fit, cover);
  background-position: var(--gc-layer-position, center center);
  background-repeat: no-repeat;
}

.gc-layer-overlay {
  position: absolute;
  inset: 0;
  display: block;
  z-index: 1;
  pointer-events: none;
}

.gc-layer.bottom-safe > img,
.gc-layer-overlay.bottom-safe > img {
  object-position: center bottom;
}

@media (max-aspect-ratio: 9/10) {
  .gc-layer-bg {
    background-image: var(--gc-layer-bg-m, var(--gc-layer-bg-d));
  }
}

.gc-scene-env-image {
  z-index: 0;
}

/* --- copy placement ---------------------------------------------------- */
.gc-scene-copy[data-gc-copy-position='bottom-left'] {
  inset: auto auto 18dvh 6.2vw;
  width: min(46vw, 720px);
}

.gc-scene-copy[data-gc-copy-position='top-right'] {
  inset: 10dvh 6.2vw auto auto;
  width: min(39vw, 650px);
}

.gc-scene-copy[data-gc-copy-position='top-center'] {
  inset: max(40px, 5.5%) auto auto 50%;
  width: min(86vw, 1100px);
  transform: translateX(-50%);
}

.gc-scene-copy[data-gc-copy-position='bottom-center'] {
  inset: auto auto 12dvh 50%;
  width: min(86vw, 1100px);
  transform: translateX(-50%);
}

.gc-copy-align-left { text-align: left; }
.gc-copy-align-center { text-align: center; }
.gc-copy-align-right { text-align: right; }

@media (max-aspect-ratio: 9/10) {
  .gc-scene-copy[data-gc-copy-position='bottom-left'],
  .gc-scene-copy[data-gc-copy-position='top-right'] {
    inset: auto 7vw 14dvh 7vw;
    width: auto;
  }
}

/* --- quick view panels -------------------------------------------------
   The dialog is a two-column grid whose children are the media frame and the
   info column, so each flavour's panel dissolves into that grid rather than
   introducing a third child. */
.qv-panel { display: contents; }
.qv-panel[hidden] { display: none; }
.quick-view-form { display: contents; }

.qv-section-heading {
  margin: 18px 0 10px;
  font: 700 calc(11px * var(--gc-type-scale, 1)) / 1.2 var(--gc-sans);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(var(--gc-ink-rgb), 0.58);
}

.quick-view-plan[data-qv-unavailable='1'] {
  opacity: 0.45;
  cursor: not-allowed;
}


/* The quick view's actions are links in the theme build rather than the plain
   buttons of the static one, so they arrive with the browser's link underline.
   The design has none on the buy action. */
.quick-view-action {
  text-decoration: none;
}

/* The build-a-box control is a link here too, so it needs the button's own
   centring back. Its underline stays: it is what marks this as the quiet
   secondary route out of the quick view. */
.quick-view-build {
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: underline;
}

/* --- no-motion fallback -------------------------------------------------
   When GSAP is unavailable, or animations are switched off for this device in
   Theme settings > GOOD CHIPS - Responsive, the pinned stage becomes an
   ordinary stack of full-height panels that scroll normally. */
.gc-story-static .stage {
  position: static;
  height: auto;
  overflow: visible;
}

.gc-story-static .panel {
  position: relative;
  inset: auto;
  height: auto;
  min-height: 100svh;
  opacity: 1 !important;
  visibility: visible !important;
}

.gc-story-static .scene-env {
  display: none !important;
}

.gc-story-static .scene-art {
  background: var(--gc-cream);
  pointer-events: auto;
}

.gc-story-static .gc-layer,
.gc-story-static .copy-block,
.gc-story-static .flavors-inner,
.gc-story-static .product-composition-layer {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  filter: none !important;
}

.gc-story-static .hero-bag-scroll,
.gc-story-static .hero-header-scroll,
.gc-story-static .hero-copy {
  opacity: 1 !important;
  visibility: visible !important;
}

/* The sticky bar is a GSAP-revealed element, so in the static fallback the
   hero's own header carries the branding and the sticky bar stays out. */
body:has(.gc-story-static) .post-story-header {
  display: none;
}