/* TK TECH V2 */

:root {

    --bg: #030607;

    --panel: #070c0f;

    --cyan: #6fe3fb;

    --cyan-bright: #baf5ff;

    --text: #f3f8f9;

    --muted: #7a8b91;

    --border: rgba(255,255,255,.07);

    --border-cyan: rgba(111,227,251,.16);

    --shell: 1280px;

    --ease: cubic-bezier(.2,.7,.2,1);

}

/* RESET */

* {

    margin: 0;

    padding: 0;

    box-sizing: border-box;

}

html {

    scroll-behavior: smooth;

}

body {

    min-height: 100vh;

    overflow-x: hidden;

    color: var(--text);

    background: var(--bg);

    font-family: "Manrope", sans-serif;

    -webkit-font-smoothing: antialiased;

}

a {

    color: inherit;

    text-decoration: none;

}

button {

    font: inherit;

}

img {

    display: block;

    max-width: 100%;

}

.v2-shell {

    width: min(
            var(--shell),
            calc(100% - 48px)
        );

    margin-inline: auto;

}

/* GLOBAL ATMOSPHERE */

.v2-page-atmosphere {

    position: fixed;

    z-index: -10;

    inset: 0;

    overflow: hidden;

    pointer-events: none;

    background: #030607;

}

.v2-aurora {

    position: absolute;

    border-radius: 50%;

    filter: blur(130px);

    opacity: .7;

    animation: v2Aurora 15s ease-in-out infinite alternate;

}

.v2-aurora-one {

    width: 650px;

    height: 650px;

    right: -200px;

    top: 70px;

    background: rgba(40, 183, 220, .12);

}

.v2-aurora-two {

    width: 570px;

    height: 570px;

    left: -290px;

    top: 550px;

    background: rgba(52, 163, 197, .075);

    animation-delay: -5s;

}

.v2-aurora-three {

    width: 450px;

    height: 450px;

    left: 45%;

    top: -270px;

    background: rgba(92, 222, 251, .055);

    animation-delay: -9s;

}

@keyframes v2Aurora {

    from {

        transform: translate3d(
                -25px,
                -15px,
                0
            ) scale(.92);

    }

    to {

        transform: translate3d(
                45px,
                35px,
                0
            ) scale(1.1);

    }

}

.v2-grid {

    position: absolute;

    inset: 0;

    opacity: .13;

    background-image: linear-gradient(
            rgba(92,220,250,.04) 1px,
            transparent 1px
        ), linear-gradient(
            90deg,
            rgba(92,220,250,.04) 1px,
            transparent 1px
        );

    background-size: 80px 80px;

    mask-image: linear-gradient(
            180deg,
            black,
            transparent 80%
        );

}

.v2-noise {

    position: absolute;

    inset: 0;

    opacity: .14;

    background-image: repeating-linear-gradient(
            0deg,
            rgba(255,255,255,.008) 0,
            rgba(255,255,255,.008) 1px,
            transparent 1px,
            transparent 4px
        );

}

/* HEADER */

.v2-header {

    position: absolute;

    z-index: 1000;

    top: 0;

    left: 0;

    width: 100%;

    transition: background .3s ease, border-color .3s ease, backdrop-filter .3s ease;

}

.v2-header.scrolled {

    position: fixed;

    border-bottom: 1px solid rgba(111,227,251,.08);

    background: rgba(3,6,7,.82);

    backdrop-filter: blur(22px);

    -webkit-backdrop-filter: blur(22px);

}

.v2-nav {

    min-height: 92px;

    display: flex;

    align-items: center;

    gap: 35px;

}

.v2-brand {

    display: flex;

    align-items: center;

    gap: 13px;

    margin-right: auto;

}

.v2-brand-mark {

    width: 47px;

    height: 47px;

    display: grid;

    place-items: center;

    color: #a9efff;

    border: 1px solid rgba(111,227,251,.22);

    background: linear-gradient(
            145deg,
            rgba(111,227,251,.09),
            rgba(255,255,255,.012)
        );

    clip-path: polygon(
            25% 5%,
            75% 5%,
            95% 25%,
            95% 75%,
            75% 95%,
            25% 95%,
            5% 75%,
            5% 25%
        );

    font-family: "Space Grotesk", sans-serif;

    font-size: 14px;

    font-weight: 700;

    box-shadow: inset 0 0 25px rgba(111,227,251,.04);

}

.v2-brand-copy {

    display: flex;

    flex-direction: column;

    gap: 2px;

}

.v2-brand-copy strong {

    font-family: "Space Grotesk", sans-serif;

    font-size: 15px;

    letter-spacing: 1.6px;

}

.v2-brand-copy small {

    color: #617278;

    font-size: 7px;

    font-weight: 800;

    letter-spacing: 1.5px;

}

.v2-nav-links {

    display: flex;

    gap: 31px;

}

.v2-nav-links a {

    position: relative;

    color: #87969b;

    font-size: 11px;

    font-weight: 600;

    transition: color .25s ease;

}

.v2-nav-links a::after {

    content: "";

    position: absolute;

    left: 50%;

    bottom: -11px;

    width: 0;

    height: 1px;

    transform: translateX(-50%);

    background: var(--cyan);

    box-shadow: 0 0 8px rgba(111,227,251,.75);

    transition: width .25s ease;

}

.v2-nav-links a:hover {

    color: #fff;

}

.v2-nav-links a:hover::after {

    width: 100%;

}

.v2-nav-cta {

    min-height: 46px;

    padding: 0 20px;

    display: inline-flex;

    align-items: center;

    gap: 12px;

    color: #ffffff;

    border: 1px solid rgba(37, 211, 102, .34);

    border-radius: 999px;

    background: linear-gradient(135deg, #2fd96b, #25d366);

    box-shadow: 0 14px 34px rgba(37, 211, 102, .18), inset 0 1px 0 rgba(255,255,255,.22);

    font-size: 10px;

    font-weight: 800;

    transition: transform .25s ease, box-shadow .25s ease, filter .25s ease;

}

.v2-nav-cta span {

    color: #ffffff;

    font-size: 14px;

}

.v2-nav-cta:hover {

    transform: translateY(-2px);

    box-shadow: 0 18px 40px rgba(37, 211, 102, .24), inset 0 1px 0 rgba(255,255,255,.28);

    filter: brightness(1.03);

}

/* MOBILE NAV */

.v2-menu-button {

    position: relative;

    width: 44px;

    height: 44px;

    display: none;

    border: 1px solid var(--border);

    border-radius: 10px;

    background: rgba(255,255,255,.02);

}

.v2-menu-button span {

    position: absolute;

    left: 12px;

    width: 18px;

    height: 1px;

    background: #d3e2e6;

}

.v2-menu-button span:first-child {

    top: 17px;

}

.v2-menu-button span:last-child {

    top: 25px;

}

.v2-mobile-menu {

    display: none;

}

/* HERO */

.v2-hero {

    min-height: 100vh;

    padding: 120px 0 55px;

    display: flex;

    align-items: center;

}

.v2-hero-panel {

    position: relative;

    min-height: 690px;

    padding: 75px 70px;

    display: grid;

    grid-template-columns: minmax(0, 1.02fr) minmax(500px, .98fr);

    align-items: center;

    gap: 70px;

    overflow: hidden;

    border: 1px solid rgba(115,230,255,.12);

    border-radius: 34px;

    background: radial-gradient(
            circle at 72% 48%,
            rgba(77, 224, 255, .16) 0%,
            rgba(77, 224, 255, .08) 18%,
            rgba(77, 224, 255, 0) 56%
        ), radial-gradient(
            circle at 18% 85%,
            rgba(36, 120, 145, .09) 0%,
            rgba(36, 120, 145, 0) 42%
        ), linear-gradient(
            145deg,
            rgba(8,14,17,.98),
            rgba(2,6,8,.98)
        );

    box-shadow: 0 65px 150px rgba(0,0,0,.58), 0 0 90px rgba(57,210,246,.03), inset 0 1px 0 rgba(255,255,255,.035);

}

/* HERO DECORATION */

.v2-circuit-lines {

    position: absolute;

    z-index: 0;

    right: -80px;

    top: -60px;

    width: 650px;

    height: 650px;

    opacity: .19;

    pointer-events: none;

    background: linear-gradient(
            115deg,
            transparent 0 35%,
            rgba(111,227,251,.11) 35.15%,
            transparent 35.3% 100%
        ), linear-gradient(
            135deg,
            transparent 0 56%,
            rgba(111,227,251,.08) 56.1%,
            transparent 56.3%
        ), linear-gradient(
            25deg,
            transparent 0 63%,
            rgba(111,227,251,.07) 63.1%,
            transparent 63.3%
        );

}

.v2-panel-light {

    position: absolute;

    z-index: 0;

    width: 380px;

    height: 380px;

    right: 120px;

    top: 50%;

    transform: translateY(-50%);

    border-radius: 50%;

    background: radial-gradient(
            circle,
            rgba(87,226,255,.18) 0%,
            rgba(87,226,255,.08) 36%,
            rgba(87,226,255,0) 72%
        );

    filter: blur(58px);

    opacity: .88;

    pointer-events: none;

}

/* HERO CONTENT */

.v2-hero-content {

    position: relative;

    z-index: 10;

    max-width: 650px;

}

.v2-kicker {

    margin-bottom: 26px;

    display: flex;

    align-items: center;

    gap: 10px;

    color: #7d8d92;

    font-size: 8px;

    font-weight: 800;

    letter-spacing: 2.3px;

}

.v2-kicker-dot {

    width: 6px;

    height: 6px;

    border-radius: 50%;

    background: #7aeaff;

    box-shadow: 0 0 7px #7aeaff, 0 0 18px rgba(122,234,255,.55);

}

.v2-kicker i {

    width: 30px;

    height: 1px;

    background: linear-gradient(
            90deg,
            var(--cyan),
            transparent
        );

}

.v2-hero h1 {

    max-width: 670px;

    color: #f7fbfc;

    font-family: "Space Grotesk", sans-serif;

    font-size: clamp(
            55px,
            5.2vw,
            80px
        );

    line-height: .96;

    letter-spacing: -4.4px;

    font-weight: 600;

}

.v2-hero h1 span {

    display: block;

    margin-top: 11px;

    color: transparent;

    background: linear-gradient(
            100deg,
            #eefcff,
            #a8efff 28%,
            #61dcf8 66%,
            #baf5ff
        );

    background-size: 170% 100%;

    background-clip: text;

    -webkit-background-clip: text;

    animation: v2HeroText 7s ease-in-out infinite alternate;

}

@keyframes v2HeroText {

    from {

        background-position: 0% 50%;

    }

    to {

        background-position: 100% 50%;

    }

}

.v2-hero-description {

    max-width: 580px;

    margin-top: 28px;

    color: #849399;

    font-size: 14px;

    line-height: 1.85;

}

/* BUTTONS */

.v2-hero-actions {

    margin-top: 35px;

    display: flex;

    gap: 11px;

}

.v2-button {

    position: relative;

    min-height: 55px;

    padding: 0 22px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 18px;

    overflow: hidden;

    border-radius: 11px;

    font-size: 10px;

    font-weight: 800;

    transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease;

}

.v2-button b {

    font-size: 15px;

}

.v2-button-primary {

    color: #041014;

    background: linear-gradient(
            135deg,
            #bdf7ff,
            #61dffb
        );

    box-shadow: 0 13px 36px rgba(73,217,250,.16);

}

.v2-button-primary:hover {

    transform: translateY(-3px);

    box-shadow: 0 18px 47px rgba(73,217,250,.24);

}

.v2-button-secondary {

    color: #ccd8db;

    border: 1px solid rgba(255,255,255,.085);

    background: rgba(255,255,255,.025);

}

.v2-button-secondary:hover {

    transform: translateY(-3px);

    border-color: rgba(111,227,251,.22);

}

/* HERO META */

.v2-hero-meta {

    max-width: 580px;

    margin-top: 44px;

    padding-top: 23px;

    display: grid;

    grid-template-columns: repeat(3,1fr);

    border-top: 1px solid rgba(255,255,255,.055);

}

.v2-hero-meta > div {

    display: flex;

    align-items: center;

    gap: 11px;

}

.v2-hero-meta span {

    color: #536970;

    font-family: "Space Grotesk", sans-serif;

    font-size: 7px;

}

.v2-hero-meta p {

    display: flex;

    flex-direction: column;

    color: #65767c;

    font-size: 8px;

    line-height: 1.45;

}

.v2-hero-meta strong {

    color: #a5b5ba;

    font-weight: 700;

}

/* TK CORE STAGE */

.v2-core-stage {

    position: relative;

    z-index: 8;

    width: 520px;

    height: 520px;

    margin-inline: auto;

    display: grid;

    place-items: center;

    perspective: 1400px;

    transform-style: preserve-3d;

    overflow: visible;

}

/* CORE BACKLIGHT */

.v2-core-backlight {

    position: absolute;

    width: 310px;

    height: 310px;

    border-radius: 50%;

    background: radial-gradient(
            circle,
            rgba(98,230,255,.22) 0%,
            rgba(98,230,255,.11) 38%,
            rgba(98,230,255,0) 74%
        );

    filter: blur(42px);

    animation: v2Backlight 6s ease-in-out infinite;

}

@keyframes v2Backlight {

    0%, 100% {

        opacity: .6;

        transform: scale(.9);

    }

    50% {

        opacity: 1;

        transform: scale(1.08);

    }

}

/* RINGS */

.v2-core-ring {

    position: absolute;

    border-radius: 50%;

    pointer-events: none;

}

.v2-ring-1 {

    width: 330px;

    height: 330px;

    border: 1px solid rgba(111,227,251,.11);

    animation: v2RingCW 32s linear infinite;

}

.v2-ring-2 {

    width: 405px;

    height: 405px;

    border: 1px dashed rgba(111,227,251,.075);

    animation: v2RingCCW 45s linear infinite;

}

.v2-ring-3 {

    width: 485px;

    height: 485px;

    border: 1px dotted rgba(111,227,251,.045);

    animation: v2RingCW 68s linear infinite;

}

.v2-ring-1::before, .v2-ring-2::before, .v2-ring-3::before {

    content: "";

    position: absolute;

    border-radius: 50%;

    background: #83ecff;

    box-shadow: 0 0 8px rgba(131,236,255,.9), 0 0 22px rgba(131,236,255,.35);

}

.v2-ring-1::before {

    width: 6px;

    height: 6px;

    left: -3px;

    top: 50%;

}

.v2-ring-2::before {

    width: 5px;

    height: 5px;

    top: -3px;

    left: 50%;

}

.v2-ring-3::before {

    width: 4px;

    height: 4px;

    right: 11%;

    bottom: 13%;

}

@keyframes v2RingCW {

    to {

        transform: rotate(360deg);

    }

}

@keyframes v2RingCCW {

    to {

        transform: rotate(-360deg);

    }

}

/* LOGO DEVICE */

.v2-logo-device {

    position: relative;

    z-index: 20;

    width: 275px;

    height: 275px;

    padding: 11px;

    overflow: hidden;

    border: 1px solid rgba(125,232,255,.22);

    border-radius: 31px;

    background: rgba(5,10,12,.78);

    box-shadow: 0 48px 110px rgba(0,0,0,.58), 0 0 90px rgba(65,218,252,.08), inset 0 1px 0 rgba(255,255,255,.055);

    transform: perspective(1200px) rotateY(-4deg) rotateX(2deg);

    transition: transform .2s ease-out;

}

.v2-logo-device img {

    position: relative;

    z-index: 2;

    width: 100%;

    height: 100%;

    object-fit: cover;

    border-radius: 23px;

    filter: saturate(.86) brightness(.88) contrast(1.07);

}

.v2-device-glow {

    position: absolute;

    z-index: 1;

    inset: 25px;

    background: rgba(72,220,252,.14);

    filter: blur(55px);

}

.v2-device-scan {

    position: absolute;

    z-index: 5;

    left: 10%;

    right: 10%;

    top: 18%;

    height: 1px;

    opacity: 0;

    pointer-events: none;

    background: linear-gradient(
            90deg,
            transparent,
            #a4f2ff,
            transparent
        );

    box-shadow: 0 0 13px rgba(111,227,251,.8);

    animation: v2Scanner 5s ease-in-out infinite;

}

@keyframes v2Scanner {

    0%, 12% {

        top: 16%;

        opacity: 0;

    }

    30% {

        opacity: .5;

    }

    75% {

        opacity: .35;

    }

    90%, 100% {

        top: 84%;

        opacity: 0;

    }

}

.v2-device-status {

    position: absolute;

    z-index: 6;

    left: 50%;

    bottom: 17px;

    transform: translateX(-50%);

    padding: 7px 10px;

    display: flex;

    align-items: center;

    gap: 7px;

    color: #91a7ad;

    border: 1px solid rgba(255,255,255,.075);

    border-radius: 7px;

    background: rgba(3,7,8,.73);

    backdrop-filter: blur(12px);

    font-size: 6px;

    font-weight: 800;

    letter-spacing: 1.5px;

    white-space: nowrap;

}

.v2-device-status span {

    width: 5px;

    height: 5px;

    border-radius: 50%;

    background: #65e9b9;

    box-shadow: 0 0 8px rgba(101,233,185,.8);

}

/* SERVICE NODES */

.v2-service-node {

    position: absolute;

    left: 50%;

    top: 50%;

    z-index: 12;

    min-width: 138px;

    padding: 9px 11px;

    display: flex;

    align-items: center;

    gap: 9px;

    border: 1px solid rgba(111,227,251,.13);

    border-radius: 10px;

    background: rgba(5,10,12,.78);

    backdrop-filter: blur(17px);

    -webkit-backdrop-filter: blur(17px);

    box-shadow: 0 14px 35px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.025);

    transition: border-color .3s ease, background .3s ease, box-shadow .3s ease;

    will-change: transform;

}

.v2-service-node:hover {

    border-color: rgba(111,227,251,.34);

    background: rgba(9,20,23,.91);

    box-shadow: 0 18px 42px rgba(0,0,0,.4), 0 0 18px rgba(111,227,251,.08);

}

.v2-service-node > span {

    width: 27px;

    height: 27px;

    display: grid;

    place-items: center;

    flex-shrink: 0;

    color: #76e7ff;

    border: 1px solid rgba(111,227,251,.12);

    border-radius: 7px;

    background: rgba(111,227,251,.025);

    font-family: "Space Grotesk", sans-serif;

    font-size: 7px;

}

.v2-service-node > div {

    display: flex;

    flex-direction: column;

    gap: 2px;

}

.v2-service-node small {

    color: #455b62;

    font-size: 5.5px;

    font-weight: 800;

    letter-spacing: 1.2px;

}

.v2-service-node strong {

    color: #cad9dc;

    font-size: 8px;

    white-space: nowrap;

}

@keyframes v2NodeFloat {

    0%, 100% {

        translate: 0 0;

    }

    50% {

        translate: 0 -7px;

    }

}

/* PANEL CODE */

.v2-panel-code {

    position: absolute;

    z-index: 3;

    right: 26px;

    bottom: 19px;

    color: rgba(103,128,136,.5);

    font-family: "Space Grotesk", sans-serif;

    font-size: 6px;

    letter-spacing: 2px;

}

/* TABLET */

@media (max-width: 1050px) {

    .v2-service-node {

        display: none;

    }

    .v2-nav-links, .v2-nav-cta {

        display: none;

    }

    .v2-menu-button {

        display: block;

    }

    .v2-hero-panel {

        grid-template-columns: 1fr;

        gap: 50px;

        padding: 70px 55px;

    }

    .v2-hero-content {

        max-width: 720px;

    }

    .v2-core-stage {

        margin-top: 10px;

    }

}

/* MOBILE */

@media (max-width: 650px) {

    .v2-shell {

        width: min(
                100% - 30px,
                var(--shell)
            );

    }

    .v2-nav {

        min-height: 78px;

    }

    .v2-brand-mark {

        width: 42px;

        height: 42px;

    }

    .v2-brand-copy small {

        display: none;

    }

    .v2-hero {

        padding: 95px 0 30px;

    }

    .v2-hero-panel {

        min-height: auto;

        padding: 42px 23px 38px;

        border-radius: 23px;

        gap: 35px;

    }

    .v2-kicker {

        font-size: 6.5px;

        letter-spacing: 1.3px;

    }

    .v2-kicker i {

        display: none;

    }

    .v2-hero h1 {

        font-size: clamp(
                44px,
                13vw,
                60px
            );

        line-height: .98;

        letter-spacing: -3px;

    }

    .v2-hero-description {

        font-size: 13px;

    }

    .v2-hero-actions {

        flex-direction: column;

    }

    .v2-button {

        width: 100%;

    }

    .v2-hero-meta {

        grid-template-columns: 1fr;

        gap: 15px;

    }

    .v2-core-stage {

        width: 100%;

        height: 360px;

    }

    .v2-logo-device {

        width: 215px;

        height: 215px;

        border-radius: 25px;

    }

    .v2-ring-1 {

        width: 265px;

        height: 265px;

    }

    .v2-ring-2 {

        width: 320px;

        height: 320px;

    }

    .v2-ring-3 {

        display: none;

    }

    .v2-service-node {

        display: none;

    }

    .v2-device-status {

        font-size: 5px;

    }

}

/* REDUCED MOTION */

@media (
    prefers-reduced-motion:
    reduce
) {

    *, *::before, *::after {

        animation-duration: .01ms !important;

        animation-iteration-count: 1 !important;

    }

}

/* V3 / LIGHT DEFAULT + DARK MODE */

:root {

    --bg: #f4f8fa;

    --panel: #ffffff;

    --cyan: #168da8;

    --cyan-bright: #5dd5ee;

    --text: #132127;

    --muted: #66777e;

    --border: rgba(16, 73, 87, .12);

    --border-cyan: rgba(22, 141, 168, .18);

    color-scheme: light;

}

html[data-theme="dark"] {

    --bg: #030607;

    --panel: #070c0f;

    --cyan: #6fe3fb;

    --cyan-bright: #baf5ff;

    --text: #f3f8f9;

    --muted: #7a8b91;

    --border: rgba(255,255,255,.07);

    --border-cyan: rgba(111,227,251,.16);

    color-scheme: dark;

}

body {

    background: var(--bg);

    color: var(--text);

    transition: background-color .35s ease, color .35s ease;

}

.v2-page-atmosphere {

    background: #f4f8fa;

    transition: background-color .35s ease;

}

.v2-aurora-one {

    background: rgba(42, 182, 214, .16);

}

.v2-aurora-two {

    background: rgba(81, 176, 199, .10);

}

.v2-aurora-three {

    background: rgba(92, 222, 251, .12);

}

.v2-grid {

    opacity: .22;

    background-image: linear-gradient(rgba(18, 110, 132, .055) 1px, transparent 1px), linear-gradient(90deg, rgba(18, 110, 132, .055) 1px, transparent 1px);

}

.v2-noise {

    opacity: .08;

    background-image: repeating-linear-gradient(
            0deg,
            rgba(8, 48, 58, .012) 0,
            rgba(8, 48, 58, .012) 1px,
            transparent 1px,
            transparent 4px
        );

}

.v2-header.scrolled {

    border-bottom: 1px solid rgba(22, 141, 168, .12);

    background: rgba(248, 252, 253, .88);

    box-shadow: 0 12px 40px rgba(25, 67, 77, .06);

}

.v2-brand-mark {

    color: #117e97;

    border-color: rgba(22, 141, 168, .24);

    background: linear-gradient(145deg, rgba(22,141,168,.10), rgba(255,255,255,.84));

    box-shadow: inset 0 0 25px rgba(22,141,168,.05);

}

.v2-brand-copy strong {

    color: #132127;

}

.v2-brand-copy small {

    color: #77878d;

}

.v2-nav-links a {

    color: #627178;

}

.v2-nav-links a:hover {

    color: #122027;

}

/* Theme switch */

.v2-theme-toggle {

    position: relative;

    width: 68px;

    height: 36px;

    padding: 0 8px;

    flex: 0 0 auto;

    display: inline-flex;

    align-items: center;

    justify-content: space-between;

    border: 1px solid rgba(22, 141, 168, .18);

    border-radius: 999px;

    background: rgba(255,255,255,.72);

    box-shadow: 0 8px 26px rgba(28, 76, 88, .07), inset 0 1px 0 rgba(255,255,255,.9);

    color: #607178;

    cursor: pointer;

    transition: border-color .25s ease, background .25s ease, box-shadow .25s ease;

}

.v2-theme-toggle:hover {

    border-color: rgba(22, 141, 168, .32);

    box-shadow: 0 10px 30px rgba(28, 76, 88, .10), inset 0 1px 0 rgba(255,255,255,.9);

}

