/* ==========================================================================
   Black Watch Supply — responsive.css
   Mobile-first breakpoints
   ========================================================================== */

/* ── Variables override for mobile ── */
@media (max-width: 1023px) {
	:root {
		--section-gap-desktop:    var(--section-gap-mobile);
		--section-gap-desktop-xl: var(--section-gap-mobile-xl);
	}
}

/* ── Large Desktop (1280+) ── */
@media (min-width: 1280px) {
	.bws-nav-menu > li > a {
		padding: 8px 18px;
		font-size: 0.8125rem;
	}
}

/* ── Medium (1024px – 1279px) ── */
@media (max-width: 1279px) {
	.bws-hero__heading-line1,
	.bws-hero__heading-line2 {
		font-size: clamp(56px, 7vw, 96px);
	}

	.bws-pillars__grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
	}

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

	.bws-bestsellers__item {
		flex: 0 0 calc(33.333% - 14px);
	}

	.bws-footer__grid {
		grid-template-columns: 1fr 1fr 1fr;
		grid-template-rows: auto auto;
	}

	.bws-footer__brand {
		grid-column: 1 / -1;
	}
}

/* ── Tablet (768px – 1023px) ── */
@media (max-width: 1023px) {

	/* Header: hide desktop nav, show hamburger */
	.bws-header__nav {
		display: none;
	}

	.bws-hamburger {
		display: flex;
	}

	.bws-header__inner {
		justify-content: space-between;
	}

	/* Hero: stack vertically */
	.bws-hero__inner {
		grid-template-columns: 1fr;
		gap: 40px;
		align-content: center;
		padding-block: 40px;
	}

	.bws-hero__model {
		display: none;
	}

	.bws-hero__content {
		max-width: 640px;
	}

	.bws-hero {
		height: clamp(480px, 80vh, 720px);
	}

	/* Pillars */
	.bws-pillars__grid {
		grid-template-columns: repeat(2, 1fr);
	}

	/* Collections */
	.bws-collections__grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 8px;
	}

	/* Bestsellers: 2 visible */
	.bws-bestsellers__item {
		flex: 0 0 calc(50% - 10px);
	}

	/* Brand story — on mobile fill from edge with a heavier overlay */
	.bws-brand-story__content {
		max-width: 100%;
		padding: 40px 48px 40px 0;
		background: linear-gradient(
			to right,
			rgba(11, 11, 11, 1.00)  0%,
			rgba(11, 11, 11, 0.95) 60%,
			rgba(11, 11, 11, 0.70) 100%
		);
	}

	/* WooCommerce shop */
	.woocommerce ul.products {
		grid-template-columns: repeat(3, 1fr);
	}

	/* Single product */
	.bws-single-product__layout {
		grid-template-columns: 1fr;
		gap: 40px;
	}

	/* Footer */
	.bws-footer__grid {
		grid-template-columns: 1fr 1fr;
		gap: 36px;
	}

	.bws-footer__brand {
		grid-column: 1 / -1;
	}

	.bws-footer__newsletter-mini {
		grid-column: 1 / -1;
	}

	.bws-footer__bottom {
		flex-wrap: wrap;
		gap: 20px;
	}

	/* Posts grid */
	.bws-posts-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	/* Related products */
	.related.products ul.products {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* ── Mobile (up to 767px) ── */
@media (max-width: 767px) {

	/* Container padding */
	.bws-container {
		padding-inline: 20px;
	}

	/* Utility bar */
	.bws-utility-bar__text {
		font-size: 0.625rem;
		letter-spacing: 0.08em;
	}

	/* Hero */
	.bws-hero {
		height: clamp(480px, 92vh, 700px);
	}

	.bws-hero__overlay {
		background: linear-gradient(to bottom, rgba(11,11,11,0.7) 0%, rgba(11,11,11,0.55) 100%);
	}

	.bws-hero__tagline {
		letter-spacing: 0.2em;
	}

	.bws-hero__heading-line1,
	.bws-hero__heading-line2 {
		font-size: clamp(48px, 14vw, 80px);
	}

	.bws-hero__actions {
		flex-direction: column;
		align-items: flex-start;
	}

	.bws-hero__actions .bws-btn {
		width: 100%;
		justify-content: center;
	}

	/* Pillars */
	.bws-pillars__grid {
		grid-template-columns: 1fr;
		gap: 16px;
	}

	/* Collections */
	.bws-collections__grid {
		grid-template-columns: 1fr;
		gap: 8px;
	}

	.bws-collection-tile {
		aspect-ratio: 2 / 1;
	}

	.bws-collection-tile__link {
		opacity: 1;
	}

	/* Bestsellers: 1 visible on mobile */
	.bws-bestsellers__item {
		flex: 0 0 calc(80vw - 40px);
	}

	.bws-bestsellers__header {
		flex-direction: column;
		align-items: flex-start;
		gap: 16px;
	}

	/* Newsletter */
	.bws-newsletter__field-group {
		flex-direction: column;
	}

	.bws-newsletter__input {
		border-right: 1px solid var(--bws-border);
		border-bottom: none;
	}

	.bws-newsletter__input:focus {
		border-color: var(--bws-bronze);
	}

	/* Footer */
	.bws-footer__grid {
		grid-template-columns: 1fr;
		gap: 32px;
		padding-bottom: 48px;
	}

	.bws-footer__brand,
	.bws-footer__newsletter-mini {
		grid-column: auto;
	}

	.bws-footer__bottom {
		flex-direction: column;
		align-items: flex-start;
		gap: 16px;
	}

	.bws-footer__creed {
		order: -1;
	}

	/* Shop toolbar */
	.bws-shop-toolbar {
		flex-direction: column;
		align-items: flex-start;
	}

	.bws-shop-toolbar__right {
		flex-wrap: wrap;
	}

	/* WC product grid */
	.woocommerce ul.products {
		grid-template-columns: repeat(2, 1fr);
		gap: 12px;
	}

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

	/* Posts grid */
	.bws-posts-grid {
		grid-template-columns: 1fr;
	}

	/* Brand story */
	.bws-brand-story__content {
		padding: 32px 32px 32px 0;
	}

	/* 404 */
	.bws-404__actions {
		flex-direction: column;
		align-items: center;
	}

	/* Cart / Checkout responsive */
	.woocommerce-cart table.shop_table {
		display: block;
		overflow-x: auto;
	}

	/* Qty selector */
	.woocommerce div.product form.cart div.quantity {
		margin-bottom: 16px;
	}
}

/* ── Small Mobile (up to 479px) ── */
@media (max-width: 479px) {

	.bws-logo-wordmark {
		display: none;
	}

	.bws-hero__heading-line1,
	.bws-hero__heading-line2 {
		font-size: clamp(42px, 16vw, 68px);
	}

	.bws-collections__grid {
		grid-template-columns: 1fr;
	}

	.woocommerce ul.products {
		grid-template-columns: 1fr 1fr;
		gap: 8px;
	}

	.bws-btn {
		padding: 14px 20px;
		font-size: 0.75rem;
	}

	.bws-bestsellers__item {
		flex: 0 0 calc(100vw - 40px);
	}

	.bws-footer__bottom-left {
		order: 2;
	}

	.bws-footer__social {
		order: 1;
	}
}

/* ── Print ── */
@media print {
	.bws-utility-bar,
	.bws-header,
	.bws-mobile-menu,
	.bws-overlay,
	.bws-hero__scroll,
	.bws-newsletter,
	.bws-footer__newsletter-mini,
	.bws-footer__social {
		display: none;
	}

	body {
		background: #fff;
		color: #000;
	}
}

/* ── Reduced Motion ── */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}

	.bws-hero__scroll-line {
		animation: none;
		opacity: 0.5;
	}
}