/**
 * Odio Soft Responsive
 * Mobile-first breakpoints — no horizontal scroll
 *
 * Breakpoints: 320, 360, 375, 390, 412, 430, 768, 820, 1024, 1280, 1440, 1920
 *
 * @package OdioSoft
 */

/* ═══════════════════════════════════════
   Global overflow guard
   ═══════════════════════════════════════ */

html,
body {
	overflow-x: clip;
}

.odio-site,
.odio-main,
.odio-container,
.odio-section,
.odio-hero,
.odio-header,
.odio-footer,
.odio-reveal,
.odio-grid,
.odio-feature-grid {
	max-width: 100%;
	min-width: 0;
}

img,
video,
iframe,
embed,
object,
svg {
	max-width: 100%;
	height: auto;
}

table {
	display: block;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

/* ═══════════════════════════════════════
   Base mobile (≤767px default)
   ═══════════════════════════════════════ */

/* Header — mobile drawer */
.odio-header__nav {
	display: none;
}

.odio-header__toggle {
	display: flex;
}

.odio-mega {
	display: none;
}

/* Sticky CTA (mobil hızlı erişim) — kaldırıldı */
.odio-sticky-cta {
	display: none !important;
}

@media (max-width: 767.98px) {
	body.has-sticky-cta {
		padding-bottom: calc(4.85rem + env(safe-area-inset-bottom, 0px));
	}
}

/* Grids — stack on mobile */
.odio-grid--2,
.odio-grid--3,
.odio-grid--4,
.odio-feature-grid,
.odio-stats,
.odio-process,
.odio-comparison,
.odio-before-after,
.odio-pricing,
.odio-form__row,
.odio-split,
.odio-content-layout,
.odio-content-layout--reverse,
.odio-home-products__grid,
.odio-home-sectors__grid,
.odio-home-testimonials__grid,
.odio-archive__grid,
.odio-archive__grid--2,
.odio-archive__grid--4,
.odio-single-product__modules-grid,
.odio-single-sector__challenges-grid,
.odio-single-sector__cases-grid,
.odio-single-landing__form-wrap,
.odio-logos--grid {
	grid-template-columns: 1fr;
}

/* Hero variants — stack */
.odio-hero--split .odio-hero__inner,
.odio-hero--product .odio-hero__inner,
.odio-hero--sector .odio-hero__inner {
	grid-template-columns: 1fr;
	gap: var(--odio-space-8);
}

.odio-hero {
	padding-block: var(--odio-space-12);
}

.odio-hero__title {
	max-width: none;
	font-size: var(--odio-fs-3xl);
}

.odio-hero__subtitle {
	font-size: var(--odio-fs-base);
}

.odio-hero--landing {
	padding-block: var(--odio-space-16);
}

.odio-hero--product {
	padding-block: var(--odio-space-12);
}

.odio-hero--sector .odio-hero__stats {
	flex-direction: column;
	gap: var(--odio-space-4);
}

/* CTA bands — stack */
.odio-cta-band__inner {
	flex-direction: column;
	text-align: center;
}

.odio-cta-band__actions {
	width: 100%;
	flex-direction: column;
}

.odio-cta-band__actions .odio-btn {
	width: 100%;
}

/* Footer mobile accordion handled in layout.css */

/* Mega menu hidden — drawer handles nav */
.odio-header__menu > li.has-mega > a::after {
	display: none;
}

/* Stats — 2 columns on small phones */
.odio-stats {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--odio-space-4);
}

.odio-kpi {
	padding: var(--odio-space-4);
}

.odio-kpi__value {
	font-size: var(--odio-fs-2xl);
}

/* Process — single column */
.odio-process {
	grid-template-columns: 1fr;
}

/* Pricing — single column */
.odio-pricing {
	grid-template-columns: 1fr;
	max-width: 24rem;
	margin-inline: auto;
}

/* Logos — wrap tighter */
.odio-logos {
	gap: var(--odio-space-6) var(--odio-space-8);
}

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

/* Form inline — stack */
.odio-form--inline {
	flex-direction: column;
	align-items: stretch;
}

/* Section headers */
.odio-section__header {
	margin-bottom: var(--odio-space-8);
}

.odio-section__title {
	font-size: var(--odio-fs-2xl);
}

/* Announcement — wrap */
.odio-announcement__inner {
	flex-wrap: wrap;
	padding-block: var(--odio-space-4);
}

/* Sidebar — static on mobile */
.odio-sidebar {
	position: static;
}

/* Search form — stack */
.odio-search__form {
	flex-direction: column;
}

.odio-search__form .odio-btn {
	width: 100%;
}

/* Single product sidebar CTA — not sticky on mobile */
.odio-single-product__sidebar-cta {
	position: static;
}

/* Final CTA */
.odio-final-cta {
	padding-block: var(--odio-space-16);
}

