/* =========================================================
   TrophyKits.com Responsive Site Styles
   Cleaned and consolidated from the working site.css.

   Notes:
   - Duplicate selector blocks were consolidated where safe.
   - Later declarations from the original file were kept as the source of truth.
   - The unmatched extra closing brace found near the product detail controls
     was removed.
   - Ecommerce Templates overrides are intentionally specific and use
     !important where needed to win against generated styles.
========================================================= */

/* =========================================================
   01. Design tokens
========================================================= */

:root {
  --color-primary: #006778;
  --color-primary-hover: #073854;
  --color-primary-soft: #1196ad;
  --color-cream: #e9e9ed;
  --color-cream-light: #f3f4ea;
  --color-ink: #1f1f1f;
  --color-muted: #666;
  --color-border: #bcdddf;
  --color-surface: #ffffff;
  --color-page: #faf9f5;
  --conde-primary-dark: #034e5b;
  --font-body: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --container: 1520px;
  --space-xs: clamp(0.5rem, 0.4rem + 0.3vw, 0.75rem);
  --space-sm: clamp(0.75rem, 0.6rem + 0.5vw, 1rem);
  --space-md: clamp(1rem, 0.8rem + 0.8vw, 1.5rem);
  --space-lg: clamp(1.5rem, 1.1rem + 1.6vw, 2.5rem);
  --space-xl: clamp(2.25rem, 1.6rem + 2.6vw, 4rem);
  --radius-sm: 0.5rem;
  --radius-md: 0.9rem;
  --radius-lg: 1.25rem;
  --shadow-soft: 0 12px 30px rgba(31, 31, 31, 0.08);
}

/* =========================================================
   02. Base / reset
========================================================= */

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: var(--font-body);
  color: var(--color-ink);
  background: var(--color-page);
  line-height: 1.5;
}
img {max-width: 100%; height: auto; display: block;}
a {color: inherit; text-decoration-thickness: 0.08em; text-underline-offset: 0.18em;}
a:hover, a:focus-visible {color: var(--color-primary);}
button, input, select, textarea {font: inherit;}
.container {width: min(100% - 2rem, var(--container)); margin-inline: auto;}
.skip-link, .visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.skip-link:focus {
  width: auto;
  height: auto;
  clip: auto;
  padding: 0.75rem 1rem;
  margin: 0.75rem;
  background: #fff;
  color: var(--color-primary);
  z-index: 999;
}
.clean-list {list-style: none; padding: 0; margin: 0;}
div.qbopaque, div.iuopaque, div.ectopaque {z-index: 10000;}
div#softopaquediv.ectopaque {
  z-index: 30000 !important;
  box-sizing: border-box;
  padding: clamp(4.5rem, 10vh, 7rem) 1rem 1.5rem;
}
div.customfive {
  padding: 1rem 1.25rem !important;
  width: 95%;
  background: linear-gradient( 180deg, #255b68 0%, #ecfcff 100% );
  border: 1px solid rgba(140, 20, 20, 0.16);
  border-left: 5px solid var(--conde-primary-dark);
  border-radius: var(--radius-md);
  box-shadow: 0 6px 18px rgba(0,0,0,0.05);
  text-align: center !important;
  line-height: 1.25;
  font-size:24px;
}
/* =========================================================
   03. Buttons
========================================================= */
div.scart.sccheckout {
    position: relative;
}

div.scart.sccheckout::before {
    content: "\f07a";                 /* Shopping Cart */
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-65px, -50%);
    pointer-events: none;
    z-index: 2;
}

div.scart.sccheckout input.sccheckout {
    padding-left: 45px;
    font-family: inherit;
}
.btn, .ectbutton, input.ectbutton, button.ectbutton, input[type="button"].ectbutton, input[type="submit"].ectbutton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.75rem;
  padding: 0.75rem 1.15rem;
  border: 2px solid transparent;
  border-radius: 999px;
  background: var(--color-primary);
  color: #fff !important;
  font-family: var(--font-body);
  font-size: 0.95rem;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: 0.02em;
  text-align: center;
  text-decoration: none;
  text-shadow: none;
  cursor: pointer;
  transition: background-color 160ms ease,
    border-color 160ms ease,
    color 160ms ease,
    transform 160ms ease;
}
div.wishlistcontainer  button.detailwishlist{ background: var(--color-primary-soft) !important;}
div.wishlistcontainer  button.detailwishlist:hover{ background: var(--color-primary-hover) !important;}
.btn:hover, .btn:focus-visible, .ectbutton:hover, .ectbutton:focus-visible, input.ectbutton:hover, input.ectbutton:focus-visible, button.ectbutton:hover, button.ectbutton:focus-visible {
  background: var(--color-primary-hover) !important;
  color: #fff !important;
  transform: translateY(-1px) !important;
}

.btn-primary {
  background: var(--color-primary);
  color: #fff !important;
}

.btn-primary:hover, .btn-primary:focus-visible, .btn-hover {
  background: var(--color-primary-hover);
  color: #fff !important;
}

.btn-secondary {
  background: #fff;
  color: var(--color-primary) !important;
  border-color: rgba(102, 11, 28, 0.25);
}

.btn-secondary:hover, .btn-secondary:focus-visible {
  background: var(--color-cream-light);
  color: var(--color-cream) !important;
  border-color: var(--color-primary);
}

.btn-full {
  width: 100%;
}
/* =========================================================
   BRANDS
========================================================= */
.manufacturers_contain {
  padding: 0px;
  margin-bottom: 2px;
  max-width: 1600px;
  margin: 0 auto;
}
.manufacturers_contain_top {
  background: url(../images/manufacturer.jpg) no-repeat;
  border-bottom: 1px solid #e9e9e9;
  height: 38px;
  padding-left: 14px;
  font-family: Arial;
  font-size: 18px;
  line-height: 38px;
  text-decoration: none;
  color: #ffffff;
}
.manufacturers_contain_down {
  margin-top: 10px;
  border: 1px solid #e3e3e3;
}
div.brands {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
div.brandz {
  padding: 3px;
  margin: 8px;
  border: 1px solid #006778;
  border-radius: 4px;
  max-width: 130px;
}
/* =========================================================
   04. Header / mini cart
========================================================= */

.site-header {
  background: #fff;
  box-shadow: 0 1px 0 rgba(31, 31, 31, 0.08);
  position: relative;
  z-index: 20000;
}
.site-header {
  position: relative;
  z-index: 20000;
  overflow: visible !important;
}

.header-main {
  position: relative;
  z-index: 20001;
  overflow: visible !important;
}

.site-search {
  position: relative;
}

#selectecttext.autosearch {
  z-index: 300000 !important;
}
/* Make only the mega menu bar sticky */
#mgmenu1.mgmenu_container {
  position: sticky !important;
  top: 0;
  z-index: 10000;
  border-radius: 0;
}

/* Keep dropdowns above page content */
#mgmenu1 .dropdown_container {
  z-index: 10000;
}
.site-header,
.header-main,
.site-nav,
.nav-wrap {
  overflow: visible !important;
}
.top-strip {
  background: var(--color-primary);
  color: #fff;
  font-size: 0.9rem;
}

.top-strip a {
  color: #fff;
  font-weight: 700;
}

.top-strip__inner {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding-block: 0.45rem;
}

.top-strip p {
  margin: 0;
}

.mobile-brand {
  display: none;
}

.header-main {
  display: grid;
  grid-template-columns: auto minmax(220px, 1fr) auto auto;
  align-items: center;
  gap: var(--space-md);
  padding-block: var(--space-sm);
}

.brand img {
  width: clamp(110px, 12vw, 170px);
}

.site-search {
  display: flex;
  gap: 0.5rem;
}

/* =========================================================
   99. Miscellaneous / legacy support
========================================================= */

div.searchfilters_cntnr, div.searchprice_cntnr {
  display: none;
}
/* =================================
   Left Sidebar - ECT Blocks
================================= */

.sidebar-left {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.sidebar-left .sidebar-card {
  padding: 5px;
}
.sidebar-card-recpurcs .cstitle {
	display:none;
}

.sidebar-left .sidebar-card h2 {
  margin: 0 0 14px;
  color: var(--color-primary);
  font-size: 17px;
  font-weight: 900;
  text-align: center;
}

/* Products dynamic menu */
.sidebar-card--products:hover,
.sidebar-card--products:focus-within {
  overflow-y: auto;
}

.sidebar-card--products .ectverticalmenu2 {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  font-size: 13px;
  line-height: 1.25;
}

/* all menu items */
.sidebar-card--products .ectverticalmenu2 li {
  margin: 0 !important;
  padding: 0 !important;
  border-bottom: 1px solid rgba(0,0,0,.06);
}

/* all menu links */
.sidebar-card--products .ectverticalmenu2 a {
  display: block;
  padding: 7px 8px;
  color: var(--color-ink);
  text-decoration: none !important;
  border-radius: 7px;
}

/* top visible categories */
.sidebar-card--products .ectraq1 > a,
.sidebar-card--products .ectverticalmenu2 > li:first-child > a {
  color: var(--color-primary);
  font-weight: 900;
  background: var(--color-cream-light);
}

/* second level */
.sidebar-card--products .ectraq2 > a {
  padding-left: 16px;
  font-weight: 800;
}

/* third/fourth level */
.sidebar-card--products .ectraq3 > a {
  padding-left: 24px;
  font-size: 12px;
  color: #555;
}

.sidebar-card--products .ectraq4 > a {
  padding-left: 32px;
  font-size: 12px;
  color: #666;
}

.sidebar-card--products .ectverticalmenu2 a:hover {
  background: rgba(116,16,38,.08);
  color: var(--color-primary);
}

/* submenu indicators */
.sidebar-card--products .ectmenuhassub1 > a::after {
  content: "+";
  float: right;
  font-weight: 900;
  color: var(--color-primary);
}
/* Remove generated submenu arrows */
.sidebar-card--products ul.ectverticalmenu2 li > a::before {
    content: none !important;
    display: none !important;
}

/* Add plus icon for expandable items */
.sidebar-card--products .ectmenuhassub1 > a::after {
    content: "+";
    float: right;
    font-weight: 700;
    color: var(--color-primary);
}
/* Cart/account/sidebar mini blocks */
.sidebar-card--cart,
.sidebar-card--account,
.sidebar-card--newsletter,
.sidebar-card--navigation {
  font-size: 13px;
}
.minimailsubmit {
margin-top: 10px;	
}

.sidebar-card--newsletter {
  text-align: center;
}

.sidebar-left .ectbutton,
.sidebar-left input[type="button"],
.sidebar-left button {
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--color-primary) !important;
  color: #fff !important;
  padding: 9px 15px !important;
  font-weight: 800 !important;
  font-size: 13px !important;
  box-shadow: 0 4px 12px rgba(116,16,38,.2);
  cursor: pointer;
}

/* Mini signup */
.sidebar-card--newsletter input[type="text"],
.sidebar-card--newsletter input[type="email"],
.sidebar-card--newsletter input.ecttextinput {
  width: 100% !important;
  height: 38px;
  padding: 0 10px !important;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  box-sizing: border-box;
}

.sidebar-card__intro {
  margin: 0 0 12px;
  color: #444;
  font-size: 13px;
  line-height: 1.45;
}

/* Static navigation */
.sidebar-card--navigation ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.sidebar-card--navigation li {
  border-bottom: 1px solid rgba(0,0,0,.06);
}

.sidebar-card--navigation a {
  display: block;
  padding: 7px 4px;
  color: var(--color-ink);
  text-decoration: none;
}

.sidebar-card--navigation a:hover {
  color: var(--color-primary);
}
/* =================================
   Sidebar Mini Cart
================================= */

.sidebar-card--cart .minicart {
  width: 100% !important;
  margin: 0 !important;
  background: transparent !important;
}

.sidebar-card--cart .minicartcnt {
  padding: 0 !important;
  background: transparent !important;
  text-align: left !important;
  font: inherit !important;
  line-height: 1.4;
}

/* View cart row */
.sidebar-card--cart .minicartcnt:first-child {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  padding: 10px 12px !important;
  border-radius: var(--radius-md);
  background: var(--color-cream-light) !important;
}

.sidebar-card--cart .minicartcnt:first-child img {
  width: 18px;
  height: 18px;
  opacity: .7;
}

.sidebar-card--cart a.mincart {
  color: var(--color-primary) !important;
  font-weight: 900;
  text-decoration: none !important;
}

/* Item count */
.sidebar-card--cart .ectMCquant {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 26px;
  height: 26px;
  margin-right: 5px;
  border-radius: 999px;
  background: var(--color-primary);
  color: #fff;
  font-weight: 900;
  font-size: 12px;
}

.sidebar-card--cart .minicart > .minicartcnt:nth-child(2) {
  margin-bottom: 12px;
  color: var(--color-ink);
  font-weight: 800;
}

/* Item list */
.sidebar-card--cart .mcLNitems {
  margin: 0 0 14px;
  padding: 10px 0;
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
}

.sidebar-card--cart .mcLNitems .minicartcnt {
  position: relative;
  margin-bottom: 8px;
  padding-left: 14px !important;
  color: #444;
  font-size: 12px;
}

.sidebar-card--cart .mcLNitems .minicartcnt::before {
  content: "";
  position: absolute;
  left: 2px;
  top: .72em;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--color-primary);
  opacity: .75;
}

.sidebar-card--cart .mcLNitems .minicartcnt:last-child {
  margin-bottom: 0;
}

/* Total row */
.sidebar-card--cart .minicart > .minicartcnt:nth-last-child(2) {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 0 14px;
  padding-top: 2px !important;
  color: var(--color-ink);
  font-weight: 900;
}

.sidebar-card--cart .ectMCtot {
  color: var(--color-primary);
  font-size: 16px;
  font-weight: 900;
}

/* Checkout button */
.sidebar-card--cart .minicart > .minicartcnt:last-child {
  text-align: center !important;
}

.sidebar-card--cart .minicart button.mincart {
  width: 100%;
  min-height: 42px;
  margin: 0 !important;
  border-radius: 999px !important;
  font-size: 14px !important;
  font-weight: 900 !important;
}
/* =================================
   Sidebar Mini Account / Login
================================= */

.sidebar-card--account .minicart {
  width: 100% !important;
  margin: 0 !important;
  background: transparent !important;
}

.sidebar-card--account .minicartcnt {
  padding: 0 !important;
  background: transparent !important;
  text-align: center !important;
  font: inherit !important;
  line-height: 1.4;
}

/* Top status row */
.sidebar-card--account .minicartcnt:first-child {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 12px;
  color: #555;
  font-size: 13px;
}

.sidebar-card--account .minicartcnt:first-child img {
  width: 18px;
  height: 18px;
  opacity: .55;
}

/* Account/status text */
.sidebar-card--account .minicartcnt:nth-child(2) {
  margin-bottom: 14px;
  padding: 12px !important;
  border-radius: var(--radius-md);
  background: var(--color-cream-light) !important;
  color: var(--color-ink);
  font-size: 14px;
  font-weight: 700;
}

.sidebar-card--account .minicartcnt:nth-child(2) br {
  display: block;
  margin-bottom: 3px;
  content: "";
}

/* Logged-in name */
.sidebar-card--account .minicartcnt:nth-child(2) {
  text-wrap: balance;
}

/* Account link */
.sidebar-card--account a.mincart {
  color: var(--color-primary) !important;
  font-weight: 900;
  text-decoration: none !important;
}

/* Button row */
.sidebar-card--account .minicartcnt:last-child {
  text-align: center !important;
}

.sidebar-card--account button.mincart {
  min-width: 110px;
  min-height: 42px;
  margin: 0 !important;
  border-radius: 999px !important;
  font-size: 14px !important;
  font-weight: 900 !important;
}
/* =========================================================
   04. Header / mini cart
========================================================= */

.site-search input {
  width: 100%;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  padding: 0.75rem 1rem;
  background: var(--color-page);
}

.header-actions {
  display: flex;
  align-items: center;
  gap: 1rem;
  font-weight: 700;
}

.cart-link {
  text-decoration: none;
}

.cart-count {
  display: inline-grid;
  place-items: center;
  min-width: 1.5rem;
  min-height: 1.5rem;
  margin-left: 0.25rem;
  border-radius: 999px;
  background: var(--color-primary);
  color: #fff;
  font-size: 0.8rem;
}

.account-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-weight: 800;
  text-decoration: none;
}

.account-link i {
  color: var(--color-primary);
  font-size: 0.9rem;
}

.header-actions .ectdp_minicartmainwrapper_ct {
  position: relative;
  margin: 0;
  padding: 0;
}

.header-actions .ectdp_minicartmainwrapper {
  position: static;
  margin: 0;
  padding: 0;
  background: transparent;
}

.header-actions .ectdp_minicartopen {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin: 0;
  padding: 0;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

.header-actions .ectdp_minicartopen img {
  display: none;
}
.fa-cart-shopping::before, .fa-shopping-cart::before {
  font-weight: 900;
  color: white;
  font-size: 0.9rem;
}
.header-actions .ectdp_minicartopen a {
  color: var(--color-ink);
  text-decoration: none;
}
.header-actions .ectdp_minicartopen a:hover {
  color: var(--color-primary);
}

.header-actions .ectdp_minicartcontainer {
  position: absolute !important;
  top: calc(100% + 0.75rem);
  right: 0;
  z-index: 10000;
  width: 320px;
  max-width: calc(100vw - 2rem);
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-soft);
  padding: 0.75rem;
}

.header-actions .ectdp_pincart {
  font-weight: 800;
  border-bottom: 1px solid var(--color-border);
}

.header-actions .ectdp_minicartImg {
  max-width: 52px;
  max-height: 52px;
  object-fit: contain;
}

.header-actions .ectdp_minicartitemName {
  overflow: hidden;
  padding-right: 28px;
  line-height: 1.35;
  font-weight: 500;
}

.header-actions .dpminicartclose, .header-actions .dpminicartcheckout {
  font-weight: 600;
  letter-spacing: 0;
  font-size: 0.9rem;
  min-width: 100px;
  border: 0;
  border-radius: 999px;
  padding: 0.45rem 0.85rem;
  cursor: pointer;
}

.header-actions .dpminicartcheckout {
  background: var(--color-primary);
  color: #fff;
}

.header-actions .dpminicartclose {
  background: var(--color-cream-light);
  color: var(--color-primary);
}

.header-actions .ectdp_minicartcontainer, .header-actions .ectdp_minicartcontainer * {
  font-weight: 500;
}

.header-actions .ectdp_pincart, .header-actions .ectdp_minicarttotal {
  font-weight: 700;
}

.header-actions .minicartcnt_dp {
  margin: 0;
  padding: 0.5rem 0;
  font-size: 0.9rem;
  position: relative;
}

.header-actions .ectdp_minicartitemImg {
  float: left;
  width: 52px;
  margin-right: 0.75rem;
}

.header-actions .ectdp_minicartitemDelete {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  margin-left: 0.5rem;
  margin: 0;
  float: none;
}

.header-actions .ectdp_minicartitemDelete img {
  width: 18px;
  opacity: 0.65;
}

.header-actions .ectdp_minicarttotal {
  border-top: 1px solid var(--color-border);
  font-weight: 900;
  font-size: 1rem;
}
/* =================================
   Free Shipping Progress Message
================================= */

.tofreeshipping {
  position: relative;
  margin: 0 0 26px;
  padding: 18px 22px;
  border: 1px solid rgba(116,16,38,.14);
  border-radius: var(--radius-lg);
  background:
    linear-gradient(
      180deg,
      rgba(116,16,38,.045),
      rgba(255,255,255,0)
    ),
    var(--color-cream-light);

  color: var(--color-ink);
  font-size: clamp(17px, 2vw, 22px);
  font-weight: 700;
  line-height: 1.35;
  text-align: center;

  box-shadow:
    0 6px 18px rgba(0,0,0,.045);
}

/* Highlight dollar amount */
.tofreeshipping strong,
.tofreeshipping b {
  color: var(--color-primary);
}

/* Optional icon */
.tofreeshipping::before {
  content: "🚚";
  display: inline-block;
  margin-right: 10px;
  font-size: 1.1em;
  transform: translateY(1px);
}

/* Optional subtle shimmer/progress feel */
.tofreeshipping::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background:
    linear-gradient(
      120deg,
      rgba(255,255,255,0) 20%,
      rgba(255,255,255,.35) 50%,
      rgba(255,255,255,0) 80%
    );
  opacity: .45;
}

/* Mobile */
@media (max-width: 640px) {

  .tofreeshipping {
    padding: 16px 14px;
    font-size: 17px;
    margin-bottom: 20px;
  }

  .tofreeshipping::before {
    display: block;
    margin: 0 0 6px;
  }
}
/* =================================
   Cart Summary Area
================================= */

.cartshippingandtotals {
  display: flex !important;
  justify-content: flex-end;
  align-items: flex-start;
  gap: 24px;
  margin: 26px 0 0 !important;
  padding: 0 !important;
  border-top: 0 !important;
}

.cartshippingdetails:empty {
  display: none !important;
}

