/* pages.css · shared styling for the tool pages (calculator, home value, testimonials, app, schools, why KW).
   Sits on top of scrollcraft.css with the same tokens as index.html. */
:root {
  --sc-canvas: #F7F4EE; --sc-surface: #FFFFFF; --sc-ink: #2B2B2B; --sc-ink-soft: #2B2B2B;
  --sc-accent: #B4472B; --sc-accent-ink: #FFF9F2;
  --sc-font-display: "Playfair Display", Georgia, "Times New Roman", serif;
  --sc-font-text: "Inter", "Helvetica Neue", Arial, sans-serif;
  --sc-shadow-color: 35 25% 20%;
  --sc-e1: 0 1px 2px hsl(var(--sc-shadow-color) / 0.10), 0 2px 8px hsl(var(--sc-shadow-color) / 0.06);
  --sc-e2: 0 2px 6px hsl(var(--sc-shadow-color) / 0.10), 0 12px 32px hsl(var(--sc-shadow-color) / 0.10);
  --ct: #EEF1F3; --nv: #F6EBDB;
}
html { background: var(--sc-canvas); }
body { background: var(--sc-canvas); color: var(--sc-ink); font-family: var(--sc-font-text); font-weight: 400; }
.sc-display, h1, h2, h3 { font-family: var(--sc-font-display); font-weight: 600; letter-spacing: -0.005em; line-height: 1.08; text-wrap: balance; }
.sc-display em { font-style: italic; font-weight: 400; color: var(--sc-ink); }
.ui, .run, .btn, .kicker, label, .f-note, figcaption, .bar__links a, .bar__eyebrow, .stat small, .foot small { font-family: var(--sc-font-text); }
.run, .btn, .bar__links a { font-size: 0.78rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; }
.kicker { font-size: var(--sc-t-xs); letter-spacing: 0.16em; text-transform: uppercase; color: var(--sc-accent); font-weight: 500; margin: 0 0 var(--sc-3); }
a { transition: color var(--sc-d-fast) var(--sc-ease-out); }
a:hover { color: var(--sc-accent); }

/* ---- top bar (tool pages don't use the chapter rail) ---- */
.bar { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; justify-content: space-between; gap: var(--sc-4);
  padding: 0.9rem var(--sc-gutter); background: color-mix(in oklab, var(--sc-canvas) 88%, transparent); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--sc-hairline); }
.bar__mark img { width: 5.2rem; height: auto; display: block; }
.bar__mark--seal { display: inline-flex; align-items: center; gap: 0.6rem; text-decoration: none; }
.bar__mark--seal img { width: 2.6rem; }
.bar__mark--seal span { font-family: var(--sc-font-display); font-weight: 600; font-size: 1.05rem; color: var(--sc-ink); letter-spacing: 0; }
@media (max-width: 600px) { .bar__mark--seal span { display: none; } }
.bar__links { display: flex; gap: clamp(0.9rem, 1.6vw, 1.6rem); align-items: center; }
.bar__links a { white-space: nowrap; }
@media (max-width: 1180px) { .bar__links a { letter-spacing: 0.08em; font-size: 0.72rem; } }
.bar__links a { text-decoration: none; color: var(--sc-ink); padding-bottom: 0.15em; border-bottom: 1px solid transparent; }
.bar__links a:hover, .bar__links a[aria-current] { border-bottom-color: var(--sc-accent); }
@media (max-width: 720px) { .bar__links a:not(.bar__home) { display: none; } }
/* phones: a blurred sticky bar is re-blurred on every scroll frame; a nearly solid bar costs nothing */
@media (max-width: 900px) { .bar { backdrop-filter: none; -webkit-backdrop-filter: none; background: color-mix(in oklab, var(--sc-canvas) 96%, transparent); } }

/* ---- page head ---- */
.head { padding: clamp(3rem, 8vh, 6rem) 0 clamp(2rem, 5vh, 3.5rem); }
.head h1 { font-size: var(--sc-t-3xl); margin: 0 0 var(--sc-4); max-width: 16ch; }
.head p { font-size: var(--sc-t-lg); line-height: 1.45; max-width: 46ch; color: var(--sc-ink-soft); margin: 0; }
.head--tinted { background: var(--ct); }
.head--warm { background: var(--nv); }

