/* Astraed — shared styles (yuno tokens inverted to white, monochrome) */
:root{
  --bg:#FFFFFF; --bg-elevated:#FAFAFA; --bg-card:#F7F7F7; --bg-card-soft:#F0F0F0;
  --fg:#0A0A0A; --fg-muted:rgba(10,10,10,.72); --fg-quiet:rgba(10,10,10,.50);
  --fg-faint:rgba(10,10,10,.32); --rule:rgba(10,10,10,.12); --rule-strong:rgba(10,10,10,.22);
  --scrim:rgba(255,255,255,.55);
  --font:'General Sans',ui-sans-serif,system-ui,sans-serif;
  --ease-out:cubic-bezier(.16,1,.3,1); --d-fast:160ms; --d-menu:280ms; --d-enter:560ms;
}
html{background:var(--bg);color:var(--fg);font-family:var(--font);font-weight:450;
     -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;scroll-behavior:smooth}
::selection{background:var(--fg);color:var(--bg)}

.eyebrow{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-quiet);font-weight:500}
.display{font-size:clamp(44px,6.5vw,88px);line-height:1.04;letter-spacing:-.02em;font-weight:450}
.h2{font-size:clamp(28px,3vw,36px);line-height:1.15;letter-spacing:-.01em;font-weight:450}
.h3{font-size:22px;line-height:1.3;font-weight:450}
.pull{font-size:clamp(26px,3vw,38px);line-height:1.3;letter-spacing:-.01em;font-weight:450}
.body-lg{font-size:19px;line-height:1.55;color:var(--fg-muted)}
.body-sm{font-size:16px;line-height:1.55;color:var(--fg-muted)}
.meta{font-size:14px;line-height:1.4;letter-spacing:.02em;color:var(--fg-quiet)}

.clarity-icon{width:32px;height:32px;fill:none;stroke:currentColor;stroke-width:1.5;
              stroke-linecap:round;stroke-linejoin:round}
.clarity-icon--small{width:20px;height:20px;flex:0 0 auto}

.reveal{opacity:0;transform:translateY(12px);
        transition:opacity var(--d-enter) var(--ease-out),transform var(--d-enter) var(--ease-out)}
.reveal.in{opacity:1;transform:none}

.u-link{position:relative}
.u-link::after{content:'';position:absolute;left:0;bottom:-2px;height:1px;width:100%;
               background:var(--rule-strong);transform:scaleX(0);transform-origin:left;
               transition:transform var(--d-fast) ease-out}
.u-link:hover::after{transform:scaleX(1)}

.btn{display:inline-flex;align-items:center;gap:10px;background:var(--fg);color:var(--bg);
     border-radius:9999px;padding:14px 28px;font-size:15px;font-weight:500;
     transition:transform var(--d-fast) ease-out,opacity var(--d-fast) ease-out}
.btn:hover{transform:translateY(-1px);opacity:.88}
.btn .arr{transition:transform var(--d-fast) ease-out}
.btn:hover .arr{transform:translateX(3px)}
.btn-ghost{display:inline-flex;align-items:center;border:1px solid var(--rule-strong);color:var(--fg);
           border-radius:9999px;padding:13px 26px;font-size:15px;font-weight:500;
           transition:border-color var(--d-fast) ease-out,background var(--d-fast) ease-out}
.btn-ghost:hover{border-color:var(--fg);background:var(--bg-elevated)}

.card{background:var(--bg-card);border:1px solid var(--rule);border-radius:12px;
      transition:transform var(--d-fast) ease-out,border-color var(--d-fast) ease-out}
.card:hover{transform:translateY(-2px);border-color:var(--rule-strong)}

/* thumbnail cards */
.card-media{overflow:hidden;padding:0}
.card-media .thumb{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;
                   transform:scale(1.001);
                   transition:transform 600ms var(--ease-out)}
.card-media:hover .thumb{transform:scale(1.03)}
.card-media .card-body,figure.card-media figcaption.card-body{padding:24px 28px 28px !important}

header.site{position:fixed;inset-inline:0;top:0;z-index:60;border-bottom:1px solid transparent;
            transition:border-color var(--d-fast) ease-out,background var(--d-fast) ease-out}
header.site.scrolled{border-color:var(--rule);background:rgba(255,255,255,.86);backdrop-filter:blur(14px)}

/* mega-menu + blur scrim — the defining move, per design.md */
.scrim{position:fixed;inset:0;z-index:50;background:var(--scrim);
       backdrop-filter:blur(28px) saturate(.9);-webkit-backdrop-filter:blur(28px) saturate(.9);
       opacity:0;pointer-events:none;transition:opacity var(--d-menu) var(--ease-out)}
.mega{position:fixed;inset-inline:0;top:64px;z-index:55;background:var(--bg);
      border-bottom:1px solid var(--rule);
      transform:translateY(-8px);opacity:0;pointer-events:none;
      transition:transform var(--d-menu) var(--ease-out),opacity var(--d-menu) var(--ease-out)}
html[data-menu="open"] .scrim{opacity:1;pointer-events:auto}
html[data-menu="open"] .mega{transform:none;opacity:1;pointer-events:auto}
html[data-menu="open"] header.site{background:var(--bg);border-color:var(--rule)}
.mega a.sol{display:block;padding:20px 0;border-top:1px solid var(--rule);
            transition:padding-left var(--d-fast) ease-out}
.mega a.sol:hover{padding-left:8px}
.chev-menu{display:inline-block;transition:transform var(--d-menu) var(--ease-out);font-size:10px}
html[data-menu="open"] .chev-menu{transform:rotate(180deg)}

details.faq{border-bottom:1px solid var(--rule)}
details.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;
                    align-items:baseline;gap:24px;padding:24px 0}
details.faq summary::-webkit-details-marker{display:none}
details.faq .chev{flex:none;transition:transform 240ms var(--ease-out);color:var(--fg-faint)}
details.faq[open] .chev{transform:rotate(45deg)}

.ph{border-bottom:1px dashed var(--fg-faint);color:var(--fg-quiet)}

.marquee{display:flex;gap:64px;width:max-content;animation:slide 42s linear infinite}
.logo-item{height:18px;width:auto;flex:none;opacity:.5;filter:grayscale(1);
           transition:opacity var(--d-fast) ease-out,filter var(--d-fast) ease-out}
.logo-item:hover{opacity:.9;filter:none}
@keyframes slide{to{transform:translateX(-50%)}}
.marquee-wrap:hover .marquee{animation-play-state:paused}

@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  .marquee{animation:none}
  *{transition-duration:.01ms!important;animation-duration:.01ms!important}
}

/* video lightbox */
.demo-video{cursor:zoom-in}
.vlb{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;
     background:rgba(10,10,10,.55);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
     opacity:0;transition:opacity 240ms cubic-bezier(.16,1,.3,1)}
.vlb.in{opacity:1}
.vlb video{max-width:min(1200px,92vw);max-height:86vh;border-radius:12px;background:#000;
           box-shadow:0 24px 80px rgba(0,0,0,.35);transform:scale(.97);
           transition:transform 240ms cubic-bezier(.16,1,.3,1)}
.vlb.in video{transform:none}
.vlb-close{position:absolute;top:20px;right:24px;width:44px;height:44px;border-radius:9999px;
           background:rgba(255,255,255,.92);color:#0A0A0A;font-size:20px;line-height:1;
           display:flex;align-items:center;justify-content:center;cursor:pointer}