/* ============================================================
   Autumn Hill Manor — Service Page components
   Loaded after styles.css on service templates.
   ============================================================ */

/* ---------- Breadcrumb (light strip, clearly separate from header) ---------- */
.breadcrumb { background:var(--sand-100); border-bottom:1px solid var(--border); }
.breadcrumb .wrap { display:flex; align-items:center; gap:10px; padding:13px 0; font-size:14px; color:var(--text-muted); flex-wrap:wrap; }
.breadcrumb a { color:var(--text-soft); text-decoration:none; font-weight:600; }
.breadcrumb a:hover { color:var(--ink-900); }
.breadcrumb .sep { opacity:.5; }
.breadcrumb .here { color:var(--brand-deep); font-weight:700; }

/* ---------- Service hero ---------- */
.svc-hero { position:relative; overflow:hidden; background:var(--ink-800); isolation:isolate; }
.svc-hero .bg { position:absolute; inset:0; z-index:0; }
.svc-hero .bg img { width:100%; height:100%; object-fit:cover; }
.svc-hero .scrim { position:absolute; inset:0; z-index:1;
  background:linear-gradient(95deg, rgba(33,29,25,.92) 0%, rgba(33,29,25,.74) 46%, rgba(33,29,25,.4) 100%); }
.svc-hero .inner { position:relative; z-index:2; max-width:680px; color:#fff;
  padding:clamp(56px,8vw,104px) 0; }
.svc-hero .eyebrow { color:var(--green-300); }
.svc-hero h1 { color:#fff; font-size:clamp(38px,5.4vw,60px); line-height:1.05; letter-spacing:-.018em; margin-bottom:var(--space-5); }
.svc-hero h1 .em { color:var(--green-300); }
.svc-hero .lede { color:rgba(250,247,241,.86); max-width:52ch; margin-bottom:var(--space-8); }
.svc-hero .hero-cta { display:flex; flex-wrap:wrap; gap:var(--space-4); }
.svc-hero .quick { display:flex; flex-wrap:wrap; gap:var(--space-3); margin-top:var(--space-8); }
.svc-hero .quick span { display:inline-flex; align-items:center; gap:9px; font-size:14px; font-weight:600;
  color:#fff; border:1px solid rgba(255,255,255,.2); padding:9px 16px; border-radius:var(--radius-pill); }
.svc-hero .quick svg { width:17px; height:17px; color:var(--green-300); }

/* ---------- Intro lead ---------- */
.intro-lead { max-width:780px; margin:0 auto; text-align:center; }
.intro-lead .lede { font-size:clamp(21px,2.4vw,26px); line-height:1.55; color:var(--ink-800); }
.intro-lead .sig { font-family:var(--font-display); font-style:italic; font-size:20px; color:var(--brand-deep); margin-top:var(--space-6); }

/* ---------- "Who this is for" checklist ---------- */
.fit-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:var(--space-4); }
.fit-item { display:flex; align-items:flex-start; gap:14px; background:var(--surface); border:1px solid var(--border);
  border-radius:var(--radius-md); padding:20px 22px; box-shadow:var(--shadow-xs); }
.fit-item .tick { width:30px; height:30px; flex-shrink:0; border-radius:var(--radius-pill); background:var(--green-100);
  display:flex; align-items:center; justify-content:center; color:var(--green-700); margin-top:2px; }
.fit-item .tick svg { width:17px; height:17px; stroke-width:2.4; }
.fit-item p { font-size:16px; color:var(--text-soft); }
.fit-item b { color:var(--ink-900); font-weight:700; }

/* ---------- Numbered "what to expect" steps ---------- */
.steps { display:grid; grid-template-columns:repeat(2,1fr); gap:var(--space-6) var(--space-10); counter-reset:step; }
.step { display:flex; gap:18px; counter-increment:step; }
.step .num { flex-shrink:0; width:48px; height:48px; border-radius:var(--radius-pill); background:var(--ink-800);
  color:var(--green-300); display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-size:22px; font-weight:500; }
.step .num::before { content:counter(step,decimal-leading-zero); }
.step h3 { font-size:21px; font-weight:500; margin-bottom:6px; }
.step p { font-size:16px; color:var(--text-soft); }

/* ---------- Benefits two-up ---------- */
.benefit-cols { display:grid; grid-template-columns:repeat(2,1fr); gap:var(--space-6); }
.benefit-card { border-radius:var(--radius-xl); padding:clamp(28px,3.5vw,44px); }
.benefit-card.seniors { background:var(--green-100); border:1px solid var(--green-200); }
.benefit-card.families { background:var(--clay-50); border:1px solid var(--clay-100); }
.benefit-card .head { display:flex; align-items:center; gap:14px; margin-bottom:var(--space-6); }
.benefit-card .head .ic { width:54px; height:54px; flex-shrink:0; border-radius:var(--radius-md); display:flex; align-items:center; justify-content:center; }
.benefit-card.seniors .head .ic { background:var(--green-400); color:var(--ink-900); }
.benefit-card.families .head .ic { background:var(--clay-400); color:#fff; }
.benefit-card .head .ic svg { width:27px; height:27px; }
.benefit-card .head h3 { font-size:26px; font-weight:500; }
.benefit-card ul { list-style:none; display:flex; flex-direction:column; gap:14px; }
.benefit-card li { display:flex; align-items:flex-start; gap:12px; font-size:16.5px; color:var(--ink-800); }
.benefit-card li svg { width:20px; height:20px; flex-shrink:0; margin-top:3px; stroke-width:2.4; }
.benefit-card.seniors li svg { color:var(--green-700); }
.benefit-card.families li svg { color:var(--clay-500); }

/* ---------- Pull quote ---------- */
.pullquote { max-width:920px; margin:0 auto; text-align:center; }
.pullquote .mark { font-family:var(--font-display); font-size:80px; line-height:.6; color:var(--green-400); display:block; margin-bottom:8px; }
.pullquote blockquote { font-family:var(--font-display); font-weight:400; font-style:italic;
  font-size:clamp(26px,3.6vw,40px); line-height:1.3; color:#fff; letter-spacing:-.01em; text-wrap:balance; }
.pullquote .cite { margin-top:var(--space-6); font-family:var(--font-sans); font-size:15px; font-weight:700;
  letter-spacing:.04em; color:var(--green-300); text-transform:uppercase; }

/* ---------- Trust badges ---------- */
.trust-badges { display:grid; grid-template-columns:repeat(4,1fr); gap:var(--space-5); }
.trust-badge { text-align:center; background:var(--surface); border:1px solid var(--border);
  border-radius:var(--radius-lg); padding:32px 22px; box-shadow:var(--shadow-xs); }
.trust-badge .ic { width:60px; height:60px; margin:0 auto var(--space-4); border-radius:var(--radius-pill);
  background:var(--surface-warm); display:flex; align-items:center; justify-content:center; color:var(--brand-deep); }
.trust-badge .ic svg { width:30px; height:30px; }
.trust-badge b { font-family:var(--font-display); font-size:20px; font-weight:500; color:var(--ink-900); display:block; line-height:1.2; }
.trust-badge small { display:block; font-size:14px; color:var(--text-muted); margin-top:6px; }

/* ---------- FAQ accordion ---------- */
.faq-list { max-width:820px; margin:0 auto; display:flex; flex-direction:column; gap:var(--space-3); }
.faq { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md); box-shadow:var(--shadow-xs); overflow:hidden; }
.faq summary { list-style:none; cursor:pointer; padding:22px 26px; display:flex; align-items:center; justify-content:space-between; gap:18px;
  font-family:var(--font-display); font-size:20px; font-weight:500; color:var(--ink-900); }
.faq summary::-webkit-details-marker { display:none; }
.faq summary .chev { flex-shrink:0; width:28px; height:28px; border-radius:var(--radius-pill); background:var(--surface-warm);
  display:flex; align-items:center; justify-content:center; color:var(--brand-deep); transition:transform .25s ease, background .2s ease; }
.faq summary .chev svg { width:16px; height:16px; stroke-width:2.4; }
.faq[open] summary .chev { transform:rotate(180deg); background:var(--green-200); }
.faq .ans { padding:0 26px 24px; }
.faq .ans p { font-size:16.5px; color:var(--text-soft); max-width:64ch; }
.faq summary:hover { background:var(--sand-50); }

/* ---------- Related services strip ---------- */
.related-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-5); }
.related-card { display:flex; align-items:center; gap:16px; background:var(--surface); border:1px solid var(--border);
  border-radius:var(--radius-md); padding:18px 22px; box-shadow:var(--shadow-xs); text-decoration:none; color:inherit;
  transition:transform .15s ease, box-shadow .2s ease, border-color .2s ease; }
