/* ===== Cognizen Event — brand tokens (TV posters) ===== */
:root{
  --ink:#0a0e1f;
  --navy:#0e1430;
  --slate:#1c2748;
  --coral:#e23c52;        /* saturated brand red */
  --coral-2:#f6a0ab;      /* salmon highlight end */
  --coral-btn:#db4e5e;
  --white:#ffffff;
  --muted:rgba(255,255,255,.74);
  --muted-2:rgba(255,255,255,.52);
  --hairline:rgba(255,255,255,.14);
}

*{ box-sizing:border-box; margin:0; padding:0; }
html,body{ background:#000; }

.poster{
  position:relative;
  overflow:hidden;
  color:var(--white);
  font-family:"Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  /* hero gradient: deep navy bottom-left -> burgundy top-right */
  background:
    radial-gradient(115% 85% at 88% 6%, rgba(150,46,68,.60), transparent 52%),
    radial-gradient(95% 80% at 8% 98%, rgba(31,54,99,.55), transparent 55%),
    radial-gradient(70% 60% at 60% 45%, rgba(120,40,70,.18), transparent 60%),
    linear-gradient(135deg, #0a0e1f 0%, #0c1226 44%, #15132f 100%);
}
/* faint starfield / dot texture */
.poster::before{
  content:"";
  position:absolute; inset:0;
  background-image:
    radial-gradient(1.4px 1.4px at 20% 30%, rgba(255,255,255,.30), transparent 60%),
    radial-gradient(1.2px 1.2px at 70% 18%, rgba(255,255,255,.22), transparent 60%),
    radial-gradient(1.6px 1.6px at 42% 72%, rgba(255,255,255,.18), transparent 60%),
    radial-gradient(1.1px 1.1px at 85% 60%, rgba(255,255,255,.20), transparent 60%),
    radial-gradient(1.3px 1.3px at 12% 80%, rgba(255,255,255,.16), transparent 60%),
    radial-gradient(1.2px 1.2px at 60% 88%, rgba(255,255,255,.14), transparent 60%);
  opacity:.7; pointer-events:none;
}
.poster > *{ position:relative; z-index:1; }

/* ---- brand lockup ---- */
.brand{ display:flex; align-items:center; gap:.5em; }
.brand .mark{ display:block; }
.brand .wordmark{ font-weight:800; letter-spacing:-.01em; line-height:1; }
.brand .wordmark .c{ color:#fff; }
.brand .wordmark .e{ color:var(--coral); }

/* ---- pills ---- */
.pill{
  display:inline-flex; align-items:center; gap:.6em;
  border-radius:999px; font-weight:700;
  text-transform:uppercase;
}
.pill-eyebrow{
  border:1.5px solid rgba(246,160,171,.45);
  color:#f3aab3;
  background:rgba(226,60,82,.06);
}
.pill-dark{
  background:#111733; color:#fff;
  border:1px solid var(--hairline);
}

/* ---- headline ---- */
.headline{ font-weight:800; letter-spacing:-.022em; line-height:.98; text-wrap:balance; }
.grad{
  background:linear-gradient(100deg, var(--coral) 0%, #ef6a78 48%, var(--coral-2) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.lede{ color:var(--muted); font-weight:500; text-wrap:pretty; }
.lede b{ color:#fff; font-weight:700; }

/* ---- QR card ---- */
.qr-card{
  background:#fff; color:#0a0e1f;
  border-radius:40px;
  display:flex; flex-direction:column; align-items:center;
  box-shadow:0 40px 90px -30px rgba(226,60,82,.55), 0 20px 60px -20px rgba(0,0,0,.6);
}
.qr-card .qr-top{
  font-weight:800; text-transform:uppercase; color:var(--coral); white-space:nowrap;
}
.qr-card .qr-img{ display:block; border-radius:14px; }
.qr-card .qr-url{ font-weight:800; color:#0a0e1f; letter-spacing:-.01em; }
.qr-card .qr-url span{ color:var(--coral); }

/* ---- cta line ---- */
.cta{ display:inline-flex; align-items:center; gap:.55em; font-weight:700; color:#fff; }
.cta .ico{ color:var(--coral); display:inline-flex; }

/* ---- footer ---- */
.footer{ color:var(--muted-2); font-weight:600; display:flex; align-items:center; gap:.7em; }
.footer .dot{ width:.34em; height:.34em; border-radius:50%; background:var(--coral); display:inline-block; }
