/**
 * Sante Hospital - Medical Journal & News & YHTT Suite
 * Path: assets/css/pages/page-y-hoc-thuong-thuc.css
 */

/* ========================================================
   SANTE MODERN MEDICAL JOURNAL 2026 (EDITORIAL MAGAZINE)
   Quiet Luxury, Apple Newsroom & Mayo Clinic Health Digest
   ======================================================== */

.sante-news-page-main {
    background-color: #FAFCFB !important;
}

/* 1. MASTHEAD & HERO SPOTLIGHT */
.sante-journal-masthead {
    background: #F8FAFC !important;
    padding: 36px 0 32px 0 !important;
    border-bottom: 1px solid rgba(33, 18, 97, 0.06) !important;
}

.journal-header-block {
    text-align: center !important;
    max-width: 800px !important;
    margin: 0 auto 24px auto !important;
}

.journal-brand-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    background: #FFFFFF !important;
    border: 1px solid rgba(33, 18, 97, 0.1) !important;
    padding: 4px 14px !important;
    border-radius: 99px !important;
    margin-bottom: 10px !important;
    box-shadow: 0 2px 8px rgba(33, 18, 97, 0.04) !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
}

.badge-dot {
    width: 7px !important;
    height: 7px !important;
    background: #00CE7C !important;
    border-radius: 50% !important;
    box-shadow: 0 0 0 2px rgba(0, 206, 124, 0.25) !important;
}

.badge-txt {
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 0.08em !important;
    color: #211261 !important;
}

.badge-verified {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: #008751 !important;
    padding-left: 8px !important;
    border-left: 1px solid rgba(33, 18, 97, 0.12) !important;
}

.journal-title {
    font-size: clamp(24px, 2.6vw, 32px) !important;
    font-weight: 900 !important;
    color: #211261 !important;
    line-height: 1.25 !important;
    margin: 0 0 8px 0 !important;
    letter-spacing: -0.01em !important;
}

.journal-desc {
    font-size: 14px !important;
    color: #334155 !important;
    line-height: 1.55 !important;
    margin: 0 auto !important;
    max-width: 660px !important;
}

/* Bento Hero (60:40) */
.journal-hero-bento {
    display: grid !important;
    grid-template-columns: 1.25fr 1fr !important;
    gap: 20px !important;
    align-items: stretch !important;
}

/* Main Feature (Left) */
.journal-main-feature {
    background: #FFFFFF !important;
    border-radius: 18px !important;
    border: 1px solid rgba(33, 18, 97, 0.08) !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    height: 100% !important;
    box-shadow: 0 4px 18px rgba(33, 18, 97, 0.03) !important;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.journal-main-feature:hover {
    transform: translateY(-3px) !important;
    border-color: #00CE7C !important;
    box-shadow: 0 16px 36px rgba(33, 18, 97, 0.08) !important;
}

.feature-cover {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    aspect-ratio: 16 / 9.5 !important;
    height: auto !important;
    max-height: 250px !important;
    overflow: hidden !important;
    background: #0F172A !important;
}

.feature-cover img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    display: block !important;
    transition: transform 0.5s ease !important;
}

.journal-main-feature:hover .feature-cover img {
    transform: scale(1.05) !important;
}

.feature-cover-overlay {
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(180deg, rgba(33, 18, 97, 0) 60%, rgba(33, 18, 97, 0.3) 100%) !important;
    pointer-events: none !important;
}

.feature-gold-pill {
    display: inline-flex !important;
    align-items: center !important;
    background: #DFBA73 !important;
    color: #211261 !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
    letter-spacing: 0.04em !important;
    padding: 3px 10px !important;
    border-radius: 99px !important;
    line-height: 1.2 !important;
}

.feature-body {
    padding: 20px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    flex: 1 !important;
}

.feature-meta-row {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-bottom: 8px !important;
    flex-wrap: wrap !important;
}

.cat-pill {
    font-size: 10.5px !important;
    font-weight: 800 !important;
    padding: 2px 8px !important;
    border-radius: 99px !important;
}

.cat-pill.pill-teal {
    background: rgba(0, 206, 124, 0.12) !important;
    color: #00A664 !important;
}

.cat-pill.pill-gold {
    background: rgba(223, 186, 115, 0.2) !important;
    color: #A37E1C !important;
}

.cat-pill.pill-navy {
    background: rgba(33, 18, 97, 0.08) !important;
    color: #211261 !important;
}

.meta-date, .meta-readtime {
    font-size: 11.5px !important;
    color: #94A3B8 !important;
    font-weight: 500 !important;
}

.feature-heading {
    font-size: clamp(16.5px, 1.6vw, 19px) !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
    margin: 0 0 8px 0 !important;
    text-transform: capitalize !important;
}

.feature-heading a {
    color: #211261 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

.feature-heading a:hover {
    color: #00CE7C !important;
}

.feature-summary {
    font-size: 13.5px !important;
    color: #64748B !important;
    line-height: 1.55 !important;
    margin: 0 0 16px 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}

.feature-footer {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding-top: 14px !important;
    border-top: 1px solid rgba(33, 18, 97, 0.08) !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.feature-author-info {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.author-avatar {
    width: 32px !important;
    height: 32px !important;
    border-radius: 50% !important;
    background: #211261 !important;
    color: #DFBA73 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.author-name {
    font-size: 11.5px !important;
    font-weight: 800 !important;
    color: #211261 !important;
    display: block !important;
    line-height: 1.2 !important;
}

.author-sub {
    font-size: 10px !important;
    color: #94A3B8 !important;
    display: block !important;
}

.feature-read-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: rgba(0, 206, 124, 0.1) !important;
    color: #00A664 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    padding: 6px 14px !important;
    border-radius: 99px !important;
    text-decoration: none !important;
    transition: all 0.25s ease !important;
}

.feature-read-btn:hover {
    background: #00CE7C !important;
    color: #FFFFFF !important;
    transform: translateX(3px) !important;
}

/* Side Picks (Right) */
.journal-side-picks {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    height: 100% !important;
    justify-content: space-between !important;
}

.side-pick-card {
    background: #FFFFFF !important;
    border-radius: 16px !important;
    border: 1px solid rgba(33, 18, 97, 0.08) !important;
    overflow: hidden !important;
    display: grid !important;
    grid-template-columns: 160px 1fr !important;
    gap: 16px !important;
    padding: 16px !important;
    flex: 1 !important;
    box-shadow: 0 3px 14px rgba(33, 18, 97, 0.03) !important;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
    align-items: stretch !important;
}

.side-pick-card:hover {
    transform: translateY(-2px) !important;
    border-color: #00CE7C !important;
    box-shadow: 0 10px 24px rgba(33, 18, 97, 0.07) !important;
}

.pick-media {
    position: relative !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    display: block !important;
    width: 100% !important;
    aspect-ratio: 16 / 11 !important;
    height: 100% !important;
    max-height: 130px !important;
    flex-shrink: 0 !important;
    background: #F1F5F9 !important;
}

.pick-media img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    display: block !important;
    transition: transform 0.5s ease !important;
}

.side-pick-card:hover .pick-media img {
    transform: scale(1.06) !important;
}

.pick-content {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    min-width: 0 !important;
    height: 100% !important;
}

.pick-title {
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    margin: 0 0 4px 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-transform: capitalize !important;
}

.pick-title a {
    color: #211261 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

.pick-title a:hover {
    color: #00CE7C !important;
}

.pick-desc {
    font-size: 12.5px !important;
    color: #64748B !important;
    line-height: 1.5 !important;
    margin: 0 0 8px 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}

.pick-foot {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding-top: 8px !important;
    border-top: 1px solid rgba(33, 18, 97, 0.08) !important;
}

.pick-views {
    font-size: 11px !important;
    color: #94A3B8 !important;
    font-weight: 500 !important;
}

.pick-link {
    font-size: 12px !important;
    font-weight: 800 !important;
    color: #00CE7C !important;
    text-decoration: none !important;
    transition: transform 0.2s ease !important;
}

.pick-link:hover {
    transform: translateX(3px) !important;
}

@media (max-width: 991px) {
    .journal-hero-bento {
        grid-template-columns: 1fr !important;
    }
    .feature-cover {
        aspect-ratio: 16 / 9 !important;
        max-height: 300px !important;
    }
    .side-pick-card {
        grid-template-columns: 140px 1fr !important;
    }
}

/* ========================================================
   2. TOOLBAR & 3-COLUMN MAGAZINE GRID
   ======================================================== */
.sante-journal-feed-section {
    padding: 32px 0 72px 0 !important;
}

.journal-toolbar {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 16px !important;
    margin-bottom: 28px !important;
    padding-bottom: 18px !important;
    border-bottom: 1px solid rgba(33, 18, 97, 0.08) !important;
}

.filter-pills-bar {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    gap: 10px !important;
    padding: 4px 2px 8px 2px !important;
}

.filter-pills-bar::-webkit-scrollbar {
    display: none !important;
}

.filter-pill {
    background: #FFFFFF !important;
    border: 1px solid rgba(33, 18, 97, 0.12) !important;
    color: #334155 !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    padding: 10px 18px !important;
    min-height: 44px !important;
    border-radius: 99px !important;
    cursor: pointer !important;
    transition: all 0.22s ease !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
}

.filter-pill:hover {
    background: #F1F5F9 !important;
    color: #211261 !important;
    border-color: #211261 !important;
    transform: translateY(-1px) !important;
}

.filter-pill.active {
    background: #211261 !important;
    color: #FFFFFF !important;
    border-color: #211261 !important;
    box-shadow: 0 4px 12px rgba(33, 18, 97, 0.2) !important;
}

.search-box-bar {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
}

.search-icon-svg {
    position: absolute !important;
    left: 14px !important;
    pointer-events: none !important;
}

.search-box-bar input {
    background: #FFFFFF !important;
    border: 1.5px solid rgba(33, 18, 97, 0.14) !important;
    border-radius: 99px !important;
    padding: 10px 38px 10px 38px !important;
    font-size: 13px !important;
    height: 44px !important;
    min-height: 44px !important;
    width: 260px !important;
    outline: none !important;
    color: #1E293B !important;
    transition: all 0.25s ease !important;
    box-sizing: border-box !important;
}

.search-box-bar input:focus {
    border-color: #00CE7C !important;
    box-shadow: 0 0 0 3px rgba(0, 206, 124, 0.14) !important;
    width: 300px !important;
}

.clear-search-btn {
    position: absolute !important;
    right: 12px !important;
    background: #E2E8F0 !important;
    border: none !important;
    color: #334155 !important;
    font-size: 11px !important;
    width: 24px !important;
    height: 24px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}

.clear-search-btn:hover {
    background: #CBD5E1 !important;
    color: #0F172A !important;
}

/* 3-Column Magazine Articles Grid (Synchronized 100% with Y Học Thường Thức) */
.journal-articles-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 28px !important;
}

.journal-card {
    background: #FFFFFF !important;
    border-radius: 20px !important;
    border: 1px solid rgba(33, 18, 97, 0.08) !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    box-shadow: 0 4px 18px rgba(33, 18, 97, 0.03) !important;
    transition: all 0.28s cubic-bezier(0.16, 1, 0.3, 1) !important;
    box-sizing: border-box !important;
}

.journal-card.is-hidden {
    display: none !important;
}

.journal-card:hover {
    transform: translateY(-4px) !important;
    border-color: #00CE7C !important;
    box-shadow: 0 16px 36px rgba(33, 18, 97, 0.09) !important;
}

.journal-card .art-card-cover {
    position: relative !important;
    width: 100% !important;
    aspect-ratio: 1000 / 600 !important;
    height: auto !important;
    min-height: auto !important;
    overflow: hidden !important;
    display: block !important;
    background: #F8FAFC !important;
    border-bottom: 1px solid rgba(33, 18, 97, 0.06) !important;
}

.journal-card .art-card-cover img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    display: block !important;
    transition: transform 0.5s ease !important;
}

