/* ═══════════════════════════════════════════════════════════════════════
   GRANDEUR OF EPPING — Registration
   Palette derived from the supplied artwork:
   brand gold = EPS spot CMYK 40 / 53 / 80 / 0
   ═══════════════════════════════════════════════════════════════════════ */

:root{
  /* brand */
  --gold:        #C89664;
  --gold-lt:     #E9CD9C;
  --gold-dp:     #A5743F;
  --gold-soft:   #D8B285;

  /* warm browns (right panel gradient, sampled from the reference) */
  --brown-900:   #3B2A20;
  --brown-800:   #4A3327;
  --brown-700:   #5A4033;
  --brown-600:   #6B4E3B;
  --brown-500:   #7C5C46;

  --ink:         #171614;
  --ink-2:       #211F1C;
  --cream:       #F9F8F4;

  --on-dark:     rgba(255,255,255,.80);
  --on-dark-dim: rgba(255,255,255,.55);
  --hair:        rgba(232,205,156,.22);

  /* layout */
  --pad-x:       clamp(28px, 4.2vw, 76px);
  --field-h:     clamp(46px, 5.8vh, 58px);

  /* type */
  --serif: "Cormorant Garamond", "Optima", "Palatino Linotype", Georgia, "Songti SC", serif;
  --sans:  "Jost", "Futura", "Avenir Next", "Helvetica Neue", "PingFang SC", Arial, sans-serif;

  --ease: cubic-bezier(.22,.61,.36,1);
}

/* ── reset ─────────────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none !important}
html{-webkit-text-size-adjust:100%}
body,h1,h2,p,ul,figure,address{margin:0}
ul{padding:0;list-style:none}
address{font-style:normal}
img,svg{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
a{color:inherit;text-decoration:none}

body{
  font-family:var(--sans);
  font-weight:300;
  background:var(--ink);
  color:var(--on-dark);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

.sprite{position:absolute;width:0;height:0;overflow:hidden}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

.skip-link{position:fixed;top:-100px;left:16px;z-index:200;padding:12px 20px;
  background:var(--gold);color:#2A1D14;font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  transition:top .2s var(--ease)}
.skip-link:focus{top:16px}

:focus-visible{outline:1px solid var(--gold-lt);outline-offset:3px}

/* ═══ STAGE ═════════════════════════════════════════════════════════ */
.stage{display:grid}

/* ═══ LEFT — SCROLLING VISUAL ═══════════════════════════════════════ */
.visual{
  position:relative;
  overflow:hidden;
  background:#0E0D0C;
  isolation:isolate;
}

.visual__scroller{
  height:100%;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;              /* replaced by the bespoke rail */
}
.visual__scroller::-webkit-scrollbar{width:0;height:0}
.visual__scroller:focus-visible{outline:1px solid var(--gold);outline-offset:-3px}

.visual__img{width:100%;height:auto}

/* soft scrims so overlays stay legible at any scroll position */
.visual__veil{position:absolute;left:0;right:0;pointer-events:none;z-index:2}
.visual__veil--top{top:0;height:34%;
  background:linear-gradient(180deg,rgba(20,15,11,.52) 0%,rgba(20,15,11,.20) 45%,transparent 100%)}
.visual__veil--bottom{bottom:0;height:46%;
  background:linear-gradient(0deg,rgba(18,13,10,.86) 0%,rgba(18,13,10,.55) 34%,transparent 100%)}

.brandmark{width:100%;height:auto;color:inherit}

