/* ============================================================
   ALVORN TECH — HERO ONLY HOME PAGE
   Hero arka planı fixed değildir.
============================================================ */

html,
body.home-page {
    background: #000000;
}

body.home-page {
    min-height: 100%;
    height: auto;

    overflow-x: hidden;
    overflow-y: visible;

    overscroll-behavior-y: auto;
    touch-action: auto;
}

.home-main {
    position: relative;
    z-index: 1;

    background: #000000;
}

/* ============================================================
   HERO
============================================================ */

.home-hero {
    position: relative;

    width: 100%;
    min-height: 100vh;
    min-height: 100svh;

    overflow: hidden;

    color: #ffffff;
    background: #000000;

    isolation: isolate;
}

.home-hero-media {
    position: absolute;
    inset: 0;
    z-index: -8;

    width: 100%;
    height: 100%;

    display: block;
    overflow: hidden;

    background: #000000;

    pointer-events: none;
}

.home-hero-image {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;
    object-position: center;

    filter:
        saturate(0.94)
        contrast(1.05)
        brightness(0.78);

    transform:
        translate3d(0, 0, 0)
        scale(1.01);

    transform-origin: center;

    backface-visibility: hidden;
}

.home-hero-overlay {
    position: absolute;
    inset: 0;
    z-index: -5;

    background:
        linear-gradient(
            180deg,
            rgba(0, 0, 0, 0.22) 0%,
            rgba(0, 0, 0, 0.06) 27%,
            rgba(0, 0, 0, 0.13) 52%,
            rgba(0, 0, 0, 0.54) 76%,
            rgba(0, 0, 0, 0.94) 100%
        );

    pointer-events: none;
}

.home-hero-vignette {
    position: absolute;
    inset: 0;
    z-index: -4;

    background:
        radial-gradient(
            ellipse at 50% 43%,
            transparent 0%,
            transparent 32%,
            rgba(0, 0, 0, 0.09) 54%,
            rgba(0, 0, 0, 0.72) 100%
        ),
        linear-gradient(
            90deg,
            rgba(0, 0, 0, 0.67) 0%,
            rgba(0, 0, 0, 0.13) 30%,
            rgba(0, 0, 0, 0.06) 70%,
            rgba(0, 0, 0, 0.67) 100%
        );

    pointer-events: none;
}

/* ============================================================
   PARTICLES
============================================================ */

.home-particles {
    position: absolute;
    inset: 0;
    z-index: 2;

    overflow: hidden;

    pointer-events: none;

    mix-blend-mode: screen;
}

.home-particle-layer {
    position: absolute;
    left: 0;
    top: 0;

    display: block;

    border-radius: 50%;

    background:
        rgba(128, 202, 255, 0.76);

    will-change:
        transform,
        opacity;
}

.home-particle-layer-a {
    width: 1px;
    height: 1px;

    box-shadow:
        3.2vw 12.8vh 0px 0px rgba(220, 241, 255, 0.31),
        15.3vw 12.8vh 0px 0px rgba(151, 210, 255, 0.56),
        16.2vw 73.1vh 1px 0px rgba(112, 183, 255, 0.31),
        52.5vw 21.7vh 1px 0px rgba(112, 183, 255, 0.3),
        34.8vw 21.8vh 0px 0px rgba(220, 241, 255, 0.41),
        22.2vw 22.8vh 0px 0px rgba(112, 183, 255, 0.66),
        36.1vw 21.6vh 1px 0px rgba(220, 241, 255, 0.26),
        64.5vw 23.0vh 0px 0px rgba(220, 241, 255, 0.56),
        33.7vw 80.6vh 1px 0px rgba(220, 241, 255, 0.27),
        30.2vw 56.9vh 1px 0px rgba(220, 241, 255, 0.53),
        94.3vw 95.7vh 1px 0px rgba(112, 183, 255, 0.59),
        88.1vw 55.7vh 0px 0px rgba(82, 158, 244, 0.29),
        4.8vw 78.2vh 0px 0px rgba(82, 158, 244, 0.55),
        66.3vw 29.3vh 0px 0px rgba(82, 158, 244, 0.53),
        12.9vw 21.4vh 0px 0px rgba(82, 158, 244, 0.44),
        55.9vw 13.3vh 0px 0px rgba(112, 183, 255, 0.63),
        94.2vw 21.3vh 0px 0px rgba(151, 210, 255, 0.56),
        47.7vw 49.8vh 1px 0px rgba(82, 158, 244, 0.62),
        63.1vw 5.7vh 1px 0px rgba(112, 183, 255, 0.46),
        95.4vw 75.7vh 1px 0px rgba(82, 158, 244, 0.46),
        35.5vw 3.1vh 1px 0px rgba(220, 241, 255, 0.5),
        18.9vw 6.3vh 0px 0px rgba(112, 183, 255, 0.49),
        90.6vw 87.1vh 1px 0px rgba(151, 210, 255, 0.66),
        68.2vw 55.2vh 0px 0px rgba(220, 241, 255, 0.35),
        70.8vw 46.3vh 1px 0px rgba(220, 241, 255, 0.39),
        13.9vw 77.2vh 1px 0px rgba(151, 210, 255, 0.66),
        57.7vw 18.0vh 0px 0px rgba(112, 183, 255, 0.57),
        15.5vw 38.5vh 1px 0px rgba(82, 158, 244, 0.34),
        54.0vw 25.3vh 0px 0px rgba(82, 158, 244, 0.57),
        5.2vw 61.0vh 0px 0px rgba(82, 158, 244, 0.36),
        43.7vw 69.4vh 1px 0px rgba(151, 210, 255, 0.42),
        38.9vw 21.1vh 1px 0px rgba(151, 210, 255, 0.39),
        69.0vw 37.4vh 0px 0px rgba(151, 210, 255, 0.28),
        86.9vw 68.6vh 1px 0px rgba(220, 241, 255, 0.44),
        65.2vw 42.1vh 1px 0px rgba(112, 183, 255, 0.46),
        79.6vw 81.9vh 1px 0px rgba(112, 183, 255, 0.37);

    animation:
        alvornParticlesA
        10s
        linear
        infinite
        alternate,
        alvornParticlePulse
        4.2s
        ease-in-out
        infinite;
}

