/* 12 November 2026: light-and-dark rhythm for the homepage.
   Dark hero, projects, insights and contact; warm paper bands for evidence,
   the featured case, services, process and About. CSS only: light bands
   re-point the existing colour tokens, so older layers keep working. */

.dd-home main { overflow-x: clip; isolation: isolate; }

/* ---------- Light bands ---------- */
.dd-home [data-home-section="credibility"],
.dd-home [data-home-section="problem-routes"],
.dd-home [data-home-section="process"],
.dd-home [data-home-section="about"] {
  --lm-paper: #f3f0e8;
  --lm-card: #fffdf8;
  --lm-ink: #0b1113;
  --lm-teal: #0e625d;
  --lm-amber: #8a5a12;
  --lm-line: rgba(11, 17, 19, .14);

  --dd-paper-100: var(--lm-ink);
  --dd-paper-300: #46524f;
  --dd-cyan-400: var(--lm-teal);
  --dd-cyan-700: #b9d8d2;
  --dd-soft-accent: var(--lm-teal);
  --dd-amber-400: var(--lm-amber);
  --dd-ink-950: var(--lm-paper);
  --dd-ink-900: var(--lm-card);
  --dd-ink-800: #e4dfd2;
  --dd-border: var(--lm-line);
  --dd-flow-line: var(--lm-line);
  --dd-refine-line: var(--lm-line);
  --dd-flow-surface: var(--lm-card);
  --dd-refine-surface: var(--lm-card);

  color-scheme: light;
  color: var(--lm-ink);
  background: var(--lm-paper);
  border-top-color: transparent;
  box-shadow: 0 0 0 100vmax var(--lm-paper);
  clip-path: inset(0 -100vmax);
}
/* No hairline where a band changes colour. */
.dd-home [data-home-section="case-study"],
.dd-home #recent-work,
.dd-home [data-home-section="insights"],
.dd-home [data-home-section="contact"] { border-top-color: transparent; }
.dd-home [data-home-section="process"] { border-top-color: rgba(11, 17, 19, .14); }

.dd-home [data-home-section="credibility"] h2,
.dd-home [data-home-section="problem-routes"] h2,
.dd-home [data-home-section="process"] h2,
.dd-home [data-home-section="about"] h2,
.dd-home [data-home-section="problem-routes"] h3,
.dd-home [data-home-section="process"] h3 { color: var(--lm-ink); }

.dd-home [data-home-section="credibility"] .dd-button,
.dd-home [data-home-section="about"] .dd-button {
  background: var(--lm-ink); border-color: var(--lm-ink); color: var(--lm-paper);
}
.dd-home [data-home-section="credibility"] .dd-button:hover,
.dd-home [data-home-section="about"] .dd-button:hover {
  background: var(--lm-teal); border-color: var(--lm-teal);
}
.dd-home [data-home-section="credibility"] :focus-visible,
.dd-home [data-home-section="problem-routes"] :focus-visible,
.dd-home [data-home-section="process"] :focus-visible,
.dd-home [data-home-section="about"] :focus-visible {
  outline: 3px solid var(--lm-teal); outline-offset: 3px;
}

/* ---------- Evidence: three proof cards ---------- */
.dd-home .dd-evidence { gap: 20px; }
.dd-home .dd-evidence article {
  padding: 28px 28px 24px;
  background: var(--lm-card);
  border: 1px solid var(--lm-line);
  border-top: 3px solid var(--lm-amber);
  border-radius: 10px;
}
.dd-home .dd-evidence strong {
  display: block;
  font-size: clamp(2.75rem, 4.6vw, 4.25rem);
  font-weight: 600; line-height: 1; letter-spacing: -.045em;
  color: var(--lm-ink);
}
.dd-home .dd-evidence p { color: var(--lm-ink); font-size: 1rem; max-width: 26ch; }
.dd-home .dd-evidence small { color: var(--lm-amber); font-weight: 600; }