.v2-theme-toggle i {

    position: absolute;

    z-index: 1;

    left: 4px;

    top: 4px;

    width: 28px;

    height: 28px;

    border-radius: 50%;

    background: linear-gradient(145deg, #ffffff, #e3f5f9);

    box-shadow: 0 4px 12px rgba(26, 85, 99, .18);

    transition: transform .3s var(--ease), background .3s ease;

}

.v2-theme-icon {

    position: relative;

    z-index: 2;

    width: 18px;

    text-align: center;

    font-size: 13px;

    line-height: 1;

    transition: opacity .25s ease, color .25s ease;

}

.v2-theme-icon-light {

    color: #0e7188;

}

.v2-theme-icon-dark {

    color: #89979c;

}

html[data-theme="dark"] .v2-theme-toggle i {

    transform: translateX(32px);

    background: linear-gradient(145deg, #193039, #091216);

}

html[data-theme="dark"] .v2-theme-icon-light {

    color: #65767c;

}

html[data-theme="dark"] .v2-theme-icon-dark {

    color: #baf5ff;

}

/* Light hero */

.v2-hero-panel {

    border-color: rgba(24, 137, 162, .14);

    background: radial-gradient(circle at 72% 48%, rgba(56, 202, 233, .18) 0%, rgba(56, 202, 233, .08) 23%, rgba(56, 202, 233, 0) 58%), radial-gradient(circle at 18% 85%, rgba(54, 150, 174, .09) 0%, rgba(54, 150, 174, 0) 44%), linear-gradient(145deg, rgba(255,255,255,.98), rgba(238,246,248,.98));

    box-shadow: 0 45px 110px rgba(23, 70, 82, .12), 0 0 75px rgba(57,210,246,.04), inset 0 1px 0 rgba(255,255,255,.94);

}

.v2-circuit-lines {

    opacity: .24;

}

.v2-panel-light {

    opacity: .62;

    background: radial-gradient(circle, rgba(46,180,208,.20) 0%, rgba(46,180,208,.08) 38%, rgba(46,180,208,0) 72%);

}

.v2-kicker {

    color: #687980;

}

.v2-kicker-dot {

    background: #169bb9;

    box-shadow: 0 0 7px rgba(22,155,185,.65), 0 0 18px rgba(22,155,185,.24);

}

.v2-hero h1 {

    color: #132127;

}

.v2-hero h1 span {

    background: linear-gradient(100deg, #19343c, #1689a3 34%, #36b7d2 68%, #0d687c);

    background-size: 170% 100%;

    background-clip: text;

    -webkit-background-clip: text;

}

.v2-hero-description {

    color: #5f7178;

}

.v2-button-secondary {

    color: #26393f;

    border-color: rgba(18, 95, 113, .14);

    background: rgba(255,255,255,.62);

    box-shadow: inset 0 1px 0 rgba(255,255,255,.88);

}

.v2-button-secondary:hover {

    border-color: rgba(22, 141, 168, .30);

    background: rgba(255,255,255,.92);

}

.v2-hero-meta {

    border-top-color: rgba(19, 83, 98, .10);

}

.v2-hero-meta span {

    color: #70838a;

}

.v2-hero-meta p {

    color: #74858c;

}

.v2-hero-meta strong {

    color: #2b4148;

}

.v2-core-backlight {

    background: radial-gradient(circle, rgba(58,193,221,.24) 0%, rgba(58,193,221,.10) 40%, rgba(58,193,221,0) 74%);

}

.v2-ring-1 {

    border-color: rgba(18, 128, 153, .20);

}

.v2-ring-2 {

    border-color: rgba(18, 128, 153, .14);

}

.v2-ring-3 {

    border-color: rgba(18, 128, 153, .10);

}

.v2-ring-1::before, .v2-ring-2::before, .v2-ring-3::before {

    background: #31b9d4;

    box-shadow: 0 0 8px rgba(49,185,212,.72), 0 0 22px rgba(49,185,212,.24);

}

/* Core stays intentionally darker for contrast */

.v2-logo-device {

    border-color: rgba(53, 190, 219, .28);

    background: rgba(8, 18, 22, .92);

    box-shadow: 0 35px 80px rgba(19, 60, 70, .20), 0 0 70px rgba(65,218,252,.10), inset 0 1px 0 rgba(255,255,255,.055);

}

/* Service cards: fixed layout + subtle micro movement */

.v2-service-node {

    border-color: rgba(18, 128, 153, .16);

    background: rgba(255,255,255,.86);

    box-shadow: 0 14px 35px rgba(28, 72, 82, .10), inset 0 1px 0 rgba(255,255,255,.9);

    animation: v2NodeFloat 5.4s ease-in-out infinite;

    will-change: translate;

}

.v2-service-node:hover {

    border-color: rgba(22, 141, 168, .34);

    background: rgba(255,255,255,.98);

    box-shadow: 0 18px 42px rgba(28, 72, 82, .14), 0 0 18px rgba(22,141,168,.08);

}

.v2-service-node > span {

    color: #10849e;

    border-color: rgba(22, 141, 168, .16);

    background: rgba(22,141,168,.045);

}

.v2-service-node small {

    color: #72858c;

}

.v2-service-node strong {

    color: #294047;

}

.v2-node-1 {

    transform: translate(-50%, -50%) translate(-202px, -144px);

    animation-delay: -1.0s;

}

.v2-node-2 {

    transform: translate(-50%, -50%) translate(190px, -150px);

    animation-delay: -2.8s;

}

.v2-node-3 {

    transform: translate(-50%, -50%) translate(235px, -34px);

    animation-delay: -4.1s;

}

.v2-node-4 {

    transform: translate(-50%, -50%) translate(194px, 132px);

    animation-delay: -1.8s;

}

.v2-node-5 {

    transform: translate(-50%, -50%) translate(-205px, 132px);

    animation-delay: -3.5s;

}

.v2-node-6 {

    transform: translate(-50%, -50%) translate(-242px, -20px);

    animation-delay: -.4s;

}

.v2-panel-code {

    color: rgba(65, 92, 100, .50);

}

/* Mobile menu now actually opens */

.v2-mobile-menu.active {

    display: block;

    margin: 0 15px;

    padding: 12px;

    border: 1px solid rgba(22,141,168,.14);

    border-radius: 18px;

    background: rgba(250,253,254,.96);

    box-shadow: 0 22px 60px rgba(28,72,82,.12);

    backdrop-filter: blur(18px);

    -webkit-backdrop-filter: blur(18px);

}

.v2-mobile-menu nav {

    display: grid;

    gap: 4px;

}

.v2-mobile-menu a {

    padding: 13px 14px;

    border-radius: 11px;

    color: #30474e;

    font-size: 12px;

    font-weight: 700;

}

.v2-mobile-menu a:hover {

    background: rgba(22,141,168,.06);

}

.v2-menu-button {

    border-color: rgba(20, 90, 106, .14);

    background: rgba(255,255,255,.62);

}

.v2-menu-button span {

    background: #334d54;

}

/* DARK THEME OVERRIDES */

html[data-theme="dark"] .v2-page-atmosphere {

    background: #030607;

}

html[data-theme="dark"] .v2-aurora-one {

    background: rgba(40, 183, 220, .12);

}

html[data-theme="dark"] .v2-aurora-two {

    background: rgba(52, 163, 197, .075);

}

html[data-theme="dark"] .v2-aurora-three {

    background: rgba(92, 222, 251, .055);

}

html[data-theme="dark"] .v2-grid {

    opacity: .13;

    background-image: linear-gradient(rgba(92,220,250,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(92,220,250,.04) 1px, transparent 1px);

}

html[data-theme="dark"] .v2-noise {

    opacity: .14;

    background-image: repeating-linear-gradient(0deg, rgba(255,255,255,.008) 0, rgba(255,255,255,.008) 1px, transparent 1px, transparent 4px);

}

html[data-theme="dark"] .v2-header.scrolled {

    border-bottom-color: rgba(111,227,251,.08);

    background: rgba(3,6,7,.82);

    box-shadow: none;

}

html[data-theme="dark"] .v2-brand-mark {

    color: #a9efff;

    border-color: rgba(111,227,251,.22);

    background: linear-gradient(145deg, rgba(111,227,251,.09), rgba(255,255,255,.012));

    box-shadow: inset 0 0 25px rgba(111,227,251,.04);

}

html[data-theme="dark"] .v2-brand-copy strong {

    color: #f3f8f9;

}

html[data-theme="dark"] .v2-brand-copy small {

    color: #617278;

}

html[data-theme="dark"] .v2-nav-links a {

    color: #87969b;

}

html[data-theme="dark"] .v2-nav-links a:hover {

    color: #fff;

}

html[data-theme="dark"] .v2-theme-toggle {

    border-color: rgba(111,227,251,.12);

    background: rgba(8,15,18,.78);

    box-shadow: inset 0 1px 0 rgba(255,255,255,.04);

}

html[data-theme="dark"] .v2-hero-panel {

    border-color: rgba(115,230,255,.12);

    background: radial-gradient(circle at 72% 48%, rgba(77,224,255,.16) 0%, rgba(77,224,255,.08) 18%, rgba(77,224,255,0) 56%), radial-gradient(circle at 18% 85%, rgba(36,120,145,.09) 0%, rgba(36,120,145,0) 42%), linear-gradient(145deg, rgba(8,14,17,.98), rgba(2,6,8,.98));

    box-shadow: 0 65px 150px rgba(0,0,0,.58), 0 0 90px rgba(57,210,246,.03), inset 0 1px 0 rgba(255,255,255,.035);

}

html[data-theme="dark"] .v2-panel-light {

    opacity: .88;

    background: radial-gradient(circle, rgba(87,226,255,.18) 0%, rgba(87,226,255,.08) 36%, rgba(87,226,255,0) 72%);

}

html[data-theme="dark"] .v2-kicker {

    color: #7d8d92;

}

html[data-theme="dark"] .v2-kicker-dot {

    background: #7aeaff;

    box-shadow: 0 0 7px #7aeaff, 0 0 18px rgba(122,234,255,.55);

}

html[data-theme="dark"] .v2-hero h1 {

    color: #f7fbfc;

}

html[data-theme="dark"] .v2-hero h1 span {

    background: linear-gradient(100deg, #eefcff, #a8efff 28%, #61dcf8 66%, #baf5ff);

    background-size: 170% 100%;

    background-clip: text;

    -webkit-background-clip: text;

}

html[data-theme="dark"] .v2-hero-description {

    color: #849399;

}

html[data-theme="dark"] .v2-button-secondary {

    color: #ccd8db;

    border-color: rgba(255,255,255,.085);

    background: rgba(255,255,255,.025);

    box-shadow: none;

}

html[data-theme="dark"] .v2-button-secondary:hover {

    border-color: rgba(111,227,251,.22);

    background: rgba(255,255,255,.025);

}

html[data-theme="dark"] .v2-hero-meta {

    border-top-color: rgba(255,255,255,.055);

}

html[data-theme="dark"] .v2-hero-meta span {

    color: #536970;

}

html[data-theme="dark"] .v2-hero-meta p {

    color: #65767c;

}

html[data-theme="dark"] .v2-hero-meta strong {

    color: #a5b5ba;

}

html[data-theme="dark"] .v2-core-backlight {

    background: radial-gradient(circle, rgba(98,230,255,.22) 0%, rgba(98,230,255,.11) 38%, rgba(98,230,255,0) 74%);

}

html[data-theme="dark"] .v2-ring-1 {

    border-color: rgba(111,227,251,.11);

}

html[data-theme="dark"] .v2-ring-2 {

    border-color: rgba(111,227,251,.075);

}

html[data-theme="dark"] .v2-ring-3 {

    border-color: rgba(111,227,251,.045);

}

html[data-theme="dark"] .v2-ring-1::before, html[data-theme="dark"] .v2-ring-2::before, html[data-theme="dark"] .v2-ring-3::before {

    background: #83ecff;

    box-shadow: 0 0 8px rgba(131,236,255,.9), 0 0 22px rgba(131,236,255,.35);

}

html[data-theme="dark"] .v2-logo-device {

    border-color: rgba(125,232,255,.22);

    background: rgba(5,10,12,.78);

    box-shadow: 0 48px 110px rgba(0,0,0,.58), 0 0 90px rgba(65,218,252,.08), inset 0 1px 0 rgba(255,255,255,.055);

}

html[data-theme="dark"] .v2-service-node {

    border-color: rgba(111,227,251,.13);

    background: rgba(5,10,12,.78);

    box-shadow: 0 14px 35px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.025);

}

html[data-theme="dark"] .v2-service-node:hover {

    border-color: rgba(111,227,251,.34);

    background: rgba(9,20,23,.91);

    box-shadow: 0 18px 42px rgba(0,0,0,.4), 0 0 18px rgba(111,227,251,.08);

}

html[data-theme="dark"] .v2-service-node > span {

    color: #76e7ff;

    border-color: rgba(111,227,251,.12);

    background: rgba(111,227,251,.025);

}

html[data-theme="dark"] .v2-service-node small {

    color: #455b62;

}

html[data-theme="dark"] .v2-service-node strong {

    color: #cad9dc;

}

html[data-theme="dark"] .v2-panel-code {

    color: rgba(103,128,136,.5);

}

html[data-theme="dark"] .v2-mobile-menu.active {

    border-color: rgba(111,227,251,.10);

    background: rgba(5,10,12,.96);

    box-shadow: 0 22px 60px rgba(0,0,0,.36);

}

html[data-theme="dark"] .v2-mobile-menu a {

    color: #cad9dc;

}

html[data-theme="dark"] .v2-mobile-menu a:hover {

    background: rgba(111,227,251,.05);

}

html[data-theme="dark"] .v2-menu-button {

    border-color: var(--border);

    background: rgba(255,255,255,.02);

}

html[data-theme="dark"] .v2-menu-button span {

    background: #d3e2e6;

}

@media (max-width: 1050px) {

    .v2-theme-toggle {

        margin-left: auto;

    }

}

@media (max-width: 650px) {

    .v2-theme-toggle {

        width: 62px;

        height: 34px;

    }

    .v2-theme-toggle i {

        width: 26px;

        height: 26px;

    }

    html[data-theme="dark"] .v2-theme-toggle i {

        transform: translateX(28px);

    }

}

/* TK TECH - READABILITY + LAYOUT BALANCE */

/* HEADER */

.v2-brand-copy strong {

    font-size: 17px;

    letter-spacing: 1.8px;

}

.v2-brand-copy small {

    font-size: 8px;

    letter-spacing: 1.6px;

}

.v2-nav-links a {

    font-size: 12px;

    font-weight: 700;

}

.v2-nav-cta {

    min-height: 48px;

    padding: 0 22px;

    font-size: 11px;

}

/* HERO */

.v2-hero-content {

    position: relative;

    z-index: 20;

    max-width: 610px;

}

.v2-kicker {

    font-size: 8.5px;

    letter-spacing: 2px;

}

/* MAIN TITLE */

.v2-hero h1 {

    max-width: 610px;

    font-size: clamp(
        58px,
        4.65vw,
        78px
    );

    line-height: 1.04;

    letter-spacing: -3px;

    font-weight: 700;

}

/* Başlıktaki gradient alanını block yapıyoruz. Bu hem son harflerdeki görüntü hatasını giderir hem de sağ tarafa taşmayı önler. */

.v2-hero h1 span {

    display: block;

    width: 100%;

    max-width: 610px;

    margin-top: 10px;

    padding-right: 8px;

    padding-bottom: 6px;

    overflow: visible;

    color: transparent;

    -webkit-text-fill-color: transparent;

    background: linear-gradient(
            100deg,
            #19343c 0%,
            #1689a3 34%,
            #36b7d2 68%,
            #0d687c 100%
        );

    background-size: 170% 100%;

    background-clip: text;

    -webkit-background-clip: text;

}

/* DARK MODE TITLE */

html[data-theme="dark"] .v2-hero h1 span {

    background: linear-gradient(
            100deg,
            #eefcff,
            #a8efff 28%,
            #61dcf8 66%,
            #baf5ff
        );

    background-size: 170% 100%;

    background-clip: text;

    -webkit-background-clip: text;

}

/* DESCRIPTION */

.v2-hero-description {

    max-width: 590px;

    margin-top: 27px;

    font-size: 16px;

    line-height: 1.8;

}

/* BUTTONS */

.v2-hero-actions {

    margin-top: 31px;

}

.v2-button {

    min-height: 55px;

    padding: 0 22px;

    gap: 16px;

    font-size: 11px;

}

/* HERO META */

.v2-hero-meta {

    max-width: 570px;

    margin-top: 39px;

    padding-top: 21px;

}

.v2-hero-meta span {

    font-size: 7.5px;

}

.v2-hero-meta p {

    font-size: 9px;

    line-height: 1.5;

}

.v2-hero-meta strong {

    font-size: 9px;

}

/* SERVICE CARDS */

.v2-service-node {

    min-width: 148px;

    padding: 10px 11px;

    gap: 9px;

}

.v2-service-node > span {

    width: 29px;

    height: 29px;

    font-size: 7.5px;

}

.v2-service-node small {

    font-size: 6px;

    letter-spacing: 1.1px;

}

.v2-service-node strong {

    font-size: 9px;

}

/* DESKTOP LAYOUT FIX */

@media (min-width: 1051px) {

    /* Sol yazı ve sağ TK Core alanının birbirine girmesini engelliyoruz. */

    .v2-hero-panel {

        grid-template-columns: minmax(0, 1.02fr) minmax(480px, .98fr);

        gap: 42px;

        padding: 72px 58px 68px 60px;

    }

    .v2-hero-content {

        max-width: 610px;

    }

    /* Kartları merkeze biraz daha yaklaştırıyoruz. Özellikle soldaki 06 kartının başlığın üzerine gelmesini engelliyor. */

    .v2-node-1 {

        transform: translate(-50%, -50%) translate(-185px, -145px);

    }

    .v2-node-2 {

        transform: translate(-50%, -50%) translate(180px, -148px);

    }

    .v2-node-3 {

        transform: translate(-50%, -50%) translate(215px, -30px);

    }

    .v2-node-4 {

        transform: translate(-50%, -50%) translate(180px, 130px);

    }

    .v2-node-5 {

        transform: translate(-50%, -50%) translate(-185px, 130px);

    }

    .v2-node-6 {

        transform: translate(-50%, -50%) translate(-205px, -18px);

    }

}

/* TABLET */

@media (max-width: 1050px) {

    .v2-hero-panel {

        grid-template-columns: 1fr;

        padding: 65px 50px;

        gap: 45px;

    }

    .v2-hero h1 {

        max-width: 720px;

        font-size: clamp(
            54px,
            8vw,
            72px
        );

        line-height: 1.04;

        letter-spacing: -2.6px;

    }

    .v2-hero h1 span {

        max-width: 720px;

    }

    .v2-hero-description {

        max-width: 650px;

        font-size: 16px;

    }

}

/* MOBILE */

@media (max-width: 650px) {

    .v2-brand-copy strong {

        font-size: 15px;

    }

    .v2-kicker {

        font-size: 7px;

        letter-spacing: 1.3px;

    }

    .v2-hero h1 {

        max-width: 100%;

        font-size: clamp(
            43px,
            12vw,
            57px
        );

        line-height: 1.04;

        letter-spacing: -2px;

    }

    .v2-hero h1 span {

        max-width: 100%;

        margin-top: 8px;

        padding-right: 4px;

        padding-bottom: 4px;

    }

    .v2-hero-description {

        font-size: 14px;

        line-height: 1.7;

    }

    .v2-button {

        min-height: 54px;

        font-size: 11px;

    }

    .v2-hero-meta span {

        font-size: 7px;

    }

    .v2-hero-meta p, .v2-hero-meta strong {

        font-size: 9px;

    }

}

/* SERVICES SECTION */

.v2-services {

    position: relative;

    padding: 135px 0 145px;

    scroll-margin-top: 90px;

}

/* SECTION HEADER */

.v2-services-head {

    margin-bottom: 55px;

}

.v2-section-kicker {

    display: flex;

    align-items: center;

    gap: 12px;

    margin-bottom: 24px;

    color: #6f8188;

    font-size: 9px;

    font-weight: 800;

    letter-spacing: 2.2px;

}

.v2-section-kicker span {

    display: grid;

    place-items: center;

    width: 30px;

    height: 30px;

    color: #128ca6;

    border: 1px solid rgba(22,141,168,.16);

    border-radius: 8px;

    background: rgba(255,255,255,.55);

    font-family: "Space Grotesk", sans-serif;

    font-size: 8px;

}

.v2-section-kicker i {

    display: block;

    width: 38px;

    height: 1px;

    background: linear-gradient(
            90deg,
            #1ba8c7,
            transparent
        );

}

.v2-services-head-grid {

    display: grid;

    grid-template-columns: minmax(0, 1.15fr) minmax(300px, .55fr);

    align-items: end;

    gap: 70px;

}

.v2-services-head h2 {

    max-width: 790px;

    color: #14242a;

    font-family: "Space Grotesk", sans-serif;

    font-size: clamp(
            48px,
            5vw,
            72px
        );

    line-height: 1;

    letter-spacing: -3.3px;

    font-weight: 600;

}

.v2-services-head h2 span {

    display: block;

    margin-top: 7px;

    color: #168ca6;

}

.v2-services-head-grid > p {

    max-width: 430px;

    padding-bottom: 5px;

    color: #64777e;

    font-size: 15px;

    line-height: 1.8;

}

/* BENTO GRID */

.v2-services-grid {

    display: grid;

    grid-template-columns: repeat(12, 1fr);

    gap: 18px;

}

/* CARD BASE */

.v2-service-card {

    position: relative;

    min-height: 300px;

    padding: 30px;

    overflow: hidden;

    border: 1px solid rgba(18, 116, 139, .12);

    border-radius: 25px;

    background: linear-gradient(
            145deg,
            rgba(255,255,255,.88),
            rgba(239,247,249,.82)
        );

    box-shadow: 0 20px 60px rgba(34, 77, 88, .055), inset 0 1px 0 rgba(255,255,255,.9);

    transition: transform .35s var(--ease), border-color .35s ease, box-shadow .35s ease;

}

transform: translateY(-7px) perspective(900px) rotateX(var(--tk-tilt-x, 0deg)) rotateY(var(--tk-tilt-y, 0deg));

/* GRID SIZES */

.v2-service-card-technical {

    grid-column: span 7;

    min-height: 390px;

    padding: 38px;

}

.v2-service-card-system {

    grid-column: span 5;

    min-height: 390px;

    padding: 38px;

}

.v2-services-grid > .v2-service-card:nth-child(3), .v2-services-grid > .v2-service-card:nth-child(4), .v2-services-grid > .v2-service-card:nth-child(5) {

    grid-column: span 4;

}

.v2-service-card-growth {

    grid-column: 1 /-1;

    min-height: 250px;

    padding: 38px 42px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 60px;

}

/* CARD TOP */

.v2-service-card-top {

    position: relative;

    z-index: 5;

    display: flex;

    align-items: center;

    gap: 10px;

    margin-bottom: 38px;

}

.v2-card-number {

    display: grid;

    place-items: center;

    width: 32px;

    height: 32px;

    flex-shrink: 0;

    color: #1187a0;

    border: 1px solid rgba(22,141,168,.18);

    border-radius: 8px;

    background: rgba(22,141,168,.045);

    font-family: "Space Grotesk", sans-serif;

    font-size: 8px;

    font-weight: 700;

}

.v2-card-category {

    color: #7b8d93;

    font-size: 7px;

    font-weight: 800;

    letter-spacing: 1.8px;

}

/* CARD CONTENT */

.v2-card-content {

    position: relative;

    z-index: 5;

}

.v2-card-content h3 {

    max-width: 500px;

    color: #17282e;

    font-family: "Space Grotesk", sans-serif;

    font-size: clamp(
            27px,
            2.3vw,
            38px
        );

    line-height: 1.05;

    letter-spacing: -1.4px;

    font-weight: 600;

}

.v2-card-content p {

    max-width: 490px;

    margin-top: 18px;

    color: #697c83;

    font-size: 14px;

    line-height: 1.75;

}

/* SERVICE TAGS */

.v2-service-tags {

    position: relative;

    z-index: 5;

    display: flex;

    flex-wrap: wrap;

    gap: 7px;

    max-width: 400px;

    margin-top: 27px;

}

.v2-service-tags span {

    padding: 7px 10px;

    color: #50666e;

    border: 1px solid rgba(20,110,130,.10);

    border-radius: 999px;

    background: rgba(255,255,255,.58);

    font-size: 8px;

    font-weight: 700;

}

/* TECH CARD VISUAL */

.v2-card-visual-tech {

    position: absolute;

    right: -20px;

    bottom: -70px;

    width: 340px;

    height: 340px;

    opacity: .85;

}

.v2-tech-ring {

    position: absolute;

    left: 50%;

    top: 50%;

    border: 1px solid rgba(20,155,184,.13);

    border-radius: 50%;

    transform: translate(-50%, -50%);

}

.v2-tech-ring:nth-child(1) {

    width: 280px;

    height: 280px;

    border-style: dashed;

    animation: v2ServiceRing 28s linear infinite;

}

.v2-tech-ring:nth-child(2) {

    width: 205px;

    height: 205px;

    animation: v2ServiceRingReverse 22s linear infinite;

}

.v2-tech-core {

    position: absolute;

    left: 50%;

    top: 50%;

    width: 105px;

    height: 105px;

    display: grid;

    place-items: center;

    transform: translate(-50%, -50%) rotate(-8deg);

    color: #34bedb;

    border: 1px solid rgba(28,171,201,.23);

    border-radius: 28px;

    background: linear-gradient(
            145deg,
            rgba(14,48,58,.96),
            rgba(4,17,21,.98)
        );

    box-shadow: 0 25px 60px rgba(28,135,158,.20), 0 0 50px rgba(45,190,219,.12);

    font-family: "Space Grotesk", sans-serif;

    font-size: 25px;

    font-weight: 700;

}

@keyframes v2ServiceRing {

    to {

        transform: translate(-50%, -50%) rotate(360deg);

    }

}

@keyframes v2ServiceRingReverse {

    to {

        transform: translate(-50%, -50%) rotate(-360deg);

    }

}

/* SYSTEM DECORATION */

.v2-service-card-system::before {

    content: "";

    position: absolute;

    width: 330px;

    height: 330px;

    right: -130px;

    bottom: -130px;

    border-radius: 50%;

    background: radial-gradient(
            circle,
            rgba(39,188,219,.18),
            rgba(39,188,219,.05) 40%,
            transparent 70%
        );

    filter: blur(10px);

}

.v2-service-line {

    position: absolute;

    left: 38px;

    right: 38px;

    bottom: 37px;

    height: 1px;

    overflow: visible;

    background: linear-gradient(
            90deg,
            rgba(25,139,164,.10),
            rgba(25,139,164,.45),
            rgba(25,139,164,.10)
        );

}

.v2-service-line::after {

    content: "";

    position: absolute;

    top: -3px;

    left: 25%;

    width: 7px;

    height: 7px;

    border-radius: 50%;

    background: #29b5d2;

    box-shadow: 0 0 18px rgba(41,181,210,.75);

}

/* SMALL CARD ARROW */

.v2-card-arrow {

    position: absolute;

    right: 26px;

    bottom: 24px;

    width: 38px;

    height: 38px;

    display: grid;

    place-items: center;

    color: #168ca6;

    border: 1px solid rgba(22,141,168,.13);

    border-radius: 50%;

    background: rgba(255,255,255,.58);

    font-size: 14px;

    transition: transform .3s var(--ease), background .3s ease;

}

.v2-service-card:hover .v2-card-arrow {

    transform: rotate(45deg);

    background: rgba(255,255,255,.92);

}

/* GROWTH CARD */

.v2-growth-left {

    max-width: 520px;

}

.v2-service-card-growth .v2-service-card-top {

    margin-bottom: 22px;

}

.v2-growth-stats {

    min-width: 520px;

    display: grid;

    grid-template-columns: 1fr auto 1fr auto 1fr;

    align-items: center;

    gap: 24px;

    padding: 27px 30px;

    border: 1px solid rgba(21,132,157,.11);

    border-radius: 20px;

    background: rgba(255,255,255,.45);

}

.v2-growth-stats div {

    display: flex;

    flex-direction: column;

    gap: 5px;

}

.v2-growth-stats span {

    color: #829399;

    font-size: 7px;

    font-weight: 800;

    letter-spacing: 1.7px;

}

.v2-growth-stats strong {

    color: #20363d;

    font-family: "Space Grotesk", sans-serif;

    font-size: 16px;

}

.v2-growth-stats i {

    width: 1px;

    height: 40px;

    background: rgba(23,117,139,.10);

}

/* SERVICES FOOTER */

.v2-services-footer {

    margin-top: 28px;

    padding: 22px 3px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 30px;

}

.v2-services-footer > div {

    display: flex;

    align-items: center;

    gap: 10px;

}

.v2-services-footer-dot {

    width: 7px;

    height: 7px;

    flex-shrink: 0;

    border-radius: 50%;

    background: #28b7d3;

    box-shadow: 0 0 13px rgba(40,183,211,.65);

}

.v2-services-footer p {

    color: #6a7d84;

    font-size: 13px;

}

.v2-services-footer > a {

    display: inline-flex;

    align-items: center;

    gap: 18px;

    color: #1e373e;

    font-size: 12px;

    font-weight: 800;

}

.v2-services-footer > a span {

    display: grid;

    place-items: center;

    width: 38px;

    height: 38px;

    color: #0b839d;

    border: 1px solid rgba(22,141,168,.15);

    border-radius: 50%;

    background: rgba(255,255,255,.52);

    transition: transform .3s var(--ease);

}

.v2-services-footer > a:hover span {

    transform: rotate(45deg);

}

/* SERVICES / DARK MODE */

html[data-theme="dark"] .v2-section-kicker {

    color: #657980;

}

html[data-theme="dark"] .v2-section-kicker span {

    color: #79e6fb;

    border-color: rgba(111,227,251,.13);

    background: rgba(111,227,251,.025);

}

html[data-theme="dark"] .v2-services-head h2 {

    color: #edf6f8;

}

html[data-theme="dark"] .v2-services-head h2 span {

    color: #67ddf7;

}

html[data-theme="dark"] .v2-services-head-grid > p {

    color: #829399;

}

html[data-theme="dark"] .v2-service-card {

    border-color: rgba(111,227,251,.085);

    background: linear-gradient(
            145deg,
            rgba(8,14,17,.94),
            rgba(3,8,10,.94)
        );

    box-shadow: 0 25px 70px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.025);

}

html[data-theme="dark"] .v2-service-card:hover {

    border-color: rgba(111,227,251,.21);

    box-shadow: 0 30px 80px rgba(0,0,0,.38), 0 0 28px rgba(75,210,241,.035);

}

html[data-theme="dark"] .v2-card-number {

    color: #74e6fc;

    border-color: rgba(111,227,251,.12);

    background: rgba(111,227,251,.025);

}

html[data-theme="dark"] .v2-card-category {

    color: #50656d;

}

html[data-theme="dark"] .v2-card-content h3 {

    color: #edf5f7;

}

html[data-theme="dark"] .v2-card-content p {

    color: #7c8d93;

}

html[data-theme="dark"] .v2-service-tags span {

    color: #819399;

    border-color: rgba(255,255,255,.055);

    background: rgba(255,255,255,.025);

}

html[data-theme="dark"] .v2-card-arrow {

    color: #73e4fb;

    border-color: rgba(111,227,251,.10);

    background: rgba(255,255,255,.025);

}

html[data-theme="dark"] .v2-service-card:hover .v2-card-arrow {

    background: rgba(111,227,251,.05);

}

html[data-theme="dark"] .v2-growth-stats {

    border-color: rgba(111,227,251,.07);

    background: rgba(255,255,255,.018);

}

html[data-theme="dark"] .v2-growth-stats strong {

    color: #dbe8eb;

}

html[data-theme="dark"] .v2-growth-stats span {

    color: #566a72;

}

html[data-theme="dark"] .v2-growth-stats i {

    background: rgba(255,255,255,.055);

}

html[data-theme="dark"] .v2-services-footer p {

    color: #71838a;

}

html[data-theme="dark"] .v2-services-footer > a {

    color: #d6e5e8;

}

html[data-theme="dark"] .v2-services-footer > a span {

    color: #78e6fb;

    border-color: rgba(111,227,251,.10);

    background: rgba(255,255,255,.02);

}

/* SERVICES / TABLET */

@media (max-width: 1050px) {

    .v2-services {

        padding: 105px 0 115px;

    }

    .v2-services-head-grid {

        grid-template-columns: 1fr;

        gap: 25px;

    }

    .v2-services-head-grid > p {

        max-width: 620px;

    }

    .v2-service-card-technical, .v2-service-card-system {

        grid-column: span 6;

    }

    .v2-services-grid > .v2-service-card:nth-child(3), .v2-services-grid > .v2-service-card:nth-child(4), .v2-services-grid > .v2-service-card:nth-child(5) {

        grid-column: span 6;

    }

    .v2-services-grid > .v2-service-card:nth-child(5) {

        grid-column: 1 /-1;

    }

    .v2-service-card-growth {

        flex-direction: column;

        align-items: flex-start;

    }

    .v2-growth-stats {

        width: 100%;

        min-width: 0;

    }

}

/* SERVICES / MOBILE */

@media (max-width: 650px) {

    .v2-services {

        padding: 85px 0 90px;

    }

    .v2-services-head {

        margin-bottom: 35px;

    }

    .v2-section-kicker {

        font-size: 7.5px;

    }

    .v2-services-head h2 {

        font-size: clamp(
                40px,
                12vw,
                55px
            );

        line-height: 1.02;

        letter-spacing: -2.3px;

    }

    .v2-services-head-grid > p {

        font-size: 14px;

        line-height: 1.7;

    }

    .v2-services-grid {

        grid-template-columns: 1fr;

        gap: 13px;

    }

    .v2-service-card, .v2-service-card-technical, .v2-service-card-system, .v2-services-grid > .v2-service-card:nth-child(3), .v2-services-grid > .v2-service-card:nth-child(4), .v2-services-grid > .v2-service-card:nth-child(5), .v2-service-card-growth {

        grid-column: 1 /-1;

    }

    .v2-service-card {

        min-height: 270px;

        padding: 27px;

    }

    .v2-service-card-technical, .v2-service-card-system {

        min-height: 340px;

    }

    .v2-card-content h3 {

        font-size: 29px;

    }

    .v2-card-content p {

        font-size: 13px;

    }

    .v2-card-visual-tech {

        width: 250px;

        height: 250px;

        right: -70px;

        bottom: -80px;

        opacity: .55;

    }

    .v2-service-card-growth {

        padding: 28px;

        gap: 35px;

    }

    .v2-growth-stats {

        grid-template-columns: 1fr;

        gap: 18px;

        padding: 22px;

    }

    .v2-growth-stats i {

        width: 100%;

        height: 1px;

    }

    .v2-services-footer {

        align-items: flex-start;

        flex-direction: column;

        margin-top: 18px;

        padding-top: 20px;

    }

}

/* REFERENCES */

.v2-references {

    position: relative;

    padding: 135px 0 150px;

    overflow: hidden;

    scroll-margin-top: 90px;

}

/* REFERENCES HEADER */

.v2-references-head {

    margin-bottom: 52px;

}

.v2-references-head-grid {

    display: grid;

    grid-template-columns: minmax(0, 1.15fr) minmax(300px, .55fr);

    align-items: end;

    gap: 70px;

}

.v2-references-head h2 {

    max-width: 760px;

    color: #14242a;

    font-family: "Space Grotesk", sans-serif;

    font-size: clamp(
            48px,
            5vw,
            72px
        );

    line-height: 1;

    letter-spacing: -3.3px;

    font-weight: 600;

}

.v2-references-head h2 span {

    display: block;

    margin-top: 7px;

    color: #168ca6;

}

.v2-references-head-grid > p {

    max-width: 420px;

    padding-bottom: 5px;

    color: #64777e;

    font-size: 15px;

    line-height: 1.8;

}

/* PROJECT SLIDER */

.v2-ref-slider {

    position: relative;

    overflow: hidden;

    border: 1px solid rgba(18,116,139,.12);

    border-radius: 30px;

    background: rgba(255,255,255,.34);

    box-shadow: 0 35px 90px rgba(29,75,86,.075);

}

.v2-ref-track {

    display: flex;

    width: 100%;

    transition: transform .75s cubic-bezier(.22,.8,.22,1);

    will-change: transform;

    touch-action: pan-y;

}

.v2-ref-project {

    flex: 0 0 100%;

    min-width: 100%;

    padding: 22px;

    display: grid;

    grid-template-columns: minmax(0, 1.45fr) minmax(330px, .55fr);

    gap: 22px;

    opacity: .32;

    transition: opacity .45s ease;

}

.v2-ref-project.is-active {

    opacity: 1;

}

/* GALLERY */

.v2-ref-gallery {

    min-width: 0;

}

.v2-ref-gallery-stage {

    position: relative;

    aspect-ratio: 16 /10;

    overflow: hidden;

    border: 1px solid rgba(20,113,134,.12);

    border-radius: 23px;

    background: #dce9ec;

}

.v2-ref-images {

    position: absolute;

    inset: 0;

}

.v2-ref-image {

    position: absolute;

    inset: 0;

    margin: 0;

    opacity: 0;

    transform: scale(1.035);

    transition: opacity .55s ease, transform .8s cubic-bezier(.22,.8,.22,1);

    pointer-events: none;

}

.v2-ref-image.is-active {

    opacity: 1;

    transform: scale(1);

    pointer-events: auto;

}

.v2-ref-image img {

    width: 100%;

    height: 100%;

    object-fit: contain;

    object-position: center;

    cursor: zoom-in;

    transition: transform .35s ease, opacity .35s ease;

}

/* IMAGE NAVIGATION */

.v2-ref-image-arrow {

    position: absolute;

    z-index: 15;

    top: 50%;

    width: 46px;

    height: 46px;

    display: grid;

    place-items: center;

    transform: translateY(-50%);

    color: #152a31;

    border: 1px solid rgba(255,255,255,.72);

    border-radius: 50%;

    background: rgba(255,255,255,.83);

    box-shadow: 0 10px 30px rgba(20,54,62,.13);

    backdrop-filter: blur(12px);

    -webkit-backdrop-filter: blur(12px);

    cursor: pointer;

    font-size: 15px;

    transition: transform .25s ease, background .25s ease;

}

.v2-ref-image-arrow:hover {

    background: #fff;

}

.v2-ref-image-prev {

    left: 19px;

}

.v2-ref-image-next {

    right: 19px;

}

.v2-ref-image-prev:hover {

    transform: translateY(-50%) translateX(-3px);

}

.v2-ref-image-next:hover {

    transform: translateY(-50%) translateX(3px);

}

/* IMAGE COUNTER */

.v2-ref-image-counter {

    position: absolute;

    z-index: 15;

    left: 20px;

    bottom: 20px;

    min-height: 38px;

    padding: 0 13px;

    display: inline-flex;

    align-items: center;

    gap: 8px;

    color: #21343a;

    border: 1px solid rgba(255,255,255,.66);

    border-radius: 999px;

    background: rgba(255,255,255,.82);

    box-shadow: 0 9px 28px rgba(18,53,61,.12);

    backdrop-filter: blur(12px);

    -webkit-backdrop-filter: blur(12px);

    font-family: "Space Grotesk", sans-serif;

    font-size: 9px;

    font-weight: 700;

}

.v2-ref-image-counter i {

    width: 18px;

    height: 1px;

    background: rgba(31,67,76,.25);

}

/* PROJECT BADGE */

.v2-ref-project-badge {

    position: absolute;

    z-index: 15;

    right: 20px;

    top: 20px;

    padding: 10px 13px;

    color: #17323a;

    border: 1px solid rgba(255,255,255,.65);

    border-radius: 999px;

    background: rgba(255,255,255,.80);

    backdrop-filter: blur(12px);

    -webkit-backdrop-filter: blur(12px);

    font-size: 7px;

    font-weight: 800;

    letter-spacing: 1.5px;

}

/* THUMBNAILS */

.v2-ref-thumbs {

    display: grid;

    grid-template-columns: repeat(5, minmax(0, 1fr));

    gap: 8px;

    margin-top: 9px;

}

.v2-ref-thumbs button {

    position: relative;

    height: 72px;

    padding: 0;

    overflow: hidden;

    border: 1px solid transparent;

    border-radius: 11px;

    background: rgba(255,255,255,.42);

    cursor: pointer;

    opacity: .48;

    transition: opacity .25s ease, border-color .25s ease, transform .25s ease;

}

.v2-ref-thumbs button:hover {

    opacity: .80;

}

.v2-ref-thumbs button.is-active {

    opacity: 1;

    border-color: rgba(21,165,195,.55);

    transform: translateY(-2px);

}

.v2-ref-thumbs img {

    width: 100%;

    height: 100%;

    object-fit: cover;

}

/* 4 görselli projede thumbnail alanını koru */

.v2-ref-thumbs:has(button:nth-child(4):last-child) {

    grid-template-columns: repeat(4, minmax(0, 1fr));

}

/* PROJECT CONTENT */

.v2-ref-content {

    position: relative;

    padding: 34px 32px;

    display: flex;

    flex-direction: column;

    border: 1px solid rgba(18,116,139,.10);

    border-radius: 23px;

    background: linear-gradient(
            145deg,
            rgba(255,255,255,.88),
            rgba(239,247,249,.78)
        );

}

.v2-ref-content-top {

    display: flex;

    align-items: center;

    gap: 10px;

    margin-bottom: 43px;

}

.v2-ref-content-top > span {

    display: grid;

    place-items: center;

    width: 32px;

    height: 32px;

    color: #128aa4;

    border: 1px solid rgba(22,141,168,.17);

    border-radius: 8px;

    background: rgba(22,141,168,.04);

    font-family: "Space Grotesk", sans-serif;

    font-size: 8px;

}

.v2-ref-content-top p {

    color: #778a90;

    font-size: 7px;

    font-weight: 800;

    letter-spacing: 1.7px;

}

.v2-ref-content h3 {

    color: #17282e;

    font-family: "Space Grotesk", sans-serif;

    font-size: clamp(
            38px,
            3.2vw,
            52px
        );

    line-height: .98;

    letter-spacing: -2.2px;

    font-weight: 600;

}

.v2-ref-content h3 span {

    display: block;

    color: #178da7;

}

.v2-ref-description {

    margin-top: 25px;

    color: #657980;

    font-size: 14px;

    line-height: 1.8;

}

/* TAGS */

.v2-ref-tags {

    display: flex;

    flex-wrap: wrap;

    gap: 7px;

    margin-top: 27px;

}

.v2-ref-tags span {

    padding: 7px 10px;

    color: #50666d;

    border: 1px solid rgba(18,107,128,.10);

    border-radius: 999px;

    background: rgba(255,255,255,.54);

    font-size: 8px;

    font-weight: 700;

}

/* PROJECT INFO */

.v2-ref-info {

    margin-top: 32px;

    padding-top: 25px;

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 20px;

    border-top: 1px solid rgba(18,100,119,.10);

}

.v2-ref-info div {

    display: flex;

    flex-direction: column;

    gap: 6px;

}

.v2-ref-info small {

    color: #8b9a9f;

    font-size: 6px;

    font-weight: 800;

    letter-spacing: 1.5px;

}

.v2-ref-info strong {

    color: #2a4148;

    font-size: 11px;

    font-weight: 700;

}

/* LIVE LINK */

.v2-ref-live-link {

    margin-top: auto;

    padding-top: 35px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    color: #18343c;

    font-size: 11px;

    font-weight: 800;

}

.v2-ref-live-link span {

    width: 42px;

    height: 42px;

    display: grid;

    place-items: center;

    color: #1088a1;

    border: 1px solid rgba(18,132,157,.14);

    border-radius: 50%;

    background: rgba(255,255,255,.55);

    transition: transform .3s var(--ease), background .3s ease;

}

.v2-ref-live-link:hover span {

    transform: rotate(45deg);

    background: rgba(255,255,255,.96);

}

/* MAIN PROJECT NAV */

.v2-ref-project-nav {

    margin-top: 24px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 30px;

}

.v2-ref-project-counter {

    display: flex;

    align-items: center;

    gap: 11px;

    color: #213b43;

    font-family: "Space Grotesk", sans-serif;

}

.v2-ref-project-counter > span {

    font-size: 12px;

    font-weight: 700;

}

.v2-ref-project-counter i {

    width: 42px;

    height: 1px;

    background: rgba(21,93,109,.20);

}

.v2-ref-project-counter small {

    margin-left: 5px;

    color: #839399;

    font-family: "Manrope", sans-serif;

    font-size: 7px;

    font-weight: 800;

    letter-spacing: 1.7px;

}

.v2-ref-project-buttons {

    display: flex;

    gap: 8px;

}

.v2-ref-project-buttons button {

    width: 52px;

    height: 52px;

    display: grid;

    place-items: center;

    color: #18343c;

    border: 1px solid rgba(18,111,132,.13);

    border-radius: 50%;

    background: rgba(255,255,255,.57);

    cursor: pointer;

    font-size: 15px;

    transition: transform .25s ease, border-color .25s ease, background .25s ease;

}

.v2-ref-project-buttons button:hover {

    border-color: rgba(22,141,168,.30);

    background: rgba(255,255,255,.96);

}

.v2-ref-project-buttons button:first-child:hover {

    transform: translateX(-3px);

}

.v2-ref-project-buttons button:last-child:hover {

    transform: translateX(3px);

}

/* REFERENCES / DARK MODE */

html[data-theme="dark"] .v2-references-head h2 {

    color: #edf6f8;

}

html[data-theme="dark"] .v2-references-head h2 span {

    color: #67ddf7;

}

html[data-theme="dark"] .v2-references-head-grid > p {

    color: #829399;

}

html[data-theme="dark"] .v2-ref-slider {

    border-color: rgba(111,227,251,.08);

    background: rgba(3,8,10,.48);

    box-shadow: 0 35px 100px rgba(0,0,0,.24);

}

html[data-theme="dark"] .v2-ref-content {

    border-color: rgba(111,227,251,.07);

    background: linear-gradient(
            145deg,
            rgba(8,14,17,.96),
            rgba(3,8,10,.96)
        );

}

html[data-theme="dark"] .v2-ref-content h3 {

    color: #edf6f8;

}

html[data-theme="dark"] .v2-ref-content h3 span {

    color: #69def7;

}

html[data-theme="dark"] .v2-ref-description {

    color: #7e9096;

}

html[data-theme="dark"] .v2-ref-content-top p {

    color: #50646c;

}

html[data-theme="dark"] .v2-ref-tags span {

    color: #819399;

    border-color: rgba(255,255,255,.055);

    background: rgba(255,255,255,.025);

}

html[data-theme="dark"] .v2-ref-info {

    border-top-color: rgba(255,255,255,.055);

}

html[data-theme="dark"] .v2-ref-info small {

    color: #52656c;

}

html[data-theme="dark"] .v2-ref-info strong {

    color: #c8d7da;

}

html[data-theme="dark"] .v2-ref-live-link {

    color: #d8e7ea;

}

html[data-theme="dark"] .v2-ref-live-link span {

    color: #76e5fb;

    border-color: rgba(111,227,251,.10);

    background: rgba(255,255,255,.025);

}

html[data-theme="dark"] .v2-ref-live-link:hover span {

    background: rgba(111,227,251,.06);

}

html[data-theme="dark"] .v2-ref-project-counter {

    color: #d8e8eb;

}

html[data-theme="dark"] .v2-ref-project-counter i {

    background: rgba(111,227,251,.12);

}

html[data-theme="dark"] .v2-ref-project-counter small {

    color: #556a71;

}

html[data-theme="dark"] .v2-ref-project-buttons button {

    color: #cfe1e5;

    border-color: rgba(111,227,251,.09);

    background: rgba(255,255,255,.025);

}

html[data-theme="dark"] .v2-ref-project-buttons button:hover {

    border-color: rgba(111,227,251,.22);

    background: rgba(111,227,251,.05);

}

/* REFERENCES / TABLET */

@media (max-width: 1050px) {

    .v2-references {

        padding: 105px 0 115px;

    }

    .v2-references-head-grid {

        grid-template-columns: 1fr;

        gap: 25px;

    }

    .v2-references-head-grid > p {

        max-width: 620px;

    }

    .v2-ref-project {

        grid-template-columns: 1fr;

        padding: 18px;

    }

    .v2-ref-content {

        min-height: 470px;

    }

}

/* REFERENCES / MOBILE */

@media (max-width: 650px) {

    .v2-references {

        padding: 85px 0 90px;

    }

    .v2-references-head {

        margin-bottom: 34px;

    }

    .v2-references-head h2 {

        font-size: clamp(
                40px,
                12vw,
                55px
            );

        line-height: 1.02;

        letter-spacing: -2.3px;

    }

    .v2-references-head-grid > p {

        font-size: 14px;

        line-height: 1.7;

    }

    .v2-ref-slider {

        border-radius: 22px;

    }

    .v2-ref-project {

        padding: 10px;

        gap: 10px;

    }

    .v2-ref-gallery-stage {

        border-radius: 17px;

        aspect-ratio: 4 /3;

    }

    .v2-ref-image-arrow {

        width: 40px;

        height: 40px;

    }

    .v2-ref-image-prev {

        left: 11px;

    }

    .v2-ref-image-next {

        right: 11px;

    }

    .v2-ref-project-badge {

        right: 12px;

        top: 12px;

        font-size: 6px;

    }

    .v2-ref-image-counter {

        left: 12px;

        bottom: 12px;

    }

    .v2-ref-thumbs {

        gap: 5px;

    }

    .v2-ref-thumbs button {

        height: 54px;

        border-radius: 8px;

    }

    .v2-ref-content {

        min-height: 0;

        padding: 28px 24px;

    }

    .v2-ref-content-top {

        margin-bottom: 30px;

    }

    .v2-ref-content h3 {

        font-size: 38px;

    }

    .v2-ref-description {

        font-size: 13px;

    }

    .v2-ref-project-nav {

        margin-top: 18px;

    }

    .v2-ref-project-buttons button {

        width: 46px;

        height: 46px;

    }

}

/* REDUCED MOTION */

@media (prefers-reduced-motion: reduce) {

    .v2-ref-track, .v2-ref-image {

        transition: none;

    }

}

/* REFERENCE IMAGE FIT FIX */

.v2-ref-gallery-stage {

    background: radial-gradient(
            circle at center,
            rgba(33, 153, 180, .08),
            rgba(239, 247, 249, .96)
        );

}

/* Dikey veya yatay fark etmeksizin görselin tamamı görünür. */

.v2-ref-image {

    display: flex;

    align-items: center;

    justify-content: center;

    padding: 14px;

}

.v2-ref-image img {

    width: 100%;

    height: 100%;

    max-width: 100%;

    max-height: 100%;

    object-fit: contain;

    object-position: center;

    border-radius: 12px;

    cursor: zoom-in;

}

/* DARK MODE */

html[data-theme="dark"] .v2-ref-gallery-stage {

    background: radial-gradient(
            circle at center,
            rgba(64, 205, 235, .065),
            rgba(3, 8, 10, .96)
        );

}

/* Thumbnail küçük kalabilir ve alanı doldurabilir */

.v2-ref-thumbs img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    object-position: center;

}

/* REFERENCE LIGHTBOX */

.v2-lightbox {

    position: fixed;

    z-index: 99999;

    inset: 0;

    padding: 35px;

    display: flex;

    align-items: center;

    justify-content: center;

    visibility: hidden;

    opacity: 0;

    background: rgba(2, 6, 8, .92);

    backdrop-filter: blur(15px);

    -webkit-backdrop-filter: blur(15px);

    transition: opacity .3s ease, visibility .3s ease;

}

.v2-lightbox.is-active {

    visibility: visible;

    opacity: 1;

}

.v2-lightbox-image {

    max-width: min(1400px, 94vw);

    max-height: 90vh;

    width: auto;

    height: auto;

    object-fit: contain;

    border-radius: 14px;

    box-shadow: 0 40px 120px rgba(0,0,0,.55);

    transform: scale(.96);

    transition: transform .35s cubic-bezier(.22,.8,.22,1);

}

.v2-lightbox.is-active .v2-lightbox-image {

    transform: scale(1);

}

.v2-lightbox-close {

    position: absolute;

    right: 28px;

    top: 25px;

    width: 48px;

    height: 48px;

    display: grid;

    place-items: center;

    color: #fff;

    border: 1px solid rgba(255,255,255,.14);

    border-radius: 50%;

    background: rgba(255,255,255,.07);

    cursor: pointer;

    font-size: 20px;

    transition: transform .25s ease, background .25s ease;

}

.v2-lightbox-close:hover {

    transform: rotate(90deg);

    background: rgba(255,255,255,.12);

}

.v2-lightbox-caption {

    position: absolute;

    left: 50%;

    bottom: 18px;

    transform: translateX(-50%);

    color: rgba(255,255,255,.65);

    font-size: 11px;

    letter-spacing: .3px;

}

body.v2-lightbox-open {

    overflow: hidden;

}

@media (max-width: 650px) {

    .v2-lightbox {

        padding: 15px;

    }

    .v2-lightbox-image {

        max-width: 96vw;

        max-height: 86vh;

    }

    .v2-lightbox-close {

        width: 42px;

        height: 42px;

        right: 14px;

        top: 14px;

    }

}

/* LIGHTBOX GALLERY NAVIGATION */

.v2-lightbox-stage {

    width: min(1400px, 84vw);

    height: 88vh;

    display: flex;

    align-items: center;

    justify-content: center;

}

.v2-lightbox-image {

    max-width: 100%;

    max-height: 100%;

    width: auto;

    height: auto;

    object-fit: contain;

    border-radius: 14px;

    box-shadow: 0 40px 120px rgba(0,0,0,.55);

    opacity: 1;

    transform: scale(1);

    transition: opacity .18s ease, transform .3s cubic-bezier(.22,.8,.22,1);

}

.v2-lightbox-image[hidden] {

    display: none;

}

.v2-lightbox-image.is-changing {

    opacity: 0;

    transform: scale(.985);

}

/* PREV / NEXT BUTTONS */

.v2-lightbox-nav {

    position: absolute;

    z-index: 20;

    top: 50%;

    width: 58px;

    height: 58px;

    display: grid;

    place-items: center;

    transform: translateY(-50%);

    color: #ffffff;

    border: 1px solid rgba(255,255,255,.13);

    border-radius: 50%;

    background: rgba(255,255,255,.07);

    backdrop-filter: blur(14px);

    -webkit-backdrop-filter: blur(14px);

    box-shadow: 0 15px 40px rgba(0,0,0,.25);

    cursor: pointer;

    font-size: 19px;

    transition: transform .25s ease, background .25s ease, border-color .25s ease;

}

.v2-lightbox-nav:hover {

    background: rgba(255,255,255,.14);

    border-color: rgba(255,255,255,.23);

}

.v2-lightbox-prev {

    left: 26px;

}

.v2-lightbox-next {

    right: 26px;

}

.v2-lightbox-prev:hover {

    transform: translateY(-50%) translateX(-4px);

}

.v2-lightbox-next:hover {

    transform: translateY(-50%) translateX(4px);

}

/* LIGHTBOX BOTTOM INFO */

.v2-lightbox-bottom {

    position: absolute;

    z-index: 20;

    left: 50%;

    bottom: 18px;

    width: min(
            900px,
            calc(100% - 150px)
        );

    transform: translateX(-50%);

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 30px;

    pointer-events: none;

}

.v2-lightbox-caption {

    position: static;

    transform: none;

    color: rgba(255,255,255,.68);

    font-size: 11px;

}

.v2-lightbox-counter {

    min-height: 38px;

    padding: 0 14px;

    display: inline-flex;

    align-items: center;

    gap: 9px;

    flex-shrink: 0;

    color: rgba(255,255,255,.85);

    border: 1px solid rgba(255,255,255,.10);

    border-radius: 999px;

    background: rgba(255,255,255,.055);

    backdrop-filter: blur(12px);

    -webkit-backdrop-filter: blur(12px);

    font-family: "Space Grotesk", sans-serif;

    font-size: 9px;

    font-weight: 700;

}

.v2-lightbox-counter i {

    width: 20px;

    height: 1px;

    background: rgba(255,255,255,.20);

}

/* MOBILE */

@media (max-width: 650px) {

    .v2-lightbox {

        padding: 65px 10px 75px;

    }

    .v2-lightbox-stage {

        width: 100%;

        height: 78vh;

    }

    .v2-lightbox-nav {

        width: 44px;

        height: 44px;

        top: auto;

        bottom: 15px;

        transform: none;

        font-size: 15px;

    }

    .v2-lightbox-prev {

        left: 15px;

    }

    .v2-lightbox-next {

        right: 15px;

    }

    .v2-lightbox-prev:hover, .v2-lightbox-next:hover {

        transform: none;

    }

    .v2-lightbox-bottom {

        bottom: 20px;

        width: calc(100% - 135px);

        justify-content: center;

    }

    .v2-lightbox-caption {

        display: none;

    }

}

/* ABOUT */

.v2-about {

    position: relative;

    padding: 135px 0 145px;

    scroll-margin-top: 90px;

}

/* ABOUT HEADER */

.v2-about-head {

    margin-bottom: 52px;

}

.v2-about-head-grid {

    display: grid;

    grid-template-columns: minmax(0, 1.15fr) minmax(300px, .55fr);

    align-items: end;

    gap: 70px;

}

.v2-about-head h2 {

    max-width: 800px;

    color: #14242a;

    font-family: "Space Grotesk", sans-serif;

    font-size: clamp(
            48px,
            5vw,
            72px
        );

    line-height: 1;

    letter-spacing: -3.3px;

    font-weight: 600;

}

.v2-about-head h2 span {

    display: block;

    margin-top: 7px;

    color: #168ca6;

}

.v2-about-head-grid > p {

    max-width: 420px;

    padding-bottom: 5px;

    color: #64777e;

    font-size: 15px;

    line-height: 1.8;

}

/* MAIN PANEL */

.v2-about-panel {

    display: grid;

    grid-template-columns: minmax(0, 1.05fr) minmax(420px, .95fr);

    overflow: hidden;

    border: 1px solid rgba(18,116,139,.12);

    border-radius: 30px;

    background: linear-gradient(
            145deg,
            rgba(255,255,255,.88),
            rgba(239,247,249,.75)
        );

    box-shadow: 0 30px 85px rgba(28,72,82,.07);

}

/* ABOUT LEFT */

.v2-about-main {

    position: relative;

    padding: 58px 60px 55px;

    border-right: 1px solid rgba(18,105,126,.09);

}

.v2-about-label {

    display: inline-block;

    margin-bottom: 38px;

    color: #75888e;

    font-size: 7px;

    font-weight: 800;

    letter-spacing: 2px;

}

.v2-about-main h3 {

    max-width: 650px;

    color: #17282e;

    font-family: "Space Grotesk", sans-serif;

    font-size: clamp(
            38px,
            3.6vw,
            55px
        );

    line-height: 1.03;

    letter-spacing: -2.3px;

    font-weight: 600;

}

.v2-about-main h3 span {

    display: block;

    color: #168ca6;

}

.v2-about-main > p {

    max-width: 650px;

    margin-top: 27px;

    color: #657980;

    font-size: 15px;

    line-height: 1.85;

}

.v2-about-main > p + p {

    margin-top: 17px;

}

/* SIGNATURE */

.v2-about-signature {

    margin-top: 42px;

    padding-top: 27px;

    display: flex;

    align-items: center;

    gap: 15px;

    border-top: 1px solid rgba(18,98,117,.09);

}

.v2-about-signature > span {

    width: 43px;

    height: 43px;

    flex-shrink: 0;

    border: 1px solid rgba(22,141,168,.18);

    border-radius: 12px;

    background: linear-gradient(
            145deg,
            rgba(22,141,168,.12),
            rgba(255,255,255,.7)
        );

}

.v2-about-signature div {

    display: flex;

    flex-direction: column;

    gap: 2px;

}

.v2-about-signature strong {

    color: #233b42;

    font-family: "Space Grotesk", sans-serif;

    font-size: 12px;

    letter-spacing: 1.4px;

}

.v2-about-signature small {

    color: #849499;

    font-size: 6px;

    font-weight: 800;

    letter-spacing: 1.5px;

}

/* WORK SYSTEM */

.v2-about-system {

    padding: 45px 45px 38px;

}

.v2-about-system-head {

    padding-bottom: 24px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    border-bottom: 1px solid rgba(18,105,126,.09);

}

.v2-about-system-head span, .v2-about-system-head small {

    color: #7b8d93;

    font-size: 7px;

    font-weight: 800;

    letter-spacing: 1.7px;

}

.v2-about-step {

    position: relative;

    padding: 31px 0;

    display: grid;

    grid-template-columns: 42px 1fr;

    gap: 17px;

    border-bottom: 1px solid rgba(18,105,126,.08);

}

.v2-about-step:last-child {

    border-bottom: 0;

}

.v2-about-step-number {

    width: 34px;

    height: 34px;

    display: grid;

    place-items: center;

    color: #1389a3;

    border: 1px solid rgba(22,141,168,.17);

    border-radius: 9px;

    background: rgba(22,141,168,.04);

    font-family: "Space Grotesk", sans-serif;

    font-size: 8px;

}

.v2-about-step h4 {

    color: #22383f;

    font-family: "Space Grotesk", sans-serif;

    font-size: 17px;

    font-weight: 600;

}

.v2-about-step p {

    max-width: 420px;

    margin-top: 9px;

    color: #71838a;

    font-size: 13px;

    line-height: 1.7;

}

/* VALUES */

.v2-about-values {

    margin-top: 18px;

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 18px;

}

.v2-about-values article {

    min-height: 200px;

    padding: 28px;

    border: 1px solid rgba(18,116,139,.10);

    border-radius: 22px;

    background: rgba(255,255,255,.52);

    transition: transform .3s var(--ease), border-color .3s ease, background .3s ease;

}

.v2-about-values article:hover {

    transform: translateY(-4px);

    border-color: rgba(22,141,168,.25);

    background: rgba(255,255,255,.83);

}

.v2-about-values article > span {

    color: #158ba5;

    font-family: "Space Grotesk", sans-serif;

    font-size: 8px;

}

.v2-about-values h4 {

    margin-top: 36px;

    color: #21373e;

    font-family: "Space Grotesk", sans-serif;

    font-size: 20px;

    font-weight: 600;

}

.v2-about-values p {

    max-width: 340px;

    margin-top: 12px;

    color: #708289;

    font-size: 13px;

    line-height: 1.7;

}

/* ABOUT / DARK MODE */

html[data-theme="dark"] .v2-about-head h2 {

    color: #edf6f8;

}

html[data-theme="dark"] .v2-about-head h2 span {

    color: #67ddf7;

}

html[data-theme="dark"] .v2-about-head-grid > p {

    color: #829399;

}

html[data-theme="dark"] .v2-about-panel {

    border-color: rgba(111,227,251,.08);

    background: linear-gradient(
            145deg,
            rgba(8,14,17,.95),
            rgba(3,8,10,.94)
        );

    box-shadow: 0 30px 90px rgba(0,0,0,.25);

}

html[data-theme="dark"] .v2-about-main {

    border-right-color: rgba(255,255,255,.055);

}

html[data-theme="dark"] .v2-about-label {

    color: #52666d;

}

html[data-theme="dark"] .v2-about-main h3 {

    color: #edf5f7;

}

html[data-theme="dark"] .v2-about-main h3 span {

    color: #68ddf7;

}

html[data-theme="dark"] .v2-about-main > p {

    color: #7d9096;

}

html[data-theme="dark"] .v2-about-signature {

    border-top-color: rgba(255,255,255,.055);

}

html[data-theme="dark"] .v2-about-signature > span {

    border-color: rgba(111,227,251,.10);

    background: rgba(111,227,251,.025);

}

html[data-theme="dark"] .v2-about-signature strong {

    color: #dce9ec;

}

html[data-theme="dark"] .v2-about-signature small {

    color: #53676e;

}

html[data-theme="dark"] .v2-about-system-head {

    border-bottom-color: rgba(255,255,255,.055);

}

html[data-theme="dark"] .v2-about-system-head span, html[data-theme="dark"] .v2-about-system-head small {

    color: #52666d;

}

html[data-theme="dark"] .v2-about-step {

    border-bottom-color: rgba(255,255,255,.05);

}

html[data-theme="dark"] .v2-about-step-number {

    color: #75e4fa;

    border-color: rgba(111,227,251,.10);

    background: rgba(111,227,251,.025);

}

html[data-theme="dark"] .v2-about-step h4 {

    color: #dbe8eb;

}

html[data-theme="dark"] .v2-about-step p {

    color: #71848b;

}

html[data-theme="dark"] .v2-about-values article {

    border-color: rgba(111,227,251,.07);

    background: rgba(255,255,255,.018);

}

html[data-theme="dark"] .v2-about-values article:hover {

    border-color: rgba(111,227,251,.18);

    background: rgba(111,227,251,.03);

}

html[data-theme="dark"] .v2-about-values h4 {

    color: #dce9ec;

}

html[data-theme="dark"] .v2-about-values p {

    color: #71848b;

}

/* ABOUT / TABLET */

@media (max-width: 1050px) {

    .v2-about {

        padding: 105px 0 115px;

    }

    .v2-about-head-grid {

        grid-template-columns: 1fr;

        gap: 25px;

    }

    .v2-about-panel {

        grid-template-columns: 1fr;

    }

    .v2-about-main {

        border-right: 0;

        border-bottom: 1px solid rgba(18,105,126,.09);

    }

    html[data-theme="dark"] .v2-about-main {

        border-bottom-color: rgba(255,255,255,.055);

    }

}

/* ABOUT / MOBILE */

@media (max-width: 650px) {

    .v2-about {

        padding: 85px 0 90px;

    }

    .v2-about-head {

        margin-bottom: 34px;

    }

    .v2-about-head h2 {

        font-size: clamp(
                40px,
                12vw,
                55px
            );

        line-height: 1.02;

        letter-spacing: -2.3px;

    }

    .v2-about-head-grid > p {

        font-size: 14px;

        line-height: 1.7;

    }

    .v2-about-panel {

        border-radius: 22px;

    }

    .v2-about-main {

        padding: 35px 26px;

    }

    .v2-about-main h3 {

        font-size: 36px;

        letter-spacing: -1.7px;

    }

    .v2-about-main > p {

        font-size: 13px;

        line-height: 1.75;

    }

    .v2-about-system {

        padding: 30px 25px;

    }

    .v2-about-values {

        grid-template-columns: 1fr;

        gap: 12px;

    }

    .v2-about-values article {

        min-height: 170px;

    }

}

/* CONTACT */

.v2-contact {

    position: relative;

    padding: 135px 0 145px;

    scroll-margin-top: 90px;

}

.v2-contact-head {

    margin-bottom: 52px;

}

.v2-contact-head-grid {

    display: grid;

    grid-template-columns: minmax(0, 1.15fr) minmax(300px, .55fr);

    align-items: end;

    gap: 70px;

}

.v2-contact-head h2 {

    max-width: 800px;

    color: #14242a;

    font-family: "Space Grotesk", sans-serif;

    font-size: clamp(
            48px,
            5vw,
            72px
        );

    line-height: 1;

    letter-spacing: -3.3px;

    font-weight: 600;

}

.v2-contact-head h2 span {

    display: block;

    margin-top: 7px;

    color: #168ca6;

}

.v2-contact-head-grid > p {

    max-width: 420px;

    padding-bottom: 5px;

    color: #64777e;

    font-size: 15px;

    line-height: 1.8;

}

/* CONTACT PANEL */

.v2-contact-panel {

    display: grid;

    grid-template-columns: minmax(0, 1.08fr) minmax(420px, .92fr);

    overflow: hidden;

    border: 1px solid rgba(18,116,139,.12);

    border-radius: 32px;

    background: linear-gradient(
            145deg,
            rgba(255,255,255,.94),
            rgba(235,246,248,.88)
        );

    box-shadow: 0 40px 100px rgba(27,72,83,.09);

}

/* CONTACT MAIN */

.v2-contact-main {

    padding: 65px 60px;

    border-right: 1px solid rgba(18,105,126,.09);

}

.v2-contact-label {

    display: inline-block;

    margin-bottom: 38px;

    color: #72868c;

    font-size: 7px;

    font-weight: 800;

    letter-spacing: 2px;

}

.v2-contact-main h3 {

    max-width: 690px;

    color: #17282e;

    font-family: "Space Grotesk", sans-serif;

    font-size: clamp(
            40px,
            4vw,
            58px
        );

    line-height: 1.02;

    letter-spacing: -2.5px;

    font-weight: 600;

}

.v2-contact-main h3 span {

    display: block;

    color: #168ca6;

}

.v2-contact-main > p {

    max-width: 630px;

    margin-top: 27px;

    color: #657980;

    font-size: 15px;

    line-height: 1.85;

}

/* CONTACT ACTIONS */

.v2-contact-actions {

    margin-top: 42px;

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 12px;

}

.v2-contact-actions > a {

    min-height: 88px;

    padding: 18px 19px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    border-radius: 17px;

    transition: transform .3s var(--ease), border-color .3s ease, box-shadow .3s ease;

}

.v2-contact-actions > a:hover {

    transform: translateY(-4px);

}

.v2-contact-actions div {

    display: flex;

    flex-direction: column;

    gap: 5px;

}

.v2-contact-actions small {

    font-size: 6px;

    font-weight: 800;

    letter-spacing: 1.5px;

}

.v2-contact-actions strong {

    font-family: "Space Grotesk", sans-serif;

    font-size: 14px;

    font-weight: 600;

}

.v2-contact-actions > a > span {

    width: 39px;

    height: 39px;

    flex-shrink: 0;

    display: grid;

    place-items: center;

    border-radius: 50%;

    font-size: 14px;

    transition: transform .3s var(--ease);

}

.v2-contact-actions > a:hover > span {

    transform: rotate(45deg);

}

/* WHATSAPP */

.v2-contact-whatsapp {

    color: #ffffff;

    border: 1px solid rgba(37,211,102,.25);

    background: linear-gradient(
            135deg,
            #31d76d,
            #25c95d
        );

    box-shadow: 0 18px 45px rgba(37,211,102,.15);

}

.v2-contact-whatsapp small {

    color: rgba(255,255,255,.68);

}

.v2-contact-whatsapp > span {

    color: #ffffff;

    border: 1px solid rgba(255,255,255,.22);

    background: rgba(255,255,255,.10);

}

/* PHONE */

.v2-contact-call {

    color: #20363d;

    border: 1px solid rgba(18,116,139,.12);

    background: rgba(255,255,255,.64);

}

.v2-contact-call small {

    color: #819298;

}

.v2-contact-call > span {

    color: #1089a3;

    border: 1px solid rgba(22,141,168,.14);

    background: rgba(22,141,168,.04);

}

/* CONTACT SIDE */

.v2-contact-side {

    position: relative;

    min-height: 560px;

    padding: 45px;

    overflow: hidden;

}

.v2-contact-side-head {

    position: relative;

    z-index: 10;

    padding-bottom: 23px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    border-bottom: 1px solid rgba(18,105,126,.09);

}

.v2-contact-side-head span, .v2-contact-side-head small {

    color: #74878d;

    font-size: 7px;

    font-weight: 800;

    letter-spacing: 1.7px;

}

.v2-contact-side-head small {

    color: #26a873;

}

/* STATUS */

.v2-contact-status {

    position: relative;

    z-index: 10;

    margin-top: 32px;

    display: flex;

    align-items: center;

    gap: 15px;

}

.v2-contact-status-icon {

    width: 45px;

    height: 45px;

    flex-shrink: 0;

    display: grid;

    place-items: center;

    border: 1px solid rgba(27,169,118,.16);

    border-radius: 50%;

    background: rgba(38,174,119,.055);

}

.v2-contact-status-icon span {

    width: 8px;

    height: 8px;

    border-radius: 50%;

    background: #2cc47f;

    box-shadow: 0 0 8px rgba(44,196,127,.9), 0 0 20px rgba(44,196,127,.30);

}

.v2-contact-status > div:last-child {

    display: flex;

    flex-direction: column;

    gap: 5px;

}

.v2-contact-status small {

    color: #88989d;

    font-size: 6px;

    font-weight: 800;

    letter-spacing: 1.4px;

}

.v2-contact-status strong {

    color: #273d44;

    font-size: 12px;

    font-weight: 700;

}

/* CONTACT INFO */

.v2-contact-info {

    position: relative;

    z-index: 10;

    margin-top: 34px;

}

.v2-contact-info > div {

    padding: 18px 0;

    display: grid;

    grid-template-columns: 30px 1fr;

    align-items: center;

    gap: 13px;

    border-bottom: 1px solid rgba(18,105,126,.08);

}

.v2-contact-info > div:last-child {

    border-bottom: 0;

}

.v2-contact-info > div > span {

    color: #158ba5;

    font-family: "Space Grotesk", sans-serif;

    font-size: 7px;

}

.v2-contact-info div div {

    display: flex;

    flex-direction: column;

    gap: 3px;

}

.v2-contact-info small {

    color: #8a999e;

    font-size: 6px;

    font-weight: 800;

    letter-spacing: 1.4px;

}

.v2-contact-info strong {

    color: #2a4148;

    font-size: 11px;

}

/* CONTACT SYSTEM */

.v2-contact-system {

    position: absolute;

    right: -80px;

    bottom: -120px;

    width: 370px;

    height: 370px;

    opacity: .55;

}

.v2-contact-system-ring {

    position: absolute;

    left: 50%;

    top: 50%;

    border: 1px solid rgba(22,141,168,.13);

    border-radius: 50%;

    transform: translate(-50%, -50%);

}

.v2-contact-system-ring:nth-child(1) {

    width: 330px;

    height: 330px;

    border-style: dashed;

    animation: v2ContactRing 40s linear infinite;

}

.v2-contact-system-ring:nth-child(2) {

    width: 245px;

    height: 245px;

    animation: v2ContactRingReverse 30s linear infinite;

}

.v2-contact-system-core {

    position: absolute;

    left: 50%;

    top: 50%;

    width: 110px;

    height: 110px;

    display: grid;

    place-items: center;

    transform: translate(-50%, -50%);

    color: #39bdd8;

    border: 1px solid rgba(33,177,207,.20);

    border-radius: 28px;

    background: linear-gradient(
            145deg,
            #16343d,
            #061317
        );

    box-shadow: 0 25px 70px rgba(33,157,184,.20);

    font-family: "Space Grotesk", sans-serif;

    font-size: 24px;

    font-weight: 700;

}

@keyframes v2ContactRing {

    to {

        transform: translate(-50%, -50%) rotate(360deg);

    }

}

@keyframes v2ContactRingReverse {

    to {

        transform: translate(-50%, -50%) rotate(-360deg);

    }

}

/* FOOTER */

.v2-footer {

    padding: 20px 0 25px;

}

.v2-footer-main {

    padding: 35px 0;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 40px;

    border-top: 1px solid rgba(18,105,126,.10);

    border-bottom: 1px solid rgba(18,105,126,.10);

}

.v2-footer-brand {

    display: flex;

    align-items: center;

    gap: 13px;

}

.v2-footer-brand-mark {

    width: 43px;

    height: 43px;

    display: grid;

    place-items: center;

    color: #168ba5;

    border: 1px solid rgba(22,141,168,.18);

    background: rgba(22,141,168,.045);

    clip-path: polygon(
            25% 5%,
            75% 5%,
            95% 25%,
            95% 75%,
            75% 95%,
            25% 95%,
            5% 75%,
            5% 25%
        );

    font-family: "Space Grotesk", sans-serif;

    font-size: 12px;

    font-weight: 700;

}

.v2-footer-brand > div:last-child {

    display: flex;

    flex-direction: column;

    gap: 2px;

}

.v2-footer-brand strong {

    color: #20363d;

    font-family: "Space Grotesk", sans-serif;

    font-size: 13px;

    letter-spacing: 1.4px;

}

.v2-footer-brand small {

    color: #87969b;

    font-size: 6px;

    font-weight: 800;

    letter-spacing: 1.4px;

}

/* FOOTER NAV */

.v2-footer-nav {

    display: flex;

    align-items: center;

    gap: 27px;

}

.v2-footer-nav a {

    color: #687b82;

    font-size: 10px;

    font-weight: 700;

    transition: color .25s ease;

}

.v2-footer-nav a:hover {

    color: #1489a3;

}

/* FOOTER BOTTOM */

.v2-footer-bottom {

    padding-top: 20px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 25px;

}

.v2-footer-bottom p {

    color: #89989d;

    font-size: 9px;

}

.v2-footer-bottom > span {

    color: #9aa7ab;

    font-family: "Space Grotesk", sans-serif;

    font-size: 6px;

    letter-spacing: 1.8px;

}

/* CONTACT + FOOTER / DARK */

html[data-theme="dark"] .v2-contact-head h2 {

    color: #edf6f8;

}

html[data-theme="dark"] .v2-contact-head h2 span {

    color: #67ddf7;

}

html[data-theme="dark"] .v2-contact-head-grid > p {

    color: #829399;

}

html[data-theme="dark"] .v2-contact-panel {

    border-color: rgba(111,227,251,.08);

    background: linear-gradient(
            145deg,
            rgba(8,14,17,.96),
            rgba(3,8,10,.95)
        );

    box-shadow: 0 40px 100px rgba(0,0,0,.28);

}

html[data-theme="dark"] .v2-contact-main {

    border-right-color: rgba(255,255,255,.055);

}

html[data-theme="dark"] .v2-contact-label {

    color: #52666d;

}

html[data-theme="dark"] .v2-contact-main h3 {

    color: #edf5f7;

}

html[data-theme="dark"] .v2-contact-main h3 span {

    color: #68ddf7;

}

html[data-theme="dark"] .v2-contact-main > p {

    color: #7d9096;

}

html[data-theme="dark"] .v2-contact-call {

    color: #d7e6e9;

    border-color: rgba(111,227,251,.08);

    background: rgba(255,255,255,.025);

}

html[data-theme="dark"] .v2-contact-call small {

    color: #586c73;

}

html[data-theme="dark"] .v2-contact-call > span {

    color: #73e5fb;

    border-color: rgba(111,227,251,.10);

    background: rgba(111,227,251,.025);

}

html[data-theme="dark"] .v2-contact-side-head {

    border-bottom-color: rgba(255,255,255,.055);

}

html[data-theme="dark"] .v2-contact-side-head span {

    color: #566a71;

}

html[data-theme="dark"] .v2-contact-status strong {

    color: #cfdee1;

}

html[data-theme="dark"] .v2-contact-status small {

    color: #53676e;

}

html[data-theme="dark"] .v2-contact-info > div {

    border-bottom-color: rgba(255,255,255,.05);

}

html[data-theme="dark"] .v2-contact-info small {

    color: #53676e;

}

html[data-theme="dark"] .v2-contact-info strong {

    color: #c8d8db;

}

html[data-theme="dark"] .v2-footer-main {

    border-top-color: rgba(255,255,255,.055);

    border-bottom-color: rgba(255,255,255,.055);

}

html[data-theme="dark"] .v2-footer-brand-mark {

    color: #74e5fb;

    border-color: rgba(111,227,251,.11);

    background: rgba(111,227,251,.025);

}

html[data-theme="dark"] .v2-footer-brand strong {

    color: #dce9ec;

}

html[data-theme="dark"] .v2-footer-brand small, html[data-theme="dark"] .v2-footer-nav a, html[data-theme="dark"] .v2-footer-bottom p, html[data-theme="dark"] .v2-footer-bottom > span {

    color: #596c73;

}

html[data-theme="dark"] .v2-footer-nav a:hover {

    color: #72e3f9;

}

/* CONTACT / TABLET */

@media (max-width: 1050px) {

    .v2-contact {

        padding: 105px 0 115px;

    }

    .v2-contact-head-grid {

        grid-template-columns: 1fr;

        gap: 25px;

    }

    .v2-contact-panel {

        grid-template-columns: 1fr;

    }

    .v2-contact-main {

        border-right: 0;

        border-bottom: 1px solid rgba(18,105,126,.09);

    }

    html[data-theme="dark"] .v2-contact-main {

        border-bottom-color: rgba(255,255,255,.055);

    }

}

/* CONTACT / MOBILE */

@media (max-width: 650px) {

    .v2-contact {

        padding: 85px 0 80px;

    }

    .v2-contact-head {

        margin-bottom: 34px;

    }

    .v2-contact-head h2 {

        font-size: clamp(
                40px,
                12vw,
                55px
            );

        line-height: 1.02;

        letter-spacing: -2.3px;

    }

    .v2-contact-head-grid > p {

        font-size: 14px;

        line-height: 1.7;

    }

    .v2-contact-panel {

        border-radius: 22px;

    }

    .v2-contact-main {

        padding: 38px 26px;

    }

    .v2-contact-main h3 {

        font-size: 36px;

        letter-spacing: -1.7px;

    }

    .v2-contact-main > p {

        font-size: 13px;

        line-height: 1.75;

    }

    .v2-contact-actions {

        grid-template-columns: 1fr;

    }

    .v2-contact-side {

        min-height: 510px;

        padding: 30px 25px;

    }

    .v2-footer-main {

        align-items: flex-start;

        flex-direction: column;

    }

    .v2-footer-nav {

        width: 100%;

        flex-wrap: wrap;

        gap: 15px 22px;

    }

    .v2-footer-bottom {

        align-items: flex-start;

        flex-direction: column;

        gap: 8px;

    }

}

/* GLOBAL SECTION SPACING / Tüm bölümlerde dengeli dikey ritim */

/* DESKTOP */

.v2-hero {

    padding-bottom: 56px;

}

.v2-services, .v2-references, .v2-about, .v2-contact {

    padding-top: 56px;

    padding-bottom: 56px;

}

/* TABLET */

@media (max-width: 1050px) {

    .v2-hero {

        padding-bottom: 45px;

    }

    .v2-services, .v2-references, .v2-about, .v2-contact {

        padding-top: 45px;

        padding-bottom: 45px;

    }

}

/* MOBILE */

@media (max-width: 650px) {

    .v2-hero {

        padding-bottom: 34px;

    }

    .v2-services, .v2-references, .v2-about, .v2-contact {

        padding-top: 34px;

        padding-bottom: 34px;

    }

}

/* MOBILE FIXED CONTACT BAR */

.v2-mobile-contact {

    display: none;

}

/* MOBILE */

@media (max-width: 650px) {

    /* Alt butonların sayfa içeriğinin üstünü kapatmaması için footer altında biraz alan. */

    body {

        padding-bottom: 78px;

    }

    .v2-mobile-contact {

        position: fixed;

        z-index: 9990;

        left: 12px;

        right: 12px;

        bottom: 12px;

        display: grid;

        grid-template-columns: .76fr 1.24fr;

        gap: 9px;

        pointer-events: none;

    }

    .v2-mobile-contact > a {

        min-height: 54px;

        padding: 0 17px;

        display: flex;

        align-items: center;

        justify-content: center;

        gap: 9px;

        border-radius: 16px;

        font-family: "Manrope", sans-serif;

        text-decoration: none;

        pointer-events: auto;

        -webkit-tap-highlight-color: transparent;

        backdrop-filter: blur(16px);

        -webkit-backdrop-filter: blur(16px);

        box-shadow: 0 12px 35px rgba(17,50,59,.14);

        transition: transform .2s ease;

    }

    .v2-mobile-contact > a:active {

        transform: scale(.97);

    }

    /* CALL */

    .v2-mobile-call {

        color: #18333b;

        border: 1px solid rgba(18,116,139,.15);

        background: rgba(249,253,254,.94);

    }

    .v2-mobile-call strong {

        font-size: 12px;

        font-weight: 800;

    }

    .v2-mobile-contact-icon {

        width: 27px;

        height: 27px;

        display: grid;

        place-items: center;

        color: #138ca7;

        border: 1px solid rgba(22,141,168,.13);

        border-radius: 50%;

        background: rgba(22,141,168,.055);

        font-size: 12px;

    }

    /* WHATSAPP */

    .v2-mobile-whatsapp {

        color: #ffffff;

        border: 1px solid rgba(255,255,255,.12);

        background: linear-gradient(
                135deg,
                #2bd46b,
                #20c65a
            );

        box-shadow: 0 14px 38px rgba(37,211,102,.22);

    }

    .v2-mobile-whatsapp strong {

        font-size: 12px;

        font-weight: 800;

    }

    .v2-mobile-contact-arrow {

        width: 27px;

        height: 27px;

        display: grid;

        place-items: center;

        border: 1px solid rgba(255,255,255,.20);

        border-radius: 50%;

        background: rgba(255,255,255,.09);

        font-size: 11px;

    }

    /* DARK MODE */

    html[data-theme="dark"] .v2-mobile-call {

        color: #dcebed;

        border-color: rgba(111,227,251,.10);

        background: rgba(7,14,17,.92);

        box-shadow: 0 15px 40px rgba(0,0,0,.32);

    }

    html[data-theme="dark"] .v2-mobile-contact-icon {

        color: #70e2f9;

        border-color: rgba(111,227,251,.11);

        background: rgba(111,227,251,.035);

    }

}

/* DESKTOP FIXED WHATSAPP */

.v2-desktop-whatsapp {

    position: fixed;

    z-index: 9980;

    right: 26px;

    bottom: 26px;

    min-width: 178px;

    min-height: 58px;

    padding: 9px 10px 9px 15px;

    display: flex;

    align-items: center;

    gap: 11px;

    color: #ffffff;

    border: 1px solid rgba(255,255,255,.16);

    border-radius: 18px;

    background: linear-gradient(
            135deg,
            #2dd56c,
            #21c85b
        );

    box-shadow: 0 18px 45px rgba(37,211,102,.22), 0 8px 25px rgba(12,50,29,.12);

    text-decoration: none;

    transition: transform .3s cubic-bezier(.22,.8,.22,1), box-shadow .3s ease;

    backdrop-filter: blur(12px);

    -webkit-backdrop-filter: blur(12px);

}

.v2-desktop-whatsapp:hover {

    transform: translateY(-5px);

    box-shadow: 0 25px 55px rgba(37,211,102,.27), 0 10px 30px rgba(12,50,29,.16);

}

/* ONLINE DOT */

.v2-desktop-whatsapp-dot {

    width: 8px;

    height: 8px;

    flex-shrink: 0;

    border-radius: 50%;

    background: #ffffff;

    box-shadow: 0 0 0 5px rgba(255,255,255,.12);

}

/* TEXT */

.v2-desktop-whatsapp > div {

    display: flex;

    flex-direction: column;

    gap: 1px;

    flex: 1;

}

.v2-desktop-whatsapp small {

    color: rgba(255,255,255,.68);

    font-size: 6px;

    font-weight: 800;

    letter-spacing: 1.25px;

}

.v2-desktop-whatsapp strong {

    color: #ffffff;

    font-family: "Space Grotesk", sans-serif;

    font-size: 12px;

    font-weight: 700;

}

/* ARROW */

.v2-desktop-whatsapp > i {

    width: 36px;

    height: 36px;

    flex-shrink: 0;

    display: grid;

    place-items: center;

    border: 1px solid rgba(255,255,255,.20);

    border-radius: 50%;

    background: rgba(255,255,255,.10);

    font-style: normal;

    font-size: 12px;

    transition: transform .3s cubic-bezier(.22,.8,.22,1);

}

.v2-desktop-whatsapp:hover > i {

    transform: rotate(45deg);

}

/* SUBTLE PULSE */

.v2-desktop-whatsapp-dot {

    animation: v2WhatsappPulse 2.4s ease-in-out infinite;

}

@keyframes v2WhatsappPulse {

    0%, 100% {

        box-shadow: 0 0 0 4px rgba(255,255,255,.10);

    }

    50% {

        box-shadow: 0 0 0 8px rgba(255,255,255,.02);

    }

}

/* MOBILE */

@media (max-width: 650px) {

    .v2-desktop-whatsapp {

        display: none;

    }

}

/* REDUCED MOTION */

@media (prefers-reduced-motion: reduce) {

    .v2-desktop-whatsapp-dot {

        animation: none;

    }

}

/* NAVIGATION / ACTIVE SECTION */

/* Sabit header nedeniyle bölüm başlığı header altında kalmasın */

#hizmetler, #referanslar, #hakkimizda, #iletisim {

    scroll-margin-top: 105px;

}

/* DESKTOP ACTIVE LINK */

.v2-nav-links a {

    position: relative;

}

.v2-nav-links a::after {

    content: "";

    position: absolute;

    left: 50%;

    bottom: -9px;

    width: 0;

    height: 2px;

    transform: translateX(-50%);

    border-radius: 999px;

    background: #168ca6;

    transition: width .28s ease, opacity .28s ease;

    opacity: 0;

}

.v2-nav-links a.is-active {

    color: #1489a3;

}

.v2-nav-links a.is-active::after {

    width: 18px;

    opacity: 1;

}

/* DARK */

html[data-theme="dark"] .v2-nav-links a.is-active {

    color: #71e3fa;

}

html[data-theme="dark"] .v2-nav-links a::after {

    background: #71e3fa;

}

/* MOBILE MENU ACTIVE LINK */

.v2-mobile-menu a.is-active {

    color: #1489a3;

}

html[data-theme="dark"] .v2-mobile-menu a.is-active {

    color: #71e3fa;

}

/* MOBILE HERO / PREMIUM FIRST SCREEN */

@media (max-width: 650px) {

    /* ------------------------------------------------------ HERO WRAPPER ------------------------------------------------------ */

    .v2-hero {

        padding-top: 14px;

        padding-bottom: 34px;

    }

    .v2-hero .v2-shell {

        width: calc(100% - 20px);

    }

    .v2-hero-panel {

        min-height: auto;

        padding: 34px 20px 24px;

        display: grid;

        grid-template-columns: 1fr;

        gap: 0;

        overflow: hidden;

        border-radius: 25px;

    }

    /* ------------------------------------------------------ CONTENT ------------------------------------------------------ */

    .v2-hero-content {

        position: relative;

        z-index: 20;

        max-width: none;

    }

    .v2-kicker {

        margin-bottom: 17px;

        font-size: 7px;

        letter-spacing: 1.6px;

    }

    .v2-hero h1 {

        max-width: 100%;

        margin: 0;

        font-size: clamp(
                44px,
                12.5vw,
                57px
            );

        line-height: .98;

        letter-spacing: -2.6px;

    }

    .v2-hero h1 span {

        max-width: 100%;

        margin-top: 7px;

        padding-bottom: 5px;

    }

    /* ------------------------------------------------------ DESCRIPTION ------------------------------------------------------ */

    .v2-hero-description {

        max-width: 390px;

        margin-top: 21px;

        font-size: 13px;

        line-height: 1.7;

    }

    /* ------------------------------------------------------ CTA ------------------------------------------------------ */

    .v2-hero-actions {

        margin-top: 24px;

        display: grid;

        grid-template-columns: 1fr;

        gap: 9px;

    }

    .v2-button {

        width: 100%;

        min-height: 52px;

        padding: 0 17px;

        justify-content: space-between;

        border-radius: 14px;

        font-size: 10px;

    }

    .v2-button b {

        font-size: 13px;

    }

    /* ------------------------------------------------------ TRUST / META Mobilde dikey yerine yatay ------------------------------------------------------ */

    .v2-hero-meta {

        max-width: none;

        margin-top: 27px;

        padding-top: 18px;

        display: grid;

        grid-template-columns: repeat(3, minmax(0, 1fr));

        gap: 0;

        border-top: 1px solid rgba(18,105,126,.10);

    }

    .v2-hero-meta > div {

        min-width: 0;

        padding: 0 11px;

        display: flex;

        align-items: flex-start;

        gap: 7px;

        border-right: 1px solid rgba(18,105,126,.08);

    }

    .v2-hero-meta > div:first-child {

        padding-left: 0;

    }

    .v2-hero-meta > div:last-child {

        padding-right: 0;

        border-right: 0;

    }

    .v2-hero-meta span {

        flex-shrink: 0;

        font-size: 6px;

    }

    .v2-hero-meta p {

        margin: 0;

        font-size: 7px;

        line-height: 1.35;

    }

    .v2-hero-meta strong {

        display: block;

        font-size: 7px;

    }

    /* ------------------------------------------------------ CORE ------------------------------------------------------ */

    .v2-core-stage {

        position: relative;

        width: 100%;

        height: 285px;

        min-height: 0;

        margin-top: 8px;

        overflow: visible;

    }

    .v2-logo-device {

        width: 174px;

        height: 174px;

        border-radius: 35px;

    }

    .v2-logo-device img {

        width: 100%;

        height: 100%;

        object-fit: cover;

        border-radius: inherit;

    }

    /* ------------------------------------------------------ CORE RINGS ------------------------------------------------------ */

    .v2-ring-2 {

        width: 220px;

        height: 220px;

    }

    .v2-ring-3 {

        width: 185px;

        height: 185px;

    }

    .v2-core-backlight {

        width: 235px;

        height: 235px;

        opacity: .75;

    }

    /* ------------------------------------------------------ PANEL CODE ------------------------------------------------------ */

    .v2-panel-code {

        display: none;

    }

    /* ------------------------------------------------------ DARK MODE META DIVIDERS ------------------------------------------------------ */

    html[data-theme="dark"] .v2-hero-meta {

        border-top-color: rgba(255,255,255,.065);

    }

    html[data-theme="dark"] .v2-hero-meta > div {

        border-right-color: rgba(255,255,255,.055);

    }

}

/* MOBILE HERO / SAFE PREMIUM ENHANCEMENT */

@media (max-width: 650px) {

    .v2-core-stage {

        position: relative;

        height: 285px;

        margin-top: 8px;

        overflow: visible;

    }

    .v2-service-node {

        display: none !important;

    }

    .v2-logo-device {

        width: 182px;

        height: 182px;

        box-shadow: 0 28px 70px rgba(15, 104, 125, .22), 0 0 60px rgba(61, 214, 241, .15);

        animation: v2SafeCoreFloat 4s ease-in-out infinite;

    }

    @keyframes v2SafeCoreFloat {

        0%, 100% {

            transform: perspective(1200px) rotateY(-4deg) rotateX(2deg) translateY(0);

        }

        50% {

            transform: perspective(1200px) rotateY(-4deg) rotateX(2deg) translateY(-6px);

        }

    }

    .v2-core-backlight {

        width: 250px;

        height: 250px;

        opacity: .95;

    }

    .v2-ring-1 {

        width: 270px;

        height: 270px;

    }

    .v2-ring-2 {

        width: 225px;

        height: 225px;

    }

    .v2-ring-3 {

        display: block;

        width: 195px;

        height: 195px;

        opacity: .35;

    }

    .v2-device-status {

        bottom: 12px;

        padding: 6px 9px;

        font-size: 5px;

        letter-spacing: 1.2px;

    }

}

/* REDUCED MOTION */

@media (prefers-reduced-motion: reduce) {

    .v2-logo-device {

        animation: none !important;

    }

}

/* TK TECH / MOBILE BOOT SCREEN */

.v2-boot {

    display: none;

}

@media (max-width: 650px) {

    html.tk-boot-pending .v2-boot {

        position: fixed;

        z-index: 999999;

        inset: 0;

        display: flex;

        align-items: center;

        justify-content: center;

        overflow: hidden;

        background: radial-gradient(
                circle at 50% 46%,
                rgba(49, 201, 231, .10),
                transparent 30%
            ), #020608;

        opacity: 1;

        visibility: visible;

        transition: opacity .3s ease, visibility .3s ease, transform .55s cubic-bezier(.7,0,.2,1);

    }

    /* BACKGROUND GRID */

    .v2-boot-grid {

        position: absolute;

        inset: -40px;

        opacity: .25;

        background-image: linear-gradient(
                rgba(86, 218, 245, .055) 1px,
                transparent 1px
            ), linear-gradient(
                90deg,
                rgba(86, 218, 245, .055) 1px,
                transparent 1px
            );

        background-size: 44px 44px;

        mask-image: radial-gradient(
                circle,
                black,
                transparent 72%
            );

        -webkit-mask-image: radial-gradient(
                circle,
                black,
                transparent 72%
            );

        animation: v2BootGrid 5s linear infinite;

    }

    @keyframes v2BootGrid {

        to {

            transform: translateY(44px);

        }

    }

    /* GLOW */

    .v2-boot-glow {

        position: absolute;

        width: 340px;

        height: 340px;

        border-radius: 50%;

        background: radial-gradient(
                circle,
                rgba(61, 218, 247, .15),
                rgba(61, 218, 247, .045) 38%,
                transparent 70%
            );

        filter: blur(18px);

        animation: v2BootGlow 2s ease-in-out infinite alternate;

    }

    @keyframes v2BootGlow {

        from {

            opacity: .55;

            transform: scale(.9);

        }

        to {

            opacity: 1;

            transform: scale(1.1);

        }

    }

    /* CONTENT */

    .v2-boot-content {

        position: relative;

        z-index: 5;

        width: min(
                310px,
                calc(100% - 60px)
            );

        display: flex;

        flex-direction: column;

        align-items: center;

        text-align: center;

        opacity: 0;

        transform: translateY(12px) scale(.97);

        animation: v2BootAppear .4s ease forwards;

    }

    @keyframes v2BootAppear {

        to {

            opacity: 1;

            transform: translateY(0) scale(1);

        }

    }

    /* CORE */

    .v2-boot-core {

        position: relative;

        width: 122px;

        height: 122px;

        display: grid;

        place-items: center;

        margin-bottom: 30px;

    }

    .v2-boot-mark {

        position: relative;

        z-index: 4;

        width: 76px;

        height: 76px;

        display: grid;

        place-items: center;

        color: #aef4ff;

        border: 1px solid rgba(111, 227, 251, .25);

        background: linear-gradient(
                145deg,
                rgba(18, 43, 51, .95),
                rgba(3, 10, 13, .98)
            );

        clip-path: polygon(
                25% 5%,
                75% 5%,
                95% 25%,
                95% 75%,
                75% 95%,
                25% 95%,
                5% 75%,
                5% 25%
            );

        font-family: "Space Grotesk", sans-serif;

        font-size: 22px;

        font-weight: 700;

        letter-spacing: -1px;

        box-shadow: 0 0 38px rgba(74, 218, 248, .15);

        animation: v2BootCore .75s cubic-bezier(.2,.8,.2,1) both;

    }

    @keyframes v2BootCore {

        0% {

            opacity: 0;

            transform: scale(.65);

        }

        60% {

            opacity: 1;

            transform: scale(1.08);

        }

        100% {

            opacity: 1;

            transform: scale(1);

        }

    }

    /* RINGS */

    .v2-boot-ring {

        position: absolute;

        left: 50%;

        top: 50%;

        border-radius: 50%;

        transform: translate(-50%, -50%);

    }

    .v2-boot-ring-one {

        width: 108px;

        height: 108px;

        border: 1px solid rgba(105, 228, 252, .18);

        animation: v2BootRingCW 2.8s linear infinite;

    }

    .v2-boot-ring-one::before {

        content: "";

        position: absolute;

        width: 5px;

        height: 5px;

        left: -3px;

        top: 50%;

        border-radius: 50%;

        background: #6eeaff;

        box-shadow: 0 0 12px rgba(110,234,255,.95);

    }

    .v2-boot-ring-two {

        width: 134px;

        height: 134px;

        border: 1px dashed rgba(105, 228, 252, .10);

        animation: v2BootRingCCW 4s linear infinite;

    }

    @keyframes v2BootRingCW {

        from {

            transform: translate(-50%, -50%) rotate(0deg);

        }

        to {

            transform: translate(-50%, -50%) rotate(360deg);

        }

    }

    @keyframes v2BootRingCCW {

        from {

            transform: translate(-50%, -50%) rotate(360deg);

        }

        to {

            transform: translate(-50%, -50%) rotate(0deg);

        }

    }

    /* BRAND */

    .v2-boot-brand {

        display: flex;

        flex-direction: column;

        gap: 4px;

    }

    .v2-boot-brand strong {

        color: #f0fafc;

        font-family: "Space Grotesk", sans-serif;

        font-size: 22px;

        font-weight: 700;

        letter-spacing: 3px;

    }

    .v2-boot-brand small {

        color: #4e666e;

        font-size: 6px;

        font-weight: 800;

        letter-spacing: 2px;

    }

    /* STATUS */

    .v2-boot-status {

        width: 100%;

        margin-top: 33px;

        display: flex;

        align-items: center;

        justify-content: space-between;

        color: #60757c;

        font-family: "Space Grotesk", sans-serif;

        font-size: 7px;

        font-weight: 600;

        letter-spacing: 1.4px;

    }

    .v2-boot-status strong {

        color: #7ceaff;

        font-size: 8px;

    }

    /* PROGRESS */

    .v2-boot-progress {

        position: relative;

        width: 100%;

        height: 2px;

        margin-top: 10px;

        overflow: hidden;

        background: rgba(255,255,255,.06);

    }

    .v2-boot-progress > span {

        position: absolute;

        left: 0;

        top: 0;

        width: 0%;

        height: 100%;

        background: linear-gradient(
                90deg,
                #1e94ad,
                #72e8ff
            );

        box-shadow: 0 0 14px rgba(79, 222, 248, .7);

        transition: width .18s ease;

    }

    /* ONLINE */

    .v2-boot-online {

        margin-top: 16px;

        display: flex;

        align-items: center;

        gap: 7px;

        color: #576d74;

        font-size: 6px;

        font-weight: 800;

        letter-spacing: 1.7px;

        opacity: .35;

        transition: color .25s ease, opacity .25s ease;

    }

    .v2-boot-online i {

        width: 5px;

        height: 5px;

        border-radius: 50%;

        background: #496267;

    }

    .v2-boot.is-online .v2-boot-online {

        color: #7fe6bd;

        opacity: 1;

    }

    .v2-boot.is-online .v2-boot-online i {

        background: #67eab8;

        box-shadow: 0 0 9px rgba(103,234,184,.9);

    }

    /* LEAVING */

    .v2-boot.is-leaving {

        opacity: 0;

        transform: scale(1.035);

        pointer-events: none;

    }

}

/* ACCESSIBILITY */

@media (prefers-reduced-motion: reduce) {

    .v2-boot {

        display: none !important;

    }

}

/* ==========================================================
   TK TECH / WOW EXPERIENCE LAYER
   Section-specific motion, depth and interaction polish
========================================================== */

:root {
    --tk-wow-accent: #168da8;
    --tk-wow-accent-soft: rgba(22, 141, 168, .14);
    --tk-wow-accent-faint: rgba(22, 141, 168, .07);
    --tk-wow-line: rgba(18, 116, 139, .12);
    --tk-wow-glass: rgba(255, 255, 255, .58);
    --tk-wow-grid: rgba(22, 141, 168, .055);
    --tk-wow-text-soft: #6f8188;
}

html[data-theme="dark"] {
    --tk-wow-accent: #6fe3fb;
    --tk-wow-accent-soft: rgba(111, 227, 251, .16);
    --tk-wow-accent-faint: rgba(111, 227, 251, .07);
    --tk-wow-line: rgba(111, 227, 251, .09);
    --tk-wow-glass: rgba(5, 13, 16, .68);
    --tk-wow-grid: rgba(111, 227, 251, .045);
    --tk-wow-text-soft: #62757b;
}

.v2-hero,
.v2-services,
.v2-references,
.v2-about,
.v2-contact {
    isolation: isolate;
}

.v2-services,
.v2-references,
.v2-about,
.v2-contact {
    overflow: clip;
}

/* Large section identity */

.tk-section-watermark {
    position: absolute;
    z-index: -1;
    top: 18px;
    right: max(24px, calc((100vw - var(--shell)) / 2));
    display: flex;
    align-items: flex-start;
    gap: 12px;
    pointer-events: none;
    user-select: none;
    opacity: .7;
}

.tk-section-watermark strong {
    color: transparent;
    -webkit-text-stroke: 1px rgba(22, 141, 168, .10);
    font-family: "Space Grotesk", sans-serif;
    font-size: clamp(96px, 11vw, 176px);
    font-weight: 600;
    line-height: .78;
    letter-spacing: -8px;
}

.tk-section-watermark span {
    margin-top: 11px;
    color: rgba(31, 80, 91, .28);
    font-size: 7px;
    font-weight: 800;
    letter-spacing: 2.2px;
    writing-mode: vertical-rl;
}

html[data-theme="dark"] .tk-section-watermark strong {
    -webkit-text-stroke-color: rgba(111, 227, 251, .075);
}

html[data-theme="dark"] .tk-section-watermark span {
    color: rgba(129, 180, 190, .24);
}

/* Reveal system: only active after JS has initialized */

html.tk-wow-ready .tk-reveal {
    opacity: 0;
    transform: translate3d(0, 28px, 0) scale(.992);
    filter: blur(5px);
    transition:
        opacity .8s var(--ease) var(--tk-delay, 0ms),
        transform .9s var(--ease) var(--tk-delay, 0ms),
        filter .9s var(--ease) var(--tk-delay, 0ms);
}

html.tk-wow-ready .tk-reveal.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    filter: blur(0);
}

