/* Astratech: tactile calls to action and a cinematic stage for Theus.
   Layer after the white/blue theme; content and playback controls stay intact. */
body.impacto-space .button,
body.impacto-space .nav-links .nav-contact,
body.impacto-interior .button,
body.impacto-interior .nav-links .button{
  border-radius:999px;
  padding-inline:28px;
  min-height:54px;
  transition:background-color 180ms ease,color 180ms ease,border-color 180ms ease,transform 180ms ease;
}
body.impacto-space .nav-links .nav-contact{
  min-height:48px;
  padding:11px 24px;
  gap:23px;
}
body.impacto-space .button>span,
body.impacto-space .nav-contact>span,
body.impacto-interior .button>span{
  transition:transform 180ms ease;
}
@media(hover:hover){
  body.impacto-space .button:hover>span,
  body.impacto-space .nav-contact:hover>span,
  body.impacto-interior .button:hover>span{transform:translate(2px,-2px)}
}
body.impacto-space .button:active,
body.impacto-space .nav-contact:active,
body.impacto-interior .button:active{transform:translateY(1px)}
body.impacto-space .button:focus-visible,
body.impacto-space .nav-contact:focus-visible,
body.impacto-interior .button:focus-visible{
  outline:3px solid #2584f4;
  outline-offset:5px;
}

/* A true black stage, with existing Astratech space artwork at its edges. */
body.impacto-space .theus-feature{
  --paper:#fff;
  --ice:#d9edff;
  --muted:#d5dce6;
  position:relative;
  isolation:isolate;
  background:#050607;
  color:#fff;
  border:1px solid #252b33;
  padding:clamp(28px,3.4vw,52px);
  gap:clamp(28px,3.6vw,52px);
}
body.impacto-space .theus-feature::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    linear-gradient(90deg,#05060726 0%,#050607bd 59%,#050607d6 100%),
    url('/assets/impacto-v2/nebulosa-conocimiento.webp') 38% center/cover no-repeat;
  opacity:.52;
}
body.impacto-space .theus-feature::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:linear-gradient(0deg,#050607c9,transparent 38%,transparent 76%,#05060780);
}
body.impacto-space .theus-copy h3{
  color:#fff;
  font-weight:750;
  line-height:1.08;
  letter-spacing:-.045em;
  text-wrap:balance;
}
body.impacto-space .theus-copy>p{color:#d5dce6;font-weight:500}
body.impacto-space .theus-identity .eyebrow{color:#d5e6f6}
body.impacto-space .theus-copy .button{background:#fff;color:#080b10;border-color:#fff}
body.impacto-space .theus-copy .button:hover{background:#d9edff;color:#080b10}
body.impacto-space .theus-screen{
  background:#080b10;
  border-color:#596470;
  box-shadow:0 24px 64px #0005;
}
body.impacto-space .theus-screen .screen-bar{background:#090d13;color:#d4e0ed}
body.impacto-space .theus-screen .screen-bar>span:last-child{color:#d4e0ed}
body.impacto-space .theus-screen figcaption{
  background:#080b10;
  color:#ccd7e4;
  border-top-color:#434b57;
}
body.impacto-space .theus-screen figcaption a{color:#e1edfa}

@media(max-width:820px){
  body.impacto-space .theus-feature{padding:32px;gap:32px}
  body.impacto-space .theus-feature::before{
    background-position:center,64% center;
    opacity:.42;
  }
}
@media(max-width:600px){
  body.impacto-space .button,
  body.impacto-space .hero-actions .button,
  body.impacto-interior .button{padding-inline:23px;min-height:52px}
  body.impacto-space .nav-links .nav-contact{min-height:48px;padding-inline:23px}
  body.impacto-interior .nav-links .button{min-height:44px;padding-inline:18px}
  body.impacto-space .theus-feature{padding:0;gap:0;border-color:#2c323b}
  body.impacto-space .theus-copy{padding:30px 24px 34px}
  body.impacto-space .theus-copy h3{font-size:38px;line-height:1.1}
  body.impacto-space .theus-copy>p{font-size:15px;line-height:1.8}
  body.impacto-space .theus-feature::before{
    background-image:linear-gradient(0deg,#0506079e,#050607b8),url('/assets/impacto-v2/nebulosa-conocimiento.webp');
    background-position:center,57% bottom;
    background-size:cover,auto 70%;
    opacity:.6;
  }
  body.impacto-space .theus-screen{border-width:0 0 1px;box-shadow:none}
}
@media(max-width:350px){
  body.impacto-space .theus-copy{padding-inline:20px}
  body.impacto-space .theus-copy h3{font-size:33px}
  body.impacto-space .hero-actions .button{gap:18px;padding-inline:21px}
}
@media(prefers-reduced-motion:reduce){
  body.impacto-space .button,
  body.impacto-space .nav-contact,
  body.impacto-interior .button,
  body.impacto-space .button>span,
  body.impacto-space .nav-contact>span,
  body.impacto-interior .button>span{transition:none}
}