/* BEST MEAT — Premium butcher shop, alternating dark/cream sections */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,500;0,700;1,500;1,700;1,900&family=Inter:wght@400;500;600;700;800&display=swap');

:root {
    --bm-black: #0a0a0a;
    --bm-cream: #f3ead7;
    --bm-cream-soft: #faf3e3;
    --bm-wood: #3a2818;
    --bm-wood-dark: #1c120a;
    --bm-red: #c8202c;
    --bm-red-deep: #a01821;
    --bm-gold: #e9b94a;
    --bm-gold-deep: #c99a2c;
    --bm-mute: rgba(10, 10, 10, .65);
    --bm-mute-cream: rgba(243, 234, 215, .75);
    --bm-line: rgba(10, 10, 10, .12);
    --bm-serif: 'Playfair Display', Georgia, serif;
    --bm-sans: 'Inter', system-ui, sans-serif;
}

*,
*::before,
*::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body.bm-body {
    background: var(--bm-cream);
    color: var(--bm-black);
    font-family: var(--bm-sans);
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; transition: opacity .25s, color .25s; }
button { background: 0; border: 0; cursor: pointer; font: inherit; color: inherit; }
ul { list-style: none; }
em { font-style: italic; }

/* ===== BUTTONS ===== */
.bm-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .95rem 2rem;
    border-radius: 999px;
    font-family: var(--bm-sans);
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    transition: transform .25s, background .25s, color .25s, box-shadow .25s;
    cursor: pointer;
    white-space: nowrap;
}
.bm-btn--red { background: var(--bm-red); color: var(--bm-cream); }
.bm-btn--red:hover { background: var(--bm-red-deep); transform: translateY(-2px); box-shadow: 0 10px 30px -10px rgba(200, 32, 44, .55); }
.bm-btn--dark { background: var(--bm-black); color: var(--bm-cream); }
.bm-btn--dark:hover { background: var(--bm-wood); transform: translateY(-2px); }
.bm-btn--cream { background: var(--bm-cream); color: var(--bm-black); }
.bm-btn--cream:hover { background: #fff; transform: translateY(-2px); box-shadow: 0 10px 30px -10px rgba(243, 234, 215, .35); }

/* ===== EYEBROWS / RIBBON ===== */
.bm-eyebrow {
    display: inline-block;
    font-family: var(--bm-serif);
    font-style: italic;
    font-size: 1rem;
    font-weight: 500;
    margin-bottom: 1rem;
}
.bm-eyebrow--red { color: var(--bm-red); }
.bm-eyebrow--gold { color: var(--bm-gold); text-transform: uppercase; font-style: normal; font-family: var(--bm-sans); font-size: .78rem; letter-spacing: .35em; font-weight: 600; }

.bm-ribbon {
    display: inline-block;
    background: var(--bm-red);
    color: var(--bm-cream);
    font-family: var(--bm-sans);
    font-weight: 700;
    font-size: .78rem;
    letter-spacing: .25em;
    padding: .65rem 1.65rem;
    margin: 1.25rem 0 1.5rem;
    position: relative;
    text-transform: uppercase;
    box-shadow: 0 6px 18px -6px rgba(200, 32, 44, .55);
}
.bm-ribbon::before,
.bm-ribbon::after {
    content: '';
    position: absolute;
    top: 0;
    width: 14px;
    height: 100%;
    background: var(--bm-red);
}
.bm-ribbon::before { left: -14px; clip-path: polygon(0 0, 100% 0, 100% 50%, 0 50%, 100% 50%, 100% 100%, 0 100%, 100% 50%); }
.bm-ribbon::after { right: -14px; clip-path: polygon(0 0, 100% 50%, 0 100%); }

/* ===== TOPBAR ===== */
.bm-topbar {
    background: var(--bm-black);
    color: var(--bm-cream);
    padding: .55rem 2rem;
    font-size: .78rem;
    letter-spacing: .12em;
}
.bm-topbar__inner {
    max-width: 1300px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    gap: 1rem;
    align-items: center;
}
.bm-topbar__sep { opacity: .4; }

/* ===== HEADER ===== */
.bm-header {
    background: var(--bm-cream);
    padding: 1.4rem 2rem;
    border-bottom: 1px solid var(--bm-line);
    position: sticky;
    top: 0;
    z-index: 50;
}
.bm-header__inner {
    max-width: 1300px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 2rem;
}
.bm-nav ul {
    display: flex;
    gap: 2rem;
}
.bm-nav a {
    font-size: .85rem;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--bm-black);
    position: relative;
}
.bm-nav a:hover { color: var(--bm-red); }
.bm-nav a.is-active { color: var(--bm-red); }
.bm-nav a.is-active::after {
    content: '';
    display: block;
    height: 2px;
    background: var(--bm-red);
    margin-top: 4px;
}
.bm-logo {
    display: flex;
    align-items: center;
    gap: .65rem;
    justify-content: center;
}
.bm-logo__mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: var(--bm-black);
    color: var(--bm-cream);
    font-family: var(--bm-serif);
    font-style: italic;
    font-weight: 700;
    font-size: 1.4rem;
    border: 2px solid var(--bm-red);
}
.bm-logo__name {
    font-family: var(--bm-serif);
    font-style: italic;
    font-weight: 700;
    font-size: 1.4rem;
    color: var(--bm-black);
    letter-spacing: -.01em;
}
.bm-header__cta {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    justify-content: flex-end;
}
.bm-header__phone {
    font-size: .9rem;
    font-weight: 600;
    color: var(--bm-black);
    border-bottom: 1px dashed var(--bm-black);
    padding-bottom: 2px;
}
.bm-header__phone:hover { color: var(--bm-red); border-bottom-color: var(--bm-red); }

