:root{
  --bg:#2a0b08; --bg2:#120504; --ink:#f6eee0; --mute:#d8c9bb; --acc:#ff5a3c; --acc-ink:#1a0603; --tile:#ffffff14;
  --slab:'Zilla Slab',Georgia,serif; --pix:'Silkscreen',ui-monospace,monospace; --sans:'Space Grotesk',system-ui,sans-serif;
  --pad:16px; --head:56px;
  --st-top:64px; --st-h:330px; --px:44%;
}
body[data-world=boss-fight]{--bg:#3a100b;--bg2:#100403;--acc:#ff5a3c;--acc-ink:#1a0603;--mute:#e3cbbd}
body[data-world=too-many-tabs]{--bg:#0d2766;--bg2:#040a22;--acc:#7fdcff;--acc-ink:#03122e;--mute:#c4d4f2}
body[data-world=night-brain]{--bg:#2f1550;--bg2:#0c0616;--acc:#c79bff;--acc-ink:#170a2a;--mute:#d6c7ee}
body[data-world=side-quest]{--bg:#14462a;--bg2:#05170c;--acc:#b5e36a;--acc-ink:#0b2010;--mute:#cbe2c4}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg2);color:var(--ink);font:500 16px/1.5 var(--sans);overflow-x:hidden;transition:background-color .9s}
img{max-width:100%;display:block}
[hidden]{display:none!important}
a{color:inherit}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;left:-999px;top:8px;z-index:60;background:var(--ink);color:#000;padding:10px 14px}
.skip:focus{left:8px}
button{font:inherit;color:inherit}

/* header */
.top{position:absolute;inset:0 0 auto 0;z-index:30;height:var(--head);display:flex;align-items:center;gap:14px;padding:0 var(--pad);padding-top:env(safe-area-inset-top)}
.brand{margin-right:auto}
.brand img{width:92px;height:auto;filter:brightness(0) invert(1);opacity:.94}
.bag-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;font:700 12px var(--pix);letter-spacing:.06em;background:color-mix(in srgb,var(--ink) 92%,transparent);color:#111;border:0;border-radius:10px;padding:0 12px;min-height:44px;cursor:pointer}
.bag-count{display:inline-block;min-width:18px;margin-left:6px;background:#111;color:var(--ink);padding:0 4px;text-align:center}
.bag-btn.bump{animation:bump .45s}
@keyframes bump{30%{transform:scale(1.15)}}

/* hero: one screen, measured */
.hero{position:relative;height:100svh;min-height:600px;overflow:hidden;isolation:isolate;background:var(--bg);transition:background-color .9s}
.field{position:absolute;inset:0;z-index:0;pointer-events:none}
.world-scenes{position:absolute;inset:0 0 auto;height:calc(var(--st-top) + var(--st-h) + 90px);min-height:330px;max-height:75%;overflow:hidden}
.world-scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 54%;image-rendering:pixelated;opacity:0;transition:opacity .65s ease}
body[data-world=boss-fight] [data-scene=boss-fight],body[data-world=too-many-tabs] [data-scene=too-many-tabs],body[data-world=night-brain] [data-scene=night-brain],body[data-world=side-quest] [data-scene=side-quest]{opacity:1}
.world-scenes::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,color-mix(in srgb,var(--bg2) 55%,transparent),transparent 25%,transparent 50%,color-mix(in srgb,var(--bg) 25%,transparent) 72%,var(--bg) 100%)}
.flood,.ghost{display:none}
.dither{position:absolute;inset:0;z-index:2;opacity:.025;background-image:linear-gradient(45deg,#000 25%,transparent 25%,transparent 75%,#000 75%),linear-gradient(45deg,#000 25%,transparent 25%,transparent 75%,#000 75%);background-size:6px 6px;background-position:0 0,3px 3px;mask-image:linear-gradient(#0000 40%,#000)}
.halo{position:absolute;z-index:2;left:calc(var(--px) - 45%);top:calc(var(--st-top) - 2%);width:90%;height:calc(var(--st-h) * 1.08);background:radial-gradient(closest-side,color-mix(in srgb,var(--acc) 14%,transparent),transparent 74%);filter:blur(8px)}
.motes{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:.55}
.mote:nth-child(n+7){display:none}
.mote{position:absolute;width:var(--s,8px);height:var(--s,8px);background:var(--acc);opacity:0;animation:mote var(--d,9s) linear var(--dl,0s) infinite;image-rendering:pixelated}
body[data-world=boss-fight] .mote{background:#ff7a3c;box-shadow:0 0 6px #ff5a3c}
body[data-world=too-many-tabs] .mote{width:calc(var(--s,8px) * 2.2);height:calc(var(--s,8px) * 1.5);background:#d9ecff;border-top:3px solid #7fdcff;opacity:0}
body[data-world=night-brain] .mote{border-radius:50%;background:radial-gradient(#fff,#c79bff 60%,transparent 70%)}
body[data-world=side-quest] .mote{background:#e9f7b0;transform:rotate(45deg)}
@keyframes mote{0%{opacity:0;transform:translateY(0)}12%{opacity:.75}88%{opacity:.6}100%{opacity:0;transform:translateY(calc(var(--rise,-160px)))}}

.stage{position:absolute;z-index:5;left:0;right:0;top:var(--st-top);height:var(--st-h)}
.gl{position:absolute;inset:0;width:100%;height:100%;touch-action:pan-y;cursor:grab;opacity:0;transition:opacity .4s}
.gl.ready{opacity:1}
.gl:active{cursor:grabbing}
.poster{position:absolute;left:calc(var(--px) - 30%);width:60%;height:100%;object-fit:contain;transition:opacity .4s}
.gl,.poster{filter:drop-shadow(0 4px 6px #000b) drop-shadow(0 16px 20px #0009)}
.poster.off{opacity:0}
.floor{display:none;position:absolute;z-index:-1;left:calc(var(--px) - 20%);width:40%;height:22px;bottom:calc(var(--floor-b,10px));border-radius:50%;background:radial-gradient(closest-side,#000a,#0000);transition:transform .2s,opacity .2s}

.info{position:absolute;z-index:8;left:var(--pad);right:var(--pad);bottom:calc(var(--pick-h,84px) + 8px)}
.pill{display:inline-block;margin:0 0 8px;font:700 12px var(--sans);letter-spacing:.14em;background:var(--acc);color:var(--acc-ink);border-radius:99px;padding:6px 12px}
.name{margin:0;font:700 min(11.5vw,48px)/.95 var(--slab);letter-spacing:-.01em;white-space:nowrap}
.mask{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.06em}
.mask>span{display:inline-block}
.desc{margin:6px 0 14px;color:var(--mute);font:500 15px/1.35 var(--sans);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tiles{list-style:none;margin:0 0 14px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.tiles li{background:color-mix(in srgb,var(--ink) 9%,transparent);border-radius:16px;padding:10px 12px;min-width:0}
.tiles b{display:block;font:700 20px/1.05 var(--slab)}
.tiles span{display:block;font:700 11px/1.25 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
.buy{display:flex;gap:8px;align-items:stretch}
.grind{position:relative;display:flex;margin:0;padding:3px;border:0;background:#00000055;border-radius:14px}
.grind-bean{position:relative;flex:0 0 40px;align-self:center;width:40px;height:28px;margin-right:2px;pointer-events:none}
.grind-bean i{position:absolute;left:0;top:0;width:7px;height:7px;background:#ce8952;box-shadow:inset -1px -1px #81432b;will-change:transform}
.grind-bean i:first-child,.grind-bean i:nth-child(3){background:#e8aa6c}
.grind-bean::after{content:"";position:absolute;left:18px;top:5px;width:3px;height:15px;background:#542b1c;box-shadow:1px 0 #f0b778;transform:rotate(28deg);transition:opacity .12s .3s}
.grind-bean[data-format=ground]::after{opacity:0;transition-delay:0s}
.grind button{border:0;background:none;color:var(--mute);font:700 12px var(--sans);padding:0 10px;min-height:44px;border-radius:9px;cursor:pointer;white-space:nowrap}
.grind button[aria-checked=true]{background:var(--ink);color:#111}
.only{margin:0;display:flex;align-items:center;padding:0 12px;border-radius:12px;background:#0006;font:700 12px var(--sans);color:var(--mute);white-space:nowrap}
.add{flex:1;min-height:52px;border:0;border-radius:12px;background:var(--acc);color:var(--acc-ink);font:700 16px var(--sans);cursor:pointer;box-shadow:0 6px 0 #0005}
.add:active{transform:translateY(2px);box-shadow:0 4px 0 #0005}
.add:disabled{cursor:default}

.picker{position:absolute;z-index:9;left:0;right:0;bottom:calc(10px + env(safe-area-inset-bottom));display:flex;justify-content:center;padding:0 8px}
.chips{display:flex;align-items:flex-start;gap:4px;padding:6px 8px 4px;border-radius:26px;background:#ffffff14;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid #ffffff22}
.chips .sep{width:1px;align-self:stretch;margin:6px 2px 18px;background:#ffffff33}
.chips button{display:flex;flex-direction:column;align-items:center;gap:3px;min-width:64px;border:0;padding:0;background:none;cursor:pointer}
.chips .disc{position:relative;width:50px;height:50px;border-radius:50%;transition:transform .25s}
.chips .disc img{width:100%;height:100%;border-radius:50%}
.chips .disc::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:3px solid transparent;transition:border-color .25s}
.chips .cl{font:700 11px var(--sans);letter-spacing:.04em;color:var(--mute)}
.chips button[aria-selected=true] .disc{transform:translateY(-2px) scale(1.08)}
.chips button[aria-selected=true] .disc::after{border-color:var(--ink)}
.chips button[aria-selected=true] .cl{color:var(--ink)}
.chips button:focus-visible .disc{outline:2px solid var(--acc);outline-offset:6px}

/* name swap */
.out-up{animation:outUp .15s cubic-bezier(.7,0,.84,0) forwards}
.dim{opacity:.45;transition:opacity .14s ease}
.in-up{animation:inUp .42s cubic-bezier(.16,1,.3,1)}
@keyframes outUp{to{transform:translateY(-110%);opacity:0}}
@keyframes inUp{from{opacity:.45}to{opacity:1}}
.fade-swap{animation:fadeSwap .34s cubic-bezier(.16,1,.3,1) both}
@keyframes fadeSwap{0%{opacity:0;transform:translateY(14px)}100%{opacity:1;transform:none}}

/* below the fold */
section:not(.hero){padding:56px var(--pad)}
.eyebrow{font:700 11px var(--sans);letter-spacing:.18em;color:var(--acc);margin:0 0 10px;transition:color .9s}
h2{font:700 clamp(34px,9vw,64px)/.98 var(--slab);margin:0 0 14px}
.compare{background:var(--bg2)}
.cmp-grid{display:grid;grid-auto-flow:column;grid-auto-columns:78%;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px;margin:0 calc(var(--pad) * -1);padding-left:var(--pad);padding-right:var(--pad);scrollbar-width:none}
.cmp-grid::-webkit-scrollbar{display:none}
.cmp-grid img{height:150px;width:auto;margin:0 auto 10px;filter:drop-shadow(0 10px 10px #0008)}
.cmp-grid article{scroll-snap-align:start;border:1px solid #ffffff22;border-radius:18px;padding:16px;background:#ffffff08}
.cmp-grid h3{font:700 22px var(--slab);margin:0 0 8px}
.cmp-grid dl{margin:0;display:grid;gap:6px}
.cmp-grid div{display:grid;grid-template-columns:76px 1fr;gap:8px}
.cmp-grid dt{font:700 11px/1.7 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
.cmp-grid dd{margin:0;font-size:14px}
.offers{background:var(--bg)}
.prices{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:6px 0 14px}
.prices div{background:var(--ink);color:#111;border-radius:18px;padding:14px 10px;text-align:center}
.prices strong{display:block;font:700 30px/1 var(--slab)}
.prices span{display:block;margin-top:6px;font:700 11px/1.35 var(--sans);letter-spacing:.06em;text-transform:uppercase}
.fine{font-size:13px;color:var(--mute);max-width:60ch;margin:0}
.cupcheck{display:grid;grid-template-columns:110px 1fr;gap:16px;align-items:center;background:var(--bg2)}
.cupcheck img{width:110px;height:auto}
.cupcheck p:last-child{color:var(--mute);margin:0}
.faq{background:var(--bg)}
.faq details{border-top:1px solid #ffffff26;padding:12px 0}
.faq summary{font:700 16px var(--sans);cursor:pointer}
.faq p{color:var(--mute);margin:8px 0 0}
.contact{margin-top:18px!important}
.foot{padding:36px var(--pad) 40px;background:#070609;color:var(--mute);font:500 12px var(--sans)}
.foot img{width:96px;height:auto;background:var(--ink);padding:5px 7px;margin-bottom:14px}
.foot nav{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:12px}

/* bag sheet */
.sheet{position:fixed;inset:0;z-index:80}
.sheet-backdrop{position:absolute;inset:0;background:#000a;opacity:0;transition:opacity .2s}
.sheet-panel{position:absolute;left:0;right:0;bottom:0;max-height:88svh;overflow:auto;background:#14111a;color:var(--ink);border-radius:22px 22px 0 0;padding:18px var(--pad) calc(18px + env(safe-area-inset-bottom));transform:translateY(100%);transition:transform .25s}
.sheet.open .sheet-backdrop{opacity:1}.sheet.open .sheet-panel{transform:none}
.sheet-head{display:flex;justify-content:space-between;align-items:center}
.sheet-head h2{font-size:28px;margin:0}
.x{width:44px;height:44px;border:0;background:#ffffff14;border-radius:50%;font-size:22px;cursor:pointer}
.lines-bag{list-style:none;margin:12px 0;padding:0}
.lines-bag li{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid #ffffff1a}
.lines-bag .ln{flex:1}.lines-bag .ln b{display:block}.lines-bag small{color:var(--mute)}
.lines-bag .qty{display:flex;align-items:center;gap:6px}
.lines-bag .qty button{width:44px;height:44px;border-radius:50%;border:1px solid #ffffff33;background:none;cursor:pointer}
.lines-bag .empty{color:var(--mute)}
.totals{margin:0 0 12px}.totals div{display:flex;justify-content:space-between;padding:4px 0}.totals dt{color:var(--mute)}.totals dd{margin:0}
.totals .grand{border-top:1px solid #ffffff26;margin-top:6px;padding-top:8px;font-weight:700}
.checkout{display:block;text-align:center;background:var(--acc);color:var(--acc-ink);text-decoration:none;font:700 16px var(--sans);padding:15px;border-radius:12px;margin-bottom:10px}
.checkout[aria-disabled=true]{opacity:.45;pointer-events:none}

/* desktop */
@media (min-width:900px){
  :root{--pad:40px;--head:72px}
    .brand img{width:116px}
  .hero{min-height:680px}
  .info{left:auto;right:6vw;width:min(420px,34vw);top:50%;bottom:auto;transform:translateY(-58%)}
  .name{font-size:clamp(48px,5vw,76px)}
  .desc{font-size:17px}
  .tiles b{font-size:24px}
  .tiles span{font-size:12px}
  .picker{left:auto;right:6vw;width:min(420px,34vw);bottom:auto;top:var(--pick-top,70%);justify-content:flex-start}
  .world-scenes{height:100%;max-height:none}
  .world-scene{object-position:42% 52%}
  .world-scenes::after{background:linear-gradient(90deg,transparent 12%,transparent 42%,color-mix(in srgb,var(--bg) 76%,transparent) 65%,color-mix(in srgb,var(--bg) 95%,transparent) 100%),linear-gradient(180deg,color-mix(in srgb,var(--bg2) 55%,transparent),transparent 22%,transparent 72%,var(--bg) 100%)}
  .cmp-grid{grid-auto-flow:row;grid-template-columns:repeat(4,1fr);overflow:visible;margin:0;padding:0}
  .prices{max-width:720px}
  .cupcheck{grid-template-columns:200px 1fr}.cupcheck img{width:200px}
  section:not(.hero){padding:80px var(--pad)}
}
@media (max-width:899px){.mote:nth-child(n+5){display:none}.brand img{filter:brightness(0) invert(1) drop-shadow(0 1px 8px #0008)}}
@media (max-width:359px){.chips button{min-width:56px}.chips .disc{width:44px;height:44px}.tiles b{font-size:17px}.grind button{padding:0 8px}}
@media (max-width:360px){
  .top{gap:8px}
  .brand img{width:72px}
      .bag-btn{display:inline-flex;align-items:center;flex-shrink:0;white-space:nowrap;padding:0 10px;font-size:11px}
  .desc{white-space:normal;overflow:visible;text-overflow:clip;font-size:14px}
  .tiles{gap:6px}
  .tiles li{padding:9px 10px}
  .tiles b{font-size:17px}
  .tiles span{letter-spacing:.03em}
  .buy{flex-wrap:wrap}
  .grind{width:100%;justify-content:center}
  .grind button{flex:1}
  .add{flex:1 0 100%;min-height:48px;font-size:15px;line-height:1.2;padding:10px 12px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .ghost span,.mote,.bag-btn.bump{animation:none!important}.mote{display:none}
  .world-scene{transition:none!important}.in-up,.out-up,.fade-swap{animation:none!important}
  *{transition-duration:.01s!important}
}


.compare.compare {
  --cmp-ink: #f6eee0;
  --cmp-muted: #c8c1bb;
  padding: 64px max(var(--pad, 16px), calc((100vw - 1320px) / 2));
  color: var(--cmp-ink);
  background: #090a10;
  scroll-margin-top: 24px;
}

.compare .cmp-header { margin: 0 0 32px; }
.compare .cmp-eyebrow {
  margin: 0 0 12px;
  font: 700 11px/1.5 var(--pix, monospace);
  letter-spacing: .12em;
  color: var(--cmp-muted);
}
.compare .cmp-header h2 {
  max-width: 800px;
  margin: 0;
  font: 700 clamp(34px, 7.8vw, 56px)/1.04 var(--slab, Georgia, serif);
  letter-spacing: -.035em;
  text-wrap: balance;
}
.compare .cmp-lineup { display: grid; gap: 30px; }
.compare .cmp-world {
  --cmp-accent: #ff8c70;
  --cmp-scene: url('assets/worlds/boss-fight.webp');
  --cmp-position: 42% 50%;
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.2fr);
  align-items: start;
  align-content: start;
  gap: 20px;
  min-width: 0;
  padding: 0 0 28px;
  border-bottom: 1px solid #ffffff1a;
}
.compare .cmp-tabs {
  --cmp-accent: #8bdfff;
  --cmp-scene: url('assets/worlds/too-many-tabs.webp');
  --cmp-position: 30% 50%;
}
.compare .cmp-night {
  --cmp-accent: #c8a1ff;
  --cmp-scene: url('assets/worlds/night-brain.webp');
  --cmp-position: 22% 50%;
}
.compare .cmp-side {
  --cmp-accent: #bce78d;
  --cmp-scene: url('assets/worlds/side-quest.webp');
  --cmp-position: 40% 50%;
}
.compare .cmp-scene {
  position: relative;
  display: grid;
  place-items: center;
  isolation: isolate;
  min-width: 0;
  height: 280px;
  margin: 0;
  background: #090a10;
}
.compare .cmp-scene::before {
  content: '';
  position: absolute;
  z-index: -2;
  inset: 0;
  background: var(--cmp-scene) var(--cmp-position) / cover no-repeat;
  opacity: .76;
  mask-image: radial-gradient(ellipse at 50% 46%, #000 48%, transparent 76%);
}
.compare .cmp-scene::after {
  content: '';
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(180deg, #090a100a 25%, #090a1070 78%, #090a10),
    linear-gradient(90deg, #090a1022, transparent 45%, #090a1044);
}
.compare .cmp-render {
  display: block;
  width: 100%;
  height: 256px;
  max-width: 160px;
  margin: 0;
  object-fit: contain;
  object-position: center;
  filter: drop-shadow(0 18px 10px #000c);
}
.compare .cmp-copy {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  min-width: 0;
  min-height: 280px;
  padding-top: 6px;
}
.compare .cmp-kind {
  margin: 0 0 9px;
  color: var(--cmp-accent);
  font: 700 13px/1.4 var(--sans, sans-serif);
  letter-spacing: .02em;
}
.compare .cmp-copy h3 {
  margin: 0 0 13px;
  font: 700 clamp(27px, 6.7vw, 34px)/.96 var(--slab, Georgia, serif);
  letter-spacing: -.03em;
}
.compare .cmp-copy h3 span { display: block; }
.compare .cmp-caffeine,
.compare .cmp-format {
  margin: 0 0 5px;
  font: 500 14px/1.4 var(--sans, sans-serif);
}
.compare .cmp-caffeine { font-weight: 700; }
.compare .cmp-size {
  margin: 6px 0 4px;
  color: var(--cmp-muted);
  font: 500 13px/1.4 var(--sans, sans-serif);
}
.compare .cmp-size span { white-space: nowrap; }
.compare .cmp-specs { margin: 0 0 5px; }
.compare .cmp-specs summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 44px;
  padding: 6px 0;
  cursor: pointer;
  list-style: none;
  color: var(--cmp-accent);
  font: 600 14px/1.35 var(--sans, sans-serif);
}
.compare .cmp-specs summary::-webkit-details-marker { display: none; }
.compare .cmp-specs summary::after {
  content: '+';
  flex: 0 0 auto;
  font: 500 20px/1 var(--sans, sans-serif);
  color: var(--cmp-accent);
}
.compare .cmp-specs[open] summary::after { content: '−'; }
.compare .cmp-specs dl { display: grid; gap: 10px; margin: 0 0 12px; }
.compare .cmp-specs dl > div { display: block; }
.compare .cmp-specs dt {
  margin: 0 0 2px;
  color: var(--cmp-muted);
  font: 700 11px/1.5 var(--sans, sans-serif);
  letter-spacing: .06em;
  text-transform: uppercase;
}
.compare .cmp-specs dd {
  margin: 0;
  color: var(--cmp-ink);
  font: 500 14px/1.5 var(--sans, sans-serif);
}
.compare .cmp-select {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 44px;
  margin-top: auto;
  padding: 7px 0;
  color: var(--cmp-accent);
  border-top: 1px solid #ffffff24;
  text-decoration: none;
  font: 700 14px/1.3 var(--sans, sans-serif);
}
.compare .cmp-select span { font-size: 19px; }
.compare .cmp-select:hover { color: var(--cmp-ink); }
.compare .cmp-select:focus-visible,
.compare .cmp-specs summary:focus-visible {
  outline: 2px solid var(--cmp-accent);
  outline-offset: 4px;
}

@media (min-width: 620px) {
  .compare .cmp-lineup { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 24px; }
  .compare .cmp-world { grid-template-columns: minmax(0, 1fr); gap: 16px; padding-bottom: 0; border-bottom: 0; }
  .compare .cmp-scene { height: 328px; }
  .compare .cmp-render { height: 300px; max-width: 190px; }
  .compare .cmp-copy { min-height: 286px; padding: 0 10px; }
  .compare .cmp-copy h3 { font-size: 34px; }
}

@media (min-width: 1040px) {
  .compare.compare { padding-top: 88px; padding-bottom: 88px; }
  .compare .cmp-header { margin-bottom: 40px; }
  .compare .cmp-lineup { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; }
  .compare .cmp-scene { height: 342px; }
  .compare .cmp-render { height: 316px; }
  .compare .cmp-copy { min-height: 298px; padding: 0 8px; }
  .compare .cmp-copy h3 { font-size: clamp(31px, 2.65vw, 38px); }
}

@media (max-width: 359px) {
  .compare .cmp-world { grid-template-columns: minmax(0, .78fr) minmax(0, 1.2fr); gap: 16px; }
  .compare .cmp-scene { height: 288px; }
  .compare .cmp-render { height: 242px; }
  .compare .cmp-copy h3 { font-size: 27px; }
}

/* Supplier facts stay compact; longer copy opens on demand. */
.product-marker{margin:5px 0 2px;color:var(--mute);font:600 12px/1.4 var(--sans);letter-spacing:.025em}
.product-marker::before,.cmp-kind::before{content:"";display:inline-block;width:5px;height:5px;margin:0 7px 2px 0;border-radius:50%;background:currentColor}
.compare .cmp-origin{margin:0 0 6px;color:var(--cmp-muted);font:500 13px/1.45 var(--sans)}
.compare .cmp-taste{margin:0 0 14px;color:var(--cmp-ink);font:600 16px/1.5 var(--sans)}
.compare .tasting-story{margin:0 0 12px;color:var(--cmp-ink);font:400 15px/1.65 var(--sans)}
.compare .tasting-extra{margin:0 0 16px;color:var(--cmp-muted);font:500 13px/1.5 var(--sans)}
@media(min-width:900px){.product-marker{font-size:13px}.compare .cmp-taste{min-height:48px}}

@media(max-width:619px){
  .compare .cmp-world{row-gap:0}
  .compare .cmp-copy{display:contents}
  .compare .cmp-scene{grid-column:1;grid-row:1 / span 7}
  .compare .cmp-copy > :nth-child(-n+7){grid-column:2;min-width:0}
  .compare .cmp-specs{grid-column:1 / -1;grid-row:8;margin-top:12px}
  .compare .cmp-select{grid-column:1 / -1;grid-row:9;margin-top:0}
}