/* ── SERVICES PAGE STYLES ── */

.ph { min-height: 54vh; padding: 160px 56px 72px; border-bottom: 1px solid var(--ln); display: flex; flex-direction: column; justify-content: flex-end; position: relative; overflow: hidden; }
.ph-bg { position: absolute; inset: 0; pointer-events: none; background-image: linear-gradient(var(--ln) 1px,transparent 1px),linear-gradient(90deg,var(--ln) 1px,transparent 1px); background-size: 48px 48px; opacity: .3; mask-image: radial-gradient(ellipse 60% 80% at 80% 50%,black 0%,transparent 100%); }
.ph-tag { font-family: var(--fb); font-size: 12px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--d); margin-bottom: 18px; position: relative; }
.ph-h { font-family: var(--fd); font-size: clamp(76px,13vw,170px); line-height: .86; letter-spacing: -.01em; color: var(--k); position: relative; }
.ph-h .out { -webkit-text-stroke: 1.5px var(--d2); color: transparent; display: block; }
.ph-h .sol { display: block; }
.ph-foot { margin-top: 36px; padding-top: 22px; border-top: 1px solid var(--ln); display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; position: relative; }
.ph-desc { font-family: var(--fb); font-size: 14px; color: var(--d); line-height: 1.8; max-width: 380px; }
.ph-count { font-family: var(--fd); font-size: 72px; letter-spacing: -.04em; line-height: 1; color: var(--ln); display: flex; align-items: baseline; gap: 10px; }
.ph-count small { font-family: var(--fb); font-size: 11px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--d); }

/* sticky nav */
.snav { position: sticky; top: 56px; z-index: 150; background: rgba(250,250,248,.92); backdrop-filter: blur(16px); border-bottom: 1px solid var(--ln); display: flex; overflow-x: auto; scrollbar-width: none; }
.snav::-webkit-scrollbar { display: none; }
.sni { font-family: var(--fb); font-size: 12px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: var(--d); padding: 18px 28px; white-space: nowrap; flex-shrink: 0; border-bottom: 2px solid transparent; transition: color .3s var(--ease), border-color .3s var(--ease); }
.sni:hover, .sni.on { color: var(--k); border-bottom-color: var(--k); }

/* service block */
.svc { border-bottom: 1px solid var(--ln); scroll-margin-top: 98px; }
.svc-wrap2 { display: grid; min-height: 520px; }
.svc-a .svc-wrap2 { grid-template-columns: 1fr 1fr; }
.svc-b .svc-wrap2 { grid-template-columns: 1fr 1fr; direction: rtl; }
.svc-b .svc-wrap2 > * { direction: ltr; }

.sv-t { padding: 72px 52px; border-right: 1px solid var(--ln); display: flex; flex-direction: column; justify-content: space-between; background: var(--bg); }
.svc-b .sv-t { border-right: none; border-left: 1px solid var(--ln); }
.sv-num { font-family: var(--fd); font-size: clamp(88px,12vw,160px); letter-spacing: -.04em; line-height: .85; color: var(--ln); user-select: none; margin-bottom: 20px; }
.sv-title { font-family: var(--fd); font-size: clamp(40px,5.5vw,68px); letter-spacing: -.01em; line-height: .9; color: var(--k); margin-bottom: 24px; }
.sv-body { font-family: var(--fb); font-size: 14px; color: var(--d); line-height: 1.8; max-width: 400px; margin-bottom: 28px; }
.sv-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 32px; }
.sv-tag { font-family: var(--fb); font-size: 10px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; padding: 6px 14px; border: 1px solid var(--ln); color: var(--d); }
.sv-link { display: inline-flex; align-items: center; gap: 8px; align-self: flex-start; font-family: var(--fb); font-size: 12px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--d); border: 1px solid var(--ln); padding: 12px 24px; transition: all .3s var(--ease); }
.sv-link::after { content: '→'; }
.sv-link:hover { border-color: var(--k); color: var(--k); }
.sv-caps { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--ln); margin-top: 32px; }
.sv-cap { padding: 12px 14px 12px 0; border-bottom: 1px solid var(--ln); font-family: var(--fb); font-size: 13px; color: var(--d); display: flex; align-items: flex-start; gap: 10px; }
.sv-cap:last-child, .sv-cap:nth-last-child(2):nth-child(odd) { border-bottom: none; }
.sv-dot { width: 4px; height: 4px; border-radius: 50%; background: var(--lnk); flex-shrink: 0; margin-top: 8px; }

/* visual panel */
.sv-v { display: flex; align-items: center; justify-content: center; padding: 0; background: var(--bg2); position: relative; overflow: hidden; }
.sv-v::after { content: attr(data-lbl); position: absolute; bottom: 16px; right: 20px; font-family: var(--fm); font-size: 9px; letter-spacing: .14em; color: var(--d2); text-transform: uppercase; }
.sv-v img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease); }
.sv-v:hover img { transform: scale(1.04); }

/* ticker */
.ticker { overflow: hidden; border-top: 1px solid var(--ln); border-bottom: 1px solid var(--ln); padding: 16px 0; background: var(--k); }
.ticker-t { display: inline-flex; white-space: nowrap; animation: tkr 20s linear infinite; }
.ticker-i { font-family: var(--fd); font-size: clamp(20px,3vw,38px); letter-spacing: .04em; color: var(--bg); padding: 0 36px; }
@keyframes tkr { to { transform: translateX(-50%); } }

/* flywheel */
.fw { padding: 100px 56px; border-bottom: 1px solid var(--ln); display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.fw-tag { font-family: var(--fb); font-size: 12px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--d); margin-bottom: 22px; }
.fw-h { font-family: var(--fd); font-size: clamp(48px,6.5vw,84px); letter-spacing: -.01em; line-height: .87; color: var(--k); margin-bottom: 24px; }
.fw-h em { font-style: normal; -webkit-text-stroke: 1.5px var(--d2); color: transparent; }
.fw-p { font-family: var(--fb); font-size: 14px; color: var(--d); line-height: 1.8; max-width: 400px; }

/* cta */
.cta { padding: 100px 56px; border-bottom: 1px solid var(--ln); display: flex; align-items: center; justify-content: space-between; gap: 48px; flex-wrap: wrap; }
.cta-h { font-family: var(--fd); font-size: clamp(44px,7vw,84px); letter-spacing: -.01em; line-height: .88; color: var(--k); }
.cta-h em { font-style: normal; -webkit-text-stroke: 1.5px var(--d2); color: transparent; }
.cta-r { display: flex; flex-direction: column; align-items: flex-end; gap: 14px; }

@media (max-width: 1024px) {
  .ph { padding: 140px 28px 56px; }
  .snav { top: 52px; }
  .svc-a .svc-wrap2, .svc-b .svc-wrap2 { grid-template-columns: 1fr; direction: ltr; }
  .sv-t { border-right: none; border-bottom: 1px solid var(--ln); padding: 52px 28px; }
  .svc-b .sv-t { border-left: none; border-bottom: 1px solid var(--ln); }
  .sv-v { min-height: 280px; }
  .fw { padding: 80px 28px; grid-template-columns: 1fr; gap: 48px; }
  .cta { padding: 80px 28px; flex-direction: column; align-items: flex-start; }
  .cta-r { align-items: flex-start; }
}
@media (max-width: 640px) {
  .ph { padding: 128px 20px 44px; }
  .ph-foot { flex-direction: column; align-items: flex-start; gap: 16px; }
  .sv-t { padding: 40px 20px; }
  .sv-caps { grid-template-columns: 1fr; }
  .fw, .cta { padding: 68px 20px; }
}