@font-face {
  font-family: "Instrument Serif";
  font-weight: normal;
  font-style: normal;
  src: url("../fonts/InstrumentSerif-Regular.ttf") format("truetype");
}

@font-face {
  font-family: "Instrument Serif";
  font-weight: normal;
  font-style: italic;
  src: url("../fonts/InstrumentSerif-Italic.ttf") format("truetype");
}

html,
body {
  overflow-x: hidden;
}

.black-bg,
body {
  background-color: #141414;
}

.h1-special,
.sub-title-special {
  text-align: left;
  color: white;
}

.h2-special {
  font-size: clamp(42px, 4.2vw, 72px);
  letter-spacing: -2px;
  line-height: var(--heading-line-height);
}
.h3-special {
  font-size: clamp(32px, 3.2vw, 56px); /* più piccolo */
  letter-spacing: -2px;
  line-height: var(--heading-line-height);
}

@media (min-width: 640px) {
  .h1-special,
  .sub-title-special {
    text-align: right;
  }
}

.h1-special {
  font-size: clamp(50px, 6vw, 101px);
  letter-spacing: -2px;
  line-height: var(--heading-line-height);
}

@media (min-width: 1024px) {
  .h1-special {
    letter-spacing: -3.5px;
  }
}
.special-font {
  font-family: "Instrument Serif", serif;
  font-size: 1em;
  letter-spacing: 2px;
  font-style: italic;
}
.sub-title-special {
  font-size: clamp(26px, 2vw, 35px);
  line-height: var(--heading-line-height);
  font-family: "Instrument Serif", serif;
}

/*STILE PER L'EFFETTO SULLE COLONNE*/
.border-decorative {
  overflow: hidden; /* clip dei figli */
  border-radius: var(--lt-radius-large);
  border: 1px solid #a7a7a7;
  position: relative;
}

#entrata {
  height: calc(var(--lt-real-vh) * 98);
}

@media (min-width: 640px) {
  #entrata {
    height: calc(var(--lt-real-vh) * 100);
  }
}

#sfondo-generale {
  min-width: 100%;
  min-height: 100%;
  object-fit: cover;
  transform-origin: center center;
  transform: scale(1.4);
  opacity: 1;
  will-change: opacity;
}
.border-decorative .bg-image-div {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/*scurisco leggermente l immagine che e troppo luminosa per leggere bene il testo bianco*/
.bg-image-div {
  filter: brightness(0.7);
}

/*immagine pc*/
#new-world {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 60;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translate(-50%, -50%) scale(0);
  max-width: 80%;
}

.slider-list {
  display: flex;
  flex-direction: column; /* Arrange cards vertically in the column */
}

.slide {
  min-height: 320px; /* Mobile default */
  border: 1px solid transparent;
  will-change: transform, opacity, filter;
}

@media (min-width: 640px) {
  .slide {
    min-height: 200px; /* Small tablet */
  }
}

@media (min-width: 768px) {
  .slide {
    min-height: 190px; /* Tablet */
  }
}

@media (min-width: 1024px) {
  .slide {
    min-height: 160px; /* Desktop – viene ora applicata correttamente */
  }
}

#splide-prj .splide__slide {
  border-radius: var(--lt-radius-large);
  overflow: hidden;
  transition: all 0.3s ease-out;
}

#splide-prj .splide__slide:not(.is-active) {
  filter: brightness(0.5);
}

.splide__arrow--next,
.splide__arrow--prev {
  visibility: hidden !important;
}

.video-prj {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.form-col {
  background-color: rgba(0, 0, 0, 0.35);
  color: white;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: inset 1px 1px 0px -0.5px #ffffff80,
    /* bordo chiaro in alto a sinistra */ inset -1px -1px 0px -0.5px #ffffff70,
    /* bordo scuro in basso a destra */ inset 0 0 0.5px #ffffff40,
    /* alone bianco interno */ 0 4px 8px rgba(0, 0, 0, 0.2),
    /* shadow esterna morbida */ 0 0 2px rgba(255, 255, 255, 0.3);

  border: 1px solid #ffffff90;
}
#chi-sono {
  background-image: url("https://alex-web.it/wp-content/uploads/2025/06/luci-dell-alba-2.webp");
}

.anim-special,
.anim-special-f,
.anim-special > *,
.anim-special-f > * {
  font-size: clamp(40px, 7vw, 136px);
}

.anim-special,
.anim-special > * {
  font-weight: 400;
  letter-spacing: -3px;
  line-height: var(--heading-line-height);
}

.anim-special-f,
.anim-special-f > * {
  letter-spacing: 2px;
  font-family: "Instrument Serif", serif;
  line-height: var(--body-line-height);
}

@media (min-width: 640px) {
  .anim-special,
  .anim-special-f,
  .anim-special > *,
  .anim-special-f > * {
    font-size: clamp(18px, 6vw, 136px);
  }
}
@media (min-width: 768px) {
  .anim-special,
  .anim-special-f,
  .anim-special > *,
  .anim-special-f > * {
    font-size: clamp(26px, 6vw, 136px);
  }
}
@media (min-width: 1024px) {
  .anim-special,
  .anim-special-f,
  .anim-special > *,
  .anim-special-f > * {
    font-size: clamp(35px, 8vw, 136px);
  }

  .anim-special-f,
  .anim-special-f > * {
    line-height: var(--heading-line-height);
  }
}

.anim-special-f > .word:nth-child(4),
.anim-special-f > .word:nth-child(5),
.anim-special-f > .word:nth-child(6),
.anim-special > .word:nth-child(1),
.anim-special > .word:nth-child(2),
.anim-special > .word:nth-child(3) {
  background: linear-gradient(220deg, #ffc067 0%, #ffc9a1 40%, #75cff0 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}
.anim-special-f > .word:nth-child(3) {
  text-decoration: underline;
  text-decoration-style: wavy;
  text-decoration-color: var(--primary);
  text-decoration-thickness: 5px;
  text-underline-offset: 12px;
}

/*CSS per i pallini animati di sfondo*/
.dots-wrapper {
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: 0.2;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: -1;
}
.dots-wrapper svg {
  width: 100%;
  height: 100%;
}

circle {
  will-change: transform;
}