:root{color-scheme:dark;--bg:#0a0a0a;--gold:#ffd23f;--gold-soft:#f3c94f;--gold-deep:#c79a12;--ink:#f7f5ef;--muted:#a9adb0;--dim:#7d8386;--line:#ffffff14;--panel:#121314;--ok:#7fd6a4;--warn:#ffb4a3;--display:"Barlow Condensed","Arial Narrow",sans-serif;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);min-height:100vh;overflow-x:hidden}
a{color:inherit}
button,input{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
img{display:block;max-width:100%}

/* Photo backdrop: city + PCMG officer, fading to black toward the copy and the bottom. */
.backdrop{position:absolute;inset:0 0 auto 0;height:min(980px,100vh);background:url(assets/hero.webp) right 20% top/cover no-repeat;z-index:-1;opacity:.55}
.backdrop:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0a0a0a 0%,#0a0a0af2 34%,#0a0a0aa6 62%,#0a0a0a8c 100%),linear-gradient(180deg,#0a0a0a99 0%,transparent 30%,transparent 60%,#0a0a0a 100%)}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(ellipse 60% 45% at 8% 0%,#ffd23f14,transparent 70%)}

.top{max-width:1200px;margin:auto;padding:26px 32px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.top img{width:150px;height:auto}
.pill{display:inline-flex;align-items:center;gap:9px;padding:9px 14px;border:1px solid #ffd23f40;border-radius:99px;background:#ffd23f0d;font-family:var(--display);font-weight:700;font-size:13px;letter-spacing:1.4px;text-transform:uppercase;color:var(--gold);white-space:nowrap}
.pill i{width:7px;height:7px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px #ffd23f26;animation:pulse 2.4s ease-in-out infinite}

.hero{max-width:1200px;margin:auto;padding:56px 32px 72px;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);grid-template-areas:"intro card" "offer card";column-gap:80px;row-gap:34px;align-items:start}
.intro{grid-area:intro}
.offer{grid-area:offer}
.card{grid-area:card;align-self:center}

.eyebrow{display:flex;align-items:center;gap:11px;font-family:var(--display);font-weight:700;font-size:14px;letter-spacing:2px;text-transform:uppercase;color:#d9d6cc}
.eyebrow img{width:20px;height:auto;filter:drop-shadow(0 2px 6px #0008)}
h1{font-size:clamp(40px,4.6vw,62px);font-weight:800;letter-spacing:-.035em;line-height:1.04;margin:22px 0 22px}
h1 em{font-style:normal;color:var(--gold);background:linear-gradient(100deg,#ffe27a,#ffd23f 45%,#f0b417);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.lead{font-size:17px;line-height:1.7;color:#c4c7c8;max-width:520px;margin:0}
.lead strong{color:var(--ink);font-weight:600}

.ticket{display:grid;grid-template-columns:200px 1fr;gap:26px;align-items:center;padding:20px;border:1px solid #ffd23f2e;border-radius:18px;background:linear-gradient(135deg,#17171799,#0d0d0dcc);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);max-width:560px;position:relative}
.ticket:before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:linear-gradient(135deg,#ffd23f66,transparent 40%,transparent 70%,#ffd23f33);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.cover{margin:0;border-radius:11px;overflow:hidden;box-shadow:0 18px 40px #000a,0 0 0 1px #ffffff14;aspect-ratio:16/9}
.cover img{width:100%;height:100%;object-fit:cover}
.was{font-size:13px;color:var(--dim)}
.was s{color:#b9bcbd;text-decoration-thickness:1.5px;text-decoration-color:#ff7a5c}
.value{font-family:var(--display);font-weight:800;font-size:76px;line-height:.92;letter-spacing:-.01em;margin:6px 0 8px;color:#fff}
.value small{font-size:30px;font-weight:700;color:#e8e6df;letter-spacing:0}
.value small:first-child{margin-right:6px;vertical-align:28px;font-size:24px;color:var(--gold)}
.terms{display:block;font-size:13px;line-height:1.5;color:var(--muted)}
.terms strong{color:var(--ink);font-weight:600}
.save{display:inline-block;margin-top:12px;padding:6px 10px;border-radius:6px;background:#7fd6a414;border:1px solid #7fd6a433;color:var(--ok);font-size:12px;font-weight:600}
.facts{list-style:none;padding:0;margin:20px 0 0;display:flex;gap:10px;max-width:560px}
.facts li{flex:1;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:#ffffff05}
.facts strong{display:block;font-family:var(--display);font-size:30px;font-weight:800;line-height:1;color:var(--gold-soft)}
.facts span{font-size:12px;color:var(--muted)}

.card{padding:34px;background:linear-gradient(160deg,#18191af2,#0f1011f7);border:1px solid #ffd23f2e;border-radius:22px;box-shadow:0 30px 90px #000c,inset 0 1px 0 #ffffff0d;position:relative;overflow:hidden}
.card:before{content:"";position:absolute;left:34px;right:34px;top:0;height:2px;background:linear-gradient(90deg,transparent,var(--gold),transparent)}
.card:after{content:"";position:absolute;width:320px;height:320px;right:-140px;top:-160px;background:radial-gradient(circle,#ffd23f1a,transparent 65%);pointer-events:none}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.step{font-family:var(--display);font-weight:700;font-size:13px;letter-spacing:1.8px;text-transform:uppercase;color:var(--gold)}
.progress{display:flex;gap:6px;margin:0;padding:0;list-style:none}
.progress li{width:22px;height:4px;border-radius:4px;background:#ffffff1f;transition:background .4s}
.progress li.on{background:var(--gold)}
h2{font-size:28px;font-weight:750;letter-spacing:-.02em;line-height:1.18;margin:16px 0 10px}
.sub{color:var(--muted);font-size:14px;line-height:1.65;margin:0 0 24px}
.sub strong{color:var(--ink);font-weight:600}
label{font-weight:600;font-size:13px;display:block;margin-bottom:9px}
.field{position:relative}
.field svg{position:absolute;left:15px;top:50%;width:19px;height:19px;transform:translateY(-50%);fill:none;stroke:#8b9194;stroke-width:1.6;stroke-linejoin:round;pointer-events:none;transition:stroke .2s}
input[type=email]{width:100%;height:56px;border:1px solid #3c4043;border-radius:12px;background:#0a0b0c;color:var(--ink);padding:0 16px 0 46px;font-size:16px;transition:border-color .2s,box-shadow .2s}
input[type=email]::placeholder{color:#62686b}
input[type=email]:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 4px #ffd23f26}
.field:focus-within svg{stroke:var(--gold)}
input[aria-invalid=true]{border-color:var(--warn)}
.hint{display:block;font-size:12px;color:var(--dim);margin:9px 0 20px}
button[type=submit],.button{position:relative;overflow:hidden;width:100%;min-height:56px;border:0;background:linear-gradient(180deg,#ffdb5c,#ffcc1f);color:#141204;border-radius:12px;font-weight:750;font-size:15px;display:flex;align-items:center;justify-content:space-between;padding:15px 20px;text-decoration:none;cursor:pointer;box-shadow:0 10px 30px #ffd23f2e,inset 0 -2px 0 #00000026;transition:transform .2s,box-shadow .2s,filter .2s}
button[type=submit]:after,.button:after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(100deg,transparent,#ffffff73,transparent);transform:skewX(-18deg);transition:left .6s}
button[type=submit]:hover,.button:hover{transform:translateY(-1px);box-shadow:0 16px 36px #ffd23f40,inset 0 -2px 0 #00000026}
button[type=submit]:hover:after,.button:hover:after{left:120%}
.arrow{font-size:18px;transition:transform .2s}
button[type=submit]:hover .arrow,.button:hover .arrow{transform:translateX(3px)}
button:disabled{cursor:wait;filter:saturate(.6) brightness(.85);transform:none}
button:disabled .arrow{display:inline-block;width:16px;height:16px;border:2px solid #14120466;border-top-color:#141204;border-radius:50%;font-size:0;animation:spin .8s linear infinite}
.button:focus-visible,button:focus-visible,a:focus-visible{outline:2px solid #fff;outline-offset:4px}

#feedback{font-size:13px;line-height:1.6}
#feedback:not(:empty){margin-top:16px;padding:13px 15px;border-radius:12px;border:1px solid #ff8d7340;background:#ff8d730f;color:var(--warn)}
#feedback.loading{border-color:#ffd23f33;background:#ffd23f0a;color:var(--gold-soft)}
#feedback.denied{color:#e9e6de}
#feedback.denied strong{display:block;color:var(--warn);font-size:14px;margin-bottom:4px}
#feedback.denied a{color:var(--gold-soft);font-weight:600;text-underline-offset:3px}

.eligible-list{margin-top:22px;padding-top:18px;border-top:1px dashed #ffffff1a}
.eligible-list span{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--dim)}
.eligible-list ul{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:7px}
.eligible-list li{padding:6px 10px;border-radius:99px;border:1px solid #ffd23f2e;background:#ffd23f0a;font-size:12px;font-weight:500;color:#e6e2d4}

#approved{outline:none;text-align:center;padding:6px 0 0}
#approved[hidden]+.privacy{margin-top:22px}
.success-icon{width:72px;height:72px;margin:8px auto 6px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,#7fd6a42e,#7fd6a40a 70%);border:1px solid #7fd6a466;animation:pop .5s cubic-bezier(.2,1.4,.4,1) both}
.success-icon svg{width:34px;height:34px;fill:none;stroke:var(--ok);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:24;stroke-dashoffset:24;animation:draw .5s .25s ease-out forwards}
h3{font-size:28px;font-weight:800;letter-spacing:-.02em;line-height:1.2;margin:12px 0 8px}
#approved p{color:var(--muted);font-size:14px;line-height:1.65;margin:0 auto 20px;max-width:340px}
.recap{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;margin-bottom:14px;border-radius:12px;border:1px solid #ffd23f33;background:#ffd23f0a;text-align:left}
.recap span{font-size:13px;color:#d9d6cc}
.recap strong{flex:none;white-space:nowrap;font-family:var(--display);font-size:28px;font-weight:800;color:var(--gold)}
.secure{display:block;margin-top:12px;font-size:12px;color:var(--dim)}
.quiet{display:block;margin:14px auto 0;background:none;color:var(--muted);border:0;text-decoration:underline;text-underline-offset:3px;font-size:12px;cursor:pointer}

.privacy{display:flex;gap:10px;margin:22px 0 14px;padding-top:18px;border-top:1px solid var(--line);font-size:12px;color:var(--dim);line-height:1.55}
.privacy svg{width:16px;height:18px;flex:none;fill:none;stroke:#8f9799;stroke-width:1.5;margin-top:1px}
.help{display:block;color:var(--muted);font-size:12px;line-height:1.6;text-decoration:none}
.help u{color:#e6e2d4;text-underline-offset:3px}
.trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}

.how{max-width:1200px;margin:0 auto;padding:10px 32px 70px}
.how h2{font-family:var(--display);font-weight:700;font-size:15px;letter-spacing:2.2px;text-transform:uppercase;color:var(--gold);margin:0 0 18px}
.how ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.how li{padding:22px 22px 24px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(180deg,#141516,#0e0f10)}
.how b{display:block;font-family:var(--display);font-size:34px;font-weight:800;line-height:1;color:#ffd23f40;margin-bottom:12px}
.how strong{display:block;font-size:16px;margin-bottom:6px}
.how span{font-size:13px;line-height:1.6;color:var(--muted)}

footer{max-width:1136px;margin:0 auto;padding:22px 0 34px;border-top:1px solid var(--line);color:var(--dim);font-family:var(--display);font-weight:600;font-size:12px;letter-spacing:1.6px;display:flex;justify-content:space-between}
footer span{font-family:Inter,system-ui,sans-serif;font-weight:400;letter-spacing:0}
[hidden]{display:none!important}

.intro,.offer,.card,.how{animation:rise .7s cubic-bezier(.2,.7,.2,1) both}
.offer{animation-delay:.08s}.card{animation-delay:.14s}.how{animation-delay:.2s}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes pulse{50%{box-shadow:0 0 0 7px #ffd23f0d}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes pop{from{transform:scale(.6);opacity:0}}
@keyframes draw{to{stroke-dashoffset:0}}

@media(max-width:980px){
  .hero{column-gap:44px}
  .ticket{grid-template-columns:150px 1fr;gap:18px}
  .value{font-size:62px}
  footer{margin:0 32px}
}
@media(max-width:820px){
  .backdrop{height:620px;background-position:72% top;opacity:.42}
  .backdrop:after{background:linear-gradient(180deg,#0a0a0acc 0%,#0a0a0a99 35%,#0a0a0a 92%)}
  .hero{grid-template-columns:1fr;grid-template-areas:"intro" "card" "offer";padding:32px 22px 48px;row-gap:28px}
  .top{padding:20px 22px}
  .top img{width:124px}
  .pill{font-size:11px;padding:7px 11px;letter-spacing:1px}
  h1{font-size:clamp(36px,10.4vw,48px);margin:18px 0 16px}
  .lead{font-size:15px}
  .card{padding:26px 22px;border-radius:18px}
  .card:before{left:22px;right:22px}
  h2{font-size:24px}
  .ticket,.facts{max-width:none}
  .how{padding:0 22px 52px}
  .how ol{grid-template-columns:1fr}
  .how li{display:grid;grid-template-columns:48px 1fr;column-gap:8px;padding:18px}
  .how b{grid-row:span 2;margin:0;font-size:30px}
  footer{display:block;margin:0 22px;line-height:2}
  footer span{display:block}
}
@media(max-width:480px){
  .ticket{grid-template-columns:1fr;gap:16px;padding:16px}
  .value{font-size:64px}
  .facts li{padding:12px}
  .facts strong{font-size:26px}
  .facts span{font-size:11px}
}
@media(max-width:360px){
  .pill{font-size:10px;padding:6px 9px}
  .top img{width:108px}
  h1{font-size:34px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.success-icon svg{stroke-dashoffset:0}}
.nw{white-space:nowrap}