
:root {
  --brand: #28C7C0;
  --brand-dark: #0f5753;
  --text: #1F2A37;
  --bg: #ffffff;
  --muted: #6B7280;
  --card: #ffffff;
  --radius: 14px;
  --shadow: 0 8px 30px rgba(16,24,40,.08);
}

* { box-sizing: border-box; }
html, body { height: 100%; }
body {
  margin: 0;
  color: var(--text);
  font: 16px/1.6 -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Inter,Helvetica,Arial,'Apple Color Emoji','Segoe UI Emoji';
  background:
    radial-gradient(1000px 600px at 0% 0%, rgba(40,199,192,0.18), transparent 60%),
    radial-gradient(800px 500px at 100% 20%, rgba(40,199,192,0.10), transparent 60%),
    linear-gradient(180deg, #F8FFFE 0%, #FFFFFF 60%);
}

.container { width: min(1100px, 92%); margin: 0 auto; }
.section { padding: 56px 0; }
h1, h2, h3 { margin: 0 0 12px; line-height: 1.2; }
h1 { font-size: clamp(32px, 5vw, 44px); }
h2 { font-size: clamp(24px, 4vw, 32px); }
h3 { font-size: 20px; }


.header-inner { display: flex; align-items: center; gap: 16px; padding: 14px 0; }
.logo { font-weight: 800; letter-spacing: .5px; }
.logo span { font-weight: 600; color: var(--muted); }
.nav { margin-left: auto; display: none; gap: 18px; }
.nav a { color: var(--text); text-decoration: none; opacity: .9; }
@media (min-width: 800px) { .nav { display: flex; } }

.btn {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 10px 16px; border-radius: 999px; text-decoration: none; border: 1px solid transparent;
  font-weight: 600; cursor: pointer;
}
.btn-primary { background: var(--brand); color: white; box-shadow: 0 6px 16px rgba(40,199,192,.35); }
.btn-primary:hover { filter: brightness(.95); }
.btn-outline { border-color: var(--brand); color: var(--brand); background: transparent; }
.btn-outline:hover { background: rgba(40,199,192,.06); }
.btn-full { width: 100%; }

.hero { padding: 72px 0 36px; }
.eyebrow { color: var(--brand-dark); font-weight: 700; letter-spacing: .2px; }
.lead { color: var(--muted); max-width: 720px; }
.cta-row { display: flex; align-items: center; gap: 24px; margin-top: 18px; flex-wrap: wrap; }
.checks { list-style: none; padding: 0; margin: 0; display: flex; gap: 16px; color: var(--muted); }
.checks li::before { content: "✓ "; color: var(--brand-dark); }

.grid { display: grid; gap: 18px; }
.grid-3 { grid-template-columns: repeat(auto-fit,minmax(240px,1fr)); }
.card {
  background: var(--card); border-radius: var(--radius); padding: 20px; box-shadow: var(--shadow);
}
.card ul { margin: 10px 0 0 18px; }
.card.highlight { outline: 2px solid rgba(40,199,192,.25); }

.price span { font-size: 28px; font-weight: 800; }
.muted { color: var(--muted); }

details { background: #fff; border-radius: var(--radius); padding: 14px 16px; box-shadow: var(--shadow); margin-bottom: 10px; }

.contact-grid { display: grid; gap: 22px; grid-template-columns: 1fr; }
@media (min-width: 900px) { .contact-grid { grid-template-columns: 1fr 360px; } }
.form-col form { display: grid; gap: 12px; }
label { display: grid; gap: 6px; font-weight: 600; }
input, select, textarea {
  width: 100%; padding: 12px 14px; border: 1px solid #E5E7EB; border-radius: 10px; background: #fff;
  font: inherit;
}
textarea { min-height: 110px; resize: vertical; }

.form-status {
  margin-top: 8px; padding: 10px 12px; border-radius: 10px;
  background: rgba(40,199,192,.12); color: var(--brand-dark); font-weight: 700; text-align: center;
}
.hidden { display: none; }

.contact-card { background: var(--card); border-radius: var(--radius); padding: 18px; box-shadow: var(--shadow); }
.contact-card h3 { margin-bottom: 10px; }
.contact-list { list-style: none; padding: 0; margin: 0 0 14px; }
.contact-list li { margin: 6px 0; }
.contact-list a { color: var(--brand-dark); text-decoration: none; }

.site-footer { padding: 28px 0; border-top: 1px solid #eef2f3; }
.footer-inner { display: grid; gap: 10px; grid-template-columns: 1fr; align-items: center; }
@media (min-width: 800px) { .footer-inner { grid-template-columns: 1fr auto auto; } }
.footer-nav a { margin-left: 14px; color: var(--muted); text-decoration: none; }

/* ----- Gallery Carousel ----- */
.gallery-section { padding-top: 20px; }
.carousel { position: relative; width: 100%; overflow: hidden; padding: 34px 0 6px; }
.car-track { display: flex; align-items: center; justify-content: center; gap: 24px; transition: transform .4s ease; }
.car-item {
  width: 18vw; max-width: 360px; min-width: 180px; aspect-ratio: 3/2; object-fit: cover;
  border-radius: 16px; box-shadow: var(--shadow); opacity: .55; transform: scale(.78); transition: transform .35s ease, opacity .35s ease;
}
@media (max-width: 700px){ .car-item { width: 60vw; } }
.car-item.center { transform: scale(1.05); opacity: 1; }
.car-item.left, .car-item.right { transform: scale(.9); opacity: .85; }
.car-btn {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(0,0,0,.08);
  background: #fff; box-shadow: var(--shadow); cursor: pointer; font-size: 28px; line-height: 1;
}
.car-btn:hover { background: rgba(40,199,192,.08); border-color: rgba(40,199,192,.25); }
.car-btn.prev { left: 10px; }
.car-btn.next { right: 10px; }

/* v2 gallery size + lightbox */
.gallery-section .carousel { max-width: 100%; }
.car-item {
  width: 22vw; max-width: 420px; min-width: 200px;
}
@media (max-width: 700px){ .car-item { width: 80vw; } }

.lightbox{
  position: fixed; inset: 0; background: rgba(15,23,42,.86);
  display: flex; align-items: center; justify-content: center; z-index: 1000;
  padding: 24px;
}
.lightbox img{
  max-width: 96vw; max-height: 90vh; border-radius: 12px; box-shadow: 0 16px 60px rgba(0,0,0,.5);
}
.lightbox-close{
  position: absolute; top: 14px; right: 14px; width: 44px; height: 44px;
  border: 0; border-radius: 50%; background: #fff; font-size: 28px; cursor: pointer;
  box-shadow: var(--shadow);
}

/* v3 — Typography & Background */
body{
  font-size: 17px;
  background:
    radial-gradient(900px 540px at 0% 10%, rgba(40,199,192,0.24), transparent 60%),
    radial-gradient(900px 540px at 100% 20%, rgba(40,199,192,0.18), transparent 60%),
    linear-gradient(180deg, #F4FFFD 0%, #FFFFFF 70%);
}
h1{ font-size: clamp(36px, 6vw, 54px); font-weight: 800; }
h2{ font-size: clamp(28px, 4.5vw, 36px); font-weight: 800; }
h3{ font-size: 22px; font-weight: 700; }
.lead{ font-size: 18px; }

/* Decorative layers */
.decor{ position: fixed; pointer-events: none; z-index: 0; }
@keyframes sweep{
  0%{ transform: rotate(-8deg) translateY(0); }
  50%{ transform: rotate(8deg) translateY(-12px); }
  100%{ transform: rotate(-8deg) translateY(0); }
}
@keyframes float{
  from{ transform: translateY(65vh) translateX(0); }
  to{ transform: translateY(-10vh) translateX(-35px); }
}
/* Ensure content sits above decor */
.site-header, main, .site-footer{ position: relative; z-index: 1; }

/* v4 — stronger turquoise gradient & many big bubbles */
body{
  background:
    radial-gradient(1200px 720px at 100%% 15%%, rgba(40,199,192,0.28), transparent 60%%),
    radial-gradient(900px 540px at 0%% 20%%, rgba(40,199,192,0.22), transparent 60%%),
    linear-gradient(180deg, #EFFFFB 0%%, #FFFFFF 70%%);
}
/* different sizes */
/* motion */
to{ transform: translateY(-15vh) translateX(-50px); }
}
/* stagger columns & delays to fill the whole side */
/* v5 — full-page turquoise wash without edges */
body{
  background: #ffffff;
  position: relative;
}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;background:radial-gradient(1700px 1000px at 100% 0%, rgba(40,199,192,0.60), rgba(40,199,192,0.18) 62%, transparent 74%),radial-gradient(1700px 1000px at 0% 0%, rgba(40,199,192,0.52), rgba(40,199,192,0.16) 62%, transparent 74%),radial-gradient(1700px 1000px at 100% 100%, rgba(40,199,192,0.40), rgba(40,199,192,0.14) 62%, transparent 74%),radial-gradient(1700px 1000px at 0% 100%, rgba(40,199,192,0.34), rgba(40,199,192,0.12) 62%, transparent 74%),linear-gradient(180deg, rgba(210,255,247,1) 0%, rgba(255,255,255,0.94) 50%, rgba(210,255,247,1) 100%);filter:saturate(125%);}
.site-header, main, .site-footer{ position: relative; z-index: 1; }

/* Mop & Duster motion */
@keyframes mop-sway{
  0%{ transform: translate(0,0) rotate(-10deg); }
  50%{ transform: translate(-8px,-10px) rotate(8deg); }
  100%{ transform: translate(0,0) rotate(-10deg); }
}
@keyframes duster-float{
  0%{ transform: translate(0,0) rotate(-6deg); }
  33%{ transform: translate(-10px, -14px) rotate(6deg); }
  66%{ transform: translate(6px, -8px) rotate(-4deg); }
  100%{ transform: translate(0,0) rotate(-6deg); }
}

/* Keep broom visible but slightly higher so trio doesn't overlap */
/* v6 bubbles stronger */
/* v6 tools on left edge */
/* positions & animations to avoid overlap */
@keyframes drift1{ 0%{transform:rotate(-10deg) translate(0,0);} 50%{transform:rotate(8deg) translate(-8px,-10px);} 100%{transform:rotate(-10deg) translate(0,0);} }
@keyframes drift2{ 0%{transform:rotate(6deg) translate(0,0);} 50%{transform:rotate(-6deg) translate(-10px,-8px);} 100%{transform:rotate(6deg) translate(0,0);} }
@keyframes drift3{ 0%{transform:rotate(-4deg) translate(0,0);} 33%{transform:rotate(4deg) translate(-6px,-8px);} 66%{transform:rotate(-6deg) translate(4px,-6px);} 100%{transform:rotate(-4deg) translate(0,0);} }

.lightbox{ justify-content:center; align-items:center; }
.lightbox-prev,.lightbox-next{
  position:absolute; top:50%; transform:translateY(-50%);
  width:56px; height:56px; border-radius:50%; border:0; background:#fff; font-size:34px; cursor:pointer;
  box-shadow: 0 10px 24px rgba(0,0,0,.25);
}
.lightbox-prev{ left:20px; } .lightbox-next{ right:20px; }

/* v7 chess-like stagger & gentle sway */
50%{ transform:rotate(6deg) translateX(-10px) } 100%{ transform:rotate(-6deg) translateX(0) } }
50%{ transform:rotate(-6deg) translateX(10px) } 100%{ transform:rotate(6deg) translateX(0) } }

.car-viewport{ overflow:hidden; }



50%{ transform:rotate(6deg) translateX(-10px) } 100%{ transform:rotate(-6deg) translateX(0) } }
50%{ transform:rotate(-6deg) translateX(10px) } 100%{ transform:rotate(6deg) translateX(0) } }

