.elementor-183 .elementor-element.elementor-element-3e12182{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:wrap;--overlay-opacity:0.5;}.elementor-183 .elementor-element.elementor-element-3e12182:not(.elementor-motion-effects-element-type-background), .elementor-183 .elementor-element.elementor-element-3e12182 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background:url("https://riyadh.arqaartfair.com/wp-content/uploads/2026/01/Arqa-Riyadh-Hero-Image.gif") 50% 50%;background-size:cover;}.elementor-183 .elementor-element.elementor-element-3e12182::before, .elementor-183 .elementor-element.elementor-element-3e12182 > .elementor-background-video-container::before, .elementor-183 .elementor-element.elementor-element-3e12182 > .e-con-inner > .elementor-background-video-container::before, .elementor-183 .elementor-element.elementor-element-3e12182 > .elementor-background-slideshow::before, .elementor-183 .elementor-element.elementor-element-3e12182 > .e-con-inner > .elementor-background-slideshow::before, .elementor-183 .elementor-element.elementor-element-3e12182 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{--background-overlay:'';}.elementor-183 .elementor-element.elementor-element-4d881c9{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-183 .elementor-element.elementor-element-5772adf{margin:100px 0px calc(var(--kit-widget-spacing, 0px) + 50px) 0px;}.elementor-183 .elementor-element.elementor-element-dd680a3{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-183 .elementor-element.elementor-element-c3c416f{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 200px) 0px;}.elementor-183 .elementor-element.elementor-element-c3c416f.elementor-element{--align-self:flex-end;}.elementor-183 .elementor-element.elementor-element-8279f1b{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-183 .elementor-element.elementor-element-0cf5a43{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 200px) 0px;}.elementor-183 .elementor-element.elementor-element-0cf5a43.elementor-element{--align-self:flex-start;}.elementor-183 .elementor-element.elementor-element-2fb42eb{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-183 .elementor-element.elementor-element-2fb42eb:not(.elementor-motion-effects-element-type-background), .elementor-183 .elementor-element.elementor-element-2fb42eb > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:linear-gradient(180deg, #BBBBBB 0%, #1C471B 100%);}.elementor-183 .elementor-element.elementor-element-f4c9c2e{--display:grid;--e-con-grid-template-columns:repeat(2, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;--margin-top:50px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-183 .elementor-element.elementor-element-e98ab5d{--display:flex;}.elementor-183 .elementor-element.elementor-element-3588ce1{margin:20px 0px calc(var(--kit-widget-spacing, 0px) + 20px) 0px;}.elementor-183 .elementor-element.elementor-element-3588ce1.elementor-element{--align-self:center;}.elementor-183 .elementor-element.elementor-element-3edaebe{--display:flex;--margin-top:50px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-183 .elementor-element.elementor-element-48e8848{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-183 .elementor-element.elementor-element-48e8848.elementor-element{--align-self:center;}.elementor-183 .elementor-element.elementor-element-8f9a290{--display:grid;--e-con-grid-template-columns:repeat(2, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;--margin-top:-70px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-183 .elementor-element.elementor-element-44bce57{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-183 .elementor-element.elementor-element-44bce57.elementor-element{--align-self:flex-end;}.elementor-183 .elementor-element.elementor-element-44bce57 .elementor-counter-number-wrapper{color:#FFFFFF;font-size:50px;}.elementor-183 .elementor-element.elementor-element-44bce57 .elementor-counter-title{color:#FFFFFF;font-size:15px;}.elementor-183 .elementor-element.elementor-element-ca38d6e{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-183 .elementor-element.elementor-element-ca38d6e.elementor-element{--align-self:flex-end;}.elementor-183 .elementor-element.elementor-element-ca38d6e .elementor-counter-number-wrapper{color:#FFFFFF;font-size:50px;}.elementor-183 .elementor-element.elementor-element-ca38d6e .elementor-counter-title{color:#FFFFFF;font-size:15px;}.elementor-183 .elementor-element.elementor-element-f0eded7{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-183 .elementor-element.elementor-element-f0eded7:not(.elementor-motion-effects-element-type-background), .elementor-183 .elementor-element.elementor-element-f0eded7 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#2E2E2E;}.elementor-183 .elementor-element.elementor-element-640428d{--display:grid;--e-con-grid-template-columns:repeat(3, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-183 .elementor-element.elementor-element-8ab83fd{--display:flex;}.elementor-183 .elementor-element.elementor-element-897c43b{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-183 .elementor-element.elementor-element-1d3c216.elementor-element{--align-self:center;}.elementor-183 .elementor-element.elementor-element-1d788c0{--display:flex;}.elementor-183 .elementor-element.elementor-element-5a6486c{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-183 .elementor-element.elementor-element-fd78040.elementor-element{--align-self:center;}.elementor-183 .elementor-element.elementor-element-7dcab2b{--display:flex;}.elementor-183 .elementor-element.elementor-element-d23b267{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-183 .elementor-element.elementor-element-de3baa7.elementor-element{--align-self:center;}.elementor-183 .elementor-element.elementor-element-94237f7{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:wrap;}.elementor-183 .elementor-element.elementor-element-94237f7:not(.elementor-motion-effects-element-type-background), .elementor-183 .elementor-element.elementor-element-94237f7 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#1C471B;}.elementor-183 .elementor-element.elementor-element-5210f56{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-183 .elementor-element.elementor-element-038d38a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-183 .elementor-element.elementor-element-e7430bf.elementor-element{--align-self:center;}.elementor-183 .elementor-element.elementor-element-e7fddae{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;}.elementor-183 .elementor-element.elementor-element-b6c4453{--grid-template-columns:repeat(0, auto);text-align:center;--grid-column-gap:5px;--grid-row-gap:0px;}.elementor-183 .elementor-element.elementor-element-18b2542.elementor-element{--align-self:center;}:root{--page-title-display:none;}@media(max-width:1024px){.elementor-183 .elementor-element.elementor-element-f4c9c2e{--grid-auto-flow:row;}.elementor-183 .elementor-element.elementor-element-3588ce1.elementor-element{--align-self:center;}.elementor-183 .elementor-element.elementor-element-48e8848{margin:300px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-183 .elementor-element.elementor-element-8f9a290{--grid-auto-flow:row;--margin-top:-50px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-183 .elementor-element.elementor-element-44bce57.elementor-element{--align-self:flex-start;}.elementor-183 .elementor-element.elementor-element-44bce57 .elementor-counter-number-wrapper{font-size:30px;}.elementor-183 .elementor-element.elementor-element-44bce57 .elementor-counter-title{font-size:12px;}.elementor-183 .elementor-element.elementor-element-ca38d6e{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-183 .elementor-element.elementor-element-ca38d6e.elementor-element{--align-self:flex-start;}.elementor-183 .elementor-element.elementor-element-ca38d6e .elementor-counter-number-wrapper{font-size:30px;}.elementor-183 .elementor-element.elementor-element-ca38d6e .elementor-counter-title{font-size:12px;}.elementor-183 .elementor-element.elementor-element-640428d{--grid-auto-flow:row;}.elementor-183 .elementor-element.elementor-element-897c43b{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-183 .elementor-element.elementor-element-5a6486c{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-183 .elementor-element.elementor-element-d23b267{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}}@media(min-width:768px){.elementor-183 .elementor-element.elementor-element-4d881c9{--width:100%;}.elementor-183 .elementor-element.elementor-element-dd680a3{--width:50%;}.elementor-183 .elementor-element.elementor-element-8279f1b{--width:50%;}.elementor-183 .elementor-element.elementor-element-5210f56{--width:100%;}.elementor-183 .elementor-element.elementor-element-038d38a{--width:50%;}.elementor-183 .elementor-element.elementor-element-e7fddae{--width:50%;}}@media(max-width:767px){.elementor-183 .elementor-element.elementor-element-c3c416f{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-183 .elementor-element.elementor-element-c3c416f.elementor-element{--align-self:center;}.elementor-183 .elementor-element.elementor-element-0cf5a43{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-183 .elementor-element.elementor-element-0cf5a43.elementor-element{--align-self:center;}.elementor-183 .elementor-element.elementor-element-f4c9c2e{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-183 .elementor-element.elementor-element-3588ce1{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-183 .elementor-element.elementor-element-48e8848{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-183 .elementor-element.elementor-element-8f9a290{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;--margin-top:-0px;--margin-bottom:-0px;--margin-left:-0px;--margin-right:-0px;}.elementor-183 .elementor-element.elementor-element-44bce57{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-183 .elementor-element.elementor-element-ca38d6e{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-183 .elementor-element.elementor-element-640428d{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;}}/* Start custom CSS for html, class: .elementor-element-5772adf *//* The Reveal & Focus Animation */
.elementor-183 .elementor-element.elementor-element-5772adf {
    opacity: 0;
    filter: blur(12px); /* Starts blurred like your smoke background */
    letter-spacing: 12px; /* Starts wide for an ethereal look */
    transform: scale(1.05); /* Slight zoom-out feel */
    
    animation: revealFocus 1.8s cubic-bezier(0.2, 0, 0.2, 1) forwards;
    animation-delay: 0.2s;
}

@keyframes revealFocus {
    0% {
        opacity: 0;
        filter: blur(12px);
        letter-spacing: 12px;
        transform: scale(1.05);
    }
    100% {
        opacity: 1;
        filter: blur(0);
        letter-spacing: 1px; /* Settles into your clean modern look */
        transform: scale(1);
    }
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-c3c416f *//* 1. THE STAGGERED RISE ANIMATION */
.elementor-183 .elementor-element.elementor-element-c3c416f {
    opacity: 0;
    transform: translateY(20px); 
    animation: staggeredRise 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
    animation-delay: 2.3s;
    
    display: flex !important;
    justify-content: center !important;
}

@keyframes staggeredRise {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 2. NORMAL STATE: MATCHED TO SECOND BLOCK */
.elementor-183 .elementor-element.elementor-element-c3c416f .elementor-button {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    color: #ffffff !important;
    background-color: transparent !important;
    border: 1px solid rgba(255, 255, 255, 0.5) !important;
    border-radius: 2px !important;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;

    text-align: center !important;
    white-space: normal !important; 
    word-break: break-word !important;

    /* UPDATED: Matched font-size max to 15px */
    font-size: clamp(12px, 1.2vw, 15px) !important;

    /* UPDATED: Matched letter-spacing max to 3px */
    letter-spacing: clamp(1.5px, 0.2vw, 3px) !important;

    /* UPDATED: Matched padding (16px vertical, 45px horizontal) */
    padding: clamp(10px, 1.5vw, 16px) clamp(25px, 3vw, 45px) !important;
    
    width: auto !important;
    max-width: 100% !important;
}

/* 3. ENHANCED HOVER STATE: MATCHED TO SECOND BLOCK */
.elementor-183 .elementor-element.elementor-element-c3c416f .elementor-button:hover {
    color: #9E771F !important; 
    border-color: #9E771F !important;
    background-color: rgba(158, 119, 31, 0.08) !important;
    transform: scale(1.03) translateY(-2px); 
    
    /* UPDATED: Matched hover letter-spacing max to 5px */
    letter-spacing: clamp(3px, 0.4vw, 5px) !important; 
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

/* 4. ICON FIX */
.elementor-183 .elementor-element.elementor-element-c3c416f .elementor-align-icon-right {
    margin-left: 10px;
    transition: transform 0.3s ease;
}

.elementor-183 .elementor-element.elementor-element-c3c416f .elementor-button:hover .elementor-align-icon-right {
    transform: translateX(5px);
}

/* 5. MOBILE REFINEMENT ADDITION */
@media (max-width: 767px) {
    .elementor-183 .elementor-element.elementor-element-c3c416f .elementor-button {
        display: block !important;
        margin: 0 auto !important;
        text-align: center !important;
    }
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-0cf5a43 *//* The Ghost Reveal Animation - UNTOUCHED */
.elementor-183 .elementor-element.elementor-element-0cf5a43 {
    opacity: 0;
    animation: ghostReveal 1.5s ease-in-out forwards;
    animation-delay: 2.8s;
    
    /* ADDITION: Centers the button container */
    display: flex !important;
    justify-content: center !important;
}

@keyframes ghostReveal {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

/* Normal State: Clean, Minimal & Responsive */
.elementor-183 .elementor-element.elementor-element-0cf5a43 .elementor-button {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    color: #ffffff !important;
    background-color: transparent !important;
    border: 1px solid rgba(255, 255, 255, 0.5) !important;
    border-radius: 2px !important;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;

    /* ADDITION: Centers text if it wraps */
    text-align: center !important;
    white-space: normal !important;
    word-break: break-word !important;

    /* RESPONSIVE TEXT */
    font-size: clamp(12px, 1.2vw, 15px) !important;
    
    /* RESPONSIVE SPACING */
    letter-spacing: clamp(1.5px, 0.2vw, 3px) !important;

    /* RESPONSIVE PADDING */
    padding: clamp(10px, 1.5vw, 16px) clamp(25px, 3vw, 45px) !important;
    
    width: auto !important;
    max-width: 100% !important;
}

/* Enhanced Hover State: The "Premium" Interaction */
.elementor-183 .elementor-element.elementor-element-0cf5a43 .elementor-button:hover {
    color: #9E771F !important; /* Arqa Gold */
    border-color: #9E771F !important;
    background-color: rgba(158, 119, 31, 0.08) !important;
    transform: scale(1.03) translateY(-2px); 
    
    letter-spacing: clamp(3px, 0.4vw, 5px) !important; 
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

/* Fix for the internal icon if you have one - UNTOUCHED */
.elementor-183 .elementor-element.elementor-element-0cf5a43 .elementor-align-icon-right {
    margin-left: 10px;
    transition: transform 0.3s ease;
}

.elementor-183 .elementor-element.elementor-element-0cf5a43 .elementor-button:hover .elementor-align-icon-right {
    transform: translateX(5px);
}

/* MOBILE SPECIFIC REFINEMENT */
@media (max-width: 767px) {
    .elementor-183 .elementor-element.elementor-element-0cf5a43 .elementor-button {
        display: block !important;
        margin: 0 auto !important;
        text-align: center !important;
    }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-3e12182 *//* --- HERO TO GRAY TRANSITION (LOWERED) --- */

.elementor-183 .elementor-element.elementor-element-3e12182 {
    position: relative;
    margin-bottom: -1px; 
}

.elementor-183 .elementor-element.elementor-element-3e12182::after {
    content: "";
    position: absolute;
    inset: 0;
    /* Changed 60% to 80% to push the gray fade lower */
    background: linear-gradient(to bottom, 
        rgba(187, 187, 187, 0) 80%, 
        #BBBBBB 100%
    ) !important;
    z-index: 1; 
    pointer-events: none;
}

/* Keeps your Experience text and buttons visible above the fade */
.elementor-183 .elementor-element.elementor-element-3e12182 .elementor-widget,
.elementor-183 .elementor-element.elementor-element-3e12182 .elementor-column {
    position: relative;
    z-index: 2;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-28bab0d *//* 1. THE MODERN REVEAL KEYFRAMES */
@keyframes arqaModernReveal {
    0% {
        opacity: 0;
        transform: translateY(40px);
        filter: blur(10px); /* Modern soft-focus start */
    }
    100% {
        opacity: 1;
        transform: translateY(0);
        filter: blur(0px); /* Sharp finish */
    }
}

/* 2. TARGET THE H2 (The Headline) */
#zbQwhA h2 {
    opacity: 0; /* Hidden before start */
    animation: arqaModernReveal 1.2s cubic-bezier(0.22, 1, 0.36, 1) forwards;
    animation-delay: 0.2s;
    will-change: transform, opacity;
}

/* 3. TARGET THE P (The Body Text) */
#zDEqTG p.body {
    opacity: 0;
    animation: arqaModernReveal 1.2s cubic-bezier(0.22, 1, 0.36, 1) forwards;
    animation-delay: 0.5s; /* Staggered delay for hierarchy */
    will-change: transform, opacity;
}

/* 4. EXTRA POP FOR GOLD TEXT */
#zDEqTG p.body strong {
    display: inline-block;
    transition: all 0.5s ease;
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-3588ce1 *//* --- MODERN GALLERY BUTTON STYLING --- */

.elementor-183 .elementor-element.elementor-element-3588ce1 .elementor-button {
    background-color: transparent !important; /* Removes the heavy grey */
    border: 1px solid rgba(255, 255, 255, 0.4) !important; /* Thin, elegant border */
    color: #ffffff !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: 3px !important; /* Matches your luxury headers */
    font-size: 13px !important;
    padding: 15px 35px !important; /* Modern, elongated shape */
    transition: all 0.4s ease-in-out !important;
    border-radius: 0px !important; /* Sharp corners for a premium feel */
}

/* --- HOVER STATE: ARQA GOLD REVEAL --- */

.elementor-183 .elementor-element.elementor-element-3588ce1 .elementor-button:hover {
    background-color: #9E771F !important; /* Arqa Gold */
    border-color: #9E771F !important;
    color: #ffffff !important;
    letter-spacing: 5px !important; /* Subtle expansion effect */
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
    transform: translateY(-3px); /* Subtle lift */
}


/* 1. BUTTON ENTRANCE KEYFRAMES */
@keyframes arqaButtonEntrance {
    0% {
        opacity: 0;
        transform: scale(0.9) translateY(20px);
        letter-spacing: 10px; /* Dramatic wide start */
        border-color: rgba(158, 119, 31, 0);
    }
    100% {
        opacity: 1;
        transform: scale(1) translateY(0);
        letter-spacing: 2px; /* Settles into brand standard */
        border-color: rgba(158, 119, 31, 0.8);
    }
}

/* 2. APPLY TO BUTTON WIDGET */
.elementor-183 .elementor-element.elementor-element-3588ce1 .elementor-button {
    opacity: 0;
    animation: arqaButtonEntrance 1.4s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
    animation-delay: 0.8s; /* Appears last in the sequence */
    
    /* Ensure the gold border is jewelry-thin */
    border: 1px solid #9E771F !important;
    background-color: transparent !important;
    transition: all 0.4s ease-in-out !important;
}

/* 3. MODERN HOVER INTERACTION */
.elementor-183 .elementor-element.elementor-element-3588ce1 .elementor-button:hover {
    background-color: #9E771F !important;
    color: #ffffff !important;
    box-shadow: 0 0 20px rgba(158, 119, 31, 0.4) !important;
    transform: translateY(-3px) !important;
}/* End custom CSS */
/* Start custom CSS for image, class: .elementor-element-48e8848 *//* Target the specific image inside the Elementor widget */
.elementor-183 .elementor-element.elementor-element-48e8848 img {
    /* Architectural 8px rounded corners for a modern feel */
    border-radius: 8px !important;
    
    /* Jewelry-thin gold border */
    border: 1px solid rgba(158, 119, 31, 0.25) !important;
    
    /* Deep, soft shadow to mimic a floating gallery canvas */
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.6) !important;
    
    /* High-end smooth transition */
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1) !important;
    
    /* Subtle cinematic filter */
    filter: brightness(0.95) contrast(1.05) saturate(1.1);
}

/* Hover Effect: The "Gallery Spotlight" */
.elementor-183 .elementor-element.elementor-element-48e8848:hover img {
    /* Subtle lift and scale */
    transform: translateY(-12px) scale(1.03) !important;
    
    /* Brighter, glowing gold border on hover */
    border: 1px solid rgba(158, 119, 31, 0.6) !important;
    
    /* Intensified shadow with a hint of gold glow */
    box-shadow: 0 40px 70px -15px rgba(0, 0, 0, 0.7), 
                0 0 20px rgba(158, 119, 31, 0.15) !important;
    
    /* Simulate a spotlight hit */
    filter: brightness(1.05) contrast(1.1) saturate(1.1) !important;
}



/* 1. THE MODERN CINEMATIC KEYFRAMES */
@keyframes arqaModernImageReveal {
    0% {
        opacity: 0;
        transform: scale(1.08) translateY(20px);
        filter: blur(20px) brightness(0.6) contrast(1.2);
    }
    100% {
        opacity: 1;
        transform: scale(1) translateY(0);
        filter: blur(0px) brightness(1) contrast(1);
    }
}

/* 2. APPLY TO THE IMAGE */
.elementor-183 .elementor-element.elementor-element-48e8848 img {
    opacity: 0;
    /* Longer duration (1.8s) for a high-end "heavy" feel */
    animation: arqaModernImageReveal 1.8s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
    animation-delay: 0.4s;
    
    /* Premium Framing matching the gold theme */
    border-radius: 12px !important;
    border: 1px solid rgba(158, 119, 31, 0.3) !important;
    box-shadow: 0 40px 80px rgba(0, 0, 0, 0.6) !important;
    
    will-change: transform, filter, opacity;
}

/* 3. SUBTLE HOVER GLOW */
.elementor-183 .elementor-element.elementor-element-48e8848:hover img {
    transform: scale(1.02) !important;
    border-color: rgba(158, 119, 31, 0.8) !important;
    box-shadow: 0 50px 100px rgba(0, 0, 0, 0.7), 
                0 0 30px rgba(158, 119, 31, 0.2) !important;
    transition: all 0.8s cubic-bezier(0.2, 1, 0.3, 1) !important;
}/* End custom CSS */
/* Start custom CSS for counter, class: .elementor-element-44bce57 *//* 1. THE NUMBERS - (Retaining your thin style - UNTOUCHED) */
.elementor-183 .elementor-element.elementor-element-44bce57 .elementor-counter-number-wrapper {
    display: flex !important;
    justify-content: center !important;
    align-items: baseline !important;
    line-height: 0.8 !important;
    margin-bottom: -5px !important;
}

.elementor-183 .elementor-element.elementor-element-44bce57 .elementor-counter-number {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 200 !important;
    letter-spacing: -3px !important;
}

/* 2. THE SYMBOLS - (UNTOUCHED) */
.elementor-183 .elementor-element.elementor-element-44bce57 .elementor-counter-number-suffix {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 200 !important;
    margin-left: 4px !important;
    font-size: 0.6em !important;
}

/* 3. THE LABELS - GOLD TEXT CENTERED & RESPONSIVE */
.elementor-183 .elementor-element.elementor-element-44bce57 .elementor-counter-title {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important; 
    text-transform: uppercase !important;
    color: #9E771F !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
    line-height: 1.2 !important;
    
    /* FIX: Ensures text stays centered even if it wraps */
    text-align: center !important;
    display: block !important;
    width: 100% !important;

    /* RESPONSIVE FIX: Scales text and spacing to prevent overlap */
    font-size: clamp(8px, 1.1vw, 11px) !important;
    letter-spacing: clamp(2px, 0.5vw, 6px) !important;

    /* THE GLOW - (UNTOUCHED) */
    text-shadow: 0px 0px 8px rgba(158, 119, 31, 0.6) !important;
    filter: brightness(1.2) contrast(1.1) !important;
}

/* 4. THE BACKGROUND - (UNTOUCHED) */
.elementor-183 .elementor-element.elementor-element-44bce57 .elementor-widget-container {
    background: radial-gradient(circle, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0) 70%) !important;
    backdrop-filter: blur(8px);
    padding: 30px 20px !important;
    
    border-top: 2px solid #9E771F !important;
    box-shadow: inset 0px 10px 20px rgba(158, 119, 31, 0.05);
}/* End custom CSS */
/* Start custom CSS for counter, class: .elementor-element-ca38d6e *//* 1. THE NUMBERS - (Retaining your thin style - UNTOUCHED) */
.elementor-183 .elementor-element.elementor-element-ca38d6e .elementor-counter-number-wrapper {
    display: flex !important;
    justify-content: center !important;
    align-items: baseline !important;
    line-height: 0.8 !important;
    margin-bottom: -5px !important;
}

.elementor-183 .elementor-element.elementor-element-ca38d6e .elementor-counter-number {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 200 !important;
    letter-spacing: -3px !important;
}

/* 2. THE SYMBOLS - (UNTOUCHED) */
.elementor-183 .elementor-element.elementor-element-ca38d6e .elementor-counter-number-suffix {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 200 !important;
    margin-left: 4px !important;
    font-size: 0.6em !important;
}

/* 3. THE LABELS - GOLD TEXT CENTERED & RESPONSIVE */
.elementor-183 .elementor-element.elementor-element-ca38d6e .elementor-counter-title {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important; 
    text-transform: uppercase !important;
    color: #9E771F !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
    line-height: 1.2 !important;
    
    /* FIX: Ensures text stays centered even if it wraps */
    text-align: center !important;
    display: block !important;
    width: 100% !important;

    /* RESPONSIVE FIX: Scales text and spacing to prevent overlap */
    font-size: clamp(8px, 1.1vw, 11px) !important;
    letter-spacing: clamp(2px, 0.5vw, 6px) !important;

    /* THE GLOW - (UNTOUCHED) */
    text-shadow: 0px 0px 8px rgba(158, 119, 31, 0.6) !important;
    filter: brightness(1.2) contrast(1.1) !important;
}

/* 4. THE BACKGROUND - (UNTOUCHED) */
.elementor-183 .elementor-element.elementor-element-ca38d6e .elementor-widget-container {
    background: radial-gradient(circle, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0) 70%) !important;
    backdrop-filter: blur(8px);
    padding: 30px 20px !important;
    
    border-top: 2px solid #9E771F !important;
    box-shadow: inset 0px 10px 20px rgba(158, 119, 31, 0.05);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-8f9a290 *//* 1. COUNTER ENTRANCE KEYFRAMES */
@keyframes arqaCounterFade {
    0% {
        opacity: 0;
        transform: translateY(20px);
        filter: blur(5px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
        filter: blur(0px);
    }
}

@keyframes arqaSubtextReveal {
    0% {
        opacity: 0;
        letter-spacing: 8px;
        transform: scaleX(0.8);
    }
    100% {
        opacity: 1;
        letter-spacing: 2px; /* Matches brand spacing */
        transform: scaleX(1);
    }
}

/* 2. TARGET THE MAIN NUMBER */
.elementor-183 .elementor-element.elementor-element-8f9a290 .elementor-counter-number-wrapper {
    opacity: 0;
    animation: arqaCounterFade 1.2s cubic-bezier(0.22, 1, 0.36, 1) forwards;
    animation-delay: 1s; /* Triggers after the image starts */
}

/* 3. TARGET THE GOLD SUBTEXT */
.elementor-183 .elementor-element.elementor-element-8f9a290 .elementor-counter-title {
    opacity: 0;
    color: #9E771F !important; /* Arqa Gold */
    text-transform: uppercase;
    font-weight: 600;
    animation: arqaSubtextReveal 1.5s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
    animation-delay: 1.3s; /* Staggered for hierarchy */
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-8fa1af5 *//* 1. THE REVEAL KEYFRAMES */
@keyframes arqaSlideDown {
    0% {
        opacity: 0;
        transform: translateY(-40px);
        filter: blur(10px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
        filter: blur(0px);
    }
}

@keyframes arqaSlideUp {
    0% {
        opacity: 0;
        transform: translateY(40px);
        filter: blur(10px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
        filter: blur(0px);
    }
}

/* 2. MAIN TITLE (Slide Down) */
#zf36r1 h3 {
    opacity: 0;
    animation: arqaSlideDown 1.5s cubic-bezier(0.19, 1, 0.22, 1) forwards;
    animation-delay: 0.2s;
}

/* 3. GOLD SUBTITLE (Slide Up) */
#zf36r1 h3 span {
    display: inline-block;
    opacity: 0;
    animation: arqaSlideUp 1.5s cubic-bezier(0.19, 1, 0.22, 1) forwards;
    animation-delay: 0.5s; /* Staggered to appear second */
}

/* 4. DESCRIPTION TEXT (Slide Up) */
#zWQS2e p {
    opacity: 0;
    animation: arqaSlideUp 1.5s cubic-bezier(0.19, 1, 0.22, 1) forwards;
    animation-delay: 0.8s; /* Appears last for hierarchy */
}

/* 5. SEPARATOR LINE REVEAL */
#zWQS2e {
    border-top: 1px solid rgba(255,255,255,0) !important;
    position: relative;
}

#zWQS2e::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(158, 119, 31, 0.5), transparent);
    animation: lineExtend 1.2s ease-out forwards;
    animation-delay: 0.7s;
}

@keyframes lineExtend {
    0% { width: 0; }
    100% { width: 100%; }
}/* End custom CSS */
/* Start custom CSS for image, class: .elementor-element-897c43b *//* 1. THE GALLERY ENTRANCE KEYFRAMES */
@keyframes arqaGalleryReveal {
    0% {
        opacity: 0;
        transform: translateY(40px) scale(0.96);
        filter: brightness(0.4) blur(12px);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
        filter: brightness(1) blur(0px);
    }
}

/* 2. IMAGE BASE STATE & ANIMATION */
.elementor-183 .elementor-element.elementor-element-897c43b img {
    opacity: 0; /* Keeps image hidden until animation starts */
    border-radius: 8px !important;
    border: 1px solid rgba(158, 119, 31, 0.25) !important;
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.5) !important;
    
    /* Premium smooth reveal */
    animation: arqaGalleryReveal 1.6s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
    animation-delay: 0.2s;
    
    will-change: transform, opacity, filter;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* 3. HOVER SPOTLIGHT EFFECT */
.elementor-183 .elementor-element.elementor-element-897c43b:hover img {
    transform: translateY(-10px) scale(1.03) !important;
    border-color: rgba(158, 119, 31, 0.7) !important;
    box-shadow: 0 35px 70px rgba(0, 0, 0, 0.7), 
                0 0 20px rgba(158, 119, 31, 0.2) !important;
    filter: brightness(1.1) contrast(1.05) !important;
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-1d3c216 *//* --- MODERN GALLERY BUTTON STYLING --- */

.elementor-183 .elementor-element.elementor-element-1d3c216 .elementor-button {
    background-color: transparent !important; /* Removes the heavy grey */
    border: 1px solid rgba(255, 255, 255, 0.4) !important; /* Thin, elegant border */
    color: #ffffff !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: 3px !important; /* Matches your luxury headers */
    font-size: 13px !important;
    padding: 15px 35px !important; /* Modern, elongated shape */
    transition: all 0.4s ease-in-out !important;
    border-radius: 0px !important; /* Sharp corners for a premium feel */
}

/* --- HOVER STATE: ARQA GOLD REVEAL --- */

.elementor-183 .elementor-element.elementor-element-1d3c216 .elementor-button:hover {
    background-color: #9E771F !important; /* Arqa Gold */
    border-color: #9E771F !important;
    color: #ffffff !important;
    letter-spacing: 5px !important; /* Subtle expansion effect */
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
    transform: translateY(-3px); /* Subtle lift */
}


/* 1. BUTTON ENTRANCE KEYFRAMES */
@keyframes arqaButtonEntrance {
    0% {
        opacity: 0;
        transform: scale(0.9) translateY(20px);
        letter-spacing: 10px; /* Dramatic wide start */
        border-color: rgba(158, 119, 31, 0);
    }
    100% {
        opacity: 1;
        transform: scale(1) translateY(0);
        letter-spacing: 2px; /* Settles into brand standard */
        border-color: rgba(158, 119, 31, 0.8);
    }
}

/* 2. APPLY TO BUTTON WIDGET */
.elementor-183 .elementor-element.elementor-element-1d3c216 .elementor-button {
    opacity: 0;
    animation: arqaButtonEntrance 1.4s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
    animation-delay: 0.8s; /* Appears last in the sequence */
    
    /* Ensure the gold border is jewelry-thin */
    border: 1px solid #9E771F !important;
    background-color: transparent !important;
    transition: all 0.4s ease-in-out !important;
}

/* 3. MODERN HOVER INTERACTION */
.elementor-183 .elementor-element.elementor-element-1d3c216 .elementor-button:hover {
    background-color: #9E771F !important;
    color: #ffffff !important;
    box-shadow: 0 0 20px rgba(158, 119, 31, 0.4) !important;
    transform: translateY(-3px) !important;
}/* End custom CSS */
/* Start custom CSS for image, class: .elementor-element-5a6486c *//* 1. THE GALLERY ENTRANCE KEYFRAMES */
@keyframes arqaGalleryReveal {
    0% {
        opacity: 0;
        transform: translateY(40px) scale(0.96);
        filter: brightness(0.4) blur(12px);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
        filter: brightness(1) blur(0px);
    }
}

/* 2. IMAGE BASE STATE & ANIMATION */
.elementor-183 .elementor-element.elementor-element-5a6486c img {
    opacity: 0; /* Keeps image hidden until animation starts */
    border-radius: 8px !important;
    border: 1px solid rgba(158, 119, 31, 0.25) !important;
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.5) !important;
    
    /* Premium smooth reveal */
    animation: arqaGalleryReveal 1.6s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
    animation-delay: 0.2s;
    
    will-change: transform, opacity, filter;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* 3. HOVER SPOTLIGHT EFFECT */
.elementor-183 .elementor-element.elementor-element-5a6486c:hover img {
    transform: translateY(-10px) scale(1.03) !important;
    border-color: rgba(158, 119, 31, 0.7) !important;
    box-shadow: 0 35px 70px rgba(0, 0, 0, 0.7), 
                0 0 20px rgba(158, 119, 31, 0.2) !important;
    filter: brightness(1.1) contrast(1.05) !important;
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-fd78040 *//* --- MODERN GALLERY BUTTON STYLING --- */

.elementor-183 .elementor-element.elementor-element-fd78040 .elementor-button {
    background-color: transparent !important; /* Removes the heavy grey */
    border: 1px solid rgba(255, 255, 255, 0.4) !important; /* Thin, elegant border */
    color: #ffffff !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: 3px !important; /* Matches your luxury headers */
    font-size: 13px !important;
    padding: 15px 35px !important; /* Modern, elongated shape */
    transition: all 0.4s ease-in-out !important;
    border-radius: 0px !important; /* Sharp corners for a premium feel */
}

/* --- HOVER STATE: ARQA GOLD REVEAL --- */

.elementor-183 .elementor-element.elementor-element-fd78040 .elementor-button:hover {
    background-color: #9E771F !important; /* Arqa Gold */
    border-color: #9E771F !important;
    color: #ffffff !important;
    letter-spacing: 5px !important; /* Subtle expansion effect */
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
    transform: translateY(-3px); /* Subtle lift */
}


/* 1. BUTTON ENTRANCE KEYFRAMES */
@keyframes arqaButtonEntrance {
    0% {
        opacity: 0;
        transform: scale(0.9) translateY(20px);
        letter-spacing: 10px; /* Dramatic wide start */
        border-color: rgba(158, 119, 31, 0);
    }
    100% {
        opacity: 1;
        transform: scale(1) translateY(0);
        letter-spacing: 2px; /* Settles into brand standard */
        border-color: rgba(158, 119, 31, 0.8);
    }
}

/* 2. APPLY TO BUTTON WIDGET */
.elementor-183 .elementor-element.elementor-element-fd78040 .elementor-button {
    opacity: 0;
    animation: arqaButtonEntrance 1.4s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
    animation-delay: 0.8s; /* Appears last in the sequence */
    
    /* Ensure the gold border is jewelry-thin */
    border: 1px solid #9E771F !important;
    background-color: transparent !important;
    transition: all 0.4s ease-in-out !important;
}

/* 3. MODERN HOVER INTERACTION */
.elementor-183 .elementor-element.elementor-element-fd78040 .elementor-button:hover {
    background-color: #9E771F !important;
    color: #ffffff !important;
    box-shadow: 0 0 20px rgba(158, 119, 31, 0.4) !important;
    transform: translateY(-3px) !important;
}/* End custom CSS */
/* Start custom CSS for image, class: .elementor-element-d23b267 *//* 1. THE GALLERY ENTRANCE KEYFRAMES */
@keyframes arqaGalleryReveal {
    0% {
        opacity: 0;
        transform: translateY(40px) scale(0.96);
        filter: brightness(0.4) blur(12px);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
        filter: brightness(1) blur(0px);
    }
}

/* 2. IMAGE BASE STATE & ANIMATION */
.elementor-183 .elementor-element.elementor-element-d23b267 img {
    opacity: 0; /* Keeps image hidden until animation starts */
    border-radius: 8px !important;
    border: 1px solid rgba(158, 119, 31, 0.25) !important;
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.5) !important;
    
    /* Premium smooth reveal */
    animation: arqaGalleryReveal 1.6s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
    animation-delay: 0.2s;
    
    will-change: transform, opacity, filter;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* 3. HOVER SPOTLIGHT EFFECT */
.elementor-183 .elementor-element.elementor-element-d23b267:hover img {
    transform: translateY(-10px) scale(1.03) !important;
    border-color: rgba(158, 119, 31, 0.7) !important;
    box-shadow: 0 35px 70px rgba(0, 0, 0, 0.7), 
                0 0 20px rgba(158, 119, 31, 0.2) !important;
    filter: brightness(1.1) contrast(1.05) !important;
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-de3baa7 *//* --- MODERN GALLERY BUTTON STYLING --- */

.elementor-183 .elementor-element.elementor-element-de3baa7 .elementor-button {
    background-color: transparent !important; /* Removes the heavy grey */
    border: 1px solid rgba(255, 255, 255, 0.4) !important; /* Thin, elegant border */
    color: #ffffff !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: 3px !important; /* Matches your luxury headers */
    font-size: 13px !important;
    padding: 15px 35px !important; /* Modern, elongated shape */
    transition: all 0.4s ease-in-out !important;
    border-radius: 0px !important; /* Sharp corners for a premium feel */
}

/* --- HOVER STATE: ARQA GOLD REVEAL --- */

.elementor-183 .elementor-element.elementor-element-de3baa7 .elementor-button:hover {
    background-color: #9E771F !important; /* Arqa Gold */
    border-color: #9E771F !important;
    color: #ffffff !important;
    letter-spacing: 5px !important; /* Subtle expansion effect */
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
    transform: translateY(-3px); /* Subtle lift */
}


/* 1. BUTTON ENTRANCE KEYFRAMES */
@keyframes arqaButtonEntrance {
    0% {
        opacity: 0;
        transform: scale(0.9) translateY(20px);
        letter-spacing: 10px; /* Dramatic wide start */
        border-color: rgba(158, 119, 31, 0);
    }
    100% {
        opacity: 1;
        transform: scale(1) translateY(0);
        letter-spacing: 2px; /* Settles into brand standard */
        border-color: rgba(158, 119, 31, 0.8);
    }
}

/* 2. APPLY TO BUTTON WIDGET */
.elementor-183 .elementor-element.elementor-element-de3baa7 .elementor-button {
    opacity: 0;
    animation: arqaButtonEntrance 1.4s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
    animation-delay: 0.8s; /* Appears last in the sequence */
    
    /* Ensure the gold border is jewelry-thin */
    border: 1px solid #9E771F !important;
    background-color: transparent !important;
    transition: all 0.4s ease-in-out !important;
}

/* 3. MODERN HOVER INTERACTION */
.elementor-183 .elementor-element.elementor-element-de3baa7 .elementor-button:hover {
    background-color: #9E771F !important;
    color: #ffffff !important;
    box-shadow: 0 0 20px rgba(158, 119, 31, 0.4) !important;
    transform: translateY(-3px) !important;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-f0eded7 *//* SYMMETRICAL MODERN GRADIENT - EMPHASIZED DARK CENTER */
.elementor-183 .elementor-element.elementor-element-f0eded7 {
    /* 10% Green at start, wide 80% Dark middle, 10% Green at end */
    background: linear-gradient(to bottom, 
        #1C471B 0%, 
        #121212 10%, 
        #121212 90%, 
        #1C471B 100%
    ) !important;
    
    border: none !important;
    margin: 0 !important;
    padding-top: 80px !important;
    padding-bottom: 80px !important;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-eaa3447 *//* 1. THE REVEAL KEYFRAMES (Slide Down/Up + Blur) */
@keyframes arqaSlideDown {
    0% {
        opacity: 0;
        transform: translateY(-40px);
        filter: blur(10px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
        filter: blur(0px);
    }
}

@keyframes arqaSlideUp {
    0% {
        opacity: 0;
        transform: translateY(40px);
        filter: blur(10px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
        filter: blur(0px);
    }
}

/* 2. TARGET THE MAIN TITLE "Connect with Us" (Slide Down) */
.elementor-183 .elementor-element.elementor-element-eaa3447 h1 {
    opacity: 0;
    animation: arqaSlideDown 1.5s cubic-bezier(0.19, 1, 0.22, 1) forwards;
    animation-delay: 0.2s;
    will-change: transform, opacity;
}

/* 3. TARGET THE GOLD SUBTITLE (Slide Up) */
.elementor-183 .elementor-element.elementor-element-eaa3447 h1 span {
    display: block !important; /* Matches your HTML structure */
    opacity: 0;
    animation: arqaSlideUp 1.5s cubic-bezier(0.19, 1, 0.22, 1) forwards;
    animation-delay: 0.5s; /* Staggered to appear second */
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-e7430bf *//* 1. THE ENTRANCE KEYFRAMES */
@keyframes arqaFormFade {
    0% {
        opacity: 0;
        transform: translateY(30px);
        filter: blur(10px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
        filter: blur(0px);
    }
}

/* 2. THE MAIN FORM CONTAINER & 2-COLUMN LOCK */
.elementor-183 .elementor-element.elementor-element-e7430bf .fluentform {
    opacity: 0;
    animation: arqaFormFade 1.2s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
    animation-delay: 0.3s;
}

/* FORCE 2 COLUMNS - Targets the row container */
.elementor-183 .elementor-element.elementor-element-e7430bf .ff-t-container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important; /* Prevents stacking into 1 column */
    gap: 20px !important; /* Spacing between columns */
}

/* Ensure columns take up 50% width */
.elementor-183 .elementor-element.elementor-element-e7430bf .ff-t-column {
    width: 50% !important;
}

/* 3. STAGGERED ENTRANCE FOR FORM ELEMENTS */
.elementor-183 .elementor-element.elementor-element-e7430bf .ff-el-group {
    opacity: 0;
    animation: arqaFormFade 1s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}

/* Staggered Delays for a "Wave" effect */
.elementor-183 .elementor-element.elementor-element-e7430bf .ff-el-group:nth-child(1) { animation-delay: 0.5s; }
.elementor-183 .elementor-element.elementor-element-e7430bf .ff-el-group:nth-child(2) { animation-delay: 0.6s; }
.elementor-183 .elementor-element.elementor-element-e7430bf .ff-el-group:nth-child(3) { animation-delay: 0.7s; }
.elementor-183 .elementor-element.elementor-element-e7430bf .ff-el-group:nth-child(4) { animation-delay: 0.8s; }

/* 4. THE SUBMIT BUTTON SPOTLIGHT */
.elementor-183 .elementor-element.elementor-element-e7430bf .ff-btn-submit {
    opacity: 0;
    animation: arqaFormFade 1.2s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
    animation-delay: 1s; 
    
    border: 1px solid #9E771F !important;
    background: transparent !important;
    color: #9E771F !important;
    transition: all 0.4s ease !important;
    letter-spacing: 2px;
    text-transform: uppercase;
    width: 100% !important; /* Makes button span full width */
}

.elementor-183 .elementor-element.elementor-element-e7430bf .ff-btn-submit:hover {
    background: #9E771F !important;
    color: #ffffff !important;
    box-shadow: 0 0 20px rgba(158, 119, 31, 0.4) !important;
    transform: translateY(-3px);
}/* End custom CSS */
/* Start custom CSS for social-icons, class: .elementor-element-b6c4453 *//* 1. THE CONTAINER SPACING */
.elementor-183 .elementor-element.elementor-element-b6c4453 {
    /* Side padding to give icons breathing room from edges */
    padding-left: 30px !important;
    padding-right: 30px !important;
    /* Bottom margin to separate icons from the next section */
    margin-bottom: 50px !important;
    text-align: center; /* Ensures icons stay centered while padded */
}

/* 2. THE BUTTON BASE */
.elementor-183 .elementor-element.elementor-element-b6c4453 .elementor-social-icon {
    background-color: transparent !important;
    border: 1px solid rgba(158, 119, 31, 0.25) !important;
    border-radius: 8px !important;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.4) !important;
    
    /* Animation Timing */
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1) !important;
    
    padding: 12px !important;
    display: inline-flex !important;
    /* Margin BETWEEN the buttons */
    margin: 10px !important; 
}

/* 3. THE ICON GLYPH */
.elementor-183 .elementor-element.elementor-element-b6c4453 .elementor-social-icon i,
.elementor-183 .elementor-element.elementor-element-b6c4453 .elementor-social-icon svg {
    color: #ffffff !important;
    fill: #ffffff !important;
    width: 22px !important;
    height: 22px !important;
    transition: all 0.4s ease !important;
    filter: brightness(0.9) contrast(1.1);
}

/* 4. THE ANIMATION (HOVER) */
.elementor-183 .elementor-element.elementor-element-b6c4453 .elementor-social-icon:hover {
    /* The "Lift" effect */
    transform: translateY(-10px) scale(1.1) !important;
    
    border: 1px solid rgba(158, 119, 31, 0.8) !important;
    box-shadow: 0 20px 35px rgba(0, 0, 0, 0.6), 
                0 0 15px rgba(158, 119, 31, 0.3) !important;
    background-color: rgba(158, 119, 31, 0.05) !important;
}

/* 5. ICON SPOTLIGHT */
.elementor-183 .elementor-element.elementor-element-b6c4453 .elementor-social-icon:hover i,
.elementor-183 .elementor-element.elementor-element-b6c4453 .elementor-social-icon:hover svg {
    color: #9E771F !important;
    fill: #9E771F !important;
    filter: brightness(1.2) drop-shadow(0 0 5px rgba(158, 119, 31, 0.4)) !important;
}


/* 1. THE REVEAL KEYFRAMES */
@keyframes arqaIconReveal {
    0% {
        opacity: 0;
        transform: translateY(30px) scale(0.8);
        filter: brightness(0) blur(10px);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
        filter: brightness(1) blur(0px);
    }
}

/* 2. BASE STATE & ENTRANCE */
.elementor-183 .elementor-element.elementor-element-b6c4453 .elementor-social-icon {
    opacity: 0;
    animation: arqaIconReveal 1.2s cubic-bezier(0.2, 1, 0.3, 1) forwards;
    animation-delay: 0.5s; /* Triggers after main section text */
    
    /* Architectural styling */
    background-color: transparent !important;
    border: 1px solid rgba(158, 119, 31, 0.25) !important;
    border-radius: 12px !important;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* 3. MODERN HOVER INTERACTION */
.elementor-183 .elementor-element.elementor-element-b6c4453 .elementor-social-icon:hover {
    transform: translateY(-8px) scale(1.1) !important;
    border-color: rgba(158, 119, 31, 0.8) !important;
    background-color: rgba(158, 119, 31, 0.05) !important;
    
    /* Arqa Gold Glow */
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.6), 
                0 0 15px rgba(158, 119, 31, 0.3) !important;
}

/* 4. ICON GLYPH SPOTLIGHT */
.elementor-183 .elementor-element.elementor-element-b6c4453 .elementor-social-icon:hover i,
.elementor-183 .elementor-element.elementor-element-b6c4453 .elementor-social-icon:hover svg {
    color: #9E771F !important;
    fill: #9E771F !important;
    filter: brightness(1.2) drop-shadow(0 0 5px rgba(158, 119, 31, 0.4)) !important;
}/* End custom CSS */
/* Start custom CSS for image, class: .elementor-element-18b2542 *//* Target the specific image inside the Elementor widget */
.elementor-183 .elementor-element.elementor-element-18b2542 img {
    /* Architectural 8px rounded corners for a modern feel */
    border-radius: 8px !important;
    
    /* Jewelry-thin gold border */
    border: 1px solid rgba(158, 119, 31, 0.25) !important;
    
    /* Deep, soft shadow to mimic a floating gallery canvas */
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.6) !important;
    
    /* High-end smooth transition */
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1) !important;
    
    /* Subtle cinematic filter */
    filter: brightness(0.95) contrast(1.05) saturate(1.1);
}

/* Hover Effect: The "Gallery Spotlight" */
.elementor-183 .elementor-element.elementor-element-18b2542:hover img {
    /* Subtle lift and scale */
    transform: translateY(-12px) scale(1.03) !important;
    
    /* Brighter, glowing gold border on hover */
    border: 1px solid rgba(158, 119, 31, 0.6) !important;
    
    /* Intensified shadow with a hint of gold glow */
    box-shadow: 0 40px 70px -15px rgba(0, 0, 0, 0.7), 
                0 0 20px rgba(158, 119, 31, 0.15) !important;
    
    /* Simulate a spotlight hit */
    filter: brightness(1.05) contrast(1.1) saturate(1.1) !important;
}



/* 1. THE MODERN CINEMATIC KEYFRAMES */
@keyframes arqaModernImageReveal {
    0% {
        opacity: 0;
        transform: scale(1.08) translateY(20px);
        filter: blur(20px) brightness(0.6) contrast(1.2);
    }
    100% {
        opacity: 1;
        transform: scale(1) translateY(0);
        filter: blur(0px) brightness(1) contrast(1);
    }
}

/* 2. APPLY TO THE IMAGE */
.elementor-183 .elementor-element.elementor-element-18b2542 img {
    opacity: 0;
    /* Longer duration (1.8s) for a high-end "heavy" feel */
    animation: arqaModernImageReveal 1.8s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
    animation-delay: 0.4s;
    
    /* Premium Framing matching the gold theme */
    border-radius: 12px !important;
    border: 1px solid rgba(158, 119, 31, 0.3) !important;
    box-shadow: 0 40px 80px rgba(0, 0, 0, 0.6) !important;
    
    will-change: transform, filter, opacity;
}

/* 3. SUBTLE HOVER GLOW */
.elementor-183 .elementor-element.elementor-element-18b2542:hover img {
    transform: scale(1.02) !important;
    border-color: rgba(158, 119, 31, 0.8) !important;
    box-shadow: 0 50px 100px rgba(0, 0, 0, 0.7), 
                0 0 30px rgba(158, 119, 31, 0.2) !important;
    transition: all 0.8s cubic-bezier(0.2, 1, 0.3, 1) !important;
}/* End custom CSS */