/*
  Sage color variant.
  Intentionally changes color only; structure, typography, copy and behavior
  continue to come from styles.css and index-sage.html.
*/

:root {
  --mist: #f3f5f1;
  --mist-blue: #e8ece5;
  --mist-violet: #eef1eb;
  --ink-soft: #30362f;
  --muted: #5f675d;
  --muted-light: #adb5aa;
  --blue: #5b6553;
  --blue-deep: #3f4a3b;
  --violet: #75816d;
  --violet-deep: #4b5746;
  --lime: #5b6553;
  --lime-deep: #3f4a3b;
  --line: #dde2da;
  --gradient: linear-gradient(112deg, #66725d 0%, #596552 50%, #465141 100%);
  --gradient-soft: linear-gradient(135deg, #edf1eb 0%, #f4f5f1 100%);
  --shadow-soft: 0 18px 60px rgba(48, 59, 45, 0.12), 0 4px 18px rgba(48, 59, 45, 0.05);
  --shadow-action: 0 12px 30px rgba(63, 74, 59, 0.25);
}

html {
  scrollbar-color: var(--blue) var(--mist);
}

::selection {
  background: var(--blue);
}

.section-heading--light > p:last-child {
  color: #d8ded5;
}

.site-header__inner {
  box-shadow: 0 18px 55px rgba(48, 59, 45, 0.12), 0 3px 12px rgba(48, 59, 45, 0.05);
}

.site-header.is-scrolled .site-header__inner {
  box-shadow: 0 20px 58px rgba(48, 59, 45, 0.16), 0 4px 14px rgba(48, 59, 45, 0.06);
}

.button:hover {
  box-shadow: 0 16px 38px rgba(63, 74, 59, 0.34);
}

.button--secondary {
  border-color: #66725d;
  box-shadow: 0 8px 24px rgba(63, 74, 59, 0.08);
}

.button--secondary:hover {
  box-shadow: 0 12px 30px rgba(63, 74, 59, 0.14);
}

.button--light {
  box-shadow: 0 14px 34px rgba(24, 31, 22, 0.22);
}

.hero {
  background:
    radial-gradient(circle at 18% 38%, rgba(91, 101, 83, 0.1), transparent 31%),
    radial-gradient(circle at 82% 42%, rgba(117, 129, 109, 0.12), transparent 32%),
    linear-gradient(180deg, #fbfcfa 0%, var(--white) 74%);
}

.portrait-stage {
  background: #d8ded4;
  box-shadow: 0 32px 90px rgba(48, 59, 45, 0.17);
}

.portrait-stage::after {
  border-color: rgba(63, 74, 59, 0.13);
  border-bottom-color: transparent;
}

.portrait-stage__wash {
  background:
    radial-gradient(circle at 20% 28%, rgba(91, 101, 83, 0.38), transparent 31%),
    radial-gradient(circle at 78% 30%, rgba(117, 129, 109, 0.3), transparent 30%),
    linear-gradient(112deg, #cbd5c7 0%, #e3e8e0 48%, #bec9b9 100%);
}

.proof-chip {
  box-shadow: 0 16px 36px rgba(48, 59, 45, 0.16), 0 3px 10px rgba(48, 59, 45, 0.06);
}

.proof-chip--money svg,
.proof-chip--local svg {
  background: #edf1ea;
}

.turning-point {
  background: #141914;
}

.turning-point > p:first-child,
.turning-point > p:last-child {
  color: #d5dcd2;
}

.service {
  box-shadow: 0 18px 55px rgba(48, 59, 45, 0.09);
}

.service--relief {
  box-shadow: 0 24px 70px rgba(63, 74, 59, 0.28);
}

.service--analysis {
  background: linear-gradient(118deg, #fff 0%, #f1f4ef 55%, #e9eee6 100%);
}

.results {
  background: #121612;
}

.result-feature {
  background: linear-gradient(120deg, rgba(91, 101, 83, 0.28), rgba(117, 129, 109, 0.16));
}

.result-feature__metric strong {
  color: #c1cbbb;
}

.result-feature__metric span {
  color: #d7ddd4;
}

.result-feature__client {
  color: #c7d0c2;
}

.result-feature__copy > p:not(.result-feature__client) {
  color: #d0d7cd;
}

.result-feature__equation {
  color: #d7ddd4;
}

.result-feature__equation svg {
  stroke: #899582;
}

.result-card--internal {
  background: #232923;
}

.result-card--internal > p:first-child,
.result-card--internal > strong {
  color: #c3cdbd;
}

.result-card--internal > p:not(:first-child) {
  color: #d1d8ce;
}

.result-card__note {
  color: #b4beb0;
}

.about__halo {
  background: linear-gradient(135deg, rgba(91, 101, 83, 0.26), rgba(117, 129, 109, 0.28));
}

.about__location {
  box-shadow: 0 12px 30px rgba(48, 59, 45, 0.14);
}

.process-list__number {
  box-shadow: 0 12px 30px rgba(48, 59, 45, 0.13);
}

.process-list li:nth-child(2) .process-list__number {
  color: #53604e;
}

.process-cta {
  box-shadow: 0 14px 45px rgba(48, 59, 45, 0.09);
}

.contact__shell {
  background: linear-gradient(135deg, #66725d 0%, #53604e 46%, #3f4a3b 100%);
}

.contact__intro > p {
  color: #eef2eb;
}

.contact__intro dt {
  color: #f4f6f2;
}

.contact-form {
  box-shadow: 0 26px 70px rgba(24, 31, 22, 0.3);
}

.route-fieldset input:checked + span {
  box-shadow: 0 0 0 2px rgba(91, 101, 83, 0.1);
}

.field label span {
  color: #596157;
}

.field input,
.field textarea {
  border-color: #cfd6cc;
  background: #fbfcfa;
}

.field input::placeholder,
.field textarea::placeholder {
  color: #596157;
}

.field input:focus,
.field textarea:focus {
  box-shadow: 0 0 0 3px rgba(91, 101, 83, 0.14);
}