/* ======================================================
   MANNARKKAD ONLY - TREATMENTS SECTION
   ====================================================== */

.sp2-section{

    padding:90px 0;

    overflow:hidden;

}

.sp2-inner{

    width:100%;

    /* max-width:1450px; */

    margin:0 auto;

    padding:0 20px;

}

.sp2-head{

    margin-bottom:55px;

}

.sp2-viewport{

    overflow:visible;

    width:100%;

}

.sp2-track{

    display:flex;

    gap:24px;

    justify-content:flex-start;

    align-items:stretch;

}

.sp2-card{

    flex:0 0 330px;
    max-width:330px;
    min-height:470px;

}

.sp2-card img{

    width:100%;

    height:100%;

    object-fit:cover;

}

/* ---------- Desktop ---------- */

@media (min-width:1200px){

.sp2-inner{

    max-width:1550px;

    padding-left:15px;

    padding-right:15px;

}

.sp2-track{

    justify-content:flex-start;

    gap:22px;

}

}

/* ---------- Laptop ---------- */

@media (max-width:1199px){

.sp2-card{

    flex:0 0 calc((100% - 24px)/2);

}

}

/* ---------- Tablet ---------- */

@media (max-width:768px){

.sp2-track{

    gap:18px;

}

.sp2-card{

    flex:0 0 100%;

    max-width:100%;

}

}

/* ---------- Mobile ---------- */

@media (max-width:480px){

.sp2-section{

    padding:70px 0;

}

.sp2-inner{

    padding:0 16px;

}

}
/* =========================================================
   MANNARKKAD MAIN HEADINGS - AXIFORMA
========================================================= */

.branch-hero-title,
.about-heading,
.sp2-title,
.section-title,
.appointment-title {
    font-family: 'Axiforma', sans-serif;
    font-style: normal;
    font-weight: 600;
    letter-spacing: -0.02em;
}

/* Brand name - lighter */
.branch-hero-title .brand-name,
.about-heading .brand-name {
    font-family: 'Axiforma', sans-serif;
    font-weight: 400;
    font-style: normal;
}

/* Mannarkkad - slightly stronger */
.branch-hero-title em,
.about-heading em {
    font-family: 'Axiforma', sans-serif;
    font-weight: 600;
    font-style: normal;
}
/* ==========================================
   MANNARKKAD HERO TITLE - MOBILE
========================================== */

@media (max-width: 768px) {

    .branch-hero-title.about-title {
        width: 100% !important;
        max-width: 100% !important;

        padding: 0 5px !important;
        margin: 0 auto !important;

        text-align: center !important;

        font-size: 27px !important;
        line-height: 1.2 !important;

        white-space: normal !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
    }

    .branch-hero-title.about-title .brand-name {
        display: block !important;

        white-space: nowrap !important;
        word-break: keep-all !important;
        overflow-wrap: normal !important;

        font-size: 27px !important;
        font-weight: 400 !important;
    }

    .branch-hero-title.about-title em {
        display: block !important;

        white-space: nowrap !important;
        word-break: keep-all !important;
        overflow-wrap: normal !important;

        margin-top: 5px !important;

        font-size: 27px !important;
        font-weight: 600 !important;
        font-style: normal !important;
    }
}


/* ==========================================
   SMALL MOBILE
========================================== */

@media (max-width: 480px) {

    .branch-hero-title.about-title {
        font-size: 24px !important;
    }

    .branch-hero-title.about-title .brand-name {
        font-size: 24px !important;
    }

    .branch-hero-title.about-title em {
        font-size: 25px !important;
    }

}