:root {
  --nh-green: #00b08a;
  --nh-green-dark: #12332c;
  --nh-green-deep: #075f50;
  --nh-pale: #f5fbf9;
  --nh-line: #dcebe6;
  --nh-text: #173d35;
  --nh-muted: #577069;
}

.model-page { color: var(--nh-text); background: var(--nh-pale); }
.model-page .site-header { box-shadow: 0 8px 30px rgba(18,51,44,.06); }
.model-page h1, .model-page h2, .model-page h3 { color: var(--nh-green-dark); }
.model-page p { line-height: 1.72; }
.model-page .eyebrow { color: var(--nh-green); }
.model-page .button { min-height: 48px; justify-content: center; }
.model-page .button.secondary { color: var(--nh-green-dark); border-color: rgba(18,51,44,.24); background: transparent; }
.model-page .button.secondary:hover { color: white; border-color: var(--nh-green); background: var(--nh-green); }

.method-hero { position: relative; overflow: hidden; padding: 96px 0 82px; background: radial-gradient(circle at 88% 12%, rgba(0,176,138,.15), transparent 28%), linear-gradient(130deg, #effaf7 0%, #fff 47%, #e8f7f3 100%); }
.method-hero::before { content: ""; position: absolute; width: 640px; height: 640px; right: -330px; bottom: -390px; border: 1px solid rgba(0,176,138,.16); border-radius: 50%; box-shadow: 0 0 0 90px rgba(0,176,138,.035), 0 0 0 180px rgba(0,176,138,.025); }
.method-hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0,1.06fr) minmax(440px,.94fr); gap: 72px; align-items: center; }
.method-hero-copy h1 { max-width: 800px; margin: 12px 0 24px; font-family: "Circular Std", "Inter Body", Avenir, ui-sans-serif, system-ui, sans-serif; font-size: clamp(3rem,5.2vw,5.35rem); font-weight: 780; letter-spacing: -.06em; line-height: .99; }
.hero-subtitle { max-width: 760px; margin: 0; color: #3e5d55; font-size: clamp(1.08rem,1.6vw,1.35rem); }
.brand-phrase { margin: 26px 0 28px; color: var(--nh-green-dark); font-size: 1.1rem; font-weight: 700; }
.brand-phrase span { margin: 0 5px; color: var(--nh-green); font-family: "Damion", cursive; font-size: 2.05rem; font-weight: 400; line-height: 1; }
.hero-actions, .portal-actions, .closing-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.audience-list { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 34px; }
.audience-list span { padding: 8px 12px; border: 1px solid rgba(18,51,44,.13); border-radius: 999px; color: #48645d; background: rgba(255,255,255,.68); font-size: .75rem; font-weight: 750; }

.method-overview { overflow: hidden; padding: 24px; border: 1px solid rgba(18,51,44,.1); border-radius: 28px; background: rgba(255,255,255,.96); box-shadow: 0 30px 75px rgba(18,51,44,.15); }
.overview-head { display: grid; grid-template-columns: 58px 1fr auto; gap: 12px; align-items: center; padding-bottom: 18px; border-bottom: 1px solid var(--nh-line); }
.overview-head img { width: 54px; height: 54px; object-fit: contain; }
.overview-head strong, .overview-head small { display: block; }
.overview-head small { margin-top: 3px; color: var(--nh-muted); font-size: .72rem; }
.overview-head > span { padding: 7px 10px; border-radius: 999px; color: #08725c; background: #dff7f0; font-size: .68rem; font-weight: 850; }
.overview-patient { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 16px 0; }
.overview-patient div { padding: 13px; border-radius: 12px; background: var(--nh-pale); }
.overview-patient small, .overview-patient b { display: block; }
.overview-patient small { color: var(--nh-muted); font-size: .68rem; }
.overview-patient b { margin-top: 4px; font-size: .9rem; }
.overview-flow { display: grid; grid-template-columns: auto 1fr auto 1fr auto; gap: 9px; align-items: center; padding: 13px; border-radius: 14px; color: white; background: var(--nh-green-dark); font-size: .7rem; font-weight: 800; }
.overview-flow i { height: 2px; background: linear-gradient(90deg, rgba(255,255,255,.22), var(--nh-green)); }
.overview-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin: 11px 0; }
.overview-metrics article { min-width: 0; padding: 13px; border: 1px solid var(--nh-line); border-radius: 13px; background: white; }
.overview-metrics small, .overview-metrics b, .overview-metrics em { display: block; }
.overview-metrics small { color: var(--nh-muted); font-size: .65rem; }
.overview-metrics b { margin: 5px 0 3px; font-size: .82rem; }
.overview-metrics em { color: #678079; font-size: .64rem; font-style: normal; }
.method-overview > p { margin: 13px 0 0; padding: 12px 14px; border-radius: 12px; color: #31544b; background: #eaf8f4; font-size: .75rem; font-weight: 750; }
.method-overview > p span { display: inline-grid; width: 22px; height: 22px; margin-right: 7px; place-items: center; border-radius: 50%; color: white; background: var(--nh-green); }

.section-white { background: white; }
.model-page .method-intro { position: static; top: auto; padding: 82px 0; }
.intro-grid, .split-layout, .collaboration-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 72px; align-items: center; }
.intro-grid h2, .section-copy h2, .section-heading h2 { margin-bottom: 20px; font-size: clamp(2rem,3.5vw,3.25rem); line-height: 1.08; }
.intro-copy p:first-child { margin-top: 0; }
.intro-copy p, .section-copy > p, .section-heading > p { color: var(--nh-muted); }

.risk-section { background: linear-gradient(135deg, #eaf7f3 0%, #fbfdfc 55%, #edf9f6 100%); }
.mortality-heading { display: grid; grid-template-columns: 1.1fr .9fr; gap: 56px; align-items: end; margin-bottom: 38px; }
.mortality-heading h2 { max-width: 720px; margin-bottom: 0; font-size: clamp(2rem,3.5vw,3.25rem); line-height: 1.08; }
.mortality-heading > p { margin: 0 0 8px; color: var(--nh-muted); }
.mortality-viz { overflow: hidden; border: 1px solid rgba(18,51,44,.13); border-radius: 28px; background: rgba(255,255,255,.97); box-shadow: 0 30px 80px rgba(18,51,44,.13); }
.mortality-toolbar { display: grid; grid-template-columns: auto 130px minmax(260px,1fr) 190px; gap: 22px; align-items: center; padding: 22px 26px; color: white; background: linear-gradient(110deg, #12332c, #08705c 68%, #00b08a); }
.mortality-play { min-width: 138px; min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; border: 1px solid rgba(255,255,255,.38); border-radius: 999px; color: white; background: rgba(255,255,255,.1); cursor: pointer; transition: background .2s ease, transform .2s ease; }
.mortality-play:hover, .mortality-play:focus-visible { transform: translateY(-2px); background: rgba(255,255,255,.2); outline: 2px solid rgba(255,255,255,.55); outline-offset: 2px; }
.mortality-play span, .mortality-play b { font-size: .78rem; }
.mortality-year span, .national-rate > span { display: block; color: #b9e2d8; font-size: .65rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.mortality-year strong { display: block; color: white; font-size: 2.2rem; line-height: 1; letter-spacing: -.04em; }
.year-slider-wrap { display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: center; font-size: .67rem; font-weight: 800; }
.year-slider-wrap input { width: 100%; accent-color: #35c6a6; cursor: ew-resize; }
.national-rate { padding-left: 20px; border-left: 1px solid rgba(255,255,255,.25); }
.national-rate strong { display: block; margin: 2px 0; color: white; font-size: 1.55rem; line-height: 1; }
.national-rate strong small { font-size: .62rem; font-weight: 600; }
.national-rate em { color: #9ee7d5; font-size: .65rem; font-style: normal; font-weight: 750; }
.mortality-grid { display: grid; grid-template-columns: minmax(310px,.78fr) minmax(500px,1.22fr); min-height: 650px; }
.ranking-panel, .map-panel { min-width: 0; padding: 26px; }
.ranking-panel { border-right: 1px solid #e0ebe7; background: #fbfdfc; }
.panel-title { min-height: 52px; display: flex; justify-content: space-between; gap: 15px; align-items: flex-start; }
.panel-title span { color: var(--nh-green); font-size: .67rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.panel-title h3 { margin: 3px 0 0; color: var(--nh-green-dark); font-size: 1.18rem; }
.panel-title > small { padding-top: 7px; color: #71857f; font-size: .65rem; }
.ranking-scale { display: grid; grid-template-columns: repeat(4,1fr); margin: 13px 0 6px; padding-left: 118px; color: #94a59f; font-size: .58rem; text-align: right; }
.ranking-list { max-height: 520px; padding: 4px 8px 4px 0; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #aac9c1 transparent; }
.ranking-row { display: grid; grid-template-columns: 108px 1fr 47px; gap: 9px; align-items: center; width: 100%; min-height: 27px; padding: 3px 0; border: 0; color: #36544c; background: transparent; cursor: pointer; text-align: left; }
.ranking-row:hover, .ranking-row:focus-visible { color: var(--nh-green-dark); outline: none; }
.ranking-row.active { color: var(--nh-green); font-weight: 850; }
.ranking-name { overflow: hidden; font-size: .67rem; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.ranking-track { position: relative; height: 10px; overflow: hidden; border-radius: 999px; background: repeating-linear-gradient(90deg,#edf3f1 0,#edf3f1 calc(25% - 1px),#d7e4e0 25%); }
.ranking-bar { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #ef9f91, #d23731); box-shadow: inset 0 -1px 0 rgba(0,0,0,.08); transition: width .65s cubic-bezier(.22,.8,.27,1), background .3s ease; }
.ranking-row.below .ranking-bar { background: linear-gradient(90deg, #f4c7be, #df8377); }
.ranking-row.active .ranking-bar { background: linear-gradient(90deg, #35c6a6, #00b08a); }
.ranking-value { font-variant-numeric: tabular-nums; font-size: .69rem; font-weight: 850; text-align: right; }
.map-panel { display: flex; flex-direction: column; }
.interactive-map { position: relative; flex: 1; min-height: 470px; margin-top: 8px; overflow: hidden; border: 1px solid #dce9e5; border-radius: 22px; background: #f7f4ec; }
.interactive-map::after { content: ""; position: absolute; inset: 0; pointer-events: none; box-shadow: inset 0 0 80px rgba(88,64,40,.08); }
.interactive-map > img { width: 100%; height: 100%; display: block; object-fit: cover; }
.map-points { position: absolute; inset: 0; }
.map-point { position: absolute; z-index: 2; width: 18px; height: 18px; border: 3px solid white; border-radius: 50%; background: #d4473f; box-shadow: 0 3px 12px rgba(66,20,17,.38); transform: translate(-50%,-50%); cursor: pointer; transition: transform .25s ease, background .25s ease, box-shadow .25s ease; }
.map-point.below { background: #e9988b; }
.map-point:hover, .map-point:focus-visible { z-index: 5; transform: translate(-50%,-50%) scale(1.45); outline: none; }
.map-point.active { z-index: 6; background: var(--nh-green); box-shadow: 0 0 0 7px rgba(0,176,138,.2), 0 5px 14px rgba(4,65,52,.38); transform: translate(-50%,-50%) scale(1.25); }
.map-point::after { content: attr(data-short); position: absolute; left: 50%; bottom: calc(100% + 8px); padding: 5px 7px; border-radius: 7px; color: white; background: var(--nh-green-dark); font-size: .58rem; font-weight: 800; white-space: nowrap; opacity: 0; pointer-events: none; transform: translate(-50%,4px); transition: opacity .2s ease, transform .2s ease; }
.map-point:hover::after, .map-point:focus-visible::after, .map-point.active::after { opacity: 1; transform: translate(-50%,0); }
.map-detail { position: absolute; z-index: 7; left: 18px; bottom: 18px; min-width: 205px; padding: 15px 17px; border: 1px solid rgba(255,255,255,.5); border-radius: 16px; color: white; background: rgba(18,51,44,.92); box-shadow: 0 14px 35px rgba(3,38,30,.24); backdrop-filter: blur(8px); }
.map-detail span, .map-detail strong, .map-detail small { display: block; color: white; }
.map-detail span { color: #b9e2d8; font-size: .68rem; }
.map-detail strong { margin: 2px 0; font-size: 2rem; line-height: 1; }
.map-detail small { font-size: .63rem; }
.map-detail.updating { animation: metric-pop .4s ease; }
.map-legend { display: flex; flex-wrap: wrap; gap: 15px; margin-top: 15px; color: #607970; font-size: .64rem; }
.map-legend span { display: inline-flex; align-items: center; gap: 6px; }
.map-legend i { width: 10px; height: 10px; border-radius: 50%; background: #d4473f; }
.map-legend i.below { background: #e9988b; }
.map-legend i.selected { background: var(--nh-green); }
.mortality-insight { display: flex; gap: 18px; align-items: center; margin: 0 26px 16px; padding: 17px 20px; border-radius: 16px; color: #31564c; background: #edf8f5; }
.mortality-insight > span { flex: 0 0 auto; padding: 7px 10px; border-radius: 999px; color: white; background: var(--nh-green); font-size: .68rem; font-weight: 850; }
.mortality-insight p { margin: 0; font-size: .83rem; }
.mortality-source { margin: 0; padding: 0 26px 22px; color: #70837d; font-size: .64rem; }

.method-section { padding: 94px 0; }
.section-heading { max-width: 880px; margin-bottom: 42px; }
.section-heading.center { margin-right: auto; margin-left: auto; text-align: center; }
.section-heading.center > p { margin-right: auto; margin-left: auto; }

.method-journey { background: var(--nh-pale); }
.journey-grid { position: relative; display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 14px; }
.journey-grid::before { content: ""; position: absolute; z-index: 0; top: 35px; left: 8%; right: 8%; height: 2px; background: linear-gradient(90deg, transparent, var(--nh-green) 10%, var(--nh-green) 90%, transparent); }
.journey-card { position: relative; z-index: 1; min-width: 0; padding: 22px 19px 24px; border: 1px solid var(--nh-line); border-radius: 20px; background: white; box-shadow: 0 13px 34px rgba(18,51,44,.06); }
.journey-card > b { width: 48px; height: 48px; display: grid; margin-bottom: 24px; place-items: center; border: 5px solid white; border-radius: 50%; color: white; background: var(--nh-green); box-shadow: 0 0 0 1px rgba(0,176,138,.25); font-size: .72rem; }
.journey-card h3 { margin: 0 0 10px; font-size: 1.15rem; text-transform: uppercase; }
.journey-card p { margin: 0; color: var(--nh-muted); font-size: .84rem; line-height: 1.58; }

.longitudinal-section { color: white; background: linear-gradient(125deg, #0e2f29, #123f36 66%, #096f5a); }
.longitudinal-section h2, .longitudinal-section .eyebrow { color: white; }
.longitudinal-section .section-copy p { color: #c3d9d3; }
.timeline-panel { position: relative; padding: 28px; border: 1px solid rgba(255,255,255,.13); border-radius: 24px; background: rgba(255,255,255,.06); box-shadow: 0 25px 60px rgba(0,0,0,.18); }
.timeline-panel::before { content: ""; position: absolute; top: 48px; bottom: 48px; left: 117px; width: 2px; background: linear-gradient(var(--nh-green), rgba(255,255,255,.16)); }
.timeline-item { position: relative; display: grid; grid-template-columns: 72px 20px 1fr; gap: 17px; align-items: center; min-height: 76px; }
.timeline-item time { color: #a9c8c0; font-size: .69rem; font-weight: 800; text-align: right; text-transform: uppercase; }
.timeline-item > span { position: relative; z-index: 1; width: 15px; height: 15px; border: 3px solid #426f64; border-radius: 50%; background: var(--nh-green-dark); }
.timeline-item.active > span { border-color: white; background: var(--nh-green); box-shadow: 0 0 0 7px rgba(0,176,138,.16); }
.timeline-item b, .timeline-item small { display: block; }
.timeline-item b { color: white; font-size: .92rem; }
.timeline-item small { margin-top: 3px; color: #9fbdb5; font-size: .72rem; }

.route-section { background: white; }
.age-rail { display: grid; grid-template-columns: auto 1fr auto 1fr auto 1fr auto 1fr auto; gap: 12px; align-items: center; margin: 0 0 26px; color: var(--nh-green-dark); font-size: .76rem; font-weight: 850; }
.age-rail i { height: 5px; border-radius: 99px; background: linear-gradient(90deg, #d8ebe6, var(--nh-green)); }
.route-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.route-card { padding: 26px; border: 1px solid var(--nh-line); border-top: 4px solid var(--nh-green); border-radius: 18px; background: #fff; box-shadow: 0 12px 32px rgba(18,51,44,.055); }
.route-card > span { display: inline-block; padding: 6px 9px; border-radius: 999px; color: #07664f; background: #e1f7f0; font-size: .7rem; font-weight: 850; }
.route-card h3 { margin: 17px 0 10px; font-size: 1.2rem; }
.route-card p { margin-bottom: 0; color: var(--nh-muted); font-size: .85rem; }
.route-card .route-note { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--nh-line); font-size: .76rem; }
.route-card.muted { border-top-color: #84958f; }.route-card.muted > span { color: #55645f; background: #eef2f0; }
.route-card.young { border-top-color: #00b08a; }.route-card.older { border-top-color: #247a9e; }.route-card.secondary { border-top-color: #b07a20; }.route-card.geriatric { border-top-color: #745b8d; }
.clinical-notice { margin: 26px 0 0; padding: 18px 20px; border-left: 4px solid var(--nh-green); border-radius: 0 12px 12px 0; color: #405f57; background: var(--nh-pale); font-size: .82rem; }

.essentials-section { background: linear-gradient(180deg, #f4fbf9, #eef8f5); }
.essential-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 13px; }
.essential-grid article { position: relative; min-height: 132px; display: flex; flex-direction: column; justify-content: space-between; padding: 20px; overflow: hidden; border: 1px solid #d5e9e3; border-radius: 18px; background: white; }
.essential-grid article::after { content: ""; position: absolute; width: 90px; height: 90px; right: -42px; bottom: -45px; border-radius: 50%; background: rgba(0,176,138,.1); }
.essential-grid b { color: var(--nh-green); font-size: .73rem; }
.essential-grid span { max-width: 130px; font-weight: 850; }
.supporting-copy { max-width: 920px; margin: 28px auto 0; color: var(--nh-muted); text-align: center; font-size: .88rem; }

.nutrition-section { background: white; }
.nutrition-board { padding: 25px; border: 1px solid var(--nh-line); border-radius: 26px; background: #fff; box-shadow: 0 24px 60px rgba(18,51,44,.12); }
.board-head { display: flex; justify-content: space-between; gap: 20px; align-items: center; padding-bottom: 18px; border-bottom: 1px solid var(--nh-line); }
.board-head small, .board-head b { display: block; }.board-head small { color: var(--nh-green); font-size: .68rem; font-weight: 850; text-transform: uppercase; }.board-head b { margin-top: 4px; font-size: 1.2rem; }
.board-head > span { padding: 8px 11px; border-radius: 999px; color: white; background: var(--nh-green-dark); font-size: .7rem; font-weight: 800; }
.board-week { display: grid; grid-template-columns: repeat(7,1fr); gap: 8px; padding: 18px 0; }
.board-week i { height: 38px; display: grid; place-items: center; border: 1px solid var(--nh-line); border-radius: 10px; color: #7a8f89; font-size: .72rem; font-style: normal; font-weight: 800; }
.board-week i.done { color: #08725c; background: #e1f7f0; }.board-week i.today { color: white; border-color: var(--nh-green); background: var(--nh-green); }
.board-row { display: flex; justify-content: space-between; gap: 20px; padding: 12px 4px; border-top: 1px solid #e8f1ee; font-size: .8rem; }
.board-row span { color: var(--nh-muted); }.board-row b { color: var(--nh-green-dark); }
.board-foot { display: block; margin-top: 15px; padding: 12px; border-radius: 10px; color: #496860; background: var(--nh-pale); font-size: .67rem; text-align: center; }
.check-list { padding: 0; list-style: none; }
.check-list li { position: relative; margin: 10px 0; padding-left: 28px; color: var(--nh-muted); }
.check-list li::before { content: "✓"; position: absolute; left: 0; top: 1px; width: 19px; height: 19px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--nh-green); font-size: .65rem; font-weight: 900; }

.portal-section { color: white; background: linear-gradient(130deg, #12332c, #0a5849 68%, #087760); }
.portal-section h2, .portal-section .eyebrow { color: white; }
.portal-section .section-heading > p { color: #cae1da; }
.portal-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }
.portal-grid article { padding: 21px; border: 1px solid rgba(255,255,255,.13); border-radius: 16px; background: rgba(255,255,255,.07); }
.portal-grid b, .portal-grid span { display: block; }.portal-grid b { color: white; }.portal-grid span { margin-top: 7px; color: #bed8d1; font-size: .78rem; line-height: 1.5; }
.portal-actions { margin-top: 26px; }
.portal-section .button.secondary { color: white; border-color: rgba(255,255,255,.45); }

.result-section { background: var(--nh-pale); }
.result-grid, .role-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; }
.result-grid article { padding: 24px; border: 1px solid var(--nh-line); border-radius: 18px; background: white; }
.result-grid article > span { width: 12px; height: 12px; display: block; border-radius: 50%; box-shadow: 0 0 0 6px rgba(0,176,138,.1); background: var(--nh-green); }
.result-grid .missing > span { box-shadow: 0 0 0 6px rgba(188,130,30,.1); background: #bc821e; }.result-grid .not-applicable > span { box-shadow: 0 0 0 6px rgba(93,112,105,.1); background: #5d7069; }.result-grid .external > span { box-shadow: 0 0 0 6px rgba(58,111,146,.1); background: #3a6f92; }
.result-grid h3 { margin: 23px 0 9px; font-size: 1.08rem; }.result-grid p { margin: 0; color: var(--nh-muted); font-size: .8rem; }
.result-note { margin: 22px 0 0; color: #3c5c54; text-align: center; font-size: .86rem; font-weight: 750; }

.security-section { background: white; }
.role-grid article { padding: 24px; border-top: 1px solid var(--nh-line); }
.role-grid article > span { color: var(--nh-green); font-size: .7rem; font-weight: 850; }.role-grid h3 { margin: 13px 0 9px; font-size: 1.08rem; }.role-grid p { margin: 0; color: var(--nh-muted); font-size: .8rem; }
.security-layers { display: flex; flex-wrap: wrap; justify-content: center; gap: 9px; margin-top: 34px; padding: 25px; border-radius: 20px; background: var(--nh-green-dark); }
.security-layers span { padding: 9px 12px; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; color: white; background: rgba(255,255,255,.07); font-size: .72rem; font-weight: 750; }

.quality-section { background: #eef8f5; }
.limit-box { padding: 30px; border: 1px solid #cce4dd; border-left: 6px solid var(--nh-green); border-radius: 20px; background: white; box-shadow: 0 18px 45px rgba(18,51,44,.08); }
.limit-box > strong { display: block; font-size: 1.3rem; line-height: 1.25; }.limit-box p { color: var(--nh-muted); }.limit-box ul { margin-bottom: 0; padding-left: 20px; color: #45635b; }
.limit-box li { margin: 8px 0; }

.collaboration-section { background: white; }
.collaboration-grid { align-items: start; }
.collab-warning { margin: 24px 0; padding: 16px 18px; border-left: 4px solid var(--nh-green); border-radius: 0 12px 12px 0; color: #3d5a53 !important; background: var(--nh-pale); font-size: .82rem; font-weight: 700; }
.collab-objectives { padding: 29px; border: 1px solid var(--nh-line); border-radius: 22px; background: var(--nh-pale); }
.collab-objectives h3 { margin-top: 0; }
.collab-objectives ul { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 22px; margin: 0; padding: 0; list-style: none; }
.collab-objectives li { position: relative; padding-left: 24px; color: var(--nh-muted); font-size: .8rem; line-height: 1.5; }
.collab-objectives li::before { content: ""; position: absolute; left: 0; top: .47em; width: 9px; height: 9px; border: 3px solid #bde9dd; border-radius: 50%; background: var(--nh-green); }

.method-closing { padding: 82px 0; color: white; background: linear-gradient(110deg, #0d3029, #096f5a 72%, #00b08a); }
.method-closing .shell { max-width: 1060px; }
.method-closing h2 { max-width: 960px; margin: 12px 0 20px; color: white; font-size: clamp(2.25rem,4.4vw,4.4rem); line-height: 1.04; }
.method-closing p { max-width: 850px; color: #d4e8e2; }
.method-closing .eyebrow { color: #7ae3ca; }
.closing-actions { margin-top: 30px; }
.method-closing .button.secondary { color: white; border-color: rgba(255,255,255,.45); }

.reveal { opacity: 0; transform: translateY(20px); transition: opacity .6s ease, transform .6s ease; }
.reveal.is-visible { opacity: 1; transform: none; }

@media (max-width: 1080px) {
  .method-hero-grid { grid-template-columns: 1fr; gap: 48px; }
  .method-overview { width: 100%; max-width: none; justify-self: stretch; }
  .mortality-heading { grid-template-columns: 1fr; gap: 18px; }
  .mortality-toolbar { grid-template-columns: auto 120px 1fr; }
  .national-rate { grid-column: 1 / -1; display: flex; gap: 18px; align-items: baseline; padding: 14px 0 0; border: 0; border-top: 1px solid rgba(255,255,255,.22); }
  .national-rate > span { margin-right: auto; }
  .mortality-grid { grid-template-columns: 1fr; }
  .ranking-panel { border-right: 0; border-bottom: 1px solid #e0ebe7; }
  .ranking-list { max-height: 410px; }
  .interactive-map { min-height: 560px; }
  .journey-grid { grid-template-columns: repeat(3,1fr); }
  .journey-grid::before { display: none; }
  .route-grid { grid-template-columns: 1fr 1fr; }
  .result-grid, .role-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 760px) {
  .method-hero { padding: 66px 0 56px; }
  .method-hero-grid { gap: 38px; }
  .method-hero-copy h1 { font-size: clamp(2.65rem,12.5vw,4.2rem); }
  .hero-subtitle { font-size: 1.03rem; }
  .hero-actions, .portal-actions, .closing-actions { flex-direction: column; align-items: stretch; }
  .hero-actions .button, .portal-actions .button, .closing-actions .button { width: 100%; }
  .audience-list { margin-top: 26px; }
  .method-overview { padding: 17px; border-radius: 20px; }
  .overview-head { grid-template-columns: 48px 1fr; }.overview-head img { width: 44px; height: 44px; }.overview-head > span { grid-column: 1 / -1; justify-self: start; }
  .overview-patient, .overview-metrics { grid-template-columns: 1fr; }
  .overview-flow { grid-template-columns: 1fr; text-align: center; }.overview-flow i { width: 2px; height: 13px; justify-self: center; }
  .method-intro, .method-section, .method-closing { padding: 70px 0; }
  .intro-grid, .split-layout, .collaboration-grid { grid-template-columns: 1fr; gap: 38px; }
  .section-heading { margin-bottom: 32px; }
  .mortality-viz { border-radius: 20px; }
  .mortality-heading { margin-bottom: 28px; }
  .mortality-toolbar { grid-template-columns: 1fr 1fr; gap: 16px; padding: 20px; }
  .mortality-play { min-width: 0; }
  .mortality-year { text-align: right; }
  .year-slider-wrap { grid-column: 1 / -1; }
  .national-rate { grid-column: 1 / -1; flex-wrap: wrap; gap: 8px 15px; }
  .national-rate > span { width: 100%; }
  .ranking-panel, .map-panel { padding: 20px 15px; }
  .ranking-scale { padding-left: 99px; }
  .ranking-row { grid-template-columns: 90px 1fr 44px; }
  .interactive-map { min-height: 390px; }
  .map-point { width: 16px; height: 16px; }
  .map-detail { left: 10px; bottom: 10px; min-width: 170px; padding: 12px 14px; }
  .map-detail strong { font-size: 1.65rem; }
  .mortality-insight { align-items: flex-start; margin: 0 15px 14px; }
  .mortality-source { padding: 0 15px 20px; }
  .journey-grid { grid-template-columns: 1fr; gap: 12px; }
  .journey-card { display: grid; grid-template-columns: 52px 1fr; gap: 0 13px; padding: 19px; }
  .journey-card > b { grid-row: 1 / 3; width: 44px; height: 44px; margin: 0; }
  .journey-card h3 { margin-top: 4px; }.journey-card p { grid-column: 2; }
  .timeline-panel { padding: 20px 16px; }.timeline-panel::before { left: 91px; }.timeline-item { grid-template-columns: 58px 18px 1fr; gap: 11px; }
  .age-rail { gap: 6px; font-size: .65rem; }
  .route-grid, .essential-grid, .portal-grid, .result-grid, .role-grid { grid-template-columns: 1fr; }
  .essential-grid { grid-template-columns: 1fr 1fr; }
  .essential-grid article { min-height: 110px; }
  .board-week { gap: 5px; }.board-week i { height: 34px; }
  .portal-grid article { padding: 18px; }
  .role-grid article { padding: 20px 0; }
  .collab-objectives { padding: 22px; }.collab-objectives ul { grid-template-columns: 1fr; }
  .method-closing h2 { font-size: clamp(2.25rem,10.5vw,3.3rem); }
}

@media (max-width: 390px) {
  .essential-grid { grid-template-columns: 1fr; }
  .audience-list span { width: 100%; text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
  * { scroll-behavior: auto !important; }
}