/* ==========================================================================
   All Smiles Dental Care, redesign layer (theme 1.1.0)

   Loaded after style.css. style.css still carries the restored interior page
   styles; this file adds the design system and everything new: header,
   homepage sections and footer. New components use the sm- prefix so they
   never collide with the restored as- rules.

   Visual reference: docs/redesign/mockup-v1.png (navy palette, serif display
   type, cream and pale sky bands). Content is the practice's own.
   The earlier plum version is kept in docs/redesign/redesign-plum-v1.css.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Tokens
   -------------------------------------------------------------------------- */
:root {
	/* Colour, sampled from the mockup */
	--sm-primary: #1B2B4B;        /* buttons, brand, headings */
	--sm-ink: #14203A;            /* hover */
	--sm-heading: #1B2A4A;
	--sm-accent: #4B5A78;         /* eyebrows, secondary text, 6.9:1 on white */
	--sm-text: #4A5468;           /* body copy, 7.6:1 on white */
	--sm-link: #2C4470;

	--sm-bg: #FFFFFF;
	--sm-cream: #FAF5F1;          /* feature strip, bottom row */
	--sm-grey: #F7F7F8;           /* services band */
	--sm-sky: #E7EDF4;            /* quote band fallback */
	--sm-peach: #F7E6DC;          /* icon discs */
	--sm-line: #E4E7ED;
	--sm-footer: #1D2B48;
	--sm-on-dark: #E6EAF2;        /* 12:1 on --sm-footer */
	--sm-on-dark-muted: #B8C1D3;  /* 7.6:1 on --sm-footer */

	/* Type */
	--sm-font-body: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
	--sm-font-display: 'Crimson Text', Georgia, 'Times New Roman', serif;
	--sm-fs-lead: 1.0625rem;
	--sm-fs-small: .9375rem;
	--sm-fs-xs: .8125rem;
	--sm-fs-eyebrow: .6875rem;
	--sm-fs-h1: clamp(2.625rem, 1.5rem + 3.6vw, 4.25rem);
	--sm-fs-h2: clamp(2rem, 1.5rem + 1.7vw, 2.875rem);
	--sm-fs-h3: 1.625rem;

	/* Spacing scale */
	--sm-s1: 4px;
	--sm-s2: 8px;
	--sm-s3: 12px;
	--sm-s4: 16px;
	--sm-s5: 24px;
	--sm-s6: 32px;
	--sm-s7: 48px;
	--sm-s8: 64px;
	--sm-s9: 96px;

	/* Layout */
	--sm-container: 1180px;
	--sm-gutter: 24px;
	--sm-section: var(--sm-s9);
	--sm-radius: 4px;
	--sm-header-h: 76px;
	--sm-shadow: 0 1px 2px rgba(20, 32, 58, .05), 0 8px 24px rgba(20, 32, 58, .07);

	--sm-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");

	/* The restored stylesheet's palette, remapped so interior pages follow. */
	--as-plum: var(--sm-primary);
	--as-plum-dark: var(--sm-ink);
	--as-deep: var(--sm-link);
	--as-soft: var(--sm-accent);
	--as-mauve: var(--sm-accent);
	--as-heading: var(--sm-heading);
	--as-muted: var(--sm-accent);
	--as-rule: #C9D0DD;
	--as-body: var(--sm-text);
	--as-bar: var(--sm-primary);
}

@media (max-width: 767px) {
	:root {
		--sm-gutter: 20px;
		--sm-section: var(--sm-s8);
		--sm-header-h: 66px;
	}
}

/* --------------------------------------------------------------------------
   2. Base and site-wide type
   -------------------------------------------------------------------------- */
html { scroll-padding-top: calc(var(--sm-header-h) + 16px); }

