/* LL1 release 358 — shared premium interaction language.
   Page-specific artwork and layouts remain distinct; this file aligns finish,
   focus, motion, controls and depth across the public platform. */
:root {
  --ll1-ruby-358: #f1263c;
  --ll1-ruby-deep-358: #8f0717;
  --ll1-champagne-358: #f4d786;
  --ll1-champagne-deep-358: #a87522;
  --ll1-velvet-358: #050506;
  --ll1-panel-358: rgba(16, 13, 15, .9);
  --ll1-line-358: rgba(244, 215, 134, .24);
  --ll1-ease-358: cubic-bezier(.2, .78, .22, 1);
  color-scheme: dark;
}

html {
  scrollbar-gutter: stable;
  background: var(--ll1-velvet-358);
}

body {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  background-color: var(--ll1-velvet-358);
}

body::before {
  content: "";
  position: fixed;
  z-index: -20;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 8% -8%, rgba(241, 38, 60, .13), transparent 29%),
    radial-gradient(circle at 96% 18%, rgba(244, 215, 134, .07), transparent 24%),
    linear-gradient(180deg, #080608, #050506 42%, #030304);
}

::selection {
  color: #fff;
  background: rgba(241, 38, 60, .72);
}

:where(a, button, input, select, textarea, summary):focus-visible {
  outline: 2px solid var(--ll1-champagne-358);
  outline-offset: 4px;
  box-shadow: 0 0 0 6px rgba(244, 215, 134, .11);
}

:where(a, button) {
  -webkit-tap-highlight-color: transparent;
}

:where(input, select, textarea) {
  border-color: rgba(255, 255, 255, .15);
  color: #fff;
  background-color: rgba(5, 5, 7, .86);
  box-shadow: inset 0 1px rgba(255, 255, 255, .045);
  transition: border-color .22s ease, box-shadow .22s ease, background-color .22s ease;
}

:where(input, select, textarea):is(:hover, :focus) {
  border-color: rgba(244, 215, 134, .68);
  background-color: rgba(10, 8, 10, .96);
  box-shadow: inset 0 1px rgba(255, 255, 255, .07), 0 0 0 4px rgba(244, 215, 134, .055);
}

:where(input, textarea)::placeholder {
  color: rgba(255, 255, 255, .4);
}

.button,
.site-header .nav-actions a,
.network-entry-actions a,
.seo-actions a,
.seo-actions button {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-radius: 999px;
  box-shadow: inset 0 1px rgba(255, 255, 255, .13), 0 13px 34px rgba(0, 0, 0, .3);
  transition: transform .24s var(--ll1-ease-358), border-color .24s ease, box-shadow .24s ease, filter .24s ease;
}

.button::after,
.site-header .nav-actions a::after,
.network-entry-actions a::after,
.seo-actions a::after,
.seo-actions button::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -120% -70%;
  pointer-events: none;
  background: linear-gradient(108deg, transparent 43%, rgba(255, 255, 255, .2) 49%, transparent 55%);
  transform: translateX(-58%);
  transition: transform .72s var(--ll1-ease-358);
}

.button:is(:hover, :focus-visible),
.site-header .nav-actions a:is(:hover, :focus-visible),
.network-entry-actions a:is(:hover, :focus-visible),
.seo-actions :is(a, button):is(:hover, :focus-visible) {
  transform: translateY(-3px);
  filter: saturate(1.08);
  box-shadow: inset 0 1px rgba(255, 255, 255, .18), 0 20px 48px rgba(0, 0, 0, .45), 0 0 30px rgba(241, 38, 60, .13);
}

.button:is(:hover, :focus-visible)::after,
.site-header .nav-actions a:is(:hover, :focus-visible)::after,
.network-entry-actions a:is(:hover, :focus-visible)::after,
.seo-actions :is(a, button):is(:hover, :focus-visible)::after {
  transform: translateX(58%);
}

.site-header.is-scrolled {
  border-color: rgba(244, 215, 134, .16);
  background: linear-gradient(180deg, rgba(8, 6, 8, .96), rgba(4, 4, 5, .88));
  box-shadow: 0 18px 50px rgba(0, 0, 0, .3), inset 0 -1px rgba(255, 255, 255, .025);
  backdrop-filter: blur(25px) saturate(1.28);
}

.section-kicker,
.eyebrow {
  color: var(--ll1-champagne-358);
}

.section-kicker::before,
.eyebrow::before {
  content: "";
  width: 6px;
  height: 6px;
  flex: 0 0 6px;
  border-radius: 50%;
  background: var(--ll1-ruby-358);
  box-shadow: 0 0 0 5px rgba(241, 38, 60, .08), 0 0 17px rgba(241, 38, 60, .62);
}

@supports (background-clip: text) {
  :where(.hero, .guide-hero, .venue-hero, .network-entry-hero) h1 em,
  :where(.section, .event-finder, .venue-network) h2 em {
    color: transparent;
    background: linear-gradient(115deg, #ff5062 4%, #f1263c 44%, #f4d786 112%);
    background-clip: text;
    -webkit-background-clip: text;
  }
}

@media (prefers-reduced-motion: reduce) {
  .button,
  .site-header .nav-actions a,
  .network-entry-actions a,
  .seo-actions a,
  .seo-actions button {
    transition: none !important;
  }
  .button::after,
  .site-header .nav-actions a::after,
  .network-entry-actions a::after,
  .seo-actions a::after,
  .seo-actions button::after {
    display: none;
  }
}
