@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&display=swap');

/* ==========================================================================

   1. Design System & CSS Variables

   ========================================================================== */

:root {
  /* Brand Palette */
  --color-pink: #CD8FB2;
  --color-pink-light: #F8EBF2;
  --color-pink-accent: #f469dd;
  --color-blue-dark: #045C8C;
  --color-blue-bright: #1AA0CA;
  --color-blue-accent: #0C9DCB;
  --color-blue-bg: #E7F6FD;
  --color-dark-bg: #2D383A;
  --color-footer-bg: #63757A;
  /* Text & Neutral Colors */
  --color-text-main: #2b2b2b;
  --color-text-muted: #555555;
  --color-text-light: #a1a1a1;
  --color-white: #ffffff;
  /* Typography */
  --font-main: 'Poppins', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  /* Utilities & Elevation */
  --shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.05);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.12);
  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-pill: 50px;
  --transition-fast: 0.25s ease;
  --transition-smooth: 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

/* ==========================================================================

   2. Reset & Core Base Styles

   ========================================================================== */

*, *::before, *::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 110px;
}

body {
  font-family: var(--font-main) !important;
  font-size: 1.125rem;
  line-height: 1.6;
  color: var(--color-text-main);
  background-color: var(--color-white);
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

a {
  color: inherit;
  text-decoration: none;
  transition: color var(--transition-fast);
}

/* Global Image Reset - Explicitly No Box Shadows */

img {
  max-width: 100%;
  height: auto;
  display: block;
  box-shadow: none !important;
}

/* Base Headings */

h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  font-weight: 700;
  line-height: 1.25;
}

h2, h4 {
  color: var(--color-pink)
}
h4 {
  margin-top: 3rem !important;
}
.section-title {
  color: var(--color-pink);
  font-size: 2.25rem;
  margin-bottom: 1.875rem;
  text-align: center;
}

/* ==========================================================================

   3. Header & Navigation

   ========================================================================== */

#primeagile__11100__13,

.sticky-top {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 90px;
  background-color: rgba(231, 246, 253, 0.95);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  z-index: 1000;
  box-shadow: var(--shadow-sm);
  transition: all var(--transition-fast);
}

#primeagile__11100__13 .navbar,

nav.top-menu {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100%;
  padding: 0 2rem;
  max-width: 1300px;
  margin: 0 auto;
  box-shadow: none;
  font-family: var(--font-main)
}
nav img {
  width: 10rem ;
}

.navbar-nav {
  display: flex;
  gap: 0.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.navbar-nav a,

.sc-hjsuWn a {
  text-decoration: none;
  padding: 0.6rem 1.2rem;
  color: var(--color-blue-dark) !important;
  font-weight: 500;
  font-size: 1rem;
  border-radius: var(--radius-pill);
  transition: all var(--transition-fast);
  position: relative;
}

.navbar-nav a:hover,

.sc-hjsuWn a:hover {
  color: var(--color-pink);
  background-color: rgba(205, 143, 178, 0.12);
  transform: translateY(-1px);
}

#primeagile__11588__11086 {
  padding-top: 90px;
  background: var(--color-dark-bg);
}

    .hero-text {
      max-width: 620px;
    }

 

    .hero-text .eyebrow {
      margin: 0 0 12px;
      font-size: 2rem;
      font-weight: 500;
      color: #d58fb5;
    }

 

    .hero-text h1 {
      margin: 0;
      font-size: 4rem;
      line-height: 1.25;
      font-weight: 700;
      color: #0b5c8a;
    }

 

    @media (max-width: 480px) {

      .hero-text h1 {
        font-size: 28px;
      }

    }

/* ==========================================================================

   4. Banner & Hero Carousel Section

   ========================================================================== */

.banner-text-styles {
  position: absolute;
  top: 50%;
  left: 6%;
  transform: translateY(-50%);
  width: min(90%, 420px);
  z-index: 10;
  padding: 0;
}

.maternalhome {
  padding: 0px !important;
  margin: 0px !important;
}

#primeagile__11086 .carousel_item_primeagile {
  display: grid !important;
  place-content: center !important;
  grid-template-rows: 1fr;
  grid-template-columns: 1fr;
}

#primeagile__11086,

#primeagile__11086 .carousel_item_primeagile {
  max-width: 100vw !important;
  margin-left: 0 !important;   /* remove the earlier calc() margin, it's causing the 16px left gap */
}

