:root{
  --c-deep:#0B1E2D;
  --c-abyss:#07141F;
  --c-night:#12324A;
  --c-slate:#6A8793;
  --c-cloud:#F4F7F9;
  --c-paper:#E9EEF1;
  --c-sand:#D9C9B0;
  --c-signal:#FF6A1A;
  --c-cyan:#7FD4D9;
  --c-mist:#93A9B5;

  --line:rgba(11,30,45,.14);
  --line-dark:rgba(127,212,217,.18);

  --font-sans:"Noto Sans SC","Source Han Sans SC","Microsoft YaHei","PingFang SC",sans-serif;
  --font-mono:"IBM Plex Mono","Roboto Mono",ui-monospace,"SFMono-Regular",monospace;

  --rail:92px;
  --rail-open:268px;
  --topbar:62px;
  --gut:clamp(1.05rem,3.4vw,2.75rem);
  --page-max:1320px;

  --ease:cubic-bezier(.22,.7,.28,1);
  --fast:160ms;
  --slow:260ms;

  --scroll:0;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}
body,h1,h2,h3,h4,h5,p,ul,ol,dl,dd,figure,blockquote,fieldset{margin:0}
ul,ol{padding:0}
img,svg,video{display:block;max-width:100%;height:auto}
button{font:inherit;color:inherit;background:none;border:0}
table{border-collapse:collapse}
a{color:inherit;text-decoration:none}
::selection{background:var(--c-signal);color:var(--c-abyss)}

html{background:var(--c-cloud)}
body{
  min-height:100vh;
  font-family:var(--font-sans);
  font-size:1.0625rem;
  line-height:1.75;
  color:var(--c-deep);
  background:var(--c-cloud);
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4,h5{
  font-family:var(--font-sans);
  font-weight:800;
  letter-spacing:-.015em;
  line-height:1.06;
  text-wrap:balance;
}
h1{font-size:clamp(2.75rem,8.4vw,7.5rem)}
h2{font-size:clamp(1.85rem,4.4vw,3.5rem)}
h3{font-size:clamp(1.15rem,2vw,1.75rem);line-height:1.24}
h4{font-size:1.05rem;line-height:1.4}

p{text-wrap:pretty}

:focus-visible{outline:2px solid var(--c-signal);outline-offset:3px;border-radius:2px}

/* ---------- utilities ---------- */
.container{
  width:100%;
  max-width:var(--page-max);
  margin-inline:auto;
  padding-inline:var(--gut);
}

.rule{
  height:1px;
  border:0;
  background:var(--line);
  margin-block:clamp(1.5rem,4vw,3rem);
}
.rule--dark{background:var(--line-dark)}

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  font-family:var(--font-mono);
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--c-slate);
}
.eyebrow::before{
  content:"";
  width:26px;height:2px;
  background:var(--c-signal);
  flex:none;
}

.tag{
  display:inline-block;
  font-family:var(--font-mono);
  font-size:.68rem;
  letter-spacing:.12em;
  padding:.22rem .55rem;
  background:var(--c-paper);
  color:var(--c-deep);
  border:1px solid var(--line);
  text-transform:uppercase;
  line-height:1.5;
}
.tag--sand{background:var(--c-sand);border-color:transparent}
.tag--dark{background:var(--c-night);color:var(--c-cloud);border-color:rgba(127,212,217,.3)}

.lead{
  font-size:clamp(1.05rem,1.6vw,1.25rem);
  line-height:1.72;
  color:var(--c-night);
  max-width:42ch;
}

.prose{max-width:44ch;color:var(--c-deep)}
.prose p{max-width:44ch;margin-block:0 1.1em}
.prose p:last-child{margin-bottom:0}
.prose h3{margin-block:1.8em .6em}
.prose ul,.prose ol{margin:0 0 1.1em 1.2em;padding-left:.8em}
.prose li{margin-block:.35em}
.prose a{
  color:var(--c-deep);
  text-decoration:underline;
  text-decoration-color:var(--c-signal);
  text-decoration-thickness:2px;
  text-underline-offset:3px;
}
.prose a:hover{color:var(--c-signal)}

