/* ================================================
   CSS CUSTOM PROPERTIES
================================================ */
:root {
    --blue: #189cd9;
    --blue-dark: #0e82b8;
    --gray: #b2b2b2;
    --black: #000000;
    --white: #ffffff;
    --text-dark: #292929;
    --bg-dark: #0a0a0a;
    --bg-darker: #050505;
    --bg-card: #111111;
    --border: rgba(255, 255, 255, 0.07);
    --font-main: 'Google Sans Flex', 'Google Sans', system-ui, sans-serif;
    --font-accent: 'Caveat', cursive;
    --ease-smooth: cubic-bezier(0.25, 0.46, 0.45, 0.94);
    --nav-h: 80px;
}

/* ================================================
   BASE RESET
================================================ */
*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-main);
    background: var(--bg-dark);
    color: var(--white);
    overflow-x: hidden;
    cursor: none;
}

/* ================================================
   CUSTOM CURSOR
================================================ */
#cursor {
    width: 10px;
    height: 10px;
    background: var(--blue);
    border-radius: 50%;
    position: fixed;
    top: 0;
    left: 0;
    pointer-events: none;
    z-index: 9999;
    transform: translate(-50%, -50%);
    transition: width .25s, height .25s;
}

#cursor-ring {
    width: 42px;
    height: 42px;
    border: 1.5px solid rgba(24, 156, 217, .45);
    border-radius: 50%;
    position: fixed;
    top: 0;
    left: 0;
    pointer-events: none;
    z-index: 9998;
    transform: translate(-50%, -50%);
    transition: width .35s, height .35s, border-color .3s, background .3s;
}

#cursor.hover {
    width: 5px;
    height: 5px;
}

#cursor-ring.hover {
    width: 60px;
    height: 60px;
    border-color: var(--blue);
    background: rgba(24, 156, 217, .06);
}

/* ================================================
   NAVBAR
================================================ */
#navbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: var(--nav-h);
    z-index: 1000;
    padding: 0 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: background .5s ease, border-color .5s ease;
}

#navbar.scrolled {
    background: rgba(5, 5, 5, .92);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border-bottom: 1px solid var(--border);
}

.nav-logo {
    display: flex;
    align-items: center;
    height: 100%;
    flex-shrink: 0;
}

.nav-logo img {
    height: 34px;
    width: auto;
    display: block;
}

.nav-links {
    display: flex;
    align-items: center;
    height: 100%;
    gap: 28px;
    list-style: none;
    margin-bottom: 0rem;
}

.nav-links>li>a {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    line-height: 1;
    font-size: 13.5px;
    font-weight: 500;
    color: rgba(255, 255, 255, .75);
    text-decoration: none;
    letter-spacing: .02em;
    position: relative;
    transition: color .3s;
}

.nav-links>li>a::after {
    content: '';
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 0;
    height: 1.5px;
    background: var(--blue);
    transition: width .3s ease;
}

.nav-links>li>a:hover {
    color: var(--white);
}

.nav-links>li>a:hover::after {
    width: 100%;
}

.nav-right {
    display: flex;
    align-items: center;
    height: 100%;
    gap: 20px;
    flex-shrink: 0;
}

.lang-sw {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
}

.lang-sw a {
    color: rgba(255, 255, 255, .4);
    text-decoration: none;
    transition: color .3s;
}

.lang-sw a.active,
.lang-sw a:hover {
    color: var(--white);
}

.lang-sw span {
    color: rgba(255, 255, 255, .2);
}

.btn-nav-cta {
    background: var(--blue);
    color: var(--white);
    border: none;
    border-radius: 100px;
    padding: 9px 22px;
    font-family: var(--font-main);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: background .3s, transform .3s;
}

.btn-nav-cta:hover {
    background: var(--blue-dark);
    color: var(--white);
    transform: translateY(-1px);
}

/* Hamburger (mobile) */
.nav-hamburger {
    display: none;
    flex-direction: column;
    gap: 5px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px;
}

.nav-hamburger span {
    display: block;
    width: 22px;
    height: 1.5px;
    background: var(--white);
    transition: all .3s;
}

/* ================================================
   HERO
================================================ */
#hero {
    position: relative;
    width: 100%;
    height: 100vh;
    min-height: 640px;
    overflow: hidden;
    display: flex;
    align-items: center;
}

.hero-video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
    will-change: transform;
}

.hero-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(135deg,
            rgba(0, 0, 0, .82) 0%,
            rgba(0, 0, 0, .55) 55%,
            rgba(0, 0, 0, .28) 100%);
}

.hero-content {
    position: relative;
    z-index: 2;
    width: 100%;
    padding: 0 80px;
}

.hero-title {
    font-size: clamp(44px, 6.5vw, 90px);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.025em;
    color: var(--white);
    margin-bottom: 24px;
}

.hero-title .hl {
    color: var(--blue);
    font-family: var(--font-accent);
    font-weight: 700;
    font-style: italic;
}

.hero-sub {
    font-size: clamp(15px, 1.4vw, 19px);
    font-weight: 400;
    color: rgba(255, 255, 255, .65);
    line-height: 1.65;
    max-width: 540px;
    margin-bottom: 0;
    opacity: 0;
    transform: translateY(20px);
}

/* Butonlar + stats aynı satırda */
.hero-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    margin-top: 42px;
}

.hero-actions {
    display: flex;
    align-items: center;
    gap: 14px;
    opacity: 0;
    transform: translateY(20px);
}

/* Stats */
.hero-stats {
    display: flex;
    gap: 44px;
    opacity: 0;
    transform: translateY(16px);
}

.h-stat {
    text-align: right;
}

.h-stat-n {
    display: block;
    font-size: 34px;
    font-weight: 800;
    color: var(--white);
    line-height: 1;
}

.h-stat-n em {
    color: var(--blue);
    font-style: normal;
}

.h-stat-l {
    display: block;
    font-size: 11px;
    color: rgba(255, 255, 255, .42);
    letter-spacing: .06em;
    margin-top: 5px;
}

/* Scroll indicator */
.hero-scroll {
    position: absolute;
    bottom: 40px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    opacity: 0;
}

.hero-scroll span {
    font-size: 10px;
    color: rgba(255, 255, 255, .35);
    letter-spacing: .18em;
    text-transform: uppercase;
}

.scroll-bar {
    width: 1px;
    height: 44px;
    background: linear-gradient(to bottom, rgba(255, 255, 255, .35), transparent);
    animation: scrollPulse 2.2s ease-in-out infinite;
}

@keyframes scrollPulse {

    0%,
    100% {
        opacity: 1;
        transform: scaleY(1);
        transform-origin: top;
    }

    50% {
        opacity: .3;
        transform: scaleY(.5);
        transform-origin: top;
    }
}

/* ================================================
   SHARED BUTTONS
================================================ */
.btn-primary {
    background: var(--blue);
    color: var(--white);
    border: none;
    border-radius: 100px;
    padding: 14px 32px;
    font-family: var(--font-main);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: background .3s, transform .3s;
}

.btn-primary:hover {
    background: var(--blue-dark);
    color: var(--white);
    transform: translateY(-2px);
}

.btn-ghost {
    background: transparent;
    color: var(--white);
    border: 1.5px solid rgba(255, 255, 255, .28);
    border-radius: 100px;
    padding: 13px 30px;
    font-family: var(--font-main);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: border-color .3s, transform .3s;
}

.btn-ghost:hover {
    border-color: rgba(255, 255, 255, .6);
    color: var(--white);
    transform: translateY(-2px);
}

/* ================================================
   SECTION TYPOGRAPHY
================================================ */
.sec-tag {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 11px;
    font-weight: 600;
    color: var(--blue);
    letter-spacing: .14em;
    text-transform: uppercase;
    margin-bottom: 14px;
}

.sec-tag::before {
    content: '';
    width: 22px;
    height: 1.5px;
    background: var(--blue);
}

.sec-title {
    font-size: clamp(30px, 3.8vw, 54px);
    font-weight: 800;
    letter-spacing: -.022em;
    line-height: 1.08;
    margin-bottom: 18px;
}

.sec-desc {
    font-size: 16px;
    color: rgba(255, 255, 255, .55);
    line-height: 1.72;
    max-width: 520px;
}

/* ================================================
   ABOUT
================================================ */
#about {
    position: relative;
    overflow: hidden;
    padding: 130px 0;
}

.about-vid-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}

.about-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
}

.about-z {
    position: relative;
    z-index: 2;
}

.about-body p {
    font-size: 16px;
    color: rgba(255, 255, 255, .58);
    line-height: 1.82;
    margin-bottom: 22px;
}

.link-arrow {
    color: var(--blue);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: gap .3s;
}

.link-arrow:hover {
    gap: 12px;
    color: var(--blue);
}

/* Stats 2x2 grid */
.stats-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2px;
}

.stat-box {
    background: rgba(255, 255, 255, .038);
    border: 1px solid rgba(255, 255, 255, .055);
    padding: 38px 34px;
    transition: background .35s, border-color .35s;
}

.stat-box:hover {
    background: rgba(24, 156, 217, .07);
    border-color: rgba(24, 156, 217, .2);
}

.stat-n {
    display: block;
    font-size: 54px;
    font-weight: 800;
    color: var(--blue);
    line-height: 1;
    margin-bottom: 8px;
}

.stat-l {
    font-size: 13px;
    color: rgba(255, 255, 255, .45);
}

/* ================================================
   SERVICES
================================================ */
#services {
    padding: 120px 0;
    background: var(--bg-dark);
}

.services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    background: var(--border);
    border: 1px solid var(--border);
    margin-top: 64px;
}

.svc-card {
    background: var(--bg-dark);
    padding: 48px 40px;
    position: relative;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    display: block;
    transition: background .35s;
}

.svc-card:hover {
    background: #0e0e0e;
}

.svc-card::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    background: var(--blue);
    transition: width .5s ease;
}

.svc-card:hover::after {
    width: 100%;
}

.svc-num {
    position: absolute;
    top: 22px;
    right: 26px;
    font-size: 11px;
    color: rgba(255, 255, 255, .16);
    letter-spacing: .04em;
}

