/* =========================================
   RESPONSIVE
========================================= */

@media (hover: none) and (pointer: coarse), (max-width: 1024px) and (pointer: coarse) {
	.custom-scrollbar {
		display: none;
		pointer-events: none;
	}
}


@media (min-width: 1800px) {
	#section-1 .section-note {
		max-width: min(980px, 48vw);
		font-size: clamp(34px, 1.75vw, 48px);
	}

	.section-copy {
		align-items: center;
	}

	.section-copy .section-inner--copy {
		width: 100%;
		max-width: none;
		justify-self: center;
		text-align: center;
	}

	.section-copy .eyebrow {
		text-align: center;
	}

	.section-copy h2,
	.section-break-heading {
		width: min(100%, calc(100vw - (var(--section-pad) * 2)));
		max-width: none;
		font-size: clamp(64px, 3.15vw, 88px);
		line-height: 0.92;
		white-space: nowrap;
		text-align: center;
	}

	.section-break-heading__word {
		white-space: nowrap;
	}

	.section-copy .section-inner--copy p:not(.eyebrow) {
		max-width: min(1180px, 62vw);
		margin-left: auto;
		margin-right: auto;
		font-size: clamp(36px, 1.8vw, 52px);
		text-align: center;
	}

	.gear-cluster--left {
		left: clamp(-44px, -1.6vw, -20px);
		top: calc(var(--app-height) * 1.54);
		width: clamp(640px, 34vw, 820px);
	}

	.gear-cluster--right {
		right: clamp(42px, 3.8vw, 120px);
		width: clamp(660px, 35vw, 840px);
	}

	.machine-plank--two {
		top: calc(var(--app-height) * 2.08);
	}

	.section-final {
		min-height: 100svh;
		min-height: var(--app-height);
		align-content: start;
		padding-top: clamp(86px, 8vh, 122px);
		padding-bottom: clamp(48px, 5vh, 72px);
	}

	.section-final h2 {
		max-width: 11ch;
		font-size: clamp(78px, 4.9vw, 124px);
	}

	.section-inner--final > p:not(.eyebrow) {
		max-width: 22ch;
		font-size: clamp(34px, 1.9vw, 50px);
	}

	.contact-block {
		right: clamp(72px, 6vw, 150px);
		top: clamp(86px, 7vh, 116px);
		width: clamp(620px, 38vw, 820px);
	}

	.contact-block__shell {
		min-height: 570px;
		padding: clamp(42px, 2.8vw, 58px);
	}

	.section-final__lower {
		bottom: clamp(82px, 7vh, 118px);
	}
}


@media (min-width: 901px) and (max-width: 1100px) {
	.section-final {
		padding-left: clamp(44px, 6vw, 70px);
		padding-right: clamp(44px, 6vw, 70px);
	}

	.section-inner--final {
		max-width: min(52vw, 560px);
	}

	.section-final h2 {
		max-width: 10.5ch;
		font-size: clamp(54px, 6.9vw, 72px);
	}

	.section-inner--final > p:not(.eyebrow) {
		max-width: 22ch;
	}

	.contact-block {
		right: clamp(44px, 6vw, 72px);
		top: clamp(104px, 16vh, 140px);
		width: clamp(288px, 31vw, 340px);
		touch-action: none;
		overscroll-behavior: contain;
	}

	.contact-block__shell {
		min-height: 280px;
		padding: clamp(20px, 2.5vw, 28px);
	}
}


