/* Hair Menu: Timeless palette and typography, one-column price list. */
.hm-body { color: #333; }
.hm-page { margin-bottom: 0; }
.hm-hero {
    min-height: clamp(540px, 48vw, 700px);
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding: 64px 24px 54px;
    background: linear-gradient(180deg, rgba(29, 41, 33, .06) 12%, rgba(29, 41, 33, .77) 100%), url('../img/hair.webp') center 64% / cover;
    text-align: center;
}
.hm-hero h1 {
    margin: 0 0 12px !important;
    color: #fff !important;
    font-family: 'Raleway', sans-serif;
    font-size: 60px !important;
    font-weight: 400;
    line-height: 1.15;
    text-transform: none;
}
.hm-hero p { margin: 0; color: #fff; font-size: 18px; line-height: 1.55; letter-spacing: 1.6px; text-transform: uppercase; }
.hm-menu { width: calc(100% - 80px); max-width: 1140px; margin: 0 auto; padding: 58px 0 90px; }
.hm-category {
    margin: 0 0 28px !important;
    color: #DAA520 !important;
    font-family: 'Raleway', sans-serif;
    font-size: 44px !important;
    font-weight: 400;
    line-height: 1.22;
    text-transform: none;
    overflow-wrap: break-word;
}
.hm-list { margin: 0; padding: 0; list-style: none; }
.hm-item { margin: 0 0 26px; padding: 0; }
.hm-item:last-child { margin-bottom: 0; }
.hm-item-heading { display: flex; align-items: baseline; gap: 12px; }
.hm-name { flex: 0 1 auto; min-width: 0; margin: 0; color: #333; font-size: 20px; font-weight: 700; line-height: 1.45; }
.hm-leader { flex: 1 1 24px; min-width: 18px; border-bottom: 1px solid #c9c9c0; transform: translateY(-5px); }
.hm-price { flex: 0 0 auto; color: #8f6c24; font-size: 19px; line-height: 1.5; white-space: nowrap; font-variant-numeric: tabular-nums; }
.hm-description { margin: 8px 0 0; font-size: 16px; font-weight: 400; line-height: 1.75; }
.hm-intro { margin: 0 0 30px; font-size: 16px; line-height: 1.85; }
.hm-divider { display: flex; align-items: center; justify-content: center; gap: 12px; width: 26%; min-width: 100px; margin: 52px auto; color: #a58a4b; }
.hm-divider span { flex: 1; border-top: 1px solid currentColor; }
.hm-divider svg { flex: 0 0 25px; width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.hm-notes { border-top: 1px solid #d0bb79; margin-top: 48px; padding-top: 28px; color: #555; font-size: 15px; line-height: 1.8; }
.hm-notes p { margin: 0 0 12px; }
.hm-notes p:last-child { margin-bottom: 0; }
@media (max-width: 1024px) {
    .hm-menu { width: 80%; }
    .hm-category { font-size: 37px !important; }
}
@media (max-width: 767px) {
    .hm-hero { min-height: 440px; padding: 40px 24px 35px; background-position: 54% 58%; }
    .hm-hero h1 { font-size: 43px !important; }
    .hm-hero p { font-size: 13px; letter-spacing: 1px; }
    .hm-menu { padding-top: 40px; padding-bottom: 85px; }
    .hm-category { font-size: 30px !important; margin-bottom: 24px !important; }
    .hm-item { margin-bottom: 25px; }
    .hm-item-heading { gap: 10px; align-items: baseline; }
    .hm-name { font-size: 17px; line-height: 1.45; }
    .hm-leader { display: none; }
    .hm-price { margin-left: auto; flex: 0 0 auto; max-width: 95px; font-size: 15px; white-space: normal; text-align: right; line-height: 1.5; }
    .hm-description, .hm-intro { font-size: 16px; line-height: 1.65; }
    .hm-description { margin-top: 10px; }
    .hm-divider { margin-top: 40px; margin-bottom: 40px; }
    .hm-notes { margin-top: 38px; padding-top: 24px; font-size: 14px; }
    .hm-body .footer { flex-wrap: wrap; padding: 20px 24px; line-height: 1.8; }
}
@media (prefers-reduced-motion: reduce) { .hm-body { scroll-behavior: auto !important; } }
