/* Homepage editorial chapters: light services, measured work, portrait. */
.services-section,
.work-section,
.about-section {
  --home-indigo: var(--color-accent);
  color: var(--home-ink);
}
.services-section { background: var(--home-white); padding-block: 112px 125px; }
.work-section { background: var(--home-wash); padding-block: 112px 125px; border: 0; }
.about-section { background: var(--home-white); padding-block: 112px 125px; }
.services-section .container,
.work-section .container,
.about-section .container { max-width: 1120px; }
.services-section .section-heading,
.work-section .section-heading { margin-bottom: 44px; align-items: end; }
.services-section .eyebrow,
.work-section .eyebrow,
.about-section .eyebrow { color: var(--home-indigo); font-size: 10px; font-weight: 700; letter-spacing: .13em; }
.services-section .eyebrow > span,
.work-section .eyebrow > span,
.about-section .eyebrow > span { color: var(--home-indigo); }
.services-section .eyebrow > span::after,
.work-section .eyebrow > span::after,
.about-section .eyebrow > span::after { color: var(--home-indigo); }
.services-section h2,
.work-section h2,
.about-section h2 { color: var(--home-ink); font-size: clamp(36px, 4vw, 54px); line-height: 1.08; font-weight: 600; letter-spacing: -.055em; }
.services-section .muted-heading,
.work-section .muted-heading,
.about-section .muted-heading { color: var(--home-indigo); }
.home-section-link { display: inline-flex; align-items: center; justify-content: space-between; gap: 23px; padding: 9px 10px 9px 20px; background: var(--ink-950); color: var(--home-white); border-radius: 999px; font-size: 12px; font-weight: 600; white-space: nowrap; transition: transform .25s, background .25s; }
.home-section-link:hover { transform: translateY(-2px); background: var(--home-indigo); }
.home-section-link > span { display: inline-flex; width: 28px; height: 28px; align-items: center; justify-content: center; background: var(--home-white); color: var(--ink-950); border-radius: 50%; }
.home-section-link--light { background: var(--home-white); color: var(--home-ink); border: 1px solid var(--home-line); }
.home-section-link--light:hover { color: var(--home-white); border-color: var(--home-indigo); }
.home-section-link--light > span { background: var(--ink-950); color: var(--home-white); }

/* Image-led service rows replace the former boxed services. */
.home-services-list { border-top: 1px solid var(--home-line); }
.home-service-row { display: grid; grid-template-columns: minmax(210px, 290px) 30px minmax(0, 1fr) auto; align-items: center; gap: 27px; min-height: 192px; border-bottom: 1px solid var(--home-line); padding-block: 18px; }
.home-service-image { overflow: hidden; height: 152px; border-radius: 12px; background: var(--home-wash); }
.home-service-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.home-service-row:hover .home-service-image img { transform: scale(1.055); }
.home-service-number { align-self: center; color: var(--home-indigo); font-size: 11px; font-weight: 700; }
.home-service-copy h3 { max-width: 430px; color: var(--home-ink); font-size: clamp(19px, 2vw, 25px); font-weight: 600; letter-spacing: -.04em; line-height: 1.2; }
.home-service-copy p { max-width: 475px; margin-top: 9px; color: var(--home-muted); font-size: 13px; line-height: 1.7; }
.home-service-more { display: inline-flex; align-items: center; gap: 12px; white-space: nowrap; color: var(--home-ink-soft); font-size: 12px; font-weight: 600; }
.home-service-more span { display: inline-flex; width: 35px; height: 35px; align-items: center; justify-content: center; border: 1px solid var(--home-line); border-radius: 50%; transition: background .25s, color .25s, border-color .25s; }
.home-service-more:hover span { background: var(--home-indigo); border-color: var(--home-indigo); color: var(--home-white); }

