/* =========================
   CONTACT (v2 - cleaner)
   ========================= */

.contact{
  padding: 40px 0 80px;
}

.contact-hero{
  padding: 40px 0 28px;
}

.contact-kicker{
  opacity: .75;
  font-size: 13px;
  letter-spacing: .2px;
  margin: 0 0 10px;
}

.contact-title{
  margin: 0 0 14px;
  font-size: clamp(30px, 4.2vw, 46px);
  line-height: 1.08;
  font-weight: 800;
  color: var(--text-strong);
}

.contact-subtitle{
  margin: 0 0 18px;
  opacity: .9;
  line-height: 1.7;
  font-size: 1.05rem;
  max-width: 72ch;
  color: #cbd5e1;
}

.contact-cta{
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
  margin: 0 0 14px;
}

.contact-note{
  margin: 0;
  opacity: .7;
  font-size: .92rem;
  color: #cbd5e1;
}

/* section */
.contact-section{
  padding: 54px 0;
}

.contact-section--last{
  padding-bottom: 20px;
}

.contact-head{
  margin-bottom: 18px;
}

.contact-head h2{
  margin: 0 0 10px;
  font-size: 2rem;
  color: var(--text-strong);
}

.contact-head p{
  margin: 0;
  opacity: .8;
  font-size: 1.05rem;
}

/* grid */
.contact-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.contact-card{
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
  padding: 18px;
  transition: transform .18s ease, background .18s ease, border-color .18s ease;
}

.contact-card:hover{
  background: rgba(255,255,255,.05);
  border-color: rgba(255,255,255,.12);
  transform: translateY(-1px);
}

.contact-card h3{
  margin: 0 0 8px;
  color: var(--text-strong);
  font-size: 1.12rem;
}

.contact-card p{
  margin: 0 0 12px;
  opacity: .85;
  line-height: 1.6;
  color: #cbd5e1;
}

/* info row (mail chip) */
.contact-chip{
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  padding: 12px;
  display: grid;
  gap: 4px;
  margin-bottom: 12px;
}

.contact-chip__label{
  opacity: .7;
  font-size: 12px;
}

.contact-chip__value{
  color: var(--text-strong);
  font-weight: 650;
  letter-spacing: .2px;
  overflow-wrap: anywhere;
}

/* list */
.contact-list{
  margin: 0 0 12px;
  padding-left: 18px;
  opacity: .85;
  color: #cbd5e1;
  line-height: 1.6;
}

.contact-list li{
  margin: 6px 0;
}

/* actions */
.contact-actions{
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 4px;
}

.btn--sm{
  padding: 10px 14px;
  border-radius: 12px;
  font-size: .95rem;
}

/* template box (less glossy) */
.contact-box{
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
  overflow: hidden;
}

.contact-box__content{
  padding: 18px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.contact-template{
  margin: 0;
  opacity: .9;
  line-height: 1.7;
  color: #cbd5e1;
  word-break: break-word;
}

.contact-box__actions{
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  padding: 16px 18px 18px;
}

/* responsive */
@media (max-width: 980px){
  .contact-grid{
    grid-template-columns: 1fr;
  }
}

/* =========================
   CONTACT - small fixes (add at bottom)
   ========================= */

/* 1) Kartların yüksekliği eşitlensin, butonlar alt hizaya gelsin */
.contact-card{
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* 2) Actions her zaman kartın en altına yaslansın */
.contact-actions{
  margin-top: auto; /* kart içi içerik kısa olsa bile butonları aşağı iter */
}

/* 3) Chip içindeki mail linki anchor olursa aynı görünsün */
.contact-chip__value{
  text-decoration: none;
}
.contact-chip__value:hover{
  opacity: .9;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* 4) Contact template blok "mail taslağı" gibi dursun */
.contact-template{
  white-space: pre-line; /* <br> / satır hissini doğal gösterir */
}

/* 5) CTA satırı mobilde daha düzenli */
@media (max-width: 80px){
  .contact-cta{
    justify-content: center;
  }
  .contact-note{
    text-align: center;
  }
}

/* 6) Hover isteyen kullanıcılar için smooth ama abartısız */
@media (prefers-reduced-motion: reduce){
  .contact-card{
    transition: none;
  }
}