/* Red Bull Padel Dash Lebanon — registration page. Palette lifted from the crest. */
:root{
  --navy:#071433; --navy-2:#0b1f4e; --blue:#1d5ccf; --blue-2:#2f7bff; --red:#e0102b; --red-2:#ff2d4d;
  --yellow:#ffc60a; --ink:#0b1430; --paper:#ffffff; --paper-2:#f4f6fb; --line:#dfe4f0; --muted:#5a6483;
  --ok:#1d9e5a; --font-head:"Barlow Condensed",Impact,"Arial Narrow",sans-serif; --font:"Barlow",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --radius:18px; --shadow:0 24px 60px -24px rgba(3,10,40,.65);
}
*{box-sizing:border-box}
html{overflow-x:clip;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--navy);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.5;min-height:100svh;display:flex;flex-direction:column}
main{flex:1}
img{max-width:100%;height:auto;display:block}
a{color:var(--blue)}
.wrap{width:min(100% - 32px,760px);margin-inline:auto}

/* ambient court */
.court{position:fixed;inset:0;z-index:-1;overflow:hidden;background:
  radial-gradient(1200px 600px at 50% -10%,#163a8f 0%,transparent 60%),
  linear-gradient(180deg,#0a1d4d 0%,var(--navy) 45%,#050d24 100%)}
.court .ln{position:absolute;background:rgba(255,255,255,.08);}
.ln-a{left:50%;top:0;width:2px;height:100%;transform:translateX(-50%)}
.ln-b{left:0;top:38%;width:100%;height:2px}
.ln-c{left:8%;top:0;width:2px;height:100%;transform:skewX(-8deg);opacity:.5}
.ln-d{right:8%;top:0;width:2px;height:100%;transform:skewX(8deg);opacity:.5}
.glow{position:absolute;border-radius:50%;filter:blur(90px);opacity:.55}
.glow-red{width:420px;height:420px;background:var(--red);right:-160px;top:12%;opacity:.28}
.glow-blue{width:520px;height:520px;background:var(--blue-2);left:-200px;bottom:-120px;opacity:.35}

/* header */
.site-head{padding:28px 16px 6px;text-align:center}
.brand{display:inline-block}
.brand img{width:min(420px,78vw);height:auto;margin-inline:auto;filter:drop-shadow(0 18px 40px rgba(0,0,0,.55))}

/* hero */
.hero{color:#fff;text-align:center;padding:12px 0 26px}
.kicker{font-family:var(--font-head);font-weight:800;text-transform:uppercase;letter-spacing:.14em;font-size:14px;color:var(--yellow);margin:0 0 8px}
.kicker span{color:#fff;opacity:.85}
.hero h1{font-family:var(--font-head);font-weight:800;font-size:clamp(46px,9vw,84px);line-height:.92;margin:0 0 14px;text-transform:uppercase;letter-spacing:-.01em}
.hero h1 em,.done h1 em{font-style:italic;color:var(--red-2);-webkit-text-stroke:0}
.lede{font-size:18px;max-width:560px;margin:0 auto 22px;color:rgba(255,255,255,.85)}
.rules{list-style:none;margin:0 auto;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;max-width:720px;text-align:left}
.rules li{position:relative;display:flex;flex-direction:column;gap:8px;min-height:212px;background:linear-gradient(160deg,rgba(255,255,255,.1),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.16);border-radius:16px;padding:16px 14px 14px;font-size:13.5px;line-height:1.35;color:rgba(255,255,255,.8);backdrop-filter:blur(6px);overflow:hidden;color:#fff}
.rules li::after{content:"";position:absolute;inset:auto 0 0 0;height:4px;background:var(--blue-2)}
.rules .ico{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;background:rgba(47,123,255,.18);color:#8fb6ff;flex:none}
.rules .ico svg{width:30px;height:30px}
.rules li strong{font-family:var(--font-head);font-size:20px;line-height:1;text-transform:uppercase;letter-spacing:.03em;color:#fff;margin-top:2px}
.rules li p{margin:0;color:rgba(255,255,255,.78)}
.rules li.warn{background:linear-gradient(160deg,rgba(224,16,43,.28),rgba(224,16,43,.08));border-color:rgba(255,45,77,.45)}
.rules li.warn::after{background:var(--red-2)}
.rules li.warn .ico{background:rgba(255,45,77,.2);color:var(--red-2)}
.rules li.warn strong{color:var(--red-2)}
@media (max-width:720px){.rules{grid-template-columns:repeat(2,1fr);gap:10px}.rules li{min-height:0;font-size:13px}}
.extra{margin:16px auto 0;max-width:620px;color:rgba(255,255,255,.75);font-size:15px}

/* cards */
.card{background:var(--paper);border-radius:var(--radius);box-shadow:var(--shadow);padding:clamp(20px,4vw,36px);margin:0 0 40px;position:relative;overflow:hidden}
.card::before{content:"";position:absolute;inset:0 0 auto 0;height:6px;background:linear-gradient(90deg,var(--red) 0 34%,var(--yellow) 34% 50%,var(--blue) 50%)}
.closed{text-align:center}
.closed h2{font-family:var(--font-head);text-transform:uppercase;font-size:36px;margin:8px 0 6px}

/* form */
.step{padding:6px 0 18px;border-bottom:1px solid var(--line);margin-bottom:18px}
.step:last-of-type{border-bottom:0;margin-bottom:0}
.step h2,.player legend{font-family:var(--font-head);text-transform:uppercase;font-weight:800;font-size:26px;letter-spacing:.01em;margin:0 0 12px;display:flex;align-items:center;gap:10px}
.num{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--navy);color:var(--yellow);font-size:16px;font-family:var(--font-head);font-weight:800;flex:none}
.step-note{margin:-6px 0 14px;color:var(--muted);font-size:15px}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 16px}
@media (max-width:560px){.grid{grid-template-columns:1fr}}
.player{border:1px solid var(--line);border-radius:14px;padding:14px 16px 16px;margin:0 0 14px;background:var(--paper-2)}
.player legend{font-size:22px;padding:0 8px;background:var(--paper-2);border-radius:8px}
.player legend small{font-family:var(--font);font-weight:500;text-transform:none;letter-spacing:0;font-size:13px;color:var(--muted)}
.field{display:flex;flex-direction:column;gap:6px;margin:0 0 4px}
.field label{font-weight:600;font-size:14px;color:var(--ink)}
.field input:not([type=checkbox]),.field select{font:inherit;padding:12px 14px;border:1.5px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);width:100%;min-height:48px;transition:border-color .15s,box-shadow .15s}
.field input:focus,.field select:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 4px rgba(29,92,207,.15)}
.field input::placeholder{color:#a3abc4}
.select-wrap{position:relative}
.select-wrap select{appearance:none;-webkit-appearance:none;padding-right:44px;cursor:pointer}
.select-wrap::after{content:"";position:absolute;right:16px;top:50%;width:10px;height:10px;border-right:2.5px solid var(--navy);border-bottom:2.5px solid var(--navy);transform:translateY(-70%) rotate(45deg);pointer-events:none}
.hint{margin:0;font-size:13px;color:var(--muted)}
.err{margin:0;font-size:13.5px;color:var(--red);font-weight:600}
.has-error input,.has-error select{border-color:var(--red)!important;background:#fff6f7}
.field.check label{display:flex;gap:12px;align-items:flex-start;font-weight:400;font-size:15px;line-height:1.45;cursor:pointer}
.field.check input{width:22px;height:22px;flex:none;margin-top:2px;accent-color:var(--red)}
.banner{border-radius:10px;padding:12px 16px;margin:0 0 18px;font-weight:600}
.banner.err{background:#fff0f2;color:#9b0a1f;border:1px solid #ffc9d1}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--font-head);font-weight:800;text-transform:uppercase;letter-spacing:.06em;font-size:19px;padding:12px 24px;border-radius:12px;border:2px solid transparent;cursor:pointer;text-decoration:none;transition:transform .12s,box-shadow .12s,background .15s;min-height:48px}
.btn.primary{background:var(--red);color:#fff;box-shadow:0 12px 30px -10px rgba(224,16,43,.7)}
.btn.primary:hover{background:var(--red-2);transform:translateY(-1px)}
.btn.primary[disabled]{opacity:.7;cursor:progress;transform:none}
.btn.big{width:100%;font-size:24px;padding:16px 24px;margin-top:8px}
.btn.ghost{background:transparent;border-color:var(--navy);color:var(--navy)}
.btn.ghost:hover{background:var(--navy);color:#fff}
.btn:not(.primary):not(.ghost){background:var(--navy);color:#fff}
.fine{text-align:center;color:var(--muted);font-size:13px;margin:12px 0 0}

/* confirmation */
.done{text-align:center}
.done h1{font-family:var(--font-head);text-transform:uppercase;font-weight:800;font-size:clamp(40px,8vw,64px);line-height:.95;margin:4px 0 12px}
.done .kicker{color:var(--ok)}
.done .lede{color:var(--muted);font-size:17px}
.ref{display:inline-flex;flex-direction:column;align-items:center;gap:2px;background:var(--navy);color:#fff;border-radius:14px;padding:14px 32px;margin:6px auto 22px}
.ref span{font-size:12px;text-transform:uppercase;letter-spacing:.14em;opacity:.7}
.ref strong{font-family:var(--font-head);font-size:38px;letter-spacing:.08em;color:var(--yellow);user-select:all}
.summary{margin:0;text-align:left;display:grid;gap:10px;border-top:1px solid var(--line);padding-top:18px}
.summary div{display:grid;grid-template-columns:100px 1fr;gap:12px;align-items:baseline}
.summary dt{font-family:var(--font-head);text-transform:uppercase;font-weight:800;color:var(--muted);font-size:16px;letter-spacing:.04em}
.summary dd{margin:0;font-weight:600}
.summary small{display:block;font-weight:400;color:var(--muted);font-size:13.5px;word-break:break-word}
.reminder{background:#fff6e5;border:1px solid #ffe2a8;border-radius:10px;padding:10px 14px;font-size:14px;margin:22px 0 18px;text-align:left}
.actions{margin:0}

/* footer */
.site-foot{color:#fff;padding:28px 0 36px;text-align:center}
.organiser{display:flex;flex-direction:column;align-items:center;gap:6px}
.organiser-label{font-size:12px;text-transform:uppercase;letter-spacing:.16em;opacity:.6}
.organiser img{width:190px}
.foot-contact{margin:14px 0 0;opacity:.85;font-size:15px}
.foot-contact a{color:#fff}
.foot-legal{margin:14px 0 0;font-size:12.5px;opacity:.5}
@media (prefers-reduced-motion:reduce){.btn{transition:none}}
