.dit-hero { background: linear-gradient(120deg, rgba(2,5,9,.99), rgba(3,9,12,.95) 55%, rgba(9,22,20,.9)), url("../images/textures/defence-camouflage.png"); background-size:auto,22rem auto; min-height:32rem; overflow:hidden; padding-block:calc(var(--header-height) + clamp(2rem,3vw,3rem)) var(--space-8); position:relative; }
.dit-hero::before { background:radial-gradient(circle at 75% 50%,rgba(88,187,212,.13),transparent 24rem); content:""; inset:0; position:absolute; }
.dit-hero__inner { align-items:center; display:grid; gap:clamp(2rem,5vw,5rem); grid-template-columns:minmax(0,.9fr) minmax(31rem,1fr); position:relative; }
.dit-hero__copy { --flow-space:var(--space-5); position:relative; z-index:2; }
.page-breadcrumb { align-items:center; color:var(--color-text-faint); display:flex; flex-wrap:wrap; font-family:var(--font-mono); font-size:.68rem; gap:var(--space-3); letter-spacing:.12em; text-transform:uppercase; }
.page-breadcrumb a { color:var(--color-tech); }
.dit-hero h1 { font-size:clamp(2.5rem,4.2vw,4.5rem); max-width:13ch; text-transform:uppercase; }
.dit-hero h1 span { color:var(--color-accent); display:block; }
.dit-hero__copy .lede { max-width:40rem; }
.dit-hero__tags { display:flex; flex-wrap:wrap; gap:var(--space-2); }
.dit-hero__tags span { border:1px solid var(--color-border); color:var(--color-tech); font-family:var(--font-mono); font-size:.62rem; letter-spacing:.1em; padding:var(--space-2) var(--space-3); text-transform:uppercase; }
.topology { max-width:39rem; position:relative; width:100%; }
.topology svg { filter:drop-shadow(0 0 1rem rgba(88,187,212,.13)); width:100%; }
.topology__link { animation:topology-flow 2s linear infinite; fill:none; stroke:rgba(88,187,212,.55); stroke-dasharray:6 7; stroke-width:1.5; }
.topology__link--secondary { opacity:.35; stroke:var(--color-accent); }
.topology__node rect { fill:rgba(3,9,13,.92); stroke:rgba(88,187,212,.4); }
.topology__node text { fill:var(--color-text-faint); font-family:var(--font-mono); font-size:10px; letter-spacing:1px; text-anchor:middle; }
.topology__node text:last-child { fill:var(--color-tech); font-size:9px; }
.topology__node--core rect { fill:rgba(8,22,25,.96); stroke:var(--color-accent); }
.topology__node--core text:first-of-type { fill:var(--color-text); font-size:11px; }
.topology__status { background:rgba(3,9,13,.94); border-left:2px solid var(--color-tech); bottom:2%; display:grid; gap:.2rem; padding:var(--space-3) var(--space-5); position:absolute; right:2%; }
.topology__status span { color:var(--color-text-faint); font-family:var(--font-mono); font-size:.58rem; letter-spacing:.12em; text-transform:uppercase; }
.topology__status strong { color:var(--color-success); font-family:var(--font-display); }

