@charset "UTF-8";
/* ============================================================
   FlyGlam Academy — Design System v2
   Bootstrap 5.3 theme layer · load AFTER bootstrap.min.css

   Structure
     01  Tokens              08  Header / navigation
     02  Base + reset        09  Hero (homepage)
     03  Typography          10  Inner-page banner
     04  Layout              11  Page components
     05  Buttons             12  Footer
     06  Badges              13  Floating UI + cursor
     07  Surfaces / cards    14  Motion + responsive
   ============================================================ */

/* ============================================================
   01 · TOKENS
   Every value the site uses lives here. Ramps, not one-offs:
   a component that needs "slightly darker navy" picks the next
   step instead of inventing a hex nobody can find again.
   ============================================================ */
:root{
  /* --- brand: navy (Dassault-deep, cooler + darker than v2) --- */
  --navy-950:#090F2C;  --navy-900:#0D1533;  --navy-800:#121D42;
  --navy-700:#1A2952;  --navy-600:#243869;  --navy-500:#324A87;

  /* --- brand: gold — the single warm accent, kept for CTAs & highlights --- */
  --gold-300:#F5C444;  --gold-400:#F5C444;  --gold-500:#F5C444;
  --gold-600:#F5C444;  --gold-700:#F5C444;

  /* --- brand: khaki-olive — second structural accent (the Dassault "Defense"
       green), used to tell the two program tracks apart the way the
       reference tells Civil and Defense apart. --- */
  --khaki-900:#132905;  --khaki-700:#22350F;  --khaki-600:#3C4028;
  --khaki-500:#565C36;  --khaki-300:#9DA47A;  --khaki-100:#E6E7DC;

  /* --- brand: sky — legacy tertiary accent, kept for existing icon/link states --- */
  --sky-300:#9CD2F5;   --sky-400:#6FBCEE;   --sky-500:#45A6E5;
  --sky-600:#2A82C4;   --sky-700:#1D659B;

  /* --- neutrals: true grey (was blue-tinted), matching the reference's
       #F0F0F0 canvas + #979797 dimension-label grey --- */
  --n-0:#FFFFFF;   --n-25:#F7F7F7;  --n-50:#F0F0F0;  --n-100:#E7E7E7;
  --n-200:#DADADA; --n-300:#C4C4C4; --n-400:#979797; --n-500:#666666;
  --n-700:#3A3A3A; --n-900:#1A1A1A;

  /* --- semantic --- */
  --ok:#12A150;  --warn:#F5C444;  --err:#D64545;

  /* --- legacy aliases (8 pages still reference these) --- */
  --fg-navy:var(--navy-900);      --fg-navy-mid:var(--navy-700);
  --fg-gold:var(--gold-500);      --fg-gold-soft:var(--gold-300);
  --fg-sky:var(--sky-500);        --fg-sky-deep:var(--sky-600);
  --fg-white:var(--n-0);          --fg-cloud:var(--n-50);
  --fg-mist:var(--n-200);         --fg-slate:var(--n-500);
  --fg-ink:var(--n-900);

  /* --- radii: tighter, flatter — Dassault's blocks read as engineered
       panels, not soft SaaS cards --- */
  --r-xs:5px;  --r-sm:7px;  --r-md:10px;  --r-lg:12px;
  --r-xl:16px; --r-2xl:20px; --r-pill:999px;
  --fg-radius:var(--r-md);  --fg-radius-btn:10px;

  /* --- elevation: navy-tinted, never neutral grey --- */
  --e-1:0 1px 2px rgba(9,15,44,.07), 0 1px 3px rgba(9,15,44,.05);
  --e-2:0 2px 4px rgba(9,15,44,.06), 0 4px 12px rgba(9,15,44,.07);
  --e-3:0 4px 8px rgba(9,15,44,.06), 0 12px 28px rgba(9,15,44,.10);
  --e-4:0 8px 16px rgba(9,15,44,.07), 0 24px 52px rgba(9,15,44,.15);
  --e-5:0 16px 32px rgba(9,15,44,.09), 0 40px 88px rgba(9,15,44,.2);
  --e-gold:0 8px 28px rgba(245,196,68,.34);
  --e-sky:0 8px 28px rgba(69,166,229,.28);
  --e-khaki:0 8px 28px rgba(60,64,40,.34);
  --fg-shadow-sm:var(--e-2);  --fg-shadow-lg:var(--e-4);

  /* --- motion --- */
  --t-fast:150ms;  --t-base:250ms;  --t-slow:420ms;  --t-slower:680ms;
  --ease-out:cubic-bezier(.16,1,.3,1);        /* decelerate — entrances */
  --ease-io:cubic-bezier(.4,0,.2,1);          /* standard — state change */
  --ease-spring:cubic-bezier(.34,1.56,.64,1); /* overshoot — playful */
  --fg-ease:var(--ease-out);

  /* --- rhythm --- */
  --fg-section-y:clamp(72px,8.5vw,128px);
  --gutter:clamp(20px,4vw,40px);

  /* --- gradients --- */
  --grad-navy:linear-gradient(135deg,#0D1533 0%,#1A2952 52%,#243869 100%);
  --grad-navy-deep:linear-gradient(160deg,#090F2C 0%,#0D1533 55%,#1A2952 100%);
  --grad-gold:linear-gradient(135deg,#F5C444 0%,#F5C444 55%,#F5C444 100%);
  --grad-sky:linear-gradient(135deg,#45A6E5 0%,#6FBCEE 100%);
  --grad-khaki:linear-gradient(135deg,#132905 0%,#3C4028 65%,#565C36 100%);
  --grad-text:linear-gradient(120deg,#6FBCEE 0%,#F5C444 92%);
  --fg-navy-band:var(--grad-navy);
  --fg-gold-sweep:var(--grad-gold);
  --fg-sky-wash:linear-gradient(135deg,rgba(69,166,229,.12) 0%,rgba(245,196,68,.09) 100%);
  --fg-khaki-wash:linear-gradient(135deg,rgba(60,64,40,.14) 0%,rgba(19,41,5,.08) 100%);

  /* --- glass --- */
  --glass-light:rgba(255,255,255,.72);
  --glass-dark:rgba(255,255,255,.06);
  --glass-border-light:rgba(255,255,255,.7);
  --glass-border-dark:rgba(255,255,255,.14);
  --glass-blur:saturate(180%) blur(20px);

  /* --- Bootstrap overrides --- */
  --bs-primary:#0D1533;
  --bs-body-font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --bs-body-font-size:1.0625rem;
  --bs-body-line-height:1.7;
  --bs-body-color:#20232B;
  --bs-border-color:#DADADA;
  --bs-link-color:#2A82C4;
  --bs-link-hover-color:#F5C444;
}

/* ============================================================
   02 · BASE
   ============================================================ */
*,*::before,*::after{box-sizing:border-box}

html{scroll-behavior:smooth;scroll-padding-top:104px;-webkit-text-size-adjust:100%}

body{
  overflow-x:hidden;
  background:var(--n-0);
  counter-reset:fg-sec;
  font-feature-settings:'cv11','ss01';
  font-variant-ligatures:common-ligatures;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}

/* Consistent justified body copy across every page. */
p{
  text-align:justify;
  text-wrap:pretty;
  max-width:68ch;
  hyphens:auto;
  -webkit-hyphens:auto;
}
p.mx-auto,.text-center p{margin-inline:auto}
h1,h2,h3,h4{text-wrap:balance}

img,svg,video{max-width:100%}
img{height:auto}

::selection{background:var(--gold-500);color:var(--navy-900)}

/* One consistent focus ring for the whole site. */
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{
  outline:2px solid var(--sky-500);
  outline-offset:3px;
  border-radius:4px;
}

/* Keyboard users land here first; pointer users never see it. */
.fg-skip{
  position:absolute;left:16px;top:-64px;z-index:2000;
  padding:12px 22px;border-radius:var(--r-sm);
  background:var(--navy-900);color:#fff;text-decoration:none;
  font-weight:600;font-size:15px;
  transition:top var(--t-base) var(--ease-out);
}
.fg-skip:focus{top:16px;color:#fff}

/* Scroll progress — a 3px gold hairline across the top of the viewport. */
.fg-progress{
  position:fixed;top:0;left:0;right:0;height:3px;z-index:1200;
  transform-origin:0 50%;transform:scaleX(0);
  background:linear-gradient(90deg,var(--sky-500),var(--gold-500));
  pointer-events:none;
}

/* ============================================================
   03 · TYPOGRAPHY
   ============================================================ */
h1,h2,h3,h4,h5,.h1,.h2,.h3,.h4{
  font-family:'Montserrat',system-ui,sans-serif;
  color:var(--navy-900);line-height:1.15;letter-spacing:-.02em;
}

.fg-display{
  font-size:clamp(38px,5.6vw,72px);font-weight:800;
  letter-spacing:-.035em;line-height:1.04;
}
.fg-h2{font-size:clamp(29px,3.6vw,46px);font-weight:700;letter-spacing:-.025em;line-height:1.14}
.fg-h3{font-size:clamp(20px,2vw,25px);font-weight:700;letter-spacing:-.015em;line-height:1.28}
.fg-h4{font-size:19px;font-weight:600;letter-spacing:-.01em;line-height:1.4}
.fg-lead{font-size:clamp(17px,1.3vw,20px);line-height:1.65;color:var(--n-500);font-weight:400}

/* Full-bleed navy blueprint-jet background — turns one white section into
   a dark technical band, the way the reference alternates dark and light
   sections rather than keeping everything on one flat canvas. */
.bg-navy-band.bg-blueprint{
  background:
    linear-gradient(100deg,rgba(9,15,44,.94) 0%,rgba(9,15,44,.68) 46%,rgba(9,15,44,.4) 100%),
    url("assets/img/aviation-blueprint-background.png") center right / cover no-repeat
    !important;
}

.bg-navy-band.bg-admissions-eligibility{
  background:
    linear-gradient(100deg,rgba(5,13,26,.88) 0%,rgba(5,13,26,.66) 52%,rgba(5,13,26,.38) 100%),
    url("assets/img/admissions-eligibility-blueprint.png") center right / cover no-repeat
    !important;
}

.text-sky{color:var(--sky-600)!important}
.text-gold{color:var(--gold-500)!important}
.text-slate{color:var(--n-500)!important}
.text-navy{color:var(--navy-900)!important}
.bg-cloud{background:var(--n-50)!important}
.bg-navy-band{background:var(--grad-navy)!important;color:#fff}
.bg-navy-band h2,.bg-navy-band h3,.bg-navy-band h4{color:#fff}
.bg-navy-band .fg-lead{color:rgba(255,255,255,.82)}

/* Gradient headline accent — used on one word, never a whole heading. */
.fg-grad{
  background:var(--grad-text);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}

/* Eyebrow. A flat technical tag rather than a soft pill — a left tick
   instead of a dot, and a counted section index (0/1, 0/2…) the way the
   reference numbers its own case-study sections. Purely decorative:
   the counter is scoped per page and costs no markup. */
.fg-eyebrow{
  font-family:'Inter',sans-serif;font-size:12.5px;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--navy-800);
  display:inline-flex;align-items:center;gap:10px;margin-bottom:18px;
  padding:8px 16px 8px 13px;border-radius:var(--r-xs);
  background:var(--n-50);
  border:1px solid var(--n-200);
  border-left:3px solid var(--gold-500);
  counter-increment:fg-sec;
}
.fg-eyebrow::before{
  content:counter(fg-sec,decimal-leading-zero);
  font-weight:700;color:var(--n-400);letter-spacing:0;
}
.fg-eyebrow::after{content:"";width:14px;height:1px;background:var(--n-300);flex:0 0 14px}
.fg-eyebrow.on-dark{
  color:#fff;
  background:rgba(255,255,255,.07);
  border-color:rgba(255,255,255,.16);
  border-left-color:var(--gold-400);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
}
.fg-eyebrow.on-dark::before{color:rgba(255,255,255,.45)}
.fg-eyebrow.on-dark::after{background:rgba(255,255,255,.3)}
/* Khaki variant — flags certification-track content the way the reference
   uses olive green for its Defense division. */
.fg-eyebrow.khaki{border-left-color:var(--khaki-600)}

/* The old 64px gold bar under every heading was heavy and repetitive.
   It stays for the 8 pages that use it, but slimmed to a hairline. */
.fg-rule{
  width:52px;height:3px;border-radius:2px;
  background:var(--grad-gold);margin:20px 0 24px;
}
.text-center .fg-rule,.fg-rule.mx-auto{margin-left:auto;margin-right:auto}

/* ============================================================
   04 · LAYOUT
   ============================================================ */
.fg-section{padding-block:var(--fg-section-y);position:relative}

main > section.fg-section:not(.bg-navy-band){
  background:var(--n-0)!important;
}

/* ---- training photo card: real facilities instead of icon filler ---- */
.fg-train{
  margin:0;height:100%;display:flex;flex-direction:column;
  border:1px solid var(--n-200);border-radius:var(--r-lg);overflow:hidden;background:#fff;
  box-shadow:var(--e-2);
  transition:transform var(--t-slow) var(--ease-out),box-shadow var(--t-slow) var(--ease-out);
}
.fg-train:hover{transform:translateY(-4px);box-shadow:var(--e-4)}
.fg-train .fg-photo{border-radius:0}
.fg-train > figcaption{padding:18px 20px 20px}
.fg-train > figcaption b{
  display:block;font-family:'Montserrat',sans-serif;font-weight:700;font-size:16px;
  color:var(--navy-900);letter-spacing:-.01em;margin-bottom:6px;
}
.fg-train > figcaption span{display:block;font-size:14px;line-height:1.55;color:var(--n-500)}

/* Dotted world map + flight paths behind the FAQ — decorative only. */
.fg-faq-map{overflow:hidden}
.fg-faq-map::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:url("assets/img/world-flight-map.svg") center 52% / min(1720px,150%) auto no-repeat;
  opacity:.7;
}
.fg-faq-map > .container{position:relative;z-index:1}
@media(max-width:767.98px){.fg-faq-map::before{opacity:.32}}

.fg-sec-head{max-width:720px;margin-inline:auto;margin-bottom:clamp(40px,5vw,68px)}
.fg-sec-head p{margin-inline:auto}

/* Hairline divider between same-coloured sections. */
.fg-divider{
  height:1px;border:0;margin:0;
  background:linear-gradient(90deg,transparent,var(--n-200) 18%,var(--n-200) 82%,transparent);
}

/* Section-level ambient light. Two very soft radial washes so large
   white sections are not flat. Cheap: no blur filter, no animation. */
.fg-glow{position:relative;isolation:isolate}
.fg-glow::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(60% 50% at 12% 0%,rgba(69,166,229,.10),transparent 70%),
    radial-gradient(50% 45% at 92% 100%,rgba(245,196,68,.09),transparent 72%);
}

/* ============================================================
   05 · BUTTONS
   Sentence case, 12px radius, real depth. Every button carries a
   ripple layer (.fg-rip spans injected by site.js) and, on fine
   pointers, magnetic pull.
   ============================================================ */
.btn{
  font-family:'Inter',sans-serif;font-size:15.5px;font-weight:600;
  letter-spacing:-.005em;text-transform:none;
  padding:16px 32px;border-radius:var(--fg-radius-btn);
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  position:relative;overflow:hidden;isolation:isolate;
  white-space:nowrap;border:none;
  /* --mx/--my are written by the magnetic handler in site.js. Keeping the
     pull in custom properties lets the hover lift compose with it instead
     of one inline transform overwriting the other. */
  transform:translate3d(var(--mx,0px),var(--my,0px),0);
  transition:transform var(--t-base) var(--ease-out),
             box-shadow var(--t-base) var(--ease-out),
             background-color var(--t-base) var(--ease-io),
             color var(--t-base) var(--ease-io);
  will-change:transform;
}
.btn:active{transform:translate3d(var(--mx,0px),var(--my,0px),0) scale(.985)}
.btn:focus-visible{outline:2px solid var(--sky-500);outline-offset:3px;box-shadow:none}

/* Primary — gold. A moving sheen crosses on hover. */
.btn-gold{background:var(--gold-500);color:var(--navy-900);box-shadow:var(--e-2)}
.btn-gold::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:var(--grad-gold);opacity:0;
  transition:opacity var(--t-base) var(--ease-io);
}
.btn-gold::after{
  content:"";position:absolute;top:0;left:-120%;width:60%;height:100%;z-index:-1;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-18deg);
}
.btn-gold:hover{color:var(--navy-900);transform:translate3d(var(--mx,0px),calc(var(--my,0px) - 2px),0);box-shadow:var(--e-gold)}
.btn-gold:hover::before{opacity:1}
.btn-gold:hover::after{animation:fgSheen .75s var(--ease-io)}
@keyframes fgSheen{to{left:130%}}

/* Ghost — for dark backgrounds. Glass fill, not a bare outline. */
.btn-ghost{
  border:1px solid rgba(255,255,255,.34);color:#fff;
  background:rgba(255,255,255,.07);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  padding:15px 30px;
}
.btn-ghost:hover{background:#fff;color:var(--navy-900);border-color:#fff;transform:translate3d(var(--mx,0px),calc(var(--my,0px) - 2px),0);box-shadow:var(--e-3)}

/* Secondary — for light backgrounds. */
.btn-outline-navy{
  border:1px solid var(--n-300);color:var(--navy-900);
  background:var(--n-0);padding:15px 30px;box-shadow:var(--e-1);
}
.btn-outline-navy:hover{
  background:var(--navy-900);color:#fff;border-color:var(--navy-900);
  transform:translate3d(var(--mx,0px),calc(var(--my,0px) - 2px),0);box-shadow:var(--e-3);
}

.btn-sm{padding:12px 24px;font-size:14.5px;border-radius:var(--r-sm)}
.btn-lg{padding:19px 40px;font-size:16.5px}

/* Khaki — the certification track's own CTA colour, parallel to btn-gold. */
.btn-khaki{background:var(--khaki-600);color:#fff;box-shadow:var(--e-2)}
.btn-khaki:hover{background:var(--khaki-700);color:#fff;transform:translate3d(var(--mx,0px),calc(var(--my,0px) - 2px),0);box-shadow:var(--e-khaki)}
.btn-khaki .fg-rip{background:rgba(255,255,255,.3)}

/* Ripple layer, spawned at the click point by site.js. */
.fg-rip{
  position:absolute;border-radius:50%;transform:scale(0);
  background:rgba(255,255,255,.45);pointer-events:none;
  animation:fgRipple .62s var(--ease-out) forwards;
}
.btn-gold .fg-rip{background:rgba(10,31,61,.18)}
@keyframes fgRipple{to{transform:scale(2.6);opacity:0}}

.btn-link-arrow{
  font-family:'Inter',sans-serif;font-weight:600;font-size:15px;color:var(--sky-600);
  display:inline-flex;align-items:center;gap:8px;text-decoration:none;
  transition:color var(--t-base) var(--ease-io);
}
.btn-link-arrow svg{transition:transform var(--t-base) var(--ease-spring)}
.btn-link-arrow:hover{color:var(--gold-600)}
.btn-link-arrow:hover svg{transform:translateX(6px)}
.fg-pcard.khaki .btn-link-arrow{color:var(--khaki-600)}
.fg-pcard.khaki .btn-link-arrow:hover{color:var(--khaki-900)}

/* ============================================================
   06 · BADGES
   ============================================================ */
.fg-badge{
  display:inline-flex;align-items:center;gap:7px;
  font-family:'Inter',sans-serif;font-size:12.5px;font-weight:600;
  letter-spacing:.02em;padding:6px 13px;border-radius:var(--r-pill);
  background:var(--n-100);color:var(--n-700);border:1px solid var(--n-200);
  line-height:1.4;
}
.fg-badge--gold{background:rgba(245,196,68,.14);color:var(--gold-700);border-color:rgba(245,196,68,.3)}
.fg-badge--sky{background:rgba(69,166,229,.12);color:var(--sky-700);border-color:rgba(69,166,229,.26)}
.fg-badge--navy{background:var(--navy-900);color:#fff;border-color:var(--navy-900)}
.fg-badge--glass{
  background:rgba(255,255,255,.09);color:#fff;border-color:rgba(255,255,255,.18);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
}
.fg-badge .dot{width:6px;height:6px;border-radius:50%;background:currentColor;flex:0 0 6px}
.fg-badge--live .dot{background:var(--ok);animation:fgPulse 2s var(--ease-io) infinite}
@keyframes fgPulse{0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(18,161,80,.5)}50%{opacity:.75;box-shadow:0 0 0 5px rgba(18,161,80,0)}}

/* legacy tag pill */
.fg-course .tag,.fg-tag{
  display:inline-flex;background:rgba(245,196,68,.14);color:var(--gold-700);
  font-family:'Inter',sans-serif;font-size:12px;font-weight:600;letter-spacing:.04em;
  text-transform:uppercase;padding:6px 13px;border-radius:var(--r-pill);
  margin-bottom:16px;align-self:flex-start;border:1px solid rgba(245,196,68,.28);
}

/* ============================================================
   07 · SURFACES + CARDS
   One shared surface recipe: 1px hairline border, 14–18px radius,
   elevation 2 at rest, elevation 4 + 4px lift on hover.
   ============================================================ */
/* Four corner ticks, inset from the edge — the technical "spec sheet"
   panel mark from the reference, painted as background layers so it
   never collides with each card's own ::before/::after accent bar. */
.fg-surface,
.fg-pcard,.fg-acard,.fg-mv,.fg-ccard,.fg-course,.fg-contact-card,.fg-snap,.fg-tcard{
  background:
    linear-gradient(var(--n-300),var(--n-300)) no-repeat top 10px left 10px / 12px 1.6px,
    linear-gradient(var(--n-300),var(--n-300)) no-repeat top 10px left 10px / 1.6px 12px,
    linear-gradient(var(--n-300),var(--n-300)) no-repeat top 10px right 10px / 12px 1.6px,
    linear-gradient(var(--n-300),var(--n-300)) no-repeat top 10px right 10px / 1.6px 12px,
    linear-gradient(var(--n-300),var(--n-300)) no-repeat bottom 10px left 10px / 12px 1.6px,
    linear-gradient(var(--n-300),var(--n-300)) no-repeat bottom 10px left 10px / 1.6px 12px,
    linear-gradient(var(--n-300),var(--n-300)) no-repeat bottom 10px right 10px / 12px 1.6px,
    linear-gradient(var(--n-300),var(--n-300)) no-repeat bottom 10px right 10px / 1.6px 12px,
    var(--n-0);
  border:1px solid var(--n-200);
  border-radius:var(--r-lg);
  box-shadow:var(--e-2);
  transition:transform var(--t-slow) var(--ease-out),
             box-shadow var(--t-slow) var(--ease-out),
             border-color var(--t-slow) var(--ease-io);
}

/* Glass panel — for use over photography or dark gradients only. */
.fg-glass{
  background:var(--glass-dark);
  border:1px solid var(--glass-border-dark);
  border-radius:var(--r-lg);
  -webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);
}
.fg-glass--light{
  background:var(--glass-light);
  border-color:var(--glass-border-light);
  box-shadow:var(--e-3);
}

/* ---- placeholder image block (fallback only) ---- */
.ph{
  position:relative;overflow:hidden;border-radius:var(--r-md);
  background:
    repeating-linear-gradient(45deg,rgba(255,255,255,.03) 0 14px,transparent 14px 28px),
    linear-gradient(135deg,#123159 0%,#2A82C4 55%,#45A6E5 100%);
  display:flex;align-items:center;justify-content:center;
}
.ph::before{
  content:"";position:absolute;width:200px;height:200px;border-radius:50%;
  background:radial-gradient(circle,rgba(245,196,68,.32) 0%,transparent 70%);
  top:-50px;right:-50px;
}
.ph-label{
  position:relative;z-index:2;text-align:center;color:rgba(255,255,255,.9);
  font-family:'Inter',sans-serif;font-size:12.5px;font-weight:600;
  letter-spacing:.1em;text-transform:uppercase;padding:20px;line-height:1.8;
}
.ph-label svg{margin:0 auto 12px;display:block;opacity:.85}
.ph-label em{display:block;font-style:normal;font-weight:500;letter-spacing:.02em;
  text-transform:none;font-size:12px;color:rgba(255,255,255,.62);margin-top:6px}

/* ---- program card ---- */
.fg-pcard{overflow:hidden;height:100%;display:flex;flex-direction:column;position:relative}
.fg-pcard::before{
  content:"";position:absolute;top:0;left:0;right:0;height:3px;z-index:3;
  background:var(--grad-gold);transform:scaleX(0);transform-origin:left;
  transition:transform var(--t-slow) var(--ease-out);
}
.fg-pcard:hover{transform:translateY(-6px);box-shadow:var(--e-4);border-color:transparent}
.fg-pcard:hover::before{transform:scaleX(1)}
.fg-pcard-img{position:relative;aspect-ratio:16/10;overflow:hidden}
.fg-pcard-img .ph{position:absolute;inset:0;border-radius:0;transition:transform var(--t-slower) var(--ease-out)}
.fg-pcard:hover .fg-pcard-img .ph{transform:scale(1.06)}
.fg-pcard-badge{
  position:absolute;left:22px;bottom:-14px;z-index:2;
  background:var(--gold-500);color:var(--navy-900);
  font-family:'Inter',sans-serif;font-size:12.5px;font-weight:700;letter-spacing:.04em;
  padding:8px 16px;border-radius:var(--r-pill);text-transform:uppercase;
  box-shadow:var(--e-2);
}
.fg-pcard-body{padding:38px 34px 34px;display:flex;flex-direction:column;flex:1}
.fg-checks li{display:flex;align-items:flex-start;gap:10px;font-size:15px;color:var(--n-700);line-height:1.5}
.fg-checks svg{color:var(--gold-600);margin-top:3px;flex-shrink:0}

/* Khaki track — marks the certification-course card the way the reference
   colour-codes its Defense division against the default Civil blue. */
.fg-pcard.khaki::before{background:var(--grad-khaki)}
.fg-pcard.khaki .fg-pcard-badge{background:var(--khaki-600);color:#fff}
.fg-pcard.khaki .fg-checks svg{color:var(--khaki-600)}

/* ---- quick service card: compact program picker, alternating gold/white ---- */
.fg-svc-card{
  display:flex;flex-direction:column;height:100%;border-radius:var(--r-xl);overflow:hidden;
  text-decoration:none;box-shadow:var(--e-2);
  transition:transform var(--t-slow) var(--ease-out),box-shadow var(--t-slow) var(--ease-out);
}
.fg-svc-card:hover{transform:translateY(-5px);box-shadow:var(--e-4)}
.fg-svc-card .fg-photo{margin:0}
.fg-svc-body{padding:20px 24px 24px;flex:1;display:flex;flex-direction:column;justify-content:center}
.fg-svc-body h4{
  font-family:'Montserrat',sans-serif;font-weight:800;font-size:16.5px;line-height:1.3;
  letter-spacing:-.005em;text-transform:uppercase;margin:0 0 6px;
}
.fg-svc-body p{
  font-family:'Inter',sans-serif;font-weight:600;font-size:12px;letter-spacing:.06em;
  text-transform:uppercase;margin:0;
}
.fg-svc-card.gold{background:var(--gold-500)}
.fg-svc-card.gold .fg-svc-body h4,.fg-svc-card.gold .fg-svc-body p{color:var(--navy-950)}
.fg-svc-card.white{background:#fff;border:1px solid var(--n-200)}
.fg-svc-card.white .fg-svc-body h4{color:var(--navy-900)}
.fg-svc-card.white .fg-svc-body p{color:var(--n-500)}

/* ---- feature card (flips to navy on hover) ---- */
.fg-fcard{
  background:var(--n-50);border:1px solid var(--n-200);
  border-radius:var(--r-lg);padding:36px 30px;height:100%;
  transition:transform var(--t-slow) var(--ease-out),
             box-shadow var(--t-slow) var(--ease-out),
             background-color var(--t-slow) var(--ease-io),
             border-color var(--t-slow) var(--ease-io);
}
.fg-fcard .ico{
  width:56px;height:56px;border-radius:var(--r-md);background:var(--fg-sky-wash);
  display:grid;place-items:center;color:var(--sky-600);
  border:1px solid rgba(69,166,229,.16);
  transition:all var(--t-slow) var(--ease-out);
}
.fg-fcard h3{font-size:19px;margin:22px 0 11px;transition:color var(--t-slow)}
.fg-fcard p{font-size:15px;line-height:1.68;color:var(--n-500);margin:0;transition:color var(--t-slow)}
.fg-fcard:hover{background:var(--navy-900);border-color:var(--navy-900);transform:translateY(-5px);box-shadow:var(--e-4)}
.fg-fcard:hover h3{color:#fff}
.fg-fcard:hover p{color:rgba(255,255,255,.72)}
.fg-fcard:hover .ico{background:var(--gold-500);color:var(--navy-900);border-color:var(--gold-500);transform:scale(1.05) rotate(-4deg)}

/* ---- advantage card ---- */
.fg-acard{padding:44px 40px;height:100%;position:relative;overflow:hidden}
.fg-acard::after{
  content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad-sky);
}
.fg-acard.b::after{background:var(--grad-gold)}
.fg-acard:hover{box-shadow:var(--e-4);transform:translateY(-4px);border-color:transparent}
.fg-acard-mark{
  width:54px;height:54px;border-radius:var(--r-md);display:grid;place-items:center;
  background:var(--fg-sky-wash);color:var(--sky-600);margin-bottom:24px;
  border:1px solid rgba(69,166,229,.16);
}
.fg-acard.b .fg-acard-mark{color:var(--gold-600);border-color:rgba(245,196,68,.2)}
.fg-acard .founder{font-size:15px;font-weight:500;color:var(--sky-600);margin-top:6px}
.fg-alist li{display:flex;gap:12px}
.fg-alist svg{color:var(--gold-600);margin-top:4px;flex-shrink:0}
.fg-alist b{display:block;font-family:'Inter',sans-serif;font-size:15.5px;font-weight:600;color:var(--n-900)}
.fg-alist span{font-size:14.5px;color:var(--n-500);line-height:1.58}

/* ---- career card ---- */
.fg-ccard{
  padding:28px 26px 26px;height:100%;min-height:210px;position:relative;overflow:hidden;
  display:flex;flex-direction:column;align-items:flex-start;
  background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(245,248,252,.96));
  border-color:rgba(111,188,238,.28);
}
.fg-ccard::before{
  content:"";position:absolute;left:0;top:0;right:0;height:3px;background:var(--grad-gold);
  transform:scaleX(0);transform-origin:left;transition:transform var(--t-slow) var(--ease-out);
}
.fg-ccard > svg{
  width:48px;height:48px;padding:11px;border-radius:var(--r-sm);
  color:var(--sky-600);background:rgba(69,166,229,.1);border:1px solid rgba(69,166,229,.18);
  transition:color var(--t-slow),background-color var(--t-slow),transform var(--t-slow) var(--ease-spring);
}
.fg-ccard h4,.bg-navy-band .fg-ccard h4{
  color:var(--navy-900);font-size:18px;line-height:1.35;margin:18px 0 9px;
}
.fg-ccard p{
  font-size:14.5px;color:var(--n-500);line-height:1.6;margin:0;
  text-align:left;hyphens:none;
}
.fg-ccard:hover{transform:translateY(-4px);box-shadow:var(--e-4);border-color:transparent}
.fg-ccard:hover::before{transform:scaleX(1)}
.fg-ccard:hover > svg{color:var(--navy-900);background:var(--gold-500);transform:translateY(-2px) rotate(-3deg)}

/* ---- testimonial card ---- */
.fg-tcard{padding:34px 32px;height:100%;display:flex;flex-direction:column}
.fg-tcard:hover{transform:translateY(-4px);box-shadow:var(--e-4);border-color:transparent}
.fg-tcard .quote{color:var(--gold-500);opacity:.4;margin-bottom:14px}
.fg-tcard blockquote{
  font-size:16px;line-height:1.72;color:var(--n-700);margin:0 0 24px;flex:1;
}
.fg-tcard .who{display:flex;align-items:center;gap:14px}
.fg-tcard .avatar{
  width:46px;height:46px;border-radius:50%;flex:0 0 46px;
  background:var(--grad-navy);color:var(--gold-400);
  display:grid;place-items:center;font-family:'Montserrat',sans-serif;
  font-weight:700;font-size:16px;
}
.fg-tcard .who b{display:block;font-size:15px;color:var(--navy-900);font-weight:600}
.fg-tcard .who span{display:block;font-size:13.5px;color:var(--n-500)}
.fg-stars-row{display:flex;gap:3px;color:var(--gold-500);margin-bottom:16px}

/* ---- mission / vision ---- */
.fg-mv{padding:42px 36px;height:100%;position:relative;overflow:hidden}
.fg-mv::after{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad-gold)}
.fg-mv.sky::after{background:var(--grad-sky)}
.fg-mv:hover{transform:translateY(-4px);box-shadow:var(--e-4);border-color:transparent}
.fg-mv .ico{
  width:54px;height:54px;border-radius:var(--r-md);background:var(--fg-sky-wash);
  display:grid;place-items:center;color:var(--gold-600);margin-bottom:22px;
  border:1px solid rgba(245,196,68,.18);
}
.fg-mv.sky .ico{color:var(--sky-600);border-color:rgba(69,166,229,.18)}

/* ---- course card ---- */
.fg-course{padding:30px 28px;height:100%;display:flex;flex-direction:column}
.fg-course h4{margin-bottom:14px}
.fg-course ul{list-style:none;padding:0;margin:0 0 18px}
.fg-course li{font-size:14.5px;color:var(--n-500);padding-left:20px;position:relative;margin-bottom:8px}
.fg-course li::before{content:"";position:absolute;left:0;top:9px;width:6px;height:6px;
  border-radius:50%;background:var(--gold-500)}
.fg-course:hover{transform:translateY(-5px);box-shadow:var(--e-4);border-color:transparent}

/* ---- contact card ---- */
.fg-contact-card{padding:38px 30px;text-align:center;height:100%}
.fg-contact-card .ico{
  width:58px;height:58px;border-radius:var(--r-md);background:var(--n-50);
  display:grid;place-items:center;color:var(--gold-600);margin:0 auto 20px;
  border:1px solid var(--n-200);transition:all var(--t-slow) var(--ease-out);
}
.fg-contact-card p,.fg-contact-card a{color:var(--n-500);font-size:15.5px;text-decoration:none}
.fg-contact-card p{max-width:none}
.fg-contact-card a:hover{color:var(--sky-600)}
.fg-contact-card:hover{background:var(--navy-900);border-color:var(--navy-900);transform:translateY(-5px);box-shadow:var(--e-4)}
.fg-contact-card:hover h4{color:#fff}
.fg-contact-card:hover p,.fg-contact-card:hover a{color:rgba(255,255,255,.76)}
.fg-contact-card:hover .ico{background:var(--gold-500);color:var(--navy-900);border-color:var(--gold-500)}

/* ---- sector tile ---- */
.fg-sector{
  background:var(--n-0);border:1px solid var(--n-200);border-radius:var(--r-lg);
  padding:28px 22px;text-align:center;height:100%;
  transition:transform var(--t-slow) var(--ease-out),box-shadow var(--t-slow) var(--ease-out),
             border-color var(--t-slow) var(--ease-io),background-color var(--t-slow) var(--ease-io);
}
.fg-sector svg{color:var(--sky-600);transition:color var(--t-slow),transform var(--t-slow) var(--ease-spring)}
.fg-sector h4{font-size:17px;margin:16px 0 8px}
.fg-sector p{font-size:14px;color:var(--n-500);margin:0;line-height:1.6;max-width:none}
.fg-sector:hover{border-color:rgba(245,196,68,.4);background:var(--n-25);transform:translateY(-4px);box-shadow:var(--e-3)}
.fg-sector:hover svg{color:var(--gold-600);transform:scale(1.1)}

/* ---- mini card ---- */
.fg-mini{
  background:var(--n-50);border:1px solid var(--n-200);border-radius:var(--r-md);
  padding:24px;height:100%;border-left:3px solid transparent;
  transition:all var(--t-slow) var(--ease-out);
}
.fg-mini:hover{background:var(--n-0);border-left-color:var(--gold-500);box-shadow:var(--e-3);transform:translateY(-3px)}
.fg-mini svg{color:var(--sky-600)}
.fg-mini h4{font-size:16.5px;margin:14px 0 8px}
.fg-mini p{font-size:14px;color:var(--n-500);line-height:1.6;margin:0;max-width:none}

.fg-highlight{
  background:rgba(245,196,68,.1);border-left:3px solid var(--gold-500);
  border-radius:var(--r-sm);padding:18px 22px;font-size:16px;font-weight:500;color:var(--n-900);
}

/* ---- feature list ---- */
.fg-featlist li{display:flex;gap:16px}
.fg-featico{
  width:46px;height:46px;border-radius:var(--r-sm);background:var(--fg-sky-wash);
  display:grid;place-items:center;color:var(--sky-600);flex-shrink:0;
  border:1px solid rgba(69,166,229,.16);
  transition:all var(--t-base) var(--ease-out);
}
.fg-featlist li:hover .fg-featico{background:var(--gold-500);color:var(--navy-900);border-color:var(--gold-500);transform:scale(1.06)}
.fg-featlist b{display:block;font-family:'Montserrat',sans-serif;font-size:17px;font-weight:700;
  color:var(--navy-900);margin-bottom:3px;letter-spacing:-.01em}
.fg-featlist p{font-size:15px;color:var(--n-500);line-height:1.6;margin:0}

/* ---- pull quote ---- */
.fg-quote{
  border-left:3px solid var(--gold-500);padding:4px 0 4px 26px;
  font-family:'Montserrat',sans-serif;font-size:20px;font-weight:600;
  font-style:italic;color:var(--navy-900);line-height:1.5;
}
.fg-closing{
  font-family:'Montserrat',sans-serif;font-size:clamp(18px,2vw,22px);font-weight:600;
  color:var(--navy-900);font-style:italic;max-width:760px;margin-inline:auto;line-height:1.5;
}
.fg-closing::before,.fg-closing::after{content:'"';color:var(--gold-500);font-size:34px;line-height:0;vertical-align:-6px}

/* ---- skeleton loader ---- */
.fg-skel{
  position:relative;overflow:hidden;border-radius:var(--r-sm);
  background:var(--n-100);
}
.fg-skel::after{
  content:"";position:absolute;inset:0;transform:translateX(-100%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);
  animation:fgShimmer 1.5s var(--ease-io) infinite;
}
@keyframes fgShimmer{to{transform:translateX(100%)}}
.fg-skel--text{height:14px;margin-bottom:10px}
.fg-skel--title{height:26px;width:62%;margin-bottom:16px}

/* ============================================================
   08 · HEADER / NAVIGATION
   Always fixed, so nothing snaps when you start scrolling. It begins
   transparent over the hero and fades to frosted navy past 60px.
   ============================================================ */
.fg-topbar{
  background:var(--navy-800);color:rgba(255,255,255,.82);font-size:13px;
  position:relative;z-index:1035;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.fg-topbar a{color:inherit;text-decoration:none;transition:color var(--t-fast) var(--ease-io)}
.fg-topbar a:hover{color:var(--gold-400)}
.fg-topbar .affil{color:rgba(255,255,255,.55)}
.fg-topbar .soc a{color:var(--sky-400)}
.fg-topbar .soc a:hover{color:var(--gold-400)}

.fg-header{
  position:fixed;top:42px;left:0;right:0;z-index:1030;
  padding-block:16px;
  background:transparent;
  border-bottom:1px solid transparent;
  transition:background-color var(--t-slow) var(--ease-io),
             backdrop-filter var(--t-slow) var(--ease-io),
             box-shadow var(--t-slow) var(--ease-io),
             padding var(--t-slow) var(--ease-out),
             top var(--t-slow) var(--ease-out),
             transform var(--t-slow) var(--ease-out),
             border-color var(--t-slow) var(--ease-io);
}
.fg-header.stuck{
  top:0;padding-block:10px;
  background:rgba(8,24,48,.82);
  -webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);
  box-shadow:0 1px 0 rgba(255,255,255,.06),0 8px 32px rgba(0,0,0,.28);
  border-bottom-color:rgba(255,255,255,.07);
}
/* Inner pages: a light tint so white nav text stays legible over the banner. */
.fg-header.solid:not(.stuck){background:rgba(10,31,61,.32);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
/* Scrolling down hides the bar; scrolling up brings it straight back. */
.fg-header.hide{transform:translateY(-118%)}

.fg-logo{display:flex;align-items:center;text-decoration:none}
.fg-logo-art{display:block;position:relative;width:250px;height:94px;flex-shrink:0}
.fg-logo-art img{display:block;position:absolute;width:250px;height:auto;max-width:none;left:0;top:-66px}

.fg-header .navbar-nav .nav-link{
  font-family:'Inter',sans-serif;font-size:15px;font-weight:500;color:rgba(255,255,255,.9);
  padding:9px 14px;position:relative;border-radius:var(--r-sm);
  transition:color var(--t-base) var(--ease-io),background-color var(--t-base) var(--ease-io);
}
.fg-header .navbar-nav .nav-item{margin-inline:2px}
/* Pill hover instead of an underline — reads closer to Linear/Vercel. */
.fg-header .navbar-nav .nav-link:hover{color:#fff;background:rgba(255,255,255,.09)}
.fg-header .navbar-nav .nav-link.active{color:var(--gold-400)}
.fg-header .navbar-nav .nav-link.active::after{
  content:"";position:absolute;left:14px;right:14px;bottom:2px;height:2px;
  border-radius:2px;background:var(--gold-500);
}
.fg-header .dropdown-toggle::after{margin-left:6px;vertical-align:1px;opacity:.6}
.fg-header .dropdown-menu{
  border:1px solid var(--n-200);border-radius:var(--r-md);box-shadow:var(--e-4);
  padding:8px;min-width:262px;margin-top:12px;
  animation:fgDrop .22s var(--ease-out);
}
@keyframes fgDrop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.fg-header .dropdown-item{
  padding:11px 16px;font-size:15px;color:var(--n-700);border-radius:var(--r-xs);
  transition:all var(--t-fast) var(--ease-io);
}
.fg-header .dropdown-item:hover{color:var(--navy-900);background:var(--n-50);transform:translateX(3px)}

.fg-burger{
  color:#fff;border:1px solid rgba(255,255,255,.2);padding:8px;
  background:rgba(255,255,255,.06);border-radius:var(--r-sm);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  transition:background-color var(--t-base) var(--ease-io);
}
.fg-burger:hover{background:rgba(255,255,255,.14)}

/* offcanvas mobile menu */
.fg-offcanvas{background:var(--navy-950);color:#fff;width:100%!important;border:none}
.fg-offcanvas .offcanvas-header{flex:0 0 auto;padding:20px 24px}
.fg-offcanvas .offcanvas-body{overflow-y:auto;padding:8px 24px 32px}
.fg-offcanvas .nav-link{
  font-family:'Montserrat',sans-serif;font-size:24px;font-weight:700;color:#fff;
  padding:13px 0;letter-spacing:-.02em;
  transition:color var(--t-base) var(--ease-io),transform var(--t-base) var(--ease-out);
}
.fg-offcanvas .nav-link:hover,.fg-offcanvas .nav-link.active{color:var(--gold-400)}
.fg-offcanvas .nav-link.sub{font-size:16px;font-weight:500;color:rgba(255,255,255,.58);padding:6px 0}
.fg-offcanvas .btn-close{filter:invert(1) grayscale(1) brightness(2)}
/* Each link slides in behind the one above it. */
.fg-offcanvas.showing .nav-item,.fg-offcanvas.show .nav-item{
  animation:fgMenuIn .45s var(--ease-out) backwards;
  animation-delay:calc(var(--i,0) * 45ms + 80ms);
}
@keyframes fgMenuIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

/* ============================================================
   09 · HERO (homepage)
   Calm by design: the entrance choreography plays once and resolves.
   What keeps moving afterwards is slow enough to read as atmosphere
   rather than animation — a drifting gradient and one aircraft.
   ============================================================ */
.fg-hero{
  position:relative;min-height:min(100svh,940px);display:flex;align-items:center;
  padding:clamp(140px,16vw,190px) 0 clamp(110px,12vw,150px);
  overflow:hidden;background:var(--navy-950);
}
.fg-hero-bg{position:absolute;inset:0;z-index:0;background:var(--navy-950)}
.fg-hero-photo{width:100%;height:100%;object-fit:cover;object-position:center 40%}
.fg-hero-bg.is-missing .fg-hero-photo{display:none}

.fg-hero::after{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(100deg,rgba(5,13,26,.94) 0%,rgba(5,13,26,.7) 44%,rgba(5,13,26,.24) 78%,rgba(5,13,26,.42) 100%);
}
/* Melts the hero into the section below instead of a hard edge. */
.fg-hero-fade{
  position:absolute;left:0;right:0;bottom:0;height:160px;z-index:3;pointer-events:none;
  background:linear-gradient(to top,var(--n-0) 0%,rgba(255,255,255,.55) 38%,transparent 100%);
}
.fg-hero > .container{position:relative;z-index:4}
.fg-hero h1{color:#fff}
.fg-hero .fg-lead{color:rgba(255,255,255,.8);max-width:56ch}

.fg-ticks{gap:12px 28px!important}
.fg-ticks li{display:flex;align-items:center;gap:9px;font-size:14.5px;color:rgba(255,255,255,.88)}
.fg-ticks svg{color:var(--gold-500);flex-shrink:0}

/* ---- hero enquiry form: the conversion step, above the fold ---- */
.fg-hero-form{
  background:#fff;border-radius:var(--r-lg);padding:28px 26px 26px;
  box-shadow:0 30px 70px rgba(0,0,0,.42);
}
.fg-hero-form-head{margin-bottom:20px}
.fg-hero-form-head h2{
  font-family:'Montserrat',sans-serif;font-weight:800;font-size:25px;
  color:var(--navy-900);letter-spacing:-.02em;margin:0 0 6px;
}
.fg-hero-form-head p{font-size:14.5px;color:var(--n-500);margin:0;text-align:left;max-width:none}
.fg-hero-form .fg-form{background:none;border:0;box-shadow:none;padding:0;border-radius:0}
.fg-hero-form .form-label{font-size:13.5px;font-weight:600;color:var(--n-700);margin-bottom:5px}
.fg-hero-form .form-check-label{font-size:13.5px;color:var(--n-500)}
@media(max-width:991.98px){
  .fg-hero-form{margin-top:8px}
}

/* ---- boarding pass: the hero's visual anchor ----
   Pure CSS/HTML, so it costs nothing to load and stays crisp at any
   density. .fg-pass-tilt receives a 3D transform from site.js on
   pointer move; the wrapper handles the idle float so the two do not
   fight over the same transform property. */
.fg-pass-wrap{position:relative;perspective:1400px;animation:fgFloatPass 8s var(--ease-io) infinite alternate}
@keyframes fgFloatPass{from{transform:translateY(-8px)}to{transform:translateY(8px)}}

.fg-pass{
  position:relative;border-radius:var(--r-lg);overflow:hidden;
  /* Navy-tinted rather than clear glass: the hero horizon behind it is
     bright gold, and clear glass dropped the label text below 4.5:1. A
     faint hairline grid stands in for the reference's blueprint texture. */
  background:
    linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px) 0 0/100% 24px,
    linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px) 0 0/24px 100%,
    linear-gradient(155deg,rgba(9,15,44,.9) 0%,rgba(6,10,28,.86) 55%,rgba(9,15,44,.9) 100%);
  border:1px solid rgba(255,255,255,.22);
  -webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);
  box-shadow:0 24px 70px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.25);
  color:#fff;transform-style:preserve-3d;
  transition:transform var(--t-slow) var(--ease-out);
}
/* Two diagonal corner brackets — the reference's HUD framing device. */
.fg-pass::before,.fg-pass::after{
  content:"";position:absolute;width:20px;height:20px;z-index:4;pointer-events:none;
}
.fg-pass::before{top:12px;left:12px;border-top:1.5px solid rgba(245,196,68,.75);border-left:1.5px solid rgba(245,196,68,.75)}
.fg-pass::after{bottom:12px;right:12px;border-bottom:1.5px solid rgba(245,196,68,.75);border-right:1.5px solid rgba(245,196,68,.75)}
.fg-pass-head{
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding:18px 26px;border-bottom:1px solid rgba(255,255,255,.13);
  background:rgba(255,255,255,.05);
}
.fg-pass-head .brand{
  font-family:'Montserrat',sans-serif;font-weight:800;font-size:13px;
  letter-spacing:.2em;color:var(--gold-400);text-transform:uppercase;
}
.fg-pass-head .kind{font-size:11px;letter-spacing:.18em;color:rgba(255,255,255,.55);text-transform:uppercase}

.fg-pass-route{
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;
  padding:30px 26px 26px;
}
.fg-pass-route .node span{
  display:block;font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-bottom:7px;
}
.fg-pass-route .node b{
  display:block;font-family:'Montserrat',sans-serif;font-weight:800;
  font-size:clamp(19px,2.1vw,26px);letter-spacing:-.02em;line-height:1.1;color:#fff;
}
.fg-pass-route .node.to{text-align:right}
.fg-pass-route .node.to b{color:var(--gold-400)}
.fg-pass-arc{position:relative;width:64px;height:34px;color:rgba(255,255,255,.4)}
.fg-pass-arc svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.fg-pass-arc .dash{stroke-dasharray:3 5;opacity:.55}
/* Keyframed along the arc with plain transforms rather than offset-path,
   so it degrades predictably everywhere instead of parking at 0,0. */
.fg-pass-arc .plane{
  color:var(--gold-500);transform-box:fill-box;transform-origin:center;
  animation:fgPassFly 6s var(--ease-io) infinite;
}
@keyframes fgPassFly{
  0%  {transform:translate(2px,26px)  rotate(-40deg);opacity:0}
  14% {opacity:1}
  25% {transform:translate(17px,13px) rotate(-24deg)}
  50% {transform:translate(32px,6px)  rotate(0deg)}
  75% {transform:translate(47px,13px) rotate(24deg)}
  86% {opacity:1}
  100%{transform:translate(62px,26px) rotate(40deg);opacity:0}
}

/* Dashed section divider — a hairline data-sheet rule, not a ticket tear. */
.fg-pass-tear{
  position:relative;height:1px;margin:0 26px;
  background:repeating-linear-gradient(90deg,rgba(255,255,255,.3) 0 5px,transparent 5px 11px);
}
.fg-pass-tear::before,.fg-pass-tear::after{
  content:"";position:absolute;top:-4px;width:8px;height:8px;
  border:1.5px solid rgba(245,196,68,.6);background:#08182F;
}
.fg-pass-tear::before{left:-4px}
.fg-pass-tear::after{right:-4px}

.fg-pass-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 18px;padding:24px 26px 26px}
.fg-pass-grid .cell span{
  display:block;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  color:rgba(255,255,255,.48);margin-bottom:5px;
}
.fg-pass-grid .cell b{
  display:block;font-size:15px;font-weight:600;color:#fff;line-height:1.35;letter-spacing:-.01em;
}
.fg-pass-grid .cell.wide{grid-column:1 / -1}

/* A dimension-ruler tick strip stands in for the old barcode — the same
   graduated marks that run under every aircraft blueprint in the reference. */
.fg-pass-code{
  display:flex;align-items:flex-end;gap:5px;height:34px;
  padding:0 26px 24px;border-top:1px solid rgba(255,255,255,.1);padding-top:10px;
}
.fg-pass-code i{display:block;flex:1;height:40%;background:rgba(255,255,255,.4);border-radius:0}
.fg-pass-code i:nth-child(4n){height:100%;background:rgba(255,255,255,.75)}
.fg-pass-code i:nth-child(5n){height:70%;background:rgba(245,196,68,.85)}

/* Small glass chips orbiting the pass. */
.fg-chip{
  position:absolute;z-index:5;display:flex;align-items:center;gap:10px;
  padding:12px 18px;border-radius:var(--r-md);
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);
  -webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);
  box-shadow:var(--e-4);color:#fff;
  font-size:13px;font-weight:500;line-height:1.3;white-space:nowrap;
}
.fg-chip b{display:block;font-family:'Montserrat',sans-serif;font-weight:800;font-size:17px;letter-spacing:-.02em}
.fg-chip span{display:block;font-size:11.5px;color:rgba(255,255,255,.62);letter-spacing:.04em}
.fg-chip svg{color:var(--gold-500);flex-shrink:0}
/* Clear of the card entirely — overlapping it covered the brand line and
   the barcode. They read as floating alongside, which is the intent. */
.fg-chip--a{left:-26px;top:-66px;animation:fgFloatChip 7s var(--ease-io) infinite alternate}
.fg-chip--b{right:-26px;bottom:-60px;animation:fgFloatChip 9s var(--ease-io) infinite alternate-reverse}
@keyframes fgFloatChip{from{transform:translateY(-10px)}to{transform:translateY(10px)}}

/* ---- stat card under the hero ---- */
/* ---- hero scholarship highlight ---- */
.fg-scholarship{
  display:inline-flex;align-items:center;gap:11px;
  background:var(--grad-gold);color:var(--navy-900);
  padding:9px 20px 9px 10px;border-radius:var(--r-pill);
  font-family:'Inter',sans-serif;font-weight:500;font-size:14.5px;line-height:1.35;
  box-shadow:0 8px 26px rgba(245,196,68,.4);margin-bottom:24px;
  animation:fgScholarPulse 2.8s var(--ease-io) infinite;
}
.fg-scholarship b{font-weight:800;letter-spacing:-.01em}
.fg-scholarship .ico{
  width:28px;height:28px;border-radius:50%;background:rgba(10,31,61,.14);
  color:var(--navy-900);display:grid;place-items:center;flex-shrink:0;
}
@keyframes fgScholarPulse{
  0%,100%{box-shadow:0 8px 26px rgba(245,196,68,.4)}
  50%{box-shadow:0 10px 32px rgba(245,196,68,.62)}
}

.fg-statcard{position:relative;z-index:5;margin-top:-64px}
.fg-statcard-in{
  background:var(--n-0);border:1px solid var(--n-200);
  border-radius:var(--r-xl);box-shadow:var(--e-5);overflow:hidden;
}
.fg-stat{
  padding:34px 32px;border-right:1px solid var(--n-200);
  transition:background-color var(--t-base) var(--ease-io);
}
.fg-stat:last-child{border-right:none}
.fg-stat:hover{background:var(--n-25)}
.fg-stat b{display:block;font-family:'Montserrat',sans-serif;font-weight:800;
  font-size:clamp(21px,2.3vw,30px);color:var(--navy-900);letter-spacing:-.035em;line-height:1.15}
.fg-stat span{display:block;font-size:14px;color:var(--n-500);margin-top:7px}

/* ---- banner scene motion (all pages) ---- */
.fg-scene{width:100%;height:100%;display:block}
.fg-scene g,.fg-scene circle{transform-box:view-box}

@keyframes fgDrift{from{transform:translateX(0)}to{transform:translateX(-1600px)}}
.fg-cloud-far{animation:fgDrift 240s linear infinite;will-change:transform}
.fg-cloud-mid{animation:fgDrift 160s linear infinite;will-change:transform}
.fg-cloud-low{animation:fgDrift 105s linear infinite;will-change:transform}

@keyframes fgSun{0%,100%{opacity:.88;transform:scale(1)}50%{opacity:1;transform:scale(1.035)}}
.fg-scene .fg-sun{transform-origin:1180px 700px;animation:fgSun 14s var(--ease-io) infinite}
.fg-sun-b{transform-box:view-box;transform-origin:1240px 378px;animation:fgSun 15s var(--ease-io) infinite}

@keyframes fgTwinkle{0%,100%{opacity:.16}50%{opacity:.8}}
.fg-stars circle{animation:fgTwinkle 7s var(--ease-io) infinite}
.fg-stars circle:nth-child(2n){animation-duration:9.5s;animation-delay:-2.4s}
.fg-stars circle:nth-child(3n){animation-duration:8s;animation-delay:-4.8s}
.fg-stars circle:nth-child(5n){animation-duration:11s;animation-delay:-1.2s}

/* One aircraft, one unhurried crossing every 26s. */
@keyframes fgJetCalm{
  0%{transform:translate(-620px,210px);opacity:0}
  12%{opacity:1}
  86%{opacity:1}
  100%{transform:translate(1520px,-250px);opacity:0}
}
.fg-jet-calm{transform-box:view-box;animation:fgJetCalm 26s linear infinite;will-change:transform}
@keyframes fgTrailDraw{0%{stroke-dashoffset:1000}100%{stroke-dashoffset:0}}
.fg-trail-calm{stroke-dasharray:1000;animation:fgTrailDraw 26s linear infinite}

@keyframes fgFar{
  0%{transform:translate(-420px,80px);opacity:0}
  12%{opacity:.7}85%{opacity:.7}
  100%{transform:translate(1500px,-130px);opacity:0}
}
.fg-jet-far{animation:fgFar 96s linear infinite;will-change:transform}
.fg-trail-far{stroke-dasharray:400;animation:fgTrailDraw 12s linear infinite}

@keyframes fgBeacon{0%,88%,100%{opacity:1}92%{opacity:.15}}
.fg-beacon{animation:fgBeacon 3.4s var(--ease-io) infinite}

@keyframes fgLight{0%,100%{opacity:.4}50%{opacity:1}}
.fg-lights circle{animation:fgLight 5.5s var(--ease-io) infinite}
.fg-lights circle:nth-child(2n){animation-delay:-1.8s;animation-duration:7s}
.fg-lights circle:nth-child(3n){animation-delay:-3.6s;animation-duration:4.4s}

.fg-b-jet{transform-box:view-box;animation:fgBJet 52s linear infinite;will-change:transform}
@keyframes fgBJet{0%{transform:translate(-260px,90px);opacity:0}10%{opacity:1}88%{opacity:1}
  100%{transform:translate(1180px,-120px);opacity:0}}
.fg-trail{stroke-dasharray:900;animation:fgTrailDraw 18s linear infinite}

/* ============================================================
   10 · INNER-PAGE BANNER
   ============================================================ */
.fg-banner{
  position:relative;min-height:clamp(360px,42vw,480px);display:flex;align-items:center;
  padding:clamp(150px,17vw,200px) 0 clamp(70px,8vw,100px);overflow:hidden;text-align:center;
  background:var(--navy-950);
}
.fg-banner-bg{position:absolute;inset:0;z-index:0}
.fg-banner::after{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(5,13,26,.86) 0%,rgba(5,13,26,.55) 52%,rgba(5,13,26,.8) 100%);
}
.fg-banner-fade{
  position:absolute;left:0;right:0;bottom:0;height:110px;z-index:2;pointer-events:none;
  background:linear-gradient(to top,var(--n-0),transparent);
}
.fg-banner.on-cloud .fg-banner-fade{background:linear-gradient(to top,var(--n-50),transparent)}
.fg-banner > .container{position:relative;z-index:3}
.fg-banner h1{color:#fff;font-size:clamp(33px,4.6vw,56px);font-weight:800;letter-spacing:-.032em}
.fg-banner .sub{color:rgba(255,255,255,.8);font-size:17.5px;max-width:64ch;margin-inline:auto}
.fg-crumb{display:flex;justify-content:center;gap:10px;font-size:13.5px;color:rgba(255,255,255,.62);margin-top:20px}
.fg-crumb a{color:rgba(255,255,255,.62);text-decoration:none;transition:color var(--t-fast)}
.fg-crumb a:hover{color:var(--gold-400)}
.fg-crumb .sep{color:rgba(255,255,255,.3)}
.fg-crumb .now{color:var(--gold-400)}

/* ============================================================
   11 · PAGE COMPONENTS
   ============================================================ */
/* ---- eligibility / dark band ---- */
.fg-elig{overflow:hidden;position:relative}
.fg-elig-deco{position:absolute;right:-60px;top:12%;opacity:.06;z-index:0;pointer-events:none}
.fg-elig > .container{position:relative;z-index:1}
.fg-elig p.body{color:rgba(255,255,255,.82)}
.fg-elig .hint{color:var(--sky-400);font-weight:500}

/* Program-by-program eligibility — scannable rows instead of a paragraph. */
.fg-elig-rows{margin:0;display:grid;gap:0}
.fg-elig-rows > div{
  display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 20px;
  padding:15px 0;border-bottom:1px solid rgba(255,255,255,.12);
}
.fg-elig-rows > div:first-child{border-top:1px solid rgba(255,255,255,.12)}
.fg-elig-rows dt{
  font-family:'Inter',sans-serif;font-weight:600;font-size:15.5px;color:#fff;margin:0;
}
.fg-elig-rows dd{
  margin:0;font-size:14.5px;color:var(--sky-400);font-weight:500;white-space:nowrap;
}
@media(max-width:575.98px){
  .fg-elig-rows dd{white-space:normal}
}

.fg-steps{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r-xl);padding:clamp(28px,3.4vw,44px);
  -webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);
}
.fg-steps li{display:flex;gap:20px;position:relative;padding-bottom:26px}
.fg-steps li:last-child{padding-bottom:0}
.fg-steps li:not(:last-child)::after{
  content:"";position:absolute;left:21px;top:50px;bottom:6px;width:2px;border-radius:2px;
  background:linear-gradient(180deg,rgba(245,196,68,.5),rgba(245,196,68,.06));
}
.fg-step-n{
  width:44px;height:44px;border-radius:var(--r-sm);background:var(--grad-gold);color:var(--navy-900);
  display:grid;place-items:center;font-family:'Montserrat',sans-serif;font-weight:800;font-size:17px;
  flex-shrink:0;z-index:1;box-shadow:0 6px 18px rgba(245,196,68,.28);
}
.fg-steps b{display:block;font-family:'Montserrat',sans-serif;font-size:17.5px;font-weight:700;color:#fff;margin-bottom:4px;letter-spacing:-.01em}
.fg-steps p{font-size:15px;color:rgba(255,255,255,.68);line-height:1.6;margin:0}

.fg-docs li{display:flex;gap:12px;align-items:flex-start;font-size:15.5px;
  color:rgba(255,255,255,.84);margin-bottom:14px}
.fg-docs svg{color:var(--gold-500);margin-top:4px;flex-shrink:0}

/* ---- sector strip ---- */
.fg-sectors{
  background:var(--n-50);border:1px solid var(--n-200);
  border-radius:var(--r-pill);padding:16px 36px;gap:8px;
}
.fg-sectors li{font-family:'Inter',sans-serif;font-weight:500;font-size:15px;color:var(--n-700);
  display:flex;align-items:center;gap:24px}
.fg-sectors li:not(:last-child)::after{content:"";width:5px;height:5px;border-radius:50%;background:var(--gold-500)}

/* ---- timeline ---- */
.fg-tl{position:relative;padding-top:56px}
.fg-tl::before{content:"";position:absolute;top:22px;left:8%;right:8%;height:2px;
  background:linear-gradient(90deg,transparent,var(--gold-500),var(--gold-500),transparent)}
.fg-tl-n{
  width:46px;height:46px;border-radius:var(--r-sm);background:var(--grad-gold);color:var(--navy-900);
  display:grid;place-items:center;font-family:'Montserrat',sans-serif;font-weight:800;font-size:16px;
  margin:-79px auto 26px;position:relative;z-index:2;box-shadow:0 0 0 8px var(--n-50),0 6px 18px rgba(245,196,68,.3);
}
.fg-tl .card-in{
  background:var(--n-0);border:1px solid var(--n-200);border-radius:var(--r-lg);
  padding:32px 28px;height:100%;box-shadow:var(--e-2);text-align:center;
  transition:transform var(--t-slow) var(--ease-out),box-shadow var(--t-slow) var(--ease-out);
}
.fg-tl .card-in:hover{transform:translateY(-5px);box-shadow:var(--e-4)}

/* ---- table ---- */
.fg-table{width:100%;border-collapse:separate;border-spacing:0;font-size:15.5px}
.fg-table thead th{background:var(--navy-900);color:#fff;font-family:'Montserrat',sans-serif;
  font-weight:700;font-size:15.5px;padding:18px 24px;text-align:left;letter-spacing:-.01em}
.fg-table thead th:first-child{border-radius:var(--r-md) 0 0 0}
.fg-table thead th:last-child{border-radius:0 var(--r-md) 0 0}
.fg-table td{padding:17px 24px;border-bottom:1px solid var(--n-200);vertical-align:top;
  transition:background-color var(--t-fast) var(--ease-io)}
.fg-table tbody tr:nth-child(odd) td{background:var(--n-25)}
.fg-table tbody tr:hover td{background:rgba(69,166,229,.055)}
.fg-table td:first-child{font-weight:600;color:var(--navy-900)}
.fg-table-wrap{overflow-x:auto;border-radius:var(--r-md);box-shadow:var(--e-2);border:1px solid var(--n-200)}

/* ---- sticky snapshot ---- */
.fg-snap{padding:32px 28px;position:relative;overflow:hidden}
.fg-snap::after{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad-gold)}
@media(min-width:992px){.fg-snap{position:-webkit-sticky;position:sticky;top:118px}}
.fg-snap h4{font-size:19px;margin-bottom:20px}
.fg-snap dl{display:grid;grid-template-columns:auto 1fr;gap:13px 16px;font-size:15px;margin:0 0 24px}
.fg-snap dt{color:var(--n-500)}
.fg-snap dd{margin:0;font-weight:600;color:var(--navy-900);text-align:right}
.fg-snap .divider{height:1px;background:var(--n-200);margin:0 0 22px}

/* ---- accordion ---- */
.accordion-item{
  border:1px solid var(--n-200);border-radius:var(--r-md)!important;
  margin-bottom:12px;overflow:hidden;background:var(--n-0);
  transition:box-shadow var(--t-base) var(--ease-io),border-color var(--t-base) var(--ease-io);
}
.accordion-item:has(.accordion-button:not(.collapsed)){box-shadow:var(--e-2);border-color:var(--n-300)}
.accordion-button{
  font-family:'Montserrat',sans-serif;font-weight:700;font-size:17px;color:var(--navy-900);
  padding:21px 24px;background:var(--n-0);letter-spacing:-.015em;
}
.accordion-button:not(.collapsed){background:var(--n-25);color:var(--navy-900);box-shadow:none}
.accordion-button:focus{box-shadow:none;border-color:var(--n-200)}
.accordion-button::after{
  background-image:none;content:"";width:11px;height:11px;flex:0 0 11px;
  border-right:2px solid var(--gold-600);border-bottom:2px solid var(--gold-600);
  transform:rotate(45deg) translate(-3px,-3px);
  transition:transform var(--t-base) var(--ease-out);
}
.accordion-button:not(.collapsed)::after{transform:rotate(225deg) translate(-3px,-3px)}
.accordion-body{padding:4px 24px 24px;color:var(--n-500);font-size:15.5px}
.accordion-body p{max-width:none}

/* ---- forms ---- */
.fg-form{
  background:var(--n-0);border:1px solid var(--n-200);
  border-radius:var(--r-xl);box-shadow:var(--e-3);padding:clamp(26px,3.4vw,44px);
}
.fg-form label{font-family:'Inter',sans-serif;font-weight:500;font-size:14px;color:var(--n-700);margin-bottom:8px}
.fg-form .form-control,.fg-form .form-select{
  background:var(--n-25);border:1px solid var(--n-200);
  border-radius:var(--r-sm);min-height:52px;font-size:16px;padding:12px 16px;
  color:var(--n-900);
  transition:border-color var(--t-base) var(--ease-io),box-shadow var(--t-base) var(--ease-io),
             background-color var(--t-base) var(--ease-io);
}
.fg-form .form-control::placeholder{color:var(--n-400)}
.fg-form textarea.form-control{min-height:124px}
.fg-form .form-control:hover,.fg-form .form-select:hover{border-color:var(--n-300)}
.fg-form .form-control:focus,.fg-form .form-select:focus{
  background:var(--n-0);border-color:var(--sky-500);
  box-shadow:0 0 0 4px rgba(69,166,229,.14);
}
.fg-form .form-check-input{width:19px;height:19px;margin-top:2px;border-color:var(--n-300)}
.fg-form .form-check-input:checked{background-color:var(--sky-600);border-color:var(--sky-600)}
.fg-form .form-check-input:focus{box-shadow:0 0 0 4px rgba(69,166,229,.14)}
.fg-req{color:var(--err)}

/* ---- map ---- */
.fg-map{
  border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--e-3);
  border:1px solid var(--n-200);height:100%;min-height:420px;
  background:var(--navy-900);position:relative;
}
.fg-map iframe{width:100%;height:100%;border:0;display:block;filter:grayscale(.6) contrast(1.04)}

/* ---- skill bars ---- */
.fg-skill{margin-bottom:22px}
.fg-skill .top{display:flex;justify-content:space-between;font-weight:600;font-size:15.5px;
  color:var(--navy-900);margin-bottom:9px}
.fg-skill .bar{height:8px;border-radius:var(--r-pill);background:var(--n-200);overflow:hidden}
.fg-skill .fill{height:100%;border-radius:var(--r-pill);background:var(--grad-gold);width:0;
  transition:width 1.4s var(--ease-out)}
.rv.in .fg-skill .fill,[data-rv].in .fg-skill .fill{width:var(--w)}

/* ---- numbered process ---- */
.fg-proc{text-align:center;height:100%}
.fg-proc .n{
  width:72px;height:72px;border-radius:var(--r-lg);background:var(--n-0);
  border:2px dashed var(--gold-500);color:var(--navy-900);display:grid;place-items:center;
  font-family:'Montserrat',sans-serif;font-weight:800;font-size:24px;margin:0 auto 20px;
  transition:all var(--t-slow) var(--ease-spring);
}
.fg-proc:hover .n{background:var(--gold-500);border-style:solid;transform:rotate(6deg) scale(1.07);box-shadow:var(--e-gold)}
.fg-proc p{font-size:15px;color:var(--n-500);line-height:1.65;margin-inline:auto}

/* ---- real photo slot ----
   If the file is missing the <img> hides and a branded panel shows
   through, so the layout never collapses. */
.fg-photo{position:relative;overflow:hidden;margin:0}
.fg-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  object-position:center;z-index:2;transition:transform var(--t-slower) var(--ease-out)}
.fg-photo.is-missing img{display:none}
.fg-photo.is-missing::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M21 16v-2l-8-5V3.5a1.5 1.5 0 0 0-3 0V9l-8 5v2l8-2.5V19l-2 1.5V22l3.5-1 3.5 1v-1.5L13 19v-5.5z'/%3E%3C/svg%3E")
    center / 58px no-repeat;
  opacity:.28;
}
.fg-photo .ph-label{opacity:0;transition:opacity var(--t-base)}
.fg-photo.is-missing .ph-label{
  position:absolute;left:14px;bottom:14px;z-index:3;
  padding:6px 13px;border-radius:var(--r-pill);
  background:rgba(4,16,31,.55);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);
  font-family:'Inter',sans-serif;font-size:11px;font-weight:500;
  letter-spacing:.02em;text-transform:none;line-height:1.4;
  color:rgba(255,255,255,.85);opacity:0;
}
.fg-photo.is-missing:hover .ph-label{opacity:1}
.fg-photo.is-missing .ph-label em,.fg-photo.is-missing .ph-label svg{display:none}
.fg-cta .fg-photo.is-missing::after{opacity:.14;background-size:96px}
.fg-photo.pos-top img{object-position:center 22%}
.fg-photo.pos-upper img{object-position:center 35%}

