/* Kurumsal sayfalar: /hakkinda, /ozellikler, /sss
   Dil olarak tanitim.css'i izler (bento grid, aksan renkli kart, ikon kutusu).
   Public sayfalar tek tema — light sabit. */

:root {
    --kur-primary: #4f46e5;
    --kur-primary-rgb: 79, 70, 229;
    --kur-primary-dark: #3730a3;
    --kur-primary-tint: #eef2ff;

    --kur-violet: #6366f1;
    --kur-violet-rgb: 99, 102, 241;
    --kur-green: #10b981;
    --kur-green-rgb: 16, 185, 129;
    --kur-amber: #f59e0b;
    --kur-amber-rgb: 245, 158, 11;
    --kur-blue: #3b82f6;
    --kur-blue-rgb: 59, 130, 246;
    --kur-pink: #ec4899;
    --kur-pink-rgb: 236, 72, 153;

    --kur-dark: #0f172a;
    --kur-ink: #1e293b;
    --kur-muted: #64748b;
    --kur-border: #e2e8f0;
    --kur-yuzey: #f8fafc;

    --kur-radius: 16px;
    --kur-radius-lg: 24px;
    --kur-ease: cubic-bezier(.4, 0, .2, 1);
}

body {
    font-family: "Inter var", "Inter", -apple-system, BlinkMacSystemFont, sans-serif;
    color: var(--kur-ink);
    line-height: 1.6;
}

/* Aksan yardımcıları — kart, ikon ve üst kenarlık aynı hue'yu paylaşır. */
.aksan-violet { --ak: var(--kur-violet); --ak-rgb: var(--kur-violet-rgb); }
.aksan-green  { --ak: var(--kur-green);  --ak-rgb: var(--kur-green-rgb); }
.aksan-amber  { --ak: var(--kur-amber);  --ak-rgb: var(--kur-amber-rgb); }
.aksan-blue   { --ak: var(--kur-blue);   --ak-rgb: var(--kur-blue-rgb); }
.aksan-pink   { --ak: var(--kur-pink);   --ak-rgb: var(--kur-pink-rgb); }

.kur-main {
    background-color: var(--kur-yuzey);
    position: relative;
}

.kur-shell {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
    padding: 2.5rem 1rem 3.5rem;
}

/* ─── Dekoratif pati animasyonu ─── */
.kur-patiler {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
    z-index: 0;
}

.kur-pati {
    position: absolute;
    font-size: 30px;
    color: rgba(var(--kur-primary-rgb), .14);
    animation: kurPatiSuzul 6s ease-in-out infinite;
}

/* Büyük soluk patiler — blog detayındaki .deco-paw karşılığı, derinlik verir. */
.kur-pati-buyuk {
    font-size: 120px;
    color: rgba(var(--kur-primary-rgb), .05);
}

.kur-pati-1 { top: 8%; left: 4%; animation-delay: 0s; }
.kur-pati-2 { top: 30%; right: 5%; animation-delay: 1.8s; }
.kur-pati-3 { bottom: 18%; left: 9%; animation-delay: 3.4s; }
.kur-pati-4 { top: 62%; right: 11%; font-size: 22px; animation-delay: 4.6s; }
.kur-pati-5 { top: 18%; right: 24%; font-size: 20px; animation-delay: 2.6s; }
.kur-pati-6 { bottom: 34%; left: 22%; font-size: 24px; animation-delay: 5.2s; }
.kur-pati-7 { top: 6%; left: 30%; transform: rotate(-15deg); animation-delay: 1.2s; }
.kur-pati-8 { top: 44%; left: 3%; transform: rotate(12deg); animation-delay: 3s; }
.kur-pati-9 { bottom: 6%; right: 6%; transform: rotate(-8deg); animation-delay: 4.2s; }

@keyframes kurPatiSuzul {
    0%, 100% { transform: translateY(0) rotate(0deg); }
    50% { transform: translateY(-16px) rotate(5deg); }
}

