/*!
Theme Name: caquetioshop_theme
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: caquetioshop_theme
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

caquetioshop_theme is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

/* Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
}

/* Minimal Header CaquetioShop */
.main-header-bar {
	background-color: var(--darker-bg);
	border-bottom: 2px solid var(--primary-green);
	box-shadow: 0 25px 20px 1px var(--neon-green);
	padding: 10px 0;
	position: relative;
	z-index: 1000;
}

.main-header-bar .container {
	display: flex;
	justify-content: space-between;
	gap: 10px;
}

.main-header-bar .container > div {
	display: flex;
	flex-flow: row;
	align-items: center;
}

/* Sections
	 ========================================================================== */

/**
 * Remove the margin in all browsers.
 */
body {
	margin: 0;
}

.header-logo {
	flex: 1;
}

.header-logo img,
.header-logo svg {
	max-height: 60px;
	height: 60px !important;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
	display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
	font-size: 2em;
	margin: 0.67em 0;
}

.header-search {
	flex: 1;
}

.header-search form {
	display: flex;
	align-items: center;
	border: none;
	width: 100%;
}

.header-search form input {
	height: 40px;
	color: #fff !important;
	border: 2px solid #ccc;
	padding: 0 10px;
}

.search-field {
	flex: 1;
	padding: 8px;
	border: 1px solid #ccc;
	border-radius: 4px;
	font-size: 1rem;
	color: #333;
	background-color: #fff;
}

.search-button {
	margin-left: 10px;
	padding: 8px 16px;
	border: none;
	border-radius: 4px;
	background-color: var(--primary-green);
	color: #fff;
	font-size: 1rem;
	cursor: pointer;
	transition: background-color 0.3s ease;
}

.search-button:hover {
	background-color: var(--neon-green);
	color: #000;
}

.shop-icon-btn {
	background-color: var(--primary-green);
	color: #fff;
	padding: 8px 12px;
	min-width: 56px;
	height: 40px;
	border: none;
	border-radius: 4px;
	font-size: 1.2rem;
	cursor: pointer;
	transition: background-color 0.3s ease;
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
}

.shop-icon-btn span {
	margin-left: 8px;
	font-size: 1rem;
}

.shop-icon-btn:hover {
	background-color: var(--neon-green);
	color: #000;
}

/* Grouping content
	 ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
	box-sizing: content-box;
	height: 0;
	overflow: visible;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
	font-family: monospace, monospace;
	font-size: 1em;
}

/* Text-level semantics
	 ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */
a {
	background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	text-decoration: underline dotted;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
	font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}

/**
 * Add the correct font size in all browsers.
 */
small {
	font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sub {
	bottom: -0.25em;
}

sup {
	top: -0.5em;
}

/* Embedded content
	 ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */
img {
	border-style: none;
}

/* Forms
	 ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 100%;
	line-height: 1.15;
	margin: 0;
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
	overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
	text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
	-webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
	border-style: none;
	padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
	padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *		`fieldset` elements in all browsers.
 */
legend {
	box-sizing: border-box;
	color: inherit;
	display: table;
	max-width: 100%;
	padding: 0;
	white-space: normal;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
	vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
	overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"],
[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
	-webkit-appearance: textfield;
	outline-offset: -2px;
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit;
}

/* Interactive
	 ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
	display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
	display: list-item;
}

/* Misc
	 ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */
template {
	display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
	display: none;
}

/* Box sizing
--------------------------------------------- */

/* Inherit box-sizing to more easily change it's value on a component level.
@link http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
*,
*::before,
*::after {
	box-sizing: inherit;
}

html {
	box-sizing: border-box;
}

/*--------------------------------------------------------------
# Base
--------------------------------------------------------------*/

/* Typography
--------------------------------------------- */
body,
button,
input,
select,
optgroup,
textarea {
	color: #404040;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	font-size: 1rem;
	line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
}

p {
	margin-bottom: 1.5em;
}

dfn,
cite,
em,
i {
	font-style: italic;
}

blockquote {
	margin: 0 1.5em;
}

address {
	margin: 0 0 1.5em;
}

pre {
	background: #eee;
	font-family: "Courier 10 Pitch", courier, monospace;
	line-height: 1.6;
	margin-bottom: 1.6em;
	max-width: 100%;
	overflow: auto;
	padding: 1.6em;
}

code,
kbd,
tt,
var {
	font-family: monaco, consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}

abbr,
acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}

mark,
ins {
	background: #fff9c0;
	text-decoration: none;
}

big {
	font-size: 125%;
}

/* Elements
--------------------------------------------- */
body {
	background: #fff;
}

hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin-bottom: 1.5em;
}

ul,
ol {
	margin: 0 0 1.5em 3em;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

li > ul,
li > ol {
	margin-bottom: 0;
	margin-left: 1.5em;
}

dt {
	font-weight: 700;
}

dd {
	margin: 0 1.5em 1.5em;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}

img {
	height: auto;
	max-width: 100%;
}

figure {
	margin: 1em 0;
}

table {
	margin: 0 0 1.5em;
	width: 100%;
}

/* Links
--------------------------------------------- */

/*

a {
	color: #4169e1;
}

a:visited {
	color: #800080;
}

a:hover,
a:focus,
a:active {
	color: #191970;
}

a:focus {
	outline: thin dotted;
}

a:hover,
a:active {
	outline: 0;
}

*/

/* Forms
--------------------------------------------- */
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	border: 1px solid;
	border-color: #ccc #ccc #bbb;
	border-radius: 3px;
	background: #e6e6e6;
	color: rgba(0, 0, 0, 0.8);
	line-height: 1;
	padding: 0.6em 1em 0.4em;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	border-color: #ccc #bbb #aaa;
}

button:active,
button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus {
	border-color: #aaa #bbb #bbb;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: #666;
	border: 1px solid #ccc;
	border-radius: 3px;
	padding: 3px;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	color: #111;
}

select {
	border: 1px solid #ccc;
}

textarea {
	width: 100%;
}

/*--------------------------------------------------------------
# Layouts
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Components
--------------------------------------------------------------*/

/* Navigation
--------------------------------------------- */
.main-navigation {
	display: block;
	width: 100%;
}

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

.main-navigation ul ul {
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
	float: left;
	position: absolute;
	top: 100%;
	left: -999em;
	z-index: 99999;
}

.main-navigation ul ul ul {
	left: -999em;
	top: 0;
}

.main-navigation ul ul li:hover > ul,
.main-navigation ul ul li.focus > ul {
	display: block;
	left: auto;
}

.main-navigation ul ul a {
	width: 200px;
}

.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul {
	left: auto;
}

.main-navigation li {
	position: relative;
}

.main-navigation a {
	display: block;
	text-decoration: none;
}

/* Small menu. */
.menu-toggle,
.main-navigation.toggled ul {
	display: block;
}

@media screen and (min-width: 37.5em) {

	.menu-toggle {
		display: none;
	}

	.main-navigation ul {
		display: flex;
	}
}

.site-main .comment-navigation,
.site-main
.posts-navigation,
.site-main
.post-navigation {
	margin: 0 0 1.5em;
}

.comment-navigation .nav-links,
.posts-navigation .nav-links,
.post-navigation .nav-links {
	display: flex;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	flex: 1 0 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
	text-align: end;
	flex: 1 0 50%;
}

/* Posts and pages
--------------------------------------------- */
.sticky {
	display: block;
}

.post,
.page {
	margin: 0 0 1.5em;
}

.updated:not(.published) {
	display: none;
}

