/* Pair Spark Cleaning — clean, bright palette */
:root{
  --pink:#ff6ea8;
  --purple:#8a2be2;
  --mint:#e9fff3;
  --ink:#111322;
  --text:#2b2f42;
  --bg:#fffdfc;
  --card:#ffffff;
  --line:#f0e9ff;
}

*{box-sizing:border-box}

html,body{
  margin:0;
  padding:0;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,sans-serif;
  background:var(--bg);
  color:var(--text);
  line-height:1.5;
}

em{
  font-style:normal;
  color:var(--pink);
}

.wrap{
  max-width:1100px;
  margin:auto;
  padding:0 1.2rem;
}

/* Top bar */
.topbar{
  position:sticky;
  top:0;
  background:#fff;
  box-shadow:0 4px 16px rgba(0,0,0,.05);
  z-index:10;
}

.topbar .wrap{
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.brand{
  display:flex;
  align-items:center;
  gap:.6rem;
  font-size:1.1rem;
}

.brand span{
  color:var(--pink);
}

.spark{
  width:28px;
  height:28px;
  filter:drop-shadow(0 0 6px rgba(255,110,168,.9));
}

nav a{
  margin-left:1rem;
  text-decoration:none;
  color:var(--ink);
  font-weight:600;
}

/* Buttons */
.btn{
  background:var(--pink);
  color:white;
  padding:.8rem 1.1rem;
  border-radius:999px;
  text-decoration:none;
  display:inline-block;
  font-weight:700;
  border:2px solid var(--pink);
  cursor:pointer;
  transition:transform .12s ease, box-shadow .12s ease, background .12s ease, color .12s ease;
}

.btn.small{
  padding:.5rem .9rem;
}

.btn.outline{
  background:transparent;
  color:var(--pink);
}

.btn:hover{
  transform:translateY(-1px);
  box-shadow:0 8px 16px rgba(255,110,168,.3);
}

/* Emojis */
.emoji-lg{
  font-size:1.8em;
  line-height:0.9;
  display:inline-block;
  vertical-align:-0.1em;
}

.hero .emoji-lg{
  font-size:2.2em;
}

.contacts .emoji-lg{
  font-size:1.6em;
  margin-right:.35rem;
}

/* Hero */
.hero{
  padding:3rem 0 2rem;
  background:linear-gradient(180deg,#fff 0,#ffeef7 100%);
}

.hero-grid{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:2rem;
  align-items:center;
}

.hero-art img{
  width:100%;
  border-radius:20px;
  box-shadow:0 16px 48px rgba(0,0,0,.12);
}

h1{
  font-size:2.4rem;
  margin:.2rem 0 1rem;
  color:var(--ink);
}

h2{
  font-size:2rem;
  margin:0 0 1rem;
}

h3{
  margin-top:0;
}

.lead{
  opacity:.9;
}

.contacts{
  display:flex;
  gap:1.2rem;
  list-style:none;
  padding:0;
  margin:1rem 0 0;
}

.contacts a{
  font-weight:700;
}

.cta-row{
  display:flex;
  gap:.8rem;
  align-items:center;
  margin:.6rem 0 1rem;
}

/* Trust strip */
.trust-strip{
  margin:1rem 0 0;
  display:flex;
  flex-wrap:wrap;
  gap:.6rem;
}

.trust-strip div{
  background:rgba(255,255,255,.7);
  border-radius:999px;
  padding:.3rem .8rem;
  font-size:.85rem;
  border:1px solid rgba(255,255,255,.9);
}

/* About section */
.about{
  padding:2.5rem 0 3rem;
  background:#fff;
}

.about-grid{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:2rem;
  align-items:center;
}

.about-text p{
  margin-top:0;
}

.about-bullets{
  padding-left:1.1rem;
  margin:.3rem 0 0;
  font-size:.95rem;
}

.about-bullets li{
  margin-bottom:.25rem;
}

.about-art img{
  width:100%;
  max-width:420px;
  border-radius:18px;
  display:block;
  margin:0 auto;
  box-shadow:0 18px 40px rgba(0,0,0,.12);
}

/* Cards / services */
.cards{
  padding:3rem 0;
  background:var(--mint);
}

.cards.alt{
  background:#fff;
}

.grid-3{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1rem;
}

.card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:16px;
  padding:1.1rem;
  box-shadow:0 8px 24px rgba(0,0,0,.06);
}

.card.quote blockquote{
  margin:0 0 .6rem 0;
  font-style:italic;
}

/* How it works */
.how{
  padding:3rem 0;
}

.steps{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1rem;
}

.step{
  background:#fff;
  border:1px dashed var(--line);
  border-radius:16px;
  padding:1rem;
  display:flex;
  align-items:center;
  gap:.8rem;
}

.step span{
  background:var(--purple);
  color:#fff;
  display:inline-grid;
  place-items:center;
  width:32px;
  height:32px;
  border-radius:50%;
}

/* Areas */
.areas{
  padding:3rem 0;
}

.areas-img{
  width:100%;
  max-width:520px;
  border-radius:16px;
  display:block;
  margin:1rem auto;
  box-shadow:0 12px 36px rgba(0,0,0,.12);
}

/* FAQ */
.faq{
  padding:3rem 0;
  background:#fff;
}

details{
  background:#faf7ff;
  border:1px solid var(--line);
  padding:1rem;
  border-radius:12px;
  margin:.6rem 0;
}

/* Checklist */
.checklist{
  padding:3rem 0;
  background:var(--mint);
}

/* Contact / quote */
.contact{
  padding:3rem 0;
}

form.quote{
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  padding:1.2rem;
  box-shadow:0 10px 30px rgba(0,0,0,.08);
}

.form-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1rem;
}

