/**
 * INAI — Site-wide responsive polish
 *
 * Intentional layouts for tablet + mobile. Complements page layout-*.css
 * (canvas release) without rebuilding Elementor structure.
 *
 * Breakpoints (design targets):
 *   ≤1199  large tablet / small laptop
 *   ≤1024  tablet landscape
 *   ≤991   tablet portrait-ish
 *   ≤833   iPad mini / large phone landscape
 *   ≤767   phone
 *   ≤479   compact phone
 *   ≤429   iPhone Pro Max family
 *   ≤374   small phone
 *   ≤359   360 / SE-class
 *   ≤320   minimum
 */

/* ------------------------------------------------------------------ */
/* Shared tokens — progressive scale                                   */
/* ------------------------------------------------------------------ */

@media (max-width: 1199px) {
	:root {
		--inai-side-gutter: 32px;
		--inai-section-gap: 96px;
		--inai-h1-size: 40px;
		--inai-h1-lh: 48px;
		--inai-h2-size: 34px;
		--inai-h2-lh: 42px;
		--inai-h3-size: 22px;
		--inai-h3-lh: 28px;
		--inai-touch-min: 44px;
	}

	html,
	body.inia-theme {
		overflow-x: clip;
	}

	/* Sticky header clearance when scrolling sections into view */
	html {
		scroll-padding-top: 96px;
	}

	.inia-homepage [class*="inia-section-"] {
		scroll-margin-top: 96px;
	}

	/* Never let 100vw + padding invent a horizontal scroller. */
	body.inia-theme,
	body.inia-theme .elementor,
	body.inia-theme .e-con {
		max-width: 100%;
	}

	/* Page shells: consistent horizontal rhythm */
	.inia-homepage,
	.inia-leistungen-page,
	.inia-omb-page,
	.inia-smm-page,
	.inia-seo-page,
	.inia-sea-page,
	.inia-geo-page,
	.inia-webdesign-page,
	.inia-ueber-uns-page,
	.inia-karriere-page,
	.inia-blog-page,
	.inia-referenzen-page,
	.inia-single-post-page,
	.inia-single-case-study-page,
	.inia-404-page,
	.inia-search-page {
		--inia-page-pad-inline: var(--inai-side-gutter);
	}

	/* Elementor parents: prefer fluid widths once canvas is released */
	body.inia-theme .elementor-location-single .e-con.e-parent,
	body.inia-theme .elementor-location-archive .e-con.e-parent,
	body.inia-theme .elementor-page .e-con.e-parent {
		max-width: 100%;
	}

	/* Media defaults */
	body.inia-theme img,
	body.inia-theme video {
		max-width: 100%;
		height: auto;
	}

	body.inia-theme iframe {
		max-width: 100%;
	}

	/* Buttons: comfortable touch targets site-wide */
	html body.inia-theme .elementor .elementor-button {
		min-height: var(--inai-touch-min);
		box-sizing: border-box;
	}

	/* Forms */
	body.inia-theme input[type="text"],
	body.inia-theme input[type="email"],
	body.inia-theme input[type="tel"],
	body.inia-theme input[type="search"],
	body.inia-theme textarea,
	body.inia-theme select,
	.inia-footer-input,
	.inia-search-form__input,
	.inia-404-search__input {
		font-size: 16px; /* iOS zoom prevention */
		min-height: var(--inai-touch-min);
		max-width: 100%;
		box-sizing: border-box;
	}

	body.inia-theme textarea {
		min-height: 120px;
	}

	/* Footer: stack cleanly */
	.inia-footer__newsletter,
	.inia-footer__columns {
		gap: 28px;
	}

	.inia-footer__columns > .e-con,
	.inia-footer__newsletter > .e-con {
		width: 100%;
		max-width: 100%;
	}

	/* Legal / plain pages */
	.page-impressum .elementor,
	.page-agb .elementor,
	.page-datenschutz .elementor,
	body.page-template-default .elementor-page {
		padding-inline: var(--inai-side-gutter);
	}

	/* Calendly embeds never force min-width overflow */
	.calendly-inline-widget,
	.calendly-inline-widget iframe {
		min-width: 0 !important;
		max-width: 100% !important;
	}

	/* Hide desktop-only decorative floats globally when canvas drops */
	.inia-omb-float,
	.inia-promise__arrow,
	.inia-leistungen-path {
		display: none !important;
	}

	/* Fixed desktop card heights must release or flex children wrap sideways */
	.inia-omb-feature-card,
	.inia-seo-link-card,
	.inia-lu-service-card {
		height: auto !important;
		min-height: 0 !important;
		max-height: none !important;
	}

	.inia-omb-feature-card > .e-con-inner,
	.inia-seo-link-card > .e-con-inner {
		flex-wrap: nowrap !important;
		height: auto !important;
	}
}