.svc-icon {
    width: 50px;
    height: 50px;
    border: 1.5px solid rgba(24, 156, 217, .28);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--blue);
    font-size: 20px;
    margin-bottom: 26px;
    transition: background .3s, border-color .3s;
}

.svc-card:hover .svc-icon {
    background: rgba(24, 156, 217, .1);
    border-color: var(--blue);
}

.svc-title {
    font-size: 19px;
    font-weight: 700;
    color: var(--white);
    margin-bottom: 12px;
    letter-spacing: -.01em;
}

.svc-desc {
    font-size: 13.5px;
    color: rgba(255, 255, 255, .45);
    line-height: 1.72;
    margin-bottom: 24px;
}

.svc-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.svc-tag {
    font-size: 11px;
    color: rgba(255, 255, 255, .38);
    background: rgba(255, 255, 255, .05);
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 100px;
    padding: 3px 10px;
}

/* CTA card (6th) */
.svc-card-cta {
    background: rgba(24, 156, 217, .05);
    border: 1px solid rgba(24, 156, 217, .14);
    justify-content: center;
    align-items: flex-start;
}

.svc-card-cta:hover {
    background: rgba(24, 156, 217, .1);
}

.svc-card-cta::after {
    display: none;
}

.svc-cta-inner {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.svc-cta-inner h3 {
    font-size: 24px;
    font-weight: 800;
    color: var(--white);
    margin-bottom: 14px;
    line-height: 1.25;
}

.svc-cta-inner p {
    font-size: 14px;
    color: rgba(255, 255, 255, .45);
    line-height: 1.65;
    margin-bottom: 30px;
}

/* ================================================
   REFERENCES
================================================ */
#references {
    padding: 110px 0;
    background: var(--bg-darker);
}

.ref-hd {
    text-align: center;
    margin-bottom: 60px;
}

.ref-hd .sec-tag {
    justify-content: center;
}

.ref-hd .sec-desc {
    margin: 0 auto;
}

.logo-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 1px;
    background: var(--border);
    border: 1px solid var(--border);
}

.logo-cell {
    background: var(--bg-darker);
    padding: 34px 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 3 / 1.8;
    transition: background .3s;
}

.logo-cell:hover {
    background: #0e0e0e;
}

.logo-cell img {
    max-height: 68px;
    max-width: 120px;
    width: auto;
    filter: grayscale(1) brightness(0) opacity(.5);
    transition: filter .35s;
    object-fit: contain;
}

.logo-cell:hover img {
    filter: grayscale(0) opacity(1);
}

/* ================================================
   TESTIMONIALS
================================================ */
#testimonials {
    padding: 110px 0;
    background: var(--bg-dark);
    overflow: hidden;
}

.t-swiper .swiper-wrapper {
    align-items: stretch;
}

.t-swiper .swiper-slide {
    height: auto;
}

.t-card {
    background: rgba(255, 255, 255, .038);
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 16px;
    padding: 40px 36px;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.t-text {
    flex: 1;
}

.t-stars {
    display: flex;
    gap: 4px;
    color: var(--blue);
    font-size: 13px;
    margin-bottom: 18px;
}

.t-text {
    font-size: 15.5px;
    color: rgba(255, 255, 255, .78);
    line-height: 1.72;
    font-style: italic;
    margin-bottom: 28px;
}

.t-author {
    display: flex;
    align-items: center;
    gap: 12px;
}

.t-avatar {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    flex-shrink: 0;
    background: linear-gradient(135deg, #fff2a0, #5bb6db);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 700;
}

.t-name {
    font-size: 14px;
    font-weight: 600;
}

.t-co {
    font-size: 12px;
    color: rgba(255, 255, 255, .38);
    margin-top: 2px;
}

.swiper-nav-btns {
    display: flex;
    gap: 10px;
}

.s-btn {
    width: 44px;
    height: 44px;
    border: 1.5px solid rgba(255, 255, 255, .14);
    border-radius: 50%;
    background: transparent;
    color: var(--white);
    font-size: 17px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: border-color .3s, background .3s;
}

.s-btn:hover {
    border-color: var(--blue);
    background: rgba(24, 156, 217, .1);
}

.swiper-pagination-bullet {
    background: rgba(255, 255, 255, .25);
    opacity: 1;
}

.swiper-pagination-bullet-active {
    background: var(--blue);
    width: 20px;
    border-radius: 100px;
}

/* ================================================
   BLOG
================================================ */
#blog {
    padding: 110px 0;
    background: var(--bg-darker);
}

.blog-card {
    background: var(--bg-card);
    border: 1px solid rgba(255, 255, 255, .06);
    border-radius: 16px;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    display: block;
    transition: transform .4s, border-color .4s;
    height: 100%;
}

.blog-card:hover {
    transform: translateY(-6px);
    border-color: rgba(24, 156, 217, .28);
}

.blog-thumb {
    width: 100%;
    aspect-ratio: 16 / 9;
    background: linear-gradient(135deg, #0f0f1a, #151520);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 52px;
    overflow: hidden;
}

.blog-body {
    padding: 26px 28px 28px;
}

.blog-cat {
    font-size: 10.5px;
    font-weight: 700;
    color: var(--blue);
    letter-spacing: .1em;
    text-transform: uppercase;
    margin-bottom: 10px;
    display: block;
}

.blog-title {
    font-size: 17px;
    font-weight: 700;
    color: var(--white);
    line-height: 1.32;
    margin-bottom: 10px;
    letter-spacing: -.01em;
}

.blog-excerpt {
    font-size: 13.5px;
    color: rgba(255, 255, 255, .44);
    line-height: 1.7;
    margin-bottom: 18px;
}

.blog-meta {
    font-size: 11.5px;
    color: rgba(255, 255, 255, .28);
    display: flex;
    align-items: center;
    gap: 12px;
}

/* ================================================
   CONTACT
================================================ */
#contact {
    padding: 110px 0;
    background: var(--bg-dark);
}

.contact-info {
    padding-right: 56px;
}

.c-item {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 30px;
}

.c-icon {
    width: 44px;
    height: 44px;
    flex-shrink: 0;
    border: 1px solid rgba(24, 156, 217, .28);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--blue);
    font-size: 17px;
}

.c-label {
    font-size: 10.5px;
    color: rgba(255, 255, 255, .35);
    letter-spacing: .08em;
    text-transform: uppercase;
    margin-bottom: 4px;
}

.c-value {
    font-size: 15px;
    color: var(--white);
}

.contact-form-wrap {
    background: rgba(255, 255, 255, .03);
    border: 1px solid rgba(255, 255, 255, .07);
    border-radius: 20px;
    padding: 48px 44px;
}

.contact-form-wrap h3 {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 32px;
}

.f-label {
    display: block;
    font-size: 11px;
    font-weight: 600;
    color: rgba(255, 255, 255, .4);
    letter-spacing: .07em;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.f-input {
    width: 100%;
    background: rgba(255, 255, 255, .05);
    border: 1px solid rgba(255, 255, 255, .09);
    border-radius: 10px;
    padding: 12px 16px;
    color: var(--white);
    font-family: var(--font-main);
    font-size: 14px;
    outline: none;
    transition: border-color .3s, background .3s;
}

.f-input:focus {
    border-color: var(--blue);
    background: rgba(24, 156, 217, .04);
}

.f-input::placeholder {
    color: rgba(255, 255, 255, .22);
}

select.f-input option {
    background: #111;
    color: var(--white);
}

.f-group {
    margin-bottom: 18px;
}

.btn-submit {
    width: 100%;
    justify-content: center;
    padding: 15px;
}

/* ================================================
   FOOTER
================================================ */
#footer {
    background: #000;
    border-top: 1px solid var(--border);
}

.footer-top {
    padding: 80px 0 60px;
}

.footer-top-grid {
    display: grid;
    gap: 40px 32px;
    align-items: start;
}

.footer-menus {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 32px 24px;
}

@media (min-width: 992px) {
    .footer-top-grid {
        grid-template-columns: minmax(0, 0.88fr) minmax(0, 1.72fr) minmax(0, 1fr);
    }

    .footer-brand {
        grid-column: 1;
        grid-row: 1;
    }

    .footer-brand .f-tagline {
        max-width: 200px;
    }

    .footer-menus {
        grid-column: 2;
        grid-row: 1;
        grid-template-columns: minmax(0, 1.55fr) minmax(0, 0.85fr);
        gap: 32px 20px;
    }

    .footer-newsletter {
        grid-column: 3;
        grid-row: 1;
    }

    .f-nav li a {
        white-space: nowrap;
        font-size: 13px;
    }
}

