/* ============================================================
   LEVITICUS — Screening Request
   Shared design system (NEON house style)
   ============================================================ */

:root{
  --bg:#06080a;
  --bg-2:#0a0d10;
  --panel:#0c1014;
  --fg:#e9eef1;
  --muted:#8b979e;
  --muted-2:#5e686d;
  --line:rgba(255,255,255,.14);
  --line-soft:rgba(255,255,255,.08);
  --cyan:#7fd4e3;
  --cyan-bright:#b6ecf5;
  --warn:#e0746b;
  --shadow:0 0 40px rgba(127,212,227,.18);
  --maxw:1320px;
  --font-display:"Marcellus",Georgia,serif; /* light inscriptional serif — echoes the title treatment */
}

*{box-sizing:border-box;}
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0;
  background:var(--bg);
  color:var(--fg);
  font-family:"Archivo","Helvetica Neue",Arial,sans-serif;
  font-weight:400;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
h1,h2,.wordmark{ font-family:var(--font-display); }
img{max-width:100%;display:block;}
a{color:inherit;}
::selection{background:rgba(127,212,227,.3);color:#fff;}

/* ---------- type helpers ---------- */
.eyebrow{
  font-size:12px;
  letter-spacing:.42em;
  text-transform:uppercase;
  color:var(--cyan);
  font-weight:500;
  margin:0;
}
.kicker{
  font-size:11px;
  letter-spacing:.4em;
  text-transform:uppercase;
  color:var(--muted);
  font-weight:500;
}
.lede{
  color:var(--muted);
  font-size:clamp(15px,1.2vw,17px);
  line-height:1.65;
  max-width:46ch;
}

/* chrome / glass wordmark to echo the key art title */
.wordmark{
  font-weight:600;
  letter-spacing:.24em;
  text-transform:uppercase;
  background:linear-gradient(176deg,#f1fafc 0%,#bcd9e0 38%,#5d818a 52%,#9cc4cd 66%,#eef8fb 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter:drop-shadow(0 0 16px rgba(127,212,227,.32));
}

/* honeypot — visually hidden; autofill bots complete it, humans never see it */
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* ---------- form ---------- */
.lv-form{
  display:flex;
  flex-direction:column;
  gap:30px;
  width:100%;
}
.field{ display:flex; flex-direction:column; gap:11px; }
.field > label{
  font-size:12px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--muted);
  font-weight:500;
  display:flex;
  align-items:center;
  gap:7px;
}
.field .req{ color:var(--cyan); font-size:13px; line-height:1; }
.field input{
  background:transparent;
  border:0;
  border-bottom:1px solid var(--line);
  color:var(--fg);
  font-family:inherit;
  font-size:18px;
  letter-spacing:.01em;
  padding:9px 2px;
  transition:border-color .25s ease, box-shadow .25s ease;
}
.field input::placeholder{ color:rgba(255,255,255,.24); letter-spacing:0; }
.field input:focus{
  outline:none;
  border-bottom-color:var(--cyan);
  box-shadow:0 1px 0 0 var(--cyan);
}
.field.invalid input{ border-bottom-color:var(--warn); box-shadow:0 1px 0 0 rgba(224,116,107,.5); }
.field .err{
  font-size:11.5px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--warn);
  height:0;
  opacity:0;
  transform:translateY(-4px);
  transition:opacity .2s ease, transform .2s ease;
}
.field.invalid .err{ height:auto; opacity:1; transform:none; }

.lv-submit{
  margin-top:8px;
  align-self:flex-start;
  background:transparent;
  border:1px solid rgba(255,255,255,.5);
  color:var(--fg);
  font-family:inherit;
  font-size:13px;
  font-weight:500;
  letter-spacing:.28em;
  text-transform:uppercase;
  padding:18px 40px;
  cursor:pointer;
  transition:color .25s ease, background-color .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.lv-submit:hover{
  border-color:var(--cyan);
  background:var(--cyan);
  color:#05080a;
  box-shadow:var(--shadow);
}
.lv-submit:disabled{ opacity:.5; cursor:default; }

.form-note{
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--muted-2);
  margin:6px 0 0;
  line-height:1.7;
}

