/*
Theme Name: GolfCars Repuestos
Theme URI: https://golfcarsrepuestos.com
Description: Tema hijo de Blocksy para la tienda de repuestos de carritos de golf. Aplica la identidad de marca sobre una base moderna de comercio electronico.
Author: GolfCars Repuestos
Template: blocksy
Version: 2.0
Text Domain: golfcars
*/

/* ==========================================================================
   1. Marca sobre la paleta de Blocksy
   Sobrescribir sus variables tine el tema entero de una vez: botones,
   enlaces, formularios, carrito lateral, filtros... todo coherente.
   ========================================================================== */

:root {
	/* Rediseno "Fairway": lenguaje plano y redondeado inspirado en Bizum.
	   Verde algo mas vivo, pagina blanca, tarjetas separadas por color de
	   fondo (no por borde ni sombra) y formas pildora. */
	--theme-palette-color-1: #0E7A3E;  /* Acento principal */
	--theme-palette-color-2: #0C6A36;  /* Acento al pasar el raton */
	--theme-palette-color-3: #1C221E;  /* Titulares */
	--theme-palette-color-4: #3E453F;  /* Texto */
	--theme-palette-color-5: #E3E8E4;  /* Filetes */
	--theme-palette-color-6: #FFFFFF;  /* Fondo de pagina: blanco */

	/* Ojo: Blocksy usa los colores 7 y 8 como fondos claros (blanco y casi
	   blanco), no como oscuros. Si se tinan de oscuro se ennegrecen cabecera,
	   tarjetas y menus. Se respetan claros y el oscuro va aparte, en --gc-oscuro. */
	--theme-palette-color-7: #FFFFFF;
	--theme-palette-color-8: #FFFFFF;

	/* Alias propios */
	--gc-verde:        var(--theme-palette-color-1);
	--gc-verde-oscuro: var(--theme-palette-color-2);
	--gc-verde-vivo:   #1EB25A;  /* acento brillante: chips, focos, detalles */
	--gc-verde-claro:  #EFF9F2;
	--gc-verde-borde:  #D3F0DC;  /* pastel; donde queda algun borde, casi no se ve */
	--gc-tinta:        var(--theme-palette-color-3);
	--gc-texto:        var(--theme-palette-color-4);
	--gc-suave:        #5C655E;  /* sigue cumpliendo WCAG AA sobre claro */
	--gc-linea:        var(--theme-palette-color-5);
	--gc-fondo:        #F7F8F7;  /* relleno de tarjeta suave (ya no es el fondo de pagina) */
	--gc-fondo-2:      #F0F3F0;  /* relleno alterno, para alternancias tipo ajedrez */
	--gc-blanco:       var(--theme-palette-color-7);
	--gc-oscuro:       #1C221E;
	--gc-ambar:        #8A5A00;
	--gc-ambar-bg:     #FDF3E0;
	--gc-ambar-texto:  #6B4600;  /* texto sobre el fondo ambar */

	/* Colores para escribir SOBRE los bloques oscuros (aviso flotante,
	   selector de vehiculo, bloque de contacto). Sin estos, cada bloque
	   inventaba su propio gris y no habia dos iguales. */
	--gc-sobre-oscuro:       #C7CFC9;
	--gc-sobre-oscuro-suave: #9DAAA2;
	--gc-sobre-oscuro-verde: #A9E3BC;

	--gc-placeholder:  #7C867F;  /* 4,6:1 sobre el gris del buscador */

	--gc-radio:    20px;
	--gc-radio-lg: 32px;   /* secciones-tarjeta */
	--gc-radio-sm: 14px;
	--gc-pildora:  999px;
	/* Diseno plano: las variables de sombra quedan en 'none' para apagar de
	   una vez todas las elevaciones repartidas por la hoja. Solo sobreviven
	   las sombras funcionales (menus desplegables, avisos flotantes). */
	--gc-sombra:      none;
	--gc-sombra-alta: none;

	--gc-ancho: 1200px;

	/* Radios y alturas de Blocksy, para un acabado mas suave */
	--theme-border-radius: 14px;
	--theme-button-min-height: 46px;
	--theme-form-field-border-radius: 14px;
}

/* ==========================================================================
   2. Base
   ========================================================================== */