@media (max-width: 991px) {
    .footer-menus {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575px) {
    .footer-menus {
        grid-template-columns: 1fr;
    }
}

.f-brand-logo {
    margin-bottom: 18px;
}

.f-brand-logo img {
    height: 30px;
    filter: brightness(0) invert(1);
}

.f-tagline {
    font-size: 13px;
    color: rgba(255, 255, 255, .36);
    line-height: 1.62;
    max-width: 230px;
    margin-bottom: 26px;
}

.f-social {
    display: flex;
    gap: 8px;
}

.f-soc-a {
    width: 34px;
    height: 34px;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(255, 255, 255, .38);
    font-size: 15px;
    text-decoration: none;
    transition: border-color .3s, color .3s;
}

.f-soc-a:hover {
    border-color: var(--blue);
    color: var(--blue);
}

.f-col-title {
    font-size: 11px;
    font-weight: 700;
    color: rgba(255, 255, 255, .28);
    letter-spacing: .14em;
    text-transform: uppercase;
    margin-bottom: 18px;
}

.f-nav {
    list-style: none;
    padding-left: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.f-nav li a {
    font-size: 13.5px;
    color: rgba(255, 255, 255, .46);
    text-decoration: none;
    transition: color .3s;
}

.f-nav li a:hover {
    color: var(--white);
}

.f-newsletter p {
    font-size: 13px;
    color: rgba(255, 255, 255, .38);
    margin-bottom: 14px;
    line-height: 1.6;
}

.f-nl-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.f-nl-alert {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 14px;
    border-radius: 10px;
    font-size: 13px;
    line-height: 1.55;
    margin-bottom: 14px;
}

.f-nl-alert i {
    flex-shrink: 0;
    margin-top: 1px;
    font-size: 15px;
}

.f-nl-alert ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.f-nl-alert li + li {
    margin-top: 4px;
}

.f-nl-alert--success {
    background: rgba(24, 156, 217, .12);
    border: 1px solid rgba(24, 156, 217, .28);
    color: rgba(255, 255, 255, .88);
}

.f-nl-alert--success i {
    color: var(--blue);
}

.f-nl-alert--error {
    background: rgba(220, 53, 69, .12);
    border: 1px solid rgba(220, 53, 69, .28);
    color: rgba(255, 255, 255, .88);
}

.f-nl-alert--error i {
    color: #ff6b7a;
}

.f-nl-row {
    display: flex;
    gap: 8px;
}

.f-nl-input {
    flex: 1;
    min-width: 0;
    background: rgba(255, 255, 255, .08);
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 8px;
    padding: 11px 14px;
    color: var(--white);
    font-family: var(--font-main);
    font-size: 13px;
    outline: none;
    transition: border-color .3s, background .3s, box-shadow .3s;
}

#footer .f-nl-input {
    background: rgba(255, 255, 255, .08);
    border-color: rgba(255, 255, 255, .18);
    color: #fff;
}

.f-nl-input:focus,
#footer .f-nl-input:focus {
    border-color: var(--blue);
    background: rgba(255, 255, 255, .1);
    box-shadow: 0 0 0 2px rgba(24, 156, 217, .15);
}

.f-nl-input::placeholder,
#footer .f-nl-input::placeholder {
    color: rgba(255, 255, 255, .45);
}

#footer .f-nl-input:-webkit-autofill,
#footer .f-nl-input:-webkit-autofill:hover,
#footer .f-nl-input:-webkit-autofill:focus {
    -webkit-text-fill-color: #fff;
    -webkit-box-shadow: 0 0 0 1000px rgba(255, 255, 255, .1) inset;
    caret-color: #fff;
}

.f-nl-consent {
    margin-top: 10px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.f-nl-consent-chk {
    display: flex;
    align-items: flex-start;
    gap: 7px;
    font-size: 11px;
    line-height: 1.45;
    color: rgba(255, 255, 255, .4);
    cursor: pointer;
    user-select: none;
    transition: color .2s;
}

.f-nl-consent-chk:hover {
    color: rgba(255, 255, 255, .58);
}

.f-nl-consent-chk input[type="checkbox"] {
    display: none;
}

.f-nl-consent-chk .chk-box {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    margin-top: 1px;
    background: rgba(255, 255, 255, .08);
    border: 1.5px solid rgba(255, 255, 255, .55);
    border-radius: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 0 1px rgba(24, 156, 217, .12);
    transition: background .2s, border-color .2s, box-shadow .2s;
}

.f-nl-consent-chk:hover .chk-box {
    border-color: rgba(24, 156, 217, .75);
    background: rgba(24, 156, 217, .1);
    box-shadow: 0 0 0 1px rgba(24, 156, 217, .25);
}

#footer .f-nl-consent-chk .chk-box {
    background: rgba(255, 255, 255, .08);
    border-color: rgba(255, 255, 255, .55);
}

#footer .f-nl-consent-chk:hover .chk-box {
    border-color: rgba(24, 156, 217, .8);
    background: rgba(24, 156, 217, .12);
}

.f-nl-consent-chk input:checked~.chk-box {
    background: var(--blue);
    border-color: var(--blue);
}

.f-nl-consent-chk input:checked~.chk-box::after {
    content: '';
    width: 3px;
    height: 6px;
    display: block;
    border: solid #fff;
    border-width: 0 1.5px 1.5px 0;
    transform: rotate(45deg) translate(-1px, -1px);
}

.btn-nl {
    background: var(--blue);
    color: var(--white);
    border: none;
    border-radius: 8px;
    padding: 11px 16px;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .3s;
    cursor: pointer;
}

.btn-nl:hover {
    background: var(--blue-dark);
}

.footer-bottom {
    border-top: 1px solid var(--border);
    padding: 22px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.f-copy {
    font-size: 12.5px;
    color: rgba(255, 255, 255, .28);
}

.f-legal {
    display: flex;
    gap: 22px;
}

.f-legal a {
    font-size: 12.5px;
    color: rgba(255, 255, 255, .28);
    text-decoration: none;
    transition: color .3s;
}

.f-legal a:hover,
.f-legal a.active {
    color: rgba(255, 255, 255, .58);
}

/* ==============================
   LEGAL PAGES
================================ */
.legal-content {
    color: rgba(255, 255, 255, .75);
    line-height: 1.8;
    font-size: 15px;
}

.legal-content h2 {
    font-size: 20px;
    font-weight: 600;
    color: var(--white);
    margin: 44px 0 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(255, 255, 255, .08);
}

.legal-content h3 {
    font-size: 16px;
    font-weight: 600;
    color: rgba(255, 255, 255, .9);
    margin: 28px 0 10px;
}

.legal-content p {
    margin-bottom: 16px;
}

.legal-content ul {
    padding-left: 22px;
    margin-bottom: 20px;
}

.legal-content ul li {
    margin-bottom: 8px;
}

.legal-content a {
    color: var(--blue);
    text-decoration: none;
}

.legal-content a:hover {
    text-decoration: underline;
}

.legal-content .table {
    color: rgba(255, 255, 255, .75);
    border-color: rgba(255, 255, 255, .1);
}

.legal-content .table th {
    color: var(--white);
    font-weight: 600;
    background: rgba(255, 255, 255, .05);
    border-color: rgba(255, 255, 255, .1);
    font-size: 13px;
}

.legal-content .table td {
    border-color: rgba(255, 255, 255, .07);
    font-size: 13px;
    vertical-align: middle;
}

html[data-theme="light"] .legal-content {
    color: rgba(0, 0, 0, .75);
}

html[data-theme="light"] .legal-content h2 {
    color: #1a1a1a;
    border-bottom-color: rgba(0, 0, 0, .1);
}

html[data-theme="light"] .legal-content h3 {
    color: rgba(0, 0, 0, .85);
}

html[data-theme="light"] .legal-content .table {
    color: rgba(0, 0, 0, .75);
    border-color: rgba(0, 0, 0, .12);
}

html[data-theme="light"] .legal-content .table th {
    color: #1a1a1a;
    background: rgba(0, 0, 0, .04);
    border-color: rgba(0, 0, 0, .12);
}

html[data-theme="light"] .legal-content .table td {
    border-color: rgba(0, 0, 0, .08);
}

/* ================================================
   FIXED CTA BUTTONS (sağ alt)
================================================ */
.fixed-cta {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 900;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
}

.fcta-btn {
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 100px;
    padding: 12px 18px;
    font-family: var(--font-main);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    box-shadow: 0 6px 24px rgba(0, 0, 0, .45);
    transition: transform .3s var(--ease-smooth);
}

.fcta-btn .lbl {
    max-width: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-width .4s ease, opacity .3s;
}

.fcta-btn:hover .lbl {
    max-width: 180px;
    opacity: 1;
}

.fcta-btn:hover {
    transform: translateX(-5px);
}

.fcta-btn i {
    font-size: 19px;
    flex-shrink: 0;
}

.fcta-wa {
    background: #25D366;
    color: #fff;
}

.fcta-tel {
    background: var(--blue);
    color: #fff;
}

.fcta-q {
    background: var(--white);
    color: var(--black);
}

/* ================================================
   RESPONSIVE
================================================ */
@media (max-width: 1199px) {
    .services-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .logo-grid {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width: 991px) {
    .hero-content {
        padding: 0 44px;
    }

    .hero-stats {
        gap: 28px;
    }

    .contact-info {
        padding-right: 0;
        margin-bottom: 40px;
    }
}

@media (max-width: 767px) {
    :root {
        --nav-h: 64px;
    }

    #navbar {
        padding: 0 20px;
    }

    .nav-links,
    .nav-right {
        display: none;
    }

    .nav-hamburger {
        display: flex;
    }

    /* Mobile menu — open state */
    .nav-links.open {
        display: flex;
        flex-direction: column;
        position: fixed;
        top: var(--nav-h);
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(5, 5, 5, .97);
        backdrop-filter: blur(20px);
        -webkit-backdrop-filter: blur(20px);
        padding: 20px 24px 40px;
        overflow-y: auto;
        gap: 0;
        z-index: 998;
    }

    .nav-links.open > li > a {
        font-size: 17px;
        font-weight: 500;
        color: rgba(255, 255, 255, .85);
        padding: 15px 0;
        border-bottom: 1px solid rgba(255, 255, 255, .06);
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .nav-links.open > li:last-child > a {
        border-bottom: none;
    }

    .nav-links.open .nav-dropdown {
        position: static;
        transform: none;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        background: transparent;
        border: none;
        border-radius: 0;
        padding: 0;
        box-shadow: none;
        max-height: 0;
        overflow: hidden;
        transition: max-height .3s ease, opacity .3s ease;
        display: block;
    }

    .nav-links.open li.dd-open > .nav-dropdown {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        max-height: 500px;
        padding: 4px 0 12px 16px;
    }

    .nav-links.open .nav-dropdown li a {
        font-size: 14px;
        color: rgba(255, 255, 255, .5);
        padding: 8px 0;
        display: block;
        border: none;
        text-decoration: none;
        transition: color .25s;
    }

    .nav-links.open .nav-dropdown li a:hover {
        color: var(--blue);
    }

    /* Hamburger → X animation */
    .nav-hamburger.open span:nth-child(1) {
        transform: translateY(6.5px) rotate(45deg);
    }
    .nav-hamburger.open span:nth-child(2) {
        opacity: 0;
        transform: scaleX(0);
    }
    .nav-hamburger.open span:nth-child(3) {
        transform: translateY(-6.5px) rotate(-45deg);
    }

    .nav-hamburger span {
        transition: transform .3s ease, opacity .3s ease;
    }

    .hero-content {
        padding: 0 24px;
    }

    .hero-stats {
        display: none;
    }

    .services-grid {
        grid-template-columns: 1fr;
    }

    .logo-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .stats-grid {
        grid-template-columns: 1fr 1fr;
    }

    .footer-bottom {
        flex-direction: column;
        gap: 14px;
        text-align: center;
    }

    .contact-form-wrap {
        padding: 32px 22px;
    }

    #cursor,
    #cursor-ring {
        display: none;
    }

    body {
        cursor: auto;
    }

    .fcta-btn .lbl {
        display: none;
    }
}

@media (max-width: 575px) {
    .logo-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .svc-checkboxes {
        flex-direction: column;
    }
}

/* ================================================
   DROPDOWN NAVIGATION
================================================ */
.nav-links>li {
    position: relative;
}

.nav-dropdown {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(-8px);
    min-width: 215px;
    list-style: none;
    background: rgba(8, 8, 8, .97);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 12px;
    padding: 20px 0 8px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .22s, transform .22s, visibility .22s;
    z-index: 1100;
}

.nav-links>li:hover .nav-dropdown {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
}

.nav-dropdown li a {
    display: block;
    padding: 9px 18px;
    margin: 0 4px;
    font-size: 12.5px;
    color: rgba(255, 255, 255, .6);
    text-decoration: none;
    white-space: nowrap;
    border-radius: 6px;
    transition: color .2s, background .2s;
}

.nav-dropdown li a:hover {
    color: var(--white);
    background: rgba(24, 156, 217, .1);
}

.nav-links>li.has-dd>a::after {
    display: none;
}

.dd-arr {
    font-size: 9px;
    opacity: .5;
    margin-left: 3px;
    display: inline-block;
    vertical-align: middle;
    transition: transform .22s, opacity .22s;
}

.nav-links>li:hover .dd-arr {
    transform: rotate(180deg);
    opacity: 1;
}

/* ================================================
   ABOUT — SOL BEYAZ, SAĞ VİDEO GÖRÜNÜR
================================================ */
.about-overlay {}

#about .sec-title {
    color: var(--text-dark);
}

