/* ============================================================
   SERVICES PAGE — dark aurora hero + a clean static grid below.
   No scroll-jacking, no pinned story: this is intentionally a
   normal page you can scan and click through.
   ============================================================ */

.svc-hero{position:relative;min-height:62vh;display:flex;align-items:center;overflow:hidden;
  background:var(--navy-deep);color:#fff;padding:130px 0 80px}
.svc-aurora{position:absolute;inset:-15%;filter:blur(70px);opacity:.5;pointer-events:none;z-index:0}
.svc-aurora span{position:absolute;border-radius:50%;mix-blend-mode:screen}
.svc-aurora span:nth-child(1){width:44vw;height:44vw;top:-12%;left:-8%;
  background:radial-gradient(circle,var(--gold) 0%,transparent 70%);animation:auroraA 24s ease-in-out infinite}
.svc-aurora span:nth-child(2){width:38vw;height:38vw;bottom:-16%;right:-8%;
  background:radial-gradient(circle,#8a6d1f 0%,transparent 70%);animation:auroraB 28s ease-in-out infinite}
.svc-aurora span:nth-child(3){width:26vw;height:26vw;top:28%;right:18%;
  background:radial-gradient(circle,#d8b65e 0%,transparent 70%);animation:auroraC 19s ease-in-out infinite}
@keyframes auroraA{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(6%,8%) scale(1.15)}}
@keyframes auroraB{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-8%,-5%) scale(1.1)}}
@keyframes auroraC{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-6%,6%) scale(1.2)}}
.svc-grid-overlay{position:absolute;inset:0;z-index:0;opacity:.35;
  background-image:linear-gradient(rgba(216,182,94,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(216,182,94,.08) 1px,transparent 1px);
  background-size:48px 48px;mask-image:radial-gradient(ellipse at 50% 40%,#000 0%,transparent 72%)}
.svc-hero .container{position:relative;z-index:2}
.svc-hero .crumbs{color:rgba(255,255,255,.55)}
.svc-title{font-family:var(--font-display);font-weight:400;color:#fff;
  font-size:clamp(2.6rem,6.6vw,4.6rem);line-height:1.04;max-width:14ch;margin:.3em 0 .4em}
.svc-sub{max-width:52ch;color:rgba(255,255,255,.78);font-size:1.08rem}
@media(prefers-reduced-motion:reduce){.svc-aurora span{animation:none}}

/* ---------- Services grid ---------- */
.svc-section-dark{background:var(--navy-deep);padding:20px 0 100px}
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem}
.svc-card{background:var(--surface,#16130E);border:1px solid var(--line-soft,rgba(246,243,235,.08));
  border-radius:var(--r,14px);overflow:hidden;
  transition:transform .4s var(--ease),border-color .4s,box-shadow .4s}
.svc-card:hover{border-color:var(--line,rgba(230,203,136,.16));transform:translateY(-5px);box-shadow:var(--shadow)}
.svc-photo{position:relative;aspect-ratio:16/10;background-size:cover;background-position:center}
.svc-photo::after{content:"";position:absolute;inset:0;
  background:linear-gradient(0deg,rgba(8,7,5,.55) 0%,rgba(8,7,5,.05) 55%)}
.svc-card .svc-icon{position:absolute;z-index:2;bottom:-24px;left:1.7rem;width:56px;height:56px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;background:var(--navy-deep);
  border:1px solid rgba(216,182,94,.45);box-shadow:0 10px 22px -8px rgba(0,0,0,.65)}
.svc-card .svc-icon svg{width:24px;height:24px;fill:none;stroke:var(--accent,var(--gold-soft));
  stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.svc-body{padding:2.5rem 1.8rem 1.8rem}
.svc-card h3{color:#fff;font-size:1.3rem;margin-bottom:.6rem}
.svc-card p{color:rgba(255,255,255,.65);font-size:.94rem;line-height:1.6;margin-bottom:1.5rem}
.svc-card .option-chips{margin-bottom:1.5rem}
.svc-card .option-chips a{border-color:rgba(255,255,255,.24);color:rgba(255,255,255,.85)}
.svc-card .option-chips a:hover{border-color:var(--gold-soft);background:var(--gold-soft);color:var(--navy-deep)}
.svc-card .btn-wa{padding:.7rem 1.3rem;font-size:.88rem}

@media(max-width:980px){.svc-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.svc-grid{grid-template-columns:1fr}}