/* Exclusive Offers Section Styles */
.exclusive-offers-section {
    background-color: var(--background-bg-brand-2-primary);
    padding: var(--section-vertical-padding-default) 0;
    position: relative;
    direction: var(--page-direction);
}

.exclusive-offers-section .section-container {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-horizontal-padding-default);
}


.exclusive-offers-section .content-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-16-64px);
}

/* Header Section */
.exclusive-offers-section .header-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-6-24px);
    max-width: var(--width-4xl);
}

.exclusive-offers-section .offer-badge {
    position: relative;
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.exclusive-offers-section .badge-icon svg {
    width: 100%;
    height: 100%;
}

.exclusive-offers-section .main-heading {
    font-family: var(--font-family-font-family-display);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-desktop-display-xl);
    line-height: var(--line-height-desktop-display-xl);
    letter-spacing: var(--letter-spacing-xl);
    text-align: center;
    background: linear-gradient(135deg, var(--colors-brand-2-900) 0%, var(--colors-brand-2-600) 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin: 0;
}

.exclusive-offers-section .description {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--spacing-2-8px);
}

.exclusive-offers-section .description p {
    font-family: var(--font-family-font-family-body);
    font-weight: var(--font-weight-regular);
    font-size: var(--font-size-desktop-display-xs);
    line-height: var(--line-height-desktop-display-xs);
    text-align: center;
    color: var(--text-text-brand-2-primary-900);
    max-width: 602px;
    margin: 0;
}

/* Service Cards */
.exclusive-offers-section .services-cards {
    display: flex;
    justify-content: stretch;
    align-items: stretch;
    gap: var(--spacing-8-32px);
    width: 100%;
    max-width: 1062px;
}

.exclusive-offers-section .service-card {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 332px;
    max-width: 332px;
    align-items: center;
    gap: var(--spacing-8-32px);
    padding: var(--spacing-16-64px) var(--spacing-8-32px) var(--spacing-8-32px);
    background-color: var(--background-bg-primary);
    border: 1px solid var(--border-border-brand-2);
    border-radius: var(--radius-4xl);
    flex: 1;
    box-shadow: var(--colors-effects-shadows-shadow-sm-01) 0px 1px 2px -1px, 
                var(--colors-effects-shadows-shadow-sm-02) 0px 1px 3px 0px;
}

.exclusive-offers-section .card-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-8-32px);
    width: 100%;
}

.exclusive-offers-section .service-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-4-16px);
}

.exclusive-offers-section .service-icon {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.exclusive-offers-section .service-name {
    color: var(--text-text-primary-900);
    text-align: center;
    font-family: var(--font-family-font-family-display);
    font-weight: 600;
    font-size: var(--font-size-desktop-display-sm);
    line-height: var(--line-height-desktop-display-sm);
    letter-spacing: var(--letter-spacing-sm);
}

/* Pricing Section */
.exclusive-offers-section .pricing {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

.exclusive-offers-section .price-numbers {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    gap: var(--spacing-3-12px);
    padding-right: var(--spacing-8-32px);
}

.exclusive-offers-section .saudi-riyal {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    padding-bottom: var(--spacing-4-16px);
    height: 100%;
}

.exclusive-offers-section .current-price {
    font-family: var(--font-family-font-family-display);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-desktop-display-lg);
    line-height: var(--line-height-desktop-display-lg);
    text-align: center;
    color: var(--text-text-primary-900);
}

.exclusive-offers-section .original-price {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    gap: var(--spacing-2-8px);
    padding-bottom: var(--spacing-3-12px);
    height: 100%;
}

.exclusive-offers-section .crossed-out {
    font-family: var(--font-family-font-family-display);
    font-weight: var(--font-weight-regular);
    font-size: var(--font-size-desktop-display-sm);
    line-height: var(--line-height-desktop-display-sm);
    text-align: center;
    color: var(--text-text-brand-2-secondary-hover);
    text-decoration: line-through;
}

.exclusive-offers-section .currency {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--spacing-2-8px);
    width: 100%;
}

