/* debby.health 05 — p-report-triage.css (Builder B, 2026-10-28): /report-triage/ only. The example report itself is
   c-triage.css unchanged (same component as the home P.03); this file sets the page around it. */

/* hero: the report-pointing scene, cropped to Debby and the report */
.ai-triagep__hero { --ai-fig-ar: 4 / 5; --ai-fig-pos: 60% 50%; --ai-fig-ar-m: 3 / 2; }
.ai-triagep__hero .ai-phero__title { max-width: 9.5em; }

/* P.30 three buckets: a three-column spread divided by thin teal rules */
.ai-triagep__buckets { display: grid; margin-top: clamp(36px, 5vw, 64px); border-top: 2px solid var(--ai-ink); }
.ai-triagep__bucket { display: grid; grid-template-columns: auto 1fr; column-gap: 20px; row-gap: 12px; align-items: start; padding: 26px 0 30px; border-bottom: 1px solid var(--ai-rule-strong); }
.ai-triagep__bucket .ai-cat { justify-self: start; margin-top: 6px; }
.ai-triagep__bucket p { grid-column: 2; line-height: 1.85; }
.ai-triagep__no { grid-row: 1 / 3; font-family: var(--ai-font-display); font-weight: 900; font-size: 2.75rem; line-height: 1; color: var(--ai-teal-700); font-variant-numeric: tabular-nums; }
@media (min-width: 768px) {
  .ai-triagep__buckets { grid-template-columns: repeat(3, minmax(0, 1fr)); border-bottom: 1px solid var(--ai-rule-strong); }
  .ai-triagep__bucket { display: flex; flex-direction: column; align-items: flex-start; gap: 18px; padding: 32px clamp(20px, 2.6vw, 40px) 40px; border-bottom: 0; border-left: 1px solid rgba(23, 98, 102, .35); }
  .ai-triagep__bucket:first-child { border-left: 0; padding-left: 0; }
  .ai-triagep__no { font-size: clamp(3.5rem, 6vw, 5.25rem); }
  .ai-triagep__bucket .ai-cat { font-size: 1.0625rem; padding: 6px 16px 6px 12px; margin-top: 0; }
  .ai-triagep__bucket .ai-cat svg { width: 20px; height: 20px; }
}

/* P.31 the report: warm report paper like the home P.03 */
.ai-triagep__demo { background: #FAF6EE; padding-bottom: clamp(72px, 8vw, 120px); }
.ai-triagep__demo .ai-lt { margin-top: clamp(8px, 2vw, 24px); }
.ai-triagep__demo .ai-endrow { margin-top: clamp(32px, 4vw, 48px); }