/* ==========================================================================
   ASDEN — Görsel tasarım (sitenin tek tasarımı)
   <html data-tasarim="gorsel"> nuxt.config'teki erken betikle sabit atanır; kurallar buna bağlıdır.
   Klasik ve Teknoloji tasarımları _arsiv/tasarimlar/ altında saklıdır.
   ========================================================================== */

/* ==========================================================================
   GÖRSEL — canlı, yuvarlak, geniş boşluklu; mavi→camgöbeği geçişler
   ========================================================================== */
html[data-tasarim="gorsel"] {
    --bg: #F3F8FF; --bg-secondary: #E8F1FF; --surface: #FFFFFF;
    --text: #0B1B3A; --text-secondary: #566B91; --text-tertiary: #7F92B4;
    --brand: #0B2A6F; --brand-light: #1546B8; --brand-deep: #0B2A6F;
    --accent: #1D6FEB; --accent-hover: #0EA5E9; --accent-light: #E3EFFF;
    --border: #D3E3FB; --border-light: #E6EFFD;
    --radius-sm: 14px; --radius: 20px; --radius-lg: 28px; --radius-xl: 36px;
    --shadow-xs: 0 2px 10px rgba(29, 111, 235, .08);
    --shadow-sm: 0 8px 28px rgba(29, 111, 235, .12);
    --g-gradient: linear-gradient(135deg, #1D6FEB, #0EA5E9);
}
html[data-tasarim="gorsel"] body {
    background:
        radial-gradient(900px 520px at 6% -4%, rgba(29, 111, 235, .16), transparent 60%),
        radial-gradient(800px 520px at 100% 8%, rgba(14, 165, 233, .16), transparent 60%),
        var(--bg);
    background-attachment: fixed;
}
html[data-tasarim="gorsel"] #mainNav { background: rgba(255, 255, 255, .78); border-bottom: 1px solid rgba(29, 111, 235, .12); }
html[data-tasarim="gorsel"] #mainNav .nav-link { font-weight: 600; }
html[data-tasarim="gorsel"] #mainNav .nav-link.active { color: var(--accent); }
html[data-tasarim="gorsel"] .nav-portal-btn {
    border-radius: 999px !important; background: var(--g-gradient) !important; box-shadow: 0 6px 18px rgba(29, 111, 235, .35) !important; padding: .55rem 1.15rem !important;
}

/* Düğmeler */
html[data-tasarim="gorsel"] .btn-hero-primary,
html[data-tasarim="gorsel"] .btn-solution,
html[data-tasarim="gorsel"] .slider-cta,
html[data-tasarim="gorsel"] .btn-primary-custom {
    border-radius: 999px; background: var(--g-gradient); border: none; color: #fff;
    padding: .9rem 2.1rem; box-shadow: 0 12px 28px rgba(29, 111, 235, .38);
}
html[data-tasarim="gorsel"] .btn-hero-primary:hover,
html[data-tasarim="gorsel"] .btn-solution:hover,
html[data-tasarim="gorsel"] .slider-cta:hover,
html[data-tasarim="gorsel"] .btn-primary-custom:hover {
    background: var(--g-gradient); transform: translateY(-3px) scale(1.03); box-shadow: 0 18px 40px rgba(29, 111, 235, .5);
}
html[data-tasarim="gorsel"] .btn-hero-outline { border-radius: 999px; border-color: rgba(255, 255, 255, .7); padding: .9rem 2.1rem; }

/* Başlık bantları */
html[data-tasarim="gorsel"] .page-header { background: linear-gradient(120deg, #0B2A6F, #1D6FEB 58%, #0EA5E9); padding: 4.5rem 0 4rem; }
html[data-tasarim="gorsel"] .page-header::before {
    background-image:
        radial-gradient(circle at 12% 115%, rgba(255, 255, 255, .22) 0 130px, transparent 131px),
        radial-gradient(circle at 92% -25%, rgba(255, 255, 255, .20) 0 170px, transparent 171px),
        radial-gradient(circle at 60% 130%, rgba(255, 255, 255, .12) 0 90px, transparent 91px);
    background-size: auto; animation: g-yuzen 14s ease-in-out infinite alternate;
}
html[data-tasarim="gorsel"] .page-header h1 { font-size: clamp(2rem, 4.6vw, 3.1rem); }
@keyframes g-yuzen { from { background-position: 0 0, 0 0, 0 0; } to { background-position: 30px -16px, -26px 18px, 14px -22px; } }

html[data-tasarim="gorsel"] .section-py { padding: 7rem 0; }
html[data-tasarim="gorsel"] .section-header h2 {
    font-size: clamp(1.9rem, 3.6vw, 2.8rem); font-weight: 800;
    background: linear-gradient(90deg, #0B2A6F, #1D6FEB 60%, #0EA5E9); -webkit-background-clip: text; background-clip: text; color: transparent;
}
html[data-tasarim="gorsel"] .section-header h2::after {
    content: ''; display: block; width: 68px; height: 5px; border-radius: 5px; margin: 1rem auto 0; background: var(--g-gradient);
}
html[data-tasarim="gorsel"] .bg-light { background: linear-gradient(180deg, #EAF2FF, #F6FAFF) !important; }
html[data-tasarim="gorsel"] .intro-section { background: transparent; }

/* Kartlar */
html[data-tasarim="gorsel"] .content-card,
html[data-tasarim="gorsel"] .blog-card,
html[data-tasarim="gorsel"] .stat-card,
html[data-tasarim="gorsel"] .serve-block,
html[data-tasarim="gorsel"] .service-card {
    border-radius: var(--radius); border: 1px solid var(--border); background: #fff; box-shadow: var(--shadow-sm);
    transition: transform .35s var(--ease-spring), box-shadow .35s var(--ease), border-color .25s;
}
html[data-tasarim="gorsel"] .content-card:hover,
html[data-tasarim="gorsel"] .blog-card:hover,
html[data-tasarim="gorsel"] .stat-card:hover,
html[data-tasarim="gorsel"] .serve-block:hover,
html[data-tasarim="gorsel"] .service-card:hover {
    transform: translateY(-6px); border-color: var(--accent); box-shadow: 0 22px 46px rgba(29, 111, 235, .24);
}
html[data-tasarim="gorsel"] .work-step {
    background: #fff; border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm);
    padding: 2.2rem 1.25rem; height: 100%; transition: transform .35s var(--ease-spring), box-shadow .35s var(--ease);
}
html[data-tasarim="gorsel"] .work-step:hover { transform: translateY(-6px); box-shadow: 0 22px 46px rgba(29, 111, 235, .24); }
html[data-tasarim="gorsel"] .work-step-number {
    width: 68px; height: 68px; border-radius: 50%; background: var(--g-gradient); color: #fff; font-size: 1.6rem;
    box-shadow: 0 12px 26px rgba(29, 111, 235, .42);
}
html[data-tasarim="gorsel"] .work-step:hover .work-step-number { background: var(--g-gradient); transform: scale(1.1) rotate(-6deg); }
html[data-tasarim="gorsel"] .work-step h4 { font-weight: 700; color: var(--brand-deep); }

html[data-tasarim="gorsel"] .service-image-card { height: 320px; border-radius: var(--radius-xl); box-shadow: 0 16px 40px rgba(29, 111, 235, .22); }
html[data-tasarim="gorsel"] .service-card-overlay,
html[data-tasarim="gorsel"] .service-image-card:hover .service-card-overlay {
    background: linear-gradient(180deg, rgba(11, 42, 111, 0) 30%, rgba(11, 42, 111, .88));
}
html[data-tasarim="gorsel"] .service-card-title { font-size: 1.5rem; }
html[data-tasarim="gorsel"] .service-card-title::after { content: ' →'; opacity: .85; }

html[data-tasarim="gorsel"] .designation-badge,
html[data-tasarim="gorsel"] .expertise-tag,
html[data-tasarim="gorsel"] .tag-badge {
    border-radius: 999px; background: #fff; border: 1px solid var(--border); box-shadow: 0 4px 14px rgba(29, 111, 235, .1); color: var(--accent);
}
html[data-tasarim="gorsel"] .intro-image,
html[data-tasarim="gorsel"] .about-image { border-radius: var(--radius-xl); box-shadow: 0 26px 60px rgba(29, 111, 235, .28); }

html[data-tasarim="gorsel"] .promo-banner-overlay { background: linear-gradient(120deg, rgba(11, 42, 111, .92), rgba(29, 111, 235, .7)); }
html[data-tasarim="gorsel"] .cta-section { background: linear-gradient(120deg, #0B2A6F, #1D6FEB 60%, #0EA5E9); color: #fff; }
html[data-tasarim="gorsel"] .cta-section::before { background-image: radial-gradient(rgba(255, 255, 255, .12) 1px, transparent 1px); }
html[data-tasarim="gorsel"] .cta-section h2,
html[data-tasarim="gorsel"] .cta-section p { color: #fff; }
html[data-tasarim="gorsel"] .cta-section .btn-hero-primary { background: #fff; color: var(--accent); box-shadow: 0 12px 28px rgba(0, 0, 0, .25); }
html[data-tasarim="gorsel"] .site-footer { background: linear-gradient(160deg, #0B2A6F, #0F3FA8); }

/* Görsel: ana sayfa slider görseli mavi tonlama */
html[data-tasarim="gorsel"] .slider-bg::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(11, 42, 111, .30), rgba(29, 111, 235, .55)); }
html[data-tasarim="gorsel"] .navbar-toggler i { color: #1D6FEB; }
@media (max-width: 991.98px) { .gvf__izgara { grid-template-columns: 1fr 1fr; } }
@media (max-width: 575.98px) { .gvf__izgara { grid-template-columns: 1fr; } }

/* ==========================================================================
   YAPISAL FARKLAR — üst çubuk, iç sayfa başlığı, altbilgi
   ========================================================================== */

/* GÖRSEL: yüzen hap biçimli üst çubuk */
@media (min-width: 992px) {
    html[data-tasarim="gorsel"] #mainNav {
        top: 14px; left: 50%; right: auto; transform: translateX(-50%);
        width: min(1240px, calc(100% - 28px)); height: 68px; border-radius: 999px;
        border: 1px solid rgba(29, 111, 235, .18); box-shadow: 0 16px 44px rgba(29, 111, 235, .2);
    }
    html[data-tasarim="gorsel"] #mainNav .container { max-width: none; padding: 0 1.2rem 0 1.6rem; }
    html[data-tasarim="gorsel"] .navbar-logo { height: 42px; }
}
/* GÖRSEL: iç sayfa başlığı ortalı ve alt kenarı kavisli */
html[data-tasarim="gorsel"] .page-header { text-align: center; border-radius: 0 0 56px 56px; padding-bottom: 4.5rem; }
html[data-tasarim="gorsel"] .page-header .custom-breadcrumb { justify-content: center; display: flex; }
html[data-tasarim="gorsel"] .page-header p { margin-left: auto; margin-right: auto; max-width: 46rem; }
html[data-tasarim="gorsel"] .page-header .hero-buttons { justify-content: center; display: flex; gap: .8rem; flex-wrap: wrap; }

/* GÖRSEL altbilgi */
.gvf { background: linear-gradient(160deg, #0B2A6F, #0F3FA8); color: rgba(255, 255, 255, .78); border-radius: 0; margin-top: -1px; padding: 0 0 2rem; position: relative; overflow: hidden; }
/* klasik altbilgideki zemin resmi (footer.png) */
.gvf::before { content: ''; position: absolute; inset: 0; background-image: url('../images/footer.png'); background-size: cover; background-position: center; background-repeat: no-repeat; opacity: .14; pointer-events: none; }
.gvf .container { position: relative; z-index: 1; }
.gvf a { color: rgba(255, 255, 255, .78); text-decoration: none; }
.gvf a:hover { color: #fff; }
.gvf__cagri { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem; padding: 3.2rem 0; border-bottom: 1px solid rgba(255, 255, 255, .15); }
.gvf__cagri h3 { color: #fff; font-weight: 800; font-size: clamp(1.5rem, 2.6vw, 2.1rem); margin: 0; }
.gvf__cagri p { margin: .4rem 0 0; }
.gvf__btn { display: inline-flex; gap: .55rem; align-items: center; background: #fff; color: #0B2A6F !important; font-weight: 800; border-radius: 999px; padding: .95rem 2rem; box-shadow: 0 14px 34px rgba(0, 0, 0, .3); transition: transform .25s; }
.gvf__btn:hover { transform: translateY(-3px) scale(1.03); }
.gvf__izgara { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.1fr; gap: 2.5rem; padding: 3rem 0 2rem; }
.gvf__izgara > div > a, .gvf__izgara > div > span { display: block; padding: .28rem 0; font-size: .93rem; }
.gvf__izgara h5 { color: #fff; font-size: .95rem; font-weight: 800; margin-bottom: .8rem; }
/* Logo hiçbir tasarımda renk/filtre değiştirmez; koyu zeminde açık plaka üzerinde durur */
.gvf__logo { height: 44px; background: #fff; padding: .5rem .9rem; border-radius: 14px; box-sizing: content-box; margin-bottom: 1rem; }
.gvf__alt { border-top: 1px solid rgba(255, 255, 255, .15); padding-top: 1.4rem; font-size: .85rem; text-align: center; margin: 0; }
.gvf i { color: #7CD7FF; width: 1.3rem; }


/* Üst menü WhatsApp düğmesi: marka yeşili, İletişim'in yanında */
#mainNav .nav-whatsapp { color: #25D366 !important; font-size: 1.35rem; display: inline-flex; align-items: center; padding: .25rem .5rem !important; }
#mainNav .nav-whatsapp::after { display: none !important; }
#mainNav .nav-whatsapp:hover { color: #128C7E !important; transform: scale(1.12); }
@media (min-width: 992px) { #mainNav .nav-whatsapp { margin-left: -.35rem; } }
@media (max-width: 991.98px) { #mainNav .nav-whatsapp { font-size: 1rem; font-weight: 600; } }

/* Cihaz teması dikkate alınmaz: sayfa yalnız açık tema ilan eder (otomatik koyu mod rengi tersine çeviremez). */
:root { color-scheme: only light; }
html, body { color-scheme: only light; }