.odio-final-cta__title {
	font-size: var(--odio-fs-2xl);
}

/* ═══════════════════════════════════════
   320px — iPhone SE / small phones
   ═══════════════════════════════════════ */

@media (min-width: 320px) {
	:root {
		--odio-gutter: clamp(1.15rem, 4.2vw, 1.4rem);
	}

	.odio-btn {
		padding-inline: var(--odio-space-5);
	}
}

@media (min-width: 320px) and (max-width: 767.98px) {
	.odio-hero__actions {
		flex-direction: row;
		flex-wrap: nowrap;
		align-items: stretch;
		width: 100%;
		gap: 0.4rem;
	}

	.odio-hero__actions .odio-btn {
		width: auto;
		flex: 1 1 0;
		min-width: 0;
		white-space: nowrap;
		justify-content: center;
		text-align: center;
	}
}

/* ═══════════════════════════════════════
   360px — Galaxy S series narrow
   ═══════════════════════════════════════ */

@media (min-width: 360px) {
	.odio-stats {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.odio-sticky-cta__inner {
		gap: var(--odio-space-4);
	}
}

/* ═══════════════════════════════════════
   375px — iPhone standard
   ═══════════════════════════════════════ */

@media (min-width: 375px) and (max-width: 767.98px) {
	.odio-hero__actions {
		flex-direction: row;
		align-items: stretch;
	}

	.odio-hero__actions .odio-btn {
		width: auto;
		flex: 1 1 0;
	}
}

@media (min-width: 375px) {
	.odio-card__body {
		padding: var(--odio-space-5);
	}
}

/* ═══════════════════════════════════════
   390px — iPhone 12/13/14
   ═══════════════════════════════════════ */

@media (min-width: 390px) {
	.odio-logos--grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.odio-drawer__panel {
		width: min(390px, 100%);
	}
}

/* ═══════════════════════════════════════
   412px — Pixel / large phones
   ═══════════════════════════════════════ */

@media (min-width: 412px) {
	.odio-feature-grid {
		grid-template-columns: 1fr;
	}

	.odio-comparison {
		grid-template-columns: 1fr;
	}
}

/* ═══════════════════════════════════════
   430px — iPhone Pro Max narrow
   ═══════════════════════════════════════ */

@media (min-width: 430px) {
	.odio-hero__title {
		font-size: var(--odio-fs-4xl);
	}

	.odio-section__title {
		font-size: var(--odio-fs-3xl);
	}
}

/* ═══════════════════════════════════════
   768px — Tablet portrait
   ═══════════════════════════════════════ */

@media (min-width: 768px) {
	:root {
		--odio-gutter: clamp(1.4rem, 2vw, 1.75rem);
	}

	/* Hide sticky CTA on tablet+ */
	.odio-sticky-cta {
		display: none;
	}

	body.has-sticky-cta {
		padding-bottom: 0;
	}

	/* Grids — 2 columns (nav/mega stay mobile until 960 — brand-ui) */
	.odio-grid--2,
	.odio-grid--3,
	.odio-grid--4,
	.odio-feature-grid,
	.odio-home-products__grid,
	.odio-home-testimonials__grid,
	.odio-archive__grid,
	.odio-single-product__modules-grid,
	.odio-single-sector__cases-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

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

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

	.odio-comparison,
	.odio-before-after,
	.odio-split,
	.odio-single-landing__form-wrap,
	.odio-single-sector__challenges-grid {
		grid-template-columns: 1fr 1fr;
	}

	.odio-pricing {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		max-width: none;
	}

	.odio-pricing__plan:last-child {
		grid-column: 1 / -1;
		max-width: 24rem;
		margin-inline: auto;
	}

	.odio-home-sectors__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

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

	.odio-form__row {
		grid-template-columns: 1fr 1fr;
	}

	/* Hero — split layouts (tablet+) */
	.odio-hero--split .odio-hero__inner {
		grid-template-columns: 1fr 1fr;
	}

	/* Product/module hero stays stacked until 960px (brand-ui) — avoid tablet squeeze */
	.odio-hero--product .odio-hero__inner {
		grid-template-columns: 1fr;
	}

	.odio-hero--sector .odio-hero__inner {
		grid-template-columns: 1fr 1fr;
	}

	.odio-hero--sector .odio-hero__stats {
		flex-direction: row;
	}

	/* Footer desktop spacing (structure in layout.css) */

	/* CTA band */
	.odio-cta-band__inner {
		flex-direction: row;
		text-align: left;
	}

	.odio-cta-band__actions {
		width: auto;
		flex-direction: row;
	}

	.odio-cta-band__actions .odio-btn {
		width: auto;
	}

	/* Content layout */
	.odio-content-layout {
		grid-template-columns: 1fr 280px;
	}

	.odio-content-layout--reverse {
		grid-template-columns: 280px 1fr;
	}

	.odio-sidebar {
		position: sticky;
		top: calc(var(--odio-header-height) + var(--odio-space-6));
	}

	.odio-single-product__sidebar-cta {
		position: sticky;
	}

	/* Search */
	.odio-search__form {
		flex-direction: row;
	}

	.odio-search__form .odio-btn {
		width: auto;
	}
}

/* ═══════════════════════════════════════
   820px — Tablet landscape / iPad
   ═══════════════════════════════════════ */

@media (min-width: 820px) {
	.odio-process {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.odio-pricing {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.odio-pricing__plan:last-child {
		grid-column: auto;
		max-width: none;
		margin-inline: 0;
	}

	.odio-home-sectors__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

/* ═══════════════════════════════════════
   1024px — Desktop
   ═══════════════════════════════════════ */

@media (min-width: 1024px) {
	:root {
		--odio-gutter: 1.5rem;
	}

	.odio-grid--3 {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.odio-grid--4,
	.odio-home-sectors__grid,
	.odio-archive__grid--4 {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.odio-feature-grid,
	.odio-home-products__grid,
	.odio-home-testimonials__grid,
	.odio-archive__grid,
	.odio-single-product__modules-grid,
	.odio-single-sector__cases-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.odio-content-layout {
		grid-template-columns: 1fr 320px;
	}

	.odio-content-layout--reverse {
		grid-template-columns: 320px 1fr;
	}

	.odio-hero {
		padding-block: var(--odio-space-16);
	}

	.odio-hero--landing {
		padding-block: var(--odio-space-24);
	}

	.odio-hero--product {
		padding-block: var(--odio-space-20);
	}

	.odio-hero__title {
		font-size: var(--odio-fs-display);
	}

	.odio-logos--grid {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}
}

/* ═══════════════════════════════════════
   1280px — Large desktop
   ═══════════════════════════════════════ */

@media (min-width: 1280px) {
	.odio-hero--split .odio-hero__inner {
		gap: var(--odio-space-16);
	}

	.odio-section__header {
		margin-bottom: var(--odio-space-12);
	}
}

/* ═══════════════════════════════════════
   1440px — Wide desktop
   Keep content width locked (no left/right stretch)
   ═══════════════════════════════════════ */

@media (min-width: 1440px) {
	:root {
		--odio-container: 1200px;
		--odio-container-wide: 1200px;
		--odio-gutter: 1.5rem;
	}

	.odio-hero--product .odio-hero__inner {
		gap: var(--odio-space-16);
	}

	.odio-split {
		gap: var(--odio-space-16);
	}

	.odio-feature-grid {
		gap: var(--odio-space-8);
	}

	.odio-card__body {
		padding: var(--odio-space-8);
	}
}

/* ═══════════════════════════════════════
   1920px — Full HD+
   Same content column as slider / smaller desktops
   ═══════════════════════════════════════ */

@media (min-width: 1920px) {
	:root {
		--odio-container: 1200px;
		--odio-container-wide: 1200px;
	}

	.odio-hero--landing {
		padding-block: clamp(6rem, 5rem + 4vw, 8rem);
	}

	.odio-section--lg {
		padding-block: clamp(5rem, 4rem + 3vw, 8rem);
	}
}

/* ═══════════════════════════════════════
   Touch device refinements
   ═══════════════════════════════════════ */

@media (hover: none) and (pointer: coarse) {
	.odio-card:hover {
		transform: none;
		box-shadow: var(--odio-shadow-sm);
	}

	.odio-card:hover .odio-card__media img {
		transform: none;
	}

	.odio-header__menu > li > a {
		padding: 0.5rem 0.6rem;
		min-height: 2.5rem;
	}

	.odio-drawer__menu a {
		min-height: 2.75rem;
		display: flex;
		align-items: center;
	}

	.odio-btn {
		min-height: 3rem;
	}

	.odio-faq__question {
		min-height: 3rem;
	}
}

/* ═══════════════════════════════════════
   Print
   ═══════════════════════════════════════ */

@media print {
	.odio-header,
	.odio-footer,
	.odio-announcement,
	.odio-sticky-cta,
	.odio-drawer,
	.odio-cta-band,
	.odio-final-cta {
		display: none !important;
	}

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

	.odio-section {
		padding-block: 1rem;
		break-inside: avoid;
	}

	a[href]::after {
		content: " (" attr(href) ")";
		font-size: 0.8em;
		color: #666;
	}
}

/* ═══════════════════════════════════════
   Reduced motion — responsive overrides
   ═══════════════════════════════════════ */

@media (prefers-reduced-motion: reduce) {
	.odio-drawer__panel,
	.odio-drawer__overlay,
	.odio-mega,
	.odio-reveal {
		transition: none !important;
	}

	.odio-drawer.is-open .odio-drawer__panel {
		transform: none;
	}
}