body {
	background: var(--gc-blanco);
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 {
	letter-spacing: -0.02em;
	font-weight: 700;
}

/* Archivo del blog: los titulares largos siempre deben poder ocupar las
   líneas necesarias y las imágenes se muestran enteras, sin el recorte que
   impone la proporción fija de las tarjetas de Blocksy. */
[data-prefix="blog"] .entry-card .entry-title {
	overflow: visible;
	overflow-wrap: anywhere;
	text-wrap: balance;
}

[data-prefix="blog"] .entry-card .ct-media-container img {
	height: auto !important;
	aspect-ratio: auto !important;
	object-fit: contain;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible {
	outline: 3px solid var(--gc-verde-vivo);
	outline-offset: 2px;
	border-radius: 6px;
}

.gc-contenedor {
	width: min(var(--gc-ancho), calc(100% - 40px));
	margin-inline: auto;
}

/* ==========================================================================
   3. Botones
   ========================================================================== */

.gc-boton {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .5em;
	background: var(--gc-verde);
	color: #fff;
	border: 2px solid transparent;
	border-radius: var(--gc-pildora);
	padding: .72em 1.5em;
	font-weight: 600;
	font-size: .98rem;
	line-height: 1.2;
	text-decoration: none;
	transition: background .25s ease, color .25s ease, border-color .25s ease;
}

.gc-boton:hover {
	background: var(--gc-verde-oscuro);
	color: #fff;
}

.gc-boton--fantasma {
	background: var(--gc-fondo);
	color: var(--gc-tinta);
	border: 2px solid transparent;
}

.gc-boton--fantasma:hover {
	background: var(--gc-verde-claro);
	color: var(--gc-verde-oscuro);
}

.gc-boton--claro { background: #fff; color: var(--gc-verde-oscuro); }
.gc-boton--claro:hover { background: var(--gc-verde-claro); color: var(--gc-verde-oscuro); }

/* Boton de contorno sobre fondos oscuros (banda verde, bloque de contacto) */
.gc-boton--contorno-claro {
	background: transparent;
	color: #fff;
	border-color: #fff;
}

.gc-boton--contorno-claro:hover { background: #fff; color: var(--gc-verde-oscuro); }

/* Los botones de WooCommerce y Blocksy tambien se hacen pildora */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
button[type="submit"],
.wp-element-button {
	border-radius: var(--gc-pildora) !important;
}

/* ==========================================================================
   4. Barra de avisos
   ========================================================================== */

.gc-avisos {
	background: var(--gc-verde-claro);
	color: var(--gc-verde-oscuro);
	font-size: .86rem;
	font-weight: 500;
	padding: .6rem 0;
}

.gc-avisos .gc-contenedor {
	display: flex;
	flex-wrap: wrap;
	gap: .4rem 2rem;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.gc-avisos strong { color: var(--gc-verde-oscuro); font-weight: 700; }

/* ==========================================================================
   5. Buscador
   ========================================================================== */

.gc-buscador {
	display: flex;
	gap: .45rem;
	background: var(--gc-fondo);
	border: 2px solid transparent;
	border-radius: var(--gc-pildora);
	padding: .4rem .4rem .4rem .6rem;
	max-width: 580px;
	transition: border-color .25s ease, background .25s ease;
}

.gc-buscador input[type="search"] {
	flex: 1;
	min-width: 0;
	border: 0 !important;
	background: transparent;
	padding: .6em .9em;
	font-size: 1rem;
	color: var(--gc-tinta);
	box-shadow: none !important;
}

.gc-buscador input[type="search"]:focus { outline: none; }
.gc-buscador input::placeholder { color: var(--gc-placeholder); }

.gc-buscador:focus-within {
	border-color: var(--gc-verde-vivo);
	background: #fff;
}

.gc-buscador button { white-space: nowrap; }

.gc-buscador-ayuda {
	margin-top: .75rem;
	font-size: .88rem;
	color: var(--gc-suave);
}

/* ==========================================================================
   6. Portada
   ========================================================================== */

.gc-hero {
	background: var(--gc-blanco);
	padding: clamp(2.5rem, 6vw, 4.75rem) 0 clamp(2rem, 4vw, 3rem);
}

.gc-hero__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	background: transparent;
	color: var(--gc-verde-oscuro);
	border: 1.5px solid var(--gc-linea);
	border-radius: var(--gc-pildora);
	padding: .4rem 1rem;
	font-size: .84rem;
	font-weight: 600;
}

.gc-hero__eyebrow::before {
	content: "";
	width: .55em;
	height: .55em;
	border-radius: 50%;
	background: var(--gc-verde-vivo);
}

.gc-hero h1 {
	margin: 1.25rem 0 .9rem;
	font-size: clamp(2.4rem, 5.8vw, 4.1rem);
	max-width: 14ch;
	line-height: 1.05;
	color: var(--gc-tinta);
}

.gc-hero__texto {
	font-size: clamp(1.03rem, 2vw, 1.2rem);
	color: var(--gc-suave);
	max-width: 48ch;
	margin-bottom: 1.7rem;
}

.gc-hero__texto strong { color: var(--gc-verde-oscuro); }

.gc-hero__acciones {
	display: flex;
	flex-wrap: wrap;
	gap: .7rem;
	margin-top: 1.2rem;
}

/* Referencias de ejemplo bajo el buscador, como chips */
.gc-buscador-ayuda strong {
	display: inline-block;
	background: var(--gc-verde-claro);
	color: var(--gc-verde-oscuro);
	border-radius: var(--gc-pildora);
	padding: .18em .8em;
	font-weight: 600;
}

/* Sellos de confianza: tarjetas suaves con chip de icono redondo */
.gc-confianza {
	background: var(--gc-blanco);
	padding: .5rem 0 1.25rem;
}

.gc-confianza__rejilla {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: 1rem;
}

.gc-confianza__item {
	display: flex;
	gap: .95rem;
	align-items: flex-start;
	background: var(--gc-fondo);
	border-radius: var(--gc-radio);
	padding: 1.25rem 1.35rem;
}

.gc-confianza__icono {
	flex: 0 0 auto;
	width: 44px;
	height: 44px;
	display: grid;
	place-items: center;
	background: #fff;
	border-radius: 50%;
	color: var(--gc-verde);
}

.gc-confianza__item strong { display: block; color: var(--gc-tinta); font-size: .96rem; }
.gc-confianza__item span   { font-size: .86rem; color: var(--gc-suave); }

/* Secciones */
.gc-seccion { padding: clamp(2.5rem, 5.5vw, 4.25rem) 0; }
.gc-seccion--blanca { background: transparent; }

.gc-seccion__cabecera { margin-bottom: 2rem; max-width: 62ch; }

.gc-seccion__cabecera h2 {
	font-size: clamp(1.6rem, 3.6vw, 2.25rem);
	margin: 0 0 .5rem;
	color: var(--gc-tinta);
}

.gc-seccion__cabecera p { color: var(--gc-suave); margin: 0; }

/* Categorias */
.gc-categorias {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(215px, 1fr));
	gap: 1rem;
}

.gc-categoria {
	display: block;
	background: #fff;
	border: 1px solid var(--gc-linea);
	border-radius: var(--gc-radio);
	padding: 1.5rem;
	text-decoration: none;
	transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}

.gc-categoria:hover {
	border-color: var(--gc-verde-borde);
	transform: translateY(-3px);
	box-shadow: var(--gc-sombra-alta);
}

.gc-categoria__icono {
	width: 44px;
	height: 44px;
	display: grid;
	place-items: center;
	background: var(--gc-verde-claro);
	border-radius: 12px;
	color: var(--gc-verde);
	margin-bottom: .95rem;
}

.gc-categoria h3 { margin: 0 0 .2rem; font-size: 1.08rem; color: var(--gc-tinta); }
.gc-categoria span { font-size: .87rem; color: var(--gc-suave); }

/* Modelos */
.gc-modelos { display: flex; flex-wrap: wrap; gap: .6rem; }

.gc-modelo {
	background: var(--gc-fondo);
	border: 0;
	border-radius: var(--gc-pildora);
	padding: .65rem 1.3rem;
	font-weight: 600;
	font-size: .95rem;
	color: var(--gc-tinta);
	text-decoration: none;
	transition: background .2s ease, color .2s ease;
}

.gc-modelo:hover {
	background: var(--gc-verde);
	color: #fff;
}

/* Bloque oscuro */
.gc-contacto {
	background: var(--gc-oscuro);
	color: #C7CFC9;
	padding: 0; /* el interior (.gc-contacto__interior) pone el suyo */
	border-radius: var(--gc-radio-lg);
	margin-block: 0;
}

.gc-contacto h2 { color: #fff; font-size: clamp(1.55rem, 3.4vw, 2.15rem); margin-top: 0; }
.gc-contacto p  { max-width: 60ch; }
.gc-contacto p b { color: var(--gc-verde-vivo); }
.gc-contacto__acciones { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1.5rem; }

/* Banda verde "comprar es sencillo": una seccion convertida en gran
   tarjeta redondeada, el gesto mas reconocible del estilo Bizum */
.gc-como {
	background: var(--gc-verde);
	color: #fff;
	border-radius: var(--gc-radio-lg);
	padding: clamp(2.25rem, 5vw, 3.5rem);
}

.gc-como .gc-seccion__cabecera h2 { color: #fff; }
.gc-como .gc-seccion__cabecera p  { color: var(--gc-verde-borde); }

.gc-como__acciones { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 2.25rem; }

/* Pasos: numeros en chip pildora sobre la banda verde */
.gc-pasos {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 1.75rem 2rem;
	counter-reset: paso;
}

.gc-paso { background: transparent; border: 0; padding: 0; }

.gc-paso::before {
	counter-increment: paso;
	content: counter(paso);
	display: inline-grid;
	place-items: center;
	min-width: 2.7em;
	height: 2em;
	padding: 0 .85em;
	border-radius: var(--gc-pildora);
	background: var(--gc-verde-vivo);
	color: #fff;
	font-size: 1.02rem;
	font-weight: 700;
	margin-bottom: .95rem;
}

.gc-paso h3 { margin: 0 0 .35rem; font-size: 1.1rem; color: #fff; }
.gc-paso p  { margin: 0; font-size: .94rem; color: #DFF3E6; }

/* FAQ */
.gc-faq { display: grid; gap: .7rem; max-width: 880px; }

.gc-faq details {
	background: var(--gc-fondo);
	border: 0;
	border-radius: var(--gc-radio);
	padding: 1.15rem 1.35rem;
	transition: background .2s ease;
}

.gc-faq details[open] { background: var(--gc-verde-claro); }

.gc-faq summary {
	cursor: pointer;
	font-weight: 700;
	color: var(--gc-tinta);
	list-style: none;
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	align-items: center;
}

.gc-faq summary::-webkit-details-marker { display: none; }

.gc-faq summary::after {
	content: "+";
	font-size: 1.35rem;
	font-weight: 400;
	color: var(--gc-verde);
	flex: 0 0 auto;
	line-height: 1;
}

.gc-faq details[open] summary::after { content: "\2013"; }
.gc-faq details p { margin: .8rem 0 0; color: var(--gc-suave); font-size: .96rem; }

/* ==========================================================================
   7. Producto
   ========================================================================== */

.woocommerce ul.products li.product,
ul.products li.product {
	background: var(--gc-fondo);
	border: 0;
	border-radius: var(--gc-radio);
	padding: 1rem;
	transition: background .25s ease, transform .25s ease;
}

.woocommerce ul.products li.product:hover,
ul.products li.product:hover {
	background: var(--gc-fondo-2);
	transform: translateY(-3px);
}

/* La foto, en panel blanco redondeado: los fondos blancos de las fotos de
   producto no "flotan" sobre la tarjeta gris */
ul.products li.product .ct-media-container {
	background: #fff;
	border-radius: var(--gc-radio-sm);
	overflow: hidden;
}

ul.products li.product .woocommerce-loop-product__title {
	font-size: 1rem !important;
	font-weight: 700;
	color: var(--gc-tinta);
	line-height: 1.35;
}

ul.products li.product .price {
	color: var(--gc-tinta) !important;
	font-weight: 800;
	font-size: 1.14rem;
}

/* Referencia OEM */
.gc-sku {
	display: inline-block;
	font-size: .74rem;
	font-weight: 700;
	letter-spacing: .045em;
	color: var(--gc-suave);
	background: var(--gc-fondo-2);
	border: 0;
	border-radius: var(--gc-pildora);
	padding: .18rem .7rem;
	margin-bottom: .35rem;
}

/* Disponibilidad */
.gc-stock { font-size: .85rem; font-weight: 700; margin: .3rem 0 0; }
.gc-stock--si { color: var(--gc-verde); }
.gc-stock--no { color: var(--gc-ambar); }

/* Consultar precio */
.golfcars-consultar {
	display: inline-block;
	font-weight: 700;
	font-size: 1.02rem;
	color: var(--gc-ambar);
	background: var(--gc-ambar-bg);
	border-radius: var(--gc-pildora);
	padding: .15rem .7rem;
}

.golfcars-aviso-consulta {
	background: var(--gc-ambar-bg);
	border-left: 3px solid var(--gc-ambar);
	padding: .8rem 1rem;
	border-radius: 0 8px 8px 0;
	font-size: .93rem;
	color: var(--gc-texto);
}

/* Sin foto */
.gc-sin-imagen {
	display: grid;
	place-items: center;
	aspect-ratio: 1 / 1;
	background: var(--gc-verde-claro);
	border-radius: var(--gc-radio-sm);
	color: var(--gc-verde);
	font-size: .81rem;
	font-weight: 700;
	text-align: center;
	padding: 1rem;
	line-height: 1.4;
}

/* ==========================================================================
   8. Responsive y accesibilidad
   ========================================================================== */

@media (max-width: 768px) {
	.gc-contenedor { width: calc(100% - 32px); }
	/* Apilado, la pildora completa no funciona: esquinas redondeadas grandes */
	.gc-buscador { flex-direction: column; border-radius: 1.6rem; padding: .5rem; }
	.gc-buscador button { width: 100%; }
	.gc-hero h1 { max-width: none; }
	.gc-avisos { font-size: .77rem; }
	.gc-avisos .gc-contenedor { gap: .3rem 1rem; }
	.gc-contacto { border-radius: 0; margin-inline: calc(50% - 50vw); padding-inline: 20px; }
}

@media (prefers-reduced-motion: reduce) {
	* { transition: none !important; animation: none !important; }
	.gc-categoria:hover,
	.gc-modelo:hover,
	ul.products li.product:hover,
	.gc-boton:hover { transform: none; }
}

/* ==========================================================================
   9. Tipografia autoalojada
   DM Sans variable (la familia de Bizum). Se sirve desde el propio servidor:
   sin peticiones a Google, sin ceder la IP del visitante y sin retraso de
   conexion a un tercero.
   ========================================================================== */

@font-face {
	font-family: 'DMSansGC';
	font-style: normal;
	font-weight: 100 1000;
	font-display: swap;
	src: url('assets/fonts/dm-sans-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
	               U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122,
	               U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: 'DMSansGC';
	font-style: normal;
	font-weight: 100 1000;
	font-display: swap;
	src: url('assets/fonts/dm-sans-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB,
	               U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
	--gc-fuente: 'DMSansGC', -apple-system, BlinkMacSystemFont, 'Segoe UI',
	             Roboto, Helvetica, Arial, sans-serif;
}

body,
button, input, select, textarea,
h1, h2, h3, h4, h5, h6,
.ct-menu-link, .gc-boton, .price, .woocommerce-loop-product__title {
	font-family: var(--gc-fuente);
}

/* Cifras tabulares: precios y referencias alineados en columna */
.price, .gc-sku, .gc-stock, .woocommerce-Price-amount {
	font-variant-numeric: tabular-nums;
	font-feature-settings: 'tnum' 1;
}

/* ==========================================================================
   10. Hero en dos columnas con ilustracion
   ========================================================================== */

.gc-hero__rejilla {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
	gap: clamp(2rem, 5vw, 4rem);
	align-items: center;
}

.gc-hero__ilustracion {
	position: relative;
	display: grid;
	place-items: center;
}

.gc-hero__ilustracion svg {
	width: 100%;
	max-width: 480px;
	height: auto;
	filter: drop-shadow(0 22px 34px rgba(15, 26, 23, .13));
}

@media (max-width: 900px) {
	.gc-hero__rejilla { grid-template-columns: 1fr; }
	.gc-hero__ilustracion { order: -1; max-width: 380px; margin-inline: auto; }
	.gc-hero__ilustracion svg { max-width: 340px; }
}

/* ==========================================================================
   11. Tarjeta de producto sin foto
   Mientras no haya fotografias, el hueco se convierte en un panel de marca
   con la referencia como protagonista. Parece decidido, no roto.
   ========================================================================== */

.gc-sin-imagen {
	position: relative;
	display: grid;
	place-items: center;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: var(--gc-verde-claro);
	border: 0;
	border-radius: var(--gc-radio-sm);
	color: var(--gc-verde-oscuro);
	text-align: center;
	padding: 1rem;
}

/* Icono de la categoria, en marca de agua */
.gc-sin-imagen__marca {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	color: var(--gc-verde);
	opacity: .13;
}

.gc-sin-imagen__marca svg { width: 58%; height: auto; stroke-width: 1.1; }

.gc-sin-imagen__ref {
	position: relative;
	font-size: .74rem;
	font-weight: 800;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var(--gc-verde-oscuro);
	background: rgba(255, 255, 255, .82);
	backdrop-filter: blur(2px);
	border: 1px solid var(--gc-verde-borde);
	border-radius: 999px;
	padding: .3rem .8rem;
	line-height: 1.3;
}

/* En la ficha, el panel es mas grande y respira mas */
.single-product .gc-sin-imagen { border-radius: var(--gc-radio); }
.single-product .gc-sin-imagen__ref { font-size: .9rem; padding: .45rem 1.1rem; }

/* ==========================================================================
   12. Carrito en el menu
   ========================================================================== */

.gc-carrito {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	font-weight: 600;
	color: var(--gc-tinta);
	text-decoration: none;
	padding: .45rem 1rem;
	border: 2px solid var(--gc-tinta);
	border-radius: var(--gc-pildora);
	background: transparent;
	transition: background .25s ease, color .25s ease;
}

.gc-carrito:hover {
	background: var(--gc-tinta);
	color: #fff;
}

.gc-carrito__cuenta {
	display: grid;
	place-items: center;
	min-width: 21px;
	height: 21px;
	padding: 0 .35rem;
	border-radius: 999px;
	background: var(--gc-verde);
	color: #fff;
	font-size: .74rem;
	font-weight: 800;
	font-variant-numeric: tabular-nums;
}

.gc-carrito-item { display: flex; align-items: center; }

@media (max-width: 600px) {
	.gc-carrito__texto { display: none; }
	.gc-carrito { padding: .5rem .65rem; }
}

/* ==========================================================================
   13. Hero a dos columnas con escena
   La foto va recortada en pildora, con barras decorativas y un chip flotante
   con el plazo de envio: la composicion de "imagen animada" de Bizum.
   ========================================================================== */

.gc-hero__rejilla {
	display: grid;
	/* La foto es apaisada: su columna es la ancha para que no quede enana */
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
	gap: clamp(2rem, 5vw, 3.5rem);
	align-items: center;
}

.gc-hero__escena { position: relative; }

/* La foto va en su proporcion natural, sin recortar: el carrito entero,
   la calle y la bandera a la vista. Solo se redondea con un arco arriba. */
.gc-hero__escena img,
.gc-hero__escena svg {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 5rem 5rem 2rem 2rem;
	box-shadow: none;
}

/* El video (si algun dia se configura) si necesita un marco fijo */
.gc-hero__escena video {
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	display: block;
	border-radius: 5rem 5rem 2rem 2rem;
}

/* Barras pildora decorativas: montan sobre el borde izquierdo de la foto */
.gc-hero__barra {
	position: absolute;
	height: 2.1rem;
	border-radius: var(--gc-pildora);
}

.gc-hero__barra--1 { width: 8rem; background: var(--gc-verde-borde); left: -1.4rem; top: 9%; }
.gc-hero__barra--2 { width: 5rem; background: var(--gc-verde); left: -.4rem; top: calc(9% + 2.8rem); }

/* Chip flotante: una de las poquisimas sombras que quedan, y es funcional */
.gc-hero__dato {
	position: absolute;
	right: 4%;
	bottom: 8%;
	display: flex;
	align-items: center;
	gap: .7rem;
	background: #fff;
	border-radius: var(--gc-pildora);
	padding: .7rem 1.4rem;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .10);
	margin: 0;
}

.gc-hero__dato strong {
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--gc-verde);
	font-variant-numeric: tabular-nums;
}

.gc-hero__dato span { font-size: .82rem; line-height: 1.3; color: var(--gc-suave); }

/* Entrada suave al cargar, como las imagenes animadas de Bizum */
@media (prefers-reduced-motion: no-preference) {
	.gc-hero__barra,
	.gc-hero__dato { animation: gc-subir 1.3s cubic-bezier(.2, .7, .2, 1) both; }
	.gc-hero__barra--1 { animation-delay: .15s; }
	.gc-hero__barra--2 { animation-delay: .3s; }
	.gc-hero__dato { animation-delay: .45s; }
}

@keyframes gc-subir {
	from { opacity: 0; transform: translateY(1.5rem); }
	to   { opacity: 1; transform: none; }
}

@media (max-width: 900px) {
	.gc-hero__rejilla { grid-template-columns: 1fr; }
	.gc-hero__escena  { order: -1; }
	.gc-hero__escena img,
	.gc-hero__escena video,
	.gc-hero__escena svg { border-radius: 3rem 3rem 1.5rem 1.5rem; }
	/* Las barras no deben asomar fuera del viewport en movil */
	.gc-hero__barra--1 { left: -.5rem; }
	.gc-hero__barra--2 { left: .25rem; }
	.gc-hero h1 { max-width: none; }
	.gc-hero__dato { position: static; margin-top: .75rem; display: inline-flex; }
}

/* ==========================================================================
   14. Rejilla de productos
   WooCommerce reparte sus columnas con floats y anchos en porcentaje que no
   encajan fuera de sus plantillas. Aqui se fuerza una rejilla CSS propia,
   que ademas iguala la altura de todas las tarjetas.
   ========================================================================== */

.gc-portada ul.products.gc-rejilla {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
	gap: 1.15rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.gc-portada ul.products.gc-rejilla::before,
.gc-portada ul.products.gc-rejilla::after { content: none; }

.gc-portada ul.products.gc-rejilla li.product {
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
	padding: .9rem;
	float: none !important;
	clear: none !important;
	display: flex;
	flex-direction: column;
}

/* La imagen manda arriba y el boton se pega abajo: tarjetas alineadas */
.gc-portada ul.products.gc-rejilla li.product > a:first-of-type { display: block; }
.gc-portada ul.products.gc-rejilla li.product .gc-stock { margin-top: auto; }
.gc-portada ul.products.gc-rejilla li.product .button { width: 100%; margin-top: .7rem; }

/* La lista de categorias bajo el precio sobra en la portada: ya se navega
   por categorias mas arriba y en la tarjeta solo anade ruido. */
.gc-portada ul.products.gc-rejilla li.product .entry-meta { display: none; }

/* La imagen ocupa todo el ancho de la tarjeta */
.gc-portada ul.products.gc-rejilla li.product .ct-media-container {
	display: block;
	width: 100%;
	margin-bottom: .6rem;
}

.gc-seccion__pie { margin: 1.75rem 0 0; }

/* ==========================================================================
   15. Tarjetas de categoria
   ========================================================================== */

.gc-categorias {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(205px, 1fr));
	gap: 1rem;
}

.gc-categoria {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: .1rem;
	background: var(--gc-fondo);
	border: 0;
	border-radius: var(--gc-radio);
	padding: 1.6rem 1.4rem 1.4rem;
	text-decoration: none;
	overflow: hidden;
	transition: background .25s ease, transform .25s ease;
}

.gc-categoria:hover {
	background: var(--gc-verde-claro);
	transform: translateY(-3px);
}

.gc-categoria__icono {
	width: 56px;
	height: 56px;
	display: grid;
	place-items: center;
	margin-bottom: 1.1rem;
	border-radius: 50%;
	color: var(--gc-verde);
	background: #fff;
	transition: background .25s ease, color .25s ease;
}

.gc-categoria:hover .gc-categoria__icono {
	background: var(--gc-verde);
	color: #fff;
}

.gc-categoria h3 {
	margin: 0 0 .15rem;
	font-size: 1.1rem;
	color: var(--gc-tinta);
	line-height: 1.25;
}

.gc-categoria__cuenta {
	font-size: .87rem;
	color: var(--gc-suave);
	font-variant-numeric: tabular-nums;
}

/* ==========================================================================
   16. Bloque de contacto
   ========================================================================== */

.gc-contacto {
	border-radius: var(--gc-radio);
	overflow: hidden;
	margin: 0;
}

.gc-contacto__interior { padding: clamp(2rem, 5vw, 3.25rem); }

@media (max-width: 600px) {
	.gc-contacto { margin-inline: 0; border-radius: var(--gc-radio); }
	.gc-contacto__interior { padding: 1.75rem 1.35rem; }
}

/* ==========================================================================
   17. Logotipo provisional
   Marca tipografica con un distintivo dibujado en SVG (incrustado como data
   URI, sin peticion extra). Es temporal: en cuanto haya un logotipo propio se
   sube desde Apariencia > Personalizar y esto deja de aplicarse solo.
   ========================================================================== */

.site-title-container .site-title a,
.site-title-container .site-title {
	display: inline-flex !important;
	align-items: center;
	gap: .6rem;
	font-weight: 800;
	letter-spacing: -.025em;
	color: var(--gc-tinta) !important;
	line-height: 1.05;
}

.site-title-container .site-title a::before {
	content: "";
	flex: 0 0 auto;
	width: 38px;
	height: 38px;
	border-radius: 11px;
	background-color: var(--gc-verde);
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 14h26'/%3E%3Cpath d='M15 14v7'/%3E%3Cpath d='M35 14l2 13'/%3E%3Crect x='13' y='27' width='24' height='7' rx='3'/%3E%3Ccircle cx='18' cy='37' r='4'/%3E%3Ccircle cx='32' cy='37' r='4'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 30px 30px;
	box-shadow: 0 6px 14px rgba(14, 122, 62, .3);
}

/* Si se sube un logotipo real, WordPress deja de pintar el titulo de texto
   y este distintivo desaparece sin tener que tocar nada. */
.site-logo-container img { max-height: 52px; width: auto; }

/* ==========================================================================
   18. Rejilla del catalogo
   Blocksy fija 3 columnas. Con tarjetas tan compactas desaprovecha la
   pantalla en escritorio, asi que se deja fluida: llena las columnas que
   quepan a partir de 220px y se adapta sola en tablet y movil.
   ========================================================================== */

.woocommerce ul.products.columns-1,
.woocommerce ul.products.columns-2,
.woocommerce ul.products.columns-3,
.woocommerce ul.products.columns-4 {
	--shop-columns: repeat(auto-fill, minmax(220px, 1fr));
}

@media (max-width: 700px) {
	.woocommerce ul.products.columns-1,
	.woocommerce ul.products.columns-2,
	.woocommerce ul.products.columns-3,
	.woocommerce ul.products.columns-4 {
		--shop-columns: repeat(2, minmax(0, 1fr));
	}
}

/* ==========================================================================
   19. Categorias con imagen
   Cuando la categoria tiene imagen asignada, la tarjeta pasa a ser visual:
   la imagen ocupa la parte superior y el texto queda debajo.
   ========================================================================== */

.gc-categoria--con-imagen { padding: 0; }

.gc-categoria__imagen {
	display: block;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: var(--gc-verde-claro);
	border-bottom: 1px solid var(--gc-linea);
}

.gc-categoria__imagen img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform .4s ease;
}

.gc-categoria--con-imagen:hover .gc-categoria__imagen img { transform: scale(1.05); }

.gc-categoria--con-imagen h3 { margin: 1.1rem 1.3rem .15rem; }
.gc-categoria--con-imagen .gc-categoria__cuenta { margin: 0 1.3rem 1.3rem; }

/* (La imagen del hero se estila en la seccion 13: esta regla anterior
   pisaba el arco y anadia una sombra, y se retiro con la opcion elegida
   por el cliente el 15-08-2026.) */

/* ==========================================================================
   20. Cabecera con logotipo
   Blocksy muestra el logotipo y ademas el nombre del sitio en texto. Como el
   logotipo ya incluye el nombre, se oculta el texto para no repetirlo.
   WordPress anade la clase .wp-custom-logo al body solo cuando hay logotipo,
   asi que si algun dia se quita, el nombre en texto vuelve solo.
   ========================================================================== */

body.wp-custom-logo .site-title-container { display: none; }

/* El distintivo provisional solo tiene sentido sin logotipo */
body.wp-custom-logo .site-title-container .site-title a::before { content: none; }

.site-logo-container img,
.site-logo-container .default-logo {
	max-height: 54px;
	width: auto;
	height: auto;
}

@media (max-width: 600px) {
	.site-logo-container img,
	.site-logo-container .default-logo { max-height: 40px; }
}

/* ==========================================================================
   21. (Retirada en el rediseno Fairway)
   El hero a pantalla completa con velo oscuro se sustituyo por el hero claro
   a dos columnas de la seccion 13: la imagen o el video van ahora dentro de
   la pildora de la escena. El diseno anterior esta en git (rama del tema).
   ========================================================================== */

/* ==========================================================================
   22. Categorias sin productos todavia
   ========================================================================== */

.gc-vacio {
	background: var(--gc-fondo);
	border: 0;
	border-left: 4px solid var(--gc-verde);
	border-radius: var(--gc-radio);
	padding: clamp(1.6rem, 4vw, 2.5rem);
	max-width: 720px;
}

.gc-vacio h2 { margin: 0 0 .6rem; font-size: clamp(1.3rem, 3vw, 1.7rem); color: var(--gc-tinta); }
.gc-vacio p  { color: var(--gc-suave); margin: 0 0 1rem; }
.gc-vacio__acciones { display: flex; flex-wrap: wrap; gap: .7rem; margin: 1.4rem 0 0 !important; }

/* ==========================================================================
   23. Carrito de presupuestos
   ========================================================================== */

/* --- Boton en las tarjetas y en la ficha --- */
.gc-presu-boton {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .45em;
	width: 100%;
	margin-top: .5rem;
	padding: .68em 1em;
	background: #fff;
	color: var(--gc-verde-oscuro);
	border: 1px solid var(--gc-verde-borde);
	border-radius: var(--gc-pildora);
	font-weight: 600;
	font-size: .9rem;
	line-height: 1.2;
	cursor: pointer;
	transition: background .15s ease, border-color .15s ease;
}

.gc-presu-boton:hover:not(:disabled) {
	background: var(--gc-verde-claro);
	border-color: var(--gc-verde);
}

.gc-presu-boton:disabled { opacity: .65; cursor: default; }
.gc-presu-boton--cargando { opacity: .7; }

.single-product .gc-presu-boton { width: auto; margin-left: .6rem; }

/* --- Aviso flotante --- */
.gc-presu-aviso {
	position: fixed;
	left: 50%;
	bottom: 24px;
	transform: translate(-50%, 130%);
	z-index: 9999;
	background: var(--gc-oscuro);
	color: #fff;
	padding: .85rem 1.25rem;
	border-radius: 999px;
	box-shadow: 0 12px 32px rgba(0, 0, 0, .28);
	font-size: .93rem;
	font-weight: 600;
	max-width: calc(100% - 32px);
	text-align: center;
	transition: transform .3s cubic-bezier(.2, .8, .3, 1), opacity .3s ease;
	opacity: 0;
}

.gc-presu-aviso--visible { transform: translate(-50%, 0); opacity: 1; }
.gc-presu-aviso a { color: var(--gc-sobre-oscuro-verde); text-decoration: underline; }

/* --- Enlace del menu --- */
.gc-presu-enlace {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	font-weight: 700;
	color: var(--gc-verde-oscuro) !important;
	text-decoration: none;
	padding: .5rem .9rem;
	border: 1px solid var(--gc-verde-borde);
	border-radius: 999px;
	background: var(--gc-verde-claro);
	transition: border-color .16s ease, box-shadow .16s ease;
}

.gc-presu-enlace:hover { border-color: var(--gc-verde); box-shadow: var(--gc-sombra); }

.gc-presu-contador {
	display: grid;
	place-items: center;
	min-width: 21px;
	height: 21px;
	padding: 0 .35rem;
	border-radius: 999px;
	background: var(--gc-verde);
	color: #fff;
	font-size: .74rem;
	font-weight: 800;
	font-variant-numeric: tabular-nums;
}

.gc-presu-contador--vacio { background: var(--gc-sobre-oscuro-suave); }
.gc-presu-item { display: flex; align-items: center; }

@media (max-width: 782px) {
	.gc-presu-texto { display: none; }
	.gc-presu-enlace { padding: .5rem .65rem; }
}

/* --- Pagina de la solicitud --- */
.gc-presu-tabla {
	width: 100%;
	border-collapse: collapse;
	background: var(--gc-fondo);
	border: 0;
	border-radius: var(--gc-radio);
	overflow: hidden;
	margin-bottom: 1.2rem;
}

.gc-presu-tabla th,
.gc-presu-tabla td {
	padding: .85rem 1rem;
	text-align: left;
	border-bottom: 1px solid var(--gc-linea);
	vertical-align: middle;
}

.gc-presu-tabla thead th {
	background: var(--gc-fondo-2);
	font-size: .82rem;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: var(--gc-suave);
}

.gc-presu-tabla tbody tr:last-child td { border-bottom: 0; }
.gc-presu-tabla a { font-weight: 600; color: var(--gc-tinta); text-decoration: none; }
.gc-presu-tabla a:hover { color: var(--gc-verde); }

.gc-presu-tabla input[type="number"] {
	width: 82px;
	padding: .45em .6em;
	border: 1px solid var(--gc-linea);
	border-radius: 8px;
	text-align: center;
	font-variant-numeric: tabular-nums;
}

.gc-presu-tabla__acciones {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .7rem;
	margin-bottom: 2.5rem;
}

.gc-presu-nota { font-size: .87rem; color: var(--gc-suave); }

/* Tabla en movil: cada fila se convierte en ficha */
@media (max-width: 640px) {
	.gc-presu-tabla thead { display: none; }
	.gc-presu-tabla, .gc-presu-tabla tbody, .gc-presu-tabla tr, .gc-presu-tabla td { display: block; width: 100%; }
	.gc-presu-tabla tr { border-bottom: 1px solid var(--gc-linea); padding: .5rem 0; }
	.gc-presu-tabla td { border: 0; display: flex; justify-content: space-between; gap: 1rem; padding: .45rem 1rem; }
	.gc-presu-tabla td::before {
		content: attr(data-etiqueta);
		font-size: .8rem;
		font-weight: 700;
		color: var(--gc-suave);
		text-transform: uppercase;
		letter-spacing: .04em;
	}
}

/* --- Formulario --- */
.gc-presu-form {
	background: var(--gc-fondo);
	border: 0;
	border-radius: var(--gc-radio);
	padding: clamp(1.5rem, 4vw, 2.25rem);
}

.gc-presu-form h2 { margin: 0 0 .35rem; font-size: 1.4rem; }
.gc-presu-form__intro { color: var(--gc-suave); margin: 0 0 1.5rem; font-size: .95rem; }

.gc-presu-form__rejilla {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: 1rem 1.2rem;
	margin-bottom: 1.1rem;
}

.gc-presu-form label { display: block; }

.gc-presu-form label > span {
	display: block;
	font-weight: 600;
	font-size: .89rem;
	color: var(--gc-tinta);
	margin-bottom: .35rem;
}

.gc-presu-form label > span b { color: var(--gc-verde); }

.gc-presu-form input[type="text"],
.gc-presu-form input[type="email"],
.gc-presu-form input[type="tel"],
.gc-presu-form textarea {
	width: 100%;
	padding: .72em .85em;
	border: 1px solid var(--gc-linea);
	border-radius: var(--gc-radio-sm);
	font-size: 1rem;
	font-family: inherit;
	background: #fff;
}

.gc-presu-form input:focus,
.gc-presu-form textarea:focus {
	border-color: var(--gc-verde);
	box-shadow: 0 0 0 3px rgba(14, 122, 62, .12);
	outline: none;
}

.gc-presu-form__ancho { margin-bottom: 1.2rem; }

.gc-presu-form__consentimiento {
	display: flex !important;
	gap: .65rem;
	align-items: flex-start;
	font-size: .9rem;
	color: var(--gc-suave);
	margin-bottom: 1.4rem;
}

.gc-presu-form__consentimiento input { margin-top: .2rem; flex: 0 0 auto; }

.gc-presu-enviar { width: 100%; padding: .95em 1.5em; font-size: 1rem; }

/* Trampa antispam: fuera de la vista pero no con display:none, que algunos
   robots detectan. */
.gc-presu-trampa {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* --- Estados --- */
.gc-presu-vacio,
.gc-presu-ok {
	background: var(--gc-fondo);
	border: 0;
	border-left: 4px solid var(--gc-verde);
	border-radius: var(--gc-radio);
	padding: clamp(1.6rem, 4vw, 2.5rem);
	max-width: 720px;
}

.gc-presu-vacio h2,
.gc-presu-ok h2 { margin: 0 0 .6rem; color: var(--gc-tinta); }
.gc-presu-vacio p,
.gc-presu-ok p { color: var(--gc-suave); }

/* ==========================================================================
   24. Pie de pagina
   ========================================================================== */

.gc-pie {
	background: var(--gc-blanco);
	color: var(--gc-suave);
	border-top: 1px solid var(--gc-linea);
	padding: clamp(2.5rem, 6vw, 3.75rem) 0 clamp(1.5rem, 3vw, 2rem);
}

.gc-pie__rejilla {
	display: grid;
	grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr));
	gap: 2.5rem 2rem;
}

.gc-pie__logo {
	width: 190px;
	height: auto;
	margin-bottom: 1rem;
	display: block;
}

.gc-pie__nombre {
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--gc-tinta);
	margin: 0 0 1rem;
}

.gc-pie__texto {
	font-size: .92rem;
	line-height: 1.65;
	margin: 0 0 1.25rem;
	max-width: 42ch;
}

.gc-pie h3 {
	color: var(--gc-tinta);
	font-size: .8rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .08em;
	margin: 0 0 1rem;
}

.gc-pie ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: .55rem;
}

.gc-pie a {
	color: var(--gc-suave);
	text-decoration: none;
	font-size: .93rem;
	transition: color .15s ease;
}

.gc-pie a:hover { color: var(--gc-verde); }

.gc-pie__contacto a {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	font-weight: 600;
	color: var(--gc-verde-oscuro);
}

.gc-pie__iva {
	margin: 1.25rem 0 0;
	font-size: .82rem;
	color: var(--gc-suave);
}

/* La linea de creditos de Blocksy, integrada con el pie claro */
.site-footer .ct-footer > div:last-child,
.site-footer [data-id="copyright"] {
	background: var(--gc-blanco) !important;
	color: var(--gc-suave) !important;
	border-top: 1px solid var(--gc-linea);
}

.site-footer [data-id="copyright"] a { color: var(--gc-verde-oscuro) !important; }

@media (max-width: 900px) {
	.gc-pie__rejilla { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.gc-pie__col--marca { grid-column: 1 / -1; }
}

@media (max-width: 520px) {
	.gc-pie__rejilla { grid-template-columns: 1fr; gap: 2rem; }
}

/* ==========================================================================
   25. Paginas legales
   ========================================================================== */

.gc-legal-aviso {
	background: var(--gc-ambar-bg);
	border: 1px solid #E8CE9A;
	border-left: 4px solid var(--gc-ambar);
	border-radius: var(--gc-radio-sm);
	padding: 1rem 1.25rem;
	margin-bottom: 2rem;
}

.gc-legal-aviso p { margin: 0; color: var(--gc-ambar-texto); font-size: .94rem; }
.gc-legal-aviso code { background: rgba(0,0,0,.07); padding: .1em .4em; border-radius: 4px; font-weight: 700; }

.page .entry-content h2 {
	margin-top: 2.25rem;
	font-size: 1.3rem;
	padding-bottom: .5rem;
	border-bottom: 1px solid var(--gc-linea);
}

.page .entry-content table {
	width: 100%;
	border-collapse: collapse;
	margin: 1.25rem 0;
	font-size: .92rem;
}

.page .entry-content th,
.page .entry-content td {
	border: 1px solid var(--gc-linea);
	padding: .65rem .8rem;
	text-align: left;
	vertical-align: top;
}

.page .entry-content thead th { background: var(--gc-fondo); font-weight: 700; }

.page .entry-content blockquote {
	background: var(--gc-fondo);
	border-left: 4px solid var(--gc-verde);
	padding: 1.25rem 1.5rem;
	margin: 1.5rem 0;
	border-radius: 0 var(--gc-radio-sm) var(--gc-radio-sm) 0;
}

@media (max-width: 640px) {
	.page .entry-content table,
	.page .entry-content thead,
	.page .entry-content tbody,
	.page .entry-content tr,
	.page .entry-content td { display: block; width: 100%; }
	.page .entry-content thead { display: none; }
	.page .entry-content td { border: 0; border-bottom: 1px solid var(--gc-linea); }
	.page .entry-content tr { border: 1px solid var(--gc-linea); border-radius: 8px; margin-bottom: 1rem; padding: .5rem; }
}

/* ==========================================================================
   26. Buscador en catalogo y categorias
   ========================================================================== */

.gc-buscador-catalogo {
	background: var(--gc-fondo);
	border: 0;
	border-radius: var(--gc-radio);
	padding: 1.35rem 1.5rem;
	margin-bottom: 1.75rem;
}

.gc-buscador-catalogo__fila {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	flex-wrap: wrap;
}

.gc-buscador-catalogo__texto { flex: 1 1 220px; }

.gc-buscador-catalogo__texto strong {
	display: block;
	color: var(--gc-tinta);
	font-size: 1.05rem;
	line-height: 1.3;
}

.gc-buscador-catalogo__texto span { font-size: .9rem; color: var(--gc-suave); }

.gc-buscador-catalogo .gc-buscador {
	flex: 2 1 380px;
	margin: 0;
	max-width: none;
	box-shadow: none;
}

.gc-buscador-catalogo__modelos {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .45rem;
	margin-top: 1.15rem;
	padding-top: 1.15rem;
	border-top: 1px solid var(--gc-linea);
}

.gc-buscador-catalogo__etiqueta {
	font-size: .82rem;
	font-weight: 700;
	color: var(--gc-suave);
	text-transform: uppercase;
	letter-spacing: .05em;
	margin-right: .3rem;
}

.gc-chip {
	display: inline-block;
	padding: .38rem .85rem;
	border: 0;
	border-radius: var(--gc-pildora);
	font-size: .86rem;
	font-weight: 600;
	color: var(--gc-tinta);
	text-decoration: none;
	background: #fff;
	transition: background .2s ease, color .2s ease;
}

.gc-chip:hover {
	background: var(--gc-verde-claro);
	color: var(--gc-verde-oscuro);
}

.gc-chip--activo {
	background: var(--gc-verde);
	border-color: var(--gc-verde);
	color: #fff;
}

.gc-buscador-catalogo__resultado {
	margin: 1.1rem 0 0;
	padding-top: 1.1rem;
	border-top: 1px solid var(--gc-linea);
	font-size: .93rem;
	color: var(--gc-suave);
}

/* ==========================================================================
   27. Ajustes de la tarjeta en catalogo
   ========================================================================== */

/* Estando dentro de una categoria, repetirla bajo el precio sobra */
.woocommerce ul.products li.product .entry-meta,
.tax-product_cat ul.products li.product .entry-meta { display: none; }

/* El boton de presupuesto es secundario: no debe pesar igual que el de compra */
.gc-presu-boton--pequeno {
	padding: .5em .8em;
	font-size: .84rem;
	margin-top: .35rem;
	background: transparent;
	border-color: var(--gc-linea);
	color: var(--gc-suave);
}

.gc-presu-boton--pequeno:hover:not(:disabled) {
	background: var(--gc-verde-claro);
	border-color: var(--gc-verde-borde);
	color: var(--gc-verde-oscuro);
}

@media (max-width: 700px) {
	.gc-buscador-catalogo { padding: 1.15rem 1.15rem; }
	.gc-buscador-catalogo__fila { gap: .85rem; }
	.gc-buscador-catalogo__modelos { gap: .35rem; }
	.gc-chip { font-size: .8rem; padding: .32rem .7rem; }
}

/* ==========================================================================
   28. Carrito
   ========================================================================== */

/* --- Tabla de productos --- */
.woocommerce-cart table.shop_table {
	background: #fff;
	border: 1px solid var(--gc-linea);
	border-radius: var(--gc-radio);
	border-collapse: separate;
	border-spacing: 0;
	overflow: hidden;
	box-shadow: var(--gc-sombra);
}

.woocommerce-cart table.shop_table th {
	background: var(--gc-fondo);
	border-bottom: 1px solid var(--gc-linea);
	padding: .9rem 1.1rem;
	font-size: .78rem;
	text-transform: uppercase;
	letter-spacing: .05em;
	color: var(--gc-suave);
	font-weight: 700;
}

.woocommerce-cart table.shop_table td {
	padding: 1.1rem;
	border-bottom: 1px solid var(--gc-linea);
	vertical-align: middle;
}

.woocommerce-cart table.shop_table tr:last-child td { border-bottom: 0; }

/* Imagen del producto: mas grande y con marco */
.woocommerce-cart table.shop_table td.product-thumbnail img,
.woocommerce-cart table.shop_table .product-thumbnail img {
	width: 78px;
	height: 78px;
	object-fit: cover;
	border-radius: var(--gc-radio-sm);
	border: 0;
	background: #fff;
}

.woocommerce-cart td.product-name a {
	font-weight: 700;
	color: var(--gc-tinta);
	text-decoration: none;
	font-size: 1.02rem;
	line-height: 1.35;
}

.woocommerce-cart td.product-name a:hover { color: var(--gc-verde); }

.gc-sku--carrito {
	display: inline-block;
	margin-top: .35rem;
}

/* La descripcion corta recortada solo mete ruido aqui */
.woocommerce-cart td.product-name .ct-cart-item-description,
.woocommerce-cart td.product-name p.item-desc { display: none; }

.woocommerce-cart td.product-price,
.woocommerce-cart td.product-subtotal {
	font-weight: 800;
	color: var(--gc-tinta);
	font-variant-numeric: tabular-nums;
}

/* --- Resumen --- */
.woocommerce-cart .cart_totals {
	background: var(--gc-fondo);
	border: 0;
	border-radius: var(--gc-radio);
	padding: 1.5rem;
}

.woocommerce-cart .cart_totals h2 {
	font-size: 1.1rem;
	text-transform: uppercase;
	letter-spacing: .04em;
	margin: 0 0 1rem;
	padding-bottom: .8rem;
	border-bottom: 1px solid var(--gc-linea);
}

.woocommerce-cart .cart_totals .order-total {
	font-size: 1.15rem;
	font-weight: 800;
}

.woocommerce-cart .checkout-button {
	width: 100%;
	padding: 1em 1.5em !important;
	font-size: 1.05rem !important;
	font-weight: 700 !important;
	border-radius: var(--gc-pildora) !important;
}

/* --- Garantias --- */
.gc-garantias {
	display: grid;
	gap: .9rem;
	margin-top: 1.35rem;
	padding: 1.25rem;
	background: var(--gc-fondo);
	border: 0;
	border-radius: var(--gc-radio);
}

.gc-garantias__item { display: flex; gap: .7rem; align-items: flex-start; }

.gc-garantias__icono {
	flex: 0 0 auto;
	width: 32px;
	height: 32px;
	display: grid;
	place-items: center;
	background: var(--gc-verde-claro);
	border-radius: 9px;
	color: var(--gc-verde);
}

.gc-garantias__item strong {
	display: block;
	color: var(--gc-tinta);
	font-size: .91rem;
	line-height: 1.3;
}

.gc-garantias__item span span { font-size: .84rem; color: var(--gc-suave); }

/* --- Caja de ayuda --- */
.gc-ayuda-pedido {
	margin-top: 1.1rem;
	padding: 1.25rem;
	background: var(--gc-verde-claro);
	border: 0;
	border-radius: var(--gc-radio);
}

.gc-ayuda-pedido__titulo {
	display: flex;
	align-items: center;
	gap: .45rem;
	margin: 0 0 .4rem;
	font-weight: 800;
	color: var(--gc-verde-oscuro);
}

.gc-ayuda-pedido p { margin: 0 0 .5rem; font-size: .9rem; color: var(--gc-texto); }

.gc-ayuda-pedido__contacto {
	display: flex;
	flex-wrap: wrap;
	gap: .3rem 1rem;
	margin: .7rem 0 0 !important;
}

.gc-ayuda-pedido__contacto a {
	font-weight: 700;
	color: var(--gc-verde-oscuro);
	text-decoration: none;
	border-bottom: 1px solid var(--gc-verde-borde);
}

.gc-ayuda-pedido__contacto a:hover { border-color: var(--gc-verde); }

/* --- Seguir comprando --- */
.gc-seguir-comprando { margin: 1.15rem 0 0; }

.gc-seguir-comprando a {
	font-weight: 700;
	color: var(--gc-verde-oscuro);
	text-decoration: none;
}

.gc-seguir-comprando a:hover { text-decoration: underline; }

/* --- Carrito vacio --- */
.gc-carrito-vacio {
	background: var(--gc-fondo);
	border: 0;
	border-radius: var(--gc-radio);
	padding: clamp(1.75rem, 5vw, 3rem);
	max-width: 680px;
}

.gc-carrito-vacio h2 { margin: 0 0 .6rem; color: var(--gc-tinta); }
.gc-carrito-vacio p { color: var(--gc-suave); }
.gc-carrito-vacio .gc-buscador { margin: 1.35rem 0 0; }
.gc-carrito-vacio__acciones { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1.35rem !important; }

/* --- Movil: cada linea, una ficha --- */
@media (max-width: 768px) {
	.woocommerce-cart table.shop_table thead { display: none; }
	.woocommerce-cart table.shop_table,
	.woocommerce-cart table.shop_table tbody,
	.woocommerce-cart table.shop_table tr,
	.woocommerce-cart table.shop_table td { display: block; width: 100%; }

	.woocommerce-cart table.shop_table tr {
		border-bottom: 1px solid var(--gc-linea);
		padding: .5rem 0;
	}

	.woocommerce-cart table.shop_table td {
		border: 0;
		padding: .4rem 1rem;
		text-align: left;
	}

	.woocommerce-cart table.shop_table td.product-thumbnail { padding-bottom: 0; }
	.woocommerce-cart table.shop_table td.product-thumbnail img { width: 96px; height: 96px; }
	.gc-garantias { gap: .8rem; }
}

/* ==========================================================================
   29. Ficha de producto
   ========================================================================== */

/* --- Imagen --- */
.single-product .woocommerce-product-gallery {
	background: var(--gc-fondo);
	border: 0;
	border-radius: var(--gc-radio);
	padding: 1rem;
}

.single-product .woocommerce-product-gallery img { border-radius: var(--gc-radio-sm); }

/* --- Titulo y precio --- */
.single-product .product_title {
	font-size: clamp(1.5rem, 3.2vw, 2.1rem);
	line-height: 1.2;
	margin-bottom: .6rem;
}

.single-product div.product p.price,
.single-product div.product span.price {
	font-size: clamp(1.6rem, 3.4vw, 2.1rem);
	font-weight: 800;
	color: var(--gc-tinta);
	margin-bottom: .35rem;
}

.single-product .woocommerce-product-details__short-description {
	color: var(--gc-suave);
	font-size: .98rem;
	line-height: 1.6;
	margin-bottom: 1.25rem;
}

/* --- Panel de datos clave --- */
.gc-datos-clave {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1px;
	background: var(--gc-linea);
	border: 0;
	border-radius: var(--gc-radio);
	overflow: hidden;
	margin: 0 0 1.5rem;
}

.gc-dato {
	background: var(--gc-fondo);
	padding: .85rem 1rem;
	display: flex;
	flex-direction: column;
	gap: .25rem;
}

.gc-dato--ancho { grid-column: 1 / -1; }

.gc-dato__etiqueta {
	font-size: .74rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--gc-suave);
}

.gc-dato__valor {
	font-weight: 700;
	color: var(--gc-tinta);
	font-size: .96rem;
	line-height: 1.4;
}

.gc-dato__valor--ref {
	font-variant-numeric: tabular-nums;
	letter-spacing: .02em;
	font-size: 1.05rem;
}

.gc-dato__modelo {
	display: inline-block;
	background: var(--gc-verde-claro);
	color: var(--gc-verde-oscuro);
	border: 0;
	border-radius: var(--gc-pildora);
	padding: .18rem .65rem;
	font-size: .84rem;
	font-weight: 700;
	margin: .15rem .25rem .15rem 0;
}

/* Disponibilidad */
.gc-disp { display: flex; flex-direction: column; gap: .1rem; }
.gc-disp small { font-weight: 500; font-size: .82rem; color: var(--gc-suave); }
.gc-disp--si { color: var(--gc-verde); }
.gc-disp--pedido,
.gc-disp--consultar { color: var(--gc-ambar); }

/* --- Botones de compra --- */
.single-product form.cart { margin-bottom: 1.1rem !important; }

.single-product form.cart .quantity input.qty {
	height: 48px;
	border: 1px solid var(--gc-linea);
	border-radius: var(--gc-radio-sm);
	text-align: center;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

.single-product .single_add_to_cart_button {
	min-height: 48px;
	font-weight: 700 !important;
	font-size: 1rem !important;
	padding-inline: 1.75em !important;
	border-radius: var(--gc-pildora) !important;
}

/* --- Garantias --- */
.gc-ficha-garantias {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem 1.35rem;
	padding: .85rem 0 1.1rem;
	border-top: 1px solid var(--gc-linea);
	border-bottom: 1px solid var(--gc-linea);
	margin-bottom: 1.1rem;
}

.gc-ficha-garantias span {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	font-size: .87rem;
	font-weight: 600;
	color: var(--gc-texto);
}

.gc-ficha-garantias svg { color: var(--gc-verde); flex: 0 0 auto; }

/* --- Caja de ayuda --- */
.gc-ficha-ayuda {
	background: var(--gc-verde-claro);
	border: 0;
	border-radius: var(--gc-radio);
	padding: 1.1rem 1.25rem;
}

.gc-ficha-ayuda p { margin: 0 0 .4rem; font-size: .91rem; color: var(--gc-texto); }
.gc-ficha-ayuda p strong { color: var(--gc-verde-oscuro); }

.gc-ficha-ayuda__contacto {
	display: flex;
	flex-wrap: wrap;
	gap: .3rem 1rem;
	margin: .7rem 0 0 !important;
}

.gc-ficha-ayuda__contacto a {
	font-weight: 700;
	color: var(--gc-verde-oscuro);
	text-decoration: none;
	border-bottom: 1px solid var(--gc-verde-borde);
}

.gc-ficha-ayuda__contacto a:hover { border-color: var(--gc-verde); }

/* --- Pestanas --- */
.single-product .woocommerce-tabs {
	background: var(--gc-fondo);
	border: 0;
	border-radius: var(--gc-radio);
	padding: 1.5rem;
	margin-top: 2.5rem;
}

.single-product .woocommerce-tabs ul.tabs { padding-left: 0 !important; margin-bottom: 1.25rem; }

.single-product .woocommerce-tabs .panel h2:first-child { display: none; }

.single-product .woocommerce-tabs .panel h2,
.single-product .woocommerce-tabs .panel h3 {
	font-size: 1.12rem;
	margin: 1.5rem 0 .6rem;
	color: var(--gc-tinta);
}

.single-product .woocommerce-tabs .panel ul { padding-left: 1.2rem; }
.single-product .woocommerce-tabs .panel li { margin-bottom: .3rem; }

/* Bloque de enlaces internos al final de la descripcion */
.gc-ficha-enlaces {
	margin-top: 1.75rem;
	padding-top: 1.1rem;
	border-top: 1px solid var(--gc-linea);
	font-size: .93rem;
	color: var(--gc-suave);
}

.gc-ficha-enlaces a { font-weight: 700; }

/* --- Relacionados --- */
.single-product .related > h2,
.single-product .up-sells > h2 {
	font-size: clamp(1.3rem, 2.8vw, 1.7rem);
	margin-bottom: 1.35rem;
}

.single-product .related ul.products,
.single-product .up-sells ul.products {
	--shop-columns: repeat(auto-fill, minmax(210px, 1fr));
}

/* --- Escritorio: el resumen acompana al hacer scroll --- */
@media (min-width: 1000px) {
	.single-product div.product .summary {
		position: sticky;
		top: 96px;
		align-self: start;
	}
}

@media (max-width: 600px) {
	.gc-datos-clave { grid-template-columns: 1fr; }
	.single-product .woocommerce-product-gallery { padding: .6rem; }
}

/* La referencia ya aparece en el panel de datos clave */
.single-product .product_meta .sku_wrapper { display: none; }

.single-product .product_meta {
	margin-top: 1.1rem;
	padding-top: .9rem;
	border-top: 1px solid var(--gc-linea);
	font-size: .87rem;
	color: var(--gc-suave);
}

.single-product .product_meta a {
	color: var(--gc-verde-oscuro);
	font-weight: 600;
	text-decoration: none;
}

.single-product .product_meta a:hover { text-decoration: underline; }

/* ==========================================================================
   30. Desplegables del menu
   Blocksy los pinta con el color 4 de la paleta (gris oscuro) y marca el
   elemento activo con el color 2 (verde oscuro): dos oscuros juntos que no
   se distinguen. Se pasan a fondo blanco, como el resto de la interfaz.
   ========================================================================== */

.header-menu .sub-menu,
.main-navigation .sub-menu,
ul.sub-menu {
	--dropdown-background-color: #FFFFFF;
	--dropdown-divider: 1px solid var(--gc-linea);
	background-color: #FFFFFF !important;
	border: 1px solid var(--gc-linea);
	border-radius: var(--gc-radio-sm);
	box-shadow: 0 14px 34px rgba(15, 26, 23, .14);
	padding: .35rem;
	overflow: hidden;
}

.sub-menu li { border: 0 !important; }

.sub-menu .ct-menu-link {
	color: var(--gc-tinta) !important;
	font-weight: 600;
	border-radius: 7px;
	padding: .6rem .85rem !important;
	transition: background .15s ease, color .15s ease;
}

/* Estado al pasar por encima y elemento de la pagina actual */
.sub-menu li:hover > .ct-menu-link,
.sub-menu .ct-menu-link:hover,
.sub-menu .ct-menu-link:focus-visible,
.sub-menu .current-menu-item > .ct-menu-link,
.sub-menu .current-product_cat-ancestor > .ct-menu-link {
	background: var(--gc-verde-claro) !important;
	color: var(--gc-verde-oscuro) !important;
}

/* En el menu principal, mismo criterio */
.header-menu > li > .ct-menu-link:hover,
.main-navigation > ul > li > .ct-menu-link:hover {
	color: var(--gc-verde-oscuro) !important;
}

/* Flecha del desplegable, visible sobre fondo blanco */
.sub-menu .ct-toggle-dropdown-desktop svg,
.sub-menu .ct-toggle-dropdown-mobile svg { color: var(--gc-suave); }

/* ==========================================================================
   31. Sellos de pago y seguridad
   ========================================================================== */

.gc-pagos {
	margin-top: 1.1rem;
	padding: 1.25rem;
	background: var(--gc-fondo);
	border: 0;
	border-radius: var(--gc-radio);
}

.gc-pagos__seguro { display: flex; gap: .8rem; align-items: flex-start; }

.gc-pagos__candado {
	flex: 0 0 auto;
	width: 38px;
	height: 38px;
	display: grid;
	place-items: center;
	background: var(--gc-verde);
	color: #fff;
	border-radius: 50%;
}

.gc-pagos__seguro strong {
	display: block;
	color: var(--gc-tinta);
	font-size: .98rem;
	margin-bottom: .15rem;
}

.gc-pagos__seguro span span { font-size: .85rem; color: var(--gc-suave); line-height: 1.5; }

.gc-pagos__metodos {
	margin-top: 1.15rem;
	padding-top: 1.15rem;
	border-top: 1px solid var(--gc-linea);
}

.gc-pagos__titulo {
	display: block;
	font-size: .76rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--gc-suave);
	margin-bottom: .7rem;
}

.gc-pagos__lista { display: flex; flex-wrap: wrap; gap: .5rem; }

.gc-pago {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	background: #fff;
	border: 0;
	border-radius: var(--gc-pildora);
	padding: .45rem .85rem;
	font-size: .85rem;
	font-weight: 600;
	color: var(--gc-texto);
}

.gc-pago svg { color: var(--gc-verde); flex: 0 0 auto; }

/* Muestra de diseño: se distingue con un borde discontinuo */
.gc-pago--muestra { border: 1px dashed var(--gc-suave); }

.gc-pagos__aviso {
	margin: .9rem 0 0;
	padding: .7rem .85rem;
	background: var(--gc-ambar-bg);
	border-left: 3px solid var(--gc-ambar);
	border-radius: 0 6px 6px 0;
	font-size: .84rem;
	color: var(--gc-ambar-texto);
	line-height: 1.5;
}

/* En el checkout va debajo de la caja de pago */
.woocommerce-checkout .gc-pagos { margin-top: 1.5rem; }

/* ==========================================================================
   32. Finalizar compra
   ========================================================================== */

/* --- Indicador de pasos --- */
.gc-pasos-compra {
	display: flex;
	align-items: center;
	gap: .5rem;
	list-style: none;
	margin: 0 0 2rem;
	padding: 0;
	flex-wrap: wrap;
}

.gc-paso-compra {
	display: flex;
	align-items: center;
	gap: .5rem;
	font-size: .9rem;
	font-weight: 700;
	color: var(--gc-suave);
}

.gc-paso-compra:not(:last-child)::after {
	content: "";
	width: clamp(18px, 5vw, 48px);
	height: 2px;
	background: var(--gc-linea);
	margin-left: .5rem;
}

.gc-paso-compra__num {
	display: grid;
	place-items: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: var(--gc-linea);
	color: var(--gc-suave);
	font-size: .82rem;
	font-weight: 800;
	flex: 0 0 auto;
}

.gc-paso-compra--hecho .gc-paso-compra__num,
.gc-paso-compra--actual .gc-paso-compra__num {
	background: var(--gc-verde);
	color: #fff;
}

.gc-paso-compra--hecho,
.gc-paso-compra--actual { color: var(--gc-tinta); }

.gc-paso-compra--actual .gc-paso-compra__num {
	box-shadow: 0 0 0 4px rgba(14, 122, 62, .16);
}

/* --- Distribucion en dos columnas --- */
@media (min-width: 1000px) {
	.woocommerce-checkout form.checkout {
		display: grid;
		grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
		gap: 2.5rem;
		align-items: start;
	}

	.woocommerce-checkout form.checkout #customer_details { grid-column: 1; }

	.woocommerce-checkout form.checkout > h3#order_review_heading,
	.woocommerce-checkout form.checkout > #order_review {
		grid-column: 2;
	}

	.woocommerce-checkout form.checkout > #order_review {
		position: sticky;
		top: 96px;
	}
}

/* --- Bloques del formulario --- */
.woocommerce-checkout .woocommerce-billing-fields,
.woocommerce-checkout .woocommerce-shipping-fields,
.woocommerce-checkout .woocommerce-additional-fields {
	background: var(--gc-fondo);
	border: 0;
	border-radius: var(--gc-radio);
	padding: 1.5rem;
	margin-bottom: 1.25rem;
}

.woocommerce-checkout h3 {
	font-size: 1.15rem;
	margin: 0 0 1.1rem;
	padding-bottom: .75rem;
	border-bottom: 1px solid var(--gc-linea);
}

.woocommerce-checkout #order_review_heading {
	font-size: 1.15rem;
	margin: 0 0 1rem;
	padding: 0;
	border: 0;
}

