/* =============================================
   Group_Homepage_contact
   기준폭: 1920px  /  기준높이: 273px
   스케일: max(360/1920, min(1, vw/1920))
   중앙 정렬
   ============================================= */

:root {
  --contact-base-w: 1920px;
  --contact-base-h: 273px;
}

/* ── 섹션 래퍼 ── */
.contact {
  position: relative;
  width: 100%;
  margin-top: 100.27px;
  margin-bottom: 100px;
  overflow: hidden;
  background: #F8F8F8;
  height: var(--contact-base-h); /* JS가 scale에 맞춰 덮어씀 */
}

/* ── 1920px 기준 내부 컨테이너 ── */
.contact__inner {
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: -960px;
  width: 1920px;
  height: 273px;
  transform-origin: top center;
}

/* ── 배경 이미지 ──
   Figma: left=1, top=0, size=1919×273
*/
.contact__bg {
  position: absolute;
  left: 1px;
  top: 0;
  width: 1919px;
  height: 273px;
  object-fit: cover;
  object-position: center;
  pointer-events: none;
  z-index: 0;
}

/* ── 어두운 블러 오버레이 ──
   fill: rgba(0,0,0,0.3), backdropFilter: blur(15.975px)
*/
.contact__overlay {
  position: absolute;
  left: 0;
  top: 0;
  width: 1920px;
  height: 273px;
  background: rgba(0, 0, 0, 0.3);
/*
  backdrop-filter: blur(15.975px);
  -webkit-backdrop-filter: blur(15.975px);
*/
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);

  pointer-events: none;
  z-index: 1;
}

/* ── 헤딩 텍스트 ──
   Figma: x=795, y=79, w=332, h=31
   A2Z 600 26px, #FFFFFF
*/
.contact__heading {
  position: absolute;
  left: 794px;
  top: 79px;
  width: 332px;
  height: 31px;
  font-family: 'A2Z', sans-serif;
  font-weight: 600;
  font-size: 26px;
  line-height: 1.2em;
  letter-spacing: 0em;
  color: #FFFFFF;
  white-space: nowrap;
  z-index: 2;
  pointer-events: none;
}

/* ── 협업 문의하기 버튼 ──
   Figma: x=845.15, y=137.32, w=231.05, h=57.76
   border-radius=31.45px
   fill: linear-gradient(90deg, #31B2FA 0%, #56D8AE 100%)
*/
.contact__btn {
  position: absolute;
  left: 844px;
  top: 137.32px;
  width: 231.05px;
  height: 57.76px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(90deg, rgba(49, 178, 250, 1) 0%, rgba(86, 216, 174, 1) 100%);
  border-radius: 31.45px;
  border: none;
  cursor: pointer;
  z-index: 2;
  transition: opacity 0.2s ease;
}

.contact__btn:hover {
  opacity: 0.85;
}

/* ── 버튼 텍스트 ──
   A2Z 700 18px, #FFFFFF
*/
.contact__btn-text {
  font-family: 'A2Z', sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 1.2em;
  letter-spacing: -0.05em;
  color: #FFFFFF;
  white-space: nowrap;
}