.page-content,
.entry-content,
.entry-summary {
	margin: 1.5em 0 0;
}

.page-links {
	clear: both;
	margin: 0 0 1.5em;
}

/* Comments
--------------------------------------------- */
.comment-content a {
	word-wrap: break-word;
}

.bypostauthor {
	display: block;
}

/* Widgets
--------------------------------------------- */
.widget {
	margin: 0 0 1.5em;
}

.widget select {
	max-width: 100%;
}

/* Media
--------------------------------------------- */
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
	display: inline-block;
}

/* Captions
--------------------------------------------- */
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

.wp-caption-text {
	text-align: center;
}

/* Galleries
--------------------------------------------- */
.gallery {
	margin-bottom: 1.5em;
	display: grid;
	grid-gap: 1.5em;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	width: 100%;
}

.gallery-columns-2 {
	grid-template-columns: repeat(2, 1fr);
}

.gallery-columns-3 {
	grid-template-columns: repeat(3, 1fr);
}

.gallery-columns-4 {
	grid-template-columns: repeat(4, 1fr);
}

.gallery-columns-5 {
	grid-template-columns: repeat(5, 1fr);
}

.gallery-columns-6 {
	grid-template-columns: repeat(6, 1fr);
}

.gallery-columns-7 {
	grid-template-columns: repeat(7, 1fr);
}

.gallery-columns-8 {
	grid-template-columns: repeat(8, 1fr);
}

.gallery-columns-9 {
	grid-template-columns: repeat(9, 1fr);
}

.gallery-caption {
	display: block;
}

/*--------------------------------------------------------------
# Plugins
--------------------------------------------------------------*/

/* Jetpack infinite scroll
--------------------------------------------- */

/* Hide the Posts Navigation and the Footer when Infinite Scroll is in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
	display: none;
}

/* Re-display the Theme Footer when Infinite Scroll has reached its end. */
.infinity-end.neverending .site-footer {
	display: block;
}

/*--------------------------------------------------------------
# Utilities
--------------------------------------------------------------*/

/* Accessibility
--------------------------------------------- */

/* Text meant only for screen readers. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 0.875rem;
	font-weight: 700;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

/* Do not show the outline on the skip link target. */
#primary[tabindex="-1"]:focus {
	outline: 0;
}

/* Alignments
--------------------------------------------- */
.alignleft {

	/*rtl:ignore*/
	float: left;

	/*rtl:ignore*/
	margin-right: 1.5em;
	margin-bottom: 1.5em;
}

.alignright {

	/*rtl:ignore*/
	float: right;

	/*rtl:ignore*/
	margin-left: 1.5em;
	margin-bottom: 1.5em;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1.5em;
}

/*--------------------------------------------------------------
# CaquetiosShop Custom Styles
--------------------------------------------------------------*/

/* CSS Variables */
:root {
	--primary-green: #2e791b;
	--neon-green: #39ff14;
	--dark-bg: #1a1a1a;
	--darker-bg: #0d0d0d;
	--light-gray: #cccccc;
	--white: #ffffff;
	--shadow-glow: 0 0 20px rgba(57, 255, 20, 0.3);
	--text-glow: 0 0 10px rgba(57, 255, 20, 0.5);
}

/* Global Styles */
body {
	background-color: var(--darker-bg);
	color: var(--white);
	font-family: 'Open Sans', sans-serif;
}

.container {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 20px;
}

.section-padding {
	padding: 60px 0;
}

.site-main section {
	position: relative;
}

.site-main section > .container {
	position: relative;
	z-index: 2;
}

.section-bg-bottom {
	width: 100%;
    -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0));
    mask-image: linear-gradient(to bottom, #000 85%, #0000);
    height: 400px;
    background-size: 400px 400px;
    background-repeat: repeat-x;
    position: absolute;
    bottom: -50px;
    z-index: 1;
}

.section-bg-paper {
    background-size: 100vw 100%;
    width: 100%;
    height: calc(100% + 320px);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    mask-image: linear-gradient(to bottom, #0000 5%, #000);
}

.section-bg-crosses {
    width: 500px;
    height: 100%;
    background-repeat: repeat-x;
    position: absolute;
    top: -60px;
    right: 0;
    z-index: 1;
}

.section-bg-lightning {
    width: 400px;
    height: 100%;
	display: flex;
    background-repeat: repeat-x;
    position: absolute;
    z-index: 1;
	animation: lightning 3s infinite alternate;
}

@keyframes lightning {
  0% {
    opacity: 0.8;
    transform: scale(1); /* Sin cambios de tamaño dramáticos */
  }
  15% {
    opacity: 0.3; /* Un poco visible */
    transform: scale(1.02); /* Ligerísimo aumento */
    box-shadow: 0 0 8px 2px rgba(255, 255, 0, 0.4); /* Brillo muy leve */
  }
  30% {
    opacity: 1;
    transform: scale(1);
    box-shadow: none;
  }
  100% {
    opacity: 0;
    transform: scale(1);
  }
}

.section-bg-lightning img {
	width: 100%;
	height: auto;
}

.section-title {
	font-size: 2.5rem;
	font-weight: bold;
	text-align: center;
	margin-bottom: 3rem;
	color: var(--white);
	text-transform: uppercase;
	letter-spacing: 2px;
}

.glow-effect {
	text-shadow: var(--text-glow);
	transition: all 0.3s ease;
}

.glow-effect:hover {
	text-shadow: 0 0 20px var(--neon-green);
}

.industrial-bg {
	background: linear-gradient(135deg, var(--dark-bg), var(--darker-bg));
	position: relative;
	border: 1px solid rgba(46, 121, 27, 0.3);
}

.industrial-bg::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: 
		radial-gradient(circle at 20% 50%, rgba(46, 121, 27, 0.1) 0%, transparent 50%),
		radial-gradient(circle at 80% 20%, rgba(57, 255, 20, 0.05) 0%, transparent 50%);
	pointer-events: none;
}

/* Hero Section */
.hero-section {
	position: relative;
	height: 80vh;
	min-height: 600px;
	overflow: hidden;
	background: var(--darker-bg);
}

.hero-carousel {
	position: relative;
	height: 100%;
}

.hero-slide {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	opacity: 0;
	transition: opacity 0.6s ease-in-out;
	display: flex;
	align-items: center;
}

.hero-slide.active {
	opacity: 1;
}

.hero-default {
	background: linear-gradient(135deg, var(--dark-bg), var(--primary-green));
}

.hero-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: linear-gradient(to bottom, #00000033 80%, #1a1a1aff);
	display: flex;
	align-items: center;
	justify-content: center;
}

.hero-content {
	text-align: center;
	color: var(--white);
	max-width: 800px;
	padding: 0 20px;
}

.hero-title {
	font-size: 4.5rem;
	font-weight: 900;
	margin-bottom: 1rem;
	text-transform: uppercase;
	letter-spacing: 3px;
	font-family: 'Bebas Neue', 'Oswald', sans-serif;
	line-height: 1.1;
}

.hero-subtitle {
	font-size: 1.3rem;
	margin-bottom: 2rem;
	opacity: 0.9;
	font-weight: 300;
}

.hero-cta {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 18px 35px;
	background: var(--primary-green);
	color: var(--white);
	text-decoration: none;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 1px;
	border: 2px solid var(--neon-green) !important;
	border-radius: 8px;
	transition: all 0.3s ease;
	font-size: 1.1rem;
}

.hero-cta:hover {
	/*background: transparent;
	color: var(--neon-green);*/
	box-shadow: 0 0 20px var(--neon-green);
	transform: translateY(-2px);
}