/* ---------- success state ---------- */
.lv-success{
  display:none;
  flex-direction:column;
  gap:20px;
  opacity:0;
  transform:translateY(14px);
  transition:opacity .6s ease, transform .6s ease;
  border:1px solid rgba(127,212,227,.28);
  background:linear-gradient(180deg, rgba(127,212,227,.05), rgba(12,16,20,.6));
  padding:clamp(34px,5vh,54px) clamp(24px,4vw,48px);
  box-shadow:0 0 70px -20px rgba(127,212,227,.3);
}
.lv-success.show{ display:flex; opacity:1; transform:none; }
/* neon flicker as the confirmation lands */
.lv-success.show h2{ animation:lvFlicker 1.5s ease-out .2s both; }
@keyframes lvFlicker{
  0%{ opacity:0; text-shadow:none; }
  10%{ opacity:1; text-shadow:0 0 24px rgba(127,212,227,.9); }
  14%{ opacity:.25; }
  22%{ opacity:1; text-shadow:0 0 20px rgba(127,212,227,.7); }
  30%{ opacity:.55; }
  42%,100%{ opacity:1; text-shadow:0 0 16px rgba(127,212,227,.4); }
}
/* once a request lands, clear the pitch copy so the confirmation owns the page */
.is-complete .request > .eyebrow,
.is-complete .request > h1,
.is-complete .request > .lede,
.is-complete .request > .meta-row{ display:none; }
.lv-success h2:focus{ outline:none; }
.lv-success h2{
  font-size:clamp(26px,3vw,40px);
  font-weight:400;
  letter-spacing:.06em;
  line-height:1.2;
  margin:0;
}
.lv-success p{ color:var(--muted); margin:0; max-width:44ch; line-height:1.65; }
/* ---------- sending state ---------- */
.is-submitting .lv-form{ pointer-events:none; }
.is-submitting .lv-form .field,
.is-submitting .lv-form .form-note{ opacity:.4; transition:opacity .3s; }
.is-submitting .lv-submit,
.is-submitting .lv-submit:disabled{
  opacity:1; color:var(--cyan); border-color:var(--cyan); background:transparent;
  animation:lvPulse 1.2s ease-in-out infinite;
}
.lv-submit .ell{ display:inline-block; width:1.2em; text-align:left; letter-spacing:.1em; }
.lv-submit .ell i{ font-style:normal; opacity:0; animation:lvBlink 1.2s infinite; }
.lv-submit .ell i:nth-child(2){ animation-delay:.2s; }
.lv-submit .ell i:nth-child(3){ animation-delay:.4s; }
@keyframes lvPulse{
  0%,100%{ box-shadow:0 0 0 rgba(127,212,227,0); }
  50%{ box-shadow:0 0 28px rgba(127,212,227,.4); }
}
@keyframes lvBlink{ 0%,60%,100%{opacity:0;} 30%{opacity:1;} }

/* ---------- footer ---------- */
.lv-footer .billing{
  width:auto;
  height:34px;
  opacity:.45;
}
.lv-footer{
  border-top:1px solid var(--line-soft);
  padding:34px 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:18px;
}
.neon-mark{ display:inline-flex; align-items:center; }
.neon-mark img{
  height:34px; width:auto;
  opacity:.85; transition:opacity .2s;
}
.neon-mark:hover img{ opacity:1; }
.lv-footer .copy{ font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted-2); }
.lv-footer .links{ display:flex; gap:26px; }
.lv-footer .links a{
  font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);
  text-decoration:none;transition:color .2s;
}
.lv-footer .links a:hover{ color:var(--cyan); }

/* ---------- meta chips (rating / runtime / laurels) ---------- */
.meta-row{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.rating-badge{
  border:1.5px solid var(--muted);
  color:var(--muted);
  font-size:12px;font-weight:600;letter-spacing:.08em;
  padding:2px 9px;border-radius:3px;line-height:1.3;
}
.meta-row .meta-txt{ font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);white-space:nowrap; }
.dot{ width:3px;height:3px;border-radius:50%;background:var(--muted-2);display:inline-block; }

@keyframes fadeUp{ from{opacity:0;transform:translateY(16px);} to{opacity:1;transform:none;} }

/* ---------- title-treatment toggle (A2 / B2) ---------- */
.tt-toggle{
  position:fixed; z-index:60; top:18px; right:18px;
  display:flex; align-items:center; gap:10px;
  background:rgba(8,11,14,.66);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  border:1px solid var(--line);
  padding:6px 6px 6px 14px;
}
.tt-toggle .tt-label{
  font-size:10px; letter-spacing:.24em; text-transform:uppercase; color:var(--muted-2);
}
.tt-toggle .tt-buttons{ display:flex; gap:4px; }
.tt-toggle button{
  background:transparent; border:0; cursor:pointer;
  font-family:inherit; font-size:11px; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase; color:var(--muted);
  padding:7px 14px; transition:color .2s, background-color .2s;
}
.tt-toggle button:hover{ color:var(--fg); }
.tt-toggle button.is-active{ background:var(--cyan); color:#05080a; }

/* default shows glow halo; "clean" hides it */
.title-lockup[data-tt="clean"] .glow{ opacity:0; }

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important;transition-duration:.001ms !important;}
}