/* Customer type sizes (16 Oct 2026). Ruben: "this should be built with regular text size in mind".
   Measured on 390 px phones against Shopify's Dawn theme, 401 Games and Face to Face Games: text 14-16 px, headings 23-30 px,
   card prices 14-16 px. Our body text was already 15-16 px; the headings, card prices and the page's base size were not.
   This file loads last on every client page (build-preview.py), so all the size rules sit in one place and are easy to undo. */

/* base text: 16 px, as the reference shops (was 18) */
body{font-size:1rem}

/* home hero: still the big poster line, but smaller (phone 68 -> 51 px, desktop 121 -> 95 px); its small line stays readable */
@media (max-width:700px){html body h1.hero-h#h-hero{font-size:min(13vw,8vh)}}
@media (min-width:701px) and (max-width:1100px){html body h1.hero-h#h-hero{font-size:min(9vw,13vh)}}
@media (min-width:1101px){html body h1.hero-h#h-hero{font-size:min(6.6vw,13vh)}}
html body h1.hero-h#h-hero .sub{font-size:max(14px,.255em)}

/* home section headings (phone 54-68 -> 34 px, desktop 78-81 -> 60 px); tag + class + id so they beat rules like #featured .head h2 */
html body h2.mega#h-games,html body h2.mega#h-feat,html body h2.mega#h-ig{font-size:clamp(2.125rem,4.2vw,3.75rem)}
html body h2.mega#h-shop{font-size:clamp(1.875rem,3.8vw,3.5rem)}

/* page titles: shop, game pages, information pages (phone 45-51 -> 36 px, desktop 86-99 -> 64 px) */
html body h1.ts-h1#ts-h1{font-size:clamp(2.25rem,4.4vw,4rem)}

/* product card prices (phone 18-22 -> 16 px, desktop up to 26 -> 18 px) */
html body .ts-page .ts-grid .pc-price{font-size:16px}
@media (min-width:701px){html body .ts-page .ts-grid .pc-price{font-size:18px}}

/* home game tile names (phone: Pokémon 35 -> 26 px, the others 21 -> 18 px) */
html body .gx .gx-name{font-size:clamp(1.15rem,1.7vw,1.8rem)!important}
html body .gx-poke .gx-name{font-size:clamp(1.6rem,2.6vw,2.8rem)!important}