/* Hero Carousel Custom Layout */
.hero-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 60px;
	min-height: 500px;
	padding: 0 20px;
}

.hero-col {
	flex: 1;
	min-width: 0;
}

.hero-text-col {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	padding-left: 40px;
	z-index: 2;
}

.hero-title {
	font-size: 4rem;
	font-family: 'Bebas Neue', 'Oswald', sans-serif;
	font-weight: 900;
	margin-bottom: 1.5rem;
	line-height: 0.9;
	text-transform: uppercase;
	letter-spacing: 2px;
}

.hero-highlight {
	color: var(--neon-green);
	text-shadow: 0 0 15px var(--neon-green);
	display: block;
	font-size: 1.2em;
}

.hero-rest {
	color: var(--white);
	display: block;
}

.hero-img-col {
	/* TODO: CSS Fix display: flex;
	justify-content: center;
	align-items: center;
	position: relative;*/
}

.hero-product-showcase {
	position: relative;
	max-width: 450px;
	width: 100%;
	-webkit-mask-image: url('assets/images/mask-torn.png');
	mask-image: url('assets/images/mask-torn.png');
	mask-repeat: no-repeat;
	mask-size: 100%;
	mask-position: 50% 50%;
}

.hero-img {
	width: 100%;
	max-width: 400px;
	height: auto;
	border-radius: 20px;
	/* TODO: CSS FIX box-shadow: 0 0 40px rgba(46, 121, 27, 0.6);
	background: var(--darker-bg); */
	padding: 20px;
	transition: transform 0.3s ease;
}

.hero-img:hover {
	transform: scale(1.05);
}

.product-quick-info {
	position: absolute;
	bottom: -20px;
	left: 50%;
	transform: translateX(-50%);
	background: rgba(26, 26, 26, 0.95);
	padding: 15px 25px;
	border-radius: 10px;
	border: 2px solid var(--primary-green);
	text-align: center;
	min-width: 200px;
}

.product-quick-info .product-price {
	color: var(--neon-green);
	font-size: 1.5rem;
	font-weight: bold;
	margin-bottom: 10px;
}

.btn-secondary {
	display: inline-block;
	padding: 8px 20px;
	background: transparent;
	color: var(--white);
	text-decoration: none;
	border: 1px solid var(--primary-green);
	border-radius: 5px;
	font-size: 0.9rem;
	transition: all 0.3s ease;
}

.btn-secondary:hover {
	background: var(--primary-green);
	color: var(--white);
}

.hero-default-graphic {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 300px;
}

/* Responsive Design */
@media (max-width: 1024px) {
	.hero-row {
		gap: 40px;
		padding: 0 15px;
	}
	
	.hero-title {
		font-size: 3.2rem;
	}
	
	.hero-img {
		max-width: 350px;
	}
}

@media (max-width: 768px) {
	.hero-section {
		height: auto;
		min-height: 100vh;
	}
	
	.hero-row {
		flex-direction: column-reverse;
		gap: 30px;
		min-height: 0;
		padding: 40px 15px;
	}
	
	.hero-text-col {
		padding-left: 0;
		align-items: center;
		text-align: center;
	}
	
	.hero-title {
		font-size: 2.5rem;
		text-align: center;
	}
	
	.hero-img {
		max-width: 90vw;
	}
	
	.hero-subtitle {
		font-size: 1.1rem;
	}
	
	.product-quick-info {
		position: static;
		transform: none;
		margin-top: 20px;
	}
}

@media (max-width: 480px) {
	.hero-title {
		font-size: 2rem;
	}
	
	.hero-cta {
		padding: 15px 25px;
		font-size: 1rem;
	}
}

/* Hero Carousel Custom Layout */
.hero-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 40px;
	min-height: 400px;
}
.hero-col {
	flex: 1;
	min-width: 0;
}
.hero-text-col {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	padding-right: 30px;
}
.hero-title {
	font-size: 3.5rem;
	font-family: 'Bebas Neue', 'Oswald', sans-serif;
	font-weight: 900;
	margin-bottom: 1rem;
	line-height: 1.1;
	text-transform: uppercase;
	letter-spacing: 2px;
}
.hero-highlight {
	color: var(--neon-green);
	text-shadow: 0 0 10px var(--neon-green);
}
.hero-rest {
	color: var(--white);
}
.hero-img-col {
	/* TODO: CSS Fix display: flex;
	justify-content: flex-end;
	align-items: center;*/
}

.hero-mask-img {
	-webkit-mask-image: url('assets/images/mask-torn.png');
	mask-image: url('assets/images/mask-torn.png');
	mask-size: 100% 400px;
	mask-position: 50% 50%;
	mask-repeat: no-repeat;
}

.hero-mask-img img {
	height: 400px;
}

.hero-img {
	max-width: 400px;
	width: 100%;
	border-radius: 20px;
	/* TODO: CSS FIX box-shadow: 0 0 30px var(--primary-green);
	background: var(--darker-bg); */
}
@media (max-width: 900px) {
	.hero-row {
		flex-direction: column-reverse;
		gap: 20px;
		min-height: 0;
	}
	.hero-text-col {
		padding-right: 0;
		align-items: center;
	}
	.hero-title {
		font-size: 2.2rem;
		text-align: center;
	}
	.hero-img {
		max-width: 90vw;
	}
}

/* Carousel Navigation */
.carousel-nav {
	position: absolute;
	top: 50%;
	width: 100%;
	transform: translateY(-50%);
	display: flex;
	justify-content: space-between;
	padding: 0 30px;
	pointer-events: none;
	z-index: 10;
}

.carousel-prev,
.carousel-next {
	background: rgba(46, 121, 27, 0.9);
	color: var(--white);
	border: none;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	font-size: 1.2rem;
	cursor: pointer;
	transition: all 0.3s ease;
	pointer-events: all;
	display: flex;
	align-items: center;
	justify-content: center;
	backdrop-filter: blur(10px);
	border: 2px solid rgba(255, 255, 255, 0.1);
}

.carousel-prev:hover,
.carousel-next:hover {
	background: var(--primary-green);
	box-shadow: 0 0 25px var(--neon-green);
	transform: scale(1.1);
	border-color: var(--neon-green);
}

.carousel-prev:active,
.carousel-next:active {
	transform: scale(0.95);
}

.carousel-indicators {
	position: absolute;
	bottom: 30px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	gap: 12px;
	z-index: 10;
}

.indicator {
	width: 15px;
	height: 15px;
	border: 2px solid rgba(255, 255, 255, 0.6);
	background: transparent;
	cursor: pointer;
	transition: all 0.3s ease;
	backdrop-filter: blur(5px);
}

.indicator.active {
	background: var(--primary-green);
	border-color: var(--primary-green);
	box-shadow: 0 0 15px var(--primary-green);
}

.indicator:hover {
	background: rgba(57, 255, 20, 0.7);
	border-color: var(--neon-green);
	transform: scale(1.2);
}

/* Hide navigation when only one slide */
.hero-carousel:has(.hero-slide:only-child) .carousel-nav,
.hero-carousel:has(.hero-slide:only-child) .carousel-indicators {
	display: none;
}

/* Loading state for carousel */
.hero-carousel.loading {
	opacity: 0.7;
}

.hero-carousel.loading .carousel-nav,
.hero-carousel.loading .carousel-indicators {
	pointer-events: none;
}

/* Preload animation for hero images */
.hero-img {
	transition: opacity 0.3s ease, transform 0.3s ease;
}

