/* Remove cart icon entirely on mobile */
@media (max-width: 768px) {

    .wda-header-cart,
    .header-cart,
    .woocommerce-cart-link,
    .menu-item-cart,
    .wda-mobile-header .header-cart {
        display: none !important;
    }
}

/*
==================================================================================
Return Policy
*/
.gd-header-policy a.gd-refund-link,
.gd-footer-policy a.gd-refund-link,
a.gd-refund-link {
    font-family: "Optimus Princeps", serif;
    font-size: 13px;
    text-transform: lowercase;
    color: #c4a46a !important;
    opacity: 0.8;
    letter-spacing: 0.4px;
    text-decoration: none;
    transition: 0.25s ease;
}

.gd-header-policy a.gd-refund-link:hover,
.gd-footer-policy a.gd-refund-link:hover,
a.gd-refund-link:hover {
    color: #d8bb7a !important;
    text-decoration: underline !important;
    opacity: 1;
}

.gd-header-policy,
.gd-footer-policy {
    margin-top: 6px;
    margin-bottom: 6px;
    text-align: center;
}

/* =========================================================
   00) WooCommerce: variation selects (readable, no iOS zoom)
   ========================================================= */
.woocommerce div.product form.cart .variations select{
  width: 100%;
  font-size: 16px;                 /* prevents iOS zoom on focus */
  background: #fff !important;
  color: #000 !important;
  border: 1px solid #ccc;
  padding: 6px 10px;
  border-radius: 4px;
  -webkit-appearance: none;
  appearance: none;
}
.woocommerce div.product form.cart .variations select:hover,
.woocommerce div.product form.cart .variations select:focus{
  background: #f9f9f9 !important;
  color: #000 !important;
  border-color: #666;
}

/* =========================================================
   01) Brand fonts
   ========================================================= */
/* H1: Optimus Princeps */
@font-face{
  font-family: "Optimus Princeps";
  src:
    url("/wp-content/fonts/optimusprinceps/optimusprinceps-webfont.woff2") format("woff2"),
    url("/wp-content/fonts/optimusprinceps/optimusprinceps-webfont.woff")  format("woff");
  font-weight: 400; font-style: normal; font-display: swap;
}
/* H2: Wrong Time Wrong Place (aka “Living Hell”) */
@font-face{
  font-family: "Wrong Time Wrong Place";
  src:
    url("/wp-content/fonts/wrong_time_wrong_place/wrong_time_wrong_place-webfont.woff2") format("woff2"),
    url("/wp-content/fonts/wrong_time_wrong_place/wrong_time_wrong_place-webfont.woff")  format("woff");
  font-weight: 400; font-style: normal; font-display: swap;
}

/* =========================================================
   02) Global variables & tiny utilities
   ========================================================= */
:root{
  /* layout */
  --rail: clamp(24px, 4vw, 64px);
  --gap:  clamp(14px, 2vw, 24px);

  /* card chrome */
  --card-bg: rgba(15,15,15,.40);
  --card-bdr: rgba(255,255,255,.18);
  --card-radius: 12px;
  --card-hover: #c3ae82;

  /* brand stacks */
  --gdc-h1-font: "Optimus Princeps", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --gdc-h2-font: "Wrong Time Wrong Place", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

ul.wp-block-post-template{ list-style:none; margin:0; padding:0; }

/* =========================================================
   03) Brand titles (fonts + lowercase)
   ========================================================= */
/* Primary titles (post/page/product singles) */
.single .entry-title,
.page .entry-title,
.single .wp-block-post-title,
.page .wp-block-post-title,
.woocommerce div.product .product_title,
.product_title.entry-title,
h1.entry-title,
.page-title,
.page-header .page-title,
.article-title,
.post-title,
.post__title{
  font-family: var(--gdc-h1-font) !important;
  font-weight: 400; letter-spacing:.01em;
  line-height: 1.1;
  text-transform: lowercase !important;
  font-variant-caps: normal;
  font-feature-settings: "smcp" 0, "c2sc" 0;
}

/* Card/list titles (archives, loops, grids) */
.wp-block-post-title,
.wp-block-post-title a,
.blog .entry-title,
.archive .entry-title,
.search .entry-title,
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.wc-block-grid__product .wc-block-grid__product-title{
  font-family: var(--gdc-h1-font) !important;
  font-weight: 400; letter-spacing:.01em;
  line-height: 1.1;
  text-transform: lowercase !important;
}

/* Secondary headings (explicit H2 look) */
h2, .is-style-gdc-h2, .wp-block-heading.is-style-gdc-h2{
  font-family: var(--gdc-h2-font);
  font-weight: 400; letter-spacing:.01em;
  line-height: 1.15;
  text-transform: lowercase !important;
  font-variant-caps: normal;
  font-feature-settings: "smcp" 0, "c2sc" 0;
}

/* Ensure links inherit lowercase & family */
.entry-title a,
.wp-block-post-title a,
.woocommerce-loop-product__title a,
.wc-block-grid__product-title a,
h1 a, h2 a{ text-transform: inherit !important; font-family: inherit !important; }

/* =========================================================
   04) FEATURED NEWS (Cover: .gc-featured)
   (values preserved exactly)
   ========================================================= */
.gc-featured{ --gap: clamp(12px, 1.4vw, 20px); --split-left: 65%; }

/* Full-bleed band with inner rails */
.gc-featured.alignfull{ margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); width:100vw; }
.gc-featured .wp-block-cover__inner-container{ max-width:none; padding:clamp(24px, 5vw, 64px) var(--rail); }

/* Section heading aligned to rails */
.gc-featured .wp-block-heading{ margin:0 0 14px; padding:0 var(--rail); }

/* Two-column split, gap controlled */
.gc-featuredGrid.wp-block-columns{
  display:grid !important;
  grid-template-columns: minmax(0,var(--split-left)) minmax(0,calc(100% - var(--split-left)));
  column-gap:var(--gap) !important; row-gap:var(--gap) !important;
  padding:0 var(--rail);
}
.gc-featuredGrid.wp-block-columns > .wp-block-column{ margin:0 !important; padding:0 !important; }
.gc-featuredGrid.is-layout-flex{ gap:0 !important; } /* safety */

