:root {
  --green-950:#061d15;
  --green-900:#0a2f22;
  --green-800:#104b35;
  --green-700:#176747;
  --green-500:#2c9162;
  --gold:#c89521;
  --gold-soft:#f0ce73;
  --cream:#f8f5eb;
  --paper:#fffdf7;
  --ink:#102018;
  --muted:#657168;
  --line:rgba(11,64,44,.14);
  --glass:rgba(255,253,247,.78);
  --shadow:0 24px 70px rgba(5,37,25,.13);
  --radius:28px;
  --container:min(1180px,calc(100% - 40px));
}

[data-theme="dark"] {
  --cream:#071912;
  --paper:#0b2319;
  --ink:#f2f6f0;
  --muted:#a5b4aa;
  --line:rgba(240,206,115,.16);
  --glass:rgba(7,25,18,.78);
  --shadow:0 24px 70px rgba(0,0,0,.28);
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:100px; }
body {
  margin:0;
  color:var(--ink);
  background:var(--cream);
  font-family:Inter,"Segoe UI",Arial,sans-serif;
  font-size:16px;
  line-height:1.7;
  overflow-x:hidden;
  transition:background .5s ease,color .5s ease;
}
html[dir="rtl"] body { font-family:"Noto Kufi Arabic","Segoe UI",Tahoma,sans-serif; }
body::before,body::after {
  content:"";
  position:fixed;
  width:42vw;
  height:42vw;
  border-radius:50%;
  filter:blur(100px);
  opacity:.12;
  z-index:-2;
  pointer-events:none;
  animation:ambient 16s ease-in-out infinite alternate;
}
body::before { background:var(--green-500); left:-18vw; top:12vh; }
body::after { background:var(--gold); right:-18vw; bottom:-10vh; animation-delay:-8s; }
@keyframes ambient { to { transform:translate3d(8vw,-7vh,0) scale(1.15); } }

