/* * {
    margin: 0;
    padding: 0;
}


body {
    font-family: IRANSans;
} */
a{
    text-decoration: none;
}

.site-logo {
    width: 150px;
    height: 150px;
    background-size: contain;
    margin: 30px auto 0;
    background-repeat: no-repeat;
    background-position: center center;
}

.header-container h2{
    color: #ddb66d;
}

.header-container h3 {
    color: #003226;
}

.header-container h1 {
    background: #f2e8bf;
    background: linear-gradient(90deg, rgb(255, 255, 255) 0%, rgba(230, 201, 133, 1) 50%, rgb(238, 214, 158) 100%);
    background-color: #12181A;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}



/************************************************************************/


/* ═══════════════════════════════════════════════════════
   متغیرهای رنگ و فونت (CSS Custom Properties)
═══════════════════════════════════════════════════════ */
:root {
    --gold:        #c9a84c;   /* طلایی اصلی */
    --gold-light:  #e2c47a;   /* طلایی روشن — برای هاور */
    --dark-bg:     #1a1612;   /* پس‌زمینه کل صفحه */
    --card-bg:     #003226;   /* پس‌زمینه کارت‌ها */
    --card-border: #003226;   /* حاشیه کارت‌ها */
    --text-main:   #c89754;   /* متن اصلی روشن */
    --text-muted:  #003226c7;   /* متن ثانویه خاکستری */
}


/* ═══════════════════════════════════════════════════════
   استایل پایه (Base)
═══════════════════════════════════════════════════════ */
*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    font-family: 'IRANSans', sans-serif;
    font-weight: 300;
    /*background-color: #1c1710; !* fallback *!*/
    /*background-image: radial-gradient(*/
        /*ellipse at 50% 0%,*/
        /*#28211a 0%,*/
        /*#1c1710 40%,*/
        /*#141009 100%*/
    /*);*/
    background-attachment: fixed;
    color: var(--text-main);
    min-height: 100vh;
    overflow-x: hidden;
}


/* ═══════════════════════════════════════════════════════
   هدر / Hero Section
═══════════════════════════════════════════════════════ */
.hero {
    text-align: center;
    padding: 0.1rem 1rem 1.5rem;
}

/* آیکون تزئینی بالای عنوان */
.hero-icon {
    width: 60px;
    height: 60px;
    margin: 0 auto 0.5rem;
    opacity: 0.85;
}

/* برچسب کوچک «خدمات ویژه» با خط تزئینی دو طرف */
.hero-eyebrow {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    color: var(--gold);
    font-size: 0.85rem;
    letter-spacing: 0.05em;
    margin-bottom: 0.75rem;
}

.hero-eyebrow::before,
.hero-eyebrow::after {
    content: '';
    display: inline-block;
    width: 32px;
    height: 1px;
    background: var(--gold);
    opacity: 0.6;
}

