/* ============================================================
   Por Camadas — brand.css
   Variáveis CSS e estilos globais de identidade visual
   ============================================================ */

/* ── Variáveis da marca ─────────────────────────────────── */
:root {
    --pc-red:    #E31B23;
    --pc-yellow: #F4C414;
    --pc-dark:   #272726;
    --pc-cream:  #F9F6F0;
    --pc-gray:   #D1D5DB;
    --pc-muted:  #6b6a69;
    --pc-border: #e2dfd8;

    --pc-font-heading: 'Barlow Condensed', sans-serif;
    --pc-font-body:    'Inter', sans-serif;
}

/* ── Reset e base ────────────────────────────────────────── */
*, *::before, *::after {
    box-sizing: border-box;
}

body {
    font-family: var(--pc-font-body) !important;
    background-color: var(--pc-cream) !important;
    color: var(--pc-dark) !important;
}

/* ── Tipografia — títulos ────────────────────────────────── */
h1, h2, h3, h4, h5, h6,
.entry-title,
.page-title,
.woocommerce-products-header__title,
.woocommerce-loop-product__title {
    font-family: var(--pc-font-heading) !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.02em;
    color: var(--pc-dark) !important;
}

/* ── Linha amarela da marca ──────────────────────────────── */
.pc-layer-line {
    height: 4px;
    background: var(--pc-yellow);
    width: 100%;
}

/* ── Botão principal (vermelho) ──────────────────────────── */
.pc-btn,
.ast-button-wrap a.button,
input[type="submit"],
button[type="submit"],
.wp-block-button__link {
    background: var(--pc-red) !important;
    color: #fff !important;
    border: none !important;
    font-family: var(--pc-font-body) !important;
    font-weight: 500 !important;
    font-size: 12px !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    padding: 14px 28px !important;
    border-radius: 0 !important;
    transition: background 0.2s ease !important;
    cursor: pointer;
}

.pc-btn:hover,
.ast-button-wrap a.button:hover,
input[type="submit"]:hover,
button[type="submit"]:hover,
.wp-block-button__link:hover {
    background: #c8161d !important;
}

/* ── Botão secundário (outline) ──────────────────────────── */
.pc-btn-out {
    background: transparent !important;
    color: var(--pc-dark) !important;
    border: 1.5px solid var(--pc-dark) !important;
    font-family: var(--pc-font-body) !important;
    font-weight: 500 !important;
    font-size: 12px !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    padding: 13px 28px !important;
    border-radius: 0 !important;
    transition: all 0.2s ease !important;
    cursor: pointer;
}

.pc-btn-out:hover {
    border-color: var(--pc-red) !important;
    color: var(--pc-red) !important;
}

/* ── Links ───────────────────────────────────────────────── */
a {
    color: var(--pc-dark);
    transition: color 0.2s;
}

a:hover {
    color: var(--pc-red);
}

/* ── Breadcrumb ──────────────────────────────────────────── */
.pc-breadcrumb {
    padding: 14px 48px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: var(--pc-muted);
    border-bottom: 1px solid var(--pc-border);
    background: #fff;
}

.pc-breadcrumb a {
    color: var(--pc-muted);
    text-decoration: none;
}

.pc-breadcrumb a:hover {
    color: var(--pc-red);
}

.pc-bc-sep {
    color: var(--pc-gray);
    margin: 0 4px;
}

/* ── Secção eyebrow (label acima de títulos) ─────────────── */
.pc-eyebrow {
    font-size: 11px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--pc-muted);
    margin-bottom: 8px;
    display: block;
}