.carttotals {
  width: 100% !important;
  max-width: 480px;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Total rows */
.cartsubtotal_cntnr,
.cartgrandtotal_cntnr {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 18px;
  align-items: center;
}

.cartsubtotal_cntnr {
  padding: 0 0 12px;
}

.cartgrandtotal_cntnr {
  padding: 14px 0;
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
}

.cartsubtotaltext,
.cartgrandtotaltext,
.cartsubtotal,
.cartgrandtotal {
  width: auto !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

.cartsubtotaltext,
.cartsubtotal {
  font-size: 16px;
  font-weight: 700;
  color: var(--color-ink);
}

.cartgrandtotaltext {
  font-size: 21px;
  font-weight: 900;
  color: var(--color-ink);
}

.cartgrandtotal {
  font-size: 24px;
  font-weight: 900;
  color: var(--color-primary);
}

/* Affirm */
.carttotals .affirmcart {
  margin: 16px 0 18px;
  padding: 14px 16px;
  border: 1px solid rgba(116,16,38,.13);
  border-radius: var(--radius-md);
  background: var(--color-cream-light);
  color: #333;
  font-size: 14px !important;
  line-height: 1.45;
  text-align: center;
}

.carttotals .affirmcart::before {
  content: "Flexible payments available";
  display: block;
  margin-bottom: 5px;
  color: var(--color-primary);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.carttotals .affirmcart .affirm-ala-price {
  color: var(--color-primary);
  font-weight: 900;
}

.carttotals .affirmcart .affirm-modal-trigger {
  color: var(--color-primary) !important;
  font-weight: 900;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Coupon */
.carttotals .cartcoupon_cntnr {
  margin-top: 18px;
  padding: 18px;
  border: 1px solid rgba(116,16,38,.13);
  border-radius: var(--radius-lg);
  background: #fff;
  box-shadow: 0 4px 16px rgba(0,0,0,.045);
}

.carttotals .cartcoupontext {
  width: auto !important;
  display: block !important;
  margin: 0 0 10px !important;
  text-align: left !important;
}

.carttotals .cartcoupontext .discnum {
  color: var(--color-primary);
  font-size: 17px;
  font-weight: 900;
  line-height: 1.2;
  text-decoration: none !important;
}

.carttotals .cartcoupontext .discnum span {
  display: inline-block;
  margin-top: 3px;
  color: #555;
  font-size: 11px !important;
  font-weight: 700;
  text-decoration: none !important;
}

.carttotals .cartcoupon {
  width: auto !important;
  display: flex !important;
  gap: 10px;
  align-items: center;
  text-align: left !important;
}

.carttotals input.cpncart1 {
  flex: 1 1 auto;
  min-width: 0;
  width: auto !important;
  height: 46px;
  padding: 0 16px !important;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  background: #fff;
  font-size: 15px !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.04);
}

.carttotals .applycoupon1 {
  flex: 0 0 auto;
  min-width: 94px;
  height: 46px;
  padding: 0 22px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--color-primary) !important;
  color: #fff !important;
  font-weight: 900 !important;
  box-shadow: 0 6px 16px rgba(116,16,38,.22);
}

/* Checkout button alignment */
.cartcheckoutbuttons {
  display: flex !important;
  justify-content: flex-end;
  align-items: center;
  margin-top: 28px !important;
}

.cartcheckoutbuttons .checkoutopts {
  width: 100% !important;
  max-width: 480px;
  padding-bottom: 0 !important;
}

.cartcheckoutbuttons .checkoutbutton {
  width: 100% !important;
  min-height: 54px;
  border-radius: 999px !important;
  font-weight: 900 !important;
}

/* Mobile */
@media (max-width: 720px) {
  .cartshippingandtotals {
    display: block !important;
    margin-top: 22px !important;
  }

  .carttotals {
    max-width: none;
  }

  .carttotals .cartcoupon {
    flex-direction: column;
    align-items: stretch;
  }

  .carttotals input.cpncart1,
  .carttotals .applycoupon1 {
    width: 100% !important;
  }

  .cartcheckoutbuttons {
    display: block !important;
    margin-top: 22px !important;
  }

  .cartcheckoutbuttons .checkoutopts {
    max-width: none;
  }
}
/* =========================================================
   03. Buttons
========================================================= */

.ectdp_minicartcontainer .ectbutton {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-width: 128px;
  min-height: 44px;
  padding: 0.7rem 1.4rem !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--color-primary) !important;
  color: #fff !important;
  font-family: var(--font-body) !important;
  font-size: 1rem !important;
  font-weight: 800 !important;
  line-height: 1;
  box-shadow: 0 2px 6px rgba(0,0,0,0.12),
    inset 0 1px 0 rgba(255,255,255,0.08);
  cursor: pointer;
  transition: background 0.18s ease,
    transform 0.12s ease,
    box-shadow 0.18s ease;
}

.ectdp_minicartcontainer .ectbutton:hover {
  background: var(--conde-primary-dark) !important;
  color: #fff !important;
  box-shadow: 0 4px 10px rgba(0,0,0,0.16),
    inset 0 1px 0 rgba(255,255,255,0.1);
}

.ectdp_minicartcontainer .ectbutton:active {
  transform: translateY(1px);
}

/* =========================================================
   04. Header / mini cart
========================================================= */

.ectdp_minicartcontainer .dpminicartclose {
  background: #b9b6a7 !important;
  color: #fff !important;
}

.ectdp_minicartcontainer .dpminicartclose:hover {
  background: #9f9b8b !important;
  color: #fff !important;
}

.ectdp_minicartcontainer .minicartcnt_dp:last-child {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.9rem;
  padding-top: 0.75rem;
}

.ectdp_minicartcontainer .minicartcnt_dp:last-child br {
  display: none;
}

/* =========================================================
   05. Product detail top action strip
========================================================= */

.detailnavouter {
  display: grid;
  grid-template-columns: 1.15fr 0.9fr 1.15fr;
  gap: 1rem;
  width: 100%;
  margin: 0 0 var(--space-md);
  padding: 1rem;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
}

.detailnavinner {
  display: grid;
  grid-template-rows: 1fr auto;
  min-width: 0;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(102, 11, 28, 0.16);
  border-radius: var(--radius-md);
  box-shadow: 0 2px 10px rgba(0,0,0,0.04);
}

.detailnavinner a, .detailnavinner .navinnerinner {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 1rem;
  min-height: 150px;
  padding: 1rem 1.1rem 0.35rem;
  color: var(--color-ink);
  text-decoration: none;
}

.detailnavinner2 a {
  grid-template-columns: 1fr;
  justify-items: center;
  text-align: center;
}

.detailnavinner2 .navinnerinner {
  min-height: 0;
  padding: 0;
}

.navcattxt, .quest-detail-nav1 {
  color: var(--color-primary);
  font-weight: 900;
  font-size: clamp(1.1rem, 1.35vw, 1.55rem);
  line-height: 1.05;
}

.detailnav-catimg {
  max-height: 120px;
  max-width: 170px;
  object-fit: contain;
}

.detailnavinner2 img {
  max-height: 115px !important;
  width: auto;
}

.quest-detail-nav2 {
  display: grid;
  place-items: center;
  width: clamp(64px, 6vw, 88px);
  height: clamp(64px, 6vw, 88px);
  border-radius: 50%;
  background: var(--color-primary);
  color: #fff;
  box-shadow: 0 6px 18px rgba(102, 11, 28, 0.25);
}

.cssquestion {
  font-size: clamp(2.35rem, 4vw, 3.35rem);
  font-weight: 900;
  line-height: 1;
}
/* Fix product detail top cards at tablet widths */
@media (max-width: 1100px) and (min-width: 769px) {
  .detailnavouter {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .detailnavinner a,
  .detailnavinner .navinnerinner {
    gap: 0.55rem;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }

  .detailnavinner1 a {
    grid-template-columns: minmax(0, 1fr) minmax(70px, 92px);
  }

  .detailnav-catimg {
    max-width: 92px;
    max-height: 78px;
  }

  .navcattxt,
  .quest-detail-nav1 {
    font-size: 1rem;
  }
}
/* When the question card is hidden, make the remaining two cards fill the row */
@media (max-width: 768px) and (min-width: 641px) {
.detailnavouter {grid-template-columns: repeat(2, minmax(0, 1fr)) !important;  }
.detailnavinner3 {display: none !important;}
.detailnavinner1, .detailnavinner2 {width: 100%;}
}
/* Phone layout: keep two visible cards stacked and full width */
@media (max-width: 640px) {
.detailnavouter {grid-template-columns: 1fr !important;}
.detailnavinner3 {display: none !important;}
}
@media (max-width: 1150px) {
.detailnavinner3 {display:none;}
.detailnavouter {grid-template-columns: repeat(2, 1fr);}
}
ul.TabbedPanelsTabGroup > li.TabbedPanelsTab {
  background: var(--color-cream-light);
  font-size: 16px;
  font-family: inherit;
}
.TabbedPanelsTab.tab-video::before {content: "\f03d"; font-family: "Font Awesome 6 Free"; font-weight: 900; margin-right: 8px;}
.videolink {display: inline-block; max-width: 100%;}
.vidimage {position: relative; display: inline-block; max-width: 100%;}
.vidbackimg {display: block; max-width: 100%; height: auto;}
.vidproduct {position: absolute; top: 13%; left: 52%; width: 24%; transform: translateX(-50%);}
.vidfrontimg {display: block; width: 100%; height: auto;}
.TabbedPanelsTab.tab-details::before {content: "\f0c9"; font-family: "Font Awesome 6 Free"; font-weight: 900; margin-right: 8px;}
.TabbedPanelsTab.tab-instructions::before {content: "\f129"; font-family: "Font Awesome 6 Free"; font-weight: 900; margin-right: 8px;}
.TabbedPanelsTab.tab-templates::before {content: "\f15b"; font-family: "Font Awesome 6 Free"; font-weight: 900; margin-right: 8px;}
.detailbuybutton {font-family: inherit;}
.detailbuybutton::before {content: "\f07a"; font-family: "Font Awesome 6 Free"; font-weight: 900; margin-right: .5rem;}
.wishlistcontainer button.detailwishlist::before {content: "\f004"; font-family: "Font Awesome 6 Free"; font-weight: 900; margin-right: .5rem;}
div.socialmediabutton.smaskaquestion {position: relative;}
div.socialmediabutton.smaskaquestion::before {
    content: "\f075";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
	color: #fff;        /* <-- make icon white */
    position: absolute;
    left: 50%;
    transform: translateX(-78px);
    top: 50%;
    margin-top: -8px;
    pointer-events: none;
    z-index: 2;
}
div.socialmediabutton.smaskaquestion input.smaskaquestion {font-family: inherit; padding-left: 28px;}
/* =========================================================
   03. Buttons
========================================================= */
.detailnavinner .button, .detailnavinner .navbutntxt, .detailnavinner input.navbutntxt {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: end;
  min-height: 38px;
  margin: 0 auto 1rem;
  padding: 0.6rem 1.15rem;
  background: var(--color-primary) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 999px !important;
  font-family: var(--font-body);
  font-size: 0.9rem;
  font-weight: 900;
  line-height: 1.1;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}

.navbuttonaskq {
  width: calc(100% - 1.5rem) !important;
  margin: 0 0.75rem 1rem !important;
}

@media (max-width: 950px) {

  /* =========================================================
     05. Product detail top action strip
  ========================================================= */

  .detailnavouter {
    gap: 0.65rem;
    padding: 0.65rem;
  }

  .detailnavinner a, .detailnavinner .navinnerinner {
    min-height: 112px;
    gap: 0.5rem;
    padding: 0.75rem 0.75rem 0.25rem;
  }

  .navcattxt, .quest-detail-nav1 {
    font-size: 1rem;
  }

  .detailnav-catimg {
    max-height: 78px;
    max-width: 92px;
  }

  .detailnavinner2 img {
    max-height: 76px !important;
  }

  .quest-detail-nav2 {
    width: 54px;
    height: 54px;
  }

  .cssquestion {
    font-size: 2rem;
  }

  /* =========================================================
     03. Buttons
  ========================================================= */

  .detailnavinner .button, .detailnavinner .navbutntxt, .detailnavinner input.navbutntxt {
    min-height: 34px;
    margin-bottom: 0.65rem;
    padding: 0.5rem 0.7rem;
    font-size: 0.78rem;
  }

}

@media (max-width: 640px) {

  /* =========================================================
     05. Product detail top action strip
  ========================================================= */

  .detailnavouter {
    grid-template-columns: 1fr;
    gap: 0.65rem;
    padding: 0.65rem;
  }

  .detailnavinner {
    min-height: 0;
  }

  .detailnavinner a, .detailnavinner .navinnerinner {
    min-height: 76px;
    padding: 0.65rem 0.75rem;
    gap: 0.75rem;
  }

  .detailnavinner1 a {
    grid-template-columns: 1fr auto;
  }

  .detailnavinner2 a {
    grid-template-columns: 1fr auto;
    text-align: left;
    justify-items: stretch;
  }

  .detailnavinner2 .navinnerinner {
    order: 2;
    min-height: 0;
    padding: 0;
  }

  .detailnavinner2 .navbutn2 {
    order: 1;
    align-self: center;
  }

  .detailnavinner2 img {
    max-height: 62px !important;
  }

  .detailnavinner3 .navinnerinner {
    grid-template-columns: 1fr auto;
    min-height: 64px;
  }

  .navcattxt, .quest-detail-nav1 {
    font-size: 1rem;
    line-height: 1.05;
  }

  .quest-detail-nav1 br {
    display: none;
  }

  .quest-detail-nav2 {
    width: 46px;
    height: 46px;
  }

  .cssquestion {
    font-size: 1.9rem;
  }

  .detailnav-catimg {
    max-height: 64px;
    max-width: 84px;
  }

  /* =========================================================
     03. Buttons
  ========================================================= */

  .detailnavinner .button, .detailnavinner .navbutntxt, .detailnavinner input.navbutntxt {
    width: 100% !important;
    min-height: 34px;
    margin: 0.35rem 0 0;
    padding: 0.5rem 0.75rem;
    font-size: 0.82rem;
  }

  .navbuttonaskq {
    width: calc(100% - 1.5rem) !important;
    margin: 0 0.75rem 0.65rem !important;
  }

}

div.detailratingtext br {display:none;}
div.detailquantpricingwrap {margin-top: 1px !important;}


/* =========================================================
   07. Product detail quantity pricing
========================================================= */

.detailquantpricingwrap {
  width: 100% !important;
  max-width: 360px;
  margin: 0.75rem auto !important;
  border: 1px solid rgba(102, 11, 28, 0.22) !important;
  border-radius: var(--radius-md);
  overflow: hidden;
  background: #fff;
  box-shadow: 0 4px 14px rgba(0,0,0,0.05);
}

.detailquantpricing {
  width: 100% !important;
  display: table !important;
  border-collapse: collapse;
  text-align: center;
  font-size: 0.95rem;
}

.detailqpheading {
  display: table-caption !important;
  padding: 0.55rem 0.75rem !important;
  background: var(--color-primary) !important;
  color: #fff !important;
  font-weight: 900;
  letter-spacing: 0.01em;
}

.detailqpheaders {
  background: var(--color-cream-light);
}

.detailqpheadquant, .detailqpheadprice {
  padding: 0.5rem 0.65rem !important;
  color: var(--color-primary);
  font-weight: 900;
  border-bottom: 1px solid var(--color-border);
}

.detailqpquant, .detailqpprice {
  padding: 0.45rem 0.65rem !important;
  border-bottom: 1px solid rgba(102, 11, 28, 0.12);
}

.detailqprow:last-child .detailqpquant, .detailqprow:last-child .detailqpprice {
  border-bottom: 0;
}

.detailqpprice {
  font-weight: 900;
  color: var(--color-primary);
}

.detailqprow:nth-child(even) {
  background: #faf9f5;
}

/* =========================================================
   06. Product detail options
========================================================= */

div.detailoptiontext {
  margin: 1px 1px 0 0;
}

div.option {
  margin-top: 1px;
  margin-bottom: 3px;
}

.detailoptions {
  width: 100% !important;
  max-width: 520px;
  margin: 0.75rem auto !important;
  padding: 0 !important;
  background: #fff;
  border: 2px solid rgba(102, 11, 28, 0.18) !important;
  border-radius: var(--radius-md);
  overflow: hidden;
  box-shadow: 0 2px 6px rgba(0,0,0,0.05),
    0 10px 24px rgba(0,0,0,0.06) !important;
}

.detailoptioncontainer {
  display: grid;
  grid-template-columns: 1fr !important;
  gap: 0.3rem !important;
  align-items: start;
  margin: 0 !important;
  padding: 0.5rem 0.85rem !important;
  border-bottom: 1px solid rgba(102, 11, 28, 0.18) !important;
}

.detailoptioncontainer:last-child {
  border-bottom: 0 !important;
}

.detailoptiontext {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  color: var(--color-primary);
  font-weight: 900;
  line-height: 1.1;
}

.detailoptiontext label {
  margin-bottom: 0.15rem;
  font-size: 0.95rem;
  font-weight: 900;
  line-height: 1.1;
}

.detailoptioncontainer.label-notitle {
  padding-top: 0.25rem !important;
  padding-bottom: 0.35rem !important;
}

.detailoptioncontainer.label-notitle .detailoptiontext {
  display: none;
}

.detailoption input[type="text"], .detailoption input[type="number"], .detailoption textarea, .detailoption select {
  width: 100% !important;
  max-width: none !important;
  min-height: 38px !important;
  padding: 0.65rem 0.8rem !important;
  background: #fff !important;
  border: 2px solid rgba(102, 11, 28, 0.18) !important;
  border-radius: var(--radius-sm) !important;
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.04);
  font-family: var(--font-body);
  font-size: 0.95rem;
  line-height: 1.3;
}

.detailoption select {
  text-align: left;
  text-align-last: left;
}

input.detailprodoption {
  font-size: 14px;
  text-align: center;
}

.detailoptiontext .opttooltip {
  display: inline-flex;
  align-items: center;
  margin-left: 0.25rem;
  font-size: 0;
}

.detailoptiontext .opttooltip img {
  width: 18px;
  height: 18px;
  display: block;
}

.detailoption {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 1rem;
  align-items: center;
}

.detailoption label {
  display: inline-flex !important;
  align-items: center;
  gap: 0.6rem;
  width: auto !important;
  margin: 0 !important;
  margin-left: 2px !important;
  padding: 0 !important;
  font-weight: 700;
  line-height: 1.25;
  cursor: pointer;
}

.detailoption input[type="radio"], .detailoption input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  flex: 0 0 auto;
  width: 19px !important;
  height: 19px !important;
  min-height: 19px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff !important;
  border: 2px solid rgba(102, 11, 28, 0.45) !important;
  box-shadow: none !important;
  cursor: pointer;
  position: relative;
}

.detailoption input[type="radio"] {
  border-radius: 999px !important;
}

.detailoption input[type="checkbox"] {
  border-radius: 5px !important;
}

.detailoption input[type="radio"]:checked, .detailoption input[type="checkbox"]:checked {
  background: var(--color-primary) !important;
  border-color: var(--color-primary) !important;
}

.detailoption input[type="radio"]:checked::after, .detailoption input[type="checkbox"]:checked::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 48%;
  width: 5px;
  height: 9px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: translate(-50%, -55%) rotate(45deg);
}

.detailoption input[type="radio"]:hover, .detailoption input[type="checkbox"]:hover {
  border-color: var(--color-primary) !important;
}

.detailoption .ectwarning {
  border-color: var(--color-primary) !important;
  box-shadow: 0 0 0 3px rgba(102, 11, 28, 0.12) !important;
}

@media (min-width: 641px) {

  .detailoptions {
    max-width: 460px;
  }

  .detailoptioncontainer {
    gap: 0.25rem !important;
    padding-top: 0.45rem !important;
    padding-bottom: 0.45rem !important;
  }

  .detailoption input[type="text"], .detailoption input[type="number"], .detailoption textarea, .detailoption select {
    min-height: 34px !important;
    padding-top: 0.45rem !important;
    padding-bottom: 0.45rem !important;
  }

}

@media (max-width: 640px) {

  .detailoptions {
    max-width: none;
  }

  .detailoptioncontainer {
    gap: 0.35rem !important;
    padding: 0.7rem !important;
  }

}

.detailoptioncontainer[style*="display:none"], .detailoptioncontainer[style*="display: none"], .optioncontainer[style*="display:none"], .optioncontainer[style*="display: none"] {
  display: none !important;
}

/* =========================================================
   10. Product detail descriptions / popups
========================================================= */

.detaildescription .pop-wrapper {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  gap: 1.1rem 1rem;
  width: 100%;
  margin: 1.25rem auto;
  padding: 1.5rem 1.25rem;
  background: #fff;
  border: 2px solid rgba(102, 11, 28, 0.18);
  border-radius: var(--radius-lg);
  box-shadow: 0 3px 10px rgba(0,0,0,0.04),
    0 12px 24px rgba(0,0,0,0.05);
}

.detaildescription .figure-pop-cell {
  width: 88px;
  flex: 0 0 88px;
  margin: 0 !important;
  padding: 0.25rem;
  text-align: center;
}

.detaildescription .figure-pop-cell a {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.45rem;
  color: var(--color-ink);
  text-decoration: none;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.12;
}

.detaildescription .figure-pop-img-tb {
  width: auto !important;
  height: 82px !important;
  max-width: 82px !important;
  object-fit: contain;
  display: block;
  margin: 0 auto !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.detaildescription .figure-pop-cell a > div {
  width: auto !important;
  max-width: 88px;
  margin: 0 auto;
  word-break: normal;
  overflow-wrap: anywhere;
}

.detaildescription .helppop-title {
  margin: 0 0 0.5rem;
  color: var(--color-primary);
  font-size: clamp(1.4rem, 2vw, 2rem);
  font-weight: 900;
  line-height: 1.15;
  text-align: center;
}

.detaildescription .helppop-subtitle {
  display: block;
  margin-top: 0.35rem;
  color: var(--color-primary);
  font-size: 0.95rem !important;
  font-weight: 800;
  line-height: 1.45;
  text-align: center;
}

.detaildescription .figure-pop-footer {
  max-width: 760px;
  margin: 1.5rem auto 0;
  padding: 1rem 1.25rem;
  background: #fff;
  border: 2px solid rgba(102, 11, 28, 0.14);
  border-radius: var(--radius-md);
  text-align: center;
  color: var(--color-ink);
  font-size: 1rem;
  line-height: 1.5;
}

.detaildescription .figure-pop-footer strong {
  color: var(--color-primary);
}

.detaildescription .figure-pop-footer a {
  color: var(--color-primary);
  font-weight: 900;
}

@media (max-width: 640px) {

  .detaildescription .pop-wrapper {
    gap: 0.85rem 0.65rem;
    padding: 1rem 0.75rem;
  }

  .detaildescription .figure-pop-cell {
    width: 72px;
    flex-basis: 72px;
  }

  .detaildescription .figure-pop-img-tb {
    height: 66px !important;
    max-width: 66px !important;
  }

  .detaildescription .figure-pop-cell a {
    font-size: 0.7rem;
  }

}

.detaildescription .column-pop-title br {
  display: block;
}

.detaildescription .column-pop-title {
  margin: 1.5rem 0 0.75rem;
  color: var(--color-primary);
  font-size: clamp(1.25rem, 2vw, 1.75rem);
  font-weight: 900;
  line-height: 1.15;
  text-align: center;
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}

.detaildescription .pop-wrapper:has(.column-pop-cell) {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  gap: 0.75rem 0.65rem;
  width: 100%;
  margin: 1rem auto;
  padding: 1.25rem 1rem;
  background: #fff;
  border: 2px solid rgba(102, 11, 28, 0.18);
  border-radius: var(--radius-lg);
  box-shadow: 0 3px 10px rgba(0,0,0,0.04),
    0 12px 24px rgba(0,0,0,0.05);
}

.detaildescription .column-pop-cell {
  flex: 0 0 62px;
  width: 62px;
  margin: 0 !important;
  padding: 0.2rem;
  text-align: center;
}

.detaildescription .column-pop-cell a {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.3rem;
  color: var(--color-ink);
  font-size: 0.68rem;
  font-weight: 800;
  line-height: 1.08;
  text-decoration: none;
}

.detaildescription .column-pop-img-tb {
  display: block;
  margin: 0 auto !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* =========================================================
   02. Base / reset
========================================================= */

img.column-pop-img-tb {
  height: 75px !important;
  width: 26px !important;
}

/* =========================================================
   10. Product detail descriptions / popups
========================================================= */

.detaildescription .column-pop-cell a > div {
  width: auto !important;
  max-width: 62px;
  margin: 0 auto;
  overflow-wrap: anywhere;
}

@media (max-width: 640px) {

  .detaildescription .pop-wrapper:has(.column-pop-cell) {
    gap: 0.6rem 0.5rem;
    padding: 0.85rem 0.65rem;
  }

  .detaildescription .column-pop-cell {
    flex-basis: 58px;
    width: 58px;
  }

  .detaildescription .column-pop-img-tb {
    height: 82px !important;
    max-width: 48px !important;
  }

  .detaildescription .column-pop-cell a {
    font-size: 0.62rem;
  }
#mainbodyspan.proddetail .detaildescription {overflow: scroll;}
}

/* =========================================================
   09. Product detail layout
========================================================= */

#mainbodyspan.proddetail > form[id^="ectform"] {
  display: grid !important;
  grid-template-columns: minmax(260px, 42%) minmax(320px, 1fr);
  grid-template-areas:
    "nav nav"
    "image right"
    "custom1 custom1"
    "custom3 custom3"
    "customfive customfive"
    "description description"
    "reviews reviews";
  gap: 0.85rem 2rem;
  align-items: start;
}

#mainbodyspan.proddetail .catnavandcheckout {
  grid-area: nav;
}