@media (max-width: 991px) {
    .kur-patiler { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .kur-pati { animation: none; }
}

/* ─── Navbar ─── */
.kur-navbar {
    background-color: rgba(255, 255, 255, .85);
    backdrop-filter: blur(14px) saturate(160%);
    -webkit-backdrop-filter: blur(14px) saturate(160%);
    border-bottom: 1px solid var(--kur-border);
    padding: 13px 0;
}

.kur-navbar .navbar-brand img {
    height: 44px;
    width: auto;
    max-width: 170px;
    object-fit: contain;
}

/* 6 bağlantı + ayraç + 2 buton var; 992-1200px arasında sığması için
   yatay padding ve yazı boyutu diğer public navbar'lardan bir tık dar. */
.kur-navbar .nav-link {
    color: var(--kur-muted) !important;
    font-weight: 600;
    font-size: .875rem;
    padding: 8px 10px !important;
    border-radius: 10px;
    white-space: nowrap;
    transition: color .15s ease, background-color .15s ease;
}

@media (min-width: 1200px) {
    .kur-navbar .nav-link {
        font-size: .9rem;
        padding: 8px 14px !important;
    }
}

.kur-navbar .nav-link:hover,
.kur-navbar .nav-link.active {
    color: var(--kur-primary) !important;
    background: var(--kur-primary-tint);
}

.kur-navbar .btn-primary {
    background-color: var(--kur-primary);
    border-color: var(--kur-primary);
    font-weight: 600;
}

.kur-navbar .btn-primary:hover {
    background-color: var(--kur-primary-dark);
    border-color: var(--kur-primary-dark);
}

.kur-navbar .btn-outline-primary {
    border: 1.5px solid var(--kur-primary);
    color: var(--kur-primary);
    font-weight: 600;
}

.kur-navbar .btn-outline-primary:hover {
    background: var(--kur-primary-tint);
    color: var(--kur-primary);
}

.kur-nav-divider {
    width: 1px;
    height: 22px;
    background: var(--kur-border);
    margin: 0 12px;
}

/* ─── Hero ─── */
.kur-hero {
    position: relative;
    text-align: center;
    padding: 2rem 1rem 3rem;
    overflow: hidden;
}

/* Çok hafif ışık halesi — düz zemini kırar, gradyan dolgu değil. */
.kur-hero::before {
    content: "";
    position: absolute;
    top: -140px;
    left: 50%;
    transform: translateX(-50%);
    width: 620px;
    height: 340px;
    background: radial-gradient(circle, rgba(var(--kur-primary-rgb), .09) 0%, rgba(var(--kur-primary-rgb), 0) 70%);
    pointer-events: none;
    z-index: 0;
}

.kur-hero > * {
    position: relative;
    z-index: 1;
}

.kur-rozet {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 6px 18px;
    background: var(--kur-primary-tint);
    color: var(--kur-primary);
    border-radius: 9999px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    margin-bottom: 1.25rem;
}

.kur-hero h1 {
    font-size: clamp(1.9rem, 4vw, 2.75rem);
    font-weight: 800;
    color: var(--kur-dark);
    letter-spacing: -.02em;
    margin-bottom: 1rem;
}

.kur-hero p {
    color: var(--kur-muted);
    font-size: 1.0625rem;
    line-height: 1.7;
    max-width: 640px;
    margin: 0 auto;
}

/* ─── Bölüm başlığı ─── */
.kur-bolum-basligi {
    text-align: center;
    margin: 3rem 0 1.75rem;
}

.kur-bolum-basligi h2 {
    font-size: clamp(1.4rem, 3vw, 1.9rem);
    font-weight: 800;
    color: var(--kur-dark);
    letter-spacing: -.02em;
    margin-bottom: .5rem;
}

.kur-bolum-basligi p {
    color: var(--kur-muted);
    font-size: .98rem;
    max-width: 560px;
    margin: 0 auto;
}

/* ─── Kart ─── */
.kur-kart {
    background: #fff;
    border: 1px solid var(--kur-border);
    border-radius: var(--kur-radius-lg);
    padding: 2rem;
    margin-bottom: 1.25rem;
}

.kur-kart > h2 {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--kur-dark);
    margin-bottom: 1.25rem;
}

.kur-kart p {
    line-height: 1.75;
    margin-bottom: 1rem;
}

.kur-kart p:last-child {
    margin-bottom: 0;
}

.kur-kart a {
    color: var(--kur-primary);
    font-weight: 600;
}

/* ─── Özellik grid'i (bento) ─── */
.kur-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 18px;
}

