@font-face {
    font-family: 'iransans';
    src: url(../fonts/IRANSansWeb_Light.woff2) format("woff2");
    src: url(../fonts/IRANSansWeb_Light.woff) format("woff");
}

* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

ul {
    list-style: none;
}

body {
    font-family: 'iransans' !important;
    direction: rtl;
    text-align: right;
    scroll-behavior: smooth;
}

:root {
    --white: #fff;
    --gray: #6c757d;
    --blue: #32C1FD;
    --green: #14635b;
    --gold: #d2ab67;
    --black: #3a3a3a;
}

a {
    text-decoration: none !important;
}

hr {
    color: var(--gray);
}

.text-sm {
    font-size: 13px;
}

.line-height {
    line-height: 1.9;
}

.text-justify {
    text-align: justify;
}

#padding span span {
    padding: 5px;
    border-radius: 10px;
}

.header-margin {
    margin-top: 65px;
}

.widget-box {
    display: block;
    padding: 15px;
    margin: 10px 0;
    background-color: #fff;
    border-radius: 8px;
    border: 1px solid #ebeefd;
    -webkit-box-shadow: 0 4px 12px rgb(109 114 139 / 10%);
    box-shadow: 0 4px 12px rgb(109 114 139 / 20%);
}

    .widget-box h3 {
        line-height: 1.9;
    }

.widget-title {
    font-weight: 600;
    font-size: 20px;
    color: var(--black);
}

.divider {
    position: relative;
    display: block;
    margin: 12px 0 24px 0;
    max-width: 100%;
    height: 2px;
    background-color: #d1dcff;
    border-radius: 20px;
    border: none;
}

    .divider::before {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        border-radius: 20px;
        width: 50px;
        height: 2px;
        background-color: var(--gold);
    }

.title-section {
    display: flex;
    justify-content: space-between;
}

    .title-section h2 {
        font-size: 18px;
        font-weight: bold;
        padding: 5px;
        margin-bottom: 18px;
        display: inline-block;
        border-bottom: 4px solid #32837b;
        border-radius: 7px;
        -webkit-border-radius: 7px;
        -moz-border-radius: 7px;
        -ms-border-radius: 7px;
        -o-border-radius: 7px;
    }

    .title-section a {
        font-size: 15px;
        color: var(--black);
        margin-top: 10px;
        transition: 0.4s all;
        -webkit-transition: 0.4s all;
        -moz-transition: 0.4s all;
        -ms-transition: 0.4s all;
        -o-transition: 0.4s all;
    }

        .title-section a i {
            color: var(--gold);
            font-size: 12px;
        }



/* navbar */
.nav-link {
    font-size: 15px;
    font-weight: bold;
    color: #3a3a3a !important;
    transition: 0.4s;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -ms-transition: 0.4s;
    -o-transition: 0.4s;
}

    .nav-link:hover {
        color: #14635b !important;
    }

.bg-nav {
    background: var(--white);
    transition: background-color 200ms linear;
    -webkit-transition: background-color 200ms linear;
    -moz-transition: background-color 200ms linear;
    -ms-transition: background-color 200ms linear;
    -o-transition: background-color 200ms linear;
}

.offcanvas-item {
    margin: 5px 0;
}

.offcanvas-link {
    color: var(--black);
    font-weight: bold;
    font-size: 15px;
    transition: 0.4s all;
    -webkit-transition: 0.4s all;
    -moz-transition: 0.4s all;
    -ms-transition: 0.4s all;
    -o-transition: 0.4s all;
}

    .offcanvas-link:hover {
        color: var(--green);
    }

.offcanvas-close-btn {
    color: #fff;
    background: #3e3e3e;
    padding: 4px 12px;
    font-size: 20px;
    border-radius: 5px;
}


/* header */
header {
    color: var(--white);
    overflow: hidden;
}

.index-header-image {
    min-height: 100vh;
    background: linear-gradient(rgb(0, 0, 0, 0.5), rgb(0, 0, 0, 0.5), rgb(0, 0, 0, 0.5)), url('../images/header/index.png') center/cover fixed no-repeat;
}

.title-heading h1 {
    text-align: right;
    margin-right: 150px;
    margin-bottom: 20px;
    font-size: 50px;
    font-weight: bold;
}

.title-heading p {
    text-align: right;
    margin-right: 150px;
    font-size: 18px;
    color: #e1e1e1;
    font-weight: bold;
    line-height: 1.9;
}

.header-btn {
    text-align: right;
    margin-right: 150px;
}

/* Types of insurance */
.insurance-box {
    text-align: center;
    transition: 0.2s;
    height: 150px;
    -webkit-transition: 0.2s;
    -moz-transition: 0.2s;
    -ms-transition: 0.2s;
    -o-transition: 0.2s;
}

    .insurance-box i {
        color: #198754;
        font-size: 26px;
    }

    .insurance-box h3 {
        color: var(--black);
        font-weight: bold;
        font-size: 19px;
        line-height: 1.5;
        margin-top: 10px;
        transition: 0.2s;
        -webkit-transition: 0.2s;
        -moz-transition: 0.2s;
        -ms-transition: 0.2s;
        -o-transition: 0.2s;
    }

    .insurance-box p {
        color: var(--gray);
        font-size: 13px;
        transition: 0.2s;
        -webkit-transition: 0.2s;
        -moz-transition: 0.2s;
        -ms-transition: 0.2s;
        -o-transition: 0.2s;
    }

    .insurance-box:hover {
        background: #198754;
    }

        .insurance-box:hover i,
        .insurance-box:hover h3,
        .insurance-box:hover p {
            color: white;
        }


