/* Platform mega menu (website/nav-platform-desktop and -mobile, English pages only).
   Loaded after site-fixes.css on every page that renders it.
   It carries its own dark surface so it looks the same under the light and the dark
   header; the .pm- prefix keeps it clear of the migrated stylesheet. The item is made
   static so the panel is centred on the header bar instead of under the word
   "Platform", which would push a 1100px panel off the left edge. */
.Nav--main-header .Nav-item.has-dropdown:has(>.Nav-dropdown--platform){position:static}
.Header-bottom .Container{position:relative}
.Header .Nav--main-header .Nav-dropdown.Nav-dropdown--platform{
  --pm-turq:#50bcbd;--pm-turq80:#73c9ca;--pm-navy-dark:#08142e;
  top:100%;left:50%;right:auto;transform:translateX(-50%);width:min(1112px,calc(100vw - 308px));min-width:0;
  padding:26px 26px 24px;border-radius:24px;border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(145deg,#1f3460 0%,#142447 58%,#0f1d3c 100%);color:#fff;
  box-shadow:0 30px 70px rgba(8,20,46,.55);
  grid-template-columns:minmax(0,4.34fr) minmax(0,4.34fr) minmax(206px,236px);gap:22px;
  font-family:inherit;text-align:left;
}
.Header .Nav--main-header .Nav-dropdown.Nav-dropdown--platform.is-active{display:grid}
/* The translated titles are longer: give the columns more room so a go-live badge stays on the title's line where the window allows. */
html:not([lang="en"]) .Header .Nav--main-header .Nav-dropdown.Nav-dropdown--platform{width:min(1300px,calc(100vw - 100px))}
.Header .Nav--main-header .Nav-dropdown--platform::before{display:block;content:"";background:none;position:absolute;top:-14px;left:0;right:0;width:auto;height:14px;transform:none}
.Nav-dropdown--platform ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.Nav-dropdown--platform li{margin:0}
.Nav-dropdown--platform li::before,.Nav-dropdown--platform li::after{display:none;content:none}
.Nav-dropdown--platform h4{
  display:flex;align-items:flex-end;min-height:48px;margin:0 0 10px;padding:0 0 10px 12px;
  border-bottom:1px solid rgba(80,188,189,.3);font-size:11px;font-weight:700;letter-spacing:.15em;
  text-transform:uppercase;color:var(--pm-turq);line-height:1.45;
}
.pm-mcol--1{grid-column:1;grid-row:1}
.pm-mcol--2{grid-column:2;grid-row:1}
.pm-mega-link{display:grid;grid-template-columns:1fr;gap:13px;align-items:start;padding:11px 12px;border-radius:14px;text-decoration:none;color:#fff;transition:background-color .16s ease,transform .16s ease}
.pm-mega-link.pm-with-ico{grid-template-columns:38px 1fr}
a.pm-mega-link:hover{background:rgba(255,255,255,.07);transform:translateX(2px)}
.pm-ml-icowrap{width:38px;height:38px;border-radius:11px;background:rgba(80,188,189,.13);display:flex;align-items:center;justify-content:center;transition:background-color .16s ease}
a.pm-mega-link:hover .pm-ml-icowrap{background:rgba(80,188,189,.26)}
.pm-ml-ico{width:22px;height:22px;display:block}
.pm-mega-link .pm-ml-t{display:block;font-weight:600;color:#fff;font-size:15px;line-height:1.4;transition:color .16s}
a.pm-mega-link:hover .pm-ml-t{color:var(--pm-turq80)}
.pm-mega-link .pm-ml-d{display:block;font-size:12.4px;color:rgba(255,255,255,.58);font-weight:500;line-height:1.45;margin-top:2px;min-height:37px}
.pm-ml-t .pm-badge{margin-left:6px;vertical-align:2px}
/* below ~1400px the longest titles wrap, so reserve the second line to keep the columns level */
@media (max-width:1399px){.Nav-dropdown--platform .pm-ml-t{min-height:42px}}
@media (max-width:1180px){.Nav-dropdown--platform .pm-ml-d{min-height:56px}}
.pm-badge{display:inline-block;white-space:nowrap;font-size:8.6px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:rgba(255,255,255,.14);color:rgba(255,255,255,.66);border-radius:40px;padding:3px 6px;line-height:1.3;transition:background-color .16s ease,color .16s ease,box-shadow .16s ease}
.pm-badge--week{background:rgba(80,188,189,.22);color:var(--pm-turq80)}
/* Items without a page yet are shown, dimmed, and cannot be followed. */
.pm-is-upcoming,.pm-mf-up{cursor:default}
.pm-is-upcoming .pm-mega-link{pointer-events:none}
.pm-is-upcoming .pm-ml-icowrap{background:rgba(255,255,255,.055)}
.pm-is-upcoming .pm-ml-ico{opacity:.75}
.pm-is-upcoming .pm-ml-t{color:rgba(255,255,255,.72)}
.pm-is-upcoming .pm-ml-d{color:rgba(255,255,255,.46)}
.pm-is-upcoming:hover .pm-badge--week,.pm-mf-up:hover .pm-badge--week{background:var(--pm-turq);color:var(--pm-navy-dark);box-shadow:0 0 0 1px rgba(80,188,189,.65)}
.pm-mega-cta{
  grid-column:3;grid-row:1;align-self:stretch;margin:48px 0 -24px;border-radius:18px;
  background:radial-gradient(130% 58% at 50% 122%,rgba(21,156,157,.24),rgba(17,31,63,0) 72%),#111f3f;box-shadow:inset 0 0 0 1px rgba(80,188,189,.16);
  display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden;isolation:isolate;
}
.pm-cta-media{position:relative;z-index:1;flex:0 0 auto;width:100%;line-height:0}
.pm-cta-media::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(to bottom,#111f3f 0%,rgba(17,31,63,.7) 8%,rgba(17,31,63,0) 19%,rgba(17,31,63,0) 68%,rgba(17,31,63,.5) 82%,rgba(17,31,63,.93) 93%,#111f3f 100%)}
.pm-cta-vid{width:100%;height:auto;display:block;opacity:.97;pointer-events:none}
@media (prefers-reduced-motion:reduce){.pm-cta-vid{display:none}}
.pm-cta-body{position:relative;z-index:3;flex:0 0 auto;display:flex;flex-direction:column;gap:16px;padding:2px 20px 24px}
.pm-cta-txt{display:flex;flex-direction:column;gap:11px}
.pm-mc-eyebrow{font-size:11px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--pm-turq)}
.pm-mc-t{margin:0;font-size:14.6px;font-weight:600;color:#fff;line-height:1.45}
.pm-btn{align-self:flex-start;display:inline-flex;align-items:center;justify-content:center;padding:10px 20px;border-radius:40px;border:1px solid var(--pm-turq);background:var(--pm-turq);color:#fff;font:inherit;font-size:14px;font-weight:600;text-decoration:none;white-space:nowrap;transition:background-color .15s ease-in-out,border-color .15s ease-in-out}
.pm-btn:hover,.pm-btn:active{background:#1f3460;border-color:#1f3460;color:#fff}
.pm-btn:focus-visible{outline:0;box-shadow:0 0 0 .2rem rgba(106,198,199,.5)}
.pm-mega-foot{grid-column:1/3;grid-row:2;display:flex;align-items:center;justify-content:space-between;gap:18px 24px;flex-wrap:wrap;margin-top:2px;padding-top:20px;border-top:1px solid rgba(255,255,255,.12)}
.pm-mf-item{display:grid;grid-template-columns:38px 1fr;gap:13px;align-items:center;padding:10px 12px;flex:1 1 300px;min-width:0}
.pm-mf-item .pm-ml-icowrap{background:rgba(255,255,255,.055)}
.pm-mf-item .pm-ml-ico{opacity:.42}
.pm-mf-item .pm-ml-t{display:flex;align-items:center;gap:8px;font-weight:600;font-size:15px;line-height:1.35;color:rgba(255,255,255,.46)}
.pm-mf-item .pm-ml-d{display:block;font-size:12.4px;font-weight:500;line-height:1.45;margin-top:2px;color:rgba(255,255,255,.3)}
/* Mobile drill-in panel: the panel is dark on the dark site and white on the light pages,
   so the dimmed row inherits its colour and only the badge states its own. */
.pm-m-up{cursor:default;pointer-events:none;gap:9px;justify-content:flex-start!important}
.pm-m-up>span:first-child{opacity:.6}
.pm-m-up .pm-badge{background:rgba(80,188,189,.22);color:#50bcbd}
body:not(.DarkSite) .pm-m-up .pm-badge{color:#1f7a7b}
a.pm-mf-live{text-decoration:none;border-radius:10px;transition:background .15s}
a.pm-mf-live:hover,a.pm-mf-live:focus-visible{background:rgba(255,255,255,.06)}
a.pm-mf-live .pm-ml-ico{opacity:1}
a.pm-mf-live .pm-ml-t{color:#fff}
a.pm-mf-live .pm-ml-d{color:rgba(255,255,255,.6)}

/* The About dropdown is dressed like the Platform panel: same surface, border, shadow and row style. */
.Header .Nav--main-header .Nav-item.has-dropdown>.Nav-dropdown:not(.Nav-dropdown--platform){
  padding:16px;width:270px;min-width:270px;border-radius:24px;border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(145deg,#1f3460 0%,#142447 58%,#0f1d3c 100%);color:#fff;
  box-shadow:0 30px 70px rgba(8,20,46,.55);
}
.Header .Nav--main-header .Nav-item.has-dropdown>.Nav-dropdown:not(.Nav-dropdown--platform) .Nav-list{display:grid;gap:2px;margin:0;padding:0;list-style:none}
.Header .Nav--main-header .Nav-item.has-dropdown>.Nav-dropdown:not(.Nav-dropdown--platform) .Nav-item{margin:0;padding:0}
.Header .Nav--main-header .Nav-item.has-dropdown>.Nav-dropdown:not(.Nav-dropdown--platform) .Nav-link{
  display:block;padding:11px 14px;border-radius:14px;font-size:15px;font-weight:600;line-height:1.4;color:#fff;
  transition:background-color .16s ease,color .16s ease;
}
.Header .Nav--main-header .Nav-item.has-dropdown>.Nav-dropdown:not(.Nav-dropdown--platform) .Nav-link:hover,
.Header .Nav--main-header .Nav-item.has-dropdown>.Nav-dropdown:not(.Nav-dropdown--platform) .Nav-link:focus-visible{background:rgba(255,255,255,.07);color:#50bcbd}

/* Icon tiles for the About rows, drawn in CSS so the header markup on every page stays untouched. */
.Header .Nav--main-header .Nav-item.has-dropdown>.Nav-dropdown:not(.Nav-dropdown--platform) .Nav-link{display:flex;align-items:center;gap:13px}
.Header .Nav--main-header .Nav-item.has-dropdown>.Nav-dropdown:not(.Nav-dropdown--platform) .Nav-link::before{content:"";flex:none;width:38px;height:38px;border-radius:11px;background:rgba(80,188,189,.13) center/18px no-repeat;transition:background-color .16s ease}
.Header .Nav--main-header .Nav-item.has-dropdown>.Nav-dropdown:not(.Nav-dropdown--platform) .Nav-link:hover::before{background-color:rgba(80,188,189,.26)}
.Header .Nav--main-header .Nav-item.has-dropdown>.Nav-dropdown:not(.Nav-dropdown--platform) .Nav-link[href*="/contact/"]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%2350bcbd%22 stroke-width=%221.4%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%223%22 y=%225%22 width=%2218%22 height=%2214%22 rx=%222.5%22/%3E%3Cpath d=%22m4 7.5 8 6 8-6%22/%3E%3C/svg%3E")}
.Header .Nav--main-header .Nav-item.has-dropdown>.Nav-dropdown:not(.Nav-dropdown--platform) .Nav-link[href*="/learn/"]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%2350bcbd%22 stroke-width=%221.4%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M6 3.5h8l4 4V20a.5.5 0 0 1-.5.5h-11A.5.5 0 0 1 6 20z%22/%3E%3Cpath d=%22M14 3.5V8h4M9 12.5h6M9 16h6%22/%3E%3C/svg%3E")}
.Header .Nav--main-header .Nav-item.has-dropdown>.Nav-dropdown:not(.Nav-dropdown--platform) .Nav-link[href*="careers.phished.io"]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%2350bcbd%22 stroke-width=%221.4%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%223%22 y=%227.5%22 width=%2218%22 height=%2212%22 rx=%222.5%22/%3E%3Cpath d=%22M9 7.5V6a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v1.5M3 13h18%22/%3E%3C/svg%3E")}

/* The language switcher has to stay clickable while the Platform panel is open: lift it above the nav body. */
.Header .NavWrapper .Nav--lang{z-index:20}
