.hero-section{
    height:auto;    
    min-height:150px!important;
}

.sticky-wrapper{
    position:relative;
    height:auto;
    min-height:150px;
}
.titr-about{
   color: var(--primary-color-nd);
   padding:32px 0 24px 0;
   font-size:70px;
   font-family: 'IranNastaliq';
}
.conternt-tx-nd{
    padding:48px 0px;
}

.tx-about{
    font-size:16px;
    line-height:36px;
    text-align:justify;
    direction:rtl;
    padding:0 0px 32px 0;
}
.img-abt-side-nd{
    width:93%;
    float:left;
    position:relative;
    top:-20px;
}
.titr-about-2{
       color: var(--primary-color-nd);
   padding:40px 0 24px 0;
   font-size:55px;
   text-align:center;
   font-family: 'IranNastaliq';
}
.mg-ce{
    display:block;
    margin:32px auto 60px auto;
    width:80%;
}
.caption-nd-lg{
position: absolute;
    width: clamp(280px, 27vw, 550px);
    top: clamp(100px, 15vw, 200px);
    left: 6%;
    z-index: 99999;
    font-size: clamp(18px, 1.8vw, 36px);
    transition: opacity 0.2s;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.caption-nd-lg .ti-wb{
        font-size:110px;
    font-family: 'IranNastaliq';
    padding-bottom:16px;
}
.caption-nd-lg .ti-en {
    font-size: clamp(12px, 1.3vw, 24px);
    letter-spacing:0;
    padding-top:16px;
}
.ti-wb-2{
    color: #2f685d;
    font-size: clamp(18px, 1.7vw, 34px);
    padding: clamp(6px, 0.8vw, 16px) 0;
}
.br-nd{
    position:relative;
}
.list-progress-nd{
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: clamp(16px, 1vw, 50px);
    list-style: none;
    margin: 0 auto;
    max-width: 1600px;
}
.menu-item-pr{
        display: flex;
    flex-direction: column;
    align-items: center;
    flex: 1 1 120px;
    max-width: 270px;
    transition: transform 0.3s ease;
    cursor: pointer;
    position:relative;
}
.menu-item-pr .divider {
    width: 94px;
    height: 18px;
    margin: 8px 0 16px 0;
    position: relative;
    background-image: url(../images/55li.png);
    background-size: 100% 100%;
    position: absolute;
    left: -48px;
    top: 36px;
}
.menu-item-pr:nth-child(5) .divider{
    display:none;
}
.menu-item-pr .menu-text{
      font-size: 32px;
    padding: 8px 0 8px 0;
    font-family: 'IranNastaliq';
}
.p-text-slv{
    color:#808080;
    font-size:14px;
    text-align:center;
    line-height:27px;
    max-width: 186px;
}
.content-tx-dt{
    padding:32px 16px 0 16px;
    position:relative;
}
/*.content-tx-dt:before{
position: absolute;
    background-image: url(../images/y1.png);
    width: 65px;
    height: 100%;
    content: "";
    left: 0;
    top:50px;
    background-repeat: no-repeat;
    background-position: center;
}*/
.img-ce{
   width:90%;
    margin:32px auto;
    display:block;
}
.p-tx{
    position:relative;
    padding:16px 0 48px 0;
}
.c-ic-ce{
    display: block;
    margin: 0 auto 16px auto !important;
    width: 117px !important;
    height: auto !important;
}
.img-abt-side-nd-bt {
    width: 100%;
    top: 34px;
}
.ti-99{
    font-size:56px;padding-bottom:12px;
}
.link-rg{
    margin-top: 0;
    float: left;
    position: relative;
    top: -29px;
}



.row-tab-nd{
     background-color: #fdfdfd;

    position: relative;
    top: -64px;
    box-shadow: 0 0 17px 0 rgb(0 0 0 / 10%);
    width: 85%;
    margin: 0 auto;
    border-radius: 16px;
}

.tab-gallery-nd{
        display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-wrap: nowrap;
    gap: clamp(16px, 1vw, 50px);
    list-style: none;
    margin: 0 auto!important;
    border:none;

}
.tab-gallery-nd li{
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 1 1 120px;
    max-width: 270px;
    transition: transform 0.3s ease;
    cursor: pointer;
    position: relative;
    
}
.tab-gallery-nd li a{
    display:flex;
    justify-content:center;
    align-items:center;
    color:#000;
    column-gap:8px;
    font-size:15px;
    padding:0;
    border:none;
}
.tab-gallery-nd li a img{
    width:32px;
    height:32px;
    position:relative;
    top:-2px;
}
.col-img{
    margin-bottom:24px;
}
.col-img img{
    border-radius:8px;
    height:228px;
    width:100%;
    object-fit:cover;
}
.tab-pane .col-md-3{
    padding:0 12px;
}
.tab-gallery-nd li a:hover img,.tab-gallery-nd li a.active img{
        filter: invert(56%) sepia(22%) saturate(1455%) hue-rotate(119deg) brightness(92%) contrast(110%);
}
.nav>li>a:focus, .nav>li>a:hover {
    text-decoration: none;
    background-color: rgba(221, 255, 255, 0.00);
    border:none!important;
    color:#2f685d;
}
.li-sc {
    direction: rtl;
}
.hide-scrollbar {
  -ms-overflow-style: none;   
  scrollbar-width: none;  
  -webkit-overflow-scrolling: touch; 
}

.hide-scrollbar::-webkit-scrollbar {
  width: 0px;
  height: 0px;
  display: none;
}
.tab-gallery-nd>li.active>a, .tab-gallery-nd>li.active>a:focus, .tab-gallery-nd>li.active>a:hover {
   color: var(--primary-color-nd);
    cursor: default;
    background-color: rgba(255, 255, 255, 0.00);
    border: none!important;
 
}

.caption-nd-web {
    width: clamp(110px, 27vw, 550px);
    top: clamp(50px, 10vw, 207px);
    left: 19%;
}

.caption-nd-web .img-hd {
    width: clamp(200px, 16vw, 500px);
}
.caption-nd-web .ti-wb-2 {
    font-size: clamp(9px, 1.2vw, 34px);
    padding: clamp(6px, 1.9vw, 16px) 0;
    color: #000;
}
.table-bx-br{
    padding-top:0px;
}



a,a:hover,a:active,a:focus,a:visited{
    outline:none;
    text-decoration:none;
}
.nav-tabs{
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
}

.nav-tabs .nav-link{
    white-space: nowrap;
}

.gallery .item{
    margin-bottom:12px;
}
.gallery .item{
    padding:0 6px;
}
.gallery img{
    width:100%;
    display:block;
    transition:.3s;
}

.tab-gallery-nd button{
    font-size:15px;
    color:var(--gold-color-nd);
}
.icon-min-tab{
        width: 32px;
    height: 32px;
    position: relative;
    top: -2px;
    margin-left:4px;
}
.tab-gallery-nd button:hover img, .tab-gallery-nd button.active img {
    filter: invert(56%) sepia(22%) saturate(1455%) hue-rotate(119deg) brightness(92%) contrast(110%);
}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active{
    border:none;
}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active ,.nav-tabs .nav-link:hover{
    color: #2f685d!important;
    background-color: rgba(255, 255, 255, 0.00);
    border:none;
    font-weight: bold;
}
.row-tab-nd .nav-link{
    position:relative;
        padding: 24px 0;
}
.row-tab-nd .nav-link.active:before{
position: absolute;
    bottom: 0px;
    height: 2px;
    background-color: #2f685d;
    width: 100%;
    content: "";
    left: 0px;
    border-radius:5px;
}
.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
 border:none!important;
 color: var(--gold-color-nd);
}

