/* ====================================================================
   NotiForge Landing Page — Stylesheet
   Tema: uygulamayla birebir (notiforge-app/css/theme.css)
   Light : sıcak krem/taş · Dark : yeşile çalan koyu · Vurgu: orman yeşili
   Renkler "R G B" üçlüsü olarak tutulur → Tailwind'de rgb(var(--c-x) / α)
   ==================================================================== */
:root,
:root[data-theme="light"] {
    color-scheme: light;

    --c-bg:            229 224 211;  /* #e5e0d3 */
    --c-surface:       238 234 222;  /* #eeeade */
    --c-surface-2:     224 219 205;  /* #e0dbcd */
    --c-surface-3:     214 208 192;  /* #d6d0c0 */
    --c-border:        213 207 191;  /* #d5cfbf */
    --c-border-strong: 196 188 169;  /* #c4bca9 */

    --c-text:          35 43 50;     /* #232b32 */
    --c-text-muted:    90 100 108;   /* #5a646c */
    --c-text-faint:    120 126 131;

    --c-accent:        45 90 67;     /* #2d5a43 */
    --c-accent-hover:  28 61 43;     /* #1c3d2b */
    --c-accent-text:   45 90 67;
    --c-accent-ink:    30 69 46;     /* #1e452e */
    --c-accent-soft:   212 220 201;  /* #d4dcc9 */
    --c-on-accent:     255 255 255;

    --c-warning:       168 110 20;   --c-warning-soft: 241 227 196;
    --c-danger:        184 71 59;    --c-danger-soft:  241 220 214;
    --c-info:          61 107 152;
    --c-ai:            106 90 156;   --c-ai-soft:      227 222 240;

    --shadow-color: 52 44 24;
    --shadow-sm: 0 1px 2px rgb(var(--shadow-color) / .08), 0 1px 3px rgb(var(--shadow-color) / .06);
    --shadow-md: 0 4px 14px rgb(var(--shadow-color) / .10);
    --shadow-lg: 0 14px 40px rgb(var(--shadow-color) / .16);
}

:root[data-theme="dark"] {
    color-scheme: dark;

    --c-bg:            17 21 20;     /* #111514 */
    --c-surface:       26 31 30;     /* #1a1f1e */
    --c-surface-2:     34 41 40;     /* #222928 */
    --c-surface-3:     43 51 49;     /* #2b3331 */
    --c-border:        42 50 48;
    --c-border-strong: 58 69 67;

    --c-text:          231 236 233;  /* #e7ece9 */
    --c-text-muted:    160 172 167;  /* #a0aca7 */
    --c-text-faint:    120 132 128;

    --c-accent:        47 125 88;    /* #2f7d58 */
    --c-accent-hover:  56 144 106;
    --c-accent-text:   95 211 154;   /* #5fd39a */
    --c-accent-ink:    191 233 210;  /* #bfe9d2 */
    --c-accent-soft:   29 51 40;     /* #1d3328 */
    --c-on-accent:     255 255 255;

    --c-warning:       224 166 74;   --c-warning-soft: 58 47 28;
    --c-danger:        236 122 108;  --c-danger-soft:  58 34 32;
    --c-info:          130 169 212;
    --c-ai:            168 151 221;  --c-ai-soft:      42 38 56;

    --shadow-color: 0 0 0;
    --shadow-sm: 0 1px 2px rgb(0 0 0 / .35);
    --shadow-md: 0 4px 16px rgb(0 0 0 / .40);
    --shadow-lg: 0 16px 44px rgb(0 0 0 / .55);
}

html.theme-ready body,
html.theme-ready .glass-card,
html.theme-ready header {
    transition: background-color .25s ease, color .25s ease, border-color .25s ease, box-shadow .25s ease;
}

