:root { --paper: #fff; --ink: #171d1b; --muted: #515b56; --line: #cfd5d1; --blue: #171d1b; --blue-hover: #343d38; --focus: #ab3b2b; }
.header-inner { min-height: 76px; }
.brand { font-size: 25px; }
.nav-links { font-size: 13px; gap: 28px; }
.hero-inner { min-height: 700px; align-items: stretch; }
.hero-copy { width: 53%; padding-top: 38px; padding-bottom: 92px; display: flex; flex-direction: column; align-items: flex-start; }
.hero h1 { font-size: 96px; font-weight: 750; padding-bottom: 30px; }
.hero-line { margin-top: auto; font-size: 39px; font-weight: 500; line-height: 1.15; }
.hero-description { font-size: 16px; max-width: 44ch; }
.hero .button { margin-top: 22px; min-height: 48px; font-size: 14px; padding: 12px 18px; border-radius: 0; }
.hero-art img { object-position: right center; }
.service-strip { background: #171d1b; color: #fff; border-color: #171d1b; }
.service-strip a { padding-block: 21px; font-size: 17px; font-weight: 500; }
.service-strip a + a { border-color: #56645c; }
.service-strip img { filter: brightness(0) invert(1); }
.service-strip a:hover { color: #ffb1a4; }
.section { padding-block: 84px; }
.section-intro { grid-template-columns: 1.2fr .8fr; gap: 100px; margin-bottom: 45px; }
.section-intro h2 { font-size: 48px; font-weight: 550; }
.services-layout { display: block; }
.service-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 36px; }
.service, .service:first-child { padding-top: 24px; padding-bottom: 20px; min-width: 0; }
.service h3 { font-size: 25px; font-weight: 600; }
.service-lead { font-size: 18px; min-height: 54px; }
.service > p:not(.service-lead) { font-size: 16px; }
.service .text-link { font-size: 13px; }
.character-study { position: static; margin-top: 54px; display: grid; grid-template-columns: .6fr 1.4fr; align-items: center; background: #edf1ed; }
.character-visual { align-self: start; }
.character-visual > img { width: 100%; height: auto; aspect-ratio: 1; max-height: 360px; object-fit: cover; object-position: center 28%; }
.image-disclosure { padding: 12px 16px; font-size: 12px; color: var(--ink); line-height: 1.5; background: #edf1ed; }
.character-study figcaption { padding: 32px 56px; font-size: 13px; }
.character-study figcaption span { font-size: 35px; font-weight: 550; line-height: 1.15; max-width: 14ch; margin-bottom: 20px; }
.character-study figcaption p { font-size: 16px; max-width: 52ch; }
.character-study .text-link { margin-top: 16px; font-size: 14px; }
.use-cases { border-top: 1px solid var(--line); }
.use-case-list article { display: grid; grid-template-columns: 1fr 1.6fr; gap: 64px; padding-block: 28px; border-top: 1px solid var(--line); }
.use-case-list h3 { font-size: 25px; font-weight: 550; }
.use-case-list p { color: var(--muted); }
.use-case-list .example-flow { margin-top: 12px; font-size: 14px; color: var(--ink); }
.use-case-note { margin-top: 20px; font-size: 14px; color: var(--muted); max-width: 85ch; }
.process-section { background: #171d1b; color: #fff; }
.process-section .section-intro > p, .process-list p, .step-number { color: #c8d0cb; }
.process-list h3 { font-weight: 500; }
.process-list li, .process-note { border-color: #5e6c63; }
.process-note { color: #c8d0cb; }
.questions-layout { grid-template-columns: .6fr 1.4fr; }
.contact-section { background: #ed6956; color: #171d1b; }
.contact-section h2 + p, .contact-person > p + p { color: #171d1b; }
.contact-section a:hover { color: #171d1b; }
.contact-section .button-light { background: #171d1b; color: #fff; border-radius: 0; }
.contact-section .button-light:hover { background: #343d38; color: #fff; }
.contact-section .button-light img { filter: brightness(0) invert(1); }
.contact-section :focus-visible { outline-color: #171d1b; }
@media (max-width: 1100px) {
  .hero h1 { font-size: 72px; }
  .hero-copy { width: 55%; }
  .hero-line { font-size: 32px; }
  .service-list { gap: 24px; }
  .section-intro { gap: 48px; }
  .section-intro h2 { font-size: 40px; }
  .character-study figcaption { padding: 24px 36px; }
  .character-study figcaption span { font-size: 28px; }
}
@media (max-width: 760px) {
  .brand { font-size: 26px; }
  .hero-copy { width: 100%; padding-top: 34px; padding-bottom: 160px; }
  .hero h1 { font-size: 60px; padding-bottom: 0; }
  .hero-line { margin-top: 25px; font-size: 29px; }
  .hero-description { font-size: 16px; max-width: 31ch; }
  .hero .button { margin-top: 22px; }
  .hero-art img { object-position: right bottom; }
  .service-strip a { font-size: 13px; padding-block: 20px; }
  .section { padding-block: 64px; }
  .section-intro, .questions-layout { grid-template-columns: 1fr; gap: 24px; }
  .section-intro h2 { font-size: 36px; }
  .service-list { grid-template-columns: 1fr; gap: 12px; }
  .service-lead { min-height: 0; }
  .character-study { grid-template-columns: 1fr; margin-top: 30px; }
  .character-visual > img { max-height: none; aspect-ratio: 1; }
  .character-study figcaption { padding: 26px; }
  .character-study figcaption span { font-size: 29px; }
  .use-case-list article { grid-template-columns: 1fr; gap: 16px; padding-block: 26px; }
  .use-case-list h3 { font-size: 25px; }
  .contact-person { border-color: #9f3f30; }
}
@media (max-width: 380px) { .hero h1 { font-size: 48px; } .service-strip a { font-size: 12px; } }