/* ============================================================
   CyrusOffice landing. Light mode only.
   Cinematic scroll-scrubbed film hero (10k-websites standard),
   floating nav pill pinned to the hero, kicker sections, cards
   with shadows, one call to action.
   ============================================================ */
:root{
  --canvas:#eef2f7;
  --card:#ffffff;
  --input:#f8fafc;
  --ink:#0f172a;
  --ink-soft:#475569;
  --smoke:#64748b;
  --faint:#94a3b8;
  --hairline:#e2e8f0;
  --primary:#2563eb;
  --primary-deep:#1d4ed8;
  --primary-light:#dbeafe;
  --go:#16a34a;
  --go-deep:#15803d;
  --go-light:#d1fae5;

  --shadow-1:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);
  --shadow-2:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.08);
  --shadow-3:0 10px 24px -6px rgba(15,23,42,.16),0 4px 8px -4px rgba(15,23,42,.08);

  /* light-world text glow: dark type over bright footage */
  --tglow:0 1px 2px rgba(255,255,255,.9),0 3px 12px rgba(255,255,255,.65),0 10px 44px rgba(255,255,255,.55);

  --ease:cubic-bezier(.22,1,.36,1);
  --shell:min(1160px,100% - 2.5rem);
}

*,*::before,*::after{box-sizing:border-box}
html,body{overflow-x:hidden;overflow-x:clip}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--canvas);color:var(--ink-soft);
  font-family:"Archivo",ui-sans-serif,system-ui,sans-serif;
  font-variation-settings:"wdth" 100;
  font-size:clamp(1rem,.97rem + .15vw,1.0625rem);line-height:1.5;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
h1,h2{
  font-family:"Archivo",sans-serif;font-weight:700;color:var(--ink);
  font-variation-settings:"wdth" 62;
  text-transform:uppercase;letter-spacing:-.02em;line-height:.92;margin:0;
}
h3{font-family:"Archivo",sans-serif;font-weight:700;color:var(--ink);
  letter-spacing:-.01em;line-height:1.2;margin:0}
.mono{font-family:"IBM Plex Mono",ui-monospace,monospace;font-weight:500;
  font-size:.75rem;letter-spacing:.12em;text-transform:uppercase}
a{color:inherit}
img,svg{max-width:100%}
:focus-visible{outline:2px solid var(--primary);outline-offset:3px;border-radius:2px}
::selection{background:var(--primary-light);color:var(--ink)}

.shell{width:var(--shell);margin-inline:auto}
.skip{position:absolute;left:-9999px;top:0;z-index:99}
.skip:focus{left:1rem;top:1rem;background:var(--ink);color:#fff;padding:.6rem 1rem;border-radius:8px}

/* ---------- the environment layer: paper dust, whisper level ---------- */
.dust{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.5}
.dust::before,.dust::after{content:"";position:absolute;left:0;top:-10%;width:100%;height:120%;
  background-image:
    radial-gradient(2px 2px at 12% 18%,rgba(148,163,184,.5) 40%,transparent 41%),
    radial-gradient(1.5px 1.5px at 38% 64%,rgba(148,163,184,.4) 40%,transparent 41%),
    radial-gradient(2px 2px at 71% 30%,rgba(148,163,184,.45) 40%,transparent 41%),
    radial-gradient(1.5px 1.5px at 88% 76%,rgba(148,163,184,.4) 40%,transparent 41%),
    radial-gradient(2px 2px at 55% 88%,rgba(148,163,184,.35) 40%,transparent 41%);
  animation:dustdrift 90s linear -30s infinite alternate}
.dust::after{background-image:
    radial-gradient(1.5px 1.5px at 22% 82%,rgba(37,99,235,.28) 40%,transparent 41%),
    radial-gradient(2px 2px at 62% 12%,rgba(148,163,184,.4) 40%,transparent 41%),
    radial-gradient(1.5px 1.5px at 82% 48%,rgba(37,99,235,.22) 40%,transparent 41%);
  animation-duration:120s;animation-delay:-70s}
@keyframes dustdrift{from{transform:translateY(-1.5%)}to{transform:translateY(1.5%)}}
body.paused *,body.paused *::before,body.paused *::after{animation-play-state:paused !important}

main{position:relative;z-index:2}
.foot{position:relative;z-index:2}

/* ---------- the nav pill: pinned with the hero, leaves with it ---------- */
.navwrap{position:absolute;top:0;left:0;right:0;z-index:40;display:flex;justify-content:center;padding:1.1rem 1.25rem;pointer-events:none}
.nav{pointer-events:auto;display:flex;align-items:center;gap:1.75rem;background:var(--card);
  border:1px solid var(--hairline);border-radius:48px;padding:.3rem .35rem .3rem 1rem;
  max-width:100%;box-shadow:var(--shadow-2)}
.brand{display:flex;align-items:center;gap:.55rem;text-decoration:none}
.brand svg{width:1.35rem;height:1.35rem;flex:none}
.brand b{font-weight:700;color:var(--ink);font-size:.9375rem;letter-spacing:-.01em}
.navlinks{display:none;gap:1.4rem;align-items:center}
@media (min-width:760px){.navlinks{display:flex}}
.navlinks a{color:var(--smoke);text-decoration:none;font-size:.9375rem;transition:color .2s}
.navlinks a:hover{color:var(--ink)}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:.8rem 1.5rem;border-radius:8px;border:1px solid var(--go);
  background:var(--go);color:#fff;text-decoration:none;cursor:pointer;
  font-family:"Archivo",sans-serif;font-weight:500;font-size:.9375rem;
  transition:background .2s,border-color .2s,transform .35s var(--ease),box-shadow .2s;
  box-shadow:var(--shadow-1);text-shadow:none}