.nav-tabs .nav-link:focus-visible {
  outline: 2px solid transparent;
  box-shadow: none;
}
.nav-tabs {
  border-bottom: none;
}

.nav-tabs .nav-link {
  border: none;
  margin-bottom: 0;
}

.nav-tabs .nav-link.active {
  border: none;
  background: rgba(255, 255, 255, 0.00);
}
.glightbox{
    position:relative;
    overflow:hidden;
    border-radius:8px;
    display:block;
}
.glightbox:before{
    position:absolute;
    background: linear-gradient(0deg, rgb(0 0 0 / 51%) 0%, rgba(0, 0, 0, 0.06) 40%, rgba(0, 0, 0, 0) 100%);
    position: absolute;
    top: 0;
    left: 0;
    content: "";
    width: 100%;
    height: 100%;
    border-radius: 8px;
}
.dt-img{
    position: absolute;
    bottom: 0;
    height: 65px;
    left: 0;
    padding: 16px 24px;
    direction: rtl;
    color: #fff;
    font-size: 13px;
    width: 100%;
    line-height:21px;
}
.ic-min{
    width:16px!important;
    float:right;
    filter: brightness(0) invert(1);
    margin-left:4px;
}
.dt-img div{
    position:relative;
        padding-right:8px;
     font-size:12px;
}
.dt-img div:before{
    position: absolute;
    width: 3px;
    height: 3px;
    background-color: #fff;
    border-radius: 50%;
    content: "";
    top: 11px;
    right:0;
}




