/* ============================================================================
 * CQ DEPTH — CONTENT MODULES
 * ----------------------------------------------------------------------------
 * .cq-prose  : long-form / legal page styling (Refund, Privacy, Terms,
 *              Responsible Gaming, Sitemap). Add "cq-felt cq-type cq-prose"
 *              as the page's CSS class in Divi -> Page Settings -> Advanced.
 * WooCommerce: styles Woo's own markup — product, cart, checkout, account.
 *              No template overrides; native checkout is untouched.
 * Loaded automatically by the plugin. Nothing to paste.
 * ========================================================================== */

/* ============================================================================
 * LONG-FORM / LEGAL PROSE  — for pages whose copy already lives in WordPress
 * ----------------------------------------------------------------------------
 * Add the class cq-prose to the page's Divi Text module (or the row), or in
 * Divi -> Page Settings -> Advanced -> CSS Class put: cq-felt cq-type cq-prose
 * Nothing else to do: the existing Refund / Privacy / Terms / Responsible
 * Gaming copy inherits the whole depth vocabulary, tables and callouts included.
 * ========================================================================== */
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) { max-width: 88ch; margin-inline: auto; color: var(--t2); font-family: var(--f-ui); font-size: 16px; line-height: 1.75; }
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) > *:first-child { margin-top: 0; }

:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) h1 {
  margin: 0 0 28px; font-family: var(--f-display); font-weight: 600;
  font-size: clamp(40px, 6vw, 68px); line-height: 0.98; letter-spacing: -0.015em;
  text-transform: uppercase; color: var(--t1);
}
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) h2 {
  margin: 56px 0 18px; padding-bottom: 14px; border-bottom: 1px solid var(--line);
  font-family: var(--f-display); font-weight: 600; font-size: clamp(26px, 3vw, 36px);
  line-height: 1.1; text-transform: uppercase; color: var(--t1);
}
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) h3 {
  margin: 36px 0 12px; font-family: var(--f-display); font-weight: 600;
  font-size: 22px; line-height: 1.2; text-transform: uppercase; color: var(--t1);
}
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) h4 {
  margin: 28px 0 10px; font-family: var(--f-mono); font-size: 12px; font-weight: 700;
  letter-spacing: 0.16em; text-transform: uppercase; color: var(--good);
}
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) p { margin: 0 0 18px; text-wrap: pretty; }
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) strong { color: var(--t1); font-weight: 700; }
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) a { color: var(--gold); text-decoration: none; border-bottom: 1px solid color-mix(in srgb, var(--gold) 40%, transparent); }
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) a:hover { color: var(--gold-hi, #efd89a); }

:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) ul, :is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) ol { margin: 0 0 22px; padding-left: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; }
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) li { position: relative; padding-left: 22px; }
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) ul > li::before {
  content: ""; position: absolute; left: 4px; top: 0.72em;
  width: 6px; height: 6px; border-radius: 50%; background: var(--good);
}
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) ol { counter-reset: cqp; }
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) ol > li { counter-increment: cqp; padding-left: 30px; }
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) ol > li::before {
  content: counter(cqp); position: absolute; left: 0; top: 0;
  font-family: var(--f-mono); font-size: 12px; font-weight: 700; color: var(--gold);
}
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) li > ul, :is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) li > ol { margin: 10px 0 0; }

/* Tables — the refund matrix and any comparison grid */
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) table {
  width: 100%; margin: 0 0 28px; border-collapse: separate; border-spacing: 0;
  border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden;
  background: var(--surface-raised); font-size: 14.5px;
}
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) thead th {
  padding: 15px 18px; background: var(--band-green, #12402a);
  border-bottom: 1px solid rgba(255,255,255,0.10);
  font-family: var(--f-mono); font-size: 10px; font-weight: 700;
  letter-spacing: 0.16em; text-transform: uppercase; color: #7fe3b6; text-align: left;
}
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) tbody td, :is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) tbody th {
  padding: 15px 18px; border-top: 1px solid var(--line);
  color: var(--t2); vertical-align: top; text-align: left;
}
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) tbody tr:first-child td, :is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) tbody tr:first-child th { border-top: 0; }
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) tbody tr:hover td, :is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) tbody tr:hover th { background: var(--surface-hi, #1a241f); }
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) tbody strong { color: var(--t1); }

/* A single-cell table is how WP renders the boxed asides in this copy —
   treat it as a callout rather than a table. */
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) table:has(tbody tr:only-child td:only-child) {
  border-color: color-mix(in srgb, var(--gold) 30%, transparent);
  background: var(--surface-recessed);
}
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) table:has(tbody tr:only-child td:only-child) tbody td {
  padding: 20px 24px; color: var(--t2); font-style: normal;
}

:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) blockquote {
  margin: 0 0 24px; padding: 20px 24px; border-radius: var(--r-md);
  background: var(--surface-recessed); box-shadow: var(--inset-soft, inset 0 2px 5px rgba(0,0,0,0.55));
  color: var(--t2);
}
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) blockquote p:last-child { margin-bottom: 0; }
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) hr { margin: 44px 0; border: 0; border-top: 1px solid var(--line); }
:is(.cq-prose, .cq-prose-page .entry-content, .cq-prose-page .et_pb_text_inner) code { font-family: var(--f-mono); font-size: 13px; color: var(--t1); }

/* Page header block for a legal page (optional, above the prose) */
.cq-legal-head { padding-block: clamp(48px, 7vw, 84px) 0; }
.cq-legal-head .eyebrow { color: var(--good); }
.cq-legal-head .cq-legal-updated { font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--t3); }


/* ============================================================================
 * WOOCOMMERCE — product, cart, checkout, account
 * ----------------------------------------------------------------------------
 * Styles Woo's own markup so the 8 Early Access products keep native checkout
 * while wearing the depth theme. No template overrides required.
 * ========================================================================== */
.woocommerce, .woocommerce-page { color: var(--t2); font-family: var(--f-ui); }

.woocommerce .product_title,
.woocommerce-page h1.entry-title {
  font-family: var(--f-display); font-weight: 600; font-size: clamp(34px, 4.5vw, 56px);
  line-height: 1; letter-spacing: -0.01em; text-transform: uppercase; color: var(--t1);
}

/* Price — mono, gold, with the strike-through original beside it */
.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce ul.products li.product .price {
  font-family: var(--f-mono); font-weight: 700; color: var(--gold);
  font-size: clamp(28px, 3.6vw, 44px); line-height: 1;
}
.woocommerce div.product p.price del,
.woocommerce ul.products li.product .price del {
  color: var(--t3); font-size: 0.42em; font-weight: 500; opacity: 1; margin-right: 8px;
}
.woocommerce div.product p.price ins,
.woocommerce ul.products li.product .price ins { text-decoration: none; }
.woocommerce div.product .woocommerce-product-details__short-description { color: var(--t2); line-height: 1.7; }

/* Add-to-cart and every other Woo button reuse the gold plaque */
.woocommerce #respond input#submit,
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 15px 30px; border: 0; border-radius: var(--r-pill);
  background: var(--gold-metal, linear-gradient(160deg,#efd89a 0%,#e2c578 45%,#a8770a 100%));
  color: #1a1407; font-family: var(--f-mono); font-size: 12px; font-weight: 700;
  letter-spacing: 0.14em; text-transform: uppercase; line-height: 1;
  box-shadow: 0 10px 28px rgba(226,197,120,0.20); transition: filter 160ms var(--ease-out, ease), transform 160ms var(--ease-out, ease);
}
.woocommerce a.button:hover, .woocommerce button.button:hover,
.woocommerce input.button:hover, .woocommerce button.button.alt:hover { filter: brightness(1.08); transform: translateY(-1px); }
.woocommerce a.button:active, .woocommerce button.button:active { transform: scale(0.98); }
.woocommerce a.button.wc-backward,
.woocommerce a.added_to_cart {
  background: transparent; color: var(--gold);
  border: 1px solid color-mix(in srgb, var(--gold) 45%, transparent); box-shadow: none;
}

/* Quantity + variation controls become recessed wells */
.woocommerce .quantity .qty,
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce-page form .form-row .input-text,
.woocommerce table.variations select, .woocommerce select {
  padding: 13px 16px; border-radius: var(--r-sm); border: 1px solid var(--line);
  background: var(--surface-recessed); box-shadow: var(--inset-soft, inset 0 2px 5px rgba(0,0,0,0.55));
  color: var(--t1); font-family: var(--f-ui); font-size: 15px;
}
.woocommerce .quantity .qty { font-family: var(--f-mono); text-align: center; max-width: 92px; }
.woocommerce table.variations th.label { font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--t3); }

