/* =============================================================================
   Home page — mobile UX  (≤ 767 px)
   Template: home-new-may-2026.php
   Load order: last of the home stylesheets, highest specificity wins.
   Desktop (≥ 768 px): untouched — all rules are inside max-width queries.
   ============================================================================= */

/* ─── 0. Global page shell ──────────────────────────────────────────────────── */
@media (max-width: 767px) {

	body.page-template-home-new-may-2026 {
		-webkit-text-size-adjust: 100%;
	}

	body.page-template-home-new-may-2026 .preveda-page-content {
		overflow-x: hidden;
	}

	/* Consistent wrapper side-padding for every section */
	body.page-template-home-new-may-2026 .preveda-page-content .wrapper,
	body.page-template-home-new-may-2026 .container {
		padding-left:  max(16px, env(safe-area-inset-left,  0px));
		padding-right: max(16px, env(safe-area-inset-right, 0px));
		box-sizing: border-box;
		width: 100%;
		max-width: 100%;
	}

	/* ─── 1. HERO SLIDER ──────────────────────────────────────── */
	body.page-template-home-new-may-2026 .site-header {
		position: relative !important;
	}

	body.page-template-home-new-may-2026 .hero-slider-wrap {
		height: min(clamp(300px, calc(100vw * 0.85), 420px), 56vh) !important;
	}

	body.page-template-home-new-may-2026 .hero-slider,
	body.page-template-home-new-may-2026 .hero-slider .slick-list,
	body.page-template-home-new-may-2026 .hero-slider .slick-track,
	body.page-template-home-new-may-2026 .hero-slider .slick-slide,
	body.page-template-home-new-may-2026 .hero-slider .slick-slide > div,
	body.page-template-home-new-may-2026 .hero-slide {
		height: 100% !important;
		min-height: inherit;
		max-height: inherit;
	}

	/* Bottom overlay on mobile — text sits over the lower area */
	body.page-template-home-new-may-2026 .hero-slide:not(.hero-slide--reverse)::after {
		display: block !important;
		content: '';
		position: absolute;
		inset: 0;
		z-index: 1;
		pointer-events: none;
		background: linear-gradient(
			0deg,
			rgba(0, 0, 0, 0.78) 0%,
			rgba(0, 0, 0, 0.48) 42%,
			rgba(0, 0, 0, 0.14) 68%,
			transparent 85%
		) !important;
	}

	body.page-template-home-new-may-2026 .hero-slide--reverse::after {
		display: none !important;
	}

	body.page-template-home-new-may-2026 .hero-slide__content,
	body.page-template-home-new-may-2026 .hero-slide--reverse .hero-slide__content {
		position: absolute !important;
		left: 0 !important;
		right: 0 !important;
		top: auto !important;
		bottom: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
		padding: 0 max(18px, env(safe-area-inset-left, 0px)) 56px !important;
		box-sizing: border-box;
		justify-content: flex-end !important;
		align-items: flex-start !important;
		text-align: left !important;
	}

	body.page-template-home-new-may-2026 .hero-slide__label {
		font-size: 9px;
		letter-spacing: 0.12em;
		margin-bottom: 8px;
	}

	body.page-template-home-new-may-2026 .hero-slide__title {
		font-size: clamp(1.3rem, 5.8vw, 1.65rem);
		line-height: 1.2;
		margin: 0 0 10px;
		font-weight: 800;
	}

	body.page-template-home-new-may-2026 .hero-slide__sub {
		font-size: 0.8125rem;
		line-height: 1.5;
		margin: 0 0 16px;
		display: -webkit-box;
		-webkit-line-clamp: 3;
		-webkit-box-orient: vertical;
		overflow: hidden;
		opacity: 0.9;
	}

	body.page-template-home-new-may-2026 .hero-slide__actions {
		flex-direction: row;
		flex-wrap: wrap;
		gap: 8px;
		width: 100%;
	}

	body.page-template-home-new-may-2026 .hero-btn {
		flex: 1 1 calc(50% - 4px);
		min-width: 130px;
		min-height: 48px;
		font-size: 0.8125rem;
		padding: 12px 14px;
		justify-content: center;
		text-align: center;
		box-sizing: border-box;
		white-space: nowrap;
	}

	body.page-template-home-new-may-2026 .hero-dots {
		bottom: 12px;
		z-index: 12;
	}

	body.page-template-home-new-may-2026 .hero-progress {
		height: 3px;
		bottom: 0;
	}

	/* ─── 2. TRUST STATS + BRAND LOGOS ───────────────────────── */
	body.page-template-home-new-may-2026 .trust-stats {
		padding: 0;
	}

	body.page-template-home-new-may-2026 .trust-stats > .wrapper.trust-stats__inner {
		display: grid !important;
		grid-template-columns: 1fr 1fr;
		grid-template-rows: auto auto;
		gap: 0;
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	body.page-template-home-new-may-2026 .trust-stat {
		flex: none !important;
		width: 100%;
		min-width: 0;
		min-height: 80px;
		padding: 14px 10px;
		box-sizing: border-box;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		text-align: center;
		gap: 4px;
		border-right: 1px solid rgba(255,255,255,0.1);
		border-bottom: 1px solid rgba(255,255,255,0.1);
	}

	body.page-template-home-new-may-2026 .trust-stat:nth-child(2n) { border-right: none; }
	body.page-template-home-new-may-2026 .trust-stat:nth-last-child(-n+2) { border-bottom: none; }

	body.page-template-home-new-may-2026 .trust-stat__figure { justify-content: center; }
	body.page-template-home-new-may-2026 .trust-stat__num    { font-size: clamp(20px, 5vw, 24px); }
	body.page-template-home-new-may-2026 .trust-stat__suffix { font-size: clamp(14px, 3.5vw, 18px); }
	body.page-template-home-new-may-2026 .trust-stat__label  { font-size: 9.5px; line-height: 1.35; }

	body.page-template-home-new-may-2026 .trust-brands {
		padding-top: clamp(22px, 5vw, 32px);
		padding-bottom: clamp(20px, 4.5vw, 28px);
		padding-left:  max(14px, env(safe-area-inset-left,  0px));
		padding-right: max(14px, env(safe-area-inset-right, 0px));
		box-sizing: border-box;
	}

	body.page-template-home-new-may-2026 .trust-brands__title.single-header {
		font-size: clamp(18px, 4.8vw, 22px);
		line-height: 1.3;
		margin-bottom: 8px;
	}

	body.page-template-home-new-may-2026 .trust-brands__eyebrow {
		font-size: 0.6875rem;
		text-align: center;
		margin-bottom: 12px;
	}

	body.page-template-home-new-may-2026 .trust-brands__logos {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 8px;
	}

	body.page-template-home-new-may-2026 .trust-brand-item {
		min-height: 44px;
		height: 88px;
		padding: 4px 6px;
	}

	body.page-template-home-new-may-2026 .trust-brand-item img {
		max-height: 72px;
	}

	/* ─── 3. CATEGORY GRID ────────────────────────────────────── */
	body.page-template-home-new-may-2026 .categerisection {
		padding: clamp(28px, 6vw, 44px) 0;
	}

	body.page-template-home-new-may-2026 .main-special-right,
	body.page-template-home-new-may-2026 .main-wrap {
		width: 100%;
		max-width: 100%;
		padding-left:  0;
		padding-right: 0;
		margin-left:   0;
		margin-right:  0;
		box-sizing: border-box;
	}

	body.page-template-home-new-may-2026 .home-categories-header {
		text-align: center;
		padding: 0 max(16px, env(safe-area-inset-left, 0px));
		margin: 0 auto 14px;
		max-width: 920px;
	}

	body.page-template-home-new-may-2026 .home-categories-header .single-header {
		font-size: clamp(18px, 4.8vw, 22px);
		font-weight: 700;
		line-height: 1.3;
		margin: 0 0 10px;
		color: #013b6b;
		letter-spacing: normal;
	}

	body.page-template-home-new-may-2026 .home-categories-header p {
		font-size: 1.3rem;
		line-height: 1.5;
		font-weight: 500;
		color: #5d6b7a;
		margin: 0 auto;
		text-align: center;
	}

	body.page-template-home-new-may-2026 .home-categories-layout {
		flex-direction: column;
		gap: 14px;
		padding: 0 max(16px, env(safe-area-inset-left, 0px));
		box-sizing: border-box;
	}

	/* Sidebar is an off-canvas drawer ≤1100px — do not force inline full-width. */
	body.page-template-home-new-may-2026 .home-categories-layout > .woo-shop-sidebar-toggle {
		min-height: 48px;
		font-size: 1.45rem;
		border-radius: 8px;
	}

	body.page-template-home-new-may-2026 .home-categories-main {
		width: 100%;
	}

	body.page-template-home-new-may-2026 .shop-element-box--home-categories,
	body.page-template-home-new-may-2026 .gl-home-cat-grid {
		display: grid !important;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
		padding: 0;
		box-sizing: border-box;
	}

	body.page-template-home-new-may-2026 .shop-element-box--home-categories .shop-element,
	body.page-template-home-new-may-2026 .gl-home-cat {
		width: 100% !important;
		margin: 0 !important;
		min-height: 0;
		padding: 0 !important;
		border-radius: 8px;
		overflow: hidden;
		box-shadow: none;
		border: 1px solid #e0e0e0;
	}

	body.page-template-home-new-may-2026 .shop-element-box--home-categories .shop-image,
	body.page-template-home-new-may-2026 .gl-home-cat__media {
		height: auto;
		aspect-ratio: 1 / 1;
		margin: 0;
		padding: 0;
		border: none;
		border-bottom: 1px solid #e8ecef;
		background: #f7f8fa;
		overflow: hidden;
		position: relative;
	}

	body.page-template-home-new-may-2026 .shop-element-box--home-categories .shop-image img,
	body.page-template-home-new-may-2026 .gl-home-cat__media img {
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
		max-width: none;
		margin: 0;
		padding: 0;
		object-fit: cover;
		object-position: center center;
	}

	body.page-template-home-new-may-2026 .shop-element-box--home-categories .shop-link-category-enter,
	body.page-template-home-new-may-2026 .gl-home-cat__label {
		font-size: 1.3rem;
		font-weight: 600;
		letter-spacing: 0;
		text-transform: none;
		padding: 10px 8px;
		min-height: 44px;
		display: flex;
		align-items: center;
		justify-content: center;
		text-align: center;
		line-height: 1.3;
	}

	/* Hide chevron on touch phones — keeps labels readable in 2-up */
	body.page-template-home-new-may-2026 .gl-home-cat__label::after {
		display: none;
	}

	/* ─── 4. PRODUCT TABS (best-sellers) — removed.
	   The home-product-tabs module (inc/, css/ and js/) was deleted; no PHP
	   emits .home-tabshop* markup any more. ──────────────────────────────── */

	/* ─── 5. KITCHEN PLANNING (KPLAN) ────────────────────────── */
	body.page-template-home-new-may-2026 .kplan-section {
		padding: clamp(36px, 8vw, 52px) 0;
	}

	body.page-template-home-new-may-2026 .kplan-inner {
		flex-direction: column;
		width: 100%;
		max-width: 100%;
		padding: 0 max(16px, env(safe-area-inset-right, 0px)) 0 max(16px, env(safe-area-inset-left, 0px));
		gap: clamp(28px, 7vw, 40px);
		box-sizing: border-box;
		overflow-x: clip;
	}

	body.page-template-home-new-may-2026 .kplan-content,
	body.page-template-home-new-may-2026 .kplan-visual {
		width: 100%;
		min-width: 0;
		/* Avoid translateX reveal pushing content past the viewport on phones. */
		transform: none !important;
	}

	/* Content first on mobile */
	body.page-template-home-new-may-2026 .kplan-content { order: 1; }
	body.page-template-home-new-may-2026 .kplan-visual  { order: 2; }

	body.page-template-home-new-may-2026 .kplan-heading {
		font-size: clamp(1.5rem, 7vw, 1.85rem);
		line-height: 1.18;
	}

	body.page-template-home-new-may-2026 .kplan-sub {
		font-size: 0.9375rem;
		line-height: 1.6;
	}

	body.page-template-home-new-may-2026 .kplan-features {
		gap: 10px;
	}

	body.page-template-home-new-may-2026 .kplan-feature {
		padding: 12px 14px;
		gap: 12px;
	}

	body.page-template-home-new-may-2026 .kplan-ctas {
		flex-direction: column;
		gap: 10px;
		align-items: stretch;
	}

	body.page-template-home-new-may-2026 .kplan-btn {
		width: 100%;
		min-height: 50px;
		justify-content: center;
		font-size: 0.9375rem;
		box-sizing: border-box;
	}

	body.page-template-home-new-may-2026 .kplan-img-wrap {
		border-radius: 12px;
		overflow: hidden;
	}

	body.page-template-home-new-may-2026 .kplan-img {
		height: clamp(200px, 56vw, 270px);
		width: 100%;
		object-fit: cover;
		border-radius: 12px;
	}

	/* Hide floating decoration cards — too cramped */
	body.page-template-home-new-may-2026 .kplan-float,
	body.page-template-home-new-may-2026 .kplan-glow,
	body.page-template-home-new-may-2026 .kplan-badge {
		display: none !important;
	}

	/* Trust items: 2 columns */
	body.page-template-home-new-may-2026 .kplan-trust > .wrapper.kplan-trust__inner {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
	}

	body.page-template-home-new-may-2026 .kplan-mobile-sticky {
		padding-bottom: max(14px, env(safe-area-inset-bottom, 0px));
	}

	body.page-template-home-new-may-2026 .kplan-mobile-sticky .kplan-btn {
		font-size: 1rem;
		min-height: 52px;
	}

	/* ─── 6. PROJECT SHOWCASE — removed.
	   The pshowcase-* markup no longer exists in any template; only stale
	   slick-init selectors in home-new-may-2026.php still name it. ────────── */

	/* ─── 7. ABOUT SECTION ───────────────────────────────────── */
	body.page-template-home-new-may-2026 .about-section.home-desc-con {
		padding: clamp(36px, 8vw, 52px) 0 !important;
	}

	body.page-template-home-new-may-2026 .about-section .wrapper {
		padding-left:  max(16px, env(safe-area-inset-left,  0px));
		padding-right: max(16px, env(safe-area-inset-right, 0px));
	}

	body.page-template-home-new-may-2026 .about-inner {
		grid-template-columns: 1fr;
		gap: clamp(28px, 7vw, 40px);
	}

	body.page-template-home-new-may-2026 .about-title {
		font-size: clamp(1.3rem, 6vw, 1.65rem);
		margin-bottom: 14px;
	}

	body.page-template-home-new-may-2026 .about-text p {
		font-size: 0.9375rem !important;
		line-height: 1.7 !important;
	}

	body.page-template-home-new-may-2026 .about-usps {
		margin: 20px 0 24px;
		gap: 10px;
	}

	body.page-template-home-new-may-2026 .about-usps li {
		font-size: 0.9375rem;
	}

	body.page-template-home-new-may-2026 .about-ctas {
		flex-direction: column;
		gap: 10px;
		align-items: stretch;
	}

	body.page-template-home-new-may-2026 .about-btn {
		width: 100%;
		min-height: 50px;
		justify-content: center;
		font-size: 0.9375rem;
		box-sizing: border-box;
	}

	/* Feature cards: 2-col grid on mobile */
	body.page-template-home-new-may-2026 .about-features {
		display: grid !important;
		grid-template-columns: 1fr 1fr;
		gap: 0;
	}

	body.page-template-home-new-may-2026 .about-callout {
		grid-column: 1 / -1;
	}

	body.page-template-home-new-may-2026 .about-feat {
		padding: 14px 14px;
		gap: 10px;
	}

	body.page-template-home-new-may-2026 .about-feat__icon {
		width: 36px;
		height: 36px;
		border-radius: 8px;
	}

	body.page-template-home-new-may-2026 .about-feat div strong {
		font-size: 12.5px;
	}

	body.page-template-home-new-may-2026 .about-feat div span {
		font-size: 11px;
	}

	body.page-template-home-new-may-2026 .about-callout {
		padding: 16px 18px;
	}

	body.page-template-home-new-may-2026 .about-callout blockquote p {
		font-size: 0.875rem !important;
	}

	/* ─── 8. EDITORIAL SPLITS (image + copy) ─────────────────── */
	body.page-template-home-new-may-2026 .home-split-band {
		padding: clamp(36px, 8vw, 52px) 0;
	}

	body.page-template-home-new-may-2026 .home-split-band .wrapper {
		padding-left:  max(16px, env(safe-area-inset-left,  0px));
		padding-right: max(16px, env(safe-area-inset-right, 0px));
	}

	body.page-template-home-new-may-2026 .home-split {
		grid-template-columns: 1fr;
		gap: clamp(20px, 5vw, 28px);
	}

	/* Always show image on top on mobile */
	body.page-template-home-new-may-2026 .home-split .home-split__media,
	body.page-template-home-new-may-2026 .home-split--reverse .home-split__media {
		order: 0 !important;
	}

	body.page-template-home-new-may-2026 .home-split .home-split__body,
	body.page-template-home-new-may-2026 .home-split--reverse .home-split__body {
		order: 1 !important;
	}

	body.page-template-home-new-may-2026 .home-split__img {
		aspect-ratio: 16 / 9;
		object-fit: cover;
		max-height: 240px;
	}

	body.page-template-home-new-may-2026 .home-split__title {
		font-size: clamp(1.15rem, 5.5vw, 1.4rem);
		margin-bottom: 12px;
	}

	body.page-template-home-new-may-2026 .home-split__text p {
		font-size: 0.9rem;
		line-height: 1.7;
	}

	/* Truncate long SEO paragraphs on mobile — show first 3 lines */
	body.page-template-home-new-may-2026 .home-split__text {
		position: relative;
	}

	body.page-template-home-new-may-2026 .home-split__text p:nth-child(n+2) {
		display: none;
	}

	/* ─── 9. BLOG / NEWS STRIP ───────────────────────────────── */
	body.page-template-home-new-may-2026 .hnm-blog {
		padding: clamp(36px, 8vw, 52px) 0;
	}

	body.page-template-home-new-may-2026 .hnm-blog .wrapper {
		padding-left:  max(16px, env(safe-area-inset-left,  0px));
		padding-right: max(16px, env(safe-area-inset-right, 0px));
	}

	body.page-template-home-new-may-2026 .hnm-blog__header {
		flex-direction: column;
		align-items: flex-start;
		text-align: left;
		gap: 12px;
		margin-bottom: clamp(20px, 5vw, 28px);
	}

	body.page-template-home-new-may-2026 .hnm-blog__title {
		font-size: clamp(1.25rem, 6vw, 1.5rem);
		margin-bottom: 6px;
	}

	body.page-template-home-new-may-2026 .hnm-blog__lead {
		font-size: 0.875rem;
	}

	body.page-template-home-new-may-2026 .hnm-blog__eyebrow {
		font-size: 1.1rem;
	}

	body.page-template-home-new-may-2026 .hnm-blog__actions {
		width: 100%;
		justify-content: flex-start;
	}

	body.page-template-home-new-may-2026 .hnm-blog__archive {
		width: 100%;
		min-height: 48px;
		justify-content: center;
		box-sizing: border-box;
	}

	body.page-template-home-new-may-2026 .hnm-blog .hnm-blog-card__title {
		font-size: 1rem;
	}

	body.page-template-home-new-may-2026 .hnm-blog .hnm-blog-card__excerpt {
		font-size: 0.875rem;
		-webkit-line-clamp: 2;
	}

	body.page-template-home-new-may-2026 .hnm-blog .read-more-btn {
		width: 100%;
		min-height: 48px;
		display: flex;
		align-items: center;
		justify-content: center;
		box-sizing: border-box;
	}

	body.page-template-home-new-may-2026 .hnm-blog .slider-prev,
	body.page-template-home-new-may-2026 .hnm-blog .slider-next {
		width: 48px;
		height: 48px;
	}

	/* ─── 10. BOTTOM INFO BOX ────────────────────────────────── */
	body.page-template-home-new-may-2026 .preveda-page-content .info-bottom-box {
		grid-template-columns: 1fr;
		margin-top: clamp(24px, 6vw, 36px);
		padding: clamp(16px, 4.5vw, 22px);
		gap: clamp(20px, 5vw, 28px);
		box-sizing: border-box;
		width: 100%;
		max-width: 100%;
	}

	body.page-template-home-new-may-2026 .info-bottom-box-left--slider,
	body.page-template-home-new-may-2026 .bottom-info-gallery {
		display: block;
		width:  100%;
		min-width: 0;
		max-width: 100%;
	}

	/* aspect-ratio + inset fill live in home-bottom-info-responsive.css — do not reintroduce height:0/padding-top */
	body.page-template-home-new-may-2026 .bottom-info-gallery__frame {
		border-radius: 10px;
		min-height: 220px;
	}

	body.page-template-home-new-may-2026 .info-bottom-box-right {
		padding: 0;
	}

	body.page-template-home-new-may-2026 .info-bottom-box__title {
		font-size: clamp(1.1rem, 5.5vw, 1.35rem);
		margin-bottom: 6px;
	}

	body.page-template-home-new-may-2026 .info-bottom-box-right p {
		font-size: 0.9rem;
		line-height: 1.65;
	}

	body.page-template-home-new-may-2026 .info-bottom-box__map-btn {
		width: 100%;
		min-height: 48px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		margin-top: 16px;
		box-sizing: border-box;
	}

	/* ─── 11. SECTION EYEBROWS ───────────────────────────────── */
	body.page-template-home-new-may-2026 .section-header__eyebrow {
		font-size: 0.7rem;
		letter-spacing: 0.1em;
	}

}

/* ── 420 px and below: keep dense 2-up categories; tighten type ───────────── */
@media (max-width: 420px) {

	body.page-template-home-new-may-2026 .shop-element-box--home-categories,
	body.page-template-home-new-may-2026 .gl-home-cat-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 8px;
	}

	body.page-template-home-new-may-2026 .shop-element-box--home-categories .shop-link-category-enter,
	body.page-template-home-new-may-2026 .gl-home-cat__label {
		font-size: 1.25rem;
		padding: 8px 6px;
		min-height: 42px;
	}

	body.page-template-home-new-may-2026 .hero-slide__title {
		font-size: 1.25rem;
	}

	body.page-template-home-new-may-2026 .hero-btn {
		flex: 1 1 100%;
		min-width: 0;
	}

	body.page-template-home-new-may-2026 .about-features {
		grid-template-columns: 1fr;
	}
}

/* ── reduced-motion ─────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
	body.page-template-home-new-may-2026 .hero-slide__bg,
	body.page-template-home-new-may-2026 .hero-slide__bg.is-animating,
	body.page-template-home-new-may-2026 .hero-slide__img {
		animation: none !important;
		transition: none !important;
	}
}
