
/* ===== 50k PRO Layer ===== */
:root{
  --qw-bg:#0b1220; --qw-bg-2:#15243a; --qw-accent:#2aa1ff; --qw-text:#eaf3ff; --qw-card:rgba(255,255,255,0.02);
  --qw-focus:#2aa1ff; --qw-shadow:0 10px 28px rgba(42,161,255,0.18);
}
/* Focus visible */
:focus{outline:none}
:focus-visible{ outline:2px solid var(--qw-focus); outline-offset:2px; border-radius:6px; }

/* Smart header: compress on scroll */
.pro-header{ transition: all .25s ease; }
.pro-header.compact{ padding-top:6px !important; padding-bottom:6px !important; box-shadow: 0 6px 24px rgba(0,0,0,.35); }

/* Skip link */
.skip-link{ position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }
.skip-link:focus{ position:fixed; left:16px; top:16px; width:auto; height:auto; padding:8px 12px; background:#000; color:#fff; z-index:9999; border-radius:8px; }

/* Dark/Light toggle */
.theme-toggle{ cursor:pointer; border:1px solid rgba(255,255,255,.2); border-radius:999px; padding:8px 12px; font-size:14px; }
:root[data-theme="light"] body{ color:#0c1020; }
:root[data-theme="light"] .qw-hero{ filter:brightness(1.2); }
:root[data-theme="light"] .card{ background:rgba(0,0,0,0.03); border-color:rgba(0,0,0,0.08); }
:root[data-theme="light"] .section--alt{ background:rgba(0,0,0,0.03); }
:root[data-theme="light"] nav a::after{ background:#0c1020; }

/* Calculator */
.calc{ display:grid; gap:14px; }
.calc .row{ display:grid; grid-template-columns: 1fr 1fr; gap:12px; }
@media (max-width: 820px){ .calc .row{ grid-template-columns:1fr; } }
.calc input, .calc select{ width:100%; padding:12px 10px; border-radius:10px; border:1px solid rgba(255,255,255,0.1); background:rgba(0,0,0,0.25); color:var(--qw-text); }
:root[data-theme="light"] .calc input, :root[data-theme="light"] .calc select{ background:#fff; color:#0c1020; border-color:rgba(0,0,0,0.15); }
.calc .result{ margin-top:8px; padding:14px; border-radius:12px; background:var(--qw-card); border:1px solid rgba(255,255,255,0.08); }
.calc small{ opacity:.8; }

/* Prequal Stepper */
.stepper{ display:grid; gap:10px; margin:8px 0 16px; }
.stepper .steps{ display:flex; gap:6px; }
.stepper .dot{ width:10px; height:10px; border-radius:999px; background:rgba(255,255,255,0.25); }
.stepper .dot.active{ background:var(--qw-accent); }

/* Cookie notice */
.cookie{ position:fixed; bottom:16px; left:16px; right:16px; display:flex; gap:12px; align-items:center; justify-content:space-between; background:rgba(0,0,0,0.75); color:#fff; padding:12px 14px; border-radius:12px; z-index:9998; border:1px solid rgba(255,255,255,0.1); }
.cookie button{ padding:8px 12px; border-radius:8px; border:1px solid rgba(255,255,255,0.2); background:rgba(255,255,255,0.1); color:#fff; cursor:pointer; }
.cookie a{ color:#fff; text-decoration:underline; }

/* 404 quick links */
.quick-links{ display:flex; gap:12px; flex-wrap:wrap; }
.quick-links a{ padding:10px 12px; border:1px solid rgba(255,255,255,0.15); border-radius:10px; }

/* === Monogram Watermark === */
.qw-hero{ position:relative; }
.qw-hero::after{
  content:"";
  position:absolute;
  right:2%;
  bottom:8%;
  width:min(28vmin, 360px);
  aspect-ratio:1/1;
  background:url("/assets/monogram.png") no-repeat center / contain;
  opacity:.06;
  pointer-events:none;
  mix-blend-mode:screen;
}
:root[data-theme="light"] .qw-hero::after{
  mix-blend-mode:multiply;
  opacity:.05;
}
@media (max-width: 768px){
  .qw-hero::after{ opacity:.045; width:min(34vmin, 260px); }
}

/* Section chapter mark on comparison (safe non-form section) */
section[data-qa="qw-compare"]{ position:relative; overflow:hidden; }
section[data-qa="qw-compare"]::before{
  content:"";
  position:absolute;
  left:-6%;
  top:-10%;
  width:min(55vmin, 680px);
  aspect-ratio:1/1;
  background:url("/assets/monogram.png") no-repeat center / contain;
  opacity:.05;
  pointer-events:none;
  transform:rotate(-8deg);
}
:root[data-theme="light"] section[data-qa="qw-compare"]::before{ opacity:.04; }
@media (max-width: 900px){
  section[data-qa="qw-compare"]::before{ opacity:.035; width:min(70vmin, 520px); }
}
