/* ===== FILE: arm-cta.css ===== */
/* Premium CTA — Pearl / Graphite (nav’dan bağımsız)
   NOT: Sol kırmızı şerit KALDIRILDI.
*/

.arm-cta{
  /* Tuning */
  --cta-ink: var(--arm-ink, #0f172a);
  --cta-border: rgba(15,23,42,.10);
  --cta-shadow: 0 10px 22px rgba(2,6,23,.08);
  --cta-shadow-hi: 0 16px 34px rgba(2,6,23,.12);

  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;

  /* Şerit kalkınca padding’i biraz dengeli tut */
  padding:10px 12px;
  border-radius:16px;

  font-weight:900;
  font-size:.92rem;
  line-height:1;
  letter-spacing:.12px;
  white-space:nowrap;

  text-decoration:none !important;
  color: var(--cta-ink);

  /* Pearl surface */
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(248,250,252,.82));
  border: 1px solid var(--cta-border);
  box-shadow: var(--cta-shadow);

  position: relative;
  overflow: hidden;

  transition:
    transform .16s ease,
    box-shadow .16s ease,
    border-color .16s ease,
    background .16s ease;
}

/* Sol micro accent bar KAPALI */
.arm-cta::before{
  content:none !important;
  display:none !important;
}

/* ikon chip: sade, “glass” */
.arm-cta .arm-cta-ico{
  width:28px;
  height:28px;
  border-radius:12px;
  display:grid;
  place-items:center;
  flex:0 0 auto;

  color: rgba(15,23,42,.72);
  background: rgba(255,255,255,.62);
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 0 6px 14px rgba(2,6,23,.06);
}

/* Label biraz daha net */
.arm-cta .arm-cta-label{
  color: rgba(15,23,42,.92);
}

/* Hover (desktop) */
@media (hover:hover) and (pointer:fine){
  .arm-cta:hover{
    transform: translateY(-1px);
    box-shadow: var(--cta-shadow-hi);
    border-color: rgba(15,23,42,.14);
    background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,250,252,.86));
  }
}

.arm-cta:active{ transform: translateY(1px); }

.arm-cta:focus-visible{
  outline:none;
  /* kırmızı yerine nötr fokus: daha premium */
  box-shadow: 0 0 0 3px rgba(15,23,42,.12), var(--cta-shadow-hi);
  border-color: rgba(15,23,42,.18);
}

/* =========================================================
   Wide hook (yerleşim navbar CSS’ten geliyor ama burada da güvenli)
   ========================================================= */
.arm-cta--wide{
  justify-content:center;
  min-height: 44px;
}

/* =========================================================
   Premium motion: Soft breath + çok ince sheen
   ========================================================= */
.arm-cta--pulse{
  animation: armCtaBreath 2.8s ease-in-out infinite;
}

/* Sheen (ince ışık geçişi) */
.arm-cta--pulse::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background: linear-gradient(90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.65) 42%,
    rgba(255,255,255,0) 70%
  );
  transform: translateX(-130%);
  opacity:.35;
  animation: armCtaSheen 4.4s ease-in-out infinite;
  mix-blend-mode: screen;
}

@keyframes armCtaBreath{
  0%,100%{ box-shadow: 0 10px 22px rgba(2,6,23,.08); }
  50%{ box-shadow: 0 16px 34px rgba(2,6,23,.11); }
}
@keyframes armCtaSheen{
  0%{ transform: translateX(-130%); }
  55%{ transform: translateX(130%); }
  100%{ transform: translateX(130%); }
}

/* Çok dar ekran: metni gizle */
@media (max-width: 380px){
  .arm-cta .arm-cta-label{ display:none; }
  .arm-cta{ padding:9px 10px; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .arm-cta{ transition:none !important; }
  .arm-cta--pulse{ animation:none !important; }
  .arm-cta--pulse::after{ animation:none !important; }
}

/* Opsiyonel: iki parçalı yazım kullanıyorsan */
.arm-cta-kicker{
  font-size:.78rem;
  font-weight:800;
  color: rgba(100,116,139,.95);
  margin-right:6px;
}
.arm-cta-main{
  font-size:.94rem;
  font-weight:950;
  color: rgba(15,23,42,.94);
}
