/* =========================
   CONTACT — Flowverse Tone
========================= */

/* 페이지 전체 배경: About처럼 우주톤 유지 + 자연스러운 깊이감 */
body{
  background:
    radial-gradient(1200px 600px at 12% -180px, rgba(90,169,255,.22) 0%, transparent 60%),
    radial-gradient(900px 520px at 82% 0%, rgba(90,210,255,.12) 0%, transparent 68%),
    linear-gradient(180deg, #0f2b5c 0%, #123a7a 38%, #0b1f49 62%, #060818 100%);
}

/* ===== HERO ===== */
.contact-hero{
  padding: 120px 0 86px;
  text-align:center;
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(700px 340px at 50% 0%, rgba(125,211,252,.22) 0%, transparent 70%),
    linear-gradient(180deg, rgba(30,64,175,.95) 0%, rgba(18,58,122,.92) 70%, rgba(11,31,73,.0) 100%);
  border-bottom: 1px solid rgba(255,255,255,.10);
}

/* HERO → 아래 섹션으로 자연스럽게 페이드 */
.contact-hero::after{
  display:none;
}

.contact-hero .container{ position: relative; z-index: 1; }

.contact-hero__kicker{
  margin: 0 0 12px;
  font-weight: 800;
  color: rgba(255,255,255,.88);
  letter-spacing: .2px;
}

.contact-hero__title{
  margin: 0 0 12px;
  font-size: 56px;
  color: rgba(255,255,255,.98);
  letter-spacing: -0.8px;
  text-shadow: 0 8px 22px rgba(0,0,0,.20);
}

.contact-hero__sub{
  margin: 0;
  color: rgba(255,255,255,.74);
  line-height: 1.7;
}

/* ===== SECTION ===== */
.contact-section{
  padding: 84px 0 120px;
  background:
    radial-gradient(900px 520px at 18% 0%, rgba(120,190,255,.18), transparent 65%),
    radial-gradient(700px 420px at 85% 20%, rgba(190,150,255,.10), transparent 70%),
    linear-gradient(180deg, #0b1f49 0%, #060818 100%);
}

/* ===== GRID ===== */
.contact-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 22px;
  width: min(980px, calc(100% - 40px));
  margin: 0 auto;
}

/* ===== CARD ===== */
.contact-card{
  padding: 42px;
  border-radius: 22px;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.18);
  backdrop-filter: blur(16px);
  box-shadow: 0 20px 60px rgba(0,0,0,.18);
}

.contact-card h3{
  margin: 0 0 14px;
  font-size: 22px;
  letter-spacing: -0.2px;
  color: rgba(255,255,255,.96);
}

.contact-desc{
  margin: 0 0 18px;
  color: rgba(255,255,255,.74);
  line-height: 1.75;
}

/* 이메일 링크 포인트 */
.contact-email{
  display:inline-block;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: .2px;
  color: #7bbaea;
}

.contact-email:hover{
  text-decoration: underline;
}

/* MAP */
.map-wrap{
  margin-top: 14px;
  border-radius: 14px;
  overflow:hidden;
  border: 1px solid rgba(255,255,255,.12);
}
.address-box{
  position: relative;
  padding: 16px 48px 16px 18px;
  border-radius: 14px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.15);
  font-weight: 500;
}

/* 우측 상단 고정 */
.copy-icon{
  position:absolute;
  top:10px;
  right:10px;

  width:32px;
  height:32px;
  border-radius:8px;

  border:1px solid rgba(255,255,255,.2);
  background: rgba(255,255,255,.05);

  color:#fff;
  cursor:pointer;

  display:flex;
  align-items:center;
  justify-content:center;

  transition: all .2s ease;
}

.copy-icon svg{
  width:16px;
  height:16px;
}

.copy-icon:hover{
  background: rgba(255,255,255,.15);
  transform: translateY(-1px);
}
.footer{
  margin-top: 0 !important;
}
/* ===== Responsive ===== */
@media (max-width: 900px){
  .contact-grid{
    grid-template-columns: 1fr;
  }
}