/* Section separators become a live signal */

.v2-services::after,
.v2-references::after,
.v2-about::after,
.v2-contact::after {
    content: "";
    position: absolute;
    z-index: 0;
    left: 50%;
    bottom: 0;
    width: min(var(--shell), calc(100% - 48px));
    height: 1px;
    transform: translateX(-50%);
    background: linear-gradient(90deg, transparent, var(--tk-wow-line) 16%, var(--tk-wow-line) 84%, transparent);
    pointer-events: none;
}

.v2-services::before,
.v2-references::before,
.v2-about::before,
.v2-contact::before {
    content: "";
    position: absolute;
    z-index: 0;
    left: 50%;
    bottom: -2px;
    width: 70px;
    height: 5px;
    transform: translateX(-50%);
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, var(--tk-wow-accent), transparent);
    filter: blur(1px);
    opacity: .34;
    pointer-events: none;
}

/* ==========================================================
   HERO / PRECISION PANEL
========================================================== */

.v2-hero-panel {
    --tk-pointer-x: 72%;
    --tk-pointer-y: 46%;
    isolation: isolate;
}

.v2-hero-panel::before {
    content: "";
    position: absolute;
    z-index: 1;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(
            circle 220px at var(--tk-pointer-x) var(--tk-pointer-y),
            rgba(89, 220, 247, .11),
            rgba(89, 220, 247, .025) 40%,
            transparent 72%
        );
    mix-blend-mode: screen;
    opacity: .7;
    transition: opacity .35s ease;
}

