/* =========================================================================
   GIARDINO PRIME — main.css — build v1.8.0
   Premium minimal luxury design. Mobile-first.

   v1.8.0 changes: single product page mobile responsiveness overhaul —
   removed the conflicting wc-product-gallery-zoom/lightbox theme
   supports that were fighting the theme's own custom gallery and were
   the real source of the "huge blank gaps on mobile" bug (see
   functions.php), tightened every spacing value on the mobile product
   page flow (breadcrumb → gallery → title → price → urgency →
   Add to Cart/Buy Now → trust badges → tabs), added a stock urgency
   bar, upgraded Add to Cart (gold, pulsing glow) and Buy It Now (dark,
   contrasting) into full-width Shopify-style CTAs on mobile, and
   expanded the trust badges block to 4 items in a 2-column mobile grid.

   v1.7.0 changes: footer redesign (real social SVG icons + back-to-top),
   shortened/animated Our Story, 2x2/4-row Why Choose Us with 3D icon
   flip, new Shop by Category (Watches/Belts) tiles, single-product
   gallery FlexSlider fallback CSS (fixes the "huge blank scroll before
   content" bug caused by WooCommerce's default styles being disabled),
   Buy It Now button, Shopify-style sliding mobile menu, and hover
   effects gated to real pointers so scrolling on touch doesn't fire them.

   These :root colors are the SAFE DEFAULTS. They only get overridden if
   the shop owner explicitly turns on "Enable custom colors" in
   Appearance > Customize > Giardino Prime: Colors (off by default). This
   two-step design exists because Customizer settings save to the
   database and persist across every theme update — a color saved during
   testing once kept silently overriding CSS fixes no matter how many
   times the theme zip was replaced. With the toggle off by default, that
   can't happen again; turning it on is an explicit, deliberate choice.

   If you view-source on the live site and don't see "v1.6.0" in this
   file, the server/CDN/browser is still serving an old cached copy —
   clear every caching layer (hosting cache plugin, CDN, browser) and
   re-check in a private/incognito window on a different device if
   possible.
   ========================================================================= */

:root {
	--gp-primary: #0F172A;
	--gp-accent: #D4AF37;
	--gp-secondary: #3B82F6;
	--gp-bg: #FFFFFF;
	--gp-text: #111827;
	--gp-light-gray: #F8FAFC;
	--gp-line: #E5E7EB;
	--gp-radius: 4px;
	--gp-radius-lg: 16px;
	--gp-font-heading: 'Cormorant Garamond', Georgia, serif;
	--gp-font-body: 'Jost', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--gp-shadow-soft: 0 4px 24px rgba(15, 23, 42, 0.08);
	--gp-shadow-lift: 0 16px 40px rgba(15, 23, 42, 0.14);
	--gp-container: 1240px;
}

/* ---------------------------------------------------------------------
   Reset / base
   ------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html, body {
	overflow-x: hidden !important;
	max-width: 100% !important;
	margin: 0;
	padding: 0;
}
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}
body {
	font-family: var(--gp-font-body);
	color: var(--gp-text);
	background: var(--gp-bg);
	font-size: 16px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6 { font-family: var(--gp-font-heading); font-weight: 500; line-height: 1.2; margin: 0 0 0.5em; color: var(--gp-primary); }
p { margin: 0 0 1em; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; height: auto; display: block; }
ul, ol { margin: 0; padding: 0; list-style: none; }
button { font-family: inherit; cursor: pointer; }
input, textarea, select { font-family: inherit; font-size: 16px; }

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}
.skip-link.screen-reader-text:focus {
	position: fixed !important;
	top: 8px; left: 8px;
	width: auto; height: auto;
	clip: auto;
	z-index: 100000;
	background: var(--gp-primary);
	color: #fff;
	padding: 12px 20px;
	border-radius: var(--gp-radius);
}

.gp-container { max-width: var(--gp-container); margin: 0 auto; padding: 0 24px; }

/* ---------------------------------------------------------------------
   Buttons
   ------------------------------------------------------------------- */
.gp-btn {
	position: relative;
	overflow: hidden;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 15px 32px;
	border-radius: var(--gp-radius);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	border: 1px solid transparent;
	transition: transform 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease;
	will-change: transform;
}
.gp-btn:hover { transform: translateY(-2px); box-shadow: var(--gp-shadow-lift); }
.gp-btn--gold { background: var(--gp-accent); color: var(--gp-primary); }
.gp-btn--gold:hover { background: #c19f2e; }
.gp-btn--outline { background: transparent; border-color: var(--gp-primary); color: var(--gp-primary); }
.gp-btn--outline-light { background: transparent; border-color: rgba(255,255,255,0.6); color: #fff; }
.gp-btn--outline-light:hover { background: rgba(255,255,255,0.12); }
.gp-ripple {
	position: absolute;
	border-radius: 50%;
	background: rgba(255,255,255,0.5);
	transform: translate(-50%, -50%);
	width: 10px; height: 10px;
	pointer-events: none;
	animation: gp-ripple-anim 0.6s ease-out;
}
@keyframes gp-ripple-anim {
	from { width: 10px; height: 10px; opacity: 0.6; }
	to { width: 300px; height: 300px; opacity: 0; }
}

.gp-link-arrow { font-weight: 600; font-size: 14px; letter-spacing: 0.03em; border-bottom: 1px solid currentColor; padding-bottom: 2px; transition: opacity 0.2s ease; }
.gp-link-arrow:hover { opacity: 0.7; }

/* ---------------------------------------------------------------------
   Scroll reveal + shared eyebrow/section styles
   ------------------------------------------------------------------- */
.gp-reveal, .gp-section__head { opacity: 0; transform: translateY(24px); transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1); }
.gp-reveal.is-visible, .gp-section__head.is-visible { opacity: 1; transform: translateY(0); }

.gp-eyebrow { display: flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gp-accent); margin: 0 0 12px; }
.gp-eyebrow--light { color: var(--gp-accent); }
.gp-eyebrow__icon { width: 8px; height: 8px; background: var(--gp-accent); display: inline-block; }

.gp-section { padding: 56px 0; }
@media (min-width: 700px) { .gp-section { padding: 80px 0; } }
@media (min-width: 960px) { .gp-section { padding: 96px 0; } }
.gp-section--alt { background: var(--gp-light-gray); }
.gp-section__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 28px; }
@media (min-width: 700px) { .gp-section__head { margin-bottom: 40px; } }
.gp-section__head--center { justify-content: center; text-align: center; flex-direction: column; align-items: center; }
.gp-section__title { font-size: clamp(24px, 6vw, 40px); margin: 0; line-height: 1.15; }

/* ---------------------------------------------------------------------
   Header
   ------------------------------------------------------------------- */
.gp-announcement-bar { background: var(--gp-primary); color: #fff; text-align: center; padding: 8px 16px; font-size: 13px; letter-spacing: 0.03em; }
.gp-announcement-bar p { margin: 0; }

.gp-header {
	position: sticky; top: 0; z-index: 900;
	background: #fff;
	border-bottom: 1px solid var(--gp-line);
	transition: box-shadow 0.3s ease;
}
.gp-header.is-scrolled { box-shadow: var(--gp-shadow-soft); }

.gp-header__inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 18px 24px; }

/* Mobile: hamburger + logo + 4 action icons don't all fit at the desktop
   spacing on a ~380–430px phone — the cart icon was overflowing off the
   right edge. Tighten padding/gaps and shrink the icon buttons below the
   point the desktop nav takes over (960px). */
@media (max-width: 959px) {
	.gp-header__inner { padding: 14px 12px; gap: 8px; }
	.gp-logo__text { font-size: 20px; }
	.gp-logo__tagline { display: none; }
	.gp-header__actions { gap: 0; flex-shrink: 0; }
	.gp-icon-btn { width: 34px; height: 34px; }
	.gp-icon-btn svg { width: 18px; height: 18px; }
	.gp-cart-count, .gp-wishlist-count { min-width: 14px; height: 14px; font-size: 9px; }
}
@media (max-width: 359px) {
	.gp-header__inner { gap: 4px; }
	.gp-icon-btn { width: 30px; height: 30px; }
}