#mainbodyspan.proddetail .detailcustom1 {
  grid-area: custom1;
}

#mainbodyspan.proddetail .detailcustom3 {
  grid-area: custom3;
}

#mainbodyspan.proddetail .detail-right-rail {
  grid-area: right;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.55rem;
  width: 100%;
}
#mainbodyspan.proddetail .customfive {grid-area: customfive;}
#mainbodyspan.proddetail .detaildescription {grid-area: description;}
#mainbodyspan.proddetail .reviews {grid-area: reviews;}
#mainbodyspan.proddetail .detail-right-rail > * {width: min(100%, 460px) !important; margin-left: auto !important; margin-right: auto !important; text-align: center;}
#mainbodyspan.proddetail .detailname h1 {margin: 0 0 0.15rem !important; line-height: 1.08;}
#mainbodyspan.proddetail .detailsku {width: min(100%, 460px) !important; margin-left: auto !important; margin-right: auto !important; text-align: center !important; justify-self: center !important;}
#mainbodyspan.proddetail .detailsku img, #mainbodyspan.proddetail .detailsku iframe, #mainbodyspan.proddetail .detailsku video {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
#mainbodyspan.proddetail .detailreviewstars {
  margin: 0 !important;
}
#mainbodyspan.proddetail .detailreviewstars svg.icon {
  width: 34px !important;
  height: 34px !important;
  max-width: 34px !important;
  fill: var(--color-primary) !important;
}
#reviews {scroll-margin-top: 240px;}
@media (max-width: 768px) {
  #reviews {scroll-margin-top: 20px;}
}
/* =========================================================
   /* Begin DESIGNER SAMPLES------*/
========================================================= */
.designer-samples {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 14px;
  justify-items: center;
  align-items: start;
}
.designer-samples .samplelefttop,
.designer-samples .samplerighttop,
.designer-samples .sampleleftbottom,
.designer-samples .samplerightbottom {
  float: none !important;
  margin: 0 !important;
}
.designer-samples a {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  text-decoration: none;
}

.designer-samples img.sample {
  height: 120px;
  width: auto;
  max-width: 100%;
  border: 1px solid #cfc6b8;
  background: #fff;
}
.designer-samples input.sample {width: 130px; margin: 0;}
@media (max-width: 360px) {
  .designer-samples {grid-template-columns: 1fr;}
}
.designer-samples{display:grid; grid-template-columns:repeat(2, 1fr); gap:10px 8px; width:100%; max-width:300px; margin:0 auto;}
.designer-samples .samplelefttop, .designer-samples .samplerighttop, .designer-samples .sampleleftbottom, .designer-samples .samplerightbottom{
  float:none !important;
  width:auto !important;
  margin:0 !important;
  padding:0 !important;
  min-width:0;
}
.designer-samples a{display:flex; flex-direction:column; align-items:center; text-decoration:none;}
.designer-samples img.sample{width:95px; height:auto; margin:0 0 4px 0;}
.designer-samples input.sample{
  width:95px;
  padding:6px 4px !important;
  font-size:13px;
  line-height:1.1;
  margin:0;
  border-radius:16px;
}
/* End DESIGNER SAMPLES------*/
/* =========================================================
   09. Product detail layout
========================================================= */

#mainbodyspan.proddetail .detailcustom1, #mainbodyspan.proddetail .detailcustom3, #mainbodyspan.proddetail .detailimage > .detailcustom2 {
  justify-self: center;
  width: min(100%, 360px) !important;
  text-align: center !important;
}

#mainbodyspan.proddetail .detailcustom1:empty, #mainbodyspan.proddetail .detailcustom3:empty {
  display: none !important;
}
/* Center custom2 image/info block */
.detailcustom2,
.detailcustom2 #showhiddenhasstud {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.detailcustom2 a {
  display: inline-block;
}

.detailcustom2 img {
  display: block;
  margin: 0 auto;
  max-width: 100%;
  height: auto;
}
.detailcustom2 {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
/* =========================================================
   08. Product detail purchase controls
========================================================= */

#mainbodyspan.proddetail .detailquantitytext {
  display: none;
}

#mainbodyspan.proddetail .detailquantity2div {
  display: inline-flex !important;
  float: none !important;
  margin: 0 auto !important;
}

/* =========================================================
   09. Product detail layout
========================================================= */

#mainbodyspan.proddetail .detailcustom1, #mainbodyspan.proddetail .detailcustom3 {
  padding: 0.75rem;
  background: var(--color-cream-light);
  border: 1px solid rgba(102, 11, 28, 0.14);
  border-radius: var(--radius-md);
  box-shadow: 0 4px 14px rgba(0,0,0,0.04);
  text-align: center !important;
}

#mainbodyspan.proddetail .detailcustom1 > *, #mainbodyspan.proddetail .detailcustom3 > * {
  margin-left: auto !important;
  margin-right: auto !important;
}

#mainbodyspan.proddetail .detailcustom1 img, #mainbodyspan.proddetail .detailcustom3 img, #mainbodyspan.proddetail .detailcustom1 iframe, #mainbodyspan.proddetail .detailcustom3 iframe {
  display: block !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

#mainbodyspan.proddetail .detailcustom1 a, #mainbodyspan.proddetail .detailcustom3 a {
  display: inline-block;
}

/* =========================================================
   03. Buttons
========================================================= */

#mainbodyspan.proddetail .detailcustom1 button, #mainbodyspan.proddetail .detailcustom3 button, #mainbodyspan.proddetail .detailcustom1 .button, #mainbodyspan.proddetail .detailcustom3 .button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
}

#mainbodyspan.proddetail .detailcustom1 .button, #mainbodyspan.proddetail .detailcustom3 .button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0.7rem 1.35rem !important;
  background: var(--color-primary) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 999px !important;
  font-family: var(--font-body) !important;
  font-size: 0.95rem !important;
  font-weight: 800 !important;
  line-height: 1.1;
  text-decoration: none !important;
  box-shadow: 0 2px 6px rgba(0,0,0,0.08),
    inset 0 1px 0 rgba(255,255,255,0.08);
  transition: background 0.2s ease,
    transform 0.15s ease,
    box-shadow 0.2s ease;
}

#mainbodyspan.proddetail .detailcustom1 .button:hover, #mainbodyspan.proddetail .detailcustom3 .button:hover {
  background: var(--conde-primary-dark) !important;
  color: #fff !important;
  transform: translateY(-1px);
  box-shadow: 0 5px 14px rgba(0,0,0,0.16),
    inset 0 1px 0 rgba(255,255,255,0.08);
}

#mainbodyspan.proddetail .detailcustom1 .button:hover, #mainbodyspan.proddetail .detailcustom1 .button:focus, #mainbodyspan.proddetail .detailcustom1 .button:active, #mainbodyspan.proddetail .detailcustom3 .button:hover, #mainbodyspan.proddetail .detailcustom3 .button:focus, #mainbodyspan.proddetail .detailcustom3 .button:active {
  background: var(--conde-primary-dark) !important;
  color: #fff !important;
  text-decoration: none !important;
  border-color: transparent !important;
}


/* =========================================================
   figure choice popups
========================================================= */

/* FIGURE/COLUMN-POP-BEGIN*/
img.column-pop-img-tb {
	height: 75px !important;
	width: 25px;
}
input.column-pop-img-tb {
	height: 75px;
	width: 25px;
}
div.column-pop-title {
	font-size: 18px;
	font-weight: bold;
	text-align: center;
	color: #000080;
}
div.column-pop-cell {
	float: left;
	padding-left: 4px;
	padding-right: 4px;
	font-size: 9px;
	font-weight: bold;
	color: #000000;
	text-align: center;
}
div.columngroup-pop {
	float: left;
	padding-left: 10px;
	padding-right: 10px;
	margin-top: 5px;
}
div.column-pop-row-title {
	font-size: 14px;
	font-weight: bold;
	color: #800000;
	text-align: center;
	padding-top: 3px;
	padding-bottom: 1px;
	width: 100%;
}
span.column-pop-subtitle {
	font-size: 10px;
	font-weight: bold;
	text-align: center;
	color: #FF0000;
}
input.figure-pop-img-tb {
	width: auto !important;
	height: auto !important;
	max-height: 100px !important;
	max-width: 100px !important;
}
img.figure-pop-img-tb {
	width: auto !important;
	height: auto !important;
	max-height: 100px !important;
	max-width: 100px !important;
}
div.helppop-title {
	font-size: 18px;
	font-weight: bold;
	text-align: center;
	color: #000080;
	width: 100%;
}
div.pop-wrapper, #inline-figure {
	display:flex;
	flex-wrap:wrap;
	justify-content: center;
}
div.figure-pop-cell {
	padding: 3px;
	margin: 0px 0px 0px 5px;
	min-width: 64px;
	font-size: 10px;
	font-weight: bold;
	color: #000000;
	text-align: center;
}
span.helppop-subtitle {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: bold;
	text-align: center;
	color: #FF0000;
}
p.figure-pop-footer {
	clear: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-style: italic;
	color: #333333;
	text-align: center;
	width: 100%;
}
/* FIGURE/COLUMN-POP-END*/


/* =========================================================
   10. Product detail descriptions / popups
========================================================= */

.detaildescription .kit-layout-how-to-order {
  max-width: 760px;
  margin: 1.5rem auto 0;
  padding: 1.25rem 1.4rem;
  background: #fff;
  border: 2px solid rgba(102, 11, 28, 0.14);
  border-radius: var(--radius-md);
  box-shadow: 0 2px 8px rgba(0,0,0,0.04),
    0 8px 20px rgba(0,0,0,0.04);
  color: var(--color-ink);
  font-size: 1.02rem;
  line-height: 1.7;
}

.detaildescription .kit-layout-how-to-order span strong {
  display: inline-block;
  margin-bottom: 0.45rem;
  color: var(--color-primary);
  font-size: 1.18rem;
  font-weight: 900;
}

.detaildescription .kit-layout-how-to-order span[style*="255, 0, 0"] {
  display: inline-block;
  margin: 0.2rem 0;
  color: #b30000 !important;
  font-weight: 700;
}

.detaildescription .kit-layout-how-to-order em strong {
  display: inline-block;
  margin-top: 0.55rem;
  color: var(--color-primary);
  font-size: 1.08rem;
  font-weight: 900;
  font-style: italic;
}

@media (max-width: 640px) {

  .detaildescription .kit-layout-how-to-order {
    padding: 1rem;
    font-size: 0.95rem;
    line-height: 1.6;
  }

  .detaildescription .kit-layout-how-to-order span strong {
    font-size: 1.08rem;
  }

  .detaildescription .kit-layout-how-to-order em strong {
    font-size: 1rem;
  }

}

.detaildescription ol.cat-site-hide {
  max-width: 860px;
  margin: 1.25rem auto 1.75rem;
  padding: 1.1rem 1.35rem 1rem 2rem;
  background: #fff;
  border: 2px solid rgba(102, 11, 28, 0.14);
  border-radius: var(--radius-lg);
  box-shadow: 0 2px 8px rgba(0,0,0,0.04),
    0 8px 18px rgba(0,0,0,0.035);
  color: var(--color-ink);
  font-size: 0.98rem;
  line-height: 1.55;
}

.detaildescription ol.cat-site-hide li {
  margin-bottom: 0.7rem;
  padding-bottom: 0.7rem;
  border-bottom: 1px solid rgba(102, 11, 28, 0.08);
}

.detaildescription ol.cat-site-hide li:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0;
}

.detaildescription ol.cat-site-hide img[src*="ectinfo"] {
  width: 15px;
  height: 15px;
  display: inline-block;
  vertical-align: text-top;
  margin: 0 0.2rem;
  position: relative;
  top: -1px;
}

.detaildescription ol.cat-site-hide li img[src*="ectinfo"] + * {
  display: inline;
}

.detaildescription ol.cat-site-hide a {
  color: var(--color-primary);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.detaildescription ol.cat-site-hide a:hover {
  color: var(--conde-primary-dark);
}

.detaildescription ol.cat-site-hide span[style*="255, 0, 0"] {
  color: #b30000 !important;
  font-weight: 800;
}

.detaildescription ol.cat-site-hide a.fancybox {
  display: inline-block;
  margin-top: 0.2rem;
  font-size: 0.93rem;
}

.detaildescription ol.cat-site-hide font {
  color: inherit !important;
}

@media (max-width: 640px) {

  .detaildescription ol.cat-site-hide {
    padding: 1rem
        0.95rem
        0.95rem
        1.7rem;
    font-size: 0.93rem;
    line-height: 1.5;
  }

  .detaildescription ol.cat-site-hide::before {
    font-size: 1.15rem;
    margin-bottom: 0.7rem;
  }

  .detaildescription ol.cat-site-hide li {
    margin-bottom: 0.6rem;
    padding-bottom: 0.6rem;
  }

}
/* =========================================================
   LOW STOCK ALERT
========================================================= */

.detailinstock {
  display: inline-flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin: 0.85rem auto 1.1rem !important;
  padding: 1rem 1.25rem !important;
  max-width: 340px;
  width: 100%;
  background: linear-gradient( 180deg, #f5fff5 0%, #ecfcff 100% );
  border: 1px solid rgba(140, 20, 20, 0.16);
  border-left: 5px solid var(--conde-primary-dark);
  border-radius: var(--radius-md);
  box-shadow: 0 6px 18px rgba(0,0,0,0.05);
  text-align: center !important;
  line-height: 1.35;
}

/* Main alert title */
.detailinstock .lowstock {
  margin: 0 0 0.35rem !important;

  color: #b32020;
  font-size: 1.05rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

/* Supporting text */
.detailinstocklabel {
  color: var(--color-ink);
  font-size: 1rem;
  font-weight: 700;
}

/* Actual stock number */
.detailinstock > span + text,
.detailinstock > span + *,
.detailinstock {
  font-weight: 800;
}

/* Make stock quantity stand out */
.detailinstock {
  color: #b32020;
  font-size: 1.05rem;
}

/* Mobile */
@media (max-width: 640px) {

  .detailinstock {
    max-width: 100%;
    padding: 0.9rem 1rem !important;
  }

  .detailinstocklabel {
    font-size: 0.95rem;
  }

  .detailinstock .lowstock {
    font-size: 1rem;
  }
}
/* =================================
   Product Detail Pricing + Affirm
================================= */

.detailprice {
  margin: 22px 0 26px;
  padding: 18px 20px;
  border: 1px solid rgba(116,16,38,.12);
  border-radius: var(--radius-xl);
  background:
    linear-gradient(
      180deg,
      rgba(116,16,38,.035),
      rgba(255,255,255,0)
    ),
    #fff;
  box-shadow:
    0 6px 18px rgba(0,0,0,.05);
  text-align: center;
}

/* Price label */
.detailprice strong {
  display: block;
  margin-bottom: 6px;
  color: var(--color-ink);
  font-size: 17px;
  font-weight: 700;
  letter-spacing: -.01em;
}

/* Actual price */
.detailprice .price {
  display: inline-block;
  color: var(--color-primary);
  font-size: clamp(40px, 5vw, 52px);
  font-weight: 900;
  line-height: 1;
  letter-spacing: -.03em;
}

/* Hide stray schema link */
.detailprice link[itemprop="url"] {
  display: none;
}

/* Affirm block */
.detailprice .affirm-as-low-as {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid rgba(116,16,38,.10);

  color: #444;
  font-size: 16px !important;
  line-height: 1.45;
  font-weight: 600;

  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 6px;
}

/* Affirm logo */
.detailprice .__affirm-logo {
  transform: scale(1.05);
  transform-origin: center;
}

/* Learn more link */
.detailprice .affirm-modal-trigger {
  color: var(--color-primary) !important;
  font-weight: 800;
  text-decoration: none !important;
  border-bottom: 1px solid currentColor;
  transition: opacity .15s ease;
}

.detailprice .affirm-modal-trigger:hover {
  opacity: .75;
}

/* Mobile */
@media (max-width: 640px) {

  .detailprice {
    padding: 16px 14px;
    margin: 18px 0 22px;
  }

  .detailprice .price {
    font-size: 42px;
  }

  .detailprice .affirm-as-low-as {
    font-size: 15px !important;
    gap: 4px;
  }
}
.detailprice .affirm-as-low-as::before {
  content: "Flexible payments available";
  display: block;
  width: 100%;
  margin-bottom: 2px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--color-primary);
}
/* =========================================================
   09. Product detail layout
========================================================= */

#mainbodyspan.proddetail .detailimage {
  grid-area: image;
  width: 100% !important;
  max-width: 520px !important;
  justify-self: center;
  text-align: center;
}

#mainbodyspan.proddetail .detailimage img, #mainbodyspan.proddetail .detailimage .prodimage, #mainbodyspan.proddetail .detailimage .mainimage {
  width: auto !important;
  max-width: 100% !important;
  object-fit: contain;
}

#mainbodyspan.proddetail .prodmainimage, #mainbodyspan.proddetail .mainimagecontainer, #mainbodyspan.proddetail .detailimage .image-container {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 420px;
}

@media (max-width: 850px) {

  #mainbodyspan.proddetail .prodmainimage, #mainbodyspan.proddetail .mainimagecontainer, #mainbodyspan.proddetail .detailimage .image-container {
    min-height: 320px;
  }

  #mainbodyspan.proddetail > form[id^="ectform"] {
    grid-template-columns: 1fr !important;
    grid-template-areas: "nav"
        "name"
        "stars"
        "productid"
        "image"
        "custom1"
        "custom3"
        "right"
		"customfive"
        "description"
        "reviews";
  }

  #mainbodyspan.proddetail .detail-right-rail > *, #mainbodyspan.proddetail .detailcustom1, #mainbodyspan.proddetail .detailcustom3 {
    width: 100% !important;
    max-width: none !important;
  }

  #mainbodyspan.proddetail .detailimage {
    max-width: 100% !important;
    margin-bottom: 1rem;
  }
div.customfive {
  padding: 1rem !important;
  line-height: 1.15;
  font-size: 18px;
}
}

/* =========================================================
   10. Product detail descriptions / popups
========================================================= */

.tooltip-pos {
  display: block;
  max-width: 640px;
  padding: 0;
  color: var(--color-ink);
  font-family: var(--font-body);
}

.tooltip-pos > div {
  max-width: 640px !important;
  padding: 1.35rem 1.5rem;
  background: #fff;
  border-radius: var(--radius-lg);
}

.helppop-title {
  margin: 0 0 0.75rem;
  color: var(--color-primary);
  font-size: clamp(1.25rem, 2vw, 1.55rem);
  font-weight: 900;
  line-height: 1.15;
  text-align: center;
}

.helppop-subtitle {
  display: block;
  margin-top: 0.75rem;
  color: var(--color-ink);
  font-size: 0.98rem !important;
  font-weight: 500;
  line-height: 1.55;
  text-align: left;
}

.figure-pop-footer {
  margin: 0;
  padding: 1rem;
  background: var(--color-cream-light);
  border: 1px solid rgba(102, 11, 28, 0.14);
  border-radius: var(--radius-md);
  color: var(--color-ink);
  font-size: 0.98rem;
  line-height: 1.45;
  text-align: center;
}

.figure-pop-footer b {
  color: var(--color-primary);
  font-weight: 900;
}

.figure-pop-footer a {
  color: var(--color-primary);
  font-weight: 800;
}

/* =========================================================
   99. Miscellaneous / legacy support
========================================================= */

.fancybox-skin {
  border-radius: var(--radius-lg) !important;
  box-shadow: 0 18px 50px rgba(0,0,0,0.28) !important;
}

.fancybox-inner {
  border-radius: var(--radius-lg) !important;
}

.fancybox-close {
  top: -12px !important;
  right: -12px !important;
}

/* =========================================================
   10. Product detail descriptions / popups
========================================================= */

.tooltip-pos h3 {
  margin: 0 0 1rem;
  color: var(--color-primary);
  font-size: clamp(1.35rem, 2vw, 1.75rem);
  font-weight: 900;
  line-height: 1.15;
  text-align: center;
}

.tooltip-pos p {
  margin: 0;
  color: var(--color-ink);
  font-size: 1rem;
  line-height: 1.65;
  text-align: center;
}

.tooltip-pos #line1 {
  padding: 0.5rem 0.25rem;
}

/* =========================================================
   13. ECT soft forms
========================================================= */

.ectsoftwrapper {
  width: min(92vw, 680px) !important;
  max-height: calc(100vh - clamp(6rem, 13vh, 8.5rem));
  max-height: calc(100dvh - clamp(6rem, 13vh, 8.5rem));
  margin: 0 auto !important;
  overflow: auto;
  padding: 1.25rem !important;
  background: #fff !important;
  border: 1px solid rgba(102, 11, 28, 0.18) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: 0 22px 60px rgba(0,0,0,0.28) !important;
  font-family: var(--font-body) !important;
  color: var(--color-ink) !important;
}

.ectsoftwrapper .softformheader {
  margin: 0 0 0.75rem !important;
  padding: 0 2rem 0.75rem !important;
  border-bottom: 1px solid var(--color-border);
  color: var(--color-primary) !important;
  font-size: clamp(1.45rem, 3vw, 2rem) !important;
  font-weight: 900 !important;
  line-height: 1.1;
  text-align: center !important;
}

.ectsoftwrapper .contactblurb {
  max-width: 560px;
  margin: 0 auto 1.15rem !important;
  color: var(--color-muted) !important;
  font-size: 1rem !important;
  font-weight: 600;
  line-height: 1.45;
  text-align: center !important;
}

.ectsoftwrapper .emfonly[style*="display: none"], .ectsoftwrapper .emfonly[style*="display:none"], .ectsoftwrapper .ectsf2col[style*="display: none"], .ectsoftwrapper .ectsf2col[style*="display:none"] {
  display: none !important;
}

.ectsoftwrapper .ectsf2col {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 0.55rem;
  align-items: start;
  margin: 0 0 0.85rem !important;
}

.ectsoftwrapper .redstar {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding-top: 0.55rem;
  color: var(--color-primary) !important;
  font-size: 0 !important;
  line-height: 1;
}

.ectsoftwrapper .redstar .ectlabel, .ectsoftwrapper .redstar label {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

.ectsoftwrapper .redstar::before {
  content: "*";
  display: inline-block;
  color: var(--color-primary) !important;
  font-size: 1.25rem;
  font-weight: 900;
  line-height: 1;
}

.ectsoftwrapper input[type="text"], .ectsoftwrapper input[type="email"], .ectsoftwrapper input[type="password"], .ectsoftwrapper textarea {
  width: 100% !important;
  max-width: none !important;
  min-height: 44px;
  padding: 0.7rem 0.85rem !important;
  background: #fff !important;
  border: 2px solid rgba(102, 11, 28, 0.18) !important;
  border-radius: var(--radius-sm) !important;
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.04);
  color: var(--color-ink);
  font-family: var(--font-body) !important;
  font-size: 0.98rem !important;
  line-height: 1.35;
}

.ectsoftwrapper textarea, .ectsoftwrapper .softcomments {
  min-height: 145px !important;
  resize: vertical;
}

.ectsoftwrapper .softformsend {
  display: flex !important;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1.25rem !important;
  padding-top: 1rem;
  border-top: 1px solid var(--color-border);
}

/* =========================================================
   03. Buttons
========================================================= */

.ectsoftwrapper .ectbutton {
  min-width: 140px;
  border-radius: 999px !important;
}