.visual__brand{
  position:absolute;z-index:4;top:clamp(26px,4vh,52px);left:50%;
  transform:translateX(-50%);
  width:clamp(190px,20vw,286px);
  color:var(--gold-lt);
  filter:drop-shadow(0 2px 26px rgba(0,0,0,.45));
  transition:color .45s var(--ease),opacity .45s var(--ease);
}
.visual__brand:hover{color:#F2DDB6}

.visual__caption{
  position:absolute;z-index:4;right:var(--pad-x);bottom:clamp(38px,7vh,74px);
  left:var(--pad-x);
  text-align:right;
  color:#fff;
}
.visual__title{
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(28px,3.05vw,52px);
  line-height:1.16;
  letter-spacing:.055em;
  text-transform:uppercase;
  text-shadow:0 2px 30px rgba(0,0,0,.5);
  font-variant-numeric:lining-nums;
  font-feature-settings:"lnum" 1;
}
.rule{display:block;width:96px;height:1px;margin:clamp(16px,2.2vh,26px) 0 clamp(14px,1.8vh,20px) auto;
  background:linear-gradient(90deg,transparent,var(--gold-lt))}
.visual__sub{
  font-family:var(--serif);
  font-size:clamp(12px,.98vw,17px);
  letter-spacing:.28em;
  text-transform:uppercase;
  color:rgba(255,255,255,.88);
  font-variant-numeric:lining-nums;
  font-feature-settings:"lnum" 1;
}

/* ── bespoke scrollbar ─────────────────────────────────────────────── */
.railwrap{
  position:absolute;z-index:6;
  top:clamp(26px,4vh,52px);bottom:clamp(26px,4vh,52px);
  right:14px;width:16px;
  display:flex;justify-content:center;
  pointer-events:none;
}
.rail{
  position:relative;width:2px;height:100%;
  background:rgba(255,255,255,.16);
  pointer-events:auto;cursor:pointer;
  transition:width .25s var(--ease),background .25s var(--ease);
}
.rail::before{content:"";position:absolute;inset:-8px -7px;}
.railwrap:hover .rail,.rail.is-drag{width:4px;background:rgba(255,255,255,.24)}

.rail__thumb{
  position:absolute;left:50%;transform:translateX(-50%);
  top:0;width:100%;min-height:34px;border-radius:99px;
  background:linear-gradient(180deg,var(--gold-lt),var(--gold),var(--gold-dp));
  box-shadow:0 0 14px rgba(232,205,156,.42);
  touch-action:none;
}
/* the thumb reads as a 2px hairline but grabs like a 22px handle */
.rail__thumb::after{content:"";position:absolute;inset:-6px -10px}

/* ── scroll cue ────────────────────────────────────────────────────── */
.scrollcue{
  position:absolute;z-index:5;left:var(--pad-x);bottom:clamp(38px,7vh,74px);
  display:flex;flex-direction:column;align-items:flex-start;gap:12px;
  color:rgba(255,255,255,.78);
  text-shadow:0 1px 12px rgba(0,0,0,.55);
  transition:opacity .6s var(--ease),transform .6s var(--ease);
}
.scrollcue.is-hidden{opacity:0;transform:translateY(10px);pointer-events:none}
.scrollcue__label{font-size:10px;letter-spacing:.42em;text-transform:uppercase}
.scrollcue__line{position:relative;width:1px;height:56px;background:rgba(255,255,255,.34);overflow:hidden}
.scrollcue__line::after{content:"";position:absolute;left:0;top:0;width:1px;height:22px;
  background:linear-gradient(180deg,transparent,var(--gold-lt));
  animation:cue 2.4s var(--ease) infinite}
@keyframes cue{0%{transform:translateY(-24px)}60%,100%{transform:translateY(58px)}}

/* ═══ RIGHT — PANEL ═════════════════════════════════════════════════ */
.panel{
  position:relative;
  overflow-y:auto;
  overflow-x:hidden;
  background:
    radial-gradient(105% 70% at 84% 6%,rgba(232,205,156,.16),transparent 62%),
    radial-gradient(90% 60% at 8% 100%,rgba(0,0,0,.30),transparent 60%),
    linear-gradient(146deg,var(--brown-800) 0%,var(--brown-700) 36%,var(--brown-600) 68%,var(--brown-500) 100%);
  scrollbar-width:thin;
  scrollbar-color:rgba(232,205,156,.45) rgba(0,0,0,.18);
}
.panel::-webkit-scrollbar{width:6px}
.panel::-webkit-scrollbar-track{background:rgba(0,0,0,.18)}
.panel::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--gold-lt),var(--gold-dp));border-radius:99px}

