/* =====================================================================
   VEHICLE / DOMAIN PAGES — SpaceX-style full-bleed scroller
   Used by civil.php, defence.php, space.php
   ===================================================================== */

.domain-hero{
  position:relative; height:100vh; min-height:640px;
  display:flex; align-items:flex-end;
  background:var(--navy-950); overflow:hidden;
}
.domain-hero-bg{ position:absolute; inset:0; z-index:0; }
.domain-hero-bg img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transform:scale(1.04);
}
.domain-hero::after{
  content:''; position:absolute; inset:0; z-index:1;
  background:
    linear-gradient(0deg, var(--navy-950) 0%, rgba(9,12,16,0.35) 42%, rgba(9,12,16,0.15) 65%, rgba(9,12,16,0.55) 100%);
}
.domain-hero-content{ position:relative; z-index:2; width:100%; padding-bottom:64px; }
.domain-kicker{
  font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:0.28em; text-transform:uppercase;
  color:var(--gold-bright); display:flex; align-items:center; gap:12px; margin-bottom:20px;
}
.domain-kicker::before{content:''; width:34px; height:1px; background:var(--gold-bright);}
.domain-hero h1{
  color:var(--paper); font-size:clamp(44px,7vw,96px); line-height:0.98; margin-bottom:18px;
  text-transform:uppercase; letter-spacing:-0.01em;
}
.domain-hero p{
  color:rgba(244,241,232,0.72); font-size:clamp(15px,1.6vw,19px); max-width:640px; line-height:1.6;
}
.domain-scroll-cue{
  position:absolute; left:40px; bottom:28px; z-index:2;
  display:flex; align-items:center; gap:10px;
  color:rgba(244,241,232,0.55); font-family:'JetBrains Mono',monospace; font-size:10.5px;
  letter-spacing:0.18em; text-transform:uppercase;
}
.domain-scroll-cue .line{width:1px; height:34px; background:linear-gradient(180deg, rgba(244,241,232,0.55), transparent); animation:scrollpulse 1.8s infinite;}
@keyframes scrollpulse{0%{opacity:0.2;}50%{opacity:1;}100%{opacity:0.2;}}

.domain-strip-nav{
  position:absolute; right:40px; top:50%; transform:translateY(-50%); z-index:3;
  display:flex; flex-direction:column; gap:14px;
}
.domain-strip-nav a{
  width:9px; height:9px; border-radius:50%; background:rgba(244,241,232,0.25);
  border:1px solid rgba(244,241,232,0.4); transition:all .3s ease; position:relative;
}
.domain-strip-nav a:hover, .domain-strip-nav a.active{
  background:var(--gold-bright); border-color:var(--gold-bright);
  box-shadow:0 0 0 4px rgba(43,230,207,0.18);
}
.domain-strip-nav a .tip{
  position:absolute; right:20px; top:50%; transform:translateY(-50%);
  font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:0.12em; text-transform:uppercase;
  color:var(--paper); white-space:nowrap; opacity:0; pointer-events:none; transition:opacity .2s ease;
  background:rgba(9,12,16,0.85); padding:5px 10px; border-radius:4px; border:1px solid rgba(244,241,232,0.15);
}
.domain-strip-nav a:hover .tip{opacity:1;}
@media (max-width:900px){ .domain-strip-nav{display:none;} }

