/* ==========================================================================
   ALENT — direction H: BLACK & ACID
   Pure black, acid yellow, square corners, mono labels, heavy uppercase.
   Inverted bone sections break the black so the page has rhythm.
   ========================================================================== */

:root{
  --black:#0A0A0A;
  --panel:#111110;
  --line:#2A2A28;
  --line-2:#3A3A36;

  --bone:#F5F5F0;
  --bone-2:#EBEBE3;
  --bone-line:#D8D8CE;

  --acid:#D7FF3B;
  --acid-deep:#5C7300;
  --warn:#FFB020;
  --bad:#FF5C4D;

  --fg:#F5F5F0;
  --muted:#8C8C88;
  --muted-2:#66665F;
  --ink:#0A0A0A;
  --ink-muted:#54544E;

  --display:"Archivo Black",Impact,sans-serif;
  --body:"Karla",system-ui,-apple-system,sans-serif;
  --mono:"Space Mono",ui-monospace,Menlo,monospace;

  --maxw:1220px;
  --gut:44px;
  --ease:cubic-bezier(.2,.7,.3,1);
}

*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:88px}
body{
  background:var(--black);
  color:var(--fg);
  font-family:var(--body);
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  /* clip, not hidden: hidden on body makes body the scroll container and
     breaks window scroll listeners + IntersectionObserver. */
  overflow-x:clip;
}
img{max-width:100%;display:block}
a{color:var(--acid);text-decoration:none;transition:color .15s var(--ease)}
a:focus-visible,button:focus-visible{outline:3px solid var(--acid);outline-offset:2px}
::selection{background:var(--acid);color:var(--ink)}

h1,h2,h3{font-family:var(--display);font-weight:400;text-transform:uppercase;line-height:.97;letter-spacing:-.032em}
h1 em,h2 em,h3 em{font-style:normal;color:var(--acid)}

.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--gut);position:relative}

/* ---------- bands ---------- */
.band{position:relative;border-bottom:1px solid var(--line)}
.band--bone{background:var(--bone);color:var(--ink);border-bottom-color:var(--bone-line)}
.band--bone h1,.band--bone h2,.band--bone h3{color:var(--ink)}
.band--bone h2 em,.band--bone h1 em{color:var(--acid-deep)}
.band--bone p{color:var(--ink-muted)}
.band--acid{background:var(--acid);color:var(--ink);border-bottom-color:var(--acid)}
.band--acid h2{color:var(--ink)}
.band--acid p{color:#2C3600}

/* ---------- mono label ---------- */
.tag{
  display:inline-block;font-family:var(--mono);font-size:11.5px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--acid);
  border:1px solid var(--line-2);padding:6px 11px;
}
.band--bone .tag{color:var(--acid-deep);border-color:var(--bone-line)}
.band--acid .tag{color:var(--ink);border-color:rgba(0,0,0,.4)}

.lede{font-size:18.5px;line-height:1.62;color:var(--muted);max-width:56ch}
.band--bone .lede{color:var(--ink-muted)}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:54px;padding:0 26px;border-radius:0;border:1px solid transparent;
  font-family:var(--mono);font-size:13px;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;cursor:pointer;white-space:nowrap;
  transition:transform .14s var(--ease),background .15s var(--ease),color .15s var(--ease),
             border-color .15s var(--ease),box-shadow .14s var(--ease);
}
.btn--primary{background:var(--acid);color:var(--ink)}
.btn--primary:hover{background:#E4FF63;color:var(--ink);transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--ink)}
.band--bone .btn--primary:hover{box-shadow:4px 4px 0 var(--ink)}
.btn--ghost{background:transparent;color:var(--fg);border-color:var(--line-2)}
.btn--ghost:hover{border-color:var(--acid);color:var(--acid)}
.band--bone .btn--ghost{color:var(--ink);border-color:#BFBFB3}
.band--bone .btn--ghost:hover{border-color:var(--ink);background:var(--ink);color:var(--bone)}
.btn--sm{min-height:44px;padding:0 18px;font-size:12px}
.btn:active{transform:translate(0,0);box-shadow:none}

/* ---------- header ---------- */
.site-head{position:sticky;top:0;z-index:100;background:var(--black);border-bottom:1px solid var(--line)}
.site-head .wrap{display:flex;align-items:center;gap:26px;min-height:76px}
/* Brand lockup: chevron tile + lowercase wordmark, acid "e" and full stop. */
.brand{display:inline-flex;align-items:center;gap:11px;color:var(--fg);flex:0 0 auto}
/* the mark is 30px tall; pad the link out to a 46px tap target */
.site-head .brand{padding-block:8px}
.brand .mark{display:block;flex:0 0 auto;line-height:0}
.brand .mark svg{display:block}
.brand .word{
  font-family:var(--display);font-size:25px;text-transform:lowercase;
  letter-spacing:-.045em;line-height:1;color:currentColor;
}
.brand .word em,.brand .word i{font-style:normal;color:var(--acid)}
.band--bone .brand .word em,.band--bone .brand .word i{color:var(--acid-deep)}
.site-head .brand:hover .word em,.site-head .brand:hover .word i{color:var(--fg)}
.foot-brand .brand .word{font-size:23px}
.nav{display:flex;align-items:center;gap:26px;flex:1 1 auto}
.nav a{
  font-family:var(--mono);font-size:12px;letter-spacing:.09em;text-transform:uppercase;
  color:var(--muted);padding:12px 0;min-height:44px;display:inline-flex;align-items:center;
}
.nav a:hover,.nav a[aria-current="page"]{color:var(--acid)}
.nav-toggle{
  display:none;background:transparent;border:1px solid var(--line-2);border-radius:0;
  width:46px;height:46px;align-items:center;justify-content:center;cursor:pointer;color:var(--fg);
}

/* ---------- hero ---------- */
.hero{padding-block:84px 0}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:56px;align-items:end}
.hero h1{font-size:clamp(40px,7.2vw,90px);max-width:13ch}
.hero .lede{font-size:19px}
.stack{display:flex;flex-direction:column;align-items:flex-start;gap:22px}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:4px}

