/* ==========================================================
   KLASİK TEMA (ikinci tema) — yalnızca [data-site-theme="classic"] içinde geçerlidir.
   ========================================================== */

[data-site-theme="classic"] [data-theme-toggle] .icon-sun { display: none; }

/* Header */
.cl-header { position: sticky; top: 0; z-index: 50; background-color: color-mix(in srgb, var(--bg-secondary) 85%, transparent); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid var(--border-color); transition: background-color var(--transition-smooth), border-color var(--transition-smooth); }
.cl-header-container { display: flex; justify-content: space-between; align-items: center; height: 80px; }
.cl-logo { font-size: 1.5rem; font-weight: 700; letter-spacing: -0.05em; }
.cl-logo-accent { color: var(--accent-color); }
.cl-nav { display: flex; align-items: center; gap: 2rem; }
.cl-nav-link { font-size: 0.95rem; font-weight: 500; color: var(--text-secondary); transition: color var(--transition-fast); }
.cl-nav-link:hover { color: var(--text-primary); }
.cl-theme-toggle { background: none; border: 1px solid var(--border-color); padding: 0.5rem; border-radius: 50%; color: var(--text-primary); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all var(--transition-fast); }
.cl-theme-toggle:hover { background-color: var(--border-color); }
@media (max-width: 768px) { .cl-nav { gap: 1rem; } .cl-nav-link { display: none; } }

/* Hero */
.cl-hero { padding: 8rem 0 6rem; min-height: 80vh; display: flex; align-items: center; }
.cl-hero-container { display: flex; flex-direction: column; align-items: flex-start; max-width: 900px; }
.cl-hero-title { font-size: clamp(2.5rem, 5vw, 4rem); font-weight: 700; line-height: 1.1; margin-bottom: 1.5rem; color: var(--text-primary); letter-spacing: -0.03em; }
.cl-highlight { color: var(--accent-color); }
.cl-hero-subtitle { font-size: clamp(1.1rem, 2vw, 1.25rem); color: var(--text-secondary); margin-bottom: 3rem; max-width: 650px; line-height: 1.6; }
.cl-hero-actions { display: flex; gap: 1rem; flex-wrap: wrap; }
.cl-btn { display: inline-flex; align-items: center; justify-content: center; padding: 0.875rem 1.75rem; font-size: 1rem; font-weight: 500; border-radius: var(--radius-md); transition: all var(--transition-fast); cursor: pointer; }
.cl-btn-primary { background-color: var(--text-primary); color: var(--bg-color); border: 1px solid var(--text-primary); }
.cl-btn-primary:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); opacity: 0.9; }
.cl-btn-secondary { background-color: transparent; color: var(--text-primary); border: 1px solid var(--border-color); }
.cl-btn-secondary:hover { border-color: var(--text-primary); background-color: var(--bg-secondary); }

/* Hakkımda */
.cl-about { padding: 6rem 0; background-color: var(--bg-secondary); }
.cl-section-title { font-size: 2.5rem; margin-bottom: 3rem; color: var(--text-primary); }
.cl-about-content { display: flex; flex-direction: column; gap: 4rem; }
.cl-about-text-container { max-width: 800px; }
.cl-about-text { font-size: 1.125rem; line-height: 1.8; color: var(--text-secondary); white-space: pre-line; overflow-wrap: anywhere; }
.cl-stat { text-align: center; padding: 2.5rem; display: flex; flex-direction: column; justify-content: center; }
.cl-stat h3 { font-size: 3rem; color: var(--text-primary); margin-bottom: 0.5rem; }
.cl-stat p { color: var(--text-muted); font-weight: 500; }

/* Proje kartı */
.cl-project-card { padding: 0; overflow: hidden; }
.cl-project-link { display: flex; flex-direction: column; height: 100%; color: inherit; }
.cl-project-image { width: 100%; height: 200px; background-color: var(--border-color); overflow: hidden; display: flex; align-items: center; justify-content: center; }
.cl-project-image img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform var(--transition-smooth); }
.cl-project-card:hover .cl-project-image img { transform: scale(1.05); }
.cl-image-text { color: var(--text-muted); font-size: 0.875rem; }
.cl-project-info { padding: 1.5rem; display: flex; flex-direction: column; flex-grow: 1; }
.cl-project-title { font-size: 1.25rem; margin-bottom: 0.75rem; color: var(--text-primary); }
.cl-project-desc { font-size: 0.95rem; color: var(--text-secondary); margin-bottom: 1.5rem; flex-grow: 1; }
.cl-project-link-text { font-weight: 500; color: var(--accent-color); display: inline-block; font-size: 0.95rem; transition: opacity var(--transition-fast); margin-top: auto; }
.cl-project-card:hover .cl-project-link-text { opacity: 0.8; }