#about .about-body p {
    color: rgba(0, 0, 0, .58);
}

#about .link-arrow {
    color: var(--blue);
}

/* ================================================
   REFERENCES — WHITE BACKGROUND
================================================ */
#references {
    background: #ffffff !important;
}

#references .sec-title {
    color: var(--text-dark);
}

#references .sec-desc {
    color: rgba(0, 0, 0, .5);
}

.logo-grid {
    background: rgba(0, 0, 0, .07);
    border-color: rgba(0, 0, 0, .08);
}

.logo-cell {
    background: #ffffff;
}

.logo-cell:hover {
    background: #f4f8fc;
}

.logo-cell img {
    max-height: 68px !important;
    max-width: 150px !important;
    filter: grayscale(1) brightness(0) opacity(.5);
}

.logo-cell:hover img {
    filter: grayscale(0) opacity(1);
}

#references .link-arrow {
    color: var(--blue);
}

#references .logo-cell span[style*="color:var(--blue)"] {
    color: var(--blue) !important;
}

/* ================================================
   FORM — ÇOK SEÇİMLİ HİZMET CHECKBOX'LAR
================================================ */
.svc-checkboxes {
    display: flex;
    gap: 8px;
    margin-top: 2px;
}

.svc-col {
    display: flex;
    flex-direction: column;
    gap: 7px;
    flex: 1;
}

.form-consent-group {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.form-consent-kvkk-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.form-consent-kvkk-row--footer {
    gap: 10px;
}

.form-consent-chk--kvkk {
    flex: 1;
    min-width: 0;
}

.form-kvkk-read-link {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    line-height: 1.3;
    color: rgba(255, 255, 255, .35);
    text-decoration: none;
    transition: color .2s;
    white-space: nowrap;
}

.form-kvkk-read-link:hover {
    color: rgba(255, 255, 255, .55);
    text-decoration: none;
}

.form-kvkk-read-link i {
    font-size: 13px;
}

.form-consent-chk {
    width: 100%;
}

.svc-chk {
    display: flex;
    align-items: center;
    gap: 9px;
    background: rgba(255, 255, 255, .05);
    border: 1px solid rgba(255, 255, 255, .09);
    border-radius: 8px;
    padding: 9px 11px;
    cursor: pointer;
    transition: border-color .2s, background .2s;
    font-size: 12.5px;
    color: rgba(255, 255, 255, .6);
    user-select: none;
}

.svc-chk:hover {
    border-color: rgba(24, 156, 217, .35);
    background: rgba(24, 156, 217, .05);
    color: var(--white);
}

.svc-chk input[type="checkbox"] {
    display: none;
}

.chk-box {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    border: 1.5px solid rgba(255, 255, 255, .25);
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .2s, border-color .2s;
}

.svc-chk input:checked~.chk-box {
    background: var(--blue);
    border-color: var(--blue);
}

.svc-chk input:checked~.chk-box::after {
    content: '';
    width: 4px;
    height: 8px;
    display: block;
    border: 2px solid #fff;
    border-top: none;
    border-left: none;
    transform: rotate(45deg) translate(-1px, -1px);
}

.svc-chk:has(input:checked) {
    border-color: rgba(24, 156, 217, .4);
    background: rgba(24, 156, 217, .08);
    color: var(--white);
}

/* ================================================
   FIXED CTA — DAİRESEL, HOVER'DA GENIŞLER
================================================ */
.fixed-cta {
    right: 24px;
    bottom: 24px;
}

.fcta-btn {
    height: 54px;
    min-width: 54px;
    max-width: 54px;
    flex-shrink: 0;
    border-radius: 100px;
    padding: 0 16px;
    gap: 0;
    justify-content: center;
    overflow: hidden;
    transition: max-width .4s var(--ease-smooth), gap .4s, transform .3s var(--ease-smooth) !important;
}

.fcta-btn:hover {
    max-width: 230px;
    gap: 9px;
    transform: translateX(-6px);
}

.fcta-btn .lbl {
    max-width: 0 !important;
    overflow: hidden;
    opacity: 0;
    white-space: nowrap;
    display: block !important;
    transition: max-width .4s var(--ease-smooth), opacity .3s !important;
}

.fcta-btn:hover .lbl {
    max-width: 160px !important;
    opacity: 1;
}

.fcta-btn i {
    font-size: 21px;
    flex-shrink: 0;
}

@media (max-width: 767px) {
    .fcta-btn .lbl {
        display: none !important;
    }
}

/* ================================================
   HERO CONTENT — CONTAINER HİZALAMASI
   Bootstrap xl  (≥1200px): max-width 1140px
   Bootstrap xxl (≥1400px): max-width 1320px  → 1920px dahil
================================================ */
@media (min-width: 1200px) {
    .hero-content {
        padding-left: max(24px, calc((100vw - 1140px) / 2 + 12px));
        padding-right: max(24px, calc((100vw - 1140px) / 2 + 12px));
    }
}

@media (min-width: 1400px) {
    .hero-content {
        padding-left: max(24px, calc((100vw - 1320px) / 2 + 12px));
        padding-right: max(24px, calc((100vw - 1320px) / 2 + 12px));
    }
}

/* ================================================
   İÇ SAYFA — PAGE HERO
================================================ */
.page-hero {
    position: relative;
    padding: calc(var(--nav-h) + 80px) 0 90px;
    background: var(--bg-darker);
    overflow: hidden;
}

.page-hero::before {
    content: '';
    position: absolute;
    top: -200px;
    left: -200px;
    width: 700px;
    height: 700px;
    background: radial-gradient(circle, rgba(24, 156, 217, .12) 0%, transparent 65%);
    pointer-events: none;
    z-index: 2;
}

.page-hero::after {
    content: '';
    position: absolute;
    bottom: -100px;
    right: 0;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(24, 156, 217, .06) 0%, transparent 65%);
    pointer-events: none;
    z-index: 2;
}

.page-hero-inner {
    position: relative;
    z-index: 3;
}

/* Hero video background */
.page-hero-video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}

.page-hero-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.60);
    z-index: 1;
}

/* CTA band görsel arka plan */
.page-cta-band--img {
    position: relative;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    background-color: transparent;
}

.page-cta-band--img::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.72);
    z-index: 0;
}

.page-cta-band--img .container {
    position: relative;
    z-index: 1;
}

.breadcrumb-inner {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 28px;
    flex-wrap: wrap;
}

.breadcrumb-inner a {
    font-size: 12.5px;
    color: rgba(255, 255, 255, .38);
    text-decoration: none;
    transition: color .3s;
}

.breadcrumb-inner a:hover {
    color: var(--blue);
}

.breadcrumb-inner .bc-sep {
    font-size: 11px;
    color: rgba(255, 255, 255, .18);
}

.breadcrumb-inner .bc-current {
    font-size: 12.5px;
    color: var(--blue);
}

.page-hero-title {
    font-size: clamp(36px, 5vw, 68px);
    font-weight: 800;
    line-height: 1.06;
    letter-spacing: -.025em;
    color: var(--white);
    margin-bottom: 22px;
}

.page-hero-title .hl {
    color: var(--blue);
    font-family: var(--font-accent);
    font-weight: 700;
    font-style: italic;
}

.page-hero-sub {
    font-size: clamp(15px, 1.3vw, 18px);
    color: rgba(255, 255, 255, .58);
    line-height: 1.68;
    max-width: 580px;
    margin-bottom: 38px;
}