/* blog */
.blog-box img {
    width: 100%;
    height: 270px;
    object-fit: cover;
    border-radius: 15px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    -ms-border-radius: 15px;
    -o-border-radius: 15px;
}

.blog-box .blog-title a {
    color: var(--black);
    font-size: 16px;
    transition: 0.4s;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -ms-transition: 0.4s;
    -o-transition: 0.4s;
}

    .blog-box .blog-title a:hover {
        color: #198754;
    }

.blog-box .blog-text {
    height: 80px;
    overflow: hidden;
    text-align: justify;
    line-height: 1.9;
    font-size: 14px;
}


/* footer */
.footer {
    background-color: #2a2a2a;
    padding: 40px 0;
    text-align: center;
}

    .footer p {
        color: white;
    }

    .footer h5 {
        color: white;
    }

    .footer a {
        color: white;
        text-decoration: none;
        font-size: 14px;
    }

        .footer a:hover {
            color: #d2ab67;
        }

.social-icons a {
    margin: 0 8px;
    font-size: 18px;
}

.register-box {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #1e1e1e;
    border-radius: 25px;
    padding: 5px;
    max-width: 400px;
    margin: 0 auto 20px;
}

    .register-box input {
        flex-grow: 1;
        border: none;
        background: transparent;
        color: white;
        outline: none;
        padding: 10px;
    }

    .register-box button {
        background-color: #28a745;
        color: white;
        border: none;
        padding: 10px 20px;
        border-radius: 20px;
    }

.language-select {
    background: #1e1e1e;
    color: white;
    border: none;
    padding: 5px 10px;
    border-radius: 5px;
}

/* contact us */
.contact-info {
    margin-top: 70px;
    text-align: center;
}

    .contact-info h4 {
        font-size: 40px;
        font-weight: bold;
        margin-bottom: 40px;
    }

    .contact-info a {
        margin-bottom: 20px;
        color: #3e3e3e !important;
    }

    .contact-info i {
        color: rgb(206, 84, 105);
    }

/* about page */
.aboutUs h1 {
    font-size: 45px;
    font-weight: bold;
    color: #3e3e3e;
}

.about-des {
    line-height: 1.9;
    text-align: justify;
    color: #444444;
    font-size: 14px;
}

.text-item h4 {
    color: #3e3e3e;
}

.text-item p {
    line-height: 1.9;
    text-align: justify;
    color: #444444;
    font-size: 14px;
}


/* blog */
.pagination-wrap ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

    .pagination-wrap ul li {
        display: inline-block;
    }

        .pagination-wrap ul li a {
            color: #5c5c5c;
            font-size: 15px;
            background-color: rgb(231, 231, 231);
            display: inline-block;
            padding: 8px 14px;
            border-radius: 5px;
            margin: 3px;
            font-weight: 600;
            border-radius: 50px;
            text-decoration: none;
            transition: 0.7s;
        }

/* question */
.rules-header {
    background-color: rgb(20, 99, 91);
    color: rgb(255, 255, 255);
    text-align: center;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 8px;
    padding: 40px 20px;
}

.rules-header-title {
    font-size: 32px;
    font-weight: bold;
}

/* register */
.register-container {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    background-color: #f7f7f7;
}

.register-card {
    border: none;
    border-radius: 15px;
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1);
    padding: 2rem;
    background-color: #fff;
    margin: 70px 0;
}

.register-header {
    text-align: center;
    margin-bottom: 1.5rem;
}

    .register-header h1 {
        font-size: 1.8rem;
        font-weight: bold;
        color: var(--green);
    }

.register-form .form-control {
    border-radius: 10px;
    margin-bottom: 1rem;
}

.register-form .btn-register {
    background-color: var(--green);
    color: #fff;
    border-radius: 10px;
    padding: 0.6rem;
    transition: background-color 0.3s ease;
    -webkit-transition: background-color 0.3s ease;
    -moz-transition: background-color 0.3s ease;
    -ms-transition: background-color 0.3s ease;
    -o-transition: background-color 0.3s ease;
}

    .register-form .btn-register:hover {
        background-color: #135650;
        color: #fff;
    }

.register-form .form-footer {
    text-align: center;
    margin-top: 1rem;
}

.input-icon {
    position: relative;
}

    .input-icon .fa {
        position: absolute;
        top: 50%;
        left: 10px;
        color: var(--gold);
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
    }

.form-control.has-icon {
    padding-left: 2.5rem;
}

input:focus {
    outline: none !important;
    box-shadow: 0 0 5px 2px rgba(255, 193, 7, 0.6) !important;
    border-color: #ffc107 !important;
}

.show-password span {
    font-size: 13px;
}

