/**
 * Nikolas X — Responsive breakpoints
 */

@media (max-width: 1199px) {
	:root {
		--nx-gutter: 20px;
		--nx-section-spacing: clamp(3.5rem, 7vw, 5rem);
	}

	.nx-grid--4 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.nx-hero__grid {
		grid-template-columns: 1fr;
		gap: 2.5rem;
	}

	.nx-hero__media {
		order: -1;
		min-height: 260px;
	}

	.nx-content-layout {
		grid-template-columns: minmax(0, 1fr);
	}

	.nx-footer__grid {
		grid-template-columns: 1fr;
		gap: 2.5rem;
	}
}

@media (max-width: 767px) {
	:root {
		--nx-gutter: 20px;
	}

	.nx-header__inner {
		grid-template-columns: auto 1fr auto;
	}

	.nx-nav__toggle {
		display: inline-flex;
		justify-self: end;
	}

	.nx-header__nav {
		display: contents;
	}

	.nx-nav__panel {
		position: fixed;
		inset: 0 0 0 auto;
		width: min(100%, 320px);
		padding: 5rem 1.5rem 2rem;
		background: rgba(5, 7, 13, 0.98);
		border-left: 1px solid var(--nx-color-border-dark);
		transform: translateX(100%);
		transition: transform var(--nx-duration) var(--nx-ease);
		z-index: 1100;
	}

	.nx-nav__panel.is-open,
	.nx-nav__panel:not([hidden]).is-open {
		transform: translateX(0);
	}

	.nx-nav__panel[hidden] {
		display: block !important;
		transform: translateX(100%);
		pointer-events: none;
	}

	.nx-nav__panel.is-open {
		pointer-events: auto;
	}

	.nx-nav__list {
		flex-direction: column;
		align-items: flex-start;
		gap: 1rem;
	}

	.nx-header__cta {
		display: none;
	}

	.nx-nav__mobile-cta {
		display: block;
	}

	.nx-nav__mobile-cta .nx-header__cta {
		display: inline-flex;
		width: 100%;
	}

	.nx-nav__backdrop:not([hidden]) {
		display: block;
	}

	html.nx-nav-open {
		overflow: hidden;
	}

	.nx-grid--4,
	.nx-grid--3,
	.nx-posts-grid,
	.nx-footer__columns {
		grid-template-columns: 1fr;
	}

	.nx-section__header--row {
		flex-direction: column;
		align-items: flex-start;
	}

	.nx-newsletter {
		padding: 1.5rem;
	}

	.nx-newsletter__form {
		justify-content: stretch;
	}

	.nx-newsletter__form .nx-btn {
		width: 100%;
	}

	.nx-hero__actions {
		flex-direction: column;
		align-items: stretch;
	}

	.nx-hero__actions .nx-btn {
		width: 100%;
	}
}

@media (min-width: 768px) and (max-width: 1023px) {
	.nx-grid--3,
	.nx-posts-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Prevent horizontal overflow on small screens */
@media (max-width: 767px) {
	.nx-hero__title,
	.nx-section__title,
	.nx-page-title {
		overflow-wrap: anywhere;
	}

	.nx-header__actions .nx-cart-link {
		margin-right: 0.25rem;
	}

	.nx-cpt-meta__row {
		grid-template-columns: 1fr;
		gap: 0.25rem;
	}

	.nx-footer__bottom {
		flex-direction: column;
		align-items: flex-start;
	}
}

@media (min-width: 1440px) {
	:root {
		--nx-gutter: 32px;
	}
}

/* 320px floor */
@media (max-width: 359px) {
	:root {
		--nx-gutter: 16px;
	}

	.nx-btn {
		padding: 0.75rem 1.1rem;
	}
}