/* ============================================================
   天博克罗地亚 — /assets/site.css
   共享外壳：88px 侧轨导航 + 红白棋盘格锚点 + 夜场记分牌
   ============================================================ */

:root{
  /* 品牌色板 */
  --navy:#0B1B33;
  --navy-2:#14294A;
  --navy-3:#1B3358;
  --cream:#F4EFE4;
  --stone:#8A8C86;
  --moss:#5E6B4A;
  --coral:#E23A2E;
  --coral-deep:#C92E24;
  --white:#FFFFFF;
  --cyan:#1FE0C8;
  --gold:#F5B72B;
  --clay:#C4694A;

  /* 线与面 */
  --ink:#0B1B33;
  --hair:rgba(138,140,134,.34);
  --line:1px solid var(--hair);
  --line-soft:1px solid rgba(138,140,134,.2);
  --line-strong:1px solid rgba(138,140,134,.62);
  --wa-line:1px solid rgba(11,27,51,.16);

  /* 尺寸 */
  --rail-w:88px;
  --bar-h:66px;
  --gap:24px;
  --gutter:clamp(16px,4vw,40px);
  --maxw:1240px;

  /* 字体 */
  --font-sans:"Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,-apple-system,sans-serif;
  --font-display:"Archivo Black","Noto Sans SC","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  --font-num:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,"Courier New",monospace;

  /* 母题 */
  --checker:repeating-conic-gradient(var(--coral) 0 25%, var(--white) 0 50%);
  --ease:cubic-bezier(.22,.7,.3,1);
}

/* ---------- reset ---------- */
*,
*::before,
*::after{ box-sizing:border-box; }

html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  overflow-x:hidden;
}

html.is-nav-open{ overflow:hidden; }

body{
  margin:0;
  min-height:100dvh;
  display:flex;
  flex-direction:column;
  font-family:var(--font-sans);
  font-size:16px;
  font-weight:400;
  line-height:1.65;
  color:var(--cream);
  background:var(--navy);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

main{ flex:1 0 auto; }

img,
svg,
video{ display:block; max-width:100%; height:auto; }

button{ font:inherit; color:inherit; }

a{ color:var(--cyan); text-decoration-thickness:1px; text-underline-offset:3px; }

ul,
ol,
dl{ margin:0; padding:0; }

h1,
h2,
h3,
h4,
h5,
h6{
  margin:0 0 .5em;
  font-family:var(--font-display);
  font-weight:900;
  letter-spacing:-.04em;
  line-height:1.02;
  text-wrap:balance;
}

h1{ font-size:clamp(32px,6vw,64px); }
h2{ font-size:clamp(26px,4vw,40px); }
h3{ font-size:clamp(20px,2.4vw,26px); line-height:1.14; }
h4{ font-size:clamp(16px,1.6vw,18px); line-height:1.2; letter-spacing:-.02em; }

p{ margin:0 0 1.2em; }
p:last-child{ margin-bottom:0; }

strong{ font-weight:800; }

hr{
  border:0;
  border-top:var(--line);
  margin:clamp(24px,4vw,44px) 0;
}

::selection{ background:var(--coral); color:var(--white); }

:focus-visible{
  outline:2px solid var(--cyan);
  outline-offset:3px;
}

/* ---------- skip link ---------- */
.skip-link{
  position:fixed;
  top:-100px;
  left:12px;
  z-index:400;
  display:inline-block;
  padding:10px 18px;
  background:var(--cyan);
  color:var(--navy);
  font-family:var(--font-num);
  font-size:12px;
  font-weight:600;
  letter-spacing:.14em;
  text-decoration:none;
  border:0;
  transition:top .18s var(--ease);
}
.skip-link:focus,
.skip-link:focus-visible{
  top:12px;
  outline:2px solid var(--cream);
  outline-offset:2px;
}

/* ============================================================
   HEADER
   ============================================================ */
.site-header{
  position:relative;
  z-index:70;
  background:var(--navy);
}

/* ---------- 品牌标记：纯 CSS 棋盘格切片 ---------- */
.brand-mark{
  display:block;
  flex:none;
  width:28px;
  height:28px;
  background-image:conic-gradient(
    var(--coral) 0 25%,
    var(--white) 0 50%,
    var(--coral) 0 75%,
    var(--white) 0
  );
  box-shadow:0 0 0 1px rgba(255,255,255,.22);
}

/* ---------- 移动端顶栏 ---------- */
.mobile-bar{
  position:sticky;
  top:0;
  z-index:75;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  height:var(--bar-h);
  padding:0 14px;
  background:var(--navy);
  border-bottom:1px solid rgba(138,140,134,.32);
}

.mobile-bar::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:6px;
  background-image:var(--checker);
  background-size:12px 12px;
  opacity:.95;
}

