/* Ritma Fly · başvuru (gece zemin)
   Solda yapışkan dev kapanış cümlesi ("İşinizi büyütün." altını vurgu kalemi
   çizer) ve defter satırı gibi üç artı. Sağda ikonlu tek sütun sorular,
   ince çizgilerle ayrılan defter satırları. Cevaplanan / odaktaki sorunun
   ikonunun altına mavi kalem şeridi çekilir.
   Çipler koyu tonda, seçili mavi dolgu; metin alanları yalnız alt çizgi, odakta
   mavi çizgi soldan sağa çizilir. Kenarlık + zemin birlikte yok.
   Gönderim ve doğrulama ritmafly-form.js'te; .fy-error ve #fy-form-status
   onun sözleşmesi. */
.ritmafly-page .fyb {
  --fyb-cip: rgba(255, 255, 255, .06);
  --fyb-cip-h: rgba(255, 255, 255, .11);
  --fyb-alt: rgba(255, 255, 255, .2);
  --fyb-hata: var(--fy-eksi);
  --fyb-sol: 84px;
  overflow: clip;
  isolation: isolate
}

/* sakin ışık: formun arkasında tek, durağan mavi hale */
.ritmafly-page .fyb::before {
  content: "";
  position: absolute;
  z-index: -1;
  right: -12%;
  top: 4%;
  width: min(980px, 90vw);
  aspect-ratio: 1;
  background: radial-gradient(closest-side, rgba(1, 104, 250, .16), rgba(1, 104, 250, .05) 55%, transparent);
  pointer-events: none
}

.ritmafly-page .fyb-kap {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  gap: 72px;
  align-items: start
}

/* ---- sol: kapanış ---- */
.ritmafly-page .fyb-bas { align-self: stretch }
.ritmafly-page .fyb-bas-ic { position: sticky; top: 120px }

.ritmafly-page .fyb-tut { white-space: nowrap }
.ritmafly-page .fyb-baslik .fy-soluk { display: block }
/* soluk satırın tek parlak kelimesi: altını kalem çizer */
.ritmafly-page .fyb-baslik .fy-vurgu { color: #fff }

.ritmafly-page .fyb-giris { margin-top: 34px; max-width: 30em; font-size: 19px }

.ritmafly-page .fyb-artilar {
  list-style: none;
  margin: 44px 0 0;
  padding: 0;
  max-width: 520px;
  box-shadow: inset 0 1px var(--fy-cizgi-k)
}

.ritmafly-page .fyb-artilar .fy-satir { padding: 17px 0; font-size: 16px; line-height: 1.4 }
.ritmafly-page .fyb-artilar span { color: var(--fy-yazi-k2) }
.ritmafly-page .fyb-artilar b { font-weight: 650; color: #fff; text-align: right }

/* ---- sağ: sorular ---- */
.ritmafly-page .fyb-form { display: grid; padding-top: 46px }

.ritmafly-page .fyb-soru {
  position: relative;
  margin: 0;
  min-width: 0;
  padding: 34px 0 38px var(--fyb-sol);
  border: 0;
  box-shadow: inset 0 1px var(--fy-cizgi-k)
}

/* legend float edilir ki fieldset kenarına değil içeriğe otursun; ardından
   gelen öğe clear ile alta iner. */
.ritmafly-page .fyb-soru legend,
.ritmafly-page .fyb-soru-bas {
  display: block;
  float: left;
  width: 100%;
  margin: 0;
  padding: 0;
  font-size: 22px;
  font-weight: 680;
  line-height: 1.3;
  letter-spacing: -.02em;
  color: #fff
}

.ritmafly-page .fyb-soru legend + *,
.ritmafly-page .fyb-soru-bas + * { clear: both }

/* soru ikonu: defterin sol sütunu (eski 01–04 numaralarının yerinde) */
.ritmafly-page .fyb-no {
  position: absolute;
  left: 0;
  top: 37px;
  z-index: 0;
  color: var(--fy-acik);
  transition: color .3s ease
}

.ritmafly-page .fyb-no .fy-ikon { width: 22px; height: 22px; color: inherit }

.ritmafly-page .fyb-no::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: -4px;
  right: -14px;
  bottom: -3px;
  height: 7px;
  border-radius: 1.5px;
  background: var(--fy-mavi);
  transform: skewX(-42deg) scaleX(0);
  transform-origin: 0 50%;
  transition: transform .7s var(--fy-ease)
}

/* odaktaki ya da cevaplanan soru: ikon aydınlanır, altını kalem çizer */
.ritmafly-page .fyb-soru:focus-within .fyb-no,
.ritmafly-page .fyb-soru:has(input:checked) .fyb-no,
.ritmafly-page .fyb-soru--mesaj:has(textarea:not(:placeholder-shown)) .fyb-no,
.ritmafly-page .fyb-soru--iletisim:not(:has(input:placeholder-shown)) .fyb-no { color: #fff }

.ritmafly-page .fyb-soru:has(input:checked) .fyb-no::before,
.ritmafly-page .fyb-soru--mesaj:has(textarea:not(:placeholder-shown)) .fyb-no::before,
.ritmafly-page .fyb-soru--iletisim:not(:has(input:placeholder-shown)) .fyb-no::before { transform: skewX(-42deg) scaleX(1) }

.ritmafly-page .fyb-yildiz { color: var(--fy-acik); font-weight: 600 }

.ritmafly-page .fyb-yardim {
  margin: 0;
  padding-top: 8px;
  font-size: 15px;
  line-height: 1.5;
  color: var(--fy-yazi-k2)
}

/* ---- çipler ---- */
.ritmafly-page .fyb-cipler {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding-top: 24px
}

.ritmafly-page .fyb-yardim + .fyb-cipler { padding-top: 20px }

.ritmafly-page .fyb-cip { position: relative; cursor: pointer }

.ritmafly-page .fyb-cip input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  margin: 0;
  cursor: pointer
}

.ritmafly-page .fyb-cip span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 48px;
  padding: 12px 20px;
  border-radius: 999px;
  background: var(--fyb-cip);
  font-size: 15.5px;
  font-weight: 560;
  line-height: 1.3;
  color: rgba(255, 255, 255, .86);
  transition: background-color .25s ease, color .25s ease, box-shadow .3s ease
}

