/* landing.css - Program, Condition and Location pages (canvas "SJRP - Inner
   Pages", Page 2: Program template · IOP, Condition template · Marijuana,
   Location template · Blackwood). Loaded after inner.css on those three page
   templates only; the hero, side column atoms, banner and program cards are
   inner.css components. Values are the design's; colours are tokens only.
   Breakpoints are the design's: 1500 / 1200 / 1100 / 900 / 560. */

/* 1. Hero on phones: facts before pictures (the photo column goes) -------- */

@media (max-width:900px) {
	.in-hero--lp { padding-top: 28px; padding-bottom: 18px; gap: 10px; }
	.in-hero--lp .in-hero__media { display: none; }
	.in-hero--lp .in-title { font-size: 1.875rem; line-height: 1.06; }
	.in-hero--lp .in-hero__lead { font-size: 0.9375rem; line-height: 1.45; }
	.in-hero--lp .in-crumbs { font-size: 0.8125rem; }
}

/* 2. At a glance --------------------------------------------------------- */

.lp-glance { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 0 32px; }
.lp-glance__item { padding: 20px 0; display: flex; flex-direction: column; gap: 3px; }
.lp-glance__label { font-size: 0.75rem; font-weight: 600; color: var(--dd-green-accent); }
.lp-glance__value { font-size: 1.0625rem; font-weight: 500; letter-spacing: -.01em; }
.lp-glance__note { font-size: 0.84375rem; color: var(--dd-text); }

@media (max-width:1100px) { .lp-glance { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width:900px) {
	.lp-glance { gap: 0 20px; }
	.lp-glance__item { padding: 12px 0; }
	.lp-glance__value { font-size: 0.9375rem; }
	.lp-glance__note { font-size: 0.78125rem; }
}

/* 3. The text: what writers produce in the editor ------------------------ */

.lp-body { padding-block: 52px 56px; }

.lp-prose { font-size: 1.0625rem; line-height: 1.7; color: var(--dd-text); max-width: 72ch; }
.lp-prose a { color: var(--dd-green-accent); text-underline-offset: 3px; }
/* Hover turns the link ink, as in posts; bold inside a link keeps its colour. */
.lp-prose a:hover { color: var(--dd-ink); }
.lp-prose a strong { color: inherit; }
.lp-prose h2 { margin: 40px 0 14px; font-weight: 500; font-size: clamp(1.625rem,2.4vw,2rem); line-height: 1.15; letter-spacing: -.03em; color: var(--dd-ink); scroll-margin-top: 96px; }
.lp-prose > :first-child { margin-top: 0; }
.lp-prose h3 { margin: 28px 0 10px; font-weight: 500; font-size: clamp(1.3125rem,1.8vw,1.5rem); line-height: 1.2; letter-spacing: -.02em; color: var(--dd-ink); scroll-margin-top: 96px; }
.lp-prose p { margin: 0 0 16px; }
.lp-prose strong { font-weight: 600; color: var(--dd-ink); }

/* Lists. Bullets: the Program template's check in a light-green circle, now
   the site default for every text list (general.css, "Bulleted lists"). */
.lp-prose ul, .lp-prose ol { list-style: none; margin: 0 0 18px; padding: 0; display: flex; flex-direction: column; }
.lp-prose ul { gap: 10px; }
.lp-prose ol { gap: 14px; counter-reset: lp-n; }
.lp-prose li { position: relative; }
.lp-prose ol > li { counter-increment: lp-n; padding-left: 44px; }
.lp-prose ol > li::before { content: counter(lp-n, decimal-leading-zero); position: absolute; left: 0; top: 4px; font-size: 0.8125rem; font-weight: 600; color: var(--dd-green-accent); font-variant-numeric: tabular-nums; }

.lp-prose blockquote { margin: 0 0 18px; padding: 18px 22px; background: var(--dd-green-light); border: 0; border-radius: 10px; font-size: 0.96875rem; line-height: 1.6; font-style: normal; color: var(--dd-ink); }
.lp-prose blockquote p { margin: 0 0 10px; }
.lp-prose blockquote p:last-child { margin: 0; }
.lp-prose hr { border: 0; border-top: 1px solid var(--dd-hairline); margin: 28px 0; }

/* In-text figure (core/image, Full Size): landscape, never taller than 300px;
   caption = a bold label and one sentence. */
.lp-prose .wp-block-image { margin: 28px 0; padding: 0; max-width: none; }
.lp-prose .wp-block-image img { display: block; width: 100%; height: auto; aspect-ratio: 16/7; max-height: 300px; object-fit: cover; border-radius: 10px; }
.lp-prose .wp-block-image figcaption { margin: 10px 0 0; padding-left: 14px; border-left: 2px solid var(--dd-green-accent); font-size: 0.84375rem; line-height: 1.5; color: var(--dd-text); text-align: left; max-width: 60ch; }
.lp-prose figcaption strong { font-weight: 600; color: var(--dd-ink); }

/* Tables (core/table): the shared table style lives in general.css. On a
   location page the tables are figures (admissions by drug): numbers right-
   aligned, and the 4th column (countywide) drops on phones. */
.lp-prose--location .wp-block-table th:not(:first-child), .lp-prose--location .wp-block-table td:not(:first-child) { text-align: right; font-variant-numeric: tabular-nums; }

/* Sources (the Sources field, after the text). */
.lp-prose .lp-sources__title { margin: 0 0 10px; font-size: 0.875rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--dd-green-accent); }
.lp-prose .lp-sources { font-size: 0.84375rem; line-height: 1.55; color: var(--dd-text); }
.lp-prose .lp-sources > li { padding-left: 0; }
.lp-prose .lp-sources > li::before, .lp-prose .lp-sources > li::after { display: none; }
.lp-sources a { word-break: break-all; }