/* --- Campos --- */
.woocommerce-checkout .form-row label {
	font-weight: 600;
	font-size: .89rem;
	color: var(--gc-tinta);
	margin-bottom: .35rem;
}

.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row textarea,
.woocommerce-checkout .select2-container .select2-selection--single {
	border: 1px solid var(--gc-linea) !important;
	border-radius: var(--gc-radio-sm) !important;
	padding: .72em .85em !important;
	font-size: 1rem;
	min-height: 46px;
	background: #fff;
}

.woocommerce-checkout .form-row input.input-text:focus,
.woocommerce-checkout .form-row textarea:focus {
	border-color: var(--gc-verde) !important;
	box-shadow: 0 0 0 3px rgba(14, 122, 62, .12);
	outline: none;
}

.woocommerce-checkout .form-row .description {
	font-size: .82rem;
	color: var(--gc-suave);
	margin-top: .3rem;
}

.woocommerce-checkout .required { color: var(--gc-verde); text-decoration: none; }

/* --- Resumen del pedido --- */
.woocommerce-checkout #order_review {
	background: var(--gc-fondo);
	border: 0;
	border-radius: var(--gc-radio);
	padding: 1.5rem;
}

.woocommerce-checkout table.shop_table {
	border: 0;
	box-shadow: none;
	background: transparent;
}