.home-particle-layer-b {
    width: 1.7px;
    height: 1.7px;

    box-shadow:
        28.9vw 50.2vh 0px 0px rgba(151, 210, 255, 0.54),
        40.8vw 50.0vh 2px 0px rgba(220, 241, 255, 0.37),
        76.9vw 4.4vh 3px 1px rgba(82, 158, 244, 0.59),
        97.1vw 19.3vh 1px 1px rgba(112, 183, 255, 0.77),
        84.1vw 46.6vh 1px 0px rgba(82, 158, 244, 0.74),
        4.3vw 85.3vh 0px 0px rgba(82, 158, 244, 0.77),
        50.4vw 89.0vh 0px 1px rgba(220, 241, 255, 0.36),
        95.3vw 14.7vh 3px 1px rgba(151, 210, 255, 0.53),
        55.8vw 35.6vh 3px 0px rgba(82, 158, 244, 0.42),
        79.1vw 39.7vh 0px 0px rgba(112, 183, 255, 0.64),
        41.4vw 34.9vh 1px 0px rgba(220, 241, 255, 0.36),
        80.0vw 54.6vh 3px 0px rgba(82, 158, 244, 0.73),
        70.4vw 9.8vh 0px 0px rgba(112, 183, 255, 0.68),
        91.6vw 88.1vh 0px 1px rgba(220, 241, 255, 0.58),
        23.0vw 6.3vh 2px 0px rgba(112, 183, 255, 0.34),
        85.7vw 91.4vh 3px 1px rgba(151, 210, 255, 0.52),
        64.6vw 66.8vh 1px 0px rgba(112, 183, 255, 0.8),
        52.7vw 95.6vh 3px 0px rgba(220, 241, 255, 0.38),
        12.5vw 41.6vh 2px 0px rgba(220, 241, 255, 0.45),
        35.3vw 44.3vh 1px 0px rgba(220, 241, 255, 0.55),
        30.8vw 52.4vh 0px 0px rgba(112, 183, 255, 0.45),
        59.2vw 49.1vh 2px 1px rgba(82, 158, 244, 0.57),
        88.3vw 69.1vh 0px 0px rgba(220, 241, 255, 0.52),
        21.3vw 57.2vh 1px 0px rgba(112, 183, 255, 0.34),
        48.4vw 76.3vh 3px 0px rgba(82, 158, 244, 0.37),
        74.8vw 48.4vh 0px 0px rgba(82, 158, 244, 0.32);

    animation:
        alvornParticlesB
        14s
        linear
        infinite
        alternate-reverse,
        alvornParticlePulse
        5.7s
        ease-in-out
        infinite
        reverse;
}

.home-particle-layer-c {
    width: 2.2px;
    height: 2.2px;

    box-shadow:
        28.8vw 46.1vh 3px 0px rgba(112, 183, 255, 0.47),
        56.0vw 51.8vh 2px 0px rgba(151, 210, 255, 0.65),
        82.5vw 18.0vh 2px 0px rgba(82, 158, 244, 0.86),
        52.1vw 62.3vh 1px 0px rgba(112, 183, 255, 0.78),
        59.5vw 19.3vh 3px 0px rgba(220, 241, 255, 0.86),
        42.7vw 16.7vh 0px 0px rgba(112, 183, 255, 0.76),
        86.7vw 63.1vh 2px 1px rgba(112, 183, 255, 0.91),
        22.8vw 45.8vh 0px 0px rgba(112, 183, 255, 0.75),
        46.7vw 58.3vh 0px 0px rgba(220, 241, 255, 0.89),
        9.3vw 31.6vh 3px 0px rgba(151, 210, 255, 0.6),
        60.7vw 49.5vh 3px 0px rgba(220, 241, 255, 0.85),
        57.6vw 21.2vh 0px 1px rgba(112, 183, 255, 0.59),
        26.0vw 27.2vh 2px 0px rgba(82, 158, 244, 0.71),
        27.8vw 16.7vh 3px 0px rgba(220, 241, 255, 0.65),
        23.9vw 92.6vh 3px 1px rgba(82, 158, 244, 0.82),
        8.5vw 9.4vh 1px 0px rgba(112, 183, 255, 0.52);

    animation:
        alvornParticlesC
        18s
        linear
        infinite
        alternate,
        alvornParticlePulse
        5s
        ease-in-out
        infinite;
}

@keyframes alvornParticlesA {
    from {
        transform:
            translate3d(
                -2vw,
                6vh,
                0
            );
    }

    to {
        transform:
            translate3d(
                4vw,
                -10vh,
                0
            );
    }
}

@keyframes alvornParticlesB {
    from {
        transform:
            translate3d(
                3vw,
                -4vh,
                0
            );
    }

    to {
        transform:
            translate3d(
                -5vw,
                9vh,
                0
            );
    }
}

@keyframes alvornParticlesC {
    from {
        transform:
            translate3d(
                -3vw,
                3vh,
                0
            )
            scale(0.97);
    }

    to {
        transform:
            translate3d(
                5vw,
                -7vh,
                0
            )
            scale(1.05);
    }
}

@keyframes alvornParticlePulse {
    0%,
    100% {
        opacity: 0.54;
    }

    50% {
        opacity: 1;
    }
}

/* ============================================================
   HERO CONTENT
============================================================ */

.home-hero-container {
    position: relative;
    z-index: 5;

    min-height: 100vh;
    min-height: 100svh;
}

.home-hero-content {
    position: absolute;
    left: 50%;
    top: 53%;

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

    text-align: center;

    transform:
        translate3d(
            -50%,
            -50%,
            0
        );
}

.home-hero-kicker {
    display: block;

    margin-bottom: 18px;

    color:
        rgba(214, 226, 242, 0.78);

    font-size: 13px;
    line-height: 1.4;

    text-shadow:
        0 4px 22px
        rgba(0, 0, 0, 0.95);
}

.home-hero-title {
    margin: 0;

    color: #ffffff;

    font-size:
        clamp(
            3.35rem,
            5.7vw,
            6.25rem
        );

    font-weight: 500;
    line-height: 0.96;
    letter-spacing: -0.064em;

    text-shadow:
        0 13px 45px
        rgba(0, 0, 0, 0.96);
}

.home-hero-title > span {
    display: block;
}

.home-hero-word-wrap {
    min-height: 1.04em;
    margin-top: 6px;
}

.home-hero-word {
    display: inline-block;

    color: transparent;

    background:
        linear-gradient(
            100deg,
            #f6f9ff 0%,
            #d4e8fc 43%,
            #6eb1ff 100%
        );

    background-clip: text;
    -webkit-background-clip: text;
}

.home-hero-description {
    max-width: 620px;

    margin:
        23px auto
        0;

    color:
        rgba(213, 224, 239, 0.8);

    font-size: 15px;
    line-height: 1.72;

    text-shadow:
        0 5px 25px
        rgba(0, 0, 0, 0.97);
}

.home-hero-action {
    min-height: 50px;
    padding:
        0
        21px;

    margin-top: 26px;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 11px;

    border:
        1px solid
        rgba(120, 183, 255, 0.3);

    border-radius: 999px;

    color: #edf6ff;

    background:
        rgba(4, 18, 36, 0.58);

    box-shadow:
        inset
        0 1px 0
        rgba(255, 255, 255, 0.06),
        0 18px 50px
        rgba(0, 0, 0, 0.28);

    font-size: 12px;
    font-weight: 600;

    transition:
        transform 200ms ease,
        border-color 200ms ease,
        background-color 200ms ease;
}

.home-hero-action:hover {
    transform:
        translate3d(
            0,
            -3px,
            0
        );

    border-color:
        rgba(120, 183, 255, 0.56);

    background:
        rgba(13, 44, 82, 0.75);
}

.home-hero-action svg {
    width: 16px;
    height: 16px;

    color: #76b8ff;
}

/* ============================================================
   SCROLL INDICATOR
============================================================ */

.home-hero-scroll {
    position: absolute;
    left: 50%;
    bottom:
        max(
            18px,
            env(safe-area-inset-bottom)
        );

    z-index: 8;

    display: flex;
    align-items: center;
    gap: 8px;

    color:
        rgba(198, 215, 235, 0.66);

    transform:
        translate3d(
            -50%,
            0,
            0
        );

    font-size: 10px;

    transition:
        opacity 420ms ease,
        transform 520ms
        cubic-bezier(
            0.16,
            1,
            0.3,
            1
        ),
        visibility 0s linear 520ms;

    will-change:
        opacity,
        transform;
}

.home-hero-scroll.is-hidden {
    opacity: 0;
    visibility: hidden;

    transform:
        translate3d(
            -50%,
            13px,
            0
        );

    pointer-events: none;
}