/* The design's h2 steps at 1200 and 1500 (after general.css, so they win). */
@media (min-width:1200px) and (max-width:1499px) { .lp-prose h2 { font-size: 1.875rem; } }
@media (min-width:1500px) { .lp-prose h2 { font-size: 2rem; } }
@media (max-width:900px) {
	.lp-prose .wp-block-image { margin: 22px 0; }
	.lp-prose .wp-block-image img { aspect-ratio: 3/2; max-height: 240px; border-radius: 8px; }
	.lp-prose .wp-block-image figcaption { font-size: 0.8125rem; padding-left: 12px; }
}
@media (max-width:560px) {
	.lp-prose--location .wp-block-table th:nth-child(4), .lp-prose--location .wp-block-table td:nth-child(4) { display: none; }
	.lp-prose--location .wp-block-table table:has(tr > :nth-child(3)) { min-width: 0; } /* fits once the 4th column is gone */
}

/* 4. Side column --------------------------------------------------------- */

.lp-factrow { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.3fr); font-size: 0.90625rem; text-decoration: none; color: inherit; }
.lp-factrow + .lp-factrow, .lp-factrow__note { border-top: 1px solid var(--dd-hairline-card); }
.lp-factrow__label { padding: 12px 18px; font-weight: 500; }
.lp-factrow__value { padding: 12px 18px; color: var(--dd-text); }
.lp-factrow__note { padding: 12px 18px; font-size: 0.8125rem; color: var(--dd-text); }

.lp-guides { background: var(--dd-white); border: 1px solid var(--dd-hairline); border-radius: 10px; padding: 16px 18px; display: flex; flex-direction: column; gap: 6px; }
.lp-guides__label { font-size: 0.8125rem; font-weight: 600; color: var(--dd-green-accent); }
.lp-guides a { font-size: 0.90625rem; font-weight: 500; text-decoration: none; padding: 6px 0; border-bottom: 1px solid var(--dd-hairline-card); }
.lp-guides a:last-child { border-bottom: 0; }

.lp-visit { background: var(--dd-white); border: 1px solid var(--dd-hairline); border-radius: 10px; overflow: hidden; }
.lp-visit__map { position: relative; height: 150px; background: var(--dd-green-light); overflow: hidden; }
.lp-visit__map svg { display: block; }
.lp-visit__roads { stroke: var(--dd-white); opacity: .9; }
.lp-visit__route { stroke: var(--dd-green-accent); }
.lp-visit__start { fill: var(--dd-white); stroke: var(--dd-green-accent); }
.lp-visit__pin { fill: var(--dd-gold); stroke: var(--dd-ink); }
.lp-visit__pin-dot { fill: var(--dd-ink); }
.lp-visit__text { font-family: var(--dd-font-body); font-size: 11px; font-weight: 600; fill: var(--dd-ink); }
.lp-visit__tag { position: absolute; left: 10px; top: 10px; background: var(--dd-white); border-radius: 6px; padding: 4px 8px; font-size: 0.71875rem; font-weight: 600; color: var(--dd-ink); box-shadow: 0 4px 12px var(--dd-hairline); }
.lp-visit__body { padding: 16px 18px; display: flex; flex-direction: column; gap: 10px; }
.lp-visit__who { display: flex; flex-direction: column; gap: 2px; }
.lp-visit__name { font-size: 0.9375rem; font-weight: 600; }
.lp-visit__addr { font-size: 0.875rem; color: var(--dd-text); }
.lp-visit__facts { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 4px 12px; font-size: 0.84375rem; color: var(--dd-text); }
.lp-visit__key { font-weight: 600; color: var(--dd-ink); }
.lp-visit__phone { text-decoration: none; }
@media (max-width:900px) { .lp-visit__phone { display: inline-block; padding-block: 10px; margin-block: -10px; } }
.lp-visit__btn { display: inline-flex; align-items: center; justify-content: space-between; min-height: 44px; padding: 0 16px; border-radius: 8px; font-size: 0.90625rem; font-weight: 600; text-decoration: none; background: var(--dd-gold); color: var(--dd-ink); }
.lp-visit__btn svg { flex: none; }

@media (max-width:900px) {
	.lp-side { position: static; }
	.lp-side .in-callcard { display: none; }
	.lp-visit { order: -1; }
}

/* 5. Banner: flush with the text above it, 56px under it ----------------- */

.lp-page .in-banner--flush { padding-bottom: 56px; }

/* 6. Insurance & cost (#verify): moved to inner.css (shared with About). */

/* 7. FAQ (#faq) ---------------------------------------------------------- */

.lp-faq { padding-block: 56px; }
.lp-faq__head { display: flex; flex-direction: column; gap: 10px; margin-bottom: 20px; max-width: 62ch; }
.lp-faq__title { font-size: clamp(1.625rem,2.6vw,2.25rem); line-height: 1.05; letter-spacing: -.035em; scroll-margin-top: 96px; }
.lp-faq__text { margin: 0; font-size: 0.96875rem; color: var(--dd-text); }
/* full container width (Program, Condition and Location pages alike) */
.lp-faq__list { border-top: 1px solid var(--dd-hairline); }
.lp-faq__item { --lp-faq-pad: 18px; display: flex; flex-direction: column; padding: 0 4px; border-bottom: 1px solid var(--dd-hairline); }
.lp-faq__q { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 16px; align-items: center; width: 100%; padding: var(--lp-faq-pad) 0; border: 0; background: none; font: inherit; color: inherit; text-align: left; cursor: pointer; } /* the row padding lives on the button, so the whole row answers a tap */
.lp-faq__qtext { font-size: 1.0625rem; font-weight: 500; letter-spacing: -.01em; line-height: 1.35; }
.lp-faq__icon { width: 28px; height: 28px; border-radius: 50%; border: 1px solid var(--dd-ink-a18); display: flex; align-items: center; justify-content: center; flex: none; font-size: 1rem; color: var(--dd-green-accent); }
.lp-faq__a { margin-top: calc(10px - var(--lp-faq-pad)); padding-bottom: var(--lp-faq-pad); } /* answer still 10px under the question */
.lp-faq__a p:first-child { margin-top: 0; }
.lp-faq__a p { margin: 10px 0 2px; font-size: 0.9375rem; line-height: 1.6; color: var(--dd-text); max-width: 96ch; }