/* عنوان اصلی — clamp برای ریسپانسیو بودن خودکار */
.hero h1 {
    font-size: 3.9rem;
    font-weight: 400;
    margin-bottom: 1rem;
    line-height: 1.3;
    background: linear-gradient(180deg, #fff6d2 0%, /* طلایی روشن — بالای حروف */ #b9a56f 45%, /* طلایی اصلی — میانه */ #e4b068 75%, /* طلایی تیره — پایین */ #7a5c1e 100% /* برنز تیره — ته حروف */);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.hero h2 {
    color: #be9e5d;
    font-size: 1rem;
}

.hero h2 span {
    margin: 0 15px;
}

.hero h3 {
    color: #a17942;
    font-size: 0.85rem;
}

/* پاراگراف‌های زیرعنوان */
.hero p {
    font-size: 0.95rem;
    color: var(--text-muted);
    max-width: 480px;
    margin: 0 auto 0.4rem;
    line-height: 1.8;
}


.header-button-outlined {
    /* background-color: #a55c1b;
    background-image: linear-gradient(180deg, #4e2b0c 0%, #291b0b 100%); */
}

.header-button-outlined:hover {
    background: linear-gradient(
        90deg,
        #dfae6e 0%,   /* طلایی روشن بالا */
        #c89754 50%,   /* طلایی روشن بالا */
        #c89754 100%  /* طلایی تیره پایین */
    );
    box-shadow: 0 2px 12px rgba(88, 69, 26, 0.25);
    border: 1px solid #003226;
}


.header-button {
    border: 1px solid #c89754;
    padding: 15px 30px;
    color: #c89754;
    border-radius: 20px;
}


.header-button-filled {
    background: linear-gradient(
        90deg,
        #dfae6e 0%,   /* طلایی روشن بالا */
        #c89754 50%,   /* طلایی روشن بالا */
        #c89754 100%  /* طلایی تیره پایین */
    );
    box-shadow: 0 2px 12px rgba(88, 69, 26, 0.25);
    border: 1px solid #eed9ad;
    color: beige;
}

.header-button-filled:hover {
    box-shadow: 0 2px 12px rgba(54, 43, 15, 0.788);
    border: 1px solid #eed9ad;
    color:#003226;
}

.header-button:hover span {
    color: #2c2113;
}

.header-button span {
    margin-right: 15px;
    color: #003226;
}


.header-button-filled span {
    color: #003226;
    margin-right: 15px;
}

/* ═══════════════════════════════════════════════════════
   دکمه‌ها (Buttons)
═══════════════════════════════════════════════════════ */

/* دکمه پُر طلایی */
.btn-gold {
    background-color: var(--gold);
    color: #1a1612;
    border: none;
    font-weight: 700;
    padding: 0.6rem 1.6rem;
    border-radius: 6px;
    font-family: 'IRANSans', sans-serif;
    cursor: pointer;
    transition: background-color 0.25s;
}

.btn-gold:hover {
    background-color: var(--gold-light);
    color: #1a1612;
}

/* دکمه خطی (outline) طلایی */
.btn-outline-gold {
    background: transparent;
    color: var(--gold);
    border: 1.5px solid var(--gold);
    font-weight: 600;
    padding: 0.6rem 1.6rem;
    border-radius: 6px;
    font-family: 'Vazirmatn', sans-serif;
    cursor: pointer;
    transition: background-color 0.25s, color 0.25s;
}

.btn-outline-gold:hover {
    background-color: var(--gold);
    color: #1a1612;
}

/* دکمه فلش دایره‌ای داخل کارت */
.btn-card-arrow {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1.5px solid var(--card-border);
    background: transparent;
    color: var(--text-muted);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: border-color 0.2s, color 0.2s, background-color 0.2s;
    font-size: 1rem;
}


/* ═══════════════════════════════════════════════════════
   بخش کارت‌ها (Cards Section)
═══════════════════════════════════════════════════════ */
.cards-section {
    padding: 1rem 1.5rem 1rem;
    max-width: 1200px;
    margin: 0 auto;
}
/* ═══════════════════════════════════════════════════════
اسلایدر صفحه اصلی
═══════════════════════════════════════════════════════ */
.row_slider_banner{
    margin: 1rem 0;
}
.row_slider_banner img{
    border-radius: 25px;
    object-fit: cover;
    height: 500px;
}
.container_about{
    margin: 4rem 0 3rem 0;
}
.container_about .card-title{
    text-align: center;
    line-height: 2.5rem;
}
.container_about .card-about{
    background: transparent;
    text-align: justify;
    color:#003226;
    margin-top: 2rem;
}
.container_about .card-about p{
    line-height: 2rem;
    font-size: 18px;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
گالری تصاویر
═══════════════════════════════════════════════════════ */
.main-gallery{
    margin-bottom: 5rem;
}
.gallery-box {
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    overflow: hidden;
    cursor: pointer;
    border-radius: 12px;
}

.gallery-box img {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    transition: transform 0.3s ease;
    border-radius: 12px;
}

.gallery-box:hover img {
    transform: scale(1.05);
}
.col-gallery{
    padding: 5px;
}

/* مودال گالری */
.gallery-modal {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 60px 20px 30px;
    background: rgba(0, 0, 0, 0.92);
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease, visibility 0.25s ease;
}

.gallery-modal.is-open {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
}

.gallery-modal-slider {
    width: min(1100px, 100%);
}

.gallery-modal-cell {
    width: 100%;
    height: calc(100vh - 120px);
    display: flex;
    align-items: center;
    justify-content: center;
}

.gallery-modal-cell img {
    display: block;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.gallery-modal-close {
    position: absolute;
    top: 15px;
    right: 20px;
    z-index: 10;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
    font-size: 34px;
    line-height: 40px;
    cursor: pointer;
}

body.gallery-is-open {
    overflow: hidden;
}

/* رنگ دکمه‌های Flickity داخل مودال */
.gallery-modal .flickity-button {
    background: rgba(255, 255, 255, 0.85);
}

.gallery-modal .flickity-page-dots {
    bottom: -25px;
}

.gallery-modal .flickity-page-dots .dot {
    background: #fff;
}
/* end gallery style*/

    /* ═══════════════════════════════════════════════════════
       کارت خدمت (Service Card)
    ═══════════════════════════════════════════════════════ */
.service-card-link {
    text-decoration: none;
}

.service-card {
    background-color: var(--card-bg);
    border: 1px solid var(--card-border);
    border-radius: 14px;
    overflow: hidden;
    cursor: pointer;
    border: 1px solid #003226;
    transition: transform 0.25s, border-color 0.25s;
    background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.65) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.65)), color-stop(100%,rgba(0,0,0,0))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(0,0,0,0.5) 0%,rgba(0, 0, 0, 0) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* IE10+ */
    background: linear-gradient(to right, rgba(0, 0, 0, 0.5) 0%,rgba(0, 0, 0, 0) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 ); /*IE6-9*/
    height: 280px;
    border: 1px solid transparent;
    background-clip: padding-box;
    background-image: linear-gradient(
        180deg,
        #2e2618 0%,
        #1e1a10 100%
    );
    border: 1px solid #2a2216;
    box-shadow:
        0 0 0 1px #8f8773,
        inset 0 1px 0 rgba(95, 88, 68, 0.08); /* شیمر طلایی خیلی کم‌رنگ روی لبه بالا */

}

