/* Homepage layout: a numbered narrative (question → method → proof → future) closed by a Build With Us band. */
.modern-home { font:16px/1.7 var(--font-sans); color:var(--muted-text); }
.modern-home * { min-width:0; }
.home-shell { width:min(calc(100% - 48px),1080px); margin-inline:auto; }
.modern-home h1, .modern-home h2, .modern-home h3 { font-family:var(--font-sans); font-weight:500; text-transform:none; color:var(--text); letter-spacing:-.025em; }
.modern-home h1 { font-size:clamp(2rem,3.15vw,2.5rem); line-height:1.2; margin:0 0 28px; }
.modern-home h2 { font-size:28px; line-height:1.3; margin:0 0 28px; padding:0; border:0; }
.modern-home h3 { font-size:21px; line-height:1.35; margin:0 0 20px; }
.modern-home p { font-size:16px; line-height:1.7; margin:0 0 20px; }
.modern-home p:last-child { margin-bottom:0; }
.modern-home .flow-step { margin-bottom:18px; }
.home-hero { display:block; padding-block:52px; }
.modern-home .home-hero h1 { margin:0 0 36px; }
.modern-home .home-hero .hero-kicker, .modern-home .home-hero .hero-title { display:block; }
.modern-home .home-hero .hero-kicker { font-size:clamp(1.1rem,1.6vw,1.4rem); font-weight:500; line-height:1.3; letter-spacing:-.01em; margin-bottom:10px; }
.modern-home .home-hero .hero-title { font-size:clamp(1.8rem,2.7vw,2.35rem); line-height:1.12; }
.modern-home .home-hero .hero-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,44%); gap:56px; align-items:stretch; }
.modern-home .home-hero .hero-copy p { margin-bottom:0; }
.modern-home .home-hero .hero-art { height:100%; width:auto; max-width:100%; justify-self:end; }
.modern-home .actions { display:flex; align-items:center; flex-wrap:wrap; gap:26px; margin-top:28px; }
.modern-home .button { display:inline-flex; min-height:46px; align-items:center; justify-content:center; padding:10px 20px; border:1px solid var(--text); border-radius:3px; background:var(--text); color:#fff; text-decoration:none; font-size:14px; font-weight:500; }
.modern-home .text-link { display:inline-block; color:var(--text); font-size:14px; font-weight:500; padding-block:8px; min-height:44px; text-underline-offset:5px; }
.modern-home .art-placeholder { position:relative; display:flex; align-items:center; justify-content:center; font-size:13px; overflow:hidden; }
.modern-home .art-placeholder img { display:block; position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.modern-home .hero-art { aspect-ratio:4 / 3; }
.home-section { padding-block:48px; border-top:1px solid var(--border-light); }
.modern-home section[id] { scroll-margin-top:90px; }

/* Approach: one row per pillar so each title sits on a single line. */
.modern-home .approach-items { display:grid; grid-template-columns:1fr; gap:0; border-top:1px solid var(--border); }
.modern-home .approach-items article { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:20px 48px; align-items:start; padding:26px 0; border:0; border-bottom:1px solid var(--border); border-radius:0; }
.modern-home .approach-items h3 { margin:0; font-size:clamp(1rem,1.35vw,1.2rem); line-height:1.35; }
.modern-home .approach-items article > div { display:flex; flex-direction:column; }
.modern-home .approach-items article > div p { margin-bottom:8px; }
.modern-home .approach-items a { align-self:flex-start; }

/* Proof of concept: the dense diagram gets the wider column. */
.modern-home .cachexia-layout { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:56px; align-items:center; }
.modern-home .cachexia-art { aspect-ratio:2408 / 1542; }
/* Where this leads: one statement on the left, the explanation on the right. */
.modern-home .future-copy { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); gap:56px; align-items:start; }
.modern-home .future-statement { margin:0; font-size:clamp(1.2rem,1.7vw,1.5rem); line-height:1.3; letter-spacing:-.02em; }
.modern-home .future-body p { margin-bottom:16px; }

/* Build With Us: closing band. */
.modern-home .build-copy { max-width:880px; }
.modern-home .build-layout { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:56px; align-items:center; }
.modern-home .build-art { aspect-ratio:3240 / 2610; }
.home-build { padding-block:64px; }

@media(max-width:800px) {
  .home-shell { width:calc(100% - 40px); }
  .modern-home .home-hero .hero-row, .modern-home .cachexia-layout, .modern-home .future-copy, .modern-home .build-layout, .modern-home .approach-items article { grid-template-columns:1fr; gap:22px; }
  .home-hero { padding-block:36px; }
  .modern-home .home-hero .hero-art { height:auto; width:100%; }
  .modern-home .home-hero .hero-kicker { font-size:1.1rem; }
  .modern-home .home-hero .hero-title { font-size:1.9rem; }
  .modern-home h1 { font-size:34px; }
  .modern-home h2 { font-size:27px; }
  .modern-home .approach-items h3 { font-size:1.15rem; }
  .home-section { padding-block:34px; }
  .home-build { padding-block:44px; }
}
@media(max-width:400px) {
  .home-shell { width:calc(100% - 32px); }
  .modern-home h1 { font-size:30px; }
  .modern-home h2 { font-size:25px; }
}