.related-card:hover { transform:translateY(-3px); box-shadow:var(--shadow-sm); border-color:var(--sand-300); }
.related-card .ic { width:46px; height:46px; flex-shrink:0; border-radius:var(--radius-md); background:var(--green-100);
  display:flex; align-items:center; justify-content:center; color:var(--green-700); }
.related-card .ic svg { width:23px; height:23px; }
.related-card b { font-family:var(--font-display); font-size:19px; font-weight:500; color:var(--ink-900); display:block; line-height:1.2; }
.related-card .go { margin-left:auto; color:var(--accent); flex-shrink:0; }
.related-card .go svg { width:18px; height:18px; }

@media (max-width:900px){
  .steps, .benefit-cols, .fit-grid { grid-template-columns:1fr; }
  .trust-badges { grid-template-columns:repeat(2,1fr); }
  .related-grid { grid-template-columns:1fr; }
}
@media (max-width:600px){
  .trust-badges { grid-template-columns:1fr; }
  .svc-hero .hero-cta .btn { width:100%; }
}

/* ============================================================
   HERO VARIATIONS (switchable via floating preview switcher)
   ============================================================ */
.hero-variants > [data-hero] { display:none; }

/* generic chip rows for variants 2 & 3 */
.svc-hero-split .quick, .svc-hero-spotlight .quick { display:flex; flex-wrap:wrap; gap:var(--space-3); margin-top:var(--space-7); }
.quick.on-light span { display:inline-flex; align-items:center; gap:9px; font-size:14px; font-weight:600;
  color:var(--ink-800); border:1px solid var(--sand-300); background:var(--sand-50); padding:9px 16px; border-radius:var(--radius-pill); }
.quick.on-light svg { width:17px; height:17px; color:var(--green-700); }

/* ----- Variation 2: Editorial split ----- */
.svc-hero-split { display:grid; grid-template-columns:1.04fr .96fr; min-height:clamp(480px,64vh,620px); background:var(--surface-warm); }
.svc-hero-split .copy { display:flex; align-items:center; padding:clamp(48px,6vw,84px) clamp(36px,4.5vw,64px); }
.svc-hero-split .copy-inner { max-width:540px; }
.svc-hero-split .eyebrow { color:var(--brand-deep); }
.svc-hero-split h1 { font-family:var(--font-display); font-weight:400; font-size:clamp(34px,4.4vw,52px);
  line-height:1.06; letter-spacing:-.018em; color:var(--ink-900); margin-bottom:var(--space-5); }
.svc-hero-split h1 .em { font-style:italic; color:var(--brand-deep); }
.svc-hero-split .lede { color:var(--text-soft); max-width:46ch; margin-bottom:var(--space-8); }
.svc-hero-split .photo { position:relative; min-height:320px; }
.svc-hero-split .photo img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }

/* ----- Variation 3: Spotlight banner + overlap card ----- */
.svc-hero-spotlight { background:var(--bg); }
.svc-hero-spotlight .banner { height:clamp(340px,44vh,500px); overflow:hidden; }
.svc-hero-spotlight .banner img { width:100%; height:100%; object-fit:cover; }
.svc-hero-spotlight .wrap { position:relative; }
.svc-hero-spotlight .card { background:#fff; border:1px solid var(--border); border-radius:var(--radius-xl);
  box-shadow:var(--shadow-xl); padding:clamp(32px,4vw,56px); max-width:720px;
  margin:-110px 0 clamp(40px,6vw,72px); position:relative; z-index:2; }
.svc-hero-spotlight .eyebrow { color:var(--brand-deep); }
.svc-hero-spotlight h1 { font-family:var(--font-display); font-weight:400; font-size:clamp(34px,4.4vw,52px);
  line-height:1.06; letter-spacing:-.018em; color:var(--ink-900); margin-bottom:var(--space-4); }
.svc-hero-spotlight h1 .em { font-style:italic; color:var(--brand-deep); }
.svc-hero-spotlight .lede { color:var(--text-soft); max-width:54ch; margin-bottom:var(--space-7); }

/* ----- Floating variation switcher (preview tool) ----- */
.variant-switcher { position:fixed; right:18px; bottom:18px; z-index:400; background:#fff; border:1px solid var(--border);
  border-radius:var(--radius-lg); box-shadow:var(--shadow-xl); padding:13px 14px 14px; width:236px; font-family:var(--font-sans); }
.variant-switcher .vs-label { font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.12em;
  color:var(--text-muted); display:flex; align-items:center; gap:7px; margin-bottom:10px; }
.variant-switcher .vs-label::before { content:""; width:8px; height:8px; border-radius:50%; background:var(--clay-400); }
.variant-switcher .vs-btns { display:flex; gap:6px; }
.variant-switcher button { flex:1; border:1px solid var(--border); background:var(--sand-50); border-radius:var(--radius-sm);
  padding:9px 6px; cursor:pointer; font-weight:800; font-size:14px; color:var(--ink-700); font-family:var(--font-sans); transition:all .15s ease; }