.journal-card:hover .art-card-cover img {
    transform: scale(1.06) !important;
}

.journal-card .art-card-body {
    padding: 22px 20px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    flex: 1 !important;
    gap: 14px !important;
    box-sizing: border-box !important;
}

.journal-card .card-badge {
    margin-bottom: 10px !important;
    align-self: flex-start !important;
}

.journal-card .art-card-title {
    font-size: 16.5px !important;
    font-weight: 800 !important;
    line-height: 1.4 !important;
    margin: 0 0 8px 0 !important;
    text-transform: none !important;
}

.journal-card .art-card-title a {
    color: #211261 !important;
    text-decoration: none !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    transition: color 0.2s ease !important;
    min-height: 46px !important;
}

.journal-card .art-card-title a:hover {
    color: #00CE7C !important;
}

.journal-card .art-card-excerpt {
    font-size: 13.5px !important;
    color: #334155 !important;
    line-height: 1.55 !important;
    margin: 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}

.journal-card .art-card-meta {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    flex-wrap: wrap !important;
    font-size: 12px !important;
    color: #475569 !important;
    padding-top: 12px !important;
    border-top: 1px solid rgba(33, 18, 97, 0.06) !important;
    font-weight: 600 !important;
}

.journal-card .art-card-meta .meta-item {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    font-weight: 600 !important;
    color: #475569 !important;
}

.journal-card .art-card-meta .meta-item i {
    font-size: 11px !important;
    color: #64748B !important;
}

/* Empty State */
.journal-empty-state {
    background: #FFFFFF !important;
    border-radius: 16px !important;
    border: 1.5px dashed rgba(33, 18, 97, 0.14) !important;
    padding: 40px 20px !important;
    text-align: center !important;
    margin: 24px 0 !important;
}

.empty-icon-ring {
    width: 48px !important;
    height: 48px !important;
    background: #F1F5F9 !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 20px !important;
    margin-bottom: 12px !important;
}

.journal-empty-state h3 {
    color: #211261 !important;
    font-size: 17px !important;
    font-weight: 800 !important;
    margin-bottom: 6px !important;
}

.journal-empty-state p {
    color: #475569 !important;
    font-size: 13.5px !important;
    margin-bottom: 16px !important;
}

.journal-reset-btn {
    background: #211261 !important;
    color: #FFFFFF !important;
    border: none !important;
    padding: 10px 24px !important;
    min-height: 44px !important;
    border-radius: 99px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    transition: background 0.2s ease !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.journal-reset-btn:hover {
    background: #00CE7C !important;
}

/* Pagination (Matching Y Học Thường Thức Style) */
.journal-pagination-wrap {
    margin-top: 40px !important;
    display: flex !important;
    justify-content: center !important;
}

.journal-pager {
    display: flex !important;
    gap: 8px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
}

.journal-pager li button,
.journal-pager li a,
.journal-pager li span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 16px !important;
    border-radius: 10px !important;
    background: #FFFFFF !important;
    border: 1.5px solid rgba(33, 18, 97, 0.12) !important;
    color: #211261 !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    font-family: 'Lexend', sans-serif !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    box-sizing: border-box !important;
}

.journal-pager li span.current {
    background: #211261 !important;
    color: #FFFFFF !important;
    border-color: #211261 !important;
    box-shadow: 0 4px 14px rgba(33, 18, 97, 0.2) !important;
}

.journal-pager li button:hover,
.journal-pager li a:hover {
    background: #00CE7C !important;
    color: #FFFFFF !important;
    border-color: #00CE7C !important;
}

.journal-pager li span.dots {
    border: none !important;
    background: transparent !important;
    color: #64748B !important;
    min-width: 28px !important;
    padding: 0 !important;
}

/* ========================================================
   3. CONSULTATION ACTION STRIP (BOTTOM CTA)
   ======================================================== */
.sante-consult-strip {
    padding: 0 0 60px 0 !important;
}

.consult-strip-inner {
    background: linear-gradient(135deg, #150B42 0%, #211261 45%, #0B332E 100%) !important;
    background-color: #211261 !important;
    border-radius: 20px !important;
    padding: 36px 40px !important;
    color: #FFFFFF !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 24px !important;
    box-shadow: 0 16px 36px rgba(21, 11, 66, 0.22) !important;
    border: 1px solid rgba(0, 206, 124, 0.2) !important;
    position: relative !important;
    overflow: hidden !important;
}

.consult-strip-inner::before {
    content: "" !important;
    position: absolute !important;
    top: -50% !important;
    right: -20% !important;
    width: 320px !important;
    height: 320px !important;
    background: radial-gradient(circle, rgba(0, 206, 124, 0.18) 0%, rgba(0, 206, 124, 0) 70%) !important;
    pointer-events: none !important;
}

.strip-left {
    position: relative !important;
    z-index: 1 !important;
    flex: 1 1 500px !important;
}

.strip-pill {
    display: inline-flex !important;
    align-items: center !important;
    background: rgba(0, 206, 124, 0.15) !important;
    background-color: rgba(0, 206, 124, 0.15) !important;
    border: 1px solid rgba(0, 206, 124, 0.6) !important;
    color: #00E88B !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    padding: 4px 12px !important;
    border-radius: 99px !important;
    margin-bottom: 12px !important;
}

.strip-title {
    font-size: clamp(18px, 2vw, 22px) !important;
    font-weight: 800 !important;
    color: #FFFFFF !important;
    background-color: transparent !important;
    margin: 0 0 8px 0 !important;
    line-height: 1.35 !important;
}

.strip-desc {
    font-size: 13.5px !important;
    color: #E2E8F0 !important;
    background-color: transparent !important;
    margin: 0 !important;
    max-width: 620px !important;
    line-height: 1.55 !important;
}

.strip-right {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    flex-wrap: wrap !important;
    position: relative !important;
    z-index: 1 !important;
}

.strip-hotline-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    background: rgba(255, 255, 255, 0.1) !important;
    background-color: rgba(255, 255, 255, 0.1) !important;
    border: 1px solid rgba(255, 255, 255, 0.22) !important;
    color: #FFFFFF !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    padding: 12px 22px !important;
    min-height: 48px !important;
    border-radius: 99px !important;
    text-decoration: none !important;
    transition: all 0.25s ease !important;
    box-sizing: border-box !important;
}

.strip-hotline-btn svg {
    color: #00E88B !important;
    transition: transform 0.25s ease !important;
}

.strip-hotline-btn:hover {
    background: rgba(255, 255, 255, 0.18) !important;
    background-color: rgba(255, 255, 255, 0.18) !important;
    border-color: #00CE7C !important;
    color: #00E88B !important;
    transform: translateY(-2px) !important;
}

.strip-hotline-btn:hover svg {
    transform: scale(1.1) !important;
}

.strip-btn-booking {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    background: linear-gradient(135deg, #00CE7C 0%, #00995D 100%) !important;
    background-color: #00CE7C !important;
    color: #FFFFFF !important;
    font-size: 13.5px !important;
    font-weight: 800 !important;
    letter-spacing: 0.02em !important;
    padding: 12px 26px !important;
    min-height: 48px !important;
    border-radius: 99px !important;
    text-decoration: none !important;
    transition: all 0.25s ease !important;
    box-sizing: border-box !important;
    box-shadow: 0 8px 22px rgba(0, 206, 124, 0.35) !important;
    border: none !important;
    cursor: pointer !important;
}

.strip-btn-booking:hover {
    background: linear-gradient(135deg, #00E88B 0%, #00B36B 100%) !important;
    background-color: #00E88B !important;
    color: #FFFFFF !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 12px 28px rgba(0, 206, 124, 0.45) !important;
}

/* ========================================================
   4. Y HỌC THƯỜNG THỨC - CLINICAL EDITORIAL MAGAZINE SUITE
   ======================================================== */
.sante-med-editorial-main {
    background-color: #FAFCFB !important;
}

/* 4.1 Hero Header Section (Expanded High-Impact Luxury) */
.sante-med-hero-editorial {
    padding: 56px 0 40px 0 !important;
    background: radial-gradient(circle at 85% 15%, #E6FBF2 0%, #F2FCF7 45%, #FFFFFF 100%) !important;
    border-bottom: 1px solid rgba(0, 206, 124, 0.14) !important;
    position: relative !important;
}

.med-hero-wrapper {
    display: grid !important;
    grid-template-columns: 46% 54% !important;
    align-items: center !important;
    gap: 40px !important;
    margin-bottom: 40px !important;
}

.med-hero-left {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    padding-right: 10px !important;
}

.med-hero-badge-wrap {
    margin-bottom: 14px !important;
}

.med-eyebrow {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    font-size: 12.5px !important;
    font-weight: 800 !important;
    letter-spacing: 0.06em !important;
    color: #00875A !important;
    background: rgba(0, 206, 124, 0.14) !important;
    border: 1px solid rgba(0, 206, 124, 0.3) !important;
    padding: 6px 16px !important;
    border-radius: 99px !important;
    text-transform: uppercase !important;
}

.med-main-title {
    font-size: clamp(38px, 4.4vw, 56px) !important;
    font-weight: 900 !important;
    line-height: 1.05 !important;
    color: #211261 !important;
    margin: 0 0 16px 0 !important;
    letter-spacing: -0.03em !important;
}

.med-tagline-box {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin-bottom: 14px !important;
}

.tagline-dot {
    width: 8px !important;
    height: 8px !important;
    background: #00CE7C !important;
    border-radius: 50% !important;
    flex-shrink: 0 !important;
    box-shadow: 0 0 10px #00CE7C !important;
}

.med-tagline {
    font-size: clamp(16px, 1.5vw, 19px) !important;
    font-weight: 800 !important;
    color: #006847 !important;
    margin: 0 !important;
    line-height: 1.4 !important;
}

.med-hero-desc {
    font-size: 15px !important;
    color: #475569 !important;
    line-height: 1.65 !important;
    margin: 0 0 20px 0 !important;
}

.med-hero-desc strong {
    color: #211261 !important;
}

.med-hero-trust-chips {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
}

.trust-chip {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: #FFFFFF !important;
    border: 1px solid rgba(33, 18, 97, 0.08) !important;
    padding: 6px 14px !important;
    border-radius: 99px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #334155 !important;
    box-shadow: 0 2px 8px rgba(33, 18, 97, 0.03) !important;
}

.med-hero-right {
    width: 100% !important;
    display: flex !important;
    justify-content: flex-end !important;
}

.med-hospital-showcase {
    position: relative !important;
    width: 100% !important;
    aspect-ratio: 2560 / 1066 !important;
    height: auto !important;
    border-radius: 28px !important;
    overflow: hidden !important;
    box-shadow: 0 24px 60px rgba(33, 18, 97, 0.16) !important;
    border: 5px solid #FFFFFF !important;
    background: #F8FAFC !important;
}

.med-building-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    transition: transform 0.6s ease !important;
}

.med-hospital-showcase:hover .med-building-img {
    transform: scale(1.03) !important;
}

.med-building-overlay {
    position: absolute !important;
    bottom: 16px !important;
    left: 16px !important;
    z-index: 2 !important;
}

.building-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    background: rgba(33, 18, 97, 0.9) !important;
    backdrop-filter: blur(10px) !important;
    color: #FFFFFF !important;
    font-size: 12.5px !important;
    font-weight: 800 !important;
    padding: 8px 18px !important;
    border-radius: 99px !important;
    border: 1px solid rgba(255, 255, 255, 0.25) !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2) !important;
}