html[data-theme="light"] .v2-hero-panel::before {
    mix-blend-mode: normal;
    opacity: .38;
}

.v2-hero-panel::after {
    content: "";
    position: absolute;
    z-index: 18;
    top: 0;
    left: -24%;
    width: 20%;
    height: 1px;
    pointer-events: none;
    background: linear-gradient(90deg, transparent, rgba(126, 237, 255, .88), transparent);
    box-shadow: 0 0 16px rgba(111, 227, 251, .35);
    animation: tkHeroTrace 8s ease-in-out infinite;
}

@keyframes tkHeroTrace {
    0%, 20% { transform: translateX(0); opacity: 0; }
    28% { opacity: 1; }
    62% { opacity: 1; }
    74%, 100% { transform: translateX(720%); opacity: 0; }
}

.tk-hero-corners {
    position: absolute;
    z-index: 19;
    inset: 17px;
    pointer-events: none;
}

.tk-hero-corners i {
    position: absolute;
    width: 28px;
    height: 28px;
    opacity: .5;
}

.tk-hero-corners i:nth-child(1) {
    top: 0;
    left: 0;
    border-top: 1px solid var(--tk-wow-accent);
    border-left: 1px solid var(--tk-wow-accent);
}

.tk-hero-corners i:nth-child(2) {
    top: 0;
    right: 0;
    border-top: 1px solid var(--tk-wow-accent);
    border-right: 1px solid var(--tk-wow-accent);
}

