.spec-page-curatiio {
  --spec-ink: #263535;
  --spec-ink-soft: #47615b;
  --spec-light: #e5e6e0;
  --spec-paper: #f6f7f2;
  --spec-soft: #d9ded8;
  --spec-soft-2: #9fb0aa;
  --spec-gold: #4e6f68;
  --spec-gold-dark: #2f4540;
  --spec-line: #aeb9b4;
  --spec-dark: #263535;
  --spec-bubble-fill: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(243, 246, 242, 0.96) 46%, rgba(229, 234, 228, 0.94) 100%);
  --spec-bubble-soft-fill: linear-gradient(180deg, rgba(255, 255, 255, 0.97) 0%, rgba(244, 246, 243, 0.93) 100%);
  --spec-bubble-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92), 0 1px 0 rgba(38, 53, 53, 0.14),
    0 6px 12px -12px rgba(38, 53, 53, 0.28), 0 8px 14px -16px rgba(78, 111, 104, 0.2);
  --spec-bubble-shadow-soft: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 1px 0 rgba(38, 53, 53, 0.12),
    0 4px 9px -11px rgba(38, 53, 53, 0.22), 0 6px 10px -14px rgba(78, 111, 104, 0.16);
}

.spec-page-curatiio .hero-line-accent,
.spec-page-curatiio .footer-links a,
.spec-page-curatiio .anchor-chip:hover {
  color: var(--spec-gold);
}

.spec-page-curatiio .brand-block {
  gap: 0;
}

.spec-page-curatiio .brand-wordmark {
  width: min(100%, 16rem);
  height: auto;
}

.spec-page-curatiio .hero-note,
.spec-page-curatiio .support-copy,
.spec-page-curatiio .site-footer p {
  color: var(--spec-ink-soft);
}

.spec-page-curatiio .button-primary,
.spec-page-curatiio .button-secondary,
.spec-page-curatiio .hero-actions .button-secondary {
  background: linear-gradient(180deg, #5f837b 0%, #263535 100%);
  border-color: #263535;
  color: var(--spec-paper);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 1px 0 rgba(38, 53, 53, 0.26),
    0 12px 22px rgba(38, 53, 53, 0.2);
}

.spec-page-curatiio .button-primary:hover,
.spec-page-curatiio .button-secondary:hover,
.spec-page-curatiio .hero-actions .button-secondary:hover {
  background: linear-gradient(180deg, #6f948b 0%, #2f4540 100%);
  color: var(--spec-paper);
}

.spec-page-curatiio .button-ghost,
.spec-page-curatiio .hero-actions .button-ghost {
  background: linear-gradient(180deg, #ffffff 0%, #edf0eb 100%);
  border-color: var(--spec-line);
  color: var(--spec-ink);
}

.spec-page-curatiio .button-ghost:hover,
.spec-page-curatiio .hero-actions .button-ghost:hover {
  background: linear-gradient(180deg, #f4f6f1 0%, #e2e6df 100%);
  border-color: var(--spec-gold);
  color: var(--spec-ink);
}

@media (max-width: 760px) {
  .spec-page-curatiio .brand-wordmark {
    width: min(100%, 14.5rem);
  }
}
