/* Simples — ambient geometry field + headline entrance (2026-09-03).
   A canvas behind every hero draws a sparse grid of the four brand glyphs in
   hairline grey; a slow diagonal wave and the pointer turn them signal blue.
   Purely additive: remove field.css + simples-field.js and nothing else changes. */

.hero,.sp-hero,.sv-hero,.ph-hero{position:relative;isolation:isolate}
.hero>*,.sp-hero>*,.sv-hero>*,.ph-hero>*{position:relative;z-index:1}
.simples-field{position:absolute;inset:0;z-index:0;pointer-events:none;display:block;width:100%;height:100%}
@media (max-width:767px){.simples-field{opacity:.85}}

/* headline: characters wrapped by simples-field.js */
.js .hero h1 .ch,.js .sp-hero h1 .ch,.js .sv-hero h1 .ch,.js .ph-hero h1 .ch{display:inline-block;opacity:0;transform:translateY(0.55em);animation:simplesChIn 700ms cubic-bezier(.2,.7,.2,1) forwards;animation-delay:calc(120ms + var(--i) * 40ms)}
@keyframes simplesChIn{to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  .js .hero h1 .ch,.js .sp-hero h1 .ch,.js .sv-hero h1 .ch,.js .ph-hero h1 .ch{animation:none;opacity:1;transform:none}
}