:root {
    --osp-koyu-zemin: #080d13;
    --osp-koyu-ana: #0f1923;
    --osp-koyu-orta: #162231;
    --osp-koyu-kart: #1c2d40;
    --osp-koyu-kenar: #243447;
    --osp-koyu-parlak: #2c3e55;
    --osp-mavi-derin: #1565c0;
    --osp-mavi-ana: #1e88e5;
    --osp-mavi-parlak: #42a5f5;
    --osp-mavi-acik: #90caf9;
    --osp-vurgu-cyan: #00d4ff;
    --osp-vurgu-yesil: #00e68a;
    --osp-vurgu-turuncu: #ff9800;
    --osp-metin-ana: #e2e8f0;
    --osp-metin-ikincil: #94a3b8;
    --osp-metin-soluk: #64748b;
    --osp-metin-koyu: #475569;
    --osp-beyaz: #ffffff;
    --osp-siyah: #000000;
    --osp-kirmizi: #ef4444;
    --osp-gradyan-mavi: linear-gradient(135deg, #1565c0 0%, #00d4ff 100%);
    --osp-gradyan-koyu: linear-gradient(180deg, #0f1923 0%, #080d13 100%);
    --osp-gradyan-kart: linear-gradient(145deg, #1c2d40 0%, #162231 100%);
    --osp-font-govde: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --osp-font-baslik: 'Space Grotesk', 'Inter', sans-serif;
    --osp-golge-hafif: 0 1px 3px rgba(0, 0, 0, 0.3);
    --osp-golge-orta: 0 4px 16px rgba(0, 0, 0, 0.4);
    --osp-golge-agir: 0 8px 32px rgba(0, 0, 0, 0.5);
    --osp-golge-vurgu: 0 0 20px rgba(0, 212, 255, 0.15);
    --osp-yuvarla-kucuk: 6px;
    --osp-yuvarla-orta: 10px;
    --osp-yuvarla-buyuk: 16px;
    --osp-yuvarla-tam: 50px;
    --osp-gecis-hizli: 0.2s ease;
    --osp-gecis-orta: 0.3s ease;
    --osp-gecis-yavas: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    --osp-ust-panel-yukseklik: 64px;
    --osp-bilgi-seridi-yukseklik: 36px;
    --osp-icerik-genislik: 1200px;
    --osp-icerik-dar: 800px;
    --osp-kart-arkaplan: #1c2d40;
    --osp-kart-kenar: #243447;
    --osp-metin-b: #94a3b8;
    --osp-metin-c: #64748b;
    --osp-vurgu-a: #00d4ff;
}

*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    font-size: 16px;
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    text-size-adjust: 100%;
    scroll-padding-top: calc(var(--osp-ust-panel-yukseklik) + var(--osp-bilgi-seridi-yukseklik) + 20px);
}

body,
.osp-govde {
    font-family: var(--osp-font-govde);
    font-weight: 400;
    line-height: 1.7;
    color: var(--osp-metin-ana);
    background-color: var(--osp-koyu-zemin);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden;
    min-height: 100vh;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, main, menu, nav, section {
    display: block;
}

ul, ol {
    list-style: none;
}

a {
    text-decoration: none;
    color: inherit;
    transition: color var(--osp-gecis-hizli);
}

img {
    max-width: 100%;
    height: auto;
    display: block;
    border: 0;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--osp-font-baslik);
    font-weight: 700;
    line-height: 1.3;
    color: var(--osp-beyaz);
}

p {
    margin-bottom: 1rem;
}

p:last-child {
    margin-bottom: 0;
}

strong, b {
    font-weight: 600;
}

::selection {
    background-color: var(--osp-mavi-derin);
    color: var(--osp-beyaz);
}

:focus-visible {
    outline: 2px solid var(--osp-vurgu-cyan);
    outline-offset: 2px;
}

.osp-erisim-atlama {
    position: absolute;
    top: -100%;
    left: 16px;
    z-index: 10000;
    padding: 12px 24px;
    background-color: var(--osp-mavi-ana);
    color: var(--osp-beyaz);
    font-size: 0.875rem;
    font-weight: 600;
    border-radius: var(--osp-yuvarla-kucuk);
    transition: top var(--osp-gecis-orta);
}

.osp-erisim-atlama:focus {
    top: 10px;
}

.osp-ust-bilgi-seridi {
    background-color: var(--osp-koyu-ana);
    border-bottom: 1px solid var(--osp-koyu-kenar);
    height: var(--osp-bilgi-seridi-yukseklik);
    display: flex;
    align-items: center;
    position: relative;
    z-index: 1001;
}

.osp-ust-bilgi-sarmal {
    width: 100%;
    max-width: var(--osp-icerik-genislik);
    margin: 0 auto;
    padding: 0 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.osp-ust-bilgi-sol {
    display: none;
    align-items: center;
    gap: 12px;
}

.osp-ust-bilgi-rozet {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.75rem;
    color: var(--osp-metin-ikincil);
}

.osp-ust-bilgi-ikon {
    font-size: 0.7rem;
    color: var(--osp-vurgu-cyan);
}

.osp-ust-bilgi-etiket {
    white-space: nowrap;
}

.osp-ust-bilgi-bolme {
    width: 1px;
    height: 14px;
    background-color: var(--osp-koyu-kenar);
    flex-shrink: 0;
}

.osp-ust-bilgi-sag {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}

.osp-ust-bilgi-eylem {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 0.75rem;
    color: var(--osp-metin-ikincil);
    padding: 4px 8px;
    border-radius: var(--osp-yuvarla-kucuk);
    transition: color var(--osp-gecis-hizli), background-color var(--osp-gecis-hizli);
}

.osp-ust-bilgi-eylem:hover {
    color: var(--osp-vurgu-cyan);
    background-color: rgba(0, 212, 255, 0.06);
}

.osp-ust-bilgi-eylem i {
    font-size: 0.7rem;
}

.osp-ust-panel {
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    background-color: rgba(15, 25, 35, 0.92);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: 1px solid var(--osp-koyu-kenar);
    height: var(--osp-ust-panel-yukseklik);
    transition: box-shadow var(--osp-gecis-orta), background-color var(--osp-gecis-orta);
}

.osp-ust-panel-kaydirmada {
    box-shadow: var(--osp-golge-orta);
    background-color: rgba(15, 25, 35, 0.97);
}

.osp-ust-panel-sarmal {
    width: 100%;
    max-width: var(--osp-icerik-genislik);
    margin: 0 auto;
    padding: 0 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 100%;
    gap: 20px;
}

.osp-marka-blogu {
    flex-shrink: 0;
}

.osp-marka-baglanti {
    display: flex;
    align-items: center;
}

.osp-marka-gorsel {
    height: 34px;
    width: auto;
    transition: opacity var(--osp-gecis-hizli);
}

.osp-marka-baglanti:hover .osp-marka-gorsel {
    opacity: 0.85;
}

.osp-gezinti-cubugu {
    display: none;
    flex: 1;
    justify-content: center;
}

.osp-gezinti-dizi {
    display: flex;
    align-items: center;
    gap: 2px;
}

.osp-gezinti-birim {
    position: relative;
}

.osp-gezinti-bag {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 8px 16px;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--osp-metin-ikincil);
    border-radius: var(--osp-yuvarla-kucuk);
    transition: color var(--osp-gecis-hizli), background-color var(--osp-gecis-hizli);
    white-space: nowrap;
}

.osp-gezinti-bag:hover {
    color: var(--osp-beyaz);
    background-color: rgba(255, 255, 255, 0.05);
}

.osp-gezinti-secili > .osp-gezinti-bag {
    color: var(--osp-vurgu-cyan);
}

.osp-gezinti-secili > .osp-gezinti-bag::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 16px;
    right: 16px;
    height: 2px;
    background: var(--osp-gradyan-mavi);
    border-radius: 2px;
}

.osp-gezinti-isaret {
    font-size: 0.65rem;
    transition: transform var(--osp-gecis-orta);
    margin-left: 2px;
}

.osp-gezinti-acilir-kok:hover .osp-gezinti-isaret {
    transform: rotate(180deg);
}

.osp-acilir-katman {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(8px);
    min-width: 520px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity var(--osp-gecis-orta), transform var(--osp-gecis-orta), visibility var(--osp-gecis-orta);
    padding-top: 12px;
    z-index: 1100;
}

.osp-gezinti-acilir-kok:hover .osp-acilir-katman {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
}

.osp-acilir-sarmal {
    background: var(--osp-gradyan-kart);
    border: 1px solid var(--osp-koyu-kenar);
    border-radius: var(--osp-yuvarla-orta);
    box-shadow: var(--osp-golge-agir);
    overflow: hidden;
    display: flex;
}

.osp-acilir-grup {
    flex: 1;
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.osp-acilir-kart {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    border-radius: var(--osp-yuvarla-kucuk);
    transition: background-color var(--osp-gecis-hizli);
}

.osp-acilir-kart:hover {
    background-color: rgba(255, 255, 255, 0.05);
}

.osp-acilir-kart-ikon {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 212, 255, 0.08);
    border-radius: var(--osp-yuvarla-kucuk);
    color: var(--osp-vurgu-cyan);
    font-size: 1rem;
    flex-shrink: 0;
    transition: background-color var(--osp-gecis-hizli), transform var(--osp-gecis-hizli);
}

.osp-acilir-kart:hover .osp-acilir-kart-ikon {
    background: rgba(0, 212, 255, 0.14);
    transform: scale(1.05);
}

.osp-acilir-kart-metin {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.osp-acilir-kart-ad {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--osp-metin-ana);
}

.osp-acilir-kart-tanim {
    font-size: 0.75rem;
    color: var(--osp-metin-soluk);
    line-height: 1.4;
}

.osp-acilir-vurgu {
    width: 200px;
    background: rgba(0, 212, 255, 0.04);
    border-left: 1px solid var(--osp-koyu-kenar);
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
}

.osp-acilir-vurgu-baslik {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--osp-metin-soluk);
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.osp-acilir-vurgu-alan {
    font-family: var(--osp-font-baslik);
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--osp-vurgu-cyan);
}