a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
button,input,textarea,select { font:inherit; }
button { color:inherit; }
.container { width:var(--container); margin-inline:auto; }
.section { padding:110px 0; position:relative; }
.section-tight { padding:72px 0; }
.eyebrow {
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:var(--green-700);
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-size:.75rem;
}
[data-theme="dark"] .eyebrow { color:var(--gold-soft); }
.eyebrow::before { content:""; width:34px; height:1px; background:var(--gold); }
h1,h2,h3,p { margin-top:0; }
h1,h2,h3 { font-family:"Cormorant Garamond",Georgia,serif; line-height:1.02; letter-spacing:-.025em; }
html[dir="rtl"] h1,html[dir="rtl"] h2,html[dir="rtl"] h3 { font-family:"Noto Kufi Arabic","Segoe UI",sans-serif; letter-spacing:0; line-height:1.35; }
h1 { font-size:clamp(3.4rem,7vw,7.4rem); font-weight:600; margin-bottom:24px; }
h2 { font-size:clamp(2.5rem,5vw,4.8rem); font-weight:600; margin-bottom:24px; }
h3 { font-size:clamp(1.5rem,2.4vw,2rem); margin-bottom:12px; }
.lead { font-size:clamp(1.05rem,1.6vw,1.22rem); color:var(--muted); max-width:690px; }
.section-head { display:flex; justify-content:space-between; gap:32px; align-items:end; margin-bottom:54px; }
.section-head > div:first-child { max-width:760px; }
.section-head h2 { margin:10px 0 0; }
.gold { color:var(--gold); }
.btn-row { display:flex; flex-wrap:wrap; gap:13px; align-items:center; }
.btn {
  min-height:52px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:13px 22px;
  border-radius:999px;
  border:1px solid transparent;
  background:var(--green-800);
  color:white;
  font-weight:800;
  cursor:pointer;
  transition:transform .25s,box-shadow .25s,background .25s;
}
.btn:hover { transform:translateY(-3px); box-shadow:0 14px 34px rgba(13,77,52,.24); }
.btn-gold { background:var(--gold); color:#102018; }
.btn-outline { background:transparent; color:var(--ink); border-color:var(--line); }
.btn-outline:hover { border-color:var(--gold); }
.arrow { font-size:1.2rem; transition:transform .25s; }
.btn:hover .arrow { transform:translateX(4px); }
html[dir="rtl"] .btn:hover .arrow { transform:translateX(-4px); }

/* Header */
.site-header {
  position:fixed;
  inset:18px 0 auto;
  z-index:100;
  transition:all .35s cubic-bezier(.2,.8,.2,1);
}
.nav-shell {
  width:var(--container);
  margin:auto;
  min-height:84px;
  padding:10px 14px 10px 18px;
  display:flex;
  align-items:center;
  gap:24px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:24px;
  background:rgba(6,29,21,.25);
  backdrop-filter:blur(18px) saturate(140%);
  box-shadow:0 10px 40px rgba(0,0,0,.08);
  color:white;
}
.site-header.scrolled { inset:8px 0 auto; }
.site-header.scrolled .nav-shell { min-height:66px; border-radius:18px; background:var(--glass); color:var(--ink); border-color:var(--line); }
.brand { display:flex; align-items:center; gap:10px; margin-inline-end:auto; font-weight:800; }
.brand img { width:62px; height:62px; object-fit:contain; transition:width .35s,height .35s,transform .5s; }
.brand:hover img { transform:rotate(-5deg) scale(1.03); }
.site-header.scrolled .brand img { width:46px; height:46px; }
.brand-text { line-height:1.05; }
.brand-text strong { display:block; font-family:Georgia,serif; font-size:1.06rem; }
.brand-text small { font-size:.58rem; letter-spacing:.12em; opacity:.7; }
.nav-links { display:flex; align-items:center; gap:4px; }
.nav-links a { padding:9px 12px; border-radius:999px; font-size:.92rem; font-weight:700; opacity:.82; transition:.25s; }
.nav-links a:hover,.nav-links a.active { opacity:1; background:rgba(255,255,255,.12); }
.scrolled .nav-links a:hover,.scrolled .nav-links a.active { background:rgba(22,103,71,.09); color:var(--green-700); }
.nav-tools { display:flex; align-items:center; gap:7px; }
.icon-btn,.language-select {
  width:42px; height:42px; border:1px solid rgba(255,255,255,.2); border-radius:50%; background:rgba(255,255,255,.09); display:grid; place-items:center; cursor:pointer; color:inherit;
}
.scrolled .icon-btn,.scrolled .language-select { border-color:var(--line); background:rgba(128,128,128,.06); }
.language-select { width:auto; min-width:62px; padding:0 10px; border-radius:999px; font-weight:800; appearance:none; text-align:center; }
.language-select option { color:#102018; }
.theme-toggle { overflow:hidden; position:relative; }
.theme-icon { width:20px; height:20px; position:relative; transition:transform .65s cubic-bezier(.68,-.6,.32,1.6); }
.theme-icon::before { content:""; position:absolute; inset:4px; border-radius:50%; background:var(--gold-soft); box-shadow:0 0 0 2px rgba(240,206,115,.35); }
.theme-icon::after { content:""; position:absolute; width:22px; height:22px; background:var(--green-900); border-radius:50%; transform:translate(11px,-9px); opacity:0; transition:.55s; }
[data-theme="dark"] .theme-icon { transform:rotate(180deg); }
[data-theme="dark"] .theme-icon::after { opacity:1; transform:translate(7px,-7px); }
.menu-btn { display:none; }

/* Hero */
.hero {
  min-height:100svh;
  padding:150px 0 70px;
  position:relative;
  display:flex;
  align-items:center;
  overflow:hidden;
  background:var(--green-950);
  color:white;
}
.hero::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(4,25,17,.94) 0%,rgba(4,25,17,.7) 42%,rgba(4,25,17,.16) 76%); z-index:1; }
html[dir="rtl"] .hero::after { background:linear-gradient(-90deg,rgba(4,25,17,.94) 0%,rgba(4,25,17,.7) 42%,rgba(4,25,17,.16) 76%); }
.hero-bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.82; animation:heroZoom 16s ease-in-out infinite alternate; }
@keyframes heroZoom { to { transform:scale(1.09) translateX(-1.5%); } }
.hero .container { z-index:2; position:relative; }
.hero-copy { width:min(760px,72%); }
.hero .eyebrow { color:var(--gold-soft); }
.hero .lead { color:rgba(255,255,255,.75); max-width:620px; margin-bottom:34px; }
.hero-rail { position:absolute; right:30px; bottom:34px; z-index:3; display:flex; gap:10px; }
html[dir="rtl"] .hero-rail { right:auto; left:30px; }
.hero-chip { padding:9px 13px; border:1px solid rgba(255,255,255,.24); border-radius:999px; font-size:.75rem; backdrop-filter:blur(12px); }
.hero-orbit { position:absolute; width:460px; height:460px; border:1px solid rgba(240,206,115,.23); border-radius:50%; right:-130px; top:20%; z-index:2; animation:orbit 22s linear infinite; }
.hero-orbit::before,.hero-orbit::after { content:""; position:absolute; border-radius:50%; background:var(--gold); box-shadow:0 0 24px rgba(200,149,33,.7); }
.hero-orbit::before { width:12px; height:12px; top:48px; left:65px; }
.hero-orbit::after { width:7px; height:7px; bottom:67px; right:57px; }
@keyframes orbit { to { transform:rotate(360deg); } }
.page-hero { min-height:68svh; padding-top:160px; }
.page-hero .hero-copy { width:min(760px,80%); }
.page-hero h1 { font-size:clamp(3.2rem,6vw,6rem); }

