:root{
  --eo-gold:#F7B718; --eo-goldm:#E4B84A; --eo-goldp:#F8ECA8;
  --eo-accent:#BA0C2F; --eo-burg:#5A0A1E; --eo-claret:#9B1535;
  --eo-ink:#394240; --eo-ease:cubic-bezier(.22,1,.36,1);
}

/* Entrance reveals -------------------------------------------------------
   Applied by script only, so a browser with JS off sees the finished page. */
html.eo-motion .eo-rise{
  opacity:0;
  transform:translate3d(0,26px,0);
  transition:opacity .78s var(--eo-ease), transform .78s var(--eo-ease);
  transition-delay:var(--eo-d,0ms);
  will-change:opacity, transform;
}
html.eo-motion .eo-rise.eo-in{ opacity:1; transform:none; }

/* Images arrive with a slow settle and a wipe from the leading edge. */
html.eo-motion .eo-wipe{
  clip-path:inset(0 0 100% 0);
  transition:clip-path 1.05s var(--eo-ease);
  transition-delay:var(--eo-d,0ms);
}
html.eo-motion .eo-wipe.eo-in{ clip-path:inset(0 0 0 0); }
html.eo-motion .eo-wipe img{
  transform:scale(1.06);
  transition:transform 1.5s var(--eo-ease);
  transition-delay:var(--eo-d,0ms);
}
html.eo-motion .eo-wipe.eo-in img{ transform:none; }

/* A gold rule draws itself under every section heading. The pseudo-element is
   inside the heading's own box, so nothing below it moves. */
html.eo-motion .eo-rule{ position:relative; }
html.eo-motion .eo-rule::after{
  content:"";
  position:absolute; left:0; bottom:-14px;
  width:64px; height:2px;
  transform:scaleX(0); transform-origin:left center;
  background:linear-gradient(90deg,var(--eo-gold),var(--eo-goldm) 60%,rgba(228,184,74,0));
  transition:transform .9s var(--eo-ease) .18s;
}
html.eo-motion .eo-rule.eo-in::after{ transform:scaleX(1); }
html.eo-motion .eo-rule.eo-rule--mid::after{ left:50%; margin-left:-32px; transform-origin:center; }

/* Hover ------------------------------------------------------------------ */
.eo-lift{
  transition:transform .45s var(--eo-ease), box-shadow .45s var(--eo-ease);
}
.eo-lift:hover{ transform:translate3d(0,-3px,0); }

/* A single pass of light across a button, once, on hover. */
.eo-sheen{ position:relative; overflow:hidden; isolation:isolate; }
.eo-sheen::after{
  content:"";
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(105deg,rgba(255,252,246,0) 35%,rgba(248,236,168,.42) 50%,rgba(255,252,246,0) 65%);
  transform:translate3d(-120%,0,0);
  transition:transform .85s var(--eo-ease);
}
.eo-sheen:hover::after{ transform:translate3d(120%,0,0); }

/* Content links draw an underline rather than switching one on. */
.eo-underline{
  background-image:linear-gradient(var(--eo-goldm),var(--eo-goldm));
  background-repeat:no-repeat;
  background-position:0 100%;
  background-size:0% 1px;
  transition:background-size .45s var(--eo-ease);
  text-decoration:none;
}
.eo-underline:hover{ background-size:100% 1px; }

/* Header ----------------------------------------------------------------- */
.eo-head-shrink{
  transition:box-shadow .5s var(--eo-ease), backdrop-filter .5s var(--eo-ease), background-color .5s var(--eo-ease);
}
html.eo-scrolled .eo-head-shrink{
  box-shadow:0 10px 34px rgba(57,66,64,.16);
  backdrop-filter:saturate(1.1) blur(6px);
}

/* Scroll indicator ------------------------------------------------------- */
.eo-progress{
  position:fixed; inset:0 auto auto 0;
  height:2px; width:100%;
  transform:scaleX(0); transform-origin:left center;
  background:linear-gradient(90deg,var(--eo-claret),var(--eo-gold) 55%,var(--eo-goldp));
  z-index:99999; pointer-events:none;
}

/* Return to top ---------------------------------------------------------- */
.eo-top{
  position:fixed; right:22px; bottom:22px; z-index:9998;
  width:46px; height:46px; display:grid; place-items:center;
  border:1px solid rgba(228,184,74,.55); border-radius:999px;
  background:rgba(90,10,30,.92); color:var(--eo-goldp);
  cursor:pointer; opacity:0; transform:translate3d(0,12px,0); pointer-events:none;
  transition:opacity .45s var(--eo-ease), transform .45s var(--eo-ease), background-color .45s var(--eo-ease);
}
.eo-top svg{ width:17px; height:17px; }
html.eo-scrolled-far .eo-top{ opacity:1; transform:none; pointer-events:auto; }
.eo-top:hover{ background:var(--eo-claret); }
.eo-top:focus-visible{ outline:2px solid var(--eo-gold); outline-offset:3px; }

/* Parallax --------------------------------------------------------------- */
html.eo-motion .eo-parallax{ will-change:transform; }

/* Reduced motion --------------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  html.eo-motion .eo-rise,
  html.eo-motion .eo-wipe,
  html.eo-motion .eo-wipe img,
  html.eo-motion .eo-rule::after{
    opacity:1 !important;
    transform:none !important;
    clip-path:none !important;
    transition:none !important;
  }
  html.eo-motion .eo-rule::after{ transform:scaleX(1) !important; }
  .eo-lift, .eo-sheen::after, .eo-underline, .eo-top, .eo-progress{ transition:none !important; }
  .eo-progress{ display:none; }
}

/* Mobile ----------------------------------------------------------------- */
@media (max-width:900px){
  html.eo-motion .eo-rise{ transform:translate3d(0,18px,0); }
  html.eo-motion .eo-rule::after{ bottom:-10px; width:52px; }
  .eo-top{ right:14px; bottom:14px; width:42px; height:42px; }
  /* Parallax on a phone competes with the scroll gesture, so it is switched off. */
  html.eo-motion .eo-parallax{ transform:none !important; }
}
