:root {
  --blue: var(--fm-sand);
  --blue-deep: var(--fm-stone);
  --ink: var(--fm-ink);
  --white: var(--fm-paper);
  --line: var(--fm-rule);
  --font: var(--fm-body);
  --evidence-blue: var(--fm-clay);
  --evidence-ink: var(--fm-ink);
  --kpi-rule: rgba(61, 68, 72, 0.34);
}

body,
.study,
.portfolio,
.filters {
  background: var(--fm-sand) !important;
  color: var(--fm-ink) !important;
}

.hero,
.portfolio-hero {
  background: var(--fm-hero) !important;
  color: var(--fm-ink) !important;
}

.nav {
  border-bottom: 1px solid var(--fm-rule) !important;
}

.kicker,
.study__label,
.featured__tag,
.filters__label,
.work-card__tag,
.results-list > li::before,
.result .study__label {
  color: var(--fm-clay) !important;
}

.study__label {
  font-size: clamp(15px, 1.15vw, 17px) !important;
  letter-spacing: 0.1em !important;
}

.hero .wrap h1 {
  max-width: 1050px;
  font-size: clamp(42px, 4.6vw, 62px) !important;
  line-height: 1.02 !important;
  letter-spacing: -0.04em !important;
}

.hero__excerpt {
  max-width: 780px;
  font-size: clamp(18px, 1.55vw, 22px) !important;
  line-height: 1.42 !important;
  letter-spacing: -0.02em !important;
}

/* Keep case-study KPI tables visually inside the hero, but distinct from its copy. */
.hero {
  padding-bottom: clamp(42px, 5vw, 68px) !important;
  border-bottom: 0 !important;
}

.visual {
  padding: 0 0 clamp(58px, 7vw, 92px) !important;
  background: var(--fm-hero) !important;
  border-bottom: 0 !important;
}

.visual > .wrap {
  width: 100% !important;
  max-width: none !important;
  padding-inline: 0 !important;
}

.visual .evidence {
  overflow: hidden;
  background: transparent !important;
  border: 0 !important;
  border-top: 6px solid var(--kpi-rule) !important;
  border-bottom: 6px solid var(--kpi-rule) !important;
  border-radius: 0 !important;
}

.visual .evidence__item {
  min-height: 320px;
  padding: clamp(52px, 5.5vw, 76px) clamp(36px, 6vw, 78px);
}

.visual .evidence__item + .evidence__item {
  border-left: 6px solid var(--kpi-rule) !important;
}

.visual .evidence--stats .evidence__item {
  align-items: center;
  text-align: center;
}

.visual .evidence__body,
.visual .evidence__flow {
  border: 0 !important;
}

.visual .evidence__step + .evidence__step {
  border-left: 4px solid var(--kpi-rule) !important;
}

.visual .evidence__value {
  font-size: clamp(64px, 7vw, 92px) !important;
}

.visual .evidence__value--text {
  font-size: clamp(30px, 3.4vw, 48px) !important;
  line-height: 0.96;
  letter-spacing: -0.045em;
}

.visual .evidence__name {
  max-width: 390px;
  margin-top: 26px;
  font-size: clamp(16px, 1.3vw, 20px) !important;
}

.visual .evidence__detail {
  font-size: 12px !important;
}

/* A single KPI uses one deliberate stat lockup instead of an empty grid. */
.visual .evidence--stats .evidence__body[style*="--cols:1"] {
  display: block !important;
}

.visual .evidence--stats .evidence__body[style*="--cols:1"] > .evidence__item:only-child {
  display: grid !important;
  grid-template-columns: minmax(220px, 0.75fr) minmax(280px, 1.25fr);
  grid-template-rows: auto auto;
  align-content: center;
  align-items: center;
  width: min(100%, 1120px);
  min-height: 320px;
  margin-inline: auto;
  text-align: center;
}

.visual .evidence--stats .evidence__body[style*="--cols:1"] .evidence__value {
  display: flex;
  grid-row: 1 / -1;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  padding-right: clamp(34px, 5vw, 72px);
  border-right: 6px solid var(--kpi-rule);
}

