/**
 * Mobile / tablet parity with Sophia Pro demo
 * https://demo-sophia-pro.wpcustomthemes.com/homepage-style-3/
 *
 * Breakpoints aligned with theme: 600px, 640px, 768px, 991px, 1024px
 */

/* --- Global: tighter page gutters on phones --- */
@media screen and (max-width: 37.5em) {
	body {
		--wp--style--root--padding-right: var(--wp--preset--spacing--24, 24px);
		--wp--style--root--padding-left: var(--wp--preset--spacing--24, 24px);
	}

	.wp-block-section {
		padding-top: clamp(42px, 10vw, 70px);
		padding-bottom: clamp(42px, 10vw, 70px);
	}
}

@media screen and (max-width: 40em) {
	.wp-block-header .wp-block-buttons,
	.wp-block-header .wp-block-woocommerce-customer-account {
		display: none;
	}

	.wp-block-navigation__responsive-container-open:not(.always-shown) {
		margin-left: -0.75rem;
	}
}

html.has-modal-open {
	overflow: hidden;
}

/* --- Cart page (mobile / tablet) — Sophia Pro demo parity --- */
@media screen and (max-width: 781px) {
	.woocommerce-cart .wp-block-inner-page-title,
	.woocommerce-cart .wp-block-woocommerce-cart.alignwide {
		--cart-page-gutter: var(--wp--preset--spacing--24, 24px);
	}

	.woocommerce-cart .wc-block-components-product-name {
		font-size: var(--wp--preset--font-size--body-default);
	}
}

@media screen and (max-width: 40em) {
	.woocommerce-cart .wp-block-inner-page-title .wp-block-cart-header {
		align-items: flex-start;
		flex-direction: column;
		flex-wrap: wrap !important;
		gap: 0.75rem !important;
	}
}

/* --- Home Style 3: hero (images: see home-style-3-hero-parity.css) --- */
@media screen and (max-width: 991px) {
	.wp-block-header-media .wp-block-cover__inner-container {
		padding-bottom: clamp(42px, 8vw, 70px);
	}

	.wp-block-header-media .wp-block-buttons {
		flex-wrap: wrap;
		gap: 0.75rem 1rem !important;
		justify-content: center;
	}

	.wp-block-header-media .wp-block-buttons > .wp-block-button {
		flex: 1 1 calc(50% - 0.5rem);
		min-width: 140px;
		max-width: 100%;
	}

	.wp-block-header-media .wp-block-buttons > .wp-block-button .wp-block-button__link {
		width: 100%;
		justify-content: center;
	}
}

@media screen and (max-width: 37.5em) {
	.wp-block-header-media .wp-block-buttons > .wp-block-button {
		flex: 1 1 100%;
	}

	.wp-block-group.wp-star-reviews {
		flex-wrap: wrap;
		justify-content: center;
		gap: 0.5rem;
		text-align: center;
	}

	.wp-block-header-media .wp-block-heading.has-huge-post-title-font-size,
	.wp-block-header-media h1 {
		font-size: clamp(1.75rem, 7vw, 2.5rem) !important;
		line-height: 1.25 !important;
	}
}

/* --- Trust icons (Returns / Shipping / …) --- */
@media screen and (max-width: 47.9375em) {
	.woo-policy-features > .woo-policy-features-grid.wp-block-columns > .wp-block-column {
		flex: 1 1 100% !important;
		max-width: 100%;
	}

	.woo-policy-features .woo-policy-badge {
		gap: 0.875rem;
	}

	.woo-policy-features .woo-policy-badge .wp-block-group-content .wp-block-heading {
		font-size: var(--wp--preset--font-size--medium, 1rem);
	}

	.wp-block-icons-with-text.woo-policy-features {
		padding-top: var(--wp--preset--spacing--35, 35px);
	}
}

/* --- Category cards --- */
@media screen and (max-width: 30em) {
	.wp-block-columns.wp-main-col:not(.is-not-stacked-on-mobile) > .wp-block-column,
	.wp-block-columns.wp-main-col .wp-block-column {
		flex: 0 0 100% !important;
		max-width: 100%;
	}
}

/* --- Product carousel --- */
@media screen and (max-width: 40em) {
	.wp-block-sophia-blocks-product-carousel .wp-block-group-heading h2,
	.wp-block-sophia-blocks-product-carousel h2 {
		font-size: clamp(1.625rem, 5.5vw, 2rem) !important;
		line-height: 1.3 !important;
	}

	.wp-block-sophia-blocks-product-carousel .wp-block-group-heading p {
		font-size: var(--wp--preset--font-size--body-small);
		padding-inline: 4%;
	}

	.wp-block-sophia-blocks-product-carousel .alignwide {
		padding-inline: 0;
	}
}

/* --- Reviews scroller --- */
@media screen and (max-width: 64em) {
	.review-scroller-section .site-wrapper,
	.wp-block-sophia-blocks-reviews-scroller .site-wrapper,
	.site-wrapper {
		padding-left: clamp(16px, 4vw, 42px);
		padding-right: clamp(16px, 4vw, 42px);
		max-width: 100%;
	}
}

@media screen and (max-width: 37.5em) {
	.review-scroller-section .section-heading-wrapper .section-content {
		padding-left: 0;
		margin-top: 21px;
	}

	.review-scroller-section h2.has-section-title-font-size,
	.review-scroller-section h2.text-mid {
		font-size: clamp(1.5rem, 5vw, 1.75rem) !important;
	}
}

/* --- CTA block --- */
@media screen and (max-width: 48em) {
	.wp-cta-section .wp-block-media-text {
		grid-template-columns: 100% !important;
	}

	.wp-cta-section .wp-block-media-text .wp-block-media-text__media {
		grid-row: 1;
		min-height: 220px;
	}

	.wp-cta-section .wp-block-media-text .wp-block-media-text__content {
		grid-row: 2;
		padding: var(--wp--custom--spacing--outer);
	}
}

/* Shop mobile/tablet: see shop-sophia-pro-parity.css (loaded on shop archives). */

/* --- Blog / archive grids --- */
@media screen and (max-width: 37.5em) {
	.wp-block-columns.alignwide.upper-footer > .wp-block-column {
		flex-basis: 100% !important;
	}
}

/* --- Scrolling promo strip --- */
@media screen and (max-width: 37.5em) {
	.scrolling-text-section .scrolling-texts-inner p {
		font-size: var(--wp--preset--font-size--body-small) !important;
		padding-inline: var(--wp--preset--spacing--24, 24px) !important;
	}
}

/* --- Text with round images (business services) --- */
@media screen and (max-width: 48em) {
	.wp-block-text-with-round-images::before {
		border-bottom-left-radius: 200px;
		border-bottom-right-radius: 200px;
		height: 200px;
		left: 50%;
		transform: translateX(-50%);
		width: min(100%, 400px);
	}

	.wp-block-text-with-round-images .wp-round-images {
		display: flex;
		flex-wrap: wrap;
		gap: 1rem;
		justify-content: center;
		margin-top: 1.5rem;
	}

	.wp-block-text-with-round-images .wp-round-images .wp-round-image {
		height: 140px !important;
		position: relative !important;
		width: 140px !important;
	}

	.wp-block-text-with-round-images .wp-round-images .wp-round-image.round-image-one,
	.wp-block-text-with-round-images .wp-round-images .wp-round-image.round-image-two {
		left: auto !important;
		margin: 0 !important;
		right: auto !important;
		top: auto !important;
	}
}

/* Cart mobile layout: see cart-sophia-pro-parity.css (loaded only on cart page) */