.kur-ozellik {
    background: #fff;
    border: 1px solid var(--kur-border);
    border-top: 3px solid var(--ak, var(--kur-primary));
    border-radius: var(--kur-radius-lg);
    padding: 26px 24px;
    transition: transform .3s var(--kur-ease), border-color .3s var(--kur-ease), box-shadow .3s var(--kur-ease);
}

.kur-ozellik:hover {
    transform: translateY(-5px);
    border-color: rgba(var(--ak-rgb), .35);
    border-top-color: var(--ak);
    box-shadow: 0 12px 24px rgba(15, 23, 42, .05);
}

.kur-ozellik-ikon {
    width: 54px;
    height: 54px;
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    margin-bottom: 16px;
    background: rgba(var(--ak-rgb), .1);
    color: var(--ak);
}

.kur-ozellik h3 {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--kur-dark);
    margin: 0 0 .4rem;
}

.kur-ozellik p {
    color: var(--kur-muted);
    font-size: .92rem;
    line-height: 1.65;
    margin: 0;
}

/* ─── Anlatım blokları (Hakkında) ─── */
.kur-anlatim {
    display: grid;
    gap: 14px;
}

.kur-blok {
    background: #fff;
    border: 1px solid var(--kur-border);
    border-left: 3px solid var(--ak, var(--kur-primary));
    border-radius: var(--kur-radius);
    padding: 1.5rem 1.65rem;
    transition: border-color .3s var(--kur-ease), box-shadow .3s var(--kur-ease);
}

.kur-blok:hover {
    border-color: rgba(var(--ak-rgb), .3);
    border-left-color: var(--ak);
    box-shadow: 0 10px 20px rgba(15, 23, 42, .04);
}

.kur-blok-basligi {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: .85rem;
}

.kur-blok-ikon {
    flex: 0 0 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: rgba(var(--ak-rgb), .1);
    color: var(--ak);
    font-size: 1rem;
}

.kur-blok h2,
.kur-blok h3 {
    font-size: 1.08rem;
    font-weight: 700;
    color: var(--kur-dark);
    margin: 0;
}

.kur-blok p {
    color: var(--kur-ink);
    line-height: 1.75;
    margin: 0;
    font-size: .96rem;
}

.kur-blok p + p {
    margin-top: .85rem;
}

.kur-blok a {
    color: var(--kur-primary);
    font-weight: 600;
}

/* ─── Künye kutuları ─── */
.kur-kunye {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 14px;
}

.kur-kunye-kutu {
    background: #fff;
    border: 1px solid var(--kur-border);
    border-radius: var(--kur-radius);
    padding: 1.15rem 1rem;
    text-align: center;
}

.kur-kunye-ikon {
    width: 38px;
    height: 38px;
    margin: 0 auto .6rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    background: rgba(var(--ak-rgb), .1);
    color: var(--ak);
    font-size: .95rem;
}

.kur-kunye-etiket {
    font-size: .78rem;
    color: var(--kur-muted);
    margin-bottom: .15rem;
}

.kur-kunye-deger {
    font-size: .98rem;
    font-weight: 700;
    color: var(--kur-dark);
}

/* ─── Araç çipleri ─── */
.kur-cipler {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.kur-cip {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 15px;
    background: var(--kur-yuzey);
    border: 1px solid var(--kur-border);
    border-radius: 9999px;
    font-size: .875rem;
    font-weight: 600;
    color: var(--kur-ink);
    text-decoration: none;
    transition: all .2s var(--kur-ease);
}

.kur-cip i {
    color: var(--kur-primary);
    font-size: .85rem;
}

.kur-cip:hover {
    background: var(--kur-primary-tint);
    border-color: rgba(var(--kur-primary-rgb), .3);
    color: var(--kur-primary);
    transform: translateY(-2px);
}

/* ─── SSS ─── */
.kur-sss-bolum {
    margin-bottom: 1.5rem;
}

.kur-sss-bolum > h2 {
    display: flex;
    align-items: center;
    gap: 11px;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--kur-dark);
    margin-bottom: .9rem;
}

.kur-sss-bolum > h2 .kur-blok-ikon {
    flex: 0 0 36px;
    height: 36px;
    font-size: .9rem;
}

.kur-sss {
    background: #fff;
    border: 1px solid var(--kur-border);
    border-radius: var(--kur-radius-lg);
    overflow: hidden;
}

.kur-sss details {
    border-bottom: 1px solid var(--kur-border);
    transition: background-color .2s var(--kur-ease);
}