.visual .evidence--stats .evidence__body[style*="--cols:1"] .evidence__name,
.visual .evidence--stats .evidence__body[style*="--cols:1"] .evidence__detail {
  max-width: 560px;
  padding-left: clamp(34px, 5vw, 72px);
}

.visual .evidence--stats .evidence__body[style*="--cols:1"] .evidence__name {
  margin-top: 0;
  font-size: clamp(20px, 2vw, 28px) !important;
}

.btn {
  background: var(--fm-ink) !important;
  color: var(--fm-paper) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}

.btn:hover {
  background: var(--fm-clay) !important;
}

.featured,
.result,
.evidence {
  background: var(--fm-paper) !important;
  color: var(--fm-ink) !important;
  border-color: var(--fm-rule) !important;
  box-shadow: none !important;
}

.work-card__evidence {
  background: transparent !important;
  color: var(--fm-ink) !important;
  border: 0 !important;
  border-top: 1px solid var(--fm-rule) !important;
  border-bottom: 1px solid var(--fm-rule) !important;
  border-radius: 0 !important;
  padding: 20px 0 !important;
  box-shadow: none !important;
}

.work-card {
  background: var(--fm-stone) !important;
  color: var(--fm-ink) !important;
  border-color: var(--fm-rule) !important;
  box-shadow: none !important;
}

.work-card:hover {
  background: var(--fm-stone) !important;
  border-color: var(--fm-clay) !important;
  transform: none !important;
}

.featured__visual,
.next {
  background: var(--fm-stone) !important;
  color: var(--fm-ink) !important;
}

.featured__visual {
  background: #8d6251 !important;
}

.featured__visual .evidence {
  background: transparent !important;
  color: var(--fm-paper) !important;
}

.featured__visual .evidence__value,
.featured__visual .evidence__name,
.featured__visual .evidence__detail {
  color: var(--fm-paper) !important;
}

.evidence__body,
.evidence__flow,
.evidence__item,
.evidence__step,
.featured__visual {
  border-color: var(--fm-rule) !important;
}

.evidence__value,
.evidence__name,
.evidence__step strong,
.work-card__evidence strong,
.work-card__flow b {
  color: var(--fm-clay) !important;
}

.evidence__detail,
.evidence__step span:last-child,
.result .actions__sub li {
  color: var(--fm-muted) !important;
}

.filter {
  border-color: var(--fm-rule) !important;
  color: var(--fm-ink) !important;
}

.filter:hover,
.filter[aria-pressed="true"] {
  background: var(--fm-ink) !important;
  border-color: var(--fm-ink) !important;
  color: var(--fm-paper) !important;
}

footer {
  background: var(--fm-sand);
  border-color: var(--fm-rule) !important;
}

@media (max-width: 760px) {
  .visual {
    padding: 0 0 44px !important;
  }

  .visual .evidence__item {
    min-height: 240px;
    padding: 44px var(--pad);
  }

  .visual .evidence__value {
    font-size: clamp(54px, 17vw, 76px) !important;
  }

  .visual .evidence__item + .evidence__item,
  .visual .evidence__step + .evidence__step {
    border-top: 6px solid var(--kpi-rule) !important;
    border-left: 0 !important;
  }

  .visual .evidence--stats .evidence__body[style*="--cols:1"] > .evidence__item:only-child {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
  }

  .visual .evidence--stats .evidence__body[style*="--cols:1"] .evidence__value {
    grid-row: auto;
    padding: 0 0 28px;
    border-right: 0;
    border-bottom: 6px solid var(--kpi-rule);
  }

  .visual .evidence--stats .evidence__body[style*="--cols:1"] .evidence__name,
  .visual .evidence--stats .evidence__body[style*="--cols:1"] .evidence__detail {
    padding-left: 0;
  }

  .visual .evidence--stats .evidence__body[style*="--cols:1"] .evidence__name {
    margin-top: 28px;
  }
}