.woocommerce-checkout table.shop_table th,
.woocommerce-checkout table.shop_table td {
	padding: .7rem 0;
	border-bottom: 1px solid var(--gc-linea);
}

.woocommerce-checkout table.shop_table thead th { background: transparent; }

.woocommerce-checkout table.shop_table .order-total th,
.woocommerce-checkout table.shop_table .order-total td {
	font-size: 1.12rem;
	font-weight: 800;
	color: var(--gc-tinta);
	border-bottom: 0;
	padding-top: 1rem;
}

/* --- Formas de pago --- */
.woocommerce-checkout #payment {
	background: var(--gc-fondo-2) !important;
	border: 0;
	border-radius: var(--gc-radio);
	padding: 1.15rem;
	margin-top: 1.25rem;
}

.woocommerce-checkout #payment ul.payment_methods {
	border-bottom: 0;
	padding: 0;
	margin: 0 0 1rem;
}

.woocommerce-checkout #payment ul.payment_methods li {
	background: #fff;
	border: 0;
	border-radius: var(--gc-radio-sm);
	padding: .85rem 1rem;
	margin-bottom: .55rem;
	list-style: none;
}

.woocommerce-checkout #payment div.payment_box {
	background: var(--gc-verde-claro) !important;
	border-radius: var(--gc-radio-sm);
	font-size: .89rem;
	color: var(--gc-texto);
}