/* Category Filter Pills Bar */
.med-cat-pills-bar {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    flex-wrap: wrap !important;
    padding-top: 10px !important;
}

.med-pill-item {
    display: inline-flex !important;
    align-items: center !important;
    gap: 9px !important;
    padding: 12px 22px !important;
    border-radius: 99px !important;
    background: #FFFFFF !important;
    border: 1.5px solid rgba(33, 18, 97, 0.1) !important;
    color: #334155 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    font-family: inherit !important;
    text-decoration: none !important;
    cursor: pointer !important;
    outline: none !important;
    transition: all 0.24s cubic-bezier(0.16, 1, 0.3, 1) !important;
    box-shadow: 0 3px 10px rgba(33, 18, 97, 0.04) !important;
    box-sizing: border-box !important;
}

.med-pill-item:hover {
    border-color: #00CE7C !important;
    color: #00CE7C !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 20px rgba(0, 206, 124, 0.16) !important;
}

.med-pill-item.active {
    background: #007A4D !important;
    border-color: #007A4D !important;
    color: #FFFFFF !important;
    box-shadow: 0 6px 18px rgba(0, 122, 77, 0.35) !important;
}

.med-pill-item.active .pill-icon {
    color: #FFFFFF !important;
}

.med-pill-item.pill-view-all {
    margin-left: auto !important;
    background: transparent !important;
    border-color: transparent !important;
    color: #006847 !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    padding: 12px 16px !important;
    box-shadow: none !important;
}

.med-pill-item.pill-view-all:hover {
    transform: translateX(4px) !important;
    color: #211261 !important;
}

.latest-art-card.is-hidden {
    display: none !important;
}

.latest-art-card.is-visible {
    animation: medFadeIn 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards !important;
}

@keyframes medFadeIn {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Common Section Headers */
.med-section-header {
    margin-bottom: 22px !important;
}

.med-block-heading {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    font-size: 17px !important;
    font-weight: 900 !important;
    letter-spacing: 0.04em !important;
    color: #211261 !important;
    margin: 0 !important;
    text-transform: uppercase !important;
}

.med-block-heading .heading-line {
    width: 4px !important;
    height: 18px !important;
    background: #00875A !important;
    border-radius: 99px !important;
}

.med-tag-badge {
    display: inline-flex !important;
    align-items: center !important;
    width: fit-content !important;
    max-width: max-content !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 0.04em !important;
    color: #00875A !important;
    background: #E8F7F0 !important;
    border: 1px solid rgba(0, 206, 124, 0.25) !important;
    padding: 4px 12px !important;
    border-radius: 99px !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
}

.med-tag-badge.mini-badge {
    display: inline-flex !important;
    width: fit-content !important;
    max-width: max-content !important;
    padding: 3px 9px !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    background: #E8F7F0 !important;
    color: #00875A !important;
    border: 1px solid rgba(0, 206, 124, 0.25) !important;
    white-space: nowrap !important;
}

/* 4.2 Bento Featured Section (Option A: Minimalist Typography List - The Atlantic & Monocle Style) */
.sante-med-featured-section {
    padding: 32px 0 24px 0 !important;
    background: #FAFCFB !important;
}

.sante-typo-showcase-box {
    display: grid !important;
    grid-template-columns: 380px 1fr !important;
    gap: 36px !important;
    background: #FFFFFF !important;
    border-radius: 24px !important;
    border: 1px solid rgba(33, 18, 97, 0.08) !important;
    padding: 24px 32px !important;
    box-shadow: 0 4px 24px rgba(33, 18, 97, 0.04) !important;
    align-items: stretch !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
}

/* Left: Visual Lead Card */
.typo-lead-visual-card {
    width: 380px !important;
    max-width: 380px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    border-right: 1px solid #F1F5F9 !important;
    padding-right: 32px !important;
    box-sizing: border-box !important;
}

.typo-lead-cover-link {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    aspect-ratio: 1000 / 600 !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    background: #F8FAFC !important;
    box-shadow: 0 4px 16px rgba(33, 18, 97, 0.06) !important;
    margin-bottom: 16px !important;
}

.typo-lead-cover-link img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    display: block !important;
    transition: transform 0.5s ease !important;
}

.typo-lead-visual-card:hover .typo-lead-cover-link img {
    transform: scale(1.05) !important;
}

.typo-lead-summary {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 !important;
    justify-content: space-between !important;
}

.typo-lead-meta {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    font-size: 12px !important;
    color: #475569 !important;
    margin-bottom: 8px !important;
    flex-wrap: wrap !important;
    font-weight: 600 !important;
}

.meta-tag-flag {
    background: #FEF3C7 !important;
    color: #92400E !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    padding: 3px 10px !important;
    border-radius: 99px !important;
    letter-spacing: 0.04em !important;
    border: 1px solid rgba(217, 119, 6, 0.2) !important;
}

.typo-lead-title {
    font-size: 18px !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
    margin: 0 0 8px 0 !important;
}

.typo-lead-title a {
    color: #211261 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
    display: inline-flex !important;
    align-items: center !important;
    min-height: 48px !important;
}

.typo-lead-title a:hover {
    color: #00CE7C !important;
}

.typo-lead-desc {
    font-size: 13.5px !important;
    color: #334155 !important;
    line-height: 1.55 !important;
    margin: 0 0 14px 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}

.typo-lead-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    color: #00875A !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    min-height: 44px !important;
    transition: all 0.2s ease !important;
}

.typo-lead-btn:hover {
    color: #211261 !important;
    transform: translateX(3px) !important;
}

/* Right: Minimalist Numbered Typography List */
.typo-editorial-list-wrap {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    width: 100% !important;
}

.typo-list-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding-bottom: 12px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    margin-bottom: 6px !important;
    gap: 12px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.typo-header-left {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    min-width: 0 !important;
}

.typo-header-dot {
    width: 7px !important;
    height: 7px !important;
    border-radius: 50% !important;
    background: #00CE7C !important;
    box-shadow: 0 0 0 3px rgba(0, 206, 124, 0.2) !important;
    flex-shrink: 0 !important;
}

.typo-list-title {
    font-size: 12.5px !important;
    font-weight: 800 !important;
    color: #211261 !important;
    letter-spacing: 0.03em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
}

.typo-list-sub {
    font-size: 11.5px !important;
    color: #475569 !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
}

.typo-list-items {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    justify-content: space-between !important;
    flex: 1 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.typo-item-row {
    display: flex !important;
    align-items: flex-start !important;
    gap: 14px !important;
    padding: 14px 16px !important;
    border-radius: 14px !important;
    background: #F8FAFC !important;
    border: 1px solid #EEF2F6 !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    box-sizing: border-box !important;
    width: 100% !important;
    text-decoration: none !important;
    color: inherit !important;
    cursor: pointer !important;
}

.typo-item-row:hover {
    background: #FFFFFF !important;
    border-color: #00CE7C !important;
    box-shadow: 0 6px 20px rgba(33, 18, 97, 0.06) !important;
    text-decoration: none !important;
}

.typo-num-pill {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    border-radius: 8px !important;
    background: #FFFFFF !important;
    border: 1.5px solid rgba(0, 206, 124, 0.3) !important;
    color: #007A4D !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-family: 'Lexend', -apple-system, sans-serif !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    transition: all 0.2s ease !important;
    flex-shrink: 0 !important;
    box-shadow: 0 2px 6px rgba(0, 206, 124, 0.08) !important;
    margin-top: 2px !important;
}

.typo-item-row:hover .typo-num-pill {
    background: #007A4D !important;
    border-color: #007A4D !important;
    color: #FFFFFF !important;
    transform: scale(1.05) !important;
}

.typo-item-body {
    flex: 1 !important;
    min-width: 0 !important;
}

.typo-item-meta {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    font-size: 11.5px !important;
    color: #64748B !important;
    margin-bottom: 4px !important;
    font-weight: 500 !important;
    flex-wrap: wrap !important;
}

.typo-item-meta .meta-date-views {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    color: #64748B !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
}

.typo-item-title {
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    margin: 0 0 4px 0 !important;
    color: #1E1B4B !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    word-break: break-word !important;
    transition: color 0.2s ease !important;
}

.typo-item-row:hover .typo-item-title {
    color: #007A4D !important;
}

.typo-item-desc {
    font-size: 12.5px !important;
    color: #64748B !important;
    line-height: 1.5 !important;
    margin: 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}

.typo-arrow-link {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #CBD5E1 !important;
    transition: all 0.2s ease !important;
    flex-shrink: 0 !important;
    border-radius: 8px !important;
    margin-top: 2px !important;
}

.typo-item-row:hover .typo-arrow-link {
    color: #007A4D !important;
    transform: translateX(3px) !important;
}

/* 4.3 Latest Articles Section (MỚI NHẤT - 3 COLUMNS MAGAZINE) */
.sante-med-latest-section {
    padding: 40px 0 56px 0 !important;
    background: #FAFCFB !important;
}

.latest-section-top {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin-bottom: 28px !important;
    flex-wrap: wrap !important;
    gap: 16px !important;
}

.latest-cat-subnav {
    display: flex !important;
    align-items: center !important;
    gap: 24px !important;
    flex-wrap: wrap !important;
}

.subnav-link {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #64748B !important;
    text-decoration: none !important;
    padding-bottom: 6px !important;
    border-bottom: 2.5px solid transparent !important;
    transition: all 0.2s ease !important;
}

.subnav-link:hover {
    color: #00CE7C !important;
}

.subnav-link.active {
    color: #00CE7C !important;
    border-bottom-color: #00CE7C !important;
}

/* 3 COLUMNS MAGAZINE GRID */
.latest-articles-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 28px !important;
}

.latest-art-card {
    background: #FFFFFF !important;
    border-radius: 20px !important;
    border: 1px solid rgba(33, 18, 97, 0.08) !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    box-shadow: 0 4px 18px rgba(33, 18, 97, 0.03) !important;
    transition: all 0.28s ease !important;
}

.latest-art-card:hover {
    border-color: #00CE7C !important;
    transform: translateY(-4px) !important;
    box-shadow: 0 16px 36px rgba(33, 18, 97, 0.09) !important;
}