.home-scroll-mouse {
    position: relative;

    width: 19px;
    height: 30px;

    display: block;

    border:
        1px solid
        rgba(199, 219, 242, 0.5);

    border-radius: 999px;
}

.home-scroll-mouse > span {
    position: absolute;
    left: 50%;
    top: 6px;

    width: 2px;
    height: 6px;

    border-radius: 999px;

    background: #72b6ff;

    transform:
        translateX(-50%);

    animation:
        homeMouseScroll
        1.8s
        ease-in-out
        infinite;
}

.home-hero-scroll > svg {
    width: 14px;
    height: 14px;

    color: #70b4ff;

    animation:
        homeScrollChevron
        1.8s
        ease-in-out
        infinite;
}

@keyframes homeMouseScroll {
    0% {
        opacity: 0;

        transform:
            translate3d(
                -50%,
                -2px,
                0
            );
    }

    25% {
        opacity: 1;
    }

    100% {
        opacity: 0;

        transform:
            translate3d(
                -50%,
                10px,
                0
            );
    }
}

@keyframes homeScrollChevron {
    0%,
    100% {
        transform:
            translate3d(
                0,
                -2px,
                0
            );
    }

    50% {
        transform:
            translate3d(
                0,
                4px,
                0
            );
    }
}

/* ============================================================
   FOOTER CONNECTION
============================================================ */

.home-page .site-footer {
    position: relative;
    z-index: 10;

    margin-top: 0;

    border-top:
        1px solid
        rgba(114, 183, 255, 0.16);

    background: #000000;
}

/* ============================================================
   MOBILE
============================================================ */

@media (max-width: 760px) {
    .home-hero-image {
        object-position: center;

        filter:
            saturate(0.93)
            contrast(1.05)
            brightness(0.74);
    }

    .home-hero-content {
        top: 56%;

        width:
            calc(
                100% - 34px
            );
    }

    .home-hero-kicker {
        margin-bottom: 13px;

        font-size: 10px;
    }

    .home-hero-title {
        font-size:
            clamp(
                2.55rem,
                11.6vw,
                3.65rem
            );

        line-height: 0.98;
        letter-spacing: -0.058em;
    }

    .home-hero-description {
        max-width: 340px;

        margin-top: 17px;

        font-size: 12px;
        line-height: 1.62;
    }

    .home-hero-action {
        min-height: 45px;
        padding:
            0
            18px;

        margin-top: 19px;

        font-size: 10.5px;
    }

}

@media
(max-height: 700px)
and (max-width: 760px) {

    .home-hero-content {
        top: 54%;
    }

    .home-hero-title {
        font-size:
            clamp(
                2.25rem,
                10.2vw,
                3rem
            );
    }

    .home-hero-kicker {
        margin-bottom: 9px;
    }

    .home-hero-description {
        margin-top: 12px;

        font-size: 11px;
    }

    .home-hero-action {
        min-height: 42px;

        margin-top: 13px;
    }
}



/* ============================================================
   HERO SONRASI — GENEL HİZMETLER
============================================================ */

.home-capabilities-edge {
    position: relative;

    height: 78px;

    display: grid;
    place-items: center;

    border-top:
        1px solid
        rgba(114, 183, 255, 0.16);

    background:
        linear-gradient(
            180deg,
            rgba(0, 0, 0, 0.94),
            #000000
        );
}

.home-capabilities-edge::before {
    content: "";

    position: absolute;
    left: 50%;
    top: -1px;

    width:
        min(
            720px,
            72vw
        );

    height: 1px;

    transform:
        translateX(-50%);

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(128, 197, 255, 0.95),
            transparent
        );

    box-shadow:
        0 0 34px
        rgba(63, 151, 255, 0.55);
}

.home-capabilities-edge span {
    color: #5f7086;

    font-size: 8px;
    font-weight: 800;
    letter-spacing: 0.22em;
    text-transform: uppercase;
}

.home-capabilities {
    position: relative;

    padding:
        clamp(
            58px,
            6.5vw,
            98px
        )
        0
        clamp(
            72px,
            8vw,
            118px
        );

    overflow: hidden;

    color: #f6f9ff;

    background:
        linear-gradient(
            180deg,
            #000000 0%,
            #030508 46%,
            #000000 100%
        );

    isolation: isolate;
}

.home-capabilities::before {
    content: "ALVORN";

    position: absolute;
    right: -2vw;
    top: 4%;
    z-index: -1;

    color:
        rgba(255, 255, 255, 0.014);

    font-size:
        clamp(
            8rem,
            24vw,
            28rem
        );

    font-weight: 800;
    line-height: 0.8;
    letter-spacing: -0.09em;

    pointer-events: none;
    user-select: none;
}

.home-capabilities::after {
    content: "";

    position: absolute;
    inset: 0;
    z-index: -2;

    opacity: 0.25;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, 0.018) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, 0.018) 1px,
            transparent 1px
        );

    background-size:
        54px
        54px;

    mask-image:
        linear-gradient(
            to bottom,
            black,
            transparent 84%
        );
}

/* ============================================================
   INTRO
============================================================ */

.home-capabilities-intro {
    display: grid;

    grid-template-columns:
        minmax(0, 1.4fr)
        minmax(300px, 0.6fr);

    gap:
        clamp(
            44px,
            7vw,
            112px
        );

    align-items: end;
}

.home-capabilities-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 11px;

    color: #72b7ff;

    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.19em;
    text-transform: uppercase;
}

.home-capabilities-eyebrow::before {
    content: "";

    width: 35px;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            #72b7ff,
            transparent
        );
}

.home-capabilities-signal {
    position: relative;

    width: 100%;
    height: 1px;

    margin:
        13px
        0
        clamp(
            28px,
            3vw,
            42px
        );

    overflow: hidden;

    background:
        rgba(255, 255, 255, 0.075);
}

.home-capabilities-signal > i {
    position: absolute;
    inset: 0;

    display: block;

    background:
        linear-gradient(
            90deg,
            transparent,
            #2d83ff 38%,
            #72b7ff 50%,
            #2d83ff 62%,
            transparent
        );

    transform:
        translate3d(-100%, 0, 0);

    will-change: transform;

    animation:
        homeCapabilitySignal
        6.8s
        ease-in-out
        infinite;
}

@keyframes homeCapabilitySignal {
    0% {
        transform:
            translate3d(-100%, 0, 0);
    }

    58%,
    100% {
        transform:
            translate3d(100%, 0, 0);
    }
}

.home-capabilities-heading h2 {
    max-width: 920px;

    margin: 0;
    padding-bottom: 0.16em;

    overflow: visible;

    color: #f6f9ff;

    font-size:
        clamp(
            3.1rem,
            7vw,
            7.4rem
        );

    font-weight: 540;
    line-height: 1.02;
    letter-spacing: -0.065em;
}

.home-capabilities-heading h2 > span {
    display: block;

    padding-bottom: 0.08em;

    color: transparent;

    background:
        linear-gradient(
            100deg,
            #ffffff,
            #b8dfff 47%,
            #5ba9ff
        );

    background-clip: text;
    -webkit-background-clip: text;
}

.home-capabilities-copy {
    padding-bottom: 8px;
}

.home-capabilities-copy p {
    margin: 0;

    color: #748399;

    font-size: 14px;
    line-height: 1.85;
}

.home-capabilities-copy strong {
    color: #dce8f5;
    font-weight: 550;
}

/* ============================================================
   HİZMET YAPISI
============================================================ */