.btn:hover{background:var(--go-deep);border-color:var(--go-deep);box-shadow:var(--shadow-2)}
.btn.sm{padding:.4rem 1rem;font-size:.875rem;white-space:nowrap}
.btn.cta{padding:.95rem 1.9rem;font-size:1.0625rem}
.btn.ghost{background:var(--card);border-color:var(--hairline);color:var(--ink-soft);box-shadow:none}
.btn.ghost:hover{background:var(--input);border-color:var(--faint);color:var(--ink)}
.nav-actions{display:flex;align-items:center;gap:.5rem}
@media (max-width:420px){.nav{gap:.8rem;padding-left:.8rem}.btn.sm{padding:.35rem .75rem;font-size:.8125rem}}
@media (pointer:coarse){.btn{min-height:44px}}

/* ============================================================
   The film hero. 400vh of track; a sticky viewport plays the
   6-second shot under the scroll. Dark type over bright footage.
   ============================================================ */
.scrollstage{height:400vh;position:relative;z-index:2}
.sticky{position:sticky;top:0;height:100vh;overflow:clip}

.stage{position:absolute;inset:0}
.stage .poster,.stage .ending{position:absolute;inset:0;background:center/cover no-repeat;background-color:var(--canvas)}
.stage .poster{opacity:0;transition:opacity .6s var(--ease)}
.stage.poster-ready .poster{opacity:1}
.stage video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity .8s var(--ease);will-change:transform;transform:translateZ(0)}
.stage.video-ready video{opacity:1}
.stage .ending{opacity:0;background-image:none}
body.static-hero .stage .ending{opacity:1;background-image:url('hero-ending.jpg');background-position:68% 55%}
.stage .scrim{position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 120% 90% at 42% 46%,rgba(255,255,255,0) 42%,rgba(238,242,247,.5) 100%)}
.ring{position:absolute;right:1.4rem;bottom:1.4rem;width:30px;height:30px;color:var(--faint);
  transform:rotate(-90deg);opacity:.85;transition:opacity .4s}
.stage.video-ready .ring,.stage.video-failed .ring,body.static-hero .ring{opacity:0}

/* ---------- the caption bands: left column over the calm lane ---------- */
.bands{position:absolute;inset:0;display:grid;z-index:5}
.band{grid-area:1/1;display:flex;flex-direction:column;justify-content:center;
  padding:6.5rem 1.25rem 3rem;width:var(--shell);margin-inline:auto;
  max-width:100%;opacity:0;pointer-events:none;will-change:opacity}