.variant-switcher button:hover { border-color:var(--sand-400); }
.variant-switcher button.active { background:var(--ink-800); color:#fff; border-color:var(--ink-800); }
.variant-switcher .vs-name { font-size:12.5px; color:var(--text-muted); margin-top:9px; font-weight:600; }

@media (max-width:900px){
  .svc-hero-split { grid-template-columns:1fr; }
  .svc-hero-split .photo { min-height:260px; order:-1; }
  .svc-hero-spotlight .card { margin-top:-72px; }
}
@media (max-width:600px){
  .svc-hero-split .copy { padding:36px 20px; }
  .variant-switcher { right:10px; bottom:10px; width:210px; }
}

/* ============================================================
   "WHO IT'S FOR" — switchable layouts
   ============================================================ */
.fit-variants > [data-fit] { display:none; }

.section-head.with-switch { display:flex; justify-content:space-between; align-items:flex-end; gap:28px; max-width:none; }
.section-head.with-switch .sh-text { max-width:640px; }
.section-head.with-switch .sh-text .lede { margin-top:14px; }

.layout-switch { display:flex; align-items:center; gap:4px; background:#fff; border:1px solid var(--border);
  border-radius:var(--radius-pill); padding:5px; box-shadow:var(--shadow-xs); flex-shrink:0; }
.layout-switch .ls-label { font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.12em;
  color:var(--text-muted); padding:0 8px 0 10px; }
.layout-switch button { width:36px; height:36px; border:none; background:transparent; border-radius:var(--radius-pill);
  cursor:pointer; font-weight:800; font-size:14px; color:var(--ink-700); font-family:var(--font-sans); transition:all .15s ease; }
.layout-switch button:hover { background:var(--sand-100); }
.layout-switch button.active { background:var(--ink-800); color:#fff; }

/* Layout B — split photo + clean checklist */
.fit-split { display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(32px,5vw,64px); align-items:center; }
.fit-split .photo { border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-md); aspect-ratio:4/4.6; }
.fit-split .photo img { width:100%; height:100%; object-fit:cover; }
.fit-checklist { list-style:none; display:flex; flex-direction:column; gap:6px; margin:0; padding:0; }
.fit-checklist li { display:flex; align-items:flex-start; gap:16px; padding:16px 0; border-bottom:1px solid var(--border);
  font-size:18px; color:var(--ink-800); }
.fit-checklist li:last-child { border-bottom:none; }
.fit-checklist li strong { font-weight:700; }
.fit-checklist li svg { width:24px; height:24px; flex-shrink:0; margin-top:2px; color:var(--green-700); stroke-width:2.4; }

/* Layout C — icon tiles */
.fit-tiles { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-5); }
.fit-tile { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg);
  padding:var(--space-7); box-shadow:var(--shadow-xs); transition:transform .15s ease, box-shadow .2s ease; }
.fit-tile:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); }
.fit-tile .ic { width:54px; height:54px; border-radius:var(--radius-md); background:var(--green-100); color:var(--green-700);
  display:flex; align-items:center; justify-content:center; margin-bottom:var(--space-4); }
.fit-tile .ic svg { width:27px; height:27px; }
.fit-tile h3 { font-size:20px; font-weight:500; margin-bottom:8px; color:var(--ink-900); }
.fit-tile p { font-size:15.5px; color:var(--text-soft); }

@media (max-width:900px){
  .fit-split { grid-template-columns:1fr; }
  .fit-split .photo { aspect-ratio:16/10; order:-1; }
  .fit-tiles { grid-template-columns:1fr 1fr; }
  .section-head.with-switch { flex-direction:column; align-items:flex-start; gap:18px; }
}
@media (max-width:600px){
  .fit-tiles { grid-template-columns:1fr; }
}

/* ============================================================
   HERO POINTS (plain text, not pills)
   ============================================================ */
.svc-hero-split .hero-points { display:flex; flex-wrap:wrap; gap:8px 28px; margin-top:24px; }
.svc-hero-split .hero-points span { display:inline-flex; align-items:center; gap:9px; font-size:15px; font-weight:600; color:var(--text-soft); }
.svc-hero-split .hero-points svg { width:18px; height:18px; color:var(--green-700); stroke-width:2.4; flex-shrink:0; }

/* ============================================================
   WHAT TO EXPECT — switchable layouts
   ============================================================ */
.expect-variants > [data-expect] { display:none; }

/* Layout B — image boxes */
.expect-boxes { display:grid; grid-template-columns:repeat(4,1fr); gap:var(--space-5); }
.expect-box { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden;
  box-shadow:var(--shadow-xs); display:flex; flex-direction:column; transition:transform .15s ease, box-shadow .2s ease; }
.expect-box:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); }
.expect-box .img { position:relative; aspect-ratio:4/3; overflow:hidden; }
.expect-box .img img { width:100%; height:100%; object-fit:cover; }
.expect-box .img .n { position:absolute; top:12px; left:12px; width:40px; height:40px; border-radius:var(--radius-pill);
  background:var(--ink-800); color:var(--green-300); display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-size:19px; font-weight:500; box-shadow:var(--shadow-sm); }
.expect-box .body { padding:var(--space-5) var(--space-5) var(--space-6); }
.expect-box h3 { font-size:19px; font-weight:500; margin-bottom:6px; color:var(--ink-900); }
.expect-box p { font-size:15px; color:var(--text-soft); }

/* Layout C — tabs with changing image */
.expect-tabs { display:grid; grid-template-columns:.82fr 1.18fr; gap:clamp(24px,4vw,52px); align-items:start; }
.expect-tablist { display:flex; flex-direction:column; gap:10px; }
.expect-tab { display:flex; align-items:center; gap:16px; text-align:left; width:100%; background:var(--surface);
  border:1px solid var(--border); border-radius:var(--radius-md); padding:18px 20px; cursor:pointer;
  font-family:var(--font-sans); transition:all .15s ease; }
.expect-tab:hover { border-color:var(--sand-300); }
.expect-tab.active { background:var(--ink-800); border-color:var(--ink-800); }
.expect-tab .n { width:38px; height:38px; flex-shrink:0; border-radius:var(--radius-pill); background:var(--green-100);
  color:var(--green-700); display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-size:18px; }
.expect-tab.active .n { background:var(--green-400); color:var(--ink-900); }
.expect-tab .t { font-size:18px; font-weight:700; color:var(--ink-900); }
.expect-tab.active .t { color:#fff; }
.expect-panels { position:relative; }
.expect-panel { display:none; }
.expect-panel.active { display:block; animation:expectFade .35s ease; }
@keyframes expectFade { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
.expect-panel .pimg { border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-md); aspect-ratio:16/10; margin-bottom:var(--space-5); }
.expect-panel .pimg img { width:100%; height:100%; object-fit:cover; }
.expect-panel p { font-size:17px; color:var(--text-soft); max-width:54ch; }

@media (max-width:900px){
  .expect-boxes { grid-template-columns:repeat(2,1fr); }
  .expect-tabs { grid-template-columns:1fr; }
  .expect-panels { order:-1; }
}
@media (max-width:540px){
  .expect-boxes { grid-template-columns:1fr; }
}

/* ============================================================
   THE DIFFERENCE IT MAKES — switchable layouts
   ============================================================ */
.diff-variants > [data-diff] { display:none; }

/* Variation B — perspective toggle */
.aud-toggle { display:inline-flex; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-pill);
  padding:5px; box-shadow:var(--shadow-xs); margin-bottom:var(--space-8); }
.aud-toggle button { border:none; background:transparent; border-radius:var(--radius-pill); padding:11px 26px; cursor:pointer;
  font-family:var(--font-sans); font-weight:800; font-size:15px; color:var(--ink-700); transition:all .15s ease; }
.aud-toggle button.active { background:var(--ink-800); color:#fff; }
.aud-panel { display:none; }
.aud-panel.active { display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,4vw,56px); align-items:center; animation:expectFade .35s ease; }
.aud-panel .photo { border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-md); aspect-ratio:5/4; }
.aud-panel .photo img { width:100%; height:100%; object-fit:cover; }
.aud-panel h3 { font-family:var(--font-display); font-weight:500; font-size:26px; margin-bottom:18px; color:var(--ink-900); }
.aud-panel ul { list-style:none; display:flex; flex-direction:column; gap:15px; }
.aud-panel li { display:flex; align-items:flex-start; gap:14px; font-size:17.5px; color:var(--ink-800); }
.aud-panel li svg { width:22px; height:22px; flex-shrink:0; margin-top:3px; color:var(--green-700); stroke-width:2.4; }

