/* Homepage polish 2026-09-28: desktop density, motion and commercial SEO links. */

.hero{
  position:relative;
  isolation:isolate;
  overflow:clip;
}
.hero::before,
.hero::after{
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:-1;
  border-radius:50%;
  filter:blur(2px);
}
.hero::before{
  width:520px;
  height:520px;
  right:-180px;
  top:-170px;
  background:radial-gradient(circle,rgba(42,141,244,.18),rgba(42,141,244,0) 70%);
}
.hero::after{
  width:420px;
  height:420px;
  left:-180px;
  bottom:-220px;
  background:radial-gradient(circle,rgba(63,208,255,.10),rgba(63,208,255,0) 72%);
}

.seo-intent-links{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
}
.seo-intent-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:38px;
  padding:7px 13px;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(255,255,255,.055);
  color:var(--muted);
  font-size:13px;
  font-weight:750;
  transition:transform .2s ease,border-color .2s ease,color .2s ease,background .2s ease;
}
.seo-intent-link::after{
  content:"→";
  color:var(--primary-2);
  transition:transform .2s ease;
}
.seo-intent-link:hover{
  transform:translateY(-2px);
  border-color:rgba(42,141,244,.34);
  color:var(--text);
  background:rgba(42,141,244,.08);
}
.seo-intent-link:hover::after{transform:translateX(2px)}

.site-header{
  transition:box-shadow .24s ease,background .24s ease,border-color .24s ease;
}
.site-header.is-scrolled{
  box-shadow:0 12px 34px rgba(7,18,36,.10);
}

.home-reveal{
  opacity:0;
  transform:translate3d(0,22px,0);
  transition:opacity .62s cubic-bezier(.2,.7,.2,1),transform .62s cubic-bezier(.2,.7,.2,1);
  will-change:opacity,transform;
}
.home-reveal.is-visible{
  opacity:1;
  transform:none;
}

@media (min-width:1021px){
  /* The former 100svh hero plus 96px section padding created a large empty desktop viewport. */
  .hero.section-pad{
    min-height:auto;
    padding:54px 0 62px;
  }
  .hero-grid{
    align-items:center;
    gap:54px;
  }
  .hero-copy{
    padding-block:6px;
  }
  .hero h1{
    font-size:clamp(48px,5.35vw,74px);
    line-height:.96;
  }
  .hero-lead{
    max-width:680px;
  }
  .hero-device{
    transform:translate3d(0,var(--hero-parallax-y,0px),0);
    will-change:transform;
  }
  .hero-device .device-shell{
    transform:perspective(1200px) rotateX(var(--hero-tilt-x,0deg)) rotateY(var(--hero-tilt-y,0deg));
    transform-style:preserve-3d;
    transition:transform .22s ease,border-color .24s ease,box-shadow .24s ease;
  }
  .hero-device:hover .device-shell{
    border-color:rgba(42,141,244,.25);
    box-shadow:0 28px 78px rgba(24,58,96,.18);
  }
  html[data-theme="dark"] .hero-device:hover .device-shell{
    box-shadow:0 30px 90px rgba(0,0,0,.40),0 0 50px rgba(42,141,244,.08);
  }
  .hero-device .device-content{
    transform:translateZ(12px);
  }
  .software-feature-section::before{
    transform:translate3d(0,var(--software-parallax-y,0px),0);
    will-change:transform;
  }
  .service-card,
  .project-card,
  .profile-card,
  .local-card,
  .visual-card{
    transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
  }
  .service-card:hover,
  .profile-card:hover,
  .local-card:hover,
  .visual-card:hover{
    transform:translateY(-3px);
    border-color:rgba(42,141,244,.22);
  }
}

@media (max-width:1020px){
  .seo-intent-links{margin-top:16px}
}

@media (max-width:760px){
  .seo-intent-links{
    display:grid;
    grid-template-columns:1fr;
  }
  .seo-intent-link{
    justify-content:space-between;
    min-height:44px;
  }
  .home-reveal{
    opacity:1;
    transform:none;
    transition:none;
  }
}

@media (prefers-reduced-motion:reduce){
  .home-reveal,
  .hero-device,
  .hero-device .device-shell,
  .software-feature-section::before,
  .seo-intent-link,
  .seo-intent-link::after{
    animation:none!important;
    transition:none!important;
    transform:none!important;
  }
}