/* SVI blog, site v7 look (13.10.2026). Dark by default, light by the site rule (body.light from shared-nav.js;
   html.bl-light is set in <head> before paint so the light page does not flash dark). Tiles, glass, slow glows. */
.bl-page{background:#030712;color:var(--text);min-height:100vh;overflow-x:hidden}
.bl-page *{min-width:0}
.bl-bg{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.bl-orb{position:absolute;border-radius:50%;filter:blur(70px);opacity:.42;will-change:transform}
.bl-orb.a{width:620px;height:620px;left:-180px;top:-200px;background:radial-gradient(closest-side,rgba(0,212,255,.55),transparent);animation:blDrift 26s ease-in-out infinite alternate}
.bl-orb.b{width:700px;height:700px;right:-240px;top:22vh;background:radial-gradient(closest-side,rgba(139,92,246,.45),transparent);animation:blDrift 32s ease-in-out -8s infinite alternate-reverse}
.bl-orb.c{width:520px;height:520px;left:30vw;bottom:-260px;background:radial-gradient(closest-side,rgba(59,130,246,.35),transparent);animation:blDrift 38s ease-in-out -14s infinite alternate}
.bl-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:60px 60px;-webkit-mask:radial-gradient(ellipse at 50% 0%,#000 30%,transparent 75%);mask:radial-gradient(ellipse at 50% 0%,#000 30%,transparent 75%)}
@keyframes blDrift{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(60px,40px,0) scale(1.12)}}
.bl-progress{position:fixed;left:0;top:0;right:0;height:3px;z-index:1100;pointer-events:none}
.bl-progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,#00d4ff,#3b82f6,#a855f7);box-shadow:0 0 12px rgba(0,212,255,.6)}

.bl-main section{padding:0}
.bl-main{position:relative;z-index:1;max-width:1180px;margin:0 auto;padding:7.2rem 24px 3rem}
.bl-crumbs{display:flex;gap:.5rem;align-items:center;font-size:.85rem;color:var(--text-m);margin-bottom:1.4rem;flex-wrap:wrap}
.bl-crumbs a{color:var(--text-m)}.bl-crumbs a:hover{color:var(--cyan)}
.bl-chip,.bl-badge,.bl-eyebrow{display:inline-flex;align-items:center;gap:.45rem;padding:.3rem .8rem;border-radius:100px;font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-family:'JetBrains Mono',ui-monospace,monospace}
.bl-chip,.bl-eyebrow{color:#5fe3ff;background:rgba(0,212,255,.08);border:1px solid rgba(0,212,255,.3)}
.bl-eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:#00d4ff;box-shadow:0 0 10px #00d4ff;animation:blPulse 2s infinite}
@keyframes blPulse{50%{opacity:.35}}
.bl-badge{color:#fbbf24;background:rgba(245,158,11,.08);border:1px solid rgba(245,158,11,.3)}
.bl-old{display:inline-block;padding:.55rem 1rem;border-radius:12px;font-size:.88rem;font-weight:600;color:#fcd34d;background:rgba(245,158,11,.08);border:1px solid rgba(245,158,11,.28)}

.bl-head{max-width:860px;margin:0 0 2.4rem}
.bl-head h1,.bl-hub h1{font-family:'Space Grotesk',sans-serif;font-weight:700;letter-spacing:-.025em;line-height:1.08;margin:1rem 0 1rem;font-size:clamp(2rem,4.6vw,3.4rem);background:linear-gradient(135deg,#fff 0%,#dbeafe 45%,#7dd3fc 75%,#a78bfa 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;overflow-wrap:break-word}
.bl-lead{font-size:1.12rem;line-height:1.6;color:var(--text-m);max-width:760px}
.bl-byline{display:flex;align-items:center;gap:.55rem;flex-wrap:wrap;margin-top:1.3rem;font-size:.86rem;color:var(--text-m)}
.bl-dot{width:8px;height:8px;border-radius:50%;background:#34d399;box-shadow:0 0 10px #34d399}

.bl-layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:56px;align-items:start}
.bl-toc{position:sticky;top:110px;display:flex;flex-direction:column;gap:.15rem;padding:1rem;border-radius:16px;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.07);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.bl-toc.empty{visibility:hidden}
.bl-toc a{font-size:.82rem;line-height:1.35;color:var(--text-m);padding:.4rem .55rem;border-radius:8px;border-left:2px solid transparent}
.bl-toc a:hover{color:#fff;background:rgba(255,255,255,.04)}
.bl-toc a.on{color:#5fe3ff;border-left-color:#00d4ff;background:rgba(0,212,255,.06)}

.bl-body{max-width:740px;font-size:1.08rem;line-height:1.78;color:#cfdbe8;overflow-wrap:break-word}
.bl-body p{margin:0 0 1.2rem}
.bl-body h2{font-family:'Space Grotesk',sans-serif;font-size:clamp(1.4rem,2.6vw,1.85rem);line-height:1.2;color:#fff;margin:2.6rem 0 1rem;letter-spacing:-.015em;scroll-margin-top:110px}
.bl-body h3{font-size:1.2rem;color:#fff;margin:1.8rem 0 .7rem}
.bl-body ul,.bl-body ol{margin:0 0 1.4rem;padding:0;list-style:none;display:grid;gap:.6rem}
.bl-body li{position:relative;padding:.85rem 1rem .85rem 2.6rem;border-radius:14px;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.06)}
.bl-body ul>li::before{content:"";position:absolute;left:1.05rem;top:1.45rem;width:8px;height:8px;border-radius:50%;background:linear-gradient(135deg,#00d4ff,#8b5cf6);box-shadow:0 0 10px rgba(0,212,255,.6)}
.bl-body ol{counter-reset:bl}
.bl-body ol>li{counter-increment:bl}
.bl-body ol>li::before{content:counter(bl);position:absolute;left:.8rem;top:.9rem;width:1.35rem;height:1.35rem;border-radius:7px;display:grid;place-items:center;font-size:.75rem;font-weight:800;color:#03121a;background:linear-gradient(135deg,#00d4ff,#3b82f6)}
.bl-body strong{color:#fff}
.bl-body a{color:#5fe3ff;text-decoration:underline;text-decoration-color:rgba(0,212,255,.35);text-underline-offset:3px}
.bl-body a:hover{color:#fff;text-decoration-color:#00d4ff}
.bl-body blockquote{margin:1.6rem 0 .5rem;padding:1.3rem 1.5rem;border-radius:16px;font-family:'Space Grotesk',sans-serif;font-size:1.2rem;line-height:1.5;color:#fff;background:linear-gradient(135deg,rgba(0,212,255,.08),rgba(139,92,246,.08));border:1px solid rgba(0,212,255,.22)}
.bl-body p.cite{font-size:.9rem;color:var(--text-m);margin-bottom:1.8rem}

.bl-cta{margin:3.6rem 0 0}
.bl-cta-in{position:relative;overflow:hidden;padding:2.4rem 2rem;border-radius:24px;text-align:center;background:linear-gradient(135deg,rgba(0,212,255,.10),rgba(59,130,246,.06) 50%,rgba(139,92,246,.12));border:1px solid rgba(0,212,255,.22)}
.bl-cta-in::after{content:"";position:absolute;inset:-40%;background:conic-gradient(from 0deg,transparent,rgba(0,212,255,.10),transparent 30%);animation:blSpin 14s linear infinite;pointer-events:none}
@keyframes blSpin{to{transform:rotate(360deg)}}
.bl-cta h2{position:relative;font-family:'Space Grotesk',sans-serif;font-size:clamp(1.4rem,3vw,2rem);color:#fff;margin-bottom:.6rem}
.bl-cta p{position:relative;color:var(--text-m);max-width:560px;margin:0 auto 1.4rem}
.bl-cta-b{position:relative;display:flex;gap:.8rem;justify-content:center;flex-wrap:wrap}
.bl-btn{display:inline-flex;align-items:center;justify-content:center;padding:.85rem 1.6rem;border-radius:12px;font-weight:700;font-size:.92rem;color:#03121a;background:linear-gradient(135deg,#00d4ff,#3b82f6);box-shadow:0 8px 30px rgba(0,212,255,.25)}
.bl-btn:hover{color:#03121a;transform:translateY(-2px);box-shadow:0 12px 36px rgba(0,212,255,.35)}
.bl-btn.ghost{color:#fff;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);box-shadow:none}
.bl-btn.ghost:hover{color:#fff;background:rgba(255,255,255,.09)}

.bl-rel{margin-top:3.4rem}
.bl-rel h2,.bl-h2{font-family:'Space Grotesk',sans-serif;font-size:1.5rem;color:#fff;margin-bottom:1.1rem}
.bl-grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.bl-card{position:relative;display:flex;flex-direction:column;gap:.7rem;padding:1.4rem 1.4rem 1.2rem;border-radius:20px;color:inherit;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.07);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);transition:transform .45s cubic-bezier(.16,1,.3,1),border-color .3s,box-shadow .3s}
.bl-card:hover{transform:translateY(-4px);border-color:rgba(0,212,255,.35);box-shadow:0 18px 50px rgba(0,212,255,.10);color:inherit}
.bl-card-top{display:flex;align-items:center;justify-content:space-between;gap:.6rem;flex-wrap:wrap}
.bl-meta{font-size:.78rem;color:var(--text-m)}
.bl-card-t{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:1.15rem;line-height:1.3;color:#fff}
.bl-card-d{font-size:.92rem;line-height:1.55;color:var(--text-m);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.bl-card-go{margin-top:auto;display:inline-flex;align-items:center;gap:.35rem;font-size:.86rem;font-weight:700;color:#5fe3ff}
.bl-card-go svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s}
.bl-card:hover .bl-card-go svg{transform:translateX(4px)}
.bl-card.big{padding:2rem;margin-bottom:18px;background:linear-gradient(135deg,rgba(0,212,255,.09),rgba(139,92,246,.08));border-color:rgba(0,212,255,.22)}
.bl-card.big .bl-card-t{font-size:clamp(1.4rem,2.8vw,2rem)}
.bl-card.big .bl-card-d{font-size:1rem;-webkit-line-clamp:4;max-width:760px}
.bl-card.old .bl-card-t{color:#e2e8f0}

.bl-hub{text-align:center;max-width:820px;margin:0 auto 1.6rem}
.bl-hub h1{font-size:clamp(2.4rem,6vw,4.4rem)}
.bl-hub .bl-lead{margin:0 auto}
.bl-sec{margin-bottom:3rem}
.bl-note{color:var(--text-m);margin:-.4rem 0 1.1rem;font-size:.92rem}

.bl-card,.bl-head,.bl-hub{animation:blIn .8s cubic-bezier(.2,.7,.2,1) both}
.bl-grid3 .bl-card:nth-child(2){animation-delay:.08s}.bl-grid3 .bl-card:nth-child(3){animation-delay:.16s}
@keyframes blIn{from{opacity:.001;transform:translateY(18px)}to{opacity:1;transform:none}}

@media (max-width:1100px){.bl-layout{grid-template-columns:minmax(0,1fr)}.bl-toc{display:none}.bl-body{max-width:none}}
@media (max-width:900px){.bl-grid3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){
  .bl-main{padding:6.2rem 16px 2rem}
  .bl-grid3{grid-template-columns:minmax(0,1fr)}
  .bl-body{font-size:1.02rem;line-height:1.72}
  .bl-body li{padding:.8rem .85rem .8rem 2.3rem}
  .bl-card.big{padding:1.4rem}
  .bl-cta-in{padding:1.8rem 1.1rem}
  .bl-orb{filter:blur(50px)}
}
@media (prefers-reduced-motion:reduce){.bl-orb,.bl-cta-in::after,.bl-eyebrow::before{animation:none}.bl-card,.bl-head,.bl-hub{animation:none}}

/* light theme */
html.bl-light .bl-page,body.light.bl-page{background:#f6f8fc;color:#334155;--text:#334155;--text-m:#64748b}
html.bl-light .bl-orb,body.light .bl-orb{opacity:.28}
html.bl-light .bl-grid,body.light .bl-grid{background-image:linear-gradient(rgba(15,23,42,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(15,23,42,.05) 1px,transparent 1px)}
html.bl-light .bl-head h1,html.bl-light .bl-hub h1,body.light .bl-head h1,body.light .bl-hub h1{background:linear-gradient(135deg,#0f172a 0%,#1e3a8a 50%,#0891b2 80%,#7c3aed 100%);-webkit-background-clip:text;background-clip:text}
html.bl-light .bl-body,body.light .bl-body{color:#334155}
html.bl-light .bl-body h2,html.bl-light .bl-body h3,html.bl-light .bl-body strong,html.bl-light .bl-card-t,html.bl-light .bl-rel h2,html.bl-light .bl-h2,html.bl-light .bl-cta h2,
body.light .bl-body h2,body.light .bl-body h3,body.light .bl-body strong,body.light .bl-card-t,body.light .bl-rel h2,body.light .bl-h2,body.light .bl-cta h2,body.light .bl-card.old .bl-card-t{color:#0f172a}
html.bl-light .bl-body li,html.bl-light .bl-card,html.bl-light .bl-toc,body.light .bl-body li,body.light .bl-card,body.light .bl-toc{background:#fff;border-color:rgba(15,23,42,.07);box-shadow:0 4px 18px rgba(15,23,42,.05)}
html.bl-light .bl-card.big,body.light .bl-card.big{background:linear-gradient(135deg,#ecfeff,#f5f3ff);border-color:rgba(8,145,178,.2)}
html.bl-light .bl-body a,html.bl-light .bl-card-go,html.bl-light .bl-chip,html.bl-light .bl-eyebrow,body.light .bl-body a,body.light .bl-card-go,body.light .bl-chip,body.light .bl-eyebrow{color:#0e7490}
html.bl-light .bl-body a:hover,body.light .bl-body a:hover{color:#0f172a}
html.bl-light .bl-toc a:hover,body.light .bl-toc a:hover{color:#0f172a;background:rgba(15,23,42,.04)}
html.bl-light .bl-toc a.on,body.light .bl-toc a.on{color:#0e7490}
html.bl-light .bl-body blockquote,body.light .bl-body blockquote{color:#0f172a;background:linear-gradient(135deg,#ecfeff,#f5f3ff);border-color:rgba(8,145,178,.2)}
html.bl-light .bl-badge,html.bl-light .bl-old,body.light .bl-badge,body.light .bl-old{color:#92400e;background:#fffbeb;border-color:rgba(217,119,6,.3)}
html.bl-light .bl-cta-in,body.light .bl-cta-in{background:linear-gradient(135deg,#ecfeff,#eff6ff 50%,#f5f3ff);border-color:rgba(8,145,178,.2)}
html.bl-light .bl-btn.ghost,body.light .bl-btn.ghost{color:#0f172a;background:#fff;border-color:rgba(15,23,42,.12)}