.osp-acilir-vurgu-bag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--osp-mavi-parlak);
    margin-top: 4px;
    transition: color var(--osp-gecis-hizli), gap var(--osp-gecis-hizli);
}

.osp-acilir-vurgu-bag:hover {
    color: var(--osp-vurgu-cyan);
    gap: 10px;
}

.osp-ust-panel-eylemler {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.osp-resmi-adres-dugme {
    display: none;
    align-items: center;
    gap: 8px;
    padding: 9px 20px;
    background: var(--osp-gradyan-mavi);
    color: var(--osp-beyaz);
    font-size: 0.8125rem;
    font-weight: 600;
    border-radius: var(--osp-yuvarla-tam);
    transition: box-shadow var(--osp-gecis-orta), transform var(--osp-gecis-hizli);
    white-space: nowrap;
}

.osp-resmi-adres-dugme:hover {
    box-shadow: var(--osp-golge-vurgu);
    transform: translateY(-1px);
}

.osp-resmi-adres-ikon {
    font-size: 0.85rem;
}

.osp-hamburger-kutu {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    gap: 5px;
    cursor: pointer;
    border-radius: var(--osp-yuvarla-kucuk);
    transition: background-color var(--osp-gecis-hizli);
    -webkit-tap-highlight-color: transparent;
}

.osp-hamburger-kutu:hover {
    background-color: rgba(255, 255, 255, 0.05);
}

.osp-hamburger-hat {
    display: block;
    width: 22px;
    height: 2px;
    background-color: var(--osp-metin-ana);
    border-radius: 2px;
    transition: transform var(--osp-gecis-orta), opacity var(--osp-gecis-orta), background-color var(--osp-gecis-hizli);
    transform-origin: center;
}

.osp-hamburger-kutu-aktif .osp-hamburger-hat-bir {
    transform: translateY(7px) rotate(45deg);
}

.osp-hamburger-kutu-aktif .osp-hamburger-hat-iki {
    opacity: 0;
    transform: scaleX(0);
}

.osp-hamburger-kutu-aktif .osp-hamburger-hat-uc {
    transform: translateY(-7px) rotate(-45deg);
}

.osp-mobil-perde {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    z-index: 1200;
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--osp-gecis-orta), visibility var(--osp-gecis-orta);
}

.osp-mobil-perde-aktif {
    opacity: 1;
    visibility: visible;
}

.osp-mobil-cekmece {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 320px;
    max-width: 85vw;
    background: var(--osp-gradyan-koyu);
    z-index: 1300;
    transform: translateX(100%);
    transition: transform var(--osp-gecis-yavas);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.osp-mobil-cekmece-aktif {
    transform: translateX(0);
}

.osp-mobil-cekmece-ust {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid var(--osp-koyu-kenar);
    flex-shrink: 0;
}

.osp-mobil-marka-bag {
    display: flex;
    align-items: center;
}

.osp-mobil-marka-gorsel {
    height: 30px;
    width: auto;
}

.osp-mobil-kapat-dugme {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--osp-metin-ikincil);
    border-radius: var(--osp-yuvarla-kucuk);
    transition: color var(--osp-gecis-hizli), background-color var(--osp-gecis-hizli);
    font-size: 1.1rem;
    -webkit-tap-highlight-color: transparent;
}

.osp-mobil-kapat-dugme:hover {
    color: var(--osp-beyaz);
    background-color: rgba(255, 255, 255, 0.06);
}

.osp-mobil-cekmece-govde {
    flex: 1;
    overflow-y: auto;
    padding: 16px 0;
    -webkit-overflow-scrolling: touch;
}

.osp-mobil-adres-kutusu {
    margin: 0 16px 16px;
    padding: 14px 16px;
    background: rgba(0, 212, 255, 0.06);
    border: 1px solid rgba(0, 212, 255, 0.12);
    border-radius: var(--osp-yuvarla-orta);
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.osp-mobil-adres-ust-yazi {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--osp-metin-soluk);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.osp-mobil-adres-vurgu {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--osp-vurgu-cyan);
    transition: color var(--osp-gecis-hizli);
}

.osp-mobil-adres-vurgu i:first-child {
    font-size: 0.75rem;
}

.osp-mobil-adres-vurgu i:last-child {
    font-size: 0.65rem;
    margin-left: auto;
    opacity: 0.6;
}

.osp-mobil-dizi {
    padding: 0 8px;
}

.osp-mobil-birim {
    border-radius: var(--osp-yuvarla-kucuk);
}

.osp-mobil-bag {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 13px 12px;
    border-radius: var(--osp-yuvarla-kucuk);
    transition: background-color var(--osp-gecis-hizli);
}