@media (max-width:900px) {
	.lp-faq__item { --lp-faq-pad: 14px; }
	.lp-faq__qtext { font-size: 0.96875rem; }
}

/* 7b. Care team (#team) - the people behind the program (E-E-A-T) ------ */

.lp-team__inner { padding-block: 52px; display: flex; flex-direction: column; gap: 24px; }
.lp-team__head { display: flex; flex-direction: column; gap: 10px; max-width: 62ch; }
.lp-team__title { font-size: clamp(1.625rem,2.6vw,2.25rem); line-height: 1.05; letter-spacing: -.035em; scroll-margin-top: 96px; }
.lp-team__text { margin: 0; font-size: 0.96875rem; color: var(--dd-text); }
/* small cards, up to four to a row: photo left, title / name / credentials /
   bio link right; two to a row on tablets, one on phones */
.lp-team__grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(250px,1fr)); gap: 12px; }
.lp-teamcard { background: var(--dd-white); border: 1px solid var(--dd-hairline-card); border-radius: 10px; padding: 10px; display: grid; grid-template-columns: 76px minmax(0,1fr); gap: 14px; align-items: center; }
.lp-teamcard__img { width: 76px; height: 92px; object-fit: cover; object-position: center top; border-radius: 6px; display: block; }
.lp-teamcard__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.lp-teamcard .in-person__role { margin: 0; font-size: 0.75rem; font-weight: 600; color: var(--dd-green-accent); } /* pages.css is not loaded here */
.lp-teamcard__name { margin: 0; font-size: 1.0625rem; letter-spacing: -.015em; line-height: 1.25; }
.lp-teamcard__name .in-creds { margin-top: 2px; font-size: 0.71875rem; }
.lp-teamcard__more { margin-top: 6px; font-size: 0.8125rem; }

@media (max-width:900px) {
	.lp-team__inner { padding-block: 40px; gap: 20px; }
}
@media (max-width:560px) { .lp-team__grid { grid-template-columns: minmax(0,1fr); } }

/* 8. Related: program cards, condition cards, chips ---------------------- */

.lp-related__head { margin-bottom: clamp(24px,3vw,32px); max-width: 62ch; }
.lp-related__text { margin: 0; font-size: 1.03125rem; color: var(--dd-text); }

.lp-programs .in-program__img { height: 190px; }
.lp-programs .in-program__title { font-size: 1.4375rem; line-height: 1.15; }
.lp-card__text { margin: 0; font-size: 0.9375rem; color: var(--dd-text); }

