@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,700;1,400&family=Inter:wght@400;500;600&display=swap');
/* ═══ CSS CUSTOM PROPERTIES ═══ */
	:root{
	  --bg-deep:#08080a;--bg-body:#0a0a0f;--bg-surface:#0f0f16;--bg-card:#111118;--bg-raised:#14141c;--bg-input:#17171f;
	  --border-dim:#191923;--border:#1e1e2a;--border-hover:#2a2a38;--border-accent:#c4440;
	  --red:#c44;--red-bright:#d55;--red-glow:#e44;--red-bg:rgba(200,60,60,.08);--red-bg-hover:rgba(200,60,60,.15);
	  --gold:#c9a030;--gold-dim:rgba(201,160,48,.12);--gold-glow:rgba(201,160,48,.25);
	  --text-primary:#ddd;--text-body:#bbb;--text-secondary:#999;--text-muted:#666;--text-dim:#444;
	  --font-display:'Playfair Display',serif;--font-body:'Inter',-apple-system,sans-serif;
	  --shadow-sm:0 2px 8px rgba(0,0,0,.25);--shadow-md:0 6px 24px rgba(0,0,0,.35);--shadow-lg:0 12px 48px rgba(0,0,0,.5);
	  --radius-sm:4px;--radius:6px;--radius-lg:10px;
	  --ease-out:cubic-bezier(.4,0,.2,1);
	}

