/* ==========================================================================
   Dersi Anlat — herkese açık site (oturumsuz ana sayfa)
   app.css'teki token'ların üzerine kurulur; yalnız body.site altında geçerlidir. Beyaz / çok açık yüzeyler,
   lacivert + logo mavisi, bol boşluk, küçük köşe, ince sınır. Harici font, CDN, renk geçişi, gömülü stil yok.
   Bölümler: 1 tokens · 2 header/drawer/footer · 3 hero · 4 dersler · 5 ders önizleme · 6 adımlar · 7 bugün
             8 etkinlikler · 9 son çağrı · 10 responsive · 11 ders keşfi (/dersler katalog + ders hub'ı)
             12 hafta/konu sayfası (eğitim yayını hissi: hero + tek okunabilir sütun)
   ========================================================================== */

/* 1. TOKENS — public yüzey logo renklerini kullanır (lacivert #0d2b51, mavi #0464fb) */
body.site {
    --site-navy: #0d2b51;
    --site-navy-2: #35507a;
    --color-bg: #ffffff;
    --color-surface: #ffffff;
    --color-surface-muted: #f6f8fc;
    --color-text: #16233c;
    --color-text-2: #4b5565;
    --color-text-3: #6b7486;
    --color-border: #e4e9f1;
    --color-border-strong: #cbd4e2;
    --color-accent: #0464fb;
    --color-accent-hover: #0352d1;
    --color-accent-soft: #eaf2ff;
    --color-focus: #0464fb;
    --site-max: 1180px;
    --site-gutter: var(--space-6);
    background: #fff;
    color: var(--color-text);
}
body.site h1, body.site h2, body.site h3 { color: var(--site-navy); letter-spacing: -0.02em; }
body.site .btn { border-radius: 8px; font-weight: 600; }
body.site .btn--secondary { border-color: var(--color-border-strong); color: var(--site-navy); }
body.site .btn--secondary:hover { background: var(--color-surface-muted); border-color: var(--site-navy-2); }
body.site .btn--lg { padding: 0 var(--space-5); }

.site-eyebrow {
    margin: 0 0 var(--space-3);
    font-size: 0.75rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase;
    color: var(--color-text-3);
}
.site-actions { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.site-more {
    display: inline-flex; align-items: center; gap: 6px; min-height: var(--control);
    font-weight: 600; color: var(--color-accent); white-space: nowrap;
}
.site-more:hover { text-decoration: none; color: var(--color-accent-hover); }

/* 2. HEADER / DRAWER / FOOTER */
.site-header {
    position: sticky; top: 0; z-index: 40;
    background: rgba(255, 255, 255, 0.96);
    border-bottom: 1px solid var(--color-border);
}
.site-header__inner {
    max-width: var(--site-max); margin: 0 auto; padding: 0 var(--site-gutter);
    min-height: 72px; display: flex; align-items: center; gap: var(--space-6);
}
.site-brand { display: inline-flex; align-items: center; flex: none; min-height: var(--control); }
.site-brand:hover { text-decoration: none; }
.site-brand__logo { display: block; height: 34px; width: auto; }
.site-nav { display: flex; gap: var(--space-1); flex: 1; }
.site-nav__link {
    display: inline-flex; align-items: center; min-height: var(--control); padding: 0 var(--space-3);
    border-radius: 8px; color: var(--color-text-2); font-weight: 500;
    transition: background var(--ease), color var(--ease);
}
.site-nav__link:hover { background: var(--color-surface-muted); color: var(--site-navy); text-decoration: none; }
.site-header__actions { display: flex; align-items: center; gap: var(--space-2); margin-left: auto; }
.site-header__menu {
    display: none; align-items: center; justify-content: center;
    width: var(--control); height: var(--control); border: 0; border-radius: 8px;
    background: transparent; color: var(--site-navy); cursor: pointer;
}
.site-header__menu[aria-expanded="true"] { background: var(--color-accent-soft); color: var(--color-accent); }

.site-drawer { position: fixed; inset: 0; z-index: 60; }
.site-drawer[hidden] { display: none; }
.site-drawer__backdrop { position: absolute; inset: 0; background: rgba(13, 43, 81, 0.4); }
.site-drawer__panel {
    position: absolute; top: 0; right: 0; bottom: 0;
    display: flex; flex-direction: column;
    width: min(320px, 86vw); background: #fff;
    box-shadow: -8px 0 32px rgba(13, 43, 81, 0.18);
    overflow-y: auto; padding-bottom: env(safe-area-inset-bottom, 0px);
    animation: site-drawer-in 0.2s ease;
}
@keyframes site-drawer-in { from { transform: translateX(24px); opacity: 0; } to { transform: none; opacity: 1; } }
.site-drawer__head { display: flex; align-items: center; justify-content: space-between; padding: 14px 8px 14px 16px; border-bottom: 1px solid var(--color-border); }
.site-drawer__head .site-brand__logo { height: 28px; }
.site-drawer__close {
    display: inline-flex; align-items: center; justify-content: center;
    width: var(--control); height: var(--control); border: 0; border-radius: 8px; background: transparent; color: var(--site-navy); cursor: pointer;
}
.site-drawer__links { display: flex; flex-direction: column; gap: 2px; padding: 12px; }
.site-drawer__link {
    display: flex; align-items: center; min-height: 48px; padding: 0 var(--space-3);
    border-radius: 8px; color: var(--site-navy); font-weight: 500; font-size: var(--text-md);
}
.site-drawer__link:hover { background: var(--color-surface-muted); text-decoration: none; }
.site-drawer__foot { margin-top: auto; padding: 12px; border-top: 1px solid var(--color-border); }

.site-main { display: block; }

.site-footer { border-top: 1px solid var(--color-border); background: #fff; }
.site-footer__inner {
    max-width: var(--site-max); margin: 0 auto; padding: var(--space-6) var(--site-gutter);
    display: flex; align-items: center; gap: var(--space-6); flex-wrap: wrap;
}
.site-footer .site-brand__logo { height: 28px; }
.site-footer__nav { display: flex; gap: var(--space-4); flex-wrap: wrap; }
.site-footer__link { display: inline-flex; align-items: center; min-height: var(--control); color: var(--color-text-2); font-weight: 500; }
.site-footer__link:hover { color: var(--site-navy); }
.site-footer__note { margin: 0 0 0 auto; color: var(--color-text-3); font-size: var(--text-sm); }

/* 3. HERO */
.site-hero { padding: var(--space-8) 0 var(--space-7); }
.site-hero__inner {
    max-width: var(--site-max); margin: 0 auto; padding: 0 var(--site-gutter);
    display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: var(--space-7); align-items: center;
}
.site-hero__title { font-size: clamp(2.25rem, 4.2vw, 3.5rem); line-height: 1.05; font-weight: 700; margin: 0 0 var(--space-5); }
.site-hero__accent { color: var(--color-accent); }
.site-hero__lead { font-size: var(--text-lg); line-height: 1.55; color: var(--color-text-2); max-width: 32rem; margin: 0 0 var(--space-6); }

/* Ürün ekranı çerçevesi: ince sınır, küçük köşe, hafif gölge; görsel boyutu sabit (CLS yok) */
.site-shot { margin: 0; min-width: 0; }
.site-shot__frame {
    border: 1px solid var(--color-border); border-radius: 12px; overflow: hidden;
    background: #fff; box-shadow: 0 18px 48px rgba(13, 43, 81, 0.10), 0 1px 2px rgba(13, 43, 81, 0.06);
}
.site-shot__frame img { display: block; width: 100%; height: auto; }
.site-shot__caption { margin: var(--space-3) 0 0; font-size: var(--text-sm); color: var(--color-text-3); }
.site-hero__shot .site-shot__frame { border-radius: 14px; }

/* 4. BÖLÜM İSKELETİ + DERSLER */
.site-section { padding: var(--space-8) 0; }
.site-section__inner { max-width: var(--site-max); margin: 0 auto; padding: 0 var(--site-gutter); }
.site-section__head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-5); margin-bottom: var(--space-6); }
.site-section__title { font-size: clamp(1.625rem, 2.6vw, 2.25rem); font-weight: 700; line-height: 1.15; margin: 0 0 var(--space-2); }
.site-section__lead { font-size: var(--text-md); color: var(--color-text-2); max-width: 44rem; margin: 0; }
.site-courses { border-top: 1px solid var(--color-border); }