.exclusive-offers-section .currency span {
    color: var(--text-text-primary-900);
    text-align: center;
    font-family: var(--font-family-font-family-body);
    font-weight: var(--font-weight-light);
    font-size: var(--font-size-text-lg);
    line-height: var(--line-height-text-lg);
    letter-spacing: var(--letter-spacing-xs);
}

/* Service Points */
.exclusive-offers-section .service-points {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-2-8px);
    width: 100%;
    padding-left: 0.2rem;
}

.exclusive-offers-section .service-points li {
    color: var(--text-text-primary-900);
    text-align: var(--text-align);
    font-family: var(--font-family-font-family-body);
    font-weight: var(--font-weight-regular);
    font-size: var(--font-size-text-sm);
    line-height: var(--line-height-text-sm);
    letter-spacing: var(--letter-spacing-xxs);
}

/* Discount Label */
.exclusive-offers-section .discount-label {
    position: absolute;
    top: 12px;
    right: 15px;
    display: flex;
    min-width: 125px;
    gap: var(--spacing-1-4px);
    padding: var(--spacing-1-4px) var(--spacing-1-4px) var(--spacing-1-4px) var(--spacing-3-12px);
    background-color: var(--background-bg-brand-2-tertiary);
    border-radius: var(--radius-4xl);
}
/* Discount Label */
[lang="ar"] .exclusive-offers-section .discount-label {
    position: absolute;
    top: 12px;
    left: 15px;
    display: flex;
    justify-content: center;
    min-width: 125px;
    width: 125px;
    align-items: center;
    gap: var(--spacing-1-4px);
    padding: var(--spacing-1-4px) var(--spacing-1-4px) var(--spacing-1-4px) var(--spacing-3-12px);
    background-color: var(--background-bg-brand-2-tertiary);
    border-radius: var(--radius-4xl);
}

.exclusive-offers-section .discount-label span {
    font-family: var(--font-family-font-family-display);
    font-weight: var(--font-weight-medium);
    font-size: var(--font-size-text-xs);
    line-height: var(--line-height-text-xs);
    text-align: center;
    color: var(--text-text-brand-2-primary-900);
}

/* CTA Button */
.exclusive-offers-section .cta-button {
    display: flex;
    justify-content: center;
    align-items: center;
    display: flex;
    padding: 10px 14px;
    justify-content: center;
    align-items: center;
    gap: var(--spacing-xs, 4px);
    align-self: stretch;
    background: linear-gradient(180deg, var(--colors-brand-2-500-base) 0%, var(--colors-brand-2-600) 100%);
    border: 2px solid rgba(255, 255, 255, 0.12);
    border-radius: var(--radius-md);
    width: 100%;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    box-shadow: var(--colors-effects-shadows-shadow-sm-01) 0px 1px 2px -1px, 
                var(--colors-effects-shadows-shadow-sm-02) 0px 1px 3px 0px;
    color: var(--text-text-primary_on-brand-2);
    color: #6F4101;
    -webkit-text-fill-color: #6F4101;
}
.exclusive-offers-section .cta-button:visited {
    color: var(--text-text-primary_on-brand-2);
    color: #6F4101;
    -webkit-text-fill-color: #6F4101;
}

.exclusive-offers-section .cta-button:hover {
    background: linear-gradient(180deg, var(--colors-brand-2-600) 0%, var(--colors-brand-2-700) 100%);
    transform: translateY(-1px);
}

.exclusive-offers-section .cta-button span {
    color: var(--text-text-primary_on-brand-2);
    color: #6F4101;
    -webkit-text-fill-color: #6F4101;
    font-family: var(--font-family-font-family-body);
    font-size: var(--font-size-text-sm);
    font-weight: var(--font-weight-medium);
    line-height: var(--line-height-text-sm);
    letter-spacing: var(--letter-spacing-xxs);
}

/* Trust Builders */
.exclusive-offers-section .trust-builders {
    display: flex;
    justify-content: stretch;
    align-items: stretch;
    gap: var(--spacing-8-32px);
    max-width: 908px;
    width: 100%;
}

.exclusive-offers-section .trust-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-4-16px);
    flex: 1;
}