/* insurance-single */
.insurance-single-title {
    font-weight: bold;
    font-size: 25px;
    margin-top: 50px;
    margin-bottom: 10px;
    line-height: 1.9;
}

.breadcrumb-item-link {
    color: var(--gray);
    transition: 0.4s;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -ms-transition: 0.4s;
    -o-transition: 0.4s;
}

    .breadcrumb-item-link:hover {
        color: var(--green);
    }

.insurance-single-text h6 {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 20px;
}



.stepper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    position: relative;
}

.step {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    flex: 1;
    text-align: center;
}

    .step .circle {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        background-color: #ddd;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 20px;
        color: white;
        position: relative;
        z-index: 2;
    }

    .step.active .circle {
        background-color: #198754;
    }

.step-line {
    position: absolute;
    top: 20px;
    left: 50%;
    width: 100%;
    height: 5px;
    background-color: #ddd;
    z-index: 1;
}

.step:first-child .step-line {
    width: 50%;
    left: 50%;
}

.step:first-child .step-line {
    display: none;
}

.insurance-single-form h3 {
    font-weight: bold;
    text-align: center;
}
/* profile */
.profile-margin {
    margin-top: 120px;
}

.profile-link li {
    list-style: none;
    margin: 15px;
    font-weight: 500;
    font-size: 15px;
}

.profile-link a {
    color: #26262a;
    transition: 0.5s all;
    -webkit-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -ms-transition: 0.5s all;
    -o-transition: 0.5s all;
}

    .profile-link a:hover {
        color: #0a97b0;
    }

.profile-information li {
    list-style: none;
    padding: 10px 0;
    font-size: 15px;
}

.profile-information i {
    margin-left: 10px;
    font-size: 14px;
    color: var(--gold);
}

.user-profile-img {
    width: 200px;
    height: 200px;
    object-fit: cover;
    padding: 10px;
    /*    border: 1px solid var(--gray);*/
    border-radius: 50%;
}

.alert-info {
    background-color: #f0f8ff !important;
    border: 1px solid #bee5eb !important;
    border-radius: 10px;
}

.alert {
    padding-bottom: 5px !important;
}

.alert-text {
    line-height: 1.9;
    text-align: justify;
}

.insurance-suggestions-border {
    display: inline-block;
    border-bottom: 3px solid #198754;
    padding-bottom: 5px;
    border-radius: 5px;
}


/* قاب اسلایدر با نسبت ارتفاع معقول و کراپ هنرمندانه */
.slider-frame {
    position: relative;
    width: 100%;
    height: clamp(340px, 50vw, 620px);
}

.object-fit-cover {
    object-fit: cover;
    object-position: center;
}

/* لایه گرادینت برای خوانایی متن روی هر نوع بک‌گراند */
.gradient-overlay {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(0,0,0,0.15) 0%, rgba(0,0,0,0.55) 80%);
}

/* کپشن‌ها: فاصله و سایه متن برای کنتراست بهتر */
.carousel-caption {
    bottom: clamp(1rem, 6vw, 3rem);
    left: clamp(1rem, 6vw, 3rem);
    right: clamp(1rem, 6vw, 3rem);
    text-shadow: 0 2px 16px rgba(0,0,0,0.45);
}

/* دسترسی‌پذیری: وقتی کاربر کاهش انیمیشن رو ترجیح می‌دهد */
@media (prefers-reduced-motion: reduce) {
    .carousel *, .carousel {
        transition: none !important;
        animation: none !important;
    }
}

.banner-img {
    width: 100%; /* همیشه کل عرض container رو پر کن */
    height: auto; /* ارتفاع متناسب با خود عکس */
    display: block;
}


@media (min-width: 768px) {
    .banner-img {
        height: 300px;
    }
}

.btn-gold {
    color: #FFF3E0;
    background: #FFB74D;
    padding: 8px 16px;
    border-radius: 5px;
    transition: 0.4s;
}
.btn-gold:hover {
    color: #FFF3E0;
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;
}




/* فاصله از هدر */
.mt-header {
    margin-top: 150px;
}

/* باکس اصلی */
.notification-box {
    position: relative;
    display: flex;
    align-items: center;
    gap: .75rem;
    height: 46px;
    background: #e3f2f1;
    border-radius: .5rem;
    padding: 0 44px; /* فضای کافی برای دکمه‌های چپ/راست */
    overflow: hidden;
}

/* عنوان و آیکن */
.title-box {
    align-items: center;
    gap: .5rem;
    white-space: nowrap;
}

    .title-box .icon {
        width: 18px;
        height: 18px;
        border-radius: 50%;
        background: #0aa06e;
        display: inline-block;
        position: relative;
    }

        .title-box .icon::after {
            content: "";
            position: absolute;
            inset: 4px;
            border-radius: 50%;
            background: #fff;
        }

    .title-box .title {
        font-weight: 700;
        color: #0b6b4e;
    }

/* اسلایدر */
#notifSwiper {
    flex: 1;
    height: 100%;
    padding: 0;
}

    #notifSwiper .swiper-wrapper {
        align-items: center;
    }

    #notifSwiper .swiper-slide {
        width: auto !important; /* عرض هر خبر متناسب با متن */
    }


    #notifSwiper .notification {
        display: block;
        padding: 0 .75rem;
        line-height: 46px;
        color: #114;
        text-decoration: none;
        white-space: nowrap;
    }

        #notifSwiper .notification:hover {
            text-decoration: underline;
        }