.course-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-5); list-style: none; margin: 0; padding: 0; }
.course-card {
    display: flex; flex-direction: column; height: 100%;
    border: 1px solid var(--color-border); border-radius: 12px; overflow: hidden;
    background: #fff; color: inherit;
    transition: border-color var(--ease), box-shadow var(--ease), transform var(--ease);
}
a.course-card:hover { text-decoration: none; border-color: var(--color-border-strong); box-shadow: 0 10px 30px rgba(13, 43, 81, 0.08); transform: translateY(-2px); }
a.course-card:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
.course-card__cover { display: block; width: 100%; aspect-ratio: 3 / 2; height: auto; object-fit: cover; background: var(--color-surface-muted); }
.course-card__cover--plain {
    position: relative; display: flex; align-items: center; justify-content: center;
    background: var(--color-surface-muted); border-bottom: 1px solid var(--color-border);
}
.course-card__grade-mark { font-size: 5rem; font-weight: 700; line-height: 1; color: #d7e1f0; letter-spacing: -0.04em; }
.course-card__soon {
    position: absolute; left: 14px; bottom: 12px;
    padding: 4px 10px; border-radius: 999px; border: 1px solid var(--color-border-strong);
    background: #fff; color: var(--color-text-2); font-size: 0.75rem; font-weight: 600;
}
.course-card__body { padding: var(--space-4) var(--space-4) var(--space-3); flex: 1; }
.course-card__grade { margin: 0 0 2px; font-size: var(--text-sm); font-weight: 600; color: var(--color-accent); }
.course-card__title { font-size: var(--text-lg); margin: 0 0 var(--space-2); }
.course-card__summary { margin: 0; font-size: var(--text-sm); color: var(--color-text-2); line-height: 1.5; }
.course-card__foot {
    display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap;
    padding: var(--space-3) var(--space-4) var(--space-4); border-top: 1px solid var(--color-border);
    font-size: 0.75rem; color: var(--color-text-3);
}
.course-card__fact { display: inline-flex; align-items: center; gap: 5px; }
.course-card__go {
    display: inline-flex; align-items: center; justify-content: center; margin-left: auto;
    width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--color-border-strong); color: var(--color-accent);
}
a.course-card:hover .course-card__go { background: var(--color-accent); border-color: var(--color-accent); color: #fff; }
.course-card--coming .course-card__title { color: var(--site-navy-2); }

/* 5. GERÇEK BİR DERSİN İÇİNDEN */
.site-lesson { background: var(--color-surface-muted); border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }
.site-lesson__inner { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--space-7); align-items: start; }
.site-lesson__copy .site-section__lead { margin-bottom: var(--space-5); }
.site-lesson__meta { margin: var(--space-4) 0 0; font-size: var(--text-sm); color: var(--color-text-3); }

.lesson-preview { border: 1px solid var(--color-border); border-radius: 12px; background: #fff; overflow: hidden; }
.lesson-preview__head { display: flex; flex-direction: column; gap: 2px; padding: var(--space-4) var(--space-5); border-bottom: 1px solid var(--color-border); }
.lesson-preview__kicker { font-size: 0.8125rem; font-weight: 600; color: var(--color-text-3); }
.lesson-preview__title { font-size: var(--text-lg); font-weight: 600; color: var(--site-navy); }
.lesson-preview__grid { display: flex; flex-direction: column; }
.lesson-preview__shot { order: -1; padding: var(--space-4) var(--space-5) 0; }
.lesson-preview__flow { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); padding: var(--space-4) var(--space-5) var(--space-5); }
.lesson-preview__session-title {
    display: flex; align-items: center; gap: var(--space-2);
    font-size: var(--text-base); font-weight: 600; margin: 0 0 var(--space-2);
}
.lesson-preview__num {
    display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%;
    font-size: 0.75rem; font-weight: 700; color: #fff;
}
.lesson-preview__session--classroom .lesson-preview__num { background: var(--tone-warm); }
.lesson-preview__session--lab .lesson-preview__num { background: var(--tone-cool); }
.lesson-preview__session--activity .lesson-preview__num { background: var(--tone-sage); }
.lesson-preview__dur { margin-left: auto; font-size: 0.8125rem; font-weight: 500; color: var(--color-text-3); }
.lesson-preview__steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.lesson-preview__step {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "kind dur" "title dur";
    column-gap: var(--space-3); padding: 8px 0 8px 12px; border-left: 2px solid var(--color-border);
}
.lesson-preview__session--classroom .lesson-preview__step { border-left-color: #efdfc4; }
.lesson-preview__session--lab .lesson-preview__step { border-left-color: #cfe2ec; }
.lesson-preview__step--mini_etkinlik, .lesson-preview__step--kontrol { background: var(--color-surface-muted); border-radius: 0 6px 6px 0; }
.lesson-preview__kind { grid-area: kind; font-size: 0.75rem; font-weight: 600; letter-spacing: 0.02em; color: var(--color-text-3); }
.lesson-preview__step-title { grid-area: title; font-size: var(--text-sm); font-weight: 500; color: var(--color-text); }
.lesson-preview__step-dur { grid-area: dur; align-self: center; font-size: 0.75rem; color: var(--color-text-3); white-space: nowrap; }
.lesson-preview__shot .site-shot__frame { box-shadow: 0 8px 24px rgba(13, 43, 81, 0.08); }
.lesson-preview__shot .site-shot__caption { margin-top: var(--space-2); }

/* 6. NASIL YARDIMCI OLUR — editoryal üç adım */
.steps-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-6); list-style: none; margin: var(--space-6) 0 0; padding: 0; }
.steps-row__item { padding-top: var(--space-4); border-top: 2px solid var(--site-navy); }
.steps-row__num { display: block; font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.08em; color: var(--color-accent); margin-bottom: var(--space-3); }
.steps-row__title { font-size: var(--text-xl); margin: 0 0 var(--space-2); }
.steps-row__text { margin: 0; color: var(--color-text-2); }