.img-clock{
width: 142px;
    margin: 7px auto;
    display: block;
    max-width: 100%;

}
.dr-lt{
    direction:rtl;
}
.p-ti-11{
    text-align:center;
 
        color: var(--gold-color-nd);
}
.dv-ce-mn{
    max-width:980px;
    margin:0 auto;
    width:100%;
        padding: 0 16px;
}
.img-ce-nd{
    display:block;
    margin:0 auto;
}
.p-ti-11 span{
    display:block;
    font-size:20px;
    padding-top:0px;
}
.p-bf{
    position: relative;
    font-size: 56px;
    color: var(--primary-color-nd);
    font-weight: bold;
}
/*.p-bf:after{
    position:relative;
    width: 83px;
    height: 15px;
    background-size:100% 100%;
    margin: 16px auto;
    content:"";
    background-image: url('../images/55li.png');
    display:block;
}*/
.tx-alrm{
    color: var(--primary-color-nd);
    font-size: 21px;
    background-image: url(../images/bn-br.png);
    background-size: 100% 100%;
    padding: 31px 61px 113px 46px;
    display: inline-block;
    margin: 0 auto;
    height: 90px;
    width: 100%;
    line-height: 42px;
    max-width: 970px;
}
.caption-nd-web2 {
    width: clamp(110px, 27vw, 550px);
    top: clamp(55px, 12vw, 228px);
    left: 15%;
}
.caption-nd-web2 .ti-wb-2 {
    color: #9d7c40;
    font-size: clamp(10px, 1.2vw, 34px);
    padding: clamp(6px, 0.8vw, 16px) 0;
    line-height: 42px;
}
.caption-nd-web2 .ti-wb {
    font-size: 99px;
    font-family: 'IranNastaliq';
    padding-bottom: 16px;
}
.caption-nd-web2 .img-hd {
    width: clamp(55px, 15vw, 500px);
}
.p-cl-bt .link-ce{
    /*background-color: var(--primary-color-nd);
    color: #fbe7c1;
    border:1px solid var(--primary-color-nd);*/
}
.p-cl-bt .link-ce:before{
    bottom: -20px;
}
.btm-dv-info{
    position:relative;
    padding-bottom:140px;
 
}
.btm-dv-info:before{
    position:absolute;
    bottom:0;
    left:0;
    height:60%;
    width:100%;
    content:"";
     background-image: url('../images/btli.png');
    background-size:100% 100%;
    z-index:-1;
    
}

.hfz-br .menu-text{
    font-size:15px;
}
.hfz-br .menu-item:last-child {
    display: flex!important;
}
@media screen and (max-width: 1270px){
    .row-tab-nd {
    width: 100%;
    top:-32px;
}
    .caption-nd-web2 .ti-wb {
    font-size: 64px;
       padding-bottom:4px;
}
}
@media screen and (max-width: 990px){
        .li-sc {
        direction: rtl;
        overflow: scroll;
        scrollbar-width: none;
    }
        .btm-dv-info:before {

    height: 30%;
}
        .btm-dv-info {
    padding-bottom: 99px;
}
        .tx-alrm{
           background:none;
           padding:0px 0;
        }
    .row-tab-nd {
    width: 100%;
    top:0px;
    margin:0px auto 0 auto;
    background:none;
   box-shadow: none;
}
    .dv-container-nd {
    max-width: 100%;
    padding:0 9px;
}
    .nav-tabs .nav-link{
        padding:8px 8px;
        border-radius:40px;
        box-shadow: 0 0 5px 0 rgb(0 0 0 / 10%);
        margin:8px 0;
        font-size:12px;
        width:100%;
    }
    .tab-gallery-nd{
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    justify-content: flex-start;
    gap: 12px;
    padding: 0 10px;
}
    .row-tab-nd .nav-link.active:before{
        display:none;
    }
    .tab-gallery-nd{
            justify-content: flex-start;
    }
    .icon-min-tab {
    width: 16px;
    height: 16px;
    position: relative;
    top: -2px;
    margin-left: 4px;
}
    .row-tab-nd{
    padding:0px 16px 8px 0;
    
}
    .tab-content{
        padding:0 12px;
    }

}
@media screen and (max-width:760px){

.tab-gallery-nd{
    column-gap:8px;
}

.caption-nd-web .ti-wb-2 {
    font-size: clamp(7px, 0.4vw, 34px);
    padding: clamp(6px, 1.9vw, 16px) 0;
    color: #000;
}
   .hfz-br .hafez-menu-list {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px 10px;
    }
   .hfz-br .menu-text {
    font-size: 13px;
}
       .btm-dv-info {
        padding-bottom: 80px;
    }   
        .btm-dv-info:before {
        height:16%;
    }
   .menu-item{
           border: 1px solid #9d856b;
        padding: 8px 0;
        border-radius: 8px;
   }
   .hfz-br{
       padding:0 16px;
   }
.dv-gallery{
    padding:0 0;
}
.dt-img div{
    display:none;
}
.gallery .item {
    padding: 0 4px;
}
.gallery .item {
    margin-bottom: 8px;
}
.dt-img {
    height: 44px;
    left: 0;
    padding: 16px 17px;
    color: #fff;
    font-size: 12px;
    width: 100%;
    line-height: 21px;
}
#search-acan{
    top:14px;
}

.caption-nd-web2 .ti-wb-2 {
    line-height:10px;
}
.caption-nd-web2 {
     top: clamp(50px, 15vw, 228px);
}

.p-bf {
    font-size:24px!important;
}
.p-ti-11 span,.p-ti-11 {
    font-size: 14px;
}
.img-ce-nd {
    width: 40px;
}
.p-bf:after {
    width: 59px;
    height: 13px;
    margin: 10px auto;
}

