/* ==========================================
   MAGAS — Child Theme Custom CSS
   RICOSTRUITO DA ZERO — modello full-width pulito:
   • SFONDI a tutta larghezza (100vw) — sempre da bordo a bordo
   • CONTENUTO centrato (max 1100px) con padding laterale
   • overflow-x:hidden sul body neutralizza il bug della scrollbar
   ========================================== */

/* === FONT === */
body, h1, h2, h3, h4, h5, h6, p, a, span, li, button, input {
  font-family: 'Inter', sans-serif !important;
}

/* === RETE DI SICUREZZA OVERFLOW ===
   overflow-x:hidden permette di usare 100vw senza scroll orizzontale
   né fasce chiare. È la chiave che rende sicura tutta la tecnica. */
html, body {
  overflow-x: hidden !important;
  max-width: 100% !important;
}

/* === FIX HAMBURGER ===
   Il testo "Menu" dentro il bottone sforava a destra: lo nascondiamo
   con la tecnica screen-reader (accessibile, zero ingombro).
   NON tocchiamo il bottone né gli span, così l'icona resta intera. */
.icon-hamburger strong {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* === HEADER === */
.header {
  background-color: #0B1220 !important;
  height: 80px !important;
  min-height: 80px !important;
  max-height: 80px !important;
}
.header__content {
  height: 80px !important;
  align-items: center !important;
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 40px !important;
  padding-right: 40px !important;
  box-sizing: border-box !important;
}
.spacer {
  height: 80px !important;
  min-height: 80px !important;
}
.header__logo-img,
.header__logo_white-img {
  height: 48px !important;
  width: auto !important;
  max-height: 48px !important;
}
.menu a {
  color: rgba(255,255,255,0.7) !important;
}
.menu a:hover {
  color: #ffffff !important;
}

/* === NASCONDI TITOLO PAGINE === */
.page article > h1:first-child {
  display: none !important;
}

/* ==========================================
   PATTERN FULL-WIDTH — SFONDI A TUTTA LARGHEZZA
   La sezione esterna esce dal container del tema con 100vw e porta
   lo SFONDO da bordo a bordo. overflow-x:hidden sul body evita lo
   sforamento. Funziona identico su desktop e mobile.
   ========================================== */
.magas-hero,
.magas-stats,
.magas-section-light,
.magas-section-method,
.magas-section-ai,
.magas-cta-band,
.magas-footer {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  box-sizing: border-box !important;
}

/* ==========================================
   CONTENUTO CENTRATO
   Il gruppo interno di ogni sezione (e l'inner del footer) resta
   centrato a 1100px con padding laterale. Questo è ciò che tiene
   il testo allineato e leggibile, mentre lo sfondo sta full-width.
   ========================================== */
.magas-hero > .wp-block-group,
.magas-stats > .wp-block-group,
.magas-section-light > .wp-block-group,
.magas-section-method > .wp-block-group,
.magas-section-ai > .wp-block-group,
.magas-cta-band > .wp-block-group,
.magas-footer__inner {
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 40px !important;
  padding-right: 40px !important;
  box-sizing: border-box !important;
}

/* === HERO === */
.magas-hero {
  background-color: #0B1220 !important;
  background-image: none !important;
  min-height: 560px !important;
  padding-top: 80px !important;
  padding-bottom: 80px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}
.magas-hero h1,
.magas-hero h2,
.magas-hero p,
.magas-hero span {
  color: #ffffff !important;
}
.magas-hero h1 {
  font-size: clamp(36px, 4vw, 52px) !important;
  font-weight: 900 !important;
  line-height: 1.08 !important;
  letter-spacing: -1.5px !important;
}
/* Tag "Consulenza strategica" */
.magas-hero p:first-of-type {
  color: #E87C3E !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
}
/* Bottone arancio */
.magas-hero .wp-block-button:first-child .wp-block-button__link {
  background-color: #E87C3E !important;
  color: #ffffff !important;
  border-radius: 6px !important;
  padding: 13px 28px !important;
  font-weight: 600 !important;
  border: none !important;
}
/* Bottone outline */
.magas-hero .wp-block-button:last-child .wp-block-button__link {
  background-color: transparent !important;
  color: #ffffff !important;
  border: 1px solid rgba(255,255,255,0.3) !important;
  border-radius: 6px !important;
  padding: 13px 28px !important;
  font-weight: 500 !important;
}

/* === STATS === */
.magas-stats {
  background-color: #0B1220 !important;
  border-top: 1px solid rgba(255,255,255,0.08) !important;
}
/* la sezione stats non ha padding verticale proprio: lo danno le colonne */
.magas-stats > .wp-block-group {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.magas-stat-col {
  padding: 24px 28px !important;
  border-right: 1px solid rgba(255,255,255,0.08) !important;
}
/* filo a sinistra della prima colonna (simmetria griglia stats) */
.magas-stats .wp-block-column:first-child .magas-stat-col,
.magas-stats .wp-block-column:first-child {
  border-left: 1px solid rgba(255,255,255,0.08) !important;
}
.magas-stat-num {
  font-size: 32px !important;
  font-weight: 900 !important;
  color: #ffffff !important;
  margin: 0 0 4px !important;
}
.magas-stat-label {
  font-size: 14px !important;
  color: rgba(255,255,255,0.45) !important;
  margin: 0 !important;
}

/* === SEZIONE SERVIZI === */
.magas-section-light {
  background-color: #ffffff !important;
  padding-top: 100px !important;
  padding-bottom: 100px !important;
}
.magas-label {
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: #E87C3E !important;
  margin-bottom: 12px !important;
}
.magas-section-title {
  font-size: 32px !important;
  font-weight: 800 !important;
  color: #0B1220 !important;
  margin-bottom: 16px !important;
}
.magas-section-intro {
  font-size: 16px !important;
  color: #666 !important;
  max-width: 560px !important;
  margin-bottom: 48px !important;
}
/* Titoli/intro centrati */
.magas-section-title,
.magas-section-intro,
.magas-label {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.magas-section-light .wp-block-columns:first-of-type {
  margin-top: 16px !important;
}
/* Card servizi */
.magas-service-card,
.magas-service-card.wp-block-column {
  background: #ffffff !important;
  border: 1px solid #E8E8E8 !important;
  border-radius: 10px !important;
  padding: 24px !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06) !important;
}
.magas-service-card h3 {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #0B1220 !important;
  margin-bottom: 8px !important;
}
.magas-service-card p {
  font-size: 14px !important;
  color: #666 !important;
  line-height: 1.6 !important;
}

/* === SEZIONE METODO === */
.magas-method-img {
  background: #1A2540 !important;
  border-radius: 14px !important;
  min-height: 320px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.magas-method-img p {
  color: rgba(255,255,255,0.2) !important;
  font-size: 13px !important;
}
.magas-method-title {
  font-size: 30px !important;
  font-weight: 800 !important;
  color: #0B1220 !important;
  margin-bottom: 16px !important;
}
.magas-method-text {
  font-size: 15px !important;
  color: #666 !important;
  line-height: 1.7 !important;
  margin-bottom: 24px !important;
}
.magas-checklist {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 32px !important;
}
.magas-checklist li {
  font-size: 14px !important;
  color: #444 !important;
  padding-left: 28px !important;
  position: relative !important;
  margin-bottom: 12px !important;
}
.magas-checklist li:before {
  content: "✓" !important;
  position: absolute !important;
  left: 0 !important;
  color: #E87C3E !important;
  font-weight: 700 !important;
}

/* === SEZIONE AI === */
.magas-section-ai {
  background: linear-gradient(135deg, #101C35 0%, #1A2A50 100%) !important;
  padding-top: 100px !important;
  padding-bottom: 100px !important;
}
.magas-ai-badge {
  display: inline-block !important;
  background: rgba(232,124,62,0.15) !important;
  border: 1px solid rgba(232,124,62,0.3) !important;
  border-radius: 20px !important;
  padding: 6px 14px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #E87C3E !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  margin-bottom: 20px !important;
}
.magas-ai-title {
  font-size: 32px !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  line-height: 1.2 !important;
  margin-bottom: 16px !important;
}
.magas-ai-text {
  font-size: 15px !important;
  color: rgba(255,255,255,0.55) !important;
  line-height: 1.7 !important;
}
.magas-ai-card {
  background: rgba(255,255,255,0.06) !important;
  border: 0.5px solid rgba(255,255,255,0.1) !important;
  border-radius: 10px !important;
  padding: 20px 24px !important;
  margin-bottom: 12px !important;
}
.magas-ai-card h4 {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #ffffff !important;
  margin: 0 0 6px !important;
}
.magas-ai-card p {
  font-size: 14px !important;
  color: rgba(255,255,255,0.5) !important;
  line-height: 1.5 !important;
  margin: 0 !important;
}

/* === CTA BAND === */
.magas-cta-band {
  background-color: #0B1220 !important;
  padding-top: 72px !important;
  padding-bottom: 72px !important;
}
/* su desktop testo e bottone affiancati: il flex sta sul gruppo interno */
.magas-cta-band > .wp-block-group {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 32px !important;
}
.magas-cta-band h2 {
  font-size: 26px !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  margin: 0 0 8px !important;
}
.magas-cta-band p {
  font-size: 15px !important;
  color: rgba(255,255,255,0.55) !important;
  margin: 0 !important;
}
.magas-btn-primary .wp-block-button__link {
  background-color: #E87C3E !important;
  color: #ffffff !important;
  border-radius: 6px !important;
  padding: 13px 28px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}

/* ============================================
   FOOTER MAGAS
   (full-width gestito sopra; inner centrato gestito sopra)
   ============================================ */
.magas-footer {
  background: #080D17 !important;
  color: #cdd3de !important;
  border-top: 1px solid rgba(232,124,62,0.25) !important;
}
.magas-footer__inner {
  padding-top: 70px !important;
  padding-bottom: 0 !important;
}
.magas-footer__grid {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 1fr;
  gap: 48px;
  padding-bottom: 56px;
}
.magas-footer__brand-logo {
  height: 40px;
  width: auto;
  margin-bottom: 20px;
}
.magas-footer__tagline {
  font-size: 15px;
  line-height: 1.6;
  color: #9aa3b2;
  max-width: 320px;
  margin: 0;
}
.magas-footer__col-title {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #ffffff;
  margin: 0 0 18px;
}
.magas-footer__list { list-style: none; margin: 0; padding: 0; }
.magas-footer__list li { margin-bottom: 11px; }
.magas-footer__list a,
.magas-footer__contact {
  color: #9aa3b2;
  text-decoration: none;
  font-size: 15px;
  line-height: 1.5;
  transition: color 0.2s ease;
}
.magas-footer__list a:hover { color: #E87C3E; }
.magas-footer__contact { display: block; margin-bottom: 11px; }
.magas-footer__contact strong { color: #cdd3de; font-weight: 500; }
a.magas-footer__contact:hover { color: #E87C3E; }
.magas-footer__bottom {
  border-top: 1px solid rgba(255,255,255,0.08);
  padding: 24px 0 28px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}
.magas-footer__copy { font-size: 14px; color: #6b7488; margin: 0; }
.magas-footer__legal { display: flex; gap: 24px; }
.magas-footer__legal a {
  font-size: 14px;
  color: #6b7488;
  text-decoration: none;
  transition: color 0.2s ease;
}
.magas-footer__credit {
  color: #6b7488;
  text-decoration: none;
  transition: color 0.2s ease;
}
.magas-footer__credit:hover {
  color: #E87C3E;
}
.magas-footer__legal a:hover { color: #E87C3E; }

/* ============================================
   RESPONSIVE — TABLET (≤900px): footer a 2 colonne
   ============================================ */
@media (max-width: 900px) {
  .magas-footer__grid { grid-template-columns: 1fr 1fr; gap: 40px 32px; }
}

/* ============================================
   RESPONSIVE — MOBILE (≤781px)
   Gli sfondi restano full-width (100vw) come sopra: NON li tocchiamo.
   Qui cambiamo solo: padding laterale del contenuto (40→20px),
   dimensioni, impilamento colonne, menu mobile.
   ============================================ */
@media (max-width: 781px) {

  /* Contenuto: padding laterale ridotto a 20px (lo sfondo resta 100vw) */
  .magas-hero > .wp-block-group,
  .magas-stats > .wp-block-group,
  .magas-section-light > .wp-block-group,
  .magas-section-method > .wp-block-group,
  .magas-section-ai > .wp-block-group,
  .magas-cta-band > .wp-block-group,
  .magas-footer__inner,
  .header__content {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  /* --- HERO mobile --- */
  .magas-hero {
    padding-top: 56px !important;
    padding-bottom: 56px !important;
    min-height: 0 !important;
  }
  .magas-hero h1 {
    font-size: clamp(30px, 8vw, 44px) !important;
    line-height: 1.12 !important;
    letter-spacing: -0.5px !important;
  }
  .magas-hero .wp-block-buttons {
    flex-direction: column;
    gap: 12px;
  }
  .magas-hero .wp-block-button,
  .magas-hero .wp-block-button__link {
    width: 100%;
    text-align: center;
  }

  /* --- Padding verticali ridotti --- */
  .magas-section-light,
  .magas-section-method,
  .magas-section-ai {
    padding-top: 56px !important;
    padding-bottom: 56px !important;
  }

  /* --- CTA band: impilata (testo sopra, bottone sotto) --- */
  .magas-cta-band {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
  }
  .magas-cta-band > .wp-block-group {
    display: block !important;
  }
  .magas-cta-band .wp-block-columns {
    flex-direction: column !important;
    gap: 24px !important;
  }
  .magas-cta-band .wp-block-column {
    width: 100% !important;
    flex-basis: 100% !important;
  }
  .magas-cta-band .wp-block-buttons {
    justify-content: flex-start !important;
  }
  .magas-cta-band .wp-block-button,
  .magas-cta-band .wp-block-button__link {
    width: 100% !important;
    text-align: center !important;
  }

  /* --- STATISTICHE: centrate, compatte, senza bordi verticali --- */
  .magas-stats .wp-block-columns {
    gap: 0 !important;
  }
  .magas-stats .wp-block-column,
  .magas-stat-col {
    text-align: center !important;
    padding: 24px 0 !important;
    border-right: none !important;
    border-left: none !important;
  }
  .magas-stats .wp-block-column:first-child .magas-stat-col,
  .magas-stats .wp-block-column:first-child {
    border-left: none !important;
  }
  .magas-stats .magas-stat-num,
  .magas-stats .magas-stat-label {
    text-align: center !important;
  }

  /* --- Card servizi home: una card per riga su mobile, anche se
     WordPress aggiunge is-not-stacked-on-mobile alla seconda riga --- */
  .magas-section-light .wp-block-columns,
  .magas-section-light .wp-block-columns.is-not-stacked-on-mobile {
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    gap: 16px !important;
  }
  .magas-section-light .wp-block-column,
  .magas-section-light .wp-block-columns.is-not-stacked-on-mobile > .wp-block-column,
  .magas-service-card,
  .magas-service-card.wp-block-column {
    flex-basis: 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: 0 !important;
    box-sizing: border-box !important;
  }

  /* --- Placeholder immagine metodo --- */
  .magas-method-img {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
  }

  /* --- Footer: 1 colonna --- */
  .magas-footer__grid { grid-template-columns: 1fr; gap: 36px; }
  .magas-footer__bottom { flex-direction: column; align-items: flex-start; }

  /* ====== MENU MOBILE — pannello navy leggibile ====== */
  .header nav,
  .header nav[aria-label="main menu"],
  .header__content nav,
  .header nav ul,
  .header .menu,
  ul.menu {
    background: #0B1220 !important;
    background-color: #0B1220 !important;
  }
  .header .menu {
    padding: 24px 28px 40px !important;
    margin: 0 !important;
  }
  .header .menu li {
    border-bottom: 1px solid rgba(255,255,255,0.10) !important;
    list-style: none !important;
  }
  .header .menu li:last-child {
    border-bottom: none !important;
  }
  .header .menu a {
    display: block !important;
    color: #ffffff !important;
    font-size: 22px !important;
    font-weight: 500 !important;
    letter-spacing: -0.2px !important;
    padding: 18px 0 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
  }
  .header .menu a:hover,
  .header .menu .current-menu-item > a {
    color: #E87C3E !important;
  }

  /* Hamburger + X: lineette bianche */
  .icon-hamburger span,
  .icon-hamburger[aria-expanded="true"] span,
  .icon-hamburger span::before,
  .icon-hamburger span::after {
    background-color: #ffffff !important;
  }

}

/* ============================================================
   PAGINE SERVIZIO MAGAS  (.magas-page-*)
   Stesso CSS per tutte e 6 le pagine. Per le altre card:
   duplichi la pagina, cambi i testi. Qui non si tocca niente.
   ============================================================ */

/* --- HERO ---
   Altezza, centratura verticale e bagliore arancio integrati qui. */
.magas-page-hero {
  position: relative;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  min-height: 660px;
  padding: 120px 0 100px;
  background-color: #0B1220;          /* fallback navy */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.magas-page-hero::before {            /* sfumato scuro sopra la foto */
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg,
              rgba(11,18,32,0.94) 0%,
              rgba(11,18,32,0.82) 50%,
              rgba(11,18,32,0.62) 100%);
  z-index: 1;
  pointer-events: none;
}
.magas-page-hero::after {             /* bagliore arancio tenue in alto a destra */
  content: "";
  position: absolute;
  top: -25%; right: -8%;
  width: 620px; height: 620px;
  background: radial-gradient(circle, rgba(232,124,62,0.16), transparent 70%);
  z-index: 1; pointer-events: none;
}
.magas-page-hero__inner {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 40px;
}

/* Foto specifica della pagina Progettazione tecnica.
   Per le altre pagine: crea un modificatore tipo .magas-page-hero--energia
   con la sua url(). */
.magas-page-hero--progettazione {
  background-image: url('images/hero-progettazione.jpg');
  background-size: cover;
}

.magas-page-hero__eyebrow {
  display: inline-flex; align-items: center; gap: 12px;
  font-size: 14px; font-weight: 600; letter-spacing: 0.08em;
  text-transform: uppercase; color: #E87C3E; margin: 0 0 16px;
}
.magas-page-hero__title {
  font-size: 46px; line-height: 1.12; font-weight: 700;
  color: #fff; margin: 0;
}
.magas-page-hero__payoff {
  font-size: 19px; line-height: 1.6; color: rgba(255,255,255,0.82);
  margin: 18px 0 0; max-width: 640px;
}

/* --- SEZIONI GENERICHE --- */
.magas-page-section {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding: 72px 0;
  background: #fff;
}
.magas-page-section--light { background: #F7F7F5; }

.magas-page__inner {
  max-width: 1100px; margin: 0 auto; padding: 0 40px;
}

.magas-page-eyebrow {
  display: inline-flex; align-items: center; gap: 12px;
  font-size: 14px; font-weight: 600; letter-spacing: 0.08em;
  text-transform: uppercase; color: #E87C3E; margin: 0 0 14px;
}
/* lineetta arancio davanti agli occhielli */
.magas-page-eyebrow::before,
.magas-page-hero__eyebrow::before {
  content: ""; width: 28px; height: 2px; background: #E87C3E;
}
.magas-page-title {
  position: relative;
  font-size: 34px; line-height: 1.2; font-weight: 700;
  color: #0B1220; margin: 0 0 20px; padding-bottom: 18px;
}
/* accento sotto i titoli sezione */
.magas-page-title::after {
  content: "";
  position: absolute; left: 0; bottom: 0;
  width: 48px; height: 3px; background: #E87C3E;
}
.magas-page-lead {
  font-size: 19px; line-height: 1.65; color: #3a3f4a;
  margin: 0; max-width: 760px;
}

/* --- GRIGLIA "COSA COMPRENDE" --- */
.magas-page-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px; margin-top: 36px;
  align-items: stretch;            /* card della stessa riga alte uguali */
}

/* Fix WordPress: elimina il margin-top automatico sui figli della griglia */
.magas-page-grid > *,
.magas-page-grid.is-layout-flow > * {
  margin-block-start: 0 !important;
  margin-top: 0 !important;
}
.magas-page-grid__item {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;     /* contenuto ancorato in alto */
  background: #fff;
  border: 1px solid #e7e7e3;
  border-radius: 10px;
  padding: 32px;
  box-shadow: 0 1px 3px rgba(11,18,32,0.04);
  overflow: hidden;
  box-sizing: border-box;
  transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
/* barra arancio in alto allo hover */
.magas-page-grid__item::before {
  content: "";
  position: absolute; top: 0; left: 0;
  width: 100%; height: 3px; background: #E87C3E;
  transform: scaleX(0); transform-origin: left;
  transition: transform .25s ease;
}
.magas-page-grid__item:hover::before { transform: scaleX(1); }
.magas-page-grid__item:hover {
  border-color: #E87C3E;
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(11,18,32,0.10);
}
.magas-page-grid__item h4 {
  font-size: 18px; font-weight: 700; color: #0B1220; margin: 0 0 10px;
}
.magas-page-grid__item p {
  font-size: 15px; line-height: 1.6; color: #555b66; margin: 0;
}

/* --- "COME LAVORIAMO" (fasi) --- */
.magas-page-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 28px; margin-top: 36px;
  align-items: stretch;
}

/* Fix WordPress: elimina il margin-top automatico sui figli della griglia numerata */
.magas-page-steps > *,
.magas-page-steps.is-layout-flow > * {
  margin-block-start: 0 !important;
  margin-top: 0 !important;
}
.magas-page-step {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  background: #fff;
  border: 1px solid #e7e7e3;
  border-radius: 8px;
  padding: 28px;
  box-sizing: border-box;
}
.magas-page-step__num {
  display: flex; align-items: center; justify-content: center;
  width: 46px; height: 46px; border-radius: 50%;
  background: #E87C3E; color: #fff; font-size: 18px; font-weight: 700;
  line-height: 1; margin: 0 0 16px;
}
.magas-page-step h4 {
  font-size: 17px; font-weight: 700; color: #0B1220; margin: 0 0 8px;
}
.magas-page-step p {
  font-size: 15px; line-height: 1.6; color: #555b66; margin: 0;
}

/* --- ICONE CARD --- */
.magas-card-icon {
  width: 48px; height: 48px; border-radius: 10px;
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(232,124,62,0.10); color: #E87C3E;
  margin-bottom: 18px;
}
.magas-card-icon svg { width: 24px; height: 24px; }

/* --- CTA --- */
.magas-page-cta {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding: 64px 0; background: #0B1220;
}
.magas-page-cta__title {
  font-size: 30px; font-weight: 700; color: #fff; margin: 0 0 12px;
}
.magas-page-cta__text {
  font-size: 17px; line-height: 1.6; color: rgba(255,255,255,0.78);
  margin: 0 0 28px; max-width: 620px;
}

/* --- BOTTONE --- */
.magas-btn {
  display: inline-block; background: #E87C3E; color: #fff;
  font-size: 16px; font-weight: 600; text-decoration: none;
  padding: 15px 32px; border-radius: 6px; border: none; line-height: 1;
  transition: background .2s ease;
}
.magas-btn:hover { background: #d96d2e; color: #fff; }

/* --- MOBILE PAGINE SERVIZIO (unica media query) --- */
@media (max-width: 781px) {
  .magas-page-hero { min-height: 0; padding: 80px 0 64px; }
  .magas-page-hero__inner { padding: 0 20px; }
  .magas-page-hero::before {
    background: linear-gradient(180deg,
                rgba(11,18,32,0.86) 0%, rgba(11,18,32,0.93) 100%);
  }
  .magas-page-hero__title { font-size: 30px; }
  .magas-page-hero__payoff { font-size: 17px; }

  .magas-page-section { padding: 48px 0; }
  .magas-page__inner { padding: 0 20px; }
  .magas-page-title { font-size: 27px; }
  .magas-page-lead { font-size: 17px; }

  .magas-page-cta { padding: 48px 0; }
  .magas-page-cta__title { font-size: 25px; }
  /* le griglie vanno a 1 colonna da sole grazie ad auto-fit */
}
.magas-page-grid__item,
.magas-page-step {
  position: relative;
  align-self: stretch;
}

/* Normalizza margini interni card: titoli e paragrafi senza margini esterni */
.magas-page-grid__item > h4,
.magas-page-grid__item > .wp-block-heading,
.magas-page-step > h4,
.magas-page-step > .wp-block-heading {
  margin-top: 0 !important;
}
.magas-page-grid__item > p,
.magas-page-grid__item > .wp-block-paragraph,
.magas-page-step > p,
.magas-page-step > .wp-block-paragraph {
  margin-top: 8px !important;
  margin-bottom: 0 !important;
}
.magas-page-grid__item > .magas-card-icon,
.magas-page-step > .magas-card-icon {
  margin-top: 0 !important;
}
@media (max-width: 781px) {
  .magas-page-hero--progettazione {
    background-image: url('images/hero-progettazione.jpg') !important;
    background-size: cover !important;
    background-position: center !important;
  }
}
.magas-cta-flex {
  display: flex;
  align-items: center;
  gap: 48px;
}
.magas-cta-img {
  flex: 0 0 220px;
  width: 220px;
  height: 220px;
  border-radius: 12px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255,255,255,0.35);
  font-size: 14px;
}
.magas-cta-body { flex: 1; }

@media (max-width: 781px) {
  .magas-cta-flex { flex-direction: column; align-items: flex-start; gap: 28px; }
  .magas-cta-img { width: 100%; flex-basis: auto; height: 200px; }
}
/* Card servizi home: cliccabili su tutta l'area + hover arancio */
.magas-service-card {
  position: relative;
  transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.magas-service-card:hover {
  border-color: #E87C3E !important;
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(11,18,32,0.10) !important;
}
.magas-service-card h3 a {
  text-decoration: none;
  color: inherit;
}
.magas-service-card h3 a::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
}
/* Card home: solo il bordo SUPERIORE arancio, sempre e in hover */
.magas-service-card,
.magas-service-card:hover {
  border-top: 4px solid #E87C3E !important;
}
/* in hover gli altri 3 lati restano grigi (niente cornice arancio piena) */
.magas-service-card:hover {
  border-right-color: #E8E8E8 !important;
  border-bottom-color: #E8E8E8 !important;
  border-left-color: #E8E8E8 !important;
}
.magas-service-card h3,
.magas-service-card h3 a {
  color: #E87C3E !important;
}
/* === MENU A TENDINA (sottomenu header) === */
.header .menu .sub-menu,
.header .menu ul {
  background: #0B1220 !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 8px !important;
  padding: 8px 0 !important;
  box-shadow: 0 12px 28px rgba(0,0,0,0.25) !important;
}
.header .menu .sub-menu a,
.header .menu ul ul a {
  color: rgba(255,255,255,0.85) !important;
  padding: 10px 20px !important;
}
.header .menu .sub-menu a:hover {
  color: #E87C3E !important;
  background: rgba(255,255,255,0.04) !important;
}
.magas-page-hero--innovazione {
  background-image: url('images/hero-innovazione.jpg');
  background-size: cover;
}
/* === FOTO HERO PAGINE SERVIZIO === */
.magas-page-hero--trasformazione {
  background-image: url('images/traasformazione-organizzativa.jpg');
  background-size: cover;
}
.magas-page-hero--settore-energetico {
  background-image: url('images/settore-energetico.jpg');
  background-size: cover;
}
.magas-page-hero--sanita {
  background-image: url('images/sanita-e-welfare.jpg');
  background-size: cover;
}
.magas-page-hero--facility {
  background-image: url('images/facility.jpg');
  background-size: cover;
}
/* === FOTO RIQUADRO CTA === */
.magas-cta-img {
  background-image: url('images/CTA.jpg');
  background-size: cover;
  background-position: center;
  color: transparent;
}
/* === PAGINA CONTATTI === */
.magas-contatti-grid {
  display: grid;
  grid-template-columns: 1fr 1.3fr;
  gap: 40px;
  margin-top: 8px;
}
.magas-contatti-title { font-size: 22px; font-weight: 700; color:#0B1220; margin:0 0 14px; }
.magas-contatti-intro { font-size: 15px; line-height:1.65; color:#555b66; margin:0 0 28px; }
.magas-contatti-list { display:flex; flex-direction:column; gap:18px; }
.magas-contatti-item { display:flex; gap:14px; align-items:flex-start; }
.magas-contatti-item__icon {
  width:40px; height:40px; border-radius:9px; flex-shrink:0;
  background:rgba(232,124,62,0.10); color:#E87C3E;
  display:flex; align-items:center; justify-content:center;
}
.magas-contatti-item__icon svg { width:19px; height:19px; }
.magas-contatti-item__label { font-size:13px; color:#8a8f99; margin:0; }
.magas-contatti-item__value { font-size:15px; color:#0B1220; margin:2px 0 0; }
.magas-contatti-form {
  background:#fff; border:1px solid #e7e7e3; border-radius:12px; padding:30px;
}
.magas-form-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.magas-form-field { margin-bottom:16px; }
.magas-form-field label { display:block; font-size:13px; color:#555b66; margin-bottom:6px; }
.magas-form-field input,
.magas-form-field textarea {
  width:100%; box-sizing:border-box; border:1px solid #dcdcd6;
  border-radius:7px; background:#fafafa; padding:11px 12px;
  font-family:inherit; font-size:15px; color:#0B1220;
}
.magas-form-field textarea { min-height:120px; resize:vertical; }
.magas-form-submit {
  display:inline-block; background:#E87C3E; color:#fff; border:none;
  font-size:15px; font-weight:600; padding:13px 30px; border-radius:7px; cursor:pointer;
}
@media (max-width:781px){
  .magas-contatti-grid { grid-template-columns:1fr; gap:32px; }
  .magas-form-row { grid-template-columns:1fr; }
}
/* === PAGINA TEAM === */
.magas-team-founder {
  display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center;
}
.magas-team-photo {
  background:#eef0f2; border:1px solid #e3e5e8;
  display:flex; align-items:center; justify-content:center;
  color:#b4b9c0; font-size:13px; background-size:cover; background-position:center;
}
.magas-team-founder__photo { aspect-ratio:4/3; border-radius:14px; }
.magas-team-label { margin:0 0 8px; color:#E87C3E; font-size:12px; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; }
.magas-team-founder__name { margin:0; font-size:26px; font-weight:700; color:#0B1220; }
.magas-team-founder__role { margin:4px 0 16px; font-size:15px; color:#8a8f99; }
.magas-team-founder__bio { margin:0; font-size:15px; line-height:1.65; color:#555b66; }

.magas-team-block { margin-top:48px; }
/* tre colonne larghe uguali e alte uguali */
.magas-team-grid {
  display:grid; grid-template-columns:repeat(3, minmax(0,1fr));
  gap:24px; margin-top:36px; align-items:stretch;
}
.magas-team-card {
  display:flex; flex-direction:column;
  background:#fff; border:1px solid #e7e7e3; border-radius:12px; overflow:hidden;
}
.magas-team-card__photo { aspect-ratio:4/3; border-radius:0; }
.magas-team-card__body { padding:22px 24px; }
.magas-team-card__name { margin:0 0 12px; font-size:19px; font-weight:700; color:#0B1220; }
.magas-team-card__bio { margin:0; font-size:14px; line-height:1.6; color:#555b66; }

/* terza colonna: nota consulenti come card con bordo tratteggiato arancio */
.magas-team-note {
  display:flex; flex-direction:column; gap:14px;
  background:#fff; border:1px dashed #E87C3E; border-radius:12px;
  padding:24px;
}
.magas-team-note__icon {
  width:40px; height:40px; border-radius:9px; flex-shrink:0;
  background:rgba(232,124,62,0.10); color:#E87C3E;
  display:flex; align-items:center; justify-content:center;
}
.magas-team-note__icon svg { width:20px; height:20px; }
.magas-team-note p { margin:0; font-size:14px; line-height:1.6; color:#555b66; }
.magas-team-note strong { color:#0B1220; }
.magas-team-note__placeholder { color:#b4b9c0; font-style:italic; }

.magas-team-cta { max-width:1100px; margin:0 auto; padding:0 40px; text-align:center; }

@media (max-width:781px){
  .magas-team-founder { grid-template-columns:1fr; gap:24px; }
  .magas-team-founder__photo { max-width:324px; }
  .magas-team-grid { grid-template-columns:1fr; }
  .magas-team-cta { padding:0 20px; }
}

/* === COLORI SEZIONI HOME: AI navy, METODO chiara (ripristino) ===
   Va in fondo al file per sovrascrivere le regole precedenti. */

/* --- Sezione AI: sfondo navy + testi chiari --- */
.magas-section-ai {
  background: linear-gradient(135deg, #101C35 0%, #1A2A50 100%) !important;
}
.magas-ai-title { color: #ffffff !important; }
.magas-ai-text  { color: rgba(255,255,255,0.55) !important; }
.magas-ai-card {
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
}
.magas-ai-card h4 { color: #ffffff !important; }
.magas-ai-card p  { color: rgba(255,255,255,0.5) !important; }

/* --- Sezione METODO: sfondo chiaro + testi scuri --- */
.magas-section-method {
  background: #F7F7F5 !important;
}
.magas-method-title { color: #0B1220 !important; }
.magas-method-text  { color: #666 !important; }
.magas-checklist li { color: #444 !important; }
.magas-method-img {
  background: #1A2540 !important;
  border: none !important;
}

/* === SCROLL ANCORA SEZIONE SERVIZI ===
   Compensa l'header fisso da 80px quando si salta a #servizi,
   così il titolo non finisce nascosto sotto la barra. */
html { scroll-behavior: smooth; }
#servizi, #metodo { scroll-margin-top: 100px; }


/* === FOOTER: sottovoci "Servizi" (tendina del menu) === */
.magas-footer__list .sub-menu {
  list-style: none;
  margin: 10px 0 6px;
  padding-left: 14px;
  border-left: 1px solid rgba(255,255,255,0.12);
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.magas-footer__list .sub-menu li { margin-bottom: 0; }
.magas-footer__list .sub-menu a {
  font-size: 14px;
  color: #7e8798;
}
.magas-footer__list .sub-menu a:hover { color: #E87C3E; }

/* === FOTO TEAM (pagina Conosci il team) === */
.magas-photo--marco { background-image: url('images/marco.jpg'); color: transparent; }
.magas-photo--carlo { background-image: url('images/carlo.jpg'); color: transparent; }
.magas-photo--raimondo { background-image: url('images/raimondo.jpg'); color: transparent; }
.magas-photo--consulenti { background-image: url('images/consulenti.jpg'); color: transparent; }

/* === FOTO SEZIONE METODO (home) === */
.magas-method-img {
  background-image: url('images/targa-magas.jpg') !important;
  background-size: cover !important;
  background-position: center !important;
}
.magas-method-img p { display: none !important; }

/* Footer: "Servizi" come etichetta (non link), stessa dimensione delle altre voci */
.magas-footer__list .magas-footer__label {
  color: #9aa3b2 !important;
  font-size: 15px !important;
  line-height: 1.5 !important;
  font-weight: 400 !important;
  cursor: default;
}
/* === HERO PIÙ BASSO SOLO NELLA PAGINA CONTATTI === */
.magas-page-hero--contatti {
  min-height: 420px !important;
  padding: 90px 0 !important;
}
@media (max-width: 781px) {
  .magas-page-hero--contatti {
    min-height: 0 !important;
    padding: 64px 0 !important;
  }
}