/* Cards and imagery */
.stats { margin-top:-52px; position:relative; z-index:4; }
.stat-grid { display:grid; grid-template-columns:repeat(4,1fr); background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); overflow:hidden; }
.stat { padding:32px; border-inline-end:1px solid var(--line); }
.stat:last-child { border:0; }
.stat strong { display:block; font-family:Georgia,serif; font-size:2.7rem; line-height:1; color:var(--green-700); }
[data-theme="dark"] .stat strong { color:var(--gold-soft); }
.stat span { color:var(--muted); font-size:.88rem; }
.split { display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center; }
.image-stage { position:relative; min-height:610px; }
.portrait { border-radius:var(--radius); object-fit:cover; aspect-ratio:4/5; box-shadow:var(--shadow); }
.image-stage .portrait:first-child { width:72%; margin-inline-start:auto; }
.image-stage .portrait:last-child { width:48%; position:absolute; bottom:0; inset-inline-start:0; border:8px solid var(--cream); }
.seal { position:absolute; top:50px; inset-inline-start:8%; width:128px; height:128px; border-radius:50%; background:var(--gold); color:#102018; display:grid; place-items:center; text-align:center; font-weight:900; box-shadow:var(--shadow); animation:float 5s ease-in-out infinite; z-index:2; }
@keyframes float { 50% { transform:translateY(-14px) rotate(3deg); } }
.feature-list { list-style:none; padding:0; margin:30px 0; display:grid; gap:15px; }
.feature-list li { display:grid; grid-template-columns:34px 1fr; gap:12px; align-items:start; }
.check { width:30px; height:30px; border-radius:50%; background:rgba(44,145,98,.12); color:var(--green-700); display:grid; place-items:center; font-weight:900; }
.cards-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.product-card { position:relative; border-radius:var(--radius); overflow:hidden; aspect-ratio:4/5; box-shadow:var(--shadow); isolation:isolate; }
.product-card img { width:100%; height:100%; object-fit:cover; transition:transform .7s cubic-bezier(.2,.8,.2,1); }
.product-card::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 45%,rgba(5,29,20,.88)); z-index:1; }
.product-card:hover img { transform:scale(1.065); }
.product-content { position:absolute; inset:auto 26px 24px; color:white; z-index:2; }
.product-content p { margin:0; opacity:.75; font-size:.86rem; }
.product-card.featured { transform:translateY(34px); }
.quality-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.quality-card { padding:27px; border:1px solid var(--line); border-radius:22px; background:var(--paper); transition:.3s; }
.quality-card:hover { transform:translateY(-8px); border-color:rgba(200,149,33,.5); box-shadow:var(--shadow); }
.quality-no { color:var(--gold); font-size:.75rem; font-weight:900; letter-spacing:.12em; }
.quality-card h3 { margin:28px 0 10px; }
.quality-card p { color:var(--muted); margin:0; font-size:.92rem; }
.logo-strip { overflow:hidden; mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent); }
.logo-track { display:flex; width:max-content; gap:16px; animation:marquee 24s linear infinite; }
html[dir="rtl"] .logo-track { animation-direction:reverse; }
@keyframes marquee { to { transform:translateX(-50%); } }
.market-pill { padding:15px 24px; border:1px solid var(--line); border-radius:999px; white-space:nowrap; background:var(--paper); font-weight:800; }