.lp-cards { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.lp-card { background: var(--dd-white); border: 1px solid var(--dd-hairline-card); border-radius: 10px; padding: 24px; display: flex; flex-direction: column; gap: 6px; min-height: 220px; box-sizing: border-box; text-decoration: none; color: inherit; }
.lp-card__icon img { width: 20px; height: 20px; }
.lp-card__title { margin: 12px 0 0; font-size: 1.375rem; letter-spacing: -.025em; }
.lp-card__more { margin-top: auto; display: flex; justify-content: space-between; align-items: center; padding-top: 12px; border-top: 1px solid var(--dd-hairline-card); font-size: 0.90625rem; font-weight: 600; color: var(--dd-green-accent); }

.lp-chips__label { margin: 28px 0 12px; font-size: 0.8125rem; font-weight: 600; color: var(--dd-green-accent); }
.lp-chips { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; }
.lp-chip { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 44px; padding: 0 14px; background: var(--dd-white); border: 1px solid var(--dd-hairline-card); border-radius: 8px; font-size: 0.84375rem; font-weight: 500; text-decoration: none; }
.lp-chip svg { flex: none; color: var(--dd-green); }

@media (max-width:1100px) { .lp-cards, .lp-chips { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width:560px) { .lp-cards, .lp-chips { grid-template-columns: minmax(0,1fr); } }

/* Related on the hubs: a chips label straight under the head (Programs hub
   "Therapies") sits on the head's own margin. */
.lp-related__head + .lp-chips__label { margin-top: 0; }

/* 9. Hubs (canvas Page 2: Programs hub, Conditions hub, Locations hub) ------
   template-parts/lp-hub.php + lp-hubgrid.php. Hero, glance, banner, verify,
   FAQ and related chips are the sections above. */

.lp-hubpage .in-banner { padding-bottom: 56px; }
.hub-grid[id], .hub-team { scroll-margin-top: 90px; }
.hub-anchor { scroll-margin-top: 96px; }

/* 9a. Card grids: #levels, #conditions, #programs, #towns */
.hub-grid__inner { padding-block: 56px 48px; }
.hub-grid__inner--paper { padding-block: 56px; }

.hub-cards { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.hub-cards--2 { grid-template-columns: repeat(2,minmax(0,1fr)); }

.hub-card { background: var(--dd-white); border: 1px solid var(--dd-hairline-card); border-radius: 10px; padding: 24px; display: flex; flex-direction: column; gap: 6px; min-height: 230px; box-sizing: border-box; text-decoration: none; color: inherit; }
.hub-card--tagged { padding: 26px 24px; gap: 8px; min-height: 360px; }
.hub-cards--2 .hub-card { padding: 26px; gap: 8px; min-height: 0; }

.hub-card__top { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.hub-card__icon img { width: 20px; height: 20px; }
.hub-card__meta { font-size: 0.78125rem; font-weight: 600; color: var(--dd-green-accent); text-align: right; }
.hub-card__tag { font-size: 0.75rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--dd-green-accent); }
.hub-card__badge { font-size: 0.78125rem; font-weight: 600; color: var(--dd-text); background: var(--dd-bg-warm); border-radius: 6px; padding: 4px 8px; }

.hub-card__title { margin: 12px 0 0; font-size: 1.375rem; letter-spacing: -.025em; }
.hub-card--tagged .hub-card__title { margin-top: 10px; font-size: 1.5rem; line-height: 1.15; }
.hub-cards--2 .hub-card__title { margin-top: 10px; font-size: 1.625rem; line-height: 1.15; }

.hub-card__sub { font-size: 0.78125rem; color: var(--dd-text); }
.hub-card--tagged .hub-card__sub { font-size: 0.875rem; font-weight: 500; color: var(--dd-ink); }
.hub-card__text { margin: 4px 0 0; font-size: 0.9375rem; color: var(--dd-text); }
.hub-card--tagged .hub-card__text { margin-top: 6px; }
.hub-card__best { margin: 0; font-size: 0.875rem; color: var(--dd-text); }
.hub-card__best strong { font-weight: 600; color: var(--dd-ink); }

.hub-card__details { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 6px 14px; margin-top: 8px; padding-top: 12px; border-top: 1px solid var(--dd-hairline-card); font-size: 0.84375rem; color: var(--dd-text); }
.hub-card__dlabel { font-weight: 600; color: var(--dd-ink); white-space: nowrap; }

.hub-card__more { margin-top: auto; display: flex; justify-content: space-between; align-items: center; padding-top: 12px; border-top: 1px solid var(--dd-hairline-card); font-size: 0.90625rem; font-weight: 600; color: var(--dd-green-accent); }
.hub-card__more--plain { border-top: 0; }
.hub-card__more svg { flex: none; margin-left: 3px; position: relative; top: 1px; }

.hub-grid__note { margin: 20px 0 0; font-size: 0.90625rem; color: var(--dd-text); max-width: 70ch; }
.hub-grid__note a { color: var(--dd-green-accent); }

.hub-grid__chips { margin-top: 28px; display: flex; flex-direction: column; gap: 12px; }
.hub-grid__chipsnote { margin: 4px 0 0; font-size: 0.875rem; color: var(--dd-text); max-width: 70ch; }

/* The dark MAT card under the level cards */
.hub-feature { --hub-rule: rgba(255,255,255,.14); margin-top: 12px; background: var(--dd-green); color: var(--dd-white); border-radius: 10px; padding: 26px 28px; display: grid; grid-template-columns: minmax(0,1.4fr) minmax(0,1fr); gap: clamp(20px,3vw,48px); align-items: center; text-decoration: none; }
.hub-feature:hover { color: var(--dd-white); }
.hub-feature__text { display: flex; flex-direction: column; gap: 8px; }
.hub-feature__eyebrow { font-size: 0.75rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--dd-green-pale); }
.hub-feature__title { margin: 0; font-size: 1.5rem; letter-spacing: -.025em; line-height: 1.15; color: var(--dd-white); }
.hub-feature__lead { margin: 0; font-size: 0.9375rem; color: var(--dd-on-dark-light); max-width: 60ch; }
.hub-feature__side { display: flex; flex-direction: column; gap: 6px; font-size: 0.875rem; color: var(--dd-on-dark-light); }
.hub-feature__row { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--hub-rule); }
.hub-feature__row:has(+ .hub-feature__more), .hub-feature__row:last-child { border-bottom: 0; }
.hub-feature__row strong { font-weight: 600; color: var(--dd-white); text-align: right; }
.hub-feature__more { margin-top: 6px; font-size: 0.90625rem; font-weight: 600; color: var(--dd-gold); }

/* 9b. How it works: numbered step cards (Programs) */
.hub-steps { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
.hub-step { background: var(--dd-white); border: 1px solid var(--dd-hairline-card); border-radius: 10px; padding: 22px; display: flex; flex-direction: column; gap: 8px; }
.hub-step__num { font-size: 0.8125rem; font-weight: 600; color: var(--dd-green-accent); font-variant-numeric: tabular-nums; }
.hub-step__title { margin: 0; font-size: 1.1875rem; letter-spacing: -.02em; line-height: 1.2; }
.hub-step__text { margin: 0; font-size: 0.90625rem; color: var(--dd-text); }

/* 9c. Our office (Locations): text, the details as a table and buttons |
   the map, stretched to the text column's height */
.hub-office { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: clamp(32px,5vw,72px); align-items: stretch; }
.hub-office__text { display: flex; flex-direction: column; gap: 16px; }
.hub-office__lead { margin: 0; font-size: 1.03125rem; color: var(--dd-text); max-width: 56ch; }
/* the site's table style (general.css, core/table): white box, hairline rows, bold first column */
.hub-office__table { background: var(--dd-white); border: 1px solid var(--dd-hairline); border-radius: 10px; overflow: hidden; }
.hub-office__table table { width: 100%; margin: 0; border: 0; border-collapse: collapse; font-size: 0.9375rem; line-height: 1.5; color: var(--dd-text); }
.hub-office__table :is(th, td) { padding: 12px 16px; border: 0; border-top: 1px solid var(--dd-hairline-card); text-align: left; vertical-align: top; }
.hub-office__table tr:first-child :is(th, td) { border-top: 0; }
.hub-office__table th { width: 26%; font-weight: 600; color: var(--dd-ink); background: none; white-space: nowrap; }
.hub-office__table a { text-decoration: none; overflow-wrap: anywhere; }
.hub-office__ctas { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.hub-office__btn { justify-content: center; gap: 10px; min-height: 48px; padding: 0 18px; border-radius: 8px; font-size: 0.9375rem; font-weight: 600; color: var(--dd-ink); }
.hub-office__btn--gold { background: var(--dd-gold); }
.hub-office__btn--line { background: var(--dd-white); border: 1px solid var(--dd-ink-a14); }
.hub-office__btn svg { flex: none; }
.hub-office__map { position: relative; min-height: 360px; background: var(--dd-green-light); border-radius: 12px; overflow: hidden; border: 1px solid var(--dd-ink-a08); }
.hub-office__map iframe { position: absolute; inset: 0; display: block; width: 100%; height: 100%; border: 0; }
@media (max-width:900px) {
	.hub-office__map { min-height: 0; aspect-ratio: 5/4; }
	.hub-office__table :is(th, td) { padding: 10px 12px; font-size: 0.875rem; }
	.hub-office__table th { white-space: normal; }
}

/* 9d. Clinical team (#team): photo cards with a short bio */
.hub-team__head { display: grid; grid-template-columns: minmax(0,1.4fr) auto; gap: 24px; align-items: end; margin-bottom: clamp(24px,3vw,32px); }
.hub-team__head .lp-related__head { margin-bottom: 0; }
.hub-team__all { justify-content: center; min-height: 48px; padding: 0 18px; white-space: nowrap; }
.hub-team__grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
.hub-person { background: var(--dd-white); border: 1px solid var(--dd-hairline-card); border-radius: 10px; padding: 14px 14px 20px; display: flex; flex-direction: column; gap: 6px; box-sizing: border-box; text-decoration: none; color: inherit; }
.hub-person__img { width: 100%; height: auto; aspect-ratio: 1/1; object-fit: cover; border-radius: 8px; display: block; margin-bottom: 8px; }
.hub-person__role { font-size: 0.78125rem; font-weight: 600; color: var(--dd-green-accent); }
.hub-person__name { margin: 0; font-size: 1.25rem; letter-spacing: -.02em; line-height: 1.2; }
.hub-person__creds { font-size: 0.84375rem; color: var(--dd-text); }
.hub-person__text { margin: 4px 0 0; font-size: 0.90625rem; color: var(--dd-text); }
.hub-person__more { margin-top: auto; display: flex; justify-content: space-between; align-items: center; padding-top: 12px; font-size: 0.875rem; font-weight: 600; color: var(--dd-green-accent); }
.hub-person__more svg { flex: none; }

@media (max-width:1100px) {
	.hub-cards--3, .hub-steps, .hub-team__grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width:900px) {
	.hub-cards--2, .hub-feature, .hub-office { grid-template-columns: minmax(0,1fr); }
	.hub-card__meta { font-size: 0.75rem; }
	.hub-team__head { grid-template-columns: minmax(0,1fr); align-items: start; }
	.hub-team__all { justify-self: start; }
}
@media (max-width:560px) {
	.hub-cards--3, .hub-steps, .hub-team__grid { grid-template-columns: minmax(0,1fr); }
}

/* 9e. Homepage team section repeated on a hub (team_source = home): the
   home.css rules of section/team.php (hp-team*), renamed. Mobile: a
   scroll-snap slider with arrows (main.js [data-slider]). */
.hub-hteam { padding-block: 49px; scroll-margin-top: 90px; }
.hub-hteam__head { display: flex; flex-direction: column; gap: 12px; margin-bottom: clamp(32px,4vw,48px); }
.hub-hteam__head h2 { margin: 0; }
.hub-hteam__text { margin: 0; font-size: 1.0625rem; line-height: 1.4; color: var(--dd-text); max-width: 47ch; }
.hub-hteam__grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: clamp(12px,1.4vw,16px); }
.hub-hteam__item { display: flex; flex-direction: column; gap: 4px; }
.hub-hteam__img { display: block; width: 100%; height: auto; aspect-ratio: 1/1; object-fit: cover; object-position: center top; border-radius: 10px; margin-bottom: 12px; background: var(--dd-bg-warm); }
.hub-hteam__name { margin: 0; font-size: clamp(0.9375rem,1.25vw,1.1875rem); letter-spacing: -.02em; line-height: 1.25; }
.hub-hteam__role { font-size: 0.875rem; font-weight: 500; color: var(--dd-green-accent); }
.hub-hteam__foot { margin-top: clamp(28px,3vw,40px); display: flex; align-items: center; gap: 8px; }
.hub-hteam__arrows { display: none; gap: 8px; }
.hub-hteam__arrow { width: 48px; height: 48px; border-radius: 8px; border: 1px solid var(--dd-ink-a18); background: var(--dd-white); color: var(--dd-ink); display: flex; align-items: center; justify-content: center; cursor: pointer; flex: none; }
.hub-hteam__btn { min-height: 48px; padding: 0 18px; border: 1px solid var(--dd-ink-a18); }

@media (min-width:1200px) { .hub-hteam__head { margin-bottom: 32px; } }
@media (max-width:900px) {
	.hub-hteam__head { margin-bottom: 32px; }
	.hub-hteam__grid { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; gap: 12px; margin-inline: calc(-1 * var(--dd-gutter)); padding-inline: var(--dd-gutter); scroll-padding-inline: var(--dd-gutter); } /* runs to the screen edge, so the next card peeks instead of being cut at the gutter */
	.hub-hteam__grid::-webkit-scrollbar { display: none; }
	.hub-hteam__item { flex: 0 0 78%; scroll-snap-align: start; }
	.hub-hteam__arrows { display: flex; }
	.hub-hteam__btn { font-size: 0.8125rem; padding: 0 14px; white-space: nowrap; flex: 1 1 auto; justify-content: center; }
	.hub-hteam__btn svg { display: none; }
}

/* 9f. Homepage "What we treat" cards on a hub (cards_source =
   home_conditions): the home.css rules of section/conditions.php
   (hp-g4--2, hp-g4-a-2 ...), renamed. */
.hub-hcond { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,260px),1fr)); gap: 12px; }
.hub-hcond__card { background: var(--dd-white); border: 1px solid var(--dd-hairline-card); border-radius: 10px; padding: 28px; display: flex; flex-direction: column; gap: 6px; min-height: 250px; box-sizing: border-box; text-decoration: none; color: inherit; }
.hub-hcond__icon { width: 44px; height: 44px; border-radius: 8px; background: var(--dd-green-light); display: flex; align-items: center; justify-content: center; }
.hub-hcond__icon img { width: 20px; height: 20px; }
.hub-hcond__title { margin: 12px 0 0; font-size: 1.4375rem; letter-spacing: -.025em; }
.hub-hcond__text { margin: 0; font-size: 0.9375rem; color: var(--dd-text); }
.hub-hcond__more { margin-top: auto; display: flex; justify-content: space-between; align-items: center; padding-top: 12px; border-top: 1px solid var(--dd-hairline-card); font-size: 0.90625rem; font-weight: 600; color: var(--dd-green-accent); }
.hub-hcond__more svg { flex: none; margin-left: 6px; position: relative; top: 1px; }

