:root{
  --bg:#05080f; --bg2:#090e1a;
  --card:rgba(255,255,255,.045); --card2:rgba(255,255,255,.02);
  --line:rgba(148,184,255,.16); --line2:rgba(148,184,255,.28);
  --text:#eef3fc; --mut:#9fb0ca; --mut2:#c3cfe2;
  --cyan:#38bdf8; --vio:#818cf8; --pink:#e879f9; --grn:#34d399; --amb:#fbbf24;
  --grad:linear-gradient(92deg,var(--cyan),var(--vio) 55%,var(--pink));
  --gradbtn:linear-gradient(92deg,#0369a1,#4f46e5 55%,#a21caf);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; color:var(--text); background-color:var(--bg);
  font-family:"Inter","SF Pro Display",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  line-height:1.55; font-size:16px;
  background-image:
    radial-gradient(620px 340px at 12% -60px, rgba(56,189,248,.20), rgba(56,189,248,0) 70%),
    radial-gradient(680px 380px at 88% -80px, rgba(129,140,248,.18), rgba(129,140,248,0) 70%),
    radial-gradient(900px 600px at 50% 115%, rgba(232,121,249,.07), rgba(232,121,249,0) 70%),
    linear-gradient(180deg,var(--bg2),var(--bg) 340px);
  background-repeat:no-repeat;
}
.grid-bg{
  position:fixed; inset:0; pointer-events:none; z-index:0; opacity:.5;
  background-image:
    linear-gradient(rgba(148,184,255,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(148,184,255,.045) 1px, transparent 1px);
  background-size:44px 44px;
  -webkit-mask-image:linear-gradient(180deg, #000 0, transparent 480px);
          mask-image:linear-gradient(180deg, #000 0, transparent 480px);
}
.wrap{max-width:1120px; margin:0 auto; padding:0 18px; position:relative; z-index:1}
a{color:var(--cyan)}
:focus-visible{outline:2px solid var(--cyan); outline-offset:2px}

/* ---------- site header ---------- */
.sitehead{padding:22px 0 4px}
.brandrow{display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap}
.brand{display:flex; align-items:center; gap:13px; text-decoration:none}
.brand svg{flex:0 0 auto; display:block; filter:drop-shadow(0 8px 22px rgba(56,120,248,.35))}
.wm{font-size:27px; font-weight:800; letter-spacing:-.025em; color:var(--text); line-height:1; white-space:nowrap}
.wm .g{background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent}
.wm .r{color:var(--cyan)}
nav.main{display:flex; gap:6px; flex-wrap:wrap; align-items:center; margin-top:14px}
nav.main a{
  color:var(--mut2); text-decoration:none; font-size:15px; font-weight:600;
  padding:9px 13px; border-radius:10px; border:1px solid transparent;
}
nav.main a:hover{color:#fff; border-color:var(--line)}
nav.main a.cta{
  color:#fff; background:var(--gradbtn); border-color:transparent;
  box-shadow:0 8px 20px rgba(56,120,248,.3), inset 0 1px 0 rgba(255,255,255,.3);
}
@media (min-width:720px){ nav.main{margin-top:0} }

/* ---------- headings / hero ---------- */
h1{font-size:clamp(29px,6.2vw,50px); line-height:1.1; margin:22px 0 14px; font-weight:800; letter-spacing:-.025em; max-width:17em}
h1 .g, .grad-text{background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent}
h2{font-size:clamp(22px,4.6vw,29px); font-weight:800; letter-spacing:-.02em; margin:0 0 10px}
.vans{
  display:block; font-size:clamp(17px,3.6vw,21px); font-weight:700; letter-spacing:-.01em;
  color:#fff; border:1px solid var(--line2); border-radius:14px; padding:14px 18px;
  background:linear-gradient(180deg, rgba(56,189,248,.12), rgba(129,140,248,.07));
  box-shadow:0 12px 34px rgba(2,6,18,.55), inset 0 1px 0 rgba(255,255,255,.08);
}
.sub{color:var(--mut2); font-size:17px; margin:14px 2px 0; max-width:40em}
.crumbs{font-size:14px; color:var(--mut); margin:16px 0 0}
.crumbs a{color:var(--mut2); text-decoration:none; border-bottom:1px solid var(--line)}
.checked{color:var(--mut); font-size:15px; margin:0 0 6px}

/* ---------- search ---------- */
.search{
  margin:26px 0 6px; border:1px solid var(--line); border-radius:20px; padding:20px;
  background:linear-gradient(180deg, var(--card), var(--card2));
  box-shadow:0 18px 44px rgba(1,4,12,.5), inset 0 1px 0 rgba(255,255,255,.06);
}
.search h2{margin:0 0 4px; font-size:20px; font-weight:750; letter-spacing:-.015em}
.search p{margin:0 0 16px; color:var(--mut); font-size:15px}
.srow{display:grid; grid-template-columns:1fr; gap:10px}
.field label{display:block; font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--mut); margin:0 0 6px 2px}
.field input{
  width:100%; min-width:0; padding:13px 14px; font-size:16px; color:var(--text);
  background:rgba(3,6,14,.65); border:1px solid var(--line); border-radius:12px; outline:none;
  font-family:inherit; min-height:48px;
}
.field input::placeholder{color:#5f7191}
.field input:focus{border-color:var(--cyan); box-shadow:0 0 0 3px rgba(56,189,248,.22)}
.sbtn{
  align-self:end; border:0; cursor:pointer; padding:14px 22px; border-radius:12px; min-height:50px;
  font-size:16px; font-weight:750; color:#fff; background:var(--gradbtn);
  box-shadow:0 10px 26px rgba(56,120,248,.35), inset 0 1px 0 rgba(255,255,255,.35);
  font-family:inherit; letter-spacing:.01em; text-decoration:none; display:inline-block; text-align:center;
}
.sbtn:active{transform:translateY(1px)}
.sresult{display:none; margin:16px 2px 0; border:1px solid rgba(251,191,36,.45); border-radius:14px; padding:14px 16px; background:rgba(251,191,36,.06); color:#fde9bd; font-size:16px}
.sresult a{color:var(--cyan); font-weight:700}
@media (min-width:720px){ .srow{grid-template-columns:1fr auto} }

/* ---------- sections ---------- */
section{padding:30px 0 4px}
.shead{display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin:0 0 6px}
.shead h2{margin:0}
.pill{font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; padding:5px 11px; border-radius:999px; border:1px solid var(--line2)}
.pill.free{color:#052e1d; background:linear-gradient(92deg,#6ee7b7,var(--grn)); border-color:transparent}
.pill.lock{color:var(--amb); background:rgba(251,191,36,.08)}
.pill.open{color:#0b1030; background:var(--grad); border-color:transparent}
.ssub{color:var(--mut); margin:0 0 18px; font-size:16px; max-width:44em}
.biglink{font-weight:700; font-size:17px}

/* ---------- cards ---------- */
.cards{display:grid; grid-template-columns:1fr; gap:16px}
@media (min-width:720px){ .cards{grid-template-columns:1fr 1fr} }
@media (min-width:1024px){ .cards{grid-template-columns:1fr 1fr 1fr} }
.card{
  position:relative; border:1px solid var(--line); border-radius:18px; padding:20px 20px 18px;
  background:linear-gradient(180deg, var(--card), var(--card2));
  box-shadow:0 16px 38px rgba(1,4,12,.45), inset 0 1px 0 rgba(255,255,255,.06);
  overflow:hidden; min-width:0;
}
.card::before{content:""; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg, transparent, rgba(148,184,255,.35), transparent)}
.card.free::before{background:linear-gradient(90deg, transparent, var(--grn), transparent)}
.card.paid::before{background:var(--grad)}
.card h3{margin:0 0 2px; font-size:20px; font-weight:780; letter-spacing:-.015em; line-height:1.25; overflow-wrap:anywhere}
.row{margin-top:13px; min-width:0}
.lab{font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--mut); margin-bottom:2px}
.val{font-size:16px; color:var(--text); overflow-wrap:anywhere}
.val a{color:var(--cyan); text-decoration:none; border-bottom:1px solid rgba(56,189,248,.4)}
.val a:hover{border-bottom-color:var(--cyan)}
.mono{font-family:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,monospace; font-size:15px; letter-spacing:.01em}
.who{font-weight:700}
.job{color:var(--mut2); font-weight:400}
.contact{margin-top:16px; border-top:1px solid var(--line); padding-top:6px}
.nocontact{margin-top:16px; border-top:1px solid var(--line); padding-top:12px; color:var(--mut); font-size:15px}
.lockzone{margin-top:16px; border:1px dashed rgba(251,191,36,.45); border-radius:14px; padding:18px 14px; text-align:center; background:rgba(251,191,36,.05)}
.lockzone svg{width:26px; height:26px; color:var(--amb); filter:drop-shadow(0 0 8px rgba(251,191,36,.45))}
.lockzone p{margin:8px 0 0; font-size:15px; font-weight:650; color:#fde9bd}

/* ---------- paid panel ---------- */
.panel{margin:34px 0 10px; border-radius:22px; padding:1px; background:linear-gradient(120deg, rgba(56,189,248,.65), rgba(129,140,248,.5), rgba(232,121,249,.55)); box-shadow:0 22px 54px rgba(10,16,44,.6)}
.panel-in{border-radius:21px; padding:24px 22px; background:linear-gradient(180deg,#0a1120,#070c16)}
.panel h2{margin:0 0 6px; font-size:clamp(21px,4.4vw,26px)}
.panel p{color:var(--mut2); margin:0 0 12px; font-size:16px}
.script{display:flex; gap:11px; align-items:flex-start; margin:10px 0}
.script svg{flex:0 0 auto; width:20px; height:20px; color:var(--grn); margin-top:2px}
.script b{font-weight:700}
.promise{margin:18px 0 2px; font-size:clamp(17px,3.8vw,20px); font-weight:750; line-height:1.45; color:#fff; border-top:1px solid var(--line); padding-top:18px}
.promise .g{background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent}
.price{font-size:clamp(26px,5vw,34px); font-weight:800; letter-spacing:-.02em; margin:6px 0 2px}
.price small{font-size:16px; color:var(--mut2); font-weight:600}

/* ---------- steps / lists ---------- */
.steps{display:grid; grid-template-columns:1fr; gap:14px}
@media (min-width:720px){ .steps{grid-template-columns:1fr 1fr 1fr} }
.step{border:1px solid var(--line); border-radius:16px; padding:18px; background:linear-gradient(180deg, var(--card), var(--card2))}
.step .n{font-size:12px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--cyan)}
.step h3{margin:6px 0 6px; font-size:18px}
.step p{margin:0; color:var(--mut2); font-size:15px}

/* ---------- prose (guides, legal) ---------- */
.prose{max-width:46em}
.prose p{color:var(--mut2); font-size:17px; margin:0 0 14px}
.prose h2{margin:28px 0 8px; font-size:23px}
.prose h3{margin:22px 0 6px; font-size:19px}
.prose ul{color:var(--mut2); font-size:17px; margin:0 0 14px; padding-left:22px}
.prose li{margin-bottom:7px}
.prose strong{color:var(--text)}
.prose .answer{font-size:18px; color:var(--text)}
blockquote.scriptline{
  margin:0 0 14px; border-left:3px solid var(--cyan); padding:10px 16px;
  background:rgba(56,189,248,.06); border-radius:0 12px 12px 0; color:var(--text); font-size:16px;
}
.door{margin:30px 0 8px; border:1px solid var(--line2); border-radius:18px; padding:22px; background:linear-gradient(180deg, rgba(56,189,248,.10), rgba(129,140,248,.05))}
.door p{margin:0 0 12px; font-size:18px; color:var(--text)}
.hubgroup{margin:0 0 26px}
.guidelist{list-style:none; margin:0; padding:0}
.guidelist li{border:1px solid var(--line); border-radius:14px; padding:16px 18px; margin-bottom:10px; background:linear-gradient(180deg, var(--card), var(--card2))}
.guidelist a{font-size:18px; font-weight:700; text-decoration:none}
.guidelist p{margin:4px 0 0; color:var(--mut); font-size:15px}

/* ---------- members ---------- */
.membanner{margin:24px 0 4px; border:1px solid rgba(52,211,153,.5); border-radius:16px; padding:18px; background:rgba(52,211,153,.07)}
.membanner h1{margin:0 0 6px; font-size:clamp(26px,5.4vw,40px)}
.membanner p{color:var(--mut2); margin:0; font-size:16px}
.scriptblock{border:1px solid var(--line); border-radius:18px; padding:22px; margin:0 0 16px; background:linear-gradient(180deg, var(--card), var(--card2))}
.scriptblock h3{margin:0 0 8px; font-size:20px}
.scriptblock p, .scriptblock li{color:var(--mut2); font-size:16px}
.scriptblock ul{padding-left:22px; margin:0 0 12px}
.scriptblock li{margin-bottom:7px}

/* ---------- footer ---------- */
footer{padding:36px 0 44px; color:var(--mut); font-size:14px; margin-top:34px; border-top:1px solid var(--line)}
footer .frow{display:flex; gap:16px; flex-wrap:wrap; justify-content:space-between; align-items:flex-start}
footer nav{display:flex; gap:14px; flex-wrap:wrap}
footer nav a{color:var(--mut2); text-decoration:none}
footer p{margin:10px 0 0}

/* city lines: one uniform shape everywhere a city is listed */
.stategroup{margin:0 0 30px}
.stategroup h3{margin:0 0 2px; font-size:21px; font-weight:760; letter-spacing:-.015em}
.citylist{display:grid; grid-template-columns:1fr; gap:0 28px}
.cityline{font-size:17px; margin:0; padding:11px 2px; border-bottom:1px solid var(--line)}
@media (min-width:760px){.citylist{grid-template-columns:1fr 1fr}}