/* SLV CORE UI (GLOBAL) — WIDE + WP-safe */

.slv-ui{
  --bg0:#0b1222;
  --bg1:#0e1730;
  --bg2:#0f1b36;

  --text:rgba(255,255,255,.92);
  --muted:rgba(255,255,255,.74);
  --dim:rgba(255,255,255,.60);

  --accent:#67e8f9;
  --accent2:#a78bfa;
  --good:#2dd4bf;
  --warn:#fbbf24;

  --line:rgba(255,255,255,.12);
  --glass1:rgba(255,255,255,.08);
  --glass2:rgba(255,255,255,.12);

  --shadow:0 18px 60px rgba(0,0,0,.45);
  --inset:inset 0 1px 0 rgba(255,255,255,.10);

  --r:18px;
  --r2:26px;

  --slv-max:2200px;
  --edge:clamp(12px, 2.1vw, 72px);

  color:var(--text);
  font-family:ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Apple Color Emoji","Segoe UI Emoji";
}

/* Put the heavy background directly here instead of inside a CSS variable */
.slv-ui.slv-page{
  background:
    radial-gradient(900px 560px at 18% 12%, rgba(103,232,249,.12), transparent 60%),
    radial-gradient(820px 540px at 82% 18%, rgba(167,139,250,.12), transparent 62%),
    radial-gradient(1000px 700px at 50% 105%, rgba(45,212,191,.08), transparent 60%),
    linear-gradient(180deg, var(--bg0), var(--bg1) 40%, var(--bg2));
}


.slv-ui *{ box-sizing:border-box; }
.slv-ui a{ color:inherit; text-decoration:none; }
.slv-ui a:focus-visible{
  outline:2px solid rgba(103,232,249,.6);
  outline-offset:2px;
  border-radius:10px;
}

/* ✅ Full-bleed breakout (Astra/container escape) */
.slv-ui.alignfull{
  width:100vw !important;
  max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;
  position:relative;
}

/* Optional: if Astra clips alignfull on some layouts */
.entry-content,
.site-content,
.ast-container{
  overflow: visible !important;
}

/* ✅ Page surface */
.slv-ui.slv-page{
  background:var(--slv-page-bg);
  padding:clamp(18px, 3.5vw, 44px) 0;
  overflow-x:clip;
  overflow-y:visible;
  isolation:isolate;
}

/* ✅ Stage width (THIS is the wide control) */
.slv-ui .slv-wrap{
  width:min(var(--slv-max), calc(100% - (2 * var(--edge))));
  margin:0 auto;
}

/* Card base */
.slv-ui .slv-card{
  background:linear-gradient(145deg, rgba(255,255,255,.10), rgba(255,255,255,.06));
  border:1px solid rgba(255,255,255,.10);
  box-shadow:var(--shadow), var(--inset);
  border-radius:var(--r2);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}

/* Hero */
.slv-ui .slv-hero{ padding:clamp(18px, 2.8vw, 28px); position:relative; }
.slv-ui .slv-heroGrid{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:clamp(14px, 2.4vw, 24px);
  align-items:start;
}
@media (max-width:940px){
  .slv-ui .slv-heroGrid{ grid-template-columns:1fr; }
}

/* Typography */
.slv-ui h1{
  margin:10px 0 10px;
  font-size:clamp(26px, 4.2vw, 44px);
  line-height:1.06;
  letter-spacing:-0.02em;
}
.slv-ui h2{
  margin:0 0 12px;
  font-size:clamp(18px, 2.6vw, 26px);
  letter-spacing:-0.01em;
  line-height:1.2;
}
.slv-ui .slv-lead{
  margin:0 0 16px;
  color:var(--muted);
  font-size:clamp(14px, 1.6vw, 17px);
  line-height:1.55;
  max-width:62ch;
}
.slv-ui .slv-sub{
  margin:-6px 0 14px;
  color:var(--muted);
  font-size:14px;
  line-height:1.55;
  max-width:74ch;
}
.slv-ui .slv-note{
  margin-top:12px;
  color:var(--dim);
  font-size:12.5px;
  line-height:1.55;
}

/* Sections */
.slv-ui .slv-section{
  margin-top:clamp(16px, 2.8vw, 26px);
  padding:clamp(16px, 2.8vw, 22px);
}

/* Chips */
.slv-ui .slv-chipRow{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.slv-ui .slv-chip{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 12px; border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(0,0,0,.18);
  color:var(--muted);
  font-weight:800;
  letter-spacing:.02em;
  font-size:12px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.slv-ui .slv-dot{
  width:8px; height:8px; border-radius:999px;
  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,.7), rgba(255,255,255,0) 60%),
    linear-gradient(180deg, var(--accent), var(--accent2));
  box-shadow:0 0 0 3px rgba(103,232,249,.12);
}

/* Buttons */
.slv-ui .slv-ctaRow{ display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; }
.slv-ui .slv-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:12px 14px; border-radius:14px;
  font-weight:900; letter-spacing:.01em;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(0,0,0,.18);
  box-shadow:0 10px 30px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.10);
  transition:transform .16s ease, filter .16s ease, background .16s ease;
  user-select:none;
  -webkit-tap-highlight-color:transparent;
}
.slv-ui .slv-btn:hover{ transform:translateY(-1px); filter:brightness(1.03); }
.slv-ui .slv-btnPrimary{
  border-color:rgba(103,232,249,.30);
  background:linear-gradient(145deg, rgba(103,232,249,.22), rgba(167,139,250,.16));
}
.slv-ui .slv-btnGhost{ background:rgba(255,255,255,.06); }
.slv-ui .slv-btnIcon{
  width:28px; height:28px; border-radius:10px;
  display:grid; place-items:center;
  background:rgba(0,0,0,.22);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10);
  font-size:14px;
}

