:root { --wine: #6b1d3a; --rose: #b03c57; --blush: #f4e6ea; --ink: #281e22; --warm: #faf6f7; --line: #e7d5da; }
* { box-sizing: border-box; }
body { background: var(--warm); color: var(--ink); }
.service-header-book { color: var(--wine); font-size: .86rem; font-weight: 700; text-decoration: none; margin-right: 1.15rem; }
.services-hero { min-height: 650px; position: relative; display: grid; align-items: center; overflow: hidden; background: #2e1e22; color: white; }
.services-hero-image { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(29,15,20,.83) 0%, rgba(29,15,20,.56) 44%, rgba(29,15,20,.12) 100%), url('assets/zain-menu-preview-10.png') center 48% / cover; }
.services-hero-content { position: relative; max-width: 650px; margin-left: clamp(1.25rem, 9vw, 10rem); padding: 5rem 1.25rem; }
.services-hero .eyebrow { color: #f7dce4; }
.services-hero h1, .services-intro h2, .service-copy h2, .booking-card h2 { font-family: 'Playfair Display', Georgia, serif; font-weight: 600; letter-spacing: -.045em; }
.services-hero h1 { font-size: clamp(3.3rem, 6.3vw, 6.6rem); line-height: .95; margin: .55rem 0 1.35rem; }
.services-hero h1 i { color: #f4b3c4; font-weight: 500; }
.services-hero p:not(.eyebrow) { font-size: 1.12rem; line-height: 1.7; max-width: 540px; color: #f8edf0; margin-bottom: 2rem; }
.services-intro { max-width: 770px; margin: 0 auto; text-align: center; padding: 8rem 1.5rem 4.7rem; }
.services-intro h2 { font-size: clamp(2.4rem, 4vw, 4.2rem); margin: .4rem 0 1rem; }
.services-intro > p:last-child { color: #685d61; font-size: 1.05rem; line-height: 1.7; }
.service-category { max-width: 1320px; margin: 0 auto; padding: 4.5rem clamp(1.2rem, 5vw, 5rem); display: grid; grid-template-columns: minmax(260px, .8fr) minmax(0, 1.2fr); gap: clamp(2.5rem, 6vw, 7rem); align-items: center; }
.service-category.reverse { grid-template-columns: minmax(0, 1.2fr) minmax(260px, .8fr); background: #f4eaed; max-width: none; padding-left: max(1.2rem, calc((100vw - 1320px) / 2 + 5rem)); padding-right: max(1.2rem, calc((100vw - 1320px) / 2 + 5rem)); }
.service-category.reverse .service-visual { order: 2; }
.service-visual { min-height: 590px; border-radius: 3px; overflow: hidden; box-shadow: 0 18px 50px rgba(72, 33, 44, .14); }
.service-visual img { display: block; width: 100%; height: 100%; object-fit: cover; }
.facial-visual img { object-position: 53% center; }.prp-visual img { object-position: center; }.waxing-visual img { object-position: 55% center; }.lashes-visual img { object-position: 54% center; }
.service-copy .eyebrow, .booking-card .eyebrow { color: var(--rose); margin-bottom: .6rem; }
.service-copy h2 { font-size: clamp(2.2rem, 3.8vw, 4rem); line-height: 1.04; margin: 0 0 1rem; }
.category-lead { color: #63565b; line-height: 1.7; max-width: 610px; margin: 0 0 1.6rem; }
.service-list { border-top: 1px solid var(--line); }
.service-list article { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 1.2rem; align-items: center; padding: 1.25rem 0; border-bottom: 1px solid var(--line); }
.service-list h3 { margin: 0 0 .3rem; font-size: 1.04rem; }.service-list p { color: #71666a; margin: 0; line-height: 1.5; font-size: .91rem; }.service-list b { color: var(--wine); white-space: nowrap; }.service-list button { border: 1px solid var(--wine); color: var(--wine); background: transparent; padding: .62rem .82rem; cursor: pointer; font: 700 .76rem 'DM Sans', sans-serif; transition: .2s ease; white-space: nowrap; }.service-list button:hover { background: var(--wine); color: white; }
.compact-list article { grid-template-columns: minmax(0, 1fr) auto auto; }.compact-list h3 { margin: 0; }.service-note { font-size: .82rem; color: #7f7175; margin: 1.1rem 0 0; }
.booking-section { margin-top: 5rem; display: grid; grid-template-columns: minmax(280px, .85fr) minmax(0, 1.15fr); background: var(--wine); color: white; }
.booking-image { min-height: 720px; overflow: hidden; }.booking-image img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center; }
.booking-card { max-width: 720px; padding: clamp(3rem, 7vw, 7rem); }.booking-card .eyebrow { color: #f5c7d3; }.booking-card h2 { font-size: clamp(2.5rem, 4vw, 4.3rem); line-height: 1; margin: .3rem 0 1.3rem; }.booking-card > p:not(.eyebrow) { color: #f5e7eb; line-height: 1.65; margin-bottom: 2rem; }
#bookingForm { display: grid; gap: 1rem; }.booking-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }#bookingForm label { display: grid; gap: .45rem; color: #f6e5e9; font-size: .82rem; font-weight: 700; }#bookingForm label small { font-weight: 400; color: #e5bbc7; }#bookingForm input, #bookingForm select, #bookingForm textarea { border: 1px solid rgba(255,255,255,.32); background: rgba(255,255,255,.1); color: white; border-radius: 0; padding: .86rem .9rem; font: 400 .95rem 'DM Sans', sans-serif; width: 100%; }#bookingForm input::placeholder, #bookingForm textarea::placeholder { color: #e0c7ce; }#bookingForm select { color: #fff; }#bookingForm option { color: var(--ink); }#bookingForm .button { margin-top: .5rem; background: #fff; color: var(--wine); border: none; justify-content: center; }#bookingForm .button:hover { background: #f6d8e0; }.booking-confirmation { color: #f7d3dc; min-height: 1.3rem; font-size: .88rem; margin: 0; }
@media (max-width: 850px) { .desktop-nav { display: none; }.service-header-book { display: none; }.services-hero { min-height: 590px; }.service-category, .service-category.reverse, .booking-section { grid-template-columns: 1fr; }.service-category.reverse { padding-left: 1.2rem; padding-right: 1.2rem; }.service-category.reverse .service-visual { order: 0; }.service-visual { min-height: 410px; }.booking-image { min-height: 390px; }.booking-card { max-width: none; }.service-list article { grid-template-columns: minmax(0, 1fr) auto; }.service-list article button { grid-column: 1 / -1; justify-self: start; }.compact-list article { grid-template-columns: minmax(0, 1fr) auto; } }
@media (max-width: 520px) { .services-hero-content { margin-left: 0; }.services-hero h1 { font-size: 3.55rem; }.services-intro { padding-top: 5rem; }.service-category { padding-top: 3rem; padding-bottom: 3rem; }.service-visual { min-height: 340px; }.booking-row { grid-template-columns: 1fr; }.header-actions .cart-button { font-size: .72rem; padding: .62rem .7rem; } }