/**
 * Hydo Theme — Custom Styles
 * Murataj & Son Extra Virgin Olive Oil
 */

/* ========================================
   Header
   ======================================== */

.hydo-top-bar {
	position: relative;
	z-index: 100;
}

.hydo-header {
	position: sticky;
	top: 0;
	z-index: 99;
	backdrop-filter: blur(0px);
	-webkit-backdrop-filter: blur(0px);
	transition: box-shadow 0.4s cubic-bezier(0.16, 1, 0.3, 1),
	            backdrop-filter 0.4s cubic-bezier(0.16, 1, 0.3, 1),
	            background-color 0.4s cubic-bezier(0.16, 1, 0.3, 1);
	will-change: backdrop-filter;
	contain: layout style;
}

.hydo-header.is-scrolled {
	box-shadow: 0 2px 20px rgba(44, 62, 31, 0.1);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
}

/* Logo icon */
.hydo-logo-icon img {
	border-radius: 0;
}

/* Navigation */
.hydo-nav .wp-block-navigation-item a {
	position: relative;
	padding-bottom: 4px;
}

.hydo-nav .wp-block-navigation-item a::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 0;
	height: 2px;
	background-color: #C5A55A;
	transition: width 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.hydo-nav .wp-block-navigation-item a:hover::after,
.hydo-nav .wp-block-navigation-item.current-menu-item a::after {
	width: 100%;
}

/* ========================================
   Buttons
   ======================================== */