/* =========================================================
   13. ECT soft forms
========================================================= */

.ectsoftwrapper .scclose {
  top: 0.8rem !important;
  right: 0.8rem !important;
}

.ectsoftwrapper .ectsfsuccess {
  margin: 0 0 1rem !important;
  padding: 0.85rem 1rem !important;
  background: var(--color-cream-light);
  border: 1px solid rgba(102, 11, 28, 0.14);
  border-radius: var(--radius-md);
  color: var(--color-primary);
  font-weight: 800;
  text-align: center;
}

@media (max-width: 640px) {

  div#softopaquediv.ectopaque {
    padding: 4.25rem 0.65rem 1rem;
  }

  .ectsoftwrapper {
    width: 100% !important;
    max-height: calc(100vh - 5.25rem);
    max-height: calc(100dvh - 5.25rem);
    padding: 1rem !important;
  }

  .ectsoftwrapper .ectsf2col {
    grid-template-columns: 20px minmax(0, 1fr);
    gap: 0.4rem;
  }

  /* =========================================================
     03. Buttons
  ========================================================= */

  .ectsoftwrapper .softformsend .ectbutton {
    width: 100%;
  }

}

/* =========================================================
   10. Product detail descriptions / popups
========================================================= */

.detaildescription.detaildescriptiontabs {
  width: 100%;
  margin: var(--space-sm) 0 0 !important;
  padding: var(--space-sm) !important;
  background: #fff;
  border: 1px solid rgba(102, 11, 28, 0.16);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
}

.detaildescription .longdesc-redtitle {
  margin: 0 0 0.35rem;
  color: var(--color-primary);
  font-size: clamp(1.25rem, 2vw, 1.75rem);
  font-weight: 900;
  line-height: 1.1;
  text-align: center;
}

.detaildescription .longdesc-bluesubtitle {
  margin: 0.15rem 0;
  color: var(--color-ink);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.35;
  text-align: center;
}

.detaildescription .longdesc-left {
  max-width: 850px;
  margin: 1.25rem auto 0;
  color: var(--color-ink);
  font-size: 0.98rem;
  line-height: 1.55;
}

.detaildescription .longdesc-left > strong {
  display: block;
  margin-bottom: 0.5rem;
  color: var(--color-primary);
  font-size: 1rem;
  font-weight: 900;
  letter-spacing: 0.02em;
}

.detaildescription .longdesc-left ul {
  margin: 0.4rem 0 0;
  padding-left: 1.3rem;
}

.detaildescription .longdesc-left li {
  margin: 0.25rem 0;
}

.detaildescription .longdesc-left a {
  color: var(--color-primary);
  font-weight: 800;
}

@media (max-width: 640px) {

  .detaildescription.detaildescriptiontabs {
    padding: 1rem !important;
  }

  .detaildescription .longdesc-redtitle, .detaildescription .longdesc-bluesubtitle {
    text-align: left;
  }

  .detaildescription .longdesc-left {
    margin-top: 1rem;
  }

}

.detaildescription .kit-layout-title {
  margin: 0 0 0.35rem;
  color: var(--color-primary);
  font-size: clamp(1.25rem, 2vw, 1.75rem);
  font-weight: 900;
  line-height: 1.15;
  text-align: center;
}

.detaildescription .kit-layout-subtitle {
  margin: 0.25rem auto 1rem;
  max-width: 850px;
  color: var(--color-ink);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.55;
  text-align: center;
}

.detaildescription .kit-layout-blue {
  color: var(--color-primary);
  font-weight: 900;
}

.detaildescription .kit-layout-comes-with {
  max-width: 760px;
  margin: 1rem auto 0;
  padding: 1rem 1.25rem;
  background: var(--color-cream-light);
  border: 1px solid rgba(102, 11, 28, 0.14);
  border-radius: var(--radius-md);
  color: var(--color-ink);
  font-size: 0.98rem;
  line-height: 1.65;
  text-align: left;
}

.detaildescription .kit-layout-comes-with strong {
  color: var(--color-primary);
  font-weight: 900;
}

.detaildescription .kit-layout-comes-with em strong {
  display: inline-block;
  margin-top: 0.35rem;
}

/* =========================================================
   11. Product reviews
========================================================= */

.reviews {
  width: 100%;
  margin: var(--space-lg) 0 0 !important;
  padding: var(--space-md) !important;
  background: #fff;
  border: 1px solid rgba(102, 11, 28, 0.16);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
}

.reviewtotals {
  margin: 0 0 1rem !important;
  color: var(--color-ink);
  font-size: clamp(1.05rem, 1.6vw, 1.35rem);
  font-weight: 900;
  line-height: 1.2;
  text-align: center;
}

.reviewtotals .rating {
  color: var(--color-primary);
}

.showallreview a {
  color: var(--color-primary);
  font-size: 0.9rem;
  font-weight: 800;
}

.reviewscontainer {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.ecthreview {
  margin: 0 !important;
  padding: 1rem !important;
  background: var(--color-cream-light);
  border: 1px solid rgba(102, 11, 28, 0.14) !important;
  border-radius: var(--radius-md);
  box-shadow: 0 2px 10px rgba(0,0,0,0.04);
}

.reviewstarsheader {
  display: grid;
  gap: 0.35rem;
  margin-bottom: 0.65rem;
}

.largereviewstars svg.icon, .smallreviewstars svg.icon, .reviewstarsheader svg.icon {
  width: 18px !important;
  height: 18px !important;
  fill: var(--color-primary) !important;
}

.reviewheader {
  display: block;
  padding-left: 0 !important;
  color: var(--color-ink);
  font-size: 0.95rem;
  font-weight: 900;
  line-height: 1.2;
}

.reviewname {
  margin: 0 0 0.55rem !important;
  color: var(--color-muted);
  font-size: 0.85rem;
}

.reviewer {
  color: var(--color-primary);
  font-weight: 900;
}

.reviewcomments {
  margin: 0 !important;
  font-size: 0.9rem;
  line-height: 1.45;
}

/* =========================================================
   99. Miscellaneous / legacy support
========================================================= */

.extracommentsdots {
  color: var(--color-primary);
  font-weight: 800;
}

/* =========================================================
   11. Product reviews
========================================================= */

.clickreview {
  margin: 1rem 0 0 !important;
  text-align: center;
}

/* =========================================================
   02. Base / reset
========================================================= */

button.clickreview, .ectbutton.clickreview {
  width: auto;
  max-width: 100%;
}

@media (max-width: 900px) {

  /* =========================================================
     11. Product reviews
  ========================================================= */

  .reviewscontainer {
    grid-template-columns: 1fr;
  }

}

.reviewtotals .showallreview, .reviewtotals .showallreview a {
  display: inline-block;
  margin-left: 0.2rem;
  color: var(--color-primary) !important;
  font-size: 1rem !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  vertical-align: baseline;
}

.reviewtotals .showallreview a:hover {
  color: var(--color-primary-hover) !important;
  text-decoration: underline !important;
}

/* =========================================================
   08. Product detail purchase controls
========================================================= */

.quantity2div.detailquantity2div {
  display: inline-grid !important;
  grid-template-columns: 38px 76px 38px;
  align-items: center;
  justify-content: center;
  width: auto !important;
  min-width: 152px !important;
  max-width: none !important;
  margin: 0.45rem auto 1.15rem !important;
  padding: 0.3rem !important;
  background: #fff;
  border: 2px solid rgba(102, 11, 28, 0.18);
  border-radius: 14px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04),
    inset 0 1px 0 rgba(255,255,255,0.7);
  overflow: visible !important;
}

.quantity2div.detailquantity2div > div {
  display: grid !important;
  place-items: center;
  width: 38px !important;
  min-width: 38px !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--color-primary);
  font-size: 1.45rem;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  user-select: none;
}

.quantity2div.detailquantity2div > div:hover {
  background: rgba(102, 11, 28, 0.08);
  border-radius: 10px;
}

.quantity2input.detailquantity2input {
  display: block !important;
  width: 76px !important;
  min-width: 76px !important;
  max-width: 76px !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 0 0.35rem !important;
  background: var(--color-page) !important;
  border: 1px solid rgba(102, 11, 28, 0.14) !important;
  border-radius: 10px !important;
  color: var(--color-ink) !important;
  font-family: var(--font-body) !important;
  font-size: 1.35rem !important;
  font-weight: 800 !important;
  text-align: center !important;
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.05);
  overflow: hidden !important;
}

.quantity2input.detailquantity2input:focus {
  outline: none;
  border-color: rgba(102, 11, 28, 0.4) !important;
  box-shadow: 0 0 0 3px rgba(102, 11, 28, 0.08),
    inset 0 1px 2px rgba(0,0,0,0.05);
}

@media (max-width: 640px) {

  .quantity2div.detailquantity2div {
    grid-template-columns: 34px 68px 34px;
    min-width: 136px !important;
  }

  .quantity2div.detailquantity2div > div {
    width: 34px !important;
    min-width: 34px !important;
    height: 36px !important;
  }

  .quantity2input.detailquantity2input {
    width: 68px !important;
    min-width: 68px !important;
    max-width: 68px !important;
    height: 36px !important;
    font-size: 1.25rem !important;
  }

}

/* =========================================================
   12. Soft cart popup
========================================================= */

#opaquediv {
  background: rgba(20, 20, 20, 0.62) !important;
  backdrop-filter: blur(2px);
}

#scdiv.scwrap {
  width: min(92vw, 620px) !important;
  max-height: 88vh;
  overflow: auto;
  padding: 1rem !important;
  background: #fff !important;
  border: 1px solid rgba(102, 11, 28, 0.18) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: 0 22px 60px rgba(0,0,0,0.28) !important;
  font-family: var(--font-body) !important;
  color: var(--color-ink) !important;
}

#scdiv .sccheckout {
  margin: 0 0 0.1rem !important;
}

#scdiv .sccheckout input {
  width: auto !important;
}

#scdiv .scclose {
  top: 0.65rem !important;
  right: 0.65rem !important;
}

#scdiv .scprodsadded {
  margin: 0 0 1rem !important;
  padding: 0.65rem 0.85rem !important;
  background: var(--color-cream-light) !important;
  border-radius: var(--radius-md);
  font-size: 1rem !important;
  font-weight: 800 !important;
  color: var(--color-primary) !important;
}

#scdiv .scimgproducts {
  display: grid !important;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 1rem;
  align-items: start;
  margin: 0 0 1rem !important;
}

#scdiv .scimage {
  float: none !important;
  width: 100% !important;
  max-width: 150px !important;
  margin: 0 !important;
}

#scdiv img.scimage {
  max-height: 150px !important;
  object-fit: contain;
}

#scdiv .scproducts, #scdiv .scproduct {
  width: auto !important;
  margin: 0 !important;
}

#scdiv .scprodname {
  margin: 0 0 0.1rem !important;
  font-size: 1.05rem !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
}

#scdiv .scoptions {
  display: none !important;
}

#scdiv .scprice {
  display: inline-flex !important;
  margin: 0 !important;
  padding: 0.4rem 0.75rem !important;
  background: var(--color-cream-light) !important;
  border: 1px solid var(--color-border) !important;
  border-radius: 999px !important;
  color: var(--color-primary) !important;
  font-weight: 900 !important;
}

#scdiv .sccartitems, #scdiv .sccarttotal {
  margin: 0 !important;
  padding: 0.15rem 0 !important;
  text-align: right !important;
  font-weight: 800 !important;
}

#scdiv .sccarttotal {
  color: var(--color-primary) !important;
  font-size: 1.15rem !important;
}

#scdiv .sclinks {
  display: flex !important;
  justify-content: center;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-top: 0rem !important;
  padding-top: 1rem !important;
  border-top: 1px solid var(--color-border);
}

/* =========================================================
   03. Buttons
========================================================= */

#scdiv .sclinks button, #scdiv .ectbutton {
  border-radius: 999px !important;
}

@media (max-width: 560px) {

  /* =========================================================
     12. Soft cart popup
  ========================================================= */

  #scdiv .scimgproducts {
    text-align: center;
  }
  
  #scdiv .scimage, #scdiv img.scimage {
    margin-inline: auto !important;
  }

  #scdiv .sccartitems, #scdiv .sccarttotal {
    text-align: center !important;
  }

  #scdiv .sclinks{
    font-size:0;
  }

  #scdiv .sclinks .ectbutton{
    font-size:16px;
  }



  /* =========================================================
     03. Buttons
  ========================================================= */

  #scdiv .sclinks button {
    width: 100%;
  }

}

/* =========================================================
   11. Product reviews
========================================================= */

.proddetail.detailaddreview {
  max-width: 900px;
  margin: 0 auto;
}

.proddetail.detailaddreview > form {
  margin-top: var(--space-md) !important;
}

.proddetail.detailaddreview .reviewprod {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  margin: 0 0 var(--space-md);
  padding: 1rem;
  background: var(--color-cream-light);
  border: 1px solid rgba(102, 11, 28, 0.16);
  border-radius: var(--radius-lg);
  font-size: 1rem;
  font-weight: 700;
  text-align: center;
}

.proddetail.detailaddreview .reviewprod .reviewprod {
  color: var(--color-primary);
  font-weight: 900;
}

.proddetail.detailaddreview .reviewformblock {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 1rem 1.5rem;
  align-items: start;
  padding: var(--space-md);
  background: #fff;
  border: 1px solid rgba(102, 11, 28, 0.16);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
}

.proddetail.detailaddreview .reviewimage {
  grid-row: 1 / span 5;
  text-align: center;
}

.proddetail.detailaddreview .reviewimagecontainer {
  display: grid;
  place-items: center;
  margin: 0;
  padding: 1rem;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
}

.proddetail.detailaddreview .reviewimagecontainer img {
  max-width: 100%;
  max-height: 240px;
  object-fit: contain;
}

.proddetail.detailaddreview .reviewformline {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  gap: 0.75rem;
  align-items: center;
  padding: 0;
  margin: 0 !important;
}

.proddetail.detailaddreview .reviewlabels {
  width: auto;
  padding: 0;
  color: var(--color-ink);
  font-weight: 800;
  line-height: 1.25;
  white-space: normal;
}

.proddetail.detailaddreview .reviewfields input[type="text"], .proddetail.detailaddreview .reviewfields textarea, .proddetail.detailaddreview .reviewfields select {
  width: 100% !important;
  max-width: none;
  min-height: 42px;
  padding: 0.65rem 0.8rem !important;
  background: #fff;
  border: 2px solid rgba(102, 11, 28, 0.18);
  border-radius: var(--radius-sm);
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.04);
  font-family: var(--font-body);
  font-size: 0.95rem;
}

.proddetail.detailaddreview .reviewfields textarea {
  min-height: 150px;
}

.proddetail.detailaddreview .reviewsubmit {
  min-width: 180px;
}

.proddetail.detailaddreview + div {
  max-width: 900px;
  margin: var(--space-md) auto 0 !important;
  padding: 1rem;
  background: var(--color-cream-light);
  border: 1px solid rgba(102, 11, 28, 0.14);
  border-radius: var(--radius-md);
  font-size: 0.95rem !important;
  line-height: 1.45;
  text-align: center;
}

.proddetail.detailaddreview + div a {
  color: var(--color-primary) !important;
  font-weight: 900;
}
/* =========================================================
   Kit-Search page header...
========================================================= */
.kit-search-hero {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: 28px;
  align-items: center;
  margin: 0 0 32px;
  padding: 28px;
  background: linear-gradient(135deg, #fffaf4, #ffffff);
  border: 1px solid #ead8be;
  border-radius: 22px;
  box-shadow: 0 10px 28px rgba(72, 32, 22, 0.08);
}

.kit-search-figure {
  display: grid;
  place-items: center;
  padding: 18px;
  background: #f3f4ea;
  border-radius: 18px;
}

.kit-search-figure img {
  max-height: 180px;
  width: auto;
  object-fit: contain;
}

.kit-search-copy {
  text-align: left;
}

.kit-search-eyebrow {
  margin: 0 0 8px;
  color: #8a1f1f;
  font-size: .8rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.kit-search-copy h1 {
  margin: 0 0 14px;
  color: #1f1f1f;
  font-size: clamp(2rem, 4vw, 3.5rem);
  line-height: 1.05;
}

.kit-search-copy p {
  max-width: 900px;
  margin: 0 0 10px;
  color: #332b26;
  font-size: 1.08rem;
  line-height: 1.65;
}

.kit-search-copy a {
  color: #8a1f1f;
  font-weight: 800;
}

.kit-search-back-link {
  display: inline-flex;
  margin-top: 8px;
  padding: 10px 16px;
  background: #fff4ec;
  border: 1px solid #ead0ba;
  border-radius: 999px;
  text-decoration: none;
}

@media (max-width: 720px) {
  .kit-search-hero {
    grid-template-columns: 1fr;
    gap: 18px;
    padding: 22px 18px;
    text-align: center;
  }

  .kit-search-copy {
    text-align: center;
  }

  .kit-search-copy p {
    font-size: 1rem;
  }

  .kit-search-figure img {
    max-height: 150px;
  }
}



/* =========================================================
   16. Layout / footer / homepage sections
========================================================= */

.content-area > div[style*="margin-bottom:15px"] {
  max-width: 900px;
  margin-inline: auto !important;
}

.content-area > div[style*="margin-bottom:15px"]:first-of-type {
  padding: 1rem 1rem 0;
}

.content-area > div[style*="margin-bottom:15px"]:first-of-type span {
  color: var(--color-primary) !important;
  font-size: 1.35rem !important;
  font-weight: 900;
}

.content-area > div[style*="font-size:12px"] {
  padding: var(--space-md);
  background: #fff;
  border: 1px solid rgba(102, 11, 28, 0.16);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
  font-size: 0.95rem !important;
  line-height: 1.5;
}

.content-area > div[style*="font-size:12px"] span {
  font-size: 1rem !important;
  font-weight: 800;
  color: var(--color-primary);
}

.content-area > div[style*="font-size:12px"] ul {
  margin: 0.5rem 0 1rem;
}

@media (max-width: 760px) {

  /* =========================================================
     11. Product reviews
  ========================================================= */

  .proddetail.detailaddreview .reviewformblock {
    grid-template-columns: 1fr;
  }

  .proddetail.detailaddreview .reviewimage {
    grid-row: auto;
  }

  .proddetail.detailaddreview .reviewformline {
    grid-template-columns: 1fr;
    gap: 0.35rem;
  }

  .proddetail.detailaddreview .reviewsubmit {
    width: 100%;
  }

}

/* =========================================================
   09. Product detail layout
========================================================= */

#mainbodyspan.proddetail .detailimage > .detailcustom2 {
  width: 100% !important;
  margin: 0.5rem 0 0 !important;
  padding: 0.35rem 0 0 !important;
  text-align: center;
  background: transparent;
  border: 0;
  box-shadow: none;
}

/* =========================================================
   14. Product detail cross-sell
========================================================= */

.detail-crosssell {
  grid-column: 1 / -1;
  width: 100%;
  margin-top: var(--space-lg);
}

.detail-crosssell .product-feed-panel {
  padding: var(--space-lg);
}

.detail-crosssell .cstitle {
  margin: 0 0 1.25rem;
  padding: 0;
  color: var(--color-ink);
  font-size: clamp(1.35rem, 2.2vw, 2rem);
  font-weight: 900;
  line-height: 1.1;
  text-align: left;
  border: 0;
}

.detail-crosssell .csproducts {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 1rem;
  clear: none;
}

.detail-crosssell .csproduct {
  width: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0.85rem;
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
}

.detail-crosssell .csproduct form {
  display: grid;
  gap: 0.25rem;
  height: 100%;
}

.detail-crosssell .csprodimage {
  display: grid !important;
  place-items: center;
  min-height: 150px;
  margin: 0 !important;
  padding: 0.6rem !important;
  background: var(--color-cream-light);
  border-radius: var(--radius-md);
}

.detail-crosssell .csprodimage img, .detail-crosssell img.csprodimage {
  max-width: 100% !important;
  max-height: 140px !important;
  object-fit: contain;
}

.detail-crosssell .csprodname {
  height: 3.25em;
  min-height: 0;
  margin: 0 0 0.25rem;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  font-size: 0.95rem;
  line-height: 1.08;
}

.detail-crosssell .csprodname a {
  display: block;
  color: var(--color-ink);
  font-weight: 500;
  line-height: 1.08;
  text-decoration: none;
  white-space: normal;
  word-break: break-word;
}
.detail-crosssell .csprodprice {text-align: center; font-weight: 800;}
.detail-crosssell .price {color: var(--color-primary); font-weight: 900;}
.csproddescription {text-align: center;}
.detail-crosssell .prodquantpricingwrap {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
.detail-crosssell .prodqpheading, .detail-crosssell .prodqpheadquant, .detail-crosssell .prodqpheadprice, .detail-crosssell .prodqpquant, .detail-crosssell .prodqprow {
  display: none !important;
}
.detail-crosssell .prodqprow:last-child {display: block !important;}
.detail-crosssell .prodqpprice {
  display: inline-flex !important;
  justify-content: center;
  width: 100%;
  padding: 0.35rem 0.55rem;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  background: var(--color-cream-light);
  color: var(--color-primary);
  font-weight: 900;
}
.detail-crosssell .prodqpprice::before {content: "As low as "; margin-right: 0.25rem;}
.detail-crosssell br {display: none;}
.detail-crosssell .csprodinstock {margin-top: 0; text-align: center; font-size: 0.85rem;}
.detail-crosssell .prodinstocklabel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: var(--color-cream-light);
  color: var(--color-primary);
  padding: 0.1rem 0.6rem;
  font-weight: 800;
}

@media (max-width: 760px) {

  .detail-crosssell .product-feed-panel {
    padding: 0.75rem;
  }

  .detail-crosssell .csproducts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
  }

  .detail-crosssell .csproduct {
    padding: 0.65rem;
  }

  .detail-crosssell .csprodimage {
    min-height: 105px;
  }

  .detail-crosssell .csprodimage img, .detail-crosssell img.csprodimage {
    max-height: 100px !important;
  }

  .detail-crosssell .csprodname {
    font-size: 0.88rem;
  }

  .detail-crosssell .prodqpprice {
    font-size: 0.82rem;
    line-height: 1.1;
    text-align: center;
  }

}

/* =========================================================
   06. Product detail options
========================================================= */

#mainbodyspan.proddetail form[id^="ectform"] > .detailoptions, #mainbodyspan.proddetail form[id^="ectform"] > .detailquantpricingwrap, #mainbodyspan.proddetail form[id^="ectform"] > .detailprice, #mainbodyspan.proddetail form[id^="ectform"] > .detailquantity, #mainbodyspan.proddetail form[id^="ectform"] > .detailaddtocart {
  float: none !important;
  clear: none !important;
  justify-self: center !important;
  align-self: start !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

#mainbodyspan.proddetail .detailoptions {
  width: min(100%, 460px) !important;
}

/* =========================================================
   07. Product detail quantity pricing
========================================================= */

#mainbodyspan.proddetail .detailquantpricingwrap {
  width: min(100%, 360px) !important;
}
.detailcustom2 .detailquantpricingwrap {min-width: 300px !important;}
/* =========================================================
   08. Product detail purchase controls
========================================================= */

#mainbodyspan.proddetail .detailprice, #mainbodyspan.proddetail .detailquantity, #mainbodyspan.proddetail .detailaddtocart {
  width: min(100%, 460px) !important;
}

