@layer vendor, site;
@layer site {
/* v563: flight number education area; intentionally scoped, does not alter hero or existing explorer */
.nfgfn-section{color:#0d2039}
.nfgfn-section .nfgfn-intro{max-width:880px;margin-bottom:26px}
.nfgfn-section .nfgfn-intro p{color:#55718f;line-height:1.7;font-size:1.03rem;margin:14px 0 0}
.nfgfn-section .nfgfn-intro h2{margin:10px 0 0;}
.nfgfn-frame{padding:clamp(18px,3.4vw,36px);border:1px solid #cddfed;border-radius:22px;}
.nfgfn-frame h3{color:#0d2039;margin:0 0 12px;font-size:1.24rem}
.nfgfn-number-example{display:flex;align-items:center;flex-wrap:wrap;gap:14px;margin:12px 0 24px}
.nfgfn-number-example .nfgfn-num{display:inline-flex;align-items:center;gap:2px;border:1px solid #d8e9f4;border-radius:14px;padding:8px 14px;background:#f3f8fd;box-shadow:inset 0 1px 0 rgba(255,255,255,.75)}
.nfgfn-number-example .nfgfn-num em{font-style:normal;font-size:clamp(1.2rem,2vw,1.7rem);letter-spacing:.02em;font-weight:900;color:#142c49;line-height:1;margin-right:10px}
.nfgfn-number-example .nfgfn-num i{font-style:normal;min-width:1ch;line-height:1;font-weight:900;font-size:clamp(1.2rem,2vw,1.7rem)}
.nfgfn-number-example .nfgfn-num i:nth-of-type(1){color:#f6a414}
.nfgfn-number-example .nfgfn-num i:nth-of-type(2){color:#609c45}
.nfgfn-number-example .nfgfn-num i:nth-of-type(3){color:#f04443}
.nfgfn-number-example .nfgfn-num i:nth-of-type(4){color:#1389cb}
.nfgfn-formula{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;}
.nfgfn-formula>div{border:1px solid #e0eaf1;border-radius:13px;padding:15px;background:#f6f9fc;min-width:0}
.nfgfn-formula .nfgfn-pos{font-size:.74rem;font-weight:900;text-transform:uppercase;letter-spacing:.07em;display:block;margin-bottom:6px}
.nfgfn-formula strong{display:block;font-size:.97rem;line-height:1.35;color:#10223c}
.nfgfn-formula p{margin:7px 0 0;color:#59728a;font-size:.84rem;line-height:1.45}
.nfgfn-map-grid{display:grid;align-items:stretch}
.nfgfn-map-panel{overflow:hidden;min-width:0;display:flex;flex-direction:column}
.nfgfn-world-map{position:relative;}
.nfgfn-map-status{margin:0;font-size:.84rem;line-height:1.4;}
.nfgfn-region-panel{min-width:0}
.nfgfn-legend{display:grid;grid-template-columns:1fr;list-style:none;margin:0;padding:0}
.nfgfn-legend li{margin:0;padding:0}
.nfgfn-region-btn{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:1px solid transparent;background:transparent;font-family:inherit;cursor:pointer;line-height:1.3;}
.nfgfn-region-btn:hover,.nfgfn-region-btn:focus-visible,.nfgfn-region-btn[aria-pressed=true]{background:#e0f0fa;border-color:#b3dbed;outline:none}
.nfgfn-region-btn b{display:inline-grid;place-items:center;flex:none;font-weight:900;color:#fff;background:var(--nfgfn-region-color);text-shadow:0 1px 1px rgba(0,0,0,.3)}
.nfgfn-legend li:last-child b{color:#243a4b;text-shadow:none}
.nfgfn-legend-tip{line-height:1.5}
.nfgfn-hubs{border-top:1px solid #dde9f2;padding-top:23px}
.nfgfn-hubs h3{margin-bottom:8px}
.nfgfn-hubs p{margin:0 0 14px;color:#58738e;font-size:.88rem;line-height:1.55}
.nfgfn-hub-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}
.nfgfn-hub-item{background:#f1f7fc;border:1px solid #d8e8f3;border-radius:10px;color:#18344e;min-width:0}
.nfgfn-hub-item b{font-size:1.28rem;color:#0b84c3;flex:none}
.nfgfn-hub-item span{font-size:.85rem;}
.nfgfn-example-notes{margin-top:22px;border-top:1px solid #dde9f2;padding-top:23px;display:grid;grid-template-columns:1fr 1fr;gap:18px}
.nfgfn-example-notes p{margin:7px 0;color:#56728c;font-size:.94rem;line-height:1.6}
.nfgfn-example-notes strong{color:#17344f}
@media(max-width:1050px){.nfgfn-hub-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.nfgfn-formula{grid-template-columns:repeat(2,minmax(0,1fr))}.nfgfn-example-notes{grid-template-columns:1fr}.nfgfn-hub-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:410px){.nfgfn-number-example{gap:7px}.nfgfn-number-example .nfgfn-num{padding:7px 11px}.nfgfn-number-example .nfgfn-num em{font-size:1.15rem;margin-right:8px}.nfgfn-number-example .nfgfn-num i{font-size:1.15rem}.nfgfn-formula>div{padding:11px}}

/* v564: self-contained map; no dependency on Leaflet layout or CDN. */
.nfgfn-world-map .nfgfn-country{vector-effect:non-scaling-stroke}
.nfgfn-world-map .nfgfn-country:hover{stroke:#fff}

/* v565 – NordFly Region Atlas. A custom vector map, not a screenshot-like image. */
.nfgfn-map-grid{
  grid-template-columns:minmax(0,1.75fr) minmax(300px,.9fr);
  gap:14px;
}
.nfgfn-map-panel{
  border:1px solid #244869;
  border-radius:18px;
  box-shadow:0 18px 40px rgba(7,32,63,.13);
  background:#0a1e38;
}
.nfgfn-world-map{
  height:460px;
  min-height:460px;
  flex:1;
  overflow:hidden;
  background:#07192f;
  isolation:isolate;
}
.nfgfn-world-map::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(6,21,38,.26) 0%,transparent 22%,transparent 75%,rgba(6,21,38,.39) 100%);
}
.nfgfn-world-map .nfgfn-map-svg{display:block;width:100%;height:100%;background:none}
.nfgfn-map-svg .nfgfn-country{
  stroke:#102d44;
  stroke-width:1.0;
  stroke-linejoin:round;
  stroke-opacity:.94;
  cursor:pointer;
  transition:fill .18s ease,opacity .18s ease,stroke .18s ease,stroke-width .18s ease;
}
.nfgfn-map-svg .nfgfn-country.is-hovered{
  stroke:#ebfaff;
  stroke-width:2.2;
  stroke-opacity:1;
}
.nfgfn-map-svg .nfgfn-country.is-dimmed{opacity:.4}
.nfgfn-map-svg .nfgfn-country.is-selected{
  stroke:#ecfaff;
  stroke-width:1.7;
  stroke-opacity:1;
}
/* v579: keep small Region-9 islands coloured rather than obscured by a white selection outline. */
.nfgfn-map-svg .nfgfn-country.nfgfn-small-island{stroke-width:.55}
.nfgfn-map-svg .nfgfn-country.nfgfn-small-island.is-selected{stroke-width:.6}
.nfgfn-map-svg .nfgfn-country.nfgfn-small-island.is-hovered{stroke-width:1.05}
.nfgfn-map-svg .nfgfn-graticules .nfgfn-equator{stroke:#6eb7d7;stroke-opacity:.31;stroke-dasharray:5 7}
.nfgfn-map-annotations text{paint-order:stroke;stroke:#092039;stroke-opacity:.4;stroke-width:3;pointer-events:none}
.nfgfn-map-hud{
  position:absolute;
  z-index:2;
  top:17px;
  left:18px;
  display:flex;
  align-items:center;
  gap:9px;
  color:#bfefff;
  letter-spacing:.15em;
  font-weight:900;
  text-shadow:0 2px 8px #0c243d;
  pointer-events:none;
}
.nfgfn-hud-marker{
  width:9px;
  height:9px;
  border:2px solid #53d9ff;
  border-radius:50%;
  box-shadow:0 0 0 4px rgba(65,203,252,.16),0 0 13px rgba(65,203,252,.4);
}
.nfgfn-hud-sep{color:#3f91ba;margin:0 5px}
.nfgfn-map-corner{
  position:absolute;
  z-index:2;
  top:14px;
  right:15px;
  border:1px solid rgba(159,213,243,.16);
  border-radius:8px;
  padding:6px 9px;
  background:rgba(3,18,36,.5);
  backdrop-filter:blur(8px);
  color:#9fbbd0;
  letter-spacing:.11em;
  font-weight:800;
  pointer-events:none;
}
.nfgfn-map-note{
  position:absolute;
  z-index:2;
  bottom:18px;
  left:18px;
  right:18px;
  display:inline-flex;
  align-items:center;
  width:fit-content;
  max-width:calc(100% - 36px);
  border:1px solid rgba(124,196,230,.2);
  border-radius:9px;
  background:rgba(4,22,42,.75);
  color:#d6effb;
  backdrop-filter:blur(9px);
  padding:10px 13px;
  font-size:.75rem;
  line-height:1.4;
  pointer-events:none;
}
.nfgfn-map-status{
  position:relative;
  border-top:1px solid rgba(112,179,215,.15);
  background:linear-gradient(90deg,#0a223f,#0d2a48);
  color:#d0e6f4;
  padding:13px 19px;
  min-height:47px;
}
.nfgfn-region-panel{
  border:1px solid #244869;
  border-radius:18px;
  background:linear-gradient(150deg,#102c4b 0%,#081d35 100%);
  color:#e8f5ff;
  box-shadow:0 18px 40px rgba(7,32,63,.13);
}
.nfgfn-region-panel h3{color:#f4faff;margin:0 0 13px;font-size:1rem}
.nfgfn-region-selection{
  --nfgfn-selection-accent:#3eb8ed;
  position:relative;
  display:flex;
  flex-direction:column;
  gap:4px;
  margin:0 0 14px;
  padding:13px 14px 13px 17px;
  border-radius:11px;
  background:linear-gradient(90deg,rgba(31,87,127,.34),rgba(18,46,77,.36));
  border:1px solid rgba(130,197,235,.15);
  overflow:hidden;
}
.nfgfn-region-selection::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:3px;
  background:var(--nfgfn-selection-accent);
}
.nfgfn-selection-kicker{
  font-weight:900;
  letter-spacing:.12em;
  color:#6ccefb;
}
.nfgfn-selection-name{font-size:.95rem;color:#f3faff;line-height:1.3}
.nfgfn-selection-copy{color:#b4cee1;line-height:1.5}
.nfgfn-legend li{min-width:0}
.nfgfn-region-btn{
  padding:7px 9px;
  border-color:transparent;
  border-radius:9px;
  color:#c4d9e9;
  font-size:.78rem;
  transition:background .18s ease,border-color .18s ease,transform .18s ease;
}
.nfgfn-region-btn:hover,.nfgfn-region-btn:focus-visible{
  color:#fff;
  border-color:rgba(80,184,239,.38);
  background:rgba(63,141,197,.2);
  outline:2px solid transparent;
}
.nfgfn-region-btn[aria-pressed=true]{
  color:#fff;
  border-color:rgba(96,192,241,.48);
  background:rgba(55,124,170,.3);
  box-shadow:inset 0 0 0 1px rgba(121,202,243,.06);
}
.nfgfn-region-btn b{
  border-radius:8px;
  width:29px;
  height:29px;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.2),0 2px 8px rgba(0,0,0,.2);
}
.nfgfn-legend-tip{
  color:#99b5cb;
  border-top:1px solid rgba(143,195,231,.15);
  margin:12px 0 0;
  padding-top:12px;
  font-size:.73rem;
}
@media(max-width:1050px){
  .nfgfn-map-grid{grid-template-columns:minmax(0,1.3fr) minmax(265px,.85fr)}
  .nfgfn-world-map{height:370px;min-height:370px}
  .nfgfn-map-annotations text{font-size:10px}
}
@media(max-width:720px){
  .nfgfn-map-grid{grid-template-columns:1fr;gap:12px}
  .nfgfn-world-map{height:325px;min-height:325px}
  .nfgfn-region-panel{padding:16px}
  .nfgfn-legend{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 8px}
  .nfgfn-map-note{font-size:.7rem}
}
@media(max-width:440px){
  .nfgfn-world-map{height:245px;min-height:245px}
  .nfgfn-map-hud{top:12px;left:12px;}
  .nfgfn-map-corner{top:10px;right:10px;}
  .nfgfn-map-note{left:10px;bottom:9px;padding:7px 9px;font-size:.61rem}
  .nfgfn-legend{grid-template-columns:1fr}
  .nfgfn-map-annotations{display:none}
}
/* Keep the atlas balanced: the legend must not stretch the map into a tall empty panel. */
@media(min-width:721px){
  .nfgfn-region-panel{padding:15px 17px}
  .nfgfn-region-panel h3{margin-bottom:9px}
  .nfgfn-region-selection{padding:10px 12px 10px 15px;margin-bottom:9px;gap:3px}
  .nfgfn-selection-copy{line-height:1.35}
  .nfgfn-legend{gap:0}
  .nfgfn-region-btn{padding:4px 7px;font-size:.755rem}
  .nfgfn-region-btn b{width:26px;height:26px}
  .nfgfn-legend-tip{margin-top:9px;padding-top:9px;line-height:1.42}
}


/* v569 – two independent, alternating background sections. */
.nfgfn-guide-section{
  background:#fff;
  padding:70px 0 76px;
}
.nfgfn-guide-section .nfgfn-frame{
  background:#fff;border-color:#d8e7f1;
  box-shadow:0 14px 35px rgba(16,46,75,.05);
}
.nfgfn-guide-section .nfgfn-formula{margin-bottom:0;}
.nfgfn-guide-section .nfgfn-hubs{margin-top:26px;}
.nfgfn-atlas-section{
  background:#f0f5fa;
  padding:70px 0 76px;
}
.nfgfn-atlas-section .nfgfn-intro{margin-bottom:26px;}
.nfgfn-atlas-section .nfgfn-map-grid{margin:0;}
.nfgfn-atlas-section .nfgfn-atlas-note{
  font-size:.8rem;line-height:1.55;margin:18px 0 0;
}
@media(max-width:720px){
  .nfgfn-guide-section,.nfgfn-atlas-section{padding:45px 0 54px;}
  .nfgfn-atlas-section .nfgfn-intro{margin-bottom:21px;}
}

/* v572 – colour the four digits consistently in the cards and the example explanation. */
.nfgfn-formula > div:nth-child(1) .nfgfn-pos,
.nfgfn-number-example .nfgfn-number-explanation .nfgfn-digit-1 { color:#f6a414; }
.nfgfn-formula > div:nth-child(2) .nfgfn-pos,
.nfgfn-number-example .nfgfn-number-explanation .nfgfn-digit-2 { color:#609c45; }
.nfgfn-formula > div:nth-child(3) .nfgfn-pos,
.nfgfn-number-example .nfgfn-number-explanation .nfgfn-digit-3 { color:#f04443; }
.nfgfn-formula > div:nth-child(4) .nfgfn-pos,
.nfgfn-number-example .nfgfn-number-explanation .nfgfn-digit-4 { color:#1389cb; }
.nfgfn-number-example .nfgfn-number-explanation .nfgfn-digit { font-weight:800; }

/* v584: slightly slimmer base/flight-type cards while retaining centered labels. */
.nfgfn-guide-section .nfgfn-hub-grid .nfgfn-hub-item{
  min-height:64px;
  padding:10px 16px;
  display:flex;
  align-items:center;
  gap:12px;
}
.nfgfn-guide-section .nfgfn-hub-grid .nfgfn-hub-item b{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1.15;
  margin:0;
  transform:translateY(1px);
}
.nfgfn-guide-section .nfgfn-hub-grid .nfgfn-hub-item span{
  display:block;
  line-height:1.35;
  margin:0;
}


/* v581: Hover/focus of a digit explanation card magnifies just the
   matching position in NF 4010; transform prevents any layout shift. */
.nfgfn-guide-section .nfgfn-number-example .nfgfn-num > i{
  display:inline-block;
  transform:scale(1);
  transform-origin:center;
  transition:transform .18s ease;
}
.nfgfn-guide-section .nfgfn-frame:has(.nfgfn-formula > div:nth-child(1):is(:hover,:focus-visible)) .nfgfn-num > i:nth-of-type(1),
.nfgfn-guide-section .nfgfn-frame:has(.nfgfn-formula > div:nth-child(2):is(:hover,:focus-visible)) .nfgfn-num > i:nth-of-type(2),
.nfgfn-guide-section .nfgfn-frame:has(.nfgfn-formula > div:nth-child(3):is(:hover,:focus-visible)) .nfgfn-num > i:nth-of-type(3),
.nfgfn-guide-section .nfgfn-frame:has(.nfgfn-formula > div:nth-child(4):is(:hover,:focus-visible)) .nfgfn-num > i:nth-of-type(4){
  transform:scale(1.28);
}
.nfgfn-guide-section .nfgfn-formula > div:focus-visible{
  outline:2px solid #218ec9;
  outline-offset:2px;
}

/* v582: Highlight the card itself while its matching digit in NF 4010 grows.
   All movement uses transforms; no surrounding elements are reflowed. */
.nfgfn-guide-section .nfgfn-formula > div{
  transition:background-color .18s ease,border-color .18s ease,
             box-shadow .18s ease,transform .18s ease;
}
.nfgfn-guide-section .nfgfn-formula > div:nth-child(1){--nfgfn-card-accent:#f6a414}
.nfgfn-guide-section .nfgfn-formula > div:nth-child(2){--nfgfn-card-accent:#609c45}
.nfgfn-guide-section .nfgfn-formula > div:nth-child(3){--nfgfn-card-accent:#f04443}
.nfgfn-guide-section .nfgfn-formula > div:nth-child(4){--nfgfn-card-accent:#1389cb}
.nfgfn-guide-section .nfgfn-formula > div:is(:hover,:focus-visible){
  background-color:color-mix(in srgb,var(--nfgfn-card-accent) 9%,#f6f9fc);
  border-color:var(--nfgfn-card-accent);
  box-shadow:0 9px 22px rgba(12,48,83,.16);
  transform:translateY(-2px);
}


/* v590: the legend's interactive description must not resize when a region
   is selected. The second (empty) line is reserved for every state. */
.nfgfn-atlas-section .nfgfn-region-selection .nfgfn-selection-name{
  min-height:2.6em; /* reserve 2 lines at line-height 1.3 */
}
.nfgfn-atlas-section .nfgfn-region-selection .nfgfn-selection-copy{
  min-height:3em; /* reserve 2 lines at line-height 1.5 */
}
@media(min-width:721px){
  .nfgfn-atlas-section .nfgfn-region-selection .nfgfn-selection-copy{
    min-height:2.7em; /* desktop line-height is 1.35 */
  }
}
}
