/* The 1912 Society — brand system, matched to the Shopify storefront.
   Collegiate heritage club: Anton display + Fraunces serif + Hanken Grotesk body,
   Cardinal red (#C8102E) on warm white / off-black ink. */
:root{
  --red:#C8102E; --red-dark:#8A0E22; --ink:#18181B; --paper:#FAFAF7;
  --gray:#6B6B6E; --line:rgba(24,24,27,.14); --wash:#F1EFE8; --paper3:#E7E4DA;
  --font-display:"Anton","Arial Narrow",sans-serif;
  --font-serif:"Fraunces",Georgia,serif;
  --font-body:"Hanken Grotesk",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --ease:cubic-bezier(.22,1,.36,1);
}
*{box-sizing:border-box}
body{margin:0;font-family:var(--font-body);color:var(--ink);background:var(--paper);
     line-height:1.6;font-weight:420;-webkit-font-smoothing:antialiased;
     background-image:radial-gradient(rgba(24,24,27,.018) 1px,transparent 1px);background-size:3px 3px}
.topbar{height:8px;background:var(--red)}
.skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:#fff;padding:.5rem 1rem;z-index:10}
.skip:focus{left:0}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ---------- Header (dark ink, like storefront) ---------- */
.site-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.75rem;
             padding:.75rem 5vw;background:var(--ink);border-bottom:1px solid rgba(250,250,247,.1);
             position:sticky;top:0;z-index:60}
.wordmark{display:inline-flex;align-items:center;text-decoration:none;line-height:0}
.logo-img{height:46px;width:auto;display:block}
nav{display:flex;align-items:center;gap:1.35rem;flex-wrap:wrap}
nav a{position:relative;color:var(--paper);text-decoration:none;text-transform:uppercase;
      letter-spacing:.14em;font-weight:600;font-size:.82rem}
nav a::after{content:"";position:absolute;left:0;bottom:-4px;height:2px;width:0;background:var(--red);
             transition:width .22s var(--ease)}
nav a:hover{color:#fff}
nav a:hover::after{width:100%}

main{max-width:920px;margin:0 auto;padding:0 5vw 3.5rem}
h1,h2,h3{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.01em;line-height:.95;font-weight:400}
h1{font-size:clamp(2.4rem,1.8rem+3vw,4rem);margin:.5rem 0 1rem}
h2{font-size:clamp(1.5rem,1.2rem+1vw,2rem);border-bottom:3px solid var(--red);padding-bottom:.35rem;margin:2.4rem 0 1rem}
h3{font-size:1.15rem}
p{margin:0 0 1em}
a{color:var(--red)}
a:hover{color:var(--red-dark)}
.dim{color:var(--gray)}
.kicker{font-family:var(--font-serif);font-style:italic;color:var(--red);text-transform:none;
        letter-spacing:.01em;font-weight:600;font-size:1rem;margin:2.4rem 0 0;
        display:inline-flex;align-items:center;gap:.6rem}
.kicker::before{content:"";width:1.8rem;height:1px;background:var(--red)}
.lede{font-family:var(--font-serif);font-size:1.25rem;line-height:1.4;max-width:48ch}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
     background:var(--red);color:#fff;border:1.5px solid var(--red);
     padding:.8rem 1.5rem;font-family:var(--font-body);font-weight:700;text-transform:uppercase;
     letter-spacing:.12em;text-decoration:none;font-size:.8rem;cursor:pointer;border-radius:2px;
     transition:transform .18s var(--ease),background .18s var(--ease),border-color .18s var(--ease);min-height:46px}
