/* Homepage experiment. Decorative Q and local pointer-reactive particles. */
.page-index .home-hero{grid-template-columns:minmax(0,1fr) minmax(0,36%)}
.page-index .hero-copy{min-width:0}
.page-index .hero-heading-with-q{--q-size:clamp(96px,13.2vw,168px);display:grid;grid-template-columns:var(--q-size) minmax(0,1fr);gap:clamp(10px,1.4vw,18px);align-items:center;margin:18px 0 24px}
.page-index .hero-heading-with-q h1{margin:0;font-size:clamp(2rem,5vw,4.15rem);line-height:1.08;letter-spacing:-.055em;text-wrap:initial}
.page-index .particle-q{position:relative;isolation:isolate;display:grid;place-items:center;width:var(--q-size);height:calc(var(--q-size)*.96);cursor:default;user-select:none;contain:layout}
.page-index .particle-q-canvas{position:absolute;left:-10%;top:-10%;display:block;width:120%;height:120%;pointer-events:none}
@media(max-width:800px){.page-index .home-hero{grid-template-columns:1fr}.page-index .hero-heading-with-q{--q-size:clamp(92px,19vw,140px);gap:16px}.page-index .hero-heading-with-q h1{font-size:clamp(2rem,6.2vw,3.3rem)}}
@media(max-width:480px){.page-index .hero-heading-with-q{--q-size:80px;gap:10px;margin:18px 0 22px}.page-index .hero-heading-with-q h1{font-size:clamp(1.65rem,6.5vw,2.25rem);letter-spacing:-.055em}}
@media(max-width:350px){.page-index .hero-heading-with-q{--q-size:62px;gap:8px}.page-index .hero-heading-with-q h1{font-size:1.5rem}}
@media print{.page-index .particle-q-canvas{display:none}}