.hero-img:not([src]),
.hero-img[src=""] {
	opacity: 0;
}

/* Enhanced accessibility */
.carousel-prev:focus,
.carousel-next:focus,
.indicator:focus {
	outline: 3px solid var(--neon-green);
	outline-offset: 2px;
}

/* Smooth scrolling for better UX */
@media (prefers-reduced-motion: reduce) {
	.hero-slide {
		transition: none;
	}
	
	.hero-img {
		transition: none;
	}
	
	.carousel-prev,
	.carousel-next,
	.indicator {
		transition: none;
	}
}

/* Print styles */
@media print {
	.carousel-nav,
	.carousel-indicators {
		display: none;
	}
	
	.hero-slide:not(.active) {
		display: none;
	}
}

/* Mobile carousel adjustments */
@media (max-width: 768px) {
	.carousel-nav {
		padding: 0 10px;
	}
	
	.carousel-prev,
	.carousel-next {
		width: 50px;
		height: 50px;
		font-size: 1rem;
	}
	
	.carousel-indicators {
		bottom: 20px;
	}
	
	.indicator {
		width: 12px;
		height: 12px;
	}
}

/* Products Grid */
.products-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 30px;
	margin-top: 2rem;
}

.latest-products {
	grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
}

/* Product Cards */
.product-card {
	background: var(--darker-bg);
	border-radius: 10px;
	overflow: hidden;
	transition: all 0.3s ease;
	position: relative;
}

.product-card:hover {
	transform: translateY(-5px);
	box-shadow: var(--shadow-glow);
}

.product-image {
	position: relative;
	overflow: hidden;
	height: 250px;
}

.product-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.3s ease;
}





.product-card:hover .product-image img {
	transform: scale(1.05);
}

.product-info {
	padding: 20px;
}

.product-title {
	font-size: 1.2rem;
	margin-bottom: 10px;
}

.product-title a {
	color: var(--white);
	text-decoration: none;
	transition: color 0.3s ease;
}

.product-title a:hover {
	color: var(--primary-green);
}

.product-price {
	font-size: 1.5rem;
	font-weight: bold;
	color: var(--primary-green);
	margin-bottom: 15px;
}

/* Badges */
.bestseller-badge,
.discount-badge {
	position: absolute;
	top: 10px;
	right: 10px;
	background: var(--primary-green);
	color: var(--white);
	padding: 5px 15px;
	border-radius: 20px;
	font-size: 0.8rem;
	font-weight: bold;
	text-transform: uppercase;
	z-index: 2;
}

.discount-badge {
	background: #ff4444;
}

/* Buttons */
.btn-primary,
.btn-whatsapp {
	display: inline-block;
	padding: 12px 25px;
	background: var(--primary-green);
	color: var(--white);
	text-decoration: none;
	border-radius: 5px;
	font-weight: bold;
	text-transform: uppercase;
	transition: all 0.3s ease;
	border: 2px solid var(--primary-green);
}

.btn-whatsapp {
	background: #25d366;
	border-color: #25d366;
	width: 100%;
	text-align: center;
}

.btn-primary:hover,
.btn-whatsapp:hover {
	/*background: transparent;
	color: var(--primary-green);*/
	box-shadow: var(--shadow-glow);
}

.btn-whatsapp:hover {
	border-color: #25d366;
}

/* WhatsApp Float Button */
.whatsapp-float {
	position: fixed;
	bottom: 30px;
	right: 30px;
	z-index: 1000;
}

.whatsapp-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 60px;
	height: 60px;
	background: #25d366;
	color: var(--white);
	border-radius: 50%;
	text-decoration: none;
	font-size: 2rem;
	box-shadow: 0 4px 12px rgba(37, 211, 102, 0.4);
	transition: all 0.3s ease;
	animation: pulse 2s infinite;
}

.whatsapp-btn:hover {
	transform: scale(1.1);
	box-shadow: 0 6px 20px rgba(37, 211, 102, 0.6);
}

@keyframes pulse {
	0% {
		box-shadow: 0 4px 12px rgba(37, 211, 102, 0.4);
	}
	50% {
		box-shadow: 0 4px 20px rgba(37, 211, 102, 0.8);
	}
	100% {
		box-shadow: 0 4px 12px rgba(37, 211, 102, 0.4);
	}
}

/* Responsive Design */
@media (max-width: 768px) {
	.hero-title {
		font-size: 2.5rem;
	}
	
	.hero-subtitle {
		font-size: 1.2rem;
	}
	
	.section-title {
		font-size: 2rem;
	}
	
	.products-grid,
	.latest-products {
		grid-template-columns: 1fr;
		gap: 20px;
	}
	
	.product-image {
		height: 200px;
	}
	
	.whatsapp-btn {
		width: 70px;
		height: 70px;
		font-size: 2.5rem;
	}
	
	.carousel-nav {
		padding: 0 10px;
	}
	
	.carousel-prev,
	.carousel-next {
		width: 40px;
		height: 40px;
		font-size: 1.2rem;
	}
}

