/* ==========================================================
   Creedmore sitewide fixes, QC Round 1 (Oct 2026)
   Lives in the Elever Child (Creedmore) theme: assets/css/creedmore-fixes.css
   ========================================================== */

/* 1.30 Eyebrow labels bold, lighter red on dark (WCAG AA) */
.react-heading .sub-text { font-weight: 700 !important; color: #E5394E !important; }
.elementor-459 .sub-text,
.rt-counter .suffix { color: #E5394E !important; }
.elementor-16139 .elementor-widget-text-editor h2,
.elementor-15236 .elementor-widget-text-editor h2,
.elementor-12769 .elementor-widget-text-editor h2,
.elementor-16139 .elementor-widget-heading .elementor-heading-title,
.elementor-15236 .elementor-widget-heading .elementor-heading-title,
.elementor-12769 .elementor-widget-heading .elementor-heading-title { color: #E5394E; }

/* Keep brand red where labels sit on white (tab panels) */
.rts-tab-content-one .react-heading .sub-text { color: #A01B2C !important; }
@media (max-width: 767px) { .rts-tab-content-one .elementor-widget-icon { flex-basis: 40px !important; width: 40px !important; max-width: 40px !important; } }

/* B13 Body text one step larger (15px to 17px), header and footer unchanged */
.elementor:not(.elementor-459):not(.elementor-18) .elementor-widget-text-editor,
.elementor:not(.elementor-459):not(.elementor-18) .elementor-icon-box-description { font-size: 17px; line-height: 1.65; }

/* B26 Project card hover banner in brand red, not theme orange */
.single-project-card-inner .inner { background: linear-gradient(90deg, #A01B2C 0%, rgba(160, 27, 44, 0) 100%) !important; }

/* 1.24, 1.25, 1.27 Project value box: keep "$30M (Phase 1)" on one line */
.inner-content-project .single p { white-space: nowrap; }

/* 1.26 Page title indent matches other pages */
.reactheme-breadcrumb .breadcrumb-inner.container { padding-left: 0; padding-right: 0; }

/* t2.1 Top bar phone number never splits */
.elementor-element-e399eda, .elementor-element-e399eda * { white-space: nowrap; }

/* Form 2a Newsletter error gets its own line instead of sliding behind the button */
.elementor-818 .mf-error-message { position: static !important; display: block; margin-top: 6px; font-size: 14px; color: #E5394E !important; }

/* 1.10, 1.11, 2.11 Tab checklists: icon keeps its width, a little more room before the text */
.rts-tab-content-one .e-con-inner:has(> .elementor-widget-icon) { flex-wrap: nowrap !important; }
.rts-tab-content-one .elementor-widget-icon { flex: 0 0 50px !important; width: 50px !important; max-width: 50px !important; }
.rts-tab-content-one .elementor-widget-icon + .elementor-element { flex: 1 1 0 !important; min-width: 0; }
@media (max-width: 1024px) { .rts-tab-content-one .e-con-inner:has(> .elementor-widget-icon) { gap: 24px !important; } }
@media (max-width: 767px)  { .rts-tab-content-one .e-con-inner:has(> .elementor-widget-icon) { gap: 16px !important; } }

/* m1.5 Tabs become full-width buttons on phones */
@media (max-width: 767px) {
  .about__button__wrap { flex-direction: column; gap: 8px !important; }
  .about__button__wrap .nav-item, .about__button__wrap .nav-link { width: 100% !important; max-width: 100% !important; }
  .about__button__wrap .nav-link { justify-content: flex-start; text-align: left; border: 1px solid rgba(0, 70, 111, .25) !important; }
  .about__button__wrap .nav-link.active { background: #A01B2C !important; border-color: #A01B2C !important; }
  .about__button__wrap .nav-link.active, .about__button__wrap .nav-link.active * { color: #FFFFFF !important; }
}

/* m1.3 to m1.11, t2.8 to t2.10 Number circles stack above the title on tablet and phone */
@media (max-width: 1024px) {
  .e-con-full > .elementor-widget-button.elementor-absolute { position: static !important; inset: auto !important; transform: none !important; margin: 0 auto 12px !important; width: auto !important; }
  .e-con-full:has(> .elementor-widget-button.elementor-absolute) { align-items: center; text-align: center; }
}

/* 1.31 to 1.38 Market page play button centered on the photo (photo is square, so 50% of width = its middle) */
:is(.elementor-14755, .elementor-13994, .elementor-14018, .elementor-14000, .elementor-16489, .elementor-16492, .elementor-16495, .elementor-16498)
  .e-con-full:has(> .elementor-widget-rt-react-image) > .elementor-widget-react-video.elementor-absolute {
  top: 0 !important; left: 50% !important; right: auto !important; bottom: auto !important;
  margin: calc(50% - 45px) 0 0 -45px !important; transform: none !important;
}

/* Market page photo stays square (new project photos are landscape) and stat box accent in brand red */
:is(.elementor-14755, .elementor-13994, .elementor-14018, .elementor-14000, .elementor-16489, .elementor-16492, .elementor-16495, .elementor-16498)
  .e-con-full:has(> .elementor-widget-rt-react-image) > .elementor-widget-rt-react-image img { width: 100% !important; aspect-ratio: 1 / 1; height: auto !important; object-fit: cover; }
:is(.elementor-14755, .elementor-13994, .elementor-14018, .elementor-14000, .elementor-16489, .elementor-16492, .elementor-16495, .elementor-16498)
  .e-con-full:has(> .elementor-widget-rt-counter),
:is(.elementor-14755, .elementor-13994, .elementor-14018, .elementor-14000, .elementor-16489, .elementor-16492, .elementor-16495, .elementor-16498)
  .e-con-full:has(> .elementor-widget-rt-counter)::before { border-top-color: #A01B2C !important; }

/* 1.22 Projects grid: 4 across at 1280px+, 2 across 768 to 1279px, 1 on phones */
.rt-portfolio-filter .row { margin-left: 0 !important; margin-right: 0 !important; }
.rt-portfolio-filter .grid-item { width: 25% !important; max-width: 25% !important; flex: 0 0 25% !important; }
.rt-portfolio-filter .grid-item img { width: 100%; height: auto; aspect-ratio: 498 / 512; object-fit: cover; }
@media (max-width: 1279px) { .rt-portfolio-filter .grid-item { width: 50% !important; max-width: 50% !important; flex: 0 0 50% !important; } }
@media (max-width: 767px)  { .rt-portfolio-filter .grid-item { width: 100% !important; max-width: 100% !important; flex: 0 0 100% !important; } }

/* t2.14 Contact cards split the full width on tablet */
@media (min-width: 768px) and (max-width: 1024px) {
  .elementor-15239 .elementor-element-76bc1da { width: 100% !important; max-width: 100% !important; }
  .elementor-15239 .elementor-element-76bc1da > .elementor-widget,
  .elementor-15239 .elementor-element-76bc1da > .e-con-inner > .elementor-widget { flex: 1 1 0 !important; width: 50% !important; max-width: 50% !important; }
}