/* LabRats.nl — synthwave placeholder */
:root{
  --bg:#07060c;
  --grid: #28193a;
  --neon1:#ff2ef0; /* pink */
  --neon2:#00f6ff; /* cyan */
  --txt:#e7e3f3;
  --muted:#9c94b8;
  --card:#100a18cc;
  --border: #4b3c69;
  --shadow: 0 10px 30px rgba(0,0,0,.55), 0 0 32px rgba(255,46,240,.08), 0 0 42px rgba(0,246,255,.06);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, 'Helvetica Neue', Arial, 'Noto Sans', 'Liberation Sans', sans-serif;
  background: radial-gradient(1200px 800px at 50% 0%, #120a20 0%, var(--bg) 65%);
  color: var(--txt);
  overflow-x:hidden;
}

/* animated synthwave ground grid */
.bg-grid{
  position:fixed; inset:0;
  background:
    linear-gradient(to top, transparent 0%, rgba(255,46,240,.08) 2%, transparent 3%) 0 100%/100% 50% no-repeat,
    radial-gradient(1000px 300px at 50% 85%, rgba(255,46,240,.15), transparent 70%) no-repeat,
    repeating-linear-gradient(#0000 0 24px, var(--grid) 24px 25px),
    repeating-linear-gradient(90deg, #0000 0 24px, var(--grid) 24px 25px);
  transform: perspective(600px) rotateX(65deg);
  transform-origin: 50% 100%;
  top:40vh;
  animation: drift 12s linear infinite;
  opacity:.7;
}
@keyframes drift{to{background-position: 0 100%, center, 0 8px, 8px 0;}}

.scanline{
  position:fixed; inset:0;
  background: linear-gradient(rgba(255,255,255,.02) 50%, transparent 50%);
  background-size: 100% 3px;
  pointer-events:none;
  mix-blend-mode: overlay;
  opacity:.25;
}

.container{
  position:relative;
  min-height:100%;
  display:flex; flex-direction:column;
  align-items:center; justify-content:flex-start;
  padding: clamp(24px, 4vw, 48px);
  gap: 28px;
}

.brand{
  text-align:center;
  margin-top: clamp(24px, 6vh, 80px);
}
.logo{
  width:min(220px, 45vw);
  filter: drop-shadow(0 0 1.5rem rgba(255,46,240,.35)) drop-shadow(0 0 2rem rgba(0,246,255,.25));
  border-radius: 16px;
}
.title{
  font-size: clamp(40px, 6vw, 84px);
  margin: 10px 0 0;
  letter-spacing: .5px;
  font-weight: 800;
  text-shadow: 0 0 16px rgba(255,46,240,.45), 0 0 20px rgba(0,246,255,.3);
}
.title span{color:var(--neon1)}
.title .tld{color:var(--neon2)}
.tag{
  color: var(--muted);
  margin-top: 6px;
  font-size: clamp(14px, 1.6vw, 18px);
  letter-spacing:.12em;
  text-transform: uppercase;
}

.card{
  width: min(900px, 92vw);
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: clamp(16px, 3vw, 28px);
  box-shadow: var(--shadow);
  backdrop-filter: blur(4px);
}
.card h2{
  margin:0 0 10px;
  font-size: clamp(22px, 2.4vw, 28px);
}
.card p{margin:0 0 18px; line-height:1.6; color:#d8d3ea}

.cta-row{display:flex; flex-wrap:wrap; gap:12px}
.btn{
  display:inline-block;
  padding: 12px 18px;
  border-radius: 999px;
  border:1px solid var(--border);
  color: var(--txt);
  text-decoration:none;
  transition: transform .12s ease, box-shadow .2s ease, background .2s ease;
  background: #140e22;
}
.btn:hover{transform: translateY(-1px); box-shadow: 0 0 24px rgba(0,246,255,.25)}
.btn.primary{
  background: linear-gradient(90deg, var(--neon1), var(--neon2));
  color:#0b0713;
  font-weight:700;
  border-color: transparent;
}
.btn[aria-disabled="true"]{filter:grayscale(.1) brightness(.9); cursor:not-allowed}

.links{display:flex; gap:10px; flex-wrap:wrap; justify-content:center}
.pill{
  border:1px solid var(--border);
  color:#cfc8e8;
  background:#120a20;
  padding:8px 12px; border-radius:999px;
  font-size:14px; letter-spacing:.06em;
}

.footer{
  margin: 14px 0 30px;
  color: var(--muted);
  font-size: 14px;
  text-align:center;
}
