/**
 * İkramedya — Ana sayfa stilleri
 * Tema tokenları: /tema/stil.css (--theme-*)
 * Yalnızca ana sayfada yüklenir; .home-cta içeren diğer sayfalarda layout üzerinden de yüklenebilir.
 */
@import url('components/mockup-composite.css');

:root {
    --home-section-y-cta: var(--ds-section-y-md, clamp(2.5rem, 4.5vw, 4rem));
    --home-cta-box-min-height: 520px;
}

.home-page {
    --home-primary: var(--theme-primary, #2563eb);
    --home-secondary: var(--theme-secondary, #1e40af);
    --home-gradient: var(--ds-gradient);
    --home-border: var(--ds-border, #e8edf3);
    --home-text-on-brand: #ffffff;
    --home-bg-soft: var(--theme-bg, #f5f8f8);
    --home-bg-soft-2: var(--theme-section-alt-bg, #f3f7f6);
    --home-bg-soft-3: var(--theme-bg-alt, #eef3f2);
    --home-section-y: clamp(2.75rem, 5vw, 3.5rem);
    --home-section-y-cta: var(--ds-section-y-md, clamp(2.5rem, 4.5vw, 4rem));
    --home-head-gap: var(--ds-stack-lg, clamp(1.75rem, 3vw, 2.75rem));
    --home-grid-gap: clamp(1.125rem, 2vw, 1.75rem);
    --home-atmo-glow-a: var(--theme-overlay-soft, color-mix(in srgb, var(--theme-text, #0f172a) 8%, transparent));
    --home-atmo-glow-b: color-mix(in srgb, var(--theme-text, #0f172a) 5%, transparent);
    --home-atmo-line: color-mix(in srgb, var(--theme-border, #dbe5e8) 70%, transparent);
    --home-atmo-surface: var(--theme-surface-alt, var(--home-bg-soft));
    overflow-x: clip;
    background: var(--theme-bg, #f5f8f8);
}

.hp-section-wrap,
.home-services,
.home-projects,
.home-why,
.home-process,
.home-brands,
.home-blog,
.home-cta {
    background: transparent;
}

@media (min-width: 768px) {
    .home-page {
        --home-section-y: clamp(4rem, 6vw, 5rem);
    }
}

@media (min-width: 1024px) {
    .home-page {
        --home-section-y: clamp(5.5rem, 7vw, 7rem);
    }
}

@media (max-width: 767px) {
    .home-page {
        --home-atmo-glow-a: var(--theme-overlay-soft, color-mix(in srgb, var(--theme-text, #0f172a) 8%, transparent));
        --home-atmo-glow-b: color-mix(in srgb, var(--theme-text, #0f172a) 5%, transparent);
        --home-atmo-line: color-mix(in srgb, var(--theme-border, #dbe5e8) 70%, transparent);
    }
}

/* Hero CTA butonları */
.home-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.8rem var(--theme-button-padding-x, 1.25rem);
    min-height: var(--theme-button-height, auto);
    border-radius: var(--theme-button-radius, 8px);
    font-weight: var(--theme-button-font-weight, 600);
    font-size: 0.95rem;
    text-decoration: none;
    border: 1px solid transparent;
    white-space: nowrap;
    cursor: pointer;
}

.home-btn--primary {
    background: var(--theme-button-bg, var(--home-gradient));
    color: var(--theme-button-color, var(--home-text-on-brand));
    border-color: var(--theme-button-border, transparent);
    box-shadow: var(--theme-button-shadow, none);
}

.home-btn--primary:hover,
.home-btn--primary:focus-visible {
    background: var(--theme-button-hover-bg, var(--theme-button-bg, var(--home-gradient)));
    color: var(--theme-button-hover-color, var(--home-text-on-brand));
}

.home-btn--secondary,
.home-btn--ghost:not(.hero-tpl__btn--glass) {
    background: var(--theme-surface, var(--site-bg));
    color: var(--theme-text, var(--site-text));
    border: 1px solid var(--home-border);
    border-radius: var(--theme-button-radius, 8px);
}

.home-btn--outline {
    background: transparent;
    color: var(--home-secondary);
    border-color: color-mix(in srgb, var(--home-primary) 35%, transparent);
}

.home-btn--lg {
    padding: 0.95rem 1.5rem;
}

/* ── Hero şablonları ── */
.hero-tpl {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: stretch;
    min-height: calc(100vh - var(--ds-header-h, 5.5rem));
    min-height: calc(100dvh - var(--ds-header-h, 5.5rem));
    overflow: hidden;
    color: #fff;
}

.hero-tpl__media {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.hero-tpl__video,
.hero-tpl__image,
.hero-tpl__poster,
.hero-tpl__slide-media {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.hero-tpl__poster--video {
    position: absolute;
    inset: 0;
    z-index: 1;
    transition: opacity 0.35s ease;
}

.hero-tpl__mobile-poster {
    display: none;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero-tpl--mobile-image .hero-tpl__mobile-poster {
    position: absolute;
    inset: 0;
    z-index: 2;
}

.hero-tpl__media .hero-tpl__video.is-playing + .hero-tpl__poster--video,
.hero-tpl__media .hero-tpl__video.is-playing ~ .hero-tpl__poster--video {
    opacity: 0;
}

.hero-tpl__overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(
        115deg,
        rgba(15, 23, 42, calc(var(--hero-overlay, 0.45) + 0.12)) 0%,
        rgba(15, 23, 42, var(--hero-overlay, 0.45)) 42%,
        rgba(15, 23, 42, calc(var(--hero-overlay, 0.45) * 0.75)) 100%
    );
}

.hero-tpl__content {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    /* Header / home section SSOT — gutter token içinde; ekstra padding-inline yok */
    width: var(--layout-container-wide);
    margin-inline: auto;
    padding-block: clamp(2rem, 5vw, 4rem);
    padding-inline: 0;
}

.hero-tpl__content--left {
    justify-content: flex-start;
}

.hero-tpl__content--center {
    justify-content: center;
    text-align: center;
}

.hero-tpl__content--center .hero-tpl__actions {
    justify-content: center;
}

.hero-tpl__content-inner {
    position: relative;
    width: min(100%, 44rem);
    max-width: 40rem;
}

.hero-tpl__eyebrow {
    margin: 0 0 1.1rem;
    font-size: clamp(0.95rem, 1.35vw, 1.125rem);
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: 0.01em;
    text-transform: none;
    color: color-mix(in srgb, #fff 76%, transparent);
}

.hero-tpl__title {
    margin: 0 0 1.35rem;
    font-size: clamp(2.1rem, 4.6vw, 3.25rem);
    font-weight: var(--theme-heading-weight, 300);
    line-height: 1.1;
    letter-spacing: -0.03em;
    text-wrap: balance;
}

.hero-tpl__title-line {
    display: block;
}

.hero-tpl__title-highlight {
    background: none;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    color: inherit;
    font-weight: inherit;
    filter: none;
}

@media (prefers-reduced-motion: reduce) {
    .hero-tpl .hero-tpl__reveal {
        animation: none;
        opacity: 1;
        transform: none;
    }
}

.hero-tpl__desc {
    margin: 0 0 1.65rem;
    max-width: 34rem;
    font-size: clamp(1rem, 1.5vw, 1.125rem);
    font-weight: 400;
    line-height: 1.7;
    color: color-mix(in srgb, #fff 80%, transparent);
}

.hero-tpl__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.85rem;
}

/* Ghost/glass hero buton renkleri → components/buttons.css (.hero-tpl__btn--glass) */

/* ── Fullscreen video hero ── */
.hero-tpl--fullscreen-video {
    width: 100%;
    min-height: calc(100dvh - var(--ds-header-h, 5.5rem));
    isolation: isolate;
}

body.has-fullscreen-hero .hero-tpl--fullscreen-video {
    min-height: 100dvh;
    min-height: 100svh;
}

body.has-fullscreen-hero .hero-tpl--fullscreen-video .hero-tpl__content {
    padding-top: calc(var(--hdr-h, 5rem) + clamp(1.5rem, 4vw, 3rem));
}

.hero-tpl--fullscreen-video .hero-tpl__media-fallback {
    position: absolute;
    inset: 0;
    z-index: 0;
    background-color: #0b1220;
    background-image:
        radial-gradient(ellipse 72% 58% at 68% 38%, rgba(59, 130, 246, 0.35) 0%, transparent 62%),
        radial-gradient(ellipse 48% 42% at 22% 78%, rgba(139, 92, 246, 0.28) 0%, transparent 58%),
        linear-gradient(145deg, #0b1220 0%, #1e3a8a 42%, #312e81 100%),
        repeating-linear-gradient(
            0deg,
            transparent,
            transparent 23px,
            rgba(255, 255, 255, 0.03) 23px,
            rgba(255, 255, 255, 0.03) 24px
        ),
        repeating-linear-gradient(
            90deg,
            transparent,
            transparent 23px,
            rgba(255, 255, 255, 0.03) 23px,
            rgba(255, 255, 255, 0.03) 24px
        );
}

.hero-tpl--fullscreen-video .hero-tpl__video,
.hero-tpl--fullscreen-video .hero-tpl__image,
.hero-tpl--fullscreen-video .hero-tpl__poster,
.hero-tpl--fullscreen-video .hero-tpl__mobile-poster {
    position: absolute;
    inset: 0;
    z-index: 1;
}

.hero-tpl--fullscreen-video .hero-tpl__poster--video {
    z-index: 2;
}

.hero-tpl--fullscreen-video .hero-tpl__overlay {
    z-index: 2;
    background:
        linear-gradient(180deg, rgba(8, 15, 30, calc(var(--hero-overlay, 0.45) * 0.85)) 0%, transparent 32%),
        linear-gradient(0deg, rgba(8, 15, 30, calc(var(--hero-overlay, 0.45) * 0.9)) 0%, transparent 26%),
        linear-gradient(
            102deg,
            rgba(8, 15, 30, calc(var(--hero-overlay, 0.45) + 0.22)) 0%,
            rgba(8, 15, 30, calc(var(--hero-overlay, 0.45) * 0.72)) 38%,
            rgba(8, 15, 30, calc(var(--hero-overlay, 0.45) * 0.28)) 62%,
            rgba(8, 15, 30, 0.04) 100%
        );
}

.hero-tpl--fullscreen-video .hero-tpl__content {
    z-index: 3;
    padding-block: clamp(2.5rem, 6vw, 5rem);
    padding-inline: 0;
}

.hero-tpl--fullscreen-video .hero-tpl__content-inner {
    width: min(100%, 48rem);
    max-width: 46rem;
}

.hero-tpl--fullscreen-video .hero-tpl__content--center .hero-tpl__content-inner {
    margin-inline: auto;
}

.hero-tpl--fullscreen-video .hero-tpl__content--center .hero-tpl__desc {
    margin-inline: auto;
}

@media (min-width: 1200px) {
    .hero-tpl--fullscreen-video .hero-tpl__content--left .hero-tpl__content-inner {
        max-width: 48rem;
    }
}

@media (min-width: 1440px) {
    .hero-tpl--fullscreen-video .hero-tpl__content--left .hero-tpl__content-inner {
        max-width: 50rem;
    }
}

.hero-tpl--fullscreen-video .hero-tpl__eyebrow {
    margin: 0 0 1.25rem;
    font-size: clamp(1rem, 1.45vw, 1.2rem);
    font-weight: 400;
    letter-spacing: 0.01em;
    color: color-mix(in srgb, #fff 74%, transparent);
}

.hero-tpl--fullscreen-video .hero-tpl__title {
    margin: 0 0 1.5rem;
    font-size: clamp(2.65rem, 6.8vw, 5.35rem);
    font-weight: var(--theme-heading-weight, 300);
    line-height: 1.06;
    letter-spacing: -0.035em;
}

.hero-tpl--fullscreen-video .hero-tpl__title-line {
    display: block;
}

.hero-tpl--fullscreen-video .hero-tpl__title-highlight {
    background: none;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    color: inherit;
    filter: none;
}

.hero-tpl--fullscreen-video .hero-tpl__desc {
    margin: 0 0 1.85rem;
    max-width: 36rem;
    font-size: clamp(1.02rem, 1.45vw, 1.15rem);
    line-height: 1.72;
    color: color-mix(in srgb, #fff 78%, transparent);
}

.hero-tpl--fullscreen-video .hero-tpl__actions {
    gap: 0.9rem;
}

.hero-tpl--fullscreen-video .hero-tpl__btn--primary {
    padding: 0.9rem 1.5rem;
    font-size: 1rem;
}

.hero-tpl--fullscreen-video .hero-tpl__btn--glass {
    padding: 0.9rem 1.5rem;
    font-size: 1rem;
}

@keyframes hero-tpl-fade-up {
    from {
        opacity: 0;
        transform: translate3d(0, 22px, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

.hero-tpl .hero-tpl__reveal {
    animation: hero-tpl-fade-up 0.8s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.hero-tpl .hero-tpl__reveal--eyebrow { animation-delay: 0.08s; }
.hero-tpl .hero-tpl__reveal--title { animation-delay: 0.22s; }
.hero-tpl .hero-tpl__reveal--desc { animation-delay: 0.38s; }
.hero-tpl .hero-tpl__reveal--actions { animation-delay: 0.52s; }

@media (max-width: 768px) {
    .hero-tpl--fullscreen-video .hero-tpl__content-inner {
        max-width: 100%;
    }
}

@media (max-width: 430px) {
    .hero-tpl--fullscreen-video .hero-tpl__eyebrow {
        margin-bottom: 0.9rem;
        font-size: 0.95rem;
    }

    .hero-tpl--fullscreen-video .hero-tpl__title {
        font-size: clamp(2rem, 9vw, 2.55rem);
        line-height: 1.1;
    }

    .hero-tpl--fullscreen-video .hero-tpl__actions {
        gap: 0.75rem;
    }
}

/* Slider */
.hero-tpl__slider {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.hero-tpl__slider-track {
    position: relative;
    width: 100%;
    height: 100%;
}

.hero-tpl__slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.6s ease;
}

.hero-tpl__slide.is-active {
    opacity: 1;
    visibility: visible;
    z-index: 1;
}

.hero-tpl__slider-arrow {
    position: absolute;
    top: 50%;
    z-index: 3;
    transform: translateY(-50%);
    width: 2.5rem;
    height: 2.5rem;
    border: 1px solid color-mix(in srgb, #fff 30%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, #0f172a 45%, transparent);
    color: #fff;
    cursor: pointer;
}

.hero-tpl__slider-arrow--prev { left: 1rem; }
.hero-tpl__slider-arrow--next { right: 1rem; }

.hero-tpl__slider-dots {
    position: absolute;
    bottom: 1.25rem;
    left: 50%;
    z-index: 3;
    display: flex;
    gap: 0.5rem;
    transform: translateX(-50%);
}

.hero-tpl__slider-dot {
    width: 0.55rem;
    height: 0.55rem;
    padding: 0;
    border: none;
    border-radius: 999px;
    background: color-mix(in srgb, #fff 35%, transparent);
    cursor: pointer;
}

.hero-tpl__slider-dot.is-active {
    width: 1.4rem;
    background: #fff;
}

/* Hero medya yığını — hero-media.php */
.home-hero__media-stack {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: inherit;
    overflow: hidden;
}

.home-hero__media--poster,
.home-hero__media--video,
.home-hero__media--placeholder {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home-hero__media--poster,
.home-hero__media--video {
    display: block;
}

.home-hero__media--video {
    z-index: 2;
}

.home-hero__media--poster {
    z-index: 1;
}

.home-hero__media--placeholder {
    z-index: 0;
    background: linear-gradient(135deg, var(--theme-secondary, #1e3a8a) 0%, var(--theme-accent, #7c3aed) 48%, var(--theme-primary, #2563eb) 100%);
}

.home-hero__media--video.is-hidden {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
}

.inner--media .home-hero__media-stack {
    min-height: 100%;
}

.hero-tpl + .home-section {
    padding-top: var(--home-section-y);
}

@media (max-width: 768px) {
    .hero-tpl__content-inner {
        width: 100%;
    }

    .hero-tpl__desc {
        max-width: 100%;
        font-size: clamp(0.9375rem, 2.8vw, 1rem);
        line-height: 1.6;
        margin-bottom: 1.25rem;
    }

    .hero-tpl__actions {
        flex-direction: column;
        align-items: stretch;
        gap: var(--ds-gap-sm, 0.625rem);
    }

    .hero-tpl__actions .home-btn,
    .hero-tpl__actions .hero-tpl__btn {
        width: 100%;
        min-height: var(--ds-control-height, 2.75rem);
        padding: 0.75rem 1.125rem;
        font-size: 0.9375rem;
        white-space: normal;
        text-align: center;
        justify-content: center;
    }

    .hero-tpl--fullscreen-video .hero-tpl__content {
        padding-block: clamp(2rem, 7vw, 3rem);
        padding-inline: 0;
        padding-bottom: clamp(2.5rem, 8vw, 3.5rem);
        align-items: flex-end;
    }

    .hero-tpl--fullscreen-video .hero-tpl__title {
        font-size: clamp(2.15rem, 9.5vw, 2.85rem);
        line-height: 1.08;
    }

    .hero-tpl--fullscreen-video .hero-tpl__desc {
        font-size: clamp(0.9375rem, 2.8vw, 1rem);
        line-height: 1.6;
        margin-bottom: 1.15rem;
        max-width: 100%;
    }

    .hero-tpl--fullscreen-video .hero-tpl__btn--primary,
    .hero-tpl--fullscreen-video .hero-tpl__btn--glass {
        width: 100%;
        min-height: var(--ds-control-height, 2.75rem);
        padding: 0.75rem 1.125rem;
        font-size: 0.9375rem;
        justify-content: center;
    }

    .hero-tpl__slider-arrow {
        display: none;
    }

    .hero-tpl--mobile-image .hero-tpl__video {
        display: none;
    }

    .hero-tpl--mobile-image .hero-tpl__mobile-poster {
        display: block;
    }

    .hero-tpl--mobile-image .hero-tpl__poster--video {
        display: none;
    }
}

/* ── Baseline: hero sonrası bloklar ── */
.home-container,
.home-services__container,
.home-projects__container,
.home-why__container,
.home-process__container,
.home-brands__container,
.home-blog__container,
.home-cta__container,
.hero-tpl__content {
    width: var(--layout-container-wide);
    margin-inline: auto;
}

.home-section {
    position: relative;
    isolation: isolate;
    padding-block: var(--theme-section-spacing, var(--home-section-y));
    background: transparent;
    border-top: 0;
}

.home-section__head {
    margin: 0 0 var(--home-head-gap);
}

.home-section__eyebrow {
    margin: 0 0 0.35rem;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #64748b;
}

.home-section__title {
    margin: 0;
    font-family: var(--site-heading-font, var(--site-font-family));
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: var(--theme-heading-weight, 300);
    line-height: 1.2;
    color: var(--site-text, #0f172a);
}

.home-section__desc {
    margin: 0.75rem 0 0;
    max-width: 52ch;
    font-size: 1rem;
    line-height: 1.6;
    color: var(--site-text-muted, #64748b);
}

.home-section__action {
    margin: 0.75rem 0 0;
}

.home-section__action a {
    color: var(--theme-primary, #2563eb);
    text-decoration: underline;
}

/* ── Section atmosphere (kaldırıldı — tek zemin: --theme-bg) ── */
.home-services::before,
.home-projects::before,
.home-why::before,
.home-process::before,
.home-brands::before,
.home-blog::before {
    display: none;
}

.home-services > *,
.home-projects > *,
.home-why > *,
.home-process > *,
.home-brands > *,
.home-blog > * {
    position: relative;
    z-index: 1;
}

/* ── Blog / Son Gelişmeler (FAZ 5.6.1) ── */
.home-blog.home-section {
    background: transparent;
    border-top: 0;
}

.home-blog__toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--home-grid-gap);
    margin-bottom: var(--home-head-gap);
}

.home-blog__toolbar-start {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: clamp(0.85rem, 2vw, 1.35rem);
    min-width: 0;
}

.home-blog__heading {
    margin: 0;
    font-size: clamp(2rem, 4.2vw, 3rem);
    font-weight: var(--theme-heading-weight, 300);
    line-height: 1.08;
    letter-spacing: -0.03em;
    color: var(--site-text, #0f172a);
}

.home-blog__pill {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    padding: 0.5rem 1.15rem;
    border-radius: 999px;
    font-size: 0.8125rem;
    font-weight: 600;
    letter-spacing: 0.01em;
    color: var(--site-text, #0f172a);
    background: color-mix(in srgb, var(--site-text, #0f172a) 5%, var(--theme-card-bg, var(--theme-bg, #f5f8f8)));
    border: 1px solid color-mix(in srgb, var(--site-text, #0f172a) 9%, transparent);
    text-decoration: none;
}

.home-blog__nav {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    gap: 0.75rem;
}

.home-blog__nav-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--ds-avatar-lg, 3rem);
    height: var(--ds-avatar-lg, 3rem);
    padding: 0;
    border-radius: 42%;
    border: 1px solid color-mix(in srgb, var(--site-text, #0f172a) 10%, transparent);
    background: color-mix(in srgb, var(--site-text, #0f172a) 5%, var(--theme-card-bg, var(--theme-bg, #f5f8f8)));
    color: var(--site-text, #0f172a);
    cursor: pointer;
    transition: border-radius 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.home-blog__nav-btn:hover,
.home-blog__nav-btn:focus-visible {
    border-radius: 50%;
}

.home-blog__nav-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: transform var(--ik-btn-duration, 0.85s) var(--ik-btn-ease, cubic-bezier(0.16, 1, 0.3, 1));
}

.home-blog__slider {
    --blog-gap: clamp(1.25rem, 2.5vw, 1.75rem);
    --blog-per-view: 1;
}

.home-blog__viewport {
    overflow: hidden;
}

.home-blog__track {
    display: flex;
    gap: var(--blog-gap);
    list-style: none;
    margin: 0;
    padding: 0;
    transition: transform 0.55s cubic-bezier(0.4, 0, 0.2, 1);
    will-change: transform;
}

.home-blog__track.is-instant {
    transition: none;
}

.home-blog__card {
    flex: 0 0 calc((100% - (var(--blog-per-view) - 1) * var(--blog-gap)) / var(--blog-per-view));
    min-width: 0;
}

.home-blog__article {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.home-blog__media-frame {
    --blog-media-radius: var(--theme-card-radius, calc(var(--theme-radius, 8px) + 4px));
    position: relative;
    aspect-ratio: 16 / 10;
    border-radius: var(--blog-media-radius);
    overflow: hidden;
    border: 1px solid transparent;
    transition: border-color 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}

.home-blog__article:hover .home-blog__media-frame,
.home-blog__article:focus-within .home-blog__media-frame {
    border-color: color-mix(in srgb, var(--site-text, #0f172a) 14%, transparent);
}

.home-blog__media {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: calc(var(--blog-media-radius) - 8px);
    background: color-mix(in srgb, var(--site-text, #0f172a) 4%, var(--theme-card-bg, var(--theme-bg, #f5f8f8)));
    text-decoration: none;
    transform-origin: center center;
    transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}

.home-blog__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    border-radius: calc(var(--blog-media-radius) - 8px);
}

.home-blog__article:hover .home-blog__media,
.home-blog__article:focus-within .home-blog__media {
    transform: scale(0.95);
}

.home-blog__media-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    border-radius: calc(var(--blog-media-radius) - 8px);
    font-size: 2.25rem;
    color: color-mix(in srgb, var(--theme-primary, #2563eb) 50%, var(--site-text-muted, #64748b));
    background: color-mix(in srgb, var(--theme-primary, #2563eb) 5%, var(--theme-card-bg, var(--theme-bg, #f5f8f8)));
}

.home-blog__body {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    padding-top: 1.1rem;
}

.home-blog__pills {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.55rem;
}

.home-blog__pill-meta {
    display: inline-flex;
    align-items: center;
    padding: 0.4rem 0.85rem;
    border-radius: 999px;
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1.2;
    color: var(--site-text-muted, #64748b);
    background: color-mix(in srgb, var(--site-text, #0f172a) 4%, var(--theme-card-bg, var(--theme-bg, #f5f8f8)));
    border: 1px solid color-mix(in srgb, var(--site-text, #0f172a) 7%, transparent);
}

.home-blog__card-title {
    margin: 0;
    font-size: clamp(1.375rem, 2.1vw, 1.75rem);
    font-weight: var(--theme-heading-weight, 300);
    line-height: 1.28;
    letter-spacing: -0.02em;
    color: var(--site-text, #0f172a);
}

.home-blog__card-title a {
    color: inherit;
    text-decoration: none;
    transition: color 0.25s ease;
}

.home-blog__card-title a:hover {
    color: var(--theme-primary, #2563eb);
}

@media (min-width: 640px) {
    .home-blog__slider {
        --blog-per-view: 2;
    }
}

@media (min-width: 1024px) {
    .home-blog__slider {
        --blog-per-view: 3;
    }
}

@media (max-width: 639px) {
    .home-blog__toolbar {
        align-items: flex-start;
    }

    .home-blog__nav {
        margin-top: 0.15rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .home-blog__track,
    .home-blog__media-frame,
    .home-blog__media,
    .home-blog__nav-btn,
    .home-blog__nav-icon {
        transition: none;
    }

    .home-blog__article:hover .home-blog__media,
    .home-blog__article:focus-within .home-blog__media {
        transform: none;
    }
}

/* ── CTA / Footer Öncesi Alan (CTA-SIFIR) ── */
.home-cta.home-section {
    padding-block: var(--home-section-y-cta);
    background: transparent;
    border-top: 0;
    overflow-x: clip;
}

.home-cta__box {
    position: relative;
    background: var(--theme-primary, #2563eb);
    border-radius: var(--theme-card-radius, calc(var(--theme-radius, 8px) + 4px));
    overflow: hidden;
    isolation: isolate;
}

.home-cta__background {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}

.home-cta__shape {
    position: absolute;
    border-radius: 50%;
    background: color-mix(in srgb, var(--site-bg, #fff) 22%, transparent);
    opacity: 0.55;
}

.home-cta__shape--1 {
    width: min(42vw, 320px);
    height: min(42vw, 320px);
    top: -18%;
    left: -6%;
}

.home-cta__shape--2 {
    width: min(28vw, 200px);
    height: min(28vw, 200px);
    bottom: 8%;
    left: 32%;
    opacity: 0.35;
}

.home-cta__shape--3 {
    width: min(32vw, 240px);
    height: min(32vw, 240px);
    top: -8%;
    right: 8%;
    opacity: 0.4;
}

.home-cta__content {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 1fr);
    align-items: stretch;
}

@media (min-width: 1025px) {
    .home-cta__content:has(> .home-cta__visual) {
        min-height: var(--home-cta-box-min-height);
    }
}

.home-cta__text {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 105px 30px 105px 120px;
    z-index: 2;
    color: var(--site-bg, #fff);
}

.home-cta__eyebrow {
    display: block;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: color-mix(in srgb, var(--site-bg, #fff) 78%, transparent);
}

.home-cta__title {
    margin: 0;
    font-size: clamp(42px, 4.5vw, 72px);
    font-weight: var(--theme-heading-weight, 300);
    line-height: 1.05;
    letter-spacing: -0.03em;
    color: var(--site-bg, #fff);
}

.home-cta__desc {
    margin: 0;
    max-width: 540px;
    font-size: clamp(1rem, 1.6vw, 1.125rem);
    line-height: 1.65;
    color: color-mix(in srgb, var(--site-bg, #fff) 88%, transparent);
}

.home-cta__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem;
    margin-top: 0.35rem;
}

.home-cta__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: var(--theme-button-height, 3rem);
    padding: 0.75rem var(--theme-button-padding-x, 1.65rem);
    border-radius: var(--theme-button-radius, 8px);
    font-size: 0.95rem;
    font-weight: var(--theme-button-font-weight, 600);
    text-decoration: none;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.home-cta__btn--primary {
    color: var(--theme-primary, #2563eb);
    background: var(--site-bg, #fff);
    border: 1px solid transparent;
}

.home-cta__btn--secondary {
    color: var(--site-bg, #fff);
    background: transparent;
    border: 1px solid color-mix(in srgb, var(--site-bg, #fff) 72%, transparent);
}

.home-cta__visual {
    position: relative;
    min-height: var(--home-cta-box-min-height);
    overflow: visible;
}

@media (max-width: 1024px) {
    .home-cta__visual {
        min-height: 0;
    }
}

.home-cta__portfolio {
    position: absolute;
    right: -24px;
    top: 0;
    width: 525px;
    height: 100%;
    pointer-events: none;
}

.home-cta__portfolio-img {
    position: absolute;
    width: 350px;
    aspect-ratio: 5 / 10;
    opacity: 0;
    will-change: transform, opacity;
    transition:
        transform 900ms cubic-bezier(.16, 1, .3, 1),
        opacity 900ms cubic-bezier(.16, 1, .3, 1);
}

.home-cta__portfolio-img img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    object-position: top center;
    border: 0;
    outline: 0;
    box-shadow: none;
    border-radius: 0;
    background: transparent;
}

.home-cta__portfolio-img--back {
    transform: translate(-140px, 80px) rotate(-35deg) scale(0.85);
    z-index: 1;
}

.home-cta__portfolio-img--front {
    transform: translate(180px, 120px) rotate(-10deg) scale(0.82);
    z-index: 2;
    transition-duration: 950ms;
    transition-delay: 180ms;
}

.home-cta.is-visible .home-cta__portfolio-img--back {
    opacity: 1;
    transform: translate(-30%, 22%) rotate(-25deg);
}

.home-cta.is-visible .home-cta__portfolio-img--front {
    opacity: 1;
    transform: translate(34%, 105px) rotate(-25deg);
}

.home-cta__portfolio-img[hidden] {
    display: none !important;
}

@media (max-width: 1024px) {
    .home-cta__content {
        grid-template-columns: 1fr;
    }

    .home-cta__text {
        text-align: center;
        align-items: center;
        padding: 72px 30px 64px;
    }

    .home-cta__desc {
        margin-inline: auto;
    }

    .home-cta__actions {
        justify-content: center;
    }

    .home-cta__visual {
        display: none;
    }
}

@media (max-width: 640px) {
    .home-cta__box {
        border-radius: var(--theme-card-radius, calc(var(--theme-radius, 8px) + 4px));
    }

    .home-cta__text {
        padding: 40px 20px 36px;
    }

    .home-cta__title {
        font-size: 32px;
    }

    .home-cta__actions {
        flex-direction: column;
        align-items: stretch;
        width: 100%;
    }

    .home-cta__btn {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .home-cta__btn {
        transition: none;
    }

    .home-cta__portfolio-img {
        opacity: 1;
        will-change: auto;
        transition: none;
    }

    .home-cta__portfolio-img--back {
        transform: translate(-30%, 22%) rotate(-25deg);
    }

    .home-cta__portfolio-img--front {
        transform: translate(34%, 105px) rotate(-25deg);
        transition-delay: 0;
    }
}

/* ── Hizmetler (FAZ 5.1) ── */
.home-services {
    background: transparent;
    border-top: 0;
}

.home-services__head {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) auto;
    align-items: end;
    gap: var(--home-grid-gap);
    margin-bottom: var(--home-head-gap);
}

.home-services__head-start {
    min-width: 0;
}

.home-services__eyebrow {
    margin: 0 0 0.5rem;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--theme-primary);
}

.home-services__heading {
    margin: 0;
    font-family: var(--site-heading-font, var(--site-font-family));
    font-size: clamp(1.75rem, 0.5rem + 2.35vw, 2.6875rem);
    font-weight: var(--theme-heading-weight, 300);
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: var(--site-text);
}

.home-services__desc {
    margin: 0;
    max-width: 34ch;
    font-size: 1rem;
    line-height: 1.7;
    color: var(--site-text-muted);
}

.home-services__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.8rem 1.5rem;
    border-radius: var(--theme-button-radius, 8px);
    border: 1px solid color-mix(in srgb, var(--theme-primary) 35%, transparent);
    background: var(--site-bg);
    color: var(--theme-primary);
    font-size: 0.95rem;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}

.home-services__grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: var(--home-grid-gap);
    list-style: none;
    margin: 0;
    padding: 0;
}

.home-services__card {
    border: 1px solid var(--theme-card-border, var(--theme-border, #dbe5e8));
    border-radius: var(--theme-card-radius, calc(var(--theme-radius, 8px) + 4px));
    background: var(--theme-card-bg, var(--theme-bg, #f5f8f8));
    box-shadow: var(--theme-card-shadow, 0 14px 36px color-mix(in srgb, var(--site-text) 4.5%, transparent));
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.home-services__card:hover {
    transform: translateY(-4px);
    border-color: var(--theme-card-border, var(--theme-border, #dbe5e8));
    box-shadow: var(--theme-card-shadow-hover, 0 28px 64px color-mix(in srgb, var(--theme-text, #0f172a) 10%, transparent));
}

.home-services__link {
    display: flex;
    flex-direction: column;
    gap: 0;
    min-height: 0;
    height: 100%;
    padding: 28px 24px;
    text-decoration: none;
    color: inherit;
}

.home-services__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--ds-avatar-xl, 3.5rem);
    height: var(--ds-avatar-xl, 3.5rem);
    margin-bottom: 1.25rem;
    border-radius: var(--theme-card-radius, calc(var(--theme-radius, 8px) + 4px));
    background: color-mix(in srgb, var(--theme-primary) 10%, var(--theme-card-bg, var(--theme-bg, #f5f8f8)));
    color: color-mix(in srgb, var(--theme-primary) 72%, var(--theme-accent) 28%);
    font-size: var(--ds-icon-lg, 1.35rem);
    flex-shrink: 0;
    transition: background-color 0.25s ease, color 0.25s ease;
}

.home-services__card:hover .home-services__icon {
    background: var(--theme-overlay-soft, color-mix(in srgb, var(--theme-text, #0f172a) 8%, transparent));
    color: var(--theme-primary);
}

.home-services__card-title {
    margin: 0 0 0.75rem;
    font-size: 1.125rem;
    font-weight: var(--theme-heading-weight, 300);
    line-height: 1.3;
    color: var(--site-text);
}

.home-services__text {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.75;
    color: var(--site-text-muted);
}

@media (max-width: 1399px) {
    .home-services__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 1023px) {
    .home-services__head {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .home-services__desc {
        max-width: none;
    }
}

@media (max-width: 767px) {
    .home-services__grid {
        grid-template-columns: 1fr;
        gap: var(--home-grid-gap);
    }

    .home-services__link {
        min-height: 0;
        padding: 28px 22px;
    }

    .home-services__cta {
        width: 100%;
    }
}

/* ── Projeler ── */
.home-projects {
    background: transparent;
    border-top: 0;
}

.home-projects__container {
    container-type: inline-size;
    container-name: home-projects;
}

.home-projects__head {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    column-gap: 1.25rem;
    row-gap: 1.25rem;
    margin-bottom: 1.25rem;
}

.home-projects__head-start {
    grid-column: 1;
    min-width: 0;
}

.home-projects__eyebrow {
    margin: 0 0 0.5rem;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--theme-primary);
}

.home-projects__title {
    margin: 0;
    max-width: 720px;
    font-size: clamp(2rem, 0.9rem + 2.1vw, 2.75rem);
    font-weight: var(--theme-heading-weight, 300);
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: var(--site-text);
}

@media (min-width: 1200px) {
    .home-projects__title {
        max-width: none;
    }
}

.home-projects__filters {
    display: flex;
    grid-column: 1 / -1;
    flex-wrap: wrap;
    align-items: center;
    align-self: center;
    justify-content: flex-start;
    gap: 0.5rem;
    min-width: 0;
}

.home-projects__filter {
    flex: 0 1 auto;
    white-space: nowrap;
    padding: 0.55rem 1.1rem;
    border: 1px solid transparent;
    border-radius: var(--theme-button-radius, var(--theme-radius, 8px));
    background: color-mix(in srgb, var(--theme-primary) 8%, var(--site-bg));
    color: var(--site-text);
    font: inherit;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.2;
    cursor: pointer;
    transition:
        background-color 0.25s ease,
        border-color 0.25s ease,
        color 0.25s ease,
        box-shadow 0.25s ease;
}

.home-projects__filter:hover,
.home-projects__filter:focus-visible {
    background: var(--theme-card-bg-hover, var(--theme-surface-alt, var(--site-bg)));
    border-color: var(--theme-card-border, var(--theme-border, #dbe5e8));
    color: var(--site-text);
    box-shadow: var(--theme-card-shadow, 0 14px 36px color-mix(in srgb, var(--theme-text, #0f172a) 6%, transparent));
    outline: none;
}

.home-projects__filter.is-active {
    background: var(--theme-primary);
    border-color: var(--theme-primary);
    color: var(--site-bg);
    box-shadow: var(--theme-card-shadow, 0 14px 36px color-mix(in srgb, var(--theme-text, #0f172a) 6%, transparent));
}

.home-projects__filter.is-active:hover,
.home-projects__filter.is-active:focus-visible {
    background: color-mix(in srgb, var(--theme-primary) 92%, var(--site-text));
    border-color: var(--theme-primary);
    color: var(--site-bg);
    box-shadow: var(--theme-card-shadow-hover, 0 28px 64px color-mix(in srgb, var(--theme-text, #0f172a) 10%, transparent));
}

.home-projects__action {
    display: inline-flex;
    grid-column: 2;
    align-items: center;
    justify-content: center;
    align-self: center;
    justify-self: end;
    gap: 0.5rem;
    padding: 0.8rem 1.5rem;
    font-size: 0.95rem;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}

@container home-projects (min-width: 1200px) {
    .home-projects__head {
        grid-template-columns: minmax(320px, auto) 1fr auto;
        column-gap: 0.75rem;
        row-gap: var(--home-grid-gap);
        margin-bottom: 0.625rem;
    }

    .home-projects__head-start {
        grid-column: 1;
    }

    .home-projects__filters {
        grid-column: 2;
        justify-content: flex-end;
        margin-top: 0.35rem;
    }

    .home-projects__action {
        grid-column: 3;
        margin-top: 0.35rem;
    }
}

.home-projects__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--home-grid-gap);
    list-style: none;
    margin: 0;
    padding: 0;
}

.home-projects__card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    border: 1px solid var(--theme-card-border, var(--theme-border, #dbe5e8));
    border-radius: var(--theme-card-radius, calc(var(--theme-radius, 8px) + 4px));
    background: var(--theme-card-bg, var(--theme-bg, #f5f8f8));
    box-shadow: var(--theme-card-shadow, 0 14px 36px color-mix(in srgb, var(--site-text) 4.5%, transparent));
    overflow: hidden;
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.home-projects__card:hover {
    transform: translateY(-6px);
    border-color: var(--theme-card-border, var(--theme-border, #dbe5e8));
    box-shadow: var(--theme-card-shadow-hover, 0 28px 64px color-mix(in srgb, var(--theme-text, #0f172a) 10%, transparent));
}

.home-projects__card.is-filtered-out {
    display: none;
}

.home-projects__card-link {
    display: flex;
    flex-direction: column;
    height: 100%;
    text-decoration: none;
    color: inherit;
}

.home-projects__media {
    position: relative;
    overflow: hidden;
    aspect-ratio: 16 / 10;
    background: color-mix(in srgb, var(--theme-primary) 8%, var(--theme-card-bg, var(--theme-bg, #f5f8f8)));
}

.home-projects__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top center;
    transition: transform 0.35s ease;
}

.home-projects__card:hover .home-projects__image {
    transform: scale(1.05);
}

.home-projects__body {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    padding: 1rem 1.1rem 1.15rem;
    min-width: 0;
}

.home-projects__name {
    margin: 0;
    font-size: 1.125rem;
    font-weight: var(--theme-heading-weight, 300);
    line-height: 1.3;
    color: var(--site-text);
}

.home-projects__category {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.4;
    color: var(--site-text-muted);
}

.home-projects__card:hover .home-projects__name {
    color: var(--theme-primary);
}

@media (max-width: 1199px) {
    .home-projects__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .home-projects__head {
        grid-template-columns: 1fr;
        row-gap: 1.25rem;
        margin-bottom: 1rem;
    }

    .home-projects__head-start,
    .home-projects__filters,
    .home-projects__action {
        grid-column: 1;
    }

    .home-projects__title {
        max-width: none;
    }

    .home-projects__grid {
        grid-template-columns: 1fr;
        gap: var(--home-grid-gap);
    }

    .home-projects__filters {
        display: flex;
        flex-wrap: nowrap;
        align-items: stretch;
        justify-content: flex-start;
        gap: var(--ds-gap-sm, 0.75rem);
        margin-inline: calc(-1 * var(--ds-gutter, 1.5rem));
        padding-inline: var(--ds-gutter, 1.5rem);
        scroll-padding-inline: var(--ds-gutter, 1.5rem);
        padding-bottom: var(--ds-stack-xs, 0.25rem);
        overflow-x: auto;
        overflow-y: hidden;
        overscroll-behavior-x: contain;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
    }

    .home-projects__filters::after {
        content: '';
        flex: 0 0 var(--ds-gutter, 1.5rem);
    }

    .home-projects__filters::-webkit-scrollbar {
        display: none;
    }

    .home-projects__filter {
        flex: 0 0 auto;
        scroll-snap-align: start;
        min-height: var(--ds-control-height-sm, 2.5rem);
        padding: var(--ds-control-pad-y, 0.5rem) var(--ds-control-pad-x, 1rem);
        font-size: 0.8125rem;
    }

    .home-projects__action {
        width: 100%;
        justify-content: center;
        text-align: center;
    }
}

@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
    .home-projects__filters {
        scroll-behavior: auto;
    }
}

/* ── Neden İkramedya (SSOT) ── */
.home-why {
    overflow-x: clip;
    background: transparent;
    border-top: 0;
}

.home-why__stage {
    position: relative;
    width: 100%;
    min-height: 0;
    padding: 0;
}

.home-why__panel {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 54%) minmax(0, 46%);
    align-items: center;
    width: 100%;
    min-height: 0;
    padding:
        clamp(2.75rem, 3.5vw, 3.75rem)
        clamp(2.75rem, 3.5vw, 4rem);
    column-gap: clamp(2rem, 3vw, 3.5rem);
    overflow: hidden;
    isolation: isolate;
    border: 1px solid color-mix(in srgb, var(--theme-border, #dbe5e8) 65%, transparent);
    border-radius: clamp(1.25rem, 1.8vw, 1.75rem);
    background: var(--theme-card-bg, #fff);
    box-shadow: 0 1.5rem 4rem color-mix(in srgb, var(--theme-text, #0f172a) 9%, transparent);
}

/* ── Dekor katmanları ── */
.home-why__dekor {
    position: absolute;
    inset: 0;
    z-index: 0;
    border-radius: inherit;
    overflow: hidden;
    pointer-events: none;
}

.home-why__dekor-layer {
    position: absolute;
    pointer-events: none;
}

.home-why__dekor-layer--base {
    inset: 0;
    background:
        radial-gradient(
            ellipse 46% 54% at 31% 51%,
            color-mix(in srgb, var(--theme-primary) 9%, transparent) 0%,
            color-mix(in srgb, var(--theme-primary) 4%, transparent) 42%,
            transparent 72%
        ),
        linear-gradient(
            115deg,
            color-mix(in srgb, var(--theme-primary) 3%, var(--theme-card-bg, #fff)) 0%,
            var(--theme-card-bg, #fff) 48%,
            color-mix(in srgb, var(--theme-primary) 2%, var(--theme-card-bg, #fff)) 100%
        );
}

.home-why__dekor-layer--blob-tl {
    top: 0;
    left: 0;
    width: clamp(17rem, 24vw, 24rem);
    height: clamp(15rem, 21vw, 20rem);
    border-radius: 0 0 82% 0;
    background: linear-gradient(
        145deg,
        color-mix(in srgb, var(--theme-primary) 16%, var(--theme-card-bg, #fff)),
        color-mix(in srgb, var(--theme-primary) 6%, var(--theme-card-bg, #fff))
    );
    opacity: 0.72;
}

.home-why__dekor-layer--glow-mid,
.home-why__dekor-layer--highlight {
    display: none;
}

.home-why__dekor-layer--dots-tl {
    top: 3rem;
    left: 3.25rem;
    width: 7rem;
    height: 7rem;
    opacity: 0.8;
    background-image: radial-gradient(circle, color-mix(in srgb, var(--theme-bg, #fff) 84%, transparent) 1.5px, transparent 1.7px);
    background-size: 0.8rem 0.8rem;
}

.home-why__dekor-layer--dots-tr {
    top: 3.25rem;
    right: 4rem;
    width: 7.5rem;
    height: 7.5rem;
    opacity: 0.55;
    background-image: radial-gradient(circle, color-mix(in srgb, var(--theme-primary) 27%, transparent) 1.4px, transparent 1.6px);
    background-size: 0.78rem 0.78rem;
}

.home-why__dekor-layer--waves-tr {
    top: 0;
    right: 0;
    width: min(33rem, 38%);
    height: min(22rem, 45%);
    opacity: 0.1;
    color: color-mix(in srgb, var(--theme-primary) 28%, transparent);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 520 360' fill='none'%3E%3Cpath d='M0 52 C90 18 180 86 270 52 S450 20 520 56' stroke='currentColor' stroke-width='.9' opacity='.45'/%3E%3Cpath d='M0 88 C96 54 192 122 288 88 S432 56 520 92' stroke='currentColor' stroke-width='.85' opacity='.4'/%3E%3Cpath d='M0 124 C88 92 176 158 264 124 S400 92 520 128' stroke='currentColor' stroke-width='.8' opacity='.36'/%3E%3Cpath d='M0 160 C102 126 204 194 306 160 S408 128 520 164' stroke='currentColor' stroke-width='.75' opacity='.32'/%3E%3Cpath d='M0 196 C94 164 188 230 282 196 S376 164 520 200' stroke='currentColor' stroke-width='.7' opacity='.28'/%3E%3Cpath d='M0 232 C86 200 172 266 258 232 S428 200 520 236' stroke='currentColor' stroke-width='.65' opacity='.24'/%3E%3Cpath d='M0 268 C98 236 196 302 294 268 S392 236 520 272' stroke='currentColor' stroke-width='.6' opacity='.2'/%3E%3Cpath d='M0 304 C92 272 184 338 276 304 S368 272 520 308' stroke='currentColor' stroke-width='.55' opacity='.16'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: right top;
    mask-image: linear-gradient(165deg, #000 0%, transparent 88%);
}

.home-why__panel > *:not(.home-why__dekor) {
    position: relative;
}

/* ── Mockup dış kapsayıcı ── */
.home-why__mockup {
    position: relative;
    z-index: 2;
    grid-column: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    padding: clamp(1rem, 2vw, 2rem) 0;
    isolation: isolate;
    overflow: visible;
    background: transparent;
}

.home-why__mockup::before,
.home-why__mockup::after {
    content: '';
    position: absolute;
    pointer-events: none;
}

.home-why__mockup::before {
    z-index: -1;
    left: 45%;
    top: 52%;
    width: clamp(34rem, 38vw, 42rem);
    height: clamp(25rem, 29vw, 31rem);
    aspect-ratio: auto;
    border-radius: 50%;
    background:
        radial-gradient(
            ellipse 58% 66% at 39% 54%,
            color-mix(
                in srgb,
                var(--theme-primary) 15%,
                transparent
            ) 0%,
            color-mix(
                in srgb,
                var(--theme-primary) 8%,
                transparent
            ) 42%,
            transparent 75%
        ),
        radial-gradient(
            ellipse 72% 46% at 54% 72%,
            color-mix(
                in srgb,
                var(--theme-accent, var(--theme-primary)) 8%,
                transparent
            ) 0%,
            transparent 72%
        );
    filter: blur(30px);
    transform: translate(-50%, -50%);
    opacity: 0.82;
}

.home-why__mockup::after {
    z-index: 0;
    left: 50%;
    bottom: 3%;
    width: min(78%, 37rem);
    height: 2.25rem;
    border-radius: 50%;
    background: radial-gradient(
        ellipse,
        color-mix(
            in srgb,
            var(--theme-text, #0f172a) 18%,
            transparent
        ) 0%,
        transparent 72%
    );
    filter: blur(14px);
    transform: translateX(-50%);
    opacity: 0.62;
}

.home-why__mockup .home-mockup-composite,
.home-why__mockup .home-mockup-device {
    position: relative;
    z-index: 1;
    width: min(100%, 48rem);
    max-width: 100%;
    margin: 0 auto;
    line-height: 0;
    background: transparent;
    filter: drop-shadow(0 24px 40px color-mix(in srgb, var(--theme-text) 9%, transparent));
    transform: none;
}

/* Mockup iç layout (video/frame dokunulmaz) */
.home-why__mockup .computer-box {
    width: 100%;
    background: transparent;
    isolation: isolate;
}

.home-why__mockup .inner {
    background: transparent;
}

.home-why__mockup .inner:has(.screen-media),
.home-why__mockup .inner:has(.home-hero__media--poster),
.home-why__mockup .inner:has(.home-hero__media--video) {
    background: var(--site-bg);
}

.home-why__mockup .device-frame {
    background: transparent;
}

.home-why__mockup .inner--perspective {
    border-radius: 0;
    clip-path: var(--mc-clip);
    -webkit-clip-path: var(--mc-clip);
    overflow: hidden;
}

.home-why__mockup .home-hero__media-stack,
.home-why__mockup .mockup-screen-media {
    position: relative !important;
    inset: auto !important;
    width: 100%;
    height: 100%;
    min-height: 100%;
    overflow: hidden;
    transform: none !important;
    clip-path: none !important;
    -webkit-clip-path: none !important;
}

.home-why__mockup .home-hero__media--poster,
.home-why__mockup .home-hero__media--video,
.home-why__mockup .screen-media,
.home-why__mockup .mockup-screen-media__image,
.home-why__mockup .mockup-screen-media__video {
    position: relative !important;
    inset: auto !important;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: var(--mc-fit, cover);
    object-position: var(--mc-position, top center) !important;
    transform: none !important;
    clip-path: none !important;
    -webkit-clip-path: none !important;
}

.home-why__mockup .mockup-screen-media__youtube,
.home-why__mockup .mockup-screen-media__youtube iframe {
    position: relative !important;
    inset: auto !important;
    width: 100%;
    height: 100%;
    transform: none !important;
    clip-path: none !important;
    -webkit-clip-path: none !important;
}

.home-why__mockup .home-hero__media--placeholder,
.home-why__mockup .home-hero__media--fallback {
    display: none;
}

/* ── Sağ içerik ── */
.home-why__content {
    position: relative;
    z-index: 3;
    grid-column: 2;
    width: 100%;
    max-width: 39rem;
    align-self: center;
    padding: clamp(1rem, 1.5vw, 1.5rem) 0;
}

.home-why__eyebrow {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.625rem;
    margin: 0 0 0.875rem;
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--theme-primary);
}

.home-why__eyebrow::after {
    content: '';
    display: block;
    width: clamp(3.25rem, 3.4vw, 3.625rem);
    height: 3px;
    border-radius: var(--ds-radius-pill, 999px);
    background: var(--theme-primary);
}

.home-why__title {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin: 0;
    font-size: clamp(3rem, 3.7vw, 4rem);
    font-weight: 650;
    line-height: 1.02;
    letter-spacing: -0.045em;
    color: var(--site-text, var(--theme-text));
    text-wrap: nowrap;
}

.home-why__title-lead,
.home-why__title-highlight {
    display: block;
}

.home-why__title-highlight {
    color: var(--theme-primary);
    font-weight: inherit;
}

.home-why__text {
    max-width: 36rem;
    margin: 1.25rem 0 0;
    font-size: clamp(0.9375rem, 1vw, 1.0625rem);
    line-height: 1.65;
    color: var(--theme-text-muted, var(--site-text-muted));
}

/* ── Özellik kartları ── */
.home-why__features {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.625rem;
    width: 100%;
    margin: 1.5rem 0 0;
    padding: 0;
    list-style: none;
}

.home-why__feature {
    display: grid;
    grid-template-columns: 2.625rem minmax(0, 1fr);
    align-items: start;
    gap: 0.75rem;
    min-height: 5.5rem;
    padding: 0.75rem 0.875rem;
    border: 1px solid color-mix(in srgb, var(--theme-card-border, var(--theme-border)) 76%, transparent);
    border-radius: 0.75rem;
    background: var(--theme-card-bg, #fff);
    box-shadow: 0 1px 3px color-mix(in srgb, var(--theme-text) 4%, transparent);
    transition:
        transform 240ms cubic-bezier(0.16, 1, 0.3, 1),
        border-color 240ms cubic-bezier(0.16, 1, 0.3, 1),
        box-shadow 240ms cubic-bezier(0.16, 1, 0.3, 1);
}

.home-why__feature-icon {
    display: inline-grid;
    place-items: center;
    width: 2.625rem;
    height: 2.625rem;
    border-radius: 0.625rem;
    border: 1px solid color-mix(in srgb, var(--theme-primary) 12%, transparent);
    background: color-mix(in srgb, var(--theme-primary) 10%, var(--theme-card-bg, #fff));
    color: var(--theme-primary);
    font-size: 1rem;
}

.home-why__feature-copy {
    min-width: 0;
}

.home-why__feature-title {
    margin: 0 0 0.2rem;
    font-size: 0.875rem;
    font-weight: 650;
    line-height: 1.3;
    color: var(--site-text, var(--theme-text));
}

.home-why__feature-text {
    margin: 0;
    font-size: 0.75rem;
    line-height: 1.45;
    color: var(--theme-text-muted, var(--site-text-muted));
}

/* ── CTA ── */
.home-why__action {
    display: inline-flex;
    width: auto;
    margin-top: 1.25rem;
    min-height: 2.875rem;
}

.home-why__action .ik-btn__inner {
    gap: 0.625rem;
    padding-inline: clamp(1.25rem, 1.6vw, 1.5rem);
}

.home-why__action:focus-visible {
    outline: var(--ds-focus-ring, 2px solid color-mix(in srgb, var(--theme-primary) 45%, transparent));
    outline-offset: 3px;
}

/* ── Reveal ── */
@keyframes home-why-rise {
    from {
        opacity: 0;
        transform: translate3d(0, 14px, 0);
    }

    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

.home-why__reveal {
    animation: home-why-rise 0.72s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.home-why__reveal--mockup { animation-delay: 0.04s; }
.home-why__reveal--eyebrow { animation-delay: 0.1s; }
.home-why__reveal--title { animation-delay: 0.16s; }
.home-why__reveal--text { animation-delay: 0.22s; }
.home-why__reveal--features { animation-delay: 0.28s; }
.home-why__reveal--action { animation-delay: 0.34s; }

/* ── 1024–1279px ── */
@media (min-width: 1024px) and (max-width: 1279px) {
    .home-why__panel {
        padding: clamp(2rem, 3vw, 2.625rem);
        column-gap: clamp(1.5rem, 2.5vw, 2.5rem);
    }

    .home-why__mockup .home-mockup-composite,
    .home-why__mockup .home-mockup-device {
        width: min(100%, 43.75rem);
    }

    .home-why__title {
        font-size: clamp(3rem, 3.5vw, 3.5rem);
    }
}

/* ── 768–1023px ── */
@media (max-width: 1023px) {
    .home-why__panel {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto;
        padding: clamp(2rem, 4vw, 2.5rem);
    }

    .home-why__mockup {
        grid-row: 1;
        padding: 1rem 0;
    }

    .home-why__mockup::before {
        left: 50%;
        top: 50%;
        width: clamp(24rem, 68vw, 34rem);
        height: clamp(18rem, 50vw, 25rem);
        opacity: 0.66;
    }

    .home-why__mockup .home-mockup-composite,
    .home-why__mockup .home-mockup-device {
        width: min(100%, 43.75rem);
    }

    .home-why__content {
        grid-column: 1;
        grid-row: 2;
        max-width: none;
        padding: 1rem 0 0;
    }

    .home-why__title {
        text-wrap: balance;
        font-size: clamp(2.375rem, 5vw, 3rem);
    }

    .home-why__dekor-layer--blob-tl {
        width: clamp(14rem, 28vw, 18rem);
        height: clamp(12rem, 22vw, 15rem);
    }

    .home-why__dekor-layer--waves-tr {
        opacity: 0.07;
    }
}

/* ── 480–767px ── */
@media (max-width: 767px) {
    .home-why__panel {
        padding: clamp(1.25rem, 4vw, 1.5rem);
    }

    .home-why__title {
        font-size: clamp(2.125rem, 10vw, 2.75rem);
    }

    .home-why__features {
        grid-template-columns: 1fr;
    }

    .home-why__mockup::before {
        width: clamp(18rem, 78vw, 25rem);
        height: clamp(13rem, 57vw, 18rem);
        filter: blur(24px);
        opacity: 0.52;
    }

    .home-why__mockup .home-mockup-composite,
    .home-why__mockup .home-mockup-device {
        width: 100%;
    }

    .home-why__action {
        width: 100%;
    }

    .home-why__dekor-layer--waves-tr {
        display: none;
    }
}

/* ── ≤479px ── */
@media (max-width: 479px) {
    .home-why__panel {
        padding: clamp(1.125rem, 4.5vw, 1.25rem);
    }

    .home-why__title {
        font-size: clamp(2.125rem, 9vw, 2.375rem);
        text-wrap: balance;
    }

    .home-why__dekor-layer--blob-tl {
        width: clamp(12rem, 40vw, 15rem);
        height: clamp(10rem, 34vw, 13rem);
        opacity: 0.55;
    }

    .home-why__dekor-layer--dots-tl,
    .home-why__dekor-layer--dots-tr {
        opacity: 0.35;
    }
}

@media (hover: hover) and (pointer: fine) {
    .home-why__feature:hover {
        transform: translateY(-2px);
        border-color: color-mix(in srgb, var(--theme-primary) 24%, var(--theme-card-border, var(--theme-border)));
        box-shadow: 0 6px 18px color-mix(in srgb, var(--theme-text) 6%, transparent);
    }
}

@media (prefers-reduced-motion: reduce) {
    .home-why__reveal {
        animation: none;
        opacity: 1;
        transform: none;
    }

    .home-why__feature {
        transition: none;
    }

    .home-why__feature:hover {
        transform: none;
    }
}
.home-process {
    --home-process-cycle: 8s;
    --home-process-node-size: clamp(4.25rem, 6.5vw, 5.25rem);
    --home-process-track-y: calc(0.35rem + (var(--home-process-node-size) / 2));
    --home-process-line-color: color-mix(in srgb, var(--theme-accent, var(--theme-primary)) 72%, transparent);
    --process-line-start: 12.5%;
    --process-line-end: 12.5%;
    --process-dot-size: 0.5rem;
    --process-dot-travel-portion: 0.94;
    --process-node-pulse-step: calc(var(--home-process-cycle) * var(--process-dot-travel-portion) / 3);
    background: transparent;
    border-top: 0;
}
.home-process__head {
    max-width: 44rem;
    margin: 0 auto var(--home-head-gap);
    text-align: center;
}
.home-process__eyebrow {
    margin: 0 0 0.75rem;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--theme-primary);
}
.home-process__title {
    margin: 0;
    font-size: clamp(1.75rem, 2.5vw, 2.5rem);
    font-weight: var(--theme-heading-weight, 300);
    line-height: 1.12;
    letter-spacing: -0.02em;
    color: var(--site-text);
    text-wrap: balance;
}
.home-process__title-highlight {
    color: var(--theme-accent, var(--theme-primary));
    font-weight: inherit;
}
.home-process__desc {
    margin: 1rem auto 0;
    max-width: 52ch;
    font-size: clamp(0.95rem, 1.15vw, 1.05rem);
    line-height: 1.7;
    color: var(--site-text-muted);
}
.home-process__panel {
    position: relative;
    overflow: visible;
    padding: clamp(1.75rem, 3vw, 2.75rem) clamp(1.25rem, 2.5vw, 2rem) clamp(2.5rem, 4vw, 3.25rem);
}
.home-process__timeline {
    position: relative;
    overflow: visible;
}
.home-process__line {
    display: none;
}
.home-process__steps {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--ds-gap-md, clamp(1.25rem, 3vw, 2rem)) var(--ds-gap, 1rem);
    list-style: none;
    margin: 0;
    padding: 0;
}
.home-process__step {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    min-width: 0;
    gap: var(--ds-gap-sm, 0.75rem);
}
.home-process__node {
    position: relative;
    z-index: 2;
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: var(--home-process-node-size);
    height: var(--home-process-node-size);
    border-radius: 50%;
    background: var(--theme-text, #0f172a);
    color: var(--theme-bg, #fff);
    box-shadow: var(--ds-elevation-2, 0 4px 20px color-mix(in srgb, var(--theme-text, #0f172a) 12%, transparent));
}
.home-process__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--ds-icon-xl, 2rem);
    height: var(--ds-icon-xl, 2rem);
    font-size: var(--ds-icon-lg, 1.5rem);
    line-height: 1;
}
.home-process__badge {
    position: absolute;
    top: -0.2rem;
    right: -0.35rem;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.65rem;
    height: 1.65rem;
    padding: 0 var(--ds-gap-xs, 0.5rem);
    border-radius: var(--ds-radius-pill, 999px);
    background: var(--theme-accent, var(--theme-primary));
    color: color-mix(in srgb, var(--theme-bg, #fff) 92%, var(--theme-text, #0f172a));
    font-size: 0.6875rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.04em;
    box-shadow: 0 0 0 2px var(--theme-card-bg, var(--theme-bg, #f5f8f8));
}
.home-process__body {
    min-width: 0;
    max-width: 18rem;
}
.home-process__step-title {
    margin: 0;
    font-size: 1.0625rem;
    font-weight: var(--theme-heading-weight, 300);
    line-height: 1.35;
    color: var(--site-text);
}
.home-process__step-text {
    margin: 0.35rem 0 0;
    font-size: 0.9375rem;
    line-height: 1.65;
    color: var(--site-text-muted);
}
@keyframes home-process-node-pulse {
    0%, 16%, 100% {
        transform: scale(1);
        box-shadow: var(--ds-elevation-2, 0 4px 20px color-mix(in srgb, var(--theme-text, #0f172a) 12%, transparent));
    }
    4%, 10% {
        transform: scale(1.04);
        box-shadow:
            0 0 0 3px color-mix(in srgb, var(--theme-accent, var(--theme-primary)) 24%, transparent),
            0 10px 28px color-mix(in srgb, var(--theme-accent, var(--theme-primary)) 18%, transparent);
    }
}
@keyframes home-process-dot-travel {
    0%, 100% {
        left: 0%;
        opacity: 0;
        transform: translate(-50%, -50%);
    }
    3% {
        left: 0%;
        opacity: 1;
        transform: translate(-50%, -50%);
    }
    97% {
        left: 100%;
        opacity: 1;
        transform: translate(-50%, -50%);
    }
    99% {
        left: 100%;
        opacity: 0;
        transform: translate(-50%, -50%);
    }
}
.home-process.is-animated:not(.is-visible) .home-process__eyebrow,
.home-process.is-animated:not(.is-visible) .home-process__title,
.home-process.is-animated:not(.is-visible) .home-process__desc,
.home-process.is-animated:not(.is-visible) .home-process__panel {
    opacity: 0;
    transform: translateY(1.25rem);
}
.home-process.is-animated:not(.is-visible) .home-process__step {
    opacity: 0;
    transform: translateY(1.25rem);
}
.home-process.is-animated:not(.is-visible) .home-process__line {
    transform: scaleX(0);
}
.home-process.is-animated:not(.is-visible) .home-process__node {
    opacity: 0;
}
.home-process.is-animated.is-visible .home-process__eyebrow,
.home-process.is-animated.is-visible .home-process__title,
.home-process.is-animated.is-visible .home-process__desc,
.home-process.is-animated.is-visible .home-process__panel {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.55s ease, transform 0.55s ease;
}
.home-process.is-animated.is-visible .home-process__step {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.55s ease, transform 0.55s ease;
}
.home-process.is-animated.is-visible .home-process__eyebrow {
    transition-delay: 0.05s;
}
.home-process.is-animated.is-visible .home-process__title {
    transition-delay: 0.12s;
}
.home-process.is-animated.is-visible .home-process__desc {
    transition-delay: 0.2s;
}
.home-process.is-animated.is-visible .home-process__panel {
    transition-delay: 0.26s;
}
.home-process.is-animated.is-visible .home-process__step:nth-child(1) {
    transition-delay: 0.28s;
}
.home-process.is-animated.is-visible .home-process__step:nth-child(2) {
    transition-delay: 0.38s;
}
.home-process.is-animated.is-visible .home-process__step:nth-child(3) {
    transition-delay: 0.48s;
}
.home-process.is-animated.is-visible .home-process__step:nth-child(4) {
    transition-delay: 0.58s;
}
.home-process.is-animated.is-visible .home-process__node {
    opacity: 1;
    transition: opacity 0.45s ease;
}
.home-process.is-animated.is-visible .home-process__step:nth-child(1) .home-process__node {
    transition-delay: 0.34s;
}
.home-process.is-animated.is-visible .home-process__step:nth-child(2) .home-process__node {
    transition-delay: 0.44s;
}
.home-process.is-animated.is-visible .home-process__step:nth-child(3) .home-process__node {
    transition-delay: 0.54s;
}
.home-process.is-animated.is-visible .home-process__step:nth-child(4) .home-process__node {
    transition-delay: 0.64s;
}
@media (min-width: 1024px) {
    .home-process__line {
        display: block;
        position: absolute;
        z-index: 0;
        top: var(--home-process-track-y);
        inset-inline-start: var(--process-line-start);
        inset-inline-end: var(--process-line-end);
        height: 2px;
        border: 0;
        border-radius: 0;
        background: repeating-linear-gradient(
            90deg,
            var(--home-process-line-color) 0 4px,
            transparent 4px 10px
        );
        transform-origin: left center;
        transition: transform 0.9s cubic-bezier(0.22, 1, 0.36, 1) 0.18s;
        overflow: visible;
    }
    .home-process.is-visible .home-process__line::after {
        content: '';
        position: absolute;
        z-index: 1;
        top: 50%;
        left: 0;
        inline-size: var(--process-dot-size);
        block-size: var(--process-dot-size);
        border-radius: 50%;
        background: var(--theme-accent, var(--theme-primary));
        box-shadow:
            0 0 0 3px color-mix(in srgb, var(--theme-accent, var(--theme-primary)) 18%, transparent),
            0 0 10px color-mix(in srgb, var(--theme-accent, var(--theme-primary)) 28%, transparent);
        transform: translate(-50%, -50%);
        pointer-events: none;
        opacity: 0;
        animation: home-process-dot-travel var(--home-process-cycle) linear 0.85s infinite;
        will-change: left, opacity;
    }
    .home-process.is-visible .home-process__step:nth-child(1) .home-process__node {
        animation: home-process-node-pulse var(--home-process-cycle) ease-out 0.85s infinite;
    }
    .home-process.is-visible .home-process__step:nth-child(2) .home-process__node {
        animation: home-process-node-pulse var(--home-process-cycle) ease-out calc(0.85s + var(--process-node-pulse-step)) infinite;
    }
    .home-process.is-visible .home-process__step:nth-child(3) .home-process__node {
        animation: home-process-node-pulse var(--home-process-cycle) ease-out calc(0.85s + var(--process-node-pulse-step) * 2) infinite;
    }
    .home-process.is-visible .home-process__step:nth-child(4) .home-process__node {
        animation: home-process-node-pulse var(--home-process-cycle) ease-out calc(0.85s + var(--process-node-pulse-step) * 3) infinite;
    }
    .home-process.is-animated.is-visible .home-process__line {
        transform: scaleX(1);
    }
}
@media (min-width: 768px) and (max-width: 1023px) {
    .home-process__panel {
        padding: clamp(1.35rem, 2.5vw, 2rem) clamp(1rem, 2vw, 1.5rem) clamp(2rem, 3vw, 2.5rem);
    }
    .home-process__steps {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: var(--ds-gap-lg, clamp(1.75rem, 3vw, 2.75rem)) var(--ds-gap-md, clamp(1.25rem, 3vw, 2rem));
    }
    .home-process__line {
        display: none;
    }
    .home-process.is-visible .home-process__step:nth-child(1) .home-process__node {
        animation: home-process-node-pulse var(--home-process-cycle) ease-out 0.85s infinite;
    }
    .home-process.is-visible .home-process__step:nth-child(2) .home-process__node {
        animation: home-process-node-pulse var(--home-process-cycle) ease-out calc(0.85s + var(--process-node-pulse-step)) infinite;
    }
    .home-process.is-visible .home-process__step:nth-child(3) .home-process__node {
        animation: home-process-node-pulse var(--home-process-cycle) ease-out calc(0.85s + var(--process-node-pulse-step) * 2) infinite;
    }
    .home-process.is-visible .home-process__step:nth-child(4) .home-process__node {
        animation: home-process-node-pulse var(--home-process-cycle) ease-out calc(0.85s + var(--process-node-pulse-step) * 3) infinite;
    }
}
@media (max-width: 767px) {
    .home-process__head {
        margin-bottom: var(--home-head-gap);
        text-align: center;
    }
    .home-process__panel {
        padding: var(--ds-card-pad-lg, clamp(1.75rem, 3.5vw, 2.5rem)) var(--ds-gutter, 1.5rem) var(--ds-gap-lg, clamp(1.75rem, 3vw, 2.75rem));
    }
    .home-process__desc {
        margin-inline: auto;
    }
    .home-process__line {
        display: none;
    }
    .home-process__timeline::before {
        content: '';
        position: absolute;
        z-index: 0;
        top: calc(var(--home-process-node-size) / 2);
        bottom: calc(var(--home-process-node-size) / 2);
        left: calc(var(--home-process-node-size) / 2);
        width: 2px;
        transform: translateX(-50%);
        background: repeating-linear-gradient(
            180deg,
            var(--home-process-line-color) 0 5px,
            transparent 5px 10px
        );
        transform-origin: top center;
        transition: transform 0.85s cubic-bezier(0.22, 1, 0.36, 1) 0.2s;
    }
    .home-process.is-visible .home-process__timeline::after {
        content: none;
    }
    .home-process.is-animated:not(.is-visible) .home-process__timeline::before {
        transform: translateX(-50%) scaleY(0);
    }
    .home-process.is-animated.is-visible .home-process__timeline::before {
        transform: translateX(-50%) scaleY(1);
    }
    .home-process__steps {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        row-gap: clamp(2.75rem, 10vw, 4rem);
        padding-left: 0;
    }
    .home-process__step {
        display: grid;
        grid-template-columns: var(--home-process-node-size) minmax(0, 1fr);
        column-gap: var(--ds-gap-lg, clamp(1.5rem, 4vw, 2.25rem));
        row-gap: var(--ds-gap-sm, 0.75rem);
        align-items: start;
        text-align: left;
        padding-inline-start: 0;
    }
    .home-process__node {
        grid-column: 1;
        grid-row: 1;
    }
    .home-process__body {
        grid-column: 2;
        grid-row: 1;
        max-width: none;
        padding-top: 0;
        align-self: center;
    }
    .home-process__step-text {
        margin-top: var(--ds-gap-sm, 0.75rem);
    }
    .home-process.is-visible .home-process__step:nth-child(1) .home-process__node {
        animation: home-process-node-pulse var(--home-process-cycle) ease-out 0.85s infinite;
    }
    .home-process.is-visible .home-process__step:nth-child(2) .home-process__node {
        animation: home-process-node-pulse var(--home-process-cycle) ease-out calc(0.85s + var(--process-node-pulse-step)) infinite;
    }
    .home-process.is-visible .home-process__step:nth-child(3) .home-process__node {
        animation: home-process-node-pulse var(--home-process-cycle) ease-out calc(0.85s + var(--process-node-pulse-step) * 2) infinite;
    }
    .home-process.is-visible .home-process__step:nth-child(4) .home-process__node {
        animation: home-process-node-pulse var(--home-process-cycle) ease-out calc(0.85s + var(--process-node-pulse-step) * 3) infinite;
    }
}
@media (prefers-reduced-motion: reduce) {
    .home-process.is-animated:not(.is-visible) .home-process__eyebrow,
    .home-process.is-animated:not(.is-visible) .home-process__title,
    .home-process.is-animated:not(.is-visible) .home-process__desc,
    .home-process.is-animated:not(.is-visible) .home-process__panel,
    .home-process.is-animated:not(.is-visible) .home-process__step,
    .home-process.is-animated:not(.is-visible) .home-process__node {
        opacity: 1;
        transform: none;
    }
    .home-process.is-animated:not(.is-visible) .home-process__line {
        transform: none;
    }
    .home-process__timeline::before {
        transform: translateX(-50%);
        transition: none;
    }
    .home-process__timeline::after,
    .home-process__line::after,
    .home-process.is-visible .home-process__node {
        animation: none;
    }
    .home-process__node,
    .home-process__step-title {
        transition: none;
    }
}

.home-brands.home-section {
    background: transparent;
    border-top: 0;
}

.home-brands__head {
    max-width: 38rem;
    margin: 0 auto calc(var(--home-head-gap) * 0.85);
    text-align: center;
}

.home-brands__mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.125rem;
    height: 2.125rem;
    margin-bottom: 0.65rem;
    border-radius: 50%;
    font-size: 0.85rem;
    color: var(--theme-primary, #2563eb);
    background: color-mix(in srgb, var(--theme-primary, #2563eb) 8%, var(--theme-card-bg, var(--theme-bg, #f5f8f8)));
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--theme-primary, #2563eb) 12%, transparent);
}

.home-brands__eyebrow {
    margin: 0 0 0.4rem;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--theme-primary, #2563eb);
}

.home-brands__title {
    margin: 0;
    font-size: clamp(1.6rem, 2.8vw, 2.1rem);
    font-weight: var(--theme-heading-weight, 300);
    line-height: 1.2;
    letter-spacing: -0.02em;
    color: var(--site-text, #0f172a);
}

.home-brands__desc {
    margin: 0.75rem auto 0;
    max-width: 34ch;
    font-size: 0.98rem;
    line-height: 1.55;
    color: var(--site-text-muted, #64748b);
}

.home-brands__slider {
    position: relative;
    overflow: hidden;
    margin-top: -0.15rem;
    padding: 0.15rem 0;
    -webkit-mask-image: linear-gradient(
        to right,
        transparent 0%,
        #000 10%,
        #000 90%,
        transparent 100%
    );
    mask-image: linear-gradient(
        to right,
        transparent 0%,
        #000 10%,
        #000 90%,
        transparent 100%
    );
}

.home-brands__track {
    display: flex;
    align-items: center;
    gap: clamp(1.25rem, 3.5vw, 2.75rem);
    list-style: none;
    margin: 0;
    padding: 0.75rem 0;
    width: max-content;
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    will-change: transform;
}

.home-brands__track.is-instant {
    transition: none;
}

.home-brands__item {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: clamp(7.5rem, 10.5vw, 10rem);
    min-height: 6rem;
    opacity: 0.65;
    filter: grayscale(1);
    transform: scale(0.94);
    transition:
        opacity 0.55s ease,
        filter 0.55s ease,
        transform 0.55s cubic-bezier(0.4, 0, 0.2, 1);
}

.home-brands__slot {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 6rem;
    padding: 0.75rem 1.1rem;
    border-radius: var(--theme-card-radius, calc(var(--theme-radius, 8px) + 4px));
    border: 1px solid var(--theme-card-border, var(--theme-border, #dbe5e8));
    background: var(--theme-card-bg, var(--theme-bg, #f5f8f8));
    transition:
        border-color 0.55s ease,
        box-shadow 0.55s ease,
        background 0.55s ease;
}

.home-brands__item.is-active {
    opacity: 1;
    filter: grayscale(0);
    transform: scale(1.08);
}

.home-brands__item.is-active .home-brands__slot {
    border-color: color-mix(in srgb, var(--theme-primary, #2563eb) 22%, var(--theme-card-border, var(--theme-border, #dbe5e8)));
    background: color-mix(in srgb, var(--theme-primary, #2563eb) 4%, var(--theme-card-bg, var(--theme-bg, #f5f8f8)));
    box-shadow: var(--theme-card-shadow, 0 16px 48px color-mix(in srgb, var(--theme-text, #0f172a) 8%, transparent));
}

.home-brands__item.is-prev,
.home-brands__item.is-next {
    opacity: 0.75;
    transform: scale(0.96);
}

.home-brands__item.is-far {
    opacity: 0.45;
}

.home-brands__item:hover:not(.is-active) {
    filter: grayscale(0.55);
    opacity: 0.82;
}

.home-brands__item.is-active:hover {
    filter: grayscale(0);
    opacity: 1;
}

.home-brands__logo {
    display: block;
    max-height: clamp(3.625rem, 5vw, 4rem);
    width: auto;
    max-width: 100%;
    object-fit: contain;
    user-select: none;
    pointer-events: none;
}

.home-brands__name {
    display: block;
    width: 100%;
    font-size: clamp(0.9rem, 1.8vw, 1.05rem);
    font-weight: 600;
    letter-spacing: 0.005em;
    line-height: 1.3;
    text-align: center;
    color: var(--site-text-muted, #64748b);
}

.home-brands__item.is-active .home-brands__name {
    color: var(--site-text, #0f172a);
}

.home-brands__slider.is-static .home-brands__track {
    transition: none;
    width: 100%;
    justify-content: center;
}

@media (max-width: 1023px) {
    .home-brands__item {
        width: clamp(6.25rem, 13vw, 8rem);
    }

    .home-brands__track {
        gap: clamp(1rem, 3vw, 2rem);
    }
}

@media (max-width: 639px) {
    .home-brands__head {
        margin-bottom: calc(var(--home-head-gap) * 0.75);
    }

    .home-brands__slider {
        margin-top: 0;
        -webkit-mask-image: linear-gradient(
            to right,
            transparent 0%,
            #000 6%,
            #000 94%,
            transparent 100%
        );
        mask-image: linear-gradient(
            to right,
            transparent 0%,
            #000 6%,
            #000 94%,
            transparent 100%
        );
    }

    .home-brands__item {
        width: clamp(5.75rem, 28vw, 7.25rem);
        min-height: 5.5rem;
    }

    .home-brands__slot {
        min-height: 5.5rem;
        padding: 0.6rem 0.85rem;
    }

    .home-brands__logo {
        max-height: 3.5rem;
    }

    .home-brands__name {
        font-size: 0.92rem;
    }

    .home-brands__item.is-active {
        transform: scale(1.06);
    }
}

@media (max-width: 767px) {
    .home-brands__track.is-mobile-slider {
        transition: transform 500ms cubic-bezier(0.4, 0, 0.2, 1);
        will-change: transform;
    }

    .home-brands__track.is-mobile-slider.is-mobile-instant {
        transition: none !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .home-brands__track,
    .home-brands__item,
    .home-brands__slot {
        transition: none;
    }
}

/* Anasayfa builder — cihaz görünürlüğü (FAZ 5.8.4) */
@media (min-width: 1024px) {
    .hp-section-wrap.hide-desktop {
        display: none !important;
    }
}

@media (min-width: 768px) and (max-width: 1023px) {
    .hp-section-wrap.hide-tablet {
        display: none !important;
    }
}

@media (max-width: 767px) {
    .hp-section-wrap.hide-mobile {
        display: none !important;
    }
}