/* DigiBroX marketing site — styles */
*{margin:0;padding:0;box-sizing:border-box}
body{background:#0F172A;font-family:Inter,system-ui,-apple-system,sans-serif;color:#E6ECF4;width:100%;overflow-x:hidden}
a{text-decoration:none;color:inherit}
.wrap{max-width:1180px;margin:0 auto;padding:0 48px}
.gold{color:#F4BE38}
.btn{display:inline-block;background:linear-gradient(180deg,#F6CD5B,#E0A21F);color:#1a1407;font-weight:800;
  padding:13px 26px;border-radius:11px;font-size:16px;box-shadow:0 8px 22px rgba(224,162,31,.26)}
.ghost{display:inline-flex;align-items:center;gap:9px;color:#E6ECF4;font-weight:600;font-size:16px;opacity:.9}
.eyebrow{color:#7FD7FD;font-weight:700;font-size:13px;letter-spacing:2.5px;text-transform:uppercase}

/* NAV */
nav{position:sticky;top:0;z-index:50;background:rgba(15,23,42,.82);backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(255,255,255,.06)}
.navin{max-width:1180px;margin:0 auto;padding:0 48px;height:74px;display:flex;align-items:center;justify-content:space-between}
.navin img{height:26px}
.nlinks{display:flex;align-items:center;gap:34px}
.nlinks a{color:#CDD5E1;font-size:15px;font-weight:500}
.nlinks .btn{color:#1a1407}

/* HERO (clean: copy left, video right) */
.hero{padding:86px 0 90px;display:grid;grid-template-columns:1fr 1.08fr;
  column-gap:64px;align-items:center}
.hcopy{display:flex;flex-direction:column;align-items:flex-start}
.hero h1{font-size:60px;line-height:1.03;letter-spacing:-1.8px;color:#fff;font-weight:800;margin:18px 0 22px}
.hcopy p{font-size:20px;line-height:1.5;color:#AEB8C6;max-width:520px}
.hbtn{margin-top:34px}
.video{position:relative;border-radius:16px;overflow:hidden;aspect-ratio:16/10;
  background:radial-gradient(ellipse at 60% 40%,#1c2950,#0d1426);border:1px solid rgba(255,255,255,.08);
  box-shadow:0 40px 90px rgba(0,0,0,.5)}
.video video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.video .play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px;
  background:rgba(10,15,28,.22);border:none;cursor:pointer;width:100%;font-family:inherit}
.video .pc{width:78px;height:78px;border-radius:50%;background:linear-gradient(180deg,#F6CD5B,#E0A21F);
  display:flex;align-items:center;justify-content:center;box-shadow:0 12px 36px rgba(224,162,31,.5)}
.video .pc:after{content:"";border-style:solid;border-width:14px 0 14px 24px;border-color:transparent transparent transparent #1a1407;margin-left:6px}
.video .lbl{color:#cdd5e1;font-size:14px;font-weight:600;letter-spacing:.5px}

/* IN-HERO PROOF ROW */
.hproof{display:flex;align-items:center;gap:22px;margin-top:40px;
  padding-top:24px;border-top:1px solid rgba(255,255,255,.07)}
.hproof span{color:#64748B;font-size:12px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase}
.hproof img{height:38px;border-radius:8px;opacity:.92}

/* PLACEMENT GRIND (own calm zone) */
.grind{padding:78px 0 92px;text-align:center;border-top:1px solid rgba(255,255,255,.05);
  background:radial-gradient(ellipse at 50% 22%,rgba(127,215,253,.05),transparent 60%)}
.grind h2{font-size:40px;line-height:1.1;letter-spacing:-.8px;color:#fff;font-weight:800;margin:14px auto 4px;max-width:760px}
.grindpay{font-size:21px;font-weight:600;color:#CDD5E1;margin:18px auto 0;max-width:640px}
.stagewrap{position:relative;width:460px;height:460px;margin:26px auto 4px;max-width:100%}
#stage{position:absolute;inset:0}
#stage svg{position:absolute;inset:0;width:460px;height:460px;overflow:visible}
.card{position:absolute;display:flex;align-items:center;gap:10px;
  background:linear-gradient(180deg,#1b2747,#141d35);
  border:1px solid rgba(244,190,56,.28);border-radius:13px;
  padding:7px 14px 7px 9px;min-height:54px;min-width:128px;
  box-shadow:0 9px 22px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.04);
  transform:translate(-50%,-50%)}
.card .num{flex:none;width:31px;height:31px;border-radius:50%;
  background:radial-gradient(circle at 30% 30%,#ffd873,#F4BE38);
  color:#0F172A;font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center;
  box-shadow:0 2px 8px rgba(244,190,56,.45)}
.card .lbl{color:#fff;font-weight:600;font-size:13.5px;line-height:1.16;text-align:left}
.med{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:172px;height:172px;border-radius:50%;
  background:radial-gradient(circle at 50% 35%,#1c2a4d,#0d1426);
  border:1.5px solid rgba(244,190,56,.55);
  box-shadow:0 0 0 6px rgba(244,190,56,.06),0 18px 50px rgba(0,0,0,.55),inset 0 0 40px rgba(244,190,56,.06);
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.med img{width:104px;display:block;filter:drop-shadow(0 2px 6px rgba(0,0,0,.5))}
.med .s{color:#94A3B8;font-weight:500;font-size:11.5px;margin-top:9px;line-height:1.35}
.med .dot{width:5px;height:5px;border-radius:50%;background:#7FD7FD;margin-top:9px;box-shadow:0 0 10px 2px rgba(127,215,253,.7)}

/* POLICY INTAKE PIPELINE */
.intake{padding:96px 0;text-align:center;border-top:1px solid rgba(255,255,255,.05)}
.intake h2{font-size:42px;line-height:1.08;letter-spacing:-.8px;color:#fff;font-weight:800;margin:16px 0 0}
.pipe{display:flex;align-items:stretch;gap:0;margin-top:48px;text-align:left}
.ipanel{flex:1;display:flex;flex-direction:column;background:linear-gradient(180deg,#16213c,#111a30);
  border:1px solid rgba(94,124,160,.28);border-radius:18px;padding:22px 24px;
  box-shadow:0 16px 40px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.04)}
.iarrow{flex:none;width:56px;display:flex;align-items:center;justify-content:center}
.istep{color:#F4BE38;font-weight:800;font-size:12px;letter-spacing:1.5px;text-transform:uppercase}
.iptitle{color:#fff;font-weight:700;font-size:19px;margin-top:6px}
.drop{margin-top:20px;flex:1;min-height:236px;border:2px dashed rgba(244,190,56,.55);border-radius:14px;
  background:rgba(244,190,56,.04);position:relative;display:flex;align-items:center;justify-content:center}
.file{position:absolute;width:74px;height:92px;border-radius:9px;background:linear-gradient(180deg,#fff,#e7ecf3);
  box-shadow:0 12px 26px rgba(0,0,0,.5)}
.file:after{content:"";position:absolute;top:0;right:0;border-width:0 18px 18px 0;border-style:solid;
  border-color:#0F172A #0F172A transparent transparent;border-top-right-radius:9px}
.file .ftag{position:absolute;left:8px;bottom:12px;background:#E23b3b;color:#fff;font-size:9px;font-weight:800;
  padding:2px 6px;border-radius:4px;letter-spacing:.5px}
.file .ln{position:absolute;left:8px;right:10px;height:3px;border-radius:2px;background:#c3ccd8}
.f1{transform:rotate(-11deg);top:36px;left:24%}
.f2{transform:rotate(7deg);top:58px;left:46%;opacity:.92}
.f3{transform:rotate(-3deg);top:110px;left:34%;opacity:.85}
.caparrow{position:absolute;bottom:16px;left:0;right:0;text-align:center;color:#7FD7FD;font-weight:700;font-size:14px}
.rec{margin-top:20px;background:#0c1322;border:1px solid rgba(94,124,160,.3);border-radius:12px;overflow:hidden}
.rh{padding:12px 16px;background:rgba(127,215,253,.08);border-bottom:1px solid rgba(94,124,160,.25);
  color:#fff;font-weight:700;font-size:15px}
.rrow{display:flex;justify-content:space-between;padding:10px 16px;border-bottom:1px solid rgba(94,124,160,.13);font-size:14px}
.rrow:last-child{border-bottom:none}
.rrow .rk{color:#94A3B8}.rrow .rv{color:#fff;font-weight:600}.rrow .rv.hl{color:#F4BE38}
.rbadge{margin-top:16px;align-self:flex-start;display:inline-flex;align-items:center;gap:7px;background:rgba(244,190,56,.12);
  border:1px solid rgba(244,190,56,.4);border-radius:20px;padding:6px 13px;color:#F4BE38;font-weight:700;font-size:13px}
.qbar{margin-top:20px;display:flex;align-items:center;gap:10px;background:#0c1322;border:1px solid rgba(127,215,253,.4);
  border-radius:11px;padding:13px 15px;color:#fff;font-size:14.5px;font-weight:500}
.qbar .qic{color:#7FD7FD;font-size:16px}
.ans{margin-top:16px;background:rgba(244,190,56,.07);border-left:3px solid #F4BE38;border-radius:0 10px 10px 0;padding:13px 16px}
.ans .abig{color:#F4BE38;font-weight:800;font-size:26px}
.ans .alab{color:#94A3B8;font-size:13px;margin-top:2px}
.clause{margin-top:16px;background:#0c1322;border:1px solid rgba(94,124,160,.3);border-radius:10px;padding:13px 15px}
.clause .csrc{color:#7FD7FD;font-weight:700;font-size:12px;letter-spacing:.5px;margin-bottom:7px;text-transform:uppercase}
.clause p{color:#aeb8c6;font-size:13.5px;line-height:1.55}
.clause mark{background:rgba(244,190,56,.28);color:#fff;border-radius:3px;padding:1px 3px;font-weight:600}

/* FEATURE SECTION */
.feat{padding:96px 0;text-align:center;border-top:1px solid rgba(255,255,255,.05)}
.feat h2{font-size:42px;line-height:1.08;letter-spacing:-.8px;color:#fff;font-weight:800;margin:16px 0 16px}
.feat .lead{font-size:19px;line-height:1.5;color:#AEB8C6;max-width:620px;margin:0 auto}
.shot{margin:54px auto 0;max-width:1080px;border-radius:13px;overflow:hidden;
  border:1px solid rgba(255,255,255,.09);box-shadow:0 34px 80px rgba(0,0,0,.5);background:#0b1120}
.shot.sq{max-width:760px}
.chrome{height:40px;background:#1b2333;display:flex;align-items:center;padding:0 14px;gap:8px;border-bottom:1px solid #0a0f1c}
.dot{width:11px;height:11px;border-radius:50%}.d1{background:#ff5f57}.d2{background:#febc2e}.d3{background:#28c840}
.shot img{display:block;width:100%}

/* POLICYHOLDER PORTAL (split: bullets left, screenshot right) */
.portal{padding:96px 0;border-top:1px solid rgba(255,255,255,.05)}
.portal .wrap{display:grid;grid-template-columns:.92fr 1.08fr;gap:58px;align-items:center}
.pcopy h2{font-size:40px;line-height:1.08;letter-spacing:-.7px;color:#fff;font-weight:800;margin:14px 0 14px}
.pcopy .lead{font-size:18px;line-height:1.5;color:#AEB8C6;max-width:460px}
.pcaps{margin-top:26px;display:flex;flex-direction:column;gap:14px}
.pcap{display:flex;gap:13px;align-items:flex-start}
.pcap .ic{flex:none;width:24px;height:24px;border-radius:7px;background:rgba(127,215,253,.14);
  border:1px solid rgba(127,215,253,.4);color:#7FD7FD;font-weight:800;font-size:13px;
  display:flex;align-items:center;justify-content:center;margin-top:1px}
.pcap .t{color:#E6ECF4;font-size:16px;line-height:1.4}
.portal .shot{margin:0}

/* CUSTOMERS */
.cust{padding:96px 0;text-align:center;border-top:1px solid rgba(255,255,255,.05)}
.cust h2{font-size:42px;color:#fff;font-weight:800;letter-spacing:-.8px;margin:16px 0 8px}
.cards{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:52px;text-align:left}
.ccard{background:#141f3a;border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:30px 32px}
.ccard .logo{height:64px;border-radius:11px;overflow:hidden;display:inline-block;box-shadow:0 4px 14px rgba(0,0,0,.35)}
.ccard .logo img{height:64px;display:block}
.ccard .pill{margin-left:12px;color:#94A3B8;font-size:11.5px;font-weight:700;border:1px solid rgba(148,163,184,.4);
  border-radius:999px;padding:3px 11px;letter-spacing:1px;vertical-align:middle}
.ccard .big{color:#fff;font-weight:800;font-size:30px;letter-spacing:-.3px;margin:22px 0 8px}
.ccard .big em{color:#F4BE38;font-style:normal}
.ccard p{color:#AEB8C6;font-size:15.5px;line-height:1.5}

/* CLOSING CTA */
.close{position:relative;text-align:center;padding:120px 0;overflow:hidden;border-top:1px solid rgba(255,255,255,.05)}
.close::before{content:"";position:absolute;top:-40px;left:50%;transform:translateX(-50%);width:840px;height:440px;
  background:radial-gradient(ellipse at center,rgba(244,190,56,.14),transparent 62%);pointer-events:none}
.close h2{position:relative;font-size:52px;color:#fff;font-weight:800;letter-spacing:-1px;line-height:1.06}
.close p{position:relative;color:#CDD5E1;font-size:19px;margin:18px 0 34px}

/* FOOTER */
footer{background:#0A0F1C;border-top:1px solid rgba(255,255,255,.07);padding:54px 0 32px}
.ftop{display:flex;justify-content:space-between}
.fbrand img{height:24px}
.fbrand .tag{color:#94A3B8;font-size:14.5px;margin-top:16px;max-width:280px;line-height:1.5}
.fcols{display:flex;gap:72px}
.fcol h4{color:#64748B;font-size:12px;font-weight:700;letter-spacing:1.5px;margin-bottom:15px}
.fcol a{display:block;color:#CDD5E1;font-size:14.5px;margin-bottom:11px}
.fbar{display:flex;justify-content:space-between;margin-top:40px;padding-top:22px;
  border-top:1px solid rgba(255,255,255,.06);color:#64748B;font-size:13.5px}
.fbar a{color:#94A3B8}

/* RESPONSIVE */
@media (max-width:900px){
  .hero{grid-template-columns:1fr;row-gap:40px;padding:56px 0 56px}
  .grind{padding:60px 0 64px}
  .hero h1{font-size:46px}
  .cards{grid-template-columns:1fr}
  .ftop{flex-direction:column;gap:36px}
  .fcols{gap:48px}
  .strip{flex-wrap:wrap;gap:24px}
  .pipe{flex-direction:column;gap:0}
  .iarrow{width:100%;height:40px;transform:rotate(90deg)}
  .drop{min-height:200px}
  .portal .wrap{grid-template-columns:1fr;gap:36px}
}
@media (max-width:560px){
  .wrap{padding:0 24px}
  .navin{padding:0 24px}
  .nlinks{gap:18px}
  .nlinks a:not(.btn){display:none}
  .hero h1{font-size:38px}
  .feat h2,.cust h2{font-size:32px}
  .grind h2{font-size:30px}
  .close h2{font-size:36px}
  .stagewrap{transform:scale(.72);transform-origin:top center;height:340px}
}