/* ---- layout helpers ---- */
.grid-2 { display: grid; grid-template-columns: 1.05fr 0.95fr; gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sc-5); }
@media (max-width: 900px) { .grid-2, .grid-3 { grid-template-columns: 1fr; } }
/* .grid-cards: any count of cards without an orphan. Three per row; a trailing pair widens to fill the row, a trailing single spans it. */
.grid-cards { display: grid; grid-template-columns: repeat(6, 1fr); gap: var(--sc-5); }
.grid-cards > * { grid-column: span 2; }
.grid-cards > :nth-last-child(2):nth-child(3n+1), .grid-cards > :last-child:nth-child(3n+2) { grid-column: span 3; }
.grid-cards > :last-child:nth-child(3n+1) { grid-column: span 6; }
@media (max-width: 900px) { .grid-cards { grid-template-columns: 1fr; } .grid-cards > * { grid-column: auto !important; } }
.section { padding: clamp(2.5rem, 6vh, 4.5rem) 0; }
.section + .section { border-top: 1px solid var(--sc-hairline); }
.section h2 { font-size: var(--sc-t-2xl); margin: 0 0 var(--sc-4); }
.section h3 { font-size: var(--sc-t-xl); margin: 0 0 var(--sc-3); }
.prose p { color: var(--sc-ink-soft); max-width: 58ch; line-height: 1.62; margin: 0 0 var(--sc-4); text-wrap: pretty; }
.prose p strong { color: var(--sc-ink); font-weight: 500; }
.prose ul { margin: 0 0 var(--sc-4); padding-left: 1.2em; color: var(--sc-ink-soft); max-width: 58ch; }
.prose li + li { margin-top: var(--sc-2); }

/* ---- panel (raised surface) ---- */
.panel { background: var(--sc-surface); border: 1px solid var(--sc-hairline); border-radius: var(--sc-r-md); padding: clamp(1.25rem, 3vw, 2rem); box-shadow: var(--sc-e1); }
.panel--dark { background: #1B1A1F; color: #F7F4EE; border-color: transparent; }
.panel--dark h3, .panel--dark .sc-display { color: #F7F4EE; }
.panel--dark p { color: #C9C2B6; }

/* ---- stats ---- */
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); gap: var(--sc-4); margin: 0; padding: 0; list-style: none; }
.stat { border-top: 1px solid var(--sc-hairline-strong); padding-top: var(--sc-3); }
.stat b { display: block; font-family: var(--sc-font-display); font-weight: 600; font-size: var(--sc-t-2xl); line-height: 1; color: var(--sc-ink); font-variant-numeric: tabular-nums; }
.stat small { display: block; margin-top: var(--sc-2); font-size: var(--sc-t-xs); letter-spacing: 0.12em; text-transform: uppercase; color: var(--sc-ink-soft); }

/* ---- steps (same as the operator chapter) ---- */
.steps { list-style: none; margin: var(--sc-5) 0 0; padding: 0; counter-reset: step; border-top: 1px solid var(--sc-hairline-strong); }
.steps li { display: grid; grid-template-columns: 3.5rem 1fr; gap: var(--sc-4); padding: var(--sc-5) var(--sc-4); margin: 0 calc(-1 * var(--sc-4)); border-bottom: 1px solid var(--sc-hairline); counter-increment: step; }
.steps li::before { content: counter(step, decimal-leading-zero); font-family: var(--sc-font-display); font-size: var(--sc-t-lg); color: var(--sc-accent); line-height: 1.2; }
.steps h4 { margin: 0 0 var(--sc-1); font-family: var(--sc-font-text); font-weight: 600; font-size: var(--sc-t-base); }
.steps p { margin: 0; color: var(--sc-ink-soft); max-width: 52ch; }

/* ---- liquid-glass lift (shared with index) ---- */
.lift > * { transition: opacity 720ms var(--sc-ease-out), transform 720ms var(--sc-ease-out); }
.lift > *:not(.sc-in) { opacity: 0; transform: translate3d(0, 28px, 0); }
.glass { position: relative; isolation: isolate; border-radius: var(--sc-r-md); transition: transform 420ms var(--sc-ease-out), box-shadow 420ms var(--sc-ease-out); }
.glass::after { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; opacity: 0; pointer-events: none;
  background: linear-gradient(160deg, rgba(255,255,255,0.75), rgba(255,255,255,0.35)); border: 1px solid rgba(255,255,255,0.8); backdrop-filter: blur(8px); transition: opacity 420ms var(--sc-ease-out); }
@media (hover: hover) { .glass:hover { transform: translateY(-6px); box-shadow: 0 18px 40px hsl(var(--sc-shadow-color) / 0.14), 0 2px 6px hsl(var(--sc-shadow-color) / 0.06); } .glass:hover::after { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .glass:hover { transform: none; } .lift > *:not(.sc-in) { opacity: 1; transform: none; } }

/* ---- forms (same rules as index) ---- */
.f-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--sc-4); }
.f-row--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.f-row > label { min-width: 0; }
.f-row--wide { grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); }
@media (max-width: 600px) { .f-row, .f-row--3 { grid-template-columns: 1fr; } }
form > * + * { margin-top: var(--sc-4); }
label { display: grid; gap: var(--sc-1); font-size: var(--sc-t-xs); letter-spacing: 0.1em; text-transform: uppercase; color: var(--sc-ink-soft); font-weight: 500; }
label.check { grid-template-columns: auto 1fr; align-items: start; gap: var(--sc-3); text-transform: none; letter-spacing: 0; font-size: var(--sc-t-sm); font-weight: 400; color: var(--sc-ink-soft); }
label.check input { width: 1.1rem; height: 1.1rem; margin-top: 0.15rem; accent-color: var(--sc-accent); }
input, select, textarea { font-size: var(--sc-t-base); letter-spacing: 0; text-transform: none; font-weight: 400; font-family: var(--sc-font-text);
  padding: 0.8rem 0.9rem; border: 1px solid var(--sc-hairline-strong); border-radius: var(--sc-r-sm); background: var(--sc-surface); color: var(--sc-ink);
  transition: border-color var(--sc-d-fast) var(--sc-ease-out), box-shadow var(--sc-d-fast) var(--sc-ease-out); width: 100%; box-sizing: border-box; }
