/* Centred vertical hero + original dimensional evidence engine. */
.hero { background: radial-gradient(ellipse at 50% 65%,#0d527b35,transparent 48%),linear-gradient(135deg,#0a1b2d,#061423); }
.hero::before { opacity: .27; }
.hero .hero-grid { max-width: 1200px; width: calc(100% - 96px); display: flex; flex-direction: column; align-items: center; gap: 30px; padding-block: 138px 30px; min-height: auto; }
.hero-copy { text-align: center; max-width: 950px; min-width: 0; }
.desktop-break { display: none; }
.hero .eyebrow { max-width: 100%; border: 1px solid #6aaee91a; border-radius: 99px; background: #06121ed9; padding: 7px 17px; font-size: .75rem; letter-spacing: .06em; margin-bottom: 23px; }
.hero .eyebrow-line { width: 22px; flex-shrink: 0; }
.hero #hero-heading { font-size: clamp(3rem,6.2vw,5.5rem); font-weight: 500; letter-spacing: -.06em; line-height: 1.04; }
.hero h1 > span,.hero h1 > em { display: block; }
.hero h1 > em { margin-top: 0; font-style: normal; padding-bottom: .06em; }
.interactive-ready .hero-description,.hero-description { margin: 20px auto 0; max-width: 38rem; font-size: 1.0625rem; line-height: 1.65; color: #adc4d8; }
.hero-actions { justify-content: center; margin-top: 28px; gap: 12px; }
.hero-actions .button { min-height: 52px; padding-inline: 24px; }
.hero .stage-note { justify-content: center; margin-top: 18px; }
.hero-diagram { max-width: 1000px; margin: 0; min-width: 0; align-self: center; container-type: inline-size; container-name: evidence; }
.trust-canvas { width: 100%; height: 100%; left: 0; top: 0; mask-image: radial-gradient(ellipse at 50% 45%,#000 36%,#000d 66%,transparent 98%),linear-gradient(transparent,#000 10%,#000 86%,transparent); -webkit-mask-image: radial-gradient(ellipse at 50% 45%,#000 36%,#000d 66%,transparent 98%),linear-gradient(transparent,#000 10%,#000 86%,transparent); mask-composite: intersect; -webkit-mask-composite: source-in; }
.diagram-caption { padding: 0; justify-content: center; }
.diagram-caption .micro-label { color: #80badb; font-size: .75rem; letter-spacing: .12em; }
.network { height: 34rem; width: 100%; max-width: none; }
.network-core { top: 49%; width: 10rem; height: 10rem; background: #0a1b2d; border-color: #b5e8ffab; box-shadow: 0 0 0 11px #8ed8ff09,0 0 0 27px #8ed8ff04,0 0 75px #139ddd66,inset 0 1px 0 #d0eeff66; }
.network-core::after { inset: -13px; border-style: solid; border-color: #8ac9f038; border-top-color: #a2e3ff; border-bottom-color: #e8b54c99; animation-duration: 26s; }
.network-core::before { content: ''; position: absolute; inset: -35px; border-radius: 50%; border: 1px dashed #82d0ff29; pointer-events: none; }
.network-core > span { font-size: 1.5rem; }
.network-core small { font-size: .75rem; }
.source-university { left: 20%; top: 15%; }
.source-employer { left: 80%; top: 26%; }
.source-register { left: 57%; top: 90%; }
.interactive-ready .source-node { width: 12rem; padding: 15px 16px; border-radius: 16px; background: linear-gradient(135deg,#163a51e8,#081b2fed); border-color: #77b1d35c; box-shadow: inset 0 1px 0 #d0eeff26,0 18px 35px #000a1838; backdrop-filter: blur(18px); }
.interactive-ready .source-register { width: 14rem !important; }
.source-node > span { font-size: .875rem; }
.source-node small { color: #aac4d8; font-size: .75rem; }
.source-icon { background: #a3dfff; box-shadow: 0 0 18px #6accff18; }
.interactive-ready .source-node:hover { transform: translate(-50%,-50%); border-color: #b2e4ff; box-shadow: inset 0 1px 0 #d0eeff26,0 0 28px #7fb4e023; }
.interactive-ready .source-node[aria-pressed=true] { border-color: #e8b54c; background: linear-gradient(135deg,#234255,#102636); box-shadow: inset 0 1px 0 #ffe6a822,0 0 28px #e8b54c25; }
.interactive-ready .source-node[aria-pressed=true] .source-icon { background: #f5d68c; }
.interactive-ready .diagram-foot { margin: 12px auto 0; max-width: 34rem; min-height: 4.5rem; padding: 14px 18px; border: 1px solid #70b9e026; border-radius: 18px; background: #091f3199; display: flex; align-items: center; justify-content: center; line-height: 1.55; color: #b8d4e8; font-size: .8125rem; }
.hero-bottom { max-width: 1200px; width: calc(100% - 96px); border-top: 1px solid #80bfe31b; justify-content: center; padding-block: 20px 26px; font-size: .75rem; letter-spacing: .08em; }
.hero-bottom > span + span { border-left: 1px solid #638eab44; }
.journey-link { font-size: clamp(1.3rem,2.6vw,2.3rem); }
@media (max-width:1100px) {
  .hero .hero-grid { width: calc(100% - 72px); padding-block: 138px 30px; gap: 30px; }
  .hero-copy { text-align: center; max-width: 850px; margin-inline: auto; }
  .desktop-break { display: none; }
  .hero #hero-heading { font-size: clamp(3rem,6.2vw,5.5rem); line-height: 1.04; }
  .hero .eyebrow { margin-bottom: 22px; }
  .interactive-ready .hero-description,.hero-description { margin-inline: auto; max-width: 38rem; }
  .hero-actions,.hero .stage-note { justify-content: center; }
  .hero-diagram { max-width: 760px; margin-inline: auto; }
  .hero-bottom { width: calc(100% - 72px); }
}
@container evidence (max-width:30rem) {
  .network { height: 34rem; }
  .network-core { top: 25%; width: 9rem; height: 9rem; }
  .interactive-ready .source-node,.interactive-ready .source-register { left: 50%; width: min(18rem,95%) !important; padding: 14px 19px; }
  .source-university { top: 55%; }
  .source-employer { top: 73%; }
  .source-register { top: 91%; }
}
@media (max-width:760px) {
  .hero .hero-grid { width: calc(100% - 44px); padding-block: 125px 28px; gap: 32px; }
  .hero #hero-heading { font-size: clamp(2rem,8.4vw,3.75rem); letter-spacing: -.06em; line-height: 1.1; }
  .hero .eyebrow { font-size: .75rem; letter-spacing: 0; gap: 7px; padding-inline: 12px; }
  .hero-description,.interactive-ready .hero-description { max-width: 32rem; font-size: 1rem; }
  .hero-actions .button { padding-inline: 18px; min-height: 48px; }
  .hero-diagram { margin-top: 0; }
  .diagram-caption .micro-label { font-size: .75rem; }
  .trust-canvas { mask-image: radial-gradient(ellipse at 50% 35%,#000 35%,#000d 70%,transparent 99%),linear-gradient(transparent,#000 10%,#000 90%,transparent); -webkit-mask-image: radial-gradient(ellipse at 50% 35%,#000 35%,#000d 70%,transparent 99%),linear-gradient(transparent,#000 10%,#000 90%,transparent); }
  .interactive-ready .diagram-foot { margin-top: 20px; min-height: 4.75rem; padding: 12px 16px; font-size: .8125rem; }
  .hero-bottom { width: calc(100% - 44px); justify-content: center; font-size: .75rem; }
  .hero-bottom > span + span { border: 0; }
  .journey-link { font-size: 1.7rem; }
  .journey-tab { min-width: 0; white-space: normal; text-align: center; }
}
@media (max-width:360px) { .hero .hero-grid,.hero-bottom { width: calc(100% - 32px); } }