/* Buckhorn Soil & Stone: shared touches loaded on every page (after the page's own styles). */

/* ---------- Ask about this / How much do I need? ---------- */
.card-actions {
    display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem;
    margin-top: auto; padding-top: 1rem;
    border-top: 1px solid rgba(93, 78, 55, 0.1);
}
.card-actions .ca-btn {
    display: inline-flex; align-items: center; gap: 0.4rem;
    padding: 0.55rem 0.9rem; border-radius: 2rem;
    font-size: 0.875rem; font-weight: 600; text-decoration: none; line-height: 1.2;
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.card-actions .ca-quote { background: var(--color-green, #4A6741); color: #fff; }
.card-actions .ca-quote:hover { background: var(--color-green-dark, #3A5233); }
.card-actions .ca-text { border: 1.5px solid var(--color-green, #4A6741); color: var(--color-green, #4A6741); padding: calc(0.55rem - 1.5px) calc(0.9rem - 1.5px); }
.card-actions .ca-text:hover { background: rgba(74, 103, 65, 0.08); }
.card-actions .ca-calc { color: var(--color-earth, #5D4E37); padding-left: 0.25rem; padding-right: 0.25rem; }
.card-actions .ca-calc:hover { color: var(--color-green, #4A6741); text-decoration: underline; }
.card-actions svg { flex: none; }
/* lists above the buttons no longer need to push to the bottom */
.product-card .card-actions ~ *, .boulder-card .card-actions ~ * { margin-top: 0; }
.product-card:has(.card-actions) .option-list,
.product-card:has(.card-actions) .size-list,
.product-card:has(.card-actions) .color-list { margin-top: 0; }

/* ---------- Call / Text / Quote bar on phones ---------- */
.mbar { display: none; }
@media (max-width: 768px) {
    .mbar {
        display: grid; grid-template-columns: 1fr 1fr 1.25fr; gap: 0.5rem;
        position: fixed; left: 0; right: 0; bottom: 0; z-index: 98;
        padding: 0.6rem 0.75rem calc(0.6rem + env(safe-area-inset-bottom));
        background: rgba(253, 251, 247, 0.96); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
        border-top: 1px solid rgba(93, 78, 55, 0.15); box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.06);
    }
    .mbar a {
        display: flex; align-items: center; justify-content: center; gap: 0.4rem;
        min-height: 46px; border-radius: 0.6rem; text-decoration: none;
        font-family: var(--font-body, Inter, sans-serif); font-weight: 600; font-size: 0.95rem;
        color: var(--color-earth-dark, #3D3225); background: white; border: 1px solid rgba(93, 78, 55, 0.18);
    }
    .mbar a.mbar-quote { background: var(--color-green, #4A6741); border-color: var(--color-green, #4A6741); color: white; }
    body.has-mbar { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
}

/* ---------- Open now badge ---------- */
.open-status {
    display: inline-flex; align-items: center; gap: 0.5rem;
    font-size: 0.9rem; font-weight: 600; color: var(--color-earth-dark, #3D3225);
    background: white; border: 1px solid rgba(93, 78, 55, 0.15); border-radius: 2rem;
    padding: 0.4rem 0.85rem; line-height: 1.2;
}
.open-status:empty { display: none; }
.open-status .dot { width: 0.55rem; height: 0.55rem; border-radius: 50%; background: #9CA3AF; flex: none; }
.open-status.is-open .dot { background: #2F9E55; box-shadow: 0 0 0 3px rgba(47, 158, 85, 0.18); }
.open-status.is-soon .dot { background: #D97706; }
.open-status .sub { font-weight: 500; color: var(--color-text-muted, #6B6560); }
.hero .open-status { margin-top: 1.25rem; }

/* ---------- Category buttons that stay pinned while scrolling ---------- */
.jump-sticky {
    position: fixed; left: 0; right: 0; z-index: 97;
    top: var(--jump-top, 72px);
    background: rgba(253, 251, 247, 0.97); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
    border-bottom: 1px solid rgba(93, 78, 55, 0.12); box-shadow: 0 6px 14px -10px rgba(0, 0, 0, 0.25);
    transform: translateY(-120%); opacity: 0; pointer-events: none;
    transition: transform 0.2s ease, opacity 0.2s ease;
}
.jump-sticky.show { transform: none; opacity: 1; pointer-events: auto; }
.jump-sticky nav {
    max-width: 1200px; margin: 0 auto; padding: 0.55rem 1rem;
    display: flex; gap: 0.5rem; overflow-x: auto; scrollbar-width: none; justify-content: flex-start !important; flex-wrap: nowrap !important;
}
.jump-sticky nav::-webkit-scrollbar { display: none; }
.jump-sticky a { white-space: nowrap; flex: none; }
.jump-sticky a.is-current { border-color: var(--color-green, #4A6741) !important; color: var(--color-green, #4A6741) !important; background: rgba(74, 103, 65, 0.08) !important; }
@media (prefers-reduced-motion: reduce) { .jump-sticky { transition: none; } }

/* ---------- Easier-to-read small text ---------- */
.product-card li:not([class*="caption"]), .boulder-card li:not([class*="caption"]) { font-size: 0.875rem; }
.size-caption, .option-caption, .color-caption, .chip-caption { font-size: 0.78rem !important; }
.product-card figcaption, .slab-photos figcaption, .featured-gallery figcaption { font-size: 0.8125rem; }
.photo-tag, .wet-tag, .inset-tag, .badge { font-size: 0.75rem !important; }
.product-spec { font-size: 0.85rem; }
.product-origin, .product-maker, .durability-label { font-size: 0.8rem; }
.sizes, .sizes span, .product-card dt, .boulder-card dt { font-size: 0.85rem; }
.review-source { font-size: 0.8125rem; }
.form-consent label { font-size: 0.8125rem !important; line-height: 1.5; }
.price-note, .slab-note, .hint, .result-math, .chip { font-size: 0.8125rem; }

/* ---------- Footer (same on every page) ---------- */
.sfoot { background: var(--color-earth-dark, #3D3225); color: rgba(255, 255, 255, 0.78); padding: 3.5rem 1.5rem 2rem; font-family: var(--font-body, Inter, sans-serif); }
.sfoot a { color: rgba(255, 255, 255, 0.85); text-decoration: none; }
.sfoot a:hover { color: white; text-decoration: underline; }
.sfoot-grid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 2.5rem; }
.sfoot h3 { font-family: var(--font-display, Outfit, sans-serif); color: white; font-size: 1.3rem; margin: 0 0 0.75rem; }
.sfoot h4 { color: white; font-size: 0.8rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.1em; margin: 0 0 1rem; }
.sfoot p { margin: 0 0 0.75rem; font-size: 0.925rem; line-height: 1.6; }
.sfoot ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.55rem; font-size: 0.925rem; }
.sfoot .sf-hours { display: grid; grid-template-columns: auto auto; gap: 0.25rem 1rem; font-size: 0.9rem; justify-content: start; }
.sfoot .sf-hours dt { color: rgba(255, 255, 255, 0.65); }
.sfoot .sf-hours dd { margin: 0; color: white; }
.sfoot .sf-note { font-size: 0.8rem; color: rgba(255, 255, 255, 0.6); margin-top: 0.5rem; }
.sfoot .sf-social { display: flex; gap: 0.6rem; margin-top: 1rem; }
.sfoot .sf-social a { width: 38px; height: 38px; border-radius: 0.5rem; background: rgba(255, 255, 255, 0.1); display: flex; align-items: center; justify-content: center; }
.sfoot .sf-social a:hover { background: rgba(255, 255, 255, 0.2); text-decoration: none; }
.sfoot .sf-contact a { font-weight: 600; color: white; }
.sfoot .open-status { background: rgba(255, 255, 255, 0.08); border-color: rgba(255, 255, 255, 0.15); color: white; margin: 0.25rem 0 0.75rem; }
.sfoot .open-status .sub { color: rgba(255, 255, 255, 0.65); }
.sfoot-bottom { max-width: 1200px; margin: 2.5rem auto 0; padding-top: 1.5rem; border-top: 1px solid rgba(255, 255, 255, 0.12); display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.75rem 1.5rem; font-size: 0.85rem; color: rgba(255, 255, 255, 0.6); }
.sfoot-bottom nav { display: flex; gap: 1.25rem; }
@media (max-width: 960px) { .sfoot-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .sfoot-grid { grid-template-columns: 1fr; gap: 2rem; } .sfoot { padding-top: 2.75rem; } }