/* Hero: Beacon on the right with the BIY watermark behind him. Header: full logo lockup, two links. */
.logo{width:calc(168*var(--u));height:calc(98*var(--u));position:absolute;left:calc(58*var(--u));top:calc(8*var(--u))}
.logo img{position:static;width:100%;height:100%;object-fit:contain;object-position:left center;filter:drop-shadow(0 0 14px rgba(0,194,255,.38))}
.nav{left:50%;transform:translateX(-50%);gap:calc(64*var(--u));font-size:calc(17*var(--u))}
.nav a{font-weight:600;letter-spacing:.02em}
.ghost:not(.mb){left:calc(700*var(--u));top:calc(150*var(--u));font-size:calc(600*var(--u));color:rgba(20,120,210,.36)}
.ghost-sub{position:absolute;z-index:-1;left:calc(732*var(--u));top:calc(640*var(--u));font:800 calc(83*var(--u))/1 var(--font-h);letter-spacing:.07em;text-align:left;color:rgba(20,120,210,.36);white-space:nowrap;user-select:none;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,#000 55%,transparent 100%);mask-image:linear-gradient(180deg,#000 55%,transparent 100%)}
.hero-beacon{position:absolute;z-index:2;right:calc(110*var(--u));bottom:calc(86*var(--u));width:calc(470*var(--u));pointer-events:none}
.hero-beacon img{position:relative;z-index:2;display:block;width:100%;height:auto;filter:drop-shadow(0 40px 50px rgba(0,0,0,.55)) drop-shadow(0 0 46px rgba(0,194,255,.30))}
.hb-glow{position:absolute;z-index:0;left:50%;top:48%;width:150%;aspect-ratio:1;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(0,194,255,.34),rgba(0,130,255,.12) 42%,transparent 66%)}
.hb-pad{position:absolute;z-index:1;left:50%;bottom:-3%;width:92%;height:10%;transform:translateX(-50%);background:radial-gradient(ellipse at center,rgba(0,200,255,.75),rgba(0,140,255,.18) 55%,transparent 72%);filter:blur(6px)}
@media (prefers-reduced-motion:no-preference){.hero-beacon img{animation:hbFloat 6s ease-in-out infinite}@keyframes hbFloat{50%{transform:translateY(-8px)}}}
@media (max-width:1000px){
  .logo{width:118px;height:70px;position:relative;left:auto;top:auto;flex:none;margin-right:auto}
  .ghost-sub{display:none}
  .hero{padding-bottom:84px}
  .nav{transform:none}
  .hero-beacon{position:relative;right:auto;bottom:auto;width:min(310px,74vw);margin:28px auto 0}
  .ghost:not(.mb){display:none}
  .hero-beacon::before{content:'BIY';position:absolute;left:50%;top:-2%;transform:translateX(-50%);z-index:0;font:800 min(62vw,250px)/1 var(--font-h);letter-spacing:-.03em;color:rgba(20,120,210,.40);-webkit-mask-image:linear-gradient(180deg,#000 55%,transparent 92%);mask-image:linear-gradient(180deg,#000 55%,transparent 92%)}
  .nav a{font-size:17px}
  .hero-beacon::after{content:'DIGITAL SOLUTIONS';position:absolute;left:50%;bottom:-38px;transform:translateX(-50%);z-index:0;width:max-content;font:800 min(9vw,36px)/1 var(--font-h);letter-spacing:.07em;color:rgba(20,120,210,.40);-webkit-mask-image:linear-gradient(180deg,#000 40%,transparent 95%);mask-image:linear-gradient(180deg,#000 40%,transparent 95%)}
}
@media (min-width:701px) and (max-width:1000px){.hero-beacon{width:min(380px,50vw)}.nav{gap:30px}}
/* Hover: rises about 16px and eases back, with the glow pad breathing under him. */
@media (prefers-reduced-motion:no-preference){
.hero-beacon img{animation:hbHover 4.4s ease-in-out infinite;will-change:transform}
.hb-pad{animation:hbPadHover 4.4s ease-in-out infinite}
@keyframes hbHover{0%,100%{transform:translateY(0)}50%{transform:translateY(-16px)}}
@keyframes hbPadHover{0%,100%{transform:translateX(-50%) scale(1);opacity:1}50%{transform:translateX(-50%) scale(.84);opacity:.72}}}
@media (max-width:1000px) and (prefers-reduced-motion:no-preference){@keyframes hbHover{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}}

/* Desktop: feature labels run along the bottom, quiet editorial CTA, smaller DIGITAL SOLUTIONS watermark */
@media(min-width:1001px){
.ghost-sub{font-size:calc(66*var(--u))!important}
.feats li+li::before{display:block!important;top:50%!important;height:calc(18*var(--u))!important;transform:translateY(-50%)}
.feats{left:50%;top:auto;bottom:calc(40*var(--u));transform:translateX(-50%);z-index:3;align-items:center;gap:0}
.feats li{display:flex;align-items:center;gap:calc(9*var(--u));padding:0 calc(28*var(--u));font-size:calc(14.5*var(--u));letter-spacing:.14em;text-transform:uppercase;color:#bcd2e6;font-weight:500}
.feats li:first-child{padding-left:0}
.feats svg{width:calc(22*var(--u));height:calc(22*var(--u))}
h1{font-size:calc(60*var(--u))}.copy{top:calc(236*var(--u))}.lede{font-size:calc(21*var(--u))}
.btn-line{height:auto;min-height:44px;padding:0 calc(6*var(--u));border:0;background:none;box-shadow:none;border-bottom:2px solid var(--cyan);border-radius:0;color:#fff}
.btn-line:hover{transform:none;color:var(--cyan-hi)}.actions{align-items:center;gap:calc(34*var(--u))}}
@media(max-width:1000px){.feats{position:relative;top:auto;left:auto;transform:none;bottom:auto;margin:64px 16px 0;width:auto!important;padding-bottom:6px;z-index:3}.hero{padding-bottom:40px}}
@media(max-width:1000px){h1{font-size:clamp(22px,7.1vw,58px)}}