/* very fine grain — keeps the large gradient from banding */
.panel__grain{
  position:absolute;inset:0;pointer-events:none;opacity:.35;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.32'/%3E%3C/svg%3E");
}

.panel__inner{
  position:relative;z-index:1;
  width:100%;max-width:660px;margin:0 auto;
  padding:clamp(36px,4.6vh,60px) var(--pad-x) clamp(34px,4.4vh,54px);
  display:flex;flex-direction:column;justify-content:center;
  min-height:100%;
}

.panel__brand{display:none;width:210px;margin:0 auto clamp(26px,4vh,44px);color:var(--gold-lt)}

.panel__head{text-align:center;margin-bottom:clamp(20px,3.1vh,36px)}

.eyebrow{
  font-size:clamp(9.5px,.72vw,11.5px);
  font-weight:400;
  letter-spacing:.44em;
  text-transform:uppercase;
  color:var(--gold-soft);
  margin-bottom:clamp(11px,1.6vh,18px);
  padding-left:.44em;
}

.panel__title{
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(30px,3.2vw,54px);
  line-height:1.04;
  letter-spacing:.09em;
  text-transform:uppercase;
  background:linear-gradient(102deg,var(--gold-lt) 0%,var(--gold) 46%,#EBD3A6 100%);
  -webkit-background-clip:text;background-clip:text;
  color:transparent;
  padding-left:.09em;
}

.ornament{display:flex;align-items:center;justify-content:center;gap:12px;
  margin:clamp(12px,1.8vh,22px) auto clamp(12px,1.8vh,20px);width:180px;color:var(--gold)}
.ornament i{flex:1;height:1px;background:linear-gradient(90deg,transparent,currentColor)}
.ornament i:last-child{background:linear-gradient(90deg,currentColor,transparent)}
.ornament span{width:5px;height:5px;transform:rotate(45deg);border:1px solid currentColor}

.panel__lead{
  font-family:var(--serif);
  font-size:clamp(15px,1.15vw,20px);
  line-height:1.6;
  letter-spacing:.02em;
  color:rgba(255,255,255,.86);
  max-width:44ch;margin-inline:auto;
}

/* ═══ FORM ══════════════════════════════════════════════════════════ */
/* Turnstile host. Empty and zero-height until Cloudflare decides a visitor
   needs challenging, at which point the widget appears above the button. */
.turnstile:empty{display:none}          /* else it eats a flex gap for nothing */
.turnstile:not(:empty){margin-top:clamp(6px,1vh,12px)}
.turnstile iframe{max-width:100%}

/* Spam trap — must stay in the layout and remain focusable-by-bots, so it
   cannot use display:none (many bots skip hidden fields). Positioned off
   screen instead. */
.hp{
  position:absolute !important;
  left:-9999px;top:auto;
  width:1px;height:1px;overflow:hidden;
}

/* the gap is sized to hold a one-line error message, so validation
   messages never reflow the fields underneath them */
.form{display:flex;flex-direction:column;gap:clamp(19px,2.2vh,23px)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(10px,1.3vh,14px)}
.field{position:relative}

.field input,
.field select{
  width:100%;
  height:var(--field-h);
  padding:0 20px;
  border:1px solid transparent;
  border-radius:2px;
  background:var(--cream);
  color:#2E2118;
  font-family:var(--sans);
  font-size:15px;
  font-weight:300;
  letter-spacing:.02em;
  transition:box-shadow .3s var(--ease),border-color .3s var(--ease),background .3s var(--ease);
}
.field input::placeholder{color:#9C9184;opacity:1}

.field input:hover,.field select:hover{background:#FFFEFB}
.field input:focus,.field select:focus{
  outline:none;
  border-color:var(--gold);
  background:#fff;
  box-shadow:0 0 0 3px rgba(200,150,100,.28),0 10px 30px -14px rgba(0,0,0,.5);
}

/* select */
.field--select select{
  appearance:none;-webkit-appearance:none;
  padding-right:52px;
  color:#2E2118;cursor:pointer;
}
/* placeholder colour while nothing is chosen */
.field--select select.is-empty{color:#9C9184}
.field--select select option{color:#2E2118}
.field__chevron{position:absolute;right:20px;top:calc(var(--field-h) / 2);
  width:14px;transform:translateY(-50%);color:#7A6A58;pointer-events:none;transition:color .3s var(--ease)}
.field--select:hover .field__chevron{color:var(--gold-dp)}

/* invalid */
.field.is-invalid input,.field.is-invalid select{
  border-color:#E0A08A;
  box-shadow:0 0 0 3px rgba(224,160,138,.24);
}
.err{
  position:absolute;left:2px;right:0;top:calc(100% + 4px);
  display:none;
  font-size:11.5px;line-height:1.25;letter-spacing:.06em;
  color:#F2C0AB;
  text-shadow:0 1px 6px rgba(0,0,0,.35);
}
.field.is-invalid .err,.err.is-shown{display:block}

.consent-block{position:relative}
.err--consent{top:calc(100% + 5px)}

/* consent */
.consent{display:flex;align-items:flex-start;gap:12px}
.consent input{
  appearance:none;-webkit-appearance:none;
  flex:none;width:17px;height:17px;margin-top:2px;
  border:1px solid rgba(255,255,255,.45);
  border-radius:1px;background:rgba(255,255,255,.06);
  cursor:pointer;position:relative;
  transition:background .25s var(--ease),border-color .25s var(--ease);
}
.consent input:hover{border-color:var(--gold-lt)}
.consent input:checked{background:var(--gold);border-color:var(--gold)}
.consent input:checked::after{
  content:"";position:absolute;left:5px;top:1px;width:5px;height:10px;
  border:solid #35251A;border-width:0 1.6px 1.6px 0;transform:rotate(42deg);
}
.consent.is-invalid input{border-color:#E8A992;background:rgba(232,169,146,.18);
  box-shadow:0 0 0 3px rgba(232,169,146,.16)}
.consent label{font-size:12.5px;line-height:1.55;letter-spacing:.015em;color:rgba(255,255,255,.72);cursor:pointer}

/* button */
.btn{
  position:relative;overflow:hidden;
  margin-top:clamp(8px,1.3vh,16px);
  height:clamp(50px,6.3vh,62px);
  border:0;border-radius:2px;cursor:pointer;
  background:linear-gradient(101deg,#EDD3A4 0%,#D6AC72 40%,#C29255 72%,#D9B47F 100%);
  color:#3A2818;
  font-family:var(--sans);
  font-size:clamp(12px,.92vw,14px);
  font-weight:400;
  letter-spacing:.3em;
  text-transform:uppercase;
  box-shadow:0 14px 34px -18px rgba(0,0,0,.85);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),filter .3s var(--ease);
}
.btn__label{position:relative;z-index:2;padding-left:.3em}
.btn__sheen{
  position:absolute;z-index:1;top:0;left:-60%;width:45%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-18deg);transition:left .75s var(--ease);
}
.btn:hover{filter:brightness(1.06);box-shadow:0 20px 42px -18px rgba(0,0,0,.9);transform:translateY(-1px)}
.btn:hover .btn__sheen{left:120%}
.btn:active{transform:translateY(0)}
.btn[aria-busy="true"]{pointer-events:none;filter:saturate(.7) brightness(.94)}

.required-note{
  text-align:center;
  font-size:10.5px;letter-spacing:.16em;
  color:rgba(255,255,255,.42);
  margin-top:clamp(7px,1.1vh,13px);
  line-height:1.6;
}
.required-note a{
  color:var(--gold-soft);
  border-bottom:1px solid rgba(216,178,133,.35);
  transition:color .3s var(--ease),border-color .3s var(--ease);
}
.required-note a:hover{color:var(--gold-lt);border-color:var(--gold-lt)}

/* ═══ SUCCESS ═══════════════════════════════════════════════════════ */
.thanks{text-align:center;animation:fadeUp .8s var(--ease) both}
.thanks:focus{outline:none}
.thanks__seal{width:56px;margin:0 auto clamp(18px,2.6vh,28px);color:var(--gold-lt)}
.thanks__seal svg{width:100%;height:auto;stroke-linecap:round;stroke-linejoin:round}
.thanks__title{
  font-family:var(--serif);font-weight:300;
  font-size:clamp(32px,3.2vw,54px);letter-spacing:.1em;text-transform:uppercase;
  background:linear-gradient(102deg,var(--gold-lt),var(--gold) 55%,#EBD3A6);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.thanks__copy{font-family:var(--serif);font-size:clamp(15px,1.15vw,20px);line-height:1.65;
  color:rgba(255,255,255,.84);max-width:42ch;margin-inline:auto}
.thanks__meta{margin-top:clamp(18px,2.6vh,28px);font-size:11.5px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--gold-soft)}

/* ═══ FOOTER ════════════════════════════════════════════════════════ */
.foot{
  background:var(--ink);
  border-top:1px solid rgba(232,205,156,.14);
}
.foot__inner{
  display:grid;
  grid-template-columns:auto auto 1fr auto;
  align-items:center;
  gap:clamp(22px,3vw,54px);
  padding:18px var(--pad-x);
}

.foot__brand{width:clamp(120px,9vw,158px);color:var(--gold);opacity:.92;transition:opacity .3s var(--ease)}
.foot__brand:hover{opacity:1}

.foot__card{
  display:flex;align-items:center;gap:16px;
  padding:13px 22px 13px 16px;
  border:1px solid rgba(232,205,156,.20);
  background:
    linear-gradient(135deg,rgba(232,205,156,.05),transparent 70%),
    repeating-linear-gradient(-45deg,rgba(232,205,156,.035) 0 1px,transparent 1px 11px);
}
.foot__pin{flex:none;width:22px;color:var(--gold)}
.foot__pin svg{width:100%;height:auto;stroke-linecap:round;stroke-linejoin:round}
.foot__label{font-size:9px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold-soft);margin-bottom:6px}
.foot__addr{font-size:13px;line-height:1.5;color:rgba(255,255,255,.80);letter-spacing:.02em}

.foot__contact{display:flex;flex-direction:column;gap:9px}
.foot__contact li{display:flex;align-items:center;gap:11px}
.ico{flex:none;width:15px;height:15px;color:var(--gold);stroke-linecap:round;stroke-linejoin:round}
.foot__contact a{
  font-size:12.5px;letter-spacing:.07em;color:rgba(255,255,255,.78);
  border-bottom:1px solid transparent;transition:color .3s var(--ease),border-color .3s var(--ease);
}
.foot__contact a:hover{color:var(--gold-lt);border-color:rgba(232,205,156,.5)}

.foot__legal{text-align:right}
.foot__links{display:flex;justify-content:flex-end;gap:clamp(14px,1.6vw,26px);margin-bottom:9px}
.foot__links a{
  font-size:11px;letter-spacing:.14em;color:var(--gold-soft);
  border-bottom:1px solid transparent;transition:color .3s var(--ease),border-color .3s var(--ease);
}
.foot__links a:hover{color:var(--gold-lt);border-color:rgba(232,205,156,.5)}
.foot__copy{font-size:10.5px;letter-spacing:.09em;color:rgba(255,255,255,.34)}

/* ═══ REVEAL ════════════════════════════════════════════════════════ */
@keyframes fadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.reveal{animation:fadeUp .9s var(--ease) both}
.panel__head{animation-delay:.10s}
.form{animation-delay:.22s}
.visual__brand,.visual__caption{animation:fadeUp 1s var(--ease) both}
.visual__caption{animation-delay:.3s}

/* ═══════════════════════════════════════════════════════════════════
   DESKTOP — split stage locked to the viewport, footer always visible
   ═══════════════════════════════════════════════════════════════════ */
@media (min-width:1024px){
  html,body{height:100%}
  body{overflow:hidden;display:flex;flex-direction:column}
  .stage{
    flex:1;min-height:0;
    grid-template-columns:minmax(0,1.32fr) minmax(560px,1fr);
  }
  .foot{flex:none}
}

@media (min-width:1024px) and (max-width:1280px){
  .stage{grid-template-columns:minmax(0,1fr) minmax(480px,.95fr)}
  :root{--pad-x:clamp(26px,3.4vw,48px)}
}

/* ── short viewports: two graduated compaction tiers ─────────────────
   The panel is independently scrollable, so nothing is ever lost —
   these tiers simply keep the whole form on screen without scrolling. */
@media (min-width:1024px) and (max-height:900px){
  .panel__title{font-size:clamp(30px,2.8vw,46px)}
  .panel__lead{font-size:clamp(14px,1vw,17px)}
  .ornament{width:150px}
  .foot__inner{padding-block:15px}
  .foot__contact{gap:7px}
}
@media (min-width:1024px) and (max-height:780px){
  .panel__inner{padding-block:30px}
  .panel__lead{display:none}
  .ornament{margin-bottom:0}
  .panel__title{font-size:clamp(28px,2.5vw,40px)}
  .foot__inner{padding-block:12px}
  .foot__card{padding-block:10px}
}

/* ═══════════════════════════════════════════════════════════════════
   TABLET / MOBILE — stacked, page scrolls, image keeps its own scroll
   ═══════════════════════════════════════════════════════════════════ */
@media (max-width:1023px){
  .stage{grid-template-columns:1fr}

  /* shorter than the render's natural height, so the panel keeps a
     generous vertical scroll of its own */
  .visual{height:min(62vh,520px)}
  .visual__brand{display:none}
  .panel__brand{display:block}

  .visual__caption{text-align:center;left:24px;right:24px;bottom:clamp(30px,5vh,48px)}
  .rule{margin-inline:auto}
  .visual__title{font-size:clamp(24px,5.6vw,38px)}
  .visual__sub{font-size:clamp(10px,2.5vw,13px)}

  .scrollcue{left:50%;transform:translateX(-50%);align-items:center;bottom:auto;top:clamp(22px,4vh,40px)}
  .scrollcue.is-hidden{transform:translate(-50%,10px)}
  .scrollcue__line{height:38px}
  @keyframes cue{0%{transform:translateY(-20px)}60%,100%{transform:translateY(40px)}}

  .railwrap{top:18px;bottom:18px;right:9px;width:14px}

  /* let a swipe that runs past the end of the render carry on down
     the page instead of dead-ending inside the image */
  .visual__scroller{overscroll-behavior:auto}

  .panel{overflow:visible}
  .panel__inner{max-width:560px;padding-block:clamp(40px,7vw,64px)}

  .foot__inner{
    grid-template-columns:1fr;
    justify-items:center;text-align:center;
    gap:26px;padding:38px var(--pad-x) 42px;
  }
  .foot__brand{width:150px}
  .foot__card{width:100%;max-width:340px;justify-content:center;text-align:left}
  .foot__contact{align-items:center}
  .foot__legal{text-align:center}
  .foot__links{justify-content:center;flex-wrap:wrap}
}

@media (max-width:600px){
  :root{--pad-x:22px}
  .visual{height:min(56vh,440px)}
  .field-row{grid-template-columns:1fr}
  .panel__title{font-size:clamp(28px,8.4vw,40px);letter-spacing:.07em}
  .eyebrow{letter-spacing:.34em;font-size:9.5px}
  .consent label{font-size:12px}
  .btn{letter-spacing:.24em}
}

/* ═══ MOTION / PRINT ════════════════════════════════════════════════ */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;
    transition-duration:.001ms !important;scroll-behavior:auto !important}
}

@media print{
  body{background:#fff;color:#000;overflow:visible;height:auto}
  .visual,.railwrap,.scrollcue,.skip-link{display:none}
  .stage{grid-template-columns:1fr}
  .panel{background:#fff;color:#000}
}