.tx-alrm {
    font-size: 14px;
    line-height: 29px;
    padding:32px 0 32px 0;
    height:auto;
}
.hfz-br .icon-wrapper img {
    width:40px;
    height:40px;
    object-fit: contain;
}
}
@media screen and (max-width:450px){
    .caption-nd-web2 .ti-wb-2 {
    font-size: clamp(8px, 1.2vw, 34px);
}
}



  

        /* Custom Cards */
        .custom-card {
            background-color: #fff;
            border: 1px solid #fff;
            border-radius: 16px;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02);
            transition: transform 0.2s ease, box-shadow 0.2s ease;
        }

        .custom-card:hover {
            box-shadow: 0 6px 20px rgba(0, 0, 0, 0.05);
        }

        /* Main Article Card */
        .article-card {
            overflow: hidden;
            padding: 1.25rem;
        }

        .article-img {
            width: 100%;
            height: 200px;
            object-fit: cover;
            border-radius: 12px;
        }

        .article-title {
            font-size: 1.15rem;
            font-weight: 700;
            color: #1a202c;
            text-decoration: none;
            transition: color 0.2s;
        }

        .article-title:hover {
            color: var(--primary-color-nd);
        }

        .article-excerpt {
            font-size: 0.88rem;
            color: var(--text-muted);
            line-height: 1.7;
        }

        .article-meta {
            font-size: 0.78rem;
            color: #494a4a;
        }

        .read-more-btn {
            color: var(--primary-color-nd);
            text-decoration: none;
            font-size: 1.1rem;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 32px;
            height: 32px;
            border-radius: 50%;
            background-color: #f0f7f4;
            transition: all 0.2s;
        }

        .read-more-btn:hover {
            background-color: var(--primary-color-nd);
            color: #fff;
        }

        /* Sidebar Widgets */
        .widget {
            padding: 1.5rem;
            margin-bottom: 1.5rem;
        }

        .widget-title {
            font-size: 1.05rem;
            font-weight: 700;
            color: var(--primary-color-nd);
            margin-bottom: 1.25rem;
        }

        .popular-item {
      display: flex;
    align-items: center;
    justify-content: right;
    padding-bottom: 0.85rem;
    margin-bottom: 0.85rem;
    border-bottom: 1px solid var(--border-color);
    column-gap: 24px;
        }

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

        .popular-item img {
            width: 87px;
            height: 55px;
            object-fit: cover;
            border-radius: 8px;
        }

        .popular-title {
            font-size: 0.83rem;
            font-weight: 600;
            color: var(--text-main);
            text-decoration: none;
            line-height: 1.4;

            /* Line Clamp for 2 lines */
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }

        .popular-title:hover {
            color: var(--primary-color-nd);
        }

        .popular-views {
            font-size: 0.72rem;
            color: var(--text-muted);
        }

        /* Categories Widget */
        .category-item {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0.4rem 0;
            color: #4a5568;
            font-size: 0.88rem;
            text-decoration: none;
            transition: color 0.2s;
        }

        .category-item:hover {
            color: var(--primary-color-nd);
        }

        .category-count {
            font-size: 0.8rem;
            color: var(--text-muted);
        }

        /* Newsletter Widget */
        .newsletter-btn {
            background-color: var(--primary-color-nd);
            color: white;
            border: none;
            border-radius: 8px;
            padding: 0.6rem;
            font-weight: 600;
            width: 100%;
            transition: background-color 0.2s;
        }

        .newsletter-btn:hover {
            background-color: var(--primary-hover);
            color: white;
        }

        /* Tags Widget */
        .tag-badge {
    display: inline-block;
    background-color: #faf9f7;
    color: #64748b;
    font-size: 0.78rem;
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    text-decoration: none;
    margin-bottom: 0.5rem;
    margin-left: 0.25rem;
    transition: all 0.2s;
        }

.tag-badge:hover {
            background-color: var(--primary-color-nd);
            color: white;
}
.sticky-sidebar {
    position: -webkit-sticky;
    position: sticky;
    top: 2rem; 
    height: fit-content; 
}
footer:before {
content: "";
    position: absolute;
    top: -52px;
    left: 0;
    right: 0;
    height: 73px;
    width: 100%;
    background-image: url(../images/ft.png);
    background-size: 100px 41px;
    background-repeat: no-repeat;
    z-index: 1;
    background-position: center;
}
footer {
    padding: 37px 0 8px 0;
}




