@font-face{font-family:Orbitron;src:url('assets/orbitron.ttf') format('truetype');font-weight:400 900;font-display:swap}
@font-face{font-family:Rajdhani;src:url('assets/rajdhani-medium.ttf') format('truetype');font-weight:500;font-display:swap}
@font-face{font-family:Rajdhani;src:url('assets/rajdhani-semibold.ttf') format('truetype');font-weight:600;font-display:swap}
:root{color-scheme:dark;--ice:#b8edff;--cyan:#79d8f4;--white:#f1f5f6;--orange:#ffb678;--ink:#07121c}
*{box-sizing:border-box}
html,body{margin:0;min-width:320px;min-height:100%;background:var(--ink)}
body{font-family:Rajdhani,'Arial Narrow',sans-serif;font-weight:500;color:var(--white)}
button,a{-webkit-tap-highlight-color:transparent}
.scene{position:fixed;inset:0;overflow:hidden;background:#182a38}
.scene video{width:100%;height:100%;object-fit:cover;object-position:61% center;filter:saturate(.8)}
.shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,12,21,.94) 0%,rgba(3,12,21,.82) 29%,rgba(3,12,21,.30) 65%,rgba(3,12,21,.13) 100%),linear-gradient(0deg,rgba(3,12,21,.85),transparent 25%,transparent 77%,rgba(3,12,21,.5))}
.landing{position:relative;isolation:isolate;min-height:100svh;display:flex;flex-direction:column;padding:38px 5.1vw 29px;overflow:hidden}
header{display:flex;align-items:center;justify-content:space-between;gap:25px;pointer-events:none}
.logo{display:inline-flex;flex-direction:column;align-items:center;gap:4px;width:245px;font-family:Orbitron,sans-serif;color:#f1f7fa;line-height:1;background:none;border:0;padding:0}
.logo-project{font-size:9px;font-weight:500;letter-spacing:.65em;padding-left:.65em;color:#bfd1dc}
.logo-entropy{font-size:34px;font-weight:600;letter-spacing:.04em}
main{flex:1;display:flex;align-items:center;position:relative;padding:70px 0 64px}
.hero-copy{width:100%;max-width:850px;min-width:0}
h1{font-family:Orbitron,'Arial Black',sans-serif;font-size:clamp(36px,4.5vw,68px);font-weight:700;line-height:1.17;letter-spacing:-2.5px;margin:0;text-shadow:0 2px 25px #0002}
h1 span{color:var(--ice)}
.promise{font-size:21px;line-height:1.55;letter-spacing:.25px;color:#bccbd4;margin:28px 0 33px;max-width:510px}
.action{width:min(100%,340px);margin-top:32px}
.cta{position:static;display:block;color:#e7faff;text-decoration:none;font-family:Orbitron,sans-serif;font-size:16px;font-weight:700;letter-spacing:1.1px;outline:none}
.cta::after{content:'';position:absolute;inset:0;z-index:5;cursor:pointer}
/* A single real link stretches over the entire page; sound remains independent. */
main{position:static}
.cta-surface{position:relative;z-index:6;display:grid;grid-template-columns:28px minmax(0,1fr) 28px;align-items:center;gap:20px;width:100%;min-height:65px;padding:18px 25px;border:1px solid #9deaff99;background:linear-gradient(105deg,#284e60bb,#0c2637bb);box-shadow:0 0 26px #77d9ff14,inset 0 0 25px #73cffa0c;clip-path:polygon(0 0,calc(100% - 13px) 0,100% 13px,100% 100%,13px 100%,0 calc(100% - 13px));transition:background .25s,box-shadow .25s,transform .25s;animation:beacon 3s ease-in-out infinite}
.cta-surface::before{content:'';position:absolute;left:-45%;top:-100%;width:24%;height:300%;background:linear-gradient(90deg,transparent,#bcf2ff40,transparent);transform:rotate(24deg);animation:sweep 5s ease-in-out infinite;pointer-events:none}
.cta-surface>span{grid-column:2;grid-row:1;text-align:center}
.cta-surface svg{grid-column:3;grid-row:1;justify-self:end;flex-shrink:0;color:var(--orange);transition:transform .25s}
.cta:hover .cta-surface,.cta:focus-visible .cta-surface{background:linear-gradient(105deg,#477d91e8,#173d53ed);box-shadow:0 0 40px #77d9ff40;transform:translateY(-2px)}
.cta:hover svg,.cta:focus-visible svg{transform:translateX(4px)}
.cta:focus-visible::after{outline:2px solid var(--ice);outline-offset:-8px}
footer{display:flex;align-items:center;justify-content:flex-end;min-height:32px}
.sound{position:relative;z-index:10;display:flex;align-items:center;gap:12px;background:transparent;border:1px solid #abc9d326;padding:11px 14px;color:#bbccd5;font-family:Orbitron,sans-serif;font-size:8px;letter-spacing:1.6px;cursor:pointer;min-height:44px;transition:background .2s,border-color .2s}
.sound:hover{background:#193b4b99;border-color:#9deaff80}
.sound:focus-visible{outline:2px solid var(--ice);outline-offset:4px}
.sound-bars{display:flex;align-items:center;gap:3px;height:14px}
.sound-bars i{width:2px;background:var(--ice);height:3px;transition:height .25s}
.sound[aria-pressed="true"] .sound-bars i{animation:equalize .8s ease-in-out infinite alternate;height:12px}
.sound[aria-pressed="true"] .sound-bars i:nth-child(2){animation-delay:-.2s}
.sound[aria-pressed="true"] .sound-bars i:nth-child(3){animation-delay:-.6s}
.sound[aria-pressed="true"] .sound-bars i:nth-child(4){animation-delay:-.4s}
@keyframes beacon{0%,100%{border-color:#9deaff80;box-shadow:0 0 22px #77d9ff14,inset 0 0 20px #73cffa08}50%{border-color:#c8f5ffe0;box-shadow:0 0 35px #77d9ff32,inset 0 0 25px #73cffa14}}
@keyframes sweep{0%,48%{left:-45%;opacity:0}53%{opacity:1}80%,100%{left:145%;opacity:0}}
@keyframes equalize{from{height:3px}to{height:14px}}
@media(min-width:1600px){.landing{padding-top:48px;padding-bottom:38px}.logo{width:275px}.logo-entropy{font-size:38px}main{padding-top:80px;padding-bottom:80px}.hero-copy{max-width:850px}h1{font-size:76px}.promise{font-size:23px}.action{width:360px}.cta-surface{min-height:72px}.cta{font-size:17px}}
@media(max-width:900px){.landing{padding:28px 6vw 25px}.logo{width:210px}.logo-entropy{font-size:29px}.logo-project{font-size:8px}h1{font-size:clamp(36px,5.5vw,50px)}.shade{background:linear-gradient(90deg,#030c15ed,#030c15b8 45%,#030c1555),linear-gradient(0deg,#030c15d9,transparent 40%,#030c1533)}.promise{font-size:20px}}
@media(max-width:600px){.landing{padding:24px 25px 24px;min-height:100svh}.logo{width:193px}.logo-entropy{font-size:27px}.logo-project{font-size:7px}main{padding:clamp(45px,9svh,75px) 0 clamp(38px,8svh,65px)}h1{font-size:clamp(22px,6.5vw,38px);letter-spacing:-1.3px;line-height:1.23}.promise{font-size:19px;line-height:1.5;margin:23px 0 29px;max-width:355px}.desktop-break{display:none}.action{max-width:320px}.cta{font-size:15px;letter-spacing:.65px}.cta-surface{min-height:62px;padding:17px 19px;gap:14px}.cta-surface svg{width:23px}.sound{font-size:7px;padding:10px;gap:9px;letter-spacing:1px}.shade{background:linear-gradient(90deg,#030c15df,#030c1588),linear-gradient(0deg,#030c15eb,transparent 35%,#030c1533)}.scene video{object-position:65% center}}
@media(max-height:740px) and (min-width:901px){.landing{padding-top:24px;padding-bottom:22px}.logo{width:205px}.logo-entropy{font-size:28px}.logo-project{font-size:7px}main{padding:35px 0 30px}h1{font-size:clamp(36px,4.3vw,60px)}.promise{margin:20px 0 25px;font-size:19px}.cta-surface{min-height:60px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

@media(max-height:500px) and (max-width:900px){main{padding:32px 0}.landing{min-height:100svh}h1{font-size:clamp(25px,4.4vw,38px)}.promise{margin:18px 0 24px;font-size:18px}}

/* Keep the mobile video open above the headline, with sound in the header. */
@media (max-width:600px), (max-width:900px) and (max-height:500px){
  .landing{min-height:100svh;padding-top:max(24px,env(safe-area-inset-top));padding-bottom:max(24px,env(safe-area-inset-bottom))}
  header{min-height:44px;padding-right:112px}
  .logo{width:clamp(136px,42vw,193px)}
  .logo-entropy{font-size:clamp(20px,6vw,27px)}
  .logo-project{font-size:clamp(6px,1.6vw,7px)}
  main{align-items:flex-end;padding:64px 0 0}
  footer{position:absolute;top:max(24px,env(safe-area-inset-top));right:25px;z-index:10}
  .sound{font-size:7px;letter-spacing:1px;padding:10px;gap:9px;min-height:44px}
  .shade{background:linear-gradient(0deg,rgba(3,12,21,.96) 0%,rgba(3,12,21,.82) 20%,rgba(3,12,21,.25) 55%,rgba(3,12,21,.22) 78%,rgba(3,12,21,.62) 100%)}
}
@media (max-width:900px) and (max-height:500px){
  main{padding-top:36px}
  h1{font-size:clamp(20px,3.4vw,30px)}
  .action{margin-top:22px}
}
