/* Page skins, larger devices, uncropped screenshots, step-inside work */

.industry-switch{display:none !important}
.home-wild .fx-console-hint::after{content:none !important}

.home-wild .screen,
.home-wild .phone-screen,
.home-wild .work-window{
  background:#0b151c;
}
.home-wild .screen img,
.home-wild .phone-screen img,
.home-wild .work-window img{
  width:100%;
  height:100%;
  object-fit:cover !important;
  object-position:top center !important;
  filter:none !important;
}

@media (min-width:981px){
  .home-wild .device-stage{
    transform:none !important;
    overflow:visible !important;
    min-height:460px !important;
  }
  .home-wild .laptop{width:520px !important;max-width:520px !important}
  .home-wild .laptop-base{display:block !important}
  .home-wild .screen{height:300px !important;overflow:hidden !important}
  .home-wild .phone{width:150px !important;height:310px !important;right:-8px !important;bottom:40px !important}
}

@media (max-width:760px){
  .home-wild .device-stage{
    width:100%;
    margin:8px auto 12px;
    transform:scale(1.08);
    min-height:360px;
  }
  .home-wild .laptop{width:min(100%,520px)}
  .home-wild .phone{width:100px;height:208px}
}

body[data-skin="dark"] .space-journey{background:#03050a}
body[data-skin="dark"] .space-journey-shade{
  background:linear-gradient(180deg, rgba(8,12,28,.55), rgba(2,4,12,.78));
}
body[data-skin="dark"] .hero-title-wild span,
body[data-skin="dark"] .hero-theme-note span{color:#9db7ff}

body[data-skin="hyper"] .space-journey{background:#01040a}
body[data-skin="hyper"] .deep-space-canvas{opacity:.9}
body[data-skin="hyper"] .hero-title-wild span,
body[data-skin="hyper"] .hero-theme-note span{color:#7cf6ff}

body[data-skin="light"] .hero-title-wild span{color:#6ec8ea}

.site-inside{
  position:fixed;
  inset:0;
  z-index:2147482400;
  display:flex;
  flex-direction:column;
  background:#05090f;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:scale(1.02);
  transition:opacity .35s ease, transform .35s ease;
}
.site-inside.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:none;
}
.site-inside-bar{
  display:flex;
  align-items:center;
  gap:14px;
  padding:12px 18px;
  background:rgba(5,14,22,.92);
  border-bottom:1px solid rgba(255,255,255,.08);
  color:#e8f4fa;
}
.site-inside-bar b{font-size:14px}
.site-inside-bar small{
  color:#8fb0c0;
  font-size:11px;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.site-inside-bar a,
.site-inside-bar button{
  margin-left:auto;
  border:0;
  border-radius:999px;
  padding:8px 14px;
  font-size:12px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  text-decoration:none;
  cursor:pointer;
}
.site-inside-bar a{
  background:#2fd3ea;
  color:#04202c;
}
.site-inside-bar button{
  margin-left:0;
  background:transparent;
  color:#d5e7f0;
  border:1px solid rgba(255,255,255,.16);
}
.site-inside-stage{
  flex:1;
  overflow:auto;
  background:#0b1016;
}
.site-inside-stage img{
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
  object-position:top;
}

@media (max-width:760px){
  .site-inside-bar{flex-wrap:wrap}
  .site-inside-bar a,
  .site-inside-bar button{margin-left:0}
}

@media (max-width:980px){
  .home-wild .hero-grid{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    width:calc(100vw - 28px) !important;
    min-width:0 !important;
    max-width:100% !important;
    margin-inline:auto !important;
    min-height:0 !important;
    gap:18px !important;
  }
  .home-wild .hero-copy,
  .home-wild .hero-title-wild,
  .home-wild .device-stage{
    width:100% !important;
    max-width:100% !important;
  }
  .home-wild .hero-title-wild{
    font-size:clamp(30px,8vw,42px) !important;
    line-height:1.08 !important;
    overflow-wrap:anywhere;
    word-break:break-word;
  }
  .home-wild .hero-title-wild .char-group{white-space:normal !important}
  .home-wild .fx-console{
    width:100% !important;
    max-width:100% !important;
    flex-wrap:wrap;
  }
  .home-wild .hero-actions{width:100%}
  .home-wild .hero-actions .button{width:100%}
  .home-wild .laptop{width:min(100%,520px) !important;max-width:100%}
  .home-wild .screen{height:300px !important}
  .home-wild .screen img,
  .home-wild .phone-screen img{
    object-fit:cover !important;
    object-position:top center !important;
  }
}

.home-wild .project-switcher{display:flex;flex-wrap:nowrap;gap:7px;max-width:100%}
.home-wild .project-dot{min-width:16px}
