:root{
  --cocoa:#3b2417; --cocoa-soft:#5a3a23; --cream:#f7efe4; --cream-2:#fbf6ee;
  --gold:#c8a04e; --gold-deep:#a9842f; --ink:#2a1d14; --muted:#7a6552;
  --wa:#25d366; --wa-deep:#128c4a; --white:#fff;
  --shadow:0 10px 30px rgba(59,36,23,.12); --shadow-sm:0 4px 14px rgba(59,36,23,.10);
  --radius:16px; --maxw:1140px;
  --s1:8px; --s2:16px; --s3:24px; --s4:32px; --s5:48px; --s6:64px;
  --font-head:"Playfair Display",Georgia,serif; --font-body:"Inter",system-ui,sans-serif;
}
html[lang="ar"]{ --font-head:"Cairo",sans-serif; --font-body:"Cairo",sans-serif; }
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);color:var(--ink);background:var(--cream-2);line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.container{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 var(--s3)}
h1,h2,h3{font-family:var(--font-head);line-height:1.15;color:var(--cocoa)}
h1{font-size:clamp(2rem,6vw,3.4rem);font-weight:700}
h2{font-size:clamp(1.6rem,4vw,2.4rem);font-weight:600}
h3{font-size:1.2rem;font-weight:600}
.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-size:.78rem;font-weight:600;color:var(--gold-deep);margin-bottom:var(--s2)}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:.5rem;font-weight:600;font-size:.98rem;padding:.85rem 1.5rem;border-radius:999px;border:2px solid transparent;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,background .15s ease}
.btn:hover{transform:translateY(-2px)}
.btn-sm{padding:.55rem 1.1rem;font-size:.9rem}
.btn-whatsapp{background:var(--wa);color:#06351c;box-shadow:var(--shadow-sm)}
.btn-whatsapp:hover{background:var(--wa-deep);color:#fff}
.btn-ghost{background:transparent;color:var(--cocoa);border-color:rgba(59,36,23,.25)}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold-deep)}

/* Header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(251,246,238,.92);backdrop-filter:blur(8px);border-bottom:1px solid rgba(59,36,23,.08)}
.header-inner{display:flex;align-items:center;gap:var(--s3);min-height:68px}
.brand{display:flex;align-items:center;gap:.6rem;font-weight:700}
.brand-logo{width:38px;height:38px}
.brand-name{font-family:var(--font-head);font-size:1.15rem;color:var(--cocoa)}
.main-nav{display:flex;gap:var(--s3);margin-inline-start:auto;font-weight:500}
.main-nav a{color:var(--cocoa-soft);font-size:.96rem;position:relative;padding:.2rem 0}
.main-nav a:hover{color:var(--gold-deep)}
.main-nav a::after{content:"";position:absolute;left:0;bottom:-4px;width:0;height:2px;background:var(--gold);transition:width .2s}
.main-nav a:hover::after{width:100%}
.header-actions{display:flex;align-items:center;gap:var(--s2)}
.lang-toggle{background:transparent;border:1.5px solid rgba(59,36,23,.25);border-radius:999px;padding:.4rem .8rem;font-weight:600;font-size:.85rem;color:var(--cocoa);cursor:pointer;font-family:var(--font-body)}
.lang-toggle:hover{border-color:var(--gold);color:var(--gold-deep)}
.nav-burger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:6px}
.nav-burger span{width:24px;height:2px;background:var(--cocoa);border-radius:2px;transition:.25s}

/* Hero */
.hero{position:relative;color:#fff;overflow:hidden;min-height:min(86vh,640px);display:flex;align-items:center}
.hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;z-index:0}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(40,24,15,.82),rgba(40,24,15,.45));z-index:1}
.hero-content{position:relative;z-index:2;padding:var(--s6) 0;max-width:680px}
.hero .eyebrow{color:var(--gold)}
.hero h1{color:#fff;margin-bottom:var(--s3)}
.hero-sub{font-size:1.12rem;color:rgba(255,255,255,.9);margin-bottom:var(--s4);max-width:560px}
.hero-cta{display:flex;flex-wrap:wrap;gap:var(--s2);margin-bottom:var(--s4)}
.hero-cta .btn-ghost{color:#fff;border-color:rgba(255,255,255,.55)}
.hero-cta .btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.1)}
.hero-proof{font-size:.92rem;color:rgba(255,255,255,.82);display:inline-flex;align-items:center;gap:.5rem}
.hero-proof::before{content:"★";color:var(--gold)}