.sheet{
  position:relative;
  background:var(--c-cloud);
  border:1px solid var(--line);
  padding:clamp(1.15rem,3vw,2rem);
  box-shadow:7px -7px 0 -1px var(--c-paper),7px -7px 0 0 var(--line);
}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  padding:.82rem 1.45rem;
  font-size:.94rem;
  font-weight:800;
  letter-spacing:.02em;
  line-height:1.3;
  border:1px solid transparent;
  border-radius:2px;
  cursor:pointer;
  transition:transform var(--fast) var(--ease),background var(--fast) var(--ease),border-color var(--fast) var(--ease),color var(--fast) var(--ease);
}
.btn:hover{transform:translateX(3px)}
.btn--signal{background:var(--c-signal);color:var(--c-abyss)}
.btn--signal:hover{background:#ff8347}
.btn--ghost{border-color:rgba(11,30,45,.28);color:var(--c-deep);background:transparent}
.btn--ghost:hover{border-color:var(--c-deep);background:rgba(11,30,45,.06)}
.btn--light{border-color:rgba(244,247,249,.34);color:var(--c-cloud);background:transparent}
.btn--light:hover{border-color:var(--c-cyan);color:var(--c-cyan);background:rgba(127,212,217,.08)}

/* ---------- breadcrumbs ---------- */
.crumbs{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.4rem;
  margin-block:1.5rem 0;
  font-family:var(--font-mono);
  font-size:.76rem;
  letter-spacing:.04em;
  color:var(--c-slate);
}
.crumbs a{border-bottom:1px solid transparent;transition:color var(--fast) var(--ease),border-color var(--fast) var(--ease)}
.crumbs a:hover{color:var(--c-deep);border-bottom-color:var(--c-signal)}
.crumbs__sep{opacity:.55}
.crumbs [aria-current="page"]{color:var(--c-deep);font-weight:700}

/* ---------- media containers ---------- */
.media{
  position:relative;
  overflow:hidden;
  background:var(--c-night);
  border:1px solid var(--line);
  border-radius:2px;
  isolation:isolate;
}
.media img{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
  filter:saturate(.94) contrast(1.04);
}
.media::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(200deg,transparent 55%,rgba(7,20,31,.55));
  pointer-events:none;
}
.media--16x9{aspect-ratio:16/9}
.media--4x5{aspect-ratio:4/5}
.media--1x1{aspect-ratio:1/1}
.media--band{aspect-ratio:21/9}
.media__tag{
  position:absolute;
  top:.75rem;left:.75rem;
  z-index:2;
  font-family:var(--font-mono);
  font-size:.66rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  padding:.22rem .5rem;
  background:var(--c-signal);
  color:var(--c-abyss);
  font-weight:700;
}
.media__caption{
  position:absolute;
  left:.75rem;right:.75rem;bottom:.7rem;
  z-index:2;
  font-family:var(--font-mono);
  font-size:.7rem;
  letter-spacing:.04em;
  color:rgba(244,247,249,.88);
  line-height:1.5;
}

/* ---------- reveal ---------- */
html.js [data-reveal]{
  opacity:0;
  transform:translateY(16px);
  transition:opacity 420ms var(--ease),transform 420ms var(--ease);
}
html.js [data-reveal].is-revealed{opacity:1;transform:none}

/* =========================================================
   HEADER
   ========================================================= */
.skip-link{
  position:fixed;
  top:.5rem;left:.5rem;
  z-index:400;
  transform:translateY(-160%);
  background:var(--c-signal);
  color:var(--c-abyss);
  font-weight:800;
  font-size:.88rem;
  padding:.65rem 1.1rem;
  border-radius:2px;
  transition:transform var(--fast) var(--ease);
}
.skip-link:focus-visible{transform:translateY(0)}

.site-header{
  position:sticky;
  top:0;
  z-index:100;
  background:var(--c-abyss);
  color:var(--c-cloud);
  border-bottom:1px solid var(--line-dark);
}

