/* V20: the original V19, with a generous stage for sequence 5. */
.hero-dust {
  position:relative;
  isolation:isolate;
  padding:40px 0;
  min-height:calc(100vh - var(--nav-height, 69px));
  min-height:calc(100svh - var(--nav-height, 69px));
  background:#08070c;
}
.hero-dust .hero-layout {
  width:min(1440px,calc(100% - 96px));
  grid-template-columns:minmax(0,.9fr) minmax(0,1.2fr);
  gap:0;
}
.hero-dust .hero-copy {position:relative;z-index:2;padding-block:30px;max-width:540px}
.hero-dust .hero-copy .eyebrow {color:#c8b7df;margin-bottom:24px}
.hero-dust h1 {font-size:clamp(2.75rem,4.5vw,4.6rem);line-height:1.07;letter-spacing:-.055em;text-wrap:initial}
.hero-dust .hero-description {max-width:42ch;font-size:1.0625rem;line-height:1.65;margin-top:26px;color:#c2b8cf}
.hero-dust .hero-visual {width:112%;max-width:none;margin-left:-5%;align-self:center;justify-self:center;position:relative}
.hero-dust-stage {
  width:100%;
  height:clamp(380px,65svh,680px);
  position:relative;
  overflow:hidden;
  background:radial-gradient(ellipse at 50% 48%,#5e00ff14,transparent 65%);
  touch-action:pan-y pinch-zoom;
}
.hero-dust-stage canvas {position:absolute;inset:0;display:block;width:100%;height:100%}
.hero-dust-fallback {position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:5%;padding:8%;visibility:hidden;opacity:.8}
.hero-dust-fallback span {
  width:43%;height:80%;max-height:550px;
  background-image:
    radial-gradient(circle,#eadfff 0 1px,transparent 1.4px),
    radial-gradient(circle,#9277ca 0 .75px,transparent 1.2px),
    radial-gradient(circle,#5e00ff 0 .55px,transparent 1px);
  background-size:17px 19px,23px 29px,31px 37px;
  background-position:0 0,8px 12px,17px 21px;
  -webkit-mask:url("loop-v3.svg") center / contain no-repeat;
  mask:url("loop-v3.svg") center / contain no-repeat;
}
.hero-dust-stage[data-fallback="true"] .hero-dust-fallback {visibility:visible}
.hero-dust-stage[data-ready="true"] .hero-dust-fallback {visibility:hidden}
@media(min-width:1600px) {.hero-dust .hero-copy {padding-left:30px}}
@media(min-width:901px) and (max-height:720px) {
  .hero-dust {padding-block:16px}
  .hero-dust-stage {height:440px}
  .hero-dust .hero-copy {padding-block:18px}
}
@media(max-width:1100px) and (min-width:901px) {
  .hero-dust .hero-layout {width:calc(100% - 64px);grid-template-columns:1fr 1fr}
  .hero-dust h1 {font-size:clamp(2.5rem,4.3vw,3rem)}
}
@media(max-width:900px) {
  .hero-dust {--hero-bottom:clamp(28px,4svh,48px);padding:0 0 var(--hero-bottom);align-items:stretch}
  .hero-dust .hero-layout {
    width:calc(100% - 48px);max-width:650px;
    min-height:calc(100vh - var(--nav-height,69px) - var(--hero-bottom));
    min-height:calc(100svh - var(--nav-height,69px) - var(--hero-bottom));
    grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(220px,1fr) auto;gap:0;align-items:stretch;
  }
  .hero-dust .hero-copy {grid-row:2;width:100%;max-width:580px;padding:8px 0 0;margin:0 auto;text-align:left;align-self:end}
  .hero-dust .hero-visual {grid-row:1;width:calc(100% + 48px);margin:0 -24px;max-width:none;align-self:stretch;display:grid;min-height:0}
  .hero-dust-stage {height:100%;min-height:220px}
  .hero-dust h1 {font-size:clamp(2.75rem,7vw,4rem);line-height:1.05}
  .hero-dust .hero-description {max-width:49ch}
  .hero-dust .hero-copy .eyebrow {margin-bottom:18px;font-size:.9375rem}
}
@media(max-width:540px) {
  .hero-dust .hero-copy {padding-top:8px}
  .hero-dust h1 {font-size:clamp(2.25rem,9.1vw,3.15rem);line-height:1.05}
  .hero-dust .hero-copy .eyebrow {font-size:.875rem;margin-bottom:16px}
  .hero-dust .hero-description {font-size:1rem;line-height:1.55;margin-top:20px}
}
@media(forced-colors:active) {
  .hero-dust h1 span {background:none;-webkit-text-fill-color:CanvasText;color:CanvasText}
}
@media print {
  .hero-dust {min-height:0;padding:24px 0;display:block}
  .hero-dust .hero-layout {width:100%;grid-template-columns:1fr 1fr}
  .hero-dust .hero-copy,.hero-dust .hero-visual {grid-row:auto}
  .hero-dust .hero-visual {width:100%;margin:0}
  .hero-dust-stage {height:250px}
  .hero-dust-stage canvas {display:none}
  .hero-dust-stage .hero-dust-fallback {visibility:visible}
}