.elementor-446 .elementor-element.elementor-element-9cfface{--display:grid;--e-con-grid-template-columns:repeat(1, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-446 .elementor-element.elementor-element-9cfface:not(.elementor-motion-effects-element-type-background), .elementor-446 .elementor-element.elementor-element-9cfface > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#1C471B;}.elementor-446 .elementor-element.elementor-element-eb90af2{margin:50px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-446 .elementor-element.elementor-element-1fb24f2{--display:grid;--e-con-grid-template-columns:repeat(2, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-446 .elementor-element.elementor-element-1fb24f2:not(.elementor-motion-effects-element-type-background), .elementor-446 .elementor-element.elementor-element-1fb24f2 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:linear-gradient(180deg, #1C471B 0%, #4E4E4E 100%);}.elementor-446 .elementor-element.elementor-element-59f9417.elementor-element{--align-self:center;}.elementor-446 .elementor-element.elementor-element-4d3e313{--display:flex;}.elementor-446 .elementor-element.elementor-element-0ca0f9e.elementor-element{--align-self:center;}.elementor-446 .elementor-element.elementor-element-dc91759{--display:grid;--e-con-grid-template-columns:repeat(2, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-446 .elementor-element.elementor-element-dc91759:not(.elementor-motion-effects-element-type-background), .elementor-446 .elementor-element.elementor-element-dc91759 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:linear-gradient(180deg, #4E4E4E 0%, #1C471B 100%);}.elementor-446 .elementor-element.elementor-element-b5ce434{--display:flex;}.elementor-446 .elementor-element.elementor-element-30eac46.elementor-element{--align-self:center;}.elementor-446 .elementor-element.elementor-element-f7e4e89.elementor-element{--align-self:center;}:root{--page-title-display:none;}@media(max-width:1024px){.elementor-446 .elementor-element.elementor-element-9cfface{--grid-auto-flow:row;}.elementor-446 .elementor-element.elementor-element-1fb24f2{--grid-auto-flow:row;}.elementor-446 .elementor-element.elementor-element-dc91759{--grid-auto-flow:row;}}@media(max-width:767px){.elementor-446 .elementor-element.elementor-element-9cfface{--e-con-grid-template-columns:repeat(1, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-446 .elementor-element.elementor-element-1fb24f2{--e-con-grid-template-columns:repeat(1, 1fr);--e-con-grid-template-rows:repeat(2, 1fr);--grid-auto-flow:row;}.elementor-446 .elementor-element.elementor-element-dc91759{--e-con-grid-template-columns:repeat(1, 1fr);--e-con-grid-template-rows:repeat(2, 1fr);--grid-auto-flow:row;}}/* Start custom CSS for html, class: .elementor-element-eb90af2 *//* 1. THE GOLD LINE - Quick Architectural Draw */ .elementor-446 .elementor-element.elementor-element-eb90af2 div > div:first-of-type { animation: arqaLine 0.8s cubic-bezier(0.19, 1, 0.22, 1) both; } /* 2. THE MAIN TITLE - Elegant Expansion */ .elementor-446 .elementor-element.elementor-element-eb90af2 h1 { animation: arqaTitle 1s cubic-bezier(0.19, 1, 0.22, 1) 0.2s both; transform-origin: center; } /* 3. THE BODY TEXT - Sophisticated Focus */ .elementor-446 .elementor-element.elementor-element-eb90af2 p { animation: arqaBody 1.2s ease-out 0.5s both; } /* --- THE KEYFRAMES (Visible by Default) --- */ @keyframes arqaLine { 0% { transform: scaleX(0); opacity: 0; } 100% { transform: scaleX(1); opacity: 1; } } @keyframes arqaTitle { 0% { opacity: 0; transform: translateY(20px) scale(0.98); letter-spacing: 0.1em; } 100% { opacity: 1; transform: translateY(0) scale(1); letter-spacing: -0.05em; } } @keyframes arqaBody { 0% { opacity: 0; filter: blur(10px); transform: translateY(10px); } 100% { opacity: 0.9; filter: blur(0); transform: translateY(0); } }/* 1. THE GOLD LINE - Quick Architectural Draw */ .elementor-446 .elementor-element.elementor-element-eb90af2 div > div:first-of-type { animation: arqaLine 0.8s cubic-bezier(0.19, 1, 0.22, 1) both; } /* 2. THE MAIN TITLE - Elegant Expansion */ .elementor-446 .elementor-element.elementor-element-eb90af2 h1 { animation: arqaTitle 1s cubic-bezier(0.19, 1, 0.22, 1) 0.2s both; transform-origin: center; } /* 3. THE BODY TEXT - Sophisticated Focus */ .elementor-446 .elementor-element.elementor-element-eb90af2 p { animation: arqaBody 1.2s ease-out 0.5s both; } /* --- THE KEYFRAMES (Visible by Default) --- */ @keyframes arqaLine { 0% { transform: scaleX(0); opacity: 0; } 100% { transform: scaleX(1); opacity: 1; } } @keyframes arqaTitle { 0% { opacity: 0; transform: translateY(20px) scale(0.98); letter-spacing: 0.1em; } 100% { opacity: 1; transform: translateY(0) scale(1); letter-spacing: -0.05em; } } @keyframes arqaBody { 0% { opacity: 0; filter: blur(10px); transform: translateY(10px); } 100% { opacity: 0.9; filter: blur(0); transform: translateY(0); } }/* End custom CSS */ /* Start custom CSS for image, class: .elementor-element-59f9417 *//* Target the specific image inside the Elementor widget */ .elementor-446 .elementor-element.elementor-element-59f9417 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-446 .elementor-element.elementor-element-59f9417: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-446 .elementor-element.elementor-element-59f9417 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-446 .elementor-element.elementor-element-59f9417: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; }/* Target the specific image inside the Elementor widget */ .elementor-446 .elementor-element.elementor-element-59f9417 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-446 .elementor-element.elementor-element-59f9417: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-446 .elementor-element.elementor-element-59f9417 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-446 .elementor-element.elementor-element-59f9417: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 button, class: .elementor-element-0ca0f9e *//* --- MODERN GALLERY BUTTON STYLING --- */ .elementor-446 .elementor-element.elementor-element-0ca0f9e .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-446 .elementor-element.elementor-element-0ca0f9e .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-446 .elementor-element.elementor-element-0ca0f9e .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-446 .elementor-element.elementor-element-0ca0f9e .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 button, class: .elementor-element-30eac46 *//* --- MODERN GALLERY BUTTON STYLING --- */ .elementor-446 .elementor-element.elementor-element-30eac46 .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-446 .elementor-element.elementor-element-30eac46 .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-446 .elementor-element.elementor-element-30eac46 .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-446 .elementor-element.elementor-element-30eac46 .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-f7e4e89 *//* Target the specific image inside the Elementor widget */ .elementor-446 .elementor-element.elementor-element-f7e4e89 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-446 .elementor-element.elementor-element-f7e4e89: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-446 .elementor-element.elementor-element-f7e4e89 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-446 .elementor-element.elementor-element-f7e4e89: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; }/* Target the specific image inside the Elementor widget */ .elementor-446 .elementor-element.elementor-element-f7e4e89 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-446 .elementor-element.elementor-element-f7e4e89: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-446 .elementor-element.elementor-element-f7e4e89 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-446 .elementor-element.elementor-element-f7e4e89: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 */