@import url("https://use.typekit.net/pvp1dzx.css");
@-webkit-keyframes pbmGlowWhite {
  0%, 100% {
    -webkit-filter: drop-shadow(0 0 1px rgba(214, 194, 154, 0.95)) drop-shadow(0 0 2px rgba(214, 194, 154, 0.75)) drop-shadow(0 0 5px rgba(214, 194, 154, 0.28));
            filter: drop-shadow(0 0 1px rgba(214, 194, 154, 0.95)) drop-shadow(0 0 2px rgba(214, 194, 154, 0.75)) drop-shadow(0 0 5px rgba(214, 194, 154, 0.28));
  }
  50% {
    -webkit-filter: drop-shadow(0 0 1px rgb(214, 194, 154)) drop-shadow(0 0 3px rgba(214, 194, 154, 0.95)) drop-shadow(0 0 7px rgba(214, 194, 154, 0.62)) drop-shadow(0 0 11px rgba(214, 194, 154, 0.28));
            filter: drop-shadow(0 0 1px rgb(214, 194, 154)) drop-shadow(0 0 3px rgba(214, 194, 154, 0.95)) drop-shadow(0 0 7px rgba(214, 194, 154, 0.62)) drop-shadow(0 0 11px rgba(214, 194, 154, 0.28));
  }
}
@keyframes pbmGlowWhite {
  0%, 100% {
    -webkit-filter: drop-shadow(0 0 1px rgba(214, 194, 154, 0.95)) drop-shadow(0 0 2px rgba(214, 194, 154, 0.75)) drop-shadow(0 0 5px rgba(214, 194, 154, 0.28));
            filter: drop-shadow(0 0 1px rgba(214, 194, 154, 0.95)) drop-shadow(0 0 2px rgba(214, 194, 154, 0.75)) drop-shadow(0 0 5px rgba(214, 194, 154, 0.28));
  }
  50% {
    -webkit-filter: drop-shadow(0 0 1px rgb(214, 194, 154)) drop-shadow(0 0 3px rgba(214, 194, 154, 0.95)) drop-shadow(0 0 7px rgba(214, 194, 154, 0.62)) drop-shadow(0 0 11px rgba(214, 194, 154, 0.28));
            filter: drop-shadow(0 0 1px rgb(214, 194, 154)) drop-shadow(0 0 3px rgba(214, 194, 154, 0.95)) drop-shadow(0 0 7px rgba(214, 194, 154, 0.62)) drop-shadow(0 0 11px rgba(214, 194, 154, 0.28));
  }
}
@-webkit-keyframes pbmGlowBlue {
  0%, 100% {
    -webkit-filter: drop-shadow(0 0 1px rgb(100, 125, 206)) drop-shadow(0 0 2px rgba(100, 125, 206, 0.78)) drop-shadow(0 0 5px rgba(122, 134, 185, 0.3));
            filter: drop-shadow(0 0 1px rgb(100, 125, 206)) drop-shadow(0 0 2px rgba(100, 125, 206, 0.78)) drop-shadow(0 0 5px rgba(122, 134, 185, 0.3));
  }
  50% {
    -webkit-filter: drop-shadow(0 0 1px rgb(100, 125, 206)) drop-shadow(0 0 3px rgba(100, 125, 206, 0.95)) drop-shadow(0 0 7px rgba(132, 146, 201, 0.65)) drop-shadow(0 0 11px rgba(122, 134, 185, 0.3));
            filter: drop-shadow(0 0 1px rgb(100, 125, 206)) drop-shadow(0 0 3px rgba(100, 125, 206, 0.95)) drop-shadow(0 0 7px rgba(132, 146, 201, 0.65)) drop-shadow(0 0 11px rgba(122, 134, 185, 0.3));
  }
}
@keyframes pbmGlowBlue {
  0%, 100% {
    -webkit-filter: drop-shadow(0 0 1px rgb(100, 125, 206)) drop-shadow(0 0 2px rgba(100, 125, 206, 0.78)) drop-shadow(0 0 5px rgba(122, 134, 185, 0.3));
            filter: drop-shadow(0 0 1px rgb(100, 125, 206)) drop-shadow(0 0 2px rgba(100, 125, 206, 0.78)) drop-shadow(0 0 5px rgba(122, 134, 185, 0.3));
  }
  50% {
    -webkit-filter: drop-shadow(0 0 1px rgb(100, 125, 206)) drop-shadow(0 0 3px rgba(100, 125, 206, 0.95)) drop-shadow(0 0 7px rgba(132, 146, 201, 0.65)) drop-shadow(0 0 11px rgba(122, 134, 185, 0.3));
            filter: drop-shadow(0 0 1px rgb(100, 125, 206)) drop-shadow(0 0 3px rgba(100, 125, 206, 0.95)) drop-shadow(0 0 7px rgba(132, 146, 201, 0.65)) drop-shadow(0 0 11px rgba(122, 134, 185, 0.3));
  }
}
@-webkit-keyframes pbmGlowWhiteAlt {
  0%, 50%, 100% {
    -webkit-filter: drop-shadow(0 0 1px rgba(214, 194, 154, 0)) drop-shadow(0 0 3px rgba(214, 194, 154, 0)) drop-shadow(0 0 7px rgba(214, 194, 154, 0)) drop-shadow(0 0 11px rgba(214, 194, 154, 0));
            filter: drop-shadow(0 0 1px rgba(214, 194, 154, 0)) drop-shadow(0 0 3px rgba(214, 194, 154, 0)) drop-shadow(0 0 7px rgba(214, 194, 154, 0)) drop-shadow(0 0 11px rgba(214, 194, 154, 0));
  }
  25% {
    -webkit-filter: drop-shadow(0 0 1px rgb(214, 194, 154)) drop-shadow(0 0 3px rgba(214, 194, 154, 0.95)) drop-shadow(0 0 7px rgba(214, 194, 154, 0.62)) drop-shadow(0 0 11px rgba(214, 194, 154, 0.28));
            filter: drop-shadow(0 0 1px rgb(214, 194, 154)) drop-shadow(0 0 3px rgba(214, 194, 154, 0.95)) drop-shadow(0 0 7px rgba(214, 194, 154, 0.62)) drop-shadow(0 0 11px rgba(214, 194, 154, 0.28));
  }
}
@keyframes pbmGlowWhiteAlt {
  0%, 50%, 100% {
    -webkit-filter: drop-shadow(0 0 1px rgba(214, 194, 154, 0)) drop-shadow(0 0 3px rgba(214, 194, 154, 0)) drop-shadow(0 0 7px rgba(214, 194, 154, 0)) drop-shadow(0 0 11px rgba(214, 194, 154, 0));
            filter: drop-shadow(0 0 1px rgba(214, 194, 154, 0)) drop-shadow(0 0 3px rgba(214, 194, 154, 0)) drop-shadow(0 0 7px rgba(214, 194, 154, 0)) drop-shadow(0 0 11px rgba(214, 194, 154, 0));
  }
  25% {
    -webkit-filter: drop-shadow(0 0 1px rgb(214, 194, 154)) drop-shadow(0 0 3px rgba(214, 194, 154, 0.95)) drop-shadow(0 0 7px rgba(214, 194, 154, 0.62)) drop-shadow(0 0 11px rgba(214, 194, 154, 0.28));
            filter: drop-shadow(0 0 1px rgb(214, 194, 154)) drop-shadow(0 0 3px rgba(214, 194, 154, 0.95)) drop-shadow(0 0 7px rgba(214, 194, 154, 0.62)) drop-shadow(0 0 11px rgba(214, 194, 154, 0.28));
  }
}
@-webkit-keyframes pbmGlowBlueAlt {
  0%, 50%, 100% {
    -webkit-filter: drop-shadow(0 0 1px rgba(100, 125, 206, 0)) drop-shadow(0 0 3px rgba(100, 125, 206, 0)) drop-shadow(0 0 7px rgba(132, 146, 201, 0)) drop-shadow(0 0 11px rgba(122, 134, 185, 0));
            filter: drop-shadow(0 0 1px rgba(100, 125, 206, 0)) drop-shadow(0 0 3px rgba(100, 125, 206, 0)) drop-shadow(0 0 7px rgba(132, 146, 201, 0)) drop-shadow(0 0 11px rgba(122, 134, 185, 0));
  }
  75% {
    -webkit-filter: drop-shadow(0 0 1px rgb(100, 125, 206)) drop-shadow(0 0 3px rgba(100, 125, 206, 0.95)) drop-shadow(0 0 7px rgba(132, 146, 201, 0.65)) drop-shadow(0 0 11px rgba(122, 134, 185, 0.3));
            filter: drop-shadow(0 0 1px rgb(100, 125, 206)) drop-shadow(0 0 3px rgba(100, 125, 206, 0.95)) drop-shadow(0 0 7px rgba(132, 146, 201, 0.65)) drop-shadow(0 0 11px rgba(122, 134, 185, 0.3));
  }
}
@keyframes pbmGlowBlueAlt {
  0%, 50%, 100% {
    -webkit-filter: drop-shadow(0 0 1px rgba(100, 125, 206, 0)) drop-shadow(0 0 3px rgba(100, 125, 206, 0)) drop-shadow(0 0 7px rgba(132, 146, 201, 0)) drop-shadow(0 0 11px rgba(122, 134, 185, 0));
            filter: drop-shadow(0 0 1px rgba(100, 125, 206, 0)) drop-shadow(0 0 3px rgba(100, 125, 206, 0)) drop-shadow(0 0 7px rgba(132, 146, 201, 0)) drop-shadow(0 0 11px rgba(122, 134, 185, 0));
  }
  75% {
    -webkit-filter: drop-shadow(0 0 1px rgb(100, 125, 206)) drop-shadow(0 0 3px rgba(100, 125, 206, 0.95)) drop-shadow(0 0 7px rgba(132, 146, 201, 0.65)) drop-shadow(0 0 11px rgba(122, 134, 185, 0.3));
            filter: drop-shadow(0 0 1px rgb(100, 125, 206)) drop-shadow(0 0 3px rgba(100, 125, 206, 0.95)) drop-shadow(0 0 7px rgba(132, 146, 201, 0.65)) drop-shadow(0 0 11px rgba(122, 134, 185, 0.3));
  }
}
@-webkit-keyframes kvShadowFloat {
  0%, 100% {
    -webkit-transform: scaleX(1) scaleY(1);
            transform: scaleX(1) scaleY(1);
    opacity: 0.88;
    -webkit-filter: blur(0);
            filter: blur(0);
  }
  50% {
    -webkit-transform: scaleX(0.88) scaleY(0.92);
            transform: scaleX(0.88) scaleY(0.92);
    opacity: 0.56;
    -webkit-filter: blur(1.5px);
            filter: blur(1.5px);
  }
}
@keyframes kvShadowFloat {
  0%, 100% {
    -webkit-transform: scaleX(1) scaleY(1);
            transform: scaleX(1) scaleY(1);
    opacity: 0.88;
    -webkit-filter: blur(0);
            filter: blur(0);
  }
  50% {
    -webkit-transform: scaleX(0.88) scaleY(0.92);
            transform: scaleX(0.88) scaleY(0.92);
    opacity: 0.56;
    -webkit-filter: blur(1.5px);
            filter: blur(1.5px);
  }
}
@-webkit-keyframes kvGroupedShadowFloat {
  0%, 100% {
    -webkit-transform: scaleX(0.88) scaleY(0.92);
            transform: scaleX(0.88) scaleY(0.92);
    opacity: 0.56;
    -webkit-filter: blur(1.5px);
            filter: blur(1.5px);
  }
  50% {
    -webkit-transform: scaleX(1) scaleY(1);
            transform: scaleX(1) scaleY(1);
    opacity: 0.88;
    -webkit-filter: blur(0);
            filter: blur(0);
  }
}
@keyframes kvGroupedShadowFloat {
  0%, 100% {
    -webkit-transform: scaleX(0.88) scaleY(0.92);
            transform: scaleX(0.88) scaleY(0.92);
    opacity: 0.56;
    -webkit-filter: blur(1.5px);
            filter: blur(1.5px);
  }
  50% {
    -webkit-transform: scaleX(1) scaleY(1);
            transform: scaleX(1) scaleY(1);
    opacity: 0.88;
    -webkit-filter: blur(0);
            filter: blur(0);
  }
}
@-webkit-keyframes pbmFloatUp {
  0%, 100% {
    -webkit-transform: translateY(-1.25%);
            transform: translateY(-1.25%);
  }
  50% {
    -webkit-transform: translateY(1.25%);
            transform: translateY(1.25%);
  }
}
@keyframes pbmFloatUp {
  0%, 100% {
    -webkit-transform: translateY(-1.25%);
            transform: translateY(-1.25%);
  }
  50% {
    -webkit-transform: translateY(1.25%);
            transform: translateY(1.25%);
  }
}
@-webkit-keyframes pbmFloatDown {
  0%, 100% {
    -webkit-transform: translateY(1.25%);
            transform: translateY(1.25%);
  }
  50% {
    -webkit-transform: translateY(-1.25%);
            transform: translateY(-1.25%);
  }
}
@keyframes pbmFloatDown {
  0%, 100% {
    -webkit-transform: translateY(1.25%);
            transform: translateY(1.25%);
  }
  50% {
    -webkit-transform: translateY(-1.25%);
            transform: translateY(-1.25%);
  }
}
.project {
  background-color: #eef4ff;
  font-family: "neuzeit-grotesk", "novecento-sans", sans-serif;
}
.project img {
  height: auto;
}
.project .kv {
  position: relative;
  overflow: hidden;
  aspect-ratio: 1080/1480;
  width: 100%;
}
.project .kv__logoBox {
  position: absolute;
  top: 2.6%;
  right: 5%;
  max-width: 100px;
  z-index: 5;
}
.project .kv__logoBox img {
  display: block;
  width: 100%;
  height: auto;
}
.project .kv__flexBox {
  position: absolute;
  inset: 0;
  z-index: 3;
  width: 100%;
  height: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  padding: 12% 6% 3%;
  gap: 1.2%;
}
.project .kv__txtBox {
  position: relative;
  z-index: 4;
  width: 100%;
  text-align: left;
  text-transform: uppercase;
  line-height: 1.1;
}
.project .kv__txtBox-title {
  width: 88%;
  max-width: 300px;
  margin-bottom: 3%;
}
.project .kv__txtBox-title h1 {
  padding: 0;
  margin: 0;
  height: 0;
  text-indent: -9999px;
}
.project .kv__txtBox-title img {
  display: block;
  width: 100%;
  height: auto;
}
.project .kv__txtBox-desc {
  margin-bottom: 3.5%;
}
.project .kv__txtBox-desc p {
  color: #2c2c2c;
  font-size: clamp(12px, 3.5vw, 15px);
  font-weight: 500;
  line-height: 1.45;
  margin: 0;
  text-transform: none;
  max-width: 17em;
}
.project .kv__txtBox-desc p span {
  color: #647dce;
  font-weight: 700;
}
.project .kv__txtBox-date {
  position: relative;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 0;
  padding-top: 3.5%;
}
.project .kv__txtBox-date::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 32px;
  height: 4px;
  background: #647dce;
  border-radius: 2px;
}
.project .kv__txtBox-date p {
  color: #647dce;
  font-size: clamp(12px, 3.2vw, 14px);
  font-weight: 800;
  letter-spacing: 0.03em;
  text-shadow: 0 0 8px rgba(255, 255, 255, 0.95), 0 0 16px rgba(180, 205, 255, 0.85), 0 1px 0 rgba(255, 255, 255, 0.7);
  margin: 0;
  padding: 0.7em 1.4em;
  border-radius: 50px;
  background-color: rgba(90, 150, 255, 0.55);
  background-image: url(https://storage-asset.msi.com/event/2026/it/pbm-il-gioco-inizia-ora/images/kv-date-bg.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  border: 1px solid rgba(255, 255, 255, 0.65);
  -webkit-box-shadow: 0 0 14px rgba(90, 150, 255, 0.45), 0 4px 16px rgba(74, 130, 240, 0.22);
          box-shadow: 0 0 14px rgba(90, 150, 255, 0.45), 0 4px 16px rgba(74, 130, 240, 0.22);
  white-space: nowrap;
  text-transform: none;
}
.project .kv__pdBox {
  position: relative;
  z-index: 3;
  width: 88%;
  max-width: 360px;
  aspect-ratio: 1200/945;
  margin: 1% auto 0;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
}
.project .kv__pdBox-layer {
  position: absolute;
  inset: 0;
  width: 100%;
  will-change: transform;
}
.project .kv__pdBox-layer picture {
  display: block;
  width: 100%;
  height: 100%;
}
.project .kv__pdBox-layer img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.project .kv__pdBox-cooling {
  z-index: 6;
  -webkit-animation: pbmFloatUp 5.4s ease-in-out -0.4s infinite;
          animation: pbmFloatUp 5.4s ease-in-out -0.4s infinite;
}
.project .kv__pdBox-mb {
  z-index: 4;
  -webkit-animation: pbmFloatDown 5.8s ease-in-out -1.1s infinite;
          animation: pbmFloatDown 5.8s ease-in-out -1.1s infinite;
}
.project .kv__pdBox-vga {
  z-index: 5;
  -webkit-animation: pbmFloatUp 5.4s ease-in-out -0.4s infinite;
          animation: pbmFloatUp 5.4s ease-in-out -0.4s infinite;
}
.project .kv__pdBox-case {
  z-index: 1;
  -webkit-animation: pbmFloatDown 5.7s ease-in-out -0.7s infinite;
          animation: pbmFloatDown 5.7s ease-in-out -0.7s infinite;
}
.project .kv__pdBox-ssd {
  z-index: 3;
  -webkit-animation: pbmFloatUp 5.4s ease-in-out -0.55s infinite;
          animation: pbmFloatUp 5.4s ease-in-out -0.55s infinite;
}
.project .kv__pdBox-psu {
  z-index: 2;
  -webkit-animation: pbmFloatUp 5.4s ease-in-out -0.7s infinite;
          animation: pbmFloatUp 5.4s ease-in-out -0.7s infinite;
}
.project .kv__pdBox-shadowCase, .project .kv__pdBox-shadowPsu {
  z-index: 0;
  pointer-events: none;
  -webkit-transform-origin: center bottom;
          transform-origin: center bottom;
  will-change: transform, opacity, filter;
}
.project .kv__pdBox-shadowCase {
  -webkit-animation: kvShadowFloat 5.7s ease-in-out -0.7s infinite;
          animation: kvShadowFloat 5.7s ease-in-out -0.7s infinite;
}
.project .kv__pdBox-shadowPsu {
  -webkit-animation: kvGroupedShadowFloat 5.4s ease-in-out -0.55s infinite;
          animation: kvGroupedShadowFloat 5.4s ease-in-out -0.55s infinite;
}
.project .kv__bgBox {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
}
.project .kv__bgBox picture,
.project .kv__bgBox img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center top;
     object-position: center top;
}
@media (prefers-reduced-motion: reduce) {
  .project .kv__pdBox-layer {
    -webkit-animation: none;
            animation: none;
    will-change: auto;
  }
}
@media (min-width: 768px) {
  .project .kv__logoBox {
    width: 14%;
    max-width: 100px;
  }
  .project .kv__flexBox {
    padding: 10% 7% 3%;
  }
  .project .kv__txtBox-title {
    max-width: 380px;
  }
  .project .kv__txtBox-desc p {
    color: #2c2c2c;
    font-size: clamp(14px, 2.4vw, 17px);
    max-width: 20em;
  }
  .project .kv__txtBox-date p {
    color: #647dce;
    font-size: clamp(13px, 2vw, 15px);
    padding: 0.75em 1.7em;
  }
  .project .kv__pdBox {
    width: 78%;
    max-width: 440px;
  }
}
@media (min-width: 996px) {
  .project .kv {
    aspect-ratio: 3600/1260;
  }
  .project .kv__logoBox {
    top: 7%;
    right: 12%;
    width: 8%;
    max-width: 200px;
  }
  .project .kv__flexBox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    gap: 1%;
    width: 65%;
    height: 100%;
    margin: auto;
    margin-bottom: 1%;
    margin-left: 15%;
    padding: 0;
  }
  .project .kv__txtBox {
    width: 44%;
    -ms-flex-negative: 0;
        flex-shrink: 0;
    margin-top: -2%;
  }
  .project .kv__txtBox-title {
    width: auto;
    max-width: none;
    margin-bottom: 3%;
  }
  .project .kv__txtBox-desc {
    margin-bottom: 3.5%;
  }
  .project .kv__txtBox-desc p {
    color: #2c2c2c;
    font-size: 1.12vw;
    max-width: 30em;
    line-height: 1.5;
  }
  .project .kv__txtBox-date {
    padding-top: 7%;
  }
  .project .kv__txtBox-date::before {
    width: 40px;
    height: 5px;
  }
  .project .kv__txtBox-date p {
    color: #647dce;
    font-size: 1.05vw;
    padding: 0.85em 2.3em;
  }
  .project .kv__pdBox {
    width: 50%;
    max-width: none;
    margin: 2% 0 0;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
  }
  .project .kv__bgBox img {
    -o-object-position: center center;
       object-position: center center;
  }
}
@media (min-width: 1300px) {
  .project .kv__txtBox-desc p {
    color: #2c2c2c;
    font-size: 1.05vw;
  }
  .project .kv__txtBox-date p {
    color: #647dce;
    font-size: 0.95vw;
  }
}
@media (min-width: 1600px) {
  .project .kv__logoBox {
    max-width: 170px;
  }
  .project .kv__txtBox-desc p {
    color: #2c2c2c;
    font-size: 1.4rem;
  }
  .project .kv__txtBox-date p {
    color: #647dce;
    font-size: 1.6rem;
    padding: 0.5em 1em;
  }
}
@media (min-width: 1930px) {
  .project .kv__logoBox {
    max-width: 190px;
  }
  .project .kv__txtBox-desc p {
    color: #2c2c2c;
    font-size: 28px;
  }
  .project .kv__txtBox-date p {
    color: #647dce;
    font-size: 30px;
    padding: 0.55em 1.15em;
  }
}
.project .info {
  position: relative;
  padding: 12% 4% 10%;
  text-align: center;
  background: radial-gradient(ellipse 80% 60% at 50% 0%, rgba(180, 200, 255, 0.35) 0%, transparent 55%), -webkit-gradient(linear, left top, left bottom, from(#eef4ff), color-stop(40%, #e8eefc), to(#e4ecfb));
  background: radial-gradient(ellipse 80% 60% at 50% 0%, rgba(180, 200, 255, 0.35) 0%, transparent 55%), linear-gradient(180deg, #eef4ff 0%, #e8eefc 40%, #e4ecfb 100%);
}
.project .info__title {
  margin-bottom: 5%;
}
.project .info__title h2 {
  color: #222b37;
  font-size: clamp(20px, 4.8vw, 30px);
  font-weight: 700;
  margin: 0;
  line-height: 1.45;
  letter-spacing: 0.01em;
}
.project .info__title h2 span {
  color: #647dce;
  font-size: 1.35em;
  font-weight: 800;
  letter-spacing: 0.02em;
}
.project .info__dateBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  gap: 6%;
  max-width: 820px;
  margin: 0 auto 4%;
}
.project .info__dateBox-left, .project .info__dateBox-right {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  gap: 0.4em;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.project .info__dateBox-right {
  margin-bottom: 5%;
  padding-bottom: 5%;
  border-bottom: 1px solid rgba(100, 125, 206, 0.28);
}
.project .info__dateBox-subTitle {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-bottom: 0.2em;
  padding: 0.35em 1em;
  border-radius: 50px;
  background: linear-gradient(135deg, rgba(116, 92, 205, 0.92) 0%, rgba(82, 125, 218, 0.92) 55%, rgba(100, 151, 235, 0.9) 100%);
  border: 1px solid rgba(220, 228, 255, 0.8);
}
.project .info__dateBox-subTitle h3 {
  color: #ffffff;
  font-size: clamp(16px, 3.8vw, 21px);
  font-weight: 800;
  margin: 0;
  letter-spacing: 0.035em;
}
.project .info__dateBox-txt {
  color: #222b37;
  font-size: clamp(17px, 4vw, 23px);
  font-weight: 700;
  line-height: 1.4;
}
.project .info__note {
  max-width: 720px;
  margin: 0 auto 5%;
}
.project .info__note p {
  color: #5a6270;
  font-size: clamp(13px, 3.2vw, 16px);
  font-style: italic;
  font-weight: 400;
  margin: 0;
  line-height: 1.55;
  opacity: 0.9;
}
.project .info .countBox {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 0 auto 5%;
  padding: 1em 2.4em;
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.48) 0%, rgba(225, 235, 255, 0.28) 55%, rgba(184, 202, 244, 0.22) 100%);
  border: 1px solid rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(18px) saturate(135%);
  -webkit-backdrop-filter: blur(18px) saturate(135%);
  -webkit-box-shadow: 0 12px 32px rgba(100, 125, 206, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.85), inset 0 -1px 0 rgba(100, 125, 206, 0.14);
          box-shadow: 0 12px 32px rgba(100, 125, 206, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.85), inset 0 -1px 0 rgba(100, 125, 206, 0.14);
}
.project .info .countBox p {
  color: #222b37;
  font-size: clamp(16px, 3.8vw, 20px);
  font-weight: 600;
  margin: 0;
  line-height: 1.2;
}
.project .info .countBox .redeem-count-mnt {
  color: #647dce;
  font-size: 1.55em;
  font-weight: 800;
  margin: 0 0.15em;
  letter-spacing: 0.02em;
}
.project .info__linkBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 14px;
  max-width: 900px;
  margin: 0 auto;
}
.project .info__linkBox-btn {
  display: inline-block;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-decoration: none;
  text-align: center;
  padding: 0.5em 1em;
  border-radius: 50px;
  color: #647dce;
  text-shadow: 0 0 8px rgba(255, 255, 255, 0.95), 0 0 16px rgba(180, 205, 255, 0.85), 0 1px 0 rgba(255, 255, 255, 0.7);
  background-color: rgba(100, 125, 206, 0.55);
  background-image: url(https://storage-asset.msi.com/event/2026/it/pbm-il-gioco-inizia-ora/images/kv-date-bg.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  border: 1px solid rgba(255, 255, 255, 0.75);
  -webkit-box-shadow: 0 0 16px rgba(100, 125, 206, 0.5), 0 4px 16px rgba(74, 130, 240, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.55);
          box-shadow: 0 0 16px rgba(100, 125, 206, 0.5), 0 4px 16px rgba(74, 130, 240, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.55);
  -webkit-transition: -webkit-transform 0.25s ease, -webkit-box-shadow 0.25s ease, -webkit-filter 0.25s ease;
  transition: -webkit-transform 0.25s ease, -webkit-box-shadow 0.25s ease, -webkit-filter 0.25s ease;
  transition: transform 0.25s ease, box-shadow 0.25s ease, filter 0.25s ease;
  transition: transform 0.25s ease, box-shadow 0.25s ease, filter 0.25s ease, -webkit-transform 0.25s ease, -webkit-box-shadow 0.25s ease, -webkit-filter 0.25s ease;
}
.project .info__linkBox-btn:hover {
  -webkit-transform: translateY(-2px);
          transform: translateY(-2px);
  -webkit-filter: brightness(1.06);
          filter: brightness(1.06);
  -webkit-box-shadow: 0 0 22px rgba(120, 150, 255, 0.7), 0 6px 22px rgba(74, 130, 240, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.7);
          box-shadow: 0 0 22px rgba(120, 150, 255, 0.7), 0 6px 22px rgba(74, 130, 240, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.7);
}
.project .info__linkBox-btn {
  width: 100%;
  max-width: 300px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-size: clamp(16px, 3.8vw, 18px);
  padding: 0.75em 1.2em;
}
@media (min-width: 768px) {
  .project .info {
    padding: 8% 5% 7%;
  }
  .project .info__title {
    margin-bottom: 4%;
  }
  .project .info__title h2 {
    color: #222b37;
    font-size: clamp(23px, 3.2vw, 30px);
  }
  .project .info__dateBox {
    margin-bottom: 4%;
  }
  .project .info__dateBox-subTitle h3 {
    color: #ffffff;
    font-size: clamp(17px, 2.2vw, 20px);
  }
  .project .info__dateBox-txt {
    color: #222b37;
    font-size: clamp(17px, 2.3vw, 22px);
  }
  .project .info__note {
    margin-bottom: 4%;
  }
  .project .info__note p {
    color: #5a6270;
    font-size: clamp(14px, 1.8vw, 16px);
  }
  .project .info .countBox {
    margin-bottom: 5%;
    padding: 1.1em 2.4em;
    border-radius: 16px;
  }
  .project .info .countBox p {
    color: #222b37;
    font-size: clamp(16px, 2vw, 20px);
  }
  .project .info__linkBox {
    gap: 16px;
  }
  .project .info__linkBox-btn {
    max-width: 320px;
    font-size: clamp(16px, 2.2vw, 18px);
  }
}
@media (min-width: 996px) {
  .project .info {
    padding: 5% 0 4.5%;
  }
  .project .info__title {
    margin-bottom: 3.5%;
  }
  .project .info__title h2 {
    color: #222b37;
    font-size: 1.75vw;
  }
  .project .info__title h2 span {
    font-size: 1.4em;
  }
  .project .info__dateBox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    gap: 0;
    margin-bottom: 2.5%;
    max-width: 900px;
  }
  .project .info__dateBox-left, .project .info__dateBox-right {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 0px;
            flex: 1 1 0;
    width: 50%;
    padding: 0 5%;
    position: relative;
  }
  .project .info__dateBox-right {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
  }
  .project .info__dateBox-right::after {
    content: "";
    position: absolute;
    top: 8%;
    right: 0;
    width: 2px;
    height: 84%;
    background: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(20%, #647dce), color-stop(80%, #647dce), to(transparent));
    background: linear-gradient(180deg, transparent 0%, #647dce 20%, #647dce 80%, transparent 100%);
    border-radius: 2px;
    -webkit-box-shadow: 0 0 10px rgba(100, 125, 206, 0.38);
            box-shadow: 0 0 10px rgba(100, 125, 206, 0.38);
    opacity: 0.9;
  }
  .project .info__dateBox-subTitle h3 {
    color: #ffffff;
    font-size: 1.2vw;
  }
  .project .info__dateBox-txt {
    color: #222b37;
    font-size: 1.3vw;
  }
  .project .info__note {
    margin-bottom: 3.5%;
  }
  .project .info__note p {
    color: #5a6270;
    font-size: 0.95vw;
  }
  .project .info .countBox {
    margin-bottom: 3.5%;
    padding: 1.15em 3.5em;
  }
  .project .info .countBox p {
    color: #222b37;
    font-size: 1.2vw;
  }
  .project .info .countBox .redeem-count-mnt {
    font-size: 1.6em;
  }
  .project .info__linkBox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    gap: 2%;
    max-width: 960px;
  }
  .project .info__linkBox-btn {
    width: auto;
    max-width: none;
    font-size: 1.15vw;
    padding: 0.5em 1em;
  }
}
@media (min-width: 1600px) {
  .project .info__title h2 {
    color: #222b37;
    font-size: 1.6vw;
  }
  .project .info__dateBox-subTitle h3 {
    color: #ffffff;
    font-size: 1.2rem;
  }
  .project .info__dateBox-txt {
    color: #222b37;
    font-size: 1.35rem;
  }
  .project .info__note p {
    color: #5a6270;
    font-size: 1.05rem;
  }
  .project .info .countBox p {
    color: #222b37;
    font-size: 2rem;
  }
  .project .info__linkBox-btn {
    font-size: 1.4rem;
  }
}
@media (min-width: 1930px) {
  .project .info__title h2 {
    font-size: 32px;
  }
  .project .info__dateBox-subTitle h3 {
    font-size: 23px;
  }
  .project .info__dateBox-txt {
    font-size: 25px;
  }
  .project .info__note p {
    font-size: 18px;
  }
  .project .info .countBox p {
    font-size: 30px;
  }
  .project .info__linkBox-btn {
    font-size: 22px;
  }
}
.project .pbm {
  position: relative;
  overflow: hidden;
  padding: 10% 0 12%;
  background: radial-gradient(ellipse 70% 55% at 50% 45%, rgba(195, 210, 255, 0.72) 0%, transparent 62%), radial-gradient(ellipse 65% 70% at 100% 20%, rgba(148, 123, 226, 0.28) 0%, transparent 66%), linear-gradient(145deg, #f2f5ff 0%, #dfe8fb 45%, #d8dcf5 72%, #e9e5fb 100%);
}
.project .pbm::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle at 12% 25%, rgba(255, 255, 255, 0.75) 0%, transparent 18%), radial-gradient(circle at 86% 75%, rgba(118, 150, 235, 0.2) 0%, transparent 24%);
}
.project .pbm .msi__container {
  position: relative;
  z-index: 1;
}
.project .pbm__title {
  max-width: 960px;
  margin: 0 auto 7%;
  text-align: center;
}
.project .pbm__title h2 {
  color: #222b37;
  font-size: clamp(25px, 6vw, 38px);
  font-weight: 800;
  line-height: 1.2;
  margin: 0 0 0.65em;
  letter-spacing: 0.01em;
}
.project .pbm__title p {
  color: #2c2c2c;
  font-size: clamp(15px, 3.8vw, 19px);
  line-height: 1.65;
  margin: 0;
}
.project .pbm__title p b {
  color: #647dce;
  font-weight: 800;
}
.project .pbm__wrapBox {
  display: grid;
  grid-template-columns: 1fr;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 7vw;
}
.project .pbm__navBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 3%;
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
}
.project .pbm__navBox-btn {
  width: 31.333%;
  opacity: 0.62;
  -webkit-filter: saturate(0.65);
          filter: saturate(0.65);
  -webkit-transition: opacity 0.3s ease, -webkit-filter 0.3s ease, -webkit-transform 0.3s ease;
  transition: opacity 0.3s ease, -webkit-filter 0.3s ease, -webkit-transform 0.3s ease;
  transition: opacity 0.3s ease, filter 0.3s ease, transform 0.3s ease;
  transition: opacity 0.3s ease, filter 0.3s ease, transform 0.3s ease, -webkit-filter 0.3s ease, -webkit-transform 0.3s ease;
}
.project .pbm__navBox-btn a {
  display: block;
  border-radius: 14px;
  outline: none;
}
.project .pbm__navBox-btn a:focus-visible {
  -webkit-box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.9), 0 0 0 6px rgba(100, 125, 206, 0.65);
          box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.9), 0 0 0 6px rgba(100, 125, 206, 0.65);
}
.project .pbm__navBox-btn img {
  display: block;
  width: 100%;
  height: auto;
  -webkit-transition: -webkit-filter 0.3s ease;
  transition: -webkit-filter 0.3s ease;
  transition: filter 0.3s ease;
  transition: filter 0.3s ease, -webkit-filter 0.3s ease;
}
.project .pbm__navBox-btn:hover {
  opacity: 0.9;
  -webkit-filter: saturate(0.9);
          filter: saturate(0.9);
  -webkit-transform: translateY(-3px);
          transform: translateY(-3px);
}
.project .pbm__navBox-btn.active {
  opacity: 1;
  -webkit-filter: saturate(1);
          filter: saturate(1);
  -webkit-transform: scale(1.05);
          transform: scale(1.05);
}
.project .pbm__navBox-btn.active img {
  -webkit-filter: drop-shadow(0 0 8px rgba(255, 255, 255, 0.92)) drop-shadow(0 0 14px rgba(103, 135, 224, 0.65));
          filter: drop-shadow(0 0 8px rgba(255, 255, 255, 0.92)) drop-shadow(0 0 14px rgba(103, 135, 224, 0.65));
}
.project .pbm__mainBox {
  position: relative;
  width: 100%;
  aspect-ratio: 1200/945;
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
}
.project .pbm__mainBox-img {
  position: absolute;
  inset: 0;
  opacity: 1;
  -webkit-transition: opacity 0.4s ease, -webkit-filter 0.4s ease;
  transition: opacity 0.4s ease, -webkit-filter 0.4s ease;
  transition: opacity 0.4s ease, filter 0.4s ease;
  transition: opacity 0.4s ease, filter 0.4s ease, -webkit-filter 0.4s ease;
}
.project .pbm__mainBox-img picture,
.project .pbm__mainBox-img img {
  display: block;
  width: 100%;
  height: 100%;
}
.project .pbm__mainBox-img img {
  -o-object-fit: contain;
     object-fit: contain;
}
.project .pbm__mainBox-img.is-hidden {
  opacity: 0;
  pointer-events: none;
}
.project .pbm__mainBox-img.glow-white {
  -webkit-animation: pbmGlowWhite 1.8s ease-in-out 0s infinite both;
          animation: pbmGlowWhite 1.8s ease-in-out 0s infinite both;
}
.project .pbm__mainBox-img.glow-blue {
  -webkit-animation: pbmGlowBlue 1.8s ease-in-out 0s infinite both;
          animation: pbmGlowBlue 1.8s ease-in-out 0s infinite both;
}
.project .pbm__mainBox.is-advanced .pbm__mainBox-img.glow-white {
  -webkit-animation: pbmGlowWhiteAlt 3.6s ease-in-out 0s infinite both;
          animation: pbmGlowWhiteAlt 3.6s ease-in-out 0s infinite both;
}
.project .pbm__mainBox.is-advanced .pbm__mainBox-img.glow-blue {
  -webkit-animation: pbmGlowBlueAlt 3.6s ease-in-out 0s infinite both;
          animation: pbmGlowBlueAlt 3.6s ease-in-out 0s infinite both;
}
.project .pbm__mainBox-cooling {
  z-index: 6;
}
.project .pbm__mainBox-mb {
  z-index: 4;
}
.project .pbm__mainBox-vga {
  z-index: 5;
}
.project .pbm__mainBox-case {
  z-index: 1;
}
.project .pbm__mainBox-ssd {
  z-index: 3;
}
.project .pbm__mainBox-psu {
  z-index: 2;
}
.project .pbm__mainBox-shadow {
  z-index: 0;
  -webkit-animation: none;
          animation: none;
}
.project .pbm__contBox {
  position: relative;
  min-height: 210px;
  -webkit-box-ordinal-group: 4;
      -ms-flex-order: 3;
          order: 3;
}
.project .pbm__txtBox {
  position: absolute;
  inset: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 8%;
  border-radius: 22px;
  text-align: center;
  opacity: 0;
  visibility: hidden;
  -webkit-transform: translateY(12px) scale(0.97);
          transform: translateY(12px) scale(0.97);
  background: linear-gradient(145deg, rgba(117, 93, 205, 0.88) 0%, rgba(78, 123, 216, 0.86) 56%, rgba(103, 153, 234, 0.82) 100%);
  border: 1px solid rgba(233, 239, 255, 0.8);
  -webkit-box-shadow: 0 15px 35px rgba(77, 91, 180, 0.28), 0 0 24px rgba(126, 151, 235, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.42);
          box-shadow: 0 15px 35px rgba(77, 91, 180, 0.28), 0 0 24px rgba(126, 151, 235, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.42);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  -webkit-transition: opacity 0.35s ease, visibility 0.35s ease, -webkit-transform 0.35s ease;
  transition: opacity 0.35s ease, visibility 0.35s ease, -webkit-transform 0.35s ease;
  transition: opacity 0.35s ease, visibility 0.35s ease, transform 0.35s ease;
  transition: opacity 0.35s ease, visibility 0.35s ease, transform 0.35s ease, -webkit-transform 0.35s ease;
}
.project .pbm__txtBox.active {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translateY(0) scale(1);
          transform: translateY(0) scale(1);
}
.project .pbm__txtBox[data-pbm-content=ultimate] {
  background: linear-gradient(135deg, #b3171c 0%, #ec2129 100%);
  -webkit-box-shadow: 0 15px 35px rgba(179, 23, 28, 0.28), 0 0 24px rgba(236, 33, 41, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.3);
          box-shadow: 0 15px 35px rgba(179, 23, 28, 0.28), 0 0 24px rgba(236, 33, 41, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.3);
}
.project .pbm__txtBox[data-pbm-content=advanced] {
  background: linear-gradient(135deg, #1367b2 0%, #0eaaed 100%);
  -webkit-box-shadow: 0 15px 35px rgba(19, 103, 178, 0.28), 0 0 24px rgba(14, 170, 237, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.3);
          box-shadow: 0 15px 35px rgba(19, 103, 178, 0.28), 0 0 24px rgba(14, 170, 237, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.3);
}
.project .pbm__txtBox[data-pbm-content=essential] {
  background: linear-gradient(135deg, #8f9299 0%, #b8bbc2 100%);
  border-color: rgba(255, 255, 255, 0.88);
  -webkit-box-shadow: 0 15px 35px rgba(76, 82, 96, 0.24), 0 0 24px rgba(184, 187, 194, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.4);
          box-shadow: 0 15px 35px rgba(76, 82, 96, 0.24), 0 0 24px rgba(184, 187, 194, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.4);
}
.project .pbm__txtBox[data-pbm-content=essential] h4,
.project .pbm__txtBox[data-pbm-content=essential] p {
  color: #ffffff;
  text-shadow: 0 1px 2px rgba(50, 54, 64, 0.45), 0 0 8px rgba(255, 255, 255, 0.2);
}
.project .pbm__txtBox h4 {
  color: #ffffff;
  font-size: clamp(18px, 4.5vw, 24px);
  font-weight: 800;
  line-height: 1.35;
  margin: 0 0 0.8em;
  text-shadow: 0 0 12px rgba(255, 255, 255, 0.35), 0 2px 3px rgba(47, 42, 120, 0.35);
}
.project .pbm__txtBox p {
  color: rgba(255, 255, 255, 0.92);
  font-size: clamp(14px, 3.6vw, 18px);
  font-weight: 500;
  line-height: 1.5;
  margin: 0;
}
@media (min-width: 768px) {
  .project .pbm {
    padding: 8% 0 9%;
  }
  .project .pbm__title {
    margin-bottom: 5%;
  }
  .project .pbm__title h2 {
    color: #222b37;
    font-size: clamp(28px, 4.2vw, 36px);
  }
  .project .pbm__title p {
    color: #2c2c2c;
    font-size: clamp(15px, 2.2vw, 18px);
  }
  .project .pbm__txtBox {
    padding: 6% 7%;
  }
}
@media (min-width: 996px) {
  .project .pbm {
    padding: 5% 0 7%;
  }
  .project .pbm__title {
    max-width: 1200px;
    margin-bottom: 3.5%;
  }
  .project .pbm__title h2 {
    color: #222b37;
    font-size: 2.3vw;
  }
  .project .pbm__title p {
    color: #2c2c2c;
    font-size: 1.2vw;
  }
  .project .pbm__wrapBox {
    grid-template-columns: 18% 52% 26%;
    gap: 2%;
  }
  .project .pbm__navBox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 1.2vw;
  }
  .project .pbm__navBox-btn {
    width: 100%;
  }
  .project .pbm__navBox-btn.active {
    -webkit-transform: translateX(7px) scale(1.04);
            transform: translateX(7px) scale(1.04);
  }
  .project .pbm__mainBox {
    grid-column: 2;
    grid-row: 1;
  }
  .project .pbm__contBox {
    grid-column: 3;
    grid-row: 1;
    min-height: 0;
    height: 58%;
  }
  .project .pbm__txtBox {
    padding: 9%;
  }
  .project .pbm__txtBox h4 {
    color: #ffffff;
    font-size: 1.35vw;
  }
  .project .pbm__txtBox p {
    color: rgba(255, 255, 255, 0.92);
    font-size: 1.05vw;
  }
}
@media (min-width: 1600px) {
  .project .pbm__title h2 {
    font-size: 2.1rem;
  }
  .project .pbm__title p {
    font-size: 1.2rem;
  }
  .project .pbm__txtBox h4 {
    font-size: 1.4rem;
  }
  .project .pbm__txtBox p {
    font-size: 1.05rem;
  }
}
@media (prefers-reduced-motion: reduce) {
  .project .pbm__mainBox-img {
    -webkit-animation: none !important;
            animation: none !important;
  }
  .project .pbm__navBox-btn, .project .pbm__txtBox {
    -webkit-transition: none;
    transition: none;
  }
}
.project .model {
  position: relative;
  padding: 10% 0 12%;
  background: -webkit-gradient(linear, left top, left bottom, from(#eef4ff), color-stop(35%, #e4ecfb), color-stop(70%, #dce6f8), to(#e8eefc));
  background: linear-gradient(180deg, #eef4ff 0%, #e4ecfb 35%, #dce6f8 70%, #e8eefc 100%);
}
.project .model__title {
  text-align: center;
  margin-bottom: 6%;
}
.project .model__title h2 {
  color: #222b37;
  font-size: clamp(22px, 5.5vw, 32px);
  font-weight: 700;
  margin: 0;
  line-height: 1.3;
}
.project .model__flexBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 6% 4%;
}
.project .model__itemBox {
  width: 48%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  gap: 4%;
  margin: 5% 0;
}
.project .model__itemBox-img {
  width: 100%;
  aspect-ratio: 1/1;
  overflow: hidden;
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.7) 0%, rgba(200, 214, 245, 0.55) 50%, rgba(180, 190, 230, 0.45) 100%);
  border: 1px solid rgba(255, 255, 255, 0.75);
  -webkit-box-shadow: 0 8px 24px rgba(100, 125, 206, 0.18);
          box-shadow: 0 8px 24px rgba(100, 125, 206, 0.18);
  padding: 25px;
}
.project .model__itemBox-img img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 16px;
}
.project .model__itemBox-link {
  width: 100%;
  margin-top: 4%;
  text-align: center;
}
.project .model__itemBox-link a {
  display: inline-block;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-decoration: none;
  text-align: center;
  padding: 0.5em 1em;
  border-radius: 50px;
  color: #647dce;
  text-shadow: 0 0 8px rgba(255, 255, 255, 0.95), 0 0 16px rgba(180, 205, 255, 0.85), 0 1px 0 rgba(255, 255, 255, 0.7);
  background-color: rgba(100, 125, 206, 0.55);
  background-image: url(https://storage-asset.msi.com/event/2026/it/pbm-il-gioco-inizia-ora/images/kv-date-bg.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  border: 1px solid rgba(255, 255, 255, 0.75);
  -webkit-box-shadow: 0 0 16px rgba(100, 125, 206, 0.5), 0 4px 16px rgba(74, 130, 240, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.55);
          box-shadow: 0 0 16px rgba(100, 125, 206, 0.5), 0 4px 16px rgba(74, 130, 240, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.55);
  -webkit-transition: -webkit-transform 0.25s ease, -webkit-box-shadow 0.25s ease, -webkit-filter 0.25s ease;
  transition: -webkit-transform 0.25s ease, -webkit-box-shadow 0.25s ease, -webkit-filter 0.25s ease;
  transition: transform 0.25s ease, box-shadow 0.25s ease, filter 0.25s ease;
  transition: transform 0.25s ease, box-shadow 0.25s ease, filter 0.25s ease, -webkit-transform 0.25s ease, -webkit-box-shadow 0.25s ease, -webkit-filter 0.25s ease;
}
.project .model__itemBox-link a:hover {
  -webkit-transform: translateY(-2px);
          transform: translateY(-2px);
  -webkit-filter: brightness(1.06);
          filter: brightness(1.06);
  -webkit-box-shadow: 0 0 22px rgba(120, 150, 255, 0.7), 0 6px 22px rgba(74, 130, 240, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.7);
          box-shadow: 0 0 22px rgba(120, 150, 255, 0.7), 0 6px 22px rgba(74, 130, 240, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.7);
}
.project .model__itemBox-link a {
  font-size: clamp(16px, 3.8vw, 18px);
}
@media (min-width: 768px) {
  .project .model {
    padding: 7% 0 9%;
  }
  .project .model__title {
    margin-bottom: 5%;
  }
  .project .model__title h2 {
    color: #222b37;
    font-size: clamp(26px, 3.5vw, 36px);
  }
  .project .model__flexBox {
    gap: 5% 3.5%;
  }
  .project .model__itemBox {
    width: 48.25%;
  }
  .project .model__itemBox-img {
    border-radius: 18px;
  }
  .project .model__itemBox-img img {
    border-radius: 18px;
  }
  .project .model__itemBox-link a {
    font-size: clamp(17px, 2.2vw, 19px);
    padding: 0.9em 1.8em;
  }
}
@media (min-width: 996px) {
  .project .model {
    padding: 5% 0 7%;
  }
  .project .model__title {
    margin-bottom: 4%;
  }
  .project .model__title h2 {
    color: #222b37;
    font-size: 2vw;
  }
  .project .model__flexBox {
    gap: 4% 2.5%;
  }
  .project .model__itemBox {
    width: 23.125%;
    margin: 2% 0;
  }
  .project .model__itemBox-img {
    border-radius: 20px;
  }
  .project .model__itemBox-img img {
    border-radius: 20px;
  }
  .project .model__itemBox-link a {
    font-size: 1.15vw;
    padding: 0.5em 1em;
    width: 100%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
}
@media (min-width: 1600px) {
  .project .model__title h2 {
    color: #222b37;
    font-size: 1.8vw;
  }
  .project .model__itemBox-link a {
    font-size: 1.4rem;
  }
}
@media (min-width: 1930px) {
  .project .model__title h2 {
    font-size: 36px;
  }
  .project .model__itemBox-link a {
    font-size: 22px;
  }
}
.project .wtb {
  position: relative;
  padding: 10% 0 12%;
  background: -webkit-gradient(linear, left top, left bottom, from(#eef4ff), color-stop(35%, #e4ecfb), color-stop(70%, #dce6f8), to(#e8eefc));
  background: linear-gradient(180deg, #eef4ff 0%, #e4ecfb 35%, #dce6f8 70%, #e8eefc 100%);
}
.project .wtb__title {
  text-align: center;
  margin-bottom: 6%;
}
.project .wtb__title h2 {
  color: #222b37;
  font-size: clamp(22px, 5.5vw, 32px);
  font-weight: 700;
  margin: 0;
  line-height: 1.3;
}
@media (min-width: 768px) {
  .project .wtb {
    padding: 7% 0 9%;
  }
  .project .wtb__title {
    margin-bottom: 5%;
  }
  .project .wtb__title h2 {
    color: #222b37;
    font-size: clamp(26px, 3.5vw, 36px);
  }
}
@media (min-width: 996px) {
  .project .wtb {
    padding: 5% 0 7%;
  }
  .project .wtb__title {
    margin-bottom: 4%;
  }
  .project .wtb__title h2 {
    color: #222b37;
    font-size: 2vw;
  }
}
@media (min-width: 1600px) {
  .project .wtb__title h2 {
    color: #222b37;
    font-size: 1.8vw;
  }
}
@media (min-width: 1930px) {
  .project .wtb__title h2 {
    font-size: 36px;
  }
}
.project .promo {
  position: relative;
  padding: 10% 0 12%;
  background: -webkit-gradient(linear, left top, left bottom, from(#e8eefc), color-stop(35%, #e4ecfb), color-stop(70%, #dce6f8), to(#eef4ff));
  background: linear-gradient(180deg, #e8eefc 0%, #e4ecfb 35%, #dce6f8 70%, #eef4ff 100%);
}
.project .promo__title {
  text-align: center;
  margin-bottom: 6%;
}
.project .promo__title h2 {
  color: #222b37;
  font-size: clamp(22px, 5.5vw, 32px);
  font-weight: 700;
  margin: 0;
  line-height: 1.3;
}
.project .promo__flexBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 5% 3%;
}
.project .promo__itemBox {
  width: 100%;
  overflow: hidden;
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.7) 0%, rgba(200, 214, 245, 0.55) 50%, rgba(180, 190, 230, 0.45) 100%);
  border: 1px solid rgba(255, 255, 255, 0.75);
  -webkit-box-shadow: 0 8px 24px rgba(100, 125, 206, 0.18);
          box-shadow: 0 8px 24px rgba(100, 125, 206, 0.18);
  -webkit-transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
  transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  transition: transform 0.3s ease, box-shadow 0.3s ease, -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
  margin: 3% auto;
}
.project .promo__itemBox a {
  display: block;
  overflow: hidden;
  border-radius: 16px;
}
.project .promo__itemBox img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 16px;
  -webkit-transition: -webkit-transform 0.35s ease;
  transition: -webkit-transform 0.35s ease;
  transition: transform 0.35s ease;
  transition: transform 0.35s ease, -webkit-transform 0.35s ease;
}
.project .promo__itemBox:hover {
  -webkit-transform: translateY(-6px);
          transform: translateY(-6px);
  -webkit-box-shadow: 0 14px 32px rgba(100, 125, 206, 0.32);
          box-shadow: 0 14px 32px rgba(100, 125, 206, 0.32);
}
.project .promo__itemBox:hover img {
  -webkit-transform: scale(1.05);
          transform: scale(1.05);
}
@media (min-width: 768px) {
  .project .promo {
    padding: 8% 0 9%;
  }
  .project .promo__title {
    margin-bottom: 5%;
  }
  .project .promo__title h2 {
    color: #222b37;
    font-size: clamp(24px, 3.5vw, 32px);
  }
}
@media (min-width: 996px) {
  .project .promo {
    padding: 5% 0 7%;
  }
  .project .promo__title {
    margin-bottom: 4%;
  }
  .project .promo__title h2 {
    color: #222b37;
    font-size: 2vw;
  }
  .project .promo__flexBox {
    gap: 3% 2%;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
  }
  .project .promo__itemBox {
    width: 31.999%;
    border-radius: 20px;
    margin: 0;
  }
  .project .promo__itemBox a {
    border-radius: 20px;
  }
  .project .promo__itemBox img {
    border-radius: 20px;
  }
}
@media (min-width: 1600px) {
  .project .promo__title h2 {
    color: #222b37;
    font-size: 1.8vw;
  }
}
@media (min-width: 1930px) {
  .project .promo__title h2 {
    font-size: 36px;
  }
}
.project .popup {
  position: fixed;
  z-index: 110;
  inset: 0;
  display: none;
  overflow-y: auto;
  background: rgba(0, 0, 0, 0.92);
  color: #ffffff;
  font-size: 16px;
  line-height: 1.6;
  text-align: left;
}
.project .popup * {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.project .popup__close {
  position: fixed;
  right: 14px;
  top: 12px;
  z-index: 130;
  display: block;
  width: 40px;
  height: 40px;
  cursor: pointer;
  border: none;
  opacity: 0.9;
  background: linear-gradient(45deg, transparent 46%, #8297e7 46%, #8297e7 54%, transparent 54%), linear-gradient(-45deg, transparent 46%, #8297e7 46%, #8297e7 54%, transparent 54%);
  -webkit-filter: drop-shadow(0 0 5px rgba(104, 137, 224, 0.5));
          filter: drop-shadow(0 0 5px rgba(104, 137, 224, 0.5));
  -webkit-transition: opacity 0.2s ease, -webkit-transform 0.2s ease, -webkit-filter 0.2s ease;
  transition: opacity 0.2s ease, -webkit-transform 0.2s ease, -webkit-filter 0.2s ease;
  transition: opacity 0.2s ease, transform 0.2s ease, filter 0.2s ease;
  transition: opacity 0.2s ease, transform 0.2s ease, filter 0.2s ease, -webkit-transform 0.2s ease, -webkit-filter 0.2s ease;
}
.project .popup__close:hover {
  -webkit-transform: scale(1.06);
          transform: scale(1.06);
  opacity: 1;
  -webkit-filter: brightness(1.15) drop-shadow(0 0 8px rgba(116, 139, 226, 0.75));
          filter: brightness(1.15) drop-shadow(0 0 8px rgba(116, 139, 226, 0.75));
}
.project .popup__wrapper {
  position: relative;
  width: 100%;
  margin: 0;
}
.project .popup__inner {
  position: relative;
  z-index: 5;
  width: 100%;
  max-width: none;
  margin: 64px 0 24px;
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.42);
  border-radius: 0;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.2) 0%, rgba(211, 222, 255, 0.14) 52%, rgba(204, 188, 244, 0.12) 100%);
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.38), 0 20px 48px rgba(10, 19, 45, 0.38);
          box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.38), 0 20px 48px rgba(10, 19, 45, 0.38);
  backdrop-filter: blur(20px) saturate(140%);
  -webkit-backdrop-filter: blur(20px) saturate(140%);
}
.project .popup#popup-howToRedeem {
  padding: 0;
}
.project .popup#popup-howToRedeem .popup__close {
  position: fixed;
  top: 12px;
  right: 14px;
  z-index: 130;
}
.project .popup#popup-howToRedeem > .popup__inner {
  width: 100%;
  max-width: none;
  margin: 56px 0 20px;
  padding: 8px;
  overflow: visible;
  border-radius: 0;
  border-left: none;
  border-right: none;
}
.project .popup#popup-howToRedeem .popup__content {
  max-height: calc(100vh - 170px);
  overflow-x: hidden;
  overflow-y: auto;
  text-align: center;
  padding: 28px 16px 32px;
  border-radius: 12px;
  -webkit-overflow-scrolling: touch;
}
.project .popup#popup-howToRedeem .popup__content::-webkit-scrollbar {
  width: 10px;
  background: rgba(100, 125, 206, 0.3);
}
.project .popup#popup-howToRedeem .popup__content::-webkit-scrollbar-thumb {
  border-radius: 20px;
  background: -webkit-gradient(linear, left top, left bottom, from(#806bd8), to(#5c91df));
  background: linear-gradient(180deg, #806bd8 0%, #5c91df 100%);
}
.project .popup#popup-howToRedeem .powerByMsi__redeem {
  padding: 0;
}
.project .popup#popup-howToRedeem .powerByMsi__step {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 100%;
}
.project .popup#popup-howToRedeem .powerByMsi__step-num {
  width: 100%;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-bottom: 0.55em;
}
.project .popup#popup-howToRedeem .powerByMsi__step-txt {
  width: 100%;
  padding-left: 0;
  text-align: center;
}
.project .popup#popup-howToRedeem .powerByMsi__step-txt h4 {
  text-align: center;
}
.project .popup#popup-howToRedeem .powerByMsi__popupBtn {
  margin: 8% auto 5%;
}
.project .popup#popup-howToRedeem .powerByMsi__popupBtn a {
  width: 100%;
  max-width: 320px;
}
.project .popup#popup-howToRedeem .powerByMsi__note {
  text-align: center;
}
.project .popup.terms > .popup__inner {
  width: 100%;
  max-width: none;
  margin: 64px 0 20px;
  border-radius: 0;
  border-left: none;
  border-right: none;
}
.project .popup.terms .popup__header + .common-subtitle {
  margin-top: 0;
}
.project .popup__header {
  text-align: center;
  margin-bottom: 28px;
}
.project .popup__header h2 {
  color: #222b37;
  font-size: clamp(25px, 6vw, 40px);
  font-weight: 800;
  line-height: 1.5;
  margin: 0;
}
.project .popup__body {
  max-width: 1200px;
  max-height: calc(100vh - 170px);
  margin: 0 auto;
  padding: 30px;
  overflow-y: auto;
  color: #222b37;
  background: none;
  border: none;
  border-radius: 0;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.project .popup__body::-webkit-scrollbar {
  width: 10px;
  background: rgba(100, 125, 206, 0.3);
}
.project .popup__body::-webkit-scrollbar-thumb {
  border-radius: 20px;
  background: -webkit-gradient(linear, left top, left bottom, from(#806bd8), to(#5c91df));
  background: linear-gradient(180deg, #806bd8 0%, #5c91df 100%);
}
.project .popup__body p {
  margin: 0 0 1.1em;
  color: #29344a;
  font-weight: 500;
}
.project .popup__body a {
  color: #647dce;
  font-weight: 700;
  text-decoration: underline;
}
.project .popup__body a:hover {
  text-decoration: none;
}
.project .popup__body ul,
.project .popup__body ol {
  margin: 0 0 1.4em 1.2em;
  padding: 0;
}
.project .popup__body ul li,
.project .popup__body ol li {
  padding: 0.35em 0;
  color: #29344a;
  font-weight: 500;
}
.project .popup__body ul li {
  list-style: disc;
}
.project .popup__body ol li {
  list-style: decimal;
  padding-left: 0.35em;
}
.project .popup__body b {
  color: #91a6ef;
  font-weight: 800;
}
.project .popup__body .terms-point {
  margin: 0 0 1.4em 0;
  padding: 0 0 0 1.6em;
  list-style: upper-roman;
}
.project .popup__body .terms-point > li {
  list-style: upper-roman;
  padding: 0.45em 0;
}
.project .popup__body .terms-tableWrap {
  width: 100%;
  margin: 1em 0 1.4em;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.project .popup__body .terms-table {
  width: 100%;
  min-width: 560px;
  border-collapse: collapse;
  table-layout: fixed;
  color: #29344a;
  font-size: clamp(13px, 3.2vw, 16px);
  font-weight: 500;
  background: rgba(255, 255, 255, 0.55);
  border: 1px solid rgba(100, 125, 206, 0.45);
}
.project .popup__body .terms-table th,
.project .popup__body .terms-table td {
  padding: 0.7em 0.75em;
  border: 1px solid rgba(100, 125, 206, 0.35);
  text-align: left;
  vertical-align: middle;
  word-break: break-word;
  text-align: center;
}
.project .popup__body .terms-table th {
  color: #27344c;
  font-size: clamp(13px, 3.2vw, 16px);
  font-weight: 800;
  background: rgba(100, 125, 206, 0.14);
  letter-spacing: 0.01em;
}
.project .popup__body .terms-table td:last-child {
  text-align: center;
  font-weight: 700;
  width: 12%;
}
.project .popup__body .terms-table a {
  word-break: break-all;
}
.project .popup .common-subtitle {
  color: #27344c;
  font-size: clamp(17px, 3.8vw, 21px);
  display: block;
  max-width: 100%;
  padding: 0 0 0.45em;
  border: none;
  border-bottom: 2px solid rgba(100, 125, 206, 0.48);
  border-radius: 0;
  font-weight: 800;
  margin: 1.5em 0 0.75em;
  color: #27344c;
  background: none;
  -webkit-box-shadow: none;
          box-shadow: none;
  letter-spacing: 0.01em;
}
.project .popup .common-subtitle span {
  display: inline-block;
  padding-left: 0.65em;
  border-left: 4px solid #647dce;
}
.project .popup .common-thirdtitle {
  margin: 0 0 0.75em;
  color: #29344a;
  font-weight: 700;
  line-height: 1.55;
}
.project .popup__content, .project .popup.terms .popup__body {
  position: relative;
  max-width: none;
  padding: 40px 20px;
  color: #222b37;
  background: linear-gradient(145deg, rgba(248, 250, 255, 0.94) 0%, rgba(233, 239, 255, 0.92) 48%, rgba(220, 230, 250, 0.92) 100%);
  border: 1px solid rgba(100, 125, 206, 0.7);
  border-radius: 12px;
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 14px 35px rgba(30, 49, 95, 0.3);
          box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 14px 35px rgba(30, 49, 95, 0.3);
}
.project .popup .powerByMsi__redeem {
  padding: 0 10px;
}
.project .popup .powerByMsi__redeemTitle {
  color: #222b37;
  font-size: clamp(25px, 6vw, 32px);
  font-weight: 700;
  line-height: 1.5;
  margin: 0 0 1em;
  text-align: center;
}
.project .popup .powerByMsi__stepFlex {
  display: block;
}
.project .popup .powerByMsi__step {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding: 0.9em 0;
}
.project .popup .powerByMsi__step + .powerByMsi__step {
  border-top: 1px solid rgba(100, 125, 206, 0.25);
}
.project .popup .powerByMsi__step-num {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 20%;
  margin-bottom: 1em;
  color: #8297e7;
  font-size: clamp(22px, 5.5vw, 32px);
  font-weight: 700;
  line-height: 1.5;
  text-transform: uppercase;
}
.project .popup .powerByMsi__step-txt {
  width: 80%;
  margin-bottom: 1em;
  padding-left: 10px;
  color: #222b37;
  font-size: clamp(15px, 3.6vw, 20px);
  line-height: 1.5;
}
.project .popup .powerByMsi__step-txt h4 {
  color: #222b37;
  font-size: 1em;
  display: block;
  position: relative;
  padding: 0;
  border: none;
  border-radius: 0;
  font-weight: 800;
  font-size: clamp(17px, 1.15vw, 22px);
  line-height: 1.5;
  margin: 0 0 0.75em;
  color: transparent;
  background: -webkit-gradient(linear, left top, right top, from(#343d69), color-stop(58%, #526eb4), to(#6761ad));
  background: linear-gradient(90deg, #343d69 0%, #526eb4 58%, #6761ad 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-box-shadow: none;
          box-shadow: none;
  letter-spacing: 0.015em;
  -webkit-filter: drop-shadow(0 2px 3px rgba(72, 89, 145, 0.14));
          filter: drop-shadow(0 2px 3px rgba(72, 89, 145, 0.14));
}
.project .popup .powerByMsi__step-txt h4 a {
  color: #5d67bd;
  -webkit-text-fill-color: #5d67bd;
  font-weight: 800;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
  -webkit-transition: color 0.2s ease;
  transition: color 0.2s ease;
}
.project .popup .powerByMsi__step-txt h4 a:hover {
  color: #3f77c8;
  text-decoration: none;
}
.project .popup .powerByMsi__step-txt span {
  display: block;
  color: #354158;
  font-weight: 500;
  line-height: 1.6;
}
.project .popup .powerByMsi__popupBtn {
  margin: 2% auto 4%;
  text-align: center;
}
.project .popup .powerByMsi__popupBtn a {
  display: inline-block;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-decoration: none;
  text-align: center;
  padding: 0.5em 1em;
  border-radius: 50px;
  color: #647dce;
  text-shadow: 0 0 8px rgba(255, 255, 255, 0.95), 0 0 16px rgba(180, 205, 255, 0.85), 0 1px 0 rgba(255, 255, 255, 0.7);
  background-color: rgba(100, 125, 206, 0.55);
  background-image: url(https://storage-asset.msi.com/event/2026/it/pbm-il-gioco-inizia-ora/images/kv-date-bg.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  border: 1px solid rgba(255, 255, 255, 0.75);
  -webkit-box-shadow: 0 0 16px rgba(100, 125, 206, 0.5), 0 4px 16px rgba(74, 130, 240, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.55);
          box-shadow: 0 0 16px rgba(100, 125, 206, 0.5), 0 4px 16px rgba(74, 130, 240, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.55);
  -webkit-transition: -webkit-transform 0.25s ease, -webkit-box-shadow 0.25s ease, -webkit-filter 0.25s ease;
  transition: -webkit-transform 0.25s ease, -webkit-box-shadow 0.25s ease, -webkit-filter 0.25s ease;
  transition: transform 0.25s ease, box-shadow 0.25s ease, filter 0.25s ease;
  transition: transform 0.25s ease, box-shadow 0.25s ease, filter 0.25s ease, -webkit-transform 0.25s ease, -webkit-box-shadow 0.25s ease, -webkit-filter 0.25s ease;
}
.project .popup .powerByMsi__popupBtn a:hover {
  -webkit-transform: translateY(-2px);
          transform: translateY(-2px);
  -webkit-filter: brightness(1.06);
          filter: brightness(1.06);
  -webkit-box-shadow: 0 0 22px rgba(120, 150, 255, 0.7), 0 6px 22px rgba(74, 130, 240, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.7);
          box-shadow: 0 0 22px rgba(120, 150, 255, 0.7), 0 6px 22px rgba(74, 130, 240, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.7);
}
.project .popup .powerByMsi__popupBtn a {
  font-size: clamp(16px, 3.8vw, 18px);
}
.project .popup .powerByMsi__note {
  color: #45516a;
  font-size: clamp(12px, 2.8vw, 16px);
  line-height: 1.5;
  margin: 20px 0 1em;
  text-align: center;
}
@media (min-width: 768px) {
  .project .popup__body {
    padding: 40px;
    font-size: 16px;
  }
  .project .popup__content, .project .popup.terms .popup__body {
    padding: 50px 40px;
  }
  .project .popup__close {
    top: 16px;
    right: 22px;
  }
}
@media (min-width: 996px) {
  .project .popup__close {
    top: 18px;
    right: 26px;
  }
  .project .popup__inner {
    width: 94%;
    max-width: 1200px;
    margin: 76px auto 40px;
    padding: 14px;
    border-radius: 18px;
    border: 1px solid rgba(255, 255, 255, 0.42);
  }
  .project .popup__header h2 {
    color: #222b37;
    font-size: 2vw;
  }
  .project .popup__body {
    font-size: 1.05vw;
  }
  .project .popup .common-subtitle {
    color: #647dce;
    font-size: 1.15vw;
  }
  .project .popup#popup-howToRedeem .popup__close {
    top: 18px;
    right: 26px;
  }
  .project .popup#popup-howToRedeem > .popup__inner {
    width: 94%;
    max-width: 1200px;
    margin: 76px auto 40px;
    padding: 14px;
    overflow: visible;
    border-radius: 18px;
    border: 1px solid rgba(255, 255, 255, 0.42);
  }
  .project .popup#popup-howToRedeem .popup__content {
    max-height: calc(100vh - 170px);
    overflow-y: auto;
    text-align: left;
    padding: 50px 54px;
  }
  .project .popup#popup-howToRedeem .powerByMsi__redeem {
    padding: 0 10px;
  }
  .project .popup#popup-howToRedeem .powerByMsi__step {
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
  }
  .project .popup#popup-howToRedeem .powerByMsi__step-num {
    width: 20%;
    margin-bottom: 1em;
  }
  .project .popup#popup-howToRedeem .powerByMsi__step-txt {
    width: 80%;
    padding-left: 10px;
    text-align: left;
  }
  .project .popup#popup-howToRedeem .powerByMsi__step-txt h4 {
    text-align: left;
    font-size: clamp(18px, 1.15vw, 22px);
  }
  .project .popup#popup-howToRedeem .powerByMsi__redeemTitle {
    color: #222b37;
    font-size: 2vw;
  }
  .project .popup#popup-howToRedeem .powerByMsi__popupBtn {
    margin: 2% auto 4%;
  }
  .project .popup#popup-howToRedeem .powerByMsi__popupBtn a {
    width: auto;
    max-width: none;
    font-size: 1.1vw;
  }
  .project .popup.terms > .popup__inner {
    width: 94%;
    max-width: 1200px;
    margin: 76px auto 40px;
    padding: 14px;
    border-radius: 18px;
    border: 1px solid rgba(255, 255, 255, 0.42);
  }
  .project .popup__content, .project .popup.terms .popup__body {
    padding: 50px 54px;
  }
}
@media (min-width: 1930px) {
  .project .popup#popup-howToRedeem .powerByMsi__redeemTitle {
    font-size: 36px;
  }
  .project .popup#popup-howToRedeem .powerByMsi__step-num {
    font-size: 32px;
  }
  .project .popup#popup-howToRedeem .powerByMsi__step-txt {
    font-size: 20px;
  }
  .project .popup#popup-howToRedeem .powerByMsi__step-txt h4 {
    font-size: 22px;
  }
  .project .popup#popup-howToRedeem .powerByMsi__popupBtn a {
    font-size: 22px;
  }
  .project .popup#popup-howToRedeem .powerByMsi__note {
    font-size: 16px;
  }
  .project .popup.terms .popup__header h2 {
    font-size: 36px;
  }
  .project .popup.terms .popup__body {
    font-size: 18px;
  }
  .project .popup.terms .popup__body p,
  .project .popup.terms .popup__body li {
    font-size: 18px;
  }
  .project .popup.terms .common-subtitle {
    font-size: 22px;
  }
}/*# sourceMappingURL=main.css.map */