/* ============================================================
   Cookie consent banner + preference centre
   Self-contained: works on every page, no dependency on page CSS.
   ============================================================ */

.nx-consent{
  --nx-blue:#2A6EBB;
  --nx-teal:#2E9E8F;
  --nx-teal-dark:#27887B;
  --nx-ink:#1A1A1A;
  --nx-muted:#475569;
  --nx-line:#e2e8f0;
  font-family:'Inter','Segoe UI',sans-serif;
  color:var(--nx-ink);
  line-height:1.6;
}

/* ---------- Banner ---------- */
.nx-banner{
  position:fixed;left:0;right:0;bottom:0;z-index:9000;
  background:#fff;border-top:1px solid var(--nx-line);
  box-shadow:0 -10px 40px rgba(15,23,42,.16);
  padding:1.4rem 0;
  transform:translateY(110%);
  transition:transform .45s cubic-bezier(.16,.84,.44,1);
}
.nx-banner.nx-open{transform:none}
.nx-banner-inner{
  max-width:1120px;margin:0 auto;padding:0 1.5rem;
  display:flex;flex-direction:column;gap:1.1rem;
}
.nx-banner h2{
  font-size:1rem;font-weight:700;margin:0 0 .35rem;letter-spacing:-.01em;
}
.nx-banner p{margin:0;font-size:.87rem;color:var(--nx-muted);max-width:68ch}
.nx-banner a{color:var(--nx-blue);text-decoration:underline;text-underline-offset:2px}
.nx-banner a:hover{color:var(--nx-teal)}
.nx-actions{display:flex;flex-wrap:wrap;gap:.6rem}

.nx-btn{
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:.6rem;padding:.7rem 1.35rem;font-size:.85rem;font-weight:600;
  font-family:inherit;border:1px solid transparent;cursor:pointer;
  transition:background .2s, border-color .2s, color .2s, box-shadow .2s;
}
.nx-btn:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(42,110,187,.35)}
.nx-btn-primary{background:var(--nx-teal);color:#fff;box-shadow:0 6px 16px rgba(46,158,143,.28)}
.nx-btn-primary:hover{background:var(--nx-teal-dark)}
.nx-btn-secondary{background:#fff;color:var(--nx-ink);border-color:#cbd5e1}
.nx-btn-secondary:hover{border-color:var(--nx-teal);color:var(--nx-teal)}
.nx-btn-link{
  background:none;border:none;color:var(--nx-muted);font-weight:600;font-size:.85rem;
  text-decoration:underline;text-underline-offset:3px;padding:.7rem .4rem;cursor:pointer;font-family:inherit;
}
.nx-btn-link:hover{color:var(--nx-blue)}

@media (min-width:860px){
  .nx-banner-inner{flex-direction:row;align-items:center;justify-content:space-between;gap:2rem}
  .nx-actions{flex-shrink:0}
}

/* ---------- Preference centre ---------- */
.nx-modal{
  position:fixed;inset:0;z-index:9100;
  display:none;align-items:flex-end;justify-content:center;
  background:rgba(13,13,13,.55);
  padding:0;
}
.nx-modal.nx-open{display:flex}
.nx-modal-panel{
  background:#fff;width:100%;max-width:640px;max-height:92vh;overflow-y:auto;
  border-radius:1rem 1rem 0 0;box-shadow:0 -20px 60px rgba(15,23,42,.35);
  padding:1.75rem 1.5rem 1.5rem;
}
.nx-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}
.nx-modal-head h2{font-size:1.15rem;font-weight:700;margin:0}
.nx-modal-intro{margin:.7rem 0 1.4rem;font-size:.87rem;color:var(--nx-muted)}
.nx-modal-intro a{color:var(--nx-blue);text-decoration:underline;text-underline-offset:2px}
.nx-close{
  background:none;border:none;font-size:1.5rem;line-height:1;color:var(--nx-muted);
  cursor:pointer;padding:.15rem .35rem;border-radius:.4rem;flex-shrink:0;
}
.nx-close:hover{color:var(--nx-ink);background:#f1f5f9}

.nx-cat{
  border:1px solid var(--nx-line);border-radius:.75rem;padding:1rem 1.1rem;margin-bottom:.8rem;
}
.nx-cat-head{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.nx-cat-head h3{font-size:.92rem;font-weight:700;margin:0}
.nx-cat p{margin:.45rem 0 0;font-size:.82rem;color:var(--nx-muted)}
.nx-always{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--nx-teal);flex-shrink:0}

/* Accessible toggle switch built on a real checkbox */
.nx-switch{position:relative;display:inline-flex;flex-shrink:0;width:2.85rem;height:1.6rem}
.nx-switch input{
  position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;z-index:2;
}
.nx-switch span{
  position:absolute;inset:0;background:#cbd5e1;border-radius:999px;transition:background .2s;pointer-events:none;
}
.nx-switch span::after{
  content:"";position:absolute;top:.2rem;left:.2rem;width:1.2rem;height:1.2rem;
  background:#fff;border-radius:50%;box-shadow:0 1px 3px rgba(15,23,42,.3);transition:transform .2s;
}
.nx-switch input:checked + span{background:var(--nx-teal)}
.nx-switch input:checked + span::after{transform:translateX(1.25rem)}
.nx-switch input:focus-visible + span{box-shadow:0 0 0 3px rgba(42,110,187,.35)}

.nx-modal-actions{
  display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.3rem;padding-top:1.2rem;border-top:1px solid var(--nx-line);
}
.nx-modal-actions .nx-btn{flex:1 1 auto}
.nx-modal-note{margin-top:1rem;font-size:.75rem;color:#64748b}

@media (min-width:640px){
  .nx-modal{align-items:center;padding:1.5rem}
  .nx-modal-panel{border-radius:1rem;padding:2rem}
}
@media (prefers-reduced-motion: reduce){
  .nx-banner{transition:none}
  .nx-switch span,.nx-switch span::after{transition:none}
}