/* ============================ 01) Header Colors ============================ */
:root {
  /* Fonts */
  --hdr-font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  /* Mega / container */
  --hdr-mega-bg: #ffffff;
  --hdr-mega-col-left-bg: #f2f7ff;
  --hdr-mega-col-right-bg: #628fc7;
  --hdr-mega-col-left-category-color: #163f8f;
  --hdr-mega-col-right-category-color: #ffffff;
  --hdr-mega-col-left-secondary-color: #4aa3d9;
  --hdr-mega-col-right-secondary-color: #d7ecff;
  --hdr-mega-col-left-link-color: #111827;
  --hdr-mega-col-right-link-color: #ffffff;
  --hdr-mega-col-left-link-hover-color: #0b5fff;
  --hdr-mega-col-right-link-hover-color: #d7ecff;
  --hdr-mega-shadow: 0 8px 30px rgba(16,24,40,0.08);
  --hdr-mega-border-radius: 8px;

  /* Main category titles (Privati / Aziende) */
  --hdr-category-privati-color: #0f3b8d;
  --hdr-category-aziende-color: #0f3b8d;
  --hdr-category-title-default-color: #111827;
  --hdr-category-title-font-size: 16px;
  --hdr-category-title-font-weight: 700;

  /* Secondary column titles (Luce, Gas e Connettività) */
  --hdr-secondary-title-color: #5fb7e5;
  --hdr-secondary-title-font-size: 15px;
  --hdr-secondary-title-font-weight: 200;

  /* Submenu links (page names) */
  --hdr-sub-link-color: #0d0f12;
  --hdr-sub-link-font-size: 15px;
  --hdr-sub-link-font-weight: 500;
  --hdr-sub-link-hover-color: #0b5fff;

  /* Misc / accessibility */
  --hdr-focus-ring: 0 0 0 4px rgba(11,95,255,0.12);
  --hdr-z-mega: 99999;
}

/* ============================== 02) Base Header ============================== */
.site-header.at-top,
.header.at-top {
  background: transparent !important;
}

.site-header.at-top .main-navigation a,
.site-header.at-top nav a,
.site-header.at-top .menu > li > a,
.site-header.at-top .menu-item a,
.header.at-top .main-navigation a,
.header.at-top nav a,
.header.at-top .menu > li > a,
.header.at-top .menu-item a {
  color: #ffffff !important;
  opacity: 0.98;
}

.site-header.at-top .site-logo img,
.header.at-top .site-logo img { filter: none; }

.site-header.at-top .header-cta .btn,
.header.at-top .header-cta .btn,
.site-header.at-top .btn,
.header-at-top .btn,
.header.at-top .btn {
  background: #ffffff !important;
  color: #0b5fff !important;
  border: none !important;
  box-shadow: 0 6px 20px rgba(11,95,255,0.12);
}

