/* Bordo - Mavi Özel Renk Geçişi (Gradient Text) */
.ts-gradient-text {
    background: linear-gradient(135deg, #a31236 0%, #00a8e8 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Glassmorphism Cam Efekti */
.glass-card {
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

/* Sayfa Geçiş Yumuşaklığı */
body {
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* --- SHARED SITE THEME STYLES --- */
.site-theme {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
.site-theme h1, .site-theme h2, .site-theme h3, .site-theme h4, .site-theme h5, .site-theme h6 {
    font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* Accessible High-Contrast Focus Visible Styles */
.site-theme a:focus-visible,
.site-theme button:focus-visible,
.site-theme input:focus-visible,
.site-theme select:focus-visible,
.site-theme textarea:focus-visible {
    outline: 2px solid #2F6FA3;
    outline-offset: 2px;
}
.site-theme.dark a:focus-visible,
.site-theme.dark button:focus-visible,
.site-theme.dark input:focus-visible,
.site-theme.dark select:focus-visible,
.site-theme.dark textarea:focus-visible,
.dark .site-theme a:focus-visible,
.dark .site-theme button:focus-visible,
.dark .site-theme input:focus-visible,
.dark .site-theme select:focus-visible,
.dark .site-theme textarea:focus-visible {
    outline: 2px solid #6F9FC3;
    outline-offset: 2px;
}

/* --- HOMEPAGE-SPECIFIC STYLES (.portfolio-page) --- */
.portfolio-page {
    font-family: 'Inter', sans-serif;
}
.portfolio-page h1, .portfolio-page h2, .portfolio-page h3, .portfolio-page h4, .portfolio-page h5, .portfolio-page h6 {
    font-family: 'Manrope', sans-serif;
}
/* Subtle Engineering Traces (Background Patterns) */
.site-theme .bg-grid-pattern,
.portfolio-page .bg-grid-pattern,
.bg-grid-pattern {
    background-size: 40px 40px;
    background-image: linear-gradient(to right, rgba(11, 27, 43, 0.05) 1px, transparent 1px),
                      linear-gradient(to bottom, rgba(11, 27, 43, 0.05) 1px, transparent 1px);
}
.site-theme.dark .bg-grid-pattern,
.dark .site-theme .bg-grid-pattern,
.portfolio-page.dark .bg-grid-pattern,
.dark .portfolio-page .bg-grid-pattern,
.dark.portfolio-page .bg-grid-pattern,
.dark .bg-grid-pattern {
    background-image: linear-gradient(to right, rgba(247, 243, 234, 0.03) 1px, transparent 1px),
                      linear-gradient(to bottom, rgba(247, 243, 234, 0.03) 1px, transparent 1px);
}
.portfolio-page .text-vertical {
    writing-mode: vertical-rl;
    text-orientation: mixed;
}

/* ==========================================================================
   HOMEPAGE STICKY ADAPTIVE NAVBAR
   ========================================================================== */

#navbar-container {
    transition: height 220ms ease;
}

#navbar-container #main-nav {
    transition: background-color 220ms ease, border-color 220ms ease, height 220ms ease;
}

#navbar-container .nav-inner {
    transition: height 220ms ease;
}

#navbar-container .nav-brand,
#navbar-container .nav-link,
#navbar-container .nav-academy,
#navbar-container .nav-icon-btn,
#navbar-container #mobile-menu,
#navbar-container .mobile-nav-link,
#navbar-container .mobile-nav-academy {
    transition: color 220ms ease, border-color 220ms ease, background-color 220ms ease;
}

/* 1. SCROLLED STATE - COMMON ARCHITECTURAL COMPACTING (64–68px) */
#navbar-container.is-sticky .nav-inner {
    height: 66px !important;
}

#navbar-container.is-sticky #main-nav {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

/* 2. LIGHT THEME — SCROLLED */
html:not(.dark) #navbar-container.is-sticky #main-nav {
    background-color: #0B1B2B !important;
    border-bottom: 1px solid rgba(247, 243, 234, 0.12) !important;
}

html:not(.dark) #navbar-container.is-sticky .nav-brand {
    color: #F7F3EA !important;
}

html:not(.dark) #navbar-container.is-sticky .nav-brand:hover {
    color: #6F9FC3 !important;
}

html:not(.dark) #navbar-container.is-sticky .nav-link {
    color: rgba(247, 243, 234, 0.70) !important;
    border-bottom-color: transparent !important;
}

html:not(.dark) #navbar-container.is-sticky .nav-link:hover {
    color: #F7F3EA !important;
}

html:not(.dark) #navbar-container.is-sticky .nav-link.nav-link-active,
html:not(.dark) #navbar-container.is-sticky .nav-link-active {
    color: #6F9FC3 !important;
    border-bottom-color: #6F9FC3 !important;
}

html:not(.dark) #navbar-container.is-sticky .nav-academy {
    color: #6F9FC3 !important;
}

