/* Styles personnalisés pour le site Rotana */

body {
    font-family: 'Montserrat', sans-serif;
    scroll-behavior: smooth;
    cursor: url('img/hero-accueil.png'), auto;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Playfair Display', serif;
}

.arabesque-top {
    position: relative;
}

.arabesque-top::before {
    content: "";
    position: absolute;
    top: -20px;
    left: 0;
    right: 0;
    height: 20px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 10" preserveAspectRatio="none"><path d="M0,10 C20,8 40,6 50,4 C60,2 80,0 100,2 L100,10 Z" fill="%23f5f5f0"/></svg>');
    background-repeat: repeat-x;
    background-size: 100px 20px;
}

.arabesque-bottom {
    position: relative;
}

.arabesque-bottom::after {
    content: "";
    position: absolute;
    bottom: -20px;
    left: 0;
    right: 0;
    height: 20px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 10" preserveAspectRatio="none"><path d="M0,0 C20,2 40,4 50,6 C60,8 80,10 100,8 L100,0 Z" fill="%23f5f5f0"/></svg>');
    background-repeat: repeat-x;
    background-size: 100px 20px;
}

.section-divider {
    position: relative;
    height: 80px;
    overflow: hidden;
}

.section-divider svg {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 80px;
}

.testimonial-card {
    transition: all 0.3s ease;
}

.testimonial-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
}

.gallery-container {
    position: relative;
    overflow: hidden;
}

.gallery-track {
    display: flex;
    transition: transform 0.5s ease-in-out;
}

.gallery-item {
    flex-shrink: 0;
    transition: transform 0.3s ease;
}

.gallery-item:hover {
    transform: scale(1.05);
}

.gallery-item img {
    transition: all 0.3s ease;
}

.gallery-item:hover img {
    box-shadow: 0 8px 25px rgba(0,0,0,0.2);
}

.nav-link {
    position: relative;
}

.nav-link::after {
    content: '';
    position: absolute;
    width: 0;
    height: 2px;
    bottom: -2px;
    left: 0;
    background-color: #b78d65;
    transition: width 0.3s ease;
}

.nav-link:hover::after {
    width: 100%;
}

.text-outline {
    text-shadow:
        -1px -1px 0 #fff,
         1px -1px 0 #fff,
        -1px  1px 0 #fff,
         1px  1px 0 #fff;
    -webkit-text-stroke: 1px #fff;
}

#home, #gallery, #reviews, #event, #contact {
  scroll-margin-top: 100px;
}
#menu {
  scroll-margin-top: 60px;
}