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

.site-footer {
    --footer-navy: #061525;
    --footer-navy-light: #0a2139;
    --footer-blue: #52a9df;
    --footer-blue-dark: #0871b9;
    --footer-gold: #d8ad4a;
    --footer-white: #ffffff;
    --footer-text: #d5dfeb;
    --footer-text-soft: #aebdcd;
    --footer-border: rgb(255 255 255 / 14%);
    --footer-surface: rgb(255 255 255 / 5%);
    --footer-surface-hover: rgb(255 255 255 / 9%);

    position: relative;
    overflow: hidden;

    color: var(--footer-text);

    background:
        radial-gradient(
            circle at 8% 20%,
            rgb(8 113 185 / 18%),
            transparent 26rem
        ),
        linear-gradient(
            125deg,
            var(--footer-navy-light),
            var(--footer-navy) 62%
        );
}


/* ================================================================
   TOP ACCENT
   ================================================================ */

.site-footer::before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;

    height: 0.25rem;

    background:
        linear-gradient(
            90deg,
            var(--footer-blue-dark),
            var(--footer-blue),
            var(--footer-gold)
        );

    content: "";
}


/* ================================================================
   MAIN GRID
   ================================================================ */

.footer-grid {
    position: relative;
    z-index: 1;

    display: grid;

    grid-template-columns:
        minmax(0, 1.35fr)
        minmax(13rem, 0.65fr)
        minmax(16rem, 0.8fr);

    align-items: start;

    gap:
        clamp(2.5rem, 5vw, 5rem);

    padding-block:
        clamp(4rem, 6vw, 5.5rem);
}


/* ================================================================
   BRAND
   ================================================================ */

.footer-brand {
    min-width: 0;

    max-width: 35rem;
}


.footer-logo-link {
    display: inline-flex;

    align-items: center;

    gap: 1rem;

    color:
        var(--footer-white);

    text-decoration:
        none;
}


.footer-logo-link:hover .footer-brand__text strong {
    color:
        var(--footer-blue);
}


.footer-logo-link:focus-visible {
    border-radius:
        0.5rem;

    outline:
        0.2rem solid
        var(--footer-gold);

    outline-offset:
        0.35rem;
}


/* ================================================================
   LOGO
   ================================================================ */

.footer-logo {
    display: block;

    width: 5.25rem;
    height: 5.25rem;

    flex:
        0
        0
        5.25rem;

    box-sizing: border-box;

    padding:
        0.45rem;

    border:
        1px solid
        rgb(255 255 255 / 20%);

    border-radius:
        1rem;

    background:
        #ffffff;

    object-fit:
        contain;

    box-shadow:
        0
        0.35rem
        1rem
        rgb(0 0 0 / 18%);
}


/* ================================================================
   BRAND TEXT
   ================================================================ */

.footer-brand__text {
    display: grid;

    gap:
        0.3rem;

    min-width: 0;

    line-height:
        1;
}


.footer-brand__text strong {
    color:
        var(--footer-white);

    font-size:
        clamp(1.15rem, 2vw, 1.45rem);

    font-weight:
        850;

    letter-spacing:
        -0.025em;

    transition:
        color 160ms ease;
}


.footer-brand__text > span {
    color:
        var(--footer-blue);

    font-size:
        clamp(1rem, 1.7vw, 1.25rem);

    font-weight:
        800;

    letter-spacing:
        -0.015em;
}


/* ================================================================
   DESCRIPTION
   ================================================================ */

.footer-description {
    max-width: 34rem;

    margin:
        1.75rem
        0
        0;

    color:
        var(--footer-text);

    font-size:
        0.95rem;

    line-height:
        1.75;
}


.footer-description p {
    margin:
        0;
}


.footer-description p + p {
    margin-top:
        0.8rem;
}


/* ================================================================
   COORDINATION
   ================================================================ */

.footer-coordination {
    max-width:
        34rem;

    margin:
        1.2rem
        0
        0;

    padding-top:
        1.2rem;

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

    color:
        var(--footer-text-soft);

    font-size:
        0.85rem;

    line-height:
        1.7;
}