.ti-1-wb{
           color: #2f685d;
    font-size: 26px;
    font-weight: bold;
    padding-bottom:24px;
    text-align: center;
    position:relative;
    display:table;
    margin:32px auto 0 auto;

}
.ti-1-wb:before{
background-image: url(../images/lf-rty.png);
    position: absolute;
    content: "";
    top:4px;
    left: -50px;
    width: 35px;
    height: 31px;
    background-size: 100% 100%;
}
.ti-1-wb:after{
background-image: url(../images/rg-ll.png);
    position: absolute;
    content: "";
    top:4px;
    right: -50px;
    width: 35px;
    height: 31px;
    background-size: 100% 100%;
}
.ti-1-wb:before{
    position:absolute;

}
.ti-tx-wb-titr{
    color: #2f685d;
    font-size: 21px;
    font-weight: bold;
    text-align: right;
    display: flex;
    column-gap: 4px;
    align-items: center;

}
/*.ti-tx-wb-titr:before{
    position:absolute;
        background-image: url(../images/lf-rty.png);
    position: absolute;
    content: "";
    top:12px;
    left: -50px;
    width: 35px;
    height: 29px;
    background-size: 100% 100%;
}
.ti-tx-wb-titr:after{
    position:absolute;
        background-image: url(../images/rg-ll.png);
    position: absolute;
    content: "";
    top:12px;
    right: -50px;
    width: 35px;
    height: 29px;
    background-size: 100% 100%;
}*/
.p-txt {
    font-size: 16px;
    line-height: 39px;
    text-align: justify;
    direction: rtl;
   letter-spacing:0!important;
    margin: 0 auto;
  word-break: normal !important;
}

.img-pn{
 display: block;
    margin: 0px auto 32px auto;
    max-width: 480px;

}
.p-cl {
    text-align: center;
    color: var(--primary-color-nd);
    font-family: 'IranNastaliq';
    font-size: 52px;
    position: absolute;
    width: 100%;
    top: 0;
    z-index: 99999;
}
.text-bt{
        text-align: center;
    color: var(--primary-color-nd);
    font-family: 'IranNastaliq';
    font-size:45px;
    width: 100%;
    padding:8px 0;
}
.text-bt span {
    padding: 0 32px;
}
.ti-web-titr{
    color:#2f685d;
    text-align:center;
    font-size:33px;
    padding:32px 0;
    font-weight:bold;
}
.pb-12{
    padding-bottom:16px;
}
.p-rg{
    text-align:justify;
    direction:rtl;
}
.h-rg{
        text-align:right;
    direction:rtl;
    float:right;
    margin:0 0;
        
}
.img12{
    margin:0 auto;
    display:block;
    max-width:500px;

}
.img-mx{
    max-width: 861px;
    width:90%;
    margin:0 auto;
    display:block;
}
.caption-nd-lg .ti-wb-mn{
    font-size:88px;
}
.img-pn-mx{

    display: block;
    margin: 0px auto 32px auto;
    width: 680px;
    max-width:95%;
}
.caption-nd-web-tp {
    top: clamp(44px, 8vw, 207px);
}
.p-txt p span{
    font-weight:bold;
    font-size:18px;
    color:#2f685d;
}
.container, .container-md, .container-sm {
     max-width:100%!important;
    }

@media only screen and (max-width: 760px){
    .ti-1-wb {
    font-size: 15px;
    padding-bottom:8px;
    margin-top:16px;
}
    .sticky-wrapper {
    position: relative;
    height: auto;
    min-height: 60px;
}
    .hero-section {
    height: auto;
    min-height:60px !important;
}
    .ti-1-wb:before {
    top: 1px;
    left: -34px;
    width: 23px;
    height: 12px;
}
    .ti-1-wb:after {
  top: 1px;
    right: -34px;
    width: 23px;
    height: 12px;
}

    .p-txt{
        text-align:justify!important;
        font-size:13px;
        line-height:28px;
    }
    .btn-pn .dv-container-nd{
        padding:0 0;
    }
    .ti-tx-wb-titr {
   font-size: 16px;
        line-height: 29px;
        text-align:justify;
        direction:rtl;
        padding-bottom:4px !important;
}
    .p-pn-mb{
        padding:0 16px;
    }
    .btn-pn br{
        display:none;
    }
    .text-bt {
    font-size: 26px;
    padding:4px 0px;
}
    .text-bt span {
    padding: 0 8px;
}
    .img-pn {
    margin: 0px auto 0px auto;
    max-width:80%;
}
    footer:before {
    top: -51px;
    left: 0;
    right: 0;
    height: 83px;
    background-size: 79px 28px;

}
    .p-txt p span {
    font-size: 14px;
}
}



.img-hd-md{
    width:13px;
    position:relative;top:2px;
}
.dt-lf{
    width: 70px;
    margin: 0 auto;
    display: block;
    height: 40px;
}