/* ===== HERO ===== */
.bm-hero {
    position: relative;
    background-color: var(--bm-black);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    color: var(--bm-cream);
    padding: clamp(5rem, 10vw, 9rem) 2rem clamp(5rem, 8vw, 7rem);
    text-align: center;
    overflow: hidden;
    min-height: 92vh;
    display: flex;
    align-items: center;
    justify-content: center;
}
.bm-hero__inner {
    position: relative;
    max-width: 1100px;
    margin: 0 auto;
    z-index: 2;
}
.bm-hero__eyebrow {
    display: inline-block;
    font-family: var(--bm-serif);
    font-style: italic;
    font-weight: 500;
    font-size: 1.25rem;
    color: var(--bm-gold);
    margin-bottom: 1.5rem;
    transform: rotate(-3deg);
}
.bm-hero__title {
    font-family: var(--bm-serif);
    font-weight: 700;
    font-size: clamp(3.5rem, 12vw, 10rem);
    line-height: .9;
    letter-spacing: -.02em;
    text-transform: uppercase;
    color: var(--bm-cream);
    -webkit-text-stroke: 2px var(--bm-cream);
    text-shadow: 0 0 48px rgba(0, 0, 0, .35);
}
.bm-hero__title:not(:hover) {
    color: transparent;
}
.bm-hero__ribbon {
    margin-top: 2rem;
}
.bm-hero__lead {
    max-width: 560px;
    margin: 1.25rem auto 2rem;
    font-size: 1rem;
    color: var(--bm-mute-cream);
    line-height: 1.75;
}
.bm-hero__scroll {
    position: absolute;
    bottom: 2rem;
    left: 50%;
    transform: translateX(-50%);
    color: var(--bm-mute-cream);
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .35em;
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: .5rem;
}
.bm-hero__arrow {
    font-size: 1rem;
    animation: bm-bounce 2.4s ease-in-out infinite;
}
@keyframes bm-bounce {
    0%, 100% { transform: translateY(0); opacity: .65; }
    50% { transform: translateY(6px); opacity: 1; }
}