.art-card-cover {
    position: relative !important;
    width: 100% !important;
    aspect-ratio: 1000 / 600 !important;
    height: auto !important;
    min-height: auto !important;
    overflow: hidden !important;
    display: block !important;
    background: #F8FAFC !important;
    border-bottom: 1px solid rgba(33, 18, 97, 0.06) !important;
}

.art-card-cover img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    display: block !important;
    transition: transform 0.5s ease !important;
}

.latest-art-card:hover .art-card-cover img {
    transform: scale(1.06) !important;
}

.art-card-body {
    padding: 22px 20px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    flex: 1 !important;
    gap: 14px !important;
}

.art-card-body .card-badge {
    margin-bottom: 10px !important;
    align-self: flex-start !important;
}

.art-card-title {
    font-size: 16.5px !important;
    font-weight: 800 !important;
    line-height: 1.4 !important;
    margin: 0 0 8px 0 !important;
    text-transform: none !important;
}

.art-card-title a {
    color: #211261 !important;
    text-decoration: none !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    transition: color 0.2s ease !important;
}

.art-card-title a:hover {
    color: #00CE7C !important;
}

.art-card-excerpt {
    font-size: 13.5px !important;
    color: #64748B !important;
    line-height: 1.55 !important;
    margin: 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}
.art-card-excerpt:empty {
    display: none !important;
}

.art-card-meta,
.mini-card-meta,
.lead-card-meta {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    flex-wrap: wrap !important;
    font-size: 12px !important;
    color: #94A3B8 !important;
}
.art-card-meta .meta-item,
.mini-card-meta .meta-item,
.lead-card-meta .meta-item {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    font-weight: 600 !important;
}
.art-card-meta .meta-item i,
.mini-card-meta .meta-item i,
.lead-card-meta .meta-item i {
    font-size: 11px !important;
}
.art-card-meta .meta-dot,
.mini-card-meta .meta-dot,
.lead-card-meta .meta-dot {
    font-size: 6px !important;
    color: #CBD5E1 !important;
    line-height: 1 !important;
}

/* Robust Pagination UI */
.sante-pagination-wrapper {
    margin-top: 40px !important;
    display: flex !important;
    justify-content: center !important;
}

.sante-pagination-wrapper ul.page-numbers {
    display: flex !important;
    gap: 8px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
}

.sante-pagination-wrapper .page-numbers li a,
.sante-pagination-wrapper .page-numbers li button,
.sante-pagination-wrapper .page-numbers li span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 16px !important;
    border-radius: 10px !important;
    background: #FFFFFF !important;
    border: 1.5px solid rgba(33, 18, 97, 0.12) !important;
    color: #211261 !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    font-family: 'Lexend', sans-serif !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    box-sizing: border-box !important;
}

.sante-pagination-wrapper .page-numbers li span.current {
    background: #211261 !important;
    color: #FFFFFF !important;
    border-color: #211261 !important;
    box-shadow: 0 4px 14px rgba(33, 18, 97, 0.2) !important;
}

.sante-pagination-wrapper .page-numbers li a:hover,
.sante-pagination-wrapper .page-numbers li button:hover {
    background: #00CE7C !important;
    color: #FFFFFF !important;
    border-color: #00CE7C !important;
}

.sante-pagination-wrapper .page-numbers li span.dots {
    border: none !important;
    background: transparent !important;
    color: #64748B !important;
    min-width: 28px !important;
    padding: 0 !important;
}

.med-no-results {
    background: #FFFFFF !important;
    border-radius: 18px !important;
    border: 1.5px dashed rgba(33, 18, 97, 0.12) !important;
    padding: 40px 20px !important;
}

.no-res-icon {
    font-size: 36px !important;
    margin-bottom: 8px !important;
}

.no-res-title {
    color: #211261 !important;
    font-size: 17px !important;
    font-weight: 800 !important;
    margin-bottom: 4px !important;
}

.no-res-desc {
    color: #64748B !important;
    font-size: 13.5px !important;
    margin-bottom: 16px !important;
}

.btn-back-all {
    display: inline-block !important;
    background: #211261 !important;
    color: #FFFFFF !important;
    padding: 10px 24px !important;
    border-radius: 99px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    transition: background 0.2s ease !important;
}

.btn-back-all:hover {
    background: #00CE7C !important;
}

/* ========================================================
   4.4 & 4.7 MASTERCLASS Y KHOA — CHÂN DUNG & CHÂM NGÔN TƯƠNG TÁC
   (OPEN CANVAS • NO HEAVY BOXES • QUIET LUXURY EDITORIAL)
   ======================================================== */
.sante-masterclass-section {
    padding: 40px 0 60px 0 !important;
    background: #FAFCFB !important;
    border-top: 1px solid rgba(15, 23, 42, 0.06) !important;
}

.masterclass-wrapper {
    max-width: 1200px !important;
    margin: 0 auto !important;
}

/* Header */
.masterclass-header {
    margin-bottom: 32px !important;
}

.mc-kicker-wrap {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-bottom: 8px !important;
}

.mc-pulse-dot {
    width: 7px !important;
    height: 7px !important;
    border-radius: 50% !important;
    background: #0D9488 !important;
    box-shadow: 0 0 0 3px rgba(13, 148, 136, 0.2) !important;
}

.mc-kicker {
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    color: #0D9488 !important;
    text-transform: uppercase !important;
}

.mc-title {
    font-family: 'Lexend', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: clamp(22px, 2.2vw, 26px) !important;
    font-weight: 700 !important;
    color: #1E1B4B !important;
    letter-spacing: -0.01em !important;
    line-height: 1.35 !important;
    margin: 0 0 8px 0 !important;
    text-wrap: balance !important;
}

.mc-subtitle {
    font-size: 14.5px !important;
    color: #64748B !important;
    margin: 0 !important;
    max-width: 720px !important;
    line-height: 1.55 !important;
    font-weight: 400 !important;
}

/* Main Gallery Stage (Open 2-Column) */
.masterclass-stage {
    display: grid !important;
    grid-template-columns: 1.65fr 1fr !important;
    gap: 32px !important;
    align-items: stretch !important;
    margin-bottom: 32px !important;
}

/* Left Hero Showcase (Open Clean Layout - No Boxy Trap) */
.mc-hero-showcase {
    background: #FFFFFF !important;
    border-radius: 20px !important;
    padding: 28px 30px 28px 24px !important;
    border: 1px solid rgba(15, 23, 42, 0.08) !important;
    box-shadow: 0 4px 20px rgba(15, 23, 42, 0.03) !important;
    display: flex !important;
    gap: 32px !important;
    align-items: center !important;
    position: relative !important;
}

.mc-portrait-holder {
    flex: 0 0 160px !important;
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}

.mc-portrait-img {
    width: 160px !important;
    height: 213px !important;
    border-radius: 16px !important;
    object-fit: cover !important;
    border: none !important;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08) !important;
    position: relative !important;
    z-index: 2 !important;
    transition: opacity 0.25s ease, transform 0.25s ease !important;
    background: #FFFFFF !important;
}

.mc-exp-badge {
    margin-top: 10px !important;
    background: #F0FDF4 !important;
    border: 1px solid rgba(13, 148, 136, 0.25) !important;
    color: #0D9488 !important;
    padding: 4px 14px !important;
    border-radius: 99px !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    position: relative !important;
    z-index: 2 !important;
    white-space: nowrap !important;
}

.mc-quote-column {
    flex: 1 !important;
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    min-width: 0 !important;
}

.mc-philosophy-quote {
    font-size: clamp(15px, 1.25vw, 17px) !important;
    font-weight: 400 !important;
    color: #1E293B !important;
    line-height: 1.65 !important;
    font-style: italic !important;
    margin: 0 0 18px 0 !important;
    border: none !important;
    padding: 0 !important;
    transition: opacity 0.25s ease !important;
    text-wrap: pretty !important;
}

.mc-doctor-signature {
    border-top: 1px solid rgba(15, 23, 42, 0.08) !important;
    padding-top: 12px !important;
}

.mc-sig-header {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin-bottom: 3px !important;
    flex-wrap: wrap !important;
}

.mc-doc-name {
    font-size: 16px !important;
    font-weight: 800 !important;
    color: #1E1B4B !important;
    margin: 0 !important;
    transition: opacity 0.25s ease !important;
}

.mc-sig-spec-pill {
    font-size: 11px !important;
    font-weight: 700 !important;
    color: #0D9488 !important;
    background: rgba(13, 148, 136, 0.08) !important;
    padding: 2px 10px !important;
    border-radius: 99px !important;
    transition: opacity 0.25s ease !important;
}

.mc-doc-position {
    font-size: 12px !important;
    color: #64748B !important;
    margin: 0 !important;
    line-height: 1.4 !important;
    transition: opacity 0.25s ease !important;
    white-space: normal !important;
}

/* Right Doctor Selector Rail */
.mc-selector-rail {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    justify-content: center !important;
}

.mc-rail-label {
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 0.08em !important;
    color: #64748B !important;
    text-transform: uppercase !important;
    margin-bottom: 2px !important;
}

.mc-doctor-item {
    background: #FFFFFF !important;
    border-radius: 16px !important;
    padding: 12px 16px !important;
    border: 1.5px solid rgba(15, 23, 42, 0.08) !important;
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    cursor: pointer !important;
    transition: all 0.25s ease !important;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.02) !important;
}

.mc-doctor-item:hover {
    border-color: rgba(13, 148, 136, 0.4) !important;
    transform: translateX(4px) !important;
}

.mc-doctor-item.active {
    background: #F0FDF4 !important;
    border-color: #0D9488 !important;
    box-shadow: 0 4px 16px rgba(13, 148, 136, 0.12) !important;
}

.mc-item-avatar {
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
    border-radius: 50% !important;
    overflow: hidden !important;
    border: 2px solid rgba(13, 148, 136, 0.2) !important;
    background: #F8FAFC !important;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06) !important;
}

.mc-doctor-item.active .mc-item-avatar {
    border-color: #0D9488 !important;
}

.mc-item-avatar img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    background: #FFFFFF !important;
}

.mc-item-meta {
    flex: 1 !important;
}

.mc-item-name {
    font-size: 13.5px !important;
    font-weight: 800 !important;
    color: #1E1B4B !important;
    margin: 0 0 2px 0 !important;
}

.mc-item-spec {
    font-size: 11.5px !important;
    color: #64748B !important;
    display: block !important;
}

.mc-item-arrow {
    color: #94A3B8 !important;
    transition: transform 0.2s ease, color 0.2s ease !important;
}

.mc-doctor-item.active .mc-item-arrow {
    color: #0D9488 !important;
    transform: translateX(2px) !important;
}

/* Bottom Floating Search / Question Capsule Bar */
.masterclass-action-bar {
    max-width: 820px !important;
    margin: 0 auto !important;
}

.mc-capsule-search {
    background: #FFFFFF !important;
    border: 1.5px solid rgba(13, 148, 136, 0.3) !important;
    border-radius: 99px !important;
    padding: 6px 8px 6px 20px !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    box-shadow: 0 6px 24px rgba(13, 148, 136, 0.08) !important;
    transition: all 0.25s ease !important;
}

