/* Melasma & Hyperpigmentation — route-owned responsive refinement. */
@media (min-width:641px) and (max-width:900px){
  .pigment-page .skin-hero__grid{gap:32px}
  .pigment-page .skin-card{max-width:680px}
}
@media (max-width:430px){
  .pigment-page .skin-hero{padding-block:48px 42px}
  .pigment-page .skin-eyebrow{font-size:11px;letter-spacing:.19em}
  .pigment-page .skin-hero h1{font-size:clamp(34px,9.6vw,40px);line-height:1.13}
  .pigment-page .skin-hero__lead{font-size:16.5px}
  .pigment-page .skin-card{padding:22px 19px}
  .pigment-page .skin-card strong{font-size:21px}
  .pigment-page .skin-section,.pigment-page .skin-callout{padding-block:44px}
  .pigment-page .skin-item{padding:21px 18px}
  .pigment-page .skin-path__step{padding:20px 18px}
  .pigment-page .skin-faq details{padding:16px 17px}
}
