/* ===================== "Our Work" theme =====================
   The أعمالنا section only — real client projects get their own palette so
   they read as our own work rather than as another catalog entry. Applied
   statically in the markup (it never toggles), same token pattern as
   .theme-wedding. */
.theme-work {
  /* ---- Jacaranda palette ---- */
  --amethyst: #8e72bc;
  --lavender: #a38ed2;
  --wisteria: #b8aae7;
  --olivine:  #bace89;
  --reseda:   #768163;

  /* ---- Shades & tints derived from the palette above ---- */
  --amethyst-deep: #4a3a66;
  --amethyst-mid:  #63508a;
  --lavender-pale: #ebe5f7;
  --lavender-wash: #f4f1fb;
  --lavender-line: #d9cff0;

  --ramp-1: var(--amethyst-deep);
  --ramp-2: var(--amethyst-mid);
  --ramp-3: var(--amethyst);
  --ramp-4: var(--reseda);
  --ramp-5: var(--lavender);
  --ramp-6: var(--wisteria);
  --ramp-7: var(--olivine);
  --ramp-8: var(--lavender-pale);

  /* Same caveat as .theme-wedding: a var() inside a custom-property
     declaration resolves where it is declared, so every ramp-derived token
     has to be repeated here. */
  --ink: var(--ramp-1);
  --ink-soft: var(--ramp-2);
  --bg: var(--lavender-wash);
  --border: var(--lavender-line);
  --primary: var(--ramp-2);
  --primary-dark: var(--ramp-1);
  --primary-hover: var(--ramp-3);
  --primary-light: var(--ramp-8);
  --accent: var(--ramp-7);
  --success: var(--ramp-4);
  --danger: var(--ramp-1);

  --shadow-ink: rgba(74, 58, 102, .18);
  --shadow-ink-strong: rgba(74, 58, 102, .28);
  --shadow-deep: rgba(74, 58, 102, .38);
  --shadow: 0 10px 30px -12px var(--shadow-ink);
  --grad-brand: linear-gradient(135deg, var(--ramp-1), var(--ramp-3));

  color: var(--ink);
}
/* the section keeps a white ground; the cards carry the lavender wash */
.work-section.theme-work { background: var(--card); }
/* one purple project, one green — between them they use all five colors */
.theme-work .work-card__thumb--joo { background: linear-gradient(135deg, var(--amethyst), var(--wisteria)); }
.theme-work .work-card__thumb--nokhba { background: linear-gradient(135deg, var(--olivine), var(--reseda)); }