/* Khashef Alreem brand layer: warm ivory, ink black from the gazelle emblem, soft desert-sand accents.
   Loaded after style.css; only overrides colours, fonts and small effects. */
:root {
  --accent: #1c1a17;
  --accent-ui: #1c1a17;
  --bg: #f5f0e8;
  --surface: #fffdf9;
  --text: #1c1a17;
  --muted: #776f63;
  --line: #e6ddcd;
  --font: "Jost", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --display: "Cormorant Garamond", Georgia, serif;
}
@media (prefers-color-scheme: dark) {
  :root {
    --accent-ui: #c8b48c;
    --bg: #12110f; --surface: #1c1a17; --text: #f2ece1; --muted: #b1a796; --line: #34302a;
  }
}
html:lang(ar) { --font: "IBM Plex Sans Arabic", "Jost", -apple-system, "Segoe UI", Tahoma, Arial, sans-serif; --display: "Amiri", "Cormorant Garamond", Georgia, serif; }
h1, h2 { font-family: var(--display); font-weight: 600; letter-spacing: .01em; }
html:lang(ar) h1, html:lang(ar) h2 { font-weight: 700; line-height: 1.5; }

/* Banner: ink black with a fine sand edge */
.banner { background: #1c1a17; border-bottom: 3px solid #c8b48c; }
.logo { padding: 4px; object-fit: contain; background: #fff; }

.save { background: #1c1a17; color: #f5f0e8; box-shadow: inset 0 0 0 1px rgba(200,180,140,.6), 0 8px 20px rgba(28,26,23,.22); }
@media (prefers-color-scheme: dark) {
  .save { background: #c8b48c; color: #1c1a17; }
}

/* Social pills with brand marks */
.pill { display: inline-flex; align-items: center; gap: 8px; }
.pill-ic { width: 18px; height: 18px; flex: none; }