/* سایه‌های طرفین */
.left-shadow, .right-shadow {
    position: absolute;
    top: 0;
    width: 48px;
    height: 100%;
    pointer-events: none;
}

.left-shadow {
    left: 0;
    background: linear-gradient(90deg, #e3f2f1 0%, rgba(227,242,241,0) 100%);
}

.right-shadow {
    right: 0;
    background: linear-gradient(270deg, #e3f2f1 0%, rgba(227,242,241,0) 100%);
}

/* دکمه‌ها (یکی راست، یکی چپ) */
.notif-prev, .notif-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: 6px;
    background: #d2e9e6;
    cursor: pointer;
    z-index: 3;
}

.notif-prev {
    right: .25rem;
}
/* سمت راست */
.notif-next {
    left: .25rem;
}
    /* سمت چپ */

    .notif-prev::before, .notif-next::before {
        content: "";
        display: block;
        width: 10px;
        height: 10px;
        margin: 0 auto;
        border-inline-start: 2px solid #0b6b4e;
        border-block-start: 2px solid #0b6b4e;
    }

.notif-prev::before {
    transform: rotate(225deg);
}
/* فلش چپ */
.notif-next::before {
    transform: rotate(45deg);
}
/* فلش راست */

.notif-prev:hover, .notif-next:hover {
    background: #c6dfdb;
}

/* ریسپانسیو */
@media (max-width:576px) {
    .notification-box {
        height: 44px;
        border-radius: .4rem;
    }

    #notifSwiper .notification {
        padding: 0 .5rem;
        line-height: 44px;
    }

    .left-shadow, .right-shadow {
        width: 32px;
    }
}








/* ====== VARIABLES ====== */
:root {
    --az-primary: #198754; /* رنگ سبزِ برند شما */
    --az-dark: #0f172a;
    --az-muted: #64748b;
    --az-card: #ffffff;
    --az-track: rgba(13,110,253,.15);
    --az-light: #f8fafc;
    /*FAQ*/
    --az-border: #e5e7eb;
    --az-surface: #ffffff;
    --az-bg: #f8fafc;
    --az-ring: rgba(25,135,84,.35);
    /* CTA specific */
    --az-cta-minh: 420px;
    --az-cta-radius: 24px;
    --az-cta-overlay-from: rgba(15,23,42,.78);
    --az-cta-overlay-to: rgba(25,135,84,.55);
    --az-cta-parallax-strength: 0.18; /* هرچه بیشتر، پارالاکس بیشتر */
}

/* ====== WRAPPER ====== */
.az-stepper {
  max-width: 1100px;
  margin: 2.5rem auto;
  padding: 0 16px;
  color: var(--az-dark);
  font-family: inherit;
}

.az-stepper-head {
  text-align: center;
  margin-bottom: 1.5rem;
}

.az-stepper-title {
  margin: 0 0 .5rem;
  font-weight: 800;
  font-size: clamp(1.25rem, 2.2vw, 1.75rem);
}

.az-stepper-sub {
  margin: 0;
  color: var(--az-muted);
  font-size: .95rem;
}

/* ====== STEPS (HORIZONTAL DESKTOP) ====== */
.az-steps {
  --gap: 20px;
  --pct: 0;              /* مقدار 0..1 توسط JS ست می‌شود */
  --circle: 52px;        /* قطر دایره */
  list-style: none;
  padding: 24px 0 12px;
  margin: 0 0 10px;
  position: relative;
  display: flex;
  gap: var(--gap);
}

/* خط زمینه: از مرکز دایره اول تا مرکز دایره آخر */
.az-steps::before {
  content: "";
  position: absolute;
  top: calc(var(--circle) / 2 + 10px);
  inset-inline: calc(var(--circle) / 2);
  height: 4px;
  background: var(--az-track);
  border-radius: 4px;
}

/* خط پیشرفت: هم‌طول با خط زمینه؛ رشد با scaleX برای حذف اور-شوت */
.az-steps::after {
  content: "";
  position: absolute;
  top: calc(var(--circle) / 2 + 10px);
  inset-inline: calc(var(--circle) / 2);
  height: 4px;
  background: var(--az-primary);
  border-radius: 4px;
  transform-origin: right center;   /* چون RTL داری، از راست رشد کنه */
  transform: scaleX(var(--pct));
  transition: transform .4s ease;
}

.az-step {
  flex: 1 1 0;
  min-width: 0;
  text-align: center;
  position: relative;
}

.az-step-circle {
  width: var(--circle);
  height: var(--circle);
  margin: 0 auto .6rem;
  border-radius: 50%;
  background: #fff;
  border: 3px solid var(--az-track);
  color: var(--az-muted);
  font-weight: 800;
  font-size: 1.1rem;
  box-shadow: 0 6px 18px rgba(13,110,253,.08);
  transition: all .25s ease;

  /* مرکز کردن عدد در همه‌ی سایزها */
  display: flex;
  align-items: center;
  justify-content: center;
}

