/*
Theme Name: Elite Concrete
Theme URI: https://eliteconcretesav.com
Author: Elite Concrete
Description: Custom theme for Elite Concrete, built from client wireframes. Black/white concrete-contractor design with a sticky header, hero sections, services, projects grid, and a full quote-request form.
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: elite-concrete
*/

:root{
  --ec-black:#151515;
  --ec-near-black:#1a1a1a;
  --ec-dark-gray:#3a3d42;
  --ec-mid-gray:#6b6f76;
  --ec-line-gray:#c9c9c9;
  --ec-body-gray:#4a4a4a;
  --ec-bg-light:#f4f4f2;
  --ec-white:#ffffff;
  --ec-max:1280px;
  --ec-gap:24px;
  font-size:16px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:"Inter","Helvetica Neue",Arial,sans-serif;
  color:var(--ec-body-gray);
  background:var(--ec-white);
  -webkit-font-smoothing:antialiased;
  line-height:1.55;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
.ec-wrap{max-width:var(--ec-max);margin:0 auto;padding:0 32px;}
h1,h2,h3,h4{
  font-family:"Archivo Black","Arial Black",Arial,sans-serif;
  color:var(--ec-black);
  line-height:1.08;
  margin:0 0 14px;
  letter-spacing:-0.01em;
}
p{margin:0 0 16px;}
.ec-eyebrow{
  font-size:12px;
  font-weight:700;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--ec-mid-gray);
  margin-bottom:8px;
  display:block;
}
.ec-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:14px 26px;
  background:var(--ec-black);
  color:var(--ec-white);
  font-weight:700;
  font-size:13px;
  letter-spacing:0.06em;
  text-transform:uppercase;
  border:none;
  cursor:pointer;
  transition:opacity .15s ease;
}
.ec-btn:hover{opacity:.82;color:var(--ec-white);}
.ec-link-underline{
  font-weight:700;
  font-size:13px;
  letter-spacing:0.04em;
  text-transform:uppercase;
  border-bottom:2px solid currentColor;
  padding-bottom:3px;
}