.woocommerce-checkout #payment div.payment_box::before { display: none; }

.woocommerce-checkout #place_order {
	width: 100%;
	min-height: 54px;
	font-size: 1.05rem !important;
	font-weight: 700 !important;
	border-radius: var(--gc-pildora) !important;
}

/* --- Aviso de compatibilidad --- */
.gc-checkout-aviso {
	background: var(--gc-ambar-bg);
	border-left: 3px solid var(--gc-ambar);
	border-radius: 0 var(--gc-radio-sm) var(--gc-radio-sm) 0;
	padding: .9rem 1rem;
	margin-bottom: 1rem;
}

.gc-checkout-aviso p { margin: 0 0 .3rem; font-size: .88rem; color: var(--gc-ambar-texto); line-height: 1.5; }
.gc-checkout-aviso p:last-child { margin-bottom: 0; }

.gc-checkout-aviso__contacto a {
	font-weight: 700;
	color: var(--gc-ambar-texto);
	margin-left: .5rem;
	border-bottom: 1px solid rgba(107, 70, 0, .35);
	text-decoration: none;
}

/* --- Avisos de WooCommerce --- */
.woocommerce-checkout .woocommerce-info,
.woocommerce-checkout .woocommerce-message {
	background: var(--gc-verde-claro);
	border-top-color: var(--gc-verde);
	color: var(--gc-texto);
	border-radius: var(--gc-radio-sm);
}

