/* Wecommerce for Trade — shared design tokens & base components */

:root{
  --bg:#ffffff;
  --text:#0a0a0a;
  --muted:#5b6272;
  --primary:#1a419b;   /* brand blue */
  --secondary:#f02d8f; /* brand magenta */
  --line:#e3e5ee;
  --surface:#f7f8fc;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:'Inter',sans-serif;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
body.lang-ar{font-family:'IBM Plex Sans Arabic',sans-serif;}

h1,h2,.serif{font-family:'Fraunces',serif; font-weight:500; letter-spacing:-0.01em;}
body.lang-ar h1, body.lang-ar h2, body.lang-ar .serif{font-family:'Markazi Text',serif; font-weight:600;}

a{color:inherit;}
.wrap{max-width:1080px; margin:0 auto; padding:0 28px;}
.wrap-narrow{max-width:760px; margin:0 auto; padding:0 24px;}

/* Numbers that must always read left-to-right regardless of page direction
   (phone numbers, in particular, per Meta verification requirements) */
.ltr-num{
  direction:ltr;
  unicode-bidi:isolate;
  display:inline-block;
}

/* Header / top bar shared across all pages */
header.site-header{
  position:sticky; top:0; z-index:20;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
}
.nav-row{display:flex; align-items:center; justify-content:space-between; padding:14px 0;}

.brand-lockup{display:flex; align-items:center; gap:12px;}
.brand-lockup img{height:44px; width:44px; border-radius:50%; flex-shrink:0;}
.wordmark{font-family:'Fraunces',serif; font-size:1.15rem; font-weight:600; display:flex; flex-direction:column; line-height:1.15;}
body.lang-ar .wordmark{font-family:'Markazi Text',serif; font-size:1.4rem;}
.wordmark small{font-size:.62rem; letter-spacing:.06em; color:var(--muted); font-family:'Inter',sans-serif; font-weight:500; margin-top:3px;}
body.lang-ar .wordmark small{font-family:'IBM Plex Sans Arabic',sans-serif;}

.lang-btn{
  border:1px solid var(--text); background:none; color:var(--text);
  font-family:inherit; font-size:.85rem; padding:7px 16px; border-radius:999px;
  cursor:pointer; transition:background .15s, color .15s;
}
.lang-btn:hover{background:var(--text); color:#fff;}

/* Shared footer bottom bar */
.foot-bottom{
  border-top:1px solid var(--line); padding-top:20px; font-size:.82rem; color:var(--muted);
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
}

@media (prefers-reduced-motion: no-preference){
  .animate-in{animation:rise .5s ease both;}
}
@keyframes rise{from{opacity:0; transform:translateY(8px);} to{opacity:1; transform:none;}}