/*
Theme Name: Storefront Child - LoyaltyDog Demo
Theme URI: https://demo2.loyalty.dog
Description: Premium child theme for the LoyaltyDog WooCommerce demo site. Modern typography, refined color palette, polished product cards, custom header/footer.
Author: LoyaltyDog
Author URI: https://loyaltydog.ai
Template: storefront
Version: 1.0.0
License: GNU General Public License v2 or later
Text Domain: storefront-child
*/
/*
 * Storefront Child - LoyaltyDog Demo
 * A premium modern design system for the WooCommerce demo.
 *
 * Design philosophy:
 * - Generous whitespace, premium typography (Inter for UI, Playfair Display for editorial accents)
 * - Restrained color palette with one accent (deep terracotta)
 * - Card-based product grid with hover states
 * - Sticky header, sticky add-to-cart on mobile
 */

/* ============================================================
   1. Design Tokens
   ============================================================ */
:root {
    --sfc-color-bg:           #fafaf7;     /* warm off-white */
    --sfc-color-bg-alt:       #f3f1ec;     /* slightly deeper for sections */
    --sfc-color-surface:      #ffffff;
    --sfc-color-ink:          #1a1a1a;     /* primary text */
    --sfc-color-ink-soft:     #4a4a4a;     /* secondary text */
    --sfc-color-ink-muted:    #8a8a8a;     /* tertiary text */
    --sfc-color-line:         #e8e4dd;     /* dividers */
    --sfc-color-accent:       #b8421f;     /* deep terracotta — the brand accent */
    --sfc-color-accent-hover: #963515;
    --sfc-color-success:      #2d6a4f;
    --sfc-color-star:         #d4a017;

    --sfc-font-sans:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --sfc-font-display: 'Playfair Display', Georgia, serif;

    --sfc-radius-sm: 4px;
    --sfc-radius:    8px;
    --sfc-radius-lg: 16px;

    --sfc-shadow-sm: 0 1px 2px rgba(26,26,26,0.04), 0 1px 4px rgba(26,26,26,0.04);
    --sfc-shadow:    0 4px 12px rgba(26,26,26,0.06), 0 2px 4px rgba(26,26,26,0.04);
    --sfc-shadow-lg: 0 12px 32px rgba(26,26,26,0.08), 0 4px 12px rgba(26,26,26,0.04);

    --sfc-container:   1280px;
    --sfc-header-h:    72px;
}

/* ============================================================
   2. Base typography & globals
   ============================================================ */
body {
    background: var(--sfc-color-bg);
    color: var(--sfc-color-ink);
    font-family: var(--sfc-font-sans);
    font-size: 16px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--sfc-font-display);
    color: var(--sfc-color-ink);
    letter-spacing: -0.01em;
    font-weight: 600;
}

.site-content, .site-main { background: transparent; }

a { color: var(--sfc-color-accent); transition: color 160ms ease; }
a:hover { color: var(--sfc-color-accent-hover); }

.page-header, .entry-header { display: none; } /* hero / Elementor carry the headings */

/* ============================================================
   3. Header — premium sticky header
   ============================================================ */
.site-header {
    background: var(--sfc-color-surface);
    border-bottom: 1px solid var(--sfc-color-line);
    box-shadow: var(--sfc-shadow-sm);
    padding: 0 !important;
    position: sticky;
    top: 0;
    z-index: 100;
}

.site-header .col-full {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 32px;
    max-width: var(--sfc-container);
    padding: 18px 32px;
    margin: 0 auto;
    min-height: var(--sfc-header-h);
}

/* Logo */
.site-logo-anchor, .site-branding .site-logo-anchor img,
.site-header .site-branding img {
    max-height: 44px;
    width: auto;
}

.site-header .site-branding { margin-bottom: 0; }
.site-header .site-title a, .site-header .site-description {
    color: var(--sfc-color-ink);
}
.site-header .site-title { font-family: var(--sfc-font-display); font-size: 24px; font-weight: 700; }