@media (max-width: 1000px) {
	.woocommerce-checkout #order_review { margin-top: 1.25rem; }
	.gc-paso-compra__texto { font-size: .82rem; }
}

/* ==========================================================================
   33. Tablas de carrito y pedido: solo lineas horizontales
   Blocksy pinta los bordes con sus propias variables y encima la tabla va
   dentro de una tarjeta que ya tiene marco: salia una rejilla con doble
   recuadro. Se anulan sus variables y se deja una unica linea de separacion.
   ========================================================================== */

.woocommerce-cart table.shop_table,
.woocommerce-checkout table.shop_table,
.cart_totals table {
	--theme-table-border-width: 0;
	--theme-table-border-style: solid;
	border: 0 !important;
	border-collapse: collapse !important;
	box-shadow: none !important;
	background: transparent !important;
	margin: 0 !important;
	width: 100%;
}

.woocommerce-cart table.shop_table tr,
.woocommerce-checkout table.shop_table tr,
.cart_totals table tr {
	--theme-table-border-width: 0;
	border: 0 !important;
}

/* Una sola linea bajo cada fila */
.woocommerce-cart table.shop_table tbody td,
.woocommerce-checkout table.shop_table tbody td,
.woocommerce-checkout table.shop_table tbody th,
.cart_totals table tbody th,
.cart_totals table tbody td {
	border: 0 !important;
	border-bottom: 1px solid var(--gc-linea) !important;
	background: transparent !important;
	padding: .95rem 0 !important;
	vertical-align: middle;
}

/* Cabecera: linea mas marcada y sin fondo de caja */
.woocommerce-cart table.shop_table thead th,
.woocommerce-checkout table.shop_table thead th {
	border: 0 !important;
	border-bottom: 2px solid var(--gc-linea) !important;
	background: transparent !important;
	padding: 0 0 .7rem !important;
	font-size: .74rem;
	letter-spacing: .07em;
	text-transform: uppercase;
	color: var(--gc-suave);
	font-weight: 700;
}

/* La ultima fila no necesita raya: ya la cierra la tarjeta */
.woocommerce-cart table.shop_table tbody tr:last-child td,
.woocommerce-checkout table.shop_table tbody tr:last-child td,
.woocommerce-checkout table.shop_table tbody tr:last-child th,
.cart_totals table tbody tr:last-child th,
.cart_totals table tbody tr:last-child td {
	border-bottom: 0 !important;
}

/* Alineacion: primera columna a la izquierda, importes a la derecha */
.woocommerce-cart table.shop_table td.product-thumbnail { padding-right: 1rem !important; width: 96px; }
.woocommerce-cart table.shop_table td.product-subtotal,
.woocommerce-cart table.shop_table th.product-subtotal,
.woocommerce-checkout table.shop_table td,
.woocommerce-checkout table.shop_table thead th:last-child,
.cart_totals table td { text-align: right; }

.woocommerce-checkout table.shop_table th,
.cart_totals table th { text-align: left; font-weight: 600; color: var(--gc-texto); }

.woocommerce-cart table.shop_table td.product-remove,
.woocommerce-cart table.shop_table th.product-remove { text-align: right; width: 44px; }

.woocommerce-cart table.shop_table td.product-quantity,
.woocommerce-cart table.shop_table th.product-quantity { text-align: center; }

/* Total, destacado y sin caja */
.cart_totals table tr.order-total th,
.cart_totals table tr.order-total td,
.woocommerce-checkout table.shop_table tfoot tr.order-total th,
.woocommerce-checkout table.shop_table tfoot tr.order-total td {
	border-top: 2px solid var(--gc-linea) !important;
	border-bottom: 0 !important;
	padding-top: 1rem !important;
	font-size: 1.14rem;
	font-weight: 800;
	color: var(--gc-tinta);
}

.woocommerce-checkout table.shop_table tfoot th,
.woocommerce-checkout table.shop_table tfoot td {
	border: 0 !important;
	border-bottom: 1px solid var(--gc-linea) !important;
	padding: .8rem 0 !important;
	background: transparent !important;
}

/* El IVA, en pequeno y sin romper la linea del total */
.cart_totals .order-total small,
.woocommerce-checkout .order-total small {
	display: block;
	font-size: .78rem;
	font-weight: 500;
	color: var(--gc-suave);
	margin-top: .2rem;
}

/* --- Cupon: integrado, no flotando --- */
.woocommerce-cart .coupon {
	display: flex;
	gap: .5rem;
	align-items: center;
	flex-wrap: wrap;
	padding-top: 1.1rem;
	border-top: 1px solid var(--gc-linea);
	margin-top: .5rem;
}

.woocommerce-cart .coupon input#coupon_code {
	flex: 1 1 190px;
	min-height: 44px;
	border: 1px solid var(--gc-linea);
	border-radius: var(--gc-radio-sm);
	padding: .6em .85em;
}

.woocommerce-cart .coupon button,
.woocommerce-cart .actions button[name="update_cart"] {
	min-height: 44px;
	border-radius: var(--gc-pildora) !important;
}

.woocommerce-cart .actions button[name="update_cart"] {
	background: #fff !important;
	color: var(--gc-tinta) !important;
	border: 0 !important;
	font-weight: 600;
}

.woocommerce-cart .actions button[name="update_cart"]:disabled { opacity: .45; }

/* El contenedor de la tabla asume el marco */
.woocommerce-cart .woocommerce-cart-form__contents,
.woocommerce-cart form.woocommerce-cart-form {
	background: var(--gc-fondo);
	border: 0;
	border-radius: var(--gc-radio);
	padding: 1.35rem 1.5rem;
}

.woocommerce-cart .woocommerce-cart-form__contents {
	border: 0;
	padding: 0;
	box-shadow: none;
	background: transparent;
}

/* Bloque de "Tu pedido" del checkout: un solo marco */
.woocommerce-checkout #order_review .woocommerce-checkout-review-order-table { margin-bottom: 1.25rem !important; }

@media (max-width: 768px) {
	.woocommerce-cart table.shop_table tbody td { padding: .35rem 0 !important; border-bottom: 0 !important; }
	.woocommerce-cart table.shop_table tbody tr { border-bottom: 1px solid var(--gc-linea) !important; padding: .9rem 0; }
	.woocommerce-cart table.shop_table td.product-thumbnail { width: auto; }
	.woocommerce-cart .coupon { flex-direction: column; align-items: stretch; }
}

/* El desglose del IVA, bajo el importe y no pegado a él */
.cart_totals .includes_tax,
.woocommerce-checkout .includes_tax,
.woocommerce .order-total .includes_tax {
	display: block;
	font-size: .78rem;
	font-weight: 500;
	color: var(--gc-suave);
	margin-top: .25rem;
}

.cart_totals .includes_tax .amount,
.woocommerce-checkout .includes_tax .amount {
	font-weight: 600;
	color: var(--gc-suave);
}

/* Texto legal del checkout */
.woocommerce-privacy-policy-text {
	font-size: .86rem;
	color: var(--gc-suave);
	line-height: 1.55;
	margin: 1rem 0 .75rem;
}

.woocommerce-terms-and-conditions-wrapper .form-row {
	margin-bottom: .5rem;
	font-size: .89rem;
}

/* ==========================================================================
   34. Formulario de consulta de pieza
   ========================================================================== */

.gc-consulta__intro {
	background: var(--gc-verde-claro);
	border: 0;
	border-radius: var(--gc-radio-sm);
	padding: .95rem 1.15rem;
	font-size: .93rem;
	color: var(--gc-texto);
	margin-bottom: 1.75rem;
}

.gc-consulta__bloque {
	background: var(--gc-fondo);
	border: 0;
	border-radius: var(--gc-radio);
	padding: 1.5rem;
	margin: 0 0 1.25rem;
}

.gc-consulta__bloque legend {
	font-size: 1.02rem;
	font-weight: 800;
	color: var(--gc-tinta);
	padding: 0 .55rem;
	margin-left: -.55rem;
}

.gc-consulta__rejilla {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: 1rem 1.2rem;
}

.gc-campo { display: block; margin-bottom: .2rem; }
.gc-campo--ancho { margin-bottom: 1.1rem; }

.gc-campo > span {
	display: block;
	font-weight: 600;
	font-size: .89rem;
	color: var(--gc-tinta);
	margin-bottom: .35rem;
}

.gc-campo > span b { color: var(--gc-verde); }

.gc-campo input[type="text"],
.gc-campo input[type="email"],
.gc-campo input[type="tel"],
.gc-campo input[type="number"],
.gc-campo select,
.gc-campo textarea {
	width: 100%;
	padding: .7em .85em;
	border: 1px solid var(--gc-linea);
	border-radius: var(--gc-radio-sm);
	font-size: 1rem;
	font-family: inherit;
	background: #fff;
	color: var(--gc-tinta);
	min-height: 46px;
}

.gc-campo select {
	appearance: none;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235A6960' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right .8rem center;
	background-size: 18px;
	padding-right: 2.4rem;
}

.gc-campo input:focus,
.gc-campo select:focus,
.gc-campo textarea:focus {
	border-color: var(--gc-verde);
	box-shadow: 0 0 0 3px rgba(14, 122, 62, .12);
	outline: none;
}

.gc-campo small {
	display: block;
	margin-top: .3rem;
	font-size: .81rem;
	color: var(--gc-suave);
	line-height: 1.45;
}

.gc-campo input[type="file"] {
	width: 100%;
	padding: .8rem;
	border: 2px dashed var(--gc-verde-borde);
	border-radius: var(--gc-radio-sm);
	background: var(--gc-fondo);
	font-size: .9rem;
	cursor: pointer;
}

.gc-campo input[type="file"]:hover { border-color: var(--gc-verde); }

.gc-consulta__consentimiento {
	display: flex;
	gap: .65rem;
	align-items: flex-start;
	font-size: .89rem;
	color: var(--gc-suave);
	margin: 0 0 1.35rem;
}

.gc-consulta__consentimiento input { margin-top: .2rem; flex: 0 0 auto; }

.gc-consulta__enviar {
	width: 100%;
	padding: 1em 1.5em;
	font-size: 1.02rem;
}

.gc-consulta-ok,
.gc-consulta-error {
	background: var(--gc-fondo);
	border: 0;
	border-left: 4px solid var(--gc-verde);
	border-radius: var(--gc-radio);
	padding: clamp(1.6rem, 4vw, 2.5rem);
	max-width: 720px;
}

.gc-consulta-error {
	border-left-color: var(--gc-ambar);
	background: var(--gc-ambar-bg);
	padding: 1rem 1.25rem;
	margin-bottom: 1.5rem;
}

.gc-consulta-error p { margin: 0; color: var(--gc-ambar-texto); }
.gc-consulta-ok h2 { margin: 0 0 .6rem; color: var(--gc-tinta); }
.gc-consulta-ok p { color: var(--gc-suave); }


/* ==========================================================================
   35. Formulario de consulta: ajustes de maquetacion
   Los bloques son <div> con <h2>, no <fieldset> con <legend>: la colocacion
   de un legend la decide el navegador y no se controla de forma fiable.
   ========================================================================== */

.gc-consulta,
.gc-consulta__intro {
	max-width: 860px;
	margin-inline: auto;
}

.gc-consulta__bloque {
	padding: 1.6rem;
	border: 0;
	margin-bottom: 1.25rem;
}

.gc-consulta__titulo {
	margin: 0 0 1.35rem;
	padding: 0 0 .85rem;
	border-bottom: 1px solid var(--gc-linea);
	font-size: 1.05rem;
	font-weight: 800;
	color: var(--gc-tinta);
	line-height: 1.3;
}

/* Dos columnas: con cinco campos en fila el ultimo quedaba huerfano */
.gc-consulta__rejilla {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 1.15rem 1.25rem;
}

.gc-consulta__rejilla .gc-campo { margin-bottom: 0; }

.gc-consulta textarea { min-height: 130px; resize: vertical; }
.gc-consulta input[type="number"] { max-width: 200px; }
.gc-consulta input[type="file"] { max-width: 100%; }

.gc-consulta__consentimiento { margin: 0 0 1.35rem; }
.gc-consulta__enviar { width: 100%; }

@media (max-width: 700px) {
	.gc-consulta__bloque { padding: 1.2rem; }
	.gc-consulta__rejilla { grid-template-columns: 1fr; gap: 1rem; }
}

/* ==========================================================================
   36. Selector de vehiculo
   ========================================================================== */

.gc-vehiculo {
	background: var(--gc-oscuro);
	border-radius: var(--gc-radio);
	padding: 1.35rem 1.5rem;
	margin-bottom: 1.5rem;
	color: var(--gc-sobre-oscuro);
}

.gc-vehiculo__cabecera {
	display: flex;
	gap: .75rem;
	align-items: flex-start;
	margin-bottom: 1.1rem;
}

.gc-vehiculo__icono {
	flex: 0 0 auto;
	width: 36px;
	height: 36px;
	display: grid;
	place-items: center;
	background: rgba(255, 255, 255, .1);
	border-radius: 10px;
	color: #fff;
}

