/* Distributed over the whole section, with content and controls above the field. */
.particle-section{position:relative;isolation:isolate}
.section-particles{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;opacity:.62}
.hero>.section-particles{left:50%;right:auto;width:100vw;transform:translateX(-50%);height:calc(100% + 64px);opacity:var(--orbit-opacity,.72)}
.hero-copy{z-index:1}
.about-layout>.section-particles{left:50%;right:auto;width:100vw;transform:translateX(-50%);opacity:.6}
.about-layout>.about-statement,.about-layout>.about-copy{position:relative;z-index:1}
.contact-section>.contact-orbit{z-index:0;opacity:.7}
.learning-showcase>.learning-particles{z-index:1;opacity:.65}
@media(max-width:760px){.hero>.section-particles{height:calc(100% + 40px);opacity:.5}.about-layout>.section-particles{opacity:.46}.contact-section>.contact-orbit{opacity:.6}}
@media(prefers-reduced-motion:reduce){.hero>.section-particles,.about-layout>.section-particles{opacity:.38}.contact-section>.contact-orbit{opacity:.5}}

/* Mobile: the hero and pillar tabs share one uninterrupted background field. */
@media(max-width:1200px),(hover:none),(pointer:coarse){
 .mobile-particle-surface{display:flow-root;position:relative;isolation:isolate;width:100%;min-width:0}
 html body .mobile-particle-surface>.section-particles{position:absolute;inset:0;width:100%;height:100%;transform:none;opacity:.78!important;z-index:0;pointer-events:none}
 html body .mobile-particle-surface>.hero,html body .mobile-particle-surface>.pillar-window{position:relative;z-index:1;background:transparent!important}
 html body .mobile-particle-surface>.hero::before,html body .mobile-particle-surface>.hero::after{background:transparent!important}
 html body :is(.about-layout,.learning-showcase,.motion-ribbon,.contact-section)>.section-particles{opacity:.78!important}
}

@media(max-width:1200px),(hover:none),(pointer:coarse){
 [data-orbit]:not(.particles-painted){background-image:radial-gradient(circle at 12px 18px,var(--particle-light,#41413f) 1px,transparent 1.8px),radial-gradient(circle at 36px 42px,var(--particle-light,#41413f) .8px,transparent 1.6px);background-size:58px 62px,73px 81px}
 :is(.learning-showcase,.motion-ribbon,.contact-section)>[data-orbit]:not(.particles-painted){background-image:radial-gradient(circle at 12px 18px,var(--particle-dark,#c6fd50) 1px,transparent 1.8px),radial-gradient(circle at 36px 42px,var(--particle-dark,#c6fd50) .8px,transparent 1.6px)}
}