/* Product grid cards */
.woocommerce ul.products li.product {
  padding: 0; border-radius: var(--r-lg); overflow: hidden;
  background: var(--surface-raised); border: 1px solid var(--line);
  box-shadow: var(--e-1, 0 6px 18px rgba(0,0,0,0.42));
  transition: transform 180ms var(--ease-out, ease), border-color 180ms var(--ease-out, ease);
}
.woocommerce ul.products li.product:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--gold) 34%, transparent); }
.woocommerce ul.products li.product a img { margin: 0; border-radius: 0; }
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  padding: 20px 22px 0; font-family: var(--f-display); font-size: 24px;
  text-transform: uppercase; color: var(--t1);
}
.woocommerce ul.products li.product .price { display: block; padding: 8px 22px 0; }
.woocommerce ul.products li.product .button { margin: 18px 22px 22px; }
.woocommerce span.onsale {
  min-width: auto; min-height: auto; padding: 7px 14px; border-radius: var(--r-pill);
  background: var(--band-green, #12402a); color: #7fe3b6; border: 1px solid rgba(52,211,153,0.34);
  font-family: var(--f-mono); font-size: 10px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase;
  line-height: 1;
}

/* Tabs, cart table, totals, notices */
.woocommerce div.product .woocommerce-tabs ul.tabs { padding: 0; border: 0; display: flex; gap: 6px; flex-wrap: wrap; }
.woocommerce div.product .woocommerce-tabs ul.tabs::before { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li {
  margin: 0; padding: 0; border: 0; background: transparent; border-radius: var(--r-pill);
}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  padding: 11px 20px; font-family: var(--f-mono); font-size: 10px; font-weight: 700;
  letter-spacing: 0.14em; text-transform: uppercase; color: var(--t3);
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active { background: color-mix(in srgb, var(--gold) 14%, transparent); }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--gold); }

.woocommerce table.shop_table,
.woocommerce-cart table.cart, .woocommerce table.shop_attributes {
  border: 1px solid var(--line); border-radius: var(--r-md); border-collapse: separate;
  border-spacing: 0; overflow: hidden; background: var(--surface-raised);
}
.woocommerce table.shop_table th {
  padding: 15px 18px; background: var(--band-green, #12402a);
  font-family: var(--f-mono); font-size: 10px; font-weight: 700; letter-spacing: 0.16em;
  text-transform: uppercase; color: #7fe3b6;
}
.woocommerce table.shop_table td { padding: 16px 18px; border-top: 1px solid var(--line); color: var(--t2); }
.woocommerce .cart_totals h2, .woocommerce-checkout h3 {
  font-family: var(--f-display); font-size: 26px; text-transform: uppercase; color: var(--t1);
}
.woocommerce-checkout #payment { background: var(--surface-raised); border: 1px solid var(--line); border-radius: var(--r-lg); }
.woocommerce-checkout #payment div.payment_box { background: var(--surface-recessed); color: var(--t2); }
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: var(--surface-recessed); }

.woocommerce-message, .woocommerce-info, .woocommerce-error {
  padding: 16px 20px; border-radius: var(--r-md); border: 1px solid var(--line);
  background: var(--surface-raised); color: var(--t2);
}
.woocommerce-message { border-left: 3px solid var(--good); }
.woocommerce-info { border-left: 3px solid var(--select, var(--good)); }
.woocommerce-error { border-left: 3px solid var(--danger); }
.woocommerce-message::before, .woocommerce-info::before, .woocommerce-error::before { color: inherit; }

.woocommerce nav.woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.woocommerce nav.woocommerce-MyAccount-navigation ul li a {
  display: block; padding: 12px 16px; border-radius: var(--r-sm);
  font-family: var(--f-mono); font-size: 11px; font-weight: 700; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--t2);
}
.woocommerce nav.woocommerce-MyAccount-navigation ul li.is-active a { background: color-mix(in srgb, var(--gold) 14%, transparent); color: var(--gold); }


/* ----------------------------------------------------------------------------
 * Prose pages must carry the dark canvas themselves.
 * Divi paints #main-content white; without this the light text is invisible.
 * -------------------------------------------------------------------------- */
body.cq-prose-page,
body.cq-prose-page #page-container,
body.cq-prose-page #et-main-area,
body.cq-prose-page #main-content,
body.cq-prose-page .et_pb_section,
body.cq-prose-page .et_pb_row,
body.cq-prose-page article,
body.cq-prose-page .entry-content {
  background-color: transparent;
}
body.cq-prose-page {
  background-color: #050706;
  background-image:
    radial-gradient(78% 46% at 50% 0%, rgba(52,211,153,0.10) 0%, transparent 60%),
    repeating-linear-gradient(45deg,  rgba(27,122,70,0.20) 0 1px, transparent 1px 5px),
    repeating-linear-gradient(-45deg, rgba(27,122,70,0.20) 0 1px, transparent 1px 5px);
  background-attachment: fixed;
  color: #a8b4ad;
}
body.cq-prose-page #main-content { padding-block: clamp(40px, 6vw, 80px); }

/* Divi's own title module on these pages */
body.cq-prose-page .et_pb_title_container h1,
body.cq-prose-page .entry-title {
  font-family: var(--f-display, 'Oswald', sans-serif); font-weight: 600;
  text-transform: uppercase; color: #f3f7f4;
}

/* Fallback tokens — in case a token file loads late or is overridden */
body.cq-prose-page {
  --t1: #f3f7f4; --t2: #a8b4ad; --t3: #6b7a72;
  --line: rgba(255,255,255,0.08);
  --gold: #e2c578; --gold-hi: #efd89a; --good: #34d399;
  --surface-raised: #0d1210; --surface-recessed: #080b0a; --surface-hi: #1a241f;
  --band-green: #12402a;
  --f-display: 'Oswald', sans-serif;
  --f-ui: 'Nunito', sans-serif;
  --f-mono: 'JetBrains Mono', monospace;
  --r-sm: 8px; --r-md: 12px; --r-lg: 16px; --r-pill: 999px;
}