/* Sticky mini-nav */
.slv-ui .slv-miniNav{
  display:flex; flex-wrap:wrap; gap:8px;
  padding:12px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.12);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  position:sticky;
  top:14px;
  z-index:5;
}
.slv-ui .slv-miniNav a{
  padding:8px 10px; border-radius:12px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  color:var(--muted);
  font-weight:850;
  font-size:12px;
  transition:transform .14s ease, filter .14s ease;
}
.slv-ui .slv-miniNav a:hover{ transform:translateY(-1px); filter:brightness(1.06); }

/* Side box */
.slv-ui .slv-sideBox{
  padding:16px; border-radius:22px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.06);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.slv-ui .slv-sideTitle{
  margin:0 0 8px;
  font-weight:950;
  letter-spacing:.01em;
  font-size:14px;
  color:rgba(255,255,255,.88);
}
.slv-ui .slv-sideText{ margin:0; color:var(--muted); font-size:13px; line-height:1.5; }
.slv-ui .slv-sideList{ margin:10px 0 0; padding-left:18px; color:var(--muted); font-size:13px; line-height:1.55; }

/* Grid */
.slv-ui .slv-grid{ display:grid; grid-template-columns:repeat(12, 1fr); gap:12px; }
.slv-ui .slv-col-6{ grid-column:span 6; }
.slv-ui .slv-col-4{ grid-column:span 4; }
.slv-ui .slv-col-8{ grid-column:span 8; }
.slv-ui .slv-col-12{ grid-column:span 12; }
@media (max-width:920px){
  .slv-ui .slv-col-6,
  .slv-ui .slv-col-4,
  .slv-ui .slv-col-8{ grid-column:span 12; }
}

/* Tiles */
.slv-ui .slv-tile{
  padding:14px; border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.12);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  position:relative;
  overflow:hidden;
}
.slv-ui .slv-tile h3{
  margin:0 0 8px;
  font-size:14px;
  font-weight:950;
  letter-spacing:.01em;
}
.slv-ui .slv-tile p{ margin:0; color:var(--muted); font-size:13px; line-height:1.5; }
.slv-ui .slv-kicker{ display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.slv-ui .slv-badge{
  padding:6px 10px; border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  color:var(--muted);
  font-weight:900;
  font-size:12px;
}

/* Lists */
.slv-ui .slv-list{
  margin:10px 0 0;
  padding:0;
  list-style:none;
  display:grid;
  gap:10px;
}
.slv-ui .slv-li{
  display:flex; gap:10px;
  padding:12px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.05);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.slv-ui .slv-liIcon{
  width:28px; height:28px;
  border-radius:12px;
  display:grid; place-items:center;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10);
  flex:0 0 auto;
}
.slv-ui .slv-li b{ color:rgba(255,255,255,.90); font-weight:950; }
.slv-ui .slv-li span{ color:var(--muted); font-size:13px; line-height:1.45; display:block; }

/* Steps */
.slv-ui .slv-steps{ display:grid; gap:10px; }
.slv-ui .slv-step{
  display:grid;
  grid-template-columns:46px 1fr;
  gap:12px;
  padding:14px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.12);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.slv-ui .slv-stepNo{
  width:46px; height:46px;
  border-radius:18px;
  display:grid; place-items:center;
  font-weight:950;
  color:rgba(255,255,255,.92);
  background:linear-gradient(145deg, rgba(103,232,249,.22), rgba(167,139,250,.14));
  border:1px solid rgba(103,232,249,.28);
  box-shadow:0 12px 32px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.10);
}
.slv-ui .slv-step h3{ margin:0 0 6px; font-size:14px; font-weight:950; letter-spacing:.01em; }
.slv-ui .slv-step p{ margin:0; color:var(--muted); font-size:13px; line-height:1.5; }

/* Callouts */
.slv-ui .slv-callout{
  padding:16px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(500px 220px at 10% 0%, rgba(103,232,249,.14), transparent 60%),
    radial-gradient(520px 240px at 90% 0%, rgba(167,139,250,.14), transparent 62%),
    rgba(0,0,0,.12);
  box-shadow:var(--shadow), inset 0 1px 0 rgba(255,255,255,.08);
}
.slv-ui .slv-callout h3{ margin:0 0 8px; font-size:16px; font-weight:950; }
.slv-ui .slv-callout p{ margin:0; color:var(--muted); line-height:1.55; font-size:13.5px; }

/* FAQ */
.slv-ui details{
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.12);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  padding:12px 14px;
}
.slv-ui details + details{ margin-top:10px; }
.slv-ui summary{
  cursor:pointer;
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  font-weight:950;
  color:rgba(255,255,255,.90);
}
.slv-ui summary::-webkit-details-marker{ display:none; }
.slv-ui .slv-faqIcon{
  width:28px; height:28px;
  border-radius:12px;
  display:grid; place-items:center;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.06);
  color:var(--muted);
  flex:0 0 auto;
}
.slv-ui details[open] .slv-faqIcon{
  background:linear-gradient(145deg, rgba(103,232,249,.18), rgba(167,139,250,.12));
  border-color:rgba(103,232,249,.24);
  color:rgba(255,255,255,.88);
}
.slv-ui .slv-faqBody{
  margin-top:10px;
  color:var(--muted);
  font-size:13.5px;
  line-height:1.6;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .slv-ui .slv-btn,
  .slv-ui .slv-miniNav a{ transition:none; }
}