body {
	color: var(--sm-text);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

.sm-container {
	width: 100%;
	max-width: var(--sm-container);
	margin-inline: auto;
	padding-inline: var(--sm-gutter);
}

.sm-visually-hidden,
.sm-home .screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

.sm-skip {
	position: absolute;
	left: 16px;
	top: -80px;
	z-index: 1000;
	padding: 10px 16px;
	border-radius: var(--sm-radius);
	background: var(--sm-primary);
	color: #fff;
	font-weight: 600;
	text-decoration: none;
}
.sm-skip:focus { top: 12px; color: #fff; }

:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 2px solid var(--sm-primary);
	outline-offset: 3px;
}

/* Interior pages keep their restored layout on a calm cream ground; headings
   move to the display serif so the whole site shares one type system. */
.as-content { background: var(--sm-cream); }
.as-section-heading,
.as-content h2,
.as-content h3,
.as-content h4 {
	font-family: var(--sm-font-display);
	color: var(--sm-heading);
	letter-spacing: -.005em;
}
.as-section-heading { font-size: var(--sm-fs-h2); font-weight: 400; line-height: 1.15; }
.as-content h2 { font-size: 1.875rem; line-height: 1.2; }
.as-content h3 { font-size: 1.5rem; font-weight: 600; line-height: 1.25; }
.as-content h4 { font-size: 1.25rem; font-weight: 600; }
.as-page-intro { font-family: var(--sm-font-display); font-size: 1.25rem; }
.as-interior-phone { font-size: 1rem; letter-spacing: .04em; background-color: var(--sm-primary); }
.as-content hr { border-color: var(--sm-line); }

/* --------------------------------------------------------------------------
   3. Buttons and links
   -------------------------------------------------------------------------- */
.sm-btn,
body .sm-home .wp-block-button__link,
body .sm-home .wp-block-search__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 46px;
	padding: 11px 24px;
	border: 1.5px solid transparent;
	border-radius: 999px;
	font-family: var(--sm-font-body);
	font-size: .875rem;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: .01em;
	text-transform: none;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

.sm-btn--primary,
body .sm-home .wp-block-button:not(.is-style-outline) .wp-block-button__link,
body .sm-home .wp-block-search__button {
	background-color: var(--sm-primary);
	border-color: var(--sm-primary);
	color: #fff;
}
.sm-btn--primary:hover,
.sm-btn--primary:focus-visible,
body .sm-home .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
body .sm-home .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus-visible,
body .sm-home .wp-block-search__button:hover {
	background-color: var(--sm-ink);
	border-color: var(--sm-ink);
	color: #fff;
}

.sm-btn--ghost,
body .sm-home .wp-block-button.is-style-outline .wp-block-button__link {
	background-color: transparent;
	border-color: var(--sm-primary);
	color: var(--sm-primary);
}
.sm-btn--ghost:hover,
.sm-btn--ghost:focus-visible,
body .sm-home .wp-block-button.is-style-outline .wp-block-button__link:hover,
body .sm-home .wp-block-button.is-style-outline .wp-block-button__link:focus-visible {
	background-color: var(--sm-primary);
	border-color: var(--sm-primary);
	color: #fff;
}

body .sm-home .sm-arrow .wp-block-button__link::after,
.sm-link-arrow a::after {
	content: "";
	flex: 0 0 auto;
	width: 16px;
	height: 16px;
	background-color: currentColor;
	-webkit-mask: var(--sm-arrow) center / contain no-repeat;
	mask: var(--sm-arrow) center / contain no-repeat;
	transition: transform .2s ease;
}
body .sm-home .sm-arrow .wp-block-button__link:hover::after,
.sm-link-arrow a:hover::after { transform: translateX(3px); }

.sm-home .sm-link-arrow { margin: 0; }
.sm-link-arrow a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding-block: 6px;
	color: var(--sm-primary);
	font-size: .8125rem;
	font-weight: 700;
	letter-spacing: .01em;
	text-decoration: none;
}
.sm-link-arrow a:hover { color: var(--sm-ink); text-decoration: underline; text-underline-offset: 3px; }

.sm-icon-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--sm-heading);
	cursor: pointer;
	transition: background-color .2s ease, color .2s ease;
}
.sm-icon-btn:hover { background-color: var(--sm-grey); color: var(--sm-primary); }

.sm-header svg,
.sm-footer svg,
.sm-to-top svg {
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* --------------------------------------------------------------------------
   4. Header
   -------------------------------------------------------------------------- */
.as-header {
	position: sticky;
	top: 0;
	z-index: 100;
	text-align: left;
	color: inherit;
	background: #fff;
}
.admin-bar .as-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .as-header { top: 46px; } }
@media (max-width: 600px) { .admin-bar .as-header { top: 0; } }

.sm-header {
	background: #fff;
	border-bottom: 1px solid var(--sm-line);
	transition: box-shadow .25s ease;
}
.sm-header.is-scrolled { box-shadow: 0 6px 24px rgba(20, 32, 58, .06); }

.sm-header__bar {
	display: flex;
	align-items: center;
	gap: var(--sm-s5);
	min-height: var(--sm-header-h);
}

.sm-brand {
	display: inline-flex;
	flex-direction: column;
	flex: 0 0 auto;
	text-decoration: none;
	line-height: 1;
}
.sm-brand__name {
	font-family: var(--sm-font-display);
	font-size: 1.875rem;
	font-weight: 400;
	line-height: 1.05;
	letter-spacing: -.01em;
	color: var(--sm-primary);
	transition: color .2s ease;
}
.sm-brand__sub {
	margin-top: 8px;
	font-size: .625rem;
	font-weight: 600;
	letter-spacing: .24em;
	text-transform: uppercase;
	color: var(--sm-accent);
}
.sm-brand:hover .sm-brand__name { color: var(--sm-ink); }

.sm-header__actions {
	display: flex;
	align-items: center;
	gap: var(--sm-s3);
	margin-left: auto;
}
.sm-header__cta { min-height: 40px; padding: 9px 20px; font-size: .8125rem; }

.sm-nav__list,
.sm-nav__sub {
	list-style: none;
	margin: 0;
	padding: 0;
}
.sm-nav__link { text-decoration: none; }
.sm-nav__toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 0;
	background: transparent;
	color: inherit;
	cursor: pointer;
}
.sm-nav__toggle svg { transition: transform .2s ease; }

