/* BYTE AKADEMİ — sertifika sayfaları (sertifika.php)
   Site teması: koyu #090A0F, fosfor #00FFA3, bakır #D97706. Belgenin kendisi açık renkli "kâğıt"tır
   (yazdırmada A4 yatay). Ölçüler cqw (kapsayıcı genişliği) olduğu için belge ekranda ve yazdırmada aynı oranda ölçeklenir. */

/* ---------- Genel sayfa ---------- */
.cert-page { padding-bottom: clamp(60px, 8vw, 110px); }
.cert-hero .article-title { max-width: 980px; }
.cert-lede { color: var(--ink-dim); font-size: clamp(1rem, 1.5vw, 1.15rem); max-width: 720px; margin-top: 18px; line-height: 1.7; }
.cert-narrow { max-width: 860px; }
.cert-narrow-left { max-width: 860px; margin-left: max(clamp(16px, 3vw, 32px), calc((100% - 1240px) / 2)); }
.cert-section { margin-top: clamp(34px, 5vw, 64px); }
.cert-h2 { font-size: clamp(1.25rem, 2.2vw, 1.6rem); font-weight: 650; letter-spacing: -0.02em; margin-bottom: 20px; }
.cert-h2 span { font-family: var(--font-mono); color: var(--copper); font-weight: 400; margin-right: 6px; }
.cert-h2--big { margin: 0 0 6px; font-size: clamp(1.5rem, 3vw, 2.1rem); }
.cert-h2--list { margin-top: 38px; margin-bottom: 8px; }
.cert-card { padding: clamp(18px, 3vw, 30px); height: auto; }
.cert-help { color: var(--ink-faint); font-size: 13px; line-height: 1.6; margin-top: 12px; }
.cert-help code, .cert-nf code, .cert-meta code { font-family: var(--font-mono); color: var(--phosphor); font-size: .92em; }
.cert-link { color: var(--phosphor); text-decoration: underline; text-underline-offset: 3px; font-size: 14px; }
.cert-warn { color: var(--copper-bright); margin-top: 14px; font-size: 14px; }
.cert-warn-i { color: var(--copper-bright); }
.cert-flash { border: 1px solid rgba(245, 158, 11, .5); background: rgba(245, 158, 11, .07); color: var(--copper-bright); padding: 12px 16px; border-radius: 10px; margin-bottom: 18px; font-size: 14px; }
.cert-note-s { color: var(--ink-faint); font-size: 12.5px; margin-top: 20px; line-height: 1.6; }
.cert-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.cert-inline { display: inline-block; }