label{
  display:flex;
  flex-direction:column;
  font-weight:700;
  font-size:.9rem;
}

input,select{
  margin-top:.3rem;
  padding:.7rem;
  border-radius:10px;
  border:1px solid #ddd;
}

textarea{
  margin-top:.3rem;
  padding:.7rem;
  border-radius:10px;
  border:1px solid #ddd;
  resize:vertical;
  min-height:90px;
}

.small{
  font-size:.9rem;
  opacity:.9;
}

/* Quote layout + summary */
.quote-layout{
  display:grid;
  grid-template-columns:minmax(0,2fr) minmax(0,1.1fr);
  gap:1.4rem;
  align-items:flex-start;
}

.quote-summary-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  padding:1.1rem;
  box-shadow:0 10px 30px rgba(0,0,0,.08);
  position:sticky;
  top:96px;
}

.big-price{
  font-size:1.9rem;
  font-weight:800;
  margin:.2rem 0 .4rem;
}

/* Extras */
.extras-group{
  margin:1rem 0 0;
  border:none;
  padding:0;
}

.extras-group legend{
  font-weight:700;
  margin-bottom:.4rem;
}

.extras-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.4rem .8rem;
  font-size:.9rem;
}

.extras-grid label{
  font-weight:500;
  display:flex;
  align-items:center;
  gap:.35rem;
}

/* Honeypot (hidden from humans, visible to bots) */
.hp{
  position:absolute;
  left:-5000px;
  opacity:0;
  height:0;
  width:0;
  overflow:hidden;
}

#quote-status{
  margin-top:.4rem;
}

/* CTA banner */
.cta-banner{
  padding:3rem 0 3.2rem;
  background:linear-gradient(135deg,#ffeef7 0,#e9fff3 100%);
}

.cta-banner-inner{
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:1.5rem;
  align-items:center;
}

.cta-banner-img img{
  width:100%;
  max-width:520px;
  border-radius:18px;
  box-shadow:0 18px 40px rgba(0,0,0,.16);
}

.cta-banner-text h2{
  margin-top:0;
}

.cta-banner-text p{
  margin:.4rem 0 1rem;
}

/* Footer */
.footer{
  padding:2rem 0;
  background:#111;
  color:#fafafa;
}

.footer a{
  color:#fff;
}

.footgrid{
  display:grid;
  grid-template-columns:2fr 1fr;
  gap:1rem;
}

.tiny{
  font-size:.8rem;
  text-align:center;
  opacity:.7;
  margin:.8rem 0 0;
}

/* Responsive */
@media (max-width: 900px){
  .hero-grid,
  .about-grid,
  .grid-3,
  .steps,
  .form-grid,
  .footgrid,
  .quote-layout,
  .cta-banner-inner{
    grid-template-columns:1fr;
  }

  .topbar nav a{
    margin-left:.6rem;
  }

  .hero{
    padding-top:1.6rem;
  }

  .hero-art img,
  .about-art img,
  .cta-banner-img img{
    max-width:100%;
  }

  .quote-summary-card{
    position:static;
  }

  .trust-strip{
    gap:.4rem;
  }
}