.rail{
  position:relative;
  display:flex;
  flex-direction:column;
  width:100%;
}

.rail__top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  min-height:var(--topbar);
  padding:.5rem var(--gut) .5rem calc(var(--gut) * .85);
}

/* brand */
.brand{
  display:flex;
  align-items:center;
  gap:.7rem;
  min-width:0;
  color:var(--c-cloud);
}
.brand__mark{
  position:relative;
  flex:none;
  width:30px;height:30px;
  border:1.5px solid var(--c-signal);
  background:rgba(255,106,26,.08);
}
.brand__mark::before{
  content:"";
  position:absolute;
  left:7px;top:5px;bottom:5px;
  width:2px;
  background:var(--c-signal);
}
.brand__mark::after{
  content:"";
  position:absolute;
  left:13px;top:5px;bottom:5px;
  width:1px;
  background:var(--c-cyan);
  opacity:.55;
}
.brand__text{
  display:flex;
  flex-direction:column;
  min-width:0;
  line-height:1.15;
}
.brand__name{
  font-size:1rem;
  font-weight:800;
  letter-spacing:.02em;
  white-space:nowrap;
}
.brand__line{
  font-family:var(--font-mono);
  font-size:.62rem;
  letter-spacing:.22em;
  color:var(--c-slate);
  white-space:nowrap;
}

/* toggle */
.rail__toggle{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  flex:none;
  padding:.48rem .7rem;
  border:1px solid rgba(147,169,181,.45);
  border-radius:2px;
  color:var(--c-cloud);
  font-size:.76rem;
  font-weight:700;
  letter-spacing:.16em;
  cursor:pointer;
  transition:border-color var(--fast) var(--ease),background var(--fast) var(--ease);
}
.rail__toggle:hover{border-color:var(--c-cyan);background:rgba(127,212,217,.1)}
.rail__bars{display:flex;flex-direction:column;gap:4px;width:16px}
.rail__bars span{display:block;height:2px;background:var(--c-signal);transition:transform var(--slow) var(--ease),opacity var(--fast) var(--ease)}
.site-header[data-open="true"] .rail__bars span:first-child{transform:translateY(3px) rotate(45deg)}
.site-header[data-open="true"] .rail__bars span:last-child{transform:translateY(-3px) rotate(-45deg)}

/* progress */
.rail__progress{
  position:absolute;
  left:0;
  bottom:-1px;
  height:2px;
  width:calc(var(--scroll) * 100%);
  background:linear-gradient(90deg,var(--c-signal),var(--c-cyan));
  pointer-events:none;
  z-index:2;
}

/* nav – mobile drawer */
.nav{
  position:fixed;
  top:var(--topbar);
  left:0;
  bottom:0;
  z-index:3;
  display:flex;
  flex-direction:column;
  width:min(86vw,330px);
  padding:1rem .85rem 1.6rem;
  background:linear-gradient(180deg,var(--c-abyss),var(--c-deep) 70%);
  border-right:1px solid var(--line-dark);
  overflow-y:auto;
  overscroll-behavior:contain;
  transform:translateX(-102%);
  visibility:hidden;
  box-shadow:0 0 0 0 rgba(7,20,31,0);
  transition:transform var(--slow) var(--ease),box-shadow var(--slow) var(--ease),visibility 0s linear var(--slow);
}
.site-header[data-open="true"] .nav{
  transform:translateX(0);
  visibility:visible;
  box-shadow:0 0 0 100vmax rgba(7,20,31,.6);
  transition:transform var(--slow) var(--ease),box-shadow var(--slow) var(--ease),visibility 0s;
}

.nav__list{
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:.1rem;
  margin:0;
}
.nav__item{position:relative}