.page-hero-actions {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

.page-hero-visual {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hero-stat-stack {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.hss-card {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 20px 24px;
    display: flex;
    align-items: center;
    gap: 16px;
}

.hss-icon {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    background: rgba(24, 156, 217, .12);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: var(--blue);
    flex-shrink: 0;
}

.hss-val {
    font-size: 26px;
    font-weight: 800;
    color: var(--white);
    line-height: 1;
}

.hss-val em {
    color: var(--blue);
    font-style: normal;
}

.hss-label {
    font-size: 12px;
    color: rgba(255, 255, 255, .42);
    margin-top: 3px;
}

/* ================================================
   İÇ SAYFA — HIZMET KAPSAMI KARTLARI
================================================ */
.scope-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-top: 56px;
}

.scope-card {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 32px 28px;
    transition: border-color .35s, transform .35s;
    text-decoration: none;
    display: block;
}

.scope-card:hover {
    border-color: rgba(24, 156, 217, .4);
    transform: translateY(-4px);
}

.scope-num {
    display: block;
    font-size: 11px;
    font-weight: 700;
    color: var(--blue);
    letter-spacing: .12em;
    margin-bottom: 18px;
}

.scope-icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: rgba(24, 156, 217, .1);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    color: var(--blue);
    margin-bottom: 18px;
}

.scope-title {
    font-size: 17px;
    font-weight: 700;
    color: var(--white);
    margin-bottom: 10px;
}

.scope-desc {
    font-size: 13.5px;
    color: rgba(255, 255, 255, .5);
    line-height: 1.6;
    margin: 0;
}

/* ================================================
   İÇ SAYFA — PLATFORM SHOWCASE
================================================ */
#platforms {
    padding: 96px 0;
    background: var(--bg-darker);
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}

.platform-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 16px;
    margin-top: 52px;
}

.platform-item {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 28px 16px;
    text-align: center;
    transition: border-color .3s, transform .3s;
}

.platform-item:hover {
    border-color: rgba(24, 156, 217, .35);
    transform: translateY(-3px);
}

.platform-item i {
    display: block;
    font-size: 32px;
    margin-bottom: 10px;
    color: rgba(255, 255, 255, .7);
    transition: color .3s;
}

.platform-item:hover i {
    color: var(--blue);
}

.platform-item span {
    font-size: 11.5px;
    font-weight: 500;
    color: rgba(255, 255, 255, .38);
    letter-spacing: .04em;
}

/* ================================================
   İÇ SAYFA — ÇALIŞMA SÜRECİ
================================================ */
#process {
    padding: 100px 0;
}

.process-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    margin-top: 60px;
    position: relative;
}

.process-grid::before {
    content: '';
    position: absolute;
    top: 36px;
    left: calc(12.5% + 20px);
    right: calc(12.5% + 20px);
    height: 1px;
    background: linear-gradient(to right, var(--blue), rgba(24, 156, 217, .2));
}

.process-step {
    padding: 0 24px;
    text-align: center;
    position: relative;
}

.process-num {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: rgba(24, 156, 217, .1);
    border: 1.5px solid rgba(24, 156, 217, .3);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 24px;
    font-size: 22px;
    font-weight: 800;
    color: var(--blue);
    position: relative;
    z-index: 1;
}

.process-step-title {
    font-size: 15px;
    font-weight: 700;
    color: var(--white);
    margin-bottom: 10px;
}

.process-step-desc {
    font-size: 13px;
    color: rgba(255, 255, 255, .45);
    line-height: 1.62;
}

/* ================================================
   İÇ SAYFA — AVANTAJLAR
================================================ */
#advantages {
    padding: 100px 0;
    background: var(--bg-darker);
}

.adv-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-top: 56px;
}

.adv-card {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 32px 24px;
    transition: border-color .3s;
}

.adv-card:hover {
    border-color: rgba(24, 156, 217, .35);
}

.adv-icon {
    width: 52px;
    height: 52px;
    border-radius: 12px;
    background: rgba(24, 156, 217, .1);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    color: var(--blue);
    margin-bottom: 20px;
}

.adv-title {
    font-size: 15px;
    font-weight: 700;
    color: var(--white);
    margin-bottom: 10px;
}

.adv-desc {
    font-size: 13px;
    color: rgba(255, 255, 255, .45);
    line-height: 1.62;
}

/* ================================================
   İÇ SAYFA — PAKETLER
================================================ */
#packages {
    padding: 100px 0;
}

.pkg-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-top: 56px;
    align-items: start;
}

.pkg-card {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 20px;
    padding: 36px 30px;
    position: relative;
    transition: border-color .3s, transform .3s;
}

.pkg-card.pkg-featured {
    border-color: var(--blue);
    transform: scale(1.03);
}

.pkg-card:hover {
    border-color: rgba(24, 156, 217, .5);
}

.pkg-badge {
    position: absolute;
    top: -14px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--blue);
    color: var(--white);
    font-size: 11px;
    font-weight: 700;
    padding: 5px 16px;
    border-radius: 100px;
    letter-spacing: .08em;
    white-space: nowrap;
}

.pkg-name {
    font-size: 13px;
    font-weight: 700;
    color: var(--blue);
    letter-spacing: .1em;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.pkg-title {
    font-size: 22px;
    font-weight: 800;
    color: var(--white);
    margin-bottom: 6px;
}

.pkg-subtitle {
    font-size: 13px;
    color: rgba(255, 255, 255, .42);
    margin-bottom: 28px;
}

.pkg-divider {
    border: none;
    border-top: 1px solid var(--border);
    margin: 0 0 24px;
}

.pkg-features {
    list-style: none;
    padding: 0;
    margin: 0 0 32px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.pkg-features li {
    font-size: 13.5px;
    color: rgba(255, 255, 255, .65);
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.pkg-features li i {
    color: var(--blue);
    font-size: 14px;
    margin-top: 2px;
    flex-shrink: 0;
}

.pkg-features li.pkg-off {
    color: rgba(255, 255, 255, .25);
}

.pkg-features li.pkg-off i {
    color: rgba(255, 255, 255, .2);
}

/* ================================================
   İÇ SAYFA — SSS
================================================ */
#faq {
    padding: 100px 0;
    background: var(--bg-darker);
}

.faq-wrap {
    margin-top: 52px;
}

.faq-wrap .accordion-item {
    background: var(--bg-card);
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    margin-bottom: 10px;
    overflow: hidden;
}

.faq-wrap .accordion-button {
    background: var(--bg-card);
    color: var(--white);
    font-family: var(--font-main);
    font-size: 15px;
    font-weight: 600;
    padding: 22px 24px;
    box-shadow: none;
    border-radius: 12px !important;
}

.faq-wrap .accordion-button:not(.collapsed) {
    background: rgba(24, 156, 217, .06);
    color: var(--blue);
}

.faq-wrap .accordion-button::after {
    filter: invert(1) brightness(.5);
}

.faq-wrap .accordion-button:not(.collapsed)::after {
    filter: none;
}

.faq-wrap .accordion-body {
    background: var(--bg-card);
    color: rgba(255, 255, 255, .55);
    font-size: 14px;
    line-height: 1.7;
    padding: 0 24px 22px;
}

/* ================================================
   İÇ SAYFA — MINI CTA BAND
================================================ */
.page-cta-band {
    background: linear-gradient(135deg, rgba(24, 156, 217, .15) 0%, rgba(14, 130, 184, .08) 100%);
    border-top: 1px solid rgba(24, 156, 217, .18);
    border-bottom: 1px solid rgba(24, 156, 217, .18);
    padding: 72px 0;
    text-align: center;
}

.page-cta-band h2 {
    font-size: clamp(24px, 3vw, 38px);
    font-weight: 800;
    color: var(--white);
    margin-bottom: 14px;
    letter-spacing: -.02em;
}

.page-cta-band p {
    font-size: 16px;
    color: rgba(255, 255, 255, .5);
    margin-bottom: 36px;
    max-width: 520px;
    margin-left: auto;
    margin-right: auto;
}

.page-cta-band .cta-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    flex-wrap: wrap;
}

/* ================================================
   REFERANSLAR SAYFASI
================================================ */

/* Filtre çubuğu */
.ref-filter-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 48px;
    justify-content: center;
}

.ref-filter-btn {
    background: var(--bg-card);
    border: 1px solid var(--border);
    color: rgba(255,255,255,.5);
    border-radius: 100px;
    padding: 9px 22px;
    font-family: var(--font-main);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: border-color .25s, color .25s, background .25s;
}

.ref-filter-btn:hover,
.ref-filter-btn.active {
    border-color: var(--blue);
    color: var(--white);
    background: rgba(24, 156, 217, .1);
}

/* Proje kartları */
.ref-project-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
    margin-top: 56px;
}

.ref-project-card {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 18px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: border-color .35s, transform .35s;
}

.ref-project-card:hover {
    border-color: rgba(24, 156, 217, .4);
    transform: translateY(-5px);
}

.ref-project-card.hidden {
    display: none;
}

.ref-project-img {
    position: relative;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: #0d0d0d;
}

.ref-project-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .5s var(--ease-smooth);
}

.ref-project-card:hover .ref-project-img img {
    transform: scale(1.04);
}

.ref-project-img-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,.7) 0%, transparent 55%);
    pointer-events: none;
}

