:root {
  --canvas: #f4f1ea;
  --canvas-deep: #ebe6dc;
  --paper: #ffffff;
  --paper-soft: #faf9f5;
  --ink: #10231f;
  --ink-soft: #2f4540;
  --muted: #63736f;
  --faint: #8c9894;
  --line: rgba(16, 35, 31, 0.13);
  --line-soft: rgba(16, 35, 31, 0.075);
  --brand: #029187;
  --brand-deep: #006c65;
  --brand-bright: #029187;
  --teal: #029187;
  --teal-deep: #006c65;
  --teal-soft: #e8f6f4;
  --coral: #dc6d70;
  --coral-soft: #fbeff0;
  --gold: #c69845;
  --gold-soft: #faf4e7;
  --blue: #5683a2;
  --blue-soft: #edf4f8;
  --danger: #a74f3b;
  --success: #067647;
  --shadow-sm: 0 8px 28px rgba(16, 35, 31, 0.07);
  --shadow-lg: 0 28px 90px rgba(16, 35, 31, 0.13);
  --radius-sm: 12px;
  --radius-md: 20px;
  --radius-lg: 32px;
}

html {
  scroll-behavior: smooth;
  background: var(--canvas);
}

body {
  margin: 0;
  background:
    radial-gradient(circle at 13% 17%, rgba(2, 145, 135, 0.11), transparent 27rem),
    radial-gradient(circle at 88% 74%, rgba(198, 152, 69, 0.1), transparent 24rem),
    linear-gradient(145deg, #f8f6f1 0%, var(--canvas) 62%, #efebe2 100%) !important;
  color: var(--ink) !important;
  font-family: Outfit, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

button,
input,
select,
textarea {
  font: inherit;
}

h1,
h2,
h3,
.heading-font,
.plan-price strong {
  font-family: Montserrat, Outfit, sans-serif !important;
  letter-spacing: 0 !important;
}

h1,
h2,
h3,
p {
  text-wrap: pretty;
}

a {
  color: inherit;
}

:focus-visible {
  outline: 3px solid rgba(2, 145, 135, 0.34);
  outline-offset: 3px;
}

body > nav.sticky,
.topbar {
  border: 1px solid var(--line-soft) !important;
  background: rgba(255, 255, 255, 0.74) !important;
  color: var(--ink) !important;
  box-shadow: var(--shadow-sm) !important;
  backdrop-filter: blur(18px);
}

body > nav.sticky {
  border-left: 0 !important;
  border-right: 0 !important;
  border-top: 0 !important;
}

.brand,
.topbar .brand,
body > nav .brand {
  color: var(--ink) !important;
}

.brand img,
body > nav img,
.brand-logo,
.salon-logo {
  border-radius: var(--radius-sm) !important;
}

.hero-scene {
  background:
    radial-gradient(circle at 13% 17%, rgba(2, 145, 135, 0.11), transparent 27rem),
    radial-gradient(circle at 88% 74%, rgba(198, 152, 69, 0.1), transparent 24rem),
    linear-gradient(145deg, #f8f6f1 0%, var(--canvas) 62%, #efebe2 100%) !important;
}

.brand-panel,
.hero-copy {
  color: var(--ink) !important;
  border: 1px solid rgba(16, 35, 31, 0.08) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.78), rgba(250, 249, 245, 0.9)),
    linear-gradient(145deg, #f8f6f1 0%, var(--canvas) 70%, #efebe2 100%) !important;
  box-shadow: var(--shadow-lg) !important;
  backdrop-filter: blur(18px);
}

.brand-panel .eyebrow,
.hero-copy .eyebrow,
.brand-text,
.eyebrow {
  color: var(--teal-deep) !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
}

.brand-copy p:not(.eyebrow),
.hero-copy p:not(.eyebrow),
.proof-stack span,
.hero-copy .proof-stack span {
  color: var(--muted) !important;
}

.proof-stack strong,
.hero-copy .proof-stack strong {
  color: var(--ink) !important;
}

.proof-stack div,
.hero-promise span,
.workspace-status,
.fee-pill,
.plan-fit,
.optional-pill {
  border: 1px solid var(--line-soft) !important;
  background: rgba(255, 255, 255, 0.7) !important;
  color: var(--muted) !important;
  box-shadow: none !important;
}

.card,
.flow-card,
.proof-tile,
.path-card,
.workspace-board,
.package-card,
.journey-map,
.journey-step,
.payment-summary,
.setup-request-card,
.setup-support-panel,
.setup-upload-area,
.invite-summary div,
.panel,
article,
section.card {
  border-color: var(--line-soft) !important;
  background: rgba(255, 255, 255, 0.84) !important;
  box-shadow: var(--shadow-sm) !important;
}

.flow-card,
.card,
article,
.panel {
  backdrop-filter: blur(14px);
}

.package-card.pro-card,
.plan-card.pro-plan,
.ownership-band {
  background: var(--ink) !important;
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
}

.package-card.pro-card p,
.package-card.pro-card li,
.package-card.pro-card .plan-price span,
.plan-card.pro-plan p,
.plan-card.pro-plan li,
.plan-card.pro-plan .plan-price span,
.ownership-band p,
.ownership-band li {
  color: rgba(255, 255, 255, 0.72) !important;
}

.package-card.pro-card .fee-pill,
.package-card.pro-card .plan-fit,
.plan-card.pro-plan .fee-pill,
.journey-step {
  border-color: rgba(255, 255, 255, 0.12) !important;
  background: rgba(255, 255, 255, 0.075) !important;
  color: rgba(255, 255, 255, 0.78) !important;
}

.plan-card.pro-plan h3,
.plan-card.pro-plan .price strong {
  color: #fff !important;
}

.ownership-band .journey-map {
  color: var(--ink) !important;
  border-color: rgba(16, 35, 31, 0.08) !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(250, 249, 245, 0.94)),
    linear-gradient(145deg, #f8f6f1 0%, var(--canvas) 70%, #efebe2 100%) !important;
  box-shadow: 0 28px 90px rgba(0, 0, 0, 0.22) !important;
}

.ownership-band .journey-map h3,
.ownership-band .journey-step strong {
  color: var(--ink) !important;
}

.ownership-band .journey-map p,
.ownership-band .journey-map li {
  color: var(--muted) !important;
}

.ownership-band .journey-map > p,
.ownership-band .journey-step span,
.ownership-band .journey-map .text-\[\#027a72\] {
  color: var(--teal-deep) !important;
}

.ownership-band .journey-map .text-\[\#65756f\],
.ownership-band .journey-connector {
  color: var(--faint) !important;
}

.ownership-band .journey-step {
  border-color: var(--line-soft) !important;
  background: rgba(255, 255, 255, 0.64) !important;
  color: var(--ink) !important;
  box-shadow: var(--shadow-sm) !important;
}

.ownership-band .comparison-line {
  border-top-color: var(--line-soft) !important;
}

.launch-price,
.setup-next-step-note,
.steps,
.details,
blockquote {
  border: 1px solid rgba(198, 152, 69, 0.16) !important;
  background: var(--gold-soft) !important;
}

.launch-price {
  color: var(--ink) !important;
}

.package-card.pro-card .launch-price p,
.package-card.pro-card .launch-price .plan-price span,
.launch-price p,
.launch-price .plan-price span,
.launch-price .launch-detail {
  color: var(--muted) !important;
}

.package-card.pro-card .launch-price .launch-label,
.package-card.pro-card .launch-price .plan-price strong,
.launch-price .launch-label,
.launch-price .plan-price strong {
  color: var(--teal-deep) !important;
}

.package-card.pro-card .launch-price s,
.launch-price s {
  color: var(--faint) !important;
}

.brand-bg,
.primary,
.setup-request-button {
  border: 1px solid var(--ink) !important;
  border-radius: 999px !important;
  background: var(--ink) !important;
  color: #fff !important;
  box-shadow: 0 14px 34px rgba(16, 35, 31, 0.16) !important;
}

.brand-bg:hover,
.primary:hover,
.setup-request-button:hover {
  border-color: var(--teal-deep) !important;
  background: var(--teal-deep) !important;
  box-shadow: 0 12px 30px rgba(0, 108, 101, 0.2) !important;
}

.secondary,
.ghost,
.provider-button,
.setup-upload-button,
.text-button {
  border-color: var(--line) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.7) !important;
  color: var(--ink) !important;
}

.provider-button.apple {
  background: var(--ink) !important;
  color: #fff !important;
}

.topbar .ghost {
  background: rgba(255, 255, 255, 0.52) !important;
  color: var(--ink) !important;
}

input,
select,
textarea,
.stripe-card {
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-sm) !important;
  background: rgba(255, 255, 255, 0.88) !important;
  color: var(--ink) !important;
  box-shadow: none !important;
}

input:focus,
select:focus,
textarea:focus,
.stripe-card:focus-within {
  border-color: rgba(2, 145, 135, 0.42) !important;
  box-shadow: 0 0 0 4px rgba(2, 145, 135, 0.12) !important;
}

label,
.field-label-row,
.form-section-head h3 {
  color: var(--ink-soft) !important;
}

.muted,
.form-section-head p,
.step-head p:not(.eyebrow),
.lead,
p,
li {
  color: var(--muted);
}

.founder-badge h3,
.founder-badge p {
  color: #fff !important;
}

.founder-badge p:first-child {
  color: #ccfbf1 !important;
}

.founder-badge p:last-child {
  color: rgba(255, 255, 255, 0.78) !important;
}

.founder-thread li {
  color: var(--ink-soft) !important;
}

.founder-principle p:first-child {
  color: var(--teal-deep) !important;
}

.founder-principle p:nth-child(2) {
  color: var(--ink) !important;
}

.phone-frame {
  border-radius: 28px !important;
  background: var(--ink) !important;
  box-shadow: 0 22px 62px rgba(16, 35, 31, 0.22) !important;
}

.floating-booking {
  border-color: var(--line-soft) !important;
  background: rgba(255, 255, 255, 0.9) !important;
  box-shadow: var(--shadow-lg) !important;
}

.workspace-index,
.status-mark,
.status-icon,
.logo {
  background:
    conic-gradient(
      from -18deg,
      var(--teal) 0 31%,
      var(--coral) 31% 55%,
      var(--gold) 55% 75%,
      var(--blue) 75% 100%
    ) !important;
  color: #fff !important;
}

.status-mark.warning {
  background:
    linear-gradient(145deg, rgba(198, 152, 69, 0.92), rgba(167, 79, 59, 0.92)) !important;
}

.notice {
  border-color: var(--line-soft) !important;
  background: rgba(255, 255, 255, 0.86) !important;
  color: var(--ink) !important;
  box-shadow: var(--shadow-sm) !important;
}

.notice.error,
.error .status-icon {
  border-color: rgba(167, 79, 59, 0.22) !important;
  background: var(--coral-soft) !important;
  color: var(--danger) !important;
}

.notice.success {
  border-color: rgba(2, 145, 135, 0.2) !important;
  background: var(--teal-soft) !important;
  color: var(--teal-deep) !important;
}

article h1,
article h2,
article h3,
.copy h1,
.hero-copy h1,
.brand-copy h1 {
  color: var(--ink) !important;
}

article strong,
article a,
.back,
.signin-link a,
.link-button,
a[href="/score/"],
a[href^="/score/"] {
  color: var(--teal-deep) !important;
}

footer {
  color: var(--faint) !important;
}

@media (max-width: 760px) {
  .brand-panel,
  .hero-copy,
  .flow-card,
  .card,
  article,
  .panel {
    border-radius: 24px !important;
  }
}