/*
Theme Name:   VARCAR Child
Theme URI:    https://www.editorialvarcar.com
Description:  Child theme oscuro para Editorial VARCAR
Author:       VARCAR
Template:     storefront
Version:      2.0.0
Text Domain:  varcar-child
*/

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;1,400&family=Inter:wght@300;400;500&display=swap');

/* ============================================================
   TOKENS
   ============================================================ */
:root {
  --vrc-ink:        #0a0a0a;
  --vrc-surface:    #111111;
  --vrc-surface2:   #161616;
  --vrc-gold:       #c4a87a;
  --vrc-gold-dim:   #9b8060;
  --vrc-gold-dark:  #6b5840;
  --vrc-cream:      #f0ebe3;
  --vrc-cream-mid:  #a09080;
  --vrc-border:     #2a2016;
  --vrc-border-soft: rgba(58,46,34,.35);

  --vrc-serif: 'Playfair Display', Georgia, serif;
  --vrc-sans:  'Inter', system-ui, sans-serif;

  --vrc-max-width: 1200px;
}

/* ============================================================
   RESET / BASE
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }

body {
  font-family: var(--vrc-sans);
  font-size: 16px;
  line-height: 1.7;
  color: var(--vrc-cream);
  background: var(--vrc-ink);
  -webkit-font-smoothing: antialiased;
}

a { color: var(--vrc-gold); }
a:hover { color: var(--vrc-cream); }

h1, h2, h3, h4 {
  font-family: var(--vrc-serif);
  font-weight: 600;
  line-height: 1.25;
  color: var(--vrc-cream);
}

/* ============================================================
   STOREFRONT HEADER — override completo en oscuro
   El truco: especificidad alta pero sin !important en cascada,
   excepto donde Storefront lo fuerza él mismo.
   ============================================================ */
.site-header,
.storefront-sticky-add-to-cart {
  background-color: var(--vrc-ink) !important;
  border-bottom: 1px solid var(--vrc-border-soft) !important;
}

/* Contenedor inner del header */
.site-header .col-full {
  max-width: var(--vrc-max-width);
  margin: 0 auto;
  padding: .85rem 1.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
}

/* ── Logo / título del sitio ── */
.site-branding .site-title,
.site-branding .site-title a,
.custom-logo-link {
  font-family: var(--vrc-serif) !important;
  font-size: 1.15rem !important;
  font-weight: 600 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: var(--vrc-cream) !important;
  text-decoration: none !important;
  margin: 0 !important;
}

.site-branding .site-title a span.vrc-em {
  font-style: italic;
  color: var(--vrc-gold) !important;
  font-weight: 400 !important;
}

.site-branding .site-description { display: none !important; }

/* ── Navegación principal ── */
.main-navigation,
.main-navigation ul,
.main-navigation ul li {
  background: transparent !important;
  border: none !important;
}

.main-navigation ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  gap: 0;
}

.main-navigation ul li a {
  font-family: var(--vrc-sans) !important;
  font-size: 11px !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  font-weight: 400 !important;
  color: var(--vrc-cream-mid) !important;
  padding: .5rem 1rem !important;
  text-decoration: none !important;
  transition: color .2s !important;
  background: transparent !important;
}

.main-navigation ul li a:hover,
.main-navigation ul .current-menu-item > a {
  color: var(--vrc-cream) !important;
  background: transparent !important;
}

/* Submenús */
.main-navigation ul ul {
  background: var(--vrc-surface) !important;
  border: 1px solid var(--vrc-border) !important;
  box-shadow: none !important;
}

.main-navigation ul ul li a {
  border-bottom: 1px solid var(--vrc-border) !important;
}

/* ── Carrito en el header ── */
.site-header-cart .cart-contents,
.site-header-cart .cart-contents:hover {
  color: var(--vrc-cream-mid) !important;
  background: transparent !important;
}

.site-header-cart .cart-contents .count {
  background: var(--vrc-gold) !important;
  color: var(--vrc-ink) !important;
  font-size: 10px !important;
  font-weight: 600 !important;
}

/* ── Switcher de idioma (Polylang / WPML / fallback) ── */
.vrc-lang-switcher {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.vrc-lang-switcher a,
.vrc-lang-switcher span {
  color: var(--vrc-gold-dim);
  text-decoration: none;
  padding: .25rem .5rem;
  border: 1px solid transparent;
  transition: border-color .2s, color .2s;
}

.vrc-lang-switcher a:hover { color: var(--vrc-gold); border-color: var(--vrc-border); }
.vrc-lang-switcher .is-active,
.vrc-lang-switcher .current-lang { color: var(--vrc-gold) !important; }

/* ── Handheld footer bar (móvil) ── */
.storefront-handheld-footer-bar {
  background: var(--vrc-surface) !important;
  border-top: 1px solid var(--vrc-border-soft) !important;
}

.storefront-handheld-footer-bar ul li a,
.storefront-handheld-footer-bar ul li a:hover {
  color: var(--vrc-cream-mid) !important;
}

.storefront-handheld-footer-bar .cart .count {
  background: var(--vrc-gold) !important;
  color: var(--vrc-ink) !important;
}

/* ── Burger menú móvil ── */
button.menu-toggle {
  color: var(--vrc-cream-mid) !important;
  background: transparent !important;
  border: 1px solid var(--vrc-border) !important;
  padding: .4rem .6rem !important;
}

button.menu-toggle:hover { color: var(--vrc-cream) !important; border-color: var(--vrc-gold-dim) !important; }

/* ============================================================
   HOMEPAGE — CLASES PROPIAS
   (El template homepage.php genera estas clases;
   el header de Storefront queda por encima, no interfiere)
   ============================================================ */

/* Offset del header fijo de Storefront */
.vrc-main { padding-top: 0; }

.vrc-section {
  padding: 3rem 1.5rem;
  border-bottom: 1px solid var(--vrc-border-soft);
  max-width: var(--vrc-max-width);
  margin: 0 auto;
}

.vrc-section__label {
  font-size: 10px;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--vrc-gold-dim);
  margin: 0 0 .6rem;
}

.vrc-section__header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 1.5rem;
}

.vrc-section__link {
  font-size: 11px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--vrc-gold-dim);
  text-decoration: none;
  border-bottom: 1px solid var(--vrc-border);
}
.vrc-section__link:hover { color: var(--vrc-gold); border-bottom-color: var(--vrc-gold-dim); }

/* Botones */
.vrc-btn {
  display: inline-flex;
  align-items: center;
  font-size: 12px;
  letter-spacing: .1em;
  text-transform: uppercase;
  font-weight: 500;
  padding: .8rem 1.75rem;
  text-decoration: none;
  transition: background .2s, color .2s, border-color .2s;
  cursor: pointer;
  border: none;
}
.vrc-btn--primary { background: var(--vrc-gold) !important; color: var(--vrc-ink) !important; }
.vrc-btn--primary:hover { background: var(--vrc-cream) !important; color: var(--vrc-ink) !important; }
.vrc-btn--ghost { background: transparent !important; color: var(--vrc-cream-mid) !important; border: 1px solid var(--vrc-border) !important; }
.vrc-btn--ghost:hover { border-color: var(--vrc-gold-dim) !important; color: var(--vrc-cream) !important; }

/* Hero */
.vrc-hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5rem;
  align-items: center;
  padding: 6rem 1.5rem 4rem;
  max-width: var(--vrc-max-width);
  margin: 0 auto;
  border-bottom: 1px solid var(--vrc-border-soft);
}

.vrc-eyebrow {
  font-size: 10px;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--vrc-gold-dim);
  margin: 0 0 1.5rem;
}

.vrc-hero__title {
  font-family: var(--vrc-serif);
  font-size: clamp(2.4rem, 4.5vw, 3.6rem);
  font-weight: 600;
  line-height: 1.1;
  margin: 0 0 1.5rem;
  color: var(--vrc-cream);
}
.vrc-hero__title em { font-style: italic; color: var(--vrc-gold); }

.vrc-hero__sub {
  font-size: .92rem;
  color: var(--vrc-cream-mid);
  line-height: 1.85;
  margin: 0 0 .75rem;
  max-width: 440px;
}

.vrc-hero__epub {
  font-size: .8rem;
  color: var(--vrc-gold-dark);
  margin: 0 0 2rem;
  max-width: 400px;
  line-height: 1.7;
}

.vrc-hero__btns { display: flex; gap: .75rem; flex-wrap: wrap; }

/* Hero visual (columna derecha) */
.vrc-hero__visual { display: flex; flex-direction: column; gap: .85rem; }

.vrc-hero__visual-label {
  font-size: 9px;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--vrc-gold-dark);
  margin-bottom: .1rem;
  text-align: right;
}

.vrc-hbook {
  display: flex;
  border: 1px solid var(--vrc-border);
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: border-color .25s;
}
.vrc-hbook:hover { border-color: var(--vrc-gold-dim); }
.vrc-hbook--featured { border-color: var(--vrc-gold); }

.vrc-hbook__spine { width: 5px; flex-shrink: 0; }
.vrc-hbook__info  { padding: .8rem 1rem; flex: 1; }
.vrc-hbook__num   { font-size: 9px; letter-spacing: .18em; text-transform: uppercase; color: var(--vrc-gold-dark); display: block; }
.vrc-hbook__title { font-family: var(--vrc-serif); font-size: .85rem; color: var(--vrc-cream); margin: .2rem 0 .1rem; line-height: 1.3; }
.vrc-hbook__author{ font-size: .7rem; color: var(--vrc-cream-mid); }
.vrc-hbook__price { padding: .8rem 1rem; font-size: .7rem; color: var(--vrc-gold); display: flex; align-items: center; flex-shrink: 0; }

.vrc-hero__trilogy-link {
  font-size: .7rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  text-align: center;
  color: var(--vrc-gold-dim);
  text-decoration: none;
  border: 1px solid var(--vrc-border);
  padding: .55rem 1rem;
  margin-top: .25rem;
  transition: border-color .2s, color .2s;
}
.vrc-hero__trilogy-link:hover { border-color: var(--vrc-gold-dim); color: var(--vrc-gold); }

/* Géneros */
.vrc-genres { background: var(--vrc-surface); }
.vrc-genres__grid { display: flex; flex-wrap: wrap; gap: .5rem; }
.vrc-genre-tag {
  font-size: 11px;
  padding: .3rem .8rem;
  border: 1px solid var(--vrc-border);
  color: var(--vrc-gold-dim);
  letter-spacing: .06em;
}

/* Trilogía */
.vrc-trilogy-section { background: var(--vrc-surface2); }

.vrc-trilogy {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 4rem;
  align-items: center;
}

.vrc-trilogy__series {
  font-size: 10px;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--vrc-gold-dim);
  margin: 0 0 .75rem;
}
.vrc-trilogy__title {
  font-family: var(--vrc-serif);
  font-size: clamp(1.4rem, 2.5vw, 2rem);
  color: var(--vrc-cream);
  margin: 0 0 1rem;
  line-height: 1.2;
}
.vrc-trilogy__desc  { font-size: .88rem; color: var(--vrc-cream-mid); line-height: 1.9; margin: 0 0 .75rem; }
.vrc-trilogy__three { font-size: .8rem; color: var(--vrc-gold-dark); font-style: italic; margin: 0 0 1.75rem; }

