/* ========== الأساسيات و المتغيرات ========== */
:root{
  --gold:#bfa36b;
  --gold-2:#cbb27a;
  --ink:#1f2226;
  --ink-2:#34383e;
  --stone:#6b7280;
  --bg:#faf9f7;
  --white:#ffffff;

  --radius-2xl: 1.25rem;
  --radius-xl: .875rem;
  --radius-lg: .65rem;

  --shadow-sm: 0 6px 18px rgba(31,34,38,.08);
  --shadow-md: 0 12px 30px rgba(31,34,38,.12);
  --shadow-lg: 0 18px 46px rgba(31,34,38,.18);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{height:100%}
body{
  margin:0;
  font-family: "Tajawal", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--ink);
  background: var(--bg);
  line-height:1.7;
}
img{max-width:100%;display:block}
a{color:var(--ink);text-decoration:none}
a:hover{color:var(--gold)}
.container{
  width:min(1180px, 92vw);
  margin-inline:auto;
}

/* ========== هيدر أنيق / لامع ========== */
.site-header{
  position:sticky; top:0; z-index:1000;
  background: linear-gradient(180deg, rgba(255,255,255,.9), rgba(255,255,255,.7));
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(191,163,107,.25);
}
.header-wrap{
  display:flex; align-items:center; justify-content:space-between;
  padding: .8rem 0;
}
.brand{display:flex; align-items:center; gap:.7rem}
.brand-logo{
  width:65px; height:65px; object-fit:contain;
  filter: drop-shadow(0 4px 8px rgba(191,163,107,.25));
}
.brand-text strong{
  display:block; font-weight:800;color:var(--gold) ;font-size:26px; letter-spacing:.9px;
}
.brand-text span{font-size:.75rem; color:var(--stone)}

.main-nav{display:flex; align-items:center; gap:1.2rem}
.main-nav a{
  padding:.55rem .9rem; border-radius:999px; font-weight:600; font-size:.95rem;
  transition:.25s ease;
}
.main-nav a:hover{background:rgba(191,163,107,.12)}
.btn-link{
  border:1px solid var(--gold); color:var(--ink);
  box-shadow: var(--shadow-sm);
}
.menu-toggle{display:none}

/* ========== أزرار عامة ========== */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:.9rem 1.2rem; border-radius:999px; font-weight:700;
  border:1px solid transparent; transition: .25s ease; cursor:pointer;
  box-shadow: var(--shadow-sm);
}
.btn.primary{
  background: linear-gradient(135deg, var(--gold), var(--gold-2));
  color:var(--white);
}
.btn.primary:hover{filter:brightness(.98); transform: translateY(-1px)}
.btn.ghost{
  background:transparent; border-color:var(--gold); color:var(--ink);
}
.btn.ghost:hover{background: rgba(191,163,107,.08)}

/* ========== hero — خلفية مستوحاة من الأقمشة ========== */
.hero-section{
  position:relative; isolation:isolate; overflow:hidden;
}
.hero-media{
  position:absolute; inset:0; z-index:-1;
  background:
    radial-gradient(1200px 500px at 90% -10%, rgba(191,163,107,.22), transparent 60%),
    radial-gradient(900px 500px at 10% 110%, rgba(191,163,107,.18), transparent 65%),
    url("") center/cover no-repeat fixed;
  filter: contrast(1.02) saturate(1.02) blur(1);
}
.hero-content{
  padding: 8rem 0 5rem;
  color:var(--ink);
}
.hero-title{
  font-size: clamp(1.8rem, 3.2vw + 1rem, 3rem);
  line-height:1.25; margin:0 0 1rem;
  text-shadow: 0 2px 12px rgba(255,255,255,.55);
}
.hero-lead{
  max-width: 72ch; color:#27303b; background: rgba(255,255,255,.72);
  padding: 1rem 1.25rem; border-radius: var(--radius-xl);
  border: 1px solid rgba(191,163,107,.25); box-shadow: var(--shadow-sm);
}
.hero-cta{display:flex; gap:.6rem; margin-top:1rem}
.hero-badges::before,
.hero-badges::after{
  content:""; display:block; width:180px; height:180px; border-radius:50%;
  background:
    radial-gradient(circle at 50% 50%, rgba(191,163,107,.35) 0 40%, transparent 41%),
    conic-gradient(from 0deg, rgba(191,163,107,.35) 0 10%, transparent 10% 20%, rgba(191,163,107,.35) 20% 30%, transparent 30% 40%, rgba(191,163,107,.35) 40% 50%, transparent 50% 100%);
  filter: blur(1px); opacity:.45;
  position:absolute; inset-inline-start: -60px; top: 40px;
}
.hero-badges::after{
  inset-inline-start:auto; inset-inline-end:-70px; top:auto; bottom: -50px;
}

