/* ==========================================================
       EMAN GROUP — Entwicklung Page
       Microsoft-like clarity + Apple-like spacing
       ========================================================== */

    .dev-page {
      --dev-blue: var(--brand, #0b5fff);
      --dev-text: var(--text, #0b0f19);
      --dev-muted: var(--muted, #4b5563);
      --dev-line: rgba(15, 23, 42, .12);
      --dev-soft: #f4f6f8;
      --dev-card: #ffffff;
    }

    .dev-announcement {
      width: 100vw;
      margin-left: calc(50% - 50vw);
      margin-right: calc(50% - 50vw);
      background: var(--dev-blue);
      color: #fff;
    }

    .dev-announcement__inner {
      width: min(1500px, calc(100% - 64px));
      min-height: 58px;
      margin: 0 auto;
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      padding: 12px 0;
      font-size: 15px;
      line-height: 1.45;
      font-weight: 650;
      letter-spacing: -.01em;
    }

    .dev-announcement a {
      color: #fff;
      font-weight: 850;
      text-decoration: underline;
      text-decoration-thickness: 1.5px;
      text-underline-offset: 3px;
    }

    .dev-hero {
      padding: clamp(54px, 8vw, 112px) 0 clamp(34px, 5vw, 68px);
      text-align: center;
      display: grid;
      justify-items: center;
    }

    .dev-eyebrow {
      margin: 0 0 14px;
      color: var(--dev-blue);
      font-size: 12px;
      font-weight: 900;
      letter-spacing: .14em;
      text-transform: uppercase;
    }

    .dev-hero h1 {
      margin: 0;
      max-width: 980px;
      color: var(--dev-text);
      font-size: clamp(44px, 6.2vw, 92px);
      line-height: .96;
      letter-spacing: -.075em;
    }

    .dev-hero__lead {
      max-width: 820px;
      margin: 24px auto 0;
      color: var(--dev-muted);
      font-size: clamp(16px, 1.35vw, 20px);
      line-height: 1.62;
    }

    .dev-hero__actions {
      margin-top: 32px;
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 12px;
    }

    .dev-proof-row {
      width: 100vw;
      margin-left: calc(50% - 50vw);
      margin-right: calc(50% - 50vw);
      padding: 0 0 44px;
    }

    .dev-proof-grid {
      width: min(1500px, calc(100% - 64px));
      margin: 0 auto;
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 0;
      background: #fff;
      border: 1px solid rgba(15,23,42,.08);
      box-shadow: 0 10px 40px rgba(15,23,42,.055);
    }

    .dev-proof-item {
      min-height: 118px;
      padding: 24px 26px;
      border-right: 1px solid rgba(15,23,42,.08);
    }

    .dev-proof-item:last-child { border-right: 0; }

    .dev-proof-item strong {
      display: block;
      color: var(--dev-text);
      font-size: 15px;
      letter-spacing: -.02em;
      margin-bottom: 8px;
    }

    .dev-proof-item span {
      display: block;
      color: var(--dev-muted);
      font-size: 13px;
      line-height: 1.55;
    }

    .dev-section {
      padding: clamp(48px, 6vw, 86px) 0;
    }

    .dev-section--wide {
      width: 100vw;
      margin-left: calc(50% - 50vw);
      margin-right: calc(50% - 50vw);
      background: #fff;
      border-top: 1px solid rgba(15,23,42,.08);
      border-bottom: 1px solid rgba(15,23,42,.08);
    }

    .dev-section__inner {
      width: min(1500px, calc(100% - 64px));
      margin: 0 auto;
    }

    .dev-section-head {
      max-width: 850px;
      margin-bottom: 30px;
    }

    .dev-section-head--center {
      margin-left: auto;
      margin-right: auto;
      text-align: center;
    }

    .dev-section-head h2 {
      margin: 0;
      color: var(--dev-text);
      font-size: clamp(34px, 4vw, 64px);
      line-height: 1.02;
      letter-spacing: -.065em;
    }

    .dev-section-head p {
      margin: 16px 0 0;
      color: var(--dev-muted);
      font-size: 16px;
      line-height: 1.65;
    }

    .dev-services-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 18px;
    }

    .dev-service-card {
      min-height: 520px;
      background: #fff;
      border: 1px solid rgba(15,23,42,.10);
      box-shadow: 0 8px 28px rgba(15,23,42,.055);
      overflow: hidden;
      display: flex;
      flex-direction: column;
    }

    .dev-service-visual {
      height: 210px;
      background: linear-gradient(135deg, #eef2f7, #f9fafb);
      display: grid;
      place-items: center;
      color: var(--dev-blue);
      border-bottom: 1px solid rgba(15,23,42,.08);
    }

    .dev-service-visual svg {
      width: 72px;
      height: 72px;
    }

    .dev-service-card__body {
      padding: 28px;
      display: flex;
      flex-direction: column;
      flex: 1;
    }

    .dev-label {
      width: fit-content;
      display: inline-flex;
      margin-bottom: 16px;
      padding: 7px 12px;
      background: #ffb900;
      color: #111827;
      font-size: 12px;
      line-height: 1;
      font-weight: 900;
      letter-spacing: .01em;
    }

    .dev-service-card h3 {
      margin: 0;
      color: var(--dev-text);
      font-size: clamp(24px, 2vw, 34px);
      line-height: 1.08;
      letter-spacing: -.055em;
    }

    .dev-service-card p {
      margin: 16px 0 0;
      color: var(--dev-muted);
      font-size: 15px;
      line-height: 1.58;
    }

    .dev-service-card ul {
      list-style: none;
      margin: 20px 0 0;
      padding: 0;
      display: grid;
      gap: 9px;
      color: var(--dev-muted);
      font-size: 14px;
      line-height: 1.45;
    }

    .dev-service-card li::before {
      content: "✓";
      color: var(--dev-blue);
      font-weight: 900;
      margin-right: 8px;
    }

    .dev-service-card a {
      margin-top: auto;
      padding-top: 26px;
      color: var(--dev-blue);
      font-weight: 850;
      font-size: 14px;
    }

    .dev-workflow {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 20px;
      align-items: stretch;
    }

    .dev-workflow-card {
      min-height: 620px;
      background: var(--dev-soft);
      border: 1px solid rgba(15,23,42,.08);
      padding: clamp(28px, 4vw, 54px);
      display: flex;
      flex-direction: column;
      justify-content: space-between;
    }

    .dev-workflow-card h3 {
      margin: 0;
      color: var(--dev-text);
      font-size: clamp(34px, 4vw, 62px);
      line-height: 1.02;
      letter-spacing: -.065em;
    }

    .dev-workflow-card p {
      margin: 18px 0 0;
      max-width: 58ch;
      color: var(--dev-muted);
      font-size: 16px;
      line-height: 1.65;
    }

    .dev-process-list {
      display: grid;
      gap: 0;
      background: #fff;
      border: 1px solid rgba(15,23,42,.10);
    }

    .dev-process-step {
      display: grid;
      grid-template-columns: 86px 1fr;
      gap: 22px;
      padding: 26px;
      border-bottom: 1px solid rgba(15,23,42,.10);
    }

    .dev-process-step:last-child { border-bottom: 0; }

    .dev-process-step span {
      color: var(--dev-blue);
      font-size: 13px;
      font-weight: 900;
      letter-spacing: .12em;
      text-transform: uppercase;
    }

    .dev-process-step h4 {
      margin: 0;
      color: var(--dev-text);
      font-size: 20px;
      letter-spacing: -.035em;
    }

    .dev-process-step p {
      margin: 8px 0 0;
      color: var(--dev-muted);
      font-size: 14px;
      line-height: 1.6;
    }

    .dev-deliverables-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 18px;
    }

    .dev-deliverable-card {
      background: #fff;
      border: 1px solid rgba(15,23,42,.10);
      padding: 28px;
      min-height: 240px;
      box-shadow: 0 8px 28px rgba(15,23,42,.045);
    }

    .dev-deliverable-card h3 {
      margin: 0;
      font-size: 21px;
      line-height: 1.18;
      letter-spacing: -.045em;
    }

    .dev-deliverable-card p {
      margin: 14px 0 0;
      color: var(--dev-muted);
      font-size: 14px;
      line-height: 1.6;
    }

    .dev-principles {
      display: grid;
      grid-template-columns: 1fr 1.25fr;
      gap: 22px;
      align-items: start;
    }

    .dev-principles-panel {
      background: #0b0f19;
      color: #fff;
      min-height: 520px;
      padding: clamp(30px, 4vw, 56px);
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
    }

    .dev-principles-panel h2 {
      margin: 0;
      font-size: clamp(34px, 4vw, 62px);
      line-height: 1.02;
      letter-spacing: -.065em;
    }

    .dev-principles-panel p {
      margin: 18px 0 0;
      color: rgba(255,255,255,.72);
      font-size: 16px;
      line-height: 1.65;
    }

    .dev-principles-list {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 14px;
    }

    .dev-principle {
      background: #fff;
      border: 1px solid rgba(15,23,42,.10);
      padding: 24px;
      min-height: 210px;
    }

    .dev-principle span {
      color: var(--dev-blue);
      font-size: 12px;
      font-weight: 900;
      letter-spacing: .12em;
      text-transform: uppercase;
    }

    .dev-principle h3 {
      margin: 18px 0 0;
      font-size: 22px;
      line-height: 1.12;
      letter-spacing: -.045em;
    }

    .dev-principle p {
      margin: 12px 0 0;
      color: var(--dev-muted);
      font-size: 14px;
      line-height: 1.6;
    }

    .dev-tech-strip {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 10px;
      margin-top: 30px;
    }

    .dev-tech-strip span {
      display: inline-flex;
      padding: 10px 14px;
      border: 1px solid rgba(15,23,42,.12);
      background: #fff;
      color: var(--dev-muted);
      font-size: 13px;
      font-weight: 760;
    }

    .dev-cta {
      width: 100vw;
      margin-left: calc(50% - 50vw);
      margin-right: calc(50% - 50vw);
      padding: clamp(58px, 7vw, 96px) 0;
      background: var(--dev-blue);
      color: #fff;
      text-align: center;
    }

    .dev-cta__inner {
      width: min(950px, calc(100% - 64px));
      margin: 0 auto;
      display: grid;
      justify-items: center;
    }

    .dev-cta h2 {
      margin: 0;
      font-size: clamp(36px, 5vw, 74px);
      line-height: 1.02;
      letter-spacing: -.07em;
    }

    .dev-cta p {
      max-width: 760px;
      margin: 20px auto 0;
      color: rgba(255,255,255,.82);
      font-size: 17px;
      line-height: 1.65;
    }

    .dev-cta .btn {
      margin-top: 30px;
      background: #fff !important;
      color: #0b0f19 !important;
      border-color: #fff !important;
    }

    .dev-faq {
      padding: clamp(50px, 6vw, 88px) 0;
    }

    .dev-faq-list {
      margin-top: 24px;
      border-top: 1px solid rgba(15,23,42,.18);
    }

    .dev-faq details {
      border-bottom: 1px solid rgba(15,23,42,.18);
    }

    .dev-faq summary {
      list-style: none;
      min-height: 74px;
      padding: 0 10px;
      display: flex;
      align-items: center;
      gap: 18px;
      cursor: pointer;
      font-weight: 850;
      font-size: 16px;
      color: var(--dev-text);
    }

    .dev-faq summary::-webkit-details-marker { display: none; }

    .dev-faq summary::before {
      content: "›";
      width: 22px;
      flex: 0 0 22px;
      font-size: 28px;
      font-weight: 400;
      transition: transform .18s ease;
    }

    .dev-faq details[open] summary::before { transform: rotate(90deg); }

    .dev-faq-content {
      padding: 0 40px 24px 50px;
      color: var(--dev-muted);
      font-size: 15px;
      line-height: 1.65;
    }

    .dev-faq-content p {
      margin: 0;
      max-width: 1180px;
    }

    @media (max-width: 1200px) {
      .dev-services-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .dev-deliverables-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .dev-principles { grid-template-columns: 1fr; }
    }

    @media (max-width: 980px) {
      .dev-announcement__inner,
      .dev-section__inner,
      .dev-proof-grid {
        width: min(100%, calc(100% - 36px));
      }

      .dev-proof-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .dev-workflow { grid-template-columns: 1fr; }
      .dev-workflow-card { min-height: auto; }
      .dev-process-step { grid-template-columns: 1fr; gap: 10px; }
    }

    @media (max-width: 680px) {
      .dev-hero { padding-top: 42px; }
      .dev-hero h1 { font-size: clamp(40px, 13vw, 58px); }
      .dev-hero__actions .btn { width: 100%; }
      .dev-proof-grid,
      .dev-services-grid,
      .dev-deliverables-grid,
      .dev-principles-list { grid-template-columns: 1fr; }
      .dev-proof-item { border-right: 0; border-bottom: 1px solid rgba(15,23,42,.08); }
      .dev-proof-item:last-child { border-bottom: 0; }
      .dev-service-card { min-height: auto; }
      .dev-service-visual { height: 190px; }
      .dev-service-card__body { padding: 24px; }
      .dev-faq-content { padding: 0 8px 22px 40px; }
    }

    /* ==========================================================
       Entwicklung focused revision — Sicherheit, Know-how, Vorgehen
       ========================================================== */

    .dev-hero--focused h1 {
      max-width: 1120px;
    }

    .dev-proof-grid--focused {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .dev-method-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 18px;
    }

    .dev-method-card {
      min-height: 270px;
      padding: 28px;
      background: #fff;
      border: 1px solid rgba(15,23,42,.10);
      box-shadow: 0 8px 28px rgba(15,23,42,.045);
      display: flex;
      flex-direction: column;
      justify-content: space-between;
    }

    .dev-method-card span {
      color: var(--dev-blue);
      font-size: 13px;
      font-weight: 950;
      letter-spacing: .08em;
    }

    .dev-method-card h3 {
      margin: 34px 0 12px;
      color: var(--dev-text);
      font-size: clamp(24px, 2.2vw, 36px);
      line-height: 1.08;
      letter-spacing: -.05em;
    }

    .dev-method-card p {
      margin: 0;
      color: var(--dev-muted);
      font-size: 15px;
      line-height: 1.6;
    }

    .dev-knowhow-layout {
      display: grid;
      grid-template-columns: .9fr 1.1fr;
      gap: 22px;
      align-items: stretch;
    }

    .dev-knowhow-card {
      min-height: 520px;
      padding: clamp(32px, 4vw, 58px);
      background: #fff;
      border: 1px solid rgba(15,23,42,.10);
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
    }

    .dev-knowhow-card--dark {
      background:
        radial-gradient(circle at 80% 10%, rgba(11,95,255,.28), transparent 34%),
        #0b0f19;
      color: #fff;
    }

    .dev-knowhow-card h3 {
      margin: 0;
      max-width: 12ch;
      font-size: clamp(36px, 4.3vw, 72px);
      line-height: .98;
      letter-spacing: -.07em;
    }

    .dev-knowhow-card p:not(.dev-eyebrow) {
      max-width: 620px;
      margin: 22px 0 0;
      color: rgba(255,255,255,.74);
      font-size: 16px;
      line-height: 1.65;
    }

    .dev-knowhow-list {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 18px;
    }

    .dev-knowhow-list article {
      padding: 28px;
      background: #fff;
      border: 1px solid rgba(15,23,42,.10);
      min-height: 250px;
    }

    .dev-knowhow-list h3 {
      margin: 0 0 12px;
      color: var(--dev-text);
      font-size: 24px;
      line-height: 1.12;
      letter-spacing: -.04em;
    }

    .dev-knowhow-list p {
      margin: 0;
      color: var(--dev-muted);
      font-size: 15px;
      line-height: 1.65;
    }

    .dev-tech-section {
      overflow: hidden;
    }

    .dev-tech-marquee {
      position: relative;
      width: 100vw;
      margin-left: calc(50% - 50vw);
      margin-right: calc(50% - 50vw);
      overflow: hidden;
      padding: 14px 0;
      background: #f3f4f6;
      border-top: 1px solid rgba(15,23,42,.08);
      border-bottom: 1px solid rgba(15,23,42,.08);
    }

    .dev-tech-marquee::before,
    .dev-tech-marquee::after {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      width: 120px;
      z-index: 2;
      pointer-events: none;
    }

    .dev-tech-marquee::before {
      left: 0;
      background: linear-gradient(90deg, #f3f4f6, rgba(243,244,246,0));
    }

    .dev-tech-marquee::after {
      right: 0;
      background: linear-gradient(270deg, #f3f4f6, rgba(243,244,246,0));
    }

    .dev-tech-marquee__track {
      display: flex;
      align-items: center;
      gap: 14px;
      width: max-content;
      animation: devMarquee 42s linear infinite;
      will-change: transform;
    }

    .dev-tech-marquee:hover .dev-tech-marquee__track {
      animation-play-state: paused;
    }

    .dev-tech-marquee__track span {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 42px;
      padding: 0 18px;
      border-radius: 999px;
      background: #fff;
      border: 1px solid rgba(15,23,42,.10);
      color: #111827;
      font-size: 14px;
      font-weight: 850;
      white-space: nowrap;
      box-shadow: 0 4px 16px rgba(15,23,42,.045);
    }

    @keyframes devMarquee {
      from { transform: translateX(0); }
      to { transform: translateX(-50%); }
    }

    .dev-tech-note {
      max-width: 820px;
      margin: 24px auto 0;
      text-align: center;
      color: var(--dev-muted);
      font-size: 15px;
      line-height: 1.65;
    }

    .dev-quality-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 16px;
    }

    .dev-quality-grid article {
      padding: 24px;
      background: #fff;
      border: 1px solid rgba(15,23,42,.10);
      min-height: 150px;
    }

    .dev-quality-grid h3 {
      margin: 0 0 10px;
      color: var(--dev-text);
      font-size: 20px;
      letter-spacing: -.035em;
    }

    .dev-quality-grid p {
      margin: 0;
      color: var(--dev-muted);
      font-size: 14px;
      line-height: 1.6;
    }

    @media (prefers-reduced-motion: reduce) {
      .dev-tech-marquee__track { animation: none !important; }
    }

    @media (max-width: 980px) {
      .dev-method-grid,
      .dev-quality-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .dev-knowhow-layout { grid-template-columns: 1fr; }
      .dev-knowhow-card { min-height: 420px; }
    }

    @media (max-width: 620px) {
      .dev-method-grid,
      .dev-quality-grid,
      .dev-knowhow-list { grid-template-columns: 1fr; }
      .dev-method-card { min-height: auto; }
      .dev-tech-marquee::before,
      .dev-tech-marquee::after { width: 48px; }
      .dev-tech-marquee__track span { min-height: 38px; padding: 0 14px; font-size: 13px; }
    }


    /* ==========================================================
   Entwicklung Slider — immagini reali nei rettangoli laterali
   Mantiene layout, dimensioni e posizione attuali
   ========================================================== */

/* il blocco grigio resta nella stessa identica posizione */
.dev-ms-slide::before {
  display: block !important;
  content: "" !important;

  background-color: transparent !important;
  background-repeat: no-repeat, no-repeat !important;

  /* sinistra = immagine precedente, destra = immagine successiva */
  background-position: left center, right center !important;
  background-size: 50% 100%, 50% 100% !important;

  opacity: 1 !important;
  filter: brightness(.92) saturate(.95) !important;
  box-shadow: none !important;
}

/* quando è attiva la slide 1:
   sinistra = slide 4, destra = slide 2 */
.dev-ms-slider:has(.dev-ms-slide:nth-child(1).is-active) .dev-ms-slide.is-active::before {
  background-image:
    url("../img/development/uebergabe.jpg"),
    url("../img/development/security.jpg") !important;
}

/* quando è attiva la slide 2:
   sinistra = slide 1, destra = slide 3 */
.dev-ms-slider:has(.dev-ms-slide:nth-child(2).is-active) .dev-ms-slide.is-active::before {
  background-image:
    url("../img/development/entwicklung.jpg"),
    url("../img/development/technologien.jpg") !important;
}

/* quando è attiva la slide 3:
   sinistra = slide 2, destra = slide 4 */
.dev-ms-slider:has(.dev-ms-slide:nth-child(3).is-active) .dev-ms-slide.is-active::before {
  background-image:
    url("../img/development/security.jpg"),
    url("../img/development/uebergabe.jpg") !important;
}

/* quando è attiva la slide 4:
   sinistra = slide 3, destra = slide 1 */
.dev-ms-slider:has(.dev-ms-slide:nth-child(4).is-active) .dev-ms-slide.is-active::before {
  background-image:
    url("../img/development/technologien.jpg"),
    url("../img/development/entwicklung.jpg") !important;
}

/* immagine principale resta sopra */
.dev-ms-slide img {
  position: relative !important;
  z-index: 2 !important;
}

/* overlay, card e testo restano sopra */
.dev-ms-slide::after {
  z-index: 3 !important;
}

.dev-ms-slide__caption {
  z-index: 4 !important;
}

.dev-ms-slide__info {
  z-index: 5 !important;
}

/* ==========================================================
   Entwicklung — Tech Section Background più serio
   ========================================================== */

.dev-tech-section {
  background:
    linear-gradient(180deg, #f5f8fb 0%, #eef3f7 100%) !important;
}

/* rimuove il mix troppo colorato sopra */
.dev-tech-section::before {
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, .42) 0%,
      rgba(255, 255, 255, .12) 48%,
      rgba(255, 255, 255, .30) 100%
    ) !important;
}

/* barra interna più pulita e meno colorata */
.dev-tech-marquee {
  background: rgba(255, 255, 255, .38) !important;
  border-top: 1px solid rgba(15, 23, 42, .06) !important;
  border-bottom: 1px solid rgba(15, 23, 42, .06) !important;
  backdrop-filter: blur(16px) saturate(1.02) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.02) !important;
}

/* elimina i fade colorati laterali */
.dev-tech-marquee::before {
  background: linear-gradient(
    to right,
    #eef3f7 0%,
    rgba(238, 243, 247, .72) 40%,
    rgba(238, 243, 247, 0) 100%
  ) !important;
}

.dev-tech-marquee::after {
  background: linear-gradient(
    to left,
    #eef3f7 0%,
    rgba(238, 243, 247, .72) 40%,
    rgba(238, 243, 247, 0) 100%
  ) !important;
}

/* card più professionali, meno “giocattolo” */
.dev-tech-card {
  background: rgba(255, 255, 255, .78) !important;
  border: 1px solid rgba(15, 23, 42, .07) !important;

  box-shadow:
    0 1px 2px rgba(15, 23, 42, .025),
    0 10px 28px rgba(15, 23, 42, .055) !important;

  backdrop-filter: blur(12px) saturate(1.02) !important;
  -webkit-backdrop-filter: blur(12px) saturate(1.02) !important;
}

.dev-tech-section {
  background: linear-gradient(180deg, #f7f8fa 0%, #edf0f4 100%) !important;
}

.dev-tech-marquee {
  background: rgba(255, 255, 255, .44) !important;
}

.dev-tech-marquee::before {
  background: linear-gradient(
    to right,
    #edf0f4 0%,
    rgba(237, 240, 244, .72) 40%,
    rgba(237, 240, 244, 0) 100%
  ) !important;
}

.dev-tech-marquee::after {
  background: linear-gradient(
    to left,
    #edf0f4 0%,
    rgba(237, 240, 244, .72) 40%,
    rgba(237, 240, 244, 0) 100%
  ) !important;
}

/* ==========================================================
   Entwicklung Slider — transition da rettangolo laterale a slide
   ========================================================== */

.dev-ms-slider {
  position: relative !important;
}

/* slide principale */
.dev-ms-slide {
  transition:
    opacity .45s ease,
    transform .72s cubic-bezier(.22, .61, .36, 1),
    filter .45s ease !important;
}

/* immagine principale */
.dev-ms-slide img {
  transition:
    transform .72s cubic-bezier(.22, .61, .36, 1),
    opacity .45s ease,
    filter .45s ease !important;
  transform-origin: center center !important;
}

/* card e titolo entrano dopo l'immagine */
.dev-ms-slide__info,
.dev-ms-slide__caption {
  transition:
    opacity .32s ease,
    transform .42s ease !important;
}

/* durante il cambio slide: nasconde testo/card per dare priorità all'immagine */
.dev-ms-slider.is-changing .dev-ms-slide__info,
.dev-ms-slider.is-changing .dev-ms-slide__caption {
  opacity: 0 !important;
  transform: translateY(10px) !important;
}

/* quando si va avanti: la nuova slide entra da destra */
.dev-ms-slider.is-next .dev-ms-slide.is-active {
  animation: devSlideFromRight .72s cubic-bezier(.22, .61, .36, 1) both;
}

/* quando si va indietro: la nuova slide entra da sinistra */
.dev-ms-slider.is-prev .dev-ms-slide.is-active {
  animation: devSlideFromLeft .72s cubic-bezier(.22, .61, .36, 1) both;
}

/* immagine che “si apre” come se partisse dal rettangolo laterale destro */
@keyframes devSlideFromRight {
  0% {
    transform: translateX(92px) scale(.86);
    opacity: .72;
    filter: brightness(.92) saturate(.95);
  }

  55% {
    opacity: 1;
  }

  100% {
    transform: translateX(0) scale(1);
    opacity: 1;
    filter: none;
  }
}

/* immagine che “si apre” come se partisse dal rettangolo laterale sinistro */
@keyframes devSlideFromLeft {
  0% {
    transform: translateX(-92px) scale(.86);
    opacity: .72;
    filter: brightness(.92) saturate(.95);
  }

  55% {
    opacity: 1;
  }

  100% {
    transform: translateX(0) scale(1);
    opacity: 1;
    filter: none;
  }
}

/* leggera uscita della slide precedente */
.dev-ms-slider.is-next .dev-ms-slide.was-active {
  animation: devSlideExitLeft .72s cubic-bezier(.22, .61, .36, 1) both;
}

.dev-ms-slider.is-prev .dev-ms-slide.was-active {
  animation: devSlideExitRight .72s cubic-bezier(.22, .61, .36, 1) both;
}

@keyframes devSlideExitLeft {
  0% {
    transform: translateX(0) scale(1);
    opacity: 1;
  }

  100% {
    transform: translateX(-70px) scale(.96);
    opacity: .35;
  }
}

@keyframes devSlideExitRight {
  0% {
    transform: translateX(0) scale(1);
    opacity: 1;
  }

  100% {
    transform: translateX(70px) scale(.96);
    opacity: .35;
  }
}

/* evita animazioni strane sulle slide non attive */
.dev-ms-slide:not(.is-active):not(.was-active) {
  animation: none !important;
}

/* mobile: animazione più leggera */
@media (max-width: 760px) {
  @keyframes devSlideFromRight {
    0% {
      transform: translateX(34px) scale(.96);
      opacity: .75;
    }

    100% {
      transform: translateX(0) scale(1);
      opacity: 1;
    }
  }

  @keyframes devSlideFromLeft {
    0% {
      transform: translateX(-34px) scale(.96);
      opacity: .75;
    }

    100% {
      transform: translateX(0) scale(1);
      opacity: 1;
    }
  }
}

/* ==========================================================
   Entwicklung Hero Slider — Microsoft-like carousel
   Slide centrale + preview reali laterali
   ========================================================== */

.dev-ms-slider {
  width: min(1500px, calc(100% - 72px)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  overflow: hidden !important;
}

.dev-ms-slider__viewport {
  overflow: visible !important;
  padding: 0 !important;
}

/* il movimento deve essere sul track, non sulle immagini */
.dev-ms-slider__track {
  display: flex !important;
  gap: 0 !important;
  transition: transform .72s cubic-bezier(.2, .8, .2, 1) !important;
  will-change: transform !important;
}

/* ogni slide mantiene la stessa larghezza */
.dev-ms-slide {
  flex: 0 0 100% !important;
  min-width: 100% !important;
  position: relative !important;

  padding: 58px 0 0 !important;
  overflow: visible !important;

  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
}

/* elimina il rettangolo grigio finto */
.dev-ms-slide::before {
  display: none !important;
  content: none !important;
}

/* immagine principale: più stretta della slide,
   così si vedono le immagini reali prima/dopo */
.dev-ms-slide img {
  width: calc(100% - 148px) !important;
  margin-left: 74px !important;
  margin-right: 74px !important;

  height: clamp(430px, 38vw, 610px) !important;
  object-fit: cover !important;
  object-position: center center !important;

  display: block !important;
  border-radius: 4px !important;
  box-shadow: none !important;
  background: #e5e7eb !important;

  transform: none !important;
  opacity: 1 !important;
  filter: none !important;
}

/* overlay solo sulla parte immagine */
.dev-ms-slide::after {
  left: 74px !important;
  right: 74px !important;
  bottom: 0 !important;
  height: 42% !important;
  border-radius: 0 0 4px 4px !important;
  pointer-events: none !important;
}

/* card sopra allineata alla slide centrale */
.dev-ms-slide__info {
  left: 138px !important;
  top: 0 !important;
  width: min(450px, calc(100% - 276px)) !important;
  z-index: 5 !important;
}

/* titolo sopra immagine */
.dev-ms-slide__caption {
  left: 118px !important;
  right: 118px !important;
  bottom: 50px !important;
  z-index: 4 !important;
}

/* solo la slide attiva mostra testo e card */
.dev-ms-slide:not(.is-active) .dev-ms-slide__info,
.dev-ms-slide:not(.is-active) .dev-ms-slide__caption {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.dev-ms-slide.is-active .dev-ms-slide__info,
.dev-ms-slide.is-active .dev-ms-slide__caption {
  opacity: 1 !important;
  visibility: visible !important;
  transition:
    opacity .28s ease .18s,
    transform .36s ease .18s !important;
}

/* controlli larghi come immagine centrale */
.dev-ms-slider__controls {
  width: calc(100% - 148px) !important;
  margin-left: 74px !important;
  margin-right: 74px !important;
}

/* tablet */
@media (max-width: 980px) {
  .dev-ms-slider {
    width: min(100%, calc(100% - 32px)) !important;
  }

  .dev-ms-slide img {
    width: calc(100% - 70px) !important;
    margin-left: 35px !important;
    margin-right: 35px !important;
  }

  .dev-ms-slide::after {
    left: 35px !important;
    right: 35px !important;
  }

  .dev-ms-slide__info {
    left: 58px !important;
    width: min(420px, calc(100% - 116px)) !important;
  }

  .dev-ms-slide__caption {
    left: 58px !important;
    right: 58px !important;
  }

  .dev-ms-slider__controls {
    width: calc(100% - 70px) !important;
    margin-left: 35px !important;
    margin-right: 35px !important;
  }
}

/* mobile: una slide piena, niente preview laterali */
@media (max-width: 760px) {
  .dev-ms-slider {
    width: min(100%, calc(100% - 20px)) !important;
  }

  .dev-ms-slider__viewport {
    overflow: hidden !important;
  }

  .dev-ms-slide {
    padding-top: 118px !important;
  }

  .dev-ms-slide img {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    height: 430px !important;
  }

  .dev-ms-slide::after {
    left: 0 !important;
    right: 0 !important;
  }

  .dev-ms-slide__info {
    left: 14px !important;
    right: 14px !important;
    width: auto !important;
  }

  .dev-ms-slide__caption {
    left: 22px !important;
    right: 22px !important;
    bottom: 30px !important;
  }

  .dev-ms-slider__controls {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* ==========================================================
   Entwicklung — rimuove sfondo extra dietro lo scroll tools
   ========================================================== */

.dev-tech-marquee {
  background: transparent !important;
  border-top: 0 !important;
  border-bottom: 0 !important;

  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;

  box-shadow: none !important;
}

/* elimina eventuale velo/pannello interno */
.dev-tech-marquee::before,
.dev-tech-marquee::after {
  background: none !important;
  opacity: 0 !important;
}

/* mantiene solo le card pulite */
.dev-tech-card {
  background: rgba(255, 255, 255, .86) !important;
  border: 1px solid rgba(15, 23, 42, .07) !important;

  box-shadow:
    0 1px 2px rgba(15, 23, 42, .025),
    0 8px 24px rgba(15, 23, 42, .045) !important;
}

/* ==========================================================
   Entwicklung — font sync come Impressum / Cookies / Datenschutz
   Mobile fix finale
   ========================================================== */

.dev-page {
  font-family: "Segoe UI", SegoeUI, "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

/* Banner blu sopra */
.dev-announcement__inner {
  width: min(var(--max, 1160px), calc(100% - var(--pad, 26px) * 2)) !important;
  min-height: 48px !important;
  padding: 10px 0 !important;

  font-size: 13.5px !important;
  line-height: 1.48 !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}

.dev-announcement__inner a {
  font-size: inherit !important;
  line-height: inherit !important;
  font-weight: 700 !important;
}

/* Intro sopra lo slider */
.dev-ms-hero__intro {
  width: min(var(--max, 1160px), calc(100% - var(--pad, 26px) * 2)) !important;
  max-width: var(--max, 1160px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

.dev-ms-hero__eyebrow,
.dev-tech-kicker {
  font-size: 12px !important;
  line-height: 1.35 !important;
  letter-spacing: .12em !important;
  font-weight: 800 !important;
}

/* Titolo principale come nelle pagine legali */
.dev-ms-hero__intro h1,
.dev-page .dev-hero h1 {
  max-width: 980px !important;
  margin-left: auto !important;
  margin-right: auto !important;

  font-size: clamp(34px, 3.2vw, 46px) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.04em !important;
  font-weight: 700 !important;
}

/* Testo intro */
.dev-ms-hero__intro > p:not(.dev-ms-hero__eyebrow),
.dev-page .dev-hero__lead {
  max-width: 680px !important;
  margin-left: auto !important;
  margin-right: auto !important;

  font-size: 13.5px !important;
  line-height: 1.48 !important;
  font-weight: 400 !important;
}

/* Titoli slide-card */
.dev-ms-slide__info h2 {
  font-size: 20px !important;
  line-height: 1.18 !important;
  letter-spacing: -0.025em !important;
  font-weight: 700 !important;
}

/* Testo slide-card */
.dev-ms-slide__info p,
.dev-ms-slide__info a {
  font-size: 13.5px !important;
  line-height: 1.48 !important;
}

/* Caption grande sopra immagine */
.dev-ms-slide__caption {
  font-size: clamp(28px, 3.2vw, 46px) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.045em !important;
  font-weight: 750 !important;
}

/* Sezione tools */
.dev-tech-head h2,
.dev-tech-head h3,
.dev-section-head h2,
.dev-section-head h3,
.eg-news-box h2,
.eg-faq-head h2 {
  font-size: 24px !important;
  line-height: 1.18 !important;
  letter-spacing: -0.035em !important;
  font-weight: 700 !important;
}

.dev-tech-head p,
.dev-section-head p,
.eg-news-box p,
.eg-faq-content p {
  font-size: 13.5px !important;
  line-height: 1.48 !important;
}

/* Cards Qualität */
.dev-quality-grid h3,
.eg-faq-item summary span {
  font-size: 16px !important;
  line-height: 1.28 !important;
  letter-spacing: -0.02em !important;
  font-weight: 700 !important;
}

.dev-quality-grid p {
  font-size: 13.5px !important;
  line-height: 1.48 !important;
}

/* Tool cards */
.dev-tech-card span {
  font-size: 13.5px !important;
  line-height: 1.35 !important;
  font-weight: 700 !important;
}

/* ==========================================================
   Mobile specific
   ========================================================== */

@media (max-width: 760px) {
  .dev-announcement {
    width: 100vw !important;
  }

  .dev-announcement__inner {
    width: min(100%, calc(100% - 32px)) !important;
    min-height: auto !important;
    padding: 9px 0 !important;

    display: block !important;
    text-align: center !important;

    font-size: 12.8px !important;
    line-height: 1.42 !important;
    font-weight: 600 !important;
  }

  .dev-announcement__inner a {
    display: inline !important;
    font-size: 12.8px !important;
    line-height: 1.42 !important;
  }

  .dev-ms-hero {
    padding-top: 40px !important;
  }

  .dev-ms-hero__intro {
    width: min(100%, calc(100% - 32px)) !important;
  }

  .dev-ms-hero__intro h1,
  .dev-page .dev-hero h1 {
    font-size: 34px !important;
    line-height: 1.08 !important;
    letter-spacing: -0.04em !important;
  }

  .dev-ms-hero__intro > p:not(.dev-ms-hero__eyebrow),
  .dev-page .dev-hero__lead {
    font-size: 13.5px !important;
    line-height: 1.52 !important;
  }

  .dev-ms-slide__info {
    padding: 18px !important;
  }

  .dev-ms-slide__info h2 {
    font-size: 18px !important;
    line-height: 1.2 !important;
  }

  .dev-ms-slide__info p,
  .dev-ms-slide__info a {
    font-size: 13px !important;
    line-height: 1.45 !important;
  }

  .dev-ms-slide__caption {
    font-size: 26px !important;
    line-height: 1.08 !important;
    letter-spacing: -0.04em !important;
  }

  .dev-tech-section {
    padding-top: 54px !important;
    padding-bottom: 54px !important;
  }

  .dev-tech-head {
    width: min(100%, calc(100% - 32px)) !important;
    margin-bottom: 30px !important;
  }

  .dev-tech-head h2,
  .dev-tech-head h3,
  .dev-section-head h2,
  .dev-section-head h3,
  .eg-news-box h2,
  .eg-faq-head h2 {
    font-size: 22px !important;
    line-height: 1.18 !important;
  }

  .dev-tech-head p,
  .dev-section-head p,
  .eg-news-box p,
  .eg-faq-content p,
  .dev-quality-grid p {
    font-size: 13.5px !important;
    line-height: 1.52 !important;
  }

  .dev-quality-grid article {
    padding: 20px !important;
  }

  .dev-quality-grid h3,
  .eg-faq-item summary span {
    font-size: 16px !important;
    line-height: 1.28 !important;
  }

  .dev-tech-card {
    width: 170px !important;
    min-width: 170px !important;
    height: 136px !important;
  }

  .dev-tech-card img {
    max-width: 58px !important;
    max-height: 58px !important;
  }

  .dev-tech-card span {
    font-size: 13px !important;
  }
}

/* ==========================================================
   UI45 — Variante B precisa, compatta e fedele al mockup
   ========================================================== */

.dev-page .eg-end-section{
  padding-top:18px!important;
}

.dev-next-step{
  position:relative!important;
  width:100%!important;
  min-height:184px!important;
  display:grid!important;
  grid-template-columns:minmax(390px,1.08fr) minmax(470px,.92fr)!important;
  gap:0!important;
  align-items:center!important;
  padding:22px 24px!important;
  overflow:hidden!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.08)!important;
  border-radius:8px!important;
  background:
    linear-gradient(110deg,#061936 0%,#08254d 58%,#0a356a 100%)!important;
  box-shadow:0 10px 28px rgba(7,26,55,.15)!important;
}

.dev-next-step::after{
  content:""!important;
  position:absolute!important;
  right:-66px!important;
  top:-116px!important;
  width:390px!important;
  height:390px!important;
  pointer-events:none!important;
  opacity:.18!important;
  border-radius:50%!important;
  background:repeating-radial-gradient(
    circle at center,
    transparent 0 13px,
    rgba(255,255,255,.28) 13px 14px,
    transparent 14px 27px
  )!important;
}

.dev-next-step>*{
  position:relative!important;
  z-index:1!important;
}

.dev-next-step__lead{
  min-width:0!important;
  display:grid!important;
  grid-template-columns:76px minmax(0,1fr)!important;
  gap:18px!important;
  align-items:center!important;
  padding-right:22px!important;
}

.dev-next-step__lead-icon{
  width:64px!important;
  height:64px!important;
  display:grid!important;
  place-items:center!important;
  border:1px solid rgba(77,151,255,.72)!important;
  border-radius:50%!important;
  color:#fff!important;
  background:rgba(15,57,112,.32)!important;
}

.dev-next-step__lead-icon svg{
  width:43px!important;
  height:43px!important;
}

.dev-next-step__lead-copy{
  min-width:0!important;
}

.dev-next-step__lead-copy h2{
  margin:0!important;
  max-width:520px!important;
  color:#fff!important;
  font-size:clamp(18px,1.55vw,23px)!important;
  line-height:1.13!important;
  font-weight:700!important;
  letter-spacing:-.03em!important;
}

.dev-next-step__lead-copy p{
  max-width:535px!important;
  margin:10px 0 0!important;
  color:rgba(255,255,255,.73)!important;
  font-size:10.6px!important;
  line-height:1.52!important;
}

.dev-next-step__cta{
  min-height:34px!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:8px!important;
  margin-top:13px!important;
  padding:7px 12px!important;
  border:1px solid #2f7cff!important;
  border-radius:2px!important;
  background:#1267ee!important;
  color:#fff!important;
  font-size:10.6px!important;
  line-height:1.15!important;
  font-weight:750!important;
  text-decoration:none!important;
  box-shadow:none!important;
}

.dev-next-step__cta:hover{
  border-color:#6ea3ff!important;
  background:#2476f5!important;
  box-shadow:0 6px 16px rgba(0,0,0,.15)!important;
}

.dev-next-step__steps{
  min-width:0!important;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  align-items:stretch!important;
}

.dev-next-step__steps article{
  min-width:0!important;
  min-height:126px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  padding:8px 14px!important;
  text-align:center!important;
  border-left:1px solid rgba(255,255,255,.19)!important;
}

.dev-next-step__step-icon{
  width:42px!important;
  height:42px!important;
  display:grid!important;
  place-items:center!important;
  margin-bottom:7px!important;
  color:#fff!important;
}

.dev-next-step__step-icon svg{
  width:37px!important;
  height:37px!important;
}

.dev-next-step__steps h3{
  margin:0!important;
  color:#fff!important;
  font-size:10.8px!important;
  line-height:1.25!important;
  font-weight:700!important;
}

.dev-next-step__steps p{
  max-width:152px!important;
  margin:6px 0 0!important;
  color:rgba(255,255,255,.66)!important;
  font-size:8.9px!important;
  line-height:1.48!important;
}

.dev-page .eg-faq-section{
  margin-top:0!important;
  padding-top:25px!important;
}

/* Medium screens */
@media (max-width:1040px){
  .dev-next-step{
    grid-template-columns:1fr!important;
    gap:22px!important;
    min-height:0!important;
  }

  .dev-next-step__lead{
    padding-right:0!important;
  }

  .dev-next-step__steps article:first-child{
    border-left:0!important;
  }
}

/* Mobile */
@media (max-width:720px){
  .dev-next-step{
    padding:24px 17px!important;
    border-radius:7px!important;
  }

  .dev-next-step__lead{
    grid-template-columns:1fr!important;
    gap:14px!important;
  }

  .dev-next-step__lead-icon{
    width:58px!important;
    height:58px!important;
  }

  .dev-next-step__lead-icon svg{
    width:39px!important;
    height:39px!important;
  }

  .dev-next-step__lead-copy h2{
    font-size:23px!important;
  }

  .dev-next-step__lead-copy p{
    font-size:12.2px!important;
  }

  .dev-next-step__cta{
    width:100%!important;
    min-height:42px!important;
    justify-content:center!important;
    font-size:12px!important;
  }

  .dev-next-step__steps{
    grid-template-columns:1fr!important;
  }

  .dev-next-step__steps article{
    min-height:0!important;
    display:grid!important;
    grid-template-columns:40px minmax(0,1fr)!important;
    grid-template-rows:auto auto!important;
    column-gap:12px!important;
    align-items:center!important;
    justify-items:start!important;
    padding:14px 0!important;
    text-align:left!important;
    border-left:0!important;
    border-top:1px solid rgba(255,255,255,.18)!important;
  }

  .dev-next-step__step-icon{
    grid-row:1 / span 2!important;
    width:38px!important;
    height:38px!important;
    margin:0!important;
  }

  .dev-next-step__step-icon svg{
    width:35px!important;
    height:35px!important;
  }

  .dev-next-step__steps h3{
    font-size:12.4px!important;
  }

  .dev-next-step__steps p{
    max-width:none!important;
    margin-top:3px!important;
    font-size:10.7px!important;
  }
}

/* ==========================================================
   UI47 — rimozione dei tre divisori verticali
   ========================================================== */

.dev-next-step__steps article{
  border-left:0!important;
}

/* Mantiene una distanza uniforme tra i tre blocchi. */
.dev-next-step__steps{
  column-gap:12px!important;
}

@media (max-width:1040px){
  .dev-next-step__steps{
    column-gap:8px!important;
  }
}

@media (max-width:720px){
  .dev-next-step__steps{
    column-gap:0!important;
  }

  .dev-next-step__steps article{
    border-left:0!important;
    border-top:1px solid rgba(255,255,255,.18)!important;
  }
}

/* ==========================================================
   UI52 — Qualität vor Übergabe, fedele al mockup approvato
   ========================================================== */

.dev-quality-section{
  padding:64px 0 54px!important;
  background:#fff!important;
}

.dev-quality-layout{
  width:100%!important;
  display:grid!important;
  grid-template-columns:minmax(250px,.72fr) minmax(0,1.65fr)!important;
  gap:54px!important;
  align-items:start!important;
}

.dev-quality-intro{
  min-width:0!important;
  padding:8px 0 0!important;
}

.dev-quality-kicker{
  margin:0 0 18px!important;
  color:#0b63f6!important;
  font-size:11px!important;
  line-height:1.3!important;
  font-weight:800!important;
  letter-spacing:.12em!important;
  text-transform:uppercase!important;
}

.dev-quality-intro h2{
  margin:0!important;
  color:#0f172a!important;
  font-size:clamp(34px,3.2vw,48px)!important;
  line-height:1.02!important;
  font-weight:700!important;
  letter-spacing:-.055em!important;
}

.dev-quality-accent{
  width:76px!important;
  height:2px!important;
  display:block!important;
  margin:27px 0 28px!important;
  background:#1468f3!important;
}

.dev-quality-intro>p:last-child{
  max-width:390px!important;
  margin:0!important;
  color:#5d6878!important;
  font-size:15px!important;
  line-height:1.68!important;
}

.dev-quality-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:18px!important;
}

.dev-quality-grid article{
  min-height:220px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  padding:28px 28px 24px!important;
  border:1px solid rgba(15,23,42,.13)!important;
  border-radius:0!important;
  background:#fff!important;
  box-shadow:none!important;
}

.dev-quality-icon{
  width:50px!important;
  height:50px!important;
  display:grid!important;
  place-items:center!important;
  margin:0 0 20px!important;
  color:#125fd1!important;
}

.dev-quality-icon svg{
  width:44px!important;
  height:44px!important;
}

.dev-quality-grid h3{
  margin:0!important;
  color:#111827!important;
  font-size:17px!important;
  line-height:1.3!important;
  font-weight:700!important;
  letter-spacing:-.025em!important;
}

.dev-quality-grid p{
  margin:12px 0 0!important;
  color:#5f6b7b!important;
  font-size:13.5px!important;
  line-height:1.55!important;
}

/* Pannello successivo completamente squadrato */
.dev-next-step,
.dev-next-step::before,
.dev-next-step::after,
.dev-next-step__lead-icon,
.dev-next-step__cta,
.dev-next-step__steps,
.dev-next-step__steps article{
  border-radius:0!important;
}

/* FAQ e contenitori finali senza arrotondamenti */
.eg-end-section,
.eg-faq-section,
.eg-faq-head,
.eg-faq-list,
.eg-faq-item,
.eg-faq-item summary,
.eg-faq-content{
  border-radius:0!important;
}

@media (max-width:980px){
  .dev-quality-layout{
    grid-template-columns:1fr!important;
    gap:34px!important;
  }

  .dev-quality-intro>p:last-child{
    max-width:680px!important;
  }

  .dev-quality-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media (max-width:620px){
  .dev-quality-section{
    padding:46px 0 40px!important;
  }

  .dev-quality-layout{
    gap:28px!important;
  }

  .dev-quality-intro h2{
    font-size:34px!important;
  }

  .dev-quality-accent{
    width:54px!important;
    margin:22px 0 22px!important;
  }

  .dev-quality-intro>p:last-child{
    font-size:13.5px!important;
    line-height:1.62!important;
  }

  .dev-quality-grid{
    grid-template-columns:1fr!important;
    gap:0!important;
    border:1px solid rgba(15,23,42,.13)!important;
  }

  .dev-quality-grid article{
    min-height:0!important;
    display:grid!important;
    grid-template-columns:46px minmax(0,1fr)!important;
    grid-template-rows:auto auto!important;
    column-gap:14px!important;
    padding:20px 18px!important;
    border:0!important;
    border-bottom:1px solid rgba(15,23,42,.13)!important;
  }

  .dev-quality-grid article:last-child{
    border-bottom:0!important;
  }

  .dev-quality-icon{
    grid-row:1 / span 2!important;
    width:42px!important;
    height:42px!important;
    margin:0!important;
  }

  .dev-quality-icon svg{
    width:38px!important;
    height:38px!important;
  }

  .dev-quality-grid h3{
    font-size:15px!important;
  }

  .dev-quality-grid p{
    margin-top:5px!important;
    font-size:12.5px!important;
  }
}


/* ==========================================================================
   ENTWICKLUNG — OPTIMIERTE RESPONSIVE BILDER
   Ergänzung 2026-08-03
   ========================================================================== */

.dev-ms-slide > .dev-ms-slide__media {
  display: block;
  width: 100%;
}

.dev-ms-slide__media img {
  display: block;
  max-width: none;
}

.dev-tech-card img {
  width: 64px;
  height: 64px;
  object-fit: contain;
}

@media (max-width: 760px) {
  .dev-ms-slide > .dev-ms-slide__media {
    width: 100%;
  }

  .dev-tech-card img {
    width: 56px;
    height: 56px;
  }
}