#mainbodyspan.proddetail .detailquantity2div, #mainbodyspan.proddetail .quantity2div {
  float: none !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

#mainbodyspan.proddetail .detailaddtocart {
  display: grid !important;
  gap: 0.7rem !important;
}

/* =========================================================
   03. Buttons
========================================================= */

#mainbodyspan.proddetail .detailaddtocart .ectbutton {
  width: 100% !important;
}

/* =========================================================
   09. Product detail layout
========================================================= */

#mainbodyspan.proddetail .detailid {
  margin: 0 0 0.25rem !important;
  font-size: 1.1rem !important;
  font-weight: 800 !important;
}

/* =========================================================
   08. Product detail purchase controls
========================================================= */

#mainbodyspan.proddetail .detailprice {
  font-size: 1.45rem !important;
  font-weight: 900;
  text-align: center !important;
}

#mainbodyspan.proddetail .detailquantity {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
}

#mainbodyspan.proddetail .detailquantity > div, #mainbodyspan.proddetail .quantity2div, #mainbodyspan.proddetail .detailquantity2div {
  margin: 0 auto !important;
  float: none !important;
}

/* =========================================================
   15. Hero / homepage slider
========================================================= */

.hero {
  color: #fff;
}
.hero__fineprint {
  margin-top: 12px;
  opacity: 0.8;
  font-size: 0.8rem;
}

.hero-slider {
  position: relative;
  overflow: hidden;
  background: #1f1f1f;
}
.hero-slide {
  display: none;
  background-position: right center;
  background-size: cover;
  background-repeat: no-repeat;
  color: #fff;
}

.hero-slide::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
      90deg,
      rgba(18, 18, 18, 0.88) 0%,
      rgba(35, 8, 14, 0.78) 42%,
      rgba(35, 8, 14, 0.35) 100%
    );
  z-index: 0;
}

.hero-slide.is-active {
  display: block;
  position: relative;
}

.hero-slide .hero__inner, .hero__inner {
  display: grid;
  align-items: center;
  position: relative;
  z-index: 1;
  min-height: clamp(240px, 30vw, 400px);
  padding-block: clamp(1.5rem, 3vw, 3rem);
}

.hero__content {
  max-width: 680px;
}

.eyebrow {
  margin: 0 0 0.5rem;
  color: #1b98f2;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.8rem;
}

.hero .eyebrow {
  color: var(--color-cream);
}

.hero h1 {
  margin: 0;
  font-size: clamp(2.25rem, 5vw, 5rem);
  line-height: 0.98;
  letter-spacing: -0.06em;
}

.hero p {
  font-size: clamp(1rem, 1.6vw, 1.25rem);
}

.hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1.5rem;
}

.hero-arrow {
  position: absolute;
  top: 50%;
  z-index: 3;
  transform: translateY(-50%);
  width: 42px;
  height: 42px;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.88);
  color: var(--color-primary);
  cursor: pointer;
}

.hero-prev {
  left: 1rem;
}

.hero-next {
  right: 1rem;
}

.hero-dots {
  position: absolute;
  left: 50%;
  bottom: 1rem;
  z-index: 3;
  display: flex;
  gap: 0.5rem;
  transform: translateX(-50%);
}

.hero-dot {
  width: 10px;
  height: 10px;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.5);
  cursor: pointer;
}

.hero-dot.is-active {
  background: #fff;
}

@media (min-width: 1001px) {

  /* =========================================================
     16. Layout / footer / homepage sections
  ========================================================= */

  .sidebar-left, .sidebar-card-accent {
    align-self: start;
    height: fit-content;
  }

}

.content-area .prodfilterbar, #scri1, #ectpatgrp0 {
  display: none;
}

.sidebar-card h2 {
  text-align: center;
  font-family: "Exo 2", Arial, Helvetica, sans-serif;
  font-size: 19px;
  font-weight: bold;
  color: var(--color-primary);
  text-decoration: none;
}

/* =========================================================
   03. Buttons
========================================================= */

.sidebar-filter select, .sidebar-filter input, .sidebar-filter button {
  max-width: 100%;
}

.sidebar-card .btn {
  margin-top: 0.5rem;
}

/* =========================================================
   16. Layout / footer / homepage sections
========================================================= */

.page-shell {
  display: grid;
  grid-template-columns: minmax(220px, 260px)
    minmax(0, 1fr)
    minmax(220px, 260px);
  gap: var(--space-sm);
  padding-block: var(--space-lg);
}

.layout-no-sidebars .page-shell {
  grid-template-columns: minmax(0, 1fr);
  max-width: 100%;
}

.layout-left-sidebar .page-shell {
  grid-template-columns: minmax(220px, 260px)
    minmax(0, 1fr);
}

.layout-right-sidebar .page-shell {
  grid-template-columns: minmax(0, 1fr)
    minmax(220px, 260px);
}

.layout-two-sidebars .page-shell {
  grid-template-columns: minmax(200px, 240px)
    minmax(0, 1fr)
    minmax(200px, 240px);
}

.content-area, .sidebar-card, .category-card {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
}

.content-area {
  padding: var(--space-sm);
}
.sidebar-card {
  padding: var(--space-md);
}
.sidebar-card h2, .site-footer h2 {
  margin-top: 0;
  font-size: 1rem;
}

.sidebar-card-accent, .sidebar-card-recviewd {
  margin-top: 10px;
}
.sidebar-card-recviewd, .sidebar-card-filter {
  padding: 4px;
}
.sidebar-card-filter {
  font-size: 14px;
}
.sidebar-card-filter .sidebar-filter {
  line-height: 1.1;
}
.section-heading {
  margin-bottom: var(--space-md);
}

.section-heading h2 {
  margin: 0;
  font-size: clamp(1.75rem, 3vw, 2.75rem);
  line-height: 1.05;
}

.card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--space-md);
}

.category-card {
  display: grid;
  gap: 0.75rem;
  padding: 1rem;
  text-align: center;
  text-decoration: none;
  transition: transform 160ms ease,
    border-color 160ms ease;
}

.category-card:hover, .category-card:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(102, 11, 28, 0.35);
}

.category-card strong {
  display: block;
  line-height: 1.3;
}

.category-card__image {
  display: grid;
  place-items: center;
  aspect-ratio: 1 / 1;
  padding: 0.75rem;
  border-radius: var(--radius-md);
  background: var(--color-cream-light);
}

.category-card__image img {
  max-width: 100%;
  max-height: 180px;
  object-fit: contain;
}
/* Right sidebar - Recently Viewed */
.sidebar-card-recviewd .recentviewheader {
  display: flex !important;
  align-items: center;
  gap: 7px;
  margin: 0 0 10px;
}

.sidebar-card-recviewd .recentviewheader img {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
}

.sidebar-card-recviewd .recentviewheader a.recentview {
  color: var(--color-primary) !important;
  font-weight: 900;
  text-decoration: none !important;
}

.sidebar-card-recviewd .recentviewline {
  display: grid !important;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  width: 100% !important;
  padding: 8px 0 !important;
  border-bottom: 1px solid var(--color-border) !important;
}

.sidebar-card-recviewd div.recentviewimage,
.sidebar-card-recviewd div.recentviewname {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
}

.sidebar-card-recviewd img.recentviewimage {
  width: 54px !important;
  height: 54px !important;
  max-width: 54px !important;
  object-fit: contain;
  margin: 0 !important;
}

.sidebar-card-recviewd .recentviewname a {
  display: block;
  color: var(--color-ink) !important;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.25;
  text-decoration: none !important;
}

.sidebar-card-recviewd .recentviewname a:hover {
  color: var(--color-primary) !important;
}
/* Left sidebar - Best Sellers */
.sidebar-card-recpurcs h2 {
  color: var(--color-primary);
  font-size: 15px;
  font-weight: 900;
  text-align: center;
  margin: 0 0 10px;
}

.sidebar-card-recpurcs .bcsproduct {
  display: grid !important;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 8px 0 !important;
  border-bottom: 1px solid var(--color-border);
}

.sidebar-card-recpurcs .bcsproduct form {
  display: contents;
}

.sidebar-card-recpurcs .bcsprodimage,
.sidebar-card-recpurcs .bcsprodname {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
}

.sidebar-card-recpurcs img.bcsprodimage {
  width: 54px !important;
  height: 54px !important;
  max-width: 54px !important;
  object-fit: contain;
}

.sidebar-card-recpurcs .bcsprodname a {
  display: block;
  color: var(--color-ink) !important;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.25;
  text-decoration: none !important;
}

.sidebar-card-recpurcs .bcsprodname a:hover {
  color: var(--color-primary) !important;
}
/* =========================================================
   19. Product listing pages
========================================================= */

div.proddateaddedlabel::after, div.detaildateaddedlabel::after, span.prodidlabel::after, span.prodinstocklabel::after, span.detailmanufacturerlabel::after, span.prodmanufacturerlabel::after {
  content: " ";
}

/* =========================================================
   17. Product feed / cross-sell cards
========================================================= */

.home-product-feed {
  margin-top: var(--space-xl);
}

.product-feed-panel {
  overflow: hidden;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
  padding: var(--space-lg);
}

.product-feed-panel > div, .product-feed-panel .crosssellproducts, .product-feed-panel .csproducts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 1rem;
}

.product-feed-panel .csproduct {
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 0.85rem;
  box-shadow: var(--shadow-soft);
}

.product-feed-panel .csproduct form {
  display: grid;
  gap: 0.25rem;
  height: 100%;
}

.product-feed-panel .csprodimage {
  display: grid;
  place-items: center;
  min-height: 140px;
  margin: 0;
}

.product-feed-panel .csprodimage img {
  max-width: 100%;
  max-height: 130px;
  object-fit: contain;
}

.product-feed-panel .csprodname {
  height: 3.25em;
  line-height: 1.08;
  margin-bottom: 0.25rem;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.product-feed-panel .csprodname a {
  display: block;
  white-space: normal;
  word-break: break-word;
  font-weight: 500;
  line-height: 1.08;
  text-decoration: none;
}

.product-feed-panel .csprodprice, .product-feed-panel .csprodinstock, .product-feed-panel .csprodinstockmanual, .product-feed-panel .closeout {
  text-align: center;
  float: none;
}

.product-feed-panel .csprodprice {
  font-weight: 700;
}

.product-feed-panel .price {
  color: var(--color-primary);
  font-weight: 900;
}

.product-feed-panel .prodquantpricingwrap, div.prodquantpricingwrap {
  width: 100%;
  padding-top: 0.15rem;
  padding-bottom: 0;
  margin: 1px auto;
  border: 0;
}

.product-feed-panel .prodqpheading, .product-feed-panel .prodqpheadquant, .product-feed-panel .prodqpheadprice, .product-feed-panel .prodqpquant, .product-feed-panel .prodqprow, div.prodqpheading, div.prodqpheadquant, div.prodqpheadprice, div.prodqpquant, div.prodqprow {
  display: none !important;
}

.product-feed-panel .prodqprow:last-child, div.prodqprow:last-child {
  display: block !important;
}

.product-feed-panel .prodqpprice {
  display: inline-flex !important;
  justify-content: center;
  width: 100%;
  min-height: 0;
  padding: 0.35rem 0.55rem;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  font-weight: 900;
  color: var(--color-primary);
  background: var(--color-cream-light);
}

.product-feed-panel .prodqpprice::before, div.prodqpprice::before {
  content: "As low as ";
  white-space: nowrap;
  margin-right: 0.25rem;
}

.product-feed-panel .csprodinstock {
  margin-top: 0;
  font-size: 0.85rem;
}

.product-feed-panel .prodinstocklabel {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  background: var(--color-cream-light);
  color: var(--color-primary);
  padding: 0.1rem 0.6rem;
  font-weight: 800;
}

/* =========================================================
   16. Layout / footer / homepage sections
========================================================= */

.content-area h1 {
  margin: 0 0 0.75rem;
  color: var(--color-ink);
  font-size: clamp(2rem, 4vw, 3.5rem);
  line-height: 1.05;
  letter-spacing: -0.04em;
}

.content-area h1 + p, .content-area .category-intro {
  max-width: 850px;
  margin-bottom: 1.25rem;
  font-size: 1.05rem;
  line-height: 1.6;
  color: var(--color-cream-light);
}

.content-area .catnavandcheckout {
  margin: 0.75rem 0 1.25rem;
  padding: 0;
}

.content-area .catnavigation {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem 0.65rem;
  padding: 0.75rem 1rem;
  border-radius: var(--radius-md);
  background: var(--color-cream-light);
  font-size: 0.92rem;
  line-height: 1.3;
}

.content-area .ectbreadcrumb {
  display: inline-flex;
  margin: 0;
  padding: 0;
}

.content-area .catnavcheckout {
  display: none !important;
}

.content-area .ectbreadcrumb a, .content-area .breadcrumbs a {
  color: var(--color-primary);
  font-weight: 700;
  text-decoration: none;
}

.content-area .category {
  align-content: start !important;
  height: auto !important;
  min-height: 0 !important;
  padding-bottom: 0.6rem !important;
}

.content-area .catname {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

.content-area .catname a {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
  line-height: 1.2 !important;
}

.content-area div.catimage a {
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  height: 100% !important;
}

.content-area div.catimage img, .content-area img.catimage {
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 160px !important;
  object-fit: contain !important;
}

.content-area div.catname br {
  display: none !important;
}

.content-area div.categories {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)) !important;
  gap: 1rem !important;
  align-items: stretch !important;
}

.content-area div.category {
  gap: 0.65rem !important;
  align-self: start !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0.85rem !important;
  text-align: center !important;
  background: var(--color-surface) !important;
  border: 1px solid var(--color-border) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--shadow-soft) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  height: 100% !important;
  min-height: 220px !important;
  padding-bottom: 0.15rem !important;
}

.content-area div.catname {
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.15 !important;
  margin-top: auto !important;
}

.content-area div.catname a {
  display: block !important;
  color: var(--color-ink) !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  line-height: 1.1 !important;
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

.content-area div.catimage {
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 1 / 1 !important;
  margin: 0 0 0.45rem !important;
  padding: 0.6rem !important;
  border-radius: var(--radius-md) !important;
  background: var(--color-cream-light) !important;
  margin-bottom: 0.3rem !important;
}

/* =========================================================
   18. Category pages
========================================================= */

.page-subtitle-maroon {
  text-align: center;
  font-family: "Exo 2", Arial, Helvetica, sans-serif;
  font-size: 19px;
  font-weight: normal;
  color: #790a0a;
  text-decoration: none;
}

.cat-view-products {
  text-align: left;
  font-size: 17px;
  font-weight: normal;
  color: #333;
  text-decoration: none;
  margin-bottom: 5px;
}

.category-product-sample {
  grid-column: 1 / -1;
  width: 100%;
  margin-top: var(--space-xl);
}

.category-product-sample__intro {
  max-width: 900px;
  margin: 0 auto var(--space-md);
  text-align: center;
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--color-primary);
}

.category-product-sample__intro p {
  margin: 0.25rem 0;
}

.category-product-sample__intro a {
  color: var(--color-primary);
  font-weight: 900;
}

.category-product-sample__products {
  width: 100%;
}

.category-product-sample__products .products {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)) !important;
  gap: 1rem !important;
  align-items: stretch !important;
}

.category-product-sample__products .product {
  width: auto !important;
  margin: 0 !important;
}

/* =========================================================
   19. Product listing pages
========================================================= */

/* ================================
   ECT Pagination
================================ */

div.pagenumbers {
  float: none !important;
  width: 100%;
  margin: 24px auto;
  padding: 8px 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 8px;
  text-align: center;
  font-weight: 800;
}

/* Hide ECT separators */
div.pagenumbers span.pagebarsep {
  display: none !important;
}

div.pagenumbers a.ectlink,
div.pagenumbers span.currpage {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 38px;
  min-height: 38px;
  padding: 6px 11px;
  border: 1px solid var(--color-primary);
  border-radius: 8px;
  background: #fff;
  color: var(--color-primary);
  font-size: 16px;
  line-height: 1;
  text-decoration: none !important;
  box-shadow: 0 3px 8px rgba(0,0,0,.08);
  box-sizing: border-box;
}

div.pagenumbers a.ectlink:hover {
  background: var(--color-cream-light);
  border-color: var(--color-primary);
  color: var(--color-primary);
  transform: translateY(-1px);
}

div.pagenumbers span.currpage {
  background: var(--color-primary);
  color: #fff;
  cursor: default;
}

/* Hide raw quote glyphs */
div.pagenumbers .pagebarquo {
  display: none !important;
}

/* Turn « into First */
div.pagenumbers a.ectlink:has(span.pagebarlquo)::after {
  content: "First";
}

/* Turn » into Last */
div.pagenumbers a.ectlink:has(span.pagebarrquo)::before {
  content: "Last";
}

/* Previous / Next buttons */
div.pagenumbers .pagebarprevnext {
  min-width: auto;
}

/* Mobile */
@media (max-width: 560px) {
  div.pagenumbers {
    gap: 6px;
    margin: 18px auto;
  }

  div.pagenumbers a.ectlink,
  div.pagenumbers span.currpage {
    min-width: 34px;
    min-height: 34px;
    padding: 5px 9px;
    font-size: 14px;
    border-radius: 7px;
  }
}
/* Hide disabled First/Previous/Next/Last spans */
div.pagenumbers > span.pagebarquo,
div.pagenumbers > span.pagebarprevnext {
  display: none !important;
}

/* Keep linked Previous/Next visible */
div.pagenumbers a.ectlink span.pagebarprevnext {
  display: inline !important;
}
@media (max-width: 380px) {
  div.pagenumbers {
    gap: 5px;
  }

  div.pagenumbers a.ectlink,
  div.pagenumbers span.currpage {
    min-width: 32px;
    min-height: 32px;
    padding: 5px 8px;
    font-size: 13px;
  }
}


div.ectpatset {
  color: red;
  font-weight: bold;
}

.prods .page-title {
  margin: 0 0 0.75rem;
  color: var(--color-ink);
  font-size: clamp(2rem, 4vw, 3.5rem);
  font-weight: bold;
  line-height: 1.05;
  letter-spacing: -0.04em;
}

span.prodpricelabel::after {
  content: " ";
}

.prods .products {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)) !important;
  gap: 1rem !important;
  align-items: stretch !important;
}

.prods .product {
  display: grid !important;
  grid-template-rows: auto auto 3.35em auto auto auto auto;
  gap: 0.35rem;
  align-content: start;
}

.prods .proddetaillink {
  display: block !important;
  width: 100% !important;
  margin: 0.15rem 0 0 !important;
}

.prods .proddetaillink .ectbutton,
.prods button.detaillink,
.prods input.detaillink {
  display: flex !important;
  width: 100% !important;
  min-width: 0 !important;
}
.prods .prodid {
  margin-bottom: 0.15rem;
  text-align: center;
  color: black;
  font-size: 0.98rem;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.prods .prodidlabel {
  display: none;
}

.prods .prodimage {
  display: grid !important;
  place-items: center;
  min-height: 150px;
  margin: 0 !important;
  padding: 0.6rem !important;
  border-radius: var(--radius-md);
  background: var(--color-cream-light);
}

.prods .prodimage img, .prods img.prodimage {
  max-width: 100% !important;
  max-height: 140px !important;
  object-fit: contain !important;
}

.prods .prodname {
  height: 3.35em;
  margin: 0 !important;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 0.95rem !important;
  line-height: 1.12 !important;
}

.prods .prodname a {
  font-weight: 500;
  line-height: 1.12;
  text-decoration: none;
}
.prods button.detaillink,
.prods input.detaillink,
.prods input[type="button"].detaillink,
.sidefiltermore,
.prods .ectbutton {
  width: 100%;
  min-height: 38px;
  padding: 0.55rem 0.75rem !important;
  background: var(--color-primary) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 999px !important;
  font-family: var(--font-body) !important;
  font-size: 0.9rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.02em;
  line-height: 1.1 !important;
}
/* Product name: match products page behavior */
.prods .prodname {
    height: 3.35em;
    overflow: hidden;
    line-height: 1.12;
}

.prods .prodname a {
    color: var(--color-ink) !important;
    text-decoration: none !important;
}

.prods .prodname a:hover {
    color: var(--color-primary) !important;
}

/* Cleaner 2-line truncation where supported */
.prods .prodname a {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Stock pill should not stretch full width */
.prods .prodinstock {
    display: inline-flex !important;
    justify-self: center;
    width: auto !important;
    max-width: 100%;
    padding: 0.1rem 0.65rem !important;
    border-radius: 999px;
    background: var(--color-cream-light) !important;
    color: var(--color-primary) !important;
    font-weight: 900;
    line-height: 1.1;
}

.prods .prodinstocklabel {
    background: transparent !important;
    color: inherit !important;
}
/* =========================================================
   17. Product feed / cross-sell cards
========================================================= */

.prods .prodprice, .prods .prodinstock, .prods .csprodinstock {
  text-align: center;
}

/* =========================================================
   19. Product listing pages
========================================================= */

.prods .proddetaillink {
  margin: 0.15rem 0 0 !important;
  text-align: center;
}

/* =========================================================
   03. Buttons
========================================================= */

.prods input.detaillink, .prods input[type="button"].detaillink, .sidefiltermore, .prods .ectbutton {
  width: 100%;
  min-height: 38px;
  padding: 0.55rem 0.75rem !important;
  background: var(--color-primary) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 999px !important;
  font-family: var(--font-body) !important;
  font-size: 0.9rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.02em;
  line-height: 1.1 !important;
}

/* =========================================================
   19. Product listing pages
========================================================= */

.prods input.detaillink:hover, .prods input.detaillink:focus-visible {
  background: var(--color-primary-hover) !important;
}

.prods .prodinstocklabel, .prods .closeout {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  background: var(--color-cream-light);
  color: var(--color-primary);
  padding: 0.1rem 0.6rem;
  font-weight: 800;
}

.prods .closeout {
  display: flex;
  justify-content: center;
  width: 100%;
  margin: 0 !important;
  text-align: center;
}

.prods .prodprice {
  margin: -0.1rem 0 0 !important;
  line-height: 1 !important;
}

.prods .prodprice {
  color: var(--color-primary);
  font-weight: 900;
  font-size: 1.0rem;
  line-height: 1.3 !important;
}

.prods .prodquantpricingwrap {
  width: 100% !important;
  padding: 0 !important;
  border: 0 !important;
  margin: -0.15rem 0 0 !important;
}

.prods .prodqpprice {
  display: inline-flex !important;
  justify-content: center;
  width: 100%;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  background: var(--color-cream-light);
  color: var(--color-primary);
  font-weight: 900;
  padding: 0.22rem 0.5rem !important;
  min-height: 0 !important;
  line-height: 1.05 !important;
}
.proddescription {text-align: center;}
/* =========================================================
   17. Product feed / cross-sell cards
========================================================= */

.prods .prodinstock, .prods .csprodinstock, .prods .closeout {
  font-size: 0.85rem;
  margin-top: -0.1rem !important;
  line-height: 1 !important;
}

/* =========================================================
   19. Product listing pages
========================================================= */

.prods .prodinstocklabel {
  padding: 0.08rem 0.55rem !important;
  line-height: 1 !important;
}

.prods .product {
  width: auto !important;
  margin: 0 !important;
  padding: 0.85rem !important;
  background: var(--color-surface);
  border-radius: var(--radius-lg);
  border: 1px solid rgba(102, 11, 28, 0.14) !important;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04),
    0 4px 12px rgba(0,0,0,0.03) !important;
  transition: transform 160ms ease,
    box-shadow 160ms ease,
    border-color 160ms ease;
}

.prods .product:hover {
  transform: translateY(-2px);
  border-color: rgba(102, 11, 28, 0.28) !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.06),
    0 10px 24px rgba(0,0,0,0.05) !important;
}