/* Products page */
.product-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
.catalog-card { background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; transition:.35s; }
.catalog-card:hover { transform:translateY(-8px); box-shadow:var(--shadow); }
.catalog-card img { width:100%; aspect-ratio:4/5; object-fit:cover; }
.catalog-info { padding:25px; }
.tags { display:flex; gap:7px; flex-wrap:wrap; margin-top:18px; }
.tag { border:1px solid var(--line); border-radius:999px; padding:5px 10px; font-size:.73rem; color:var(--muted); }
.process { display:grid; grid-template-columns:repeat(4,1fr); gap:2px; }
.process-step { padding:30px 24px; background:var(--green-900); color:white; min-height:250px; position:relative; overflow:hidden; }
.process-step:first-child { border-radius:var(--radius) 0 0 var(--radius); }
.process-step:last-child { border-radius:0 var(--radius) var(--radius) 0; }
html[dir="rtl"] .process-step:first-child { border-radius:0 var(--radius) var(--radius) 0; }
html[dir="rtl"] .process-step:last-child { border-radius:var(--radius) 0 0 var(--radius); }
.process-step span { font-family:Georgia,serif; font-size:4rem; color:rgba(240,206,115,.25); position:absolute; right:18px; top:8px; }
.process-step h3 { margin-top:100px; color:var(--gold-soft); }
.process-step p { opacity:.68; font-size:.88rem; }