/* Fade a lazy image in once it decodes, instead of popping. */
.fg-photo img[loading=lazy]{opacity:0;transition:opacity var(--t-slow) var(--ease-io),transform var(--t-slower) var(--ease-out)}
.fg-photo img.is-loaded,.fg-photo img[loading=lazy].is-loaded{opacity:1}

/* ---- collage / tie-in media ---- */
.fg-collage{position:relative;padding-bottom:30px}
.fg-collage-main{aspect-ratio:4/5;border-radius:var(--r-xl);box-shadow:var(--e-5)}
.fg-collage-inset{position:absolute;right:-46px;top:64px;width:56%;aspect-ratio:4/3;
  border-radius:var(--r-lg);border:6px solid var(--n-0);box-shadow:var(--e-4)}
.fg-collage-badge{
  position:absolute;left:16px;bottom:-4px;background:var(--grad-gold);color:var(--navy-900);
  border-radius:var(--r-md);padding:16px 24px;box-shadow:var(--e-4);
  display:flex;align-items:center;gap:14px;font-family:'Montserrat',sans-serif;
  font-weight:700;font-size:15.5px;line-height:1.3;max-width:270px;
}
/* Ring + dark hub — the reference's circular "ABOUT US" stat motif,
   sat on the corner of a photo instead of floating free. */