/* Variation C — outcome tiles */
.outcome-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-5); }
.outcome { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); padding:var(--space-7);
  box-shadow:var(--shadow-xs); transition:transform .15s ease, box-shadow .2s ease; }
.outcome:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); }
.outcome .top { display:flex; align-items:center; justify-content:space-between; margin-bottom:var(--space-4); }
.outcome .ic { width:50px; height:50px; border-radius:var(--radius-md); display:flex; align-items:center; justify-content:center; }
.outcome .ic svg { width:25px; height:25px; }
.outcome .tag { font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.1em; padding:5px 11px; border-radius:var(--radius-pill); }
.outcome.s .ic { background:var(--green-100); color:var(--green-700); }
.outcome.s .tag { background:var(--green-100); color:var(--green-700); }
.outcome.f .ic { background:var(--clay-50); color:var(--clay-500); }
.outcome.f .tag { background:var(--clay-50); color:var(--clay-600); }
.outcome h3 { font-size:21px; font-weight:500; margin-bottom:8px; color:var(--ink-900); }
.outcome p { font-size:15px; color:var(--text-soft); }

@media (max-width:900px){
  .aud-panel.active { grid-template-columns:1fr; }
  .aud-panel .photo { order:-1; aspect-ratio:16/10; }
  .outcome-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:540px){ .outcome-grid { grid-template-columns:1fr; } }

/* ============================================================
   ICON BOXES — centered icon, text underneath
   ============================================================ */
.icon-boxes { display:grid; grid-template-columns:repeat(4,1fr); gap:var(--space-5); }
.icon-box { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg);
  padding:var(--space-10) var(--space-8); box-shadow:var(--shadow-xs); text-align:center;
  display:flex; flex-direction:column; align-items:center; transition:transform .15s ease, box-shadow .2s ease; }
.icon-box:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); }
.icon-box .ic { width:62px; height:62px; border-radius:var(--radius-md); background:var(--green-100); color:var(--green-700);
  display:flex; align-items:center; justify-content:center; margin:0 0 var(--space-4); }
.icon-box .ic svg { width:31px; height:31px; }
.icon-box h3 { font-size:20px; font-weight:500; margin-bottom:8px; color:var(--ink-900); }
.icon-box p { font-size:15.5px; color:var(--text-soft); }
@media (max-width:900px){ .icon-boxes { grid-template-columns:repeat(2,1fr); } }
@media (max-width:540px){ .icon-boxes { grid-template-columns:1fr; } }

/* ============================================================
   ABOUT — Mission / Vision / Promise
   ============================================================ */
.mvp-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-6); }
.mvp-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-xl);
  padding:clamp(28px,3.4vw,44px); box-shadow:var(--shadow-sm); display:flex; flex-direction:column; }
.mvp-card .ic { width:60px; height:60px; border-radius:var(--radius-md); display:flex; align-items:center; justify-content:center; margin-bottom:var(--space-5); }
.mvp-card .ic svg { width:30px; height:30px; }
.mvp-card.mission .ic { background:var(--green-100); color:var(--green-700); }
.mvp-card.vision .ic { background:var(--clay-50); color:var(--clay-500); }
.mvp-card.promise .ic { background:rgba(198,162,74,.16); color:var(--gold-500); }
.mvp-card .label { font-size:13px; font-weight:800; text-transform:uppercase; letter-spacing:.14em; color:var(--text-muted); margin-bottom:10px; }
.mvp-card h3 { font-family:var(--font-display); font-weight:400; font-size:clamp(23px,2.4vw,28px); line-height:1.22; color:var(--ink-900); }
.mvp-card p { margin-top:var(--space-4); font-size:16.5px; color:var(--text-soft); }
@media (max-width:900px){ .mvp-grid { grid-template-columns:1fr; } }

/* ============================================================
   ABOUT — Core Values (five large cards, 3 + 2)
   ============================================================ */
.value-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:var(--space-6); }
.value-card { grid-column:span 2; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-xl);
  padding:clamp(28px,3vw,40px); box-shadow:var(--shadow-xs); transition:transform .15s ease, box-shadow .2s ease;
  position:relative; overflow:hidden; }
.value-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-md); }
.value-card:nth-child(4) { grid-column:2 / span 2; }
.value-card:nth-child(5) { grid-column:4 / span 2; }
.value-card .vnum { font-family:var(--font-display); font-style:italic; font-size:20px; color:var(--gold-400); margin-bottom:14px; }
.value-card .ic { width:64px; height:64px; border-radius:var(--radius-lg); background:var(--green-100); color:var(--green-700);
  display:flex; align-items:center; justify-content:center; margin-bottom:var(--space-5); }
.value-card .ic svg { width:32px; height:32px; }
.value-card h3 { font-family:var(--font-display); font-weight:500; font-size:27px; color:var(--ink-900); margin-bottom:10px; }
.value-card p { font-size:16.5px; color:var(--text-soft); }
@media (max-width:980px){
  .value-grid { grid-template-columns:repeat(2,1fr); }
  .value-card, .value-card:nth-child(4), .value-card:nth-child(5) { grid-column:auto; }
  .value-card:nth-child(5) { grid-column:1 / -1; }
}
@media (max-width:560px){
  .value-grid { grid-template-columns:1fr; }
  .value-card:nth-child(5) { grid-column:auto; }
}

/* ============================================================
   TOUR PAGE — form + trust panel
   ============================================================ */
.tour-layout { display:grid; grid-template-columns:1.25fr .75fr; gap:clamp(28px,4vw,52px); align-items:start; }
.form-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-xl);
  padding:clamp(28px,3.6vw,48px); box-shadow:var(--shadow-md); }