/* Tres portadas en fila, centradas, tamaño controlado */
.vrc-trilogy__covers {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: center;
  gap: 1.25rem;
}

.vrc-tbook {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .5rem;
  text-decoration: none;
  color: inherit;
  flex: 0 0 auto;
  width: 130px;
  transition: transform .25s;
}
.vrc-tbook:hover { transform: translateY(-5px); }
.vrc-tbook--featured { width: 155px; }

.vrc-tbook__spine { display: none; }
.vrc-tbook__body  { display: none; }
.vrc-tbook__price { display: none; }

/* Cómo funciona */
.vrc-how__steps { display: grid; grid-template-columns: repeat(4,1fr); gap: 1rem; margin-bottom: .75rem; }
.vrc-how__step  { border: 1px solid var(--vrc-border); padding: 1.25rem 1rem; }
.vrc-how__n     { display: block; width: 26px; height: 26px; background: rgba(196,168,122,.1); color: var(--vrc-gold); border: 1px solid var(--vrc-border); font-size: 12px; font-weight: 500; text-align: center; line-height: 24px; margin-bottom: .75rem; }
.vrc-how__title { font-size: .85rem; font-weight: 500; margin: 0 0 .35rem; color: var(--vrc-cream); font-family: var(--vrc-sans); }
.vrc-how__desc  { font-size: .78rem; color: var(--vrc-cream-mid); line-height: 1.65; margin: 0; }
.vrc-how__note  { font-size: .78rem; color: var(--vrc-gold-dark); font-style: italic; margin: 0; }

/* Caja destacada "Ediciones personalizadas" — reemplaza el .vrc-how__note simple */
.vrc-how__personalized {
  margin-top: 2.5rem;
  padding: 1.75rem 2rem;
  border: 1px solid var(--vrc-gold, #c4a87a);
  background: rgba(196, 168, 122, 0.06);
  max-width: 560px;
}
.vrc-how__personalized-title {
  font-family: var(--vrc-serif, 'Playfair Display', Georgia, serif);
  font-size: 1.1rem;
  color: var(--vrc-gold, #c4a87a);
  margin: 0 0 .5rem;
}
.vrc-how__personalized-desc {
  color: var(--vrc-cream-mid, #a09080);
  font-size: .9rem;
  margin: 0 0 1rem;
}
.vrc-how__personalized-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .55rem;
}
.vrc-how__personalized-list li {
  display: flex;
  align-items: center;
  gap: .6rem;
  color: var(--vrc-cream, #f0ebe3);
  font-size: .88rem;
}
.vrc-how__check {
  color: var(--vrc-gold, #c4a87a);
  font-weight: 700;
}

/* Catálogo */
.vrc-catalog { display: grid; grid-template-columns: repeat(auto-fill,minmax(160px,1fr)); gap: 1rem; }

.vrc-cat-card {
  display: block;
  border: 1px solid var(--vrc-border);
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: border-color .2s, transform .2s;
}
.vrc-cat-card:hover { border-color: var(--vrc-gold-dim); transform: translateY(-3px); }

.vrc-cat-card__spine  { height: 110px; padding: .75rem; display: flex; align-items: flex-end; position: relative; }
.vrc-cat-card__series { position: absolute; top: 7px; right: 7px; font-size: 9px; background: rgba(255,255,255,.15); color: rgba(255,255,255,.9); padding: 2px 6px; }
.vrc-cat-card__label  { font-family: var(--vrc-serif); font-size: 9px; color: rgba(255,255,255,.75); line-height: 1.4; }
.vrc-cat-card__body   { padding: .75rem; }
.vrc-cat-card__title  { font-family: var(--vrc-serif); font-size: .78rem; font-weight: 600; margin: 0 0 .2rem; line-height: 1.35; color: var(--vrc-cream); }
.vrc-cat-card__author { font-size: .68rem; color: var(--vrc-gold-dim); margin: 0 0 .5rem; }
.vrc-cat-card__footer { display: flex; align-items: center; justify-content: space-between; }
.vrc-cat-card__genre  { font-size: .65rem; color: var(--vrc-gold-dark); }
.vrc-cat-card__price  { font-size: .68rem; color: var(--vrc-gold); border: 1px solid var(--vrc-border); padding: 2px 6px; }

/* Para quién */
.vrc-for-whom__grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(240px,1fr)); gap: .65rem; }
.vrc-for-whom__item { display: flex; align-items: center; gap: .75rem; padding: .8rem 1rem; border: 1px solid var(--vrc-border); font-size: .85rem; color: var(--vrc-cream-mid); }
.vrc-for-whom__dot  { width: 6px; height: 6px; border-radius: 50%; background: var(--vrc-gold); flex-shrink: 0; }

/* Autores */
.vrc-authors { display: grid; grid-template-columns: repeat(auto-fill,minmax(260px,1fr)); gap: 1rem; }

.vrc-author-card {
  display: flex;
  gap: .875rem;
  align-items: flex-start;
  padding: 1.25rem;
  border: 1px solid var(--vrc-border);
  text-decoration: none;
  color: inherit;
  transition: border-color .2s;
}
.vrc-author-card:hover { border-color: var(--vrc-gold-dim); }
.vrc-author-card--new  { border-style: dashed; cursor: default; }
.vrc-author-card--new:hover { border-color: var(--vrc-border); }

.vrc-author-card__av    { width: 44px; height: 44px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-family: var(--vrc-serif); font-size: .95rem; font-weight: 600; flex-shrink: 0; }
.vrc-author-card__name  { font-size: .88rem; color: var(--vrc-cream); font-weight: 500; margin: 0 0 .25rem; font-family: var(--vrc-sans); }
.vrc-author-card__bio   { font-size: .76rem; color: var(--vrc-cream-mid); margin: 0 0 .35rem; line-height: 1.55; }
.vrc-author-card__count { font-size: .72rem; color: var(--vrc-gold-dim); margin: 0; }

/* Newsletter */
.vrc-newsletter        { background: var(--vrc-surface); }
.vrc-newsletter__inner { max-width: 500px; }
.vrc-newsletter__title { font-family: var(--vrc-serif); font-size: 1.25rem; color: var(--vrc-cream); margin: 0 0 .4rem; }
.vrc-newsletter__desc  { font-size: .85rem; color: var(--vrc-cream-mid); margin: 0 0 1.25rem; line-height: 1.65; }
.vrc-newsletter__form  { display: flex; gap: .5rem; flex-wrap: wrap; }
.vrc-newsletter__input { flex: 1; min-width: 200px; padding: .75rem 1rem; background: var(--vrc-surface2); border: 1px solid var(--vrc-border); color: var(--vrc-cream); font-size: .88rem; outline: none; }
.vrc-newsletter__input::placeholder { color: var(--vrc-gold-dark); }
.vrc-newsletter__input:focus { border-color: var(--vrc-gold-dim); }
.vrc-newsletter__msg { font-size: .82rem; margin: 0 0 1rem; padding: .6rem .9rem; border: 1px solid; }
.vrc-newsletter__msg--ok { color: var(--vrc-gold); border-color: var(--vrc-gold-dim); background: rgba(196,168,122,.06); }
.vrc-newsletter__msg--error { color: #d98a8a; border-color: #6a3a3a; background: rgba(217,138,138,.06); }

/* Cierre */
.vrc-close { text-align: center; background: var(--vrc-surface2); }
.vrc-close__quote {
  font-family: var(--vrc-serif);
  font-style: italic;
  font-size: clamp(1.1rem, 2.2vw, 1.6rem);
  color: var(--vrc-cream);
  max-width: 580px;
  margin: 0 auto 1rem;
  line-height: 1.55;
}
.vrc-close__quote em   { font-style: normal; color: var(--vrc-gold); }
.vrc-close__author     { font-size: .75rem; letter-spacing: .14em; text-transform: uppercase; color: var(--vrc-gold-dim); margin: 0 0 .2rem; }
.vrc-close__sub        { font-size: .72rem; color: var(--vrc-gold-dim); margin: 0 0 2rem; } /* AUDITORÍA: gold-dark daba 2.67:1 (falla AA), gold-dim da 5.86:1 */
.vrc-close__btns       { display: flex; gap: .75rem; justify-content: center; flex-wrap: wrap; }

/* ============================================================
   WOOCOMMERCE OVERRIDES — oscuro
   ============================================================ */
.woocommerce ul.products {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px,1fr));
  gap: 1rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.woocommerce ul.products li.product {
  border: 1px solid var(--vrc-border) !important;
  background: var(--vrc-surface) !important;
  border-radius: 0 !important;
  overflow: hidden;
  transition: border-color .2s, transform .2s;
  padding: 0 !important;
  margin: 0 !important;
}
.woocommerce ul.products li.product:hover {
  border-color: var(--vrc-gold-dim) !important;
  transform: translateY(-2px);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: var(--vrc-serif) !important;
  font-size: .88rem !important;
  color: var(--vrc-cream) !important;
  padding: .75rem .75rem 0 !important;
}

.woocommerce ul.products li.product .price {
  color: var(--vrc-gold) !important;
  font-size: .82rem !important;
  padding: 0 .75rem !important;
}

.woocommerce ul.products li.product .button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
  background: var(--vrc-gold) !important;
  color: var(--vrc-ink) !important;
  border-radius: 0 !important;
  border: none !important;
  font-size: .75rem !important;
  letter-spacing: .08em !important;
  font-weight: 500 !important;
  padding: .65rem 1rem !important;
  margin: .5rem .75rem .75rem !important;
  transition: background .15s !important;
}
.woocommerce ul.products li.product .button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
  background: var(--vrc-cream) !important;
  color: var(--vrc-ink) !important;
}

.woocommerce div.product .product_title {
  font-family: var(--vrc-serif) !important;
  color: var(--vrc-cream) !important;
}

.woocommerce div.product p.price { color: var(--vrc-gold) !important; }

.woocommerce div.product .single_add_to_cart_button {
  background: var(--vrc-gold) !important;
  color: var(--vrc-ink) !important;
  border-radius: 0 !important;
  border: none !important;
}
.woocommerce div.product .single_add_to_cart_button:hover {
  background: var(--vrc-cream) !important;
  color: var(--vrc-ink) !important;
}

.woocommerce .star-rating span::before,
.woocommerce .star-rating::before { color: var(--vrc-gold) !important; }

.woocommerce ul.products li.product .onsale {
  background: var(--vrc-gold) !important;
  color: var(--vrc-ink) !important;
  border-radius: 0 !important;
}

.woocommerce .woocommerce-breadcrumb { font-size: .75rem; color: var(--vrc-gold-dark); }
.woocommerce .woocommerce-breadcrumb a { color: var(--vrc-gold-dim); }

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer {
  background: var(--vrc-ink) !important;
  border-top: 1px solid var(--vrc-border-soft) !important;
  color: var(--vrc-gold-dark) !important;
}
.site-footer .col-full {
  max-width: var(--vrc-max-width);
  margin: 0 auto;
  padding: 1.75rem 1.5rem;
}
.site-footer a,
.site-footer a:hover  { color: var(--vrc-gold-dim) !important; }
.site-footer a:hover  { color: var(--vrc-gold) !important; }
.site-info            { display: flex; align-items: center; justify-content: space-between; font-size: .72rem; flex-wrap: wrap; gap: .5rem; }
.site-info .credit,
.site-info__copy      { font-size: .72rem; color: var(--vrc-gold-dark); }

