/* XyloFit tanıtım sitesi — ortak stil. * * Renkler mobil uygulamadaki AppTheme ile birebir aynı (lib/core/theme/ * app_theme.dart). Kullanıcı mağazadan siteye ya da siteden uygulamaya * geçtiğinde aynı ürünün içinde olduğunu hissetmeli. * * İki tema var. Varsayılan koyu; açık tema ile * ya da (seçim yapılmamışsa) sistemin açık tema tercihiyle devreye girer. * Tema kararı ilk boyamadan önce her sayfanın 'indeki satır içi * betikte veriliyor; site.js yalnızca düğmeyi bağlar. Renk kullanan her * kural yalnızca aşağıdaki değişkenlere bakmalı — kurala doğrudan rgba * yazılırsa açık temada koyu leke olarak kalır. * * Yazı tipi bilerek sistem yığını: Google Fonts eklemek her ziyarette * Google'a istek atar, bunu gizlilik politikasında ayrıca beyan etmek * gerekirdi ve ilk boyamayı geciktirirdi. */ :root { --bg: #0A0A0F; --surface: #13131A; --surface-2: #1C1C26; --border: #2A2A38; --text: #FFFFFF; --dim: #9898A8; --hint: #55555F; --primary: #6C63FF; --primary-light: #9C95FF; --accent: #00D4AA; --danger: #FF4757; --warning: #FFA502; --success: #2ED573; /* Metin olarak kullanılan marka renkleri. Koyu zeminde vurgu renkleri olduğu gibi okunuyor; açık zeminde aynı tonlar soluk kalır, aşağıda koyultuluyor. Bağlantı, başlık gradyanı ve etiket bunları kullanır. */ --link: var(--primary-light); --accent-text: var(--accent); --grad-text: linear-gradient(100deg, var(--primary-light) 10%, var(--accent) 70%); /* Yarı saydam yüzeyler. Koyu temada beyazın, açıkta siyahın soluk katmanı */ --glass: rgba(255, 255, 255, .05); --glass-weak: rgba(255, 255, 255, .03); --glass-hover: rgba(255, 255, 255, .09); --border-strong: #3A3A4C; --card: rgba(19, 19, 26, .7); --card-hover: rgba(28, 28, 38, .8); --card-hover-border: #38384C; --card-soft: rgba(19, 19, 26, .6); --panel: rgba(19, 19, 26, .82); --panel-solid: rgba(19, 19, 26, .88); --header-bg: rgba(10, 10, 15, .78); --nav-bg: rgba(13, 13, 19, .97); --footer-bg: rgba(10, 10, 15, .6); /* Gölgeler: açık zeminde siyah gölge çamur gibi durur, hafifletiliyor */ --shadow-strong: rgba(0, 0, 0, .6); --shadow: rgba(0, 0, 0, .45); --shadow-soft: rgba(0, 0, 0, .5); --aurora-opacity: .5; --grad: linear-gradient(135deg, var(--primary), var(--accent)); --radius: 20px; --radius-sm: 12px; --maxw: 1140px; --header-h: 68px; --ease: cubic-bezier(.22, 1, .36, 1); --font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; } /* ------------------------------------------------------------ Açık tema Değerler AppTheme'in *Light sabitleriyle aynı. Aynı blok iki yerde: önce sistem tercihi (kullanıcı seçim yapmamışsa), sonra açık seçim. */ @media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) { --bg: #F8F9FD; --surface: #FFFFFF; --surface-2: #F0F2F8; --border: #E2E8F0; --text: #1A1A2E; --dim: #64748B; --hint: #9AA3B2; --link: #5B52E8; --accent-text: #00A383; --grad-text: linear-gradient(100deg, #5B52E8 10%, #00A383 70%); --glass: rgba(26, 26, 46, .05); --glass-weak: rgba(26, 26, 46, .03); --glass-hover: rgba(26, 26, 46, .09); --border-strong: #CBD3E1; --card: rgba(255, 255, 255, .78); --card-hover: rgba(255, 255, 255, .95); --card-hover-border: #CBD3E1; --card-soft: rgba(255, 255, 255, .7); --panel: rgba(255, 255, 255, .85); --panel-solid: rgba(255, 255, 255, .92); --header-bg: rgba(248, 249, 253, .82); --nav-bg: rgba(248, 249, 253, .97); --footer-bg: rgba(240, 242, 248, .7); --shadow-strong: rgba(26, 26, 46, .22); --shadow: rgba(26, 26, 46, .14); --shadow-soft: rgba(26, 26, 46, .16); --aurora-opacity: .32; } } :root[data-theme="light"] { --bg: #F8F9FD; --surface: #FFFFFF; --surface-2: #F0F2F8; --border: #E2E8F0; --text: #1A1A2E; --dim: #64748B; --hint: #9AA3B2; --link: #5B52E8; --accent-text: #00A383; --grad-text: linear-gradient(100deg, #5B52E8 10%, #00A383 70%); --glass: rgba(26, 26, 46, .05); --glass-weak: rgba(26, 26, 46, .03); --glass-hover: rgba(26, 26, 46, .09); --border-strong: #CBD3E1; --card: rgba(255, 255, 255, .78); --card-hover: rgba(255, 255, 255, .95); --card-hover-border: #CBD3E1; --card-soft: rgba(255, 255, 255, .7); --panel: rgba(255, 255, 255, .85); --panel-solid: rgba(255, 255, 255, .92); --header-bg: rgba(248, 249, 253, .82); --nav-bg: rgba(248, 249, 253, .97); --footer-bg: rgba(240, 242, 248, .7); --shadow-strong: rgba(26, 26, 46, .22); --shadow: rgba(26, 26, 46, .14); --shadow-soft: rgba(26, 26, 46, .16); --aurora-opacity: .32; } * { box-sizing: border-box; } html { scroll-behavior: smooth; /* Sabit başlık, bağlantıyla atlanan bölümün başlığını kesmesin */ scroll-padding-top: calc(var(--header-h) + 16px); } body { margin: 0; background: var(--bg); color: var(--text); color-scheme: dark; font-family: var(--font); font-size: 16px; line-height: 1.65; -webkit-font-smoothing: antialiased; overflow-x: hidden; transition: background .3s var(--ease), color .3s var(--ease); } /* Kaydırma çubuğu,