/* Jigyasu Yoga — bileşen sınıfları. Değerler tokens.css değişkenlerinden gelir. */
.jy { font-family: var(--font-karla); color: var(--murekkep); }

/* Buton */
.jy-btn { display:inline-flex; align-items:center; justify-content:center; gap:var(--alan-2);
  font-family:var(--font-karla); font-size:16px; line-height:20px; font-weight:600; letter-spacing:.01em;
  padding:14px 28px; border-radius:var(--kose-tam); border:var(--kalinlik-2) solid transparent;
  text-decoration:none; cursor:pointer; transition:background-color .15s ease, border-color .15s ease; }
.jy-btn:focus-visible, .jy-link:focus-visible, .jy-alan input:focus-visible { outline:var(--kalinlik-3) solid var(--odak); outline-offset:3px; }
.jy-btn--birincil { background:var(--vurgu); color:var(--vurgu-uzeri); }
.jy-btn--birincil:hover, .jy-btn--birincil:active { background:var(--vurgu-basili); }
.jy-btn--ikincil { background:transparent; color:var(--murekkep); border-color:var(--murekkep); }
.jy-btn--ikincil:hover { background:var(--tul-acik); }
.jy-btn[disabled] { opacity:.45; cursor:not-allowed; }
.jy-link { font-family:var(--font-karla); font-weight:600; color:var(--murekkep); text-decoration:underline;
  text-decoration-color:var(--vurgu); text-decoration-thickness:var(--kalinlik-3); text-underline-offset:5px; }
.jy-link:hover { text-decoration-color:var(--murekkep); }

/* Etiket */
.jy-etiket { display:inline-block; font-family:var(--font-karla); font-size:13px; line-height:16px; font-weight:600;
  letter-spacing:.12em; text-transform:uppercase; padding:var(--alan-1) 10px; border-radius:var(--kose-1);
  background:var(--vurgu); color:var(--vurgu-uzeri); }
.jy-etiket--tul { background:var(--tul); color:var(--vurgu-uzeri); }
.jy-etiket--yalin { background:transparent; color:var(--murekkep-soluk); padding-left:0; padding-right:0; }

/* Nokta liste: logodaki dolu nokta madde işareti olarak */
.jy-nokta-liste { list-style:none; margin:0; padding:0; display:grid; gap:var(--alan-3);
  font-family:var(--font-karla); font-size:17px; line-height:28px; color:var(--murekkep); }
.jy-nokta-liste li { position:relative; padding-left:var(--alan-5); }
.jy-nokta-liste li::before { content:""; position:absolute; left:2px; top:10px; width:8px; height:8px;
  border-radius:var(--kose-tam); background:var(--vurgu); }

/* Alıntı */
.jy-alinti { margin:0; max-width:var(--genislik-metin); }
.jy-alinti p { margin:0; font-family:var(--font-fraunces); font-weight:400; font-size:26px; line-height:36px; color:var(--murekkep); text-wrap:balance; }
.jy-alinti footer { margin-top:var(--alan-4); display:flex; align-items:center; gap:var(--alan-2);
  font-family:var(--font-karla); font-size:15px; line-height:24px; color:var(--murekkep-soluk); }
.jy-alinti footer::before { content:""; width:8px; height:8px; border-radius:var(--kose-tam); background:var(--vurgu); flex:none; }

/* Kart: gölge yok, çizgi ve ton */
.jy-kart { background:var(--zemin-ust); border:var(--kalinlik-1) solid var(--cizgi); border-radius:var(--kose-2);
  padding:var(--alan-6); display:flex; flex-direction:column; gap:var(--alan-3); color:var(--murekkep); font-family:var(--font-karla); }
.jy-kart h3 { margin:0; font-family:var(--font-fraunces); font-weight:400; font-size:30px; line-height:38px; }
.jy-kart p { margin:0; font-size:15px; line-height:24px; }
.jy-kart .jy-kart__meta { font-size:13px; line-height:20px; color:var(--murekkep-soluk); }

/* Görsel yer tutucusu */
.jy-gorsel { aspect-ratio:var(--oran-dikey); max-width:100%; background:var(--tul-acik); border-radius:var(--kose-0);
  display:flex; align-items:flex-end; padding:var(--alan-4); box-sizing:border-box;
  font-family:var(--font-karla); font-size:13px; line-height:20px; color:var(--murekkep-soluk); }
.jy-gorsel img { width:100%; height:100%; object-fit:cover; display:block; }

/* E-posta alanı */
.jy-alan { display:grid; gap:var(--alan-2); font-family:var(--font-karla); max-width:520px; }
.jy-alan label { font-size:15px; line-height:20px; font-weight:600; color:var(--murekkep); }
.jy-alan__satir { display:flex; flex-wrap:wrap; gap:var(--alan-2); }
.jy-alan input { flex:1 1 220px; min-width:0; font:inherit; font-size:17px; line-height:24px; color:var(--murekkep);
  background:var(--zemin-ust); border:var(--kalinlik-2) solid var(--cizgi-kontrol); border-radius:var(--kose-tam); padding:13px 20px; }
.jy-alan input::placeholder { color:var(--murekkep-soluk); }
.jy-alan__yardim { font-size:13px; line-height:20px; color:var(--murekkep-soluk); }
.jy-alan--hata input { border-color:var(--hata); }
.jy-alan--hata .jy-alan__yardim { color:var(--hata); }