/* Sviluppo Software e App su Progetto */

.software-hero {
  position: relative;
  overflow: hidden;
  min-height: 620px;
  display: flex;
  align-items: center;
  color: #fff;
  background:
    linear-gradient(105deg, rgba(4,20,42,.86) 0%, rgba(6,27,51,.72) 38%, rgba(6,27,51,.24) 70%, rgba(6,27,51,.08) 100%),
    url("../img/sviluppo-software-app-sfondo.jpg") 82% center / cover no-repeat;
}

.software-hero-overlay {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 20% 20%, rgba(0,166,81,.18), transparent 24%),
    radial-gradient(circle at 80% 80%, rgba(255,234,0,.12), transparent 28%),
    linear-gradient(180deg, rgba(6,27,51,.04), rgba(6,27,51,.20));
  pointer-events: none;
}

.software-hero-content {
  position: relative;
  z-index: 1;
  padding: 76px 0 86px;
}

.software-hero h1 {
  max-width: 820px;
  margin: 0 0 20px;
  color: #fff;
  font-size: clamp(2.35rem,5vw,4.55rem);
  line-height: 1.02;
  letter-spacing: -.06em;
}

.software-lead,
.software-sublead {
  max-width: 720px;
  color: rgba(255,255,255,.90);
  font-size: 1.09rem;
  line-height: 1.72;
}

.software-sublead {
  margin-top: 12px;
  color: rgba(255,255,255,.82);
}

.software-actions,
.software-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 27px;
}

.software-actions .btn-outline {
  color: #fff;
  border-color: rgba(255,255,255,.42);
  background: rgba(6,27,51,.34);
}

.software-badges span {
  display: inline-flex;
  align-items: center;
  border-radius: 14px;
  padding: 10px 13px;
  color: #fff;
  background: rgba(255,255,255,.09);
  border: 1px solid rgba(255,255,255,.18);
  font-weight: 850;
}

.software-feature-strip {
  background: #fff;
  border-bottom: 1px solid rgba(9,25,44,.08);
}

.software-feature-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
}

.software-feature-grid article {
  padding: 30px 24px;
  border-right: 1px solid rgba(9,25,44,.08);
}

.software-feature-grid article:last-child {
  border-right: 0;
}

.software-feature-grid h3,
.software-value-grid h3,
.software-list-card h3,
.software-steps h3 {
  margin: 12px 0 8px;
  color: #061b33;
  font-size: 1.18rem;
}

.software-feature-grid p,
.software-value-grid p,
.software-list-card p,
.software-steps p,
.software-two-col p,
.software-cta-box p {
  color: #5b6b7f;
  line-height: 1.65;
}

.software-section {
  padding: 76px 0;
  background: #fff;
}

.software-light {
  background:
    radial-gradient(circle at 16% 22%, rgba(255,234,0,.15), transparent 26%),
    linear-gradient(180deg, #f4f8fc, #fff);
}

.section-title.centered {
  max-width: 940px;
  margin: 0 auto 34px;
  text-align: center;
}

.section-title.centered h2,
.software-two-col h2,
.software-cta-box h2 {
  color: #061b33;
  letter-spacing: -.04em;
}

.section-title.centered h2 {
  font-size: clamp(2rem,3.5vw,3.25rem);
  line-height: 1.08;
}

.section-title.centered p {
  color: #5b6b7f;
  line-height: 1.72;
}

.software-value-grid,
.software-service-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 18px;
}

.software-value-grid article {
  padding: 26px;
  border-radius: 26px;
  background: #fff;
  border: 1px solid rgba(9,25,44,.08);
  box-shadow: 0 18px 44px rgba(6,27,51,.08);
}

.software-two-col {
  display: grid;
  grid-template-columns: minmax(0,1fr) 420px;
  gap: 42px;
  align-items: center;
}

.software-two-col h2 {
  margin: 0 0 16px;
  font-size: clamp(2rem,3.4vw,3rem);
  line-height: 1.08;
}

.software-list-card {
  padding: 30px;
  border-radius: 30px;
  background: #061b33;
  color: #fff;
  box-shadow: 0 24px 64px rgba(6,27,51,.18);
}

.software-list-card h3 {
  color: #fff;
  margin-top: 0;
}

.software-list-card ul {
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
}

.software-list-card li {
  position: relative;
  padding: 10px 0 10px 28px;
  color: rgba(255,255,255,.88);
  border-bottom: 1px solid rgba(255,255,255,.10);
}

.software-list-card li:last-child {
  border-bottom: 0;
}

.software-list-card li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 10px;
  color: #ffea00;
  font-weight: 900;
}

.software-steps {
  display: grid;
  grid-template-columns: repeat(5,1fr);
  gap: 16px;
}