.site-header.at-top .menu-toggle,
.header.at-top .menu-toggle,
.site-header.at-top .icon,
.header.at-top .icon { color: #ffffff !important; }

.site-header.scrolled,
.header.scrolled,
.site-header.is-sticky,
.header.is-sticky {
  background: #ffffff !important;
  box-shadow: 0 2px 10px rgba(16,24,40,0.06);
}

/* nav links dark when scrolled */
.site-header.scrolled .main-navigation a,
.site-header.scrolled nav a,
.site-header.scrolled .menu > li > a,
.site-header.scrolled .menu-item a,
.header.scrolled .main-navigation a,
.header.scrolled nav a,
.header.scrolled .menu > li > a,
.header.scrolled .menu-item a,
.site-header.is-sticky .main-navigation a,
.header.is-sticky .main-navigation a {
  color: #111827 !important;
}

/* ============================= 03) PROTOTYPE LAYOUT ============================= */
.site-header .main-navigation .sub-menu,
.header .main-navigation .sub-menu {
  background: var(--hdr-mega-bg) !important;
  color: var(--hdr-category-title-default-color);
  box-shadow: var(--hdr-mega-shadow);
  border-radius: var(--hdr-mega-border-radius);
  padding: 20px;
  min-width: 520px;
  z-index: var(--hdr-z-mega);
  display: grid;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
  gap: 28px;
}

/* normalize column items */
.site-header .main-navigation .sub-menu > li,
.header .main-navigation .sub-menu > li {
  margin: 0;
  padding: 0;
  list-style: none;
}

.site-header .main-navigation .sub-menu ul,
.header .main-navigation .sub-menu ul,
.site-header .main-navigation .sub-menu li .sub-menu,
.header .main-navigation .sub-menu li .sub-menu {
  position: static !important;
  left: auto !important;
  top: auto !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* ============================ 04) Title & Links Styling ============================ */
/* Generic menu-heading container */
.site-header .main-navigation .menu-heading,
.header .main-navigation .menu-heading {
  width: 100%;
  margin: 0 0 8px 0;
  padding: 0;
  list-style: none;
}

/* Visual style for menu-heading */
.site-header .main-navigation .menu-heading:not(.column-title) > a,
.header .main-navigation .menu-heading:not(.column-title) > a {
  display: block;
  color: var(--hdr-category-title-default-color) !important;
  font-family: var(--hdr-font-family) !important;
  font-size: var(--hdr-category-title-font-size) !important;
  font-weight: var(--hdr-category-title-font-weight) !important;
  background: transparent !important;
  box-shadow: none !important;
  text-decoration: none;
  padding: 0;
  margin: 0 0 8px 0;
}

/* SPECIFIC COLORS: Privati / Aziende */
.site-header .main-navigation li.menu-heading.menu-heading--privati:not(.column-title) > a,
.header .main-navigation li.menu-heading.menu-heading--privati:not(.column-title) > a,
.site-header .main-navigation .menu-heading--privati:not(.column-title) > a,
.header .main-navigation .menu-heading--privati:not(.column-title) > a {
  color: var(--hdr-category-privati-color) !important;
  font-family: var(--hdr-font-family) !important;
  font-weight: var(--hdr-category-title-font-weight) !important;
}

.site-header .main-navigation li.menu-heading.menu-heading--aziende:not(.column-title) > a,
.header .main-navigation li.menu-heading.menu-heading--aziende:not(.column-title) > a,
.site-header .main-navigation .menu-heading--aziende:not(.column-title) > a,
.header .main-navigation .menu-heading--aziende:not(.column-title) > a {
  color: var(--hdr-category-aziende-color) !important;
  font-family: var(--hdr-font-family) !important;
  font-weight: var(--hdr-category-title-font-weight) !important;
}

/* SECONDARY TITLES (column-title) */
#site-navigation .main-navigation .sub-menu li.column-title > a,
.site-header .main-navigation .sub-menu li.column-title > a,
.header .main-navigation .sub-menu li.column-title > a,
#site-navigation .main-navigation .sub-menu li.column-title > a.menu-heading__anchor[data-menu-heading="1"],
.site-header .main-navigation .sub-menu li.column-title > a.menu-heading__anchor[data-menu-heading="1"],
.header .main-navigation .sub-menu li.column-title > a.menu-heading__anchor[data-menu-heading="1"] {
  color: var(--hdr-secondary-title-color) !important;
  font-family: var(--hdr-font-family) !important;
  font-size: var(--hdr-secondary-title-font-size) !important;
  font-weight: var(--hdr-secondary-title-font-weight) !important;
  margin-bottom: 8px;
  text-decoration: none !important;
  text-shadow: none !important;
  line-height: 1.25;
}

/* Submenu page links */
.site-header .main-navigation .sub-menu a:not(.menu-heading__anchor):not(.column-title),
.header .main-navigation .sub-menu a:not(.menu-heading__anchor):not(.column-title) {
  display: block;
  padding: 6px 0;
  margin: 2px 0;
  color: var(--hdr-sub-link-color) !important;
  font-family: var(--hdr-font-family) !important;
  font-size: var(--hdr-sub-link-font-size) !important;
  font-weight: var(--hdr-sub-link-font-weight) !important;
  background: transparent !important;
  border-radius: 0;
  box-shadow: none !important;
  text-decoration: none;
}

/* Hover / focus for real submenu links */
.site-header .main-navigation .sub-menu a:not(.menu-heading__anchor):not(.column-title):hover,
.header .main-navigation .sub-menu a:not(.menu-heading__anchor):not(.column-title):hover,
.site-header .main-navigation .sub-menu a:not(.menu-heading__anchor):not(.column-title):focus,
.header .main-navigation .sub-menu a:not(.menu-heading__anchor):not(.column-title):focus {
  color: var(--hdr-sub-link-hover-color) !important;
  text-decoration: none;
  background: transparent !important;
}

/* Parent "Servizi" open/active style */
.site-header .main-navigation .menu-item-has-children[aria-expanded="true"] > a,
.site-header .main-navigation .menu-item-has-children.focus > a,
.site-header .main-navigation .menu-item-has-children.open > a,
.site-header .main-navigation .menu .menu-item.current-menu-ancestor > a,
.header .main-navigation .menu-item-has-children[aria-expanded="true"] > a,
.header .main-navigation .menu-item-has-children.focus > a,
.header .main-navigation .menu-item-has-children.open > a,
.header .main-navigation .menu .menu-item.current-menu-ancestor > a {
  background: #ffffff !important;
  color: #111827 !important;
  border-radius: 8px;
  padding: 6px 10px;
  box-shadow: 0 6px 20px rgba(2,10,30,0.08);
  z-index: 100000;
}

/* caret/icon visible when parent open */
.site-header .main-navigation .menu-item-has-children[aria-expanded="true"] > a .caret,
.header .main-navigation .menu-item-has-children[aria-expanded="true"] > a .caret,
.site-header .main-navigation .menu-item-has-children.focus > a .caret,
.header .main-navigation .menu-item-has-children.focus > a .caret {
  color: #111827 !important;
}

/* scrolled/sticky behavior */
.site-header.scrolled .main-navigation .sub-menu,
.header.scrolled .main-navigation .sub-menu,
.site-header.is-sticky .main-navigation .sub-menu,
.header.is-sticky .main-navigation .sub-menu {
  background: var(--hdr-mega-bg) !important;
  box-shadow: 0 6px 20px rgba(16,24,40,0.06) !important;
  padding: 12px;
  border-radius: 8px;
}

/* scrolled submenu link styles for real links */
.site-header.scrolled .main-navigation .sub-menu a:not(.menu-heading__anchor):not(.column-title),
.header.scrolled .main-navigation .sub-menu a:not(.menu-heading__anchor):not(.column-title),
.site-header.is-sticky .main-navigation .sub-menu a:not(.menu-heading__anchor):not(.column-title),
.header.is-sticky .main-navigation .sub-menu a:not(.menu-heading__anchor):not(.column-title) {
  background: transparent;
  color: var(--hdr-sub-link-color) !important;
  margin: 6px 0;
  padding: 8px 12px;
  border-radius: 6px;
  box-shadow: none;
}

/* Accessibility focus outline for real links */
.main-navigation .sub-menu a:not(.menu-heading__anchor):not(.column-title):focus {
  outline: 3px solid rgba(11,95,255,0.18);
  outline-offset: 2px;
}

/* Remove residual card-like backgrounds/overlaps */
.site-header .main-navigation .sub-menu * ,
.header .main-navigation .sub-menu * {
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* Align columns to top */
.site-header .main-navigation .sub-menu,
.header .main-navigation .sub-menu {
  align-items: start !important;
  transform: none !important;
  z-index: var(--hdr-z-mega) !important;
}

/* ================================= 05) Mobile ================================= */
@media (max-width: 799px) {
  .site-header .main-navigation .sub-menu,
  .header .main-navigation .sub-menu {
    grid-template-columns: 1fr !important;
    padding: 12px !important;
    min-width: auto;
  }
  .site-header .main-navigation .sub-menu > li,
  .header .main-navigation .sub-menu > li { width: 100%; }

  /* On mobile, rely on data-menu-heading or JS to decide interaction; visual kept */
  .site-header .main-navigation .menu-heading > a,
  .header .main-navigation .menu-heading > a {
    cursor: default;
  }

  .site-header .main-navigation .sub-menu a,
  .header .main-navigation .sub-menu a { padding: 8px 0; }
}

a.menu-heading__anchor[data-menu-heading="1"],
a[data-menu-heading="1"],
.menu-heading__anchor[data-menu-heading="1"] {
  pointer-events: none !important;
  cursor: default !important;
  /* default title color for marked headings, column-title override below */
  color: var(--hdr-category-title-default-color) !important;
}

/* For column-title anchors explicitly marked as headings - ensure correct color/weight */
a.column-title[data-menu-heading="1"],
.column-title[data-menu-heading="1"] {
  pointer-events: none !important;
  cursor: default !important;
  color: var(--hdr-secondary-title-color) !important;
}

/* Ensure all other submenu anchors remain interactive (safety net) */
.site-header .main-navigation .sub-menu a:not([data-menu-heading="1"]),
.header .main-navigation .sub-menu a:not([data-menu-heading="1"]) {
  pointer-events: auto !important;
  cursor: pointer !important;
}

/* Visual keyboard-only indicator for marked headings (focus-visible) */
a.menu-heading__anchor[data-menu-heading="1"]:focus-visible,
a.column-title[data-menu-heading="1"]:focus-visible {
  box-shadow: var(--hdr-focus-ring);
  outline: none;
}

/* Titoli secondari */
#site-navigation .main-navigation .sub-menu li.column-title > a,
.site-header .main-navigation .sub-menu li.column-title > a,
.header .main-navigation .sub-menu li.column-title > a,
#site-navigation .main-navigation .sub-menu li.column-title > a.menu-heading__anchor[data-menu-heading="1"],
.site-header .main-navigation .sub-menu li.column-title > a.menu-heading__anchor[data-menu-heading="1"],
.header .main-navigation .sub-menu li.column-title > a.menu-heading__anchor[data-menu-heading="1"] {
  color: var(--hdr-secondary-title-color) !important;
  font-weight: var(--hdr-secondary-title-font-weight) !important;
  font-size: var(--hdr-secondary-title-font-size) !important;
  line-height: 1.25 !important;
  text-shadow: none !important;
  text-decoration: none !important;
}

#site-navigation .main-navigation .sub-menu li.column-title > a {
  font-weight: 400 !important;
}

/* FIX: limita larghezza del mega-menu e evita overflow */
.site-header .main-navigation .sub-menu,
.header .main-navigation .sub-menu {
  box-sizing: border-box !important;
  min-width: 520px !important;
  max-width: 700px !important;
  width: auto !important;
  overflow: visible;
  word-wrap: break-word;
}

.site-header .main-navigation .sub-menu {
  grid-auto-columns: minmax(0, 1fr) !important;
}

.site-header .main-navigation .sub-menu li,
.header .main-navigation .sub-menu li {
  min-width: 0 !important;
  word-break: break-word !important;
  box-sizing: border-box !important;
}

/* Servizi mega-menu: background diverso per colonna sinistra/destra */
#site-navigation .primary-menu > .menu-item.mega > .sub-menu {
  background: linear-gradient(
    to right,
    var(--hdr-mega-col-left-bg) 0 50%,
    var(--hdr-mega-col-right-bg) 50% 100%
  ) !important;
  gap: 0 !important;
  padding: 0 !important;
}

