/* Service Pages — Base Styles — Light Theme */

.page-hero {
  min-height:50vh; display:flex; align-items:center; justify-content:center;
  position:relative; overflow:hidden; padding:120px 24px 60px; text-align:center;
}
.page-hero .hero-bg { position:absolute; inset:0; overflow:hidden; }
.page-hero-content { position:relative; z-index:2; max-width:700px; }
.page-hero-content .page-badge {
  display:inline-block; font-size:12px; font-weight:600; letter-spacing:2px;
  text-transform:uppercase; color:#8b5cf6; background:rgba(139,92,246,0.08);
  border:1px solid rgba(139,92,246,0.15); padding:8px 20px; border-radius:100px; margin-bottom:24px;
}
.page-hero-content h1 {
  font-family:'Playfair Display',serif; font-size:clamp(36px,5vw,60px);
  font-weight:700; line-height:1.05; color:#111827; margin-bottom:16px;
}
.page-hero-content p {
  font-size:clamp(16px,1.5vw,18px); color:#6b7280; max-width:550px;
  margin:0 auto 32px; line-height:1.6;
}
.page-hero-actions { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }

.service-content { padding:80px 0; background:#fff; }
.service-grid { display:grid; grid-template-columns:1.2fr 1fr; gap:48px; align-items:center; margin-bottom:80px; }
.service-grid.reverse { direction:rtl; }
.service-grid.reverse > * { direction:ltr; }
.service-text h2 { font-family:'Playfair Display',serif; font-size:clamp(24px,3vw,36px); color:#111827; margin-bottom:16px; }
.service-text p { color:#6b7280; font-size:15px; line-height:1.7; margin-bottom:16px; }
.service-text ul { list-style:none; display:flex; flex-direction:column; gap:10px; margin-top:20px; }
.service-text ul li { display:flex; align-items:flex-start; gap:10px; color:#374151; font-size:14px; }
.service-text ul li i { color:#8b5cf6; font-size:14px; margin-top:3px; }
.service-image { border-radius:20px; overflow:hidden; position:relative; }
.service-image::after {
  content:''; position:absolute; inset:0; border-radius:20px; padding:2px;
  background:linear-gradient(135deg,rgba(139,92,246,0.25),transparent,rgba(124,58,237,0.15));
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none;
}
.service-image img { width:100%; height:100%; object-fit:cover; display:block; }

.process-steps { padding:80px 0; background:#f4f5f9; }
.process-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:48px; }
.process-step { text-align:center; padding:32px 20px; background:#fff; border:1px solid rgba(0,0,0,0.06); border-radius:16px; transition:all .4s; box-shadow:0 2px 8px rgba(0,0,0,0.03); }
.process-step:hover { border-color:rgba(139,92,246,0.2); transform:translateY(-6px); box-shadow:0 12px 40px rgba(0,0,0,0.07); }
.process-step .step-num { width:48px;height:48px;margin:0 auto 16px;border-radius:50%;background:rgba(139,92,246,0.08);border:1px solid rgba(139,92,246,0.15);display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;color:#8b5cf6;font-family:'Playfair Display',serif; }
.process-step h4 { font-size:16px; color:#111827; margin-bottom:8px; }
.process-step p { font-size:14px; color:#6b7280; line-height:1.6; }

.tools-used { padding:80px 0; background:#fff; }
.tools-used-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:16px; margin-top:32px; }
.tools-used-item { text-align:center; padding:20px 12px; background:#f8f9fc; border:1px solid rgba(0,0,0,0.06); border-radius:12px; transition:all .3s; }
.tools-used-item:hover { border-color:rgba(139,92,246,0.2); transform:translateY(-3px); }
.tools-used-item i { font-size:28px; color:#8b5cf6; margin-bottom:8px; }
.tools-used-item h5 { font-size:13px; color:#111827; font-weight:500; }
.tools-used-item span { font-size:11px; color:#9ca3af; }

.service-cta { padding:80px 0; background:#f4f5f9; text-align:center; }
.service-cta h2 { font-family:'Playfair Display',serif; font-size:clamp(28px,4vw,42px); color:#111827; margin-bottom:16px; }
.service-cta p { color:#6b7280; font-size:16px; max-width:500px; margin:0 auto 32px; }
.service-cta .btn + .btn { margin-left:12px; }

.service-nav { padding:20px 0; background:#fff; border-bottom:1px solid rgba(0,0,0,0.06); position:sticky; top:0; z-index:100; }
.service-nav-inner { display:flex; gap:8px; overflow-x:auto; padding-bottom:4px; scrollbar-width:none; }
.service-nav-inner::-webkit-scrollbar { display:none; }
.service-nav-link { flex-shrink:0; font-size:13px; font-weight:500; padding:8px 18px; border-radius:100px; color:#9ca3af; background:rgba(0,0,0,0.03); border:1px solid rgba(0,0,0,0.06); text-decoration:none; transition:all .3s; }
.service-nav-link:hover, .service-nav-link.active { color:#8b5cf6; background:rgba(139,92,246,0.08); border-color:rgba(139,92,246,0.15); }

@media(max-width:768px) { .service-grid { grid-template-columns:1fr; } .service-grid.reverse { direction:ltr; } .process-grid { grid-template-columns:1fr; } .service-image { order:-1; } }
