/**
 * Join Newsletter V2
 * Figma: 1642:2940 / 1642:2479 / 1642:2708
 * 基准 16 = 1rem；禁止像素单位
 */

.v2-nl-page {
  background: #eeeeee;
}

.v2-nl-page h1,
.v2-nl-page p {
  margin: 0;
}

/* 高度随卡片，不撑满剩余视口；头底→卡片 80；卡片底→footer 100 */
.v2-nl-hero {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 5rem 0 6.25rem;
  background-image: linear-gradient(-74.38deg, #f2f8fd 0%, #aaddff 93.956%);
}

.v2-nl-card {
  box-sizing: border-box;
  display: flex;
  width: 100%;
  max-width: 95rem; /* 1520 */
  height: 33.125rem; /* 530 */
  background: #ffffff;
  border-radius: 1.25rem; /* 20 */
  box-shadow: 0 0 0.9375rem 0 rgba(34, 50, 72, 0.1); /* 15 */
  overflow: hidden;
}

.v2-nl-copy {
  box-sizing: border-box;
  flex: 0 0 47.5rem; /* 760 */
  width: 47.5rem;
  height: 33.125rem;
  padding: 3.3125rem 3.75rem; /* 53 60 */
}

.v2-nl-title {
  display: block;
  margin: 0 0 .25rem 0!important;
  padding: 0;
  font-family: "Gotham-Bold", sans-serif;
  font-size: 2.75rem; /* 44 */
  line-height: 3.25rem; /* 52 */
  font-weight: normal;
  color: #1d1d1f;
}

.v2-nl-desc {
  margin: 0.25rem 0 0; /* 标题底 → 副文 4 */
  padding: 0;
  width: 40rem; /* 640 */
  font-family: "Gotham-Book", sans-serif;
  font-size: 1.375rem; /* 22 */
  line-height: 1.625rem; /* 26 */
  font-weight: normal;
  color: #323232;
}

.v2-nl-form {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin: 0;
  padding: 0;
}

.v2-nl-label {
  display: block;
  margin: 2.0625rem 0 0; /* 副文底 → 标签 33 */
  padding: 0;
  font-family: "Gotham-Bold", sans-serif;
  font-size: 1.375rem; /* 22 */
  line-height: 1.625rem; /* 26 */
  font-weight: normal;
  color: #1d1d1f;
}

.v2-nl-input {
  box-sizing: border-box;
  display: block;
  width: 40rem; /* 640 */
  height: 2.875rem; /* 46 */
  margin: 0.875rem 0 0; /* 标签底 → 输入 14；底边距 0，与法律说明的 27 不叠加 */
  padding: 0 1.25rem; /* 20 */
  border: 0.09375rem solid transparent; /* 1.5，默认不可见，避免三态撑高 */
  border-radius: 0.375rem; /* 6 */
  background: #f5f5f7;
  font-family: "Gotham-Medium", sans-serif;
  font-size: 1.125rem; /* 18 */
  line-height: 1.375rem; /* 22 */
  font-weight: normal;
  color: #323232;
  outline: none;
}

.v2-nl-input::-webkit-input-placeholder {
  font-family: "Gotham-Medium", sans-serif;
  font-size: 1.125rem;
  line-height: 1.375rem;
  font-weight: normal;
  color: #8f9fb1;
}

.v2-nl-input::-moz-placeholder {
  font-family: "Gotham-Medium", sans-serif;
  font-size: 1.125rem;
  line-height: 1.375rem;
  font-weight: normal;
  color: #8f9fb1;
  opacity: 1;
}

.v2-nl-input:-ms-input-placeholder {
  font-family: "Gotham-Medium", sans-serif;
  font-size: 1.125rem;
  line-height: 1.375rem;
  font-weight: normal;
  color: #8f9fb1;
}

.v2-nl-input.is-focus,
.v2-nl-input:focus {
  background: #effffd;
  border-color: #009cff;
  color: #323232;
}

.v2-nl-input.is-error {
  background: #fdeeea;
  border-color: #ea522a;
  color: #ea522a;
}

.v2-nl-input.is-error::-webkit-input-placeholder {
  color: #ea522a;
}

.v2-nl-input.is-error::-moz-placeholder {
  color: #ea522a;
  opacity: 1;
}

.v2-nl-input.is-error:-ms-input-placeholder {
  color: #ea522a;
}

.v2-nl-page .v2-nl-legal {
  margin: 1.6875rem 0 0; /* 输入底 → 法律说明 27 */
  padding: 0;
  width: 40rem; /* 640 */
  font-family: "Gotham-Book", sans-serif;
  font-size: 1.125rem; /* 18 */
  line-height: 1.375rem; /* 22 */
  font-weight: normal;
  color: #323232;
}

/* 交互对齐 header_v2 CONTACT：139deg 底 + hover/active 伪层 */
.v2-nl-submit {
  position: relative;
  z-index: 1;
  box-sizing: border-box;
  display: inline-block;
  width: 11.0625rem; /* 177 */
  height: 2.5rem; /* 40 */
  margin: 2.3125rem 0 0; /* 法律说明底 → 按钮 37 */
  padding: 0;
  border: 0;
  border-radius: 1.25rem; /* 40 高胶囊，与 CONTACT 18/36 同为半高圆角 */
  background: linear-gradient(139deg, #0c88d7 0%, #64d79b 100%);
  box-shadow: 0.125rem 0.0625rem 0.3125rem 0 rgba(0, 74, 131, 0.3);
  font-family: "Gotham-Medium", sans-serif;
  font-size: 1.125rem; /* 18 */
  line-height: 1.375rem; /* 22 */
  font-weight: normal;
  color: #ffffff;
  text-align: center;
  cursor: pointer;
  transition: box-shadow 0.3s ease, color 0.3s ease;
}

.v2-nl-submit::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border-radius: inherit;
  background: linear-gradient(139deg, #6dc6ff 0%, #adffd4 100%);
  z-index: -1;
  opacity: 0;
  transition: opacity 0.4s ease;
}

.v2-nl-submit::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border-radius: inherit;
  background: linear-gradient(139deg, #034ea6 0%, #3bc877 100%);
  z-index: -1;
  opacity: 0;
  transition: opacity 0.1s ease;
}

.v2-nl-submit:hover::before {
  opacity: 1;
}

.v2-nl-submit:hover,
.v2-nl-submit:focus {
  font-family: "Gotham-Medium", sans-serif;
  font-size: 1.125rem;
  line-height: 1.375rem;
  color: #ffffff;
}

.v2-nl-submit:hover::after {
  opacity: 0;
}

.v2-nl-submit:active::after {
  opacity: 1;
}

.v2-nl-submit:active {
  font-family: "Gotham-Medium", sans-serif;
  font-size: 1.125rem;
  line-height: 1.375rem;
  color: #ffffff;
}

.v2-nl-media {
  flex: 0 0 47.5rem; /* 760 */
  width: 47.5rem;
  height: 33.125rem;
  overflow: hidden;
  border-radius: 0 1.25rem 1.25rem 0;
}

.v2-nl-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* 提交成功 Figma 2129:14 / 图标 2129:266。左栏绝对定位对齐卡片内坐标 */
.v2-nl-success {
  display: none;
  position: relative;
  box-sizing: border-box;
  flex: 0 0 47.5rem;
  width: 47.5rem;
  height: 33.125rem;
}

.v2-nl-card.is-success .v2-nl-copy {
  display: none;
}

.v2-nl-card.is-success .v2-nl-success {
  display: block;
}

.v2-nl-page .v2-nl-success-icon {
  position: absolute;
  left: 18.6875rem; /* 299 */
  top: 5.6875rem; /* 91 */
  display: block;
  width: 11.5rem; /* 184 */
  height: 11.25rem; /* 180 */
  object-fit: cover;
}

.v2-nl-page .v2-nl-success-title {
  position: absolute;
  left: 9.1875rem; /* 147 */
  top: 19.125rem; /* 306 */
  margin: 0;
  padding: 0;
  width: 31.4375rem; /* 503 */
  font-family: "Gotham-Bold", sans-serif;
  font-size: 2rem; /* 32 */
  line-height: 2.375rem; /* 38 */
  font-weight: normal;
  color: #1d1d1f;
  white-space: nowrap;
  text-align: center;
}

.v2-nl-page .v2-nl-success-desc {
  position: absolute;
  left: 12.625rem; /* 202 */
  top: 22rem; /* 352 */
  margin: 0;
  padding: 0;
  width: 24.5625rem; /* 393 */
  font-family: "Gotham-Book", sans-serif;
  font-size: 1.25rem; /* 20 */
  line-height: 1.5rem; /* 24，两行共 48 */
  font-weight: normal;
  color: #323232;
  text-align: center;
}

@media (max-width: 95rem) {
  .v2-nl-hero {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }

  .v2-nl-card {
    height: auto;
    min-height: 33.125rem;
  }

  .v2-nl-copy,
  .v2-nl-media,
  .v2-nl-success {
    flex: 1 1 50%;
    width: auto;
    height: auto;
    min-height: 33.125rem;
  }

  .v2-nl-card.is-success .v2-nl-success {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2.5rem 1.5rem;
  }

  .v2-nl-page .v2-nl-success-icon,
  .v2-nl-page .v2-nl-success-title,
  .v2-nl-page .v2-nl-success-desc {
    position: static;
  }

  .v2-nl-page .v2-nl-success-title {
    width: auto;
    max-width: 100%;
    margin-top: 2.1875rem; /* 图标底 → 标题 35 */
    white-space: normal;
    text-align: center;
  }

  .v2-nl-page .v2-nl-success-desc {
    width: 100%;
    max-width: 24.5625rem;
    margin-top: 0.5rem; /* 标题底 → 说明 8 */
  }
}

@media (max-width: 48rem) {
  .v2-nl-hero {
    padding: 2.5rem 1.25rem;
  }

  .v2-nl-card {
    flex-direction: column;
    height: auto;
  }

  .v2-nl-copy,
  .v2-nl-media,
  .v2-nl-success {
    flex: 1 1 auto;
    width: 100%;
    height: auto;
  }

  .v2-nl-copy {
    padding: 2.5rem 1.5rem;
  }

  .v2-nl-desc,
  .v2-nl-input,
  .v2-nl-legal {
    width: 100%;
  }

  .v2-nl-media {
    height: 16.25rem;
    border-radius: 0 0 1.25rem 1.25rem;
  }
}
