/* Shared Khotoat identity: public website and practical CMS. */
:root {
  --brand-primary: #163F35;
  --brand-secondary: #336A53;
  --brand-soft: #A9C1B1;
  --brand-background: #F8F9F5;
  --brand-accent: #C0A57A;
  --brand-text: #2C3631;
  --brand-deep: #102F28;
  --brand-muted: #53635A;
  --brand-tint: #EDF2EC;
  --brand-border: #D5DFD5;
  --brand-control-border: #7C8F81;
  --brand-white: #FFFFFF;
  --brand-on-dark: #DEE8E0;
  --brand-dark-line: rgba(255, 255, 255, 0.18);
  --brand-focus: #336A53;
  --brand-shadow: 0 1px 2px rgba(22, 63, 53, 0.04), 0 8px 24px rgba(22, 63, 53, 0.06);
  --brand-success-bg: #E6EFE8;
  --brand-success: #245536;
  --brand-error-bg: #F6E6E1;
  --brand-error: #8A2A17;
  --brand-notice-bg: #F6EFDF;
  --brand-notice: #6A4B0B;

  /* A full green range for decorative surfaces; text gradients are AA-safe. */
  --brand-emerald: #285C48;
  --brand-natural: #4A8968;
  --brand-sage: #78A58A;
  --brand-mist: #E5F0E8;
  --brand-wash: #D3E5D8;
  --brand-cta-end: #438060;
  --brand-medium-end: #417759;
  --brand-footer-end: #275A49;
  --gradient-brand: linear-gradient(120deg, var(--brand-primary) 0%, var(--brand-secondary) 50%, var(--brand-sage) 100%);
  --gradient-cta: linear-gradient(110deg, var(--brand-primary) 0%, var(--brand-secondary) 45%, var(--brand-cta-end) 100%);
  --gradient-cta-hover: linear-gradient(110deg, var(--brand-deep) 0%, var(--brand-emerald) 45%, var(--brand-secondary) 100%);
  --gradient-medium: linear-gradient(135deg, var(--brand-emerald) 0%, var(--brand-medium-end) 100%);
  --gradient-light: linear-gradient(135deg, var(--brand-mist) 0%, var(--brand-background) 100%);
  --gradient-hero: radial-gradient(ellipse at 95% 15%, var(--brand-soft) 0%, transparent 65%), linear-gradient(120deg, var(--brand-background) 20%, var(--brand-mist) 75%, var(--brand-wash) 100%);
  --gradient-footer: linear-gradient(135deg, var(--brand-deep) 0%, var(--brand-footer-end) 100%);
  --gradient-placeholder: linear-gradient(125deg, var(--brand-soft) 0%, var(--brand-wash) 55%, var(--brand-mist) 100%);
  --gradient-placeholder-reverse: linear-gradient(145deg, var(--brand-mist), var(--brand-soft));
  --gradient-placeholder-light: linear-gradient(110deg, var(--brand-wash), var(--brand-background));
}