/* İlana göre CV akışı (/ilana-gore-cv).
   Panel kabuğunu kullanmaz; herkese açık düzenin içinde bağımsız bir ekrandır. */

.jt-page { --jt-accent: #f4511e; --jt-ink: #17171c; --jt-muted: #6b6b76; --jt-line: #e7e7ec; }
.jt-wrap { width: min(1080px, calc(100% - 40px)); margin: 0 auto; }

/* ---------- Başlık ---------- */
.jt-hero { padding: 72px 0 34px; background: linear-gradient(180deg, #fff7f3 0%, #fff 100%); }
.jt-kicker {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 6px 13px; border-radius: 99px;
  color: #b8410f; background: #ffece3;
  font-size: 12px; font-weight: 750; letter-spacing: .01em;
}
.jt-hero h1 {
  margin: 16px 0 0; color: var(--jt-ink);
  font-size: clamp(30px, 4.4vw, 50px); font-weight: 780;
  line-height: 1.06; letter-spacing: -.035em; text-wrap: balance;
}
.jt-lede { max-width: 62ch; margin: 14px 0 0; color: var(--jt-muted); font-size: 15.5px; line-height: 1.72; }

/* ---------- Akış kartı ---------- */
.jt-flow { padding: 0 0 84px; }
.jt-card {
  padding: 30px; border: 1px solid var(--jt-line); border-radius: 20px;
  background: #fff; box-shadow: 0 16px 44px rgba(28, 22, 18, .07);
}

.jt-step-head { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 18px; }
.jt-step-head-2 { margin-top: 34px; padding-top: 28px; border-top: 1px solid var(--jt-line); }
.jt-step-no {
  flex: 0 0 auto; width: 30px; height: 30px; display: grid; place-items: center;
  border-radius: 50%; color: #fff; background: var(--jt-accent);
  font-size: 13px; font-weight: 800; font-variant-numeric: tabular-nums;
}
.jt-step-head h2 { margin: 2px 0 3px; color: var(--jt-ink); font-size: 19px; font-weight: 720; letter-spacing: -.015em; }
.jt-step-head p { margin: 0; color: var(--jt-muted); font-size: 13.5px; }

/* ---------- Alanlar ---------- */
.jt-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.jt-field { display: block; margin-bottom: 16px; }
.jt-field > span { display: block; margin-bottom: 7px; color: #43434c; font-size: 13px; font-weight: 650; }
.jt-field > span small { color: #9a9aa4; font-weight: 500; }
.jt-req { color: var(--jt-accent); font-size: 11px; font-weight: 750; }
.jt-field input, .jt-field textarea, .jt-field select {
  display: block; width: 100%; box-sizing: border-box;
  padding: 11px 13px; border: 1px solid #dcdce3; border-radius: 11px;
  background: #fcfcfd; color: var(--jt-ink);
  font: 500 14px/1.6 Inter, system-ui, sans-serif; outline: 0;
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.jt-field textarea { min-height: 200px; resize: vertical; }
.jt-field input:focus, .jt-field textarea:focus, .jt-field select:focus {
  border-color: var(--jt-accent); background: #fff;
  box-shadow: 0 0 0 3px rgba(244, 81, 30, .1);
}
.jt-field-compact { margin: 0 0 12px; }
.jt-hint { display: block; margin-top: 7px; color: #8d8d97; font-size: 12px; font-style: normal; }

/* Boş gönderimde alanı kısaca işaretler; hata metni toast ile verilir. */
.jt-invalid { border-color: #d92d20 !important; box-shadow: 0 0 0 3px rgba(217, 45, 32, .12) !important; }

/* ---------- İki seçenek ---------- */
.jt-choices { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.jt-choice {
  display: flex; flex-direction: column; align-items: flex-start;
  padding: 22px; border: 1px solid var(--jt-line); border-radius: 16px; background: #fcfcfd;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.jt-choice:hover { border-color: rgba(244, 81, 30, .34); box-shadow: 0 12px 30px rgba(40, 28, 20, .08); transform: translateY(-2px); }
.jt-choice-icon {
  width: 40px; height: 40px; display: grid; place-items: center;
  margin-bottom: 13px; border-radius: 11px; font-size: 16px;
}
.jt-choice-icon-new { color: #b8410f; background: #ffece3; }
.jt-choice-icon-copy { color: #1d4ed8; background: #e8eeff; }
.jt-choice h3 { margin: 0 0 7px; color: var(--jt-ink); font-size: 16.5px; font-weight: 720; letter-spacing: -.01em; }
.jt-choice > p { margin: 0 0 16px; color: var(--jt-muted); font-size: 13.5px; line-height: 1.65; }
.jt-choice .jt-field { width: 100%; }
/* Düğme her zaman kartın altına hizalanır: iki kartın metni farklı uzunlukta. */
.jt-choice .jt-btn { margin-top: auto; }
.jt-empty { margin: auto 0 0; color: #8d8d97; font-size: 13px; line-height: 1.6; }

.jt-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 44px; padding: 0 20px; border: 1px solid #dcdce3; border-radius: 12px;
  color: var(--jt-ink); background: #fff; text-decoration: none;
  font: 700 13.5px Inter, system-ui, sans-serif; cursor: pointer;
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.jt-btn:hover { border-color: #bfbfc9; box-shadow: 0 6px 16px rgba(30, 30, 38, .09); color: var(--jt-ink); }
.jt-btn-primary { border-color: transparent; color: #fff; background: linear-gradient(135deg, #ff7a1a, #f4511e); }
.jt-btn-primary:hover { color: #fff; box-shadow: 0 10px 26px rgba(244, 81, 30, .3); }

.jt-auth-note {
  display: flex; align-items: flex-start; gap: 9px;
  margin: 22px 0 0; padding: 13px 15px; border-radius: 12px;
  color: #4a4a55; background: #f6f7f9; font-size: 13px; line-height: 1.62;
}
.jt-auth-note i { margin-top: 2px; color: #16794f; }
.jt-auth-note a { color: var(--jt-accent); font-weight: 700; }
.jt-warn { background: #fff6ed; color: #7a4a12; }
.jt-warn i { color: #b8410f; }

/* ---------- Nasıl çalışır ---------- */
.jt-how { padding: 0 0 96px; }
.jt-how header { margin-bottom: 28px; }
.jt-how header span { color: var(--jt-accent); font-size: 11.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.jt-how header h2 { max-width: 20ch; margin: 10px 0 0; color: var(--jt-ink); font-size: clamp(24px, 3vw, 34px); font-weight: 750; letter-spacing: -.03em; text-wrap: balance; }
.jt-how-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.jt-how-grid article { padding: 20px; border: 1px solid var(--jt-line); border-radius: 14px; background: #fff; }
.jt-how-grid i { display: block; margin-bottom: 11px; color: var(--jt-accent); font-size: 17px; }
.jt-how-grid h3 { margin: 0 0 6px; color: var(--jt-ink); font-size: 14.5px; font-weight: 720; }
.jt-how-grid p { margin: 0; color: var(--jt-muted); font-size: 13px; line-height: 1.65; }

/* ---------- Dar ekran ---------- */
@media (max-width: 900px) {
  .jt-choices, .jt-grid { grid-template-columns: 1fr; }
  .jt-how-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .jt-wrap { width: calc(100% - 28px); }
  .jt-hero { padding: 48px 0 26px; }
  .jt-card { padding: 20px; border-radius: 16px; }
  .jt-how-grid { grid-template-columns: 1fr; }
  .jt-btn { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .jt-choice, .jt-btn, .jt-field input, .jt-field textarea, .jt-field select { transition: none; }
  .jt-choice:hover { transform: none; }
}
