/* Stonebriar Smile Design — Laser Dentistry */

:where(.laser-hero, .laser-intro, .laser-platforms, .laser-treatment, .laser-uses, .laser-benefits, .laser-snore-video, .laser-airway, .laser-cta) figure,
:where(.laser-hero, .laser-intro, .laser-platforms, .laser-treatment, .laser-uses, .laser-benefits, .laser-snore-video, .laser-airway, .laser-cta) p {
	margin-top: 0;
}

:where(.laser-hero, .laser-intro, .laser-platforms, .laser-treatment, .laser-uses, .laser-benefits, .laser-snore-video, .laser-airway, .laser-cta) .button,
:where(.laser-hero, .laser-intro, .laser-platforms, .laser-treatment, .laser-uses, .laser-benefits, .laser-snore-video, .laser-airway, .laser-cta) .eyebrow {
	font-size: 0.8rem;
}

.laser-hero {
	display: grid;
	min-height: min(920px, 100dvh);
	grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
	color: var(--white);
	background: var(--navy-deep);
}

.laser-hero__content {
	display: flex;
	min-width: 0;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	padding: clamp(80px, 8vw, 132px) clamp(44px, 5vw, 104px);
}

.laser-hero .eyebrow,
.laser-hero .heading em {
	color: var(--gold-light);
}

.laser-hero .heading {
	width: 100%;
	max-width: 760px;
	margin: 0 0 30px;
	color: var(--white);
	font-size: clamp(3rem, 4.6vw, 5.15rem);
	letter-spacing: -0.052em;
	line-height: 0.98;
	text-wrap: balance;
}

.laser-hero .heading span,
.laser-hero .heading em {
	display: block;
}

.laser-hero .heading em {
	margin-top: 0.12em;
	font-family: var(--script);
	font-size: 0.68em;
	font-weight: 400;
	letter-spacing: 0;
	line-height: 1.08;
}

.laser-hero__lead {
	max-width: 650px;
	margin-bottom: 34px;
	color: rgba(255, 255, 255, 0.82);
	font-size: 18px;
	line-height: 1.6;
}

.laser-hero__actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 18px 28px;
}

.laser-text-link {
	display: inline-flex;
	min-height: 44px;
	align-items: center;
	gap: 14px;
	color: var(--navy);
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-decoration: none;
	text-transform: uppercase;
}

.laser-hero .laser-text-link {
	color: var(--white);
}

.laser-text-link span {
	font-size: 1.05rem;
	transition: transform 0.3s ease;
}

.laser-text-link:hover span,
.laser-text-link:focus-visible span {
	transform: translate(-3px, 3px);
}

.laser-hero__media,
.laser-treatment__media,
.laser-benefits__media {
	position: relative;
	margin: 0;
	overflow: hidden;
}

.laser-hero__media {
	min-height: 680px;
	background: #eef3f4;
}

.laser-hero__media::after,
.laser-treatment__media::after,
.laser-benefits__media::after {
	position: absolute;
	inset: 0;
	background: linear-gradient(0deg, rgba(17, 24, 49, 0.5), transparent 45%);
	content: "";
	pointer-events: none;
}

.laser-hero__media img,
.laser-treatment__media img,
.laser-benefits__media img {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 100vh;
	object-fit: cover;
}

.laser-hero__media figcaption,
.laser-treatment__media figcaption,
.laser-benefits__media figcaption {
	position: absolute;
	z-index: 2;
	right: clamp(22px, 4vw, 54px);
	bottom: clamp(22px, 4vw, 48px);
	max-width: 310px;
	padding: 16px 20px;
	border-left: 2px solid var(--gold-light);
	color: var(--white);
	background: rgba(17, 24, 49, 0.88);
	box-shadow: 0 14px 34px rgba(5, 10, 27, 0.24);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	font-family: var(--display);
	font-size: 0.8rem;
	letter-spacing: 0.1em;
	line-height: 1.6;
	text-transform: uppercase;
}

.laser-intro {
	background: var(--ivory);
}

.laser-intro__grid {
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
	gap: clamp(48px, 9vw, 130px);
}

.laser-intro__copy {
	padding-top: 34px;
}

.laser-platforms {
	padding: clamp(90px, 11vw, 150px) 0;
	background: var(--white);
}

.laser-platforms__header {
	max-width: 900px;
	margin: 0 auto 58px;
	text-align: center;
}

.laser-platforms__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	border-top: 1px solid var(--line);
	border-left: 1px solid var(--line);
}

