/* About */
.about-grid{display:grid;gap:28px}
.about-grid img{border-radius:var(--radius);width:100%;height:320px;object-fit:cover}

/* Services */
.services{background:var(--light)}
.cards{display:grid;gap:18px;margin-top:1.5rem}
.card{
  background:var(--white);border-radius:var(--radius);padding:24px;
  border-top:4px solid var(--yellow);box-shadow:0 2px 10px rgba(0,0,0,.06);
  display:flex;flex-direction:column;
}
.card h3{font-size:1.2rem;margin-bottom:.5rem}
.card p{color:var(--gray);margin-bottom:1rem;flex:1}
.card a.more{font-weight:800;color:var(--dark);text-decoration:none;border-bottom:2px solid var(--yellow)}
.card a.more:hover{color:var(--yellow-dark)}

/* Gallery */
.gallery-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:1.5rem}
.gallery-grid img{border-radius:var(--radius);width:100%;aspect-ratio:3/4;object-fit:cover}

/* CTA banner */
.cta-banner{background:var(--dark);color:var(--white);text-align:center}
.cta-banner h2{color:var(--white)}
.cta-banner p{color:#c9ccd0;max-width:520px;margin:0 auto 1.5rem}
.cta-banner .btn{width:100%;max-width:340px}

/* Form */
.contact{background:var(--light)}
form{max-width:520px;margin-top:1.25rem}
label{display:block;font-weight:700;margin-bottom:.35rem;margin-top:1rem}
input,textarea{
  width:100%;font-size:16px;padding:13px 14px;border:1px solid #c6c9cd;
  border-radius:var(--radius);background:var(--white);font-family:inherit;
}
input:focus,textarea:focus{outline:2px solid var(--yellow);border-color:var(--yellow)}
textarea{min-height:120px;resize:vertical}
form .btn{width:100%;margin-top:1.25rem}
.form-note{color:var(--gray);font-size:.9rem;margin-top:.75rem}

/* Form status messages */
.form-success{
  background:#e8f5e9;border-left:4px solid #2e7d32;border-radius:4px;
  padding:16px 18px;margin-top:1.25rem;max-width:520px;font-weight:600;
}
.form-error{
  background:#fdecea;border-left:4px solid #c0392b;border-radius:4px;
  padding:16px 18px;margin-top:1.25rem;max-width:520px;font-weight:600;
}

/* Content pages */
.page-hero{background:var(--dark);color:var(--white);padding:48px 0 56px}
.page-hero h1{font-size:1.9rem;max-width:720px}
.page-hero p{color:#c9ccd0;margin-top:.75rem;max-width:640px}
.check-list{list-style:none;margin-top:1rem}
.check-list li{padding:8px 0 8px 28px;position:relative}
.check-list li::before{content:"\2713";position:absolute;left:0;color:var(--yellow-dark);font-weight:800}

/* FAQ */
details{border-bottom:1px solid #d9dbde;padding:14px 0}
summary{font-weight:800;cursor:pointer;font-size:1.02rem}
details p{margin-top:.6rem;color:var(--gray)}

/* Service area */
.area-grid{display:grid;gap:28px}
.city-list{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:1rem}
.city-list li{background:var(--light);border-left:4px solid var(--yellow);padding:10px 14px;font-weight:700;border-radius:4px}
.city-list li a{text-decoration:none}
.info-box{background:var(--dark);color:var(--white);border-radius:var(--radius);padding:26px}
.info-box h3{color:var(--yellow);margin-bottom:.5rem;font-size:1.05rem;text-transform:uppercase;letter-spacing:.05em}
.info-box p{color:#d6d8db;margin-bottom:1.1rem}
.info-box a{color:var(--white)}

/* Footer */
footer{background:var(--dark);color:#b7bac0;padding:48px 0 110px}
footer .foot-grid{display:grid;gap:28px}
footer img{height:70px;width:auto;margin-bottom:.75rem}
footer h4{color:var(--white);margin-bottom:.6rem;font-size:1rem}
footer ul{list-style:none}
footer li{margin-bottom:.4rem}
footer a{color:#b7bac0;text-decoration:none}
footer a:hover{color:var(--yellow)}
footer .foot-call{display:inline-block;background:var(--yellow);color:var(--dark);font-weight:800;text-decoration:none;padding:12px 20px;border-radius:var(--radius);margin-top:.5rem}
footer .copy{margin-top:2rem;font-size:.85rem;border-top:1px solid #3a3e44;padding-top:1.25rem}
footer .built-by{margin-top:.4rem;font-size:.8rem;color:#8b9096}
footer .built-by a{color:var(--yellow-dark);text-decoration:none;font-weight:600}
footer .built-by a:hover{color:var(--yellow);text-decoration:underline}

/* Reviews */
.reviews-grid{display:grid;gap:18px;margin-top:1.5rem}
.review{
  background:#fff;border:1px solid #e6e8ea;border-radius:var(--radius);
  border-top:4px solid var(--yellow);box-shadow:0 2px 10px rgba(0,0,0,.06);
  padding:22px;display:flex;flex-direction:column;
}
.review .stars{color:var(--yellow-dark);font-size:1rem;letter-spacing:2px;margin-bottom:.6rem}
.review p{color:var(--dark);flex:1;margin-bottom:1rem}
.review .who{font-weight:800;color:var(--gray);font-size:.95rem}
.reviews-cta{margin-top:1.5rem;font-weight:800}

@media (min-width:768px){
  .reviews-grid{grid-template-columns:1fr 1fr}
  .about-grid{grid-template-columns:1fr 1fr;align-items:center}
  .about-grid img{height:420px}
  .cards{grid-template-columns:1fr 1fr}
  .gallery-grid{grid-template-columns:repeat(4,1fr)}
  .area-grid{grid-template-columns:1.2fr 1fr;align-items:start}
  footer{padding-bottom:48px}
  footer .foot-grid{grid-template-columns:1.4fr 1fr 1fr}
  .cta-banner .btn{width:auto}
  .page-hero h1{font-size:2.5rem}
}
@media (min-width:1024px){
  .cards{grid-template-columns:repeat(4,1fr)}
  .reviews-grid{grid-template-columns:repeat(3,1fr)}
}