.az-step-title {
  font-weight: 800;
  font-size: .98rem;
}

.az-step-desc {
  font-size: .9rem;
  color: var(--az-muted);
  margin-top: .25rem;
}

/* states */
/* هر مرحله‌ی کامل (شامل مرحله‌ی فعلی) سبزِ کامل باشد */
.az-step.is-complete .az-step-circle,
.az-step.is-current .az-step-circle {
  background: var(--az-primary);
  border-color: var(--az-primary);
  color: #fff;
}

/* مرحله فعلی کمی برجسته‌تر (بدون سفید کردن پس‌زمینه) */
.az-step.is-current .az-step-circle {
  transform: scale(1.05);
  box-shadow: 0 10px 26px rgba(25,135,84,.25);
}

.az-step.is-current .az-step-title,
.az-step.is-complete .az-step-title {
  color: var(--az-dark);
}

/* ====== MOBILE: VERTICAL TIMELINE ====== */
@media (max-width: 767.98px) {
  .az-steps {
    display: block;
    padding: 6px 0 0 0;
  }

  /* خطوط افقی در موبایل حذف می‌شوند */
  .az-steps::before,
  .az-steps::after {
    display: none;
  }

  .az-step {
    display: grid;
    grid-template-columns: 56px 1fr;
    align-items: start;
    gap: 10px;
    text-align: start;
    padding: 14px 0 14px 14px;
    border-inline-start: 3px dashed var(--az-track);
    position: relative;
  }

  .az-step:first-child { padding-top: 4px; }
  .az-step:last-child { border: none; }

  .az-step::before {
    content: "";
    position: absolute;
    top: 18px; inset-inline-start: -9px;
    width: 16px; height: 16px;
    background: #fff;
    border: 3px solid var(--az-track);
    border-radius: 50%;
  }

  .az-step.is-complete::before,
  .az-step.is-current::before {
    background: var(--az-primary);
    border-color: var(--az-primary);
  }

  /* دایره در موبایل هم دقیقاً وسط بماند */
  .az-step-circle {
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }
}

/* ====== ACTIONS (DEMO BUTTONS) ====== */
.az-stepper-actions {
  display: flex;
  gap: 10px;
  justify-content: center;
  margin-top: 14px;
}

.az-btn {
  border: 1px solid #cbd5e1;
  background: #fff;
  color: var(--az-dark);
  padding: .55rem 1rem;
  border-radius: 10px;
  font-weight: 700;
  cursor: pointer;
}

    .az-btn:hover {
        background: #f8fafc;
        color: var(--az-primary);
    }

.az-btn-primary {
  border-color: var(--az-primary);
  color: #fff;
  background: var(--az-primary);
}

.az-btn-primary:hover { filter: brightness(1.03); }









/* ریشه سکشن */
.az-cta-banner{
  position: relative;
  display: grid;
  place-items: center;
  isolation: isolate;
  min-height: var(--az-cta-minh);
  padding: clamp(2rem, 4vw, 3rem);
  border-radius: var(--az-cta-radius);
  overflow: hidden;
  color: #fff;
  margin: 2.5rem auto;
  max-width: min(1200px, 96%);
}

/* بک‌گراند تصویری */
.az-cta-banner::before{
  content:"";
  position:absolute; inset:0;
  background-image: var(--az-cta-bg, none);
  background-size: cover;
  background-position: center;
  transform: translate3d(0, calc(var(--az-parallax-y, 0) * 1px), 0);
  transition: transform .08s linear;
  z-index:-2;
}

/* گرادیان برای کنتراست متن */
.az-cta-banner::after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(135deg, var(--az-cta-overlay-from), var(--az-cta-overlay-to));
  z-index:-1;
}

/* محتوا */
.az-cta-content{
  text-align:center;
  width: min(900px, 95%);
  padding: max(1rem, env(safe-area-inset-top)) 0 max(1rem, env(safe-area-inset-bottom));
}

.az-cta-title{
  font-weight: 900;
  line-height: 1.2;
  font-size: clamp(1.4rem, 3vw, 2rem);
  letter-spacing: -.2px;
  margin: 0 0 .75rem;
}

.az-cta-subtitle{
  margin: 0 auto 1.25rem;
  color: #e9eef5;
  font-size: clamp(.95rem, 1.8vw, 1.125rem);
  max-width: 48ch;
}

/* دکمه‌ها */
.az-cta-actions{
  display:flex; gap:.75rem; justify-content:center; flex-wrap:wrap;
  margin-top: .25rem;
}

.az-cta-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding: .82rem 1.35rem;
  border-radius: 999px;
  font-weight: 800;
  text-decoration:none;
  border: 2px solid transparent;
  transition: transform .12s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
  will-change: transform;
}
.az-cta-btn:focus-visible{ outline: 3px solid rgba(255,255,255,.55); outline-offset: 2px; }

.az-cta-btn-primary{
  background:#fff; color: var(--az-dark);
  border-color: #fff;
  box-shadow: 0 12px 30px rgba(255,255,255,.15);
}
.az-cta-btn-primary:hover{
  transform: translateY(-1px);
  box-shadow: 0 16px 40px rgba(255,255,255,.22);
}