50%{ opacity:1 } 100%{ transform:translateY(-100vh) scale(1.05); opacity:.2 } }
.car-viewport{overflow:visible;} .car-track{transform:translateX(0)!important; justify-content:center;}


.decor-bubbles, .decor-bubbles-left{
  position:fixed; top:0; width:520px; height:100vh; pointer-events:none; z-index:0;
}
.decor-bubbles{ right:0; }
.decor-bubbles-left{ left:0; }
.decor-bubbles span, .decor-bubbles-left span{
  position:absolute; display:block; border-radius:50%;
  background: radial-gradient(circle at 35% 35%, rgba(255,255,255,1), rgba(40,199,192,.88));
  box-shadow: 0 14px 34px rgba(40,199,192,.5);
  opacity:1; bottom:-12vh; animation: floatUp 12s linear infinite;
}
@keyframes floatUp{
  0%{ transform: translateY(20vh) scale(.9); opacity:.75 }
  50%{ opacity:1 }
  100%{ transform: translateY(-110vh) scale(1.06); opacity:.2 }
}

.decor-bubbles span:nth-child(1){ left:10px; animation-delay:0.00s; animation-duration:10.00s; width:18px; height:18px; }
.decor-bubbles span:nth-child(2){ left:70px; animation-delay:0.40s; animation-duration:12.10s; width:30px; height:30px; }
.decor-bubbles span:nth-child(3){ left:130px; animation-delay:0.80s; animation-duration:14.20s; width:42px; height:42px; }
.decor-bubbles span:nth-child(4){ left:190px; animation-delay:1.20s; animation-duration:16.30s; width:54px; height:54px; }
.decor-bubbles span:nth-child(5){ left:250px; animation-delay:1.60s; animation-duration:18.40s; width:66px; height:66px; }
.decor-bubbles span:nth-child(6){ left:310px; animation-delay:2.00s; animation-duration:20.50s; width:18px; height:18px; }
.decor-bubbles span:nth-child(7){ left:370px; animation-delay:2.40s; animation-duration:10.00s; width:30px; height:30px; }
.decor-bubbles span:nth-child(8){ left:430px; animation-delay:2.80s; animation-duration:12.10s; width:42px; height:42px; }
.decor-bubbles span:nth-child(9){ left:10px; animation-delay:3.20s; animation-duration:14.20s; width:54px; height:54px; }
.decor-bubbles span:nth-child(10){ left:70px; animation-delay:3.60s; animation-duration:16.30s; width:66px; height:66px; }
.decor-bubbles span:nth-child(11){ left:130px; animation-delay:4.00s; animation-duration:18.40s; width:18px; height:18px; }
.decor-bubbles span:nth-child(12){ left:190px; animation-delay:4.40s; animation-duration:20.50s; width:30px; height:30px; }
.decor-bubbles span:nth-child(13){ left:250px; animation-delay:4.80s; animation-duration:10.00s; width:42px; height:42px; }
.decor-bubbles span:nth-child(14){ left:310px; animation-delay:5.20s; animation-duration:12.10s; width:54px; height:54px; }
.decor-bubbles span:nth-child(15){ left:370px; animation-delay:5.60s; animation-duration:14.20s; width:66px; height:66px; }
.decor-bubbles span:nth-child(16){ left:430px; animation-delay:6.00s; animation-duration:16.30s; width:18px; height:18px; }
.decor-bubbles span:nth-child(17){ left:10px; animation-delay:6.40s; animation-duration:18.40s; width:30px; height:30px; }
.decor-bubbles span:nth-child(18){ left:70px; animation-delay:6.80s; animation-duration:20.50s; width:42px; height:42px; }
.decor-bubbles span:nth-child(19){ left:130px; animation-delay:0.00s; animation-duration:10.00s; width:54px; height:54px; }
.decor-bubbles span:nth-child(20){ left:190px; animation-delay:0.40s; animation-duration:12.10s; width:66px; height:66px; }
.decor-bubbles span:nth-child(21){ left:250px; animation-delay:0.80s; animation-duration:14.20s; width:18px; height:18px; }
.decor-bubbles span:nth-child(22){ left:310px; animation-delay:1.20s; animation-duration:16.30s; width:30px; height:30px; }
.decor-bubbles span:nth-child(23){ left:370px; animation-delay:1.60s; animation-duration:18.40s; width:42px; height:42px; }
.decor-bubbles span:nth-child(24){ left:430px; animation-delay:2.00s; animation-duration:20.50s; width:54px; height:54px; }
.decor-bubbles span:nth-child(25){ left:10px; animation-delay:2.40s; animation-duration:10.00s; width:66px; height:66px; }
.decor-bubbles span:nth-child(26){ left:70px; animation-delay:2.80s; animation-duration:12.10s; width:18px; height:18px; }
.decor-bubbles span:nth-child(27){ left:130px; animation-delay:3.20s; animation-duration:14.20s; width:30px; height:30px; }
.decor-bubbles span:nth-child(28){ left:190px; animation-delay:3.60s; animation-duration:16.30s; width:42px; height:42px; }
.decor-bubbles span:nth-child(29){ left:250px; animation-delay:4.00s; animation-duration:18.40s; width:54px; height:54px; }
.decor-bubbles span:nth-child(30){ left:310px; animation-delay:4.40s; animation-duration:20.50s; width:66px; height:66px; }
.decor-bubbles span:nth-child(31){ left:370px; animation-delay:4.80s; animation-duration:10.00s; width:18px; height:18px; }
.decor-bubbles span:nth-child(32){ left:430px; animation-delay:5.20s; animation-duration:12.10s; width:30px; height:30px; }
.decor-bubbles span:nth-child(33){ left:10px; animation-delay:5.60s; animation-duration:14.20s; width:42px; height:42px; }
.decor-bubbles span:nth-child(34){ left:70px; animation-delay:6.00s; animation-duration:16.30s; width:54px; height:54px; }
.decor-bubbles span:nth-child(35){ left:130px; animation-delay:6.40s; animation-duration:18.40s; width:66px; height:66px; }
.decor-bubbles span:nth-child(36){ left:190px; animation-delay:6.80s; animation-duration:20.50s; width:18px; height:18px; }
.decor-bubbles-left span:nth-child(1){ left:10px; animation-delay:0.00s; animation-duration:10.00s; width:18px; height:18px; }
.decor-bubbles-left span:nth-child(2){ left:70px; animation-delay:0.40s; animation-duration:12.10s; width:30px; height:30px; }
.decor-bubbles-left span:nth-child(3){ left:130px; animation-delay:0.80s; animation-duration:14.20s; width:42px; height:42px; }
.decor-bubbles-left span:nth-child(4){ left:190px; animation-delay:1.20s; animation-duration:16.30s; width:54px; height:54px; }
.decor-bubbles-left span:nth-child(5){ left:250px; animation-delay:1.60s; animation-duration:18.40s; width:66px; height:66px; }
.decor-bubbles-left span:nth-child(6){ left:310px; animation-delay:2.00s; animation-duration:20.50s; width:18px; height:18px; }
.decor-bubbles-left span:nth-child(7){ left:370px; animation-delay:2.40s; animation-duration:10.00s; width:30px; height:30px; }
.decor-bubbles-left span:nth-child(8){ left:430px; animation-delay:2.80s; animation-duration:12.10s; width:42px; height:42px; }
.decor-bubbles-left span:nth-child(9){ left:10px; animation-delay:3.20s; animation-duration:14.20s; width:54px; height:54px; }
.decor-bubbles-left span:nth-child(10){ left:70px; animation-delay:3.60s; animation-duration:16.30s; width:66px; height:66px; }
.decor-bubbles-left span:nth-child(11){ left:130px; animation-delay:4.00s; animation-duration:18.40s; width:18px; height:18px; }
.decor-bubbles-left span:nth-child(12){ left:190px; animation-delay:4.40s; animation-duration:20.50s; width:30px; height:30px; }
.decor-bubbles-left span:nth-child(13){ left:250px; animation-delay:4.80s; animation-duration:10.00s; width:42px; height:42px; }
.decor-bubbles-left span:nth-child(14){ left:310px; animation-delay:5.20s; animation-duration:12.10s; width:54px; height:54px; }
.decor-bubbles-left span:nth-child(15){ left:370px; animation-delay:5.60s; animation-duration:14.20s; width:66px; height:66px; }
.decor-bubbles-left span:nth-child(16){ left:430px; animation-delay:6.00s; animation-duration:16.30s; width:18px; height:18px; }
.decor-bubbles-left span:nth-child(17){ left:10px; animation-delay:6.40s; animation-duration:18.40s; width:30px; height:30px; }
.decor-bubbles-left span:nth-child(18){ left:70px; animation-delay:6.80s; animation-duration:20.50s; width:42px; height:42px; }
.decor-bubbles-left span:nth-child(19){ left:130px; animation-delay:0.00s; animation-duration:10.00s; width:54px; height:54px; }
.decor-bubbles-left span:nth-child(20){ left:190px; animation-delay:0.40s; animation-duration:12.10s; width:66px; height:66px; }
.decor-bubbles-left span:nth-child(21){ left:250px; animation-delay:0.80s; animation-duration:14.20s; width:18px; height:18px; }
.decor-bubbles-left span:nth-child(22){ left:310px; animation-delay:1.20s; animation-duration:16.30s; width:30px; height:30px; }
.decor-bubbles-left span:nth-child(23){ left:370px; animation-delay:1.60s; animation-duration:18.40s; width:42px; height:42px; }
.decor-bubbles-left span:nth-child(24){ left:430px; animation-delay:2.00s; animation-duration:20.50s; width:54px; height:54px; }
.decor-bubbles-left span:nth-child(25){ left:10px; animation-delay:2.40s; animation-duration:10.00s; width:66px; height:66px; }
.decor-bubbles-left span:nth-child(26){ left:70px; animation-delay:2.80s; animation-duration:12.10s; width:18px; height:18px; }
.decor-bubbles-left span:nth-child(27){ left:130px; animation-delay:3.20s; animation-duration:14.20s; width:30px; height:30px; }
.decor-bubbles-left span:nth-child(28){ left:190px; animation-delay:3.60s; animation-duration:16.30s; width:42px; height:42px; }
.decor-bubbles-left span:nth-child(29){ left:250px; animation-delay:4.00s; animation-duration:18.40s; width:54px; height:54px; }
.decor-bubbles-left span:nth-child(30){ left:310px; animation-delay:4.40s; animation-duration:20.50s; width:66px; height:66px; }
.decor-bubbles-left span:nth-child(31){ left:370px; animation-delay:4.80s; animation-duration:10.00s; width:18px; height:18px; }
.decor-bubbles-left span:nth-child(32){ left:430px; animation-delay:5.20s; animation-duration:12.10s; width:30px; height:30px; }
.decor-bubbles-left span:nth-child(33){ left:10px; animation-delay:5.60s; animation-duration:14.20s; width:42px; height:42px; }
.decor-bubbles-left span:nth-child(34){ left:70px; animation-delay:6.00s; animation-duration:16.30s; width:54px; height:54px; }
.decor-bubbles-left span:nth-child(35){ left:130px; animation-delay:6.40s; animation-duration:18.40s; width:66px; height:66px; }
.decor-bubbles-left span:nth-child(36){ left:190px; animation-delay:6.80s; animation-duration:20.50s; width:18px; height:18px; }

/* v13: enforce NO tool images anywhere */
[class*="broom"], [class*="mop"], [class*="spray"], [class*="duster"], [id*="broom"], [id*="mop"], [id*="spray"], [id*="duster"]{
  background-image:none!important;
  content:none!important;
}

.site-header{
  background:transparent!important;
  border:none!important;
  box-shadow:none!important;
  position:sticky; top:0; z-index:3;
}
/* Ensure there is a single page-wide gradient behind everything */
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  background:
    radial-gradient(900px 600px at 15% 10%, rgba(40,199,192,.25), transparent 60%),
    radial-gradient(900px 600px at 85% 15%, rgba(40,199,192,.25), transparent 60%),
    radial-gradient(900px 600px at 15% 90%, rgba(40,199,192,.20), transparent 60%),
    radial-gradient(900px 600px at 85% 85%, rgba(40,199,192,.20), transparent 60%),
    linear-gradient(#f7fbfb, #f8fcfc);
  background-attachment: fixed, fixed, fixed, fixed, fixed;
}
/* Remove any top strip backgrounds that could create a seam */
.header-bg, .site-header::before, .site-header::after{
  background:none!important;
  box-shadow:none!important;
  border:none!important;
  content:none!important;
}