.osp-mobil-bag:hover,
.osp-mobil-bag:active {
    background-color: rgba(255, 255, 255, 0.04);
}

.osp-mobil-secili .osp-mobil-bag {
    background-color: rgba(0, 212, 255, 0.06);
}

.osp-mobil-bag-ikon {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--osp-koyu-orta);
    border-radius: var(--osp-yuvarla-kucuk);
    color: var(--osp-metin-ikincil);
    font-size: 0.85rem;
    flex-shrink: 0;
    transition: background-color var(--osp-gecis-hizli), color var(--osp-gecis-hizli);
}

.osp-mobil-secili .osp-mobil-bag-ikon {
    background-color: rgba(0, 212, 255, 0.1);
    color: var(--osp-vurgu-cyan);
}

.osp-mobil-bag-yazi {
    flex: 1;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--osp-metin-ana);
}

.osp-mobil-secili .osp-mobil-bag-yazi {
    color: var(--osp-vurgu-cyan);
}

.osp-mobil-bag-ok {
    font-size: 0.65rem;
    color: var(--osp-metin-soluk);
    transition: transform var(--osp-gecis-hizli);
}

.osp-mobil-bag:hover .osp-mobil-bag-ok {
    transform: translateX(3px);
}

.osp-mobil-ek-bolum {
    margin: 16px 16px 0;
    padding-top: 16px;
    border-top: 1px solid var(--osp-koyu-kenar);
}

.osp-mobil-ek-baslik {
    display: block;
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--osp-metin-soluk);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 0 4px 10px;
}

.osp-mobil-ek-satirlar {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.osp-mobil-ek-bag {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 8px;
    font-size: 0.8rem;
    color: var(--osp-metin-ikincil);
    border-radius: var(--osp-yuvarla-kucuk);
    transition: color var(--osp-gecis-hizli), background-color var(--osp-gecis-hizli);
}

.osp-mobil-ek-bag:hover {
    color: var(--osp-metin-ana);
    background-color: rgba(255, 255, 255, 0.03);
}

.osp-mobil-ek-bag i {
    width: 18px;
    text-align: center;
    font-size: 0.75rem;
}

.osp-mobil-iletisim-kutu {
    margin: 16px 16px 0;
    padding: 14px 16px;
    background-color: var(--osp-koyu-orta);
    border-radius: var(--osp-yuvarla-orta);
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.osp-mobil-iletisim-bag {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--osp-metin-ana);
    transition: color var(--osp-gecis-hizli);
}

.osp-mobil-iletisim-bag:hover {
    color: var(--osp-vurgu-cyan);
}

.osp-mobil-iletisim-bag i {
    font-size: 0.8rem;
    color: var(--osp-vurgu-cyan);
    width: 18px;
    text-align: center;
}

.osp-mobil-iletisim-konum {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.8rem;
    color: var(--osp-metin-soluk);
}

.osp-mobil-iletisim-konum i {
    font-size: 0.75rem;
    color: var(--osp-metin-soluk);
    width: 18px;
    text-align: center;
}

.osp-mobil-cekmece-alt {
    padding: 14px 20px;
    border-top: 1px solid var(--osp-koyu-kenar);
    flex-shrink: 0;
}

.osp-mobil-telif {
    font-size: 0.7rem;
    color: var(--osp-metin-soluk);
    text-align: center;
}

.osp-ana-govde {
    min-height: 50vh;
    padding-top: 0;
}

.osp-alt-panel {
    background: var(--osp-gradyan-koyu);
    border-top: 1px solid var(--osp-koyu-kenar);
    margin-top: auto;
}

.osp-alt-panel-sarmal {
    width: 100%;
    max-width: var(--osp-icerik-genislik);
    margin: 0 auto;
    padding: 0 16px;
}

.osp-alt-panel-ust {
    padding: 48px 0 40px;
}

.osp-alt-panel-ust .osp-alt-panel-sarmal {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.osp-alt-tanitim-blogu {
    max-width: 100%;
}

.osp-alt-marka-bag {
    display: inline-flex;
    margin-bottom: 16px;
}

.osp-alt-marka-gorsel {
    height: 32px;
    width: auto;
    opacity: 0.9;
    transition: opacity var(--osp-gecis-hizli);
}

.osp-alt-marka-bag:hover .osp-alt-marka-gorsel {
    opacity: 1;
}

.osp-alt-tanitim-metin {
    font-size: 0.875rem;
    line-height: 1.7;
    color: var(--osp-metin-ikincil);
    margin-bottom: 20px;
    max-width: 480px;
}

.osp-alt-sosyal-dizi {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.osp-alt-sosyal-bag {
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--osp-koyu-orta);
    border: 1px solid var(--osp-koyu-kenar);
    border-radius: var(--osp-yuvarla-kucuk);
    color: var(--osp-metin-ikincil);
    font-size: 0.9rem;
    transition: color var(--osp-gecis-hizli), background-color var(--osp-gecis-hizli), border-color var(--osp-gecis-hizli), transform var(--osp-gecis-hizli);
}

.osp-alt-sosyal-bag:hover {
    transform: translateY(-2px);
}

.osp-alt-sosyal-pinterest:hover {
    color: #e60023;
    border-color: rgba(230, 0, 35, 0.3);
    background-color: rgba(230, 0, 35, 0.08);
}

.osp-alt-sosyal-youtube:hover {
    color: #ff0000;
    border-color: rgba(255, 0, 0, 0.3);
    background-color: rgba(255, 0, 0, 0.08);
}

.osp-alt-sosyal-reddit:hover {
    color: #ff4500;
    border-color: rgba(255, 69, 0, 0.3);
    background-color: rgba(255, 69, 0, 0.08);
}

.osp-alt-sosyal-instagram:hover {
    color: #e4405f;
    border-color: rgba(228, 64, 95, 0.3);
    background-color: rgba(228, 64, 95, 0.08);
}

.osp-alt-sosyal-facebook:hover {
    color: #1877f2;
    border-color: rgba(24, 119, 242, 0.3);
    background-color: rgba(24, 119, 242, 0.08);
}

.osp-alt-sutun-grubu {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px 24px;
}

.osp-alt-sutun-baslik {
    display: block;
    font-family: var(--osp-font-baslik);
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--osp-beyaz);
    margin-bottom: 16px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--osp-koyu-kenar);
    position: relative;
}

.osp-alt-sutun-baslik::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 30px;
    height: 2px;
    background: var(--osp-gradyan-mavi);
    border-radius: 2px;
}

.osp-alt-sutun-liste {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.osp-alt-sutun-bag {
    display: inline-flex;
    align-items: center;
    font-size: 0.85rem;
    color: var(--osp-metin-ikincil);
    padding: 4px 0;
    transition: color var(--osp-gecis-hizli), padding-left var(--osp-gecis-hizli);
}

.osp-alt-sutun-bag:hover {
    color: var(--osp-vurgu-cyan);
    padding-left: 6px;
}

.osp-alt-iletisim-satir {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 0.85rem;
    color: var(--osp-metin-ikincil);
    padding: 4px 0;
}

.osp-alt-iletisim-ikon {
    color: var(--osp-vurgu-cyan);
    font-size: 0.8rem;
    margin-top: 3px;
    width: 16px;
    text-align: center;
    flex-shrink: 0;
}

.osp-alt-adres-seridi {
    background: rgba(0, 212, 255, 0.04);
    border-top: 1px solid var(--osp-koyu-kenar);
    border-bottom: 1px solid var(--osp-koyu-kenar);
    padding: 14px 0;
}

.osp-alt-adres-sarmal {
    width: 100%;
    max-width: var(--osp-icerik-genislik);
    margin: 0 auto;
    padding: 0 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    text-align: center;
}

.osp-alt-adres-etiket {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--osp-metin-soluk);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.osp-alt-adres-bag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: var(--osp-font-baslik);
    font-size: 1rem;
    font-weight: 700;
    color: var(--osp-vurgu-cyan);
    transition: color var(--osp-gecis-hizli), gap var(--osp-gecis-hizli);
}

