/* Valley Fest 2027 — win.css (win.html: Christmas VIP Package competition, build 266)
   Loads after stylesheet.css and sponsor.css; scoped to body.sl.win. Deep navy night, a giant morphing rainbow blob
   (the social-post blob, alive), drifting snow, cream type, the tent photo as the hero's anchor. */
body.sl.win{
  --w-cream:#FFF6E6; --w-navy:#0A143C; --w-ink:#060B26; --w-pink:#FF4FB3; --w-violet:#9B5CFF;
  --w-rb:linear-gradient(120deg,#FF5A5F 0%,#FF9A3C 18%,#FFD23F 34%,#3EE08F 52%,#3FA9FF 70%,#9B5CFF 86%,#FF4FB3 100%);
  --sl-sunset:var(--w-rb);
  background:var(--w-ink);
}
.win .sl-btn.primary{background:var(--w-cream);color:var(--w-navy);box-shadow:0 12px 30px rgba(255,246,230,.25)}
.win .sl-btn.primary:hover{box-shadow:0 16px 40px rgba(255,246,230,.4)}
.win .sl-btn.rb{background:var(--w-rb);background-size:200% 100%;color:var(--w-navy);box-shadow:0 14px 40px -10px rgba(255,79,179,.6);animation:w-flow 6s linear infinite}
.win .sl-btn.rb:hover{box-shadow:0 18px 50px -10px rgba(255,79,179,.8)}
@keyframes w-flow{to{background-position:200% 0}}
.win .sl-eyebrow{color:#FFD23F}
.win .sl-logo span{color:#FFD23F}

/* snow */
.w-snow{position:fixed;inset:0;pointer-events:none;z-index:1}

/* ---- hero ---- */
.w-hero{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:center;padding:120px 0 70px;overflow:hidden;isolation:isolate;
  background:radial-gradient(60% 50% at 75% 30%,rgba(155,92,255,.28),transparent 60%),radial-gradient(50% 50% at 15% 85%,rgba(63,169,255,.2),transparent 60%),linear-gradient(180deg,#0E1A52 0%,#060B26 100%)}
.w-hero .sl-wrap{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,4vw,64px);align-items:center;width:100%}

.w-blobwrap{position:relative}
.w-pill{display:inline-block;padding:9px 20px;border-radius:999px;background:var(--w-cream);color:#E8482F;font-weight:800;font-size:clamp(14px,1.4vw,19px);letter-spacing:.06em;text-transform:uppercase;box-shadow:0 10px 24px -10px rgba(0,0,0,.4);margin-bottom:clamp(10px,1.4vw,18px)}
.w-hero h1{font-weight:800;font-size:clamp(58px,8vw,124px);line-height:.86;letter-spacing:-.015em;margin:0;color:var(--w-cream);text-transform:uppercase;text-shadow:none}
.w-hero h1 small{display:block;font-size:.4em;letter-spacing:.02em;margin-bottom:.1em;color:var(--w-cream)}
.w-hero h1 .rb{display:block;background:var(--w-rb);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:w-flow 8s linear infinite;padding-bottom:.06em;filter:drop-shadow(0 10px 30px rgba(255,79,179,.35))}
.w-flake{position:absolute;color:#fff;opacity:.9;filter:drop-shadow(0 2px 6px rgba(10,20,60,.35));animation:w-spin 12s linear infinite}
.w-flake svg{display:block;width:100%;height:100%}
@keyframes w-spin{to{transform:rotate(360deg)}}
.w-sub{font-size:clamp(18px,1.7vw,23px);line-height:1.45;color:rgba(255,246,230,.92);margin:24px 0 0;max-width:560px}
.w-sub b{color:#fff}
.w-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.w-section .w-ctas,.sl-close .w-ctas,.w-done .w-ctas{justify-content:center}

/* the photo card */
.w-photo{position:relative;justify-self:center;width:min(100%,430px)}
.w-photo img{display:block;width:100%;height:auto;max-height:72vh;aspect-ratio:4/5;object-fit:cover;object-position:50% 70%;border-radius:32px;box-shadow:0 40px 80px -30px rgba(0,0,0,.8);transform:rotate(2.5deg);border:6px solid var(--w-cream)}
.w-sticker{position:absolute;display:grid;place-items:center;text-align:center;border-radius:50%;font-weight:800;line-height:1;box-shadow:0 14px 30px -10px rgba(0,0,0,.5)}
.w-sticker.free{left:-26px;top:22px;width:118px;height:118px;background:#FFD23F;color:var(--w-navy);transform:rotate(-12deg);font-size:15px;letter-spacing:.04em;text-transform:uppercase}
.w-sticker.free b{display:block;font-size:30px;letter-spacing:0}
.w-sticker.four{right:-18px;bottom:46px;width:132px;height:132px;background:var(--w-pink);color:#fff;transform:rotate(10deg);font-size:14px;text-transform:uppercase;letter-spacing:.05em}
.w-sticker.four b{display:block;font-size:46px;letter-spacing:0}

/* countdown */
.w-clock{display:flex;gap:10px;margin-top:26px}
.w-clock div{min-width:84px;padding:12px 8px;border-radius:18px;background:rgba(255,246,230,.08);border:1px solid rgba(255,246,230,.18);backdrop-filter:blur(6px);text-align:center}
.w-clock b{display:block;font-size:clamp(28px,3vw,40px);font-weight:800;line-height:1;font-variant-numeric:tabular-nums;color:#fff}
.w-clock span{font-size:11.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,246,230,.6)}
.w-closes{display:block;margin-top:10px;font-weight:700;font-size:14px;color:rgba(255,246,230,.7)}

/* ---- prize ---- */
.w-section{position:relative;z-index:2;padding:clamp(70px,8vw,110px) 0}
.w-section.alt{background:#0B1440}
.w-head{text-align:center;max-width:760px;margin:0 auto clamp(30px,4vw,50px)}
.w-head .sl-lead{margin:0 auto}
.w-prize{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:18px}
.w-card{position:relative;border-radius:28px;padding:28px;overflow:hidden;min-height:260px;display:flex;flex-direction:column;justify-content:flex-end;isolation:isolate}
.w-card h3{font-size:clamp(24px,2.4vw,32px);font-weight:800;line-height:1.05;margin:10px 0 8px;color:#fff;text-shadow:0 2px 14px rgba(0,0,0,.4)}
.w-card p{margin:0;color:rgba(255,255,255,.9);font-size:16px;line-height:1.5}
.w-card .num{font-size:clamp(70px,8vw,110px);font-weight:800;line-height:.85;color:#fff;opacity:.95}
.w-card.tent{grid-row:span 2;min-height:540px}
.w-card.tent::before{content:"";position:absolute;inset:0;z-index:-1;background:url('../img/win/vip-bell-tent.jpg') center 30%/cover}
.w-card.tent::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(6,11,38,0) 35%,rgba(6,11,38,.9) 100%)}
.w-card.tix{background:linear-gradient(135deg,#FF5A5F,#FF9A3C 60%,#FFD23F)}
.w-card.vip{background:linear-gradient(135deg,#3FA9FF,#9B5CFF 60%,#FF4FB3)}
.w-card.when{background:linear-gradient(135deg,#3EE08F,#1FA463)}
.w-card.free{background:#FFF6E6}
.w-card.free h3,.w-card.free p,.w-card.free .num{color:var(--w-navy);text-shadow:none}
.w-card .tag{align-self:flex-start;padding:5px 12px;border-radius:999px;background:rgba(255,255,255,.22);color:#fff;font-size:12.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;backdrop-filter:blur(4px)}
.w-card.free .tag{background:rgba(10,20,60,.08);color:var(--w-navy)}

/* how to enter */
.w-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:1040px;margin:0 auto}
.w-step{padding:24px;border-radius:24px;background:rgba(255,246,230,.05);border:1px solid rgba(255,246,230,.12)}
.w-step b{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--w-rb);color:var(--w-navy);font-size:22px;font-weight:800;margin-bottom:14px}
.w-step h3{font-size:21px;font-weight:800;margin:0 0 6px}
.w-step p{margin:0;color:rgba(255,246,230,.75);line-height:1.5}

/* the entry form */
.w-form{position:relative;max-width:720px;margin:0 auto;padding:clamp(24px,3vw,40px);border-radius:32px;background:#0E1A52;isolation:isolate}
.w-form::before{content:"";position:absolute;inset:-3px;z-index:-1;border-radius:35px;background:var(--w-rb);background-size:200% 200%;animation:w-hue 8s linear infinite}
.w-form::after{content:"";position:absolute;inset:0;z-index:-1;border-radius:32px;background:#0E1A52}
.w-form h2,.w-form form > h2{text-align:center;font-weight:800;font-size:clamp(28px,3vw,40px);margin:0 0 6px;color:#fff}
.w-form > p,.w-form form > p:not(.hp):not(.err){text-align:center;color:rgba(255,246,230,.75);margin:0 0 22px}
.w-form .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.w-form label.f{display:grid;gap:6px;font-weight:700;font-size:14.5px;margin-bottom:12px;color:#fff}
.w-form input[type=text],.w-form input[type=email]{width:100%;background:#060B26;border:1px solid rgba(255,246,230,.18);border-radius:16px;color:#fff;font:inherit;font-size:17px;padding:14px 16px}
.w-form input:focus{outline:none;border-color:#FFD23F;box-shadow:0 0 0 3px rgba(255,210,63,.25)}
.w-form .check{display:flex;gap:12px;align-items:flex-start;font-size:15px;color:rgba(255,246,230,.85);margin:10px 0;line-height:1.45;cursor:pointer}
.w-form .check input{margin-top:3px;width:20px;height:20px;accent-color:#FF4FB3;flex:none}
.w-form .check a{color:#FFD23F}
.w-form .sl-btn{width:100%;min-height:62px;font-size:20px;margin-top:14px}
.w-form .err{color:#FF9AA5;font-weight:700;min-height:1.4em;margin:12px 0 0;text-align:center}
.w-form .hp{display:none}
.w-done{display:none;text-align:center;padding:10px 0}
.w-done h2{font-size:clamp(34px,4vw,52px)}
.w-done p{color:rgba(255,246,230,.85);font-size:18px;max-width:520px;margin:10px auto 0}
.w-form.sent form{display:none}.w-form.sent .w-done{display:block}
.w-form.closed form{opacity:.45;pointer-events:none}
.w-closed-note{display:none;text-align:center;font-weight:800;color:#FFD23F;margin:0 0 16px}
.w-form.closed .w-closed-note{display:block}

/* terms */
.w-terms{max-width:820px;margin:0 auto}
.w-terms details{background:rgba(255,246,230,.04);border:1px solid rgba(255,246,230,.12);border-radius:20px;padding:18px 22px}
.w-terms summary{cursor:pointer;font-weight:800;font-size:18px}
.w-terms ol{margin:14px 0 0;padding-left:20px;color:rgba(255,246,230,.78);line-height:1.6;font-size:15px}
.w-terms li{margin-bottom:6px}

.w-bar{position:fixed;left:12px;right:12px;bottom:12px;z-index:70;display:none;align-items:center;justify-content:space-between;gap:12px;padding:10px 10px 10px 18px;border-radius:999px;background:rgba(6,11,38,.94);border:1px solid rgba(255,246,230,.15);backdrop-filter:blur(12px)}
.w-bar b{font-size:16px}.w-bar small{display:block;color:rgba(255,246,230,.6);font-size:12px}
.w-bar .sl-btn{min-height:44px;padding:0 20px}

@media (max-width:980px){
  .w-hero .sl-wrap{grid-template-columns:1fr}
  .w-hero{padding-top:104px}
  .w-photo{width:min(78%,380px);margin-top:10px}
  .w-prize{grid-template-columns:1fr 1fr}
  .w-card.tent{grid-column:1/-1;grid-row:auto;min-height:420px}
  .w-steps{grid-template-columns:1fr}
  .sl-nav ul{display:none}
  .w-bar{display:flex}
  .sl-foot{padding-bottom:110px}
}
@media (max-width:560px){
  .sl-wrap{padding:0 16px}
  .w-hero h1{font-size:17vw}
  .w-prize{grid-template-columns:1fr}
  .w-card{min-height:200px}
  .w-form .row{grid-template-columns:1fr}
  .w-clock div{min-width:70px}
  .w-sticker.free{left:-12px;width:96px;height:96px;font-size:12px}.w-sticker.free b{font-size:24px}
  .w-sticker.four{right:-10px;width:104px;height:104px;font-size:11px}.w-sticker.four b{font-size:36px}
}
@media (prefers-reduced-motion:reduce){.w-hero h1 .rb,.win .sl-btn.rb,.w-form::before{animation:none}.w-snow{display:none}}