@media (max-width:1100px) { .hub-hcond { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width:560px) { .hub-hcond { grid-template-columns: minmax(0,1fr); } }

/* 10. Verify Insurance (/insurance-verification/, canvas Page 2 "Verify
   Insurance"): template-parts/lp-insurance.php. Glance, banner, FAQ, the
   side column and the program cards are the sections above. */

.vi-anchor { scroll-margin-top: 90px; }

/* 10a. Hero: text + checklist | the form card */
.vi-hero { padding-bottom: 48px; }
.vi-checks { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px 20px; font-size: 0.90625rem; color: var(--dd-text); }
.vi-checks li { display: flex; gap: 10px; align-items: flex-start; padding: 0; }
.vi-checks li::before { content: none; }
.vi-checks__icon { width: 20px; height: 20px; border-radius: 50%; background: var(--dd-green-light); color: var(--dd-green); display: flex; align-items: center; justify-content: center; flex: none; margin-top: 2px; }
.in-hero__cta.vi-formlink { display: none; flex: 1 1 172px; max-width: 172px; background: var(--dd-green-light); }

.vi-formcard { align-self: center; background: var(--dd-white); border: 1px solid var(--dd-hairline); border-radius: 10px; padding: clamp(20px,2.2vw,26px); display: flex; flex-direction: column; gap: 10px; box-sizing: border-box; box-shadow: 0 10px 30px var(--dd-ink-a08); scroll-margin-top: 90px; }
.vi-formcard__head { margin-bottom: 6px; }
.vi-formcard__head { display: flex; flex-direction: column; gap: 4px; }
.vi-formcard__eyebrow { font-size: 0.75rem; font-weight: 600; color: var(--dd-green-accent); }
.vi-formcard__title { margin: 0; } /* the site's h2 size, as the design renders it at 1280 */
.vi-hero__crumbs { margin-bottom: 0; }
.vi-hero .in-hero__text { justify-content: center; }
.vi-formcard__note { margin: 6px 0 0; font-size: 0.71875rem; line-height: 1.45; color: var(--dd-text); }

/* the compact form of the design: 40px fields, 12.5px labels */
.vi-form .gform_wrapper.gravity-theme .gform_fields { column-gap: 10px; row-gap: 16px; }
.vi-form .gform_wrapper.gravity-theme .gfield, .vi-form .gform_wrapper.gravity-theme .gfield_label { gap: 5px; font-size: 0.78125rem; }
.vi-form .gform_wrapper.gravity-theme input:not([type='submit']):not([type='checkbox']):not([type='radio']), .vi-form .gform_wrapper.gravity-theme select { height: 40px; padding: 0 12px; font-size: 0.84375rem; }
.vi-form .gform_wrapper.gravity-theme .gfield textarea, .vi-form .gform_wrapper.gravity-theme .gfield textarea.small { height: 58px; min-height: 58px; padding: 9px 12px; font-size: 0.84375rem; line-height: 1.4; resize: vertical; overflow-y: auto; }
.vi-form .gform_wrapper.gravity-theme .gfield.vi-optional .gfield_label::after { content: " (optional)"; font-weight: 400; color: var(--dd-text); }
.vi-form .gform_wrapper.gravity-theme .gform_footer { margin-top: 20px; }
/* the consent sits apart from the fields above it */
.vi-form .gform_wrapper.gravity-theme .gfield.vi-consent { margin-top: 4px; }
.vi-form .gform_wrapper.gravity-theme .gform_footer .gform_button { height: 46px; }
.vi-form .vi-consent .gfield_checkbox { margin: 0; }
.vi-form .vi-consent .gchoice { display: flex; gap: 10px; align-items: flex-start; margin: 0; }
.vi-form .vi-consent input[type='checkbox'] { margin: 3px 0 0; width: 16px; height: 16px; flex: none; accent-color: var(--dd-green-accent); }
.vi-form .vi-consent label { margin: 0; font-size: 0.75rem; font-weight: 400; line-height: 1.45; color: var(--dd-text); }
.vi-form .vi-consent label a { color: var(--dd-green-accent); }

/* 10b. How it works (#how): three steps in a hairline grid */
.vi-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; background: var(--dd-hairline); border: 1px solid var(--dd-hairline); border-radius: 10px; overflow: hidden; }
.vi-step { background: var(--dd-white); padding: 24px 26px 28px; display: flex; flex-direction: column; gap: 8px; }
.vi-step__num { font-size: 0.8125rem; font-weight: 600; color: var(--dd-green-accent); font-variant-numeric: tabular-nums; }
.vi-step__title { margin: 0; font-size: 1.5rem; letter-spacing: -.02em; line-height: 1.15; }
.vi-step__text { margin: 0; font-size: 0.9375rem; color: var(--dd-text); }

