/*
 * PahadiKala design tokens - "Geru"
 * =================================================================
 * THE single source of truth for the customer-facing theme.
 * Loaded first on every customer page, before every other stylesheet.
 *
 * To restyle the site, change the values HERE and nowhere else.
 * No other customer stylesheet should contain a raw font stack or a
 * raw brand/neutral color - they all reference these variables.
 *
 * Custom properties resolve at computed-value time, not parse time,
 * so every later stylesheet can use var(--pk-*) regardless of the
 * order the files happen to load in.
 */

:root {
    /* ---- Brand ------------------------------------------------- */
    --pk-geru: #A03A22;          /* primary: red ochre ground of Aipan art */
    --pk-geru-rgb: 160, 58, 34;   /* for rgba() washes: rgba(var(--pk-geru-rgb), .1) */
    --pk-geru-deep: #7E2C18;     /* hover / pressed / deep accents         */
    --pk-geru-tint: #FBEEE9;     /* faintest brand wash for backgrounds    */
    --pk-brass: #9A6F28;         /* secondary metallic accent              */
    --pk-pine: #2F4034;          /* secondary deep green accent            */

    /* ---- Text -------------------------------------------------- */
    --pk-ink: #1C1512;           /* headings, highest-contrast text        */
    --pk-text-body: #4A3E37;     /* body copy                              */
    --pk-text-muted: #6E6057;    /* secondary / supporting text            */
    --pk-text-faint: #8A7C72;    /* placeholders, disabled, meta           */

    /* ---- Surfaces ---------------------------------------------- */
    --pk-paper: #FFFDF9;         /* cards, header, raised surfaces         */
    --pk-sand: #FAF6EF;          /* subtle alternating band                */
    --pk-rice: #F6F0E6;          /* section background                     */

    /* ---- Warm washes ------------------------------------------
       Pale brand-tinted fills that sit between paper and geru-tint:
       selected cards, hero gradients, soft callouts. */
    --pk-blush: #FFF8F5;         /* gradient start on about / combos       */
    --pk-blush-deep: #FDF1EE;    /* gradient end on about / combos         */
    --pk-wash: #FFF5F5;          /* selected card, policy callout fills    */

    /* ---- Night surfaces ---------------------------------------
       The dark-brown family: footer, USP strip, price tiles. Accents
       (ember) are the light tints used on top of these surfaces. */
    --pk-night: #2C1810;         /* footer gradient end, dark panels       */
    --pk-night-deep: #1A0F0F;    /* darkest end of the support modal bar   */
    --pk-night-line: #3B2D25;    /* hairlines on dark panels               */
    --pk-night-text: #BCAE9F;    /* secondary text on dark panels          */
    --pk-ember: #D99B76;         /* icon / hover accent on dark panels     */
    --pk-ember-soft: #FF9F80;    /* link accent on the footer              */

    /* ---- Lines ------------------------------------------------- */
    --pk-line: #EDE2D3;          /* hairline dividers                      */
    --pk-line-strong: #DFD3C3;   /* input borders, card outlines           */

    /* ---- Status ------------------------------------------------
       Deliberately NOT brand colors: these carry meaning (paid,
       pending, failed) and must stay readable as such. Warmed to
       sit alongside the palette rather than Bootstrap's defaults. */
    --pk-success: #1B7A3D;
    --pk-success-bg: #F1FAF4;
    --pk-warning: #9A6F28;
    --pk-warning-bg: #FDF6E7;
    --pk-danger: #B3261E;
    --pk-danger-bg: #FBEEE9;
    --pk-info: #2F4034;
    --pk-info-bg: #F0F4F0;

    /* ---- Type -------------------------------------------------- */
    --pk-font-display: 'Marcellus', Georgia, 'Times New Roman', serif;
    --pk-font-body: 'Hanken Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

    /* ---- Shape ------------------------------------------------- */
    --pk-radius-sm: 4px;
    --pk-radius-md: 8px;
    --pk-radius-lg: 16px;
    --pk-radius-pill: 999px;

    /* ---- Elevation --------------------------------------------- */
    --pk-shadow-sm: 0 1px 3px rgba(28, 21, 18, .06);
    --pk-shadow-md: 0 6px 18px rgba(28, 21, 18, .08);
    --pk-shadow-lg: 0 14px 34px rgba(28, 21, 18, .14);

    /* ---- Layout ------------------------------------------------ */
    --pk-header-gutter: 40px;
}

@media (max-width: 991px) {
    :root { --pk-header-gutter: 20px; }
}