/* Live design + Clash of Clans style display font (design mode "font").
   Only the display typeface changes: headings, buttons, brand, highlighted numbers.
   Body copy, forms, tables and legal text keep the existing text font. */
@font-face{font-family:"CB Clash";src:url("/assets/fonts/clash/Clash_Bold.otf.ttf") format("truetype");font-weight:700 900;font-display:swap}
@font-face{font-family:"CB Clash";src:url("/assets/fonts/clash/Clash_Regular.otf.ttf") format("truetype");font-weight:400 600;font-display:swap}

/* Every V1 element that already uses the display font follows this variable */
:root{--font-display:"CB Clash","Inter Tight","Inter",-apple-system,BlinkMacSystemFont,sans-serif}

/* The game face is wider than Inter Tight: undo the tight negative tracking */
h1,h2,h3,.v2-h1,.base-title,.page-head h1{letter-spacing:.01em!important}

/* Buttons and brand get the game face as well */
.btn,.nav-cta,.v2-btn,.v2-search-btn,.brand-text,.footer-brand-name,.v2-choice-chip,.brand-pill{font-family:var(--font-display);letter-spacing:.02em}

/* Long-form and legal pages: section headings stay in the text face for readability */
.legal-card :is(h2,h3,h4),.prose :is(h2,h3,h4),.seo-editorial :is(h2,h3),.seo-faq summary{font-family:var(--font-body);letter-spacing:0!important}

/* Same visual size as before: the game face is wider and heavier than Inter Tight */
h1{font-size:clamp(2rem,4.8vw,3.9rem)}
.v2-h1{font-size:clamp(2.5rem,5.2vw,4.6rem)!important;line-height:.95}
@media(max-width:768px){.v2-h1{font-size:clamp(2.3rem,10.5vw,3.4rem)!important}}
@media(max-width:480px){.btn{white-space:normal;max-width:100%;text-align:center;line-height:1.15}}
@media(max-width:360px){.v2-search-btn{padding-left:12px!important;padding-right:12px!important;font-size:.85rem!important}.v2-search-input{min-width:0}}
