/* Loving Hands Ministries — 2026 design tokens for the Avada child theme.
   Source: Loving Hands Design System/colors_and_type.css.

   Manrope/Spectral are NOT imported here on purpose — configure those in
   Avada Global Options or enqueue locally after licensing/performance review.
   The one exception is the "Belinda W00" script face below: it is shipped
   locally from assets/fonts/ so the --lh-font-script token resolves for
   graphic lockups. Trial/CC-BY webfont (onlinewebfonts.com) — confirm
   licensing before commercial print/marketing use. */
@font-face {
  font-family: "Belinda W00";
  src: url("../fonts/belinda-w00.woff2") format("woff2"),
       url("../fonts/belinda-w00.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Brand reds */
  --lh-red-500: #ed1c24;   /* primary action — CTAs only */
  --lh-red-600: #c5151c;   /* active/intermediate */
  --lh-red-700: #a80303;   /* headings, accents, hover */
  --lh-red-900: #8b0000;   /* deep emphasis, pressed */

  /* Charcoals + neutrals */
  --lh-charcoal-900: #1e1e1f;
  --lh-charcoal-800: #2a2a2b;
  --lh-charcoal-700: #3b3a3a;
  --lh-charcoal-500: #5f5d5d;
  --lh-charcoal-300: #949494;

  --lh-gray-50: #fafaf8;
  --lh-gray-100: #f7f7f7;
  --lh-gray-200: #ececec;
  --lh-gray-300: #d8d5d1;

  --lh-stone-50: #fafaf8;
  --lh-stone-100: #f3f2ef;
  --lh-stone-300: #d8d5d1;
  --lh-stone-600: #6e6a67;

  --lh-white: #ffffff;
  --lh-black: #000000;
  --lh-blue-500: #1896d1; /* info/contact only — never primary CTA */
  --lh-blue-700: #0b628a; /* accessible blue text on pale info surfaces */
  --lh-green-500: #6fd18e;

  /* Campus accents: rules, chips, pins only. Do not recolor whole pages. */
  --lh-campus-palmetto: #a80303;
  --lh-campus-dade: #8c3a2b;
  --lh-campus-georgia: #445b4a;

  /* Semantic colors */
  --lh-bg: var(--lh-white);
  --lh-bg-muted: var(--lh-gray-100);
  --lh-bg-stone: var(--lh-stone-100);
  --lh-bg-inverse: var(--lh-charcoal-900);
  --lh-bg-attention: #fce9ea;
  --lh-bg-info: rgba(24, 150, 209, 0.06);

  --lh-fg: var(--lh-charcoal-700);
  --lh-fg-strong: var(--lh-charcoal-900);
  --lh-fg-muted: var(--lh-charcoal-500);
  --lh-fg-subtle: var(--lh-charcoal-300);
  --lh-fg-inverse: var(--lh-white);
  --lh-fg-inverse-muted: rgba(255, 255, 255, 0.74);
  --lh-fg-inverse-subtle: rgba(255, 255, 255, 0.58);
  --lh-fg-accent: var(--lh-red-700);

  --lh-border: var(--lh-gray-200);
  --lh-border-stone: var(--lh-stone-300);
  --lh-border-inverse: rgba(255, 255, 255, 0.14);
  --lh-border-hair: 1px solid var(--lh-border);
  --lh-border-rule: 1px solid var(--lh-charcoal-700);
  --lh-border-accent: 2px solid var(--lh-red-700);

  /* Typography */
  --lh-font-sans: "Manrope", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --lh-font-serif: "Spectral", Georgia, "Cormorant Garamond", "Book Antiqua", Palatino, serif;
  /* Script accent — graphic lockups only, never UI. Face defined above. */
  --lh-font-script: "Belinda W00", "Allura", cursive;

  --lh-text-h1: 4rem;       /* 64px desktop */
  --lh-text-h2: 2.75rem;    /* 44px desktop */
  --lh-text-h3: 2rem;       /* 32px desktop */
  --lh-text-h4: 1.5rem;     /* 24px desktop */
  --lh-text-body-lg: 1.25rem;
  --lh-text-body: 1.0625rem;
  --lh-text-body-sm: 1rem;
  --lh-text-meta: 0.875rem;
  --lh-text-eyebrow: 0.8125rem;
  --lh-text-button: 0.9375rem;

  --lh-leading-tight: 1.08;
  --lh-leading-snug: 1.25;
  --lh-leading-normal: 1.55;
  --lh-leading-relaxed: 1.7;
  --lh-tracking-tight: 0;
  --lh-tracking-normal: 0;
  --lh-tracking-eyebrow: 0;

  /* 8px rhythm */
  --lh-space-1: 4px;
  --lh-space-2: 8px;
  --lh-space-3: 12px;
  --lh-space-4: 16px;
  --lh-space-5: 24px;
  --lh-space-6: 32px;
  --lh-space-7: 48px;
  --lh-space-8: 64px;
  --lh-space-9: 80px;
  --lh-space-10: 96px;
  --lh-space-11: 120px;
  --lh-space-12: 140px;

  /* Containers */
  --lh-width-reading: 800px;
  --lh-width-narrow: 960px;
  --lh-width-page: 1240px;
  --lh-width-wide: 1400px;
  --lh-gutter-mobile: 24px;
  --lh-gutter: 32px;
  --lh-gutter-wide: 48px;

  /* Radii */
  --lh-radius-xs: 6px;
  --lh-radius-sm: 12px;
  --lh-radius-md: 16px;
  --lh-radius-lg: 24px;
  --lh-radius-xl: 32px;
  --lh-radius-pill: 999px;

  /* Elevation */
  --lh-shadow-sm: 0 2px 6px rgba(20, 20, 20, 0.04), 0 8px 24px rgba(20, 20, 20, 0.06);
  --lh-shadow-md: 0 6px 14px rgba(20, 20, 20, 0.06), 0 18px 40px rgba(20, 20, 20, 0.10);
  --lh-shadow-lg: 0 14px 28px rgba(20, 20, 20, 0.10), 0 32px 60px rgba(20, 20, 20, 0.14);
  --lh-focus-ring: 0 0 0 3px rgba(168, 3, 3, 0.35);
  --lh-focus-ring-soft: 0 0 0 3px rgba(168, 3, 3, 0.18);

  /* Motion */
  --lh-ease-out: cubic-bezier(0.2, 0.7, 0.2, 1);
  --lh-ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --lh-dur-quick: 150ms;
  --lh-dur-base: 220ms;
  --lh-dur-slow: 400ms;

  /* Avada-facing aliases for docs/builders that prefer semantic names. */
  --lh-color-primary: var(--lh-red-500);
  --lh-color-accent: var(--lh-red-700);
  --lh-color-dark: var(--lh-charcoal-900);
  --lh-color-text: var(--lh-charcoal-700);
  --lh-color-muted: var(--lh-charcoal-500);
  --lh-color-border: var(--lh-border);
  --lh-color-surface: var(--lh-bg);
  --lh-color-surface-muted: var(--lh-bg-muted);
}

@media (max-width: 768px) {
  :root {
    --lh-text-h1: 2.625rem;
    --lh-text-h2: 2rem;
    --lh-text-h3: 1.625rem;
    --lh-text-h4: 1.375rem;
    --lh-text-body: 1rem;
    --lh-text-body-lg: 1.125rem;
    --lh-gutter: var(--lh-gutter-mobile);
  }
}