.kur-sss details:last-child {
    border-bottom: none;
}

.kur-sss details[open] {
    background: rgba(var(--ak-rgb), .03);
}

.kur-sss summary {
    padding: 1.1rem 1.4rem;
    font-weight: 600;
    font-size: .96rem;
    color: var(--kur-dark);
    cursor: pointer;
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.kur-sss summary::-webkit-details-marker {
    display: none;
}

.kur-sss summary::after {
    content: "\f078";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: .7rem;
    color: var(--kur-muted);
    transition: transform .25s var(--kur-ease), color .2s ease;
    flex-shrink: 0;
}

.kur-sss details[open] summary::after {
    transform: rotate(180deg);
    color: var(--ak, var(--kur-primary));
}

.kur-sss details[open] summary {
    color: var(--ak, var(--kur-primary));
}

.kur-sss .kur-sss-cevap {
    padding: 0 1.4rem 1.25rem;
    color: var(--kur-muted);
    line-height: 1.75;
    font-size: .93rem;
    margin: 0;
}

/* ─── CTA ─── */
.kur-cta {
    position: relative;
    background: var(--kur-primary);
    border-radius: var(--kur-radius-lg);
    padding: 2.5rem 1.75rem;
    text-align: center;
    color: #fff;
    margin-top: 2rem;
    overflow: hidden;
}

.kur-cta::before {
    content: "\f1b0";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    position: absolute;
    right: -12px;
    bottom: -22px;
    font-size: 120px;
    opacity: .09;
    pointer-events: none;
}

.kur-cta h2 {
    font-size: 1.45rem;
    font-weight: 800;
    margin-bottom: .6rem;
    color: #fff;
    letter-spacing: -.01em;
}

.kur-cta p {
    opacity: .92;
    margin-bottom: 1.5rem;
    font-size: .98rem;
}

.kur-cta .btn {
    background: #fff;
    color: var(--kur-primary);
    font-weight: 700;
    border: none;
    padding: .65rem 1.9rem;
    border-radius: 9999px;
    transition: transform .2s var(--kur-ease), background-color .2s ease;
}

.kur-cta .btn:hover {
    background: var(--kur-primary-tint);
    color: var(--kur-primary-dark);
    transform: translateY(-2px);
}

/* ─── Mobil alt sekme çubuğu ─── */
.kur-tabbar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1030;
    display: flex;
    align-items: flex-end;
    justify-content: space-around;
    background: rgba(255, 255, 255, .93);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-top: 1px solid var(--kur-border);
    padding: 6px 8px calc(6px + env(safe-area-inset-bottom));
}

.kur-tab {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    padding: 6px 4px;
    margin: 0 2px;
    border-radius: 12px;
    font-size: 10.5px;
    font-weight: 600;
    color: var(--kur-muted);
    text-decoration: none;
    flex: 1 1 0;
    transition: color .15s ease, background-color .15s ease;
}

.kur-tab.active {
    color: var(--kur-primary);
    background: var(--kur-primary-tint);
}

.kur-tab i {
    font-size: 19px;
    line-height: 1.2;
}

@media (min-width: 992px) {
    .kur-tabbar {
        display: none;
    }
}

@media (max-width: 991.98px) {
    body {
        padding-bottom: calc(78px + env(safe-area-inset-bottom));
    }

    /* Nav bağlantıları alt çubuğa taşındı; logo tek başına kaldığı için ortalanır. */
    .kur-navbar > .container {
        justify-content: center;
    }
}

@media (max-width: 576px) {
    .kur-shell {
        padding: 1.5rem .85rem 2.25rem;
    }

    .kur-hero {
        padding: 1rem .5rem 2rem;
    }

    .kur-kart {
        padding: 1.35rem;
        border-radius: var(--kur-radius);
    }

    .kur-blok {
        padding: 1.25rem 1.25rem;
    }

    .kur-ozellik {
        padding: 20px 18px;
    }

    .kur-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .kur-cta {
        padding: 1.85rem 1.25rem;
    }

    .kur-cta .btn {
        padding: .35rem .75rem;
        font-size: .8rem;
        white-space: nowrap;
    }

    .kur-sss summary {
        padding: .95rem 1.1rem;
        font-size: .92rem;
    }

    .kur-sss .kur-sss-cevap {
        padding: 0 1.1rem 1.1rem;
    }
}