#primeagile__11086 .slick-list {
  width: 100vw;
}

#primeagile__11086 {
  position: relative;
  left: 50%;
  transform: translateX(-50%);  /* centers it on the screen even if a parent is narrower */
}

#primeagile__11086 .carousel_item_primeagile > img {
  width: 100% !important;
  max-width: none !important;   /* your global img rule limits it to its parent's width */
  height: 44rem;
  object-fit: cover;
}

#primeagile__11086 .carousel_item_primeagile > div {
  align-self: center;
  margin: 5rem;
}

#primeagile__11086 .carousel_item_primeagile > div .CTA-blue {
  margin: 4rem 0;
}

#primeagile__11086 .carousel_item_primeagile > div, 

#primeagile__11086 .carousel_item_primeagile > img {
  grid-row: 1/2 !important;
  grid-column: 1/2 !important;
}

.banner-text-styles h2 {
  font-size: 2.875rem;
  color: var(--color-pink);
  line-height: 1.2;
  font-weight: 700;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
  margin-bottom: 1rem;
  animation: fadeInUp 0.8s ease-out forwards;
}

.banner-text-styles h3 {
  color: var(--color-white);
  font-weight: 600;
  margin-bottom: 1.875rem;
  line-height: 1.3;
  font-size: 1.5rem;
  animation: fadeInUp 0.8s ease-out 0.2s forwards;
  opacity: 0;
}

.banner-slider img {
  width: 100%;
  object-fit: cover;
  border-radius: 0 0 var(--radius-md) var(--radius-md);
  box-shadow: none !important;
}

/* Decorative Hero Header Below Banner */

#primeagile__12153__11551,

#primeagile__11551 {
  background-color: var(--color-pink);
  padding: 5rem 1rem;
  text-align: center;
}

#primeagile__12153__11551 h2,

#primeagile__11551 h2 {
  color: var(--color-white);
  font-size: 2rem;
  margin: 0;
  font-weight: 600;
  letter-spacing: 0.5px;
}

/* ==========================================================================

   5. Call To Action (CTA) Buttons

   ========================================================================== */

.CTA-blue {
  display: inline-block;
  padding: 0.875rem 1.75rem;
  background: var(--color-blue-bright);
  border-radius: var(--radius-pill);
  width: auto;
  min-width: 260px;
  text-align: center;
  color: var(--color-white);
  font-weight: 600;
  box-shadow: 0 4px 15px rgba(26, 160, 202, 0.35);
  transition: all var(--transition-fast);
  cursor: pointer;
  border: none;
}

.CTA-blue a {
  text-decoration: none;
  color: var(--color-white);
  display: block;
}

.CTA-blue:hover {
  background-color: #168BB0;
  transform: translateY(-3px);
  box-shadow: 0 8px 22px rgba(26, 160, 202, 0.45);
}
#primeagile__11081 >div > div {
  display: grid;
  place-items: center;
}
.cta-pink, #primeagile__11587__11063 {
  display: inline-block;
  color: var(--color-white);
  border: none;
  background: var(--color-pink);
  padding: 0.875rem .2rem;
  border-radius: var(--radius-pill);
  font-family: inherit;
  text-align: center;
  font-weight: 600;
  text-decoration: none;
  box-shadow: 0 4px 15px rgba(205, 143, 178, 0.35);
  transition: all var(--transition-fast);
  cursor: pointer;
  margin: 0  10rem;
}

.cta-pink a,

.cta-pink a:link,

.cta-pink a:visited {
  color: var(--color-white);
  text-decoration: none;
}

.cta-pink:hover,
#primeagile__11587__11063:hover {
  background: #B8799C;
  transform: translateY(-3px);
  box-shadow: 0 8px 22px rgba(205, 143, 178, 0.45);
}

.blue-bar {
  background: var(--color-blue-accent);
  color: var(--color-white);
  padding: 3.5rem 2rem;
  text-align: center;
  display: flex;
  place-content: center;
  place-items: center
}

.CTA-withbg {
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), 
              url('https://images.primeagile.com/maternalmiracles_com/image/11677/cta-bg-1.jpg') no-repeat center/cover;
  color: var(--color-white);
  padding: 4rem 2rem;
  text-align: center;
  display: flex;
  place-content: center;
  align-items: center;
}