/* Primary nav */
.site-header .main-navigation { clear: none; float: none; }
.site-header .primary-navigation {
    display: flex !important;
    justify-content: center;
}
.site-header .primary-navigation ul.menu {
    display: flex;
    gap: 4px;
    list-style: none;
    margin: 0;
    padding: 0;
}
.site-header .primary-navigation ul.menu > li > a {
    color: var(--sfc-color-ink) !important;
    font-weight: 500;
    font-size: 15px;
    padding: 10px 16px !important;
    border-radius: var(--sfc-radius-sm);
    transition: background 160ms ease, color 160ms ease;
}
.site-header .primary-navigation ul.menu > li > a:hover {
    background: var(--sfc-color-bg-alt);
    color: var(--sfc-color-accent) !important;
}
.site-header .primary-navigation ul.menu > li.current-menu-item > a {
    color: var(--sfc-color-accent) !important;
}

/* Header right cluster: search + account + cart */
.site-header .secondary-navigation,
.site-header .site-header-cart {
    float: none !important;
    display: flex !important;
    align-items: center;
    gap: 8px;
}

.site-header .sfc-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    color: var(--sfc-color-ink);
    background: transparent;
    border: 0;
    transition: background 160ms ease, color 160ms ease;
    text-decoration: none;
}
.site-header .sfc-icon-btn:hover {
    background: var(--sfc-color-bg-alt);
    color: var(--sfc-color-accent);
}

.site-header .site-header-cart .cart-contents {
    background: var(--sfc-color-ink) !important;
    color: #fff !important;
    padding: 10px 18px !important;
    border-radius: 999px !important;
    font-weight: 500 !important;
    font-size: 14px;
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    transition: background 160ms ease;
}
.site-header .site-header-cart .cart-contents:hover {
    background: var(--sfc-color-accent) !important;
}
.site-header .site-header-cart .cart-contents .count {
    background: var(--sfc-color-accent) !important;
    color: #fff !important;
    border-radius: 999px;
    padding: 0 6px;
    font-size: 12px;
    font-weight: 600;
}

/* Hide Storefront's default handheld menu button on desktop */
.site-header .menu-toggle { display: none !important; }

/* ============================================================
   4. Footer
   ============================================================ */
