/*
Theme Name: Marysville Concrete Pro Child
Template: astra
Version: 1.0.0
*/

:root {
  --mcp-navy: #183a4a;
  --mcp-green: #2f6f5e;
  --mcp-mist: #edf5f2;
  --mcp-sand: #f4f0e8;
  --mcp-ink: #1d2b31;
  --mcp-orange: #c65d2e;
}

body { color: var(--mcp-ink); }
.site-header .site-title a, .main-header-menu > .menu-item > .menu-link { color: var(--mcp-navy); }
.site-header .site-title a { font-weight: 800; letter-spacing: -.02em; }
.mcp-page { max-width: 1200px; margin: 0 auto; padding: 0 24px 56px; }
.mcp-page section { margin: 44px 0; }
.mcp-page h1, .mcp-page h2, .mcp-page h3 { color: var(--mcp-navy); }
.mcp-page h1 { font-size: clamp(2.2rem, 5vw, 4.5rem); line-height: 1.04; margin-bottom: 20px; }
.mcp-page h2 { font-size: clamp(1.65rem, 3vw, 2.45rem); }
.mcp-page p, .mcp-page li { font-size: 1.05rem; line-height: 1.75; }
.hero { position: relative; overflow: hidden; padding: clamp(48px, 7vw, 88px); border-radius: 0 0 28px 28px; background: linear-gradient(115deg, rgba(17,48,59,.94), rgba(26,78,70,.78)), url('/wp-content/uploads/2026/07/marysville-driveway-hero.jpg') center/cover; color: #fff; margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important; padding-left: max(24px, calc((100vw - 1120px)/2)); padding-right: max(24px, calc((100vw - 1120px)/2)); }
.hero h1, .hero p { color: #fff; max-width: 760px; }
.hero-sub { font-size: 1.25rem !important; }
.cta-row { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 26px; }
.btn { display: inline-block; padding: 14px 22px; border-radius: 5px; font-weight: 800; text-decoration: none; transition: transform .2s ease, background .2s ease; }
.btn:hover { transform: translateY(-2px); }
.btn-call { color: #fff; background: var(--mcp-orange); }
.btn-quote { color: var(--mcp-navy); background: #fff; }
.trust-bar { background: var(--mcp-sand); padding: 20px 28px; border-radius: 12px; }
.trust-items { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; list-style: none; margin: 0; padding: 0; font-weight: 700; }
.trust-items li { font-size: .95rem; line-height: 1.35; }
.service-overview h3 { border-top: 1px solid #d9e3de; margin: 0; padding: 18px 0 0; }
.service-overview h3 a { color: var(--mcp-green); }
.service-overview h3 + p { margin-top: 5px; }
.why-choose-us, .how-it-works { background: var(--mcp-mist); padding: clamp(28px, 5vw, 54px); border-radius: 18px; }
.priority-cards, .services-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.card, .service-card { background: #fff; padding: 26px; border: 1px solid #d8e7e1; border-radius: 12px; box-shadow: 0 10px 22px rgba(23,56,54,.06); }
.service-card h2 { font-size: 1.25rem; margin-top: 0; }
.service-card a { color: var(--mcp-green); }
.faq-item { border-bottom: 1px solid #d9e3de; padding: 14px 0; }
.final-cta { padding: clamp(30px, 5vw, 56px); background: var(--mcp-navy); border-radius: 18px; }
.final-cta h2, .final-cta p, .final-cta a:not(.btn) { color: #fff; }
.gallery-grid figure { margin: 18px 0 34px; }
.gallery-grid img { width: 100%; border-radius: 12px; display: block; }
.mcp-breadcrumbs { margin: 18px 0 28px; color: #64777e; font-size: .9rem; }
.mcp-breadcrumbs a { color: var(--mcp-green); }
.quote-form { display: grid; gap: 16px; max-width: 780px; padding: 28px; border: 1px solid #d8e7e1; border-radius: 14px; background: #fff; }
.quote-form label { display: grid; gap: 7px; font-weight: 700; }
.quote-form input, .quote-form select, .quote-form textarea { width: 100%; padding: 12px; border: 1px solid #abc0b8; border-radius: 4px; font: inherit; }
.quote-form button { justify-self: start; border: 0; background: var(--mcp-orange); color: #fff; padding: 14px 22px; border-radius: 5px; font-weight: 800; cursor: pointer; }
.mcp-pin-icon { display: inline-flex; vertical-align: -3px; margin-right: 6px; color: var(--mcp-green); }
.service-areas-list h3 { display: flex; align-items: center; }

@media (max-width: 800px) { .trust-items, .priority-cards, .services-grid { grid-template-columns: 1fr; } .mcp-page { padding-left: 18px; padding-right: 18px; } }