.az-cta-btn-outline{
  background: transparent; color: #fff;
  border-color: rgba(255,255,255,.7);
}
.az-cta-btn-outline:hover{
  background: rgba(255,255,255,.1);
  transform: translateY(-1px);
}

/* نشان‌ها (اختیاری) */
.az-cta-badges{
  display:flex; gap:.5rem; justify-content:center; flex-wrap:wrap;
  margin-top: 1rem;
}
.az-cta-badge{
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.25);
  color: #fff;
  font-weight: 700;
  padding: .35rem .7rem;
  border-radius: 999px;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  font-size: .9rem;
}

/* ریسپانسیو */
@media (max-width: 575.98px){
  .az-cta-banner{ --az-cta-minh: 380px; }
  .az-cta-subtitle{ font-size: .95rem; }
}





.az-faq-section{
  max-width: 980px;
  margin: 2.5rem auto;
  padding: 0 16px;
  color: var(--az-dark);
}

.az-faq-head{
  text-align: center;
  margin-bottom: 1.25rem;
}
.az-faq-title{
  margin: 0 0 .35rem;
  font-weight: 900;
  font-size: clamp(1.25rem, 2.4vw, 1.75rem);
}
.az-faq-sub{
  margin: 0;
  color: var(--az-muted);
  font-size: .98rem;
}

/* ظرف آکاردئون */
.az-faq{
  display:flex;
  flex-direction:column;
  gap:.75rem;
}

/* کارت آیتم */
.az-faq-item{
  background: var(--az-surface);
  border: 1px solid var(--az-border);
  border-radius: 16px;
  overflow: clip;
  box-shadow: 0 10px 30px rgba(2,8,23,.05);
}

/* سرآیتم */
.az-faq-header{
  margin: 0;
}
.az-faq-button{
  width: 100%;
  text-align: start;
  display:flex;
  align-items:center;
  gap:.75rem;
  padding: 1rem 1.1rem;
  background: transparent;
  border:none;
  font-weight: 800;
  font-size: 1rem;
  line-height:1.4;
  color: var(--az-dark);
  cursor: pointer;
  position: relative;
}
.az-faq-button:focus-visible{
  outline: 3px solid var(--az-ring);
  outline-offset: 2px;
  border-radius: 10px;
}

/* آیکون + / − */
.az-faq-button::after{
  content:"+";
  margin-inline-start:auto;
  font-size: 1.35rem;
  line-height: 1;
  color: var(--az-primary);
  transition: transform .2s ease, opacity .2s ease;
}
.az-faq-button[aria-expanded="true"]::after{
  content:"−";
}

/* مرزبندی زیر هدر وقتی باز است */
.az-faq-button[aria-expanded="true"]{
  border-bottom: 1px dashed var(--az-border);
}

/* پنل محتوا */
.az-faq-panel{
  overflow: hidden;
  height: 0;              /* با JS انیمیت می‌شود */
  transition: height .28s ease;
  background: linear-gradient(180deg, #fff 0%, #fff 65%, rgba(25,135,84,.03) 100%);
}
.az-faq-body{
  padding: 1rem 1.1rem 1.15rem;
  color: var(--az-muted);
  font-size: .98rem;
}
.az-faq-body p{ margin: .5rem 0; }

/* حالت باز (برای کاربرانی که CSS-only می‌بینند) */
.az-faq-panel[hidden]{ display: block; height: 0; }

/* Hover states */
.az-faq-item:hover{
  border-color: rgba(25,135,84,.25);
  box-shadow: 0 14px 38px rgba(25,135,84,.10);
}

/* ریسپانسیو ریز */
@media (max-width: 575.98px){
  .az-faq-title{ font-size: 1.3rem; }
  .az-faq-button{ padding: .9rem .95rem; }
  .az-faq-body{ padding: .85rem .95rem 1rem; }
}














/* ===== Counters GRID (Dark Glass, Compact) ===== */
.az-counters-grid {
    /* متغیرهای محلی: */
    --cnt-bg: #0b1220;
    --cnt-border: rgba(255,255,255,.12);
    --cnt-glass-a: rgba(255,255,255,.06);
    --cnt-glass-b: rgba(255,255,255,.02);
    --cnt-text: #ffffff;
    --cnt-text-sub: #cdd6e3;
    --cnt-text-muted: #c9d7e1;
    --cnt-radius: 20px;
    --cnt-section-py: 14px;
    --cnt-card-radius: 18px;
    --cnt-card-p: .95rem;
    --cnt-card-minh: 160px;
    position: relative;
    max-width: 1200px;
    margin: 1.6rem auto;
    padding: var(--cnt-section-py) 14px;
    color: var(--cnt-text);
    border-radius: var(--cnt-radius);
    background-color: var(--cnt-bg);
    background-image: radial-gradient(800px 380px at 100% 0%, rgba(25,135,84,.16), transparent 60%), radial-gradient(520px 300px at 0% 100%, rgba(25,135,84,.10), transparent 60%);
    overflow: hidden;
}

    .az-counters-grid.compact {
        --cnt-section-py: 20px;
        --cnt-card-p: .8rem;
        --cnt-card-minh: 145px;
    }

/* هد */
.az-counters-head {
    text-align: center;
    margin-bottom: .7rem;
}

.az-counters-title {
    margin: 0 0 .25rem;
    font-weight: 900;
    font-size: clamp(1.05rem, 2vw, 1.45rem);
    color: #e9eef5;
}

.az-counters-sub {
    margin: 0;
    color: var(--cnt-text-sub);
    font-size: .9rem;
}

/* گرید کارت‌ها */
.az-counters-list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}

