/* Hallmark · macrostructure: Original-mark work stage · genre: modern-minimal
 * design-system: design.md · designed-as-app: shared secondary public pages
 * tone: plain and personal · anchor hue: brick orange
 * code-only critique: P5 H4 E4 S5 R5 V5 · visual/responsive review still pending
 * Load after home.css; .public-page scope excludes portals and prototypes.
 */
.public-page { background: var(--color-base); color: var(--color-ink); }
.public-page main { min-width: 0; }
.public-page .page-hero, .public-page .page-section, .public-page .page-content, .public-page .booking-shell { max-width: calc(var(--page-max) + var(--page-gutter) + var(--page-gutter)); margin-inline: auto; padding-inline: var(--page-gutter); }
.public-page .page-content > :is(.page-section, .booking-shell) { padding-inline: 0; }
.public-page .page-hero { padding-block: clamp(2.5rem, 7vw, 6rem) var(--space-12); }
.public-page .page-hero h1 { max-width: 22ch; font-size: clamp(2.25rem, 5.5vw, 4.5rem); line-height: 1.08; letter-spacing: -.055em; }
.public-page .page-lead { max-width: 62ch; margin-block-start: var(--space-6); color: var(--color-muted); font-size: var(--text-lead); line-height: 1.65; }
.public-page .page-kicker, .public-page .breadcrumb { margin-block-end: var(--space-4); color: var(--color-muted); font-size: var(--text-sm); }
.public-page .breadcrumb a { display: inline-flex; align-items: center; min-height: 44px; }
.public-page .page-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3) var(--space-6); margin-block-start: var(--space-8); }
.public-page .button, .public-page .button-primary, .public-page .page-button { display: inline-flex; justify-content: center; align-items: center; min-height: 48px; padding: var(--space-3) var(--space-5); border: 1px solid var(--color-ink); border-radius: var(--radius-control); background: var(--color-ink); color: var(--color-on-dark); font-size: var(--text-sm); font-weight: 500; line-height: 1.4; text-align: center; text-decoration: none; white-space: nowrap; }
.public-page .button-secondary { background: transparent; color: var(--color-ink); }
.public-page .page-section { padding-block: var(--space-12) var(--space-20); }
.public-page .page-section > h2, .public-page .section-title { max-width: 30ch; margin-block-end: var(--space-8); font-size: var(--text-section); }
.public-page .page-content { padding-block: var(--space-6) var(--space-20); }
.public-page .page-content > :is(p, ul, ol), .public-page .page-section > :is(p, ul, ol), .public-page .prose > :is(p, ul, ol) { max-width: 68ch; }
.public-page .page-content > * + *, .public-page .prose > * + * { margin-block-start: var(--space-5); }
.public-page .page-section > :is(p, ul, ol) + :is(p, ul, ol) { margin-block-start: var(--space-5); }
.public-page .page-content > :is(h2, h3), .public-page .prose :is(h2, h3) { max-width: 32ch; margin-block-start: var(--space-12); }
.public-page .page-content > h2, .public-page .prose h2 { font-size: clamp(1.75rem, 3vw, 2.5rem); }
.public-page .page-content > h3, .public-page .prose h3 { font-size: clamp(1.25rem, 2vw, 1.625rem); }
.public-page .page-content li + li, .public-page .page-section li + li, .public-page .prose li + li { margin-block-start: var(--space-2); }
.public-page .page-content a, .public-page .prose a { text-decoration-thickness: 1px; }
.public-page .content-layout { display: grid; gap: var(--space-10); align-items: start; }
.public-page .page-aside { padding-block: var(--space-6); border-block-start: 2px solid var(--color-ink); }
.public-page .page-aside h2, .public-page .page-aside h3 { margin-block-start: 0; font-size: 1.375rem; }
.public-page .page-aside p { margin-block-start: var(--space-4); color: var(--color-muted); font-size: var(--text-sm); }
.public-page .service-list { display: grid; margin: 0; padding: 0; list-style: none; }
.public-page .service-row { display: grid; gap: var(--space-4); align-items: start; padding-block: var(--space-8); border-block-start: 1px solid var(--color-rule); }
.public-page .service-row:last-child { border-block-end: 1px solid var(--color-rule); }
.public-page .service-row h2, .public-page .service-row h3 { max-width: 22ch; font-size: clamp(1.5rem, 2.4vw, 2rem); }
.public-page .service-row p { max-width: 60ch; color: var(--color-muted); }
.public-page .service-row > a, .public-page .service-row .text-link { justify-self: start; min-height: 44px; font-size: var(--text-sm); }
.public-page .service-row > div > * + * { margin-block-start: var(--space-3); }
.public-page .service-detail { max-width: 72rem; }
.public-page .service-detail .page-lead { max-width: 58ch; }
.public-page .service-outcomes, .public-page .content-list { max-width: 68ch; padding-inline-start: var(--space-5); }
.public-page .service-outcomes li, .public-page .content-list li { padding-inline-start: var(--space-1); }
.public-page .work-grid { display: grid; gap: var(--space-12); }
.public-page .work-grid .project-card, .public-page .work-item { position: static; min-width: 0; background: var(--color-surface); color: var(--color-ink); }
.public-page .work-item figure { margin: 0; }
.public-page .work-item img { width: 100%; aspect-ratio: 16 / 9; object-fit: contain; background: var(--color-surface-muted); }
.public-page .work-item figcaption { padding: var(--space-3) var(--space-6) 0; color: var(--color-muted); font-size: var(--text-xs); }
.public-page .work-item > :is(h2, h3, p, a), .public-page .work-item-content { margin-inline: var(--space-6); }
.public-page .work-item > :is(h2, h3) { margin-block-start: var(--space-5); font-size: clamp(1.5rem, 2.4vw, 2rem); }
.public-page .work-item > p { margin-block-start: var(--space-3); color: var(--color-muted); }
.public-page .work-item > a { margin-block: var(--space-3) var(--space-5); }
.public-page .work-item-content { padding-block: var(--space-6); }
.public-page .work-item-content h2, .public-page .work-item-content h3 { font-size: clamp(1.5rem, 2.4vw, 2rem); }
.public-page .work-item-content p { margin-block-start: var(--space-3); color: var(--color-muted); }
.public-page .work-item-content a { margin-block-start: var(--space-3); }
.public-page .work-grid .project-info { grid-template-columns: 1fr; align-items: start; }
.public-page .work-grid .project-link, .public-page .work-grid .project-status { justify-self: start; }
.public-page .page-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-6); margin-block-start: var(--space-12); padding-block: var(--space-8); border-block-start: 1px solid var(--color-rule); }
.public-page .page-cta h2 { max-width: 28ch; font-size: clamp(1.5rem, 3vw, 2.25rem); }
.public-page .page-cta p { max-width: 52ch; margin-block-start: var(--space-3); color: var(--color-muted); }
.public-page .page-cta-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3) var(--space-6); }
.public-page .founders-page-intro { max-width: 65ch; margin-block-end: var(--space-12); }
.public-page .founders-list { margin-block-end: var(--space-12); }
.public-page .faq-list { max-width: 68ch; }
.public-page .faq-list details { border-block-start: 1px solid var(--color-rule); padding-block: var(--space-4); }
.public-page .faq-list details:last-child { border-block-end: 1px solid var(--color-rule); }
.public-page .faq-list summary { min-height: 44px; padding-block: var(--space-2); font-weight: 500; }
.public-page .faq-list p { margin-block-start: var(--space-3); color: var(--color-muted); }
.public-page .booking-shell { padding-block: var(--space-8) var(--space-20); }
.public-page .booking-layout { display: grid; gap: var(--space-8); align-items: start; }
.public-page .booking-intro h1 { max-width: 22ch; font-size: clamp(2rem, 4vw, 3.25rem); }
.public-page .booking-intro p { max-width: 48ch; margin-block-start: var(--space-5); color: var(--color-muted); }
.public-page .booking-embed { min-width: 0; width: 100%; min-height: 680px; background: var(--color-surface); }
.public-page .booking-embed iframe { display: block; width: 100%; min-height: 680px; border: 0; }
.public-page .booking-note { max-width: 65ch; margin-block-start: var(--space-5); color: var(--color-muted); font-size: var(--text-sm); }
.public-page .booking-fallback { display: inline-flex; align-items: center; min-height: 44px; margin-block-start: var(--space-4); font-size: var(--text-sm); }
.public-page .page-note { color: var(--color-muted); font-size: var(--text-sm); }
@media (min-width: 48rem) {
  .public-page .service-row { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: var(--space-10); align-items: start; }
  .public-page .service-row > a { grid-column: 2; }
  .public-page .work-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-10); }
}
@media (min-width: 60rem) {
  .public-page .content-layout { grid-template-columns: minmax(0, 1fr) minmax(15rem, .38fr); gap: var(--space-16); }
  .public-page .booking-layout { grid-template-columns: minmax(0, 1fr) minmax(15rem, .38fr); gap: var(--space-12); }
}
@media (max-width: 640px) {
  .public-page .page-hero { padding-block: var(--space-8) var(--space-10); }
  .public-page .page-hero h1 { font-size: 2.125rem; }
  .public-page .page-lead { margin-block-start: var(--space-5); font-size: 1rem; }
  .public-page .page-section { padding-block: var(--space-8) var(--space-12); }
  .public-page .page-content { padding-block-end: var(--space-12); }
  .public-page .service-row { padding-block: var(--space-6); }
  .public-page .service-row h2, .public-page .service-row h3 { font-size: 1.5rem; }
  .public-page .page-cta { margin-block-start: var(--space-8); }
  .public-page .booking-embed, .public-page .booking-embed iframe { min-height: 720px; }
}
@media (hover: hover) and (pointer: fine) {
  .public-page .button:hover, .public-page .button-primary:hover, .public-page .page-button:hover { background: var(--color-accent-hover); border-color: var(--color-accent-hover); color: var(--color-on-dark); }
  .public-page .service-row > a:hover, .public-page .page-content a:hover { text-decoration-thickness: 2px; }
}