/*
Theme Name: BuyNew Main
Theme URI: https://dev.buynew.com/
Author: Caleb
Description: Custom theme for BuyNew Main
Version: 1.1.12
Text Domain: buynew-main
*/

/* ==========================================================================
   FONTS — Rawest (self-hosted webfont kit)
   ========================================================================== */

@font-face {
    font-family: 'Rawest';
    src: url('assets/fonts/Rawest%20Complete%20Webfont/Webfont%20kit/rawest-thin-webfont.woff2') format('woff2'),
         url('assets/fonts/Rawest%20Complete%20Webfont/Webfont%20kit/rawest-thin-webfont.woff')  format('woff');
    font-weight: 100;
    font-style:  normal;
    font-display: swap;
}

@font-face {
    font-family: 'Rawest';
    src: url('assets/fonts/Rawest%20Complete%20Webfont/Webfont%20kit/rawest-extralight-webfont.woff2') format('woff2'),
         url('assets/fonts/Rawest%20Complete%20Webfont/Webfont%20kit/rawest-extralight-webfont.woff')  format('woff');
    font-weight: 200;
    font-style:  normal;
    font-display: swap;
}

@font-face {
    font-family: 'Rawest';
    src: url('assets/fonts/Rawest%20Complete%20Webfont/Webfont%20kit/rawest-light-webfont.woff2') format('woff2'),
         url('assets/fonts/Rawest%20Complete%20Webfont/Webfont%20kit/rawest-light-webfont.woff')  format('woff');
    font-weight: 300;
    font-style:  normal;
    font-display: swap;
}

@font-face {
    font-family: 'Rawest';
    src: url('assets/fonts/Rawest%20Complete%20Webfont/Webfont%20kit/rawest-regular-webfont.woff2') format('woff2'),
         url('assets/fonts/Rawest%20Complete%20Webfont/Webfont%20kit/rawest-regular-webfont.woff')  format('woff');
    font-weight: 400;
    font-style:  normal;
    font-display: swap;
}

@font-face {
    font-family: 'Rawest';
    src: url('assets/fonts/Rawest%20Complete%20Webfont/Webfont%20kit/rawest-medium-webfont.woff2') format('woff2'),
         url('assets/fonts/Rawest%20Complete%20Webfont/Webfont%20kit/rawest-medium-webfont.woff')  format('woff');
    font-weight: 500;
    font-style:  normal;
    font-display: swap;
}

@font-face {
    font-family: 'Rawest';
    src: url('assets/fonts/Rawest%20Complete%20Webfont/Webfont%20kit/rawest-semibold-webfont.woff2') format('woff2'),
         url('assets/fonts/Rawest%20Complete%20Webfont/Webfont%20kit/rawest-semibold-webfont.woff')  format('woff');
    font-weight: 600;
    font-style:  normal;
    font-display: swap;
}

@font-face {
    font-family: 'Rawest';
    src: url('assets/fonts/Rawest%20Complete%20Webfont/Webfont%20kit/rawest-bold-webfont.woff2') format('woff2'),
         url('assets/fonts/Rawest%20Complete%20Webfont/Webfont%20kit/rawest-bold-webfont.woff')  format('woff');
    font-weight: 700;
    font-style:  normal;
    font-display: swap;
}

/* Inter loaded via Google Fonts in functions.php */

/* ==========================================================================
   DESIGN TOKENS — sourced directly from Figma variables
   ========================================================================== */

:root {

    /* ── Colours ── */

    /* Raw palette */
    --color-black:      #000000;
    --color-white:      #ffffff;
    --color-black-1:    #373737;
    --color-black-2:    #747474;
    --color-gold:       #c0b482;
    --color-gold-1:     #c8be97;
    --color-gold-2:     #dad4b9;
    --color-blue:       #b8cbcb;
    --color-blue-1:     #c2d1d1;
    --color-grey-fill:  #f1f1f1;

    /* Semantic aliases (match Figma variable names) */
    --text-primary:     #000000;   /* text/primary */
    --text-inverse:     #ffffff;   /* text/inverse */
    --text-muted:       #747474;   /* Black 2 */
    --text-subtle:      #373737;   /* Black 1 */
    --accent-premium:   #c0b482;   /* accent/premium */

    /* ── Typography — font families ── */

    --font-display: 'Rawest',  Georgia, serif;
    --font-body:    'Inter',   system-ui, -apple-system, sans-serif;

    /* ── Typography — desktop sizes (px) ── */

    --text-display:    72px;   /* Desktop Display  — Rawest Bold */
    --text-h1:         56px;   /* Desktop H1       — Rawest Bold */
    --text-h2:         36px;   /* Desktop H2       — Inter Bold */
    --text-subheading: 28px;   /* Desktop subheadings — Inter SemiBold */
    --text-h4:         22px;   /* Desktop H4       — Inter SemiBold */
    --text-h5:         20px;   /* Desktop H5       — Inter SemiBold */
    --text-body:       16px;   /* Desktop body     — Inter Regular */
    --text-info:       16px;   /* Desktop info     — Inter Medium */
    --text-btn:        16px;   /* Desktop Buttons  — Inter Bold */
    --text-body-2:     14px;   /* Desktop body 2   — Inter Regular */
    --text-btn-sm:     14px;   /* Buttons (sm)     — Inter Bold */
    --text-small:      12px;   /* Desktop small    — Inter Regular */

    /* ── Typography — line heights ── */

    --lh-display:    1;
    --lh-h1:         1.05;
    --lh-h2:         1.1;
    --lh-subheading: 1;
    --lh-h4:         1.2;
    --lh-h5:         1.2;
    --lh-body:       1.5;

    /* ── Typography — letter spacing ── */

    --ls-footer: -1.1px;   /* Footer header + footer small text */

    /* ── Typography — weights ── */

    --fw-regular:   400;
    --fw-medium:    500;
    --fw-semibold:  600;
    --fw-bold:      700;

    /* ── Layout ── */

    --container-max:   1440px;   /* Full page width */
    --container-inner: 1280px;   /* Content width (80px gutter each side) */
    --gutter:          80px;     /* Side padding from edge to content */
    --gutter-mobile:   20px;

    /* ── Effects ── */

    --shadow-card: 4px 0px 17.6px rgba(51, 42, 18, 0.10);   /* Drop Shadow */

    /* ── Spacing scale ── */

    --space-1:   4px;
    --space-2:   8px;
    --space-3:  12px;
    --space-4:  16px;
    --space-5:  20px;
    --space-6:  24px;
    --space-8:  32px;
    --space-10: 40px;
    --space-12: 48px;
    --space-16: 64px;
    --space-20: 80px;   /* standard section gutter */
    --space-24: 96px;
    --space-32: 128px;
}
