/* Entrée éditoriale vers la capsule Signature Japon depuis l'accueil. */
.home-edition {
  position: relative;
  overflow: hidden;
  padding: 118px 0;
  background: radial-gradient(circle at 77% 38%, rgba(49, 85, 235, .28), transparent 27%), #050608;
  isolation: isolate;
}

.home-edition__grid {
  position: absolute;
  z-index: -1;
  inset: 0;
  opacity: .34;
  background-image: linear-gradient(rgba(126, 146, 255, .14) 1px, transparent 1px), linear-gradient(90deg, rgba(126, 146, 255, .14) 1px, transparent 1px);
  background-size: 62px 62px;
  mask-image: linear-gradient(90deg, #000, transparent 80%);
}

.home-edition__inner {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(380px, 1.1fr);
  align-items: center;
  gap: clamp(45px, 8vw, 135px);
}

.home-edition__visual {
  position: relative;
  height: min(68vw, 720px);
  margin: 0;
  padding: 20px;
  overflow: hidden;
  border: 1px solid rgba(126, 147, 255, .48);
  background: #111522;
}

.home-edition__visual::after {
  position: absolute;
  inset: 0;
  content: "";
  background: linear-gradient(0deg, rgba(3, 5, 9, .72), transparent 44%);
  pointer-events: none;
}

.home-edition__visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: contrast(1.08) saturate(.76);
  transition: transform .9s cubic-bezier(.2, .8, .2, 1), filter .5s;
}

.home-edition__visual:hover img {
  filter: contrast(1.1) saturate(.92);
  transform: scale(1.035);
}

.home-edition__visual > span,
.home-edition__visual figcaption {
  position: absolute;
  z-index: 2;
  color: #dce4ff;
  font: 500 .55rem/1.55 var(--mono);
  letter-spacing: .13em;
}

.home-edition__visual > span {
  top: 34px;
  left: 35px;
  writing-mode: vertical-rl;
}

.home-edition__visual figcaption {
  right: 34px;
  bottom: 31px;
  text-align: right;
}

.home-edition__copy {
  max-width: 650px;
}

.home-edition__copy .section-index {
  color: #bac7ff;
}

.home-edition__label {
  width: max-content;
  margin: 25px 0 31px;
  padding: 8px 11px;
  border: 1px solid rgba(147, 166, 255, .72);
  color: #e1e6ff;
  background: rgba(49, 85, 235, .13);
  font: 500 .54rem var(--mono);
  letter-spacing: .14em;
}

.home-edition h2 {
  margin: 0;
  font: 700 clamp(4rem, 8.1vw, 9.5rem)/.7 var(--display);
  letter-spacing: -.125em;
}

.home-edition h2 span {
  color: #8297ff;
  font-family: serif;
  font-weight: 400;
  letter-spacing: -.07em;
}

.home-edition__copy > p:not(.section-index, .home-edition__label) {
  max-width: 410px;
  margin: 34px 0 31px;
  color: #b7bebb;
  font-size: .83rem;
  line-height: 1.85;
}

.home-edition .button {
  width: min(100%, 315px);
  border-color: #dce4ff;
  color: #090b12;
  background: #dce4ff;
}

.home-edition .button:hover {
  color: #fff;
  background: #3155eb;
}

@media (max-width: 900px) {
  .home-edition__inner {
    grid-template-columns: 1fr;
  }

  .home-edition__visual {
    width: min(78%, 570px);
    height: 700px;
  }
}

@media (max-width: 600px) {
  .home-edition {
    padding: 82px 0;
  }

  .home-edition__grid {
    background-size: 42px 42px;
  }

  .home-edition__inner {
    gap: 44px;
  }

  .home-edition__visual {
    width: 100%;
    height: 113vw;
    max-height: 500px;
    padding: 11px;
  }

  .home-edition__visual > span {
    top: 23px;
    left: 23px;
  }

  .home-edition__visual figcaption {
    right: 22px;
    bottom: 20px;
    font-size: .46rem;
  }

  .home-edition__label {
    margin: 20px 0 25px;
  }

  .home-edition h2 {
    font-size: 17vw;
  }

  .home-edition__copy > p:not(.section-index, .home-edition__label) {
    margin: 27px 0 26px;
    font-size: .76rem;
  }

  .home-edition .button {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-edition__visual img {
    transition: none;
  }
}
