*,*::before,*::after {
  box-sizing:border-box;
  margin:0;
  padding:0
}

:root {
  --bg:#050507;
  --panel:#0C0C12;
  --surface:#14141C;
  --border:rgba(255,255,255,0.06);
  --border-8:rgba(255,255,255,0.08);
  --text:#ECECEC;
  --text-secondary:#8A8A98;
  --text-muted:#5C5C68;
  --text-body:#C8C8D0;
  --accent-1:#8B5CF6;
  --accent-2:#6366F1;
  --accent-3:#38BDF8;
  --grad:linear-gradient(90deg,#8B5CF6,#6366F1,#38BDF8);
  --grad-diag:linear-gradient(135deg,#8B5CF6,#6366F1,#38BDF8);
  --font-ui:'Inter',sans-serif;
  --font-serif:'Instrument Serif',serif;
  --font-mono:'JetBrains Mono',monospace;
}

html {
  scroll-behavior:smooth
}

body {
  background:#050507;
  color:var(--text);
  font-family:var(--font-ui);
  font-weight:400;
  line-height:1.6;
  min-height:100vh;
  overflow-x:hidden;
}

/* BG atmosphere */
body::before {
  content:'';
  position:fixed;
  inset:0;
  background:radial-gradient(ellipse 70% 55% at 15% 95%,rgba(99,102,241,0.09) 0%,transparent 65%);
  pointer-events:none;
  z-index:0;
}

body::after {
  content:'';
  position:fixed;
  inset:0;
  background-image:radial-gradient(circle,rgba(255,255,255,0.04) 1px,transparent 1px);
  background-size:24px 24px;
  pointer-events:none;
  z-index:0;
}

.grain {
  position:fixed;
  inset:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");
  background-repeat:repeat;
  opacity:1;
  pointer-events:none;
  z-index:0;
}

/* PROGRESS BAR */
#progress-bar {
  position:fixed;
  top:64px;
  left:0;
  right:0;
  height:2px;
  z-index:1000;
  background:var(--grad);
  transform:scaleX(0);
  transform-origin:left;
  transition:none;
}

/* NAV */
nav {
  position:fixed;
  top:0;
  left:0;
  right:0;
  height:64px;
  z-index:999;
  background:rgba(255,255,255,0.035);
  backdrop-filter:blur(20px) saturate(140%);
  -webkit-backdrop-filter:blur(20px) saturate(140%);
  border-bottom:1px solid var(--border-8);
  display:flex;
  align-items:center;
  padding:0 32px;
  gap:24px;
  justify-content:space-between;
}

.nav-logo {
  display:flex;
  align-items:center;
  gap:8px;
  text-decoration:none;
  flex-shrink:0
}

.nav-glyph {
  width:24px;
  height:24px;
  display:flex;
  align-items:center;
  justify-content:center
}

.nav-glyph svg {
  display:block
}

.wordmark {
  font-family:var(--font-ui);
  font-weight:600;
  font-size:15px;
  letter-spacing:-0.01em;
  color:var(--text);
}

.nav-breadcrumb {
  flex:1;
  text-align:center;
  font-size:13px;
  color:var(--text-secondary);
  font-weight:400;
  letter-spacing:0.01em;
}

.nav-actions {
  display:flex;
  align-items:center;
  gap:12px;
  flex-shrink:0
}

.nav-back {
  font-size:13px;
  font-weight:500;
  background:var(--grad);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  text-decoration:none;
  white-space:nowrap;
}

.nav-back:hover {
  opacity:0.8
}

.nav-print {
  width:32px;
  height:32px;
  border-radius:50%;
  background:rgba(255,255,255,0.035);
  border:1px solid var(--border-8);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:background 0.2s;
  color:var(--text-secondary);
}

.nav-print:hover {
  background:rgba(255,255,255,0.07);
  color:var(--text)
}

.nav-print-text {
  border-radius:999px;
  font-family:var(--font-ui);
  font-size:12px;
  font-weight:500;
  min-width:54px;
  padding:0 12px;
  width:auto;
}

/* PAGE HEADER */
.page-header {
  position:relative;
  z-index:1;
  padding:96px 24px 64px;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
  margin:0;
  max-width:none;
}

.eyebrow {
  font-size:11px;
  letter-spacing:0.18em;
  color:var(--text-secondary);
  text-transform:uppercase;
  font-weight:500;
  display:flex;
  align-items:center;
  gap:6px;
}

.eyebrow-dot {
  display:inline-block;
  width:8px;
  height:8px;
  background:var(--grad);
  border-radius:1px;
  transform:rotate(45deg);
  flex-shrink:0;
}

.page-title {
  font-size:56px;
  font-weight:300;
  letter-spacing:-0.02em;
  line-height:1.1;
  margin-top:16px;
  color:var(--text);
}

.page-title em {
  font-family:var(--font-serif);
  font-style:italic;
  font-weight:400;
  color:var(--text);
}

.page-sub {
  font-size:16px;
  color:var(--text-secondary);
  max-width:520px;
  line-height:1.55;
  margin-top:20px;
  font-weight:400;
}

.meta-row {
  margin-top:32px;
  font-family:var(--font-mono);
  font-size:12px;
  color:var(--text-muted);
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  justify-content:center;
}

.meta-sep {
  color:var(--text-muted)
}

.meta-pill {
  align-items:center;
  background:rgba(255,255,255,0.035);
  border:1px solid var(--border-8);
  border-radius:999px;
  color:var(--text-muted);
  display:flex;
  font-family:var(--font-mono);
  font-size:11px;
  height:28px;
  letter-spacing:0.08em;
  padding:0 12px;
  white-space:nowrap;
}

/* BODY LAYOUT */
.body-wrap {
  position:relative;
  z-index:1;
  max-width:1200px;
  margin:0 auto;
  padding:0 80px 80px;
  display:grid;
  grid-template-columns:240px 1fr;
  gap:0 48px;
}

/* MINI TOC */
.mini-toc {
  position:sticky;
  top:88px;
  height:calc(100vh - 108px);
  overflow-y:auto;
  padding:4px 0 24px;
  align-self:start;
  scrollbar-width:none;
}

.mini-toc::-webkit-scrollbar {
  display:none
}

.toc-label {
  font-size:11px;
  letter-spacing:0.18em;
  color:var(--text-muted);
  text-transform:uppercase;
  font-weight:500;
  margin-bottom:16px;
  padding:0 12px;
  display:block;
}

.toc-list {
  list-style:none;
  padding:0
}

.toc-item a {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:7px 12px;
  border-radius:4px;
  font-size:13px;
  color:var(--text-secondary);
  text-decoration:none;
  transition:color 0.2s,background 0.2s;
  position:relative;
  border-left:2px solid transparent;
  gap:8px;
}

.toc-item a:hover {
  color:var(--text);
  background:rgba(255,255,255,0.03)
}

.toc-item a.active {
  color:var(--text);
  border-left:2px solid;
  border-image:var(--grad) 1;
}

.toc-dot {
  width:5px;
  height:5px;
  border-radius:50%;
  background:var(--accent-1);
  opacity:0;
  flex-shrink:0;
  transition:opacity 0.2s;
}

.toc-item a.active .toc-dot {
  opacity:1
}

.toc-back {
  display:block;
  margin-top:20px;
  padding:0 12px;
  font-size:12px;
  background:var(--grad);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  text-decoration:none;
  cursor:pointer;
}

/* DOCUMENT */
.document {
  max-width:720px;
  padding-left:64px;
  border-left:1px solid var(--border);
}

.doc-section {
  margin-top:64px
}

.doc-section:first-child {
  margin-top:0
}

.section-heading {
  display:flex;
  align-items:baseline;
  gap:12px;
  font-size:28px;
  font-weight:400;
  line-height:1.2;
  color:var(--text);
}

.section-num {
  font-family:var(--font-mono);
  font-size:14px;
  color:var(--text-secondary);
  flex-shrink:0;
  background:var(--grad);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}

.section-heading em {
  font-family:var(--font-serif);
  font-style:italic;
  font-weight:400;
}

.doc-p {
  font-size:16px;
  color:var(--text-body);
  line-height:1.7;
  max-width:640px;
  margin-top:16px;
}

.doc-p a,.inline-link {
  background:var(--grad);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  text-decoration:none;
  font-weight:500;
}

.doc-p a:hover,.inline-link:hover {
  opacity:0.8
}

.doc-list {
  margin-top:12px;
  padding-left:20px;
  color:var(--text-body);
  font-size:16px;
  line-height:1.7;
}

.doc-list li {
  margin-top:8px
}

/* GLASS PANEL */
.glass {
  background:rgba(255,255,255,0.018);
  backdrop-filter:blur(20px) saturate(140%);
  -webkit-backdrop-filter:blur(20px) saturate(140%);
  border:1px solid var(--border-8);
  border-radius:16px;
  overflow:hidden;
  margin-top:24px;
}

.glass-inner-glow {
  box-shadow:inset 0 1px 0 rgba(139,92,246,0.12),0 1px 32px rgba(0,0,0,0.4);
}

/* TABLES */
.glass-table {
  width:100%;
  border-collapse:collapse;
  font-size:14px
}

.glass-table th {
  font-size:11px;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--text-muted);
  font-weight:500;
  font-family:var(--font-ui);
  padding:12px 16px;
  text-align:left;
  border-bottom:1px solid var(--border-8);
}

