<style>
/* ── Reset ── */
*, *::before, *::after { box-sizing: border-box; }
html { font-size: 62.5%; }
body { margin: 0; font-family: 'Poppins', sans-serif; font-size: 1.6rem; color: #1b1e3c; -webkit-font-smoothing: antialiased; }

/* ── Tokens ── */
:root {
  --pg-navy:   #00044b;
  --pg-pink:   #ff0268;
  --pg-pink-h: #d4025b;
  --pg-white:  #ffffff;
  --pg-ink:    #0a0a0a;
  --pg-slate:  #2d3060;
  --pg-muted:  #6b7289;
  --pg-border: rgba(10,10,10,.08);
  --pg-hh:     74px;
  --pg-mw:     1300px;
  --pg-ease:   cubic-bezier(.4,0,.2,1);
}

/* ══════════════════════════════════════════════
   HEADER
══════════════════════════════════════════════ */
.pg-header {
  position: sticky;
  top: 0;
  z-index: 500;
	padding:0px;
  height: var(--pg-hh);
  background: var(--pg-navy);
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.pg-inner {
  max-width: var(--pg-mw);
  margin: 0 auto;
  padding: 0 32px;
  height: 100%;
  display: flex;
  align-items: center;
}

/* ── Logo ── */
.pg-logo {
  flex-shrink: 0;
  margin-right: 36px;
  display: flex;
  align-items: center;
  position: relative;
  z-index: 2;
  text-decoration: none;
}
.pg-logo img { height: 44px; width: auto; }

/* ══════════════════════════════════════════════
   DESKTOP NAV
══════════════════════════════════════════════ */
.pg-nav {
  flex: 1;
  display: flex;
  align-items: stretch;
  height: 100%;
  list-style: none;
  margin: 0; padding: 0;
}
.pg-nav__item {
  position: static;
  display: flex;
  align-items: stretch;
}

/* Trigger */
.pg-trigger {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0 16px;
  height: 100%;
  color: rgba(255,255,255,.72);
  font-family: 'Poppins', sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: .01em;
  white-space: nowrap;
  cursor: pointer;
  text-decoration: none !important;
  background: none;
  border: none;
  position: relative;
  z-index: 2;
  transition: color .18s var(--pg-ease);
}

/* Dot indicator (replaces border-bottom underline) */
.pg-trigger::after {
  content: '';
  position: absolute;
  bottom: 13px;
  left: 50%;
  transform: translateX(-50%) scale(0);
  width: 5px; height: 5px;
  border-radius: 50%;
  background: var(--pg-pink);
  transition: transform .22s var(--pg-ease);
}
.pg-nav__item:hover > .pg-trigger,
.pg-nav__item.is-open > .pg-trigger { color: #fff; }
.pg-nav__item:hover > .pg-trigger::after,
.pg-nav__item.is-open > .pg-trigger::after { transform: translateX(-50%) scale(1); }

/* Active page link */
.pg-trigger--active { color: #fff !important; }
.pg-trigger--active::after { transform: translateX(-50%) scale(1) !important; }

/* Caret */
.pg-trigger .caret {
  width: 9px; height: 5px;
  flex-shrink: 0;
  opacity: .45;
  transition: transform .22s var(--pg-ease), opacity .18s;
}
.pg-nav__item:hover > .pg-trigger .caret,
.pg-nav__item.is-open > .pg-trigger .caret { transform: rotate(180deg); opacity: 1; }

/* ══════════════════════════════════════════════
   MEGA PANEL — full-width, flush to header
══════════════════════════════════════════════ */
.pg-panel {
  position: fixed;
  top: var(--pg-hh);
  left: 0; right: 0;
  background: var(--pg-white);
  border-top: 2px solid var(--pg-pink);
  box-shadow: 0 28px 72px rgba(0,4,75,.11), 0 1px 0 rgba(0,0,0,.04);
  z-index: 490;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-8px);
  pointer-events: none;
  transition: opacity .22s var(--pg-ease), transform .22s var(--pg-ease), visibility 0s .22s;
}
.pg-nav__item:hover > .pg-panel,
.pg-nav__item.is-open > .pg-panel {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
  transition-delay: 0s;
}

/* Panel body: spotlight left + columns right */
.pg-panel__body {
  max-width: var(--pg-mw);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 270px 1fr;
}

/* Column stagger animation */
@keyframes pgColIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}
.pg-nav__item:hover .pg-col:nth-child(1),
.pg-nav__item.is-open .pg-col:nth-child(1) { animation: pgColIn .26s .04s both; }
.pg-nav__item:hover .pg-col:nth-child(2),
.pg-nav__item.is-open .pg-col:nth-child(2) { animation: pgColIn .26s .09s both; }
.pg-nav__item:hover .pg-col:nth-child(3),
.pg-nav__item.is-open .pg-col:nth-child(3) { animation: pgColIn .26s .14s both; }
.pg-nav__item:hover .pg-col:nth-child(4),
.pg-nav__item.is-open .pg-col:nth-child(4) { animation: pgColIn .26s .19s both; }

/* ── Spotlight (navy left zone) ── */
.pg-spot {
  background: var(--pg-navy);
  padding: 32px 28px;
  display: flex;
  flex-direction: column;
}
.pg-spot__ey {
  font-size: .92rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--pg-pink);
  margin-bottom: 14px;
}
.pg-spot__h {
  font-family: 'Poppins', sans-serif;
  font-size: 18.8px;
  font-weight: 700;
  color: #fff;
  line-height: 1.35;
  margin: 0 0 10px;
}
.pg-spot__d {
  font-size: 1.2rem;
  color: rgba(255,255,255,.46);
  line-height: 1.74;
  margin: 0 0 auto;
}
.pg-spot__stats {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin: 22px 0 20px;
  padding-top: 18px;
  border-top: 1px solid rgba(255,255,255,.1);
}
.pg-spot__stat strong {
    display: block;
    font-size: 19.5px;
    font-weight: 800;
    color: #fff;
    line-height: 1;
    margin-bottom: 4px;
}
.pg-spot__stat span {
  font-size: 1.0rem;
  color: rgba(255,255,255,.4);
  font-weight: 500;
}
.pg-spot__cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 18px;
  background: var(--pg-pink);
  color: #fff !important;
  font-family: 'Poppins', sans-serif;
  font-size: 1.28rem;
  font-weight: 600;
  text-decoration: none !important;
  transition: background .15s, gap .15s;
  align-self: flex-start;
}
.pg-spot__cta:hover { background: var(--pg-pink-h); gap: 13px; }
.pg-spot__cta svg { width: 12px; height: 12px; flex-shrink: 0; }