.laser-platform {
	position: relative;
	min-height: 520px;
	padding: clamp(40px, 6vw, 76px);
	border-right: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
	background: linear-gradient(145deg, #fbfaf7, #eef6f8);
}

.laser-platform--navy {
	color: var(--white);
	background: var(--navy);
}

.laser-platform > span {
	display: block;
	margin-bottom: 48px;
	color: var(--gold-text);
	font-family: var(--display);
	font-size: 0.8rem;
	letter-spacing: 0.13em;
}

.laser-platform--navy > span {
	color: var(--gold-light);
}

.laser-platform .heading {
	margin: 0 0 20px;
	font-size: clamp(2rem, 4vw, 3.8rem);
}

.laser-platform--navy .heading {
	color: var(--white);
}

.laser-platform > p {
	color: var(--muted);
}

.laser-platform--navy > p {
	color: rgba(255, 255, 255, 0.78);
}

.laser-platform ul,
.laser-benefits__list {
	display: grid;
	gap: 10px;
	margin: 28px 0 0;
	padding: 0;
	list-style: none;
}

.laser-platform li,
.laser-benefits__list li {
	position: relative;
	padding: 14px 0 14px 36px;
	border-bottom: 1px solid var(--line);
	color: var(--navy);
	font-weight: 600;
}

.laser-platform--navy li {
	border-color: rgba(255, 255, 255, 0.16);
	color: var(--white);
}

.laser-platform li::before,
.laser-benefits__list li::before {
	position: absolute;
	top: 50%;
	left: 0;
	display: grid;
	width: 22px;
	height: 22px;
	place-items: center;
	border: 1px solid rgba(203, 156, 77, 0.48);
	border-radius: 50%;
	color: var(--gold-text);
	background: rgba(203, 156, 77, 0.1);
	content: "✦";
	font-size: 0.72rem;
	line-height: 1;
	transform: translateY(-50%);
}

.laser-platform--navy li::before {
	color: var(--gold-light);
}

.laser-treatment {
	padding: clamp(90px, 11vw, 150px) 0;
	background: var(--blue-soft);
}

.laser-treatment__grid,
.laser-benefits__grid {
	display: grid;
	align-items: center;
	grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
	gap: clamp(52px, 9vw, 130px);
}

.laser-treatment__media,
.laser-benefits__media {
	min-height: 610px;
	box-shadow: 0 28px 70px rgba(17, 24, 49, 0.13);
}

.laser-treatment__content .eyebrow,
.laser-treatment__content > .heading:not(.lead) em,
.laser-benefits__content .eyebrow,
.laser-benefits__content > .heading:not(.lead) em {
	color: var(--gold-text);
}

.laser-treatment__content > .heading:not(.lead),
.laser-benefits__content > .heading:not(.lead) {
	font-size: clamp(2.5rem, 4.5vw, 4.6rem);
}

.laser-treatment__content > p:not(.eyebrow, .lead),
.laser-benefits__content > p:not(.eyebrow, .lead) {
	color: var(--muted);
}

.laser-uses {
	background: var(--ivory);
}

.laser-uses .section-heading {
	margin-bottom: 58px;
}

.laser-uses__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	margin: 0;
	padding: 0;
	border-top: 1px solid var(--line);
	border-left: 1px solid var(--line);
	list-style: none;
}

.laser-uses__grid li {
	min-height: 300px;
	padding: clamp(30px, 3.5vw, 46px);
	border-right: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
	background: var(--white);
	transition: background-color 0.4s ease, transform 0.4s ease;
}

.laser-uses__grid li:hover {
	background: var(--blue-soft);
	transform: translateY(-3px);
}

.laser-uses__grid span {
	display: block;
	margin-bottom: 38px;
	color: var(--gold-text);
	font-family: var(--display);
	font-size: 0.8rem;
	letter-spacing: 0.13em;
}

.laser-uses__grid strong {
	display: block;
	margin-bottom: 14px;
	color: var(--navy);
	font-family: var(--display);
	font-size: clamp(1.35rem, 2vw, 1.8rem);
	font-weight: 500;
}

.laser-uses__grid p {
	margin-bottom: 0;
	color: var(--muted);
}

.laser-benefits {
	padding: clamp(90px, 11vw, 150px) 0;
	background: #e9f3f7;
}

.laser-benefits__media {
	order: 2;
}

.laser-benefits__content {
	order: 1;
}

.laser-snore-video {
	position: relative;
	overflow: hidden;
	padding: clamp(90px, 11vw, 150px) 0;
	background:
		radial-gradient(circle at 50% 58%, rgba(8, 155, 216, 0.09), transparent 38%),
		var(--ivory);
}

.laser-snore-video::before {
	position: absolute;
	top: 70px;
	left: 50%;
	width: min(72vw, 880px);
	aspect-ratio: 1;
	border: 1px solid rgba(203, 156, 77, 0.24);
	border-radius: 50%;
	content: "";
	pointer-events: none;
	transform: translateX(-50%);
}

.laser-snore-video .container {
	position: relative;
}

.laser-snore-video__header {
	max-width: 900px;
	margin: 0 auto 52px;
	text-align: center;
}

