
/* Media listing pages. Static, no app bundle - the nav dropdowns are revealed with
   CSS here because the JS that normally does it is deliberately not loaded. */
.industify_fn_header li.menu-item-has-children:hover>.sub-menu,
.industify_fn_toppanel li.menu-item-has-children:hover>.sub-menu,
.industify_fn_header li:hover>ul.sub-menu,
.industify_fn_toppanel li:hover>ul.sub-menu{opacity:1!important;visibility:visible!important;transform:none!important}
.industify_fn_header li.menu-item-has-children,
.industify_fn_toppanel li.menu-item-has-children{position:relative}

.industify_fn_header ul.ignis-techmenu{
  display:flex!important;align-items:center;gap:22px;flex-wrap:nowrap;
  background:#efefef!important;padding:18px 26px!important;
  width:max-content!important;max-width:90vw;min-width:0!important;
  border-radius:0!important;box-shadow:0 18px 40px rgba(11,16,44,.15)}
.industify_fn_header ul.ignis-techmenu>li{padding:0!important;position:relative}
.industify_fn_header ul.ignis-techmenu>li>a{
  display:flex;align-items:center;gap:6px;font-size:13px;font-weight:700;
  text-transform:uppercase;letter-spacing:.03em;color:#9a9fac!important;
  padding:10px 0;white-space:nowrap}
.industify_fn_header ul.ignis-techmenu>li>a:hover{color:#0b102c!important}
.industify_fn_header ul.ignis-techmenu>li.ignis-nav-item>a{color:#00224b!important}
.ignis-nav-chev{font-size:15px;color:#00224b}
.ignis-nav-badge{font-size:8px;font-weight:800;background:#00224b;color:#fff;
  padding:2px 5px;margin-left:2px;letter-spacing:.05em;vertical-align:middle;line-height:1.5}
.industify_fn_header ul.ignis-techmenu>li.ignis-nav-item>ul.sub-menu{
  display:block!important;position:absolute;top:100%;left:0;
  background:#efefef!important;padding:16px 4px 6px!important;
  min-width:220px!important;width:auto!important;border-radius:0!important;
  opacity:0;visibility:hidden;box-shadow:0 18px 40px rgba(11,16,44,.15)}
.industify_fn_header ul.ignis-techmenu>li.ignis-nav-item:hover>ul.sub-menu{
  opacity:1!important;visibility:visible!important;transform:none!important}
.industify_fn_header ul.ignis-techmenu>li.ignis-nav-item>ul.sub-menu li{padding:0 16px!important}
.industify_fn_header ul.ignis-techmenu>li.ignis-nav-item>ul.sub-menu a{
  display:block;padding:7px 0;font-size:13px;font-weight:700;text-transform:uppercase;
  letter-spacing:.03em;color:#9a9fac!important;white-space:nowrap}
.industify_fn_header ul.ignis-techmenu>li.ignis-nav-item>ul.sub-menu a:hover{color:#0b102c!important}

/* ---- the listing itself ----
   NOTE: width:100% is load-bearing on these three. Something in the site's global
   CSS gives block children shrink-to-fit behaviour in this part of the tree, which
   collapsed the grid to 0px wide and pushed the cards off the right edge. Explicit
   widths pin them to the container. Don't remove them. */
.media-page{padding:70px 0 90px;background:#fff;width:100%}
.media-page .mp-wrap{width:100%;max-width:1170px;margin:0 auto;padding:0 20px}
.media-page .mp-grid{width:100%;display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:34px}
.media-page .mp-card{display:flex;flex-direction:column;background:#fff;border:1px solid #e6ecf2;
  border-radius:6px;overflow:hidden;transition:box-shadow .25s ease,transform .25s ease}
.media-page .mp-card:hover{box-shadow:0 18px 40px rgba(11,16,44,.13);transform:translateY(-3px)}
.media-page .mp-thumb{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;background:#eef2f6}
.media-page .mp-body{padding:22px 24px 26px;display:flex;flex-direction:column;flex:1}
.media-page .mp-date{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:#8a93a3;margin-bottom:9px}
.media-page .mp-card h2{font-size:19px;line-height:1.35;margin:0 0 11px;color:#0b102c}
.media-page .mp-card h2 a{color:inherit;text-decoration:none}
.media-page .mp-card h2 a:hover{color:#00224b}
.media-page .mp-excerpt{font-size:14.5px;line-height:1.65;color:#5b6676;margin:0 0 18px}
.media-page .mp-more{margin-top:auto;align-self:flex-start;font-size:12px;font-weight:800;
  letter-spacing:.07em;text-transform:uppercase;color:#00224b;text-decoration:none;
  border-bottom:2px solid #00224b;padding-bottom:3px}

/* events render in full - there is no separate event detail page */
.media-page .mp-article{width:100%;border:1px solid #e6ecf2;border-radius:6px;overflow:hidden;margin-bottom:40px}
.media-page .mp-article>img{width:100%;height:auto;display:block}
.media-page .mp-article-body{padding:34px 38px 40px}
.media-page .mp-article-body h2{font-size:27px;line-height:1.3;margin:0 0 10px;color:#0b102c}
.media-page .mp-rich{font-size:15.5px;line-height:1.75;color:#404b5c}
.media-page .mp-rich p{margin:0 0 1.05em}
.media-page .mp-rich ul{margin:0 0 1.2em;padding-left:22px}
.media-page .mp-rich li{margin-bottom:.45em}
.media-page .mp-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));
  gap:14px;margin-top:26px}
.media-page .mp-gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:4px;display:block}
.media-page .mp-empty{padding:50px 0;color:#5b6676;font-size:16px}
@media(max-width:600px){
  .media-page{padding:44px 0 60px}
  .media-page .mp-article-body{padding:24px 20px 28px}
  .media-page .mp-article-body h2{font-size:22px}
}