input:hover, select:hover, textarea:hover { border-color: color-mix(in oklab, var(--sc-ink) 40%, transparent); }
input:focus-visible, select:focus-visible, textarea:focus-visible, .btn:focus-visible, a:focus-visible { outline: 2px solid var(--sc-accent); outline-offset: 2px; }
textarea { min-height: 7.5rem; resize: vertical; }
select { min-width: 0; padding-right: 2.2rem; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.6em; background: var(--sc-ink); color: var(--sc-canvas); border: 0; border-radius: var(--sc-r-sm);
  padding: 1rem 1.6rem; cursor: pointer; text-decoration: none; transition: background var(--sc-d-fast) var(--sc-ease-out), transform var(--sc-d-fast) var(--sc-ease-out); }
.btn:hover { background: var(--sc-accent); color: var(--sc-accent-ink); }
.btn:active { transform: translateY(1px); }
.btn[disabled] { opacity: 0.6; cursor: wait; }
.btn--ghost { background: transparent; color: var(--sc-ink); border: 1px solid var(--sc-hairline-strong); }
.btn--ghost:hover { background: var(--sc-surface); color: var(--sc-accent); border-color: var(--sc-accent); }
.run { display: inline-flex; align-items: center; gap: 0.6em; text-decoration: none; color: var(--sc-ink); border-bottom: 1px solid var(--sc-ink); padding-bottom: 0.15em; }
.run:hover { border-color: var(--sc-accent); }
.run svg { width: 1.1em; height: 1.1em; transition: transform var(--sc-d-fast) var(--sc-ease-out); }
.run:hover svg { transform: translateX(3px); }
.f-note { font-size: var(--sc-t-xs); letter-spacing: 0.02em; text-transform: none; color: var(--sc-ink-soft); line-height: 1.6; }
.f-done { display: none; padding: var(--sc-5); border: 1px solid var(--sc-hairline-strong); border-radius: var(--sc-r-md); background: var(--sc-surface); }
.f-done.is-on { display: block; }
.f-done p { margin: 0 0 var(--sc-2); color: var(--sc-ink-soft); }
.f-done p strong { color: var(--sc-ink); }