#site-navigation .primary-menu > .menu-item.mega > .sub-menu > li:first-child {
  background: transparent !important;
  border-radius: 0 !important;
  padding: 20px 18px !important;
}

#site-navigation .primary-menu > .menu-item.mega > .sub-menu > li:last-child {
  background: transparent !important;
  border-radius: 0 !important;
  padding: 20px 18px !important;
}

.site-header.scrolled #site-navigation .primary-menu > .menu-item.mega > .sub-menu,
.header.scrolled #site-navigation .primary-menu > .menu-item.mega > .sub-menu,
.site-header.is-sticky #site-navigation .primary-menu > .menu-item.mega > .sub-menu,
.header.is-sticky #site-navigation .primary-menu > .menu-item.mega > .sub-menu {
  background: linear-gradient(
    to right,
    var(--hdr-mega-col-left-bg) 0 50%,
    var(--hdr-mega-col-right-bg) 50% 100%
  ) !important;
  gap: 0 !important;
  padding: 0 !important;
}

/* Colonna sinistra: categorie e link */
#site-navigation .primary-menu > .menu-item.mega > .sub-menu > li:first-child > a,
#site-navigation .primary-menu > .menu-item.mega > .sub-menu > li:first-child .menu-heading > a,
#site-navigation .primary-menu > .menu-item.mega > .sub-menu > li:first-child .menu-heading--privati > a {
  color: var(--hdr-mega-col-left-category-color) !important;
}