/* ================================================================
   COLUMNS
   ================================================================ */

.footer-column {
    min-width:
        0;
}


.footer-column h2 {
    position:
        relative;

    margin:
        0
        0
        1.35rem;

    padding-bottom:
        0.85rem;

    color:
        var(--footer-white);

    font-size:
        1.05rem;

    font-weight:
        850;

    line-height:
        1.3;
}


.footer-column h2::after {
    position:
        absolute;

    bottom:
        0;

    left:
        0;

    width:
        2.5rem;

    height:
        0.18rem;

    border-radius:
        999px;

    background:
        var(--footer-gold);

    content:
        "";
}


/* ================================================================
   FOOTER LINKS
   ================================================================ */

.footer-links {
    display:
        grid;

    gap:
        0.45rem;

    margin:
        0;

    padding:
        0;

    list-style:
        none;
}


.footer-links li {
    min-width:
        0;
}


/* ================================================================
   LINK ROW
   ================================================================ */

.footer-links a {
    display:
        grid;

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

    align-items:
        center;

    gap:
        0.6rem;

    width:
        100%;

    box-sizing:
        border-box;

    padding:
        0.5rem
        0.6rem;

    border:
        1px solid
        transparent;

    border-radius:
        0.5rem;

    color:
        var(--footer-text);

    background:
        transparent;

    font-size:
        0.88rem;

    line-height:
        1.45;

    text-decoration:
        none;

    transition:
        color 150ms ease,
        border-color 150ms ease,
        background-color 150ms ease;
}


/* ================================================================
   LINK ICON
   ================================================================ */

.footer-link-icon {
    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        2rem;

    height:
        2rem;

    box-sizing:
        border-box;

    border:
        1px solid
        rgb(82 169 223 / 24%);

    border-radius:
        0.48rem;

    color:
        var(--footer-blue);

    background:
        rgb(82 169 223 / 7%);

    font-size:
        0.78rem;

    line-height:
        1;

    transition:
        color 150ms ease,
        border-color 150ms ease,
        background-color 150ms ease;
}


.footer-link-icon i {
    display:
        block;

    width:
        auto;

    line-height:
        1;
}


/* ================================================================
   LINK TEXT
   ================================================================ */

.footer-link-text {
    min-width:
        0;

    color:
        inherit;

    font-weight:
        500;

    overflow-wrap:
        anywhere;
}


/* ================================================================
   LINK HOVER
   ================================================================ */

.footer-links a:hover {
    border-color:
        rgb(82 169 223 / 28%);

    color:
        var(--footer-white);

    background:
        var(--footer-surface-hover);
}


.footer-links a:hover .footer-link-icon {
    border-color:
        var(--footer-blue);

    color:
        #ffffff;

    background:
        var(--footer-blue-dark);
}


/* ================================================================
   LINK FOCUS
   ================================================================ */

.footer-links a:focus-visible {
    border-color:
        var(--footer-gold);

    outline:
        0.18rem solid
        var(--footer-gold);

    outline-offset:
        0.18rem;

    color:
        var(--footer-white);

    background:
        var(--footer-surface-hover);
}


/* ================================================================
   CONTACT LIST
   ================================================================ */

.footer-contact-list {
    display:
        grid;

    gap:
        1.15rem;
}


.footer-contact-item {
    display:
        grid;

    min-width:
        0;

    gap:
        0.35rem;
}


/* ================================================================
   CONTACT LABEL
   ================================================================ */

.footer-contact-label {
    color:
        var(--footer-blue);

    font-size:
        0.68rem;

    font-weight:
        850;

    letter-spacing:
        0.08em;

    line-height:
        1.4;

    text-transform:
        uppercase;
}


/* ================================================================
   CONTACT ROW
   ================================================================ */