/* ── Footer custom (varcar-footer.php) ──
 * El partial nuevo usa <footer class="footer"> con .footer-links,
 * .footer-legal y .footer-copy. Storefront nunca tuvo estas clases,
 * por eso no había ninguna regla y se veía como texto plano. */
/* ── VARCAR nunca usa sidebar en ninguna página. Storefront a veces
 * agrega la clase body.right-sidebar (WooCommerce la fuerza en carrito,
 * checkout, cuenta, etc.) que deja #primary flotando a un ancho reducido
 * aunque no exista #secondary. Eso dejaba hueco flotante a la derecha
 * donde caía el footer. Forzamos ancho completo siempre. */
#primary,
.content-area {
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

.footer {
  clear: both;
  width: 100%;
  box-sizing: border-box;
  background: var(--vrc-ink);
  border-top: 1px solid var(--vrc-border-soft);
  color: var(--vrc-gold-dark);
  max-width: var(--vrc-max-width);
  margin: 0 auto;
  padding: 2rem 1.5rem 1.5rem;
  text-align: center;
}
.footer-links,
.footer-legal {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .5rem 1.25rem;
  margin: 0 0 1rem;
}
.footer-links a,
.footer-legal a {
  color: var(--vrc-gold-dim);
  text-decoration: none;
  font-size: .8rem;
  letter-spacing: .03em;
  text-transform: uppercase;
  transition: color .2s ease;
}
.footer-links a:hover,
.footer-legal a:hover {
  color: var(--vrc-gold);
}
.footer-legal {
  border-top: 1px solid var(--vrc-border-soft);
  padding-top: 1rem;
  font-size: .72rem;
}
.footer-legal a { font-size: .72rem; text-transform: none; }
.footer-copy {
  font-size: .72rem;
  color: var(--vrc-gold-dark);
  margin: 0;
}

/* ── Epub notice ── */
.vrc-epub-notice {
  font-size: .8rem;
  color: var(--vrc-gold-dim);
  border: 1px solid var(--vrc-border);
  padding: .65rem 1rem;
  margin: 0 0 1rem;
  display: flex;
  gap: .5rem;
  align-items: center;
  line-height: 1.55;
}
.vrc-epub-notice__icon { color: var(--vrc-gold); }

/* ── Amazon block ── */
.vrc-amazon-block { padding: 1.5rem 0 0; }
.vrc-amazon-block__label { font-size: .78rem; color: var(--vrc-gold-dark); margin: 0 0 .5rem; text-transform: uppercase; letter-spacing: .1em; }
.vrc-amazon-block__links { display: flex; gap: .5rem; flex-wrap: wrap; }
.vrc-amazon-btn {
  font-size: .72rem;
  letter-spacing: .08em;
  padding: .4rem .85rem;
  border: 1px solid var(--vrc-border);
  color: var(--vrc-gold-dim);
  text-decoration: none;
  transition: border-color .2s, color .2s;
}
.vrc-amazon-btn:hover { border-color: var(--vrc-gold-dim); color: var(--vrc-gold); }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 900px) {
  .vrc-hero       { grid-template-columns: 1fr; padding: 5rem 1.5rem 3rem; gap: 3rem; }
  .vrc-trilogy    { grid-template-columns: 1fr; gap: 2.5rem; }
  .vrc-how__steps { grid-template-columns: repeat(2,1fr); }
  .main-navigation { display: none; }
}

@media (max-width: 600px) {
  .vrc-hero        { padding: 4.5rem 1rem 2.5rem; }
  .vrc-section     { padding: 2.5rem 1rem; }
  .vrc-how__steps  { grid-template-columns: 1fr; }
  .vrc-catalog     { grid-template-columns: repeat(2,1fr); }
  .vrc-authors     { grid-template-columns: 1fr; }
  .vrc-for-whom__grid { grid-template-columns: 1fr; }
}

/* ============================================================
   WOOCOMMERCE — SHOP PAGE COMPLETA (overrides que faltaban)
   ============================================================ */

/* Título de la página de tienda */
.woocommerce-page .page-title,
.woocommerce-products-header__title,
h1.woocommerce-products-header__title {
  font-family: var(--vrc-serif) !important;
  color: var(--vrc-cream) !important;
  font-size: clamp(1.6rem, 3vw, 2.2rem) !important;
}

/* Área completa de la tienda — fondo oscuro */
.woocommerce-page,
.woocommerce-page body,
body.post-type-archive-product,
body.tax-product_cat {
  background: var(--vrc-ink) !important;
}

/* Contenedor principal de WooCommerce */
.woocommerce-page .woocommerce,
.woocommerce-page .woocommerce-page {
  color: var(--vrc-cream);
}

/* Breadcrumb */
.woocommerce-breadcrumb,
.woocommerce-breadcrumb a {
  color: var(--vrc-gold-dark) !important;
  font-size: .75rem !important;
}
.woocommerce-breadcrumb a:hover { color: var(--vrc-gold-dim) !important; }

/* Resultados y ordenamiento */
.woocommerce-result-count,
.woocommerce-ordering select {
  color: var(--vrc-gold-dim) !important;
  background: var(--vrc-surface) !important;
  border-color: var(--vrc-border) !important;
  font-size: .8rem !important;
}
.woocommerce-ordering select option { background: var(--vrc-surface); color: var(--vrc-cream); }

/* Paginación */
.woocommerce-pagination ul { border: none !important; }
.woocommerce-pagination ul li { border: none !important; }
.woocommerce-pagination ul li a,
.woocommerce-pagination ul li span {
  background: var(--vrc-surface) !important;
  color: var(--vrc-gold-dim) !important;
  border: 1px solid var(--vrc-border) !important;
  border-radius: 0 !important;
  font-size: .78rem !important;
  transition: background .15s, color .15s !important;
}
.woocommerce-pagination ul li a:hover {
  background: var(--vrc-border) !important;
  color: var(--vrc-cream) !important;
}
.woocommerce-pagination ul li span.current {
  background: var(--vrc-gold) !important;
  color: var(--vrc-ink) !important;
  border-color: var(--vrc-gold) !important;
}

/* Mensajes de sistema WooCommerce */
.woocommerce-info,
.woocommerce-message,
.woocommerce-error,
.woocommerce-notice {
  background: var(--vrc-surface) !important;
  border-top-color: var(--vrc-gold) !important;
  color: var(--vrc-cream) !important;
  border-radius: 0 !important;
}
.woocommerce-error { border-top-color: #c62828 !important; }
.woocommerce-info::before,
.woocommerce-message::before { color: var(--vrc-gold) !important; }

/* Carrito — página */
.woocommerce-cart table.shop_table {
  border-color: var(--vrc-border) !important;
  background: var(--vrc-surface) !important;
}
.woocommerce-cart table.shop_table th,
.woocommerce-cart table.shop_table td {
  background: var(--vrc-surface) !important;
  color: var(--vrc-cream) !important;
  border-color: var(--vrc-border) !important;
  font-size: .88rem !important;
}
.woocommerce-cart .cart_totals,
.woocommerce-cart .cart-collaterals {
  background: var(--vrc-surface2) !important;
  border: 1px solid var(--vrc-border) !important;
  color: var(--vrc-cream) !important;
}
.woocommerce-cart .cart_totals h2,
.woocommerce-cart .cart-collaterals h2 {
  color: var(--vrc-cream) !important;
  font-family: var(--vrc-serif) !important;
  font-size: 1.1rem !important;
  border-bottom: 1px solid var(--vrc-border) !important;
  padding-bottom: .75rem !important;
}
.woocommerce-cart .cart_totals table th,
.woocommerce-cart .cart_totals table td {
  border-color: var(--vrc-border) !important;
  color: var(--vrc-cream) !important;
  background: var(--vrc-surface2) !important;
}
.woocommerce-cart .cart_totals .order-total .amount {
  color: var(--vrc-gold) !important;
  font-weight: 600 !important;
}

/* Cupón en el carrito */
.woocommerce-cart .cart-collaterals .cart_totals .shipping-calculator-form,
.woocommerce form.checkout_coupon,
.woocommerce-cart .woocommerce-form-coupon-toggle,
.woocommerce-cart .woocommerce-form-coupon-toggle a {
  color: var(--vrc-cream-mid) !important;
}
.woocommerce form.checkout_coupon .form-row label,
.woocommerce-cart .cart_totals p,
.woocommerce-cart .cart_totals a {
  color: var(--vrc-cream-mid) !important;
}
.woocommerce form.checkout_coupon input.input-text {
  background: var(--vrc-surface) !important;
  border: 1px solid var(--vrc-border) !important;
  color: var(--vrc-cream) !important;
}

/* Botón "Proceder al pago" */
.woocommerce-cart .checkout-button,
.woocommerce-cart a.checkout-button,
.wc-proceed-to-checkout .checkout-button {
  background-color: var(--vrc-gold) !important;
  color: var(--vrc-ink) !important;
  border-color: var(--vrc-gold) !important;
  font-weight: 600 !important;
}
.woocommerce-cart .checkout-button:hover {
  background-color: var(--vrc-cream) !important;
  color: var(--vrc-ink) !important;
}

/* Checkout */
.woocommerce-checkout #customer_details,
.woocommerce-checkout #order_review {
  background: var(--vrc-surface) !important;
  border: 1px solid var(--vrc-border) !important;
  padding: 1.5rem !important;
}
.woocommerce-checkout .woocommerce-billing-fields h3,
.woocommerce-checkout .woocommerce-shipping-fields h3,
.woocommerce-checkout #order_review_heading,
.woocommerce-checkout h3 {
  color: var(--vrc-cream) !important;
  font-family: var(--vrc-serif) !important;
  font-size: 1.05rem !important;
  border-bottom: 1px solid var(--vrc-border) !important;
  padding-bottom: .6rem !important;
}
.woocommerce form .form-row label { color: var(--vrc-cream-mid) !important; font-size: .82rem !important; }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
  background: var(--vrc-surface2) !important;
  border: 1px solid var(--vrc-border) !important;
  color: var(--vrc-cream) !important;
  border-radius: 0 !important;
  font-size: .88rem !important;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
  border-color: var(--vrc-gold-dim) !important;
  outline: none !important;
  box-shadow: none !important;
}
.woocommerce form .form-row input::placeholder,
.woocommerce form .form-row textarea::placeholder { color: var(--vrc-gold-dark) !important; }

/* Tabla de revisión de pedido */
.woocommerce-checkout-review-order table {
  background: var(--vrc-surface) !important;
  border-color: var(--vrc-border) !important;
}
.woocommerce-checkout-review-order table th,
.woocommerce-checkout-review-order table td,
.woocommerce-checkout-review-order-table tbody td,
.woocommerce-checkout-review-order-table tfoot td,
.woocommerce-checkout-review-order-table thead th {
  background: var(--vrc-surface) !important;
  background-color: var(--vrc-surface) !important;
  color: var(--vrc-cream) !important;
  border-color: var(--vrc-border) !important;
  font-size: .88rem !important;
}
.woocommerce-checkout-review-order table tfoot tr th,
.woocommerce-checkout-review-order table tfoot tr td { color: var(--vrc-cream) !important; }
#order_review .order-total .amount { color: var(--vrc-gold) !important; font-size: 1.1rem !important; }

