/*
Theme Name: الوادي — Al Wadi
Theme URI: https://alwadi-events.com/
Author: Al Wadi
Author URI: https://alwadi-events.com/
Description: قالب مخصص للموقع التعريفي للوادي للضيافة العربية — ضيافة عربية وتنظيم فعاليات في مملكة البحرين. مبني على نسق صفحة واحدة بألوان بني القهوة وذهبي ترابي وكريمي وأخضر النخيل.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: alwadi
Tags: one-column, rtl-language-support, custom-menu, custom-logo, featured-images
*/

/* =========================================================
   الوادي للضيافة العربية — ملف التنسيق
   لوحة الألوان: بنّي القهوة · ذهبي ترابي · كريمي · أخضر النخيل
   ========================================================= */

:root{
  --brown-900:#3B2A20;
  --brown-800:#4A3426;
  --brown-700:#5A4030;
  --brown-500:#6B4A32;
  --gold:#B08D57;
  --gold-soft:#C9AA78;
  --gold-pale:#E8DCC6;
  --cream:#FAF6EF;
  --cream-2:#F2E9DA;
  --cream-3:#EADFCB;
  --green:#1F3D33;
  --green-dark:#163028;
  --ink:#2C2019;
  --muted:#7A6A5C;
  --line:#E2D6C2;
  --wa:#1F7A55;
  --wa-dark:#17603F;

  --radius:14px;
  --radius-lg:22px;
  --shadow-sm:0 1px 2px rgba(59,42,32,.06), 0 2px 8px rgba(59,42,32,.05);
  --shadow-md:0 2px 6px rgba(59,42,32,.07), 0 12px 32px rgba(59,42,32,.08);
  --wrap:1180px;
  --header-h:74px;

  --f-head:"IBM Plex Sans Arabic", "Segoe UI", system-ui, sans-serif;
  --f-body:"IBM Plex Sans Arabic", system-ui, -apple-system, "Segoe UI", sans-serif;
}

/* ---------- الأساسيات ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:calc(var(--header-h) + 12px)}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto} }

body{
  margin:0;
  font-family:var(--f-body);
  font-size:16px;
  line-height:1.85;
  color:var(--ink);
  background:var(--cream);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{max-width:100%; height:auto; display:block}
a{color:inherit}
ul,ol{margin:0; padding:0; list-style:none}
h1,h2,h3,h4{font-family:var(--f-head); font-weight:700; line-height:1.35; margin:0; color:var(--brown-900)}
h1{font-size:clamp(2rem, 6.2vw, 3.75rem); letter-spacing:-.01em}
h2{font-size:clamp(1.55rem, 4.4vw, 2.5rem)}
h3{font-size:clamp(1.12rem, 2.6vw, 1.32rem)}
h4{font-size:1.05rem}
p{margin:0 0 1.05rem}
p:last-child{margin-bottom:0}

.wrap{width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:20px}
.wrap.narrow{max-width:800px}
.center{text-align:center}

.skip-link{
  position:absolute; inset-inline-start:-9999px; top:0; z-index:200;
  background:var(--brown-900); color:#fff; padding:.7rem 1.1rem; border-radius:0 0 10px 0;
}
.skip-link:focus{inset-inline-start:0}

:focus-visible{outline:3px solid var(--gold); outline-offset:3px; border-radius:6px}

/* ---------- الأزرار ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  font-family:var(--f-body); font-weight:600; font-size:1rem;
  padding:.78rem 1.5rem; border-radius:999px; border:1.5px solid transparent;
  text-decoration:none; cursor:pointer; transition:transform .18s ease, background .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease;
  white-space:nowrap;
}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn-lg{padding:.95rem 2rem; font-size:1.05rem}
.btn-sm{padding:.5rem 1.1rem; font-size:.9rem}
.btn-block{display:flex; width:100%}

.btn-wa{background:var(--wa); color:#fff; box-shadow:var(--shadow-sm)}
.btn-wa:hover{background:var(--wa-dark); box-shadow:var(--shadow-md)}
.btn-brown{background:var(--brown-900); color:#fff; box-shadow:var(--shadow-sm)}
.btn-brown:hover{background:#241a12; box-shadow:var(--shadow-md)}
.btn-beige{background:var(--cream); color:var(--brown-900); border:2.5px solid var(--brown-900); box-shadow:var(--shadow-sm)}
.btn-beige:hover{background:var(--brown-900); color:#fff; border-color:var(--brown-900); box-shadow:var(--shadow-md)}
.btn-cream{
  background:linear-gradient(180deg,#FFFDF8 0%,#F5EBD9 100%);
  color:var(--brown-900);
  border:2px solid var(--gold);
  box-shadow:0 6px 20px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.95);
  font-weight:700; letter-spacing:.01em;
}
.btn-cream:hover{
  background:linear-gradient(180deg, var(--gold), var(--gold-soft));
  color:#fff;
  border-color:var(--gold-soft);
  box-shadow:0 10px 26px rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.35);
}
.btn-cream:active{transform:translateY(0)}
.btn-golden{background:var(--gold); color:#3b2a1a; border:2.5px solid var(--brown-900); box-shadow:var(--shadow-sm); font-weight:700}
.btn-golden:hover{background:var(--brown-900); color:var(--gold); border-color:var(--brown-900); box-shadow:var(--shadow-md)}
.btn-ivory{
  position:relative;
  background:linear-gradient(180deg,#FFFDF6 0%,#F4EAD6 100%);
  color:#4A2E18;
  border:2px solid var(--gold);
  box-shadow:0 8px 24px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.9);
  font-weight:700; letter-spacing:.01em;
}
.btn-ivory .ico-wa{
  width:22px; height:22px; padding:2px;
  background:var(--gold); border-radius:50%;
  fill:#fff; flex:none;
}
.btn-ivory:hover{
  background:linear-gradient(180deg,var(--gold-soft),var(--gold));
  color:#fff;
  border-color:var(--gold-soft);
  box-shadow:0 12px 30px rgba(176,141,87,.35), inset 0 1px 0 rgba(255,255,255,.35);
}
.btn-ivory:hover .ico-wa{background:var(--brown-900)}
.btn-ig{
  background:linear-gradient(45deg,#F58529 0%,#DD2A7B 55%,#8134AF 100%);
  color:#fff; box-shadow:var(--shadow-sm);
}
.btn-ig:hover{
  background:linear-gradient(45deg,#f07c1f 0%,#d21f6f 55%,#782da0 100%);
  filter:saturate(1.1); box-shadow:var(--shadow-md);
}
.btn-ghost{background:transparent; color:var(--brown-900); border-color:var(--gold)}
.btn-ghost:hover{background:var(--gold); color:#fff; border-color:var(--gold)}
.ico-wa{width:20px; height:20px; fill:currentColor; flex:none}
.ico-ig{width:17px; height:17px; fill:currentColor; flex:none}
.header-actions{display:flex; align-items:center; gap:.55rem; flex:none}

/* ---------- الشريط العلوي ---------- */
.site-header{
  position:sticky; top:0; z-index:100;
  background:rgba(250,246,239,.92);
  backdrop-filter:saturate(140%) blur(12px);
  -webkit-backdrop-filter:saturate(140%) blur(12px);
  border-bottom:1px solid transparent;
  transition:border-color .25s ease, box-shadow .25s ease, background .25s ease;
}
.site-header.is-stuck{border-bottom-color:var(--line); box-shadow:0 2px 20px rgba(59,42,32,.06)}
.header-inner{display:flex; align-items:center; gap:1.2rem; min-height:var(--header-h)}

