/* ============================================================
   Alien Tech Pro — Services page
   ============================================================ */

/* ===== HERO ===== */
.services-hero{padding:92px 0 88px;overflow:hidden;}
.services-hero .abstract-blob{opacity:.35;}
.hero-grid{display:grid;grid-template-columns:1fr 0.9fr;gap:60px;align-items:center;position:relative;z-index:1;}
.services-hero h1{
  font-size:clamp(32px,4.6vw,54px);font-weight:700;line-height:1.16;margin-bottom:22px;
  color:var(--ink-dark);letter-spacing:-0.02em;
}
.services-hero h1 .word{display:inline-block;overflow:hidden;vertical-align:top;}
.services-hero h1 .word span{display:inline-block;transform:translateY(115%);animation:word-up .9s cubic-bezier(.16,.84,.44,1) forwards;}
.services-hero p.lede{font-size:16.5px;line-height:1.85;color:var(--ink-dark-soft);max-width:480px;margin-bottom:32px;}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;}
.hero-photo{position:relative;}
.hero-photo figure{
  border-radius:24px;overflow:hidden;aspect-ratio:4/3.3;
  box-shadow:0 40px 70px -30px rgba(11,14,46,.28);animation:float-sm 7s ease-in-out infinite;
}
.hero-photo img{width:100%;height:100%;object-fit:cover;}

/* ===== SERVICE ROW ===== */
.service-row{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;}
.service-row.flip .service-media{order:2;}
.service-row.flip .service-copy{order:1;}
.service-media{position:relative;}
.service-media figure{
  position:relative;z-index:1;border-radius:22px;overflow:hidden;aspect-ratio:4/3.4;
  box-shadow:0 34px 60px -28px rgba(11,14,46,.22);animation:float-sm 6.5s ease-in-out infinite;
}
.service-media img{width:100%;height:100%;object-fit:cover;}
.service-media.tilt figure{
  aspect-ratio:3/4;max-width:280px;margin:0 auto;
  transform:rotate(-4deg);border-radius:28px;animation:tilt-float 6s ease-in-out infinite;
}
@keyframes tilt-float{0%,100%{transform:rotate(-4deg) translateY(0);}50%{transform:rotate(-1deg) translateY(-14px);}}
.service-glow{
  position:absolute;inset:-30px;border-radius:32px;
  background:radial-gradient(closest-side, color-mix(in srgb, var(--acc, var(--orange-500)) 30%, transparent), transparent 72%);
  filter:blur(20px);z-index:0;
}
.service-eyebrow{
  display:inline-flex;align-items:center;gap:12px;
  font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--acc, var(--orange-500));margin-bottom:14px;
}
.service-eyebrow::before{content:"";width:30px;height:2px;border-radius:2px;background:currentColor;opacity:.5;}
.service-copy h2{font-size:clamp(26px,3.2vw,36px);font-weight:700;line-height:1.2;margin-bottom:18px;color:var(--ink-dark);}
.service-copy p{font-size:16px;line-height:1.85;color:var(--ink-dark-soft);max-width:460px;margin-bottom:26px;}
.service-checklist{display:flex;flex-direction:column;gap:14px;max-width:460px;}
.service-checklist li{display:flex;align-items:flex-start;gap:12px;font-size:15px;color:var(--ink-dark-soft);line-height:1.6;}
.service-checklist .tick{
  flex-shrink:0;width:24px;height:24px;border-radius:50%;
  background:color-mix(in srgb, var(--acc, var(--orange-500)) 16%, white);
  color:var(--acc, var(--orange-500));
  display:flex;align-items:center;justify-content:center;margin-top:1px;font-size:12px;font-weight:700;
}

/* ===== RESPONSIVE ===== */
@media (max-width:960px){
  .hero-grid,.service-row{grid-template-columns:1fr;gap:44px;}
  .service-row.flip .service-media{order:1;}
  .service-row.flip .service-copy{order:2;}
}
@media (max-width:760px){
  .services-hero{padding:56px 0;}
}