.ref-project-body {
    padding: 24px 26px 28px;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.ref-sector-tag {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    color: var(--blue);
    letter-spacing: .1em;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.ref-project-name {
    font-size: 19px;
    font-weight: 800;
    color: var(--white);
    margin-bottom: 10px;
    letter-spacing: -.01em;
}

.ref-project-desc {
    font-size: 13.5px;
    color: rgba(255,255,255,.45);
    line-height: 1.65;
    flex: 1;
    margin: 0 0 18px;
}

.ref-project-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.ref-project-tag {
    font-size: 11px;
    font-weight: 500;
    color: rgba(255,255,255,.45);
    background: rgba(255,255,255,.05);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 100px;
    padding: 4px 12px;
}

/* Logo grid (referanslar genişletilmiş) */
.ref-logo-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 1px;
    background: var(--border);
    border: 1px solid var(--border);
    border-radius: 16px;
    overflow: hidden;
    margin-top: 52px;
}

.ref-logo-cell {
    background: #ffffff;
    padding: 30px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 3 / 1.6;
    transition: background .3s;
}

.ref-logo-cell:hover {
    background: #f4f8fc;
}

.ref-logo-cell img {
    max-height: 52px;
    max-width: 110px;
    width: auto;
    filter: grayscale(1) brightness(0) opacity(.22);
    transition: filter .35s;
    object-fit: contain;
}

.ref-logo-cell:hover img {
    filter: grayscale(0) opacity(1);
}

/* Hero stats band */
.ref-stats-row {
    display: flex;
    gap: 0;
    border: 1px solid var(--border);
    border-radius: 16px;
    overflow: hidden;
    margin-top: 52px;
}

.ref-stat-box {
    flex: 1;
    padding: 28px 24px;
    text-align: center;
    border-right: 1px solid var(--border);
}

.ref-stat-box:last-child {
    border-right: none;
}

.ref-stat-n {
    display: block;
    font-size: 36px;
    font-weight: 800;
    color: var(--white);
    line-height: 1;
}

.ref-stat-n em {
    color: var(--blue);
    font-style: normal;
}

.ref-stat-l {
    display: block;
    font-size: 12px;
    color: rgba(255,255,255,.38);
    margin-top: 6px;
    letter-spacing: .04em;
}

/* ================================================
   KİMİZ SAYFASI — Özellik Kartları
================================================ */
.about-feat-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-top: 56px;
}

.about-feat {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 32px 28px;
    transition: border-color .35s, transform .35s;
}

.about-feat:hover {
    border-color: rgba(24, 156, 217, .45);
    transform: translateY(-4px);
}

.about-feat-icon {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: rgba(24, 156, 217, .1);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    color: var(--blue);
    margin-bottom: 20px;
}

.about-feat h3 {
    font-size: 17px;
    font-weight: 700;
    color: var(--white);
    margin-bottom: 10px;
}

.about-feat p {
    font-size: 14px;
    line-height: 1.65;
    color: rgba(255,255,255,.45);
    margin: 0;
}

/* ================================================
   INSIGHT (BLOG) SAYFASI
================================================ */
.insight-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 56px;
}

.insight-card {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 18px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    text-decoration: none;
    transition: border-color .35s, transform .35s;
}

.insight-card:hover {
    border-color: rgba(24, 156, 217, .4);
    transform: translateY(-5px);
}

.insight-card-img {
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: #111;
}

.insight-card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .5s ease;
}

.insight-card:hover .insight-card-img img {
    transform: scale(1.04);
}

.insight-card-body {
    padding: 24px 26px 28px;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.insight-cat {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--blue);
    margin-bottom: 12px;
}

.insight-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--white);
    line-height: 1.4;
    margin-bottom: 10px;
}

.insight-excerpt {
    font-size: 13.5px;
    line-height: 1.65;
    color: rgba(255,255,255,.42);
    flex: 1;
    margin-bottom: 20px;
}

.insight-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid var(--border);
    padding-top: 16px;
}

.insight-date {
    font-size: 12px;
    color: rgba(255,255,255,.3);
}

.insight-read {
    font-size: 13px;
    font-weight: 600;
    color: var(--blue);
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 5px;
    transition: gap .2s;
}

.insight-card:hover .insight-read {
    gap: 9px;
}

/* ================================================
   İLETİŞİM SAYFASI
================================================ */
.ci-card {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 24px 26px;
    display: flex;
    gap: 18px;
    align-items: flex-start;
    margin-bottom: 16px;
}

.ci-icon {
    width: 46px;
    height: 46px;
    border-radius: 12px;
    background: rgba(24, 156, 217, .1);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: var(--blue);
    flex-shrink: 0;
}

.ci-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: rgba(255,255,255,.3);
    margin-bottom: 5px;
}

.ci-value {
    font-size: 15px;
    color: var(--white);
    font-weight: 500;
    line-height: 1.55;
}

.ci-value a {
    color: var(--white);
    text-decoration: none;
    transition: color .25s;
}

.ci-value a:hover {
    color: var(--blue);
}

.ci-social {
    display: flex;
    gap: 10px;
    margin-top: 28px;
}

.ci-soc-a {
    width: 42px;
    height: 42px;
    border: 1px solid var(--border);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(255,255,255,.45);
    font-size: 17px;
    text-decoration: none;
    transition: border-color .25s, color .25s;
}

.ci-soc-a:hover {
    border-color: var(--blue);
    color: var(--blue);
}

/* ================================================
   KARİYER SAYFASI — Dosya Yükleme
================================================ */
input[type="file"].f-input {
    padding: 12px 16px;
    cursor: pointer;
    color: rgba(255,255,255,.45);
}

input[type="file"].f-input::file-selector-button {
    background: rgba(24,156,217,.1);
    border: 1px solid rgba(24,156,217,.3);
    color: var(--blue);
    border-radius: 6px;
    padding: 6px 14px;
    font-family: var(--font-main);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    margin-right: 14px;
    transition: background .2s;
}

input[type="file"].f-input::file-selector-button:hover {
    background: rgba(24,156,217,.2);
}
/* ================================================
   GOOGLE MAPS (İletişim Sayfası)
================================================ */
.gmap-section {
    border-top: 1px solid rgba(255, 255, 255, .06);
}

.gmap-wrap {
    position: relative;
    height: 440px;
    overflow: hidden;
}

.gmap-iframe {
    width: 100%;
    height: 100%;
    display: block;
    border: none;
    filter: invert(90%) hue-rotate(180deg) contrast(1.05) brightness(0.9);
}

/* ================================================
   THEME TOGGLE BUTTON
================================================ */
.theme-toggle {
    background: none;
    border: 1.5px solid rgba(255, 255, 255, .14);
    border-radius: 50%;
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: rgba(255, 255, 255, .55);
    font-size: 15px;
    transition: border-color .3s, color .3s, background .3s;
    padding: 0;
    flex-shrink: 0;
}

.theme-toggle:hover {
    border-color: var(--blue);
    color: var(--blue);
    background: rgba(24, 156, 217, .08);
}

/* ================================================
   LIGHT MODE
================================================ */
html[data-theme="light"] {
    --bg-dark: #f5f5f7;
    --bg-darker: #ebebed;
    --bg-card: #ffffff;
    --border: rgba(0, 0, 0, 0.07);
}

html[data-theme="light"] body {
    background: #f5f5f7;
    color: #1a1a1a;
}

/* Navbar */
html[data-theme="light"] #navbar {
    background: rgba(248, 248, 250, .96);
    border-bottom: 1px solid rgba(0, 0, 0, .06);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
}

html[data-theme="light"] #navbar.scrolled {
    background: rgba(248, 248, 250, .98);
    border-bottom-color: rgba(0, 0, 0, .08);
}

html[data-theme="light"] .nav-links > li > a {
    color: rgba(0, 0, 0, .65);
}

html[data-theme="light"] .nav-links > li > a:hover {
    color: #1a1a1a;
}

html[data-theme="light"] .nav-dropdown {
    background: rgba(252, 252, 254, .98);
    border-color: rgba(0, 0, 0, .08);
}

html[data-theme="light"] .nav-dropdown li a {
    color: rgba(0, 0, 0, .65);
}

html[data-theme="light"] .nav-dropdown li a:hover {
    color: #1a1a1a;
    background: rgba(24, 156, 217, .07);
}

html[data-theme="light"] .lang-sw a {
    color: rgba(0, 0, 0, .38);
}

html[data-theme="light"] .lang-sw a.active,
html[data-theme="light"] .lang-sw a:hover {
    color: #1a1a1a;
}

html[data-theme="light"] .lang-sw span {
    color: rgba(0, 0, 0, .18);
}

html[data-theme="light"] .nav-hamburger span {
    background: #1a1a1a;
}

html[data-theme="light"] .theme-toggle {
    border-color: rgba(0, 0, 0, .14);
    color: rgba(0, 0, 0, .5);
}

html[data-theme="light"] .theme-toggle:hover {
    border-color: var(--blue);
    color: var(--blue);
}

/* Section text */
html[data-theme="light"] .sec-desc {
    color: rgba(0, 0, 0, .52);
}

/* Buttons */
html[data-theme="light"] .btn-ghost {
    color: #1a1a1a;
    border-color: rgba(0, 0, 0, .22);
}

html[data-theme="light"] .btn-ghost:hover {
    color: #1a1a1a;
    border-color: rgba(0, 0, 0, .5);
}

html[data-theme="light"] #hero .btn-ghost {
    color: #ffffff;
    border-color: rgba(255, 255, 255, .45);
}

html[data-theme="light"] #hero .btn-ghost:hover {
    color: #ffffff;
    border-color: rgba(255, 255, 255, .75);
    background: rgba(255, 255, 255, .08);
}

html[data-theme="light"] .s-btn {
    color: #1a1a1a;
    border-color: rgba(0, 0, 0, .12);
}

/* Services */
html[data-theme="light"] #services {
    background: #f5f5f7;
}

html[data-theme="light"] .services-grid {
    background: rgba(0, 0, 0, .07);
    border-color: rgba(0, 0, 0, .07);
}

html[data-theme="light"] .svc-card {
    background: #f5f5f7;
}

html[data-theme="light"] .svc-card:hover {
    background: #e9e9eb;
}

html[data-theme="light"] .svc-title {
    color: #1a1a1a;
}

html[data-theme="light"] .svc-desc {
    color: rgba(0, 0, 0, .48);
}

html[data-theme="light"] .svc-num {
    color: rgba(0, 0, 0, .14);
}

html[data-theme="light"] .svc-tag {
    color: rgba(0, 0, 0, .42);
    background: rgba(0, 0, 0, .04);
    border-color: rgba(0, 0, 0, .06);
}

html[data-theme="light"] .svc-cta-inner h3 {
    color: #1a1a1a;
}

html[data-theme="light"] .svc-cta-inner p {
    color: rgba(0, 0, 0, .48);
}

/* References (ana sayfa) */
html[data-theme="light"] #references {
    background: #ffffff;
}

html[data-theme="light"] .logo-grid {
    background: rgba(0, 0, 0, .06);
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 12px;
    overflow: hidden;
}

html[data-theme="light"] .logo-cell {
    background: #ffffff;
}