/* 7. BUGÜNKÜ DERS / ÇALIŞMA ALANI */
.site-today { background: var(--color-surface-muted); border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }
.site-today__inner { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-7); align-items: center; }
.site-today__shot { margin: 0; display: flex; flex-direction: column; align-items: center; }
.site-phone {
    width: min(300px, 100%); border: 1px solid var(--color-border-strong); border-radius: 28px; padding: 10px;
    background: #fff; box-shadow: 0 18px 48px rgba(13, 43, 81, 0.10);
}
.site-phone img { display: block; width: 100%; height: auto; border-radius: 20px; }
.site-facts { list-style: none; margin: var(--space-5) 0 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-3); }
.site-facts__item { display: flex; gap: var(--space-3); align-items: flex-start; color: var(--color-text-2); }
.site-facts__item .icon { color: var(--color-accent); margin-top: 3px; }
.site-facts__item strong { color: var(--site-navy); }

/* 8. TAHTA ETKİNLİKLERİ */
.activity-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); list-style: none; margin: 0; padding: 0; }
.activity-card { border: 1px solid var(--color-border); border-radius: 12px; overflow: hidden; background: #fff; display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); }
.activity-card__shot { border-right: 1px solid var(--color-border); background: var(--color-surface-muted); }
.activity-card__shot img { display: block; width: 100%; height: auto; }
.activity-card__body { padding: var(--space-4); display: flex; flex-direction: column; }
.activity-card__title { font-size: var(--text-md); margin: 0 0 6px; }
.activity-card__text { margin: 0 0 var(--space-3); font-size: var(--text-sm); color: var(--color-text-2); line-height: 1.5; }
.activity-card__source { margin: auto 0 0; font-size: 0.75rem; color: var(--color-text-3); }

/* 9. SON ÇAĞRI */
.site-cta { padding: var(--space-8) 0; }
.site-cta__inner {
    display: flex; align-items: center; justify-content: space-between; gap: var(--space-6); flex-wrap: wrap;
    padding: var(--space-7) var(--space-7); border: 1px solid var(--color-border); border-radius: 16px; background: var(--site-navy);
}
body.site .site-cta__title { color: #fff; font-size: clamp(1.75rem, 3vw, 2.5rem); font-weight: 700; margin: 0 0 var(--space-2); }
.site-cta__lead { color: #c9d6ea; font-size: var(--text-md); margin: 0; }
.site-cta .btn--primary { background: #fff; color: var(--site-navy); }
.site-cta .btn--primary:hover { background: #eaf2ff; }
.site-cta .btn--ghost { color: #fff; }
.site-cta .btn--ghost:hover { background: rgba(255, 255, 255, 0.12); }

/* 10. RESPONSIVE */
@media (max-width: 1100px) {
    .course-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .activity-grid { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
    body.site { --site-gutter: var(--space-5); }
    .site-hero { padding: var(--space-7) 0 var(--space-6); }
    .site-hero__inner, .site-lesson__inner, .site-today__inner { grid-template-columns: 1fr; gap: var(--space-6); }
    .site-today__shot { order: 2; }
    .steps-row { grid-template-columns: 1fr; gap: var(--space-5); }
    .site-section { padding: var(--space-7) 0; }
    .site-section__head { flex-direction: column; align-items: flex-start; gap: var(--space-2); }
}
@media (max-width: 768px) {
    .site-header__inner { min-height: 60px; gap: var(--space-3); }
    .site-brand__logo { height: 28px; }
    .site-nav, .site-header__login { display: none; }
    .site-header__menu { display: inline-flex; }
    .site-header__actions .btn--primary { min-height: 40px; padding: 0 var(--space-3); font-size: var(--text-sm); }
    .site-footer__inner { align-items: flex-start; flex-direction: column; gap: var(--space-3); }
    .site-footer__note { margin-left: 0; }
    .site-cta__inner { padding: var(--space-6) var(--space-5); border-radius: 12px; }
}
@media (max-width: 560px) {
    body.site { --site-gutter: var(--space-4); }
    .course-grid { grid-template-columns: 1fr; }
    .activity-card { grid-template-columns: 1fr; }
    .activity-card__shot { border-right: 0; border-bottom: 1px solid var(--color-border); }
    .site-actions .btn { flex: 1 1 100%; }
    .site-hero__title { font-size: 2.25rem; }
    .lesson-preview__head, .lesson-preview__flow, .lesson-preview__shot { padding-left: var(--space-4); padding-right: var(--space-4); }
    .lesson-preview__flow { grid-template-columns: 1fr; }
}

/* 11. DERS KEŞFİ — /dersler kataloğu ve /dersler/{slug} hub'ı (editoryal müfredat listesi; kart duvarı değil) */
.site-page-head { padding: var(--space-7) 0 var(--space-6); border-bottom: 1px solid var(--color-border); }
.site-page-head__title { font-size: clamp(2rem, 3.6vw, 3rem); font-weight: 700; line-height: 1.1; margin: 0 0 var(--space-4); }
.site-page-head__lead { font-size: var(--text-lg); color: var(--color-text-2); max-width: 40rem; margin: 0; }
.site-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: -10px 0 var(--space-4); font-size: var(--text-sm); color: var(--color-text-3); }
.site-crumbs a { display: inline-flex; align-items: center; min-height: 40px; color: var(--color-text-2); }
.site-crumbs a:hover { color: var(--site-navy); }
.site-crumbs__sep { color: var(--color-border-strong); }
.site-crumbs [aria-current="page"] { color: var(--site-navy); font-weight: 500; }
.site-tag {
    display: inline-flex; align-items: center; padding: 3px 10px; border-radius: 999px;
    border: 1px solid var(--color-border-strong); background: #fff; color: var(--color-text-2);
    font-size: 0.75rem; font-weight: 600; letter-spacing: 0.01em;
}
.site-tag--ready { border-color: #bfe0c9; background: var(--color-success-soft); color: var(--color-success); }

/* Katalog: büyük yatay kartlar, iki sütun */
.catalog { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); }
.catalog-card {
    display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); height: 100%;
    border: 1px solid var(--color-border); border-radius: 14px; overflow: hidden; background: #fff; color: inherit;
    transition: border-color var(--ease), box-shadow var(--ease), transform var(--ease);
}
a.catalog-card:hover { text-decoration: none; border-color: var(--color-border-strong); box-shadow: 0 12px 32px rgba(13, 43, 81, 0.08); transform: translateY(-2px); }
a.catalog-card:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
.catalog-card__cover { display: block; width: 100%; height: 100%; min-height: 220px; object-fit: cover; background: var(--color-surface-muted); }
.catalog-card__cover--plain { display: flex; align-items: center; justify-content: center; border-right: 1px solid var(--color-border); }
.catalog-card__body { display: flex; flex-direction: column; padding: var(--space-5); }
.catalog-card__meta { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); margin: 0 0 var(--space-2); }
.catalog-card__grade { font-size: var(--text-sm); font-weight: 600; color: var(--color-accent); }
.catalog-card__title { font-size: var(--text-xl); line-height: 1.2; margin: 0 0 var(--space-2); }
.catalog-card--coming .catalog-card__title { color: var(--site-navy-2); }
.catalog-card__summary { margin: 0 0 var(--space-4); color: var(--color-text-2); font-size: var(--text-sm); line-height: 1.55; }
.catalog-card__facts { display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-4); margin: auto 0 0; font-size: 0.8125rem; color: var(--color-text-3); }
.catalog-card__cta { display: inline-flex; align-items: center; gap: 6px; margin-top: var(--space-4); font-weight: 600; color: var(--color-accent); }
a.catalog-card:hover .catalog-card__cta { color: var(--color-accent-hover); }

/* Hub üst bölüm: ferah metin, güçlü görsel, sakin metadata */
.site-hub-head { padding: var(--space-7) 0 var(--space-7); }
.site-hub-head__inner { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: var(--space-8); align-items: center; }
.site-hub-head .site-page-head__title { max-width: 18ch; margin-bottom: var(--space-4); }
.site-hub-head .site-page-head__lead { max-width: 34rem; font-size: var(--text-md); line-height: 1.6; }
.site-hub-facts { margin: var(--space-5) 0 var(--space-6); display: flex; flex-direction: column; border-top: 1px solid var(--color-border); max-width: 34rem; }
.site-hub-facts__item { display: grid; grid-template-columns: 172px minmax(0, 1fr); gap: var(--space-4); padding: 10px 0; border-bottom: 1px solid var(--color-border); align-items: baseline; }
.site-hub-facts__key { display: inline-flex; align-items: center; gap: 8px; font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.01em; color: var(--color-text-3); }
.site-hub-facts__key .icon { color: var(--color-accent); }
.site-hub-facts__val { margin: 0; font-size: var(--text-sm); font-weight: 600; color: var(--site-navy); }
.site-hub-head__shot .site-shot__frame { border-radius: 16px; box-shadow: 0 24px 60px rgba(13, 43, 81, 0.12), 0 1px 2px rgba(13, 43, 81, 0.06); }

/* Temalar: iki sütunlu editoryal liste; 3–5 saniyede taranabilir (numara, ad, hazır hafta) */
.unit-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--space-7); border-top: 1px solid var(--color-border); }
.unit-list__item { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: var(--space-3); padding: 16px 0; border-bottom: 1px solid var(--color-border); }
.unit-list__num { padding-top: 3px; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.08em; color: var(--color-accent); }
.unit-list__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.unit-list__title { font-size: var(--text-md); font-weight: 600; margin: 0; line-height: 1.3; }
.unit-list__meta { font-size: 0.8125rem; color: var(--color-text-2); }
.unit-list__item--soon .unit-list__num { color: var(--color-text-3); }
.unit-list__item--soon .unit-list__title { color: var(--site-navy-2); }
.unit-list__item--soon .unit-list__meta { color: var(--color-text-3); }

/* Haftalar: belirgin dönem başlıkları, temaya göre doğal gruplar, kompakt tıklanabilir satırlar */
.site-weeks { background: var(--color-surface-muted); border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }
.site-weeks .site-section__inner { max-width: 980px; }
.term + .term { margin-top: var(--space-8); }
.term__head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-4); padding-bottom: var(--space-3); border-bottom: 2px solid var(--site-navy); margin-bottom: var(--space-5); }
.term__title { font-size: var(--text-2xl); font-weight: 700; margin: 0; line-height: 1.1; }
.term__range { font-size: var(--text-sm); color: var(--color-text-3); white-space: nowrap; padding-bottom: 4px; }
.term__range strong { color: var(--site-navy); font-weight: 600; }
.term__empty { display: inline-flex; align-items: center; gap: 8px; margin: 0; padding: 12px 16px; border: 1px dashed var(--color-border-strong); border-radius: 10px; background: #fff; color: var(--color-text-2); font-size: var(--text-sm); }
.term__empty .icon { color: var(--color-text-3); }
.week-group + .week-group { margin-top: var(--space-5); }
.week-group__label { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-3); margin: 0 0 var(--space-2); padding: 0 4px; }
.week-group__unit { font-size: 0.75rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-text-3); }
.week-group__range { font-size: 0.75rem; color: var(--color-text-3); white-space: nowrap; }
.week-list { list-style: none; margin: 0; padding: 0; border: 1px solid var(--color-border); border-radius: 12px; background: #fff; overflow: hidden; }
.week { position: relative; display: grid; grid-template-columns: 44px minmax(0, 1fr) 24px; align-items: center; gap: var(--space-4); padding: 12px var(--space-4) 12px var(--space-4); scroll-margin-top: 88px; transition: background var(--ease); }
.week + .week { border-top: 1px solid var(--color-border); }
.week:hover { background: var(--color-surface-muted); }
.week:target { background: var(--color-accent-soft); }
.week:focus-within { background: var(--color-surface-muted); }
.week__num {
    display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%;
    background: var(--color-surface-muted); border: 1px solid var(--color-border); color: var(--site-navy);
    font-weight: 700; font-size: 0.8125rem; font-variant-numeric: tabular-nums;
}
.week__body { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.week__title { font-size: var(--text-base); font-weight: 600; margin: 0; line-height: 1.3; }
/* Bütün satır tıklanabilir: tek bağlantı, ::after satırı kaplar (ekstra link/JS yok); bağlantının kendi kutusu ≥ 40 px */
.week__link { display: inline-block; padding: 10px 0; margin: -10px 0; color: var(--site-navy); }
.week__link::after { content: ""; position: absolute; inset: 0; }
.week__link:hover { color: var(--color-accent); text-decoration: none; }
.week__link:focus-visible { outline: none; }
.week:has(.week__link:focus-visible) { box-shadow: inset 0 0 0 2px var(--color-focus); }
.week__summary { margin: 0; font-size: 0.875rem; color: var(--color-text-2); line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.week__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 2px 0 0; font-size: 0.75rem; color: var(--color-text-3); }
.week__session { display: inline-flex; align-items: center; padding: 1px 7px; border-radius: 999px; font-weight: 600; }
.week__session--warm { background: var(--surface-warm); color: var(--tone-warm); }
.week__session--cool { background: var(--surface-cool); color: var(--tone-cool); }
.week__session--sage { background: var(--surface-sage); color: var(--tone-sage); }
.week__session--neutral { background: var(--surface-neutral); color: var(--tone-neutral); }
.week__session--amber { background: var(--surface-amber); color: var(--tone-amber); }
.week__acts { display: inline-flex; align-items: center; gap: 4px; color: var(--color-text-3); }
.week__acts .icon { color: var(--color-border-strong); }
.week__go { display: inline-flex; align-items: center; justify-content: center; color: var(--color-border-strong); transition: color var(--ease), transform var(--ease); }
.week:hover .week__go { color: var(--color-accent); transform: translateX(2px); }

@media (max-width: 900px) {
    .site-hub-head { padding: var(--space-6) 0; }
    .site-hub-head__inner { grid-template-columns: 1fr; gap: var(--space-5); }
    .site-hub-head__shot { order: -1; }
    .site-hub-head .site-crumbs { margin-bottom: var(--space-4); }
    .site-hub-head .site-page-head__title { max-width: none; }
    .unit-list { grid-template-columns: 1fr; column-gap: 0; }
    .week__summary { -webkit-line-clamp: 2; }
}
@media (max-width: 768px) {
    .catalog { grid-template-columns: 1fr; }
    .catalog-card { grid-template-columns: 1fr; }
    .catalog-card__cover { min-height: 0; aspect-ratio: 3 / 2; height: auto; }
    .catalog-card__cover--plain { border-right: 0; border-bottom: 1px solid var(--color-border); min-height: 160px; }
    .unit-list__item { grid-template-columns: 32px minmax(0, 1fr); padding: 12px 0; }
    .site-hub-facts__item { grid-template-columns: 1fr; gap: 2px; }
    .term__head { flex-direction: column; align-items: flex-start; gap: 6px; }
    .term__range { padding-bottom: 0; }
    .week { grid-template-columns: 32px minmax(0, 1fr) 20px; gap: var(--space-3); padding: 12px var(--space-3) 12px var(--space-4); align-items: start; }
    .week__num { width: 32px; height: 32px; margin-top: 2px; }
    .week__go { margin-top: 8px; }
}

/* 12. HAFTA / KONU SAYFASI — eğitim yayını hissi: dengeli hero, tek okunabilir sütun, sakin ritim */
.lesson-head { padding: var(--space-6) 0 var(--space-7); }
.lesson-head .site-crumbs { margin-bottom: var(--space-5); }
.lesson-head__grid { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: var(--space-8); align-items: center; }
.lesson-head .site-page-head__title { font-size: clamp(1.875rem, 3.2vw, 2.75rem); max-width: 20ch; margin-bottom: var(--space-4); }
.lesson-head .site-page-head__lead { max-width: 34rem; font-size: var(--text-md); line-height: 1.6; }
.lesson-meta { list-style: none; margin: var(--space-5) 0 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; }
.lesson-meta__item { display: inline-flex; align-items: center; gap: 7px; font-size: var(--text-sm); font-weight: 600; color: var(--site-navy); }
.lesson-meta__item .icon { color: var(--color-accent); }
.lesson-meta__sub { font-weight: 500; color: var(--color-text-3); }
.lesson-meta__item--unit { font-weight: 500; color: var(--color-text-3); }
.lesson-meta__dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--color-border-strong); flex: none; }
.lesson-meta__dot--warm { background: var(--tone-warm); }
.lesson-meta__dot--cool { background: var(--tone-cool); }
.lesson-meta__dot--sage { background: var(--tone-sage); }
.lesson-meta__dot--neutral { background: var(--tone-neutral); }
.lesson-meta__dot--amber { background: var(--tone-amber); }
.lesson-head__shot .site-shot__frame { border-radius: 16px; box-shadow: 0 24px 60px rgba(13, 43, 81, 0.12), 0 1px 2px rgba(13, 43, 81, 0.06); }
.lesson-head__shot .site-shot__caption { font-size: 0.8125rem; }