.exclusive-offers-section .trust-icon {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--background-bg-primary);
    border: 2px solid var(--border-border-primary);
    border-radius: var(--spacing-4-16px);
    box-shadow: var(--colors-effects-shadows-shadow-sm-01) 0px 1px 2px -1px, 
                var(--colors-effects-shadows-shadow-sm-02) 0px 1px 3px 0px;
    padding: var(--spacing-3-12px);
}

.exclusive-offers-section .trust-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-1-4px);
    width: 100%;
}

.exclusive-offers-section .trust-content h3 {
    font-family: var(--font-family-font-family-display);
    font-weight: var(--font-weight-medium);
    font-size: var(--font-size-text-lg);
    line-height: var(--line-height-text-lg);
    text-align: center;
    color: var(--text-text-primary-900);
    margin: 0;
}

.exclusive-offers-section .trust-content p {
    font-family: var(--font-family-font-family-body);
    font-weight: var(--font-weight-light);
    font-size: var(--font-size-text-md);
    line-height: var(--line-height-text-md);
    text-align: center;
    color: var(--text-text-tertiary-600);
    margin: 0;
}

/* Payment Section */
.exclusive-offers-section .payment-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-8-32px);
    padding: var(--spacing-6-24px) var(--spacing-12-48px);
    max-width: 842px;
    width: 100%;
}

.exclusive-offers-section .section-divider {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--spacing-1-5-6px);
}

.exclusive-offers-section .divider-dots {
    display: flex;
    gap: var(--spacing-1-5-6px);
}

.exclusive-offers-section .dot {
    width: 2px;
    height: 2px;
    background-color: var(--border-border-primary);
    border-radius: 50%;
}

.exclusive-offers-section .payment-methods {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--spacing-16-64px);
    width: 100%;
}

.exclusive-offers-section .payment-gateways {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: var(--spacing-6-24px);
}

.exclusive-offers-section .payment-card {
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.exclusive-offers-section .payment-card img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.exclusive-offers-section .payment-text span {
    font-family: var(--font-family-font-family-display);
    font-weight: var(--font-weight-medium);
    font-size: var(--font-size-text-lg);
    line-height: var(--line-height-text-lg);
    text-align: var(--text-align);
    color: var(--text-text-primary-900);
}

/* Social Proof */
.exclusive-offers-section .social-proof {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--spacing-16-64px);
    padding: var(--spacing-4-16px) var(--spacing-16-64px);
    background-color: var(--background-bg-primary);
    border: 2px solid var(--border-border-brand-2);
    border-radius: var(--spacing-4-16px);
    max-width: 842px;
    width: 100%;
    box-shadow: var(--colors-effects-shadows-shadow-sm-01) 0px 1px 2px -1px, 
                var(--colors-effects-shadows-shadow-sm-02) 0px 1px 3px 0px;
}

.exclusive-offers-section .rating-section {
    width: 100%;
    height: 107px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.exclusive-offers-section .reviews-image {
    width: 262px;
    height: 107px;
    object-fit: cover;
}

.exclusive-offers-section .divider-line {
    width: 0;
    height: 80px;
    border-left: 2px dashed var(--border-border-primary);
}

.exclusive-offers-section .patient-count {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-1-4px);
    width: 100%;
}

.exclusive-offers-section .count-number {
    color: var(--text-text-primary-900);
    text-align: center;
    font-family: var(--font-family-font-family-display);
    font-size: var(--font-size-desktop-display-sm);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-desktop-display-sm);
    letter-spacing: var(--letter-spacing-sm);
}

.exclusive-offers-section .count-label {
    color: var(--text-text-tertiary-600);
    text-align: center;
    font-family: var(--font-family-font-family-body);
    font-size: var(--font-size-text-md);
    font-weight: var(--font-weight-regular);
    line-height: var(--line-height-text-md);
    letter-spacing: var(--letter-spacing-xxs);
}

/* Secondary CTA */
.exclusive-offers-section .secondary-cta {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: var(--spacing-8-32px);
    width: 100%;
}

