/* Bacara Coffee Pricelist v2.1 — pixel-matched to Elementor output */

.bcp-pricelist {
    --bcp-blue: #011ED3;
    --bcp-orange: #f83609;
    --bcp-light: #FBF7EE;
    --bcp-body: #000000;
    --bcp-font-display: "Klaster Sans - Bold", "Klaster Sans", sans-serif;
    --bcp-font-body: "Klaster Sans - Regular", "Klaster Sans", sans-serif;
    max-width: 100%;
    background-color: var(--bcp-light);
}
.bcp-pricelist *, .bcp-pricelist *::before, .bcp-pricelist *::after {
    box-sizing: border-box; margin: 0; padding: 0;
}

/* ── NAV — sticky, centered ── */
.bcp-nav {
    display: flex; flex-wrap: wrap; justify-content: center;
    gap: 0; padding: 12px 0;
    position: sticky; top: 60px; z-index: 100;
    background-color: var(--bcp-light);
}
.bcp-nav-link {
    display: inline-block; font-family: var(--bcp-font-display);
    font-size: 18px; padding: 10px 24px; background: transparent;
    color: var(--bcp-body); cursor: pointer; border: none; border-radius: 0;
    line-height: 1.2; text-decoration: none; transition: background 0.2s, color 0.2s;
}
.bcp-nav-link:hover, .bcp-nav-link:focus { color: var(--bcp-light); background: var(--bcp-blue); text-decoration: none; }
.bcp-nav-link--funky:hover, .bcp-nav-link--funky:focus { background: var(--bcp-orange); }
.bcp-nav-link--active { color: var(--bcp-light); background: var(--bcp-blue); }
.bcp-nav-link--funky.bcp-nav-link--active { background: var(--bcp-orange); }

/* ── SECTION ── */
.bcp-section { margin-bottom: 40px; scroll-margin-top: 120px; }
.bcp-section-heading { padding: 10px 20px; margin-bottom: 16px; }
.bcp-section-heading--blue  { background-color: var(--bcp-blue); }
.bcp-section-heading--orange { background-color: var(--bcp-orange); }
.bcp-section-heading h2 {
    font-family: var(--bcp-font-display); font-size: 44px; line-height: 1.3;
    color: var(--bcp-light); text-align: center; font-weight: 700;
}

/* ══════════════════════════════
 * PRODUCT ROW
 * Matches: elementor-element-1d2d4835
 * ══════════════════════════════ */
.bcp-product {
    border-bottom: 2px solid var(--bcp-blue);
    padding: 12px 0 8px 0;
    background-color: var(--bcp-light);
}
.product-basic, .product-specialty, .product-drip-basic { border-color: var(--bcp-blue); }
.product-funky, .product-drip-funky { border-color: var(--bcp-orange); }

/* ══════════════════════════════
 * NAME + DESCRIPTORS wrapper
 * Matches: elementor-element-33c05ed
 * ══════════════════════════════ */
.bcp-product-name {
    width: 100%;
    margin-bottom: 4px;
}

/* ── Name heading (2e8144b0) ── */
.bcp-name {
    font-family: var(--bcp-font-display); font-size: 28px;
    line-height: 1.2; font-weight: 700;
}
.name-basic, .name-specialty, .name-drip-basic { color: var(--bcp-blue); }
.name-funky, .name-drip-funky { color: var(--bcp-orange); }

/* ── Descriptors (2ab14e67) ── */
.bcp-descriptors {
    font-family: var(--bcp-font-body); font-size: 16px;
    font-weight: 700; line-height: 1.4;
    margin-bottom: 2px;
}
.descriptors-basic, .descriptors-specialty, .descriptors-drip-basic { color: var(--bcp-blue); }
.descriptors-funky, .descriptors-drip-funky { color: var(--bcp-orange); }

/* ══════════════════════════════
 * DETAILS GRID (1edbf0fa)
 * 3 equal columns (1fr), no gap
 * ══════════════════════════════ */