/* ==========================================================================

   6. Testimonials Carousel Section

   ========================================================================== */

.testimonial-carousel {
  position: relative;
  z-index: 20;
  max-width: 680px !important;
  width: 90%;
  margin: -50px auto 3.5rem !important;
  padding: 2.75rem 3.5rem 3.25rem !important;
  background: var(--color-white);
  border-radius: var(--radius-md);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
  text-align: center;
}

/* Outer Decorative Quotation Marks */

.testimonial-carousel::before {
  content: "";
  position: absolute;
  top: 8px;
  left: -54px;
  width: 40px;
  height: 36px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 32' fill='rgba(255,255,255,0.55)'%3E%3Cpath d='M8 0h6v1H8zM7 1h8v1H7zM5 2h11v1H5zM5 3h12v1H5zM3 4h14v1H3zM3 5h15v1H3zM3 6h15v1H3zM3 7h15v1H3zM1 8h8v1H1zm18 0h8v1h-8zM1 9h8v1H1zm18 0h8v1h-8zM1 10h8v1H1zm18 0h8v1h-8zM1 11h8v1H1zm18 0h8v1h-8zM1 12h8v1H1zm18 0h8v1h-8zM1 13h8v1H1zm18 0h8v1h-8zM1 14h8v1H1zm18 0h8v1h-8zM1 15h8v1H1zm18 0h8v1h-8zM0 16h16v1H0zm18 0h16v1H18zM0 17h16v1H0zm18 0h16v1H18zM0 18h16v1H0zm18 0h16v1H18zM0 19h16v1H0zm18 0h16v1H18zM0 20h16v1H0zm18 0h16v1H18zM0 21h16v1H0zm18 0h16v1H18zM0 22h16v1H0zm18 0h16v1H18zM0 23h16v1H0zm18 0h16v1H18zM0 24h16v1H0zm18 0h16v1H18zM0 25h16v1H0zm18 0h16v1H18zM0 26h16v1H0zm18 0h16v1H18zM0 27h16v1H0zm18 0h16v1H18zM0 28h16v1H0zm18 0h16v1H18zM0 29h16v1H0zm18 0h16v1H18zM1 30h14v1H1zm18 0h14v1h-14zM2 31h12v1H2zm18 0h12v1h-12z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  pointer-events: none;
  z-index: 1;
}

.testimonial-carousel::after {
  content: "";
  position: absolute;
  bottom: 8px;
  right: -54px;
  width: 40px;
  height: 36px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 32' fill='%23CD8FB2' opacity='0.45'%3E%3Cpath d='M2 0h12v1H2zm18 0h12v1h-12zM1 1h14v1H1zm18 0h14v1h-14zM0 2h16v1H0zm18 0h16v1H18zM0 3h16v1H0zm18 0h16v1H18zM0 4h16v1H0zm18 0h16v1H18zM0 5h16v1H0zm18 0h16v1H18zM0 6h16v1H0zm18 0h16v1H18zM0 7h16v1H0zm18 0h16v1H18zM0 8h16v1H0zm18 0h16v1H18zM0 9h16v1H0zm18 0h16v1H18zM0 10h16v1H0zm18 0h16v1H18zM0 11h16v1H0zm18 0h16v1H18zM0 12h16v1H0zm18 0h16v1H18zM0 13h16v1H0zm18 0h16v1H18zM0 14h16v1H0zm18 0h16v1H18zM0 15h16v1H0zm18 0h16v1H18zM8 16h8v1H8zm18 0h8v1h-8zM8 17h8v1H8zm18 0h8v1h-8zM8 18h8v1H8zm18 0h8v1h-8zM8 19h8v1H8zm18 0h8v1h-8zM8 20h8v1H8zm18 0h8v1h-8zM8 21h8v1H8zm18 0h8v1h-8zM8 22h8v1H8zm18 0h8v1h-8zM8 23h8v1H8zm18 0h8v1h-8zM7 24h15v1H7zM7 25h15v1H7zM7 26h15v1H7zM6 27h15v1H6zM6 28h13v1H6zM7 29h11v1H7zM8 30h8v1H8zM9 31h6v1H9z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  pointer-events: none;
  z-index: 1;
}

/* Slick Track & Slide Overrides */

.testimonial-carousel .slick-list {
  width: 100% !important;
  overflow: hidden;
}