.gp-logo__text { font-family: var(--gp-font-heading); font-size: 26px; font-weight: 600; letter-spacing: 0.04em; display: flex; flex-direction: column; line-height: 1.1; color: var(--gp-primary); }
.gp-logo__tagline { font-size: 11px; font-family: var(--gp-font-body); letter-spacing: 0.12em; text-transform: uppercase; opacity: 0.6; font-weight: 400; }
.custom-logo-link img { max-height: 48px; width: auto; }

.gp-primary-nav { display: none; }
.gp-menu { display: flex; align-items: center; gap: 32px; }
.gp-menu > li { position: relative; }
.gp-menu > li > a { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; padding: 8px 0; color: var(--gp-primary); }
.gp-menu-caret { width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); margin-top: -4px; }

.gp-mega-panel {
	position: absolute; top: 100%; left: 50%; transform: translateX(-50%) translateY(8px);
	background: #fff; color: var(--gp-text); border-radius: var(--gp-radius-lg); box-shadow: var(--gp-shadow-lift);
	padding: 28px; width: max-content; max-width: min(480px, 90vw); display: flex; gap: 32px; flex-wrap: wrap;
	opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 0.2s ease, transform 0.2s ease;
	z-index: 50;
}
.gp-has-mega.gp-mega-open > .gp-mega-panel { opacity: 1; visibility: visible; pointer-events: auto; transform: translateX(-50%) translateY(0); }
.gp-mega-panel > li { min-width: 160px; }
.gp-mega-panel .sub-menu { margin-top: 8px; }
.gp-mega-panel a { display: block; padding: 6px 0; font-size: 14px; text-transform: none; letter-spacing: normal; font-weight: 400; color: var(--gp-text); }
.gp-mega-panel a:hover { color: var(--gp-accent); }

.gp-header__actions { display: flex; align-items: center; gap: 4px; }
.gp-icon-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; color: var(--gp-primary); transition: background-color 0.2s ease; }
.gp-icon-btn:hover { background: var(--gp-light-gray); }
.gp-icon-btn svg { display: block; }
.gp-cart-count, .gp-wishlist-count {
	position: absolute; top: 2px; right: 2px; min-width: 16px; height: 16px; border-radius: 50%;
	background: var(--gp-accent); color: var(--gp-primary); font-size: 10px; font-weight: 700;
	display: flex; align-items: center; justify-content: center; padding: 0 3px;
}