.fg-orbit{position:absolute;left:-32px;bottom:-32px;width:128px;height:128px;z-index:3}
.fg-orbit .ring{position:absolute;inset:0;border-radius:50%;border:1px dashed var(--n-300);background:var(--n-0);box-shadow:var(--e-3)}
.fg-orbit .hub{
  position:absolute;inset:13px;border-radius:50%;background:var(--navy-950);color:#fff;
  display:grid;place-items:center;text-align:center;box-shadow:var(--e-4);
}
.fg-orbit .hub b{display:block;font-family:'Montserrat',sans-serif;font-weight:800;font-size:25px;line-height:1;letter-spacing:-.02em}
.fg-orbit .hub span{display:block;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.6);margin-top:3px}
@media(max-width:767.98px){.fg-orbit{left:-16px;bottom:-16px;width:104px;height:104px}
  .fg-orbit .hub b{font-size:20px}.fg-orbit .hub span{font-size:9px}}

/* Faded duotone photo bleed — the reference's grey-blue watermark
   treatment for light sections, built from the academy's own photography
   (grayscale + navy multiply + a fade into the page) rather than stock
   aircraft imagery. Desktop-only: at phone widths there is no room for
   it to read as anything but noise behind the copy. */
.fg-bg-bleed{
  position:absolute;top:0;bottom:0;z-index:0;overflow:hidden;pointer-events:none;
  width:min(44%,540px);
}
.fg-bg-bleed.right{right:0}
.fg-bg-bleed.left{left:0}
.fg-bg-bleed img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) brightness(1.3) contrast(.88);opacity:.6}
.fg-bg-bleed::before{content:"";position:absolute;inset:0;z-index:1}
.fg-bg-bleed.right::before{background:linear-gradient(90deg,var(--n-0) 0%,rgba(255,255,255,.82) 44%,rgba(255,255,255,.25) 78%,transparent 100%)}
.fg-bg-bleed.left::before{background:linear-gradient(270deg,var(--n-0) 0%,rgba(255,255,255,.82) 44%,rgba(255,255,255,.25) 78%,transparent 100%)}
.fg-bg-bleed::after{content:"";position:absolute;inset:0;z-index:1;background:var(--navy-950);opacity:.15;mix-blend-mode:multiply}
.fg-section:has(.fg-bg-bleed) > .container{position:relative;z-index:1}
@media(max-width:991.98px){.fg-bg-bleed{display:none}}

