/* =====================================================================
   DPL FUNNEL — THEME
   Direct-response layout, DPL brand colours.
   ===================================================================== */
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}

:root{
  /* brand */
  --blue:#1B4FA8; --blue-d:#0E2A5C; --blue-dd:#091C3E;
  --orange:#F9A03F; --orange-d:#F57C00;
  --red:#FF1414; --red-d:#D80000;
  --yellow:#FFD400;
  --ok:#8BC53F;

  --ink:#fff; --mut:#C8D4E6; --dim:#90A2BC;
  --line:rgba(255,255,255,.12);
  --panel:rgba(255,255,255,.055);

  --night:#07090F;      /* proof zone */
  --foot:#1E232B;       /* footer */
}

html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  background:var(--night); color:var(--ink);
  font:16px/1.6 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  overflow-x:hidden;
}
h1,h2,h3,h4,.btn,.brand,.stat b,.cta b{font-family:Poppins,Inter,sans-serif}
.wrap{max-width:980px;margin:0 auto;padding:0 18px}
.narrow{max-width:800px;margin-left:auto;margin-right:auto}
img{max-width:100%}

/* ====================== ALERT BAR ====================== */
.alert{background:#0B1016;border-bottom:1px solid rgba(255,255,255,.07);
  padding:12px 16px;text-align:center;font-size:14.5px;font-weight:600;
  line-height:1.4;letter-spacing:.005em;color:#fff}
.alert .dot{display:inline-block;margin-right:5px}
@media(max-width:560px){.alert{font-size:12.5px;padding:10px 12px}}

/* ====================== HERO ZONE ====================== */
/* the vivid part of the page: everything above the proof */
.day{
  background:
    radial-gradient(1100px 620px at 50% -180px, #2F6FD6 0%, rgba(47,111,214,0) 62%),
    radial-gradient(760px 520px at 8% 85%, rgba(90,140,235,.40) 0%, rgba(90,140,235,0) 60%),
    linear-gradient(165deg,#1B4FA8 0%,#143C85 32%,#0E2A5C 66%,#091C3E 100%);
  position:relative;
}
.day:after{content:"";position:absolute;left:0;right:0;bottom:0;height:200px;
  background:linear-gradient(180deg,rgba(7,9,15,0),var(--night));pointer-events:none}
.day>*{position:relative;z-index:1}

/* brand lockup */
.lock-up{display:flex;align-items:center;justify-content:center;gap:12px;padding:26px 0 0}
.lock-up img{width:54px;height:54px;border-radius:50%;background:#fff;flex:0 0 54px;
  box-shadow:0 4px 18px rgba(0,0,0,.4)}
.lock-up b{font-family:Poppins;font-weight:800;font-size:17px;letter-spacing:.12em;
  text-transform:uppercase;line-height:1.2}
@media(max-width:560px){
  .lock-up{gap:10px;padding-top:20px}
  .lock-up img{width:44px;height:44px;flex:0 0 44px}
  .lock-up b{font-size:13.5px;letter-spacing:.1em}
}

/* ====================== TYPE ====================== */
h1{font-size:clamp(27px,6.3vw,52px);line-height:1.2;font-weight:800;
  letter-spacing:-.028em;text-align:center}
h1 em{font-style:normal;color:var(--orange)}
h1 .hl{background:var(--yellow);color:#101010;padding:.02em .14em;border-radius:4px;
  box-decoration-break:clone;-webkit-box-decoration-break:clone}
.sub{color:rgba(255,255,255,.84);font-size:clamp(15px,3.6vw,19.5px);
  line-height:1.55;margin-top:16px;text-align:center}
.paren{color:rgba(255,255,255,.62);font-size:clamp(13.5px,3.2vw,15.5px);
  margin-top:11px;font-style:italic;text-align:center}

.kicker{display:inline-block;padding:7px 15px;border-radius:999px;
  border:1px solid rgba(249,160,63,.45);background:rgba(249,160,63,.13);color:var(--orange);
  font-size:11px;font-weight:700;letter-spacing:.13em;text-transform:uppercase}

/* ====================== VIDEO FRAME ====================== */
/* thick white border, the signature of this layout */
.frame{max-width:780px;margin:26px auto 0;background:#fff;padding:7px;border-radius:10px;
  box-shadow:0 30px 70px rgba(0,0,0,.5)}
.frame .inner{position:relative;width:100%;aspect-ratio:16/9;background:#000;
  border-radius:4px;overflow:hidden}
.frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
@media(max-width:560px){.frame{padding:5px;margin-top:20px;border-radius:8px}}

.poster{position:absolute;inset:0;z-index:2;cursor:pointer;background:#07172F center/cover no-repeat}
.poster:after{content:"";position:absolute;inset:0;background:rgba(6,16,36,.3)}

/* yellow ring play button */
.play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;
  width:92px;height:92px;border-radius:50%;border:7px solid var(--yellow);
  background:rgba(0,0,0,.22);display:flex;align-items:center;justify-content:center;
  animation:ring 2.5s infinite}
.play:after{content:"";width:0;height:0;margin-left:9px;
  border-left:28px solid var(--yellow);border-top:17px solid transparent;border-bottom:17px solid transparent}
@keyframes ring{0%,100%{box-shadow:0 0 0 0 rgba(255,212,0,.5)}70%{box-shadow:0 0 0 22px rgba(255,212,0,0)}}
@media(max-width:560px){.play{width:66px;height:66px;border-width:5px}
  .play:after{border-left-width:20px;border-top-width:12px;border-bottom-width:12px;margin-left:6px}}

/* "CLICK TO TURN ON SOUND" badge */
.sound{position:absolute;right:10px;top:10px;z-index:4;display:flex;align-items:center;gap:7px;
  background:#E80707;border-radius:7px;padding:6px 10px;
  box-shadow:0 5px 18px rgba(0,0,0,.45)}
.sound i{font-style:normal;font-size:14px;line-height:1}
.sound span{font-family:Poppins;font-weight:800;font-size:10.5px;line-height:1.1;
  letter-spacing:.02em;text-transform:uppercase;text-align:left}
@media(max-width:560px){.sound{right:7px;top:7px;padding:5px 8px}.sound span{font-size:9px}}

.tapsound{position:absolute;inset:0;z-index:5;display:none;cursor:pointer;
  background:rgba(6,16,36,.88);align-items:center;justify-content:center;flex-direction:column;
  gap:12px;text-align:center;padding:16px}
.tapsound b{font-family:Poppins;font-size:16px;font-weight:800}

/* ====================== THE RED CTA ====================== */
.cta{display:flex;align-items:center;justify-content:center;gap:clamp(10px,2.6vw,20px);
  width:100%;max-width:640px;margin:28px auto 0;padding:clamp(15px,3.4vw,22px) clamp(14px,3vw,26px);
  border:0;border-radius:14px;cursor:pointer;text-decoration:none;
  background:linear-gradient(180deg,var(--red),var(--red-d));
  box-shadow:0 14px 38px rgba(255,20,20,.34),inset 0 1px 0 rgba(255,255,255,.22);
  transition:transform .12s,filter .18s;animation:beat 2.6s infinite}
.cta:hover{filter:brightness(1.07)}
.cta:active{transform:translateY(2px)}
@keyframes beat{0%,100%{box-shadow:0 14px 38px rgba(255,20,20,.34),inset 0 1px 0 rgba(255,255,255,.22)}
  50%{box-shadow:0 14px 48px rgba(255,20,20,.6),inset 0 1px 0 rgba(255,255,255,.22)}}

.cta .ic{flex:0 0 auto;width:clamp(34px,7.4vw,50px);height:clamp(34px,7.4vw,50px);border-radius:50%;
  border:3px solid #fff;display:flex;align-items:center;justify-content:center}
.cta .ic:after{content:"";width:0;height:0;margin-left:4px;
  border-left:clamp(11px,2.4vw,16px) solid #fff;
  border-top:clamp(7px,1.5vw,10px) solid transparent;border-bottom:clamp(7px,1.5vw,10px) solid transparent}
.cta b{flex:1 1 auto;color:#fff;font-weight:800;font-style:italic;text-transform:uppercase;
  font-size:clamp(14.5px,3.5vw,26px);line-height:1.14;letter-spacing:-.01em;text-align:center}
.cta .ch{flex:0 0 auto;color:#fff;font-size:clamp(20px,4.6vw,34px);font-weight:900;line-height:1;
  letter-spacing:-.12em;opacity:.95}
.cta.lock{background:linear-gradient(180deg,#3A4761,#2B364C);
  box-shadow:none;animation:none;cursor:not-allowed}
.cta.lock b,.cta.lock .ch{color:#8698B5}
.cta.lock .ic{border-color:#8698B5}
.cta.lock .ic:after{border-left-color:#8698B5}

/* value-stack line under the CTA */
.vstack{max-width:760px;margin:17px auto 0;text-align:center;
  color:rgba(255,255,255,.88);font-size:clamp(13.5px,3.3vw,17px);line-height:1.5}
.vstack s{opacity:.7}
.vstack b{color:var(--yellow);font-weight:700}
.night .vstack{color:rgba(255,255,255,.8)}

/* ====================== SCARCITY BAR ====================== */
.scar{display:flex;align-items:center;justify-content:center;gap:3px;margin:16px auto 0;
  flex-wrap:nowrap;max-width:420px}
.scar i{flex:1 1 0;height:20px;border-radius:2px;background:#4A5162;min-width:0}
.scar i.on{background:var(--ok);position:relative}
.scar i.on:after{content:"✓";position:absolute;inset:0;display:flex;align-items:center;
  justify-content:center;color:#15300A;font-size:11px;font-weight:900;font-style:normal}
.scarl{text-align:center;margin-top:9px;font-size:12.5px;color:rgba(255,255,255,.72)}
.scarl b{color:var(--ok);font-weight:700}

/* ====================== SECTIONS ====================== */
section{padding:52px 0}
.night{background:var(--night)}
.sechead{text-align:center;max-width:720px;margin:0 auto 28px}
.sechead h2{font-size:clamp(22px,5.2vw,34px);line-height:1.18;font-weight:800;letter-spacing:-.025em}
.sechead p{color:var(--mut);margin-top:11px;font-size:clamp(14px,3.3vw,16px)}
.eyebrow{color:var(--orange);font-size:11px;font-weight:700;letter-spacing:.15em;
  text-transform:uppercase;margin-bottom:11px}

/* ====================== DASHED OFFER BOX ====================== */
.dash{max-width:780px;margin:16px auto 0;padding:clamp(16px,3.6vw,26px);
  border:2px dashed rgba(255,255,255,.5);border-radius:10px;text-align:center;
  color:rgba(255,255,255,.92);font-size:clamp(14px,3.3vw,17px);line-height:1.6}
.dash b{color:var(--yellow)}

/* ====================== TICK / CROSS GRID ====================== */
.grid{display:grid;gap:12px}
@media(min-width:700px){.grid.two{grid-template-columns:1fr 1fr}.grid .full{grid-column:1/-1}}
.item{display:flex;gap:13px;align-items:flex-start;padding:16px;background:var(--panel);
  border:1px solid var(--line);border-radius:12px}
.chk{flex:0 0 23px;width:23px;height:23px;border-radius:50%;margin-top:2px;
  background:rgba(139,197,63,.17);border:1px solid rgba(139,197,63,.5);display:flex;
  align-items:center;justify-content:center;color:var(--ok);font-size:12px;font-weight:800}
.chk.no{background:rgba(255,90,90,.14);border-color:rgba(255,90,90,.45);color:#FF6B6B}
.chk.n{background:rgba(249,160,63,.16);border-color:rgba(249,160,63,.45);color:var(--orange);
  border-radius:7px;font-family:Poppins;font-size:12.5px}
.item p{font-size:clamp(13.8px,3.3vw,15px);line-height:1.56}
.item p b{color:#fff;font-weight:700}

/* ====================== STAT STRIP ====================== */
.stat{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,.14);
  border:1px solid var(--line);border-radius:13px;overflow:hidden;max-width:700px;margin:0 auto}
.stat div{background:#0C203F;padding:17px 6px;text-align:center}
.stat b{display:block;font-size:clamp(17px,4.4vw,23px);color:var(--orange)}
.stat span{font-size:9.5px;color:var(--mut);letter-spacing:.07em;text-transform:uppercase;
  display:block;margin-top:4px;line-height:1.3}
@media(max-width:560px){.stat{grid-template-columns:repeat(2,1fr)}}

/* ====================== FORM ====================== */
.formcard{max-width:500px;margin:26px auto 0;padding:24px 20px 20px;border-radius:16px;
  background:linear-gradient(180deg,#102F63,#0B2148);border:1px solid rgba(249,160,63,.34);
  box-shadow:0 26px 66px rgba(0,0,0,.5);text-align:left;scroll-margin-top:14px}
.formcard .fh{text-align:center;margin-bottom:17px}
.formcard .fh h3{font-size:clamp(18px,4.4vw,22px);font-weight:800;letter-spacing:-.018em;line-height:1.28}
.formcard .fh p{color:var(--mut);font-size:13px;margin-top:8px;line-height:1.55}
.formcard .cta{margin-top:5px}
.fld{margin-bottom:11px;position:relative}
input{width:100%;padding:15px 14px;background:rgba(255,255,255,.07);border:1px solid var(--line);
  border-radius:10px;color:#fff;font-size:16px;font-family:Inter;outline:none;transition:border-color .15s}
input::placeholder{color:var(--dim)}
input:focus{border-color:var(--orange);background:rgba(255,255,255,.1)}
input.bad{border-color:#FF6B6B}
.phone input{padding-left:66px}
.flag{position:absolute;left:1px;top:1px;bottom:1px;width:60px;display:flex;align-items:center;
  justify-content:center;border-right:1px solid var(--line);font-size:13px;color:var(--mut);pointer-events:none}
.err{display:none;color:#FF8080;font-size:13px;margin-bottom:10px;text-align:center}
.mfoot{margin-top:13px;text-align:center;color:var(--dim);font-size:11.5px;line-height:1.65}
.lockpill{display:inline-block;padding:5px 12px;border-radius:999px;background:rgba(139,197,63,.14);
  border:1px solid rgba(139,197,63,.34);color:var(--ok);font-size:10.5px;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;margin-bottom:12px}
.trust{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:7px 16px;
  margin-top:14px;color:var(--dim);font-size:11.5px}
.trust i{font-style:normal;display:inline-flex;align-items:center;gap:5px}
@media(max-width:560px){.formcard{padding:20px 15px 17px;border-radius:14px}}

/* ====================== INSTAGRAM PROOF CARD ====================== */
.igs{display:grid;gap:16px}
@media(min-width:760px){.igs{grid-template-columns:repeat(3,1fr)}}
.ig{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 18px 44px rgba(0,0,0,.45);display:flex;flex-direction:column}
/* fixed-height header so every card's video starts on the same line */
.igtop{min-height:176px;display:flex;flex-direction:column}
.ighd{padding:14px 14px 11px;display:flex;gap:12px;align-items:flex-start}
.igav{flex:0 0 58px;width:58px;height:58px;border-radius:50%;padding:2.5px;
  background:linear-gradient(45deg,#F9A03F,#E1306C,#C13584)}
.igav img{width:100%;height:100%;border-radius:50%;object-fit:cover;border:2px solid #fff;display:block}
.igid{min-width:0;flex:1}
.ighandle{display:flex;align-items:center;gap:4px;font-size:14.5px;font-weight:700;color:#111;
  font-family:Inter;line-height:1.2;word-break:break-word}
.igtick{flex:0 0 13px;width:13px;height:13px}
.igname{font-size:12px;color:#5A5A5A;margin-top:2px;line-height:1.3}
.igstats{display:flex;gap:11px;margin-top:6px;font-size:11.5px;color:#262626;flex-wrap:wrap}
.igstats span b{font-weight:700}
.igbio{padding:0 14px 12px;font-size:11.8px;line-height:1.5;color:#262626}
.igbio .cat{color:#5A5A5A;display:block;margin-bottom:3px}
.igbio a{color:#00376B;text-decoration:none;font-weight:600;word-break:break-all}
.igvid{position:relative;width:100%;aspect-ratio:9/16;background:#000;cursor:pointer;display:block}
.igvid video{width:100%;height:100%;object-fit:cover;display:block}
.igvid .play{width:74px;height:74px;border-width:6px}
.igvid .sound{top:auto;bottom:10px;right:10px}
.igvid .play:after{border-left-width:22px;border-top-width:13px;border-bottom-width:13px;margin-left:7px}
.igfoot{margin-top:auto;padding:11px 14px;display:flex;align-items:center;justify-content:space-between;gap:8px;
  border-top:1px solid #EFEFEF}
.igfoot b{font-size:12.5px;color:#111;font-family:Poppins;font-weight:700;line-height:1.3}
.igfoot span{font-size:10.5px;color:#8E8E8E;letter-spacing:.04em;text-transform:uppercase;flex:0 0 auto}

/* ====================== BRAND WALL ====================== */
.brands{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;max-width:800px;margin:0 auto}
.bcell{border-radius:13px;overflow:hidden;border:1px solid var(--line);background:var(--panel);
  aspect-ratio:1/1;transition:transform .16s,border-color .16s}
.bcell:hover{transform:translateY(-3px);border-color:rgba(249,160,63,.5)}
.bcell img{width:100%;height:100%;object-fit:cover;display:block}
.bcell.more{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
  text-align:center;padding:10px;background:rgba(249,160,63,.09);border-color:rgba(249,160,63,.34)}
.bcell.more b{font-family:Poppins;font-size:clamp(17px,4vw,24px);font-weight:800;color:var(--orange);line-height:1}
.bcell.more span{font-size:9.5px;color:var(--mut);letter-spacing:.08em;text-transform:uppercase;line-height:1.35}
@media(max-width:700px){.brands{grid-template-columns:repeat(3,1fr);gap:9px}}

/* ====================== PROOF SCREENSHOTS ====================== */
.proof{display:grid;gap:14px;max-width:860px;margin:0 auto}
@media(min-width:780px){.proof{grid-template-columns:1fr 1fr}.proof .wide{grid-column:1/-1}}
.shot{background:#fff;padding:5px;border-radius:12px;overflow:hidden;cursor:zoom-in;
  box-shadow:0 14px 36px rgba(0,0,0,.4);transition:transform .16s}
.shot:hover{transform:translateY(-3px)}
.shot img{width:100%;height:auto;aspect-ratio:2/1;display:block;border-radius:7px;background:#0B0B0B}
.shotcap{padding:9px 6px 4px;text-align:center}
.shotcap em{font-style:normal;font-size:10.5px;color:#6B6B6B;letter-spacing:.09em;text-transform:uppercase}
.shot:hover .shotcap em{color:var(--red-d)}

#lb{position:fixed;inset:0;z-index:9997;display:none;background:rgba(3,6,12,.96);
  overflow:auto;padding:14px;text-align:center}
#lb img{max-width:1100px;width:100%;border-radius:12px;margin-top:8px}
#lbx{position:sticky;top:0;margin-left:auto;display:block;width:40px;height:40px;border-radius:50%;
  background:#16233C;border:1px solid var(--line);color:#fff;font-size:21px;cursor:pointer;line-height:1}

/* ====================== STAGES ====================== */
.stage{background:var(--panel);border:1px solid var(--line);border-radius:14px;
  padding:20px 18px;margin-bottom:13px}
.stagehd{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.num{flex:0 0 36px;width:36px;height:36px;border-radius:9px;display:flex;align-items:center;
  justify-content:center;background:rgba(249,160,63,.16);border:1px solid rgba(249,160,63,.45);
  color:var(--orange);font-family:Poppins;font-weight:800;font-size:16px}
.stagehd h3{font-size:clamp(15.5px,3.8vw,18px);font-weight:800;line-height:1.3}
.stagehd small{display:block;color:var(--orange);font-size:11px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;margin-bottom:3px}
.stage ul{list-style:none;margin:0}
.stage li{position:relative;padding-left:20px;margin-bottom:10px;
  font-size:clamp(13.8px,3.3vw,15px);line-height:1.56;color:#D6DFEC}
.stage li:last-child{margin-bottom:0}
.stage li:before{content:"";position:absolute;left:3px;top:9px;width:6px;height:6px;
  border-radius:50%;background:var(--orange)}
.stage li b{color:#fff;font-weight:700}

/* ====================== OFFER PANEL ====================== */
.offer{max-width:700px;margin:0 auto;padding:24px 20px;border-radius:14px;
  background:rgba(139,197,63,.07);border:1px solid rgba(139,197,63,.3)}
.offer h3{font-size:clamp(16.5px,4vw,20px);font-weight:800;color:var(--ok);margin-bottom:11px}
.offer p{font-size:clamp(13.8px,3.3vw,15px);color:#D6DFEC;line-height:1.62}
.offer p+p{margin-top:10px}

/* ====================== MISC ====================== */
.under{margin-top:11px;text-align:center;color:var(--mut);font-size:12.5px}
.slots{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:11px;
  color:var(--mut);font-size:12.5px}
.slots b{color:var(--orange)}
.blip{width:7px;height:7px;border-radius:50%;background:var(--ok);animation:blip 1.8s infinite;
  box-shadow:0 0 0 0 rgba(139,197,63,.6)}
@keyframes blip{70%{box-shadow:0 0 0 9px rgba(139,197,63,0)}100%{box-shadow:0 0 0 0 rgba(139,197,63,0)}}

/* sticky mobile bar */
#sticky{position:fixed;left:0;right:0;bottom:0;z-index:9000;display:none;
  padding:9px 14px calc(9px + env(safe-area-inset-bottom));
  background:rgba(7,13,26,.97);border-top:1px solid rgba(255,20,20,.3);backdrop-filter:blur(8px)}
#sticky .cta{margin:0;padding:13px 14px;animation:none}
#sticky .cta b{font-size:14.5px}
@media(min-width:880px){#sticky{display:none !important}}

#calwrap{position:fixed;inset:0;z-index:9999;display:none;background:rgba(3,6,12,.97);
  overflow:auto;padding:14px}
#calx{position:sticky;top:0;margin-left:auto;display:block;width:40px;height:40px;border-radius:50%;
  background:#16233C;border:1px solid var(--line);color:#fff;font-size:21px;cursor:pointer;line-height:1}
#cal-embed{max-width:900px;margin:0 auto;min-height:650px}

/* ====================== FOOTER ====================== */
footer{background:var(--foot);padding:36px 0 46px;text-align:center}
.fbrand{display:flex;align-items:center;justify-content:center;gap:10px;font-family:Poppins;
  font-weight:800;font-size:13px;letter-spacing:.13em;text-transform:uppercase;margin-bottom:15px}
.fbrand img{width:44px;height:44px;flex:0 0 44px;border-radius:50%;background:#fff;display:block}
.copy{color:#9AA5B4;font-size:12.5px;margin-bottom:15px}
.disc{color:#79838F;font-size:11px;line-height:1.8;max-width:780px;margin:0 auto}
.disc a{color:#A8B2BF}
