/* Modern, clean styles */
:root{
  --accent:#2b6cb0;
  --muted:#6b7280;
  --bg:#f7fafc;
  --card:#ffffff;
  --radius:10px;
}
*{box-sizing:border-box}
body{font-family:Inter,Segoe UI,Arial,Helvetica,sans-serif;margin:0;color:#111;background:var(--bg);line-height:1.5}
.container{max-width:1000px;margin:0 auto;padding:1rem}
.site-header{background:rgba(221, 222, 224, 0.925);padding:1rem 0;position:relative;z-index:10;backdrop-filter:blur(6px);box-shadow:0 1px 0 rgba(15,23,42,0.06)}
.site-header .container{display:flex;align-items:center;justify-content:space-between}
.logo{font-weight:700;color:#111;text-decoration:none}
.logo-name{font-family:'Parisienne',cursive;font-size:1.8rem;font-weight:400}
nav a{margin-left:1rem;color:var(--muted);text-decoration:none}
nav a:hover{color:var(--accent)}
.hero{min-height:56vh;background:#7C7E81;display:flex;align-items:center;position:relative}
.hero-overlay{position:absolute;inset:0;background:transparent;z-index:0}
.hero-layout{position:relative;z-index:1;display:flex;align-items:stretch;width:100%;min-height:56vh}
.hero-image{display:block;align-self:stretch;width:32%;max-width:380px;flex:0 0 32%;object-fit:contain}
.hero-content{position:relative;flex:1;min-width:0;color:#fff;padding:2.5rem clamp(1rem,5vw,4rem);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:0.6rem}
/* Slightly larger hero paragraph for emphasis */
.hero-content p{font-size:1.125rem;line-height:1.4;margin:.35rem 0 0}
.btn{background:var(--accent);color:#fff;padding:.6rem 1rem;border-radius:8px;text-decoration:none}
.btn.ghost{background:transparent;border:1px solid rgba(255,255,255,0.3)}
.intro{padding:3rem 0}
.gallery .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem}
.gallery figure{margin:0;text-align:center}
.gallery figcaption{padding:.4rem 0;color:var(--muted);font-size:.9rem}
.gallery img{width:100%;height:auto;max-height:260px;object-fit:contain;border-radius:8px;background:#f3f4f6}
.services-list{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem}
.services-list li{background:var(--card);padding:1rem;border-radius:var(--radius);box-shadow:0 4px 12px rgba(15,23,42,0.06)}
.price{font-weight:700;color:var(--accent)}
.contact-page form{display:grid;gap:.6rem}
.contact-page input,.contact-page textarea{padding:.6rem;border-radius:8px;border:1px solid #e6e9ee}
/* Reviews removed */
.contact-section p{margin-top:0}
.contact-grid{display:grid;grid-template-columns:1fr 320px;gap:1.5rem;align-items:start}
.contact-form{display:grid;gap:.7rem}
.contact-form .two-cols{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
.contact-form label{font-size:.95rem;color:var(--muted)}
.contact-form input,.contact-form textarea{padding:.75rem;border-radius:8px;border:1px solid #e6e9ee}
/* file inputs removed */
.contact-section{padding:2rem 0}

.contact-section h2{font-weight:700}

/* Make the contact area look like the (previous) review cards */
.contact-form{background:var(--card);padding:1rem;border-radius:12px;box-shadow:0 6px 18px rgba(15,23,42,0.06)}
.contact-form .form-actions{background:transparent;padding-top:.25rem}
.contact-info .card{border-radius:12px}
.form-actions{display:flex;gap:.6rem;align-items:center;margin-top:.6rem}
.card{background:var(--card);padding:1rem;border-radius:12px;box-shadow:0 8px 24px rgba(15,23,42,0.06);margin-top:1rem;text-align:center}
.contact-info .card{border-radius:12px}
.contact-info .card h3{margin-top:0}
.contact-info a{color:var(--accent);text-decoration:none}
.contact-info p{margin:.25rem 0}
.contact-section .btn{min-width:unset}
.contact-form .btn{padding:.6rem 1rem}

.contact-form input:focus,.contact-form textarea:focus{outline:none;box-shadow:0 0 0 3px rgba(43,108,176,0.12);border-color:var(--accent)}

.site-footer{padding:2rem 0;background:transparent;text-align:center;color:var(--muted)}
/* Feedback messages for contact form */
.form-feedback{transition:opacity .2s,transform .2s;opacity:0;transform:translateY(-6px);margin-top:.6rem}
.form-feedback.visible{opacity:1;transform:none}
.form-success{color:green}
.form-error{color:#b91c1c}
@media(max-width:700px){
  .site-header .container{flex-direction:column;align-items:stretch;gap:.5rem}
  .logo{max-width:100%;font-size:.95rem}
  nav{display:flex;flex-wrap:wrap;gap:.25rem .85rem}
  nav a{margin:0;padding:.35rem 0}
  .hero{min-height:44vh}
  .hero-layout{min-height:44vh}
  .hero-image{width:30%;flex-basis:30%;min-width:90px}
  .hero-content{padding:1.5rem .75rem;gap:.45rem}
  .hero-content h1{font-size:1.55rem;line-height:1.2}
  .hero-content p{font-size:1rem}
  .gallery .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
  .gallery img{max-height:220px}
  .contact-grid{grid-template-columns:1fr;}
  .contact-info{order:2}
}
@media(max-width:380px){
  .container{padding:.75rem}
  .hero-image{width:27%;flex-basis:27%;min-width:76px}
  .hero-content{padding:1.25rem .6rem}
  .hero-content h1{font-size:1.35rem}
  .gallery .grid{gap:.5rem}
  .gallery figcaption{font-size:.8rem}
}