/* ---------- Header ---------- */
.ec-header{
  border-bottom:1px solid #ececec;
  background:var(--ec-white);
  position:sticky;
  top:0;
  z-index:50;
}
.ec-header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:18px 32px;
  max-width:var(--ec-max);
  margin:0 auto;
  gap:24px;
}
.ec-logo{display:flex;align-items:center;gap:12px;}
.ec-logo-text{line-height:1.1;}
.ec-logo-text strong{
  display:block;
  font-family:"Archivo Black",Arial,sans-serif;
  font-size:15px;
  letter-spacing:0.02em;
  color:var(--ec-black);
}
.ec-logo-text span{
  display:block;
  font-size:9px;
  letter-spacing:0.18em;
  color:var(--ec-mid-gray);
  text-transform:uppercase;
  margin-top:2px;
}
.ec-nav{display:flex;align-items:center;gap:34px;}
.ec-nav a{
  font-size:13px;
  font-weight:700;
  letter-spacing:0.03em;
  text-transform:uppercase;
  color:var(--ec-black);
  padding-bottom:22px;
  border-bottom:2px solid transparent;
}
.ec-nav a.is-active,.ec-nav a.current-menu-item{border-bottom-color:var(--ec-black);}
.ec-header-cta{display:flex;align-items:center;gap:24px;}
.ec-quote-btn{
  background:var(--ec-mid-gray);
  color:var(--ec-white);
  padding:11px 22px;
  font-size:12px;
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
}
.ec-nav-toggle{display:none;background:none;border:none;cursor:pointer;}
@media (max-width:960px){
  .ec-nav.is-open{
    display:flex;
    flex-direction:column;
    position:absolute;
    top:100%;left:0;right:0;
    background:#fff;
    padding:10px 32px 24px;
    border-bottom:1px solid #ececec;
    gap:4px;
  }
  .ec-nav.is-open a{padding:12px 0;border-bottom:1px solid #f0f0f0;}
  .ec-header-inner{position:relative;}
}

/* ---------- Hero ---------- */
.ec-hero{display:grid;grid-template-columns:1fr 1fr;}
.ec-hero-copy{
  background:var(--ec-hero-bg,var(--ec-bg-light));
  color:var(--ec-hero-color,var(--ec-black));
  padding:80px 60px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.ec-hero-copy h1{font-size:clamp(38px,4.6vw,58px);color:var(--ec-hero-color,var(--ec-black));}
.ec-hero-copy p{max-width:420px;color:var(--ec-hero-color,var(--ec-body-gray));opacity:.9;font-size:15px;}
.ec-hero-rule{width:100%;max-width:340px;border:none;border-top:1px solid currentColor;opacity:.35;margin:26px 0 22px;}
.ec-hero-actions{display:flex;align-items:center;gap:30px;}
.ec-hero-photo{min-height:420px;background-size:cover;background-position:center;}
.ec-hero--dark{--ec-hero-bg:#2f3237;--ec-hero-color:#ffffff;}
.ec-hero--darker{--ec-hero-bg:#1a1a1a;--ec-hero-color:#ffffff;}
.ec-hero--slate{--ec-hero-bg:#565a60;--ec-hero-color:#ffffff;}

/* ---------- Trust badges ---------- */
.ec-badges{border-bottom:1px solid #ececec;}
.ec-badges-inner{max-width:var(--ec-max);margin:0 auto;padding:34px 32px;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.ec-badge{display:flex;align-items:flex-start;gap:14px;padding-left:20px;border-left:1px solid #e4e4e4;}
.ec-badge:first-child{border-left:none;padding-left:0;}
.ec-badge svg{flex:0 0 auto;margin-top:2px;}
.ec-badge strong{display:block;font-size:13px;letter-spacing:0.03em;text-transform:uppercase;color:var(--ec-black);margin-bottom:4px;}
.ec-badge span{font-size:13px;color:var(--ec-mid-gray);}

/* ---------- Sections ---------- */
.ec-section{padding:88px 0;}
.ec-section-tight{padding:56px 0;}
.ec-section-alt{background:var(--ec-bg-light);}
.ec-section-head{max-width:640px;margin-bottom:52px;}
.ec-section-head h2{font-size:clamp(30px,3.4vw,42px);}

.ec-service-row{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;margin-bottom:80px;}
.ec-service-row:last-child{margin-bottom:0;}
.ec-service-row.is-reverse .ec-service-photo{order:2;}
.ec-service-row.is-reverse .ec-service-copy{order:1;}
.ec-service-photo img{width:100%;height:340px;object-fit:cover;}
.ec-service-copy .ec-eyebrow{margin-bottom:12px;}
.ec-service-copy h3{font-size:26px;margin-bottom:10px;}
.ec-service-copy p{font-size:15px;max-width:420px;}
.ec-service-copy .ec-link-underline{margin-top:6px;display:inline-block;}

.ec-strip-head{display:flex;align-items:baseline;justify-content:space-between;border-top:1px solid #e2e2e2;padding-top:34px;margin-bottom:26px;}
.ec-strip-head .ec-eyebrow{margin:0;}
.ec-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;}
.ec-strip img{width:100%;height:170px;object-fit:cover;}

.ec-filters{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:44px;}
.ec-filter{padding:11px 20px;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:0.03em;color:var(--ec-black);background:transparent;border:1px solid transparent;cursor:pointer;}
.ec-filter.is-active{background:var(--ec-black);color:#fff;}
.ec-project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px 28px;}
.ec-project-card img{width:100%;height:230px;object-fit:cover;margin-bottom:18px;}
.ec-project-card h3{font-size:19px;margin-bottom:8px;}
.ec-project-card a{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:0.03em;display:inline-flex;gap:6px;align-items:center;}

.ec-values-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;}
.ec-value{padding-left:28px;border-left:1px solid #ddd;text-align:left;}
.ec-value:first-child{border-left:none;padding-left:0;}
.ec-value svg{margin-bottom:16px;}
.ec-value h4{font-size:13px;text-transform:uppercase;letter-spacing:0.04em;margin-bottom:8px;}
.ec-value p{font-size:14px;margin:0;}

.ec-team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;margin-top:44px;}
.ec-team-card{text-align:left;}
.ec-team-photo{width:100%;aspect-ratio:4/3;background:var(--ec-bg-light);border:1px dashed #cfcfcf;margin-bottom:14px;display:flex;align-items:center;justify-content:center;color:#b7b7b7;font-size:12px;text-transform:uppercase;letter-spacing:0.08em;}
.ec-team-card strong{display:block;font-size:14px;color:var(--ec-black);text-transform:uppercase;letter-spacing:0.03em;}
.ec-team-card span{font-size:13px;color:var(--ec-mid-gray);}

.ec-story{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;}
.ec-story img{width:100%;height:340px;object-fit:cover;}
.ec-story h2{font-size:clamp(26px,3vw,36px);}
.ec-story p{font-size:15px;}

.ec-quote-intro{display:grid;grid-template-columns:1fr 1fr;border:1px solid #ececec;}
.ec-quote-copy{padding:56px;}
.ec-quote-copy h2{font-size:clamp(28px,3vw,36px);}
.ec-quote-benefit{display:flex;gap:14px;margin-bottom:22px;}
.ec-quote-benefit svg{flex:0 0 auto;margin-top:2px;}
.ec-quote-benefit strong{display:block;font-size:13px;text-transform:uppercase;letter-spacing:0.03em;color:var(--ec-black);margin-bottom:2px;}
.ec-quote-benefit p{font-size:13px;margin:0;color:var(--ec-mid-gray);}
.ec-quote-photo{background-size:cover;background-position:center;min-height:280px;}

.ec-form-title{text-align:center;text-transform:uppercase;letter-spacing:0.1em;font-size:13px;font-weight:700;color:var(--ec-black);margin:0 0 30px;}
.ec-form{display:grid;grid-template-columns:1fr 1fr;gap:26px 40px;}
.ec-field{display:flex;flex-direction:column;gap:8px;}
.ec-field.ec-field-full{grid-column:1/-1;}
.ec-field label{font-size:11px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ec-black);}
.ec-field input,.ec-field select,.ec-field textarea{border:1px solid #d8d8d8;padding:13px 14px;font-size:14px;font-family:inherit;color:var(--ec-body-gray);background:#fff;}
.ec-field textarea{resize:vertical;min-height:120px;}
.ec-consent{grid-column:1/-1;display:flex;align-items:flex-start;gap:10px;font-size:13px;color:var(--ec-mid-gray);}
.ec-form-submit{grid-column:1/-1;text-align:left;}

/* ---------- Footer ---------- */
.ec-footer{background:var(--ec-black);color:#c9c9c9;padding:64px 0 34px;}
.ec-footer-top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1fr;gap:32px;padding-bottom:44px;}
.ec-footer-brand .ec-logo-text strong{color:#fff;}
.ec-footer-brand p{font-size:12.5px;color:#8f8f8f;margin-top:14px;max-width:220px;}
.ec-footer-social{display:flex;gap:10px;margin-top:18px;}
.ec-footer-social a{width:32px;height:32px;border-radius:50%;border:1px solid #4a4a4a;display:flex;align-items:center;justify-content:center;}
.ec-footer h5{color:#fff;font-size:12px;letter-spacing:0.08em;text-transform:uppercase;margin:0 0 16px;padding-bottom:10px;border-bottom:1px solid #333;}
.ec-footer ul{list-style:none;margin:0;padding:0;}
.ec-footer li{margin-bottom:11px;font-size:13px;}
.ec-footer li a:hover{color:#fff;}
.ec-footer-contact li{display:flex;gap:10px;align-items:flex-start;font-size:13px;}
.ec-footer-contact svg{flex:0 0 auto;margin-top:3px;}
.ec-footer-bottom{border-top:1px solid #2c2c2c;padding-top:22px;font-size:12px;color:#7c7c7c;display:flex;justify-content:space-between;}

/* ---------- Responsive ---------- */
@media (max-width:960px){
  .ec-hero,.ec-story,.ec-quote-intro,.ec-service-row{grid-template-columns:1fr;}
  .ec-service-row.is-reverse .ec-service-photo,.ec-service-row.is-reverse .ec-service-copy{order:initial;}
  .ec-badges-inner,.ec-values-grid,.ec-team-grid{grid-template-columns:repeat(2,1fr);}
  .ec-project-grid{grid-template-columns:repeat(2,1fr);}
  .ec-strip{grid-template-columns:repeat(3,1fr);}
  .ec-footer-top{grid-template-columns:repeat(2,1fr);}
  .ec-nav{display:none;}
  .ec-nav-toggle{display:block;}
  .ec-form{grid-template-columns:1fr;}
}
@media (max-width:600px){
  .ec-strip{grid-template-columns:repeat(2,1fr);}
  .ec-project-grid{grid-template-columns:1fr;}
  .ec-values-grid,.ec-team-grid{grid-template-columns:1fr;}
  .ec-badges-inner{grid-template-columns:1fr;}
  .ec-badge{border-left:none;padding-left:0;}
  .ec-hero-copy{padding:56px 28px;}
}