@media (min-width: 769px) and (max-width: 1024px) {
	.products-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	
	.latest-products {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 1025px) {
	.products-grid {
		grid-template-columns: repeat(4, 1fr);
	}
	
	.latest-products {
		grid-template-columns: repeat(3, 1fr);
	}
}

/* Header Styles */
.site-header {
	background: var(--darker-bg);
	border-bottom: 2px solid var(--primary-green);
	position: sticky;
	top: 0;
	z-index: 999;
}

.top-contact-bar {
	background: var(--dark-bg);
	padding: 8px 0;
	font-size: 0.9rem;
}

.top-contact-bar .container {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.contact-info {
	display: flex;
	gap: 30px;
}

.contact-item {
	color: var(--light-gray);
}

.contact-item i {
	color: var(--primary-green);
	margin-right: 5px;
}

.contact-item a {
	color: var(--light-gray);
	text-decoration: none;
	transition: color 0.3s ease;
}

.contact-item a:hover {
	color: var(--primary-green);
}

.social-links {
	display: flex;
	gap: 15px;
}

.social-links a {
	color: var(--light-gray);
	font-size: 1.2rem;
	transition: color 0.3s ease;
}

.social-links a:hover {
	color: var(--primary-green);
}

.main-header {
	padding: 15px 0;
}

.main-header .container {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 20px;
}

.site-title a {
	color: var(--white);
	text-decoration: none;
	font-size: 2rem;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: 2px;
}

.site-title a:hover {
	color: var(--primary-green);
}

.site-description {
	color: var(--light-gray);
	margin: 5px 0 0 0;
	font-size: 0.9rem;
}

/* Header Search */
.header-search {
	flex: 1;
	max-width: 400px;
}

.woocommerce-product-search {
	display: flex;
	border: 2px solid var(--primary-green);
	border-radius: 5px;
	overflow: hidden;
}

.search-field {
	flex: 1;
	padding: 12px 15px;
	border: none;
	background: var(--dark-bg);
	color: var(--white);
	font-size: 1rem;
}

.search-field:focus {
	outline: none;
	background: var(--darker-bg);
}

.search-field::placeholder {
	color: var(--light-gray);
}

.search-button {
	background: var(--primary-green);
	color: var(--white);
	border: none;
	padding: 12px 20px;
	cursor: pointer;
	transition: background 0.3s ease;
}

.search-button:hover {
	background: var(--neon-green);
	color: var(--dark-bg);
}

/* Navigation */
.main-navigation {
	position: relative;
}

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

.main-navigation a {
	color: var(--white);
	text-decoration: none;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 1px;
	transition: color 0.3s ease;
	padding: 10px 0;
}

.main-navigation a:hover {
	color: var(--primary-green);
}

/* Hamburger Menu */
.menu-toggle {
	display: none;
	background: none;
	border: none;
	cursor: pointer;
}

.hamburger {
	display: flex;
	flex-direction: column;
	width: 25px;
	height: 20px;
	justify-content: space-between;
}

.hamburger span {
	display: block;
	height: 3px;
	background: var(--white);
	transition: all 0.3s ease;
}

.menu-toggle:hover .hamburger span {
	background: var(--primary-green);
}

/* Mobile Header Styles */
@media (max-width: 768px) {
	.top-contact-bar .container {
		flex-direction: column;
		gap: 10px;
		text-align: center;
	}
	
	.contact-info {
		flex-direction: column;
		gap: 10px;
	}
	
	.main-header .container {
		flex-wrap: wrap;
		gap: 15px;
	}
	
	.site-branding {
		order: 1;
	}
	
	.menu-toggle {
		display: block;
		order: 2;
	}
	
	.header-search {
		order: 3;
		width: 100%;
		max-width: none;
	}
	
	.main-navigation {
		order: 4;
		width: 100%;
	}
	
	.main-navigation ul {
		display: none;
		flex-direction: column;
		background: var(--dark-bg);
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		padding: 20px;
		gap: 0;
		border-top: 2px solid var(--primary-green);
	}
	
	.main-navigation.toggled ul {
		display: flex;
	}
	
	.main-navigation li {
		border-bottom: 1px solid rgba(46, 121, 27, 0.3);
		padding: 15px 0;
	}
	
	.main-navigation li:last-child {
		border-bottom: none;
	}
	
	.site-title a {
		font-size: 1.5rem;
	}
}

.torn-paper-divider {
	width: 100%;
	position: relative;
}

.torn-paper-divider img {
	width: 100%;
}

/* Footer CaquetioShop */
.site-footer {
	background: var(--darker-bg);
	color: var(--white);
	padding: 40px 0 24px 0;
	border-top: 4px solid var(--primary-green);
	box-shadow: 0 -10px 15px 2px var(--neon-green);
	font-size: 1.1rem;
}
.footer-content {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 20px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 18px;
}
.footer-contact {
	display: flex;
	gap: 32px;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	font-size: 1rem;
	color: var(--light-gray);
}
.footer-contact i {
	color: var(--primary-green);
	margin-right: 6px;
}
.footer-contact a {
	color: var(--neon-green);
	text-decoration: none;
	font-weight: bold;
}
.footer-social {
	display: flex;
	gap: 18px;
	justify-content: center;
	align-items: center;
	margin-top: 8px;
}
.footer-social a {
	color: var(--primary-green);
	font-size: 1.7rem;
	transition: color 0.2s, transform 0.2s;
}
.footer-social a:hover {
	color: var(--neon-green);
	transform: scale(1.15);
}
.footer-copy {
	margin-top: 12px;
	color: var(--light-gray);
	font-size: 0.95rem;
	text-align: center;
}

@media (max-width: 600px) {
	.footer-content {
		gap: 12px;
		padding: 0 8px;
	}
	.footer-contact {
		gap: 12px;
		font-size: 0.95rem;
	}
	.footer-social {
		gap: 12px;
		font-size: 1.3rem;
	}
}

/*--------------------------------------------------------------
# Single Product Page Styles
--------------------------------------------------------------*/
.single-product-main {
	background-image: url('assets/images/paper-bg.jpg');
	background-size: 100% 100%;
	color: var(--white);
	padding: 100px 0 60px;
	position: relative;
}

.product-hero {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 20px;
	display: flex;
	gap: 60px;
	align-items: flex-start;
	margin-bottom: 60px;
	z-index: 2;
}

.product-gallery {
	flex: 1;
	max-width: 500px;
}

.product-gallery .woocommerce-product-gallery {
	background: var(--dark-bg);
	border-radius: 15px;
	padding: 20px;
	border: 2px solid var(--primary-green);
	box-shadow: 0 0 30px rgba(46, 121, 27, 0.3);
	position: relative;
}

a.woocommerce-product-gallery__trigger {
	position: absolute;
    top: 25px;
    right: 25px;
    z-index: 1;
    background: #fff;
    border-radius: 5px;
    width: 30px;
    text-align: center;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0.5;
	transition: all 0.3s ease;
}

a.woocommerce-product-gallery__trigger:hover {
	opacity: 0.9;
	border: 1px solid var(--neon-green);
	box-shadow: 0 0 15px var(--neon-green);
}

.product-gallery img {
	width: 100%;
	border-radius: 10px;
	transition: transform 0.3s ease;
}

.product-gallery img:hover {
	transform: scale(1.05);
}

.product-details {
	flex: 1;
	padding-left: 40px;
}

.product-title {
	font-size: 2rem;
	font-family: 'Bebas Neue', 'Oswald', sans-serif;
	font-weight: 900;
	margin-bottom: 20px;
	text-transform: uppercase;
	letter-spacing: 2px;
	line-height: 1.1;
}

.product-price {
	font-size: 2.5rem;
	font-weight: bold;
	color: var(--neon-green);
	margin-bottom: 30px;
	text-shadow: 0 0 15px var(--neon-green);
}

.product-desc, .product-stock {
	font-size: 1.1rem;
	line-height: 1.6;
	margin-bottom: 40px;
	color: var(--light-gray);
}

.whatsapp-btn {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 18px 35px;
	background: #25d366;
	color: var(--white);
	text-decoration: none;
	font-size: 1.2rem;
	font-weight: bold;
	text-transform: uppercase;
	border-radius: 8px;
	border: 2px solid #25d366;
	transition: all 0.3s ease;
	box-shadow: 0 0 20px rgba(37, 211, 102, 0.4);
}

.whatsapp-btn:hover {
	background: transparent;
	color: #25d366;
	box-shadow: 0 0 30px rgba(37, 211, 102, 0.8);
	transform: translateY(-2px);
}

.whatsapp-btn i {
	font-size: 1.4rem;
}

.related-products {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 20px;
	z-index: 2;
}

.related-products h2 {
	font-size: 2.5rem;
	font-family: 'Bebas Neue', 'Oswald', sans-serif;
	text-align: center;
	margin-bottom: 40px;
	text-transform: uppercase;
	letter-spacing: 2px;
}

/* Mobile Responsive for Single Product */
@media (max-width: 768px) {
	.product-hero {
		flex-direction: column;
		gap: 30px;
	}
	
	.product-details {
		padding-left: 0;
	}
	
	.product-title {
		font-size: 2rem;
		text-align: center;
	}
	
	.product-price {
		font-size: 2rem;
		text-align: center;
	}
	
	.whatsapp-btn {
		width: 100%;
		justify-content: center;
		font-size: 1.1rem;
		padding: 16px 25px;
	}
}

/*--------------------------------------------------------------
# Shop/Archive Product Page Styles
--------------------------------------------------------------*/
.shop-main {
	background: var(--darker-bg);
	color: var(--white);
	padding: 40px 0;
	position: relative;
}

.shop-filters {
	max-width: 1200px;
	margin: 40px auto;
	padding: 0 20px;
}

.shop-filters form {
	display: flex;
	gap: 20px;
	align-items: center;
	justify-content: center;
	background: var(--dark-bg);
	padding: 25px;
	border-radius: 15px;
	border: 2px solid var(--primary-green);
	box-shadow: 0 0 20px rgba(46, 121, 27, 0.3);
}

.shop-category-select {
	padding: 12px 20px;
	background: var(--darker-bg);
	color: var(--white);
	border: 2px solid var(--primary-green);
	border-radius: 8px;
	font-size: 1rem;
	min-width: 200px;
	cursor: pointer;
}

.shop-category-select:focus {
	outline: none;
	border-color: var(--neon-green);
	box-shadow: 0 0 10px rgba(57, 255, 20, 0.5);
}

.shop-sort-btn {
	padding: 12px 25px;
	background: var(--primary-green);
	color: var(--white);
	border: 2px solid var(--primary-green);
	border-radius: 8px;
	font-size: 1rem;
	font-weight: bold;
	text-transform: uppercase;
	cursor: pointer;
	transition: all 0.3s ease;
	display: flex;
	align-items: center;
	gap: 8px;
}

.shop-sort-btn:hover {
	background: transparent;
	color: var(--primary-green);
	box-shadow: 0 0 15px var(--primary-green);
}

.shop-products {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 20px;
}

/* Mobile Responsive for Shop */
@media (max-width: 768px) {
	.shop-filters form {
		flex-direction: column;
		gap: 15px;
	}
	
	.shop-category-select {
		width: 100%;
		min-width: 0;
	}
	
	.shop-sort-btn {
		width: 100%;
		justify-content: center;
	}
}

/*--------------------------------------------------------------
# Search Products Page Styles
--------------------------------------------------------------*/
.search-products-main {
	background: var(--darker-bg);
	color: var(--white);
	padding: 40px 0;
}

.search-products-bar {
	max-width: 1200px;
	margin: 0 auto 40px auto;
	padding: 0 20px;
}

.search-products-bar form {
	display: flex;
	gap: 15px;
	align-items: center;
	background: var(--dark-bg);
	padding: 30px;
	border-radius: 15px;
	border: 2px solid var(--primary-green);
	box-shadow: 0 0 25px rgba(46, 121, 27, 0.4);
}

.search-input {
	flex: 2;
	padding: 15px 20px;
	background: var(--darker-bg);
	color: var(--white);
	border: 2px solid var(--primary-green);
	border-radius: 8px;
	font-size: 1.1rem;
}

.search-input:focus {
	outline: none;
	border-color: var(--neon-green);
	box-shadow: 0 0 15px rgba(57, 255, 20, 0.5);
}

.search-input::placeholder {
	color: var(--light-gray);
	font-style: italic;
}

.search-category-select {
	flex: 1;
	padding: 15px 20px;
	background: var(--darker-bg);
	color: var(--white);
	border: 2px solid var(--primary-green);
	border-radius: 8px;
	font-size: 1rem;
	cursor: pointer;
}

.search-category-select:focus {
	outline: none;
	border-color: var(--neon-green);
	box-shadow: 0 0 10px rgba(57, 255, 20, 0.5);
}

.search-btn {
	padding: 15px 30px;
	background: var(--primary-green);
	color: var(--white);
	border: 2px solid var(--primary-green);
	border-radius: 8px;
	font-size: 1.1rem;
	font-weight: bold;
	text-transform: uppercase;
	cursor: pointer;
	transition: all 0.3s ease;
	display: flex;
	align-items: center;
	gap: 10px;
	white-space: nowrap;
}

.search-btn:hover {
	background: transparent;
	color: var(--primary-green);
	box-shadow: 0 0 20px var(--primary-green);
	transform: translateY(-2px);
}

.search-products-results {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 20px;
}

.search-products-results p {
	text-align: center;
	font-size: 1.2rem;
	color: var(--light-gray);
	margin-top: 40px;
}

/* Mobile Responsive for Search */
@media (max-width: 768px) {
	.search-products-bar form {
		flex-direction: column;
		gap: 15px;
	}
	
	.search-input,
	.search-category-select {
		width: 100%;
		flex: none;
	}
	
	.search-btn {
		width: 100%;
		justify-content: center;
		font-size: 1rem;
		padding: 12px 25px;
	}
}

@media (max-width: 480px) {
	.search-products-bar {
		padding: 0 10px;
	}
	
	.search-products-bar form {
		padding: 20px 15px;
	}
	
	.search-input {
		padding: 12px 15px;
		font-size: 1rem;
	}
	
	.search-category-select {
		padding: 12px 15px;
	}
}

ol.flex-control-nav {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 5px;
	margin-top: 20px;
}

ol.flex-control-nav li {
	cursor: pointer;
	transition: all 0.3s ease;
}

ol.flex-control-nav li:hover img {
	border: 2px solid var(--neon-green);
	box-shadow: 0 0 10px var(--neon-green);
}

/*--------------------------------------------------------------
# Product Categories Styles
--------------------------------------------------------------*/
.product-categories {
	margin-bottom: 25px;
	display: flex;
	align-items: center;
	gap: 15px;
	flex-wrap: wrap;
}

.categories-label {
	font-weight: bold;
	color: var(--light-gray);
	font-size: 1rem;
	text-transform: uppercase;
	letter-spacing: 1px;
}

.product-category-link {
	display: inline-block;
	padding: 8px 16px;
	background: linear-gradient(135deg, var(--primary-green), #1e5a12);
	color: var(--white);
	text-decoration: none;
	border-radius: 25px;
	font-size: 0.9rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	border: 2px solid var(--primary-green);
	transition: all 0.3s ease;
	position: relative;
	overflow: hidden;
}

.product-category-link::before {
	content: '';
	position: absolute;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	background: linear-gradient(90deg, transparent, rgba(57, 255, 20, 0.3), transparent);
	transition: left 0.5s ease;
}

.product-category-link:hover {
	background: transparent;
	border-color: var(--neon-green);
	color: var(--neon-green);
	box-shadow: 0 0 15px rgba(57, 255, 20, 0.4);
	transform: translateY(-2px);
}

.product-category-link:hover::before {
	left: 100%;
}

.product-category-link:active {
	transform: translateY(0);
}

/* Mobile Responsive for Categories */
@media (max-width: 768px) {
	.product-categories {
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
	}
	
	.categories-label {
		font-size: 0.9rem;
	}
	
	.product-category-link {
		padding: 6px 14px;
		font-size: 0.85rem;
	}
}

/*--------------------------------------------------------------
# Enhanced Shop Page Styles
--------------------------------------------------------------*/
.shop-header {
	background: linear-gradient(135deg, var(--dark-bg), var(--primary-green));
	padding: 60px 0;
	text-align: center;
	border-bottom: 3px solid var(--neon-green);
	box-shadow: 0 5px 20px rgba(46, 121, 27, 0.3);
}

.shop-title {
	font-size: 3.5rem;
	font-family: 'Bebas Neue', 'Oswald', sans-serif;
	font-weight: 900;
	margin-bottom: 15px;
	text-transform: uppercase;
	letter-spacing: 3px;
	line-height: 1.1;
}

.shop-subtitle {
	font-size: 1.3rem;
	color: var(--light-gray);
	margin: 0;
	font-weight: 300;
	opacity: 0.9;
}

.shop-filters {
	background: var(--dark-bg);
	padding: 30px 0;
	border-bottom: 1px solid rgba(46, 121, 27, 0.3);
}

.shop-filters-form {
	display: flex;
	gap: 25px;
	align-items: end;
	justify-content: center;
	background: var(--darker-bg);
	padding: 30px;
	border-radius: 15px;
	border: 2px solid var(--primary-green);
	box-shadow: 0 0 25px rgba(46, 121, 27, 0.4);
	flex-wrap: wrap;
}

.filter-group {
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-width: 200px;
}

.filter-group label {
	font-weight: bold;
	color: var(--light-gray);
	font-size: 0.9rem;
	text-transform: uppercase;
	letter-spacing: 1px;
}

.shop-category-select,
.shop-sort-select {
	padding: 15px 20px;
	background: var(--dark-bg);
	color: var(--white);
	border: 2px solid var(--primary-green);
	border-radius: 8px;
	font-size: 1rem;
	cursor: pointer;
	transition: all 0.3s ease;
}

.shop-category-select:focus,
.shop-sort-select:focus {
	outline: none;
	border-color: var(--neon-green);
	box-shadow: 0 0 15px rgba(57, 255, 20, 0.5);
	background: var(--darker-bg);
}

.shop-apply-btn {
	padding: 15px 30px;
	background: var(--primary-green);
	color: var(--white);
	border: 2px solid var(--primary-green);
	border-radius: 8px;
	font-size: 1.1rem;
	font-weight: bold;
	text-transform: uppercase;
	cursor: pointer;
	transition: all 0.3s ease;
	display: flex;
	align-items: center;
	gap: 10px;
	white-space: nowrap;
}

.shop-apply-btn:hover {
	background: transparent;
	color: var(--primary-green);
	box-shadow: 0 0 20px var(--primary-green);
	transform: translateY(-2px);
}

.shop-results-bar {
	margin-bottom: 30px;
	padding: 20px 0;
	border-bottom: 1px solid rgba(46, 121, 27, 0.3);
}

.results-count {
	color: var(--light-gray);
	font-size: 1rem;
	margin: 0;
	text-align: center;
}

.results-count strong {
	color: var(--primary-green);
}

.no-products-found {
	text-align: center;
	padding: 80px 20px;
	color: var(--light-gray);
}

.no-products-found i {
	font-size: 4rem;
	color: var(--primary-green);
	margin-bottom: 20px;
	opacity: 0.7;
}

.no-products-found h3 {
	font-size: 2rem;
	margin-bottom: 15px;
	color: var(--white);
}

.no-products-found p {
	font-size: 1.1rem;
	margin-bottom: 30px;
}

/* Enhanced pagination */
.woocommerce-pagination {
	margin-top: 50px;
	text-align: center;
}

.woocommerce-pagination .page-numbers {
	display: inline-block;
	padding: 12px 18px;
	margin: 0 5px;
	background: var(--dark-bg);
	color: var(--white);
	text-decoration: none;
	border: 2px solid var(--primary-green);
	border-radius: 8px;
	transition: all 0.3s ease;
	font-weight: bold;
}

.woocommerce-pagination .page-numbers:hover,
.woocommerce-pagination .page-numbers.current {
	background: var(--primary-green);
	color: var(--white);
	box-shadow: 0 0 15px rgba(46, 121, 27, 0.5);
	transform: translateY(-2px);
}

/* Mobile Responsive for Enhanced Shop */
@media (max-width: 768px) {
	.shop-header {
		padding: 40px 0;
	}
	
	.shop-title {
		font-size: 2.5rem;
	}
	
	.shop-subtitle {
		font-size: 1.1rem;
	}
	
	.shop-filters-form {
		flex-direction: column;
		gap: 20px;
		padding: 25px 20px;
	}
	
	.filter-group {
		width: 100%;
		min-width: 0;
	}
	
	.shop-category-select,
	.shop-sort-select {
		width: 100%;
		padding: 12px 15px;
	}
	
	.shop-apply-btn {
		width: 100%;
		justify-content: center;
		align-self: stretch;
		font-size: 1rem;
		padding: 12px 25px;
	}
	
	.results-count {
		font-size: 0.9rem;
	}
	
	.no-products-found {
		padding: 60px 15px;
	}
	
	.no-products-found i {
		font-size: 3rem;
	}
	
	.no-products-found h3 {
		font-size: 1.5rem;
	}
}

/*--------------------------------------------------------------
# WooCommerce Products Grid Styles
--------------------------------------------------------------*/
.products-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 30px;
	margin-top: 2rem;
	list-style: none;
	padding: 0;
	margin-left: 0;
}

/* WooCommerce Product Items */
.products-grid .product {
	background: var(--darker-bg);
	border-radius: 15px;
	overflow: hidden;
	transition: all 0.3s ease;
	position: relative;
	border: 2px solid rgba(46, 121, 27, 0.3);
	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}

.products-grid .product:hover {
	transform: translateY(-8px);
	box-shadow: 0 15px 35px rgba(46, 121, 27, 0.4);
	border-color: var(--primary-green);
}

.products-grid .product::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(135deg, transparent, rgba(57, 255, 20, 0.05));
	opacity: 0;
	transition: opacity 0.3s ease;
	pointer-events: none;
	z-index: 1;
}

.products-grid .product:hover::before {
	opacity: 1;
}

/* Product Link Wrapper */
.woocommerce-LoopProduct-link {
	display: block;
	text-decoration: none;
	color: inherit;
	height: 100%;
	position: relative;
	z-index: 2;
}

/* Product Image */
.products-grid .product img {
	width: 100%;
	height: 250px;
	object-fit: cover;
	transition: transform 0.3s ease;
	border-bottom: 2px solid rgba(46, 121, 27, 0.3);
}

.products-grid .product:hover img {
	transform: scale(1.05);
}

/* Product Title */
.woocommerce-loop-product__title {
	font-size: 1.2rem;
	font-weight: bold;
	color: var(--white);
	margin: 20px 20px 15px 20px;
	line-height: 1.3;
	transition: color 0.3s ease;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.products-grid .product:hover .woocommerce-loop-product__title {
	color: var(--primary-green);
	text-shadow: 0 0 10px rgba(46, 121, 27, 0.5);
}

/* Product Price */
.products-grid .product .price {
	display: block;
	margin: 0 20px 20px 20px;
	font-size: 1.4rem;
	font-weight: bold;
	color: var(--neon-green);
	text-shadow: 0 0 10px rgba(57, 255, 20, 0.3);
}

.woocommerce-Price-amount {
	color: inherit;
}

.woocommerce-Price-currencySymbol {
	margin-right: 2px;
}

/* Product Categories */
.products-grid .product .product_cat-repuestos-vehicular::after {
	content: 'Repuestos';
	position: absolute;
	top: 15px;
	right: 15px;
	background: var(--primary-green);
	color: var(--white);
	padding: 5px 12px;
	border-radius: 15px;
	font-size: 0.8rem;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	z-index: 3;
}

.products-grid .product .product_cat-electronica::after {
	content: 'Electrónica';
	position: absolute;
	top: 15px;
	right: 15px;
	background: #e74c3c;
	color: var(--white);
	padding: 5px 12px;
	border-radius: 15px;
	font-size: 0.8rem;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	z-index: 3;
}

/* Sale Badge for products on sale */
.products-grid .product.on-sale::before {
	content: 'OFERTA';
	position: absolute;
	top: 15px;
	left: 15px;
	background: #ff4444;
	color: var(--white);
	padding: 5px 12px;
	border-radius: 15px;
	font-size: 0.8rem;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	z-index: 3;
	animation: pulse 2s infinite;
}

/* Featured/Popular Products */
.products-grid .product.featured::after {
	content: 'DESTACADO';
	position: absolute;
	top: 15px;
	left: 15px;
	background: var(--neon-green);
	color: var(--dark-bg);
	padding: 5px 12px;
	border-radius: 15px;
	font-size: 0.8rem;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	z-index: 3;
}

/* Out of Stock Products */
.products-grid .product.outofstock {
	opacity: 0.7;
	position: relative;
}

.products-grid .product.outofstock::before {
	content: 'AGOTADO';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: rgba(0, 0, 0, 0.8);
	color: var(--white);
	padding: 10px 20px;
	border-radius: 8px;
	font-size: 1rem;
	font-weight: bold;
	text-transform: uppercase;
	z-index: 5;
}

/* Responsive Grid */
@media (max-width: 1200px) {
	.products-grid {
		grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
		gap: 25px;
	}
}

@media (max-width: 768px) {
	.products-grid {
		grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
		gap: 20px;
	}
	
	.products-grid .product img {
		height: 200px;
	}
	
	.woocommerce-loop-product__title {
		font-size: 1.1rem;
		margin: 15px 15px 12px 15px;
	}
	
	.products-grid .product .price {
		font-size: 1.2rem;
		margin: 0 15px 15px 15px;
	}
}

@media (max-width: 480px) {
	.products-grid {
		grid-template-columns: 1fr;
		gap: 15px;
	}
	
	.products-grid .product img {
		height: 180px;
	}
	
	.woocommerce-loop-product__title {
		font-size: 1rem;
	}
	
	.products-grid .product .price {
		font-size: 1.1rem;
	}
}

/*--------------------------------------------------------------
# Related Products Section Styles
--------------------------------------------------------------*/
.related.products {
	max-width: 1200px;
	margin: 60px auto 0 auto;
	padding: 40px 20px;
	background: var(--dark-bg);
	border-radius: 15px;
	border: 2px solid var(--primary-green);
	box-shadow: 0 0 30px rgba(46, 121, 27, 0.3);
	position: relative;
}

.related.products::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(135deg, transparent, rgba(57, 255, 20, 0.05));
	border-radius: 13px;
	pointer-events: none;
}

.related.products > h2 {
	display: none;
	font-size: 2.5rem;
	font-family: 'Bebas Neue', 'Oswald', sans-serif;
	font-weight: 900;
	text-align: center;
	margin-bottom: 40px;
	text-transform: uppercase;
	letter-spacing: 2px;
	color: var(--white);
	position: relative;
	z-index: 2;
}

/* Related Products Grid */
.related.products .products {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 25px;
	list-style: none;
	padding: 0;
	margin: 0;
	position: relative;
	z-index: 2;
}

/* Override columns class for responsive grid */
.related.products .products.columns-4,
.related.products .products.columns-3,
.related.products .products.columns-2 {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

/* Related Product Items */
.related.products .product {
	background: var(--darker-bg);
	border-radius: 12px;
	overflow: hidden;
	transition: all 0.3s ease;
	position: relative;
	border: 2px solid rgba(46, 121, 27, 0.3);
	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}

.related.products .product:hover {
	transform: translateY(-6px);
	box-shadow: 0 12px 30px rgba(46, 121, 27, 0.4);
	border-color: var(--primary-green);
}

.related.products .product::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(135deg, transparent, rgba(57, 255, 20, 0.05));
	opacity: 0;
	transition: opacity 0.3s ease;
	pointer-events: none;
	z-index: 1;
}

.related.products .product:hover::before {
	opacity: 1;
}

/* Related Product Link Wrapper */
.related.products .woocommerce-LoopProduct-link {
	display: block;
	text-decoration: none;
	color: inherit;
	height: 100%;
	position: relative;
	z-index: 2;
}

/* Related Product Image */
.related.products .product img {
	width: 100%;
	height: 200px;
	object-fit: cover;
	transition: transform 0.3s ease;
	border-bottom: 2px solid rgba(46, 121, 27, 0.3);
}

.related.products .product:hover img {
	transform: scale(1.03);
}

/* Related Product Title */
.related.products .woocommerce-loop-product__title {
	font-size: 2rem;
	font-weight: bold;
	color: var(--white);
	margin: 15px 15px 12px 15px;
	line-height: 1.3;
	transition: color 0.3s ease;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.related.products .product:hover .woocommerce-loop-product__title {
	color: var(--primary-green);
	text-shadow: 0 0 8px rgba(46, 121, 27, 0.5);
}

/* Related Product Price */
.related.products .product .price {
	display: block;
	margin: 0 15px 15px 15px;
	font-size: 2rem;
	font-weight: bold;
	color: var(--neon-green);
	text-shadow: 0 0 15px var(--neon-green)
}

.related.products .woocommerce-Price-amount {
	color: inherit;
}

.related.products .woocommerce-Price-currencySymbol {
	margin-right: 2px;
}

/* Category Badges for Related Products */
.related.products .product .product_cat-electronica::after {
	content: 'Electrónica';
	position: absolute;
	top: 12px;
	right: 12px;
	background: #e74c3c;
	color: var(--white);
	padding: 4px 10px;
	border-radius: 12px;
	font-size: 0.75rem;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	z-index: 3;
}

.related.products .product .product_cat-repuestos-vehicular::after {
	content: 'Repuestos';
	position: absolute;
	top: 12px;
	right: 12px;
	background: var(--primary-green);
	color: var(--white);
	padding: 4px 10px;
	border-radius: 12px;
	font-size: 0.75rem;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	z-index: 3;
}

/* Responsive Design for Related Products */
@media (max-width: 1024px) {
	.related.products .products {
		grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
		gap: 20px;
	}
	
	.related.products .products.columns-4,
	.related.products .products.columns-3,
	.related.products .products.columns-2 {
		grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	}
}

@media (max-width: 768px) {
	.related.products {
		margin: 40px auto 0 auto;
		padding: 30px 15px;
	}
	
	.related.products > h2 {
		font-size: 2rem;
		margin-bottom: 30px;
	}
	
	.related.products .products {
		grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
		gap: 15px;
	}
	
	.related.products .products.columns-4,
	.related.products .products.columns-3,
	.related.products .products.columns-2 {
		grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	}
	
	.related.products .product img {
		height: 160px;
	}
	
	.related.products .woocommerce-loop-product__title {
		font-size: 1rem;
		margin: 12px 12px 10px 12px;
	}
	
	.related.products .product .price {
		font-size: 1.1rem;
		margin: 0 12px 12px 12px;
	}
}

@media (max-width: 480px) {
	.related.products .products {
		grid-template-columns: 1fr;
		gap: 12px;
	}
	
	.related.products .products.columns-4,
	.related.products .products.columns-3,
	.related.products .products.columns-2 {
		grid-template-columns: 1fr;
	}
	
	.related.products .product img {
		height: 140px;
	}
	
	.related.products .woocommerce-loop-product__title {
		font-size: 0.95rem;
	}
	
	.related.products .product .price {
		font-size: 1rem;
	}
}

/* Nuevo Producto Link */
.nuevo-producto-link {
    display: flex;
	align-items: center;
    padding: 10px 15px;
    background-color: var(--primary-green);
    color: #fff;
    text-decoration: none;
    border-radius: 5px;
	line-height: 1;
	font-weight: normal;
	font-size: .65rem;
    transition: background-color 0.3s ease, transform 0.2s ease;
	min-height: 40px;
	height: 40px;
}

.nuevo-producto-link:hover {
    background-color: var(--neon-green);
    transform: scale(1.05);
}

.nuevo-producto-link:active {
    transform: scale(0.95);
}

.header-shop-btn span {
	display: none;
}

@media (min-width: 600px) {
	.header-shop-btn span {
		display: inline;
	}

	.nuevo-producto-link {
		font-size: .85rem;
	}
}