.band>*{max-width:34rem}
.band h1{font-size:clamp(2.5rem,5.2vw,4.5rem);text-shadow:var(--tglow)}
.band .kick{color:var(--ink-soft);margin:0 0 1.2rem;text-shadow:var(--tglow)}
.band .sub{margin:1.4rem 0 0;max-width:42ch;font-size:clamp(1rem,1.35vw,1.1875rem);
  color:var(--ink-soft);text-shadow:var(--tglow)}
.band .cta-row{display:flex;flex-direction:column;align-items:flex-start;gap:.9rem;margin-top:2rem}
.band .note{color:var(--ink-soft);text-shadow:var(--tglow)}
.band.on{pointer-events:auto}
.fx span{display:inline-block}
.fx .line{display:block}
.fx .w{white-space:nowrap}

/* the per-band veil: a soft light lift behind the text, never a flatten */
.band::before{content:"";position:absolute;left:0;top:0;bottom:0;width:min(52rem,78%);
  pointer-events:none;opacity:calc(.3 + .7*var(--k,1));
  background:radial-gradient(ellipse 78% 64% at 34% 50%,rgba(240,244,249,.78) 0%,rgba(240,244,249,.5) 46%,rgba(240,244,249,0) 76%)}
.band>*{position:relative}

.scrollhint{margin:2.6rem 0 0;color:var(--smoke)}
.scrollhint::after{content:"↓";margin-left:.5rem;display:inline-block;animation:hint 1.8s var(--ease) infinite}
@keyframes hint{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
.static-only{display:none}

/* ---------- entrance choreography (transform+opacity only, off --k) ---------- */
/* scatter: characters fly in from seeded offsets (band 1) */
.fx[data-fx="scatter"] .c{--kc:clamp(0,(var(--k,0) - var(--th,0))*2.6,1);opacity:var(--kc);
  transform:translate(calc((1 - var(--kc))*var(--jx,0px)),calc((1 - var(--kc))*var(--jy,0px)))
            rotate(calc((1 - var(--kc))*var(--jr,0deg)))}
/* drift-down: words fall into place (band 2) */
.fx[data-fx="drift"] .w{--kc:clamp(0,(var(--k,0) - var(--th,0))*2.8,1);opacity:var(--kc);
  transform:translateY(calc((1 - var(--kc))*-26px))}
/* rise: words rise in reading order, then subline, then CTA (band 3) */
.fx[data-fx="rise"] .w{--kc:clamp(0,(var(--k,0) - var(--th,0))*3,1);opacity:var(--kc);
  transform:translateY(calc((1 - var(--kc))*18px))}
#band3 .stage3{opacity:calc(clamp(0,(var(--k,1) - .55)*4,1));
  transform:translateY(calc((1 - clamp(0,(var(--k,1) - .55)*4,1))*14px))}
#band3 .stage3b{opacity:calc(clamp(0,(var(--k,1) - .72)*5,1));
  transform:translateY(calc((1 - clamp(0,(var(--k,1) - .72)*5,1))*14px))}

/* ---------- the static hero (phones, coarse portrait, short landscape,
              reduced motion, ?full=1): a designed layout over the ending frame */
body.static-hero .scrollstage{height:100vh;min-height:640px}
body.static-hero .sticky{position:static;height:100%}
body.static-hero .band{display:none}
body.static-hero #band3{display:flex;opacity:1;pointer-events:auto;
  justify-content:flex-start;padding-top:7.5rem}
body.static-hero #band3::before{left:0;right:0;top:0;bottom:auto;width:auto;height:76%;opacity:1;
  background:linear-gradient(to bottom,rgba(238,242,247,.95) 0%,rgba(238,242,247,.8) 45%,rgba(238,242,247,0) 100%)}
body.static-hero #band3 .sub:not(.static-only){display:none}
body.static-hero .static-only{display:block}
body.static-hero #band3 .stage3b{opacity:1;transform:none}
body.static-hero .fx .c,body.static-hero .fx .w{opacity:1 !important;transform:none !important}
body.static-hero .band::before{opacity:1}
@media (max-height:560px){.scrollhint,.ring{display:none}}