.service-card:hover {
    border-color: #cfcabb;
    box-shadow:
        0 0 0 1px rgba(201, 168, 76, 0.2),
        0 8px 32px rgba(0, 0, 0, 0.5),
        inset 0 1px 0 rgba(201, 168, 76, 0.15);
}

.service-card .card-body {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    text-align: left;
    height: 100%;
    display: flex;
    flex-direction: row-reverse;
}

.card-row {
    /* height: 300px; */
}

.service-card:hover {
    transform: translateY(-4px);
    /* border-color: var(--gold); */
}

.service-card:hover .btn-card-arrow {
    border-color: var(--gold);
    color: var(--gold);
    background-color: rgba(201, 168, 76, 0.1);
}

/* تصویر بالای کارت */
.service-card .card-img {
    width: 100%;
    object-fit: cover;
    display: block;
    /* ارتفاع پیش‌فرض — در کلاس‌های تخصصی override می‌شود */
    height: 100%;
}

/* ارتفاع تصویر کارت‌های کناری ردیف اول (کوچک) */
.card-img--sm {
    height: 140px;
}

/* ارتفاع تصویر کارت featured وسط ردیف اول (بزرگ) */
.card-img--featured {
    height: 260px;
}

/* بدنه کارت */
.service-card .card-body {
    padding: 1rem 1.1rem 1.1rem;
}

.card-content {
    align-self: flex-end;
    margin-left: 0;
}


/* شماره کارت */
.card-number {
    font-size: 1.1rem;
    color: var(--text-muted);
    font-weight: 600;
    margin-bottom: 0.15rem;
    display: block;
}

/* عنوان کارت */
.card-title-fa {
    font-size: 1.1rem;
    font-weight: 700;
    color: #f0e6d3;
    margin-bottom: 0.25rem;
}

/* توضیح کوتاه کارت */
.card-desc {
    font-size: 0.82rem;
    color: #f0e8d9a9;
    margin-bottom: 0.85rem;
    line-height: 1.6;
}


/* ═══════════════════════════════════════════════════════
   فوتر CTA
═══════════════════════════════════════════════════════ */
.cta-footer {
    border-radius: 15px;
    padding: 1.5rem 2rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    flex-direction: row-reverse;
    flex: 2 1 auto;
    border: 1px solid #003226;
    padding: 1rem 1.5rem;
    max-width: 1050px;
    margin: 0 auto ;
}