/* ── Columns (right zone) ── */
.pg-cols {
  padding: 32px 32px;
  display: grid;
  gap: 0;
  align-items: start;
}
.pg-cols--3   { grid-template-columns: repeat(3,1fr); }
.pg-cols--4   { grid-template-columns: repeat(4,1fr); }
.pg-cols--2x2 { grid-template-columns: repeat(2,1fr); }

/* General column */
.pg-col { padding: 0 24px; border-right: 1px solid var(--pg-border); }
.pg-col:first-child { padding-left: 0; }
.pg-col:last-child  { border-right: none; padding-right: 0; }

/* 2×2 grid overrides */
.pg-cols--2x2 .pg-col { padding: 0 24px; border-right: 1px solid var(--pg-border); }
.pg-cols--2x2 .pg-col:nth-child(odd)  { padding-left: 0; }
.pg-cols--2x2 .pg-col:nth-child(even) { border-right: none; padding-right: 0; }
.pg-cols--2x2 .pg-col:nth-child(1),
.pg-cols--2x2 .pg-col:nth-child(2)    { border-bottom: 1px solid var(--pg-border); padding-bottom: 20px; margin-bottom: 20px; }
.pg-cols--2x2 .pg-col:nth-child(3),
.pg-cols--2x2 .pg-col:nth-child(4)    { border-bottom: none; }

/* Column label */
.pg-col__label {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--pg-pink);
  margin-bottom: 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--pg-border);
  display: block;
  text-decoration: none;
  transition: color .15s;
}
span.pg-col__label { cursor: default; }
a.pg-col__label:hover { color: var(--pg-pink-h); }