.brand{
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-width:0;
  color:var(--cream);
  text-decoration:none;
}

.brand-text{
  display:flex;
  flex-direction:column;
  min-width:0;
  line-height:1.1;
}

.brand-name{
  font-family:var(--font-display);
  font-size:15px;
  font-weight:900;
  letter-spacing:-.02em;
  color:var(--cream);
  white-space:nowrap;
}

.brand-sub{
  margin-top:3px;
  font-family:var(--font-num);
  font-size:9px;
  letter-spacing:.2em;
  color:var(--stone);
  white-space:nowrap;
}

/* ---------- 抽屉按钮 ---------- */
.nav-toggle{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:9px 13px;
  background:transparent;
  color:var(--cream);
  border:1px solid rgba(244,239,228,.36);
  border-radius:0;
  font-size:13px;
  font-weight:800;
  letter-spacing:.06em;
  cursor:pointer;
  transition:border-color .16s var(--ease), color .16s var(--ease);
}
.nav-toggle:hover{ color:var(--cyan); border-color:rgba(31,224,200,.6); }

.nav-toggle-bars{
  display:grid;
  gap:3px;
  width:16px;
}
.nav-toggle-bars span{
  display:block;
  height:2px;
  width:100%;
  background:var(--cyan);
  transform-origin:center;
  transition:transform .2s var(--ease), opacity .2s var(--ease);
}
.nav-toggle-bars span:nth-child(2){ width:70%; }

.site-header[data-open="true"] .nav-toggle-bars span:nth-child(1){ transform:translateY(5px) rotate(45deg); }
.site-header[data-open="true"] .nav-toggle-bars span:nth-child(2){ opacity:0; }
.site-header[data-open="true"] .nav-toggle-bars span:nth-child(3){ transform:translateY(-5px) rotate(-45deg); }

/* ---------- 侧轨 / 抽屉 ---------- */
.site-rail{
  position:fixed;
  top:var(--bar-h);
  left:0;
  right:0;
  max-height:calc(100dvh - var(--bar-h));
  overflow-y:auto;
  z-index:65;
  display:flex;
  flex-direction:column;
  gap:16px;
  padding:16px 16px 28px;
  background:var(--navy);
  border-bottom:1px solid rgba(138,140,134,.4);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-10px);
  transition:opacity .22s var(--ease), transform .22s var(--ease), visibility .22s;
}

.site-header[data-open="true"] .site-rail{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:none;
}

.rail-brand{ display:none; }

.rail-brand-text{
  font-family:var(--font-display);
  font-size:12px;
  font-weight:900;
  letter-spacing:.18em;
  writing-mode:vertical-rl;
  text-orientation:upright;
  color:var(--cream);
}

/* ---------- 导航列表 ---------- */
.nav-list{
  list-style:none;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}

.nav-item{ min-width:0; }

.nav-item a{
  display:flex;
  align-items:center;
  gap:10px;
  padding:13px 12px;
  color:rgba(244,239,228,.86);
  text-decoration:none;
  border:1px solid rgba(138,140,134,.28);
  font-size:14px;
  font-weight:700;
  letter-spacing:.02em;
  transition:color .16s var(--ease), border-color .16s var(--ease), background-color .16s var(--ease);
}

.nav-num{
  font-family:var(--font-num);
  font-size:10px;
  font-weight:600;
  letter-spacing:.14em;
  color:var(--stone);
  transition:color .16s var(--ease);
}

.nav-label{ white-space:nowrap; }

.nav-item a:hover{
  color:var(--cyan);
  border-color:rgba(31,224,200,.5);
}
.nav-item a:hover .nav-num{ color:var(--cyan); }

.nav-item a[aria-current="page"]{
  color:var(--white);
  background:var(--navy-2);
  border-color:rgba(138,140,134,.42);
  box-shadow:inset 3px 0 0 var(--coral);
}
.nav-item a[aria-current="page"] .nav-num{ color:var(--gold); }

/* ---------- 侧轨底部 ---------- */
.rail-foot{
  margin-top:auto;
  padding-top:16px;
  border-top:1px solid rgba(138,140,134,.24);
}