/* ----------------------------------------------------------------------------
 * Prose width must NOT constrain Divi-built pages.
 * WordPress adds .et_pb_pagebuilder_layout to <body> when a page is built with
 * the Divi Builder. On those pages the layout owns its own widths, so the 88ch
 * measure is released — it only applies to plain WordPress prose.
 * -------------------------------------------------------------------------- */
body.et_pb_pagebuilder_layout.cq-prose-page .entry-content,
body.et_pb_pagebuilder_layout.cq-prose-page .et_pb_text_inner,
body.et_pb_pagebuilder_layout.cq-prose-page .et_builder_inner_content,
body.et_pb_pagebuilder_layout.cq-prose-page .et_pb_section,
body.et_pb_pagebuilder_layout.cq-prose-page .et_pb_row {
  max-width: none;
  margin-inline: 0;
}
/* Divi fullwidth code modules must span the viewport on prose pages too */
body.cq-prose-page .et_pb_fullwidth_code,
body.cq-prose-page .et_pb_fullwidth_section {
  max-width: none;
  width: 100%;
}
/* Keep the measure on the text itself, not the container */
body.et_pb_pagebuilder_layout.cq-prose-page .et_pb_text_inner > p,
body.et_pb_pagebuilder_layout.cq-prose-page .et_pb_text_inner > ul,
body.et_pb_pagebuilder_layout.cq-prose-page .et_pb_text_inner > ol {
  max-width: 88ch;
}


/* ----------------------------------------------------------------------------
 * WooCommerce pages need the dark canvas too.
 * Woo renders on the theme's default white background; the depth palette is
 * light-on-dark, so without this the product title and price are invisible.
 * -------------------------------------------------------------------------- */
body.woocommerce, body.woocommerce-page {
  background-color: #050706;
  background-image:
    radial-gradient(78% 46% at 50% 0%, rgba(52,211,153,0.10) 0%, transparent 60%),
    repeating-linear-gradient(45deg,  rgba(27,122,70,0.20) 0 1px, transparent 1px 5px),
    repeating-linear-gradient(-45deg, rgba(27,122,70,0.20) 0 1px, transparent 1px 5px);
  background-attachment: fixed;
  color: #a8b4ad;
}
body.woocommerce #page-container,
body.woocommerce #et-main-area,
body.woocommerce #main-content,
body.woocommerce .et_pb_section,
body.woocommerce .et_pb_row,
body.woocommerce article,
body.woocommerce .entry-content,
body.woocommerce-page #page-container,
body.woocommerce-page #et-main-area,
body.woocommerce-page #main-content,
body.woocommerce-page .et_pb_section,
body.woocommerce-page .et_pb_row,
body.woocommerce-page article,
body.woocommerce-page .entry-content {
  background-color: transparent;
}
body.woocommerce #main-content, body.woocommerce-page #main-content {
  padding-block: clamp(32px, 5vw, 64px);
}