.testimonial-carousel .slick-track {
  display: flex !important;
  align-items: center;
}

.testimonial-carousel .slick-slide {
  outline: none;
  float: none;
  height: auto;
}

.testimonial-carousel .carousel_item_primeagile {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: center;
}

.testimonial-carousel .carousel_item_primeagile > div {
  margin: 0 !important;
  padding: 0 !important;
  align-self: auto !important;
  grid-row: auto !important;
  grid-column: auto !important;
}

.testimonial-carousel .carousel-item-text {
  margin: 0 auto;
  text-align: center;
}

/* Quote Text & Author Typography */

.testimonial-carousel p {
  font-family: var(--font-main);
  font-size: 1.125rem;
  line-height: 1.65;
  color: var(--color-text-main);
  margin: 0 0 1.25rem 0;
  letter-spacing: -0.01em;
  text-align: center;
}

.testimonial-carousel strong {
  display: inline-block;
  color: var(--color-blue-dark);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.2px;
  margin-top: 0.25rem;
}

/* Bottom Centered Navigation Arrows */

.testimonial-carousel .slick-arrow {
  position: absolute !important;
  top: auto !important;
  bottom: 1.35rem !important;
  transform: none !important;
  width: 28px !important;
  height: 20px !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: none !important;
  outline: none !important;
  cursor: pointer !important;
  font-size: 0 !important;
  color: transparent !important;
  line-height: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 10 !important;
  transition: opacity var(--transition-fast) !important;
}

.testimonial-carousel .slick-prev {
  left: calc(50% - 32px) !important;
  right: auto !important;
}

.testimonial-carousel .slick-next {
  left: calc(50% + 10px) !important;
  right: auto !important;
}

.testimonial-carousel .slick-prev::before {
  content: "" !important;
  display: block !important;
  width: 22px !important;
  height: 14px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16' fill='none'%3E%3Cpath d='M7 2L1 8L7 14M1 8H23' stroke='%238EA3AD' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
  transition: transform var(--transition-fast) !important;
}

.testimonial-carousel .slick-next::before {
  content: "" !important;
  display: block !important;
  width: 22px !important;
  height: 14px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16' fill='none'%3E%3Cpath d='M17 2L23 8L17 14M23 8H1' stroke='%230C9DCB' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
  transition: transform var(--transition-fast) !important;
}

.testimonial-carousel .slick-prev:hover::before {
  transform: translateX(-3px);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16' fill='none'%3E%3Cpath d='M7 2L1 8L7 14M1 8H23' stroke='%230C9DCB' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
}

.testimonial-carousel .slick-next:hover::before {
  transform: translateX(3px);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16' fill='none'%3E%3Cpath d='M17 2L23 8L17 14M23 8H1' stroke='%23045C8C' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
}

.testimonial-carousel .slick-arrow.slick-disabled {
  opacity: 0.3 !important;
  cursor: default !important;
  pointer-events: none !important;
}

/* Hide Slick Dots */

.testimonial-carousel .slick-dots {
  display: none !important;
}

#primeagile__11589__11087 .carousel-inner {
  width: 90%;
  max-width: 600px;
  background: var(--color-white);
  padding: 2rem;
  border-radius: var(--radius-md);
  margin: 1.5rem auto;
  text-align: center;
  box-shadow: var(--shadow-sm);
}

/* ==========================================================================

   7. About Jayden Section

   ========================================================================== */

#primeagile__11582__11082,

#primeagile__11082 {
  /* padding: 5rem 1.5rem 3rem; */
  max-width: 1200px;
  margin: 0 auto;
}

#primeagile__11099 p,

#primeagile__11082 h2 {
  color: var(--color-pink);
  font-size: 2.25rem;
  /* font-weight: 700; */
  /* text-align: center; */
  margin-bottom: 2rem;
}

.jayden {
  width: 100%;
  border-radius: var(--radius-md);
  box-shadow: none !important; /* Explicitly removed */
  transition: transform var(--transition-smooth);
}

.jayden:hover {
  transform: scale(1.02);
}

.social-links {
  margin: 2rem 0 1rem;
}

.social-links ul {
  padding: 0;
  margin: 0;
  list-style: none;
  display: flex;
  gap: 1.25rem;
}

.social-links ul li {
  padding: 0;
}

