/* Merch presentation follows the app typography and geometry. No animation or scripting required. */
:root{
--color-line:var(--line);--color-pink:var(--punch);--color-yel:var(--volt);--color-muted:var(--haze);--color-text:var(--paper);--color-ink:var(--deck);--color-cyan:var(--cool);--color-panel:var(--card);--color-deck:var(--deck);--font-display:var(--display);--shell-header:var(--head);
--radius-btn:18px;--radius-art:24px;--radius-chip:12px;--radius-pill:10px;--radius-panel:20px;
--text-meta:12px;--text-body:14px;--text-lead:16px;--text-title:20px;--text-hero:26px;--text-display:32px;--text-mega:40px;
}
.merch-page{padding-block:24px 44px;display:grid;gap:72px;min-width:0}
.merch-page section[id],.merch-page article[id]{scroll-margin-top:calc(var(--shell-header,72px) + 24px)}
.merch-hero{display:grid;grid-template-columns:minmax(0,1fr);gap:32px;align-items:center}
.merch-heroCopy{min-width:0;display:grid;justify-items:start;gap:20px}
.merch-eyebrow{color:var(--color-pink);font-size:var(--text-meta);font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.merch-hero h1{font-family:var(--font-display);font-size:var(--text-mega);font-weight:800;line-height:1.1;letter-spacing:-.04em;margin:0}
.merch-hero h1 span{color:var(--color-yel)}
.merch-hero p,.merch-diyCopy>p{font-size:var(--text-lead);line-height:1.65;color:var(--color-muted);max-width:40ch;margin:0}
.merch-actions{display:flex;flex-wrap:wrap;gap:12px;width:100%}
.merch-primaryAction,.merch-secondaryAction{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:56px;padding:14px 20px;border:2px solid var(--color-line);border-radius:var(--radius-btn);font-size:var(--text-lead);font-weight:700;text-decoration:none;line-height:1.4;text-align:center;overflow-wrap:anywhere}
.merch-primaryAction{background:var(--color-yel);color:var(--color-ink);border-color:var(--color-yel)}
.merch-secondaryAction{background:var(--color-panel);color:var(--color-text)}
.merch-primaryAction:hover,.merch-secondaryAction:hover{outline:2px solid var(--color-text);outline-offset:3px}
.merch-page a:focus-visible{outline:3px solid var(--color-cyan);outline-offset:4px}
.merch-page .merch-note{font-size:var(--text-meta);line-height:1.6;color:var(--color-muted);margin:0}
.merch-heroArt{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:520px;width:100%;justify-self:center}
.merch-heroMain,.merch-heroSmall{border:2px solid var(--color-line);border-radius:var(--radius-art);overflow:hidden;background:var(--color-text);aspect-ratio:1}
.merch-heroMain{grid-column:1/3;grid-row:1/3;box-shadow:6px 6px 0 var(--color-pink)}
.merch-heroArt img{width:100%;height:100%;object-fit:contain;display:block}
.merch-heroSmall{grid-column:3;width:100%}
.merch-catalog{display:grid;gap:40px;min-width:0}
.merch-catalogHeading{display:grid;gap:20px}
.merch-catalogHeading h2,.merch-diy h2{font-family:var(--font-display);font-size:var(--text-display);font-weight:800;line-height:1.25;letter-spacing:-.03em;margin:12px 0 0;overflow-wrap:anywhere}
.merch-categoryNav{display:flex;flex-wrap:wrap;gap:8px}
.merch-categoryNav a{display:inline-flex;align-items:center;min-height:44px;padding:10px 14px;border:2px solid var(--color-line);border-radius:var(--radius-chip);color:var(--color-text);font-size:var(--text-body);font-weight:700;text-decoration:none;background:var(--color-panel)}
.merch-categoryNav a:hover{border-color:var(--color-yel);color:var(--color-yel)}
.merch-group{display:grid;gap:20px;min-width:0}
.merch-groupHeading{display:flex;gap:16px;align-items:flex-start;border-top:2px solid var(--color-line);padding-top:24px}
.merch-groupHeading>span{font-size:var(--text-meta);font-weight:700;color:var(--color-yel);padding-top:5px}
.merch-groupHeading h2{font-family:var(--font-display);font-size:var(--text-hero);font-weight:800;line-height:1.25;margin:0}
.merch-groupHeading p{font-size:var(--text-body);line-height:1.6;margin:8px 0 0;color:var(--color-muted)}
.merch-productGrid{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;min-width:0}
.merch-product{min-width:0;display:flex;flex-direction:column;gap:18px}
.merch-productArt{position:relative;aspect-ratio:1;border:2px solid var(--color-line);border-radius:var(--radius-art);overflow:hidden;background:var(--color-text)}
.merch-productArt img{display:block;width:100%;height:100%;object-fit:contain}
.merch-status{position:absolute;bottom:12px;left:12px;background:var(--color-deck);border:2px solid var(--color-line);border-radius:var(--radius-pill);padding:7px 11px;color:var(--color-yel);font-size:var(--text-meta);font-weight:700;line-height:1.3}
.merch-productCopy{display:grid;gap:8px;padding-inline:2px}
.merch-product h3,.merch-steps h3{font-size:var(--text-title);font-weight:700;line-height:1.35;margin:0;overflow-wrap:anywhere}
.merch-product p{font-size:var(--text-body);line-height:1.65;color:var(--color-muted);margin:0;max-width:42ch}
.merch-diy{display:grid;gap:28px;padding:28px 20px;border:2px solid var(--color-line);border-radius:var(--radius-panel);background:var(--color-deck);min-width:0}
.merch-diyCopy{display:grid;justify-items:start;align-content:start;gap:20px;min-width:0}
.merch-diy h2{margin:0;color:var(--color-yel)}
.merch-diyPanel{display:grid;gap:24px;min-width:0}
.merch-logoPreview{display:flex;align-items:center;justify-content:center;min-height:140px;padding:24px;border:2px dashed var(--color-line);border-radius:var(--radius-panel);background:var(--color-ink)}
.merch-logoPreview img{width:100%;max-width:330px;height:auto}
.merch-steps{display:grid;gap:22px;margin:0;padding-left:24px}
.merch-steps li{padding-left:6px}
.merch-steps li::marker{color:var(--color-yel);font-size:var(--text-lead);font-weight:700}
.merch-steps h3{font-size:var(--text-lead)}
.merch-steps p{font-size:var(--text-body);line-height:1.65;color:var(--color-muted);margin:6px 0 0}
@media(min-width:480px){.merch-productGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.merch-heroArt{gap:14px}}
@media(min-width:900px){.merch-page{gap:96px;padding-block:40px 64px}.merch-hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px}.merch-hero h1{font-size:calc(var(--text-mega) * 1.6)}.merch-heroArt{max-width:580px}.merch-catalogHeading{display:flex;justify-content:space-between;gap:24px;align-items:end}.merch-diy{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);padding:40px;gap:48px}.merch-diy h2{font-size:var(--text-mega)}}
@media(min-width:1100px){.merch-productGrid{grid-template-columns:repeat(3,minmax(0,1fr))}.merch-group[id="wear"] .merch-productGrid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:379px){.merch-hero h1{font-size:var(--text-display)}.merch-actions>a,.merch-diyCopy>.merch-primaryAction{width:100%}.merch-diy{padding:24px 16px}.merch-catalogHeading h2,.merch-diy h2{font-size:var(--text-hero)}}