.sm-search {
	border-top: 1px solid var(--sm-line);
	background: var(--sm-grey);
}
.sm-search__form {
	display: flex;
	gap: var(--sm-s3);
	padding-block: var(--sm-s4);
}
.sm-search__form input {
	flex: 1 1 auto;
	min-width: 0;
	min-height: 46px;
	padding: 0 var(--sm-s4);
	border: 1px solid var(--sm-line);
	border-radius: var(--sm-radius);
	background: #fff;
	font: inherit;
	color: var(--sm-heading);
}

/* Desktop navigation: plain items as in the mockup. Submenus open on hover
   and focus; the disclosure buttons stay available to keyboard users and
   become visible when focused. */
@media (min-width: 1140px) {
	.sm-nav { margin-inline: auto; }
	.sm-nav__list { display: flex; align-items: center; gap: var(--sm-s6); }
	.sm-nav__item { position: relative; display: flex; align-items: center; }

	.sm-nav__list > .sm-nav__item > .sm-nav__link {
		position: relative;
		display: block;
		padding: 14px 0;
		font-size: .8125rem;
		font-weight: 400;
		color: #3A4356;
		white-space: nowrap;
	}
	.sm-nav__list > .sm-nav__item > .sm-nav__link::after {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		bottom: 4px;
		height: 2px;
		background: var(--sm-primary);
		transform: scaleX(0);
		transition: transform .2s ease;
	}
	.sm-nav__list > .sm-nav__item > .sm-nav__link:hover::after,
	.sm-nav__list > .sm-nav__item.is-current > .sm-nav__link::after,
	.sm-nav__list > .sm-nav__item.is-current-ancestor > .sm-nav__link::after { transform: scaleX(1); }
	.sm-nav__list > .sm-nav__item > .sm-nav__link:hover,
	.sm-nav__list > .sm-nav__item.is-current > .sm-nav__link,
	.sm-nav__list > .sm-nav__item.is-current-ancestor > .sm-nav__link { color: var(--sm-primary); }

	.sm-nav__list > .sm-nav__item > .sm-nav__toggle {
		position: absolute;
		right: -18px;
		width: 16px;
		height: 24px;
		color: var(--sm-accent);
		opacity: 0;
	}
	.sm-nav__list > .sm-nav__item > .sm-nav__toggle:focus-visible,
	.sm-nav__item.is-open > .sm-nav__toggle { opacity: 1; }
	.sm-nav__toggle svg { width: 12px; height: 12px; stroke-width: 2.2; }
	.sm-nav__item.is-open > .sm-nav__toggle svg { transform: rotate(180deg); }

	.sm-nav__sub {
		position: absolute;
		top: 100%;
		left: -16px;
		z-index: 20;
		min-width: 240px;
		padding: var(--sm-s2);
		border: 1px solid var(--sm-line);
		border-radius: 6px;
		background: #fff;
		box-shadow: var(--sm-shadow);
		opacity: 0;
		visibility: hidden;
		transform: translateY(6px);
		transition: opacity .18s ease, transform .18s ease, visibility 0s linear .18s;
	}
	.sm-nav__item:hover > .sm-nav__sub,
	.sm-nav__item:focus-within > .sm-nav__sub,
	.sm-nav__item.is-open > .sm-nav__sub {
		opacity: 1;
		visibility: visible;
		transform: none;
		transition: opacity .18s ease, transform .18s ease, visibility 0s;
	}
	.sm-nav__sub .sm-nav__item { width: 100%; }
	.sm-nav__sub .sm-nav__link {
		flex: 1 1 auto;
		display: block;
		padding: 9px 12px;
		border-radius: var(--sm-radius);
		font-size: .8125rem;
		color: var(--sm-text);
		white-space: nowrap;
	}
	.sm-nav__sub .sm-nav__link:hover,
	.sm-nav__sub .is-current > .sm-nav__link { background: var(--sm-grey); color: var(--sm-primary); }
	.sm-nav__sub .sm-nav__toggle { width: 28px; height: 32px; color: var(--sm-accent); }
	.sm-nav__sub .sm-nav__toggle svg,
	.sm-nav__sub .sm-nav__item.is-open > .sm-nav__toggle svg { transform: rotate(-90deg); }

	/* Third level flies out to the right; the ::before bridges the gap so the
	   pointer can travel across without the panel closing. */
	.sm-nav__sub .sm-nav__sub { top: -9px; left: calc(100% + 8px); }
	.sm-nav__sub .sm-nav__sub::before {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		left: -12px;
		width: 12px;
	}

	.sm-nav__mobile-cta,
	.sm-menu-toggle,
	.sm-header__call { display: none; }
	.sm-header__actions { margin-left: 0; }
}

@media (min-width: 1140px) and (max-width: 1279px) {
	.sm-nav__list { gap: var(--sm-s5); }
	.sm-brand__name { font-size: 1.625rem; }
}