/* ---- footer (identical content to index) ---- */
.foot { margin-top: clamp(3rem, 8vh, 6rem); padding: var(--sc-7) 0 var(--sc-6); border-top: 1px solid var(--sc-hairline-strong); }
.foot__grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sc-6); }
@media (max-width: 720px) { .foot__grid { grid-template-columns: 1fr; } }
.foot__logo { display: block; height: 2.2rem; width: auto; margin-bottom: var(--sc-3); }
.foot__logo--vip { height: 3.1rem; }
.foot__logo--lres { height: 4.6rem; }
.foot__block b { display: block; font-weight: 600; font-size: var(--sc-t-sm); }
.foot__block .brk { display: block; font-size: var(--sc-t-sm); color: var(--sc-ink); margin-top: 0.15rem; }
.foot__block p { margin: var(--sc-2) 0 0; font-size: var(--sc-t-xs); line-height: 1.7; color: var(--sc-ink-soft); letter-spacing: 0.01em; }
.foot__legal { margin-top: var(--sc-6); padding-top: var(--sc-4); border-top: 1px solid var(--sc-hairline); display: grid; grid-template-columns: 1.6rem 1fr; gap: var(--sc-3); align-items: start; }
.foot__legal svg { width: 1.4rem; height: 1.4rem; color: var(--sc-ink-soft); }
.foot__legal p { grid-column: 2; margin: 0 0 var(--sc-2); font-size: 0.72rem; line-height: 1.6; color: var(--sc-ink-soft); max-width: 90ch; }
.foot__legal a { color: inherit; }
.foot__tools { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: var(--sc-2) var(--sc-5); margin-bottom: var(--sc-5); }
.foot__tools a { font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600; text-decoration: none; color: var(--sc-ink); }

[hidden] { display: none !important; }
html, body { overflow-x: clip; }

/* ---- state pages (connecticut.html, nevada.html) ---- */
.head--photo { position: relative; isolation: isolate; overflow: clip; min-height: min(78svh, 46rem); display: flex; align-items: flex-end; padding: clamp(6rem, 18vh, 11rem) 0 clamp(2.5rem, 6vh, 4.5rem); }
.head__img, .head__img img { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -2; }
.head__img img { object-fit: cover; object-position: 50% 62%; }
.head__wash { position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(to bottom, color-mix(in oklab, var(--sc-canvas) 62%, transparent), color-mix(in oklab, var(--sc-canvas) 18%, transparent) 45%, color-mix(in oklab, var(--sc-canvas) 78%, transparent) 100%),
              linear-gradient(to right, color-mix(in oklab, var(--sc-canvas) 78%, transparent), color-mix(in oklab, var(--sc-canvas) 42%, transparent) 50%, transparent 85%); }