/* Links */
.pg-links { list-style: none; margin: 0; padding: 0; }
.pg-links li a { margin: 0; }
.pg-link a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 0 6px 12px;
  font-size: 13px;
  font-weight: 400;
  color: var(--pg-slate);
  border-left: 2px solid transparent;
  text-decoration: none !important;
  line-height: 1.4;
  transition: color .13s, border-left-color .13s, padding-left .13s var(--pg-ease);
}
.pg-link a:hover {
  color: var(--pg-pink);
  border-left-color: var(--pg-pink);
  padding-left: 16px;
}
.pg-link--lead a { font-weight: 600; color: var(--pg-ink); }
.pg-link--lead a:hover { color: var(--pg-pink); }

/* Badge */
.pg-badge {
  display: inline-flex;
  align-items: center;
  padding: 1px 7px;
  border-radius: 20px;
  font-size: .88rem;
  font-weight: 700;
  flex-shrink: 0;
}
.pg-badge--hot { background: #fff0f5; color: var(--pg-pink); }

/* Divider + view-all */
.pg-divider { border: none; border-top: 1px solid var(--pg-border); margin: 10px 0 6px; }
.pg-view-all {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 0;
  font-size: 11.8px;
  font-weight: 600;
  color: var(--pg-pink);
  text-decoration: none !important;
  transition: gap .15s;
}
.pg-view-all svg { width: 12px; height: 12px; flex-shrink: 0; }
.pg-view-all:hover { gap: 10px; }

/* ══════════════════════════════════════════════
   BACKDROP
══════════════════════════════════════════════ */
.pg-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0,4,60,.45);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  z-index: 480;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .2s var(--pg-ease), visibility 0s .2s;
}
.pg-backdrop.is-visible {
  opacity: 1; visibility: visible;
  pointer-events: auto;
  transition-delay: 0s;
}

/* ══════════════════════════════════════════════
   DESKTOP CTA
══════════════════════════════════════════════ */
.pg-cta {
    flex-shrink: 0;
    margin-left: 20px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 20px 22px;
    background: var(--pg-pink);
    color: #fff !important;
    border-radius: 6px;
    font-family: 'Poppins', sans-serif;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    position: relative;
    z-index: 2;
    transition: background .16s;
    text-decoration: none !important;
}
.pg-cta:hover { background: var(--pg-pink-h); }

/* ══════════════════════════════════════════════
   HAMBURGER
══════════════════════════════════════════════ */
.pg-burger {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 44px; height: 44px;
  border: 1.5px solid rgba(255,255,255,.22);
  flex-shrink: 0;
  margin-left: 10px;
  position: relative; z-index: 2;
  background: none;
  cursor: pointer;
  transition: background .15s, border-color .15s;
}
.pg-burger:hover { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.42); }
.pg-burger span {
  display: block;
  height: 2px; background: #fff; border-radius: 2px;
  transform-origin: center;
  transition: transform .28s var(--pg-ease), opacity .2s, width .22s var(--pg-ease);
}
.pg-burger span:nth-child(1) { width: 20px; }
.pg-burger span:nth-child(2) { width: 13px; }
.pg-burger span:nth-child(3) { width: 20px; }
.pg-burger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); width: 20px; }
.pg-burger.is-open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.pg-burger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); width: 20px; }