.home-capabilities-layout {
    margin-top:
        clamp(
            34px,
            4vw,
            56px
        );

    display: grid;

    grid-template-columns:
        minmax(330px, 0.78fr)
        minmax(0, 1.22fr);

    gap:
        clamp(
            42px,
            5vw,
            76px
        );

    align-items: start;
}

/* ============================================================
   MASAÜSTÜ SOL DETAY PANELİ
============================================================ */

.home-capability-detail {
    position: sticky;
    top:
        calc(
            var(
                --alvorn-header-height,
                88px
            ) +
            32px
        );

    min-height: 520px;

    padding:
        clamp(
            27px,
            2.8vw,
            38px
        );

    display: flex;
    flex-direction: column;

    border:
        1px solid
        rgba(114, 183, 255, 0.18);

    background:
        radial-gradient(
            circle at 88% 10%,
            rgba(55, 139, 255, 0.15),
            transparent 35%
        ),
        linear-gradient(
            155deg,
            rgba(10, 17, 27, 0.96),
            rgba(2, 5, 9, 0.98)
        );

    box-shadow:
        0 35px 90px
        rgba(0, 0, 0, 0.42),
        inset 0 1px 0
        rgba(255, 255, 255, 0.04);

    overflow: hidden;
}

.home-capability-detail::before {
    content: "";

    position: absolute;
    left: 0;
    top: 0;

    width: 84px;
    height: 84px;

    border-left:
        1px solid
        #72b7ff;

    border-top:
        1px solid
        #72b7ff;

    opacity: 0.56;

    pointer-events: none;
}

.home-capability-detail::after {
    content: "";

    position: absolute;
    right: -80px;
    bottom: -80px;

    width: 260px;
    height: 260px;

    border:
        1px solid
        rgba(114, 183, 255, 0.09);

    transform:
        rotate(45deg);

    pointer-events: none;
}