.ticker{
  margin-top:64px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  display:grid;grid-template-columns:repeat(4,1fr);
}
.ticker div{padding:22px 0 22px 20px;border-left:1px solid var(--line)}
.ticker div:first-child{border-left:none;padding-left:0}
.ticker .k{font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--acid);text-transform:uppercase}
.ticker .v{font-family:var(--display);font-size:clamp(16px,1.9vw,21px);text-transform:uppercase;margin-top:8px;letter-spacing:-.02em;line-height:1.08}

/* ---------- photography ---------- */
.shot{position:relative;overflow:hidden;border:1px solid var(--line);background:var(--panel)}
.shot img{width:100%;height:100%;object-fit:cover;display:block;
  filter:grayscale(1) contrast(1.25) brightness(.6)}
.shot::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(10,10,10,.05),rgba(10,10,10,.75))}
.shot .stamp{
  position:absolute;left:0;bottom:0;z-index:2;background:var(--acid);color:var(--ink);
  font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;padding:8px 13px;
}
.shot--tall{aspect-ratio:4/5}
.shot--wide{aspect-ratio:16/9}
.band--bone .shot{border-color:var(--bone-line)}
.band--bone .shot img{filter:grayscale(1) contrast(1.1) brightness(1)}
.band--bone .shot::after{background:linear-gradient(180deg,rgba(245,245,240,0),rgba(245,245,240,.12))}

/* ---------- inner page header ---------- */
.pagehead{padding-block:72px 64px}
.pagehead h1{font-size:clamp(32px,5.4vw,64px);max-width:15ch}

/* ---------- sections ---------- */
.section{padding-block:92px}
.section--tight{padding-block:64px}
.section h2{font-size:clamp(27px,3.9vw,50px);max-width:17ch}
.section-head{display:flex;flex-direction:column;align-items:flex-start;gap:18px;max-width:780px;margin-bottom:50px}

/* ---------- numbered rows ---------- */
.rows{border-top:1px solid var(--line)}
.band--bone .rows{border-top-color:var(--bone-line)}
.row{
  display:grid;grid-template-columns:62px minmax(0,1fr) minmax(0,1.3fr);gap:26px;
  padding:28px 0;border-bottom:1px solid var(--line);align-items:start;
  transition:background .18s var(--ease);
}
.band--bone .row{border-bottom-color:var(--bone-line)}
.row:hover{background:var(--panel)}
.band--bone .row:hover{background:var(--bone-2)}
.row .n{font-family:var(--mono);font-size:12px;font-weight:700;color:var(--acid);letter-spacing:.1em;padding-top:6px}
.band--bone .row .n{color:var(--acid-deep)}
.row h3{font-family:var(--display);font-size:clamp(17px,2vw,22px);letter-spacing:-.02em;line-height:1.08}
.row p{font-size:16.5px;line-height:1.6;color:var(--muted)}
.band--bone .row p{color:var(--ink-muted)}

/* ---------- call-flow diagram ----------
   Mirrors the Miro "04 · The system" frame. Reads as a sequence on any width:
   4 columns desktop, 2 tablet, 1 phone. Arrows are hidden at row ends. */