.software-steps article {
  padding: 24px;
  border-radius: 26px;
  background:
    linear-gradient(180deg, #fff, #f7fbff);
  border: 1px solid rgba(9,25,44,.08);
  box-shadow: 0 18px 44px rgba(6,27,51,.07);
}

.software-steps span {
  display: inline-flex;
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  color: #061b33;
  background: #ffea00;
  font-weight: 950;
  box-shadow: 0 10px 24px rgba(242,183,0,.20);
}

.software-cta-section {
  padding: 70px 0 86px;
  background: linear-gradient(135deg, #061b33, #082c5f);
}

.software-cta-box {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 26px;
  align-items: center;
  padding: 34px;
  border-radius: 34px;
  color: #fff;
  background:
    radial-gradient(circle at 84% 20%, rgba(255,234,0,.16), transparent 24%),
    rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 24px 70px rgba(0,0,0,.18);
}

.software-cta-box h2 {
  color: #fff;
  margin: 0 0 8px;
  font-size: clamp(1.6rem,3vw,2.45rem);
}

.software-cta-box p {
  color: rgba(255,255,255,.82);
  margin: 0;
}

.software-cta-box .btn-outline {
  color: #fff;
  border-color: rgba(255,255,255,.42);
  background: rgba(6,27,51,.24);
}

.software-icon {
  --icon-url: none;
  display: inline-flex;
  width: 62px;
  height: 62px;
  border-radius: 22px;
  background:
    radial-gradient(circle at 26% 18%, rgba(255,255,255,.95), rgba(255,255,255,0) 36%),
    linear-gradient(135deg, rgba(255,234,0,.34), rgba(0,109,255,.09));
  border: 1px solid rgba(242,183,0,.24);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.65), 0 14px 32px rgba(6,27,51,.10);
  position: relative;
}

.software-icon::before {
  content: "";
  position: absolute;
  inset: 13px;
  background: #f2b700;
  -webkit-mask: var(--icon-url) center / contain no-repeat;
  mask: var(--icon-url) center / contain no-repeat;
}

.cta-icon .software-icon {
  width: 78px;
  height: 78px;
}

.cta-icon .software-icon::before {
  inset: 17px;
}

.icon-flex {
  --icon-url: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M10 42c12-24 32-24 44 0' fill='none' stroke='black' stroke-width='5' stroke-linecap='round'/%3E%3Cpath d='M17 42h30M32 14v34M24 22l8-8 8 8' fill='none' stroke='black' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.icon-efficiency {
  --icon-url: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M32 8v10M32 46v10M8 32h10M46 32h10M15 15l7 7M42 42l7 7M49 15l-7 7M22 42l-7 7' stroke='black' stroke-width='5' stroke-linecap='round'/%3E%3Ccircle cx='32' cy='32' r='10' fill='none' stroke='black' stroke-width='5'/%3E%3C/svg%3E");
}

.icon-scale {
  --icon-url: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M14 50h36M18 46V34M32 46V24M46 46V14' stroke='black' stroke-width='5' stroke-linecap='round'/%3E%3Cpath d='M41 14h5v5' fill='none' stroke='black' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.icon-support {
  --icon-url: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M14 36v-5a18 18 0 0 1 36 0v5' fill='none' stroke='black' stroke-width='5' stroke-linecap='round'/%3E%3Crect x='9' y='34' width='11' height='14' rx='4' fill='none' stroke='black' stroke-width='5'/%3E%3Crect x='44' y='34' width='11' height='14' rx='4' fill='none' stroke='black' stroke-width='5'/%3E%3Cpath d='M45 50c-4 5-11 6-18 4' fill='none' stroke='black' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E");
}

.icon-process {
  --icon-url: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Crect x='9' y='12' width='18' height='14' rx='3' fill='none' stroke='black' stroke-width='5'/%3E%3Crect x='37' y='12' width='18' height='14' rx='3' fill='none' stroke='black' stroke-width='5'/%3E%3Crect x='23' y='40' width='18' height='14' rx='3' fill='none' stroke='black' stroke-width='5'/%3E%3Cpath d='M27 19h10M46 26v7H32v7M18 26v7h14' fill='none' stroke='black' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.icon-code,
.icon-app {
  --icon-url: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Crect x='9' y='12' width='46' height='38' rx='6' fill='none' stroke='black' stroke-width='5'/%3E%3Cpath d='M9 23h46M22 34l-6 5 6 5M42 34l6 5-6 5M36 31l-8 17' fill='none' stroke='black' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.icon-integration {
  --icon-url: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M22 22h20M22 42h20M42 22l8 10-8 10M22 22l-8 10 8 10' fill='none' stroke='black' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M32 18v28' stroke='black' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E");
}

.icon-security {
  --icon-url: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M32 8 51 16v14c0 13-8 22-19 27-11-5-19-14-19-27V16L32 8z' fill='none' stroke='black' stroke-width='5' stroke-linejoin='round'/%3E%3Cpath d='M23 32l6 6 13-14' fill='none' stroke='black' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

@media (max-width: 1120px) {
  .software-feature-grid,
  .software-value-grid,
  .software-steps {
    grid-template-columns: 1fr 1fr;
  }

  .software-two-col,
  .software-cta-box {
    grid-template-columns: 1fr;
  }

  .software-feature-grid article {
    border-right: 0;
    border-bottom: 1px solid rgba(9,25,44,.08);
  }
}

@media (max-width: 680px) {
  .software-hero {
    min-height: auto;
  }

  .software-hero-content {
    padding: 48px 0 64px;
  }

  .software-feature-grid,
  .software-value-grid,
  .software-steps {
    grid-template-columns: 1fr;
  }

  .software-section {
    padding: 54px 0;
  }

  .software-list-card,
  .software-cta-box {
    padding: 22px;
  }
}