.home-capability-detail-top {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.home-capability-detail-top span {
    color: #72b7ff;

    font-size: 8px;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.home-capability-detail-top small {
    color: #4f6075;

    font-size: 8px;
    font-weight: 800;
    letter-spacing: 0.14em;
}

.home-capability-detail-icon {
    position: relative;
    z-index: 2;

    width: 74px;
    height: 74px;

    margin-top:
        clamp(
            40px,
            5vh,
            60px
        );

    display: grid;
    place-items: center;

    border:
        1px solid
        rgba(114, 183, 255, 0.22);

    color: #72b7ff;

    background:
        rgba(7, 18, 31, 0.68);
}

.home-capability-detail-icon svg {
    width: 36px;
    height: 36px;
}

.home-capability-detail-content {
    position: relative;
    z-index: 2;

    margin-top: 27px;
}

.home-capability-detail-content h3 {
    max-width: 100%;

    margin: 0;

    overflow-wrap: anywhere;

    color: #ffffff;

    font-size:
        clamp(
            2.15rem,
            3.15vw,
            4rem
        );

    font-weight: 530;
    line-height: 0.98;
    letter-spacing: -0.055em;
}

.home-capability-detail-content p {
    max-width: 510px;

    margin:
        18px
        0
        0;

    color: #748399;

    font-size: 13px;
    line-height: 1.82;
}

.home-capability-detail-points {
    position: relative;
    z-index: 2;

    margin-top: auto;
    padding-top: 30px;

    display: grid;

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

    gap:
        12px
        22px;
}

.home-capability-detail-points span {
    position: relative;

    padding-left: 16px;

    color: #b7c6d8;

    font-size: 10px;
    line-height: 1.5;
}

.home-capability-detail-points span::before {
    content: "";

    position: absolute;
    left: 0;
    top: 0.62em;

    width: 6px;
    height: 1px;

    background: #72b7ff;
}

/* ============================================================
   HİZMET SATIRLARI
============================================================ */

.home-capability-list {
    min-width: 0;

    border-top:
        1px solid
        rgba(255, 255, 255, 0.09);
}

.home-capability-row {
    position: relative;

    overflow: hidden;

    border-bottom:
        1px solid
        rgba(255, 255, 255, 0.09);
}

.home-capability-row::before {
    content: "";

    position: absolute;
    left: 0;
    right: 0;
    top: 0;

    height: 1px;

    background:
        rgba(255, 255, 255, 0.075);

    pointer-events: none;
}

.home-capability-row > button {
    position: relative;
    z-index: 3;

    width: 100%;
    min-height: 96px;
    padding: 0;

    display: grid;

    grid-template-columns:
        42px
        minmax(0, 1fr)
        auto;

    align-items: center;
    gap: 23px;

    border: 0;

    color: #8d9db1;

    background: transparent;

    text-align: left;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;

    transition:
        color 220ms ease,
        padding-left 320ms
        cubic-bezier(0.16, 1, 0.3, 1);
}

.home-capability-row > button::before {
    content: "";

    position: absolute;
    left: 0;
    top: 0;

    width: 42%;
    height: 2px;

    opacity: 0;

    background:
        linear-gradient(
            90deg,
            transparent 0%,
            rgba(45, 131, 255, 0.16) 18%,
            rgba(45, 131, 255, 0.82) 42%,
            #72b7ff 58%,
            rgba(45, 131, 255, 0.76) 76%,
            transparent 100%
        );

    box-shadow:
        0 0 8px
        rgba(45, 131, 255, 0.8),
        0 0 20px
        rgba(45, 131, 255, 0.58);

    transform:
        translate3d(-115%, 0, 0);

    will-change:
        transform,
        opacity;

    pointer-events: none;
}

.home-capability-row > button:hover,
.home-capability-row.is-active > button {
    color: #ffffff;

    padding-left: 13px;
}

.home-capability-row > button:hover::before {
    opacity: 0.78;

    animation:
        homeCapabilityRowBeam
        4.8s
        cubic-bezier(0.4, 0, 0.2, 1)
        infinite;
}

.home-capability-row.is-active
> button::before {
    opacity: 1;

    animation:
        homeCapabilityRowBeam
        4.8s
        cubic-bezier(0.4, 0, 0.2, 1)
        infinite;
}

@keyframes homeCapabilityRowBeam {
    0% {
        transform:
            translate3d(-115%, 0, 0);
    }

    64%,
    100% {
        transform:
            translate3d(275%, 0, 0);
    }
}

.home-capability-row-icon {
    width: 34px;
    height: 34px;

    display: grid;
    place-items: center;

    border:
        1px solid
        rgba(114, 183, 255, 0.18);

    color: #71839a;

    background:
        rgba(7, 15, 25, 0.58);

    transition:
        color 220ms ease,
        border-color 220ms ease,
        background-color 220ms ease,
        transform 320ms
        cubic-bezier(0.16, 1, 0.3, 1);
}

.home-capability-row-icon svg {
    width: 16px;
    height: 16px;
}

.home-capability-row > button:hover
.home-capability-row-icon,
.home-capability-row.is-active
.home-capability-row-icon {
    color: #72b7ff;

    border-color:
        rgba(114, 183, 255, 0.46);

    background:
        rgba(24, 75, 132, 0.16);

    transform:
        translate3d(0, -2px, 0);
}

.home-capability-row strong {
    color: inherit;

    font-size:
        clamp(
            1.45rem,
            2.45vw,
            2.9rem
        );

    font-weight: 520;
    line-height: 1;
    letter-spacing: -0.05em;
}

.home-capability-row small {
    color: #748399;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;

    transition:
        color 180ms ease;
}

.home-capability-row.is-active small {
    color: #72b7ff;
}

.home-capability-mobile-panel {
    display: none;
}

/* ============================================================
   ALT AÇIKLAMA
============================================================ */

.home-capabilities-footer {
    margin-top:
        clamp(
            28px,
            3vw,
            42px
        );

    padding-top: 22px;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;

    border-top:
        1px solid
        rgba(255, 255, 255, 0.09);
}

.home-capabilities-footer p {
    max-width: 670px;

    margin: 0;

    color: #748399;

    font-size: 12px;
    line-height: 1.7;
}

.home-capabilities-footer a {
    min-height: 52px;
    padding:
        0
        20px;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 11px;

    border:
        1px solid
        rgba(114, 183, 255, 0.34);

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            rgba(114, 183, 255, 0.20),
            rgba(45, 131, 255, 0.10)
        );

    font-size: 10px;
    font-weight: 750;
    letter-spacing: 0.06em;

    transition:
        transform 190ms ease,
        border-color 190ms ease,
        background-color 190ms ease;
}

.home-capabilities-footer a:hover {
    transform:
        translate3d(0, -2px, 0);

    border-color: #72b7ff;

    background:
        linear-gradient(
            135deg,
            rgba(114, 183, 255, 0.30),
            rgba(45, 131, 255, 0.16)
        );
}

.home-capabilities-footer a svg {
    width: 16px;
    height: 16px;

    color: #72b7ff;
}

/* ============================================================
   WHATSAPP — SAĞ ALT CAM TEMA
============================================================ */

.home-page .floating-whatsapp {
    left: auto !important;
    right:
        max(
            22px,
            env(safe-area-inset-right)
        ) !important;

    bottom:
        max(
            22px,
            env(safe-area-inset-bottom)
        ) !important;

    width: 58px !important;
    min-width: 58px !important;
    height: 58px !important;
    padding: 0 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border:
        1px solid
        rgba(127, 196, 255, 0.42) !important;

    border-radius: 16px !important;

    color: #dff1ff !important;

    background:
        linear-gradient(
            145deg,
            rgba(38, 103, 174, 0.34),
            rgba(5, 16, 29, 0.72)
        ) !important;

    box-shadow:
        inset 0 1px 0
        rgba(255, 255, 255, 0.12),
        0 16px 44px
        rgba(0, 0, 0, 0.42),
        0 0 28px
        rgba(45, 131, 255, 0.18) !important;

    backdrop-filter:
        blur(16px)
        saturate(145%);

    -webkit-backdrop-filter:
        blur(16px)
        saturate(145%);

    overflow: hidden;

    transition:
        transform 220ms ease,
        border-color 220ms ease,
        box-shadow 220ms ease !important;
}

.home-page .floating-whatsapp::before {
    content: "";

    position: absolute;
    inset: 0;

    opacity: 0.54;

    background:
        linear-gradient(
            120deg,
            transparent 12%,
            rgba(191, 226, 255, 0.18) 45%,
            transparent 72%
        );

    transform:
        translate3d(-100%, 0, 0);

    animation:
        homeWhatsappGlassSweep
        6.4s
        ease-in-out
        infinite;

    pointer-events: none;
}

@keyframes homeWhatsappGlassSweep {
    0% {
        transform:
            translate3d(-100%, 0, 0);
    }

    44%,
    100% {
        transform:
            translate3d(100%, 0, 0);
    }
}

.home-page .floating-whatsapp:hover {
    transform:
        translate3d(0, -4px, 0)
        scale(1.03);

    border-color:
        rgba(127, 196, 255, 0.72) !important;

    box-shadow:
        inset 0 1px 0
        rgba(255, 255, 255, 0.14),
        0 22px 52px
        rgba(0, 0, 0, 0.48),
        0 0 36px
        rgba(45, 131, 255, 0.34) !important;
}

.home-page .floating-whatsapp-text {
    display: none !important;
}

.home-page .floating-whatsapp svg,
.home-page .floating-whatsapp i {
    position: relative;
    z-index: 2;

    width: 23px !important;
    height: 23px !important;

    color: #9fd2ff !important;
}

/* ============================================================
   ORTA EKRANLAR
============================================================ */

@media (min-width: 981px) and (max-width: 1220px) {
    .home-capabilities-layout {
        grid-template-columns:
            minmax(300px, 0.82fr)
            minmax(0, 1.18fr);

        gap: 36px;
    }

    .home-capability-detail-content h3 {
        font-size:
            clamp(
                2rem,
                3.2vw,
                3.15rem
            );
    }

    .home-capability-row strong {
        font-size:
            clamp(
                1.35rem,
                2.3vw,
                2.2rem
            );
    }
}

/* ============================================================
   TABLET
============================================================ */

@media (max-width: 980px) {
    .home-capabilities-intro {
        grid-template-columns: 1fr;

        gap: 34px;
    }

    .home-capabilities-copy {
        max-width: 620px;
    }

    .home-capabilities-layout {
        grid-template-columns: 1fr;

        gap: 44px;
    }

    .home-capability-detail {
        position: relative;
        top: auto;

        min-height: 500px;
    }
}

/* ============================================================
   MOBİL
============================================================ */

@media (max-width: 700px) {
    .home-capabilities-edge {
        height: 52px;
    }

    .home-capabilities-edge span {
        font-size: 6.5px;
        letter-spacing: 0.18em;
    }

    .home-capabilities {
        padding:
            34px
            0
            62px;
    }

    .home-capabilities-signal {
        margin:
            10px
            0
            24px;
    }

    .home-capabilities-heading h2 {
        padding-bottom: 0.17em;

        font-size:
            clamp(
                2.85rem,
                14.4vw,
                4.65rem
            );

        line-height: 1.04;
    }

    .home-capabilities-copy p {
        font-size: 13px;
    }

    .home-capabilities-layout {
        margin-top: 24px;
    }

    .home-capability-detail {
        display: none;
    }

    .home-capability-row > button {
        min-height: 88px;
        padding:
            18px
            0;

        grid-template-columns:
            38px
            minmax(0, 1fr)
            auto;

        gap: 12px;

        touch-action: manipulation;
        -webkit-tap-highlight-color: transparent;
    }

    .home-capability-row > button:hover,
    .home-capability-row.is-active
    > button {
        padding-left: 0;
    }

    .home-capability-row > button:hover::before {
        opacity: 0;

        animation: none;
    }

    .home-capability-row.is-active
    > button::before {
        opacity: 1;

        animation:
            homeCapabilityRowBeam
            4.8s
            cubic-bezier(0.4, 0, 0.2, 1)
            infinite;
    }

    .home-capability-row-icon {
        width: 34px;
        height: 34px;
    }

    .home-capability-row strong {
        color: #eef5ff;

        font-size:
            clamp(
                1.28rem,
                6.4vw,
                1.85rem
            );

        line-height: 1.04;
    }

    .home-capability-row small {
        color: #72b7ff;

        font-size: 6px;
    }

    .home-capability-mobile-panel {
        display: block;

        height: 0;

        opacity: 0;

        overflow: hidden;

        transform:
            translate3d(0, -5px, 0);

        transition:
            height 340ms
            cubic-bezier(0.22, 1, 0.36, 1),
            opacity 190ms ease,
            transform 290ms
            cubic-bezier(0.22, 1, 0.36, 1);

        will-change:
            height,
            opacity,
            transform;
    }

    .home-capability-mobile-panel > div {
        overflow: hidden;
    }

    .home-capability-row.is-active
    .home-capability-mobile-panel {
        opacity: 1;

        transform:
            translate3d(0, 0, 0);
    }

    .home-capability-mobile-panel p {
        max-width: 310px;

        margin:
            0
            0
            24px
            50px;

        color: #748399;

        font-size: 11.5px;
        line-height: 1.68;
    }

    .home-capabilities-footer {
        margin-top: 22px;
        padding-top: 20px;

        align-items: flex-start;
        flex-direction: column;
    }

    .home-capabilities-footer a {
        width: 100%;
    }

    .home-page .floating-whatsapp {
        left: auto !important;
        right:
            max(
                12px,
                env(safe-area-inset-right)
            ) !important;

        bottom:
            max(
                12px,
                env(safe-area-inset-bottom)
            ) !important;

        width: 52px !important;
        min-width: 52px !important;
        height: 52px !important;

        border-radius: 15px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 1ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 1ms !important;
    }
}


/* ============================================================
   MOBİL HİZMETLER — DOKUNMA VE HOVER DÜZELTMESİ
============================================================ */

@media (max-width: 700px) {
    .home-capability-row > button,
    .home-capability-row > button * {
        pointer-events: none;
    }

    .home-capability-row > button {
        pointer-events: auto;

        position: relative;
        z-index: 5;
    }

    /*
     * Android Chrome dokunulan öğede :hover durumunu
     * tutabildiği için mobilde bütün hover görünümü sıfırlanır.
     */
    .home-capability-row > button:hover {
        color: #8d9db1;
        padding-left: 0;
    }

    .home-capability-row > button:hover::before {
        opacity: 0;
        animation: none;
    }

    .home-capability-row > button:hover
    .home-capability-row-icon {
        color: #71839a;

        border-color:
            rgba(114, 183, 255, 0.18);

        background:
            rgba(7, 15, 25, 0.58);

        transform: none;
    }

    .home-capability-row.is-active
    > button {
        color: #ffffff;
    }

    .home-capability-row.is-active
    > button::before {
        opacity: 1;

        animation:
            homeCapabilityRowBeam
            4.8s
            cubic-bezier(0.4, 0, 0.2, 1)
            infinite;
    }

    .home-capability-row.is-active
    .home-capability-row-icon {
        color: #72b7ff;

        border-color:
            rgba(114, 183, 255, 0.46);

        background:
            rgba(24, 75, 132, 0.16);

        transform:
            translate3d(0, -2px, 0);
    }

    .home-capability-mobile-panel {
        height: 0;

        opacity: 0;

        overflow: hidden;

        transform:
            translate3d(0, -5px, 0);

        transition:
            height 320ms
            cubic-bezier(0.22, 1, 0.36, 1),
            opacity 180ms ease,
            transform 260ms
            cubic-bezier(0.22, 1, 0.36, 1);

        will-change:
            opacity,
            transform;
    }

    .home-capability-row.is-active
    .home-capability-mobile-panel {
        opacity: 1;

        transform:
            translate3d(0, 0, 0);
    }
}


/* ============================================================
   ALVORN SERVICES V2 — NATIVE DETAILS
   Eski hizmet CSS'lerinden tamamen bağımsızdır.
============================================================ */

.alvorn-services-edge {
    position: relative;

    height: 78px;

    display: grid;
    place-items: center;

    border-top:
        1px solid
        rgba(114, 183, 255, 0.16);

    background:
        linear-gradient(
            180deg,
            rgba(0, 0, 0, 0.94),
            #000000
        );
}

.alvorn-services-edge::before {
    content: "";

    position: absolute;
    left: 50%;
    top: -1px;

    width:
        min(
            720px,
            72vw
        );

    height: 1px;

    transform:
        translateX(-50%);

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(114, 183, 255, 0.95),
            transparent
        );

    box-shadow:
        0 0 30px
        rgba(45, 131, 255, 0.48);
}