/* Left (hero) */
.gc-left{ display:grid; gap:10px; grid-template-rows:auto auto; }
.gc-hero-img .wp-block-post-featured-image{
  margin:0 !important; line-height:0;
  background:var(--card-bg); border:1px solid var(--card-bdr);
  border-radius:var(--card-radius); overflow:hidden;
}
@media (min-width:980px){ .gc-hero-img .wp-block-post-featured-image{ aspect-ratio:16/9; } }
.gc-hero-img .wp-block-post-featured-image img{ width:100%; height:100%; object-fit:cover; display:block; }
.gc-hero-img .wp-block-post-featured-image:hover{ border-color:var(--card-hover); box-shadow:0 10px 30px rgba(0,0,0,.35); }
.gc-meta-below{ display:flex; flex-direction:column; gap:6px; }
.gc-meta-below .wp-block-post-title{ margin:0; line-height:1.2; }
.gc-meta-below .wp-block-post-date{ margin:0; font-size:12px; color:#a7a7a7; }

/* Right (3-up column; text, text, image) */
.gc-right{ display:block; }
.gc-right .wp-block-post-template{
  display:grid !important; grid-template-columns:1fr; row-gap:var(--gap) !important;
  margin:0 !important; padding:0 !important; list-style:none;
}
.gc-right .wp-block-post-template > li{ margin:0 !important; }

/* #1 and #2: text cards */
.gc-right .wp-block-post-template > li:nth-child(1),
.gc-right .wp-block-post-template > li:nth-child(2){
  background:var(--card-bg); border:1px solid var(--card-bdr);
  border-radius:var(--card-radius);
  padding:clamp(12px, 1.6vw, 20px);
  box-shadow:0 0 0 1px rgba(255,255,255,.03) inset;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.gc-right .wp-block-post-template > li:nth-child(1):hover,
.gc-right .wp-block-post-template > li:nth-child(2):hover{
  border-color:var(--card-hover); box-shadow:0 10px 30px rgba(0,0,0,.35);
}
/* hide their images */
.gc-right .wp-block-post-template > li:nth-child(1) .wp-block-post-featured-image,
.gc-right .wp-block-post-template > li:nth-child(2) .wp-block-post-featured-image{ display:none !important; }

/* #3: image card */
.gc-right .wp-block-post-template > li:nth-child(3){ padding:0; background:transparent; border:0; }
.gc-right .wp-block-post-template > li:nth-child(3) .wp-block-post-featured-image{
  margin:0 !important; line-height:0;
  background:var(--card-bg); border:1px solid var(--card-bdr);
  border-radius:var(--card-radius); overflow:hidden;
  aspect-ratio:16/9;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.gc-right .wp-block-post-template > li:nth-child(3) .wp-block-post-featured-image img{ width:100%; height:100%; object-fit:cover; display:block; }
.gc-right .wp-block-post-template > li:nth-child(3) .wp-block-post-featured-image:hover{ border-color:var(--card-hover); box-shadow:0 10px 30px rgba(0,0,0,.35); }
.gc-right .wp-block-post-template > li:nth-child(3) .gc-meta-below{ margin-top:8px; }

/* Featured links */
.gc-featured .wp-block-post-title a{ color:#fff; text-decoration:none; }
.gc-featured .wp-block-post-title a:hover{ color:#fff; text-decoration:underline; text-underline-offset:2px; }

/* Responsive: stack Featured on mobile (keep gaps as-is) */
@media (max-width:980px){
  .gc-featuredGrid.wp-block-columns{
    grid-template-columns:1fr !important;
    column-gap:0 !important; row-gap:var(--gap) !important;
    padding-left:var(--rail); padding-right:var(--rail);
  }
}

/* =========================================================
   05) LATEST NEWS (4×2 grid)
   (kept exactly; unified image height + no crop)
   ========================================================= */
.gc-latest.alignfull{ margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); width:100vw; }
.gc-latest .wp-block-cover__inner-container{ max-width:none; padding:clamp(24px, 5vw, 64px) var(--rail); }
.gc-latest .wp-block-heading{ margin:0 0 14px; padding:0 var(--rail); }

.gc-latest ul.wp-block-post-template.gc-latestGrid{
  display:grid !important;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap:var(--gap);
  padding:0 var(--rail); margin:0; list-style:none;
}
.gc-latest ul.wp-block-post-template.gc-latestGrid > li{ margin:0; }

.ln-card{ display:flex; flex-direction:column; gap:10px; }

/* unified image box */
.gc-latest{ --ln-aspect: 16/9; }         /* helpers: .gc-latest--fourthree / --square if you need */
.gc-latest--fourthree{ --ln-aspect: 4/3; }
.gc-latest--square{    --ln-aspect: 1/1; }

.ln-card__img{
  background:var(--card-bg); border:1px solid var(--card-bdr);
  border-radius:var(--card-radius); overflow:hidden; line-height:0;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.ln-card__img .wp-block-post-featured-image{
  margin:0 !important; aspect-ratio:var(--ln-aspect) !important; width:100%;
}
.ln-card__img .wp-block-post-featured-image img{
  width:100%; height:100%;
  object-fit:contain !important;          /* show full image; no crop */
  object-position:center center; display:block;
}
.ln-card__img:hover{ border-color:var(--card-hover); box-shadow:0 10px 30px rgba(0,0,0,.35); }

.ln-card__meta{ display:flex; flex-direction:column; gap:6px; }
.ln-card__meta .wp-block-post-title{ margin:0; line-height:1.25; }
.ln-card__meta .wp-block-post-date{ margin:0; font-size:12px; color:#a7a7a7; }

.gc-latest .wp-block-post-title a{ color:#fff; text-decoration:none; }
.gc-latest .wp-block-post-title a:hover{ color:#fff; text-decoration:underline; text-underline-offset:2px; }

/* Latest responsive columns */
@media (max-width:1100px){ .gc-latest ul.wp-block-post-template.gc-latestGrid{ grid-template-columns:repeat(3, minmax(0,1fr)); } }
@media (max-width:800px){  .gc-latest ul.wp-block-post-template.gc-latestGrid{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (max-width:520px){  .gc-latest ul.wp-block-post-template.gc-latestGrid{ grid-template-columns:1fr; } }

/* =========================================================
   06) Mobile typography polish (no changes to gaps/images)
   ========================================================= */
@media (max-width:680px){
  html{ -webkit-text-size-adjust:100%; }
  body{ line-height:1.6; }

  /* scale titles nicely */
  .single .entry-title,
  .page .entry-title,
  .single .wp-block-post-title,
  .page .wp-block-post-title,
  .woocommerce div.product .product_title,
  .product_title.entry-title{
    font-size: clamp(22px, 6.2vw, 28px) !important;
    line-height: 1.15;
  }
  .wp-block-post-title,
  .gc-featured .wp-block-post-title,
  .gc-latest .wp-block-post-title,
  .woocommerce ul.products li.product .woocommerce-loop-product__title,
  .wc-block-grid__product .wc-block-grid__product-title{
    font-size: clamp(16px, 4.6vw, 20px) !important;
    line-height: 1.2;
  }
  h2, .is-style-gdc-h2, .wp-block-heading.is-style-gdc-h2{
    font-size: clamp(18px, 5.2vw, 24px) !important;
    line-height: 1.2;
  }

  /* safe wrapping */
  .wp-block-post-title,
  .wp-block-heading,
  .entry-title{ overflow-wrap:anywhere; hyphens:auto; }

  /* media overflow safety */
  .wp-block-image img,
  .wp-block-embed iframe,
  .wp-block-embed object{ max-width:100%; height:auto; }
}

/* Extra-small phones */
@media (max-width:480px){
  .single .entry-title,
  .page .entry-title,
  .single .wp-block-post-title,
  .page .wp-block-post-title,
  .woocommerce div.product .product_title,
  .product_title.entry-title{
    font-size: clamp(20px, 7vw, 24px) !important;
  }
  .wp-block-post-title,
  .gc-featured .wp-block-post-title,
  .gc-latest .wp-block-post-title,
  .woocommerce ul.products li.product .woocommerce-loop-product__title,
  .wc-block-grid__product .wc-block-grid__product-title{
    font-size: clamp(15px, 4.8vw, 18px) !important;
  }
  h2, .is-style-gdc-h2, .wp-block-heading.is-style-gdc-h2{
    font-size: clamp(17px, 5.8vw, 22px) !important;
  }
}
/* Top bar becomes a slim footer strip on phones */
@media (max-width:680px){
  .gdc-in-footer{
    padding: 10px var(--rail);
    border-top: 1px solid rgba(255,255,255,.12);
    background: transparent; /* keep your site bg */
  }
  .gdc-in-footer .wpdevart-top-header-section{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    flex-wrap:wrap !important;
    gap:10px !important;
    min-height:auto !important;
    line-height:1.2 !important;
  }
  .gdc-in-footer .wpdevart-top-header-left,
  .gdc-in-footer .wpdevart-top-header-right{
    display:flex !important;
    align-items:center !important;
    gap:12px !important;
    flex-wrap:wrap !important;
  }
  .gdc-in-footer .wpdevart-phone-email-text{ font-size:13px !important; }
  .gdc-in-footer .top-header-icons,
  .gdc-in-footer .wpdevart-social-icons a svg{
    width:18px !important; height:18px !important;
  }

  /* If space is tight on very small phones, drop the address */
  @media (max-width:420px){
    .gdc-in-footer .wpdevart-top-header-address{ display:none !important; }
  }
}
/* Full-bleed ONLY for the top Cover with anchor #gcTopBand */
#gcTopBand.wp-block-cover{
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  width: 100vw !important;
  max-width: 100vw !important;
  border-radius: 0; /* no corner peeking */
}

/* Match your other bands’ inner rails (doesn’t change gaps/images) */
#gcTopBand .wp-block-cover__inner-container{
  max-width: none !important;
  padding-left: var(--rail);
  padding-right: var(--rail);
}

/* If it’s the first block, remove any stray top gap so it kisses the header */
.entry-content > #gcTopBand:first-child,
.wp-block-post-content > #gcTopBand:first-child{
  margin-top: 0 !important;
}
/* ===========================
   FEATURED — hard gap between columns
   (only affects .gc-featured)
   =========================== */

/* 1) Define the gap once */
.gc-featured{ --gdc-col-gap: clamp(16px, 1.8vw, 28px); }

/* 2) Force the Columns block to a real grid and use our gap */
.gc-featured .gc-featuredGrid.wp-block-columns{
  display: grid !important;
  grid-template-columns: minmax(0, 64%) minmax(0, 36%);
  column-gap: var(--gdc-col-gap) !important;
  row-gap: var(--gdc-col-gap) !important;
  padding: 0 var(--rail);
}

/* 3) Kill theme-injected margins/padding that collapse the gap */
.gc-featured .gc-featuredGrid.wp-block-columns > .wp-block-column{
  margin: 0 !important;
  padding: 0 !important;
}

/* 4) Safety: if the theme flips it to flex, still keep the gap */
.gc-featured .gc-featuredGrid.is-layout-flex{ gap: var(--gdc-col-gap) !important; }

/* 5) Right column’s internal list keeps even spacing too */
.gc-featured .gc-right .wp-block-post-template{
  display: grid !important;
  grid-template-columns: 1fr;
  row-gap: var(--gdc-col-gap) !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 6) Mobile: stack with the same vertical spacing */
@media (max-width: 980px){
  .gc-featured .gc-featuredGrid.wp-block-columns{
    grid-template-columns: 1fr !important;
    column-gap: 0 !important;
    row-gap: var(--gdc-col-gap) !important;
  }
}
/* RIGHT COLUMN (Featured): show images on cards 1–2 and use them as a dimmed background */
.gc-right .wp-block-post-template > li:nth-child(-n+2){
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

/* Undo earlier "display:none" and stretch the featured image to cover the card */
.gc-right .wp-block-post-template > li:nth-child(-n+2) figure.wp-block-post-featured-image{
  display: block !important;
  position: absolute;
  inset: 0;
  margin: 0 !important;
  z-index: 0;
  pointer-events: none;
}

/* Make the image fill & crop to the card (background-like) */
.gc-right .wp-block-post-template > li:nth-child(-n+2) figure.wp-block-post-featured-image img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Dim overlay so text is prominent */
.gc-right .wp-block-post-template > li:nth-child(-n+2)::after{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(0,0,0,.60), rgba(0,0,0,.90));
}

/* Lift the text above the image+overlay and improve readability */
.gc-right .wp-block-post-template > li:nth-child(-n+2) .gc-meta-below,
.gc-right .wp-block-post-template > li:nth-child(-n+2) .wp-block-post-title,
.gc-right .wp-block-post-template > li:nth-child(-n+2) .wp-block-post-date{
  position: relative;
  z-index: 2;
  color: #fff;
  text-shadow: 0 2px 8px rgba(0,0,0,1.99);
}

/* Optional: set a sensible minimum height so the image/background has room */
.gc-right .wp-block-post-template > li:nth-child(-n+2){
  min-height: 140px;
}
@media (min-width: 980px){
  .gc-right .wp-block-post-template > li:nth-child(-n+2){ min-height: 170px; }
}
/* RIGHT column cards 1–2: keep them compact again */
.gc-right .wp-block-post-template > li:nth-child(-n+2){
  min-height: 0 !important;
  padding-top: clamp(10px, 1.2vw, 16px);
  padding-bottom: clamp(10px, 1.2vw, 16px);
}

/* Prevent long titles making the card tall */
.gc-right .wp-block-post-template > li:nth-child(-n+2) .wp-block-post-title{
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  max-height: calc(1.25em * 2);
  line-height: 1.25;
}

/* ============================================
   PER-SECTION Y CONTROLS (right column cards 1 & 2)
   - NEWS (posts)  → .gc-featured--news
   - VI (products) → .gc-featured--vi
   ============================================ */

/* ---------- NEWS (posts) ---------- */
.gc-featured--news{
  --news-y: 15%;
  --news-y-1: var(--news-y);
  --news-y-2: var(--news-y);
}

/* Card 1 */
.gc-featured--news .gc-right .wp-block-post-template > li:nth-child(1)
  .wp-block-post-featured-image img{
  width:100%; height:100%;
  object-fit: cover;
  object-position: 5% var(--news-y-1);
  display:block;
}

/* Card 2 */
.gc-featured--news .gc-right .wp-block-post-template > li:nth-child(2)
  .wp-block-post-featured-image img{
  width:100%; height:100%;
  object-fit: cover;
  object-position: 50% var(--news-y-2);
  display:block;
}


/* ---------- VI (products) ---------- */
.gc-featured--vi{
  --vi-y: 40%;
  --vi-y-1: var(--vi-y);
  --vi-y-2: var(--vi-y);
}

/* Card 1 — cover Woo product image in all common markups */
.gc-featured--vi .gc-right :is(.wp-block-post-template, ul.wc-block-grid__products, ul.products)
  > li:nth-child(1)
  :is(.wp-block-post-featured-image img,
      .wc-block-grid__product-image img,
      .woocommerce-LoopProduct-link img,
      img.wp-post-image){
  width:100%; height:100%;
  object-fit: cover;
  object-position: 50% var(--vi-y-1);
  display:block;
}

/* Card 2 */
.gc-featured--vi .gc-right :is(.wp-block-post-template, ul.wc-block-grid__products, ul.products)
  > li:nth-child(2)
  :is(.wp-block-post-featured-image img,
      .wc-block-grid__product-image img,
      .woocommerce-LoopProduct-link img,
      img.wp-post-image){
  width:100%; height:100%;
  object-fit: cover;
  object-position: 50% var(--vi-y-2);
  display:block;
}


/* ---------- Optional per-card utilities ---------- */
.gc-featured--news .y-top,
.gc-featured--vi   .y-top    { --y: 0%;   }
.gc-featured--news .y-20,
.gc-featured--vi   .y-20     { --y: 20%;  }
.gc-featured--news .y-30,
.gc-featured--vi   .y-30     { --y: 30%;  }
.gc-featured--news .y-40,
.gc-featured--vi   .y-40     { --y: 40%;  }
.gc-featured--news .y-center,
.gc-featured--vi   .y-center { --y: 50%;  }
.gc-featured--news .y-60,
.gc-featured--vi   .y-60     { --y: 60%;  }
.gc-featured--news .y-70,
.gc-featured--vi   .y-70     { --y: 70%;  }
.gc-featured--news .y-80,
.gc-featured--vi   .y-80     { --y: 80%;  }
.gc-featured--news .y-bottom,
.gc-featured--vi   .y-bottom { --y: 100%; }
/* ---------- VI (products) — add control for Card 3 ---------- */
.gc-featured--vi{
  --vi-y: 40%;
  --vi-y-1: var(--vi-y);
  --vi-y-2: var(--vi-y);
  --vi-y-3: var(--vi-y);
}

/* Card 3 — cover product image and allow per-card override via --y */
.gc-featured--vi .gc-right :is(.wp-block-post-template, ul.wc-block-grid__products, ul.products)
  > li:nth-child(3)
  :is(.wp-block-post-featured-image img,
      .wc-block-grid__product-image img,
      .woocommerce-LoopProduct-link img,
      img.wp-post-image){
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% var(--y, var(--vi-y-3));
  display: block;
}
/* ==========================================
   Force WHITE for bundled line-item prices ONLY
   (table body rows; leaves totals/subtotals alone)
   ========================================== */

/* Official WooCommerce Product Bundles: table body prices */
.single-product .bundle_form table.bundled_table tbody td .price,
.single-product .bundle_form table.bundled_table tbody td .price *,
.single-product .bundle_form table.bundled_table tbody td .woocommerce-Price-amount,
.single-product .bundle_form table.bundled_table tbody td .woocommerce-Price-amount bdi,
.single-product .bundle_form .bundled_products .bundled_table tbody td .price,
.single-product .bundle_form .bundled_products .bundled_table tbody td .woocommerce-Price-amount {
  color: #fff !important;
}

/* Generic safety for any tabular bundle layout */
.single-product .bundle_form table tbody td .price,
.single-product .bundle_form table tbody td .price a,
.single-product .bundle_form table tbody td .woocommerce-Price-amount,
.single-product .bundle_form table tbody td .woocommerce-Price-amount bdi {
  color: #fff !important;
}

/* WPClever Product Bundles (if that’s your plugin) */
.single-product .wpcpb-bundle .wpcpb-table tbody td .price,
.single-product .wpcpb-bundle .wpcpb-table tbody td .price *,
.single-product .wpcpb-bundle .wpcpb-table tbody td .woocommerce-Price-amount,
.single-product .wpcpb-bundle .wpcpb-table tbody td .woocommerce-Price-amount bdi {
  color: #fff !important;
}

/* Sale formats in row items: keep del muted but white-toned */
.single-product .bundle_form table.bundled_table tbody td .price del,
.single-product .bundle_form table.bundled_table tbody td .price del .amount,
.single-product .bundle_form table.bundled_table tbody td .price del .woocommerce-Price-amount {
  color: rgba(255,255,255,.65) !important;
}
.single-product .bundle_form table.bundled_table tbody td .price ins,
.single-product .bundle_form table.bundled_table tbody td .price ins .amount,
.single-product .bundle_form table.bundled_table tbody td .price ins .woocommerce-Price-amount {
  color: #fff !important;
}

/* DO NOT touch totals/subtotals/footer rows */
.single-product .bundle_form table.bundled_table tfoot .price,
.single-product .bundle_form table.bundled_table tfoot .woocommerce-Price-amount,
.single-product .wpcpb-bundle .wpcpb-table tfoot .price {
  color: inherit !important;
}
/* --- Tunables --- */
:root{
  --gd-hover-duration: 300ms;
  --gd-hover-scale: 1.05;
  --gd-radius: 12px;
}

/* Container */
.gd-hover-swap{
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: var(--gd-radius);
  isolation: isolate;
}

/* Base image styles */
.gd-hover-swap .gd-img{
  display: block;
  width: 100%;
  height: auto;
  pointer-events: none;
  user-select: none;
  transform-origin: center center;
  transition:
    opacity var(--gd-hover-duration) ease,
    transform var(--gd-hover-duration) ease,
    filter var(--gd-hover-duration) ease;
  will-change: opacity, transform;
}

/* Stack images */
.gd-hover-swap .gd-img.primary{ position: relative; z-index: 1; }
.gd-hover-swap .gd-img.secondary{
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  opacity: 0;
  z-index: 2;
}

/* Hover state: secondary fades in + grows slightly */
.gd-hover-swap:hover .gd-img.secondary{
  opacity: 1;
  transform: scale(var(--gd-hover-scale));
}

/* Optional: primary also grows a touch to add depth */
.gd-hover-swap:hover .gd-img.primary{
  transform: scale(calc(var(--gd-hover-scale) - 0.02));
  filter: brightness(0.95);
}

/* Respect users who prefer reduced motion */
@media (prefers-reduced-motion: reduce){
  .gd-hover-swap .gd-img{
    transition: opacity 150ms linear;
    transform: none !important;
  }
}
/* ==========================================================
   ENHANCED FADE TEXT WITH HEADING
   ========================================================== */

.fade-text .hover-content {
  position: absolute;
  left: 16px; right: 16px; bottom: 16px;
  padding: 14px 16px;
  z-index: 5;
  color: #fff;
  background: rgba(0, 0, 0, 0.35);
  backdrop-filter: blur(2px);
  border-radius: 10px;
  text-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
  opacity: 0;
  transform: translateY(12px);
  transition:
    opacity 0.8s ease 0.4s,
    transform 0.8s ease 0.4s;
  pointer-events: none;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.4;
  max-height: 60%;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to bottom,
                      rgba(0,0,0,1) 0%,
                      rgba(0,0,0,1) 85%,
                      rgba(0,0,0,0) 100%);
          mask-image: linear-gradient(to bottom,
                      rgba(0,0,0,1) 0%,
                      rgba(0,0,0,1) 85%,
                      rgba(0,0,0,0) 100%);
}

/* Hover in */
.fade-text:hover .hover-content {
  opacity: 1;
  transform: translateY(0);
}

/* Title / Heading styling */
.fade-text .hover-heading {
  font-family: "Wrong Time Wrong Place", serif;
  font-size: clamp(18px, 2vw, 26px);
  font-weight: 400;
  margin: 0 0 8px 0;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #d4af37;
  text-shadow:
    0 0 5px rgba(212,175,55,0.5),
    0 0 10px rgba(212,175,55,0.25);
}

/* Main text */
.fade-text .hover-text {
  font-family: "Optimus Princeps", serif;
  font-size: clamp(14px, 1.5vw, 18px);
  color: #f2f2f2;
  margin: 0;
}

/* Responsive tuning for mobile */
@media (max-width: 480px) {
  .fade-text .hover-content {
    left: 12px; right: 12px; bottom: 12px;
    padding: 10px 12px;
  }
  .fade-text .hover-heading {
    font-size: clamp(16px, 4vw, 22px);
  }
  .fade-text .hover-text {
    font-size: clamp(13px, 3.6vw, 16px);
  }
}
/* ================================
   MOBILE SCALING FOR HOVER TEXT
   ================================ */

.fade-text .hover-content {
  max-width: 52ch;
}
.fade-text .hover-heading {
  text-wrap: balance;
}

/* Tablet and down */
@media (max-width: 1024px){
  .fade-text .hover-content{
    left: 14px; right: 14px; bottom: 14px;
    padding: 12px 14px;
    max-height: 62%;
  }
  .fade-text .hover-heading{
    font-size: clamp(17px, 2.2vw, 24px);
  }
  .fade-text .hover-text{
    font-size: clamp(13px, 1.8vw, 18px);
    max-width: 46ch;
  }
}

/* Phones */
@media (max-width: 680px){
  .fade-text .hover-content{
    left: 12px; right: 12px; bottom: 12px;
    padding: 10px 12px;
    max-height: 66%;
    background: rgba(0,0,0,0.42);
    backdrop-filter: blur(3px);
  }
  .fade-text .hover-heading{
    font-size: clamp(16px, 4.6vw, 22px);
    line-height: 1.2;
  }
  .fade-text .hover-text{
    font-size: clamp(13px, 3.9vw, 17px);
    line-height: 1.38;
    max-width: 38ch;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    hyphens: auto;
  }
}

/* Small phones */
@media (max-width: 380px){
  .fade-text .hover-content{
    left: 10px; right: 10px; bottom: 10px;
    padding: 9px 10px;
    max-height: 70%;
  }
  .fade-text .hover-heading{
    font-size: clamp(15px, 5.2vw, 20px);
  }
  .fade-text .hover-text{
    font-size: clamp(12.5px, 4.4vw, 16px);
    max-width: 34ch;
  }
}

/* Optional: on touch devices (no hover), show text by default and shorten delay */
@media (hover: none){
  .fade-text .hover-content{
    opacity: 1;
    transform: none;
    transition: opacity .45s ease;
  }
}
/* =========================================================
   GDC — GLOBAL MOBILE / LAYOUT UTILITIES
   (use across ANY sale: Winter, Black Friday, whatever)
   ========================================================= */

/* ---------------------------------------------------------
   1) FULL-BLEED COVER / HERO
   Usage: add "gdc-fullbleed-cover" to a Cover block
   Result: removes theme rails, image spans full viewport
   --------------------------------------------------------- */

.gdc-fullbleed-cover,
.gdc-fullbleed-cover.wp-block-cover{
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  width: 100vw !important;
  max-width: 100vw !important;
  border-radius: 0 !important;
}

.gdc-fullbleed-cover .wp-block-cover__inner-container{
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* ---------------------------------------------------------
   2) TOP HERO BANNER — MOBILE SLIM VERSION
   Usage:
     - add "gdc-top-banner" to any hero Cover you want
       cropped & tightened on phones
   --------------------------------------------------------- */

@media (max-width: 680px){

  .gdc-top-banner{
    height: 180px !important;
    max-height: 180px !important;
    min-height: 0 !important;
    overflow: hidden !important;
    position: relative;
    padding: 0 !important;
    margin: 0 !important;
  }

  .gdc-top-banner img,
  .gdc-top-banner .wp-block-cover__image-background{
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    /* tweak this if you want the crop higher/lower */
    object-position: center 25% !important;
  }

  .gdc-top-banner .wp-block-cover__inner-container{
    padding: 10px 16px !important;
  }

  .gdc-top-banner h1,
  .gdc-top-banner h2,
  .gdc-top-banner h3,
  .gdc-top-banner p{
    margin: 4px 0 !important;
  }

  .gdc-top-banner .wp-block-buttons,
  .gdc-top-banner .wp-block-button{
    margin-top: 6px !important;
    margin-bottom: 0 !important;
  }
}

/* ---------------------------------------------------------
   3) MOBILE TIGHTENING — HERO BANNER + META BLOCKS
   Usage:
     - same "gdc-top-banner" class as above
     - for membership / info cards:
         card group  → class "gdc-membership-card"
         text group  → class "gdc-membership-meta"
   This reproduces the nice tight mobile stack you had.
   --------------------------------------------------------- */

@media (max-width: 680px){

  /* refine hero again for stacked layouts */
  .gdc-top-banner{
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow: visible !important;
    margin-top: 0 !important;
    margin-bottom: 8px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .gdc-top-banner .wp-block-cover__inner-container{
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .gdc-top-banner img,
  .gdc-top-banner .wp-block-cover__image-background{
    width: 100% !important;
    height: auto !important;
    max-height: 180px !important;
    object-fit: cover !important;
    object-position: center 25% !important;
  }

  .gdc-top-banner .wp-block-image{
    margin-top: 0 !important;
    margin-bottom: 4px !important;
  }

  .gdc-top-banner .wp-block-spacer:first-child{
    height: 16px !important;
  }

  .gdc-top-banner .wp-block-spacer:not(:first-child){
    height: 0 !important;
  }

  .gdc-top-banner .wp-block-buttons,
  .gdc-top-banner .wp-block-button{
    margin-top: 0 !important;
    margin-bottom: 6px !important;
  }

  .gdc-top-banner .wp-block-button .wp-block-button__link{
    margin: 0 !important;
  }

  /* MEMBERSHIP / PRODUCT CARD + META STACK
     card = image/tarot
     meta = text block underneath
  */

  .gdc-membership-card{
    margin-bottom: 12px !important;
  }

  .gdc-membership-card + .gdc-membership-meta{
    margin-top: 6px !important;
    margin-bottom: 24px !important;
    padding: 0 !important;
  }

  .gdc-membership-card + .gdc-membership-meta h2,
  .gdc-membership-card + .gdc-membership-meta h3,
  .gdc-membership-card + .gdc-membership-meta p{
    margin-top: 4px !important;
    margin-bottom: 4px !important;
  }

  .gdc-membership-card + .gdc-membership-meta ul{
    margin-top: 6px !important;
    margin-bottom: 10px !important;
  }

  .gdc-membership-card + .gdc-membership-meta .wp-block-buttons,
  .gdc-membership-card + .gdc-membership-meta .wp-block-button{
    margin-top: 8px !important;
    margin-bottom: 4px !important;
  }
}

/* ================================
   LEARN GRIMDARK – HERO BANNER
   ================================ */

/* Wrapper */
.lg-hero-banner {
  display: block;
  max-width: 900px;        /* adjust size */
  margin: 0 auto 40px;
  text-decoration: none;
  color: #fff;
  text-align: center;
}

/* --- IMAGE SWAP AREA --- */
.lg-hero-art {
  position: relative;
  width: 100%;
  display: block;
}

/* Base styles for both PNGs */
.lg-img {
  width: 100%;
  height: auto;
  display: block;
  transition: opacity 0.35s ease-in-out;
}

/* Image A (default) */
.lg-img.primary {
  position: relative;
  z-index: 1;
  opacity: 1;
}

/* Image B (hover) */
.lg-img.secondary {
  position: absolute;
  inset: 0;
  z-index: 2;
  opacity: 0;
}

/* Swap on hover */
.lg-hero-banner:hover .lg-img.primary {
  opacity: 0;
}
.lg-hero-banner:hover .lg-img.secondary {
  opacity: 1;
}

/* --- TEXT METADATA AREA --- */
.lg-hero-meta {
  margin-top: 16px;
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 0.35s ease, transform 0.35s ease;
  pointer-events: none;
}

/* Reveal text on hover */
.lg-hero-banner:hover .lg-hero-meta {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

/* Title */
.lg-hero-title {
  font-family: var(--gdc-h1-font);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: clamp(22px, 3vw, 34px);
  color: rgba(255,255,255,0.92);
  text-shadow:
    0 2px 6px rgba(0,0,0,0.85),
    0 0 8px rgba(0,0,0,0.75);
}

/* Flavor text */
.lg-hero-flavour {
  font-family: var(--gdc-h1-font);
  font-size: clamp(14px, 1.8vw, 18px);
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.85);
  margin-top: 6px;
}

/* BUY NOW button text */
.lg-hero-buy {
  margin-top: 12px;
  font-family: var(--gdc-h2-font);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-size: clamp(18px, 2vw, 24px);
  color: #f7f2e8;
  text-shadow:
    0 2px 6px rgba(0,0,0,0.85),
    0 0 8px rgba(0,0,0,0.75);
  transition: text-shadow 0.25s ease, color 0.25s ease;
}

/* BUY NOW glow ALWAYS on hover */
.lg-hero-banner:hover .lg-hero-buy {
  text-shadow:
    0 0 10px rgba(255,225,150,1),
    0 0 22px rgba(195,174,130,1),
    0 0 40px rgba(195,174,130,0.85);
  color: #fffdf5;
}
/* =========================================================
   WINTER SALE 2025 — GLOBAL WRAPPER
   ========================================================= */

#winter-sale-2025{
  background-color: #050305;
  color: #f5f1e6;
}

#winter-sale-2025 img{
  max-width: 100%;
  height: auto;
  display: block;
}

/* =========================================================
   WINTER SALE — DESKTOP HERO BANNER
   ========================================================= */

.ws-hero-banner{
  display: block;
  max-width: 1200px;
  margin: 0 auto 40px;
  cursor: pointer;
  padding: 0 var(--rail);
  color: #fff;
  text-decoration: none;
}

/* HERO ART — BOX + BORDER + EMERALD GLOW */
.ws-hero-art{
  position: relative;
  border-radius: 20px;
  overflow: hidden;

  border: 1px solid rgba(255,255,255,0.25);
  background: rgba(0,0,0,0.50);

  box-shadow:
    0 0 22px rgba(31, 71, 54, 0.55),
    0 0 38px rgba(13, 59, 46, 0.45);

  transition:
    border-color 0.25s ease,
    box-shadow 0.25s ease;
}

.ws-hero-swap{
  position: relative;
}

.ws-hero-img{
  width: 100%;
  display: block;
}

.ws-hero-img.primary{
  z-index: 1;
  opacity: 1;
  position: relative;
  transition: opacity 0.35s ease-in-out;
}

.ws-hero-img.secondary{
  z-index: 2;
  opacity: 0;
  position: absolute;
  inset: 0;
  object-fit: cover;
  transition: opacity 0.35s ease-in-out;
}

.ws-hero-banner:hover .ws-hero-art{
  border-color: #c3ae82;
  box-shadow:
    0 0 26px rgba(31, 71, 54, 0.72),
    0 0 50px rgba(13, 59, 46, 0.60),
    0 0 12px rgba(58, 161, 123, 0.55),
    0 0 0 2px rgba(195,174,130,0.85);
}

.ws-hero-banner:hover .ws-hero-img.primary{
  opacity: 0;
}

.ws-hero-banner:hover .ws-hero-img.secondary{
  opacity: 1;
}

/* =========================================================
   HERO META TEXT / BUY NOW
   ========================================================= */

.ws-hero-meta{
  margin-top: 18px;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.ws-hero-meta *,
.ws-hero-meta *:hover,
.ws-hero-meta *:focus,
.ws-hero-meta *:active{
  text-decoration: none !important;
  outline: none !important;
  box-shadow: none !important;
}

.ws-hero-title,
.ws-hero-flavour,
.ws-hero-buy{
  text-shadow:
    0 2px 6px rgba(0,0,0,0.85),
    0 0 8px rgba(0,0,0,0.75);
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 0.45s ease, transform 0.45s ease;
}

.ws-hero-title{
  font-family: var(--gdc-h1-font);
  text-transform: uppercase;
  font-size: clamp(18px, 2.3vw, 26px);
  letter-spacing: 0.16em;
  color: rgba(255,255,255,0.92);
  transition-delay: 0.10s;
}

.ws-hero-flavour{
  font-family: var(--gdc-h1-font);
  font-size: clamp(13px, 1.5vw, 16px);
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.85);
  transition-delay: 0.22s;
}

/* BUY NOW – Living Hell, no forced ALL CAPS */
.ws-hero-buy{
  font-family: var(--gdc-h2-font);
  text-transform: none;
  letter-spacing: 0.18em;
  font-size: clamp(22px, 2.6vw, 32px);
  color: #f5f1e6;
  margin-top: 8px;
  display: inline-block;

  transition:
    opacity 0.45s ease 0.32s,
    transform 0.45s ease 0.32s,
    text-shadow 0.20s ease,
    color 0.20s ease;
}

.ws-hero-banner:hover .ws-hero-title,
.ws-hero-banner:hover .ws-hero-flavour,
.ws-hero-banner:hover .ws-hero-buy{
  opacity: 1;
  transform: translateY(0);
}

.ws-hero-buy:hover{
  text-shadow:
    0 0 10px rgba(255, 240, 200, 0.95),
    0 0 20px rgba(195,174,130,1),
    0 0 34px rgba(195,174,130,0.98),
    0 0 52px rgba(195,174,130,0.95);
  color: #fffdf3;
  cursor: pointer;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .ws-hero-title,
  .ws-hero-flavour,
  .ws-hero-buy{
    transition: opacity 0.25s linear !important;
    transform: none !important;
  }

  .ws-hero-img.primary,
  .ws-hero-img.secondary{
    transition: opacity 0.25s linear !important;
  }
}

/* =========================================================
   WINTER PACKS — CARD
   ========================================================= */

.ws-pack-card{
  --ws-hover-scale: 1.03;

  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  color: #fff;
  text-decoration: none;

  background-color: #000;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.25);

  box-shadow:
    0 0 18px rgba(31, 71, 54, 0.55),
    0 0 30px rgba(13, 59, 46, 0.45);

  transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

/* No random underlines */
.ws-pack-card *,
.ws-pack-card *:hover,
.ws-pack-card *:focus,
.ws-pack-card *:active{
  text-decoration: none !important;
  outline: none !important;
}

/* Media area with fixed 5:4 aspect ratio */
.ws-pack-media{
  position: relative;
  width: 100%;
  overflow: hidden;
}

/* Maintain 5:4 ratio (height = 80% of width) */
.ws-pack-media::before{
  content: "";
  display: block;
  padding-bottom: 80%; /* 5:4 */
}

/* Images A/B */
.ws-pack-img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition:
    opacity 0.35s ease-in-out,
    transform 0.20s ease;
}

.ws-pack-img.primary{
  z-index: 1;
  opacity: 1;
}

.ws-pack-img.secondary{
  z-index: 2;
  opacity: 0;
}

/* Hover frame + glow */
.ws-pack-card:hover{
  border-color: #c3ae82;
  box-shadow:
    0 0 22px rgba(31, 71, 54, 0.72),
    0 0 38px rgba(13, 59, 46, 0.60),
    0 0 0 2px rgba(195,174,130,0.85);
}

/* Image swap */
.ws-pack-card:hover .ws-pack-img.primary{
  opacity: 0;
  transform: scale(1.01);
}

.ws-pack-card:hover .ws-pack-img.secondary{
  opacity: 1;
  transform: scale(var(--ws-hover-scale));
}

/* =========================================================
   WINTER PACKS — OVERLAY META
   (TITLE → BUY NOW → PRICE → FLAVOUR)
   ========================================================= */

.ws-pack-overlay{
  position: absolute;
  inset: 0;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  padding: 1.75rem 1.5rem 1.9rem;
  text-align: center;

  background: linear-gradient(
    to top,
    rgba(0,0,0,0.55) 0%,
    rgba(0,0,0,0.25) 30%,
    transparent 70%
  );

  opacity: 0;
  transform: translateY(10px);
  pointer-events: auto;
  transition: opacity 0.45s ease, transform 0.45s ease;
}

.ws-pack-card:hover .ws-pack-overlay{
  opacity: 1;
  transform: translateY(0);
}

/* Shared text shadow + motion base */
.ws-pack-label,
.ws-pack-cta,
.ws-pack-name,
.ws-pack-meta{
  text-shadow:
    0 2px 6px rgba(0,0,0,0.85),
    0 0 8px rgba(0,0,0,0.8);
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 0.40s ease, transform 0.40s ease;
}

/* TITLE */
.ws-pack-label{
  font-family: var(--gdc-h1-font);
  text-transform: uppercase;
  letter-spacing: 0.16em;
  font-size: clamp(14px, 1.4vw, 16px);
  color: rgba(245,241,230,0.92);
  margin-bottom: 4px;
  transition-delay: 0.10s;
}

/* BUY NOW — Living Hell, no all caps */
.ws-pack-cta{
  font-family: var(--gdc-h2-font);
  text-transform: none;
  letter-spacing: 0.20em;
  font-size: clamp(24px, 2.5vw, 34px);
  color: #f5f1e6;
  margin-bottom: 6px;
  cursor: pointer;
  transition:
    opacity 0.40s ease 0.18s,
    transform 0.40s ease 0.18s,
    color 0.20s ease,
    text-shadow 0.20s ease;
}

/* PRICE */
.ws-pack-name{
  font-family: var(--gdc-h1-font);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: clamp(16px, 1.9vw, 22px);
  color: #ffecc0;
  margin-bottom: 6px;
  transition-delay: 0.26s;
}

/* FLAVOUR TEXT */
.ws-pack-meta{
  font-family: var(--gdc-h1-font);
  text-transform: lowercase;
  letter-spacing: 0.10em;
  font-size: clamp(13px, 1.4vw, 17px);
  color: rgba(245,241,230,0.90);
  max-width: 90%;
  transition-delay: 0.34s;
}

/* Reveal sequence on hover */
.ws-pack-card:hover .ws-pack-label,
.ws-pack-card:hover .ws-pack-cta,
.ws-pack-card:hover .ws-pack-name,
.ws-pack-card:hover .ws-pack-meta{
  opacity: 1;
  transform: translateY(0);
}

/* Emphasise BUY NOW on hover */
.ws-pack-cta:hover{
  color: #fffdf3;
  text-shadow:
    0 0 12px rgba(255, 240, 200, 1),
    0 0 24px rgba(195,174,130,1),
    0 0 42px rgba(195,174,130,0.95);
}

/* ============================================
   WINTER PACKS — RESPONSIVE LAYOUT (1700px)
   ============================================ */

.ws-packs{
  max-width: 1700px;
  margin: 0 auto 70px;
  padding: 0 40px;
}

.ws-packs .wp-block-columns{
  display: flex;
  justify-content: center;
  align-items: stretch;
  gap: 50px;
}

.ws-packs .wp-block-column{
  flex: 0 0 50%;
  max-width: 50%;
}

/* Remove extra margin inside columns, if any */
.ws-packs .wp-block-column > .wp-block-group,
.ws-packs .wp-block-column > .wp-block-custom-html{
  margin: 0 !important;
}

/* Tablet breakpoint */
@media (max-width: 1024px){
  .ws-packs{
    max-width: 100%;
    padding: 0 20px;
  }
  .ws-packs .wp-block-columns{
    flex-direction: column;
    gap: 35px;
  }
  .ws-packs .wp-block-column{
    flex: 0 0 100%;
    max-width: 100%;
  }
}

/* Mobile breakpoint */
@media (max-width: 768px){
  .ws-packs{
    padding: 0 10px;
  }
}

/* =========================================================
   WINTER BUNDLES — 3-CARD ROW LAYOUT
   ========================================================= */

.wb-bundles{
  max-width: 1700px;
  margin: 0 auto 80px;
  padding: 0 40px;
}

.wb-bundles .wp-block-columns{
  display: flex;
  justify-content: center;
  align-items: stretch;
  gap: 40px;
}

.wb-bundles .wp-block-column{
  flex: 0 0 33.333%;
  max-width: 33.333%;
}

/* Remove any theme margins inside the columns */
.wb-bundles .wp-block-column > .wp-block-group,
.wb-bundles .wp-block-column > .wp-block-custom-html{
  margin: 0 !important;
}

/* Tablet: 2 across */
@media (max-width: 1100px){
  .wb-bundles .wp-block-columns{
    flex-wrap: wrap;
    justify-content: center;
  }
  .wb-bundles .wp-block-column{
    flex: 0 0 48%;
    max-width: 48%;
  }
}

/* Mobile: 1 per row */
@media (max-width: 768px){
  .wb-bundles{
    padding: 0 16px;
  }
  .wb-bundles .wp-block-column{
    flex: 0 0 100%;
    max-width: 100%;
  }
}

/* =========================================================
   WINTER BUNDLES — GENERIC CARD FRAME (4:5)
   (use "wb-card-frame" on static bundle images AND slider)
   ========================================================= */

.wb-card-frame{
  position: relative;
  display: block;
  width: 100%;
  max-width: 495px;
  margin-left: auto;
  margin-right: auto;

  background-color: #000;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,0.25);

  /* EMERALD GLOW (same family as hero/packs/stocking) */
  box-shadow:
    0 0 18px rgba(31, 71, 54, 0.55),
    0 0 30px rgba(13, 59, 46, 0.45);

  transition: border-color 0.25s ease, box-shadow 0.25s ease;
  overflow: hidden;
}

/* STATIC CARDS (Learn / Master):
   enforce a clean 4:5 box on the element that has wb-card-frame */
.wb-card-frame:not(.wb-slider){
  aspect-ratio: 4 / 5;
}

/* Images inside any bundle frame (static or slider) */
.wb-card-frame img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.20s ease;
}

/* Hover: emerald glow + slight zoom for static cards */
.wb-card-frame:hover{
  border-color: #c3ae82;
  box-shadow:
    0 0 22px rgba(31, 71, 54, 0.72),
    0 0 38px rgba(13, 59, 46, 0.60),
    0 0 0 2px rgba(195,174,130,0.85);
}

.wb-card-frame:not(.wb-slider):hover img{
  transform: scale(1.03);
}

/* =========================================================
   WINTER BUNDLES — SLIDER (5 ITEMS, 4:5 ASPECT)
   ========================================================= */

.wb-slider{
  position: relative;
  width: 100%;
  max-width: 495px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 34px;               /* space for dots underneath */
}

/* Usually used as: class="wb-slider wb-card-frame" */
.wb-slider.wb-card-frame{
  overflow: visible;                 /* allow arrows + dots outside */
}

/* Hide radios (logic only) */
.wb-slide-radio{
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

/* Slides wrapper */
.wb-slider-frame{
  position: relative;
  overflow: hidden;
  border-radius: 18px;
  aspect-ratio: 4 / 5;
}

/* Individual slides */
.wb-slide{
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.40s ease;
}

.wb-slide img{
  transform-origin: center center;
}

/* Active slide based on which radio is checked */
#wb-bundle-1:checked ~ .wb-slider-frame .wb-slide:nth-child(1),
#wb-bundle-2:checked ~ .wb-slider-frame .wb-slide:nth-child(2),
#wb-bundle-3:checked ~ .wb-slider-frame .wb-slide:nth-child(3),
#wb-bundle-4:checked ~ .wb-slider-frame .wb-slide:nth-child(4),
#wb-bundle-5:checked ~ .wb-slider-frame .wb-slide:nth-child(5){
  opacity: 1;
  pointer-events: auto;
}

/* Hover zoom for current slide */
.wb-slider-frame:hover .wb-slide img{
  transform: scale(1.03);
}

/* =========================================================
   SLIDER ARROWS
   ========================================================= */

.wb-arrows{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
}

.wb-arrows-prev{ left: -32px; }
.wb-arrows-next{ right: -32px; }

.wb-arrow{
  display: none;
  pointer-events: auto;
  width: 64px;
  height: 64px;
  cursor: pointer;
  filter: drop-shadow(0 0 6px rgba(195,174,130,0.7));
  transform-origin: center center;
  animation: wbArrowPulse 2.1s ease-in-out infinite;
}

.wb-arrow img{
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* Pulse animation */
@keyframes wbArrowPulse{
  0%   { transform: scale(1); }
  50%  { transform: scale(1.08); }
  100% { transform: scale(1); }
}

/* On hover: stop pulsing and give a stronger pop */
.wb-arrow:hover,
.wb-arrow:active,
.wb-arrow:focus-visible{
  animation: none;
  transform: scale(1.10);
  filter: drop-shadow(0 0 10px rgba(195,174,130,1));
}

/* Show the correct left arrow for the active slide */
#wb-bundle-1:checked ~ .wb-arrows-prev .wb-arrow-prev-1,
#wb-bundle-2:checked ~ .wb-arrows-prev .wb-arrow-prev-2,
#wb-bundle-3:checked ~ .wb-arrows-prev .wb-arrow-prev-3,
#wb-bundle-4:checked ~ .wb-arrows-prev .wb-arrow-prev-4,
#wb-bundle-5:checked ~ .wb-arrows-prev .wb-arrow-prev-5{
  display: block;
}

/* Show the correct right arrow for the active slide */
#wb-bundle-1:checked ~ .wb-arrows-next .wb-arrow-next-1,
#wb-bundle-2:checked ~ .wb-arrows-next .wb-arrow-next-2,
#wb-bundle-3:checked ~ .wb-arrows-next .wb-arrow-next-3,
#wb-bundle-4:checked ~ .wb-arrows-next .wb-arrow-next-4,
#wb-bundle-5:checked ~ .wb-arrows-next .wb-arrow-next-5{
  display: block;
}

/* =========================================================
   SLIDER DOTS (BELOW THE CARD)
   ========================================================= */

.wb-dots{
  position: absolute;
  left: 50%;
  bottom: -22px;
  transform: translateX(-50%);
  margin-top: 0;
  display: flex;
  justify-content: center;
  gap: 6px;
}

.wb-dot{
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: rgba(255,255,255,0.28);
  cursor: pointer;
  transition:
    transform 0.25s ease,
    background-color 0.25s ease,
    box-shadow 0.25s ease,
    width 0.25s ease;
}

/* Active dot */
#wb-bundle-1:checked ~ .wb-dots .wb-dot-1,
#wb-bundle-2:checked ~ .wb-dots .wb-dot-2,
#wb-bundle-3:checked ~ .wb-dots .wb-dot-3,
#wb-bundle-4:checked ~ .wb-dots .wb-dot-4,
#wb-bundle-5:checked ~ .wb-dots .wb-dot-5{
  width: 18px;
  background: #c3ae82;
  box-shadow: 0 0 10px rgba(195,174,130,0.9);
  transform: translateY(-1px);
}

/* =========================================================
   SLIDER — RESPONSIVE TWEAKS
   ========================================================= */

@media (max-width: 780px){
  .wb-slider.wb-card-frame{
    max-width: 360px;
    width: 88vw;
  }
  .wb-arrows-prev{ left: -20px; }
  .wb-arrows-next{ right: -20px; }
}

/* =========================================================
   STOCKING STUFFERS — HORIZONTAL BANNER CARD
   (image A → image B + right-side overlay on hover)
   ========================================================= */

.ss-banner{
  max-width: 1200px;
  margin: 0 auto 70px;
  padding: 0 var(--rail);
}

/* Outer card */
.ss-card{
  position: relative;
  display: block;
  width: 100%;
  color: #fff;
  text-decoration: none;

  border-radius: 20px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.25);
  background: rgba(0,0,0,0.50);

  box-shadow:
    0 0 18px rgba(31, 71, 54, 0.55),
    0 0 30px rgba(13, 59, 46, 0.45);

  transition:
    border-color 0.25s ease,
    box-shadow 0.25s ease;
}

/* no random underlines */
.ss-card *,
.ss-card *:hover,
.ss-card *:focus,
.ss-card *:active{
  text-decoration: none !important;
  outline: none !important;
}

/* MEDIA: 1920×300-like aspect */
.ss-media{
  position: relative;
  width: 100%;
  overflow: hidden;
}

.ss-media::before{
  content: "";
  display: block;
  padding-bottom: 15.625%;   /* 300 / 1920 * 100 */
}

/* Both images are absolutely positioned over that box */
.ss-img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition:
    opacity 0.35s ease-in-out,
    transform 0.25s ease;
}

.ss-img.primary{
  z-index: 1;
  opacity: 1;
}

.ss-img.secondary{
  z-index: 2;
  opacity: 0;
}

/* OVERLAY: right side, inside image */

.ss-overlay{
  position: absolute;
  inset: 0;
  z-index: 3;

  display: flex;
  justify-content: flex-end;
  align-items: center;

  padding: 0 clamp(26px, 4vw, 40px);

  background: linear-gradient(
    to left,
    rgba(0,0,0,0.92) 0%,
    rgba(0,0,0,0.70) 25%,
    rgba(0,0,0,0.35) 45%,
    transparent 70%
  );

  opacity: 0;
  transform: translateX(14px);
  pointer-events: none;
  transition:
    opacity 0.45s ease,
    transform 0.45s ease;
}

/* Inner text block, anchored right, internally centered */
.ss-overlay-inner{
  max-width: 480px;
  margin-left: auto;
  margin-right: 0;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

/* Title — Living Hell */
.ss-title{
  font-family: var(--gdc-h2-font);
  font-weight: 400;
  text-transform: none;
  font-size: clamp(22px, 2.7vw, 30px);
  letter-spacing: 0.04em;
  color: #f5f1e6;
  text-shadow:
    0 2px 6px rgba(0,0,0,0.85),
    0 0 8px rgba(0,0,0,0.75);
}

/* Flavour text */
.ss-flavour{
  font-family: var(--gdc-h1-font);
  text-transform: lowercase;
  font-size: clamp(14px, 1.6vw, 18px);
  letter-spacing: 0.08em;
  line-height: 1.45;
  color: rgba(245,241,230,0.92);
}

/* CTA + price row */
.ss-meta{
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  align-items: baseline;
  justify-content: center;
  margin-top: 6px;
}

/* Add to cart — Optimus Princeps */
.ss-cta{
  font-family: var(--gdc-h1-font);
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-size: clamp(17px, 1.9vw, 21px);
  color: #f5f1e6;
  cursor: pointer;
  text-shadow:
    0 2px 6px rgba(0,0,0,0.85),
    0 0 8px rgba(0,0,0,0.75);
  transition:
    color 0.20s ease,
    text-shadow 0.20s ease,
    transform 0.20s ease;
  pointer-events: auto;
}

/* Price */
.ss-price{
  font-family: var(--gdc-h1-font);
  text-transform: lowercase;
  font-size: clamp(19px, 2.1vw, 23px);
  letter-spacing: 0.10em;
  color: #ffecc0;
  text-shadow:
    0 2px 6px rgba(0,0,0,0.85),
    0 0 8px rgba(0,0,0,0.75);
}

/* HOVER BEHAVIOUR */

.ss-card:hover{
  border-color: #c3ae82;
  box-shadow:
    0 0 22px rgba(31, 71, 54, 0.72),
    0 0 38px rgba(13, 59, 46, 0.60),
    0 0 0 2px rgba(195,174,130,0.85);
}

.ss-card:hover .ss-img.primary{
  opacity: 0;
  transform: scale(1.01);
  filter: brightness(0.95);
}

.ss-card:hover .ss-img.secondary{
  opacity: 1;
  transform: scale(1.03);
}

.ss-card:hover .ss-overlay{
  opacity: 1;
  transform: translateX(0);
}

/* CTA glow when hovered directly */
.ss-card .ss-cta:hover{
  color: #fffdf3 !important;
  text-shadow:
    0 0 10px rgba(255,240,200,1),
    0 0 20px rgba(195,174,130,1),
    0 0 36px rgba(195,174,130,0.95),
    0 0 52px rgba(195,174,130,0.85) !important;
  transform: translateY(-1px);
}

/* RESPONSIVE TWEAKS */

@media (max-width: 768px){
  .ss-banner{
    padding: 0 16px;
  }
  .ss-overlay-inner{
    max-width: 100%;
  }
  .ss-overlay{
    padding: 0 18px;
    background: linear-gradient(
      to left,
      rgba(0,0,0,0.92) 0%,
      rgba(0,0,0,0.80) 35%,
      rgba(0,0,0,0.40) 65%,
      transparent 90%
    );
  }
}
/* =========================================================
   WINTER PACKS — "What's inside" details + 5:4 card
   ========================================================= */

/* 5:4 card inside the details (keeps your existing glow/border) */
.wb-card-frame.ws-inside-card:not(.wb-slider){
  aspect-ratio: 5 / 4 !important;    /* override the generic 4:5 */
}

.wb-card-frame.ws-inside-card img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Generic details wrapper on desktop / large screens */
.ws-pack-details{
  margin: 10px 0 14px;
  font-family: var(--gdc-h1-font);   /* Optimus Princeps */
}

/* Summary line (the clickable "What's inside...") */
.ws-pack-details > summary{
  list-style: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 0;

  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-size: 0.9rem;

  color: #c3ae82;
  text-shadow:
    0 2px 6px rgba(0,0,0,0.85),
    0 0 8px rgba(0,0,0,0.75);

  transition:
    color 0.25s ease,
    text-shadow 0.25s ease;
}

/* Hide native disclosure triangle in WebKit */
.ws-pack-details > summary::-webkit-details-marker{
  display: none;
}

/* Custom little arrow */
.ws-pack-details > summary::before{
  content: "▼";
  font-size: 0.8em;
  transform-origin: center;
  transition: transform 0.25s ease;
}

/* Hover state */
.ws-pack-details > summary:hover{
  color: #ffecc0;
  text-shadow:
    0 0 10px rgba(255,240,200,0.95),
    0 0 20px rgba(195,174,130,1);
}

/* Open state: rotate arrow up */
.ws-pack-details[open] > summary::before{
  transform: rotate(180deg);
}

/* Inner text (desktop): Optimus, tighter, tidy */
.ws-pack-details p,
.ws-pack-details ul,
.ws-pack-details li{
  font-family: var(--gdc-h1-font);     /* Optimus Princeps */
  text-transform: none;
  font-size: 0.92rem;
  line-height: 1.55;
}

.ws-pack-details p{
  margin: 8px 0 10px;
}

.ws-pack-details ul{
  padding-left: 1.1em;
  margin: 6px 0 10px;
}

.ws-pack-details li{
  margin-bottom: 3px;
}



/* =========================================================
   WINTER PACKS — MOBILE "LEARN MORE" DETAILS
   Smooth open/close animation
   ========================================================= */

@media (max-width: 768px){

  /* Details wrapper */
  #winter-sale-2025 details.ws-mobile-details{
    margin: 16px auto 8px;
    max-width: 480px;
    border: none;
    color: #f5f1e6;
    font-family: var(--gdc-h1-font);    /* Optimus Princeps body */
  }

  /* SUMMARY (clickable row) */
  #winter-sale-2025 details.ws-mobile-details > summary{
    list-style: none;
    font-family: var(--gdc-h1-font);    /* Optimus Princeps */
    text-transform: uppercase;
    letter-spacing: 0.18em;
    font-size: 13px;
    color: #c3ae82;
    cursor: pointer;
    position: relative;
    padding: 6px 0 4px 18px;            /* left space for caret */
  }

  /* Hide native ▸ marker */
  #winter-sale-2025 details.ws-mobile-details > summary::-webkit-details-marker{
    display: none;
  }
  #winter-sale-2025 details.ws-mobile-details > summary::marker{
    content: "";
  }

  /* Custom caret */
  #winter-sale-2025 details.ws-mobile-details > summary::before{
    content: "▼";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    font-size: 11px;
    color: #c3ae82;
    transition: transform 0.25s ease;
  }

  /* Rotate caret when open */
  #winter-sale-2025 details.ws-mobile-details[open] > summary::before{
    transform: translateY(-50%) rotate(180deg);
  }

  /* SUMMARY hover / focus glow */
  #winter-sale-2025 details.ws-mobile-details > summary:hover{
    color: #fffdf3;
    text-shadow:
      0 0 8px rgba(195,174,130,0.9),
      0 0 14px rgba(195,174,130,0.8);
  }

  /* INNER BODY: animated height + fade */
  #winter-sale-2025 .ws-mobile-details-body{
    max-width: 480px;
    margin: 0 auto;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transform: translateY(-6px);
    transition:
      max-height 0.45s ease,
      opacity 0.35s ease,
      transform 0.35s ease;
  }

  /* Typographic cleanup inside the mobile body */
  #winter-sale-2025 .ws-mobile-details-body p,
  #winter-sale-2025 .ws-mobile-details-body ul,
  #winter-sale-2025 .ws-mobile-details-body li{
    font-family: var(--gdc-h1-font);    /* Optimus Princeps */
    text-transform: none;
    font-size: 14px;
    line-height: 1.55;
  }

  #winter-sale-2025 .ws-mobile-details-body p{
    margin: 8px 0 10px;
  }

  #winter-sale-2025 .ws-mobile-details-body ul{
    padding-left: 1.2em;
    margin: 6px 0 10px;
  }

  #winter-sale-2025 .ws-mobile-details-body li{
    margin-bottom: 3px;
  }

  /* When details is open → reveal smoothly */
  #winter-sale-2025 details.ws-mobile-details[open] .ws-mobile-details-body{
    max-height: 2000px;     /* large enough cap */
    opacity: 1;
    transform: translateY(0);
  }
}
/* =========================================================
   WINTER PACKS — top description paragraph (Optimus)
   ========================================================= */