.bcp-product-details {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(1, 1fr);
    grid-auto-flow: row;
    width: 100%;
}

/* ── Left column (360d1be9) ── */
.bcp-col-left {
    display: flex; flex-direction: column;
    gap: 12px 0;
    grid-column: span 1; grid-row: span 1;
}

.bcp-field {
    font-family: var(--bcp-font-body); font-size: 16px;
    line-height: 1.5; color: var(--bcp-body);
}
.bcp-field b { font-weight: 700; }

/* Variety/Harvest spacing */
.bcp-field + .bcp-field { margin-top: 0; }

/* ── Middle column (6a8d8043): 70% width, 80px left margin ── */
.bcp-col-middle {
    display: flex; flex-direction: column;
    gap: 6px 0; align-self: center;
    grid-column: span 1; grid-row: span 1;
    width: 70%; margin-left: 80px;
}

/* Processing & Type (426f7376, 6c54d463) */
.bcp-processing, .bcp-brew-type {
    font-family: var(--bcp-font-body); font-size: 16px; font-weight: 400;
    color: var(--bcp-body);
    border: 2px solid var(--bcp-blue);
    margin: 0; padding: 0; text-align: center;
    flex-grow: 1; flex-shrink: 0;
}
.processing-funky, .processing-drip-funky,
.type-funky, .type-drip-funky { border-color: var(--bcp-orange); }

/* ── Right column (81e3df1) ── */
.bcp-col-right {
    display: flex; flex-direction: column;
    gap: 6px 6px; align-self: center;
    grid-column: span 1; grid-row: span 1;
}

/* Characteristics row — CSS Grid for reliable 50/50 split */
.bcp-characteristics {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    width: 100%;
}

/* Weight & Price */
.bcp-weight, .bcp-price {
    display: block;
    font-family: var(--bcp-font-body); font-size: 16px; line-height: 1.4;
    color: var(--bcp-light);
    background-color: var(--bcp-blue);
    border: 2px solid var(--bcp-blue);
    margin: 0; padding: 0; text-align: center;
    min-width: 0;
}
.bcp-price { font-weight: 700; }

.weight-funky, .price-funky,
.weight-drip-funky, .price-drip-funky {
    background-color: var(--bcp-orange); border-color: var(--bcp-orange);
}

/* ══════════════════════════════
 * TABLET (matching Elementor breakpoints)
 * ══════════════════════════════ */
@media (max-width: 1024px) {
    .bcp-col-left { gap: 8px 0; }
    .bcp-col-middle {
        gap: 8px 0; margin-left: 0; width: 70%;
    }
    .bcp-col-right { gap: 8px 0; }
    .bcp-characteristics { gap: 6px; }
}

/* ══════════════════════════════
 * MOBILE (<768px)
 * ══════════════════════════════ */
@media (max-width: 767px) {
    .bcp-name { font-size: 22px; }
    .bcp-descriptors { font-size: 14px; }

    .bcp-product-details {
        grid-template-columns: repeat(1, 1fr);
        gap: 6px; grid-auto-flow: row;
    }

    .bcp-col-left { gap: 4px; }
    .bcp-col-middle {
        flex-direction: row; flex-wrap: wrap;
        justify-content: space-between;
        gap: 6px; margin-left: 0; width: 100%;
    }
    .bcp-col-right { margin-left: 0; }

    .bcp-field { font-size: 14px; }
    .bcp-processing, .bcp-brew-type { font-size: 12px; }
    .bcp-weight, .bcp-price { font-size: 12px; }
    .bcp-nav-link { font-size: 11px; padding: 6px 2px; }
    .bcp-section-heading h2 { font-size: 28px; }
    .bcp-characteristics { gap: 6px; }
}

/* ── Animation ── */
@keyframes bcpFadeInRight { from { opacity:0; transform:translateX(30px); } to { opacity:1; transform:translateX(0); } }
.bcp-product { animation: bcpFadeInRight 0.3s ease both; }
@media (prefers-reduced-motion: reduce) { .bcp-product { animation: none; } }
