/* colors.css - Core color palette */

:root {
    /* Brand Colors */
    --color-primary: #561D59;
    --color-secondary: #701F56;
    --color-tertiary: #A63372;
    --color-accent: #E74E59;

    /* Warm Text Scale */
    --color-text-heading:   var(--color-warm-10); /* near-black ink */
    --color-text-primary:   var(--color-warm-20); /* body text */
    --color-text-secondary: var(--color-warm-30); /* subtext */
    --color-text-tertiary:  var(--color-warm-40); /* hints */
    --color-text-muted:     var(--color-warm-55); /* disabled */

    /* Warm Border */
    --color-border-soft:    var(--color-warm-85);

    /* Off-White Scale (Warm, Non-Gray) */
    --color-offwhite: #F7F4EE; /* legacy alias */
    --color-offwhite-0: #F7F4EE;
    --color-offwhite-50: #F8F5F0;
    --color-offwhite-100: #F8F6F2;
    --color-offwhite-150: #F9F7F4;
    --color-offwhite-200: #FAF8F6;
    --color-offwhite-250: #FBFAF8;
    --color-offwhite-300: #FCFBFA;
    --color-offwhite-350: #FDFDFC;

    /* Warm Neutrals - Ink to Paper (palette-aligned) */
    --color-warm-5:  #0F0D0B;
    --color-warm-10: #1B1714;
    --color-warm-15: #26211D;
    --color-warm-20: #312B26;  /* good replacement for #333333 body text */
    --color-warm-25: #3D3630;
    --color-warm-30: #49413A;
    --color-warm-35: #564D45;
    --color-warm-40: #635950;
    --color-warm-45: #70655B;
    --color-warm-50: #7D7267;
    --color-warm-55: #8A7F73;
    --color-warm-60: #978C80;
    --color-warm-65: #A49A8E;
    --color-warm-70: #B1A79B;
    --color-warm-75: #BEB4A8;
    --color-warm-80: #CBC2B6;
    --color-warm-85: #D9D1C6;
    --color-warm-90: #E7E1D8;
    --color-warm-95: #F4F1EA;
    --color-warm-white: #FCFBFA; /* matches your offwhite-300-ish */

    /* Warm Shadow Base (ink-derived) */
    --shadow-warm-color: 31, 27, 23;

    /* Elevation Shadows */
    --shadow-xs: 0 1px 2px rgba(var(--shadow-warm-color), 0.06);

    --shadow-sm:
        0 1px 3px rgba(var(--shadow-warm-color), 0.08),
        0 1px 2px rgba(var(--shadow-warm-color), 0.04);

    --shadow-md:
        0 4px 8px rgba(var(--shadow-warm-color), 0.10),
        0 2px 4px rgba(var(--shadow-warm-color), 0.06);

    --shadow-lg:
        0 10px 20px rgba(var(--shadow-warm-color), 0.12),
        0 4px 8px rgba(var(--shadow-warm-color), 0.08);

    --shadow-xl:
        0 20px 40px rgba(var(--shadow-warm-color), 0.14),
        0 8px 16px rgba(var(--shadow-warm-color), 0.10);




    /* Grayscale - Black to White */
    --color-black: #000000;
    --color-gray-5: #0d0d0d;
    --color-gray-10: #1a1a1a;
    --color-gray-15: #262626;
    --color-gray-20: #333333;
    --color-gray-25: #404040;
    --color-gray-30: #4d4d4d;
    --color-gray-35: #595959;
    --color-gray-40: #666666;
    --color-gray-45: #737373;
    --color-gray-50: #808080;
    --color-gray-55: #8c8c8c;
    --color-gray-60: #999999;
    --color-gray-65: #a6a6a6;
    --color-gray-70: #b3b3b3;
    --color-gray-75: #bfbfbf;
    --color-gray-80: #cccccc;
    --color-gray-85: #d9d9d9;
    --color-gray-90: #e6e6e6;
    --color-gray-95: #f2f2f2;
    --color-white: #ffffff;
}