/* 3D enhancement, isolated from the institute's content and existing palette. */
.hero-video { filter:none; }
.hero-out-of-view .depth-scene * { animation-play-state:paused!important; }
.hero .hero-actions { flex-wrap:wrap; gap:1.25rem 1.5rem; padding-bottom:12px; max-width:62%; }
.hero .hero-button {
  --button-edge:#a4440a;
  --button-glow:#f5822033;
  position:relative; display:inline-flex; align-items:center; justify-content:center;
  gap:clamp(.75rem,1.4vw,1.25rem); min-height:56px; padding:16px clamp(18px,1.8vw,26px);
  border:1px solid transparent; border-radius:6px; color:#fff;
  background:var(--orange);
  box-shadow:0 6px 0 var(--button-edge),0 14px 24px #0003;
  font-size:.78rem; line-height:1.4; text-transform:uppercase; letter-spacing:.09em; font-weight:800;
  text-shadow:none; transform:translateY(0);
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;
}
.hero .hero-button-secondary {
  background:transparent; border:0; border-bottom:1px solid #ffffff66;
  border-radius:0; box-shadow:none; padding-inline:0;
}
.hero .hero-button>span { display:inline-grid; place-items:center; background:transparent; box-shadow:none; }
@media(hover:hover) and (pointer:fine) {
  .hero .hero-button-primary:hover { transform:translateY(-3px); background:#ff912d; box-shadow:0 9px 0 var(--button-edge),0 18px 28px #0004; }
  .hero .hero-button-secondary:hover { border-bottom-color:var(--orange); color:#ffb36d; }
}
.hero .hero-button:focus-visible { outline:3px solid #fff; outline-offset:6px; }
.hero .hero-button-primary:active { transform:translateY(4px); box-shadow:0 2px 0 var(--button-edge),0 5px 12px #0003; }
@media(max-width:900px) { .hero .hero-actions { max-width:100%; } }
@media(max-width:620px) { .hero .hero-actions { gap:1.15rem .875rem; }.hero .hero-button { font-size:.72rem; padding:14px 17px; min-height:52px; } }
@media(prefers-reduced-motion:reduce) { .hero .hero-button { transition:none; }.hero .hero-button:hover,.hero .hero-button:active { transform:none; } }
.motion-paused .hero .hero-button { transition:none; transform:none; }
.hero { isolation:isolate; background:var(--navy) url('stti-hero.png') center/cover no-repeat; }
.hero-overlay { z-index:1; }
.hero-content { z-index:3; }
.hero h1 { max-width:62%; font-family:Oswald,Impact,sans-serif; font-weight:700; font-size:clamp(3.2rem,min(6.2vw,10vh),6.6rem); line-height:.98; text-shadow:0 2px 0 #aebcd0,0 4px 0 #526789,0 6px 0 #172d4f,0 12px 20px #0006; }
.hero h1 span { color:var(--orange); text-shadow:0 2px 0 #d5650d,0 4px 0 #a94605,0 6px 0 #753105,0 12px 20px #0006; }
.site-header { background:#fff; box-shadow:0 1px 0 #06183814; }
.navbar .brand strong { font-family:Manrope,system-ui,sans-serif; font-weight:800; letter-spacing:.12em; text-shadow:0 2px 0 #dce3ed; }
.navbar .brand small { font-family:Manrope,system-ui,sans-serif; font-weight:800; }
.navbar .nav-links { font-family:Manrope,system-ui,sans-serif; font-weight:700; font-size:.86rem; letter-spacing:.05em; }
.navbar .button { background:var(--orange); border-color:transparent; border-radius:6px; font-weight:800; box-shadow:0 6px 0 #ac490b,0 14px 24px #0003; transition:transform .18s,box-shadow .18s,background .18s; }
@media(hover:hover) and (pointer:fine) { .navbar .button:hover { background:#ff912d; transform:translateY(-3px); box-shadow:0 9px 0 #ac490b,0 18px 28px #0004; } }
.navbar .button:active { transform:translateY(4px); box-shadow:0 2px 0 #ac490b,0 5px 12px #0003; }
@media(prefers-reduced-motion:reduce) { .navbar .button { transition:none; }.navbar .button:hover,.navbar .button:active { transform:none; } }
.motion-paused .navbar .button { transition:none; transform:none; }
.hero-copy { max-width:min(54%,575px); }
.hero-depth { position:absolute; z-index:2; right:4.5%; top:50%; width:clamp(240px,29vw,420px); aspect-ratio:1; transform:translateY(-50%); perspective:1000px; pointer-events:none; }
.depth-scene { position:relative; width:100%; height:100%; transform-style:flat; transform:rotateX(calc(-7deg + var(--scene-x,0deg))) rotateY(calc(-14deg + var(--scene-y,0deg))); transition:transform .25s ease-out; }
.depth-halo { position:absolute; inset:-17%; border-radius:50%; background:radial-gradient(ellipse,rgba(10,91,197,.55),rgba(10,91,197,.12) 43%,transparent 68%); transform:none; z-index:0; }
/* Float the complete logo as one surface: no crossing 3D planes. */
.medallion-float { position:absolute; inset:18%; z-index:2; animation:medallion-float 7s ease-in-out infinite; will-change:transform; }
.depth-medallion { position:absolute; inset:0; transform:rotateY(-7deg) rotateZ(-3deg); transform-style:flat; backface-visibility:hidden; }
.medallion-back,.medallion-face { position:absolute; inset:0; border-radius:50%; }
.medallion-back { background:linear-gradient(145deg,#fba54f,#b8520c 45%,#071a3d 85%); box-shadow:0 8px 0 #b75d17,0 15px 0 #172c50,0 32px 50px #0008; transform:translate(7px,12px); }
.medallion-face { background:#fff; border:clamp(4px,.7vw,9px) solid #fff; box-shadow:inset 0 0 20px #0a5bc522,0 0 0 2px #f5822099,0 0 40px #0a5bc533; transform:none; backface-visibility:hidden; }
.medallion-face img { width:100%; height:100%; object-fit:contain; border-radius:50%; }
.depth-orbit { z-index:1; position:absolute; inset:3%; border:1px solid #a3c6fa66; border-radius:50%; transform-style:preserve-3d; }
.orbit-one { transform:rotateX(62deg) rotateZ(-25deg); box-shadow:0 0 14px #78aaff22,inset 0 0 14px #78aaff22; }
.orbit-two { inset:0; transform:rotateY(62deg) rotateZ(28deg); border-color:#f5822077; }
.depth-orbit::after { content:''; position:absolute; inset:-2px; border-radius:50%; border:3px solid transparent; border-top-color:var(--orange); animation:orbit-spin 18s linear infinite; }
.orbit-two::after { border-top-color:#5ba6ff; animation-direction:reverse; animation-duration:24s; }
.depth-satellite { z-index:3; position:absolute; display:grid; place-items:center; width:20%; aspect-ratio:1; border-radius:22%; border:1px solid #98b6e899; background:linear-gradient(145deg,#285285,#0b2349 60%); box-shadow:6px 8px 0 #03132c,10px 20px 30px #0006,inset 1px 1px 1px #d3e5ff66; color:white; font-weight:800; font-size:clamp(20px,2.6vw,36px); animation:satellite-float 6s ease-in-out infinite; }
.depth-satellite span { text-shadow:0 3px 1px #0005; }
.depth-satellite svg { width:55%; }
.satellite-code { left:0; top:7%; color:#ffb471; --rest-rotate:-12deg; --lift:55px; }
.satellite-network { right:-2%; top:18%; --rest-rotate:14deg; --lift:80px; animation-delay:-2s; }
.satellite-chip { right:11%; bottom:0; --rest-rotate:-9deg; --lift:100px; animation-delay:-4s; color:var(--navy); background:linear-gradient(135deg,#ffc078,#f58220 62%,#c3590a); border-color:#ffcd94; box-shadow:6px 8px 0 #9d470b,10px 20px 30px #0006; }
.depth-spark { position:absolute; width:3%; aspect-ratio:1; background:#fba45a; border-radius:3px; box-shadow:0 0 22px #f58220; transform:rotate(35deg); }
.spark-one { left:13%; bottom:17%; }.spark-two { top:0; right:32%; width:2%; background:#81b9ff; box-shadow:0 0 22px #0a5bc5; }
.hero-controls { position:absolute; z-index:4; right:clamp(1rem,3vw,2.5rem); bottom:clamp(1rem,3vh,2rem); display:flex; gap:10px; }
.hero-controls .video-toggle { position:static; }
.motion-toggle { cursor:pointer; color:white; background:#03112888; backdrop-filter:blur(10px); border:1px solid #ffffff66; padding:10px 13px; font:800 .68rem Manrope,sans-serif; text-transform:uppercase; letter-spacing:.08em; }
.motion-toggle:hover { background:var(--orange); }
.feature-rail { gap:18px; border:0; perspective:1200px; }
.feature-card,.feature-card:first-child { border:1px solid var(--line); background:#fff; box-shadow:0 6px 0 #d8e1ef,0 20px 38px #071a3d0d; }
.program-grid { gap:18px; border:0; background:transparent; }
.program-card { border:1px solid #ffffff2e; border-radius:6px; background:linear-gradient(140deg,#17355f,#081c3e 65%); box-shadow:0 7px 0 #020d23,0 18px 35px #0003; }
.program-card.featured { background:linear-gradient(145deg,#ff9d47,#ed7410); }
.program-card::after,.feature-card::after { content:''; pointer-events:none; position:absolute; inset:0; border-radius:inherit; background:radial-gradient(circle at var(--shine-x,50%) var(--shine-y,30%),#ffffff1c,transparent 62%); opacity:0; transition:opacity .2s; }
.program-card:hover::after,.feature-card:hover::after { opacity:1; }
.feature-card { position:relative; transform-style:preserve-3d; transition:transform .2s,box-shadow .2s; }
.tilt-anchor { min-width:0; perspective:1000px; }
.program-grid>.tilt-anchor>article,.feature-rail>.tilt-anchor>article { height:100%; }
.tilt-anchor:hover { position:relative; z-index:2; }
.program-card h3,.feature-card h3 { transform:translateZ(22px); }
.program-icon { transform:translateZ(34px); }
.video-card>div { position:relative; padding:20px 25px; background:var(--navy); }
.video-grid { align-items:start; grid-template-rows:auto auto; }
.video-card video { height:auto; min-height:0; aspect-ratio:16/9; }
.video-card-large video { min-height:0; aspect-ratio:4/5; }
.training-visual .badge { position:relative; margin-left:auto; width:auto; height:auto; padding:18px 26px; }
.training-visual { aspect-ratio:auto; max-height:none; overflow:visible; }
.training-visual img { height:auto; }
.motion-paused .depth-scene * { animation-play-state:paused!important; }
.motion-paused [data-tilt],.motion-paused .depth-scene { transform:none!important; }
.motion-paused .reveal { opacity:1; transform:none; transition:none; }
:focus-visible { outline:3px solid #559cff; outline-offset:5px; }
@keyframes medallion-float { 0%,100% { transform:translate3d(0,0,0); } 50% { transform:translate3d(0,-16px,0); } }
@keyframes satellite-float { 0%,100% { transform:translateY(0) translateZ(var(--lift)) rotate(var(--rest-rotate)); } 50% { transform:translateY(-15px) translateZ(var(--lift)) rotate(calc(var(--rest-rotate) + 6deg)); } }
@keyframes orbit-spin { to { transform:rotate(360deg); } }
@media(max-width:1100px) and (min-width:901px) { .hero h1 { font-size:clamp(3rem,6vw,4.5rem); }.hero-depth { right:4%; width:28vw; } }
@media(max-width:900px) { .hero { flex-direction:column; justify-content:center; gap:2rem; padding:2.5rem 0 5rem; }.hero h1 { max-width:100%; font-size:clamp(3rem,8vw,5rem); }.hero-copy { max-width:580px; }.hero-depth { position:relative; order:2; top:auto; right:auto; transform:none; width:clamp(180px,32vw,280px); }.hero-content { order:1; }.feature-rail { gap:18px; }.video-card-large video { aspect-ratio:16/9; }.video-toggle b { display:inline; }.hero-controls { bottom:18px; }.depth-satellite { font-size:24px; } }
@media(max-width:620px) { .hero h1 { font-size:clamp(2.7rem,11.5vw,3.8rem); }.hero .eyebrow { font-size:.64rem; }.hero-copy { max-width:100%; }.hero-actions { flex-direction:row; flex-wrap:wrap; align-items:center; gap:12px 20px; }.hero-depth { width:180px; }.hero { gap:1.5rem; }.feature-rail { gap:16px; }.video-card video { aspect-ratio:16/9; min-height:0; }.depth-satellite { font-size:20px; } }
@media(prefers-reduced-motion:reduce) { .depth-scene * { animation:none!important; }.depth-scene { transition:none; transform:none; }.motion-toggle { display:none; }.hero-depth { perspective:none; } }

/* Course photography is local, deferred and sized before it loads. */
.program-card { padding:0 0 28px; will-change:auto; }
.program-image { display:block; width:100%; aspect-ratio:16/9; height:auto; object-fit:cover; border-radius:5px 5px 0 0; margin-bottom:24px; }
.program-card>span { display:block; margin:0 28px; }
.program-card .program-icon { top:auto; right:28px; margin-top:-26px; }
.program-card h3 { margin:28px 28px 10px; transform:none; }
.program-card p { margin-inline:28px; }
/* Bright feature section with compact, locally stored photography. */
.intro { position:relative; color:var(--ink); background:#fff; border-block:1px solid #dce3ed; }
.intro::before { content:''; position:absolute; top:0; left:0; width:24%; height:3px; background:var(--orange); }
.intro .section-title { color:var(--navy); }
.intro .eyebrow.dark { color:#b64d08; }
.intro .intro-copy { color:#59667b; }
.intro .arrow-link { color:var(--navy); border-color:#aab2bf; }
.intro .feature-card { padding:0 0 30px; background:#fff; border:1px solid #dce3ed; border-radius:6px; box-shadow:0 6px 0 #d8e1ef,0 20px 38px #071a3d0d; }
.feature-image { display:block; width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; border-radius:5px 5px 0 0; margin-bottom:26px; }
.intro .feature-card>span { display:block; margin-inline:28px; color:#b64d08; }
.intro .feature-card h3 { color:var(--navy); margin:20px 28px 8px; transform:none; }
.intro .feature-card p { color:#59667b; margin-inline:28px; }
@media(prefers-reduced-motion:reduce) { .medallion-float { animation:none; will-change:auto; } }