.footer-contact,
.footer-address {
    display:
        grid;

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

    align-items:
        start;

    gap:
        0.6rem;

    min-width:
        0;

    color:
        var(--footer-white);

    font-size:
        0.88rem;

    font-weight:
        500;

    line-height:
        1.55;

    text-decoration:
        none;

    overflow-wrap:
        anywhere;
}


/* ================================================================
   CONTACT ICON
   ================================================================ */

.footer-contact-icon {
    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        1.9rem;

    height:
        1.9rem;

    box-sizing:
        border-box;

    border:
        1px solid
        rgb(82 169 223 / 24%);

    border-radius:
        0.45rem;

    color:
        var(--footer-blue);

    background:
        rgb(82 169 223 / 7%);

    font-size:
        0.78rem;

    line-height:
        1;
}


.footer-contact-icon i {
    line-height:
        1;
}


/* ================================================================
   CONTACT HOVER
   ================================================================ */

.footer-contact:hover {
    color:
        var(--footer-blue);
}


.footer-contact:hover .footer-contact-icon {
    border-color:
        var(--footer-gold);

    color:
        var(--footer-gold);
}


/* ================================================================
   CONTACT FOCUS
   ================================================================ */

.footer-contact:focus-visible {
    border-radius:
        0.35rem;

    outline:
        0.18rem solid
        var(--footer-gold);

    outline-offset:
        0.25rem;
}


/* ================================================================
   ADDRESS
   ================================================================ */

.footer-address {
    margin:
        0;

    color:
        var(--footer-text);

    font-style:
        normal;
}


/* ================================================================
   SOCIAL MEDIA
   ================================================================ */

.social-links {
    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        0.55rem;

    margin-top:
        1.6rem;
}


/* ================================================================
   SOCIAL BUTTON
   ================================================================ */

.social-links a {
    display:
        inline-flex;

    width:
        2.6rem;

    height:
        2.6rem;

    align-items:
        center;

    justify-content:
        center;

    box-sizing:
        border-box;

    border:
        1px solid
        rgb(255 255 255 / 18%);

    border-radius:
        0.55rem;

    color:
        var(--footer-white);

    background:
        var(--footer-surface);

    font-size:
        1rem;

    line-height:
        1;

    text-decoration:
        none;

    transition:
        color 150ms ease,
        border-color 150ms ease,
        background-color 150ms ease,
        box-shadow 150ms ease;
}


.social-links a i {
    line-height:
        1;
}


/* ================================================================
   SOCIAL HOVER
   ================================================================ */

.social-links a:hover {
    border-color:
        var(--footer-blue);

    color:
        #ffffff;

    background:
        var(--footer-blue-dark);

    box-shadow:
        0
        0.3rem
        0.9rem
        rgb(8 113 185 / 28%);
}


/* ================================================================
   SOCIAL FOCUS
   ================================================================ */

.social-links a:focus-visible {
    outline:
        0.18rem solid
        var(--footer-gold);

    outline-offset:
        0.22rem;
}


/* ================================================================
   LEGAL / KVKK LINKS
   ================================================================ */

.footer-legal {
    position:
        relative;

    z-index:
        1;

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

    background:
        rgb(255 255 255 / 3%);
}


/* ================================================================
   LEGAL INNER
   ================================================================ */

.footer-legal__inner {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        0.65rem;

    min-height:
        3.6rem;

    box-sizing:
        border-box;

    padding-block:
        0.8rem;

    white-space:
        nowrap;
}


/* ================================================================
   LEGAL LINKS
   ================================================================ */

.footer-legal__inner a {
    display:
        inline-flex;

    align-items:
        center;

    flex:
        0
        0
        auto;

    color:
        var(--footer-text-soft);

    font-size:
        0.8rem;

    font-weight:
        650;

    line-height:
        1.5;

    text-decoration:
        underline;

    text-decoration-color:
        rgb(82 169 223 / 55%);

    text-decoration-thickness:
        0.08rem;

    text-underline-offset:
        0.22rem;

    transition:
        color 150ms ease,
        text-decoration-color 150ms ease;
}


