﻿/* Critical CSS for https://amco-groups.com/ar */
:root {
    --swiper-theme-color: #007aff
}

:host {
    position: relative;
    display: block;
    margin-left: auto;
    margin-right: auto;
    z-index: 1
}

:root {
    --swiper-navigation-size: 44px
}

.fa-solid {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: var(--fa-display,inline-block);
    font-style: normal;
    font-variant: normal;
    line-height: 1;
    text-rendering: auto
}

.fa-solid {
    font-family: "Font Awesome 6 Free"
}

.fa-laptop-file:before {
    content: "\e51d"
}

.fa-hotel:before {
    content: "\f594"
}

:host, :root {
    --fa-style-family-brands: "Font Awesome 6 Brands";
    --fa-font-brands: normal 400 1em/1 "Font Awesome 6 Brands"
}

:host, :root {
    --fa-font-regular: normal 400 1em/1 "Font Awesome 6 Free"
}

@font -face {
    font-family: "Font Awesome 6 Free";
    font-style: normal;
    font-weight: 400;
    font-display: block;
    src: url(../webfonts/fa-regular-400.woff2?v=6.5.2) format("woff2"),url(../webfonts/fa-regular-400.ttf?v=6.5.2) format("truetype")
}

:host, :root {
    --fa-style-family-classic: "Font Awesome 6 Free";
    --fa-font-solid: normal 900 1em/1 "Font Awesome 6 Free"
}

@font -face {
    font-family: "Font Awesome 6 Free";
    font-style: normal;
    font-weight: 900;
    font-display: block;
    src: url(../webfonts/fa-solid-900.woff2?v=6.5.2) format("woff2"),url(../webfonts/fa-solid-900.ttf?v=6.5.2) format("truetype")
}

.fa-solid {
    font-weight: 900
}

.material-symbols-outlined {
    font-variation-settings: 'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24
}

.glass-card {
    background: rgba(255,255,255,.7);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(209,197,180,.3)
}

:root {
    --primary: #b7904b !important;
    --secondary: #e6dccb !important
}

body {
    font-family: 'Cairo','Plus Jakarta Sans',sans-serif;
    background-color: #fff;
    color: var(--secondary);
    -webkit-font-smoothing: antialiased;
    text-align: rtl
}

::-webkit-scrollbar {
    width: 10px
}

::-webkit-scrollbar-track {
    background: #f8f7f5
}

::-webkit-scrollbar-thumb {
    background: #e5e7eb;
    border-radius: 10px;
    border: 2px solid #f8f7f5
}

    ::-webkit-scrollbar-thumb:hover {
        background: var(--primary)
    }

@keyframes logoScale {
    0% {
        transform: scale(.9);
        opacity: 0
    }

    50% {
        transform: scale(1.05);
        opacity: 1
    }

    100% {
        transform: scale(1);
        opacity: 1
    }
}

.animate-logo {
    animation: logoScale 1.5s ease-out forwards
}

.glass-button {
    background: rgba(255,248,243,.4);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1.5px solid #937230
}

.border-amco-gold {
    --tw-border-opacity: 1;
    border-color: #937230;
}

.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.glass-card {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(209, 197, 180, 0.3);
}
@keyframes marquee {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(50%);
    }
}

.animate-marquee {
    display: flex;
    width: 200%;
    animation: marquee 30s linear infinite;
}


.animate-bounce-slow {
    animation: bounce 3s infinite;
}

.animate-pulse-slow {
    animation: pulse 6s infinite;
}

.animate-gradient-shift {
    background-size: 200% 200%;
    animation: gradient-shift 4s ease infinite;
}

@keyframes gradient-shift {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

@keyframes bounce {

    0%,
    100% {
        transform: translateY(-5%);
        animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
    }

    50% {
        transform: translateY(0);
        animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
    }
}

@keyframes pulse {

    0%,
    100% {
        transform: scale(1);
        opacity: 1;
    }

    50% {
        transform: scale(1.05);
        opacity: 0.8;
    }
}

::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: #f8f7f5;
}

