:root {
  --bg: #fbfaf7;
  --card: #ffffff;
  --text: #1c1b19;
  --muted: #6b6862;
  --line: #e6e2da;
  --soft: #f3f1ec;
  --accent: #b5452b;
  --serif: 'Iowan Old Style', 'Palatino Linotype', Palatino, Georgia, serif;
  --sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Inter, Roboto, sans-serif;
  color-scheme: light dark;
}
@media (prefers-color-scheme: dark) {
  :root { --bg: #141412; --card: #1b1b19; --text: #e9e6df; --muted: #9a968d; --line: #2d2c29; --soft: #22211e; --accent: #e0805f; }
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--text); font: 17px/1.65 var(--sans); -webkit-font-smoothing: antialiased; }
.wrap { max-width: 64rem; margin: 0 auto; padding: 0 1.25rem; }
h1, h2, h3 { font-family: var(--serif); font-weight: 600; letter-spacing: -0.01em; line-height: 1.2; }
button { font: inherit; color: inherit; }
a { color: inherit; }

/* üst çubuk */
.top { max-width: 64rem; margin: 0 auto; padding: 1.25rem 1.25rem 0; display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.back { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.4rem 0.85rem; border: 1px solid var(--line); border-radius: 999px; text-decoration: none; color: var(--muted); font-size: 0.9rem; }
.back:hover { color: var(--text); border-color: var(--muted); }
.bk-short { display: none; }
.langs { display: inline-flex; border: 1px solid var(--line); border-radius: 999px; padding: 3px; }
.langs button { border: 0; background: transparent; padding: 0.25rem 0.75rem; border-radius: 999px; cursor: pointer; font-size: 0.85rem; font-weight: 600; color: var(--muted); }
.langs button[aria-pressed='true'] { background: var(--text); color: var(--bg); }
@media (max-width: 520px) { .bk-long { display: none; } .bk-short { display: inline; } }

/* düğmeler */
.btn { display: inline-flex; align-items: center; gap: 0.45rem; padding: 0.8rem 1.35rem; border: 1px solid var(--line); border-radius: 999px; background: var(--card); cursor: pointer; font-weight: 600; transition: transform 0.15s, background 0.15s, border-color 0.15s; }
.btn:hover { border-color: var(--muted); transform: translateY(-1px); }
.btn.primary { background: var(--text); color: var(--bg); border-color: var(--text); }
.btn.ghost { background: transparent; }
.btn.small { padding: 0.45rem 0.9rem; font-size: 0.9rem; }
.btn .small { font-weight: 400; opacity: 0.7; }
.link { border: 0; background: none; color: var(--accent); cursor: pointer; font-weight: 600; padding: 0; }

/* giriş */
.landing { padding: 3rem 0 2rem; }
.kicker { text-transform: uppercase; letter-spacing: 0.12em; font-size: 0.78rem; font-weight: 600; color: var(--muted); margin: 0 0 0.5rem; }
.landing h1 { font-size: clamp(2.6rem, 7vw, 4.4rem); margin: 0 0 1rem; }
.lead { font-family: var(--serif); font-size: 1.35rem; line-height: 1.55; max-width: 40rem; margin: 0 0 1.75rem; }
.facts { list-style: none; padding: 0; margin: 0 0 2rem; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.facts li { padding: 0.35rem 0.8rem; border-radius: 999px; background: var(--soft); font-size: 0.9rem; }
.cta { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.privacy { color: var(--muted); font-size: 0.9rem; margin: 1rem 0 2.5rem; }
.how { max-width: 40rem; }
.how h2 { font-size: 1.3rem; }
.how li { margin-bottom: 0.35rem; }
.arch-preview { display: grid; grid-template-columns: repeat(auto-fill, minmax(13.5rem, 1fr)); gap: 0.75rem; margin: 2.5rem 0 1.5rem; }
.ap { border: 1px solid var(--line); border-radius: 12px; padding: 0.9rem 1rem; background: var(--card); display: grid; gap: 0.2rem; }
.ap-ic { color: var(--c); }
.ap-ic .ic { width: 1.6rem; height: 1.6rem; }
.ap b { font-family: var(--serif); font-size: 1.05rem; }
.ap small { color: var(--muted); line-height: 1.4; }
.by { color: var(--muted); font-size: 0.88rem; }

/* soru akışı */
.quiz { max-width: 44rem; margin: 0 auto; padding: 2.5rem 0 3rem; }
.progress { height: 6px; border-radius: 6px; background: var(--soft); overflow: hidden; }
.progress i { display: block; height: 100%; background: var(--accent); border-radius: 6px; transition: width 0.3s ease; }
.q-meta { display: flex; justify-content: space-between; color: var(--muted); font-size: 0.85rem; margin: 0.6rem 0 1.25rem; }
.q-card { background: var(--card); border: 1px solid var(--line); border-radius: 18px; padding: 2rem 1.75rem 1.75rem; box-shadow: 0 10px 34px rgba(28, 27, 25, 0.05); animation: rise 0.25s ease; }
@keyframes rise { from { opacity: 0; transform: translateY(8px); } }
.q-part { color: var(--muted); margin: 0 0 0.25rem; font-size: 0.9rem; }
.q-intro { background: var(--soft); border-radius: 10px; padding: 0.75rem 1rem; margin: 0 0 1.25rem; }
.q-text { font-size: clamp(1.35rem, 3.6vw, 1.75rem); margin: 0 0 1.5rem; min-height: 2.4em; }
.opts { display: grid; gap: 0.55rem; }
.opt { display: flex; align-items: center; gap: 0.8rem; width: 100%; text-align: left; padding: 0.85rem 1rem; border: 1px solid var(--line); border-radius: 12px; background: var(--bg); cursor: pointer; transition: border-color 0.12s, background 0.12s, transform 0.12s; }
.opt:hover { border-color: var(--muted); transform: translateX(2px); }
.opt[aria-checked='true'], .opt[aria-pressed='true'] { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, var(--bg)); }
.opt .ol { flex: 1; font-weight: 500; }
.opt kbd { font: 600 0.75rem var(--sans); color: var(--muted); border: 1px solid var(--line); border-radius: 6px; padding: 0.05rem 0.4rem; }
.dot-scale { width: 0.9rem; height: 0.9rem; border-radius: 50%; border: 2px solid var(--accent); flex: none; }
.dot-scale.s0 { opacity: 0.25; } .dot-scale.s1 { opacity: 0.45; } .dot-scale.s2 { opacity: 0.65; } .dot-scale.s3 { opacity: 0.85; }
.dot-scale.s4 { opacity: 1; }
.opt[aria-checked='true'] .dot-scale { background: var(--accent); opacity: 1; }
.stage-opts { display: grid; gap: 0.55rem; }
.opt.stage { font-weight: 500; }
.q-foot { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-top: 1rem; }
.keys { color: var(--muted); font-size: 0.8rem; }
@media (max-width: 560px) { .keys { display: none; } .q-card { padding: 1.5rem 1.1rem 1.25rem; } .opt kbd { display: none; } }

.calc { text-align: center; padding: 6rem 0; color: var(--muted); }
.spinner { width: 2.5rem; height: 2.5rem; margin: 0 auto 1rem; border-radius: 50%; border: 3px solid var(--line); border-top-color: var(--accent); animation: spin 0.8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* rapor */
.report { padding: 2rem 0 2rem; }
.shared-note { background: var(--soft); border-radius: 12px; padding: 0.75rem 1rem; margin-bottom: 1.5rem; font-size: 0.95rem; }
.hero { padding: 2rem 0 1rem; border-bottom: 1px solid var(--line); }
.hero-ic { color: var(--ac); }
.hero-ic .ic { width: 3rem; height: 3rem; }
.hero h1 { font-size: clamp(2.4rem, 6.5vw, 4rem); margin: 0.1rem 0 0.3rem; color: var(--ac); }
.tagline { font-family: var(--serif); font-style: italic; font-size: 1.45rem; margin: 0 0 0.5rem; }
.touch { color: var(--muted); margin: 0 0 1.25rem; }
.summary { font-family: var(--serif); font-size: 1.2rem; line-height: 1.7; max-width: 46rem; }
.toc { display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 1.5rem 0 0.5rem; }
.toc a { font-size: 0.85rem; text-decoration: none; padding: 0.3rem 0.75rem; border-radius: 999px; border: 1px solid var(--line); color: var(--muted); }
.toc a:hover { color: var(--text); border-color: var(--muted); }
.block { padding: 2.5rem 0 1rem; border-bottom: 1px solid var(--line); scroll-margin-top: 1rem; }
.block > h2 { font-size: 1.75rem; margin: 0 0 0.4rem; }
.note { color: var(--muted); margin: 0 0 1.5rem; max-width: 46rem; }
.card { background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 1.1rem 1.25rem; }
.card h3 { font-size: 1.05rem; margin: 0 0 0.5rem; }
.card ul { margin: 0; padding-left: 1.1rem; }
.card li { margin-bottom: 0.3rem; }
.two { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 1.5rem; }
.card.pos h3 { color: #2f9e6b; }
.card.neg h3 { color: #c87a2a; }

.profile-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 2rem; align-items: center; }
.radar svg { width: 100%; height: auto; overflow: visible; }
.rg { fill: none; stroke: var(--line); }
.ra { stroke: var(--line); }
.rp { fill: color-mix(in srgb, var(--ac) 22%, transparent); stroke: var(--ac); stroke-width: 2.5; stroke-linejoin: round; }
.rl { font: 600 12.5px var(--sans); fill: var(--text); }
.rv { fill: var(--muted); font-weight: 400; }
.bars { list-style: none; padding: 0; margin: 0; display: grid; gap: 0.55rem; }
.bars li { display: grid; grid-template-columns: 11.5rem 1fr 2.2rem 6.5rem; align-items: center; gap: 0.6rem; font-size: 0.92rem; }
.bars.areas li { grid-template-columns: 14rem 1fr 2.2rem; }
.bt { height: 10px; border-radius: 10px; background: var(--soft); overflow: hidden; }
.bt i { display: block; height: 100%; border-radius: 10px; background: var(--c, var(--ac)); }
.bars.areas .bt i { background: var(--ac); }
.bv { font-variant-numeric: tabular-nums; font-weight: 600; text-align: right; }
.lv { font-size: 0.75rem; padding: 0.1rem 0.5rem; border-radius: 999px; background: var(--soft); color: var(--muted); text-align: center; white-space: nowrap; }
.lv.l3 { background: color-mix(in srgb, #2f9e6b 16%, var(--card)); color: #2f9e6b; }
.lv.l2 { background: color-mix(in srgb, #3b7dd8 14%, var(--card)); color: #3b7dd8; }
.lv.l0 { background: color-mix(in srgb, #c87a2a 14%, var(--card)); color: #c87a2a; }
.match { margin-top: 1.75rem; }
.match h3 { font-size: 1rem; margin: 0 0 0.6rem; }
.match-row { display: grid; gap: 0.35rem; }
.mr { display: grid; grid-template-columns: 14rem 1fr 3rem; gap: 0.6rem; align-items: center; font-size: 0.88rem; }
.mr i { height: 6px; border-radius: 6px; background: var(--soft); overflow: hidden; }
.mr b { display: block; height: 100%; background: var(--c); }
.mr em { font-style: normal; color: var(--muted); text-align: right; font-variant-numeric: tabular-nums; }

.insights { display: grid; grid-template-columns: repeat(auto-fill, minmax(19rem, 1fr)); gap: 1rem; }
.insight { border-left: 4px solid var(--ac); background: var(--card); border-radius: 0 12px 12px 0; padding: 1rem 1.2rem; border-top: 1px solid var(--line); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.insight h3 { font-size: 1.1rem; margin: 0 0 0.4rem; }
.insight p { margin: 0; }

.dims { display: grid; grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr)); gap: 1rem; }
.dim { background: var(--card); border: 1px solid var(--line); border-top: 4px solid var(--c); border-radius: 14px; padding: 1.1rem 1.25rem 1.2rem; }
.dim header { display: flex; align-items: baseline; gap: 0.6rem; flex-wrap: wrap; }
.dim h3 { margin: 0; font-size: 1.2rem; flex: 1; }
.score { font: 700 1.5rem var(--serif); color: var(--c); }
.score small { font-size: 0.8rem; color: var(--muted); font-weight: 400; }
.meter { height: 6px; border-radius: 6px; background: var(--soft); margin: 0.6rem 0 0.9rem; overflow: hidden; }
.meter i { display: block; height: 100%; background: var(--c); }
.dim p { margin: 0 0 0.7rem; font-size: 0.97rem; }
.dim .what { color: var(--muted); font-size: 0.9rem; }
.dim details { border-top: 1px dashed var(--line); padding-top: 0.6rem; }
.dim summary { cursor: pointer; font-weight: 600; color: var(--c); }
.dim details ul { padding-left: 1.1rem; margin: 0.6rem 0; }
.dim details li { margin-bottom: 0.35rem; font-size: 0.95rem; }
.readline { color: var(--muted); font-size: 0.88rem !important; }

.team-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.big { font-family: var(--serif); font-size: 1.25rem; margin: 0 0 0.3rem; display: flex; align-items: center; gap: 0.5rem; }
.partner .pi { color: var(--c); }
.partner .pi .ic { width: 1.5rem; height: 1.5rem; }
.muted { color: var(--muted); }

.careers { display: grid; grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr)); gap: 1rem; }
.career { background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 1.1rem 1.25rem; }
.ch { display: flex; align-items: center; gap: 0.6rem; }
.rank { width: 1.8rem; height: 1.8rem; border-radius: 50%; display: grid; place-items: center; background: var(--ac); color: #fff; font-weight: 700; font-size: 0.85rem; flex: none; }
.ch h3 { margin: 0; font-size: 1.12rem; flex: 1; }
.fit { font-size: 0.8rem; color: var(--muted); white-space: nowrap; }
.fit b { font-size: 1.05rem; color: var(--text); }
.fitbar { height: 5px; border-radius: 5px; background: var(--soft); margin: 0.6rem 0 0.8rem; overflow: hidden; }
.fitbar i { display: block; height: 100%; background: var(--ac); }
.career p { margin: 0 0 0.6rem; font-size: 0.95rem; }
.why { color: var(--muted); }
.tag { display: inline-block; font-size: 0.78rem; padding: 0.05rem 0.5rem; border-radius: 999px; background: var(--soft); color: var(--text); margin: 0.1rem 0; }
.tag.area { background: color-mix(in srgb, var(--ac) 14%, var(--card)); }
.try { background: var(--soft); border-radius: 10px; padding: 0.6rem 0.8rem; }
.also { font-size: 1.05rem; margin: 1.75rem 0 0.5rem; }
.also-list { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.also-list span { border: 1px solid var(--line); border-radius: 999px; padding: 0.3rem 0.8rem; font-size: 0.9rem; }
.also-list em { font-style: normal; color: var(--muted); }

.stage-card h3 { font-size: 1.2rem; }
.plan { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.pcol { background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 1.1rem 1.25rem; position: relative; }
.days { margin: 0; font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--ac); font-weight: 700; }
.pcol h3 { font-size: 1.1rem; margin: 0.3rem 0 0.6rem; }
.pcol ul { padding-left: 1.1rem; margin: 0; }
.pcol li { margin-bottom: 0.45rem; font-size: 0.95rem; }

.books { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr)); gap: 0.75rem; }
.books li { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 0.9rem 1rem; display: grid; gap: 0.15rem; }
.books b { font-family: var(--serif); font-size: 1.05rem; }
.books span { color: var(--muted); font-size: 0.9rem; }
.books em { font-style: normal; font-size: 0.75rem; color: var(--c); font-weight: 600; }

.actions .btns { display: flex; flex-wrap: wrap; gap: 0.6rem; }
.about { border-bottom: 0; }
.about p { max-width: 46rem; color: var(--muted); }

/* alt bilgi */
.foot { padding: 2.5rem 1.25rem 3rem; display: flex; justify-content: center; }
.foot-brand { display: inline-flex; align-items: center; gap: 0.5rem; text-decoration: none; color: var(--muted); font-family: var(--serif); font-weight: 600; }
.foot-brand img { height: 2rem; width: auto; flex: none; }
@media (prefers-color-scheme: dark) { .foot-brand img { filter: brightness(0) invert(0.92); } }
.foot-brand:hover { color: var(--text); }

@media (max-width: 760px) {
  .profile-grid, .two, .team-grid, .plan { grid-template-columns: 1fr; }
  .bars li { grid-template-columns: 7.5rem 1fr 2rem; }
  .bars li .lv { display: none; }
  .bars.areas li { grid-template-columns: 8.5rem 1fr 2rem; }
  .mr { grid-template-columns: 9rem 1fr 2.6rem; }
  .radar { max-width: 26rem; margin: 0 auto; }
}

/* yazdırma / PDF: sade, mürekkep dostu */
@media print {
  :root { --bg: #fff; --card: #fff; --soft: #f2f2f2; }
  body { font-size: 11pt; }
  .top, .foot, .toc, .actions, .shared-note, .q-foot { display: none !important; }
  .block { break-inside: avoid-page; padding-top: 1.2rem; }
  .dim, .career, .insight, .card, .pcol { break-inside: avoid; box-shadow: none; }
  .dim details { display: block; }
  .dim details > * { display: block; }
  details:not([open]) > :not(summary) { display: block; }
  a { text-decoration: none; }
}