#site-navigation .primary-menu > .menu-item.mega > .sub-menu > li:first-child li.column-title > a {
  color: var(--hdr-mega-col-left-secondary-color) !important;
}

#site-navigation .primary-menu > .menu-item.mega > .sub-menu > li:first-child a:not(.menu-heading__anchor):not(.column-title) {
  color: var(--hdr-mega-col-left-link-color) !important;
}

#site-navigation .primary-menu > .menu-item.mega > .sub-menu > li:first-child a:not(.menu-heading__anchor):not(.column-title):hover,
#site-navigation .primary-menu > .menu-item.mega > .sub-menu > li:first-child a:not(.menu-heading__anchor):not(.column-title):focus {
  color: var(--hdr-mega-col-left-link-hover-color) !important;
}

/* Colonna destra: categorie e link */
#site-navigation .primary-menu > .menu-item.mega > .sub-menu > li:last-child > a,
#site-navigation .primary-menu > .menu-item.mega > .sub-menu > li:last-child .menu-heading > a,
#site-navigation .primary-menu > .menu-item.mega > .sub-menu > li:last-child .menu-heading--aziende > a {
  color: var(--hdr-mega-col-right-category-color) !important;
}

#site-navigation .primary-menu > .menu-item.mega > .sub-menu > li:last-child li.column-title > a {
  color: var(--hdr-mega-col-right-secondary-color) !important;
}

