
/* IRON FOX UNIVERSE — shared visual system */
:root{
 --if-bg:#08090c;--if-panel:rgba(20,22,28,.78);--if-panel-strong:#13161c;
 --if-orange:#ff641e;--if-orange-hot:#ff8a42;--if-text:#f4f3ef;--if-muted:#a5a8b0;
 --if-line:rgba(255,255,255,.12);--if-glow:rgba(255,91,28,.22);
}
html{scroll-behavior:smooth;background:var(--if-bg)}
body{background:radial-gradient(ellipse at 75% 5%,rgba(255,91,28,.10),transparent 34%),radial-gradient(ellipse at 12% 42%,rgba(74,91,119,.10),transparent 35%),#08090c!important;color:var(--if-text)!important;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif!important;position:relative;isolation:isolate}
body::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:56px 56px;mask-image:linear-gradient(to bottom,black,transparent 88%)}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at center,transparent 30%,rgba(0,0,0,.45) 100%)}
a{color:inherit}
header,.site-header{background:rgba(8,9,12,.78)!important;backdrop-filter:blur(22px);border-bottom:1px solid var(--if-line)!important;box-shadow:0 12px 45px rgba(0,0,0,.15)}
header{position:sticky!important;top:0;z-index:50}
header nav{width:min(1280px,100%);max-width:1280px!important;margin:auto!important;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:14px clamp(18px,4vw,56px)!important}
.logo,.brand{color:#f8f7f4!important;text-decoration:none!important;font-size:clamp(17px,2vw,23px)!important;letter-spacing:.08em;font-weight:800!important;display:flex;align-items:center;gap:12px}
.logo img,.brand img{border-radius:50%;border:1px solid rgba(255,100,30,.55);box-shadow:0 0 24px rgba(255,100,30,.13)}
.menu,.nav-links{display:flex;align-items:center;gap:clamp(14px,2.5vw,32px);margin-left:auto!important}
.menu a,.nav-links a{color:#d5d6da!important;text-decoration:none!important;text-transform:uppercase;font-size:11px!important;font-weight:750;letter-spacing:.15em;padding:10px 0;position:relative;transition:color .22s,transform .22s}
.menu a::after,.nav-links a:not(.nav-cta)::after{content:"";position:absolute;left:0;right:100%;bottom:2px;height:2px;background:var(--if-orange);transition:right .25s}
.menu a:hover,.nav-links a:hover{color:#fff!important;transform:translateY(-1px)}
.menu a:hover::after,.nav-links a:not(.nav-cta):hover::after{right:0}
.profile-box button,.nav-cta,.button,.btn,.contact-btn,.back,.download-btn,.saveBtn{background:linear-gradient(135deg,#ff762d,#e74710)!important;color:#fff!important;border:1px solid rgba(255,176,119,.45)!important;border-radius:4px!important;padding:12px 18px!important;text-decoration:none!important;box-shadow:0 8px 28px rgba(255,83,23,.17);transition:transform .22s,box-shadow .22s,filter .22s;cursor:pointer}
.profile-box button:hover,.nav-cta:hover,.button:hover,.btn:hover,.contact-btn:hover,.back:hover,.download-btn:hover,.saveBtn:hover{transform:translateY(-2px);box-shadow:0 12px 34px rgba(255,83,23,.28);filter:brightness(1.08)}
.profile-menu{background:#11141a!important;border:1px solid var(--if-line)!important;border-radius:10px;box-shadow:0 20px 70px #000!important}
.profile-menu a{color:#eee!important}
section,.hero,.games,.about,.contacts,.download{position:relative}
body:not(:has(.site-header)) main>section:not(.hero){width:min(1180px,calc(100% - 40px));margin-inline:auto;padding:clamp(44px,7vw,88px) 0}
body:not(:has(.site-header)) .hero{max-width:1180px!important;padding:clamp(58px,8vw,110px) 24px!important}
.hero h1,.hero h2,.games h1,.about h2,.contacts h2,.section-heading h2{letter-spacing:-.055em;text-wrap:balance}
h1,h2,h3{color:#f5f4f0}
p{line-height:1.75}
.eyebrow{color:#c5c6cb!important;letter-spacing:.22em!important}
.eyebrow span{background:var(--if-orange)!important}
.hero h1 em,.section-heading h2 em,.contact-cta h2 em{color:var(--if-orange)!important;font-style:normal;text-shadow:0 0 35px rgba(255,91,28,.17)}
.hero-grid{opacity:.65}
.hero-glow{filter:blur(10px)}
#fox-canvas{filter:drop-shadow(0 25px 45px rgba(255,83,23,.14))}
.project-grid,.games-grid,.cards{gap:22px!important}
.project-card,.game-card,.card,.project,.contact-card,.capability-grid article{
 background:linear-gradient(145deg,rgba(28,31,38,.92),rgba(12,14,18,.92))!important;
 border:1px solid var(--if-line)!important;border-radius:12px!important;overflow:hidden;
 box-shadow:0 18px 50px rgba(0,0,0,.24),inset 0 1px rgba(255,255,255,.035)!important;
 transition:transform .35s cubic-bezier(.2,.7,.2,1),border-color .3s,box-shadow .3s!important;
}
.project-card:hover,.game-card:hover,.card:hover,.project:hover,.contact-card:hover,.capability-grid article:hover{transform:translateY(-6px)!important;border-color:rgba(255,100,30,.52)!important;box-shadow:0 24px 65px rgba(0,0,0,.35),0 0 32px rgba(255,91,28,.09)!important}
.project-card img,.game-card img,.card img,.gallery img,.about-image{filter:saturate(.88) contrast(1.05);transition:transform .55s,filter .4s}
.project-card:hover img,.game-card:hover img,.card:hover img,.gallery img:hover{transform:scale(1.035);filter:saturate(1.08) contrast(1.07)}
.project-overlay{background:linear-gradient(180deg,transparent 25%,rgba(5,6,8,.9))!important}
.project-number,.cap-num,.status{color:var(--if-orange)!important}
.section-wrap{width:min(1240px,calc(100% - 48px));margin-inline:auto}
.section-heading{margin-bottom:28px}
.section-heading h2{font-size:clamp(42px,6vw,76px)!important}
.studio-band{background:linear-gradient(120deg,rgba(255,100,30,.10),rgba(20,22,28,.8))!important;border:1px solid var(--if-line);border-radius:14px;padding:clamp(25px,5vw,58px)!important}
.studio-mark{color:var(--if-orange)!important}
.capability-grid article{padding:28px!important}
.contact-cta{margin:30px auto!important;width:min(1240px,calc(100% - 48px));border:1px solid var(--if-line);border-radius:16px;background:radial-gradient(ellipse at 75% 50%,rgba(255,100,30,.13),transparent 45%),linear-gradient(135deg,#15171c,#090a0d)!important}
.contact-cta h2{font-size:clamp(40px,7vw,90px)!important}
footer{background:rgba(6,7,9,.78)!important;border-top:1px solid var(--if-line)!important;color:#999da6!important;padding:28px clamp(20px,5vw,70px)!important}
footer a{color:#eee!important}
.games-container,.timeline{width:min(1180px,calc(100% - 40px))!important;margin:38px auto!important}
.games-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))!important}
.game-card{padding:0 0 22px!important}
.game-card img{width:100%;height:260px;object-fit:cover;display:block}
.game-card h3,.game-card p{margin:16px 20px 0!important}
.game-card h3{font-size:22px!important}
.game-card p,.description,.about p{color:#b4b7bf!important}
.about{width:min(1080px,calc(100% - 40px));margin:0 auto;padding:clamp(55px,8vw,100px) 0!important;text-align:center}
.about-image{width:min(100%,850px);max-height:480px;object-fit:cover;border-radius:12px;border:1px solid var(--if-line);box-shadow:0 25px 80px rgba(0,0,0,.35),0 0 55px rgba(255,100,30,.07);margin-bottom:36px}
.about h2{font-size:clamp(22px,3.1vw,36px)!important;line-height:1.55!important;font-weight:500;max-width:900px;margin:0 auto}
.contacts{width:min(1100px,calc(100% - 40px));margin:0 auto;padding:clamp(58px,8vw,100px) 0!important;text-align:center}
.contacts>h2,.games-container>h2{font-size:clamp(40px,6vw,68px)!important;margin-bottom:34px!important}
.contact-container{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;max-width:850px;margin:auto}
.contact-card{padding:clamp(24px,4vw,40px)!important}
.contact-card h3{font-size:23px;margin-bottom:12px}
.contact-card p{color:#b4b7bf;margin-bottom:22px;overflow-wrap:anywhere}
.project{padding:clamp(20px,4vw,38px)!important;margin-bottom:28px!important}
.project h2{color:#ff8a42!important;font-size:clamp(25px,4vw,38px)!important}
.gallery{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px!important}
.gallery img{width:100%!important;height:clamp(130px,22vw,260px)!important;object-fit:cover;border:1px solid var(--if-line);border-radius:8px!important}
.description{font-size:17px!important;line-height:1.8!important}
.progress-bar{background:#282a30!important}
.progress-fill{background:linear-gradient(90deg,#e84913,#ff9a4d)!important;box-shadow:0 0 20px rgba(255,100,30,.4)}
.download{text-align:center;padding:20px 20px 70px!important}
.download-btn{display:inline-block}
button:focus-visible,a:focus-visible{outline:2px solid #ff9a4d!important;outline-offset:4px}
.universe-atmosphere{position:fixed;inset:0;pointer-events:none;z-index:-1;overflow:hidden}
.universe-orb{position:absolute;width:32vw;height:32vw;min-width:240px;min-height:240px;border-radius:50%;right:-12vw;top:16vh;border:1px solid rgba(255,100,30,.12);box-shadow:inset 0 0 70px rgba(255,100,30,.035),0 0 90px rgba(255,100,30,.04);animation:if-orbit 28s linear infinite}
.universe-orb::before,.universe-orb::after{content:"";position:absolute;inset:12%;border:1px solid rgba(255,255,255,.07);border-radius:50%;transform:rotateX(68deg) rotateZ(28deg)}
.universe-orb::after{inset:-10%;transform:rotateX(72deg) rotateZ(-22deg);border-color:rgba(255,100,30,.09)}
@keyframes if-orbit{to{transform:rotate(360deg)}}
@media(max-width:760px){
 header nav{padding:12px 16px!important;gap:10px}
 .logo{font-size:16px!important;letter-spacing:.02em}
 .menu{gap:12px;flex-wrap:wrap;justify-content:flex-end}
 .menu a{font-size:9px!important;letter-spacing:.08em;padding:8px 0}
 .profile-box button{padding:9px 11px!important;font-size:11px}
 .contact-container{grid-template-columns:1fr}
 .gallery{grid-template-columns:1fr!important}
 .gallery img{height:auto!important;max-height:300px}
 .games-container,.timeline{width:calc(100% - 28px)!important}
 .project-grid,.games-grid{grid-template-columns:1fr!important}
 .project-card,.project-card:last-child{min-height:320px!important}
 .section-wrap{width:calc(100% - 32px)}
 .studio-band,.contact-cta{width:calc(100% - 28px)!important}
 .universe-orb{width:65vw;height:65vw;right:-30vw;top:22vh}
}
@media(max-width:480px){
 header nav{flex-wrap:wrap}
 .logo{font-size:15px!important}
 .menu{width:100%;order:3;justify-content:space-between;margin:0!important}
 .profile-box{margin-left:auto}
 .hero-copy{width:100%!important;padding:62px 22px 78px!important}
 .hero h1{font-size:clamp(54px,15vw,76px)!important}
 .hero-side-note{display:none}
 .service-strip{flex-wrap:wrap;gap:10px!important}
 .service-strip span{font-size:8px!important}
 .project-card{min-height:330px!important}
 .contact-cta h2{font-size:clamp(38px,11vw,58px)!important}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

.game-card-link{display:block;color:inherit!important;text-decoration:none!important}
.game-card-link h3{color:#f5f4f0!important}
.game-card-link p{color:#b4b7bf!important}
header .universe-nav{width:100%;}
@media(max-width:760px){header .universe-nav{flex-wrap:wrap}.universe-nav .menu{flex:1;justify-content:center}}

/* Mobile-first finishing pass: safe spacing, readable headings, touch targets and lighter 3D decoration. */
html { -webkit-text-size-adjust: 100%; }
body { width: 100%; max-width: 100%; overflow-x: clip; }
img, video, canvas, svg { max-width: 100%; }
button, a { -webkit-tap-highlight-color: transparent; }
a, button, input, select, textarea { touch-action: manipulation; }
:focus-visible { outline: 2px solid var(--orange, #ff5a1f); outline-offset: 3px; }

@media (max-width: 760px) {
  .site-header, header { max-width: 100%; }
  .nav-links { max-width: 100vw; }
  .section-heading { min-width: 0; }
  .section-heading h1, .section-heading h2, .hero h1,
  .page-hero h1, .universe-hero h1, .if-hero h1 {
    overflow-wrap: anywhere;
    hyphens: auto;
  }
  .project-grid, .capability-grid, .game-grid, .cards-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .project-card, .project-card:last-child {
    grid-column: auto !important;
    min-width: 0;
  }
  .button, .nav-cta, .round-arrow, .menu-toggle {
    min-height: 44px;
  }
  .hero-actions { max-width: 100%; }
  .hero-actions > * { max-width: 100%; }
  .section-wrap, main, .page-content { min-width: 0; }
  .if-3d-ambient, .portal-ring, .portal-orbit { pointer-events: none; }
}
@media (max-width: 480px) {
  .site-header { padding-left: 14px; padding-right: 14px; }
  .brand { gap: 8px; letter-spacing: .14em; }
  .brand small { letter-spacing: .28em; }
  .section-wrap { padding-left: 16px; padding-right: 16px; }
  .section-heading h1, .section-heading h2 { font-size: clamp(2.25rem, 12vw, 3.6rem); }
  .project-card, .project-card:last-child { min-height: 330px; }
  .project-info { padding: 18px; }
  .project-info h3 { font-size: clamp(1.8rem, 9vw, 2.3rem); }
  .project-info p { max-width: 100%; }
  footer { padding-left: 16px; padding-right: 16px; overflow-wrap: anywhere; }
  .nav-links { padding-left: 16px; padding-right: 16px; }
}
@media (hover: none) and (pointer: coarse) {
  .project-card:hover img, .button:hover { transform: none; }
}
@media (max-width: 760px), (prefers-reduced-motion: reduce) {
  .if-3d-ambient { opacity: .55; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* CINEMATIC GAME HUB — tactile controls, dimensional panels and portal travel */
:root {
  --if-depth-shadow: 0 18px 0 rgba(0,0,0,.28), 0 24px 55px rgba(0,0,0,.34);
  --if-hub-cyan: #70cfff;
}
.site-header { transform: translateZ(0); }
.nav-links a, .menu a, .button, .nav-cta, .back, .project-card,
.game-card, .contact-btn, .download-btn, .saveBtn, .profile-box button {
  transform-style: preserve-3d;
  transition: transform .22s cubic-bezier(.2,.8,.2,1), box-shadow .22s, border-color .22s, filter .22s;
}
.nav-links a:not(.nav-cta), .menu a {
  padding: 12px 14px !important;
  border: 1px solid transparent;
  border-radius: 7px;
}
.nav-links a:not(.nav-cta):hover, .menu a:hover {
  border-color: rgba(112,207,255,.28);
  background: linear-gradient(145deg,rgba(112,207,255,.10),rgba(255,100,30,.07));
  box-shadow: inset 0 1px rgba(255,255,255,.12), 0 7px 20px rgba(0,0,0,.22);
  transform: translateY(-3px) perspective(500px) rotateX(3deg);
}
.nav-cta, .button, .btn, .contact-btn, .back, .download-btn, .saveBtn {
  position: relative;
  overflow: hidden;
  box-shadow: inset 0 1px rgba(255,255,255,.24), 0 5px 0 #7d290e, 0 12px 28px rgba(255,83,23,.20) !important;
}
.nav-cta::before, .button::before, .btn::before, .contact-btn::before, .back::before,
.download-btn::before, .saveBtn::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(115deg,transparent 20%,rgba(255,255,255,.25) 48%,transparent 72%);
  transform: translateX(-130%);
  transition: transform .55s ease;
  pointer-events: none;
}
.nav-cta:hover::before, .button:hover::before, .btn:hover::before, .contact-btn:hover::before,
.back:hover::before, .download-btn:hover::before, .saveBtn:hover::before { transform: translateX(130%); }
.nav-cta:active, .button:active, .btn:active, .contact-btn:active, .back:active,
.download-btn:active, .saveBtn:active, .if-game-pressed {
  transform: translateY(4px) scale(.985) !important;
  box-shadow: inset 0 3px 9px rgba(0,0,0,.32), 0 1px 0 #7d290e, 0 4px 12px rgba(255,83,23,.18) !important;
}
.project-card, .game-card, .card, .contact-card {
  box-shadow: inset 0 1px rgba(255,255,255,.06), 0 15px 38px rgba(0,0,0,.24);
}
.project-card:hover, .game-card:hover, .card:hover, .contact-card:hover {
  border-color: rgba(255,100,30,.55) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.12), 0 20px 55px rgba(255,83,23,.13);
}
.if-portal-transition {
  position: fixed !important;
  z-index: 99999 !important;
  inset: 0 !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at center,rgba(255,100,30,.10),transparent 24%),
    radial-gradient(circle at center,#080b14 0%,#030407 72%) !important;
  opacity: 0;
  visibility: hidden;
  clip-path: circle(0 at var(--if-portal-x,50%) var(--if-portal-y,50%));
  transition: clip-path .58s cubic-bezier(.7,0,.2,1), opacity .18s, visibility .18s;
  pointer-events: none;
}
.if-portal-transition::before, .if-portal-transition::after {
  content: "";
  position: absolute;
  left: var(--if-portal-x,50%); top: var(--if-portal-y,50%);
  width: min(76vw,650px); aspect-ratio: 1;
  border: 1px solid rgba(255,100,30,.9);
  border-radius: 50%;
  transform: translate(-50%,-50%) rotateX(62deg) scale(.35);
  box-shadow: 0 0 25px rgba(255,100,30,.5), inset 0 0 35px rgba(255,100,30,.15);
}
.if-portal-transition::after {
  width: min(57vw,480px);
  border-color: rgba(112,207,255,.65);
  transform: translate(-50%,-50%) rotateX(62deg) rotate(35deg) scale(.35);
  box-shadow: 0 0 28px rgba(112,207,255,.22), inset 0 0 25px rgba(112,207,255,.08);
}
.if-portal-transition.is-active {
  opacity: 1; visibility: visible; clip-path: circle(150% at var(--if-portal-x,50%) var(--if-portal-y,50%));
}
.if-portal-transition.is-active::before { animation: if-portal-spin .75s ease-out both; }
.if-portal-transition.is-active::after { animation: if-portal-spin-reverse .85s ease-out both; }
.if-portal-transition-label {
  position: relative; z-index: 1; margin-top: min(35vh,260px);
  color: #f6e8de; font-size: 10px; font-weight: 800; letter-spacing: .24em;
  text-transform: uppercase; text-align: center; text-shadow: 0 0 24px rgba(255,100,30,.6);
}
.if-hub-pulse {
  position: fixed; z-index: 9998; width: 12px; height: 12px; border-radius: 50%;
  pointer-events: none; border: 1px solid rgba(255,126,65,.9);
  box-shadow: 0 0 18px rgba(255,100,30,.7);
  transform: translate(-50%,-50%) scale(.2); animation: if-hub-pulse .48s ease-out forwards;
}
@keyframes if-portal-spin { to { transform:translate(-50%,-50%) rotateX(62deg) rotate(145deg) scale(1.15); opacity:0; } }
@keyframes if-portal-spin-reverse { to { transform:translate(-50%,-50%) rotateX(62deg) rotate(-125deg) scale(1.3); opacity:0; } }
@keyframes if-hub-pulse { to { transform:translate(-50%,-50%) scale(8); opacity:0; } }
@media (max-width:760px) {
  .nav-links a, .menu a { min-height:44px; display:flex; align-items:center; }
  .if-portal-transition::before { width:min(115vw,540px); }
  .if-portal-transition::after { width:min(90vw,410px); }
  .if-portal-transition-label { font-size:9px; letter-spacing:.15em; padding:0 18px; }
}
@media (prefers-reduced-motion:reduce) {
  .nav-links a, .menu a, .button, .nav-cta, .back, .project-card { transition:none !important; }
  .if-portal-transition, .if-portal-transition::before, .if-portal-transition::after { animation:none !important; transition:none !important; }
}

/* NEXUS HUB — home screen conceived as a cinematic game-world selector */
.nexus-hero {
  min-height: min(900px, calc(100svh - 76px)) !important;
  min-height: max(760px, calc(100svh - 76px)) !important;
  max-width: none !important; width: 100% !important;
  margin: 0 !important; padding: clamp(58px,7vh,92px) clamp(18px,5.5vw,88px) 76px !important;
  display: grid !important; grid-template-columns: minmax(0, .9fr) minmax(440px,1.1fr);
  grid-template-rows: auto 1fr auto; align-items: center; gap: 24px;
  overflow: hidden; isolation: isolate;
  background: radial-gradient(ellipse at 72% 48%,rgba(255,92,28,.13),transparent 32%),
              radial-gradient(ellipse at 65% 50%,rgba(42,115,185,.16),transparent 47%),
              linear-gradient(125deg,#070a11 0%,#0a1020 52%,#08090e 100%);
}
.nexus-stars { position:absolute; inset:0; z-index:-2; pointer-events:none; opacity:.65;
  background-image:radial-gradient(circle,rgba(255,255,255,.8) 1px,transparent 1.6px),radial-gradient(circle,rgba(104,189,255,.65) 1px,transparent 1.8px);
  background-size:83px 83px,137px 137px;background-position:0 0,37px 59px;
  mask-image:linear-gradient(90deg,transparent,black 25%,black 95%); }
.nexus-grid { position:absolute; z-index:-1; width:100%;height:55%;bottom:-13%;left:0;pointer-events:none;
  background-image:linear-gradient(rgba(85,157,217,.13) 1px,transparent 1px),linear-gradient(90deg,rgba(85,157,217,.13) 1px,transparent 1px);
  background-size:44px 44px;transform:perspective(380px) rotateX(62deg) scale(1.5);transform-origin:bottom center;
  mask-image:linear-gradient(transparent,black 50%,transparent); }
.nexus-copy { grid-column:1; grid-row:1 / 3; z-index:3; max-width:640px; align-self:center; }
.nexus-copy .eyebrow {font-size:10px!important;letter-spacing:.22em!important;color:#aebed0!important}
.nexus-copy h1 {font-size:clamp(3.6rem,7.5vw,7.6rem)!important;line-height:.88!important;letter-spacing:-.075em!important;margin:28px 0!important}
.nexus-copy h1 em {font-style:normal;color:#ff6b2b!important;text-shadow:0 0 48px rgba(255,93,31,.3)}
.nexus-copy .hero-sub {color:#b9c5d4!important;font-size:clamp(15px,1.4vw,19px);line-height:1.7}
.nexus-portal {position:absolute;left:61%;top:45%;width:min(43vw,570px);aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%) rotateX(64deg) rotateZ(-16deg);
  border:1px solid rgba(95,185,255,.35);box-shadow:0 0 70px rgba(38,139,230,.13),inset 0 0 60px rgba(38,139,230,.08);pointer-events:none;z-index:0}
.nexus-portal::before,.nexus-portal::after,.nexus-portal span,.nexus-portal i {content:"";position:absolute;inset:7%;border-radius:50%;border:2px solid rgba(255,105,44,.65);box-shadow:0 0 24px rgba(255,96,37,.24),inset 0 0 24px rgba(255,96,37,.12)}
.nexus-portal::after {inset:15%;border-color:rgba(115,201,255,.6);border-width:1px}
.nexus-portal span {inset:23%;border-style:dashed;border-width:1px;border-color:rgba(255,255,255,.4)}
.nexus-portal i {inset:32%;border-width:1px;border-color:rgba(255,104,39,.55)}
.nexus-orbit {position:absolute;left:61%;top:45%;width:min(53vw,700px);height:min(19vw,245px);border:1px solid rgba(255,116,55,.2);border-radius:50%;transform:translate(-50%,-50%) rotate(-25deg);pointer-events:none;z-index:0}
.nexus-orbit-two {width:min(48vw,630px);height:min(25vw,320px);transform:translate(-50%,-50%) rotate(31deg);border-color:rgba(94,179,255,.22)}
.nexus-hero #fox-canvas {position:absolute;z-index:1;left:35%;top:9%;width:48%;height:62%;pointer-events:none;opacity:.9}
.nexus-destinations {grid-column:2;grid-row:1 / 3;z-index:4;align-self:center;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(9px,1.2vw,18px);padding-top:200px}
.nexus-destination {position:relative;min-height:200px;padding:17px 15px 18px!important;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:8px;overflow:hidden;text-decoration:none!important;color:#f4f6fb!important;
  border:1px solid rgba(139,190,232,.28);border-radius:9px;background:linear-gradient(145deg,rgba(22,38,59,.83),rgba(7,12,23,.91));backdrop-filter:blur(14px);
  box-shadow:inset 0 1px rgba(255,255,255,.1),0 15px 38px rgba(0,0,0,.28);transform:perspective(700px) rotateY(-4deg) translateZ(0);
  transition:transform .28s cubic-bezier(.2,.8,.2,1),border-color .28s,box-shadow .28s,background .28s}
.nexus-destination::before {content:"";position:absolute;inset:0;background:linear-gradient(125deg,transparent 25%,rgba(255,255,255,.1) 48%,transparent 70%);transform:translateX(-130%);transition:transform .6s;pointer-events:none}
.nexus-destination::after {content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,#ff641e,#71cfff);transform:scaleX(.1);transform-origin:left;transition:transform .28s}
.nexus-destination:hover {transform:perspective(700px) rotateY(0) translateY(-9px) scale(1.025);border-color:rgba(255,116,56,.72);box-shadow:inset 0 1px rgba(255,255,255,.16),0 25px 55px rgba(0,0,0,.4),0 0 28px rgba(255,100,30,.12);background:linear-gradient(145deg,rgba(37,48,65,.94),rgba(10,14,24,.96))}
.nexus-destination:hover::before {transform:translateX(130%)}
.nexus-destination:hover::after {transform:scaleX(1)}
.nexus-destination:active {transform:perspective(700px) translateY(3px) scale(.98);box-shadow:inset 0 4px 14px rgba(0,0,0,.4)}
.nexus-destination-index {position:absolute;top:15px;left:14px;font-size:8px;letter-spacing:.13em;color:#9eafc2}
.nexus-destination-icon {font-size:30px;color:#ff8a48;text-shadow:0 0 24px rgba(255,99,32,.65);margin-bottom:5px}
.nexus-destination-title {font-size:clamp(14px,1.45vw,20px);font-weight:850;letter-spacing:.08em}
.nexus-destination-sub {font-size:10px;color:#aebdce;line-height:1.5}
.nexus-destination-arrow {position:absolute;right:13px;bottom:15px;color:#7dcfff;font-size:18px;transition:transform .25s}
.nexus-destination:hover .nexus-destination-arrow {transform:translate(3px,-3px)}
.nexus-bottomline {position:absolute;left:clamp(18px,5.5vw,88px);right:clamp(18px,5.5vw,88px);bottom:25px;display:flex;justify-content:space-between;gap:15px;color:#8494a7;font-size:8px;letter-spacing:.16em}
.nexus-bottomline span:first-child {color:#8fe1c0}.nexus-bottomline i {display:inline-block;width:6px;height:6px;border-radius:50%;background:#62e5a5;box-shadow:0 0 12px #62e5a5;margin-right:8px}
.nexus-hero .hero-side-note {z-index:3;right:24px;top:25%;color:rgba(219,229,240,.55)}
.nexus-hero .scroll-note {z-index:3;bottom:57px}
@media(max-width:1000px) {
 .nexus-hero {grid-template-columns:1fr;grid-template-rows:auto auto;min-height:auto!important;padding-top:70px!important;padding-bottom:90px!important;gap:30px}
 .nexus-copy {grid-column:1;grid-row:1;max-width:700px}
 .nexus-copy h1 {font-size:clamp(3.8rem,11vw,7rem)!important}
 .nexus-portal {left:73%;top:27%;width:65vw;opacity:.7}
 .nexus-orbit {left:73%;top:27%;width:75vw}
 .nexus-hero #fox-canvas {left:42%;top:4%;width:53%;height:42%;opacity:.55}
 .nexus-destinations {grid-column:1;grid-row:2;padding-top:0;max-width:820px;width:100%;margin-inline:auto}
 .nexus-destination {min-height:180px}
}
@media(max-width:600px) {
 .nexus-hero {padding:54px 17px 88px!important;gap:26px}
 .nexus-copy h1 {font-size:clamp(3.35rem,16vw,5.4rem)!important;margin:23px 0!important}
 .nexus-copy .eyebrow {font-size:8px!important;letter-spacing:.12em!important}
 .nexus-copy .hero-sub {font-size:14px}
 .nexus-portal {left:80%;top:25%;width:90vw;opacity:.48}
 .nexus-orbit {left:80%;top:25%;width:95vw;opacity:.65}
 .nexus-hero #fox-canvas {left:44%;top:3%;width:57%;height:34%;opacity:.35}
 .nexus-destinations {grid-template-columns:1fr;gap:10px}
 .nexus-destination {min-height:102px;padding:18px 18px 16px 68px!important;justify-content:center;transform:none}
 .nexus-destination-index {top:12px;left:68px;font-size:7px}
 .nexus-destination-icon {position:absolute;left:18px;top:36px;font-size:27px}
 .nexus-destination-title {font-size:16px}
 .nexus-destination-sub {font-size:10px}
 .nexus-destination-arrow {right:18px;bottom:37px}
 .nexus-bottomline {bottom:18px;font-size:7px;letter-spacing:.08em}
 .nexus-bottomline span:last-child {display:none}
 .nexus-hero .hero-side-note {display:none}
 .nexus-hero .scroll-note {display:none}
}
@media(prefers-reduced-motion:reduce) {
 .nexus-destination,.nexus-destination::before,.nexus-destination::after {transition:none!important}
}