/* 10c. Plans we work with (#plans): carrier tiles. A tile with a coverage
   guide is a link with the "… coverage guide" row; without, a plain logo. */
.vi-carriers { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; background: var(--dd-hairline); border: 1px solid var(--dd-hairline); border-radius: 10px; overflow: hidden; }
.vi-carrier { background: var(--dd-white); transition: background-color .15s; min-height: 128px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 20px 18px; text-decoration: none; color: inherit; box-sizing: border-box; }
.vi-carrier:hover { background: var(--dd-bg-warm); color: inherit; }
.vi-carrier__logo { width: 60%; height: 38px; object-fit: contain; filter: brightness(0) saturate(100%) invert(18%) sepia(22%) saturate(900%) hue-rotate(115deg) brightness(92%) contrast(90%); }
.vi-carrier__guide { display: inline-flex; align-items: center; gap: 4px; font-size: 0.84375rem; font-weight: 600; color: var(--dd-green-accent); }

/* 10d. Self-pay side column */
.vi-box { background: var(--dd-white); border: 1px solid var(--dd-hairline); border-radius: 10px; overflow: hidden; }
.vi-box__head { padding: 14px 18px; background: var(--dd-bg-warm); font-size: 0.8125rem; font-weight: 600; color: var(--dd-ink); border-bottom: 1px solid var(--dd-hairline-card); }
.vi-box__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; font-size: 0.90625rem; }
.vi-box__list li { padding: 11px 18px; border-bottom: 1px solid var(--dd-hairline-card); }
.vi-box__list li:last-child { border-bottom: 0; }
.vi-box__list li::before { content: none; }
.vi-callcard__btn { align-self: stretch; justify-content: space-between; }

