/* =====================================================================
   ZİYARETÇİ YÜZÜ  (Görsellik Adım 2 · 12.11.2026)
   Sadece _Layout.cshtml (ziyaretçi şablonu) kullanır; tasarim.css'ten
   SONRA yüklenir. site.css'teki eski stiller yerinde durur, bu dosya
   üzerine yazar. Geri almak için _Layout'taki bağlantıyı silmek yeterli.
   ===================================================================== */

/* ---------- 0) ORTAK ---------- */
:root {
    --zy-logo-bar: 58px;   /* üst logo çubuğu yüksekliği */
}

body { background: #fff; }

/* site.css'teki mavi odak halkası yerine altın halka */
.btn:focus, .btn:active:focus, .btn-link.nav-link:focus,
.form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 .22rem rgba(184,150,79,.25);
}

/* ---------- 1) ÜST LOGO ÇUBUĞU ---------- */
.top-logo-bar {
    height: var(--zy-logo-bar);
    background: linear-gradient(180deg, #fbf8f2, #f3ecdf);
    border-bottom: 1px solid var(--tma-cizgi);
    border-radius: 0;
    box-shadow: none;
}
.top-logo-bar::after {               /* ince bordo-altın çizgi */
    content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px;
    background: linear-gradient(90deg, var(--tma-bordo), var(--tma-altin) 50%, var(--tma-bordo));
    opacity: .55;
}
.top-logo-bar img { height: 40px; opacity: 1; filter: saturate(.95); }
.top-logo-bar img:hover { transform: translateY(-1px); }
.top-logo-bar .top-meb-logo { height: 46px; }
.top-logo-bar a { margin-left: 14px; }

/* ---------- 2) MENÜ ÇUBUĞU ---------- */
.navbar-museum {
    background: rgba(255,255,255,.96);
    -webkit-backdrop-filter: saturate(1.3) blur(8px);
    backdrop-filter: saturate(1.3) blur(8px);
    border-bottom: 1px solid var(--tma-cizgi);
    padding-top: calc(var(--zy-logo-bar) + 6px) !important;
    padding-bottom: 6px !important;
    box-shadow: 0 6px 18px rgba(43,33,24,.05);
}
.navbar-museum.navbar-scrolled {
    top: var(--zy-logo-bar);
    padding-top: 4px !important;
    padding-bottom: 4px !important;
    background: rgba(255,255,255,.98);
    box-shadow: 0 8px 22px rgba(43,33,24,.10);
}

/* Logo */
.navbar-brand { padding-top: 0 !important; }
.navbar-brand img.navbar-logo { height: 64px !important; }
.navbar-museum.navbar-scrolled .navbar-logo { height: 44px !important; }
.navbar-brand:hover { transform: none; }

/* Menü bağlantıları */
.navbar-museum .navbar-nav .nav-link {
    color: var(--tma-murekkep) !important;
    font-weight: 600;
    font-size: .9rem;
    letter-spacing: .005em;
    padding: 8px 12px;
    margin-right: 2px;
    border-radius: 10px;
    border-bottom: 0 !important;
    white-space: nowrap;
}
/* Menüdeki MEB ve Akademi bağlantıları üstteki logolarda zaten var;
   masaüstünde menü sığsın diye gizlenir (telefon menüsünde görünür). */
@media (min-width: 992px) and (max-width: 1599.98px) {
    .navbar-museum .navbar-nav .nav-link[target="_blank"] { display: none; }
}
@media (min-width: 992px) and (max-width: 1399.98px) {
    .navbar-museum .navbar-nav .nav-link { padding: 8px 9px; font-size: .84rem; }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
    .navbar-museum .navbar-nav .nav-link i { display: none; }
    .navbar-brand img.navbar-logo { height: 52px !important; }
}
.navbar-museum .navbar-nav .nav-link:hover {
    background: rgba(184,150,79,.13);
    color: var(--tma-bordo) !important;
    transform: none;
}
.navbar-museum .navbar-nav .nav-link.active {
    color: var(--tma-bordo) !important;
    background: rgba(127,29,29,.06);
}
.navbar-museum .nav-link::after,
.navbar-nav .nav-link::after {
    left: 12px;
    bottom: 3px;
    background: linear-gradient(90deg, var(--tma-bordo), var(--tma-altin));
    border-radius: 2px;
}
.navbar-museum .nav-link:hover::after,
.navbar-museum .nav-link.active::after,
.navbar-nav .nav-link:hover::after,
.navbar-nav .nav-link.active::after {
    width: calc(100% - 24px);
    transform: none;
}

/* İkonlar: rastgele renkler yerine tek renk */
.navbar-museum .navbar-nav .nav-link i {
    font-size: 1rem;
    color: var(--tma-altin);
    opacity: 1;
    transform: none !important;
}
.navbar-museum .navbar-nav .nav-link:hover i,
.navbar-museum .navbar-nav .nav-link.active i { color: var(--tma-bordo) !important; }

/* Sağ taraf: Yönetim / Çıkış */
.navbar-museum .btn-outline-dark {
    border-color: rgba(127,29,29,.45);
    color: var(--tma-bordo);
    border-radius: 999px;
    font-weight: 600;
}
.navbar-museum .btn-outline-dark:hover { background: var(--tma-bordo); border-color: var(--tma-bordo); color: #fff; }

/* Mobil menü */
@media (max-width: 991.98px) {
    :root { --zy-logo-bar: 50px; }
    .top-logo-bar img { height: 32px; }
    .top-logo-bar .top-meb-logo { height: 36px; }
    .top-logo-bar a { margin-left: 10px; }
    .navbar-museum .navbar-collapse {
        background: #fff;
        border: 1px solid var(--tma-cizgi);
        border-radius: 14px;
        box-shadow: var(--tma-golge-2);
        margin-top: 8px;
        padding: 10px;
    }
    .navbar-museum .navbar-nav .nav-link { margin: 0 0 2px; }
    .navbar-museum .navbar-toggler {
        background: #fff;
        border: 1px solid var(--tma-cizgi);
        box-shadow: var(--tma-golge-1);
    }
}
@media (max-width: 575.98px) {
    body { padding-top: 0 !important; }   /* boşluğu menü altındaki ara katman zaten veriyor */
    .navbar-brand img.navbar-logo { height: 48px !important; }
    .navbar-museum.navbar-scrolled .navbar-logo { height: 38px !important; }
    .navbar-brand { padding-top: 2px !important; }
    .navbar-museum .navbar-toggler { margin-top: 4px; }
}

/* ---------- 3) ARAMA ÇUBUĞU ---------- */
.museum-search-bar {
    margin-top: 0;
    padding: 20px 0 14px !important;
    background:
        radial-gradient(ellipse at 15% 0%, rgba(255,255,255,.7), transparent 60%),
        linear-gradient(180deg, #f7f2e8, #f1e9da);
    border-bottom: 1px solid var(--tma-cizgi);
}
.museum-search-bar form { max-width: 920px; margin: 0 auto; }
.search-input {
    height: 52px;
    border-radius: 999px;
    border: 1px solid #d6c7aa;
    padding-left: 50px;
    font-size: 1rem;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a08a63' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") no-repeat 18px center / 19px 19px;
    box-shadow: 0 2px 4px rgba(43,33,24,.04), 0 10px 24px rgba(43,33,24,.06);
}
.search-input:focus {
    border-color: var(--tma-altin);
    box-shadow: 0 0 0 .25rem rgba(184,150,79,.22), 0 10px 24px rgba(43,33,24,.08);
}
.search-btn {
    height: 52px;
    width: 52px;
    flex: 0 0 52px;
    background: linear-gradient(135deg, var(--tma-bordo), #a12a2f);
    box-shadow: 0 6px 16px rgba(127,29,29,.25);
}
.search-btn:hover { box-shadow: 0 10px 22px rgba(127,29,29,.32); color: #fff; }

.search-chips {
    display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
    gap: 6px; margin-top: 10px; font-size: .8rem; color: var(--tma-soluk);
}
.search-chips a {
    display: inline-block; padding: 3px 11px; border-radius: 999px;
    background: rgba(255,255,255,.75); border: 1px solid var(--tma-cizgi);
    color: var(--tma-murekkep-2); text-decoration: none; font-weight: 600;
    transition: background .15s, color .15s, border-color .15s;
}
.search-chips a:hover { background: #fff; color: var(--tma-bordo); border-color: #d9c49a; }
@media (max-width: 575.98px) {
    .search-chips { display: none; }       /* telefonda yer kaplamasın */
    .museum-search-bar { padding: 12px 0 10px !important; }
    .search-input, .search-btn { height: 46px; }
    .search-btn { width: 46px !important; flex-basis: 46px; }
}

/* ---------- 4) YOL GÖSTERİCİ (breadcrumb) ---------- */
.museum-breadcrumb-wrapper {
    background: #fff;
    border: 1px solid var(--tma-cizgi);
    border-left: 4px solid var(--tma-bordo);
    border-radius: 12px;
    box-shadow: var(--tma-golge-1);
    padding: 10px 18px;
}
.museum-breadcrumb a { color: var(--tma-bordo); }
.museum-breadcrumb .active { color: var(--tma-murekkep-2); }

/* ---------- 5) "TÜRK EĞİTİM TARİHİNİ DİJİTALLEŞTİRİYORUZ" ---------- */
.tma-cta-museum {
    background:
        radial-gradient(ellipse at 50% 0%, rgba(255,255,255,.8), transparent 65%),
        repeating-linear-gradient(0deg, rgba(120,90,50,.035) 0 1px, transparent 1px 44px),
        repeating-linear-gradient(90deg, rgba(120,90,50,.035) 0 1px, transparent 1px 44px),
        #f6f0e4;
    border-top: 1px solid var(--tma-cizgi);
    border-bottom: 1px solid var(--tma-cizgi);
}
.tma-cta-museum .museum-divider {
    width: 64px; height: 3px;
    background: linear-gradient(90deg, var(--tma-bordo), var(--tma-altin));
}
.tma-cta-museum .museum-title {
    font-family: var(--tma-serif);
    font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2.2rem);
    color: var(--tma-murekkep);
    letter-spacing: -.01em;
}
.tma-cta-museum .museum-subtitle { color: var(--tma-murekkep-2); font-size: 1rem; }
.museum-btn {
    background: linear-gradient(135deg, var(--tma-bordo), #a12a2f);
    border-radius: 999px;
    padding: 11px 30px;
    font-weight: 600;
    box-shadow: 0 8px 20px rgba(127,29,29,.22);
}
.museum-btn:hover { box-shadow: 0 12px 26px rgba(127,29,29,.30); }

/* ---------- 6) ALT BİLGİ (footer) ---------- */
.tma-footer {
    background: #fbf8f2;
    margin-top: 0 !important;
    border-top: 0;
    text-align: left;
    padding: 0;
    position: relative;
}
.tma-footer::before {
    content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px;
    background: linear-gradient(90deg, var(--tma-bordo), var(--tma-altin) 50%, var(--tma-bordo));
}
.tma-footer .footer-top { background: transparent; }
.tma-footer .footer-logo { max-width: 72px; }
.tma-footer .footer-title {
    font-family: var(--tma-serif);
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--tma-murekkep);
    padding-bottom: 8px;
    position: relative;
}
.tma-footer .footer-title::after {
    content: ""; position: absolute; left: 0; bottom: 0; width: 34px; height: 2px;
    background: var(--tma-altin); border-radius: 2px;
}
.tma-footer .footer-text { color: var(--tma-murekkep-2); font-size: .92rem; }
.tma-footer .modern-links a { color: var(--tma-murekkep-2); font-weight: 600; font-size: .92rem; }
.tma-footer .modern-links a:hover { color: var(--tma-bordo); }
.tma-footer .modern-links a::after { background: var(--tma-bordo); }
.tma-footer .link-icon { color: var(--tma-altin); }

.footer-accordion .accordion-button {
    background: #fff;
    border: 1px solid var(--tma-cizgi);
    color: var(--tma-murekkep);
    box-shadow: none;
    font-weight: 600;
    font-family: var(--tma-font);
}
.footer-accordion .accordion-button:hover { background: #fff; border-color: #d9c49a; transform: none; }
.footer-accordion .accordion-button:not(.collapsed) {
    background: linear-gradient(135deg, var(--tma-bordo), #a12a2f);
    border-color: var(--tma-bordo);
    color: #fff;
}
.footer-accordion .accordion-body { border: 1px solid var(--tma-cizgi); box-shadow: none; color: var(--tma-murekkep-2); }

.tma-footer .footer-bottom {
    background: #f1eadc;
    border-top: 1px solid var(--tma-cizgi);
    color: var(--tma-soluk);
    font-size: .82rem;
}

/* ---------- 7) AÇILIŞ EKRANI ---------- */
#introScreen { background: rgba(251,248,242,.88); }

/* ---------- 8) ANA SAYFA KARŞILAMA ŞERİDİ (Index.cshtml) ---------- */
.home-hero {
    position: relative;
    padding: 26px 0 18px;
    background:
        radial-gradient(ellipse at 85% 0%, rgba(184,150,79,.14), transparent 55%),
        linear-gradient(180deg, #fff, #fbf8f2);
    border-bottom: 1px solid var(--tma-cizgi);
}
.home-hero .hh-inner {
    max-width: 1320px; margin: 0 auto; padding: 0 20px;
    display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap;
}
.home-hero .hh-kicker {
    font-size: .72rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--tma-altin);
}
.home-hero h1 {
    margin: 4px 0 6px;
    font-size: clamp(1.6rem, 1.1rem + 1.8vw, 2.5rem);
    line-height: 1.1;
}
.home-hero p { margin: 0; max-width: 720px; color: var(--tma-murekkep-2); font-size: 1rem; }
.home-hero .hh-links { display: flex; gap: 8px; flex-wrap: wrap; }
.home-hero .hh-link {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 9px 16px; border-radius: 999px; text-decoration: none; font-weight: 600; font-size: .9rem;
    border: 1px solid var(--tma-cizgi); background: #fff; color: var(--tma-murekkep);
    box-shadow: var(--tma-golge-1); transition: transform .15s, box-shadow .15s, color .15s;
}
.home-hero .hh-link:hover { transform: translateY(-1px); box-shadow: var(--tma-golge-2); color: var(--tma-bordo); }
.home-hero .hh-link.primary { background: var(--tma-bordo); border-color: var(--tma-bordo); color: #fff; }
.home-hero .hh-link.primary:hover { color: #fff; background: var(--tma-bordo-koyu); }
@media (max-width: 575.98px) {
    .home-hero { padding: 16px 0 12px; }
    .home-hero p { font-size: .9rem; }
    .home-hero .hh-link { padding: 7px 12px; font-size: .82rem; }
}