.head--photo h1 { max-width: 15ch; text-shadow: 0 1px 0 rgba(255,255,255,0.6), 0 8px 30px rgba(255,255,255,0.7); }
.head--photo p { color: var(--sc-ink); text-shadow: 0 1px 0 rgba(255,255,255,0.5), 0 6px 24px rgba(255,255,255,0.6); }
.head__lic { font-family: var(--sc-font-text); font-size: var(--sc-t-xs) !important; letter-spacing: 0.12em; text-transform: uppercase; color: #1B1A1F !important; font-weight: 700; line-height: 1.8 !important; margin-top: var(--sc-4) !important; max-width: 72ch !important; text-shadow: 0 1px 0 rgba(255,255,255,0.8), 0 4px 18px rgba(255,255,255,0.9); }
.head__cta { margin-top: var(--sc-6); display: flex; flex-wrap: wrap; gap: var(--sc-3); }
.head__cta .btn { font-size: 0.78rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; }
@media (max-width: 720px) {
  .head--photo { min-height: min(72svh, 36rem); padding-top: clamp(5rem, 14vh, 8rem); }
  .head__img img { object-position: 50% 72%; }
  .head__wash { background: linear-gradient(to bottom, color-mix(in oklab, var(--sc-canvas) 74%, transparent), color-mix(in oklab, var(--sc-canvas) 56%, transparent) 45%, color-mix(in oklab, var(--sc-canvas) 84%, transparent) 100%); }
  .head__cta .btn { width: 100%; }
}
.section__intro { color: var(--sc-ink-soft); max-width: 58ch; line-height: 1.62; margin: 0 0 var(--sc-5); text-wrap: pretty; }
.help .panel h3 { margin-bottom: var(--sc-3); }
.help .panel p { color: var(--sc-ink-soft); line-height: 1.62; margin: 0; text-wrap: pretty; }
.links { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 0 var(--sc-6); }
.links li { border-top: 1px solid var(--sc-hairline); }
.links a { display: flex; justify-content: space-between; align-items: center; gap: var(--sc-3); padding: var(--sc-3) var(--sc-3); margin: 0 calc(-1 * var(--sc-3)); border-radius: var(--sc-r-sm); text-decoration: none; color: var(--sc-ink); font-weight: 500; transition: background var(--sc-d-fast) var(--sc-ease-out), transform var(--sc-d-fast) var(--sc-ease-out); }
.links a:hover { background: var(--sc-surface); transform: translateY(-2px); box-shadow: var(--sc-e1); }
.links a svg { width: 1em; height: 1em; flex: none; transition: transform var(--sc-d-fast) var(--sc-ease-out); }
.links a:hover svg { transform: translateX(3px); }
.links a small { display: block; font-size: var(--sc-t-xs); color: var(--sc-ink-soft); font-weight: 400; margin-top: 0.15em; }
.team__empty { color: var(--sc-ink-soft); max-width: 58ch; line-height: 1.62; margin: 0; padding: var(--sc-4) 0; border-top: 1px solid var(--sc-hairline); }
.team__group + .team__group { margin-top: var(--sc-6); }
.team__kind { font-size: var(--sc-t-lg); margin: 0 0 var(--sc-3); }
.team__cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr)); gap: var(--sc-4); }
.team__card b { display: block; font-weight: 600; font-size: var(--sc-t-base); }
.team__card .team__co { display: block; color: var(--sc-ink-soft); font-size: var(--sc-t-sm); margin-top: 0.15rem; }
.team__card .team__links { margin: var(--sc-3) 0 0; font-size: var(--sc-t-sm); }
.team__card .team__links a { color: var(--sc-ink); text-decoration: none; border-bottom: 1px solid var(--sc-hairline-strong); }
.team__card .team__note { margin: var(--sc-3) 0 0; color: var(--sc-ink-soft); font-size: var(--sc-t-sm); line-height: 1.55; }
.contact { background: var(--nv); }
.contact--ct { background: var(--ct); }
.contact__lede { font-size: var(--sc-t-lg); line-height: 1.45; max-width: 40ch; color: var(--sc-ink); margin: 0 0 var(--sc-5); }
.contact-lines { display: grid; gap: var(--sc-3); font-size: var(--sc-t-base); margin: var(--sc-6) 0 0; }
.contact-lines > div { display: grid; grid-template-columns: 8.5rem 1fr; align-items: baseline; gap: var(--sc-3); }
.contact-lines a { text-decoration: none; color: var(--sc-ink); border-bottom: 1px solid var(--sc-hairline-strong); justify-self: start; }
.contact-lines span { color: var(--sc-ink-soft); font-size: var(--sc-t-xs); letter-spacing: 0.1em; text-transform: uppercase; white-space: nowrap; }
@media (max-width: 480px) { .contact-lines > div { grid-template-columns: 1fr; gap: var(--sc-1); } }
.section--tinted { background: var(--ct); }
.section--warm { background: var(--nv); }

/* military families block on the state pages */
.mil { display: grid; grid-template-columns: 1fr 1.4fr; gap: clamp(1.5rem, 4vw, 4rem); align-items: center; }
.mil img.mil__logo { width: min(14rem, 60%); height: auto; display: block; margin-bottom: var(--sc-4); }
.mil ul { margin: var(--sc-4) 0 0; padding-left: 1.2em; line-height: 1.6; color: var(--sc-ink-soft); }
.mil .mil__photo img { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--sc-r-md); box-shadow: var(--sc-e2); }
@media (max-width: 900px) { .mil { grid-template-columns: 1fr; } }
.where { margin-top: var(--sc-5); padding: var(--sc-4) var(--sc-5); background: var(--sc-surface); border-left: 3px solid var(--sc-accent); border-radius: 0 var(--sc-r-sm) var(--sc-r-sm) 0; color: var(--sc-ink); line-height: 1.6; }

