/* DeltaEtaSummit: locked look from design/LOCKED-SETTINGS.json (2026-10-28) */
:root{
  --gold:#cfb53b; --gold-hi:#e8d27a; --purple:#7b3fd9; --bg:#0b031c; --card:#1c0a3d;
  --glow:.5; --grid:.45; --grid-speed:3s; --letter-a:.5; --letter-size:51cqw; --h1:78px; --radius:40px;
  --gap:16px; --width:1025px; --login-shift:-100px;
  --text:#f4effb; --muted:#cbbde6; --ease:cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font:16px/1.55 system-ui,-apple-system,"Segoe UI",sans-serif;overflow-x:hidden}
a{color:inherit}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:0 16px;border-radius:99px;font-weight:700;text-decoration:none;border:2px solid var(--gold);cursor:pointer;font-size:14px;transition:transform .3s var(--ease),background .3s}
.btn.solid{background:var(--gold);color:#12062a}
.btn.ghost{color:var(--gold-hi);background:transparent}
.btn:hover{transform:translateY(-3px)}
:focus-visible{outline:3px solid #fff;outline-offset:3px}
.skip{position:absolute;left:-999px;top:8px;background:var(--gold);color:#12062a;padding:8px 14px;border-radius:8px;z-index:10}
.skip:focus{left:8px}

.look{position:relative;overflow:hidden;min-height:100svh;container-type:inline-size}
.stage{position:absolute;inset:0;overflow:hidden;perspective:700px}
.glow{position:absolute;width:70%;aspect-ratio:1;left:50%;top:-20%;transform:translateX(-50%);background:radial-gradient(circle,color-mix(in srgb,var(--purple) calc(var(--glow)*100%),transparent),transparent 62%);filter:blur(20px)}
.grid{position:absolute;left:-50%;right:-50%;bottom:-10%;height:70%;
  background-image:linear-gradient(color-mix(in srgb,var(--gold) calc(var(--grid)*100%),transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--gold) calc(var(--grid)*100%),transparent) 1px,transparent 1px);
  background-size:56px 56px;transform:rotateX(62deg);transform-origin:50% 100%;animation:grid var(--grid-speed) linear infinite;mask-image:linear-gradient(to top,#000 20%,transparent 90%)}
.letter{position:absolute;font-family:Georgia,"Times New Roman",serif;font-weight:700;line-height:.8;font-size:var(--letter-size);color:transparent;-webkit-text-stroke:2px color-mix(in srgb,var(--gold) calc(var(--letter-a)*100%),transparent);pointer-events:none;user-select:none}
.letter.d{left:-3cqw;top:6vh;animation:drift 14s ease-in-out infinite alternate}
.letter.h{right:-3cqw;bottom:2vh;animation:drift 16s ease-in-out infinite alternate-reverse}

.hero{position:relative;z-index:2;min-height:100svh;max-width:var(--width);margin:0 auto;padding:110px 24px 64px;display:grid;gap:36px;align-items:center;grid-template-columns:1fr}
.copy{display:flex;flex-direction:column;gap:var(--gap);min-width:0}
h1{font-size:min(var(--h1),11.5cqw);line-height:1.04;font-weight:800;letter-spacing:-.02em}
h1 .gold{background:linear-gradient(90deg,var(--gold-hi),var(--gold),#fff,var(--gold),var(--gold-hi));background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:sheen 5s linear infinite}
.login{justify-self:center;translate:0 var(--login-shift);background:color-mix(in srgb,var(--card) 80%,transparent);border:1px solid color-mix(in srgb,var(--gold) 55%,transparent);border-radius:var(--radius);padding:24px;max-width:360px;width:100%;backdrop-filter:blur(10px);box-shadow:0 0 60px color-mix(in srgb,var(--purple) 45%,transparent)}
.login h2{font-size:20px;margin-bottom:8px}
.login label{display:block;font-size:13px;margin:10px 0 4px;color:var(--gold-hi)}
.login input{width:100%;min-height:46px;border-radius:10px;border:1px solid #b9a4e6;background:#0f0522;color:var(--text);padding:0 12px;font-size:16px}
.login .btn{width:100%;margin-top:16px}
.login small{display:block;margin-top:10px;font-size:12px;color:var(--muted)}
.login .err{color:#ffb4b4;font-size:13px;margin-top:8px;min-height:18px}

.js .reveal{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.js .reveal.in{opacity:1;transform:none}
@keyframes grid{to{background-position:0 56px}}
@keyframes sheen{to{background-position:200% 0}}
@keyframes drift{from{transform:translate(0,0)}to{transform:translate(2cqw,-2vh)}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.js .reveal{opacity:1;transform:none}html{scroll-behavior:auto}}

/* members page (sample data only) */
.wrap{position:relative;z-index:2;max-width:1025px;margin:0 auto;padding:32px 24px 64px}
.bar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:28px}
.bar b{font-size:20px;color:var(--gold-hi)}
.banner{border:1px dashed var(--gold);border-radius:12px;padding:10px 14px;color:var(--gold-hi);font-size:14px;margin-bottom:24px}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:32px}
.tile{background:color-mix(in srgb,var(--card) 85%,transparent);border:1px solid color-mix(in srgb,var(--gold) 45%,transparent);border-radius:20px;padding:18px}
.tile p{color:var(--muted);font-size:14px}.tile strong{display:block;font-size:30px;color:var(--gold-hi)}
h2.sec{font-size:22px;margin:28px 0 12px}
.events{list-style:none;padding:0;display:grid;gap:10px}
.events li{background:color-mix(in srgb,var(--card) 85%,transparent);border-radius:14px;padding:14px 16px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.tbl{overflow-x:auto}
table{width:100%;border-collapse:collapse;min-width:420px}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid rgba(207,181,59,.25)}
th{color:var(--gold-hi);font-size:13px}
.paid{color:#9be9a8}.due{color:#ffd28a}

/* profile + welcome (demo) */
.card{max-width:560px;margin:0 auto;background:color-mix(in srgb,var(--card) 85%,transparent);border:1px solid color-mix(in srgb,var(--gold) 55%,transparent);border-radius:var(--radius);padding:24px;box-shadow:0 0 60px color-mix(in srgb,var(--purple) 40%,transparent)}
.card h1{font-size:clamp(26px,5vw,36px);margin-bottom:6px}
.card .hint{color:var(--muted);font-size:14px;margin-bottom:12px}
.card label,.card legend{display:block;font-size:13px;margin:12px 0 4px;color:var(--gold-hi)}
.card input[type=text],.card input[type=tel],.card input[type=number],.card input[type=password],.card select{width:100%;min-height:46px;border-radius:10px;border:1px solid #b9a4e6;background:#0f0522;color:var(--text);padding:0 12px;font-size:16px}
.card .two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:420px){.card .two{grid-template-columns:1fr}}
.card fieldset{border:0;padding:0;margin:0}
.card .radio{display:flex;align-items:center;gap:10px;min-height:44px;color:var(--text);font-size:15px;margin:0}
.card .radio input{width:22px;height:22px;accent-color:var(--gold)}
.card .btn{margin-top:18px;margin-right:8px}
.card .field-err{color:#ffb4b4;font-size:13px;min-height:16px}
.review dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:12px 0}
.review dt{color:var(--gold-hi);font-size:13px}.review dd{font-size:18px;font-weight:600;overflow-wrap:anywhere}
.review .warn{border:1px dashed var(--gold);border-radius:12px;padding:10px 12px;font-size:14px;color:var(--gold-hi)}
.welcome{position:relative;z-index:2;min-height:100svh;display:grid;place-items:center;text-align:center;padding:48px 20px}
.welcome .small{color:var(--gold-hi);font:600 14px ui-monospace,Menlo,monospace;letter-spacing:.14em}
.welcome .name{font-size:clamp(40px,11vw,104px);font-weight:800;line-height:1.02;letter-spacing:-.02em;margin:10px 0;overflow-wrap:anywhere}
.welcome .pledge{font-size:clamp(26px,6vw,56px);font-weight:700;color:var(--gold-hi)}
.welcome .line{font-size:clamp(22px,5vw,44px);font-family:Georgia,serif;font-style:italic;color:var(--text)}
.gk{background:linear-gradient(90deg,var(--gold-hi),var(--gold),#fff,var(--gold),var(--gold-hi));background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:sheen 5s linear infinite}
.sweep{position:fixed;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.sweep span{position:absolute;top:50%;left:0;font:700 clamp(120px,32vw,420px)/1 Georgia,serif;color:transparent;-webkit-text-stroke:2px color-mix(in srgb,var(--gold) 55%,transparent);white-space:nowrap;translate:-110% -50%;opacity:0}
.sweep.go span{opacity:1;animation:cross 9s ease-in-out forwards}
@keyframes cross{to{translate:110vw -50%}}
.ctl{position:fixed;z-index:5;left:0;right:0;bottom:14px;display:flex;gap:10px;justify-content:center;flex-wrap:wrap;padding:0 12px}
.ctl .btn{margin:0;min-height:32px;background:rgba(18,6,42,.85)}
.fade{position:fixed;inset:0;z-index:4;background:var(--bg);opacity:0;pointer-events:none;transition:opacity 2.5s linear}
.fade.on{opacity:1}
.credit{position:fixed;z-index:3;top:8px;left:12px;font-size:11px;color:var(--muted);max-width:60ch}
@media (prefers-reduced-motion:reduce){.sweep span{animation:none;display:none}.fade{transition:none}}

/* shield (PDub's own pendant photo, transparent PNG), faded behind content */
.shield{position:absolute;left:50%;top:50%;translate:-50% -50%;width:min(62cqw,560px);height:auto;opacity:.1;pointer-events:none;user-select:none;animation:float 14s ease-in-out infinite alternate}
@keyframes float{from{scale:1}to{scale:1.05}}
.shield.big{position:fixed;z-index:1;width:min(78vw,640px);opacity:0;transition:opacity 5s ease-in;filter:brightness(calc(1 + var(--beat,0) * .45));animation:none}
.shield.big.in{opacity:.16}
/* slow staged reveal on the welcome page */
.rv{display:inline-block;opacity:0;transform:translateY(26px) scale(.97);filter:blur(10px);transition:opacity 2s var(--ease),transform 2s var(--ease),filter 2s var(--ease)}
.rv.in{opacity:1;transform:none;filter:none}
.welcome .name{display:block;scale:calc(1 + var(--beat,0) * .018)}
.welcome .name .gk{padding:0 .12em}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;filter:none;transition:none}.shield,.shield.big{animation:none;transition:none}.shield.big{opacity:.16}.welcome .name{scale:1}}
.ctl .btn.solid{background:var(--gold);color:#12062a}
.welcome p.rv{display:block}
.shield{width:min(88cqw,780px);opacity:.15}
.welcome .small{font:600 clamp(18px,3.4vw,30px)/1.2 system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:.06em}
/* landing headline centered with the sign-in card and shield (PDub, 2026-10-28) */
.copy{align-items:center;text-align:center}

/* Sign-in: the Omega Psi Phi crest above the headline (glow, ring, slow float, tilt toward the cursor) */
.crestmark{position:relative;width:170px;height:178px;margin:0 auto 6px;display:grid;place-items:center;perspective:700px}
.crestmark img{position:relative;width:150px;height:auto;transform-style:preserve-3d;transition:transform .15s ease-out;filter:drop-shadow(0 16px 22px rgba(0,0,0,.55));animation:crestfloat 6s ease-in-out infinite alternate}
.cglow{position:absolute;inset:-18px;border-radius:50%;background:radial-gradient(circle,rgba(236,214,128,.40),rgba(120,70,220,.26) 48%,transparent 70%);filter:blur(8px);animation:cpulse 5s ease-in-out infinite}
.cring{position:absolute;inset:-6px;border-radius:50%;background:conic-gradient(from 0deg,rgba(236,214,128,0),rgba(236,214,128,.6),rgba(150,100,255,0),rgba(236,214,128,0),rgba(236,214,128,.6),rgba(236,214,128,0));-webkit-mask:radial-gradient(circle,transparent 66%,#000 67%,#000 69%,transparent 70%);mask:radial-gradient(circle,transparent 66%,#000 67%,#000 69%,transparent 70%);animation:cspin 14s linear infinite}
@keyframes crestfloat{to{translate:0 -6px}}@keyframes cpulse{50%{transform:scale(1.08);opacity:.85}}@keyframes cspin{to{transform:rotate(360deg)}}
@media (max-width:520px){.crestmark{width:140px;height:146px}.crestmark img{width:122px}}
@media (max-height:700px){.crestmark{width:120px;height:126px}.crestmark img{width:104px}.hero{padding-top:70px}}
@media (prefers-reduced-motion:reduce){.crestmark img,.cglow,.cring{animation:none!important}.crestmark img{transition:none}}
/* crest floats above the headline without moving it (keeps the locked headline/form spacing) */
.copy{position:relative}
.crestmark,.crestmark.reveal{position:absolute;left:50%;bottom:100%;translate:-50% 0;margin:0 0 4px;width:150px;height:156px}
.crestmark img{width:132px}
@media (max-width:520px){.crestmark,.crestmark.reveal{width:126px;height:132px}.crestmark img{width:110px}}
@media (max-height:700px){.crestmark,.crestmark.reveal{width:104px;height:108px}.crestmark img{width:90px}}
/* final crest sizing + short-window fix (the form's upward shift was tuned for tall screens and covered the headline below ~760px tall) */
.crestmark,.crestmark.reveal{width:122px;height:128px}
.crestmark img{width:108px}
@media (max-width:520px){.crestmark,.crestmark.reveal{width:112px;height:118px}.crestmark img{width:98px}}
@media (max-height:760px){.login{translate:none}.hero{padding-top:150px}.crestmark,.crestmark.reveal{width:122px;height:128px}.crestmark img{width:108px}}
@media (max-height:760px) and (max-width:520px){.crestmark,.crestmark.reveal{width:112px;height:118px}.crestmark img{width:98px}}
/* registration with the chapter code (sits in the same card as sign in) */
.login select{width:100%;min-height:46px;border-radius:10px;border:1px solid #b9a4e6;background:#0f0522;color:var(--text);padding:0 12px;font-size:16px}
.login .row2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 10px}.login .row2>div{min-width:0}
.login .intro{font-size:14px;color:var(--muted);margin:0 0 4px}
.login .smsq{border:0;padding:0;margin:10px 0 0}.login .smsq legend{font-size:13px;color:var(--gold-hi);padding:0;margin-bottom:2px}
.login .radio{display:flex;align-items:center;gap:10px;min-height:44px;margin:0;color:var(--text);font-size:15px}
.login .radio input{width:22px;min-height:22px;height:22px;padding:0;accent-color:var(--gold)}
.login .linkbtn{display:block;width:100%;min-height:44px;margin-top:8px;background:none;border:0;color:var(--gold-hi);text-decoration:underline;text-underline-offset:3px;font-size:15px;cursor:pointer}
.login .linkbtn:focus-visible{outline:3px solid var(--gold-hi);outline-offset:2px;border-radius:8px}
.login p[role=status]{font-size:15px;line-height:1.5;margin:6px 0}
#register,#regdone{translate:none}   /* the taller registration card sits below the headline instead of sliding up over it */