/* ==========================================================================
   Exportem — brand stylesheet
   Colors: maroon #5C1620, gold #C9A227, cream #FBF3E4
   Fonts:  Cinzel (headings), EB Garamond (body); Cairo for Arabic
   ========================================================================== */

:root{
  --maroon:#5C1620;
  --maroon-deep:#3A0D12;
  --gold:#C9A227;
  --gold-soft:#e6c869;
  --cream:#FBF3E4;
  --cream-2:#F5EAD6;
  --ink:#241512;
  --ink-soft:#6b5c52;
  --navy:#0F1D38;
  --line: rgba(36,21,18,.12);
  --radius: 4px;
  --shadow: 0 12px 32px rgba(58,13,18,.10);
  --maxw: 1180px;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:'EB Garamond', Georgia, serif;
  font-size:18px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
[dir="rtl"] body, [lang="ar"]{
  font-family:'Cairo','EB Garamond', Georgia, serif;
}
h1,h2,h3,h4,.font-display{
  font-family:'Cinzel', Georgia, serif;
  letter-spacing:.03em;
  font-weight:600;
  color:var(--maroon);
  margin:0 0 .5em;
}
[dir="rtl"] h1, [dir="rtl"] h2, [dir="rtl"] h3, [dir="rtl"] h4, [dir="rtl"] .font-display{
  font-family:'Cairo','Cinzel', Georgia, serif;
  letter-spacing:0;
}
p{ margin:0 0 1em; }
a{ color:inherit; }
img{ max-width:100%; display:block; }
.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 24px; }
.kicker{
  display:inline-block; font-family:'Cinzel',serif; font-size:12px; letter-spacing:.22em;
  text-transform:uppercase; color:var(--gold); margin-bottom:10px;
}
[dir="rtl"] .kicker{ font-family:'Cairo',serif; letter-spacing:.05em; }
.rule{ width:56px; height:2px; background:var(--gold); border:0; margin:14px 0 22px; }
[dir="rtl"] .rule{ margin-inline-start:0; }
section{ padding:88px 0; }
@media (max-width:640px){ section{ padding:56px 0; } }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:8px; justify-content:center;
  font-family:'Cinzel',serif; font-size:13px; letter-spacing:.08em; text-transform:uppercase;
  padding:14px 28px; border-radius:var(--radius); text-decoration:none; cursor:pointer;
  border:1px solid transparent; transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
  white-space:nowrap;
}
[dir="rtl"] .btn{ font-family:'Cairo',serif; letter-spacing:0; }
.btn:hover{ transform:translateY(-1px); }
.btn-gold{ background:var(--gold); color:var(--maroon-deep); }
.btn-gold:hover{ background:var(--gold-soft); }
.btn-outline{ background:transparent; color:var(--cream); border-color:rgba(251,243,228,.55); }
.btn-outline:hover{ border-color:var(--cream); }
.btn-maroon{ background:var(--maroon); color:var(--cream); }
.btn-maroon:hover{ background:var(--maroon-deep); }
.btn-whatsapp{ background:#25D366; color:#fff; }
.btn-whatsapp:hover{ background:#1ebe5b; }
.btn-sm{ padding:9px 18px; font-size:11px; }
.btn-block{ width:100%; }

/* ---------- Header ---------- */
header.site{
  position:sticky; top:0; z-index:50; background:rgba(251,243,228,.94); backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
}
.nav-row{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 24px; max-width:var(--maxw); margin:0 auto; }
.brand{ display:flex; align-items:center; gap:10px; text-decoration:none; }
.brand img{ height:38px; width:38px; border-radius:50%; }
.brand span{ font-family:'Cinzel',serif; color:var(--maroon); font-size:19px; letter-spacing:.12em; }
[dir="rtl"] .brand span{ font-family:'Cairo',serif; letter-spacing:0; }
nav.primary{ display:flex; align-items:center; gap:26px; }
nav.primary a{
  font-family:'Cinzel',serif; font-size:12px; letter-spacing:.1em; text-transform:uppercase;
  text-decoration:none; color:var(--ink); opacity:.8; padding:4px 0; border-bottom:2px solid transparent;
}
[dir="rtl"] nav.primary a{ font-family:'Cairo',serif; letter-spacing:0; }
nav.primary a:hover{ opacity:1; border-color:var(--gold); }
.nav-actions{ display:flex; align-items:center; gap:10px; }
.lang-switch{ display:flex; gap:4px; border:1px solid var(--line); border-radius:20px; padding:3px; }
.lang-switch button{
  border:0; background:transparent; font-family:'Cinzel',serif; font-size:11px; letter-spacing:.05em;
  padding:6px 10px; border-radius:16px; cursor:pointer; color:var(--ink-soft);
}
.lang-switch button.active{ background:var(--maroon); color:var(--cream); }
.nav-toggle{ display:none; background:none; border:0; font-size:24px; color:var(--maroon); cursor:pointer; }
@media (max-width: 980px){
  nav.primary{ display:none; }
  .nav-toggle{ display:block; }
  header.site.open nav.primary{
    display:flex; flex-direction:column; align-items:flex-start; gap:2px;
    position:absolute; inset-inline:0; top:100%; background:var(--cream); padding:14px 24px 20px;
    border-bottom:1px solid var(--line); box-shadow:var(--shadow);
  }
}

/* ---------- Hero ---------- */
.hero{
  position:relative; color:var(--cream); background:var(--maroon-deep) url('assets/hero-map-clean.jpg') center/cover no-repeat;
  padding:130px 0 110px;
}
.hero::before{ content:''; position:absolute; inset:0; background:linear-gradient(100deg, rgba(42,13,16,.86) 20%, rgba(42,13,16,.55) 65%, rgba(42,13,16,.35)); }
.hero .wrap{ position:relative; z-index:1; max-width:760px; }
.hero .tagline{ font-family:'Cinzel',serif; font-size:12px; letter-spacing:.26em; color:var(--gold); margin-bottom:18px; }
[dir="rtl"] .hero .tagline{ font-family:'Cairo',serif; letter-spacing:.06em; }
.hero h1{ color:#fff; font-size:44px; line-height:1.22; white-space:pre-line; margin-bottom:20px; }
@media (max-width:640px){ .hero h1{ font-size:30px; } .hero{ padding:96px 0 70px; } }
.hero p.sub{ font-size:19px; color:rgba(251,243,228,.88); max-width:560px; margin-bottom:34px; }
.hero .cta-row{ display:flex; flex-wrap:wrap; gap:14px; }

/* ---------- About ---------- */
.about-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:start; }
@media (max-width:860px){ .about-grid{ grid-template-columns:1fr; } }
.about-body{ font-size:19px; color:var(--ink-soft); max-width:560px; }
.stat-row{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.stat{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:22px 16px; text-align:center; }
.stat .n{ font-family:'Cinzel',serif; color:var(--maroon); font-size:28px; display:block; margin-bottom:6px; }
[dir="rtl"] .stat .n{ font-family:'Cairo',serif; }
.stat .l{ font-size:14px; color:var(--ink-soft); }

/* ---------- Why (feature grid) ---------- */
.why{ background:var(--maroon-deep); color:var(--cream); }
.why .kicker{ color:var(--gold); }
.why h2{ color:#fff; }
.why-sub{ color:rgba(251,243,228,.78); max-width:560px; margin-bottom:40px; }
.why-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:32px 40px; }
@media (max-width:860px){ .why-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .why-grid{ grid-template-columns:1fr; } }
.why-item .num{ font-family:'Cinzel',serif; color:var(--gold); font-size:13px; margin-bottom:8px; display:block; }
.why-item h4{ color:#fff; font-size:17px; margin-bottom:8px; }
.why-item p{ color:rgba(251,243,228,.75); font-size:16px; margin:0; }

/* ---------- Collection intro cards ---------- */
.coll-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:44px; }
@media (max-width:900px){ .coll-grid{ grid-template-columns:1fr; } }
.coll-card{
  display:block; background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  padding:30px; text-decoration:none; color:inherit; transition:box-shadow .15s ease, transform .15s ease;
}
.coll-card:hover{ box-shadow:var(--shadow); transform:translateY(-2px); }
.coll-card h3{ font-size:22px; margin-bottom:10px; }
.coll-card p{ color:var(--ink-soft); font-size:16px; margin-bottom:0; }

/* ---------- Product collection sections ---------- */
.coll-section{ border-top:1px solid var(--line); }
.coll-section.alt{ background:#fff; }
.coll-head{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; gap:20px; margin-bottom:12px; }
.coll-head .txt{ max-width:640px; }
.coll-head p{ color:var(--ink-soft); margin:0; }
.group-title{ font-size:20px; margin:44px 0 20px; padding-bottom:10px; border-bottom:1px solid var(--line); }
.group-title:first-of-type{ margin-top:36px; }

.card-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(270px,1fr)); gap:20px; }
.p-card{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden;
  display:flex; flex-direction:column; box-shadow: 0 1px 2px rgba(36,21,18,.04);
}
.coll-section.alt .p-card{ background:var(--cream); }
.p-card .pc-top{ padding:22px 22px 16px; }
.p-card .pc-name-row{ display:flex; justify-content:space-between; align-items:baseline; gap:10px; }
.p-card h4{ font-size:19px; margin:0; color:var(--maroon); }
[dir="rtl"] .p-card h4{ font-family:'Cairo',serif; }
.p-card .pc-height{ font-family:'Cinzel',serif; color:var(--gold); font-size:14px; white-space:nowrap; }
[dir="rtl"] .p-card .pc-height{ font-family:'Cairo',serif; }
.p-card .pc-platform{ font-size:13px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-soft); margin:6px 0 12px; font-family:'Cinzel',serif; }
[dir="rtl"] .p-card .pc-platform{ font-family:'Cairo',serif; letter-spacing:0; text-transform:none; }
.p-card .pc-desc{ font-size:15.5px; color:var(--ink-soft); margin-bottom:14px; }
.tag-row{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:6px; }
.tag{ font-size:11.5px; border:1px solid var(--line); border-radius:20px; padding:4px 10px; color:var(--ink-soft); background:rgba(201,162,39,.06); }
.comfort-row{ display:flex; align-items:center; gap:8px; margin:14px 0 4px; font-size:12px; color:var(--ink-soft); }
.comfort-dots{ display:flex; gap:4px; }
.comfort-dots i{ width:9px; height:9px; border-radius:50%; background:var(--line); display:inline-block; }
.comfort-dots i.on{ background:var(--maroon); }
.pc-toggle{
  margin-top:auto; width:100%; text-align:center; background:var(--cream-2); border:0; border-top:1px solid var(--line);
  font-family:'Cinzel',serif; font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--maroon);
  padding:12px; cursor:pointer;
}
[dir="rtl"] .pc-toggle{ font-family:'Cairo',serif; letter-spacing:0; }
.coll-section.alt .pc-toggle{ background:#fff; }
.pc-toggle:hover{ background:var(--gold); color:#fff; }
.pc-detail{ display:none; padding:0 22px 20px; border-top:1px dashed var(--line); }
.pc-detail.open{ display:block; }
.pc-detail dl{ display:grid; grid-template-columns:auto 1fr; gap:6px 14px; font-size:14.5px; margin:16px 0 0; }
.pc-detail dt{ color:var(--ink-soft); }
.pc-detail dd{ margin:0; }

.coll-dl{ margin-top:36px; text-align:center; }

/* ---------- Contact ---------- */
.contact{ background:var(--maroon-deep); color:var(--cream); }
.contact .kicker{ color:var(--gold); }
.contact h2{ color:#fff; }
.contact-sub{ color:rgba(251,243,228,.8); max-width:520px; margin-bottom:44px; }
.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:40px; }
@media (max-width:760px){ .contact-grid{ grid-template-columns:1fr; } }
.contact-box{ background:rgba(251,243,228,.05); border:1px solid rgba(251,243,228,.18); border-radius:var(--radius); padding:28px; }
.contact-box .row{ margin-bottom:18px; }
.contact-box .row:last-child{ margin-bottom:0; }
.contact-box .lab{ font-family:'Cinzel',serif; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--gold); display:block; margin-bottom:4px; }
[dir="rtl"] .contact-box .lab{ font-family:'Cairo',serif; letter-spacing:.04em; }
.contact-box .val a{ text-decoration:none; color:#fff; font-size:17px; }
.contact-actions{ display:flex; flex-direction:column; gap:14px; justify-content:center; }

/* ---------- Footer ---------- */
footer.site{ background:var(--ink); color:rgba(251,243,228,.75); padding:34px 0; font-size:14px; }
footer.site .wrap{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px; align-items:center; }
footer.site .tag{ color:var(--gold); font-family:'Cinzel',serif; letter-spacing:.06em; font-size:12px; }
[dir="rtl"] footer.site .tag{ font-family:'Cairo',serif; letter-spacing:0; }

/* ---------- Floating quick actions ---------- */
.quickbar{ position:fixed; inset-inline-end:18px; bottom:18px; z-index:60; display:flex; flex-direction:column; gap:10px; }
.quickbar a{
  width:52px; height:52px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 18px rgba(0,0,0,.22); color:#fff; text-decoration:none; font-size:22px;
}
.quickbar a.wa{ background:#25D366; }
.quickbar a.mail{ background:var(--maroon); }

[hidden]{ display:none !important; }