#winter-sale-2025 .ws-pack-copy{
  font-family: var(--gdc-h1-font);   /* Optimus Princeps */
  text-transform: none;
  font-size: 14px;
  line-height: 1.6;
  letter-spacing: 0.03em;
  margin: 12px 0 10px;
}
/* =========================================================
   WINTER PACKS — top description paragraph (Optimus)
   ========================================================= */

/* If the class is on the paragraph itself */
p.ws-pack-copy{
  font-family: var(--gdc-h1-font) !important;  /* Optimus Princeps */
  text-transform: none;
  font-size: 14px;
  line-height: 1.6;
  letter-spacing: 0.03em;
  margin: 12px 0 10px;
}

/* If the class is on a wrapper that contains the paragraph */
.ws-pack-copy p{
  font-family: var(--gdc-h1-font) !important;
  text-transform: none;
  font-size: 14px;
  line-height: 1.6;
  letter-spacing: 0.03em;
  margin: 12px 0 10px;
}
/* =========================================================
   WINTER PACKS — MOBILE PRICE + BUTTON SKIN
   (matches the desktop gold / Living Hell vibe)
   ========================================================= */

/* Price under the card (mobile layout only, via class) */
#winter-sale-2025 .ws-pack-mobile-price{
  font-family: var(--gdc-h1-font);        /* Optimus Princeps */
  font-size: clamp(20px, 2.4vw, 24px);
  line-height: 1.2;
  text-align: center;
  margin: 18px 0 10px;

  color: #ffecc0;
  text-transform: none;
  letter-spacing: 0.10em;

  text-shadow:
    0 2px 6px rgba(0,0,0,0.85),
    0 0 8px rgba(0,0,0,0.75);
}

