/* Mega menu + footer additions — externalized from inline <style>. */
/* Loaded after site.css so cascade-fighting !important rules win. */

/* hide/show — GSAP-powered height animation.
   height:0 + visibility:hidden hides the panel while keeping it in the DOM
   so GSAP can measure and animate to height:auto. No display:none because
   that prevents GSAP from reading the element's natural height.
   pointer-events:none prevents invisible menus from intercepting clicks.
   !important not needed here — GSAP inline styles override non-important CSS,
   and mobile overrides use higher specificity (.nav .mm) to win. */
.mm{height:0;overflow:hidden;visibility:hidden;pointer-events:none}

/* Desktop open state is handled entirely by GSAP timelines in site.js.
   .nav__group.is-open class is still toggled for chevron rotation and
   aria-expanded — but height/visibility are driven by inline GSAP styles.
   When GSAP is unavailable, initMegaMenu() falls back to direct inline
   style manipulation so the menu still opens without animation. */

/* full-width, flush below header */
.mm{position:absolute;top:100%;left:0;width:100%;background:#fff;border-bottom:1px solid #e5e7eb;z-index:200}

/* centered inner grid: feature 280px + panel 1fr (matches backup) */
.mm__inner{max-width:var(--max-w,1280px);margin:0 auto;padding:0 var(--gutter,32px) 0 0;display:grid;grid-template-columns:280px 1fr}

/* nav__group must not be positioning parent */
.nav__group{position:static!important}

/* trigger hover = darker text only */
.nav__group-trigger{cursor:pointer}
.nav__group-trigger:hover{color:#0f172a}
.nav__group.is-open .nav__group-trigger{color:#0f172a}
.nav__group-trigger svg{transition:transform .18s ease}
.nav__group.is-open .nav__group-trigger svg{transform:rotate(180deg)}

/* Per-mega grid-column overrides on .mm__list (site.css default is 1fr 1fr) */
.mm--platform .mm__list{grid-template-columns:repeat(5,1fr)!important}
.mm--resources .mm__list{grid-template-columns:repeat(3,1fr)!important}
.mm--data-api .mm__list{grid-template-columns:1fr 1fr!important;align-items:start}

/* Reassert .mm__item box-model with !important — site.css has `.nav a { padding: 0 }`
   at higher specificity that would otherwise clobber the item's inset padding.
   This matches the pre-rebuild inline pattern that gave the inset-hover look. */
.mm__item{padding:16px!important;border-radius:12px!important;display:flex!important;flex-direction:column!important;gap:8px!important}
.mm__item-name{font-size:15px!important;font-weight:700!important;color:#0f172a;letter-spacing:-0.01em}
.mm__item-desc{font-size:12.5px!important;color:#64748b;line-height:1.5;margin:0!important;font-weight:500}
.mm__item-detail{font-size:12px!important;color:#94a3b8;line-height:1.5;margin:0}
.mm__item-head{display:flex!important;align-items:center;gap:10px}
.mm__item-icon{flex-shrink:0;width:22px;height:22px;display:flex;align-items:center;justify-content:center}
.mm__item:hover{background:#f5f5f5!important}

/* New content additions inside .mm__feature: secondary links list + stats block + clickable wrapper */
.mm__feature-links{display:flex;flex-direction:column;gap:6px;margin-top:14px}
.mm__feature-links a{font-size:13px;color:#475569;font-weight:500;text-decoration:none}
.mm__feature-links a:hover{color:#2039e2}
/* Padding needs !important — site.css `.nav a { padding: 0 }` (specificity 0,1,1) otherwise wins */
.mm__feature-link{display:flex!important;flex-direction:column;color:inherit;text-decoration:none;border-radius:8px;padding:8px!important;margin:-8px;transition:background .15s}
.mm__feature-link:hover{background:rgba(0,0,0,0.03)}
/* Gap between the wrapping anchor (eyebrow/heading/para/stats) and the bottom CTA in Data & API */
.mm--data-api .mm__feature-cta{margin-top:20px!important}
.mm__feature-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px;padding:12px;background:#fff;border-radius:8px;border:1px solid #e5e7eb}
.mm__feature-stat-num{font-size:14px;font-weight:700;color:#0f172a;letter-spacing:-0.01em}
.mm__feature-stat-label{font-size:10px;color:#64748b;text-transform:uppercase;letter-spacing:.06em;font-weight:600;margin-top:2px}

/* Solutions/Data&API right panel: 2-column lists */
.mm__col2{display:grid;grid-template-columns:1fr 1fr;gap:32px;padding:24px}
.mm__col3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:24px;padding:24px}
.mm__col-heading{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#94a3b8;margin:0 0 12px}
.mm__col-list{display:flex;flex-direction:column;gap:2px}
.mm__col-list a{font-size:13.5px;color:#1e293b;font-weight:500;text-decoration:none;padding:5px 0}
.mm__col-list a:hover{color:#2039e2}
.mm__col-see-all{font-size:12.5px!important;color:#2039e2!important;font-weight:600!important;margin-top:8px;padding-top:8px;border-top:1px solid #f1f5f9}

/* Mobile drawer: collapse all mega-menu grids to a single column */
@media (max-width:900px){
  .mm__inner{grid-template-columns:1fr}
  .mm--platform .mm__list,
  .mm--resources .mm__list,
  .mm--data-api .mm__list{grid-template-columns:1fr!important}
  .mm__col2{grid-template-columns:1fr;gap:24px}
  .mm__col3{grid-template-columns:1fr;gap:24px}
}

/* Footer additions — site.css covers .footer / .footer__top / .footer__cols / .footer__col-title / .footer__col a */
.footer__col-title a{color:inherit;text-decoration:none;transition:color 120ms ease}
.footer__col-title a:hover{color:var(--text-muted)}
.footer__col-list strong,.footer__col li strong{color:var(--text);font-weight:700;margin-right:6px}
.footer__divider{height:1px;background:var(--border);margin:6px 0;list-style:none;border:0}
.footer__social{display:flex;gap:14px;margin-top:14px}
.footer__social a{color:var(--text-subtle);display:inline-flex;transition:color 120ms ease}
.footer__social a:hover{color:var(--text)}

/* Phase 3F — footer Compare sub-items nested list */
.footer__sublist{list-style:none;padding:6px 0 0 14px;margin:0;display:flex;flex-direction:column;gap:8px}
.footer__sublist a{font-size:12.5px}

/* Phase 3G — touch target ≥ 44×44px on mobile */
@media (max-width: 900px) {
  .nav__items > .nav__group-trigger,
  .nav__items > .nav__link,
  .footer__col li a,
  .footer__sublist li a {
    display: inline-block;
    min-height: 44px;
    line-height: 44px;
    padding-top: 4px;
    padding-bottom: 4px;
  }
}