/* El Parcero Painting — Main Styles */
:root{
  --navy: #001F3F; /* Deep Navy Blue */
  --cool-gray: #4B4E6D;
  --white: #FFFFFF;
  --light-blue: #E6F0FA;
  --max-width: 1600px;
  --gap: 1.25rem;
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
  color:#222;
  background: linear-gradient(180deg, var(--light-blue) 0%, #FFFFFF 100%);
  -webkit-font-smoothing:antialiased;
}
.site-root{display:flex;flex-direction:column;min-height:100vh}
.header{
  background:var(--navy);
  color:var(--white);
  padding:1.25rem 1rem;
}
.container{max-width:var(--max-width);margin:0 auto;padding:0 1rem}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--gap)}
.brand{font-weight:700;letter-spacing:0.5px}
.nav a{color:var(--white);text-decoration:none;margin-left:1rem;font-weight:600}
.hero{padding:4rem 0;text-align:left;flex:1;display:flex;align-items:center}
.hero-card{background:var(--white);border-radius:12px;box-shadow:0 6px 30px rgba(31,41,55,0.08);padding:2.25rem;display:flex;align-items:center;gap:2rem;width:100%;max-width:1400px;margin:0 auto}
.hero-content{flex:1}
.hero h1{margin:0 0 .5rem;font-size:2rem;color:var(--navy)}
.hero p.lead{margin:0 0 1rem;color:#444;font-size:1.125rem}
.cta{display:inline-flex;align-items:center;gap:.75rem;background:var(--navy);color:var(--white);padding:.75rem 1rem;border-radius:8px;text-decoration:none;font-weight:700}
.phone{font-size:1.125rem}
.services{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem;margin-top:1.25rem}
.card{background:var(--white);padding:1rem;border-radius:10px;box-shadow:0 6px 18px rgba(31,41,55,0.06)}
.footer{background:var(--cool-gray);color:var(--white);padding:1.25rem 1.5rem;margin-top:2rem;border-radius:6px;box-shadow:0 6px 20px rgba(31,41,55,0.08);max-width:1200px;margin-left:auto;margin-right:auto}
@media (max-width:700px){
  .hero-card{flex-direction:column;text-align:center}
  .nav a{margin-left:.5rem}
  .header-inner{flex-direction:column;align-items:flex-start}
}

/* Why Choose section */
.why-section{padding:3rem 0;background:transparent}
.why-inner{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center}
.why-left h2{margin:0 0 .75rem;font-size:1.75rem;color:var(--navy)}
.why-left p{color:#444;line-height:1.6}
.why-grid{display:grid;grid-template-columns:repeat(1,1fr);gap:1rem}
.why-card{background:var(--white);padding:1rem;border-radius:10px;box-shadow:0 6px 18px rgba(31,41,55,0.06)}
.why-card .icon {
  color: var(--navy);
  font-size: 28px;
  display: block;
  margin: 0 auto 0.45rem auto;
}
.svg-icon { width: 28px; height: 28px; }
.why-card h4{margin:0 0 .5rem;color:var(--navy)}
@media (min-width:900px){
  .why-inner{grid-template-columns:1fr 1fr}
  .why-grid{grid-template-columns:repeat(2,1fr)}
}

/* footer icons color */
.footer .icon{color:var(--white);width:1rem;height:1rem}

/* Footer expanded columns */
.footer-content{display:flex;flex-direction:column;gap:1rem;align-items:center}
.footer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;width:100%;align-items:start}
.footer-col h4{margin:0 0 .5rem;color:var(--white);font-size:1rem}
.footer-col p, .footer-col li, .footer-col a{color:var(--white);font-size:0.95rem}
.footer-col ul{padding-left:18px;margin:0}
/* remove bullets but keep indentation for service lists and footer lists */
.card ul, .footer-col ul { list-style: none; padding-left: 18px; margin: 0; }
.footer-small{font-size:0.85rem;opacity:0.95;margin-top:.5rem}
@media (max-width:800px){
  .footer-grid{grid-template-columns:1fr}
  .footer{max-width:100%;border-radius:6px;padding:1rem}
}

/* Icons */
.icon{display:inline-block;width:1.5rem;height:1.5rem;margin-right:.5rem;text-align:center}
.why-card .icon{width:2rem;height:2rem;margin-bottom:.5rem;color:var(--navy)}
.cta .icon{width:1.1rem;height:1.1rem;margin-right:.5rem}
.services-summary .card h3 .icon{margin-right:.5rem}