body {
    background-color: rgb(var(--c-bg));
    color: rgb(var(--c-text));
    font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Başlıklar: uygulamadaki gibi Merriweather */
main h2,
.brand-name {
    font-family: 'Merriweather', Georgia, serif;
    font-weight: 700;
    letter-spacing: -0.02em;
}
main h2 { color: rgb(var(--c-accent-ink)); line-height: 1.2; }

/* Editoryal vurgu (italik serif) */
.editorial-heading {
    font-family: 'Merriweather', Georgia, serif;
}

/* Kartlar — uygulamadaki .card ile aynı dil */
.glass-card {
    background: rgb(var(--c-surface));
    border: 1px solid rgb(var(--c-border));
    box-shadow: var(--shadow-sm);
    transition: transform .18s ease, box-shadow .2s ease, border-color .2s ease;
}

@media (hover: hover) {
    .glass-card:hover {
        border-color: rgb(var(--c-border-strong));
        box-shadow: var(--shadow-md);
    }
}

/* Birincil buton (eski adı korunuyor) */
.emerald-glow-btn {
    box-shadow: var(--shadow-sm);
    transition: background-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.emerald-glow-btn:hover {
    box-shadow: var(--shadow-md);
    transform: translateY(-1px);
}

/* 3D Flip Card Simulator */
.perspective-1000 { perspective: 1000px; }
.transform-style-preserve-3d { transform-style: preserve-3d; }
.backface-hidden { backface-visibility: hidden; -webkit-backface-visibility: hidden; }
.rotate-y-180 { transform: rotateY(180deg); }

@keyframes float-subtle {
    0%, 100% { transform: translateY(0px) rotate(0deg); }
    50% { transform: translateY(-5px) rotate(0.5deg); }
}
.animate-float { animation: float-subtle 6s ease-in-out infinite; }

/* Sesli not dalga formu */
@keyframes wave-bar {
    0%, 100% { transform: scaleY(.35); }
    50% { transform: scaleY(1); }
}
.wave-bar {
    display: inline-block;
    width: 3px;
    border-radius: 2px;
    background: rgb(var(--c-accent-text));
    transform-origin: center;
    animation: wave-bar 1.1s ease-in-out infinite;
}

/* İnce, temaya uyumlu kaydırma çubuğu */
* { scrollbar-width: thin; scrollbar-color: rgb(var(--c-border-strong)) transparent; }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgb(var(--c-border-strong)); border-radius: 8px; }

:focus-visible {
    outline: 2px solid rgb(var(--c-accent-text));
    outline-offset: 2px;
    border-radius: 8px;
}

:root[data-theme="dark"] ::selection { background: rgb(var(--c-accent-text) / .35); }
:root[data-theme="light"] ::selection { background: rgb(var(--c-accent-text) / .22); }

/* ====================================================================
   Arka plan — çok hafif yeşil ışık + kâğıt dokusu ızgarası
   ==================================================================== */
.ambient-backdrop {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
}

.ambient-orb {
    position: absolute;
    border-radius: 9999px;
    filter: blur(110px);
    pointer-events: none;
}

.ambient-orb-top {
    top: -160px;
    left: 50%;
    transform: translateX(-50%);
    width: 1000px;
    height: 560px;
    background: radial-gradient(ellipse at center, rgb(var(--c-accent-text) / .14) 0%, transparent 70%);
}

.ambient-orb-left {
    top: 30%;
    left: -160px;
    width: 560px;
    height: 560px;
    background: radial-gradient(circle at center, rgb(var(--c-accent-text) / .08) 0%, transparent 70%);
}

.ambient-orb-right {
    top: 60%;
    right: -160px;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle at center, rgb(var(--c-warning) / .07) 0%, transparent 70%);
}

.ambient-orb-bottom { display: none; }

.ambient-grid {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(to right, rgb(var(--c-text) / .045) 1px, transparent 1px),
        linear-gradient(to bottom, rgb(var(--c-text) / .045) 1px, transparent 1px);
    background-size: 4rem 4rem;
    -webkit-mask-image: radial-gradient(ellipse 80% 60% at 50% 10%, #000 40%, transparent 100%);
    mask-image: radial-gradient(ellipse 80% 60% at 50% 10%, #000 40%, transparent 100%);
}

/* Hero vurgu yazısı (eski adı korunuyor) */
.gradient-text-emerald {
    color: rgb(var(--c-accent-text));
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}