:root {
  --paper: #faf6ee;
  --ink: #354426;
  --muted: #626852;
}
.identity-feature {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
  align-items: center;
  gap: clamp(28px, 7vw, 110px);
  padding: clamp(45px, 7vw, 110px) 8%;
  background: #f7f0e2;
  background-image: radial-gradient(ellipse at 100% 100%, #dce3c9 0, transparent 55%);
}
.identity-feature-copy { max-width: 650px; }
.identity-badge {
  display: inline-block;
  padding: 6px 16px;
  border-radius: 99px;
  color: #fffdf5;
  background: #465733;
  font-size: 14px;
}
.identity-feature h2 {
  margin: 12px 0;
  color: #354426;
  font-size: clamp(54px, 7.5vw, 112px);
  line-height: .98;
}
.identity-role { color: #74572e; font-weight: 700; }
.identity-feature-copy > p:not(.identity-badge) { max-width: 42ch; }
.identity-feature blockquote {
  margin: 28px 0;
  padding: 18px 24px;
  border-radius: 20px 20px 20px 5px;
  background: #e7ead8;
  color: #3b4c2b;
  font: 400 clamp(23px, 3vw, 38px)/1.2 'Libre Caslon Display', Georgia, serif;
}
.identity-portrait {
  display: block;
  width: min(100%, 470px);
  height: auto;
  justify-self: center;
  border-radius: 32px;
  box-shadow: 0 15px 38px #40352124;
}
.identity-paths {
  padding: clamp(40px, 6vw, 85px) 8%;
  background: #e8ebd9;
}
.identity-paths h2 { margin: 0 0 28px; font-size: clamp(36px, 5vw, 62px); }
.identity-path-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.identity-path-grid a {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 24px;
  border-radius: 22px;
  border: 1px solid #d2d8be;
  background: #fffcf4;
  color: #3c4e2e;
}
.identity-path-grid a:hover { background: #f6f2e5; border-color: #829065; }
.identity-path-grid h3 { margin: 0; font-family: inherit; font-size: 21px; font-weight: 700; }
.identity-path-grid p { margin: 0; font-size: 16px; }
main .page-hero {
  background: radial-gradient(ellipse at 100% 100%, #e1e6cf, transparent 56%), #f4ecdc;
}
.home-page .services { background: #445431; }
body .button:not(.light):not(.secondary) { background-color: #4a5d34; }
body .button:not(.light):not(.secondary):hover { background-color: #39492a; }
@media (max-width: 720px) {
  .identity-feature { grid-template-columns: 1fr; padding-inline: 6%; }
  .identity-portrait { width: min(100%, 390px); border-radius: 22px; }
  .identity-paths { padding-inline: 6%; }
  .identity-path-grid { grid-template-columns: 1fr; gap: 12px; }
}