.form-card .form-head { margin-bottom:var(--space-6); }
.form-card .form-head h2 { font-family:var(--font-display); font-weight:500; font-size:clamp(26px,3vw,34px); color:var(--ink-900); }
.form-card .form-head p { color:var(--text-soft); font-size:16.5px; margin-top:8px; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:var(--space-5); }
.field { display:flex; flex-direction:column; gap:7px; }
.field.full { grid-column:1 / -1; }
.field label { font-size:14px; font-weight:700; color:var(--ink-800); }
.field label .req { color:var(--clay-500); }
.field input, .field select, .field textarea {
  font-family:var(--font-sans); font-size:16px; color:var(--ink-900); background:var(--sand-50);
  border:1.5px solid var(--border); border-radius:var(--radius-md); padding:13px 15px; transition:border-color .15s ease, box-shadow .15s ease; width:100%;
}
.field textarea { resize:vertical; min-height:104px; }
.field input:focus, .field select:focus, .field textarea:focus {
  outline:none; border-color:var(--green-400); box-shadow:0 0 0 3px rgba(184,196,42,.18); background:#fff;
}
.field select { appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23786A54' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; background-size:18px; padding-right:42px; }
.form-actions { margin-top:var(--space-6); display:flex; flex-direction:column; gap:12px; }
.form-actions .btn { width:100%; }
.form-note { font-size:13px; color:var(--text-muted); text-align:center; }
.form-note a { color:var(--accent-deep); font-weight:600; }

/* Trust panel */
.trust-panel { display:flex; flex-direction:column; gap:var(--space-5); }
.tp-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); padding:var(--space-7); box-shadow:var(--shadow-xs); }
.tp-card.ink { background:var(--ink-800); color:var(--sand-50); border-color:transparent; }
.tp-card h3 { font-family:var(--font-display); font-weight:500; font-size:22px; margin-bottom:var(--space-4); color:var(--ink-900); }
.tp-card.ink h3 { color:#fff; }
.tp-contact { display:flex; flex-direction:column; gap:var(--space-4); }
.tp-row { display:flex; align-items:flex-start; gap:14px; }
.tp-row .ic { width:42px; height:42px; flex-shrink:0; border-radius:var(--radius-md); background:var(--green-100); color:var(--green-700); display:flex; align-items:center; justify-content:center; }
.tp-card.ink .tp-row .ic { background:rgba(184,196,42,.16); color:var(--green-300); }
.tp-row .ic svg { width:21px; height:21px; }
.tp-row .lab { font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--text-muted); }
.tp-card.ink .tp-row .lab { color:var(--green-300); }
.tp-row a, .tp-row span { display:block; font-size:16.5px; font-weight:600; color:var(--ink-900); text-decoration:none; }
.tp-card.ink .tp-row a, .tp-card.ink .tp-row span { color:#fff; }
.tp-row a:hover { color:var(--accent-deep); }
.tp-list { list-style:none; display:flex; flex-direction:column; gap:13px; }
.tp-list li { display:flex; align-items:flex-start; gap:11px; font-size:15.5px; color:rgba(250,247,241,.84); }
.tp-list li svg { width:19px; height:19px; flex-shrink:0; margin-top:3px; color:var(--green-300); stroke-width:2.4; }
.tp-quote { font-family:var(--font-display); font-style:italic; font-size:18px; line-height:1.5; color:var(--ink-800); }
.tp-quote .by { display:block; font-family:var(--font-sans); font-style:normal; font-size:13px; font-weight:700; color:var(--text-muted); margin-top:10px; letter-spacing:.03em; }

/* Success / calendar state */
.tour-success { display:none; }
.tour-success.show { display:block; animation:expectFade .4s ease; }
.success-banner { display:flex; align-items:center; gap:18px; background:var(--green-100); border:1px solid var(--green-200);
  border-radius:var(--radius-lg); padding:24px 28px; margin-bottom:var(--space-6); }
.success-banner .ic { width:54px; height:54px; flex-shrink:0; border-radius:var(--radius-pill); background:var(--green-400); color:var(--ink-900); display:flex; align-items:center; justify-content:center; }
.success-banner .ic svg { width:28px; height:28px; stroke-width:2.6; }
.success-banner h3 { font-family:var(--font-display); font-weight:500; font-size:23px; color:var(--green-900); }
.success-banner p { font-size:15.5px; color:var(--green-900); opacity:.85; margin-top:3px; }
.calendar-embed { border:1.5px dashed var(--sand-300); border-radius:var(--radius-lg); background:var(--sand-50);
  min-height:420px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; text-align:center; padding:40px; }
.calendar-embed .ic { width:64px; height:64px; border-radius:var(--radius-lg); background:var(--surface-warm); color:var(--brand-deep); display:flex; align-items:center; justify-content:center; }
.calendar-embed .ic svg { width:32px; height:32px; }
.calendar-embed b { font-family:var(--font-display); font-size:22px; font-weight:500; color:var(--ink-900); }
.calendar-embed p { font-size:15px; color:var(--text-muted); max-width:40ch; }
.calendar-embed code { font-family:'SF Mono', ui-monospace, monospace; font-size:12px; color:var(--sand-700); background:var(--surface-warm); padding:6px 12px; border-radius:var(--radius-pill); }

@media (max-width:900px){ .tour-layout { grid-template-columns:1fr; } }
@media (max-width:520px){ .form-grid { grid-template-columns:1fr; } }

/* ============================================================
   CF7 — styled to match AHM tour form design
   ============================================================ */

/* Strip CF7's default margins/padding */
.ahm-cf7-wrap .wpcf7 { margin:0; }
.ahm-cf7-wrap .wpcf7-form > p { margin:0; }

/* CF7 wraps each control in a span; make it full-width */
.ahm-cf7-wrap .wpcf7-form-control-wrap { display:block; }

/* Inputs, selects, textareas */
.ahm-cf7-wrap input[type="text"],
.ahm-cf7-wrap input[type="email"],
.ahm-cf7-wrap input[type="tel"],
.ahm-cf7-wrap select,
.ahm-cf7-wrap textarea {
  font-family:var(--font-sans); font-size:16px; color:var(--ink-900);
  background:var(--sand-50); border:1.5px solid var(--border);
  border-radius:var(--radius-md); padding:13px 15px;
  transition:border-color .15s ease, box-shadow .15s ease;
  width:100%; display:block;
}
.ahm-cf7-wrap textarea { resize:vertical; min-height:104px; }
.ahm-cf7-wrap input[type="text"]:focus,
.ahm-cf7-wrap input[type="email"]:focus,
.ahm-cf7-wrap input[type="tel"]:focus,
.ahm-cf7-wrap select:focus,
.ahm-cf7-wrap textarea:focus {
  outline:none; border-color:var(--green-400);
  box-shadow:0 0 0 3px rgba(184,196,42,.18); background:#fff;
}
.ahm-cf7-wrap select {
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23786A54' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center;
  background-size:18px; padding-right:42px;
}

/* Submit button */
.ahm-cf7-wrap input[type="submit"] {
  font-family:var(--font-sans); font-weight:800; font-size:17px; line-height:1;
  padding:20px 34px; border-radius:var(--radius-pill); border:2px solid transparent;
  cursor:pointer; background:var(--clay-400); color:#fff; box-shadow:var(--shadow-sm);
  transition:transform .15s ease, box-shadow .2s ease, background .2s ease;
  width:100%; display:block;
}
.ahm-cf7-wrap input[type="submit"]:hover {
  background:var(--clay-500); transform:translateY(-2px); box-shadow:var(--shadow-md);
}
.ahm-cf7-wrap input[type="submit"]:disabled { opacity:.7; cursor:wait; transform:none; }

/* Inline validation errors */
.ahm-cf7-wrap .wpcf7-not-valid { border-color:var(--clay-400) !important; }
.ahm-cf7-wrap .wpcf7-not-valid-tip {
  display:block; color:var(--clay-500); font-size:12.5px; font-weight:600; margin-top:5px;
}

/* Response output banner */
.ahm-cf7-wrap .wpcf7-response-output {
  margin:var(--space-5) 0 0; padding:16px 20px; border-radius:var(--radius-md);
  font-size:15px; font-weight:600; border:1.5px solid; line-height:1.5;
}
.ahm-cf7-wrap .wpcf7-mail-sent-ok {
  background:var(--green-100); border-color:var(--green-300); color:var(--green-900);
}
.ahm-cf7-wrap .wpcf7-mail-sent-ng,
.ahm-cf7-wrap .wpcf7-spam-blocked,
.ahm-cf7-wrap .wpcf7-aborted {
  background:var(--clay-50); border-color:var(--clay-300); color:var(--clay-700);
}
.ahm-cf7-wrap .wpcf7-validation-errors,
.ahm-cf7-wrap .wpcf7-acceptance-missing {
  background:var(--sand-100); border-color:var(--sand-300); color:var(--ink-800);
}

/* Spinner */
.ahm-cf7-wrap .wpcf7-spinner { display:inline-block; margin-left:10px; vertical-align:middle; }

/* No-form placeholder */
.ahm-cf7-placeholder {
  background:var(--sand-100); border:1.5px dashed var(--sand-300);
  border-radius:var(--radius-md); padding:28px 24px;
  font-size:15px; color:var(--text-muted); text-align:center;
}
.ahm-cf7-placeholder strong { color:var(--ink-800); }

/* ============================================================
   FLOOR PLANS & PRICING
   ============================================================ */
/* Suite / floor plan cards */
.plan-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-6); }
.plan-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden;
  box-shadow:var(--shadow-xs); display:flex; flex-direction:column; transition:transform .18s ease, box-shadow .2s ease, border-color .2s ease; }
