/*
 * Shared foundation for the remaining public page families.
 *
 * This file is loaded after each page family's stylesheet so the public
 * surface has one final visual baseline. It changes page framing, spacing,
 * controls and generic surfaces only; page content, data states, links and
 * owner/staff boundaries remain owned by their existing templates and views.
 */
.public-site {
  --public-page-bg: #fff;
  --public-surface: #fff;
  --public-surface-soft: #f8fbff;
  --public-rule: #e2ebf5;
  --public-copy: #48638f;
  --public-copy-muted: #5a708d;
  --public-card-radius: 16px;
}

/* Public page backgrounds stay continuous; functional inner surfaces keep
 * their own boundaries below. */
.public-site :is(
  .page-head,
  .section,
  .section-tint,
  .form-section,
  .auth-shell,
  .check-session,
  .report-page-head,
  .editorial-content-head,
  .content-status-head
) {
  background-color: var(--public-page-bg);
}

.public-site :is(
  .page-head,
  .section-tint,
  .check-session,
  .report-page-head,
  .editorial-content-head,
  .content-status-head
) {
  border-block-color: transparent;
  background-image: none;
}

.public-site :is(.page-head, .editorial-content-head) {
  padding-block: clamp(32px, 4.8vw, 52px) clamp(24px, 3.6vw, 38px);
}

.public-site :is(
  .page-head h1,
  .editorial-content-head h1,
  .session-head h1,
  .report-verdict h1
) {
  font-family: inherit;
  font-weight: 760;
  letter-spacing: -.04em;
}

.public-site :is(.page-head p:last-child, .editorial-content-head > p:last-child) {
  color: var(--public-copy-muted);
}

.public-site .eyebrow {
  color: var(--accent);
}

/* Keep generic content rails aligned with the shared shell. */
.public-site :is(
  .section,
  .form-section,
  .content-page,
  .editorial-content-list,
  .editorial-content-detail,
  .report-page-content,
  .check-session
) {
  min-width: 0;
}

.public-site .section {
  padding-block: clamp(44px, 5.2vw, 68px);
}

.public-site .form-section {
  padding-block: 38px clamp(52px, 6vw, 76px);
}

/* Generic cards and empty states use the same quiet white surface. */
.public-site :is(
  .auth-card,
  .panel-form,
  .config-status,
  .empty-card,
  .empty-state,
  .method-note
) {
  border-color: var(--line);
  border-radius: var(--public-card-radius);
  background: var(--public-surface);
  box-shadow: var(--shadow);
}

.public-site .empty-card,
.public-site .empty-state {
  color: var(--public-copy-muted);
}

.public-site .content-page.prose {
  max-width: var(--public-content-max);
  margin-inline: auto;
  padding: clamp(28px, 4vw, 44px) 0 clamp(52px, 6vw, 76px);
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.public-site .content-page.prose > :is(h2, p, ul, ol) {
  max-width: 780px;
}

.public-site .content-page.prose p,
.public-site .content-page.prose li {
  color: var(--public-copy);
}

/* Forms share control height, focus treatment and action rhythm. */
.public-site :is(.stack-form, .panel-form, .station-form) {
  min-width: 0;
}

.public-site :is(.stack-form, .panel-form) label,
.public-site .form-row label {
  color: var(--ink-strong);
}

.public-site :is(.stack-form, .panel-form) :is(input, select, textarea),
.public-site .form-row :is(input, select, textarea) {
  min-height: 44px;
  border-color: #c7d9f2;
  border-radius: 10px;
  background: #fff;
}

.public-site :is(.stack-form, .panel-form) :is(input, select, textarea):focus,
.public-site .form-row :is(input, select, textarea):focus {
  border-color: var(--accent);
  box-shadow: var(--focus-ring);
}

.public-site .form-row {
  border-top-color: var(--public-rule);
}

.public-site .form-actions {
  flex-wrap: wrap;
}

.public-site .auth-shell {
  min-height: calc(100dvh - 76px);
  padding-block: clamp(40px, 6vw, 72px);
}

.public-site .auth-card {
  width: min(100%, 500px);
  padding: clamp(24px, 4vw, 34px);
}

.public-site .auth-card h1 {
  font-family: inherit;
  font-size: clamp(30px, 4vw, 40px);
  font-weight: 760;
  letter-spacing: -.04em;
}

/* Ads are functional content, but should not reintroduce the old beige
 * public-page surface outside the homepage. */
.public-site .mc-ad {
  border-color: var(--line);
  background: #fff;
  color: var(--ink-strong);
  box-shadow: none;
}

.public-site .mc-ad p,
.public-site .mc-ad-label {
  color: var(--public-copy-muted);
}

@media (max-width: 720px) {
  .public-site :is(.page-head, .editorial-content-head) {
    padding-block: 28px 24px;
  }

  .public-site .section {
    padding-block: 42px 48px;
  }

  .public-site .form-section {
    padding-block: 28px 48px;
  }

  .public-site .content-page.prose {
    padding-block: 24px 48px;
  }

  .public-site .auth-shell {
    min-height: calc(100dvh - 68px);
    padding: 28px 12px 48px;
  }

  .public-site .form-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .public-site .form-actions .button {
    width: 100%;
  }
}