/* 3 adım */
.cert-steps { list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.cert-steps .cert-card h3 { font-size: 1.1rem; margin: 10px 0 8px; }
.cert-steps .cert-card p { color: var(--ink-dim); font-size: 14.5px; line-height: 1.65; }
.cert-step-n { font-family: var(--font-mono); font-size: 12px; letter-spacing: .2em; color: var(--copper-bright); }

/* kurs kartları */
.cert-courses { display: grid; gap: 14px; }
.cert-course-card { display: grid; grid-template-columns: auto 1fr auto; gap: 20px; align-items: center; }
.cert-glyph { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 14px; border: 1px solid var(--hairline-2); background: var(--phosphor-faint); color: var(--phosphor); font-family: var(--font-mono); font-weight: 700; font-size: 17px; }
.cert-course-body h3 { font-size: 1.2rem; margin-bottom: 4px; }
.cert-course-body p { color: var(--ink-dim); font-size: 14.5px; margin-bottom: 6px; }
.cert-course-body small { font-family: var(--font-mono); color: var(--ink-faint); font-size: 11.5px; letter-spacing: .06em; }
.cert-course-act { display: grid; gap: 10px; justify-items: end; }
@media (max-width: 720px) {
  .cert-course-card { grid-template-columns: auto 1fr; }
  .cert-course-act { grid-column: 1 / -1; justify-items: start; }
}

/* doğrulama formu */
.cert-verify { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 14px; }
.cert-verify input { flex: 1 1 260px; min-width: 0; background: rgba(255, 255, 255, .04); border: 1px solid var(--hairline-2); color: var(--ink); border-radius: 10px; padding: 13px 15px; font-family: var(--font-mono); font-size: 15px; letter-spacing: .06em; text-transform: uppercase; }
.cert-verify input::placeholder { color: var(--ink-faint); text-transform: none; }
.cert-verify input:focus { outline: none; border-color: var(--phosphor); box-shadow: 0 0 0 3px var(--phosphor-faint); }

/* bulunamadı */
.cert-nf { padding: clamp(28px, 5vw, 56px); text-align: center; }
.cert-nf-ico { width: 64px; height: 64px; margin: 0 auto 18px; display: grid; place-items: center; border-radius: 50%; border: 1px dashed var(--copper); color: var(--copper-bright); font: 700 28px var(--font-mono); }
.cert-nf h1 { font-size: clamp(1.5rem, 3.4vw, 2.2rem); margin-bottom: 10px; letter-spacing: -.02em; }
.cert-nf p { color: var(--ink-dim); max-width: 560px; margin: 0 auto 10px; }
.cert-nf .cert-verify { justify-content: center; max-width: 520px; margin: 16px auto; }
.cert-page:not(.cert-page--doc) > .cert-narrow:first-child { padding-top: calc(var(--header-h) + 50px); }

/* ---------- Sınav ---------- */
.cert-rules { list-style: none; display: grid; gap: 10px; margin-bottom: 22px; }
.cert-rules li { position: relative; padding-left: 22px; color: var(--ink-dim); line-height: 1.65; }
.cert-rules li::before { content: ''; position: absolute; left: 0; top: .7em; width: 10px; height: 1px; background: var(--phosphor); }
.cert-rules b { color: var(--ink); }
.cert-timer { position: sticky; top: calc(var(--header-h) - 30px); z-index: 20; display: flex; gap: 22px; align-items: center; justify-content: space-between; margin-bottom: 18px; padding: 12px 18px; border-radius: 12px; background: rgba(13, 15, 22, .92); border: 1px solid var(--hairline-2); backdrop-filter: blur(10px); }
.cert-timer small { display: block; font-family: var(--font-mono); font-size: 10px; letter-spacing: .2em; color: var(--ink-faint); }
.cert-timer b { font-family: var(--font-mono); font-size: 26px; color: var(--phosphor); letter-spacing: .04em; }
.cert-timer .is-low b { color: #FF6B5B; }
.cert-prog { flex: 1; max-width: 300px; }
.cert-bar { height: 4px; background: var(--hairline-2); border-radius: 4px; margin-top: 6px; overflow: hidden; }
.cert-bar i { display: block; height: 100%; width: 0; background: var(--phosphor); transition: width .25s; }
.cert-q { margin-bottom: 14px; border: 1px solid var(--hairline); min-width: 0; }
.cert-q legend { float: left; width: 100%; font-size: 1.04rem; font-weight: 600; line-height: 1.55; margin-bottom: 14px; }
.cert-q legend + * { clear: both; }
.cert-qn { font-family: var(--font-mono); color: var(--copper-bright); font-size: .85em; margin-right: 8px; }
.cert-opt { display: flex; align-items: flex-start; gap: 12px; padding: 11px 14px; border: 1px solid var(--hairline); border-radius: 10px; margin-top: 8px; cursor: pointer; transition: border-color .2s, background .2s; }
.cert-opt:hover { border-color: var(--hairline-2); background: rgba(255, 255, 255, .025); }
.cert-opt input { position: absolute; opacity: 0; pointer-events: none; }
.cert-opt-k { flex: none; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 6px; border: 1px solid var(--hairline-2); font: 600 12px var(--font-mono); color: var(--ink-dim); }
.cert-opt-t { color: var(--ink-dim); line-height: 1.55; overflow-wrap: anywhere; }
.cert-opt:has(input:checked) { border-color: var(--phosphor-soft); background: var(--phosphor-faint); }
.cert-opt:has(input:checked) .cert-opt-k { background: var(--phosphor); border-color: var(--phosphor); color: #04120C; }
.cert-opt:has(input:checked) .cert-opt-t { color: var(--ink); }
.cert-opt:has(input:focus-visible) { outline: 2px solid var(--phosphor); outline-offset: 2px; }
.cert-submit { margin: 26px 0 10px; display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.cert-submit .cert-help { flex-basis: 100%; margin-top: 0; }

/* sonuç */
.cert-result { display: flex; gap: 26px; align-items: center; }
.cert-score { flex: none; width: 112px; height: 112px; border-radius: 50%; display: grid; place-content: center; text-align: center; border: 2px solid var(--phosphor); box-shadow: 0 0 30px var(--phosphor-faint); }
.cert-score b { font: 700 38px/1 var(--font-mono); }
.cert-score small { font: 12px var(--font-mono); color: var(--ink-faint); }
.cert-result.is-fail .cert-score { border-color: #FF6B5B; box-shadow: 0 0 30px rgba(255, 107, 91, .12); }
.cert-result.is-pass h2 { color: var(--phosphor); }
.cert-result.is-fail h2 { color: #FF8A7B; }
.cert-nameform { display: grid; gap: 16px; max-width: 560px; }
.cert-field { display: grid; gap: 7px; }
.cert-field span { font: 11px var(--font-mono); letter-spacing: .12em; color: var(--ink-dim); text-transform: uppercase; }
.cert-field input { background: rgba(255, 255, 255, .04); border: 1px solid var(--hairline-2); border-radius: 10px; padding: 13px 15px; color: var(--ink); font-size: 17px; font-family: var(--font-display); }
.cert-field input:focus { outline: none; border-color: var(--phosphor); box-shadow: 0 0 0 3px var(--phosphor-faint); }
.cert-check { display: flex; gap: 11px; align-items: flex-start; color: var(--ink-dim); font-size: 14px; line-height: 1.6; cursor: pointer; }
.cert-check input { margin-top: 4px; accent-color: var(--phosphor); width: 17px; height: 17px; flex: none; }
.cert-rq { margin-top: 10px; }
.cert-rq .cert-card { padding: 16px 20px; }
.cert-rq-h { font-weight: 600; line-height: 1.55; }
.cert-rq-m { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; font-size: 12px; margin-right: 8px; vertical-align: 1px; }
.cert-rq.is-ok .cert-rq-m { background: var(--phosphor-faint); color: var(--phosphor); }
.cert-rq.is-bad .cert-rq-m { background: rgba(255, 107, 91, .14); color: #FF8A7B; }
.cert-rq.is-bad { border-color: rgba(255, 107, 91, .25); }
.cert-rq-you { margin-top: 8px; color: var(--ink-dim); font-size: 14px; }
.cert-rq-you s { color: #FF8A7B; }
.cert-rq-right { color: var(--ink-dim); font-size: 14px; margin-top: 3px; }
.cert-rq-right b { color: var(--phosphor); }
.cert-rq-why { margin-top: 8px; padding: 10px 14px; border-left: 2px solid var(--copper); background: var(--copper-faint); border-radius: 0 8px 8px 0; font-size: 14px; line-height: 1.65; color: var(--ink-dim); }
@media (max-width: 560px) { .cert-result { flex-direction: column; text-align: center; } .cert-timer { top: 8px; } }

/* egitim.php içindeki "Final sınavı ve sertifika" bölümü */
.edu-cert-cta { margin: 44px 0 10px; display: grid; grid-template-columns: auto 1fr; gap: 20px; align-items: start; padding: clamp(18px, 3vw, 28px); border: 1px solid var(--hairline-2); border-radius: 14px; background: linear-gradient(135deg, var(--phosphor-faint), rgba(217, 119, 6, .06)); }
.edu-cert-cta .edu-cert-ico { width: 52px; height: 52px; border-radius: 14px; display: grid; place-items: center; color: var(--phosphor); border: 1px solid var(--phosphor-soft); }
.edu-cert-cta .edu-cert-ico svg { width: 26px; height: 26px; }
.edu-cert-cta .edu-h2 { margin-bottom: 8px; }
.edu-cert-cta p { color: var(--ink-dim); margin-bottom: 16px; max-width: 640px; line-height: 1.65; }
@media (max-width: 560px) { .edu-cert-cta { grid-template-columns: 1fr; } }

/* ---------- Belge sayfası (ekran) ---------- */
.cert-page--doc { padding-top: calc(var(--header-h) + 34px); }
.cert-doc-wrap { max-width: 1180px; }
.cert-band { display: flex; align-items: center; gap: 16px; padding: 16px 22px; border-radius: 12px; margin-bottom: 26px; font-size: clamp(.95rem, 1.6vw, 1.2rem); line-height: 1.45; }
.cert-band b { letter-spacing: .06em; }
.cert-band-ico { flex: none; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; font: 700 22px var(--font-mono); }
.cert-band--ok { background: linear-gradient(90deg, rgba(0, 255, 163, .18), rgba(0, 255, 163, .06)); border: 1px solid rgba(0, 255, 163, .55); color: #B9FFE3; }
.cert-band--ok .cert-band-ico { background: var(--phosphor); color: #04120C; }
.cert-band--ok b { color: var(--phosphor); }
.cert-band--bad { background: linear-gradient(90deg, rgba(255, 90, 70, .2), rgba(255, 90, 70, .07)); border: 1px solid rgba(255, 107, 91, .6); color: #FFD2CB; }
.cert-band--bad .cert-band-ico { background: #FF5A46; color: #1A0603; }
.cert-band--bad b { color: #FF8A7B; }

.cert-frame { container-type: inline-size; width: 100%; max-width: 1123px; margin: 0 auto; aspect-ratio: 297 / 210; position: relative; box-shadow: 0 30px 80px rgba(0, 0, 0, .55), 0 0 0 1px rgba(255, 255, 255, .06); border-radius: .5cqw; }
.cert { --mm: .3367cqw; --paper: #FBF8F0; --ink: #14171F; --dim: #4A4F5C; --cu: #B8651B; --gr: #0A9D68; position: absolute; inset: 0; overflow: hidden; background: var(--paper); color: var(--ink); font-family: 'Geist', 'Segoe UI', sans-serif; border-radius: inherit;
  background-image: radial-gradient(ellipse at 50% 42%, #FFFDF7 0%, var(--paper) 60%, #F3EEDF 100%); }
.cert-traces, .cert-guil { position: absolute; pointer-events: none; }
.cert-traces { inset: 0; width: 100%; height: 100%; }
.cert-guil { left: 50%; top: 47%; width: 58cqw; height: 58cqw; transform: translate(-50%, -50%); opacity: .2; }
.cert-border { position: absolute; inset: calc(7 * var(--mm)); border: calc(.9 * var(--mm)) solid var(--cu); }
.cert-border::after { content: ''; position: absolute; inset: calc(1.6 * var(--mm)); border: calc(.3 * var(--mm)) solid var(--gr); }
.cert > *:not(svg):not(.cert-border) { position: relative; z-index: 2; }

.cert-head { position: absolute !important; left: calc(20 * var(--mm)); right: calc(20 * var(--mm)); top: calc(14 * var(--mm)); display: flex; justify-content: space-between; align-items: center; }
.cert-brand { display: flex; align-items: center; gap: calc(3.2 * var(--mm)); }
.cert-logo { width: calc(13 * var(--mm)); height: calc(13 * var(--mm)); display: block; }
.cert-brand-n { font: 700 calc(5.2 * var(--mm)) 'JetBrains Mono', monospace; letter-spacing: .14em; color: var(--ink); }
.cert-brand-n em { color: var(--cu); font-style: normal; }
.cert-brand-s { font: calc(3 * var(--mm)) 'JetBrains Mono', monospace; letter-spacing: .1em; color: var(--dim); margin-top: calc(.6 * var(--mm)); }
.cert-no { text-align: right; }
.cert-no small { display: block; font: calc(2.6 * var(--mm)) 'JetBrains Mono', monospace; letter-spacing: .2em; color: var(--dim); }
.cert-no b { font: 700 calc(4.2 * var(--mm)) 'JetBrains Mono', monospace; letter-spacing: .06em; color: var(--cu); }

.cert-title { position: absolute !important; left: 0; right: 0; top: calc(32 * var(--mm)); text-align: center; }
.cert-title h1 { font: 600 calc(10.5 * var(--mm)) 'Fraunces', Georgia, serif; letter-spacing: .13em; line-height: 1.1; color: var(--ink); max-width: none; text-wrap: nowrap; }
.cert-title-2 { font: 500 calc(3.7 * var(--mm)) 'JetBrains Mono', monospace; letter-spacing: .5em; color: var(--cu); margin-top: calc(2.2 * var(--mm)); text-indent: .5em; }
.cert-rule { display: flex; justify-content: center; align-items: center; gap: calc(3 * var(--mm)); margin-top: calc(3.4 * var(--mm)); }
.cert-rule i { width: calc(34 * var(--mm)); height: calc(.35 * var(--mm)); background: linear-gradient(90deg, transparent, var(--cu)); }
.cert-rule i:last-child { background: linear-gradient(270deg, transparent, var(--cu)); }
.cert-rule b { width: calc(2.4 * var(--mm)); height: calc(2.4 * var(--mm)); background: var(--gr); transform: rotate(45deg); }

.cert-lead { position: absolute !important; left: 0; right: 0; top: calc(66 * var(--mm)); text-align: center; font: italic 400 calc(4.2 * var(--mm)) 'Fraunces', Georgia, serif; color: var(--dim); }
.cert-name { position: absolute !important; left: calc(14 * var(--mm)); right: calc(14 * var(--mm)); top: calc(73 * var(--mm)); text-align: center; font: italic 500 calc(13 * var(--mm)) 'Fraunces', Georgia, serif; line-height: 1.2; color: var(--ink); padding-bottom: calc(1.6 * var(--mm)); border-bottom: calc(.35 * var(--mm)) solid var(--cu); width: max-content; max-width: calc(100% - 28 * var(--mm)); margin-inline: auto; overflow-wrap: anywhere; }
.cert-lead--2 { top: calc(95 * var(--mm)); }
.cert-course { position: absolute !important; left: calc(14 * var(--mm)); right: calc(14 * var(--mm)); top: calc(103 * var(--mm)); text-align: center; font: 600 calc(7.4 * var(--mm)) 'Fraunces', Georgia, serif; letter-spacing: .01em; color: var(--ink); }
.cert-facts { position: absolute !important; left: calc(40 * var(--mm)); right: calc(40 * var(--mm)); top: calc(121 * var(--mm)); display: flex; justify-content: space-between; text-align: center; }
.cert-facts div { flex: 1; position: relative; }
.cert-facts div + div::before { content: ''; position: absolute; left: 0; top: 10%; bottom: 10%; width: calc(.3 * var(--mm)); background: linear-gradient(transparent, var(--cu), transparent); }
.cert-facts dt { font: calc(2.7 * var(--mm)) 'JetBrains Mono', monospace; letter-spacing: .22em; color: var(--dim); }
.cert-facts dd { font: 600 calc(6 * var(--mm)) 'Fraunces', Georgia, serif; color: var(--ink); margin-top: calc(.8 * var(--mm)); }
.cert-facts dd small { font-size: .55em; color: var(--dim); }

.cert-foot { position: absolute !important; left: calc(20 * var(--mm)); right: calc(20 * var(--mm)); bottom: calc(22 * var(--mm)); display: flex; justify-content: space-between; align-items: flex-end; }
.cert-qr { width: calc(40 * var(--mm)); }
.cert-qr-box { width: calc(27 * var(--mm)); height: calc(27 * var(--mm)); padding: calc(1 * var(--mm)); background: #FBF8F0; border: calc(.35 * var(--mm)) solid var(--cu); }
.cert-qr-box svg { width: 100%; height: 100%; display: block; }
.cert-qr small { display: block; width: calc(52 * var(--mm)); overflow-wrap: anywhere; margin-top: calc(1.6 * var(--mm)); font: calc(2.3 * var(--mm))/1.5 'JetBrains Mono', monospace; color: var(--dim); }
.cert-qr small span { color: var(--cu); font-size: .92em; }
.cert-seal { position: absolute; left: 50%; bottom: calc(-4 * var(--mm)); width: calc(38 * var(--mm)); height: calc(38 * var(--mm)); transform: translateX(-50%); }
.cert-sign { width: calc(78 * var(--mm)); text-align: center; }
.cert-sign-hand { font: italic 500 calc(9 * var(--mm)) 'Fraunces', Georgia, serif; color: #1F3A8A; line-height: 1; transform: rotate(-3deg); letter-spacing: .01em; }
.cert-sign-line { height: calc(.35 * var(--mm)); background: var(--ink); margin: calc(1 * var(--mm)) 0 calc(1.6 * var(--mm)); }
.cert-sign-name { font: 700 calc(3.5 * var(--mm)) 'Geist', sans-serif; color: var(--ink); }
.cert-sign-role { font: calc(2.7 * var(--mm))/1.4 'Geist', sans-serif; color: var(--dim); margin-top: calc(.4 * var(--mm)); }
.cert-note { position: absolute !important; left: calc(20 * var(--mm)); right: calc(20 * var(--mm)); bottom: calc(10.5 * var(--mm)); text-align: center; font: calc(2.4 * var(--mm))/1.4 'Geist', sans-serif; color: var(--dim); }
.cert-stamp { position: absolute !important; left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(-14deg); border: calc(1.4 * var(--mm)) solid rgba(214, 40, 25, .7); color: rgba(214, 40, 25, .7); font: 800 calc(16 * var(--mm)) 'JetBrains Mono', monospace; letter-spacing: .1em; padding: calc(2 * var(--mm)) calc(7 * var(--mm)); z-index: 5 !important; border-radius: calc(2 * var(--mm)); white-space: nowrap; background: rgba(251, 248, 240, .35); }
.cert-frame.is-revoked .cert { filter: grayscale(.6); }

.cert-actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin-top: 30px; }
.cert-share { display: flex; gap: 14px; justify-content: center; align-items: center; margin-top: 18px; font: 12px var(--font-mono); letter-spacing: .1em; color: var(--ink-faint); text-transform: uppercase; }
.cert-share a { color: var(--ink-dim); padding: 6px 12px; border: 1px solid var(--hairline-2); border-radius: 999px; transition: .25s; }
.cert-share a:hover { color: var(--phosphor); border-color: var(--phosphor-soft); }
.cert-verify-box { margin-top: 46px; max-width: 860px; margin-inline: auto; padding: clamp(18px, 3vw, 28px); border: 1px solid var(--hairline); border-radius: 14px; background: rgba(255, 255, 255, .02); }
.cert-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px 24px; margin-bottom: 14px; }
.cert-meta dt { font: 10.5px var(--font-mono); letter-spacing: .18em; color: var(--ink-faint); text-transform: uppercase; }
.cert-meta dd { color: var(--ink); overflow-wrap: anywhere; }

/* ---------- Yazdırma: A4 yatay, tek sayfa, site kabuğu gizli ---------- */
@page { size: A4 landscape; margin: 0; }
@media print {
  html, body { background: #fff !important; height: auto !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; }
  body > *:not(main) { display: none !important; }
  .no-print { display: none !important; }
  main.cert-page { padding: 0 !important; margin: 0 !important; }
  .cert-doc-wrap { max-width: none !important; width: auto !important; margin: 0 !important; padding: 0 !important; }
  .cert-frame { width: 297mm !important; max-width: none !important; height: 209.4mm !important; aspect-ratio: auto; margin: 0 !important; box-shadow: none !important; border-radius: 0 !important; break-inside: avoid; page-break-after: avoid; overflow: hidden; }
  .cert { border-radius: 0 !important; }
  * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }
}