/* Neo Soft — styles (dark theme, purple highlights) */
:root{
  --purple:#9b5de5;
  --fuchsia:#d14bf0;
}

body {
    line-height: 1.55;
}

/* Hero cinematic grid layout */
.hero-section{ min-height:clamp(74vh,82vh,92vh); display:flex; align-items:center; justify-content:center; padding:clamp(5.5rem, 12vh, 8rem) 0 4rem; }
.hero-glow{ position:absolute; inset:auto -40% -30%; height:60%; background:radial-gradient(circle at center, rgba(209,75,240,.22), transparent 65%); filter:blur(60px); opacity:.9; pointer-events:none; }
.hero-container{ position:relative; z-index:10; width:100%; max-width:72rem; margin:0 auto; display:grid; gap:2.5rem; grid-template-columns:repeat(1, minmax(0,1fr)); justify-items:center; text-align:center; }
.hero-copy{ max-width:36rem; margin:0 auto; text-align:center; }
.hero-kicker{ display:inline-flex; align-items:center; gap:.4rem; padding:.35rem .85rem; border-radius:9999px; border:1px solid rgba(236,233,255,.18); background:rgba(11,1,20,.75); color:rgba(236,233,255,.78); font-size:.7rem; letter-spacing:.24em; text-transform:uppercase; margin-inline:auto; }
.hero-title{ margin-top:1.35rem; font-size:clamp(2.25rem, 5vw, 4.25rem); font-weight:800; line-height:1.04; letter-spacing:-.02em; }
.hero-title__accent{ color:var(--fuchsia); text-shadow:0 0 22px rgba(209,75,240,.35); }
.hero-subtitle{ margin-top:1rem; color:rgba(255,255,255,.78); font-size:clamp(.95rem, 1.5vw, 1.15rem); line-height:1.7; }
.hero-actions{ margin-top:2rem; display:flex; flex-wrap:wrap; gap:.75rem; justify-content:center; }

.section-gradient{ position:relative; z-index:0; }
.section-gradient > *{ position:relative; z-index:1; }
.section-gradient::before,
.section-gradient::after{ content:''; position:absolute; left:0; width:100%; height:120px; pointer-events:none; }
.section-gradient::before{ top:-120px; background:linear-gradient(to bottom, rgba(12,2,22,0), rgba(10,1,20,.82)); }
.section-gradient::after{ bottom:-120px; background:linear-gradient(to top, rgba(12,2,22,0), rgba(10,1,20,.82)); }
.section-gradient:last-of-type::after{ display:none; }

