/* Flight Deck layer: avionics-inspired typography, HUD altimeter, horizon, runway and brief player.
   Loaded last so it can refine earlier layers without rewriting them. */
:root{
  --fd-display:"Archivo",Manrope,Arial,sans-serif;
  --fd-mono:"DM Mono",ui-monospace,monospace;
  --fd-hud:#cfe88f;
  --fd-hud-dim:#cfe88f66;
  --fd-ease:cubic-bezier(.2,.8,.2,1);
  --fd-em:var(--cyan);
  --fd-z-hud:14;
  --fd-z-dialog:40;
}
html[data-theme=night]{--fd-hud:#d2e3a6;--fd-hud-dim:#d2e3a659}

/* ---------- Typography: livery-style display face, outline-to-fill accents ---------- */
.hero h1,.manifest h2,.section-head h2,.languages h2,.finale h2,.pillars h3,.credential h3,.log-content h3,.id-card strong{font-family:var(--fd-display);font-stretch:100%}
.hero h1{font-size:clamp(50px,5.25vw,80px);font-weight:780;font-stretch:88%;letter-spacing:-.035em;line-height:1}
.manifest h2,.section-head h2,.languages h2,.finale h2{font-weight:720;letter-spacing:-.04em}
.hero h1 em,.section-head h2 em,.languages h2 em,.finale h2 em,.manifest h2 span{
  font-family:var(--fd-display);font-style:normal;font-weight:520;font-stretch:122%;letter-spacing:-.035em;
  color:transparent;-webkit-text-stroke:1.15px var(--fd-em);
  background:linear-gradient(90deg,var(--fd-em) 0 50%,transparent 50% 100%);background-size:200% 100%;background-position:var(--fd-fill,0%) 0;
  -webkit-background-clip:text;background-clip:text;padding-right:.04em;
}
.manifest h2 span,.trajectory .section-head h2 em,.credentials .section-head h2 em{--fd-em:#2f6582}
html[data-theme=night] :is(.manifest h2 span,.trajectory .section-head h2 em,.credentials .section-head h2 em){--fd-em:#9cc4dc}
.hero h1 em{--fd-em:#8fd8f0;font-weight:430;font-stretch:118%;-webkit-text-stroke-width:1.4px}
.pillars h3{font-weight:700;letter-spacing:-.03em}
.log-content h3{font-weight:680;letter-spacing:-.02em}
.eyebrow,.coordinate,.fd-hud,.tenure-overview strong{font-variant-numeric:tabular-nums}
.fd-split-line{padding-bottom:.06em;margin-bottom:-.06em}

/* ---------- Skip link ---------- */
.fd-skip{position:fixed;z-index:60;left:16px;top:-60px;padding:12px 16px;background:var(--acid);color:#071015;font:500 11px var(--fd-mono);letter-spacing:.08em;text-transform:uppercase;border-radius:6px;transition:top .2s}
.fd-skip:focus{top:16px}
:focus-visible{outline:2px solid var(--fd-hud);outline-offset:3px}

/* ---------- HUD altimeter (desktop) ---------- */
.fd-hud{position:fixed;z-index:var(--fd-z-hud);right:max(14px,calc((100vw - 1240px)/2 - 92px));top:50%;transform:translateY(-50%);display:none;flex-direction:column;align-items:flex-end;gap:22px;color:var(--fd-hud);font-family:var(--fd-mono);pointer-events:none;mix-blend-mode:normal}
@media(min-width:1400px){.fd-hud{display:flex}.progress{display:none}}
.fd-alt{position:relative;width:66px;height:240px}
.fd-alt-window{position:absolute;inset:0;overflow:hidden;border-left:1px solid var(--fd-hud-dim);-webkit-mask:linear-gradient(transparent,#000 22%,#000 78%,transparent);mask:linear-gradient(transparent,#000 22%,#000 78%,transparent)}
.fd-alt-tape{position:absolute;left:0;right:0;top:50%;will-change:transform}
.fd-alt-tape i{position:absolute;left:0;height:1px;width:9px;background:var(--fd-hud-dim);font-style:normal}
.fd-alt-tape i.major{width:16px;background:var(--fd-hud)}
.fd-alt-tape i.major:after{content:attr(data-v);position:absolute;left:21px;top:-6px;font-size:9px;letter-spacing:.04em;color:var(--fd-hud);opacity:.75}
.fd-alt-box{position:absolute;left:-6px;top:50%;transform:translateY(-50%);display:grid;gap:1px;padding:7px 9px 6px;min-width:76px;background:#081217e6;border:1px solid var(--fd-hud);border-radius:3px;clip-path:polygon(8px 0,100% 0,100% 100%,8px 100%,0 50%)}
.fd-alt-box .fd-alt-label{font-size:7px;letter-spacing:.2em;opacity:.7;padding-left:6px}
.fd-alt-value{font:500 15px/1 var(--fd-mono);letter-spacing:.02em;padding-left:6px;color:#eef6d9}
.fd-alt-vs{font-size:7.5px;letter-spacing:.12em;opacity:.8;padding-left:6px}
.fd-alt-vs b{font-weight:500}
.fd-phases{list-style:none;margin:0;padding:0;display:grid;gap:3px;pointer-events:auto;text-align:right}
.fd-phases a{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:3px 0;color:var(--fd-hud);font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;opacity:.42;transition:opacity .25s,color .25s}
.fd-phases a:before{content:"";width:5px;height:5px;border:1px solid currentColor;transform:rotate(45deg);transition:background .25s,transform .35s var(--fd-ease)}
.fd-phases a span{max-width:0;overflow:hidden;white-space:nowrap;transition:max-width .4s var(--fd-ease)}
.fd-phases a:hover,.fd-phases a:focus-visible{opacity:.9}
.fd-phases a:hover span,.fd-phases a:focus-visible span,.fd-phases a[aria-current] span{max-width:120px}
.fd-phases a[aria-current]{opacity:1}
.fd-phases a[aria-current]:before{background:currentColor;transform:rotate(45deg) scale(1.25)}
/* On paper sections the phosphor HUD switches to an ink variant for contrast. */
html[data-theme=day] .fd-hud.on-paper{--fd-hud:#2f5d75;--fd-hud-dim:#2f5d7570}
html[data-theme=day] .fd-hud.on-paper .fd-alt-box{background:#f3f6f8ee}
html[data-theme=day] .fd-hud.on-paper .fd-alt-value{color:#11293a}

/* ---------- Hero: attitude indicator ---------- */
.hero-orbit{opacity:.35}
.fd-horizon{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden;-webkit-mask:radial-gradient(ellipse 60% 70% at 60.5% 50%,#000 25%,transparent 78%);mask:radial-gradient(ellipse 60% 70% at 60.5% 50%,#000 25%,transparent 78%)}
.fd-adi{position:absolute;left:60.5%;top:50%;width:min(1500px,140vw);height:auto;aspect-ratio:3/2;transform:translate(-50%,-50%);overflow:visible}
.fd-ladder{stroke:#8fd8f0;stroke-width:1.3;fill:none;opacity:.28;transform-box:view-box;transform-origin:0 0}
.fd-ladder text{fill:#8fd8f0;stroke:none;font:500 13px var(--fd-mono);letter-spacing:.06em}
.fd-ladder .fd-horizon-line{stroke:#cfe88f;stroke-width:1.6;opacity:.9}
.fd-ladder .fd-neg{stroke-dasharray:10 7}
.fd-waterline{stroke:#cfe88f;stroke-width:2.2;fill:none;opacity:.55}
.fd-waterline circle{fill:#cfe88f;stroke:none}

/* Portrait: scanline sweep + brief trigger */
.portrait-shell{isolation:isolate}
.portrait-shell:after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(180deg,transparent 0 46%,#cfe88f22 49%,#cfe88f55 50%,transparent 54%);background-size:100% 220%;background-position:0 -120%;mix-blend-mode:screen;opacity:0}
.fd-ready .portrait-shell:after{animation:fd-scan 1.6s .5s var(--fd-ease) both}
@keyframes fd-scan{0%{opacity:1;background-position:0 -120%}100%{opacity:0;background-position:0 120%}}
.fd-portrait-play{position:absolute;z-index:5;left:50%;bottom:16px;transform:translateX(-50%);display:inline-flex;align-items:center;gap:10px;padding:9px 14px 9px 10px;border:1px solid #ffffff40;border-radius:999px;background:#07101599;color:#eef3ec;font:500 10px var(--fd-mono);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;cursor:pointer;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:background .25s,border-color .25s,transform .25s var(--fd-ease)}
.fd-portrait-play b{font-weight:500;color:var(--fd-hud);margin-left:4px}
.fd-portrait-play:hover{background:#071015d9;border-color:var(--fd-hud);transform:translateX(-50%) translateY(-2px)}
.fd-portrait-play:active{transform:translateX(-50%) scale(.97)}
.fd-play{position:relative;display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--fd-hud);flex:none}
.fd-play:before{content:"";margin-left:2px;border-left:7px solid #071015;border-top:4.5px solid transparent;border-bottom:4.5px solid transparent}
.fd-play:after{content:"";position:absolute;inset:-4px;border-radius:50%;border:1px solid var(--fd-hud);opacity:.6;animation:fd-ping 2.4s var(--fd-ease) infinite}
@keyframes fd-ping{0%{transform:scale(.8);opacity:.7}80%,100%{transform:scale(1.45);opacity:0}}
.fd-brief-link{display:inline-flex;align-items:center;gap:12px;margin-top:22px;padding:6px 0;border:0;background:none;color:var(--ink);font:500 13px Manrope,Arial,sans-serif;cursor:pointer}
.fd-brief-link span:last-child{background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .35s var(--fd-ease)}
.fd-brief-link:hover span:last-child{background-size:100% 1px}

/* ---------- Spotlight surfaces (pointer-lit borders) ---------- */
.fd-spot{position:relative}
.fd-spot:after{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;padding:1px;background:radial-gradient(220px circle at var(--mx,50%) var(--my,50%),var(--fd-spot,#5aa7c9),transparent 70%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .3s}
.fd-spot:hover:after{opacity:1}
.pillars article.fd-spot{--fd-spot:var(--discipline-bright)}
.log-content.fd-spot{--fd-spot:var(--company-color)}
.credential.fd-spot{--fd-spot:var(--discipline-bright,#5aa7c9)}
.pillars article.fd-tilt,.credential.fd-tilt{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--lift,0px));transition:transform .5s var(--fd-ease),box-shadow .3s,background .3s}
.pillars article.fd-tilt:hover,.credential.fd-tilt:hover{--lift:-4px}

/* Timeline: aircraft glyph riding the progress line */
.timeline-line span{overflow:visible}
.timeline-line span:after{content:"";position:absolute;left:50%;bottom:-10px;width:22px;height:22px;transform:translateX(-50%) rotate(180deg);background:currentColor;color:#0066b3;-webkit-mask:var(--fd-plane) center/contain no-repeat;mask:var(--fd-plane) center/contain no-repeat;filter:drop-shadow(0 0 6px #0066b366)}
html[data-theme=night] .timeline-line span:after{color:#91c4ea}
:root{--fd-plane:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1.5c.9 0 1.5 1.1 1.5 2.4v5.3l8 4.6v2.3l-8-2.4v4.6l2.3 1.8v1.8L12 21l-3.8.9v-1.8l2.3-1.8v-4.6l-8 2.4v-2.3l8-4.6V3.9c0-1.3.6-2.4 1.5-2.4z'/%3E%3C/svg%3E")}

/* ---------- Finale: runway approach ---------- */
.finale-orb{display:none}
.fd-runway{position:absolute;inset:auto 0 0;height:78%;z-index:-1;perspective:700px;perspective-origin:50% 0%;pointer-events:none;overflow:hidden;-webkit-mask:linear-gradient(transparent 0,transparent 40%,#000 78%);mask:linear-gradient(transparent 0,transparent 40%,#000 78%)}
.fd-runway-plane{position:absolute;left:50%;bottom:-8%;width:min(520px,62vw);height:2600px;transform:translateX(-50%) rotateX(78deg);transform-origin:50% 100%;background:linear-gradient(90deg,transparent 0,#8fd8f00d 8%,#8fd8f017 50%,#8fd8f00d 92%,transparent 100%)}
.fd-centreline{position:absolute;left:50%;top:0;bottom:0;width:8px;transform:translateX(-50%);background:repeating-linear-gradient(0deg,#cfe88f 0 70px,transparent 70px 160px);opacity:.5;animation:fd-roll 1.4s linear infinite}
.fd-edge{position:absolute;top:0;bottom:0;width:7px;background:repeating-linear-gradient(0deg,#8fd8f0 0 10px,transparent 10px 80px);opacity:.85;filter:drop-shadow(0 0 6px #8fd8f0);animation:fd-roll-edge 1.4s linear infinite}
.fd-edge-l{left:0}.fd-edge-r{right:0}
.fd-threshold{position:absolute;left:10%;right:10%;bottom:-60px;height:120px;background:repeating-linear-gradient(90deg,#eef3ec 0 16px,transparent 16px 34px);opacity:.16}
@keyframes fd-roll{to{background-position:0 160px}}
@keyframes fd-roll-edge{to{background-position:0 80px}}
.fd-papi{position:absolute;left:calc(50% - min(360px,42vw));bottom:30%;display:flex;gap:8px}
.fd-papi i{width:8px;height:8px;border-radius:50%;background:#ff6b5c;box-shadow:0 0 12px #ff6b5c}
.fd-papi i:nth-child(-n+2){background:#f4f7f9;box-shadow:0 0 12px #f4f7f9}
.finale .button.ghost{color:var(--ink);border-color:#eef3ec40}
.finale .button.ghost:hover{border-color:var(--fd-hud)}
html[data-theme=day] .finale{--fd-em:#8fd8f0}

/* ---------- Mission brief dialog ---------- */
.fd-brief{width:min(1180px,calc(100vw - 32px));max-width:none;max-height:none;padding:0;border:0;background:transparent;color:#eef3ec;overflow:visible}
.fd-brief::backdrop{background:#03080bd9;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.fd-brief[open]{animation:fd-open .45s var(--fd-ease)}
.fd-brief[open]::backdrop{animation:fd-fade .35s ease}
@keyframes fd-open{from{opacity:0;transform:translateY(18px) scale(.98)}}
@keyframes fd-fade{from{opacity:0}}
.fd-brief-frame{border:1px solid #cfe88f55;border-radius:12px;overflow:hidden;background:#071015;box-shadow:0 40px 120px #000a}
.fd-brief-bar{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;border-bottom:1px solid #ffffff14;font:500 10px var(--fd-mono);letter-spacing:.14em;color:var(--fd-hud)}
.fd-brief-close{border:1px solid #ffffff26;border-radius:6px;background:transparent;color:#eef3ec;font:500 10px var(--fd-mono);letter-spacing:.1em;padding:7px 10px;cursor:pointer}
.fd-brief-close:hover{border-color:var(--fd-hud)}
.fd-brief video{display:block;width:100%;aspect-ratio:16/9;background:#071015}

/* ---------- Responsive + reduced motion ---------- */
@media(max-width:800px){
  .fd-adi{left:50%;width:220vw}
  .fd-horizon{-webkit-mask:radial-gradient(ellipse 90% 60% at 50% 40%,#000 20%,transparent 75%);mask:radial-gradient(ellipse 90% 60% at 50% 40%,#000 20%,transparent 75%)}
  .fd-ladder{opacity:.2}
  .fd-portrait-play{display:none}
  .fd-runway-plane{width:92vw}
  .fd-papi{display:none}
}
@media(prefers-reduced-motion:reduce){
  .fd-centreline,.fd-edge,.fd-play:after{animation:none!important}
  :is(.hero h1 em,.section-head h2 em,.languages h2 em,.finale h2 em,.manifest h2 span){--fd-fill:0%!important}
}

/* ---------- Hover micro-interactions (pointer devices only) ---------- */
@media (hover:hover) and (pointer:fine){
  /* Credentials: holographic foil that follows the pointer + a verification stamp that slams in */
  .credential{overflow:hidden;isolation:isolate}
  .credential:before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .35s;
    background:conic-gradient(from calc(var(--hx,0) * 1deg) at var(--mx,50%) var(--my,50%),#c9ff3d33,#52d9ff33,#bba8f133,#ffd76a33,#c9ff3d33);
    mix-blend-mode:multiply;filter:saturate(1.4)}
  html[data-theme=night] .credential:before{mix-blend-mode:screen}
  .credential:hover:before{opacity:1}
  .credential .credential-brand img{transition:transform .6s cubic-bezier(.34,1.56,.64,1)}
  .credential:hover .credential-brand img{transform:rotateY(360deg) scale(1.08)}
  .fd-stamp{position:absolute;right:18px;top:16px;display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border:2px solid var(--discipline-bright,#59771f);border-radius:4px;color:var(--discipline-bright,#59771f);font:500 10px/1 "DM Mono",monospace;letter-spacing:.16em;text-transform:uppercase;transform:rotate(-8deg) scale(2.4);opacity:0;pointer-events:none;transition:transform .32s cubic-bezier(.2,1.6,.4,1),opacity .2s}
  .credential:hover .fd-stamp{opacity:.9;transform:rotate(-8deg) scale(1)}

  /* Languages: flag waves, a greeting types in, the level scale re-lights */
  .language-identity{position:relative;width:max-content}
  .language-channel .language-flag{transform-origin:0 50%;transition:transform .4s}
  .language-channel:hover .language-flag{animation:fd-wave 1.1s ease-in-out infinite}
  @keyframes fd-wave{0%,100%{transform:perspective(200px) rotateY(0) skewY(0)}30%{transform:perspective(200px) rotateY(-16deg) skewY(2deg)}65%{transform:perspective(200px) rotateY(8deg) skewY(-1.5deg)}}
  .fd-hello{position:absolute;left:calc(100% + 14px);top:2px;padding:7px 11px;border-radius:10px 10px 10px 2px;background:var(--signal,#cfe88f);color:#071015;font:600 13px/1 Manrope,sans-serif;white-space:nowrap;transform-origin:0 100%;transform:scale(.4) translateX(-8px);opacity:0;pointer-events:none;transition:transform .35s cubic-bezier(.34,1.56,.64,1),opacity .2s}
  .language-channel:hover .fd-hello{transform:none;opacity:1}
  .language-channel:hover .language-scale .reached:before{animation:fd-relight .5s cubic-bezier(.2,.8,.2,1) both}
  .language-channel:hover .language-scale .reached:nth-child(2):before{animation-delay:.06s}
  .language-channel:hover .language-scale .reached:nth-child(3):before{animation-delay:.12s}
  .language-channel:hover .language-scale .reached:nth-child(4):before{animation-delay:.18s}
  .language-channel:hover .language-scale .reached:nth-child(5):before{animation-delay:.24s}
  @keyframes fd-relight{from{transform:scaleX(0);transform-origin:left}to{transform:scaleX(1);transform-origin:left}}
  .language-channel{transition:transform .35s cubic-bezier(.2,.8,.2,1)}
  .language-channel:hover{transform:translateY(-4px)}

  /* Disciplines: keyword glitches on hover (handled in flight-deck.js) */

  /* Skill chips: magnetic lift with a phosphor underline */
  .log-content li{transition:transform .25s cubic-bezier(.34,1.56,.64,1),box-shadow .25s,background .25s;will-change:transform}
  .log-content li:hover{transform:translateY(-3px) scale(1.04);box-shadow:0 6px 18px color-mix(in srgb,var(--company-color) 22%,transparent)}

  /* Primary buttons: light sweep */
  .button.primary{position:relative;overflow:hidden}
  .button.primary:after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(100deg,transparent,#ffffff8c,transparent);transform:skewX(-20deg);transition:left .6s cubic-bezier(.2,.8,.2,1)}
  .button.primary:hover:after{left:130%}

  /* Tenure cards: the counter jolts like an instrument re-reading */
  .tenure-overview article{transition:transform .35s cubic-bezier(.2,.8,.2,1)}
  .tenure-overview article:hover{transform:translateY(-4px)}
}
@media (prefers-reduced-motion:reduce){
  .language-channel:hover .language-flag,.language-channel:hover .language-scale .reached:before{animation:none!important}
  .fd-stamp,.fd-hello,.credential .credential-brand img{transition:none!important}
}