/* Centres index — ported from live samarthivf.com/fertility-center-in-india/ (Elementor page 1163). */

/* Hero */
.ci-hero { min-height: 640px; display: flex; align-items: flex-end; background: #120b1f; }
.ci-hero-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ci-hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(10, 6, 20, 0.7) 0%, rgba(10, 6, 20, 0.2) 55%, rgba(10, 6, 20, 0.05) 100%); }
.ci-hero-in { position: relative; z-index: 1; width: 100%; max-width: var(--sv-content); margin: 0 auto; padding: 60px 40px 90px; display: flex; flex-direction: column; align-items: flex-start; gap: 18px; }
.ci-h1 { max-width: 900px; margin: 0; font-family: 'Montserrat', sans-serif; font-size: 44px; font-weight: 800; line-height: 1.15; letter-spacing: 0.01em; text-transform: uppercase; color: #fff; }
.ci-sub { max-width: 520px; margin: 0; font-family: 'Archivo', sans-serif; font-size: 17px; line-height: 1.6; color: rgba(255, 255, 255, 0.88); }

/* Local presence */
.ci-presence { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 50px; padding: 60px; background: var(--sv-ghost); }
.ci-h2 { margin: 0 0 20px; font-family: 'K2D', sans-serif; font-size: 40px; font-weight: 500; line-height: 1.2; color: var(--sv-purple); }
.ci-h2 span { display: block; font-weight: 700; color: var(--sv-violet); }
.ci-text p { margin: 0 0 14px; font-family: 'Archivo', sans-serif; font-size: 15px; line-height: 1.7; color: var(--sv-slate); }
.ci-text p:last-child { margin: 0; }
.ci-text strong { color: #1d1530; }
.ci-presence-r { position: relative; margin: 0; }
.ci-presence-r img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 25px; }
.ci-presence-r figcaption, .ci-rep { position: absolute; right: 12px; top: 12px; z-index: 1; padding: 3px 10px; border-radius: 999px; background: rgba(29, 21, 48, 0.62); color: #fff; font-family: 'Archivo', sans-serif; font-size: 11px; letter-spacing: 0.04em; }

/* Local care */
.ci-local { max-width: 1250px; margin: 0 auto; padding: 40px 20px 20px; display: flex; flex-direction: column; align-items: center; gap: 30px; }
.ci-pill { margin: 0; padding: 10px 28px; border: 2px solid var(--sv-purple); border-radius: 999px; background: #fff; font-family: 'Montserrat', sans-serif; font-size: 14px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--sv-purple); text-align: center; }
.ci-pill--lg { max-width: 760px; font-size: 18px; line-height: 1.4; }
.ci-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px; width: 100%; }
.ci-card { padding: 30px; border-radius: 25px; background: #fbf7ff; border: 1px solid #e6d9f5; }
.ci-card h2 { margin: 0 0 14px; font-family: 'K2D', sans-serif; font-size: 28px; font-weight: 700; line-height: 1.25; color: var(--sv-purple); }

/* Personalised care band */
.ci-band { min-height: 460px; display: flex; align-items: flex-end; background: url('/img/wp/2026/03/217.jpg.webp') center 30% / cover no-repeat; }
.ci-band::before { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(42, 24, 64, 0.85) 0%, rgba(42, 24, 64, 0.2) 60%, rgba(42, 24, 64, 0) 100%); }
.ci-band-in { position: relative; z-index: 1; max-width: 820px; padding: 40px 50px; }
.ci-band h2 { margin: 0 0 12px; font-family: 'Montserrat', sans-serif; font-size: 38px; font-weight: 700; color: #fff; }
.ci-band p { margin: 0; font-family: 'Archivo', sans-serif; font-size: 16px; line-height: 1.65; color: rgba(255, 255, 255, 0.9); }

/* Finder */
.ci-find { max-width: 1250px; margin: 0 auto; padding: 50px 20px 30px; display: flex; flex-direction: column; align-items: center; gap: 22px; scroll-margin-top: 110px; }
.ci-find-text { max-width: 900px; margin: 0; font-family: 'Archivo', sans-serif; font-size: 16px; line-height: 1.65; color: var(--sv-slate); text-align: center; }
.ci-form { width: 100%; max-width: 1100px; margin-top: 10px; padding: 40px 50px; border-radius: 25px; background: var(--sv-ghost); display: flex; flex-direction: column; gap: 18px; }
.ci-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.ci-form label { display: flex; flex-direction: column; gap: 6px; font-family: 'Montserrat', sans-serif; font-size: 13px; font-weight: 600; color: #1d1530; }
.ci-form label i { font-style: normal; color: #d0244d; }
.ci-form input, .ci-form select { height: 46px; padding: 0 14px; border: 1px solid #d9d2ea; border-radius: 10px; background: #fff; font-family: 'Archivo', sans-serif; font-size: 15px; color: #1d1530; }
.ci-form input:focus, .ci-form select:focus { outline: 2px solid var(--sv-violet); outline-offset: 1px; }
.ci-form .ci-consent { flex-direction: row; align-items: flex-start; gap: 10px; font-family: 'Archivo', sans-serif; font-size: 13px; font-weight: 400; color: var(--sv-slate); }
.ci-consent input { height: auto; margin-top: 3px; }
.ci-consent a { color: var(--sv-purple); }
.ci-error { margin: 0; padding: 10px 14px; border-radius: 10px; background: #fef2f2; border: 1px solid #fca5a5; font-family: 'Archivo', sans-serif; font-size: 14px; color: #991b1b; }
.ci-go { align-self: center; padding: 12px 34px; border: 0; border-radius: 999px; background: var(--sv-grad); font-family: 'Montserrat', sans-serif; font-size: 14px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: #fff; cursor: pointer; transition: transform 0.3s; }
.ci-go:hover { transform: translateY(-3px); }
.ci-go:disabled { opacity: 0.6; cursor: progress; }

@media (max-width: 1024px) {
  .ci-hero { min-height: 520px; }
  .ci-presence { grid-template-columns: 1fr; padding: 40px 30px; }
  .ci-cards { grid-template-columns: 1fr; }
}

@media (max-width: 767px) {
  .ci-hero { min-height: 460px; }
  .ci-hero-in { padding: 40px 20px 50px; }
  .ci-h1 { font-size: 28px; }
  .ci-presence { padding: 30px 18px; gap: 26px; }
  .ci-h2 { font-size: 28px; }
  .ci-card { padding: 22px; }
  .ci-card h2 { font-size: 23px; }
  .ci-band { min-height: 420px; }
  .ci-band-in { padding: 28px 20px; }
  .ci-band h2 { font-size: 28px; }
  .ci-pill--lg { font-size: 15px; padding: 10px 18px; }
  .ci-form { padding: 24px 18px; }
  .ci-row { grid-template-columns: 1fr; gap: 16px; }
}