.osp-alt-adres-bag:hover {
    color: var(--osp-mavi-acik);
    gap: 12px;
}

.osp-alt-adres-bag i:first-child {
    font-size: 0.8rem;
}

.osp-alt-adres-bag i:last-child {
    font-size: 0.65rem;
    opacity: 0.7;
}

.osp-alt-panel-son {
    padding: 20px 0;
    border-top: none;
}

.osp-alt-panel-son .osp-alt-panel-sarmal {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: center;
    text-align: center;
}

.osp-alt-telif-metni {
    font-size: 0.8rem;
    color: var(--osp-metin-ikincil);
    font-weight: 500;
}

.osp-alt-sorumluluk-metni {
    font-size: 0.75rem;
    color: var(--osp-metin-soluk);
    line-height: 1.5;
    max-width: 520px;
}

.osp-alt-son-gezinti {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.osp-alt-son-bag {
    font-size: 0.78rem;
    color: var(--osp-metin-soluk);
    padding: 4px 6px;
    border-radius: 4px;
    transition: color var(--osp-gecis-hizli);
}

.osp-alt-son-bag:hover {
    color: var(--osp-vurgu-cyan);
}

.osp-alt-son-ayirici {
    width: 3px;
    height: 3px;
    background-color: var(--osp-koyu-parlak);
    border-radius: 50%;
    flex-shrink: 0;
}

.osp-alt-sorumlu-kisi {
    padding: 12px 0;
    border-top: 1px solid var(--osp-koyu-kenar);
}

.osp-alt-sorumlu-metin {
    font-size: 0.72rem;
    color: var(--osp-metin-soluk);
    text-align: center;
}

.osp-cerez-bildirimi {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 2000;
    background-color: var(--osp-koyu-ana);
    border-top: 1px solid var(--osp-koyu-kenar);
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.4);
    transform: translateY(100%);
    transition: transform var(--osp-gecis-yavas);
}

.osp-cerez-bildirimi-gorunur {
    transform: translateY(0);
}

.osp-cerez-bildirimi-sarmal {
    max-width: var(--osp-icerik-genislik);
    margin: 0 auto;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    align-items: stretch;
}

.osp-cerez-bildirimi-icerik {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.osp-cerez-bildirimi-ikon {
    color: var(--osp-vurgu-turuncu);
    font-size: 1.2rem;
    flex-shrink: 0;
    margin-top: 2px;
}

.osp-cerez-bildirimi-metin {
    font-size: 0.825rem;
    color: var(--osp-metin-ikincil);
    line-height: 1.6;
}

.osp-cerez-bildirimi-bag {
    color: var(--osp-vurgu-cyan);
    font-weight: 500;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.osp-cerez-bildirimi-bag:hover {
    color: var(--osp-mavi-acik);
}

.osp-cerez-bildirimi-eylemler {
    display: flex;
    gap: 10px;
    align-self: flex-end;
}

.osp-cerez-bildirimi-kabul {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px 24px;
    background: var(--osp-gradyan-mavi);
    color: var(--osp-beyaz);
    font-size: 0.8125rem;
    font-weight: 600;
    border-radius: var(--osp-yuvarla-tam);
    transition: box-shadow var(--osp-gecis-orta), transform var(--osp-gecis-hizli);
    cursor: pointer;
}

.osp-cerez-bildirimi-kabul:hover {
    box-shadow: var(--osp-golge-vurgu);
    transform: translateY(-1px);
}

.osp-cerez-bildirimi-detay {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px 18px;
    background-color: transparent;
    border: 1px solid var(--osp-koyu-kenar);
    color: var(--osp-metin-ikincil);
    font-size: 0.8125rem;
    font-weight: 500;
    border-radius: var(--osp-yuvarla-tam);
    transition: border-color var(--osp-gecis-hizli), color var(--osp-gecis-hizli);
}

.osp-cerez-bildirimi-detay:hover {
    border-color: var(--osp-metin-soluk);
    color: var(--osp-metin-ana);
}

.osp-yukari-don {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 900;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--osp-koyu-orta);
    border: 1px solid var(--osp-koyu-kenar);
    border-radius: var(--osp-yuvarla-orta);
    color: var(--osp-metin-ikincil);
    font-size: 0.9rem;
    opacity: 0;
    visibility: hidden;
    transform: translateY(16px);
    transition: opacity var(--osp-gecis-orta), visibility var(--osp-gecis-orta), transform var(--osp-gecis-orta), background-color var(--osp-gecis-hizli), color var(--osp-gecis-hizli);
    box-shadow: var(--osp-golge-orta);
}

.osp-yukari-don-gorunur {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.osp-yukari-don:hover {
    background-color: var(--osp-mavi-derin);
    border-color: var(--osp-mavi-ana);
    color: var(--osp-beyaz);
}

.osp-sayfa-kahraman {
    padding: 48px 0 40px;
    text-align: center;
    background: var(--osp-gradyan-koyu);
    border-bottom: 1px solid var(--osp-koyu-kenar);
}

.osp-sayfa-kahraman-sarmal {
    max-width: var(--osp-icerik-genislik);
    margin: 0 auto;
    padding: 0 16px;
}

.osp-sayfa-kahraman-etiket {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 14px;
    background: rgba(0, 212, 255, 0.08);
    border: 1px solid rgba(0, 212, 255, 0.15);
    border-radius: var(--osp-yuvarla-tam);
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--osp-vurgu-cyan);
    margin-bottom: 16px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.osp-sayfa-kahraman h1 {
    font-size: 1.75rem;
    font-weight: 800;
    line-height: 1.25;
    margin-bottom: 14px;
    background: var(--osp-gradyan-mavi);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.osp-sayfa-kahraman-aciklama {
    font-size: 0.95rem;
    color: var(--osp-metin-ikincil);
    line-height: 1.7;
    max-width: 640px;
    margin: 0 auto;
}

.osp-icerik-bolumu {
    max-width: var(--osp-icerik-genislik);
    margin: 0 auto;
    padding: 40px 16px;
}

.osp-icerik-dar-bolum {
    max-width: var(--osp-icerik-dar);
    margin: 0 auto;
    padding: 40px 16px;
}

.osp-icerik-bolumu h2,
.osp-icerik-dar-bolum h2 {
    font-size: 1.4rem;
    font-weight: 700;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--osp-koyu-kenar);
    position: relative;
}

.osp-icerik-bolumu h2::after,
.osp-icerik-dar-bolum h2::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 50px;
    height: 2px;
    background: var(--osp-gradyan-mavi);
    border-radius: 2px;
}

.osp-icerik-bolumu h3,
.osp-icerik-dar-bolum h3 {
    font-size: 1.15rem;
    font-weight: 600;
    margin-top: 28px;
    margin-bottom: 10px;
    color: var(--osp-mavi-acik);
}

.osp-icerik-bolumu p,
.osp-icerik-dar-bolum p {
    font-size: 0.95rem;
    color: var(--osp-metin-ikincil);
    line-height: 1.8;
    margin-bottom: 16px;
}

.osp-icerik-bolumu a,
.osp-icerik-dar-bolum a {
    color: var(--osp-vurgu-cyan);
    font-weight: 500;
    transition: color var(--osp-gecis-hizli);
}

.osp-icerik-bolumu a:hover,
.osp-icerik-dar-bolum a:hover {
    color: var(--osp-mavi-acik);
}

.osp-icerik-bolumu ul,
.osp-icerik-dar-bolum ul,
.osp-icerik-bolumu ol,
.osp-icerik-dar-bolum ol {
    margin: 0 0 20px 0;
    padding-left: 0;
}

.osp-icerik-bolumu li,
.osp-icerik-dar-bolum li {
    position: relative;
    padding: 6px 0 6px 24px;
    font-size: 0.95rem;
    color: var(--osp-metin-ikincil);
    line-height: 1.7;
}

.osp-icerik-bolumu ul li::before,
.osp-icerik-dar-bolum ul li::before {
    content: '';
    position: absolute;
    left: 6px;
    top: 14px;
    width: 6px;
    height: 6px;
    background: var(--osp-gradyan-mavi);
    border-radius: 50%;
}

.osp-icerik-bolumu ol {
    counter-reset: osp-liste-sayac;
}

.osp-icerik-bolumu ol li,
.osp-icerik-dar-bolum ol li {
    counter-increment: osp-liste-sayac;
}

.osp-icerik-bolumu ol li::before,
.osp-icerik-dar-bolum ol li::before {
    content: counter(osp-liste-sayac) '.';
    position: absolute;
    left: 2px;
    font-weight: 700;
    font-size: 0.85rem;
    color: var(--osp-vurgu-cyan);
}

.osp-icerik-bolumu blockquote,
.osp-icerik-dar-bolum blockquote {
    border-left: 3px solid var(--osp-mavi-ana);
    background-color: rgba(30, 136, 229, 0.06);
    padding: 16px 20px;
    margin: 20px 0;
    border-radius: 0 var(--osp-yuvarla-kucuk) var(--osp-yuvarla-kucuk) 0;
}

.osp-icerik-bolumu blockquote p,
.osp-icerik-dar-bolum blockquote p {
    font-style: italic;
    color: var(--osp-metin-ana);
}

.osp-icerik-bolumu table,
.osp-icerik-dar-bolum table {
    width: 100%;
    margin: 20px 0;
    border-radius: var(--osp-yuvarla-kucuk);
    overflow: hidden;
    border: 1px solid var(--osp-koyu-kenar);
}

.osp-icerik-bolumu th,
.osp-icerik-dar-bolum th {
    background-color: var(--osp-koyu-orta);
    padding: 12px 16px;
    text-align: left;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--osp-beyaz);
    border-bottom: 1px solid var(--osp-koyu-kenar);
}

