/* ============================================================
   global.css — спільні стилі для всього сайту
   Підключати ОДИН РАЗ в data_head.php
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,380..700&family=Work+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@500&display=swap');

:root {
    --ink:        #241714;
    --ink-soft:   #4A3A34;
    --ink-faint:  #8A776E;
    --porcelain:  #FBF6F1;
    --paper:      #FFFDFB;
    --sand:       #F1E6DA;
    --sand-deep:  #E4D5C4;
    --line:       #E7D9CC;

    --rose:       #9C3252;
    --rose-deep:  #77243D;
    --rose-tint:  #F3E1E6;

    --bronze:     #B5813F;
    --bronze-tint:#EFDFC2;

    --sage:       #66735A;
    --sage-tint:  #E4E9DC;

    --danger:     #A63B33;

    --shadow-card: 0 1px 2px rgba(36, 23, 20, 0.06), 0 12px 28px -14px rgba(36, 23, 20, 0.18);
    --shadow-hover: 0 2px 4px rgba(156, 50, 82, 0.10), 0 20px 40px -16px rgba(156, 50, 82, 0.30);
    --glow-rose: 0 0 0 3px rgba(156, 50, 82, 0.14);

    --radius-card: 20px 20px 20px 6px;
    --radius-card-sm: 14px 14px 14px 4px;
    --radius-pill: 999px;
    --radius-sm: 8px;

    --font-display: 'Fraunces', ui-serif, Georgia, serif;
    --font-body: 'Work Sans', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, monospace;

    --ease: cubic-bezier(0.22, 1, 0.36, 1);
    --fast: 160ms;
    --med: 280ms;
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

*, *::before, *::after { box-sizing: border-box; }

a { color: var(--rose); }
a:hover { color: var(--rose-deep); }

a:focus-visible,
button:focus-visible,
input:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid var(--rose);
    outline-offset: 2px;
    border-radius: var(--radius-sm);
}