.site-footer {
    background: #141414 !important;
    color: #b8b8b8 !important;
    padding: 64px 0 32px !important;
    border-top: 0 !important;
    margin-top: 80px;
}
.site-footer .col-full {
    max-width: var(--sfc-container);
    margin: 0 auto;
    padding: 0 32px;
}
.site-footer a { color: #d0d0d0 !important; }
.site-footer a:hover { color: #fff !important; }
.site-footer .footer-widgets {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 1fr;
    gap: 48px;
    padding-bottom: 48px;
    border-bottom: 1px solid #2a2a2a;
}
.site-footer .footer-widgets .widget {
    background: transparent !important;
    padding: 0 !important;
    color: #b8b8b8 !important;
    margin-bottom: 0;
    box-shadow: none;
}
.site-footer .widget h3, .site-footer .widget .widget-title {
    color: #fff !important;
    font-family: var(--sfc-font-sans) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 20px !important;
}
.site-footer .widget ul { list-style: none; margin: 0; padding: 0; }
.site-footer .widget ul li { padding: 6px 0 !important; border-bottom: 0 !important; }
.site-footer .widget p, .site-footer .widget li { color: #b8b8b8 !important; font-size: 14px; }
.site-footer .sfc-footer-brand { font-family: var(--sfc-font-display); font-size: 22px; color: #fff; margin-bottom: 14px; }
.site-footer .sfc-footer-tagline { font-size: 14px; line-height: 1.6; max-width: 320px; margin-bottom: 20px; }
.site-footer .sfc-newsletter-form {
    display: flex;
    gap: 8px;
    max-width: 360px;
}
.site-footer .sfc-newsletter-form input[type="email"] {
    flex: 1;
    background: #1f1f1f;
    border: 1px solid #2a2a2a;
    color: #fff;
    padding: 10px 14px;
    border-radius: var(--sfc-radius-sm);
    font-family: var(--sfc-font-sans);
    font-size: 14px;
}
.site-footer .sfc-newsletter-form input[type="email"]::placeholder { color: #6a6a6a; }
.site-footer .sfc-newsletter-form input[type="email"]:focus {
    outline: none;
    border-color: var(--sfc-color-accent);
}
.site-footer .sfc-newsletter-form button {
    background: var(--sfc-color-accent);
    color: #fff;
    border: 0;
    padding: 10px 20px;
    border-radius: var(--sfc-radius-sm);
    font-weight: 600;
    cursor: pointer;
    transition: background 160ms ease;
    font-size: 14px;
}
.site-footer .sfc-newsletter-form button:hover { background: var(--sfc-color-accent-hover); }

.site-footer .sfc-footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 32px;
    font-size: 13px;
}
.site-footer .sfc-footer-socials { display: flex; gap: 12px; }
.site-footer .sfc-footer-socials a {
    width: 36px; height: 36px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 50%;
    background: #1f1f1f;
    color: #b8b8b8;
    transition: background 160ms ease, color 160ms ease;
}
.site-footer .sfc-footer-socials a:hover { background: var(--sfc-color-accent); color: #fff; }

/* ============================================================
   5. WooCommerce — product cards, shop, single product
   ============================================================ */
.woocommerce ul.products {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px !important;
}
@media (max-width: 1100px) { .woocommerce ul.products { grid-template-columns: repeat(3, 1fr) !important; } }
@media (max-width: 820px)  { .woocommerce ul.products { grid-template-columns: repeat(2, 1fr) !important; } }
@media (max-width: 540px)  { .woocommerce ul.products { grid-template-columns: 1fr !important; } }

.woocommerce ul.products li.product {
    background: var(--sfc-color-surface) !important;
    border: 1px solid var(--sfc-color-line);
    border-radius: var(--sfc-radius);
    overflow: hidden !important;
    transition: transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    position: relative;
    display: flex !important;
    flex-direction: column;
}
.woocommerce ul.products li.product:hover {
    transform: translateY(-2px);
    box-shadow: var(--sfc-shadow-lg);
    border-color: transparent;
}

/* Image wrapper */
.woocommerce ul.products li.product .sfc-product-image {
    position: relative;
    aspect-ratio: 4 / 5;
    overflow: hidden;
    background: var(--sfc-color-bg-alt);
}
.woocommerce ul.products li.product .sfc-product-image a {
    display: block;
    width: 100%;
    height: 100%;
}
.woocommerce ul.products li.product img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 600ms cubic-bezier(.2,.7,.2,1);
}
.woocommerce ul.products li.product:hover img {
    transform: scale(1.04);
}

/* Badges */
.sfc-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    background: var(--sfc-color-ink);
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    padding: 5px 10px;
    border-radius: 999px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    z-index: 2;
}
.sfc-badge--sale { background: var(--sfc-color-accent); }
.sfc-badge--featured { left: auto; right: 12px; background: var(--sfc-color-ink); }

/* Title + price */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-family: var(--sfc-font-sans) !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: var(--sfc-color-ink) !important;
    padding: 16px 20px 4px !important;
    margin: 0 !important;
    line-height: 1.3 !important;
}
.woocommerce ul.products li.product .price {
    padding: 0 20px 12px !important;
    color: var(--sfc-color-ink) !important;
    font-size: 15px !important;
    font-weight: 600 !important;
}
.woocommerce ul.products li.product .price del {
    color: var(--sfc-color-ink-muted) !important;
    font-weight: 400 !important;
    opacity: 1 !important;
    display: inline-block;
    margin-right: 6px;
}
.woocommerce ul.products li.product .price ins { background: transparent; text-decoration: none; color: var(--sfc-color-accent); }

/* Add to cart button */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .added_to_cart {
    margin: 0 20px 20px !important;
    padding: 12px 20px !important;
    background: var(--sfc-color-ink) !important;
    color: #fff !important;
    border-radius: var(--sfc-radius-sm) !important;
    font-weight: 500 !important;
    font-size: 13px !important;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    transition: background 160ms ease, transform 160ms ease;
    display: block !important;
    text-align: center;
}
.woocommerce ul.products li.product .button:hover {
    background: var(--sfc-color-accent) !important;
}
.woocommerce ul.products li.product .added_to_cart {
    background: var(--sfc-color-success) !important;
}

.sfc-quick-view {
    display: none; /* hidden by default, can be revealed on hover via JS */
}

/* ============================================================
   6. Shop / archive page header
   ============================================================ */
.woocommerce-products-header,
.woocommerce .term-description {
    background: var(--sfc-color-bg-alt);
    padding: 56px 32px;
    margin-bottom: 48px;
    text-align: center;
    border-radius: var(--sfc-radius);
    border: 1px solid var(--sfc-color-line);
}
.woocommerce-products-header h1,
.woocommerce-products-header .woocommerce-products-header__title {
    font-family: var(--sfc-font-display);
    font-size: 42px;
    font-weight: 600;
    margin: 0 0 12px;
    color: var(--sfc-color-ink);
}
.woocommerce-products-header .term-description {
    background: transparent;
    border: 0;
    padding: 0;
    margin-top: 12px;
    font-size: 17px;
    color: var(--sfc-color-ink-soft);
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
}

/* ============================================================
   7. Single product page
   ============================================================ */
.single-product div.product {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 64px;
    margin-top: 32px;
}
@media (max-width: 900px) { .single-product div.product { grid-template-columns: 1fr; gap: 32px; } }

.single-product .woocommerce-product-gallery {
    background: var(--sfc-color-surface);
    border-radius: var(--sfc-radius);
    overflow: hidden;
    border: 1px solid var(--sfc-color-line);
}
.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image {
    aspect-ratio: 1 / 1;
    overflow: hidden;
}
.single-product .woocommerce-product-gallery img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

.single-product .product_title {
    font-family: var(--sfc-font-display);
    font-size: 38px;
    font-weight: 600;
    margin: 0 0 16px;
    line-height: 1.15;
}
.single-product .woocommerce-product-details__short-description,
.single-product .woocommerce-product-details__short-description p {
    color: var(--sfc-color-ink-soft);
    font-size: 16px;
    line-height: 1.7;
    margin-bottom: 24px;
}
.single-product .price {
    font-size: 28px !important;
    color: var(--sfc-color-ink) !important;
    font-weight: 600 !important;
    margin-bottom: 24px !important;
}
.single-product .price del { color: var(--sfc-color-ink-muted) !important; font-weight: 400 !important; }
.single-product .price ins { color: var(--sfc-color-accent) !important; text-decoration: none; }
.single-product .woocommerce-product-rating { color: var(--sfc-color-star); margin-bottom: 12px; }

.single-product form.cart {
    background: var(--sfc-color-bg-alt);
    border-radius: var(--sfc-radius);
    padding: 24px;
    margin-bottom: 24px;
}
.single-product form.cart .quantity .qty {
    height: 48px;
    width: 80px;
    border: 1px solid var(--sfc-color-line);
    border-radius: var(--sfc-radius-sm);
    padding: 0 12px;
    font-family: var(--sfc-font-sans);
    font-size: 16px;
}
.single-product form.cart .single_add_to_cart_button {
    background: var(--sfc-color-ink) !important;
    color: #fff !important;
    border-radius: var(--sfc-radius-sm) !important;
    padding: 14px 28px !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    transition: background 160ms ease;
    height: 48px;
}
.single-product form.cart .single_add_to_cart_button:hover { background: var(--sfc-color-accent) !important; }

/* ============================================================
   8. Cart + Checkout pages
   ============================================================ */
.woocommerce-cart .site-main,
.woocommerce-checkout .site-main {
    max-width: var(--sfc-container);
    margin: 0 auto;
    padding: 32px;
}
.woocommerce table.shop_table {
    border: 1px solid var(--sfc-color-line) !important;
    border-radius: var(--sfc-radius);
    overflow: hidden;
}
.woocommerce table.shop_table th {
    background: var(--sfc-color-bg-alt) !important;
    font-family: var(--sfc-font-sans) !important;
    font-weight: 600 !important;
    color: var(--sfc-color-ink) !important;
}
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button {
    background: var(--sfc-color-ink) !important;
    color: #fff !important;
    border-radius: var(--sfc-radius-sm) !important;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover {
    background: var(--sfc-color-accent) !important;
}

/* ============================================================
   9. Elementor polish for child theme sections
   ============================================================ */
.elementor-widget-heading .elementor-heading-title {
    font-family: var(--sfc-font-display);
    font-weight: 600;
    letter-spacing: -0.015em;
}
.elementor-section[data-settings*="sfc-pad-lg"] {
    padding-top: 96px !important;
    padding-bottom: 96px !important;
}

/* ============================================================
   10. Utilities
   ============================================================ */
.sfc-container {
    max-width: var(--sfc-container);
    margin: 0 auto;
    padding: 0 32px;
}
.sfc-section { padding: 80px 0; }
.sfc-section--alt { background: var(--sfc-color-bg-alt); }
.sfc-section--ink { background: var(--sfc-color-ink); color: #fff; }
.sfc-section--ink h1, .sfc-section--ink h2, .sfc-section--ink h3 { color: #fff; }

.sfc-eyebrow {
    display: inline-block;
    font-family: var(--sfc-font-sans);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--sfc-color-accent);
    margin-bottom: 12px;
}
.sfc-section--ink .sfc-eyebrow { color: #f3a17e; }

.sfc-h1 {
    font-family: var(--sfc-font-display);
    font-size: clamp(40px, 5vw, 64px);
    line-height: 1.05;
    font-weight: 600;
    letter-spacing: -0.02em;
    margin: 0 0 20px;
}
.sfc-h2 {
    font-family: var(--sfc-font-display);
    font-size: clamp(28px, 3.5vw, 42px);
    line-height: 1.15;
    font-weight: 600;
    letter-spacing: -0.015em;
    margin: 0 0 16px;
}
.sfc-lead {
    font-size: 18px;
    line-height: 1.6;
    color: var(--sfc-color-ink-soft);
    max-width: 640px;
}
.sfc-section--ink .sfc-lead { color: #c8c8c8; }

.sfc-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 28px;
    border-radius: var(--sfc-radius-sm);
    font-family: var(--sfc-font-sans);
    font-weight: 600;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    text-decoration: none;
    transition: all 160ms ease;
    border: 1px solid transparent;
}
.sfc-btn--primary {
    background: var(--sfc-color-ink);
    color: #fff;
}
.sfc-btn--primary:hover {
    background: var(--sfc-color-accent);
    color: #fff;
    transform: translateY(-1px);
}
.sfc-btn--accent {
    background: var(--sfc-color-accent);
    color: #fff;
}
.sfc-btn--accent:hover { background: var(--sfc-color-accent-hover); color: #fff; }
.sfc-btn--ghost {
    background: transparent;
    color: var(--sfc-color-ink);
    border-color: var(--sfc-color-ink);
}
.sfc-btn--ghost:hover {
    background: var(--sfc-color-ink);
    color: #fff;
}
.sfc-btn--ghost-light {
    background: transparent;
    color: #fff;
    border-color: rgba(255,255,255,0.4);
}
.sfc-btn--ghost-light:hover {
    background: #fff;
    color: var(--sfc-color-ink);
}

.sfc-divider {
    width: 56px;
    height: 1px;
    background: var(--sfc-color-accent);
    margin: 24px 0;
}

.sfc-grid-categories {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}
@media (max-width: 900px) { .sfc-grid-categories { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .sfc-grid-categories { grid-template-columns: 1fr; } }

.sfc-category-card {
    position: relative;
    overflow: hidden;
    border-radius: var(--sfc-radius);
    aspect-ratio: 4 / 3;
    background: var(--sfc-color-bg-alt);
    display: block;
    text-decoration: none;
    transition: transform 320ms ease;
}
.sfc-category-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 600ms cubic-bezier(.2,.7,.2,1);
}
.sfc-category-card:hover img { transform: scale(1.05); }
.sfc-category-card::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,0.65) 100%);
}
.sfc-category-card .sfc-category-card__inner {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 24px;
    color: #fff;
}
.sfc-category-card .sfc-category-card__name {
    font-family: var(--sfc-font-display);
    font-size: 24px;
    font-weight: 600;
    margin: 0 0 4px;
    line-height: 1.2;
}
.sfc-category-card .sfc-category-card__count {
    font-size: 13px;
    opacity: 0.85;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.sfc-feature-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
    text-align: center;
}
@media (max-width: 820px) { .sfc-feature-row { grid-template-columns: repeat(2, 1fr); } }
.sfc-feature-row .sfc-feature__icon {
    width: 48px;
    height: 48px;
    margin: 0 auto 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--sfc-color-bg-alt);
    color: var(--sfc-color-accent);
}
.sfc-feature-row .sfc-feature__title {
    font-family: var(--sfc-font-sans);
    font-weight: 600;
    font-size: 14px;
    margin: 0 0 6px;
}
.sfc-feature-row .sfc-feature__desc {
    font-size: 13px;
    color: var(--sfc-color-ink-soft);
    margin: 0;
    line-height: 1.5;
}

.sfc-testimonials {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}
@media (max-width: 820px) { .sfc-testimonials { grid-template-columns: 1fr; } }
.sfc-testimonial {
    background: var(--sfc-color-surface);
    border: 1px solid var(--sfc-color-line);
    border-radius: var(--sfc-radius);
    padding: 28px;
}
.sfc-testimonial .sfc-stars { color: var(--sfc-color-star); margin-bottom: 12px; font-size: 16px; }
.sfc-testimonial blockquote {
    margin: 0 0 16px;
    font-size: 15px;
    line-height: 1.6;
    color: var(--sfc-color-ink);
    font-style: italic;
}
.sfc-testimonial .sfc-customer { display: flex; align-items: center; gap: 12px; }
.sfc-testimonial .sfc-customer__avatar {
    width: 44px; height: 44px;
    border-radius: 50%;
    background: var(--sfc-color-accent);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-family: var(--sfc-font-display);
    font-size: 16px;
}
.sfc-testimonial .sfc-customer__name { font-weight: 600; font-size: 14px; }
.sfc-testimonial .sfc-customer__role { font-size: 12px; color: var(--sfc-color-ink-muted); }

.sfc-newsletter-block {
    background: var(--sfc-color-ink);
    color: #fff;
    border-radius: var(--sfc-radius-lg);
    padding: 56px;
    text-align: center;
}
.sfc-newsletter-block h2 { color: #fff; }
.sfc-newsletter-block .sfc-lead { color: #c8c8c8; margin: 0 auto 24px; }
.sfc-newsletter-block form {
    display: flex;
    gap: 8px;
    max-width: 480px;
    margin: 0 auto;
}
.sfc-newsletter-block input[type="email"] {
    flex: 1;
    background: #2a2a2a;
    border: 1px solid #3a3a3a;
    color: #fff;
    padding: 14px 18px;
    border-radius: var(--sfc-radius-sm);
    font-family: var(--sfc-font-sans);
    font-size: 14px;
}
.sfc-newsletter-block input[type="email"]::placeholder { color: #8a8a8a; }
.sfc-newsletter-block input[type="email"]:focus { outline: none; border-color: var(--sfc-color-accent); }
.sfc-newsletter-block button {
    background: var(--sfc-color-accent);
    color: #fff;
    border: 0;
    padding: 14px 28px;
    border-radius: var(--sfc-radius-sm);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    cursor: pointer;
    transition: background 160ms ease;
}
.sfc-newsletter-block button:hover { background: var(--sfc-color-accent-hover); }

@media (max-width: 640px) {
    .sfc-newsletter-block { padding: 32px 20px; }
    .sfc-newsletter-block form { flex-direction: column; }
}

/* Hide default Storefront primary sidebar widgets on shop */
.woocommerce .widget-area { display: none; }
.woocommerce .col2-set, .woocommerce-page .col2-set { max-width: 100%; }

/* ============================================================
   11. Cart widget + responsive header polish
   ============================================================ */
@media (max-width: 900px) {
    .site-header .col-full {
        grid-template-columns: 1fr auto;
        gap: 12px;
        padding: 14px 16px;
    }
    .site-header .main-navigation { display: none !important; }
    .site-header .menu-toggle { display: inline-flex !important; }
    .sfc-footer-widgets { grid-template-columns: 1fr 1fr !important; }
}
@media (max-width: 600px) {
    .site-footer .footer-widgets { grid-template-columns: 1fr !important; }
    .site-footer .sfc-footer-bottom { flex-direction: column; gap: 16px; text-align: center; }
}

/* === REVEAL ON SCROLL === */
/* === REVEAL === */
.sfc-reveal {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity 600ms ease, transform 600ms cubic-bezier(.2,.7,.2,1);
}
.sfc-revealed {
    opacity: 1;
    transform: translateY(0);
}
.site-header.sfc-header--scrolled {
    box-shadow: 0 4px 16px rgba(26,26,26,0.06), 0 1px 4px rgba(26,26,26,0.04);
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    body { -webkit-font-smoothing: antialiased; }
}