/* سهم انتقال للقسم التالي */
.section-jump{
  position:absolute; bottom:22px; inset-inline-start:50%; translate:-50% 0;
  width:38px; height:38px; border-radius:50%;
  border:1px solid rgba(191,163,107,.55);
  box-shadow: var(--shadow-sm); background: rgba(255,255,255,.75);
}
.section-jump::before{
  content:""; position:absolute; inset:11px 12px; border-inline-start:2px solid var(--gold); border-bottom:2px solid var(--gold); transform: rotate(-45deg);
}

/* ========== أقسام عامة ========== */
.section{padding: 4.5rem 0; position:relative}
.section::after{
  /* فاصل زخرفي دقيق مستوحى من تموجات القماش */
  content:""; position:absolute; inset-inline:0; bottom:-1px; height:1px;
  background: linear-gradient(90deg, transparent, rgba(191,163,107,.35), transparent);
}
.section-title{
  font-size: clamp(1.4rem, 1.6vw + .6rem, 2rem);
  margin:0 0 1rem; letter-spacing:.3px;
}
.section-note{color:var(--stone)}

/* ========== شبكة عمودين ========== */
.two-col{
  display:grid; grid-template-columns: 1.1fr .9fr; gap:2rem;
}
@media (max-width: 900px){
  .two-col{grid-template-columns: 1fr; gap:1.25rem}
}

/* ========== من نحن ========== */
.about-section{background:
  radial-gradient(900px 400px at 20% -10%, rgba(191,163,107,.07), transparent 60%),
  radial-gradient(800px 380px at 100% 110%, rgba(191,163,107,.06), transparent 55%);
}
.card-list{
  display:grid; gap:1rem; margin-top:1.2rem;
}
.card{
  background: var(--white);
  border:1px solid rgba(191,163,107,.22);
  border-radius: var(--radius-2xl);
  padding:1.1rem 1.2rem; box-shadow: var(--shadow-sm);
}
.card-title{margin:0 0 .35rem; font-size:1.1rem}
.goals-list{margin:.5rem 0 0; padding-inline-start: 1.2rem}
.goals-list li{margin:.3rem 0}

.about-media{
  display:grid; gap:1rem; align-content:start;
}
.fabric-frame{
  height: 180px; border-radius: var(--radius-2xl);
  box-shadow: var(--shadow-md);
  background-size: cover; background-position:center;
  border:1px solid rgba(191,163,107,.25);
}
.fabric-1{ background-image: url("https://alnassaj.com/wp-content/uploads/2024/10/linen-fabric-scaled-1024x543.jpg"); }
.fabric-2{ background-image: url("https://m.arabic.upholsterysofafabric.com/test/upholsterysofafabric.com/photo/pl33153008-remark.jpg"); }
.fabric-3{ background-image: url("https://images-cdn.ubuy.ke/6376b2c76a54614a7728a3c8-coated-linen-fabric-sofa-cushion-fabric.jpg"); }

/* ========== الخدمات ========== */
.services-section{background: linear-gradient(180deg, #fff, #fff7) }
.service-grid{
  display:grid; grid-template-columns: repeat(2, 1fr); gap:1rem; margin-top:1rem;
}
@media (max-width: 700px){ .service-grid{grid-template-columns: 1fr} }
.service-card{
  background: var(--white);
  border:1px solid rgba(191,163,107,.22);
  border-radius: var(--radius-xl);
  padding:1.1rem 1.2rem;
  box-shadow: var(--shadow-sm);
  position:relative; overflow:hidden;
}
.service-card::after{
  content:""; position:absolute; inset:auto -40% -40% auto; width:180px; height:180px; border-radius:50%;
  background: radial-gradient(circle, rgba(191,163,107,.18), transparent 60%);
  pointer-events:none;
}

/* ========== المنتجات ========== */
.products-section{background:
  linear-gradient(0deg, rgba(191,163,107,.04), transparent 40%),
  repeating-linear-gradient(135deg, rgba(191,163,107,.05) 0 2px, transparent 2px 8px);
}
.section-head{display:flex; align-items:baseline; justify-content:space-between; gap:1rem}
.products-grid{
  margin-top:1rem;
  display:grid; grid-template-columns: repeat(3, 1fr); gap:1rem;
}
@media (max-width: 980px){ .products-grid{grid-template-columns: repeat(2, 1fr)} }
@media (max-width: 620px){ .products-grid{grid-template-columns: 1fr} }

.product-card{
  display:block; aspect-ratio: 4/3; border-radius: var(--radius-2xl);
  background: #ddd center/cover no-repeat;
  border: 1px solid rgba(191,163,107,.25);
  box-shadow: var(--shadow-md);
  position:relative; overflow:hidden;
  transform: translateZ(0);
}
.product-card::before{
  /* طبقة نسيج خفيفة */
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0)),
    url("assets/weave.png");
  mix-blend-mode: overlay; opacity:.45;
}
.product-card:hover{transform: translateY(-2px); box-shadow: var(--shadow-lg)}