/* About */
.timeline { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.timeline-card { padding:36px; border-radius:var(--radius); background:var(--paper); border:1px solid var(--line); }
.timeline-card em { color:var(--gold); font-style:normal; font-weight:900; font-size:.82rem; }
.timeline-card h3 { margin:34px 0 12px; }
.timeline-card p { color:var(--muted); }
.gallery-band { display:grid; grid-template-columns:1fr 1.25fr 1fr; gap:16px; align-items:center; }
.gallery-band img { width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:24px; }
.gallery-band img:nth-child(2) { transform:translateY(34px); }

/* CTA and FAQ */
.cta-band { background:var(--green-900); color:white; border-radius:36px; padding:64px; display:grid; grid-template-columns:1.4fr .6fr; gap:30px; align-items:center; overflow:hidden; position:relative; }
.cta-band::after { content:""; width:340px; height:340px; border:1px solid rgba(240,206,115,.23); border-radius:50%; position:absolute; right:-140px; top:-120px; }
.cta-band h2 { margin:8px 0 16px; }
.cta-band p { color:rgba(255,255,255,.68); margin:0; max-width:650px; }
.cta-band .btn-row { justify-content:flex-end; position:relative; z-index:2; }
.faq { display:grid; grid-template-columns:.8fr 1.2fr; gap:70px; }
.accordion { border-top:1px solid var(--line); }
.faq-item { border-bottom:1px solid var(--line); }
.faq-q { width:100%; padding:22px 0; border:0; background:none; display:flex; justify-content:space-between; gap:20px; text-align:start; font-weight:800; cursor:pointer; }
.faq-plus { width:28px; height:28px; border:1px solid var(--line); border-radius:50%; display:grid; place-items:center; flex:0 0 auto; transition:.3s; }
.faq-item.open .faq-plus { transform:rotate(45deg); background:var(--gold); color:#102018; }
.faq-a { max-height:0; overflow:hidden; color:var(--muted); transition:max-height .45s ease; }
.faq-a p { padding:0 30px 22px 0; margin:0; }
.faq-item.open .faq-a { max-height:180px; }

/* Contact */
.contact-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:30px; }
.contact-panel,.form-panel { padding:42px; background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); }
.contact-list { display:grid; gap:20px; margin:34px 0; }
.contact-line { padding-bottom:18px; border-bottom:1px solid var(--line); }
.contact-line small { display:block; color:var(--muted); text-transform:uppercase; letter-spacing:.1em; font-size:.7rem; }
.contact-line strong { display:block; margin-top:4px; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:17px; }
.field { display:grid; gap:7px; }
.field.full { grid-column:1/-1; }
.field label { font-size:.78rem; font-weight:800; }
.field input,.field textarea,.field select { width:100%; border:1px solid var(--line); color:var(--ink); background:var(--cream); border-radius:15px; padding:14px 16px; outline:none; transition:.25s; }
.field textarea { min-height:130px; resize:vertical; }
.field input:focus,.field textarea:focus,.field select:focus { border-color:var(--gold); box-shadow:0 0 0 4px rgba(200,149,33,.12); }
.form-note { color:var(--muted); font-size:.78rem; margin-top:14px; }
.map { border:0; width:100%; height:380px; border-radius:var(--radius); filter:saturate(.75) contrast(1.05); }
[data-theme="dark"] .map { filter:invert(.9) hue-rotate(165deg) saturate(.65); }

/* Footer */
.footer { background:var(--green-950); color:white; padding:70px 0 26px; }
.footer-grid { display:grid; grid-template-columns:1.2fr .7fr .8fr 1.2fr; gap:42px; }
.footer-brand img { width:90px; margin-bottom:16px; }
.footer p,.footer a { color:rgba(255,255,255,.62); }
.footer h4 { margin:0 0 18px; color:var(--gold-soft); }
.footer-links { display:grid; gap:9px; }
.socials { display:flex; gap:9px; margin-top:20px; }
.socials a { width:38px; height:38px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.16); border-radius:50%; color:white; font-weight:800; font-size:.78rem; transition:.25s; }
.socials a:hover { background:var(--gold); color:#102018; transform:translateY(-3px); }
.footer-map { width:100%; height:170px; border:0; border-radius:18px; opacity:.85; }
.footer-bottom { margin-top:50px; padding-top:22px; border-top:1px solid rgba(255,255,255,.1); display:flex; justify-content:space-between; color:rgba(255,255,255,.42); font-size:.78rem; }
.whatsapp { position:fixed; right:24px; bottom:24px; z-index:80; width:62px; height:62px; border-radius:50%; background:#25d366; color:white; display:grid; place-items:center; box-shadow:0 14px 30px rgba(10,76,43,.32); animation:whapulse 2.2s infinite; }
html[dir="rtl"] .whatsapp { right:auto; left:24px; }
.whatsapp::before { content:""; position:absolute; inset:-7px; border:1px solid rgba(37,211,102,.45); border-radius:50%; animation:ring 2.2s infinite; }
.whatsapp svg { width:30px; height:30px; fill:currentColor; }
@keyframes whapulse { 50% { transform:translateY(-5px); } }
@keyframes ring { to { transform:scale(1.28); opacity:0; } }

.reveal { opacity:0; transform:translateY(32px); transition:opacity .8s ease,transform .8s ease; }
.reveal.visible { opacity:1; transform:none; }
.delay-1 { transition-delay:.1s; }.delay-2 { transition-delay:.2s; }.delay-3 { transition-delay:.3s; }

@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; scroll-behavior:auto!important; transition-duration:.01ms!important; }
  .reveal { opacity:1; transform:none; }
}