/* ===== STEAKS ===== */
.bm-steaks {
    background: var(--bm-cream);
    padding: clamp(4rem, 8vw, 7rem) 2rem;
    position: relative;
}
.bm-steaks__inner {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1.1fr;
    gap: 4rem;
    align-items: center;
}
.bm-steaks__text { position: relative; }
.bm-steaks__title {
    font-family: var(--bm-serif);
    font-weight: 700;
    font-size: clamp(2.5rem, 5vw, 4.25rem);
    line-height: 1.05;
    color: var(--bm-black);
    margin-bottom: 1.5rem;
    letter-spacing: -.02em;
}
.bm-steaks__title em {
    color: var(--bm-red);
    font-style: italic;
    font-weight: 900;
}
.bm-steaks__lead {
    color: var(--bm-mute);
    margin-bottom: 2rem;
    max-width: 460px;
    font-size: 1.02rem;
    line-height: 1.8;
}
.bm-steaks__visual {
    position: relative;
}
.bm-steaks__photo {
    aspect-ratio: 4/5;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 30px 60px -25px rgba(10, 10, 10, .35);
}
.bm-steaks__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.bm-price-badge {
    position: absolute;
    top: -32px;
    right: -32px;
    width: 140px;
    height: 140px;
    border-radius: 50%;
    background: var(--bm-gold);
    color: var(--bm-black);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    z-index: 3;
    box-shadow: 0 18px 40px -15px rgba(233, 185, 74, .6);
    transform: rotate(-12deg);
    border: 2px dashed var(--bm-black);
    font-family: var(--bm-serif);
}
.bm-price-badge__from {
    font-style: italic;
    font-size: .85rem;
    margin-bottom: -4px;
}
.bm-price-badge__amount {
    font-size: 2.7rem;
    font-weight: 900;
    line-height: 1;
}
.bm-price-badge__unit {
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .2em;
    margin-top: 4px;
    font-family: var(--bm-sans);
}

/* leafy decorations */
.bm-leaf {
    position: absolute;
    color: var(--bm-red);
    font-size: 2rem;
    opacity: .5;
    pointer-events: none;
}
.bm-leaf--bottom-left { bottom: -1rem; left: -1.5rem; transform: rotate(-25deg); }
.bm-leaf--top-right { top: -1.5rem; right: 30%; transform: rotate(20deg); color: var(--bm-gold); }
.bm-leaf--bottom-right { bottom: -1rem; right: -1rem; transform: rotate(35deg); }

/* ===== CHRISTMAS PROMO ===== */
.bm-christmas {
    position: relative;
    background-color: var(--bm-wood-dark);
    background-size: cover;
    background-position: center;
    background-blend-mode: overlay;
    color: var(--bm-cream);
    padding: clamp(5rem, 10vw, 8rem) 2rem;
    text-align: center;
    overflow: hidden;
    border-top: 6px solid var(--bm-red);
    border-bottom: 6px solid var(--bm-red);
}
.bm-christmas::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        repeating-linear-gradient(
            115deg,
            rgba(0, 0, 0, .14) 0,
            rgba(0, 0, 0, .14) 2px,
            transparent 2px,
            transparent 9px
        );
    pointer-events: none;
}
.bm-christmas__inner {
    position: relative;
    max-width: 920px;
    margin: 0 auto;
    z-index: 2;
}
.bm-christmas__title {
    font-family: var(--bm-serif);
    font-weight: 700;
    font-size: clamp(2.5rem, 7vw, 5.5rem);
    line-height: 1;
    letter-spacing: -.02em;
    text-transform: uppercase;
    color: var(--bm-cream);
    margin: 1rem 0 1.25rem;
}
.bm-christmas__title em {
    color: var(--bm-gold);
    font-style: italic;
    font-weight: 900;
    text-transform: none;
}
.bm-christmas__sub {
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: .4em;
    text-transform: uppercase;
    color: var(--bm-cream);
    margin-bottom: 2.5rem;
    opacity: .85;
}
.bm-discount-badge {
    position: absolute;
    top: 50%;
    right: 6%;
    transform: translateY(-50%);
    width: 200px;
    height: 200px;
    z-index: 3;
    pointer-events: none;
}
.bm-discount-badge__inner {
    position: absolute;
    inset: 28px;
    border-radius: 50%;
    background: var(--bm-red);
    color: var(--bm-cream);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-shadow: 0 18px 40px -15px rgba(200, 32, 44, .7);
    transform: rotate(-8deg);
}
.bm-discount-badge__big {
    font-family: var(--bm-serif);
    font-size: 3rem;
    font-weight: 900;
    line-height: 1;
}
.bm-discount-badge__small {
    font-size: .85rem;
    font-weight: 700;
    letter-spacing: .35em;
    margin-top: 4px;
}
.bm-discount-badge__ring {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    animation: bm-rotate 18s linear infinite;
}
@keyframes bm-rotate {
    to { transform: rotate(360deg); }
}

