/* ═══════════════════════════════════════════════════════════
   BİLEŞENLER — eyebrow, badge, buton, cam çip, bölüm iskeleti
   ═══════════════════════════════════════════════════════════ */

/* ─── eyebrow: uygulamanın kendi grameri ─── */
.eyebrow {
  font-family: var(--mono);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .125em; /* 1.5px @12px — token bandının tepesi */
  color: var(--soluk-metin);
}
.eyebrow--hero { color: rgba(255,255,255,.85); }
.eyebrow--gok { color: var(--gok-etiket); display: flex; align-items: center; gap: 10px; justify-content: center; }
.eyebrow--warm { color: #7A6836; }

.badge {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--buz-zemin); color: var(--arduvaz);
  border-radius: 999px; padding: 6px 13px;
  font-size: 12.5px; font-weight: 600;
}

.dot { width: 8px; height: 8px; border-radius: 50%; background: var(--filiz); display: inline-block; }
.dot--pulse { animation: kvPulse 1.6s ease-in-out infinite; }

@keyframes kvPulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: .45; transform: scale(.82); }
}

/* ─── signature buton ─── */
.btn-primary {
  position: relative;
  display: inline-flex; align-items: center; justify-content: center;
  height: 58px; padding: 0 72px 0 30px;
  border: 0; border-radius: 999px; cursor: pointer;
  background: var(--ink); color: #fff;
  font-family: var(--font); font-size: 16px; font-weight: 600;
  text-decoration: none;
  box-shadow: var(--golge-buton);
  transition: transform .35s var(--ease-out), box-shadow .35s var(--ease-out);
}
.btn-primary:hover { transform: translateY(-2px); box-shadow: 0 20px 40px rgba(46,74,99,.28); }
.btn-primary:active { transform: translateY(0) scale(.985); }

.btn-primary--light {
  background: #fff; color: var(--ink); font-weight: 700;
  box-shadow: 0 14px 34px rgba(35,66,92,.35);
}

.btn-arrow {
  position: absolute; right: 7px;
  width: 44px; height: 44px; border-radius: 999px;
  background: var(--filiz);
  display: flex; align-items: center; justify-content: center;
  transition: transform .35s var(--ease-out);
}
.btn-primary:hover .btn-arrow { transform: translateX(3px); }
.btn-arrow--sm { width: 38px; height: 38px; right: 6px; position: absolute; }

.glass-chip {
  display: inline-flex; align-items: center; gap: 7px;
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.32);
  border-radius: 999px; padding: 8px 14px;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  color: #fff; font-size: 13px; font-weight: 600;
  white-space: nowrap;
}
/* gradyanın açık (buz) bölgesi üstünde: mürekkep metinli cam */
.glass-chip--onlight {
  background: rgba(255,255,255,.55);
  border-color: rgba(46,74,99,.18);
  color: var(--ink);
}

/* ═══ SECTION SKELETON ═══ */
section { position: relative; }

.section-head {
  max-width: 720px;
  margin: 0 auto;
  text-align: center;
  padding: 0 20px;
}
.section-head h2 { margin-top: 16px; }
.section-sub {
  margin-top: 18px;
  font-size: clamp(15.5px, 1.5vw, 18px);
  color: var(--kisik);
  line-height: 1.65;
}
.section-head--dark h2 { color: var(--ekran); }
.section-head--dark .section-sub { color: var(--gece-metin); }