/* Service Details CSS */
.sd-overview { background: #fff; }
.overview-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: center; }
.overview-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
.overview-visual { position: relative; }
.overview-visual img { border-radius: var(--radius-lg); width: 100%; height: 400px; object-fit: cover; }
.overview-stat-card {
  position: absolute; bottom: -20px; left: -20px;
  background: var(--accent); color: #fff;
  padding: 20px 28px; border-radius: var(--radius-lg);
  box-shadow: 0 8px 30px rgba(232,160,32,0.4);
  text-align: center;
}
.osc-num { display: block; font-family: var(--font-display); font-size: 2rem; font-weight: 900; }
.osc-label { font-size: 0.78rem; opacity: 0.9; }

.benefits-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.benefit-card {
  background: #fff; border-radius: var(--radius-lg); padding: 36px 28px;
  border: 1px solid var(--border); transition: var(--transition); text-align: center;
}
.benefit-card:hover { transform: translateY(-6px); box-shadow: var(--shadow); border-color: var(--primary); }
.bc-icon { font-size: 2.5rem; margin-bottom: 16px; }
.benefit-card h4 { margin-bottom: 10px; }
.benefit-card p { font-size: 0.88rem; }

.process-timeline { display: flex; flex-direction: column; gap: 0; max-width: 800px; margin: 0 auto; }
.ptl-item {
  display: flex; gap: 32px; align-items: flex-start;
  padding: 32px 0; border-bottom: 1px solid var(--border);
}
.ptl-item:last-child { border-bottom: none; }
.ptl-step {
  width: 64px; height: 64px; border-radius: 50%;
  background: var(--primary); color: #fff;
  font-family: var(--font-display); font-size: 1.3rem; font-weight: 700;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.ptl-content { flex: 1; }
.ptl-content h4 { margin-bottom: 8px; }
.ptl-content p { font-size: 0.9rem; }
.ptl-duration {
  display: inline-block; margin-top: 12px;
  background: rgba(232,160,32,0.12); color: var(--accent-dark);
  padding: 4px 14px; border-radius: 100px; font-size: 0.8rem; font-weight: 600;
}

.sd-faq .faq-wrap { max-width: 760px; margin: 0 auto; }

@media (max-width:1024px) {
  .overview-grid { grid-template-columns: 1fr; }
  .benefits-grid { grid-template-columns: repeat(2,1fr); }
}
@media (max-width:768px) {
  .benefits-grid { grid-template-columns: 1fr; }
  .ptl-item { flex-direction: column; }
}