/* ============================================================
   MCC native-block styles (mcb-*)
   Design lives here; content lives in editable Gutenberg blocks.
   ============================================================ */

/* --- headings --- */
.mcb-h1{margin:10px 0 0;font-family:'Oswald',sans-serif;font-weight:700;text-transform:uppercase;font-size:42px;line-height:1.05;color:#131c33}
.mcb-h2{margin:0 0 24px;text-align:center;font-family:'Oswald',sans-serif;font-weight:700;text-transform:uppercase;font-size:26px;color:#131c33}
.mcb-h2--navy{color:#fff;margin:0 0 6px}
.mcb-h2--intro{margin:0 auto;max-width:760px;font-size:28px}
.mcb-h2--sm{font-size:24px;margin:0}
.mcb-h2--sm6{font-size:24px;margin:0 0 6px}
.mcb-h2--faq{margin:0 0 22px}
.mcb-h2--cta{margin:0;font-size:30px;color:#fff;line-height:1.1;text-align:left}

/* --- red rule (separator) --- */
hr.mcb-rule{width:44px;height:4px;background:#b62a25;border:none;margin:18px 0;opacity:1}
hr.mcb-rule--center{margin:16px auto}
hr.mcb-rule--results{margin:14px auto 26px}
hr.mcb-rule--areas{margin:14px auto 18px}

/* --- section bands --- */
.mcb-band--navy{background:#131c33}
.mcb-band--sand{background:#f4f3f0;border-top:1px solid #e6e6e2}
.mcb-band--white{background:#fff;border-top:1px solid #e6e6e2}
.wp-block-group.mcb-pad{padding:48px 40px}
.wp-block-group.mcb-intro{padding:52px 40px 12px;text-align:center}
.wp-block-group.mcb-areasband{padding:44px 40px;text-align:center}
.wp-block-group.mcb-relband{padding:40px 40px 8px;text-align:center;border-top:1px solid #e6e6e2}
.wp-block-group.mcb-faqband{padding:12px 40px 52px}

/* --- hero --- */
.mcb-hero{background:#f2f1ee;display:grid;grid-template-columns:1fr 1fr;align-items:stretch}
.mcb-hero-copy{padding:52px 40px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.mcb-kicker{display:flex;align-items:center;gap:7px;margin:0;color:#41608f;font-weight:700;font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.mcb-kicker::before{content:"";flex:none;width:16px;height:16px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2341608f' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 21s-7-6-7-11a7 7 0 0 1 14 0c0 5-7 11-7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E") center/contain no-repeat}
.mcb-lede{margin:0;max-width:470px;font-size:16px;line-height:1.55;color:#2c3850}
.wp-block-buttons.mcb-ctas{display:flex;flex-wrap:wrap;gap:14px;margin-top:26px}
.mcb-btn-solid .wp-block-button__link{display:flex;align-items:center;gap:12px;background:#131c33;border:none;border-radius:8px;padding:12px 22px;color:#fff;font-family:'Oswald',sans-serif;font-weight:600;font-size:16px;text-transform:uppercase;text-decoration:none}
.mcb-btn-solid .wp-block-button__link::before{content:"";flex:none;width:20px;height:20px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8c1.4 2.8 3.8 5.1 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1C10.6 21 3 13.4 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.2.2 2.4.6 3.6.1.3 0 .7-.2 1l-2.3 2.2z' fill='%23fff'/%3E%3C/svg%3E") center/contain no-repeat}
.mcb-btn-invert .wp-block-button__link{display:flex;align-items:center;background:#fff;border:1.5px solid #131c33;border-radius:8px;padding:12px 24px;color:#131c33;font-family:'Barlow',system-ui,sans-serif;font-weight:700;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;text-decoration:none}
.mcb-hero-img{margin:0;height:100%}
.mcb-hero-img img{width:100%;height:100%;object-fit:cover;min-height:340px;max-height:540px;display:block}

/* --- intro prose --- */
.mcb-prose-p{margin:0 auto;max-width:760px;font-size:15.5px;line-height:1.65;color:#3c4a66}
.mcb-prose-p+.mcb-prose-p{margin-top:14px}

/* --- before/after results --- */
.wp-block-group.mcb-results{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.mcb-bafig{background:#1b2a4d;border-radius:8px;overflow:hidden}
.mcb-bapair{display:grid;grid-template-columns:1fr 1fr;gap:3px}
.wp-block-image.mcb-ba{margin:0;position:relative}
.mcb-ba img{width:100%;height:240px;object-fit:cover;display:block}
.mcb-ba::after{position:absolute;top:10px;left:10px;color:#fff;font-family:'Oswald',sans-serif;font-size:11px;font-weight:600;letter-spacing:.08em;padding:4px 10px;border-radius:4px;text-transform:uppercase}
.mcb-ba--before::after{content:"Before";background:#b62a25}
.mcb-ba--after::after{content:"After";background:#1e7f43}
.mcb-bacap{padding:12px 16px;color:#c3cde4;font-size:13px;margin:0;text-align:left}
.mcb-footnote{margin:22px 0 0;text-align:center;font-size:13px;color:#8fa2c7}

/* --- cards --- */
.wp-block-group.sh-why.mcb-cards{grid-template-columns:repeat(2,1fr)}
.mcb-card{background:#fff;border-radius:8px;padding:24px 22px;box-shadow:0 4px 14px rgba(19,28,51,.08)}
.mcb-card--sand{background:#f4f3f0;box-shadow:none}
.mcb-card-title{font-family:'Oswald',sans-serif;font-weight:600;text-transform:uppercase;font-size:15px;color:#131c33;margin:0 0 8px;line-height:1.3}
.mcb-card-text{margin:0;font-size:14px;line-height:1.55;color:#3c4a66}
.mcb-lead{margin:0 auto 26px;max-width:720px;text-align:center;font-size:15px;line-height:1.65;color:#3c4a66}

/* --- process steps (auto-numbered) --- */
.mcb-steps{counter-reset:mcbstep}
.mcb-step{background:#f4f3f0;border-radius:8px;padding:22px 20px;counter-increment:mcbstep}
.mcb-step-title{display:flex;align-items:center;gap:10px;margin:0 0 8px;font-family:'Oswald',sans-serif;font-weight:600;text-transform:uppercase;font-size:14.5px;color:#131c33}
.mcb-step-title::before{content:counter(mcbstep);flex:none;width:30px;height:30px;border-radius:50%;background:#b62a25;color:#fff;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:600}
.mcb-step-text{margin:0;font-size:13.5px;line-height:1.55;color:#3c4a66}

/* --- lists (what we take) --- */
ul.mcb-list{margin:0;padding-left:18px;font-size:14px;line-height:1.8;color:#3c4a66;list-style:disc}
ul.mcb-list li{margin:0}
ul.mcb-list+.mcb-card-text{margin-top:14px}
.mcb-takefoot{margin:22px 0 0;text-align:center;font-size:13.5px;color:#3c4a66}
.mcb-takefoot strong{color:#131c33}

/* --- chip rows (areas + related) --- */
.mcb-band-sub{margin:0 0 16px;font-size:14.5px;color:#3c4a66}
.mcb-band-sub--rel{font-size:14px}
.wp-block-buttons.mcb-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:0}
.mcb-chips .wp-block-button{margin:0}
.mcb-chips .wp-block-button__link{display:inline-block;background:#152a52;border:1.5px solid #152a52;border-radius:999px;padding:6px 14px;font-size:12.5px;font-weight:700;color:#fff;text-decoration:none;font-family:'Barlow',system-ui,sans-serif;line-height:normal;letter-spacing:normal;text-transform:none}
.mcb-chip--ghost .wp-block-button__link{background:#fff;color:#152a52}

/* --- faq --- */
.mcb-qa{background:#f4f3f0;border-radius:4px}
.mcb-q{padding:14px 18px 0;font-size:14px;font-weight:700;color:#131c33;margin:0;font-family:'Barlow',system-ui,sans-serif;text-transform:none;line-height:1.4;text-align:left}
.mcb-a{padding:8px 18px 16px;font-size:13.5px;line-height:1.6;color:#3c4a66;margin:0;text-align:left}

/* --- cta --- */
.mcb-cta{background:#152a52;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:44px;padding:54px 44px}
.mcb-cta-sub{margin:16px 0 24px;font-size:14.5px;line-height:1.6;color:#dbe2f2;max-width:430px;text-align:left}
.wp-block-buttons.mcb-ctacall{margin:0}
.mcb-ctacall .wp-block-button__link{display:inline-flex;align-items:center;gap:12px;background:#1e3564;border:1px solid #47588a;border-radius:8px;padding:13px 22px;color:#fff;font-family:'Oswald',sans-serif;font-weight:600;font-size:16px;text-transform:uppercase;text-decoration:none}
.mcb-ctacall .wp-block-button__link::before{content:"";flex:none;width:18px;height:18px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8c1.4 2.8 3.8 5.1 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1C10.6 21 3 13.4 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.2.2 2.4.6 3.6.1.3 0 .7-.2 1l-2.3 2.2z' fill='%23fff'/%3E%3C/svg%3E") center/contain no-repeat}
.mcb-formcard{background:#fff;border-radius:10px;padding:28px 26px;box-shadow:0 18px 40px rgba(0,0,0,.28)}
.mcb-form-title{font-family:'Oswald',sans-serif;font-weight:700;text-transform:uppercase;font-size:18px;color:#131c33;margin:0;text-align:left}
.mcb-form-sub{margin:4px 0 16px;font-size:12.5px;color:#5a6577;text-align:left}

/* --- mobile parity with template rules --- */
@media (max-width:760px){
  .mcb-hero,.mcb-cta{grid-template-columns:1fr!important}
  .mcb-results,.wp-block-group.sh-why.mcb-cards{grid-template-columns:1fr}
  .mcb-h1{font-size:32px}
}

/* Center the CTA text column within its grid track, every page.
   justify-self:center also shrinks the grid item to its content width instead
   of stretching it, which is what stops the copy hugging the left edge on wide
   screens. Three class variants exist: v2s (home), sh (interior), sa (areas). */
.v2s-cta > .wp-block-group:first-child,
.sh-cta > .wp-block-group:first-child,
.sa-cta > .wp-block-group:first-child{justify-self:center}

/* center the hero text column within its grid track (homepage) */
@media (min-width:761px){.v2s-hero > .wp-block-group:first-child{justify-self:center;max-width:520px;width:100%}}

/* --- gallery page: finished-work grid --- */
.wp-block-group.mcb-shots{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;max-width:1120px;margin:0 auto}
.wp-block-group.mcb-shot{background:#f4f3f0;border-radius:8px;overflow:hidden}
.wp-block-image.mcb-shot-img{margin:0}
.mcb-shot-img img{width:100%;height:190px;object-fit:cover;display:block}
.mcb-shot-cap{margin:0;padding:11px 14px;font-size:12.5px;line-height:1.45;color:#3c4a66;text-align:left}
@media (max-width:1000px){.wp-block-group.mcb-shots{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.wp-block-group.mcb-shots{grid-template-columns:1fr}}
/* gallery uses the estate before/after card in a 2-up grid on desktop */
.wp-block-group.sh-proof .mcb-results{max-width:1120px;margin:0 auto}

/* --- Google reviews band -------------------------------------------------
   Three reviews shown in full, side by side. Deliberately not a carousel:
   almost nobody clicks past the first slide, so a carousel hides the proof
   it was built to show. Everything here is ordinary block content, so Zach
   can swap a review from the editor without touching code. */
.wp-block-group.mcb-reviews {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  max-width: 1100px;
  margin: 0 auto;
  /* stretch, not start: keeps the three card tops and bottoms on one line
     even though the reviews are different lengths */
  align-items: stretch;
}
.wp-block-group.mcb-review {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: #fff;
  border-radius: 8px;
  padding: 22px 22px 20px;
  box-shadow: 0 4px 14px rgba(19, 28, 51, .08);
}
.mcb-stars {
  margin: 0 0 10px;
  color: #f5a623;
  font-size: 15px;
  letter-spacing: .14em;
  line-height: 1;
}
.mcb-review-text {
  margin: 0 0 14px;
  font-size: 14.5px;
  line-height: 1.6;
  color: #3c4a66;
  text-align: left;
}
/* auto top margin pins the attribution to the bottom of the card, so the
   three names sit on one baseline no matter how long the review runs */
.mcb-review-by {
  margin: auto 0 0;
  padding-top: 12px;
  border-top: 1px solid #e6e6e2;
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 13px;
  letter-spacing: .02em;
  text-transform: uppercase;
  color: #131c33;
  text-align: left;
}
.mcb-review-meta {
  margin: 3px 0 0;
  font-size: 12.5px;
  color: #6b7689;
  text-align: left;
}
/* scoped to .v2s-reviews so it outranks the theme's own paragraph alignment */
.v2s-reviews .mcb-rating-line {
  margin: 0 0 4px;
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 17px;
  color: #131c33;
  letter-spacing: .01em;
  text-align: center;
}
.mcb-rating-line .mcb-stars { display: inline; margin: 0 8px 0 0; font-size: 17px; }
.mcb-reviews-foot { margin: 22px 0 0; text-align: center; font-size: 14px; }
.mcb-reviews-foot a { color: #131c33; border-bottom: 1.5px solid #b62a25; text-decoration: none; padding-bottom: 1px; }
.mcb-reviews-foot a:hover { color: #b62a25; }

@media (max-width: 900px) {
  .wp-block-group.mcb-reviews { grid-template-columns: 1fr; }
}
