/* Homepage additions, 2026-11-13: Delia's 2024-2026 requests plus the competitor review items.
   Loaded on the homepage only. No visible text below 16px (1rem). */

/* Hero: leaf background behind a deep teal overlay, white text keeps contrast well above 4.5:1 */
.home-hero-section.home-hero-bg{
  background-color:var(--teal-deep);
  background-image:linear-gradient(rgba(2,47,63,0.84),rgba(2,47,63,0.84)),url("/assets/images/content/2026-11-dark-teal-leaf-texture-background-1920w.webp");
  background-size:cover;background-position:center;
}
@media (max-width:60rem){
  .home-hero-section.home-hero-bg{
    background-image:linear-gradient(rgba(2,47,63,0.86),rgba(2,47,63,0.86)),url("/assets/images/content/2026-11-dark-teal-leaf-texture-background-960w.webp");
  }
}
.home-hero-section.home-hero-bg::after{display:none}
.home-hero-words{display:flex;flex-wrap:wrap;gap:0.4rem 1.1rem;margin:0 0 1rem;padding:0;list-style:none}
.home-hero-words li{margin:0;color:var(--peach);font-family:"Young Serif",Georgia,serif;font-size:clamp(1.15rem,1.8vw,1.4rem);line-height:1.3}
.home-hero-rotator{display:grid;margin:0}
.home-hero-rotator span{grid-area:1 / 1;opacity:0;transition:opacity 900ms ease;font-size:1.12rem;line-height:1.55}
.home-hero-rotator span.is-active{opacity:1}
@media (prefers-reduced-motion:reduce){
  .home-hero-rotator span{transition:none}
}

/* Proof strip directly under the hero */
.home-proof-strip-section{padding-block:1.6rem;border-bottom:1px solid var(--line)}
.home-proof-strip{display:flex;flex-wrap:wrap;justify-content:center;gap:0.75rem 1.75rem;margin:0;padding:0;list-style:none}
.home-proof-strip li{margin:0;display:flex;align-items:center;gap:0.55rem;color:var(--teal);font-size:1rem;font-weight:700;line-height:1.35}
.home-proof-strip li::before{width:1.35rem;height:1.35rem;flex:none;display:grid;place-items:center;color:var(--white);background:var(--coral-text);border-radius:50%;content:"\2713";font-size:1rem;line-height:1}

/* Welcome intro */
.home-mission .home-mission-aim+.home-mission-aim{margin-top:0.6rem}
.home-mission-aim strong{color:var(--teal)}

/* Fertility topic chips and other-approach chips */
.home-chips-intro{max-width:52rem;margin:0 auto 1.5rem;text-align:center}
.home-chips-intro h2{margin-bottom:0.5rem}
.home-chips-intro p{margin:0;color:var(--muted);font-size:1.05rem}
.chip-list{display:flex;flex-wrap:wrap;justify-content:center;gap:0.7rem;margin:0;padding:0;list-style:none}
.chip-list li{margin:0}
.chip-list a,.chip-list span{display:inline-flex;align-items:center;min-height:2.9rem;padding:0.55rem 1.1rem;color:var(--teal);background:var(--white);border:1.5px solid var(--line);border-radius:999px;font-size:1rem;font-weight:650;line-height:1.3;text-decoration:none;transition:background-color 160ms ease,border-color 160ms ease,color 160ms ease}
.chip-list a:hover,.chip-list a:focus-visible{color:var(--white);background:var(--teal);border-color:var(--teal)}
.home-fertility-action{margin-top:1.6rem;text-align:center}
.home-fertility-action .button{justify-self:center}

/* Team intro and the "Not in Toronto?" block */
.team-intro-copy .team-intro-lead{color:var(--teal);font-family:"Young Serif",Georgia,serif;font-size:clamp(1.2rem,1.9vw,1.5rem);line-height:1.45}
.team-summary-copy p{margin:0 0 0.8rem}
.team-summary .button{margin-top:0.6rem}

/* Core values */
.home-values-section{
  background-color:var(--teal-deep);
  background-image:linear-gradient(rgba(2,47,63,0.8),rgba(2,47,63,0.8)),url("/assets/images/content/2026-11-tropical-green-leaves-background-1920w.webp");
  background-size:cover;background-position:center;
}
@media (max-width:60rem){
  .home-values-section{background-image:linear-gradient(rgba(2,47,63,0.82),rgba(2,47,63,0.82)),url("/assets/images/content/2026-11-tropical-green-leaves-background-960w.webp")}
}
.home-values-section h2{margin:0 0 2rem;text-align:center}
.home-values-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.25rem;margin:0;padding:0;list-style:none}
.home-values-grid li{margin:0;padding:clamp(1.4rem,2.4vw,2rem);background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow)}
.tone-dark .home-values-grid h3{margin:0 0 0.6rem;color:var(--teal)}
.tone-dark .home-values-grid p{margin:0;color:var(--ink);font-size:1.05rem;line-height:1.6}
@media (max-width:64rem){.home-values-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:36rem){.home-values-grid{grid-template-columns:1fr}}

