/* * Homepage layout for WordPress page ID 4729. * Adobe Bree/Livvic + PDF-proportional desktop typography + true program ovals build: 1.0.28. * Loaded by template-homepage-mockup.php after alternate-mockup.css. */ .page-id-4729 .chs-home-page { --chs-home-panel: #f1f1f1; --chs-home-blue-band: rgb(29 67 140 / 24%); --chs-home-section-width: 1820px; width: 100%; max-width: none; margin: 0; font-family: var(--chs-body-font); font-feature-settings: "ss03" 1; } .page-id-4729 .chs-home-page > * { margin-top: 0; margin-bottom: 0; } .page-id-4729 .chs-home-page h1, .page-id-4729 .chs-home-page h2, .page-id-4729 .chs-home-page h3 { font-family: var(--chs-display-font); } .page-id-4729 .chs-home-page p, .page-id-4729 .chs-home-page li { font-family: var(--chs-body-font); } .page-id-4729 .chs-home-page h1, .page-id-4729 .chs-home-page h2 { color: var(--chs-pink); font-weight: 400; } .page-id-4729 .chs-home-page a { color: var(--chs-pink); text-decoration: none; } .page-id-4729 .chs-home-page a:hover, .page-id-4729 .chs-home-page a:focus { color: var(--chs-blue); } .page-id-4729 .chs-home-page a:focus-visible { outline: 3px solid var(--chs-blue); outline-offset: 3px; } /* Hero */ .page-id-4729 .chs-home-hero { align-items: stretch; width: 100%; max-width: 1920px; height: clamp(520px, 40.125vw, 770px); min-height: 0 !important; margin-right: auto; margin-left: auto; padding: 0; background: #f2f2f2; overflow: hidden; } .page-id-4729 .chs-home-hero .wp-block-cover__image-background { width: 100%; height: 100%; object-fit: cover; object-position: right center; } .page-id-4729 .chs-home-hero .wp-block-cover__background { opacity: 0 !important; background: transparent; } .page-id-4729 .chs-home-hero .wp-block-cover__inner-container { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: flex-start; width: 100%; height: 100%; max-width: none !important; margin: 0 !important; padding: clamp(38px, 3.35vw, 64px) 0 clamp(38px, 3vw, 58px); } .page-id-4729 .chs-home-hero-copy { width: min(68%, 1140px); max-width: none !important; margin: 0; padding: 0 clamp(34px, 5vw, 96px); } .page-id-4729 .chs-home-hero-copy > .wp-block-group__inner-container, .page-id-4729 .chs-home-contact-bar > .wp-block-group__inner-container { width: 100%; max-width: none !important; margin: 0 !important; } .page-id-4729 .chs-home-hero-title { max-width: 950px; margin: 0 0 14px; font-size: clamp(34px, 2.5vw, 48px); font-family: var(--chs-display-font); font-weight: 400; line-height: 1.08; } .page-id-4729 .chs-home-hero-description { max-width: 960px; margin: 0; color: var(--chs-text) !important; font-size: clamp(19px, 1.35vw, 25px); line-height: 1.3; } .page-id-4729 .chs-home-connect-line { margin: clamp(28px, 2.9vw, 56px) 0 0; color: var(--chs-pink); font-size: clamp(22px, 1.55vw, 30px); font-family: var(--chs-display-font); font-weight: 400; line-height: 1.25; white-space: nowrap; } .page-id-4729 .chs-home-connect-spanish { color: var(--chs-blue); } .page-id-4729 .chs-home-contact-bar { width: 100%; max-width: none !important; margin: auto 0 0; padding: 32px 0; background: linear-gradient( 90deg, rgb(29 67 140 / 31%) 0%, rgb(29 67 140 / 29%) 54%, rgb(29 67 140 / 21%) 68%, rgb(29 67 140 / 10%) 80%, transparent 90% ); } .page-id-4729 .chs-home-contact-columns { display: grid; grid-template-columns: minmax(175px, 0.85fr) minmax(250px, 1.2fr) minmax(205px, 0.95fr); align-items: center; gap: 0; width: min(71%, 1180px); margin: 0; padding-left: clamp(34px, 5vw, 96px); } .page-id-4729 .chs-home-contact-columns > .wp-block-column { position: relative; padding: 0 28px; } .page-id-4729 .chs-home-contact-columns > .wp-block-column:first-child { padding-left: 0; } .page-id-4729 .chs-home-contact-columns > .wp-block-column:not(:last-child)::after { position: absolute; top: 50%; right: 0; width: 2px; height: 88px; background: var(--chs-blue); content: ""; transform: translateY(-50%); } .page-id-4729 .chs-home-contact-item { margin: 0; color: var(--chs-blue); font-family: var(--chs-display-font); font-size: clamp(20px, 1.35vw, 26px); font-weight: 400; letter-spacing: 0; line-height: 1.12; } .page-id-4729 .chs-home-contact-label { display: block; margin-bottom: 7px; color: var(--chs-pink); font-family: var(--chs-display-font); font-weight: 400; text-transform: uppercase; white-space: nowrap; } .page-id-4729 .chs-home-contact-keyword { color: var(--chs-blue); font-family: var(--chs-display-font); font-weight: 400; letter-spacing: 0; text-transform: none; } .page-id-4729 .chs-home-contact-item a, .page-id-4729 .chs-home-contact-item a:visited { color: var(--chs-blue); font-family: var(--chs-display-font); font-weight: 400; letter-spacing: 0; text-transform: none; white-space: nowrap; } .page-id-4729 .chs-home-referral-button { justify-content: center; margin: 0; transform: translateX(clamp(56px, 6vw, 112px)); } .page-id-4729 .chs-home-page .chs-home-referral-button .wp-block-button__link, .page-id-4729 .chs-home-page .chs-home-referral-button .wp-block-button__link:visited { padding: 18px 30px; border-radius: 8px; background: var(--chs-pink) !important; color: var(--chs-white) !important; font-family: var(--chs-display-font); font-size: clamp(20px, 1.35vw, 26px); font-weight: 400; letter-spacing: 0; line-height: 1.1; text-align: center; text-transform: none; white-space: nowrap; } .page-id-4729 .chs-home-page .chs-home-referral-button .wp-block-button__link:hover, .page-id-4729 .chs-home-page .chs-home-referral-button .wp-block-button__link:active, .page-id-4729 .chs-home-page .chs-home-referral-button .wp-block-button__link:focus-visible { background: var(--chs-green) !important; color: var(--chs-white) !important; } /* Keep the homepage footer Donate button pink after visiting it. */ body.page-id-4729.chs-alt-template .chs-alt-donate-button, body.page-id-4729.chs-alt-template .chs-alt-donate-button:visited { background: var(--chs-pink) !important; color: var(--chs-white) !important; } body.page-id-4729.chs-alt-template .chs-alt-donate-button:hover, body.page-id-4729.chs-alt-template .chs-alt-donate-button:active, body.page-id-4729.chs-alt-template .chs-alt-donate-button:focus-visible { background: var(--chs-green) !important; color: var(--chs-white) !important; } /* Home-visiting banner */ .page-id-4729 .chs-home-homevisit { display: grid; grid-template-columns: 47.5% 52.5%; height: clamp(430px, 31vw, 595px); min-height: 0; margin: 34px 0 0; gap: 0; background: var(--chs-pink); } .page-id-4729 .chs-home-homevisit > .wp-block-column { min-width: 0; margin: 0; } .page-id-4729 .chs-home-homevisit-image, .page-id-4729 .chs-home-homevisit-image figure, .page-id-4729 .chs-home-homevisit-image img { width: 100%; height: 100%; margin: 0; } .page-id-4729 .chs-home-homevisit-image, .page-id-4729 .chs-home-homevisit-image figure { position: relative; overflow: hidden; } .page-id-4729 .chs-home-homevisit-image img { display: block; width: 100%; max-width: 100%; object-fit: contain; object-position: left center; } .page-id-4729 .chs-home-homevisit-panel { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; padding: clamp(42px, 5vw, 92px) clamp(30px, 6vw, 118px); background: var(--chs-pink); color: var(--chs-white); text-align: center; } .page-id-4729 .chs-home-homevisit-panel p { color: var(--chs-white); } .page-id-4729 .chs-home-homevisit-logo { width: min(100%, 390px); margin: 0 auto 20px; } .page-id-4729 .chs-home-homevisit-logo img { display: block; width: 100%; height: auto; filter: none; } .page-id-4729 .chs-home-homevisit-tagline { margin: 0 0 18px; color: rgb(195 224 168) !important; font-size: clamp(20px, 1.55vw, 30px); font-style: italic; font-weight: 600; } .page-id-4729 .chs-home-homevisit-copy { max-width: 900px; margin: 0; font-size: clamp(18px, 1.3vw, 25px); line-height: 1.32; } /* Who We Are, What We Do, and app */ .page-id-4729 .chs-home-intro-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 34px; width: min(calc(100% - 68px), var(--chs-home-section-width)); margin: 70px auto 64px; } .page-id-4729 .chs-home-intro-grid > .wp-block-column { min-width: 0; margin: 0; } .page-id-4729 .chs-home-about-column { display: grid; grid-template-rows: auto 1fr; gap: 34px; } .page-id-4729 .chs-home-info-panel, .page-id-4729 .chs-home-app-panel { padding: clamp(30px, 3vw, 56px); } .page-id-4729 .chs-home-info-panel { background: var(--chs-home-panel); } .page-id-4729 .chs-home-info-panel h2, .page-id-4729 .chs-home-app-panel h2, .page-id-4729 .chs-home-news-card h2, .page-id-4729 .chs-home-story-card h2 { margin: 0 0 14px; font-size: clamp(27px, 2vw, 38px); font-weight: 400; line-height: 1.1; } .page-id-4729 .chs-home-info-panel p, .page-id-4729 .chs-home-info-panel li, .page-id-4729 .chs-home-app-panel p { font-size: clamp(19px, 1.28vw, 24px); line-height: 1.34; } .page-id-4729 .chs-home-info-panel p { margin: 0 0 14px; } .page-id-4729 .chs-home-more-link { margin: 14px 0 0; font-family: var(--chs-display-font); font-size: clamp(17px, 1.08vw, 21px) !important; font-weight: 400; text-transform: uppercase; } .page-id-4729 .chs-home-program-lists { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 28px; margin: 6px 0 0; } .page-id-4729 .chs-home-program-lists > .wp-block-column { min-width: 0; margin: 0; } .page-id-4729 .chs-home-program-lists ul { margin: 0; padding-left: 22px; } .page-id-4729 .chs-home-program-lists li { margin: 0 0 7px; padding-left: 4px; } .page-id-4729 .chs-home-program-lists li::marker { color: var(--chs-green); } .page-id-4729 .chs-home-app-panel { display: flex; flex-direction: column; align-items: center; justify-content: center; background: var(--chs-green-light); text-align: center; } .page-id-4729 .chs-home-app-panel h2 { margin-bottom: 4px; } .page-id-4729 .chs-home-app-subtitle { margin: 0 0 26px; color: var(--chs-green); font-size: clamp(20px, 1.3vw, 25px) !important; font-style: italic; font-weight: 600; } .page-id-4729 .chs-home-app-image { width: min(92%, 630px); margin: 0 auto 28px; } .page-id-4729 .chs-home-app-image img { display: block; width: 100%; height: auto; } .page-id-4729 .chs-home-app-description, .page-id-4729 .chs-home-app-features, .page-id-4729 .chs-home-app-more { max-width: 760px; margin-right: auto; margin-left: auto; } .page-id-4729 .chs-home-app-features { margin-top: 24px; margin-bottom: 24px; font-weight: 700; line-height: 1.28; } .page-id-4729 .chs-home-app-separator { color: var(--chs-green); } .page-id-4729 .chs-home-app-more { margin-bottom: 0; } /* Latest news and success story */ .page-id-4729 .chs-home-news-section { position: relative; overflow: hidden; padding: 62px 34px 78px; background: var(--chs-white); } .page-id-4729 .chs-home-news-section::before { content: ""; pointer-events: none; position: absolute; inset: 0; background: radial-gradient( ellipse 72% 70% at 50% 100%, #f5bedc 0 99%, transparent 100% ); } .page-id-4729 .chs-home-news-grid { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; gap: clamp(20px, 1.6vw, 28px); width: min(100%, 1440px); margin: 0 auto; } .page-id-4729 .chs-home-news-grid > .wp-block-column { min-width: 0; margin: 0; } .page-id-4729 .chs-home-news-card, .page-id-4729 .chs-home-story-card { height: 100%; min-height: clamp(410px, 26vw, 460px); padding: clamp(36px, 2.8vw, 50px); border: 3px solid var(--chs-green); border-radius: 12px; background: var(--chs-white); } .page-id-4729 .chs-home-news-card .lcp_catlist { margin: 0; padding: 0; list-style: none !important; } .page-id-4729 .chs-home-news-card .lcp_catlist > li::before { display: none !important; content: none !important; } .page-id-4729 .chs-home-news-card .lcp_catlist > li { margin: 0 0 9px; font-family: var(--chs-body-font); color: #111111; font-size: clamp(18px, 1.18vw, 22px); font-style: italic; line-height: 1.3; } .page-id-4729 .chs-home-news-card .lcp_catlist > li > a:first-child { display: block; margin-bottom: 3px; color: var(--chs-text); font-size: clamp(20px, 1.38vw, 26px); font-style: normal; font-weight: 700; } .page-id-4729 .chs-home-news-card .lcp_date { display: block; margin-bottom: 6px; font-style: italic; } .page-id-4729 .chs-home-news-card .lcp_excerpt, .page-id-4729 .chs-home-news-card .lcp_excerpt p { margin: 0; font-style: normal; } .page-id-4729 .chs-home-news-card .lcp_excerpt { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; } .page-id-4729 .chs-home-news-card .chs-home-post-more { display: block; margin-top: 2px; color: var(--chs-green); font-family: var(--chs-body-font); font-size: clamp(18px, 1.18vw, 22px); font-style: normal; font-weight: 400; line-height: 1.2; } .page-id-4729 .chs-home-news-card .lcp_thumbnail, .page-id-4729 .chs-home-news-card .lcp_excerpt figure, .page-id-4729 .chs-home-news-card .lcp_excerpt img { display: none; } .page-id-4729 .chs-home-news-more { margin: 16px 0 0; font-family: var(--chs-display-font); font-size: clamp(17px, 1.08vw, 21px); font-weight: 400; text-transform: uppercase; } .page-id-4729 .chs-home-story-card blockquote { margin: 0; padding: 0; border: 0; color: #111111 !important; font-style: normal !important; } .page-id-4729 .chs-home-story-card blockquote p, .page-id-4729 .chs-home-story-card blockquote cite { color: #111111 !important; font-family: var(--chs-body-font); font-size: clamp(19px, 1.28vw, 24px); line-height: 1.3; } .page-id-4729 .chs-home-story-card blockquote p { margin: 0 0 22px; font-style: normal !important; } .page-id-4729 .chs-home-story-card blockquote cite { color: #111111 !important; font-style: normal !important; } .page-id-4729 .chs-home-story-card blockquote cite::before { display: none; content: none; } .page-id-4729 .chs-home-story-card blockquote cite strong { font-style: normal; font-weight: 700 !important; } .page-id-4729 .chs-home-story-card blockquote cite em { font-style: italic !important; font-weight: 400; } .page-id-4729 .chs-home-story-slider { position: relative; min-height: 250px; padding: 0 42px; } .page-id-4729 .chs-home-story-slides, .page-id-4729 .chs-home-story-slide { margin: 0; } .page-id-4729 .chs-home-story-slide[hidden] { display: none; } .page-id-4729 .chs-home-story-controls { pointer-events: none; position: absolute; inset: 0; } .page-id-4729 .chs-home-story-control { pointer-events: auto; position: absolute; top: 50%; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 54px; margin: 0; padding: 0; border: 0; background: transparent; color: var(--chs-text); font-family: var(--chs-body-font); font-size: 52px; font-weight: 400; line-height: 1; transform: translateY(-50%); cursor: pointer; } .page-id-4729 .chs-home-story-control:hover, .page-id-4729 .chs-home-story-control:focus { background: transparent; color: var(--chs-pink); } .page-id-4729 .chs-home-story-control:focus-visible { outline: 3px solid var(--chs-blue); outline-offset: 2px; } .page-id-4729 .chs-home-story-previous { left: -44px; } .page-id-4729 .chs-home-story-next { right: -44px; } @media (max-width: 1180px) { .page-id-4729 .chs-home-contact-bar { width: 100%; } .page-id-4729 .chs-home-contact-columns { width: 76%; } .page-id-4729 .chs-home-contact-columns > .wp-block-column { padding: 0 18px; } .page-id-4729 .chs-home-homevisit { grid-template-columns: 55% 45%; } .page-id-4729 .chs-home-intro-grid, .page-id-4729 .chs-home-news-grid { gap: 24px; } } @media (max-width: 900px) { .page-id-4729 .chs-home-hero { display: block; height: auto; max-height: none; min-height: 0 !important; padding-top: 360px; } .page-id-4729 .chs-home-hero .wp-block-cover__image-background { top: 0; bottom: auto; height: 360px; object-position: 72% center; } .page-id-4729 .chs-home-hero .wp-block-cover__background { display: none; } .page-id-4729 .chs-home-hero .wp-block-cover__inner-container { height: auto; padding: 0; background: #f2f2f2; } .page-id-4729 .chs-home-hero-copy { width: 100%; padding: 34px 28px 26px; } .page-id-4729 .chs-home-connect-line { margin-top: 24px; white-space: normal; } .page-id-4729 .chs-home-contact-bar { width: 100%; margin-top: 0; padding: 25px 28px; background: var(--chs-home-blue-band); } .page-id-4729 .chs-home-contact-columns { width: 100%; padding-left: 0; } .page-id-4729 .chs-home-referral-button { transform: none; } .page-id-4729 .chs-home-homevisit, .page-id-4729 .chs-home-intro-grid, .page-id-4729 .chs-home-news-grid { display: block; } .page-id-4729 .chs-home-homevisit { height: auto; } .page-id-4729 .chs-home-homevisit-image { height: auto; } .page-id-4729 .chs-home-homevisit-image figure, .page-id-4729 .chs-home-homevisit-image img { width: 100%; height: auto; } .page-id-4729 .chs-home-homevisit-image img { max-width: 100%; } .page-id-4729 .chs-home-homevisit-panel { height: auto; } .page-id-4729 .chs-home-intro-grid { width: min(calc(100% - 40px), var(--chs-home-section-width)); margin: 42px auto; } .page-id-4729 .chs-home-about-column { margin-bottom: 24px; } .page-id-4729 .chs-home-news-grid > .wp-block-column + .wp-block-column { margin-top: 24px; } .page-id-4729 .chs-home-news-card, .page-id-4729 .chs-home-story-card { min-height: 0; } } @media (max-width: 680px) { .page-id-4729 .chs-home-hero { padding-top: 275px; } .page-id-4729 .chs-home-hero .wp-block-cover__image-background { height: 275px; object-position: 73% center; } .page-id-4729 .chs-home-hero-title { font-size: 32px; } .page-id-4729 .chs-home-contact-columns { display: block; } .page-id-4729 .chs-home-contact-columns > .wp-block-column, .page-id-4729 .chs-home-contact-columns > .wp-block-column:first-child { padding: 15px 0; text-align: center; } .page-id-4729 .chs-home-contact-columns > .wp-block-column:not(:last-child)::after { top: auto; right: 20%; bottom: 0; left: 20%; width: auto; height: 1px; transform: none; } .page-id-4729 .chs-home-homevisit { margin-top: 18px; } .page-id-4729 .chs-home-homevisit-panel { padding: 40px 24px; } .page-id-4729 .chs-home-program-lists { display: block; } .page-id-4729 .chs-home-program-lists > .wp-block-column + .wp-block-column { margin-top: 7px; } .page-id-4729 .chs-home-news-section { padding: 44px 20px 60px; } .page-id-4729 .chs-home-info-panel, .page-id-4729 .chs-home-app-panel, .page-id-4729 .chs-home-news-card, .page-id-4729 .chs-home-story-card { padding: 28px 24px; } .page-id-4729 .chs-home-story-slider { padding: 0 28px; } .page-id-4729 .chs-home-story-control { width: 32px; font-size: 46px; } .page-id-4729 .chs-home-story-previous { left: -14px; } .page-id-4729 .chs-home-story-next { right: -14px; } } /* ======================================================================== * BUILD 1.0.20 — full-width normalization + corrected program carousel * ======================================================================== */ /* Use the same page shell normalization as the other redesigned pages. */ body.chs-alt-template.page-id-4729 .site-inner, body.chs-alt-template.page-id-4729 .site-content, body.chs-alt-template.page-id-4729 .content-area, body.chs-alt-template.page-id-4729 .site-main, body.chs-alt-template.page-id-4729 .entry-content, body.chs-alt-template.page-id-4729 .chs-home-main, body.chs-alt-template.page-id-4729 .chs-home-page-wrap, body.chs-alt-template.page-id-4729 .chs-home-entry-content { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; float: none !important; } .page-id-4729 .chs-home-page { --chs-home-section-width: 1848px; --chs-home-shell: min(calc(100% - 68px), var(--chs-home-section-width)); --chs-home-gutter: max(34px, calc((100vw - var(--chs-home-section-width)) / 2)); --chs-home-pat: #8170b0; --chs-home-newborn: #3fb6e8; --chs-home-nfp: #3376a0; --chs-home-team: #7ac143; --chs-home-doula: #ec93bc; width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; } .page-id-4729 .chs-home-page > .wp-block-group__inner-container { width: 100%; max-width: none !important; margin: 0 !important; padding: 0 !important; } .page-id-4729 .chs-home-page > .alignfull, .page-id-4729 .chs-home-page > .wp-block-group.alignfull, .page-id-4729 .chs-home-page > .wp-block-cover.alignfull { width: 100% !important; max-width: none !important; margin-right: 0 !important; margin-left: 0 !important; } /* Top hero art reaches the page edges; copy remains aligned to the common gutter. */ .page-id-4729 .chs-home-hero { width: 100% !important; max-width: none !important; margin-right: 0 !important; margin-left: 0 !important; } .page-id-4729 .chs-home-hero-copy { padding-right: var(--chs-home-gutter); padding-left: var(--chs-home-gutter); } .page-id-4729 .chs-home-contact-columns { padding-left: var(--chs-home-gutter); } .page-id-4729 .chs-home-intro-grid, .page-id-4729 .chs-home-news-grid { width: var(--chs-home-shell) !important; } /* ------------------------------------------------------------------------ * Program carousel * * The carousel viewport is ONE row. Slides overlap in the same grid cell so * WordPress Group wrappers can never push a newly selected program underneath * the first program. JavaScript changes state classes rather than the hidden * attribute, avoiding Twenty Sixteen / Group-block display conflicts. * ------------------------------------------------------------------------ */ .page-id-4729 .chs-home-program-slider, .page-id-4729 .chs-home-program-slider > .wp-block-group__inner-container, .page-id-4729 .chs-home-program-slides, .page-id-4729 .chs-home-program-slides > .wp-block-group__inner-container { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; } .page-id-4729 .chs-home-program-slider { position: relative; margin-top: 34px !important; overflow: hidden; background: var(--chs-pink); } .page-id-4729 .chs-home-program-slides, .page-id-4729 .chs-home-program-slides > .wp-block-group__inner-container { display: grid !important; grid-template-columns: minmax(0, 1fr); grid-template-rows: 1fr; overflow: hidden; } /* Every slide occupies exactly the same carousel grid cell. */ .page-id-4729 .chs-home-program-slide, .page-id-4729 .chs-home-program-slide > .wp-block-group__inner-container { grid-area: 1 / 1; width: 100% !important; max-width: none !important; height: clamp(430px, 31vw, 595px); min-height: clamp(430px, 31vw, 595px); margin: 0 !important; padding: 0 !important; } .page-id-4729 .chs-home-program-slide { position: relative; z-index: 0; display: block !important; overflow: hidden; opacity: 0; visibility: hidden; pointer-events: none; transform: translateX(0); transition: transform 320ms ease, opacity 220ms ease; } /* Match the background behind each oval crop to that program's banner color. */ .page-id-4729 .chs-home-program-hs { background: var(--chs-pink); } .page-id-4729 .chs-home-program-pat { background: var(--chs-home-pat); } .page-id-4729 .chs-home-program-newborn { background: var(--chs-home-newborn); } .page-id-4729 .chs-home-program-nfp { background: var(--chs-home-nfp); } .page-id-4729 .chs-home-program-team { background: var(--chs-home-team); } .page-id-4729 .chs-home-program-doula { background: var(--chs-home-doula); } /* Before JS initializes, show only the original first homepage banner. */ .page-id-4729 .chs-home-program-slider:not(.is-ready) .chs-home-program-slide:first-child { z-index: 2; opacity: 1; visibility: visible; } .page-id-4729 .chs-home-program-slide.is-current, .page-id-4729 .chs-home-program-slide.is-enter-left, .page-id-4729 .chs-home-program-slide.is-enter-right, .page-id-4729 .chs-home-program-slide.is-exit-left, .page-id-4729 .chs-home-program-slide.is-exit-right { visibility: visible; } .page-id-4729 .chs-home-program-slide.is-current { z-index: 3; opacity: 1; pointer-events: auto; transform: translateX(0); } .page-id-4729 .chs-home-program-slide.is-enter-right { z-index: 3; opacity: 1; transform: translateX(100%); } .page-id-4729 .chs-home-program-slide.is-enter-left { z-index: 3; opacity: 1; transform: translateX(-100%); } .page-id-4729 .chs-home-program-slide.is-exit-left { z-index: 2; opacity: 1; transform: translateX(-100%); } .page-id-4729 .chs-home-program-slide.is-exit-right { z-index: 2; opacity: 1; transform: translateX(100%); } /* Legacy WP Group markup: the generated inner wrapper owns each banner grid. */ .page-id-4729 .chs-home-program-slide > .wp-block-group__inner-container { display: grid !important; grid-template-rows: 1fr; align-items: stretch; width: 100% !important; max-width: none !important; min-height: inherit; margin: 0 !important; padding: 0 !important; } /* The original homepage Healthy Start banner keeps its original 47.5 / 52.5 * geometry and its original HS-2 artwork. The other five slides use the same * left/right geometry as their matching About Our Programs banners. */ .page-id-4729 .chs-home-program-homepage-hs > .wp-block-group__inner-container { grid-template-columns: 47.5% 52.5%; } .page-id-4729 .chs-home-program-photo-left:not(.chs-home-program-homepage-hs) > .wp-block-group__inner-container { grid-template-columns: 43.5% 56.5%; } .page-id-4729 .chs-home-program-panel-left > .wp-block-group__inner-container { grid-template-columns: 56.5% 43.5%; } /* Newer Group markup may omit wp-block-group__inner-container. */ .page-id-4729 .chs-home-program-homepage-hs:not(:has(> .wp-block-group__inner-container)) { display: grid !important; grid-template-columns: 47.5% 52.5%; align-items: stretch; } .page-id-4729 .chs-home-program-photo-left:not(.chs-home-program-homepage-hs):not(:has(> .wp-block-group__inner-container)) { display: grid !important; grid-template-columns: 43.5% 56.5%; align-items: stretch; } .page-id-4729 .chs-home-program-panel-left:not(:has(> .wp-block-group__inner-container)) { display: grid !important; grid-template-columns: 56.5% 43.5%; align-items: stretch; } .page-id-4729 .chs-home-program-overlay { position: absolute; inset: 0; z-index: 6; display: block; } .page-id-4729 .chs-home-program-overlay:focus-visible { outline: 5px solid var(--chs-white); outline-offset: -9px; } .page-id-4729 .chs-home-program-photo { position: relative; z-index: 1; width: 100% !important; height: 100%; margin: 0 !important; padding: 0; overflow: hidden; font-size: 0; line-height: 0; } .page-id-4729 .chs-home-program-photo-left .chs-home-program-photo { grid-column: 1; grid-row: 1; border-radius: 0 50% 50% 0 / 0 50% 50% 0; } .page-id-4729 .chs-home-program-panel-left .chs-home-program-photo { grid-column: 2; grid-row: 1; border-radius: 50% 0 0 50% / 50% 0 0 50%; } .page-id-4729 .chs-home-program-photo img { display: block; width: 100% !important; height: 100% !important; max-width: none !important; margin: 0; object-fit: cover; object-position: 50% 50%; } /* Keep the ORIGINAL homepage image exactly as that banner was designed: the * PNG already contains its own curved composition, so do not add another oval * crop around it and do not cover-crop it. */ .page-id-4729 .chs-home-program-homepage-hs .chs-home-program-photo { grid-column: 1; border-radius: 0 !important; background: var(--chs-pink); } .page-id-4729 .chs-home-program-homepage-hs .chs-home-program-photo img { object-fit: contain; object-position: left center; } .page-id-4729 .chs-home-program-pat .chs-home-program-photo img { object-position: 54% 50%; } .page-id-4729 .chs-home-program-newborn .chs-home-program-photo img, .page-id-4729 .chs-home-program-nfp .chs-home-program-photo img { object-position: 50% 50%; } .page-id-4729 .chs-home-program-team .chs-home-program-photo img { object-position: 50% 47%; } .page-id-4729 .chs-home-program-doula .chs-home-program-photo img { object-position: 51% 50%; } .page-id-4729 .chs-home-program-panel, .page-id-4729 .chs-home-program-panel > .wp-block-group__inner-container { display: flex !important; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 100%; max-width: none !important; margin: 0 !important; padding: clamp(30px, 2.75vw, 53px) clamp(34px, 4.2vw, 80px) !important; color: var(--chs-white); text-align: center; } .page-id-4729 .chs-home-program-panel > .wp-block-group__inner-container { padding: 0 !important; } .page-id-4729 .chs-home-program-photo-left .chs-home-program-panel, .page-id-4729 .chs-home-program-photo-left .chs-home-program-panel > .wp-block-group__inner-container { grid-column: 2; grid-row: 1; } .page-id-4729 .chs-home-program-panel-left .chs-home-program-panel, .page-id-4729 .chs-home-program-panel-left .chs-home-program-panel > .wp-block-group__inner-container { grid-column: 1; grid-row: 1; } .page-id-4729 .chs-home-program-hs .chs-home-program-panel, .page-id-4729 .chs-home-program-hs .chs-home-program-panel > .wp-block-group__inner-container { background: var(--chs-pink); } .page-id-4729 .chs-home-program-pat .chs-home-program-panel, .page-id-4729 .chs-home-program-pat .chs-home-program-panel > .wp-block-group__inner-container { background: var(--chs-home-pat); } .page-id-4729 .chs-home-program-newborn .chs-home-program-panel, .page-id-4729 .chs-home-program-newborn .chs-home-program-panel > .wp-block-group__inner-container { background: var(--chs-home-newborn); } .page-id-4729 .chs-home-program-nfp .chs-home-program-panel, .page-id-4729 .chs-home-program-nfp .chs-home-program-panel > .wp-block-group__inner-container { background: var(--chs-home-nfp); } .page-id-4729 .chs-home-program-team .chs-home-program-panel, .page-id-4729 .chs-home-program-team .chs-home-program-panel > .wp-block-group__inner-container { background: var(--chs-home-team); } .page-id-4729 .chs-home-program-doula .chs-home-program-panel, .page-id-4729 .chs-home-program-doula .chs-home-program-panel > .wp-block-group__inner-container { background: var(--chs-home-doula); } .page-id-4729 .chs-home-program-logo { position: relative; z-index: 2; width: min(100%, 500px) !important; margin: 0 auto clamp(18px, 1.4vw, 27px) !important; font-size: 0; line-height: 0; } .page-id-4729 .chs-home-program-logo img { display: block; width: 100% !important; height: auto !important; max-height: clamp(92px, 9.5vw, 182px); margin: 0 auto; object-fit: contain; } .page-id-4729 .chs-home-program-pat .chs-home-program-logo, .page-id-4729 .chs-home-program-nfp .chs-home-program-logo { width: min(100%, 560px) !important; } .page-id-4729 .chs-home-program-newborn .chs-home-program-logo { width: min(100%, 520px) !important; } .page-id-4729 .chs-home-program-team .chs-home-program-logo { width: min(100%, 430px) !important; } .page-id-4729 .chs-home-program-doula .chs-home-program-logo { width: min(100%, 500px) !important; } .page-id-4729 .chs-home-program-tagline, .page-id-4729 .chs-home-program-copy, .page-id-4729 .chs-home-program-acronym { position: relative; z-index: 2; max-width: 860px; margin-right: auto !important; margin-left: auto !important; color: var(--chs-white) !important; font-family: var(--chs-body-font) !important; font-size: clamp(21px, 1.667vw, 32px) !important; line-height: 1.2; } .page-id-4729 .chs-home-program-tagline { margin-top: 0 !important; margin-bottom: clamp(12px, .9vw, 17px) !important; font-style: italic; font-weight: 600; } .page-id-4729 .chs-home-program-homepage-hs .chs-home-program-tagline { color: rgb(195 224 168) !important; } .page-id-4729 .chs-home-program-copy { margin-top: 0 !important; margin-bottom: 0 !important; font-weight: 400; } .page-id-4729 .chs-home-program-acronym { margin-top: -3px !important; margin-bottom: clamp(10px, .75vw, 15px) !important; font-weight: 400; } .page-id-4729 .chs-home-program-controls { pointer-events: none; position: absolute; inset: 0; z-index: 20; } .page-id-4729 .chs-home-program-control { pointer-events: auto; position: absolute; top: 50%; display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 74px; margin: 0; padding: 0; border: 0; background: transparent !important; color: #ffffff !important; font-family: Arial, sans-serif; font-size: 70px; font-weight: 300; line-height: 1; text-shadow: 0 2px 5px rgb(0 0 0 / 35%); transform: translateY(-50%); cursor: pointer; } .page-id-4729 .chs-home-program-control:hover, .page-id-4729 .chs-home-program-control:focus { background: transparent !important; color: #ffffff !important; transform: translateY(-50%) scale(1.08); } .page-id-4729 .chs-home-program-control:focus-visible { outline: 3px solid #ffffff; outline-offset: 2px; } .page-id-4729 .chs-home-program-previous { left: 14px; } .page-id-4729 .chs-home-program-next { right: 14px; } /* Full-bleed lower pink oval while the two cards stay on the common shell. */ .page-id-4729 .chs-home-news-section { width: 100% !important; max-width: none !important; margin-right: 0 !important; margin-left: 0 !important; padding: 62px 0 78px !important; } .page-id-4729 .chs-home-news-section::before { inset: 0; background: radial-gradient( ellipse 92% 86% at 50% 115%, #f5bedc 0 99%, transparent 100% ) !important; } @media (max-width: 900px) { .page-id-4729 .chs-home-hero-copy { padding-right: 28px; padding-left: 28px; } .page-id-4729 .chs-home-contact-columns { padding-left: 0; } .page-id-4729 .chs-home-program-slider { margin-top: 24px !important; } .page-id-4729 .chs-home-program-slide, .page-id-4729 .chs-home-program-slide > .wp-block-group__inner-container { min-height: 0; } .page-id-4729 .chs-home-program-slide > .wp-block-group__inner-container, .page-id-4729 .chs-home-program-homepage-hs > .wp-block-group__inner-container, .page-id-4729 .chs-home-program-photo-left:not(.chs-home-program-homepage-hs) > .wp-block-group__inner-container, .page-id-4729 .chs-home-program-panel-left > .wp-block-group__inner-container, .page-id-4729 .chs-home-program-slide:not(:has(> .wp-block-group__inner-container)) { grid-template-columns: 1fr !important; } .page-id-4729 .chs-home-program-photo, .page-id-4729 .chs-home-program-photo-left .chs-home-program-photo, .page-id-4729 .chs-home-program-panel-left .chs-home-program-photo, .page-id-4729 .chs-home-program-homepage-hs .chs-home-program-photo { grid-column: 1 !important; grid-row: 1 !important; height: clamp(250px, 48vw, 440px); border-radius: 0 !important; } .page-id-4729 .chs-home-program-panel, .page-id-4729 .chs-home-program-photo-left .chs-home-program-panel, .page-id-4729 .chs-home-program-panel-left .chs-home-program-panel { grid-column: 1 !important; grid-row: 2 !important; height: auto; min-height: clamp(220px, 36vw, 360px); padding: 30px 42px !important; } .page-id-4729 .chs-home-program-homepage-hs .chs-home-program-photo img { object-fit: contain; } .page-id-4729 .chs-home-program-control { width: 44px; font-size: 60px; } .page-id-4729 .chs-home-program-previous { left: 5px; } .page-id-4729 .chs-home-program-next { right: 5px; } } @media (max-width: 680px) { .page-id-4729 .chs-home-program-slider { margin-top: 18px !important; } .page-id-4729 .chs-home-program-panel { padding: 28px 34px !important; } .page-id-4729 .chs-home-program-tagline, .page-id-4729 .chs-home-program-copy, .page-id-4729 .chs-home-program-acronym { font-size: 18px !important; } .page-id-4729 .chs-home-program-tagline { font-size: 20px !important; } .page-id-4729 .chs-home-news-section { padding: 44px 0 60px !important; } .page-id-4729 .chs-home-news-grid { width: min(calc(100% - 40px), var(--chs-home-section-width)) !important; } } @media (prefers-reduced-motion: reduce) { .page-id-4729 .chs-home-program-slide { transition: none !important; } } /* ======================================================================== * BUILD 1.0.21 - PAGE 1 PDF PROPORTIONS AT DESKTOP WIDTHS * * Page 1 of the supplied mockup is authored on a 1920px-wide canvas. These * desktop rules use the PDF's actual type proportions (Bree + Livvic) and the * same shallow 14.5% horizontal oval used by the corrected Programs page. * The common 34px page shell remains in place for the lower content cards; * only the hero copy/contact artwork gets its own larger internal inset from * the PDF. * ======================================================================== */ @media (min-width: 901px) { /* Explicitly keep the approved font pairing on the homepage. */ .page-id-4729 .chs-home-page { --chs-home-display-font: "bree", "Livvic", Verdana, Arial, sans-serif; --chs-home-body-font: "Livvic", Verdana, Arial, sans-serif; font-family: var(--chs-home-body-font) !important; } .page-id-4729 .chs-home-page h1, .page-id-4729 .chs-home-page h2, .page-id-4729 .chs-home-page h3, .page-id-4729 .chs-home-more-link, .page-id-4729 .chs-home-news-more, .page-id-4729 .chs-home-contact-item, .page-id-4729 .chs-home-contact-item a, .page-id-4729 .chs-home-contact-label, .page-id-4729 .chs-home-contact-keyword, .page-id-4729 .chs-home-referral-button .wp-block-button__link { font-family: var(--chs-home-display-font) !important; } .page-id-4729 .chs-home-page p, .page-id-4729 .chs-home-page li, .page-id-4729 .chs-home-story-card blockquote p, .page-id-4729 .chs-home-story-card blockquote cite, .page-id-4729 .chs-home-news-card .lcp_catlist > li { font-family: var(--chs-home-body-font) !important; } /* Hero artwork remains full bleed, but its editable copy follows the PDF's * roughly 114px inset on a 1920px canvas rather than the generic 34px shell. */ .page-id-4729 .chs-home-hero-copy { padding-left: clamp(72px, 5.925vw, 114px) !important; padding-right: 34px !important; } .page-id-4729 .chs-home-hero-description { max-width: min(47.6vw, 914px) !important; font-size: clamp(23px, 1.625vw, 31.2px) !important; line-height: 1.2 !important; } .page-id-4729 .chs-home-connect-line { font-size: clamp(30px, 2.1875vw, 42px) !important; line-height: 1.15 !important; } .page-id-4729 .chs-home-contact-columns { width: min(61.5vw, 1180px) !important; padding-left: clamp(78px, 6.35vw, 122px) !important; } .page-id-4729 .chs-home-contact-item, .page-id-4729 .chs-home-page .chs-home-referral-button .wp-block-button__link, .page-id-4729 .chs-home-page .chs-home-referral-button .wp-block-button__link:visited { font-size: clamp(29px, 2.077vw, 39.9px) !important; } /* The corrected About Our Programs page established that the mockup oval * reaches only ~14.5% into the photo horizontally. A 50% radius creates the * over-deep half-ellipse visible in the previous homepage build. */ .page-id-4729 .chs-home-program-photo-left:not(.chs-home-program-homepage-hs) .chs-home-program-photo { border-radius: 0 14.5% 14.5% 0 / 0 50% 50% 0 !important; } .page-id-4729 .chs-home-program-panel-left .chs-home-program-photo { border-radius: 14.5% 0 0 14.5% / 50% 0 0 50% !important; } /* Page 1 lower cards: PDF uses 48px Bree headings and 31.2px Livvic body * copy on its 1920px canvas. Scale those values with the viewport. */ .page-id-4729 .chs-home-info-panel, .page-id-4729 .chs-home-app-panel { padding: clamp(28px, 1.875vw, 36px) !important; } .page-id-4729 .chs-home-info-panel h2, .page-id-4729 .chs-home-app-panel h2 { font-size: clamp(34px, 2.5vw, 48px) !important; font-weight: 400 !important; line-height: 1.08 !important; } .page-id-4729 .chs-home-info-panel p, .page-id-4729 .chs-home-info-panel li, .page-id-4729 .chs-home-app-panel p { font-size: clamp(23px, 1.625vw, 31.2px) !important; line-height: 1.2 !important; } .page-id-4729 .chs-home-more-link, .page-id-4729 .chs-home-news-more { font-size: clamp(23px, 1.625vw, 31.2px) !important; font-weight: 400 !important; } .page-id-4729 .chs-home-app-subtitle { font-size: clamp(24px, 1.667vw, 32px) !important; font-weight: 600 !important; line-height: 1.15 !important; } .page-id-4729 .chs-home-app-image { width: min(68%, 27.76vw, 533px) !important; margin-bottom: clamp(20px, 1.45vw, 28px) !important; } .page-id-4729 .chs-home-app-features { font-weight: 600 !important; line-height: 1.2 !important; } /* Latest News / Success Stories use the same larger PDF typography and card * depth. This is especially noticeable at the user's 1680px desktop width. */ .page-id-4729 .chs-home-news-card, .page-id-4729 .chs-home-story-card { min-height: clamp(500px, 36.2vw, 695px) !important; padding: clamp(44px, 3.44vw, 66px) !important; } .page-id-4729 .chs-home-news-card h2, .page-id-4729 .chs-home-story-card h2 { font-size: clamp(34px, 2.4375vw, 46.8px) !important; font-weight: 400 !important; line-height: 1.08 !important; } .page-id-4729 .chs-home-news-card .lcp_catlist > li { font-size: clamp(23px, 1.625vw, 31.2px) !important; line-height: 1.2 !important; } .page-id-4729 .chs-home-news-card .lcp_catlist > li > a:first-child { font-size: clamp(27px, 1.875vw, 36px) !important; font-weight: 600 !important; line-height: 1.15 !important; } .page-id-4729 .chs-home-news-card .chs-home-post-more { font-size: clamp(23px, 1.625vw, 31.2px) !important; } .page-id-4729 .chs-home-story-card blockquote p, .page-id-4729 .chs-home-story-card blockquote cite { font-size: clamp(23px, 1.625vw, 31.2px) !important; line-height: 1.2 !important; } .page-id-4729 .chs-home-story-card blockquote cite strong { font-weight: 600 !important; } } /* ======================================================================== * BUILD 1.0.22 - FINAL PAGE 1 TYPOGRAPHY / SHARED CONNECT BLOCK * * Desktop only: * - Uses the same effective Bree sizing/weight as the finalized Connect block. * - Keeps the homepage's unique fading contact-bar background and geometry. * - Reinforces the embedded-PDF Bree appearance with 600 web weight. * - Gives the hero description slightly more usable width so it does not * wrap prematurely on 1680px-class desktop displays. * ======================================================================== */ @media (min-width: 901px) { /* The PDF's embedded Bree Regular renders visibly heavier than Adobe Bree * at browser weight 400, so use the same 600 treatment established on the * corrected program/About pages. */ .page-id-4729 .chs-home-hero-title, .page-id-4729 .chs-home-info-panel h2, .page-id-4729 .chs-home-app-panel h2, .page-id-4729 .chs-home-news-card h2, .page-id-4729 .chs-home-story-card h2 { font-family: var(--chs-home-display-font) !important; font-weight: 600 !important; letter-spacing: 0 !important; } /* Page-1 PDF: hero title = 48 Bree; body = 31.2 Livvic. * The body box gets a modest width increase for the live 1680px render. */ .page-id-4729 .chs-home-hero-title { font-size: clamp(34px, 2.5vw, 48px) !important; line-height: 1.08 !important; } .page-id-4729 .chs-home-hero-description { max-width: min(51vw, 980px) !important; font-family: var(--chs-home-body-font) !important; font-size: clamp(23px, 1.625vw, 31.2px) !important; font-weight: 400 !important; line-height: 1.2 !important; } /* Match the finalized Connect/program-page start line exactly. * This intentionally supersedes the older homepage-only 42px maximum. */ .page-id-4729 .chs-home-connect-line, .page-id-4729 .chs-home-connect-line .chs-home-connect-spanish { font-family: var(--chs-home-display-font) !important; font-size: clamp(30px, 2.5vw, 48px) !important; font-weight: 600 !important; letter-spacing: 0 !important; line-height: 1.08 !important; } /* Same effective Bree typography as the standardized Call/Text/Referral * blocks on Connect, Healthy Start, PAT, NewboRN, NFP, TEAM Dad, and Doula. * The homepage keeps its fade and existing column positioning. */ .page-id-4729 .chs-home-contact-item, .page-id-4729 .chs-home-contact-item a, .page-id-4729 .chs-home-contact-item a:visited, .page-id-4729 .chs-home-contact-label, .page-id-4729 .chs-home-contact-keyword, .page-id-4729 .chs-home-page .chs-home-referral-button .wp-block-button__link, .page-id-4729 .chs-home-page .chs-home-referral-button .wp-block-button__link:visited { font-family: var(--chs-home-display-font) !important; font-size: clamp(24px, 2vw, 38px) !important; font-weight: 600 !important; letter-spacing: 0 !important; line-height: 1.08 !important; } .page-id-4729 .chs-home-contact-label { margin-bottom: 7px !important; text-transform: uppercase !important; } .page-id-4729 .chs-home-contact-keyword { font-size: 1em !important; text-transform: none !important; } /* PDF page 1 uses Bree Regular at 31.2 for LEARN MORE / MORE NEWS. * Explicitly style both the wrapper and link so generic anchor rules or * theme typography cannot pull these back to Livvic. */ .page-id-4729 .chs-home-more-link, .page-id-4729 .chs-home-more-link a, .page-id-4729 .chs-home-more-link a:visited, .page-id-4729 .chs-home-news-more, .page-id-4729 .chs-home-news-more a, .page-id-4729 .chs-home-news-more a:visited { font-family: var(--chs-home-display-font) !important; font-size: clamp(23px, 1.625vw, 31.2px) !important; font-weight: 600 !important; letter-spacing: 0 !important; line-height: 1.08 !important; text-transform: uppercase !important; } /* Page-1 PDF card headings: 48 Bree for the upper cards and 46.8 Bree for * Latest News / Success Stories. Keep the already-correct size, but use the * same web-weight compensation as the other corrected pages. */ .page-id-4729 .chs-home-info-panel h2, .page-id-4729 .chs-home-app-panel h2 { font-size: clamp(34px, 2.5vw, 48px) !important; line-height: 1.08 !important; } .page-id-4729 .chs-home-news-card h2, .page-id-4729 .chs-home-story-card h2 { font-size: clamp(34px, 2.4375vw, 46.8px) !important; line-height: 1.08 !important; } } /* ======================================================================== * BUILD 1.0.23 — tighten My Healthy Start App card spacing * * The PDF keeps the same card footprint but groups the title, device art, * description, feature list, closing copy and Learn More link a little more * tightly. This is desktop-only so the existing mobile treatment is unchanged. * ======================================================================== */ @media (min-width: 901px) { .page-id-4729 .chs-home-app-panel { padding: clamp(24px, 1.45vw, 28px) !important; } .page-id-4729 .chs-home-app-subtitle { margin-top: 0 !important; margin-bottom: clamp(14px, 0.95vw, 18px) !important; } .page-id-4729 .chs-home-app-image { margin-top: 0 !important; margin-bottom: clamp(15px, 1vw, 19px) !important; } .page-id-4729 .chs-home-app-description { margin-top: 0 !important; margin-bottom: clamp(12px, 0.8vw, 15px) !important; } .page-id-4729 .chs-home-app-features { margin-top: 0 !important; margin-bottom: clamp(13px, 0.85vw, 16px) !important; } .page-id-4729 .chs-home-app-more { margin-top: 0 !important; margin-bottom: 0 !important; } .page-id-4729 .chs-home-app-panel .chs-home-more-link { margin-top: clamp(12px, 0.8vw, 15px) !important; margin-bottom: 0 !important; } } /* ======================================================================== * BUILD 1.0.24 — lock app feature list to the PDF's exact three lines. * Each line is a block and stays intact, so phrases such as "Feeding log" * can never split between rows. * ======================================================================== */ .page-id-4729 .chs-home-app-feature-line { display: block; white-space: nowrap; } @media (max-width: 900px) { .page-id-4729 .chs-home-app-feature-line { white-space: normal; } } /* ======================================================================== * BUILD 1.0.25 — match My Healthy Start App panel green to PDF. * PDF sampled background: RGB 210,232,190 / #D2E8BE. * The prior live panel was approximately #C3DFA8, which was darker and more * saturated than the mockup. * ======================================================================== */ .page-id-4729 .chs-home-app-panel { background: #d2e8be !important; } /* ======================================================================== * BUILD 1.0.26 — app-card hover + equal-height column lock * * Keep the green app card exactly as tall as the two stacked gray cards * beside it, independent of small text-wrap differences. * ======================================================================== */ @media (min-width: 901px) { .page-id-4729 .chs-home-intro-grid { align-items: stretch !important; } .page-id-4729 .chs-home-intro-grid > .wp-block-column { min-height: 100%; } .page-id-4729 .chs-home-intro-grid > .wp-block-column:last-child { display: flex !important; flex-direction: column; } .page-id-4729 .chs-home-about-column { height: 100%; } .page-id-4729 .chs-home-app-panel { box-sizing: border-box; width: 100%; height: 100%; flex: 1 1 auto; } } /* The generic homepage anchor hover is blue. The PDF app card uses the * green/pink palette, so keep the link pink normally and turn it green on * interaction rather than blue. */ .page-id-4729 .chs-home-app-panel .chs-home-more-link a, .page-id-4729 .chs-home-app-panel .chs-home-more-link a:visited { color: var(--chs-pink) !important; } .page-id-4729 .chs-home-app-panel .chs-home-more-link a:hover, .page-id-4729 .chs-home-app-panel .chs-home-more-link a:focus, .page-id-4729 .chs-home-app-panel .chs-home-more-link a:focus-visible { color: var(--chs-green) !important; } /* ======================================================================== * BUILD 1.0.27 — restore PDF-like vertical rhythm in My Healthy Start App. * * At the confirmed 1920px desktop baseline the content in the green card was * slightly too compressed vertically after 1.0.23. Increase the gaps between * content groups while preserving the equal-height column lock from 1.0.26. * ======================================================================== */ @media (min-width: 901px) { .page-id-4729 .chs-home-app-panel h2 { margin-bottom: 8px !important; } .page-id-4729 .chs-home-app-subtitle { margin-bottom: clamp(19px, 1.25vw, 24px) !important; } .page-id-4729 .chs-home-app-image { margin-bottom: clamp(22px, 1.46vw, 28px) !important; } .page-id-4729 .chs-home-app-description { margin-bottom: clamp(16px, 1.04vw, 20px) !important; } .page-id-4729 .chs-home-app-features { margin-bottom: clamp(18px, 1.15vw, 22px) !important; line-height: 1.32 !important; } .page-id-4729 .chs-home-app-panel .chs-home-more-link { margin-top: clamp(15px, 0.94vw, 18px) !important; } } /* ======================================================================== * BUILD 1.0.28 — stronger PDF-like vertical distribution in app card. * * 1.0.27 was applying correctly, but the increases were only a few pixels * per gap and the whole stack is vertically centered. At 1920px that visual * change is subtle. This pass reduces outer vertical padding and opens the * internal gaps more clearly so the content reaches closer to the top/bottom * of the green card like the PDF. * ======================================================================== */ @media (min-width: 901px) { .page-id-4729 .chs-home-app-panel { padding-top: 20px !important; padding-bottom: 20px !important; } .page-id-4729 .chs-home-app-panel h2 { margin-bottom: 6px !important; } .page-id-4729 .chs-home-app-subtitle { margin-bottom: 30px !important; } .page-id-4729 .chs-home-app-image { margin-bottom: 32px !important; } .page-id-4729 .chs-home-app-description { margin-bottom: 26px !important; } .page-id-4729 .chs-home-app-features { margin-bottom: 28px !important; line-height: 1.45 !important; } .page-id-4729 .chs-home-app-panel .chs-home-more-link { margin-top: 18px !important; margin-bottom: 0 !important; } }