/* Text that Woo/Divi leaves at theme defaults */
body.woocommerce h1, body.woocommerce h2, body.woocommerce h3,
body.woocommerce-page h1, body.woocommerce-page h2, body.woocommerce-page h3 { color: #f3f7f4; }
body.woocommerce p, body.woocommerce li, body.woocommerce td, body.woocommerce th,
body.woocommerce-page p, body.woocommerce-page li, body.woocommerce-page td, body.woocommerce-page th { color: #a8b4ad; }
body.woocommerce .woocommerce-breadcrumb,
body.woocommerce-page .woocommerce-breadcrumb {
  font-family: var(--f-mono, 'JetBrains Mono', monospace); font-size: 11px;
  letter-spacing: 0.1em; color: #6b7a72;
}
body.woocommerce .woocommerce-breadcrumb a,
body.woocommerce-page .woocommerce-breadcrumb a { color: #e2c578; }

/* Product gallery + tabs on the dark canvas */
body.woocommerce div.product .woocommerce-product-gallery,
body.woocommerce-page div.product .woocommerce-product-gallery { background: transparent; }
body.woocommerce div.product .woocommerce-tabs .panel,
body.woocommerce-page div.product .woocommerce-tabs .panel {
  background: #0d1210; border: 1px solid rgba(255,255,255,0.07);
  border-radius: 12px; padding: 24px 26px; color: #a8b4ad;
}
body.woocommerce div.product .woocommerce-tabs ul.tabs li a,
body.woocommerce-page div.product .woocommerce-tabs ul.tabs li a { color: #8b9690; }

/* Quantity field readability */
body.woocommerce .quantity .qty, body.woocommerce-page .quantity .qty {
  background: #080b0a; border: 1px solid rgba(255,255,255,0.10); color: #f3f7f4;
}

/* SKU / meta line */
body.woocommerce .product_meta, body.woocommerce-page .product_meta {
  font-family: var(--f-mono, 'JetBrains Mono', monospace); font-size: 11px;
  letter-spacing: 0.06em; color: #6b7a72;
}
body.woocommerce .product_meta a, body.woocommerce-page .product_meta a { color: #e2c578; }


/* ----------------------------------------------------------------------------
 * Archive price sizing. The large gold mono price belongs on the SINGLE product
 * page only — on grid cards it swallowed subscription copy ("$25.00 one time,
 * and $4.99/month with a 3-month free trial") at 44px and wrapped six lines.
 * -------------------------------------------------------------------------- */
.woocommerce ul.products li.product .price,
.woocommerce-page ul.products li.product .price {
  font-family: var(--f-ui, 'Nunito', sans-serif);
  font-size: 15px; font-weight: 400; line-height: 1.5;
  color: #8b9690; display: block; padding: 6px 22px 0;
}
.woocommerce ul.products li.product .price .woocommerce-Price-amount,
.woocommerce-page ul.products li.product .price .woocommerce-Price-amount {
  font-family: var(--f-mono, 'JetBrains Mono', monospace);
  font-size: 22px; font-weight: 700; color: #e2c578; line-height: 1.2;
}
.woocommerce ul.products li.product .price del,
.woocommerce-page ul.products li.product .price del { opacity: 1; margin-right: 8px; }
.woocommerce ul.products li.product .price del .woocommerce-Price-amount,
.woocommerce-page ul.products li.product .price del .woocommerce-Price-amount {
  font-size: 14px; font-weight: 500; color: #6b7a72;
}
.woocommerce ul.products li.product .price ins,
.woocommerce-page ul.products li.product .price ins { text-decoration: none; background: transparent; }

/* Keep the big treatment for the single product page only */
.woocommerce div.product p.price .woocommerce-Price-amount,
.woocommerce div.product span.price .woocommerce-Price-amount {
  font-family: var(--f-mono, 'JetBrains Mono', monospace);
  font-size: clamp(28px, 3.6vw, 44px); font-weight: 700; color: #e2c578;
}
.woocommerce div.product p.price, .woocommerce div.product span.price {
  font-family: var(--f-ui, 'Nunito', sans-serif); font-size: 16px;
  font-weight: 400; line-height: 1.6; color: #8b9690;
}
.woocommerce div.product p.price del .woocommerce-Price-amount { font-size: 18px; color: #6b7a72; }

/* Card titles sit tighter to the price */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce-page ul.products li.product .woocommerce-loop-product__title {
  padding: 20px 22px 0; line-height: 1.1;
}

/* Archive header on the dark canvas */
.woocommerce .woocommerce-products-header__title,
.woocommerce-page .woocommerce-products-header__title {
  font-family: var(--f-display, 'Oswald', sans-serif); font-weight: 600;
  text-transform: uppercase; color: #f3f7f4;
}
.woocommerce .woocommerce-result-count,
.woocommerce-page .woocommerce-result-count {
  font-family: var(--f-mono, 'JetBrains Mono', monospace);
  font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: #6b7a72;
}
.woocommerce .woocommerce-ordering select,
.woocommerce-page .woocommerce-ordering select {
  background: #080b0a; border: 1px solid rgba(255,255,255,0.10); color: #a8b4ad;
  border-radius: var(--r-sm, 8px); padding: 10px 14px;
}


/* ----------------------------------------------------------------------------
 * Product gallery + Divi's hover overlay.
 * Woo paints the gallery white and Divi's .et_overlay is a white scrim, so
 * product art flashed white on hover. Both go dark here.
 * -------------------------------------------------------------------------- */
.woocommerce div.product div.images,
.woocommerce div.product div.images img,
.woocommerce div.product .woocommerce-product-gallery,
.woocommerce div.product .woocommerce-product-gallery__wrapper,
.woocommerce div.product .woocommerce-product-gallery__image,
.woocommerce ul.products li.product a img,
.woocommerce-page div.product div.images,
.woocommerce-page div.product .woocommerce-product-gallery__image {
  background-color: #0d1210;
}
.woocommerce div.product .woocommerce-product-gallery__image { border-radius: var(--r-md, 12px); overflow: hidden; }
.woocommerce div.product .woocommerce-product-gallery { border: 1px solid rgba(255,255,255,0.07); border-radius: var(--r-lg, 16px); overflow: hidden; }

/* Divi's hover overlay — white by default */
.et_overlay,
.woocommerce ul.products li.product .et_overlay,
.woocommerce-page ul.products li.product .et_overlay {
  background-color: rgba(5, 7, 6, 0.72) !important;
  border-color: rgba(226,197,120,0.34) !important;
}
.et_overlay:before,
.woocommerce ul.products li.product .et_overlay:before { color: #e2c578 !important; }

/* Gallery zoom trigger */
.woocommerce div.product .woocommerce-product-gallery__trigger { color: #e2c578; }

/* ----------------------------------------------------------------------------
 * Description panel headings. Divi sets h1-h6 to #333, which is unreadable on
 * the dark panel — "What's Included" and "Early Access Advantage" faded out.
 * -------------------------------------------------------------------------- */
.woocommerce div.product .woocommerce-tabs .panel h1,
.woocommerce div.product .woocommerce-tabs .panel h2,
.woocommerce div.product .woocommerce-tabs .panel h3,
.woocommerce div.product .woocommerce-tabs .panel h4,
.woocommerce div.product .woocommerce-tabs .panel h5,
.woocommerce div.product .woocommerce-tabs .panel h6,
.woocommerce-page div.product .woocommerce-tabs .panel h1,
.woocommerce-page div.product .woocommerce-tabs .panel h2,
.woocommerce-page div.product .woocommerce-tabs .panel h3,
.woocommerce-page div.product .woocommerce-tabs .panel h4,
.woocommerce-page div.product .woocommerce-tabs .panel h5,
.woocommerce-page div.product .woocommerce-tabs .panel h6 {
  color: #f3f7f4;
}
.woocommerce div.product .woocommerce-tabs .panel p,
.woocommerce div.product .woocommerce-tabs .panel li,
.woocommerce-page div.product .woocommerce-tabs .panel p,
.woocommerce-page div.product .woocommerce-tabs .panel li { color: #a8b4ad; }
.woocommerce div.product .woocommerce-tabs .panel strong,
.woocommerce-page div.product .woocommerce-tabs .panel strong { color: #f3f7f4; }
.woocommerce div.product .woocommerce-tabs .panel em,
.woocommerce-page div.product .woocommerce-tabs .panel em { color: #8b9690; }
.woocommerce div.product .woocommerce-tabs .panel ul li::marker,
.woocommerce-page div.product .woocommerce-tabs .panel ul li::marker { color: #34d399; }

/* Tab strip sits on the panel, not a white bar */
.woocommerce div.product .woocommerce-tabs ul.tabs,
.woocommerce-page div.product .woocommerce-tabs ul.tabs { background: transparent; }

/* Section headings elsewhere on product pages (Related products, upsells) */
.woocommerce .related > h2, .woocommerce .upsells > h2,
.woocommerce-page .related > h2, .woocommerce-page .upsells > h2 {
  font-family: var(--f-display, 'Oswald', sans-serif); font-weight: 600;
  text-transform: uppercase; color: #f3f7f4;
}


/* ============================================================================
 * RESPONSIVE
 * ----------------------------------------------------------------------------
 * Page markup is inline-styled, so each responsive layout carries a class:
 *   cq-page      page root            cq-chrome   header / footer root
 *   cq-g2/3/4/5  card grids           cq-split    content + media two-ups
 *   cq-mega      nav dropdown grid    cq-foot     footer sitemap columns
 *   cq-newsrow   dated news row       cq-spine    roadmap date spine
 *   cq-widerow   wide roadmap row     cq-relrow   release detail row
 *   cq-matrix    comparison grid      cq-matrix-wrap  its scroll container
 * !important is needed only where a rule overrides an inline declaration.
 * ========================================================================== */

.cq-matrix-wrap { -webkit-overflow-scrolling: touch; }

/* ---------- TABLET ---------- */
@media (max-width: 980px) {
  .cq-g3, .cq-g4, .cq-g5, .cq-mega, .cq-foot { grid-template-columns: repeat(2, 1fr) !important; }
  .cq-g2, .cq-split, .cq-relrow { grid-template-columns: 1fr !important; }

  /* the mega menu's "go deeper" rail loses its side rule when it wraps */
  .cq-mega > div[style*="border-left"] {
    border-left: 0 !important; padding-left: 0 !important;
    border-top: 1px solid rgba(255,255,255,0.07) !important; padding-top: 22px !important;
  }

  /* roadmap spine: date sits above its releases */
  .cq-spine { grid-template-columns: 1fr !important; }
  .cq-spine > div:first-child {
    border-right: 0 !important;
    border-bottom: 2px solid rgba(52,211,153,0.28) !important;
    padding: 0 0 14px !important; margin-bottom: 20px !important;
    flex-direction: row !important; align-items: baseline !important; gap: 14px !important;
  }
  .cq-spine > div:last-child { padding-left: 0 !important; }

  .cq-widerow { grid-template-columns: 1fr !important; gap: 16px !important; }
  .cq-widerow > *:last-child { justify-self: start !important; text-align: left !important; }

  /* news rows: the date chip takes its own line */
  .cq-newsrow { grid-template-columns: 1fr auto !important; gap: 10px 16px !important; }
  .cq-newsrow > *:first-child { grid-column: 1 / -1 !important; }

  /* the matrix scrolls rather than crushing seven columns */
  .cq-matrix-wrap { overflow-x: auto !important; overflow-y: hidden !important; }
  .cq-matrix { min-width: 760px !important; grid-template-columns: minmax(170px, 1.4fr) repeat(6, minmax(92px, 1fr)) !important; }

  .cq-page h1 { font-size: clamp(40px, 8.4vw, 74px) !important; }
  .cq-page h2 { font-size: clamp(30px, 5.6vw, 46px) !important; }
  .cq-page section { padding-left: 24px !important; padding-right: 24px !important; }
  .cq-page img[alt="Early Access"] { width: 170px !important; }
}

/* ---------- PHONE ---------- */
@media (max-width: 640px) {
  .cq-g2, .cq-g3, .cq-g4, .cq-g5, .cq-mega, .cq-foot { grid-template-columns: 1fr !important; }

  /* three flat doors read as stacked bands */
  .cq-page a[style*="border-right:1px solid rgba(255,255,255,0.06)"] {
    border-right: 0 !important; border-bottom: 1px solid rgba(255,255,255,0.06) !important;
  }

  .cq-matrix { min-width: 700px !important; grid-template-columns: minmax(150px, 1.3fr) repeat(6, minmax(88px, 1fr)) !important; }

  .cq-page h1 { font-size: clamp(34px, 10vw, 46px) !important; line-height: 1.02 !important; }
  .cq-page h2 { font-size: clamp(26px, 7.4vw, 34px) !important; }
  .cq-page p  { font-size: 16px !important; }

  .cq-page section {
    padding-left: 18px !important; padding-right: 18px !important;
    padding-top: 52px !important; padding-bottom: 56px !important;
  }

  /* cards and their bands tighten up */
  .cq-page [style*="border-radius:14px"] > div[style*="padding:"] { padding: 24px 22px 26px !important; }
  .cq-page [style*="border-radius:14px"] > span[style*="padding:"] { padding-left: 22px !important; padding-right: 22px !important; }

  /* every pill button clears the 44px touch target */
  .cq-page a[style*="border-radius:999px"], .cq-chrome a[style*="border-radius:999px"] {
    min-height: 44px !important; display: inline-flex !important;
    align-items: center !important; justify-content: center !important;
  }

  /* hero CTAs go full width so they never sit half-off the screen */
  .cq-page section > div > div[style*="justify-content:center"] > a { flex: 1 1 100% !important; }

  .cq-page img[alt="Early Access"] { width: 130px !important; }
  .cq-page img[style*="width:88px"] { width: 56px !important; height: 56px !important; }
  .cq-page img[style*="width:62px"] { width: 46px !important; height: 46px !important; }
}

/* ---------- HEADER / FOOTER ---------- */
@media (max-width: 760px) {
  /* the utility strip's marketing run is noise on a phone */
  .cq-chrome span[style*="A training app"] { display: none !important; }
}
@media (max-width: 640px) {
  .cq-chrome img[alt="Casino Quest Nexus"] { width: 38px !important; height: 38px !important; }
}


/* ============================================================================
 * HOVER + LINK CONTRAST
 * ----------------------------------------------------------------------------
 * Inline style-hover attributes do not survive the export, so hover states live
 * here. Gold brightens and the label goes semi-bold, which reads clearly on
 * near-black. Prices in the nav panels are gold rather than grey.
 * ========================================================================== */

.cq-chrome a { transition: color 140ms cubic-bezier(.16,1,.3,1); }

/* top-level nav links and dropdown triggers */
.cq-chrome nav a:hover,
.cq-chrome nav [data-cq-menu]:hover { color: #f7e3ad !important; }

/* dropdown panel links */
.cq-chrome [data-cq-panel] a:hover { color: #f7e3ad !important; }
.cq-chrome [data-cq-panel] a:hover span { color: #efd89a !important; }

/* utility strip */
.cq-chrome a[href^="tel:"]:hover { color: #7fe3b6 !important; }
.cq-chrome a[href*="auth.cqnexus"]:hover { color: #f7e3ad !important; }
.cq-chrome a[aria-label]:hover { color: #f7e3ad !important; }

/* footer columns */
.cq-chrome footer a:hover, footer.cq-chrome a:hover { color: #f7e3ad !important; }

/* section labels inside the nav panels were near-invisible */
.cq-chrome [data-cq-panel] > div > div > span:first-child,
.cq-chrome [data-cq-panel] > div > div > span[style*="letter-spacing:0.2em"] {
  color: #8b9690 !important;
}

/* prices and qualifiers in the Early Access panel */
.cq-chrome [data-cq-panel] a span[style*="color:#6b7a72"] { color: #a8b4ad !important; }

/* page-body links */
.cq-page a { transition: color 140ms cubic-bezier(.16,1,.3,1), border-color 140ms cubic-bezier(.16,1,.3,1); }
.cq-page a[style*="color:#a8b4ad"]:hover { color: #f7e3ad !important; }
.cq-page a[style*="color:#e2c578"]:hover { color: #f7e3ad !important; }
.cq-page a[style*="color:#7fe3b6"]:hover { color: #a7f3d0 !important; }
.cq-page a[style*="color:#34d399"]:hover { color: #6ee7b7 !important; }

/* card and row hovers */
.cq-page a[style*="border-radius:14px"]:hover { border-color: rgba(226,197,120,0.45) !important; }
.cq-page a[style*="border-radius:12px"]:hover { border-color: rgba(226,197,120,0.45) !important; }
.cq-page a[style*="grid-template-columns"]:hover { background: #1a241f !important; }

/* gold pill buttons */
.cq-page a[style*="linear-gradient(160deg,#efd89a"]:hover,
.cq-chrome a[style*="linear-gradient(160deg,#efd89a"]:hover {
  filter: brightness(1.08); transform: translateY(-1px);
}
.cq-page a[style*="linear-gradient(160deg,#efd89a"]:active,
.cq-chrome a[style*="linear-gradient(160deg,#efd89a"]:active { transform: scale(0.98); }

/* ghost buttons */
.cq-page a[style*="border:1px solid rgba(52,211,153,0.42)"]:hover { background: rgba(52,211,153,0.14) !important; color: #a7f3d0 !important; }
.cq-page a[style*="border:1px solid rgba(226,197,120,0.45)"]:hover { background: rgba(226,197,120,0.12) !important; color: #f7e3ad !important; }


/* ----------------------------------------------------------------------------
 * Add to cart. Divi's own button rules and the Product Bundles plugin both
 * carry higher specificity than the earlier selector, so the gold plaque was
 * being stripped back to a plain link. Pinned explicitly here.
 * -------------------------------------------------------------------------- */
.woocommerce button.single_add_to_cart_button,
.woocommerce button.single_add_to_cart_button.button,
.woocommerce button.single_add_to_cart_button.button.alt,
.woocommerce-page button.single_add_to_cart_button,
.woocommerce-page button.single_add_to_cart_button.button,
.woocommerce-page button.single_add_to_cart_button.button.alt,
.woocommerce .wc-pb-add-to-cart-button button,
.woocommerce div.product form.cart button[type="submit"],
.woocommerce-page div.product form.cart button[type="submit"] {
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  padding: 15px 34px !important; border: 0 !important; border-radius: var(--r-pill, 999px) !important;
  background: linear-gradient(160deg,#efd89a 0%,#e2c578 45%,#a8770a 100%) !important;
  color: #1a1407 !important;
  font-family: var(--f-mono, 'JetBrains Mono', monospace) !important;
  font-size: 12px !important; font-weight: 700 !important;
  letter-spacing: 0.14em !important; text-transform: uppercase !important;
  line-height: 1 !important; min-height: 48px !important;
  box-shadow: 0 10px 28px rgba(226,197,120,0.20) !important;
  text-shadow: none !important;
}
.woocommerce button.single_add_to_cart_button:hover,
.woocommerce-page button.single_add_to_cart_button:hover,
.woocommerce div.product form.cart button[type="submit"]:hover {
  filter: brightness(1.08); transform: translateY(-1px);
}
.woocommerce button.single_add_to_cart_button:after,
.woocommerce div.product form.cart button[type="submit"]:after { display: none !important; }

/* the quantity box beside it */
.woocommerce div.product form.cart .quantity,
.woocommerce-page div.product form.cart .quantity { margin-right: 12px; }
.woocommerce div.product form.cart .quantity .qty,
.woocommerce-page div.product form.cart .quantity .qty {
  min-height: 48px; border-radius: var(--r-sm, 8px);
  background: #080b0a; border: 1px solid rgba(255,255,255,0.10); color: #f3f7f4;
  font-family: var(--f-mono, 'JetBrains Mono', monospace); text-align: center;
}

/* express checkout buttons keep their brand colours but match the shape */
.woocommerce .wc-proceed-to-checkout a.checkout-button,
.woocommerce-page .wc-proceed-to-checkout a.checkout-button {
  background: linear-gradient(160deg,#efd89a 0%,#e2c578 45%,#a8770a 100%) !important;
  color: #1a1407 !important; border-radius: var(--r-pill, 999px) !important;
  font-family: var(--f-mono, 'JetBrains Mono', monospace) !important;
  letter-spacing: 0.14em !important; text-transform: uppercase !important;
  font-size: 13px !important; font-weight: 700 !important; min-height: 52px !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
}