#site-navigation .primary-menu > .menu-item.mega > .sub-menu > li:last-child a:not(.menu-heading__anchor):not(.column-title) {
  color: var(--hdr-mega-col-right-link-color) !important;
}

#site-navigation .primary-menu > .menu-item.mega > .sub-menu > li:last-child a:not(.menu-heading__anchor):not(.column-title):hover,
#site-navigation .primary-menu > .menu-item.mega > .sub-menu > li:last-child a:not(.menu-heading__anchor):not(.column-title):focus {
  color: var(--hdr-mega-col-right-link-hover-color) !important;
}

/* ===== Logo switch: light at top, dark when scrolled/sticky ===== */
.site-branding .site-logo-img--light { display: block; }
.site-branding .site-logo-img--dark  { display: none; }

.site-header.scrolled .site-branding .site-logo-img--light,
.header.scrolled .site-branding .site-logo-img--light,
.site-header.is-sticky .site-branding .site-logo-img--light,
.header.is-sticky .site-branding .site-logo-img--light {
  display: none;
}

.site-header.scrolled .site-branding .site-logo-img--dark,
.header.scrolled .site-branding .site-logo-img--dark,
.site-header.is-sticky .site-branding .site-logo-img--dark,
.header.is-sticky .site-branding .site-logo-img--dark {
  display: block;
}