.btn:hover{background:var(--red-dark);border-color:var(--red-dark);color:#fff;transform:translateY(-1px)}
.btn:focus-visible{outline:3px solid var(--red);outline-offset:2px}
.btn-lg{padding:1rem 1.8rem;font-size:.9rem}
.btn-ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn-ghost:hover{background:var(--ink);color:#fff}
.btn-join{background:var(--red);color:#fff !important;border-color:var(--red);padding:.55rem 1.15rem;min-height:0}
.btn-join:hover{background:var(--red-dark);border-color:var(--red-dark)}
.cta-row{display:flex;gap:.9rem;flex-wrap:wrap;margin:1.5rem 0}

/* ---------- Stats strip ---------- */
.stats{display:flex;gap:2.6rem;flex-wrap:wrap;list-style:none;padding:1.2rem 0;margin:1.6rem 0;
       border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.stats li{display:flex;flex-direction:column}
.stats strong{font-family:var(--font-display);font-size:2.1rem;color:var(--red);line-height:1}
.stats span{text-transform:uppercase;letter-spacing:.16em;font-size:.72rem;color:var(--gray);margin-top:.3rem}

.panel{margin-top:1.5rem}
.game-line{font-size:1.05rem}
.unlock-card{border:1px solid var(--line);border-left:4px solid var(--red);
             padding:1rem 1.2rem;margin:.9rem 0;background:var(--wash)}
.unlock-card h3{margin:.1rem 0 .4rem;font-size:1.05rem}
.unlock-card .meta{color:var(--gray);font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;margin-bottom:0}

/* ---------- Tables ---------- */
.tbl{width:100%;border-collapse:collapse;margin:1rem 0;font-size:.95rem}
.tbl th{background:var(--ink);color:#fff;text-transform:uppercase;letter-spacing:.08em;
        font-size:.72rem;text-align:left;padding:.55rem .7rem}
.tbl td{padding:.55rem .7rem;border-bottom:1px solid var(--line)}
.tbl tr:nth-child(even) td{background:var(--wash)}

.legalpage p{max-width:65ch}

.stack{display:flex;flex-direction:column;gap:.7rem;max-width:440px}
.stack label{display:flex;flex-direction:column;font-weight:700;text-transform:uppercase;
             font-size:.72rem;letter-spacing:.1em;gap:.3rem}
input{padding:.7rem .8rem;border:1.5px solid var(--ink);font-size:1rem;font-family:inherit;border-radius:2px;background:var(--paper)}
input:focus-visible{outline:3px solid var(--red);outline-offset:1px}

/* ---------- Footer ---------- */
.site-footer{background:var(--ink);color:#fff;margin-top:3.5rem}
.site-footer a{color:#fff;text-decoration:underline;text-underline-offset:2px}
.site-footer a:hover{color:var(--red)}
.capture{padding:2.4rem 5vw 1rem;max-width:920px;margin:0 auto}
.capture h2{color:#fff;border-color:var(--red)}
.capture p{color:rgba(250,250,247,.85)}
.capture form{display:flex;gap:.6rem;flex-wrap:wrap;max-width:480px}
.capture input{flex:1;min-width:220px;border-color:#fff;color:var(--ink)}
.legal{padding:1rem 5vw 2.2rem;max-width:920px;margin:0 auto;font-size:.85rem}
.legal .dim{color:rgba(250,250,247,.6)}

@media (max-width:560px){
  .stats{gap:1.4rem}
  .cta-row .btn{width:100%;text-align:center}
  .logo-img{height:40px}
}

/* ---------- Merch / cards ---------- */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.2rem}
.product-card{border:1px solid var(--line);padding:1rem;display:flex;flex-direction:column;gap:.5rem;background:#fff}
.product-card img{width:100%;aspect-ratio:1;object-fit:cover;border-bottom:3px solid var(--red)}
.product-card h3{margin:0;font-size:1rem;font-family:var(--font-body);font-weight:700;text-transform:none}
.product-card .btn{margin-top:auto;text-align:center}

/* ---------- Sports / schedule ---------- */
.sport-tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin:1rem 0 1.5rem}
.sport-tabs a{display:inline-block;padding:.5rem .95rem;border:1.5px solid var(--ink);color:var(--ink);
text-decoration:none;text-transform:uppercase;letter-spacing:.08em;font-weight:700;font-size:.78rem;border-radius:2px}
.sport-tabs a.on{background:var(--red);border-color:var(--red);color:#fff}
.sport-tabs a:hover{background:var(--ink);color:#fff}
.live-strip{border:3px solid var(--red);padding:1rem 1.2rem;background:var(--wash)}
.live-strip h2{border-bottom:none;margin:0 0 .5rem;color:var(--red)}
.live-dot{display:inline-block;width:.65em;height:.65em;border-radius:50%;background:var(--red);
animation:livepulse 1.4s ease-in-out infinite;vertical-align:baseline}
@keyframes livepulse{0%,100%{opacity:1}50%{opacity:.35}}
.record-line{color:var(--gray);text-transform:uppercase;letter-spacing:.08em;font-size:.8rem;font-weight:700;margin:-.5rem 0 1rem}
.evt-badge{display:inline-block;background:var(--red);color:#fff;font-size:.68rem;font-weight:800;
text-transform:uppercase;letter-spacing:.06em;padding:.15rem .45rem;margin-left:.4rem;text-decoration:none;border-radius:2px}
.commit-tbl td:first-child{font-weight:700}
.stars{color:var(--red);letter-spacing:.1em}