@media (max-width: 991.98px) {
    .az-counters-list {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 767.98px) {
    .az-counters-list {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 479.98px) {
    .az-counters-list {
        grid-template-columns: 1fr;
    }
}

/* کارت */
.az-counter-card {
    min-height: var(--cnt-card-minh);
    background: linear-gradient(180deg, var(--cnt-glass-a), var(--cnt-glass-b));
    border: 1px solid var(--cnt-border);
    border-radius: var(--cnt-card-radius);
    padding: var(--cnt-card-p) .8rem;
    display: grid;
    grid-template-rows: auto auto auto 1fr;
    row-gap: .25rem;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    box-shadow: 0 12px 28px rgba(2,8,23,.18);
    transition: transform .18s ease, box-shadow .22s ease, border-color .18s ease;
}

    .az-counter-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 18px 36px rgba(2,8,23,.26);
        border-color: rgba(25,135,84,.3);
    }

/* آیکون */
.az-counter-icon {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    color: #d8ffe8;
    background: radial-gradient(120% 120% at 100% 0%, rgba(25,135,84,.5), rgba(25,135,84,.22)), linear-gradient(180deg, rgba(255,255,255,.2), rgba(255,255,255,.05));
    border: 1px solid rgba(255,255,255,.2);
    box-shadow: inset 0 0 24px rgba(25,135,84,.2), 0 6px 16px rgba(25,135,84,.22);
    margin-bottom: .2rem;
}

/* عدد، لیبل، توضیح */
.az-counter {
    font-weight: 900;
    font-size: clamp(1.4rem, 3.1vw, 1.9rem);
    line-height: 1.1;
    color: #fff;
}

.az-counter-label {
    font-weight: 800;
    color: #e7f4ec;
    margin-top: .05rem;
    font-size: .95rem;
}

.az-counter-desc {
    color: var(--cnt-text-muted);
    font-size: .88rem;
    margin: .05rem 0 0;
}







/* سکشن نوین | طراحی مدرن و تمیز */
  .novin-grid { --rz: 10px; }
  .novin-card {
    position: relative;
    background: var(--bs-body-bg);
    border: 1px solid rgba(0,0,0,.06);
    border-radius: 1rem;
    padding: 1rem .9rem;
    display: flex; flex-direction: column; gap: .6rem;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    outline: none;
  }
  .novin-card:focus-visible { box-shadow: 0 0 0 .25rem rgba(13,110,253,.15); }
  .novin-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(0,0,0,.08);
    border-color: #198754;
  }
  .novin-thumb {
    width: 56px; height: 56px;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(13,110,253,.08), rgba(111,66,193,.08));
    display: grid; place-items: center;
    margin-bottom: .25rem;
    font-size: 30px;
  }
  .novin-thumb img { width: 32px; height: 32px; object-fit: contain; filter: drop-shadow(0 1px 1px rgba(0,0,0,.05)); }
  .novin-title {
    font-size: 1rem; font-weight: 700; margin: 0;
    line-height: 1.5; letter-spacing: -.2px;
  }
  .novin-kicker {
    margin: 0; color: var(--bs-secondary-color);
    font-size: .9rem; line-height: 1.6;
    /* متن کوتاه ۵ کلمه‌ای: در یک خط نگه‌داشته می‌شود */
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  .novin-action {
    margin-top: auto; display: flex; align-items: center; gap: .35rem;
    color: var(--bs-primary); font-weight: 600; font-size: .9rem;
  }
  .novin-action a { text-decoration: none; color: inherit; }
  .novin-card:hover .novin-action svg { transform: translateX(-2px); }
  .novin-action svg { transition: transform .25s ease; }

  /* حالت کنتراست/دارک (خودکار با متغیرهای Bootstrap) */
  @media (prefers-reduced-motion: reduce) {
    .novin-card, .novin-action svg { transition: none; }
  }





@media (max-width: 992px) {
    .azr-shell {
        grid-template-columns: 1fr
    }

    .azr-aside {
        position: relative;
        top: auto
    }
}

@media (max-width:1200px) {
    .azr-card {
        grid-column: span 6
    }
}

@media (max-width:640px) {
    .azr-card {
        grid-column: span 12
    }
}


:root {
    --azr-bg: #f5f7fb;
    --azr-sheet: #ffffff;
    --azr-ink: #0f172a;
    --azr-muted: #64748b;
    --azr-line: #e6eaf2;
    --azr-primary: #2563eb;
    --azr-primary-2: #3b82f6;
    --azr-accent: #14b8a6;
    --azr-warning: #f59e0b;
    --azr-radius: 16px;
    --azr-shadow: 0 10px 28px rgba(15,23,42,.08);
    --azr-shadow-lg: 0 18px 50px rgba(15,23,42,.12);
}

.azr-page {
    background: var(--azr-bg);
    padding: 28px 0 48px
}

.azr-container {
    max-width: 1250px;
    margin: 0 auto;
    padding: 0 16px
}

/* Header */
.azr-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 18px
}

