:root {
  --gq-ink: #150a1e;
  --gq-pearl: #f7e7ef;
  --gq-hot-rose: #ff3ea9;
  --gq-champagne: #e0c07a;
  --gq-deep-gold: #a97214;

  --gq-card-radius: 18px;
  --gq-shadow: 0 18px 60px rgba(21, 10, 30, 0.22);
  --gq-stroke: rgba(21, 10, 30, 0.14);
  --gq-surface: rgba(247, 231, 239, 0.72);
  --gq-surface-strong: rgba(247, 231, 239, 0.88);
}

/* Background: festival, not white. */
body {
 
  background-attachment: fixed;
  color: var(--gq-ink);
}

/* Typography: keep Blocksy base, but use the custom font for headlines. */
h1, h2 {
  font-family: "Amsterdam", "Playfair Display", "Times New Roman", Times, serif;
  letter-spacing: 0.2px;
}

a {
  color: var(--gq-hot-rose);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.16em;
}

a:hover {
  color: var(--gq-champagne);
}

/* A reusable “card” class you can apply in block editor / Blocksy content blocks. */
.gq-card {
  border: 1px solid var(--gq-stroke);
  border-radius: var(--gq-card-radius);
  background: var(--gq-surface);
  box-shadow: var(--gq-shadow);
  backdrop-filter: blur(10px);
}

/* WooCommerce polish */
.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce ul.products li.product .price {
  color: var(--gq-deep-gold);
  font-weight: 700;
}

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
  border-radius: 999px;
}

.woocommerce div.product div.images img {
  border-radius: 16px;
}

/* Touch targets */
.wp-element-button,
.wp-block-button__link,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
  min-height: 44px;
}

/* A “metallic” rule you can use as a separator (add class gq-gold-rule). */
.gq-gold-rule {
  height: 1px;
  background: linear-gradient(90deg, rgba(21, 10, 30, 0) 0%, rgba(169, 114, 20, 0.45) 18%, rgba(224, 192, 122, 0.95) 50%, rgba(169, 114, 20, 0.45) 82%, rgba(21, 10, 30, 0) 100%);
}

