wrapper every page-*.php template uses. * 2. The shared page-hero banner + breadcrumb (templates/page-hero.php). * * @package generatepress-ddch */ /* ----------------------------------------------------------------------- */ /* Base type — mirrors the "body.home" block in homepage-base.css, scoped */ /* to the interior

wrapper instead of the front page's . */ /* ----------------------------------------------------------------------- */ .ddch-interior { background-color: var(--ddch-ivory); color: var(--ddch-ink); font-family: var(--ddch-font-body); font-size: 1.125rem; line-height: 1.7; } /* * Every interior page-*.php template renders

as the sole direct * child of GeneratePress's #content flex container — there is no #primary * wrapper (see page-about-us.php, page-contacts.php, page-careers.php). * Without an explicit width, a flex item with the browser default * "flex: 0 1 auto" is sized via shrink-to-fit against its own content's * intrinsic (max-content) width rather than stretching to fill #content. * About Us and Contacts happened to have wide-enough content to reach * #content's full width by coincidence; a page with shorter/narrower * content (confirmed with Careers, ~994px vs the ~1200px #content width * at a 1280px viewport) would render visibly narrower than the other * interior pages. Force

to always fill its flex container. */ main.ddch-interior { width: 100%; flex: 1 1 auto; } .ddch-interior img { max-width: 100%; display: block; } .ddch-interior a { color: var(--ddch-teal); } .ddch-interior a:focus-visible, .ddch-interior button:focus-visible { /* Same "currentColor" outline pattern as homepage-base.css: guarantees the focus ring is visible on both light content backgrounds and the dark page-hero banner, since it always matches whatever text color already passed the AA sweep at that spot. */ outline: 3px solid currentColor; outline-offset: 3px; border-radius: 4px; } /* ----------------------------------------------------------------------- */ /* Page-hero banner (templates/page-hero.php) */ /* ----------------------------------------------------------------------- */ .ddch-page-hero { /* * Reuses the exact gradient + white text pairing already AA-audited * for ".ddch-cta-band--no-image" in homepage-sections-a.css, instead * of introducing a new untested color combination for this banner. */ background-color: var(--ddch-charcoal); background-image: linear-gradient(150deg, var(--ddch-charcoal) 0%, var(--ddch-sage-dark) 130%); color: var(--ddch-white); padding-block: clamp(2.75rem, 2.4rem + 1.4vw, 4rem); } .ddch-page-hero__inner { max-width: 46rem; } .ddch-page-hero__title { font-family: var(--ddch-font-heading); font-weight: 600; line-height: 1.15; font-size: clamp(2rem, 1.6rem + 1.8vw, 2.75rem); margin: 0.5rem 0 0; color: var(--ddch-white); } .ddch-page-hero__text { color: rgba(255, 255, 255, 0.85); font-size: 1.0625rem; margin: 0.75rem 0 0; max-width: 38rem; } .ddch-breadcrumb ol { display: flex; align-items: center; list-style: none; margin: 0; padding: 0; flex-wrap: wrap; font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; } .ddch-breadcrumb li { display: flex; align-items: center; } .ddch-breadcrumb__sep { margin: 0 0.5rem; color: rgba(255, 255, 255, 0.55); } /* * Compounded with the ".ddch-breadcrumb" ancestor (specificity 0,2,1) to * beat ".ddch-interior a" (0,1,1) in the base-type block above — the same * bug pattern already fixed for the topbar/footer/strip link selectors on * the homepage: without this, the breadcrumb's "Home" link renders as * "--ddch-teal" (only ~2.41:1 against this banner's dark gradient, failing * AA) instead of white. */ .ddch-breadcrumb a { color: var(--ddch-white); text-decoration: none; border-bottom: 1px solid rgba(255, 255, 255, 0.45); } .ddch-breadcrumb a:hover, .ddch-breadcrumb a:focus-visible { border-bottom-color: var(--ddch-white); } .ddch-breadcrumb li[aria-current='page'] { color: rgba(255, 255, 255, 0.85); } /* ----------------------------------------------------------------------- */ /* About Us — "Progressive Care Centers are the Right Choice" (numbered */ /* reason cards). Built on the page-agnostic ".ddch-card"/".ddch-card__*" */ /* primitives from homepage-base.css. */ /* ----------------------------------------------------------------------- */ .ddch-reasons { padding-block: var(--ddch-section-pad); background-color: var(--ddch-cream); } .ddch-reasons__grid { display: grid; gap: 1.5rem; list-style: none; margin: 0; padding: 0; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); } .ddch-reasons__number { display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 50%; background-color: var(--ddch-sage-dark); color: var(--ddch-white); font-family: var(--ddch-font-heading); font-weight: 700; font-size: 1.0625rem; margin-bottom: 1.25rem; } /* ----------------------------------------------------------------------- */ /* About Us — "Our Values" (lead paragraph + 4-card grid). Also built on */ /* the page-agnostic ".ddch-card"/".ddch-card__*" primitives. */ /* ----------------------------------------------------------------------- */ .ddch-values { padding-block: var(--ddch-section-pad); background-color: var(--ddch-ivory); } .ddch-values__lead { color: var(--ddch-muted); font-size: 1.0625rem; margin: 0.5rem 0 0; } .ddch-values__grid { display: grid; gap: 1.5rem; list-style: none; margin: 0; padding: 0; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); } /* ----------------------------------------------------------------------- */ /* Contacts page — extends the homepage's ".ddch-contact*" primitives */ /* (homepage-sections-c.css) with a lead paragraph and a Call/Email */ /* button row. The list/map/grid rules are already page-agnostic and */ /* reused as-is. */ /* ----------------------------------------------------------------------- */ .ddch-contact__lead { color: var(--ddch-muted); font-size: 1.0625rem; margin: 0.75rem 0 1.5rem; max-width: 34rem; } .ddch-contact__actions { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 0.5rem; } .ddch-contact__actions .dashicons { margin-right: 0.375rem; vertical-align: -3px; } /* ----------------------------------------------------------------------- */ /* Careers — "Why Work With Us" card grid. Built on the page-agnostic */ /* ".ddch-card"/".ddch-icon-badge" primitives from homepage-base.css. */ /* ----------------------------------------------------------------------- */ .ddch-perks { padding-block: var(--ddch-section-pad); background-color: var(--ddch-cream); } .ddch-perks__lead { color: var(--ddch-muted); font-size: 1.0625rem; margin: 0.5rem 0 0; } .ddch-perks__grid { display: grid; gap: 1.5rem; list-style: none; margin: 0; padding: 0; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); } /* ----------------------------------------------------------------------- */ /* Careers — closing "Apply" CTA card. A centered card (not a full-bleed */ /* dark band like templates/cta-band.php) so the one confirmed hiring */ /* fact — "apply via the Indeed listing" — reads as calm, on-brand */ /* guidance rather than an urgent sales pitch. */ /* ----------------------------------------------------------------------- */ .ddch-careers-cta-section { padding-block: var(--ddch-section-pad); background-color: var(--ddch-ivory); } .ddch-careers-cta { max-width: 42rem; margin-inline: auto; text-align: center; padding: clamp(2rem, 1.7rem + 1.2vw, 3rem); } .ddch-careers-cta__icon { margin-inline: auto; } .ddch-careers-cta .ddch-eyebrow { margin-bottom: 0.5rem; } .ddch-careers-cta__title { font-family: var(--ddch-font-heading); font-weight: 600; line-height: 1.2; color: var(--ddch-charcoal); font-size: clamp(1.5rem, 1.3rem + 0.9vw, 1.875rem); margin: 0 0 0.75rem; } .ddch-careers-cta__text { color: var(--ddch-muted); font-size: 1.0625rem; margin: 0 0 1.5rem; } .ddch-careers-cta .ddch-btn .dashicons { font-size: 16px; width: 16px; height: 16px; }