/**
 * Navard theme — responsive overrides.
 *
 * Mobile-first breakpoints.
 *
 * @package Navard
 */

/* Tablet & small desktop */
@media (max-width: 1024px) {
	.navard-mega-grid {
		grid-template-columns: repeat(3, 1fr);
	}

	.navard-team-card, .navard-team-card-item {
		flex: 0 0 calc(50% - 10px);
	}

	.navard-about-grid {
		grid-template-columns: 1fr;
		gap: 24px;
	}

	.navard-footer-inner {
		grid-template-columns: 1fr 1fr;
		gap: 32px;
	}

	.navard-hero {
		height: 380px;
	}

	.navard-hero-title {
		font-size: 30px;
	}

	.navard-hero-content {
		max-width: 460px;
	}
}

/* Mobile landscape & small tablet */
@media (max-width: 768px) {

	/* ==========================================================
	   Global mobile side padding (15px) for all NON-full-width
	   blocks/containers. Full-width (.alignfull) stays edge-to-edge.
	   ========================================================== */

	/* Constrained content wrappers — reduce from 24px to 15px */
	.site-main,
	.entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.aligncenter),
	.wp-block-post-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.aligncenter) {
		padding-inline: 15px;
	}

	/* Wide-aligned blocks — already have padding-inline: 24px, drop to 15px */
	.alignwide,
	.entry-content > .alignwide,
	.wp-block-post-content > .alignwide,
	.is-layout-constrained > .alignwide,
	.is-root-container > .alignwide {
		padding-inline: 15px;
	}

	/* Full-aligned blocks — MUST stay edge-to-edge, no side padding */
	.alignfull,
	.entry-content > .alignfull,
	.wp-block-post-content > .alignfull,
	.is-layout-constrained > .alignfull,
	.is-root-container > .alignfull {
		padding-inline: 0;
		margin-inline: 0;
		max-width: none;
		width: 100%;
	}

	/* Front-page wrapper — stays edge-to-edge, but reset any padding it might have */
	.navard-front-page .site-main,
	body.navard-front-page .site-main {
		padding-inline: 0;
	}

	/* Top bar / header / footer inner rows — reduce their 24px gutters to 15px */
	.navard-topbar,
	.navard-header-main,
	.navard-mega-menu,
	.navard-footer-inner,
	.navard-footer-bottom {
		padding-inline: 15px;
	}

	/* Section shells that use padding-inline: 24px */
	.navard-hero,
	.navard-prices,
	.navard-teams,
	.navard-about,
	.navard-clients,
	.navard-cta-inner,
	.navard-consult-section {
		padding-inline: 15px;
	}

	/* Custom header block (.is-front .navard-hdr-inner) — keep room for
	   the hamburger drawer button on the inline-start side */
	.is-front .navard-hdr-inner {
		padding: 0 15px 0 56px;
	}

	html[dir="ltr"] .is-front .navard-hdr-inner {
		padding: 0 56px 0 15px;
	}

	/* Homepage section shells (from front-page.html groups) — these
	   are alignfull so should stay edge-to-edge, but their inner
	   constrained content still needs 15px (handled by theme's
	   .is-layout-constrained children automatically via the
	   .entry-content rule above — no extra override needed). */

	/* Sidebar-layout (product category / tag templates) — the wrapper
	   uses .navard-tax-layout which stacks on mobile; add breathing
	   room inside each column */
	.navard-tax-content,
	.navard-tax-extra,
	.navard-tax-widget {
		padding-inline: 15px;
	}

	/* ---------- Existing mobile rules (unchanged) ---------- */

	.navard-topbar {
		flex-wrap: wrap;
		gap: 8px;
	}

	.navard-topbar-contact {
		gap: 12px;
		font-size: 12px;
	}

	.navard-header-main {
		flex-wrap: wrap;
		gap: 12px;
		padding-top: 12px;
		padding-bottom: 12px;
		position: relative;
	}

	.navard-header-main .navard-product-search {
		order: 3;
		flex-basis: 100%;
	}

	.navard-main-nav {
		display: none;
	}

	/* Mobile menu drawer toggled by JS */
	.navard-mobile-nav-toggle {
		display: inline-flex;
	}

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

	.navard-mega-content {
		inset-inline: 16px;
	}

	.navard-hero {
		height: 320px;
		margin-top: 16px;
		margin-bottom: 16px;
		border-radius: 12px;
	}

	.navard-hero-slide {
		padding-inline-start: 24px;
		padding-inline-end: 24px;
	}

	.navard-hero-title {
		font-size: 22px;
		margin-bottom: 8px;
	}

	.navard-hero-subtitle {
		font-size: 14px;
		margin-bottom: 16px;
	}

	.navard-hero-button {
		padding: 10px 24px;
		font-size: 14px;
	}

	.navard-hero-prev,
	.navard-hero-next {
		width: 36px;
		height: 36px;
		font-size: 18px;
	}

	.navard-section-head {
		padding-top: 40px;
		margin-bottom: 20px;
	}

	.navard-section-title {
		font-size: 22px;
	}

	.navard-section-sub {
		font-size: 13px;
	}

	.navard-team-card, .navard-team-card-item {
		flex: 0 0 80%;
	}

	.navard-cta-inner {
		flex-direction: column;
		text-align: center;
	}

	.navard-cta-action {
		justify-content: center;
	}

	.navard-footer-inner {
		grid-template-columns: 1fr;
		gap: 28px;
	}

	.navard-floating-buttons {
		inset-block-end: 16px;
		inset-inline-start: 16px;
	}

	.navard-floating-btn {
		width: 48px;
		height: 48px;
	}
}

/* Small mobile */
@media (max-width: 576px) {
	body {
		font-size: 15px;
	}

	.navard-mega-grid {
		grid-template-columns: 1fr;
	}

	.navard-mega-content {
		padding: 16px;
	}

	.navard-hero {
		height: 280px;
	}

	.navard-hero-title {
		font-size: 18px;
	}

	.navard-hero-subtitle {
		font-size: 13px;
	}

	.navard-tabpanel {
		padding: 8px;
		font-size: 12px;
		border-radius: 8px;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	.navard-tabpanel table {
		min-width: 480px;
		width: 100%;
	}

	.navard-tabpanel thead th,
	.navard-tabpanel tbody td {
		padding: 8px 10px;
	}

	.navard-team-card, .navard-team-card-item {
		flex: 0 0 85%;
	}

	.navard-tabs-list {
		gap: 6px;
	}

	.navard-tab {
		padding: 8px 14px;
		font-size: 13px;
	}

	.navard-cta-title {
		font-size: 20px;
	}

	.navard-cta-phone {
		font-size: 16px;
		padding: 10px 18px;
	}
}

/* Very small mobile */
@media (max-width: 360px) {
	.navard-topbar-hours {
		display: none;
	}

	.navard-hero {
		height: 240px;
	}

	.navard-floating-btn {
		width: 44px;
		height: 44px;
	}
}

/* Large desktops */
@media (min-width: 1440px) {
	.navard-hero {
		height: 520px;
	}

	.navard-hero-title {
		font-size: 44px;
	}
}

/* Print */
@media print {
	.navard-header-main,
	.navard-topbar,
	.navard-mega-menu,
	.navard-floating-buttons,
	.navard-footer,
	.navard-hero-prev,
	.navard-hero-next,
	.navard-hero-dots {
		display: none !important;
	}
}