/*
 * Dr. Boboev Maternity Center — LIV Portal V3
 * Adds the search-first order, filtered physician catalog,
 * and health-atlas style content hierarchy.
 */

/* Search block should sit directly under the hero. */
.premium-benefits {
    display: none !important;
}

.liv-search-section {
    margin-top: -68px;
}

/* Services: denser medical-branch catalog. */
#services.section {
    padding-top: 66px;
}

#services .services-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 14px;
}

#services .service-card {
    min-width: 0;
    overflow: hidden;
    border-radius: 13px;
    box-shadow: 0 8px 24px rgba(42, 31, 36, .055);
}

#services .service-card img {
    height: 165px;
}

#services .service-card .card-body {
    min-height: 190px;
    padding: 17px;
}

#services .service-card h3 {
    margin-bottom: 8px;
    font-size: 16px;
    line-height: 1.35;
}

#services .service-card p {
    font-size: 12px;
    line-height: 1.55;
}

/* Common section heading. */
.liv-section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    margin-bottom: 38px;
}

.liv-section-head > div {
    max-width: 790px;
}

.liv-eyebrow {
    display: inline-flex;
    margin-bottom: 10px;
    color: #bc3d6d;
    font-size: 10px;
    font-weight: 950;
    letter-spacing: .13em;
}

.liv-section-head h2 {
    margin: 0 0 11px;
    color: #252125;
    font-size: clamp(34px, 3vw, 45px);
    line-height: 1.1;
    letter-spacing: -.035em;
}

.liv-section-head p {
    margin: 0;
    color: #746c71;
    font-size: 15.5px;
    line-height: 1.7;
}

.liv-outline-link {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    flex: 0 0 auto;
    padding: 9px 14px;
    border: 1px solid rgba(188,61,109,.22);
    border-radius: 999px;
    color: #8f284e;
    background: #fff;
    text-decoration: none;
    font-size: 12px;
    font-weight: 850;
}

.liv-outline-link span {
    transition: transform .2s ease;
}

.liv-outline-link:hover span {
    transform: translateX(3px);
}

/* Doctor catalog. */
.liv-doctors-section {
    background: #fff;
}

.liv-doctor-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin: -9px 0 28px;
}

.liv-doctor-filters button {
    min-height: 34px;
    padding: 7px 12px;
    border: 1px solid rgba(54,43,48,.12);
    border-radius: 999px;
    color: #5c5358;
    background: #fff;
    font: inherit;
    font-size: 11px;
    font-weight: 800;
    cursor: pointer;
}

.liv-doctor-filters button:hover,
.liv-doctor-filters button.active {
    color: #fff;
    border-color: #bc3d6d;
    background: #bc3d6d;
}

.liv-doctor-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.liv-doctor-card {
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(54,43,48,.11);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 9px 28px rgba(45,34,39,.055);
}

.liv-doctor-card[hidden] {
    display: none !important;
}

.liv-doctor-photo {
    position: relative;
    height: 330px;
    display: block;
    overflow: hidden;
    background: linear-gradient(145deg, #f8edf2, #f5f2f6);
}

.liv-doctor-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    transition: transform .35s ease;
}

.liv-doctor-card:hover .liv-doctor-photo img {
    transform: scale(1.025);
}

.liv-doctor-photo-placeholder {
    width: 100%;
    height: 100%;
    display: grid;
    place-items: center;
    color: rgba(188,61,109,.38);
    font-size: 40px;
    font-weight: 950;
}

.liv-doctor-arrow {
    position: absolute;
    right: 12px;
    top: 12px;
    width: 35px;
    height: 35px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: rgba(35,29,32,.72);
    backdrop-filter: blur(8px);
}

.liv-doctor-body {
    padding: 18px;
}

.liv-doctor-specialty {
    display: block;
    margin-bottom: 7px;
    color: #bc3d6d;
    font-size: 9.5px;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.liv-doctor-body h3 {
    margin: 0 0 8px;
    font-size: 18px;
    line-height: 1.28;
}

.liv-doctor-body h3 a {
    color: #292428;
    text-decoration: none;
}

.liv-doctor-body p {
    margin: 0 0 15px;
    color: #746c71;
    font-size: 11.5px;
}

.liv-doctor-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 7px;
    padding-top: 13px;
    border-top: 1px solid rgba(54,43,48,.09);
}

.liv-doctor-actions a {
    min-height: 37px;
    display: grid;
    place-items: center;
    padding: 7px 8px;
    border: 1px solid rgba(54,43,48,.11);
    border-radius: 9px;
    color: #53494e;
    background: #fff;
    text-decoration: none;
    font-size: 10.5px;
    font-weight: 850;
    text-align: center;
}

.liv-doctor-actions a.primary {
    color: #fff;
    border-color: #bc3d6d;
    background: #bc3d6d;
}

/* Health Atlas. */
.liv-health-atlas {
    background: #f7f6f7;
}

.liv-atlas-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(300px, .7fr);
    gap: 22px;
    align-items: start;
}

.liv-atlas-featured {
    display: grid;
    gap: 15px;
}

.liv-atlas-main-card {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
    overflow: hidden;
    min-height: 360px;
    border: 1px solid rgba(54,43,48,.11);
    border-radius: 15px;
    color: #292428;
    background: #fff;
    box-shadow: 0 9px 28px rgba(45,34,39,.055);
    text-decoration: none;
}

