/* Shorter homepage at every width (body.fold). Phone-only sizing stays under body.fold (signature.css). */
.cp-row { display: none; }
body.fold .fg-section:has(> .cp-row) { padding-block: 0; border-top: 1px solid var(--fg-rule, #d8d0c2); }
body.fold .cp-row { display: grid; grid-template-columns: 34px 1fr 28px; align-items: center; gap: 10px; width: 100%; min-height: 68px; padding: 12px 16px; border: 0; background: transparent; color: var(--fg-ink, #1a1a1a); text-align: left; cursor: pointer; font: inherit; }
body.fold .cp-row:focus-visible { outline: 2px solid var(--fg-red, #9b1b1b); outline-offset: -4px; }
body.fold .cp-num { font: 600 12px var(--mono, ui-monospace, monospace); border: 1px solid currentColor; padding: 2px 5px; justify-self: start; }
body.fold .cp-text { display: grid; gap: 2px; }
body.fold .cp-name { font: 600 10.5px var(--sans, system-ui, sans-serif); letter-spacing: .12em; text-transform: uppercase; color: var(--fg-red, #9b1b1b); }
body.fold .cp-title { font-family: var(--serif, Georgia, serif); font-size: 21px; line-height: 1.15; }
body.fold .cp-icon { width: 28px; height: 28px; border-radius: 50%; border: 1px solid var(--fg-rule, #d8d0c2); position: relative; }
body.fold .cp-icon::before, body.fold .cp-icon::after { content: ''; position: absolute; left: 50%; top: 50%; width: 11px; height: 1.5px; background: currentColor; transform: translate(-50%, -50%); transition: transform 200ms ease; }
body.fold .cp-icon::after { transform: translate(-50%, -50%) rotate(90deg); }
body.fold .cp-open .cp-icon::after { transform: translate(-50%, -50%) rotate(0deg); }
body.fold .fg-section:has(> .cp-row):not(.cp-open) > .fg-row { display: none; }
body.fold .fg-section.cp-open > .fg-row { padding-bottom: 28px; animation: cp-in 280ms ease-out both; }
body.fold .fg-section.cp-open > .fg-row .fg-margin { display: none; }
@keyframes cp-in { from { opacity: 0; transform: translateY(-6px); } }
@media (prefers-reduced-motion: reduce) { body.fold .fg-section.cp-open > .fg-row { animation: none; } body.fold .cp-icon::before, body.fold .cp-icon::after { transition: none; } }
/* Folded rows all look the same: paper background, ink text (some sections are dark or decorated when open) */
body.fold .fg-section:has(> .cp-row):not(.cp-open) { background: var(--fg-paper, #f6f1e8) !important; color: var(--fg-ink, #1a1a1a); }
body.fold .fg-section:has(> .cp-row):not(.cp-open)::before, body.fold .fg-section:has(> .cp-row):not(.cp-open)::after { display: none; }
body.fold .fg-section.cp-open > .cp-row { color: inherit; }
body.fold .cp-row { scroll-margin-top: 72px; }
/* Phones: the final invitation now earns its place (\"Which one are you?\"), so it shows, compact */
body.fold #start-now { padding-block: 32px 36px; }
/* Free access always open: a clear band so it reads as its own moment, not a tab */
body.fold #subscribe { border-top: 1px solid var(--fg-rule, #d8d0c2); }
body.fold #subscribe .fg-margin { display: none; }
/* Laptops: rows line up with the page's content column and read a little larger */
@media (min-width: 761px) {
  body.fold .cp-row { min-height: 78px; padding-inline: max(var(--gutter, 24px), calc((100% - 1280px) / 2 + var(--gutter, 24px))); grid-template-columns: 44px 1fr 32px; }
  body.fold .cp-title { font-size: clamp(22px, 2vw, 28px); }
  body.fold .cp-row:hover .cp-title { color: var(--fg-red, #9b1b1b); }
  body.fold .fg-section.cp-open > .fg-row { padding-bottom: clamp(28px, 3vw, 44px); }
}
/* A closed row is just its title bar, whatever padding the section has when open */
body.fold main > .fg-section:has(> .cp-row):not(.cp-open) { padding-block: 0 !important; min-height: 0 !important; }