.plan-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:var(--sand-300); }
.plan-card.featured { border-color:var(--green-400); box-shadow:var(--shadow-md); }
.plan-photo { position:relative; aspect-ratio:16/10; overflow:hidden; background:var(--sand-100); }
.plan-photo img { width:100%; height:100%; object-fit:cover; }
.plan-flag { position:absolute; top:14px; left:14px; background:var(--green-400); color:var(--ink-900);
  font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; padding:7px 13px; border-radius:var(--radius-pill); box-shadow:var(--shadow-sm); }
.plan-body { padding:var(--space-6) var(--space-6) var(--space-8); display:flex; flex-direction:column; flex:1; }
.plan-body h3 { font-family:var(--font-display); font-weight:500; font-size:25px; color:var(--ink-900); }
.plan-specs { display:flex; flex-wrap:wrap; gap:8px 18px; margin:14px 0 18px; }
.plan-specs span { display:inline-flex; align-items:center; gap:7px; font-size:14.5px; font-weight:600; color:var(--text-soft); }
.plan-specs svg { width:17px; height:17px; color:var(--green-700); }
.plan-price { margin-top:auto; padding-top:18px; border-top:1px solid var(--border-soft); }
.plan-price .from { font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--text-muted); }
.plan-price .amt { font-family:var(--font-display); font-size:34px; font-weight:500; color:var(--ink-900); line-height:1.1; }
.plan-price .amt small { font-family:var(--font-sans); font-size:15px; font-weight:600; color:var(--text-muted); }
.plan-card .btn { margin-top:var(--space-5); width:100%; }

/* Included / optional services */
.svc-cols { display:grid; grid-template-columns:1fr 1fr; gap:var(--space-6); }
.svc-panel { border-radius:var(--radius-xl); padding:clamp(28px,3.4vw,44px); }
.svc-panel.included { background:var(--green-100); border:1px solid var(--green-200); }
.svc-panel.optional { background:var(--surface); border:1px solid var(--border); box-shadow:var(--shadow-xs); }
.svc-panel .head { display:flex; align-items:center; gap:14px; margin-bottom:var(--space-6); }
.svc-panel .head .ic { width:52px; height:52px; flex-shrink:0; border-radius:var(--radius-md); display:flex; align-items:center; justify-content:center; }
.svc-panel.included .head .ic { background:var(--green-400); color:var(--ink-900); }
.svc-panel.optional .head .ic { background:var(--surface-warm); color:var(--brand-deep); }
.svc-panel .head .ic svg { width:26px; height:26px; }
.svc-panel .head h3 { font-family:var(--font-display); font-weight:500; font-size:25px; color:var(--ink-900); }
.svc-panel .head p { font-size:14px; color:var(--text-muted); margin-top:2px; }
.svc-items { list-style:none; display:flex; flex-direction:column; }
.svc-items li { display:flex; align-items:center; gap:13px; padding:13px 0; border-bottom:1px solid rgba(46,40,36,.08); font-size:16.5px; color:var(--ink-800); }
.svc-items li:last-child { border-bottom:none; }
.svc-items li svg { width:20px; height:20px; flex-shrink:0; stroke-width:2.4; }
.svc-panel.included .svc-items li svg { color:var(--green-700); }
.svc-items li .opt-price { margin-left:auto; font-size:14px; font-weight:700; color:var(--text-muted); white-space:nowrap; }
.svc-panel.optional .svc-items li svg { color:var(--clay-500); }

@media (max-width:900px){
  .plan-grid { grid-template-columns:1fr; max-width:460px; margin:0 auto; }
  .svc-cols { grid-template-columns:1fr; }
}

/* ============================================================
   COST CALCULATOR PAGE
   ============================================================ */
.calc-layout { display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(28px,4vw,48px); align-items:start; }
.calc-steps { display:flex; flex-direction:column; gap:var(--space-6); }
.calc-step .step-label { display:flex; align-items:center; gap:11px; font-size:14px; font-weight:800;
  text-transform:uppercase; letter-spacing:.1em; color:var(--brand-deep); margin-bottom:var(--space-4); }
.calc-step .step-label .n { width:26px; height:26px; flex-shrink:0; border-radius:var(--radius-pill);
  background:var(--ink-800); color:var(--green-300); display:flex; align-items:center; justify-content:center; font-size:13px; font-family:var(--font-sans); }
/* Option chips (care type / support level) */
.opt-chips { display:flex; flex-wrap:wrap; gap:11px; }
.opt-chip { position:relative; }
.opt-chip input { position:absolute; opacity:0; inset:0; cursor:pointer; }
.opt-chip span { display:block; padding:13px 18px; border:1.5px solid var(--border); border-radius:var(--radius-pill);
  background:var(--surface); font-size:15px; font-weight:700; color:var(--ink-800); cursor:pointer; transition:all .15s ease; }
.opt-chip input:checked + span { background:var(--ink-800); border-color:var(--ink-800); color:#fff; }
.opt-chip input:focus-visible + span { box-shadow:0 0 0 3px rgba(184,196,42,.3); }
.opt-chip span:hover { border-color:var(--sand-400); }

/* Live estimate panel */
.estimate-card { position:sticky; top:100px; background:var(--ink-800); color:var(--sand-50);
  border-radius:var(--radius-xl); padding:clamp(28px,3.4vw,40px); box-shadow:var(--shadow-lg); }
.estimate-card .lab { font-size:13px; font-weight:800; text-transform:uppercase; letter-spacing:.14em; color:var(--green-300); }
.estimate-card .amount { font-family:var(--font-display); font-weight:500; font-size:clamp(40px,5vw,56px); line-height:1.05; margin:10px 0 4px; }
.estimate-card .amount .per { font-family:var(--font-sans); font-size:17px; font-weight:600; color:rgba(250,247,241,.7); }
.estimate-card .sub { font-size:14.5px; color:rgba(250,247,241,.7); }
.estimate-card .est-divider { height:1px; background:rgba(255,255,255,.12); margin:var(--space-6) 0; }
.est-lines { display:flex; flex-direction:column; gap:12px; }
.est-line { display:flex; justify-content:space-between; align-items:center; gap:14px; font-size:15px; }
.est-line span:first-child { color:rgba(250,247,241,.78); }
.est-line b { color:#fff; font-weight:700; text-align:right; }
.estimate-card .disclaimer { margin-top:var(--space-6); font-size:12.5px; color:rgba(250,247,241,.55); line-height:1.5; }
.estimate-card .lead-prompt { margin-top:var(--space-5); padding-top:var(--space-5); border-top:1px solid rgba(255,255,255,.12);
  display:flex; align-items:center; gap:10px; font-size:14px; color:var(--green-300); font-weight:600; }
.estimate-card .lead-prompt svg { width:18px; height:18px; flex-shrink:0; }

@media (max-width:900px){
  .calc-layout { grid-template-columns:1fr; }
  .estimate-card { position:static; }
}

/* ============================================================
   MEET OUR TEAM
   ============================================================ */
.team-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-8); }
.team-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-xl);
  overflow:hidden; box-shadow:var(--shadow-sm); display:flex; flex-direction:column;
  transition:transform .18s ease, box-shadow .2s ease; }
