 @import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400..700;1,400..700&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
:root{
    --font-family-Manrope: 'Plus Jakarta Sans',sans-serif;
    /* --font-family-Roboto: "Fraunces", ui-serif, Georgia, serif; */
    --font-family-Roboto: "Lora", serif;
    --font-body: "Inter", sans-serif;
        --tm-maroon:#2F669A;
        --tm-maroon-dark:#2F669A;
        --tm-gold:#EE7836;
        --tm-orange:#EE7836;
    }
.dept-banner {
            position: relative;
    width: 100%;
    min-height: 300px;
    background-color: #2F669A;
    background-image: linear-gradient(#3F7AB7 0%, #2F669A 50%, #234F79 100%), var(--banner-bg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-blend-mode: soft-light;}
        .dept-banner::before {content: '';position: absolute;inset: 0;background-size: 90px 78px;background-position: center;pointer-events: none;z-index: 0;}
        .dept-banner__doctor {position: absolute;right: 0;top: 0;height: 100%;max-width: 38%;object-fit: cover;object-position: left center;filter: sepia(1) brightness(0.82) contrast(0.95);mix-blend-mode: multiply;pointer-events: none;z-index: 1;}
        .dept-banner__content {position: relative;z-index: 2;padding: 48px 0 40px;}
        .dept-banner__title {font-size: clamp(1.6rem, 3.5vw, 2.4rem);font-weight: 800;letter-spacing: 0.04em;
            color: #FFF;line-height: 1.15;margin-bottom: 10px;}
        .dept-banner__breadcrumb {list-style: none;padding: 0;margin: 0;display: flex;flex-wrap: wrap;gap: 0;font-size: 0.78rem;color: #EE7836;}
        .dept-banner__breadcrumb li + li::before {content: ' | ';padding: 0 4px;color: #EE7836;}
        .dept-banner__breadcrumb a {color: #EE7836;text-decoration: none;transition: color 0.2s;}
        .dept-banner__breadcrumb a:hover {color: #FFF;text-decoration: underline;}
        .dept-banner__breadcrumb li:last-child {color: #FFF;}


 .tm-section{padding:30px 0 50px;}
.tm-card{margin-bottom:38px;}
.tm-banner{position:relative;aspect-ratio:16/9;border-radius:10px;overflow:hidden;background:linear-gradient(135deg, var(--tm-maroon) 0%, var(--tm-maroon-dark) 35%, var(--tm-orange) 100%);
        padding:18px 20px;box-shadow:0 4px 16px rgba(0,0,0,.10);transition:transform .3s ease, box-shadow .3s ease;}
.tm-card:hover .tm-banner{transform:translateY(-3px);box-shadow:0 10px 24px rgba(0,0,0,.16);}
.tm-banner__top{position:absolute;top:16px;left:20px;right:20px;display:flex;justify-content:space-between;align-items:flex-start;z-index:3;}
.tm-banner__logo{display:flex;align-items:center;gap:6px;color:#fff;}
.tm-banner__logo .logo-mark{width:26px;height:26px;border:2px solid #fff;border-radius:6px;display:flex;align-items:center;justify-content:center;
        font-size:.65rem;font-weight:700;flex-shrink:0;}
.tm-banner__logo-text{line-height:1.1;}
.tm-banner__logo-text .name{font-weight:700;font-size:.78rem;letter-spacing:.03em;display:block;}
.tm-banner__logo-text .tag{font-size:.55rem;opacity:.8;display:block;}
.tm-banner__hashtag{font-size:.65rem;color:rgba(255,255,255,.75);letter-spacing:.03em;white-space:nowrap;}
.tm-banner__headline{position:absolute;left:20px;right:44%;top:44px;color:#fff;font-weight:700;font-size:.92rem;line-height:1.4;z-index:2;}
.tm-banner__patient{position:absolute;top:6%;right:0%;width:auto;height:78%;border-radius:50%;overflow:hidden;background:#dcdcdc;z-index:1;box-shadow:0 0 0 4px rgba(255,255,255,.08) inset;}
.tm-banner__patient img{width:100%;height:100%;object-fit:cover;object-position:top center;}
.tm-banner__play{position:absolute;top:25%;left:45%;width:44px;height:44px;border-radius:50%;background:rgba(235, 148, 34, 0.85);
        display:flex;align-items:center;justify-content:center;z-index:4;cursor:pointer;transition:background .3s ease, transform .3s ease;}
.tm-card:hover .tm-banner__play{background:var(--tm-gold);transform:scale(1.08);}
.tm-banner__play svg{width:36px;height:36px;fill:#fff;margin-left:2px;}
.tm-banner__doctor{position:absolute;left:20px;bottom:14px;right:20px;display:flex;align-items:center;gap:8px;z-index:3;}
.tm-banner__doctor img{width:160px;height:160px;border-radius:50%;object-fit:cover;border:2px solid #fff;flex-shrink:0;}
.tm-banner__doctor-info{color:#fff;line-height:1.25;overflow:hidden;}
.tm-banner__doctor-info .d-name{font-weight:700;font-size:.92rem;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tm-banner__doctor-info .d-qual,
    .tm-banner__doctor-info .d-desig{font-size:.69rem;line-height: 16px;opacity:.85;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tm-caption{position:relative;z-index:5;background:#fff;margin:-8px 14px 0;border-radius:8px;box-shadow:0 6px 18px rgba(0,0,0,.10);padding:18px 20px 14px;text-align:center;}
.tm-caption h3{font-family: var(--font-family-Roboto);font-size:1rem;font-weight:700;color:#161616;text-transform:uppercase;line-height:1.45;margin-bottom:8px;}
.tm-caption .tm-note{font-size:.88rem;color:#7a7a7a;font-style:italic;margin:0;}
.tm-caption .tm-note::before{content:"* ";}
.media-section__heading{text-align:center;margin-bottom:40px;}
.media-section__heading h2{font-weight:700;font-size: 2.5rem;font-family: var(--font-family-Roboto);}
.media-section__heading p{color:#404040;max-width:600px;margin:8px auto 0;font-size: 18px;}
.tm-pagination{display:flex;justify-content:center;margin-top:10px;overflow-x:auto;}
.tm-pagination .pagination{flex-wrap:nowrap;margin:0;}
.tm-pagination .page-item{margin:0 13px;}
.tm-pagination .page-link{color:var(--tm-maroon);border:none;padding:0px 0px;font-weight:500;background:transparent !important;white-space:nowrap;box-shadow:none;}
.tm-pagination .page-item.active .page-link{background:var(--tm-maroon) !important;color:#fff;}
.tm-pagination .page-item.disabled .page-link{color:#404040;background:transparent !important;opacity:.7;}
.tm-pagination .page-link:hover{color:var(--tm-maroon-dark);background:rgba(107,31,31,.06) !important;}
.tm-pagination .page-link:focus{box-shadow:none;}

@media (max-width: 575.98px){
    .tm-pagination .page-link{padding:6px 10px;font-size:.9rem;}
    }
 
 @media (max-width: 767.98px){
    .tm-banner__headline{font-size:.8rem;right:48%;}
    .tm-banner__doctor-info .d-qual{display:none;}
    .tm-banner__doctor img {width: 80px;height: 80px;}
    .tm-banner__play {position: absolute;top: 30%;}
    }