.wp-block-button__link {
	transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.hydo-btn-primary .wp-block-button__link:hover {
	background-color: #2C3E1F !important;
	border-color: #2C3E1F !important;
}

.hydo-btn-outline .wp-block-button__link:hover {
	background-color: #C5A55A !important;
	border-color: #C5A55A !important;
	color: #FEFCF7 !important;
}

/* ========================================
   Product Cards
   ======================================== */

.hydo-product-card {
	transition: border-color 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.hydo-product-card:hover {
	border-color: #C5A55A !important;
}

.hydo-product-img img {
	object-fit: contain;
}

/* Product card price */
.hydo-product-price {
	font-family: 'Cormorant Garamond', Georgia, serif;
	font-size: 1.5rem;
	font-weight: 400;
}

/* ========================================
   Footer
   ======================================== */

.hydo-footer a {
	color: #D4BB7C;
	text-decoration: none;
	transition: color 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.hydo-footer a:hover {
	color: #C5A55A;
}

.hydo-footer-links {
	list-style: none;
}

.hydo-footer-links li a {
	color: #FAF6ED;
	text-decoration: none;
	transition: color 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.hydo-footer-links li a:hover {
	color: #C5A55A;
}

/* ========================================
   Links — Gold underline animation
   ======================================== */

.wp-block-post-content a:not(.wp-block-button__link) {
	text-decoration: none;
	background-image: linear-gradient(#C5A55A, #C5A55A);
	background-size: 0% 1px;
	background-repeat: no-repeat;
	background-position: left bottom;
	transition: background-size 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.wp-block-post-content a:not(.wp-block-button__link):hover {
	background-size: 100% 1px;
}

/* ========================================
   WooCommerce Overrides (legacy fallback)
   ======================================== */

/* Product cards */
.woocommerce ul.products li.product {
	border: 1px solid #D4BB7C;
	padding: 1.5rem;
	transition: border-color 0.4s cubic-bezier(0.16, 1, 0.3, 1);
	background: #FEFCF7;
}

.woocommerce ul.products li.product:hover {
	border-color: #C5A55A;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-family: "Cormorant Garamond", Georgia, serif;
	font-size: 1.3rem;
	color: #2C3E1F;
}

.woocommerce ul.products li.product .price {
	font-family: "Cormorant Garamond", Georgia, serif;
	color: #C5A55A;
	font-weight: 400;
	font-size: 1.4rem;
}

/* Add to cart buttons */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
	background-color: #C5A55A;
	color: #FEFCF7;
	font-family: "Montserrat", sans-serif;
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	border: none;
	border-radius: 0;
	padding: 0.75rem 1.5rem;
	transition: background-color 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover {
	background-color: #2C3E1F;
	color: #FEFCF7;
}

/* Alt buttons */
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
	background-color: #2C3E1F;
}

.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover {
	background-color: #C5A55A;
}

/* Sale badge */
.woocommerce span.onsale {
	background-color: #C5A55A;
	color: #FEFCF7;
	font-family: "Montserrat", sans-serif;
	font-size: 0.7rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

/* Star rating */
.woocommerce .star-rating span::before {
	color: #C5A55A;
}

/* Single product */
.woocommerce div.product .product_title {
	font-family: "Cormorant Garamond", Georgia, serif;
	color: #2C3E1F;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
	color: #2C3E1F;
	border-bottom-color: #C5A55A;
}

/* Cart & Checkout */
.woocommerce table.shop_table {
	border-color: #D4BB7C;
}

.woocommerce table.shop_table th {
	font-family: "Montserrat", sans-serif;
	font-size: 0.8rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #2C3E1F;
}

.woocommerce-checkout #payment {
	background: #FEFCF7;
	border-color: #D4BB7C;
}

/* Breadcrumbs */
.woocommerce .woocommerce-breadcrumb {
	font-family: "Montserrat", sans-serif;
	font-size: 0.75rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #4A6332;
}

.woocommerce .woocommerce-breadcrumb a {
	color: #C5A55A;
}

/* Notices */
.woocommerce .woocommerce-message {
	border-top-color: #C5A55A;
}

.woocommerce .woocommerce-info {
	border-top-color: #4A6332;
}

/* ========================================
   Shop Page Header
   ======================================== */

.hydo-shop-header {
	text-align: center;
	margin-bottom: clamp(40px, 6vw, 80px);
}

.hydo-shop-eyebrow {
	font-family: 'Montserrat', sans-serif;
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: #C5A55A;
	margin-bottom: 0.5rem;
}

.hydo-shop-title {
	font-family: 'Cormorant Garamond', Georgia, serif;
	font-size: clamp(2rem, 4vw, 3rem);
	font-weight: 400;
	color: #1a2612;
	letter-spacing: -0.02em;
}

/* ========================================
   Scroll Reveal Animations
   ======================================== */

.reveal {
	opacity: 0;
	transform: translateY(30px);
	transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
	            transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal.is-visible {
	opacity: 1;
	transform: translateY(0);
}

/* Stagger children */
.stagger-children.is-visible > .wp-block-column:nth-child(1) { transition-delay: 0s; }
.stagger-children.is-visible > .wp-block-column:nth-child(2) { transition-delay: 0.1s; }
.stagger-children.is-visible > .wp-block-column:nth-child(3) { transition-delay: 0.2s; }
.stagger-children.is-visible > .wp-block-column:nth-child(4) { transition-delay: 0.3s; }

.stagger-children > .wp-block-column {
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1),
	            transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.stagger-children.is-visible > .wp-block-column {
	opacity: 1;
	transform: translateY(0);
}

/* Anchor scroll offset */
[id] {
	scroll-margin-top: 100px;
}

/* ========================================
   Layout Containment — Reduce Forced Reflow
   ======================================== */

/* Skip rendering of off-screen sections until scrolled into view.
   contain-intrinsic-block-size gives the browser a height estimate
   so layout doesn't shift when the content paints. */
.reveal {
	content-visibility: auto;
	contain-intrinsic-block-size: auto 400px;
}

/* ========================================
   Quality Promise Icons
   ======================================== */

.hydo-quality-icon {
	text-align: center;
	margin-bottom: 1rem;
}

.hydo-quality-icon svg {
	display: inline-block;
}

/* ========================================
   Newsletter Form
   ======================================== */

.hydo-newsletter-form {
	max-width: 480px;
	margin: 0 auto;
}

.hydo-newsletter-field {
	display: flex;
	gap: 0;
}

.hydo-newsletter-field input[type="email"] {
	flex: 1;
	font-family: 'Montserrat', sans-serif;
	font-size: 0.9rem;
	padding: 0.85rem 1.25rem;
	border: 1px solid rgba(197, 165, 90, 0.4);
	border-right: none;
	background: rgba(255, 255, 255, 0.08);
	color: #FDFBF7;
	outline: none;
	transition: border-color 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.hydo-newsletter-field input[type="email"]::placeholder {
	color: rgba(212, 187, 122, 0.6);
}

.hydo-newsletter-field input[type="email"]:focus {
	border-color: #C5A55A;
}

.hydo-newsletter-field button {
	font-family: 'Montserrat', sans-serif;
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	background-color: #C5A55A;
	color: #FDFBF7;
	border: 1px solid #C5A55A;
	padding: 0.85rem 1.5rem;
	cursor: pointer;
	transition: background-color 0.4s cubic-bezier(0.16, 1, 0.3, 1);
	white-space: nowrap;
}

.hydo-newsletter-field button:hover {
	background-color: #a88b3d;
}

/* ========================================
   Hero Enhancements
   ======================================== */

.hydo-hero-olive-icon {
	text-align: center;
	margin-bottom: 1.5rem;
}

.hydo-hero-olive-icon svg {
	display: inline-block;
	opacity: 0.7;
}

.hydo-scroll-indicator {
	position: absolute;
	bottom: 2rem;
	left: 50%;
	transform: translateX(-50%);
	text-align: center;
}

.hydo-scroll-indicator span {
	display: block;
	width: 1px;
	height: 40px;
	background: linear-gradient(to bottom, rgba(197, 165, 90, 0.6), transparent);
	margin: 0.5rem auto 0;
	animation: hydo-scroll-line 2s cubic-bezier(0.16, 1, 0.3, 1) infinite;
}

@keyframes hydo-scroll-line {
	0% { opacity: 0; transform: scaleY(0); transform-origin: top; }
	40% { opacity: 1; transform: scaleY(1); transform-origin: top; }
	60% { opacity: 1; transform: scaleY(1); transform-origin: bottom; }
	100% { opacity: 0; transform: scaleY(0); transform-origin: bottom; }
}

/* ========================================
   Mobile Menu — Body Scroll Lock
   ======================================== */

body.menu-open {
	overflow: hidden;
}

/* ========================================
   Responsive
   ======================================== */

@media (max-width: 781px) {
	.wp-block-site-title,
	.wp-block-site-title a {
		font-size: 1.1rem !important;
		line-height: 1.3 !important;
	}

	/* Hide top announcement bar on mobile — saves vertical space */
	.hydo-top-bar {
		display: none !important;
	}

	/* Mobile header — single compact row */
	.hydo-header {
		padding-top: 0.5rem !important;
		padding-bottom: 0.5rem !important;
	}

	.hydo-header > .wp-block-group {
		flex-wrap: nowrap !important;
		align-items: center !important;
		gap: 0.5rem !important;
	}

	/* Compact logo group */
	.hydo-header .wp-block-site-logo {
		width: 28px !important;
		min-width: 28px;
	}

	.hydo-header .wp-block-site-logo img {
		width: 28px !important;
		height: 28px !important;
	}

	/* Truncate site title to one line */
	.hydo-header .wp-block-site-title,
	.hydo-header .wp-block-site-title a {
		font-size: 0.95rem !important;
		white-space: nowrap !important;
		overflow: hidden !important;
		text-overflow: ellipsis !important;
		max-width: 180px;
	}

	/* Hide subtitle on mobile */
	.hydo-header .has-olive-mid-color {
		display: none !important;
	}

	/* Nav / hamburger / icons stay right */
	.hydo-header .hydo-nav {
		margin-left: auto !important;
	}

	/* Compact WooCommerce account/cart icons in header */
	.hydo-header .wp-block-woocommerce-customer-account,
	.hydo-header .wp-block-woocommerce-mini-cart {
		margin: 0 !important;
		padding: 0 !important;
	}

	.hydo-product-card {
		margin-bottom: 1.5rem;
	}

	.hydo-footer .wp-block-columns {
		gap: 2rem;
	}

	.hydo-newsletter-field {
		flex-direction: column;
	}

	.hydo-newsletter-field input[type="email"] {
		border-right: 1px solid rgba(197, 165, 90, 0.4);
	}

	.hydo-newsletter-field button {
		width: 100%;
	}

	/* --- Mobile Navigation Overlay --- */
	.wp-block-navigation__responsive-container.is-menu-open {
		position: fixed !important;
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		bottom: 0 !important;
		width: 100vw !important;
		height: 100vh !important;
		max-width: 100vw !important;
		max-height: 100vh !important;
		z-index: 9999 !important;
		padding: 5rem 2rem 2rem !important;
		overflow-y: auto !important;
		flex-direction: column !important;
		align-items: flex-start !important;
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
		width: 100% !important;
		max-width: 100% !important;
		flex-direction: column !important;
		align-items: flex-start !important;
		gap: 0 !important;
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
		width: 100% !important;
		border-bottom: 1px solid rgba(197, 165, 90, 0.2);
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a {
		font-size: 1.2rem !important;
		padding: 1rem 0 !important;
		min-height: 48px;
		display: flex;
		align-items: center;
		width: 100%;
	}

	/* Close button inside overlay */
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
		position: fixed !important;
		top: 1rem !important;
		right: 1.5rem !important;
		z-index: 10000 !important;
		min-width: 48px;
		min-height: 48px;
	}

	/* Hamburger button tap target */
	.wp-block-navigation__responsive-container-open {
		min-width: 48px;
		min-height: 48px;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	/* --- Hero Section Mobile --- */
	.wp-block-cover {
		min-height: 85vh !important;
	}

	.wp-block-cover .wp-block-cover__inner-container {
		padding-left: 1.25rem;
		padding-right: 1.25rem;
	}

	.wp-block-cover .wp-block-heading {
		font-size: clamp(2rem, 8vw, 3rem) !important;
	}

	/* Hero CTAs stack on mobile */
	.wp-block-cover .wp-block-buttons {
		flex-direction: column;
		gap: 0.75rem;
		width: 100%;
	}

	.wp-block-cover .wp-block-button {
		width: 100%;
	}

	.wp-block-cover .wp-block-button__link {
		width: 100%;
		text-align: center;
		min-height: 48px;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	/* Hide scroll indicator on mobile */
	.hydo-scroll-indicator {
		display: none;
	}

	/* --- Font sizes for mobile reading --- */
	.wp-block-post-content,
	.entry-content,
	.woocommerce div.product .woocommerce-product-details__short-description {
		font-size: 1rem;
		line-height: 1.75;
	}

	/* --- 44px minimum tap targets --- */
	.wp-block-button__link,
	.woocommerce a.button,
	.woocommerce button.button,
	.woocommerce input.button {
		min-height: 48px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		padding: 0.85rem 1.5rem;
	}

	a,
	button {
		min-height: 44px;
		min-width: 44px;
	}

	/* --- Reduce wasteful whitespace on mobile --- */
	.wp-block-group {
		padding-left: clamp(1rem, 4vw, 1.5rem);
		padding-right: clamp(1rem, 4vw, 1.5rem);
	}

	/* Sections: tighter vertical padding on mobile */
	section.wp-block-group,
	.wp-block-cover {
		padding-top: clamp(40px, 8vw, 80px) !important;
		padding-bottom: clamp(40px, 8vw, 80px) !important;
	}

	/* --- Footer mobile spacing --- */
	.hydo-footer {
		padding: 40px 1.25rem 30px !important;
	}
}

/* Small phones */
@media (max-width: 480px) {
	.hydo-header .wp-block-site-title,
	.hydo-header .wp-block-site-title a {
		font-size: 0.85rem !important;
		max-width: 140px;
	}

	.wp-block-cover .wp-block-heading {
		font-size: clamp(1.8rem, 7vw, 2.5rem) !important;
	}
}

/* ========================================
   Accessibility
   ======================================== */

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
	}

	html {
		scroll-behavior: auto;
	}

	.reveal {
		opacity: 1;
		transform: none;
	}

	.stagger-children > .wp-block-column {
		opacity: 1;
		transform: none;
	}
}

/* High contrast adjustments */
@media (prefers-contrast: high) {
	.hydo-product-card {
		border-width: 2px !important;
	}

	.hydo-nav .wp-block-navigation-item a::after {
		height: 3px;
	}
}