:root {
  --ivory: #f7f8f8;
  --charcoal: #25292d;
  --bronze: #626b73;
  --stone: #d9dde0;
  --muted: #626a70;
  --paper: #edf0f2;
  color-scheme: light;
}

body { background: var(--ivory); color: var(--charcoal); line-height: 1.85; }
.header { background: #f7f8f8f5; border-color: var(--stone); }
.hero { isolation: isolate; background: none; }
.hero::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  background-image: linear-gradient(90deg, #1d2227f2 0%, #22272bd9 48%, #24292b70 100%), url('brand-concept.png');
  background-position: center, center 13%;
  background-size: cover, auto 1400px;
  content: "";
  filter: grayscale(1);
}
.hero h1, .section h2, .approach h2, .process h2, .prepare h2, .contact h2 {
  font-family: 'Malgun Gothic', 'Apple SD Gothic Neo', sans-serif;
  font-weight: 650;
  letter-spacing: -.055em;
  line-height: 1.42;
  text-wrap: balance;
}
.hero h1 { font-size: clamp(36px, 5.1vw, 68px); line-height: 1.35; }
h2 { color: #25292d; font-size: clamp(30px, 3.35vw, 43px); }
h3 { color: #30363a; font-weight: 600; letter-spacing: -.025em; }
.eyebrow, .section-head .eyebrow, .section-intro .eyebrow,
.prepare .eyebrow, .contact .eyebrow, .profile .eyebrow {
  color: #626b73;
}
.hero .eyebrow, .approach .eyebrow, .contact .eyebrow { color: #d4d9dc; }
.hero em, .contact em { color: #e0e4e6; }
.hero .button, .floating-contact { background: #59636b; border-color: #59636b; }
.hero .button:hover, .floating-contact:hover { background: #434d55; }
.text-button, .profile-link, .prepare-link, .service-contact { color: #4d5961; }
.scope-strip span, .number, .process-steps span, .approach-grid span,
.contact-info dt { color: #616d75; }
.approach { background: #282d31; color: #f3f5f6; }
.approach h2, .approach h3 { color: #f3f5f6; }
.approach .section-intro > p:not(.eyebrow), .approach-grid p { color: #c7cdd1; }
.approach-grid span { color: #c2c9ce; }
.process, .prepare { background: #edf0f2; }
.services details, .insight-empty { background: #f0f2f3; border-color: #d9dde0; }
.services details:hover { border-color: #aeb7bd; background: #f7f8f8; }
.service-scope-note, .section-head > p:not(.eyebrow), .about-content > p:not(.lead),
.profile p:not(.eyebrow), .process-steps p { color: #626a70; }
.service-contact { border-color: #d2d7da; }
.contact { background: #292e32; color: #f4f5f6; }
.contact h2, .contact h3, .contact label { color: #f4f5f6; }
.contact > div > p:not(.eyebrow), .contact .form-note { color: #c8cdd0; }
.contact-info > div { border-color: #ffffff2b; }
.contact-info dt { color: #c6cdd1; }
form { background: #33393e; }
input, textarea, select { border-color: #737d83; background: #292e32; color: #f4f5f6; }
input:focus, textarea:focus, select:focus { outline-color: #d5dade; }
form .button { background: #e6e9eb; color: #25292d; }
form .button:hover { background: #cfd5d9; }
.copy-button { border-color: #7e888e; color: #f4f5f6; }
#form-status { color: #e0e4e6; }
footer { background: #f0f2f3; border-color: var(--stone); }
.floating-contact { box-shadow: 0 10px 30px #1f242833; }

@media (max-width: 720px) {
  .hero::before { background-position: center, center top; background-size: cover, auto 1250px; }
  .hero h1 { font-size: clamp(32px, 8vw, 40px); line-height: 1.42; }
  .section h2, .approach h2, .process h2, .prepare h2, .contact h2 {
    font-size: clamp(27px, 7vw, 34px);
    line-height: 1.48;
  }
  .services details { background: #f0f2f3; }
  .contact { background: #292e32; }
}
@media (prefers-reduced-motion: reduce) {
  .hero::before { filter: grayscale(1); }
}