.laser-snore-video__header .eyebrow,
.laser-snore-video__header .heading em {
	color: var(--gold-text);
}

.laser-snore-video__header .heading {
	margin-bottom: 22px;
}

.laser-snore-video__header > p:last-child {
	max-width: 720px;
	margin: 0 auto;
	color: var(--muted);
}

.laser-snore-video__frame {
	width: min(100%, 960px);
	margin-inline: auto;
	padding: clamp(8px, 1vw, 12px);
	border: 1px solid rgba(203, 156, 77, 0.5);
	border-radius: 18px;
	background: var(--navy-deep);
	box-shadow:
		0 30px 70px rgba(17, 24, 49, 0.18),
		inset 0 0 0 3px rgba(255, 255, 255, 0.06);
}

.laser-snore-video__frame iframe {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	border: 0;
	border-radius: 10px;
}

.laser-airway {
	padding: clamp(90px, 11vw, 150px) 0;
	color: var(--white);
	background: var(--navy);
}

.laser-airway__grid {
	display: grid;
	align-items: center;
	grid-template-columns: minmax(280px, 0.75fr) minmax(0, 1.25fr);
	gap: clamp(48px, 9vw, 130px);
}

.laser-airway__symbol {
	width: min(100%, 440px);
	margin-inline: auto;
}

.laser-airway__symbol svg {
	display: block;
	width: 100%;
	height: auto;
}

.laser-airway .eyebrow,
.laser-airway .heading em {
	color: var(--gold-light);
}

.laser-airway .heading,
.laser-airway .lead {
	color: var(--white);
}

.laser-airway__content > p:not(.eyebrow, .lead) {
	color: rgba(255, 255, 255, 0.78);
}

.laser-airway .button {
	margin-top: 18px;
}

.laser-cta {
	position: relative;
	overflow: hidden;
	padding: clamp(100px, 12vw, 170px) 0;
	color: var(--white);
	background: var(--navy-deep);
	text-align: center;
}

.laser-cta__mark {
	position: absolute;
	top: 43%;
	left: 50%;
	width: clamp(420px, 40vw, 760px);
	aspect-ratio: 1;
	opacity: 0.05;
	pointer-events: none;
	transform: translate(-50%, -50%);
}

.laser-cta__mark img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.laser-cta .container {
	position: relative;
}

.laser-cta .eyebrow,
.laser-cta .heading em {
	color: var(--gold-light);
}

.laser-cta .heading {
	max-width: 980px;
	margin: 0 auto 24px;
	color: var(--white);
	font-size: clamp(2.8rem, 6vw, 4.4rem);
}

.laser-cta p:not(.eyebrow) {
	max-width: 720px;
	margin: 0 auto 36px;
	color: rgba(255, 255, 255, 0.78);
}

@media (max-width: 1100px) {
	.laser-hero {
		grid-template-columns: 1fr 1fr;
	}

	.laser-hero__content {
		padding-inline: 40px;
	}

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

@media (max-width: 900px) {
	.laser-hero,
	.laser-intro__grid,
	.laser-treatment__grid,
	.laser-benefits__grid,
	.laser-airway__grid {
		grid-template-columns: 1fr;
	}

	.laser-hero {
		min-height: 0;
	}

	.laser-hero__content {
		padding: 90px max(32px, calc((100vw - 720px) / 2));
	}

	.laser-hero__media {
		min-height: 580px;
	}

	.laser-intro__grid,
	.laser-treatment__grid,
	.laser-benefits__grid,
	.laser-airway__grid {
		gap: 48px;
	}

	.laser-intro__copy {
		padding-top: 0;
	}

	.laser-treatment__media,
	.laser-benefits__media {
		min-height: 540px;
	}

	.laser-benefits__media,
	.laser-benefits__content {
		order: initial;
	}
}

@media (max-width: 680px) {
	.laser-hero__content {
		padding: 72px 24px;
	}

	.laser-hero .heading {
		font-size: clamp(2.75rem, 13vw, 4.3rem);
	}

	.laser-hero__actions {
		align-items: flex-start;
		flex-direction: column;
	}

	.laser-hero__media,
	.laser-treatment__media,
	.laser-benefits__media {
		min-height: 430px;
	}

	.laser-hero__media figcaption,
	.laser-treatment__media figcaption,
	.laser-benefits__media figcaption {
		right: 18px;
		bottom: 18px;
		left: 18px;
		max-width: none;
	}

	.laser-platforms__grid,
	.laser-uses__grid {
		grid-template-columns: 1fr;
	}

	.laser-platform,
	.laser-uses__grid li {
		min-height: 0;
	}

	.laser-airway__symbol {
		width: min(82vw, 360px);
	}
}

@media (prefers-reduced-motion: reduce) {
	.laser-text-link span,
	.laser-uses__grid li {
		transition: none;
	}
}
