.ab-hero, .ab-hero *,
    .ab-hero *::before, .ab-hero *::after { box-sizing: border-box; }
    .ab-hero { font-family: Arial, Helvetica, sans-serif; }
    .ab-hero {
      --ink: #263e58;
      --muted: #405369;
      --accent: #517da8;
      --line: #bfd6f4;
      position: relative;
      isolation: isolate;
      min-height: min(850px, 100svh);
      overflow: hidden;
      color: var(--ink);
      background: linear-gradient(127deg, #f7f9fc 1%, #edf2f8 48%, #dce8f4 100%);
    }
    .ab-hero::before {
      content: "";
      position: absolute;
      z-index: -1;
      inset: 0 0 0 53%;
      background: linear-gradient(151deg, #517da8 0%, #263e58 56%, #344b63 100%);
      clip-path: polygon(16% 0, 100% 0, 100% 100%, 0 100%);
    }
    .ab-hero::after {
      content: "";
      position: absolute;
      z-index: -1;
      width: 48vw;
      height: 48vw;
      max-width: 800px;
      max-height: 800px;
      left: -20vw;
      bottom: -38vw;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(191,214,244,.57), rgba(191,214,244,0) 69%);
      pointer-events: none;
    }
    .ab-hero .ab-shell { width: min(calc(100% - 112px), 1420px); margin-inline: auto; }
    .ab-hero .ab-main {
      position: relative;
      min-height: 705px;
      display: grid;
      grid-template-columns: minmax(0, 56%) minmax(0, 44%);
      align-items: center;
      gap: 0;
      padding-block: 22px 90px;
    }
    .ab-hero .ab-copy {
      z-index: 2;
      max-width: 750px;
      padding: 14px 5vw 0 0;
    }
    .ab-hero .ab-kicker {
      display: flex;
      align-items: center;
      gap: 16px;
      margin: 0 0 34px;
      color: #51779e;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .21em;
      text-transform: uppercase;
    }
    .ab-hero .ab-kicker::before {
      content: "";
      width: 41px;
      height: 1px;
      background: #517da8;
      flex: none;
    }
    .ab-hero :is(h1, .ab-headline) {
      max-width: 820px;
      margin: 0;
      font-family: Georgia, "Times New Roman", serif;
      font-weight: 400;
      letter-spacing: -.052em;
      font-size: clamp(58px, 6.45vw, 108px);
      line-height: 1.04;
      text-wrap: balance;
      color: var(--ink);
    }
    .ab-hero :is(h1, .ab-headline) .ab-gradient {
      background: linear-gradient(105deg, #263e58 0%, #517da8 48%, #29445e 100%);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
      -webkit-text-fill-color: transparent;
      font-weight: 700;
      line-height: 1.14;
      text-shadow: none;
    }
    .ab-hero .ab-description {
      max-width: 495px;
      margin: 27px 0 0;
      color: var(--muted);
      font-size: clamp(15px, 1.15vw, 18px);
      line-height: 1.72;
    }
    .ab-hero .ab-actions {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 22px 28px;
      margin-top: 35px;
    }
    .ab-hero .ab-primary {
      display: inline-flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
      min-height: 61px;
      padding: 14px 15px 14px 22px;
      border: 1px solid var(--line);
      border-radius: 4px;
      background-color: transparent;
      background-image: linear-gradient(180deg, #fff 0%, #fff 100%);
      color: var(--ink);
      box-shadow: 0 15px 35px rgba(38,62,88,.09);
      text-decoration: none;
      text-align: left;
      font-size: 12px;
      font-weight: 700;
      letter-spacing: .07em;
      transition: transform .25s ease, color .25s ease, background-image .25s ease, box-shadow .25s ease;
    }
    .ab-hero .ab-primary .ab-arrow {
      display: grid;
      place-items: center;
      flex: none;
      width: 30px;
      height: 30px;
      border-radius: 50%;
      background: #dbe8f7;
      color: var(--ink);
      font-size: 20px;
      font-weight: 400;
      transition: background .25s ease, color .25s ease, transform .25s ease;
    }
    .ab-hero .ab-primary:hover,
    .ab-hero .ab-primary:focus-visible {
      transform: translateY(-3px);
      color: #fff;
      background-image: linear-gradient(105deg, #263e58 0%, #517da8 100%);
      box-shadow: 0 18px 38px rgba(38,62,88,.2);
    }
    .ab-hero .ab-primary:hover .ab-arrow,
    .ab-hero .ab-primary:focus-visible .ab-arrow {
      background: #fff;
      color: var(--ink);
      transform: translateX(2px);
    }
    .ab-hero .ab-secondary {
      color: var(--ink);
      font-size: 12px;
      font-weight: 700;
      letter-spacing: .035em;
      text-decoration: none;
      border-bottom: 1px solid #94b1ce;
      padding-bottom: 6px;
      transition: color .25s ease, border-color .25s ease;
    }
    .ab-hero .ab-secondary:hover,
    .ab-hero .ab-secondary:focus-visible { color: #517da8; border-color: #517da8; }
    .ab-hero .ab-services {
      display: flex;
      flex-wrap: wrap;
      gap: 10px 0;
      max-width: 575px;
      margin-top: 64px;
      padding-top: 19px;
      border-top: 1px solid #cbd8e6;
      font-size: 11px;
      font-weight: 700;
      color: #60778d;
      letter-spacing: .025em;
    }
    .ab-hero .ab-services span:not(:last-child)::after {
      content: " / ";
      padding-inline: 13px;
      color: #8daac9;
    }
    .ab-hero .ab-visual {
      position: relative;
      align-self: stretch;
      min-height: 620px;
      margin: 10px 0 0;
      padding: 6px 0 0 18px;
    }
    .ab-hero .ab-visual::before {
      content: "";
      position: absolute;
      left: 0;
      top: -9px;
      width: 45%;
      height: 51%;
      border-top: 1px solid #bfd6f4;
      border-left: 1px solid #bfd6f4;
      border-top-left-radius: 180px;
    }
    .ab-hero .ab-photo {
      position: absolute;
      inset: 6px 0 0 18px;
      margin: 0;
      overflow: hidden;
      border: 9px solid #d9e8f8;
      border-radius: 173px 5px 5px 5px;
      box-shadow: 0 32px 65px rgba(13,37,60,.27);
      background: #52749a;
    }
    .ab-hero .ab-photo img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: 50% 48%;
    }
    .ab-hero .ab-photo::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, rgba(23,50,78,.19), transparent 36%, transparent 62%, rgba(16,36,55,.66));
      pointer-events: none;
    }
    .ab-hero .ab-location {
      position: absolute;
      z-index: 1;
      top: 27px;
      right: 25px;
      color: #fff;
      font-size: 10px;
      line-height: 1.4;
      letter-spacing: .2em;
      font-weight: 700;
      text-transform: uppercase;
      text-align: right;
      text-shadow: 0 1px 10px rgba(0,0,0,.4);
    }
    .ab-hero .ab-location small {
      display: block;
      font-weight: 400;
      letter-spacing: .13em;
      opacity: .88;
    }
    .ab-hero .ab-caption {
      position: absolute;
      z-index: 1;
      right: 25px;
      bottom: 27px;
      left: 32px;
      display: flex;
      align-items: end;
      justify-content: space-between;
      gap: 15px;
      padding-top: 18px;
      border-top: 1px solid rgba(255,255,255,.58);
      color: white;
      font-family: Georgia, "Times New Roman", serif;
      font-size: clamp(17px, 1.8vw, 25px);
      line-height: 1.2;
    }
    .ab-hero .ab-caption small {
      font-family: Arial, Helvetica, sans-serif;
      font-size: 9px;
      font-weight: 700;
      letter-spacing: .17em;
      white-space: nowrap;
    }
    .ab-hero a:focus-visible { outline: 3px solid #789fce; outline-offset: 4px; }
    @media (max-width: 1050px) {
      .ab-hero .ab-shell { width: min(calc(100% - 70px), 1420px); }
      .ab-hero .ab-main { grid-template-columns: minmax(0, 54%) minmax(0, 46%); min-height: 670px; }
      .ab-hero .ab-copy { padding-right: 3vw; }
      .ab-hero :is(h1, .ab-headline) { font-size: clamp(51px, 6.1vw, 80px); }
      .ab-hero .ab-visual { min-height: 570px; }
    }
    @media (max-width: 767px) {
      .ab-hero { min-height: 0; background: linear-gradient(158deg, #f7f9fc 0%, #edf2f8 60%, #dce8f4 100%); }
      .ab-hero::before { inset: auto 0 0 0; height: 39%; clip-path: polygon(0 13%,100% 0,100% 100%,0 100%); }
      .ab-hero .ab-shell { width: min(calc(100% - 40px), 560px); }
      .ab-hero .ab-main { display: flex; flex-direction: column; align-items: stretch; min-height: 0; padding: 33px 0 60px; }
      .ab-hero .ab-copy { max-width: none; padding: 0; }
      .ab-hero .ab-kicker { margin-bottom: 23px; font-size: 10px; }
      .ab-hero :is(h1, .ab-headline) { max-width: 600px; font-size: clamp(51px, 9.1vw, 75px); }
      .ab-hero .ab-description { margin-top: 22px; font-size: 15px; }
      .ab-hero .ab-actions { margin-top: 25px; }
      .ab-hero .ab-services { margin-top: 38px; }
      .ab-hero .ab-visual { width: 100%; min-height: 500px; margin-top: 39px; padding-left: 0; }
      .ab-hero .ab-photo { inset: 8px 0 0; }
      .ab-hero .ab-visual::before { left: -10px; }
    }
    @media (max-width: 450px) {
      .ab-hero :is(h1, .ab-headline) { font-size: clamp(47px, 11.3vw, 58px); }
      .ab-hero .ab-primary { width: 100%; }
      .ab-hero .ab-services { font-size: 10px; line-height: 1.5; }
      .ab-hero .ab-services span:not(:last-child)::after { padding-inline: 6px; }
      .ab-hero .ab-visual { min-height: 430px; }
      .ab-hero .ab-photo { border-width: 7px; border-top-left-radius: 128px; }
      .ab-hero .ab-caption { left: 23px; right: 18px; font-size: 17px; }
      .ab-hero .ab-caption small { display: none; }
    }
    @media (prefers-reduced-motion: reduce) {
      .ab-hero *, .ab-hero *::after { transition: none !important; }
    }
    /* Scene alternate: il blu segue l'immagine, lasciando il titolo sul chiaro. */
    .ab-hero::before { opacity: 1; transition: opacity .85s ease; }
    .ab-hero::after {
      inset: 0 51% 0 0;
      width: auto;
      height: auto;
      max-width: none;
      max-height: none;
      border-radius: 0;
      background: linear-gradient(205deg, #517da8 0%, #263e58 57%, #344b63 100%);
      clip-path: polygon(0 0, 100% 0, 82% 100%, 0 100%);
      opacity: 0;
      transition: opacity .85s ease;
    }
    .ab-hero[data-scene="video"]::before { opacity: 0; }
    .ab-hero[data-scene="video"]::after { opacity: 1; }
    .ab-hero .ab-stage { display: grid; position: relative; }
    .ab-hero .ab-stage > .ab-main { grid-area: 1 / 1; width: 100%; }
    .ab-hero .ab-main {
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      transition: opacity .65s ease, visibility 0s linear .65s;
    }
    .ab-hero .ab-main.is-active {
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
      transition: opacity .65s ease .18s, visibility 0s;
    }
    .ab-hero .ab-main--video .ab-visual { grid-column: 1; grid-row: 1; margin-right: clamp(40px, 5vw, 90px); margin-left: 0; }
    .ab-hero .ab-main--video .ab-copy { grid-column: 2; grid-row: 1; padding: 14px 0 0 clamp(8px, 1.5vw, 25px); }
    .ab-hero .ab-main--video .ab-headline { font-size: clamp(56px, 5.7vw, 91px); }
    .ab-hero .ab-main--video .ab-photo { inset: 6px 18px 0 0; border-radius: 5px 173px 5px 5px; }
    .ab-hero .ab-main--video .ab-visual::before {
      left: auto;
      right: 0;
      border-left: 0;
      border-right: 1px solid #bfd6f4;
      border-top-left-radius: 0;
      border-top-right-radius: 180px;
    }
    .ab-hero .ab-main--video video {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center 39%;
      background: #080b0d;
    }
    .ab-hero .ab-main--video .ab-photo::after {
      background: linear-gradient(180deg, transparent 43%, rgba(9,21,32,.8) 100%);
    }
    .ab-hero .ab-main--video .ab-caption { left: 28px; }
    .ab-hero .ab-main--video .ab-caption small { color: #cbe0f7; }
    .ab-hero .ab-main--video .ab-services { margin-top: 56px; }

    .ab-hero .ab-controls {
      position: absolute;
      z-index: 4;
      right: 0;
      bottom: 24px;
      display: flex;
      align-items: center;
      gap: 18px;
      color: #fff;
    }
    .ab-hero .ab-step,
    .ab-hero .ab-pause {
      appearance: none;
      border: 0;
      padding: 10px 0 12px;
      background: transparent;
      color: inherit;
      cursor: pointer;
      font: 700 10px/1.2 Arial, Helvetica, sans-serif;
      letter-spacing: .11em;
      text-transform: uppercase;
    }
    .ab-hero .ab-step { position: relative; min-width: 79px; text-align: left; opacity: .7; border-bottom: 1px solid currentColor; }
    .ab-hero .ab-step[aria-pressed="true"] { opacity: 1; }
    .ab-hero .ab-step[aria-pressed="true"]::after {
      content: "";
      position: absolute;
      bottom: -2px;
      left: 0;
      width: 100%;
      height: 3px;
      background: #bfd6f4;
      transform-origin: left;
      animation: ab-hero-progress var(--ab-delay, 7200ms) linear forwards;
    }
    .ab-hero.ab-is-paused .ab-step::after { animation-play-state: paused; }
    .ab-hero .ab-pause { padding: 9px 11px; border: 1px solid currentColor; border-radius: 3px; }
    .ab-hero .ab-step:hover,
    .ab-hero .ab-pause:hover { opacity: 1; }
    .ab-hero .ab-step:focus-visible,
    .ab-hero .ab-pause:focus-visible { outline: 3px solid #9bbfe7; outline-offset: 4px; }
    .ab-hero[data-scene="video"] .ab-controls { color: var(--ink); }
    .ab-hero[data-scene="video"] .ab-step[aria-pressed="true"]::after { background: #517da8; }
    @keyframes ab-hero-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }

    /* Le varianti condividono i pulsanti accessibili e la logica di cambio scena. */
    .ab-hero[data-pagination="dots"] .ab-step {
      display: grid;
      place-items: center;
      width: 34px;
      height: 38px;
      min-width: 0;
      padding: 0;
      border: 0;
      font-size: 0;
      text-align: center;
    }
    .ab-hero[data-pagination="dots"] .ab-step::before {
      content: "";
      width: 9px;
      height: 9px;
      border: 1px solid currentColor;
      border-radius: 50%;
      transition: background-color .2s ease, transform .2s ease;
    }
    .ab-hero[data-pagination="dots"] .ab-step[aria-pressed="true"]::before {
      background: currentColor;
      transform: scale(1.35);
    }
    .ab-hero[data-pagination="dots"] .ab-step:hover::before { transform: scale(1.35); }
    .ab-hero[data-pagination="dots"] .ab-step::after { display: none; }
    .ab-hero[data-pagination="dots"] .ab-controls { gap: 4px; }
    .ab-hero[data-pagination="dots"] .ab-pause { margin-left: 10px; }

    .ab-hero[data-pagination="bar"] .ab-step {
      width: clamp(62px, 7vw, 108px);
      min-width: 0;
      height: 38px;
      padding: 0;
      border: 0;
      font-size: 0;
    }
    .ab-hero[data-pagination="bar"] .ab-step::before {
      content: "";
      position: absolute;
      top: 17px;
      left: 0;
      width: 100%;
      height: 3px;
      background: currentColor;
      opacity: .55;
    }
    .ab-hero[data-pagination="bar"] .ab-step[aria-pressed="true"]::after {
      top: 17px;
      bottom: auto;
      height: 3px;
    }
    .ab-hero[data-pagination="bar"] .ab-controls { gap: 10px; }
    .ab-hero[data-pagination="bar"] .ab-pause { margin-left: 8px; }

    @media (max-width: 1050px) {
      .ab-hero .ab-main--video .ab-headline { font-size: clamp(48px, 5.4vw, 70px); }
      .ab-hero .ab-main--video .ab-visual { margin-right: 3vw; }
    }
    @media (max-width: 767px) {
      .ab-hero::after {
        inset: auto 0 0 0;
        height: 39%;
        clip-path: polygon(0 13%, 100% 0, 100% 100%, 0 100%);
      }
      .ab-hero .ab-main--video .ab-copy,
      .ab-hero .ab-main--video .ab-visual { grid-column: auto; grid-row: auto; }
      .ab-hero .ab-main--video .ab-copy { order: 0; padding: 0; }
      .ab-hero .ab-main--video .ab-visual { order: 1; margin: 39px 0 0; }
      .ab-hero .ab-main--video .ab-headline { font-size: clamp(51px, 9.1vw, 75px); }
      .ab-hero .ab-main--video .ab-services { margin-top: 38px; }
      .ab-hero .ab-controls,
      .ab-hero[data-scene="video"] .ab-controls { right: 0; bottom: 17px; color: #fff; }
      .ab-hero[data-scene="video"] .ab-step[aria-pressed="true"]::after { background: #bfd6f4; }
    }
    @media (max-width: 450px) {
      .ab-hero .ab-main--video .ab-headline { font-size: clamp(47px, 11.3vw, 58px); }
      .ab-hero .ab-main--video .ab-photo { inset: 8px 0 0; border-top-right-radius: 128px; }
      .ab-hero .ab-controls { gap: 12px; }
      .ab-hero .ab-step { min-width: 63px; }
    }
    @media (prefers-reduced-motion: reduce) {
      .ab-hero::before,
      .ab-hero::after,
      .ab-hero .ab-main { transition: none !important; }
      .ab-hero .ab-step::after { animation: none !important; transform: scaleX(1); }
    }
    /* La scena eredita l'altezza del widget quando Elementor la imposta a 100vh. */
    .elementor-widget-cc_albabridge_hero {
      align-self: stretch;
      display: flex;
      flex-direction: column;
      width: 100%;
      height: 100%;
      margin-bottom: 0;
    }
    .elementor-widget-cc_albabridge_hero > .elementor-widget-container {
      display: flex;
      flex: 1 1 auto;
      flex-direction: column;
      width: 100%;
      min-height: 100%;
      margin-bottom: 0;
    }
    .ab-hero {
      display: flex;
      flex: 1 1 auto;
      flex-direction: column;
      width: 100%;
      height: 100%;
      min-height: 0;
    }
    .ab-hero .ab-stage {
      flex: 1 1 auto;
      grid-template-rows: minmax(0, 1fr);
      min-height: max(700px, calc(100svh - 80px));
    }
    .ab-hero .ab-stage > .ab-main { height: 100%; min-height: 0; }
    @media (max-width: 767px) {
      /* Il testo e l'immagine possono superare l'altezza dello schermo. */
      .ab-hero { height: auto; min-height: 100%; }
      .ab-hero .ab-stage { grid-template-rows: auto; min-height: 0; }
      .ab-hero .ab-stage > .ab-main { height: auto; min-height: 0; }
    }

.ab-hero .ab-caption { pointer-events: none; }

/* Inversione indipendente su tablet: il blu resta dietro al media. */
@media (min-width: 768px) and (max-width: 1024px) {
  .ab-hero[data-reverse-tablet="yes"]::before {
    inset: 0 53% 0 0;
    clip-path: polygon(0 0, 84% 0, 100% 100%, 0 100%);
  }
  .ab-hero[data-reverse-tablet="yes"]::after {
    inset: 0 0 0 51%;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 18% 100%);
  }
  .ab-hero[data-reverse-tablet="yes"] .ab-main--city {
    grid-template-columns: minmax(0, 46%) minmax(0, 54%);
  }
  .ab-hero[data-reverse-tablet="yes"] .ab-main--city .ab-copy {
    grid-column: 2;
    grid-row: 1;
    padding: 14px 0 0 clamp(8px, 1.5vw, 25px);
  }
  .ab-hero[data-reverse-tablet="yes"] .ab-main--city .ab-visual {
    grid-column: 1;
    grid-row: 1;
    margin-right: clamp(40px, 5vw, 90px);
    padding-left: 0;
  }
  .ab-hero[data-reverse-tablet="yes"] .ab-main--city .ab-photo {
    inset: 6px 18px 0 0;
    border-radius: 5px 173px 5px 5px;
  }
  .ab-hero[data-reverse-tablet="yes"] .ab-main--city .ab-visual::before {
    left: auto;
    right: 0;
    border-left: 0;
    border-right: 1px solid #bfd6f4;
    border-top-left-radius: 0;
    border-top-right-radius: 180px;
  }
  .ab-hero[data-reverse-tablet="yes"] .ab-main--video .ab-copy {
    grid-column: 1;
    grid-row: 1;
    padding: 14px 3vw 0 0;
  }
  .ab-hero[data-reverse-tablet="yes"] .ab-main--video .ab-visual {
    grid-column: 2;
    grid-row: 1;
    margin: 10px 0 0;
    padding-left: 18px;
  }
  .ab-hero[data-reverse-tablet="yes"] .ab-main--video .ab-photo {
    inset: 6px 0 0 18px;
    border-radius: 173px 5px 5px 5px;
  }
  .ab-hero[data-reverse-tablet="yes"] .ab-main--video .ab-visual::before {
    left: 0;
    right: auto;
    border-left: 1px solid #bfd6f4;
    border-right: 0;
    border-top-left-radius: 180px;
    border-top-right-radius: 0;
  }
  .ab-hero[data-reverse-tablet="yes"] .ab-controls { color: var(--ink); }
  .ab-hero[data-reverse-tablet="yes"] .ab-step[aria-pressed="true"]::after { background: #517da8; }
  .ab-hero[data-reverse-tablet="yes"][data-scene="video"] .ab-controls { color: #fff; }
  .ab-hero[data-reverse-tablet="yes"][data-scene="video"] .ab-step[aria-pressed="true"]::after { background: #bfd6f4; }
}

/* Su mobile l'inversione sposta il media in cima, lasciando il testo sul chiaro. */
@media (max-width: 767px) {
  .ab-hero[data-reverse-mobile="yes"]::before,
  .ab-hero[data-reverse-mobile="yes"]::after {
    inset: 0 0 auto 0;
    height: min(45%, 520px);
    clip-path: polygon(0 0, 100% 0, 100% 88%, 0 100%);
  }
  .ab-hero[data-reverse-mobile="yes"] .ab-main--city .ab-visual,
  .ab-hero[data-reverse-mobile="yes"] .ab-main--video .ab-visual {
    order: 0;
    margin: 0 0 39px;
  }
  .ab-hero[data-reverse-mobile="yes"] .ab-main--city .ab-copy,
  .ab-hero[data-reverse-mobile="yes"] .ab-main--video .ab-copy {
    order: 1;
  }
  .ab-hero[data-reverse-mobile="yes"] .ab-controls,
  .ab-hero[data-reverse-mobile="yes"][data-scene="video"] .ab-controls {
    color: var(--ink);
  }
  .ab-hero[data-reverse-mobile="yes"] .ab-step[aria-pressed="true"]::after,
  .ab-hero[data-reverse-mobile="yes"][data-scene="video"] .ab-step[aria-pressed="true"]::after {
    background: #517da8;
  }
}