.liv-atlas-main-media {
    position: relative;
    min-height: 330px;
    overflow: hidden;
    background: #ece9eb;
}

.liv-atlas-main-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.liv-atlas-main-media > span {
    position: absolute;
    left: 15px;
    bottom: 15px;
    padding: 7px 9px;
    border-radius: 8px;
    color: #fff;
    background: rgba(35,29,32,.72);
    font-size: 9.5px;
    font-weight: 900;
}

.liv-atlas-placeholder {
    width: 100%;
    height: 100%;
    background:
        radial-gradient(circle at 30% 20%, rgba(188,61,109,.18), transparent 28%),
        linear-gradient(145deg, #f6e9ee, #ece9ed);
}

.liv-atlas-main-body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 30px;
}

.liv-atlas-main-body time,
.liv-atlas-small-card time {
    display: block;
    margin-bottom: 9px;
    color: #9a8f94;
    font-size: 9.5px;
    font-weight: 800;
}

.liv-atlas-main-body h3 {
    margin: 0 0 12px;
    color: #252125;
    font-size: clamp(24px, 2.4vw, 34px);
    line-height: 1.18;
    letter-spacing: -.03em;
}

.liv-atlas-main-body p {
    margin: 0 0 18px;
    color: #746c71;
    font-size: 13px;
    line-height: 1.7;
}

.liv-atlas-main-body b,
.liv-atlas-small-card span {
    color: #8f284e;
    font-size: 11px;
}

.liv-atlas-empty {
    display: block;
    min-height: 260px;
}

.liv-atlas-small-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 14px;
}

.liv-atlas-small-card {
    display: grid;
    grid-template-columns: 125px minmax(0,1fr);
    min-height: 125px;
    overflow: hidden;
    border: 1px solid rgba(54,43,48,.10);
    border-radius: 13px;
    color: #292428;
    background: #fff;
    text-decoration: none;
}

.liv-atlas-small-card > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.liv-atlas-small-card > div {
    padding: 14px;
}

.liv-atlas-small-card strong {
    display: block;
    margin-bottom: 9px;
    font-size: 13px;
    line-height: 1.4;
}

.liv-atlas-sidebar {
    display: grid;
    gap: 14px;
}

.liv-atlas-side-block {
    padding: 21px;
    border: 1px solid rgba(54,43,48,.10);
    border-radius: 14px;
    background: #fff;
}

.liv-atlas-side-block.dark {
    color: #fff;
    border-color: #2c272a;
    background: #2c272a;
}

.liv-atlas-side-head {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 16px;
}

.liv-atlas-side-head > span {
    color: #bc3d6d;
    font-size: 9.5px;
    font-weight: 950;
}

.liv-atlas-side-block.dark .liv-atlas-side-head > span {
    color: #f29bbb;
}

.liv-atlas-side-head strong {
    font-size: 15px;
}

.liv-atlas-links,
.liv-atlas-action-links {
    display: grid;
}

.liv-atlas-links a,
.liv-atlas-action-links a {
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 0;
    border-bottom: 1px solid rgba(54,43,48,.08);
    color: #4e4549;
    text-decoration: none;
    font-size: 11.5px;
    font-weight: 760;
}

.liv-atlas-links a:last-child,
.liv-atlas-action-links a:last-child {
    border-bottom: 0;
}

.liv-atlas-action-links a {
    color: rgba(255,255,255,.86);
    border-bottom-color: rgba(255,255,255,.09);
}

.liv-atlas-links b {
    color: #bc3d6d;
}

.liv-atlas-action-links b {
    color: #f29bbb;
}

.liv-atlas-all {
    display: inline-flex;
    margin-top: 15px;
    color: #8f284e;
    text-decoration: none;
    font-size: 11px;
    font-weight: 850;
}

/* Existing gallery/video sections get a simpler portal look. */
#gallery.section,
#videos.section,
#contact.section,
#appointment.section {
    padding-top: 76px;
    padding-bottom: 76px;
}

#gallery .gallery-preview,
#videos .video-card,
#contact .info-card,
#appointment .appointment-form {
    border-radius: 13px;
}

/* Responsive */
@media (max-width: 1250px) {
    #services .services-grid {
        grid-template-columns: repeat(3, minmax(0,1fr));
    }

    .liv-doctor-grid {
        grid-template-columns: repeat(3, minmax(0,1fr));
    }
}

@media (max-width: 950px) {
    .liv-atlas-layout {
        grid-template-columns: 1fr;
    }

    .liv-atlas-sidebar {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }

    .liv-doctor-grid {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}

@media (max-width: 700px) {
    .liv-section-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 17px;
    }

    #services .services-grid {
        grid-template-columns: 1fr;
    }

    #services .service-card img {
        height: 210px;
    }

    .liv-doctor-grid {
        grid-template-columns: 1fr;
    }

    .liv-doctor-photo {
        height: 440px;
    }

    .liv-atlas-main-card {
        grid-template-columns: 1fr;
    }

    .liv-atlas-main-media {
        min-height: 260px;
    }

    .liv-atlas-small-grid {
        grid-template-columns: 1fr;
    }

    .liv-atlas-sidebar {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 430px) {
    .liv-doctor-photo {
        height: 395px;
    }

    .liv-atlas-small-card {
        grid-template-columns: 100px minmax(0,1fr);
    }
}