/* ==========================================================
   KIAN DEZH - CLEAN CTA CARDS
   نسخه نهایی اصلاح کارت‌های CTA داخلی

   صفحات درگیر:
   hotel / bazaar / restaurant / hall / sport-area
   fa + en

   هدف:
   - ارتفاع آزاد بر اساس متن
   - بک‌گراند سفید
   - حذف نیم‌دایره و تزئین اضافه
   - کادر Fade و حرفه‌ای
   - آیتم‌های داخلی بدون بک‌گراند سنگین
   ========================================================== */

:root {
    --kd-clean-cta-section-space-top: clamp(48px, 5vw, 78px);
    --kd-clean-cta-section-space-bottom: clamp(54px, 5.4vw, 86px);

    --kd-clean-cta-box-padding-y: clamp(30px, 3.4vw, 48px);
    --kd-clean-cta-box-padding-x: clamp(28px, 4vw, 56px);
    --kd-clean-cta-radius: 34px;

    --kd-clean-cta-border: rgba(0, 0, 0, .055);
    --kd-clean-cta-border-hover: rgba(162, 118, 49, .13);

    --kd-clean-cta-shadow:
        0 18px 54px rgba(0, 0, 0, .035),
        inset 0 1px 0 rgba(255, 255, 255, .86);

    --kd-clean-cta-title-size: clamp(24px, 2vw, 34px);
    --kd-clean-cta-text-size: clamp(14.5px, .98vw, 16.5px);

    --kd-clean-item-radius: 18px;
    --kd-clean-item-border: rgba(0, 0, 0, .06);
    --kd-clean-item-border-hover: rgba(162, 118, 49, .16);
}

/* ==========================================================
   SECTION RESET
   بک‌گراند کل سکشن سفید و بدون عکس/گرادیان/تزئین
   ========================================================== */

html body main .hotel-cta-section,
html body main .bazaar-cta-section,
html body main .restaurant-cta-section,
html body main .residence-cta-section,
html body main .golf-cta-section {
    position: relative !important;
    margin: 0 !important;
    padding-top: var(--kd-clean-cta-section-space-top) !important;
    padding-bottom: var(--kd-clean-cta-section-space-bottom) !important;
    background: #ffffff !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
}

/* حذف هر تزئین احتمالی از خود سکشن */
html body main .hotel-cta-section::before,
html body main .hotel-cta-section::after,
html body main .bazaar-cta-section::before,
html body main .bazaar-cta-section::after,
html body main .restaurant-cta-section::before,
html body main .restaurant-cta-section::after,
html body main .residence-cta-section::before,
html body main .residence-cta-section::after,
html body main .golf-cta-section::before,
html body main .golf-cta-section::after {
    content: none !important;
    display: none !important;
}

/* ظرف داخلی */
html body main .hotel-cta-section>.container,
html body main .bazaar-cta-section>.container,
html body main .restaurant-cta-section>.container,
html body main .residence-cta-section>.container,
html body main .golf-cta-section>.container {
    width: 90% !important;
    max-width: none !important;
    margin-right: auto !important;
    margin-left: auto !important;
}

/* ==========================================================
   CTA BOX
   ارتفاع آزاد، سفید، Fade و حرفه‌ای
   ========================================================== */

html body main .hotel-cta-box,
html body main .bazaar-cta-box,
html body main .restaurant-cta-box,
html body main .residence-cta-box,
html body main .golf-cta-box {
    position: relative !important;
    width: 100% !important;
    max-width: none !important;

    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    margin: 0 !important;
    padding: var(--kd-clean-cta-box-padding-y) var(--kd-clean-cta-box-padding-x) !important;

    display: block !important;

    overflow: hidden !important;
    isolation: isolate !important;

    border-radius: var(--kd-clean-cta-radius) !important;
    border: 1px solid var(--kd-clean-cta-border) !important;

    background: #ffffff !important;
    background-image: none !important;

    box-shadow: var(--kd-clean-cta-shadow) !important;

    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;

    color: #171717 !important;
    box-sizing: border-box !important;
}

