/* Low-risk brand refresh: preserve the existing OneForma-inspired structure and motion. */
:root {
  --brand-ink: #211923;
  --brand-ink-soft: #6f6670;
  --brand-muted: #91848d;
  --brand-accent: #c21878;
  --brand-accent-deep: #8f0a58;
  --brand-paper: #fffafd;
  --brand-tint: #f7f1f5;
  --brand-surface: #ffffff;
  --brand-line: #e5dce2;
  --brand-green: #007a5f;
}

/* Shared public-site controls. Green remains a logo color only. */
.of-page,
.site-header,
.join-editorial,
body:has(.site-header) {
  color: var(--brand-ink);
}

.of-page {
  background: var(--brand-paper);
}

.of-page .of-header,
body:has(.site-header) .site-header {
  border-bottom-color: var(--brand-line);
}

.of-page .of-brand img,
.site-brand img {
  filter: none;
}

.of-page .of-nav a,
.site-nav a {
  color: var(--brand-ink-soft);
}

.of-page .of-nav a:hover,
.of-page .of-nav a[aria-current="page"],
.site-nav a:hover,
.site-nav a[aria-current="page"] {
  color: var(--brand-accent);
}

.of-page .of-pill,
.of-page .of-button,
.site-pill {
  border-color: var(--brand-ink);
  color: var(--brand-ink);
  background: transparent;
  transition: transform .24s ease, background-color .24s ease, border-color .24s ease, color .24s ease, box-shadow .24s ease;
}

.of-page .of-pill.primary,
.of-page .of-button.primary,
.site-pill.primary {
  border-color: var(--brand-ink);
  background: var(--brand-ink);
  color: #fff;
}

.of-page .of-pill:hover,
.of-page .of-button:hover,
.site-pill:hover {
  border-color: var(--brand-accent);
  background: var(--brand-accent);
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(194, 24, 120, .12);
}

.of-page .of-pill.primary:hover,
.of-page .of-button.primary:hover,
.site-pill.primary:hover {
  border-color: var(--brand-accent-deep);
  background: var(--brand-accent-deep);
}

.of-page .of-eyebrow,
.of-page .of-display em,
.of-page .of-section-head h2 em,
.of-page .of-project-preview-head h2 em,
.of-page .of-domain-link,
.of-page .of-project a,
.of-page .of-market-card a,
.of-page .of-all-projects,
.of-page .of-route-link,
.site-nav a:after {
  color: var(--brand-accent);
}

.of-page .of-domain-card,
.of-page .of-project,
.of-page .of-market-card,
.of-page .of-journey-step,
.of-page .of-path-card {
  border-color: var(--brand-line);
  box-shadow: 0 1px 0 rgba(33, 25, 35, .02);
}

.of-page .of-domain-card:hover,
.of-page .of-project:hover,
.of-page .of-market-card:hover,
.of-page .of-journey-step.is-active {
  border-color: #caa6b7;
  box-shadow: 0 20px 48px rgba(52, 18, 42, .09);
}

.of-page .of-domain-card:hover,
.of-page .of-project:hover,
.of-page .of-market-card:hover {
  transform: translateY(-5px);
}

.of-page .of-domain-section,
.of-page .of-section.tint,
.of-page .of-filter-band {
  background-color: var(--brand-tint);
}

.of-page .of-closing {
  background: var(--brand-ink);
}

/* Legacy public pages: override historical green tokens without changing markup. */
body:has(.quick-grid),
body:has(.register-card),
body:has(.headline) {
  --ink: var(--brand-ink) !important;
  --muted: var(--brand-ink-soft) !important;
  --green: var(--brand-accent) !important;
  --green-dark: var(--brand-accent-deep) !important;
  --mint: #f7e8f0 !important;
  --soft: var(--brand-tint) !important;
  --paper: var(--brand-paper) !important;
  --line: var(--brand-line) !important;
}

body:has(.quick-grid),
body:has(.register-card),
body:has(.headline) {
  background: var(--brand-tint) !important;
  color: var(--brand-ink) !important;
}

body:has(.quick-grid) .search-panel button,
body:has(.quick-grid) .btn,
body:has(.register-card) .btn-primary,
body:has(.headline) .btn {
  background: var(--brand-accent) !important;
  color: #fff !important;
}

