/* Nexorcomps hero v3: the section itself is the billboard. Full-bleed video ad (Magnific "Laptop in Studio Lighting"),
   billboard-scale type with kinetic and light effects, a rotating ad line that decodes like an LED display. */
.ad-hero{position:relative;overflow:hidden;background:var(--navy-900);color:#fff;isolation:isolate;--mx:70%;--my:40%}
.ad-hero .vid{position:absolute;top:0;right:0;bottom:0;width:82%;z-index:0;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 24%);mask-image:linear-gradient(90deg,transparent 0,#000 24%)}
.ad-hero video,.ad-hero .vid img{width:100%;height:100%;object-fit:cover;object-position:62% 50%;display:block}
.ad-hero .shade{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,rgba(0,0,0,.85) 0,rgba(0,0,0,.74) 38%,rgba(0,0,0,.35) 58%,transparent 74%),radial-gradient(120% 90% at 75% 45%,transparent 55%,rgba(0,0,0,.35) 100%),linear-gradient(0deg,rgba(0,0,0,.6) 0,transparent 24%),linear-gradient(180deg,rgba(0,0,0,.3) 0,transparent 16%)}
.ad-hero .grain{position:absolute;inset:-50%;z-index:1;pointer-events:none;opacity:.07;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
@media (prefers-reduced-motion:no-preference){.ad-hero .grain{animation:grain 1s steps(4) infinite}}
@keyframes grain{0%{transform:translate(0,0)}25%{transform:translate(-3%,2%)}50%{transform:translate(2%,-3%)}75%{transform:translate(-2%,-1%)}}
.ad-hero .spot{position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(420px 420px at var(--mx) var(--my),rgba(255,70,60,.16),transparent 70%);transition:background .2s}

/* giant outlined marquee behind everything */
.marq{position:absolute;left:0;bottom:6%;z-index:1;white-space:nowrap;pointer-events:none;font-family:var(--head);font-weight:800;font-style:italic;font-size:clamp(5rem,13vw,12rem);line-height:1;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.10);display:flex}
.marq span{padding-right:.4em}
.marq b{-webkit-text-stroke:1.5px rgba(255,80,70,.28);font-weight:800}
@media (prefers-reduced-motion:no-preference){.marq{animation:marq 60s linear infinite}}
@keyframes marq{to{transform:translateX(-50%)}}

/* copy */
.ad-hero .wrap{position:relative;z-index:2;min-height:min(calc(100svh - 106px),860px);display:flex;flex-direction:column;justify-content:center;padding-top:36px;padding-bottom:56px}
.ad-copy{max-width:760px}
.onair{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:.8rem;letter-spacing:.01em;color:#e2e2e2;border:1px solid rgba(255,255,255,.18);padding:6px 12px;border-radius:3px;background:rgba(0,0,0,.45);backdrop-filter:blur(4px);margin:0 0 22px}
.onair i{width:8px;height:8px;border-radius:50%;background:#ff3b30}
@media (prefers-reduced-motion:no-preference){.onair i{animation:onair 1.4s ease-in-out infinite}}
@keyframes onair{50%{opacity:.25}}
.mega{text-shadow:0 2px 30px rgba(0,0,0,.45);font-family:var(--head);font-weight:800;letter-spacing:-.035em;line-height:.9;margin:0;font-size:clamp(3rem,min(8.2vw,12.5vh),8.4rem)}
.mega .ln{display:block;overflow:hidden;padding-bottom:.06em}
.mega .w{display:inline-block;margin-right:.18em}
.mega .w:last-child{margin-right:0}
.mega .lit{text-shadow:none;filter:drop-shadow(0 2px 24px rgba(0,0,0,.45));font-style:italic;color:transparent;-webkit-background-clip:text;background-clip:text;
  background-image:linear-gradient(100deg,#fff 0%,#fff 38%,#ff6b5e 46%,#ffd2c9 50%,#ff4436 54%,#fff 62%,#fff 100%);background-size:260% 100%;background-position:100% 0}
@media (prefers-reduced-motion:no-preference){
  .mega .w{transform:translateY(105%) skewY(6deg);opacity:0;filter:blur(8px);animation:wordup .9s cubic-bezier(.2,.8,.2,1) forwards}
  .mega .lit{animation:wordup .9s cubic-bezier(.2,.8,.2,1) forwards,sweep 4.8s 1.4s ease-in-out infinite}
}
@keyframes wordup{to{transform:none;opacity:1;filter:none}}
@keyframes sweep{0%{background-position:100% 0}55%,100%{background-position:0 0}}
.ad-lede{text-shadow:0 1px 12px rgba(0,0,0,.6);font-size:clamp(1rem,1.4vw,1.15rem);color:#d0d0d0;max-width:36em;margin:18px 0 0}

/* the rotating ad line */
.adline{margin-top:24px;display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:stretch;max-width:720px;text-decoration:none;color:#fff;border-top:1px solid rgba(255,255,255,.16);border-bottom:1px solid rgba(255,255,255,.16);padding:16px 0}
.adline .num{font-family:var(--mono);font-size:.78rem;color:#a3a3a3;display:flex;flex-direction:column;justify-content:space-between;min-width:64px}
.adline .num b{color:#ff6b5e;font-weight:500;font-size:1rem}
.adline .bars{display:flex;gap:4px;margin-top:8px}
.adline .bars i{width:12px;height:3px;background:rgba(255,255,255,.2);border-radius:2px;overflow:hidden;position:relative}
.adline .bars i.on::after{content:"";position:absolute;inset:0;background:#ff5d4d;transform-origin:left;animation:fillbar var(--dur,4.4s) linear forwards}
.adline .bars i.done{background:rgba(255,255,255,.6)}
@keyframes fillbar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.adline .what{font-family:var(--head);font-weight:700;font-size:clamp(1.3rem,2.4vw,2rem);letter-spacing:-.01em}
.adline .sub{font-family:var(--mono);color:#adadad;font-size:.86rem;margin-top:6px}
.adline .price{font-family:var(--mono);font-weight:500;font-size:clamp(1.3rem,2.4vw,2rem);color:#ff5d4d;text-shadow:0 0 18px rgba(255,93,77,.55);white-space:nowrap}
.adline .row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;gap:18px}
.adline .what,.adline .sub{display:block;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.adline .go,.adline .price{white-space:nowrap}
.adline .what{height:1.15em;line-height:1.15}
.adline .sub{height:1.35em;line-height:1.35}
.adline .go{font-size:.85rem;font-weight:600;color:#fff;border-bottom:2px solid var(--red);padding-bottom:1px}
.adline:hover .go{border-color:#fff}
.adline .sc{color:#ff8a7e}
.ad-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.ad-trust{display:flex;flex-wrap:wrap;gap:6px 0;margin-top:22px;font-size:.86rem;color:#cccccc}
.ad-trust span{padding:0 14px;border-left:1px solid rgba(255,255,255,.2)}
.ad-trust span:first-child{padding-left:0;border-left:0}
.ad-trust b{color:#fff}
.ad-ctrl{position:absolute;right:92px;bottom:24px;z-index:3;display:flex;gap:6px}
.ad-ctrl button{width:34px;height:34px;border-radius:4px;border:1px solid rgba(255,255,255,.25);background:rgba(0,0,0,.5);color:#fff;display:grid;place-items:center;backdrop-filter:blur(4px)}
.ad-ctrl button:hover{border-color:#fff}
.ad-ctrl svg{width:14px;height:14px}

/* on-load reveal for the rest of the copy */
@media (prefers-reduced-motion:no-preference){
  .ad-hero .in1,.ad-hero .in2,.ad-hero .in3,.ad-hero .in4{opacity:0;transform:translateY(16px);animation:wordup .8s cubic-bezier(.2,.8,.2,1) forwards}
  .ad-hero .in1{animation-delay:.05s}.ad-hero .in2{animation-delay:.75s}.ad-hero .in3{animation-delay:.95s}.ad-hero .in4{animation-delay:1.15s}
  .ad-hero .vid{animation:vidin 1.6s ease-out both}
}
@keyframes vidin{from{opacity:0;transform:scale(1.06)}to{opacity:1;transform:none}}

@media(max-width:900px){
  .ad-hero .vid{width:100%;height:100%;-webkit-mask-image:none;mask-image:none}
  .ad-hero video,.ad-hero .vid img{object-position:58% 50%}
  .ad-hero .wrap{justify-content:flex-end;min-height:0;padding-top:min(52vw,360px);padding-bottom:72px}
  .ad-hero .shade{background:linear-gradient(0deg,rgba(0,0,0,.94) 0,rgba(0,0,0,.8) 42%,rgba(0,0,0,.2) 72%,rgba(0,0,0,.35) 100%)}
  .marq{bottom:auto;top:4%;font-size:22vw}
  .adline{grid-template-columns:1fr}
  .adline .row:first-child{grid-template-columns:1fr;gap:4px}
  .adline .what{font-size:1.3rem}
  .adline .price{font-size:1.3rem;height:1.2em;line-height:1.2}
  .adline .num{flex-direction:row;align-items:center;justify-content:flex-start;gap:12px}
  .adline .bars{margin-top:0}
  .ad-ctrl{bottom:auto;top:12px;right:16px}
}
@media(max-width:520px){.ad-trust span{padding:0 10px}.mega{font-size:clamp(2.9rem,15vw,4rem)}}
@media (prefers-reduced-motion:reduce){.mega .lit{background-position:50% 0}}