.social-links img {
  width: 36px;
  height: 36px;
  box-shadow: none !important;
  transition: transform var(--transition-fast), opacity var(--transition-fast);
}

.social-links img:hover {
  transform: translateY(-3px);
  opacity: 0.85;
}

/* ==========================================================================

   8. Doula Services Section

   ========================================================================== */

#primeagile__11573__11073,

#primeagile__11073 {
  padding: 5rem 1.5rem;
  max-width: 1200px;
  margin: 0 auto;
}

.ser-imgs {
  width: 100%;
  border-collapse: separate;
  border-spacing: 12px;
}

.ser-imgs tr td {
  padding: 0;
}

.ser-imgs img {
  width: 100%;
  border-radius: var(--radius-sm);
  box-shadow: none !important; /* Explicitly removed */
  transition: transform var(--transition-smooth);
}

.ser-imgs img:hover {
  transform: scale(1.03);
}

.services-text ul {
  padding-left: 0;
  margin: 0;
}

.services-text ul li {
  list-style: none;
  background: url('https://images.primeagile.com/maternalmiracles_com/image/11674/arrow.png') no-repeat left 8px;
  background-size: 16px;
  padding-left: 2.25rem;
  line-height: 1.8;
  margin-bottom: 0.875rem;
  color: var(--color-text-main);
}

/* Phase Cards: Before Labor, During Labor, Postpartum */

#primeagile__11577__11077,
#primeagile__11077 {
  margin: 3.5rem auto 2.5rem;
  max-width: 1200px;
}

/* 3-Column Grid for the 3 Phase Cards */
#primeagile__11077 #primeagile__11301 [style*="min-height"] > div,
#primeagile__11577__11077 #primeagile__11301 [style*="min-height"] > div {
  /* display: grid !important; */
  /* grid-template-columns: repeat(3, 1fr) !important; */
  /* gap: 0.75rem !important; */
  /* align-items: stretch !important; */
  /* margin: 0 !important; */
}

/* Hide spacer divs */
#primeagile__11077 div[style*="height:100px"],
#primeagile__11077 div[style*="height: 100px"],
#primeagile__11577__11077 div[style*="height:100px"],
#primeagile__11577__11077 div[style*="height: 100px"] {
  display: none !important;
}

/* Individual Card Styling */
#primeagile__11077 #primeagile__11301 [style*="min-height"] > div > .row,
#primeagile__11577__11077 #primeagile__11301 [style*="min-height"] > div > .row {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  border-radius: 16px 16px 0 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08) !important;
  transition: transform var(--transition-smooth) !important;
  background-color: #2D383A;
}

#primeagile__11077 #primeagile__11301 [style*="min-height"] > div > .row:hover,
#primeagile__11577__11077 #primeagile__11301 [style*="min-height"] > div > .row:hover {
  transform: translateY(-4px);
}

/* Background Image Container */
#primeagile__11077 .row .col-sm-6:has(img),
#primeagile__11077 .row .col-sm-6:last-of-type,
#primeagile__11577__11077 .row .col-sm-6:has(img),
#primeagile__11577__11077 .row .col-sm-6:last-of-type {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  z-index: 1 !important;
}

#primeagile__11077 .row .col-sm-6 img,
#primeagile__11577__11077 .row .col-sm-6 img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

/* Text Container */
#primeagile__11077 .row .col-sm-6:first-of-type,
#primeagile__11577__11077 .row .col-sm-6:first-of-type {
  position: relative !important;
  z-index: 3 !important;
  width: 100% !important;
  max-width: 100% !important;
  left: 0 !important;
  right: auto !important;
  padding: 1.75rem 1.35rem 2rem !important;
  margin: 0 !important;
  color: var(--color-white) !important;
  flex: 1 !important;
}

/* Card Heading */
#primeagile__11077 .row h2,
#primeagile__11577__11077 .row h2 {
  font-family: var(--font-main) !important;
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: var(--color-white) !important;
  margin: 0 0 1.25rem 0 !important;
  line-height: 1.25 !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4) !important;
}

/* Card Paragraph */
#primeagile__11077 .row p,
#primeagile__11577__11077 .row p {
  font-family: var(--font-main) !important;
  font-size: 0.885rem !important;
  font-weight: 400 !important;
  line-height: 1.55 !important;
  color: rgba(255, 255, 255, 0.95) !important;
  margin: 0 !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5) !important;
}