/* ---- language toggle (injected by i18n.js) ---- */
.lang-toggle { font-family: var(--sc-font-text); font-size: 0.8rem; font-weight: 700; letter-spacing: 0.08em; color: var(--sc-ink); background: none; border: 0; border-bottom: 2px solid var(--sc-accent); padding: 0.15rem 0; margin-left: var(--sc-4); cursor: pointer; white-space: nowrap; }
.lang-toggle:hover { color: var(--sc-accent); }
/* Spanish runs about a fifth longer: let the bar links breathe and wrap instead of overflowing */
html[lang="es"] .bar__links { flex-wrap: wrap; row-gap: var(--sc-2); gap: var(--sc-4); }
html[lang="es"] .bar__links a, html[lang="es"] .btn, html[lang="es"] .run { letter-spacing: 0.1em; }
@media (max-width: 1080px) { html[lang="es"] .bar__links a { font-size: 0.7rem; } }
html[lang="es"] .seg span { padding-inline: 0.2rem; letter-spacing: 0.06em; white-space: nowrap; }

.ts-box:empty { display: none; }
.ts-box { margin: 0.5rem 0; }


/* ---- fold: one line that opens on tap. Content stays in the HTML for search engines, Legend and screen readers. ---- */
.fold { border-top: 1px solid var(--sc-hairline-strong); }
.fold:last-of-type { border-bottom: 1px solid var(--sc-hairline-strong); }
.fold > summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: var(--sc-4); padding: 1rem 0; font-family: var(--sc-font-display); font-size: var(--sc-t-lg); color: var(--sc-ink); }
.fold > summary::-webkit-details-marker { display: none; }
.fold > summary::after { content: "+"; flex: none; width: 1.6rem; height: 1.6rem; display: grid; place-items: center; border: 1px solid var(--sc-hairline-strong); border-radius: 999px; font-family: var(--sc-font-text); font-size: 1rem; color: var(--sc-ink-soft); }
.fold[open] > summary::after { content: "\2212"; }
.fold > summary:hover::after { border-color: var(--sc-ink); color: var(--sc-ink); }
.fold > summary:focus-visible { outline: 2px solid var(--sc-accent); outline-offset: 2px; }
.fold__body { padding: 0 0 var(--sc-5); }
.fold__body > :first-child { margin-top: 0; }
.fold__body .mil { margin-top: 0 !important; }
.fold__body .mil__photo { display: none; }
.folds { margin-top: var(--sc-5); }
/* "See all" for lists that show their first few items */
[data-fold-after] > .is-folded { display: none; }
.more-btn { display: inline-flex; align-items: center; gap: 0.5em; margin-top: var(--sc-3); padding: 0; border: 0; background: transparent; cursor: pointer; font-family: var(--sc-font-text); font-size: 0.78rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--sc-ink); border-bottom: 1px solid var(--sc-ink); padding-bottom: 0.15em; }
.more-btn:hover { border-color: var(--sc-accent); }
/* compact tools row replacing the six-tile grid */
.tools-row { display: flex; flex-wrap: wrap; gap: 0.75rem 1.75rem; margin: var(--sc-5) 0 0; padding: 0; list-style: none; }
.tools-row li { margin: 0; }
.tools-row a { display: inline-flex; align-items: center; gap: 0.5em; text-decoration: none; color: var(--sc-ink); font-size: 0.78rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; border-bottom: 1px solid var(--sc-ink); padding-bottom: 0.15em; }
.tools-row a:hover { border-color: var(--sc-accent); }
.tools-row svg { width: 1em; height: 1em; }
.know__intro { max-width: 60ch; }
.contact__review { margin: var(--sc-4) 0 0; font-size: var(--sc-t-sm); color: var(--sc-ink-soft); }
.contact__review a { color: var(--sc-ink); }

.fold > summary h2, .fold > summary h3 { margin: 0; font-size: inherit; font-weight: inherit; line-height: 1.3; }
.fold.qa__item .qa__a { margin: 0; }
/* comparison table: rows become folds on phones (pages.js buildCompareFolds) */
.cmp-folds { display: none; margin-top: var(--sc-4); }
.cmp-folds .fold__body p { margin: 0 0 var(--sc-3); }
.cmp-folds .fold__body b { display: block; font-size: var(--sc-t-xs); letter-spacing: 0.1em; text-transform: uppercase; color: var(--sc-ink-soft); margin-bottom: 0.2rem; }
@media (max-width: 720px) { [data-cmp-folds] .cmp { display: none; } .cmp-folds { display: block; } }