.glass-table td {
  padding:12px 16px;
  color:var(--text-body);
  border-bottom:1px solid var(--border);
  vertical-align:top;
  transition:background 0.2s;
}

.glass-table tr:last-child td {
  border-bottom:none
}

.glass-table tbody tr:hover td {
  background:rgba(255,255,255,0.025)
}

/* CATEGORY CHIPS */
.chip {
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:3px 8px;
  border-radius:4px;
  font-size:12px;
  font-weight:500;
  white-space:nowrap;
  font-family:var(--font-mono);
}

.chip-purple {
  background:rgba(139,92,246,0.15);
  color:#A78BFA;
  border:1px solid rgba(139,92,246,0.3)
}

.chip-blue {
  background:rgba(56,189,248,0.1);
  color:#67E8F9;
  border:1px solid rgba(56,189,248,0.25)
}

.chip-muted {
  background:rgba(255,255,255,0.06);
  color:var(--text-secondary);
  border:1px solid var(--border-8)
}

.chip-dot {
  width:5px;
  height:5px;
  border-radius:50%;
  background:currentColor;
  opacity:0.7
}

.table-footnote {
  font-size:12px;
  color:var(--text-muted);
  margin-top:10px;
  padding:0 4px;
  font-style:italic;
}

/* SUB-PROCESSORS CALLOUT */
.callout {
  background:rgba(255,255,255,0.018);
  backdrop-filter:blur(20px) saturate(140%);
  -webkit-backdrop-filter:blur(20px) saturate(140%);
  border:1px solid var(--border-8);
  border-left:2px solid;
  border-image:var(--grad) 1;
  border-radius:0 12px 12px 0;
  padding:20px 20px 20px 22px;
  margin-top:24px;
}

