html,body{overflow-x:hidden;max-width:100vw}
:root {
 /* Feminine luxury beauty palette - rose, blush, orchid, champagne */
 --bg: #fbf6f8;
 --bg-glow-1: rgba(232, 121, 168, 0.18);
 --bg-glow-2: rgba(167, 139, 250, 0.14);
 --bg-glow-3: rgba(244, 185, 120, 0.16);
 --card: #ffffff;
 --card-tint: linear-gradient(165deg, #fff 0%, #fff9fb 55%, #faf5ff 100%);
 --ink: #2a1f28;
 --muted: #7a6674;
 --line: #f0e0e8;
 --line-strong: rgba(232, 121, 168, 0.35);
 --rose: #e879a8;
 --rose-deep: #c45d8a;
 --blush: #fce7f0;
 --orchid: #a78bfa;
 --orchid-soft: #ede9fe;
 --champagne: #e8c48a;
 --champagne-bright: #f5dfb8;
 --gold: #c9a06a;
 --gold-soft: #f8ecda;
 --gold-bright: #f0d9b0;
 --font: "Outfit", system-ui, sans-serif;
 --display: "Cormorant Garamond", Georgia, serif;
 --radius: 22px;
 --shadow: 0 20px 50px rgba(90, 40, 70, 0.08);
 --shadow-soft: 0 12px 32px rgba(180, 80, 130, 0.1);
}
* { box-sizing: border-box; }
body {
 margin: 0;
 font-family: var(--font);
 color: var(--ink);
 background:
 radial-gradient(ellipse 55% 40% at 8% -5%, var(--bg-glow-1), transparent 58%),
 radial-gradient(ellipse 50% 38% at 92% 8%, var(--bg-glow-2), transparent 55%),
 radial-gradient(ellipse 45% 30% at 50% 100%, var(--bg-glow-3), transparent 50%),
 linear-gradient(180deg, #fff8fb 0%, var(--bg) 42%, #f7f2ff 100%);
 line-height: 1.6;
 min-height: 100vh;
}
a { color: var(--rose-deep); text-decoration: none; }
a:hover { color: var(--orchid); }
.wrap { width: min(1080px, 100% - 2rem); margin-inline: auto; }
.top {
 position: sticky; top: 0; z-index: 20;
 background: rgba(255, 252, 254, 0.9);
 backdrop-filter: blur(14px);
 -webkit-backdrop-filter: blur(14px);
 border-bottom: 1px solid var(--line);
 box-shadow: 0 4px 24px rgba(200, 100, 150, 0.06);
}
.bar {
 display: flex; justify-content: space-between; align-items: center;
 min-height: 72px; gap: 1rem;
}
.logo { color: var(--ink); font-weight: 600; font-size: .98rem; }
.logo .we {
 font-family: var(--display); font-style: italic;
 background: linear-gradient(120deg, var(--rose), var(--orchid));
 -webkit-background-clip: text; background-clip: text; color: transparent;
 margin-right: .15rem; font-size: 1.15rem;
}
.phone {
 font-weight: 700; color: var(--ink);
 padding: .45rem .9rem; border-radius: 999px;
 background: linear-gradient(135deg, var(--blush), var(--orchid-soft));
 border: 1px solid var(--line);
}
.intro { padding: 2.35rem 0 1.15rem; max-width: 44rem; }
.eyebrow {
 margin: 0 0 .7rem;
 text-transform: uppercase; letter-spacing: .16em; font-size: .72rem;
 color: var(--rose-deep); font-weight: 700;
}
h1 {
 margin: 0 0 .85rem;
 font-family: var(--display);
 font-size: clamp(2.15rem, 4.5vw, 3.15rem);
 line-height: 1.12; font-weight: 600;
 background: linear-gradient(120deg, #3a2535 10%, #8b4d72 55%, #6b5b9a 100%);
 -webkit-background-clip: text; background-clip: text; color: transparent;
}
.lead { margin: 0; color: var(--muted); font-weight: 300; font-size: 1.05rem; }
.lead strong { color: var(--ink); font-weight: 600; }

.booking-shell { display: grid; gap: 1.1rem; padding-bottom: 3rem; }
.card {
 background: var(--card-tint);
 border: 1px solid var(--line);
 border-radius: var(--radius);
 padding: 1.4rem 1.45rem 1.55rem;
 box-shadow: var(--shadow);
 position: relative;
 overflow: hidden;
}
.card::before {
 content: "";
 position: absolute; inset: 0 auto auto 0;
 width: 100%; height: 3px;
 background: linear-gradient(90deg, var(--rose), var(--orchid), var(--champagne));
 opacity: .85;
}
.step-label {
 display: flex; align-items: baseline; gap: .65rem; flex-wrap: wrap;
 margin: 0 0 1rem;
 font-size: .78rem; letter-spacing: .12em; text-transform: uppercase;
 color: var(--muted); font-weight: 700;
}
.step-label span {
 width: 1.6rem; height: 1.6rem; border-radius: 50%;
 display: inline-grid; place-items: center;
 background: linear-gradient(135deg, #f9c5d9, var(--rose), var(--orchid));
 color: #fff; font-size: .8rem; letter-spacing: 0;
 box-shadow: 0 4px 12px rgba(232, 121, 168, 0.35);
}
.step-label em { font-style: normal; font-weight: 500; letter-spacing: .04em; text-transform: none; color: #a08f9c; }

.durations { display: grid; grid-template-columns: repeat(3, 1fr); gap: .7rem; }
.dur {
 cursor: pointer; border: 1px solid var(--line); border-radius: 16px;
 padding: 1rem .7rem;
 background: linear-gradient(180deg, #fff, #fff8fb);
 transition: .2s border-color, .2s background, .2s transform, .2s box-shadow;
}
.dur input { position: absolute; opacity: 0; pointer-events: none; }
.dur span { display: grid; gap: .15rem; text-align: center; }
.dur strong { font-size: 1.08rem; color: var(--ink); }
.dur em { font-style: normal; color: var(--muted); font-size: .8rem; }
.dur:hover { border-color: rgba(232, 121, 168, .45); transform: translateY(-1px); }
.dur:has(input:checked) {
 border-color: rgba(232, 121, 168, .7);
 background: linear-gradient(145deg, #fff0f6, #f3e8ff);
 transform: translateY(-1px);
 box-shadow: var(--shadow-soft);
}

/* Calendar - colorful beauty polish */
.cal-layout {
 display: grid;
 grid-template-columns: 1.15fr .85fr;
 gap: 1.25rem;
 align-items: start;
}
.cal-panel {
 border: 1px solid var(--line);
 border-radius: 18px;
 padding: 1.05rem 1.05rem 1.15rem;
 background:
 radial-gradient(ellipse 80% 60% at 100% 0%, rgba(232, 121, 168, 0.12), transparent 55%),
 radial-gradient(ellipse 60% 50% at 0% 100%, rgba(167, 139, 250, 0.1), transparent 50%),
 linear-gradient(180deg, #fffefd, #fff5f9);
 box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}
.cal-nav {
 display: flex; align-items: center; justify-content: space-between;
 margin-bottom: .9rem;
}
.cal-month {
 margin: 0;
 font-family: var(--display);
 font-size: 1.5rem;
 font-weight: 600;
 letter-spacing: 0;
 text-transform: none;
 color: var(--ink);
 background: linear-gradient(120deg, #4a2c42, #9b5b8a);
 -webkit-background-clip: text; background-clip: text; color: transparent;
}
.cal-nav-btn {
 width: 2.5rem; height: 2.5rem; border-radius: 50%;
 border: 1px solid var(--line); background: #fff;
 font-size: 1.4rem; line-height: 1; cursor: pointer; color: var(--ink);
 transition: .15s background, .15s border-color, .15s box-shadow;
}
.cal-nav-btn:hover {
 border-color: var(--rose);
 background: var(--blush);
 box-shadow: 0 6px 16px rgba(232, 121, 168, 0.18);
}
.cal-weekdays {
 display: grid; grid-template-columns: repeat(7, 1fr); gap: .25rem;
 margin-bottom: .4rem;
 text-align: center;
 font-size: .68rem; font-weight: 700; letter-spacing: .08em;
 text-transform: uppercase; color: #b094a8;
}
.cal-grid {
 display: grid; grid-template-columns: repeat(7, 1fr); gap: .35rem;
}
.cal-day {
 aspect-ratio: 1;
 border: 0;
 border-radius: 14px;
 background: transparent;
 font: inherit;
 font-weight: 600;
 font-size: .92rem;
 color: var(--ink);
 cursor: pointer;
 transition: .15s background, .15s transform, .15s box-shadow, .15s color;
}
.cal-day:hover:not(:disabled):not(.is-empty) {
 background: rgba(232, 121, 168, 0.14);
 color: var(--rose-deep);
}
.cal-day.is-empty { cursor: default; }
.cal-day.is-closed,
.cal-day:disabled {
 color: #d0c0ca;
 cursor: not-allowed;
 font-weight: 500;
}
.cal-day.is-available {
 background: linear-gradient(145deg, rgba(232, 121, 168, 0.16), rgba(167, 139, 250, 0.12));
 color: #7a3d62;
 box-shadow: inset 0 0 0 1px rgba(232, 121, 168, 0.2);
}
.cal-day.is-available:hover {
 background: linear-gradient(145deg, rgba(232, 121, 168, 0.28), rgba(167, 139, 250, 0.2));
}
.cal-day.is-selected {
 background: linear-gradient(135deg, #f9c5d9, var(--rose), #b794f6);
 color: #fff;
 box-shadow: 0 10px 22px rgba(232, 121, 168, 0.38);
 transform: scale(1.05);
}
.cal-day.is-today:not(.is-selected) {
 outline: 2px solid rgba(167, 139, 250, 0.55);
 outline-offset: 1px;
}
.cal-legend {
 margin: .9rem 0 0;
 font-size: .82rem;
 color: var(--muted);
}

.slots-panel {
 border: 1px solid var(--line);
 border-radius: 18px;
 padding: 1.05rem;
 background:
 radial-gradient(ellipse 70% 50% at 0% 0%, rgba(167, 139, 250, 0.1), transparent 55%),
 linear-gradient(180deg, #fff, #faf5ff);
 min-height: 280px;
 box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}
.slots-title {
 margin: 0 0 .85rem;
 font-size: .95rem;
 font-weight: 600;
 color: var(--ink);
 letter-spacing: 0;
 text-transform: none;
}
.slots {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: .5rem;
 max-height: 340px;
 overflow: auto;
 padding-right: .15rem;
}
.slot {
 border: 1px solid var(--line);
 border-radius: 14px;
 background: linear-gradient(180deg, #fff, #fff8fb);
 padding: .72rem .55rem;
 font: inherit;
 font-weight: 600;
 font-size: .88rem;
 cursor: pointer;
 color: var(--ink);
 transition: .15s;
}
.slot:hover {
 border-color: rgba(232, 121, 168, 0.5);
 background: linear-gradient(145deg, var(--blush), var(--orchid-soft));
}
.slot.is-selected {
 border-color: transparent;
 background: linear-gradient(135deg, #f9c5d9, var(--rose), #c4b5fd);
 color: #fff;
 box-shadow: 0 8px 18px rgba(196, 93, 138, 0.28);
}
.slot.is-taken {
 opacity: .4;
 text-decoration: line-through;
 cursor: not-allowed;
}
.slots-empty {
 grid-column: 1 / -1;
 color: var(--muted);
 font-size: .92rem;
 padding: .5rem 0;
}

.row { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
label {
 display: grid; gap: .35rem; margin-bottom: .8rem;
 font-size: .75rem; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); font-weight: 600;
}
input, select, textarea {
 width: 100%; border-radius: 12px; border: 1px solid var(--line);
 background: #fff; color: var(--ink); font: inherit;
 text-transform: none; letter-spacing: 0; padding: .8rem .9rem;
 transition: .15s border-color, .15s box-shadow;
}
input:focus, select:focus, textarea:focus {
 outline: none; border-color: rgba(232, 121, 168, .55);
 box-shadow: 0 0 0 3px rgba(232, 121, 168, .14);
}

.summary {
 margin: 0 0 1rem;
 padding: 1rem 1.1rem;
 border-radius: 16px;
 background: linear-gradient(135deg, rgba(232, 121, 168, .12), rgba(167, 139, 250, .1), rgba(255,255,255,.9));
 border: 1px solid rgba(232, 121, 168, .22);
 font-size: .98rem;
 color: var(--ink);
}
.btn {
 width: 100%; border: 0; border-radius: 999px; cursor: pointer;
 padding: 1rem 1.2rem; font: inherit; font-weight: 700;
 letter-spacing: .05em; text-transform: uppercase;
 background: linear-gradient(135deg, #f9c5d9 0%, var(--rose) 42%, #b794f6 100%);
 color: #fff;
 box-shadow: 0 12px 28px rgba(196, 93, 138, 0.28);
 transition: filter .15s, transform .15s;
}
.btn-lg { font-size: .92rem; }
.btn:hover { filter: brightness(1.05); transform: translateY(-1px); }
.note { min-height: 1.3em; margin: .75rem 0 0; color: var(--rose-deep); font-size: .92rem; }
.hidden-field { position: absolute; left: -9999px; height: 0; overflow: hidden; }

/* Project file upload */
.upload-block { margin-top: .35rem; }
.upload-label { margin-bottom: .55rem; }
.upload-help {
 margin: 0 0 .85rem;
 color: var(--muted);
 font-size: .92rem;
 font-weight: 300;
 text-transform: none;
 letter-spacing: 0;
 line-height: 1.5;
}
.upload-drop {
 display: grid;
 justify-items: center;
 gap: .35rem;
 margin: 0;
 padding: 1.4rem 1rem;
 border: 1.5px dashed rgba(232, 121, 168, .5);
 border-radius: 18px;
 background: linear-gradient(180deg, #fffefd, #fff0f6 50%, #f5f0ff);
 cursor: pointer;
 text-align: center;
 text-transform: none;
 letter-spacing: 0;
 transition: .2s border-color, .2s background, .2s box-shadow;
}
.upload-drop:hover,
.upload-drop.is-dragover {
 border-color: var(--rose);
 background: linear-gradient(180deg, var(--blush), var(--orchid-soft));
 box-shadow: var(--shadow-soft);
}
.upload-drop input[type="file"] {
 position: absolute;
 width: 1px;
 height: 1px;
 opacity: 0;
 overflow: hidden;
}
.upload-icon {
 width: 2.5rem;
 height: 2.5rem;
 border-radius: 50%;
 display: grid;
 place-items: center;
 background: linear-gradient(135deg, #f9c5d9, var(--rose), var(--orchid));
 color: #fff;
 font-size: 1.15rem;
 font-weight: 700;
 margin-bottom: .25rem;
 box-shadow: 0 6px 16px rgba(232, 121, 168, 0.3);
}
.upload-title {
 font-size: .95rem;
 font-weight: 600;
 color: var(--ink);
}
.upload-sub {
 font-size: .82rem;
 color: var(--muted);
 font-weight: 400;
}
.upload-list {
 list-style: none;
 margin: .75rem 0 0;
 padding: 0;
 display: grid;
 gap: .45rem;
}
.upload-list li {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: .75rem;
 padding: .65rem .8rem;
 border-radius: 12px;
 border: 1px solid var(--line);
 background: #fff;
 font-size: .88rem;
 color: var(--ink);
 text-transform: none;
 letter-spacing: 0;
 font-weight: 500;
}
.upload-list .file-meta {
 color: var(--muted);
 font-size: .78rem;
 font-weight: 400;
 margin-left: .35rem;
}
.upload-list button {
 border: 0;
 background: transparent;
 color: #c45d7a;
 font: inherit;
 font-size: .8rem;
 font-weight: 600;
 cursor: pointer;
 text-transform: uppercase;
 letter-spacing: .04em;
}
.success-card { text-align: left; margin-bottom: 3rem; }
.success-eyebrow { margin: 0 0 .5rem; }
.success-title {
 margin: 0 0 .75rem;
 font-family: var(--display);
 font-size: clamp(1.8rem, 3.5vw, 2.4rem);
 font-weight: 600;
 line-height: 1.15;
 background: linear-gradient(120deg, #3a2535, #9b5b8a);
 -webkit-background-clip: text; background-clip: text; color: transparent;
}
.success-lead { margin: 0 0 1.25rem; color: var(--muted); font-weight: 300; font-size: 1.05rem; }
.foot {
 border-top: 1px solid var(--line); padding: 1.2rem 0 2rem;
 color: #a08f9c; font-size: .85rem;
}
.book-sms-cta a { font-weight: 700; }

@media (max-width: 860px) {
 .cal-layout, .row, .durations { grid-template-columns: 1fr; }
 .slots { grid-template-columns: 1fr 1fr; max-height: none; }
 .logo { font-size: .85rem; }
 .phone { font-size: .88rem; padding: .4rem .7rem; }
}

/* === Nightly QA mobile/desktop flow hardening (auto) === */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { overflow-x: hidden; }
img, video, canvas, svg { max-width: 100%; height: auto; }
iframe { max-width: 100%; }
a, button, .btn, input, select, textarea, summary {
  touch-action: manipulation;
}
@media (max-width: 900px) {
  .container, .header-inner, .city-wrap { width: min(100% - 1.25rem, 960px) !important; }
  .hero-actions, .banner-actions, .city-actions { flex-wrap: wrap; gap: .65rem; }
  .hero-actions .btn, .banner-actions .btn, .city-actions .btn { min-height: 44px; }
  .site-header nav, .header-inner nav { flex-wrap: wrap; gap: .55rem; }
  h1 { line-height: 1.15; word-wrap: break-word; overflow-wrap: anywhere; }
}
@media (max-width: 640px) {
  body { padding-left: env(safe-area-inset-left, 0); padding-right: env(safe-area-inset-right, 0); }
  .site-header { padding-top: env(safe-area-inset-top, 0); }
  .hero, .hero-media, .hero-video, video.hero-video { max-height: none; }
  .services-grid, .who-grid, .portfolio-grid { grid-template-columns: 1fr !important; }
  .chat-panel, .chat-widget, #chatPanel { max-width: min(100vw - 1rem, 360px); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}