.lesson-body { max-width: 760px; padding-top: var(--space-4); padding-bottom: var(--space-8); }
.lesson-sec { padding: var(--space-7) 0; border-bottom: 1px solid var(--color-border); }
.lesson-sec:first-child { padding-top: var(--space-6); }
.lesson-sec__title { font-size: 1.5rem; font-weight: 700; line-height: 1.2; margin: 0 0 var(--space-5); }
.lesson-sec__text { font-size: var(--text-md); line-height: 1.7; color: var(--color-text-2); margin: 0 0 var(--space-3); }
.lesson-sec__text:last-child { margin-bottom: 0; }
.lesson-sec__note { margin: var(--space-5) 0 0; font-size: 0.8125rem; color: var(--color-text-3); }

/* Ne öğreneceğiz: sade numaralı liste, büyük açık numaralar */
.lesson-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.lesson-list__item { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: var(--space-3); align-items: baseline; padding: 12px 0; border-top: 1px solid var(--color-border); }
.lesson-list__item:first-child { border-top: 0; padding-top: 0; }
.lesson-list__num { font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.08em; color: var(--color-accent); font-variant-numeric: tabular-nums; }
.lesson-list__text { font-size: var(--text-md); line-height: 1.55; color: var(--color-text); }

/* Kazanımlar: kod sakin bir etiket, açıklama odak; kutu yok */
.outcome-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.outcome { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: var(--space-4); align-items: baseline; padding: 14px 0; border-top: 1px solid var(--color-border); }
.outcome:first-child { border-top: 0; padding-top: 0; }
.outcome:not(:has(.outcome__code)) { grid-template-columns: minmax(0, 1fr); }
.outcome__code { display: inline-flex; align-items: center; padding: 3px 8px; border-radius: 6px; background: var(--color-surface-muted); border: 1px solid var(--color-border); font-family: var(--font-mono); font-size: 0.75rem; font-weight: 600; color: var(--site-navy); white-space: nowrap; }
.outcome__text { margin: 0; font-size: var(--text-md); line-height: 1.6; color: var(--color-text); }