.osp-icerik-bolumu td,
.osp-icerik-dar-bolum td {
    padding: 10px 16px;
    font-size: 0.875rem;
    color: var(--osp-metin-ikincil);
    border-bottom: 1px solid var(--osp-koyu-kenar);
}

.osp-icerik-bolumu tr:last-child td,
.osp-icerik-dar-bolum tr:last-child td {
    border-bottom: none;
}

.osp-kart-izgara {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
    margin: 24px 0;
}

.osp-kart-birim {
    background: var(--osp-gradyan-kart);
    border: 1px solid var(--osp-koyu-kenar);
    border-radius: var(--osp-yuvarla-orta);
    padding: 24px;
    transition: border-color var(--osp-gecis-orta), box-shadow var(--osp-gecis-orta), transform var(--osp-gecis-orta);
}

.osp-kart-birim:hover {
    border-color: var(--osp-koyu-parlak);
    box-shadow: var(--osp-golge-orta);
    transform: translateY(-3px);
}

.osp-kart-birim-gorsel {
    width: 100%;
    height: 180px;
    object-fit: cover;
    border-radius: var(--osp-yuvarla-kucuk);
    margin-bottom: 16px;
}

.osp-kart-birim-baslik {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--osp-beyaz);
    margin-bottom: 8px;
}

.osp-kart-birim-ozet {
    font-size: 0.85rem;
    color: var(--osp-metin-ikincil);
    line-height: 1.6;
    margin-bottom: 14px;
}

.osp-kart-birim-bag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--osp-vurgu-cyan);
    transition: gap var(--osp-gecis-hizli);
}

.osp-kart-birim-bag:hover {
    gap: 10px;
}

.osp-bilgi-kutusu {
    background: rgba(0, 212, 255, 0.06);
    border: 1px solid rgba(0, 212, 255, 0.12);
    border-radius: var(--osp-yuvarla-orta);
    padding: 20px 24px;
    margin: 24px 0;
    display: flex;
    align-items: flex-start;
    gap: 14px;
}

.osp-bilgi-kutusu-ikon {
    color: var(--osp-vurgu-cyan);
    font-size: 1.1rem;
    flex-shrink: 0;
    margin-top: 2px;
}

.osp-bilgi-kutusu p {
    color: var(--osp-metin-ana);
    font-size: 0.875rem;
}

.osp-uyari-kutusu {
    background: rgba(255, 152, 0, 0.06);
    border: 1px solid rgba(255, 152, 0, 0.15);
    border-radius: var(--osp-yuvarla-orta);
    padding: 20px 24px;
    margin: 24px 0;
    display: flex;
    align-items: flex-start;
    gap: 14px;
}

.osp-uyari-kutusu-ikon {
    color: var(--osp-vurgu-turuncu);
    font-size: 1.1rem;
    flex-shrink: 0;
    margin-top: 2px;
}

.osp-uyari-kutusu p {
    color: var(--osp-metin-ana);
    font-size: 0.875rem;
}

.osp-aksiyon-cubugu {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 24px 0;
    padding: 24px;
    background: var(--osp-gradyan-kart);
    border: 1px solid var(--osp-koyu-kenar);
    border-radius: var(--osp-yuvarla-orta);
    text-align: center;
}

.osp-aksiyon-cubugu-metin {
    font-size: 0.95rem;
    color: var(--osp-metin-ana);
    font-weight: 500;
}

.osp-aksiyon-bag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 28px;
    background: var(--osp-gradyan-mavi);
    color: var(--osp-beyaz);
    font-size: 0.875rem;
    font-weight: 600;
    border-radius: var(--osp-yuvarla-tam);
    transition: box-shadow var(--osp-gecis-orta), transform var(--osp-gecis-hizli);
    align-self: center;
}

.osp-aksiyon-bag:hover {
    box-shadow: var(--osp-golge-vurgu);
    transform: translateY(-2px);
    color: var(--osp-beyaz);
}

.osp-blog-karti-listesi {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
    margin: 24px 0;
}

.osp-blog-karti {
    background: var(--osp-gradyan-kart);
    border: 1px solid var(--osp-koyu-kenar);
    border-radius: var(--osp-yuvarla-orta);
    overflow: hidden;
    transition: border-color var(--osp-gecis-orta), box-shadow var(--osp-gecis-orta), transform var(--osp-gecis-orta);
}

