/* ====================================================
   TEMA: MODERNO
   Geométrico, contrastes fuertes, tipografía en mayúsculas
   ==================================================== */

/* --- Tipografía --- */
h1, h2, h3 {
	font-weight: 900 !important;
	text-transform: uppercase;
	letter-spacing: -0.01em;
	font-style: normal;
}

h2 {
	font-size: 3.2rem !important;
	border-left: 6px solid var(--color1);
	padding-left: 16px;
}

.accordion h2,
h2.sinborde {
	border-left: none;
	padding-left: 0;
}

h1 { font-size: 3.6rem !important; }

/* --- Botones --- */
.btn { border-radius: 0 !important; }
.btn-primary, .btn.fondo1 {
	border-radius: 0 !important;
	text-transform: uppercase;
	letter-spacing: 0.15em;
	font-weight: 800;
	font-size: 0.82em;
	border: 2px solid var(--color1) !important;
	box-shadow: 4px 4px 0 var(--color1) !important;
	transition: box-shadow 0.12s ease, transform 0.12s ease !important;
	filter: none !important;
}

.btn-primary:hover, .btn.fondo1:hover,
.btn-primary:focus, .btn.fondo1:focus,
.btn-primary:active, .btn.fondo1:active {
	box-shadow: 1px 1px 0 var(--color1) !important;
	transform: translate(3px, 3px);
	filter: none !important;
}

.btn-outline-primary,
.btn-outline-secondary {
	border-radius: 0 !important;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	font-size: 0.82em;
	border: 2px solid var(--color1) !important;
	transition: all 0.12s ease;
}

/* --- Tarjetas de producto --- */
.pro-ficha-mini {
	background: #fff !important;
	padding: 0 !important;
	border: 2px solid transparent !important;
	transition: border-color 0.18s ease !important;
}

.pro-ficha-mini:hover {
	border-color: var(--color1) !important;
}

.pro-ficha-mini .img-container {
	border-radius: 0 !important;
}

.pro-ficha-mini .info {
	padding: 10px 12px 14px !important;
	background: #fff;
	text-align: left !important;
}

.pro-ficha-mini .info .nombre {
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	font-size: 0.9em;
}

/* --- Navbar --- */
#navbarNav .navbar-nav a {
	text-transform: uppercase !important;
	letter-spacing: 0.12em !important;
	font-weight: 700 !important;
	font-size: 0.82em !important;
}

/* --- Footer --- */
.footer {
	background: #111 !important;
	border-top: 4px solid var(--color1) !important;
	color: #ccc;
}
.footer a:not(.color1) {
	color: #888 !important;
}
.footer a:hover {
	color: var(--color1) !important;
}
.footer .fs-4 {
	color: #fff !important;
	font-weight: 900 !important;
	letter-spacing: 0.06em;
}
.footer .col-border {
	border-color: #2a2a2a !important;
}

.footer2 {
	background: #0a0a0a !important;
	border-top: 1px solid #222 !important;
	color: #777;
}
.footer2 a,
.footer2 .text-dark {
	color: #777 !important;
}
.footer2 a:hover {
	color: var(--color1) !important;
}

/* --- Bloques / banners --- */
.bl .titulo {
	font-weight: 900 !important;
	text-transform: uppercase;
	letter-spacing: 0.02em;
}

/* --- Secciones h2 --- */
.secini h2 {
	border-left: none;
	padding-left: 0;
	padding-bottom: 0;
}

.input-group > .form-control,
.input-group > .input-group-text { border-radius: 0 !important; }
.input-group > .btn-primary,
.input-group > .btn.fondo1 { border-radius: 0 !important; }

/* --- Cat-top: imagen de fondo oscurecida, texto blanco con acento --- */
@media (min-width: 992px) {
	.cat-top {
		position: relative;
		overflow: hidden;
		min-height: 280px;
	}
	.cat-top .row > .order-1 {
		position: absolute !important;
		top: 0; left: 0; right: 0; bottom: 0;
		width: 100% !important;
		max-width: 100% !important;
		padding: 0 !important;
		z-index: 0;
	}
	.cat-top img {
		width: 100% !important;
		height: 100% !important;
		object-fit: cover !important;
		border-radius: 0 !important;
		filter: brightness(0.3) saturate(0.8);
	}
	.cat-top .row > .order-2 {
		flex: 0 0 100% !important;
		max-width: 100% !important;
		position: relative;
		z-index: 1;
		padding: 50px 40px !important;
	}
	.cat-top .fondo2-transparent {
		background: transparent !important;
		text-align: left !important;
		align-items: flex-start !important;
	}
	.cat-top .text-center {
		text-align: left !important;
	}
	.cat-top h1 {
		color: #fff !important;
		text-align: left !important;
		font-size: 3.4rem !important;
		border-left: 6px solid var(--color1) !important;
		padding-left: 18px !important;
	}
	.cat-top .fw-bold,
	.cat-top .fondo2-transparent div {
		color: rgba(255,255,255,0.8) !important;
	}
	.cat-top .row > .order-2:only-child {
		background: #111;
		min-height: 200px;
	}
	.cat-top .row > .order-2:only-child h1 {
		color: #fff !important;
	}
}

/* --- Menú categorías (navbarNav2): borde izquierdo geométrico --- */
#navbarNav2 .navbar-nav a {
	text-transform: uppercase;
	letter-spacing: 0.1em;
	font-size: 0.8em !important;
	font-weight: 700;
	margin: 0 4px;
	transition: background 0.12s ease;
}
#navbarNav2 .navbar-nav a.active {
	border-bottom: none !important;
	border-left: 4px solid currentColor !important;
	padding-left: calc(0.8rem - 4px) !important;
	background: rgba(255, 255, 255, 0.1) !important;
	font-weight: 900 !important;
}
#navbarNav2 .navbar-nav a:hover {
	background: rgba(255, 255, 255, 0.06) !important;
}