/* ---- Vehicle sections: full-bleed image, overlapping content panel ---- */
.veh-section{
  position:relative; min-height:100vh; display:flex; align-items:center;
  background:var(--navy-950); overflow:hidden; padding:120px 0;
}
.veh-bg{ position:absolute; inset:0; z-index:0; }
.veh-bg img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transition:transform 1.2s cubic-bezier(.16,1,.3,1);
}
.veh-section:hover .veh-bg img{ transform:scale(1.045); }
.veh-section::after{
  content:''; position:absolute; inset:0; z-index:1;
}
.veh-section.dock-left::after{
  background:linear-gradient(90deg, rgba(9,12,16,0.94) 0%, rgba(9,12,16,0.78) 32%, rgba(9,12,16,0.15) 62%, rgba(9,12,16,0.05) 100%);
}
.veh-section.dock-right::after{
  background:linear-gradient(270deg, rgba(9,12,16,0.94) 0%, rgba(9,12,16,0.78) 32%, rgba(9,12,16,0.15) 62%, rgba(9,12,16,0.05) 100%);
}
.veh-section.dock-bottom::after{
  background:linear-gradient(0deg, rgba(9,12,16,0.95) 0%, rgba(9,12,16,0.6) 30%, rgba(9,12,16,0.1) 60%, rgba(9,12,16,0.35) 100%);
}
.veh-wrap{ position:relative; z-index:2; max-width:var(--max); margin:0 auto; padding:0 40px; width:100%; }
.veh-panel{ max-width:560px; }
.veh-section.dock-right .veh-panel{ margin-left:auto; }
.veh-section.dock-bottom .veh-panel{ max-width:720px; }

.veh-index{
  font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:0.24em; color:var(--gold-bright);
  display:flex; align-items:center; gap:12px; margin-bottom:18px; text-transform:uppercase;
}
.veh-index::before{content:''; width:26px; height:1px; background:var(--gold-bright);}
.veh-panel h2{
  color:var(--paper); font-size:clamp(30px,3.6vw,50px); line-height:1.04; margin-bottom:16px;
}
.veh-panel .veh-tag{
  color:var(--gold-bright); font-family:'JetBrains Mono',monospace; font-size:13px; letter-spacing:0.08em;
  text-transform:uppercase; margin-bottom:16px; display:block;
}
.veh-panel p{
  color:rgba(244,241,232,0.68); font-size:15.5px; line-height:1.75; margin-bottom:26px;
}
.veh-specs{ display:flex; flex-wrap:wrap; gap:28px; }
.veh-specs div{ min-width:88px; }
.veh-specs .v{ color:var(--paper); font-family:'Fraunces',serif; font-size:22px; font-weight:600; }
.veh-specs .l{ color:rgba(244,241,232,0.5); font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:0.1em; text-transform:uppercase; margin-top:4px; }

.veh-icon-spin{
  position:absolute; z-index:2; width:56px; height:56px; opacity:0.5;
  animation:spin360 14s linear infinite;
}
@keyframes spin360{ from{transform:rotate(0deg);} to{transform:rotate(360deg);} }

/* modes strip e.g. Drive / Sail / VTOL under a triphibian section */
.veh-modes{ display:flex; gap:22px; margin-top:26px; flex-wrap:wrap; }
.veh-mode{
  display:flex; align-items:center; gap:8px; font-family:'JetBrains Mono',monospace; font-size:11px;
  letter-spacing:0.1em; text-transform:uppercase; color:rgba(244,241,232,0.75);
  border:1px solid rgba(244,241,232,0.18); padding:8px 14px; border-radius:999px;
}
.veh-mode .dotgold{ width:6px; height:6px; border-radius:50%; background:var(--gold-bright); flex-shrink:0; }

@media (max-width:900px){
  .veh-section{ min-height:auto; padding:90px 0; }
  .veh-panel, .veh-section.dock-right .veh-panel, .veh-section.dock-bottom .veh-panel{ max-width:100%; }
}

/* ---- Closing CTA band specific to domain pages ---- */
.domain-close{
  position:relative; padding:120px 0; text-align:center; background:var(--navy-950);
  border-top:1px solid var(--line-dark);
}
.domain-close h2{ color:var(--paper); font-size:clamp(28px,3.4vw,44px); margin-bottom:18px; }
.domain-close p{ color:rgba(244,241,232,0.6); max-width:520px; margin:0 auto 32px; font-size:15.5px; line-height:1.7; }