/* Métodos de pago */
#payment { background: var(--vrc-surface2) !important; border-radius: 0 !important; }
#payment .payment_methods li { border-color: var(--vrc-border) !important; background: transparent !important; }
#payment .payment_methods li label { color: var(--vrc-cream) !important; font-size: .88rem !important; }
/* Fondo de la fila seleccionada/activa — evita texto claro sobre fondo claro */
#payment ul.payment_methods li.woocommerce-PaymentMethod,
#payment ul.payment_methods li.wc_payment_method {
  background: var(--vrc-surface2) !important;
}
#payment ul.payment_methods li input[type="radio"]:checked ~ label,
#payment ul.payment_methods li.woocommerce-PaymentMethod--active {
  background: var(--vrc-surface2) !important;
  color: var(--vrc-cream) !important;
}
#payment .payment_box { background: var(--vrc-ink) !important; color: var(--vrc-cream-mid) !important; }

/* Campo "Comprobante" (input file) — wrapper personalizado y legible */
#payment .payment_box .vrc-file-wrap {
  position: relative;
  display: block;
  width: 100%;
  max-width: 100%;
}
#payment .payment_box .vrc-file-wrap input[type="file"] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
  z-index: 2;
}
#payment .payment_box .vrc-file-wrap .vrc-file-btn {
  display: inline-block;
  background: transparent;
  border: 1px solid var(--vrc-border);
  color: var(--vrc-gold);
  font-size: .72rem;
  letter-spacing: .04em;
  padding: .55rem .9rem;
  border-radius: 2px;
  white-space: nowrap;
}
#payment .payment_box .vrc-file-wrap .vrc-file-name {
  display: block;
  margin-top: .4rem;
  font-size: .76rem;
  color: var(--vrc-cream) !important;
  word-break: break-all;
}

/* Fallback: si JS no corre, al menos el texto nativo no se ve invisible */
#payment .payment_box input[type="file"] {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  font-size: .78rem !important;
  color: var(--vrc-cream) !important;
  padding: .5rem 0 !important;
}
/* Botón nativo "Seleccionar archivo" dentro del input file */
#payment .payment_box input[type="file"]::-webkit-file-upload-button,
#payment .payment_box input[type="file"]::file-selector-button {
  background: transparent !important;
  border: 1px solid var(--vrc-border) !important;
  color: var(--vrc-gold) !important;
  font-size: .72rem !important;
  letter-spacing: .04em !important;
  padding: .45rem .75rem !important;
  border-radius: 2px !important;
  cursor: pointer !important;
  margin-right: .6rem !important;
  max-width: 100% !important;
  white-space: nowrap !important;
}
#payment .payment_box input[type="file"]::-webkit-file-upload-button:hover,
#payment .payment_box input[type="file"]::file-selector-button:hover {
  background: rgba(196,168,122,.08) !important;
}
/* Contenedor del campo: que nunca se desborde del ancho del checkout */
#payment .payment_box .form-row,
#payment .payment_box p {
  max-width: 100% !important;
  overflow: hidden !important;
}

@media (max-width: 480px) {
  #payment .payment_box input[type="file"] {
    display: block !important;
    font-size: .7rem !important;
  }
  #payment .payment_box input[type="file"]::-webkit-file-upload-button,
  #payment .payment_box input[type="file"]::file-selector-button {
    display: block !important;
    width: 100% !important;
    margin: 0 0 .4rem 0 !important;
    text-align: center !important;
  }
}

/* Página "Mi cuenta" */
.woocommerce-MyAccount-navigation {
  background: var(--vrc-surface) !important;
  border: 1px solid var(--vrc-border) !important;
}
.woocommerce-MyAccount-navigation ul li a {
  color: var(--vrc-gold-dim) !important;
  border-bottom: 1px solid var(--vrc-border) !important;
  font-size: .85rem !important;
}
.woocommerce-MyAccount-navigation ul li a:hover { color: var(--vrc-cream) !important; }
.woocommerce-MyAccount-navigation ul li.is-active a { color: var(--vrc-gold) !important; }
.woocommerce-MyAccount-content { color: var(--vrc-cream) !important; }
.woocommerce-MyAccount-content table { border-color: var(--vrc-border) !important; }
.woocommerce-MyAccount-content table th,
.woocommerce-MyAccount-content table td {
  color: var(--vrc-cream-mid) !important;
  border-color: var(--vrc-border) !important;
  background: var(--vrc-surface) !important;
  font-size: .85rem !important;
}

/* Página de producto individual — zonas que faltaban */
.woocommerce div.product .woocommerce-tabs ul.tabs {
  background: transparent !important;
  border-bottom-color: var(--vrc-border) !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li {
  background: var(--vrc-surface) !important;
  border-color: var(--vrc-border) !important;
  border-radius: 0 !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  color: var(--vrc-gold-dim) !important;
  font-size: .82rem !important;
  letter-spacing: .06em !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
  background: var(--vrc-surface2) !important;
  border-bottom-color: var(--vrc-surface2) !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--vrc-cream) !important; }
.woocommerce div.product .woocommerce-tabs .panel {
  background: var(--vrc-surface2) !important;
  border: 1px solid var(--vrc-border) !important;
  border-top: none !important;
  color: var(--vrc-cream-mid) !important;
  padding: 1.5rem !important;
  font-size: .88rem !important;
  line-height: 1.75 !important;
}

/* Stock */
.woocommerce div.product p.stock.in-stock  { color: #2e7d32 !important; }
.woocommerce div.product p.stock.out-of-stock { color: #c62828 !important; }

/* Widget sidebar — si existe */
.widget_product_categories ul li a,
.widget_layered_nav ul li a { color: var(--vrc-gold-dim) !important; font-size: .85rem !important; }
.widget_product_categories ul li a:hover,
.widget_layered_nav ul li a:hover { color: var(--vrc-cream) !important; }
.widget_price_filter .price_slider_wrapper .ui-widget-content { background: var(--vrc-border) !important; }
.widget_price_filter .price_slider_wrapper .ui-slider-range { background: var(--vrc-gold) !important; }
.widget_price_filter .price_slider_wrapper .ui-slider-handle { background: var(--vrc-gold) !important; border-color: var(--vrc-gold) !important; }
.widget_price_filter .price_slider_amount .price_label { color: var(--vrc-cream-mid) !important; font-size: .8rem !important; }

/* ============================================================
   HEADER STOREFRONT — MOBILE MENU (hamburger expandido)
   ============================================================ */
@media (max-width: 900px) {
  /* Mostrar el burger y arreglarlo para dark mode */
  button.menu-toggle { display: block !important; }

  /* Menú desplegado en móvil */
  .main-navigation.toggled ul,
  .main-navigation ul.menu {
    display: block !important;
    background: var(--vrc-surface) !important;
    border: 1px solid var(--vrc-border) !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 100 !important;
    padding: .5rem 0 !important;
  }
  .main-navigation ul li { border-bottom: 1px solid var(--vrc-border) !important; }
  .main-navigation ul li:last-child { border-bottom: none !important; }
  .main-navigation ul li a {
    display: block !important;
    padding: .8rem 1.5rem !important;
    font-size: 12px !important;
  }
}

/* ============================================================
   STOREFRONT HEADER — fuerza posición relativa para menú
   móvil absoluto
   ============================================================ */
.site-header { position: relative !important; }


/* ============================================================
   NUCLEAR OVERRIDE — Elimina todos los azules de Storefront
   Estos selectores tienen especificidad mayor que los de Storefront
   ============================================================ */

/* Footer — Storefront usa #colophon además de .site-footer */
#colophon,
#colophon .widget-area,
#colophon .widget-title,
.site-footer,
.footer-widgets,
.footer-widget-area {
  background-color: var(--vrc-ink) !important;
  background: var(--vrc-ink) !important;
  color: var(--vrc-gold-dark) !important;
  border-top-color: var(--vrc-border-soft) !important;
}

/* "Built with WooCommerce" y créditos del footer */
#colophon .site-info,
.site-info,
.site-info p,
.site-info a,
p.woocommerce-store-notice {
  color: var(--vrc-gold-dark) !important;
  background: transparent !important;
}
.site-info a:hover { color: var(--vrc-gold-dim) !important; }

/* Todos los h1-h4 en cualquier contexto — derrota los selectores de Storefront */
body h1, body h2, body h3, body h4, body h5, body h6,
.site-content h1, .site-content h2, .site-content h3,
.site-content h4, .site-content h5, .site-content h6,
.entry-content h1, .entry-content h2, .entry-content h3,
.entry-content h4, .entry-content h5, .entry-content h6,
.hentry h1, .hentry h2, .hentry h3, .hentry h4,
article h1, article h2, article h3, article h4,
.widget-title,
.widgettitle {
  color: var(--vrc-cream) !important;
  font-family: var(--vrc-serif) !important;
}

/* Links — Storefront los pone azules en muchos contextos
   Excluimos explícitamente los botones propios de VARCAR
   y los botones del bloque de carrito/checkout de WC Blocks */
body a:not(.vrc-btn):not(.vrc-btn--primary):not(.vrc-btn--ghost):not(.nav-cta):not(.btn-primary):not(.btn-ghost):not(.btn-sm):not(.btn-download):not(.vrc-hero__trilogy-link):not(.vrc-section__link):not(.wc-block-cart__submit-button):not(.wc-block-components-checkout-place-order-button),
.site-content a:not(.vrc-btn):not(.vrc-btn--primary):not(.vrc-btn--ghost):not(.wc-block-cart__submit-button):not(.wc-block-components-checkout-place-order-button),
.entry-content a:not(.vrc-btn):not(.vrc-btn--primary):not(.vrc-btn--ghost):not(.wc-block-cart__submit-button):not(.wc-block-components-checkout-place-order-button),
.hentry a:not(.vrc-btn):not(.vrc-btn--primary):not(.vrc-btn--ghost):not(.wc-block-cart__submit-button):not(.wc-block-components-checkout-place-order-button) {
  color: var(--vrc-gold) !important;
}
body a:not(.vrc-btn):not(.vrc-btn--primary):not(.vrc-btn--ghost):not(.nav-cta):not(.btn-primary):not(.btn-ghost):not(.btn-sm):not(.btn-download):hover,
.site-content a:not(.vrc-btn):not(.vrc-btn--primary):not(.vrc-btn--ghost):hover,
.entry-content a:not(.vrc-btn):not(.vrc-btn--primary):not(.vrc-btn--ghost):hover {
  color: var(--vrc-cream) !important;
}

/* Botones WooCommerce nativos — tinta oscura sobre dorado */
body a.button,
body .button,
body input[type="submit"],
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
  color: var(--vrc-ink) !important;
}
body a.button:hover,
.woocommerce a.button:hover { color: var(--vrc-ink) !important; }

/* Botones propios VARCAR — restaurar colores correctos con alta especificidad */
a.vrc-btn--primary,
.vrc-btn--primary,
body a.vrc-btn--primary {
  color: var(--vrc-ink) !important;
  background: var(--vrc-gold) !important;
}
a.vrc-btn--primary:hover,
.vrc-btn--primary:hover,
body a.vrc-btn--primary:hover {
  color: var(--vrc-ink) !important;
  background: var(--vrc-cream) !important;
}
a.vrc-btn--ghost,
.vrc-btn--ghost,
body a.vrc-btn--ghost {
  color: var(--vrc-cream-mid) !important;
  background: transparent !important;
}
a.vrc-btn--ghost:hover,
.vrc-btn--ghost:hover,
body a.vrc-btn--ghost:hover {
  color: var(--vrc-cream) !important;
}

/* Sección newsletter / "Mantente al tanto" — título azul */
.vrc-newsletter h2,
.vrc-newsletter h3,
.vrc-newsletter__title,
section.vrc-newsletter *[class*="title"],
.wp-block-heading {
  color: var(--vrc-cream) !important;
}

/* Cita en hero — span o em que hereda azul */
.vrc-pullquote em,
.vrc-pullquote span,
.vrc-pullquote a,
blockquote em,
blockquote span,
.vrc-hero blockquote span,
.vrc-hero em span {
  color: var(--vrc-gold) !important;
}

/* Widgets del sidebar y footer */
.widget h2, .widget h3,
.widget ul li a,
.widget_recent_entries ul li a,
.widget_pages ul li a,
.widget_nav_menu ul li a,
.widget_categories ul li a {
  color: var(--vrc-gold-dim) !important;
}
.widget ul li a:hover,
.widget_nav_menu ul li a:hover { color: var(--vrc-cream) !important; }

/* Woo: precio, rating, tabs — colores que Storefront sobreescribe */
.woocommerce .price,
.woocommerce ins .amount,
.woocommerce .amount {
  color: var(--vrc-gold) !important;
}
.woocommerce del .amount { color: var(--vrc-cream-mid) !important; opacity: 1; } /* AUDITORÍA: gold-dark+opacity .6 daba 1.76:1 (falla grave); el tachado ya de-enfatiza el precio, no hace falta bajar tanto el contraste */

/* Botón "place order" y submit en checkout */
#place_order,
.woocommerce #payment #place_order {
  background-color: var(--vrc-gold) !important;
  color: var(--vrc-ink) !important;
  border-color: var(--vrc-gold) !important;
}
#place_order:hover { background-color: var(--vrc-cream) !important; }