/* ------------------------------------------------------------------ */
/* ≤1024 — tablet landscape                                            */
/* ------------------------------------------------------------------ */

@media (max-width: 1024px) {
	:root {
		--inai-side-gutter: 28px;
		--inai-section-gap: 80px;
		--inai-h1-size: 38px;
		--inai-h1-lh: 46px;
		--inai-h2-size: 32px;
		--inai-h2-lh: 40px;
	}

	/* Blog / case grids: 2 columns with balanced gaps */
	.inia-blog-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 28px 24px;
		padding-inline: var(--inai-side-gutter);
	}

	.inia-cs-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 28px 24px;
		padding-inline: var(--inai-side-gutter);
	}

	/* Related case studies stay 2-up on tablet */
	.inia-cs-grid--related {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	/* Section headings: readable measure */
	body.inia-theme .elementor-heading-title {
		text-wrap: balance;
	}

	/* Service cards: open body on touch devices (no hover reliance) */
	@media (hover: none) {
		.inia-service-card__body,
		.inia-service-card__cta {
			opacity: 1 !important;
			transform: none !important;
			display: block !important;
		}

		.inia-team-card__img--hover {
			opacity: 0 !important;
		}
	}
}

/* ------------------------------------------------------------------ */
/* ≤991 — tablet portrait                                              */
/* ------------------------------------------------------------------ */

@media (max-width: 991px) {
	:root {
		--inai-side-gutter: 24px;
		--inai-section-gap: 72px;
	}

	.elementor-location-footer > .elementor > .e-con {
		padding: 48px 24px !important;
	}

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

	/*
	 * The 85×70 desktop size only lives in the ≥1200 sheet; below that the SVGs
	 * fall back to their intrinsic size, which is far too heavy on a phone.
	 */
	.inia-footer__social {
		gap: 14px !important;
	}

	.inia-footer__social .elementor-widget-image,
	.inia-footer__social .elementor-widget-image .elementor-widget-container,
	.inia-footer__social img {
		width: 68px !important;
		height: 56px !important;
		flex: 0 0 auto !important;
	}

	.inia-footer__social img {
		object-fit: contain !important;
		max-width: none !important;
	}

	/* Mid-CTAs / moss bands */
	.inia-omb-mid-cta,
	.inia-lu-cta-blue {
		border-radius: 28px !important;
	}
}

/* ------------------------------------------------------------------ */
/* ≤833 — compact tablet / large phone landscape                       */
/* ------------------------------------------------------------------ */

@media (max-width: 833px) {
	:root {
		--inai-h1-size: 34px;
		--inai-h1-lh: 42px;
		--inai-h2-size: 30px;
		--inai-h2-lh: 38px;
		--inai-side-gutter: 20px;
	}

	/* Stat numbers don't overwhelm */
	.inia-lu-stat .elementor-heading-title,
	.inia-scs-metric__value {
		font-size: clamp(32px, 8vw, 48px) !important;
		line-height: 1.15 !important;
	}

	/* Pill rows wrap earlier */
	.inia-lu-pill-row {
		justify-content: center !important;
	}
}

/* ------------------------------------------------------------------ */
/* ≤767 — phone                                                        */
/* ------------------------------------------------------------------ */

@media (max-width: 767px) {
	:root {
		--inai-side-gutter: 16px;
		--inai-section-gap: 64px;
		--inai-h1-size: 32px;
		--inai-h1-lh: 40px;
		--inai-h2-size: 28px;
		--inai-h2-lh: 34px;
		--inai-h3-size: 20px;
		--inai-h3-lh: 26px;
		--inai-body-size: 16px;
		--inai-body-lh: 24px;
		--inai-service-card-p: 24px;
	}

	.inia-blog-grid,
	.inia-cs-grid,
	.inia-cs-grid--related {
		grid-template-columns: 1fr;
		gap: 24px;
		padding-inline: var(--inai-side-gutter);
	}

	.inia-blog-card,
	.inia-cs-card {
		width: 100%;
		max-width: 100%;
	}

	/* Full-width primary CTAs in stacked sections — not every button */
	.inia-omb-hero-left .elementor-button,
	.inia-lu-hero .elementor-button,
	.inia-ou-hero .elementor-button,
	.inia-404-actions .elementor-button,
	.inia-sp-hero .elementor-button,
	.inia-scs-hero .elementor-button {
		width: 100%;
		justify-content: center;
	}

	/* Cards: consistent internal padding */
	.inia-service-card,
	.inia-omb-feature-card,
	.inia-testimonial-card,
	.inia-lu-service-card {
		padding: var(--inai-service-card-p) !important;
	}

	/* Section vertical rhythm */
	body.inia-theme .e-con.e-parent {
		--padding-block: var(--inai-section-gap);
	}

	.elementor-location-footer > .elementor > .e-con {
		padding: 40px 16px !important;
	}

	.inia-footer__social {
		gap: 12px !important;
	}

	.inia-footer__social .elementor-widget-image,
	.inia-footer__social .elementor-widget-image .elementor-widget-container,
	.inia-footer__social img {
		width: 56px !important;
		height: 46px !important;
	}

	/* Newsletter: stack field + submit */
	.inia-newsletter,
	.inia-footer-newsletter-form,
	form.inia-newsletter-form {
		flex-direction: column;
		align-items: stretch;
		gap: 12px;
		width: 100%;
	}

	.inia-newsletter .elementor-button,
	.inia-footer-newsletter-form .elementor-button,
	form.inia-newsletter-form button:not(.screen-reader-text):not(.inia-newsletter__submit),
	.inia-footer-input {
		width: 100%;
		max-width: 100%;
	}

	/* Reduce motion cost on small screens */
	.inia-metric-card {
		animation: none !important;
	}

	/* Trenner marquee: keep clipped */
	.inia-section-trenner,
	.inia-trenner__track {
		overflow: hidden;
	}

	.inia-section-trenner {
		overflow-x: clip;
	}
}