.nav__link{
  position:relative;
  display:flex;
  align-items:center;
  gap:.65rem;
  padding:.64rem .7rem;
  font-size:.95rem;
  font-weight:600;
  line-height:1.35;
  color:rgba(244,247,249,.8);
  border-radius:2px;
  white-space:nowrap;
  transition:background var(--fast) var(--ease),color var(--fast) var(--ease);
}
.nav__link::before{
  content:"";
  position:absolute;
  left:0;top:.45rem;bottom:.45rem;
  width:2px;
  background:transparent;
  transition:background var(--fast) var(--ease);
}
.nav__link:hover,.nav__link:focus-visible{
  background:var(--c-night);
  color:var(--c-cloud);
}
.nav__link:hover::before{background:var(--c-cyan)}

.nav__num{
  flex:none;
  width:1.6rem;
  font-family:var(--font-mono);
  font-size:.68rem;
  letter-spacing:.06em;
  color:var(--c-slate);
  transition:transform var(--slow) var(--ease),color var(--fast) var(--ease);
}
.nav__label{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  transition:opacity var(--slow) var(--ease);
}
.nav__arrow{
  margin-left:auto;
  flex:none;
  font-family:var(--font-mono);
  font-size:.9rem;
  color:var(--c-signal);
  opacity:0;
  transform:translateX(-5px);
  transition:opacity var(--slow) var(--ease),transform var(--slow) var(--ease);
}

.nav__item--key .nav__link{
  background:linear-gradient(90deg,rgba(255,106,26,.16),rgba(255,106,26,0) 72%);
  color:var(--c-cloud);
}
.nav__item--key .nav__link::before{background:var(--c-signal)}
.nav__item--key .nav__num{
  color:var(--c-signal);
  font-size:.86rem;
  font-weight:700;
}
.nav__item--key .nav__arrow{opacity:1;transform:translateX(0)}
.nav__item--key .nav__link:hover .nav__num,
.nav__item--key .nav__link:hover .nav__arrow,
.nav__item--key .nav__link:focus-visible .nav__num,
.nav__item--key .nav__link:focus-visible .nav__arrow{transform:translateX(5px)}

.nav__link[aria-current="page"]{
  background:var(--c-night);
  color:var(--c-cloud);
}
.nav__link[aria-current="page"]::before{background:var(--c-signal)}
.nav__link[aria-current="page"] .nav__num{color:var(--c-signal)}
.nav__link[aria-current="page"] .nav__arrow{opacity:1;transform:translateX(0)}

.nav__foot{
  margin-top:auto;
  padding-top:1.4rem;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:.4rem;
  border-top:1px solid var(--line-dark);
  margin-block-start:1.6rem;
}
.nav__util{
  font-size:.8rem;
  font-weight:600;
  letter-spacing:.06em;
  color:var(--c-slate);
  padding:.28rem .7rem;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  transition:color var(--fast) var(--ease);
}
.nav__util:hover{color:var(--c-cyan)}
.nav__cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.45rem;
  margin-top:.5rem;
  padding:.68rem .8rem;
  background:var(--c-signal);
  color:var(--c-abyss);
  font-size:.82rem;
  font-weight:800;
  letter-spacing:.02em;
  border-radius:2px;
  white-space:nowrap;
  overflow:hidden;
  transition:background var(--fast) var(--ease);
}
.nav__cta:hover{background:#ff8347}
.nav__cta-arrow{font-family:var(--font-mono)}
.nav__sign{
  margin-top:.7rem;
  padding-inline:.7rem;
  font-family:var(--font-mono);
  font-size:.62rem;
  letter-spacing:.24em;
  color:rgba(106,135,147,.85);
  white-space:nowrap;
  overflow:hidden;
}

/* =========================================================
   FOOTER
   ========================================================= */
.site-footer{
  position:relative;
  margin-top:clamp(3rem,7vw,6.5rem);
  background:var(--c-abyss);
  color:var(--c-cloud);
  border-top:2px solid var(--c-signal);
  overflow:hidden;
}
.site-footer::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:repeating-linear-gradient(to bottom,rgba(127,212,217,.055) 0 1px,transparent 1px 88px);
  pointer-events:none;
}
.site-footer::after{
  content:"";
  position:absolute;
  top:0;right:0;
  width:min(42vw,420px);
  height:100%;
  background:linear-gradient(205deg,rgba(255,106,26,.1),rgba(255,106,26,0) 62%);
  pointer-events:none;
}