/* حذف نیم‌دایره و لکه‌های تزئینی داخل کارت */
html body main .hotel-cta-box::before,
html body main .hotel-cta-box::after,
html body main .bazaar-cta-box::before,
html body main .bazaar-cta-box::after,
html body main .restaurant-cta-box::before,
html body main .restaurant-cta-box::after,
html body main .residence-cta-box::before,
html body main .residence-cta-box::after,
html body main .golf-cta-box::before,
html body main .golf-cta-box::after {
    content: none !important;
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    background: transparent !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* همه عناصر داخل کارت روی لایه عادی باشند */
html body main .hotel-cta-box>*,
html body main .bazaar-cta-box>*,
html body main .restaurant-cta-box>*,
html body main .residence-cta-box>*,
html body main .golf-cta-box>* {
    position: relative !important;
    z-index: 2 !important;
}

/* ==========================================================
   DIRECTION
   فارسی راست‌چین، انگلیسی چپ‌چین
   ========================================================== */

html[dir="rtl"] body main .hotel-cta-box,
html[dir="rtl"] body main .bazaar-cta-box,
html[dir="rtl"] body main .restaurant-cta-box,
html[dir="rtl"] body main .residence-cta-box,
html[dir="rtl"] body main .golf-cta-box {
    direction: rtl !important;
    text-align: right !important;
}

html[dir="ltr"] body main .hotel-cta-box,
html[dir="ltr"] body main .bazaar-cta-box,
html[dir="ltr"] body main .restaurant-cta-box,
html[dir="ltr"] body main .residence-cta-box,
html[dir="ltr"] body main .golf-cta-box {
    direction: ltr !important;
    text-align: left !important;
}

/* ==========================================================
   TYPOGRAPHY
   حذف اثر inline-styleهای بزرگ و سنگین
   ========================================================== */

html body main .hotel-cta-box h2,
html body main .bazaar-cta-box h2,
html body main .restaurant-cta-box h2,
html body main .residence-cta-box h2,
html body main .golf-cta-box h2 {
    width: 100% !important;
    max-width: none !important;

    margin: 0 0 16px !important;
    padding: 0 !important;

    color: #151515 !important;
    font-size: var(--kd-clean-cta-title-size) !important;
    line-height: 1.55 !important;
    font-weight: 900 !important;

    text-shadow: none !important;
    letter-spacing: -.01em !important;
}

html body main .hotel-cta-box p,
html body main .bazaar-cta-box p,
html body main .restaurant-cta-box p,
html body main .residence-cta-box p,
html body main .golf-cta-box p {
    width: 100% !important;
    max-width: none !important;

    margin: 0 0 10px !important;
    padding: 0 !important;

    color: #343434 !important;
    font-size: var(--kd-clean-cta-text-size) !important;
    line-height: 2.05 !important;
    font-weight: 650 !important;

    text-shadow: none !important;
}

html body main .hotel-cta-box p:last-of-type,
html body main .bazaar-cta-box p:last-of-type,
html body main .restaurant-cta-box p:last-of-type,
html body main .residence-cta-box p:last-of-type,
html body main .golf-cta-box p:last-of-type {
    margin-bottom: 0 !important;
}

/* ==========================================================
   FEATURE / BENEFIT GRIDS
   آیتم‌ها بدون بک‌گراند سنگین؛ فقط کادر Fade
   ========================================================== */

html body main .hotel-features-grid,
html body main .restaurant-benefits-grid,
html body main .residence-benefits-grid,
html body main .golf-training-features {
    width: 100% !important;
    max-width: none !important;

    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px 14px !important;

    margin: 22px 0 0 !important;
    padding: 0 !important;
}

/* آیتم‌های داخلی */
html body main .hotel-feature-item,
html body main .restaurant-benefit-item,
html body main .residence-benefit-item,
html body main .golf-training-item {
    position: relative !important;

    min-height: 0 !important;
    height: auto !important;

    display: flex !important;
    align-items: center !important;
    gap: 10px !important;

    margin: 0 !important;
    padding: 12px 15px !important;

    border-radius: var(--kd-clean-item-radius) !important;
    border: 1px solid var(--kd-clean-item-border) !important;

    background: #ffffff !important;
    background-image: none !important;

    box-shadow:
        0 8px 22px rgba(0, 0, 0, .018),
        inset 0 1px 0 rgba(255, 255, 255, .86) !important;

    color: #222222 !important;

    font-size: 13.5px !important;
    line-height: 1.75 !important;
    font-weight: 850 !important;

    overflow: hidden !important;

    transition:
        border-color .22s ease,
        box-shadow .22s ease,
        transform .22s ease !important;
}

html body main .hotel-feature-item:hover,
html body main .restaurant-benefit-item:hover,
html body main .residence-benefit-item:hover,
html body main .golf-training-item:hover {
    transform: translateY(-1px) !important;
    border-color: var(--kd-clean-item-border-hover) !important;
    box-shadow:
        0 12px 28px rgba(0, 0, 0, .028),
        inset 0 1px 0 rgba(255, 255, 255, .90) !important;
}

/* حذف تزئین‌های داخلی آیتم‌ها */
html body main .hotel-feature-item::before,
html body main .hotel-feature-item::after,
html body main .restaurant-benefit-item::before,
html body main .restaurant-benefit-item::after,
html body main .residence-benefit-item::before,
html body main .residence-benefit-item::after,
html body main .golf-training-item::before,
html body main .golf-training-item::after {
    content: none !important;
    display: none !important;
}

/* آیکون‌ها */
html body main .hotel-feature-item i,
html body main .restaurant-benefit-item i,
html body main .residence-benefit-item i,
html body main .golf-training-item i {
    flex: 0 0 auto !important;
    color: #a27631 !important;
    font-size: 16px !important;
    line-height: 1 !important;
    text-shadow: none !important;
}

/* متن داخل آیتم‌ها */
html body main .hotel-feature-item span,
html body main .restaurant-benefit-item span,
html body main .residence-benefit-item span,
html body main .golf-training-item span {
    color: #222222 !important;
    font-size: inherit !important;
    line-height: inherit !important;
    font-weight: inherit !important;
    background: transparent !important;
    background-image: none !important;
}

/* فارسی: آیکون سمت راست متن */
html[dir="rtl"] body main .hotel-feature-item,
html[dir="rtl"] body main .restaurant-benefit-item,
html[dir="rtl"] body main .residence-benefit-item,
html[dir="rtl"] body main .golf-training-item {
    direction: rtl !important;
    text-align: right !important;
}

/* انگلیسی: آیکون سمت چپ متن */
html[dir="ltr"] body main .hotel-feature-item,
html[dir="ltr"] body main .restaurant-benefit-item,
html[dir="ltr"] body main .residence-benefit-item,
html[dir="ltr"] body main .golf-training-item {
    direction: ltr !important;
    text-align: left !important;
}

/* ==========================================================
   CTA BUTTON INSIDE THESE CARDS
   دکمه‌ها داخل کارت آزاد باشند، نه absolute و نه روی تصویر
   ========================================================== */

html body main .hotel-cta-box>a,
html body main .bazaar-cta-box>a,
html body main .restaurant-cta-box>a,
html body main .residence-cta-box>a,
html body main .golf-cta-box>a {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;

    width: 190px !important;
    min-width: 190px !important;
    max-width: 190px !important;

    height: 46px !important;
    min-height: 46px !important;
    max-height: 46px !important;

    margin-top: 22px !important;
    padding: 0 28px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 999px !important;
    border: 1px solid rgba(162, 118, 49, .22) !important;

    background: rgba(255, 255, 255, .72) !important;
    background-image: none !important;

    color: #23180b !important;
    text-decoration: none !important;

    font-size: 13.5px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    white-space: nowrap !important;

    box-shadow: 0 10px 26px rgba(0, 0, 0, .035) !important;

    backdrop-filter: blur(12px) saturate(125%) !important;
    -webkit-backdrop-filter: blur(12px) saturate(125%) !important;

    transform: none !important;

    transition:
        transform .22s ease,
        border-color .22s ease,
        background-color .22s ease,
        box-shadow .22s ease !important;
}

html body main .hotel-cta-box>a:hover,
html body main .hotel-cta-box>a:focus-visible,
html body main .bazaar-cta-box>a:hover,
html body main .bazaar-cta-box>a:focus-visible,
html body main .restaurant-cta-box>a:hover,
html body main .restaurant-cta-box>a:focus-visible,
html body main .residence-cta-box>a:hover,
html body main .residence-cta-box>a:focus-visible,
html body main .golf-cta-box>a:hover,
html body main .golf-cta-box>a:focus-visible {
    transform: translateY(-1px) !important;
    border-color: rgba(162, 118, 49, .34) !important;
    background: #ffffff !important;
    box-shadow: 0 14px 32px rgba(0, 0, 0, .05) !important;
}

/* فارسی: دکمه زیر محتوا سمت چپ */
html[dir="rtl"] body main .hotel-cta-box>a,
html[dir="rtl"] body main .bazaar-cta-box>a,
html[dir="rtl"] body main .restaurant-cta-box>a,
html[dir="rtl"] body main .residence-cta-box>a,
html[dir="rtl"] body main .golf-cta-box>a {
    margin-right: auto !important;
    margin-left: 0 !important;
}

/* انگلیسی: دکمه زیر محتوا سمت راست */
html[dir="ltr"] body main .hotel-cta-box>a,
html[dir="ltr"] body main .bazaar-cta-box>a,
html[dir="ltr"] body main .restaurant-cta-box>a,
html[dir="ltr"] body main .residence-cta-box>a,
html[dir="ltr"] body main .golf-cta-box>a {
    margin-left: auto !important;
    margin-right: 0 !important;
}

/* حذف افکت‌های قدیمی داخل دکمه */
html body main .hotel-cta-box>a::before,
html body main .hotel-cta-box>a::after,
html body main .bazaar-cta-box>a::before,
html body main .bazaar-cta-box>a::after,
html body main .restaurant-cta-box>a::before,
html body main .restaurant-cta-box>a::after,
html body main .residence-cta-box>a::before,
html body main .residence-cta-box>a::after,
html body main .golf-cta-box>a::before,
html body main .golf-cta-box>a::after {
    content: none !important;
    display: none !important;
}

/* ==========================================================
   RESPONSIVE
   ========================================================== */

@media (max-width: 900px) {
    :root {
        --kd-clean-cta-section-space-top: 42px;
        --kd-clean-cta-section-space-bottom: 54px;
        --kd-clean-cta-box-padding-y: 28px;
        --kd-clean-cta-box-padding-x: 26px;
        --kd-clean-cta-radius: 28px;
        --kd-clean-cta-title-size: clamp(22px, 5vw, 30px);
    }

    html body main .hotel-features-grid,
    html body main .restaurant-benefits-grid,
    html body main .residence-benefits-grid,
    html body main .golf-training-features {
        grid-template-columns: 1fr 1fr !important;
        gap: 10px !important;
    }

    html body main .hotel-feature-item,
    html body main .restaurant-benefit-item,
    html body main .residence-benefit-item,
    html body main .golf-training-item {
        padding: 11px 13px !important;
        font-size: 13px !important;
        line-height: 1.7 !important;
    }
}

@media (max-width: 640px) {
    :root {
        --kd-clean-cta-section-space-top: 34px;
        --kd-clean-cta-section-space-bottom: 44px;
        --kd-clean-cta-box-padding-y: 24px;
        --kd-clean-cta-box-padding-x: 20px;
        --kd-clean-cta-radius: 24px;
    }

    html body main .hotel-features-grid,
    html body main .restaurant-benefits-grid,
    html body main .residence-benefits-grid,
    html body main .golf-training-features {
        grid-template-columns: 1fr !important;
    }

    html body main .hotel-cta-box>a,
    html body main .bazaar-cta-box>a,
    html body main .restaurant-cta-box>a,
    html body main .residence-cta-box>a,
    html body main .golf-cta-box>a {
        width: 170px !important;
        min-width: 170px !important;
        max-width: 170px !important;
        height: 44px !important;
        min-height: 44px !important;
        max-height: 44px !important;
    }
}