.tk-hero-corners i:nth-child(3) {
    bottom: 0;
    right: 0;
    border-bottom: 1px solid var(--tk-wow-accent);
    border-right: 1px solid var(--tk-wow-accent);
}

.tk-hero-corners i:nth-child(4) {
    bottom: 0;
    left: 0;
    border-bottom: 1px solid var(--tk-wow-accent);
    border-left: 1px solid var(--tk-wow-accent);
}

/* ==========================================================
   SERVICES / MODULAR LIVE SYSTEM
========================================================== */

.v2-services-grid {
    perspective: 1600px;
}

.v2-service-card {
    --tk-pointer-x: 50%;
    --tk-pointer-y: 50%;
    isolation: isolate;
    transform-style: preserve-3d;
}

.v2-service-card::after {
    content: "";
    position: absolute;
    z-index: 1;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(
            circle 190px at var(--tk-pointer-x) var(--tk-pointer-y),
            rgba(39, 183, 211, .14),
            transparent 70%
        );
    opacity: 0;
    transition: opacity .35s ease;
}

.v2-service-card:hover::after {
    opacity: 1;
}

transform: translateY(-7px) perspective(900px) rotateX(var(--tk-tilt-x, 0deg)) rotateY(var(--tk-tilt-y, 0deg));

.v2-service-card .v2-service-card-top,
.v2-service-card .v2-card-content,
.v2-service-card .v2-service-tags,
.v2-service-card .v2-growth-left,
.v2-service-card .v2-growth-stats,
.v2-service-card .v2-card-arrow,
.v2-service-card .v2-card-visual,
.v2-service-card .v2-service-line {
    z-index: 5;
}

.tk-service-schematic {
    position: absolute;
    z-index: 2;
    right: 22px;
    bottom: 18px;
    width: 132px;
    height: 104px;
    pointer-events: none;
    opacity: .58;
    transition: opacity .35s ease, transform .55s var(--ease);
}

.v2-service-card:hover .tk-service-schematic {
    opacity: .95;
    transform: translate3d(0, -3px, 18px);
}

/* Technical radar */

[data-wow-service="technical"] .tk-service-schematic {
    right: 33px;
    top: 34px;
    bottom: auto;
    width: 122px;
    height: 122px;
}

[data-wow-service="technical"] .tk-service-schematic span {
    position: absolute;
    inset: 50%;
    border: 1px solid var(--tk-wow-line);
    border-radius: 50%;
    transform: translate(-50%, -50%);
}

[data-wow-service="technical"] .tk-service-schematic span:nth-child(1) {
    width: 110px;
    height: 110px;
    border-style: dashed;
    animation: tkSchematicSpin 18s linear infinite;
}

[data-wow-service="technical"] .tk-service-schematic span:nth-child(2) {
    width: 76px;
    height: 76px;
}

[data-wow-service="technical"] .tk-service-schematic span:nth-child(3) {
    width: 38px;
    height: 38px;
}

[data-wow-service="technical"] .tk-service-schematic b {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 7px;
    height: 7px;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: var(--tk-wow-accent);
    box-shadow: 0 0 20px var(--tk-wow-accent-soft);
}

/* System topology */

[data-wow-service="system"] .tk-service-schematic {
    right: 26px;
    top: 38px;
    bottom: auto;
}

[data-wow-service="system"] .tk-service-schematic::before,
[data-wow-service="system"] .tk-service-schematic::after {
    content: "";
    position: absolute;
    left: 18px;
    right: 18px;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--tk-wow-accent), transparent);
    opacity: .42;
}

[data-wow-service="system"] .tk-service-schematic::before {
    top: 38px;
    transform: rotate(18deg);
}

[data-wow-service="system"] .tk-service-schematic::after {
    top: 63px;
    transform: rotate(-15deg);
}

[data-wow-service="system"] .tk-service-schematic span {
    position: absolute;
    width: 12px;
    height: 12px;
    border: 1px solid var(--tk-wow-accent-soft);
    border-radius: 4px;
    background: var(--tk-wow-glass);
    box-shadow: 0 0 16px var(--tk-wow-accent-faint);
}

[data-wow-service="system"] .tk-service-schematic span:nth-child(1) { left: 6px; top: 24px; }
[data-wow-service="system"] .tk-service-schematic span:nth-child(2) { left: 54px; top: 42px; }
[data-wow-service="system"] .tk-service-schematic span:nth-child(3) { right: 4px; top: 20px; }
[data-wow-service="system"] .tk-service-schematic span:nth-child(4) { right: 25px; bottom: 13px; }

/* Web browser wireframe */

[data-wow-service="web"] .tk-service-schematic {
    right: 20px;
    top: 28px;
    bottom: auto;
    width: 118px;
    height: 82px;
    overflow: hidden;
    border: 1px solid var(--tk-wow-line);
    border-radius: 10px;
    background: rgba(255, 255, 255, .18);
}

[data-wow-service="web"] .tk-service-schematic::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 20px;
    border-bottom: 1px solid var(--tk-wow-line);
    background:
        radial-gradient(circle at 11px 10px, var(--tk-wow-accent) 0 2px, transparent 2.6px),
        radial-gradient(circle at 20px 10px, rgba(22, 141, 168, .42) 0 2px, transparent 2.6px),
        radial-gradient(circle at 29px 10px, rgba(22, 141, 168, .22) 0 2px, transparent 2.6px);
}

[data-wow-service="web"] .tk-service-schematic span {
    position: absolute;
    left: 10px;
    height: 7px;
    border-radius: 999px;
    background: var(--tk-wow-accent-soft);
}

[data-wow-service="web"] .tk-service-schematic span:nth-child(1) { top: 32px; width: 62%; }
[data-wow-service="web"] .tk-service-schematic span:nth-child(2) { top: 46px; width: 78%; opacity: .55; }
[data-wow-service="web"] .tk-service-schematic span:nth-child(3) { top: 60px; width: 44%; opacity: .35; }

/* Design modules */

[data-wow-service="design"] .tk-service-schematic {
    right: 20px;
    top: 26px;
    bottom: auto;
    width: 116px;
    height: 92px;
}

[data-wow-service="design"] .tk-service-schematic span {
    position: absolute;
    display: block;
    border: 1px solid var(--tk-wow-accent-soft);
    background: rgba(255, 255, 255, .12);
    backdrop-filter: blur(5px);
}

[data-wow-service="design"] .tk-service-schematic span:nth-child(1) {
    left: 8px;
    top: 12px;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    transform: rotate(13deg);
}

[data-wow-service="design"] .tk-service-schematic span:nth-child(2) {
    right: 10px;
    top: 7px;
    width: 35px;
    height: 35px;
    border-radius: 50%;
}

[data-wow-service="design"] .tk-service-schematic span:nth-child(3) {
    left: 45px;
    bottom: 4px;
    width: 48px;
    height: 28px;
    border-radius: 9px;
    transform: rotate(-9deg);
}

[data-wow-service="design"] .tk-service-schematic b {
    position: absolute;
    left: 56px;
    top: 34px;
    color: var(--tk-wow-accent);
    font-family: "Space Grotesk", sans-serif;
    font-size: 18px;
    font-weight: 500;
}

/* Social signal */

[data-wow-service="social"] .tk-service-schematic {
    right: 21px;
    top: 34px;
    bottom: auto;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    gap: 6px;
    height: 72px;
}

[data-wow-service="social"] .tk-service-schematic span {
    width: 8px;
    border-radius: 999px;
    background: linear-gradient(180deg, var(--tk-wow-accent), var(--tk-wow-accent-faint));
    transform-origin: bottom;
    animation: tkSignal 2.8s ease-in-out infinite alternate;
}

[data-wow-service="social"] .tk-service-schematic span:nth-child(1) { height: 22px; animation-delay: -.8s; }
[data-wow-service="social"] .tk-service-schematic span:nth-child(2) { height: 43px; animation-delay: -1.6s; }
[data-wow-service="social"] .tk-service-schematic span:nth-child(3) { height: 61px; animation-delay: -.2s; }
[data-wow-service="social"] .tk-service-schematic span:nth-child(4) { height: 35px; animation-delay: -1.1s; }
[data-wow-service="social"] .tk-service-schematic span:nth-child(5) { height: 50px; animation-delay: -2s; }

/* Growth chart */

[data-wow-service="growth"] .tk-service-schematic {
    right: 28px;
    top: 22px;
    bottom: auto;
    width: 210px;
    height: 90px;
    opacity: .4;
}

[data-wow-service="growth"] .tk-service-schematic svg {
    width: 100%;
    height: 100%;
    overflow: visible;
}

[data-wow-service="growth"] .tk-service-schematic path {
    fill: none;
    stroke: var(--tk-wow-accent);
    stroke-width: 1.5;
    stroke-dasharray: 260;
    stroke-dashoffset: 260;
    animation: tkChartDraw 4.5s var(--ease) infinite;
}

[data-wow-service="growth"] .tk-service-schematic circle {
    fill: var(--tk-wow-accent);
    filter: drop-shadow(0 0 5px var(--tk-wow-accent));
}

@keyframes tkSchematicSpin {
    to { transform: translate(-50%, -50%) rotate(360deg); }
}

@keyframes tkSignal {
    to { transform: scaleY(.45); opacity: .38; }
}

@keyframes tkChartDraw {
    0%, 8% { stroke-dashoffset: 260; opacity: .25; }
    45%, 82% { stroke-dashoffset: 0; opacity: .9; }
    100% { stroke-dashoffset: 0; opacity: .18; }
}

html[data-theme="dark"] .v2-service-card::after {
    background: radial-gradient(circle 190px at var(--tk-pointer-x) var(--tk-pointer-y), rgba(111, 227, 251, .11), transparent 70%);
}

/* ==========================================================
   REFERENCES / CINEMATIC CASE STUDIES
========================================================== */

.v2-ref-slider {
    --tk-pointer-x: 50%;
    --tk-pointer-y: 50%;
    isolation: isolate;
}

.v2-ref-slider::before {
    content: "";
    position: absolute;
    z-index: 30;
    left: -30%;
    top: 0;
    width: 28%;
    height: 1px;
    pointer-events: none;
    background: linear-gradient(90deg, transparent, var(--tk-wow-accent), transparent);
    box-shadow: 0 0 18px var(--tk-wow-accent-soft);
    animation: tkRefTrace 7s ease-in-out infinite;
}

.v2-ref-slider::after {
    content: "CASE STUDY / TK ARCHIVE";
    position: absolute;
    z-index: 20;
    right: 20px;
    bottom: 11px;
    color: var(--tk-wow-text-soft);
    font-family: "Space Grotesk", sans-serif;
    font-size: 6px;
    font-weight: 700;
    letter-spacing: 1.7px;
    opacity: .55;
    pointer-events: none;
}

@keyframes tkRefTrace {
    0%, 15% { transform: translateX(0); opacity: 0; }
    23% { opacity: .8; }
    72% { opacity: .8; }
    84%, 100% { transform: translateX(550%); opacity: 0; }
}

.v2-ref-gallery-stage {
    --tk-pointer-x: 50%;
    --tk-pointer-y: 50%;
    isolation: isolate;
}

.v2-ref-gallery-stage::before {
    content: "";
    position: absolute;
    z-index: 12;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle 210px at var(--tk-pointer-x) var(--tk-pointer-y), rgba(97, 218, 244, .12), transparent 68%);
    mix-blend-mode: screen;
    opacity: .5;
}

html[data-theme="light"] .v2-ref-gallery-stage::before {
    mix-blend-mode: normal;
    opacity: .22;
}

.tk-ref-focus-frame {
    position: absolute;
    z-index: 14;
    inset: 14px;
    pointer-events: none;
}

.tk-ref-focus-frame i {
    position: absolute;
    width: 26px;
    height: 26px;
    border-color: rgba(255, 255, 255, .86);
    opacity: .85;
    filter: drop-shadow(0 0 8px rgba(0, 0, 0, .18));
}

.tk-ref-focus-frame i:nth-child(1) { left: 0; top: 0; border-left: 1px solid; border-top: 1px solid; }
.tk-ref-focus-frame i:nth-child(2) { right: 0; top: 0; border-right: 1px solid; border-top: 1px solid; }
.tk-ref-focus-frame i:nth-child(3) { right: 0; bottom: 0; border-right: 1px solid; border-bottom: 1px solid; }
.tk-ref-focus-frame i:nth-child(4) { left: 0; bottom: 0; border-left: 1px solid; border-bottom: 1px solid; }

.tk-ref-focus-frame span {
    position: absolute;
    right: 0;
    bottom: 0;
    padding: 6px 8px;
    color: rgba(255, 255, 255, .84);
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 999px;
    background: rgba(0, 0, 0, .18);
    backdrop-filter: blur(8px);
    font-size: 6px;
    font-weight: 800;
    letter-spacing: 1.2px;
}

.v2-ref-image.is-active img {
    animation: tkRefBreath 11s ease-in-out infinite alternate;
}

@keyframes tkRefBreath {
    from { transform: scale(1); }
    to { transform: scale(1.018); }
}

.v2-ref-content {
    overflow: hidden;
    isolation: isolate;
}

.v2-ref-content::before {
    content: attr(data-wow-code);
    position: absolute;
    z-index: 0;
    right: -4px;
    top: 44px;
    color: transparent;
    -webkit-text-stroke: 1px rgba(22, 141, 168, .08);
    font-family: "Space Grotesk", sans-serif;
    font-size: 126px;
    font-weight: 600;
    line-height: .8;
    letter-spacing: -7px;
    pointer-events: none;
}

.v2-ref-content > * {
    position: relative;
    z-index: 2;
}

html[data-theme="dark"] .v2-ref-content::before {
    -webkit-text-stroke-color: rgba(111, 227, 251, .06);
}

.v2-ref-project.is-active .v2-ref-content h3,
.v2-ref-project.is-active .v2-ref-description,
.v2-ref-project.is-active .v2-ref-tags,
.v2-ref-project.is-active .v2-ref-info,
.v2-ref-project.is-active .v2-ref-live-link {
    animation: tkRefContentIn .72s var(--ease) both;
}

.v2-ref-project.is-active .v2-ref-description { animation-delay: .06s; }
.v2-ref-project.is-active .v2-ref-tags { animation-delay: .10s; }
.v2-ref-project.is-active .v2-ref-info { animation-delay: .14s; }
.v2-ref-project.is-active .v2-ref-live-link { animation-delay: .18s; }

@keyframes tkRefContentIn {
    from { opacity: 0; transform: translateY(16px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ==========================================================
   ABOUT / LIVE METHOD ENGINE
========================================================== */

.v2-about-panel {
    --tk-pointer-x: 72%;
    --tk-pointer-y: 40%;
    position: relative;
    isolation: isolate;
}

.v2-about-panel::before {
    content: "";
    position: absolute;
    z-index: 0;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle 240px at var(--tk-pointer-x) var(--tk-pointer-y), var(--tk-wow-accent-faint), transparent 68%),
        linear-gradient(var(--tk-wow-grid) 1px, transparent 1px),
        linear-gradient(90deg, var(--tk-wow-grid) 1px, transparent 1px);
    background-size: auto, 48px 48px, 48px 48px;
    mask-image: linear-gradient(90deg, transparent 35%, #000 100%);
    opacity: .72;
}

.v2-about-main,
.v2-about-system {
    position: relative;
    z-index: 2;
}

.v2-about-system {
    overflow: hidden;
}

.v2-about-system::before {
    content: "";
    position: absolute;
    left: 61px;
    top: 89px;
    bottom: 54px;
    width: 1px;
    background: linear-gradient(180deg, transparent, var(--tk-wow-line) 12%, var(--tk-wow-line) 88%, transparent);
}

.v2-about-system::after {
    content: "";
    position: absolute;
    left: 58px;
    top: 96px;
    width: 7px;
    height: 42px;
    border-radius: 999px;
    background: linear-gradient(180deg, transparent, var(--tk-wow-accent), transparent);
    box-shadow: 0 0 18px var(--tk-wow-accent-soft);
    animation: tkMethodScan 5.4s ease-in-out infinite;
}

@keyframes tkMethodScan {
    0%, 10% { transform: translateY(0); opacity: 0; }
    20% { opacity: .9; }
    75% { opacity: .9; }
    90%, 100% { transform: translateY(235px); opacity: 0; }
}

.v2-about-step {
    margin: 0 -14px;
    padding-left: 14px;
    padding-right: 14px;
    border-radius: 14px;
    transition: background .35s ease, transform .35s var(--ease), border-color .35s ease;
}

.v2-about-step::after {
    content: "";
    position: absolute;
    right: 10px;
    top: 50%;
    width: 6px;
    height: 6px;
    transform: translateY(-50%) scale(.4);
    border-radius: 50%;
    background: var(--tk-wow-accent);
    box-shadow: 0 0 18px var(--tk-wow-accent-soft);
    opacity: 0;
    transition: opacity .3s ease, transform .3s var(--ease);
}

.v2-about-step.is-wow-active {
    transform: translateX(5px);
    background: linear-gradient(90deg, var(--tk-wow-accent-faint), transparent 78%);
}

.v2-about-step.is-wow-active::after {
    opacity: 1;
    transform: translateY(-50%) scale(1);
}

.v2-about-step.is-wow-active .v2-about-step-number {
    color: #06242c;
    border-color: transparent;
    background: linear-gradient(135deg, #bdf7ff, #61dffb);
    box-shadow: 0 8px 24px rgba(57, 184, 211, .20);
}

.v2-about-values article {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.v2-about-values article::before {
    content: "";
    position: absolute;
    z-index: 0;
    right: -34px;
    top: -34px;
    width: 115px;
    height: 115px;
    border: 1px solid var(--tk-wow-line);
    border-radius: 50%;
    box-shadow: inset 0 0 0 18px transparent, inset 0 0 0 19px var(--tk-wow-line);
    opacity: .55;
    transition: transform .55s var(--ease), opacity .35s ease;
}

.v2-about-values article::after {
    content: "+";
    position: absolute;
    z-index: 1;
    right: 23px;
    top: 19px;
    color: var(--tk-wow-accent);
    font-family: "Space Grotesk", sans-serif;
    font-size: 13px;
    opacity: .45;
}

.v2-about-values article:hover::before {
    transform: rotate(42deg) scale(1.12);
    opacity: .9;
}

.v2-about-values article > * {
    position: relative;
    z-index: 2;
}

/* ==========================================================
   CONTACT / COMMAND CENTER
========================================================== */

.v2-contact-panel {
    --tk-pointer-x: 72%;
    --tk-pointer-y: 50%;
    position: relative;
    isolation: isolate;
}

.v2-contact-panel::before {
    content: "";
    position: absolute;
    z-index: 0;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle 250px at var(--tk-pointer-x) var(--tk-pointer-y), var(--tk-wow-accent-faint), transparent 70%);
}

.v2-contact-main,
.v2-contact-side {
    position: relative;
    z-index: 2;
}

.v2-contact-side {
    isolation: isolate;
}

.v2-contact-side::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    background:
        linear-gradient(var(--tk-wow-grid) 1px, transparent 1px),
        linear-gradient(90deg, var(--tk-wow-grid) 1px, transparent 1px);
    background-size: 34px 34px;
    mask-image: radial-gradient(circle at 75% 72%, black, transparent 68%);
    opacity: .9;
    pointer-events: none;
}

.v2-contact-status-icon span {
    animation: tkOnlinePulse 2.4s ease-in-out infinite;
}

@keyframes tkOnlinePulse {
    0%, 100% { transform: scale(.9); box-shadow: 0 0 8px rgba(44,196,127,.7), 0 0 16px rgba(44,196,127,.20); }
    50% { transform: scale(1.15); box-shadow: 0 0 12px rgba(44,196,127,1), 0 0 30px rgba(44,196,127,.42); }
}

.tk-contact-console {
    position: relative;
    z-index: 10;
    margin-top: 26px;
    padding: 12px 14px;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 10px;
    overflow: hidden;
    border: 1px solid var(--tk-wow-line);
    border-radius: 12px;
    background: rgba(255, 255, 255, .22);
    backdrop-filter: blur(8px);
}

html[data-theme="dark"] .tk-contact-console {
    background: rgba(255, 255, 255, .018);
}

.tk-contact-console::after {
    content: "";
    position: absolute;
    left: -35%;
    top: 0;
    width: 28%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(111, 227, 251, .06), transparent);
    animation: tkConsoleSweep 4.8s ease-in-out infinite;
}

@keyframes tkConsoleSweep {
    0%, 14% { transform: translateX(0); }
    76%, 100% { transform: translateX(520%); }
}

.tk-contact-console > i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #2cc47f;
    box-shadow: 0 0 14px rgba(44, 196, 127, .7);
}

.tk-contact-console span {
    color: var(--tk-wow-text-soft);
    font-size: 6px;
    font-weight: 800;
    letter-spacing: 1.35px;
}

.tk-contact-console code {
    color: var(--tk-wow-accent);
    font-family: "Space Grotesk", monospace;
    font-size: 7px;
    letter-spacing: 1px;
}

.v2-contact-whatsapp,
.v2-contact-call {
    isolation: isolate;
    overflow: hidden;
}

.v2-contact-whatsapp::before,
.v2-contact-call::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    transform: translateX(-102%);
    background: linear-gradient(105deg, transparent 12%, rgba(255,255,255,.16) 50%, transparent 88%);
    transition: transform .65s var(--ease);
}