@media (max-width: 900px) {
	:root {
		--section-pad: clamp(22px, 7vw, 48px);
	}

	.page-section {
		align-items: end;
		padding-bottom: clamp(52px, 12vh, 92px);
	}

	.section-hero {
		align-items: center;
		padding-top: var(--section-pad);
		padding-bottom: var(--section-pad);
	}

	h1,
	h2 {
		max-width: 10ch;
		font-size: clamp(52px, 17vw, 118px);
	}

	h2 {
		font-size: clamp(42px, 13vw, 86px);
	}

	.section-inner p:not(.eyebrow),
	.section-note {
		font-size: clamp(18px, 6vw, 30px);
	}

	.gate-note {
		font-size: 15px;
	}

	.flat-machine--hero {
		right: -8vw;
		bottom: 10vh;
		width: 62vw;
		height: 46vw;
		opacity: 0.22;
	}

	.flat-machine--side {
		right: -8vw;
		width: 52vw;
		opacity: 0.18;
	}

	.gate-panel {
		right: auto;
		left: var(--section-pad);
		top: clamp(32px, 7vh, 74px);
		max-width: min(370px, calc(100vw - var(--section-pad) * 2));
	}

	.gate-panel span {
		padding: 10px 12px;
		font-size: 10px;
	}

	.section-final {
		min-height: 150svh;
		min-height: calc(var(--app-height) + 50svh);
		padding-top: 72px;
		align-items: start;
	}


	.contact-block {
		position: relative;
		right: auto;
		top: auto;
		width: min(100%, 420px);
		margin-top: clamp(34px, 9vh, 74px);
		justify-self: start;
	}

	.contact-block__shell {
		min-height: 270px;
	}

	.contact-block__phone,
	.contact-block__email-link {
		grid-template-columns: 1fr;
		gap: 6px;
	}

	.contact-block__field-value {
		text-align: left;
	}

	.contact-block__copy {
		margin: 4px 0 0;
	}

	.section-final__lower {
		grid-template-columns: 1fr;
		bottom: 9svh;
	}
}


@media (min-width: 700px) and (max-width: 900px) and (orientation: portrait) {
	.section-hero {
		align-items: center;
		padding-top: clamp(42px, 7vh, 78px);
		padding-bottom: clamp(42px, 7vh, 78px);
	}

	.hero-title,
	h1 {
		max-width: 9.8ch;
		font-size: clamp(58px, 13.4vw, 104px);
		line-height: 0.98;
		letter-spacing: -0.055em;
	}

	.hero-title__word {
		margin-right: 0.04em;
	}

	.hero-physics-word {
		font-size: clamp(58px, 13.4vw, 104px);
		line-height: 0.98;
		letter-spacing: -0.055em;
	}

	.section-copy {
		min-height: 82svh;
		min-height: calc(var(--app-height) * 0.82);
		align-items: center;
		padding-top: clamp(72px, 8vh, 96px);
		padding-bottom: clamp(48px, 7vh, 78px);
	}

	.section-copy h2 {
		font-size: clamp(54px, 10.8vw, 84px);
		max-width: 11ch;
	}

	.section-final {
		min-height: 112svh;
		min-height: calc(var(--app-height) + 12svh);
		align-content: start;
		row-gap: 0;
		padding-top: clamp(54px, 7vh, 78px);
		padding-bottom: clamp(24px, 4vh, 44px);
	}

	.section-final h2 {
		font-size: clamp(50px, 9.8vw, 78px);
		max-width: 11ch;
	}

	.contact-block {
		width: min(100%, 526px);
		margin-top: clamp(6px, 1vh, 12px);
		transform: rotate(-1deg);
	}

	.contact-block__shell {
		min-height: 282px;
	}

	.section-final__lower {
		position: relative;
		left: auto;
		right: auto;
		bottom: auto;
		width: 100%;
		margin-top: clamp(12px, 2vh, 24px);
		align-self: start;
	}
}