/* ---------- sections ---------- */
.sec{padding:clamp(3.5rem,8vh,5.5rem) 0}
.kicker{color:var(--ink);margin:0 0 1.1rem;position:relative}
.kicker::before{content:"";display:inline-block;width:.55rem;height:.55rem;border-radius:2px;
  background:var(--primary);margin-right:.6rem;vertical-align:baseline}
.kicker::after{content:"";position:absolute;left:0;bottom:-8px;height:1px;width:100%;max-width:180px;
  background:var(--primary-light);transform:scaleX(0);transform-origin:left;transition:transform 1s var(--ease) .3s}
.rev.in .kicker::after{transform:scaleX(1)}
.sec h2{font-size:clamp(2.1rem,4.6vw,3.75rem);max-width:20ch}
.lede{margin-top:1.15rem;max-width:56ch}

.cards3{display:grid;gap:1.25rem;grid-template-columns:1fr;margin-top:2.5rem}
@media (min-width:760px){.cards3{grid-template-columns:repeat(3,1fr)}}
.card{background:var(--card);border:1px solid var(--hairline);border-radius:20px;
  padding:1.75rem 1.5rem;box-shadow:var(--shadow-1);
  transition:box-shadow .2s,transform .35s var(--ease)}
.card:hover{box-shadow:var(--shadow-3);transform:translateY(-3px)}
.card h3{font-size:1.1875rem}
.card p{margin:.7rem 0 0;font-size:.9375rem}
.stepnum{display:inline-block;color:var(--primary);background:var(--primary-light);
  border-radius:9999px;padding:.3rem .7rem;margin-bottom:1.1rem}

/* photographic card art from the hero film's world: full bleed, center band */
.card-art{position:relative;margin:-1.75rem -1.5rem 1.25rem;border-radius:20px 20px 0 0;overflow:hidden;
  border-bottom:1px solid #f1f5f9;background:var(--canvas)}
.card-art img{display:block;width:100%;height:190px;object-fit:cover;object-position:center}

/* the benefit badges: the payoff pops onto the art as the visitor browses down */
.benefit{position:absolute;right:.85rem;bottom:.7rem;width:46px;height:46px;border-radius:50%;
  background:#fff;border:1px solid var(--hairline);box-shadow:var(--shadow-2);
  display:flex;align-items:center;justify-content:center;
  opacity:0;transform:scale(.25);
  transition:transform .6s cubic-bezier(.34,1.56,.64,1),opacity .3s ease}
.benefit svg{width:27px;height:27px}
.benefit.b-go{color:var(--go)}
.benefit.b-blue{color:var(--primary)}
.benefit.bon{opacity:1;transform:scale(1)}
/* each card's words arrive with its badge */
#peace .card h3,#peace .card p{opacity:0;transform:translateY(8px);
  transition:opacity .5s var(--ease),transform .5s var(--ease)}
#peace .card.showtext h3,#peace .card.showtext p{opacity:1;transform:none}
#peace .card.showtext p{transition-delay:.08s}
@media (prefers-reduced-motion:reduce){
  .benefit{opacity:1;transform:none}
  #peace .card h3,#peace .card p{opacity:1;transform:none}
}

/* the growth card: the one saturated moment on the page */
.grow-card{background:linear-gradient(135deg,var(--primary),var(--primary-deep));
  border-radius:32px;padding:clamp(2rem,5vw,3.5rem);box-shadow:var(--shadow-3)}
