/* The approved clubhouse identity. Fonts are self-hosted, including on privacy. */
@font-face{font-family:Bodoni;src:url('./fonts/BodoniModa-Medium.ttf') format('truetype');font-weight:500;font-display:swap}
@font-face{font-family:Bodoni;src:url('./fonts/BodoniModa-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
@font-face{font-family:Bodoni;src:url('./fonts/BodoniModa-MediumItalic.ttf') format('truetype');font-weight:500;font-style:italic;font-display:swap}
@font-face{font-family:Archivo;src:url('./fonts/Archivo-Medium.ttf') format('truetype');font-weight:400 500;font-display:swap}
@font-face{font-family:Archivo;src:url('./fonts/Archivo-SemiBold.ttf') format('truetype');font-weight:600 900;font-display:swap}
:root{color-scheme:dark;--ink:#052E23;--cream:#F4EFE2;--cream-dim:rgba(244,239,226,.8);--gold:#C19E5E;--moss:#304B3C;--card:#304B3C;--hairline:rgba(193,158,94,.35)}
body{background:var(--ink);color:var(--cream);font-family:Archivo,system-ui,sans-serif;overflow-wrap:break-word}
h1,h2,h3,.brand,.noads{font-family:Bodoni,Georgia,serif;font-weight:500;letter-spacing:0;text-transform:none;color:var(--cream)}
h1{font-size:clamp(2.25rem,6vw,3.5rem);line-height:1.15}
h2{font-size:1.8rem;line-height:1.25}
.card h3{font-size:1.65rem;font-weight:500;line-height:1.3}
a{color:var(--gold);text-underline-offset:4px}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #E0C387;outline-offset:5px}
.cta,.error-page a.home,a.action,button{background:var(--moss);border:1px solid var(--gold);border-radius:10px;color:var(--cream);font:500 1.35rem/1.3 Bodoni,Georgia,serif;min-height:48px}
.cta:hover,a.action:hover,button:hover,a.home:hover{filter:brightness(1.12)}
.card,.contact,.tldr{border:1px solid var(--hairline);border-radius:12px;background:var(--card)}
.home,.hint,#copy-status,.label,footer a{color:var(--cream-dim)}
details p{font-size:1rem}
summary{font-weight:500;min-height:44px;align-content:center}
#name{color:var(--gold)}
#store,button{background:var(--ink);border-color:var(--gold);color:var(--cream)}
.brand{font-size:1.6rem}
.brand img{border-radius:10px}
.landing .wrap{max-width:960px}
.landing header{position:relative;isolation:isolate;padding:64px 0 64px;background:var(--ink)}
.landing header::before{content:'';position:absolute;z-index:-1;inset:0 0 auto;height:620px;background:linear-gradient(180deg,rgba(5,46,35,.48),rgba(5,46,35,.5) 45%,rgba(5,46,35,.12) 64%,#052E23 100%),url('./media/clubhouse-mountains.jpg') center 54%/cover no-repeat}
.landing .crest{width:156px;margin-bottom:16px;filter:url(#clubhouse-crest) drop-shadow(0 4px 18px rgba(5,46,35,.4))}
.landing h1{font-size:clamp(2.5rem,6.7vw,5rem);font-weight:700;text-shadow:0 3px 24px rgba(5,46,35,.7)}
.landing .platform{display:flex;align-items:center;justify-content:center;gap:20px;font-size:.875rem;letter-spacing:.18em;color:var(--cream);margin:20px 0 0;text-shadow:0 2px 8px #052E23}
.landing .platform::before,.landing .platform::after{content:'';height:1px;width:64px;background:#E0C387}
.landing .tagline{margin:180px auto 0;font:500 clamp(2.1rem,5vw,3.5rem)/1.15 Bodoni,Georgia,serif;max-width:780px;color:var(--cream)}
.landing .tagline em{font-weight:500}
.landing .promise{max-width:600px;font-size:1.0625rem}
.landing .cta{margin-top:28px;padding:17px 32px}
.landing section{padding:64px 0}
.landing h2{font-size:clamp(1.8rem,4vw,2.5rem);margin-bottom:32px}
.landing .card{padding:28px 32px}
.landing #how .card{background:transparent;border-width:0 0 1px;border-radius:0;padding:24px 0}
.landing .noads{font-weight:500;color:var(--cream)}
.landing .noads .rule,.landing .noads .rule.r{background:var(--gold)}
.landing .big{font-family:Archivo,system-ui,sans-serif;font-weight:600;font-variant-numeric:tabular-nums}
.landing .phone{border-color:var(--gold);box-shadow:0 12px 30px rgba(0,0,0,.2)}
.landing .phone .snd{font-size:.875rem;background:rgba(5,46,35,.9)}
.landing footer nav{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 0}
.landing footer nav a{display:inline-flex;align-items:center;min-height:44px}
@media(max-width:600px){
  .landing header{padding-top:40px}
  .landing header::before{height:530px}
  .landing .crest{width:132px}
  .landing .tagline{margin-top:155px}
  .landing .platform{font-size:.75rem;gap:12px}
  .landing .platform::before,.landing .platform::after{width:40px}
  .landing section{padding:44px 0}
  .landing .card{padding:24px}
  .landing .clips{gap:28px}
  .landing .clip,.landing #games .clip{flex:0 1 250px}
}