body:has(.quick-grid) .search-panel button:hover,
body:has(.quick-grid) .btn:hover,
body:has(.register-card) .btn-primary:hover,
body:has(.headline) .btn:hover {
  background: var(--brand-accent-deep) !important;
}

body:has(.quick-grid) .quick-card,
body:has(.quick-grid) .group,
body:has(.quick-grid) .status-card,
body:has(.quick-grid) .search-panel,
body:has(.register-card) .side-panel,
body:has(.register-card) .register-card,
body:has(.headline) .headline,
body:has(.headline) .body,
body:has(.headline) .rule-box,
body:has(.headline) .note {
  border-color: var(--brand-line) !important;
  box-shadow: 0 14px 34px rgba(52, 18, 42, .05) !important;
}

body:has(.quick-grid) .quick-icon,
body:has(.quick-grid) .badge,
body:has(.register-card) .hint-box,
body:has(.register-card) .agreement {
  background: #f7e8f0 !important;
  color: var(--brand-accent-deep) !important;
}

body:has(.quick-grid) .support {
  background: var(--brand-ink) !important;
}

body:has(.quick-grid) input:focus,
body:has(.quick-grid) textarea:focus,
body:has(.register-card) input:focus,
body:has(.register-card) select:focus,
body:has(.register-card) textarea:focus {
  border-color: var(--brand-accent) !important;
  box-shadow: 0 0 0 3px rgba(194, 24, 120, .13) !important;
}

/* Project detail pages still carry a green editorial theme in their inline CSS. */
body:has(.hero-media) {
  --ink: var(--brand-ink) !important;
  --text: var(--brand-ink) !important;
  --muted: var(--brand-ink-soft) !important;
  --green: var(--brand-accent) !important;
  --green-dark: var(--brand-accent-deep) !important;
  --green-soft: #f7e8f0 !important;
  --paper: var(--brand-tint) !important;
  --line: var(--brand-line) !important;
}

body:has(.hero-media) .hero {
  background: #322a31 !important;
}

body:has(.hero-media) .hero-media:after {
  background: linear-gradient(90deg, rgba(33, 25, 35, .9) 0%, rgba(33, 25, 35, .7) 42%, rgba(33, 25, 35, .2) 75%, rgba(33, 25, 35, .08) 100%) !important;
}

body:has(.hero-media) .eyebrow,
body:has(.hero-media) .process-step b,
body:has(.hero-media) .section-kicker,
body:has(.hero-media) .side-card .status,
body:has(.hero-media) .side-price b {
  color: var(--brand-accent) !important;
}

body:has(.hero-media) .eyebrow:before,
body:has(.hero-media) .process-step:before {
  background: var(--brand-accent) !important;
}

body:has(.hero-media) .hero .btn {
  color: var(--brand-ink) !important;
}

body:has(.hero-media) .hero .btn:hover {
  background: #f7e8f0 !important;
}

body:has(.hero-media) .work-index,
body:has(.hero-media) .side-card .status {
  background: #f7e8f0 !important;
}

body:has(.hero-media) .side-card .status:before {
  background: currentColor !important;
}

body:has(.hero-media) .side-card,
body:has(.hero-media) .workbench,
body:has(.hero-media) .fit-column,
body:has(.hero-media) .work-list {
  border-color: var(--brand-line) !important;
}

/* Help center: soften the large top block and remove the browser-blue search focus. */
body:has(.quick-grid) .hero {
  background: transparent !important;
}

body:has(.quick-grid) .status-card {
  background: #fffafd !important;
  border-radius: 18px !important;
}

body:has(.quick-grid) .search-panel {
  background: #fffafd !important;
  border-radius: 20px !important;
  padding: 12px !important;
}

body:has(.quick-grid) .search-panel input {
  border: 1px solid var(--brand-line) !important;
  border-radius: 14px !important;
  background: #fffafd !important;
  outline: none !important;
}

body:has(.quick-grid) .search-panel input:focus {
  border-color: #caa6b7 !important;
  box-shadow: 0 0 0 3px rgba(194, 24, 120, .1) !important;
}

body:has(.quick-grid) .search-panel button {
  border-radius: 18px 18px 18px 6px !important;
}

@media (prefers-reduced-motion: reduce) {
  .of-page .of-pill,
  .of-page .of-button,
  .of-page .of-domain-card,
  .of-page .of-project,
  .of-page .of-market-card,
  .site-pill {
    transition: none;
  }
}