```css
/* === SPLIFF SOCIETY BRAND OVERLAY — applies to WC product/cart/checkout/account === */
@import url('https://fonts.googleapis.com/css2?family=Red+Rose:wght@400;500;600;700&family=Raleway:wght@300;400;500;600;700&family=Caveat:wght@600;700&display=swap');

:root {
  --ss-brand: #9a1f22;
  --ss-brand-deep: #650f11;
  --ss-paper: #faf4ea;
  --ss-paper-warm: #f4ead6;
  --ss-ink: #0d0d0d;
  --ss-line: rgba(101, 15, 17, .18);
  --ss-text: #3d2a1a;
}

/* Body + base typography */
body, body.woocommerce-page, body.single-product {
  font-family: 'Raleway', system-ui, sans-serif !important;
  color: var(--ss-ink) !important;
  background: var(--ss-paper) !important;
}

h1, h2, .product_title, .entry-title {
  font-family: 'Caveat', cursive !important;
  font-weight: 700 !important;
  color: var(--ss-brand-deep) !important;
}

h3, h4, h5, h6 {
  font-family: 'Red Rose', serif !important;
  font-weight: 500 !important;
  color: var(--ss-brand-deep) !important;
}

p, li, td {
  color: var(--ss-text) !important;
  line-height: 1.6 !important;
}

/* Links */
a, .woocommerce a {
  color: var(--ss-brand) !important;
}
a:hover { color: var(--ss-brand-deep) !important; }

/* Buttons — Spliff red pill */
.button, button.button, .wp-block-button__link,
.wc-block-components-button:not(.is-link),
.woocommerce a.button, .woocommerce button.button,
.woocommerce input.button, .woocommerce #respond input#submit,
.woocommerce-page a.button, .woocommerce-page button.button,
input[type="submit"], button[type="submit"],
.single_add_to_cart_button {
  background: var(--ss-brand) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 999px !important;
  padding: 14px 26px !important;
  font-family: 'Raleway', sans-serif !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  transition: transform .2s, background .2s !important;
  text-decoration: none !important;
}
.button:hover, button.button:hover, .wp-block-button__link:hover,
.wc-block-components-button:not(.is-link):hover,
.single_add_to_cart_button:hover {
  background: var(--ss-brand-deep) !important;
  transform: translateY(-1px) !important;
}

/* Single product page — wrapper + spacing */
.single-product .product, .woocommerce div.product {
  max-width: 1200px;
  margin: 40px auto;
  padding: 0 24px;
}
.single-product .product .summary {
  background: #fff;
  padding: 32px;
  border-radius: 16px;
  border: 1px solid var(--ss-line);
}

/* Product title (.product_title) */
.single-product .product_title {
  font-size: clamp(40px, 5vw, 64px) !important;
  margin-bottom: 12px !important;
}

/* Price */
.woocommerce-Price-amount {
  font-family: 'Red Rose', serif !important;
  color: var(--ss-brand-deep) !important;
  font-weight: 600 !important;
}
.single-product p.price {
  font-size: 24px !important;
  margin-bottom: 24px !important;
}

/* Variations table */
.woocommerce div.product form.cart .variations select {
  border: 1.5px solid var(--ss-line) !important;
  border-radius: 8px !important;
  padding: 10px 14px !important;
  font-family: 'Raleway', sans-serif !important;
}

/* Quantity input */
.woocommerce .quantity .qty {
  border: 1.5px solid var(--ss-line) !important;
  border-radius: 8px !important;
  padding: 10px !important;
  font-family: 'Raleway', sans-serif !important;
}

/* Tabs */
.woocommerce-tabs ul.tabs li {
  background: var(--ss-paper-warm) !important;
  border-radius: 8px 8px 0 0 !important;
  border: 1px solid var(--ss-line) !important;
  border-bottom: 0 !important;
}
.woocommerce-tabs ul.tabs li a {
  color: var(--ss-brand-deep) !important;
  font-family: 'Raleway', sans-serif !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
  font-size: 12px !important;
  padding: 12px 22px !important;
}
.woocommerce-tabs ul.tabs li.active {
  background: #fff !important;
  border-color: var(--ss-line) !important;
}

/* Notices */
.woocommerce-info, .wc-block-components-notice-banner {
  background: var(--ss-paper-warm) !important;
  border-left: 4px solid var(--ss-brand) !important;
  padding: 14px 18px !important;
  border-radius: 8px !important;
  color: var(--ss-text) !important;
}

/* Tables */
.woocommerce table.shop_table {
  background: #fff !important;
  border: 1px solid var(--ss-line) !important;
  border-radius: 16px !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  overflow: hidden !important;
}
.woocommerce table.shop_table th {
  background: var(--ss-paper-warm) !important;
  color: var(--ss-brand-deep) !important;
  font-family: 'Raleway', sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  font-size: 12px !important;
  padding: 14px 18px !important;
}
.woocommerce table.shop_table td {
  padding: 16px 18px !important;
  border-top: 1px solid var(--ss-line) !important;
}

/* Form inputs (checkout, account) */
.wc-block-components-text-input input, .wc-block-components-textarea textarea,
.wc-block-components-select select, .input-text,
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
  border: 1.5px solid var(--ss-line) !important;
  border-radius: 8px !important;
  padding: 12px 14px !important;
  font-family: 'Raleway', sans-serif !important;
  font-size: 15px !important;
  background: #fff !important;
}

/* My Account nav */
.woocommerce-account .woocommerce-MyAccount-navigation ul {
  list-style: none !important;
  padding: 0 !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation li {
  border-bottom: 1px solid var(--ss-line) !important;
  padding: 0 !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a {
  display: block !important;
  padding: 14px 18px !important;
  font-family: 'Raleway', sans-serif !important;
  font-weight: 600 !important;
  color: var(--ss-brand-deep) !important;
  text-decoration: none !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
  background: var(--ss-brand) !important;
  color: #fff !important;
}

/* Hello Elementor specific cleanup */
.elementor-button-wrapper a.elementor-button {
  background: var(--ss-brand) !important;
  color: #fff !important;
  border-radius: 999px !important;
}
/* === Hide the OLD in-page custom Spliff header on custom pages === */
/* WPCode now provides the sitewide header — kill the duplicate baked into the page content */
body.page-id-34 .announcement, body.page-id-34 > header, body.page-id-34 header:not(.ss-eh-nav),
body.page-id-36 .announcement, body.page-id-36 > header, body.page-id-36 header:not(.ss-eh-nav),
body.page-id-38 .announcement, body.page-id-38 > header, body.page-id-38 header:not(.ss-eh-nav),
body.page-id-40 .announcement, body.page-id-40 > header, body.page-id-40 header:not(.ss-eh-nav),
body.page-id-42 .announcement, body.page-id-42 > header, body.page-id-42 header:not(.ss-eh-nav),
body.page-id-44 .announcement, body.page-id-44 > header, body.page-id-44 header:not(.ss-eh-nav),
body.page-id-46 .announcement, body.page-id-46 > header, body.page-id-46 header:not(.ss-eh-nav),
body.page-id-48 .announcement, body.page-id-48 > header, body.page-id-48 header:not(.ss-eh-nav),
body.page-id-50 .announcement, body.page-id-50 > header, body.page-id-50 header:not(.ss-eh-nav),
body.page-id-52 .announcement, body.page-id-52 > header, body.page-id-52 header:not(.ss-eh-nav),
body.page-id-54 .announcement, body.page-id-54 > header, body.page-id-54 header:not(.ss-eh-nav),
body.page-id-56 .announcement, body.page-id-56 > header, body.page-id-56 header:not(.ss-eh-nav),
body.page-id-58 .announcement, body.page-id-58 > header, body.page-id-58 header:not(.ss-eh-nav),
body.page-id-60 .announcement, body.page-id-60 > header, body.page-id-60 header:not(.ss-eh-nav),
body.page-id-62 .announcement, body.page-id-62 > header, body.page-id-62 header:not(.ss-eh-nav),
body.page-id-64 .announcement, body.page-id-64 > header, body.page-id-64 header:not(.ss-eh-nav),
body.page-id-66 .announcement, body.page-id-66 > header, body.page-id-66 header:not(.ss-eh-nav) {
  display: none !important;
}

/* Belt-and-suspenders: also hide by .brandmark which is unique to the in-page header */
body.page-id-34 .brandmark,
body.page-id-36 .brandmark,
body.page-id-38 .brandmark,
body.page-id-40 .brandmark,
body.page-id-42 .brandmark,
body.page-id-44 .brandmark,
body.page-id-46 .brandmark,
body.page-id-48 .brandmark,
body.page-id-50 .brandmark,
body.page-id-52 .brandmark,
body.page-id-54 .brandmark,
body.page-id-56 .brandmark,
body.page-id-58 .brandmark,
body.page-id-60 .brandmark,
body.page-id-62 .brandmark,
body.page-id-64 .brandmark,
body.page-id-66 .brandmark {
  display: none !important;
}
/* === Hide leftover theme site-title + WC breadcrumb on WC pages === */
.single-product .site-title,
.single-product .site-description,
.single-product .entry-title,
.single-product .page-header,
.single-product .woocommerce-products-header,
.single-product .woocommerce-breadcrumb,
.woocommerce-cart .site-title,
.woocommerce-cart .woocommerce-breadcrumb,
.woocommerce-checkout .site-title,
.woocommerce-checkout .woocommerce-breadcrumb,
.woocommerce-account .site-title,
.woocommerce-account .woocommerce-breadcrumb,
.tax-product_cat .site-title,
.tax-product_cat .woocommerce-breadcrumb,
.archive .site-title,
.archive .woocommerce-breadcrumb {
  display: none !important;
}

/* === Force Add to Cart button visible (no CSS-var fallback) === */
html body .single_add_to_cart_button,
html body button.single_add_to_cart_button,
html body input.single_add_to_cart_button,
html body .woocommerce-variation-add-to-cart button.button,
html body .woocommerce-variation-add-to-cart input.button,
html body .woocommerce div.product form.cart .button {
  background: #9a1f22 !important;
  background-color: #9a1f22 !important;
  color: #ffffff !important;
  border: 0 !important;
  border-radius: 999px !important;
  padding: 16px 32px !important;
  font-family: 'Raleway', sans-serif !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  visibility: visible !important;
  opacity: 1 !important;
  display: inline-block !important;
  cursor: pointer !important;
  text-shadow: none !important;
  box-shadow: none !important;
}
html body .single_add_to_cart_button:hover,
html body button.single_add_to_cart_button:hover,
html body .woocommerce div.product form.cart .button:hover {
  background: #650f11 !important;
  background-color: #650f11 !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}

/* Disabled state (when variations not yet picked) — show as muted but visible */
html body .single_add_to_cart_button.disabled,
html body .single_add_to_cart_button.wc-variation-selection-needed {
  background: #d4a57a !important;
  background-color: #d4a57a !important;
  color: #ffffff !important;
  cursor: not-allowed !important;
  opacity: 0.7 !important;
}
/* === Make VIEW CART / CONTINUE buttons in WC notices visible === */
html body .woocommerce-message,
html body .woocommerce-info,
html body .woocommerce-notices-wrapper .woocommerce-message {
  background: #fdf4e6 !important;
  border-left: 4px solid #9a1f22 !important;
  color: #3d2a1a !important;
  padding: 16px 20px !important;
  border-radius: 8px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
}
html body .woocommerce-message a.button,
html body .woocommerce-message a.button.wc-forward,
html body .woocommerce-info a.button,
html body .woocommerce a.button.wc-forward,
html body a.button.wc-forward,
html body .wc-forward {
  background: #9a1f22 !important;
  background-color: #9a1f22 !important;
  color: #ffffff !important;
  border: 0 !important;
  border-radius: 999px !important;
  padding: 12px 24px !important;
  font-family: 'Raleway', sans-serif !important;
  font-weight: 700 !important;
  font-size: 12px !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  visibility: visible !important;
  opacity: 1 !important;
  display: inline-block !important;
}
html body .woocommerce-message a.button:hover,
html body .wc-forward:hover {
  background: #650f11 !important;
  background-color: #650f11 !important;
  color: #ffffff !important;
}

```
/* Mobile WooCommerce product page — image + price + Type dropdown above the fold */
@media (max-width: 768px) {
  .woocommerce div.product .woocommerce-product-gallery,
  .woocommerce div.product div.images {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 12px 0 !important;
    float: none !important;
  }
  .woocommerce div.product .woocommerce-product-gallery__image img,
  .woocommerce div.product div.images img {
    max-height: 38vh !important;
    width: auto !important;
    margin: 0 auto !important;
    object-fit: contain !important;
    display: block !important;
  }
  .woocommerce div.product div.summary {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    clear: both !important;
  }
  .woocommerce div.product .product_title {
    font-size: 22px !important;
    margin: 4px 0 6px !important;
    line-height: 1.15 !important;
  }
  .woocommerce div.product p.price,
  .woocommerce div.product span.price {
    font-size: 18px !important;
    margin: 4px 0 8px !important;
  }
  .woocommerce div.product form.variations_form,
  .woocommerce div.product form.cart {
    margin-top: 6px !important;
  }
  .woocommerce div.product .woocommerce-product-gallery__trigger {
    display: none !important;
  }
}
/* Mobile sitewide nav — stack right-side CTAs below the logo so nothing falls off the edge */
@media (max-width: 640px) {
  .ss-eh-nav {
    flex-wrap: wrap !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 10px 14px !important;
    gap: 8px !important;
  }
  .ss-eh-brand {
    flex-shrink: 0 !important;
  }
  .ss-eh-right {
    order: 3 !important;
    width: 100% !important;
    justify-content: center !important;
    margin-top: 6px !important;
    gap: 8px !important;
  }
  .ss-eh-btn {
    padding: 9px 14px !important;
    font-size: 10px !important;
    letter-spacing: .12em !important;
  }
  .ss-eh-cart {
    width: 36px !important;
    height: 36px !important;
  }
}