/* DEMO 03 - CLEAN LUXURY STYLE */

:root {
    --nx-gold: #D4AF37;
    --nx-dark: #0F1115;
    --nx-light: #F9FAFB;
    --nx-white: #FFFFFF;
}

html {
    scroll-behavior: smooth;
    overflow-x: hidden;     /* fallback eski Safari iOS */
    overflow-x: clip;       /* modern — sticky'yi bozmaz */
    max-width: 100%;
}

body {
    font-family: 'Inter', sans-serif;
    color: var(--nx-dark);
    background-color: var(--nx-white);
    overflow-x: hidden;
    overflow-x: clip;
    max-width: 100vw;
    width: 100%;
    position: relative;
}

/* Genel overflow guard — hiçbir element viewport dışına taşmasın */
img, video, iframe, svg { max-width: 100%; }

/* Makale içeriği taşma güvenliği (DB'den gelen HTML için) */
.article-body img,
.article-body video,
.article-body iframe { max-width: 100%; height: auto; }
.article-body table { display: block; max-width: 100%; overflow-x: auto; }
.article-body pre,
.article-body code { white-space: pre-wrap; word-break: break-word; }

/* Paragraf wrap zorlaması — content'te   varsa bile kelimeler taşmaz.
   `anywhere` non-breaking space'i de yumuşak kırılma yeri olarak kabul eder.
   Hem .article-body (makale gövdesi) hem #article-content (excerpt vs. dahil) */
#article-content,
#article-content *,
.article-body,
.article-body * {
    overflow-wrap: anywhere;
    word-wrap: break-word;
    min-width: 0;
    max-width: 100%;
}

.font-serif { font-family: 'Playfair Display', serif; }

/* Scrollbar */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--nx-white); }
::-webkit-scrollbar-thumb { background: var(--nx-gold); border-radius: 4px; }

/* Navigation */
.nav-link { position: relative; padding-bottom: 4px; }
.nav-link::after {
    content: ''; position: absolute; width: 0; height: 2px; bottom: 0; left: 0;
    background-color: var(--nx-gold); transition: width 0.3s ease;
}
.nav-link:hover::after { width: 100%; }

/* Animations */
.loading-bar { animation: loadBar 1.5s infinite ease-in-out; transform-origin: left; }
@keyframes loadBar { 0% { transform: scaleX(0); } 50% { transform: scaleX(1); } 100% { transform: scaleX(0); transform-origin: right; } }

@keyframes fadeInUp { from { opacity: 0; transform: translateY(40px); } to { opacity: 1; transform: translateY(0); } }
.animate-fade-in-up { animation: fadeInUp 1s ease-out forwards; opacity: 0; }
.delay-100 { animation-delay: 0.1s; }
.delay-200 { animation-delay: 0.2s; }
.delay-300 { animation-delay: 0.3s; }

.reveal-up, .reveal-left, .reveal-right { opacity: 0; } /* GSAP handles reveal */

/* Modal */
#universal-modal { perspective: 1000px; }
#modal-body::-webkit-scrollbar { width: 6px; }
#modal-body::-webkit-scrollbar-thumb { background-color: rgba(0,0,0,0.2); border-radius: 3px; }
/* list-bullet-fix */
.prose ul,.article-body ul{list-style-type:disc!important;padding-left:1.6em!important;margin:.6em 0!important;}
.prose ul ul,.article-body ul ul{list-style-type:circle!important;}
.prose ol,.article-body ol{list-style-type:decimal!important;padding-left:1.6em!important;margin:.6em 0!important;}
.prose li,.article-body li{display:list-item!important;}

/* sync-overflow-fix */
html, body { overflow-x: hidden !important; max-width: 100% !important; overscroll-behavior-x: none; }
img, video, iframe, embed, object, svg { max-width: 100%; }
img, video { height: auto; }
.article-content img,
.article-content video,
.article-content iframe,
.article-content figure,
.article-content picture { max-width: 100%; height: auto; }
.article-content table { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.article-content pre, .article-content code { max-width: 100%; word-wrap: break-word; overflow-wrap: break-word; }
.article-content { word-wrap: break-word; overflow-wrap: break-word; }