.dit-overview,.dit-capabilities,.dit-usecases,.dit-cta { background:var(--color-bg-deep); }
.dit-architecture { background:linear-gradient(180deg,#08110f,var(--color-bg-deep)); }
.dit-overview::before,.dit-capabilities::before,.dit-architecture::before,.dit-usecases::before,.dit-cta::before { background:linear-gradient(90deg,transparent,rgba(88,187,212,.48),rgba(197,154,61,.3),transparent); content:""; height:1px; left:var(--gutter); position:absolute; right:var(--gutter); top:0; }
.dit-overview.section,.dit-capabilities.section,.dit-architecture.section,.dit-usecases.section { padding-block:clamp(3.5rem,5vw,5rem); }
.dit-overview__grid,.dit-architecture__grid { display:grid; gap:clamp(3rem,8vw,8rem); grid-template-columns:minmax(0,.85fr) minmax(25rem,1fr); }
.dit-overview h2,.dit-heading h2,.dit-architecture h2 { font-size:clamp(2rem,3.3vw,3.5rem); }
.dit-overview__copy { --flow-space:var(--space-4); color:var(--color-text-muted); font-size:var(--font-size-md); }
.dit-heading { align-items:end; display:grid; gap:var(--space-10); grid-template-columns:minmax(0,1fr) minmax(20rem,.65fr); margin-bottom:clamp(2.5rem,5vw,4rem); }
.dit-heading .flow { --flow-space:var(--space-5); }
.dit-heading .lede { justify-self:end; }

.dit-capability-grid { display:grid; gap:1px; grid-template-columns:repeat(3,minmax(0,1fr)); }
.dit-capability { background:linear-gradient(145deg,rgba(16,26,25,.96),rgba(4,10,15,.98)); border:1px solid var(--color-border); min-height:19rem; padding:clamp(1.5rem,3vw,2.5rem); position:relative; }
.dit-capability::after { background:var(--gradient-tech); bottom:0; content:""; height:2px; left:0; position:absolute; transform:scaleX(.2); transform-origin:left; transition:transform var(--duration-base); width:100%; }
.dit-capability:hover::after { transform:scaleX(1); }
.dit-capability > div { align-items:center; display:flex; justify-content:space-between; }
.dit-capability > div span { color:var(--color-tech); font-family:var(--font-mono); font-size:var(--font-size-xs); }
.dit-capability i { align-items:center; border:1px solid var(--color-border-strong); color:var(--color-accent); display:flex; font-style:normal; height:3rem; justify-content:center; width:3rem; }
.dit-capability h3 { font-size:clamp(1.35rem,2vw,1.8rem); margin-top:var(--space-10); text-transform:uppercase; }
.dit-capability p { color:var(--color-text-muted); font-size:var(--font-size-sm); line-height:1.65; margin-top:var(--space-4); }

.dit-architecture__grid { align-items:center; }
.dit-architecture__grid > .flow { --flow-space:var(--space-5); }
.architecture-stack { display:grid; gap:var(--space-2); list-style:none; }
.architecture-stack li { align-items:center; background:rgba(5,13,17,.88); border:1px solid var(--color-border); display:flex; min-height:3.7rem; padding:var(--space-3) var(--space-5); }
.architecture-stack li:first-child { border-color:var(--color-accent); margin-inline:10%; }
.architecture-stack li:nth-child(2) { margin-inline:8%; }.architecture-stack li:nth-child(3){margin-inline:6%;}.architecture-stack li:nth-child(4){margin-inline:4%;}
.architecture-stack span { color:var(--color-tech); font-family:var(--font-mono); font-size:var(--font-size-xs); margin-right:var(--space-5); }
.architecture-stack strong { color:var(--color-text); font-family:var(--font-display); font-size:var(--font-size-sm); text-transform:uppercase; }
.usecase-rail { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); }
.usecase-rail span { align-items:center; border-left:1px solid var(--color-border); color:var(--color-text); display:flex; font-family:var(--font-display); font-size:var(--font-size-sm); min-height:8rem; padding:var(--space-5); text-transform:uppercase; }
.usecase-rail span:last-child { border-right:1px solid var(--color-border); }
.usecase-rail span::before { color:var(--color-accent); content:"+"; margin-right:var(--space-3); }
.dit-cta { padding-block:clamp(3rem,5vw,4.5rem); position:relative; }
.dit-cta__panel { align-items:end; background:rgba(11,22,34,.72); border:1px solid var(--color-border-strong); box-shadow:var(--glow-tech); display:grid; gap:var(--space-10); grid-template-columns:minmax(0,1fr) auto; padding:clamp(2rem,5vw,4rem); }
.dit-cta__panel .flow { --flow-space:var(--space-5); }.dit-cta__panel h2{font-size:clamp(2rem,4vw,4rem);}
@keyframes topology-flow { to { stroke-dashoffset:-30; } }

@media(max-width:63.99rem){.dit-hero__inner{grid-template-columns:minmax(0,.9fr) minmax(25rem,1fr)}.dit-overview__grid,.dit-architecture__grid{grid-template-columns:1fr}.dit-heading{grid-template-columns:1fr}.dit-heading .lede{justify-self:start}.dit-capability-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.usecase-rail{grid-template-columns:repeat(3,minmax(0,1fr))}.usecase-rail span{border-bottom:1px solid var(--color-border)}}
@media(max-width:47.99rem){.dit-hero{min-height:auto;padding-top:calc(var(--header-height) + var(--space-10))}.dit-hero__inner{grid-template-columns:1fr}.dit-hero h1{font-size:clamp(2.35rem,11vw,3.5rem)}.dit-capability-grid{grid-template-columns:1fr}.dit-capability{min-height:0}.usecase-rail{grid-template-columns:1fr}.usecase-rail span{border-right:1px solid var(--color-border);min-height:5rem}.dit-cta__panel{align-items:start;grid-template-columns:1fr;padding:var(--space-6)}.dit-cta__panel .button{width:100%}}
@media(prefers-reduced-motion:reduce){.topology__link{animation:none}}
