/* ═══════════════════════════════════════════════════════════════
   Piel y Láser · Servicios — estilos exclusivos de esta página
   ═══════════════════════════════════════════════════════════════ */


/* ── Hero de página ─────────────────────────────────────────── */
.srv-hero {
  background: var(--dark);
  padding: 120px 28px 64px;
  margin-top: 100px;
  text-align: center;
  color: #fff;
}
@media (max-width: 960px) {
  .srv-hero { margin-top: 72px; padding: 88px 20px 56px; }
}
@media (max-width: 768px) {
  .srv-hero { margin-top: 64px; padding: 72px 16px 48px; }
  .srv-hero h1 { font-size: clamp(24px, 6vw, 40px); }
  .srv-hero p  { font-size: 14px; }
}
@media (max-width: 430px) {
  .srv-hero { margin-top: 58px; padding: 60px 14px 40px; }
  .srv-hero h1 { font-size: clamp(20px, 7vw, 32px); }
}
@media (max-width: 390px) {
  .srv-hero { margin-top: 56px; }
}
@media (max-width: 360px) {
  .srv-hero { margin-top: 52px; }
}
.srv-hero .sec-eyebrow { color: rgba(255,255,255,.6); }
.srv-hero h1 { font-size: clamp(28px,4vw,52px); font-weight:700; margin:12px 0; color:#fff; }
.srv-hero p  { color: rgba(255,255,255,.7); max-width:560px; margin:0 auto; font-size:16px; line-height:1.6; }


/* ── Botón volver ────────────────────────────────────────────── */
.srv-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: rgba(255,255,255,.7);
  text-decoration: none;
  margin-bottom: 28px;
  letter-spacing: .04em;
  transition: color .2s;
}
.srv-back:hover { color: #fff; }


/* ── Imagen de servicio en feat-visual ───────────────────────── */
.srv-feat-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 20px;
}


/* ── Footer: enlace de teléfono hereda el color ──────────────── */
.footer-desc a { color: inherit; }


/* ── Footer: iconos de redes sociales ──────────────────────── */
.footer-social-list {
  display: flex;
  gap: 14px;
  margin-top: 6px;
}
.footer-social-icon {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform .25s;
  flex-shrink: 0;
}
.footer-social-icon:hover { transform: scale(1.18); }

.footer-social-icon--fb { background: #1877F2; }
.footer-social-icon--ig {
  background: radial-gradient(circle at 30% 107%,
    #fdf497 0%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
}
.footer-social-icon--tt {
  background: #010101;
  border: 1px solid rgba(255,255,255,.2);
}