/* 10e. Areas we serve: town tiles in a hairline grid */
.vi-towns { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; background: var(--dd-hairline); border: 1px solid var(--dd-hairline); border-radius: 10px; overflow: hidden; }
.vi-town { background: var(--dd-white); display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 54px; padding: 0 10px; font-size: 0.9375rem; font-weight: 500; text-decoration: none; color: var(--dd-ink); }
.vi-town svg { flex: none; color: var(--dd-green-accent); }
a.vi-town:hover { background: var(--dd-bg-warm); }
/* Last town fills the rest of its row, so no empty hairline cells show. */
.vi-towns>.vi-town:last-child:nth-child(3n+1) { grid-column: 1/-1; }
.vi-towns>.vi-town:last-child:nth-child(3n+2) { grid-column: span 2; }

@media (max-width:900px) {
	.in-hero__cta.vi-formlink { display: inline-flex; flex: 0 0 auto; max-width: none; white-space: nowrap; }
	.vi-hero .in-hero__ctas { flex-wrap: nowrap; }
	.vi-checks { grid-template-columns: minmax(0,1fr); }
	.vi-form .gform_wrapper.gravity-theme input:not([type='submit']):not([type='checkbox']):not([type='radio']), .vi-form .gform_wrapper.gravity-theme select { height: 44px; }
	.vi-form .gform_wrapper.gravity-theme .gfield, .vi-form .gform_wrapper.gravity-theme .gfield_label { font-size: 0.84375rem; }
	.vi-steps { grid-template-columns: minmax(0,1fr); }
	.vi-towns { grid-template-columns: repeat(2,minmax(0,1fr)); }
	.vi-towns>.vi-town:last-child:nth-child(n) { grid-column: auto; }
	.vi-towns>.vi-town:last-child:nth-child(odd) { grid-column: 1/-1; }
	/* Phones: no logos - one "<insurer> coverage guide" link per row, the
	   whole row is the tap target (Verify Insurance, Admissions). */
	.vi-carriers { grid-template-columns: minmax(0,1fr); }
	.vi-carrier { min-height: 52px; flex-direction: row; align-items: center; justify-content: flex-start; padding: 0 16px; }
	.vi-carrier__logo { display: none; }
	.vi-carrier__guide { width: 100%; justify-content: space-between; font-size: 0.9375rem; }
}

/* 11. Admissions (/admissions/, canvas Page 2 "Admissions"):
   template-parts/lp-admissions.php. Hero, glance, steps, program cards,
   form card, banner, FAQ, carrier and town tiles are the sections above;
   the leadership cards are pages.css (section/leaders.php). */

.lp-page--admissions .in-banner { padding-bottom: 0; }

/* Hero buttons: two equal halves in a 420px row (the design's data-heroctas) */
.lp-page--admissions .in-hero__ctas { max-width: 420px; }
.lp-page--admissions .in-hero__ctas > .in-hero__cta { flex: 1 1 0; min-width: 0; max-width: none; white-space: nowrap; }
@media (max-width:900px) { .lp-page--admissions .in-hero__ctas { max-width: none; } }