.footer__inner{
  position:relative;
  z-index:1;
  max-width:var(--page-max);
  margin-inline:auto;
  padding:clamp(2rem,5vw,3.6rem) var(--gut) 1.6rem;
}

.footer__lead{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:.9rem 1.6rem;
  padding-bottom:1.35rem;
  border-bottom:1px solid var(--line-dark);
}
.footer__wordmark{
  font-size:clamp(1.05rem,2.4vw,1.55rem);
  font-weight:800;
  letter-spacing:-.01em;
  color:var(--c-cloud);
}
.footer__stamp{
  font-family:var(--font-mono);
  font-size:.66rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--c-cyan);
  border:1px solid rgba(127,212,217,.35);
  padding:.28rem .65rem;
  white-space:nowrap;
}

.footer__grid{
  display:grid;
  grid-template-columns:1fr;
  gap:2rem 1.6rem;
  margin-top:2.2rem;
}
.footer__title{
  font-family:var(--font-mono);
  font-size:.68rem;
  font-weight:600;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--c-slate);
  margin-bottom:.9rem;
}
.footer__links{
  list-style:none;
  display:grid;
  gap:.55rem;
}
.footer__link{
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  font-size:.94rem;
  color:rgba(244,247,249,.8);
  transition:color var(--fast) var(--ease);
}
.footer__link::before{
  content:"→";
  font-family:var(--font-mono);
  font-size:.82em;
  color:var(--c-signal);
  opacity:.7;
  transition:transform var(--fast) var(--ease),opacity var(--fast) var(--ease);
}
.footer__link:hover{color:var(--c-cloud)}
.footer__link:hover::before{transform:translateX(3px);opacity:1}

.footer__meta{
  list-style:none;
  display:grid;
  gap:.52rem;
  font-size:.84rem;
  line-height:1.62;
}
.footer__meta li{
  display:grid;
  grid-template-columns:3.1rem 1fr;
  gap:.55rem;
  align-items:start;
}
.footer__meta-k{
  font-family:var(--font-mono);
  font-size:.64rem;
  letter-spacing:.12em;
  color:var(--c-slate);
  padding-top:.22rem;
  text-transform:uppercase;
}
.footer__meta-v{
  color:rgba(244,247,249,.86);
  overflow-wrap:anywhere;
  word-break:break-word;
}