.ritmafly-page .fyb-tik {
  width: 0;
  opacity: 0;
  margin-right: -8px;
  transition: width .3s var(--fy-ease), opacity .2s ease, margin .3s var(--fy-ease)
}

@media (hover: hover) {
  .ritmafly-page .fyb-cip:hover span { background: var(--fyb-cip-h); color: #fff }
}

.ritmafly-page .fyb-cip input:checked + span {
  background: var(--fy-mavi);
  color: #fff;
  box-shadow: 0 14px 30px -14px rgba(1, 104, 250, .95)
}

.ritmafly-page .fyb-cip input:checked + span .fyb-tik { width: 14px; opacity: 1; margin-right: 0 }

.ritmafly-page .fyb-cip input:focus-visible + span { outline: 2px solid var(--fy-acik); outline-offset: 3px }

/* seçim eksikse çipler hafif kırmızıya döner */
.ritmafly-page .fyb-cip input[aria-invalid="true"]:not(:checked) + span { background: rgba(255, 122, 122, .12) }

/* ---- alt çizgili alanlar ---- */
.ritmafly-page .fyb-alan { position: relative; display: grid; align-content: start; gap: 4px }

.ritmafly-page .fyb-alan label {
  font-size: 13px;
  font-weight: 650;
  letter-spacing: .01em;
  color: var(--fy-yazi-k2)
}

.ritmafly-page .fyb-alan input,
.ritmafly-page .fyb-alan textarea {
  width: 100%;
  padding: 10px 0 13px;
  border: 0;
  border-bottom: 1px solid var(--fyb-alt);
  border-radius: 0;
  /* odak çizgisi: mavi kalem soldan sağa çekilir */
  background: linear-gradient(var(--fy-mavi), var(--fy-mavi)) 0 100% / 0 2px no-repeat transparent;
  font: inherit;
  font-size: 18px;
  line-height: 1.4;
  color: #fff;
  caret-color: var(--fy-acik);
  transition: background-size .6s var(--fy-ease), border-color .25s ease;
  -webkit-appearance: none;
  appearance: none
}

.ritmafly-page .fyb-alan textarea { resize: vertical; min-height: 96px }

.ritmafly-page .fyb-alan input::placeholder,
.ritmafly-page .fyb-alan textarea::placeholder { color: rgba(255, 255, 255, .26); opacity: 1 }

@media (hover: hover) {
  .ritmafly-page .fyb-alan input:hover,
  .ritmafly-page .fyb-alan textarea:hover { border-bottom-color: rgba(255, 255, 255, .36) }
}

.ritmafly-page .fyb-alan input:focus,
.ritmafly-page .fyb-alan textarea:focus { outline: none; background-size: 100% 2px; border-bottom-color: transparent }

.ritmafly-page .fyb-alan:focus-within label { color: var(--fy-acik) }

.ritmafly-page .fyb-alan [aria-invalid="true"] { border-bottom-color: var(--fyb-hata) }

/* tarayıcının otomatik doldurma zeminini koyu tonda tut */
.ritmafly-page .fyb-alan input:-webkit-autofill {
  -webkit-text-fill-color: #fff;
  -webkit-box-shadow: 0 0 0 40px var(--fy-gece) inset;
  caret-color: #fff
}

.ritmafly-page .fyb-alan--mesaj { margin-top: 22px }

.ritmafly-page .fyb-sayac {
  position: absolute;
  right: 0;
  top: -24px;
  font-size: 12px;
  color: var(--fy-yazi-k2)
}

.ritmafly-page .fyb-sayac b { font-weight: 650; color: rgba(255, 255, 255, .86) }

.ritmafly-page .fyb-iletisim {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px 32px;
  padding-top: 26px
}

/* ---- hata ve durum metinleri ---- */
.ritmafly-page .fyb .fy-error {
  display: block;
  font-size: 13.5px;
  font-weight: 550;
  line-height: 1.4;
  color: var(--fyb-hata)
}

.ritmafly-page .fyb .fy-error:empty { display: none }
.ritmafly-page .fyb-soru > .fy-error { margin-top: 14px }
.ritmafly-page .fyb-alan .fy-error { margin-top: 4px }

.ritmafly-page .fyb .fy-form-status {
  margin: 0 0 28px;
  padding: 14px 18px;
  border-radius: 12px;
  background: rgba(255, 122, 122, .12);
  font-size: 15px;
  font-weight: 600;
  color: #FFB0B0
}

.ritmafly-page .fyb .fy-form-status[hidden] { display: none }

.ritmafly-page .fyb .fy-honeypot {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden
}

/* ---- son: onay ve gönder ---- */
.ritmafly-page .fyb-son {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 20px 24px;
  padding: 34px 0 0 var(--fyb-sol);
  box-shadow: inset 0 1px var(--fy-cizgi-k)
}

.ritmafly-page .fyb-kvkk {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 15.5px;
  color: var(--fy-yazi-k);
  cursor: pointer
}

.ritmafly-page .fyb-kvkk input {
  flex: none;
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  margin: 0;
  border: 0;
  border-radius: 7px;
  background: rgba(255, 255, 255, .1);
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
  transition: background-color .2s ease, box-shadow .2s ease
}

.ritmafly-page .fyb-kvkk input::after {
  content: "";
  width: 10px;
  height: 6px;
  border-left: 2.2px solid #fff;
  border-bottom: 2.2px solid #fff;
  transform: translateY(-1px) rotate(-45deg) scale(0);
  transition: transform .25s var(--fy-ease)
}

.ritmafly-page .fyb-kvkk input:checked { background: var(--fy-mavi); box-shadow: 0 8px 18px -8px rgba(1, 104, 250, .9) }
.ritmafly-page .fyb-kvkk input:checked::after { transform: translateY(-1px) rotate(-45deg) scale(1) }
.ritmafly-page .fyb-kvkk input:focus-visible { outline: 2px solid var(--fy-acik); outline-offset: 3px }
.ritmafly-page .fyb-kvkk input[aria-invalid="true"]:not(:checked) { background: rgba(255, 122, 122, .22) }
.ritmafly-page .fyb-kvkk a { color: #fff; font-weight: 600; text-decoration: underline; text-decoration-color: rgba(255, 255, 255, .4); text-underline-offset: 4px }
.ritmafly-page .fyb-kvkk a:focus-visible { outline: 2px solid var(--fy-acik); outline-offset: 3px; border-radius: 2px }
.ritmafly-page .fyb-kvkk-kap .fy-error { margin-top: 10px }

@media (hover: hover) {
  .ritmafly-page .fyb-kvkk a:hover { text-decoration-color: var(--fy-acik) }
}

.ritmafly-page .fyb-gonder:disabled { opacity: .7; cursor: progress; transform: none }

/* ---- gönderildi ---- */
.ritmafly-page .fyb-basari {
  padding: 46px 0 0 var(--fyb-sol);
  position: relative
}

.ritmafly-page .fyb-basari-isaret {
  display: grid;
  place-items: center;
  width: 72px;
  height: 72px;
  border-radius: 20px;
  background: var(--fy-mavi);
  box-shadow: 0 24px 50px -18px rgba(1, 104, 250, .95)
}

.ritmafly-page .fyb-basari-isaret path { stroke-dasharray: 1; stroke-dashoffset: 0 }

@media (prefers-reduced-motion: no-preference) {
  .ritmafly-page .fyb-basari-isaret path { animation: fyb-tik-ciz .8s .35s var(--fy-ease) both }
}

@keyframes fyb-tik-ciz {
  from { stroke-dashoffset: 1 }
  to { stroke-dashoffset: 0 }
}

.ritmafly-page .fyb-basari-baslik {
  margin: 36px 0 0;
  font-size: clamp(28.1px, 3vw, 45.2px);
  font-weight: 780;
  line-height: 1;
  letter-spacing: -.025em;
  color: #fff;
  text-wrap: balance
}

.ritmafly-page .fyb-basari-metin {
  margin: 22px 0 0;
  max-width: 28em;
  font-size: 18.5px;
  line-height: 1.6;
  color: var(--fy-yazi-k)
}

.ritmafly-page .fyb-basari-eylem {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 18px 32px;
  margin-top: 38px;
  padding-top: 34px;
  box-shadow: inset 0 1px var(--fy-cizgi-k)
}

/* ---- dar masaüstü ---- */
@media (max-width: 1279px) {
  .ritmafly-page .fyb-kap { gap: 60px }
  .ritmafly-page .fyb { --fyb-sol: 68px }
}

/* ---- tablet: tek sütun ---- */
@media (max-width: 1199px) {
  .ritmafly-page .fyb-kap { grid-template-columns: minmax(0, 1fr); gap: 64px }
  .ritmafly-page .fyb-bas-ic { position: static; max-width: 720px }
  .ritmafly-page .fyb-giris { font-size: 18px }
  .ritmafly-page .fyb-form { padding-top: 0 }
  .ritmafly-page .fyb-artilar { max-width: none }
  .ritmafly-page .fyb-basari { padding-top: 40px }
}

/* ---- mobil ---- */
@media (max-width: 699px) {
  .ritmafly-page .fyb { --fyb-sol: 0px }
  .ritmafly-page .fyb-kap { gap: 48px }
  .ritmafly-page .fyb-giris { margin-top: 24px; font-size: 17px }
  .ritmafly-page .fyb-artilar { margin-top: 32px }
  .ritmafly-page .fyb-artilar .fy-satir { padding: 15px 0; font-size: 15px; gap: 16px }
  .ritmafly-page .fyb-soru { padding: 28px 0 32px }
  .ritmafly-page .fyb-no { position: relative; top: 0; display: table; margin-bottom: 12px }
  .ritmafly-page .fyb-soru legend, .ritmafly-page .fyb-soru-bas { font-size: 19px }
  .ritmafly-page .fyb-cipler { gap: 8px }
  .ritmafly-page .fyb-cip span { min-height: 44px; padding: 10px 16px; font-size: 15px }
  .ritmafly-page .fyb-iletisim { grid-template-columns: minmax(0, 1fr); gap: 24px }
  .ritmafly-page .fyb-alan input, .ritmafly-page .fyb-alan textarea { font-size: 17px }
  .ritmafly-page .fyb-son { flex-direction: column; align-items: stretch; padding-top: 28px }
  .ritmafly-page .fyb-gonder { justify-content: center; width: 100% }
  .ritmafly-page .fyb-basari-isaret { width: 60px; height: 60px; border-radius: 16px }
  .ritmafly-page .fyb-basari-metin { font-size: 17px }
  .ritmafly-page .fyb-basari-eylem .fy-btn { width: 100%; justify-content: center }
}

@media (prefers-reduced-motion: reduce) {
  .ritmafly-page .fyb-no, .ritmafly-page .fyb-no::before, .ritmafly-page .fyb-cip span, .ritmafly-page .fyb-tik,
  .ritmafly-page .fyb-alan input, .ritmafly-page .fyb-alan textarea, .ritmafly-page .fyb-kvkk input,
  .ritmafly-page .fyb-kvkk input::after { transition: none }
}