.rail-cta{
  display:block;
  padding:13px 12px;
  background:var(--coral);
  color:var(--white);
  text-decoration:none;
  font-size:14px;
  font-weight:800;
  line-height:1.25;
  letter-spacing:.02em;
  border:1px solid var(--coral);
  transition:background-color .16s var(--ease), color .16s var(--ease);
}
.rail-cta:hover{ background:var(--coral-deep); color:var(--white); }

.rail-cta-sub{
  display:block;
  margin-top:5px;
  font-size:11px;
  font-weight:500;
  letter-spacing:.06em;
  opacity:.9;
}

.utility-links{
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  gap:10px 18px;
  margin-top:14px;
}
.utility-links a{
  font-family:var(--font-num);
  font-size:11px;
  letter-spacing:.1em;
  color:rgba(244,239,228,.62);
  text-decoration:none;
  border-bottom:1px solid transparent;
  transition:color .16s var(--ease), border-color .16s var(--ease);
}
.utility-links a:hover{
  color:var(--cyan);
  border-bottom-color:currentColor;
}

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer{
  flex:0 0 auto;
  margin-top:auto;
  background:var(--navy);
  border-top:var(--line);
  color:var(--cream);
}

.footer-checker{
  height:10px;
  background-image:var(--checker);
  background-size:20px 20px;
  opacity:.92;
}

.footer-inner{
  display:grid;
  gap:32px;
  width:100%;
  max-width:var(--maxw);
  margin-inline:auto;
  padding:clamp(28px,5vw,56px) var(--gutter);
}

.footer-lead{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:14px;
}

.footer-brand{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:var(--cream);
  text-decoration:none;
}
.footer-brand .brand-mark{ width:24px; height:24px; }

.footer-brand-name{
  font-family:var(--font-display);
  font-size:16px;
  font-weight:900;
  letter-spacing:-.02em;
}

.footer-tagline{
  margin:0;
  max-width:12em;
  font-family:var(--font-display);
  font-size:clamp(20px,2.6vw,28px);
  font-weight:900;
  line-height:1.14;
  letter-spacing:-.035em;
  color:var(--cream);
}

.footer-cta{ margin-top:2px; }

.footer-cols{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(128px,1fr));
  gap:26px;
}

.footer-col-title{
  margin:0 0 12px;
  font-family:var(--font-num);
  font-size:11px;
  font-weight:600;
  line-height:1.4;
  letter-spacing:.26em;
  text-transform:uppercase;
  color:var(--stone);
}

.footer-links{
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:9px;
}

.footer-links a{
  display:inline-block;
  font-size:14px;
  color:rgba(244,239,228,.78);
  text-decoration:none;
  border-bottom:1px solid transparent;
  transition:color .16s var(--ease), border-color .16s var(--ease);
}
.footer-links a:hover{
  color:var(--cyan);
  border-bottom-color:currentColor;
}

.footer-contact{ min-width:0; }

.footer-contact-list{
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:11px;
  font-size:14px;
}

.footer-contact-list li{
  display:grid;
  gap:2px;
}

.footer-contact-label{
  font-family:var(--font-num);
  font-size:10px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--stone);
}

.footer-contact-value{
  color:rgba(244,239,228,.86);
  word-break:break-word;
}

.footer-contact-note{
  margin:16px 0 0;
  font-size:12px;
  line-height:1.6;
  color:rgba(244,239,228,.56);
  max-width:32em;
}

.footer-base{
  border-top:var(--line-soft);
}

.footer-base-inner{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:8px 24px;
  width:100%;
  max-width:var(--maxw);
  margin-inline:auto;
  padding:16px var(--gutter);
  font-size:12px;
  color:rgba(244,239,228,.6);
}
.footer-base-inner p{ margin:0; }

.footer-copy{ letter-spacing:.04em; }

.footer-legal{
  font-family:var(--font-num);
  letter-spacing:.08em;
}

/* ============================================================
   通用组件
   ============================================================ */
.container{
  width:100%;
  max-width:var(--maxw);
  margin-inline:auto;
  padding-inline:var(--gutter);
}

.section{
  padding-block:clamp(36px,6vw,84px);
  border-top:var(--line);
}
.section--flush{ border-top:0; }

.surface-cream{
  background:var(--cream);
  color:var(--ink);
}
.surface-cream h1,
.surface-cream h2,
.surface-cream h3{ color:var(--ink); }
.surface-cream a{ color:var(--coral-deep); }
.surface-cream .eyebrow{ color:var(--coral-deep); }
.surface-cream .annotation{ color:var(--moss); }
.surface-cream hr{ border-top:var(--wa-line); }

.grid-12{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--gap);
}