/* ضع هنا صور المنتجات كرّرها كما تشاء */
.p1{ background-image:url("https://www.fabricsegypt.com/assets/images/blogs/1754899411%D8%A7%D9%82%D9%85%D8%B4%D8%A9%20%D8%B3%D8%AA%D8%A7%D8%A6%D8%B1%20f.jpg"); }
.p2{ background-image:url("https://alnassaj.com/wp-content/uploads/2025/03/%D9%86%D8%B5%D8%A7%D8%A6%D8%AD-%D8%B0%D9%87%D8%A8%D9%8A%D8%A9-%D9%84%D8%A7%D8%AE%D8%AA%D9%8A%D8%A7%D8%B1-%D8%A7%D9%82%D9%85%D8%B4%D8%A9-%D8%A8%D8%B1%D8%A7%D8%AF%D9%8A-%D9%88%D8%AA%D9%86%D8%AC%D9%8A%D8%AF-%D8%B9%D8%A7%D9%84%D9%8A%D8%A9-%D8%A7%D9%84%D8%AC%D9%88%D8%AF%D8%A9-1024x576.jpg"); }
.p3{ background-image:url("https://www.hychinafabric.com/uploads/23053/list/p2024022115530842df5.jpg"); }

/* ========== التواصل ========== */
.contact-section{background:
  radial-gradient(700px 300px at 15% -10%, rgba(191,163,107,.08), transparent 60%),
  radial-gradient(700px 300px at 100% 110%, rgba(191,163,107,.07), transparent 55%);
}
.contact-wrap{gap:2rem}
.contact-info .contact-block{
  background: var(--white); border:1px solid rgba(191,163,107,.22);
  border-radius: var(--radius-xl); padding: .9rem 1rem; margin-top:.7rem;
  box-shadow: var(--shadow-sm);
}
.contact-list{list-style:none; margin:.35rem 0 0; padding:0}
.contact-list a{color:var(--ink-2); font-weight:700}
.contact-actions{display:flex; gap:.6rem; margin-top:1rem}


/* ========== تذييل ========== */
.site-footer{
  background:#181a1e; color:#dfe3ea; padding: 2rem 0;
  border-top:1px solid rgba(191,163,107,.25);
}
.footer-wrap{display:flex; align-items:center; justify-content:space-between; gap:1rem}
.foot-brand{display:flex; align-items:center; gap:.5rem}
.foot-brand img{width:48px; height:48px}
.footer-nav{display:flex; gap:1rem}
.footer-nav a{color:#cfcfcf}
.footer-nav a:hover{color:var(--gold)}
.legal{opacity:.75}
@media (max-width: 760px){
  .footer-wrap{flex-direction:column; text-align:center}
}

/* ========== زر الرجوع للأعلى ========== */
.back-to-top{
  position:fixed; inset-inline-end:18px; bottom:18px; width:42px; height:42px; border-radius:50%;
  background: var(--white);
  border:1px solid rgba(191,163,107,.45);
  box-shadow: var(--shadow-md);
  opacity:.0; pointer-events:none; transition:.25s ease;
}
.back-to-top::before{
  content:""; position:absolute; inset:12px 13px; border-inline-end:2px solid var(--gold); border-top:2px solid var(--gold); transform: rotate(-45deg);
}
:target ~ .back-to-top,
body:has(#top:target) .back-to-top{opacity:1; pointer-events:auto}

/* ========== تحسينات صغيرة ========== */
.section .container{position:relative}
.section .container::before{
  /* زخرفة منقطة مستلهمة من نقطة الشعار */
  content:""; position:absolute; inset-inline-start:-18px; top:-18px; width:36px; height:36px; border-radius:50%;
  background:
    radial-gradient(circle at 50% 50%, rgba(191,163,107,.9) 4px, transparent 5px) 0 0/12px 12px,
    radial-gradient(circle at 50% 50%, rgba(191,163,107,.35) 2px, transparent 3px) 0 0/12px 12px;
  opacity:.22; filter:saturate(1.1);
}

/* لإخفاء عناصر الموبايل التي لم نفعّلها JS */
.mobile-drawer, .menu-toggle{display:none !important}