.exclusive-offers-section .cta-text p {
    max-width: var(--paragraph-max-width);
    color: var(--text-text-primary-900);
    text-align: center;
font-family: var(--font-family-font-family-display);
font-size: var(--font-size-desktop-display-xs);
font-style: normal;
font-weight: 600;
line-height: var(--line-height-desktop-display-xs); /* 150% */
letter-spacing: var(--letter-spacing-xs);
}

.exclusive-offers-section .cta-buttons {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--spacing-6-24px);
}

.exclusive-offers-section .faq-button {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--spacing-1-5-6px);
    background: transparent;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

.exclusive-offers-section .faq-button span {
    font-family: var(--font-family-font-family-display);
    font-weight: var(--font-weight-medium);
    font-size: var(--font-size-text-md);
    line-height: var(--line-height-text-md);
    text-align: left;
    color: var(--text-text-brand-secondary-700);
}

.exclusive-offers-section .faq-button:hover span {
    color: var(--text-text-brand-secondary-hover);
}

.exclusive-offers-section .whatsapp-button {
    display: flex;
    padding: 10px var(--spacing-xl, 16px);
    justify-content: center;
    align-items: center;
    gap: var(--spacing-sm, 6px);
    border-radius: var(--radius-md, 8px);
    border: 2px solid var(--gradient-skeuemorphic-gradient-border);
    background: var(--background-bg-brand-solid);
    box-shadow: 0 0 0 1px var(--colors-effects-shadows-shadow-skeumorphic-inner-border) inset, 0 -2px 0 0 var(--colors-effects-shadows-shadow-skeumorphic-inner) inset, 0 1px 2px 0 var(--colors-effects-shadows-shadow-xs);
}

.exclusive-offers-section .whatsapp-button:hover {
    background-color: var(--background-bg-brand-solid-hover);
    transform: translateY(-1px);
}

.exclusive-offers-section .whatsapp-button span {
    font-family: var(--font-family-font-family-display);
    font-weight: var(--font-weight-medium);
    font-size: var(--font-size-text-md);
    line-height: var(--line-height-text-md);
    text-align: left;
    color: var(--text-text-white);
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
    .exclusive-offers-section {
        padding: var(--section-vertical-padding-sm) 0;
    }
    
    .exclusive-offers-section .section-container {
        padding: 0 var(--container-horizontal-padding-sm-2);
    }
    
    .exclusive-offers-section .main-heading {
        font-size: var(--font-size-mobile-display-xl);
        line-height: var(--line-height-mobile-display-xl);
    }
    
    .exclusive-offers-section .services-cards {
        flex-direction: column;
        gap: var(--spacing-6-24px);
    }
    
    .exclusive-offers-section .trust-builders {
        flex-wrap: wrap;
        gap: var(--spacing-6-24px);
    }
    
    .exclusive-offers-section .trust-item {
        flex: 0 0 calc(50% - var(--spacing-3-12px));
    }
    
    .exclusive-offers-section .payment-methods {
        flex-direction: column;
        gap: var(--spacing-6-24px);
    }
    
    .exclusive-offers-section .social-proof {
        flex-direction: column;
        gap: var(--spacing-6-24px);
        padding: var(--spacing-6-24px) var(--spacing-8-32px);
    }
    
    .exclusive-offers-section .divider-line {
        width: 80px;
        height: 0;
        border-left: none;
        border-top: 2px dashed var(--border-border-primary);
    }
    
    .exclusive-offers-section .cta-buttons {
        flex-direction: column;
        gap: var(--spacing-4-16px);
        width: 100%;
    }
    
    .exclusive-offers-section .whatsapp-button,
    .exclusive-offers-section .faq-button {
        width: 100%;
        justify-content: center;
    }
    .exclusive-offers-section .services-cards {
        justify-content: center;
        align-items: center;
    }

[lang="ar"] .exclusive-offers-section .discount-label {
    left: 194px;
  }
} 

.exclusive-offers-section .header-content {
    max-width: 624px;
}


.gray .divider-dots::before, .gray .divider-dots::after {
    background: repeating-linear-gradient(
        to right,
        var(--foreground-fg-disabled-subtle) 0,
        var(--foreground-fg-disabled-subtle) 4px,
        transparent 4px,
        transparent 14px
      );
      content: "";
      width: 628px;
      height: 4px;
}