/* ---------- Featured case: dark card resting on the paper band ---------- */
.dd-home [data-home-section="case-study"] {
  position: relative;
  margin-top: 0;
  box-shadow: 0 24px 60px -28px rgba(11, 17, 19, .55);
}
.dd-home [data-home-section="case-study"]::before {
  content: ''; position: absolute; z-index: -1;
  top: -24px; bottom: -52px; left: 50%; width: 100vw; transform: translateX(-50%);
  background: #f3f0e8;
}
.dd-home [data-home-section="case-study"] .dd-case-facts dt { color: var(--dd-amber-400); }

/* ---------- Services: larger editorial rows ---------- */
.dd-home [data-home-section="problem-routes"] .dd-route { border-color: var(--lm-line); border-radius: 8px; }
.dd-home [data-home-section="problem-routes"] .dd-route:hover { background: var(--lm-card); }
.dd-home [data-home-section="problem-routes"] .dd-route-index { color: var(--lm-amber); font-weight: 650; }
.dd-home [data-home-section="problem-routes"] .dd-route p { color: #46524f; }
.dd-home [data-home-section="problem-routes"] .dd-route-arrow {
  display: grid; place-items: center; width: 40px; height: 40px;
  border: 1px solid var(--lm-line); border-radius: 50%;
  color: var(--lm-ink);
  transition: background 180ms var(--dd-ease), color 180ms var(--dd-ease), border-color 180ms var(--dd-ease);
}
.dd-home [data-home-section="problem-routes"] .dd-route:hover .dd-route-arrow {
  background: var(--lm-ink); border-color: var(--lm-ink); color: var(--lm-paper); transform: none;
}

/* ---------- Process: three numbered cards ---------- */
.dd-home .dd-process { gap: 20px; counter-reset: lm-step; }
.dd-home .dd-process article {
  padding: 28px;
  background: var(--lm-card);
  border: 1px solid var(--lm-line);
  border-radius: 10px;
}
.dd-home .dd-process article::before { display: none; }
.dd-home .dd-process article > span {
  display: inline-block; padding: 4px 10px; border-radius: 999px;
  background: #dcebe6; color: var(--lm-teal); font-weight: 650;
}
.dd-home .dd-process h3 { margin-top: 20px; font-size: 1.375rem; }
.dd-home .dd-process p { color: #46524f; }

/* ---------- About: bigger portrait, warmer band ---------- */
.dd-home .dd-about { --lm-paper: #ebe6d9; }
.dd-home .dd-about .dd-portrait {
  border-radius: 12px;
  box-shadow: 0 24px 50px -24px rgba(11, 17, 19, .45);
}
.dd-home .dd-about-copy > p:not(.dd-eyebrow) { color: #2c3634; font-size: 1.0625rem; }

@media (min-width: 900px) {
  .dd-home .dd-about { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 56px; }
  .dd-home .dd-about .dd-portrait { width: 100%; height: auto; max-width: 360px; aspect-ratio: 1; }
  .dd-home [data-home-section="problem-routes"] .dd-route { padding-inline: 16px; margin-inline: -16px; }
  .dd-home [data-home-section="problem-routes"] .dd-route h3 { font-size: 1.625rem; }
  .dd-home [data-home-section="problem-routes"] .dd-route { grid-template-columns: 2.5rem minmax(0, 1fr) minmax(0, 1.1fr) 40px; align-items: center; }
}

@media (max-width: 767px) {
  .dd-home .dd-evidence { gap: 8px; }
  .dd-home .dd-evidence article { padding: 12px 16px; grid-template-columns: 6.75rem 1fr; align-items: center; }
  .dd-home .dd-evidence strong { font-size: 1.75rem; white-space: nowrap; }
  .dd-home .dd-evidence p { margin-block: 0 4px; }
  .dd-home .dd-process { gap: 8px; }
  .dd-home .dd-process article { padding: 14px 16px; }
  .dd-home .dd-process h3 { margin-block: 8px 4px; font-size: 1.125rem; }
  .dd-home .dd-process p { margin: 0; }
  .dd-home [data-home-section="problem-routes"] .dd-route-arrow { width: 28px; height: 28px; border: 0; }
  .dd-home [data-home-section="case-study"]::before { bottom: -24px; }
}

@media (prefers-reduced-motion: reduce) {
  .dd-home [data-home-section="problem-routes"] .dd-route-arrow { transition: none; }
}