/* ============ RESET ============ */
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:var(--font-body);color:var(--text-body);background:var(--bg-body);min-height:100vh;display:flex;overflow-x:hidden;position:relative}
a{color:#d55;text-decoration:none;transition:color .2s}
a:hover{color:#f66}
::-webkit-scrollbar{width:4px}
::-webkit-scrollbar-track{background:#0a0a10}
::-webkit-scrollbar-thumb{background:#2a2a35;border-radius:2px}
/* ============ ANIMATED ORBS ============ */
.orb{position:fixed;border-radius:50%;pointer-events:none;z-index:0;filter:blur(80px);will-change:transform}
.orb-1{width:700px;height:700px;background:radial-gradient(circle,rgba(200,40,40,.07),transparent 70%);top:-300px;right:-200px;animation:orbFloat1 12s ease-in-out infinite}
.orb-2{width:500px;height:500px;background:radial-gradient(circle,rgba(180,130,50,.05),transparent 70%);bottom:-200px;left:-150px;animation:orbFloat2 15s ease-in-out infinite}
.orb-3{width:400px;height:400px;background:radial-gradient(circle,rgba(200,60,60,.04),transparent 70%);top:40%;left:60%;animation:orbFloat3 18s ease-in-out infinite}
@keyframes orbFloat1{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(-60px,40px) scale(1.1)}66%{transform:translate(30px,-30px) scale(.9)}}
@keyframes orbFloat2{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(50px,-30px) scale(1.15)}66%{transform:translate(-40px,40px) scale(.85)}}
@keyframes orbFloat3{0%,100%{transform:translate(0,0) scale(1);opacity:.6}50%{transform:translate(-80px,-60px) scale(1.2);opacity:1}}
/* Noise texture overlay */

/* ============ ACCESSIBILITY & POLISH (Phase 7) ============ */
@media(prefers-reduced-motion:reduce){*,::before,::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
:focus-visible{outline:2px solid #d55;outline-offset:2px;border-radius:2px}
::selection{background:rgba(200,60,60,.35);color:#fff}
html{scroll-behavior:smooth}
/* ============ SKELETON LOADING ============ */
@keyframes shimmer{0%{background-position:-400px 0}100%{background-position:400px 0}}
.skeleton{background:linear-gradient(90deg,#14141c 25%,#1a1a28 50%,#14141c 75%);background-size:800px 100%;animation:shimmer 1.5s ease-in-out infinite;border-radius:4px;min-height:16px}
.skeleton-text{height:12px;margin-bottom:8px;width:80%}
.skeleton-title{height:18px;margin-bottom:12px;width:50%}
.skeleton-card{height:120px;border-radius:8px}
.skeleton-stat{height:80px;border-radius:8px;display:inline-block;width:30%;margin-right:2%}
/* ============ SIDEBAR ICON ANIMATION ============ */
.side-item .side-icon{transition:all .25s var(--ease-out)}
.side-item:hover .side-icon{opacity:1;transform:scale(1.15);filter:drop-shadow(0 0 6px rgba(200,60,60,.4))}
.side-item.active .side-icon{opacity:1;filter:drop-shadow(0 0 6px rgba(200,60,60,.3))}
/* ============ MOBILE: DISABLE GLASSMORPHISM ============ */
/* ============ CONTENT-VISIBILITY ============ */
/* content-visibility removed — broke tab panel rendering */
/* ============ ENHANCED FOOTER ============ */
#site-footer{background:var(--bg-deep);border-top:1px solid var(--border);padding:32px 24px 20px;position:relative;z-index:1;margin-top:auto}
#site-footer .footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:24px;max-width:900px;margin:0 auto}
#site-footer .footer-col h4{font-family:var(--font-display);font-size:13px;color:var(--text-primary);margin-bottom:10px;font-weight:600;letter-spacing:.3px}
#site-footer .footer-col a,.footer-col span{display:block;font-size:11px;color:var(--text-muted);margin-bottom:4px;transition:color .2s;cursor:pointer;text-decoration:none}
#site-footer .footer-col a:hover{color:#d55}
#site-footer .footer-bottom{max-width:900px;margin:20px auto 0;padding-top:16px;border-top:1px solid var(--border-dim);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;font-size:10px;color:var(--text-dim)}
#site-footer .footer-orn{display:flex;gap:12px;align-items:center}
#site-footer .footer-orn .fline{width:24px;height:1px;background:linear-gradient(90deg,transparent,rgba(200,60,60,.4))}
#site-footer .footer-copyright{width:100%;text-align:center;font-size:10px;color:var(--text-dim);opacity:.85;margin-top:2px}
#site-footer .footer-orn .fdot{width:4px;height:4px;background:#c44;border-radius:50%;box-shadow:0 0 6px rgba(200,60,60,.4)}

.noise-overlay{position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.025;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
/* ============ ANIMATED BORDER (runner) ============ */
@keyframes borderRun{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
.glass-glow{position:relative}
.glass-glow::before{content:'';position:absolute;inset:-1px;border-radius:inherit;background:linear-gradient(135deg,rgba(200,60,60,.15),rgba(201,160,48,.08),rgba(200,60,60,.15));background-size:200% 200%;animation:borderRun 4s ease infinite;z-index:-1;opacity:0;transition:opacity .4s}
.glass-glow:hover::before{opacity:1}
/* ============ PARTICLES CANVAS ============ */
#particles-canvas{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0;opacity:.3}
/* ============ SVG ICONS ============ */
.side-icon{width:16px;height:16px;flex-shrink:0;opacity:.65}
.card-icon{width:28px;height:28px;margin-bottom:10px;opacity:.8;filter:drop-shadow(0 0 4px rgba(200,60,60,.3))}
.stat-icon{width:20px;height:20px;opacity:.5}
/* ============ SIDEBAR ============ */
#sidebar{width:256px;min-width:256px;background:var(--bg-deep);border-right:1px solid var(--border-dim);height:100vh;position:sticky;top:0;display:flex;flex-direction:column;z-index:200;overflow-y:auto;box-shadow:2px 0 30px rgba(0,0,0,.4)}
.side-logo{padding:22px 20px 18px;border-bottom:1px solid var(--border-dim);position:relative}
.side-logo::after{content:'';position:absolute;bottom:0;left:20px;width:40px;height:2px;background:linear-gradient(90deg,#c44,transparent);box-shadow:0 0 10px rgba(200,60,60,.4)}
.side-logo h1{font-family:var(--font-display);font-size:20px;color:var(--red-glow);margin-bottom:2px;letter-spacing:.8px;text-shadow:0 0 24px rgba(200,40,40,.35);font-weight:700}
.side-logo .sub{font-size:10px;color:var(--text-dim);font-style:italic;letter-spacing:.3px}
.lang-toggle{position:absolute;top:22px;right:16px;background:var(--bg-raised);border:1px solid var(--border-hover);border-radius:3px;color:var(--text-muted);font-size:10px;padding:2px 7px;cursor:pointer;transition:all .2s;font-weight:600;letter-spacing:.5px}
.lang-toggle:hover{color:var(--text-primary);border-color:#c4460;background:#1a1a24}
.side-group{padding:2px 0}
.side-group-label{padding:14px 20px 6px;font-size:9px;text-transform:uppercase;letter-spacing:1.5px;color:var(--text-dim);font-weight:600;cursor:pointer;display:flex;justify-content:space-between;align-items:center;user-select:none;transition:color .2s}
.side-group-label:hover{color:var(--text-secondary)}
.side-group-label svg.arrow{width:8px;height:8px;transition:transform .25s;opacity:.4}
.side-group.collapsed svg.arrow{transform:rotate(-90deg)}
.side-group.collapsed .side-item{display:none}
/* Fix scroll chaining: sidebar scrolls independently */
#sidebar{overscroll-behavior:contain;scroll-behavior:smooth}
.side-item{display:flex;align-items:center;gap:10px;padding:7px 20px;font-size:12.5px;color:var(--text-secondary);cursor:pointer;transition:all .18s;border-left:2px solid transparent;white-space:nowrap;position:relative}
.side-item:hover{color:var(--text-primary);background:#14141c}
.side-item.active{color:var(--text-primary);background:var(--red-bg);border-left-color:#d44;font-weight:500}
.side-item .badge{font-size:8px;background:#c44;color:#fff;padding:1px 6px;border-radius:8px;margin-left:auto;font-weight:600}
.side-item .badge-dl{font-size:7px;background:var(--red-glow);color:#fff;padding:1px 6px;border-radius:6px;margin-left:auto;font-weight:700;letter-spacing:.5px;text-transform:uppercase}
.side-item-book{border-left:2px solid var(--red)!important}
.side-item-book:hover{background:rgba(200,40,40,.08)!important}
/* ============ MAIN LAYOUT ============ */
#main-content{flex:1;min-width:0;display:flex;flex-direction:column;min-height:100vh}
#header{background:var(--bg-body);border-bottom:1px solid var(--border);padding:10px 20px;display:flex;align-items:center;gap:12px;position:sticky;top:0;z-index:100}
#header .menu-btn{display:none;background:none;border:none;color:var(--text-muted);font-size:20px;cursor:pointer;padding:6px;line-height:1}
#global-search{flex:1;max-width:480px;position:relative}
#global-search input{width:100%;padding:9px 34px 9px 13px;background:var(--bg-raised);border:1px solid var(--border-hover);border-radius:5px;color:var(--text-body);font-size:12.5px;font-family:inherit;outline:none;transition:border-color .2s}
#global-search input:focus{border-color:#c44;box-shadow:0 0 0 2px rgba(200,60,60,.08)}
#global-search button{position:absolute;right:3px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--text-muted);cursor:pointer;padding:5px 8px;transition:color .2s}
#global-search button:hover{color:#c44}
#header .quick-links{display:flex;gap:5px;margin-left:auto}
#header .ql{font-size:10px;padding:5px 10px;background:var(--bg-raised);border:1px solid var(--border-hover);border-radius:4px;color:var(--text-secondary);cursor:pointer;white-space:nowrap;transition:all .18s;display:flex;align-items:center;gap:5px}
#header .ql:hover{border-color:#c44;color:var(--text-body);background:#180c0c}
#header .ql svg{width:11px;height:11px;opacity:.5}
/* ============ CONTENT ============ */
#content{flex:1}
.tab-panel{display:none;animation:fadeSlide .25s ease}
.tab-panel.active{display:block}
@keyframes fadeSlide{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@keyframes revealUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
@keyframes revealScale{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}
.reveal{opacity:0}
.reveal.revealed{animation:revealUp .6s var(--ease-out) forwards}
.reveal-scale{opacity:0}
.reveal-scale.revealed{animation:revealScale .5s var(--ease-out) forwards}
.reveal-d1.revealed{animation-delay:.05s}
.reveal-d2.revealed{animation-delay:.1s}
.reveal-d3.revealed{animation-delay:.15s}
.reveal-d4.revealed{animation-delay:.2s}
.reveal-d5.revealed{animation-delay:.25s}
.reveal-d6.revealed{animation-delay:.3s}
/* ============ HERO ============ */
.hero{max-width:800px;margin:0 auto;padding:56px 24px 40px;text-align:center;position:relative;z-index:1;background:linear-gradient(180deg,rgba(8,8,18,0) 0%,rgba(12,12,24,.5) 30%,rgba(15,15,28,.3) 60%,rgba(8,8,18,.1) 100%)}

@keyframes heroGlow{0%,100%{opacity:.6;transform:translate(-50%,-50%) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.1)}}
.hero-orn{position:relative;z-index:2;display:flex;gap:16px;align-items:center;justify-content:center;margin-bottom:20px;min-height:6px}
.hero-orn .line{display:block;width:30px;height:1px;background:linear-gradient(90deg,transparent,rgba(220,80,80,.6))}
.hero-orn .dot{width:5px;height:5px;background:#d44;border-radius:50%;box-shadow:0 0 8px rgba(220,60,60,.5)}
.hero h2{position:relative;z-index:2;font-family:var(--font-display);font-size:42px;font-weight:700;line-height:1.15;margin-bottom:14px;letter-spacing:-.3px;background:linear-gradient(135deg,var(--red) 0%,var(--red-glow) 40%,#f99 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 0 40px rgba(200,40,40,.3))}
.hero .hero-sub{position:relative;z-index:2;font-size:14px;color:var(--text-muted);line-height:1.75;margin-bottom:34px;max-width:540px;margin-left:auto;margin-right:auto;letter-spacing:.2px}
.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:540px;margin:0 auto 30px}
.hero-stat{background:linear-gradient(135deg,rgba(22,22,38,.5),rgba(12,12,20,.6));backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.04);border-radius:10px;padding:18px 14px;transition:all .4s var(--ease-out);position:relative;overflow:hidden;box-shadow:inset 0 1px 0 rgba(255,255,255,.015),0 4px 20px rgba(0,0,0,.25)}
.hero-stat::before{content:'';position:absolute;top:0;left:0;width:100%;height:1px;background:linear-gradient(90deg,transparent,rgba(200,60,60,.3),transparent);opacity:0;transition:opacity .3s}
.hero-stat:hover::before{opacity:1}
.hero-stat:hover{transform:translateY(-3px);box-shadow:0 12px 40px rgba(0,0,0,.5),0 0 30px rgba(200,60,60,.08);border-color:#c4430}
.hero-stat .hs-num{font-size:32px;font-weight:700;color:var(--red-glow);font-family:var(--font-display);text-shadow:0 0 14px rgba(200,40,40,.4),0 0 2px rgba(200,60,60,.6);letter-spacing:-.5px}
.hero-stat .hs-label{font-size:10px;color:var(--text-muted);margin-top:4px;text-transform:uppercase;letter-spacing:.8px}
.hero-actions{position:relative;z-index:2;display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.hero-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 26px;background:linear-gradient(135deg,var(--red),var(--red-bright));color:#fff;text-decoration:none;border-radius:6px;font-size:13px;font-weight:500;transition:all .25s;border:none;cursor:pointer;letter-spacing:.2px;box-shadow:0 4px 16px rgba(200,40,40,.2)}
.hero-btn:hover{background:linear-gradient(135deg,#d55,#b44);transform:translateY(-2px);box-shadow:0 6px 24px rgba(200,40,40,.35)}
.hero-btn-outline{background:transparent;color:var(--red);border:1px solid var(--border-accent);box-shadow:none}
.hero-btn-outline:hover{background:rgba(200,60,60,.08);color:#e55;border-color:rgba(200,60,60,.6);box-shadow:0 0 20px rgba(200,40,40,.1)}
.hero-section{margin-top:44px;max-width:700px;margin-left:auto;margin-right:auto}
/* ============ INSIGHT BLOCKS (v3 homepage) ============ */
.iblock{max-width:820px;margin:38px auto 0;padding:0 20px}
.iblock h3{font-family:var(--font-display);font-size:18px;color:var(--text-primary);text-align:center;margin-bottom:4px;letter-spacing:.8px;font-weight:600}
.iblock .iblock-sub{text-align:center;color:var(--text-muted);font-size:11px;margin-bottom:20px}
.iblock .divider{width:40px;height:1px;background:linear-gradient(90deg,transparent,var(--border-accent),transparent);margin:0 auto 18px}
/* ============ 3D TILT ============ */
.tilt-card{transform-style:preserve-3d;perspective:800px;transition:transform .15s ease-out}
.tilt-card:hover{transition:transform .05s ease-out}
.tilt-card .tilt-inner{transform:translateZ(0);transition:transform .15s ease-out}
/* Pathway cards */
.path-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:8px}
.path-card{background:linear-gradient(145deg,var(--bg-card),var(--bg-deep));border:1px solid var(--border-dim);border-radius:8px;padding:16px;cursor:pointer;transition:all .3s var(--ease-out);position:relative;overflow:hidden;box-shadow:inset 0 1px 0 rgba(255,255,255,.012)}
.path-card::after{content:'';position:absolute;inset:0;border-radius:8px;background:radial-gradient(500px circle at var(--mx,50%) var(--my,50%),rgba(200,60,60,.05),transparent 50%);opacity:0;transition:opacity .3s}
.path-card:hover::after{opacity:1}
.path-card:hover{border-color:#c4440;transform:translateY(-2px);box-shadow:0 6px 24px rgba(0,0,0,.4),0 0 16px rgba(200,60,60,.06)}
.path-card .path-label{font-size:9px;color:#c44;text-transform:uppercase;letter-spacing:1px;margin-bottom:6px;font-weight:600}
.path-card .path-title{font-size:13px;color:var(--text-primary);font-weight:600;margin-bottom:10px}
.path-steps{display:flex;flex-direction:column;gap:4px}
.path-step{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--text-secondary)}
.path-step .step-num{width:18px;height:18px;border-radius:50%;background:rgba(200,60,60,.12);border:1px solid rgba(200,60,60,.2);display:flex;align-items:center;justify-content:center;font-size:9px;color:#c44;flex-shrink:0}
.path-step .step-arrow{color:#333;font-size:8px}
.path-card:hover .path-step{color:var(--text-secondary)}
/* Findings */
.find-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:8px}
.find-card{background:linear-gradient(145deg,var(--bg-surface),var(--bg-deep));border:1px solid var(--border-dim);border-radius:8px;padding:18px;transition:all .3s var(--ease-out);position:relative;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.01),var(--shadow-sm)}
.find-card::before{content:'';position:absolute;top:0;left:0;width:100%;height:2px;background:linear-gradient(90deg,transparent,rgba(200,60,60,.2),transparent);opacity:.5}
.find-card:hover{border-color:#2a2a35;box-shadow:0 4px 20px rgba(0,0,0,.3);transform:translateY(-1px)}
.find-num{font-family:var(--font-display);font-size:28px;font-weight:700;color:var(--red-glow);margin-bottom:4px;text-shadow:0 0 16px rgba(200,40,40,.35),0 0 2px rgba(200,60,60,.5);letter-spacing:-.5px}
.find-card:hover .find-num{text-shadow:0 0 20px rgba(200,40,40,.5)}
.find-title{font-size:13px;color:#ccc;font-weight:600;margin-bottom:6px}
.find-desc{font-size:11px;color:var(--text-muted);line-height:1.55;transition:color .2s}
.find-card:hover .find-desc{color:#888}
/* About-block (Что это) */
.about-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:8px}
.about-card{background:linear-gradient(145deg,rgba(20,20,35,.5),rgba(10,10,20,.6));backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.04);border-radius:8px;padding:20px;text-align:center;transition:all .4s var(--ease-out);position:relative;box-shadow:inset 0 1px 0 rgba(255,255,255,.015),0 8px 32px rgba(0,0,0,.2)}
.about-card::after{content:'';position:absolute;inset:0;border-radius:8px;background:radial-gradient(400px circle at 50% 0%,rgba(200,60,60,.03),transparent 60%);opacity:0;transition:opacity .3s}
.about-card:hover::after{opacity:1}
.about-card:hover{border-color:#333;transform:translateY(-1px);box-shadow:0 4px 24px rgba(0,0,0,.3),0 0 12px rgba(200,60,60,.04)}
.about-card .about-icon{width:32px;height:32px;margin:0 auto 10px;color:#c44;opacity:.7;transition:all .3s}
.about-card:hover .about-icon{opacity:1;filter:drop-shadow(0 0 6px rgba(200,60,60,.3))}
.about-card .about-title{font-size:13px;color:#ccc;font-weight:600;margin-bottom:6px}
.about-card .about-desc{font-size:10.5px;color:var(--text-muted);line-height:1.6;transition:color .2s}
.about-card:hover .about-desc{color:var(--text-secondary)}
/* ============ PANEL WRAPPER ============ */
.panel-wrap{max-width:880px;margin:0 auto;padding:32px 24px;position:relative}
.panel-wrap h2{font-family:var(--font-display);font-size:22px;color:var(--text-primary);text-align:center;margin-bottom:6px;letter-spacing:.5px;font-weight:600}
.panel-wrap .panel-desc{text-align:center;color:var(--text-muted);font-size:11.5px;margin-bottom:26px;letter-spacing:.2px}
.panel-wrap .divider{width:48px;height:1px;background:linear-gradient(90deg,transparent,var(--border-accent),transparent);margin:0 auto 20px}
/* ============ CARDS ============ */
.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px;margin-bottom:22px}
.card{background:linear-gradient(135deg,rgba(20,20,36,.6),rgba(15,15,24,.5));backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.03);border-radius:10px;padding:18px;transition:all .4s var(--ease-out);cursor:pointer;position:relative;overflow:hidden;box-shadow:inset 0 1px 0 rgba(255,255,255,.015),0 4px 16px rgba(0,0,0,.2)}
.card::before{content:'';position:absolute;top:0;left:0;width:100%;height:1px;background:linear-gradient(90deg,transparent,rgba(200,60,60,.15),transparent);opacity:0;transition:opacity .3s}
.card::after{content:'';position:absolute;inset:0;border-radius:10px;background:radial-gradient(600px circle at var(--mx,50%) var(--my,50%),rgba(200,60,60,.06),transparent 40%);opacity:0;transition:opacity .3s}
.card:hover::before{opacity:1}
.card:hover::after{opacity:1}
.card:hover{border-color:#c4440;transform:translateY(-2px);box-shadow:0 8px 32px rgba(0,0,0,.4),0 0 20px rgba(200,60,60,.08)}
.card .card-title{font-size:14px;font-weight:600;color:var(--text-primary);margin-bottom:6px;display:flex;align-items:center;gap:8px}
.card .card-meta{font-size:11px;color:var(--text-muted);line-height:1.6}
.card .card-action{font-size:10px;color:var(--red-bright);margin-top:9px;font-weight:500;display:flex;align-items:center;gap:4px;opacity:0;transform:translateX(-4px);transition:all .25s}
.card:hover .card-action{opacity:1;transform:translateX(0)}
/* ============ SEARCH ============ */
.search-bar{display:flex;gap:8px;max-width:620px;margin:0 auto 14px}
.search-bar input{flex:1;padding:11px 14px;background:var(--bg-raised);border:1px solid var(--border-hover);border-radius:5px;color:var(--text-body);font-size:13px;outline:none;font-family:inherit;transition:border-color .2s}
.search-bar input:focus{border-color:#c44}
.search-bar button{padding:11px 22px;background:var(--red);color:#fff;border:none;border-radius:5px;font-size:13px;cursor:pointer;font-weight:500;transition:all .2s;white-space:nowrap}
.search-bar button:disabled{opacity:.4}
.sr-block{margin-bottom:15px}
.sr-label{font-size:10px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.8px;margin-bottom:6px;font-weight:600}
.sr-item{padding:10px 13px;background:var(--bg-raised);border:1px solid var(--border);border-radius:4px;margin-bottom:4px;font-size:12.5px;color:var(--text-secondary);line-height:1.55;transition:border-color .15s}
.sr-item:hover{border-color:#333}
.sr-item .year{font-size:9px;color:#c44;margin-right:6px;font-weight:600}
.sr-item .score{font-size:8px;color:var(--text-muted);margin-left:4px}
/* ============ YEAR PILLS ============ */
.year-pills{display:flex;flex-wrap:wrap;gap:4px;justify-content:center;margin-bottom:18px}
.year-pill{padding:5px 11px;background:var(--bg-raised);border:1px solid var(--border-hover);border-radius:4px;font-size:11px;color:var(--text-secondary);cursor:pointer;transition:all .18s}
.year-pill:hover{border-color:#c4460;color:var(--text-body)}
.year-pill.active{background:rgba(200,60,60,.1);border-color:#c44;color:#d44;font-weight:600}
.year-pill.yr-historical{border-color:rgba(200,60,60,.35);position:relative}
.year-pill.yr-historical::after{content:'';position:absolute;top:-3px;right:-3px;width:7px;height:7px;border-radius:50%;background:#c44;border:1px solid #111;box-shadow:0 0 4px rgba(200,60,60,.4)}
.year-pill[data-year="1914"].yr-historical::after{background:var(--gold);box-shadow:0 0 6px var(--gold-glow)}
.year-pill[data-year="1917"].yr-historical::after{background:#c41e1e;box-shadow:0 0 8px rgba(200,30,30,.6)}
.year-pill[data-year="1921"].yr-historical::after{background:#4a8}
/* ============ TIMELINE ============ */
.tl-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:14px}
.tl-stat{background:var(--bg-card);border:1px solid var(--border);border-radius:6px;padding:14px;text-align:center;transition:all .2s}
.tl-stat:hover{border-color:#333}
.tl-num{font-size:20px;font-weight:700;color:#d44;font-family:var(--font-display)}
.tl-label{font-size:9px;color:var(--text-muted);margin-top:3px;text-transform:uppercase;letter-spacing:.5px}
.tl-chart{background:var(--bg-raised);border-radius:3px;height:5px;overflow:hidden;margin-bottom:10px}
.tl-bar{height:100%;background:linear-gradient(90deg,#c44,#d88);border-radius:3px;transition:width .4s ease-out}
.tl-quote{padding:10px 13px;background:var(--bg-raised);border-left:2px solid var(--red);margin-bottom:5px;font-size:12.5px;color:var(--text-secondary);font-style:italic;line-height:1.55}
/* ============ RHETORIC ============ */
.rhet-bars{display:flex;gap:22px;justify-content:center;margin:28px 0;flex-wrap:wrap}
.bar-item{text-align:center}
.bar-fill{width:28px;height:130px;background:var(--bg-surface);border-radius:3px;position:relative;margin:0 auto 7px;overflow:hidden}
.bar-inner{position:absolute;bottom:0;width:100%;border-radius:3px 3px 0 0;transition:height .5s ease-out}
/* ============ QUOTES ============ */
.q-item{padding:15px 17px;background:var(--bg-card);border:1px solid var(--border);border-radius:6px;margin-bottom:7px;transition:border-color .2s}
.q-item:hover{border-color:#333}
.q-text{font-size:13.5px;color:var(--text-body);line-height:1.65;font-style:italic}
.q-meta{margin-top:7px;font-size:10px;color:var(--text-muted);display:flex;align-items:center;gap:8px}
.q-score{color:#c44;font-weight:600}
/* ============ ENGINES ============ */
.engine-card{background:var(--bg-card);border:1px solid var(--border);border-radius:8px;padding:18px;cursor:pointer;transition:all .22s;position:relative}
.engine-card:hover{border-color:#c4430}
.engine-card.expanded{border-color:#c44;background:#0f0f18}
.e-id{font-size:9px;color:var(--text-muted);margin-bottom:5px;text-transform:uppercase;letter-spacing:.8px}
.e-name{font-size:15px;font-weight:600;color:var(--text-primary);margin-bottom:5px}
.e-metric{font-size:10px;color:var(--text-muted);margin-bottom:9px}
.e-more{font-size:10px;color:var(--text-muted);padding-top:5px;border-top:1px solid #1a1a22}
.e-detail-key{color:#c44;font-size:9px}
/* ============ CONCEPT GRAPH ============ */
.cl-tag{display:inline-block;padding:4px 12px;border-radius:14px;font-size:10px;margin:2px 3px;cursor:pointer;border:1px solid;transition:all .18s}
.cl-tag:hover{opacity:.75}
/* ============ OPPONENTS ============ */
.opp-node{padding:15px 17px;background:var(--bg-card);border:1px solid var(--border);border-radius:6px;margin-bottom:6px;cursor:pointer;transition:all .2s}
.opp-node:hover{border-color:#c4430;transform:translateX(2px)}
.o-name{font-size:14px;font-weight:600;color:var(--text-primary)}
.o-mentions{font-size:10px;color:var(--text-muted);margin-top:5px}
.o-camp{font-size:9px;color:#c44;margin-top:3px;text-transform:uppercase;letter-spacing:.5px}
.opp-detail{background:var(--bg-surface);border:1px solid var(--red);border-radius:8px;padding:18px;margin-top:10px;display:none;animation:fadeSlide .2s ease}
.opp-detail.show{display:block}
.od-name{font-size:19px;font-weight:700;color:#d44;margin-bottom:10px;font-family:var(--font-display)}
.od-stats{font-size:12.5px;color:var(--text-secondary);line-height:1.9}
/* ============ COMPARATIVE ============ */
.comp-item{padding:13px 16px;background:var(--bg-card);border:1px solid var(--border);border-radius:5px;margin-bottom:5px;cursor:pointer;transition:all .2s}
.comp-item:hover{border-color:#c4430}
.comp-item.open .comp-body{display:block;padding-top:12px}
.comp-topic{font-size:14px;font-weight:600;color:var(--text-primary)}
.comp-body{display:none;font-size:12.5px;color:var(--text-secondary);line-height:1.6}
.comp-col{margin-bottom:8px}
/* ============ TOMOGRAPHY ============ */
#tomo-container{position:relative;background:var(--bg-deep);border:1px solid var(--border-dim);border-radius:8px;overflow:hidden;margin-bottom:10px}
#tomo-tooltip{position:absolute;pointer-events:none;background:rgba(10,10,15,.92);color:var(--text-body);padding:5px 10px;border-radius:3px;font-size:10px;opacity:0;transition:opacity .12s;border:1px solid #333}
/* ============ IFRAME ============ */
.product-iframe{width:100%;height:82vh;border:none;border-radius:6px;background:var(--bg-deep)}
.product-iframe[data-src]{background:var(--bg-card);opacity:0;transition:opacity .3s var(--ease-out)}
.product-iframe.loaded{opacity:1}
/* ============ COMPARE ============ */
.compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
.c-card{background:var(--bg-card);border:1px solid var(--border);border-radius:8px;padding:18px;transition:border-color .2s}
.c-card:hover{border-color:#333}
.c-card h5{color:#d44;font-size:15px;margin-bottom:12px;font-family:var(--font-display)}
.c-stat{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.c-num{font-size:17px;font-weight:700;color:#d88}
.c-label{font-size:9px;color:var(--text-muted)}
/* ============ SPINNER ============ */
.spinner{display:inline-block;width:15px;height:15px;border:2px solid #222;border-top-color:#c44;border-radius:50%;animation:spin .5s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
/* ============ ENTROPY BARS ============ */
#entropy-bars{display:flex;align-items:flex-end;gap:2px;height:140px;margin:10px 0}
/* ============ GLOW PULSE ============ */
@keyframes glowPulse{0%,100%{box-shadow:0 0 12px rgba(200,60,60,.05)}50%{box-shadow:0 0 24px rgba(200,60,60,.15)}}
.glow-pulse{animation:glowPulse 3s ease-in-out infinite}
@keyframes neonFlicker{0%,100%{opacity:1}92%{opacity:1}94%{opacity:.7}96%{opacity:1}}
.neon-text{animation:neonFlicker 3.5s ease-in-out infinite}
/* ============ SOCIAL SHARE BAR ============ */
.share-bar{display:flex;gap:6px;justify-content:center;margin-top:8px;flex-wrap:wrap}
.share-btn{display:inline-flex;align-items:center;gap:5px;padding:5px 10px;background:var(--bg-raised);border:1px solid var(--border);border-radius:4px;color:var(--text-muted);font-size:10px;cursor:pointer;transition:all .2s}
.share-btn:hover{background:#1a1a24;border-color:#c4440;color:var(--text-body)}
.share-btn.copied{background:#1a2a1a;border-color:#3a3;color:#4a4}
.share-btn svg{width:11px;height:11px;opacity:.5}
.social-proof{text-align:center;font-size:10px;color:#3a3a3a;margin-top:8px;display:flex;gap:20px;justify-content:center}
.social-proof span{display:flex;align-items:center;gap:4px}
/* ============ MOBILE ============ */
@media(max-width:1024px){
  #sidebar{width:220px;min-width:220px}
  .hero h2{font-size:30px}
  .cards-grid{grid-template-columns:repeat(2,1fr)}
  .compare-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
  #site-footer .footer-grid{grid-template-columns:1fr 1fr;gap:16px}
  #site-footer .footer-col h4{font-size:11px}

  .hero{padding:32px 16px 24px}
  #main-content{margin-left:0}
  #sidebar{position:fixed;left:-280px;top:0;transition:left .25s;z-index:300;box-shadow:2px 0 20px rgba(0,0,0,.5);width:280px;min-width:280px}
  #sidebar.open{left:0}
  #sidebar-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.65);z-index:250}
  #sidebar-overlay.show{display:block}
  #header .menu-btn{display:block}
  #header .quick-links{display:none}
  #header{padding:8px 14px}
  #content{padding:0}
  .tl-stats{grid-template-columns:repeat(2,1fr)}
  .rhet-bars{gap:14px}
  .bar-fill{width:22px;height:90px}
  .hero-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .hero h2{font-size:26px}
  .hero{padding:50px 20px 40px}
  .hero .hero-sub{font-size:13px;max-width:100%}
  .hero-actions{flex-direction:column;align-items:center;gap:10px}.hero-btn{min-height:44px;width:100%;max-width:280px;justify-content:center}
  .compare-grid{grid-template-columns:1fr}
  .cards-grid{grid-template-columns:1fr}
  .hero-section{margin-top:30px;padding:0 8px}
  .panel-wrap{padding:24px 16px}
  .product-card{min-width:100%}
  .search-row{flex-direction:column;gap:8px}
  #search-input{width:100%}
  #search-btn{width:100%}
  footer{padding:12px 14px !important;flex-direction:column !important;text-align:center;gap:8px !important;font-size:10px !important}
  .oracle-layout,.shadow-layout{flex-direction:column}
  input,select,textarea{max-width:100%;box-sizing:border-box}
  .stat-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  iframe{height:400px}
}
@media(max-width:480px){
  .hero h2{font-size:22px}
  .hero{padding:36px 14px 26px}
  .hero .hero-sub{font-size:12px}
  .hero-grid{grid-template-columns:1fr;gap:8px}
  .hero-stat{padding:14px 10px}
  .hs-num{font-size:24px}
  .panel-wrap{padding:16px 10px}
  .section-label{font-size:10px;margin-bottom:8px}
  .subheading{font-size:16px}
  .tl-stats{grid-template-columns:1fr}
  .stat-grid{grid-template-columns:1fr}
  .rhet-bars{gap:8px}
  .bar-fill{width:18px;height:70px}
  #global-search-input{font-size:12px;padding:8px 10px}
  .cards-grid{grid-template-columns:1fr;gap:10px}
  .compare-grid{grid-template-columns:1fr}
  body{font-size:13px}
  h3{font-size:16px}
  iframe{height:350px}
  .path-grid,.find-grid,.about-grid{grid-template-columns:1fr}
  .iblock{padding:0 10px}
  .iblock h3{font-size:16px}
  .lang-toggle{top:14px;right:8px;font-size:9px;padding:2px 5px}
  .hero-actions .btn{padding:8px 14px;font-size:12px}
  .oracle-input-row{flex-direction:column;gap:6px}
  .oracle-input-row input{width:100%}
}
/* ═══ REUSABLE UTILITY CLASSES (Phase 2) ═══ */
.c-muted{color:#ccc}.c-dim{color:var(--text-muted)}.c-accent{color:#c44}.c-gold{color:#d4af37}
.c-666{color:var(--text-muted)}.c-888{color:#888}.c-aaa{color:var(--text-secondary)}
.section-label{color:#888;font-size:12px;margin-bottom:14px;text-transform:uppercase;letter-spacing:1px}
.subheading{font-family:var(--font-display);font-size:18px;color:#d88;margin-bottom:12px}
.padded-full{max-width:100%;padding:16px}
.desc-text{color:var(--text-secondary);font-size:13px;margin-bottom:12px;letter-spacing:.3px}
.body-text{color:var(--text-secondary);font-size:13px;line-height:1.8;margin-bottom:20px}
.empty-state{color:var(--text-muted);text-align:center;padding:20px}
.fs-xs{font-size:10px;color:var(--text-muted)}
.tc{text-align:center;color:var(--text-muted)}
.hidden-c{display:none}
.w-full{width:100%;height:auto}
.mx-auto{max-width:700px;margin:0 auto}
.fs-11{font-size:11px;color:var(--text-muted)}.fs-12{font-size:12px;color:var(--text-muted)}
.fs-13{font-size:13px;color:var(--text-secondary)}.fs-14{font-size:14px;color:#ccc}
@media (max-width:600px){.hero p{font-size:.95rem}.panel-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}}
@media (max-width:360px){.side-item{font-size:.8rem;padding:8px 12px}.panel-desc{font-size:.8rem}}


@keyframes coverSweep {
  0% { transform: translateX(-100%) rotate(15deg); }
  100% { transform: translateX(100%) rotate(15deg); }
}
.book-cover-3d:hover .cover-sweep {
  animation: coverSweep 1.5s ease-in-out;
}
.book-feat:hover {
  transform: translateY(-2px);
  border-color: rgba(200,60,60,.35) !important;
  box-shadow: 0 8px 24px rgba(200,40,40,.1);
}
@media (max-width:768px) {
  .book-cover-wrapper { flex: 0 0 100% !important; max-width: 300px; margin: 0 auto; }
  .book-features { grid-template-columns: repeat(2,1fr) !important; }
}
@media (max-width:480px) {
  .book-cover-wrapper { max-width: 240px; }
}



/* ============ HERO v3.0 ENHANCEMENTS ============ */

/* Stat card shimmer */
.hero-stat:hover .stat-shimmer {
  opacity: 1;
}
.hero-stat:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 40px rgba(200,40,40,.15);
}
.hero-stat:hover .big-number {
  transform: scale(1.06);
  transition: transform .35s cubic-bezier(0.23,1,0.32,1);
}

/* Button shine */
.hero-btn:hover .btn-shine {
  opacity: 1;
}
.hero-btn {
  transition: all .3s cubic-bezier(0.23,1,0.32,1);
}
.hero-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(200,40,40,.25);
}
.hero-btn:active {
  transform: translateY(0) scale(.97);
  transition: transform .1s;
}

/* Search glow */
.search-glow-ring {
  transition: opacity .6s ease;
}
.search-bar:focus-within .search-glow-ring {
  opacity: .6 !important;
  animation: borderRotate 3s linear infinite;
}
.search-bar input:focus {
  border-color: rgba(200,60,60,.5);
  box-shadow: 0 0 0 3px rgba(200,60,60,.08);
  transition: all .3s ease;
}

/* Hero sparkles */
.hero {
  overflow: hidden;
}

/* Mobile hero adjustments */
@media (max-width:768px) {
  .hero-sparkles { display: none; }
  .hero-grid { gap: 10px; }
  .hero-stat { padding: 16px 12px; }
  .hero-stat .big-number { font-size: 32px !important; }
  .hero-actions { flex-direction: column; gap: 10px; }
  .hero-btn { width: 100%; justify-content: center; padding: 14px 24px; }
}

@media (max-width:480px) {
  .hero-stat .big-number { font-size: 26px !important; }
  .hero-stat span { font-size: 11px; }
  .search-bar { flex-direction: column; }
  .search-bar input { border-radius: 8px !important; }
  .search-bar button { border-radius: 8px !important; margin-top: 6px; }
}
/* ============ BOOK TAB v2.70 — ADVANCED VISUALS ============ */

/* --- Icon spin glow --- */
@keyframes iconSpin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* --- Cover effects --- */
@keyframes borderRotate {
  0% { transform: rotate(0deg); opacity: .3; }
  50% { transform: rotate(180deg); opacity: .6; }
  100% { transform: rotate(360deg); opacity: .3; }
}
@keyframes rayPulse {
  0%, 100% { opacity: .4; transform: scale(1); }
  50% { opacity: .7; transform: scale(1.05); }
}
@keyframes sparkleFloat {
  0%, 100% { transform: translateY(0) scale(1); opacity: 0; }
  20% { opacity: .8; }
  50% { transform: translateY(-18px) scale(1.8); opacity: .4; }
  80% { opacity: .2; }
}
@keyframes coverSweep {
  0% { transform: translateX(-100%) rotate(15deg); }
  100% { transform: translateX(100%) rotate(15deg); }
}
@keyframes badgeFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}
@keyframes btnPulse {
  0%, 100% { transform: scale(1); opacity: .3; }
  50% { transform: scale(1.15); opacity: .6; }
}
@keyframes tipDotPulse {
  0%, 100% { transform: scale(1); opacity: .6; }
  50% { transform: scale(2.5); opacity: 0; }
}

/* --- Book cover 3D + glow --- */
.book-cover-3d:hover .cover-light-sweep {
  opacity: 1;
  animation: coverSweep 1.2s ease-in-out;
}
.book-cover-3d:hover .cover-border-glow {
  opacity: .8 !important;
}

/* --- Stat cards --- */
.stat-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 32px rgba(0,0,0,.4);
}
.stat-card:hover .stat-glow {
  opacity: 1;
}
.stat-card:hover .stat-value {
  transform: scale(1.08);
  transition: transform .35s cubic-bezier(0.23,1,0.32,1);
}

/* --- Inside cards --- */
.inside-card:hover {
  transform: translateY(-4px);
  border-color: rgba(200,60,60,.3) !important;
  box-shadow: 0 16px 40px rgba(200,40,40,.12);
}
.inside-card:hover .card-shine {
  opacity: 1;
}
.inside-card:hover .card-number {
  color: rgba(200,60,60,.08) !important;
}

/* --- Download button breathing --- */
.btn-download-breathing:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 42px rgba(200,40,40,.5);
}
.btn-download-breathing:active {
  transform: translateY(0) scale(.97);
  transition: transform .1s;
}
.btn-download-breathing:hover .btn-glow-pulse {
  animation: btnPulse 1.2s ease-in-out infinite;
}
.btn-download-breathing:hover .bp { animation: btnBurst .6s ease-out forwards; }
.btn-download-breathing:hover .b2 { animation-delay: .1s; }
.btn-download-breathing:hover .b3 { animation-delay: .15s; }

@keyframes btnBurst {
  0% { opacity: 1; transform: translate(0,0) scale(0); }
  100% { opacity: 0; transform: translate(var(--tx),var(--ty)) scale(1.5); }
}
.b1 { --tx: -20px; --ty: -15px; }
.b2 { --tx: 18px; --ty: -20px; }
.b3 { --tx: -12px; --ty: 22px; }

/* --- Mobile --- */
@media (max-width:900px) {
  .book-cover-stage { flex: 0 0 280px !important; margin: 0 auto 24px; }
  .book-stats { grid-template-columns: repeat(2,1fr) !important; }
  .inside-cards { grid-template-columns: repeat(2,1fr) !important; }
  .cover-rays { display: none; }
}
@media (max-width:480px) {
  .book-cover-stage { flex: 0 0 220px !important; }
  .book-stats { gap: 8px !important; }
  .stat-card { padding: 14px 10px !important; }
  .stat-value { font-size: 22px !important; }
  .inside-cards { grid-template-columns: 1fr !important; }
  .inside-card { padding: 16px !important; }
  .card-number { font-size: 36px !important; top: 10px !important; right: 12px !important; }
  .floating-badge { bottom: -8px !important; right: -8px !important; padding: 6px 12px !important; font-size: 10px !important; }
}

/* --- Reduced motion --- */
@media (prefers-reduced-motion:reduce) {
  .book-cover-3d,
  .cover-border-glow,
  .cover-rays,
  .cover-sparkles,
  .floating-badge,
  .btn-glow-pulse,
  .iconSpin,
  .stat-card,
  .inside-card { animation: none !important; transition: none !important; transform: none !important; }
  .stat-card:hover { transform: none !important; }
  .inside-card:hover { transform: none !important; }
}