.team-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-md); }
.team-portrait { position:relative; aspect-ratio:4/5; background:var(--green-100); overflow:hidden; }
.team-portrait image-slot { position:absolute; inset:0; width:100%; height:100%; --slot-radius:0; }
.team-portrait .monogram { position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-weight:500; font-size:64px; color:var(--green-700);
  background:radial-gradient(circle at 50% 38%, var(--green-100), var(--sand-100)); pointer-events:none; }
.team-body { padding:var(--space-6) var(--space-7) var(--space-8); display:flex; flex-direction:column; flex:1; }
.team-body h3 { font-family:var(--font-display); font-weight:500; font-size:25px; color:var(--ink-900); }
.team-body .role { display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:800;
  text-transform:uppercase; letter-spacing:.1em; color:var(--brand-deep); margin:8px 0 16px; }
.team-body .role::before { content:""; width:18px; height:2px; background:var(--green-400); border-radius:2px; }
.team-body p { font-size:16px; color:var(--text-soft); }
.team-body .team-quote { margin-top:16px; padding-top:16px; border-top:1px solid var(--border-soft);
  font-family:var(--font-display); font-style:italic; font-size:17px; color:var(--ink-800); }
@media (max-width:900px){ .team-grid { grid-template-columns:1fr; max-width:420px; margin:0 auto; } }

/* ============================================================
   TESTIMONIALS & REVIEWS PAGE
   ============================================================ */
/* Google rating overview band */
.rating-overview { display:grid; grid-template-columns:auto 1fr auto; gap:clamp(28px,5vw,64px); align-items:center;
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-xl);
  padding:clamp(28px,4vw,48px); box-shadow:var(--shadow-sm); }
.rating-score { text-align:center; }
.rating-score .num { font-family:var(--font-display); font-weight:500; font-size:72px; line-height:1; color:var(--ink-900); }
.rating-score .stars { justify-content:center; margin:8px 0 6px; }
.rating-score .stars svg { width:22px; height:22px; }
.rating-score .count { font-size:14px; color:var(--text-muted); font-weight:600; }
.rating-mid { border-left:1px solid var(--border); border-right:1px solid var(--border); padding:0 clamp(20px,4vw,48px); }
.rating-mid h3 { font-family:var(--font-display); font-weight:500; font-size:26px; color:var(--ink-900); margin-bottom:10px; }
.rating-mid p { font-size:16px; color:var(--text-soft); }
.rating-google { display:flex; flex-direction:column; align-items:center; gap:14px; text-align:center; }
.g-badge { display:flex; align-items:center; gap:10px; font-weight:800; font-size:17px; color:var(--ink-800); }
.g-badge .g-mark { font-family:var(--font-display); font-size:26px; font-weight:600; }
.rating-bars { display:flex; flex-direction:column; gap:7px; margin-top:14px; width:100%; }
.rating-bar { display:flex; align-items:center; gap:10px; font-size:12.5px; color:var(--text-muted); }
.rating-bar .s { width:34px; font-weight:700; }
.rating-bar .track { flex:1; height:7px; background:var(--sand-100); border-radius:var(--radius-pill); overflow:hidden; }
.rating-bar .fill { height:100%; background:var(--green-400); border-radius:var(--radius-pill); }

/* Large review cards — masonry columns, easy to scan */
.reviews-masonry { columns:2; column-gap:var(--space-6); }
.review-card { break-inside:avoid; margin:0 0 var(--space-6); background:var(--surface); border:1px solid var(--border);
  border-radius:var(--radius-lg); padding:var(--space-8); box-shadow:var(--shadow-xs); }
.review-card .stars { margin-bottom:var(--space-4); }
.review-card .stars svg { width:18px; height:18px; }
.review-card blockquote { font-size:19px; line-height:1.6; color:var(--ink-800); margin-bottom:var(--space-6); text-wrap:pretty; }
.review-card .who { display:flex; align-items:center; gap:14px; }
.review-card .avatar { width:48px; height:48px; border-radius:var(--radius-pill); background:var(--green-100); color:var(--green-700);
  display:flex; align-items:center; justify-content:center; font-weight:800; font-size:18px; font-family:var(--font-display); flex-shrink:0; }
.review-card .who b { font-size:16px; color:var(--ink-900); display:block; }
.review-card .who small { font-size:13px; color:var(--text-muted); }
.review-card .src { margin-left:auto; flex-shrink:0; font-size:12px; font-weight:700; color:var(--text-muted);
  display:inline-flex; align-items:center; gap:6px; }
.review-card .src .g-mark { font-family:var(--font-display); font-size:16px; font-weight:600; color:var(--ink-700); }
@media (max-width:760px){ .reviews-masonry { columns:1; } }

@media (max-width:860px){
  .rating-overview { grid-template-columns:1fr; gap:var(--space-6); text-align:center; }
  .rating-mid { border:none; border-top:1px solid var(--border); border-bottom:1px solid var(--border); padding:var(--space-6) 0; }
}

/* ============================================================
   BLOG ARTICLE (SINGLE POST)
   ============================================================ */

/* Centred header above the content */
.article-head { max-width:760px; margin:0 auto; text-align:center; padding:clamp(48px,7vw,80px) 0 0; }
.article-head .a-tag {
  display:inline-block; font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.12em;
  color:var(--brand-deep); background:var(--green-100); padding:7px 15px; border-radius:var(--radius-pill);
  margin-bottom:var(--space-5); text-decoration:none;
}
.article-head .a-tag:hover { background:var(--green-200); }
.article-head h1 { font-family:var(--font-display); font-weight:400; font-size:clamp(34px,5vw,52px); line-height:1.08; letter-spacing:-.015em; color:var(--ink-900); }
.article-meta { display:flex; align-items:center; justify-content:center; gap:14px; margin-top:var(--space-6); flex-wrap:wrap; color:var(--text-muted); font-size:14.5px; font-weight:600; }
.article-meta .author { display:flex; align-items:center; gap:10px; color:var(--ink-800); }
.article-meta .author .av { width:38px; height:38px; border-radius:var(--radius-pill); background:var(--green-100); color:var(--green-700); display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-weight:600; font-size:16px; }
.article-meta .dot { width:4px; height:4px; border-radius:50%; background:var(--sand-400); flex-shrink:0; }

/* Full-width hero image */
.article-hero-img { max-width:980px; margin:var(--space-10) auto 0; border-radius:var(--radius-xl); overflow:hidden; box-shadow:var(--shadow-md); aspect-ratio:21/9; }
.article-hero-img img { width:100%; height:100%; object-fit:cover; display:block; }

/* Two-column layout: TOC + body */
.article-layout { display:grid; grid-template-columns:240px 1fr; gap:clamp(32px,5vw,64px); align-items:start; padding:clamp(48px,7vw,80px) 0; }

/* Table of contents */
.toc { position:sticky; top:104px; }
.toc h4 { font-family:var(--font-sans); font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.13em; color:var(--text-muted); margin-bottom:var(--space-4); }
.toc ul { list-style:none; display:flex; flex-direction:column; gap:2px; border-left:2px solid var(--border); }
.toc a { display:block; padding:9px 16px; margin-left:-2px; border-left:2px solid transparent; color:var(--text-soft); text-decoration:none; font-size:14.5px; font-weight:600; transition:all .15s ease; line-height:1.4; }
.toc a:hover { color:var(--ink-900); }
.toc a.active { color:var(--brand-deep); border-left-color:var(--green-400); font-weight:700; }