/* Card 1: Before Labor (Dark Vignette + Dark Grey Bottom Bar) */
#primeagile__11077 [style*="min-height"] > div > .row:nth-of-type(1),
#primeagile__11577__11077 [style*="min-height"] > div > .row:nth-of-type(1) {
  border-bottom: 11px solid #464646 !important;
}

#primeagile__11077 [style*="min-height"] > div > .row:nth-of-type(1)::before,
#primeagile__11577__11077 [style*="min-height"] > div > .row:nth-of-type(1)::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.72));
  z-index: 2;
  pointer-events: none;
}

/* Card 2: During Labor (Teal Overlay + Cyan Bottom Bar) */
#primeagile__11077 [style*="min-height"] > div > .row:nth-of-type(2),
#primeagile__11577__11077 [style*="min-height"] > div > .row:nth-of-type(2) {
  border-bottom: 11px solid #54B9DA !important;
}

#primeagile__11077 [style*="min-height"] > div > .row:nth-of-type(2)::before,
#primeagile__11577__11077 [style*="min-height"] > div > .row:nth-of-type(2)::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(rgba(10, 112, 146, 0.82), rgba(10, 112, 146, 0.88));
  z-index: 2;
  pointer-events: none;
}

/* Card 3: Postpartum (Navy Overlay + Slate Blue Bottom Bar) */
#primeagile__11077 [style*="min-height"] > div > .row:nth-of-type(3),
#primeagile__11577__11077 [style*="min-height"] > div > .row:nth-of-type(3) {
  border-bottom: 11px solid #81ADC5 !important;
}

#primeagile__11077 [style*="min-height"] > div > .row:nth-of-type(3)::before,
#primeagile__11577__11077 [style*="min-height"] > div > .row:nth-of-type(3)::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(rgba(19, 63, 86, 0.82), rgba(19, 63, 86, 0.88));
  z-index: 2;
  pointer-events: none;
}

/* Legacy Card Class Support */
#primeagile__11578__11078,
#primeagile__11579__11079,
#primeagile__11580__11080 {
  padding: 2.25rem 1.75rem;
  border-radius: var(--radius-md);
  color: var(--color-white);
  box-shadow: none !important;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: transform var(--transition-smooth);
}

#primeagile__11581__11081 {
  padding: 2.5rem 1rem;
  text-align: center;
  max-width: 800px;
  margin: 0 auto;
}

/* ==========================================================================

   9. Why Hire a Doula Section

   ========================================================================== */

.why-hire {
  background: var(--color-blue-dark);
  padding: 5rem 1.5rem;
  color: var(--color-white);
}

#primeagile__11570__11070,

.why-hire-text {
  color: var(--color-white);
}

.why-hire-text .bbl {
  padding: 2rem 0;
  border-bottom: 1px dashed rgba(255, 255, 255, 0.25);
  margin-bottom: 1.5rem;
}

.why-hire-text .comp img {
  background: var(--color-white);
  padding: 0.875rem;
  border-radius: var(--radius-sm);
  margin-top: 1rem;
  box-shadow: none !important; /* Explicitly removed */
}

.doula-book {
  color: var(--color-blue-dark);
  background: var(--color-white);
  padding: 2.25rem 1.75rem;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md); /* Kept on card container for depth */
}

.doula-book span {
  color: var(--color-pink);
}

.doula-book ul {
  padding-left: 1.25rem;
  margin: 1rem 0;
}

.doula-book ul li {
  margin-bottom: 0.5rem;
}

.quote-l {
  width: 40px;
  height: 40px;
  background: url('https://images.primeagile.com/maternalmiracles_com/image/11675/q-l.png') no-repeat contain;
  margin-bottom: 0.5rem;
}

.quote-r {
  width: 100%;
  height: 40px;
  background: url('https://images.primeagile.com/maternalmiracles_com/image/11676/q-r.png') no-repeat right contain;
  margin-top: 0.5rem;
}

/* Align Footer Social Icons Horizontally */

.contact a img {
  display: inline-block !important;
  vertical-align: middle;
  margin: 0 8px;
}

/* ==========================================================================

   10. Local Resources Section

   ========================================================================== */

.local-resources {
  padding: 5rem 1.5rem;
  max-width: 1200px;
  margin: 0 auto;
}