.osp-blog-karti:hover {
    border-color: var(--osp-koyu-parlak);
    box-shadow: var(--osp-golge-orta);
    transform: translateY(-3px);
}

.osp-blog-karti-gorsel {
    width: 100%;
    height: 200px;
    object-fit: cover;
}

.osp-blog-karti-icerik {
    padding: 20px;
}

.osp-blog-karti-kategori {
    display: inline-block;
    padding: 3px 10px;
    background: rgba(0, 212, 255, 0.08);
    border-radius: var(--osp-yuvarla-tam);
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--osp-vurgu-cyan);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 10px;
}

.osp-blog-karti-baslik {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--osp-beyaz);
    margin-bottom: 8px;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.osp-blog-karti-ozet {
    font-size: 0.85rem;
    color: var(--osp-metin-ikincil);
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 14px;
}

.osp-blog-karti-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 0.75rem;
    color: var(--osp-metin-soluk);
}

.osp-blog-karti-meta span {
    display: flex;
    align-items: center;
    gap: 5px;
}

.osp-iletisim-bilgi-alan {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    margin: 24px 0;
}

.osp-iletisim-bilgi-kart {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px;
    background: var(--osp-gradyan-kart);
    border: 1px solid var(--osp-koyu-kenar);
    border-radius: var(--osp-yuvarla-orta);
    transition: border-color var(--osp-gecis-orta);
}

.osp-iletisim-bilgi-kart:hover {
    border-color: var(--osp-koyu-parlak);
}

.osp-iletisim-bilgi-ikon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 212, 255, 0.08);
    border-radius: var(--osp-yuvarla-orta);
    color: var(--osp-vurgu-cyan);
    font-size: 1.1rem;
    flex-shrink: 0;
}

.osp-iletisim-bilgi-metin span {
    display: block;
}

.osp-iletisim-bilgi-etiket {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--osp-metin-soluk);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 4px;
}

.osp-iletisim-bilgi-deger {
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--osp-metin-ana);
}

.osp-sss-liste {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 24px 0;
}

.osp-sss-birim {
    background: var(--osp-gradyan-kart);
    border: 1px solid var(--osp-koyu-kenar);
    border-radius: var(--osp-yuvarla-orta);
    overflow: hidden;
    transition: border-color var(--osp-gecis-orta);
}

.osp-sss-birim-acik {
    border-color: var(--osp-koyu-parlak);
}

.osp-sss-soru {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 20px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: background-color var(--osp-gecis-hizli);
}

.osp-sss-soru:hover {
    background-color: rgba(255, 255, 255, 0.02);
}

.osp-sss-soru-metin {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--osp-metin-ana);
    line-height: 1.4;
}

.osp-sss-birim-acik .osp-sss-soru-metin {
    color: var(--osp-vurgu-cyan);
}

.osp-sss-soru-isaret {
    font-size: 0.75rem;
    color: var(--osp-metin-soluk);
    flex-shrink: 0;
    transition: transform var(--osp-gecis-orta), color var(--osp-gecis-orta);
}

.osp-sss-birim-acik .osp-sss-soru-isaret {
    transform: rotate(180deg);
    color: var(--osp-vurgu-cyan);
}

.osp-sss-cevap {
    max-height: 0;
    overflow: hidden;
    transition: max-height var(--osp-gecis-yavas);
}

.osp-sss-birim-acik .osp-sss-cevap {
    max-height: 500px;
}

.osp-sss-cevap-ic {
    padding: 0 20px 18px;
    font-size: 0.875rem;
    color: var(--osp-metin-ikincil);
    line-height: 1.7;
    border-top: 1px solid var(--osp-koyu-kenar);
    padding-top: 16px;
}

.osp-etiket-grubu {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 16px 0;
}

.osp-etiket-birim {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 12px;
    background-color: var(--osp-koyu-orta);
    border: 1px solid var(--osp-koyu-kenar);
    border-radius: var(--osp-yuvarla-tam);
    font-size: 0.75rem;
    color: var(--osp-metin-ikincil);
    transition: border-color var(--osp-gecis-hizli), color var(--osp-gecis-hizli);
}

.osp-etiket-birim:hover {
    border-color: var(--osp-koyu-parlak);
    color: var(--osp-metin-ana);
}

.osp-yayin-detay-ust {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--osp-koyu-kenar);
}

.osp-yayin-detay-yazar {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    color: var(--osp-metin-ikincil);
}

.osp-yayin-detay-yazar i {
    color: var(--osp-vurgu-cyan);
    font-size: 0.8rem;
}

.osp-yayin-detay-tarih {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8rem;
    color: var(--osp-metin-soluk);
}

.osp-yayin-detay-tarih i {
    font-size: 0.75rem;
}

.osp-yayin-detay-okuma {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8rem;
    color: var(--osp-metin-soluk);
}

.osp-yayin-detay-okuma i {
    font-size: 0.75rem;
}

.osp-hata-sayfa-govde {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-height: 50vh;
    padding: 60px 16px;
}

.osp-hata-kod {
    font-family: var(--osp-font-baslik);
    font-size: 5rem;
    font-weight: 800;
    background: var(--osp-gradyan-mavi);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    line-height: 1;
    margin-bottom: 12px;
}

.osp-hata-baslik {
    font-size: 1.4rem;
    font-weight: 700;
    margin-bottom: 12px;
}

.osp-hata-aciklama {
    font-size: 0.95rem;
    color: var(--osp-metin-ikincil);
    margin-bottom: 28px;
    max-width: 420px;
}

.osp-yasal-icerik {
    max-width: var(--osp-icerik-dar);
    margin: 0 auto;
    padding: 40px 16px 60px;
}

.osp-yasal-icerik h1 {
    font-size: 1.6rem;
    margin-bottom: 8px;
}

.osp-yasal-icerik-tarih {
    font-size: 0.8rem;
    color: var(--osp-metin-soluk);
    margin-bottom: 32px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--osp-koyu-kenar);
}

.osp-yasal-icerik h2 {
    font-size: 1.15rem;
    margin-top: 32px;
    margin-bottom: 12px;
    color: var(--osp-mavi-acik);
}

.osp-yasal-icerik p {
    font-size: 0.9rem;
    color: var(--osp-metin-ikincil);
    line-height: 1.8;
    margin-bottom: 14px;
}

@media (min-width: 768px) {
    .osp-ust-bilgi-sol {
        display: flex;
    }

    .osp-ust-bilgi-sag {
        margin-left: 0;
    }

    .osp-marka-gorsel {
        height: 36px;
    }

    .osp-resmi-adres-dugme {
        display: inline-flex;
    }

    .osp-cerez-bildirimi-sarmal {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        padding: 16px 24px;
    }

    .osp-cerez-bildirimi-eylemler {
        align-self: center;
        flex-shrink: 0;
    }

    .osp-alt-sutun-grubu {
        grid-template-columns: repeat(2, 1fr);
        gap: 32px;
    }

    .osp-alt-panel-son .osp-alt-panel-sarmal {
        flex-direction: row;
        justify-content: space-between;
        text-align: left;
    }

    .osp-alt-son-sol {
        flex: 1;
    }

    .osp-alt-adres-sarmal {
        flex-direction: row;
        justify-content: center;
        gap: 12px;
    }

    .osp-sayfa-kahraman {
        padding: 56px 0 48px;
    }

    .osp-sayfa-kahraman h1 {
        font-size: 2rem;
    }

    .osp-kart-izgara {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
    }

    .osp-blog-karti-listesi {
        grid-template-columns: repeat(2, 1fr);
    }

    .osp-iletisim-bilgi-alan {
        grid-template-columns: repeat(2, 1fr);
    }

    .osp-aksiyon-cubugu {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        text-align: left;
    }

    .osp-hata-kod {
        font-size: 7rem;
    }
}

