/* ============================================================
   مكتب آل عبد الهادي — Premium Arabic Legal Tech
   Design Tokens First · Deep Navy × Warm Off-White × Champagne
============================================================ */
:root{
  /* Surfaces */
  --background:#F7F2EA;
  --surface:#FDFBF5;
  --surface-2:#F0E9DC;
  --navy:#33261A;
  --navy-2:#453320;
  --navy-3:#57422A;

  /* Text */
  --foreground:#2E2518;
  --muted:#6E5E49;
  --on-navy:#F0E8D8;
  --on-navy-muted:#B3A48A;

  /* Accent — يُستخدم بجرعات صغيرة فقط */
  --accent:#C6A050;
  --accent-soft:#D9BE7F;
  --accent-tint:#F6EED9;
  --accent-line:rgba(198,160,80,.45);

  --border:#E8DFCC;
  --border-navy:rgba(240,232,216,.12);

  /* Radius scale */
  --radius-sm:8px;
  --radius-md:12px;
  --radius-lg:18px;

  /* Shadows */
  --shadow-sm:0 1px 3px rgba(51,38,26,.05),0 4px 14px rgba(51,38,26,.05);
  --shadow-md:0 4px 10px rgba(51,38,26,.06),0 14px 34px rgba(51,38,26,.08);

  --ease:cubic-bezier(.4,0,.2,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:hidden}
body{
  font-family:'IBM Plex Sans Arabic',sans-serif;
  font-weight:400;
  background:var(--background);
  color:var(--foreground);
  line-height:1.95;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
h1,h2,h3,h4{font-family:'Alexandria',sans-serif;line-height:1.75}
h1{font-weight:600}
h2{font-weight:600}
h3{font-weight:600;font-size:1.1rem}
.container{width:min(1160px,92%);margin-inline:auto}

/* ============ فاصل بصري حديث ============ */
.ornament{display:flex;align-items:center;justify-content:center;gap:.6rem;margin:1rem auto 0}
.ornament::before,.ornament::after{content:"";height:1px;width:52px;background:var(--border)}
.ornament span{width:6px;height:6px;border-radius:50%;background:var(--accent)}

/* ============ الهيدر — لؤلؤي بلمسة ذهبية ============ */
header.site{
  position:sticky;top:0;z-index:60;
  background:linear-gradient(180deg,rgba(253,250,243,.96),rgba(245,238,224,.94));
  backdrop-filter:blur(16px);
  border-bottom:1px solid transparent;
  border-image:linear-gradient(90deg,transparent,rgba(198,160,80,.55) 25%,rgba(198,160,80,.55) 75%,transparent) 1;
  box-shadow:0 1px 18px rgba(83,62,36,.07);
}
.nav{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:.65rem 0}
.brand{justify-self:start;display:inline-flex;align-items:center;padding:.15rem;border-radius:50%;transition:transform .25s var(--ease)}
.brand:hover{transform:scale(1.05)}
.brand img{width:60px;height:60px;object-fit:contain;filter:drop-shadow(0 2px 8px rgba(198,160,80,.4))}
nav.menu{justify-self:center;display:flex;gap:2.1rem;align-items:center}
nav.menu a{font-family:'Alexandria',sans-serif;font-weight:500;font-size:.94rem;color:var(--muted);position:relative;padding:.35rem 0;transition:color .2s var(--ease)}
nav.menu a::after{content:"";position:absolute;bottom:-3px;right:50%;transform:translateX(50%);width:0;height:2px;background:var(--accent);transition:width .25s var(--ease);border-radius:2px}
nav.menu a:hover{color:var(--foreground)}
nav.menu a.active{color:var(--foreground);font-weight:600}
nav.menu a.active::after,nav.menu a:hover::after{width:100%}
nav.menu .menu-contact{display:none}
.contact-btn{
  justify-self:end;display:inline-flex;align-items:center;gap:.5rem;
  font-family:'Alexandria',sans-serif;font-weight:600;font-size:.88rem;color:#fff;
  background:linear-gradient(135deg,#8F6B2C,#C6A050 60%,#D9BE7F);
  padding:.55rem 1.25rem;border-radius:50px;
  border:1px solid rgba(255,255,255,.4);
  box-shadow:0 4px 14px rgba(143,107,44,.28);
  transition:transform .2s var(--ease),box-shadow .2s var(--ease),filter .2s var(--ease);
}
.contact-btn svg{width:17px;height:17px;stroke:#fff}
.contact-btn:hover{transform:translateY(-2px);filter:brightness(1.06);box-shadow:0 7px 20px rgba(143,107,44,.36)}
.burger{display:none;justify-self:end;background:none;border:0;cursor:pointer;flex-direction:column;gap:5px;padding:6px}
.burger span{width:25px;height:2px;background:var(--foreground);border-radius:2px;transition:.25s var(--ease)}

/* ============ الهيرو — أعمدة المحكمة معتمة بطبقة ذهبي × بني ============ */
.hero{
  position:relative;color:var(--on-navy);overflow:hidden;
  background:
    radial-gradient(900px 560px at 78% 20%,rgba(198,160,80,.20),transparent 62%),
    linear-gradient(165deg,rgba(40,28,15,.90) 0%,rgba(66,49,28,.78) 52%,rgba(38,27,15,.90) 100%),
    url('hero-bg.jpg') center 30%/cover no-repeat #33261A;
  padding:8rem 0 5rem;
  min-height:100vh;min-height:100dvh;
  display:flex;align-items:center;
}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(30,21,11,.55),transparent 26%);pointer-events:none}
.hero::after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,rgba(198,160,80,.65) 25%,rgba(198,160,80,.65) 75%,transparent);pointer-events:none}
.hero .container{position:relative;width:min(1160px,92%);display:grid;grid-template-columns:1.08fr .92fr;gap:3.6rem;align-items:center;z-index:2}
.hero h1{font-size:clamp(1.8rem,3.7vw,2.7rem);color:#FBF7ED;font-weight:600;line-height:1.8}
.hero h1 .gold{color:var(--accent-soft)}
.hero p.lead{color:var(--on-navy-muted);font-size:1.02rem;margin:1.3rem 0 2rem;max-width:33rem;font-weight:300}
.cta-row{display:flex;gap:.85rem;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:.55rem;font-family:'Alexandria',sans-serif;font-weight:600;padding:.72rem 1.6rem;border-radius:var(--radius-sm);font-size:.95rem;transition:transform .2s var(--ease),background .2s var(--ease),box-shadow .2s var(--ease),border-color .2s var(--ease)}
.btn:hover{transform:translateY(-2px)}
.btn svg{width:18px;height:18px}
/* Primary */
.btn-gold{background:var(--accent);color:#33261A;box-shadow:var(--shadow-sm)}
.btn-gold:hover{background:var(--accent-soft)}
/* Secondary (فاتح) */
.btn-pearl{background:var(--surface);color:var(--foreground);border:1px solid var(--border);box-shadow:var(--shadow-sm)}
.btn-pearl:hover{border-color:var(--accent-line)}
/* Outline */
.btn-line{border:1px solid var(--border);color:var(--foreground);background:transparent}
.btn-line:hover{border-color:var(--accent);color:var(--foreground)}
.hero .btn-line{color:var(--on-navy);border-color:rgba(240,232,216,.28)}
.hero .btn-line:hover{border-color:var(--accent-soft);background:rgba(240,232,216,.05)}
.hero-stats{display:flex;margin-top:2.6rem;flex-wrap:wrap;border-top:1px solid var(--border-navy);padding-top:1.5rem}
.stat{padding-inline:1.7rem;border-left:1px solid var(--border-navy)}
.stat:first-child{padding-right:0}
.stat:last-child{border-left:0}
.stat b{font-family:'Alexandria',sans-serif;font-weight:600;font-size:1.18rem;color:#FBF7ED;display:block;line-height:1.9}
.stat span{font-size:.78rem;color:var(--on-navy-muted);font-weight:300}

/* صورة المحامي — إطار فاخر بتأثيرات ناعمة */
.hex-wrap{position:relative;width:min(400px,100%);margin-inline:auto}
.hex-glow{position:absolute;inset:-8%;background:radial-gradient(closest-side,rgba(198,160,80,.22),transparent 70%);animation:softGlow 7s ease-in-out infinite}
@keyframes softGlow{0%,100%{opacity:.55}50%{opacity:1}}
.hex-wrap::before,.hex-wrap::after{content:"";position:absolute;border-radius:50%;background:var(--accent);opacity:.5;z-index:2}
.hex-wrap::before{width:9px;height:9px;top:9%;left:6%;animation:drift 9s ease-in-out infinite}
.hex-wrap::after{width:6px;height:6px;bottom:16%;right:3%;animation:drift 11s ease-in-out infinite reverse}
@keyframes drift{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
.hex-outer{
  clip-path:polygon(50% 0%,97% 25%,97% 75%,50% 100%,3% 75%,3% 25%);
  background:linear-gradient(170deg,rgba(198,160,80,.65),rgba(198,160,80,.15) 55%,rgba(198,160,80,.55));
  padding:2px;position:relative;
  animation:heroFloat 9s ease-in-out infinite;
  transition:transform .35s var(--ease);
  filter:drop-shadow(0 22px 40px rgba(30,21,12,.35));
}
.hex-wrap:hover .hex-outer{transform:translateY(-6px) scale(1.012)}
@keyframes heroFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.hex-frame{
  clip-path:polygon(50% 0%,97% 25%,97% 75%,50% 100%,3% 75%,3% 25%);
  background:var(--navy-3);padding:10px;
}
.hex-frame img{clip-path:polygon(50% 0%,97% 25%,97% 75%,50% 100%,3% 75%,3% 25%);width:100%;aspect-ratio:1/1.07;object-fit:cover;object-position:top;transition:transform .5s var(--ease)}
.hex-wrap:hover .hex-frame img{transform:scale(1.03)}
.hex-badge{
  position:absolute;bottom:-16px;right:50%;transform:translateX(50%);
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);
  box-shadow:var(--shadow-md);padding:.6rem 1.4rem;text-align:center;
  width:max-content;max-width:min(92vw,360px);
}
.hex-badge b{font-family:'Alexandria',sans-serif;font-weight:600;color:var(--foreground);font-size:.95rem;display:block}
.hex-badge span{font-size:.72rem;color:var(--muted)}

/* ============ الأقسام ============ */
.sec{padding:4.8rem 0;position:relative}
.sec.pearl{background:var(--surface)}
.sec.pearl::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(640px 320px at 92% 0%,rgba(198,160,80,.05),transparent 65%)}
.sec.deep{background:var(--surface-2);border-block:1px solid var(--border)}
.sec-head{text-align:center;max-width:46rem;margin:0 auto 3rem;position:relative}
.eyebrow{display:inline-block;font-weight:600;color:var(--accent);font-size:.78rem;letter-spacing:1.5px;background:var(--accent-tint);border:1px solid var(--accent-line);padding:.3rem 1.1rem;border-radius:50px;margin-bottom:1rem}
.sec-head h2{font-size:clamp(1.45rem,2.8vw,1.95rem);color:var(--foreground)}
.sec-head p{color:var(--muted);margin-top:1rem;font-weight:300;font-size:.97rem}

/* ============ البطاقات ============ */
.grid{display:grid;gap:1.3rem}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.card{
  background:var(--surface);
  border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:1.9rem 1.6rem;
  transition:transform .22s var(--ease),box-shadow .22s var(--ease),border-color .22s var(--ease);
  position:relative;
}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--accent-line)}
.hexicon{
  width:52px;height:52px;display:grid;place-items:center;margin-bottom:1.2rem;
  background:var(--accent-tint);border:1px solid var(--accent-line);border-radius:var(--radius-md);
  transition:background .22s var(--ease);
}
.card:hover .hexicon{background:#EFE7D2}
.hexicon svg{width:24px;height:24px;stroke:var(--accent);stroke-width:1.7}
.card h3{font-size:1.05rem;margin-bottom:.45rem;color:var(--foreground)}
.card p{color:var(--muted);font-size:.9rem;font-weight:300}
.card .more{display:inline-flex;align-items:center;gap:.35rem;margin-top:1rem;color:var(--accent);font-weight:600;font-size:.85rem;font-family:'Alexandria',sans-serif;transition:gap .2s var(--ease)}
.card:hover .more{gap:.55rem}

/* ============ من نحن ============ */
.about-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:3.6rem;align-items:center}
.about-grid .hex-wrap{width:min(340px,100%)}
.about-grid .hex-frame{background:var(--surface-2)}
.about-txt h2{font-size:clamp(1.45rem,2.8vw,1.9rem);margin-bottom:1.1rem}
.about-txt p{color:var(--muted);margin-bottom:1rem;font-weight:300}
.about-txt strong{color:var(--foreground);font-weight:600}
.about-txt .eyebrow{margin-bottom:1.1rem}
.ticks{display:grid;gap:.65rem;margin:1.3rem 0 1.8rem}
.ticks li{list-style:none;display:flex;gap:.65rem;align-items:flex-start;font-weight:500;font-size:.93rem;color:var(--foreground)}
.ticks svg{width:19px;height:19px;flex-shrink:0;stroke:var(--accent);margin-top:6px}
.about-txt .btn-gold{background:var(--navy);color:#fff}
.about-txt .btn-gold:hover{background:var(--navy-2)}

/* ============ لماذا نحن — Navy band ============ */
.why-dark{
  background:
    radial-gradient(680px 360px at 12% 0%,rgba(198,160,80,.08),transparent 60%),
    linear-gradient(165deg,#2C2014,#3E2E1C);
  color:var(--on-navy);padding:4.8rem 0;position:relative;overflow:hidden;
}
.why-dark::before{content:"";position:absolute;inset:0;opacity:.3;
  background-image:linear-gradient(rgba(240,232,216,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(240,232,216,.04) 1px,transparent 1px);
  background-size:52px 52px;
  -webkit-mask-image:radial-gradient(800px 420px at 50% 0%,#000 20%,transparent 78%);
  mask-image:radial-gradient(800px 420px at 50% 0%,#000 20%,transparent 78%);}
.why-dark .container{position:relative}
.why-dark .sec-head h2{color:#FBF7ED}
.why-dark .sec-head p{color:var(--on-navy-muted)}
.why-dark .eyebrow{background:rgba(198,160,80,.1);border-color:rgba(198,160,80,.35);color:var(--accent-soft)}
.why-dark .card{background:rgba(240,232,216,.04);border-color:var(--border-navy);text-align:center}
.why-dark .card:hover{border-color:rgba(198,160,80,.4);background:rgba(240,232,216,.07);box-shadow:none}
.why-dark .card h3{color:#FBF7ED}
.why-dark .card p{color:var(--on-navy-muted)}
.why-dark .hexicon{margin-inline:auto;background:rgba(198,160,80,.1);border-color:rgba(198,160,80,.3)}
.why-dark .hexicon svg{stroke:var(--accent-soft)}

/* ============ الخطوات ============ */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1.3rem;counter-reset:st}
.step{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.8rem 1.5rem 1.5rem;position:relative;transition:transform .22s var(--ease),box-shadow .22s var(--ease),border-color .22s var(--ease)}
.step:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--accent-line)}
.step::before{counter-increment:st;content:counter(st,arabic-indic);position:absolute;top:-15px;right:1.4rem;width:34px;height:34px;border-radius:50%;background:var(--navy);color:var(--accent-soft);display:grid;place-items:center;font-family:'Alexandria',sans-serif;font-weight:600;font-size:.95rem;border:1px solid var(--accent-line)}
.step h3{font-size:1rem;margin:.5rem 0 .35rem}
.step p{font-size:.87rem;color:var(--muted);font-weight:300}

/* ============ المقالات ============ */
.post-card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;transition:transform .22s var(--ease),box-shadow .22s var(--ease),border-color .22s var(--ease)}
.post-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--accent-line)}
.post-top{background:linear-gradient(160deg,#33261A,#453320);padding:1.35rem 1.5rem;display:flex;align-items:center;gap:.9rem;position:relative}
.post-top::after{content:"";position:absolute;bottom:0;right:1.5rem;left:1.5rem;height:1px;background:linear-gradient(90deg,transparent,rgba(198,160,80,.5),transparent)}
.post-top .hexicon{margin:0;width:44px;height:44px;background:rgba(198,160,80,.1);border-color:rgba(198,160,80,.3)}
.post-top .hexicon svg{stroke:var(--accent-soft);width:21px;height:21px}
.post-top .tag{font-size:.74rem;font-weight:500;color:var(--on-navy);background:rgba(240,232,216,.07);border:1px solid var(--border-navy);padding:.24rem .85rem;border-radius:50px}
.post-body{padding:1.4rem 1.5rem 1.6rem;flex:1;display:flex;flex-direction:column}
.post-body h3{font-size:1rem;line-height:1.85;margin-bottom:.5rem}
.post-body p{color:var(--muted);font-size:.88rem;flex:1;font-weight:300}
.post-body .more{margin-top:1.1rem;color:var(--accent);font-weight:600;font-size:.85rem;font-family:'Alexandria',sans-serif}

/* صفحة المقال */
.article{max-width:820px;margin-inline:auto;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:2.8rem clamp(1.4rem,4vw,3rem);box-shadow:var(--shadow-sm)}
.article h1{font-size:clamp(1.45rem,3vw,1.95rem);margin-bottom:1rem;font-weight:600}
.article .meta{display:flex;gap:1.1rem;flex-wrap:wrap;color:var(--muted);font-size:.82rem;margin-bottom:2rem;padding-bottom:1.4rem;border-bottom:1px solid var(--border)}
.article h2{font-size:1.28rem;color:var(--foreground);margin:2.3rem 0 .8rem;padding-right:.9rem;border-right:3px solid var(--accent)}
.article h3{font-size:1.05rem;margin:1.6rem 0 .6rem}
.article p{color:var(--muted);margin-bottom:1rem;font-weight:300}
.article strong{color:var(--foreground);font-weight:600}
.article ul,.article ol{margin:0 1.4rem 1.2rem 0;color:var(--muted);font-weight:300}
.article li{margin-bottom:.5rem}
.article .box{background:var(--accent-tint);border:1px solid var(--accent-line);border-radius:var(--radius-md);padding:1.2rem 1.4rem;margin:1.7rem 0}
.article .box b{color:var(--foreground)}
.faq details{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:.95rem 1.35rem;margin-bottom:.7rem;transition:border-color .2s var(--ease)}
.faq details[open]{border-color:var(--accent-line);background:#FCF9F2}
.faq summary{font-family:'Alexandria',sans-serif;font-weight:600;font-size:.95rem;cursor:pointer;color:var(--foreground)}
.faq details[open] summary{color:var(--accent)}
.faq p{margin-top:.7rem}
.article-cta{background:linear-gradient(160deg,#2C2014,#453320);border-radius:var(--radius-lg);padding:2.2rem;text-align:center;color:var(--on-navy);margin-top:2.8rem;position:relative;overflow:hidden}
.article-cta::before{content:"";position:absolute;top:0;right:15%;left:15%;height:1px;background:linear-gradient(90deg,transparent,rgba(198,160,80,.6),transparent)}
.article-cta h2{color:#FBF7ED;margin:0 0 .5rem;border:0;padding:0;font-size:1.35rem}
.article-cta p{color:var(--on-navy-muted);font-weight:300}
.article-cta .btn{margin-top:1.1rem}

/* ============ تواصل ============ */
.c-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:2rem;text-align:center;transition:transform .22s var(--ease),box-shadow .22s var(--ease),border-color .22s var(--ease)}
.c-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--accent-line)}
.c-card .hexicon{margin-inline:auto}
.c-card h3{margin-bottom:.4rem}
.c-card p{color:var(--muted);font-size:.88rem;margin-bottom:1.2rem;font-weight:300}
.c-card .btn-gold{background:var(--navy);color:#fff}
.c-card .btn-gold:hover{background:var(--navy-2)}

/* ============ CTA النهائي ============ */
.big-cta{
  position:relative;color:var(--on-navy);text-align:center;padding:5rem 0;overflow:hidden;
  background:
    radial-gradient(600px 300px at 50% 0%,rgba(198,160,80,.1),transparent 68%),
    linear-gradient(165deg,#2C2014,#3E2E1C)}
.big-cta::before{content:"";position:absolute;top:0;right:20%;left:20%;height:1px;background:linear-gradient(90deg,transparent,rgba(198,160,80,.55),transparent)}
.big-cta .container{position:relative}
.big-cta h2{font-size:clamp(1.5rem,2.8vw,2.05rem);color:#FBF7ED;margin-bottom:.9rem}
.big-cta p{color:var(--on-navy-muted);max-width:36rem;margin:0 auto 1.8rem;font-weight:300}

/* ============ الفوتر ============ */
footer.site{background:#251B10;color:var(--on-navy-muted);padding:3.6rem 0 0;border-top:1px solid rgba(198,160,80,.25)}
.f-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.2fr;gap:2.4rem;padding-bottom:2.6rem}
.f-grid img{width:66px;margin-bottom:1rem;opacity:.95}
.f-grid h4{color:#F0E8D8;font-size:.98rem;font-weight:600;margin-bottom:1rem;position:relative;padding-bottom:.55rem}
.f-grid h4::after{content:"";position:absolute;bottom:0;right:0;width:26px;height:2px;background:var(--accent);border-radius:2px}
.f-grid p{font-size:.84rem;font-weight:300}
.f-grid a{display:block;font-size:.87rem;padding:.28rem 0;color:var(--on-navy-muted);transition:color .2s var(--ease),padding .2s var(--ease)}
.f-grid a:hover{color:#F0E8D8;padding-right:.4rem}
.f-bottom{border-top:1px solid var(--border-navy);padding:1.2rem 0;text-align:center;font-size:.78rem;color:#6B7683}
.f-bottom a{color:var(--accent-soft)}

/* ============ أزرار عائمة ============ */
.float-btns{position:fixed;bottom:24px;left:24px;z-index:80;display:flex;flex-direction:column;gap:.75rem}
.fab{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;box-shadow:var(--shadow-md);transition:transform .2s var(--ease),box-shadow .2s var(--ease)}
.fab:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(51,38,26,.22)}
.fab svg{width:24px;height:24px;fill:currentColor}
.fab.wa{background:var(--accent);color:#33261A}
.fab.tel{background:var(--navy);color:var(--accent-soft);border:1px solid rgba(198,160,80,.35)}

/* ============ أنيميشن الظهور ============ */
.reveal{opacity:0;transform:translateY(16px);transition:opacity .45s var(--ease),transform .45s var(--ease)}
.reveal.in{opacity:1;transform:none}
.d1{transition-delay:.06s}.d2{transition-delay:.12s}.d3{transition-delay:.18s}.d4{transition-delay:.24s}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  .btn:hover,.card:hover,.step:hover,.post-card:hover,.c-card:hover,.fab:hover{transform:none}
  .hex-outer,.hex-glow,.hex-wrap::before,.hex-wrap::after{animation:none}
}

/* ============ رأس الصفحات الداخلية ============ */
.page-hero{
  position:relative;color:var(--on-navy);text-align:center;padding:3.4rem 0;overflow:hidden;
  background:
    radial-gradient(480px 240px at 50% 110%,rgba(198,160,80,.1),transparent 68%),
    linear-gradient(165deg,#2C2014,#3E2E1C)}
.page-hero::after{content:"";position:absolute;bottom:0;right:25%;left:25%;height:1px;background:linear-gradient(90deg,transparent,rgba(198,160,80,.55),transparent)}
.page-hero h1{font-size:clamp(1.55rem,3.1vw,2.2rem);color:#FBF7ED}
.crumbs{font-size:.83rem;color:var(--on-navy-muted);margin-top:.7rem;font-weight:300}
.crumbs a{color:var(--accent-soft);font-weight:500}

/* ============ استجابة ============ */
@media(max-width:1000px){
  .g4{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(2,1fr);row-gap:1.9rem}
  .f-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:840px){
  .hero{padding:7.5rem 0 6rem;min-height:auto;display:block}
  .hero .container{grid-template-columns:1fr;text-align:center;gap:3.4rem}
  .hero p.lead{margin-inline:auto}
  .cta-row{justify-content:center}
  .hero-stats{justify-content:center}
  .stat:first-child{padding-right:1.7rem}
  .about-grid{grid-template-columns:1fr}
  .g3{grid-template-columns:1fr 1fr}
  nav.menu{
    position:fixed;top:0;left:0;bottom:0;width:74vw;height:100vh;height:100dvh;
    place-self:stretch;background:var(--background);
    flex-direction:column;justify-content:center;align-items:center;gap:2rem;
    transform:translateX(-120%);visibility:hidden;
    transition:transform .3s var(--ease),visibility .3s;
    box-shadow:-10px 0 40px rgba(51,38,26,.14);z-index:70;
  }
  nav.menu.open{transform:none;visibility:visible}
  .burger{display:flex;z-index:75}
  nav.menu .menu-contact{display:block}
  .contact-btn{padding:.55rem;border-radius:50%}
  .contact-btn span{display:none}
  .nav{grid-template-columns:auto 1fr auto auto;gap:.8rem}
  .brand{grid-column:1;grid-row:1}
  .contact-btn{grid-column:3;grid-row:1;justify-self:end}
  .burger{grid-column:4;grid-row:1}
  .burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .burger.open span:nth-child(2){opacity:0}
  .burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
}
@media(max-width:560px){
  .g3,.g4,.steps,.contact-3{grid-template-columns:1fr !important}
  .sec{padding:3.4rem 0}
  .stat{padding-inline:1rem}
  .article{padding:1.8rem 1.2rem}
}

/* ============ هيدر الرئيسية الموحد مع الهيرو ============ */
header.site.hero-header{
  position:fixed;top:0;left:0;right:0;
  background:transparent;border-image:none;border-bottom:1px solid rgba(240,232,216,.14);
  box-shadow:none;backdrop-filter:none;
  transition:background .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease);
}
header.site.hero-header nav.menu a{color:rgba(240,232,216,.82)}
header.site.hero-header nav.menu a:hover{color:#FBF7ED}
header.site.hero-header nav.menu a.active{color:#FBF7ED}
header.site.hero-header .burger span{background:#F0E8D8}
header.site.hero-header.scrolled{
  background:linear-gradient(180deg,rgba(40,28,15,.96),rgba(56,41,23,.94));
  backdrop-filter:blur(14px);
  box-shadow:0 2px 22px rgba(20,14,7,.35);
  border-bottom:1px solid rgba(198,160,80,.3);
}
@media(max-width:840px){
  header.site.hero-header nav.menu a{color:var(--muted)}
  header.site.hero-header nav.menu a.active,header.site.hero-header nav.menu a:hover{color:var(--foreground)}
}