/* ===== FARM ===== */
.bm-farm {
    background: var(--bm-cream);
    padding: clamp(4rem, 8vw, 7rem) 2rem;
}
.bm-farm__inner {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: center;
}
.bm-farm__title {
    font-family: var(--bm-serif);
    font-weight: 700;
    font-size: clamp(2.25rem, 4.5vw, 3.75rem);
    line-height: 1.05;
    color: var(--bm-black);
    margin-bottom: 1.5rem;
    letter-spacing: -.02em;
}
.bm-farm__title em {
    color: var(--bm-red);
    font-style: italic;
    font-weight: 900;
}
.bm-farm__lead {
    color: var(--bm-mute);
    margin-bottom: 1.75rem;
    max-width: 480px;
    font-size: 1rem;
    line-height: 1.85;
}
.bm-farm__features {
    margin-bottom: 2rem;
    border-top: 1px solid var(--bm-line);
}
.bm-farm__features li {
    display: flex;
    align-items: center;
    gap: .85rem;
    padding: .9rem 0;
    border-bottom: 1px solid var(--bm-line);
    font-weight: 500;
    color: var(--bm-black);
}
.bm-farm__check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--bm-red);
    color: var(--bm-cream);
    font-size: .85rem;
    flex-shrink: 0;
}
.bm-farm__visual { position: relative; }
.bm-farm__photo {
    aspect-ratio: 5/4;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 30px 60px -25px rgba(10, 10, 10, .4);
}
.bm-farm__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ===== FOOTER ===== */
.bm-footer {
    background: var(--bm-black);
    color: var(--bm-cream);
    padding: clamp(3rem, 5vw, 4.5rem) 2rem 1.5rem;
}
.bm-footer__inner {
    max-width: 1300px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1.4fr 1.4fr 1fr;
    gap: 3rem;
    padding-bottom: 2.5rem;
    border-bottom: 1px solid rgba(243, 234, 215, .12);
}
.bm-footer__logo {
    display: flex;
    align-items: center;
    gap: .65rem;
    margin-bottom: 1.25rem;
}
.bm-footer__name {
    color: var(--bm-cream);
}
.bm-footer__brand .bm-logo__mark {
    background: var(--bm-cream);
    color: var(--bm-black);
}
.bm-footer__pitch {
    color: var(--bm-mute-cream);
    font-size: .92rem;
    line-height: 1.75;
    max-width: 380px;
}
.bm-footer__nav {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
}
.bm-footer__nav h4,
.bm-footer__contact h4 {
    font-family: var(--bm-serif);
    font-style: italic;
    font-weight: 700;
    font-size: 1.15rem;
    color: var(--bm-cream);
    margin-bottom: 1rem;
}
.bm-footer__nav ul li,
.bm-footer__contact p {
    margin: .5rem 0;
}
.bm-footer__nav a {
    color: var(--bm-mute-cream);
    font-size: .9rem;
}
.bm-footer__nav a:hover { color: var(--bm-red); }
.bm-footer__contact p {
    color: var(--bm-mute-cream);
    font-size: .9rem;
    line-height: 1.7;
}
.bm-footer__contact a:hover { color: var(--bm-red); }
.bm-footer__bottom {
    max-width: 1300px;
    margin: 1.5rem auto 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: .8rem;
    color: var(--bm-mute-cream);
    flex-wrap: wrap;
    gap: 1rem;
}
.bm-footer__year { color: var(--bm-red); font-weight: 700; }
.bm-footer__socials { letter-spacing: .15em; }

/* ===== UTILITIES / OVERRIDES ===== */
.preview-banner {
    background: var(--bm-red);
    color: var(--bm-cream);
    text-align: center;
    padding: .55rem;
    font-weight: 700;
    font-size: .82rem;
    letter-spacing: .15em;
    text-transform: uppercase;
}
[x-cloak] { display: none !important; }