/* Sections */
.section{padding:var(--s6) 0}
.section-head{text-align:center;max-width:640px;margin:0 auto var(--s5)}
.section-intro{color:var(--muted);margin-top:var(--s2)}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:var(--s5);align-items:center}
.col-media img,.col-media .map{width:100%;border-radius:var(--radius);box-shadow:var(--shadow)}
.savoir-faire{background:var(--cream)}
.feature-list{list-style:none;margin-top:var(--s3);display:grid;gap:var(--s2)}
.feature-list li{position:relative;padding-inline-start:1.8rem;color:var(--cocoa-soft)}
.feature-list li::before{content:"";position:absolute;inset-inline-start:0;top:.55em;width:12px;height:12px;background:var(--gold);border-radius:3px;transform:rotate(45deg)}
.col-text p{color:var(--muted);margin-top:var(--s2)}

/* Cards */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s3)}
.card{background:var(--white);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);transition:transform .2s,box-shadow .2s;border:1px solid rgba(59,36,23,.06)}
.card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.card img{height:170px;width:100%;object-fit:cover;background:var(--cream)}
.card h3{padding:var(--s3) var(--s3) 0}
.card p{padding:.4rem var(--s3) var(--s3);color:var(--muted);font-size:.94rem}
.note-placeholder{margin-top:var(--s4);text-align:center;color:var(--gold-deep);font-size:.86rem;font-style:italic}

/* Avis */
.avis{background:var(--cocoa);color:var(--cream)}
.avis h2,.avis .eyebrow{color:var(--gold)}
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s3)}
.quotes blockquote{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:var(--radius);padding:var(--s4)}
.quotes p{color:var(--cream);font-size:1rem}
.quotes cite{display:block;margin-top:var(--s2);color:var(--gold);font-style:normal;font-weight:600;font-size:.88rem}
.quote-placeholder{opacity:.65}

/* Contact */
.contact-list{list-style:none;display:grid;gap:var(--s3);margin:var(--s3) 0 var(--s4)}
.contact-list li{display:grid;gap:2px}
.contact-list strong{color:var(--cocoa);font-family:var(--font-head)}
.contact-list span,.contact-list a{color:var(--muted)}
.contact-list a:hover{color:var(--gold-deep)}
.contact-cta{display:flex;flex-wrap:wrap;gap:var(--s2);margin-bottom:var(--s3)}
.socials{display:flex;gap:var(--s3);font-weight:600;font-size:.9rem}
.socials a{color:var(--gold-deep)}
.socials a:hover{color:var(--cocoa)}
.map{border:0;min-height:330px;width:100%}

/* Footer */
.site-footer{background:var(--ink);color:rgba(255,255,255,.82);padding:var(--s5) 0}
.footer-inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s3)}
.footer-brand{display:flex;align-items:center;gap:.7rem}
.footer-brand img{width:42px;height:42px}
.footer-brand p{font-family:var(--font-head);color:#fff}
.footer-hours{font-size:.92rem}
.footer-credit{font-size:.82rem;color:rgba(255,255,255,.6);width:100%;text-align:center;border-top:1px solid rgba(255,255,255,.1);padding-top:var(--s3);margin-top:var(--s2)}
.footer-credit strong{color:var(--gold)}

/* WhatsApp FAB */
.whatsapp-fab{position:fixed;inset-inline-end:18px;bottom:18px;z-index:60;width:56px;height:56px;border-radius:50%;background:var(--wa);color:#06351c;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 22px rgba(18,140,74,.45);transition:transform .15s}
.whatsapp-fab:hover{transform:scale(1.08);color:#06351c}

/* Reveal animation */
.section,.card,.quotes blockquote{opacity:1}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease}
.reveal.in{opacity:1;transform:none}

/* RTL */
html[dir="rtl"] .main-nav a::after{left:auto;right:0}
html[dir="rtl"] .hero-proof::before{order:2}

/* Responsive */
@media(max-width:900px){
  .two-col{grid-template-columns:1fr;gap:var(--s4)}
  .cards{grid-template-columns:repeat(2,1fr)}
  .quotes{grid-template-columns:1fr}
}
@media(max-width:680px){
  .main-nav,.header-actions .btn{display:none}
  .main-nav.open{display:flex;position:absolute;top:68px;inset-inline:0;flex-direction:column;background:var(--cream-2);padding:var(--s3);gap:var(--s2);border-bottom:1px solid rgba(59,36,23,.1);box-shadow:var(--shadow-sm)}
  .nav-burger{display:flex;margin-inline-start:auto}
  .header-actions{margin-inline-start:0}
  .cards{grid-template-columns:1fr}
  .hero-content{padding:var(--s5) 0}
}