/* ============================================================
   PÁGINA "PEDIDO RECIBIDO" — order-received
   ============================================================ */

/* Contenedor principal del recibo */
.woocommerce-order,
.woocommerce-order ul.woocommerce-thankyou-order-details,
.woocommerce-order .woocommerce-order-overview {
  background: var(--vrc-surface, #111) !important;
  color: var(--vrc-cream) !important;
  border: 1px solid var(--vrc-border) !important;
}

/* Eliminar el zigzag decorativo */
.woocommerce-order ul.woocommerce-thankyou-order-details,
ul.woocommerce-thankyou-order-details {
  background: var(--vrc-surface, #111) !important;
  border: 1px solid var(--vrc-border) !important;
  /* El zigzag viene de un clip-path o background SVG */
  -webkit-clip-path: none !important;
  clip-path: none !important;
  background-image: none !important;
  padding: 2rem !important;
  margin: 0 0 2rem !important;
  list-style: none !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)) !important;
  gap: 1.5rem !important;
}

ul.woocommerce-thankyou-order-details li,
.woocommerce-order-overview li {
  background: transparent !important;
  border: none !important;
  border-right: 1px solid var(--vrc-border) !important;
  padding: 0 1.5rem 0 0 !important;
  margin: 0 !important;
  color: var(--vrc-cream) !important;
}
ul.woocommerce-thankyou-order-details li:last-child,
.woocommerce-order-overview li:last-child {
  border-right: none !important;
}
ul.woocommerce-thankyou-order-details li strong,
.woocommerce-order-overview li strong {
  display: block !important;
  color: var(--vrc-gold, #c4a87a) !important;
  font-size: 1.1rem !important;
  margin-top: .3rem !important;
}

/* Tabla de detalles del pedido */
.woocommerce-order table.woocommerce-table,
.woocommerce-order-details table,
table.woocommerce-table--order-details {
  background: var(--vrc-surface, #111) !important;
  border-color: var(--vrc-border) !important;
}
.woocommerce-order table.woocommerce-table th,
.woocommerce-order table.woocommerce-table td,
table.woocommerce-table--order-details th,
table.woocommerce-table--order-details td {
  background: var(--vrc-surface, #111) !important;
  background-color: var(--vrc-surface, #111) !important;
  color: var(--vrc-cream) !important;
  border-color: var(--vrc-border) !important;
}
table:not(.has-background) tbody tr:nth-child(2n) td {
  background-color: var(--vrc-surface2, #161616) !important;
}
.woocommerce-order tfoot tr th,
.woocommerce-order tfoot tr td {
  background: var(--vrc-ink) !important;
  color: var(--vrc-cream) !important;
  border-color: var(--vrc-border) !important;
}
.woocommerce-order .order-total .amount { color: var(--vrc-gold) !important; }

/* Dirección de facturación en confirmación */
.woocommerce-order .woocommerce-customer-details,
.woocommerce-order address {
  background: var(--vrc-surface, #111) !important;
  border: 1px solid var(--vrc-border) !important;
  color: var(--vrc-cream-mid, #c8bfb2) !important;
  padding: 1.5rem !important;
}
.woocommerce-order .woocommerce-column__title,
.woocommerce-customer-details h2 {
  color: var(--vrc-cream) !important;
  font-family: var(--vrc-serif) !important;
  font-size: 1rem !important;
  border-bottom: 1px solid var(--vrc-border) !important;
  padding-bottom: .5rem !important;
  margin-bottom: 1rem !important;
}

/* Mensaje de confirmación "Gracias. Tu pedido..." */
.woocommerce-notice--success,
.woocommerce-thankyou-order-received {
  background: var(--vrc-surface, #111) !important;
  color: var(--vrc-cream-mid) !important;
  border-left: 3px solid var(--vrc-gold) !important;
  padding: 1rem 1.5rem !important;
}

/* ============================================================
   FIXES — barra azul nav + miniaturas de productos
   ============================================================ */

/* Eliminar fondo azul de la barra de navegación primaria de Storefront */
.storefront-primary-navigation {
  background: var(--vrc-ink, #111) !important;
  border-bottom: 1px solid var(--vrc-border, #1e1a14) !important;
}

/* Miniaturas de producto: ancho completo para evitar texto vertical
   (el alto lo controla el contenedor con aspect-ratio donde aplique;
   excluye vrc-product-card, que usa su propio sistema con object-fit:contain) */
.woocommerce ul.products li.product:not(.vrc-product-card) img {
  width: 100% !important;
  display: block !important;
  object-fit: cover !important;
}

/* ============================================================
   FIX — productos relacionados: cards anchas, sin texto vertical
   ============================================================ */
.related.products ul.products,
.upsells.products ul.products {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)) !important;
  width: 100% !important;
}

.related.products ul.products li.product,
.upsells.products ul.products li.product {
  width: 100% !important;
  min-width: 180px !important;
  max-width: none !important;
  float: none !important;
  clear: none !important;
}

.related.products ul.products li.product img,
.upsells.products ul.products li.product img {
  width: 100% !important;
  height: auto !important;
  min-height: 180px !important;
  object-fit: cover !important;
}

.related.products ul.products li.product .woocommerce-loop-product__title,
.upsells.products ul.products li.product .woocommerce-loop-product__title {
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
  word-break: normal !important;
  white-space: normal !important;
  width: auto !important;
}

/* ============================================================
   FIX — botón sticky "Añadir al carrito" (barra flotante)
   ============================================================ */
.woocommerce-sticky-add-to-cart a.button,
.woocommerce-sticky-add-to-cart .button,
.wc-sticky-add-to-cart a.button,
.wc-sticky-add-to-cart .button,
.storefront-sticky-add-to-cart a.button,
.storefront-sticky-add-to-cart .button,
a.single_add_to_cart_button,
button.single_add_to_cart_button,
.single_add_to_cart_button {
  background: var(--vrc-gold, #c4a87a) !important;
  color: var(--vrc-ink, #111) !important;
  border: none !important;
  border-radius: 0 !important;
}

.woocommerce-sticky-add-to-cart a.button:hover,
.woocommerce-sticky-add-to-cart .button:hover,
.storefront-sticky-add-to-cart a.button:hover,
.storefront-sticky-add-to-cart .button:hover,
a.single_add_to_cart_button:hover,
button.single_add_to_cart_button:hover {
  background: var(--vrc-cream, #f0ebe3) !important;
  color: var(--vrc-ink, #111) !important;
}

/* Fondo de la barra sticky */
.woocommerce-sticky-add-to-cart,
.storefront-sticky-add-to-cart {
  background: var(--vrc-surface, #111) !important;
  border-top: 1px solid var(--vrc-border, #1e1a14) !important;
}

/* ============================================================
   FIX — texto invisible en botón de producto relacionado
   ============================================================ */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product a.button {
  color: var(--vrc-ink, #111) !important;
  font-size: .75rem !important;
  letter-spacing: .08em !important;
  text-indent: 0 !important;
  font-weight: 600 !important;
  display: block !important;
  text-align: center !important;
}

/* ============================================================
   FIX — texto del botón "Añadir al carrito" en productos relacionados
   color dorado sobre dorado → forzar color oscuro
   ============================================================ */
a.button.product_type_simple.add_to_cart_button,
a.button.ajax_add_to_cart,
.related.products a.button,
.related.products .button,
.upsells.products a.button,
.upsells.products .button {
  color: var(--vrc-ink, #111) !important;
  background: var(--vrc-gold, #c4a87a) !important;
}

a.button.product_type_simple.add_to_cart_button:hover,
a.button.ajax_add_to_cart:hover,
.related.products a.button:hover,
.upsells.products a.button:hover {
  color: var(--vrc-ink, #111) !important;
  background: var(--vrc-cream, #f0ebe3) !important;
}

/* ============================================================
   FIX — botón sticky "Añadir al carrito" (storefront-sticky-add-to-cart)
   ============================================================ */
.storefront-sticky-add-to-cart {
  background: var(--vrc-surface, #111) !important;
  border-top: 1px solid var(--vrc-border, #1e1a14) !important;
}

.storefront-sticky-add-to-cart a.button,
.storefront-sticky-add-to-cart a.single_add_to_cart_button,
.storefront-sticky-add-to-cart button.single_add_to_cart_button,
.storefront-sticky-add-to-cart .single_add_to_cart_button,
section.storefront-sticky-add-to-cart a.button {
  background: var(--vrc-gold, #c4a87a) !important;
  background-color: var(--vrc-gold, #c4a87a) !important;
  color: var(--vrc-ink, #111) !important;
  border: none !important;
  border-radius: 0 !important;
}

.storefront-sticky-add-to-cart a.button:hover,
section.storefront-sticky-add-to-cart a.button:hover {
  background: var(--vrc-cream, #f0ebe3) !important;
  background-color: var(--vrc-cream, #f0ebe3) !important;
  color: var(--vrc-ink, #111) !important;
}

/* ============================================================
   FIX DEFINITIVO — texto invisible en botones dorados
   el selector largo body a:not(...) pone color gold en links
   estos selectores lo sobreescriben con mayor especificidad
   ============================================================ */
body .storefront-sticky-add-to-cart a.button,
body .storefront-sticky-add-to-cart a.single_add_to_cart_button,
body section.storefront-sticky-add-to-cart a.button {
  color: #111111 !important;
}
body .storefront-sticky-add-to-cart a.button:hover,
body .storefront-sticky-add-to-cart a.single_add_to_cart_button:hover,
body section.storefront-sticky-add-to-cart a.button:hover {
  color: #111111 !important;
}

body .woocommerce ul.products li.product a.button,
body .woocommerce ul.products li.product a.add_to_cart_button,
body .related.products ul.products li.product a.button,
body .upsells.products ul.products li.product a.button {
  color: #111111 !important;
}
body .woocommerce ul.products li.product a.button:hover,
body .woocommerce ul.products li.product a.add_to_cart_button:hover,
body .related.products ul.products li.product a.button:hover,
body .upsells.products ul.products li.product a.button:hover {
  color: #111111 !important;
}

/* ============================================================
   FIX DEFINITIVO — sobreescribir selector gold en botones WC
   copiado exacto del selector ganador en línea 981
   ============================================================ */
body a:not(.vrc-btn):not(.vrc-btn--primary):not(.vrc-btn--ghost):not(.nav-cta):not(.btn-primary):not(.btn-ghost):not(.btn-sm):not(.vrc-hero__trilogy-link):not(.vrc-section__link):not(.vrc-product-card__btn).button.product_type_simple.add_to_cart_button,
body a:not(.vrc-btn):not(.vrc-btn--primary):not(.vrc-btn--ghost):not(.nav-cta):not(.btn-primary):not(.btn-ghost):not(.btn-sm):not(.vrc-hero__trilogy-link):not(.vrc-section__link):not(.vrc-product-card__btn).button.ajax_add_to_cart,
body .storefront-sticky-add-to-cart a:not(.vrc-btn) {
  color: #111111 !important;
}
body a:not(.vrc-btn):not(.vrc-btn--primary):not(.vrc-btn--ghost):not(.nav-cta):not(.btn-primary):not(.btn-ghost):not(.btn-sm):not(.vrc-hero__trilogy-link):not(.vrc-section__link):not(.vrc-product-card__btn).button.product_type_simple.add_to_cart_button:hover,
body a:not(.vrc-btn):not(.vrc-btn--primary):not(.vrc-btn--ghost):not(.nav-cta):not(.btn-primary):not(.btn-ghost):not(.btn-sm):not(.vrc-hero__trilogy-link):not(.vrc-section__link):not(.vrc-product-card__btn).button.ajax_add_to_cart:hover,
body .storefront-sticky-add-to-cart a:not(.vrc-btn):hover {
  color: #111111 !important;
}

/* ============================================================
   FIX — botón sticky: clase real es __content-button button alt
   ============================================================ */
.storefront-sticky-add-to-cart__content-button,
.storefront-sticky-add-to-cart .button.alt,
body .storefront-sticky-add-to-cart .button.alt,
body a:not(.vrc-btn):not(.vrc-btn--primary):not(.vrc-btn--ghost):not(.nav-cta):not(.btn-primary):not(.btn-ghost):not(.btn-sm):not(.vrc-hero__trilogy-link):not(.vrc-section__link).storefront-sticky-add-to-cart__content-button {
  background: var(--vrc-gold, #c4a87a) !important;
  background-color: var(--vrc-gold, #c4a87a) !important;
  color: #111111 !important;
  border: none !important;
  border-radius: 0 !important;
}
.storefront-sticky-add-to-cart__content-button:hover,
.storefront-sticky-add-to-cart .button.alt:hover,
body .storefront-sticky-add-to-cart .button.alt:hover,
body a:not(.vrc-btn):not(.vrc-btn--primary):not(.vrc-btn--ghost):not(.nav-cta):not(.btn-primary):not(.btn-ghost):not(.btn-sm):not(.vrc-hero__trilogy-link):not(.vrc-section__link).storefront-sticky-add-to-cart__content-button:hover {
  background: var(--vrc-gold, #c4a87a) !important;
  background-color: var(--vrc-gold, #c4a87a) !important;
  color: #111111 !important;
}

/* ============================================================
   FIX — tienda: ul.products.columns-3 cards angostas
   ============================================================ */
.woocommerce ul.products.columns-3,
.woocommerce-page ul.products.columns-3 {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  width: 100% !important;
  float: none !important;
}

.woocommerce ul.products.columns-3 li.product,
.woocommerce-page ul.products.columns-3 li.product {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  float: none !important;
  margin: 0 !important;
}

.woocommerce ul.products.columns-3 li.product:not(.vrc-product-card) img,
.woocommerce-page ul.products.columns-3 li.product:not(.vrc-product-card) img {
  width: 100% !important;
  object-fit: cover !important;
}

@media (max-width: 768px) {
  .woocommerce ul.products.columns-3,
  .woocommerce-page ul.products.columns-3 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 480px) {
  .woocommerce ul.products.columns-3,
  .woocommerce-page ul.products.columns-3 {
    grid-template-columns: 1fr !important;
  }
}

/* ============================================================
   SUBMENÚ DESPLEGABLE — Storefront header + homepage nav
   ============================================================ */

/* Storefront — sub-menu */
.main-navigation ul ul,
.main-navigation ul .sub-menu {
  display: none;
  position: absolute;
  top: 100%; left: 0;
  min-width: 200px;
  background: var(--vrc-surface, #111) !important;
  border: 1px solid var(--vrc-border, #2a2016) !important;
  border-top: 2px solid var(--vrc-gold, #c4a87a) !important;
  z-index: 9999;
  padding: .4rem 0 !important;
  flex-direction: column !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.4);
}
.main-navigation ul li:hover > ul,
.main-navigation ul li:hover > .sub-menu,
.main-navigation ul li.focus > ul {
  display: flex !important;
  flex-direction: column !important;
}
.main-navigation ul ul li,
.main-navigation ul .sub-menu li {
  width: 100%;
  border-bottom: 1px solid var(--vrc-border, #2a2016) !important;
  background: transparent !important;
}
.main-navigation ul ul li:last-child,
.main-navigation ul .sub-menu li:last-child {
  border-bottom: none !important;
}
.main-navigation ul ul li a,
.main-navigation ul .sub-menu li a {
  font-size: 10px !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  color: var(--vrc-cream-mid, #a09080) !important;
  padding: .75rem 1.25rem !important;
  display: block !important;
  white-space: nowrap !important;
  transition: color .15s, background .15s !important;
  background: transparent !important;
}
.main-navigation ul ul li a:hover,
.main-navigation ul .sub-menu li a:hover {
  color: var(--vrc-cream, #f0ebe3) !important;
  background: var(--vrc-surface2, #161616) !important;
}

/* Flecha indicadora en items con hijos */
.main-navigation ul li.menu-item-has-children > a::after {
  content: ' ▾';
  font-size: 8px;
  opacity: .6;
}

/* Homepage nav — mismo tratamiento */
.vrc-nav-menu li ul {
  display: none;
  position: absolute; top: 100%; left: 0;
  min-width: 200px;
  background: var(--vrc-surface, #111) !important;
  border: 1px solid var(--vrc-border, #2a2016) !important;
  border-top: 2px solid var(--vrc-gold, #c4a87a) !important;
  z-index: 9999;
  padding: .4rem 0;
  box-shadow: 0 8px 24px rgba(0,0,0,.4);
}
.vrc-nav-menu li:hover > ul { display: block; }
.vrc-nav-menu li ul li {
  border-bottom: 1px solid var(--vrc-border, #2a2016);
  width: 100%;
}
.vrc-nav-menu li ul li:last-child { border-bottom: none; }
.vrc-nav-menu li ul li a {
  padding: .75rem 1.25rem !important;
  display: block !important;
  font-size: 10px !important;
  white-space: nowrap !important;
  color: var(--vrc-cream-mid, #a09080) !important;
}
.vrc-nav-menu li ul li a:hover {
  color: var(--vrc-cream, #f0ebe3) !important;
  background: var(--vrc-surface2, #161616) !important;
}
.vrc-nav-menu li.menu-item-has-children > a::after {
  content: ' ▾'; font-size: 8px; opacity: .6;
}

/* Móvil — submenú como lista vertical */
@media (max-width: 900px) {
  .main-navigation ul ul,
  .main-navigation ul .sub-menu {
    position: static !important;
    border-top: none !important;
    border-left: 2px solid var(--vrc-gold3, #6b5840) !important;
    margin-left: 1rem !important;
    box-shadow: none !important;
  }
  .main-navigation ul li:hover > ul { display: flex !important; }
}


/* ============================================================
   HERO FULLSCREEN — imagen de fondo (hero-doors.jpg)
   ============================================================ */

/* Sección contenedora */
.vrc-hero--fullbg {
  position: relative;
  width: 100%;
  max-width: none !important;
  margin: 0 !important;
  height: 100svh;
  min-height: 620px;
  display: flex;
  align-items: center;
  overflow: hidden;
  padding: 0;
  border-bottom: none !important;
  /* anula el grid de dos columnas del hero anterior */
  grid-template-columns: unset;
  gap: unset;
}

/* Imagen de fondo */
.vrc-hero__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

/* Overlay: oscurece la izquierda donde va el texto,
   deja ver la imagen en el centro/derecha */
.vrc-hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to right,
    rgba(5, 3, 2, 0.82) 0%,
    rgba(5, 3, 2, 0.60) 38%,
    rgba(5, 3, 2, 0.18) 70%,
    rgba(5, 3, 2, 0.00) 100%
  );
}

/* Contenido: pegado a la izquierda, sobre el overlay */
.vrc-hero__content {
  position: relative;
  z-index: 2;
  max-width: var(--vrc-max-width, 1200px);
  width: 100%;
  margin: 0 auto;
  padding: 7rem 2rem 4rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.2rem;
}

/* Eyebrow */
.vrc-hero--fullbg .vrc-eyebrow {
  font-family: var(--vrc-sans);
  font-size: 10px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--vrc-gold);
  margin: 0;
  line-height: 1;
}

/* Título principal */
.vrc-hero--fullbg .vrc-hero__title {
  font-family: var(--vrc-serif);
  font-size: clamp(2.8rem, 5.2vw, 5rem);
  font-weight: 600;
  line-height: 1.08;
  color: var(--vrc-cream);
  margin: 0;
  max-width: 540px;
}
.vrc-hero--fullbg .vrc-hero__title em {
  font-style: italic;
  color: var(--vrc-gold);
  font-weight: 400;
}

/* Separador con emoji labios */
.vrc-hero__divider {
  line-height: 1;
  margin: -.1rem 0;
}

/* Subtítulo */
.vrc-hero--fullbg .vrc-hero__sub {
  font-family: var(--vrc-sans);
  font-size: .88rem;
  line-height: 1.7;
  color: rgba(240, 235, 227, 0.75);
  max-width: 360px;
  margin: 0;
}

/* Botones */
.vrc-hero--fullbg .vrc-hero__btns {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: .4rem;
}

/* ── Responsive: tablet ── */
@media (max-width: 900px) {
  .vrc-hero--fullbg {
    min-height: 580px;
  }
  .vrc-hero__overlay {
    background: linear-gradient(
      to right,
      rgba(5,3,2,.88) 0%,
      rgba(5,3,2,.65) 50%,
      rgba(5,3,2,.20) 100%
    );
  }
}

/* ── Responsive: móvil ── */
@media (max-width: 640px) {

  /* En móvil: imagen completa arriba, texto debajo */
  .vrc-hero--fullbg {
    height: auto;
    min-height: unset;
    flex-direction: column;
    align-items: stretch;
  }

  /* La imagen ocupa su proporción natural (16:9 aprox) y se ve completa */
  .vrc-hero__bg {
    position: relative;
    width: 100%;
    padding-top: 56.25%;   /* proporción 16:9 — ajusta a 50% si prefieres más cuadrada */
    background-size: cover;
    background-position: center center;
    flex-shrink: 0;
  }

  /* Overlay solo en la parte baja de la imagen para suavizar el corte */
  .vrc-hero__overlay {
    background: linear-gradient(
      to top,
      rgba(5,3,2,1.0)  0%,
      rgba(5,3,2,.15) 40%,
      rgba(5,3,2,.00) 100%
    );
  }

  /* El contenido va debajo de la imagen, sobre fondo oscuro */
  .vrc-hero__content {
    position: relative;
    z-index: 2;
    padding: 2rem 1.5rem 3rem;
    gap: 1rem;
    background: var(--vrc-ink, #0a0a0a);
    margin-top: -2px; /* elimina gap entre imagen y texto */
  }

  .vrc-hero--fullbg .vrc-hero__title {
    font-size: clamp(1.9rem, 7.5vw, 2.6rem);
    max-width: 100%;
  }
  .vrc-hero--fullbg .vrc-hero__sub {
    max-width: 100%;
    font-size: .85rem;
  }
  .vrc-hero--fullbg .vrc-hero__btns {
    flex-direction: column;
    width: 100%;
  }
  .vrc-hero--fullbg .vrc-hero__btns .vrc-btn {
    text-align: center;
    width: 100%;
  }
}

/* ============================================================
   PORTADAS — trilogía y catálogo
   ============================================================ */

/* Portada individual */
.vrc-tbook__cover {
  position: relative;
  width: 100%;
  aspect-ratio: 2 / 3;
  border-radius: 3px;
  overflow: hidden;
  box-shadow: 4px 8px 20px rgba(0,0,0,.6);
}
.vrc-tbook__cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .35s;
}
.vrc-tbook:hover .vrc-tbook__cover img { transform: scale(1.04); }

/* Fallback sin imagen */
.vrc-tbook__cover-fallback {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: .85rem;
  gap: .25rem;
}
/* AUDITORÍA: cream a 50% opacidad da 2.98–4.1:1 según el color de fondo (falla AA en 2 de 3).
   Solo se ve si el producto no tiene portada cargada — hoy no aplica, pero si algún
   libro futuro queda sin imagen, subir a rgba(240,235,227,.85) o más. */
.vrc-tbook__cover-fallback .vrc-tbook__num {
  font-size: 9px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: rgba(240,235,227,.5);
  font-family: var(--vrc-sans);
}
.vrc-tbook__cover-fallback .vrc-tbook__title {
  font-family: var(--vrc-serif);
  font-size: .72rem;
  color: var(--vrc-cream);
  line-height: 1.3;
}

/* Caption debajo de la portada */
.vrc-tbook__caption {
  font-family: var(--vrc-sans);
  font-size: .68rem;
  color: var(--vrc-cream-mid);
  line-height: 1.4;
  margin: 0;
  text-align: center;
}
.vrc-tbook__caption .vrc-tbook__num {
  display: block;
  font-size: 8px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--vrc-gold-dim);
  margin-bottom: .1rem;
}

/* Libro I: sombra más marcada */
.vrc-tbook--featured .vrc-tbook__cover {
  box-shadow: 6px 12px 28px rgba(0,0,0,.7);
}

/* ── Catálogo: tarjetas con portada ── */
.vrc-cat-card__cover {
  position: relative;
  width: 100%;
  aspect-ratio: 2 / 3;
  border-radius: 3px;
  overflow: hidden;
  box-shadow: 3px 5px 16px rgba(0,0,0,.5);
  margin-bottom: .75rem;
}
.vrc-cat-card__cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .35s;
}
.vrc-cat-card:hover .vrc-cat-card__cover img { transform: scale(1.04); }

/* Fallback catálogo */
.vrc-cat-card__cover-fallback {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: .85rem;
  gap: .25rem;
}
/* AUDITORÍA: cream a 45% opacidad da ~3.97:1, no llega a 4.5:1 AA. Mismo caso: solo
   se ve sin portada cargada. Si aplica, subir a rgba(240,235,227,.75) o más. */
.vrc-cat-card__cover-fallback .vrc-cat-card__series {
  font-size: 8px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: rgba(240,235,227,.45);
  font-family: var(--vrc-sans);
}
.vrc-cat-card__cover-fallback .vrc-cat-card__label {
  font-family: var(--vrc-serif);
  font-size: .72rem;
  color: var(--vrc-cream);
  line-height: 1.3;
}

/* ── Responsive ── */
@media (max-width: 700px) {
  .vrc-trilogy__covers {
    gap: .75rem;
  }
  .vrc-tbook__caption {
    font-size: .65rem;
  }
}

/* ============================================================
   ELIMINAR "Built with WooCommerce" — apuntado por inspector
   ============================================================ */
.site-info a[href*="woocommerce.com"],
.site-info a[href*="woocommerce.com"] ~ *,
.woocommerce-credits,
.site-info .woocommerce-credits,
#colophon .site-info a[href*="woocommerce"] {
  display: none !important;
}

/* ============================================================
   FIX MÓVIL — botones y contenido desbordados a la derecha
   ============================================================ */
@media (max-width: 600px) {
  .vrc-hero__btns {
    flex-direction: column !important;
    width: 100% !important;
  }
  .vrc-hero__btns .vrc-btn {
    width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }
  .vrc-hero {
    overflow-x: hidden !important;
  }
  html, body {
    overflow-x: hidden !important;
    max-width: 100vw !important;
  }
}

/* ============================================================
   FIX MÓVIL — texto desbordado y trilogía
   ============================================================ */
@media (max-width: 600px) {
  /* Texto que se desborda */
  body, p, h1, h2, h3, h4, .vrc-trilogy__desc,
  .vrc-trilogy__three, .vrc-section__header {
    overflow-wrap: break-word !important;
    word-break: break-word !important;
    max-width: 100% !important;
  }

  /* Trilogía: scroll horizontal controlado */
  .vrc-trilogy__covers {
    overflow-x: auto !important;
    justify-content: flex-start !important;
    padding-bottom: .5rem !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
  }
  .vrc-trilogy__covers::-webkit-scrollbar { display: none !important; }

  .vrc-tbook {
    width: 110px !important;
    flex-shrink: 0 !important;
  }
}


/* ============================================================
   CATÁLOGO — fixes definitivos con máxima especificidad
   ============================================================ */

/* Suprimir Storefront header/footer en cualquier página con header VARCAR propio */
body.vrc-catalog-page .site-header,
body.vrc-catalog-page .storefront-handheld-footer-bar,
body.vrc-trilogia-page .site-header,
body.vrc-trilogia-page .storefront-handheld-footer-bar,
body.vrc-homepage .site-header,
body.vrc-homepage .storefront-handheld-footer-bar {
  display: none !important;
}
body.vrc-catalog-page #main,
body.vrc-trilogia-page #main {
  padding-top: 60px !important;
  margin-top: 0 !important;
}

/* GRID — el ul.products puede estar dentro de .storefront-sorting */
body.vrc-catalog-page ul.products {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 2rem !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  float: none !important;
  box-sizing: border-box !important;
}

/* Tarjetas */
body.vrc-catalog-page ul.products li.product {
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #111 !important;
  border: 1px solid #2a2016 !important;
  border-radius: 3px !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  transition: border-color .25s, transform .25s !important;
}
body.vrc-catalog-page ul.products li.product:hover {
  border-color: #9b8060 !important;
  transform: translateY(-4px) !important;
}
/* Imagen del catálogo: el tamaño/recorte real lo controla
   el bloque .vrc-product-card__img-wrap más abajo (aspect-ratio + object-fit: cover) */
body.vrc-catalog-page ul.products li.product a img {
  display: block;
  background: #050505;
}
body.vrc-catalog-page ul.products li.product .woocommerce-loop-product__title {
  font-family: 'Playfair Display', serif !important;
  font-size: .95rem !important;
  color: #f0ebe3 !important;
  padding: .85rem 1rem .25rem !important;
  margin: 0 !important;
  line-height: 1.3 !important;
}
body.vrc-catalog-page ul.products li.product .price {
  display: none !important;
}

/* BOTÓN — color/fondo definitivos para el botón del catálogo (vrc-product-card__btn) */
body.vrc-catalog-page ul.products li.product a.button,
body.vrc-catalog-page ul.products li.product a.button.product_type_simple,
body.vrc-catalog-page ul.products li.product a.button.add_to_cart_button,
body.vrc-catalog-page ul.products li.product a.button.ajax_add_to_cart,
body.vrc-catalog-page ul.products li.product a.vrc-product-card__btn {
  display: block !important;
  margin: auto 1rem 1rem !important;
  padding: .65rem 1rem !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 1px solid #9b8060 !important;
  color: #c4a87a !important;
  font-size: 10px !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  text-align: center !important;
  text-indent: 0 !important;
  font-weight: 500 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transition: all .2s !important;
}
body.vrc-catalog-page ul.products li.product a.button:hover,
body.vrc-catalog-page ul.products li.product a.button.product_type_simple:hover,
body.vrc-catalog-page ul.products li.product a.button.add_to_cart_button:hover,
body.vrc-catalog-page ul.products li.product a.vrc-product-card__btn:hover {
  background: rgba(196,168,122,.12) !important;
  background-color: rgba(196,168,122,.12) !important;
  border-color: #c4a87a !important;
  color: #f0ebe3 !important;
}

/* ============================================================
   FIX — .vrc-product-card__btn--primary FUERA del catálogo
   (productos relacionados, upsells, cross-sells). El botón
   ".vrc-product-card__btn" está excluido a propósito de la
   regla que fuerza texto oscuro en botones WooCommerce (línea
   ~1506, :not(.vrc-product-card__btn)), porque en el catálogo
   ya tiene su propio estilo "ghost" (línea 2110, arriba).
   Fuera del catálogo esa regla de catálogo no aplica, así que
   el botón cae al dorado por defecto de los links del sitio →
   texto dorado sobre fondo dorado, invisible. Esta regla no
   lleva el prefijo body.vrc-catalog-page, así que la de arriba
   (más específica) sigue ganando ahí; esta solo cubre el resto.
   ============================================================ */
a.vrc-product-card__btn--primary,
.vrc-product-card__btn--primary {
  color: var(--vrc-ink, #0a0a0a) !important;
}
a.vrc-product-card__btn--primary:hover,
.vrc-product-card__btn--primary:hover {
  color: var(--vrc-ink, #0a0a0a) !important;
}

/* Ocultar basura de WooCommerce */
body.vrc-catalog-page .woocommerce-result-count,
body.vrc-catalog-page .woocommerce-ordering,
body.vrc-catalog-page .woocommerce-breadcrumb,
body.vrc-catalog-page .storefront-sorting { display: none !important; }

/* Responsive */
@media (max-width: 900px) {
  body.vrc-catalog-page ul.products {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (max-width: 540px) {
  body.vrc-catalog-page ul.products {
    grid-template-columns: 1fr !important;
    gap: 1.25rem !important;
  }
}

/* ============================================================
   FIX IMAGEN CATÁLOGO — aspect-ratio en lugar de height fija
   Más robusto que position:absolute
   ============================================================ */
.vrc-product-card,
li.vrc-product-card {
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

/* Contenedor imagen con aspect-ratio (selector reforzado: gana sobre cualquier
   regla genérica .woocommerce ul.products li.product img de más arriba) */
li.vrc-product-card a.vrc-product-card__img-wrap {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  overflow: hidden !important;
  flex-shrink: 0 !important;
  line-height: 0 !important;
  background: #050505 !important;
}

/* Imagen dentro — se ve COMPLETA (contain), sin recortar título/autora.
   Si sobra espacio porque la portada no es cuadrada, queda fondo
   negro a los lados (intencional, ver fondo arriba) en vez de cortar. */
li.vrc-product-card a.vrc-product-card__img-wrap img,
li.vrc-product-card a.vrc-product-card__img-wrap .vrc-product-card__img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  display: block !important;
  position: static !important;
}

/* FIX — botones desalineados entre tarjetas cuando el título ocupa
   distinto número de líneas (ej. "El Segundo Beso: Pactos de Sangre –
   El Infierno en las Venas" vs "El Primer Beso: El Infierno en la Piel").
   El grid ya estira las li.product a la misma altura (align-items: stretch
   por defecto); falta anclar el bloque de acciones al fondo de esa altura. */
li.vrc-product-card .vrc-product-card__actions {
  margin-top: auto !important;
}


/* ============================================================
   HEADER VARCAR — global, usado en homepage, catálogo, trilogía
   y cualquier otra página con <header class="vrc-site-header">.
   (Antes vivía atado solo a body.vrc-catalog-page; se desacopló
   para que funcione en todas las páginas del sitio.)
   ============================================================ */
#main {
  padding-top: 60px;
  margin-top: 0;
}

.vrc-site-header {
  position: fixed;
  top: 0; left: 0; right: 0; z-index: 9999;
  background: rgba(5,5,5,.96);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid #2a2016;
}
.vrc-site-header__inner {
  max-width: 1200px; margin: 0 auto;
  padding: 0 2rem; height: 60px;
  display: flex; align-items: center; gap: 2rem;
}
.vrc-site-header__logo {
  font-family: "Playfair Display", serif;
  font-size: .9rem; letter-spacing: .1em;
  color: #9b8060; text-decoration: none; white-space: nowrap; flex-shrink: 0;
}
.vrc-site-header__logo em { color: #c4a87a; font-style: italic; }
.vrc-site-header__nav { flex: 1; }
.vrc-site-header__nav .vrc-nav-menu {
  display: flex; gap: 1.75rem; list-style: none;
  margin: 0; padding: 0; justify-content: flex-end;
}
.vrc-site-header__nav .vrc-nav-menu li a {
  font-size: 10px; letter-spacing: .18em; text-transform: uppercase;
  color: #a09080; text-decoration: none; transition: color .2s; white-space: nowrap;
}
.vrc-site-header__nav .vrc-nav-menu li a:hover,
.vrc-site-header__nav .vrc-nav-menu li.current-menu-item > a { color: #f0ebe3; }
.vrc-site-header__right {
  display: flex; align-items: center; gap: 1.25rem; flex-shrink: 0;
}
.vrc-cart-link {
  position: relative; display: flex; align-items: center;
  color: #9b8060; transition: color .2s; text-decoration: none;
}
.vrc-cart-link:hover { color: #f0ebe3; }
.vrc-cart-count {
  position: absolute; top: -6px; right: -8px;
  background: #c4a87a; color: #050505;
  font-size: 9px; font-weight: 700;
  width: 16px; height: 16px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
}
.vrc-burger {
  display: none; flex-direction: column; justify-content: center;
  gap: 5px; background: none; border: none; cursor: pointer; padding: 4px;
  width: 32px; height: 32px;
}
.vrc-burger span {
  display: block; width: 22px; height: 1.5px; background: #9b8060; transition: all .25s;
}

/* Submenú desplegable (Autores, etc.) — fallback por si :hover falla con JS de menú */
.vrc-nav-menu li.menu-item-has-children { position: relative; }
.vrc-nav-menu li.menu-item-has-children > ul.sub-menu {
  display: none;
  position: absolute; top: 100%; left: 0;
  background: #111; border: 1px solid #2a2016;
  min-width: 180px; z-index: 9998;
  list-style: none; margin: 0; padding: 0;
  flex-direction: column;
}
.vrc-nav-menu li.menu-item-has-children:hover > ul.sub-menu,
.vrc-nav-menu li.menu-item-has-children:focus-within > ul.sub-menu {
  display: flex;
}
.vrc-nav-menu li.menu-item-has-children > ul.sub-menu li a {
  display: block; padding: .6rem 1rem;
  border-bottom: 1px solid #2a2016; white-space: nowrap;
}
.vrc-nav-menu li.menu-item-has-children > ul.sub-menu li:last-child a { border-bottom: none; }

/* Hero del catálogo */
.vrc-catalog-hero {
  padding: 4rem 2rem 3rem;
  max-width: 1200px; margin: 0 auto;
  border-bottom: 1px solid #2a2016;
}
.vrc-catalog-hero__label {
  font-size: 10px; letter-spacing: .22em; text-transform: uppercase;
  color: #c4a87a; margin: 0 0 .75rem;
}
.vrc-catalog-hero__title {
  font-family: "Playfair Display", serif;
  font-size: clamp(2rem, 3.5vw, 3rem); font-weight: 600;
  color: #f0ebe3; margin: 0 0 .75rem; line-height: 1.15;
}
.vrc-catalog-hero__sub {
  font-size: .88rem; color: #a09080; margin: 0; max-width: 520px; line-height: 1.7;
}

/* Área de productos: ancho/centrado del contenedor */
.vrc-catalog-body {
  width: 100%; max-width: 1200px;
  margin: 0 auto; padding: 2.5rem 2rem 4rem; box-sizing: border-box;
}

/* Responsive — menú hamburguesa global */
@media (max-width: 900px) {
  .vrc-site-header__nav { display: none !important; }
  .vrc-site-header__nav.is-open {
    display: block !important; position: absolute;
    top: 60px; left: 0; right: 0;
    background: rgba(5,5,5,.98); border-bottom: 1px solid #2a2016;
    padding: 1rem 2rem 1.5rem;
  }
  .vrc-site-header__nav.is-open .vrc-nav-menu {
    flex-direction: column; align-items: flex-start; gap: 0;
  }
  .vrc-site-header__nav.is-open .vrc-nav-menu li a {
    display: block; padding: .7rem 0; border-bottom: 1px solid #2a2016; font-size: 11px;
  }
  .vrc-burger { display: flex !important; }
  /* En móvil los submenús se muestran siempre expandidos dentro del drawer */
  .vrc-nav-menu li.menu-item-has-children > ul.sub-menu {
    display: block !important;
    position: static; border: none; background: transparent;
    padding-left: 1rem;
  }
}
@media (max-width: 540px) {
  .vrc-site-header__inner { padding: 0 1.25rem; }
}

/* ============================================================
   WOOCOMMERCE BLOCKS — Carrito y Checkout (bloque de Gutenberg)
   Estas páginas usan los bloques nuevos de WooCommerce
   (clases wc-block-...), distintos a los shortcodes clásicos
   ([woocommerce_cart]/[woocommerce_checkout]) que ya tienen
   sus propias reglas arriba. Ambos sistemas conviven, así que
   no se tocan las reglas clásicas; esto cubre el caso bloque.
   ============================================================ */

/* Fondo general del bloque de carrito/checkout */
.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout {
  color: var(--vrc-cream) !important;
}

/* Filas de totales: Subtotal, Estimated total, etc. */
.wc-block-components-totals-item,
.wc-block-components-totals-item__label,
.wc-block-components-totals-item__value,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
  color: var(--vrc-cream) !important;
}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
.wc-block-components-totals-footer-item .wc-block-formatted-money-amount {
  color: var(--vrc-gold) !important;
  font-weight: 600 !important;
}
.wc-block-components-totals-item__description {
  color: var(--vrc-cream-mid) !important;
}

/* Bloque "Order summary" / contenedor de totales en sí */
.wc-block-components-sidebar .wc-block-components-panel,
.wc-block-cart__totals-title,
.wc-block-components-totals-wrapper {
  background: transparent !important;
  color: var(--vrc-cream) !important;
}

/* Cupón ("Add coupons") */
.wc-block-components-totals-coupon-link,
.wc-block-components-totals-coupon-link svg,
.wc-block-components-panel__button,
.wc-block-components-panel__button-icon,
.wc-block-components-totals-coupon__content {
  color: var(--vrc-gold-dim) !important;
  fill: var(--vrc-gold-dim) !important;
}
.wc-block-components-totals-coupon__input input,
.wc-block-components-text-input input {
  background: var(--vrc-surface) !important;
  border-color: var(--vrc-border) !important;
  color: var(--vrc-cream) !important;
}
.wc-block-components-totals-coupon__input label {
  color: var(--vrc-cream-mid) !important;
}
.wc-block-components-totals-coupon__button {
  background: transparent !important;
  border-color: var(--vrc-gold-dim) !important;
  color: var(--vrc-gold) !important;
}

/* Botón "Proceder al pago" / "Realizar pedido" del bloque */
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button,
a.wc-block-cart__submit-button,
button.wc-block-components-checkout-place-order-button {
  background-color: var(--vrc-gold) !important;
  color: var(--vrc-ink) !important;
  border: none !important;
  font-weight: 600 !important;
}
.wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover {
  background-color: var(--vrc-cream) !important;
  color: var(--vrc-ink) !important;
}

/* Nombre/precio de producto dentro de la fila del carrito (bloque) */
.wc-block-cart-item__product-name,
.wc-block-cart-item__prices,
.wc-block-components-product-name {
  color: var(--vrc-cream) !important;
}
.wc-block-cart-item__product-metadata,
.wc-block-components-product-metadata {
  color: var(--vrc-cream-mid) !important;
}

/* Texto "Tus datos personales se utilizarán..." en el checkout —
   venía sin ninguna regla, heredando fondo blanco/texto gris de WP */
.woocommerce-privacy-policy-text,
.woocommerce-privacy-policy-text p {
  color: var(--vrc-cream-mid) !important;
  background: transparent !important;
}
.woocommerce-privacy-policy-text a {
  color: var(--vrc-gold) !important;
}