/* Nasıl anlatıyoruz: oturum etiketi + editoryal paragraf */
.how { display: flex; flex-direction: column; }
.how__row { display: grid; grid-template-columns: 132px minmax(0, 1fr); gap: var(--space-4); align-items: start; padding: 14px 0; border-top: 1px solid var(--color-border); }
.how__row:first-child { border-top: 0; padding-top: 0; }
.how__session { display: inline-flex; align-items: center; gap: 8px; font-size: var(--text-sm); font-weight: 600; color: var(--site-navy); padding-top: 3px; }
.how__text { margin: 0; font-size: var(--text-md); line-height: 1.7; color: var(--color-text-2); }

/* Gerçek yaşam: dersin doğal parçası — büyük, lacivert, ince sol çizgi; kart yok */
.lesson-hook { margin: 0 0 var(--space-4); padding-left: var(--space-4); border-left: 2px solid var(--color-accent); font-size: var(--text-xl); line-height: 1.4; font-weight: 500; color: var(--site-navy); letter-spacing: -0.01em; }

/* İçinde neler var: iki sütunlu sakin metadata */
.lesson-facts { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--space-6); border-top: 1px solid var(--color-border); }
.lesson-facts__row { display: flex; flex-direction: column; gap: 6px; padding: 14px 0; border-bottom: 1px solid var(--color-border); }
.lesson-facts__key { font-size: 0.75rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--color-text-3); }
.lesson-facts__key .week__session { text-transform: none; letter-spacing: 0; font-size: 0.75rem; }
.lesson-facts__val { margin: 0; color: var(--color-text); line-height: 1.55; font-size: var(--text-sm); }
.lesson-facts__sub { color: var(--color-text-2); }