.flow{border:1px solid var(--line);background:var(--panel)}
.band--bone .flow{border-color:var(--bone-line);background:#fff}

.flow-keys{display:flex;flex-wrap:wrap;gap:0;border-bottom:1px solid var(--line)}
.band--bone .flow-keys{border-bottom-color:var(--bone-line)}
.fkey{
  font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.13em;
  text-transform:uppercase;padding:12px 16px;display:inline-flex;align-items:center;gap:8px;
  color:var(--muted);border-right:1px solid var(--line);flex:1 1 auto;
}
.band--bone .fkey{color:var(--ink-muted);border-right-color:var(--bone-line)}
.fkey:last-child{border-right:none}
.fkey::before{content:"";width:12px;height:12px;flex:0 0 auto;display:block}
.fkey--main::before{background:var(--fg)}
.band--bone .fkey--main::before{background:var(--ink)}
.fkey--good::before{background:var(--acid)}
.fkey--warn::before{background:var(--warn)}
.fkey--bad::before{background:var(--bad)}

.chain{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0;padding:0}
.fnode{
  position:relative;z-index:1;padding:22px 20px;display:flex;flex-direction:column;gap:6px;
  border-right:1px solid var(--line);border-bottom:1px solid var(--line);
  transition:background .18s var(--ease);
}
/* the node before the acid one must out-stack it, or its arrow is painted over */
.fnode:has(+ .fnode--hit){z-index:3}
.band--bone .fnode{border-color:var(--bone-line)}
.fnode:hover{background:var(--black)}
.band--bone .fnode:hover{background:var(--bone-2)}
.fnode:nth-child(4n){border-right:none}
.chain .fnode:nth-last-child(-n+4){border-bottom:none}
.fnode .fn{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.14em;color:var(--muted-2)}
.fnode b{font-family:var(--display);font-size:15.5px;text-transform:uppercase;letter-spacing:-.02em;line-height:1.1}
.fnode .fd{font-size:14px;line-height:1.45;color:var(--muted)}
.band--bone .fnode .fd{color:var(--ink-muted)}
/* forward arrow in the gutter, suppressed at the end of each row */
.fnode::after{
  content:"";position:absolute;right:-5px;top:50%;width:9px;height:9px;z-index:2;
  border-top:2px solid var(--acid);border-right:2px solid var(--acid);
  transform:translateY(-50%) rotate(45deg);
}
.fnode:nth-child(4n)::after,.fnode:last-child::after{display:none}
/* the booked node is the point of the whole system */
.fnode--hit{background:var(--acid);border-color:var(--acid)}
.fnode--hit:hover{background:var(--acid)}
.fnode--hit .fn{color:#4A5A00}
.fnode--hit b{color:var(--ink)}
.fnode--hit .fd,.band--bone .fnode--hit .fd{color:#2C3600}
.fnode--hit::after{border-color:var(--ink)}

.outs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line)}
.band--bone .outs{border-top-color:var(--bone-line)}
.out{
  padding:22px 20px;display:flex;flex-direction:column;gap:7px;
  border-right:1px solid var(--line);border-left:3px solid transparent;
}
.band--bone .out{border-right-color:var(--bone-line)}
.out:last-child{border-right:none}
.out .ok{font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase}
.out b{font-family:var(--display);font-size:16px;text-transform:uppercase;letter-spacing:-.02em;line-height:1.1}
.out .od{font-size:14px;line-height:1.45;color:var(--muted)}
.band--bone .out .od{color:var(--ink-muted)}
.out--warn{border-left-color:var(--warn)}
.out--warn .ok{color:var(--warn)}
.out--good{border-left-color:var(--acid)}
.out--good .ok{color:var(--acid)}
.band--bone .out--good .ok{color:var(--acid-deep)}
.out--bad{border-left-color:var(--bad)}
.out--bad .ok{color:var(--bad)}

@media (max-width:900px){
  .chain{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fnode:nth-child(4n){border-right:1px solid var(--line)}
  .band--bone .fnode:nth-child(4n){border-right-color:var(--bone-line)}
  .fnode:nth-child(2n){border-right:none}
  /* 2 columns: row ends are every 2nd node, so 4n stays hidden too */
  .fnode:nth-child(2n)::after{display:none}
  .chain .fnode:last-child::after{display:none}
  .chain .fnode:nth-last-child(-n+4){border-bottom:1px solid var(--line)}
  .chain .fnode:nth-last-child(-n+2){border-bottom:none}
  .outs{grid-template-columns:1fr}
  .out{border-right:none;border-bottom:1px solid var(--line)}
  .band--bone .out{border-bottom-color:var(--bone-line)}
  .out:last-child{border-bottom:none}
}
@media (max-width:560px){
  .chain{grid-template-columns:1fr}
  .fnode,.fnode:nth-child(2n),.fnode:nth-child(4n){border-right:none}
  .chain .fnode{border-bottom:1px solid var(--line)}
  .band--bone .chain .fnode{border-bottom-color:var(--bone-line)}
  .chain .fnode:last-child{border-bottom:none}
  /* arrow turns to point down the stack */
  .chain .fnode::after,
  .chain .fnode:nth-child(2n)::after,
  .chain .fnode:nth-child(4n)::after{
    display:block;right:auto;left:20px;top:auto;bottom:-6px;
    transform:rotate(135deg);
  }
  .chain .fnode:last-child::after{display:none}
  .fkey{flex:1 1 50%;border-bottom:1px solid var(--line)}
  .band--bone .fkey{border-bottom-color:var(--bone-line)}
  .fkey:nth-child(2n){border-right:none}
}

/* ---------- cards ---------- */
.grid{display:grid;gap:0;border-top:1px solid var(--line);border-left:1px solid var(--line)}
.band--bone .grid{border-color:var(--bone-line)}
.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.cell{
  padding:34px 30px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);
  display:flex;flex-direction:column;gap:13px;transition:background .18s var(--ease);
}
.band--bone .cell{border-color:var(--bone-line)}
.cell:hover{background:var(--panel)}
.band--bone .cell:hover{background:var(--bone-2)}
.cell .ico{color:var(--acid)}
.band--bone .cell .ico{color:var(--acid-deep)}
.cell h3{font-family:var(--display);font-size:19px;letter-spacing:-.02em;line-height:1.1}
.cell p{font-size:16.5px;line-height:1.58;color:var(--muted)}
.band--bone .cell p{color:var(--ink-muted)}

/* ---------- blunt statement ---------- */
.blunt{border-left:4px solid var(--acid);padding:4px 0 4px 26px;max-width:62ch}
.blunt p{font-family:var(--body);font-size:clamp(19px,2.3vw,26px);line-height:1.36;color:var(--fg);font-weight:700}
.band--bone .blunt p{color:var(--ink)}
.blunt p + p{margin-top:14px;font-size:17px;color:var(--muted);font-weight:400}
.band--bone .blunt p + p{color:var(--ink-muted)}

/* ---------- spec list ---------- */
.spec{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 48px}
.spec div{display:flex;gap:13px;align-items:flex-start;padding:15px 0;
  border-bottom:1px solid var(--line);font-size:16.5px;line-height:1.5}
.band--bone .spec div{border-bottom-color:var(--bone-line)}
.spec svg{flex:0 0 auto;margin-top:3px;color:var(--acid)}
.band--bone .spec svg{color:var(--acid-deep)}
.spec .no svg{color:var(--muted-2)}
.spec .no span{color:var(--muted)}
.band--bone .spec .no span{color:#8A8A80}

/* ---------- FAQ ---------- */
.qa{border-top:1px solid var(--line)}
.band--bone .qa{border-top-color:var(--bone-line)}
.qa > div{
  display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:36px;
  padding:28px 0;border-bottom:1px solid var(--line);transition:background .18s var(--ease);
}
.band--bone .qa > div{border-bottom-color:var(--bone-line)}
.qa > div:hover{background:var(--panel)}
.band--bone .qa > div:hover{background:var(--bone-2)}
.qa h3{font-family:var(--display);font-size:18px;letter-spacing:-.02em;line-height:1.16}
.qa p{font-size:16.5px;line-height:1.62;color:var(--muted)}
.band--bone .qa p{color:var(--ink-muted)}

/* ---------- founder ---------- */
.founder{display:grid;grid-template-columns:190px minmax(0,1fr);gap:40px;align-items:start}
.founder .pic{border:1px solid var(--line);overflow:hidden}
.founder .pic img{width:100%;filter:grayscale(1) contrast(1.15)}
.founder blockquote{font-family:var(--display);font-size:clamp(19px,2.4vw,30px);
  text-transform:none;letter-spacing:-.022em;line-height:1.24;color:var(--fg)}
.founder .who{margin-top:20px;font-family:var(--mono);font-size:12px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted)}
.founder .who b{color:var(--acid);font-weight:700}

/* ---------- CTA ---------- */
.cta{padding-block:96px;text-align:center}
.cta .wrap{display:flex;flex-direction:column;align-items:center;gap:20px}
.cta h2{font-size:clamp(29px,4.8vw,58px);max-width:16ch}
.cta p{font-size:17.5px;line-height:1.6;color:var(--muted);max-width:56ch}
.band--acid .cta p{color:#2C3600}

/* ---------- booking ---------- */
.booking{border:1px solid var(--line);background:var(--bone);padding:6px}

/* ---------- footer ---------- */
.site-foot{background:var(--black);color:var(--muted);padding-block:64px 36px}
.site-foot a{color:var(--muted)}
.site-foot a:hover{color:var(--acid)}
.foot-top{display:flex;gap:56px;flex-wrap:wrap;padding-bottom:36px;border-bottom:1px solid var(--line)}
.foot-brand{flex:1 1 300px;display:flex;flex-direction:column;gap:14px}
.foot-brand .brand{color:var(--fg)}
.foot-brand p{font-size:15px;line-height:1.6;max-width:34ch}
.foot-col{display:flex;flex-direction:column;gap:11px;min-width:150px}
.foot-col b{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--fg)}
/* footer links are real tap targets — keep them >=44px like the nav */
.foot-col a{font-family:var(--mono);font-size:12.5px;letter-spacing:.05em;
  display:inline-flex;align-items:center;min-height:44px;padding-block:2px}
.foot-col{gap:0}
.foot-bot{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;padding-top:26px;
  font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;color:var(--muted-2);text-transform:uppercase}
.credits{font-family:var(--mono);font-size:10.5px;color:var(--muted-2);margin-top:12px;
  line-height:1.8;text-transform:none;letter-spacing:0;width:100%}
.credits a{color:var(--muted-2);text-decoration:underline}

/* ---------- reveal ---------- */
.reveal{opacity:0;transform:translateY(14px);transition:opacity .55s var(--ease),transform .55s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal[data-d="1"]{transition-delay:.05s}
.reveal[data-d="2"]{transition-delay:.1s}
.reveal[data-d="3"]{transition-delay:.15s}
.reveal[data-d="4"]{transition-delay:.2s}
.reveal[data-d="5"]{transition-delay:.25s}

.hero .stack > *{animation:rise .6s var(--ease) both}
.hero .stack > *:nth-child(1){animation-delay:.04s}
.hero .stack > *:nth-child(2){animation-delay:.1s}
.hero .stack > *:nth-child(3){animation-delay:.16s}
.hero .stack > *:nth-child(4){animation-delay:.22s}
.hero .shot{animation:rise .7s var(--ease) .18s both}
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

/* ---------- responsive ---------- */
@media (max-width:1024px){
  :root{--gut:30px}
  .hero-grid{grid-template-columns:1fr;gap:38px;align-items:start}
  .hero .shot{max-width:520px}
  .qa > div{grid-template-columns:1fr;gap:10px}
  .row{grid-template-columns:42px minmax(0,1fr);gap:18px}
  .row p{grid-column:2}
  .founder{grid-template-columns:150px minmax(0,1fr);gap:28px}
}
@media (max-width:768px){
  :root{--gut:18px}
  body{font-size:16.5px}
  .site-head .wrap{min-height:64px;gap:12px}
  .nav{
    display:none;position:absolute;top:100%;left:0;right:0;background:var(--black);
    border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;
    gap:0;padding:4px var(--gut) 12px;
  }
  .nav[data-open="true"]{display:flex}
  .nav a{padding:15px 0;border-bottom:1px solid var(--line);font-size:13px}
  .nav a:last-child{border-bottom:none}
  .nav-toggle{display:flex;margin-left:auto}
  .head-cta{display:none}

  .hero{padding-block:44px 0}
  .hero h1{max-width:none}
  .pagehead{padding-block:42px 38px}
  .section{padding-block:54px}
  .section--tight{padding-block:40px}
  .cta{padding-block:58px}
  .section-head{margin-bottom:30px}

  .ticker{grid-template-columns:repeat(2,1fr);margin-top:38px}
  .ticker div{padding:16px 0 16px 16px}
  .ticker div:nth-child(3),.ticker div:nth-child(4){border-top:1px solid var(--line)}
  .ticker div:nth-child(odd){border-left:none;padding-left:0}

  .grid--2,.grid--3,.spec{grid-template-columns:1fr}
  .cell{padding:26px 20px}
  .founder{grid-template-columns:1fr;gap:20px}
  .founder .pic{max-width:150px}
  .blunt{padding-left:18px}
  .actions{width:100%}
  .actions .btn{flex:1 1 100%}
  .foot-top{gap:30px}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;animation-iteration-count:1 !important;
    transition-duration:.001ms !important;scroll-behavior:auto !important;
  }
  .reveal{opacity:1;transform:none}
}