.caption-nd-web-hfz{
position: absolute;
    width: clamp(110px, 27vw, 550px);
    top: clamp(91px, 15vw, 164px);
    left: 9%;
    font-size: clamp(18px, 1.8vw, 36px);

}
.caption-nd-web-hfz .ti-wb{
    font-size:90px;
}
.bt-sh-li{
    position:relative;
    padding:115px 0 135px 0;
}
.bt-sh-li .text-bt {
    text-align: right;
    color: var(--primary-color-nd);
    font-family: 'Modam-Regular';
    font-size: 24px;
    width: 100%;
    padding:16px 0!important;
}
.img-rg-sd{
    position:absolute;
    left:0;
    top:0;
    width:60%;
    z-index:-1;
}
.bt-sh-li .text-bt span{
    font-size:18px;
    text-align:right;
    padding:0 16px;
}
.ty-12 .text-bt{
    font-size:19px;
     font-family: 'Modam-Regular';
     padding:16px 0;
}
.img-pn-nm{
    max-width:80%;
    margin:0 auto;
    display:block;
}
.ti-p-ce{
    text-align:center;
    color:#2f685d;
    display:flex;
    justify-content:center;
    align-items:center;
    direction:rtl;
    column-gap:4px;
    font-size:19px;
}




     .rule-card {
            /*background-color: #ffffff;*/
            border: 1px solid #e7edea;
            border-radius: 12px;
            padding: 22px 20px;
            height: 100%;
            display: flex;
            align-items: center;
            justify-content: space-between;
            box-shadow: 0 2px 6px rgba(0, 0, 0, 0.02);
            transition: all 0.2s ease-in-out;
           
        }

        .rule-card:hover {
            border-color: #386641;
            box-shadow: 0 4px 12px rgba(56, 102, 65, 0.08);
            transform: translateY(-2px);
        }

        .rule-text {
            font-size: 0.95rem;
            line-height: 1.8;
            color: #475569;
            margin: 0;
            flex: 1;
            text-align: justify;
            direction:rtl;
            padding-right: 16px;
        }

        .rule-meta {
            display: flex;
            align-items: center;
            gap: 14px;
            flex-shrink: 0;
        }

        .icon-circle {
            width: 48px;
            height: 48px;
            background-color: #f3f7f4;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #2d5a37;
            font-size: 1.4rem;
        }

        .rule-number {
            font-size: 1.15rem;
            font-weight: 700;
            color: #8c857b;
            min-width: 22px;
            text-align: center;
        }
        .img-fluid {
width: 100%;
    height: auto;
}
.icn-mn{
    width:32px;
}
.link-ti{
    color:#0a9278;
}
    .banner {
      background-color: #f6f5ef;
      border-radius: 1rem;
      overflow: hidden;
    }
    .banner  strong { color: #9d7c40; }
    .icon-box {
      width: 72px;
      height: 72px;
      background-color: #0f4c4c;
      color: #fff;
      border-radius: 12px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 2.2rem;
    }
    .banner-img {
      max-height: 260px;
      object-fit: contain;
      width: 100%;
    }
    .p-sz{
        font-size:14px;
        height:140px;
    }
    .py-4-nd{
        padding:42px 0;
    }
    .p-dg .p-txt strong{
        font-size:17px;
        color:#2f685d;
    }
    .p-bc{
      background-color: #f6f5ef;
    border-radius: 1rem;

    }
    .bc-blog{
        
        position:relative;
    }
    .bc-blog:before{
      background-image: url('../images/li-rg-blg.jpg');
        position:absolute;
        height:100%;
        background-size:100%;
        width:176px;
        content:"";
        top:0;
        right:0;
        background-size:100% 100%;
    }
        .bc-blog:after{
      background-image: url('../images/lf-li-blog.jpg');
        position:absolute;
        height:100%;
        background-size:100%;
        width:170px;
        content:"";
        top:0;
        left:0;
        background-size:100% 100%;
    }


        .toc-item {
      display: flex;
      align-items: center;
      text-decoration: none;
      color: inherit;
      transition: background-color 0.2s ease;
    }

    .toc-item:hover {
      background-color: rgba(197, 160, 89, 0.08);
      color: #795548;
    }

    .toc-arrow {
    color: #c5a059;
    font-size: 1.1rem;
    display: flex
;
     border-bottom: 1px solid #ebe1d5;
    align-items: center;
    height: 56px;
    width: 56px;
    align-items: center;
    justify-content: center;
    }

    .toc-title {
         font-size: clamp(13px, 1.8vw, 16px);
    font-weight: 500;
    color: #2b2b2b;
    margin: 0;
    height: 56px;
    border-bottom: 1px solid #ebe1d5;
    display: flex;
    align-items: center;
    padding-left: 0px;
    }

    .toc-badge-icon {
      color: #c5a059;
      font-size: 1.4rem;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .toc-number {
     font-size: 17px;
    color: #555555;
    min-width: 24px;
    text-align: center;
    border-left: 1px solid #ebe1d5;
    height: 56px;
    display: flex;
    width: 56px;
    align-items: center;
    justify-content: center;
}
    
 .toc-item:last-child .toc-number{
      border-bottom:1px solid #ebe1d5
  }
    .toc-badge-icon{
        background-image: url('../images/ic11.png');
        width:68px;
        height:56px;
        background-position:center;
          border-bottom: 1px solid #ebe1d5;
          background-size:25px 25px;
          background-repeat:no-repeat;
    }
        .dv-ce-blog{
         width: calc(100% - 332px);
        margin:32px auto;
        background-color:#faf9f7;
        z-index:99;
        border:1px solid #f1eae0;
        border-radius:32px;
        position:relative;
        border-bottom:none;
    }

    .bc-mn-nd{
        
        position:relative;
    }
    .bc-mn-nd:before{
      background-image: url('../images/rg-sd-12.jpg');
        position:absolute;
        height:85%;
        background-size:100%;
        width:325px;
        content:"";
        top:40px;
        right:0;
        background-size:100% 100%;
    }
        .bc-mn-nd:after{
      background-image: url('../images/lf-wo.jpg');
        position:absolute;
        height:100%;
        background-size:100%;
        width:190px;
        content:"";
        top:70px;
        left:0;
        background-size:100% 100%;
    }
.dv-cn{
        width: calc(100% - 332px);
    margin: 32px auto;
    z-index: 99;
    position: relative;
    border-bottom: none;

}


.bx--shd{
    background-color:#faf9f7;
    position:relative;
}
.ti-bx-12{
    background-image: url(../images/ti-mnn.png);
    background-size: 100% 100%;
    position: absolute;
    top: -29px;
    right: 20px;
    align-items: center;
    display: flex;
    direction: rtl;
    color: #e5dfd1;
    font-size: 20px;
    width: 187px;
    height: 60px;
    padding: 0 16px;
    column-gap: 8px;
}
.ti-bx-12 img{
    width:35px;
}
.toc-item-bl{
        display: flex;
    align-items: center;
    text-decoration: none;
    color: inherit;
    transition: background-color 0.2s ease;
    column-gap:8px;
}
.toc-number-bl{
width: 45px;
height: 45px;
display:flex;
align-items:center;
justify-content:center;
background-repeat: no-repeat;
background-position: center;
background-size: contain;
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 500 500' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23E8DEC8'%3E%3Ccircle cx='250' cy='250' r='145'/%3E%3Ccircle cx='250' cy='115' r='58'/%3E%3Ccircle cx='345' cy='155' r='58'/%3E%3Ccircle cx='385' cy='250' r='58'/%3E%3Ccircle cx='345' cy='345' r='58'/%3E%3Ccircle cx='250' cy='385' r='58'/%3E%3Ccircle cx='155' cy='345' r='58'/%3E%3Ccircle cx='115' cy='250' r='58'/%3E%3Ccircle cx='155' cy='155' r='58'/%3E%3C/g%3E%3C/svg%3E");
color:#2f685d;
font-size:18px;
}
.toc-title-bl{
border-right: 1px solid #e8dec8;
}
.dc-pn-lo{
    padding-top:150px;
    text-align:center;
}
.img-ic-mn-cl{
    width:202px;
    margin:16px auto;
    display:block;

}
.p-ty-bn{
    font-size:29px;
    color:#2f685d;
    font-weight:bold;
    line-height:53px;
}
.p-ty-bn strong{
    color:#9d7c40;
}

.row-btm{
    position:relative;

}
.row-btm:before{
    background-image: url('../images/bc-lio-58.png');
    height:100%;
    content:"";
    top:80px;
    left:0;
    position:absolute;
    width:100%;
    background-size:100% 100%;
}
    .step-card {
      background: #ffffff;
      border-radius: 20px;
      border: 1px solid #e9ecef;
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);
      position: relative;
      padding-top: 35px;
      height: 100%;
      transition: all 0.3s ease;
    }

    .step-card:hover {
      transform: translateY(-5px);
      box-shadow: 0 8px 25px rgba(0, 0, 0, 0.06);
    }
    .step-badge {
      position: absolute;
      top: -18px;
      left: 50%;
      transform: translateX(-50%);
      width: 38px;
      height: 38px;
      background-color: #b78a48; 
      color: #fff;
      font-weight: 700;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      border: 3px solid #fff;
      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
    }
    .step-img-box {
      height: 130px;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 1.25rem;
    }

    .step-img-box img {
      max-height: 100%;
      object-fit: contain;
    }
    .step-title {
      color: #174d38; 
      font-weight: 700;
      font-size: 1.15rem;
      margin-bottom: 0.75rem;
    }
    .step-desc {
      color: #6c757d;
      font-size: 0.92rem;
      line-height: 1.7;
    }

    .arrow-connector {
      display: none;
    }

@media (min-width: 768px) {
    .arrow-connector {
        display: flex;
        align-items: center;
        justify-content: center;
        color: #174d38;
        font-size: 1.4rem;
        border-bottom: 2px dashed #174d38;
        width: 40px;
        margin-bottom: 40px;
        position: relative;
    }

        .arrow-connector::before {
            content: '←';
            position: absolute;
            left: -8px;
            top: -14px;
            font-size: 1.2rem;
            font-weight: bold;
        }

}
@media (max-width:1420px){
.dv-ce-blog {
    width: calc(100% - 120px);
    margin: 32px auto;
}
    .dv-cn {
        width: calc(100% - 120px);
        margin: 32px auto;
    }
}
@media (min-width:990px) and (max-width:1100px){
    .btn-pn br {
        display: none;
    }
    .mg-blg{
      top: clamp(28px, 13vw, 164px);
    
    }
    .img-flg{
        height:100%;
        object-fit:cover
    }
    .p-txt {
    font-size: 14px;
}
    .ti-tx-wb-titr{
        line-height:40px;
    }
    .dv-container-nd {
    max-width:100%;
    margin: 0 auto;
    padding:0 12px;
}
          .dc-pn-lo {
    padding-top: 80px;
}
          .ty-dst{
                  top: clamp(91px, 15vw, 104px);
          }
}
@media (max-width:990px){
.bt-sh-li {
    position: relative;
    padding: 0px 0 32px 0;
}
       .ti-bx-12 {
    top: -24px;
    right: 11px;
    font-size: 15px;
    width: 153px;
    height: 49px;
    padding: 0 9px;
}
    .dv-cn {
        width: calc(100% - 32px);
        margin: 32px auto;
    }
.mg-blg{
    left:5%;
}
.toc-item{
    padding:8px 16px;
    border-bottom:1px solid #ebe1d5;
}
.toc-title{
    height:auto;
    border:none;
}
.toc-arrow{
    border:none;
}
.banner{
     margin-bottom:16px;
 }
 .toc-number,.toc-badge-icon{
     display:none;
 }

 .dv-ce-blog {
        width: calc(100% - 32px);
        margin: 16px auto;
    }
 .p-sz{
     height:auto;
 }
.caption-nd-lg .ti-wb {
    font-size: 55px;

}
     .caption-nd-web-hfz .ti-xx{
        font-size:55px;
    }
.img-rg-sd {
width:100%;
position:relative;
top:0;
}
.bt-sh-li .text-bt{
    text-align:center;
}
  .row-text{
        padding:0 12px;
    }
      .caption-nd-web-hfz {
    top: clamp(86px, 10vw, 158px);
}
      .row-btm:before{
          background-size:cover
      }
      .dc-pn-lo {
    padding-top: 0px;
}
      .step-title {
     font-size:16px;
    margin-bottom: 0.75rem;
}
      .p-ty-bn {
    font-size: 23px;
}
}
@media (max-width: 768px){
       .caption-nd-lg .ti-wb ,.caption-nd-web2 .ti-wb ,.caption-nd-web-tp .ti-web,.caption-nd-web-hfz .ti-wb{
    font-size: 30px;
       padding-bottom:4px;
}  
       .bc-mn-nd:before{
         display:none;
   }
       .bc-mn-nd:after {
    height: 72%;
    width: 100%;
    top: 0px;
}
       .toc-number-bl{
           display:none;
       }
       .toc-item-bl:last-child .toc-title-bl{
           border-bottom:none;
       }
       .toc-title-bl {
  border:none;
  font-size:13px;
  border-bottom:1px solid #ebe1d5;
  padding:8px 0;
  line-height:24px;
  text-align:justify;
  direction:rtl;
}
.toc-title{
    font-size:13px;
    line-height:24px;
}
.toc-arrow{
    height:auto;
        width: 13px;
        font-size:12px;
}
.toc-item{
    padding:8px 16px;
    border-bottom:1px solid #ebe1d5;
}
       .py-4-nd {
    padding: 0px 0 0px 0;

}
       .banner-img{
               max-width:140px;
    margin:0 auto 8px auto;
       }
       .rule-card{
           padding:16px 16px;
       }
.caption-nd-web .img-hd{
    width:80%;
    margin:0 auto;
}
.p-dg .p-txt strong {
    font-size: 14px;
}
.ti-tx-wb-titr img{
    width:20px;
}
.caption-nd-web-hfz {
    top: clamp(34px, 14vw, 164px);

}
    .icon-circle {
        width: 39px;
        height: 43px;
    }
.icon-circle img{
    width:100%;
}
    .rule-text {
        font-size: 13px;
        padding-right:8px;
    }
.rule-number{
    display:none;
}
.img-pn-mx {
    margin: 0px auto 8px auto;
}
.bt-sh-li .text-bt span,.ty-12 .text-bt span{
    display:block;
    text-align:center;
    padding:4px 0;
    font-size:16px;
}
.bt-sh-li .text-bt{
    padding:8px 0!important;
}
    .bt-sh-li {
        padding: 0px 0 16px 0;
    }
    .ty-12 .text-bt {
    padding:8px 0;
}
    .row-text{
        padding:0 4px;
    }
    .ti-p-ce {
    font-size: 16px;
}
    .ti-p-ce{
             font-size: 14px;
        text-align: justify;
        line-height: 28px;
        display: block;
    }
    .dt-lf {
    width: 57px;
    height: 22px;
}
    .p-xx{
        font-size:24px;
    }
    .p-tx-mn-lg span{
        display:block;
        padding:4px 0;
    }
    .caption-nd-web-hfz .ti-wb{
        font-size:35px;
    }
      .caption-nd-web-hfz .ti-xx{
        font-size:25px;
    }
      .pb-xx{
         margin-bottom:8px;
      }
      .dc-pn-lo {
    padding-top:0px;

}
      .img-ic-mn-cl {
    margin:0px auto 8px auto;
}
      .p-ty-bn {
    font-size: 19px;
    line-height: 42px;
}
.step-img-box img{
    max-width:95px;
}
.step-img-box{
    height:auto;
    padding-top:16px;
    margin-bottom:4px;
}
         .mg-blg{
      top: clamp(28px, 13vw, 120px);
          width: clamp(116px, 25vw, 550px);
              left: 16px;
    }
}