.azr-title {
    display: flex;
    align-items: center;
    gap: .6rem
}

    .azr-title h2 {
        margin: 0;
        color: var(--azr-ink);
        font-weight: 900;
        letter-spacing: -.2px
    }

.azr-badge {
    display: inline-block;
    padding: .2rem .6rem;
    border-radius: 999px;
    border: 1px solid var(--azr-line);
    color: var(--azr-muted);
    font-size: .8rem;
    background: #fff
}

.azr-sub {
    color: var(--azr-muted);
    margin: 6px 0 0 0
}

/* Layout */
.azr-shell {
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 16px;
    align-items: start
}


/* Aside */
.azr-aside {
    position: sticky;
    top: 18px;
    background: var(--azr-sheet);
    border: 1px solid var(--azr-line);
    border-radius: var(--azr-radius);
    box-shadow: var(--azr-shadow);
    padding: 16px
}

    .azr-aside h4 {
        margin: 0 0 10px 0;
        font-weight: 800;
        color: var(--azr-ink);
        font-size: 1.02rem
    }

    .azr-aside p {
        margin: 0;
        color: var(--azr-muted);
        font-size: .92rem
    }

.azr-sep {
    height: 1px;
    background: linear-gradient(90deg,transparent,#eef2f7,transparent);
    margin: 12px 0;
    border: 0
}

.azr-pill {
    display: inline-block;
    margin: 6px 4px 0 0;
    padding: .25rem .6rem;
    border-radius: 999px;
    border: 1px solid var(--azr-line);
    font-size: .8rem;
    color: var(--azr-muted);
    background: #fafcff
}

.azr-hint {
    border: 1px dashed #d9e2f2;
    border-radius: 12px;
    padding: 12px;
    margin-top: 12px;
    background: linear-gradient(180deg,#f7fbff,#fff);
}

    .azr-hint b {
        color: #0b3fa8
    }

/* Toolbar */
.azr-toolbar {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin: 8px 0 22px
}

.azr-search {
    flex: 1 1 280px;
    display: flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1px solid var(--azr-line);
    border-radius: 12px;
    padding: 10px 12px;
    box-shadow: var(--azr-shadow)
}

    .azr-search i {
        color: #8aa0bf
    }

    .azr-search input {
        border: 0;
        outline: none;
        width: 100%;
        background: transparent;
        color: var(--azr-ink)
    }

.azr-sort {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1px solid var(--azr-line);
    border-radius: 12px;
    padding: 10px 12px;
    box-shadow: var(--azr-shadow);
    color: var(--azr-muted)
}

    .azr-sort select {
        border: 0;
        background: transparent;
        color: var(--azr-ink);
        outline: none
    }

/* Grid */
.azr-grid {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(12,1fr)
}

.azr-card {
    grid-column: span 4
}

/* Card */
.azr-tile {
    height: 100%;
    display: block;
    text-decoration: none;
    color: inherit;
    background: var(--azr-sheet);
    border: 1px solid var(--azr-line);
    border-radius: var(--azr-radius);
    box-shadow: var(--azr-shadow);
    padding: 16px;
    transition: .2s ease;
    position: relative;
    overflow: hidden
}

    .azr-tile:hover {
        transform: translateY(-4px);
        box-shadow: var(--azr-shadow-lg)
    }

.azr-ico {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    margin-bottom: 10px;
    background: linear-gradient(145deg,#eef2ff,#e0f2fe);
    border: 1px solid #e6eefc;
    font-size: 20px;
    color: #1e293b
}

.azr-kicker {
    color: var(--azr-muted);
    font-size: .9rem;
    margin-bottom: .35rem
}

.azr-title-3 {
    margin: 0;
    color: var(--azr-ink);
    font-weight: 900;
    line-height: 1.6;
    font-size: clamp(1.02rem,1.1vw,1.15rem);
    word-break: break-word
}

.azr-subtxt {
    margin: 2px 0 0;
    color: var(--azr-muted);
    font-size: .92rem
}

.azr-hr {
    height: 1px;
    background: linear-gradient(90deg,transparent,#edf1f7,transparent);
    border: 0;
    margin: 12px 0
}

.azr-cta {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    color: var(--azr-primary);
    font-weight: 800;
    border-bottom: 1px dashed #c7d7fe
}

.azr-tile:hover .azr-cta {
    color: var(--azr-primary-2)
}

/* Featured ribbon (optional) */
.azr-ribbon {
    position: absolute;
    top: 12px;
    left: 12px;
    background: linear-gradient(90deg,#22c55e,#06b6d4);
    color: #0b1220;
    padding: .22rem .55rem;
    border-radius: 999px;
    font-weight: 900;
    font-size: .7rem
}

@media (min-width:580px) {
    .width-index-video {
        width: 60% !important;
    }
}


.video-media {
    width: 300px;
    height: 200px;
}

@media (min-width: 450px) {
    .video-media {
        width: 400px;
        height: 300px;
    }
}