/* ══════════════════════════════════════════════
   MOBILE (≤ 1024px) — right-side drawer
══════════════════════════════════════════════ */
@media (max-width: 1024px) {
  .pg-header { height: 62px !important; }
  :root { --pg-hh: 62px; }
  .pg-logo img { height: 38px; }
  .pg-logo     { margin-right: auto; }
  .pg-cta      { display: none; }
  .pg-burger   { display: flex; }

  /* ── Full-screen overlay ── */
  .pg-nav {
    position: fixed;
    inset: 0;
    width: 100%;
    background: var(--pg-navy);
    z-index: 600;
    flex-direction: column;
    align-items: stretch;
    height: 100%;
    /* Fade + slight scale — more premium than a slide */
    opacity: 0;
    visibility: hidden;
    transform: scale(1.04);
    pointer-events: none;
/*     transition: opacity .3s var(--pg-ease), transform .3s var(--pg-ease), visibility 0s .3s; */
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
  }
	.pg-nav.preload {
    visibility: visible !important;
    opacity: 0 !important;
    transform: translateX(0) !important;
    pointer-events: none !important;
}
	
  .pg-nav.is-open {
    opacity: 1;
    visibility: visible;
    transform: scale(1);
    pointer-events: auto;
    transition-delay: 0s;
  }

  /* Sticky overlay top bar */
  .pg-drawer-head {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    padding: 12px 32px;
    background: var(--pg-navy);
    border-bottom: 1px solid rgba(255,255,255,.1);
    flex-shrink: 0;
    position: sticky;
    top: 0;
    z-index: 1;
  }
  .pg-drawer-head img { height: 38px; }

  /* X close button */
  .pg-overlay-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px; height: 44px;
    border: 1.5px solid rgba(255,255,255,.2);
    background: none;
    cursor: pointer;
    color: #fff;
    flex-shrink: 0;
    transition: background .15s, border-color .15s;
  }
  .pg-overlay-close:hover { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.42); }
  .pg-overlay-close svg { width: 18px; height: 18px; pointer-events: none; }

  /* Nav list */
  .pg-nav__list { flex: 1; display: flex !important; flex-direction: column; padding: 0; }
  .pg-nav__item { display: block; border-bottom: 1px solid rgba(255,255,255,.08); }
  .pg-nav__item:last-child { border-bottom: none; }

  /* Large overlay triggers */
  .pg-trigger {
    width: 100%; padding: 22px 24px;
    height: auto;
    color: rgba(255,255,255,.75);        line-height: 26px;
    font-size: 22px; font-weight: 700;
    justify-content: space-between;
    letter-spacing: -.01em;
  }
  .pg-trigger::after { display: none; }
  .pg-trigger .caret { width: 14px; height: 8px; opacity: .45; }
  .pg-nav__item.is-open > .pg-trigger { color: var(--pg-pink); }
  .pg-nav__item.is-open > .pg-trigger .caret { transform: rotate(180deg); opacity: 1; }
  .pg-nav__item:hover > .pg-trigger { color: rgba(255,255,255,.75); }
  .pg-nav__item.is-open:hover > .pg-trigger { color: var(--pg-pink); }

  /* Accordion panel — on dark overlay */
  .pg-panel {
    position: static !important;
    opacity: 1 !important; visibility: visible !important; transform: none !important;
    box-shadow: none; border-top: none;
    border-left: 3px solid var(--pg-pink);
    background: rgba(255,255,255,.04);
    max-height: 0; overflow: hidden;
    pointer-events: auto; z-index: auto;
    transition: max-height .35s var(--pg-ease) !important;
  }
  .pg-nav__item.is-open > .pg-panel {
    max-height: 3000px;
    transition: max-height .45s cubic-bezier(0,0,.2,1) !important;
  }

  /* Panel layout — spotlight hidden, flat link list only */
  .pg-panel__body { grid-template-columns: 1fr; }
  .pg-spot { display: none; }
  .pg-cols { padding: 14px 24px; grid-template-columns: 1fr !important; row-gap: 0 !important; }
  .pg-col {
    padding: 0 !important;
    border-right: none !important;
    border-bottom: 1px solid rgba(255,255,255,.08) !important;
    padding-bottom: 14px !important;
    margin-bottom: 14px !important;
  }
  .pg-col:last-child { border-bottom: none !important; margin-bottom: 0 !important; padding-bottom: 0 !important; }

  /* Dark-background typography */
  .pg-col__label  { color: rgba(255,255,255,.36) !important; border-bottom-color: rgba(255,255,255,.1) !important; }
  .pg-link a        { color: rgba(255,255,255,.62); font-size: 14.8px; padding: 9px 0 9px 14px; }
  .pg-link a:hover, .pg-link a:focus  { color: #fff; border-left-color: var(--pg-pink); padding-left: 18px; }
  .pg-link--lead a  { color: rgba(255,255,255,.9) !important; }
  .pg-link--lead a:hover { color: #fff !important; }
  .pg-view-all    { color: var(--pg-pink); }
  .pg-divider     { border-top-color: rgba(255,255,255,.1); }
  .pg-badge--hot  { background: rgba(255,2,104,.18); color: var(--pg-pink); }

  /* Stagger nav items as overlay opens */
  @keyframes pgItemIn {
    from { opacity: 0; transform: translateY(14px); }
    to   { opacity: 1; transform: translateY(0); }
  }
  .pg-nav.is-open .pg-nav__list .pg-nav__item:nth-child(1) { animation: pgItemIn .3s .06s both; }
  .pg-nav.is-open .pg-nav__list .pg-nav__item:nth-child(2) { animation: pgItemIn .3s .12s both; }
  .pg-nav.is-open .pg-nav__list .pg-nav__item:nth-child(3) { animation: pgItemIn .3s .18s both; }
  .pg-nav.is-open .pg-nav__list .pg-nav__item:nth-child(4) { animation: pgItemIn .3s .24s both; }
  .pg-nav.is-open .pg-nav__list .pg-nav__item:nth-child(5) { animation: pgItemIn .3s .30s both; }
  .pg-nav__item.is-open .pg-col { animation: none; }

  /* Sticky bottom CTA */
  .pg-drawer-cta {
    display: block !important;
    padding: 16px 24px;
    border-top: 1px solid rgba(255,255,255,.1);
    flex-shrink: 0;
    background: var(--pg-navy);
    position: sticky;
    bottom: 0;
  }
  .pg-drawer-cta a {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    padding: 16px; background: var(--pg-pink); color: #fff;
    font-family: 'Poppins', sans-serif; font-size: 1.56rem; font-weight: 700;
    transition: background .15s; text-decoration: none;
  }
  .pg-drawer-cta a:hover { background: var(--pg-pink-h); }
}

/* Always hide mobile-only elements on desktop */
.pg-drawer-head,
.pg-drawer-cta { display: none; }

/* ── Language switcher ── */
.pg-lang{position:relative}
.pg-lang__btn{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:6px;color:rgba(255,255,255,.75);font-family:'Poppins',sans-serif;font-size:1.3rem;font-weight:500;cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s,color .15s}
.pg-lang__btn:hover,.pg-lang.is-open .pg-lang__btn{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.26);color:#fff}
.pg-lang__btn .caret{width:8px;height:5px;opacity:.45;transition:transform .2s var(--pg-ease)}
.pg-lang.is-open .pg-lang__btn .caret{transform:rotate(180deg);opacity:1}
.pg-lang__globe{width:14px;height:14px;flex-shrink:0}
.pg-lang__drop{position:absolute;top:calc(100% + 8px);right:0;min-width:156px;background:var(--pg-navy);border:1px solid rgba(255,255,255,.1);border-radius:8px;box-shadow:0 16px 40px rgba(0,4,75,.3);padding:4px;list-style:none;margin:0;z-index:520;opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .18s var(--pg-ease),transform .18s var(--pg-ease),visibility 0s .18s}
.pg-lang.is-open .pg-lang__drop{opacity:1;visibility:visible;transform:translateY(0);transition-delay:0s}
.pg-lang__opt{display:flex;align-items:center;padding:9px 12px;border-radius:6px;color:rgba(255,255,255,.65);font-family:'Poppins',sans-serif;font-size:1.3rem;font-weight:500;text-decoration:none!important;transition:background .12s,color .12s}
.pg-lang__opt:hover{background:rgba(255,255,255,.07);color:#fff}
.pg-lang__opt--active{color:#fff}
.pg-lang__opt--active::after{content:'✓';margin-left:auto;font-size:1.1rem;color:var(--pg-pink)}
.pg-lang--desktop{display:flex;align-items:center;margin-left:12px}
.pg-lang--mobile{display:none}
@media(max-width:1024px){
  .pg-lang--desktop{display:none}
  .pg-lang--mobile{display:flex;align-items:center;padding:14px 24px 20px;border-top:1px solid rgba(255,255,255,.08);flex-shrink:0}
  .pg-lang--mobile .pg-lang__drop{top:auto;bottom:calc(100% + 8px)}
}

/* ══════════════════════════════════════════════
   DEMO PAGE FILLER
══════════════════════════════════════════════ */
.pg-demo-body {
  min-height: calc(100vh - var(--pg-hh));
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 16px; padding: 60px 24px; text-align: center;
  background: #f7f5f0;
  font-family: 'Poppins', sans-serif;
}
.pg-demo-body h1 {
  font-size: clamp(2.8rem,4vw,4.6rem);
  font-weight: 700; color: var(--pg-navy); line-height: 1.2; margin: 0;
}
.pg-demo-body p { font-size: 1.7rem; color: var(--pg-muted); max-width: 520px; margin: 0; }
.pg-demo-hint {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 18px; background: #fff;
  border: 1px solid rgba(10,10,10,.08);
  font-size: 1.28rem; color: var(--pg-muted);
  box-shadow: 0 2px 12px rgba(0,4,75,.06);
  margin-top: 4px;
}
</style>