.footer__base{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:.55rem 1.6rem;
  margin-top:2.4rem;
  padding-top:1.15rem;
  border-top:1px solid var(--line-dark);
  font-family:var(--font-mono);
  font-size:.72rem;
  letter-spacing:.06em;
  color:var(--c-slate);
}
.footer__icp{color:var(--c-sand)}
.footer__copy{color:rgba(244,247,249,.72)}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (min-width:600px){
  .footer__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (min-width:1024px){
  body{padding-inline-start:var(--rail);transition:padding-inline-start var(--slow) var(--ease)}

  .site-header{
    position:fixed;
    inset:0 auto 0 0;
    width:var(--rail);
    height:100%;
    border-bottom:0;
    border-right:1px solid var(--line-dark);
    background:linear-gradient(180deg,var(--c-abyss) 0%,var(--c-deep) 52%,var(--c-abyss) 100%);
    box-shadow:18px 0 40px -32px rgba(7,20,31,.9);
    overflow:hidden;
    transition:width var(--slow) var(--ease),box-shadow var(--slow) var(--ease);
  }
  .site-header::before{
    content:"";
    position:absolute;
    inset:0;
    background:radial-gradient(130% 38% at 50% 0%,rgba(127,212,217,.13),transparent 72%);
    pointer-events:none;
  }
  .site-header:hover,
  .site-header:focus-within,
  .site-header[data-expanded="true"]{
    width:var(--rail-open);
    box-shadow:26px 0 60px -34px rgba(7,20,31,1);
  }

  .rail{
    height:100%;
    padding:1.1rem .55rem 1.4rem;
    overflow-y:auto;
    overflow-x:hidden;
    scrollbar-width:thin;
  }

  .rail__top{
    flex-direction:column;
    align-items:stretch;
    gap:.9rem;
    padding:0 0 1rem;
    min-height:0;
    border-bottom:1px solid var(--line-dark);
  }
  .brand{padding-inline:.35rem}
  .brand__text{
    max-width:0;
    opacity:0;
    overflow:hidden;
    white-space:nowrap;
    transition:max-width var(--slow) var(--ease),opacity var(--slow) var(--ease);
  }
  .site-header:hover .brand__text,
  .site-header:focus-within .brand__text,
  .site-header[data-expanded="true"] .brand__text{max-width:190px;opacity:1}

  .rail__toggle{
    align-self:flex-start;
    padding:.5rem .55rem;
  }
  .rail__toggle-text{
    max-width:0;
    opacity:0;
    overflow:hidden;
    white-space:nowrap;
    transition:max-width var(--slow) var(--ease),opacity var(--slow) var(--ease);
  }
  .site-header:hover .rail__toggle-text,
  .site-header:focus-within .rail__toggle-text,
  .site-header[data-expanded="true"] .rail__toggle-text{max-width:80px;opacity:1}

  .rail__progress{
    top:0;
    left:0;
    bottom:auto;
    width:2px;
    height:calc(var(--scroll) * 100%);
    background:linear-gradient(180deg,var(--c-signal),var(--c-cyan));
    transition:height 80ms linear;
  }

  .nav{
    position:static;
    transform:none;
    visibility:visible;
    box-shadow:none;
    width:auto;
    flex:1 1 auto;
    min-height:0;
    padding:1rem 0 0;
    background:none;
    border:0;
    overflow:visible;
  }

  .nav__link{
    padding:.62rem .55rem;
    font-size:.9rem;
    gap:.5rem;
  }
  .nav__num{width:1.55rem}
  .nav__label{
    max-width:0;
    opacity:0;
    transition:max-width var(--slow) var(--ease),opacity var(--slow) var(--ease);
  }
  .nav__arrow{
    opacity:0;
    transform:translateX(-6px);
  }
  .site-header:hover .nav__label,
  .site-header:focus-within .nav__label,
  .site-header[data-expanded="true"] .nav__label{max-width:190px;opacity:1}
  .site-header:hover .nav__arrow,
  .site-header:focus-within .nav__arrow,
  .site-header[data-expanded="true"] .nav__arrow{opacity:1;transform:translateX(0)}

  .nav__foot{
    border-top:1px solid var(--line-dark);
    padding-top:1rem;
    gap:.35rem;
  }
  .nav__util{
    padding:.26rem .55rem;
    font-size:.72rem;
    max-width:0;
    opacity:0;
    transition:max-width var(--slow) var(--ease),opacity var(--slow) var(--ease),color var(--fast) var(--ease);
  }
  .site-header:hover .nav__util,
  .site-header:focus-within .nav__util,
  .site-header[data-expanded="true"] .nav__util{max-width:190px;opacity:1}

  .nav__cta{
    align-self:flex-start;
    padding:.6rem .55rem;
    min-height:42px;
  }
  .nav__cta-text{
    max-width:0;
    opacity:0;
    overflow:hidden;
    transition:max-width var(--slow) var(--ease),opacity var(--slow) var(--ease);
  }
  .site-header:hover .nav__cta-text,
  .site-header:focus-within .nav__cta-text,
  .site-header[data-expanded="true"] .nav__cta-text{max-width:170px;opacity:1}

  .nav__sign{
    max-width:0;
    opacity:0;
    transition:max-width var(--slow) var(--ease),opacity var(--slow) var(--ease);
  }
  .site-header:hover .nav__sign,
  .site-header:focus-within .nav__sign,
  .site-header[data-expanded="true"] .nav__sign{max-width:190px;opacity:1}

  .footer__grid{grid-template-columns:1.05fr .95fr .95fr 1.5fr;gap:2.4rem 1.8rem}
}

@media (min-width:1280px){
  :root{--rail:100px;--rail-open:276px}
}

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