.g-3,
.g-4,
.g-6,
.g-8,
.g-12{ grid-column:span 2; }

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-family:var(--font-num);
  font-size:11px;
  font-weight:600;
  letter-spacing:.28em;
  text-transform:uppercase;
  color:var(--cyan);
}
.eyebrow::before{
  content:"";
  width:18px;
  height:1px;
  background:currentColor;
  flex:none;
}

.annotation{
  display:inline-block;
  font-family:var(--font-num);
  font-size:11px;
  font-weight:600;
  letter-spacing:.3em;
  text-transform:uppercase;
  color:var(--stone);
}

.annotation--vertical{
  writing-mode:vertical-rl;
  text-orientation:upright;
  letter-spacing:.34em;
}

.stat-num{
  display:block;
  font-family:var(--font-num);
  font-size:clamp(64px,12vw,168px);
  font-weight:600;
  font-variant-numeric:tabular-nums;
  line-height:.82;
  letter-spacing:-.05em;
  color:var(--gold);
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:13px 22px;
  border:1px solid transparent;
  border-radius:0;
  font-family:var(--font-sans);
  font-size:14px;
  font-weight:800;
  letter-spacing:.02em;
  line-height:1.2;
  text-decoration:none;
  cursor:pointer;
  transition:background-color .18s var(--ease), color .18s var(--ease), border-color .18s var(--ease);
}

.btn--coral{
  background:var(--coral);
  color:var(--white);
  border-color:var(--coral);
}
.btn--coral:hover{
  background:var(--coral-deep);
  border-color:var(--coral-deep);
  color:var(--white);
}

.btn--ghost{
  background:transparent;
  color:var(--cream);
  border-color:rgba(244,239,228,.42);
}
.btn--ghost:hover{
  color:var(--cyan);
  border-color:var(--cyan);
}

.btn--cyan{
  background:var(--cyan);
  color:var(--navy);
  border-color:var(--cyan);
}
.btn--cyan:hover{
  background:var(--white);
  border-color:var(--white);
  color:var(--navy);
}

.card{
  position:relative;
  padding:clamp(16px,2.4vw,24px);
  background:var(--navy-2);
  border:var(--line);
  transition:border-color .16s var(--ease);
}
.card:hover{ border-color:var(--cyan); }

.tag{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 9px;
  font-family:var(--font-num);
  font-size:11px;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  line-height:1.4;
  border:1px solid currentColor;
  color:rgba(244,239,228,.72);
}
.tag--moss{ color:var(--moss); }
.tag--coral{ color:var(--coral); }
.tag--cyan{ color:var(--cyan); }
.tag--gold{ color:var(--gold); }

.breadcrumbs{
  padding-block:14px;
  font-family:var(--font-num);
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:rgba(244,239,228,.6);
}
.breadcrumbs ol{
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
}
.breadcrumbs li{
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.breadcrumbs li + li::before{
  content:"/";
  color:var(--stone);
}
.breadcrumbs a{
  color:inherit;
  text-decoration:none;
  border-bottom:1px solid transparent;
  transition:color .16s var(--ease), border-color .16s var(--ease);
}
.breadcrumbs a:hover{
  color:var(--cyan);
  border-bottom-color:currentColor;
}
.breadcrumbs [aria-current="page"]{ color:var(--cream); }

.surface-cream .breadcrumbs{ color:rgba(11,27,51,.62); }
.surface-cream .breadcrumbs [aria-current="page"]{ color:var(--ink); }

.prose{ max-width:68ch; }
.prose p{ max-width:38em; }
.prose h2,
.prose h3{ margin-top:1.6em; }
.prose ul,
.prose ol{
  margin:0 0 1.2em;
  padding-inline-start:1.2em;
}
.prose li{ margin-bottom:.4em; }
.prose a{ text-decoration:underline; }

/* ---------- 图片容器基础规则 ---------- */
.media-frame{
  position:relative;
  display:block;
  overflow:hidden;
  width:100%;
  aspect-ratio:16 / 10;
  background:var(--navy-2);
  border:var(--line);
}
.media-frame img,
.media-frame video{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.media-frame--wide{ aspect-ratio:21 / 9; }
.media-frame--tall{ aspect-ratio:3 / 4; }
.media-frame--square{ aspect-ratio:1 / 1; }

.media-frame--checker{
  background-color:var(--navy-2);
}
.media-frame--checker::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:var(--checker);
  background-size:24px 24px;
  opacity:.16;
  pointer-events:none;
}

.media-frame figcaption{
  position:absolute;
  left:0;
  bottom:0;
  right:0;
  padding:10px 12px;
  font-family:var(--font-num);
  font-size:10px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--cream);
  background:linear-gradient(to top, rgba(11,27,51,.86), rgba(11,27,51,0));
}