.brand{display:flex; align-items:center; gap:.75rem; text-decoration:none; margin-inline-end:auto}
.brand .brand-mark{width:52px; height:52px; flex:none; border-radius:50%; overflow:hidden; box-shadow:0 2px 8px rgba(59,42,32,.12); border:1.5px solid var(--gold-soft)}
.brand-mark{width:52px; height:52px; flex:none; border-radius:50%; overflow:hidden; box-shadow:0 2px 8px rgba(59,42,32,.12); border:1.5px solid var(--gold-soft)}
.brand-mark svg{width:100%; height:100%; display:block}
.brand-mark img{width:100%; height:100%; object-fit:cover; display:block}
.brand-text{display:flex; flex-direction:column; line-height:1.2}
.brand-text strong{font-family:var(--f-head); font-size:1.32rem; color:var(--brown-900)}
.brand-text small{font-size:.72rem; color:var(--muted); letter-spacing:.03em; font-weight:500}

.nav ul{display:flex; gap:.2rem}
.nav a{
  display:block; text-decoration:none; font-size:.94rem; font-weight:500;
  color:var(--brown-700); padding:.45rem .72rem; border-radius:8px; transition:color .18s, background .18s;
}
.nav a:hover{color:var(--brown-900); background:var(--cream-2)}
.nav a.is-active{color:var(--gold); font-weight:600}

.nav-toggle{
  display:none; width:44px; height:44px; border:1px solid var(--line); background:#fff;
  border-radius:10px; cursor:pointer; padding:0; place-items:center; flex:none;
}
.nav-toggle span{display:block; width:20px; height:2px; background:var(--brown-900); margin:4px auto; border-radius:2px; transition:transform .25s, opacity .2s}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

@media (max-width:1180px){
  .header-actions .ig-label{display:none}
}
@media (max-width:980px){
  .header-actions{display:flex; align-items:center; gap:.5rem; flex:none}
  .header-actions .btn-brown{display:none}
  .header-actions .ig-label{display:none}
  .lang-desktop{display:block}
  .lang-mobile{display:none}
  .nav-toggle{display:grid}
  .nav{
    position:fixed; inset:var(--header-h) 0 auto 0; background:var(--cream);
    border-bottom:1px solid var(--line); box-shadow:var(--shadow-md);
    max-height:0; overflow:hidden; transition:max-height .32s ease;
  }
  .nav.is-open{max-height:min(75vh, 520px); overflow-y:auto}
  .nav ul{flex-direction:column; gap:0; padding:.5rem 20px 1.1rem}
  .nav a{padding:.85rem .4rem; border-bottom:1px solid var(--line); border-radius:0; font-size:1.02rem}
  .nav li:last-child a{border-bottom:0}
}

