/* Conversion-focused patterns shared by the IVF and fertility ad landing pages. */
.hc-fertility-landing .hc-page-hero { background: radial-gradient(circle at 85% 10%, rgb(230 60 139 / 11%), transparent 22rem), linear-gradient(135deg, #fffaf8, #f7eef6); }
.hc-fertility-landing .hc-page-hero h1 { font-size: clamp(2.55rem, 5.6vw, 4.75rem); max-width: 15ch; }
.hc-fertility-landing .hc-page-hero .hc-lead { max-width: 43rem; }
.hc-fertility-landing .hc-content-grid { align-items: start; }
.hc-fertility-landing .hc-content-grid > aside { position: sticky; top: 6rem; }
.hc-fertility-landing .hc-service-art { background: var(--hc-color-surface-soft); }
.hc-landing-nav { background: #fff; border-block: 1px solid var(--hc-color-border); position: sticky; top: 0; z-index: 5; }
.hc-landing-nav .hc-container { display: flex; gap: .25rem; overflow-x: auto; padding-block: .65rem; scrollbar-width: thin; }
.hc-landing-nav a { border-radius: 999px; color: var(--hc-color-brand-800); flex: 0 0 auto; font-size: .82rem; font-weight: 750; padding: .55rem .85rem; text-decoration: none; }
.hc-landing-nav a:hover, .hc-landing-nav a:focus-visible { background: var(--hc-color-surface-soft); color: var(--hc-color-accent-600); }
.hc-landing-nav a:last-child { background: var(--hc-color-accent-600); color: #fff; margin-left: auto; }
.hc-treatment-steps { display: grid; gap: 0; list-style: none; margin: 0 auto; max-width: 58rem; padding: 0; }
.hc-treatment-steps li { display: grid; gap: var(--hc-space-4); grid-template-columns: 3.5rem minmax(0, 1fr); padding-bottom: var(--hc-space-5); position: relative; }
.hc-treatment-steps li:not(:last-child)::before { background: color-mix(in srgb, var(--hc-color-accent-600) 25%, var(--hc-color-border)); bottom: 0; content: ""; left: 1.65rem; position: absolute; top: 3.4rem; width: 2px; }
.hc-treatment-steps span { align-items: center; background: var(--hc-color-brand-900); border-radius: 50%; color: #fff; display: flex; font-size: .75rem; font-weight: 800; height: 3.4rem; justify-content: center; letter-spacing: .06em; width: 3.4rem; }
.hc-treatment-steps h3 { font-size: 1.2rem; margin: .2rem 0 .4rem; }
.hc-treatment-steps p { color: var(--hc-color-text-muted); margin: 0; }
.hc-landing-split { align-items: start; display: grid; gap: clamp(2rem, 7vw, 6rem); grid-template-columns: 1.1fr .9fr; }
.hc-landing-split h2 { margin-block: var(--hc-space-2) var(--hc-space-4); }
.hc-landing-split > div > p:not(.hc-eyebrow) { color: var(--hc-color-text-muted); }
.hc-landing-split > div > p + p { margin-top: var(--hc-space-4); }
.hc-landing-callout { box-shadow: var(--hc-shadow-sm); }
.hc-landing-callout h3 { font-size: 1.35rem; }
.hc-landing-callout .hc-button { margin-top: var(--hc-space-5); width: 100%; }
.hc-landing-feature-grid { display: grid; gap: var(--hc-space-4); grid-template-columns: repeat(3, minmax(0, 1fr)); }
.hc-landing-feature-grid article { background: #fff; border: 1px solid var(--hc-color-border); border-radius: var(--hc-radius-lg); padding: var(--hc-space-5); }
.hc-landing-feature-grid h3 { font-size: 1.2rem; margin-bottom: var(--hc-space-2); }
.hc-landing-feature-grid p { color: var(--hc-color-text-muted); margin: 0; }
.hc-landing-feature-grid + .hc-medical-note { margin-top: var(--hc-space-5); }
@media (max-width: 48rem) {
  .hc-fertility-landing .hc-content-grid > aside { position: static; }
  .hc-landing-nav { top: 0; }
  .hc-landing-nav a:last-child { margin-left: 0; }
  .hc-landing-split, .hc-landing-feature-grid { grid-template-columns: 1fr; }
  .hc-treatment-steps li { grid-template-columns: 3rem minmax(0, 1fr); }
  .hc-treatment-steps span { height: 3rem; width: 3rem; }
  .hc-treatment-steps li:not(:last-child)::before { left: 1.45rem; top: 3rem; }
}