/* Article body prose */
.article-body { max-width:720px; }
.article-body h2 { font-family:var(--font-display); font-weight:500; font-size:clamp(26px,3vw,32px); line-height:1.2; color:var(--ink-900); margin:var(--space-10) 0 var(--space-4); scroll-margin-top:104px; }
.article-body h2:first-child { margin-top:0; }
.article-body h3 { font-family:var(--font-display); font-weight:500; font-size:23px; color:var(--ink-900); margin:var(--space-6) 0 var(--space-3); }
.article-body p { font-size:18px; line-height:1.75; color:var(--ink-800); margin-bottom:var(--space-5); }
.article-body ul, .article-body ol { margin:0 0 var(--space-5) var(--space-5); display:flex; flex-direction:column; gap:10px; }
.article-body li { font-size:18px; line-height:1.7; color:var(--ink-800); }
.article-body a:not(.btn) { color:var(--accent-deep); text-decoration:underline; text-underline-offset:2px; }

/* Callout boxes */
.callout { background:var(--green-50); border:1px solid var(--green-200); border-left:4px solid var(--green-400); border-radius:var(--radius-md); padding:var(--space-6) var(--space-7); margin:var(--space-8) 0; }
.callout.clay { background:var(--clay-50); border-color:var(--clay-100); border-left-color:var(--clay-400); }
.callout .c-head { display:flex; align-items:center; gap:11px; font-family:var(--font-sans); font-weight:800; font-size:15px; color:var(--ink-900); margin-bottom:10px; }
.callout .c-head svg { width:21px; height:21px; color:var(--green-700); }
.callout.clay .c-head svg { color:var(--clay-500); }
.callout p { font-size:16px !important; line-height:1.65 !important; color:var(--text-soft) !important; margin:0 !important; }

/* Back link */
.article-back { display:inline-flex; align-items:center; gap:8px; font-size:14px; font-weight:700; color:var(--text-muted); text-decoration:none; margin-bottom:var(--space-8); transition:color .15s ease; }
.article-back svg { width:16px; height:16px; transform:rotate(180deg); }
.article-back:hover { color:var(--ink-900); }

/* Related articles */
.related-articles { padding:clamp(48px,6vw,72px) 0; border-top:1px solid var(--border); }
.related-articles .section-head { margin-bottom:var(--space-8); }

@media (max-width:900px) {
  .article-layout { grid-template-columns:1fr; padding:clamp(32px,5vw,56px) 0; }
  .toc { position:static; margin-bottom:var(--space-6); border:1px solid var(--border); border-radius:var(--radius-md); padding:var(--space-5); background:var(--surface); }
  .toc ul { border-left:none; }
  .article-hero-img { border-radius:var(--radius-lg); }
}
@media (max-width:600px) {
  .article-hero-img { aspect-ratio:16/9; }
}

/* ============================================================
   BLOG / FAMILY RESOURCES PAGE
   ============================================================ */

/* Toolbar */
.blog-toolbar { display:flex; align-items:center; gap:var(--space-5); margin-bottom:var(--space-8); flex-wrap:wrap; }

.blog-search { position:relative; }
.blog-search svg { position:absolute; left:14px; top:50%; transform:translateY(-50%); width:18px; height:18px; color:var(--text-muted); pointer-events:none; }
.blog-search input {
  font-family:var(--font-sans); font-size:15px; color:var(--ink-900); background:var(--surface);
  border:1.5px solid var(--border); border-radius:var(--radius-pill);
  padding:11px 18px 11px 42px; width:240px;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.blog-search input:focus { outline:none; border-color:var(--green-400); box-shadow:0 0 0 3px rgba(184,196,42,.18); }
.blog-search input::placeholder { color:var(--text-muted); }

.blog-filters { display:flex; flex-wrap:wrap; gap:8px; }
.blog-filters button {
  font-family:var(--font-sans); font-size:14px; font-weight:700;
  padding:9px 18px; border-radius:var(--radius-pill);
  border:1.5px solid var(--border); background:var(--surface); color:var(--ink-700);
  cursor:pointer; transition:all .15s ease; white-space:nowrap;
}
.blog-filters button:hover { border-color:var(--sand-400); }
.blog-filters button.active { background:var(--ink-800); color:#fff; border-color:var(--ink-800); }

/* Featured article */
.featured-article {
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(0px,0vw,0px);
  align-items:stretch; background:var(--surface); border:1px solid var(--border);
  border-radius:var(--radius-xl); overflow:hidden; box-shadow:var(--shadow-md);
  margin-bottom:var(--space-8); text-decoration:none; color:inherit;
  transition:transform .18s ease, box-shadow .2s ease;
}
.featured-article:hover { transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.fa-img { position:relative; overflow:hidden; background:var(--sand-100); min-height:320px; }
.fa-img img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .5s ease; display:block; }
.featured-article:hover .fa-img img { transform:scale(1.04); }
.fa-body { padding:clamp(28px,4vw,52px); display:flex; flex-direction:column; justify-content:center; }
.fa-tag {
  display:inline-flex; align-items:center; gap:8px;
  font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.1em;
  color:var(--brand-deep); margin-bottom:var(--space-4);
}
.fa-tag::before { content:""; width:18px; height:2px; background:var(--green-400); border-radius:2px; }
.fa-body h3 { font-family:var(--font-display); font-weight:400; font-size:clamp(22px,2.6vw,30px); line-height:1.2; color:var(--ink-900); margin-bottom:var(--space-4); }
.fa-body p { font-size:16.5px; color:var(--text-soft); margin-bottom:var(--space-5); max-width:48ch; }
.fa-meta { font-size:13px; color:var(--text-muted); font-weight:600; margin-bottom:var(--space-5); }

/* Article grid */
.article-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-6); }
.article-card {
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg);
  overflow:hidden; box-shadow:var(--shadow-xs); display:flex; flex-direction:column;
  text-decoration:none; color:inherit;
  transition:transform .18s ease, box-shadow .2s ease, border-color .2s ease;
}
.article-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:var(--sand-300); }
.article-card.hide { display:none; }
.ac-img { aspect-ratio:16/10; overflow:hidden; background:var(--sand-100); flex-shrink:0; }
.ac-img img { width:100%; height:100%; object-fit:cover; transition:transform .5s ease; display:block; }
.article-card:hover .ac-img img { transform:scale(1.05); }
.ac-body { padding:var(--space-6); display:flex; flex-direction:column; flex:1; }
.ac-tag { font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.1em; color:var(--brand-deep); margin-bottom:var(--space-3); }
.ac-body h3 { font-family:var(--font-display); font-weight:400; font-size:20px; line-height:1.25; color:var(--ink-900); margin-bottom:var(--space-3); }
.ac-body p { font-size:15px; color:var(--text-soft); flex:1; }
.ac-meta { font-size:12.5px; color:var(--text-muted); font-weight:600; margin-top:var(--space-4); }

@media (max-width:900px){
  .featured-article { grid-template-columns:1fr; }
  .fa-img { min-height:260px; aspect-ratio:16/9; }
  .article-grid { grid-template-columns:repeat(2,1fr); }
  .blog-toolbar { gap:var(--space-4); }
}
@media (max-width:600px){
  .article-grid { grid-template-columns:1fr; }
  .blog-search { width:100%; }
  .blog-search input { width:100%; }
  .blog-toolbar { flex-direction:column; align-items:flex-start; }
}