.v2-contact-whatsapp:hover::before,
.v2-contact-call:hover::before {
    transform: translateX(102%);
}

.v2-contact-system {
    transition: transform .8s var(--ease), opacity .5s ease;
}

.v2-contact-panel:hover .v2-contact-system {
    opacity: .72;
}

/* ==========================================================
   FOOTER / SIGNAL STRIP
========================================================== */

.v2-footer {
    position: relative;
    overflow: hidden;
}

.tk-footer-marquee {
    width: min(var(--shell), calc(100% - 48px));
    margin: 0 auto 4px;
    overflow: hidden;
    border-top: 1px solid var(--tk-wow-line);
    border-bottom: 1px solid var(--tk-wow-line);
    mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}

.tk-footer-marquee-track {
    width: max-content;
    padding: 10px 0;
    display: flex;
    align-items: center;
    gap: 28px;
    animation: tkFooterRail 22s linear infinite;
}

.tk-footer-marquee-track span {
    color: var(--tk-wow-text-soft);
    font-family: "Space Grotesk", sans-serif;
    font-size: 6px;
    font-weight: 700;
    letter-spacing: 2px;
    white-space: nowrap;
}

.tk-footer-marquee-track i {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--tk-wow-accent);
    box-shadow: 0 0 10px var(--tk-wow-accent-soft);
}

@keyframes tkFooterRail {
    to { transform: translateX(-50%); }
}

/* ==========================================================
   REACTIVE SURFACES
========================================================== */

.tk-reactive-surface {
    --tk-pointer-x: 50%;
    --tk-pointer-y: 50%;
}

@media (hover: hover) and (pointer: fine) {
    .v2-ref-gallery-stage .v2-ref-image.is-active img {
        transform-origin: var(--tk-pointer-x) var(--tk-pointer-y);
    }

    .v2-about-values article,
    .v2-service-card,
    .v2-ref-project-buttons button,
    .v2-contact-whatsapp,
    .v2-contact-call {
        will-change: transform;
    }
}

/* ==========================================================
   RESPONSIVE POLISH
========================================================== */

@media (max-width: 1050px) {
    .tk-section-watermark {
        right: 22px;
        top: 26px;
        opacity: .52;
    }

    .tk-section-watermark strong {
        font-size: 110px;
    }

    [data-wow-service="technical"] .tk-service-schematic,
    [data-wow-service="system"] .tk-service-schematic,
    [data-wow-service="growth"] .tk-service-schematic {
        opacity: .35;
    }

    .v2-about-system::before,
    .v2-about-system::after {
        display: none;
    }
}

