/* ========== Page Styles (scoped) ========== */

.section-title {
  border-bottom: 1px solid rgba(0,0,0,0.08);
  padding-bottom: .4rem;
  margin-bottom: .8rem;
}

/* Insurer list treatment */
.insurer-list .list-group-item {
  padding-left: 0;
  padding-right: 0;
  border: 0;
  border-bottom: 1px solid rgba(0,0,0,0.08);
  background-color: transparent;
}
.insurer-list .list-group-item:last-child {
  border-bottom: 0;
}

/* Optional brand tile styles for a simple logo grid placeholder */
.brand-tile {
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: .5rem;
  padding: 1.25rem;
  text-align: center;
  font-weight: 600;
}

/* Sidebar */
.sticky-sidebar {
  position: sticky;
  top: 10rem;
}

/* Form note */
.form-disclaimer {
  line-height: 1.4;
}

/* Utility spacing overrides (optional) */
header p.small { letter-spacing: .04em; }

body{font-optical-sizing:auto;
         --bs-body-font-family: 'Lato', sans-serif;
         font-size: 1.10rem;
         line-height: 1.5;
         background-color: #f2eef5;
    }

/* Hero */
    .hero{
      position:relative;
      min-height:36vh;
      display:grid;
      place-items:center;
      color:#fff;
      text-align:center
    }
    .hero::before{
      content:"";
      position:absolute;
      inset:0;
      /* Eye exam themed image */
      background:url('/mceyeclinic/images/clinic-color-banner.png') center/cover no-repeat;
      filter:brightness(.55)
    }
    .hero .inner{position:relative;z-index:1}
    /* Breadcrumbs (scoped) */
    .disclaimer-breadcrumbs {
      background: #fff;
      border: 1px solid #eee;
      border-left: 4px solid var(--clinic-purple);
      border-radius: .5rem;
      padding: .5rem .75rem;
      margin-bottom: 1rem;
      margin-top : 1rem;
    }
    .disclaimer-breadcrumbs .breadcrumb { margin: 0; }
    .disclaimer-breadcrumbs .breadcrumb-item + .breadcrumb-item::before { color: #888; }
    .disclaimer-breadcrumbs a { color: var(--clinic-purple); text-decoration: none; }
    .disclaimer-breadcrumbs a:hover { text-decoration: underline; }

    .purple {
      color: rgb(109,60,94);
    }
    /* Ready to Book CSS */
    .btn-purple {
        background-color: rgb(109,60,94);
        border-color: rgb(109,60,94);
        color: #fff;
    }

    .btn-purple:hover,
    .btn-purple:focus {
       background-color: rgb(75, 41, 65);
       border-color: rgb(75, 41, 65);
       color: #fff;
   }

   .btn-outline-purple {
  border-color: rgb(109,60,94);
  color: rgb(109,60,94);
}

.btn-outline-purple:hover,
.btn-outline-purple:focus {
  border-color: rgb(75, 41, 65);
  color: rgb(75, 41, 65);
}

.frame-carousel {
      --gap: 1.25rem;
      --card-bg: #fff;
      --arrow-bg: rgba(255,255,255,.96);
      --arrow-shadow: 0 10px 24px rgba(0,0,0,.22);
      --brand: #6d3c5e; /* clinic mauve */
    }
    .frame-carousel * { box-sizing: border-box; }

    .frame-carousel .wrap { position: relative; }

    .frame-carousel .viewport {
      overflow: hidden;
      width: 100%;
      border-radius: 1rem;
      background:  white;
      border: 2px solid #6d3c5e;
      box-shadow: 0 10px 24px rgba(0,0,0,.06);
      touch-action: pan-y;
      cursor: grab;
    }
    .frame-carousel .viewport.dragging { cursor: grabbing; }

    .frame-carousel .track {
      display: flex;
      align-items: center;
      gap: var(--gap);
      will-change: transform;
      padding: 1.25rem;
    }

    .frame-carousel .cardy {
      flex: 0 0 auto;
      width: clamp(220px, 30vw, 380px);
      background: var(--card-bg);
      border-radius: 1rem;
      border: 1px solid #eee0e9;
      box-shadow: 0 10px 22px rgba(0,0,0,.06);
      padding: 1rem;
      transition: transform .2s ease;
    }
    .frame-carousel .cardy:hover { transform: translateY(-3px); }

    .frame-carousel .logo-box {
      width: 100%;
      aspect-ratio: 5/2;
      display: grid; place-items: center;
    }
    .frame-carousel img {
      max-width: 60%;
      max-height: 70%;
      object-fit: contain;
    }

    /* Overlay arrows (desktop/tablet only) */
    .frame-carousel .ctrl { pointer-events: none; }
    .frame-carousel .ctrl .btn-ghost {
      pointer-events: auto;
      position: absolute; top: 50%; transform: translateY(-50%);
      border: 0; border-radius: 9999px; width: 60px; height: 60px;
      display: grid; place-items: center; background: var(--arrow-bg);
      box-shadow: var(--arrow-shadow);
      transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
      user-select: none;
      backdrop-filter: saturate(120%) blur(4px);
      border: 2px solid rgba(109,60,94,.18);
    }
    .frame-carousel .ctrl .btn-ghost:hover { transform: translateY(-50%) scale(1.06); box-shadow: 0 16px 30px rgba(0,0,0,.26); }
    .frame-carousel .ctrl .btn-prev { left: .5rem; }
    .frame-carousel .ctrl .btn-next { right: .5rem; }

    .frame-carousel .ctrl .chev {
      width: 24px; height: 24px; display: block;
      fill: var(--brand);
    }

    @media (max-width: 767.98px) {
      .frame-carousel .ctrl { display: none; }
    }

    .frame-carousel .hint { font-size: .85rem; color: #6b6470; }

    .purple {
    color: rgb(109,60,94);
}

.listbackground {
  background-color: #f2eef5;
}

.carecreditcolor {
    color: rgb(72, 113, 39);
}

.card-outline-carecredit {
  border-color: rgb(72, 113, 39);
}

.btn-carecredit {
        background-color: rgb(72, 113, 39);
        border-color: rgb(72, 113, 39);
        color: #fff;
    }

    .btn-carecredit:hover,
    .btn-carecredit:focus {
       background-color: rgb(38, 94, 10);
       border-color: rgb(38, 94, 10);
       color: #fff;
   }

   .btn-outline-carecredit {
  border-color: rgb(72, 113, 39);
  color: rgb(72, 113, 39);
}

.btn-outline-carecredit:hover,
.btn-outline-carecredit:focus {
  border-color: rgb(38, 94, 10);
  color: rgb(38, 94, 10);
}