.cta-footer button {
    border: 1px solid #003226;
    color: #fff5ec;
    font-size: 14px;
    padding: 10px 25px;
    margin-left: 30px;
    background: linear-gradient(        90deg,        #dfae6e 0%,   /* طلایی روشن بالا */        #c89754 50%,   /* طلایی روشن بالا */        #c89754 100%  /* طلایی تیره پایین */    );
}


.cta-footer button svg {
    margin: 0 10px 0 0;
}

/* آیکون دایره‌ای در فوتر */
.cta-icon {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 1.5px solid #f2e8bf;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    flex-shrink: 0;
    background: #f3c406;
    background: linear-gradient(0deg, #50370e 0%, #856629 50%, #ffe390 100%)!important;
    color: honeydew;
    /* border طلایی دو لایه:
       لایه اول: خط نازک طلایی اصلی
       لایه دوم: glow بیرونی */
    border: 1.5px solid #c9a84c;
    box-shadow:
        0 0 0 4px rgba(201, 168, 76, 0.08),  /* هاله بیرونی */
        0 0 12px rgba(201, 168, 76, 0.15),   /* glow محیطی */
        inset 0 1px 0 rgba(201, 168, 76, 0.1); /* شیمر داخلی بالا */

    /* چیدمان آیکون وسط */
    display: flex;
    align-items: center;
    justify-content: center;

    /* انیمیشن هاور */
    transition: box-shadow 0.3s, background-color 0.3s;
    cursor: pointer;
}

.cta-icon:hover {
    background-color: rgba(201, 168, 76, 0.12);
    box-shadow:
        0 0 0 6px rgba(201, 168, 76, 0.12),
        0 0 20px rgba(201, 168, 76, 0.25),
        inset 0 1px 0 rgba(201, 168, 76, 0.15);
}

.cta-text h5 {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--text-main);
    margin-bottom: 0.2rem;
    text-align: right;
}

.cta-text p {
    font-size: 0.82rem;
    color: var(--text-muted);
    margin: 0;
    line-height: 1.6;
    text-align: right;
    font-weight: 400;
}

.fartak , .copy_right {
    font-size: 13px;
    color: #c89754;
    font-weight: 400;
}

.fartak a{
    text-decoration: none;
    font-size: 13px;
    color: #c89754;
}


/* ═══════════════════════════════════════════════════════
   ریسپانسیو — تبلت (md: ≥768px و <992px)

   گرید در تبلت:
   ردیف ۱: کارت ۱ و ۳ هر کدام col-6، کارت ۲ col-12 (بالا)
   ردیف ۲ و ۳: هر کارت col-6 (دو تایی)
   ردیف ۴: هر کارت col-6
═══════════════════════════════════════════════════════ */
@media (max-width: 991.98px) {
    .row_slider_banner img{
        height: 400px;
    }

    /* کارت featured در تبلت ارتفاع معمولی */
    .card-img--featured {
        height: 200px;
    }

    /* کارت‌های کوچک ردیف اول در تبلت هم عادی */
    .card-img--sm {
        height: 160px;
    }

    /* فوتر در تبلت: متن وسط */
    .cta-footer {
        justify-content: center;
        align-items: center;
        text-align: center;
        width: 100%;
        border-radius: 0;
        border: 0;
    }

    .cta-footer button {
        margin-left: 0;
    }

    .cta-footer h5 {
        text-align: center;
    }
}


/* ═══════════════════════════════════════════════════════
   ریسپانسیو — موبایل (sm: <768px)

   گرید در موبایل:
   همه کارت‌ها col-12 (تک ستونه)
   ارتفاع تصویر یکسان و معمولی
═══════════════════════════════════════════════════════ */
@media (max-width: 767.98px) {

    /* هدر فشرده‌تر */
    .hero {
        padding:0 1rem 1.5rem;
    }

    /* دکمه‌های هدر در موبایل زیر هم */
    .hero-buttons {
        flex-direction: column;
        align-items: center;
    }

    /* ارتفاع یکسان برای همه تصاویر در موبایل */
    .service-card .card-img,
    .card-img--sm,
    .card-img--featured {
        height: 180px;
    }

    /* فوتر در موبایل: ستونی */
    .cta-footer {
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: 1.2rem 1rem;
        width: 100%;
        text-align: center;
    }

    .cta-footer h5 {
        text-align: center;
    }

    .cta-footer {
        margin-left: 0;
    }

    /* آیکون فوتر آخر بیاید */
    .cta-icon {
        order: 3;
    }

    .cta-text {
        order: 1;
    }

    .cta-footer .btn-outline-gold {
        order: 2;
    }
    .row_slider_banner img{
        height: 350px;
    }
}


/* ═══════════════════════════════════════════════════════
   ریسپانسیو — موبایل خیلی کوچک (xs: <480px)
═══════════════════════════════════════════════════════ */
@media (max-width: 479.98px) {
    .row_slider_banner img{
        height: 300px;
    }
    .hero h1 {
        font-size: 2.5rem;
        margin-top: 10px;
    }

    .hero p {
        font-size: 0.85rem;
    }

    .card-title-fa {
        font-size: 1rem;
    }

    .cards-section {
        padding: 0.75rem 0.75rem 2rem;
    }
}


/**********************************************SINGLE*********************************************************/