@font-face { font-family: 'Manrope'; src: url('./assets/fonts/manrope-variable.ttf') format('truetype'); font-weight: 200 800; font-display: swap; }
body [data-selection-page] {
  --selection-accent: #ff6f61;
  --selection-glow: #ff6f6124;
  position: relative !important;
  display: grid !important;
  grid-template-rows: auto minmax(0,1fr) !important;
  align-content: stretch !important;
  gap: clamp(1rem, 3vh, 2rem) !important;
  box-sizing: border-box;
  width: 100%;
  height: 100dvh !important;
  min-height: 40rem !important;
  padding: 6rem max(1.25rem, 5vw) 2rem !important;
  background: radial-gradient(ellipse at 50% 0, var(--selection-glow), transparent 65%), #0b0e12 !important;
  color: #f6f4ef;
  overflow: visible;
  font-family: 'Manrope', 'Segoe UI', sans-serif;
}
body [data-selection-page="website"] { --selection-accent: #92c9f4; --selection-glow: #3d88c52a; }
body [data-selection-page="website"] { place-items:stretch !important; }
body [data-selection-page="website"] .selection-grid { height:100%; align-items:stretch; }
body [data-selection-page="website"] .selection-card { height:100%; }
body [data-selection-page="film"] { --selection-accent: #c3a1ff; --selection-glow: #8c52db30; }
body [data-selection-page][hidden] { display: none !important; }
body [data-selection-page]::before,
body [data-selection-page]::after { display: none !important; }
body [data-selection-page] .selection-header { position: relative; display: block; width: min(100%,76rem); margin: 0 auto; text-align: center; }
body [data-selection-page] .selection-back { display: inline-block; color: #b8b8bd; font-size: .75rem; margin-bottom: .65rem; text-decoration: none; }
body [data-selection-page] .selection-kicker { margin: 0 0 .5rem; font-size: .75rem; letter-spacing: .16em; font-weight: 700; text-transform: uppercase; color: var(--selection-accent); }
body [data-selection-page] h1 { max-width: none !important; margin: 0 0 .65rem !important; font-family: inherit !important; font-size: clamp(1.75rem, 3.2vw, 2.75rem) !important; font-weight: 700 !important; line-height: 1.3 !important; letter-spacing: 0 !important; color: #f6f4ef !important; text-align: center; }
body [data-selection-page] h1 em { color: var(--selection-accent) !important; -webkit-text-fill-color: currentColor !important; background: none !important; font-style: normal; }
body [data-selection-page] .selection-lead { max-width: none; margin: 0; font-size: .9375rem; line-height: 1.5; color: #b9bdc5; }
body [data-selection-page] .selection-grid { display: grid; grid-template-columns: repeat(var(--selection-columns),minmax(0,1fr)); gap: 1.1rem; min-height: 0; width: min(100%,76rem); margin: 0 auto; }
body [data-selection-page] .selection-card {
  position: relative; isolation: isolate; display: flex; align-items: end;
  min-width: 0; min-height: 0; width: 100%; box-sizing: border-box;
  margin: 0; padding: clamp(1.25rem, 2.2vw, 2rem);
  border: 1px solid #ffffff24; border-radius: .85rem;
  background: #14181d; color: #f6f4ef; overflow: hidden;
  font: inherit; text-align: left; text-decoration: none; cursor: pointer;
  transform: none; transition: border-color .25s, box-shadow .25s;
}
body [data-selection-page] .selection-card > img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: center; filter: saturate(.65); transition: transform .5s; }
body [data-selection-page] .selection-card::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg,#080b1020,#080b1077 35%,#080b10f5 80%); }
body [data-selection-page] .selection-card__copy { display: grid; gap: .75rem; width: 100%; }
body [data-selection-page] .selection-card small { color: var(--selection-accent); font-size: .6875rem; line-height: 1.5; letter-spacing: .07em; font-weight: 650; }
body [data-selection-page] .selection-card h2 { margin: 0 !important; font-family: inherit !important; font-size: clamp(1.375rem, 2.1vw, 2rem) !important; line-height: 1.3 !important; letter-spacing: 0 !important; font-weight: 700 !important; color: #fff !important; }
body [data-selection-page] .selection-card p { margin: 0; font-size: .875rem; line-height: 1.6; color: #d0d2d7; }
body [data-selection-page] .selection-card__copy > span { margin-top: .35rem; padding-top: .8rem; border-top: 1px solid #ffffff26; color: var(--selection-accent); font-size: .8125rem; font-weight: 650; }
body [data-selection-page] .selection-card:hover { border-color: var(--selection-accent); box-shadow: 0 .8rem 2rem #0004; }
body [data-selection-page] .selection-card:hover > img { transform: scale(1.025); }
body [data-selection-page] :is(.selection-card,.selection-back):focus-visible { outline: 2px solid var(--selection-accent); outline-offset: 4px; }
@media(max-width:700px) {
  body [data-selection-page] { padding: 5.25rem 1rem 1rem !important; min-height: 43rem !important; gap: 1rem !important; }
  body [data-selection-page] h1 { font-size: 1.5rem !important; }
  body [data-selection-page] .selection-lead { font-size: .8125rem; }
  body [data-selection-page] .selection-grid { grid-template-columns: 1fr; grid-auto-rows: 1fr; gap: .65rem; }
  body [data-selection-page] .selection-card { padding: .9rem 1rem; align-items: center; }
  body [data-selection-page] .selection-card::after { background: linear-gradient(90deg,#080b10f2 20%,#080b10b5 65%,#080b1066); }
  body [data-selection-page] .selection-card__copy { gap: .3rem; }
  body [data-selection-page] .selection-card h2 { font-size: 1.125rem !important; }
  body [data-selection-page] .selection-card p { font-size: .75rem; line-height: 1.4; max-width: 40ch; }
  body [data-selection-page] .selection-card small { font-size: .6rem; }
  body [data-selection-page] .selection-card__copy > span { padding-top: .35rem; margin-top: .15rem; font-size: .7rem; }
}
@media(prefers-reduced-motion:reduce) { body [data-selection-page] .selection-card, body [data-selection-page] .selection-card > img { transition: none; } }