*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
body{background:#0a1628;color:#a8c8d8;font-family:'IBM Plex Sans',sans-serif;overflow-x:hidden}
.scanlines{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:100;background:repeating-linear-gradient(transparent 0px,transparent 2px,rgba(10,22,40,.15) 2px,rgba(10,22,40,.15) 4px)}

.act{position:relative;overflow:hidden}
.act1{min-height:100vh;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% 30%,#1a4a5e 0%,#0a1628 70%)}
.act2{min-height:90vh;background:#0b1a2d;padding:60px 24px}
.act3{min-height:100vh;background:#0a1628;padding:60px 24px}
.act4{min-height:80vh;background:#0b1a2d;padding:60px 24px;display:flex;align-items:center;justify-content:center}
.act5{min-height:60vh;background:linear-gradient(180deg,#0a1628 0%,#050a12 100%);display:flex;align-items:center;justify-content:center}

.mountains{position:absolute;bottom:0;left:0;width:100%;height:60%}
.range{position:absolute;bottom:0;left:0;width:100%;pointer-events:none}
.range1{height:40%;background:#1a4a5e;clip-path:polygon(0% 100%,0% 55%,5% 40%,12% 50%,20% 30%,28% 45%,35% 20%,42% 35%,50% 15%,58% 40%,65% 25%,72% 38%,80% 18%,88% 42%,95% 32%,100% 48%,100% 100%);opacity:.4}
.range2{height:50%;background:#143d52;clip-path:polygon(0% 100%,0% 60%,8% 48%,15% 55%,22% 38%,30% 50%,38% 30%,45% 45%,52% 28%,60% 42%,68% 35%,75% 48%,82% 25%,90% 40%,100% 50%,100% 100%);opacity:.25}
.range3{height:60%;background:#0f3040;clip-path:polygon(0% 100%,0% 65%,10% 55%,18% 60%,25% 45%,32% 55%,40% 38%,48% 50%,55% 42%,62% 52%,70% 40%,78% 52%,85% 38%,92% 48%,100% 55%,100% 100%);opacity:.15}
.range4{height:70%;background:#0b2535;clip-path:polygon(0% 100%,0% 70%,12% 62%,20% 65%,28% 52%,35% 60%,42% 48%,50% 58%,58% 50%,65% 58%,72% 45%,80% 55%,88% 48%,95% 55%,100% 60%,100% 100%);opacity:.08}
.range5{height:80%;background:#0b1a2d;clip-path:polygon(0% 100%,0% 75%,15% 68%,25% 72%,35% 60%,45% 68%,55% 58%,65% 65%,75% 55%,85% 62%,95% 58%,100% 65%,100% 100%);opacity:.04}

.hero-text{position:relative;z-index:2;text-align:center}
.title{font-family:'Roboto Slab',serif;font-weight:900;font-size:clamp(4rem,12vw,14rem);color:#c8e6f0;letter-spacing:-.03em;line-height:.92;text-shadow:0 0 40px rgba(0,201,167,.3),-3px 0 0 rgba(196,94,58,.3),3px 0 0 rgba(77,184,164,.25)}
.subtitle{font-family:'Alfa Slab One',serif;font-size:clamp(1rem,2.5vw,1.6rem);text-transform:uppercase;letter-spacing:.3em;word-spacing:.4em;color:#4db8a4;opacity:.6;margin-top:8px}

.sonar-ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border:1px solid #00c9a7;border-radius:50%;opacity:0;animation:sonar 4s ease-out infinite}
.r1{animation-delay:0s}.r2{animation-delay:1.5s}.r3{animation-delay:3s}
@keyframes sonar{0%{width:0;height:0;opacity:.4}100%{width:120vmax;height:120vmax;opacity:0}}

.divider-mountain{width:100%;height:120px;background:#1a4a5e;clip-path:polygon(0% 100%,0% 60%,6% 45%,14% 55%,22% 30%,30% 50%,38% 25%,46% 45%,54% 20%,62% 42%,70% 28%,78% 48%,86% 32%,94% 50%,100% 40%,100% 100%);opacity:.2;margin-bottom:40px}

.content-band{max-width:680px;margin:0 auto}
.body-text{font-size:clamp(.95rem,1.1vw,1.15rem);line-height:1.75;color:#a8c8d8;margin-bottom:24px;padding-left:16px;border-left:2px solid #1a4a5e}
.pull-quote{font-family:'Alfa Slab One',serif;font-size:clamp(1rem,2.5vw,1.6rem);text-transform:uppercase;letter-spacing:.15em;word-spacing:.4em;color:#4db8a4;opacity:.6;padding:24px 0;border:none}

.signal-weak .body-text{opacity:.75;filter:blur(.3px)}
.interstitial{text-align:center;padding:40px 24px;margin-bottom:40px}
.coord{font-family:'IBM Plex Mono',monospace;font-weight:300;font-size:.75rem;letter-spacing:.08em;color:#00c9a7;opacity:.5}

.section-head{font-family:'Roboto Slab',serif;font-weight:900;font-size:clamp(2rem,5vw,4.5rem);color:#c8e6f0;letter-spacing:-.03em;line-height:.92;text-shadow:0 0 40px rgba(0,201,167,.3);margin-bottom:32px;clip-path:inset(15% 0 0 0)}

.terminal-fade{text-align:center}
.fade-text{border-left:none;padding-left:0;opacity:.5}
.blink-cursor{display:inline-block;width:2px;height:20px;background:#00c9a7;animation:blink 1.2s step-end infinite;vertical-align:middle;margin-top:24px}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}

.tear{position:fixed;left:0;width:100%;height:3px;background:#00c9a7;opacity:.3;z-index:50;pointer-events:none;animation:tear-slide 8s ease-in-out infinite alternate}
.tear1{top:25%}.tear2{top:55%;animation-delay:-3s;animation-duration:10s}.tear3{top:78%;animation-delay:-6s;animation-duration:12s}
@keyframes tear-slide{0%{transform:translateX(-10px)}100%{transform:translateX(10px)}}

@media(max-width:768px){
  .title{text-shadow:0 0 20px rgba(0,201,167,.3),-2px 0 0 rgba(196,94,58,.25),2px 0 0 rgba(77,184,164,.2)}
  .content-band{padding:0 16px}
}