@media (max-width: 650px) {
    .tk-section-watermark {
        top: 10px;
        right: 16px;
        opacity: .32;
    }

    .tk-section-watermark strong {
        font-size: 72px;
        letter-spacing: -5px;
    }

    .tk-section-watermark span {
        display: none;
    }

    .v2-services::before,
    .v2-references::before,
    .v2-about::before,
    .v2-contact::before {
        width: 42px;
    }

    .tk-hero-corners {
        inset: 10px;
    }

    .tk-hero-corners i {
        width: 18px;
        height: 18px;
    }

    .tk-service-schematic {
        opacity: .18 !important;
        transform: scale(.82);
        transform-origin: top right;
    }

    [data-wow-service="technical"] .tk-service-schematic,
    [data-wow-service="system"] .tk-service-schematic,
    [data-wow-service="web"] .tk-service-schematic,
    [data-wow-service="design"] .tk-service-schematic,
    [data-wow-service="social"] .tk-service-schematic {
        top: 18px;
        right: 12px;
    }

    [data-wow-service="growth"] .tk-service-schematic {
        display: none;
    }

    .tk-ref-focus-frame {
        inset: 9px;
    }

    .tk-ref-focus-frame span {
        display: none;
    }

    .v2-ref-slider::after {
        display: none;
    }

    .v2-ref-content::before {
        font-size: 86px;
        right: 2px;
        top: 38px;
    }

    .v2-about-panel::before,
    .v2-contact-panel::before,
    .v2-contact-side::before {
        opacity: .45;
    }

    .tk-contact-console {
        margin-top: 20px;
    }

    .tk-footer-marquee {
        width: calc(100% - 32px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .tk-service-schematic *,
    .v2-hero-panel::after,
    .v2-ref-slider::before,
    .v2-ref-image.is-active img,
    .v2-about-system::after,
    .v2-contact-status-icon span,
    .tk-contact-console::after,
    .tk-footer-marquee-track {
        animation: none !important;
    }

    html.tk-wow-ready .tk-reveal {
        opacity: 1;
        transform: none;
        filter: none;
    }
}

/* ==========================================================
   TK TECH / SAHNE DENEYİMİ V2
   Açılış, tema geçişi, bölüm imzaları ve final footer
========================================================== */

/* ---------- AÇILIŞ / DİJİTAL İMZA ---------- */

.v2-boot {
    position: fixed;
    z-index: 999999;
    inset: 0;
    display: none;
    place-items: center;
    overflow: hidden;
    color: #eafcff;
    background: #020506;
    opacity: 1;
    transform: none;
    isolation: isolate;
}

html.tk-boot-pending .v2-boot {
    display: grid;
}

.tk-boot-curtain {
    position: absolute;
    z-index: -1;
    top: 0;
    bottom: 0;
    width: 50.2%;
    background:
        radial-gradient(circle at 50% 45%, rgba(82, 225, 255, .08), transparent 38%),
        linear-gradient(180deg, #061014, #020506 66%);
    transition: transform .5s cubic-bezier(.72, 0, .18, 1);
}

.tk-boot-curtain-left { left: 0; transform-origin: left center; }
.tk-boot-curtain-right { right: 0; transform-origin: right center; }

.v2-boot-grid {
    position: absolute;
    z-index: 0;
    inset: -12%;
    background-image:
        linear-gradient(rgba(111, 227, 251, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(111, 227, 251, .055) 1px, transparent 1px);
    background-size: 54px 54px;
    mask-image: radial-gradient(circle at center, #000 0 44%, transparent 76%);
    transform: perspective(700px) rotateX(62deg) translateY(18%);
    transform-origin: center 58%;
    opacity: 0;
}

.v2-boot.is-awake .v2-boot-grid {
    animation: tkBootGridIn 1s .08s var(--ease) forwards;
}

@keyframes tkBootGridIn {
    from { opacity: 0; transform: perspective(700px) rotateX(66deg) translateY(25%) scale(.92); }
    to { opacity: .72; transform: perspective(700px) rotateX(62deg) translateY(18%) scale(1); }
}

.v2-boot-glow {
    position: absolute;
    z-index: 0;
    left: 50%;
    top: 48%;
    width: min(72vw, 900px);
    aspect-ratio: 1;
    transform: translate(-50%, -50%) scale(.48);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(83, 224, 255, .17), rgba(31, 123, 146, .06) 32%, transparent 68%);
    filter: blur(14px);
    opacity: 0;
}

.v2-boot.is-awake .v2-boot-glow {
    animation: tkBootGlow 1.35s .1s var(--ease) forwards;
}

@keyframes tkBootGlow {
    0% { opacity: 0; transform: translate(-50%, -50%) scale(.35); }
    55% { opacity: 1; }
    100% { opacity: .74; transform: translate(-50%, -50%) scale(1); }
}

.tk-boot-scan {
    position: absolute;
    z-index: 2;
    left: 8%;
    right: 8%;
    top: -2px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(111,227,251,.2), #baf5ff, rgba(111,227,251,.2), transparent);
    box-shadow: 0 0 22px rgba(111,227,251,.5);
    opacity: 0;
}

.v2-boot.is-awake .tk-boot-scan {
    animation: tkBootScan 1.65s .12s cubic-bezier(.55,0,.2,1) forwards;
}

@keyframes tkBootScan {
    0% { top: 0; opacity: 0; }
    8% { opacity: 1; }
    86% { opacity: .8; }
    100% { top: 100%; opacity: 0; }
}

.tk-boot-ghost {
    position: absolute;
    z-index: 0;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -47%) scale(.82);
    color: transparent;
    -webkit-text-stroke: 1px rgba(160, 237, 255, .065);
    font-family: "Space Grotesk", sans-serif;
    font-size: clamp(110px, 20vw, 320px);
    font-weight: 700;
    line-height: .8;
    letter-spacing: -.08em;
    white-space: nowrap;
    opacity: 0;
    user-select: none;
}

.v2-boot.is-awake .tk-boot-ghost {
    animation: tkBootGhost 1.55s .12s var(--ease) forwards;
}

@keyframes tkBootGhost {
    from { opacity: 0; transform: translate(-50%, -47%) scale(.74); filter: blur(12px); }
    to { opacity: 1; transform: translate(-50%, -47%) scale(1); filter: blur(0); }
}

.v2-boot-content {
    position: relative;
    z-index: 5;
    width: min(420px, calc(100vw - 44px));
    display: grid;
    justify-items: center;
    text-align: center;
    opacity: 0;
    transform: translateY(18px) scale(.96);
}

.v2-boot.is-awake .v2-boot-content {
    animation: tkBootContentIn .7s .16s var(--ease) forwards;
}

@keyframes tkBootContentIn {
    to { opacity: 1; transform: translateY(0) scale(1); }
}

.tk-boot-kicker {
    margin-bottom: 30px;
    display: flex;
    align-items: center;
    gap: 12px;
    color: #769096;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: 2.1px;
}

.tk-boot-kicker span {
    width: 30px;
    height: 1px;
    background: linear-gradient(90deg, transparent, #6fe3fb);
}

.tk-boot-kicker span:last-child { transform: scaleX(-1); }

.v2-boot-core {
    position: relative;
    width: 132px;
    height: 132px;
    display: grid;
    place-items: center;
}

.v2-boot-ring,
.tk-boot-ring-pulse {
    position: absolute;
    inset: 0;
    border: 1px solid rgba(111,227,251,.24);
    border-radius: 50%;
}

.v2-boot-ring-one {
    inset: 7px;
    border-top-color: #7cecff;
    border-right-color: transparent;
    animation: tkBootRing 4s linear infinite;
}

.v2-boot-ring-two {
    inset: 20px;
    border-bottom-color: #baf5ff;
    border-left-color: transparent;
    animation: tkBootRing 2.6s linear infinite reverse;
}

.tk-boot-ring-pulse {
    inset: 36px;
    border-color: rgba(111,227,251,.32);
    box-shadow: 0 0 36px rgba(111,227,251,.08), inset 0 0 26px rgba(111,227,251,.06);
    animation: tkBootPulse 1.7s ease-in-out infinite;
}

@keyframes tkBootRing { to { transform: rotate(360deg); } }
@keyframes tkBootPulse { 50% { transform: scale(1.13); opacity: .48; } }

.v2-boot-mark {
    position: relative;
    z-index: 3;
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    color: #c8f8ff;
    clip-path: polygon(25% 5%,75% 5%,95% 25%,95% 75%,75% 95%,25% 95%,5% 75%,5% 25%);
    border: 1px solid rgba(111,227,251,.32);
    background: linear-gradient(145deg, rgba(111,227,251,.12), rgba(255,255,255,.015));
    box-shadow: 0 0 34px rgba(111,227,251,.12);
    font-family: "Space Grotesk", sans-serif;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: -.5px;
}

.v2-boot-brand { margin-top: 24px; }
.v2-boot-brand strong {
    display: block;
    color: #f5fdff;
    font-family: "Space Grotesk", sans-serif;
    font-size: 24px;
    letter-spacing: 5px;
}
.v2-boot-brand small {
    display: block;
    margin-top: 6px;
    color: #62787e;
    font-size: 6px;
    font-weight: 800;
    letter-spacing: 2px;
}

.v2-boot-status {
    width: 100%;
    margin-top: 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #6a8087;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: 1.7px;
}

.v2-boot-status strong {
    color: #bdf7ff;
    font-family: "Space Grotesk", sans-serif;
    font-size: 9px;
}

.v2-boot-progress {
    position: relative;
    width: 100%;
    height: 2px;
    margin-top: 10px;
    overflow: hidden;
    background: rgba(255,255,255,.055);
}
.v2-boot-progress > span {
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 100%;
    background: linear-gradient(90deg, #1e94ad, #72e8ff, #d5fbff);
    box-shadow: 0 0 18px rgba(79,222,248,.85);
    transition: width .28s var(--ease);
}

.v2-boot-online {
    margin-top: 17px;
    display: flex;
    align-items: center;
    gap: 7px;
    color: #5b7076;
    font-size: 6px;
    font-weight: 800;
    letter-spacing: 1.7px;
    opacity: .35;
}
.v2-boot-online i {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #496267;
}
.v2-boot.is-online .v2-boot-online { color: #79e8ba; opacity: 1; }
.v2-boot.is-online .v2-boot-online i {
    background: #67eab8;
    box-shadow: 0 0 12px rgba(103,234,184,.95);
}
.v2-boot.is-online .v2-boot-mark {
    animation: tkBootReady .34s var(--ease) both;
}
@keyframes tkBootReady {
    50% { transform: scale(1.18); filter: brightness(1.6); }
}

.v2-boot.is-revealing .v2-boot-content {
    opacity: 0;
    transform: scale(1.08);
    filter: blur(8px);
    transition: opacity .34s ease, transform .5s var(--ease), filter .34s ease;
}

.v2-boot.is-leaving {
    opacity: 1;
    transform: none;
    background: transparent;
    pointer-events: none;
}
.v2-boot.is-leaving .tk-boot-curtain-left { transform: translateX(-101%); }
.v2-boot.is-leaving .tk-boot-curtain-right { transform: translateX(101%); }
.v2-boot.is-leaving .v2-boot-grid,
.v2-boot.is-leaving .v2-boot-glow,
.v2-boot.is-leaving .tk-boot-ghost,
.v2-boot.is-leaving .tk-boot-scan { opacity: 0; transition: opacity .25s ease; }

/* ---------- TEMA GEÇİŞİ / EKRANI DÖNÜŞTÜREN DALGA ---------- */

.tk-theme-transition {
    --tk-theme-x: 50vw;
    --tk-theme-y: 46px;
    position: fixed;
    z-index: 999998;
    inset: 0;
    pointer-events: none;
    visibility: hidden;
    overflow: hidden;
    clip-path: circle(0 at var(--tk-theme-x) var(--tk-theme-y));
    transition: clip-path .68s cubic-bezier(.72,0,.18,1), visibility 0s .72s;
    isolation: isolate;
}

.tk-theme-transition.to-dark {
    color: #f0fbfd;
    background: #030607;
}
.tk-theme-transition.to-light {
    color: #10242a;
    background: #f4f8fa;
}

.tk-theme-transition.is-active {
    visibility: visible;
    clip-path: circle(160vmax at var(--tk-theme-x) var(--tk-theme-y));
    transition: clip-path .68s cubic-bezier(.72,0,.18,1), visibility 0s;
}

.tk-theme-transition-fill {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at var(--tk-theme-x) var(--tk-theme-y), rgba(111,227,251,.22), transparent 22%),
        radial-gradient(circle at 50% 50%, rgba(111,227,251,.06), transparent 42%);
}
.tk-theme-transition.to-light .tk-theme-transition-fill {
    background:
        radial-gradient(circle at var(--tk-theme-x) var(--tk-theme-y), rgba(22,141,168,.18), transparent 22%),
        radial-gradient(circle at 50% 50%, rgba(255,255,255,.9), transparent 52%);
}

.tk-theme-transition-grid {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(111,227,251,.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(111,227,251,.05) 1px, transparent 1px);
    background-size: 58px 58px;
    mask-image: radial-gradient(circle at var(--tk-theme-x) var(--tk-theme-y), #000, transparent 68%);
    opacity: .7;
}
.tk-theme-transition.to-light .tk-theme-transition-grid {
    background-image:
        linear-gradient(rgba(22,141,168,.055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(22,141,168,.055) 1px, transparent 1px);
}

.tk-theme-transition-core {
    position: absolute;
    left: 50%;
    top: 50%;
    display: grid;
    justify-items: center;
    transform: translate(-50%, -50%) scale(.72);
    opacity: 0;
}
.tk-theme-transition.is-active .tk-theme-transition-core {
    animation: tkThemeCore .72s .12s var(--ease) forwards;
}
@keyframes tkThemeCore {
    45% { opacity: 1; transform: translate(-50%, -50%) scale(1.08); }
    100% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}

.tk-theme-transition-icon {
    width: 92px;
    height: 92px;
    display: grid;
    place-items: center;
    border: 1px solid currentColor;
    border-radius: 50%;
    font-size: 35px;
    box-shadow: 0 0 0 14px rgba(111,227,251,.035), 0 0 50px rgba(111,227,251,.12);
}
.tk-theme-transition.to-light .tk-theme-transition-icon {
    box-shadow: 0 0 0 14px rgba(22,141,168,.035), 0 0 50px rgba(22,141,168,.08);
}

.tk-theme-transition-core strong {
    margin-top: 22px;
    font-family: "Space Grotesk", sans-serif;
    font-size: clamp(24px, 3vw, 40px);
    font-weight: 600;
    letter-spacing: -1.2px;
}
.tk-theme-transition-core small {
    margin-top: 7px;
    opacity: .48;
    font-size: 6px;
    font-weight: 800;
    letter-spacing: 2px;
}

.tk-theme-transition.is-settled .tk-theme-transition-core {
    opacity: 0;
    transform: translate(-50%, -50%) scale(1.12);
    transition: opacity .24s ease, transform .3s ease;
}

html.tk-theme-changing body > *:not(.tk-theme-transition):not(.v2-boot) {
    transition-duration: .12s !important;
}

/* ---------- BÖLÜMLERİN KENDİ İMZASI ---------- */

.tk-section-signature {
    position: absolute;
    z-index: 0;
    pointer-events: none;
    user-select: none;
}

.tk-section-signature-services {
    right: max(18px, calc((100vw - var(--shell)) / 2 - 18px));
    top: 150px;
    display: grid;
    gap: 7px;
}
.tk-section-signature-services span {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    color: var(--tk-wow-text-soft);
    border: 1px solid var(--tk-wow-line);
    border-radius: 8px;
    font-family: "Space Grotesk", sans-serif;
    font-size: 7px;
    opacity: .36;
    transform: translateX(20px);
    transition: opacity .4s ease, transform .45s var(--ease), background .4s ease;
}
.v2-services.is-section-live .tk-section-signature-services span {
    opacity: .62;
    transform: translateX(0);
}
.v2-services.is-section-live .tk-section-signature-services span:nth-child(2) { transition-delay: .05s; }
.v2-services.is-section-live .tk-section-signature-services span:nth-child(3) { transition-delay: .10s; }
.v2-services.is-section-live .tk-section-signature-services span:nth-child(4) { transition-delay: .15s; }
.v2-services.is-section-live .tk-section-signature-services span:nth-child(5) { transition-delay: .20s; }
.v2-services.is-section-live .tk-section-signature-services span:nth-child(6) { transition-delay: .25s; }

.v2-services-grid {
    perspective: 1400px;
}
.v2-services-grid.has-focused-card .v2-service-card:not(.is-focused-card) {
    opacity: .52;
    transform: scale(.985);
    filter: saturate(.65);
}
.v2-services-grid .v2-service-card {
    transition: transform .45s var(--ease), opacity .35s ease, filter .35s ease, border-color .35s ease, box-shadow .45s ease;
}
.v2-services-grid .v2-service-card.is-focused-card {
    z-index: 8;
    transform: translateY(-8px) scale(1.012);
    border-color: var(--tk-wow-accent-soft);
    box-shadow: 0 30px 80px rgba(18,116,139,.13), inset 0 1px 0 rgba(255,255,255,.06);
}
html[data-theme="dark"] .v2-services-grid .v2-service-card.is-focused-card {
    box-shadow: 0 32px 90px rgba(0,0,0,.48), 0 0 48px rgba(111,227,251,.045), inset 0 1px 0 rgba(255,255,255,.04);
}

.v2-service-card::after {
    content: "";
    position: absolute;
    z-index: 0;
    left: -60%;
    top: 0;
    width: 40%;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--tk-wow-accent), transparent);
    opacity: 0;
}
.v2-service-card.is-focused-card::after {
    opacity: .9;
    animation: tkServiceTrace 1.2s var(--ease) both;
}
@keyframes tkServiceTrace { to { transform: translateX(410%); } }

.tk-section-signature-references {
    left: 50%;
    top: 112px;
    width: min(var(--shell), calc(100% - 48px));
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: 16px;
    color: var(--tk-wow-text-soft);
    opacity: .28;
}
.tk-section-signature-references span {
    font-size: 7px;
    font-weight: 800;
    letter-spacing: 2.5px;
}
.tk-section-signature-references i {
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, var(--tk-wow-line), transparent);
    transform: scaleX(.1);
    transform-origin: left;
    transition: transform 1.1s var(--ease);
}
.tk-section-signature-references b {
    font-family: "Space Grotesk", sans-serif;
    font-size: 10px;
    font-weight: 600;
}
.v2-references.is-section-live .tk-section-signature-references i { transform: scaleX(1); }

.v2-references .v2-ref-slider {
    box-shadow: 0 40px 120px rgba(15,87,103,.09);
    transform-origin: 50% 20%;
    transition: box-shadow .6s ease, transform .8s var(--ease);
}
.v2-references.is-section-live .v2-ref-slider {
    transform: perspective(1800px) rotateX(.35deg);
}
html[data-theme="dark"] .v2-references .v2-ref-slider {
    box-shadow: 0 45px 130px rgba(0,0,0,.42), 0 0 60px rgba(111,227,251,.025);
}
.v2-ref-slider::after { content: "PROJE ARŞİVİ / TK TECH"; }

.tk-section-signature-about {
    right: max(24px, calc((100vw - var(--shell)) / 2));
    top: 120px;
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--tk-wow-text-soft);
    font-size: 6px;
    font-weight: 800;
    letter-spacing: 1.5px;
    opacity: .35;
}
.tk-section-signature-about i {
    width: 18px;
    height: 1px;
    background: var(--tk-wow-line);
}
.v2-about.is-section-live .tk-section-signature-about span {
    animation: tkAboutSignature 2.8s ease-in-out infinite;
}
.v2-about.is-section-live .tk-section-signature-about span:nth-of-type(2) { animation-delay: .55s; }
.v2-about.is-section-live .tk-section-signature-about span:nth-of-type(3) { animation-delay: 1.1s; }
@keyframes tkAboutSignature { 50% { color: var(--tk-wow-accent); opacity: 1; } }

.v2-about-panel {
    overflow: hidden;
}
.v2-about-panel::after {
    content: "";
    position: absolute;
    z-index: 1;
    left: -20%;
    bottom: 0;
    width: 140%;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--tk-wow-accent), transparent);
    transform: translateX(-30%);
    opacity: 0;
}
.v2-about.is-section-live .v2-about-panel::after {
    animation: tkAboutRail 5.2s ease-in-out infinite;
}
@keyframes tkAboutRail {
    0%, 15% { opacity: 0; transform: translateX(-34%); }
    30%, 72% { opacity: .45; }
    88%, 100% { opacity: 0; transform: translateX(34%); }
}

.v2-about-step.is-wow-active h4 {
    color: var(--tk-wow-accent);
    transform: translateX(2px);
    transition: color .3s ease, transform .3s ease;
}

.tk-section-signature-contact {
    left: max(24px, calc((100vw - var(--shell)) / 2));
    top: 118px;
    display: flex;
    align-items: center;
    gap: 9px;
    color: var(--tk-wow-text-soft);
    font-size: 6px;
    font-weight: 800;
    letter-spacing: 1.6px;
    opacity: .34;
}
.tk-section-signature-contact i {
    width: 30px;
    height: 1px;
    background: linear-gradient(90deg, var(--tk-wow-line), transparent);
}

.v2-contact-panel {
    overflow: hidden;
}
.v2-contact-panel::after {
    content: "";
    position: absolute;
    z-index: 1;
    right: -90px;
    top: 50%;
    width: 430px;
    height: 430px;
    transform: translateY(-50%) scale(.8);
    border: 1px solid var(--tk-wow-line);
    border-radius: 50%;
    box-shadow:
        0 0 0 52px rgba(111,227,251,.015),
        0 0 0 104px rgba(111,227,251,.01);
    opacity: .15;
    pointer-events: none;
    transition: transform 1.1s var(--ease), opacity .6s ease;
}
.v2-contact.is-section-live .v2-contact-panel::after {
    transform: translateY(-50%) scale(1);
    opacity: .42;
}
html[data-theme="light"] .v2-contact-panel::after {
    box-shadow: 0 0 0 52px rgba(22,141,168,.018), 0 0 0 104px rgba(22,141,168,.01);
}

/* ---------- FOOTER / FİNAL SAHNESİ ---------- */

.v2-footer.tk-footer-stage {
    --tk-pointer-x: 50%;
    --tk-pointer-y: 25%;
    position: relative;
    z-index: 2;
    margin-top: 70px;
    padding: 0 0 24px;
    overflow: hidden;
    color: #e8f7fa;
    border-top: 1px solid rgba(111,227,251,.1);
    background:
        radial-gradient(circle 520px at var(--tk-pointer-x) var(--tk-pointer-y), rgba(58,203,236,.10), transparent 70%),
        linear-gradient(180deg, #061014 0%, #030708 48%, #020405 100%);
    isolation: isolate;
}

html[data-theme="light"] .v2-footer.tk-footer-stage {
    color: #12282e;
    border-top-color: rgba(22,141,168,.12);
    background:
        radial-gradient(circle 520px at var(--tk-pointer-x) var(--tk-pointer-y), rgba(22,141,168,.09), transparent 70%),
        linear-gradient(180deg, #edf6f8 0%, #f7fbfc 54%, #edf4f6 100%);
}

.v2-footer.tk-footer-stage::before {
    content: "";
    position: absolute;
    z-index: -2;
    inset: 0;
    background-image:
        linear-gradient(rgba(111,227,251,.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(111,227,251,.035) 1px, transparent 1px);
    background-size: 72px 72px;
    mask-image: linear-gradient(180deg, #000, transparent 72%);
    opacity: .62;
}
html[data-theme="light"] .v2-footer.tk-footer-stage::before {
    background-image:
        linear-gradient(rgba(22,141,168,.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(22,141,168,.04) 1px, transparent 1px);
}

.tk-footer-portal {
    position: absolute;
    z-index: -1;
    left: 50%;
    top: -270px;
    width: min(900px, 88vw);
    aspect-ratio: 1;
    transform: translateX(-50%);
    border-radius: 50%;
    pointer-events: none;
}
.tk-footer-orbit {
    position: absolute;
    inset: 0;
    border: 1px solid rgba(111,227,251,.08);
    border-radius: 50%;
    opacity: .52;
}
.tk-footer-orbit-two { inset: 12%; opacity: .32; }
.tk-footer-orbit::before,
.tk-footer-orbit::after {
    content: "";
    position: absolute;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #6fe3fb;
    box-shadow: 0 0 18px rgba(111,227,251,.65);
}
.tk-footer-orbit-one::before { left: 15%; top: 17%; }
.tk-footer-orbit-one::after { right: 8%; top: 48%; }
.tk-footer-orbit-two::before { left: 50%; bottom: -3px; }
.tk-footer-orbit-two::after { right: 17%; top: 17%; }

.v2-footer.is-section-live .tk-footer-orbit-one { animation: tkFooterOrbit 30s linear infinite; }
.v2-footer.is-section-live .tk-footer-orbit-two { animation: tkFooterOrbit 22s linear infinite reverse; }
@keyframes tkFooterOrbit { to { transform: rotate(360deg); } }

.tk-footer-horizon {
    position: absolute;
    left: 5%;
    right: 5%;
    top: 50%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(111,227,251,.68), transparent);
    box-shadow: 0 0 30px rgba(111,227,251,.22);
}
.tk-footer-core {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 62px;
    height: 62px;
    display: grid;
    place-items: center;
    transform: translate(-50%, -50%);
    color: #baf5ff;
    border: 1px solid rgba(111,227,251,.22);
    clip-path: polygon(25% 5%,75% 5%,95% 25%,95% 75%,75% 95%,25% 95%,5% 75%,5% 25%);
    background: rgba(4,14,17,.82);
    font-family: "Space Grotesk", sans-serif;
    font-size: 15px;
    font-weight: 700;
    box-shadow: 0 0 45px rgba(111,227,251,.10);
}
html[data-theme="light"] .tk-footer-orbit { border-color: rgba(22,141,168,.10); }
html[data-theme="light"] .tk-footer-orbit::before,
html[data-theme="light"] .tk-footer-orbit::after { background: #168da8; box-shadow: 0 0 16px rgba(22,141,168,.28); }
html[data-theme="light"] .tk-footer-horizon { background: linear-gradient(90deg, transparent, rgba(22,141,168,.42), transparent); box-shadow: 0 0 26px rgba(22,141,168,.12); }
html[data-theme="light"] .tk-footer-core { color: #126f84; border-color: rgba(22,141,168,.2); background: rgba(244,248,250,.85); }

.v2-footer .tk-footer-marquee {
    width: 100%;
    margin: 0;
    border-top: 0;
    border-bottom: 1px solid rgba(111,227,251,.08);
    mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
}
html[data-theme="light"] .v2-footer .tk-footer-marquee { border-bottom-color: rgba(22,141,168,.1); }
.v2-footer .tk-footer-marquee-track { padding: 14px 0; gap: 32px; }
.v2-footer .tk-footer-marquee-track span { color: currentColor; opacity: .42; font-size: 7px; letter-spacing: 2.2px; }

.tk-footer-intro {
    position: relative;
    z-index: 4;
    padding: 132px 0 88px;
    border-bottom: 1px solid rgba(111,227,251,.08);
}
html[data-theme="light"] .tk-footer-intro { border-bottom-color: rgba(22,141,168,.1); }

.tk-footer-kicker {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #6b858c;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: 2px;
}
.tk-footer-kicker span {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #6fe3fb;
    box-shadow: 0 0 14px rgba(111,227,251,.7);
}
html[data-theme="light"] .tk-footer-kicker { color: #61777e; }
html[data-theme="light"] .tk-footer-kicker span { background: #168da8; box-shadow: 0 0 12px rgba(22,141,168,.28); }

.tk-footer-intro-grid {
    margin-top: 28px;
    display: grid;
    grid-template-columns: minmax(0, 1.38fr) minmax(300px, .62fr);
    align-items: end;
    gap: 80px;
}
.tk-footer-intro h2 {
    max-width: 830px;
    font-family: "Space Grotesk", sans-serif;
    font-size: clamp(48px, 6.5vw, 94px);
    font-weight: 600;
    line-height: .92;
    letter-spacing: -.055em;
}
.tk-footer-intro h2 span {
    display: block;
    margin-top: 8px;
    color: transparent;
    background: linear-gradient(100deg, #f1fdff, #9eefff 38%, #55d9f6 70%, #baf5ff);
    -webkit-background-clip: text;
    background-clip: text;
}
html[data-theme="light"] .tk-footer-intro h2 span {
    background: linear-gradient(100deg, #143740, #168da8 48%, #0b6479);
    -webkit-background-clip: text;
    background-clip: text;
}

.tk-footer-intro-side p {
    color: #6b7e83;
    font-size: 12px;
    line-height: 1.8;
}
html[data-theme="light"] .tk-footer-intro-side p { color: #60777e; }

.tk-footer-cta {
    position: relative;
    margin-top: 26px;
    min-height: 58px;
    padding: 0 22px;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 34px;
    overflow: hidden;
    color: #051115;
    border-radius: 13px;
    background: linear-gradient(135deg, #c7f9ff, #65def8);
    box-shadow: 0 18px 48px rgba(76,210,240,.15);
    font-size: 10px;
    font-weight: 800;
    transition: transform .35s var(--ease), box-shadow .35s ease;
}
.tk-footer-cta::before {
    content: "";
    position: absolute;
    inset: 0;
    transform: translateX(-110%);
    background: linear-gradient(110deg, transparent 20%, rgba(255,255,255,.6), transparent 80%);
    transition: transform .7s var(--ease);
}
.tk-footer-cta:hover { transform: translateY(-4px); box-shadow: 0 24px 60px rgba(76,210,240,.22); }
.tk-footer-cta:hover::before { transform: translateX(110%); }
.tk-footer-cta > * { position: relative; z-index: 2; }

.tk-footer-word {
    position: relative;
    z-index: 2;
    margin: 32px 0 -12px;
    color: transparent;
    -webkit-text-stroke: 1px rgba(185,245,255,.09);
    font-family: "Space Grotesk", sans-serif;
    font-size: clamp(98px, 17.3vw, 260px);
    font-weight: 700;
    line-height: .8;
    letter-spacing: -.075em;
    text-align: center;
    white-space: nowrap;
    user-select: none;
}
html[data-theme="light"] .tk-footer-word { -webkit-text-stroke-color: rgba(22,141,168,.11); }
.v2-footer.is-section-live .tk-footer-word {
    animation: tkFooterWord 6s ease-in-out infinite alternate;
}
@keyframes tkFooterWord {
    from { letter-spacing: -.078em; opacity: .72; }
    to { letter-spacing: -.065em; opacity: 1; }
}

.tk-footer-grid {
    position: relative;
    z-index: 5;
    padding: 58px 0 48px;
    display: grid;
    grid-template-columns: 1.35fr .9fr .7fr 1fr;
    gap: 52px;
    border-top: 1px solid rgba(111,227,251,.08);
}
html[data-theme="light"] .tk-footer-grid { border-top-color: rgba(22,141,168,.1); }

.v2-footer .v2-footer-brand {
    align-self: start;
}
.v2-footer .v2-footer-brand-mark {
    background: linear-gradient(145deg, rgba(111,227,251,.09), rgba(255,255,255,.01));
}
html[data-theme="light"] .v2-footer .v2-footer-brand-mark { background: rgba(255,255,255,.58); }

.tk-footer-column,
.tk-footer-contact {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
}
.tk-footer-column small,
.tk-footer-contact > small {
    margin-bottom: 8px;
    color: #536970;
    font-size: 6px;
    font-weight: 800;
    letter-spacing: 1.9px;
}
.tk-footer-column a,
.tk-footer-contact a {
    color: #8ba0a6;
    font-size: 10px;
    line-height: 1.5;
    transition: color .25s ease, transform .25s ease;
}
html[data-theme="light"] .tk-footer-column a,
html[data-theme="light"] .tk-footer-contact a { color: #586e75; }
.tk-footer-column a:hover,
.tk-footer-contact a:hover { color: var(--tk-wow-accent); transform: translateX(3px); }

.v2-footer .v2-footer-nav {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
}

.tk-footer-status {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #79e8ba;
    font-size: 8px;
    font-weight: 700;
}
.tk-footer-status i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #67eab8;
    box-shadow: 0 0 12px rgba(103,234,184,.75);
    animation: tkOnlinePulse 2.4s ease-in-out infinite;
}

.v2-footer .v2-footer-bottom {
    position: relative;
    z-index: 4;
    margin-top: 0;
    padding-top: 22px;
    border-top-color: rgba(111,227,251,.07);
}
html[data-theme="light"] .v2-footer .v2-footer-bottom { border-top-color: rgba(22,141,168,.1); }

/* ---------- MOBİL / DENGELİ ETKİ ---------- */

@media (max-width: 1050px) {
    .tk-section-signature-services,
    .tk-section-signature-about,
    .tk-section-signature-contact { display: none; }

    .tk-footer-intro-grid { grid-template-columns: 1fr; gap: 32px; }
    .tk-footer-intro-side { max-width: 520px; }
    .tk-footer-grid { grid-template-columns: 1.2fr 1fr 1fr; }
    .tk-footer-contact { grid-column: 1 / -1; padding-top: 16px; border-top: 1px solid rgba(111,227,251,.07); }
}

@media (max-width: 650px) {
    .v2-boot-content { width: min(340px, calc(100vw - 38px)); }
    .tk-boot-ghost { font-size: 29vw; }
    .v2-boot-core { width: 110px; height: 110px; }
    .v2-boot-brand strong { font-size: 20px; letter-spacing: 4px; }
    .tk-boot-kicker { font-size: 5.5px; letter-spacing: 1.6px; }
    .tk-boot-kicker span { width: 18px; }
    .tk-theme-transition-icon { width: 74px; height: 74px; font-size: 29px; }

    .tk-section-signature-references {
        top: 82px;
        width: calc(100% - 32px);
        opacity: .22;
    }
    .tk-section-signature-references span { font-size: 5.5px; }

    .v2-services-grid.has-focused-card .v2-service-card:not(.is-focused-card) {
        opacity: 1;
        transform: none;
        filter: none;
    }

    .v2-footer.tk-footer-stage { margin-top: 42px; }
    .tk-footer-portal { top: -170px; width: 118vw; }
    .tk-footer-core { width: 50px; height: 50px; font-size: 12px; }
    .tk-footer-intro { padding: 92px 0 62px; }
    .tk-footer-intro h2 { font-size: clamp(42px, 13.2vw, 62px); }
    .tk-footer-intro-side p { font-size: 11px; }
    .tk-footer-cta { width: 100%; }
    .tk-footer-word { margin: 28px 0 2px; font-size: 28vw; }
    .tk-footer-grid { padding: 42px 0 34px; grid-template-columns: 1fr 1fr; gap: 36px 24px; }
    .v2-footer .v2-footer-brand { grid-column: 1 / -1; }
    .tk-footer-contact { grid-column: 1 / -1; }
    .v2-footer .v2-footer-bottom { gap: 14px; align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
    .v2-boot,
    .tk-theme-transition { display: none !important; }

    .tk-footer-orbit,
    .tk-footer-word,
    .tk-footer-status i,
    .v2-about-panel::after,
    .tk-section-signature-about span {
        animation: none !important;
    }
}

/* ---------- BÖLÜM ATMOSFERLERİ / HER SAHNEYE AYRI TAT ---------- */

.v2-services {
    background:
        linear-gradient(180deg, transparent 0%, rgba(22,141,168,.022) 42%, rgba(22,141,168,.012) 72%, transparent 100%);
}
.v2-references {
    background:
        radial-gradient(circle at 78% 44%, rgba(22,141,168,.055), transparent 31%),
        linear-gradient(180deg, transparent 0%, rgba(13,74,88,.025) 48%, transparent 100%);
}
.v2-about {
    background:
        linear-gradient(115deg, transparent 0 56%, rgba(22,141,168,.022) 56% 100%);
}
.v2-contact {
    background:
        radial-gradient(circle at 84% 56%, rgba(22,141,168,.06), transparent 29%),
        linear-gradient(180deg, transparent, rgba(22,141,168,.018), transparent);
}

html[data-theme="dark"] .v2-services {
    background: linear-gradient(180deg, transparent 0%, rgba(111,227,251,.018) 42%, rgba(111,227,251,.009) 72%, transparent 100%);
}
html[data-theme="dark"] .v2-references {
    background:
        radial-gradient(circle at 78% 44%, rgba(111,227,251,.045), transparent 31%),
        linear-gradient(180deg, transparent 0%, rgba(111,227,251,.012) 48%, transparent 100%);
}
html[data-theme="dark"] .v2-about {
    background: linear-gradient(115deg, transparent 0 56%, rgba(111,227,251,.012) 56% 100%);
}
html[data-theme="dark"] .v2-contact {
    background:
        radial-gradient(circle at 84% 56%, rgba(111,227,251,.045), transparent 29%),
        linear-gradient(180deg, transparent, rgba(111,227,251,.01), transparent);
}

/* Boot perdesi açıldıktan sonra hero da sahneye girer. */
html.tk-site-entered .v2-hero-content {
    animation: tkHeroArrival .9s .05s var(--ease) both;
}
html.tk-site-entered .v2-core-stage {
    animation: tkCoreArrival 1.05s .12s var(--ease) both;
}
html.tk-site-entered .v2-panel-code {
    animation: tkPanelCodeArrival .9s .42s var(--ease) both;
}
@keyframes tkHeroArrival {
    from { opacity: 0; transform: translate3d(-28px, 14px, 0); filter: blur(8px); }
    to { opacity: 1; transform: translate3d(0,0,0); filter: blur(0); }
}
@keyframes tkCoreArrival {
    from { opacity: 0; transform: translate3d(32px, 10px, 0) scale(.92); filter: blur(10px); }
    to { opacity: 1; transform: translate3d(0,0,0) scale(1); filter: blur(0); }
}
@keyframes tkPanelCodeArrival {
    from { opacity: 0; letter-spacing: 6px; }
    to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    html.tk-site-entered .v2-hero-content,
    html.tk-site-entered .v2-core-stage,
    html.tk-site-entered .v2-panel-code { animation: none !important; }
}

/* =========================================================
   TK TECH — WOW V3
   Industrial technology × digital atelier
========================================================= */

.tk-v3-brand-mark,.tk-v3-footer-mark,.tk-v3-boot-mark,.tk-v3-contact-core{overflow:hidden}
.tk-v3-brand-mark img,.tk-v3-footer-mark img,.tk-v3-boot-mark img,.tk-v3-contact-core img{width:100%;height:100%;object-fit:cover}
.tk-v3-brand-mark{padding:0!important;border-radius:13px!important;clip-path:none!important;box-shadow:0 12px 30px rgba(0,0,0,.18),0 0 0 1px rgba(111,227,251,.16)!important}
.tk-v3-brand-mark img{transform:scale(1.06)}

/* HERO / TK COMMAND CORE */
.v2-hero{position:relative;padding-top:125px}
.v2-hero::before{content:"TK";position:absolute;left:-1.5vw;top:50%;z-index:-1;transform:translateY(-49%);color:transparent;-webkit-text-stroke:1px color-mix(in srgb,var(--cyan) 8%,transparent);font:700 clamp(18rem,34vw,36rem)/.7 "Space Grotesk",sans-serif;letter-spacing:-.1em;pointer-events:none;user-select:none}
.v2-hero-panel{min-height:720px;padding:76px 68px;grid-template-columns:minmax(0,1.02fr) minmax(480px,.98fr);border-radius:38px;background:radial-gradient(circle at 76% 46%,rgba(92,226,255,.15),transparent 27%),radial-gradient(circle at 14% 82%,rgba(74,164,190,.08),transparent 34%),linear-gradient(145deg,rgba(9,15,18,.985),rgba(2,6,8,.995));box-shadow:0 70px 160px rgba(0,0,0,.50),0 0 100px rgba(80,220,250,.04),inset 0 1px 0 rgba(255,255,255,.04)}
[data-theme="light"] .v2-hero-panel{background:radial-gradient(circle at 76% 46%,rgba(45,184,218,.12),transparent 27%),radial-gradient(circle at 14% 82%,rgba(65,174,201,.07),transparent 34%),linear-gradient(145deg,rgba(255,255,255,.96),rgba(237,246,248,.96));border-color:rgba(20,104,124,.11);box-shadow:0 55px 130px rgba(35,74,85,.12),inset 0 1px 0 rgba(255,255,255,.8)}
.v2-hero h1{font-size:clamp(58px,5.4vw,84px);line-height:.91;letter-spacing:-5px}
[data-theme="light"] .v2-hero h1{color:#071013}
.tk-v3-dual-strip{width:min(100%,575px);margin-top:26px;padding:13px 0;display:grid;grid-template-columns:1fr 1px 1fr;gap:18px;align-items:center;border-top:1px solid rgba(111,227,251,.10);border-bottom:1px solid rgba(111,227,251,.10)}
.tk-v3-dual-strip>div{display:grid;grid-template-columns:27px 1fr;gap:2px 9px;align-items:center}.tk-v3-dual-strip>div>span{grid-row:1/3;color:var(--cyan);font:700 8px/1 "Space Grotesk",sans-serif}.tk-v3-dual-strip strong{color:#eaf9fc;font-size:9px;letter-spacing:1.5px}.tk-v3-dual-strip small{color:#60757c;font-size:7px}.tk-v3-dual-strip>i{height:28px;background:rgba(111,227,251,.10)}
[data-theme="light"] .tk-v3-dual-strip strong{color:#0c2026}
.v2-core-stage{width:550px;height:550px}.v2-logo-device{width:238px;height:238px;padding:0;overflow:hidden;border-radius:42px;border:1px solid rgba(128,235,255,.26);background:#060b0d;box-shadow:0 0 0 12px rgba(111,227,251,.025),0 30px 80px rgba(0,0,0,.34),0 0 55px rgba(91,224,253,.10)}
.v2-logo-device img{width:100%;height:100%;object-fit:cover;transform:scale(1.03);filter:saturate(.95) contrast(1.04)}
.v2-device-status{left:50%;bottom:13px;width:max-content;transform:translateX(-50%);padding:7px 10px;color:#d8f8ff;background:rgba(2,7,9,.68);border:1px solid rgba(111,227,251,.15);border-radius:999px;backdrop-filter:blur(12px)}
.v2-core-ring{border-style:dashed}.v2-ring-1{width:370px;height:370px}.v2-ring-2{width:450px;height:450px}.v2-ring-3{width:530px;height:530px}.v2-service-node{min-width:156px;border-radius:14px;box-shadow:0 16px 38px rgba(0,0,0,.15);backdrop-filter:blur(16px)}

/* SERVICES / DIFFERENT MODULES */
.v2-services{position:relative;padding:145px 0;overflow:hidden}.v2-services::before{content:"CAPABILITIES";position:absolute;right:-22px;top:155px;color:transparent;-webkit-text-stroke:1px color-mix(in srgb,var(--cyan) 7%,transparent);font:700 clamp(5rem,11vw,11rem)/.75 "Space Grotesk",sans-serif;letter-spacing:-.07em;writing-mode:vertical-rl;transform:rotate(180deg);pointer-events:none}
.v2-services-head{margin-bottom:58px}.v2-services-head-grid h2{font-size:clamp(46px,5vw,72px);letter-spacing:-4px}
.v2-services-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:minmax(235px,auto);gap:16px}.v2-service-card{min-height:260px;border-radius:25px;overflow:hidden;transition:transform .42s var(--ease),border-color .35s ease,box-shadow .42s ease,opacity .35s ease}.v2-service-card:nth-child(1){grid-column:span 7;min-height:390px}.v2-service-card:nth-child(2){grid-column:span 5;min-height:390px}.v2-service-card:nth-child(3),.v2-service-card:nth-child(4),.v2-service-card:nth-child(5){grid-column:span 4;min-height:315px}.v2-service-card:nth-child(6){grid-column:1/-1;min-height:285px}
.v2-service-card[data-wow-service="technical"]{background:radial-gradient(circle at 76% 35%,rgba(111,227,251,.13),transparent 25%),linear-gradient(145deg,#0b1418,#05090b)}
.v2-service-card[data-wow-service="system"]{background:linear-gradient(rgba(111,227,251,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(111,227,251,.035) 1px,transparent 1px),linear-gradient(145deg,#071116,#04080a);background-size:34px 34px,34px 34px,auto}
.v2-service-card[data-wow-service="web"]{background:linear-gradient(145deg,rgba(100,226,252,.095),rgba(255,255,255,.018))}
.v2-service-card[data-wow-service="design"]{color:#071013!important;background:radial-gradient(circle at 78% 25%,rgba(111,227,251,.22),transparent 30%),linear-gradient(145deg,#f8fcfd,#dfecef)!important;border-color:rgba(111,227,251,.20)!important}
.v2-service-card[data-wow-service="design"] .v2-card-content h3,.v2-service-card[data-wow-service="design"] .v2-card-content p,.v2-service-card[data-wow-service="design"] .v2-card-category{color:#071013!important}.v2-service-card[data-wow-service="design"] .v2-card-number,.v2-service-card[data-wow-service="design"] .v2-card-arrow{color:#0095b6!important}
.v2-service-card[data-wow-service="social"]{background:radial-gradient(circle at 70% 42%,rgba(111,227,251,.12),transparent 27%),linear-gradient(150deg,#0a1215,#060a0c)}
.v2-service-card[data-wow-service="growth"]{background:radial-gradient(circle at 86% 50%,rgba(111,227,251,.13),transparent 28%),linear-gradient(115deg,#071014,#0b171b)}
.v2-services-grid.has-focused-card .v2-service-card:not(.is-focused-card){opacity:.52;transform:scale(.988)}.v2-service-card.is-focused-card{transform:translateY(-8px);border-color:rgba(111,227,251,.26);box-shadow:0 28px 65px rgba(0,0,0,.20),0 0 40px rgba(111,227,251,.05)}

/* REFERENCES / CASE STUDY LAB */
.v2-references{position:relative;padding:145px 0;color:#effbfe!important;background:radial-gradient(circle at 85% 20%,rgba(111,227,251,.10),transparent 24%),linear-gradient(145deg,#0b1114,#040708 70%)!important;overflow:hidden}.v2-references::after{content:"SELECTED WORK";position:absolute;left:-15px;bottom:78px;color:transparent;-webkit-text-stroke:1px rgba(111,227,251,.055);font:700 clamp(5rem,12vw,12rem)/.8 "Space Grotesk",sans-serif;letter-spacing:-.075em;pointer-events:none}
.v2-references .v2-section-kicker,.v2-references .v2-references-head-grid h2,.v2-references .v2-references-head-grid h2 span{color:#effbfe!important}.v2-references .v2-references-head-grid p{color:#75878d!important}.v2-ref-slider{border-radius:30px;overflow:hidden;border:1px solid rgba(111,227,251,.10);background:rgba(5,10,12,.76);box-shadow:0 45px 110px rgba(0,0,0,.32)}.v2-ref-project{min-height:630px}.v2-ref-gallery{background:#030607}.v2-ref-gallery-stage{border-radius:23px;overflow:hidden}
.v2-ref-content{position:relative;overflow:hidden;background:linear-gradient(145deg,#f6fbfc,#dce9ec)!important;color:#071013!important}.v2-ref-content::before{content:attr(data-wow-code);position:absolute;right:-12px;bottom:-15px;color:transparent;-webkit-text-stroke:1px rgba(7,16,19,.08);font:700 180px/.72 "Space Grotesk",sans-serif;pointer-events:none}.v2-ref-content-top p,.v2-ref-description,.v2-ref-info small{color:#607078!important}.v2-ref-content h3{color:#071013!important}.v2-ref-content h3 span,.v2-ref-content-top>span,.v2-ref-live-link{color:#009bbd!important}.v2-ref-tags span{color:#254048!important;background:rgba(255,255,255,.55)!important;border-color:rgba(10,80,96,.12)!important}

/* ABOUT / EDITORIAL OPERATING SYSTEM */
.v2-about{position:relative;padding:150px 0;overflow:hidden}.v2-about::before{content:"TECH + DIGITAL";position:absolute;left:50%;top:150px;transform:translateX(-50%);color:transparent;-webkit-text-stroke:1px color-mix(in srgb,var(--cyan) 6%,transparent);font:700 clamp(5rem,10vw,10rem)/1 "Space Grotesk",sans-serif;letter-spacing:-.07em;white-space:nowrap;pointer-events:none}.v2-about-panel{grid-template-columns:minmax(0,1.12fr) minmax(410px,.88fr);border-radius:32px;overflow:visible;background:transparent;border:0}.v2-about-main{position:relative;z-index:2;padding:58px;border-radius:30px;border:1px solid color-mix(in srgb,var(--cyan) 11%,transparent);background:color-mix(in srgb,var(--panel) 96%,transparent);box-shadow:0 34px 80px rgba(0,0,0,.12)}.v2-about-system{position:relative;z-index:3;margin:54px 0 54px -44px;padding:34px;border-radius:26px;background:linear-gradient(145deg,#071014,#020607);border:1px solid rgba(111,227,251,.14);box-shadow:0 34px 85px rgba(0,0,0,.30)}[data-theme="light"] .v2-about-main{background:rgba(255,255,255,.80);border-color:rgba(20,112,133,.10)}.v2-about-step{transition:transform .35s var(--ease),background .35s ease,border-color .35s ease}.v2-about-step.is-wow-active{transform:translateX(8px);background:rgba(111,227,251,.065);border-color:rgba(111,227,251,.16)}

/* CONTACT / CONNECTION DOCK */
.v2-contact{position:relative;padding:145px 0 155px;overflow:hidden}.v2-contact-panel{border-radius:34px;overflow:hidden;border:1px solid rgba(111,227,251,.10);background:radial-gradient(circle at 80% 25%,rgba(111,227,251,.11),transparent 24%),linear-gradient(145deg,#081013,#020607);box-shadow:0 45px 110px rgba(0,0,0,.25)}.v2-contact-main{padding:58px}.v2-contact-side{position:relative;overflow:hidden;border-left:1px solid rgba(111,227,251,.10);background:linear-gradient(145deg,rgba(111,227,251,.055),rgba(255,255,255,.012))}.v2-contact-side::before{content:"ONLINE";position:absolute;right:-12px;bottom:36px;color:transparent;-webkit-text-stroke:1px rgba(111,227,251,.08);font:700 74px/.8 "Space Grotesk",sans-serif;letter-spacing:-.06em;pointer-events:none}.v2-contact-system{width:225px;height:225px}.tk-v3-contact-core{width:112px!important;height:112px!important;padding:0!important;border-radius:27px!important;clip-path:none!important;box-shadow:0 20px 48px rgba(0,0,0,.24),0 0 30px rgba(111,227,251,.08)}.v2-contact-whatsapp{background:linear-gradient(135deg,#2fd96b,#25d366)!important;color:#fff!important;box-shadow:0 16px 40px rgba(37,211,102,.17)}

/* FOOTER / CYBER HORIZON */
.v2-footer{position:relative;overflow:hidden;padding-top:0!important;background:radial-gradient(circle at 50% 0%,rgba(111,227,251,.11),transparent 26%),linear-gradient(180deg,#071014,#020405 70%)!important}.tk-footer-intro{padding-top:90px}.tk-v3-footer-mark{width:54px!important;height:54px!important;padding:0!important;border-radius:15px!important;clip-path:none!important}.tk-footer-word{color:transparent!important;-webkit-text-stroke:1px rgba(111,227,251,.10)}

/* MOBILE MENU */
.tk-v3-mobile-menu{position:fixed!important;inset:78px 0 0!important;z-index:1450!important;display:block!important;padding:0!important;overflow:hidden auto!important;color:#eefcff!important;background:radial-gradient(circle at 84% 12%,rgba(111,227,251,.12),transparent 24%),#030708!important;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-10px);transition:opacity .3s ease,visibility .3s ease,transform .4s var(--ease)}[data-theme="light"] .tk-v3-mobile-menu{color:#071013!important;background:radial-gradient(circle at 84% 12%,rgba(70,200,230,.10),transparent 24%),#f4f8fa!important}.tk-v3-mobile-menu.active{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}.tk-v3-mobile-shell{width:min(100%,650px);min-height:100%;margin-inline:auto;padding:24px 20px calc(34px + env(safe-area-inset-bottom));display:flex;flex-direction:column}.tk-v3-mobile-top{min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid rgba(111,227,251,.10)}.tk-v3-mobile-top span{color:var(--cyan);font-size:8px;font-weight:800;letter-spacing:1.5px}.tk-v3-mobile-top small{color:#5e7077;font-size:7px;font-weight:800}.tk-v3-mobile-menu nav{display:flex;flex-direction:column}.tk-v3-mobile-menu nav a{min-height:72px;padding:0 3px;display:grid;grid-template-columns:36px 1fr 28px;gap:12px;align-items:center;border-bottom:1px solid rgba(111,227,251,.08);color:inherit!important}.tk-v3-mobile-menu nav a>span{color:var(--cyan);font-size:8px;font-weight:800}.tk-v3-mobile-menu nav a>strong{font:700 clamp(25px,7vw,36px)/1 "Space Grotesk",sans-serif;letter-spacing:-1.7px}.tk-v3-mobile-menu nav a>i{justify-self:end;color:var(--cyan);font-style:normal}.tk-v3-mobile-bottom{margin-top:auto;padding-top:28px;display:grid;grid-template-columns:1fr auto;gap:18px;align-items:end}.tk-v3-mobile-bottom p{max-width:280px;color:#71838a;font-size:12px;line-height:1.55}.tk-v3-mobile-bottom p strong{display:block;color:var(--cyan)}.tk-v3-mobile-wa{min-height:44px;padding:0 9px 0 15px;display:inline-flex;align-items:center;gap:10px;border-radius:999px;color:#fff!important;background:#25D366;font-size:10px;font-weight:800}.tk-v3-mobile-wa>span{width:27px;height:27px;display:grid;place-items:center;border-radius:50%;background:rgba(255,255,255,.16)}
body.menu-open{overflow:hidden}.v2-menu-button[aria-expanded="true"] span:first-child{top:21px;transform:rotate(45deg)}.v2-menu-button[aria-expanded="true"] span:last-child{top:21px;transform:rotate(-45deg)}.v2-menu-button span{transition:top .25s ease,transform .25s ease,opacity .25s ease}

/* FIXED CONTACT */
.tk-v3-fixed-actions{position:fixed;right:25px;bottom:25px;z-index:1320;display:flex;align-items:center;gap:12px;pointer-events:none}.tk-v3-fixed-button{position:relative;width:58px;height:58px;display:grid;place-items:center;border-radius:50%;pointer-events:auto;box-shadow:0 17px 42px rgba(0,0,0,.23);transition:transform .3s var(--ease),box-shadow .3s ease}.tk-v3-fixed-button svg{width:24px;height:24px;fill:currentColor}.tk-v3-fixed-button:hover{transform:translateY(-5px) scale(1.04);box-shadow:0 24px 56px rgba(0,0,0,.30)}.tk-v3-fixed-call{display:none;color:#fff;background:#071013;border:1px solid rgba(255,255,255,.12)}[data-theme="dark"] .tk-v3-fixed-call{color:#071013;background:#f3fbfd}.tk-v3-fixed-wa{color:#fff;background:#25D366;border:1px solid rgba(255,255,255,.20)}.tk-v3-fixed-wa::after{content:"";position:absolute;inset:-6px;z-index:-1;border-radius:50%;border:1px solid rgba(37,211,102,.28);animation:tkV3WaPulse 2.8s ease-out infinite}@keyframes tkV3WaPulse{0%{opacity:0;transform:scale(.84)}35%{opacity:.75}100%{opacity:0;transform:scale(1.28)}}
@media(min-width:821px){.tk-v3-fixed-wa::before{content:"WhatsApp";position:absolute;right:calc(100% + 12px);top:50%;padding:7px 10px;border-radius:999px;color:var(--text);background:var(--panel);border:1px solid var(--border);font-size:8px;font-weight:800;opacity:0;transform:translate(8px,-50%);transition:opacity .25s ease,transform .25s ease}.tk-v3-fixed-wa:hover::before{opacity:1;transform:translate(0,-50%)}}

/* MOTION HELPERS */
.tk-v3-enter{opacity:0;transform:translateY(22px);filter:blur(4px);transition:opacity .72s var(--ease),transform .72s var(--ease),filter .72s var(--ease);transition-delay:var(--tk-v3-delay,0ms)}.tk-v3-enter.is-v3-visible{opacity:1;transform:translateY(0);filter:blur(0)}.v2-service-card::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:0;background:radial-gradient(250px circle at var(--tk-v3-x,50%) var(--tk-v3-y,50%),rgba(111,227,251,.105),transparent 72%);transition:opacity .3s ease}.v2-service-card:hover::before{opacity:1}.v2-service-card>.v2-service-card-top,.v2-service-card>.v2-card-content,.v2-service-card>.v2-service-tags,.v2-service-card>.v2-growth-left,.v2-service-card>.v2-growth-stats{position:relative;z-index:2}.v2-service-card>.v2-card-visual,.v2-service-card>.v2-service-line,.v2-service-card>.v2-card-arrow,.v2-service-card>.tk-service-schematic{z-index:2}

/* RESPONSIVE */
@media(max-width:1120px){.v2-hero-panel{grid-template-columns:minmax(0,1fr) minmax(410px,.9fr);gap:40px;padding:68px 48px}.v2-core-stage{width:480px;height:480px;transform:scale(.92)}.v2-services-grid{grid-template-columns:repeat(2,1fr)}.v2-service-card:nth-child(n){grid-column:auto;min-height:310px}.v2-service-card:nth-child(6){grid-column:1/-1}}
@media(max-width:820px){.v2-header{z-index:1500}.tk-v3-mobile-menu{inset:76px 0 0!important}.v2-hero{min-height:auto;padding:105px 0 60px}.v2-hero-panel{min-height:auto;padding:36px 22px 42px;grid-template-columns:1fr;border-radius:26px}.v2-hero h1{font-size:clamp(48px,14vw,70px);letter-spacing:-3.7px}.v2-core-stage{width:min(100%,470px);height:470px;margin-top:6px;transform:none}.v2-service-node{min-width:128px;padding:10px 11px}.v2-services,.v2-references,.v2-about,.v2-contact{padding-top:100px;padding-bottom:100px}.v2-services-grid{grid-template-columns:1fr}.v2-service-card:nth-child(n){grid-column:auto;min-height:280px}.v2-ref-project{min-height:auto}.v2-about-panel,.v2-contact-panel{grid-template-columns:1fr}.v2-about-system{margin:-22px 18px 0}.v2-contact-side{border-left:0;border-top:1px solid rgba(111,227,251,.10)}.tk-v3-fixed-actions{left:17px;right:17px;bottom:calc(17px + env(safe-area-inset-bottom));justify-content:space-between}.tk-v3-fixed-call{display:grid}.v2-footer{padding-bottom:calc(100px + env(safe-area-inset-bottom))!important}body.menu-open .tk-v3-fixed-actions{opacity:0;pointer-events:none}}
@media(max-width:560px){.v2-shell{width:calc(100% - 28px)}.v2-brand-copy small{display:none}.tk-v3-dual-strip{gap:10px}.tk-v3-dual-strip small{display:none}.v2-hero-actions{flex-direction:column;align-items:stretch}.v2-button{width:100%}.v2-core-stage{height:390px}.v2-logo-device{width:185px;height:185px;border-radius:31px}.v2-ring-1{width:285px;height:285px}.v2-ring-2{width:335px;height:335px}.v2-ring-3{width:380px;height:380px}.v2-service-node{min-width:112px}.v2-services-head-grid h2,.v2-references-head-grid h2,.v2-about-head-grid h2,.v2-contact-head-grid h2{font-size:clamp(39px,13vw,54px);letter-spacing:-3px}.v2-about-main,.v2-contact-main{padding:33px 23px}.v2-about-system{margin:-15px 10px 0;padding:23px}.tk-v3-mobile-shell{padding:16px 14px calc(28px + env(safe-area-inset-bottom))}.tk-v3-mobile-menu nav a{min-height:65px}.tk-v3-mobile-menu nav a>strong{font-size:26px}.tk-v3-mobile-bottom{grid-template-columns:1fr}.tk-v3-mobile-wa{width:100%;justify-content:center}}
@media(prefers-reduced-motion:reduce){.tk-v3-fixed-wa::after{animation:none}.tk-v3-mobile-menu{transition:none}.tk-v3-enter,.tk-v3-enter.is-v3-visible{opacity:1!important;transform:none!important;filter:none!important;transition:none!important}}

/* =========================================================
   TK TECH — 3D ÇEKİRDEK KATMANI (canvas + enerji hatları)
========================================================= */
.tk-core-3d{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;}
.tk-core-links{position:absolute;inset:0;width:100%;height:100%;z-index:1;overflow:hidden;pointer-events:none;}
.tk-core-links path{fill:none;stroke:rgba(111,227,251,.22);stroke-width:1;}
.tk-core-links circle.tk-pulse{fill:var(--cyan);filter:drop-shadow(0 0 4px rgba(111,227,251,.9));}
html.tk-reduced-motion .tk-core-3d,
html.tk-reduced-motion .tk-core-links circle.tk-pulse{display:none;}
.v2-core-backlight,.v2-core-ring,.v2-logo-device,.v2-service-node,.v2-panel-code{z-index:2;}

/* =========================================================
   TK TECH — MOBİL BAŞLIK TAŞMA DÜZELTMESİ
   "dönüştürüyoruz" gibi uzun tek kelimeler dar ekranlarda
   panelin dışına taşıp overflow:hidden tarafından kırpılıyordu.
========================================================= */
.v2-services-head-grid h2,
.v2-references-head-grid h2,
.v2-about-head-grid h2,
.v2-contact-head-grid h2 {
    overflow-wrap: break-word;
    word-break: break-word;
    hyphens: auto;
}
.v2-hero h1 {
    overflow-wrap: normal;
}
@media (max-width: 420px) {
    .v2-hero h1 { font-size: clamp(28px, 9.6vw, 38px); letter-spacing: -1.6px; }
    .v2-hero-panel { padding-left: 18px; padding-right: 18px; }
}

.tk-core-links path.is-focused{
    stroke: rgba(111,227,251,.85);
    stroke-width: 1.8;
    filter: drop-shadow(0 0 5px rgba(111,227,251,.55));
    transition: stroke .25s ease, stroke-width .25s ease;
}
.tk-core-links path{ transition: stroke .25s ease, stroke-width .25s ease; }

/* ---------- İLETİŞİM / FOOTER EKLERİ ---------- */
.v2-contact-info strong a { color: inherit; }
.v2-contact-info strong a:hover { color: var(--tk-wow-accent); }
.tk-footer-contact > small.tk-footer-region {
    margin: 0;
    color: #8ba0a6;
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 0;
}
html[data-theme="light"] .tk-footer-contact > small.tk-footer-region { color: #586e75; }
.v2-footer-bottom p a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }

/* ---------- ÇEREZ ONAYI ---------- */
.tk-consent {
    position: fixed;
    z-index: 9999;
    left: 16px;
    right: 16px;
    bottom: 16px;
    max-width: 520px;
    padding: 16px 18px;
    border: 1px solid rgba(111, 227, 251, .25);
    border-radius: 14px;
    background: #061014;
    color: #d6e4e8;
    font-size: 13px;
    line-height: 1.5;
    box-shadow: 0 12px 40px rgba(0, 0, 0, .35);
}
.tk-consent a { color: #6fe3fb; text-decoration: underline; }
.tk-consent-actions { display: flex; gap: 10px; margin-top: 12px; }
.tk-consent button {
    flex: 1;
    padding: 10px 14px;
    border: 1px solid rgba(111, 227, 251, .4);
    border-radius: 10px;
    background: transparent;
    color: #d6e4e8;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}
.tk-consent button[data-consent="granted"] { background: #6fe3fb; border-color: #6fe3fb; color: #061014; }


/* =====================================================================
   PREMIUM KATMANI (2026-10)
   Mevcut tasarımın üstüne okunabilirlik ve tutarlılık düzeltmeleri.
   ===================================================================== */

/* 1) Açık temada koyu yüzeyler: yazılar koyu temadaki renklerini alır.
   (Koyu temadaki hesaplanmış renklerden üretildi.) */
html[data-theme="light"] .v2-service-card-technical .v2-card-number { color: rgb(116, 230, 252); background-color: rgba(111, 227, 251, 0.024); border-color: rgba(111, 227, 251, 0.12); }
html[data-theme="light"] .v2-service-card-technical .v2-card-category { color: rgb(124, 146, 153); }
html[data-theme="light"] .v2-service-card-technical .v2-card-content h3 { color: rgb(237, 245, 247); }
html[data-theme="light"] .v2-service-card-technical .v2-card-content p { color: rgb(124, 141, 147); }
html[data-theme="light"] .v2-service-card-technical .v2-service-tags span { color: rgb(129, 147, 153); background-color: rgba(255, 255, 255, 0.024); border-color: rgba(255, 255, 255, 0.055); }
html[data-theme="light"] .v2-service-card-system .v2-card-number { color: rgb(116, 230, 252); background-color: rgba(111, 227, 251, 0.024); border-color: rgba(111, 227, 251, 0.12); }
html[data-theme="light"] .v2-service-card-system .v2-card-category { color: rgb(124, 146, 153); }
html[data-theme="light"] .v2-service-card-system .v2-card-content h3 { color: rgb(237, 245, 247); }
html[data-theme="light"] .v2-service-card-system .v2-card-content p { color: rgb(124, 141, 147); }
html[data-theme="light"] .v2-services-grid > .v2-service-card:nth-child(5) .v2-card-number { color: rgb(116, 230, 252); background-color: rgba(111, 227, 251, 0.024); border-color: rgba(111, 227, 251, 0.12); }
html[data-theme="light"] .v2-services-grid > .v2-service-card:nth-child(5) .v2-card-category { color: rgb(124, 146, 153); }
html[data-theme="light"] .v2-services-grid > .v2-service-card:nth-child(5) .v2-card-content h3 { color: rgb(237, 245, 247); }
html[data-theme="light"] .v2-services-grid > .v2-service-card:nth-child(5) .v2-card-content p { color: rgb(124, 141, 147); }
html[data-theme="light"] .v2-service-card-growth .v2-card-number { color: rgb(116, 230, 252); background-color: rgba(111, 227, 251, 0.024); border-color: rgba(111, 227, 251, 0.12); }
html[data-theme="light"] .v2-service-card-growth .v2-card-category { color: rgb(124, 146, 153); }
html[data-theme="light"] .v2-service-card-growth .v2-card-content h3 { color: rgb(237, 245, 247); }
html[data-theme="light"] .v2-service-card-growth .v2-card-content p { color: rgb(124, 141, 147); }
html[data-theme="light"] .v2-service-card-growth .v2-growth-stats { color: rgb(243, 248, 249); background-color: rgba(255, 255, 255, 0.02); border-color: rgba(111, 227, 251, 0.07); }
html[data-theme="light"] .v2-service-card-growth .v2-growth-stats span { color: rgb(124, 146, 153); }
html[data-theme="light"] .v2-service-card-growth .v2-growth-stats strong { color: rgb(219, 232, 235); }
html[data-theme="light"] .v2-about-system .v2-about-system-head span { color: rgb(124, 146, 153); }
html[data-theme="light"] .v2-about-system .v2-about-system-head small { color: rgb(124, 146, 153); }
html[data-theme="light"] .v2-about-system .v2-about-step:not(.is-wow-active) h4 { color: rgb(219, 232, 235); }
html[data-theme="light"] .v2-about-system .v2-about-step p { color: rgb(113, 132, 139); }
html[data-theme="light"] .v2-contact-panel .v2-contact-label { color: rgb(124, 146, 153); }
html[data-theme="light"] .v2-contact-panel .v2-contact-main h3 { color: rgb(237, 245, 247); }
html[data-theme="light"] .v2-contact-panel .v2-contact-main h3 span { color: rgb(104, 221, 247); }
html[data-theme="light"] .v2-contact-panel .v2-contact-main p { color: rgb(125, 144, 150); }
html[data-theme="light"] .v2-contact-panel .v2-contact-call { color: rgb(215, 230, 233); background-color: rgba(255, 255, 255, 0.024); border-color: rgba(111, 227, 251, 0.08); }
html[data-theme="light"] .v2-contact-panel .v2-contact-call div { color: rgb(215, 230, 233); }
html[data-theme="light"] .v2-contact-panel .v2-contact-call small { color: rgb(124, 146, 153); }
html[data-theme="light"] .v2-contact-panel .v2-contact-call strong { color: rgb(215, 230, 233); }
html[data-theme="light"] .v2-contact-panel .v2-contact-call span { color: rgb(115, 229, 251); background-color: rgba(111, 227, 251, 0.024); border-color: rgba(111, 227, 251, 0.1); }
html[data-theme="light"] .v2-contact-panel .v2-contact-side-head span { color: rgb(124, 146, 153); }
html[data-theme="light"] .v2-contact-panel .v2-contact-status small { color: rgb(124, 146, 153); }
html[data-theme="light"] .v2-contact-panel .v2-contact-status strong { color: rgb(207, 222, 225); }
html[data-theme="light"] .v2-contact-panel .tk-v3-enter small { color: rgb(124, 146, 153); }
html[data-theme="light"] .v2-contact-panel .tk-v3-enter strong { color: rgb(200, 216, 219); }
html[data-theme="light"] .v2-contact-panel .tk-v3-enter a { color: rgb(200, 216, 219); }
html[data-theme="light"] .v2-footer .tk-footer-kicker { color: rgb(107, 133, 140); }
html[data-theme="light"] .v2-footer .tk-footer-kicker span { color: rgb(107, 133, 140); background-color: rgb(111, 227, 251); }
html[data-theme="light"] .v2-footer .tk-footer-intro-grid h2 { color: rgb(232, 247, 250); -webkit-text-fill-color: rgb(232, 247, 250); }
html[data-theme="light"] .v2-footer .tk-footer-intro-grid h2 span { -webkit-text-fill-color: transparent; background-image: linear-gradient(100deg, rgb(241, 253, 255), rgb(158, 239, 255) 38%, rgb(85, 217, 246) 70%, rgb(186, 245, 255)); }
html[data-theme="light"] .v2-footer .tk-footer-intro-side p { color: rgb(107, 126, 131); }
html[data-theme="light"] .v2-footer .tk-footer-grid { color: rgb(232, 247, 250); border-color: rgba(111, 227, 251, 0.08); }
html[data-theme="light"] .v2-footer .v2-footer-brand-mark { color: rgb(116, 229, 251); background-color: rgba(111, 227, 251, 0.024); border-color: rgba(111, 227, 251, 0.11); }
html[data-theme="light"] .v2-footer .v2-footer-brand strong { color: rgb(220, 233, 236); }
html[data-theme="light"] .v2-footer .v2-footer-brand small { color: rgb(124, 146, 153); }
html[data-theme="light"] .v2-footer .tk-footer-column a { color: rgb(139, 160, 166); }
html[data-theme="light"] .v2-footer .v2-footer-nav a { color: rgb(124, 146, 153); }
html[data-theme="light"] .v2-footer .tk-footer-contact a { color: rgb(139, 160, 166); }
html[data-theme="light"] .v2-footer .tk-footer-region { color: rgb(139, 160, 166); }
html[data-theme="light"] .v2-footer .v2-footer-bottom { color: rgb(232, 247, 250); border-color: rgba(111, 227, 251, 0.07); }
html[data-theme="light"] .v2-footer .v2-footer-bottom p { color: rgb(124, 146, 153); }
html[data-theme="light"] .v2-footer .v2-footer-bottom span { color: rgb(124, 146, 153); }
html[data-theme="light"] .v2-footer .v2-footer-bottom a { color: rgb(124, 146, 153); }

/* 2) Okunabilir küçük yazılar: 6-9px etiketler 10px+, içerik yazıları 11px+ */
.v2-brand-copy small, .v2-kicker, .v2-device-status, .v2-service-node small, .v2-panel-code,
.v2-section-kicker, .v2-card-category, .v2-growth-stats span, .v2-ref-project-badge,
.v2-ref-content-top p, .v2-ref-info small, .v2-ref-project-counter small, .v2-about-label,
.v2-about-signature small, .v2-about-system-head span, .v2-about-system-head small,
.v2-contact-label, .v2-contact-whatsapp small, .v2-contact-call small, .v2-contact-side-head span,
.v2-contact-side-head small, .v2-contact-status small, .v2-contact-info small, .tk-footer-kicker,
.v2-footer-brand small, .tk-footer-column small, .v2-footer-nav small,
.tk-footer-contact > small:not(.tk-footer-region), .tk-v3-dual-strip strong, .v2-footer-bottom > span {
    font-size: 10px;
    letter-spacing: .14em;
}
.v2-section-kicker span, .v2-card-number, .v2-service-node span, .tk-v3-dual-strip span,
.v2-hero-meta span, .v2-ref-image-counter span, .v2-ref-content-top span, .v2-about-step-number,
.v2-contact-info > div > span {
    font-size: 10px;
}
.tk-v3-dual-strip small, .v2-hero-meta p, .v2-hero-meta strong { font-size: 11px; }
.v2-service-node strong { font-size: 10.5px; }
.v2-service-tags span, .v2-ref-tags span { font-size: 11.5px; }
.tk-footer-status span, .v2-footer-bottom p, .v2-footer-bottom p a, .v2-footer-bottom p span { font-size: 11.5px; }

/* Koyu temada gri etiketler okunur kontrasta (~6:1) */
html[data-theme="dark"] .v2-brand-copy small, html[data-theme="dark"] .v2-card-category,
html[data-theme="dark"] .v2-growth-stats span, html[data-theme="dark"] .v2-about-label,
html[data-theme="dark"] .v2-about-signature small, html[data-theme="dark"] .v2-about-system-head span,
html[data-theme="dark"] .v2-about-system-head small, html[data-theme="dark"] .v2-contact-label,
html[data-theme="dark"] .v2-contact-call small, html[data-theme="dark"] .v2-contact-side-head span,
html[data-theme="dark"] .v2-contact-status small, html[data-theme="dark"] .v2-contact-info small,
html[data-theme="dark"] .tk-footer-kicker, html[data-theme="dark"] .v2-footer-brand small,
html[data-theme="dark"] .tk-footer-column small, html[data-theme="dark"] .v2-footer-nav small,
html[data-theme="dark"] .tk-footer-contact > small:not(.tk-footer-region),
html[data-theme="dark"] .v2-footer-bottom p, html[data-theme="dark"] .v2-footer-bottom > span,
html[data-theme="dark"] .v2-ref-project-counter small, html[data-theme="dark"] .v2-ref-info small {
    color: rgb(124, 146, 153);
}
html[data-theme="dark"] .v2-footer .v2-footer-nav a { color: rgb(139, 160, 166); }

/* 3) Yeşil WhatsApp butonları: beyaz yazı yeşilde okunmuyordu (1.9:1) */
html .v2-nav-cta, html .v2-nav-cta span,
html .v2-contact-whatsapp strong, html .v2-contact-whatsapp > span { color: #052e16; }
html .v2-contact-whatsapp small { color: rgba(5, 46, 22, .72); }
html .v2-contact-whatsapp > span { border-color: rgba(5, 46, 22, .25); }

/* 4) Hero girişi: perde açılırken başlar, daha kısa sürer */
html.tk-site-entered .v2-hero-content { animation-duration: .7s; animation-delay: 0s; }
html.tk-site-entered .v2-core-stage { animation-duration: .8s; animation-delay: .05s; }

/* 5) Bölüm sonlarındaki boşluklar */
@media (min-width: 821px) {
    .v2-about, .v2-contact { padding-bottom: 96px; }
}

/* 6) Klavye odağı ve başlık satır dengesi */
a:focus-visible, button:focus-visible, [role="button"]:focus-visible {
    outline: 2px solid #6fe3fb;
    outline-offset: 3px;
}
h1, h2, h3 { text-wrap: balance; }

/* 7) Koyu temada açık renkli referans bilgi paneli ve hero etiketleri */
html[data-theme="dark"] .v2-ref-info strong { color: #20363d; }
html[data-theme="dark"] .v2-ref-info small { color: #5f7880; }
html[data-theme="dark"] .v2-ref-live-link span { color: #168da8; }
html[data-theme="dark"] .v2-service-node small { color: rgb(124, 146, 153); }
html[data-theme="light"] .v2-services-grid > .v2-service-card:nth-child(5) .v2-card-arrow {
    color: rgb(116, 230, 252);
    background-color: rgba(111, 227, 251, .06);
    border-color: rgba(111, 227, 251, .14);
}

/* 8) Görsel bozulmalar ve mobil uyum (2026-10) */
/* Kenarda kesilen dev arka plan yazıları ("SELECTED WORK", "TECH + DIGITAL") */
.v2-references::after, .v2-about::before { content: none !important; }
.tk-v3-dual-strip div > span, .v2-about-values article > span { font-size: 10px; }

@media (max-width: 820px) {
    /* Başlıklarla çakışan dev rakam + dikey yazı süsleri */
    .tk-section-watermark { display: none; }
    .v2-services::before, .v2-contact-side::before { content: none !important; }
    /* 01 kartındaki "TK" süsü etiketlerin üstüne biniyordu */
    .v2-card-visual-tech { display: none; }
    /* Mobil menüdeki WhatsApp: yeşil üzerinde koyu yazı */
    .tk-v3-mobile-wa { color: #052e16 !important; }
    .tk-v3-mobile-wa > span { background: rgba(5, 46, 22, .12); }
    /* Footer linkleri parmakla rahat basılabilsin (~40px) */
    .tk-footer-column a, .v2-footer-nav a, .tk-footer-contact a {
        display: inline-block;
        padding: 10px 0;
    }
    .tk-footer-column, .v2-footer-nav, .tk-footer-contact { gap: 0; }
    .v2-footer-bottom p { line-height: 2.2; }
    .v2-footer-bottom p a { display: inline-block; padding: 4px 0; }
}

/* Hakkımızda imza kutusunda logo */
.v2-about-signature > span { overflow: hidden; }
.v2-about-signature > span img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* 9) Sık sorulan sorular */
.v2-faq { position: relative; padding: 110px 0 40px; }
.tk-faq-list {
    display: grid;
    gap: 12px;
    max-width: 900px;
    margin-top: 48px;
}
.tk-faq-item {
    border: 1px solid color-mix(in srgb, var(--cyan) 14%, transparent);
    border-radius: 18px;
    background: color-mix(in srgb, var(--panel) 70%, transparent);
    transition: border-color .25s ease, background .25s ease;
}
.tk-faq-item[open] { border-color: color-mix(in srgb, var(--cyan) 32%, transparent); }
.tk-faq-item summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 60px;
    padding: 16px 22px;
    color: var(--text);
    font-family: "Space Grotesk", sans-serif;
    font-size: 17px;
    font-weight: 600;
    cursor: pointer;
    list-style: none;
}
.tk-faq-item summary::-webkit-details-marker { display: none; }
.tk-faq-item summary::after {
    content: "+";
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border: 1px solid color-mix(in srgb, var(--cyan) 30%, transparent);
    border-radius: 50%;
    color: var(--cyan);
    font-size: 18px;
    transition: transform .25s ease;
}
.tk-faq-item[open] summary::after { transform: rotate(45deg); }
.tk-faq-item summary:hover { color: var(--cyan); }
.tk-faq-item p {
    max-width: 68ch;
    margin: 0;
    padding: 0 22px 20px;
    color: var(--muted);
    font-size: 15px;
    line-height: 1.7;
}
@media (max-width: 820px) {
    .v2-faq { padding: 80px 0 20px; }
    .tk-faq-list { margin-top: 32px; }
    .tk-faq-item summary { font-size: 15.5px; padding: 14px 16px; }
    .tk-faq-item p { padding: 0 16px 18px; font-size: 14.5px; }
}

/* 10) Klavye kullanıcıları için "İçeriğe atla" */
.tk-skip-link {
    position: fixed;
    z-index: 10000;
    top: 12px;
    left: 12px;
    padding: 10px 16px;
    border-radius: 10px;
    background: #6fe3fb;
    color: #052e16;
    font-weight: 800;
    transform: translateY(-150%);
    transition: transform .2s ease;
}
.tk-skip-link:focus { transform: none; }

/* =====================================================================
   11) OKUNABİLİRLİK KATMANI
   Hedef: tüm yazılarda WCAG AA (normal 4.5:1, büyük başlık 3:1).
   Piksel ölçümüyle doğrulandı (koyu + açık tema, 1280 + 390px).
   ===================================================================== */
html[data-theme="dark"] {
    --tk-read-muted: #a3b5ba;   /* paragraflar  ~8.5:1 */
    --tk-read-label: #97abb1;   /* küçük etiket ~7:1   */
    --tk-read-accent: #6fe3fb;  /* küçük camgöbeği     */
}
html[data-theme="light"] {
    --tk-read-muted: #465b62;   /* ~6.8:1 */
    --tk-read-label: #4b6168;   /* ~6.3:1 */
    --tk-read-accent: #0b6f86;  /* ~5.4:1 */
}

/* Paragraflar: daha okunur renk ve boyut */
html[data-theme] .v2-hero-description,
html[data-theme] .v2-services-head-grid p,
html[data-theme] .v2-about-head-grid p,
html[data-theme] .v2-contact-head-grid p,
html[data-theme] .v2-references-head-grid p,
html[data-theme] .v2-services-footer p,
html[data-theme] .tk-faq-item p {
    color: var(--tk-read-muted);
}
.v2-hero-description, .v2-services-head-grid p, .v2-about-head-grid p,
.v2-contact-head-grid p, .v2-references-head-grid p { font-size: 16px; line-height: 1.7; }

/* Küçük etiketler ve kickerlar: 11px, okunur gri */
html[data-theme] .v2-section-kicker,
html[data-theme] .v2-kicker,
html[data-theme] .v2-brand-copy small,
html[data-theme] .tk-v3-dual-strip small,
html[data-theme] .v2-hero-meta p,
html[data-theme] .v2-hero-meta span,
html[data-theme] .v2-service-node small,
html[data-theme] .v2-panel-code,
html[data-theme] .v2-about-label,
html[data-theme] .v2-about-signature small {
    color: var(--tk-read-label);
}
.v2-section-kicker, .v2-kicker, .v2-brand-copy small, .v2-service-node small,
.v2-about-label, .v2-about-signature small { font-size: 11px; }
.tk-v3-dual-strip small, .v2-hero-meta p { font-size: 12px; }

/* Küçük camgöbeği sayılar */
html[data-theme] .v2-section-kicker span,
html[data-theme] .tk-v3-dual-strip div > span,
html[data-theme] .v2-service-node span,
html[data-theme] .v2-services-footer a span {
    color: var(--tk-read-accent);
}
/* Referanslar bölümü her iki temada koyu: kicker kutusu */
html[data-theme] .v2-references .v2-section-kicker span {
    color: #6fe3fb;
    background: rgba(111, 227, 251, .06);
    border-color: rgba(111, 227, 251, .2);
}
html[data-theme] .v2-references .v2-section-kicker { color: #97abb1; }

/* Referans bilgi paneli her iki temada açık renk: koyu camgöbeği */
html[data-theme] .v2-ref-content-top span,
html[data-theme] .v2-ref-content h3 span,
html[data-theme] .v2-ref-live-link,
html[data-theme] .v2-ref-live-link span { color: #0b6f86; -webkit-text-fill-color: #0b6f86; }
html[data-theme] .v2-ref-info small { color: #4b6168; }
html[data-theme] .v2-ref-content-top p { color: #4b6168; }

/* Referans sayaç ve oklar (koyu zemin) */
html[data-theme] .v2-ref-project-counter span { color: #e6f3f6; }
html[data-theme] .v2-ref-project-counter small { color: #97abb1; }
html[data-theme="light"] .v2-ref-project-buttons button { color: #0d1d22; }

/* Yeşil buton üzerindeki küçük yazı */
html .v2-contact-whatsapp small { color: #052e16; }

/* Footer her iki temada koyu: başlıklar ve bölge */
html[data-theme] .v2-footer .tk-footer-column small,
html[data-theme] .v2-footer .v2-footer-nav small,
html[data-theme] .v2-footer .tk-footer-contact > small,
html[data-theme] .v2-footer .tk-footer-kicker,
html[data-theme] .v2-footer .v2-footer-brand small,
html[data-theme] .v2-footer .v2-footer-bottom p,
html[data-theme] .v2-footer .v2-footer-bottom > span { color: #97abb1; }
html[data-theme] .v2-footer .tk-footer-region,
html[data-theme] .v2-footer .tk-footer-column a,
html[data-theme] .v2-footer .tk-footer-contact a,
html[data-theme] .v2-footer .v2-footer-nav a { color: #b4c4c9; }

/* 12) Hero başlığı: bir tık küçük, her ekrana sığar */
.v2-hero h1 {
    font-size: clamp(44px, 4.3vw, 64px);
    line-height: 1;
    letter-spacing: -.035em;
}
@media (max-width: 820px) {
    .v2-hero h1 { font-size: clamp(36px, 7vw, 54px); letter-spacing: -.03em; }
}
@media (max-width: 520px) {
    .v2-hero h1 { font-size: clamp(28px, 8.4vw, 34px); letter-spacing: -.025em; line-height: 1.04; }
}
html[data-theme] .v2-ref-content .v2-ref-info small { color: #4b6168; font-size: 11px; }
html[data-theme="light"] .v2-nav-links a:not(.is-active) { color: #3f545b; }
html[data-theme="light"] .v2-nav-links a.is-active { color: #0b6f86; }
/* Eski katmandaki !important renkleri ezmek için (11605. satır) */
.v2-ref-content-top p, .v2-ref-description, .v2-ref-info small { color: #465b62 !important; }
html[data-theme="light"] .v2-nav-links a.is-active { color: #075a6d; }

/* 13) Kart ve panel paragrafları: koyu yüzeylerde daha parlak gri */
html[data-theme="dark"] .v2-service-card:not(:nth-child(4)) .v2-card-content p,
html[data-theme="dark"] .v2-about-main p,
html[data-theme="dark"] .v2-about-values p,
html[data-theme="dark"] .v2-about-step p,
html[data-theme="dark"] .v2-contact-main p,
html[data-theme] .v2-footer .tk-footer-intro-side p,
html[data-theme="light"] .v2-service-card-technical .v2-card-content p,
html[data-theme="light"] .v2-service-card-system .v2-card-content p,
html[data-theme="light"] .v2-services-grid > .v2-service-card:nth-child(5) .v2-card-content p,
html[data-theme="light"] .v2-service-card-growth .v2-card-content p,
html[data-theme="light"] .v2-about-system .v2-about-step p,
html[data-theme="light"] .v2-contact-panel .v2-contact-main p {
    color: #a3b5ba;
}
/* Açık zeminli kart ve paneller: koyu gri */
html[data-theme] .v2-services-grid > .v2-service-card:nth-child(4) .v2-card-content p,
html[data-theme="light"] .v2-services-grid > .v2-service-card:nth-child(3) .v2-card-content p,
html[data-theme="light"] .v2-about-main p,
html[data-theme="light"] .v2-about-values p {
    color: #465b62;
}
.v2-card-content p { font-size: 15px; line-height: 1.65; }

/* Footer "Çerez Tercihleri": link görünümlü gerçek buton */
.tk-link-button {
    padding: 0;
    border: 0;
    background: none;
    color: inherit;
    font: inherit;
    text-decoration: underline;
    text-underline-offset: 2px;
    cursor: pointer;
}
@media (max-width: 820px) {
    .v2-footer-bottom p .tk-link-button { display: inline-block; padding: 4px 0; }
}

/* Referans galerisinde video kare (EsnApp) */
.v2-ref-image video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 12px;
    cursor: zoom-in;
}

.v2-ref-thumb-video::after {
    content: "▶";
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: #fff;
    font-size: 15px;
    background: rgba(0,0,0,.32);
}

/* Referans filmleri: ses düğmesi (galeride video sessiz başlar) */
.v2-ref-sound {
    position: absolute;
    z-index: 16;
    left: 20px;
    top: 20px;
    min-height: 36px;
    padding: 0 14px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #eaf9fc;
    border: 1px solid rgba(111,227,251,.45);
    border-radius: 999px;
    background: rgba(6,14,17,.72);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    font-family: inherit;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .08em;
    cursor: pointer;
}
.v2-ref-sound:hover, .v2-ref-sound:focus-visible { background: rgba(6,14,17,.9); border-color: #6fe3fb; }
@media (max-width: 820px) {
    .v2-ref-sound { left: 12px; top: 12px; }
}