@media (max-width: 540px) {
	:root {
		--section-pad: clamp(22px, 6.4vw, 30px);
	}

	.section-hero {
		align-items: center;
		justify-items: start;
		padding-top: clamp(34px, 6vh, 54px);
		padding-bottom: clamp(36px, 6vh, 56px);
	}

	.section-inner--hero {
		width: 100%;
		justify-self: start;
		text-align: left;
	}

	.hero-title,
	h1 {
		max-width: 7.4ch;
		margin-left: 0;
		margin-right: auto;
		font-size: clamp(58px, 15.6vw, 72px);
		line-height: 1.02;
		letter-spacing: -0.052em;
		text-align: left;
		justify-self: start;
	}

	.hero-title__word {
		display: block;
		width: fit-content;
		margin-right: auto;
		margin-bottom: 0.035em;
		text-align: left;
	}

	#section-1 .section-note,
	body.machine-triggered #section-1 .section-note {
		max-width: 15.5ch;
		margin-top: 18px;
		margin-left: clamp(36px, 10vw, 48px);
		font-size: clamp(20px, 5.8vw, 25px);
		transform: none !important;
	}

	.hero-physics-word {
		font-size: clamp(58px, 15.6vw, 72px);
		line-height: 1.02;
		letter-spacing: -0.052em;
	}

	.section-copy {
		min-height: 82svh;
		min-height: calc(var(--app-height) * 0.82);
		align-items: center;
		padding-top: clamp(42px, 7vh, 66px);
		padding-bottom: clamp(36px, 6vh, 58px);
	}

	.section-copy h2 {
		font-size: clamp(43px, 11.2vw, 54px);
		max-width: 10.4ch;
	}

	#section-2 .section-inner--copy p:not(.eyebrow),
	body.machine-triggered #section-2 .section-inner--copy p:not(.eyebrow):nth-of-type(2),
	body.machine-triggered #section-2 .section-inner--copy p:not(.eyebrow):nth-of-type(3) {
		transform: none !important;
	}

	.unlock-button {
		width: min(100%, 340px);
		padding: 16px 20px;
		justify-self: center;
	}

	.section-final {
		min-height: 114svh;
		min-height: calc(var(--app-height) + 14svh);
		align-content: start;
		row-gap: 0;
		padding-top: clamp(46px, 6vh, 62px);
		padding-bottom: clamp(24px, 4vh, 42px);
	}

	.section-final h2 {
		font-size: clamp(40px, 10.6vw, 50px);
		line-height: 0.94;
		max-width: 10.8ch;
	}

	.section-inner--final > p:not(.eyebrow) {
		max-width: 17ch;
		font-size: clamp(20px, 5.8vw, 25px);
	}

	.contact-block {
		width: min(100%, 440px);
		margin-top: clamp(8px, 1.4vh, 14px);
		touch-action: none;
		overscroll-behavior: contain;
	}

	.contact-block__shell {
		min-height: 258px;
		padding: clamp(20px, 5.4vw, 24px);
	}

	.section-final__lower {
		position: relative;
		left: auto;
		right: auto;
		bottom: auto;
		width: 100%;
		margin-top: clamp(12px, 2vh, 20px);
		align-self: start;
	}
}

@media (orientation: landscape) and (max-height: 520px) {
	.page-section {
		padding-top: 22px;
		padding-bottom: 22px;
	}

	.section-hero {
		align-items: center;
	}

	.gate-panel {
		display: none;
	}

	h1,
	h2 {
		font-size: clamp(42px, 12vw, 86px);
	}

	.section-inner p:not(.eyebrow),
	.section-note {
		font-size: clamp(16px, 3vw, 24px);
	}
}

@media (prefers-reduced-motion: reduce) {
	.scroll-container {
		scroll-behavior: auto;
	}

	.unlock-button,
	.custom-scrollbar__thumb {
		transition: none;
	}

	body.is-section-four .section-inner--final,
	body.is-section-four .contact-block,
	.contact-block__shell::before,
	.contact-block__shell::after,
	.contact-block__chip {
		animation: none;
	}

	.contact-block__shell {
		transform: none;
		transition: none;
	}
}

/* =========================================
   HERO PHYSICS RESPONSIVE
========================================= */

@media (max-width: 900px) {
	.hero-physics-word {
		font-size: clamp(52px, 17vw, 118px);
	}
}

@media (orientation: landscape) and (max-height: 520px) {
	.hero-physics-word {
		font-size: clamp(42px, 12vw, 86px);
	}
}

/* =========================================
   PATCH: SECTION 3 STACKING RESTORE
   Keep pool + physics objects behind the gate/button.
   Do not change pool size, water, or physics behaviour.
========================================= */

#section-3 .machine-pool {
	z-index: 1 !important;
}

#section-3 .section-inner--gate {
	z-index: 4;
	pointer-events: auto;
}

#section-3 .unlock-button {
	pointer-events: auto;
}