/* ================================================================
   LEGAL LINK HOVER
   ================================================================ */

.footer-legal__inner a:hover {
    color:
        var(--footer-white);

    text-decoration-color:
        var(--footer-blue);
}


/* ================================================================
   LEGAL LINK FOCUS
   ================================================================ */

.footer-legal__inner a:focus-visible {
    border-radius:
        0.2rem;

    outline:
        0.18rem solid
        var(--footer-gold);

    outline-offset:
        0.22rem;

    color:
        var(--footer-white);
}


/* ================================================================
   LEGAL SEPARATOR
   ================================================================ */

.footer-legal__separator {
    flex:
        0
        0
        auto;

    color:
        var(--footer-blue);

    font-size:
        0.75rem;

    font-weight:
        700;

    line-height:
        1;
}


/* ================================================================
   FOOTER BOTTOM
   ================================================================ */

.footer-bottom {
    position:
        relative;

    z-index:
        1;

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

    background:
        rgb(0 0 0 / 22%);
}


.footer-bottom__inner {
    display:
        flex;

    min-height:
        4.25rem;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        2rem;

    padding-block:
        1rem;
}


.footer-bottom p {
    margin:
        0;

    color:
        var(--footer-text-soft);

    font-size:
        0.8rem;

    line-height:
        1.6;
}


/* ================================================================
   DEVELOPMENT
   ================================================================ */

.footer-development {
    flex:
        0
        0
        auto;

    white-space:
        nowrap;
}


.footer-development a {
    color:
        var(--footer-white);

    font-weight:
        800;

    text-decoration-color:
        var(--footer-blue);

    text-decoration-thickness:
        0.1rem;

    text-underline-offset:
        0.2rem;
}


.footer-development a:hover {
    color:
        var(--footer-blue);
}


.footer-development a:focus-visible {
    border-radius:
        0.2rem;

    outline:
        0.18rem solid
        var(--footer-gold);

    outline-offset:
        0.25rem;
}


/* ================================================================
   HIGH CONTRAST
   ================================================================ */

html.a11y-high-contrast .site-footer {
    color:
        #ffffff !important;

    background:
        #000000 !important;

    background-image:
        none !important;
}


html.a11y-high-contrast .site-footer::before {
    background:
        #ffff00 !important;
}


html.a11y-high-contrast .site-footer :where(
    .footer-description,
    .footer-description p,
    .footer-coordination,
    .footer-column h2,
    .footer-address,
    .footer-bottom p
) {
    color:
        #ffffff !important;
}


html.a11y-high-contrast .site-footer .footer-brand__text > span,
html.a11y-high-contrast .site-footer .footer-contact-label {
    color:
        #00ffff !important;
}


html.a11y-high-contrast .site-footer .footer-column h2::after {
    background:
        #00ffff !important;
}


/* ================================================================
   HIGH CONTRAST LINKS
   ================================================================ */

html.a11y-high-contrast .site-footer .footer-links a {
    border:
        1px solid
        #ffffff !important;

    color:
        #ffff00 !important;

    background:
        #000000 !important;
}


html.a11y-high-contrast .site-footer .footer-link-icon,
html.a11y-high-contrast .site-footer .footer-contact-icon {
    border-color:
        #00ffff !important;

    color:
        #00ffff !important;

    background:
        #000000 !important;
}


html.a11y-high-contrast .site-footer .footer-contact {
    color:
        #ffff00 !important;
}


html.a11y-high-contrast .site-footer .social-links a {
    border:
        2px solid
        #ffff00 !important;

    color:
        #ffff00 !important;

    background:
        #000000 !important;
}


html.a11y-high-contrast .site-footer .social-links a:hover {
    color:
        #000000 !important;

    background:
        #ffff00 !important;
}


/* ================================================================
   HIGH CONTRAST LEGAL
   ================================================================ */

html.a11y-high-contrast .site-footer .footer-legal {
    border-color:
        #ffffff !important;

    background:
        #000000 !important;
}