@media (min-width: 1024px) {
    :root {
        --osp-ust-panel-yukseklik: 68px;
    }

    .osp-ust-panel-sarmal {
        padding: 0 24px;
    }

    .osp-ust-bilgi-sarmal {
        padding: 0 24px;
    }

    .osp-gezinti-cubugu {
        display: flex;
    }

    .osp-hamburger-kutu {
        display: none;
    }

    .osp-marka-gorsel {
        height: 38px;
    }

    .osp-alt-panel-ust .osp-alt-panel-sarmal {
        flex-direction: row;
        gap: 48px;
    }

    .osp-alt-tanitim-blogu {
        max-width: 320px;
        flex-shrink: 0;
    }

    .osp-alt-sutun-grubu {
        grid-template-columns: repeat(4, 1fr);
        gap: 24px;
        flex: 1;
    }

    .osp-alt-panel-sarmal {
        padding: 0 24px;
    }

    .osp-icerik-bolumu,
    .osp-icerik-dar-bolum {
        padding: 48px 24px;
    }

    .osp-sayfa-kahraman {
        padding: 68px 0 56px;
    }

    .osp-sayfa-kahraman h1 {
        font-size: 2.25rem;
    }

    .osp-sayfa-kahraman-sarmal {
        padding: 0 24px;
    }

    .osp-kart-izgara {
        grid-template-columns: repeat(3, 1fr);
    }

    .osp-blog-karti-listesi {
        grid-template-columns: repeat(3, 1fr);
    }

    .osp-iletisim-bilgi-alan {
        grid-template-columns: repeat(3, 1fr);
    }

    .osp-yasal-icerik {
        padding: 48px 24px 72px;
    }

    .osp-hata-kod {
        font-size: 8rem;
    }

    .osp-hata-baslik {
        font-size: 1.6rem;
    }
}

@media (min-width: 1280px) {
    .osp-ust-panel-sarmal {
        padding: 0 32px;
    }

    .osp-ust-bilgi-sarmal {
        padding: 0 32px;
    }

    .osp-alt-panel-sarmal {
        padding: 0 32px;
    }

    .osp-alt-adres-sarmal {
        padding: 0 32px;
    }

    .osp-icerik-bolumu,
    .osp-icerik-dar-bolum {
        padding: 56px 32px;
    }

    .osp-sayfa-kahraman {
        padding: 80px 0 64px;
    }

    .osp-sayfa-kahraman h1 {
        font-size: 2.5rem;
    }

    .osp-sayfa-kahraman-sarmal {
        padding: 0 32px;
    }

    .osp-blog-karti-listesi {
        grid-template-columns: repeat(4, 1fr);
    }
}

.osp-kahraman-gorsel-alani {
    margin: 28px 0 24px;
    border-radius: var(--osp-yuvarla-orta);
    overflow: hidden;
    border: 1px solid var(--osp-koyu-kenar);
}

.osp-kahraman-ana-gorsel {
    width: 100%;
    height: auto;
    display: block;
}

.osp-kahraman-eylem-grubu {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    margin-top: 8px;
}

.osp-kahraman-ikincil-bag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 28px;
    border: 1px solid var(--osp-koyu-kenar);
    color: var(--osp-metin-ikincil);
    font-size: 0.875rem;
    font-weight: 600;
    border-radius: var(--osp-yuvarla-tam);
    transition: border-color var(--osp-gecis-hizli), color var(--osp-gecis-hizli), background-color var(--osp-gecis-hizli);
}

.osp-kahraman-ikincil-bag:hover {
    border-color: var(--osp-mavi-ana);
    color: var(--osp-beyaz);
    background-color: rgba(30, 136, 229, 0.08);
}

.osp-kart-birim-ikon-ust {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    background: rgba(0, 212, 255, 0.08);
    border-radius: var(--osp-yuvarla-orta);
    color: var(--osp-vurgu-cyan);
    font-size: 1.15rem;
    margin-bottom: 16px;
    transition: background-color var(--osp-gecis-hizli), transform var(--osp-gecis-hizli);
}

.osp-kart-birim:hover .osp-kart-birim-ikon-ust {
    background: rgba(0, 212, 255, 0.14);
    transform: scale(1.08);
}

.osp-arkaplan-koyu {
    background-color: var(--osp-koyu-ana);
    border-top: 1px solid var(--osp-koyu-kenar);
    border-bottom: 1px solid var(--osp-koyu-kenar);
}

.osp-bolum-iki-sutun {
    display: flex;
    flex-direction: column;
    gap: 28px;
}

.osp-bolum-metin-alani {
    flex: 1;
}

.osp-bolum-metin-alani h2 {
    font-size: 1.4rem;
    font-weight: 700;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--osp-koyu-kenar);
    position: relative;
}

.osp-bolum-metin-alani h2::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 50px;
    height: 2px;
    background: var(--osp-gradyan-mavi);
    border-radius: 2px;
}

.osp-bolum-metin-alani h3 {
    font-size: 1.15rem;
    font-weight: 600;
    margin-top: 28px;
    margin-bottom: 10px;
    color: var(--osp-mavi-acik);
}

.osp-bolum-metin-alani p {
    font-size: 0.95rem;
    color: var(--osp-metin-ikincil);
    line-height: 1.8;
    margin-bottom: 16px;
}

.osp-bolum-gorsel-alani {
    flex-shrink: 0;
}

.osp-bolum-gorsel {
    width: 100%;
    height: auto;
    border-radius: var(--osp-yuvarla-orta);
    border: 1px solid var(--osp-koyu-kenar);
}

.osp-oyun-turu-vitrin {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
    margin: 28px 0;
}

.osp-oyun-turu-kart {
    background: var(--osp-gradyan-kart);
    border: 1px solid var(--osp-koyu-kenar);
    border-radius: var(--osp-yuvarla-orta);
    overflow: hidden;
    transition: border-color var(--osp-gecis-orta), box-shadow var(--osp-gecis-orta), transform var(--osp-gecis-orta);
}

.osp-oyun-turu-kart:hover {
    border-color: var(--osp-koyu-parlak);
    box-shadow: var(--osp-golge-orta);
    transform: translateY(-3px);
}

.osp-oyun-turu-gorsel {
    width: 100%;
    height: 180px;
    object-fit: cover;
    display: block;
}

.osp-oyun-turu-icerik {
    padding: 18px 20px;
}

.osp-oyun-turu-icerik h3 {
    font-size: 1rem;
    font-weight: 700;
    color: var(--osp-beyaz);
    margin-bottom: 8px;
}

.osp-oyun-turu-icerik p {
    font-size: 0.85rem;
    color: var(--osp-metin-ikincil);
    line-height: 1.6;
}

.osp-bolum-daha-fazla {
    text-align: center;
    margin-top: 28px;
}

.osp-bolum-daha-fazla-bag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--osp-vurgu-cyan);
    padding: 10px 24px;
    border: 1px solid rgba(0, 212, 255, 0.2);
    border-radius: var(--osp-yuvarla-tam);
    transition: gap var(--osp-gecis-hizli), background-color var(--osp-gecis-hizli), border-color var(--osp-gecis-hizli);
}

