*,
*::before,
*::after {
  box-sizing: border-box
}
html {
  scroll-behavior: smooth;
  overflow-x: clip
}
body {
  max-width: 100%;
  overflow-x: clip;
  font-family: "DM Sans",sans-serif;
  transition: background-color .3s,color .3s
}
.sc-splash-pending,
.sc-splash-pending body {
  overflow: hidden!important
}
.sc-splash {
  position: fixed;
  z-index: 9999;
  inset: 0;
  display: grid;
  place-items: center;
  min-height: 100svh;
  padding: 2rem;
  overflow: hidden;
  color: #27272a;
  background: #f7f7f8;
  opacity: 1;
  visibility: visible;
  transition: opacity .6s cubic-bezier(.4,0,.2,1),visibility .6s
}
.dark .sc-splash {
  color: #f4f4f5;
  background: #09090b
}
.sc-splash-grid {
  position: absolute;
  inset: 0;
  opacity: .7;
  background-image: linear-gradient(rgba(24,24,27,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(24,24,27,.05) 1px,transparent 1px);
  background-size: 44px 44px;
  mask-image: radial-gradient(circle at center,#000 0,transparent 68%)
}
.dark .sc-splash-grid {
  opacity: .6;
  background-image: linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px)
}
.sc-splash-accent {
  position: absolute;
  width: min(62vw,46rem);
  aspect-ratio: 1;
  border: 1px solid rgba(237,45,41,.12);
  border-radius: 50%;
  transform: scale(.7);
  opacity: 0
}
.sc-splash.is-running .sc-splash-accent {
  animation: sc-splash-ring 1.7s cubic-bezier(.2,.8,.2,1) forwards
}
.sc-splash-inner {
  position: relative;
  z-index: 1;
  display: flex;
  width: min(100%,27rem);
  flex-direction: column;
  align-items: center
}
.sc-splash-logo-wrap {
  width: min(82vw,22rem);
  min-height: 4.9rem;
  opacity: 0;
  transform: translateY(10px)
}
.sc-splash-logo {
  display: block;
  width: 100%;
  height: auto
}
.sc-splash-logo.logo-dark {
  display: none
}
.dark .sc-splash-logo.logo-light {
  display: none
}
.dark .sc-splash-logo.logo-dark {
  display: block
}
.sc-splash.is-running .sc-splash-logo-wrap {
  animation: sc-splash-copy .75s .12s cubic-bezier(.2,.8,.2,1) forwards
}
.sc-splash-meter {
  display: grid;
  grid-template-columns: 1fr 2rem;
  align-items: center;
  gap: .8rem;
  width: min(72vw,17rem);
  margin-top: 1.7rem
}
.sc-splash-progress {
  width: 100%;
  height: 2px;
  overflow: hidden;
  background: #e4e4e7
}
.dark .sc-splash-progress {
  background: #27272a
}
.sc-splash-progress span {
  display: block;
  width: 100%;
  height: 100%;
  background: #ed2d29;
  transform: scaleX(0);
  transform-origin: left center;
  will-change: transform
}
.sc-splash-value {
  color: #ed2d29;
  font: 700 .7rem/1 "Manrope",sans-serif;
  font-variant-numeric: tabular-nums;
  text-align: right
}
.sc-splash-value::after {
  content: "%";
  margin-left: .05rem;
  font-size: .48rem;
  opacity: .7
}
.sc-splash-label {
  margin: .75rem 0 0;
  color: #71717a;
  font: 600 .65rem/1.4 "Manrope",sans-serif;
  letter-spacing: .14em;
  text-align: center;
  text-transform: uppercase;
  opacity: 0
}
.dark .sc-splash-label {
  color: #a1a1aa
}
.sc-splash.is-running .sc-splash-label {
  animation: sc-splash-copy .5s .55s ease forwards
}
.sc-splash.is-leaving {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: scale(1.025);
  filter: blur(7px);
  transition: opacity .7s cubic-bezier(.4,0,.2,1),transform .85s cubic-bezier(.2,.8,.2,1),filter .7s ease,visibility .85s
}
.sc-splash.is-leaving .sc-splash-inner {
  transform: translateY(-18px) scale(.97);
  transition: transform .7s cubic-bezier(.4,0,.2,1)
}
@keyframes sc-splash-copy {
  to { opacity: 1; transform: none }
}
@keyframes sc-splash-ring {
  35% { opacity: 1 }
  to { opacity: 0; transform: scale(1.08) }
}
@media(max-width:420px) {
  .sc-splash { padding: 1.25rem }
}
h1,
h2,
h3,
.font-display {
  font-family: "Manrope",sans-serif
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .25;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.045'/%3E%3C/svg%3E")
}
.glass {
  background: rgba(255,255,255,.8);
  border: 1px solid rgba(255,255,255,.82);
  backdrop-filter: blur(18px)
}
.dark .glass {
  background: rgba(24,24,27,.8);
  border-color: rgba(63,63,70,.72)
}
.grid-surface {
  background-image: linear-gradient(rgba(255,255,255,.86),rgba(255,255,255,.86)),linear-gradient(rgba(24,24,27,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(24,24,27,.055) 1px,transparent 1px);
  background-size: auto,44px 44px,44px 44px
}
.dark .grid-surface {
  background-image: linear-gradient(rgba(9,9,11,.91),rgba(9,9,11,.91)),linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px)
}
.shimmer {
  position: relative;
  overflow: hidden
}
.shimmer::after {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 55%;
  height: 100%;
  background: rgba(255,255,255,.2);
  transform: skewX(-22deg);
  transition: left .45s ease
}
.shimmer:hover::after {
  left: 165%
}
.lift {
  transition: transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,border-color .35s
}
.lift:hover {
  transform: translateY(-8px);
  border-color: rgba(237,45,41,.45);
  box-shadow: 0 28px 70px rgba(23,23,23,.12)
}
.sc-spotlight {
  --spotlight-x: 50%;
  --spotlight-y: 50%;
  position: relative;
  isolation: isolate;
  overflow: hidden
}
.sc-spotlight::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  background: radial-gradient(340px circle at var(--spotlight-x) var(--spotlight-y),rgba(255,255,255,.25),rgba(237,45,41,.07) 38%,transparent 70%);
  transition: opacity .22s ease
}
.sc-spotlight.sc-spotlight-active::before {
  opacity: 1
}
.dark .sc-spotlight::before,
.bg-zinc-950.sc-spotlight::before,
.bg-brand.sc-spotlight::before {
  background: radial-gradient(340px circle at var(--spotlight-x) var(--spotlight-y),rgba(255,255,255,.2),rgba(237,45,41,.12) 40%,transparent 72%)
}
@media(hover:none),(pointer:coarse) {
  .sc-spotlight::before {
    display: none
  }
}
.hero-showcase {
  padding-top: clamp(8.5rem,11vw,11rem)!important;
  padding-bottom: clamp(5rem,8vw,8rem)!important
}
.hero-showcase>div {
  max-width: 84rem
}
.hero-product-stage {
  border-radius: 3.25rem;
  transition: transform .55s cubic-bezier(.2,.8,.2,1),filter .55s ease
}
.hero-product-stage:hover {
  transform: translateY(-6px);
  filter: drop-shadow(0 35px 55px rgba(24,24,27,.1))
}
#soluzioni,
#vantaggi,
#contatti {
  padding-top: clamp(7rem,10vw,10rem)!important;
  padding-bottom: clamp(7rem,10vw,10rem)!important
}
.process-grid {
  position: relative
}
.process-card {
  transition: transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s,border-color .4s
}
.process-card:hover {
  transform: translateY(-7px);
  border-color: rgba(237,45,41,.4);
  box-shadow: 0 25px 60px rgba(24,24,27,.11)
}
.process-card span:first-child {
  transition: transform .35s ease,opacity .35s ease
}
.process-card:hover span:first-child {
  transform: translateX(5px);
  opacity: .85
}
.impact-section {
  padding-block: clamp(6rem,9vw,9rem)!important
}
.impact-panel {
  min-height: 19rem;
  display: flex;
  align-items: center;
  box-shadow: 0 35px 90px rgba(24,24,27,.2)
}
.impact-panel>div:last-child {
  width: 100%
}
@media(min-width:1024px) {
  .process-grid::before {
    content: "";
    position: absolute;
    z-index: 0;
    inset: 12% 50% 12% auto;
    width: 1px;
    background: linear-gradient(transparent,rgba(237,45,41,.35),transparent)
  }
}
@media(min-width:640px) {
  .process-card:nth-child(even):hover {
    transform: translateY(25px)
  }
}
@media(max-width:639px) {
  .hero-product-stage {
    border-radius: 2.25rem
  }
  .impact-panel {
    min-height: auto
  }
}
.reveal {
  opacity: 1;
  transform: none;
  transition: opacity .7s ease,transform .7s ease
}
.js .reveal {
  opacity: 0;
  transform: translateY(22px)
}
.js .reveal.visible {
  opacity: 1;
  transform: none
}
.product-stage {
  background: radial-gradient(circle at 50% 38%,rgba(237,45,41,.16),transparent 48%),linear-gradient(145deg,#fff,#f2f2f3)
}
.dark .product-stage {
  background: radial-gradient(circle at 50% 38%,rgba(237,45,41,.2),transparent 48%),linear-gradient(145deg,#18181b,#27272a)
}
.spec-pill {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .55rem .85rem;
  border: 1px solid #e4e4e7;
  border-radius: 9999px;
  font-size: .75rem;
  color: #71717a
}
.dark .spec-pill {
  border-color: #3f3f46;
  color: #a1a1aa
}
.product-card-image {
  height: 260px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(145deg,#fff,#f4f4f5)
}
.dark .product-card-image {
  background: linear-gradient(145deg,#18181b,#27272a)
}
.product-card-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 1.5rem;
  transition: transform .4s cubic-bezier(.2,.8,.2,1)
}
.lift:hover .product-card-image img {
  transform: scale(1.055) rotate(1deg)
}
.contact-field {
  width: 100%;
  margin-top: .5rem;
  padding: .875rem 1rem;
  color: #fff;
  font-size: .875rem;
  background: #27272a;
  border: 1px solid #3f3f46;
  border-radius: 1rem;
  outline: none;
  transition: border-color .2s,background .2s
}
.contact-field::placeholder {
  color: #52525b
}
.contact-field:focus {
  border-color: #ed2d29
}
.dark .contact-field {
  background: #3f3f46;
  border-color: #52525b
}
@media(prefers-reduced-motion:reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms!important;
    animation-iteration-count: 1!important;
    scroll-behavior: auto!important
  }
}
[x-cloak] {
  display: none!important
}
.logo-dark {
  display: none
}
.dark .logo-light {
  display: none
}
.dark .logo-dark {
  display: block
}
.nav-shell {
  width: calc(100% - 1.5rem);
  margin-left: .75rem;
  margin-right: .75rem;
  border-radius: 1.1rem
}
@media(min-width:1280px) {
  .nav-shell {
    margin-left: auto;
    margin-right: auto
  }
}
@media(max-width:399px) {
  .nav-shell {
    width: calc(100% - 1rem);
    margin-left: .5rem;
    margin-right: .5rem
  }
}
.check-item {
  display: flex;
  align-items: center;
  gap: .55rem
}
.check-item::before {
  content: "";
  width: .55rem;
  height: .3rem;
  border-left: 2px solid #ed2d29;
  border-bottom: 2px solid #ed2d29;
  transform: rotate(-45deg);
  flex: 0 0 auto;
  margin-top: -.15rem
}
.marquee-dot {
  width: .35rem;
  height: .35rem;
  border-radius: 9999px;
  background: #ed2d29;
  display: inline-block;
  flex: 0 0 auto
}
.contact-wrap,
.contact-panel,
.contact-panel form,
.contact-panel label {
  min-width: 0;
  max-width: 100%
}
.contact-panel {
  width: 100%;
  isolation: isolate
}
.contact-panel form {
  width: 100%
}
.contact-panel input:not([type="checkbox"]),
.contact-panel select,
.contact-panel textarea {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  border-radius: 1rem
}
@media(max-width:639px) {
  .contact-wrap {
    padding-left: 1rem!important;
    padding-right: 1rem!important
  }
  .contact-panel {
    border-radius: 2rem!important;
    padding: 1.25rem!important
  }
  .contact-panel form {
    gap: .875rem
  }
}
