body {
    background: url('/images/coffeeshop-small-backdrop.png') no-repeat center center fixed;
    background-size: cover;
}


.text-white {
    color: #ffffff;
}


.hero-text-shadow {
    text-shadow: 0 4px 14px rgba(0,0,0,0.75);
}

/* wrapper row like bookstore page */
.coffee-section-card {
    padding: 1.25rem;
}

/* RIGHT SIDE HERO CARD (opaque white) */
.coffee-hero-card {
    background: rgba(255, 255, 255, 0.92);
    border-radius: 1.25rem;
    padding: 1.5rem 1.5rem;
    box-shadow: 0 14px 30px rgba(0,0,0,0.35);
    border: 1px solid rgba(255, 255, 255, 0.35);
    color: #111827; /* black-ish text */
}

/* Pills */
.coffee-pill {
    background: rgba(255, 255, 255, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.35);
    color: #fff;
    padding: 0.6rem 0.9rem;
    font-weight: 600;
}

/* Checklist inside hero card */
.coffee-checklist {
    list-style: none;
    padding-left: 0;
    margin: 0;
}

    .coffee-checklist li {
        position: relative;
        padding-left: 1.6rem;
        margin-bottom: 0.65rem;
    }

        .coffee-checklist li::before {
            content: "✓";
            position: absolute;
            left: 0;
            top: 0.05rem;
            font-weight: 800;
            color: #2563eb;
        }

/* 3 INFO CARDS (opaque like bookstore section cards) */
.coffee-info-card {
    background: rgba(255, 255, 255, 0.95);
    border-radius: 1.25rem;
    padding: 1.35rem 1.35rem;
    box-shadow: 0 8px 18px rgba(0,0,0,0.1); /* softer */
    border: 1px solid rgba(17, 24, 39, 0.06);
    min-height: 0 !important;
    color: #111827;
}

/* Responsive tweaks */
@media (max-width: 991px) {
    .coffee-hero {
        border-radius: 1rem;
        margin-left: 0.5rem;
        margin-right: 0.5rem;
        margin-bottom: 2.25rem;
    }

    .coffee-section-card {
        padding: 1.5rem;
    }
}


.coffee-opaque-section {
    position: relative;
    max-width: 1250px;
    margin: 0 auto 4.5rem auto; /* <-- REAL spacing here */
    padding: 0; /* <-- IMPORTANT */
    border-radius: 18px;
    background: rgba(0, 0, 0, 0.20); /* dark glass */
    backdrop-filter: blur(10px);
    box-shadow: 0 8px 18px rgba(0,0,0,0.1); /* softer */
}

.coffee-opaque-card {
    background: rgba(255, 255, 255, 0.94);
    border-radius: 1.5rem;
    padding: 2rem 2rem;
    box-shadow: 0 18px 38px rgba(0,0,0,0.25);
    border: 1px solid rgba(17, 24, 39, 0.08);
}

.coffee-features-section {
    margin-bottom: 3.5rem;
    padding: 1.5rem;
}