/* =========================================================
   16. Layout / footer / homepage sections
========================================================= */

.site-footer {
  background: var(--conde-primary-dark);
  color: #fff;
  padding-block: var(--space-xl) var(--space-md);
}

.site-footer a {
  color: #fff;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.4fr repeat(3, 1fr);
  gap: var(--space-lg);
}

.footer-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.footer-bottom p {
  margin: 0;
}

.footer-social {
  margin-left: auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 14px;
}

.footer-social a {
  color: #fff;
  font-size: 20px;
  text-decoration: none;
}

@media only screen and (max-width: 767px) {

  .footer-bottom {
    flex-direction: column;
    justify-content: center;
    text-align: center;
  }

  .footer-social {
    margin-left: 0;
    justify-content: center;
  }

}

@media (max-width: 1000px) {

  /* =========================================================
     04. Header / mini cart
  ========================================================= */

  .header-main {
    grid-template-columns: auto 1fr auto;
  }

  .site-search {
    grid-column: 1 / -1;
    order: 3;
  }

  /* =========================================================
     16. Layout / footer / homepage sections
  ========================================================= */

  .page-shell, .layout-left-sidebar .page-shell, .layout-right-sidebar .page-shell, .layout-two-sidebars .page-shell {
    grid-template-columns: 1fr;
  }

  .content-area {
    order: 1;
  }

  .sidebar-left {
    order: 2;
  }

  .sidebar-right {
    order: 3;
  }

  .sidebar {
    display: block;
  }

  .footer-grid {
    grid-template-columns: repeat(2, 1fr);
  }

}

@media (max-width: 760px) {

  /* =========================================================
     04. Header / mini cart
  ========================================================= */

  .site-header {
    position: relative;
    top: auto;
  }

  .mobile-brand {
    display: block;
    font-size: 0.92rem;
    font-weight: 700;
    line-height: 1.1;
    margin-bottom: 0.8rem;
    letter-spacing: 0.03em;
  }

  .mobile-brand a {
    color: #fff;
    text-decoration: none;
  }

  .mobile-brand a:hover, .mobile-brand a:focus-visible {
    text-decoration: underline;
  }

  .top-strip__inner {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    align-items: center;
    text-align: center;
    gap: 0.5rem;
  }

  .top-strip__inner p {
    margin: 0;
    text-align: center;
  }

  .header-main {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 0.45rem;
    padding-block: 0.45rem;
    align-items: center;
  }

  .header-actions {
    grid-column: 1 / -1;
    grid-row: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    z-index: 2;
    pointer-events: none;
  }

  .header-actions .account-link,
  .header-actions .ectdp_minicartmainwrapper_ct,
  .header-actions .ectdp_minicartopen,
  .header-actions .ectdp_minicartopen a {
    pointer-events: auto;
  }

  .header-actions .ectdp_minicartmainwrapper_ct,
  .header-actions .ectdp_minicartmainwrapper {
    flex: 0 0 auto;
    width: auto !important;
  }

  .header-actions .ectdp_minicartmainwrapper_ct {
    margin-left: auto;
  }

  .header-actions .ectdp_minicartopen {
    width: auto !important;
    float: none !important;
    clear: none !important;
  }

  .brand {
    grid-column: 2 / 3;
    grid-row: 1;
    justify-self: center;
    position: relative;
    left: -24px;
    line-height: 0;
    margin: 0;
    padding: 0;
    z-index: 3;
  }

  .brand img {
    width: clamp(100px, 25vw, 125px);
  }

  .site-search {
    grid-column: 1 / -1;
    grid-row: 2;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 0.5rem;
    margin: 0;
  }

  .site-search input {
    min-height: 38px;
    padding: 0.5rem 0.9rem;
    font-size: 0.95rem;
  }

  /* =========================================================
     03. Buttons
  ========================================================= */

  .site-search .btn {
    min-height: 38px;
    padding-inline: 0.9rem;
    font-size: 0.95rem;
  }

  /* =========================================================
     15. Hero / homepage slider
  ========================================================= */

  .hero-arrow {
    display: none;
  }

  .hero-slide .hero__inner {
    min-height: 280px;
  }

  .hero__actions {
    flex-direction: column;
  }

  /* =========================================================
     16. Layout / footer / homepage sections
  ========================================================= */

  .card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
  }

  .category-card {
    padding: 0.75rem;
  }

  .category-card strong {
    font-size: 0.92rem;
    line-height: 1.25;
  }

  .category-card__image {
    aspect-ratio: 1 / 1;
    padding: 0.5rem;
  }

  .footer-grid {
    grid-template-columns: 1fr;
  }

  /* =========================================================
     17. Product feed / cross-sell cards
  ========================================================= */

  .product-feed-panel > div, .product-feed-panel .crosssellproducts, .product-feed-panel .csproducts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
  }

  .product-feed-panel {
    padding: 0.75rem;
  }

  .product-feed-panel .csproduct {
    padding: 0.65rem;
  }

  .product-feed-panel .csprodimage {
    min-height: 105px;
  }

  .product-feed-panel .csprodimage img {
    max-height: 100px;
  }

  .product-feed-panel .csprodname {
    height: 3.1em;
    font-size: 0.9rem;
  }

  .product-feed-panel .csprodprice, .product-feed-panel .prodqpprice, .product-feed-panel .csprodinstock {
    font-size: 0.85rem;
  }

  .product-feed-panel .prodqpprice {
    display: flex !important;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    width: 100%;
    min-height: 42px;
    padding: 0.3rem 0.45rem;
    font-size: 0.82rem;
    line-height: 1.1;
    text-align: center;
  }

  /* =========================================================
     16. Layout / footer / homepage sections
  ========================================================= */

  .content-area div.categories {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.75rem !important;
  }

  .content-area .prodfilterbar {
    display: block;
    margin: 1rem 0 1.25rem;
    padding: 0.85rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-cream-light);
  }

  .content-area .prodfiltergrp,  .content-area  .prodfilterbar {
    display: none;
    margin: 0 0 0.85rem;
  }

  .content-area .prodfiltergrp:last-child {
    margin-bottom: 0;
  }

  .content-area .filtertext {
    display: block;
    margin: 0 0 0.4rem;
    padding: 0;
    font-weight: 800;
  }

  .content-area select.prodfilter {
    display: block;
    width: 100%;
    margin: 0 0 0.5rem;
    padding: 0.55rem;
  }

  /* =========================================================
     19. Product listing pages
  ========================================================= */

  .prods .products {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.75rem !important;
  }

  .prods .product {
    padding: 0.65rem !important;
  }

  .prods .prodimage {
    min-height: 105px;
    padding: 0.45rem !important;
  }

  .prods .prodimage img, .prods img.prodimage {
    max-height: 100px !important;
  }

  .prods .prodname {
    font-size: 0.88rem !important;
  }

  .prods input.detaillink {
    font-size: 0.8rem !important;
    min-height: 34px;
  }

  .prods .closeout {
    font-size: 13px;
  }

  .prods .prodqpprice {
    font-weight: 600;
    font-size: 13px;
  }

}

@media (max-width: 480px) {

  /* =========================================================
     02. Base / reset
  ========================================================= */

  .container {
    width: min(100% - 1.25rem, var(--container));
  }

  /* =========================================================
     16. Layout / footer / homepage sections
  ========================================================= */

  .content-area, .sidebar-card {
    border-radius: var(--radius-md);
  }

}

/* =========================================================
   20. Mega menu
========================================================= */

#mgmenu1 {
  z-index: 0;
}

.mgmenu_container {
  height: 50px;
  border: 0;
  border-top: 4px solid var(--color-primary);
  border-radius: 0;
  box-shadow: none;
  background: var(--color-cream);
}

.mgmenu {
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: 1;
}

.mgmenu > li {
  padding-right: 0;
}

.mgmenu > li:hover, .mgmenu > li.active {
  background: transparent;
}

.mgmenu > li > a, .mgmenu > li > span {
  display: flex;
  align-items: center;
  padding: 0.8rem 0.5rem;
  color: var(--color-ink);
  font-size: 0.95rem;
  font-weight: 800;
  text-shadow: none;
}

.mgmenu > li > a:hover, .mgmenu > li > span:hover,.mgmenu li:hover,.mgmenu li a:hover,.mgmenu li:hover span,.mgmenu li li:hover a {
  color: var(--color-primary);
  background-color: var(--color-border);
}

.mgmenu > li > a i, .mgmenu > li > span i {
  color: var(--color-primary);
  text-shadow: none;
  
}

.mgmenu li .dropdown_container, .mgmenu li .dropdown_fullwidth {
  background: var(--color-cream);
  border: 1px solid rgba(102, 11, 28, 0.18);
  border-top: 0;
  border-bottom: 3px solid var(--color-primary);
  border-left: 3px solid var(--color-primary);
  border-right: 3px solid var(--color-primary);
  border-radius: 0 0 var(--radius-lg) var(--radius-lg);
  box-shadow: var(--shadow-soft);
  padding: 1.25rem 0;
  margin-top: 0;
}
.mgmenu li .dropdown_4columns li{margin-left: 15px; margin-top: 15px;}
.mgmenu > li ul {
  list-style: none;
  padding-left: 0;
  margin-bottom: 0;
}

.mgmenu > li ul li {
  color: var(--color-ink);
  font-size: 1.15rem;
  line-height: 1.4;
  text-shadow: none;
  width: auto;
}

.mgmenu .dropdown_container a, .mgmenu .dropdown_fullwidth a {
  color: var(--color-ink);
  font-weight: 500;
  text-shadow: none;
}

.mgmenu .dropdown_container a:hover, .mgmenu .dropdown_fullwidth a:hover {
  color: var(--color-primary);
}

.mgmenu h4 {
  color: var(--color-primary);
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 900;
  text-shadow: none;
}

.mgmenu > li.right_item {
  float: right;
  padding-right: 0;
}

.mgmenu > li.right_item > ul {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.mgmenu > li.right_item ul > li {
  float: none;
  list-style: none;
}

.mgmenu > li.right_item ul > li > a {
  display: grid;
  place-items: center;
  width: 36px;
  height: 41px;
  padding: 0;
  color: var(--color-primary);
  background: none;
  text-decoration: none;
}
@media only screen and (min-width: 600px) {
.main-menu-li li {margin-bottom: 7px;}
}
.mgmenu > li.right_item ul > li > a i {
  color: var(--color-primary);
  font-size: 1rem;
}

.mgmenu > li.right_item ul > li:hover {
  background: transparent;
}
@media only screen and (max-width: 1033px) {
.mgmenu > li.right_item {
  display: none!important;
}}
@media only screen and (max-width: 767px) {

  .mgmenu_container {
    border-radius: 0;
  }

  .mgmenu_container > .mgmenu > li.mgmenu_button {
    border: 0;
    border-radius: 0;
    box-shadow: none;
    background-color: var(--color-primary);
    color: #fff;
    text-shadow: none;
  }

  .mgmenu > li > a, .mgmenu > li > span {
    padding: 0.9rem 1rem;
  }

  .mgmenu > li .dropdown_container, .mgmenu > li .dropdown_fullwidth {
    position: relative;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  .mgmenu > li.right_item > ul {
    justify-content: center;
    padding: 0.5rem 0;
  }

  #mgmenu1.mgmenu_container {
    height: auto;
    background: var(--color-primary) !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  #mgmenu1 .mgmenu {
    background: var(--color-primary) !important;
  }

  #mgmenu1.mgmenu_container > .mgmenu > li.mgmenu_button {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    background: var(--color-primary) !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: #fff !important;
    text-shadow: none !important;
    font-weight: 800;
    font-size: 1rem;
    line-height: 1;
    padding: 13px 18px !important;
  }

  #mgmenu1 .mgmenu > li.mgmenu_button::after {
    content: "";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: 1.25rem;
  }

  #mgmenu1 .mgmenu > li > a, #mgmenu1 .mgmenu > li > span {
    background: var(--color-cream-light) !important;
    color: var(--color-ink) !important;
    text-shadow: none !important;
    border-bottom: 1px solid rgba(102, 11, 28, 0.14);
  }

  #mgmenu1 .mgmenu > li > a i, #mgmenu1 .mgmenu > li > span i {
    color: var(--color-primary) !important;
  }

  #mgmenu1 .mgmenu > li .dropdown_container, #mgmenu1 .mgmenu > li .dropdown_fullwidth, #mgmenu1 .mgmenu > li .dropdown_9columns {
    position: relative !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0.85rem 0 !important;
    background: var(--color-cream-light) !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  #mgmenu1 .mgmenu .col_1, #mgmenu1 .mgmenu .col_2, #mgmenu1 .mgmenu .col_3, #mgmenu1 .mgmenu .col_4, #mgmenu1 .mgmenu .col_5, #mgmenu1 .mgmenu .col_6, #mgmenu1 .mgmenu .col_7, #mgmenu1 .mgmenu .col_8, #mgmenu1 .mgmenu .col_9, #mgmenu1 .mgmenu .col_10, #mgmenu1 .mgmenu .col_11, #mgmenu1 .mgmenu .col_12 {
    width: 92% !important;
    margin-left: 4% !important;
    margin-right: 4% !important;
    padding: 0 !important;
  }

  #mgmenu1 .mgmenu > li.right_item {
    display: none !important;
  }

  #mgmenu1 .dropdown_container ul li a {
    display: block;
    padding: 10px 14px;
    line-height: 1.4;
    font-size: 18px;
  }

  #mgmenu1 .dropdown_container ul {
    margin: 0;
    padding: 8px 0;
  }

  #mgmenu1 .dropdown_container li {
    margin: 0;
    border-bottom: 1px solid rgba(0,0,0,0.08);
  }

}
.mega-new-products-card {
  max-width: 250px;
  padding: 18px;
  text-align: center;
  background: #fffaf4;
  border: 1px solid #ead8be;
  border-radius: 16px;
  box-shadow: 0 8px 22px rgba(72, 32, 22, 0.12);
}

.mega-card-kicker {
  margin: 0 0 8px;
  color: #8a1f1f;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.mega-new-products-link {
  display: inline-block;
  margin: 4px 0 10px;
}

.mega-new-products-link img {
  display: block;
  width: 130px;
  height: auto;
  margin: 0 auto;
}

.mega-new-products-card p {
  margin: 0 0 12px;
  color: #332b26;
  font-size: .92rem;
  line-height: 1.35;
}

.mega-card-button {
  display: inline-flex;
  justify-content: center;
  padding: 8px 12px;
  background: #8a1f1f;
  color: #fff !important;
  border-radius: 999px;
  font-size: .82rem;
  font-weight: 800;
  text-decoration: none;
}
/* =========================================================
   14. Product detail cross-sell
========================================================= */

.detail-crosssell .product-feed-panel div.csprodname {
  height: 3.25em !important;
  min-height: 0 !important;
  margin: 0 0 0.25rem !important;
  padding: 0 !important;
  background: transparent !important;
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  font-size: 0.95rem !important;
  line-height: 1.08 !important;
  text-align: left !important;
}

.detail-crosssell .product-feed-panel div.csprodname a, .detail-crosssell .product-feed-panel div.csprodname a:link, .detail-crosssell .product-feed-panel div.csprodname a:visited {
  display: block !important;
  color: var(--color-ink) !important;
  background: transparent !important;
  font-weight: 500 !important;
  line-height: 1.08 !important;
  text-decoration: none !important;
  white-space: normal !important;
  word-break: break-word;
}

.detail-crosssell .product-feed-panel div.csprodname a:hover {
  color: var(--color-primary) !important;
}

@media (max-width: 768px) {

  /* =========================================================
     05. Product detail top action strip
  ========================================================= */

  .catnavandcheckout, .detailnavouter + .catnavandcheckout {
    margin-top: -0.5rem !important;
    margin-bottom: 0.35rem !important;
  }

  /* =========================================================
     18. Category pages
  ========================================================= */

  .detailbreadcrumbs, .breadcrumblinks, .catnavandcheckout {
    padding-bottom: 0.25rem !important;
    margin-bottom: 0.35rem !important;
  }

  /* =========================================================
     06. Product detail options
  ========================================================= */

  .detailimage, .detailname, .detailreviewstarslarge, .detailoptions {
    margin-bottom: 0.75rem !important;
  }

  /* =========================================================
     18. Category pages
  ========================================================= */

  .catnavandcheckout {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  /* =========================================================
     09. Product detail layout
  ========================================================= */

  .detailimage {
    margin-top: -1.25rem !important;
    padding-top: 0 !important;
  }

  .detailimage, .detailimage * {
    clear: none !important;
  }

  .detailimages, .detailmainimage, .detailimagewrap {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }


div.catnavdetail {
	display: none !important;
}
}
@media (max-width: 480px) {
  .page-shell, .proddetail #ectform0 {
    margin-top: -25px;
  }
}
div.cartdetailsid::after{
content:"Product ID";
}
span.tooltip-pos {
	font-size: 14px;
		color:black;
}
.sq-payment-form {
  overflow: visible;
  width: 380px;
}
.sq-card-wrapper .sq-card-iframe-container {
  border: 2px solid var(--color-primary) !important;
}
button.sq-button {
  padding: 8px 5px 8px 5px!important;
  font-size: 18px!important;
}
.ui-widget-content {color: #731111;}
.ui-widget {font-size: 1.1em;}
.ui-menu-icons .ui-menu-item-wrapper {padding-left: 1em;}


a.smarty-tag {margin-left: 20px !important;}
.smarty-popup-header {color: #510102 !important;}
#smarty-popup-secondary-number-form-submit-button  {background: #510102 !important;}
#smarty-popup-secondary-number-form-submit-button:hover  {background: #FF0000 !important;}
.smarty-choice-alt .smarty-choice-abort, .smarty-choice-override {background: #510102 !important;}
.smarty-choice-alt .smarty-choice-abort:hover, .smarty-choice-override:hover {background: #FF0000 !important; color: #FFF !important;}
/* div.cart2details div.cartlistname, div.coshipflagscontainer > div:nth-of-type(2), div.cart2details div.cdformtwillpickup, div.cart2details div.cdformwillpickup, div.checkoutstepof3,*/
div.cart1details  div.cartlistcart, div.cart2details div.coshipflagscontainer,div.cartlistlogin {
  display: none;
}
 .cartpagewidth  {
  max-width: 1200px !important;
}
div.checkoutsteps {
  text-align: center;
  display: block;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
}
img.checkoutbar   {
  display: initial;
}
button.cartaddtolist {
  min-height: .75rem;
  padding: 0.15rem .15rem;
  margin-left:3px;
}
div.cartdelete, div.cartaddtolist {
	float: left;
}
/* =========================================================
   CHECKOUT TERMS / CONDITIONS NOTICE
========================================================= */

.checkout-info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;

  gap: 0.8rem;

  margin: 1.25rem 0 1.5rem !important;
  padding: 0.8rem 1.15rem !important;

  background: var(--color-cream-light);
  border: 1px solid rgba(102, 11, 28, 0.14);
  border-left: 6px solid var(--color-primary);
  border-radius: var(--radius-md);

  box-shadow: 0 4px 14px rgba(0,0,0,0.04);
}

/* Main text */
.checkout-info .deltiming {
  margin: 0 !important;

  color: var(--color-ink);
  font-size: 1rem;
  line-height: 0.75;
}

/* "Important:" */
.checkout-info .deltiming b,
.checkout-info .deltiming strong {
  color: var(--color-primary);
  font-weight: 900;
  font-size: 1.02rem;
}

/* Terms button */
.checkout-info .ship-help-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-height: 40px;
  padding: 0.7rem 1.2rem;

  background: var(--color-primary);
  border-radius: 999px;

  color: #fff !important;
  font-size: 0.92rem;
  font-weight: 800;
  text-decoration: none !important;

  transition:
    background 0.2s ease,
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

/* Hover */
.checkout-info .ship-help-button:hover {
  background: var(--conde-primary-dark);
  color: #fff !important;

  transform: translateY(-1px);

  box-shadow: 0 8px 20px rgba(102, 11, 28, 0.18);
}

/* Mobile */
@media (max-width: 640px) {

  .checkout-info {
    padding: 1rem !important;
    align-items: stretch;
  }

  .checkout-info .deltiming {
    text-align: center;
    font-size: 0.95rem;
  }

  .checkout-info .ship-help-button {
    width: 100%;
  }
}
div.cart2details div.cartlistname, div.cartlistcart {
    display: none;
  }
  /* =================================
   Terms and Conditions
================================= */

.terms-content {
  font-size: 16px;
  line-height: 1.6;
}

.terms-kicker {
  margin: 0 0 18px;
  color: var(--color-primary);
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.terms-list {
  display: grid;
  gap: 16px;
}

.terms-item {
  padding: 18px 20px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: #fff;
}

.terms-item--important {
  border-color: rgba(116,16,38,.22);
  background:
    linear-gradient(180deg, rgba(116,16,38,.035), rgba(255,255,255,0) 65%),
    #fff;
}

.terms-item h2 {
  margin: 0 0 8px;
  color: var(--color-primary);
  font-size: 20px;
  line-height: 1.2;
}

.terms-item p {
  margin: 0 0 10px;
  color: #333;
}

.terms-item p:last-child {
  margin-bottom: 0;
}

.terms-item strong {
  color: var(--color-ink);
  font-weight: 900;
}

.terms-item a {
  color: var(--color-primary);
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* When loaded inside Fancybox / popup */
.fancybox-inner .terms-content,
.fancybox-content .terms-content {
  padding: 8px;
}

.fancybox-inner .terms-list,
.fancybox-content .terms-list {
  gap: 12px;
}

.fancybox-inner .terms-item,
.fancybox-content .terms-item {
  padding: 14px 16px;
}

/* Mobile */
@media (max-width: 640px) {
  .terms-item {
    padding: 16px 14px;
  }

  .terms-item h2 {
    font-size: 18px;
  }
}
/* =================================
   Privacy Policy
================================= */

.privacy-content {
  font-size: 16px;
  line-height: 1.6;
}

.privacy-kicker {
  margin: 0 0 18px;
  color: var(--color-primary);
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.privacy-summary,
.privacy-item {
  padding: 18px 20px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: #fff;
}

.privacy-summary {
  margin-bottom: 18px;
  background:
    linear-gradient(180deg, rgba(116,16,38,.035), rgba(255,255,255,0) 65%),
    #fff;
}

.privacy-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 18px;
}

.privacy-nav a {
  padding: 8px 12px;
  border-radius: 999px;
  background: var(--color-cream-light);
  color: var(--color-primary);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none !important;
}

.privacy-list {
  display: grid;
  gap: 16px;
}

.privacy-item--important {
  border-color: rgba(116,16,38,.22);
  background:
    linear-gradient(180deg, rgba(116,16,38,.035), rgba(255,255,255,0) 65%),
    #fff;
}

.privacy-content h2 {
  margin: 0 0 8px;
  color: var(--color-primary);
  font-size: 20px;
  line-height: 1.2;
}

.privacy-content h3 {
  margin: 16px 0 6px;
  color: var(--color-ink);
  font-size: 16px;
}

.privacy-content p {
  margin: 0 0 10px;
  color: #333;
}

.privacy-content p:last-child {
  margin-bottom: 0;
}

.privacy-content address {
  margin-top: 10px;
  color: #333;
  font-style: normal;
  font-weight: 700;
  line-height: 1.6;
}

.privacy-content a {
  color: var(--color-primary);
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.privacy-top {
  display: inline-block;
  margin-top: 8px;
  font-size: 13px;
}

/* Popup-friendly */
.fancybox-overlay {
  z-index: 40000 !important;
}

.fancybox-wrap {
  z-index: 40001 !important;
}


.fancybox-inner .privacy-content,
.fancybox-content .privacy-content {
  padding: 8px;
}

.fancybox-inner .privacy-nav,
.fancybox-content .privacy-nav {
  display: none;
}

.fancybox-inner .privacy-list,
.fancybox-content .privacy-list {
  gap: 12px;
}

.fancybox-inner .privacy-item,
.fancybox-content .privacy-item,
.fancybox-inner .privacy-summary,
.fancybox-content .privacy-summary {
  padding: 14px 16px;
}

@media (max-width: 640px) {
  .privacy-summary,
  .privacy-item {
    padding: 16px 14px;
  }

  .privacy-nav a {
    width: 100%;
  }
}
/* Offset privacy/terms anchor jumps below sticky header */
.privacy-content [id],
.terms-content [id],
#top {
  scroll-margin-top: 70px;
}
@media (max-width: 760px) {
  .privacy-content [id],
  .terms-content [id],
  #top {
    scroll-margin-top: 140px;
  }
}
/* =================================
   Help Guide / How-To Popup Pages
================================= */

.help-guide {
  font-size: 16px;
  line-height: 1.6;
}

.help-guide__hero {
  margin-bottom: 22px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--color-border);
}

.help-guide__hero h2 {
  margin: 0 0 10px;
  color: var(--color-ink);
  font-size: clamp(30px, 4vw, 46px);
  line-height: 1.05;
  letter-spacing: -.035em;
}

.help-guide__hero p {
  max-width: 760px;
  margin: 0;
  color: #444;
  font-size: 17px;
}

.help-guide__alert {
  margin-bottom: 20px;
  padding: 18px 20px;
  border: 1px solid rgba(116,16,38,.22);
  border-radius: var(--radius-md);
  background: #fff6f4;
}

.help-guide__alert h3 {
  margin: 0 0 6px;
  color: var(--color-primary);
  font-size: 20px;
}

.help-guide__alert p {
  margin: 0;
  color: #4a111a;
  font-weight: 800;
}

.help-guide__steps {
  display: grid;
  gap: 16px;
  margin-bottom: 22px;
}

.help-step {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 16px;
  padding: 18px 20px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: #fff;
}

.help-step__number {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--color-primary);
  color: #fff;
  font-size: 20px;
  font-weight: 900;
}

.help-step h3,
.help-example-card h3 {
  margin: 0 0 8px;
  color: var(--color-primary);
  font-size: 21px;
  line-height: 1.2;
}

.help-step p,
.help-example-card p {
  margin: 0 0 10px;
  color: #333;
}

.help-step p:last-child,
.help-example-card p:last-child {
  margin-bottom: 0;
}

.help-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  margin-top: 4px;
  padding: 0 18px;
  border-radius: 999px;
  background: var(--color-primary);
  color: #fff !important;
  font-weight: 900;
  text-decoration: none !important;
  box-shadow: 0 6px 16px rgba(116,16,38,.22);
}

.help-example-card {
  margin-top: 18px;
  padding: 20px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-cream-light);
  text-align: center;
}

