@font-face {
    font-family: "Proxima Nova";
    src: url("../fonts/proxima-nova-regular.woff") format("woff");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "Proxima Nova";
    src: url("../fonts/proxima-nova-semibold.woff") format("woff");
    font-style: normal;
    font-weight: 500 900;
    font-display: swap;
}

:root {
    --socal-font: "Proxima Nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
    --bs-body-font-family: var(--socal-font);
    --bs-font-sans-serif: var(--socal-font);
    --bs-body-font-size: 16px;
}

body {
    font-family: var(--socal-font);
    font-size: 16px;
    line-height: 1.45;
    color: #333;
}

button, input, select, textarea, .btn, .form-control, .form-select {
    font-family: var(--socal-font);
}

h1 { font-size: 32px; }
h2, h3 { font-size: 30px; }
h4 { font-size: 24px; }
h5 { font-size: 22px; }
h6 { font-size: 18px; }

h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
    line-height: 1.2;
}

main .display-6 { font-size: 30px; }
main .fw-bold { font-weight: 600 !important; }
.btn, .form-control, .form-select { font-size: 16px; border-radius: 2px; }
.socal-header .socal-nav .nav-link { font-weight: 600; }
.socal-header-search button { font-size: 16px; font-weight: 600; }
.socal-category-menu a { font-size: 14px; font-weight: 600; }
.product-card .product-title { font-size: 16px; font-weight: 600; line-height: 1.3; }
.product-card .current-price { font-size: 18px; font-weight: 600; }
.product-card .product-meta-row { font-size: 14px; line-height: 1.4; }
.product-card .product-meta-row dt { font-weight: 600; }
.product-card .color-section { font-size: 12px; }
.category-card .category-title { font-size: 18px; font-weight: 600; }

:where(a, button, input, select, textarea):focus-visible {
    outline: 2px solid var(--socal-orange, #f05a24);
    outline-offset: 3px;
}

@media (max-width: 767.98px) {
    h1 { font-size: 28px; }
    h2, h3, main .display-6 { font-size: 24px; }
    .product-card .product-meta-row { font-size: 13px; }
}