/* ===========================================================
   B4 Redesign — Elementor widget overrides
   Hardens Elementor default styles against our tokens.
   =========================================================== */

/* ---------- Sezioni: padding di default più editoriale ---------- */
.elementor-section.elementor-section-boxed > .elementor-container {
  max-width: var(--page-max);
}

/* ---------- Bottoni: pill style ---------- */
.elementor-button,
.elementor-button-link {
  border-radius: var(--r-pill) !important;
  font-family: var(--font-sans) !important;
  font-weight: 500 !important;
  font-size: 15px !important;
  padding: 14px 24px !important;
  letter-spacing: 0 !important;
  transition: transform var(--dur-1) var(--ease), background var(--dur-1) var(--ease), box-shadow var(--dur-2) var(--ease) !important;
}
.elementor-button:hover { transform: translateY(-1px); }

.elementor-button-primary,
.elementor-button.b4-btn-primary {
  background: hsl(var(--b4-blue-ink)) !important;
  color: #fff !important;
}
.elementor-button-primary:hover,
.elementor-button.b4-btn-primary:hover {
  background: hsl(var(--b4-blue)) !important;
  box-shadow: var(--sh-blue) !important;
}

.elementor-button.b4-btn-ghost {
  background: transparent !important;
  color: hsl(var(--b4-blue-ink)) !important;
  border: 1px solid hsl(var(--line)) !important;
}
.elementor-button.b4-btn-ghost:hover {
  border-color: hsl(var(--b4-blue-ink)) !important;
}

/* ---------- Card widget ---------- */
.elementor-widget-call-to-action .elementor-cta,
.b4-card {
  border-radius: var(--r-xl) !important;
  background: hsl(var(--surface)) !important;
  border: 1px solid hsl(var(--line)) !important;
  box-shadow: var(--sh-1);
  transition: box-shadow var(--dur-2) var(--ease), transform var(--dur-2) var(--ease);
  overflow: hidden;
}
.b4-card:hover {
  box-shadow: var(--sh-2);
  transform: translateY(-2px);
}

/* ---------- Icon box ---------- */
.elementor-widget-icon-box .elementor-icon {
  border-radius: 14px !important;
}

/* ---------- Forms ---------- */
.elementor-field,
.elementor-field-textual {
  border-radius: 10px !important;
  border: 1px solid hsl(var(--line)) !important;
  background: hsl(var(--surface)) !important;
  color: hsl(var(--ink)) !important;
  font-family: var(--font-sans) !important;
  font-size: 15px !important;
  padding: 12px 14px !important;
  transition: border-color .2s !important;
}
.elementor-field:focus { border-color: hsl(var(--b4-blue)) !important; outline: none !important; }

/* ---------- Headings align with tokens ---------- */
.elementor-heading-title.b4-display {
  font-size: clamp(44px, 7vw, 96px) !important;
  font-weight: 400 !important;
  font-family: var(--font-display) !important;
}

/* ---------- Header/Footer ---------- */
header.elementor-location-header {
  backdrop-filter: saturate(140%) blur(10px);
  background: hsl(var(--bg) / .8);
  border-bottom: 1px solid hsl(var(--line));
}
footer.elementor-location-footer {
  background: hsl(var(--b4-blue-ink));
  color: hsl(210 40% 85%);
}
footer.elementor-location-footer a { color: hsl(210 40% 85%); }
footer.elementor-location-footer h1,
footer.elementor-location-footer h2,
footer.elementor-location-footer h3,
footer.elementor-location-footer h4 { color: #fff !important; }

/* ---------- Numeri sezione dark ---------- */
.b4-dark-section {
  background: hsl(var(--b4-blue-ink));
  color: #fff;
  position: relative;
  overflow: hidden;
}
.b4-dark-section h1, .b4-dark-section h2, .b4-dark-section h3 { color: #fff !important; }
.b4-dark-section .b4-eyebrow { color: hsl(var(--b4-aqua)); }
.b4-dark-section .b4-eyebrow::before { background: hsl(var(--b4-aqua)); }

/* ---------- Count-up number ---------- */
.b4-number {
  font-family: var(--font-display);
  font-size: clamp(60px, 9vw, 120px);
  font-weight: 300;
  line-height: 1;
  letter-spacing: -.04em;
  color: inherit;
}

/* ---------- Industrie list ---------- */
.b4-index-row {
  display: grid;
  grid-template-columns: 80px 1fr auto 40px;
  align-items: center; gap: 24px;
  padding: 28px 0;
  border-bottom: 1px solid hsl(var(--line));
  cursor: pointer;
  transition: padding .4s var(--ease);
}
.b4-index-row:hover { padding-left: 16px; }
.b4-index-row__num { font-family: var(--font-mono); font-size: 13px; color: hsl(var(--muted)); letter-spacing: .1em; }
.b4-index-row__title { font-family: var(--font-display); font-size: 30px; font-weight: 400; letter-spacing: -.02em; color: hsl(var(--b4-blue-ink)); }
.b4-index-row__meta { font-size: 14px; color: hsl(var(--muted)); margin-top: 4px; font-style: italic; }

@media (max-width: 780px) {
  .b4-index-row { grid-template-columns: 60px 1fr; }
  .b4-index-row > :nth-child(3),
  .b4-index-row > :nth-child(4) { display: none; }
}