@charset "UTF-8";
:root { --bg:#fff5ed; --ink:#663944; --accent:#853f51; --soft:#f4dfd6; --line:#d9b8b3; --paper:#fffaf5; --display:Georgia,"Times New Roman",serif; --body:"Segoe UI",Arial,sans-serif; }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
html { scroll-behavior:smooth; scroll-padding-top:30px; }
body { margin:0; background:var(--bg); color:var(--ink); font:16px/1.65 var(--body); }
h1,h2,h3,p,figure { margin:0; }
h1,h2 { font-family:var(--display); font-weight:400; letter-spacing:-.045em; line-height:1.08; text-wrap:balance; }
h1 { font-size:clamp(48px,5.6vw,82px); }
h2 { font-size:clamp(30px,3.2vw,43px); }
h3 { font-size:22px; line-height:1.3; }
a { color:inherit; text-decoration:none; }
button,input,select,textarea { font:inherit; color:inherit; }
button,a,input,select,textarea { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; }
img { display:block; max-width:100%; }
:focus-visible { outline:3px solid var(--accent); outline-offset:5px; }
.container { width:min(1200px,calc(100% - 80px)); margin-inline:auto; }
.skip { position:fixed; top:10px; left:10px; z-index:20; padding:12px; background:var(--ink); color:var(--bg); transform:translateY(-180%); }
.skip:focus { transform:none; }
.studio-bar { background:#104724; color:#f8f1e3; }
.studio-bar > div { display:flex; align-items:center; justify-content:space-between; gap:15px; width:min(1344px,calc(100% - 48px)); min-height:49px; margin:auto; font-size:12px; }
.studio-bar a { display:inline-flex; align-items:center; min-height:44px; text-decoration:underline; text-underline-offset:4px; }
.studio-bar span { color:#e0e8d5; }
.demo-nav { display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:116px; }
.wordmark { font:32px/1.1 var(--display); letter-spacing:-1.2px; }
.demo-nav > div { display:flex; align-items:center; gap:30px; font-size:14px; }
.demo-nav a:not(.wordmark) { display:inline-flex; min-height:44px; align-items:center; }
.cta { display:inline-flex; justify-content:center; align-items:center; gap:15px; min-height:50px; padding:13px 25px; border:1px solid var(--accent); border-radius:5px; background:var(--accent); color:var(--paper); font-weight:600; font-size:14px; text-align:center; transition:background .18s,transform .18s; }
.cta:hover { filter:brightness(1.08); transform:translateY(-2px); }
.quiet { display:inline-flex; align-items:center; min-height:44px; padding:7px 0; border:0; background:none; font-size:14px; text-decoration:underline; text-underline-offset:5px; }
.hero { display:grid; grid-template-columns:.95fr 1.05fr; align-items:center; gap:65px; padding-block:35px 75px; }
.hero-copy > p { max-width:385px; margin-top:25px; font-size:17px; }
.hero-copy .cta { margin-top:30px; }
.hero-photo { width:100%; height:530px; object-fit:cover; border-radius:160px 160px 8px 8px; }
.hero-footnote { display:block; max-width:390px; margin-top:15px; font-size:12px; }
.offerings { padding-block:70px 85px; border-top:1px solid var(--line); }
.section-intro { display:flex; justify-content:space-between; align-items:flex-start; gap:40px; margin-bottom:35px; }
.section-intro p { max-width:365px; font-size:15px; }
.service-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; }
.service-grid article { padding-top:23px; border-top:1px solid var(--line); }
.service-grid h3 { font-family:var(--display); font-weight:400; }
.service-grid p { max-width:320px; margin-top:12px; font-size:15px; }
.looks { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.look-link { padding:0; border:0; border-radius:6px; overflow:hidden; background:var(--soft); text-align:left; }
.look-link img { width:100%; height:305px; object-fit:cover; transition:transform .35s; }
.look-link:hover img { transform:scale(1.025); }
.look-link > span { display:flex; justify-content:space-between; align-items:center; padding:20px; font:23px var(--display); }
.look-link small { font:13px var(--body); text-decoration:underline; text-underline-offset:4px; }
.demo-footer { display:flex; justify-content:space-between; align-items:center; gap:20px; padding-block:28px; border-top:1px solid var(--line); font-size:12px; }
.demo-footer a { text-decoration:underline; text-underline-offset:4px; }
.value-strip { background:var(--soft); padding:34px; border-radius:8px; margin-bottom:65px; }
.value-strip p { max-width:760px; margin-top:12px; font-size:15px; }
.value-strip h2 { font-size:28px; }

/* Each concept has its own identity; the surrounding studio bar stays recognisable. */
body[data-theme="pets"] { --bg:#f5f5e9; --ink:#29473c; --accent:#365c47; --soft:#e5e8d6; --line:#bfc9b4; --paper:#fffff4; --display:"Trebuchet MS","Segoe UI",sans-serif; }
[data-theme="pets"] h1 { font-weight:600; letter-spacing:-.065em; font-size:clamp(44px,5.1vw,72px); }
[data-theme="pets"] .wordmark { font-weight:700; letter-spacing:-1.5px; }
[data-theme="pets"] .hero { grid-template-columns:1.1fr .9fr; }
[data-theme="pets"] .hero-image { order:-1; }
[data-theme="pets"] .hero-photo { border-radius:12px 150px 12px 12px; object-position:38% center; }
[data-theme="pets"] .cta { border-radius:28px; }
[data-theme="pets"] .service-grid h3 { font-weight:600; font-size:21px; }
body[data-theme="auto"] { --bg:#15242f; --ink:#edf3f5; --accent:#d9e7ef; --soft:#213642; --line:#4e626e; --paper:#15242f; --display:Arial,"Segoe UI",sans-serif; }
[data-theme="auto"] h1 { font-weight:600; font-size:clamp(48px,6.3vw,88px); letter-spacing:-.065em; }
[data-theme="auto"] h2 { font-weight:600; letter-spacing:-.04em; }
[data-theme="auto"] .wordmark { font-weight:700; font-size:28px; letter-spacing:-1.3px; }
[data-theme="auto"] .hero { grid-template-columns:.85fr 1.15fr; gap:35px; }
[data-theme="auto"] .hero-photo { height:530px; border-radius:3px; object-position:55% center; }
.package-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:25px; }
.package-grid article { padding:30px; border:1px solid var(--line); border-radius:5px; }
.package-grid ul { padding-left:20px; margin-block:20px; font-size:15px; }
.package-grid h3 { font-size:26px; }
.package-grid .quiet { margin-top:8px; }
body[data-theme="cleaning"] { --bg:#f2f7fa; --ink:#214955; --accent:#245b70; --soft:#dfedf2; --line:#b7d0d8; --paper:#fff; --display:Georgia,"Times New Roman",serif; }
[data-theme="cleaning"] .hero { grid-template-columns:.9fr 1.1fr; gap:60px; }
[data-theme="cleaning"] .hero-photo { height:520px; border-radius:5px; }
[data-theme="cleaning"] .wordmark { font-size:30px; }

dialog { width:min(1030px,calc(100% - 48px)); max-height:92dvh; padding:0; border:0; border-radius:12px; background:var(--bg); color:var(--ink); box-shadow:0 30px 120px #0005; }
dialog::backdrop { background:#12261de0; backdrop-filter:blur(6px); }
dialog[open] { animation:enter .22s ease-out; }
body:has(dialog[open]) { overflow:hidden; }
.dialog-top { display:flex; position:sticky; top:0; z-index:2; justify-content:space-between; align-items:center; gap:20px; min-height:62px; padding:9px 25px; border-bottom:1px solid var(--line); background:var(--bg); }
.dialog-top p { font-size:13px; }
.close { display:grid; place-items:center; flex:none; width:44px; height:44px; padding:10px; border:1px solid var(--line); border-radius:50%; background:transparent; }
.close svg { width:20px; height:20px; }
.dialog-body { padding:30px 35px 35px; }
.dialog-body h2 { max-width:700px; margin-bottom:10px; font-size:33px; }
.dialog-intro { max-width:650px; margin-bottom:20px; font-size:14px; }
.sample-action { margin:0 0 19px; }
.config-layout { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:34px; align-items:start; }
.fields { display:grid; gap:19px; min-width:0; }
.fields label:not(.choice),.field-label { display:grid; gap:7px; font-size:14px; font-weight:600; }
.fields input:not([type="radio"]):not([type="checkbox"]),.fields select,.fields textarea { width:100%; min-height:48px; padding:10px 12px; border:1px solid var(--line); border-radius:5px; background:var(--paper); color:var(--ink); font-size:16px; }
[data-theme="auto"] .fields input:not([type="checkbox"]):not([type="radio"]),[data-theme="auto"] .fields select { background:#243c4a; color:var(--ink); }
.fields textarea { min-height:85px; resize:vertical; }
.field-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
fieldset { min-width:0; margin:0; padding:0; border:0; }
legend { margin-bottom:9px; padding:0; font-size:14px; font-weight:600; }
.choices { display:flex; flex-wrap:wrap; gap:9px; }
.choice { display:flex; align-items:center; gap:9px; min-height:46px; padding:10px 13px; border:1px solid var(--line); border-radius:6px; font-size:14px; cursor:pointer; }
.choice:has(:checked) { border-color:var(--accent); background:var(--soft); box-shadow:inset 0 0 0 1px var(--accent); }
.choice input { width:17px; height:17px; flex:none; accent-color:var(--accent); margin:0; }
.choice:has(input:disabled) { opacity:.6; }
.stacked { display:grid; gap:9px; }
.look-choices { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.look-choice { display:block; position:relative; overflow:hidden; padding:0; }
.look-choice img { width:100%; height:110px; object-fit:cover; }
.look-choice > span { display:flex; gap:7px; align-items:center; padding:9px 7px; font-size:12px; }
.live-panel { position:sticky; top:90px; padding:24px; border-radius:8px; background:var(--soft); font-size:14px; }
.live-panel h3 { margin-bottom:15px; font-size:17px; }
.live-panel img { width:100%; max-height:220px; object-fit:cover; border-radius:4px; margin-bottom:17px; }
.live-panel ul { margin:15px 0; padding-left:18px; }
.live-panel p + p { margin-top:13px; }
.live-total { display:block; margin-block:7px 10px; font-family:var(--display); font-size:31px; font-weight:500; line-height:1.25; }
.price-lines { margin-top:15px; }
.price-lines > div { display:flex; justify-content:space-between; gap:10px; padding-block:7px; border-bottom:1px solid var(--line); font-size:13px; }
.price-lines dd { margin:0; text-align:right; }
.help { font-size:13px; font-weight:400; }
.notice { margin-top:12px; padding:12px 15px; border-left:3px solid var(--accent); background:var(--soft); font-size:13px; }
.review { max-width:760px; margin:auto; }
.review-state { display:inline-block; margin-bottom:20px; padding:5px 12px; border-radius:20px; background:var(--soft); font-size:13px; }
.review-summary { display:grid; grid-template-columns:160px minmax(0,1fr); gap:0 30px; margin-block:25px; font-size:15px; }
.review-summary dt,.review-summary dd { padding-block:12px; border-bottom:1px solid var(--line); }
.review-summary dt { font-weight:600; }
.review-summary dd { margin:0; overflow-wrap:anywhere; white-space:pre-line; }
.review-actions { display:flex; flex-wrap:wrap; align-items:center; gap:15px 25px; margin-top:25px; }
.review-bottom { display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px 25px; margin-top:25px; border-top:1px solid var(--line); padding-top:15px; }
@keyframes enter { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }
@media(max-width:1050px) {
  .container { width:calc(100% - 48px); }
  .hero,[data-theme] .hero { gap:30px; }
  .hero-photo,[data-theme] .hero-photo { height:460px; }
  h1 { font-size:60px; }
  [data-theme="auto"] h1 { font-size:64px; }
  .look-link img { height:260px; }
}
@media(max-width:760px) {
  .container { width:calc(100% - 40px); }
  .studio-bar > div { width:calc(100% - 32px); font-size:11px; gap:10px; }
  .studio-bar span { display:none; }
  .demo-nav { min-height:94px; gap:16px; }
  .wordmark,[data-theme] .wordmark { font-size:25px; }
  .demo-nav > div { gap:0; }
  .demo-nav > div > a { display:none !important; }
  .demo-nav .cta { padding:10px 16px; font-size:12px; min-height:44px; }
  .hero,[data-theme] .hero { grid-template-columns:1fr; gap:30px; padding-block:20px 45px; }
  .hero h1,[data-theme] .hero h1 { max-width:520px; font-size:clamp(43px,11vw,65px); }
  .hero-copy > p { margin-top:20px; font-size:16px; }
  .hero-copy .cta { margin-top:24px; }
  .hero-photo,[data-theme] .hero-photo { height:340px; border-radius:6px; }
  [data-theme="pets"] .hero-image { order:0; }
  [data-theme="pets"] .hero-photo { border-radius:70px 8px 8px 8px; }
  [data-theme="party"] .hero-photo { object-position:50% 55%; }
  .offerings { padding-block:40px 50px; }
  .section-intro { display:block; margin-bottom:27px; }
  .section-intro p { margin-top:17px; }
  .service-grid,.looks,.package-grid { grid-template-columns:1fr; gap:22px; }
  .look-link { display:grid; grid-template-columns:110px 1fr; }
  .look-link img { width:110px; height:135px; }
  .look-link > span { flex-direction:column; align-items:flex-start; justify-content:center; gap:9px; padding:18px; }
  .package-grid article { padding:25px; }
  .value-strip { padding:25px; margin-bottom:40px; }
  .demo-footer { align-items:flex-start; flex-direction:column; gap:8px; }
  dialog { width:calc(100% - 20px); max-height:95dvh; border-radius:10px; }
  .dialog-top { padding:7px 15px; gap:10px; }
  .dialog-top p { font-size:12px; }
  .dialog-body { padding:23px 20px 28px; }
  .dialog-body h2 { font-size:29px; }
  .config-layout { grid-template-columns:1fr; gap:24px; }
  .live-panel { position:static; }
  .live-panel img { max-height:210px; }
  .field-row { grid-template-columns:1fr; }
  .look-choices { gap:7px; }
  .look-choice img { height:95px; }
  .look-choice > span { flex-wrap:wrap; font-size:11px; gap:5px; }
  .review-summary { grid-template-columns:105px minmax(0,1fr); column-gap:15px; font-size:14px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation:none !important; transition:none !important; } }