/* Studio flair section */
.studio-flair{ position:relative; padding:4.5rem 0; background:linear-gradient(180deg, rgba(12,2,22,.95), rgba(0,0,0,1)); }
.studio-flair::before{ content:''; position:absolute; inset:0; background:radial-gradient(circle at 25% 20%, rgba(209,75,240,.14), transparent 55%); opacity:.85; }
.studio-flair__container{ position:relative; z-index:1; max-width:72rem; margin:0 auto; padding:0 1.5rem; }
.studio-flair__header{ max-width:48rem; }
.studio-flair__kicker{ display:inline-flex; align-items:center; gap:.5rem; font-size:.72rem; letter-spacing:.3em; text-transform:uppercase; color:rgba(236,233,255,.65); }
.studio-flair__kicker::before{ content:''; display:block; width:32px; height:1px; background:linear-gradient(90deg, rgba(236,233,255,.3), transparent); }
.studio-flair__title{ margin-top:1.25rem; font-size:clamp(1.75rem, 3vw, 2.5rem); font-weight:700; line-height:1.25; color:#f5ecff; }
.studio-flair__subtitle{ margin-top:.85rem; font-size:1rem; color:rgba(255,255,255,.72); line-height:1.75; }
.studio-flair__grid{ margin-top:2.75rem; display:grid; gap:1.2rem; }
.flair-card{ position:relative; padding:1.75rem; border-radius:1rem; border:1px solid rgba(255,255,255,.08); background:linear-gradient(120deg, rgba(255,255,255,.05), rgba(7,1,15,.85)); overflow:hidden; }
.flair-card::after{ content:''; position:absolute; inset:-50% auto auto -20%; width:60%; height:120%; background:linear-gradient(140deg, rgba(155,93,229,.2), transparent 65%); transform:skewY(-18deg); opacity:.6; pointer-events:none; }
.flair-card__title{ font-size:1.2rem; font-weight:600; color:#f8e8ff; }
.flair-card__copy{ margin-top:.55rem; font-size:.95rem; color:rgba(255,255,255,.75); line-height:1.65; }

.social-pill{ position:relative; font-weight:700; letter-spacing:.18em; }
.social-pill__icon{ width:18px; height:18px; fill:currentColor; }
body.custom-cursor-active,
body.custom-cursor-active * {
  cursor: none !important;
}

/* Improve anchor scroll positioning when navbar is fixed */
section[id] {
  scroll-margin-top: clamp(4.5rem, 8vh, 6.5rem);
}

#cursor {
  opacity: 0;
  background: rgba(155, 93, 229, .12);
  border: 2px solid rgba(236, 233, 255, .45);
  box-shadow: 0 0 28px rgba(209, 75, 240, .35);
  transition: opacity .2s ease, transform .1s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;
}

#cursor.cursor-hover {
  background: rgba(209, 75, 240, .2);
  border-color: rgba(236, 233, 255, .85);
  box-shadow: 0 0 38px rgba(209, 75, 240, .55);
}

#cursor.cursor-press {
  background: rgba(209, 75, 240, .28);
  border-color: rgba(255, 255, 255, .9);
  box-shadow: 0 0 24px rgba(209, 75, 240, .65);
}

.nav-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.65rem 1.05rem;
  border-radius:9999px;
  min-height:2.5rem;
  color:rgba(236,233,255,.78);
  transition:color .2s ease, background .2s ease, transform .15s ease;
}

.nav-link:hover{
  color:#f5ecff;
  background:rgba(209,75,240,.14);
  transform:translateY(-1px);
}

.nav-link:focus-visible{
  background:rgba(209,75,240,.18);
  outline:2px solid rgba(209,75,240,.55);
  outline-offset:3px;
}

/* Scrollbar hidden util */
.no-scrollbar{ scrollbar-width:none; }
.no-scrollbar::-webkit-scrollbar{ display:none; }

/* Navbar background on scroll */
.sticky-nav{ background: rgba(0,0,0,.8); backdrop-filter: blur(10px); border-bottom: 1px solid rgba(255,255,255,.1); }