/* Compact navigation: panel below the bar */
@media (max-width: 1139.98px) {
	.sm-header__cta { display: none; }

	.sm-nav {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		top: var(--sm-panel-top, var(--sm-header-h));
		z-index: 90;
		display: none;
		overflow-y: auto;
		overscroll-behavior: contain;
		padding: var(--sm-s3) var(--sm-gutter) var(--sm-s7);
		border-top: 1px solid var(--sm-line);
		background: #fff;
	}
	.sm-nav.is-open { display: block; }

	.sm-nav__item {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		border-bottom: 1px solid var(--sm-line);
	}
	.sm-nav__link {
		flex: 1 1 auto;
		padding: 14px 2px;
		font-size: 1.0625rem;
		font-weight: 600;
		color: var(--sm-heading);
	}
	.sm-nav__item.is-current > .sm-nav__link { color: var(--sm-link); }
	.sm-nav__toggle { width: 44px; height: 44px; color: var(--sm-accent); }
	.sm-nav__toggle svg { width: 18px; height: 18px; }
	.sm-nav__item.is-open > .sm-nav__toggle svg { transform: rotate(180deg); }

	.sm-nav__sub {
		display: none;
		flex-basis: 100%;
		margin: 0 0 var(--sm-s3);
		padding-left: var(--sm-s4);
		border-left: 2px solid var(--sm-peach);
	}
	.sm-nav__item.is-open > .sm-nav__sub { display: block; }
	.sm-nav__sub .sm-nav__item { border-bottom: 0; }
	.sm-nav__sub .sm-nav__link { padding: 10px 2px; font-size: 1rem; font-weight: 400; color: var(--sm-text); }

	.sm-nav__mobile-cta {
		display: grid;
		gap: var(--sm-s3);
		margin-top: var(--sm-s5);
	}

	body.sm-menu-open { overflow: hidden; }
}

@media (max-width: 767px) {
	.sm-brand__name { font-size: 1.5rem; }
	.sm-header__bar { gap: var(--sm-s3); }
	.sm-header__actions { gap: 0; }
}
@media (max-width: 359px) {
	.sm-brand__name { font-size: 1.25rem; }
	.sm-search-toggle { display: none; }
}

.sm-burger {
	position: relative;
	display: block;
	width: 22px;
	height: 16px;
}
.sm-burger span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	border-radius: 2px;
	background: currentColor;
	transition: transform .2s ease, opacity .2s ease, top .2s ease;
}
.sm-burger span:nth-child(1) { top: 0; }
.sm-burger span:nth-child(2) { top: 7px; }
.sm-burger span:nth-child(3) { top: 14px; }
.sm-menu-toggle[aria-expanded="true"] .sm-burger span:nth-child(1) { top: 7px; transform: rotate(45deg); }
.sm-menu-toggle[aria-expanded="true"] .sm-burger span:nth-child(2) { opacity: 0; }
.sm-menu-toggle[aria-expanded="true"] .sm-burger span:nth-child(3) { top: 7px; transform: rotate(-45deg); }

/* --------------------------------------------------------------------------
   5. Homepage: shared pieces
   -------------------------------------------------------------------------- */
.sm-home { display: block; }
.sm-home > * { margin-block: 0; }
.sm-home p { margin: 0 0 var(--sm-s4); line-height: 1.75; }
.sm-home figure { margin: 0; }
.sm-home img { display: block; max-width: 100%; height: auto; }
.sm-home .has-text-align-center { text-align: center; }
.sm-home .wp-block-column { min-width: 0; margin: 0; }

.sm-section { padding: var(--sm-section) var(--sm-gutter); }

.sm-home .sm-eyebrow {
	margin: 0 0 var(--sm-s4);
	font-size: var(--sm-fs-eyebrow);
	font-weight: 600;
	line-height: 1.5;
	letter-spacing: .24em;
	text-transform: uppercase;
	color: var(--sm-accent);
}

.sm-home .sm-h2 {
	margin: 0 0 var(--sm-s5);
	font-family: var(--sm-font-display);
	font-size: var(--sm-fs-h2);
	font-weight: 400;
	line-height: 1.1;
	letter-spacing: -.01em;
	color: var(--sm-heading);
	text-wrap: balance;
}

.sm-home .sm-lead { font-size: var(--sm-fs-small); color: var(--sm-text); }

.sm-home .wp-block-buttons.sm-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--sm-s3) var(--sm-s4);
	margin: 0;
}
.sm-home .wp-block-button { margin: 0; }

/* --------------------------------------------------------------------------
   6. Hero: full-bleed photograph with a light wash on the left
   -------------------------------------------------------------------------- */
.sm-home .sm-hero {
	position: relative;
	overflow: hidden;
	background: #F4F5F7;
	padding: 0;
}

/* The grid stays static so the media column anchors to .sm-hero and can
   spread across the whole band, while the text sits in the centred grid. */
.sm-home .sm-hero__grid {
	position: static;
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	align-items: center;
	gap: 0;
	max-width: var(--sm-container);
	min-height: clamp(500px, 38vw, 620px);
	margin: 0 auto;
	padding: 0 var(--sm-gutter);
}