html.a11y-high-contrast .site-footer .footer-legal__inner a {
    color:
        #ffff00 !important;

    text-decoration-color:
        #ffff00 !important;
}


html.a11y-high-contrast .site-footer .footer-legal__separator {
    color:
        #00ffff !important;
}


html.a11y-high-contrast .site-footer .footer-bottom {
    border-color:
        #ffffff !important;

    background:
        #000000 !important;
}


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

@media (max-width: 900px) {

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

        gap:
            3rem
            clamp(2rem, 5vw, 4rem);
    }


    .footer-brand {
        max-width:
            none;

        grid-column:
            1 / -1;
    }


    .footer-description,
    .footer-coordination {
        max-width:
            46rem;
    }


    /* ------------------------------------------------------------
       Legal bağlantıları gerektiğinde alt satıra geçir
       ------------------------------------------------------------ */

    .footer-legal__inner {
        flex-wrap:
            wrap;

        row-gap:
            0.5rem;

        white-space:
            normal;

        padding-block:
            1rem;
    }


    .footer-legal__inner a {
        white-space:
            nowrap;
    }
}


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

@media (max-width: 650px) {

    .footer-grid {
        grid-template-columns:
            1fr;

        gap:
            2.5rem;

        padding-block:
            3.5rem;
    }


    .footer-brand {
        grid-column:
            auto;
    }


    .footer-logo {
        width:
            4.5rem;

        height:
            4.5rem;

        flex-basis:
            4.5rem;
    }


    .footer-links a {
        padding:
            0.55rem;
    }


    /* ------------------------------------------------------------
       Legal bağlantılar mobilde ortalı ve kırılabilir
       ------------------------------------------------------------ */

    .footer-legal__inner {
        justify-content:
            flex-start;

        gap:
            0.5rem
            0.65rem;

        padding-block:
            1rem;
    }


    .footer-legal__inner a {
        font-size:
            0.78rem;
    }


    .footer-bottom__inner {
        align-items:
            flex-start;

        flex-direction:
            column;

        gap:
            0.35rem;
    }


    .footer-development {
        white-space:
            normal;
    }
}


/* ================================================================
   VERY SMALL MOBILE
   ================================================================ */

@media (max-width: 420px) {

    .footer-logo-link {
        align-items:
            flex-start;
    }


    .footer-logo {
        width:
            4rem;

        height:
            4rem;

        flex-basis:
            4rem;

        border-radius:
            0.8rem;
    }


    .footer-brand__text strong {
        font-size:
            1.1rem;
    }


    .footer-brand__text > span {
        font-size:
            1rem;
    }


    .footer-links a {
        grid-template-columns:
            1.9rem
            minmax(0, 1fr);

        gap:
            0.55rem;
    }


    .footer-link-icon {
        width:
            1.9rem;

        height:
            1.9rem;
    }


    /* ------------------------------------------------------------
       Küçük ekranda dikey okunabilirlik
       ------------------------------------------------------------ */

    .footer-legal__inner {
        align-items:
            flex-start;

        flex-direction:
            column;

        gap:
            0.55rem;

        white-space:
            normal;
    }


    .footer-legal__separator {
        display:
            none;
    }


    .footer-legal__inner a {
        white-space:
            normal;
    }
}


/* ================================================================
   FORCED COLORS
   ================================================================ */

@media (forced-colors: active) {

    .site-footer,
    .footer-logo,
    .footer-links a,
    .footer-link-icon,
    .footer-contact-icon,
    .social-links a,
    .footer-legal {
        border-color:
            CanvasText;
    }


    .footer-column h2::after {
        background:
            CanvasText;
    }


    .footer-legal__separator {
        color:
            CanvasText;
    }
}


/* ================================================================
   REDUCED MOTION
   ================================================================ */

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

    .footer-brand__text strong,
    .footer-links a,
    .footer-link-icon,
    .footer-contact-icon,
    .social-links a,
    .footer-legal__inner a {
        transition:
            none;
    }
}