/* Card 3D styles */
.card3d{ position:relative; width:clamp(260px, 70vw, 340px); background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); border-radius:1rem; overflow:hidden; transition:transform .15s ease, background .2s ease; scroll-snap-align:start; }
.services-slider{ position:relative; overflow:hidden; padding-bottom:.5rem; }
.services-track{ display:flex; transition:transform .6s ease; will-change:transform; }
.services-slide{ flex:0 0 100%; box-sizing:border-box; padding:0 .25rem; display:grid; gap:1rem; }
.services-slide .card3d{ width:100%; }
.card3d--placeholder{ visibility:hidden; pointer-events:none; }
@media (min-width:640px){ .services-slide{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (min-width:1024px){ .services-slide{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
.card3d:hover{ background:rgba(255,255,255,.08); }
.card3d-img{ position:relative; background:rgba(0,0,0,.3); aspect-ratio:16/9; overflow:hidden; }
.card3d-img img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.75; }
.card3d-img--services{ display:flex; align-items:center; justify-content:center; font-size:.75rem; letter-spacing:.18em; text-transform:uppercase; color:rgba(255,255,255,.8); text-align:center; padding:0 1rem; }
.card3d-img--services span{ position:relative; z-index:2; padding:0 1rem; text-shadow:0 0 18px rgba(0,0,0,.55); transition:opacity .3s ease, transform .3s ease; }
.card3d-img--services::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,0) 35%, rgba(0,0,0,.55)); opacity:0; transition:opacity .3s ease; pointer-events:none; }
.card3d-img--services.has-media::after{ opacity:1; }
.card3d-img--services.has-media span{ opacity:0; transform:translateY(4px); pointer-events:none; }
.card3d-img-media{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; opacity:1; filter:brightness(.92); transition:transform .35s ease, filter .35s ease; }
.card3d:hover .card3d-img--services.has-media .card3d-img-media{ transform:scale(1.03); filter:brightness(1); }
.card3d-img--buns{ background:linear-gradient(135deg, rgba(255,89,0,.55), rgba(255,191,71,.45)); }
.card3d-img--fatum{ background:linear-gradient(135deg, rgba(86,44,140,.6), rgba(13,12,58,.65)); }
.card3d-img--buildy{ background:linear-gradient(135deg, rgba(58,168,96,.55), rgba(12,54,32,.65)); }
.card3d-img--phase{ background:linear-gradient(135deg, rgba(91,149,255,.55), rgba(25,38,84,.7)); }
.card3d-img--secret{ background:linear-gradient(135deg, rgba(148,163,184,.35), rgba(30,41,59,.6)); }
.card3d-title{ font-weight:600; font-size:1.125rem; color:#e9d5ff; }
.card3d-desc{ font-size:.9rem; color:rgba(255,255,255,.75); margin-top:.25rem; }
.card3d-link{ display:inline-block; margin-top:1rem; color:#d6bcfa; text-decoration:none; }
.card3d-link:hover{text-decoration:underline;}
.card3d::after{ content:''; position:absolute; inset:-1px; border-radius:1rem; box-shadow:0 0 60px rgba(155,93,229,.25); pointer-events:none; }

/* Carousel controls */
.carousel-controls{ position:absolute; top:50%; left:-50px; right:-50px; display:flex; align-items:center; justify-content:space-between; pointer-events:none; transform:translateY(-50%); }
.carousel-controls button{ pointer-events:auto; height:40px; width:40px; border-radius:9999px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2); backdrop-filter: blur(8px); }
.carousel-controls button:hover{ background:rgba(255,255,255,.2); }

@media (max-width:640px){
  .carousel-controls{ top:100%; left:0; right:0; transform:none; margin-top:.75rem; justify-content:center; gap:.75rem; }
}

#gamesTrack{ scroll-snap-type:x proximity; padding-bottom:.5rem; }

/* News cards */
.news-card{ border:1px solid rgba(255,255,255,.1); padding:1.5rem; border-radius:.75rem; background:linear-gradient(135deg, rgba(255,255,255,.05), transparent); }
.news-date{ font-size:.75rem; color:rgba(255,255,255,.6); }
.news-title{ font-weight:700; font-size:1.25rem; color:#e9d5ff; margin:.25rem 0 .5rem; }
.news-summary{ color:rgba(255,255,255,.85); font-size:.95rem; }

/* Team */
.team-card{ position:relative; perspective:1200px; }
.team-card:focus{ outline:none; }
.team-card:focus-visible{ outline:2px solid rgba(155,93,229,.6); outline-offset:6px; border-radius:.95rem; }
.team-card-inner{ position:relative; width:100%; min-height:260px; transform-style:preserve-3d; transition:transform .6s ease; }
.team-card:hover .team-card-inner,
.team-card:focus-visible .team-card-inner{ transform:rotateY(180deg); }
.team-card-face{ position:absolute; inset:0; padding:1.75rem 1.5rem; border-radius:.75rem; border:1px solid rgba(255,255,255,.1); background:rgba(255,255,255,.05); display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:.75rem; backface-visibility:hidden; transition:background .3s ease, border-color .3s ease; }
.team-card:hover .team-card-face,
.team-card:focus-visible .team-card-face{ background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.18); }
.team-card-back{ transform:rotateY(180deg); padding:2rem 1.75rem; gap:.65rem; }
.team-avatar{ height:96px; width:96px; margin:0 auto; border-radius:9999px; background:linear-gradient(135deg, var(--purple), var(--fuchsia)); box-shadow:0 0 40px rgba(155,93,229,.35); overflow:hidden; }
.team-avatar img{ width:100%; height:100%; object-fit:cover; border-radius:inherit; }
.team-name{ font-weight:600; font-size:1.1rem; }
.team-role{ font-size:.85rem; color:rgba(216,180,254,.8); letter-spacing:.01em; text-transform:uppercase; }
.team-bio{ font-size:.85rem; color:rgba(255,255,255,.72); line-height:1.5; }

@media (prefers-reduced-motion: reduce){
  .team-card-inner{ transition:none; }
  .team-card:hover .team-card-inner,
  .team-card:focus-visible .team-card-inner{ transform:none; }
  .team-card-face{ transition:background .2s ease, border-color .2s ease; }
}

/* Inputs / buttons */
.input, .textarea{ border:1px solid rgba(255,255,255,.15); background:rgba(255,255,255,.05); border-radius:.5rem; padding:.6rem .75rem; color:white; }
.input::placeholder, .textarea::placeholder{ color:rgba(255,255,255,.4); }
.btn-primary{ display:inline-flex; align-items:center; justify-content:center; padding:.7rem 1.25rem; border-radius:.5rem; font-weight:600; color:white; background:linear-gradient(90deg, var(--purple), var(--fuchsia)); box-shadow:0 10px 20px rgba(155,93,229,.2); text-align:center; }
.btn-primary:hover{ filter:brightness(1.05); }
.btn-outline{ display:inline-flex; align-items:center; justify-content:center; padding:.7rem 1.25rem; border-radius:.5rem; border:1px solid rgba(255,255,255,.2); text-align:center; }
.btn-outline:hover{ border-color: rgba(216,180,254,.6); color:#e9d5ff; }

/* Custom shadow for cursor */
.shadow-glow{ box-shadow:0 0 20px rgba(155,93,229,.5); }

/* Hamburger / Mobile menu */
.hamburger-line{ width:18px; height:2px; background:rgba(255,255,255,.8); margin:2px 0; display:block }
.mobile-menu{ background:rgba(0,0,0,.9); border-top:1px solid rgba(255,255,255,.12); padding:.75rem 1rem; }
.mobile-menu__header{ display:flex; align-items:center; justify-content:space-between; padding-bottom:.5rem; margin-bottom:.75rem; border-bottom:1px solid rgba(255,255,255,.08); }
.mobile-menu__title{ font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:rgba(255,255,255,.65); font-weight:700; }
.mobile-menu__links{ display:flex; flex-direction:column; }
.mobile-menu a{ display:block; padding:.5rem 0; border-bottom:1px solid rgba(255,255,255,.06); }
.mobile-menu a:last-child{ border-bottom:0; }
.mobile-menu__section{ margin-top:1rem; padding-top:1rem; border-top:1px solid rgba(255,255,255,.08); }
.mobile-menu__label{ display:block; font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.55); font-weight:600; margin-bottom:.45rem; }

.audio-toggle{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.5rem 1.6rem;
  border-radius:9999px;
  border:0;
  background:linear-gradient(135deg, rgba(209,75,240,.7), rgba(155,93,229,.25));
  color:rgba(255,255,255,.85);
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  box-shadow:0 8px 24px rgba(155,93,229,.25);
  transition:background .25s ease, box-shadow .25s ease, transform .2s ease, color .2s ease;
}

.audio-toggle:hover{
  background:linear-gradient(135deg, rgba(209,75,240,.85), rgba(155,93,229,.4));
  box-shadow:0 12px 30px rgba(155,93,229,.35);
  transform:translateY(-1px);
  color:white;
}

.audio-toggle:focus-visible{
  outline:none;
  box-shadow:0 0 0 2px rgba(209,75,240,.3),0 10px 28px rgba(155,93,229,.4);
}

.audio-toggle::after{
  content:'';
  position:absolute;
  inset:0;
  border-radius:9999px;
  border:1px solid rgba(236,233,255,.15);
  pointer-events:none;
}

.audio-toggle--mobile{
  width:100%;
  justify-content:center;
}

.language-select{
  position:relative;
  display:inline-flex;
  align-items:center;
  padding:2px;
  border-radius:9999px;
  background:linear-gradient(135deg, rgba(209,75,240,.7), rgba(155,93,229,.25));
  box-shadow:0 8px 24px rgba(155,93,229,.25);
  transition:background .25s ease, box-shadow .25s ease, transform .2s ease;
}

.language-select:hover{
  background:linear-gradient(135deg, rgba(209,75,240,.85), rgba(155,93,229,.4));
  box-shadow:0 12px 30px rgba(155,93,229,.35);
  transform:translateY(-1px);
}

.language-select:focus-within{
  box-shadow:0 0 0 2px rgba(209,75,240,.3),0 10px 28px rgba(155,93,229,.4);
}

.language-select::after{
  content:'';
  position:absolute;
  right:14px;
  width:8px;
  height:8px;
  border:2px solid rgba(236,233,255,.75);
  border-left:0;
  border-top:0;
  transform:rotate(45deg);
  pointer-events:none;
  transition:transform .2s ease;
}

.language-select:hover::after{ transform:translateY(1px) rotate(45deg); }

.language-select__field{
  appearance:none;
  -webkit-appearance:none;
  border:0;
  background:rgba(7,1,15,.88);
  color:rgba(255,255,255,.9);
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  padding:.45rem 2.4rem .45rem 1rem;
  border-radius:9999px;
  min-width:110px;
  cursor:pointer;
}

.language-select__field:focus{
  outline:none;
  background:rgba(12,1,24,.95);
}

.language-select__field option{
  color:#0f0018;
  background:white;
}

.language-select--mobile{ width:100%; margin-top:.4rem; }

.language-select--mobile .language-select__field{ width:100%; }

/* Responsive Cards */
@media (max-width: 640px){
  #gamesTrack{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    overflow:visible;
    scroll-snap-type:unset;
  }

  .card3d{ width:100%; }

  /* Buttons full width on mobile */
  .btn-primary,
  .btn-outline{ width:100%; }
}

