/* ===============================
   Wrapper
=================================*/

.ortho-wrapper{
    max-width:1188px;
    margin:30px auto;
    padding:0 20px;
}

/* ===============================
   Grid Layout (2 Columns)
=================================*/

.ortho-grid{
    display:grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap:40px;
}

/* جلوگیری از شکستن Grid توسط Swiper */
.ortho-case{
    min-width:0;
    margin-bottom:0;

    background:#ffffff;
    padding:30px;
    border-radius:24px;

    border:1px solid rgba(14,165,164,0.3);

    box-shadow:0 20px 60px rgba(0,0,0,0.06);
    transition:all .3s ease;
}

.ortho-case:hover{
    transform:translateY(-6px);
    box-shadow:0 25px 70px rgba(0,0,0,0.08);
}

/* ===============================
   Typography
=================================*/

.ortho-case h2{
    font-size:30px;
    font-weight:700;
    margin-bottom:25px;
    position:relative;
    color:#0f172a;
}

.ortho-case h2::after{
    content:"";
    width:60px;
    height:3px;
    background:#0ea5a4;
    display:block;
    margin-top:12px;
    border-radius:4px;
}

.ortho-case p{
    font-size:15px;
    line-height:1.9;
    color:#444;
    margin-bottom:16px;
}

.ortho-case strong{
    color:#0f172a;
}

/* ===============================
   Swiper Styling
=================================*/

.ortho-swiper{
    margin-top:35px;
}

.swiper{
    width:100%;
    max-width:100%;
}

.swiper-slide{
    border-radius:20px;
    overflow:hidden;
    box-shadow:0 15px 40px rgba(0,0,0,0.08);
    transition:transform .4s ease;
}

.swiper-slide img{
    width:100%;
    height:auto;
    display:block;
}

.swiper-slide:hover{
    transform:scale(1.02);
}

/* Navigation Buttons */

.swiper-button-next,
.swiper-button-prev{
    color:#0ea5a4;
}

/* Pagination */

.swiper-pagination-bullet{
    background:#ccc;
    opacity:1;
}

.swiper-pagination-bullet-active{
    background:#0ea5a4;
}

/* ===============================
   Responsive
=================================*/

@media(max-width:1024px){
    .ortho-grid{
        grid-template-columns:1fr;
    }
}

@media(max-width:768px){

    .ortho-wrapper{
        margin:70px auto;
    }

    .ortho-case{
        padding:25px;
    }

    .ortho-case h2{
        font-size:24px;
    }
}