.mc-capsule-search:focus-within {
    border-color: #0D9488 !important;
    box-shadow: 0 8px 30px rgba(13, 148, 136, 0.18) !important;
}

.mc-search-label {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #0D9488 !important;
    white-space: nowrap !important;
}

.mc-capsule-input {
    flex: 1 !important;
    border: none !important;
    background: transparent !important;
    font-size: 13.5px !important;
    color: #1E293B !important;
    outline: none !important;
    padding: 6px 0 !important;
}

.mc-capsule-submit {
    background: #0D9488 !important;
    color: #FFFFFF !important;
    border: none !important;
    border-radius: 99px !important;
    padding: 12px 24px !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    white-space: nowrap !important;
    min-height: 48px !important;
    transition: all 0.2s ease !important;
}

.mc-capsule-submit:hover {
    background: #0F766E !important;
    transform: translateY(-1px) !important;
}

/* Responsive MasterClass */
@media (max-width: 991px) {
    .masterclass-stage {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
    }
    .mc-hero-showcase {
        flex-direction: column !important;
        text-align: center !important;
        padding: 30px 20px !important;
    }
    .mc-doctor-signature {
        text-align: center !important;
    }
}

@media (max-width: 600px) {
    .mc-capsule-search {
        flex-direction: column !important;
        border-radius: 18px !important;
        padding: 14px !important;
        gap: 10px !important;
    }
    .mc-capsule-submit {
        width: 100% !important;
        justify-content: center !important;
    }
}

/* 4.5 Responsive Breakpoints (Medical Magazine Mobile Excellence) */
@media (max-width: 1199px) {
    .latest-articles-grid {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 22px !important;
    }
    .sante-typo-showcase-box {
        grid-template-columns: 340px 1fr !important;
        gap: 28px !important;
        padding: 20px 24px !important;
    }
    .typo-lead-visual-card {
        width: 340px !important;
        max-width: 340px !important;
        padding-right: 24px !important;
    }
}

@media (max-width: 991px) {
    .med-hero-wrapper {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
    }
    .med-hero-left {
        padding-right: 0 !important;
        text-align: center !important;
        align-items: center !important;
    }
    .med-hero-badge-wrap,
    .med-tagline-box,
    .med-hero-trust-chips {
        justify-content: center !important;
    }
    .med-hero-desc {
        text-align: center !important;
        max-width: 680px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
    .med-hero-right {
        max-width: 100% !important;
        width: 100% !important;
        justify-content: center !important;
    }
    .sante-typo-showcase-box {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
        padding: 20px !important;
    }
    .typo-lead-visual-card {
        width: 100% !important;
        max-width: 100% !important;
        border-right: none !important;
        padding-right: 0 !important;
        border-bottom: 1px solid #F1F5F9 !important;
        padding-bottom: 20px !important;
    }
    .latest-articles-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 20px !important;
    }
    .masterclass-stage {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
    }
    .mc-hero-showcase {
        padding: 24px 20px !important;
    }
}

