/* The public face — landing, register, events. BRIGHT surfaces (ruling
   2026-07-26: the poster is framed artwork, never a background under text),
   with the sign-in gate staying stage-dark. Same sandstone accent family as
   the admin and the player: one design system, three surfaces. */
:root{
  --bg:#f6f3ec; --panel:#ffffff; --panel2:#fbf9f4;
  --line:rgba(28,39,51,.09); --line-med:rgba(28,39,51,.16);
  --ink:#1c2733; --dim:rgba(28,39,51,.66); --dimmer:rgba(28,39,51,.48); --faint:rgba(28,39,51,.32);
  --accent:#b3873f; --accent-strong:#8a6526; --accent-tint:rgba(179,135,63,.1);
  --live:#0e9e94;
  /* the dark gate keeps the stage palette, scoped */
  --g-bg:#0c141b; --g-panel:#121d26; --g-line:rgba(255,255,255,.09); --g-line-med:rgba(255,255,255,.17);
  --g-ink:#eef4f8; --g-dim:rgba(238,244,248,.6); --g-faint:rgba(238,244,248,.26);
  --g-accent:#d5a967; --g-accent-2:#f0cf99;
  --font:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --r-m:12px; --r-l:18px;
  --ease:cubic-bezier(.4,0,.2,1);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100vh}
body{background:
    radial-gradient(1100px 600px at 85% -10%, rgba(179,135,63,.12) 0%, rgba(179,135,63,0) 60%),
    var(--bg);
  color:var(--ink);font-family:var(--font);letter-spacing:-.01em;-webkit-font-smoothing:antialiased}

.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:15.5px;letter-spacing:-.025em;color:inherit;white-space:nowrap}
.brand .mk{width:22px;height:22px;border-radius:7px;background:linear-gradient(140deg,#d5a967,#a37c42);display:grid;place-items:center;flex:0 0 auto}
.brand .mk svg{width:13px;height:13px;stroke:#0d0904;stroke-width:2.4;fill:none;stroke-linecap:round}

/* ---------- the dark gate (sign-in / register card) ---------- */
.gate{display:flex;flex-direction:column;justify-content:center;padding:48px 44px;
  background:linear-gradient(180deg,var(--g-panel) 0%,var(--g-bg) 100%);color:var(--g-ink)}
.gate .brand{margin-bottom:38px}
.gate h1{font-size:24px;font-weight:800;letter-spacing:-.035em;margin:0 0 4px}
.gate .sub{color:var(--g-dim);font-size:13.5px;margin-bottom:26px;line-height:1.45}
.fld{display:block;margin-bottom:12px}
.fld .lb{display:block;font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--g-faint);margin-bottom:6px}
.gate .i{width:100%;height:46px;padding:0 14px;background:rgba(255,255,255,.05);border:1px solid var(--g-line-med);border-radius:var(--r-m);
  color:var(--g-ink);font-family:var(--font);font-size:14.5px;transition:border-color .15s}
.gate .i:focus{outline:none;border-color:var(--g-accent)}
.btn{display:flex;align-items:center;justify-content:center;width:100%;height:48px;border:none;border-radius:var(--r-m);
  background:var(--g-accent);color:#0d0904;font-family:var(--font);font-size:14.5px;font-weight:800;letter-spacing:-.01em;
  cursor:pointer;transition:background .15s var(--ease)}
.btn:hover{background:var(--g-accent-2)}
.err{background:rgba(190,60,60,.14);border:1px solid rgba(190,60,60,.4);color:#f0b9b9;border-radius:var(--r-m);
  padding:10px 14px;font-size:13px;font-weight:600;margin-bottom:14px}
.hintline{color:var(--g-dim);font-size:12.5px;margin-top:14px;text-align:center}
.hintline a{color:var(--g-accent);font-weight:700;text-decoration:none}

/* ---------- the split landing (register still uses it) ---------- */
.split{display:grid;grid-template-columns:minmax(360px,420px) minmax(0,1fr);min-height:100vh}

/* ---------- front of house: public top bar + CTA ---------- */
.pubtop{display:flex;align-items:center;gap:14px;padding:0 30px;height:60px}
.pubtop .sp{flex:1}
.teamlink{color:var(--dimmer);text-decoration:none;font-size:12.5px;font-weight:700;border:1px solid var(--line-med);
  border-radius:9px;padding:8px 14px;transition:color .15s,border-color .15s,background .15s}
.teamlink:hover{color:var(--ink);border-color:var(--accent);background:var(--panel)}
.hero.pub{min-height:calc(100vh - 60px);padding-top:20px}
.cta{margin-top:30px}
.btn.gold{display:inline-flex;width:auto;padding:0 30px;height:52px;background:var(--accent);color:#fff;
  border-radius:14px;font-size:15px;box-shadow:0 10px 28px rgba(179,135,63,.35);text-decoration:none}
.btn.gold:hover{background:var(--accent-strong)}
.ctasub{margin-top:12px;color:var(--dimmer);font-size:13px;font-weight:600}
.ctasub a{color:var(--accent-strong);font-weight:750;text-decoration:none}

/* ---------- the standalone door (login) ---------- */
.onecard{min-height:100vh;display:grid;place-items:center;padding:30px}
.gate.card{border-radius:20px;min-width:min(430px,92vw);max-width:430px;box-shadow:0 30px 70px rgba(28,39,51,.25);
  border:1px solid rgba(255,255,255,.06)}

/* ---------- the event hero: clean type + the poster as ARTWORK ---------- */
.hero{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(260px,400px);gap:56px;align-items:center;
  padding:56px 64px;min-height:100vh}
.hero.noart{grid-template-columns:1fr}
.kicker{font-size:11.5px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--accent-strong);margin-bottom:12px}
.evtitle{font-size:clamp(34px,4.2vw,62px);font-weight:800;letter-spacing:-.04em;line-height:1;margin:0 0 14px;text-transform:uppercase}
.evtitle em{font-style:normal;color:var(--accent)}
.tagline{color:var(--dim);font-size:clamp(14px,1.3vw,17px);font-weight:600;margin-bottom:22px}
.scripture{color:var(--dimmer);font-size:13.5px;line-height:1.55;max-width:52ch;margin-bottom:28px;
  border-left:2px solid var(--accent);padding-left:14px}

.count{display:flex;gap:12px;margin-bottom:28px}
.count .cell{min-width:84px;padding:13px 10px;text-align:center;background:var(--panel);border:1px solid var(--line);
  border-radius:var(--r-l);box-shadow:0 6px 22px rgba(28,39,51,.06)}
.count .n{font-size:clamp(26px,2.6vw,38px);font-weight:800;letter-spacing:-.04em;font-variant-numeric:tabular-nums;line-height:1.05}
.count .u{font-size:9.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);margin-top:4px}
.count.live .cell{border-color:rgba(14,158,148,.4)}
.count.live .n{color:var(--live)}