/* ---------- HERO ---------- */
.hero{position:relative; isolation:isolate; overflow:hidden; padding:clamp(3.5rem,11vw,6.5rem) 0 clamp(3rem,9vw,5.5rem)}
.hero-bg{
  position:absolute; inset:0; z-index:-1;
  background:
    radial-gradient(1000px 520px at 78% -10%, rgba(176,141,87,.22), transparent 62%),
    radial-gradient(760px 480px at 8% 110%, rgba(31,61,51,.14), transparent 60%),
    linear-gradient(180deg, var(--cream-2) 0%, var(--cream) 62%);
}
.hero-bg::after{
  content:""; position:absolute; inset:0; opacity:.55;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72' viewBox='0 0 72 72'%3E%3Cg fill='none' stroke='%23B08D57' stroke-opacity='.16' stroke-width='1'%3E%3Cpath d='M36 4 52 20 36 36 20 20z'/%3E%3Cpath d='M36 36 52 52 36 68 20 52z'/%3E%3Cpath d='M0 36 16 20 32 36 16 52z'/%3E%3Cpath d='M40 36 56 20 72 36 56 52z'/%3E%3C/g%3E%3C/svg%3E");
}
.hero-inner{position:relative; max-width:920px}
.hero-emblem-wrap{
  width:clamp(120px, 24vw, 175px); height:auto; display:block;
  margin:0 0 1.8rem; filter:drop-shadow(0 10px 22px rgba(59,42,32,.16));
  border-radius:50%;
}
.hero-emblem-wrap svg{width:100%; height:auto; display:block}
.eyebrow{
  font-size:.84rem; font-weight:600; letter-spacing:.12em; color:var(--gold);
  text-transform:none; margin:0 0 .85rem;
}
.hero h1{margin-bottom:1.2rem}
.hero .lede{font-size:clamp(1.02rem,2.4vw,1.22rem); color:var(--brown-700); max-width:64ch; margin-bottom:2rem}
.hero-cta{display:flex; flex-wrap:wrap; gap:.8rem; margin-bottom:2.4rem}
.hero-badges{display:flex; flex-wrap:wrap; gap:.55rem}
.hero-badges li{
  font-size:.84rem; color:var(--brown-700); background:rgba(255,255,255,.78);
  border:1px solid var(--line); padding:.4rem .95rem; border-radius:999px; font-weight:500;
}