.grow-card h2{color:#fff;max-width:16ch}
.grow-card .kicker{color:var(--primary-light)}
.grow-card .kicker::before{background:#fff}
.grow-card .kicker::after{background:rgba(255,255,255,.35)}
.grow-card .lede{color:#dbeafe;max-width:60ch}
.grow-card .lede.strong{color:#fff;font-weight:500}
.grow-card :focus-visible{outline-color:#fff}
.grow-grid{display:grid;gap:2.25rem;align-items:center;grid-template-columns:1fr}
@media (min-width:860px){.grow-grid{grid-template-columns:minmax(0,12fr) minmax(0,8fr)}}
.grow-art{background:#fff;border-radius:20px;overflow:hidden;box-shadow:var(--shadow-2)}

/* the module panel: free foundation on top, the growth cycler below */
.module-panel{background:#fff;padding:1.1rem 1.1rem .4rem}
.mtitle{margin:0 0 .7rem;color:var(--smoke);text-align:center}
.mfree-row{display:flex;justify-content:center;gap:1.4rem;flex-wrap:wrap}
.fmod{display:inline-flex;align-items:center;gap:.45rem;font-size:.875rem;font-weight:500;
  color:var(--ink);position:relative;padding-right:.9rem}
.fmod svg{width:20px;height:20px;color:var(--primary);flex:none}
.fmod::after{content:"";position:absolute;right:0;top:50%;transform:translateY(-50%);
  width:6px;height:6px;border-radius:50%;background:var(--go)}
.msep{height:1px;background:var(--hairline);margin:1rem -1.1rem}

/* the panel's zones arrive in order as the visitor browses down */
.gz2,.gz3{opacity:0;transform:translateY(12px);
  transition:opacity .55s var(--ease),transform .55s var(--ease)}
.grow-card.gstage2 .gz2,.grow-card.gstage3 .gz3{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.gz2,.gz3{opacity:1;transform:none}}

/* the cost comparison: the whole argument, no numbers on our side */
.mcost{display:flex;justify-content:center;align-items:flex-end;gap:2.6rem;padding:.4rem 0 .8rem}
.mbar{display:flex;flex-direction:column;align-items:center;gap:.3rem}
.mbar i{display:block;width:44px;border-radius:6px 6px 2px 2px;transform:scaleY(.12);
  transform-origin:bottom;transition:transform 1.1s var(--ease) .3s}
.rev.in .mbar i{transform:scaleY(1)}
.mbar-them i{height:64px;background:var(--faint)}
.mbar-us i{height:14px;background:var(--go);border-radius:4px}
.mbar .mono{color:var(--ink-soft)}
.mbar .dim{color:var(--faint);font-size:.6875rem;letter-spacing:.08em}
@media (prefers-reduced-motion:reduce){.mbar i{transform:scaleY(1)}}

/* the module cycler: every name visible, the active one center stage */
.module-cycler{position:relative;display:grid;grid-template-columns:auto 1fr auto;
  align-items:center;height:185px;padding:0;gap:.5rem}
.mlist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.55rem}
.mlist li{font-size:.75rem;color:var(--faint);white-space:nowrap;position:relative;
  padding-left:.7rem;transition:color .3s,transform .35s var(--ease)}
.mlist li::before{content:"";position:absolute;left:0;top:50%;width:4px;height:4px;
  border-radius:50%;background:var(--hairline);transform:translateY(-50%);transition:background .3s}
.mlist li.on{color:var(--primary);font-weight:600;transform:translateX(3px)}
.mlist li.on::before{background:var(--go)}
.mstage{position:relative;display:grid;height:100%;align-content:center;min-width:0}
.mslide{grid-area:1/1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:.3rem;text-align:center;opacity:0;transform:translateY(10px);
  transition:opacity .45s var(--ease),transform .45s var(--ease);pointer-events:none}
.mslide.active{opacity:1;transform:none}
.micon{width:44px;height:44px;color:var(--primary);margin-bottom:.35rem}
.mslide b{font-family:"Archivo",sans-serif;font-weight:700;color:var(--ink);
  letter-spacing:-.01em;font-size:1.45rem;line-height:1.05}
.mslide .mono{color:var(--smoke)}
.mdots{position:absolute;left:0;right:0;bottom:.2rem;display:flex;justify-content:center;gap:.45rem}
.mdots i{width:6px;height:6px;border-radius:50%;background:var(--hairline);transition:background .3s,transform .3s}
.mdots i.on{background:var(--primary);transform:scale(1.25)}
@media (max-width:460px){.mlist{display:none}.module-cycler{grid-template-columns:1fr;padding:0}}
@media (prefers-reduced-motion:reduce){.mslide{opacity:0}.mslide.active{opacity:1}}

/* faq */
.faq{margin-top:2.5rem;background:var(--card);border:1px solid var(--hairline);
  border-radius:20px;padding:0 1.5rem;box-shadow:var(--shadow-1)}
.faq details{border-bottom:1px solid var(--hairline)}
.faq details:last-child{border-bottom:0}
.faq summary{list-style:none;cursor:pointer;padding:1.25rem 2.5rem 1.25rem 0;position:relative;
  color:var(--ink);font-weight:500;transition:color .2s}
.faq summary:hover{color:var(--primary)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:.35rem;top:50%;transform:translateY(-50%);
  font-family:"IBM Plex Mono",monospace;color:var(--smoke);transition:transform .35s var(--ease)}
.faq details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.faq .a{padding:0 0 1.4rem;max-width:62ch;margin:0}

/* close + the one interactive moment: hold to file it */
.close-sec{text-align:center;padding-bottom:5.5rem}
.close-sec h2{margin-inline:auto}
.cta-close{margin-top:1.5rem}
.close-sec .note{margin-top:1.1rem;color:var(--smoke)}

.stamp-wrap{margin:2.25rem auto 0;display:flex;flex-direction:column;align-items:center;gap:.6rem}
.stamp{position:relative;width:132px;height:150px;border:0;background:transparent;cursor:pointer;
  padding:0;border-radius:14px;transition:transform .35s var(--ease)}
.stamp:hover{transform:translateY(-2px)}
.stamp:active{transform:scale(.97)}
.stamp-receipt{width:92px;height:118px;filter:drop-shadow(0 6px 14px rgba(15,23,42,.14))}
.seal{position:absolute;left:50%;top:50%;width:104px;height:104px;transform:translate(-50%,-54%) rotate(-8deg)}
.seal-ring{stroke:var(--go);stroke-dasharray:289;stroke-dashoffset:calc(289*(1 - var(--hold,0)));opacity:.9}
.seal-check{stroke:var(--go);stroke-dasharray:72;stroke-dashoffset:calc(72*(1 - var(--chk,0)))}
.stamp-hint{margin:0;color:var(--smoke)}
.stamp-done{margin:0;color:var(--go);opacity:0;transform:translateY(6px);
  transition:opacity .5s var(--ease),transform .5s var(--ease)}
.close-sec.filed .stamp-done{opacity:1;transform:none}
.close-sec.filed .stamp-hint{display:none}
.close-sec.filed .btn.cta{animation:filedpulse 1.2s var(--ease) 1}
@keyframes filedpulse{0%,100%{box-shadow:var(--shadow-1)}40%{box-shadow:0 0 0 10px rgba(22,163,74,.18)}}

/* footer */
.foot{border-top:1px solid var(--hairline);padding:1.1rem 0;background:var(--card)}
.foot .shell{display:flex;flex-wrap:wrap;gap:.6rem 2.5rem;justify-content:space-between;align-items:baseline}
.foot .brandline{margin:0;color:var(--ink)}
.foot .product-line{margin:.15rem 0 0;font-size:.8125rem;color:var(--smoke)}
.foot nav{display:flex;flex-wrap:wrap;gap:1.1rem}
.foot a{color:var(--ink-soft);text-decoration:none;font-size:.9375rem;transition:color .2s}
.foot a:hover{color:var(--ink)}

/* ---------- entrances, quiet ---------- */
.rev .part{opacity:0;transform:translateY(12px);
  transition:opacity .7s var(--ease),transform .7s var(--ease)}
.rev.in .part{opacity:1;transform:none}
.rev.in .part:nth-child(2){transition-delay:.08s}
.rev.in .part:nth-child(3){transition-delay:.16s}
.rev.in .part:nth-child(4){transition-delay:.24s}
.rev.in .part:nth-child(5){transition-delay:.32s}
.rev.done .part:nth-child(2),.rev.done .part:nth-child(3),
.rev.done .part:nth-child(4),.rev.done .part:nth-child(5){transition-delay:0s}

/* ---------- reduced motion, honoured completely ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none !important;transition:none !important;transition-delay:0s !important}
  .rev .part{opacity:1;transform:none}
  .kicker::after{transform:scaleX(1)}
  .seal-ring{stroke-dashoffset:0}
  .seal-check{stroke-dashoffset:0}
  .stamp-done{opacity:1;transform:none}
  .stamp-hint{display:none}
  .dust{display:none}
}