/* each fact is a tidy two-line stack: bold primary, quiet detail beneath */
.facts{display:grid;gap:14px;color:var(--dim);font-size:14px;font-weight:650}
.facts .f{display:grid;grid-template-columns:18px minmax(0,1fr);gap:11px;align-items:start}
.facts svg{width:17px;height:17px;margin-top:2px;stroke:var(--accent-strong);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.facts b{display:block;color:var(--ink);font-size:15px;letter-spacing:-.015em}
.facts .fs{display:block;color:var(--dimmer);font-size:12.5px;font-weight:600;margin-top:2px;line-height:1.45}

/* the poster carousel — framed art; its own text lives inside its own frame */
.postercar{position:relative;width:100%;aspect-ratio:4/5;border-radius:20px;overflow:hidden;
  box-shadow:0 30px 70px rgba(28,39,51,.22), 0 4px 16px rgba(28,39,51,.1);background:var(--panel2)}
.postercar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s var(--ease)}
.postercar img.on{opacity:1}
.pdots{display:flex;gap:7px;justify-content:center;margin-top:14px}
.pdots i{width:7px;height:7px;border-radius:50%;background:var(--line-med);cursor:pointer;transition:background .2s,transform .2s}
.pdots i.on{background:var(--accent);transform:scale(1.25)}
.pdots:empty{display:none}

@media (max-width:1060px){
  .hero{grid-template-columns:1fr;gap:30px;padding:40px 28px;min-height:0}
  .posterside{order:-1;max-width:340px;margin:0 auto}
}
@media (max-width:900px){
  .split{grid-template-columns:1fr}
  .gate{order:1;padding:36px 24px 46px}
}

/* ---------- events page ---------- */
.evtop{display:flex;align-items:center;gap:14px;padding:0 26px;height:58px;background:var(--g-bg);color:var(--g-ink);
  border-bottom:1px solid var(--g-line);position:sticky;top:0;z-index:5}
.evtop .sp{flex:1}
.evtop .who{color:var(--g-dim);font-size:12.5px;font-weight:650}
.evtop a.out{color:var(--g-dim);text-decoration:none;font-size:12.5px;font-weight:700;border:1px solid var(--g-line-med);
  border-radius:9px;padding:7px 13px;transition:color .15s,border-color .15s}
.evtop a.out:hover{color:var(--g-ink);border-color:var(--g-accent)}
.evwrap{max-width:1160px;margin:0 auto;padding:0 24px 70px}
.evwrap .hero{min-height:0;padding:46px 0}
.evlist{display:grid;gap:18px;margin-top:26px}
.evcard{display:grid;grid-template-columns:150px minmax(0,1fr);gap:22px;background:var(--panel);border:1px solid var(--line);
  border-radius:var(--r-l);overflow:hidden;box-shadow:0 6px 22px rgba(28,39,51,.05)}
.evcard .thumb{background-size:cover;background-position:center;min-height:150px;background-color:var(--panel2)}
.evcard .bd{padding:18px 22px 18px 0;display:flex;flex-direction:column;gap:6px;justify-content:center}
.evcard h3{margin:0;font-size:18px;font-weight:800;letter-spacing:-.025em}
.evcard .meta{color:var(--dim);font-size:13px;font-weight:600}
.evcard .tag{color:var(--dimmer);font-size:12.5px}
.evcard .until{color:var(--accent-strong);font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.seclab{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);font-weight:800;margin:0}
@media (max-width:640px){ .evcard{grid-template-columns:1fr} .evcard .bd{padding:0 18px 18px} }