/* Shared page furniture kept from the 1.0 build: the aurora backdrop and the
   trusted-by logo marquee. Everything else now lives in sections/<slug>.css. */

/* ---------------------------------------------------------------
   Aurora background — port of Aceternity / 21st.dev "Aurora Background"
   (manuarora700). Two repeating gradients, blurred and inverted, with a
   second copy drifting via background-position under mix-blend-difference.
   --------------------------------------------------------------- */
.aurora{
 --white:#fff;--transparent:transparent;
 --blue-500:#3b82f6;--indigo-300:#a5b4fc;--blue-300:#93c5fd;--violet-200:#ddd6fe;--blue-400:#60a5fa;
 --white-gradient:repeating-linear-gradient(100deg,var(--white) 0%,var(--white) 7%,var(--transparent) 10%,var(--transparent) 12%,var(--white) 16%);
 --aurora:repeating-linear-gradient(100deg,var(--blue-500) 10%,var(--indigo-300) 15%,var(--blue-300) 20%,var(--violet-200) 25%,var(--blue-400) 30%);
 /* Rendered at half resolution and scaled up: the blur costs a quarter as much
    and the result is indistinguishable at these radii. */
 position:absolute;left:-10px;top:-10px;width:calc(50% + 10px);height:calc(50% + 10px);transform:scale(2);transform-origin:0 0;
 z-index:0;pointer-events:none;overflow:hidden;
 background-image:var(--white-gradient),var(--aurora);
 background-size:300%,200%;background-position:50% 50%,50% 50%;
 filter:blur(6px) invert(1);
 opacity:.38;will-change:transform;
 -webkit-mask-image:radial-gradient(ellipse at 100% 0%,#000 10%,var(--transparent) 70%);
 mask-image:radial-gradient(ellipse at 100% 0%,#000 10%,var(--transparent) 70%);
}
/* The drifting copy moves by transform (composited) rather than background-position
   (a full repaint every frame). 5× wide, sizes chosen so the loop point is seamless. */
.aurora::after{
 content:"";position:absolute;top:0;bottom:0;left:0;width:500%;
 background-image:var(--white-gradient),var(--aurora);
 background-size:40% 100%,20% 100%;background-position:0 0,0 0;
 mix-blend-mode:difference;will-change:transform;
 animation:aurora 80s linear infinite;
}
@keyframes aurora{to{transform:translateX(-80%)}}
@media(prefers-reduced-motion:reduce){.aurora::after{animation:none}}
/* Keep every layer above the aurora; the stage's own white stays as the base. */

/* ---------------------------------------------------------------
   --------------------------------------------------------------- */

/* ---------------------------------------------------------------
   Trusted-by logos — shadcnblocks "Logos3": centred heading, looping
   auto-scroll strip, masked edges. Marquee is CSS; pauses on hover.
   --------------------------------------------------------------- */
.logos{position:relative;z-index:2;overflow:hidden;background:transparent;padding-block:clamp(40px,6vh,64px) clamp(44px,6vh,72px);text-align:center;isolation:isolate}
.logos>.aurora{opacity:.28}
.logos-eyebrow{position:relative;z-index:1;margin:0 0 clamp(36px,5vh,56px);color:#8a74a6;font-size:11px;font-weight:600;letter-spacing:.18em}
.logos-marquee{position:relative;z-index:1;display:flex;width:100%;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}
.logos-track{display:flex;align-items:center;flex:none;min-width:100%;margin:0;padding:0;list-style:none;gap:clamp(48px,6vw,88px);padding-right:clamp(48px,6vw,88px);animation:logos-scroll 44s linear infinite}
.logos-marquee:hover .logos-track{animation-play-state:paused}
.logo-item{flex:none;display:flex;align-items:center;justify-content:center;height:52px}
.logo-item img{height:28px;width:auto;max-width:none;object-fit:contain;opacity:.78;filter:grayscale(1);transition:opacity .25s}
.logo-item.logo-tall img{height:44px}
.logo-item:hover img{opacity:1}
@keyframes logos-scroll{to{transform:translateX(-100%)}}
@media(prefers-reduced-motion:reduce){.logos-track{animation:none}.logos-track[aria-hidden]{display:none}.logos-marquee{flex-wrap:wrap;justify-content:center;mask-image:none;-webkit-mask-image:none}}
@media(max-width:640px){.logos{padding-block:56px}.logo-item img{height:22px}.logo-item.logo-tall img{height:34px}.logos-track{gap:40px;padding-right:40px}}