/* Import Playfair Display font FIRST with 800 weight */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;0,800;0,900;1,400;1,700;1,800;1,900&display=swap');





/* =========================================
   Start Typography Customizations
   ========================================= */

/* Style the italic text in the heading with maximum specificity */
.page-id-18 .uagb-block-0db5f363 h2.uagb-heading-text em,
.multi-style-hero-heading .uagb-heading-text em {
    color: rgb(152, 178, 212) !important;
    font-style: italic !important;
    font-family: 'Playfair Display', serif !important;
    font-weight: 800 !important;
    -webkit-font-smoothing: antialiased;
}

.uagb-block-7351c904 .uagb-heading-text {
    font-family: "Playfair Display", serif !important;
}

/* =========================================
   Card Hover Effects
   Target: .custom-card-hover
   ========================================= */

/* 1. Image Wrapper */
.custom-card-hover .uagb-ifb-image-content {
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    isolation: isolate;
    transform: translateZ(0);
}

/* 2. Image */
.custom-card-hover .uagb-ifb-image-content img {
    display: block;
    width: 100%;
    height: auto;
    backface-visibility: hidden;
    transition: transform 0.5s ease;
}

/* 3. Dark Overlay */
.custom-card-hover .uagb-ifb-image-content::before {
    content: '';
    position: absolute;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    opacity: 0;
    z-index: 2;
    pointer-events: none;
    transition: opacity 0.3s ease;
}

/* 4. Title & Link */
.custom-card-hover .uagb-ifb-title,
.custom-card-hover .uagb-ifb-title a {
    transition: color 0.3s ease;
    text-decoration: none !important;
}

/* --- HOVER STATES --- */

.custom-card-hover:hover .uagb-ifb-image-content img {
    transform: scale(1.08);
}

.custom-card-hover:hover .uagb-ifb-image-content::before {
    opacity: 1;
}

.custom-card-hover:hover .uagb-ifb-title,
.custom-card-hover:hover .uagb-ifb-title a {
    color: #000000 !important;
}

/* =========================================
   Tab Styles
   Target: .uagb-tabs__panel
   ========================================= */

/* Default Tab State */
.page-id-18 .uagb-tabs__panel .uagb-tab a.uagb-tabs-list {
    border: 1px solid rgb(229, 231, 235);
    border-radius: 9999px;
    background-color: transparent;
    transition: all 0.3s ease;
}

/* Hover State */
.page-id-18 .uagb-tabs__panel .uagb-tab a.uagb-tabs-list:hover {
    border-color: #98b2d4;
}

/* Active State */
.page-id-18 .uagb-tabs__panel .uagb-tab.uagb-tabs__active a.uagb-tabs-list {
    background-color: #98b2d4;
    border-color: #98b2d4;
    color: #ffffff !important;
}

/* =========================================
   Difference Cards Layout
   Target: .difference-cards-layout
   ========================================= */

/* Base Card Styles */
.difference-cards-layout {
    background-color: #ffffff;
    border: 1px solid rgba(243, 244, 246, 0.25);
    /* Transition: 500ms easing */
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Hover: Shadow and Border */
.difference-cards-layout:hover {
    /* Tailwind shadow-xl */
    box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
    border-color: #f3f4f6;
}

/* Icon Wrapper Transition */
.difference-cards-layout .uagb-ifb-icon-wrap {
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    border-radius: 1rem;
    background-color: #f5f7fa;
}

/* Icon SVG Transition */
.difference-cards-layout .uagb-ifb-icon-wrap svg {
    transition: fill 0.3s ease;
    fill: currentColor;
    display: block;
    /* Remove SVG gap */
}

/* Hover: Icon Background and Color */
.difference-cards-layout:hover .uagb-ifb-icon-wrap {
    background-color: #98b2d4;
    color: #ffffff;
}

/* Force SVG and paths to white on hover */
.difference-cards-layout:hover .uagb-ifb-icon-wrap svg,
.difference-cards-layout:hover .uagb-ifb-icon-wrap svg path {
    fill: #ffffff !important;
}
/* =========================================
   Testimonials Slider Customization
   Target: .uagb-block-71bfaecd 
   ========================================= */

/* Navigation Arrows - Specific Button Target */
.uagb-block-71bfaecd .slick-arrow {
    border-radius: 9999px !important;
    border: 1px solid rgb(229, 231, 235) !important;
    background-color: transparent !important;
    background: transparent !important;
    width: 45px !important;
    height: 45px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    /* Center SVG */
    transition: all 0.3s ease;
    box-shadow: none !important;
    opacity: 1 !important;
    /* Ensure visible */
}

/* Ensure SVG is centered and visible */
.uagb-block-71bfaecd .slick-arrow svg {
    display: block !important;
    margin: 0 auto !important;
}

/* Navigation Arrows - Hover State */
.uagb-block-71bfaecd .slick-arrow:hover {
    border-color: #98b2d4 !important;
    background-color: #98b2d4 !important;
    background: #98b2d4 !important;
}

/* Change SVG icon color to white on hover */
.uagb-block-71bfaecd .slick-arrow:hover svg,
.uagb-block-71bfaecd .slick-arrow:hover svg path {
    fill: #ffffff !important;
}

/* Pagination Dots - Remove Default Background */
/* Target the button inside the list item specifically */
.uagb-block-71bfaecd .slick-dots li button,
.uagb-block-71bfaecd .slick-dots li button:before {
    background-color: transparent !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}


 /*  Footer Area Customization
   Target: .site-above-footer-wrap
   ========================================= */

/* Widget Titles / Headings */
.site-primary-footer-wrap .widget-title,
.site-primary-footer-wrap h2.widget-title {
    text-transform: uppercase !important;
    font-weight: 700 !important;
    font-size: 0.70rem !important;
    /* User requested font height 0.70rem */
    color: #98b2d4 !important;
    /* Assuming #98b2d4 based on previous context */
    letter-spacing: 0.5px;
    /* Clean look for small caps */
}

/* Menu Items (Links) */
.site-primary-footer-wrap .menu-item a,
.site-primary-footer-wrap .menu-link {
    font-size: 10.50px !important;
    font-weight: 300 !important;
    color: #9ca3af !important;
    transition: color 0.3s ease;
    text-decoration: none !important;
}

/* Menu Hover State */
.site-primary-footer-wrap .menu-item a:hover,
.site-primary-footer-wrap .menu-link:hover {
    color: #ffffff !important;
}

/* Responsive Font Size for Widget Titles (Tablet & Mobile) */
@media (max-width: 1024px) {

    .site-primary-footer-wrap .widget-title,
    .site-primary-footer-wrap h2.widget-title {
        font-size: 10px !important;
    }
}