/* ===== AVMEHMET - Stiller (orijinal style.css temel alındı) ===== */

/* BASE & RESET */
:root {
  --nx-black: #030303; --nx-panel: #0A0A0A; --nx-gold: #C7AA7E;
  --nx-white: #F2F2F2; --nx-gray: #444444; --nx-border: #1F1F1F;
}
body { background-color: #030303; color: #F2F2F2; font-family: 'Inter', sans-serif; overflow-x: hidden; }
::selection { background: #C7AA7E; color: #000; }
html { scroll-behavior: smooth; }

/* TYPOGRAPHY UTILS */
.text-massive { font-size: clamp(3rem, 8vw, 10rem); line-height: 0.9; letter-spacing: -0.03em; }
.text-outline { -webkit-text-stroke: 1px rgba(255,255,255,0.2); color: transparent; transition: all 0.5s; }
.group:hover .text-outline { color: #C7AA7E; -webkit-text-stroke: 0px; }

/* CUSTOM CURSOR */
.cursor-dot { width: 8px; height: 8px; background: #C7AA7E; position: fixed; pointer-events: none; z-index: 9999; border-radius: 50%; }

/* MARQUEE ANIMATION */
.marquee-container { overflow: hidden; white-space: nowrap; display: flex; }
.marquee-content { display: flex; animation: marquee 40s linear infinite; gap: 0; }
.marquee-content span { padding: 0 2rem; }
@keyframes marquee { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }

/* IMAGE HOVER REVEAL */
.hover-reveal-img {
  position: absolute; width: 300px; height: 400px; object-fit: cover;
  pointer-events: none; opacity: 0; transform: scale(0.8) translate(-50%, -50%);
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1); z-index: 20;
  left: 50%; top: 50%;
}
.reveal-item:hover .hover-reveal-img { opacity: 1; transform: scale(1) translate(-50%, -50%) rotate(2deg); }

/* NAVIGATION LINK STYLES */
.nav-link {
  position: relative;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: rgba(255, 255, 255, 0.8);
  transition: color 0.3s ease;
  padding-bottom: 4px;
}
.nav-link:hover { color: #ffffff; }
.nav-link::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0;
  width: 100%; height: 1px;
  background-color: #C7AA7E;
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.4s cubic-bezier(0.86, 0, 0.07, 1);
}
.nav-link:hover::after { transform: scaleX(1); transform-origin: left; }
.nav-link.active { color: #C7AA7E !important; }
.nav-link.active::after { transform: scaleX(1); transform-origin: left; }

/* MOBILE MENU */
.menu-btn-line { height: 1px; background: #fff; transition: 0.4s; }
#menu-toggle.open .menu-btn-line:nth-child(1) { transform: translateY(7px) rotate(45deg); }
#menu-toggle.open .menu-btn-line:nth-child(2) { opacity: 0; }
#menu-toggle.open .menu-btn-line:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.mobile-link.active { color: #C7AA7E; -webkit-text-stroke: 0; }

/* GRID BORDERS */
.grid-bordered > * { border-right: 1px solid #1F1F1F; border-bottom: 1px solid #1F1F1F; }

/* LIST 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; }

/* OVERFLOW FIX */
html, body { overflow-x: hidden !important; overflow-x: clip !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; }

/* ===================================================== */
/* ===== PROJEYE ÖZEL EKLER ===== */
/* ===================================================== */

/* Kaydırınca header */
#main-header.scrolled {
  padding-top: 1rem; padding-bottom: 1rem;
  background: rgba(3, 3, 3, 0.85);
  backdrop-filter: blur(10px);
}

/* Yukarı kayarak belirme */
@keyframes fadeUp { from { opacity: 0; transform: translateY(40px); } to { opacity: 1; transform: none; } }
.animate-fade-up { opacity: 0; animation: fadeUp 1s cubic-bezier(0.16, 1, 0.3, 1) forwards; }

/* Preloader + Alpine */
#preloader.hide { opacity: 0; pointer-events: none; }
[x-cloak] { display: none !important; }

/* Odak çizgisi: fareyle gizli, klavyeyle altın */
a:focus:not(:focus-visible), button:focus:not(:focus-visible) { outline: none; }
a:focus-visible, button:focus-visible { outline: 1px solid #C7AA7E; outline-offset: 4px; }

/* Logo yazısı (metalik altın) */
.logo-title {
  font-family: 'Cinzel', serif; font-weight: 500;
  text-transform: uppercase; letter-spacing: 0.12em;
  background: linear-gradient(180deg, #F3E1C6 0%, #D9B894 40%, #A5876B 75%, #8A6F51 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.logo-tagline {
  font-family: 'Cinzel', serif; font-weight: 400;
  text-transform: uppercase; letter-spacing: 0.3em; color: #C8AF9B;
  display: flex; align-items: center; gap: 0.5em;
}
.logo-tagline::before, .logo-tagline::after { content: ''; width: 14px; height: 1px; background: currentColor; opacity: 0.7; }

/* Sadece 1400-1535px arası: menü logoya çarpmasın diye biraz sıkılaşsın */
@media (max-width: 1535px) {
  #main-nav { gap: 1.75rem; padding-left: 1.75rem; padding-right: 1.75rem; }
}
/* İletişim menüsü açıkken "yukarı çık" butonu gizlensin (çakışmasın) */
body.iletisim-acik #backToTop {
  opacity: 0 !important;
  pointer-events: none !important;
}
/* ===== Yasal sayfa metinleri ===== */
.yasal-metin p { color: #9ca3af; font-weight: 300; line-height: 1.8; margin-bottom: 1.25rem; }
.yasal-metin h3 { font-family: 'Cinzel', serif; color: #F2F2F2; font-size: 1.5rem; margin: 3rem 0 1rem; }
.yasal-metin ul { list-style: disc; padding-left: 1.5rem; margin-bottom: 1.25rem; color: #9ca3af; font-weight: 300; line-height: 1.8; }
.yasal-metin li { margin-bottom: 0.5rem; }
.yasal-metin li::marker { color: #C7AA7E; }
.yasal-metin strong { color: #F2F2F2; font-weight: 500; }
.yasal-metin a { color: #C7AA7E; border-bottom: 1px solid rgba(199,170,126,0.4); }
.yasal-metin a:hover { color: #F2F2F2; border-color: #F2F2F2; }
/* ===== Açılış ekranı çizgisi ===== */
@keyframes yukleme { 0% { transform: translateX(-100%); } 100% { transform: translateX(100%); } }
.yukleme-cizgi { animation: yukleme 0.8s ease-in-out infinite; }

/* ===================================================== */
/* ===== TEMA RENKLERİ (Ayarlar → Site Teması) ===== */
/* Değişkenler assets/js/tailwind-config.js içinde tanımlıdır */
/* ===================================================== */
body { background-color: rgb(var(--t-black)); color: rgb(var(--t-white)); }
::selection { background: rgb(var(--t-gold)); color: rgb(var(--t-siyah)); }
.text-outline { -webkit-text-stroke: 1px rgb(var(--t-beyaz) / 0.2); }
.group:hover .text-outline { color: rgb(var(--t-gold)); }
.cursor-dot { background: rgb(var(--t-gold)); }
.nav-link { color: rgb(var(--t-beyaz) / 0.8); }
.nav-link:hover { color: rgb(var(--t-beyaz)); }
.nav-link::after { background-color: rgb(var(--t-gold)); }
.nav-link.active { color: rgb(var(--t-gold)) !important; }
.menu-btn-line { background: rgb(var(--t-beyaz)); }
.mobile-link.active { color: rgb(var(--t-gold)); }
.grid-bordered > * { border-right-color: rgb(var(--t-border)); border-bottom-color: rgb(var(--t-border)); }
#main-header.scrolled { background: rgb(var(--t-black) / 0.85); }
a:focus-visible, button:focus-visible { outline-color: rgb(var(--t-gold)); }
.logo-title { font-family: var(--t-baslik); background: var(--t-logo); -webkit-background-clip: text; background-clip: text; }
.logo-tagline { font-family: var(--t-baslik); color: var(--t-tagline); }
.yasal-metin p, .yasal-metin ul { color: rgb(var(--t-g400)); }
.yasal-metin h3 { font-family: var(--t-baslik); color: rgb(var(--t-white)); }
.yasal-metin li::marker { color: rgb(var(--t-gold)); }
.yasal-metin strong { color: rgb(var(--t-white)); }
.yasal-metin a { color: rgb(var(--t-gold)); border-bottom-color: rgb(var(--t-gold) / 0.4); }
.yasal-metin a:hover { color: rgb(var(--t-white)); border-color: rgb(var(--t-white)); }
/* Temaya özel küçük ayarlar */
[data-tema="lacivert"] img[src*="logo-mark"] { filter: grayscale(1) brightness(1.3); }
[data-tema="acik"] .slide-bg { opacity: 0.55; }

/* Açık tema: üst bar, mobil menü ve alt bilgi lacivert; içerik yumuşak fildişi */
[data-tema="acik"] #main-header, [data-tema="acik"] #fs-menu, [data-tema="acik"] footer {
  --t-black: 22 36 60; --t-panel: 22 36 60; --t-gold: 214 190 148; --t-white: 241 237 229; --t-gray: 150 160 178; --t-border: 48 66 98;
  --t-siyah: 14 24 42; --t-beyaz: 246 243 237; --t-g300: 214 219 227; --t-g400: 170 178 192; --t-g500: 138 148 166;
  --t-logo: linear-gradient(180deg, #F3E1C6 0%, #D9B894 40%, #A5876B 75%, #8A6F51 100%); --t-tagline: #C8AF9B;
}
[data-tema="acik"] #main-header { background: rgb(22 36 60); box-shadow: 0 1px 0 rgb(48 66 98); }
[data-tema="acik"] #main-header.scrolled { background: rgb(22 36 60 / 0.97); }
[data-tema="acik"] img[src*="logo-mark"] { filter: none; }
/* Lacivert tema: üst bar biraz daha açık lacivert, gümüş ince çizgi; alt bilgi daha koyu */
[data-tema="lacivert"] #main-header { background: rgb(19 30 54 / 0.94); backdrop-filter: blur(10px); box-shadow: 0 1px 0 rgb(201 206 214 / 0.14); }
[data-tema="lacivert"] footer { --t-panel: 8 13 25; --t-border: 30 42 66; }
/* Bant başlıkta menü "hap" kutusu gerekmez */
[data-tema="acik"] #main-nav, [data-tema="lacivert"] #main-nav { background: transparent; border-color: transparent; box-shadow: none; backdrop-filter: none; }

/* Açık tema: koyu ve daha kalın yazılar, belirgin kutular */
[data-tema="acik"] main .font-light, [data-tema="acik"] main .font-extralight { font-weight: 400; }
[data-tema="acik"] main p, [data-tema="acik"] main li { font-weight: 450; }
[data-tema="acik"] main .font-display { font-weight: 500; }
[data-tema="acik"] main .text-white\/40, [data-tema="acik"] main .text-white\/50, [data-tema="acik"] main .text-white\/60 { color: rgb(var(--t-beyaz) / 0.78); }
[data-tema="acik"] main .text-white\/70, [data-tema="acik"] main .text-white\/80 { color: rgb(var(--t-beyaz) / 0.9); }
[data-tema="acik"] .text-outline { -webkit-text-stroke: 1.5px rgb(var(--t-gold) / 0.75); }
[data-tema="acik"] main .text-nx-border\/50 { color: rgb(var(--t-gold) / 0.2); }
[data-tema="acik"] main .text-nx-border { color: rgb(var(--t-g500)); }
[data-tema="acik"] main .bg-nx-panel[class~="border"],
[data-tema="acik"] main .bg-white\/5[class~="border"],
[data-tema="acik"] main .bg-nx-black[class~="border"] {
  background-color: #FFFFFF; border-color: rgb(196 184 160);
  box-shadow: 0 1px 2px rgb(20 30 50 / 0.06), 0 10px 28px -14px rgb(20 30 50 / 0.22);
}
[data-tema="acik"] main .border-white\/10, [data-tema="acik"] main .border-nx-border { border-color: rgb(196 184 160); }

/* Açık tema: büyük dekoratif sayılar (01, 02...) daha kalın ve koyu */
[data-tema="acik"] main .font-display.text-nx-gold\/10,
[data-tema="acik"] main .font-display.text-nx-gold\/20,
[data-tema="acik"] main .font-display.text-nx-gold\/30,
[data-tema="acik"] main .font-display.text-white\/10,
[data-tema="acik"] main .font-display.text-white\/20,
[data-tema="acik"] main .font-display.text-nx-border\/50 { color: rgb(var(--t-gold) / 0.55); font-weight: 700; }
[data-tema="acik"] main .group:hover .font-display[class*="group-hover:text-"] { color: rgb(var(--t-gold) / 0.4); }

/* Açık tema: ana sayfa uzmanlık listesi kutucuklar hâlinde */
[data-tema="acik"] [data-liste="uzmanlik-ana"] { display: flex; flex-direction: column; gap: 1rem; }
[data-tema="acik"] [data-liste="uzmanlik-ana"] > a {
  background: #FFFFFF; border: 1px solid rgb(196 184 160) !important; border-radius: 6px;
  padding: 2.25rem 2.5rem; box-shadow: 0 1px 2px rgb(20 30 50 / 0.06), 0 10px 28px -14px rgb(20 30 50 / 0.22);
  transition: background-color .3s, box-shadow .3s, border-color .3s;
}
[data-tema="acik"] [data-liste="uzmanlik-ana"] > a:hover { background: #FBF9F5; border-color: rgb(var(--t-gold) / 0.45) !important; box-shadow: 0 2px 4px rgb(20 30 50 / 0.08), 0 16px 34px -16px rgb(20 30 50 / 0.3); }
@media (max-width: 767px) { [data-tema="acik"] [data-liste="uzmanlik-ana"] > a { padding: 1.5rem 1.25rem; } }

/* Lacivert tema: kalın yazılar ve belirgin kutular */
[data-tema="lacivert"] main .font-light, [data-tema="lacivert"] main .font-extralight { font-weight: 400; }
[data-tema="lacivert"] main p, [data-tema="lacivert"] main li { font-weight: 450; }
[data-tema="lacivert"] .font-display, [data-tema="lacivert"] .logo-title { font-weight: 600; }
[data-tema="lacivert"] main .text-white\/40, [data-tema="lacivert"] main .text-white\/50, [data-tema="lacivert"] main .text-white\/60 { color: rgb(var(--t-beyaz) / 0.82); }
[data-tema="lacivert"] main .text-white\/70, [data-tema="lacivert"] main .text-white\/80 { color: rgb(var(--t-beyaz) / 0.92); }
[data-tema="lacivert"] .text-outline { -webkit-text-stroke: 1.5px rgb(var(--t-gold) / 0.7); }
[data-tema="lacivert"] main .font-display.text-nx-gold\/10,
[data-tema="lacivert"] main .font-display.text-nx-gold\/20,
[data-tema="lacivert"] main .font-display.text-nx-gold\/30,
[data-tema="lacivert"] main .font-display.text-white\/10,
[data-tema="lacivert"] main .font-display.text-white\/20,
[data-tema="lacivert"] main .font-display.text-nx-border\/50 { color: rgb(var(--t-gold) / 0.45); font-weight: 700; }
[data-tema="lacivert"] main .group:hover .font-display[class*="group-hover:text-"] { color: rgb(var(--t-gold) / 0.3); }
[data-tema="lacivert"] main .text-nx-border { color: rgb(var(--t-g500)); }
[data-tema="lacivert"] main .bg-nx-panel[class~="border"],
[data-tema="lacivert"] main .bg-white\/5[class~="border"],
[data-tema="lacivert"] main .bg-nx-black[class~="border"] {
  background-color: rgb(24 36 62); border-color: rgb(201 206 214 / 0.22);
  box-shadow: 0 1px 2px rgb(0 0 0 / 0.25), 0 12px 30px -14px rgb(0 0 0 / 0.55);
}
[data-tema="lacivert"] main .border-white\/10, [data-tema="lacivert"] main .border-nx-border { border-color: rgb(201 206 214 / 0.2); }
[data-tema="lacivert"] [data-liste="uzmanlik-ana"] { display: flex; flex-direction: column; gap: 1rem; }
[data-tema="lacivert"] [data-liste="uzmanlik-ana"] > a {
  background: rgb(24 36 62); border: 1px solid rgb(201 206 214 / 0.22) !important; border-radius: 6px;
  padding: 2.25rem 2.5rem; box-shadow: 0 1px 2px rgb(0 0 0 / 0.25), 0 12px 30px -14px rgb(0 0 0 / 0.55);
  transition: background-color .3s, box-shadow .3s, border-color .3s;
}
[data-tema="lacivert"] [data-liste="uzmanlik-ana"] > a:hover { background: rgb(30 44 74); border-color: rgb(201 206 214 / 0.45) !important; }
@media (max-width: 767px) { [data-tema="lacivert"] [data-liste="uzmanlik-ana"] > a { padding: 1.5rem 1.25rem; } }

/* ===== EKİP PENCERESİ (yalnızca bilgisayar): kompakt görünüm – fotoğraf küçük ve bütün, yazılar bir tık küçük ===== */
@media (min-width: 1024px) {
  #teamModalContent { max-width: 50rem !important; }
  #teamModalContent > .flex > div:first-child { width: 17rem !important; flex: 0 0 17rem !important; align-self: flex-start; position: sticky !important; top: 2rem; margin: 2rem 0 2rem 2rem; border-radius: .75rem; overflow: hidden; }
  #teamModalContent > .flex > div:first-child > div:first-child { aspect-ratio: 3 / 4 !important; height: auto !important; }
  #teamModalContent > .flex > div:last-child { width: auto !important; flex: 1 1 0% !important; min-width: 0; padding: 2rem 2.25rem !important; }
  #modalImage { object-position: center top; }
  #modalName { font-size: 1.75rem !important; line-height: 1.2 !important; }
  #modalRole { font-size: .72rem !important; }
  #modalBio { font-size: .92rem !important; line-height: 1.7 !important; }
}

/* ===== RAKAM/KELİME ŞERİDİ (ana sayfa + hakkımızda): ortalı; uzun kelimeler tek satırda kalır, punto sütuna sığacak kadar otomatik küçülür (icerik.js) ===== */
.grid.grid-cols-2.border-t > div { min-width: 0; text-align: center !important; }
.grid.grid-cols-2.border-t > div > span.block.font-display { white-space: nowrap; }
@media (max-width: 767px) { .grid.grid-cols-2.border-t { column-gap: 1.25rem !important; } }
