@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@400;500;600;700&family=Playfair+Display:wght@600;700&display=swap');

:root,
:root:not([data-theme="light"]){
  color-scheme:light;
  --brand-bone:#f4f2ee;
  --brand-ink:#0b0b0c;
  --brand-serif:"Playfair Display",Georgia,serif;
  --brand-sans:"Barlow",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --bg:#f4f2ee;
  --surface:#fff;
  --tile:#f8f6f2;
  --ink:#0b0b0c;
  --muted:#625f59;
  --line:#d7d1c7;
  --accent:#0b0b0c;
  --accent-ink:#fff;
  --ok:#2f6b4f;
  --ok-soft:#e6f0e9;
  --warn:#9b5c1c;
  --bad:#a93636;
  --shadow:0 1px 0 rgba(11,11,12,.06),0 12px 30px rgba(11,11,12,.05);
}

body{font-family:var(--brand-sans)}
h1,h2{font-family:var(--brand-serif);font-weight:600;letter-spacing:-.025em}

.mast{background:var(--brand-bone);border-bottom:1px solid var(--brand-ink)}
.mast .in{max-width:1080px;margin:0 auto;padding:0 18px;min-height:74px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:9px;min-height:44px;color:var(--ink);text-decoration:none}
.brand:hover{text-decoration:none}
.brand-logo{width:38px;height:42px;object-fit:contain;flex:0 0 38px}
.brand-copy{display:flex;flex-direction:column;line-height:1.04}
.brand-copy b{font-size:15px;letter-spacing:-.01em}
.brand-copy small{font-size:9px;line-height:1.4;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-weight:600}
.mast nav{display:flex;gap:20px;align-items:center;margin-left:12px;font-size:13.5px;color:var(--muted)}
.mast nav a{color:var(--muted);text-decoration:none}
.mast nav a[aria-current]{color:var(--ink);font-weight:600}
.mast .right{margin-left:auto;display:flex;gap:10px;align-items:center}
.pill{border:1px solid var(--line);border-radius:999px;padding:5px 12px;font-size:11.5px;color:var(--muted);white-space:nowrap}

.brand-hero{display:grid;grid-template-columns:minmax(0,1fr) 310px;align-items:center;gap:28px;margin:-14px 0 18px}
.brand-hero .lede{margin-bottom:0}
.eyebrow{margin:0 0 10px;color:var(--accent);font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:700}
.mascot-stage{align-self:end;display:flex;justify-content:center;align-items:flex-end;min-height:270px;position:relative;overflow:hidden;border-bottom:1px solid var(--brand-ink)}
.mascot-hero{display:block;width:min(100%,290px);max-height:300px;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 16px 18px rgba(11,11,12,.12))}

.card{border-radius:4px;box-shadow:none}
.btn,.field,textarea,.primary,#gate input{border-radius:2px}
.chip{border-radius:2px}

@media(max-width:760px){
  .brand-hero{grid-template-columns:1fr;margin-top:0;gap:8px}
  .mascot-stage{min-height:180px;justify-content:flex-end}
  .mascot-hero{width:210px;max-height:210px}
}
@media(max-width:560px){
  .brand-logo{width:32px;height:36px;flex-basis:32px}
  .brand-copy b{font-size:14px}
  .brand-copy small{font-size:8px}
  .mast nav,.mast .pill{display:none}
}