/* Ders akışı: oturum başına numaralı sakin zincir (yatay, dar ekranda dikey ray) */
.flow-row { display: grid; grid-template-columns: 132px minmax(0, 1fr); gap: var(--space-4); padding: 14px 0; border-top: 1px solid var(--color-border); align-items: start; }
.flow-row:first-of-type { border-top: 0; }
.flow-row__session { display: inline-flex; align-items: center; gap: 8px; font-size: var(--text-sm); font-weight: 600; color: var(--site-navy); padding-top: 2px; }
.flow-row__phases { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px var(--space-4); }
.flow-row__phase { display: flex; align-items: center; gap: 8px; font-size: var(--text-sm); color: var(--color-text); min-width: 0; }
.flow-row__num { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; border: 1px solid var(--color-border-strong); background: #fff; font-size: 0.6875rem; font-weight: 700; color: var(--site-navy); flex: none; }
.flow-row__label { font-weight: 500; }

/* Son çağrı: sayfanın doğal finali */
.lesson-cta { margin-top: var(--space-7); padding: var(--space-7); border-radius: 16px; background: var(--site-navy); }
body.site .lesson-cta__title { color: #fff; font-size: var(--text-2xl); font-weight: 700; margin: 0 0 var(--space-3); }
.lesson-cta__text { color: #c9d6ea; margin: 0 0 var(--space-5); line-height: 1.65; max-width: 52ch; font-size: var(--text-md); }
.lesson-cta .btn--primary { background: #fff; color: var(--site-navy); }
.lesson-cta .btn--primary:hover { background: #eaf2ff; }

/* Önceki / sonraki: iki yön, kart duvarı yok; altta hub dönüşü */
.lesson-pager { margin-top: var(--space-6); display: flex; flex-direction: column; gap: var(--space-4); }
.lesson-pager__pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }
.lesson-pager__link { display: flex; flex-direction: column; gap: 6px; padding: var(--space-4) var(--space-4) var(--space-4) 0; color: inherit; min-height: 88px; transition: background var(--ease); }
.lesson-pager__link--next { text-align: right; align-items: flex-end; padding: var(--space-4) 0 var(--space-4) var(--space-4); border-left: 1px solid var(--color-border); }
a.lesson-pager__link:hover { text-decoration: none; }
a.lesson-pager__link:hover .lesson-pager__title { color: var(--color-accent); }
.lesson-pager__link--empty { color: var(--color-text-3); }
.lesson-pager__kicker { display: inline-flex; align-items: center; gap: 6px; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--color-text-3); }
.lesson-pager__kicker .icon { color: var(--color-accent); }
.lesson-pager__title { display: flex; flex-direction: column; gap: 2px; font-weight: 600; color: var(--site-navy); line-height: 1.35; transition: color var(--ease); }
.lesson-pager__seq { font-size: 0.8125rem; font-weight: 500; color: var(--color-text-3); }
.lesson-pager__link--empty .lesson-pager__title { color: var(--color-text-3); font-weight: 500; }
.lesson-pager__hub { display: inline-flex; align-items: center; gap: 8px; min-height: var(--control); font-weight: 600; color: var(--color-text-2); }
.lesson-pager__hub .icon { color: var(--color-accent); }
.lesson-pager__hub:hover { color: var(--site-navy); text-decoration: none; }

@media (max-width: 900px) {
    .lesson-head { padding: var(--space-5) 0 var(--space-6); }
    .lesson-head__grid { grid-template-columns: 1fr; gap: var(--space-5); }
    .lesson-head__shot { order: -1; }
    .lesson-head .site-page-head__title { max-width: none; }
    .lesson-facts { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
    .lesson-sec { padding: var(--space-6) 0; }
    .lesson-sec__title { font-size: var(--text-xl); }
    .lesson-list__item { grid-template-columns: 34px minmax(0, 1fr); }
    .outcome, .outcome:not(:has(.outcome__code)) { grid-template-columns: minmax(0, 1fr); gap: 8px; }
    .how__row, .flow-row { grid-template-columns: 1fr; gap: 8px; }
    .flow-row__phases { grid-template-columns: 1fr; gap: 0; border-left: 1px solid var(--color-border); margin-left: 11px; padding-left: 14px; }
    .flow-row__phase { padding: 5px 0; }
    .flow-row__num { margin-left: -25px; }
    .lesson-hook { font-size: var(--text-lg); }
    .lesson-cta { padding: var(--space-5); border-radius: 12px; }
    body.site .lesson-cta__title { font-size: var(--text-xl); }
    .lesson-pager__pair { grid-template-columns: 1fr; }
    .lesson-pager__link { padding: var(--space-4) 0; }
    .lesson-pager__link--next { text-align: left; align-items: flex-start; border-left: 0; border-top: 1px solid var(--color-border); padding-left: 0; }
}

/* 13. KAYNAKLAR — /kaynaklar kataloğu, ders kaynak hub'ı ve kaynak sayfası (sorular + kapsam ana kahraman) */
.res-types { list-style: none; margin: var(--space-5) 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.res-types__item { display: inline-flex; align-items: center; min-height: 32px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--color-border-strong); background: #fff; font-size: 0.8125rem; font-weight: 600; color: var(--site-navy); }
.res-catalog .site-section__inner { max-width: 980px; }
.res-group + .res-group { margin-top: var(--space-7); }
.res-group__head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-4); padding-bottom: var(--space-3); border-bottom: 2px solid var(--site-navy); margin-bottom: var(--space-4); }
.res-group__title { font-size: var(--text-2xl); font-weight: 700; margin: 0; line-height: 1.15; }
.res-group__title a { color: var(--site-navy); }
.res-group__title a:hover { color: var(--color-accent); text-decoration: none; }
.res-group__lead { margin: var(--space-2) 0 0; color: var(--color-text-2); max-width: 44rem; }
.res-group__course { margin: var(--space-4) 0 0; }
.res-group__course .site-more { white-space: normal; align-items: flex-start; line-height: 1.4; }
.res-group__course .site-more .icon { margin-top: 3px; }
.res-list { list-style: none; margin: 0; padding: 0; border: 1px solid var(--color-border); border-radius: 12px; background: #fff; overflow: hidden; }
.res-row + .res-row { border-top: 1px solid var(--color-border); }
.res-row__link { display: grid; grid-template-columns: 132px minmax(0, 1fr) 24px; gap: var(--space-4); align-items: start; padding: 14px var(--space-4); color: inherit; transition: background var(--ease); }
.res-row__link .week__go { align-self: center; }
.res-row__link:hover { background: var(--color-surface-muted); text-decoration: none; }
.res-row__link:hover .res-row__title { color: var(--color-accent); }
.res-row__link:hover .week__go { color: var(--color-accent); }
.res-row__type { display: inline-flex; align-items: center; margin-top: 2px; padding: 3px 10px; border-radius: 999px; background: var(--color-accent-soft); color: var(--color-accent); font-size: 0.75rem; font-weight: 700; justify-self: start; }
/* Kaynak türü rozeti: tür başına soluk zemin + okunur metin (data-type = YAML type). Yeni tür = yeni satır; kart/satır rengi değişmez. */
.res-row__type[data-type="topic_test"] { background: #eaf2ff; color: #1457c8; }
.res-row__type[data-type="worksheet"] { background: #eaf7f0; color: #247a4b; }
.res-row__type[data-type="written_exam"] { background: #fff4e5; color: #9a5800; }
.res-row__body { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.res-row__title { font-size: var(--text-md); font-weight: 600; color: var(--site-navy); line-height: 1.3; }
.res-row__desc { font-size: var(--text-sm); color: var(--color-text-2); line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.res-row__meta { font-size: 0.75rem; color: var(--color-text-3); }
.res-coming { display: inline-flex; align-items: center; gap: 8px; margin: var(--space-6) 0 0; font-size: var(--text-sm); color: var(--color-text-3); }
.res-coming .icon { color: var(--color-border-strong); }

/* Kaynak sayfası: hero */
.res-head { padding: var(--space-6) 0 var(--space-7); }
.res-head__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--space-8); align-items: center; }
.res-head .site-page-head__title { font-size: clamp(1.875rem, 3.2vw, 2.75rem); margin-bottom: var(--space-3); }
.res-badge { display: inline-flex; align-items: center; gap: 6px; margin: 0 0 var(--space-4); padding: 4px 12px; border-radius: 999px; background: var(--color-accent-soft); color: var(--color-accent); font-size: 0.8125rem; font-weight: 700; }
.res-head .site-page-head__lead { max-width: 36rem; font-size: var(--text-md); line-height: 1.6; }
.res-actions { margin-top: var(--space-5); }
.res-head__facts { margin: var(--space-4) 0 0; font-size: var(--text-sm); color: var(--color-text-3); }
.res-head__facts strong { color: var(--site-navy); }
.res-head__art { margin: 0; }
.res-head__art img { display: block; width: 100%; max-width: 480px; height: auto; margin: 0 auto; }

/* Gövde: tek okuma sütunu */
.res-body { max-width: 800px; padding-top: var(--space-4); padding-bottom: var(--space-8); }
.res-sec { padding: var(--space-7) 0; border-bottom: 1px solid var(--color-border); }
.res-sec:first-child { padding-top: var(--space-6); }
.res-sec__head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-4); }
.res-sec__title { font-size: 1.5rem; font-weight: 700; line-height: 1.2; margin: 0 0 var(--space-3); }
.res-sec__lead { margin: 0 0 var(--space-5); color: var(--color-text-2); line-height: 1.6; }
.res-sec__note { margin: var(--space-4) 0 0; font-size: 0.8125rem; color: var(--color-text-3); line-height: 1.5; }

/* Kapsam tablosu */
.res-table-wrap { overflow-x: auto; border: 1px solid var(--color-border); border-radius: 12px; background: #fff; }
.res-table { width: 100%; border-collapse: collapse; font-size: var(--text-sm); }
.res-table th, .res-table td { padding: 12px 14px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--color-border); }
.res-table thead th { background: var(--color-surface-muted); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-text-3); }
.res-table tbody td:first-child a { display: inline-block; padding: 10px 0; margin: -10px 0; color: var(--site-navy); font-weight: 600; }
.res-table tbody td:first-child a:hover { color: var(--color-accent); text-decoration: none; }
.res-table__codes { font-family: var(--font-mono); font-size: 0.75rem; color: var(--color-text-2); white-space: nowrap; }
.res-table__num { text-align: right; font-variant-numeric: tabular-nums; }
.res-table tbody td:nth-child(3) { white-space: nowrap; }
.res-table tfoot th, .res-table tfoot td { border-bottom: 0; background: var(--color-surface-muted); font-weight: 700; color: var(--site-navy); }

/* Konular: sade link listesi */
.res-topics { list-style: none; margin: 0; padding: 0; border: 1px solid var(--color-border); border-radius: 12px; background: #fff; overflow: hidden; }
.res-topic + .res-topic { border-top: 1px solid var(--color-border); }
.res-topic__link { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto 24px; gap: var(--space-3); align-items: center; padding: 12px var(--space-4); color: inherit; transition: background var(--ease); }
.res-topic__link:hover { background: var(--color-surface-muted); text-decoration: none; }
.res-topic__link:hover .res-topic__title, .res-topic__link:hover .week__go { color: var(--color-accent); }
.res-topic__week { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; background: var(--color-surface-muted); border: 1px solid var(--color-border); font-size: 0.8125rem; font-weight: 700; color: var(--site-navy); }
.res-topic__title { font-weight: 600; color: var(--site-navy); }
.res-topic__meta { font-size: 0.8125rem; color: var(--color-text-3); white-space: nowrap; }

/* Sorular */
.q-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-4); }
.q { padding: var(--space-5); border: 1px solid var(--color-border); border-radius: 12px; background: #fff; scroll-margin-top: 88px; }
.q:target { border-color: var(--color-accent); box-shadow: 0 0 0 3px var(--color-accent-soft); }
.q__head { display: flex; align-items: center; gap: 10px; margin-bottom: var(--space-3); }
.q__no { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 8px; background: var(--site-navy); color: #fff; font-weight: 700; font-size: 0.875rem; }
.q__type { font-size: 0.75rem; font-weight: 600; color: var(--color-text-3); letter-spacing: 0.02em; }
.q__points { margin-left: auto; font-size: 0.75rem; font-weight: 600; color: var(--color-text-3); padding: 2px 8px; border: 1px solid var(--color-border); border-radius: 999px; }
.q__text { margin: 0 0 var(--space-3); font-size: var(--text-md); line-height: 1.6; color: var(--color-text); font-weight: 500; }
.q__options { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.q__option { display: flex; gap: 8px; align-items: baseline; padding: 6px 0; line-height: 1.5; color: var(--color-text); }
.q__letter { font-weight: 700; color: var(--site-navy); min-width: 22px; }
.q__tf { display: flex; gap: 10px; margin: 0; }
.q__tf-box { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px; border: 1px solid var(--color-border-strong); border-radius: 8px; font-size: var(--text-sm); font-weight: 600; color: var(--site-navy); }
.q__tf-box::before { content: ""; width: 14px; height: 14px; border: 1.5px solid var(--color-border-strong); border-radius: 4px; }
.q__blank { margin: var(--space-2) 0 0; height: 44px; border-bottom: 1px dashed var(--color-border-strong); }

/* Cevap anahtarı: varsayılan kapalı */
.answer-key { border: 1px solid var(--color-border); border-radius: 12px; background: #fff; }
.answer-key__summary { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-4) var(--space-5); cursor: pointer; list-style: none; min-height: var(--control); }
.answer-key__summary::-webkit-details-marker { display: none; }
.answer-key__summary:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; border-radius: 12px; }
.answer-key__icon { display: inline-flex; color: var(--color-accent); }
.answer-key__text { display: flex; flex-direction: column; gap: 2px; flex: 1; }
.answer-key__title { font-size: var(--text-lg); font-weight: 700; color: var(--site-navy); }
.answer-key__hint { font-size: var(--text-sm); color: var(--color-text-3); }
.answer-key__chev { color: var(--color-text-3); transition: transform var(--ease); }
.answer-key[open] .answer-key__chev { transform: rotate(90deg); }
.answer-key__list { list-style: none; margin: 0; padding: var(--space-2) var(--space-5) var(--space-5); border-top: 1px solid var(--color-border); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px var(--space-6); }
.answer-key__item { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 8px; align-items: baseline; padding: 8px 0; border-bottom: 1px solid var(--color-border); font-size: var(--text-sm); }
.answer-key__no { display: inline-flex; align-items: center; justify-content: center; min-width: 28px; height: 28px; border-radius: 6px; background: var(--color-surface-muted); border: 1px solid var(--color-border); font-weight: 700; color: var(--site-navy); font-size: 0.75rem; }
.answer-key__answer { color: var(--color-text); font-weight: 500; display: flex; flex-direction: column; gap: 2px; }
.answer-key__note { font-size: 0.8125rem; font-weight: 400; color: var(--color-text-2); line-height: 1.45; }
.answer-key__item--noted { grid-column: 1 / -1; }

/* Çalışma kağıdı: hero meta, içerik özeti, konu hatırlatma, bölümler, yeni madde türleri */
.res-meta { margin-top: var(--space-4); }
.res-contents { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--color-border); }
.res-contents__item { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; gap: var(--space-3); align-items: baseline; padding: 10px 0; border-bottom: 1px solid var(--color-border); }
.res-contents__key { font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.08em; color: var(--color-accent); }
.res-contents__title { font-weight: 600; color: var(--site-navy); }
.res-contents__count { font-size: 0.8125rem; color: var(--color-text-3); white-space: nowrap; }
.res-reminders { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.res-reminder { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: var(--space-3); padding: 14px 0; border-top: 1px solid var(--color-border); }
.res-reminder:first-child { border-top: 0; padding-top: 0; }
.res-reminder__week { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; background: var(--color-surface-muted); border: 1px solid var(--color-border); font-size: 0.8125rem; font-weight: 700; color: var(--site-navy); }
.res-reminder__title { font-size: var(--text-md); font-weight: 600; margin: 4px 0 4px; }
.res-reminder__title a { display: inline-block; padding: 10px 0; margin: -10px 0; color: var(--site-navy); }
.res-reminder__title a:hover { color: var(--color-accent); text-decoration: none; }
.res-reminder__text { margin: 0; font-size: var(--text-sm); line-height: 1.6; color: var(--color-text-2); }
.ws-section + .ws-section { margin-top: var(--space-6); }
.ws-section__head { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: var(--space-3); align-items: start; padding-bottom: var(--space-3); margin-bottom: var(--space-4); border-bottom: 2px solid var(--site-navy); }
.ws-section__key { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 8px; background: var(--site-navy); color: #fff; font-weight: 700; font-size: 0.875rem; }
.ws-section__title { font-size: var(--text-xl); font-weight: 700; margin: 2px 0 2px; }
.ws-section__instruction { margin: 0; font-size: var(--text-sm); color: var(--color-text-2); }
/* Bölüm başlığı türü zaten söyler: madde içinde tür etiketi gizli, kartlar daha sıkı */
.ws-section .q__type { display: none; }
.ws-section .q { padding: 14px var(--space-4) 16px; }
.ws-section .q__head { margin-bottom: 8px; }
.ws-section .q__head .q__no { width: 28px; height: 28px; font-size: 0.8125rem; }
.ws-section .q-list { gap: 10px; }
.ws-section .q__text { font-size: var(--text-base); margin-bottom: 8px; }
.ws-section .q__blank { height: 34px; }
.q__gap { display: inline-block; width: 7em; height: 1em; border-bottom: 1.5px solid var(--site-navy); vertical-align: baseline; margin: 0 2px; }
.q__match { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); margin-top: var(--space-2); }
.q__match-col { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.q__match-item { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--color-border); border-radius: 8px; background: var(--color-surface-muted); font-size: var(--text-sm); line-height: 1.4; }
.q__match-key { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 24px; height: 24px; border-radius: 6px; background: #fff; border: 1px solid var(--color-border-strong); font-size: 0.75rem; font-weight: 700; color: var(--site-navy); }
.q__match-slot { margin-left: auto; flex: none; width: 28px; height: 22px; border: 1.5px dashed var(--color-border-strong); border-radius: 6px; }
.q__table-wrap { margin: var(--space-2) 0 var(--space-3); max-width: 420px; }
.q__table th, .q__table td { padding: 8px 12px; }
.res-print-fields { display: none; }

/* İlgili dersler + CTA */
.res-related { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
.res-related__link { display: flex; flex-direction: column; gap: 2px; padding: 12px 14px; border: 1px solid var(--color-border); border-radius: 10px; background: #fff; color: inherit; min-height: 60px; transition: border-color var(--ease); }
.res-related__link:hover { text-decoration: none; border-color: var(--color-border-strong); }
.res-related__link:hover .res-related__title { color: var(--color-accent); }
.res-related__week { font-size: 0.75rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-text-3); }
.res-related__title { font-weight: 600; color: var(--site-navy); line-height: 1.35; }
.res-cta { margin-top: var(--space-7); }

@media (max-width: 900px) {
    .res-head { padding: var(--space-5) 0 var(--space-6); }
    .res-head__grid { grid-template-columns: 1fr; gap: var(--space-5); }
    .res-head__art { order: -1; }
    .res-head__art img { max-width: 360px; }
}
@media (max-width: 768px) {
    .res-group__head { flex-direction: column; align-items: flex-start; gap: var(--space-2); }
    .res-row__link { grid-template-columns: minmax(0, 1fr) 20px; padding: 12px var(--space-4); }
    .res-row__type { grid-column: 1; }
    .res-row__body { grid-column: 1; }
    .res-row__link .week__go { grid-column: 2; grid-row: 1 / span 2; }
}
@media (max-width: 560px) {
    .res-sec { padding: var(--space-6) 0; }
    .res-sec__title { font-size: var(--text-xl); }
    .res-sec__head { flex-direction: column; gap: 4px; }
    .res-table { font-size: 0.8125rem; }
    .res-table th, .res-table td { padding: 8px; }
    .res-table__codes { white-space: normal; word-break: keep-all; overflow-wrap: normal; }
    .res-topic__link { grid-template-columns: 32px minmax(0, 1fr) 20px; }
    .res-topic__meta { display: none; }
    .q { padding: var(--space-4); }
    .answer-key__list { grid-template-columns: 1fr; }
    .res-related { grid-template-columns: 1fr; }
    .q__match { grid-template-columns: 1fr; }
    .res-contents__item { grid-template-columns: 32px minmax(0, 1fr); }
    .res-contents__count { grid-column: 2; }
}

/* Yazdırma: yalnız kapsam + sorular; cevap anahtarı, gezinme, CTA ve düğmeler çıktıya girmez */
@media print {
    body.site { background: #fff; color: #000; }
    .site-header, .site-drawer, .site-footer, .skip-link, .site-crumbs, .res-actions, .res-head__art, .res-sec--topics,
    .res-answers, .res-sec--related, .res-sec--siblings, .res-sec--reminders, .res-cta, .week__go { display: none !important; }
    .res-print-fields { display: flex; flex-wrap: wrap; gap: 8pt 24pt; margin: 10pt 0 0; font-size: 11pt; }
    .res-meta { display: none; }
    .res-contents__key, .ws-section__key { background: none; color: #000; border: 1px solid #000; }
    .ws-section__head { break-after: avoid; border-color: #000; }
    .res-table-wrap, .res-reminder, .res-contents { break-inside: avoid; }
    .res-table tfoot { display: table-row-group; }
    .res-questions .q { padding: 7pt 9pt; margin-bottom: 5pt; }
    .res-questions .q-list { gap: 5pt; }
    .res-questions .q__type { display: none; }
    .res-questions .q__head { margin-bottom: 4pt; }
    .res-questions .q__no { width: 20pt; height: 20pt; font-size: 9pt; }
    .res-questions .q__text { font-size: 11pt; margin-bottom: 4pt; }
    .res-questions .q__options { gap: 1pt; }
    .res-questions .q__option { padding: 2pt 0; font-size: 10.5pt; }
    .res-questions .q__table-wrap { margin: 4pt 0 6pt; }
    .res-questions .q__table th, .res-questions .q__table td { padding: 4pt 8pt; }
    .ws-section + .ws-section { margin-top: 12pt; }
    .res-questions .q__blank { height: 26pt; }
    .q__match-item, .q__match-key, .q__match-slot { border-color: #000; background: none; }
    .q__gap { border-color: #000; }
    .res-head { padding: 0 0 12pt; border-bottom: 1px solid #000; }
    .res-head__grid { display: block; }
    .res-badge { border: 1px solid #000; background: none; color: #000; }
    .res-body { max-width: none; padding: 0; }
    .res-sec { padding: 14pt 0 0; border-bottom: 0; }
    .site-main, .res-page, .res-body, .q-list { padding-bottom: 0; margin-bottom: 0; }
    .q:last-child { margin-bottom: 0; }
    .res-table-wrap, .q, .res-table thead th, .res-table tfoot th, .res-table tfoot td { border-color: #000; background: none; box-shadow: none; }
    .q { break-inside: avoid; padding: 10pt 12pt; margin: 0 0 8pt; }
    .q__no { background: none; color: #000; border: 1px solid #000; }
    .q__blank { height: 60pt; border-bottom: 1px dashed #000; }
    a { color: inherit; text-decoration: none; }
}
.site-course-res .site-section__inner { max-width: 980px; }