/* 11a. Process: four steps, two to a row */
.vi-steps--2 { list-style: none; margin: 0; padding: 0; grid-template-columns: repeat(2,minmax(0,1fr)); grid-auto-rows: 1fr; }
.vi-steps--2 .vi-step { padding: 20px 24px; justify-content: center; gap: 6px; }
.vi-steps--2 .vi-step__title { line-height: 1.3; }

/* 11b. What to expect: the homepage "families" band (home.css .hp-fam), renamed */
.ad-fam { background: var(--dd-green); color: var(--dd-white); display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,440px),1fr)); }
.ad-fam__img { position: relative; min-height: 320px; }
.ad-fam__photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.ad-fam__text { padding: clamp(28px,1.6vw,3vw) max(3vw,20px); display: flex; flex-direction: column; justify-content: center; gap: 16px; }
.ad-fam__head { display: flex; flex-direction: column; gap: 12px; }
.ad-fam__eyebrow { margin: 0; font-size: 0.8125rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--dd-green-pale); }
.ad-fam .ad-fam__title { margin: 0; line-height: 1.05; color: var(--dd-white); max-width: 14ch; }
.ad-fam__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.ad-fam__item { display: flex; align-items: center; gap: 16px; padding: 4px 0; font-size: 1rem; font-weight: 500; }
.ad-fam__icon { width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--dd-green-pale-a50); display: flex; align-items: center; justify-content: center; flex: none; }
.ad-fam__icon img { width: 18px; height: 18px; }
.ad-fam__btn { align-self: flex-start; gap: 12px; min-height: 50px; padding: 0 22px; background: var(--dd-gold); color: var(--dd-ink); }
@media (min-width:1500px) { .ad-fam__text { padding-top: 48px; padding-bottom: 57px; } }
@media (min-width:1200px) and (max-width:1499px) { .ad-fam__text { padding-top: 40px; padding-bottom: 40px; } }

/* 11c. Request a call back (#callback): text + "what to have ready" | form card */
.ad-callback { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: clamp(32px,5vw,72px); align-items: stretch; }
.ad-callback__text { display: flex; flex-direction: column; justify-content: space-between; gap: 16px; }
.ad-callback__text h2 { margin: 0; }
.ad-callback__lead { margin: 0; font-size: 1.03125rem; color: var(--dd-text); max-width: 52ch; }
.ad-callback__box .vi-box__head { padding: 12px 18px; background: var(--dd-white); }
.ad-callback__box .vi-box__list { color: var(--dd-text); }
.ad-callback__note { margin: 0; font-size: 0.8125rem; color: var(--dd-text); max-width: 52ch; }
.ad-callback .ad-callback__form { align-self: stretch; }

/* 11d. Communities we serve: centred head, tiles up to 1000px */
.ad-towns { padding-block: 69px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 32px; }
.ad-towns__head { display: flex; flex-direction: column; align-items: center; gap: 12px; max-width: 720px; }
.ad-towns .ad-towns__title { margin: 0; text-wrap: balance; font-size: clamp(1.75rem,3vw,2.625rem); line-height: 1.05; letter-spacing: -.035em; }
.ad-towns__text { margin: 0; font-size: 1rem; color: var(--dd-text); }
.ad-towns .vi-towns { width: 100%; max-width: 820px; }
.ad-towns .vi-town { min-height: 50px; }

@media (max-width:900px) {
	.ad-fam__text { padding: 28px clamp(20px,3vw,40px); }
	.ad-callback { grid-template-columns: minmax(0,1fr); }
	.vi-steps--2 { grid-template-columns: minmax(0,1fr); }
	.ad-towns { padding-block: 48px; }
}

/* 12. Tour Our Facility (/tour/, canvas Page 2 "Tour Our Facility"):
   template-parts/lp-tour.php. Hero, glance, the office / map section
   (lp-office.php), banner, program cards, FAQ and town tiles are the
   sections above; the room cards are the homepage "What we treat" card. */

.lp-page--tour .in-banner { padding-bottom: 0; }
.lp-page--tour .ad-towns { padding-top: 0; }

/* 12a. "Take a look inside": title | intro, then the photo mosaic */
.tour-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 16px; margin-bottom: clamp(28px,3vw,40px); }
.tour-head .tour-head__eyebrow { margin: 0 0 12px; }
.tour-head__title { margin: 0; }
.tour-head__text { margin: 0; font-size: 1.03125rem; color: var(--dd-text); max-width: 46ch; }

/* the homepage tour grid (home.css .hp-tourgrid) with a caption on each photo */
.tour-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,240px),1fr)); grid-auto-rows: clamp(180px,18vw,260px); gap: 12px; }
.tour-grid--row { margin-top: 12px; }
.tour-grid__item { position: relative; margin: 0; min-height: 0; }
.tour-grid__item--big { grid-column: span 2; grid-row: span 2; }
.tour-grid__img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 10px; }
.tour-grid__cap { position: absolute; left: 12px; bottom: 12px; max-width: calc(100% - 24px); background: var(--dd-white); border-radius: 6px; padding: 6px 10px; font-size: 0.78125rem; font-weight: 600; color: var(--dd-ink); box-shadow: 0 4px 12px var(--dd-hairline); }

/* 12b. Room cards (icon, title, text; no link) */
.tour-rooms { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.tour-rooms .tour-room { min-height: 0; }

@media (max-width:1100px) { .tour-rooms { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width:900px) {
	.tour-grid { grid-template-columns: repeat(2,minmax(0,1fr)); grid-auto-rows: 160px; }
	.tour-grid__item--big { grid-column: span 2; grid-row: span 1; }
}
@media (max-width:560px) { .tour-rooms { grid-template-columns: minmax(0,1fr); } }