.sm-home .sm-hero__content {
	position: relative;
	z-index: 2;
	max-width: 560px;
	padding-block: var(--sm-s8);
}

.sm-home .sm-hero__title {
	margin: 0 0 var(--sm-s5);
	font-family: var(--sm-font-display);
	font-size: var(--sm-fs-h1);
	font-weight: 400;
	line-height: 1;
	letter-spacing: -.02em;
	color: var(--sm-heading);
	text-wrap: balance;
}

.sm-home .sm-hero__text {
	max-width: 30em;
	margin-bottom: var(--sm-s6);
	font-size: var(--sm-fs-lead);
	line-height: 1.7;
	color: #2F3A4F;
}

.sm-home .sm-hero__media {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1;
}
.sm-home .sm-hero__img,
.sm-home .sm-hero__img img {
	width: 100%;
	height: 100%;
}
.sm-home .sm-hero__img img {
	object-fit: cover;
	object-position: 70% 30%;
}
.sm-home .sm-hero__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(246, 247, 249, .96) 0%, rgba(246, 247, 249, .9) 30%, rgba(246, 247, 249, .35) 50%, rgba(246, 247, 249, 0) 62%);
	pointer-events: none;
}

@media (max-width: 899.98px) {
	.sm-home .sm-hero__grid {
		grid-template-columns: minmax(0, 1fr);
		min-height: 0;
		padding: 0;
	}
	.sm-home .sm-hero__media {
		position: relative;
		order: -1;
		height: clamp(280px, 64vw, 480px);
	}
	.sm-home .sm-hero__img img { object-position: 64% 30%; }
	.sm-home .sm-hero__media::after {
		background: linear-gradient(0deg, #F4F5F7 0%, rgba(244, 245, 247, 0) 28%);
	}
	.sm-home .sm-hero__content {
		max-width: none;
		padding: var(--sm-s2) var(--sm-gutter) var(--sm-s8);
	}
}

@media (max-width: 479.98px) {
	.sm-home .sm-hero__title { font-size: 2.5rem; }
	.sm-home .sm-hero .wp-block-buttons.sm-actions { flex-direction: column; align-items: stretch; }
	.sm-home .sm-hero .wp-block-button__link { width: 100%; }
}

/* --------------------------------------------------------------------------
   7. Feature strip (the four procedure groups)
   -------------------------------------------------------------------------- */
.sm-home .sm-features-band {
	padding: 0 var(--sm-gutter);
	background: var(--sm-cream);
}

.sm-home .sm-features {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0;
	max-width: var(--sm-container);
	margin: 0 auto;
	padding: var(--sm-s6) 0 var(--sm-s7);
}

.sm-home .sm-feature {
	position: relative;
	padding: 0 var(--sm-s5);
	text-align: center;
}
.sm-home .sm-feature + .sm-feature::before {
	content: "";
	position: absolute;
	left: 0;
	top: 30%;
	bottom: 0;
	width: 1px;
	background: #ECE3DC;
}

.sm-home .sm-feature__title {
	margin: 0 0 var(--sm-s2);
	font-family: var(--sm-font-display);
	font-size: 1.3125rem;
	font-weight: 400;
	line-height: 1.2;
	color: var(--sm-heading);
}
.sm-home .sm-feature__title::before {
	content: "";
	display: block;
	width: 56px;
	height: 56px;
	margin: 0 auto var(--sm-s4);
	border-radius: 50%;
	background: var(--sm-peach) var(--sm-icon) center / 26px no-repeat;
}
.sm-home .sm-feature__title a { color: inherit; text-decoration: none; }
.sm-home .sm-feature__title a:hover { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }

.sm-home .sm-feature__text {
	max-width: 26ch;
	margin: 0 auto;
	font-size: .8125rem;
	line-height: 1.7;
}

.sm-feature--prevention { --sm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231B2A4A' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 3c-2.2 0-4 1.8-4 4.2 0 1.9.7 3.3 1.3 4.8.6 1.6.8 3.4 1.1 5.1.3 1.9.8 3.9 2.1 3.9 1.5 0 1.6-2.6 2-4.4.2-1 .8-1.6 1.5-1.6s1.3.6 1.5 1.6c.4 1.8.5 4.4 2 4.4 1.3 0 1.8-2 2.1-3.9.3-1.7.5-3.5 1.1-5.1.6-1.5 1.3-2.9 1.3-4.8C21 4.8 19.2 3 17 3c-1.9 0-3 1-5 1S8.9 3 7 3z'/%3E%3C/svg%3E"); }
.sm-feature--cosmetic { --sm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231B2A4A' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 3l1.9 5.1L18 10l-5.1 1.9L11 17l-1.9-5.1L4 10l5.1-1.9z'/%3E%3Cpath d='M18.5 14.5l.8 2.2 2.2.8-2.2.8-.8 2.2-.8-2.2-2.2-.8 2.2-.8z'/%3E%3C/svg%3E"); }
.sm-feature--periodontal { --sm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231B2A4A' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l7 3v5c0 4.6-3 8.6-7 10-4-1.4-7-5.4-7-10V6z'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E"); }
.sm-feature--restorations { --sm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231B2A4A' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 17 3 8l5 4 4-7 4 7 5-4-1 9z'/%3E%3Cpath d='M5 20.5h14'/%3E%3C/svg%3E"); }

@media (max-width: 999.98px) {
	.sm-home .sm-features { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: var(--sm-s7); }
	.sm-home .sm-feature:nth-child(odd)::before { display: none; }
}

@media (max-width: 559.98px) {
	.sm-home .sm-features { grid-template-columns: minmax(0, 1fr); row-gap: var(--sm-s5); padding-block: var(--sm-s6); }
	.sm-home .sm-feature { min-height: 56px; padding: 0 0 0 72px; text-align: left; }
	.sm-home .sm-feature + .sm-feature::before { display: none; }
	.sm-home .sm-feature__title::before { position: absolute; left: 0; top: 0; margin: 0; }
	.sm-home .sm-feature__text { max-width: none; margin: 0; font-size: .875rem; }
}

/* --------------------------------------------------------------------------
   8. About
   -------------------------------------------------------------------------- */
.sm-home .sm-about { background: #fff; padding-block: var(--sm-s5); }

.sm-home .sm-about__grid {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	align-items: center;
	gap: clamp(32px, 6vw, 96px);
	max-width: calc(var(--sm-container) - 2 * var(--sm-gutter));
	margin: 0 auto;
}

.sm-home .sm-about__img img {
	width: 100%;
	aspect-ratio: 5 / 4;
	object-fit: cover;
}

.sm-home .sm-about__content { padding-block: var(--sm-s5); }
.sm-home .sm-about__content > p:not(.sm-eyebrow) { max-width: 34em; }

.sm-home .sm-about__footer {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--sm-s4) var(--sm-s5);
	margin-top: var(--sm-s5);
}

.sm-home .sm-signoff {
	margin: 0;
	font-family: var(--sm-font-display);
	font-size: 1.75rem;
	font-style: italic;
	line-height: 1.1;
	color: var(--sm-heading);
	transform: rotate(-4deg);
}

@media (max-width: 899.98px) {
	.sm-home .sm-about { padding-block: var(--sm-section); }
	.sm-home .sm-about__grid { grid-template-columns: minmax(0, 1fr); }
	.sm-home .sm-about__img img { aspect-ratio: 16 / 11; }
	.sm-home .sm-about__content { padding-block: 0; }
	.sm-home .sm-signoff { transform: none; }
}

/* --------------------------------------------------------------------------
   9. Services cards
   -------------------------------------------------------------------------- */
.sm-home .sm-services { background: var(--sm-grey); padding-block: var(--sm-s6) var(--sm-s7); }

.sm-home .sm-section__head {
	max-width: 720px;
	margin: 0 auto var(--sm-s6);
	text-align: center;
}
.sm-home .sm-section__head .sm-eyebrow { margin-bottom: var(--sm-s3); }
.sm-home .sm-section__head .sm-h2 { margin-bottom: var(--sm-s3); }
.sm-home .sm-section__head .sm-lead { margin: 0; }

.sm-home .sm-cards {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--sm-s5);
	max-width: calc(var(--sm-container) - 2 * var(--sm-gutter));
	margin: 0 auto;
}

.sm-home .sm-card {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	padding: 4px 4px var(--sm-s5);
	border: 1px solid var(--sm-line);
	border-radius: var(--sm-radius);
	background: #fff;
	box-shadow: 0 1px 3px rgba(20, 32, 58, .06);
	transition: box-shadow .25s ease, transform .25s ease;
}
.sm-home .sm-card:hover { box-shadow: var(--sm-shadow); transform: translateY(-2px); }

.sm-home .sm-card__img { margin: 0 0 var(--sm-s4); }
.sm-home .sm-card__img img {
	width: 100%;
	aspect-ratio: 26 / 10;
	object-fit: cover;
	border-radius: 2px;
}

.sm-home .sm-card__title {
	margin: 0 var(--sm-s4) var(--sm-s2);
	font-family: var(--sm-font-display);
	font-size: var(--sm-fs-h3);
	font-weight: 400;
	line-height: 1.15;
	color: var(--sm-heading);
}
.sm-home .sm-card__text {
	margin: 0 var(--sm-s4) var(--sm-s3);
	font-size: var(--sm-fs-xs);
	line-height: 1.7;
}
.sm-home .sm-card .sm-link-arrow { margin: auto var(--sm-s4) 0; }

@media (min-width: 600px) and (max-width: 899.98px) {
	.sm-home .sm-cards { grid-template-columns: minmax(0, 1fr); }
	.sm-home .sm-card {
		display: grid;
		grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
		grid-template-rows: auto auto 1fr;
		column-gap: var(--sm-s5);
		padding: 0;
	}
	.sm-home .sm-card__img { grid-row: 1 / span 3; margin: 0; }
	.sm-home .sm-card__img img { height: 100%; min-height: 200px; aspect-ratio: auto; border-radius: 0; }
	.sm-home .sm-card__title { margin: var(--sm-s5) var(--sm-s5) var(--sm-s2) 0; }
	.sm-home .sm-card__text { margin: 0 var(--sm-s5) var(--sm-s3) 0; }
	.sm-home .sm-card .sm-link-arrow { margin: 0 var(--sm-s5) var(--sm-s5) 0; align-self: end; }
}

@media (max-width: 599.98px) {
	.sm-home .sm-cards { grid-template-columns: minmax(0, 1fr); }
	.sm-home .sm-card__img img { aspect-ratio: 16 / 9; }
	.sm-home .sm-card__text { font-size: .875rem; }
}

/* --------------------------------------------------------------------------
   10. Quote band
   -------------------------------------------------------------------------- */
.sm-home .sm-quote {
	padding: var(--sm-s7) var(--sm-gutter);
	background: linear-gradient(rgba(240, 244, 249, .45), rgba(240, 244, 249, .45)), var(--sm-sky) url(../images/band-hills.jpg) center 62% / cover no-repeat;
}

.sm-home .sm-quote__grid {
	display: grid !important;
	grid-template-columns: minmax(0, 520px) auto;
	align-items: end;
	justify-content: space-between;
	gap: var(--sm-s5);
	max-width: calc(var(--sm-container) - 2 * var(--sm-gutter));
	margin: 0 auto;
	padding-left: clamp(0px, 14vw, 200px);
}

.sm-home .sm-quote__body { position: relative; padding-left: 52px; }
.sm-home .sm-quote__body::before {
	content: "\201C";
	position: absolute;
	left: 0;
	top: -18px;
	font-family: var(--sm-font-display);
	font-size: 4.5rem;
	font-weight: 600;
	line-height: 1;
	color: #5A6C8E;
}

.sm-home .sm-quote__text {
	margin: 0 0 var(--sm-s5);
	font-size: 1.125rem;
	line-height: 1.6;
	color: var(--sm-heading);
}
.sm-home .sm-quote__text::after { content: "\201D"; }

.sm-home .sm-quote__by {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: 44px;
	margin: 0;
	padding-left: 58px;
	font-size: var(--sm-fs-xs);
	line-height: 1.45;
	color: var(--sm-accent);
}
.sm-home .sm-quote__by strong { color: var(--sm-heading); font-weight: 600; }
.sm-home .sm-quote__by::before {
	content: "AS";
	position: absolute;
	left: 0;
	top: 50%;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border: 2px solid #fff;
	border-radius: 50%;
	background: var(--sm-primary);
	box-shadow: 0 2px 6px rgba(20, 32, 58, .15);
	color: #fff;
	font-family: var(--sm-font-display);
	font-size: 1rem;
	letter-spacing: .04em;
	transform: translateY(-50%);
}

.sm-home .sm-quote__action .sm-link-arrow a {
	min-height: 40px;
	padding: 8px 16px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .85);
	box-shadow: 0 1px 3px rgba(20, 32, 58, .1);
}
.sm-home .sm-quote__action .sm-link-arrow a:hover { background: #fff; }

@media (max-width: 767px) {
	.sm-home .sm-quote__grid { grid-template-columns: minmax(0, 1fr); padding-left: 0; }
	.sm-home .sm-quote__action { padding-left: 52px; }
}

/* --------------------------------------------------------------------------
   11. Bottom row: image, invitation, site search
   -------------------------------------------------------------------------- */
.sm-home .sm-row {
	padding: var(--sm-s3) var(--sm-gutter);
	background: var(--sm-cream);
}

.sm-home .sm-row__grid {
	display: grid !important;
	grid-template-columns: minmax(0, 300px) minmax(0, 1.2fr) minmax(0, 1fr);
	align-items: center;
	gap: var(--sm-s5) var(--sm-s6);
	max-width: calc(var(--sm-container) - 2 * var(--sm-gutter));
	margin: 0 auto;
}

.sm-home .sm-row__img img {
	width: 100%;
	aspect-ratio: 16 / 7;
	object-fit: cover;
	border-radius: var(--sm-radius);
}

.sm-home .sm-row__intro { padding-block: var(--sm-s3); }
.sm-home .sm-row__intro .sm-eyebrow { margin-bottom: var(--sm-s2); font-size: .625rem; }
.sm-home .sm-row__intro .sm-h2 { margin-bottom: var(--sm-s2); font-size: clamp(1.625rem, 1.3rem + .8vw, 2rem); }
.sm-home .sm-row__intro p:last-child { margin: 0; font-size: var(--sm-fs-xs); line-height: 1.7; }

.sm-home .sm-row__search { margin: 0; }
.sm-home .sm-row__search .wp-block-search__inside-wrapper {
	display: flex;
	gap: var(--sm-s2);
	padding: 0;
	border: 0;
}
.sm-home .sm-row__search .wp-block-search__input {
	flex: 1 1 auto;
	min-width: 0;
	min-height: 46px;
	margin: 0;
	padding: 0 var(--sm-s4);
	border: 1px solid #D9DDE5;
	border-radius: var(--sm-radius);
	background: #fff;
	font: inherit;
	font-size: .875rem;
	color: var(--sm-heading);
}
.sm-home .sm-row__search .wp-block-search__input::placeholder { color: #6B7489; }
.sm-home .sm-row__search .wp-block-search__button { margin: 0; border-radius: 6px; }

@media (max-width: 999.98px) {
	.sm-home .sm-row { padding-block: var(--sm-s7); }
	.sm-home .sm-row__grid { grid-template-columns: minmax(0, 240px) minmax(0, 1fr); }
	.sm-home .sm-row__form { grid-column: 1 / -1; }
	.sm-home .sm-row__img img { aspect-ratio: 4 / 3; }
}
@media (max-width: 559.98px) {
	.sm-home .sm-row__grid { grid-template-columns: minmax(0, 1fr); }
	.sm-home .sm-row__img img { aspect-ratio: 16 / 7; }
	.sm-home .sm-row__search .wp-block-search__inside-wrapper { flex-direction: column; }
}

/* --------------------------------------------------------------------------
   12. Footer
   -------------------------------------------------------------------------- */
.sm-footer {
	background: var(--sm-footer);
	color: var(--sm-on-dark);
	font-size: var(--sm-fs-xs);
}
.sm-footer a { color: var(--sm-on-dark); text-decoration: none; }
.sm-footer a:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.sm-footer :focus-visible { outline-color: #fff; }

.sm-footer__top {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center;
	gap: var(--sm-s5) var(--sm-s7);
	padding-block: var(--sm-s6) var(--sm-s5);
}

.sm-brand--light .sm-brand__name { color: #fff; font-size: 1.75rem; }
.sm-brand--light .sm-brand__sub { color: var(--sm-on-dark-muted); }
.sm-brand--light:hover { text-decoration: none !important; }
.sm-brand--light:hover .sm-brand__name { color: var(--sm-on-dark); }

.sm-footer__list,
.sm-footer__social,
.sm-footer__legal {
	list-style: none;
	margin: 0;
	padding: 0;
}
.sm-footer__list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--sm-s2) var(--sm-s6);
}
.sm-footer__list a { display: inline-block; padding-block: 6px; }

.sm-footer__social { display: flex; gap: var(--sm-s2); }
.sm-footer__social a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	transition: background-color .2s ease;
}
.sm-footer__social a:hover { background: rgba(255, 255, 255, .1); text-decoration: none; }
.sm-footer__social svg { width: 18px; height: 18px; }

.sm-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: space-between;
	gap: var(--sm-s2) var(--sm-s5);
	padding-block: var(--sm-s4) var(--sm-s5);
	border-top: 1px solid rgba(230, 234, 242, .16);
	color: var(--sm-on-dark-muted);
	font-size: .75rem;
}
.sm-footer__bottom p { margin: 0; }
.sm-footer__meta { display: grid; gap: 4px; }
.sm-footer__meta address { font-style: normal; }
.sm-footer__meta a { color: var(--sm-on-dark-muted); }
.sm-footer__legal { display: flex; gap: var(--sm-s4); }
.sm-footer__legal li + li { padding-left: var(--sm-s4); border-left: 1px solid rgba(230, 234, 242, .25); }
.sm-footer__credits { flex-basis: 100%; font-size: .6875rem; }
.sm-footer__credits a { text-decoration: underline; }

@media (max-width: 899.98px) {
	.sm-footer__top { grid-template-columns: minmax(0, 1fr) auto; }
	.sm-footer__nav { grid-column: 1 / -1; grid-row: 2; }
	.sm-footer__list { justify-content: flex-start; }
}
@media (max-width: 559.98px) {
	.sm-footer__top { grid-template-columns: minmax(0, 1fr); }
	.sm-footer__nav { grid-row: auto; }
	.sm-footer__list { display: grid; grid-template-columns: 1fr 1fr; gap: 0 var(--sm-s5); }
	.sm-footer__bottom { flex-direction: column; }
}

/* Back to top */
.sm-to-top {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 80;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1px solid var(--sm-line);
	border-radius: 50%;
	background: #fff;
	color: var(--sm-primary);
	box-shadow: var(--sm-shadow);
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s;
}
.sm-to-top.is-visible { opacity: 1; visibility: visible; transform: none; transition: opacity .2s ease, transform .2s ease, visibility 0s; }
.sm-to-top:hover { background: var(--sm-primary); color: #fff; }

/* The restored footer strip and scroll button are replaced by the above. */
.as-footer,
.as-scroll-top { display: none; }

/* --------------------------------------------------------------------------
   13. Motion preferences
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.sm-header *,
	.sm-home *,
	.sm-footer *,
	.sm-to-top {
		transition: none !important;
		animation: none !important;
	}
	.sm-home .sm-card:hover { transform: none; }
}