::-webkit-scrollbar-thumb {
    background: #e5e7eb;
    border-radius: 10px;
    border: 2px solid #f8f7f5;
}

    ::-webkit-scrollbar-thumb:hover {
        background: var(--primary);
    }

::selection {
    background: var(--primary);
    color: white;
}

.hide-scrollbar::-webkit-scrollbar {
    display: none;
}

.hide-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

@layer utilities {
    /* حركة التدرج اللوني للنص */
    @keyframes gradient-shift {
        0% {
            background-position: 0% 50%;
        }

        50% {
            background-position: 100% 50%;
        }

        100% {
            background-position: 0% 50%;
        }
    }

    .animate-gradient-shift {
        animation: gradient-shift 3s ease infinite;
    }
    /* حركة النبض البطيئة للصورة الخلفية */
    @keyframes pulse-slow {
        0%, 100% {
            transform: scale(1.05);
        }

        50% {
            transform: scale(1.1);
        }
    }

    .animate-pulse-slow {
        animation: pulse-slow 8s ease-in-out infinite;
    }
}

.glass-header {
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 50;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    border-top: 1px solid rgba(0,0,0,0.05);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
}

    .dropdown-menu.active {
        display: block;
    }

html {
    scrollbar-gutter: stable;
}

/* Prevent scrolling while loading */
body.is-loading {
    overflow: hidden;
}

.preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 9999; /* Sit on top of everything */
    /* Smooth transition prevents abrupt jumps */
    opacity: 1;
    visibility: visible;
    transition: opacity 0.4s ease, visibility 0.4s ease;
}

    .preloader.hidden {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }

.hero-img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}


.reveal-up, [data-gsap="fade-up"],
.reveal-scale, [data-gsap="scale-up"],
[data-gsap="fade-left"], [data-gsap="fade-right"] {
    will-change: opacity, transform;
}

.magnetic-btn {
    display: inline-flex;
    transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1);
    will-change: transform;
}

.tilt-card {
    perspective: 1000px;
    transform-style: preserve-3d;
    will-change: transform;
}

#gsap-scroll-progress {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #755717 0%, #937230 50%, #f28b0d 100%);
    transform-origin: 0% 50%;
    transform: scaleX(0);
    z-index: 9999;
    pointer-events: none;
}
/* GSAP CodePen Showcase Utility Classes */
.split-overflow {
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
}

.curtain-reveal {
    clip-path: inset(100% 0 0 0);
    will-change: clip-path, transform;
}

/* Ambient Floating Physics */
@keyframes gsapFloat {
    0%, 100% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-10px);
    }
}

.gsap-float {
    animation: gsapFloat 4s ease-in-out infinite;
    will-change: transform;
}

/* Interactive Custom Cursor */
#gsap-cursor-dot, #gsap-cursor-ring {
    pointer-events: none;
    position: fixed;
    top: 0;
    left: 0;
    border-radius: 50%;
    z-index: 99999;
    will-change: transform;
    opacity: 0;
    transition: opacity 0.3s ease;
}

#gsap-cursor-dot {
    width: 8px;
    height: 8px;
    background-color: #937230;
}

#gsap-cursor-ring {
    width: 36px;
    height: 36px;
    border: 1.5px solid rgba(147, 114, 48, 0.5);
}

@media (hover: none) or (pointer: coarse) {
    #gsap-cursor-dot, #gsap-cursor-ring {
        display: none !important;
    }
}
/* Custom Luxury Scrollbar Styling */
html {
    scrollbar-width: thin;
    scrollbar-color: #937230 #f8f7f5;
}

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: #f8f7f5;
    border-left: 1px solid rgba(0, 0, 0, 0.05);
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #937230 0%, #f28b0d 100%);
    border-radius: 9999px;
    border: 2px solid #f8f7f5;
    transition: all 0.3s ease;
}

    ::-webkit-scrollbar-thumb:hover {
        background: linear-gradient(180deg, #f28b0d 0%, #755717 100%);
    }

.no-scrollbar::-webkit-scrollbar {
    display: none;
}

.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}