.gc-vehiculo__cabecera strong { display: block; color: #fff; font-size: 1.02rem; }
.gc-vehiculo__cabecera span span { font-size: .87rem; color: var(--gc-sobre-oscuro-suave); }

.gc-vehiculo__campos {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: .75rem;
	align-items: end;
}

.gc-vehiculo__campo > span {
	display: block;
	font-size: .76rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .05em;
	color: var(--gc-sobre-oscuro-suave);
	margin-bottom: .35rem;
}

.gc-vehiculo__campo select {
	width: 100%;
	min-height: 44px;
	padding: .55em .8em;
	border: 1px solid rgba(255, 255, 255, .18);
	border-radius: var(--gc-radio-sm);
	background: rgba(255, 255, 255, .07);
	color: #fff;
	font-size: .95rem;
	appearance: none;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A8C0B2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right .7rem center;
	background-size: 17px;
	padding-right: 2.2rem;
}

.gc-vehiculo__campo select option { background: var(--gc-oscuro); color: #fff; }
.gc-vehiculo__campo select:focus { border-color: var(--gc-verde); outline: none; }

.gc-vehiculo__enviar { min-height: 44px; }

/* --- Barra del vehiculo elegido --- */
.gc-vehiculo-barra {
	display: flex;
	align-items: center;
	gap: .75rem;
	flex-wrap: wrap;
	background: var(--gc-verde-claro);
	border: 0;
	border-radius: var(--gc-radio);
	padding: .85rem 1.15rem;
	margin-bottom: 1.5rem;
}

.gc-vehiculo-barra__icono { color: var(--gc-verde); display: flex; }
.gc-vehiculo-barra__texto { flex: 1 1 240px; font-size: .93rem; color: var(--gc-texto); }
.gc-vehiculo-barra__texto strong { color: var(--gc-verde-oscuro); }
.gc-vehiculo-barra__acciones { margin: 0; }

.gc-vehiculo-barra__quitar {
	background: transparent;
	border: 1px solid var(--gc-verde-borde);
	color: var(--gc-verde-oscuro);
	border-radius: 999px;
	padding: .4rem .9rem;
	font-size: .85rem;
	font-weight: 700;
	cursor: pointer;
}

.gc-vehiculo-barra__quitar:hover { background: #fff; border-color: var(--gc-verde); }

/* --- Distintivo de compatibilidad --- */
.gc-compatible {
	display: inline-flex;
	align-items: center;
	gap: .3rem;
	background: var(--gc-verde);
	color: #fff;
	border-radius: 999px;
	padding: .2rem .65rem;
	font-size: .76rem;
	font-weight: 800;
	margin: 0 0 .35rem;
	letter-spacing: .01em;
}

.gc-compatible::before { content: "✓"; font-weight: 900; }

.gc-compatible--ficha { font-size: .88rem; padding: .35rem .9rem; margin-bottom: .8rem; }

.gc-incompatible {
	background: var(--gc-ambar-bg);
	border-left: 3px solid var(--gc-ambar);
	border-radius: 0 var(--gc-radio-sm) var(--gc-radio-sm) 0;
	padding: .75rem .9rem;
	font-size: .88rem;
	color: var(--gc-ambar-texto);
	margin-bottom: .9rem;
}

.gc-incompatible a { color: var(--gc-ambar-texto); font-weight: 700; }

@media (max-width: 600px) {
	.gc-vehiculo { padding: 1.15rem; }
	.gc-vehiculo__campos { grid-template-columns: 1fr; }
}

/* ==========================================================================
   37. Decodificador de numero de serie
   ========================================================================== */

.gc-serie {
	background: var(--gc-fondo);
	border: 0;
	border-radius: var(--gc-radio);
	padding: 1.25rem 1.4rem;
	margin: -.75rem 0 1.5rem;
}

.gc-serie__intro {
	margin: 0 0 .9rem;
	font-size: .92rem;
	color: var(--gc-suave);
	line-height: 1.55;
}

.gc-serie__intro strong { color: var(--gc-tinta); }

.gc-serie__campos { display: flex; gap: .55rem; flex-wrap: wrap; }

.gc-serie__campos input {
	flex: 1 1 220px;
	min-height: 46px;
	padding: .65em .9em;
	border: 1px solid var(--gc-linea);
	border-radius: var(--gc-radio-sm);
	font-size: 1rem;
	font-variant-numeric: tabular-nums;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.gc-serie__campos input:focus {
	border-color: var(--gc-verde);
	box-shadow: 0 0 0 3px rgba(14, 122, 62, .12);
	outline: none;
}

.gc-serie__campos button { min-height: 46px; }

.gc-serie__resultado {
	margin-top: .9rem;
	font-size: .93rem;
	line-height: 1.55;
	display: none;
}

.gc-serie__resultado--ok,
.gc-serie__resultado--error,
.gc-serie__resultado--cargando {
	display: block;
	padding: .85rem 1rem;
	border-radius: var(--gc-radio-sm);
}

.gc-serie__resultado--ok {
	background: var(--gc-verde-claro);
	border-left: 3px solid var(--gc-verde);
	color: var(--gc-texto);
}

.gc-serie__resultado--ok strong { color: var(--gc-verde-oscuro); font-size: 1.02rem; }

.gc-serie__resultado--error {
	background: var(--gc-ambar-bg);
	border-left: 3px solid var(--gc-ambar);
	color: var(--gc-ambar-texto);
}

.gc-serie__resultado--cargando { background: var(--gc-fondo); color: var(--gc-suave); }

.gc-serie__pref {
	font-size: .82rem;
	color: var(--gc-suave);
	font-variant-numeric: tabular-nums;
}

.gc-serie__aviso {
	display: inline-block;
	margin-top: .35rem;
	font-size: .85rem;
	color: var(--gc-ambar);
}

@media (max-width: 600px) {
	.gc-serie__campos { flex-direction: column; }
	.gc-serie__campos button { width: 100%; }
}

/* ==========================================================================
   38. Bloque unico de ayudas sobre el catalogo
   Antes eran tres tarjetas apiladas y los productos quedaban casi mil pixeles
   abajo. Ahora es una sola tarjeta con secciones separadas por lineas.
   ========================================================================== */

.gc-ayudas {
	background: var(--gc-fondo);
	border: 0;
	border-radius: var(--gc-radio);
	overflow: hidden;
	margin-bottom: 1.75rem;
}

/* Las piezas interiores pierden su marco propio */
.gc-ayudas .gc-vehiculo,
.gc-ayudas .gc-serie,
.gc-ayudas .gc-buscador-catalogo,
.gc-ayudas .gc-vehiculo-barra {
	border: 0;
	border-radius: 0;
	box-shadow: none;
	margin: 0;
}

/* 1. Buscador de referencia: es la via mas rapida, va arriba */
.gc-ayudas .gc-buscador-catalogo {
	order: 1;
	padding: 1.25rem 1.4rem;
	background: transparent;
}

/* 2. Selector de vehiculo */
.gc-ayudas .gc-vehiculo {
	order: 2;
	background: var(--gc-fondo-2);
	border-top: 1px solid var(--gc-linea);
	padding: 1.15rem 1.4rem;
	color: var(--gc-texto);
}

.gc-ayudas { display: flex; flex-direction: column; }

/* Sobre fondo claro, el selector cambia de colores */
.gc-ayudas .gc-vehiculo__cabecera { margin-bottom: .85rem; }
.gc-ayudas .gc-vehiculo__icono { background: var(--gc-verde-claro); color: var(--gc-verde); }
.gc-ayudas .gc-vehiculo__cabecera strong { color: var(--gc-tinta); }
.gc-ayudas .gc-vehiculo__cabecera span span { color: var(--gc-suave); }
.gc-ayudas .gc-vehiculo__campo > span { color: var(--gc-suave); }

.gc-ayudas .gc-vehiculo__campo select {
	background-color: #fff;
	border-color: var(--gc-linea);
	color: var(--gc-tinta);
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235A6960' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

.gc-ayudas .gc-vehiculo__campo select option { background: #fff; color: var(--gc-tinta); }

/* 3. Decodificador, plegado */
.gc-ayudas .gc-serie {
	order: 3;
	background: var(--gc-fondo);
	border-top: 1px solid var(--gc-linea);
	padding: 0 1.4rem;
}

.gc-serie__abrir {
	cursor: pointer;
	list-style: none;
	padding: .9rem 0;
	font-size: .9rem;
	font-weight: 700;
	color: var(--gc-verde-oscuro);
	display: flex;
	align-items: center;
	gap: .45rem;
}

.gc-serie__abrir::-webkit-details-marker { display: none; }

.gc-serie__abrir::before {
	content: "+";
	display: grid;
	place-items: center;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: var(--gc-verde-claro);
	border: 1px solid var(--gc-verde-borde);
	font-size: 1rem;
	line-height: 1;
	flex: 0 0 auto;
}

.gc-serie[open] .gc-serie__abrir::before { content: "\2013"; }
.gc-serie[open] .gc-serie__abrir { border-bottom: 1px solid var(--gc-linea); }
.gc-serie .gc-serie__intro { margin: .9rem 0 .8rem; }
.gc-serie__resultado { margin-bottom: 1.1rem; }
.gc-serie__campos { margin-bottom: .5rem; }

/* La barra del vehiculo elegido sustituye al selector */
.gc-ayudas .gc-vehiculo-barra {
	order: 2;
	border-top: 1px solid var(--gc-linea);
	padding: .9rem 1.4rem;
}


@media (max-width: 700px) {
	.gc-ayudas .gc-buscador-catalogo,
	.gc-ayudas .gc-vehiculo { padding: 1.1rem; }
	.gc-ayudas .gc-serie { padding: 0 1.1rem; }
}


/* ==========================================================================
   39. Espacio muerto sobre el titulo de pagina
   Blocksy no controla ese hueco con padding sino con la variable
   --container-padding (50px arriba y abajo por defecto). Tocar el padding
   directamente no sirve de nada: hay que cambiar la variable.
   ========================================================================== */

.hero-section[data-type="type-2"],
[data-prefix] .hero-section[data-type="type-2"] {
	--container-padding: 18px 0 !important;
	--min-height: 0 !important;
	min-height: 0 !important;
}

.hero-section[data-type="type-2"] > [class*="ct-container"] {
	padding-block: 18px !important;
	min-height: 0 !important;
}

.hero-section .page-title {
	margin: 0 !important;
	font-size: clamp(1.5rem, 3.2vw, 2rem);
	line-height: 1.2;
}

/* Solo los margenes verticales: 'margin: 0' tumbaba el auto que centra
   el contenedor y el titulo se iba a la izquierda. */
.hero-section .entry-header { margin-block: 0 !important; }

/* Migas pegadas al titulo */
.hero-section .ct-breadcrumbs {
	margin: 0 0 .35rem !important;
	font-size: .85rem;
}

/* Que el catalogo empiece justo debajo */
.hero-section + * { margin-top: .75rem; }

/* El contenido no necesita tanto aire por arriba */
.post-type-archive-product .site-main,
.tax-product_cat .site-main,
.search-results .site-main { padding-block-start: .75rem !important; }

/* ==========================================================================
   40. Barra de avisos en movil
   Los tres mensajes se parten en tres lineas y se comen media pantalla antes
   de que se vea nada de la tienda. En movil se deja solo el primero, que es
   el que mas pesa en la decision de compra.
   ========================================================================== */

@media (max-width: 782px) {
	.gc-avisos {
		padding: .38rem 0;
		font-size: .74rem;
		line-height: 1.3;
	}

	.gc-avisos .gc-contenedor {
		flex-wrap: nowrap;
		gap: 0;
		white-space: nowrap;
		overflow: hidden;
	}

	/* Solo el primer aviso: los otros dos vuelven en pantallas grandes */
	.gc-avisos .gc-contenedor > span:not(:first-child) { display: none; }
}

/* En pantallas muy estrechas, aun mas contenido */
@media (max-width: 420px) {
	.gc-avisos { font-size: .7rem; padding: .32rem 0; }
}

/* La cabecera tampoco necesita tanto alto en movil */
@media (max-width: 782px) {
	.site-header .ct-container,
	.site-header [data-column="middle"] { padding-block: .5rem; }
	.site-logo-container img,
	.site-logo-container .default-logo { max-height: 34px; }
}

/* ==========================================================================
   41. Portada Fairway: banda de disponibles y cifras
   Nuevas piezas del rediseno: la seccion de productos destacados va dentro
   de una gran tarjeta gris (seccion-tarjeta, como la banda verde) y debajo
   una fila de cifras con tarjetas alternadas al estilo de los contadores
   de Bizum.
   ========================================================================== */

.gc-disponibles {
	background: var(--gc-fondo);
	border-radius: var(--gc-radio-lg);
	padding: clamp(2rem, 4.5vw, 3.25rem);
}

/* Dentro de la banda gris, las tarjetas de producto son blancas */
.gc-disponibles ul.products li.product { background: #fff; }
.gc-disponibles ul.products li.product:hover { background: var(--gc-verde-claro); }
.gc-disponibles .gc-sku { background: var(--gc-fondo); }

/* Cifras de confianza */
.gc-cifras {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(215px, 1fr));
	gap: 1rem;
}

.gc-cifra {
	background: var(--gc-fondo);
	border-radius: var(--gc-radio);
	padding: 1.75rem 1.6rem;
}

.gc-cifra:nth-child(even) { background: var(--gc-fondo-2); }

.gc-cifra strong {
	display: block;
	font-size: 2.5rem;
	font-weight: 700;
	color: var(--gc-verde);
	letter-spacing: -0.02em;
	line-height: 1.1;
	font-variant-numeric: tabular-nums;
}

.gc-cifra span { font-size: .92rem; color: var(--gc-suave); }

@media (max-width: 600px) {
	.gc-disponibles { padding: 1.4rem 1.1rem; border-radius: var(--gc-radio); }
	.gc-cifra { padding: 1.35rem 1.25rem; }
	.gc-cifra strong { font-size: 2rem; }
}


/* ==========================================================================
   42. Carrito vacio: una sola salida
   WooCommerce anade su propio boton "Volver a la tienda" debajo del bloque
   del tema. Con el aviso duplicado ya retirado en functions.php, este boton
   era lo ultimo que sobraba: el bloque de arriba ya ofrece buscador, catalogo
   y presupuesto.
   ========================================================================== */

.woocommerce-cart .return-to-shop { display: none; }

/* Sin la tabla del carrito al lado, el bloque se queda descolgado a la
   izquierda con medio ancho vacio. Centrado respira mejor. */
.woocommerce-cart .gc-carrito-vacio {
	margin-inline: auto;
	width: 100%;
}

/* ==========================================================================
   43. Botones de la tarjeta de producto
   Tras pulsar "Añadir al carrito", el JavaScript de WooCommerce inyecta un
   enlace "Ver carrito". Como aparece despues de cargar la pagina, se escapaba
   a los estilos: salia con otro ancho y del mismo verde que el boton
   principal, y quedaban dos botones solidos compitiendo en la misma tarjeta.
   Aqui se alinean los tres: mismo ancho, mismas esquinas y una jerarquia
   clara (comprar manda; ver carrito y presupuesto son secundarios).
   ========================================================================== */

.woocommerce ul.products li.product a.button,
.woocommerce ul.products li.product button.button,
.woocommerce ul.products li.product .added_to_cart,
ul.products li.product a.button,
ul.products li.product .added_to_cart {
	border-radius: var(--gc-pildora) !important;
	width: 100%;
	text-align: center;
}

/* "Ver carrito": confirma que la pieza ya esta dentro, asi que no necesita
   pesar como el boton de comprar. */
.woocommerce ul.products li.product .added_to_cart,
ul.products li.product .added_to_cart {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .4em;
	margin-top: .45rem;
	padding: .62em 1.2em;
	background: var(--gc-verde-claro) !important;
	color: var(--gc-verde-oscuro) !important;
	font-weight: 600;
	font-size: .9rem;
	line-height: 1.2;
	text-decoration: none;
	border: 0;
	transition: background .2s ease;
}

.woocommerce ul.products li.product .added_to_cart:hover,
ul.products li.product .added_to_cart:hover {
	background: var(--gc-verde-borde) !important;
}

/* En la ficha de producto el enlace va junto al boton, no debajo */
.single-product .added_to_cart {
	border-radius: var(--gc-pildora) !important;
	margin-left: .6rem;
	font-weight: 600;
	color: var(--gc-verde-oscuro);
}

/* ==========================================================================
   44. Contacto del pie
   Antes eran tres enlaces de texto en fila, con un icono de bocadillo en el
   correo y nada en los demas. Ahora cada via lleva su icono en una pastilla
   y WhatsApp sube a boton: es por donde entra la mayoria de las consultas.
   ========================================================================== */

.gc-pie__contacto {
	display: grid;
	gap: .55rem;
	margin: 0 0 1.15rem;
}

.gc-pie__contacto a {
	display: inline-flex;
	align-items: center;
	gap: .65rem;
	font-weight: 600;
	font-size: .95rem;
	color: var(--gc-texto);
	text-decoration: none;
	transition: color .18s ease;
	word-break: break-word;
}

.gc-pie__icono {
	flex: 0 0 auto;
	width: 34px;
	height: 34px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: var(--gc-fondo);
	color: var(--gc-verde);
	transition: background .18s ease, color .18s ease;
}

.gc-pie__contacto a:hover { color: var(--gc-verde-oscuro); }

.gc-pie__contacto a:hover .gc-pie__icono {
	background: var(--gc-verde);
	color: #fff;
}

/* --- Boton de WhatsApp --- */
.gc-whatsapp {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .55em;
	background: var(--gc-verde);
	color: #fff !important;
	border: 2px solid transparent;
	border-radius: var(--gc-pildora);
	padding: .68em 1.4em;
	font-weight: 600;
	font-size: .95rem;
	line-height: 1.2;
	text-decoration: none;
	transition: background .25s ease;
}

.gc-whatsapp:hover { background: var(--gc-verde-oscuro); color: #fff !important; }
.gc-whatsapp svg { flex: 0 0 auto; }

@media (max-width: 520px) {
	.gc-whatsapp { width: 100%; }
	.gc-pie__contacto a { font-size: .92rem; }
}

/* ==========================================================================
   45. Cabecera de categoría
   Blocksy coloca la foto de la categoría como fondo a sangre y escribe el
   título y la descripción encima, sin velo: sobre una foto de tambores de
   freno el texto era ilegible. Se reconvierte en una tarjeta como las del
   resto del sitio: el texto a la izquierda sobre fondo claro y la foto a la
   derecha, recortada y redondeada.
   ========================================================================== */

.hero-section[data-type="type-2"] {
	background: var(--gc-fondo);
	border-radius: var(--gc-radio-lg);
	width: min(var(--gc-ancho), calc(100% - 3rem));
	margin: 1.25rem auto 1.75rem !important;
	padding: clamp(1.5rem, 4vw, 2.5rem) !important;
	overflow: hidden;
}

/* Solo hay dos columnas cuando la categoría tiene foto */
.hero-section[data-type="type-2"]:has(> figure) {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 290px);
	gap: clamp(1.5rem, 4vw, 2.75rem);
	align-items: center;
}

/* La foto deja de ser fondo absoluto y pasa a ser una columna mas */
.hero-section[data-type="type-2"] > figure {
	position: static !important;
	inset: auto !important;
	width: auto !important;
	height: auto !important;
	margin: 0 !important;
	order: 2;
	z-index: auto !important;
}

.hero-section[data-type="type-2"] > figure::before,
.hero-section[data-type="type-2"] > figure::after { content: none !important; }

.hero-section[data-type="type-2"] figure .ct-media-container,
.hero-section[data-type="type-2"] figure img {
	position: static !important;
	width: 100% !important;
	height: auto !important;
	max-width: none;
}

.hero-section[data-type="type-2"] figure img {
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: var(--gc-radio);
	display: block;
}

/* El texto recupera su color y se alinea a la izquierda */
.hero-section[data-type="type-2"] .entry-header {
	order: 1;
	position: static !important;
	max-width: none !important;
	width: auto !important;
	text-align: left !important;
	margin: 0 !important;
	padding: 0 !important;
}

.hero-section[data-type="type-2"] .page-title {
	color: var(--gc-tinta) !important;
	text-shadow: none !important;
	font-size: clamp(1.7rem, 3.6vw, 2.4rem);
	margin: 0 0 .6rem !important;
	text-align: left;
}

.hero-section[data-type="type-2"] .page-description,
.hero-section[data-type="type-2"] .page-description p {
	color: var(--gc-suave) !important;
	text-shadow: none !important;
	text-align: left;
	font-size: .96rem;
	line-height: 1.6;
	max-width: 68ch;
}

.hero-section[data-type="type-2"] .page-description p { margin: 0 0 .7rem; }
.hero-section[data-type="type-2"] .page-description p:last-child { margin-bottom: 0; }
.hero-section[data-type="type-2"] .page-description strong { color: var(--gc-tinta); }

/* Las migas, integradas y discretas */
.hero-section[data-type="type-2"] .ct-breadcrumbs {
	text-align: left;
	color: var(--gc-suave);
}

.hero-section[data-type="type-2"] .ct-breadcrumbs a { color: var(--gc-verde-oscuro); }

@media (max-width: 800px) {
	.hero-section[data-type="type-2"]:has(> figure) { grid-template-columns: 1fr; }
	.hero-section[data-type="type-2"] > figure { order: 0; }
	.hero-section[data-type="type-2"] figure img { aspect-ratio: 16 / 9; }
	.hero-section[data-type="type-2"] { width: calc(100% - 2rem); }
}

/* ==========================================================================
   46. Cierre del pie y caja de aviso del checkout
   ========================================================================== */

/* Blocksy remata con "Tema para WordPress de...", que en una tienda no
   significa nada. Se oculta y en su lugar va la linea de .gc-pie__legal. */
.site-footer [data-column="copyright"],
.site-footer [data-id="copyright"] { display: none !important; }

.gc-pie__legal {
	display: flex;
	flex-wrap: wrap;
	gap: .4rem 1.5rem;
	justify-content: space-between;
	align-items: center;
	margin-top: 2rem;
	padding-top: 1.35rem;
	border-top: 1px solid var(--gc-linea);
	font-size: .84rem;
	color: var(--gc-suave);
}

/* --- Aviso previo a confirmar el pedido --- */
.gc-checkout-aviso {
	background: var(--gc-ambar-bg);
	border: 0;
	border-left: 0;
	border-radius: var(--gc-radio);
	padding: 1.15rem 1.35rem;
	margin-bottom: 1.15rem;
}

.gc-checkout-aviso p { color: var(--gc-ambar-texto); }

.gc-checkout-aviso__contacto {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .5rem .65rem;
	margin: .9rem 0 0 !important;
}

.gc-checkout-aviso__duda { font-size: .88rem; color: var(--gc-ambar-texto); }

/* Los contactos, como pastillas: se ven pulsables, que es de lo que se trata */
.gc-checkout-aviso__contacto a {
	display: inline-flex;
	align-items: center;
	gap: .4em;
	background: #fff;
	color: var(--gc-ambar-texto) !important;
	border: 0 !important;
	border-radius: var(--gc-pildora);
	padding: .42em 1em;
	font-weight: 600;
	font-size: .88rem;
	text-decoration: none !important;
	white-space: nowrap;
	transition: background .18s ease, color .18s ease;
}

.gc-checkout-aviso__contacto a:hover {
	background: var(--gc-verde);
	color: #fff !important;
}

.gc-checkout-aviso__contacto a svg { flex: 0 0 auto; }

@media (max-width: 520px) {
	.gc-pie__legal { justify-content: flex-start; }
	.gc-checkout-aviso__contacto a { flex: 1 1 auto; justify-content: center; }
}

/* ==========================================================================
   47. Checkout: casilla de condiciones y contactos del aviso
   La casilla de aceptar condiciones venia con el tamano por defecto del
   navegador: un cuadro gris de 13 px que ni se ve ni se acierta a pulsar en
   movil, justo en el paso donde el cliente decide. Y en el aviso de al lado,
   "¿Alguna duda?" empujaba las pastillas y el telefono caia solo a la
   siguiente linea, descolocado.
   ========================================================================== */

/* --- La casilla, visible y grande --- */
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper .form-row {
	display: flex;
	align-items: flex-start;
	gap: .7rem;
	background: var(--gc-fondo);
	border-radius: var(--gc-radio-sm);
	padding: .9rem 1.1rem;
	margin: .5rem 0 1.15rem;
}

.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper label {
	display: flex;
	align-items: flex-start;
	gap: .7rem;
	margin: 0;
	cursor: pointer;
	font-size: .93rem;
	line-height: 1.5;
	color: var(--gc-texto);
}

.woocommerce-checkout input#terms,
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper input[type="checkbox"] {
	appearance: none;
	-webkit-appearance: none;
	flex: 0 0 auto;
	width: 22px;
	height: 22px;
	margin: .1rem 0 0;
	border: 2px solid var(--gc-suave);
	border-radius: 6px;
	background: #fff;
	cursor: pointer;
	display: grid;
	place-content: center;
	transition: background .15s ease, border-color .15s ease;
}

.woocommerce-checkout input#terms::before,
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper input[type="checkbox"]::before {
	content: "";
	width: 11px;
	height: 11px;
	transform: scale(0);
	transition: transform .12s ease-in-out;
	box-shadow: inset 1em 1em #fff;
	clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
}

.woocommerce-checkout input#terms:checked,
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper input[type="checkbox"]:checked {
	background: var(--gc-verde);
	border-color: var(--gc-verde);
}

.woocommerce-checkout input#terms:checked::before,
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper input[type="checkbox"]:checked::before {
	transform: scale(1);
}

.woocommerce-checkout input#terms:focus-visible {
	outline: 3px solid var(--gc-verde-vivo);
	outline-offset: 2px;
}

/* Si falta por marcar, se ve que falta */
.woocommerce-checkout .validate-required.woocommerce-invalid input#terms {
	border-color: var(--gc-ambar);
	background: var(--gc-ambar-bg);
}

/* --- El aviso: la pregunta arriba y las dos pastillas juntas debajo --- */
.gc-checkout-aviso__duda {
	flex: 0 0 100%;
	margin-bottom: .15rem;
	font-weight: 600;
}

.gc-checkout-aviso__contacto a {
	min-height: 38px;
	justify-content: center;
}

/* ==========================================================================
   48. Reseñas de clientes
   Prueba social real: 5,0 con opiniones verificadas en Google. Se pinta
   como una banda-tarjeta mas, igual que "Comprar es sencillo", para que no
   parezca un widget pegado de fuera.
   ========================================================================== */

.gc-resenas {
	background: var(--gc-verde-claro);
	border-radius: var(--gc-radio-lg);
	padding: clamp(1.75rem, 4.5vw, 3rem);
}

.gc-resenas__cabecera {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem 2.5rem;
	margin-bottom: 2rem;
}

.gc-resenas__cabecera h2 {
	flex: 1 1 320px;
	font-size: clamp(1.5rem, 3.2vw, 2.1rem);
	margin: 0;
	order: 2;
}

.gc-resenas__nota {
	display: flex;
	align-items: baseline;
	gap: .6rem;
}

.gc-resenas__nota strong {
	font-size: clamp(2.4rem, 6vw, 3.4rem);
	font-weight: 700;
	color: var(--gc-verde);
	line-height: 1;
	letter-spacing: -0.03em;
	font-variant-numeric: tabular-nums;
}

.gc-resenas__estrellas {
	color: var(--gc-verde);
	font-size: 1.1rem;
	letter-spacing: .12em;
}

.gc-resenas__fuente {
	margin: .35rem 0 0;
	font-size: .88rem;
	color: var(--gc-suave);
}

.gc-resenas__lista {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 1rem;
}

.gc-resena {
	display: flex;
	flex-direction: column;
	gap: .75rem;
	background: #fff;
	border-radius: var(--gc-radio);
	padding: 1.5rem 1.6rem;
	margin: 0;
}

.gc-resena__estrellas {
	color: var(--gc-verde);
	font-size: .95rem;
	letter-spacing: .1em;
}

.gc-resena blockquote {
	margin: 0;
	font-size: .96rem;
	line-height: 1.6;
	color: var(--gc-texto);
	/* Las comillas las pone el navegador segun el idioma de la pagina */
	quotes: '«' '»';
}

.gc-resena blockquote::before { content: open-quote; }
.gc-resena blockquote::after  { content: close-quote; }

.gc-resena figcaption {
	margin-top: auto;
	padding-top: .3rem;
	display: flex;
	flex-direction: column;
	gap: .1rem;
}

.gc-resena figcaption strong { font-size: .93rem; color: var(--gc-tinta); font-weight: 600; }
.gc-resena figcaption span   { font-size: .82rem; color: var(--gc-suave); }

@media (max-width: 700px) {
	.gc-resenas__cabecera { gap: .5rem; }
	.gc-resenas__cabecera h2 { flex-basis: 100%; }
}

/* Horario en el pie, con el mismo tratamiento que correo y telefono */
.gc-pie__horario {
	display: inline-flex;
	align-items: center;
	gap: .65rem;
	margin: 0 0 1.15rem;
	font-size: .93rem;
	color: var(--gc-texto);
	font-weight: 600;
}

/* Enlace a la ficha de Google bajo las reseñas */
.gc-resenas__pie {
	margin: 1.4rem 0 0;
	text-align: center;
}

.gc-resenas__pie a {
	display: inline-flex;
	align-items: center;
	gap: .4em;
	color: var(--gc-verde-oscuro);
	font-weight: 600;
	font-size: .93rem;
	text-decoration: none;
	border-bottom: 2px solid var(--gc-verde-borde);
	padding-bottom: .15rem;
	transition: border-color .18s ease;
}

.gc-resenas__pie a:hover { border-color: var(--gc-verde); }