.callout-label {
  font-size:10px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--text-muted);
  font-weight:600;
  margin-bottom:10px;
  display:block;
}

.callout-body {
  font-size:14px;
  color:var(--text-body);
  line-height:1.65
}

.processor-pills {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:14px;
}

.processor-pill {
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:0 12px;
  height:32px;
  border-radius:999px;
  background:rgba(255,255,255,0.04);
  border:1px solid var(--border-8);
  font-size:13px;
  color:var(--text);
  text-decoration:none;
  transition:background 0.2s,border-color 0.2s;
  font-weight:400;
  white-space:nowrap;
}

.processor-pill:hover {
  background:rgba(255,255,255,0.08);
  border-color:rgba(255,255,255,0.14)
}

.processor-pill svg {
  flex-shrink:0;
  opacity:0.7
}

.pill-arrow {
  font-size:11px;
  color:var(--text-muted);
  margin-left:2px
}

.callout-link {
  display:inline-block;
  margin-top:14px;
  font-size:13px;
  background:var(--grad);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  text-decoration:none;
  font-weight:500;
}

/* YOUR RIGHTS PANEL */
.rights-panel {
  background:rgba(139,92,246,0.04);
  backdrop-filter:blur(20px) saturate(140%);
  -webkit-backdrop-filter:blur(20px) saturate(140%);
  border:1px solid rgba(139,92,246,0.18);
  border-radius:16px;
  padding:24px;
  margin-top:24px;
  box-shadow:0 0 48px rgba(139,92,246,0.07);
}