html[data-theme="light"] .logo-cell:hover {
    background: #f7f8f9;
}

html[data-theme="light"] .logo-cell img {
    filter: grayscale(1) brightness(0) opacity(.28);
}

html[data-theme="light"] .logo-cell:hover img {
    filter: grayscale(0) opacity(1);
}

/* Testimonials */
html[data-theme="light"] #testimonials {
    background: #f5f5f7;
}

html[data-theme="light"] .t-card {
    background: #ffffff;
    border-color: rgba(0, 0, 0, .07);
}

html[data-theme="light"] .t-text {
    color: rgba(0, 0, 0, .7);
}

html[data-theme="light"] .t-name {
    color: #1a1a1a;
}

html[data-theme="light"] .t-co {
    color: rgba(0, 0, 0, .35);
}

html[data-theme="light"] .swiper-pagination-bullet {
    background: rgba(0, 0, 0, .2);
}

/* Blog */
html[data-theme="light"] #blog {
    background: #ebebed;
}

html[data-theme="light"] .blog-card {
    background: #ffffff;
    border-color: rgba(0, 0, 0, .07);
}

html[data-theme="light"] .blog-title {
    color: #1a1a1a;
}

html[data-theme="light"] .blog-excerpt {
    color: rgba(0, 0, 0, .44);
}

html[data-theme="light"] .blog-meta {
    color: rgba(0, 0, 0, .28);
}

html[data-theme="light"] .blog-thumb {
    background: linear-gradient(135deg, #e2e2e8, #ececf2);
}

/* Checkbox seçim listesi */
html[data-theme="light"] .svc-chk {
    background: rgba(0, 0, 0, .04);
    border-color: rgba(0, 0, 0, .12);
    color: rgba(0, 0, 0, .65);
}

html[data-theme="light"] .svc-chk:hover {
    border-color: rgba(24, 156, 217, .5);
    background: rgba(24, 156, 217, .06);
    color: #1a1a1a;
}

html[data-theme="light"] .chk-box {
    border-color: rgba(0, 0, 0, .28);
}

html[data-theme="light"] .svc-chk:has(input:checked) {
    border-color: rgba(24, 156, 217, .5);
    background: rgba(24, 156, 217, .08);
    color: #1a1a1a;
}

/* Contact (ana sayfa) */
html[data-theme="light"] #contact {
    background: #f5f5f7;
}

html[data-theme="light"] .contact-form-wrap {
    background: #ffffff;
    border-color: rgba(0, 0, 0, .07);
}

html[data-theme="light"] .c-label {
    color: rgba(0, 0, 0, .38);
}

html[data-theme="light"] .c-value,
html[data-theme="light"] .c-value a {
    color: #1a1a1a;
}

html[data-theme="light"] .f-label {
    color: rgba(0, 0, 0, .42);
}

html[data-theme="light"] .f-input {
    background: rgba(0, 0, 0, .04);
    border-color: rgba(0, 0, 0, .1);
    color: #1a1a1a;
}

html[data-theme="light"] .f-input::placeholder {
    color: rgba(0, 0, 0, .24);
}

html[data-theme="light"] .f-input:focus {
    background: rgba(24, 156, 217, .03);
}

html[data-theme="light"] select.f-input option {
    background: #ffffff;
    color: #1a1a1a;
}

html[data-theme="light"] input[type="file"].f-input {
    color: rgba(0, 0, 0, .45);
}

html[data-theme="light"] #footer .f-nl-input {
    background: rgba(255, 255, 255, .08);
    border-color: rgba(255, 255, 255, .18);
    color: #fff;
}

html[data-theme="light"] #footer .f-nl-input::placeholder {
    color: rgba(255, 255, 255, .45);
}

html[data-theme="light"] #footer .f-nl-input:focus {
    border-color: var(--blue);
    background: rgba(255, 255, 255, .1);
}

html[data-theme="light"] .f-nl-input {
    background: rgba(0, 0, 0, .04);
    border-color: rgba(0, 0, 0, .1);
    color: #1a1a1a;
}

html[data-theme="light"] .f-nl-input::placeholder {
    color: rgba(0, 0, 0, .24);
}

html[data-theme="light"] .f-nl-input:focus {
    border-color: var(--blue);
}

/* Page Hero (iç sayfalar - her zaman koyu) */
html[data-theme="light"] .page-hero {
    background: #0a0a0a;
}

html[data-theme="light"] .page-hero .hss-card {
    background: rgba(255, 255, 255, .06);
    border-color: rgba(255, 255, 255, .1);
}

/* Scope kartları */
html[data-theme="light"] .scope-title {
    color: #1a1a1a;
}

html[data-theme="light"] .scope-desc {
    color: rgba(0, 0, 0, .5);
}

/* Platforms */
html[data-theme="light"] .platform-item i {
    color: rgba(0, 0, 0, .6);
}

html[data-theme="light"] .platform-item span {
    color: rgba(0, 0, 0, .38);
}

/* Process */
html[data-theme="light"] .process-step-title {
    color: #1a1a1a;
}

html[data-theme="light"] .process-step-desc {
    color: rgba(0, 0, 0, .45);
}

/* Advantages */
html[data-theme="light"] .adv-title {
    color: #1a1a1a;
}

html[data-theme="light"] .adv-desc {
    color: rgba(0, 0, 0, .45);
}

/* Packages */
html[data-theme="light"] .pkg-title {
    color: #1a1a1a;
}

html[data-theme="light"] .pkg-subtitle {
    color: rgba(0, 0, 0, .42);
}

html[data-theme="light"] .pkg-features li {
    color: rgba(0, 0, 0, .65);
}

html[data-theme="light"] .pkg-features li.pkg-off {
    color: rgba(0, 0, 0, .25);
}

html[data-theme="light"] .pkg-features li.pkg-off i {
    color: rgba(0, 0, 0, .2);
}

/* FAQ */
html[data-theme="light"] .faq-wrap .accordion-item {
    background: #ffffff;
}

html[data-theme="light"] .faq-wrap .accordion-button {
    background: #ffffff;
    color: #1a1a1a;
}

html[data-theme="light"] .faq-wrap .accordion-button::after {
    filter: none;
}

html[data-theme="light"] .faq-wrap .accordion-button:not(.collapsed) {
    background: rgba(24, 156, 217, .07);
}

html[data-theme="light"] .faq-wrap .accordion-body {
    background: #ffffff;
    color: rgba(0, 0, 0, .55);
}

/* CTA Band */
html[data-theme="light"] .page-cta-band h2 {
    color: #1a1a1a;
}

html[data-theme="light"] .page-cta-band p {
    color: rgba(0, 0, 0, .52);
}

html[data-theme="light"] .page-cta-band.page-cta-band--img h2 {
    color: #ffffff;
}

html[data-theme="light"] .page-cta-band.page-cta-band--img p {
    color: rgba(255, 255, 255, .5);
}

/* Referanslar sayfası */
html[data-theme="light"] .ref-filter-btn {
    color: rgba(0, 0, 0, .5);
}

html[data-theme="light"] .ref-project-name {
    color: #1a1a1a;
}

html[data-theme="light"] .ref-project-desc {
    color: rgba(0, 0, 0, .45);
}

html[data-theme="light"] .ref-project-tag {
    color: rgba(0, 0, 0, .45);
    background: rgba(0, 0, 0, .04);
    border-color: rgba(0, 0, 0, .06);
}

html[data-theme="light"] .ref-stat-n {
    color: #1a1a1a;
}

html[data-theme="light"] .ref-stat-l {
    color: rgba(0, 0, 0, .38);
}

html[data-theme="light"] .ref-stats-row {
    border-color: rgba(0, 0, 0, .07);
}

html[data-theme="light"] .ref-stat-box {
    border-color: rgba(0, 0, 0, .07);
    background: #ffffff;
}

/* Kimiz sayfası feat kartları */
html[data-theme="light"] .about-feat h3 {
    color: #1a1a1a;
}

html[data-theme="light"] .about-feat p {
    color: rgba(0, 0, 0, .45);
}

/* Insight (blog) sayfası */
html[data-theme="light"] .insight-title {
    color: #1a1a1a;
}

html[data-theme="light"] .insight-excerpt {
    color: rgba(0, 0, 0, .42);
}

html[data-theme="light"] .insight-date {
    color: rgba(0, 0, 0, .3);
}

html[data-theme="light"] .insight-card-img {
    background: #e8e8ee;
}

/* İletişim sayfası */
html[data-theme="light"] .ci-label {
    color: rgba(0, 0, 0, .3);
}

html[data-theme="light"] .ci-soc-a {
    color: rgba(0, 0, 0, .45);
    border-color: rgba(0, 0, 0, .07);
}

/* Google Maps (ışık modunda normal renk) */
html[data-theme="light"] .gmap-section {
    border-top-color: rgba(0, 0, 0, .08);
}

html[data-theme="light"] .gmap-iframe {
    filter: none;
}

/* ================================================
   INLINE BEYAZ RENK OVERRİDELARI (light mode)
   Inline style > dış CSS olduğu için !important gerekli
================================================ */
html[data-theme="light"] [style*="color:var(--white)"],
html[data-theme="light"] [style*="color: var(--white)"] {
    color: #1a1a1a !important;
}

html[data-theme="light"] [style*="color:rgba(255,255,255,.45)"],
html[data-theme="light"] [style*="color: rgba(255,255,255,.45)"] {
    color: rgba(0, 0, 0, .55) !important;
}

html[data-theme="light"] [style*="color:rgba(255,255,255,.25)"],
html[data-theme="light"] [style*="color: rgba(255,255,255,.25)"] {
    color: rgba(0, 0, 0, .38) !important;
}

html[data-theme="light"] [style*="color:rgba(255,255,255,.3)"] {
    color: rgba(0, 0, 0, .4) !important;
}

/* ==============================
   BLOG DETAIL PAGE
================================ */
.post-hero {
    position: relative;
    min-height: 520px;
    display: flex;
    align-items: flex-end;
    padding-bottom: 60px;
    overflow: hidden;
}