@media (max-width:980px) {
  :root { --container:min(100% - 28px,760px); }
  .nav-links { position:fixed; top:90px; left:14px; right:14px; padding:16px; flex-direction:column; align-items:stretch; background:var(--paper); color:var(--ink); border:1px solid var(--line); border-radius:22px; box-shadow:var(--shadow); opacity:0; transform:translateY(-16px); pointer-events:none; transition:.3s; }
  .nav-links.open { opacity:1; transform:none; pointer-events:auto; }
  .nav-links a { padding:13px 15px; }
  .menu-btn { display:grid; }
  .brand-text { display:none; }
  .site-header .btn-nav { display:none; }
  .hero-copy,.page-hero .hero-copy { width:88%; }
  .stat-grid { grid-template-columns:1fr 1fr; }
  .stat:nth-child(2) { border-inline-end:0; }
  .stat:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .split,.faq,.contact-grid { grid-template-columns:1fr; gap:48px; }
  .cards-3,.product-grid,.timeline { grid-template-columns:1fr 1fr; }
  .quality-grid,.process { grid-template-columns:1fr 1fr; }
  .process-step,.process-step:first-child,.process-step:last-child,html[dir="rtl"] .process-step:first-child,html[dir="rtl"] .process-step:last-child { border-radius:20px; }
  .cta-band { grid-template-columns:1fr; padding:46px; }
  .cta-band .btn-row { justify-content:flex-start; }
  .footer-grid { grid-template-columns:1fr 1fr; }
}

@media (max-width:640px) {
  :root { --container:calc(100% - 28px); --radius:22px; }
  .section { padding:78px 0; }
  .site-header { inset:8px 0 auto; }
  .nav-shell { min-height:66px; border-radius:18px; padding:7px 9px 7px 12px; gap:8px; }
  .brand img { width:48px; height:48px; }
  .language-select { min-width:52px; width:52px; font-size:.8rem; padding:0 5px; }
  .icon-btn { width:39px; height:39px; }
  .hero { min-height:92svh; padding:120px 0 56px; }
  .hero-copy,.page-hero .hero-copy { width:100%; }
  .hero h1 { font-size:clamp(3rem,14vw,4.6rem); }
  html[dir="rtl"] .hero h1 { font-size:clamp(2.45rem,11vw,3.8rem); }
  .hero::after { background:linear-gradient(180deg,rgba(4,25,17,.72),rgba(4,25,17,.93)); }
  .hero-rail,.hero-orbit { display:none; }
  .stat { padding:24px 20px; }
  .stat strong { font-size:2.25rem; }
  .section-head { display:block; }
  .section-head .btn { margin-top:20px; }
  .split { gap:36px; }
  .image-stage { min-height:470px; }
  .cards-3,.product-grid,.timeline,.quality-grid,.process,.footer-grid { grid-template-columns:1fr; }
  .product-card.featured { transform:none; }
  .gallery-band { grid-template-columns:1fr 1fr; }
  .gallery-band img:last-child { display:none; }
  .gallery-band img:nth-child(2) { transform:translateY(24px); }
  .cta-band { padding:34px 25px; border-radius:26px; }
  .form-grid { grid-template-columns:1fr; }
  .field.full { grid-column:auto; }
  .contact-panel,.form-panel { padding:28px 22px; }
  .footer-bottom { display:block; }
  .footer-bottom span { display:block; margin-top:6px; }
  .whatsapp { width:56px; height:56px; right:16px; bottom:16px; }
  html[dir="rtl"] .whatsapp { left:16px; }
}