#primeagile__11701__11201 strong,

.local-resources strong {
  color: var(--color-blue-dark);
  font-size: 1.25rem;
  margin-top: 1.5rem;
  display: block;
}

.local-resources p {
  margin-bottom: 0.5rem;
  color: var(--color-text-muted);
}

/* ==========================================================================

   11. Footer Section

   ========================================================================== */

#primeagile__11702__11202,

#primeagile__11060 {
  font-family: var(--font-main) !important;
}

 .contact{background: #fff;margin: 0px auto;padding: 40px;/* border-radius: 20px; */text-align:  center; display:}

    .contact-card{ padding: 120px 15px; margin-bottom: 0px;}

    .contact img{ margin: 40px auto;}

    .contact a{text-decoration: none;color:#000;}

    #primeagile__11701__11201 strong{ color:#045C8C;  color: #045C8C;
    margin-top: 25px;
    display: flex;}

    #primeagile__11703__11203{display: flex;
    justify-content: flex-end;
    margin-top: -45px;
    padding-right: 20px;
    color: #a1a1a1;
    font-size: 14px;
                             }

    .contact h4{ color:#CD8FB2} {
  color: var(--color-white);
  background: var(--color-dark-bg);
  text-align: center;
  padding: 1.25rem 1rem;
  margin-bottom: 0;
  font-size: 0.9rem;
}

#primeagile__11703__11203 {
  display: flex;
  justify-content: center;
  padding: 1rem 0;
  color: var(--color-text-light);
  font-size: 0.875rem;
}

/* ==========================================================================

   12. Keyframe Animations & Responsive Breakpoints

   ========================================================================== */

@keyframes fadeInUp {

  from {
    opacity: 0;
    transform: translateY(20px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }

}

/* --- Mobile Devices (Up to 767px) --- */

@media only screen and (max-width: 767px) {
  #primeagile__11077 #primeagile__11301 [style*="min-height"] > div{
  display: grid !important;
    gap: 1rem;
}
  
#primeagile__11577__11077 #primeagile__11301 [style*="min-height"] > div {
  display: flex;
  flex-direction: column;
}
  #primeagile__11100__13,

  .sticky-top {
    height: 70px;
  }

  #primeagile__11588__11086 {
    padding-top: 70px;
  }

  .banner-text-styles {
    position: relative;
    top: 0;
    left: 0;
    transform: none;
    width: 100%;
    padding: 2rem 1.25rem;
    background: var(--color-dark-bg);
  }

  .banner-text-styles h2 {
    font-size: 2rem;
    line-height: 1.25;
  }

  .banner-text-styles h3 {
    font-size: 1.125rem;
  }

  .testimonial-carousel {
    width: 92% !important;
    margin-top: 1.5rem !important;
    padding: 2rem 1.5rem 3.25rem !important;
  }

  .testimonial-carousel::before,

  .testimonial-carousel::after {
    display: none !important;
  }

  .services-text ul li {
    padding-left: 1.75rem;
  }

  .why-hire-text .comp img {
    margin-left: 0;
  }

  .CTA-blue, .cta-pink {
    width: 100%;
  }

  .blue-bar, .CTA-withbg {
    flex-direction: column;
  }
  #primeagile__11086 .carousel_item_primeagile > img {
    width: 200% !important;
    max-width: none !important;   /* your global img rule limits it to its parent's width */
    height: 100%;
    object-position:center ;
    object-fit:fill !important;
  }

}

/* --- Tablets & Small Laptops (768px to 1024px) --- */

@media only screen and (min-width: 768px) and (max-width: 1024px) {

  .banner-text-styles {
    width: 320px;
    left: 4%;
  }

  .banner-text-styles h2 {
    font-size: 2.25rem;
  }

  #primeagile__11077 #primeagile__11301 [style*="min-height"] > div,
  #primeagile__11577__11077 #primeagile__11301 [style*="min-height"] > div,
  #primeagile__11577__11077 {
    grid-template-columns: 1fr !important;
    gap: 1.5rem !important;
  }

}

/* --- Retina Displays --- */

@media screen and (min-device-width: 1200px) and (-webkit-min-device-pixel-ratio: 2) {

  body {
    -webkit-font-smoothing: subpixel-antialiased;
  }

}

.PoweredBy {
  text-align: center;
  font-family: var(--font-main);
}