.osp-bolum-daha-fazla-bag:hover {
    gap: 12px;
    background-color: rgba(0, 212, 255, 0.06);
    border-color: rgba(0, 212, 255, 0.35);
}

.osp-harita-cerceve {
    margin-top: 20px;
    border-radius: var(--osp-yuvarla-orta);
    overflow: hidden;
    border: 1px solid var(--osp-koyu-kenar);
    line-height: 0;
}

.osp-harita-cerceve iframe {
    width: 100%;
    height: 300px;
    display: block;
}

.osp-iletisim-sosyal-grup {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 20px;
}

.osp-iletisim-sosyal-bag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    background-color: var(--osp-koyu-orta);
    border: 1px solid var(--osp-koyu-kenar);
    border-radius: var(--osp-yuvarla-kucuk);
    color: var(--osp-metin-ikincil);
    font-size: 0.85rem;
    font-weight: 500;
    transition: color var(--osp-gecis-hizli), background-color var(--osp-gecis-hizli), border-color var(--osp-gecis-hizli), transform var(--osp-gecis-hizli);
}

.osp-iletisim-sosyal-bag:hover {
    color: var(--osp-vurgu-cyan);
    background-color: rgba(0, 212, 255, 0.06);
    border-color: rgba(0, 212, 255, 0.2);
    transform: translateY(-2px);
}

.osp-iletisim-sosyal-bag i {
    font-size: 1rem;
}

@media (min-width: 768px) {
    .osp-kahraman-eylem-grubu {
        flex-direction: row;
        justify-content: center;
    }

    .osp-bolum-iki-sutun {
        flex-direction: row;
        gap: 36px;
        align-items: flex-start;
    }

    .osp-bolum-ters {
        flex-direction: row-reverse;
    }

    .osp-bolum-gorsel-alani {
        width: 45%;
    }

    .osp-oyun-turu-vitrin {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) {
    .osp-bolum-gorsel-alani {
        width: 42%;
    }

    .osp-bolum-metin-alani h2 {
        font-size: 1.6rem;
    }

    .osp-oyun-turu-vitrin {
        grid-template-columns: repeat(4, 1fr);
    }

    .osp-oyun-turu-gorsel {
        height: 160px;
    }
}

@media (max-width: 374px) {
    .osp-mobil-cekmece {
        width: 100%;
        max-width: 100vw;
    }

    .osp-ust-bilgi-sag span {
        display: none;
    }

    .osp-ust-bilgi-eylem span {
        display: none;
    }
}

/* Dil Seçici */
.osp-dil-secici {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.osp-dil-secici-buton {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 8px;
    padding: 6px 10px;
    color: var(--osp-metin-b);
    font-size: 0.8rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.osp-dil-secici-buton:hover {
    background: rgba(255,255,255,0.12);
    border-color: rgba(255,255,255,0.2);
}

.osp-dil-secici-buton img,
.osp-dil-secici-buton .osp-bayrak {
    width: 20px;
    height: 14px;
    border-radius: 2px;
    object-fit: cover;
    font-size: 14px;
    line-height: 1;
}

.osp-dil-secici-katman {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    background: var(--osp-kart-arkaplan);
    border: 1px solid var(--osp-kart-kenar);
    border-radius: 12px;
    padding: 8px;
    min-width: 200px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.4);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: all 0.2s ease;
    z-index: 200;
}

.osp-dil-secici:hover .osp-dil-secici-katman,
.osp-dil-secici.acik .osp-dil-secici-katman {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.osp-dil-secici-baslik {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--osp-metin-c);
    padding: 6px 10px;
    border-bottom: 1px solid var(--osp-kart-kenar);
    margin-bottom: 4px;
}

.osp-dil-secici-dizi {
    list-style: none;
    padding: 0;
    margin: 0;
}

.osp-dil-secici-bag {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border-radius: 8px;
    color: var(--osp-metin-b);
    font-size: 0.85rem;
    text-decoration: none;
    transition: background 0.2s ease;
}

.osp-dil-secici-bag:hover {
    background: rgba(255,255,255,0.06);
    color: var(--osp-beyaz);
}

.osp-dil-secici-bag.aktif {
    background: rgba(0, 212, 255, 0.08);
    color: var(--osp-vurgu-a);
}

.osp-dil-secici-bag .osp-bayrak {
    width: 22px;
    height: 16px;
    border-radius: 2px;
    font-size: 16px;
    line-height: 1;
    flex-shrink: 0;
}

.osp-dil-secici-mobil {
    padding: 16px;
    border-top: 1px solid rgba(255,255,255,0.06);
    margin-top: 8px;
}

.osp-dil-secici-mobil-baslik {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--osp-metin-c);
    margin-bottom: 10px;
}

.osp-dil-secici-mobil-dizi {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.osp-dil-secici-mobil-bag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    background: rgba(255,255,255,0.06);
    border-radius: 8px;
    color: var(--osp-metin-b);
    font-size: 0.8rem;
    text-decoration: none;
    border: 1px solid transparent;
}

.osp-dil-secici-mobil-bag.aktif {
    background: rgba(0, 212, 255, 0.12);
    color: var(--osp-vurgu-a);
    border-color: rgba(0, 212, 255, 0.2);
}

.osp-dil-secici-mobil-bag .osp-bayrak {
    font-size: 14px;
    line-height: 1;
}

@media (max-width: 374px) {
    .osp-dil-secici-katman {
        min-width: 170px;
    }
}

/* RTL Support for Arabic */
[dir="rtl"] body,
[dir="rtl"] .osp-govde {
    direction: rtl;
    text-align: right;
}

[dir="rtl"] .osp-ust-bilgi-sarmal {
    direction: rtl;
}

[dir="rtl"] .osp-ust-panel-sarmal {
    direction: rtl;
}

[dir="rtl"] .osp-gezinti-dizi {
    flex-direction: row-reverse;
}

[dir="rtl"] .osp-ust-panel-eylemler {
    flex-direction: row-reverse;
}

[dir="rtl"] .osp-bolum-iki-sutun {
    flex-direction: row-reverse;
}

[dir="rtl"] .osp-bolum-ters {
    flex-direction: row;
}

[dir="rtl"] .osp-kart-izgara,
[dir="rtl"] .osp-oyun-turu-vitrin,
[dir="rtl"] .osp-blog-karti-listesi {
    direction: rtl;
}

[dir="rtl"] .osp-aksiyon-cubugu {
    flex-direction: row-reverse;
    direction: rtl;
}

[dir="rtl"] .osp-bolum-metin-alani h2,
[dir="rtl"] .osp-bolum-metin-alani h3,
[dir="rtl"] .osp-bolum-metin-alani p,
[dir="rtl"] .osp-sayfa-kahraman-sarmal,
[dir="rtl"] .osp-sayfa-kahraman-aciklama {
    text-align: right;
}

[dir="rtl"] .osp-dil-secici-katman {
    right: auto;
    left: 0;
}

[dir="rtl"] .osp-alt-panel-sarmal,
[dir="rtl"] .osp-alt-sutun-grubu {
    direction: rtl;
}

[dir="rtl"] .osp-alt-son-gezinti {
    flex-direction: row-reverse;
}

[dir="rtl"] .osp-alt-panel-sarmal {
    text-align: right;
}

[dir="rtl"] .osp-mobil-dizi {
    direction: rtl;
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}