/* ------------------------------------------------------------------ */
/* ≤479 — compact phone                                                */
/* ------------------------------------------------------------------ */

@media (max-width: 479px) {
	:root {
		--inai-side-gutter: 16px;
		--inai-section-gap: 56px;
		--inai-h1-size: 30px;
		--inai-h1-lh: 36px;
		--inai-h2-size: 26px;
		--inai-h2-lh: 32px;
	}

	html body.inia-theme .elementor .elementor-button {
		padding-left: 18px !important;
		padding-right: 18px !important;
		font-size: 14px;
	}

	.inia-service-card__cta .elementor-button,
	.inia-lu-service-card .elementor-button {
		min-width: 0 !important;
		width: 100%;
	}
}

/* ------------------------------------------------------------------ */
/* ≤429 — iPhone 14/15/16 Pro Max family                               */
/* ------------------------------------------------------------------ */

@media (max-width: 429px) {
	:root {
		--inai-h1-size: 28px;
		--inai-h1-lh: 34px;
		--inai-h2-size: 24px;
		--inai-h2-lh: 30px;
	}

	.inia-lu-step__num .elementor-heading-title {
		font-size: 48px !important;
		line-height: 56px !important;
	}

	.inia-404-page .inia-404-code .elementor-heading-title {
		font-size: 72px !important;
	}
}

/* ------------------------------------------------------------------ */
/* ≤374 — small phone                                                  */
/* ------------------------------------------------------------------ */

@media (max-width: 374px) {
	:root {
		--inai-side-gutter: 14px;
		--inai-h1-size: 26px;
		--inai-h1-lh: 32px;
		--inai-h2-size: 22px;
		--inai-h2-lh: 28px;
		--inai-section-gap: 48px;
	}

	.inia-blog-card__title,
	.inia-cs-card__title {
		font-size: 22px !important;
		line-height: 28px !important;
	}
}

/* ------------------------------------------------------------------ */
/* ≤359 — 360px devices                                                */
/* ------------------------------------------------------------------ */

@media (max-width: 359px) {
	:root {
		--inai-side-gutter: 12px;
		--inai-h1-size: 24px;
		--inai-h1-lh: 30px;
	}

	html body.inia-theme .elementor .elementor-button {
		font-size: 13px;
		padding-left: 14px !important;
		padding-right: 14px !important;
	}
}

/* ------------------------------------------------------------------ */
/* ≤320 — minimum supported width                                      */
/* ------------------------------------------------------------------ */

@media (max-width: 320px) {
	:root {
		--inai-side-gutter: 10px;
		--inai-h1-size: 22px;
		--inai-h1-lh: 28px;
		--inai-h2-size: 20px;
		--inai-h2-lh: 26px;
	}

	.elementor-location-header .inia-header-cta-wrap {
		display: none !important; /* logo + burger only — CTA lives in drawer */
	}
}

/* ------------------------------------------------------------------ */
/* Overflow safety — catch rogue absolute / marquee / carousel tracks  */
/* ------------------------------------------------------------------ */

@media (max-width: 1199px) {
	.inia-homepage,
	.inia-leistungen-page,
	.inia-omb-page,
	.inia-smm-page,
	.inia-seo-page,
	.inia-sea-page,
	.inia-geo-page,
	.inia-webdesign-page,
	.inia-ueber-uns-page,
	.inia-karriere-page,
	.inia-blog-page,
	.inia-referenzen-page,
	.inia-single-post-page,
	.inia-single-case-study-page,
	.inia-section-blog,
	.inia-section-trenner,
	.inia-section-kalender,
	.inia-section-growth {
		overflow-x: clip;
	}

	.inia-blog-carousel,
	.inia-team__photos {
		overflow-x: auto;
		overflow-y: hidden;
		-webkit-overflow-scrolling: touch;
		overscroll-behavior-x: contain;
	}
}