/* Who we help: four cards, the fourth for professionals and healthcare workers */
.home-audience-section .audience-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.home-audience-card-professionals{background-image:url("/assets/images/content/2026-11-deep-green-leaves-background-960w.webp")}
@media (max-width:64rem){.home-audience-section .audience-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:36rem){.home-audience-section .audience-grid{grid-template-columns:1fr}}

/* Free guide box */
.home-guide{display:grid;grid-template-columns:minmax(10rem,16rem) minmax(0,1fr);align-items:center;gap:clamp(1.5rem,4vw,3.5rem);max-width:60rem;margin-inline:auto}
.home-guide figure{margin:0}
.home-guide img{width:100%;border-radius:var(--radius-sm)}
.home-guide-eyebrow{margin:0 0 0.35rem;color:var(--coral-text);font-size:1rem;font-weight:750;letter-spacing:0.04em;text-transform:uppercase}
.home-guide h2{margin:0 0 0.75rem}
.home-guide p{font-size:1.05rem}
@media (max-width:40rem){.home-guide{grid-template-columns:1fr;text-align:center}.home-guide figure{max-width:13rem;margin-inline:auto}.home-guide .button{justify-self:center}}

/* Other approaches under How We Help */
.home-modalities-more{margin-top:2.25rem;text-align:center}
.home-modalities-more h3{margin:0 0 1rem}
.home-modalities-more .chip-list span{background:var(--white)}

/* Sticky book and call bar, phones only */
.home-sticky-book{display:none}
@media (max-width:52rem){
  .home-sticky-book{position:fixed;z-index:60;left:0;right:0;bottom:0;display:grid;grid-template-columns:1fr 1fr;gap:0.6rem;padding:0.6rem 0.75rem calc(0.6rem + env(safe-area-inset-bottom));background:var(--white);border-top:1px solid var(--line);box-shadow:0 -8px 24px rgba(5,42,55,0.12)}
  .home-sticky-book .button{width:100%;min-height:3rem;padding-inline:0.75rem;font-size:1rem;justify-self:stretch}
  .home-sticky-book .button-call{color:var(--teal);background:var(--white);border-color:var(--teal)}
  body.template-home{padding-bottom:calc(4.4rem + env(safe-area-inset-bottom))}
}

/* Phones: lift the accessibility widget and back-to-top button above the sticky bar */
@media (max-width:52rem){
  .template-home .back-to-top{bottom:calc(5rem + env(safe-area-inset-bottom))}
  .template-home .userway_buttons_wrapper{bottom:calc(5rem + env(safe-area-inset-bottom)) !important}
  .home-proof-strip{gap:0.5rem 1.25rem}
}

/* 16px floor for homepage body text that the shared stylesheet sets smaller */
.template-home .insurance-item figcaption,
.template-home .service-card-copy,
.template-home .team-profile-detail,
.template-home .home-benefits-section .button,
.template-home .post-card-meta,
.template-home .post-card-descriptive-cta,
.template-home .post-card-descriptive-cta span,
.template-home .standalone-contact-form-section label,
.template-home .standalone-contact-form-section legend,
.template-home .standalone-contact-form-section a{font-size:1rem}

/* The shared iframe{min-height:24rem} made the playing video taller than its 16:9 box, cropping it */
.lite-video iframe{min-height:0;height:100%;border-radius:0}

/* Hero background video (Delia's request): muted loop behind a teal overlay. The leaf image stays as the fallback */
.home-hero-videos{position:absolute;inset:0;z-index:-2;overflow:hidden;pointer-events:none}
.home-hero-videos video{position:absolute;inset:0;width:100%;height:100%;min-height:0;object-fit:cover;border:0;border-radius:0;background:transparent;opacity:0;transition:opacity 2000ms ease}
.home-hero-videos video.is-active{opacity:1}
.home-hero-section.home-hero-bg::before{position:absolute;z-index:-1;inset:0;background:rgba(2,47,63,0.76);content:"";pointer-events:none}
@media (prefers-reduced-motion:reduce){.home-hero-videos{display:none}}

/* Fee cards: the shared stylesheet ends with teal text on the purple-blue bar, and its width calc is invalid, so the bar sat as a box. Full-width teal bar, white text */
.home-pricing-section .pricing-grid .pricing-card h3{align-self:stretch;width:auto;margin-inline:-1.5rem;color:var(--white);background:var(--teal)}
.home-pricing-section .pricing-price{color:var(--teal)}