.help-example-card img {
  display: block;
  width: 100%;
  height: auto;
  margin: 16px auto 0;
  border-radius: var(--radius-sm);
  box-shadow: 0 4px 16px rgba(0,0,0,.08);
}

.help-example-card .upload-example {
  max-width: 500px;
}

.help-example-card .notepad-example {
  max-width: 700px;
}

/* Popup-friendly version */
.fancybox-inner .help-guide,
.fancybox-content .help-guide {
  padding: 8px;
}

.fancybox-inner .help-guide__hero h2,
.fancybox-content .help-guide__hero h2 {
  font-size: 30px;
}

.fancybox-inner .help-step,
.fancybox-content .help-step,
.fancybox-inner .help-example-card,
.fancybox-content .help-example-card {
  padding: 14px 16px;
}

@media (max-width: 640px) {
  .help-step {
    grid-template-columns: 1fr;
  }

  .help-step__number {
    width: 40px;
    height: 40px;
  }

  .help-button {
    width: 100%;
  }
}
/* =================================
   Nameplate Comparison Chart
================================= */

.comparison-page {
  font-size: 15px;
  line-height: 1.45;
}

.comparison-hero {
  margin-bottom: 22px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--color-border);
}

.comparison-hero h2 {
  margin: 0 0 10px;
  font-size: clamp(30px, 4vw, 48px);
  line-height: 1.05;
  letter-spacing: -.035em;
}

.comparison-hero p {
  max-width: 820px;
  margin: 0;
  color: #444;
  font-size: 17px;
}

.comparison-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 16px;
}

.comparison-actions a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 16px;
  border-radius: 999px;
  background: var(--color-primary);
  color: #fff !important;
  font-weight: 900;
  text-decoration: none !important;
  box-shadow: 0 6px 16px rgba(116,16,38,.22);
}

.comparison-scroll {
  width: 100%;
  overflow-x: auto;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: #fff;
  box-shadow: 0 6px 20px rgba(0,0,0,.05);
}

.comparison-table {
  width: max-content;
  min-width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}

.comparison-table th,
.comparison-table td {
  width: 210px;
  min-width: 210px;
  padding: 12px 14px;
  border-right: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
  vertical-align: top;
}

.comparison-table thead th {
  position: sticky;
  top: 0;
  z-index: 3;
  background: var(--color-primary);
  color: #fff;
  text-align: center;
}

.comparison-table thead th a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  background: #ffc928;
  color: var(--color-primary) !important;
  font-weight: 900;
  text-decoration: none !important;
}

.comparison-table tbody th {
  position: sticky;
  left: 0;
  z-index: 2;
  width: 180px;
  min-width: 180px;
  background: var(--color-cream-light);
  color: var(--color-primary);
  font-weight: 900;
}

.comparison-table thead th:first-child {
  position: sticky;
  left: 0;
  z-index: 4;
}

.comparison-table tbody tr:nth-child(even) td {
  background: #f8f8f6;
}

.comparison-table tbody tr:nth-child(odd) td {
  background: #fff;
}

.comparison-table a {
  color: var(--color-primary);
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.comparison-note {
  margin: 10px 0 0;
  color: #555;
  font-size: 13px;
  font-weight: 800;
  text-align: center;
}

/* Popup-friendly */
.fancybox-inner .comparison-page,
.fancybox-content .comparison-page {
  padding: 8px;
}

.fancybox-inner .comparison-hero h2,
.fancybox-content .comparison-hero h2 {
  font-size: 30px;
}

@media (max-width: 640px) {
  .comparison-actions a {
    width: 100%;
  }

  .comparison-table th,
  .comparison-table td {
    width: 190px;
    min-width: 190px;
    padding: 10px 12px;
  }

  .comparison-table tbody th,
  .comparison-table thead th:first-child {
    width: 145px;
    min-width: 145px;
  }
  /* Visible hint for mobile users */
.comparison-scroll::after {
  content: "Swipe left to compare more options →";
  position: sticky;
  left: 0;
  display: block;
  padding: 10px 12px;
  background: var(--color-cream-light);
  color: var(--color-primary);
  font-size: 13px;
  font-weight: 900;
  text-align: center;
  border-top: 1px solid var(--color-border);
}
}
.comparison-table th,
.comparison-table td {
  width: 150px;
  min-width: 150px;
  padding: 9px 10px;
  font-size: 13px;
  line-height: 1.35;
}

.comparison-table tbody th {
  width: 135px;
  min-width: 135px;
}

.comparison-table thead th:first-child {
  width: 135px;
  min-width: 135px;
}

.comparison-table thead th a {
  min-height: 28px;
  padding: 0 9px;
  font-size: 12px;
}
@media (min-width: 1100px) {
  .comparison-table th,
  .comparison-table td {
    width: 138px;
    min-width: 138px;
    padding: 8px 9px;
    font-size: 12px;
  }

  .comparison-table tbody th,
  .comparison-table thead th:first-child {
    width: 125px;
    min-width: 125px;
  }
}
/* Bottom repeat header row for comparison chart */
.comparison-table tfoot th {
  background: var(--color-primary);
  color: #fff;
  text-align: center;
  border-right: 1px solid var(--color-border);
  border-top: 1px solid var(--color-border);
}

.comparison-table tfoot th:first-child {
  position: sticky;
  left: 0;
  z-index: 3;
}

.comparison-table tfoot th a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 0 9px;
  border-radius: 999px;
  background: #ffc928;
  color: var(--color-primary) !important;
  font-size: 12px;
  font-weight: 900;
  text-decoration: none !important;
}
/* Mobile optimization for feature column */
@media (max-width: 768px) {

  .comparison-table th:first-child,
  .comparison-table td:first-child {
    width: 72px;
    min-width: 72px;
    max-width: 72px;
    padding: 10px 6px;
    font-size: 12px;
    line-height: 1.2;
  }

  .comparison-table td,
  .comparison-table th {
    padding: 10px 8px;
    font-size: 12px;
  }

  .comparison-table th a,
  .comparison-table tfoot th a {
    font-size: 11px;
    padding: 0 6px;
    min-height: 24px;
  }
}
/* Nameplate ordering help additions */

.help-guide__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 16px;
}

.help-button--secondary {
  background: #fff !important;
  color: var(--color-primary) !important;
  border: 1px solid rgba(116,16,38,.25);
}

.help-link-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0 0;
  padding: 0;
  list-style: none;
}

.help-link-list a {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  background: var(--color-cream-light);
  color: var(--color-primary);
  font-weight: 900;
  text-decoration: none !important;
}

.comparison-embed-card {
  margin-top: 24px;
  padding: 20px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: #fff;
  box-shadow: 0 6px 20px rgba(0,0,0,.05);
}

.comparison-embed-card h3 {
  margin: 0 0 8px;
  color: var(--color-primary);
  font-size: 24px;
}

.comparison-embed-card p {
  margin: 0 0 16px;
  color: #444;
}

.nameplate-comparison-iframe {
  display: block;
  width: 100%;
  min-height: 1600px;
  border: 0;
  border-radius: var(--radius-md);
  background: #fff;
}

.nameplate-order-guide .nameplate-upload-example {
  max-width: 700px;
}

.nameplate-order-guide .help-example-card:first-of-type .nameplate-upload-example {
  max-width: 500px;
}

@media (max-width: 640px) {
  .help-guide__actions .help-button,
  .help-link-list a {
    width: 100%;
    justify-content: center;
  }

  .comparison-embed-card {
    padding: 16px 12px;
  }

  .nameplate-comparison-iframe {
    min-height: 1750px;
  }
}
/* Global ECT button hover override */
.ectdp_minicartcontainer button.ectbutton:hover,
.ectdp_minicartcontainer input.ectbutton:hover,
.ectdp_minicartcontainer .ectbutton:hover,
.ectdp_minicartcontainer .dpminicartcheckout:hover,
.ectdp_minicartcontainer .dpminicartclose:hover {
  background: #073854 !important;
  background-color: #073854 !important;
  background-image: none !important;
  color: #fff !important;
  border-color: #073854 !important;
}
/* =========================================================
   CONDE BLOG ARTICLE SYSTEM
========================================================= */

.blog-article {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  color: var(--color-ink);
}

.blog-article *,
.blog-article *::before,
.blog-article *::after {
  box-sizing: border-box;
}

.blog-article img {
  display: block;
  max-width: 100%;
  height: auto;
}

.blog-article a {
  color: var(--color-primary);
}

.blog-article p {
  margin: 0 0 1rem;
  line-height: 1.72;
}

.blog-article .eyebrow {
  margin: 0 0 .55rem;
  color: var(--color-primary-soft);
  font-size: .8rem;
  font-weight: 800;
  letter-spacing: .1em;
  line-height: 1.3;
  text-transform: uppercase;
}

/* Hero */

.blog-hero {
  margin-bottom: 1.5rem;
  padding: clamp(2rem, 5vw, 4rem);
  border-radius: 24px;
  background:
    radial-gradient(
      circle at 90% 15%,
      rgba(255,255,255,.13),
      transparent 27%
    ),
    linear-gradient(
      135deg,
      var(--color-primary),
      var(--conde-primary-dark)
    );
  color: #fff;
  box-shadow: 0 16px 38px rgba(0,0,0,.14);
}

.blog-hero .eyebrow {
  color: var(--color-cream-light);
}

.blog-hero h1 {
  max-width: 900px;
  margin: 0 0 1rem;
  color: #fff;
  font-size: clamp(2rem, 4.6vw, 4rem);
  line-height: 1.05;
  text-wrap: balance;
}

.blog-hero__intro {
  max-width: 800px;
  margin-bottom: 0 !important;
  color: rgba(255,255,255,.94);
  font-size: clamp(1rem, 2vw, 1.2rem);
}

/* Video */

.blog-video-card {
  display: grid;
  grid-template-columns: minmax(240px, .75fr) minmax(360px, 1.25fr);
  gap: 1.5rem;
  align-items: center;
  margin-bottom: 1.5rem;
  padding: 1.5rem;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: 20px;
  box-shadow: 0 9px 26px rgba(0,0,0,.07);
}

.blog-video-card__copy {
  padding: .5rem;
}

.blog-video-card h2 {
  margin: 0 0 .75rem;
  color: var(--color-primary);
  font-size: clamp(1.45rem, 3vw, 2rem);
}

.blog-video-card__link {
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: 16px;
}

.blog-video-card__link img {
  width: 100%;
  transition: transform .25s ease;
}

.blog-video-card__link:hover img {
  transform: scale(1.025);
}

.blog-video-card__play {
  position: absolute;
  top: 50%;
  left: 50%;
  display: grid;
  width: 64px;
  height: 64px;
  place-items: center;
  border: 4px solid rgba(255,255,255,.9);
  border-radius: 50%;
  background: var(--color-primary);
  color: #fff;
  box-shadow: 0 8px 25px rgba(0,0,0,.25);
  transform: translate(-50%, -50%);
}

/* Intro */

.blog-intro-card {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr);
  gap: 2rem;
  align-items: center;
  margin-bottom: 1.5rem;
  padding: clamp(1.4rem, 3vw, 2rem);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: 20px;
  box-shadow: 0 9px 26px rgba(0,0,0,.07);
}

.blog-intro-card h2 {
  margin: 0 0 1rem;
  color: var(--color-primary);
  font-size: clamp(1.6rem, 3.2vw, 2.3rem);
  line-height: 1.15;
}

.blog-intro-card__image {
  margin: 0;
  overflow: hidden;
  border-radius: 16px;
  background: var(--color-cream-light);
}

.blog-intro-card__image img {
  width: 100%;
}

/* Article contents navigation */

.blog-jump-nav {
  margin-bottom: 1.5rem;
  padding: 1.25rem 1.4rem;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-radius: 18px;
}

.blog-jump-nav__title {
  margin-bottom: .75rem !important;
  color: var(--color-primary);
  font-weight: 900;
}

.blog-jump-nav__links {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
}

.blog-jump-nav__links a {
  display: inline-flex;
  padding: .45rem .75rem;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  background: var(--color-surface);
  color: var(--color-primary);
  font-size: .86rem;
  font-weight: 800;
  text-decoration: none;
}

.blog-jump-nav__links a:hover {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: #fff;
}

/* Main article sections */

.blog-section-list {
  display: grid;
  gap: 1.5rem;
}

.blog-section {
  display: grid;
  grid-template-columns: minmax(280px, .78fr) minmax(0, 1.22fr);
  gap: clamp(1.4rem, 3vw, 2.5rem);
  align-items: start;
  padding: clamp(1.4rem, 3vw, 2rem);
  scroll-margin-top: 100px;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: 20px;
  box-shadow: 0 9px 26px rgba(0,0,0,.065);
}

.blog-section--reverse .blog-section__media {
  grid-column: 2;
}

.blog-section--reverse .blog-section__content {
  grid-column: 1;
  grid-row: 1;
}

.blog-section__media {
  position: sticky;
  top: 90px;
  overflow: hidden;
  border-radius: 16px;
  background: var(--color-cream-light);
}

.blog-section__media a {
  display: block;
}

.blog-section__media img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: contain;
  padding: .5rem;
}

.blog-section__number {
  margin-bottom: .35rem !important;
  color: var(--color-primary-soft);
  font-size: .82rem;
  font-weight: 900;
  letter-spacing: .12em;
}

.blog-section h2 {
  margin: 0 0 1rem;
  color: var(--color-primary);
  font-size: clamp(1.5rem, 3vw, 2.2rem);
  line-height: 1.16;
  text-wrap: balance;
}

.blog-section h3 {
  margin: 1.35rem 0 .75rem;
  color: var(--conde-primary-dark);
  font-size: 1.15rem;
}

.blog-section__content > :last-child {
  margin-bottom: 0;
}

.blog-section__content a {
  font-weight: 800;
}

/* Lists */

.blog-link-list,
.blog-check-list {
  margin: 1rem 0 1.25rem;
  padding: 0;
  list-style: none;
}

.blog-link-list li,
.blog-check-list li {
  position: relative;
  margin: 0 0 .65rem;
  padding: .7rem .85rem .7rem 2.2rem;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-radius: 12px;
  line-height: 1.5;
}

.blog-link-list li::before,
.blog-check-list li::before {
  position: absolute;
  top: .72rem;
  left: .8rem;
  color: var(--color-primary);
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
}

.blog-link-list li::before {
  content: "\f061";
}

.blog-check-list li::before {
  content: "\f00c";
}

/* Callout */

.blog-callout {
  margin: 1.25rem 0;
  padding: 1rem 1.1rem;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-left: 5px solid var(--color-primary);
  border-radius: 12px;
  line-height: 1.6;
}

/* Cost tiles */

.blog-cost-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .6rem;
  margin: 1.2rem 0;
}

.blog-cost-grid span {
  display: flex;
  align-items: center;
  min-height: 48px;
  padding: .65rem .8rem;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-radius: 11px;
  color: var(--color-ink);
  font-size: .9rem;
  font-weight: 700;
}

/* Buttons */

.blog-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: .7rem 1.15rem;
  border: 2px solid var(--color-primary);
  border-radius: 999px;
  background: var(--color-primary);
  color: #fff !important;
  font-weight: 800;
  text-align: center;
  text-decoration: none;
  transition:
    background .18s ease,
    border-color .18s ease,
    transform .18s ease;
}

.blog-button:hover {
  background: var(--color-primary-hover);
  border-color: var(--color-primary-hover);
  transform: translateY(-1px);
}

.blog-button--secondary {
  background: transparent;
  color: var(--color-primary) !important;
}

.blog-button--secondary:hover {
  color: #fff !important;
}

/* Bottom summary */

.blog-summary-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2rem;
  align-items: center;
  margin-top: 1.5rem;
  padding: clamp(1.5rem, 4vw, 2.5rem);
  background: linear-gradient(
    135deg,
    var(--color-cream-light),
    var(--color-surface)
  );
  border: 1px solid var(--color-border);
  border-radius: 20px;
  box-shadow: 0 9px 26px rgba(0,0,0,.065);
}

.blog-summary-card h2 {
  margin: 0 0 .75rem;
  color: var(--color-primary);
  font-size: clamp(1.6rem, 3vw, 2.2rem);
}

.blog-summary-card__actions {
  display: flex;
  flex-direction: column;
  gap: .7rem;
  min-width: 235px;
}

/* Responsive */

@media (max-width: 900px) {
  .blog-video-card,
  .blog-intro-card,
  .blog-section,
  .blog-summary-card {
    grid-template-columns: 1fr;
  }

  .blog-section--reverse .blog-section__media,
  .blog-section--reverse .blog-section__content {
    grid-column: auto;
    grid-row: auto;
  }

  .blog-section__media {
    position: static;
    max-width: 560px;
    margin: 0 auto;
  }

  .blog-summary-card__actions {
    flex-direction: row;
    flex-wrap: wrap;
    min-width: 0;
  }
}

@media (max-width: 600px) {
  .blog-hero {
    padding: 2rem 1.25rem;
    border-radius: 18px;
  }

  .blog-video-card,
  .blog-intro-card,
  .blog-section,
  .blog-summary-card {
    padding: 1.15rem;
    border-radius: 16px;
  }

  .blog-video-card {
    gap: 1rem;
  }

  .blog-video-card__copy {
    padding: 0;
  }

  .blog-video-card__play {
    width: 54px;
    height: 54px;
  }

  .blog-cost-grid {
    grid-template-columns: 1fr;
  }

  .blog-summary-card__actions {
    display: grid;
  }

  .blog-button {
    width: 100%;
  }
}
/* =========================================================
   BLOG FEATURE IMAGE
========================================================= */

.blog-feature-image {
  margin-bottom: 1.5rem;
  overflow: hidden;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: 20px;
  box-shadow: 0 9px 26px rgba(0,0,0,.07);
}

.blog-feature-image img {
  width: 100%;
  max-height: 560px;
  object-fit: cover;
}

/* Text-only introductory card */

.blog-intro-card--text-only {
  display: block;
}

.blog-intro-card--text-only .blog-intro-card__copy {
  max-width: 920px;
}

/* =========================================================
   ICON-BASED BLOG SECTIONS
========================================================= */

.blog-section--icon {
  grid-template-columns: 90px minmax(0, 1fr);
}

.blog-section__icon {
  position: sticky;
  top: 90px;
  display: grid;
  width: 76px;
  height: 76px;
  place-items: center;
  border: 1px solid var(--color-border);
  border-radius: 20px;
  background: var(--color-cream-light);
  color: var(--color-primary);
  font-size: 1.8rem;
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
}

.blog-section--summary {
  border-top: 5px solid var(--color-primary);
  background:
    linear-gradient(
      135deg,
      var(--color-cream-light),
      var(--color-surface)
    );
}

@media (max-width: 700px) {
  .blog-section--icon {
    grid-template-columns: 1fr;
  }

  .blog-section__icon {
    position: static;
    width: 60px;
    height: 60px;
    border-radius: 16px;
    font-size: 1.4rem;
  }

  .blog-feature-image img {
    max-height: none;
  }
}
/* =========================================================
   BLOG TOOL LISTS
========================================================= */

.blog-tool-list {
  display: grid;
  gap: .85rem;
  margin-top: 1.25rem;
}

.blog-tool-item {
  position: relative;
  padding: 1rem 1rem 1rem 1.15rem;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-left: 5px solid var(--color-primary-soft);
  border-radius: 14px;
}

.blog-tool-item h3 {
  margin: 0 0 .45rem;
  color: var(--color-primary);
  font-size: 1.05rem;
}

.blog-tool-item p {
  margin-bottom: .55rem;
}

.blog-tool-item p:last-child {
  margin-bottom: 0;
}

@media (min-width: 1000px) {
  .blog-tool-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
/* =========================================================
   BLOG SOFTWARE COMPARISON
========================================================= */

.blog-section--wide {
  display: block;
}

.blog-comparison-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 1.25rem;
}

.blog-comparison-card {
  padding: 1.25rem;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-top: 5px solid var(--color-primary);
  border-radius: 16px;
}