.post-hero-img {
    position: absolute;
    inset: 0;
}

.post-hero-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.post-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(5,5,5,.35) 0%, rgba(5,5,5,.85) 100%);
}

.post-hero-inner {
    position: relative;
    z-index: 2;
}

.post-hero-title {
    font-size: clamp(28px, 4vw, 48px);
    font-weight: 700;
    color: var(--white);
    line-height: 1.2;
    margin: 16px 0 20px;
    max-width: 780px;
}

.post-hero-meta {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    color: rgba(255, 255, 255, .55);
    font-size: 14px;
}

.post-hero-meta span { display: flex; align-items: center; gap: 6px; }

/* Post body */
.post-section { padding: 80px 0 60px; }

.post-lead {
    font-size: 18px;
    line-height: 1.75;
    color: rgba(255, 255, 255, .75);
    margin-bottom: 36px;
    font-weight: 400;
}

.post-body {
    color: rgba(255, 255, 255, .72);
    font-size: 16px;
    line-height: 1.85;
}

.post-body h2 {
    font-size: 24px;
    font-weight: 700;
    color: var(--white);
    margin: 48px 0 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(255, 255, 255, .08);
}

.post-body h3 {
    font-size: 18px;
    font-weight: 600;
    color: rgba(255, 255, 255, .9);
    margin: 32px 0 12px;
}

.post-body p { margin-bottom: 20px; }

.post-body ul, .post-body ol {
    padding-left: 24px;
    margin-bottom: 24px;
}

.post-body ul li, .post-body ol li { margin-bottom: 8px; }

.post-body a { color: var(--blue); text-decoration: none; }
.post-body a:hover { text-decoration: underline; }

.post-body blockquote {
    border-left: 3px solid var(--blue);
    padding: 16px 24px;
    margin: 32px 0;
    background: rgba(24, 156, 217, .06);
    border-radius: 0 8px 8px 0;
    font-size: 17px;
    font-style: italic;
    color: rgba(255, 255, 255, .8);
}

.post-body img {
    width: 100%;
    border-radius: 12px;
    margin: 28px 0;
}

.post-body figure { margin: 32px 0; }

.post-body figcaption {
    text-align: center;
    font-size: 13px;
    color: rgba(255, 255, 255, .38);
    margin-top: 8px;
}

/* Paylaşım */
.post-share {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 48px 0;
    padding: 24px 0;
    border-top: 1px solid rgba(255, 255, 255, .08);
    border-bottom: 1px solid rgba(255, 255, 255, .08);
}

.post-share-label {
    font-size: 13px;
    color: rgba(255, 255, 255, .4);
    margin-right: 4px;
}

.post-share-btn {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, .12);
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(255, 255, 255, .6);
    font-size: 15px;
    text-decoration: none;
    transition: border-color .25s, color .25s, background .25s;
}

.post-share-btn:hover {
    border-color: var(--blue);
    color: var(--blue);
    background: rgba(24, 156, 217, .08);
}

/* Yazar kutusu */
.post-author-box {
    display: flex;
    gap: 20px;
    align-items: flex-start;
    background: rgba(255, 255, 255, .03);
    border: 1px solid rgba(255, 255, 255, .07);
    border-radius: 14px;
    padding: 24px 28px;
    margin-top: 8px;
}

.post-author-logo {
    width: 52px;
    height: 52px;
    flex-shrink: 0;
    opacity: .7;
}

.post-author-name {
    font-size: 15px;
    font-weight: 600;
    color: var(--white);
    margin-bottom: 6px;
}

.post-author-bio {
    font-size: 13.5px;
    color: rgba(255, 255, 255, .5);
    line-height: 1.65;
    margin: 0;
}

/* Sidebar */
.post-sidebar { position: sticky; top: calc(var(--nav-h) + 24px); }

.sidebar-widget {
    background: rgba(255, 255, 255, .03);
    border: 1px solid rgba(255, 255, 255, .07);
    border-radius: 12px;
    padding: 20px 22px;
    margin-bottom: 20px;
}

.sidebar-widget-title {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .35);
    margin-bottom: 14px;
}

.sidebar-toc { list-style: none; padding: 0; margin: 0; }

.sidebar-toc li { margin-bottom: 6px; }

.sidebar-toc li.toc-sub { padding-left: 14px; }

.sidebar-toc a {
    font-size: 13.5px;
    color: rgba(255, 255, 255, .55);
    text-decoration: none;
    transition: color .2s;
    display: block;
    padding: 3px 0;
}

.sidebar-toc a:hover { color: var(--blue); }

.sidebar-cta { background: linear-gradient(135deg, rgba(24,156,217,.12), rgba(24,156,217,.04)); }

.sidebar-cta-text {
    font-size: 14px;
    color: rgba(255, 255, 255, .75);
    margin-bottom: 16px;
    line-height: 1.55;
}

.btn-primary-sm {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--blue);
    color: #fff;
    padding: 9px 18px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: opacity .25s;
}

.btn-primary-sm:hover { opacity: .85; color: #fff; }

.sidebar-service-link {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: var(--blue);
    text-decoration: none;
    transition: gap .2s;
}

.sidebar-service-link:hover { gap: 12px; }

/* Light mode overrides */
html[data-theme="light"] .post-hero-overlay {
    background: linear-gradient(to bottom, rgba(255,255,255,.1) 0%, rgba(20,20,20,.8) 100%);
}

html[data-theme="light"] .post-lead { color: rgba(0, 0, 0, .7); }
html[data-theme="light"] .post-body { color: rgba(0, 0, 0, .72); }
html[data-theme="light"] .post-body h2 { color: #1a1a1a; border-bottom-color: rgba(0,0,0,.1); }
html[data-theme="light"] .post-body h3 { color: rgba(0,0,0,.85); }
html[data-theme="light"] .post-body blockquote { background: rgba(24,156,217,.06); color: rgba(0,0,0,.7); }
html[data-theme="light"] .post-share { border-color: rgba(0,0,0,.1); }
html[data-theme="light"] .post-share-label { color: rgba(0,0,0,.4); }
html[data-theme="light"] .post-share-btn { border-color: rgba(0,0,0,.15); color: rgba(0,0,0,.55); }
html[data-theme="light"] .post-author-box { background: rgba(0,0,0,.02); border-color: rgba(0,0,0,.08); }
html[data-theme="light"] .post-author-name { color: #1a1a1a; }
html[data-theme="light"] .post-author-bio { color: rgba(0,0,0,.5); }
html[data-theme="light"] .sidebar-widget { background: rgba(0,0,0,.02); border-color: rgba(0,0,0,.08); }
html[data-theme="light"] .sidebar-widget-title { color: rgba(0,0,0,.35); }
html[data-theme="light"] .sidebar-toc a { color: rgba(0,0,0,.55); }
html[data-theme="light"] .sidebar-cta-text { color: rgba(0,0,0,.7); }
html[data-theme="light"] .post-body figcaption { color: rgba(0,0,0,.38); }

@media (max-width: 767px) {
    .post-hero { min-height: 380px; padding-bottom: 40px; }
    .post-hero-meta { gap: 12px; font-size: 13px; }
    .post-section { padding: 52px 0 40px; }
    .post-lead { font-size: 16px; }
    .post-body { font-size: 15px; }
    .post-author-box { flex-direction: column; gap: 14px; }
}

/* ================================================
   FORM RESULT PAGES
================================================ */
.form-result-section {
    min-height: calc(100vh - 220px);
    display: flex;
    align-items: center;
    padding: 120px 0 100px;
    background: var(--bg-dark);
}

.form-result-card {
    max-width: 760px;
    margin: 0 auto;
    text-align: center;
    background: rgba(255, 255, 255, .03);
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 20px;
    padding: 56px 40px;
}

.form-result-icon {
    font-size: 56px;
    margin-bottom: 24px;
}

.form-result-success .form-result-icon {
    color: #4ade80;
}

.form-result-error .form-result-icon {
    color: #f87171;
}

.form-result-title {
    font-size: clamp(28px, 4vw, 42px);
    font-weight: 800;
    color: var(--white);
    line-height: 1.25;
    margin-bottom: 16px;
}

.form-result-title-error {
    font-size: clamp(24px, 3vw, 34px);
}

.form-result-desc {
    font-size: 16px;
    line-height: 1.7;
    color: rgba(255, 255, 255, .55);
    max-width: 560px;
    margin: 0 auto 28px;
}

.form-result-desc-error {
    color: rgba(248, 113, 113, .85);
}

.form-result-errors {
    list-style: none;
    padding: 0;
    margin: 0 auto 30px;
    max-width: 520px;
    text-align: left;
}

.form-result-errors li {
    position: relative;
    padding: 12px 16px 12px 38px;
    margin-bottom: 8px;
    background: rgba(248, 113, 113, .08);
    border: 1px solid rgba(248, 113, 113, .22);
    border-radius: 10px;
    color: #fca5a5;
    font-size: 14px;
    line-height: 1.5;
}

.form-result-errors li::before {
    content: '×';
    position: absolute;
    left: 14px;
    top: 10px;
    color: #f87171;
    font-size: 18px;
    font-weight: 700;
}

.form-result-actions {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
}

@media (max-width: 767px) {
    .form-result-card {
        padding: 40px 24px;
    }
}

html[data-theme="light"] .form-result-section {
    background: #f5f5f7;
}

html[data-theme="light"] .form-result-card {
    background: #ffffff;
    border-color: rgba(0, 0, 0, .08);
    box-shadow: 0 12px 40px rgba(0, 0, 0, .06);
}

html[data-theme="light"] .form-result-title {
    color: #1a1a1a;
}

html[data-theme="light"] .form-result-desc {
    color: rgba(0, 0, 0, .62);
}

html[data-theme="light"] .form-result-desc-error {
    color: #dc3545;
}

html[data-theme="light"] .form-result-errors li {
    background: rgba(220, 53, 69, .06);
    border-color: rgba(220, 53, 69, .18);
    color: #b42318;
}

html[data-theme="light"] .form-result-errors li::before {
    color: #dc3545;
}