/**
 * Our Approach page — responsive layout fixes.
 *
 * @package Deltraux
 */

.is-approach-page #main-content {
	overflow-x: clip;
}

.deltraux-approach {
	overflow-x: clip;
}

.deltraux-approach .hero-inner,
.deltraux-approach .hero-content,
.deltraux-approach .hero-diagram,
.deltraux-approach .arch-diagram,
.deltraux-approach .philosophy-intro,
.deltraux-approach .philosophy-blocks,
.deltraux-approach .philosophy-closing {
	min-width: 0;
	max-width: 100%;
}

/* Section 1 — Hero */
@media (max-width: 1024px) {
	.is-approach-page #main-content > .deltraux-approach > #hero {
		padding-top: 80px;
		padding-bottom: 80px;
	}

	.deltraux-approach .hero-inner {
		grid-template-columns: 1fr;
		gap: 48px;
		align-items: stretch;
	}

	.deltraux-approach .hero-diagram {
		max-width: 100%;
		width: 100%;
		justify-self: stretch;
	}

	.deltraux-approach .philosophy-blocks {
		display: flex;
		flex-direction: column;
	}

	.deltraux-approach .philosophy-block,
	.deltraux-approach .philosophy-block:nth-child(odd) {
		width: 100%;
		border-right: none;
	}
}

@media (max-width: 768px) {
	.is-approach-page #main-content > .deltraux-approach > #hero {
		padding-top: 64px;
		padding-bottom: 64px;
	}

	.deltraux-approach .hero-inner {
		gap: 36px;
	}

	.deltraux-approach .hero-content h1 {
		font-size: 30px;
		line-height: 1.25;
		margin-bottom: 24px;
	}

	.deltraux-approach .hero-content p {
		font-size: 15px;
		line-height: 1.75;
	}

	.deltraux-approach .arch-diagram {
		padding: 24px 20px;
	}

	.deltraux-approach .arch-diagram-label {
		margin-bottom: 20px;
	}

	.deltraux-approach .arch-layer {
		padding: 14px 16px;
	}

	/* Section 4 — Philosophy */
	.deltraux-approach #philosophy {
		padding-top: 64px;
		padding-bottom: 64px;
	}

	.deltraux-approach .philosophy-intro {
		margin-bottom: 32px;
	}

	.deltraux-approach .philosophy-intro h2 {
		font-size: 24px;
		margin-bottom: 16px;
	}

	.deltraux-approach .philosophy-intro p {
		font-size: 16px;
	}

	.deltraux-approach .philosophy-blocks {
		display: flex;
		flex-direction: column;
	}

	.deltraux-approach .philosophy-block {
		width: 100%;
		padding: 24px 20px 24px 18px;
		border-right: none;
	}

	.deltraux-approach .philosophy-block:nth-child(odd) {
		border-right: none;
	}

	.deltraux-approach .philosophy-closing {
		margin-top: 32px;
		padding: 24px 20px;
		max-width: none;
	}

	.deltraux-approach .philosophy-closing p {
		font-size: 17px;
		line-height: 1.5;
	}

	.deltraux-approach .hero-diagram .approach-reveal,
	.deltraux-approach #philosophy .approach-reveal {
		opacity: 1;
		transform: none;
		animation: none;
	}
}

@media (max-width: 480px) {
	.is-approach-page #main-content > .deltraux-approach > #hero {
		padding-top: 56px;
		padding-bottom: 56px;
	}

	.deltraux-approach .hero-inner {
		gap: 28px;
	}

	.deltraux-approach .hero-content h1 {
		font-size: 26px;
	}

	.deltraux-approach .philosophy-block h4 {
		font-size: 16px;
	}

	.deltraux-approach .philosophy-block p {
		font-size: 14px;
	}

	.deltraux-approach .philosophy-closing p {
		font-size: 16px;
	}
}