.blog-comparison-card h3 {
  margin: 0 0 .8rem;
  color: var(--color-primary);
  font-size: 1.25rem;
}

.blog-comparison-card ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.blog-comparison-card li {
  position: relative;
  margin: 0 0 .65rem;
  padding-left: 1.4rem;
  line-height: 1.5;
}

.blog-comparison-card li:last-child {
  margin-bottom: 0;
}

.blog-comparison-card li::before {
  content: "\f00c";
  position: absolute;
  top: .1rem;
  left: 0;
  color: var(--color-primary);
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
}

/* Decision cards */

.blog-decision-list {
  display: grid;
  gap: .85rem;
  margin: 1.25rem 0;
}

.blog-decision-item {
  padding: 1rem 1.1rem;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-left: 5px solid var(--color-primary-soft);
  border-radius: 13px;
}

.blog-decision-item h3 {
  margin: 0 0 .4rem;
  color: var(--color-primary);
  font-size: 1.05rem;
}

.blog-decision-item p {
  margin-bottom: 0;
}

@media (max-width: 900px) {
  .blog-comparison-grid {
    grid-template-columns: 1fr;
  }
}
/* =========================================================
   PRINTER COMPARISON ARTICLE
========================================================= */

.blog-feature-image--contain {
  padding: 1rem;
  background: var(--color-surface);
}

.blog-feature-image--contain img {
  max-height: none;
  object-fit: contain;
}

/* Price cards */

.printer-price-grid,
.printer-comparison-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin: 1.25rem 0;
}

.printer-price-card,
.printer-comparison-card {
  padding: 1.25rem;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-radius: 16px;
}

.printer-price-card--featured,
.printer-comparison-card--featured {
  border-top: 5px solid var(--color-primary);
}

.printer-price-card h3,
.printer-comparison-card h3 {
  margin: 0 0 1rem;
  color: var(--color-primary);
  font-size: 1.35rem;
}

.printer-price-card > :last-child,
.printer-comparison-card > :last-child {
  margin-bottom: 0;
}

/* Price and specification lists */

.printer-spec-list {
  margin: 0 0 1rem;
}

.printer-spec-list div {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: .7rem 0;
  border-bottom: 1px solid var(--color-border);
}

.printer-spec-list div:first-child {
  border-top: 1px solid var(--color-border);
}

.printer-spec-list dt {
  font-weight: 700;
}

.printer-spec-list dd {
  margin: 0;
  color: var(--color-primary);
  font-weight: 900;
  text-align: right;
}

/* Large-number statistics */

.printer-stat-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
  margin: 1.25rem 0;
}

.printer-stat-grid article {
  padding: 1rem;
  text-align: center;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-radius: 14px;
}

.printer-stat-grid strong {
  display: block;
  margin-bottom: .35rem;
  color: var(--color-primary);
  font-size: clamp(1.45rem, 3vw, 2.1rem);
  line-height: 1;
}

.printer-stat-grid span {
  display: block;
  color: var(--color-muted);
  font-size: .86rem;
  line-height: 1.4;
}

/* Ink comparison table */

.ink-cost-table-wrapper {
  margin: 1.25rem 0;
  overflow-x: auto;
  border: 1px solid var(--color-border);
  border-radius: 15px;
}

.ink-cost-table {
  width: 100%;
  min-width: 650px;
  border-collapse: collapse;
  background: var(--color-surface);
}

.ink-cost-table th,
.ink-cost-table td {
  padding: .9rem 1rem;
  border-bottom: 1px solid var(--color-border);
  text-align: left;
}

.ink-cost-table thead th {
  background: var(--color-primary);
  color: #fff;
  font-size: .86rem;
}

.ink-cost-table tbody th {
  color: var(--conde-primary-dark);
}

.ink-cost-table tbody tr:last-child th,
.ink-cost-table tbody tr:last-child td {
  border-bottom: 0;
}

.ink-cost-table__winner {
  background: var(--color-cream-light);
}

.ink-cost-table__winner th::after {
  content: " Best Value";
  display: inline-block;
  margin-left: .5rem;
  padding: .15rem .45rem;
  border-radius: 999px;
  background: var(--color-primary);
  color: #fff;
  font-size: .68rem;
  font-weight: 800;
  vertical-align: middle;
}

@media (max-width: 850px) {
  .printer-price-grid,
  .printer-comparison-grid,
  .printer-stat-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 600px) {
  .printer-spec-list div {
    display: block;
  }

  .printer-spec-list dd {
    margin-top: .2rem;
    text-align: left;
  }
}
/* =========================================================
   SELLING SUBLIMATION PRODUCTS GUIDE
========================================================= */

/* Sales channel cards */

.sales-channel-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .8rem;
  margin: 1.25rem 0;
}

.sales-channel-grid article {
  padding: 1rem;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-radius: 14px;
}

.sales-channel-grid i {
  display: inline-grid;
  width: 42px;
  height: 42px;
  margin-bottom: .65rem;
  place-items: center;
  border-radius: 12px;
  background: var(--color-surface);
  color: var(--color-primary);
  font-size: 1.25rem;
}

.sales-channel-grid h3 {
  margin: 0 0 .4rem;
  color: var(--color-primary);
  font-size: 1rem;
}

.sales-channel-grid p {
  margin-bottom: 0;
  font-size: .9rem;
}

/* Social platform pills */

.social-platform-row {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin-top: 1.25rem;
}

.social-platform-row span {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .45rem .7rem;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-radius: 999px;
  color: var(--color-primary);
  font-size: .84rem;
  font-weight: 800;
}

/* Commercial client cards */

.commercial-client-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .85rem;
  margin: 1.25rem 0;
}

.commercial-client-grid article {
  padding: 1rem;
  text-align: center;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-radius: 14px;
}

.commercial-client-grid i {
  margin-bottom: .65rem;
  color: var(--color-primary);
  font-size: 1.5rem;
}

.commercial-client-grid h3 {
  margin: 0 0 .4rem;
  color: var(--conde-primary-dark);
  font-size: 1rem;
}

.commercial-client-grid p {
  margin-bottom: 0;
  font-size: .87rem;
}

/* Niche chips */

.niche-chip-grid {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin: 1.25rem 0;
}

.niche-chip-grid span {
  padding: .5rem .8rem;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-radius: 999px;
  color: var(--color-primary);
  font-size: .86rem;
  font-weight: 800;
}

/* Community progression */

.community-path {
  display: grid;
  grid-template-columns:
    minmax(0, 1fr)
    auto
    minmax(0, 1fr)
    auto
    minmax(0, 1fr)
    auto
    minmax(0, 1fr);
  gap: .65rem;
  align-items: center;
  margin: 1.4rem 0;
}

.community-path article {
  min-height: 150px;
  padding: 1rem;
  text-align: center;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-radius: 15px;
}

.community-path article > i {
  display: block;
  margin-bottom: .7rem;
  color: var(--color-primary);
  font-size: 1.55rem;
}

.community-path strong,
.community-path span {
  display: block;
}

.community-path strong {
  margin-bottom: .4rem;
  color: var(--conde-primary-dark);
}

.community-path span {
  color: var(--color-muted);
  font-size: .82rem;
  line-height: 1.4;
}

.community-path__arrow {
  color: var(--color-primary-soft);
}

/* Etsy growth process */

.etsy-growth-path {
  display: grid;
  gap: .75rem;
  margin: 1.25rem 0;
}

.etsy-growth-path article {
  position: relative;
  min-height: 82px;
  padding: 1rem 1rem 1rem 4.1rem;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-radius: 14px;
}

.etsy-growth-path article > span {
  position: absolute;
  top: 50%;
  left: 1rem;
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 50%;
  background: var(--color-primary);
  color: #fff;
  font-weight: 900;
  transform: translateY(-50%);
}

.etsy-growth-path h3 {
  margin: 0 0 .3rem;
  color: var(--color-primary);
  font-size: 1rem;
}

.etsy-growth-path p {
  margin-bottom: 0;
  font-size: .9rem;
}

/* Organic versus paid advertising */

.advertising-comparison-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin: 1.25rem 0;
}

.advertising-comparison-grid article {
  padding: 1.25rem;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-top: 5px solid var(--color-primary);
  border-radius: 16px;
}

.advertising-comparison-grid h3 {
  margin: 0 0 .8rem;
  color: var(--color-primary);
}

/* Quality checklist */

.quality-check-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .7rem;
  margin: 1.25rem 0;
  padding: 0;
  list-style: none;
}

.quality-check-list li {
  display: flex;
  gap: .65rem;
  align-items: center;
  margin: 0;
  padding: .8rem;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-radius: 12px;
  line-height: 1.45;
}

.quality-check-list i {
  color: var(--color-primary);
}

/* Final takeaway cards */

.takeaway-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .8rem;
  margin: 1.25rem 0;
}

.takeaway-grid article {
  position: relative;
  padding: 1rem 1rem 1rem 3.5rem;
  background: rgba(255,255,255,.7);
  border: 1px solid var(--color-border);
  border-radius: 14px;
}

.takeaway-grid article > i {
  position: absolute;
  top: 1rem;
  left: 1rem;
  color: var(--color-primary);
  font-size: 1.25rem;
}

.takeaway-grid strong {
  display: block;
  margin-bottom: .35rem;
  color: var(--conde-primary-dark);
}

.takeaway-grid p {
  margin-bottom: 0;
  font-size: .88rem;
}

/* Responsive */

@media (max-width: 950px) {
  .commercial-client-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .community-path {
    grid-template-columns: 1fr;
  }

  .community-path article {
    min-height: 0;
  }

  .community-path__arrow {
    transform: rotate(90deg);
    justify-self: center;
  }
}

@media (max-width: 700px) {
  .sales-channel-grid,
  .commercial-client-grid,
  .advertising-comparison-grid,
  .quality-check-list,
  .takeaway-grid {
    grid-template-columns: 1fr;
  }
}
/* =========================================================
   SUBLIMATION BUSINESS STARTUP GUIDE
========================================================= */

/* Product examples */

.startup-product-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .7rem;
  margin: 1.25rem 0;
}

.startup-product-grid span {
  display: flex;
  gap: .55rem;
  align-items: center;
  min-height: 52px;
  padding: .7rem .8rem;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-radius: 12px;
  color: var(--conde-primary-dark);
  font-size: .9rem;
  font-weight: 700;
}

.startup-product-grid i {
  color: var(--color-primary);
}

/* Printer equipment cards */

.startup-equipment-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  margin: 1.25rem 0;
}

.startup-equipment-card {
  display: flex;
  flex-direction: column;
  padding: 1.25rem;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-radius: 16px;
}

.startup-equipment-card--featured {
  border-top: 5px solid var(--color-primary);
}

.startup-equipment-card h3 {
  margin: 0 0 .75rem;
  color: var(--color-primary);
  font-size: 1.25rem;
}

.startup-equipment-card .blog-check-list {
  flex-grow: 1;
}

.blog-button--small {
  align-self: flex-start;
  min-height: 40px;
  margin-top: auto;
  padding: .55rem .9rem;
  font-size: .85rem;
}

/* Heat press types */

.heat-press-type-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .85rem;
  margin: 1.25rem 0;
}

.heat-press-type-grid article {
  padding: 1rem;
  text-align: center;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-radius: 14px;
}

.heat-press-type-grid article > i {
  margin-bottom: .65rem;
  color: var(--color-primary);
  font-size: 1.55rem;
}

.heat-press-type-grid h3 {
  margin: 0 0 .45rem;
  color: var(--conde-primary-dark);
  font-size: 1rem;
}

.heat-press-type-grid p {
  margin-bottom: 0;
  font-size: .88rem;
}

/* Ink and paper */

.ink-paper-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin: 1.25rem 0;
}

.ink-paper-grid article {
  padding: 1.25rem;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-radius: 16px;
}

.ink-paper-grid__icon {
  display: grid;
  width: 50px;
  height: 50px;
  margin-bottom: .75rem;
  place-items: center;
  border-radius: 14px;
  background: var(--color-surface);
  color: var(--color-primary);
  font-size: 1.35rem;
}

.ink-paper-grid h3 {
  margin: 0 0 .6rem;
  color: var(--color-primary);
}

.ink-paper-grid article > :last-child {
  margin-bottom: 0;
}

/* Additional supplies */

.startup-supply-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
  margin: 1.25rem 0;
}

.startup-supply-grid article {
  position: relative;
  min-height: 105px;
  padding: 1rem 1rem 1rem 3.8rem;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-radius: 14px;
}

.startup-supply-grid article > i {
  position: absolute;
  top: 1rem;
  left: 1rem;
  color: var(--color-primary);
  font-size: 1.35rem;
}

.startup-supply-grid h3 {
  margin: 0 0 .35rem;
  color: var(--conde-primary-dark);
  font-size: 1rem;
}

.startup-supply-grid p {
  margin-bottom: 0;
  font-size: .88rem;
}

/* Software cards */

.design-software-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .9rem;
  margin: 1.25rem 0;
}

.design-software-grid article {
  padding: 1.1rem;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-top: 4px solid var(--color-primary-soft);
  border-radius: 14px;
}

.design-software-grid h3 {
  margin: 0 0 .5rem;
  color: var(--color-primary);
  font-size: 1.1rem;
}

.design-software-grid p:last-child {
  margin-bottom: 0;
}

/* Business planning */

.business-plan-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
  margin: 1.25rem 0;
}

.business-plan-grid article {
  padding: .95rem 1rem;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-left: 5px solid var(--color-primary-soft);
  border-radius: 13px;
}

.business-plan-grid strong {
  display: block;
  margin-bottom: .35rem;
  color: var(--color-primary);
}

.business-plan-grid p {
  margin-bottom: 0;
  font-size: .9rem;
}

/* Responsive */

@media (max-width: 950px) {
  .startup-equipment-grid,
  .heat-press-type-grid {
    grid-template-columns: 1fr;
  }

  .startup-product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 650px) {
  .startup-product-grid,
  .ink-paper-grid,
  .startup-supply-grid,
  .design-software-grid,
  .business-plan-grid {
    grid-template-columns: 1fr;
  }
}
/* =========================================================
   EPSON F170 ARTICLE
========================================================= */

/* Product application cards */

.f170-product-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .8rem;
  margin: 1.25rem 0;
}

.f170-product-grid article {
  position: relative;
  min-height: 112px;
  padding: 1rem 1rem 1rem 3.75rem;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-radius: 14px;
}

.f170-product-grid article > i {
  position: absolute;
  top: 1.05rem;
  left: 1rem;
  color: var(--color-primary);
  font-size: 1.4rem;
}

.f170-product-grid h3 {
  margin: 0 0 .35rem;
  color: var(--conde-primary-dark);
  font-size: 1rem;
}

.f170-product-grid p {
  margin-bottom: 0;
  font-size: .88rem;
}

/* Ink statistics */

.f170-stat-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
  margin: 1.25rem 0;
}

.f170-stat-grid article {
  padding: 1rem;
  text-align: center;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-radius: 14px;
}

.f170-stat-grid strong {
  display: block;
  margin-bottom: .4rem;
  color: var(--color-primary);
  font-size: clamp(1.35rem, 3vw, 2rem);
  line-height: 1;
}

.f170-stat-grid span {
  display: block;
  color: var(--color-muted);
  font-size: .82rem;
  line-height: 1.4;
}

/* Intended-user cards */

.f170-user-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .85rem;
  margin: 1.25rem 0;
}

.f170-user-grid article {
  padding: 1.1rem;
  text-align: center;
  background: var(--color-cream-light);
  border: 1px solid var(--color-border);
  border-radius: 15px;
}

.f170-user-grid article > i {
  margin-bottom: .7rem;
  color: var(--color-primary);
  font-size: 1.55rem;
}

.f170-user-grid h3 {
  margin: 0 0 .45rem;
  color: var(--conde-primary-dark);
  font-size: 1rem;
}

.f170-user-grid p {
  margin-bottom: 0;
  font-size: .88rem;
}

/* Final shopping card */

.f170-shop-card {
  display: grid;
  grid-template-columns: minmax(250px, .75fr) minmax(0, 1.25fr);
  gap: 2rem;
  align-items: center;
  margin-top: 1.5rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background:
    linear-gradient(
      135deg,
      var(--color-cream-light),
      var(--color-surface)
    );
  border: 1px solid var(--color-border);
  border-radius: 20px;
  box-shadow: 0 9px 26px rgba(0,0,0,.065);
}

.f170-shop-card__image {
  overflow: hidden;
  border-radius: 16px;
  background: var(--color-surface);
}

.f170-shop-card__image a {
  display: block;
}

.f170-shop-card__image img {
  width: 100%;
}

.f170-shop-card__copy h2 {
  margin: 0 0 .75rem;
  color: var(--color-primary);
  font-size: clamp(1.6rem, 3vw, 2.25rem);
}

.f170-shop-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: .7rem;
  margin-top: 1.1rem;
}

@media (max-width: 850px) {
  .f170-stat-grid {
    grid-template-columns: 1fr;
  }

  .f170-shop-card {
    grid-template-columns: 1fr;
  }

  .f170-shop-card__image {
    max-width: 520px;
    margin: 0 auto;
  }
}

@media (max-width: 650px) {
  .f170-product-grid,
  .f170-user-grid {
    grid-template-columns: 1fr;
  }

  .f170-shop-card__actions {
    display: grid;
  }

  .f170-shop-card__actions .blog-button {
    width: 100%;
  }
}
/* =========================================================
   HEADER CENTER COLUMN
========================================================= */

.header-main {
  display: grid;
  grid-template-columns:
    minmax(180px, auto)
    minmax(340px, 1fr)
    minmax(210px, auto);
  gap: 1.5rem;
  align-items: center;
}

.header-center {
  display: grid;
  gap: .7rem;
  width: 100%;
  max-width: 820px;
  justify-self: center;
}

.header-center .site-search {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .65rem;
  width: 100%;
}

.header-center .site-search input[type="text"] {
  width: 100%;
  min-width: 0;
}

/* Keep the auto-search directly beneath the input */

.header-center .autosearch {
  top: calc(100% + .35rem);
  left: 0;
  right: 95px;
  z-index: 1200;
  margin: 0 !important;
}

/* =========================================================
   JUMP TO PRODUCTS
========================================================= */

.product-jump {
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
}

.product-jump__control {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
}

.product-jump__icon {
  position: absolute;
  left: 1rem;
  z-index: 1;
  color: var(--color-primary);
  font-size: .95rem;
  pointer-events: none;
}

.product-jump__arrow {
  position: absolute;
  right: 1rem;
  z-index: 1;
  color: var(--color-primary);
  font-size: .8rem;
  pointer-events: none;
}

.product-jump__select,
.header-center select[name="prod_details"],
.product-jump__button {
  width: 100%;
  min-height: 44px;
  padding: .65rem 2.8rem .65rem 2.65rem;

  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;

  background:
    linear-gradient(
      135deg,
      var(--color-cream-light),
      var(--color-surface)
    );

  border: 1px solid var(--color-border);
  border-radius: 999px;

  color: var(--conde-primary-dark);
  font: inherit;
  font-size: .95rem;
  font-weight: 800;
  text-align: center;
  cursor: pointer;

  box-shadow: 0 4px 12px rgba(0,0,0,.045);

  transition:
    border-color .18s ease,
    box-shadow .18s ease,
    background .18s ease;
}

.product-jump__select:hover,
.header-center select[name="prod_details"]:hover,
.product-jump__button:hover {
  border-color: var(--color-primary-soft);
  background: var(--color-surface);
}

.product-jump__select:focus,
.header-center select[name="prod_details"]:focus,
.product-jump__button:focus {
  outline: 0;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(0,103,120,.14);
}

.product-jump__select--enhanced {
  display: none !important;
}

.product-jump__button {
  display: block;
}

.product-jump__options {
  position: absolute;
  top: calc(100% + .4rem);
  left: 0;
  right: 0;
  z-index: 30000;
  max-height: min(62vh, 620px);
  overflow-y: auto;
  padding: .4rem;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: 16px;
  box-shadow: 0 14px 36px rgba(7,56,84,.2);
}

.product-jump__options[hidden] {
  display: none;
}

.product-jump__option {
  display: block;
  width: 100%;
  padding: .62rem .8rem;
  color: var(--conde-primary-dark);
  font: inherit;
  font-size: .92rem;
  font-weight: 650;
  line-height: 1.25;
  text-align: left;
  background: transparent;
  border: 0;
  border-radius: 9px;
  cursor: pointer;
}

.product-jump__option:hover,
.product-jump__option:focus-visible {
  color: var(--conde-primary-dark);
  background: var(--color-cream-light);
  outline: 0;
}

.product-jump__option--featured {
  color: #c62828;
  font-weight: 900;
}

.product-jump__select option {
  background: var(--color-surface);
  color: var(--color-ink);
  font-weight: 600;
  text-align: left;
}

.product-jump__select option[style*="color:red"],
.product-jump__select .product-jump__featured {
  color: var(--color-primary);
  font-weight: 900;
}

/* =========================================================
   RESPONSIVE HEADER
========================================================= */

@media (max-width: 1000px) {
  .header-main {
    grid-template-columns: auto minmax(300px, 1fr);
  }

  .header-center {
    max-width: none;
  }

  .header-actions {
    grid-column: 1 / -1;
    justify-self: center;
  }
}

@media (max-width: 760px) {
  .header-main {
    grid-template-columns: 1fr auto 1fr;
    gap: .85rem;
  }

  .brand,
  .header-center,
  .header-actions {
    justify-self: center;
  }

  .header-actions {
    justify-self: stretch;
    width: 100%;
  }

  .brand {
    left: 0;
  }

  .header-center {
    grid-column: 1 / -1;
    grid-row: 2;
    width: 100%;
    max-width: 100%;
    margin-inline: auto;
  }

  .header-center .site-search {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .product-jump {
    width: 100%;
    max-width: none;
    margin-inline: auto;
  }

  .product-jump__control,
  .product-jump__select,
  .header-center select[name="prod_details"] {
    border-radius: 999px !important;
  }

  .product-jump__select,
  .header-center select[name="prod_details"] {
    display: block !important;
    width: 100% !important;
    min-height: 44px;
    margin: 0 auto !important;
    padding: .65rem 2.75rem !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    color: var(--conde-primary-dark) !important;
    font: inherit !important;
    font-size: .95rem !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    text-align: center;
    border: 1px solid var(--color-border) !important;
    background-color: var(--color-surface) !important;
    background-image:
      linear-gradient(45deg, transparent 50%, var(--color-primary) 50%),
      linear-gradient(135deg, var(--color-primary) 50%, transparent 50%),
      linear-gradient(135deg, var(--color-cream-light), var(--color-surface)) !important;
    background-position:
      calc(100% - 20px) 50%,
      calc(100% - 15px) 50%,
      0 0 !important;
    background-size: 5px 5px, 5px 5px, 100% 100% !important;
    background-repeat: no-repeat !important;
    box-shadow: 0 4px 12px rgba(0,0,0,.06) !important;
    cursor: pointer;
  }

  .product-jump__select--enhanced,
  .header-center select[name="prod_details"].product-jump__select--enhanced {
    display: none !important;
  }
}

@media (max-width: 520px) {
  .header-center .site-search {
    grid-template-columns: 1fr;
  }

  .header-center .site-search button {
    width: 100%;
  }

  .header-center .autosearch {
    right: 0;
  }

  .product-jump__select,
  .header-center select[name="prod_details"] {
    text-align: left;
  }
}