.alvorn-services-edge span {
    color: #5f7086;

    font-size: 8px;
    font-weight: 800;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

.alvorn-services {
    position: relative;

    padding:
        clamp(
            58px,
            6vw,
            96px
        )
        0
        clamp(
            72px,
            8vw,
            118px
        );

    overflow: hidden;

    color: #ffffff;

    background:
        linear-gradient(
            180deg,
            #000000,
            #030508 48%,
            #000000
        );
}

.alvorn-services-intro {
    display: grid;

    grid-template-columns:
        minmax(0, 1.4fr)
        minmax(290px, 0.6fr);

    gap:
        clamp(
            42px,
            7vw,
            108px
        );

    align-items: end;
}

.alvorn-services-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 11px;

    color: #72b7ff;

    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.alvorn-services-eyebrow::before {
    content: "";

    width: 34px;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            #72b7ff,
            transparent
        );
}

.alvorn-services-signal {
    position: relative;

    width: 100%;
    height: 1px;

    margin:
        13px
        0
        clamp(
            28px,
            3vw,
            42px
        );

    overflow: hidden;

    background:
        rgba(255, 255, 255, 0.07);
}

.alvorn-services-signal i {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            90deg,
            transparent,
            #2d83ff 38%,
            #72b7ff 50%,
            #2d83ff 62%,
            transparent
        );

    transform:
        translate3d(-100%, 0, 0);

    animation:
        alvornServicesSignal
        6.8s
        ease-in-out
        infinite;
}

@keyframes alvornServicesSignal {
    0% {
        transform:
            translate3d(-100%, 0, 0);
    }

    58%,
    100% {
        transform:
            translate3d(100%, 0, 0);
    }
}

.alvorn-services-heading h2 {
    max-width: 920px;

    margin: 0;
    padding-bottom: 0.16em;

    overflow: visible;

    color: #f6f9ff;

    font-size:
        clamp(
            3.1rem,
            7vw,
            7.4rem
        );

    font-weight: 540;
    line-height: 1.02;
    letter-spacing: -0.065em;
}

.alvorn-services-heading h2 span {
    display: block;

    padding-bottom: 0.08em;

    color: transparent;

    background:
        linear-gradient(
            100deg,
            #ffffff,
            #b8dfff 47%,
            #5ba9ff
        );

    background-clip: text;
    -webkit-background-clip: text;
}

.alvorn-services-copy {
    padding-bottom: 8px;
}

.alvorn-services-copy p {
    margin: 0;

    color: #748399;

    font-size: 14px;
    line-height: 1.84;
}

.alvorn-services-copy strong {
    color: #dce8f5;
    font-weight: 550;
}

.alvorn-services-layout {
    margin-top:
        clamp(
            38px,
            4vw,
            58px
        );

    display: grid;

    grid-template-columns:
        minmax(330px, 0.78fr)
        minmax(0, 1.22fr);

    gap:
        clamp(
            40px,
            5vw,
            74px
        );

    align-items: start;
}

/* Desktop preview */

.alvorn-services-preview {
    position: sticky;
    top:
        calc(
            var(
                --alvorn-header-height,
                88px
            ) +
            30px
        );

    min-height: 520px;

    padding:
        clamp(
            27px,
            2.8vw,
            38px
        );

    display: flex;
    flex-direction: column;

    border:
        1px solid
        rgba(114, 183, 255, 0.18);

    background:
        radial-gradient(
            circle at 88% 10%,
            rgba(45, 131, 255, 0.15),
            transparent 35%
        ),
        linear-gradient(
            155deg,
            rgba(10, 17, 27, 0.96),
            rgba(2, 5, 9, 0.98)
        );

    box-shadow:
        0 35px 90px
        rgba(0, 0, 0, 0.42),
        inset 0 1px 0
        rgba(255, 255, 255, 0.04);

    overflow: hidden;
}

