/* =======================
   SERVICES PAGE
   ======================= */

/* Hero (shared look) */
.page-hero{position:relative;min-height:360px;display:flex;align-items:center;overflow:hidden;background:#0b0e13;border-bottom:1px solid #151c26}
.page-hero__bg{position:absolute;inset:0;background-size:cover;background-position:center;filter:saturate(105%) brightness(.65)}
.page-hero__overlay{position:absolute;inset:0;background:
  radial-gradient(1200px 500px at 65% -120px, rgba(124,92,255,.25), transparent 65%),
  radial-gradient(900px 400px at 20% -80px, rgba(25,227,195,.18), transparent 60%),
  linear-gradient(180deg,rgba(10,14,20,.78),rgba(10,14,20,.9))}
.page-hero__inner{position:relative;z-index:2;text-align:center;padding:54px 0}
.page-hero__title{margin:0 0 10px;font-size:38px;line-height:1.15;font-weight:900}
.page-hero__accent{background:linear-gradient(135deg,var(--brand-1),var(--brand-2));-webkit-background-clip:text;background-clip:text;color:transparent}
.page-hero__sub{color:#b8c7e6;margin-bottom:16px}

/* Chips rail */
.svc-rail{background:transparent;border:0}
.rail-inner{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;padding:8px 0 0}
.svc-rail a{display:inline-flex;align-items:center;padding:.5rem .9rem;border:1px solid #22314b;border-radius:999px;background:#0f1827;color:#cfe1ff;font-weight:800;font-size:.9rem;box-shadow:0 6px 16px rgba(0,0,0,.28)}
.svc-rail a:hover{border-color:#2b3b5a}

/* Showcase timeline layout */
.svc-showcase{padding:36px 0;position:relative}
.svc-showcase .container{position:relative;max-width:1160px}
.timeline{position:absolute;top:0;bottom:0;left:50%;transform:translateX(-50%);width:2px;background:linear-gradient(180deg,rgba(124,92,255,.38),rgba(25,227,195,.38))}
.svc-piece{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:64px;align-items:start;margin:48px 0;opacity:0;transform:translateY(22px)}
.reveal.in{opacity:1;transform:none;transition:.45s ease}
.svc-piece.left  .shot{grid-column:1;justify-self:end;max-width:540px;width:100%}
.svc-piece.left  .copy{grid-column:2;justify-self:start;max-width:520px;width:100%}
.svc-piece.right .shot{grid-column:2;justify-self:start;max-width:540px;width:100%}
.svc-piece.right .copy{grid-column:1;justify-self:end;max-width:520px;width:100%}

/* Tiles */
.shot{position:relative;border-radius:22px;overflow:hidden;border:1px solid #1c2741;background:#0f1521}
.shot img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;filter:saturate(108%) contrast(102%);transition:transform .45s,filter .45s}
.shot::after{content:"";position:absolute;inset:0;border-radius:22px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.03),0 28px 60px rgba(0,0,0,.55);pointer-events:none}
.svc-piece:hover .shot img{transform:scale(1.04);filter:saturate(118%)}

/* Copy card */
.copy{border:1px solid #1b253a;border-radius:18px;background:linear-gradient(180deg,#0f1521,#101a2b);box-shadow:0 20px 48px rgba(0,0,0,.5);padding:18px}
.title{margin:0 0 8px;color:#e6edf4;font-weight:900}
.title .idx{display:inline-grid;place-items:center;width:40px;height:28px;margin-right:8px;border-radius:10px;font-size:.9rem;font-weight:900;color:#081019;background:linear-gradient(135deg,var(--brand-1),var(--brand-2))}
.text{margin:0;color:#cfe1ff;line-height:1.65}

/* CTA */
.svc-cta{text-align:center;margin:42px 0 8px}
.svc-cta h3{margin:0 0 10px;color:#e8f1ff;font-weight:900}