.gp-menu-toggle { display: inline-flex; flex-direction: column; justify-content: center; gap: 5px; width: 32px; height: 32px; background: none !important; border: none; flex-shrink: 0; margin-right: -4px; }
.gp-menu-toggle span { display: block; width: 100%; height: 2px; background-color: var(--gp-primary, #0F172A) !important; transition: transform 0.25s ease, opacity 0.25s ease; }

.gp-search-panel { border-top: 1px solid var(--gp-line); background: #fff; padding: 20px 0; }
.gp-search-form { display: flex; gap: 12px; }
.gp-search-form input { flex: 1; border: 1px solid var(--gp-line); border-radius: var(--gp-radius); padding: 12px 16px; }
.gp-search-form button { background: var(--gp-primary); color: #fff; border: none; border-radius: var(--gp-radius); padding: 12px 24px; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; font-size: 13px; }

/* Mobile drawer — white background, black text (menu contents are just
   links, no need for the dark "premium" treatment there). Slides in from
   the right with a Shopify-style ease-out, overlay fades in alongside. */
.gp-mobile-drawer {
	position: fixed; top: 0; right: 0; bottom: 0; width: min(88vw, 360px);
	background: #fff; color: var(--gp-text); z-index: 1000; padding: 32px 28px;
	overflow-y: auto; box-shadow: -18px 0 48px rgba(15,23,42,0.18);
	transform: translateX(100%);
	transition: transform 0.42s cubic-bezier(0.16, 1, 0.3, 1);
}
.gp-mobile-drawer.is-open { transform: translateX(0); }
.gp-drawer-close {
	position: absolute; top: 20px; right: 20px; width: 36px; height: 36px; border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	background: var(--gp-light-gray); border: none; color: var(--gp-primary); font-size: 24px; line-height: 1;
	transition: background-color 0.2s ease, transform 0.2s ease;
}
.gp-drawer-close:hover { background: var(--gp-accent); transform: rotate(90deg); }
.gp-mobile-drawer .gp-menu { flex-direction: column; align-items: flex-start; gap: 0; margin-top: 48px; }
.gp-mobile-drawer .gp-menu > li {
	width: 100%; border-bottom: 1px solid var(--gp-line);
	opacity: 0; transform: translateX(16px);
	transition: opacity 0.35s ease, transform 0.35s ease;
}
.gp-mobile-drawer.is-open .gp-menu > li { opacity: 1; transform: translateX(0); }
.gp-mobile-drawer.is-open .gp-menu > li:nth-child(1) { transition-delay: 0.08s; }
.gp-mobile-drawer.is-open .gp-menu > li:nth-child(2) { transition-delay: 0.13s; }
.gp-mobile-drawer.is-open .gp-menu > li:nth-child(3) { transition-delay: 0.18s; }
.gp-mobile-drawer.is-open .gp-menu > li:nth-child(4) { transition-delay: 0.23s; }
.gp-mobile-drawer.is-open .gp-menu > li:nth-child(5) { transition-delay: 0.28s; }
.gp-mobile-drawer.is-open .gp-menu > li:nth-child(n+6) { transition-delay: 0.32s; }
.gp-mobile-drawer .gp-menu > li > a { padding: 16px 0; width: 100%; justify-content: space-between; font-size: 15px; color: var(--gp-text); }
.gp-mobile-drawer .gp-mega-panel,
.gp-mobile-drawer .sub-menu {
	position: static; transform: none; opacity: 1; visibility: visible; pointer-events: auto;
	background: transparent; box-shadow: none; color: var(--gp-text);
	padding: 0 0 12px 12px; display: block; width: 100%; max-width: 100%;
}
.gp-mobile-drawer .gp-mega-panel a,
.gp-mobile-drawer .sub-menu a { color: var(--gp-text); }
.gp-drawer-overlay {
	position: fixed; inset: 0; background: rgba(15,23,42,0.5); z-index: 999;
	opacity: 0; transition: opacity 0.42s ease; pointer-events: none;
}
.gp-drawer-overlay.is-open { opacity: 1; pointer-events: auto; }
body.gp-drawer-open { overflow: hidden; }

/* ---------------------------------------------------------------------
   Hero
   ------------------------------------------------------------------- */
.gp-hero {
	position: relative; min-height: 70vh; display: flex; align-items: center;
	background: linear-gradient(135deg, var(--gp-light-gray) 0%, #EFE6D3 100%) center/cover no-repeat;
	color: var(--gp-primary); overflow: hidden;
}
.gp-hero__overlay { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(255,255,255,0.15), rgba(255,255,255,0.55)); }
.gp-hero__content { position: relative; z-index: 2; max-width: 640px; }
.gp-hero__title { color: var(--gp-primary); font-size: clamp(32px, 9vw, 64px); line-height: 1.1; margin-bottom: 18px; }
.gp-hero__subtitle { font-size: clamp(15px, 3vw, 18px); color: var(--gp-text); opacity: 0.85; margin-bottom: 28px; }
/* If a hero background image IS set via the Customizer, switch to a dark
   scrim so light-colored headline text still reads clearly on a photo. */
.gp-hero.has-image { color: #fff; }
.gp-hero.has-image .gp-hero__overlay { background: linear-gradient(180deg, rgba(15,23,42,0.35), rgba(15,23,42,0.7)); }
.gp-hero.has-image .gp-hero__title,
.gp-hero.has-image .gp-hero__subtitle { color: #fff; opacity: 1; }
.gp-hero.has-image .gp-eyebrow { color: var(--gp-accent); }

/* ---------------------------------------------------------------------
   Product grid & cards (shared: shop, category, related, home sections)
   ------------------------------------------------------------------- */
.gp-product-grid, ul.products {
	display: grid !important;
	grid-template-columns: repeat(2, 1fr) !important;
	gap: 16px !important;
	margin: 0 !important; padding: 0 !important;
}
@media (min-width: 700px) {
	.gp-product-grid, ul.products { grid-template-columns: repeat(3, 1fr) !important; gap: 24px !important; }
}
@media (min-width: 960px) {
	.gp-product-grid, ul.products { grid-template-columns: repeat(4, 1fr) !important; gap: 28px !important; }
}
.gp-product-card, ul.products li.product {
	position: relative;
	background: #fff;
	border: none;
	border-radius: var(--gp-radius);
	overflow: hidden;
	min-width: 0; width: 100%;
	transition: box-shadow 0.3s ease, transform 0.3s ease;
}
/* Hover lift/zoom only for devices with a real pointer (mouse/trackpad).
   On touch screens, :hover can get "stuck" mid-scroll and make cards
   appear to randomly lift/animate while the page is simply being
   scrolled — gating behind (hover: hover) fixes that. */
@media (hover: hover) and (pointer: fine) {
	.gp-product-card:hover, ul.products li.product:hover { box-shadow: var(--gp-shadow-soft); transform: translateY(-2px); }
}

ul.products li.product > a { display: block; width: 100%; }
ul.products li.product img {
	width: 100% !important; height: auto; aspect-ratio: 1/1; object-fit: contain;
	background: #fff; padding: 12px; box-sizing: border-box;
	transition: transform 0.4s ease;
}
@media (hover: hover) and (pointer: fine) {
	ul.products li.product:hover img { transform: scale(1.04); }
}

.gp-card-actions { position: absolute; top: 10px; right: 10px; z-index: 5; display: flex; flex-direction: column; gap: 8px; }
.gp-wishlist-btn, .gp-quickview-btn, .gp-compare-btn {
	width: 34px; height: 34px; border-radius: 50%; background: rgba(255,255,255,0.95); border: 1px solid var(--gp-line);
	display: flex; align-items: center; justify-content: center; color: var(--gp-primary);
	box-shadow: var(--gp-shadow-soft); transition: background-color 0.2s ease, color 0.2s ease;
}
.gp-wishlist-btn:hover, .gp-quickview-btn:hover, .gp-compare-btn:hover { background: var(--gp-accent); }
.gp-wishlist-btn.is-active { background: var(--gp-accent); color: var(--gp-primary); }
.gp-wishlist-btn.is-active svg path { fill: currentColor; }
.gp-compare-btn.is-active { background: var(--gp-secondary); color: #fff; }

.gp-product-brand { display: block; font-size: 11px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: #9CA3AF; margin: 14px 16px 2px; }
ul.products li.product .woocommerce-loop-product__title { font-family: var(--gp-font-body); font-weight: 600; font-size: 15px; color: var(--gp-primary); margin: 0 16px 8px; line-height: 1.35; }
ul.products li.product .price { display: block; margin: 0 16px 16px; font-size: 14px; }
ul.products li.product .price del { color: #EA580C; opacity: 1; font-weight: 400; margin-right: 8px; text-decoration: line-through; }
ul.products li.product .price ins { text-decoration: none; font-weight: 700; color: var(--gp-primary); font-size: 16px; }
/* Star rating — WooCommerce's own stylesheet (which normally draws these
   via its bundled icon font) is intentionally disabled site-wide in favor
   of our own CSS, so we recreate the classic two-layer star technique
   ourselves using plain Unicode stars in our accent gold. */
.star-rating {
	position: relative;
	display: inline-block;
	width: 5.3em;
	height: 1em;
	font-size: 15px;
	line-height: 1;
	letter-spacing: 0.15em;
	overflow: hidden;
}
.star-rating::before {
	content: "\2606\2606\2606\2606\2606";
	position: absolute; top: 0; left: 0;
	color: var(--gp-line);
	white-space: nowrap;
}
.star-rating span { position: absolute; top: 0; left: 0; overflow: hidden; display: block; height: 100%; }
.star-rating span::before {
	content: "\2605\2605\2605\2605\2605";
	color: var(--gp-accent);
	white-space: nowrap;
}
ul.products li.product .star-rating { margin: 0 18px 8px; }
.woocommerce-product-rating { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; }
.woocommerce-product-rating .star-rating { font-size: 18px; }
.woocommerce-review-link { font-size: 13px; opacity: 0.7; }

.gp-write-review-link { display: inline-block; font-size: 13px; font-weight: 600; text-decoration: underline; margin: 0 0 16px; color: var(--gp-primary); }
ul.products li.product .button {
	display: block; margin: 0 16px 16px; text-align: center; padding: 11px 18px;
	background: var(--gp-accent); color: var(--gp-primary); border-radius: var(--gp-radius);
	font-size: 12px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
	transition: background-color 0.2s ease;
}
ul.products li.product .button:hover { background: var(--gp-primary); color: #fff; }
ul.products li.product .onsale {
	position: absolute; top: 14px; left: 14px; z-index: 4; background: #B91C1C; color: #fff;
	font-size: 11px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase;
	padding: 5px 10px; border-radius: 3px;
}
.related.products, .upsells.products {
	display: block !important; width: 100%; max-width: 100%; box-sizing: border-box;
	margin-top: 64px; padding-top: 48px; border-top: 1px solid var(--gp-line);
}
.related.products > h2, .upsells.products > h2 { font-size: clamp(24px, 3vw, 32px); margin-bottom: 32px; }

/* Countdown (Flash Sale) */
.gp-countdown { font-family: var(--gp-font-heading); font-size: 24px; font-weight: 600; letter-spacing: 0.05em; color: var(--gp-primary); }

/* Homepage product carousels (Best Sellers, New Arrivals, Watches, Belts,
   Flash Sale, Featured — shop/category archive pages use the grid above,
   unaffected). Horizontal scroll-snap, touch-friendly, no JS required. */
.gp-product-carousel.products {
	display: flex !important;
	grid-template-columns: none !important;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	gap: 20px !important;
	padding: 4px 4px 16px !important;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
}
.gp-product-carousel.products li.product {
	flex: 0 0 auto;
	width: 200px;
	scroll-snap-align: start;
}
@media (min-width: 600px) { .gp-product-carousel.products li.product { width: 240px; } }
@media (min-width: 960px) { .gp-product-carousel.products li.product { width: 270px; } }

.gp-collections__grid--carousel {
	display: flex;
	grid-template-columns: none;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	padding-bottom: 12px;
	-webkit-overflow-scrolling: touch;
}
.gp-collections__grid--carousel .gp-collection-card { flex: 0 0 auto; width: 220px; scroll-snap-align: start; }
@media (min-width: 600px) { .gp-collections__grid--carousel .gp-collection-card { width: 260px; } }
@media (min-width: 960px) { .gp-collections__grid--carousel .gp-collection-card { width: 300px; } }

/* ---------------------------------------------------------------------
   Collections / Categories
   ------------------------------------------------------------------- */
.gp-collections__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 24px; }
.gp-collection-card { position: relative; display: block; border-radius: var(--gp-radius-lg); overflow: hidden; aspect-ratio: 4/5; }
.gp-collection-card img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease; }
@media (hover: hover) and (pointer: fine) {
	.gp-collection-card:hover img { transform: scale(1.06); }
}
.gp-collection-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 40%, rgba(15,23,42,0.75)); }
.gp-collection-card__label { position: absolute; left: 20px; bottom: 20px; z-index: 2; color: #fff; font-family: var(--gp-font-heading); font-size: 22px; }

/* Shop by Category — Watches / Belts image tiles */
.gp-shop-categories__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (min-width: 700px) { .gp-shop-categories__grid { gap: 28px; } }
.gp-shop-category-card {
	position: relative; display: block; border-radius: var(--gp-radius-lg); overflow: hidden;
	aspect-ratio: 3/4; background: linear-gradient(160deg, var(--gp-light-gray), #e2e8f0);
	transition: box-shadow 0.35s ease, transform 0.35s ease;
}
@media (min-width: 700px) { .gp-shop-category-card { aspect-ratio: 4/5; } }
@media (hover: hover) and (pointer: fine) {
	.gp-shop-category-card:hover { transform: translateY(-4px); box-shadow: var(--gp-shadow-lift); }
	.gp-shop-category-card:hover .gp-shop-category-card__media img { transform: scale(1.08); }
	.gp-shop-category-card:hover .gp-shop-category-card__cta { background: var(--gp-accent); color: var(--gp-primary); }
}
.gp-shop-category-card__media { position: absolute; inset: 0; display: block; }
.gp-shop-category-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease; }
.gp-shop-category-card__placeholder { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; background: linear-gradient(160deg, #EFE6D3, var(--gp-light-gray)); }
.gp-shop-category-card__placeholder-icon { font-size: 56px; opacity: 0.35; }
.gp-shop-category-card__overlay { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(15,23,42,0) 35%, rgba(15,23,42,0.78) 100%); }
.gp-shop-category-card__body { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: 18px; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
@media (min-width: 700px) { .gp-shop-category-card__body { padding: 28px; gap: 14px; } }
.gp-shop-category-card__name { font-family: var(--gp-font-heading); font-size: clamp(20px, 4vw, 28px); color: #fff; line-height: 1.1; }
.gp-shop-category-card__cta {
	display: inline-flex; align-items: center; gap: 6px; background: rgba(255,255,255,0.94); color: var(--gp-primary);
	font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
	padding: 8px 14px; border-radius: 999px; transition: background-color 0.25s ease, color 0.25s ease;
}

.gp-categories__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 16px; }
.gp-category-chip { display: flex; flex-direction: column; gap: 6px; padding: 24px; background: #fff; border: 1px solid var(--gp-line); border-radius: var(--gp-radius-lg); transition: border-color 0.2s ease, transform 0.2s ease; }
@media (hover: hover) and (pointer: fine) {
	.gp-category-chip:hover { border-color: var(--gp-accent); transform: translateY(-3px); }
}
.gp-category-chip__name { font-family: var(--gp-font-heading); font-size: 20px; }
.gp-category-chip__count { font-size: 12px; opacity: 0.6; text-transform: uppercase; letter-spacing: 0.05em; }

/* ---------------------------------------------------------------------
   Lifestyle banners
   ------------------------------------------------------------------- */
.gp-lifestyle__grid { display: grid; grid-template-columns: 1fr 1fr; min-height: 420px; }
.gp-lifestyle__panel { position: relative; display: flex; align-items: flex-end; padding: 48px; background: linear-gradient(160deg, #EFE6D3, #F8FAFC); }
.gp-lifestyle__panel--alt { background: linear-gradient(160deg, #F1F0EC, #EEE8DD); }
.gp-lifestyle__text h3 { color: var(--gp-primary); font-size: clamp(24px, 3vw, 32px); margin-bottom: 20px; max-width: 320px; }

/* ---------------------------------------------------------------------
   Why choose us — 2x2 on mobile, one straight row of 4 on desktop, each
   icon sits in a 3D tilting badge (perspective + rotate on hover).
   ------------------------------------------------------------------- */
.gp-why-us__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; align-items: stretch; }
@media (min-width: 600px) { .gp-why-us__grid { gap: 24px; } }
@media (min-width: 960px) { .gp-why-us__grid { grid-template-columns: repeat(4, 1fr); gap: 28px; } }

.gp-why-us__card {
	background: #fff; border: 1px solid var(--gp-line); border-radius: var(--gp-radius-lg);
	padding: 28px 18px; text-align: center; transition: transform 0.35s cubic-bezier(0.16,1,0.3,1), box-shadow 0.35s ease, border-color 0.35s ease;
	display: flex; flex-direction: column; align-items: center;
}
@media (min-width: 700px) { .gp-why-us__card { padding: 36px 24px; } }
@media (hover: hover) and (pointer: fine) {
	.gp-why-us__card:hover { transform: translateY(-6px); box-shadow: var(--gp-shadow-lift); border-color: var(--gp-accent); }
}

.gp-why-us__icon-wrap {
	width: 64px; height: 64px; margin: 0 auto 18px; perspective: 600px;
	position: relative; transform-style: preserve-3d;
	transition: transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
	animation: gp-icon-float 3.6s ease-in-out infinite;
}
.gp-why-us__card:nth-child(2) .gp-why-us__icon-wrap { animation-delay: 0.3s; }
.gp-why-us__card:nth-child(3) .gp-why-us__icon-wrap { animation-delay: 0.6s; }
.gp-why-us__card:nth-child(4) .gp-why-us__icon-wrap { animation-delay: 0.9s; }
@keyframes gp-icon-float {
	0%, 100% { transform: translateY(0) rotateZ(0deg); }
	50% { transform: translateY(-6px) rotateZ(-4deg); }
}
.gp-why-us__icon-face {
	position: absolute; inset: 0; border-radius: 50%; display: flex; align-items: center; justify-content: center;
	backface-visibility: hidden; font-size: 26px;
}
.gp-why-us__icon-face--front {
	background: linear-gradient(150deg, var(--gp-light-gray), #EFE6D3);
	border: 1px solid var(--gp-line);
	box-shadow: inset 0 2px 4px rgba(255,255,255,0.6), 0 6px 16px rgba(15,23,42,0.06);
	animation: gp-icon-glow 3.6s ease-in-out infinite;
}
.gp-why-us__card:nth-child(2) .gp-why-us__icon-face--front { animation-delay: 0.3s; }
.gp-why-us__card:nth-child(3) .gp-why-us__icon-face--front { animation-delay: 0.6s; }
.gp-why-us__card:nth-child(4) .gp-why-us__icon-face--front { animation-delay: 0.9s; }
@keyframes gp-icon-glow {
	0%, 100% { box-shadow: inset 0 2px 4px rgba(255,255,255,0.6), 0 6px 16px rgba(15,23,42,0.06); }
	50% { box-shadow: inset 0 2px 4px rgba(255,255,255,0.6), 0 10px 26px rgba(212,175,55,0.28); }
}
.gp-why-us__icon-face--back {
	background: linear-gradient(150deg, var(--gp-accent), #c19f2e);
	color: #fff; transform: rotateY(180deg);
	box-shadow: 0 6px 20px rgba(212,175,55,0.4);
}
@media (hover: hover) and (pointer: fine) {
	.gp-why-us__card:hover .gp-why-us__icon-wrap { animation-play-state: paused; transform: rotateY(180deg); }
}
@media (prefers-reduced-motion: reduce) {
	.gp-why-us__icon-wrap, .gp-why-us__icon-face--front { animation: none; }
}
.gp-why-us__card h3 { font-size: 17px; margin-bottom: 6px; }
@media (min-width: 700px) { .gp-why-us__card h3 { font-size: 18px; } }
.gp-why-us__card p { font-size: 13px; opacity: 0.7; margin: 0; line-height: 1.5; }
@media (min-width: 700px) { .gp-why-us__card p { font-size: 14px; } }

/* ---------------------------------------------------------------------
   Brand story + counters
   ------------------------------------------------------------------- */
.gp-brand-story__inner { display: grid; grid-template-columns: 1fr; gap: 32px; align-items: center; }
@media (min-width: 860px) { .gp-brand-story__inner { grid-template-columns: 1fr 1fr; gap: 56px; } }
.gp-brand-story__frame { aspect-ratio: 4/5; border-radius: var(--gp-radius-lg); background: linear-gradient(160deg, var(--gp-light-gray), #e2e8f0); max-height: 460px; }
.gp-brand-story__lead { max-width: 480px; line-height: 1.75; font-size: 15.5px; opacity: 0.85; }
.gp-brand-story__stats { display: flex; gap: 40px; margin-top: 32px; flex-wrap: wrap; }
.gp-counter { display: flex; flex-direction: column; }
.gp-counter__num { font-family: var(--gp-font-heading); font-size: 36px; color: var(--gp-accent); font-weight: 600; }
.gp-counter__label { font-size: 12px; text-transform: uppercase; letter-spacing: 0.06em; opacity: 0.6; }

/* ---------------------------------------------------------------------
   Testimonials marquee
   ------------------------------------------------------------------- */
.gp-reviews__track { display: flex; gap: 24px; overflow-x: auto; padding: 8px 24px 24px; scroll-snap-type: x mandatory; }
.gp-review-card { flex: 0 0 320px; background: #fff; border: 1px solid var(--gp-line); border-radius: var(--gp-radius-lg); padding: 28px; scroll-snap-align: start; }
.gp-stars { color: var(--gp-accent); letter-spacing: 2px; }
.gp-review-card__text { font-style: italic; margin: 14px 0; }
.gp-review-card__author { font-weight: 600; margin: 0; }
.gp-review-card__author span { font-weight: 400; opacity: 0.6; }

/* ---------------------------------------------------------------------
   Instagram grid
   ------------------------------------------------------------------- */
.gp-instagram__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; }
.gp-instagram__item { position: relative; aspect-ratio: 1/1; overflow: hidden; border-radius: var(--gp-radius); }
.gp-instagram__item img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; }
.gp-instagram__item:hover img { transform: scale(1.08); }
.gp-instagram__icon { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 22px; background: rgba(15,23,42,0); opacity: 0; transition: opacity 0.2s ease, background-color 0.2s ease; }
.gp-instagram__item:hover .gp-instagram__icon { opacity: 1; background: rgba(15,23,42,0.35); }

/* ---------------------------------------------------------------------
   Newsletter
   ------------------------------------------------------------------- */
.gp-newsletter { background: linear-gradient(135deg, #FBF3DE, var(--gp-light-gray)); color: var(--gp-text); text-align: center; }
.gp-newsletter__inner { max-width: 560px; }
.gp-newsletter h2 { color: var(--gp-primary); }
.gp-newsletter p { opacity: 0.8; }
.gp-newsletter-form { display: flex; gap: 12px; margin-top: 24px; flex-wrap: wrap; justify-content: center; }
.gp-newsletter-form input { flex: 1; min-width: 220px; padding: 14px 18px; border-radius: var(--gp-radius); border: 1px solid var(--gp-line); background: #fff; color: var(--gp-text); }
.gp-newsletter-form input::placeholder { color: #94a3b8; }
.gp-newsletter-form__message { margin-top: 12px; font-size: 14px; min-height: 1.4em; }
.gp-newsletter-form__message.is-error { color: #B91C1C; }

/* ---------------------------------------------------------------------
   Footer — premium, mobile-first responsive columns + brand-colored
   social icons + a subtle gold glow along the top edge.
   ------------------------------------------------------------------- */
.gp-footer { position: relative; background: var(--gp-light-gray); color: var(--gp-text); padding-top: 64px; border-top: 1px solid var(--gp-line); overflow: hidden; }
.gp-footer__glow {
	position: absolute; top: 0; left: 50%; width: 60%; min-width: 480px; height: 1px; transform: translateX(-50%);
	background: linear-gradient(90deg, transparent, var(--gp-accent), transparent);
}
.gp-footer__top { display: grid; grid-template-columns: 1fr; gap: 40px; padding-bottom: 40px; }
@media (min-width: 640px) { .gp-footer__top { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 960px) { .gp-footer__top { grid-template-columns: 1.4fr repeat(4, 1fr); gap: 40px; } }
.gp-footer__brand { grid-column: 1 / -1; }
@media (min-width: 960px) { .gp-footer__brand { grid-column: auto; } }
.gp-footer .gp-logo__text { color: var(--gp-primary); }
.gp-footer__brand p { opacity: 0.75; font-size: 14px; margin-top: 16px; max-width: 320px; }

.gp-footer__social { display: flex; gap: 10px; margin-top: 22px; flex-wrap: wrap; }
.gp-footer__social-link {
	width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--gp-line);
	background: #fff; color: var(--gp-primary); display: flex; align-items: center; justify-content: center;
	transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease, transform 0.25s ease;
}
.gp-footer__social-link:hover { transform: translateY(-3px); border-color: transparent; color: #fff; box-shadow: var(--gp-shadow-soft); }
.gp-footer__social-link[data-platform="facebook"]:hover { background: #1877F2; }
.gp-footer__social-link[data-platform="instagram"]:hover { background: linear-gradient(135deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888); }
.gp-footer__social-link[data-platform="tiktok"]:hover { background: #010101; }
.gp-footer__social-link[data-platform="whatsapp"]:hover { background: #25D366; }
.gp-footer__social-link[data-platform="youtube"]:hover { background: #FF0000; }
.gp-footer__social-link[data-platform="twitter"]:hover { background: #000000; }
.gp-footer__social-link[data-platform="pinterest"]:hover { background: #E60023; }
.gp-footer__social-link[data-platform="linkedin"]:hover { background: #0A66C2; }

.gp-footer__col-title { color: var(--gp-primary); font-size: 13px; text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 18px; position: relative; padding-bottom: 10px; }
.gp-footer__col-title::after { content: ""; position: absolute; left: 0; bottom: 0; width: 28px; height: 2px; background: var(--gp-accent); }
.gp-footer__menu li, .gp-footer__col p { margin-bottom: 12px; font-size: 14px; opacity: 0.8; }
.gp-footer__menu a { transition: color 0.2s ease, padding-left 0.2s ease; display: inline-block; }
.gp-footer__menu a:hover { color: var(--gp-accent); padding-left: 4px; }
.gp-footer__contact a:hover { color: var(--gp-accent); }

.gp-footer__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px; border-top: 1px solid var(--gp-line); padding: 22px 24px; font-size: 13px; opacity: 0.75; }
.gp-payment-icons { display: flex; gap: 10px; flex-wrap: wrap; }
.gp-payment-icon { border: 1px solid var(--gp-line); color: var(--gp-text); border-radius: 3px; padding: 4px 10px; font-size: 11px; letter-spacing: 0.04em; opacity: 0.8; }

.gp-back-to-top {
	width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--gp-line); background: #fff;
	color: var(--gp-primary); display: flex; align-items: center; justify-content: center;
	transition: background-color 0.25s ease, color 0.25s ease, transform 0.25s ease;
}
.gp-back-to-top:hover { background: var(--gp-accent); transform: translateY(-3px); }

.gp-whatsapp-float {
	position: fixed; bottom: 24px; right: 24px; z-index: 850;
	width: 56px; height: 56px; border-radius: 50%; background: #25D366; color: #fff;
	display: flex; align-items: center; justify-content: center; box-shadow: var(--gp-shadow-lift);
	transition: transform 0.2s ease;
}
.gp-whatsapp-float:hover { transform: scale(1.08); }

/* ---------------------------------------------------------------------
   Breadcrumbs
   ------------------------------------------------------------------- */
.gp-breadcrumbs { font-size: 13px; opacity: 0.65; margin-bottom: 16px; display: flex; flex-wrap: wrap; gap: 6px; }
.gp-breadcrumbs a:hover { text-decoration: underline; }
.gp-breadcrumbs__sep { opacity: 0.5; }

/* ---------------------------------------------------------------------
   Page layout (blog/page/shop with sidebar)
   ------------------------------------------------------------------- */
.gp-page-layout { display: grid; grid-template-columns: 1fr; gap: 48px; padding: 56px 24px; }
.gp-page-layout__sidebar { display: none; }
.gp-page-title { font-size: clamp(28px, 4vw, 40px); }
.gp-archive-header { margin-bottom: 32px; }
.gp-blog-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 32px; }
.gp-post-card { border: 1px solid var(--gp-line); border-radius: var(--gp-radius-lg); overflow: hidden; }
.gp-post-card__media img { aspect-ratio: 4/3; object-fit: cover; }
.gp-post-card__body { padding: 24px; }
.gp-post-meta { font-size: 12px; text-transform: uppercase; letter-spacing: 0.05em; opacity: 0.55; margin-bottom: 10px; display: flex; gap: 12px; }
.gp-post-card__title { font-size: 20px; margin-bottom: 10px; }
.gp-single-post__thumb img { border-radius: var(--gp-radius-lg); margin-bottom: 32px; aspect-ratio: 16/9; object-fit: cover; }
.gp-single-post__content { max-width: 760px; line-height: 1.8; }
.gp-single-post__content img { border-radius: var(--gp-radius); }
.gp-empty-state, .gp-empty-note { text-align: center; padding: 48px 24px; opacity: 0.7; }

/* Widgets */
.gp-widget { margin-bottom: 32px; }
.gp-widget__title { font-size: 15px; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 16px; }

/* Woo layout */
.gp-woo-header { padding-top: 40px; }
.gp-woo-layout { display: grid; grid-template-columns: 1fr; gap: 40px; padding: 24px 24px 80px; }
.gp-archive-description { font-size: 14px; opacity: 0.7; max-width: 640px; margin-top: 8px; }

/* ---------------------------------------------------------------------
   Single product — TOTAL REBUILD (v1.9.0)
   One consolidated block, mobile-first base + a single desktop media
   query at the very end of this file. No duplicate selectors anywhere
   else in this stylesheet target .single-product/.sp-clean-gallery/
   .entry-summary layout — this is the only source of truth.
   ------------------------------------------------------------------- */
.single-product div.product {
	/* WooCommerce absolutely-positions the sale badge expecting this box
	   to be its positioning context. */
	position: relative;
	display: block;
	width: 100%;
	max-width: 100% !important;
	box-sizing: border-box !important;
	margin: 0 !important;
	padding: 16px;
}
.single-product span.onsale {
	position: absolute; top: 16px; left: 16px; z-index: 6;
	min-height: 0; min-width: 0; border-radius: 999px;
	background: var(--gp-primary); color: #fff;
	font-family: var(--gp-font-body); font-weight: 600;
	font-size: 12px; letter-spacing: 0.05em; text-transform: uppercase;
	line-height: 1; padding: 8px 16px; margin: 0;
}
.single-product div.product > .woocommerce-tabs,
.single-product div.product > .upsells.products,
.single-product div.product > .related.products { width: 100%; }

/* -----------------------------------------------------------------------
   Product image — one plain <img>, no slider, no flex swipe strip, no
   scroll-snap, no JS gallery init of any kind. */
.sp-clean-gallery {
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
	display: block !important;
	opacity: 1 !important;
	visibility: visible !important;
	min-height: 300px !important;
	text-align: center;
	background: var(--gp-light-gray);
	border-radius: var(--gp-radius-lg);
	overflow: hidden;
	margin-bottom: 20px;
}
.sp-clean-gallery img {
	width: 100% !important;
	max-width: 100% !important;
	height: auto !important;
	max-height: 500px !important;
	object-fit: contain !important;
	display: block !important;
	margin: 0 auto;
}

.summary.entry-summary .product_title { font-size: clamp(21px, 5.5vw, 36px); margin-bottom: 6px; line-height: 1.25; }
.summary.entry-summary .price { font-size: clamp(20px, 5vw, 24px); font-weight: 600; color: var(--gp-primary); margin: 10px 0; }
.summary.entry-summary .price del { opacity: 0.5; margin-right: 10px; font-size: 0.78em; }
.summary.entry-summary .price ins { text-decoration: none; color: var(--gp-accent); }
.summary.entry-summary .woocommerce-product-details__short-description { opacity: 0.8; margin-bottom: 16px; font-size: 14px; }

/* Social proof + urgency cues — sit directly under price, above the
   variations/Add to Cart form. Simple full-width blocks — inline-flex
   with long translated text was letting these push wider than their
   container and get cut off on narrow screens. */
.gp-viewers-badge {
	display: block; width: 100%; max-width: 100%; box-sizing: border-box; clear: both;
	font-size: 13px; font-weight: 600;
	color: #B45309; background: #FFFBEB; border: 1px solid #FDE68A;
	padding: 7px 14px; border-radius: var(--gp-radius); margin: 0 0 10px;
}
.gp-viewers-badge__icon { font-size: 15px; }

.gp-stock-urgency {
	display: block; width: 100%; max-width: 100%; box-sizing: border-box; clear: both;
	font-size: 13px; font-weight: 600;
	color: #B91C1C; background: #FEF2F2; border: 1px solid #FECACA;
	padding: 10px 14px; border-radius: var(--gp-radius); margin: 0 0 16px;
}
.gp-stock-urgency__icon { font-size: 15px; }

table.variations { width: 100%; margin-bottom: 16px; }
table.variations td { padding: 8px 0; }
table.variations label { font-weight: 600; font-size: 13px; text-transform: uppercase; letter-spacing: 0.04em; }
table.variations select { padding: 10px 14px; border-radius: var(--gp-radius); border: 1px solid var(--gp-line); min-width: 160px; }

.quantity input.qty { width: 100%; padding: 14px 12px; border: 1px solid var(--gp-line); border-radius: var(--gp-radius); text-align: center; font-size: 15px; }

/* ---------------------------------------------------------------------
   Shopify-style Add to Cart / Buy It Now action row.
   SIMPLE stacked layout: quantity + both CTAs in a single full-width
   column on every screen size (mobile and desktop) — no side-by-side
   flex-basis math that can wrap awkwardly on in-between viewports.
   ------------------------------------------------------------------- */
.summary.entry-summary form.cart {
	display: flex; flex-direction: column; align-items: stretch; gap: 12px;
	margin: 4px 0 0; width: 100%; max-width: 100%; box-sizing: border-box;
	overflow: hidden;
}
.summary.entry-summary form.cart .quantity { width: 100%; max-width: 100%; box-sizing: border-box; }
.summary.entry-summary form.cart .quantity .qty,
.summary.entry-summary form.cart input.qty {
	width: 100% !important; max-width: 100% !important; box-sizing: border-box !important;
	float: none !important; margin: 0 !important;
}
.summary.entry-summary form.cart .quantity,
.single_add_to_cart_button,
.gp-buy-now-btn { margin: 0 !important; float: none !important; }

.single_add_to_cart_button {
	position: relative;
	background: linear-gradient(135deg, var(--gp-accent), #E9C766) !important;
	border: none !important;
	width: 100% !important; max-width: 100% !important; box-sizing: border-box !important;
	padding: 17px 24px !important; border-radius: var(--gp-radius) !important;
	color: #ffffff !important; font-weight: bold !important; font-size: 16px !important;
	letter-spacing: 0.07em !important; text-transform: uppercase !important; text-align: center !important;
	box-shadow: 0 8px 24px rgba(212, 175, 55, 0.35);
	transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
	animation: gp-cta-pulse 2.6s ease-in-out infinite;
	display: block !important;
}
.single_add_to_cart_button:hover {
	background: linear-gradient(135deg, #E9C766, var(--gp-accent)) !important;
	color: #ffffff !important;
	transform: translateY(-2px);
	box-shadow: 0 12px 32px rgba(212, 175, 55, 0.48);
}
.single_add_to_cart_button:active { transform: translateY(0); }
@keyframes gp-cta-pulse {
	0%, 100% { box-shadow: 0 8px 24px rgba(212, 175, 55, 0.35), 0 0 0 0 rgba(212, 175, 55, 0.45); }
	50% { box-shadow: 0 8px 24px rgba(212, 175, 55, 0.35), 0 0 0 10px rgba(212, 175, 55, 0); }
}
@media (prefers-reduced-motion: reduce) {
	.single_add_to_cart_button { animation: none; }
}

.gp-buy-now-btn,
.buy_now_button {
	display: block !important;
	width: 100% !important; max-width: 100% !important; box-sizing: border-box !important;
	padding: 16px 24px; border-radius: var(--gp-radius);
	color: #ffffff !important; font-weight: bold !important; font-size: 16px !important;
	letter-spacing: 0.07em; text-transform: uppercase; text-align: center !important;
	background: var(--gp-primary); border: 1.5px solid var(--gp-primary);
	cursor: pointer;
	transition: transform 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease, color 0.25s ease;
}
.gp-buy-now-btn:hover, .buy_now_button:hover { background: #1E293B; border-color: #1E293B; transform: translateY(-2px); box-shadow: var(--gp-shadow-lift); }
.gp-buy-now-btn:active, .buy_now_button:active { transform: translateY(0); }

/* ---------------------------------------------------------------------
   Trust badges block — Free & Fast Shipping / 7-Day Exchange / COD /
   100% Original. Simple stacked full-width block, clears floats, never
   exceeds its container on desktop or mobile.
   ------------------------------------------------------------------- */
.gp-trust-block {
	width: 100% !important; max-width: 100% !important; box-sizing: border-box !important;
	clear: both !important; display: block !important;
	margin: 20px 0; padding: 16px; background: var(--gp-light-gray); border-radius: var(--gp-radius-lg);
}
.gp-trust-block__item { display: flex; align-items: center; gap: 10px; font-size: 13px; margin-bottom: 12px; }
.gp-trust-block__item:last-child { margin-bottom: 0; }
.gp-trust-block__icon { width: 36px; height: 36px; flex-shrink: 0; border-radius: 50%; background: #fff; border: 1px solid var(--gp-line); display: flex; align-items: center; justify-content: center; font-size: 16px; }
.gp-trust-block__item strong { display: block; font-size: 12.5px; line-height: 1.3; }
.gp-trust-block__item span { display: block; opacity: 0.65; font-size: 11.5px; line-height: 1.3; }
@media (min-width: 600px) {
	.gp-trust-block__item { display: inline-flex; width: 48%; margin-right: 2%; vertical-align: top; }
}
.gp-payment-icons { display: block; width: 100%; max-width: 100%; box-sizing: border-box; clear: both; margin-bottom: 24px; }
.gp-payment-icon { display: inline-block; margin-right: 8px; margin-bottom: 8px; }

/* Auto-sliding reviews (single product page only) */
.gp-reviews--auto .gp-reviews__marquee { overflow: hidden; }
.gp-reviews__track--auto {
	display: flex; gap: 24px; width: max-content;
	animation: gp-marquee 45s linear infinite;
}
.gp-reviews--auto:hover .gp-reviews__track--auto,
.gp-reviews__track--auto:focus-within { animation-play-state: paused; }
@keyframes gp-marquee {
	from { transform: translateX(0); }
	to { transform: translateX(-33.333%); }
}
@media (prefers-reduced-motion: reduce) {
	.gp-reviews__track--auto { animation: none; overflow-x: auto; }
}

.woocommerce-tabs ul.tabs { display: flex; gap: 8px; flex-wrap: wrap; border-bottom: 1px solid var(--gp-line); margin-bottom: 24px; padding: 0; }
.woocommerce-tabs ul.tabs li { list-style: none; }
.woocommerce-tabs ul.tabs li a { display: inline-block; padding: 12px 20px; font-weight: 600; font-size: 13px; text-transform: uppercase; letter-spacing: 0.04em; border-bottom: 2px solid transparent; }
.woocommerce-tabs ul.tabs li.active a { border-color: var(--gp-accent); color: var(--gp-accent); }
.woocommerce-Tabs-panel { max-width: 760px; line-height: 1.8; }
.gp-faq-tab p { margin-bottom: 14px; }

.gp-sticky-atc {
	position: fixed; left: 0; right: 0; bottom: -100px; z-index: 500;
	background: #fff; border-top: 1px solid var(--gp-line); box-shadow: 0 -6px 24px rgba(15,23,42,0.1);
	transition: bottom 0.3s ease;
}
.gp-sticky-atc.is-visible { bottom: 0; }
/* .gp-container already adds 24px of horizontal padding on its own — the
   old rule added another 24px on top of that (48px total each side),
   which is exactly what was squeezing the Add to Cart button off the
   edge of the screen on mobile. Vertical padding only here. */
.gp-sticky-atc__inner { display: flex; align-items: center; gap: 16px; padding: 12px 0; }
.gp-sticky-atc__inner img { border-radius: var(--gp-radius); flex-shrink: 0; }
.gp-sticky-atc__title { flex: 1; font-weight: 600; font-size: 14px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gp-sticky-atc__price { font-weight: 700; flex-shrink: 0; }
.gp-sticky-atc__cta { flex-shrink: 0; white-space: nowrap; }

@media (max-width: 480px) {
	.gp-sticky-atc__inner { gap: 10px; padding: 10px 0; }
	.gp-sticky-atc__inner img { width: 36px; height: 36px; }
	.gp-sticky-atc__title { display: none; }
	.gp-sticky-atc__price { font-size: 13px; }
	.gp-sticky-atc__cta { padding: 10px 16px !important; font-size: 12px; }
}

/* ---------------------------------------------------------------------
   Quick view modal + toast
   ------------------------------------------------------------------- */
/* Safety net: ANY element using the native `hidden` attribute must stay
   hidden even if a class on it also sets `display` for its visible state
   (author CSS normally overrides the browser's own [hidden]{display:none}
   rule, which is exactly what caused the Quick View modal to appear as an
   empty white box on load, un-closeable, before this fix). */
[hidden] { display: none !important; }

.gp-modal { position: fixed; inset: 0; z-index: 1200; display: flex; align-items: center; justify-content: center; padding: 24px; }
.gp-modal__overlay { position: absolute; inset: 0; background: rgba(15,23,42,0.6); }
.gp-modal__panel { position: relative; background: #fff; border-radius: var(--gp-radius-lg); max-width: 720px; width: 100%; max-height: 85vh; overflow-y: auto; padding: 32px; }
.gp-modal__close { position: absolute; top: 16px; right: 16px; font-size: 28px; line-height: 1; background: none; border: none; }
.gp-quick-view { display: grid; grid-template-columns: 1fr; gap: 24px; }
.gp-quick-view__media img { border-radius: var(--gp-radius-lg); aspect-ratio: 1/1; object-fit: cover; }
.gp-quick-view__title { font-size: 24px; }
.gp-quick-view__price { font-size: 20px; font-weight: 600; color: var(--gp-primary); margin-bottom: 12px; }

.gp-toast { position: fixed; bottom: 24px; left: 50%; transform: translate(-50%, 20px); background: var(--gp-primary); color: #fff; padding: 12px 24px; border-radius: 999px; font-size: 14px; opacity: 0; pointer-events: none; transition: opacity 0.25s ease, transform 0.25s ease; z-index: 1300; }
.gp-toast.is-visible { opacity: 1; transform: translate(-50%, 0); }

/* ---------------------------------------------------------------------
   Cart / Checkout / My Account (light styling only — no template overrides)
   ------------------------------------------------------------------- */
.woocommerce-cart table.cart, .woocommerce-checkout table.shop_table { width: 100%; border-collapse: collapse; }
.woocommerce-cart table.cart th, .woocommerce-cart table.cart td, table.shop_table th, table.shop_table td { padding: 16px 12px; border-bottom: 1px solid var(--gp-line); text-align: left; }
.woocommerce-cart table.cart img { border-radius: var(--gp-radius); width: 72px; height: auto; }
#coupon_code, .woocommerce-checkout input.input-text, .woocommerce-checkout select {
	padding: 12px 14px; border: 1px solid var(--gp-line); border-radius: var(--gp-radius); width: 100%;
}
.woocommerce-checkout label { font-size: 14px; font-weight: 600; margin-bottom: 4px; display: inline-block; }
.wc-proceed-to-checkout .checkout-button, #place_order, input.button, button.button {
	background: var(--gp-primary); color: #fff; border: none; border-radius: var(--gp-radius);
	padding: 14px 28px; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; font-size: 13px;
}
.wc-proceed-to-checkout .checkout-button:hover, #place_order:hover { background: var(--gp-accent); color: var(--gp-primary); }
.woocommerce-MyAccount-navigation ul { display: flex; flex-direction: column; gap: 4px; }
.woocommerce-MyAccount-navigation a { display: block; padding: 12px 16px; border-radius: var(--gp-radius); }
.woocommerce-MyAccount-navigation li.is-active a { background: var(--gp-primary); color: #fff; }
.woocommerce-MyAccount-content { margin-top: 24px; }

/* ---------------------------------------------------------------------
   404
   ------------------------------------------------------------------- */
.gp-404 { text-align: center; padding: 100px 24px; }
.gp-404 h1 { font-size: clamp(80px, 14vw, 160px); color: var(--gp-accent); margin-bottom: 0; }
.gp-404__heading { font-size: 24px; font-family: var(--gp-font-heading); }
.gp-404 .gp-btn { margin: 8px; }
.gp-404__search { max-width: 420px; margin: 32px auto 0; }
.gp-404__search .search-form { display: flex; gap: 10px; }
.gp-404__search input[type="search"] { flex: 1; padding: 12px 16px; border: 1px solid var(--gp-line); border-radius: var(--gp-radius); }
.gp-404__search button { background: var(--gp-primary); color: #fff; border: none; padding: 12px 20px; border-radius: var(--gp-radius); }

/* ---------------------------------------------------------------------
   Comments
   ------------------------------------------------------------------- */
.gp-comments { margin-top: 56px; max-width: 760px; }
.gp-comment-list .comment-body { border: 1px solid var(--gp-line); border-radius: var(--gp-radius-lg); padding: 20px; margin-bottom: 16px; }
.gp-comment-list ol.children { padding-left: 32px; }
.comment-form input, .comment-form textarea { width: 100%; padding: 12px 14px; border: 1px solid var(--gp-line); border-radius: var(--gp-radius); margin-bottom: 16px; }

/* ---------------------------------------------------------------------
   MOBILE SPACING — single product page (<=768px)
   Tightens padding/margin on the product page flow (breadcrumb →
   gallery → title → price → urgency → CTAs → trust badges → tabs →
   related products) for a ~360–430px viewport. Layout width/columns are
   handled separately, in the single clean responsive block at the end
   of this file.
   ------------------------------------------------------------------- */
@media (max-width: 768px) {
	.gp-woo-header { padding-top: 14px; }
	.gp-woo-layout { gap: 16px; padding: 0 12px 40px; }
	.gp-breadcrumbs { margin-bottom: 10px; font-size: 12px; }

	.summary.entry-summary .product_title { margin-bottom: 4px; }
	.summary.entry-summary .price { margin: 6px 0; }
	.summary.entry-summary .woocommerce-product-details__short-description { margin-bottom: 12px; }

	.gp-viewers-badge { margin-bottom: 8px; font-size: 12.5px; }
	.gp-stock-urgency { margin-bottom: 12px; font-size: 12.5px; }
	.gp-trust-block { margin: 16px 0; }
	.gp-payment-icons { margin-bottom: 16px; }

	.woocommerce-tabs { margin-top: 8px; }
	.woocommerce-tabs ul.tabs { margin-bottom: 16px; gap: 4px; }
	.woocommerce-tabs ul.tabs li a { padding: 10px 14px; font-size: 12px; }
	.woocommerce-Tabs-panel { max-width: 100%; }

	.related.products, .upsells.products { margin-top: 36px; padding-top: 28px; }
	.related.products > h2, .upsells.products > h2 { margin-bottom: 20px; }

	.gp-recently-viewed { padding: 32px 0 !important; }
	.gp-comments { margin-top: 32px; }
}

/* ---------------------------------------------------------------------
   Responsive breakpoints (mobile-first: base styles above are mobile,
   these progressively add desktop layout)
   ------------------------------------------------------------------- */
@media (min-width: 700px) {
	.gp-lifestyle__panel { padding: 64px; }
}

@media (min-width: 860px) {
	.gp-page-layout--full .gp-page-layout__main { max-width: 820px; margin: 0 auto; }
}

@media (min-width: 960px) {
	.gp-primary-nav { display: block; }
	.gp-menu-toggle { display: none; }
	.gp-header__actions .gp-search-toggle { order: -1; }

	.gp-page-layout { grid-template-columns: 2.4fr 1fr; padding: 72px 24px; }
	.gp-page-layout__sidebar { display: block; }
	.gp-woo-layout--with-sidebar { grid-template-columns: 2.4fr 1fr; align-items: start; }

	.gp-quick-view { grid-template-columns: 1fr 1.2fr; }
}

@media (min-width: 1100px) {
	.gp-woo-layout:not(.gp-woo-layout--with-sidebar) { grid-template-columns: 1fr; }
}

/* =========================================================================
   SINGLE PRODUCT — RESPONSIVE LAYOUT (v1.9.2)
   The only place in this file that sets .single-product div.product /
   .sp-clean-gallery / .entry-summary layout width or display. Comes
   last so nothing earlier can fight it. Mobile styles first (this
   theme is mobile-first), desktop override after.
   ========================================================================= */
@media (max-width: 768px) {
	html, body { overflow-x: hidden !important; width: 100% !important; }
	.single-product div.product { display: block !important; width: 100% !important; padding: 10px !important; }
	.single-product .sp-clean-gallery {
		width: 100% !important; max-width: 100% !important;
		min-height: 300px !important; display: block !important;
	}
	.single-product .entry-summary { width: 100% !important; max-width: 100% !important; }
	.single-product .entry-summary * { box-sizing: border-box !important; word-break: break-word !important; }
}

@media (min-width: 769px) {
	.single-product div.product {
		display: flex !important;
		flex-direction: row !important;
		flex-wrap: wrap !important;
		justify-content: space-between !important;
		/* FIX: this was the real cause of the huge blank gap under the
		   product image on desktop. Flex items default to
		   align-items: stretch, so with no value set here the shorter
		   gallery column was being force-stretched to match the height
		   of the (taller, badge/button-heavy) summary column — leaving
		   mostly-empty near-white space below the actual image.
		   flex-start lets each column size to its own content. */
		align-items: flex-start !important;
		gap: 30px !important;
		max-width: 1200px !important;
		margin: 30px auto 0 auto !important;
		padding: 0 15px !important;
	}
	.single-product .sp-clean-gallery {
		width: 48% !important;
		flex: 0 0 48% !important;
		max-width: 48% !important;
		position: relative !important;
		left: 0 !important;
		margin-bottom: 0;
	}
	.single-product .entry-summary { width: 48% !important; flex: 0 0 48% !important; max-width: 48% !important; }
	/* Tabs/related/upsells still need their own full-width row below the
	   48%/48% pair. */
	.single-product div.product > .woocommerce-tabs,
	.single-product div.product > .upsells.products,
	.single-product div.product > .related.products {
		flex: 0 0 100% !important;
		max-width: 100% !important;
	}
}

/* Overflow protection: nothing inside the summary column — badges,
   prices, trust icons, buttons — can push past the column edge, on any
   screen size. */
.single-product div.product,
.single-product .entry-summary,
.single-product .entry-summary * {
	max-width: 100% !important;
	box-sizing: border-box !important;
	word-wrap: break-word !important;
}

/* Related products — simple flex grid per spec (2-up on mobile, 4-up on
   desktop, using calc() to size around the gap exactly). This is the
   ONLY .related.products ul.products rule in the file. */
.related.products ul.products,
.upsells.products ul.products {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 15px !important;
	padding: 0 !important;
	list-style: none !important;
}
.related.products ul.products li.product,
.upsells.products ul.products li.product {
	flex: 0 0 calc(50% - 10px) !important;
	max-width: calc(50% - 10px) !important;
	box-sizing: border-box !important;
}
@media (min-width: 769px) {
	.related.products ul.products li.product,
	.upsells.products ul.products li.product {
		flex: 0 0 calc(25% - 12px) !important;
		max-width: calc(25% - 12px) !important;
	}
}