html:not(.dark) #navbar-container.is-sticky .nav-academy:hover {
    color: #F7F3EA !important;
}

html:not(.dark) #navbar-container.is-sticky .nav-icon-btn {
    color: rgba(247, 243, 234, 0.70) !important;
}

html:not(.dark) #navbar-container.is-sticky .nav-icon-btn:hover {
    color: #F7F3EA !important;
    background-color: rgba(247, 243, 234, 0.08) !important;
}

html:not(.dark) #navbar-container.is-sticky #theme-toggle-dark-icon {
    color: #F7F3EA !important;
}

html:not(.dark) #navbar-container.is-sticky .nav-icon-btn:hover #theme-toggle-dark-icon {
    color: #6F9FC3 !important;
}

html:not(.dark) #navbar-container.is-sticky #mobile-menu-btn svg {
    stroke: rgba(247, 243, 234, 0.85) !important;
}

html:not(.dark) #navbar-container.is-sticky #mobile-menu-btn:hover svg {
    stroke: #F7F3EA !important;
}

/* Mobile Dropdown Menu (Light Theme Scrolled) */
html:not(.dark) #navbar-container.is-sticky #mobile-menu {
    background-color: #0B1B2B !important;
    border-top: 1px solid rgba(247, 243, 234, 0.12) !important;
}

html:not(.dark) #navbar-container.is-sticky .mobile-nav-link {
    color: rgba(247, 243, 234, 0.70) !important;
}

html:not(.dark) #navbar-container.is-sticky .mobile-nav-link:hover {
    color: #F7F3EA !important;
}

html:not(.dark) #navbar-container.is-sticky .mobile-nav-active,
html:not(.dark) #navbar-container.is-sticky .mobile-nav-link.mobile-nav-active {
    color: #6F9FC3 !important;
}

html:not(.dark) #navbar-container.is-sticky .mobile-nav-academy {
    color: #6F9FC3 !important;
}

html:not(.dark) #navbar-container.is-sticky .mobile-nav-academy:hover {
    color: #F7F3EA !important;
}


/* 3. DARK THEME — SCROLLED */
html.dark #navbar-container.is-sticky #main-nav {
    background-color: #EEE7D8 !important;
    border-bottom: 1px solid rgba(11, 27, 43, 0.12) !important;
}

html.dark #navbar-container.is-sticky .nav-brand {
    color: #0B1B2B !important;
}

html.dark #navbar-container.is-sticky .nav-brand:hover {
    color: #2F6FA3 !important;
}

html.dark #navbar-container.is-sticky .nav-link {
    color: #6D7880 !important;
    border-bottom-color: transparent !important;
}

html.dark #navbar-container.is-sticky .nav-link:hover {
    color: #0B1B2B !important;
}

html.dark #navbar-container.is-sticky .nav-link.nav-link-active,
html.dark #navbar-container.is-sticky .nav-link-active {
    color: #2F6FA3 !important;
    border-bottom-color: #2F6FA3 !important;
}

html.dark #navbar-container.is-sticky .nav-academy {
    color: #2F6FA3 !important;
}

html.dark #navbar-container.is-sticky .nav-academy:hover {
    color: #0B1B2B !important;
}

html.dark #navbar-container.is-sticky .nav-icon-btn {
    color: #0B1B2B !important;
}

html.dark #navbar-container.is-sticky .nav-icon-btn:hover {
    color: #2F6FA3 !important;
    background-color: rgba(47, 111, 163, 0.08) !important;
}

html.dark #navbar-container.is-sticky #theme-toggle-light-icon {
    color: #0B1B2B !important;
}

html.dark #navbar-container.is-sticky .nav-icon-btn:hover #theme-toggle-light-icon {
    color: #2F6FA3 !important;
}

html.dark #navbar-container.is-sticky #mobile-menu-btn svg {
    stroke: #0B1B2B !important;
}

html.dark #navbar-container.is-sticky #mobile-menu-btn:hover svg {
    stroke: #2F6FA3 !important;
}

/* Mobile Dropdown Menu (Dark Theme Scrolled) */
html.dark #navbar-container.is-sticky #mobile-menu {
    background-color: #EEE7D8 !important;
    border-top: 1px solid rgba(11, 27, 43, 0.12) !important;
}

html.dark #navbar-container.is-sticky .mobile-nav-link {
    color: #6D7880 !important;
}

html.dark #navbar-container.is-sticky .mobile-nav-link:hover {
    color: #0B1B2B !important;
}

html.dark #navbar-container.is-sticky .mobile-nav-active,
html.dark #navbar-container.is-sticky .mobile-nav-link.mobile-nav-active {
    color: #2F6FA3 !important;
}

html.dark #navbar-container.is-sticky .mobile-nav-academy {
    color: #2F6FA3 !important;
}

html.dark #navbar-container.is-sticky .mobile-nav-academy:hover {
    color: #0B1B2B !important;
}