/* ---------- الأقسام ---------- */
.section{padding:clamp(3.2rem,8vw,5.5rem) 0}
.section-alt{background:var(--cream-2)}
.section-dark{background:linear-gradient(180deg,#55341D 0%,#452A19 58%,#3B2A20 100%); color:var(--cream)}
.section-dark h2,.section-dark h3{color:var(--cream)}
.section-dark .eyebrow{color:var(--gold-soft)}
.section-dark .about-rule b{box-shadow:0 0 0 3px #452A19, 0 0 0 4px rgba(232,209,162,.5)}

.sec-head{max-width:64ch; margin-bottom:2.6rem}
.sec-sub{color:var(--muted); margin-top:.8rem}
.section-dark .sec-sub{color:var(--gold-pale)}

/* ---------- من نحن ---------- */
#about p{color:var(--brown-700); font-size:1.03rem}
.about-head{text-align:center; max-width:70ch; margin:0 auto 2.2rem}
.about-eyebrow{
  display:inline-flex; align-items:center; gap:.7rem;
  font-family:var(--f-head); font-size:.82rem; font-weight:600; letter-spacing:.22em;
  color:var(--gold); margin-bottom:1rem; text-transform:uppercase;
}
.about-eyebrow::before,.about-eyebrow::after{content:''; width:42px; height:1px}
.about-eyebrow::before{background:linear-gradient(90deg,transparent,var(--gold))}
.about-eyebrow::after{background:linear-gradient(90deg,var(--gold),transparent)}
.about-title{font-size:clamp(1.7rem,4vw,2.45rem); line-height:1.4; margin:0; color:var(--ink)}
.about-rule{display:flex; align-items:center; justify-content:center; gap:.85rem; margin-top:1.15rem}
.about-rule i{width:64px; height:1px}
.about-rule i:first-child{background:linear-gradient(90deg,transparent,var(--gold))}
.about-rule i:last-child{background:linear-gradient(90deg,var(--gold),transparent)}
.about-rule b{
  width:10px; height:10px; transform:rotate(45deg); flex:none; border-radius:2px;
  background:linear-gradient(135deg,var(--gold),var(--brown-900));
  box-shadow:0 0 0 3px var(--cream), 0 0 0 4px rgba(201,169,120,.5);
}
.about-sub{text-align:center; max-width:52ch; margin:.3rem auto 0; color:var(--muted)}
.pillars{display:grid; gap:1.4rem; margin-top:2.8rem}
.pillar{
  position:relative; overflow:hidden; text-align:center;
  background:radial-gradient(circle at 50% 0%, #fff 0%, #FBF7EF 46%, #F3E7CF 100%);
  border:1px solid rgba(201,169,120,.55); border-radius:var(--radius-lg);
  padding:2.7rem 1.5rem 2.1rem; box-shadow:0 16px 38px rgba(90,62,24,.12);
  transition:transform .3s ease, box-shadow .3s ease;
}
.pillar:hover{transform:translateY(-5px); box-shadow:0 22px 46px rgba(90,62,24,.18)}
.pillar::after{content:''; position:absolute; inset:10px; border:1px dashed rgba(201,169,120,.4); border-radius:calc(var(--radius-lg) - 8px); pointer-events:none}
.pillar-orn{position:absolute; left:50%; top:-16%; width:148%; height:auto; transform:translateX(-50%); opacity:.09; pointer-events:none; filter:blur(.5px)}
.pillar-medal{
  position:relative; display:grid; place-items:center; width:64px; height:64px; margin:0 auto 1.15rem; border-radius:50%;
  background:radial-gradient(circle, #fff 0%, #F7EEDD 100%);
  box-shadow:0 0 0 3px #fff, 0 0 0 4px rgba(201,169,120,.55), 0 6px 16px rgba(90,62,24,.16);
}
.pillar-medal svg{width:56px; height:56px; display:block}
.pillar h3{position:relative; margin-bottom:.5rem; font-size:1.18rem}
.pillar p{position:relative; font-size:.95rem; color:var(--muted); margin:0; max-width:26ch; margin-inline:auto}
@media (min-width:760px){ .pillars{grid-template-columns:repeat(3,1fr)} }

/* ---------- البطاقات ---------- */
.cards{display:grid; gap:1.2rem}
@media (min-width:640px){ .cards{grid-template-columns:repeat(2,1fr)} }
@media (min-width:1040px){ .cards{grid-template-columns:repeat(4,1fr)} }
.card{
  position:relative; overflow:hidden;
  background:radial-gradient(circle at 50% 0%, #fff 0%, #FBF7EF 46%, #F3E7CF 100%);
  border:1px solid rgba(201,169,120,.5); border-radius:var(--radius-lg);
  padding:1.7rem 1.5rem; box-shadow:var(--shadow-sm);
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
.card:hover{transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:var(--gold-soft)}
.card::after{content:''; position:absolute; inset:9px; border:1px dashed rgba(201,169,120,.32); border-radius:calc(var(--radius-lg) - 8px); pointer-events:none}
.card-orn{position:absolute; right:-18%; top:-22%; width:78%; height:auto; opacity:.07; pointer-events:none}
.card-ico{position:relative; display:grid; place-items:center; width:54px; height:54px; border-radius:14px; background:var(--cream-2); color:var(--gold); margin-bottom:1.1rem}
.card-ico svg{width:30px; height:30px}
.card h3{position:relative; margin-bottom:.55rem}
.card p{position:relative; font-size:.95rem; color:var(--muted); margin:0}

/* ---------- المناسبات ---------- */
.occ-grid{display:grid; gap:1rem}
@media (min-width:600px){ .occ-grid{grid-template-columns:repeat(2,1fr)} }
@media (min-width:980px){ .occ-grid{grid-template-columns:repeat(4,1fr)} }
.occ{
  position:relative; overflow:hidden; list-style:none;
  background:radial-gradient(circle at 50% 0%, #fff 0%, #FCF8F1 48%, #F4E8D1 100%);
  border:1px solid rgba(201,169,120,.45); border-radius:var(--radius);
  padding:1.25rem 1.3rem; box-shadow:var(--shadow-sm);
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
.occ:hover{transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:var(--gold-soft)}
.occ::after{content:''; position:absolute; inset:7px; border:1px dashed rgba(201,169,120,.25); border-radius:calc(var(--radius) - 6px); pointer-events:none}
.occ-orn{position:absolute; left:-10%; top:-26%; width:52%; height:auto; opacity:.05; pointer-events:none}
.occ span,.occ p{position:relative}
.occ::before{content:""; position:absolute; inset-block:0; inset-inline-start:0; width:3px; background:linear-gradient(var(--gold), var(--gold-soft)); opacity:0; transition:opacity .25s}
.occ:hover::before{opacity:1}
.occ span{display:block; font-family:var(--f-head); font-weight:700; font-size:1.12rem; color:var(--brown-900); margin-bottom:.3rem}
.occ p{font-size:.9rem; color:var(--muted); margin:0; line-height:1.7}

/* ---------- المعرض ---------- */
.gallery{display:grid; gap:.7rem; grid-template-columns:repeat(2,1fr)}
@media (min-width:720px){ .gallery{grid-template-columns:repeat(3,1fr); gap:1rem} }
.gal{
  margin:0; position:relative; aspect-ratio:1/1; border-radius:var(--radius); overflow:hidden;
  background:linear-gradient(140deg, var(--cream-3), var(--cream-2));
  border:1px solid var(--line); cursor:zoom-in;
}
.gal::before{
  content:""; position:absolute; inset:0; opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44' viewBox='0 0 44 44'%3E%3Cg fill='none' stroke='%23B08D57' stroke-opacity='.3'%3E%3Cpath d='M22 2 42 22 22 42 2 22z'/%3E%3C/g%3E%3C/svg%3E");
}
.gal img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .5s ease}
.gal:hover img{transform:scale(1.05)}
.gal figcaption{
  position:absolute; inset-inline:0; bottom:0; padding:.9rem 1rem .75rem;
  font-size:.86rem; font-weight:500; color:#fff;
  background:linear-gradient(transparent, rgba(44,32,25,.82));
}
.gal.is-empty figcaption{color:var(--brown-700); background:none; text-shadow:none}

/* ---------- الباقات ---------- */
.pkgs{display:grid; gap:1.5rem}
@media (min-width:640px){ .pkgs{grid-template-columns:repeat(2,1fr)} }
@media (min-width:1000px){ .pkgs{grid-template-columns:repeat(3,1fr)} }
.pkg{
  position:relative;
  display:flex; flex-direction:column;
  background:linear-gradient(180deg,#FFFFFF 0%,#FCF7EC 100%);
  border:1px solid var(--line); border-radius:26px;
  padding:2.3rem 1.8rem 1.8rem;
  box-shadow:0 2px 10px rgba(90,62,24,.06);
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
.pkg::before{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72' viewBox='0 0 72 72'%3E%3Cg fill='none' stroke='%23B08D57' stroke-opacity='.12' stroke-width='1'%3E%3Cpath d='M36 4 52 20 36 36 20 20z'/%3E%3Cpath d='M36 36 52 52 36 68 20 52z'/%3E%3Cpath d='M0 36 16 20 32 36 16 52z'/%3E%3Cpath d='M40 36 56 20 72 36 56 52z'/%3E%3C/g%3E%3C/svg%3E");
}
.pkg > *{position:relative; z-index:1}
.pkg > .btn{margin-top:2px}
.pkg:hover{transform:translateY(-6px); box-shadow:0 18px 40px rgba(90,62,24,.12); border-color:var(--gold-soft)}
.pkg-feat{
  border:1px solid var(--gold);
  background:radial-gradient(120% 100% at 50% 0%, #FFFBF0 0%, #FBF3E2 60%, #F6E9CF 100%);
  box-shadow:inset 0 0 0 1px var(--gold), 0 14px 40px rgba(176,141,87,.16);
}
.pkg-tag{
  position:absolute; top:-15px; left:50%; transform:translateX(-50%);
  background:linear-gradient(135deg, var(--gold), var(--brown-500)); color:#fff;
  font-size:.76rem; font-weight:700; letter-spacing:.03em;
  padding:.42rem 1.1rem; border-radius:999px; margin:0; white-space:nowrap;
  box-shadow:0 4px 14px rgba(90,62,24,.25);
}
.pkg-no{font-family:var(--f-head); font-size:1.35rem; font-weight:700; color:var(--brown-900); margin:0 0 .4rem; text-align:center}
.pkg-no em{font-style:normal; font-family:var(--f-body); font-size:.7rem; font-weight:600; color:var(--gold); border:1px solid var(--gold-soft); padding:.16rem .6rem; border-radius:999px; vertical-align:middle; margin-inline-start:.4rem; background:rgba(255,255,255,.6)}
.pkg-price{display:flex; align-items:baseline; justify-content:center; gap:.35rem; margin:0 0 1.2rem; color:var(--muted); font-size:.95rem}
.pkg-price span{font-family:var(--f-head); font-size:2.6rem; font-weight:800; color:var(--brown-900); letter-spacing:-.02em; line-height:1}
.pkg ul{display:grid; gap:.65rem; margin:0 0 1.7rem; flex:1}
.pkg li{position:relative; padding-inline-start:1.9rem; font-size:.94rem; color:var(--brown-700); line-height:1.7}
.pkg li::before{
  content:""; position:absolute; inset-inline-start:.1rem; top:.42em;
  width:9px; height:9px; border-radius:2px; transform:rotate(45deg);
  background:linear-gradient(135deg, var(--gold), var(--gold-soft));
  box-shadow:0 0 0 3px rgba(176,141,87,.14);
}
.pkg .btn-golden{background:var(--gold); color:#fff; border:2px solid var(--gold); box-shadow:var(--shadow-sm)}
.pkg .btn-golden:hover{background:var(--brown-900); color:var(--gold); border-color:var(--brown-900); box-shadow:var(--shadow-md)}
.note{
  margin-top:2rem; background:#fff; border:1px solid var(--line); border-inline-start:3px solid var(--gold);
  border-radius:var(--radius); padding:1.1rem 1.3rem; font-size:.93rem; color:var(--brown-700);
}
.note a{color:var(--gold); font-weight:600}

/* ---------- الخطوات ---------- */
.steps{display:grid; gap:1.2rem}
@media (min-width:700px){ .steps{grid-template-columns:repeat(2,1fr)} }
@media (min-width:1040px){ .steps{grid-template-columns:repeat(4,1fr)} }
.step{
  position:relative;
  background:linear-gradient(180deg, rgba(255,255,255,.09) 0%, rgba(255,255,255,.04) 100%);
  border:1px solid rgba(232,220,198,.22); border-radius:calc(var(--radius-lg) + 2px);
  padding:1.8rem 1.5rem 1.7rem; overflow:hidden;
  display:flex; flex-direction:column;
  transition:transform .28s ease, border-color .28s ease, box-shadow .28s ease;
}
.step::before{
  content:""; position:absolute; inset-inline:0; top:0; height:3px;
  background:linear-gradient(90deg, transparent, var(--gold), transparent);
  opacity:.55;
}
.step:hover{transform:translateY(-5px); border-color:var(--gold); box-shadow:0 16px 36px rgba(0,0,0,.22)}
.step-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:1.2rem}
.step-ico{
  display:grid; place-items:center; width:58px; height:58px; border-radius:18px;
  background:linear-gradient(135deg, var(--gold), var(--gold-soft)); color:#fff;
  box-shadow:0 8px 22px rgba(176,141,87,.35); flex:none;
}
.step-ico svg{width:32px; height:32px}
.step-n{
  display:grid; place-items:center; width:42px; height:42px; border-radius:50%;
  background:rgba(255,255,255,.14); border:1px solid rgba(232,220,198,.35); color:var(--gold-soft);
  font-family:var(--f-head); font-size:1.2rem; font-weight:700; flex:none;
}
.step h3{margin-bottom:.45rem; font-size:1.18rem}
.step p{font-size:.93rem; color:var(--gold-pale); margin:0; line-height:1.75; flex:1}

/* ---------- الشروط ---------- */
.terms{display:grid; gap:1rem}
@media (min-width:760px){ .terms{grid-template-columns:1fr 1fr} }
.terms li{
  position:relative;
  background:#fff;
  border:1px solid var(--line);
  border-inline-start:4px solid var(--gold);
  border-radius:10px;
  padding:1.05rem 1.3rem;
  font-size:.96rem; color:var(--brown-700); line-height:1.85;
  box-shadow:var(--shadow-sm);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.terms li:hover{
  transform:translateY(-3px);
  box-shadow:var(--shadow-md);
  border-inline-start-color:var(--gold-soft);
}
.terms strong{
  display:block; margin-bottom:.3rem;
  color:var(--brown-900); font-size:1.04rem;
}
.terms strong::after{
  content:""; display:block; width:36px; height:2px;
  background:var(--gold); border-radius:2px; margin-top:.4rem;
}
.ph{
  display:inline-block; background:#FFF3D6; border:1px dashed #D9A93A; color:#8A5D00;
  padding:.05rem .5rem; border-radius:6px; font-size:.86rem; font-weight:600;
}

/* ---------- الأسئلة الشائعة ---------- */
.faq{display:grid; gap:.7rem}
.faq details{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow-sm); overflow:hidden;
}
.faq summary{
  cursor:pointer; list-style:none; padding:1.05rem 1.25rem;
  font-family:var(--f-head); font-weight:700; font-size:1.06rem; color:var(--brown-900);
  display:flex; align-items:center; gap:.8rem; transition:color .2s;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"+"; margin-inline-start:auto; font-family:var(--f-body); font-weight:400;
  font-size:1.5rem; color:var(--gold); line-height:1; transition:transform .25s;
}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq summary:hover{color:var(--gold)}
.faq details p{padding:0 1.25rem 1.2rem; margin:0; font-size:.95rem; color:var(--muted); line-height:1.85}

/* ---------- تواصل ---------- */
.contact-grid{display:grid; gap:1.4rem}
@media (min-width:900px){ .contact-grid{grid-template-columns:1.35fr .9fr; align-items:start} }

.form{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:1.7rem 1.5rem; box-shadow:var(--shadow-sm);
  display:grid; gap:1rem;
}
@media (min-width:560px){ .form{grid-template-columns:1fr 1fr} }
.field{display:flex; flex-direction:column; gap:.4rem}
.field-full{grid-column:1/-1}
.form > button, .form > .form-hint, .form > .form-err{grid-column:1/-1}
.form > button{justify-self:center}
.field label{font-size:.88rem; font-weight:600; color:var(--brown-700)}
.field label span{color:#B3261E}
.field input,.field select,.field textarea{
  font-family:var(--f-body); font-size:1rem; color:var(--ink);
  background:var(--cream); border:1.5px solid var(--line); border-radius:10px;
  padding:.72rem .9rem; transition:border-color .2s, background .2s; width:100%;
}
.field textarea{resize:vertical; min-height:110px; line-height:1.7}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--gold); background:#fff; outline:none}
.field input[aria-invalid="true"]{border-color:#B3261E}
.form-hint{font-size:.82rem; color:var(--muted); text-align:center; margin:.2rem 0 0}
.form-err{background:#FDECEA; color:#8C1D18; border-radius:10px; padding:.6rem .9rem; font-size:.9rem; margin:0}

.contact-info{
  position:relative;
  background:
    radial-gradient(240px 200px at 10% 0%, rgba(255,255,255,.09), transparent 62%),
    linear-gradient(165deg, #6B4A32 0%, #4A3426 62%, #3B2A20 100%);
  border:1px solid rgba(201,170,120,.32);
  border-radius:var(--radius-lg);
  padding:1.8rem 1.6rem;
  box-shadow:var(--shadow-md), inset 0 1px 0 rgba(255,255,255,.08);
  overflow:hidden;
}
.contact-info::before{
  content:""; position:absolute; top:0; inset-inline:1.6rem; height:2px;
  background:linear-gradient(90deg, transparent, var(--gold-soft), transparent);
  border-radius:0 0 2px 2px;
}
.contact-info h3{color:#fff; margin-bottom:1.1rem; font-size:1.25rem}
.contact-info h3::after{
  content:""; display:block; width:46px; height:2px;
  background:var(--gold); margin-top:.6rem; border-radius:2px;
}
.cinfo{display:grid; gap:1rem; margin-bottom:1.5rem}
.cinfo li{
  position:relative;
  display:flex; flex-direction:column; gap:.15rem;
  padding-inline-start:1.9rem; padding-bottom:1rem;
  border-bottom:1px solid rgba(232,220,198,.14);
  transition:transform .18s ease;
}
.cinfo li:last-child{border-bottom:0; padding-bottom:0}
.cinfo li::before{
  content:""; position:absolute; inset-inline-start:0; top:.4rem;
  width:9px; height:9px; border-radius:50%;
  background:var(--gold);
  box-shadow:0 0 0 3px rgba(176,141,87,.22);
}
.cinfo li:hover{transform:translateX(-3px)}
.cinfo-k{font-size:.78rem; color:var(--gold-soft); letter-spacing:.06em}
.cinfo-v{font-size:1.05rem; font-weight:600; color:#FFFDF8; text-decoration:none; word-break:break-word}
a.cinfo-v:hover{color:var(--gold-soft); text-decoration:underline}
.cinfo-cta{display:grid; gap:.6rem}
.contact-info .btn-ghost{color:var(--cream); border-color:var(--gold-soft)}
.contact-info .btn-ghost:hover{background:var(--gold); border-color:var(--gold); color:#fff}

/* ---------- Footer ---------- */
.site-footer{
  position:relative;
  background:
    radial-gradient(520px 300px at 15% 0%, rgba(255,255,255,.07), transparent 60%),
    linear-gradient(165deg, #5A4030 0%, #4A3426 55%, #3B2A20 100%);
  color:var(--gold-pale);
  padding-top:clamp(2.8rem,6vw,4.2rem);
}
.site-footer::before{
  content:""; position:absolute; top:0; inset-inline:0; height:3px;
  background:linear-gradient(90deg, transparent 0%, var(--gold) 18%, var(--gold-soft) 50%, var(--gold) 82%, transparent 100%);
  opacity:.85;
}
.footer-inner{display:grid; gap:2.2rem; padding-bottom:2.6rem}
@media (min-width:760px){ .footer-inner{grid-template-columns:1.6fr 1fr 1fr} }
.foot-brand strong{
  font-family:var(--f-head); font-size:1.45rem; color:#FFFDF8; display:block; margin-bottom:.6rem;
}
.foot-brand strong::after{
  content:""; display:block; width:46px; height:2px;
  background:var(--gold); margin-top:.55rem; border-radius:2px;
}
.foot-brand p{font-size:.92rem; line-height:1.9; margin:0; color:rgba(232,220,198,.85)}
.foot-emblem{
  width:92px; height:auto; display:block; margin-bottom:1.1rem;
  border-radius:50%; box-shadow:0 10px 26px rgba(0,0,0,.25);
}
.foot-emblem svg{width:100%; height:auto; display:block}
.foot-emblem img{width:100%; height:auto; display:block; border-radius:50%}
.site-footer h4{
  color:var(--gold-soft); margin-bottom:1rem; font-size:.85rem;
  letter-spacing:.12em; text-transform:uppercase;
}
.site-footer h4::after{
  content:""; display:block; width:32px; height:2px;
  background:var(--gold); margin-top:.5rem; border-radius:2px;
}
.site-footer ul{display:grid; gap:.6rem}
.site-footer ul li{position:relative; padding-inline-start:1.15rem}
.site-footer ul li::before{
  content:""; position:absolute; inset-inline-start:0; top:.6em;
  width:6px; height:6px; border-radius:50%; background:var(--gold); opacity:.7;
}
.site-footer a{
  font-size:.94rem; text-decoration:none; color:var(--gold-pale);
  transition:color .2s ease, padding-inline-start .2s ease;
}
.site-footer a:hover{color:#fff; text-decoration:underline; text-underline-offset:4px}
.foot-bottom{border-top:1px solid rgba(232,220,198,.14); padding-block:1.25rem}
.foot-bottom p{font-size:.85rem; margin:0; text-align:center; color:rgba(232,220,198,.66)}

/* ---------- أزرار عائمة: واتساب + اتصال ---------- */
.fab-stack{
  position:fixed; right:16px; bottom:16px; z-index:90;
  display:flex; flex-direction:column; gap:.7rem; align-items:center;
}
.fab{
  position:relative; display:inline-flex; align-items:center; justify-content:center;
  width:56px; height:56px; border-radius:50%; color:#fff; text-decoration:none;
  box-shadow:0 8px 24px rgba(20,14,8,.35);
  transition:transform .2s ease, background .2s ease, box-shadow .2s ease;
}
.fab:hover{transform:translateY(-3px)}
.fab-wa{background:var(--wa)}
.fab-wa:hover{background:var(--wa-dark)}
.fab-call{
  background:linear-gradient(180deg,#FFFDF6 0%,#F4EAD6 100%);
  color:#4A2E18;
  border:2px solid var(--gold);
  box-shadow:0 8px 24px rgba(176,141,87,.42), inset 0 1px 0 rgba(255,255,255,.9);
}
.fab-call:hover{
  background:linear-gradient(180deg,var(--gold-soft),var(--gold));
  color:#fff; border-color:var(--gold-soft);
  box-shadow:0 10px 28px rgba(176,141,87,.5);
}
.fab svg{width:28px; height:28px; fill:currentColor}
.fab-label{
  position:absolute; right:calc(100% + 12px); top:50%;
  transform:translateY(-50%) translateX(8px);
  white-space:nowrap; background:rgba(26,19,13,.92); color:var(--cream);
  padding:.45rem .85rem; border-radius:999px; font-size:.85rem; font-weight:600;
  opacity:0; pointer-events:none; transition:opacity .2s ease, transform .2s ease;
  box-shadow:0 4px 14px rgba(0,0,0,.25);
}
.fab:hover .fab-label{opacity:1; transform:translateY(-50%) translateX(0)}
@media (max-width:560px){
  .fab-stack{gap:.6rem}
  .fab{width:52px; height:52px}
  .fab svg{width:26px; height:26px}
}

/* ---------- Lightbox ---------- */
.lb{position:fixed; inset:0; z-index:200; background:rgba(28,20,15,.93); display:grid; place-items:center; padding:24px}
.lb[hidden]{display:none}
.lb img{max-width:min(94vw,1100px); max-height:88vh; border-radius:10px; object-fit:contain}
.lb-close{
  position:absolute; top:14px; inset-inline-end:16px; width:44px; height:44px;
  background:rgba(255,255,255,.12); color:#fff; border:0; border-radius:50%;
  font-size:1.8rem; line-height:1; cursor:pointer;
}
.lb-close:hover{background:rgba(255,255,255,.22)}

/* ---------- حركة الظهور عند التمرير ---------- */
.reveal{opacity:0; transform:translateY(18px); transition:opacity .65s ease, transform .65s ease}
.reveal.is-in{opacity:1; transform:none}
.reveal:nth-child(2){transition-delay:.06s}
.reveal:nth-child(3){transition-delay:.12s}
.reveal:nth-child(4){transition-delay:.18s}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1; transform:none; transition:none}
  .btn:hover,.card:hover,.pkg:hover,.fab:hover{transform:none}
  .gal img{transition:none}
}

.no-js .reveal{opacity:1; transform:none}

/* ---------- الطباعة ---------- */
@media print{
  .site-header,.fab-stack,.hero-cta,.header-actions,.nav-toggle,.lb{display:none !important}
  body{background:#fff}
  .section{padding:1rem 0; page-break-inside:avoid}
}

@media (max-width:560px){
  .hero-cta{flex-direction:column; align-items:stretch}
  .hero-cta .btn{width:100%}
  .hero-badges li{font-size:.8rem; padding:.35rem .8rem}
}
#f-date{text-align:right}

@media (max-width:640px){
  .foot-bottom{padding-bottom:5.2rem}
}

/* فرض اتجاه RTL داخل بيئة العرض */
html, body { direction: rtl; text-align: right; }

/* ---------- مبدّل اللغة ---------- */
.lang-switch{
  display:inline-flex; align-items:center; gap:2px;
  padding:3px; background:var(--cream-2); border:1px solid var(--line);
  border-radius:999px; flex:none;
}
.lang-switch a{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:38px; height:26px; padding:0 .55rem;
  font-size:.74rem; font-weight:600; text-decoration:none; line-height:1;
  color:var(--brown-700); border-radius:999px;
  transition:color .18s, background .18s;
}
.lang-switch a:hover{background:rgba(176,141,87,.16); color:var(--brown-900)}
.lang-switch a.is-active{background:var(--brown-900); color:#fff}
.lang-switch .lang-en{letter-spacing:.04em}
.lang-desktop{display:block}
.lang-mobile{display:none}

/* ---------- إصلاح الجوال: مبدّل اللغة وزر إنستغرام يبقيان ظاهرين ---------- */
@media (max-width:980px){
  .header-actions{display:flex; align-items:center; gap:.4rem; flex:none}
  .header-actions .btn-brown{display:none}
  .lang-desktop{display:none}
  .lang-mobile{display:block; margin:.2rem 0 0 .6rem}
  @media(max-width:360px){ .lang-switch a{padding:.28rem .42rem; font-size:.8rem} }
}
html[lang="en"] .lang-switch{direction:ltr}
html[lang="en"] .lang-switch .lang-en{padding-inline:.7rem}

/* اتجاه الإصدار الإنجليزي (LTR) */
html[lang="en"], html[lang="en"] body{direction:ltr; text-align:left}

/* ---------- سلايدر الهيرو ---------- */
.hero-slider{min-height:min(92vh, 840px); display:flex; align-items:center; padding:0}
.hs-track{position:absolute; inset:0; z-index:0}
.hs-slide{
  position:absolute; inset:0; opacity:0; visibility:hidden;
  transition:opacity .9s ease, visibility .9s;
}
.hs-slide.is-active{opacity:1; visibility:visible; z-index:1}
.hs-img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transform:scale(1.02); transform-origin:center;
}
.hs-slide.is-active .hs-img{animation:hs-ken 8s ease-out forwards}
@keyframes hs-ken{from{transform:scale(1.02)}to{transform:scale(1.09)}}
.hs-veil{
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(18,12,8,.66) 0%, rgba(18,12,8,.32) 42%, rgba(18,12,8,.12) 58%, rgba(18,12,8,.82) 100%),
    radial-gradient(1100px 620px at 24% 30%, rgba(0,0,0,.20), transparent 60%),
    radial-gradient(1200px 700px at 78% 96%, rgba(0,0,0,.28), transparent 62%);
}
.hs-inner{height:100%; display:flex; flex-direction:column; justify-content:center; position:relative; z-index:2; padding-block:7.5rem 3.5rem}
.hero-slider .eyebrow{color:var(--gold-soft); text-shadow:0 1px 10px rgba(0,0,0,.5)}
.hs-title{
  color:#fff; margin:0 0 1.15rem; max-width:18ch;
  text-shadow:0 2px 24px rgba(0,0,0,.45);
}
.hero-slider .lede{color:rgba(255,255,255,.94); text-shadow:0 1px 14px rgba(0,0,0,.5)}
.hs-cta{margin-bottom:0}
.hero-slider .btn-ghost{color:#fff; border-color:rgba(255,255,255,.65); background:rgba(30,22,14,.22)}
.hero-slider .btn-ghost:hover{background:#fff; color:var(--brown-900); border-color:#fff}
.hs-badges{
  position:absolute; z-index:3; bottom:1.6rem; inset-inline-start:50%;
  transform:translateX(-50%);
}
.hs-badges li{
  color:rgba(255,255,255,.95); background:rgba(18,12,8,.45);
  border-color:rgba(212,175,55,.32); backdrop-filter:blur(3px);
  box-shadow:0 4px 14px rgba(0,0,0,.25);
}
.hs-arrow{
  position:absolute; z-index:4; top:50%; transform:translateY(-50%);
  width:46px; height:46px; border-radius:50%;
  border:1px solid rgba(255,255,255,.35); background:rgba(30,22,14,.28);
  color:#fff; font-size:1.25rem; line-height:1; cursor:pointer;
  display:grid; place-items:center;
  transition:background .25s ease, border-color .25s ease;
}
.hs-arrow:hover{background:var(--gold); border-color:var(--gold)}
.hs-prev{inset-inline-start:1.2rem}
.hs-next{inset-inline-end:1.2rem}
.hs-dots{
  position:absolute; z-index:4; inset-inline-start:50%; transform:translateX(-50%);
  bottom:1.5rem; display:flex; gap:.6rem; padding:.35rem .6rem;
  background:rgba(30,22,14,.35); border:1px solid rgba(255,255,255,.18); border-radius:999px;
}
.hs-dot{
  width:11px; height:11px; padding:0; border-radius:50%; cursor:pointer;
  border:1px solid rgba(255,255,255,.6); background:rgba(255,255,255,.35);
  transition:background .25s ease, transform .25s ease;
}
.hs-dot.is-active{background:var(--gold); border-color:var(--gold); transform:scale(1.25)}
.hs-dot span{display:none}
@media (prefers-reduced-motion: reduce){
  .hs-slide{transition:none}
  .hs-slide.is-active .hs-img{animation:none}
}

@media (max-width:760px){
  .hs-arrow{display:none}
  .hs-badges{bottom:4.6rem; inset-inline-start:50%; transform:translateX(-50%)}
  .hs-dots{bottom:1.2rem}
  .hs-inner{padding-top:8.5rem}
  .hero-slider .hero-badges li{font-size:.72rem; padding:.32rem .7rem}
}