:root{--navy:#103361;--teal:#236b6b;--mint:#e4efea;--cream:#f7f7f0;--line:#d4ded8}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;color:var(--navy);background:#fff;font:16px/1.6 Arial,sans-serif}a{color:inherit}button,input,textarea,select{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #b66a28;outline-offset:4px}.demo{text-align:center;background:var(--navy);color:white;font-size:11px;letter-spacing:.07em;padding:9px}header{max-width:1240px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:14px 30px}.logo{width:190px;height:85px;object-fit:contain}nav{display:flex;align-items:center;gap:30px;font-size:14px}nav a{text-decoration:none}.button{display:inline-flex;justify-content:center;align-items:center;gap:30px;background:var(--navy);color:white;text-decoration:none;border:0;border-radius:7px;padding:17px 24px;font-weight:bold;font-size:14px}.button:hover{background:var(--teal)}.small{padding:12px 18px}.hero{max-width:1240px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:50px;padding:55px 30px 75px;align-items:center}.eyebrow,.number{font-size:11px;letter-spacing:.16em;font-weight:bold;color:var(--teal)}h1{font-family:Georgia,serif;font-size:clamp(48px,5.4vw,76px);line-height:1.08;font-weight:normal;letter-spacing:-.04em;margin:24px 0}h1 em{color:var(--teal);font-weight:normal}h2{font-family:Georgia,serif;font-weight:normal;font-size:36px;line-height:1.2;letter-spacing:-.025em;margin:18px 0}h3{font:normal 25px/1.2 Georgia,serif}.intro{max-width:450px;color:#52646b;margin-bottom:30px}.fine{font-size:12px;color:#53656b}.scene{height:450px;position:relative;overflow:hidden;border-radius:100px 10px 10px 10px;background:linear-gradient(105deg,#e5e9df 0%,#f4f0e4 60%,#dadfd3 100%);border-bottom:70px solid #d8d6c7}.sun{position:absolute;left:40px;top:0;width:180px;height:250px;transform:skew(-20deg);background:linear-gradient(90deg,#fff7 48%,transparent 49%,transparent 52%,#fff7 53%);border-bottom:8px solid #fff5}.rug{position:absolute;bottom:-45px;left:5%;width:90%;height:100px;border-radius:50%;background:repeating-linear-gradient(5deg,#aec0b6 0 3px,#b7c8bf 3px 7px)}.sofa{position:absolute;left:14%;bottom:25px;width:74%;height:145px;border-radius:35px 35px 12px 12px;background:linear-gradient(#c2b7a0,#a39983);box-shadow:0 18px 0 -8px #625b4c,0 25px 25px #514b4840;display:flex;gap:3px;padding:12px 22px 40px;border:13px solid #b0a58f}.sofa i{flex:1;background:linear-gradient(130deg,#e1d6bd,#c7baa0);border-radius:13px;box-shadow:0 3px 6px #665c4f30}.sofa i:last-child{background:#457674;transform:rotate(10deg);height:70px;margin-top:20px}.plant{position:absolute;right:15px;top:10px;font-size:100px;color:#5d7c65}.spark{position:absolute;left:35px;bottom:160px;color:white;font-size:50px}.scene-label{position:absolute;top:30px;left:40px;font-size:9px;letter-spacing:.12em}.services{background:var(--cream);padding:60px max(30px,calc((100vw - 1180px)/2));display:grid;grid-template-columns:1fr 1fr 1fr;gap:35px}.services article{border-left:1px solid var(--line);padding-left:30px}.services p{color:#52646b}.services a{font-size:14px;font-weight:bold;text-underline-offset:5px}.how{max-width:1240px;margin:auto;padding:65px 30px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:50px}.steps b{display:block;font:28px Georgia;color:var(--teal);padding-bottom:15px;border-bottom:1px solid var(--line)}.steps strong{display:block;margin:18px 0 8px}.steps p{font-size:14px}.booking{background:var(--mint);padding:65px max(30px,calc((100vw - 1180px)/2));display:grid;grid-template-columns:.8fr 1.2fr;gap:80px}.note{padding:20px;background:#ffffff80;border:1px solid #bdcec7;border-radius:8px;margin-top:25px;font-size:14px}.note p{margin-bottom:0}form{background:white;padding:32px;border-radius:12px;box-shadow:0 8px 40px #12355308}fieldset{border:0;padding:0;margin:0 0 25px}legend{font-weight:bold;margin-bottom:15px}label{display:block;font-size:13px;font-weight:bold;margin-bottom:14px}input:not([type=radio]):not([type=checkbox]),textarea,select{width:100%;min-width:0;border:1px solid #bbc9c5;border-radius:5px;background:#fcfdfb;padding:11px;margin-top:6px;color:var(--navy)}textarea{min-height:100px;resize:vertical}.grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.choices{display:flex;gap:15px}.choices label{border:1px solid #bbc9c5;padding:12px 20px;border-radius:6px;flex:1}.check{display:flex;gap:10px;font-weight:normal;align-items:flex-start}input[type=checkbox],input[type=radio]{accent-color:var(--teal)}.owner{max-width:1240px;margin:0 auto;padding:65px 30px}.owner h2{font-size:32px}.secondary{background:var(--teal)}.text-button{background:transparent;border:0;text-decoration:underline;padding:16px;color:var(--navy)}.install{margin:0 auto;background:var(--cream);padding:40px max(30px,calc((100vw - 1180px)/2));display:flex;gap:30px;align-items:center}.install p{max-width:750px}footer{max-width:1240px;padding:30px;margin:auto;font-size:14px}dialog{max-width:500px;width:90%;border:1px solid var(--line);border-radius:12px;padding:30px;color:var(--navy)}dialog::backdrop{background:#12355388}[hidden]{display:none!important}#result:not(:empty),#owner-status:not(:empty){padding:15px;background:var(--mint);border-left:3px solid var(--teal)}@media(max-width:760px){header{padding:10px 20px}nav a:not(.button){display:none}.logo{width:140px;height:65px}nav .button{font-size:11px;padding:10px}.demo span{display:block}.hero{grid-template-columns:1fr;padding:30px 20px 45px;gap:25px}.scene{height:330px}.services{grid-template-columns:1fr;padding:35px 20px;gap:25px}.services article{padding-left:20px}.how{padding:40px 20px}.steps{grid-template-columns:1fr;gap:5px}.booking{grid-template-columns:1fr;padding:40px 20px;gap:25px}form{padding:22px 16px}.grid{grid-template-columns:1fr;gap:0}.owner{padding:40px 20px}.install{padding:30px 20px;display:block}h2{font-size:32px}.button{gap:15px}.scene-label{font-size:8px}footer{padding:20px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Approved complete lockup: generous clear space and accessible descriptor. */
header{flex-wrap:wrap;gap:12px 30px;padding-top:22px;padding-bottom:22px}.brand{display:block}.brand>a{display:block}.logo{width:355px;max-width:100%;height:auto}.brand-descriptor{margin:6px 0 0;font-size:14px}footer .logo{margin:16px 0}@media(max-width:760px){header nav{margin-top:4px;justify-content:flex-start}}

/* Expanded service range: general and office cleaning alongside sofas and carpets. */
.services{display:block}.services-list{display:grid;grid-template-columns:repeat(4,1fr);gap:35px;margin-top:35px}.choices{flex-wrap:wrap}.choices label{flex:1 1 150px;margin-bottom:0}@media(max-width:1040px){.services-list{grid-template-columns:1fr 1fr}}@media(max-width:760px){.services-list{grid-template-columns:1fr;gap:25px;margin-top:25px}}

/* Supplied FAQ copy. */
.faq{max-width:1240px;margin:auto;padding:0 30px 65px;display:grid;grid-template-columns:.8fr 1.2fr;gap:50px}.faq dl{margin:0}.faq dt{font-weight:bold;margin-top:22px}.faq dt:first-child{margin-top:0}.faq dd{margin:6px 0 0;color:#52646b;border-left:1px solid var(--line);padding-left:18px}@media(max-width:760px){.faq{grid-template-columns:1fr;padding:0 20px 40px;gap:10px}}

/* Owner-supplied business details and the per-item / hourly quote basis. */
.services .basis{font-size:12px;font-weight:bold;color:var(--teal);border-top:1px solid var(--line);padding-top:10px;margin:14px 0}.biz{max-width:1240px;margin:auto;padding:0 30px 65px;display:grid;grid-template-columns:.8fr 1.2fr;gap:50px;align-items:start}.biz-list{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:18px 30px}.biz-list dt{font-size:11px;letter-spacing:.14em;font-weight:bold;color:var(--teal)}.biz-list dd{margin:4px 0 0}.biz-list div:last-child{grid-column:1/-1}.biz-list a{text-underline-offset:4px}@media(max-width:760px){.biz{grid-template-columns:1fr;padding:0 20px 40px;gap:20px}.biz-list{grid-template-columns:1fr;gap:14px}}

/* PLA-48 · language switch. */
.lang-toggle{background:transparent;border:1px solid var(--line);border-radius:6px;padding:9px 14px;font-size:13px;color:var(--navy)}.lang-toggle:hover{border-color:var(--teal);color:var(--teal)}

/* PLA-48 · interactive booking. Steps 2-5 stay hidden until the previous
   choice is made, so the visitor is never shown an hour grid with no service
   or duration behind it. */
.booker{background:white;border-radius:12px;padding:30px;box-shadow:0 8px 40px #12355308}
.bstep{padding-top:26px;margin-top:26px;border-top:1px solid var(--line)}.bstep:first-child{padding-top:0;margin-top:0;border-top:0}
.bstep h3{display:flex;align-items:baseline;gap:14px;font-size:20px;margin:0 0 16px}
.bstep h3 b{flex:none;width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:var(--mint);color:var(--teal);font:bold 13px/1 Arial,sans-serif}

.svc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}
.svc-pick{display:block;text-align:left;background:#fcfdfb;border:1px solid #bbc9c5;border-radius:8px;padding:14px 16px;color:var(--navy)}
.svc-pick:hover{border-color:var(--teal)}
.svc-pick[aria-pressed=true]{border-color:var(--navy);border-width:2px;padding:13px 15px;background:var(--mint)}
.svc-pick-name{display:block;font-weight:bold;font-size:15px}
.svc-pick-basis{display:block;margin-top:5px;font-size:12px;color:#53656b}

.stepper{display:flex;align-items:center;gap:18px}
.stepper button{width:46px;height:46px;border:1px solid #bbc9c5;border-radius:8px;background:#fcfdfb;font-size:22px;line-height:1;color:var(--navy)}
.stepper button:hover:not(:disabled){border-color:var(--teal);color:var(--teal)}
.stepper button:disabled{opacity:.4;cursor:not-allowed}
.stepper-read{font-size:17px}.stepper-read strong{font:bold 26px/1 Georgia,serif}
.bstep .basis{font-size:12px;font-weight:bold;color:var(--teal);margin:14px 0 4px}

/* The day strip scrolls sideways on a phone rather than wrapping into a grid
   that pushes the hour list off screen. */
.day-strip{display:flex;gap:10px;overflow-x:auto;padding-bottom:6px;scrollbar-width:thin}
.day-pick{flex:none;min-width:74px;background:#fcfdfb;border:1px solid #bbc9c5;border-radius:8px;padding:10px 8px;color:var(--navy);text-align:center}
.day-pick:hover{border-color:var(--teal)}
.day-pick[aria-pressed=true]{border-color:var(--navy);border-width:2px;padding:9px 7px;background:var(--mint)}
.day-name{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--teal);font-weight:bold}
.day-num{display:block;margin-top:4px;font-weight:bold;font-size:14px}

.slot-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:10px}
.slot{background:#fcfdfb;border:1px solid #bbc9c5;border-radius:8px;padding:11px 8px;color:var(--navy)}
.slot:hover:not(:disabled){border-color:var(--teal)}
.slot[aria-pressed=true]{border-color:var(--navy);border-width:2px;padding:10px 7px;background:var(--mint)}
.slot:disabled{background:#f1f3ef;color:#8a989b;border-style:dashed;cursor:not-allowed;text-decoration:line-through}
.slot-time{display:block;font-weight:bold;font-size:14px}
.slot-why{display:block;font-size:11px;text-decoration:none}
.slot:disabled .slot-time{text-decoration:line-through}

.book-msg{font-size:14px;color:#53656b;margin:14px 0 0}
.chosen{background:var(--mint);border-radius:8px;padding:12px 14px;font-size:14px;font-weight:bold;margin:0 0 18px}
/* The booking form sits inside the .booker card, so it must not draw a second
   card around itself the way the standalone form rule does. */
#book-form{background:transparent;padding:0;border-radius:0;box-shadow:none}
.book-error{color:#9a2a1f;font-size:14px;font-weight:bold;margin:14px 0 0}
.book-error:empty{margin:0}

.book-done{background:white;border-radius:12px;padding:34px;box-shadow:0 8px 40px #12355308}
.book-done h3{margin:0 0 18px;color:var(--teal)}
.done-ref-label{font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:bold;color:var(--teal);margin:0}
.done-ref{font:bold 30px/1.2 "Courier New",monospace;letter-spacing:.08em;margin:6px 0 16px;word-break:break-all}
.book-done .button{margin-top:20px}

@media(max-width:760px){.booker,.book-done{padding:20px 16px}.bstep h3{font-size:18px}.svc-grid{grid-template-columns:1fr}.slot-grid{grid-template-columns:repeat(auto-fill,minmax(104px,1fr))}}

/* PLA-48 · let the booking column shrink below its content.
   A grid item defaults to min-width:auto, so the 7-item .day-strip flex row
   set the minimum width of its whole column and pushed the page sideways on a
   phone. minmax(0,1fr) plus min-width:0 lets the column shrink, which is what
   finally allows .day-strip's own overflow-x:auto to scroll instead. */
.booking{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
.booking>*{min-width:0}
.booker,.bstep,.day-strip,.slot-grid,.svc-grid{min-width:0}
@media(max-width:760px){.booking{grid-template-columns:minmax(0,1fr)}}

/* PLA-48 · a booking is a request until the owner confirms it.
   The confirmation panel must not look like a settled appointment, so it
   carries a "waiting" accent instead of the teal used for done things. */
.book-done.pending{border-left:4px solid #b66a28}
.book-done.pending h3{color:#8a4f1e}
.done-next{background:var(--cream);border-radius:8px;padding:14px 16px;font-size:14px;margin:18px 0 0}

/* PLA-48 · privacy notice. A long legal text needs a measure the eye can
   follow, which the marketing layout's wide columns do not give it. */
.legal{max-width:760px;margin:auto;padding:10px 30px 70px}
.legal h1{font-size:clamp(34px,4.6vw,52px);margin:18px 0 10px}
.legal h2{font-size:26px;margin:40px 0 12px;padding-top:26px;border-top:1px solid var(--line)}
.legal h3{font-size:19px;margin:26px 0 8px}
.legal p,.legal li{color:#3f5159}
.legal .intro{max-width:none;font-size:17px;color:#52646b}
.legal-date{font-size:13px;color:#53656b;margin:0 0 26px}
.legal ul{padding-left:22px}
.legal li{margin-bottom:8px}
.legal code{background:var(--cream);border-radius:4px;padding:1px 5px;font-size:.92em}
.legal a{text-underline-offset:4px}
.legal-page footer{border-top:1px solid var(--line);margin-top:0;padding-top:24px}
.legal-page nav{gap:18px}
.legal-page nav a{text-decoration:none}
@media(max-width:760px){.legal{padding:4px 20px 44px}.legal h2{font-size:23px;margin-top:32px}.legal-page nav a{display:inline}}

/* PLA-48 · six service cards, so the wide grid is three across rather than
   four. Four columns left one card alone on the second row with five services
   and would leave two with six; three columns fills both rows. The narrower
   breakpoints already pair and stack them, so they are untouched. */
@media(min-width:1041px){.services-list{grid-template-columns:repeat(3,1fr)}}

/* PLA-48 · the privacy link sitting under the submit button. */
.consent-note{font-size:12px;color:#53656b;margin:14px 0 0;line-height:1.55}
.consent-note a{text-underline-offset:3px}
footer .legal-links{margin:10px 0 0;font-size:13px;display:flex;gap:18px;flex-wrap:wrap}
.done-state{display:inline-block;background:#f3e6d6;color:#8a4f1e;border-radius:999px;padding:5px 13px;font-size:11px;font-weight:bold;letter-spacing:.09em;text-transform:uppercase;margin:0 0 20px}