.rights-label {
  font-size:11px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--text-muted);
  font-weight:600;
  margin-bottom:12px;
  display:block;
}

.rights-heading {
  font-size:20px;
  font-weight:500;
  color:var(--text);
  line-height:1.3;
  margin-bottom:20px;
}

.rights-heading em {
  font-family:var(--font-serif);
  font-style:italic;
  font-weight:400;
}

.rights-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-bottom:24px;
}

.right-item {
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:12px;
  background:rgba(255,255,255,0.02);
  border-radius:8px;
  border:1px solid var(--border);
}

.right-check {
  width:16px;
  height:16px;
  flex-shrink:0;
  margin-top:1px;
  color:var(--accent-1);
}

.right-text {
}

.right-name {
  font-size:14px;
  font-weight:500;
  color:var(--text);
  line-height:1.3
}

.right-desc {
  font-size:12px;
  color:var(--text-secondary);
  margin-top:2px;
  line-height:1.4
}

/* REQUEST CTA */
.request-cta {
  width:100%;
  height:48px;
  border-radius:12px;
  background:var(--grad-diag);
  border:none;
  color:#fff;
  font-size:15px;
  font-weight:500;
  font-family:var(--font-ui);
  cursor:pointer;
  transition:transform 0.15s,box-shadow 0.15s;
  box-shadow:0 0 24px rgba(139,92,246,0.3);
  position:relative;
  overflow:hidden;
}

.request-cta:hover {
  transform:translateY(-1px);
  box-shadow:0 0 36px rgba(139,92,246,0.45)
}

.request-cta:active {
  transform:translateY(0)
}

.request-cta-link {
  align-items:center;
  display:flex;
  justify-content:center;
  text-decoration:none;
}

.mono-cell {
  font-family:var(--font-mono);
  font-size:13px;
  color:var(--text)!important;
  white-space:nowrap
}

.cta-confirm {
  font-size:13px;
  color:var(--text-secondary);
  margin-top:10px;
  opacity:0;
  transition:opacity 0.3s;
  text-align:center;
}

.cta-confirm.visible {
  opacity:1
}

/* BACK TO TOP FLOAT */
#back-top {
  position:fixed;
  bottom:32px;
  right:32px;
  width:40px;
  height:40px;
  border-radius:50%;
  background:var(--grad-diag);
  border:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:0;
  transform:translateY(8px);
  transition:opacity 0.3s,transform 0.3s;
  box-shadow:0 4px 20px rgba(139,92,246,0.4);
  z-index:100;
}

#back-top.visible {
  opacity:1;
  transform:translateY(0)
}

#back-top:hover {
  box-shadow:0 4px 28px rgba(139,92,246,0.6)
}

#back-top svg {
  color:#fff
}

/* FOOTER */
footer {
  position:relative;
  z-index:1;
  border-top:1px solid var(--border);
  padding:28px 80px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  max-width:1200px;
  margin:40px auto 0;
  flex-wrap:wrap;
  gap:16px;
  background:transparent;
  box-shadow:none;
}

footer.zirel-public-footer.legal-public-footer {
  background:rgba(5,5,7,0.82);
  border-top:1px solid rgba(255,255,255,0.07);
  display:block;
  margin:40px 0 0;
  max-width:none;
  padding:44px 20px 0;
  width:100%;
}

.legal-main-brand .zirel-public-brand-mark {
  flex-shrink:0
}

.footer-logo {
  display:flex;
  align-items:center;
  gap:6px;
  font-size:12px;
  color:var(--text-muted);
  font-weight:500;
}

.footer-links {
  display:flex;
  gap:20px
}

