/* Pages layer: Forsight, Avola and Research (index + articles), plus shared subpage polish.
   Design and motion only — no content changes. */
:root{interpolate-size:allow-keywords}

/* ---------- Page hero: minimal line-work shapes ---------- */
.content-page .page-hero{background:radial-gradient(900px 520px at 88% 110%,rgba(122,63,240,.45),transparent 60%),radial-gradient(600px 400px at 0% 0%,rgba(233,207,158,.08),transparent 60%),linear-gradient(125deg,#0d0620 0%,#1f0a45 55%,#2d0d63 100%)}
.page-hero-shapes .sh{border:1px solid rgba(233,207,158,.22)!important;box-shadow:0 0 0 48px rgba(199,180,255,.035),0 0 0 96px rgba(199,180,255,.025)!important;background:none}
.page-hero-shapes .sh svg{display:none}
.page-hero-shapes .sh-hex{border-radius:50%!important;border-color:rgba(199,180,255,.18)!important}
.page-hero-shapes .sh:after{content:'';position:absolute;top:14%;left:14%;width:7px;height:7px;border-radius:50%;background:#e9cf9e;box-shadow:0 0 14px rgba(233,207,158,.8)}
.content-page .crumbs{display:inline-flex;padding:7px 14px;border-radius:30px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12)}
.content-page .crumbs a{color:#d9cbec}

/* ---------- Shared chips & numbers ---------- */
.num{display:inline-flex!important;align-items:center;gap:8px;padding:6px 12px;border-radius:30px;font-size:11px!important;letter-spacing:.08em;color:#4e1fb0!important;background:linear-gradient(150deg,#f3ecfd,#e8dbfb);box-shadow:0 0 0 1px rgba(122,63,240,.14),0 1px 0 #fff inset}
.num:before{content:'';width:6px;height:6px;border-radius:50%;background:linear-gradient(135deg,#9b6cf2,#e9cf9e)}
.num-card{display:flex;flex-direction:column}
.num-card h3{transition:color .4s}
.illustration-note{display:inline-flex;padding:6px 12px;border-radius:30px;background:rgba(255,255,255,.55);border:1px solid #e0d3f0;color:#6a5e7a!important}

/* ---------- Step rows (beats) as connected glass steps ---------- */
.content-page .beats{gap:16px;position:relative;isolation:isolate}
.content-page .beats li{border-top:0!important;padding:26px 24px!important;border-radius:20px;background:var(--glass-l);border:1px solid rgba(255,255,255,.9);box-shadow:var(--shadow-l);transition:transform .8s var(--ease-lux),box-shadow .8s var(--ease-lux)}
.content-page .beats li:hover{transform:translateY(-6px);box-shadow:var(--shadow-lh)}
.content-page .beats span{display:inline-grid!important;place-items:center;width:40px;height:40px;border-radius:12px;font-size:12px!important;color:#fff!important;background:linear-gradient(150deg,#8b55f4,#4e1fb0);box-shadow:0 10px 20px -8px rgba(78,31,176,.6)}
.content-page .beats p{color:var(--ink-body)}
.content-page .beats:before{content:'';position:absolute;left:20px;right:20px;top:46px;height:2px;z-index:-1;border-radius:2px;background:linear-gradient(90deg,#7a3ff0,#b48cff,#e9cf9e);transform-origin:left}

/* ---------- Forsight ---------- */
.fs-card{border-radius:24px!important;background:radial-gradient(360px circle at var(--mx,-400px) var(--my,-400px),rgba(233,207,158,.12),transparent 62%),linear-gradient(150deg,rgba(255,255,255,.10),rgba(255,255,255,.03))!important;border:1px solid rgba(255,255,255,.16)!important;box-shadow:0 1px 0 rgba(255,255,255,.14) inset,0 40px 90px -30px rgba(0,0,0,.7)!important;transition:transform .9s var(--ease-lux)}
.fs-card:hover{transform:translateY(-6px) rotate(-.4deg)}
.fs-mark{background:linear-gradient(150deg,#9b6cf2,#4e1fb0)!important;box-shadow:0 10px 24px -8px rgba(122,63,240,.7)}
.fs-score>b{background:linear-gradient(120deg,#fff,#dccbff 55%,#f3e2c2);-webkit-background-clip:text;background-clip:text;color:transparent!important}
.fs-pair{border-radius:14px!important;background:rgba(255,255,255,.04)}
.fs-signals li{transition:background .4s,padding .4s;border-radius:8px}
.fs-signals li:hover{background:rgba(255,255,255,.05);padding-inline:8px}
.stat-row>div{border-top:0!important;padding:24px!important;border-radius:20px;background:var(--glass-l);border:1px solid rgba(255,255,255,.9);box-shadow:var(--shadow-l)}
.stat-row b{background:linear-gradient(120deg,#2a1450,#5a22c8 60%,#9a6ae8);-webkit-background-clip:text;background-clip:text;color:transparent!important}
.stat-row b span{color:inherit}
.stat-row>div>span{color:var(--ink-soft)!important;font-size:12px!important}
.agents li{transition:transform .8s var(--ease-lux),box-shadow .8s var(--ease-lux),border-color .5s}
.agents span{display:inline-flex!important;padding:4px 10px;border-radius:20px;background:rgba(233,207,158,.12);border:1px solid rgba(233,207,158,.25)}
.agents em{font-size:12px!important}

/* ---------- Avola ---------- */
.avola-family{grid-template-columns:1fr 90px 1fr!important}
.avola-family article{--mx:-400px;--my:-400px;border-radius:24px!important;padding:44px!important;background:radial-gradient(420px circle at var(--mx) var(--my),rgba(122,63,240,.10),transparent 62%),var(--glass-l)!important;border:1px solid rgba(255,255,255,.9)!important;box-shadow:var(--shadow-l);transition:transform .8s var(--ease-lux),box-shadow .8s var(--ease-lux)}
.avola-family article:hover{transform:translateY(-6px);box-shadow:var(--shadow-lh)}
.avola-family article>p:not(.eyebrow){color:var(--ink-body)!important}
.product-symbol{display:inline-grid!important;place-items:center;width:64px;height:64px;border-radius:20px;font-size:30px!important;line-height:1!important;color:#fff!important;background:radial-gradient(120% 140% at 20% 0%,#9b6cf2,#5a22c8 55%,#2c1060);box-shadow:0 1px 0 rgba(255,255,255,.3) inset,0 16px 30px -12px rgba(78,31,176,.7);transition:transform .9s var(--ease-lux)}
.avola-family article:hover .product-symbol{transform:rotate(-8deg) scale(1.06)}
.family-connection{position:relative;font-size:0!important}
.family-connection:before{content:'';position:absolute;left:8px;right:8px;top:50%;height:1px;background:linear-gradient(90deg,transparent,#9b6cf2,#e9cf9e,#9b6cf2,transparent)}
.family-connection:after{content:'';position:absolute;top:50%;left:10px;width:9px;height:9px;margin-top:-4.5px;border-radius:50%;background:#e9cf9e;box-shadow:0 0 14px #e9cf9e;animation:conn-pulse 3.2s cubic-bezier(.45,0,.55,1) infinite}
@keyframes conn-pulse{0%{left:10px;opacity:0}15%,85%{opacity:1}100%{left:calc(100% - 19px);opacity:0}}
.product-detail-stage .product-art{border-radius:26px}

/* FAQ: glass accordion with a smooth open */
.faq details{border:1px solid rgba(255,255,255,.9)!important;border-radius:18px;padding:20px 24px!important;margin-bottom:12px;background:var(--glass-l);box-shadow:var(--shadow-l);transition:box-shadow .6s var(--ease-lux)}
.faq details[open]{box-shadow:var(--shadow-lh)}
.faq summary{color:#2a1450}
.faq summary:after{content:''!important;width:22px;height:22px;top:4px!important;border-radius:50%;background:linear-gradient(#4e1fb0,#4e1fb0) center/10px 1.5px no-repeat,linear-gradient(#4e1fb0,#4e1fb0) center/1.5px 10px no-repeat,#f0e8fc;transition:transform .5s var(--ease-lux),background-color .4s}
.faq details[open] summary:after{transform:rotate(135deg);background-color:#e2d4f8}
.faq details::details-content{height:0;overflow:clip;transition:height .55s var(--ease-lux),content-visibility .55s allow-discrete}
.faq details[open]::details-content{height:auto}
.faq details p{color:var(--ink-body)!important}

/* ---------- Research index ---------- */
.chips{gap:6px!important;padding:6px;border-radius:30px;background:rgba(255,255,255,.65);border:1px solid rgba(255,255,255,.9);box-shadow:var(--shadow-l)}
.chip{border:0!important;border-radius:22px!important;padding:9px 16px!important;font-size:12px!important;color:#5d5170!important;transition:background .45s var(--ease-lux),color .45s,box-shadow .45s}
.chip:hover{background:rgba(122,63,240,.07)}
.chip.is-on,.chip[aria-pressed=true]{background:radial-gradient(120% 140% at 20% 0%,#9b6cf2,#6a2fe0 50%,#3b1490)!important;color:#fff!important;box-shadow:0 10px 22px -10px rgba(78,31,176,.7)}
.post-card{border-radius:22px!important}
.post-card .post-body{padding:26px 26px 18px}
.post-cat{display:inline-flex;padding:5px 10px;border-radius:20px;background:#f1e9fc;color:#4e1fb0!important;font-size:10px!important}
.post-dek{color:var(--ink-body)!important;font-size:13px!important}
.post-go{border-top-color:rgba(122,63,240,.12)!important;color:#4e1fb0!important;font-size:12px!important}
.post-go .ic-arrow{width:30px;height:30px;padding:8px;border-radius:50%;background:#f1e9fc;transition:background .5s var(--ease-lux),color .5s,transform .6s var(--ease-lux)}
.post-card:hover .post-go .ic-arrow{background:linear-gradient(135deg,#8b55f4,#4e1fb0);color:#fff;transform:rotate(-45deg)}

/* Card art: minimal, premium line-work on rich gradients */
.post-art{isolation:isolate;background:radial-gradient(120% 90% at 85% 0%,rgba(155,108,242,.55),transparent 60%),linear-gradient(150deg,#1b0b36,#2f0f66)!important}
.post-art-circle{background:radial-gradient(110% 90% at 10% 100%,rgba(233,207,158,.28),transparent 55%),linear-gradient(150deg,#140a2c,#2a1260)!important}
.post-art-pent{background:radial-gradient(120% 90% at 50% 120%,rgba(122,63,240,.65),transparent 60%),linear-gradient(160deg,#21093f,#3b1180)!important}
.post-art-star{background:radial-gradient(120% 100% at 90% 0%,rgba(233,207,158,.55),transparent 55%),linear-gradient(150deg,#efe7fb,#d9c8f2)!important}
.post-art:before{content:'';position:absolute;inset:0;z-index:-1;background-image:radial-gradient(rgba(255,255,255,.14) 1px,transparent 1px);background-size:22px 22px;-webkit-mask-image:radial-gradient(ellipse at 70% 30%,#000,transparent 70%);mask-image:radial-gradient(ellipse at 70% 30%,#000,transparent 70%)}
.post-art-star:before{background-image:radial-gradient(rgba(78,31,176,.16) 1px,transparent 1px)}
.post-art:after{content:'';position:absolute;right:22px;bottom:22px;width:8px;height:8px;border-radius:50%;background:#e9cf9e;box-shadow:0 0 0 6px rgba(233,207,158,.12),0 0 18px rgba(233,207,158,.7)}
.post-art svg{stroke:rgba(233,207,158,.75)!important;stroke-width:.5!important;width:150px!important;height:150px!important;transition:transform 1.4s var(--ease-lux),opacity .8s}
.post-art svg+svg{stroke:rgba(199,180,255,.5)!important;width:300px!important;height:300px!important;opacity:.35!important}
.post-art-star svg{stroke:rgba(78,31,176,.55)!important}
.post-card:hover .post-art svg{transform:translate(-50%,-50%) rotate(45deg) scale(1.06)}
.post-card:hover .post-art svg+svg{transform:translate(-30%,-35%) rotate(-30deg) scale(1.04)}
.post-card .post-art{transition:transform 1.4s var(--ease-lux)}
.post-card:hover .post-art{transform:none}

/* ---------- Article page ---------- */
.page-hero-article .byline-avatar{background:linear-gradient(150deg,#9b6cf2,#4e1fb0);border:0!important;color:#fff!important;box-shadow:0 10px 24px -10px rgba(122,63,240,.8)}
.prose{color:#463c52!important;font-size:16px!important}
.prose h2{position:relative;padding-top:18px}
.prose h2:before{content:'';position:absolute;left:0;top:0;width:44px;height:3px;border-radius:3px;background:linear-gradient(90deg,#7a3ff0,#e9cf9e)}
.prose strong{color:#2a1450!important}
.prose blockquote{border-left:0!important;padding:26px 30px 26px 34px!important;border-radius:20px;background:var(--glass-l);box-shadow:var(--shadow-l);position:relative;color:#3b1c72!important}
.prose blockquote:before{content:'';position:absolute;left:0;top:22px;bottom:22px;width:3px;border-radius:3px;background:linear-gradient(#7a3ff0,#e9cf9e)}
.callout{border-left:0!important;border-radius:20px!important;padding:26px 30px!important;background:radial-gradient(400px 200px at 100% 0%,rgba(233,207,158,.25),transparent 60%),linear-gradient(150deg,#f4ecfd,#ebe0f9)!important;box-shadow:var(--shadow-l);color:#3b2457!important;position:relative}
.callout:before{content:'';position:absolute;left:0;top:20px;bottom:20px;width:3px;border-radius:3px;background:linear-gradient(#7a3ff0,#e9cf9e)}
.table-wrap{border:1px solid rgba(255,255,255,.9)!important;border-radius:18px!important;background:var(--glass-l);box-shadow:var(--shadow-l)}
.prose th{background:linear-gradient(150deg,#efe5fc,#e6d8f9)!important;color:#2a1450!important}
.prose tr{transition:background .4s}
.prose tbody tr:hover{background:rgba(122,63,240,.05)}
.stat-bar{border-block:0!important;padding:22px!important;border-radius:20px;background:var(--glass-l);box-shadow:var(--shadow-l)}
.sb-num{background:linear-gradient(120deg,#2a1450,#7a3ff0 60%,#c9a46c);-webkit-background-clip:text;background-clip:text;color:transparent!important}
.prose-foot{border-top-color:rgba(122,63,240,.15)!important}
.pager a{border-radius:20px!important}
.pager a>b{color:#2a1450}

/* Side rail: follows the reading */
.side{top:120px!important}
.takeaways{padding:24px!important;border-radius:20px!important}
.takeaways li{position:relative;padding-left:4px;color:#7d7090;transition:color .6s var(--ease-lux),opacity .6s;opacity:.55}
.takeaways li.lit{color:#2a1450;opacity:1}
.takeaways li::marker{color:#b9a3d8;transition:color .6s}
.takeaways li.lit::marker{color:#7a3ff0}
.toc{position:relative;border-top:0!important;margin-top:16px!important;padding:22px 22px 18px!important;border-radius:20px;background:var(--glass-l);border:1px solid rgba(255,255,255,.9);box-shadow:var(--shadow-l)}
.toc ol{position:relative;padding-left:16px!important;margin:0}
.toc ol:before{content:'';position:absolute;left:0;top:4px;bottom:4px;width:2px;border-radius:2px;background:#e6dcf4}
.toc-rail{position:absolute;left:0;top:4px;width:2px;height:0;border-radius:2px;background:linear-gradient(#7a3ff0,#e9cf9e);transition:height .5s var(--ease-lux)}
.toc a{font-size:12px!important;color:#7d7090!important;transition:color .4s,transform .5s var(--ease-lux);position:relative}
.toc a:hover{color:#4e1fb0!important}
.toc a.is-past{color:#5d4f72!important}
.toc a.is-current{color:#2a1450!important;font-weight:500;transform:translateX(4px)}
.toc a.is-current:before{content:'';position:absolute;left:-21px;top:.55em;width:8px;height:8px;border-radius:50%;background:#7a3ff0;box-shadow:0 0 0 4px rgba(122,63,240,.15)}
.prose h2.is-current:before{width:72px;transition:width .8s var(--ease-lux)}
.copy-link{margin-top:14px;border-radius:30px!important}

/* ---------- Scroll-linked entrances for every element (compositor-driven) ---------- */
@supports (animation-timeline: view()){
  .motion .content-page .reveal{opacity:1!important;transform:none!important;transition-property:box-shadow,background,border-color,color!important}
  .motion .content-page :is(.section-head>:not(h2),.num-card,.person,.post-card,.deploy,.agents li,.beats li,.faq details,.avola-family article,.family-connection,.stat-row>div,.prose>*,.pager a,.contact-option,.mail,.split-body>p,.research-bar,.btn-row,.fact-chips,.checks,.product-detail-stage>*,.illustration-note,.principle,.security,.cta-band>*,.contact-grid>*){
    animation:lx-scroll-in linear both;animation-timeline:view();animation-range:entry 0% cover 28%}
  .motion .content-page :is(.num-grid,.post-grid,.agents,.beats,.stat-row,.deploy-grid)>:nth-child(3n+2){animation-range:entry 6% cover 32%}
  .motion .content-page :is(.num-grid,.post-grid,.agents,.beats,.stat-row,.deploy-grid)>:nth-child(3n){animation-range:entry 12% cover 36%}
  @keyframes lx-scroll-in{from{opacity:0;translate:0 48px;scale:.965}to{opacity:1;translate:0 0;scale:1}}
  .motion .content-page .beats:before{animation:lx-line linear both;animation-timeline:view();animation-range:entry 20% cover 55%}
  @keyframes lx-line{from{transform:scaleX(0)}to{transform:scaleX(1)}}
  .motion .post-art svg:first-child{animation:lx-turn linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
  @keyframes lx-turn{from{rotate:-20deg}to{rotate:20deg}}
}

@media(max-width:900px){.avola-family{grid-template-columns:1fr!important}.family-connection{height:60px}.family-connection:before{left:50%;right:auto;top:6px;bottom:6px;width:1px;height:auto;background:linear-gradient(transparent,#9b6cf2,#e9cf9e,#9b6cf2,transparent)}.family-connection:after{display:none}.content-page .beats:before{display:none}}
@media(max-width:760px){.chips{border-radius:20px}.toc,.takeaways{padding:18px!important}.avola-family article{padding:28px!important}}
@media(prefers-reduced-motion:reduce){.family-connection:after{animation:none}}

/* Fixes: chip width, article stat strip, side rail heading */
.num{align-self:flex-start;width:max-content}
.stat-bar{display:flex;align-items:stretch;gap:0;margin:30px 0 34px}
.sb-stat{flex:1;padding:4px 22px;display:flex;flex-direction:column;gap:8px}
.sb-stat:first-child{padding-left:4px}
.sb-num{display:block;font:500 40px/1 Tight,Inter,sans-serif;letter-spacing:-1.3px}
.sb-label{display:block;font-size:13px;line-height:1.6;color:var(--ink-soft)}
.sb-sep{width:1px;background:linear-gradient(transparent,rgba(122,63,240,.25),transparent)}
.toc{display:block!important}
.toc-h{display:block;margin:0 0 14px!important;writing-mode:horizontal-tb}
@media(max-width:760px){.stat-bar{flex-direction:column;gap:16px}.sb-stat{padding:0 4px}.sb-sep{width:100%;height:1px;background:linear-gradient(90deg,transparent,rgba(122,63,240,.25),transparent)}}
