/* Base styles and utilities */
:root{
  --primary:#4A90E2; /* Chefchaouen Blue */
  --terracotta:#E67E22;
  --gold:#F1C40F;
  --cream:#FDF6E3;
  --navy:#2C3E50;
  --softgray:#95A5A6;
}

html{scroll-behavior:smooth}
body{background:#fff;color:var(--navy)}

.container{max-width:1120px;margin-inline:auto;padding-inline:1rem}

/* Preloader */
.loader{display:flex;gap:.5rem}
.loader span{width:10px;height:10px;border-radius:9999px;background:var(--primary);animation:blink 1s infinite ease-in-out}
.loader span:nth-child(2){animation-delay:.15s}
.loader span:nth-child(3){animation-delay:.3s}
@keyframes blink{0%,80%,100%{opacity:.2;transform:translateY(0)}40%{opacity:1;transform:translateY(-6px)}}

/* Sections */
.section{padding:5rem 0}
.section-title{font-family:'Playfair Display',serif;font-size:2rem;line-height:1.2}

/* Navigation */
.nav-link{color:var(--navy);opacity:.9}
.nav-link:hover{color:var(--primary)}

/* Buttons */
.btn-primary{background:var(--primary);color:#fff;padding:.6rem 1rem;border-radius:.5rem;box-shadow:0 8px 20px rgba(74,144,226,.25);transition:transform .2s, box-shadow .2s}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(74,144,226,.35)}
.btn-outline{border:1px solid rgba(44,62,80,.2);padding:.55rem 1rem;border-radius:.5rem;color:var(--navy);transition:all .2s}
.btn-outline:hover{border-color:var(--primary);color:var(--primary)}
.btn-white{background:#fff;color:var(--navy);padding:.6rem 1rem;border-radius:.5rem;box-shadow:0 8px 20px rgba(0,0,0,.08);transition:transform .2s, box-shadow .2s, color .2s}
.btn-white:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(0,0,0,.15);color:#1f2d3a}
.btn-gold{background:linear-gradient(135deg,#F6E27A,#F1C40F);color:#2C3E50;padding:.6rem 1rem;border-radius:.5rem;box-shadow:0 8px 20px rgba(241,196,15,.25)}
.btn-whatsapp{background:#25D366;color:#fff;padding:.6rem 1rem;border-radius:.5rem}

/* Hero */
.hero-bg img,.hero-bg video{filter:saturate(1.05)}
.motif-overlay{position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(rgba(255,255,255,.06) 1px, transparent 1px);background-size:24px 24px}
.parallax{transform:translateZ(0);will-change:transform}

/* Feature chips */
.feat{position:relative;padding-left:1.5rem}
.feat::before{content:"";position:absolute;left:0;top:.45rem;width:.6rem;height:.6rem;border:2px solid var(--terracotta);border-radius:9999px}

.chip{display:inline-flex;align-items:center;gap:.4rem;background:#fff;border:1px solid rgba(44,62,80,.1);color:var(--navy);padding:.35rem .6rem;border-radius:9999px}

/* Room cards */
.room-card{background:#fff;border-radius:1rem;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.06);transition:transform .25s}
.room-card:hover{transform:translateY(-4px)}
.room-img{width:100%;height:220px;object-fit:cover;display:block}

/* Amenities */
.amen-card{display:flex;align-items:center;gap:.6rem;background:#fff;border:1px solid rgba(44,62,80,.08);border-radius:.8rem;padding:1rem}
.amen-card i{color:var(--primary)}

/* Reviews */
.review{background:#fff;border-left:4px solid var(--terracotta);padding:1rem 1.25rem;border-radius:.5rem;box-shadow:0 6px 18px rgba(0,0,0,.05)}
.review p{color:#27384a}
.review footer{color:var(--softgray);margin-top:.5rem}

/* Form */
.label{display:block;font-size:.9rem;color:#27384a;margin-bottom:.35rem}
.input{width:100%;border:1px solid rgba(44,62,80,.15);border-radius:.6rem;padding:.6rem .75rem;outline:none;transition:border .2s, box-shadow .2s}
.input:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(74,144,226,.15)}

/* Footer */
.social{width:36px;height:36px;display:grid;place-items:center;background:rgba(255,255,255,.08);border-radius:.5rem;color:#fff}
.social:hover{background:rgba(255,255,255,.15)}

/* RTL helpers */
[dir="rtl"] .feat{padding-right:1.5rem;padding-left:0}
[dir="rtl"] .feat::before{left:auto;right:0}
[dir="rtl"] .label{text-align:right}

/* Preloader hide */
#preloader.hidden{opacity:0;visibility:hidden;transition:opacity .4s ease, visibility .4s ease}

/* GLightbox override for rounded corners */
.glightbox-clean .gslide-media{border-radius:12px;overflow:hidden}