/* ---------- 分段标签页 ---------- */
.segmented{
  border:var(--line);
  background:rgba(20,41,74,.4);
}

.segmented-tabs{
  display:flex;
  flex-wrap:wrap;
  border-bottom:var(--line);
}

.segmented-tab{
  flex:1 1 auto;
  padding:12px 18px;
  background:transparent;
  border:0;
  border-right:1px solid rgba(138,140,134,.22);
  color:rgba(244,239,228,.68);
  font-family:var(--font-num);
  font-size:12px;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  cursor:pointer;
  transition:background-color .16s var(--ease), color .16s var(--ease);
}
.segmented-tab:last-child{ border-right:0; }
.segmented-tab:hover{ color:var(--cyan); }
.segmented-tab[aria-selected="true"]{
  background:var(--coral);
  color:var(--white);
}

.segmented-panel{
  padding:clamp(16px,2.6vw,28px);
}
.segmented-panel[hidden]{ display:none; }

/* ---------- 滚动进度（JS 注入） ---------- */
.scroll-meter{
  position:fixed;
  top:0;
  left:0;
  right:0;
  height:3px;
  z-index:130;
  background:rgba(138,140,134,.16);
  pointer-events:none;
}
.scroll-meter__bar{
  height:100%;
  width:0;
  background:linear-gradient(90deg, var(--coral) 0%, var(--gold) 55%, var(--cyan) 100%);
  transition:width .1s linear;
}

/* ============================================================
   响应式
   ============================================================ */
@media (min-width:768px){
  .grid-12{ grid-template-columns:repeat(12,minmax(0,1fr)); }
  .g-3{ grid-column:span 3; }
  .g-4{ grid-column:span 4; }
  .g-6{ grid-column:span 6; }
  .g-8{ grid-column:span 8; }
  .g-12{ grid-column:span 12; }

  .footer-inner{
    grid-template-columns:minmax(200px,260px) minmax(0,1fr);
    gap:36px 40px;
  }
  .footer-contact{ grid-column:1 / -1; }
}

@media (min-width:900px){
  .footer-inner{
    grid-template-columns:minmax(200px,240px) minmax(0,1fr) minmax(210px,260px);
    align-items:start;
    gap:40px;
  }
  .footer-contact{ grid-column:auto; }
}

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

  .mobile-bar{ display:none; }

  .site-rail{
    position:fixed;
    top:0;
    left:0;
    right:auto;
    width:var(--rail-w);
    height:100dvh;
    max-height:none;
    padding:14px 8px 18px;
    gap:0;
    border-bottom:0;
    border-right:var(--line);
    overflow-y:auto;
    z-index:80;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:none;
  }

  .rail-brand{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:12px;
    padding:6px 0 16px;
    color:var(--cream);
    text-decoration:none;
    border-bottom:1px solid rgba(138,140,134,.28);
  }
  .rail-brand .brand-mark{ width:34px; height:34px; }
  .rail-brand:hover .rail-brand-text{ color:var(--cyan); }

  .nav-list{
    display:flex;
    flex-direction:column;
    gap:4px;
    padding-block:14px;
  }

  .nav-item a{
    flex-direction:column;
    align-items:flex-start;
    gap:4px;
    padding:9px 7px;
    font-size:12px;
    border-color:transparent;
  }

  .nav-num{ font-size:10px; letter-spacing:.16em; }

  .nav-label{
    font-size:12px;
    line-height:1.15;
    letter-spacing:0;
    white-space:normal;
  }

  .nav-item a[aria-current="page"]{
    border-color:rgba(138,140,134,.42);
  }

  .rail-foot{
    margin-top:auto;
    padding-top:14px;
  }

  .rail-cta{
    padding:11px 7px;
    text-align:center;
    font-size:12px;
    line-height:1.3;
  }
  .rail-cta-sub{ display:none; }

  .utility-links{
    flex-direction:column;
    gap:8px;
    margin-top:12px;
  }
  .utility-links a{ font-size:11px; }

  .scroll-meter{ left:var(--rail-w); }
}

@media (min-width:1280px){
  :root{ --rail-w:96px; }
}

/* ============================================================
   动效退化
   ============================================================ */
@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;
  }

  .skip-link{ transition:none; }
  .scroll-meter__bar{ transition:none; }
  .site-rail{ transition:none; }
}