.fg-tie-media{position:relative}
.fg-tie-media .ph{aspect-ratio:5/6;border-radius:var(--r-xl);box-shadow:var(--e-5)}
.fg-tie-float{
  position:absolute;z-index:2;left:-28px;bottom:-28px;background:var(--navy-900);border-radius:var(--r-lg);
  padding:24px 28px;box-shadow:var(--e-5);display:flex;align-items:center;gap:16px;color:#fff;
  font-family:'Montserrat',sans-serif;font-weight:700;font-size:16.5px;max-width:280px;line-height:1.35;
  border:1px solid rgba(255,255,255,.09);
}
.fg-tie-float svg{color:var(--gold-500);flex-shrink:0}

/* ---- CTA banner ---- */
.fg-cta{position:relative;min-height:420px;display:flex;align-items:center;overflow:hidden}
.fg-cta-bg{position:absolute;inset:0;z-index:0;border-radius:0}
.fg-cta::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(135deg,rgba(5,13,26,.94) 0%,rgba(10,31,61,.88) 50%,rgba(23,65,111,.86) 100%)}
.fg-cta > .container{position:relative;z-index:2}
.fg-cta h2{color:#fff;font-size:clamp(29px,3.8vw,48px)}
.fg-cta p{color:rgba(255,255,255,.84);max-width:60ch;margin-inline:auto}
.fg-cta .support{font-size:15px;color:rgba(255,255,255,.78)}
.fg-cta .support svg{color:var(--gold-500)}
.fg-cta > .fg-cta-bg{position:absolute;inset:0;width:100%;height:100%;z-index:0;border-radius:0}

/* ---- gallery ---- */
.fg-gal-filter{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.fg-gal-filter button{
  font-family:'Inter',sans-serif;font-size:14px;font-weight:500;
  padding:11px 22px;border-radius:var(--r-pill);background:var(--n-0);color:var(--n-500);
  border:1px solid var(--n-200);transition:all var(--t-base) var(--ease-io);
}
.fg-gal-filter button:hover{border-color:var(--n-300);color:var(--navy-900);background:var(--n-25)}
.fg-gal-filter button.active{background:var(--navy-900);border-color:var(--navy-900);color:#fff;box-shadow:var(--e-2)}
.fg-gal-filter .n{opacity:.5;margin-left:6px;font-size:12.5px}

.fg-gal-item{transition:opacity var(--t-slow) var(--ease-out),transform var(--t-slow) var(--ease-out)}
.fg-gal-item.hide{display:none}
.fg-gal-card{
  position:relative;border-radius:var(--r-lg);overflow:hidden;cursor:pointer;
  box-shadow:var(--e-2);display:block;width:100%;padding:0;border:none;background:none;
  transition:box-shadow var(--t-slow) var(--ease-out),transform var(--t-slow) var(--ease-out);
}
.fg-gal-card .ph{transition:transform var(--t-slower) var(--ease-out)}
.fg-gal-card:hover{box-shadow:var(--e-4);transform:translateY(-3px)}
.fg-gal-card:hover .ph{transform:scale(1.07)}
.fg-gal-card:focus-visible{outline:3px solid var(--gold-500);outline-offset:3px}
.fg-gal-ov{
  position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;
  justify-content:flex-end;text-align:left;padding:24px;opacity:0;
  transition:opacity var(--t-slow) var(--ease-out);
  background:linear-gradient(to top,rgba(5,13,26,.94) 0%,rgba(5,13,26,.3) 56%,transparent 100%);
}
.fg-gal-card:hover .fg-gal-ov,.fg-gal-card:focus-visible .fg-gal-ov{opacity:1}
.fg-gal-ov span{font-family:'Inter',sans-serif;font-size:11.5px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--gold-400);display:block;margin-bottom:6px}
.fg-gal-ov h4{color:#fff;font-size:18px;margin:0}
.fg-gal-zoom{
  position:absolute;top:16px;right:16px;z-index:4;width:40px;height:40px;border-radius:var(--r-sm);
  background:var(--gold-500);color:var(--navy-900);display:grid;place-items:center;
  opacity:0;transform:scale(.6) rotate(-12deg);transition:all var(--t-slow) var(--ease-spring);
}
.fg-gal-card:hover .fg-gal-zoom{opacity:1;transform:scale(1) rotate(0)}

/* ---- lightbox ---- */
.fg-lb .modal-content{background:transparent;border:none}
.fg-lb .modal-body{padding:0}
.fg-lb .btn-close{filter:invert(1) grayscale(1) brightness(2);opacity:.9;position:absolute;
  top:-44px;right:0;z-index:5}
.fg-lb .cap{color:#fff;text-align:center;margin-top:20px}
.fg-lb .cap span{font-family:'Inter',sans-serif;font-size:11.5px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--gold-400);display:block;margin-bottom:6px}
.fg-lb .cap h4{color:#fff;font-size:22px}
.modal-backdrop.show{opacity:.72;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.fg-vlb video{display:block;width:100%;max-height:80vh;border-radius:12px;background:#000}

/* ---- video card ---- */
.fg-vid{
  position:relative;display:block;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--e-4);
  cursor:pointer;text-decoration:none;color:inherit;
  transition:transform var(--t-slow) var(--ease-out),box-shadow var(--t-slow) var(--ease-out);
  border:1px solid rgba(255,255,255,.1);
}
.fg-vid:hover{transform:translateY(-5px);box-shadow:var(--e-5)}
.fg-vid-frame{position:relative;display:block}
.fg-vid-media{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;background:#06101b;pointer-events:none}
.fg-vid .play{position:absolute;inset:0;z-index:3;display:grid;place-items:center}
.fg-vid .play i{
  width:70px;height:70px;border-radius:50%;background:rgba(255,255,255,.14);
  border:2px solid rgba(255,255,255,.75);display:grid;place-items:center;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  transition:all var(--t-slow) var(--ease-spring);
}
.fg-vid:hover .play i{background:var(--gold-500);border-color:var(--gold-500);transform:scale(1.1)}
.fg-vid .play svg{margin-left:4px;color:#fff}
.fg-vid:hover .play svg{color:var(--navy-900)}
.fg-vid .lbl{
  position:absolute;left:0;right:0;bottom:0;z-index:3;padding:22px;
  background:linear-gradient(to top,rgba(5,13,26,.92),transparent);color:#fff;
  font-family:'Montserrat',sans-serif;font-weight:700;font-size:16.5px;letter-spacing:-.01em;
}

/* ---- gallery cinematic video showcase ---- */
.fg-video-section{position:relative;overflow:hidden;background:
  radial-gradient(circle at 12% 20%,rgba(35,139,201,.18),transparent 34%),
  radial-gradient(circle at 88% 80%,rgba(213,166,55,.12),transparent 32%),var(--navy-900)}
.fg-video-section .fg-elig-deco{opacity:.09}
.fg-video-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;counter-reset:galleryVideo}
.fg-video-grid .col{width:auto;padding:0;counter-increment:galleryVideo}
.fg-video-grid .fg-vid{display:flex;flex-direction:column;border:1px solid rgba(255,255,255,.13);border-radius:22px;background:rgba(7,20,38,.82);box-shadow:0 22px 55px rgba(0,0,0,.3);isolation:isolate}
.fg-video-grid .fg-vid::before{content:"0" counter(galleryVideo);position:absolute;z-index:4;top:16px;left:16px;display:grid;width:42px;height:32px;place-items:center;border:1px solid rgba(255,255,255,.2);border-radius:999px;background:rgba(5,13,26,.72);color:var(--gold-400);font:700 11px/1 'Montserrat',sans-serif;letter-spacing:.1em;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:none}
.fg-video-grid .fg-vid::after{content:"";position:absolute;z-index:2;top:0;left:22px;right:22px;height:2px;background:linear-gradient(90deg,transparent,var(--gold-400),transparent);opacity:.8}
.fg-video-grid .fg-vid-media{width:100%;aspect-ratio:16/9;object-fit:cover;background:linear-gradient(135deg,#020811,#071b31);border-bottom:1px solid rgba(255,255,255,.1)}
.fg-video-grid .fg-vid:has(.fg-vid-media) .lbl{position:relative;inset:auto;display:flex;align-items:center;min-height:76px;padding:20px 24px 20px 52px;background:none;color:#fff;pointer-events:none}
.fg-video-grid .fg-vid .lbl::before{content:"";position:absolute;left:24px;width:10px;height:10px;border:2px solid var(--gold-400);border-radius:50%;box-shadow:0 0 0 5px rgba(213,166,55,.1)}
.fg-video-grid .fg-vid .lbl::after{content:"Watch video";margin-left:auto;padding-left:16px;color:rgba(255,255,255,.48);font:600 10px/1 'Inter',sans-serif;text-transform:uppercase;letter-spacing:.12em}
/* ---- gallery video showcase, bold card variant ---- */
.fg-video-grid--bold .fg-vid{
  border:1px solid rgba(213,166,55,.35);border-radius:16px;background:rgba(7,20,38,.82);
  box-shadow:0 22px 55px rgba(0,0,0,.35);transition:transform var(--t-slow) var(--ease-out),
  box-shadow var(--t-slow) var(--ease-out),border-color var(--t-slow) var(--ease-out);
}
.fg-video-grid--bold .fg-vid:hover{transform:translateY(-6px);border-color:var(--gold-400);box-shadow:0 28px 64px rgba(0,0,0,.45),0 0 0 1px rgba(213,166,55,.25)}
.fg-video-grid--bold .fg-vid::before{
  content:"0" counter(galleryVideo);position:absolute;z-index:4;top:16px;left:16px;display:grid;
  width:auto;height:32px;padding:0 14px;place-items:center;border-radius:999px;
  background:var(--gold-500);color:var(--navy-900);font:800 11px/1 'Montserrat',sans-serif;
  letter-spacing:.1em;pointer-events:none;
}
.fg-video-grid--bold .fg-vid::after{content:"";position:absolute;z-index:2;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--gold-400),var(--gold-600),var(--gold-400))}
.fg-video-grid--bold .fg-vid:has(.fg-vid-media) .lbl{
  position:relative;inset:auto;display:flex;align-items:center;min-height:70px;
  padding:18px 22px;background:none;color:#fff;pointer-events:none;
  border-top:1px solid rgba(213,166,55,.2);
}
.fg-video-grid--bold .fg-vid .lbl::before{display:none}
.fg-video-grid--bold .fg-vid .lbl::after{content:"▶ Watch";margin-left:auto;padding-left:16px;color:var(--gold-400);font:700 10.5px/1 'Inter',sans-serif;text-transform:uppercase;letter-spacing:.1em}

@media(max-width:767.98px){
  .fg-video-grid{grid-template-columns:1fr;gap:20px}
  .fg-video-grid .fg-vid{border-radius:17px}
  .fg-video-grid .fg-vid:has(.fg-vid-media) .lbl{min-height:68px;padding:17px 18px 17px 46px;font-size:15px}
  .fg-video-grid .fg-vid .lbl::before{left:20px}
  .fg-video-grid .fg-vid .lbl::after{display:none}
  .fg-video-grid--bold .fg-vid:has(.fg-vid-media) .lbl{padding:16px 18px}
}

/* ---- gallery tile ---- */
.fg-tile{border-radius:var(--r-md);overflow:hidden;box-shadow:var(--e-2);
  transition:all var(--t-slow) var(--ease-out)}
.fg-tile .ph{transition:transform var(--t-slower) var(--ease-out)}
.fg-tile:hover{box-shadow:var(--e-4);transform:translateY(-3px)}
.fg-tile:hover .ph{transform:scale(1.07)}

/* ---- counter strip ---- */
.fg-count b{display:block;font-family:'Montserrat',sans-serif;font-weight:800;
  font-size:clamp(34px,4vw,52px);color:var(--gold-500);letter-spacing:-.045em;line-height:1}
.fg-count span{display:block;color:rgba(255,255,255,.74);font-size:15px;margin-top:10px}

/* ============================================================
   12 · FOOTER
   ============================================================ */
.fg-footer{
  background:
    linear-gradient(rgba(5,13,26,.48),rgba(5,13,26,.7)),
    url("assets/img/footer-aircraft-blueprint.png") center top / cover no-repeat;
  background-color:var(--navy-950);
  color:rgba(255,255,255,.76);
  position:relative;z-index:2;overflow:visible;
  padding-top:clamp(40px,5vw,64px);
}
.fg-footer::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background:radial-gradient(60% 60% at 10% 0%,rgba(69,166,229,.12),transparent 70%),
             radial-gradient(50% 50% at 92% 100%,rgba(245,196,68,.09),transparent 72%);
}
.fg-footer > .container{position:relative;z-index:1}
/* :not(.btn) — otherwise this (0,1,1) beats .btn-gold/.btn-outline-navy's own
   (0,1,0) color rule and every footer button inherits the footer's own pale
   white body copy color instead of its real navy text. */
.fg-footer a:not(.btn){color:inherit;text-decoration:none}
.fg-strip{
  background:var(--n-0);border:1px solid var(--n-200);border-radius:var(--r-xl);
  box-shadow:var(--e-5);padding:clamp(26px,3.2vw,40px);margin-top:0;position:relative;z-index:3;
}
.fg-strip h3{font-size:25px;font-weight:700;letter-spacing:-.02em}
.fg-strip p{color:var(--n-500);font-size:16px;margin:0}
.fg-footer h4{font-family:'Inter',sans-serif;font-size:15px;font-weight:600;color:#fff;letter-spacing:.02em}
.fg-footer h4::after{content:"";display:block;width:28px;height:2px;background:var(--gold-500);
  margin-top:10px;border-radius:2px}
.fg-footer .flinks a{font-size:15px;display:inline-block;transition:all var(--t-base) var(--ease-out)}
.fg-footer .flinks a:hover{color:#fff;transform:translateX(4px)}
.fg-footer .fabout p{font-size:15px;line-height:1.7;max-width:42ch}
.fg-footer .affil{font-size:14px;color:var(--sky-400)}
.fg-fcontact li{display:flex;gap:12px;font-size:15px;line-height:1.6}
.fg-fcontact svg{color:var(--gold-500);margin-top:5px;flex-shrink:0}
.fg-fcontact a:hover{color:#fff}
.fg-fsoc a{
  width:40px;height:40px;border-radius:var(--r-sm);background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.1);
  display:grid;place-items:center;color:#fff;transition:all var(--t-base) var(--ease-out);
}
.fg-fsoc a:hover{background:var(--gold-500);color:var(--navy-900);border-color:var(--gold-500);transform:translateY(-3px)}
.fg-fbot{border-top:1px solid rgba(255,255,255,.1);font-size:13.5px;color:rgba(255,255,255,.5)}
.fg-fbot a:hover{color:var(--gold-400)}
.fg-fbot .sep{font-style:normal;color:rgba(255,255,255,.24);margin:0 6px}
.fg-fbot b{font-weight:600;color:rgba(255,255,255,.72)}

/* ============================================================
   13 · FLOATING UI + POINTER GLOW
   The native cursor is never hidden. A soft light follows the pointer
   and buttons pull gently toward it — premium feel, zero usability cost.
   ============================================================ */
.fg-wa{
  position:fixed;right:22px;bottom:22px;z-index:1040;width:56px;height:56px;border-radius:50%;
  background:#25D366;color:#fff;display:grid;place-items:center;
  box-shadow:0 8px 28px rgba(37,211,102,.4);
  transition:transform var(--t-base) var(--ease-spring),box-shadow var(--t-base) var(--ease-out);
}
.fg-wa::after{
  content:"";position:absolute;inset:0;border-radius:50%;border:2px solid #25D366;
  animation:fgHalo 2.6s var(--ease-out) infinite;
}
@keyframes fgHalo{0%{transform:scale(1);opacity:.6}100%{transform:scale(1.5);opacity:0}}
.fg-wa:hover{transform:scale(1.08);color:#fff;box-shadow:0 12px 34px rgba(37,211,102,.5)}

.fg-mobar{display:none;position:fixed;left:0;right:0;bottom:0;z-index:1045;height:58px;
  box-shadow:0 -4px 20px rgba(5,13,26,.2)}
.fg-mobar a{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;
  font-family:'Inter',sans-serif;font-weight:600;font-size:14.5px;text-decoration:none}
.fg-mobar .call{background:var(--navy-900);color:#fff}
.fg-mobar .apply{background:var(--gold-500);color:var(--navy-900)}

/* ---- quick-enquiry floating button ----
   Sits directly above the WhatsApp button, same stacking logic at every
   breakpoint: WhatsApp's own bottom offset + its own height + a fixed gap. */
.fg-quick{
  position:fixed;right:22px;bottom:92px;z-index:1040;width:56px;height:56px;border-radius:50%;
  background:var(--gold-500);color:var(--navy-900);display:grid;place-items:center;
  border:none;cursor:pointer;box-shadow:var(--e-gold);
  transition:transform var(--t-base) var(--ease-spring),box-shadow var(--t-base) var(--ease-out);
}
.fg-quick:hover{transform:scale(1.08);box-shadow:0 12px 34px rgba(245,196,68,.5)}
/* The popup's backdrop covers the full viewport at a higher z-index while
   open, including this button's corner — a real click there would hit the
   backdrop and close the popup, not reach the button underneath. Hiding it
   for the duration is simpler and clearer than fighting the stacking order. */
.fg-quick.is-tucked{opacity:0;transform:scale(.7);pointer-events:none}
.fg-quick .fg-tip{
  position:absolute;right:calc(100% + 14px);top:50%;transform:translate(6px,-50%);
  background:var(--navy-900);color:#fff;font-size:13px;font-weight:600;white-space:nowrap;
  padding:8px 14px;border-radius:var(--r-sm);box-shadow:var(--e-3);
  opacity:0;pointer-events:none;
  transition:opacity var(--t-base) var(--ease-io),transform var(--t-base) var(--ease-io);
}
.fg-quick .fg-tip::after{
  content:"";position:absolute;left:100%;top:50%;transform:translateY(-50%);
  border:5px solid transparent;border-left-color:var(--navy-900);
}
.fg-quick:hover .fg-tip,.fg-quick:focus-visible .fg-tip{opacity:1;transform:translate(0,-50%)}
@media(max-width:767.98px){
  .fg-quick{bottom:116px;right:12px;width:40px;height:40px}
  .fg-quick > svg{width:18px;height:18px}
  .fg-quick .fg-tip{display:none}
}

/* ============================================================
   Quick-enquiry popup
   Only the dialog chrome (overlay, card, close button, animation) is
   new — the form inside is a plain .fg-form, so it gets the exact same
   field styling, validation and WhatsApp submission as every other form
   on the site for free. See assets/form-whatsapp.js.
   ============================================================ */
html.fg-locked,html.fg-locked body{overflow:hidden}

.fg-popup{
  position:fixed;inset:0;z-index:1300;display:flex;align-items:center;justify-content:center;
  padding:24px;background:rgba(5,13,26,.62);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  opacity:0;visibility:hidden;
  transition:opacity var(--t-slow) var(--ease-io),visibility 0s linear var(--t-slow);
}
.fg-popup.open{opacity:1;visibility:visible;transition:opacity var(--t-slow) var(--ease-io),visibility 0s}

.fg-popup-card{
  position:relative;width:100%;max-width:560px;max-height:88vh;overflow-y:auto;
  background:var(--n-0);border-radius:var(--r-xl);box-shadow:var(--e-5);
  padding:clamp(28px,4vw,44px);
  transform:translate3d(0,18px,0) scale(.96);opacity:0;
  transition:transform var(--t-slow) var(--ease-spring),opacity var(--t-slow) var(--ease-out);
}
.fg-popup.open .fg-popup-card{transform:none;opacity:1}

.fg-popup-close{
  position:absolute;top:16px;right:16px;width:38px;height:38px;border-radius:50%;
  display:grid;place-items:center;background:var(--n-50);border:1px solid var(--n-200);color:var(--n-700);
  transition:all var(--t-base) var(--ease-io);
}
.fg-popup-close:hover{background:var(--navy-900);color:#fff;border-color:var(--navy-900);transform:rotate(90deg)}

.fg-popup-head{padding-right:40px;margin-bottom:22px}
.fg-popup-head .fg-eyebrow{margin-bottom:12px}
.fg-popup-head h3{font-size:clamp(21px,2.4vw,26px)}
.fg-popup-head p{color:var(--n-500);font-size:15px;margin:8px 0 0;max-width:none}
/* card already supplies the border/shadow/padding a standalone .fg-form has */
.fg-popup .fg-form{box-shadow:none;border:none;padding:0;border-radius:0}

@media(max-width:575.98px){
  .fg-popup{padding:22px;align-items:center}
  .fg-popup-card{
    width:100%;max-width:360px;max-height:74vh;border-radius:var(--r-md);
    padding:18px 14px 16px;
    transform:translate3d(0,24px,0) scale(.97);
  }
  .fg-popup.open .fg-popup-card{transform:none}
  .fg-popup-close{top:10px;right:10px;width:30px;height:30px}
  .fg-popup-close svg{width:15px;height:15px}
  .fg-popup-head{padding-right:30px;margin-bottom:12px}
  .fg-popup-head .fg-eyebrow{font-size:10px;margin-bottom:6px;padding:5px 9px}
  .fg-popup-head h3{font-size:18px;line-height:1.22}
  .fg-popup-head p{font-size:12.5px;line-height:1.4;margin-top:4px}
  .fg-popup .row{--bs-gutter-y:.65rem}
  .fg-popup .form-label{font-size:12px;margin-bottom:3px}
  .fg-popup .form-control,.fg-popup .form-select{font-size:13px;padding:8px 10px;min-height:38px}
  .fg-popup .form-check-label{font-size:12px!important;line-height:1.35}
  .fg-popup .form-check-input{width:16px;height:16px}
  .fg-popup .btn{padding:10px 14px;font-size:13px}
}

/* Pointer glow — one 340px radial light, composited on the GPU. */
.fg-glowdot{
  position:fixed;left:0;top:0;width:340px;height:340px;margin:-170px 0 0 -170px;
  border-radius:50%;pointer-events:none;z-index:1;opacity:0;
  background:radial-gradient(circle,rgba(245,196,68,.13) 0%,rgba(69,166,229,.07) 42%,transparent 68%);
  transition:opacity var(--t-slow) var(--ease-io);
  will-change:transform;mix-blend-mode:screen;
}
.fg-glowdot.on{opacity:1}
/* A small crisp ring so the glow reads as intentional, not a smudge. */
.fg-ring{
  position:fixed;left:0;top:0;width:30px;height:30px;margin:-15px 0 0 -15px;
  border:1.5px solid rgba(245,196,68,.5);border-radius:50%;
  pointer-events:none;z-index:1100;opacity:0;
  transition:opacity var(--t-base) var(--ease-io),width var(--t-base) var(--ease-spring),
             height var(--t-base) var(--ease-spring),margin var(--t-base) var(--ease-spring),
             border-color var(--t-base) var(--ease-io),background-color var(--t-base) var(--ease-io);
  will-change:transform;
}
.fg-ring.on{opacity:.75}
.fg-ring.hot{
  width:52px;height:52px;margin:-26px 0 0 -26px;
  border-color:rgba(245,196,68,.85);background:rgba(245,196,68,.1);opacity:1;
}

/* ============================================================
   14 · MOTION
   Everything animates transform/opacity only. `.rv` is kept for the
   8 pages already using it; `[data-rv]` adds directional variants and
   a real, DOM-ordered stagger via --i.
   ============================================================ */
.rv,[data-rv]{
  opacity:0;
  transition:opacity var(--t-slower) var(--ease-out),transform var(--t-slower) var(--ease-out);
  transition-delay:calc(var(--i,0) * 70ms);
  will-change:transform,opacity;
}
.rv,[data-rv="up"],[data-rv=""]{transform:translate3d(0,28px,0)}
[data-rv="left"]{transform:translate3d(-32px,0,0)}
[data-rv="right"]{transform:translate3d(32px,0,0)}
[data-rv="scale"]{transform:scale(.94)}
[data-rv="blur"]{transform:translate3d(0,20px,0);filter:blur(6px)}
.rv.in,[data-rv].in{opacity:1;transform:none;filter:none;will-change:auto}

/* Shared card and image micro-motion. Scroll entrances are handled above;
   these pointer effects add depth without moving surrounding layout. */
@media(hover:hover) and (pointer:fine){
  :where(.fg-pcard,.fg-fcard,.fg-acard,.fg-ccard,.fg-tcard,.fg-contact-card,.fg-course,.fg-sector,.fg-proc,.fg-mv){
    transition:transform var(--t-slow) var(--ease-out),box-shadow var(--t-slow) var(--ease-out),border-color var(--t-base) var(--ease-io);
  }
  :where(.fg-course,.fg-sector,.fg-proc,.fg-mv):hover{
    transform:translateY(-5px);
    box-shadow:var(--e-4);
  }
  :where(.fg-pcard,.fg-acard,.fg-tcard,.fg-course,.fg-mv,.fg-gal-card):hover .fg-photo img{
    transform:scale(1.045);
  }
  .fg-photo img{
    transition:opacity var(--t-slow) var(--ease-io),transform .8s var(--ease-out);
  }
}

/* Hero entrance: plays once on load, then never again. */
@keyframes fgHeroIn{from{opacity:0;transform:translate3d(0,26px,0)}to{opacity:1;transform:none}}
.fg-hero [data-in]{animation:fgHeroIn .95s var(--ease-out) backwards;
  animation-delay:calc(var(--d,0) * 1ms)}
@keyframes fgPassIn{from{opacity:0;transform:translate3d(34px,26px,0) rotateY(-9deg) scale(.96)}
  to{opacity:1;transform:none}}
.fg-hero [data-in="pass"]{animation:fgPassIn 1.15s var(--ease-out) backwards}

/* Parallax: site.js writes --py, CSS decides how far each layer moves. */
[data-parallax]{transform:translate3d(0,calc(var(--py,0) * 1px),0);will-change:transform}

/* ============================================================
   15 · RESPONSIVE
   ============================================================ */
@media(max-width:1399.98px){
  .fg-chip--a{left:-8px}
  .fg-chip--b{right:-8px}
}
@media(max-width:1199.98px){
  .fg-collage-inset{display:none}
  .fg-header .navbar-nav .nav-item{margin-inline:0}
  .fg-header .navbar-nav .nav-link{padding:9px 11px;font-size:14.5px}
}
@media(max-width:991.98px){
  .fg-topbar{display:none}
  .fg-header,.fg-header.stuck{top:0}
  .fg-stat{border-right:none;border-bottom:1px solid var(--n-200)}
  .fg-stat:last-child{border-bottom:none}
  .fg-acard{padding:34px 28px}
  .fg-cta{min-height:380px}
  .fg-tl::before{display:none}
  .fg-tl-n{margin:0 auto 20px}
  .fg-tl{padding-top:0}
  .fg-pass-wrap{max-width:440px;margin:56px auto 0}
  .fg-hero{min-height:auto}
}
@media(max-width:767.98px){
  html,body{
    width:100%;
    max-width:100%;
    overflow-x:clip;
  }
  body{
    font-size:16px;
    background-attachment:scroll;
  }

  main,.fg-hero,.fg-banner,.fg-section,.fg-cta,.fg-footer{
    max-width:100%;
    overflow-x:clip;
  }

  /* Touchscreens have no hover state, so make scroll entrances more visible
     and provide a restrained pressed response for interactive cards. */
  .rv,[data-rv]{
    transition-duration:.85s;
    transition-timing-function:var(--ease-out);
  }
  .rv,[data-rv="up"],[data-rv=""]{transform:translate3d(0,42px,0)}
  [data-rv="scale"]{transform:scale(.88)}
  :where(.fg-pcard,.fg-fcard,.fg-acard,.fg-ccard,.fg-tcard,.fg-contact-card,.fg-course,.fg-sector,.fg-proc,.fg-mv):active{
    transform:scale(.985);
    transition-duration:120ms;
  }

  /* Wide blueprint artwork needs a fixed visual scale on narrow screens;
     `cover` would magnify it until almost none of the aircraft remained. */
  main > section.fg-section:not(.bg-navy-band){
    background-color:var(--n-50)!important;
    background-size:cover,100% auto!important;
    background-position:center,center top!important;
    background-repeat:no-repeat,no-repeat!important;
  }

  /* Bootstrap's .g-4/.g-5 pull rows out by 24px a side, which is wider than
     the container's own padding — that was the few px of horizontal overflow
     on every page. Columns are stacked at this width, so the horizontal
     gutter is invisible anyway; only the vertical one needs to stay large. */
  .row.g-4,.row.g-5,.row.gx-4,.row.gx-5{--bs-gutter-x:1.5rem}
  .fg-hero{padding:120px 0 90px;text-align:center}
  .fg-hero .fg-lead{margin-inline:auto}
  .fg-hero .fg-eyebrow,.fg-hero .fg-scholarship,.fg-hero .btn-wrap,.fg-hero .fg-rule{margin-inline:auto}
  .fg-scholarship{text-align:left}
  .fg-hero .btn-wrap{justify-content:center}
  .fg-hero-fade{height:100px}
  .fg-ticks{justify-content:center}
  .btn{width:100%;padding:16px 22px}
  .fg-hero .btn{width:auto;min-width:200px}
  .fg-chip{display:none}
  .fg-hero-radar{display:none}
  .fg-pass-wrap{max-width:380px;margin-top:44px}
  .fg-pass-tear::before,.fg-pass-tear::after{display:none}
  .fg-tie-float{left:14px;bottom:-22px;padding:20px 22px;font-size:15px}
  .fg-sectors{border-radius:var(--r-lg);padding:20px}
  .fg-sectors li{gap:14px}
  .fg-strip{padding:26px 22px;text-align:center}
  .fg-strip > div:first-child{width:100%}
  .fg-strip > .d-flex{width:100%;gap:10px!important}
  .fg-strip > .d-flex .btn{margin:0}
  .fg-mobar{display:flex}
  .fg-footer{
    padding-top:32px;
    padding-bottom:68px;
    background-size:cover,100% auto;
    background-position:center top;
    background-repeat:no-repeat,no-repeat;
  }
  .fg-footer > .container > .row{padding-top:48px!important}
  .fg-wa{bottom:68px;right:12px;width:40px;height:40px}
  .fg-wa svg{width:20px;height:20px}
  .fg-cta{min-height:auto;padding-block:70px}
  .fg-collage-badge{left:12px;padding:14px 20px;font-size:14.5px}
  .fg-pcard-body{padding:30px 24px 28px}
  .fg-glowdot,.fg-ring{display:none}
  p{max-width:none}
}
@media(max-width:575.98px){
  .container{--bs-gutter-x:2rem}
  h1,h2,h3,h4,h5,h6,.fg-display,.fg-h2,.fg-h3,.fg-h4,
  p,li,dt,dd,a,label{overflow-wrap:anywhere;word-break:normal}

  .fg-display{font-size:clamp(29px,8.5vw,38px);letter-spacing:-.025em;line-height:1.12}
  .fg-h2{font-size:clamp(23px,6.8vw,30px);letter-spacing:-.02em;line-height:1.22}
  .fg-h3{font-size:clamp(18px,5.5vw,22px)}
  .fg-h4{font-size:17px}
  .fg-banner{min-height:320px;padding:122px 0 56px}
  .fg-banner h1{font-size:clamp(27px,8vw,35px);letter-spacing:-.024em;line-height:1.16}
  .fg-banner .sub{font-size:16px;line-height:1.6}
  .fg-sec-head{margin-bottom:36px}

  .fg-eyebrow{font-size:11.5px;letter-spacing:.11em;padding:7px 13px 7px 11px;line-height:1.45}
  .fg-logo{min-width:0}
  .fg-logo-art{width:190px;height:72px}
  .fg-logo-art img{width:190px;top:-51px}

  .fg-offcanvas .nav-link{font-size:20px;padding:10px 0}
  .fg-offcanvas .nav-link.sub{font-size:15px;padding:5px 0}
  .fg-offcanvas .offcanvas-body > .btn{flex:0 0 auto;margin-bottom:8px}

  .btn{max-width:100%;white-space:normal;line-height:1.35}
  .fg-form,.fg-contact-card,.fg-mv,.fg-fcard,.fg-ccard,.fg-course,.fg-tcard{padding:26px 20px}
  .fg-ccard{min-height:0}
  .fg-ccard > svg{width:44px;height:44px;padding:10px}
  .fg-ccard h4,.bg-navy-band .fg-ccard h4{font-size:17px;margin-top:15px}
  .fg-snap{padding:26px 20px}
  .fg-snap dl{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
  .fg-snap dd{overflow-wrap:anywhere}
  .accordion-button{padding:17px 18px;font-size:16px;line-height:1.4}
  .accordion-body{padding:2px 18px 20px}

  .fg-table{min-width:680px}
  .fg-table thead th,.fg-table td{padding:14px 18px}
  .fg-table-wrap{-webkit-overflow-scrolling:touch}

  /* three short items wrapped 1 + 2, which read as a mistake — stack them */
  .fg-ticks{flex-direction:column;align-items:center;gap:10px!important}

  .fg-gal-filter{gap:8px}
  .fg-gal-filter button{padding:9px 15px;font-size:13px}
  .fg-vid .lbl{padding-left:16px;padding-right:16px;font-size:15px}

  .fg-pass-route{padding:24px 20px 22px}
  .fg-pass-grid{padding:20px;gap:16px 14px}
  .fg-pass-head{padding:15px 20px}
  .fg-pass-code{padding:0 20px 20px}
  .fg-pass-tear{margin-inline:20px}
}

/* ============================================================
   16 · REDUCED MOTION
   Nothing moves. Everything is still visible and usable.
   ============================================================ */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important;
  }
  .rv,[data-rv]{opacity:1;transform:none;filter:none}
  .rv .fg-skill .fill,[data-rv] .fg-skill .fill{width:var(--w)}
  .fg-glowdot,.fg-ring{display:none}
  [data-parallax]{transform:none}
}

/* ============================================================
   17 · PAGE TRANSITIONS
   Entrance is CSS-only, so it still runs if the script is blocked.
   .22s below must match OUT_MS in assets/page-transition.js
   ============================================================ */
html.fg-pt body{animation:fgPtFade .42s ease-out backwards}
html.fg-pt main{animation:fgPtRise .62s var(--ease-out) backwards}
@keyframes fgPtFade{from{opacity:0}to{opacity:1}}
@keyframes fgPtRise{from{transform:translate3d(0,16px,0)}to{transform:none}}
html.fg-pt-out body{opacity:0;transition:opacity .22s ease-in}
html.fg-pt-out main{transform:translate3d(0,-10px,0);transition:transform .22s ease-in}

/* ============================================================
   18 · FORM VALIDATION + WHATSAPP FEEDBACK
   ============================================================ */
.fg-err{display:none;margin-top:7px;font-size:13.5px;line-height:1.45;color:var(--err)}
.fg-err.on{display:block;animation:fgShake .4s var(--ease-io)}
@keyframes fgShake{0%,100%{transform:translateX(0)}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
.fg-form .form-control.is-invalid,
.fg-form .form-select.is-invalid{border-color:var(--err);background-color:#FEF7F7}
.fg-form .form-control.is-invalid:focus,
.fg-form .form-select.is-invalid:focus{border-color:var(--err);box-shadow:0 0 0 4px rgba(214,69,69,.14)}
.fg-form .form-check-input.is-invalid{border-color:var(--err)}

/* Student placement airline marquee */
.fg-placement{padding:88px 0 96px;background:#fff;overflow:hidden}
.fg-placement-head{margin-bottom:42px}.fg-placement-head .fg-h2{margin:14px 0 0}
.fg-logo-marquee{position:relative;width:100%;overflow:hidden;padding:8px 0}
.fg-logo-marquee::before,.fg-logo-marquee::after{content:"";position:absolute;z-index:2;top:0;bottom:0;width:min(12vw,150px);pointer-events:none}
.fg-logo-marquee::before{left:0;background:linear-gradient(90deg,#fff,transparent)}.fg-logo-marquee::after{right:0;background:linear-gradient(270deg,#fff,transparent)}
.fg-logo-track{display:flex;width:max-content;animation:fgLogoMarquee 42s linear infinite;will-change:transform}
.fg-logo-set{display:flex;align-items:center;gap:24px;padding-right:24px}
.fg-placement-logo{display:flex;align-items:center;justify-content:center;flex:0 0 220px;height:120px;padding:22px 25px;border:1px solid rgba(12,35,64,.1);border-radius:18px;background:#fff;box-shadow:0 8px 28px rgba(12,35,64,.07)}
.fg-placement-logo img{display:block;width:100%;height:100%;object-fit:contain}.fg-logo-marquee:hover .fg-logo-track{animation-play-state:paused}
@keyframes fgLogoMarquee{to{transform:translateX(-50%)}}
@media(max-width:575.98px){.fg-placement{padding:62px 0 68px}.fg-placement-head{margin-bottom:28px;padding-inline:16px}.fg-logo-set{gap:14px;padding-right:14px}.fg-placement-logo{flex-basis:170px;height:98px;padding:18px 20px;border-radius:14px}}
@media(prefers-reduced-motion:reduce){.fg-logo-marquee{overflow-x:auto}.fg-logo-marquee::before,.fg-logo-marquee::after,.fg-logo-set[aria-hidden="true"]{display:none}.fg-logo-track{animation:none}}

/* Student placement showcase */
.fg-student-placements{padding:84px 0;background:linear-gradient(180deg,#f7faff 0%,#fff 100%)}
.fg-student-marquee{overflow:hidden;margin-inline:calc((100vw - 100%)/-2);padding:14px 0 24px}
.fg-student-track{display:flex;width:max-content;animation:fgStudentMarquee 30s linear infinite;will-change:transform}
.fg-student-card-set{display:flex;gap:20px;padding-right:20px}
.fg-student-card{flex:0 0 224px;overflow:hidden;margin:0;border:1px solid rgba(12,35,64,.13);border-radius:18px;background:#fff;box-shadow:0 14px 38px rgba(12,35,64,.1);transition:transform .35s var(--ease-out),box-shadow .35s var(--ease-out)}
.fg-student-card:hover{transform:translateY(-7px);box-shadow:0 22px 48px rgba(12,35,64,.16)}
.fg-student-photo{display:block;width:100%;height:300px;object-fit:cover;object-position:center top}
.fg-student-info{display:flex;min-height:190px;flex-direction:column;align-items:center;padding:17px 16px 20px;text-align:center}
.fg-student-info h3{margin:0;color:var(--n-900);font-size:20px;font-weight:700;line-height:1.25}
.fg-student-rule{display:block;width:70%;height:1px;margin:9px auto 10px;background:linear-gradient(90deg,transparent,#c79a2b,transparent)}
.fg-student-info p{margin:0;color:var(--n-700);font-size:15px;font-weight:700;line-height:1.4}
.fg-student-placement-line{margin-top:13px;color:var(--n-500);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.11em}
.fg-student-company{display:flex;height:46px;align-items:center;justify-content:center;margin-top:5px}
.fg-student-company img{display:block;max-width:135px;max-height:40px;object-fit:contain}
.fg-student-marquee:hover .fg-student-track{animation-play-state:paused}
.fg-student-marquee.is-static{overflow-x:auto;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
.fg-student-marquee.is-static .fg-student-track{width:max-content;min-width:100%;justify-content:center;animation:none}
.fg-student-marquee.is-static .fg-student-card-set{justify-content:center;padding-right:0}
.fg-student-marquee.is-static .fg-student-card{scroll-snap-align:center}
@keyframes fgStudentMarquee{to{transform:translateX(-50%)}}
@media(max-width:575.98px){
  .fg-student-placements{padding:52px 0}
  .fg-student-card-set{gap:14px;padding-right:14px}
  .fg-student-card{flex-basis:220px;border-radius:14px}
  .fg-student-marquee.is-static{overflow-x:auto}
  .fg-student-marquee.is-static .fg-student-track{width:max-content;justify-content:flex-start;padding-inline:16px}
  .fg-student-marquee.is-static .fg-student-card-set{justify-content:flex-start}
}
@media(prefers-reduced-motion:reduce){.fg-student-marquee{overflow-x:auto}.fg-student-track{animation:none}.fg-student-card-set[aria-hidden="true"]{display:none}}

.fg-sent{display:none;margin-top:24px;padding:18px 22px;border-radius:var(--r-md);
  background:rgba(18,161,80,.08);border:1px solid rgba(18,161,80,.28);
  color:var(--n-900);font-size:15px;line-height:1.6}
.fg-sent.on{display:block;animation:fgHeroIn .5s var(--ease-out)}
.fg-sent a{color:var(--sky-600);font-weight:600}

/* Lighter heading treatment across every page */
h1,h2,h3,h4,h5,h6,
.fg-display,.fg-h2,.fg-h3,.fg-h4,
.fg-banner h1,.fg-strip h3,.fg-footer h4{
  font-weight:500!important;
}

/* Simple editorial typography: plain, human and easy to scan */
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,
.fg-display,.fg-h2,.fg-h3,.fg-h4{
  font-family:'Inter','Segoe UI',Arial,sans-serif!important;
  letter-spacing:-.035em;
}
.fg-display{max-width:760px;line-height:1.08;letter-spacing:-.045em}
.fg-h2{line-height:1.18;letter-spacing:-.035em}
.fg-h3{line-height:1.28;letter-spacing:-.025em}
.fg-h4{letter-spacing:-.015em}
.fg-grad{
  background:none;
  -webkit-text-fill-color:currentColor;
  color:var(--gold-400);
}
.fg-eyebrow,.fg-eyebrow.on-dark{
  padding:0;border:0;border-radius:0;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;
  font-family:'Inter','Segoe UI',Arial,sans-serif;font-size:12px;font-weight:500;
  letter-spacing:.1em;
}
.fg-eyebrow::before,.fg-eyebrow::after{display:none}
.fg-eyebrow.on-dark{color:rgba(255,255,255,.72)}
.fg-sec-head .fg-h2{max-width:760px;margin-inline:auto}