@media (max-width: 768px){
  #home{
    height:auto;
    min-height:70vh;
    padding:5.5rem 0 3rem;
  }

  #heroContent h1{
    font-size:clamp(2.4rem, 7vw, 3rem);
  }
}

@media (max-width: 480px){
  #heroContent{
    padding-inline:0.25rem;
  }

  #heroContent h1{
    font-size:clamp(2rem, 8.6vw, 2.6rem);
    line-height:1.2;
  }

  #heroContent p{
    font-size:.95rem;
    line-height:1.6;
  }

  .news-card{
    padding:1.25rem;
  }

  .team-card-face{
    padding:1.5rem 1.25rem;
  }

  .team-card-back{
    gap:.5rem;
  }

  #backToTop{
    height:2.75rem;
    width:2.75rem;
    right:1rem;
    bottom:1rem;
  }

  .footer-inner{
    text-align:center;
  }

  .footer-inner > div:last-child{
    justify-content:center;
  }
}

@media (min-width: 768px){
  .studio-flair__grid{ grid-template-columns:repeat(3, minmax(0,1fr)); }
}

@media (min-width: 1024px){
  .hero-section{ min-height:88vh; }
  #gamesTrack{ justify-content:center; }
}

@media (prefers-reduced-motion: reduce){
  .card3d{ transition: background .2s ease; }
}