@media (max-width: 767px) {
    .sante-med-hero-editorial {
        padding: 24px 0 20px 0 !important;
    }
    .med-hero-badge-wrap {
        margin-bottom: 10px !important;
    }
    .med-eyebrow {
        font-size: 11.5px !important;
        padding: 5px 14px !important;
        letter-spacing: 0.04em !important;
    }
    .med-main-title {
        font-size: 26px !important;
        text-align: center !important;
        line-height: 1.15 !important;
        margin: 0 0 10px 0 !important;
    }
    .med-tagline-box {
        margin-bottom: 10px !important;
    }
    .med-tagline {
        font-size: 14.5px !important;
        text-align: center !important;
    }
    .med-hero-desc {
        font-size: 13.5px !important;
        line-height: 1.55 !important;
        margin: 0 0 16px 0 !important;
        color: #334155 !important;
    }
    .med-hero-trust-chips {
        gap: 8px !important;
    }
    .trust-chip {
        font-size: 11.5px !important;
        padding: 6px 12px !important;
        min-height: 32px !important;
    }
    .med-hospital-showcase {
        border-radius: 18px !important;
        border-width: 3px !important;
        box-shadow: 0 12px 32px rgba(33, 18, 97, 0.1) !important;
    }
    .building-badge {
        font-size: 11.5px !important;
        padding: 6px 14px !important;
    }

    /* Horizontal swipeable category pills */
    .med-cat-pills-bar {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: none !important;
        padding: 6px 4px 10px 4px !important;
        gap: 8px !important;
        margin: 0 -15px !important;
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    .med-cat-pills-bar::-webkit-scrollbar {
        display: none !important;
    }
    .med-pill-item {
        white-space: nowrap !important;
        flex-shrink: 0 !important;
        padding: 10px 16px !important;
        font-size: 13px !important;
        min-height: 44px !important;
        box-sizing: border-box !important;
    }
    .med-pill-item.pill-view-all {
        margin-left: 0 !important;
        padding: 10px 12px !important;
    }

    /* Section 2: Featured Typography Bento */
    .sante-med-featured-section {
        padding: 20px 0 16px 0 !important;
    }
    .sante-typo-showcase-box {
        padding: 16px 14px !important;
        border-radius: 18px !important;
        box-shadow: 0 2px 14px rgba(33, 18, 97, 0.04) !important;
    }
    .typo-lead-cover-link {
        border-radius: 12px !important;
        margin-bottom: 12px !important;
    }
    .typo-lead-title {
        font-size: 16px !important;
        line-height: 1.35 !important;
        margin: 0 0 6px 0 !important;
    }
    .typo-lead-desc {
        font-size: 13px !important;
        line-height: 1.5 !important;
        margin: 0 0 12px 0 !important;
        color: #475569 !important;
    }
    .typo-lead-btn {
        min-height: 48px !important;
        padding: 12px 18px !important;
        background: #E8F7F0 !important;
        border-radius: 10px !important;
        justify-content: center !important;
        width: 100% !important;
        box-sizing: border-box !important;
        font-size: 13px !important;
    }
    .typo-list-header {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 4px !important;
        padding-bottom: 10px !important;
    }
    .typo-list-title {
        font-size: 12px !important;
    }
    .typo-list-sub {
        font-size: 10.5px !important;
    }
    .typo-list-items {
        gap: 10px !important;
    }
    .typo-item-row {
        padding: 12px 14px !important;
        gap: 12px !important;
        border-radius: 14px !important;
        background: #F8FAFC !important;
        border: 1px solid #EEF2F6 !important;
        box-shadow: 0 2px 8px rgba(33, 18, 97, 0.02) !important;
    }
    .typo-num-pill {
        width: 30px !important;
        height: 30px !important;
        min-width: 30px !important;
        font-size: 12.5px !important;
        border-radius: 8px !important;
        margin-top: 1px !important;
    }
    .typo-item-meta {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 4px !important;
        margin-bottom: 6px !important;
    }
    .typo-item-meta .meta-date-views {
        font-size: 11px !important;
        color: #64748B !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 6px !important;
        white-space: nowrap !important;
    }
    .typo-item-title {
        font-size: 14.5px !important;
        line-height: 1.4 !important;
        margin: 0 0 4px 0 !important;
        color: #1E1B4B !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        word-break: break-word !important;
    }
    .typo-item-desc {
        font-size: 12px !important;
        color: #64748B !important;
        line-height: 1.45 !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
    }
    .typo-arrow-link {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        margin-top: 2px !important;
    }

    /* Section 3: Latest Articles */
    .sante-med-latest-section {
        padding: 24px 0 32px 0 !important;
    }
    .latest-section-top {
        margin-bottom: 16px !important;
    }
    .latest-articles-grid {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }
    .latest-art-card {
        border-radius: 16px !important;
    }
    .art-card-body {
        padding: 16px 14px !important;
        gap: 10px !important;
    }
    .art-card-title {
        font-size: 15.5px !important;
        line-height: 1.35 !important;
        margin-bottom: 6px !important;
    }
    .art-card-excerpt {
        font-size: 13px !important;
        line-height: 1.5 !important;
        color: #475569 !important;
    }
    .art-card-meta {
        font-size: 11.5px !important;
        color: #64748B !important;
    }

    /* Section 4: Masterclass Section */
    .sante-masterclass-section {
        padding: 28px 0 36px 0 !important;
    }
    .masterclass-header {
        text-align: center !important;
        margin-bottom: 20px !important;
    }
    .mc-kicker-wrap {
        justify-content: center !important;
    }
    .mc-title {
        text-align: center !important;
        font-size: 20px !important;
        line-height: 1.3 !important;
    }
    .mc-subtitle {
        text-align: center !important;
        font-size: 13px !important;
        line-height: 1.5 !important;
        margin: 0 auto !important;
        color: #475569 !important;
    }
    .mc-hero-showcase {
        flex-direction: column !important;
        text-align: center !important;
        padding: 20px 16px !important;
        border-radius: 18px !important;
        gap: 16px !important;
    }
    .mc-portrait-holder {
        flex: 0 0 auto !important;
        width: 120px !important;
        margin: 0 auto !important;
    }
    .mc-portrait-img {
        width: 120px !important;
        height: 155px !important;
        border-radius: 12px !important;
    }
    .mc-exp-badge {
        font-size: 11px !important;
        padding: 3px 10px !important;
        margin-top: 8px !important;
    }
    .mc-philosophy-quote {
        font-size: 14px !important;
        line-height: 1.6 !important;
        margin-bottom: 12px !important;
        text-align: center !important;
        color: #1E293B !important;
    }
    .mc-doctor-signature {
        text-align: center !important;
        padding-top: 10px !important;
    }
    .mc-sig-header {
        justify-content: center !important;
        gap: 6px !important;
    }
    .mc-doc-name {
        font-size: 15px !important;
    }
    .mc-sig-spec-pill {
        font-size: 10.5px !important;
        padding: 2px 8px !important;
    }
    .mc-doc-position {
        font-size: 11.5px !important;
        line-height: 1.4 !important;
        color: #475569 !important;
    }
    .mc-selector-rail {
        gap: 8px !important;
    }
    .mc-rail-label {
        font-size: 10.5px !important;
        text-align: center !important;
    }
    .mc-doctor-item {
        padding: 10px 12px !important;
        border-radius: 12px !important;
        min-height: 48px !important;
        gap: 10px !important;
    }
    .mc-item-avatar {
        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;
    }
    .mc-item-name {
        font-size: 13px !important;
    }
    .mc-item-spec {
        font-size: 11px !important;
    }
    .masterclass-action-bar {
        margin-top: 16px !important;
    }
    .mc-capsule-search {
        flex-direction: column !important;
        border-radius: 16px !important;
        padding: 12px !important;
        gap: 10px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    .mc-search-label {
        font-size: 12px !important;
    }
    .mc-capsule-input {
        width: 100% !important;
        text-align: left !important;
        font-size: 13px !important;
        min-height: 44px !important;
    }
    .mc-capsule-submit {
        width: 100% !important;
        justify-content: center !important;
        min-height: 48px !important;
        font-size: 13.5px !important;
    }

    /* Pagination Mobile */
    .sante-pagination-wrapper {
        margin-top: 24px !important;
    }
    .sante-pagination-wrapper .page-numbers li a,
    .sante-pagination-wrapper .page-numbers li span {
        min-width: 44px !important;
        height: 44px !important;
        font-size: 13px !important;
        border-radius: 8px !important;
    }

    /* Breadcrumb & Global Mobile Polish */
    .breadcrumb-wrapper {
        padding: 12px 0 8px 0 !important;
    }
    .breadcrumb {
        font-size: 12px !important;
        flex-wrap: wrap !important;
        gap: 4px !important;
    }
    .btn-back-all {
        min-height: 44px !important;
        padding: 12px 24px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    /* News Page (Tin Tức) Mobile Optimization */
    .sante-journal-masthead {
        padding: 24px 0 20px 0 !important;
    }
    .journal-header-block {
        margin-bottom: 18px !important;
    }
    .journal-title {
        font-size: 22px !important;
        line-height: 1.25 !important;
    }
    .journal-desc {
        font-size: 13px !important;
        line-height: 1.5 !important;
    }
    .journal-toolbar {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
        margin-bottom: 20px !important;
        padding-bottom: 14px !important;
    }
    .filter-pills-bar {
        width: 100% !important;
        overflow-x: auto !important;
        padding: 4px 0 8px 0 !important;
        gap: 8px !important;
    }
    .filter-pill {
        padding: 8px 14px !important;
        font-size: 12.5px !important;
        min-height: 44px !important;
    }
    .search-box-bar {
        width: 100% !important;
    }
    .search-box-bar input {
        width: 100% !important;
        font-size: 13.5px !important;
        min-height: 44px !important;
    }
    .search-box-bar input:focus {
        width: 100% !important;
    }
    .journal-articles-grid {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }
    .journal-card {
        border-radius: 16px !important;
    }
    .journal-card .art-card-body {
        padding: 16px 14px !important;
        gap: 10px !important;
    }
    .journal-card .art-card-title {
        font-size: 15.5px !important;
        margin-bottom: 6px !important;
    }
    .journal-card .art-card-excerpt {
        font-size: 13px !important;
        line-height: 1.5 !important;
        -webkit-line-clamp: 2 !important;
    }
    .journal-card .art-card-meta {
        font-size: 11.5px !important;
        padding-top: 10px !important;
    }
    .sante-consult-strip {
        padding: 0 0 36px 0 !important;
    }
    .consult-strip-inner {
        padding: 24px 18px !important;
        border-radius: 18px !important;
        gap: 16px !important;
        text-align: center !important;
        align-items: center !important;
    }
    .strip-pill {
        font-size: 10px !important;
        padding: 3px 10px !important;
        margin-bottom: 8px !important;
    }
    .strip-title {
        font-size: 17.5px !important;
        line-height: 1.35 !important;
        margin-bottom: 6px !important;
    }
    .strip-desc {
        font-size: 13px !important;
        line-height: 1.5 !important;
    }
    .strip-right {
        flex-direction: column !important;
        width: 100% !important;
        gap: 10px !important;
    }
    .strip-hotline-btn {
        width: 100% !important;
        justify-content: center !important;
        min-height: 44px !important;
        font-size: 13.5px !important;
        padding: 10px 18px !important;
    }
    .strip-btn-booking {
        width: 100% !important;
        justify-content: center !important;
        min-height: 46px !important;
        font-size: 13px !important;
        padding: 11px 20px !important;
    }
}

@media (max-width: 480px) {
    .journal-title {
        font-size: 20px !important;
    }
    .journal-brand-badge {
        font-size: 10px !important;
        padding: 3px 10px !important;
    }
    .med-main-title {
        font-size: 22px !important;
    }
    .med-tagline {
        font-size: 13.5px !important;
    }
    .med-hero-desc {
        font-size: 13px !important;
    }
    .trust-chip {
        font-size: 11px !important;
        padding: 5px 10px !important;
    }
    .med-pill-item {
        font-size: 12.5px !important;
        padding: 9px 14px !important;
    }
    .typo-lead-title {
        font-size: 15px !important;
    }
    .art-card-title {
        font-size: 14.5px !important;
    }
    .mc-title {
        font-size: 18px !important;
    }
    .mc-philosophy-quote {
        font-size: 13.5px !important;
    }
}

/* 4.3 Clinical Articles 3-Column Grid */
.sante-med-feed-section {
    padding: 20px 0 40px 0 !important;
    background: #FAFCFB !important;
}

.med-articles-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 24px !important;
}

.med-clinical-card {
    background: #FFFFFF !important;
    border-radius: 20px !important;
    overflow: hidden !important;
    border: 1px solid rgba(33, 18, 97, 0.08) !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    height: 100% !important;
    transition: all 0.28s cubic-bezier(0.16, 1, 0.3, 1) !important;
    box-shadow: 0 3px 14px rgba(33, 18, 97, 0.03) !important;
}

.med-clinical-card:hover {
    transform: translateY(-4px) !important;
    border-color: #00CE7C !important;
    box-shadow: 0 16px 32px rgba(33, 18, 97, 0.09) !important;
}

.card-cover {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    aspect-ratio: 1000 / 600 !important;
    height: auto !important;
    min-height: auto !important;
    overflow: hidden !important;
    background: #F8FAFC !important;
    border-bottom: 1px solid rgba(33, 18, 97, 0.06) !important;
}

.card-cover img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    display: block !important;
    transition: transform 0.5s ease !important;
}

.med-clinical-card:hover .card-cover img {
    transform: scale(1.06) !important;
}

.card-cat-pill {
    position: absolute !important;
    top: 12px !important;
    left: 12px !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
    padding: 4px 10px !important;
    border-radius: 99px !important;
    backdrop-filter: blur(6px) !important;
}

.card-cat-pill.tag-emerald { background: rgba(0, 206, 124, 0.95) !important; color: #FFFFFF !important; }
.card-cat-pill.tag-rose { background: rgba(225, 29, 72, 0.95) !important; color: #FFFFFF !important; }
.card-cat-pill.tag-purple { background: rgba(124, 58, 237, 0.95) !important; color: #FFFFFF !important; }
.card-cat-pill.tag-amber { background: rgba(217, 119, 6, 0.95) !important; color: #FFFFFF !important; }
.card-cat-pill.tag-navy { background: rgba(33, 18, 97, 0.95) !important; color: #FFFFFF !important; }

.card-content-body {
    padding: 22px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    flex: 1 !important;
}

.card-meta-line {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    font-size: 11.5px !important;
    color: #94A3B8 !important;
    margin-bottom: 8px !important;
    flex-wrap: wrap !important;
}

.doc-verify {
    color: #00875A !important;
    font-weight: 700 !important;
}

.card-title {
    font-size: 15.5px !important;
    font-weight: 800 !important;
    line-height: 1.4 !important;
    margin: 0 0 10px 0 !important;
    text-transform: none !important;
}

.card-title a {
    color: #211261 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

.card-title a:hover {
    color: #00CE7C !important;
}

.card-summary {
    font-size: 13px !important;
    color: #64748B !important;
    line-height: 1.55 !important;
    margin: 0 0 16px 0 !important;
}

.card-footer-action {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding-top: 14px !important;
    border-top: 1px solid #F1F5F9 !important;
    font-size: 12px !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
}

.reviewer-badge {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
}

.rev-avatar {
    width: 24px !important;
    height: 24px !important;
    border-radius: 50% !important;
    background: #211261 !important;
    color: #00CE7C !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.rev-text {
    font-size: 11.5px !important;
    font-weight: 700 !important;
    color: #475569 !important;
}

.read-detail-link {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    color: #211261 !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
}

.read-detail-link:hover {
    color: #00CE7C !important;
    transform: translateX(2px) !important;
}

@media (max-width: 991px) {
    .med-articles-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}
@media (max-width: 600px) {
    .med-articles-grid {
        grid-template-columns: 1fr !important;
    }
}

/* 4.4 Robust Pagination UI */
.sante-pagination-wrapper {
    margin-top: 40px !important;
    display: flex !important;
    justify-content: center !important;
}

.sante-pagination-wrapper ul.page-numbers {
    display: flex !important;
    gap: 8px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
}

.sante-pagination-wrapper .page-numbers li a,
.sante-pagination-wrapper .page-numbers li button,
.sante-pagination-wrapper .page-numbers li span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 16px !important;
    border-radius: 10px !important;
    background: #FFFFFF !important;
    border: 1.5px solid rgba(33, 18, 97, 0.12) !important;
    color: #211261 !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    font-family: 'Lexend', sans-serif !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    box-sizing: border-box !important;
}

.sante-pagination-wrapper .page-numbers li span.current {
    background: #211261 !important;
    color: #FFFFFF !important;
    border-color: #211261 !important;
    box-shadow: 0 4px 14px rgba(33, 18, 97, 0.2) !important;
}

.sante-pagination-wrapper .page-numbers li a:hover,
.sante-pagination-wrapper .page-numbers li button:hover {
    background: #00CE7C !important;
    color: #FFFFFF !important;
    border-color: #00CE7C !important;
}

.sante-pagination-wrapper .page-numbers li span.dots {
    border: none !important;
    background: transparent !important;
    color: #64748B !important;
    min-width: 28px !important;
    padding: 0 !important;
}

.med-no-results {
    background: #FFFFFF !important;
    border-radius: 18px !important;
    border: 1.5px dashed rgba(33, 18, 97, 0.12) !important;
    padding: 40px 20px !important;
}

.no-res-icon {
    font-size: 36px !important;
    margin-bottom: 8px !important;
}

.no-res-title {
    color: #211261 !important;
    font-size: 17px !important;
    font-weight: 800 !important;
    margin-bottom: 4px !important;
}

.no-res-desc {
    color: #64748B !important;
    font-size: 13.5px !important;
    margin-bottom: 16px !important;
}

.btn-back-all {
    display: inline-block !important;
    background: #211261 !important;
    color: #FFFFFF !important;
    padding: 10px 24px !important;
    border-radius: 99px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    transition: background 0.2s ease !important;
}

.btn-back-all:hover {
    background: #00CE7C !important;
}

/* 4.5 Medical Council Section */
.sante-med-council-section {
    padding: 36px 0 !important;
    background: linear-gradient(180deg, #F8FAFC 0%, #FFFFFF 100%) !important;
    border-top: 1px solid rgba(33, 18, 97, 0.06) !important;
    border-bottom: 1px solid rgba(33, 18, 97, 0.06) !important;
}

.council-header {
    max-width: 760px !important;
    margin: 0 auto 28px auto !important;
}

.council-desc {
    font-size: 13.5px !important;
    color: #64748B !important;
    line-height: 1.55 !important;
    margin-top: 6px !important;
}

.council-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 20px !important;
}

.doc-card {
    position: relative !important;
    background: #FFFFFF !important;
    border-radius: 18px !important;
    border: 1px solid rgba(33, 18, 97, 0.08) !important;
    padding: 24px 20px !important;
    text-align: center !important;
    box-shadow: 0 4px 16px rgba(33, 18, 97, 0.03) !important;
    transition: all 0.25s ease !important;
}

.doc-card:hover {
    border-color: #00CE7C !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 12px 28px rgba(33, 18, 97, 0.08) !important;
}

.doc-card-badge {
    position: absolute !important;
    top: 14px !important;
    right: 14px !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    color: #DFBA73 !important;
    background: rgba(33, 18, 97, 0.9) !important;
    padding: 2px 8px !important;
    border-radius: 99px !important;
}

.doc-avatar-wrap {
    width: 80px !important;
    height: 80px !important;
    border-radius: 50% !important;
    overflow: hidden !important;
    margin: 0 auto 14px auto !important;
    border: 3px solid #00CE7C !important;
}

.doc-avatar-wrap img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

.doc-fullname {
    font-size: 16px !important;
    font-weight: 800 !important;
    color: #211261 !important;
    margin: 0 0 4px 0 !important;
}

.doc-dept {
    font-size: 12.5px !important;
    font-weight: 700 !important;
    color: #00875A !important;
    margin-bottom: 6px !important;
}

.doc-exp {
    font-size: 12px !important;
    color: #64748B !important;
    line-height: 1.45 !important;
    margin-bottom: 12px !important;
}

.doc-trust-point {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    background: #F1F5F9 !important;
    padding: 4px 10px !important;
    border-radius: 99px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: #211261 !important;
}

@media (max-width: 991px) {
    .council-grid {
        grid-template-columns: 1fr !important;
    }
}

/* 4.6 Clinical FAQ Accordion */
.sante-med-faq-section {
    padding: 36px 0 !important;
    background: #FAFCFB !important;
}

.faq-container-box {
    max-width: 840px !important;
    margin: 0 auto !important;
}

.faq-head {
    text-align: center !important;
    margin-bottom: 24px !important;
}

.faq-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}

.faq-item {
    background: #FFFFFF !important;
    border-radius: 14px !important;
    border: 1px solid rgba(33, 18, 97, 0.08) !important;
    overflow: hidden !important;
    box-shadow: 0 2px 8px rgba(33, 18, 97, 0.02) !important;
    transition: border-color 0.2s ease !important;
}

.faq-item.active {
    border-color: #00CE7C !important;
}

.faq-question {
    width: 100% !important;
    background: transparent !important;
    border: none !important;
    padding: 16px 20px !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    text-align: left !important;
    font-size: 14.5px !important;
    font-weight: 700 !important;
    color: #211261 !important;
    cursor: pointer !important;
}

.faq-icon {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #00CE7C !important;
    margin-left: 10px !important;
}

.faq-answer {
    padding: 0 20px 16px 20px !important;
    display: none;
    font-size: 13.5px !important;
    color: #475569 !important;
    line-height: 1.6 !important;
}

.faq-answer p {
    margin: 0 !important;
}

/* ========================================================
   MINIMALIST CLINICAL SIDEBAR
   ======================================================== */
.sante-minimal-sidebar {
    position: sticky !important;
    top: 90px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
}

.sidebar-luxury-card {
    background: linear-gradient(135deg, #211261 0%, #150B42 100%) !important;
    border-radius: 16px !important;
    padding: 24px !important;
    color: #FFFFFF !important;
    box-shadow: 0 8px 24px rgba(33, 18, 97, 0.12) !important;
}

.card-badge {
    display: inline-block !important;
    background: rgba(0, 206, 124, 0.15) !important;
    border: 1px solid #00CE7C !important;
    color: #00CE7C !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    padding: 2px 8px !important;
    border-radius: 99px !important;
    margin-bottom: 10px !important;
}

.card-title {
    font-size: 16px !important;
    font-weight: 800 !important;
    color: #FFFFFF !important;
    margin: 0 0 6px 0 !important;
}

.card-desc {
    font-size: 12.5px !important;
    color: #CBD5E1 !important;
    line-height: 1.45 !important;
    margin: 0 0 16px 0 !important;
}

.hotline-box {
    background: rgba(255, 255, 255, 0.08) !important;
    border-radius: 10px !important;
    padding: 10px 14px !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 14px !important;
}

.hotline-lbl {
    font-size: 12px !important;
    color: #94A3B8 !important;
}

.hotline-val {
    font-size: 15px !important;
    font-weight: 800 !important;
    color: #00CE7C !important;
    text-decoration: none !important;
}

.btn-luxury-booking {
    display: block !important;
    text-align: center !important;
    background: #00CE7C !important;
    color: #FFFFFF !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    padding: 10px 14px !important;
    border-radius: 99px !important;
    text-decoration: none !important;
    transition: all 0.25s ease !important;
}

.btn-luxury-booking:hover {
    background: #00B56D !important;
    transform: translateY(-2px) !important;
}

.sidebar-white-card {
    background: #FFFFFF !important;
    border: 1px solid rgba(33, 18, 97, 0.08) !important;
    border-radius: 16px !important;
    padding: 22px !important;
    box-shadow: 0 2px 12px rgba(33, 18, 97, 0.03) !important;
}

.card-header-bar {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-bottom: 14px !important;
    border-bottom: 2px solid #00CE7C !important;
    padding-bottom: 8px !important;
}

.bar-pill {
    background: #211261 !important;
    color: #FFFFFF !important;
    font-size: 9.5px !important;
    font-weight: 800 !important;
    padding: 2px 6px !important;
    border-radius: 4px !important;
}

.bar-title {
    font-size: 14px !important;
    font-weight: 800 !important;
    color: #211261 !important;
    margin: 0 !important;
}

.topics-tag-cloud {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
}

.topic-tag {
    display: inline-block !important;
    background: #F8FAFC !important;
    border: 1px solid rgba(33, 18, 97, 0.08) !important;
    color: #475569 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    padding: 5px 12px !important;
    border-radius: 6px !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
}

.topic-tag:hover {
    background: #211261 !important;
    color: #FFFFFF !important;
    border-color: #211261 !important;
}

.newsletter-heading {
    font-size: 14px !important;
    font-weight: 800 !important;
    color: #211261 !important;
    margin: 0 0 4px 0 !important;
}

.newsletter-sub {
    font-size: 12px !important;
    color: #64748B !important;
    line-height: 1.4 !important;
    margin: 0 0 12px 0 !important;
}

.newsletter-form {
    display: flex !important;
    gap: 6px !important;
}

.newsletter-input {
    flex: 1 !important;
    background: #F8FAFC !important;
    border: 1px solid rgba(33, 18, 97, 0.1) !important;
    border-radius: 99px !important;
    padding: 7px 14px !important;
    font-size: 12px !important;
    outline: none !important;
}

.newsletter-btn {
    background: #211261 !important;
    color: #FFFFFF !important;
    border: none !important;
    padding: 7px 14px !important;
    border-radius: 99px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    transition: background 0.2s ease !important;
}

.newsletter-btn:hover {
    background: #00CE7C !important;
}

    font-weight: 500 !important;
}

.horizon-read-link {
    font-size: 13px !important;
    font-weight: 800 !important;
    color: #211261 !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
}

.horizon-read-link:hover {
    color: #00CE7C !important;
    transform: translateX(4px) !important;
}

@media (max-width: 768px) {
    .horizon-news-item {
        grid-template-columns: 1fr !important;
    }
    .horizon-thumb-box {
        width: 100% !important;
        height: 180px !important;
    }
    .sante-news-filter-search input,
    .sante-news-filter-search input:focus {
        width: 100% !important;
    }
}

/* Empty State */
.sante-empty-result-box {
    background: #FFFFFF !important;
    border-radius: 18px !important;
    border: 1.5px dashed rgba(33, 18, 97, 0.15) !important;
    padding: 48px 24px !important;
    text-align: center !important;
    margin: 20px 0 !important;
}

.empty-icon-bubble {
    width: 64px !important;
    height: 64px !important;
    background: #F1F5F9 !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-bottom: 16px !important;
}

.empty-title {
    font-size: 18px !important;
    font-weight: 800 !important;
    color: #211261 !important;
    margin: 0 0 6px 0 !important;
}

.empty-desc {
    font-size: 13.5px !important;
    color: #64748B !important;
    max-width: 480px !important;
    margin: 0 auto 20px auto !important;
}

.empty-reset-btn {
    background: #211261 !important;
    color: #FFFFFF !important;
    border: none !important;
    padding: 8px 20px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    border-radius: 99px !important;
    cursor: pointer !important;
    transition: background 0.2s ease !important;
}

.empty-reset-btn:hover {
    background: #00CE7C !important;
}

/* Pager */
.sante-clean-pager {
    margin-top: 32px !important;
    display: flex !important;
    justify-content: center !important;
}

.pagination-list {
    display: flex !important;
    gap: 8px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.pagination-list .page-item .page-link {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    border-radius: 10px !important;
    background: #FFFFFF !important;
    border: 1px solid rgba(33, 18, 97, 0.1) !important;
    color: #211261 !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    transition: all 0.25s ease !important;
}

.pagination-list .page-item.active .page-link {
    background: #211261 !important;
    color: #FFFFFF !important;
    border-color: #211261 !important;
    box-shadow: 0 4px 12px rgba(33, 18, 97, 0.15) !important;
}

.pagination-list .page-item:hover:not(.active) .page-link {
    background: #00CE7C !important;
    color: #FFFFFF !important;
    border-color: #00CE7C !important;
}

/* ========================================================
   CREATIVE MEDICAL CRO SIDEBAR WIDGETS
   ======================================================== */
.sante-creative-sidebar {
    position: sticky !important;
    top: 90px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
}

.sidebar-widget {
    background: #FFFFFF !important;
    border: 1px solid rgba(33, 18, 97, 0.08) !important;
    border-radius: 18px !important;
    padding: 22px !important;
    box-shadow: 0 4px 20px rgba(33, 18, 97, 0.03) !important;
}

/* 1. Podcast Player */
.podcast-player-widget {
    background: linear-gradient(135deg, #1A0E4E 0%, #0D0728 100%) !important;
    color: #FFFFFF !important;
    border-color: rgba(223, 186, 115, 0.3) !important;
}

.podcast-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 12px !important;
}

.podcast-badge-wrap {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
}

.live-dot {
    width: 8px !important;
    height: 8px !important;
    background: #00CE7C !important;
    border-radius: 50% !important;
    box-shadow: 0 0 8px #00CE7C !important;
    animation: pulseDot 1.5s infinite !important;
}

@keyframes pulseDot {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.4; transform: scale(0.8); }
}

.podcast-badge {
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: 0.06em !important;
    color: #00CE7C !important;
}

.podcast-frequency {
    font-size: 11px !important;
    color: #94A3B8 !important;
    background: rgba(255, 255, 255, 0.1) !important;
    padding: 2px 8px !important;
    border-radius: 4px !important;
}

.podcast-title {
    font-size: 14.5px !important;
    font-weight: 800 !important;
    color: #FFFFFF !important;
    margin: 0 0 4px 0 !important;
    line-height: 1.35 !important;
}

.podcast-author {
    font-size: 11.5px !important;
    color: #CBD5E1 !important;
    margin: 0 0 16px 0 !important;
}

.mini-audio-controller {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    background: rgba(255, 255, 255, 0.06) !important;
    padding: 12px !important;
    border-radius: 14px !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.podcast-play-btn {
    width: 42px !important;
    height: 42px !important;
    border-radius: 50% !important;
    background: #00CE7C !important;
    border: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
    box-shadow: 0 4px 14px rgba(0, 206, 124, 0.35) !important;
    transition: transform 0.2s ease, background 0.2s ease !important;
}

.podcast-play-btn:hover {
    transform: scale(1.05) !important;
    background: #00E58A !important;
}

.podcast-progress-wrap {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
}

.audio-waveform-bars {
    display: flex !important;
    align-items: center !important;
    gap: 3px !important;
    height: 18px !important;
}

.wave-bar {
    flex: 1 !important;
    height: 6px !important;
    background: rgba(255, 255, 255, 0.25) !important;
    border-radius: 2px !important;
    transition: height 0.2s ease, background 0.2s ease !important;
}

.wave-bar.is-animating {
    background: #00CE7C !important;
    animation: waveJump 1s ease-in-out infinite alternate !important;
}

.wave-bar:nth-child(2n).is-animating { animation-delay: 0.15s !important; }
.wave-bar:nth-child(3n).is-animating { animation-delay: 0.3s !important; }
.wave-bar:nth-child(4n).is-animating { animation-delay: 0.45s !important; }

@keyframes waveJump {
    0% { height: 4px; }
    100% { height: 18px; }
}

.audio-timer-row {
    display: flex !important;
    justify-content: space-between !important;
    font-size: 10.5px !important;
    color: #94A3B8 !important;
    font-family: monospace !important;
}

/* 2. E-Book Widget */
.ebook-download-widget {
    background: #FAFCFB !important;
    border: 1px solid rgba(0, 206, 124, 0.25) !important;
}

.ebook-tag {
    font-size: 10px !important;
    font-weight: 800 !important;
    color: #00A664 !important;
    background: rgba(0, 206, 124, 0.12) !important;
    padding: 2px 8px !important;
    border-radius: 4px !important;
    display: inline-block !important;
    margin-bottom: 8px !important;
}

.ebook-title {
    font-size: 15px !important;
    font-weight: 800 !important;
    color: #211261 !important;
    margin: 0 0 6px 0 !important;
}

.ebook-desc {
    font-size: 12.5px !important;
    color: #64748B !important;
    line-height: 1.45 !important;
    margin: 0 0 14px 0 !important;
}

.ebook-book-visual {
    display: flex !important;
    justify-content: center !important;
    margin-bottom: 16px !important;
}

.ebook-cover {
    width: 140px !important;
    height: 80px !important;
    background: linear-gradient(135deg, #211261 0%, #150B3D 100%) !important;
    border-radius: 8px !important;
    padding: 10px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    box-shadow: 0 8px 20px rgba(33, 18, 97, 0.2) !important;
    border: 1px solid rgba(223, 186, 115, 0.4) !important;
}

.cover-logo-mini {
    font-size: 8.5px !important;
    font-weight: 800 !important;
    color: #DFBA73 !important;
    letter-spacing: 0.05em !important;
}

.cover-title-mini {
    font-size: 9.5px !important;
    font-weight: 800 !important;
    color: #FFFFFF !important;
    line-height: 1.2 !important;
}

.cover-badge-mini {
    font-size: 7.5px !important;
    font-weight: 800 !important;
    color: #00CE7C !important;
    text-align: right !important;
}

.ebook-download-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    background: #00CE7C !important;
    color: #FFFFFF !important;
    font-size: 12.5px !important;
    font-weight: 800 !important;
    padding: 9px 14px !important;
    border-radius: 99px !important;
    text-decoration: none !important;
    transition: all 0.25s ease !important;
}

.ebook-download-btn:hover {
    background: #00B56D !important;
    transform: translateY(-2px) !important;
}

/* 3. Booking Consult Widget */
.booking-consult-widget {
    background: #FFFFFF !important;
    border: 1px solid rgba(33, 18, 97, 0.1) !important;
}

.consult-badge {
    font-size: 10px !important;
    font-weight: 800 !important;
    color: #211261 !important;
    background: rgba(33, 18, 97, 0.06) !important;
    padding: 2px 8px !important;
    border-radius: 4px !important;
    display: inline-block !important;
    margin-bottom: 8px !important;
}

.consult-heading {
    font-size: 15px !important;
    font-weight: 800 !important;
    color: #211261 !important;
    margin: 0 0 6px 0 !important;
}

.consult-sub {
    font-size: 12.5px !important;
    color: #64748B !important;
    line-height: 1.45 !important;
    margin: 0 0 14px 0 !important;
}

.consult-hotline-pill {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    background: #F8FAFC !important;
    border: 1px solid rgba(33, 18, 97, 0.08) !important;
    border-radius: 12px !important;
    padding: 10px 12px !important;
    margin-bottom: 14px !important;
}

.hotline-icon-circle {
    width: 32px !important;
    height: 32px !important;
    background: rgba(0, 206, 124, 0.12) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.hotline-digits {
    display: flex !important;
    flex-direction: column !important;
}

.digits-label {
    font-size: 10.5px !important;
    color: #94A3B8 !important;
}

.digits-number {
    font-size: 14.5px !important;
    font-weight: 800 !important;
    color: #211261 !important;
    text-decoration: none !important;
}

.consult-cta-btn {
    display: block !important;
    text-align: center !important;
    background: #211261 !important;
    color: #FFFFFF !important;
    font-weight: 800 !important;
    font-size: 13px !important;
    padding: 9px 14px !important;
    border-radius: 99px !important;
    text-decoration: none !important;
    transition: all 0.25s ease !important;
}

.consult-cta-btn:hover {
    background: #00CE7C !important;
    transform: translateY(-2px) !important;
}

/* 4. Newsletter Widget */
.newsletter-widget {
    background: #F8FAFC !important;
    border: 1px solid rgba(33, 18, 97, 0.06) !important;
}

.nl-box-title {
    font-size: 14px !important;
    font-weight: 800 !important;
    color: #211261 !important;
    margin: 0 0 4px 0 !important;
}

.nl-box-desc {
    font-size: 12px !important;
    color: #64748B !important;
    margin: 0 0 12px 0 !important;
}

.nl-input-group {
    display: flex !important;
    gap: 6px !important;
}

.nl-text-input {
    flex: 1 !important;
    background: #FFFFFF !important;
    border: 1px solid rgba(33, 18, 97, 0.12) !important;
    border-radius: 99px !important;
    padding: 8px 14px !important;
    font-size: 12.5px !important;
    outline: none !important;
    color: #1E293B !important;
}

.nl-text-input:focus {
    border-color: #00CE7C !important;
}

.nl-submit-btn {
    background: #211261 !important;
    border: none !important;
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    transition: background 0.2s ease !important;
}

.nl-submit-btn:hover {
    background: #00CE7C !important;
}

@media (max-width: 991px) {
    .sante-creative-sidebar {
        position: static !important;
        margin-top: 36px !important;
    }
}
.detail-article {
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 20px;
    padding: 36px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03);
}

.detail-heading h1 {
    font-size: clamp(24px, 3vw, 32px);
    font-weight: 800;
    color: #211261 !important;
    line-height: 1.35;
    margin-bottom: 16px;
}

.detail-meta {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 1px solid #F1F5F9;
}

.detail-tag span {
    background: #EEF5F7;
    color: #211261;
    font-weight: 700;
    font-size: 12px;
    padding: 4px 12px;
    border-radius: 999px;
    text-transform: uppercase;
}

.detail-date {
    font-size: 13px;
    color: #94A3B8;
    display: flex;
    align-items: center;
    gap: 6px;
}

.article-content {
    font-size: 16px;
    line-height: 1.8;
    color: #334155;
}

.article-content p {
    margin-bottom: 1.5rem;
}

.article-content img {
    max-width: 100%;
    height: auto;
    border-radius: 12px;
    margin: 20px auto;
    display: block;
}

/* Latest News / Related Box in Single Post */
.latest-news-wrap {
    background: #FFFFFF !important;
    border: 1px solid #E2E8F0;
    border-radius: 18px !important;
    padding: 24px !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.03);
}

.latest-news-wrap .heading-5 {
    color: #211261 !important;
    font-size: 16px;
    font-weight: 800;
    border-bottom: 1.5px solid #F1F5F9;
    padding-bottom: 12px;
    margin-bottom: 18px;
}

.news-latest-item {
    display: flex;
    gap: 14px;
    margin-bottom: 16px;
    padding-bottom: 16px;
    border-bottom: 1px solid #F8FAFC;
}

.news-latest-item:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

.news-latest-item .img figure {
    width: 90px;
    height: 65px;
    margin: 0;
    border-radius: 8px;
    overflow: hidden;
    flex-shrink: 0;
}

.news-latest-item .img figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.news-latest-item .caption .title a {
    color: #1E293B;
    font-size: 13.5px;
    font-weight: 600;
    text-decoration: none;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 4px;
}

.news-latest-item .caption .title a:hover {
    color: #211261;
}

.news-latest-item .caption .date {
    font-size: 11.5px;
    color: #94A3B8;
}

/* 10. CONTACT, CAREERS & PROMOTION SUBPAGE STYLES - Modern Luxury */
.contact-section {
    background: #F8FAFC !important;
    padding: 60px 0 !important;
}

.contact-info {
    background: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 24px !important;
    padding: 32px 28px !important;
    box-shadow: 0 4px 20px rgba(33, 18, 97, 0.04) !important;
}

.contact-info .item {
    display: flex !important;
    gap: 16px !important;
    margin-bottom: 24px !important;
    align-items: flex-start !important;
}

.contact-info .item .icon {
    width: 44px !important;
    height: 44px !important;
    border-radius: 12px !important;
    background: #EAFBF3 !important;
    color: #00A862 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 18px !important;
    flex-shrink: 0 !important;
}

.contact-info .item .content .title {
    font-size: 15px !important;
    color: #1E293B !important;
    line-height: 1.5 !important;
}

.contact-form {
    background: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 24px !important;
    padding: 36px 32px !important;
    box-shadow: 0 8px 30px rgba(33, 18, 97, 0.06) !important;
}

.contact-form .form-group {
    margin-bottom: 16px !important;
}

.contact-form input[type="text"],
.contact-form textarea {
    width: 100% !important;
    border: 1.5px solid #E2E8F0 !important;
    border-radius: 12px !important;
    padding: 14px 18px !important;
    font-size: 14px !important;
    background: #F8FAFC !important;
    color: #1E293B !important;
    outline: none !important;
    transition: all 0.25s ease !important;
}

.contact-form input[type="text"]:focus,
.contact-form textarea:focus {
    border-color: #00CE7C !important;
    background: #FFFFFF !important;
    box-shadow: 0 0 0 4px rgba(0, 206, 124, 0.12) !important;
}

.contact-form .frm-btn-submit,
.contact-form .btn-submit {
    background: linear-gradient(135deg, #00CE7C 0%, #009E5E 100%) !important;
    color: #FFFFFF !important;
    border: none !important;
    border-radius: 999px !important;
    padding: 12px 36px !important;
    font-size: 14.5px !important;
    font-weight: 800 !important;
    cursor: pointer !important;
    box-shadow: 0 6px 18px rgba(0, 206, 124, 0.35) !important;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.contact-form .frm-btn-submit:hover,
.contact-form .btn-submit:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 10px 24px rgba(0, 206, 124, 0.45) !important;
}