.alvorn-services-preview::before {
    content: "";

    position: absolute;
    left: 0;
    top: 0;

    width: 82px;
    height: 82px;

    border-left:
        1px solid
        #72b7ff;

    border-top:
        1px solid
        #72b7ff;

    opacity: 0.55;
}

.alvorn-services-preview-top {
    position: relative;
    z-index: 2;

    display: flex;
    justify-content: space-between;
    gap: 18px;
}

.alvorn-services-preview-top span {
    color: #72b7ff;

    font-size: 8px;
    font-weight: 800;
    letter-spacing: 0.17em;
    text-transform: uppercase;
}

.alvorn-services-preview-top small {
    color: #4f6075;

    font-size: 8px;
    font-weight: 800;
    letter-spacing: 0.13em;
}

.alvorn-services-preview-icon {
    position: relative;
    z-index: 2;

    width: 72px;
    height: 72px;

    margin-top:
        clamp(
            40px,
            5vh,
            60px
        );

    display: grid;
    place-items: center;

    border:
        1px solid
        rgba(114, 183, 255, 0.22);

    color: #72b7ff;

    background:
        rgba(7, 18, 31, 0.68);
}

.alvorn-services-preview-icon svg {
    width: 34px;
    height: 34px;
}

.alvorn-services-preview-copy {
    position: relative;
    z-index: 2;

    margin-top: 27px;
}

.alvorn-services-preview-copy h3 {
    margin: 0;

    color: #ffffff;

    font-size:
        clamp(
            2.1rem,
            3.1vw,
            3.9rem
        );

    font-weight: 530;
    line-height: 0.98;
    letter-spacing: -0.055em;
}

.alvorn-services-preview-copy p {
    margin:
        18px
        0
        0;

    color: #748399;

    font-size: 13px;
    line-height: 1.8;
}

.alvorn-services-preview-points {
    position: relative;
    z-index: 2;

    margin-top: auto;
    padding-top: 30px;

    display: grid;

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

    gap:
        12px
        20px;
}

.alvorn-services-preview-points span {
    position: relative;

    padding-left: 15px;

    color: #b7c6d8;

    font-size: 10px;
    line-height: 1.5;
}

.alvorn-services-preview-points span::before {
    content: "";

    position: absolute;
    left: 0;
    top: 0.62em;

    width: 6px;
    height: 1px;

    background: #72b7ff;
}

/* Native details list */

.alvorn-services-list {
    min-width: 0;

    border-top:
        1px solid
        rgba(255, 255, 255, 0.09);
}

.alvorn-service-item {
    position: relative;

    overflow: hidden;

    border-bottom:
        1px solid
        rgba(255, 255, 255, 0.09);
}

.alvorn-service-item summary {
    position: relative;
    z-index: 3;

    min-height: 96px;
    padding: 0;

    display: grid;

    grid-template-columns:
        42px
        minmax(0, 1fr)
        auto
        22px;

    align-items: center;
    gap: 20px;

    color: #8d9db1;

    cursor: pointer;
    list-style: none;

    user-select: none;
    touch-action: manipulation;

    transition:
        color 220ms ease,
        padding-left 280ms
        cubic-bezier(0.16, 1, 0.3, 1);
}

.alvorn-service-item summary::-webkit-details-marker {
    display: none;
}

.alvorn-service-item summary::marker {
    content: "";
}

.alvorn-service-item summary::before {
    content: "";

    position: absolute;
    left: 0;
    top: -1px;

    width: 42%;
    height: 2px;

    opacity: 0;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(45, 131, 255, 0.18),
            #2d83ff 45%,
            #72b7ff 58%,
            rgba(45, 131, 255, 0.74) 76%,
            transparent
        );

    box-shadow:
        0 0 8px
        rgba(45, 131, 255, 0.78),
        0 0 18px
        rgba(45, 131, 255, 0.48);

    transform:
        translate3d(-115%, 0, 0);

    pointer-events: none;
}

.alvorn-service-item.is-active summary,
.alvorn-service-item[open] summary,
.alvorn-service-item summary:hover {
    color: #ffffff;

    padding-left: 12px;
}

.alvorn-service-item.is-active summary::before,
.alvorn-service-item[open] summary::before {
    opacity: 1;

    animation:
        alvornServiceBeam
        4.8s
        cubic-bezier(0.4, 0, 0.2, 1)
        infinite;
}

@keyframes alvornServiceBeam {
    0% {
        transform:
            translate3d(-115%, 0, 0);
    }

    64%,
    100% {
        transform:
            translate3d(275%, 0, 0);
    }
}

.alvorn-service-icon {
    width: 34px;
    height: 34px;

    display: grid;
    place-items: center;

    border:
        1px solid
        rgba(114, 183, 255, 0.18);

    color: #71839a;

    background:
        rgba(7, 15, 25, 0.58);

    transition:
        color 220ms ease,
        border-color 220ms ease,
        background-color 220ms ease,
        transform 260ms ease;
}

.alvorn-service-icon svg {
    width: 16px;
    height: 16px;
}

.alvorn-service-item.is-active
.alvorn-service-icon,
.alvorn-service-item[open]
.alvorn-service-icon,
.alvorn-service-item summary:hover
.alvorn-service-icon {
    color: #72b7ff;

    border-color:
        rgba(114, 183, 255, 0.46);

    background:
        rgba(24, 75, 132, 0.16);

    transform:
        translate3d(0, -2px, 0);
}

.alvorn-service-item summary strong {
    color: inherit;

    font-size:
        clamp(
            1.45rem,
            2.45vw,
            2.85rem
        );

    font-weight: 520;
    line-height: 1;
    letter-spacing: -0.05em;
}

.alvorn-service-item summary small {
    color: #748399;

    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.alvorn-service-item.is-active
summary small,
.alvorn-service-item[open]
summary small {
    color: #72b7ff;
}

.alvorn-service-plus {
    position: relative;

    width: 18px;
    height: 18px;

    display: none;
}

.alvorn-service-plus i {
    position: absolute;
    left: 50%;
    top: 50%;

    width: 14px;
    height: 1px;

    background: #72b7ff;

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

    transition:
        transform 220ms ease;
}

.alvorn-service-plus i:last-child {
    transform:
        translate(-50%, -50%)
        rotate(90deg);
}

.alvorn-service-item[open]
.alvorn-service-plus i:last-child {
    transform:
        translate(-50%, -50%)
        rotate(0deg);
}

.alvorn-service-body {
    display: none;
}

.alvorn-services-footer {
    margin-top:
        clamp(
            28px,
            3vw,
            42px
        );

    padding-top: 22px;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;

    border-top:
        1px solid
        rgba(255, 255, 255, 0.09);
}

.alvorn-services-footer p {
    max-width: 670px;

    margin: 0;

    color: #748399;

    font-size: 12px;
    line-height: 1.7;
}

.alvorn-services-footer a {
    min-height: 52px;
    padding:
        0
        20px;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 11px;

    border:
        1px solid
        rgba(114, 183, 255, 0.34);

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            rgba(114, 183, 255, 0.2),
            rgba(45, 131, 255, 0.1)
        );

    font-size: 10px;
    font-weight: 750;
    letter-spacing: 0.06em;
}

/* Tablet */