/* Button wrapper + link (Gutenberg: class goes on .wp-block-button) */
#winter-sale-2025 .ws-pack-mobile-btn{
  text-align: center;
}

#winter-sale-2025 .ws-pack-mobile-btn .wp-block-button__link,
#winter-sale-2025 a.ws-pack-mobile-btn{
  display: inline-block;
  font-family: var(--gdc-h2-font);        /* Living Hell */
  text-transform: none;
  letter-spacing: 0.18em;
  font-size: clamp(15px, 1.9vw, 18px);

  padding: 0.9em 2.8em;
  border-radius: 999px;

  background: radial-gradient(circle at 50% 0,
              #f4493b 0%,
              #c22828 45%,
              #731114 100%);
  color: #fdf5ec;
  border: 1px solid rgba(0,0,0,0.7);

  box-shadow:
    0 6px 14px rgba(0,0,0,0.85),
    0 0 16px rgba(124,17,17,0.6);

  text-decoration: none !important;
  transition:
    background 0.22s ease,
    box-shadow 0.22s ease,
    transform 0.18s ease,
    color 0.18s ease;
}

/* Hover / focus: brighter, slight lift, subtle gold glow */
#winter-sale-2025 .ws-pack-mobile-btn .wp-block-button__link:hover,
#winter-sale-2025 .ws-pack-mobile-btn .wp-block-button__link:focus-visible,
#winter-sale-2025 a.ws-pack-mobile-btn:hover,
#winter-sale-2025 a.ws-pack-mobile-btn:focus-visible{
  background: radial-gradient(circle at 50% 0,
              #ff5a4a 0%,
              #d73434 45%,
              #86171b 100%);
  color: #fffdf3;
  transform: translateY(-1px);

  box-shadow:
    0 8px 18px rgba(0,0,0,0.9),
    0 0 20px rgba(195,174,130,0.75);
}

/* Small tap feedback */
#winter-sale-2025 .ws-pack-mobile-btn .wp-block-button__link:active,
#winter-sale-2025 a.ws-pack-mobile-btn:active{
  transform: translateY(1px) scale(0.98);
  box-shadow:
    0 3px 10px rgba(0,0,0,0.8),
    0 0 14px rgba(124,17,17,0.6);
}