/* Locrian signature hero: one stationary typography grid, three perfectly aligned wipe layers.
   The header is outside this stage; the footer begins strictly beyond the first viewport. */
#home-view{--home-header-height:78px;display:block}
#home-view .brand-story,
#home-view .brand-story-stage{
  position:relative;
  width:100%;
  height:auto;
  min-height:max(360px,calc(100svh - var(--home-header-height)));
  margin:0;
  padding:0;
  overflow:hidden;
  background:#fff;
}
#home-view .brand-story-stage{height:max(360px,calc(100svh - var(--home-header-height)))}
#home-view .home-popular{display:none!important} /* Preserved DOM, carousel loader, API and styles for later reactivation. */
.home-wipe-hero{position:absolute;inset:0;isolation:isolate;overflow:hidden;background:#fff}
.home-wipe-layer{position:absolute;inset:0;display:grid;place-items:stretch;overflow:hidden}
.home-wipe-base,.home-wipe-return{background:#fff;color:#111}
.home-wipe-black{background:#111;color:#fff;clip-path:inset(0 100% 0 0);animation:homeHeroBlackWipe 9.6s linear infinite}
.home-wipe-return{clip-path:inset(0 100% 0 0);animation:homeHeroWhiteWipe 9.6s linear infinite}
.home-wipe-title{margin:0}
.home-wipe-grid{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  align-items:center;justify-items:stretch;width:100%;height:100%;
  min-width:0;margin:0;padding:0;font-family:var(--sans,Arial,sans-serif);
}
.home-wipe-half{min-width:0;min-height:0;display:flex;justify-content:center;align-items:center;padding:24px clamp(5px,1.5vw,24px);text-align:center}
.home-wipe-copy{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.09em;width:100%;min-width:0;font-size:clamp(20px,4.3vw,82px);line-height:1.13;letter-spacing:-.068em;font-weight:800;white-space:nowrap}
.home-wipe-copy span{display:block;white-space:nowrap}
.home-wipe-black,.home-wipe-return{will-change:clip-path}
/* Total loop 9.6s. The first half builds tension; the second half crosses twice as fast.
   Black: left 1.80s + midpoint hold .15s + right .90s + full black hold 1.15s.
   White: left 1.80s + midpoint hold .15s + right .90s + full white hold 2.75s.
   Each movement accelerates hard through its center and brakes before the edge. */
@keyframes homeHeroBlackWipe{
  0%{clip-path:inset(0 100% 0 0);animation-timing-function:cubic-bezier(.88,0,.12,1)}
  18.75%{clip-path:inset(0 50% 0 0)}
  20.3125%{clip-path:inset(0 50% 0 0);animation-timing-function:cubic-bezier(.88,0,.12,1)}
  29.6875%,100%{clip-path:inset(0 0 0 0)}
}
@keyframes homeHeroWhiteWipe{
  0%{clip-path:inset(0 100% 0 0)}
  41.666667%{clip-path:inset(0 100% 0 0);animation-timing-function:cubic-bezier(.88,0,.12,1)}
  60.416667%{clip-path:inset(0 50% 0 0)}
  61.979167%{clip-path:inset(0 50% 0 0);animation-timing-function:cubic-bezier(.88,0,.12,1)}
  71.354167%,100%{clip-path:inset(0 0 0 0)}
}
@media(max-width:900px){
  #home-view{--home-header-height:68px}
}
@media(max-width:760px){
  .home-wipe-cta{width:168px;min-height:50px;bottom:clamp(24px,5svh,45px);font-size:14px}
  .home-wipe-half{padding:16px 4px}
  .home-wipe-copy{font-size:clamp(18px,4.75vw,36px);letter-spacing:-.075em;gap:.17em;line-height:1.2}
}
@media(max-width:359px){
  .home-wipe-copy{font-size:clamp(16px,4.65vw,19px)}
}
@media(prefers-reduced-motion:reduce){
  .home-wipe-black,.home-wipe-return{animation:none!important;clip-path:inset(0 100% 0 0)!important;will-change:auto}
}

/* Only the visible landing route receives CSS smooth anchor/keyboard navigation.
   Do not change scroll behavior on market, canvas, account or tool routes. */
html:has(#home-view:not([hidden])){scroll-behavior:smooth}

/* The one interactive CTA stays above every wipe layer. Difference
   blending reads the final painted backdrop for EACH PIXEL, so the same button
   inverts automatically even when a boundary passes through its middle. */
.home-wipe-cta{
  position:absolute;
  bottom:clamp(24px,7svh,76px);
  left:50%;
  z-index:5;
  transform:translateX(-50%);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:clamp(152px,15vw,208px);
  min-height:clamp(46px,5.8svh,58px);
  padding:12px 24px;
  border:1px solid #fff;
  border-radius:6px;
  background:#fff;
  color:#000;
  mix-blend-mode:difference;
  font-family:var(--sans,Arial,sans-serif);
  font-size:clamp(14px,1.05vw,16px);
  font-weight:650;
  line-height:1.2;
  letter-spacing:-.025em;
  white-space:nowrap;
  cursor:pointer;
}
.home-wipe-black,.home-wipe-return{pointer-events:none}
.home-wipe-cta:focus-visible{outline:2px solid #fff;outline-offset:4px}
@media(prefers-reduced-motion:reduce){
  html:has(#home-view:not([hidden])){scroll-behavior:auto}
}

/* Locrian generated screen UI font-size uplift; do not edit. */
@media screen {
.home-wipe-copy{font-size:calc(clamp(20px,4.3vw,82px) + 2pt)}
.home-wipe-copy{font-weight:750}
@media(max-width:760px){.home-wipe-cta{font-size:calc(14px + 2pt)}}
@media(max-width:760px){.home-wipe-copy{font-size:calc(clamp(18px,4.75vw,36px) + 2pt)}}
@media(max-width:359px){.home-wipe-copy{font-size:calc(clamp(16px,4.65vw,19px) + 2pt)}}
.home-wipe-cta{font-size:calc(clamp(14px,1.05vw,16px) + 2pt)}
.home-wipe-cta{font-weight:600}
}
