/* ==================================================
   CONTACT PAGE — ULTRA MARKETING / CONVERSION
   ================================================== */

.contact-new{
  position: relative;
  margin: 0px 0 180px;
  color: #111;
  isolation: isolate;
}

/* ===== Head：强转化文案区 ===== */
.contact-new .cn-head{
  max-width: 900px;
  margin-bottom: 110px;
}

.contact-new h2{
  font-size: 58px;
  font-weight: 900;
  margin-bottom: 26px;
  letter-spacing: -0.025em;
  line-height: 1.08;
}

.contact-new p{
  font-size: 18px;
  color: #555;
  line-height: 2;
  max-width: 720px;
}

/* ===== Grid ===== */
.contact-new .cn-grid{
  display: grid;
  grid-template-columns: 0.85fr 1.15fr;
  gap: 90px;
  align-items: stretch;
}

/* ==================================================
   LEFT — 信任 + 压迫感（暗色区）
   ================================================== */
.contact-new .cn-info{
  position: relative;
  background:
          radial-gradient(120% 120% at 0% 0%,
          rgba(255,255,255,.08),
          transparent 60%),
          linear-gradient(180deg,#121212,#0b0b0b);
  color: #fff;
  border-radius: 30px;
  padding: 64px 56px;
  box-shadow:
          0 80px 180px rgba(0,0,0,.55);
  overflow: hidden;
}

/* 红色能量线 */
.contact-new .cn-info::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:4px;
  background: linear-gradient(90deg,
  transparent,
  #ff3b3b,
  var(--color,#d60f0f),
  #ff3b3b,
  transparent);
}

/* subtle moving glow */
.contact-new .cn-info::after{
  content:"";
  position:absolute;
  inset:-40%;
  background:
          radial-gradient(circle at 30% 20%,
          rgba(214,15,15,.12),
          transparent 45%);
  animation: cnGlow 14s linear infinite;
  pointer-events:none;
}

@keyframes cnGlow{
  0%{ transform: translate(0,0); }
  50%{ transform: translate(6%,4%); }
  100%{ transform: translate(0,0); }
}

.contact-new .cn-info li{
  margin-bottom: 40px;
}

.contact-new .cn-info span{
  display:block;
  font-size:12px;
  letter-spacing:.22em;
  color:rgba(255,255,255,.55);
  margin-bottom:14px;
  text-transform:uppercase;
}

.contact-new .cn-info strong,
.contact-new .cn-info a{
  font-size:18px;
  color:#fff;
  text-decoration:none;
}

/* ==================================================
   RIGHT — 转化杀器（表单）
   ================================================== */
.contact-new .cn-form{
  position: relative;
  background:#fff;
  border-radius: 30px;
  padding: 68px 62px;
  box-shadow:
          0 100px 200px rgba(0,0,0,.22);
  overflow: hidden;
}

/* 顶部 CTA 红条 */
.contact-new .cn-form::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:8px;
  background: linear-gradient(90deg,
  #ff2f2f,
  var(--color,#d60f0f));
}

/* 右侧红色吸引光 */
.contact-new .cn-form::after{
  content:"";
  position:absolute;
  inset:-40%;
  background:
          radial-gradient(circle at 90% 10%,
          rgba(214,15,15,.18),
          transparent 45%);
  pointer-events:none;
}

/* Form */
.contact-new .cn-form form{
  display:grid;
  gap:22px;
}

.contact-new input,
.contact-new textarea{
  width:100%;
  padding:20px 22px;
  border:1px solid #e3e3e3;
  border-radius:16px;
  font-size:15px;
  background:#fafafa;
  transition:
          border-color .2s ease,
          box-shadow .2s ease,
          background .2s ease,
          transform .15s ease;
}

.contact-new input::placeholder,
.contact-new textarea::placeholder{
  color:#aaa;
}

.contact-new input:focus,
.contact-new textarea:focus{
  background:#fff;
  border-color:var(--color,#d60f0f);
  box-shadow:0 0 0 8px rgba(214,15,15,.18);
  outline:none;
}

.contact-new input:hover,
.contact-new textarea:hover{
  transform: translateY(-2px);
}

.contact-new textarea{
  min-height:200px;
}

/* ===== CTA 按钮（终极） ===== */
.contact-new button{
  margin-top:26px;
  padding:22px;
  background:
          linear-gradient(90deg,
          #ff2a2a,
          var(--color,#d60f0f));
  color:#fff;
  border:none;
  border-radius:18px;
  font-size:16px;
  font-weight:900;
  letter-spacing:.08em;
  cursor:pointer;
  text-transform:uppercase;
  box-shadow:
          0 24px 0 rgba(0,0,0,.15),
          0 40px 80px rgba(214,15,15,.55);
  transition:
          transform .18s ease,
          box-shadow .18s ease;
}

.contact-new button:hover{
  transform: translateY(-4px);
  box-shadow:
          0 18px 0 rgba(0,0,0,.18),
          0 50px 120px rgba(214,15,15,.65);
}

.contact-new button:active{
  transform: translateY(0);
  box-shadow:
          0 10px 0 rgba(0,0,0,.22),
          0 20px 40px rgba(214,15,15,.45);
}

/* ==================================================
   Mobile
   ================================================== */
@media (max-width: 768px){
  .contact-new{
    margin: 80px 0 150px;
  }
  .contact-new h2{
    font-size:40px;
  }
  .contact-new .cn-grid{
    grid-template-columns:1fr;
    gap:64px;
  }
}
