:root {
  --dh-aqua: #67c9d0;
  --dh-cyan: #9de3e6;
  --dh-ink: #082538;
  --dh-panel: #102f44;
  --dh-glow: rgba(103, 201, 208, .28);
}

html { overflow-x: hidden; }
.dh-page { overflow-x: hidden; background: #fff; }
.dh-section { position: relative; padding-block: var(--section-space); }
.dh-section--compact { padding-block: var(--section-space-compact); }
.dh-section[id] { scroll-margin-top: calc(var(--header-height) + 4.5rem); }
.dh-kicker { color: var(--color-brand-teal); font-size: .76rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }


.dh-hero {
  position: relative;
  isolation: isolate;
  overflow: clip;
  min-height: calc(100svh - var(--header-height));
  color: white;
  background:
    radial-gradient(circle at 10% 18%, rgba(35,131,197,.25), transparent 28%),
    radial-gradient(circle at 92% 8%, rgba(103,201,208,.18), transparent 24%),
    linear-gradient(132deg, #061e2f 0%, #0d2a3e 52%, #123e55 100%);
}
.dh-hero::before {
  position: absolute; inset: 0; z-index: -1; content: "";
  background: linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px);
  background-size: 54px 54px;
  mask-image: linear-gradient(90deg, black, rgba(0,0,0,.25) 65%, transparent);
}
.dh-hero__mesh { position: absolute; width: 42rem; height: 42rem; right: -15rem; top: -15rem; border: 1px solid rgba(255,255,255,.12); border-radius: 50%; box-shadow: inset 0 0 0 6rem rgba(255,255,255,.018), inset 0 0 0 12rem rgba(103,201,208,.012); }
.dh-hero__grid { display: grid; min-height: calc(100svh - var(--header-height)); padding-block: clamp(4rem,8vw,7rem); gap: clamp(2.5rem,6vw,6rem); align-items: center; grid-template-columns: minmax(0,1.02fr) minmax(25rem,.98fr); }
.dh-hero__copy { position: relative; z-index: 2; max-width: 47rem; }
.dh-hero .breadcrumbs { margin-bottom: 1.7rem; }
.dh-hero .breadcrumbs a, .dh-hero .breadcrumbs li { color: rgba(255,255,255,.72); }
.dh-hero .breadcrumbs li + li::before { color: rgba(255,255,255,.38); }
.dh-hero .eyebrow { color: #83d9d7; }
.dh-hero__title { color: #fff; font-size: clamp(3rem,6vw,5.65rem); line-height: .94; letter-spacing: -.055em; text-wrap: balance; }
.dh-hero__lead { max-width: 45rem; margin-top: 1.15rem; color: rgba(255,255,255,.78); font-size: clamp(1rem,1.5vw,1.17rem); line-height: 1.62; }
.dh-hero__actions { display: flex; flex-wrap: wrap; gap: .85rem; margin-top: 2rem; }
.dh-hero .btn-secondary { color: #fff; border-color: rgba(255,255,255,.32); background: rgba(255,255,255,.06); }
.dh-hero .btn-secondary:hover { border-color: rgba(255,255,255,.7); background: rgba(255,255,255,.12); }
.dh-hero__signals { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: 1.7rem; }
.dh-hero__signals span { display: inline-flex; padding: .5rem .72rem; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; color: rgba(255,255,255,.72); background: rgba(255,255,255,.045); font-size: .76rem; font-weight: 700; }
.dh-hero__visual { position: relative; min-height: 36rem; }
.dh-hero__media { position: absolute; inset: 1.4rem 2rem 2.5rem 0; margin: 0; overflow: hidden; border: 1px solid rgba(255,255,255,.18); border-radius: 2.1rem; background: #12384d; box-shadow: 0 45px 110px rgba(0,0,0,.38); }
.dh-hero__media::after { position: absolute; inset: 0; content: ""; background: linear-gradient(180deg, transparent 50%, rgba(6,30,47,.62)); pointer-events: none; }
.dh-hero__media picture, .dh-hero__media img { width: 100%; height: 100%; }
.dh-hero__photo { object-fit: cover; object-position: 58% center; filter: saturate(.86) contrast(1.03); }
.dh-hero__media figcaption { position: absolute; z-index: 2; right: 1.1rem; bottom: .95rem; left: 1.1rem; color: rgba(255,255,255,.72); font-size: .72rem; line-height: 1.35; }
.dh-hero__orbit { position: absolute; z-index: 3; display: flex; width: 7.1rem; min-height: 6.2rem; padding: .85rem; gap: .48rem; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,.62); border-radius: 1.2rem; color: #fff; background: rgba(8,37,56,.88); box-shadow: 0 18px 44px rgba(0,0,0,.26); backdrop-filter: blur(13px); font-size: .79rem; font-weight: 800; flex-direction: column; }
.dh-hero__orbit .icon { width: 1.7rem; height: 1.7rem; color: var(--dh-cyan); }
.dh-hero__orbit--one { top: 0; right: 0; }
.dh-hero__orbit--two { right: -.5rem; top: 42%; }
.dh-hero__orbit--three { right: 2.5rem; bottom: 0; }
.dh-hero__status { position: absolute; z-index: 3; left: -2rem; bottom: 6rem; display: grid; padding: 1rem 1.25rem; border: 1px solid rgba(255,255,255,.22); border-radius: 1rem; color: #fff; background: rgba(15,122,128,.94); box-shadow: var(--shadow-lg); }
.dh-hero__status strong { font-size: .9rem; }
.dh-hero__status span { color: rgba(255,255,255,.72); font-size: .73rem; }

/* Sticky section navigation */
.dh-subnav { position: sticky; z-index: 30; top: var(--header-height); border-bottom: 1px solid rgba(215,224,230,.9); background: rgba(255,255,255,.92); backdrop-filter: blur(16px); }
.dh-subnav__inner { display: flex; gap: .3rem; overflow-x: auto; scrollbar-width: none; }
.dh-subnav__inner::-webkit-scrollbar { display: none; }
.dh-subnav a { position: relative; flex: 0 0 auto; padding: .85rem .75rem; color: var(--color-muted); font-size: .78rem; font-weight: 800; text-decoration: none; white-space: nowrap; }
.dh-subnav a::after { position: absolute; right: .75rem; bottom: 0; left: .75rem; height: 2px; content: ""; background: var(--color-brand-teal); transform: scaleX(0); transform-origin: left; transition: transform .22s; }
.dh-subnav a:hover, .dh-subnav a.is-active { color: var(--color-navy-950); }
.dh-subnav a.is-active::after { transform: scaleX(1); }

/* Intro and explanatory visual */
.dh-intro-grid { display: grid; gap: clamp(2rem,6vw,5rem); align-items: center; grid-template-columns: minmax(0,1fr) minmax(23rem,.9fr); }
.dh-copy > * + * { margin-top: 1.15rem; }
.dh-copy .eyebrow { color: var(--color-brand-teal); }
.dh-copy h2 { font-size: clamp(2.1rem,4.1vw,3.8rem); letter-spacing: -.045em; }
.dh-boundary { display: grid; margin-top: 1.8rem; padding: 1.15rem; gap: .9rem; border: 1px solid rgba(15,122,128,.22); border-radius: var(--radius-lg); background: var(--color-surface-teal); grid-template-columns: auto 1fr; }
.dh-boundary .icon { width: 1.55rem; height: 1.55rem; color: var(--color-brand-teal); }
.dh-boundary strong { color: var(--color-navy-950); }
.dh-boundary p { margin-top: .3rem; color: var(--color-muted); font-size: .88rem; }
.dh-explainer { position: relative; margin: 0; padding: 1.4rem; border: 1px solid var(--color-border); border-radius: var(--radius-2xl); background: linear-gradient(155deg,#fff,var(--color-surface-blue)); box-shadow: var(--shadow-xl); }
.dh-explainer::before { position: absolute; width: 8rem; height: 8rem; right: -1.5rem; top: -1.5rem; border: 1px solid rgba(35,131,197,.18); border-radius: 50%; content: ""; box-shadow: inset 0 0 0 1.4rem rgba(35,131,197,.035); }
.dh-explainer img { width: 100%; max-height: 34rem; object-fit: contain; }
.dh-explainer figcaption { display: grid; margin-top: 1rem; padding-top: 1rem; gap: .2rem; border-top: 1px solid var(--color-border); }
.dh-explainer figcaption strong { color: var(--color-navy-950); }
.dh-explainer figcaption span { color: var(--color-muted); font-size: .82rem; }

/* Role explorer */
.dh-role-explorer { overflow: hidden; border: 1px solid var(--color-border); border-radius: var(--radius-2xl); background: #fff; box-shadow: var(--shadow-lg); }
.dh-role-tabs { display: grid; padding: .65rem; gap: .55rem; border-bottom: 1px solid var(--color-border); background: linear-gradient(180deg,#f8fbfc,#f0f5f7); grid-template-columns: repeat(4,minmax(0,1fr)); }
.dh-role-tab { display: grid; min-height: 7.6rem; padding: 1rem; gap: .25rem; justify-items: start; border: 1px solid transparent; border-radius: 1rem; color: var(--color-muted); background: transparent; text-align: left; transition: transform .22s,border-color .22s,background .22s,color .22s; }
.dh-role-tab > span { display: grid; width: 2rem; height: 2rem; place-items: center; border-radius: 50%; color: var(--color-brand-blue-800); background: var(--color-surface-blue); font-size: .72rem; font-weight: 800; }
.dh-role-tab strong { color: inherit; font-size: .95rem; }
.dh-role-tab small { color: inherit; font-size: .74rem; }
.dh-role-tab:hover { transform: translateY(-2px); color: var(--color-navy-950); border-color: var(--color-border); background: #fff; }
.dh-role-tab[aria-selected="true"] { color: #fff; background: linear-gradient(145deg,var(--color-navy-950),var(--color-navy-800)); box-shadow: var(--shadow-md); }
.dh-role-tab[aria-selected="true"] > span { color: #fff; background: rgba(103,201,208,.2); }
.dh-role-panels { position: relative; min-height: 24rem; padding: clamp(1.5rem,4vw,3rem); color: #fff; background: radial-gradient(circle at 85% 15%,rgba(35,131,197,.26),transparent 28%), linear-gradient(145deg,#082538,#123b52); }
.dh-role-panels::before { position: absolute; inset: 0; content: ""; opacity: .18; background-image: linear-gradient(rgba(255,255,255,.15) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.15) 1px,transparent 1px); background-size: 42px 42px; mask-image: linear-gradient(90deg,transparent,black); }
.dh-role-panel { position: relative; display: grid; gap: clamp(1.5rem,5vw,4rem); align-items: center; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); }
.js .dh-role-panel:not(.is-active) { display: none; }
.dh-role-panel__intro .dh-kicker { color: var(--dh-cyan); }
.dh-role-panel__intro h3 { margin: .4rem 0 .8rem; color: #fff; font-size: clamp(1.55rem,3vw,2.6rem); }
.dh-role-panel__intro p { color: rgba(255,255,255,.73); }
.dh-role-facts { display: grid; margin: 0; gap: .7rem; grid-template-columns: repeat(2,minmax(0,1fr)); }
.dh-role-facts div { padding: 1rem; border: 1px solid rgba(255,255,255,.13); border-radius: 1rem; background: rgba(255,255,255,.07); backdrop-filter: blur(8px); }
.dh-role-facts dt { color: var(--dh-cyan); font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.dh-role-facts dd { margin: .35rem 0 0; color: #fff; font-size: .88rem; line-height: 1.45; }

/* Engineering priority explorer */
.dh-engineering { border: 1px solid var(--color-border); border-radius: var(--radius-2xl); overflow: hidden; background: #fff; box-shadow: var(--shadow-xl); }
.dh-engineering__tabs { display: grid; padding: .55rem; gap: .45rem; border-bottom: 1px solid var(--color-border); background: var(--color-surface-soft); grid-template-columns: repeat(3,minmax(0,1fr)); }
.dh-engineering__tabs button { display: flex; min-height: 3.8rem; padding: .75rem; gap: .55rem; align-items: center; justify-content: center; border: 0; border-radius: .8rem; color: var(--color-muted); background: transparent; font-size: .78rem; font-weight: 800; }
.dh-engineering__tabs .icon { width: 1.2rem; height: 1.2rem; }
.dh-engineering__tabs button:hover { color: var(--color-navy-950); background: #fff; }
.dh-engineering__tabs button[aria-selected="true"] { color: #fff; background: var(--color-brand-teal); box-shadow: var(--shadow-sm); }
.dh-engineering__panels { padding: clamp(1.5rem,4vw,3rem); }
.dh-engineering__panel { display: grid; gap: clamp(2rem,5vw,5rem); align-items: center; grid-template-columns: minmax(0,1.1fr) minmax(18rem,.9fr); }
.js .dh-engineering__panel:not(.is-active) { display: none; }
.dh-engineering__panel h3 { margin: .45rem 0 .9rem; font-size: clamp(1.6rem,3vw,2.65rem); }
.dh-engineering__panel p { color: var(--color-muted); }
.dh-engineering__panel ul { display: grid; padding: 0; margin: 1.1rem 0 0; gap: .6rem; list-style: none; }
.dh-engineering__panel li { display: flex; gap: .65rem; align-items: flex-start; }
.dh-engineering__panel li::before { flex: 0 0 auto; width: .55rem; height: .55rem; margin-top: .55rem; border-radius: 50%; content: ""; background: var(--color-brand-teal); box-shadow: 0 0 0 .24rem rgba(15,122,128,.1); }
.dh-engineering__panel a { display: inline-flex; margin-top: 1.1rem; font-weight: 800; }
.dh-engineering__visual { position: relative; min-height: 22rem; display: grid; padding: 2rem; gap: .75rem; place-content: center; overflow: hidden; border-radius: var(--radius-xl); color: #fff; background: radial-gradient(circle at 50% 45%,rgba(103,201,208,.28),transparent 28%), linear-gradient(145deg,#0b2a3e,#16475e); text-align: center; }
.dh-engineering__visual > .icon { position: relative; z-index: 2; width: 4rem; height: 4rem; margin-inline: auto; color: var(--dh-cyan); }
.dh-engineering__visual strong { position: relative; z-index: 2; font-size: .87rem; line-height: 1.5; }
.dh-ring { position: absolute; left: 50%; top: 50%; border: 1px solid rgba(255,255,255,.22); border-radius: 50%; transform: translate(-50%,-50%); }
.dh-ring--a { width: 11rem; height: 11rem; }
.dh-ring--b { width: 18rem; height: 18rem; border-style: dashed; }
.dh-engineering__visual--path { grid-template-columns: auto 6rem auto; align-items: center; }
.dh-engineering__visual--path .dh-node { padding: .8rem; border: 1px solid rgba(255,255,255,.25); border-radius: .85rem; background: rgba(255,255,255,.08); font-size: .8rem; font-weight: 800; }
.dh-engineering__visual--path i { height: 2px; background: linear-gradient(90deg,var(--dh-aqua),rgba(255,255,255,.32)); }
.dh-engineering__visual--path b, .dh-engineering__visual--path em { grid-column: 1 / -1; font-size: .76rem; }
.dh-engineering__visual--path b { color: var(--dh-cyan); }
.dh-engineering__visual--path em { color: rgba(255,255,255,.66); font-style: normal; }
.dh-engineering__visual--steps { grid-template-columns: repeat(2,minmax(0,1fr)); }
.dh-engineering__visual--steps span, .dh-engineering__visual--layers span { padding: 1rem; border: 1px solid rgba(255,255,255,.18); border-radius: .85rem; background: rgba(255,255,255,.07); font-size: .8rem; font-weight: 800; }
.dh-engineering__visual--layers { align-content: center; }
.dh-engineering__visual--layers span:nth-child(2) { margin-inline: 1rem; background: rgba(103,201,208,.16); }
.dh-engineering__visual--layers span:nth-child(3) { margin-inline: 2rem; }

/* Platform contexts */
.dh-context-grid { display: grid; gap: var(--grid-gap); grid-template-columns: repeat(3,minmax(0,1fr)); }
.dh-context-card { position: relative; min-height: 17rem; padding: 1.4rem; overflow: hidden; border: 1px solid rgba(35,131,197,.16); border-radius: var(--radius-xl); background: rgba(255,255,255,.88); box-shadow: var(--shadow-sm); transition: transform .25s,border-color .25s,box-shadow .25s; }
.dh-context-card::after { position: absolute; width: 8rem; height: 8rem; right: -3rem; bottom: -3rem; border-radius: 50%; content: ""; background: radial-gradient(circle,rgba(35,131,197,.14),transparent 68%); }
.dh-context-card:hover { transform: translateY(-6px); border-color: rgba(35,131,197,.38); box-shadow: var(--shadow-lg); }
.dh-context-card .icon { width: 2.2rem; height: 2.2rem; color: var(--color-brand-blue-700); }
.dh-context-card h3 { margin: 1rem 0 .55rem; font-size: var(--text-h4); }
.dh-context-card p { color: var(--color-muted); font-size: .92rem; }

/* Architecture for change */
.dh-change-grid { display: grid; gap: clamp(2.5rem,6vw,5.5rem); align-items: center; grid-template-columns: minmax(22rem,.85fr) minmax(0,1.15fr); }
.dh-change-photo { position: relative; min-height: 39rem; margin: 0; overflow: hidden; border-radius: var(--radius-2xl); box-shadow: var(--shadow-xl); }
.dh-change-photo picture, .dh-change-photo img { width: 100%; height: 100%; }
.dh-change-photo img { object-fit: cover; }
.dh-change-photo::after { position: absolute; inset: 0; content: ""; background: linear-gradient(180deg,transparent 65%,rgba(8,37,56,.75)); }
.dh-change-photo figcaption { position: absolute; z-index: 2; right: 1rem; bottom: .9rem; left: 1rem; color: rgba(255,255,255,.72); font-size: .72rem; }
.dh-change-copy > * + * { margin-top: 1.1rem; }
.dh-change-copy .eyebrow { color: var(--color-brand-teal); }
.dh-change-copy h2 { font-size: clamp(2.05rem,4vw,3.65rem); }
.dh-change-list { display: grid; padding: 0; margin-top: 1.5rem; gap: .7rem; list-style: none; grid-template-columns: repeat(2,minmax(0,1fr)); }
.dh-change-list li { padding: 1rem; border: 1px solid var(--color-border); border-radius: 1rem; background: #fff; box-shadow: var(--shadow-sm); }
.dh-change-list strong { display: block; color: var(--color-navy-950); }
.dh-change-list span { display: block; margin-top: .25rem; color: var(--color-muted); font-size: .82rem; }

/* Evidence */
.dh-evidence-grid { display: grid; gap: var(--grid-gap); grid-template-columns: repeat(2,minmax(0,1fr)); }
.dh-evidence-card { display: grid; overflow: hidden; border: 1px solid rgba(255,255,255,.13); border-radius: var(--radius-2xl); background: rgba(255,255,255,.06); backdrop-filter: blur(10px); }
.dh-evidence-card__visual { min-height: 14rem; display: flex; padding: 1.2rem; gap: .45rem; align-items: center; justify-content: center; color: rgba(255,255,255,.82); background: linear-gradient(145deg,rgba(35,131,197,.18),rgba(15,122,128,.12)); }
.dh-evidence-card__visual .icon { width: 2.4rem; height: 2.4rem; color: var(--dh-cyan); }
.dh-evidence-card__visual span { padding: .52rem .65rem; border: 1px solid rgba(255,255,255,.18); border-radius: .65rem; background: rgba(255,255,255,.07); font-size: .68rem; font-weight: 800; }
.dh-evidence-card__visual i { width: 1.5rem; height: 1px; background: rgba(255,255,255,.32); }
.dh-evidence-card__visual--device span:last-child { max-width: 7.5rem; text-align: center; }
.dh-evidence-card__body { padding: clamp(1.35rem,3vw,2rem); }
.dh-evidence-card__body .dh-kicker { color: var(--dh-cyan); }
.dh-evidence-card__body h3 { margin: .45rem 0 .8rem; color: #fff; }
.dh-evidence-card__body p { color: rgba(255,255,255,.73); }
.dh-evidence-card__body a { display: inline-flex; margin-top: 1.25rem; gap: .45rem; align-items: center; color: var(--dh-cyan); font-weight: 800; text-decoration: none; }
.dh-attribution { margin-top: 1.7rem; padding: 1rem 1.2rem; border-left: 3px solid var(--dh-aqua); color: rgba(255,255,255,.72); background: rgba(255,255,255,.055); font-size: .84rem; }

/* FAQs */
.dh-faq-heading { max-width: 58rem; margin-inline: auto; }
.dh-faq { max-width: 58rem; margin-inline: auto; }
.dh-faq-item { border-bottom: 1px solid var(--color-border); }
.dh-faq-item:first-child { border-top: 1px solid var(--color-border); }
.dh-faq-item summary { display: flex; min-height: 4.5rem; padding: 1rem 0; gap: 1rem; align-items: center; justify-content: space-between; list-style: none; color: var(--color-navy-950); font-weight: 800; cursor: pointer; }
.dh-faq-item summary::-webkit-details-marker { display: none; }
.dh-faq-item summary::after { display: grid; flex: 0 0 auto; width: 2rem; height: 2rem; place-items: center; border-radius: 50%; content: "+"; color: var(--color-brand-blue-800); background: var(--color-surface-blue); font-size: 1.2rem; transition: transform .25s; }
.dh-faq-item[open] summary::after { transform: rotate(45deg); }
.dh-faq-item__body { padding: 0 3rem 1.35rem 0; color: var(--color-muted); }

/* CTA */
.dh-cta { display: grid; padding: clamp(1.4rem,3vw,2.4rem); gap: clamp(1.5rem,4vw,3.5rem); align-items: center; border-radius: var(--radius-2xl); color: #fff; background: radial-gradient(circle at 8% 10%,rgba(103,201,208,.2),transparent 28%), linear-gradient(135deg,var(--color-navy-950),var(--color-brand-blue-800)); box-shadow: var(--shadow-xl); overflow: hidden; grid-template-columns: minmax(0,1.1fr) minmax(18rem,.9fr); }
.dh-cta h2 { color: #fff; font-size: clamp(1.9rem,3.7vw,3.2rem); }
.dh-cta p { color: rgba(255,255,255,.76); }
.dh-cta__copy > * + * { margin-top: 1rem; }
.dh-cta__actions { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; }
.dh-cta__link { color: var(--dh-cyan); font-size: .86rem; font-weight: 800; }
.dh-cta__link:hover { color: #fff; }
.dh-cta__photo { min-height: 24rem; margin: 0; overflow: hidden; border-radius: var(--radius-xl); }
.dh-cta__photo picture, .dh-cta__photo img { width: 100%; height: 100%; }
.dh-cta__photo img { object-fit: cover; }

@media (max-width: 70rem) {
  .dh-hero__grid { grid-template-columns: minmax(0,1fr) minmax(21rem,.82fr); }
  .dh-hero__title { font-size: clamp(3rem,6vw,4.8rem); }
  .dh-role-tabs { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .dh-role-tab { min-height: 6.5rem; }
  .dh-engineering__tabs { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 63.99rem) {
  .dh-hero { min-height: auto; }
  .dh-hero__grid, .dh-intro-grid, .dh-change-grid, .dh-cta { grid-template-columns: 1fr; }
  .dh-hero__grid { min-height: auto; padding-block: 4rem; }
  .dh-hero__visual { max-width: 39rem; width: 100%; min-height: 34rem; margin-inline: auto; }
  .dh-intro-grid { align-items: start; }
  .dh-explainer { max-width: 37rem; }
  .dh-role-panel, .dh-engineering__panel { grid-template-columns: 1fr; }
  .dh-engineering__visual { min-height: 18rem; }
  .dh-context-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .dh-change-grid { align-items: start; }
  .dh-change-photo { min-height: 32rem; max-width: 37rem; }
  .dh-cta__photo { min-height: 21rem; }
}

@media (max-width: 47.99rem) {
  .dh-hero__title { font-size: clamp(2.65rem,12vw,4rem); }
  .dh-hero__visual { min-height: 29rem; }
  .dh-hero__media { inset: 1rem 1rem 2rem 0; }
  .dh-hero__orbit { width: 5.8rem; min-height: 5.3rem; padding: .6rem; font-size: .7rem; }
  .dh-hero__orbit--two { top: 40%; right: 0; }
  .dh-hero__status { left: .4rem; bottom: 0; }
  .dh-subnav { top: var(--header-height); }
  .dh-role-panels { min-height: 0; }
  .dh-role-facts { grid-template-columns: 1fr; }
  .dh-context-grid, .dh-evidence-grid { grid-template-columns: 1fr; }
  .dh-change-list { grid-template-columns: 1fr; }
  .dh-change-photo { min-height: 27rem; }
  .dh-evidence-card__visual { flex-wrap: wrap; }
}

@media (max-width: 35rem) {
  .dh-hero__actions { display: grid; }
  .dh-hero__actions .btn { width: 100%; }
  .dh-hero__signals { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .dh-hero__signals span { justify-content: center; text-align: center; }
  .dh-role-tabs { grid-template-columns: 1fr 1fr; }
  .dh-role-tab { min-height: 6.2rem; padding: .75rem; }
  .dh-role-tab small { display: none; }
  .dh-engineering__tabs { display: flex; overflow-x: auto; scrollbar-width: none; }
  .dh-engineering__tabs::-webkit-scrollbar { display: none; }
  .dh-engineering__tabs button { flex: 0 0 12.5rem; }
  .dh-engineering__visual--path { grid-template-columns: 1fr; }
  .dh-engineering__visual--path i { width: 2px; height: 2.5rem; justify-self: center; }
  .dh-engineering__visual--steps { grid-template-columns: 1fr; }
  .dh-engineering__visual--steps span:nth-child(2), .dh-engineering__visual--steps span:nth-child(3) { transform: none; }
  .dh-faq-item__body { padding-right: 0; }
  .dh-cta__actions { align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  .dh-context-card, .dh-role-tab, .dh-faq-item summary::after, .dh-subnav a::after { transition: none !important; }
}


/* Step 3A — clearer separation between engineering method and healthcare industry context */
.dh-responsibility-map {
  display: grid;
  gap: var(--grid-gap);
  margin-top: clamp(1.8rem,4vw,3rem);
  grid-template-columns: repeat(4,minmax(0,1fr));
  counter-reset: dh-step;
}
.dh-responsibility-step {
  position: relative;
  min-height: 15rem;
  padding: 1.35rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  background: linear-gradient(155deg,#fff,var(--color-surface-blue));
  box-shadow: var(--shadow-md);
}
.dh-responsibility-step::after {
  position: absolute;
  width: 1.4rem;
  height: 1px;
  right: calc(var(--grid-gap) * -.72);
  top: 50%;
  content: "";
  background: var(--color-brand-teal);
  opacity: .45;
}
.dh-responsibility-step:last-child::after { display: none; }
.dh-responsibility-step > span {
  display: grid;
  width: 2.2rem;
  height: 2.2rem;
  place-items: center;
  border-radius: 50%;
  color: var(--color-brand-blue-800);
  background: var(--color-surface-blue);
  font-size: .72rem;
  font-weight: 800;
}
.dh-responsibility-step .icon { width: 1.75rem; height: 1.75rem; margin-top: 1.35rem; color: var(--color-brand-teal); }
.dh-responsibility-step h3 { margin-top: .75rem; font-size: 1.12rem; }
.dh-responsibility-step p { margin-top: .55rem; color: var(--color-muted); font-size: .88rem; }
.dh-boundary--wide { max-width: 62rem; margin-top: 1.35rem; }
.dh-control-list { display: grid; padding: 0; margin: 1.5rem 0 0; gap: .7rem; list-style: none; grid-template-columns: repeat(2,minmax(0,1fr)); }
.dh-control-list li { padding: 1rem; border: 1px solid var(--color-border); border-radius: 1rem; background: #fff; }
.dh-control-list strong { display: block; color: var(--color-navy-950); }
.dh-control-list span { display: block; margin-top: .25rem; color: var(--color-muted); font-size: .82rem; }
.dh-evidence-grid--single { max-width: 68rem; margin-inline: auto; grid-template-columns: 1fr; }
.dh-evidence-grid--single .dh-evidence-card { grid-template-columns: minmax(18rem,.82fr) minmax(0,1.18fr); }
.dh-secondary-proof { max-width: 68rem; margin: 1.1rem auto 0; color: rgba(255,255,255,.72); font-size: .9rem; text-align: center; }
.dh-secondary-proof a { color: var(--dh-cyan); font-weight: 800; }

@media (max-width: 70rem) {
  .dh-responsibility-map { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .dh-responsibility-step:nth-child(2)::after { display: none; }
}
@media (max-width: 63.99rem) {
  .dh-evidence-grid--single .dh-evidence-card { grid-template-columns: 1fr; }
}
@media (max-width: 47.99rem) {
  .dh-responsibility-map, .dh-control-list { grid-template-columns: 1fr; }
  .dh-responsibility-step { min-height: 0; }
  .dh-responsibility-step::after { display: none; }
  .dh-engineering__tabs { display: flex; overflow-x: auto; scrollbar-width: none; }
  .dh-engineering__tabs::-webkit-scrollbar { display: none; }
  .dh-engineering__tabs button { flex: 0 0 13.5rem; }
}

@media (max-width: 47.99rem) {
  .dh-hero__mesh {
    width: 28rem;
    height: 28rem;
    right: 0;
    top: -10rem;
  }
}

.dh-controlled-change { margin-top: 1.7rem; padding: 1.25rem; border: 1px solid rgba(35,131,197,.18); border-radius: var(--radius-xl); background: linear-gradient(145deg,var(--color-surface-blue),#fff); }
.dh-controlled-change .eyebrow { margin: 0; }
.dh-controlled-change h3 { margin-top: .45rem; font-size: clamp(1.35rem,2.3vw,2rem); }
.dh-controlled-change > p:not(.eyebrow) { margin-top: .75rem; color: var(--color-muted); font-size: .9rem; }
.dh-controlled-change ol { display: grid; padding: 0; margin: 1rem 0 0; gap: .55rem; list-style: none; grid-template-columns: repeat(4,minmax(0,1fr)); }
.dh-controlled-change li { display: grid; min-height: 5.5rem; padding: .8rem; gap: .4rem; align-content: start; border: 1px solid var(--color-border); border-radius: .85rem; background: #fff; }
.dh-controlled-change li span { color: var(--color-brand-teal); font-size: .68rem; font-weight: 900; }
.dh-controlled-change li strong { color: var(--color-navy-950); font-size: .78rem; line-height: 1.35; }
@media (max-width: 47.99rem) { .dh-controlled-change ol { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 30rem) { .dh-controlled-change ol { grid-template-columns: 1fr; } }