/* ===== CONTACT PAGE (fallback styling) ===== */
.contact-page { padding: clamp(3rem, 6vw, 5rem) 2rem; background: var(--bm-cream); }
.contact-page .container { max-width: 1100px; margin: 0 auto; }
.contact-page .two-col { display: grid; grid-template-columns: 1fr 1.2fr; gap: 3rem; }
.contact-page h1 {
    font-family: var(--bm-serif);
    font-weight: 700;
    font-size: clamp(2rem, 4vw, 3.25rem);
    margin-bottom: 1.25rem;
    color: var(--bm-black);
}
.contact-page p { margin: .35rem 0; color: var(--bm-mute); }
.contact-page a { color: var(--bm-red); }
.contact-form label {
    display: block;
    margin-bottom: 1rem;
    font-weight: 600;
    font-size: .82rem;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--bm-black);
}
.contact-form input,
.contact-form select,
.contact-form textarea {
    display: block;
    width: 100%;
    margin-top: .5rem;
    padding: .85rem 1rem;
    border: 1px solid var(--bm-line);
    border-radius: 6px;
    background: #fff;
    font-family: var(--bm-sans);
    font-size: .95rem;
    color: var(--bm-black);
    text-transform: none;
    letter-spacing: 0;
    font-weight: 400;
}
.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus {
    outline: none;
    border-color: var(--bm-red);
    box-shadow: 0 0 0 3px rgba(200, 32, 44, .15);
}
.contact-form .hp { position: absolute; left: -10000px; }
.contact-form .btn,
.contact-form .btn-primary,
.contact-form button[type="submit"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .95rem 2rem;
    border-radius: 999px;
    background: var(--bm-red);
    color: var(--bm-cream);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: .82rem;
    border: 0;
    cursor: pointer;
}
.contact-form button[type="submit"]:hover { background: var(--bm-red-deep); }
.flash {
    padding: 1rem 1.25rem;
    border-radius: 6px;
    margin-bottom: 1.25rem;
    font-size: .92rem;
}
.flash-success { background: #e6f4ea; color: #1e5a32; border: 1px solid #b9dec5; }
.flash-error { background: #fceaea; color: #8a1620; border: 1px solid #ebbfc2; }

.not-found { padding: 5rem 2rem; text-align: center; background: var(--bm-cream); }
.not-found h1 {
    font-family: var(--bm-serif);
    font-size: clamp(2rem, 4vw, 3.25rem);
    margin-bottom: 1rem;
}
.not-found .btn,
.not-found .btn-primary {
    display: inline-block;
    margin-top: 1.5rem;
    padding: .95rem 2rem;
    border-radius: 999px;
    background: var(--bm-red);
    color: var(--bm-cream);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: .82rem;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 800px) {
    .bm-topbar__inner { flex-wrap: wrap; gap: .35rem; font-size: .68rem; }
    .bm-header { padding: 1rem; }
    .bm-header__inner {
        grid-template-columns: 1fr;
        gap: 1rem;
        text-align: center;
    }
    .bm-nav ul { justify-content: center; flex-wrap: wrap; gap: 1rem; }
    .bm-header__cta { justify-content: center; flex-wrap: wrap; }
    .bm-logo { justify-content: center; }

    .bm-hero { min-height: auto; padding: 5rem 1.25rem; }
    .bm-hero__title { font-size: clamp(2.75rem, 14vw, 4.5rem); -webkit-text-stroke-width: 1.5px; }
    .bm-hero__eyebrow { font-size: 1.05rem; }

    .bm-steaks__inner,
    .bm-farm__inner { grid-template-columns: 1fr; gap: 3rem; }
    .bm-steaks__text { order: 2; }
    .bm-steaks__visual { order: 1; }
    .bm-price-badge {
        width: 110px;
        height: 110px;
        top: -20px;
        right: -8px;
    }
    .bm-price-badge__amount { font-size: 2.1rem; }

    .bm-christmas__title { font-size: clamp(2.25rem, 9vw, 3.5rem); }
    .bm-christmas__sub { font-size: .82rem; letter-spacing: .25em; }
    .bm-discount-badge {
        position: relative;
        top: auto;
        right: auto;
        transform: none;
        margin: 2.5rem auto 0;
        width: 160px;
        height: 160px;
    }
    .bm-discount-badge__big { font-size: 2.4rem; }

    .bm-footer__inner {
        grid-template-columns: 1fr;
        gap: 2.25rem;
    }
    .bm-footer__nav { grid-template-columns: 1fr 1fr; }
    .bm-footer__bottom {
        flex-direction: column;
        text-align: center;
    }

    .contact-page .two-col { grid-template-columns: 1fr; gap: 2rem; }

    .bm-leaf { display: none; }
}
