/* Opret klub (/opret-klub) — bygger på club.css' tokens og komponenter. */
.su-body{background:var(--sp-page)}
.su{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,560px);min-height:100dvh}
.su-hero{background:#050505;color:#EDEDED;padding:48px clamp(24px,5vw,72px);display:flex;flex-direction:column;gap:20px;position:relative;overflow:hidden}
.su-hero::after{content:'';position:absolute;right:-20%;bottom:-30%;width:70%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(0,210,255,.22),transparent 65%);pointer-events:none}
.su-hero::before{content:'';position:absolute;left:0;right:0;top:0;height:4px;background:var(--sp-blend)}
.su-brand{display:flex;align-items:center;gap:12px;color:#fff;text-decoration:none}
.su-brand b{display:block;font-size:17px;font-weight:900;letter-spacing:-.02em}
.su-brand .sp-eyebrow{color:#8BCB34}
.su-hero h1{font-size:clamp(30px,3.6vw,48px);line-height:1.08;font-weight:900;letter-spacing:-.03em;margin:24px 0 0;max-width:16ch}
.su-lead{font-size:16px;line-height:1.55;color:#C6CAD0;max-width:52ch;margin:0}
.su-badge{display:inline-flex;gap:8px;align-items:center;align-self:flex-start;padding:8px 14px;border-radius:999px;border:1.5px solid transparent;background:linear-gradient(#050505,#050505) padding-box,var(--sp-blend) border-box;font-size:14px}
.su-badge b{color:#8BCB34}
.su-badge span{color:#C6CAD0}
.su-points{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.su-points li{display:flex;gap:10px;align-items:center;font-size:15px}
.su-points .sp-i{width:18px;height:18px;color:#00D2FF;flex:none}
.su-links{margin-top:auto;font-size:13.5px;color:#9AA1A9}
.su-links a{color:#00D2FF;text-decoration:none;font-weight:600}
.su-links a:hover{text-decoration:underline}
.su-main{display:flex;align-items:flex-start;justify-content:center;padding:48px 24px}
.su-card{width:100%;max-width:460px;background:var(--sp-surface);border:1px solid var(--sp-line);border-radius:var(--sp-r);padding:24px;display:flex;flex-direction:column;gap:14px}
.su-card h2{margin:0;font-size:22px;font-weight:800;letter-spacing:-.02em}
.su-sub{margin:-6px 0 2px;color:var(--sp-muted);font-size:14px;line-height:1.5}
.su-steps{display:flex;gap:6px;list-style:none;margin:0 0 4px;padding:0}
.su-steps li{flex:1;display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--sp-muted);padding-bottom:10px;border-bottom:3px solid var(--sp-line)}
.su-steps li.cur{color:var(--sp-text);border-bottom-color:var(--sp-cyan)}
.su-steps li.done{color:var(--sp-text);border-bottom-color:var(--sp-green)}
.su-steps .cp-stepno{width:24px;height:24px;font-size:12px}
.su-steps .cp-stepno .sp-i{width:13px;height:13px}
.su-seg{width:100%}
.su-seg button{flex:1}
.su-form{display:flex;flex-direction:column;gap:14px}
.su-form .sp-fld .lb{display:block;font-size:12.5px;font-weight:600;color:var(--sp-text-2);margin-bottom:6px}
.su-form .hint{font-size:12.5px;color:var(--sp-muted);margin-top:5px}
.su-full{width:100%;height:46px!important;font-size:15px!important}
.su-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.su-slug{display:flex;align-items:center;gap:6px}
.su-slug span{font-family:var(--sp-mono);color:var(--sp-muted);font-size:13px}
.su-harbor{display:flex;gap:8px}
.su-harbor .sp-btn{height:40px}
.su-map{height:200px;border-radius:12px;overflow:hidden;border:1px solid var(--sp-line);margin-top:8px;background:var(--sp-sunken)}
.su-fine{font-size:12.5px;color:var(--sp-muted);text-align:center;margin:0}
.su-done{display:flex;flex-direction:column;gap:12px;align-items:center;text-align:center}
.su-check{width:64px;height:64px;border-radius:50%;background:var(--sp-green);color:var(--sp-on-green);display:grid;place-items:center}
.su-check .sp-i{width:32px;height:32px;stroke-width:2.4}
.su-card .slv-root,.su-card #su-verify{font-family:var(--sp-font)}
@media (max-width:900px){
  .su{grid-template-columns:minmax(0,1fr)}
  .su-hero{padding:28px 20px 24px;gap:14px}
  .su-hero h1{font-size:28px;margin-top:8px}
  .su-lead{font-size:14.5px}
  .su-points,.su-links{display:none}
  .su-main{padding:16px 16px 40px}
  .su-card{padding:18px 16px}
}
@media (max-width:420px){ .su-two{grid-template-columns:minmax(0,1fr)} .su-harbor{flex-direction:column} }
@media (max-width:600px){ .su-lead{display:none} .su-hero h1{font-size:24px} .su-badge{font-size:13px;padding:6px 12px} }
