/*
 * İletişim — yeni tasarım (templates/contact-v2.php)
 * Token'lar, şerit/bant, rozet, butonlar ve footer home.css'ten.
 */

/* ---------- giriş ---------- */

.ct2-hero { padding: 48px 0 104px; }
.ct2-hero-grid {
  display: grid; grid-template-columns: minmax(0, 1fr) auto;
  align-items: center; gap: 56px;
}
.ct2-hero .hx-eyebrow { padding-top: 0; }
.ct2-title {
  margin: 18px 0 20px;
  font-weight: 500; font-size: clamp(64px, 11vw, 168px);
  line-height: .9; letter-spacing: -0.055em; color: var(--hx-ink);
}
.ct2-sub { font-size: 20px; color: var(--hx-mute); max-width: 26em; }
.ct2-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 36px; }

/* Anasayfa hero'sundaki döner rozet, burada büyük ve bağımsız. */
.ct2-badge { display: grid; justify-items: center; gap: 22px; }
.hx-ring.ct2-ring {
  position: relative; left: auto; bottom: auto;
  width: 260px; height: 260px;
  border: 1px solid var(--hx-line);
}
.ct2-ring text { font-size: 10px; letter-spacing: .1em; }
.ct2-ring .hx-ring-core { width: 120px; height: 120px; }
.ct2-ring .hx-ring-core img { width: 64px; height: 64px; }
.ct2-badge-stat { display: flex; align-items: baseline; gap: 10px; color: var(--hx-mute); font-size: 15px; }
.ct2-badge-stat strong {
  font-weight: 500; font-size: 56px; line-height: 1; letter-spacing: -0.04em; color: var(--hx-ink);
}

/* ---------- lacivert bantta kanallar ---------- */

.ct2-channels { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
/* .hx-band a (home.css) kartı satır içine yatırıyordu; bant içinde ezilir. */
.hx-band .ct2-channel {
  display: grid; align-content: start; gap: 6px; height: 100%;
  font-size: inherit;
  padding: 26px 24px; border-radius: var(--hx-r-md);
  border: 1px solid var(--hx-line-dark);
  color: var(--hx-on-dark);
  transition: background-color .2s, border-color .2s;
}
a.ct2-channel:hover { color: var(--hx-on-dark); background: rgba(233, 193, 118, .08); border-color: rgba(233, 193, 118, .45); }
.ct2-channel-icon {
  width: 44px; height: 44px; margin-bottom: 14px; border-radius: 50%;
  display: grid; place-items: center;
  background: rgba(233, 193, 118, .12); color: var(--hx-gold);
}
.ct2-channel-label { font-size: 13px; color: var(--hx-on-dark-mute); }
.ct2-channel-value { font-size: 17px; font-weight: 500; color: #fff; overflow-wrap: break-word; }
a.ct2-channel:hover .ct2-channel-value { color: var(--hx-gold); }

/* ---------- form ---------- */

.ct2-form-section { padding: 0 0 120px; scroll-margin-top: 24px; }
.ct2-form-grid {
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: 80px; align-items: start;
}
.ct2-form-intro { position: sticky; top: 40px; }
.ct2-form-intro .hx-eyebrow { padding-top: 0; }
.ct2-form-intro h2 {
  margin: 14px 0 18px;
  font-weight: 500; font-size: clamp(34px, 3.8vw, 52px); line-height: 1.05; letter-spacing: -0.035em;
}
.ct2-form-intro > p { color: var(--hx-mute); max-width: 26em; }
.ct2-socials { margin-top: 40px; padding-top: 28px; border-top: 1px solid var(--hx-line); }
.ct2-socials > p { font-size: 14px; color: var(--hx-mute); margin-bottom: 14px; }
.ct2-socials .hx-socials a { border-color: var(--hx-line); color: var(--hx-ink); }
.ct2-socials .hx-socials a:hover { background: var(--hx-navy); border-color: var(--hx-navy); color: var(--hx-gold); }

.ct2-card {
  padding: 44px; border-radius: var(--hx-r-lg);
  background: var(--hx-mist);
}

.ct2-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 18px; }
.ct2-field { display: grid; gap: 8px; align-content: start; }
.ct2-field--wide { grid-column: 1 / -1; }
.ct2-field label { font-size: 14px; font-weight: 500; color: var(--hx-ink); }
.ct2-req { color: var(--hx-gold-deep); margin-left: 2px; }

.hx .ct2-field input,
.hx .ct2-field select,
.hx .ct2-field textarea {
  width: 100%; padding: 15px 18px;
  border: 1px solid transparent; border-radius: 14px;
  background: var(--hx-paper); color: var(--hx-ink);
  font: 400 16px/1.4 var(--hx-sans);
  box-shadow: 0 0 0 1px var(--hx-line);
  transition: box-shadow .2s;
  -webkit-appearance: none; appearance: none;
}
.hx .ct2-field textarea { resize: vertical; min-height: 150px; }
.hx .ct2-field select {
  padding-right: 44px; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' fill='none' stroke='%230b1329' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 18px center;
}
.hx .ct2-field ::placeholder { color: #98a0b3; }
.hx .ct2-field input:focus,
.hx .ct2-field select:focus,
.hx .ct2-field textarea:focus { outline: none; box-shadow: 0 0 0 2px var(--hx-gold); }
.hx .ct2-field.is-invalid input,
.hx .ct2-field.is-invalid select,
.hx .ct2-field.is-invalid textarea { box-shadow: 0 0 0 2px #c2413a; }
.ct2-error { font-size: 13px; color: #b3372f; }

.ct2-submit-row { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; margin-top: 32px; }
.hx .ct2-submit { border: 0; cursor: pointer; }
.hx .ct2-submit:disabled { opacity: .6; cursor: progress; }
.ct2-note { font-size: 13px; color: var(--hx-mute); }
.ct2-status { margin-top: 18px; padding: 14px 18px; border-radius: 14px; background: #fbeceb; color: #9c2f28; font-size: 14px; }

.ct2-done { display: grid; justify-items: start; gap: 14px; padding: 24px 0; outline: none; }
.ct2-done-icon {
  width: 60px; height: 60px; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--hx-navy); color: var(--hx-gold);
}
.ct2-done h3 { font-size: 28px; font-weight: 500; letter-spacing: -0.02em; }
.ct2-done p { color: var(--hx-mute); }
.ct2-fallback { color: var(--hx-mute); }

/* display kuralları hidden özniteliğini ezmesin. */
.ct2 [hidden] { display: none !important; }

/* ---------- duyarlı ---------- */

@media (max-width: 1080px) {
  .ct2-channels { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
  .ct2-hero { padding: 24px 0 72px; }
  .ct2-hero-grid { grid-template-columns: 1fr; gap: 48px; }
  .ct2-sub { font-size: 18px; }
  .ct2-badge { justify-items: start; grid-template-columns: auto 1fr; align-items: center; }
  .hx-ring.ct2-ring { width: 150px; height: 150px; }
  .ct2-ring .hx-ring-core { width: 66px; height: 66px; }
  .ct2-ring .hx-ring-core img { width: 36px; height: 36px; }
  .ct2-badge-stat { flex-direction: column; gap: 4px; }

  .ct2-form-section { padding-bottom: 80px; }
  .ct2-form-grid { grid-template-columns: 1fr; gap: 40px; }
  .ct2-form-intro { position: static; }
  .ct2-card { padding: 28px 20px; border-radius: 22px; }
}

@media (max-width: 560px) {
  .ct2-channels { grid-template-columns: 1fr; }
  .ct2-fields { grid-template-columns: 1fr; }
  .ct2-field { grid-column: 1 / -1; }
}