/* Blog */
.cl-blog { padding: 6rem 0; }
.cl-blog-title { font-size: 2.5rem; margin-bottom: 3rem; color: var(--text-primary); font-weight: 700; }
.cl-post-card { display: flex; flex-direction: column; padding: 0; overflow: hidden; }
.cl-post-image { width: 100%; height: 200px; overflow: hidden; flex-shrink: 0; }
.cl-post-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cl-post-body { padding: 1.5rem; display: flex; flex-direction: column; flex: 1; }
.cl-post-body h3 { font-size: 1.25rem; margin-bottom: 0.75rem; color: var(--text-primary); font-weight: 600; }
.cl-post-excerpt { color: var(--text-secondary); margin-bottom: 1.5rem; flex-grow: 1; line-height: 1.6; }
.cl-post-foot { display: flex; justify-content: space-between; align-items: center; padding-top: 1rem; border-top: 1px solid var(--border-color); margin-top: auto; }
.cl-post-foot span { font-size: 0.85rem; color: var(--text-muted); }
.cl-post-foot a { font-size: 0.9rem; font-weight: 500; color: var(--accent-color); }

/* İletişim */
.cl-contact { padding: 8rem 0; position: relative; overflow: hidden; }
.cl-contact-blob { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 60vw; height: 60vw; background: radial-gradient(circle, rgba(53, 169, 118, 0.05) 0%, rgba(0, 0, 0, 0) 70%); border-radius: 50%; z-index: 0; pointer-events: none; }
.cl-contact-inner { position: relative; z-index: 1; }
.cl-contact-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 4rem; align-items: start; }
.cl-contact-info { display: flex; flex-direction: column; gap: 2rem; }
.cl-contact-info h2 { font-size: clamp(2.5rem, 5vw, 4rem); font-weight: 800; line-height: 1.1; letter-spacing: -0.03em; color: var(--text-primary); margin-bottom: 1rem; }
.cl-contact-info p { color: var(--text-secondary); font-size: 1.2rem; line-height: 1.6; max-width: 400px; }
.cl-contact-mail { display: flex; flex-direction: column; gap: 1rem; margin-top: 1rem; }
.cl-contact-label { color: var(--text-muted); font-size: 0.9rem; text-transform: uppercase; letter-spacing: 0.1em; font-weight: 600; }
.cl-contact-mail a { font-size: 1.25rem; color: var(--text-primary); font-weight: 500; display: inline-block; width: fit-content; border-bottom: 2px solid var(--accent-color); padding-bottom: 4px; transition: opacity 0.2s ease; }
.cl-contact-mail a:hover { opacity: 0.7; }
.cl-contact-card { padding: 2.5rem; background: color-mix(in srgb, var(--bg-secondary) 50%, transparent); backdrop-filter: blur(20px); border: 1px solid color-mix(in srgb, var(--border-color) 50%, transparent); box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); }
.cl-form { display: flex; flex-direction: column; gap: 2rem; }
.cl-input { width: 100%; background: color-mix(in srgb, var(--text-primary) 3%, transparent); border: none; border-bottom: 2px solid var(--border-color); padding: 1rem 1.25rem; font-size: 1.05rem; font-family: inherit; color: var(--text-primary); outline: none; border-radius: 8px 8px 0 0; transition: border-color 0.3s ease, background-color 0.3s ease; }
.cl-input:focus { border-bottom-color: var(--accent-color); background-color: color-mix(in srgb, var(--text-primary) 5%, transparent); }
.cl-textarea { resize: none; }
.cl-submit { background: var(--accent-color); color: #fff; border: none; padding: 1rem 2.5rem; font-size: 1.1rem; font-weight: 600; font-family: inherit; border-radius: 100px; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 0.75rem; transition: all 0.2s ease; align-self: flex-start; margin-top: 1rem; box-shadow: 0 4px 14px 0 rgba(53, 169, 118, 0.39); }
.cl-submit:hover:not(:disabled) { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(53, 169, 118, 0.5); }

/* Footer */
.cl-footer { margin-top: auto; background-color: var(--bg-secondary); border-top: 1px solid var(--border-color); padding: 4rem 0 2rem; transition: background-color var(--transition-smooth), border-color var(--transition-smooth); }
.cl-footer-container { display: flex; flex-direction: column; gap: 3rem; }
.cl-footer-content { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 2rem; }
.cl-footer-brand h3 { font-size: 1.25rem; margin-bottom: 1rem; color: var(--text-primary); }
.cl-footer-brand p { max-width: 300px; font-size: 0.95rem; }
.cl-footer-links { display: flex; gap: 1.5rem; }
.cl-footer-links a { color: var(--text-secondary); display: flex; align-items: center; justify-content: center; transition: color var(--transition-fast), transform var(--transition-fast); }
.cl-footer-links a svg { width: 24px; height: 24px; }
.cl-footer-links a:hover { color: var(--accent-color); transform: translateY(-2px); }
.cl-footer-bottom { border-top: 1px solid var(--border-color); padding-top: 2rem; text-align: center; font-size: 0.85rem; color: var(--text-muted); }

.cl-age { margin: 0 0 12px; font-size: 1rem; font-weight: 600; color: var(--accent-color, #35a976); }