.footer-links a {
  font-size:12px;
  color:var(--text-muted);
  text-decoration:none;
  transition:color 0.2s;
}

.footer-links a:hover {
  color:var(--text-secondary)
}

.footer-copy {
  font-size:12px;
  color:var(--text-muted)
}

/* HORIZONTAL TOC (mobile) */
.toc-mobile {
  display:none;
  position:sticky;
  top:64px;
  z-index:90;
  background:rgba(5,5,7,0.9);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border);
  overflow-x:auto;
  white-space:nowrap;
  padding:0 20px;
  scrollbar-width:none;
}

.toc-mobile::-webkit-scrollbar {
  display:none
}

.toc-mobile a {
  display:inline-block;
  padding:12px 10px;
  font-size:12px;
  font-family:var(--font-mono);
  color:var(--text-muted);
  text-decoration:none;
  transition:color 0.2s;
}

.toc-mobile a.active {
  background:var(--grad);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}

/* RESPONSIVE */
@media(max-width:1024px) {
  .body-wrap {
    grid-template-columns:1fr;
    padding:0 24px 80px;
    gap:0;
  }
  .mini-toc {
    display:none
  }
  .toc-mobile {
    display:block
  }
  .document {
    padding-left:0;
    border-left:none;
    max-width:100%
  }
  footer.zirel-public-footer.legal-public-footer {
    padding:40px 20px 0
  }
  .rights-grid {
    grid-template-columns:1fr
  }
}

@media(max-width:600px) {
  .page-title {
    font-size:36px
  }
  .nav-breadcrumb {
    display:none
  }
  .processor-pills {
    flex-direction:column
  }
}

/* PRINT */
@media print {
  .grain,body::before,body::after,nav,#progress-bar,
  .mini-toc,.toc-mobile,#back-top,footer,
  .request-cta,.cta-confirm {
    display:none!important
  }
  body {
    background:#fff!important;
    color:#111!important
  }
  .body-wrap {
    grid-template-columns:1fr!important;
    padding:0!important
  }
  .document {
    padding-left:0!important;
    border:none!important;
    max-width:100%!important
  }
  .glass,.callout,.rights-panel {
    background:#f5f5f5!important;
    border:1px solid #ccc!important;
    box-shadow:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
  .glass-table th,.glass-table td {
    border-color:#ccc!important
  }
  .glass-table td,.doc-p,.doc-list,.callout-body,.right-desc {
    color:#333!important
  }
  .glass-table th,.section-num,.chip,.toc-label {
    color:#666!important
  }
  .section-heading,.right-name,.wordmark,.rights-heading,.doc-p {
    color:#111!important
  }
  .page-header {
    padding-top:24px!important
  }
  .doc-section {
    page-break-inside:avoid
  }
  .glass {
    page-break-inside:avoid
  }
  .doc-p a,.inline-link,.callout-link,.toc-back {
    -webkit-text-fill-color:#4338CA!important;
    color:#4338CA!important;
  }
  .chip-purple {
    background:#e9e5ff!important;
    color:#4338CA!important;
    border-color:#c4b5fd!important
  }
  .chip-blue {
    background:#e0f9ff!important;
    color:#0369a1!important;
    border-color:#7dd3fc!important
  }
  .chip-muted {
    background:#f1f5f9!important;
    color:#475569!important;
    border-color:#cbd5e1!important
  }
  .request-cta {
    display:none!important
  }
  .section-num {
    -webkit-text-fill-color:#4338CA!important;
    color:#4338CA!important
  }
  .eyebrow-dot,.toc-dot {
    display:none!important
  }
  .eyebrow {
    color:#666!important
  }
  .meta-row {
    color:#666!important
  }
  .page-title,.page-title em {
    color:#111!important
  }
  .page-sub {
    color:#444!important
  }
  .rights-panel {
    background:#faf5ff!important;
    border:1px solid #c4b5fd!important
  }
  .right-item {
    background:#f5f3ff!important;
    border-color:#ddd6fe!important
  }
  .right-name {
    color:#111!important
  }
  .right-desc {
    color:#555!important
  }
}