@media (max-width: 980px) {
    .alvorn-services-intro {
        grid-template-columns: 1fr;

        gap: 32px;
    }

    .alvorn-services-copy {
        max-width: 620px;
    }

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

    .alvorn-services-preview {
        position: relative;
        top: auto;
    }
}

/* Mobile */

@media (max-width: 700px) {
    .alvorn-services-edge {
        height: 52px;
    }

    .alvorn-services-edge span {
        font-size: 6.5px;
        letter-spacing: 0.17em;
    }

    .alvorn-services {
        padding:
            34px
            0
            62px;
    }

    .alvorn-services-heading h2 {
        padding-bottom: 0.18em;

        font-size:
            clamp(
                2.85rem,
                14.4vw,
                4.65rem
            );

        line-height: 1.04;
    }

    .alvorn-services-copy p {
        font-size: 13px;
    }

    .alvorn-services-signal {
        margin:
            10px
            0
            24px;
    }

    .alvorn-services-layout {
        margin-top: 24px;
    }

    .alvorn-services-preview {
        display: none;
    }

    .alvorn-service-item {
        overflow: visible;
    }

    .alvorn-service-item summary {
        min-height: 88px;
        padding:
            17px
            0;

        grid-template-columns:
            38px
            minmax(0, 1fr)
            auto
            18px;

        gap: 12px;
    }

    .alvorn-service-item summary:hover {
        color: #8d9db1;
        padding-left: 0;
    }

    .alvorn-service-item.is-active summary,
    .alvorn-service-item[open] summary {
        color: #ffffff;
        padding-left: 0;
    }

    .alvorn-service-item summary:hover::before {
        opacity: 0;
        animation: none;
    }

    .alvorn-service-item[open] summary::before {
        opacity: 1;

        animation:
            alvornServiceBeam
            4.8s
            cubic-bezier(0.4, 0, 0.2, 1)
            infinite;
    }

    .alvorn-service-item summary strong {
        color: #eef5ff;

        font-size:
            clamp(
                1.28rem,
                6.4vw,
                1.85rem
            );

        line-height: 1.04;
    }

    .alvorn-service-item summary small {
        color: #72b7ff;

        font-size: 6px;
    }

    .alvorn-service-plus {
        display: block;
    }

    .alvorn-service-body {
        display: block;

        padding:
            0
            0
            24px
            50px;

        animation:
            alvornServiceBodyIn
            280ms
            cubic-bezier(0.22, 1, 0.36, 1)
            both;
    }

    .alvorn-service-body p {
        max-width: 310px;

        margin: 0;

        color: #748399;

        font-size: 11.5px;
        line-height: 1.68;
    }

    @keyframes alvornServiceBodyIn {
        from {
            opacity: 0;

            transform:
                translate3d(0, -6px, 0);
        }

        to {
            opacity: 1;

            transform:
                translate3d(0, 0, 0);
        }
    }

    .alvorn-services-footer {
        margin-top: 22px;
        padding-top: 20px;

        align-items: flex-start;
        flex-direction: column;
    }

    .alvorn-services-footer a {
        width: 100%;
    }
}


/* ============================================================
   DOCUMENT SCROLL GUARANTEE
   The page itself remains the vertical scroll container.
============================================================ */

html {
    min-height: 100%;
    height: auto;

    overflow-x: hidden;
    overflow-y: auto;

    touch-action: auto;
}

body.home-page,
body.home-page .home-main {
    min-height: 100%;
    height: auto;
    max-height: none;

    overflow-y: visible;

    touch-action: auto;
}

body.home-page:not(.alvorn-menu-open) {
    position: static !important;

    overflow-y: visible !important;

    touch-action: auto !important;
}

@media (max-width: 700px) {
    html,
    body.home-page,
    body.home-page .home-main {
        height: auto !important;
        min-height: 100%;

        overflow-y: visible !important;

        touch-action: auto !important;
        overscroll-behavior-y: auto !important;
    }

    html {
        overflow-y: auto !important;
    }
}


/* ============================================================
   SERVICES BACKGROUND WORD
============================================================ */

.alvorn-services {
    isolation: isolate;
}

.alvorn-services::before {
    content: "BUILD";

    position: absolute;
    right: -4vw;
    top: 2%;
    z-index: 0;

    color:
        rgba(114, 183, 255, 0.032);

    font-size:
        clamp(9rem, 25vw, 29rem);

    font-weight: 800;
    line-height: 0.76;
    letter-spacing: -0.105em;

    text-shadow:
        0 0 42px
        rgba(45, 131, 255, 0.08);

    pointer-events: none;
    user-select: none;
}

.alvorn-services > .container {
    position: relative;
    z-index: 1;
}

@media (max-width: 700px) {
    .alvorn-services::before {
        right: -10vw;
        top: 1%;

        color:
            rgba(114, 183, 255, 0.06);

        font-size: 50vw;
    }
}


/* ============================================================
   SERVICES CTA ICON — FIXED SIZE
============================================================ */

.alvorn-services-footer a svg {
    flex:
        0
        0
        16px;

    width: 16px !important;
    min-width: 16px !important;
    max-width: 16px !important;

    height: 16px !important;
    min-height: 16px !important;
    max-height: 16px !important;

    display: block;

    color: #72b7ff;

    overflow: visible;
}


/* ============================================================
   ALVORN TYPOGRAPHY SYSTEM — V8
============================================================ */

body.home-page,
body.home-page button,
body.home-page input,
body.home-page textarea,
body.home-page select {
    font-family:
        Inter,
        "SF Pro Display",
        "Segoe UI",
        Arial,
        Helvetica,
        sans-serif;
}

body.home-page h1,
body.home-page h2,
body.home-page h3,
body.home-page h4,
body.home-page strong,
body.home-page small,
body.home-page span,
body.home-page p,
body.home-page a,
body.home-page button {
    font-family: inherit;
}

.alvorn-services-heading h2 {
    max-width: 820px;

    font-size:
        clamp(
            2.85rem,
            5.25vw,
            5.8rem
        );

    font-weight: 560;
    line-height: 1.01;
    letter-spacing: -0.052em;
}

.alvorn-service-item summary strong {
    font-size:
        clamp(
            1.35rem,
            2.05vw,
            2.35rem
        );

    font-weight: 550;
    letter-spacing: -0.042em;
}

.alvorn-services-copy p,
.alvorn-services-preview-copy p,
.alvorn-service-body p,
.alvorn-services-footer p {
    letter-spacing: -0.01em;
}

.alvorn-services::before {
    right: 0;
    top: 6%;

    font-size:
        clamp(
            6.5rem,
            17vw,
            17rem
        );

    line-height: 0.82;
    letter-spacing: -0.075em;

    color:
        rgba(114, 183, 255, 0.026);

    text-shadow:
        0 0 34px
        rgba(45, 131, 255, 0.055);
}

@media (max-width: 700px) {
    .alvorn-services-heading h2 {
        max-width: 100%;

        font-size:
            clamp(
                2.35rem,
                11vw,
                3.55rem
            );

        line-height: 1.03;
        letter-spacing: -0.048em;
    }

    .alvorn-service-item summary strong {
        font-size:
            clamp(
                1.22rem,
                5.8vw,
                1.65rem
            );
    }

    .alvorn-services::before {
        right: -2vw;
        top: 3%;

        font-size: 32vw;
        line-height: 0.88;
        letter-spacing: -0.06em;

        color:
            rgba(114, 183, 255, 0.045);
    }
}