/* Full-width case studies: storytelling left, project visual right. */
.home-case-list { display: grid; gap: 18px; }
.home-case-study { display: grid; grid-template-columns: minmax(0, .94fr) minmax(0, 1.06fr); gap: 20px 28px; align-items: center; min-height: 360px; padding: 32px 32px 26px; border: 1px solid var(--home-line); border-radius: 18px; box-shadow: 0 11px 28px -18px var(--home-shadow); background: var(--indigo-50); }
.home-case-study:nth-child(3n + 2) { background: var(--home-case-sage); }
.home-case-study:nth-child(3n + 3) { background: var(--home-case-neutral); }
.home-case-copy { align-self: center; max-width: 420px; padding-left: 12px; }
.home-case-eyebrow { margin-bottom: 16px; color: var(--indigo-700); font-size: 10px; font-weight: 700; line-height: 1.6; letter-spacing: .115em; text-transform: uppercase; }
.home-case-eyebrow span { padding-inline: 5px; opacity: .55; }
.home-case-copy h3 { max-width: 440px; color: var(--home-ink); font-size: clamp(24px, 2.7vw, 36px); font-weight: 600; letter-spacing: -.05em; line-height: 1.12; }
.home-case-copy h3 a:hover { color: var(--home-indigo); }
.home-case-summary { max-width: 400px; margin-top: 16px; color: var(--home-muted); font-size: 13px; line-height: 1.8; }
.home-case-button { display: inline-flex; align-items: center; gap: 12px; margin-top: 25px; padding: 5px 5px 5px 17px; border-radius: 999px; background: var(--home-ink); color: var(--home-white); font-size: 11px; font-weight: 600; }
.home-case-button span { display: inline-flex; width: 28px; height: 28px; align-items: center; justify-content: center; border-radius: 50%; background: var(--home-white); color: var(--home-ink); }
.home-case-button:hover { background: var(--home-indigo); }
.home-case-visual { min-width: 0; height: 230px; overflow: hidden; align-self: center; border-radius: 12px; background: var(--home-white); box-shadow: 0 15px 33px -22px var(--home-shadow-deep); }
.home-case-visual img { width: 100%; height: 100%; object-fit: cover; object-position: center; transition: transform .65s cubic-bezier(.2,.7,.2,1); }
.home-case-study:hover .home-case-visual img { transform: scale(1.035); }
.home-case-fallback { display: flex; height: 100%; align-items: center; justify-content: center; padding: 24px; color: var(--home-ink); font: 500 32px var(--font-display); text-align: center; }
.home-case-details { grid-column: 2; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px 20px; align-self: start; margin: -5px 0 0; }
.home-case-details > div { min-width: 0; padding-top: 11px; border-top: 1px solid var(--home-detail-line); }
.home-case-details dt { color: var(--home-muted); font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.home-case-details dd { margin: 5px 0 0; color: var(--home-ink-soft); font-size: 11px; font-weight: 500; line-height: 1.5; overflow-wrap: anywhere; }
.work-section .concept-note { display: none; }

/* About chapter is deliberately var(--home-white) per the approved reference. */
.about-section .about-grid { display: grid; grid-template-columns: .94fr 1.06fr; gap: 76px; align-items: center; }
.home-about-media { position: relative; overflow: hidden; display: flex; align-items: end; justify-content: center; min-height: 480px; border-radius: 20px; background: linear-gradient(145deg, var(--home-portrait-start), var(--home-wash) 60%, var(--home-portrait-end)); }
.home-about-media img { width: 100%; height: 480px; object-fit: cover; object-position: center 28%; }
.home-about-media-mark { position: absolute; right: 22px; bottom: 22px; display: flex; width: 53px; height: 53px; align-items: center; justify-content: center; border-radius: 14px; color: var(--home-white); background: var(--home-indigo); box-shadow: 0 10px 24px var(--home-accent-shadow); }
.about-section .about-intro h2 { margin-bottom: 24px; }
.about-section .about-intro > p:not(.eyebrow) { max-width: 530px; color: var(--home-muted); font-size: 15px; line-height: 1.85; }
.home-about-highlights { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 27px; }
.home-about-highlights div { display: flex; align-items: center; gap: 10px; color: var(--home-ink-soft); font-size: 12px; font-weight: 600; }
.home-about-highlights svg { color: var(--home-indigo); }
.about-section .signature { margin-top: 20px; color: var(--home-indigo); }
.about-section .signature > span { color: var(--home-muted); border-color: var(--home-line); }
.about-section .about-link { color: var(--home-indigo); margin-top: 18px; font-weight: 600; }

@media (max-width: 950px) {
  .home-service-row { grid-template-columns: minmax(160px, 220px) 20px 1fr; gap: 20px; }
  .home-service-image { height: 130px; }
  .home-service-more { grid-column: 3; margin-top: -12px; }
  .about-section .about-grid { gap: 36px; }
  .home-about-media, .home-about-media img { min-height: 390px; height: 390px; }
}
@media (max-width: 700px) {
  .services-section, .work-section, .about-section { padding-block: 76px 84px; }
  .services-section .section-heading, .work-section .section-heading { display: flex; align-items: start; gap: 22px; }
  .home-section-link { flex-shrink: 0; font-size: 11px; padding: 6px 7px 6px 12px; gap: 8px; }
  .home-section-link > span { width: 24px; height: 24px; }
  .home-service-row { grid-template-columns: 124px 1fr; gap: 8px 15px; padding-block: 16px; min-height: 0; }
  .home-service-image { grid-row: span 2; height: 124px; }
  .home-service-number { display: none; }
  .home-service-copy h3 { font-size: 17px; }
  .home-service-copy p { margin-top: 5px; font-size: 11px; line-height: 1.5; }
  .home-service-more { grid-column: 2; margin-top: 0; font-size: 11px; }
  .home-service-more span { width: 26px; height: 26px; }
  .home-case-study { grid-template-columns: 1fr; padding: 22px; gap: 18px; }
  .home-case-copy { padding-left: 0; }
  .home-case-visual { grid-row: 2; height: 200px; }
  .home-case-details { grid-column: 1; margin-top: 0; }
  .home-case-button { margin-top: 18px; }
  .about-section .about-grid { grid-template-columns: 1fr; gap: 30px; }
  .home-about-media { min-height: 360px; }
  .home-about-media img { height: 360px; }
}
@media (max-width: 440px) {
  .services-section .section-heading, .work-section .section-heading { display: block; }
  .home-section-link { margin-top: 20px; }
  .home-service-row { grid-template-columns: 100px 1fr; gap: 8px 12px; }
  .home-service-image { height: 113px; }
  .home-service-copy h3 { font-size: 15px; }
  .home-service-copy p { font-size: 10px; }
  .home-about-highlights { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .home-service-image img, .home-case-visual img { transition: none; }
}