/* =========================================================
   KAPTAN MUSTAFA CAN
   Premium Corporate / Campaign Website
   ========================================================= */
/* =========================================================
   DESIGN TOKENS
   ========================================================= */
:root {
    /* Brand */
    --navy: #0d2b4d;
    --navy-dark: #081f3a;
    --navy-deep: #06192f;
    --navy-soft: #15385e;
    --gold: #d2aa27;
    --gold-light: #e0bc3c;
    --gold-dark: #b58f16;
    --gold-pale: #f4e8b8;
    /* Surfaces */
    --white: #ffffff;
    --off-white: #f7f8fa;
    --surface: #f1f3f5;
    --surface-dark: #e9edf1;
    /* Text */
    --text: #172333;
    --text-soft: #647080;
    --text-muted: #8792a0;
    --text-light: #dce5ee;
    /* Borders */
    --border: #e1e5e9;
    --border-dark: rgba(255, 255, 255, .12);
    --border-gold: rgba(210, 170, 39, .45);
    /* Shadows */
    --shadow-sm: 0 8px 25px rgba(13, 43, 77, .07);
    --shadow-md: 0 18px 45px rgba(13, 43, 77, .11);
    --shadow-lg: 0 30px 70px rgba(8, 31, 58, .16);
    --shadow-gold: 0 16px 35px rgba(210, 170, 39, .22);
    /* Layout */
    --container: 1365px;
    --section-space: 132px;
    --header-height: 86px;
    /* Radius */
    --radius-sm: 8px;
    --radius-md: 14px;
    --radius-lg: 22px;
    --radius-xl: 30px;
    /* Motion */
    --ease: cubic-bezier(.22, .61, .36, 1);
}


/* =========================================================
   RESET
   ========================================================= */

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    font-size: 16px;
    scroll-behavior: smooth;
    scroll-padding-top: 90px;
}

body {
    margin: 0;
    min-height: 100vh;
    overflow-x: hidden;
    background: var(--white);
    color: var(--text);
    font-family: "DM Sans", sans-serif;
    font-weight: 400;
    line-height: 1.7;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

body,
button,
input,
textarea,
select {
    font-family: "DM Sans", sans-serif;
}

img {
    display: block;
    max-width: 100%;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input,
textarea,
select {
    font-size: inherit;
}

button {
    border: 0;
    font: inherit;
    cursor: pointer;
}

::selection {
    color: var(--white);
    background: var(--gold);
}


/* =========================================================
   GLOBAL LAYOUT
   ========================================================= */

main {
    position: relative;
}

.container {
    width: min(calc(100% - 52px), var(--container));
    margin-inline: auto;
}

.section-pad {
    padding-block: var(--section-space);
}

section[id] {
    scroll-margin-top: 96px;
}

h1,
h2,
h3,
h4 {
    margin: 0;
    color: var(--navy);
    font-family: "Manrope", sans-serif;
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -.035em;
}

h2 {
    font-size: clamp(40px, 4.2vw, 64px);
}

    h1 em,
    h2 em {
        color: var(--gold);
        font-style: normal;
    }

p {
    margin: 0;
}

.section-kicker {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
    color: var(--gold-dark);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .18em;
    line-height: 1;
    text-transform: uppercase;
}

    .section-kicker::before {
        content: "";
        width: 28px;
        height: 2px;
        flex: 0 0 auto;
        background: var(--gold);
    }

.text-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: var(--navy);
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .01em;
    transition: color .3s var(--ease), gap .3s var(--ease);
}

    .text-link span {
        color: var(--gold-dark);
        font-size: 18px;
        line-height: 1;
        transition: transform .3s var(--ease);
    }

    .text-link:hover {
        color: var(--gold-dark);
        gap: 16px;
    }

        .text-link:hover span {
            transform: translateX(3px);
        }


/* =========================================================
   BUTTONS
   ========================================================= */

.btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    min-height: 54px;
    padding: 0 25px;
    overflow: hidden;
    border-radius: 7px;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .01em;
    transition: transform .3s var(--ease), background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease), box-shadow .3s var(--ease);
}

    .btn span {
        font-size: 18px;
        line-height: 1;
        transition: transform .3s var(--ease);
    }

    .btn:hover {
        transform: translateY(-3px);
    }

        .btn:hover span {
            transform: translate(3px, -2px);
        }

.btn-gold {
    color: var(--white);
    background: var(--gold);
    box-shadow: var(--shadow-gold);
}

    .btn-gold:hover {
        background: var(--gold-light);
        box-shadow: 0 20px 40px rgba(210, 170, 39, .30);
    }

.btn-dark {
    color: var(--white);
    background: var(--navy);
}

    .btn-dark:hover {
        background: var(--navy-soft);
        box-shadow: var(--shadow-md);
    }

.btn-outline {
    color: var(--navy);
    background: transparent;
    border: 1px solid rgba(13, 43, 77, .20);
}

    .btn-outline:hover {
        color: var(--white);
        background: var(--navy);
        border-color: var(--navy);
    }

.btn-ghost-light {
    color: var(--white);
    background: rgba(255, 255, 255, .06);
    border: 1px solid rgba(255, 255, 255, .24);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}

    .btn-ghost-light:hover {
        color: var(--navy);
        background: var(--white);
        border-color: var(--white);
    }


/* =========================================================
   ACCESSIBILITY
   ========================================================= */

.skip-link {
    position: fixed;
    z-index: 9999;
    top: -100px;
    left: 20px;
    padding: 12px 18px;
    color: var(--white);
    background: var(--navy);
    border-radius: 0 0 8px 8px;
    font-size: 14px;
    font-weight: 700;
    transition: top .2s ease;
}

    .skip-link:focus {
        top: 0;
    }

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
    outline: 3px solid rgba(210, 170, 39, .55);
    outline-offset: 4px;
}


/* =========================================================
   HEADER
   ========================================================= */

.site-header {
    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
    width: 100%;
    background: radial-gradient(circle at 15% 0%, rgba(255,255,255,.96), transparent 35%), radial-gradient(circle at 88% 18%, rgba(218,222,226,.45), transparent 38%), linear-gradient(135deg, #f4f2eb 0%, #fafaf8 48%, #eef0ee 100%);
    border-bottom: 1px solid #dfe1de;
    transition: background .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease), backdrop-filter .35s ease;
}

body:has(.hero-section) .site-header:not(.is-scrolled) {
    background: radial-gradient(circle at 15% 0%, rgba(255,255,255,.96), transparent 35%), radial-gradient(circle at 88% 18%, rgba(218,222,226,.45), transparent 38%), linear-gradient(135deg, #f4f2eb 0%, #fafaf8 48%, #eef0ee 100%);
    border-bottom-color: #dfe1de;
}

.site-header.is-scrolled {
    background: radial-gradient(circle at 15% 0%, rgba(255,255,255,.97), transparent 35%), radial-gradient(circle at 88% 18%, rgba(218,222,226,.48), transparent 38%), linear-gradient(135deg, rgba(244,242,235,.98) 0%, rgba(250,250,248,.98) 48%, rgba(238,240,238,.98) 100%);
    border-bottom-color: #d9ddda;
    box-shadow: 0 10px 35px rgba(13, 43, 77, .08);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
}

.header-inner {
    min-height: var(--header-height);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    transition: min-height .35s var(--ease);
}

.site-header.is-scrolled .header-inner {
    min-height: 72px;
}


/* =========================================================
   BRAND
   ========================================================= */

.brand {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    color: var(--navy);
}

.brand-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 96px;
    height: 50px;
    flex: 0 0 96px;
    overflow: hidden;
}

    .brand-logo img {
        display: block;
        width: 96px;
        height: auto;
        max-width: none;
        object-fit: contain;
        object-position: center;
        transition: transform .3s var(--ease);
    }

.brand:hover .brand-logo img {
    transform: scale(1.03);
}

.brand-copy {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
}

    .brand-copy strong {
        display: block;
        margin: 0;
        padding: 0;
        color: var(--navy);
        font-size: 19px;
        font-weight: 700;
        letter-spacing: .01em;
        line-height: 1.25;
        white-space: nowrap;
    }

/* =========================================================
   PRIMARY NAV
   ========================================================= */

.primary-nav {
    display: flex;
    align-items: center;
    gap: 4px;
}

    .primary-nav > a:not(.nav-social) {
        position: relative;
        display: inline-flex;
        align-items: center;
        min-height: 42px;
        padding: 0 15px;
        color: var(--navy);
        font-size: 18px;
        font-weight: 800;
        letter-spacing: .01em;
        transition: color .25s ease, background .25s ease;
    }

        .primary-nav > a:not(.nav-social)::after {
            content: "";
            position: absolute;
            right: 13px;
            bottom: 4px;
            left: 13px;
            height: 2px;
            background: var(--gold);
            transform: scaleX(0);
            transform-origin: center;
            transition: transform .3s var(--ease);
        }

        .primary-nav > a:not(.nav-social):hover {
            color: var(--navy);
        }

            .primary-nav > a:not(.nav-social):hover::after {
                transform: scaleX(1);
            }


/* =========================================================
   HEADER SOCIAL
   ========================================================= */

.nav-social {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    margin-left: 8px;
    color: var(--white);
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 50%;
    transition: color .25s ease, background .25s ease, border-color .25s ease, transform .3s var(--ease);
}

    .nav-social svg {
        width: 16px;
        height: 16px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.7px;
    }

    .nav-social:hover {
        color: var(--navy);
        background: var(--gold);
        border-color: var(--gold);
        transform: translateY(-2px);
    }


/* =========================================================
   MOBILE NAV TOGGLE
   ========================================================= */

.nav-toggle {
    position: relative;
    display: none;
    width: 44px;
    height: 44px;
    padding: 0;
    background: rgba(255, 255, 255, .16);
    border: 1px solid rgba(13, 43, 77, .24);
    border-radius: 8px;
    cursor: pointer;
}

    .nav-toggle span:not(.sr-only) {
        position: absolute;
        left: 11px;
        width: 20px;
        height: 2px;
        background: var(--navy);
        border-radius: 10px;
        transition: transform .3s var(--ease), opacity .2s ease, top .3s var(--ease);
    }

    .nav-toggle span:nth-child(1) {
        top: 14px;
    }

    .nav-toggle span:nth-child(2) {
        top: 21px;
    }

    .nav-toggle span:nth-child(3) {
        top: 28px;
    }

    .nav-toggle.is-open span:nth-child(1) {
        top: 21px;
        transform: rotate(45deg);
    }

    .nav-toggle.is-open span:nth-child(2) {
        opacity: 0;
    }

    .nav-toggle.is-open span:nth-child(3) {
        top: 21px;
        transform: rotate(-45deg);
    }

    .nav-toggle:hover {
        border-color: var(--gold);
    }


/* =========================================================
   HERO
   ========================================================= */

.hero-section {
    position: relative;
    isolation: isolate;
    min-height: min(820px, 100vh);
    display: flex;
    align-items: center;
    padding: 150px 0 100px;
    overflow: hidden;
    color: var(--white);
    background: radial-gradient( circle at 76% 38%, rgba(210, 170, 39, .13), transparent 29% ), radial-gradient( circle at 8% 92%, rgba(38, 104, 151, .16), transparent 32% ), linear-gradient( 135deg, var(--navy-deep) 0%, var(--navy-dark) 48%, #10375d 100% );
}

    .hero-section::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: -1;
        pointer-events: none;
        background: linear-gradient( rgba(255, 255, 255, .024) 1px, transparent 1px ), linear-gradient( 90deg, rgba(255, 255, 255, .024) 1px, transparent 1px );
        background-size: 72px 72px;
        mask-image: linear-gradient( to bottom, transparent 0%, black 18%, black 78%, transparent 100% );
    }

    .hero-section::after {
        content: "";
        position: absolute;
        right: -190px;
        bottom: -300px;
        z-index: -1;
        width: 650px;
        height: 650px;
        border: 1px solid rgba(210, 170, 39, .12);
        border-radius: 50%;
        box-shadow: 0 0 0 70px rgba(210, 170, 39, .025), 0 0 0 140px rgba(210, 170, 39, .016);
        pointer-events: none;
    }

.hero-glow {
    position: absolute;
    z-index: -1;
    width: 440px;
    height: 440px;
    border-radius: 50%;
    pointer-events: none;
    filter: blur(90px);
}

.hero-glow-one {
    top: -190px;
    right: 7%;
    background: rgba(210, 170, 39, .15);
}

.hero-glow-two {
    bottom: -260px;
    left: -260px;
    background: rgba(31, 94, 137, .20);
}

.hero-grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0, 1.02fr) minmax(400px, .98fr);
    align-items: center;
    gap: clamp(55px, 7vw, 105px);
}

.hero-content {
    position: relative;
    z-index: 3;
    max-width: 690px;
}

.hero-section .eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 22px;
    color: var(--gold-light);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .18em;
    line-height: 1.3;
    text-transform: uppercase;
}

    .hero-section .eyebrow span {
        display: block;
        width: 32px;
        height: 2px;
        flex: 0 0 auto;
        background: var(--gold);
    }

.hero-overline {
    margin: 0 0 14px;
    color: rgba(255, 255, 255, .68);
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .11em;
    line-height: 1.5;
    text-transform: uppercase;
}

.hero-section h1 {
    max-width: 760px;
    margin: 0;
    color: var(--white);
    font-family: "Manrope", sans-serif;
    font-size: clamp(58px, 7vw, 104px);
    font-weight: 800;
    letter-spacing: -.068em;
    line-height: .90;
    text-transform: uppercase;
}

    .hero-section h1 em {
        display: block;
        color: var(--gold-light);
        word-spacing: 0.12em;
    }

.hero-lead {
    max-width: 600px;
    margin-top: 30px;
    color: rgba(255, 255, 255, .70);
    font-size: 16px;
    line-height: 1.82;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 34px;
}

    .hero-actions .btn {
        min-height: 52px;
        padding-inline: 22px;
        border-radius: 6px;
        font-size: 12px;
        letter-spacing: .06em;
        text-transform: uppercase;
    }

    .hero-actions .btn-gold {
        color: var(--navy-deep);
        background: var(--gold);
    }

        .hero-actions .btn-gold:hover {
            color: var(--navy-deep);
            background: var(--gold-light);
        }

    .hero-actions .btn-ghost-light {
        color: var(--white);
        background: var(--navy);
        border: 1px solid var(--navy);
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
    }

        .hero-actions .btn-ghost-light:hover {
            color: var(--white);
            background: var(--navy-dark);
            border-color: var(--navy-dark);
        }


/* =========================================================
   HERO META
   ========================================================= */

.hero-meta {
    display: grid;
    grid-template-columns: repeat(3, minmax(130px, 1fr));
    width: min(100%, 540px);
    margin-top: 48px;
    border-top: 1px solid rgba(255, 255, 255, .13);
}

    .hero-meta > div {
        position: relative;
        padding: 17px 20px 0 0;
    }

        .hero-meta > div + div {
            padding-left: 20px;
            border-left: 1px solid rgba(255, 255, 255, .13);
        }

    .hero-meta strong {
        display: block;
        color: var(--gold-light);
        font-size: 11px;
        font-weight: 900;
        letter-spacing: .13em;
        line-height: 1.4;
    }

    .hero-meta span {
        display: block;
        margin-top: 4px;
        color: rgba(255, 255, 255, .48);
        font-size: 11px;
        font-weight: 500;
        line-height: 1.4;
    }


/* =========================================================
   HERO PORTRAIT
   ========================================================= */

.hero-portrait {
    position: relative;
    z-index: 2;
    width: min(100%, 535px);
    justify-self: end;
}

.portrait-frame {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 5;
    padding: 9px;
    overflow: hidden;
    background: linear-gradient( 145deg, rgba(224, 188, 60, .95) 0%, rgba(210, 170, 39, .40) 32%, rgba(255, 255, 255, .13) 72%, rgba(255, 255, 255, .06) 100% );
    border-radius: 20px 20px 115px 20px;
    box-shadow: 0 35px 85px rgba(0, 0, 0, .34), 0 0 0 1px rgba(255, 255, 255, .07);
}

    .portrait-frame::before {
        content: "";
        position: absolute;
        inset: 9px;
        z-index: 2;
        border: 1px solid rgba(255, 255, 255, .18);
        border-radius: 13px 13px 108px 13px;
        pointer-events: none;
    }

    .portrait-frame::after {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 3;
        background: linear-gradient( 180deg, rgba(5, 22, 39, .01) 35%, rgba(5, 22, 39, .22) 100% );
        pointer-events: none;
    }

    .portrait-frame img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        border-radius: 12px 12px 108px 12px;
        transform: scale(1.01);
        transition: transform .8s var(--ease);
    }

.hero-portrait:hover .portrait-frame img {
    transform: scale(1.045);
}

.hero-portrait::before {
    content: "";
    position: absolute;
    top: -20px;
    right: -20px;
    z-index: 4;
    width: 145px;
    height: 145px;
    border-top: 2px solid var(--gold);
    border-right: 2px solid var(--gold);
    border-radius: 0 25px 0 0;
    opacity: .8;
    pointer-events: none;
}

.hero-portrait::after {
    content: "";
    position: absolute;
    bottom: -22px;
    left: -22px;
    z-index: 4;
    width: 125px;
    height: 125px;
    border-bottom: 2px solid rgba(210, 170, 39, .72);
    border-left: 2px solid rgba(210, 170, 39, .72);
    border-radius: 0 0 0 25px;
    pointer-events: none;
}




/* =========================================================
   HERO REVEAL
   ========================================================= */

.hero-section .reveal {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity .75s ease, transform .8s var(--ease);
}

.hero-section .hero-portrait.reveal {
    transition-delay: .12s;
}

.hero-section .reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}


/* =========================================================
   NEWS TICKER
   ========================================================= */

.news-strip {
    position: relative;
    z-index: 5;
    min-height: 58px;
    display: flex;
    align-items: center;
    overflow: hidden;
    color: var(--navy);
    background: var(--gold);
}

.news-inner {
    display: flex;
    align-items: center;
    gap: 30px;
    min-width: 0;
}

.news-label {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
    padding-right: 25px;
    background: var(--gold);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .13em;
    text-transform: uppercase;
}

    .news-label i {
        width: 7px;
        height: 7px;
        flex: 0 0 auto;
        border-radius: 50%;
        background: var(--navy);
        box-shadow: 0 0 0 4px rgba(13, 43, 77, .10);
    }

.news-window {
    min-width: 0;
    overflow: hidden;
}

.news-track {
    display: flex;
    align-items: center;
    gap: 65px;
    white-space: nowrap;
}

    .news-track a {
        position: relative;
        font-size: 13px;
        font-weight: 700;
        transition: opacity .25s ease;
    }

        .news-track a::before {
            content: "•";
            position: absolute;
            left: -36px;
            color: rgba(13, 43, 77, .45);
        }

        .news-track a:hover {
            opacity: .65;
        }


/* =========================================================
   ABOUT
   ========================================================= */

.about-section {
    background: var(--white);
}

.about-grid {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1fr);
    align-items: center;
    gap: 95px;
}

.about-visual {
    position: relative;
}

.about-image {
    position: relative;
    width: 100%;
    max-width: 520px;
    margin-left: auto;
    overflow: hidden;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
}

    .about-image::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient( to top, rgba(8, 31, 58, .25), transparent 35% );
        pointer-events: none;
    }

    .about-image img {
        width: 100%;
        aspect-ratio: 4 / 5;
        object-fit: cover;
        transition: transform .8s var(--ease);
    }

.about-visual:hover .about-image img {
    transform: scale(1.025);
}

.experience-card {
    position: absolute;
    bottom: 45px;
    left: -35px;
    display: flex;
    align-items: center;
    gap: 16px;
    min-width: 205px;
    padding: 20px 22px;
    color: var(--white);
    background: var(--navy);
    border-left: 4px solid var(--gold);
    border-radius: 8px;
    box-shadow: var(--shadow-md);
}

.experience-number {
    color: var(--gold-light);
    font-family: "Manrope", sans-serif;
    font-size: 30px;
    font-weight: 800;
    line-height: 1;
}

.experience-card strong,
.experience-card span {
    display: block;
}

.experience-card strong {
    font-size: 13px;
    font-weight: 800;
}

.experience-card span:not(.experience-number) {
    color: rgba(255, 255, 255, .56);
    font-size: 12px;
}

.about-content {
    max-width: 610px;
}

    .about-content h2 {
        margin-bottom: 28px;
    }

    .about-content p {
        color: var(--text-soft);
        font-size: 16px;
        line-height: 1.85;
    }

    .about-content .lead-paragraph {
        margin-bottom: 17px;
        color: var(--navy);
        font-size: 20px;
        font-weight: 600;
        line-height: 1.65;
    }

.about-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin: 32px 0;
}

    .about-tags span {
        padding: 8px 13px;
        color: var(--navy);
        background: var(--surface);
        border: 1px solid var(--border);
        border-radius: 100px;
        font-size: 11px;
        font-weight: 800;
    }

.about-content .btn {
    margin-top: 4px;
}


/* =========================================================
   MISSIONS / DUTIES
   ========================================================= */

.missions-section {
    background: var(--off-white);
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}

.section-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 50px;
    margin-bottom: 60px;
}

    .section-heading > div {
        flex: 1;
    }

    .section-heading > p {
        max-width: 450px;
        color: var(--text-soft);
        font-size: 15px;
        line-height: 1.8;
    }

.mission-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}

.mission-card {
    position: relative;
    min-height: 330px;
    padding: 34px 30px;
    overflow: hidden;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
}

    .mission-card::before {
        content: "";
        position: absolute;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 3px;
        background: var(--gold);
        transform: scaleX(0);
        transform-origin: left;
        transition: transform .4s var(--ease);
    }

    .mission-card:hover {
        transform: translateY(-7px);
        border-color: rgba(210, 170, 39, .35);
        box-shadow: var(--shadow-md);
    }

        .mission-card:hover::before {
            transform: scaleX(1);
        }

.mission-number {
    position: absolute;
    top: 25px;
    right: 25px;
    color: rgba(13, 43, 77, .12);
    font-family: "Manrope", sans-serif;
    font-size: 40px;
    font-weight: 800;
    line-height: 1;
}

.mission-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin-bottom: 55px;
    color: var(--gold-dark);
    background: rgba(210, 170, 39, .11);
    border-radius: 12px;
    font-size: 25px;
    transition: background .3s ease, color .3s ease, transform .3s ease;
}

.mission-card:hover .mission-icon {
    color: var(--white);
    background: var(--gold);
    transform: rotate(-4deg);
}

.mission-card h3 {
    max-width: 230px;
    margin-bottom: 14px;
    font-size: 21px;
    font-weight: 800;
}

.mission-card p {
    color: var(--text-soft);
    font-size: 13px;
    line-height: 1.75;
}

.mission-bottom {
    display: grid;
    grid-template-columns: .9fr 1.1fr;
    align-items: center;
    gap: 84px;
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}

    .mission-bottom img {
        width: 100%;
        aspect-ratio: 1.5 / 1;
        object-fit: cover;
        border-radius: var(--radius-md);
        box-shadow: var(--shadow-md);
    }

    .mission-bottom h3 {
        margin-bottom: 23px;
        font-size: clamp(32px, 3.15vw, 46px);
        line-height: 1.12;
    }

    .mission-bottom p {
        max-width: 650px;
        margin-bottom: 30px;
        color: var(--text-soft);
        font-size: 19px;
        line-height: 1.82;
    }


/* =========================================================
   EVENTS SLIDER
   ========================================================= */

.events-section {
    background: var(--white);
}

.events-heading {
    align-items: center;
}

    .events-heading .btn-outline {
        align-self: flex-end;
        margin-bottom: 4px;
    }


/* ---------------------------------------------------------
   SLIDER
   --------------------------------------------------------- */

.events-slider {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.events-track {
    display: flex;
    width: 100%;
    transition: transform .65s var(--ease);
    will-change: transform;
}

.events-slide {
    flex: 0 0 100%;
    width: 100%;
    min-width: 100%;
}


/* ---------------------------------------------------------
   EVENT CARD
   All slides use exactly the same desktop dimensions.
   --------------------------------------------------------- */

.event-feature {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
    width: 100%;
    height: 520px;
    min-height: 520px;
    max-height: 520px;
    overflow: hidden;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 14px;
    box-shadow: 0 18px 50px rgba(6, 25, 47, .07);
}


/* ---------------------------------------------------------
   EVENT IMAGE
   --------------------------------------------------------- */

.event-feature-image {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    background: var(--surface);
}

    .event-feature-image::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient( to top, rgba(6, 25, 47, .48), transparent 45% );
        pointer-events: none;
    }

    .event-feature-image img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        transition: transform .7s var(--ease);
    }

.event-feature:hover .event-feature-image img {
    transform: scale(1.035);
}


/* ---------------------------------------------------------
   CATEGORY
   --------------------------------------------------------- */

.event-feature-category {
    position: absolute;
    z-index: 3;
    left: 26px;
    bottom: 24px;
    padding-left: 13px;
    color: var(--white);
    border-left: 2px solid var(--gold);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .16em;
    line-height: 1.4;
}


/* ---------------------------------------------------------
   IMAGE ARROW
   --------------------------------------------------------- */

.event-feature-arrow {
    position: absolute;
    z-index: 3;
    right: 24px;
    bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    color: var(--navy);
    background: var(--gold);
    border-radius: 50%;
    font-size: 18px;
    font-weight: 800;
    transition: transform .3s var(--ease), background .25s ease;
}

.event-feature:hover .event-feature-arrow {
    background: var(--gold-light);
    transform: translate(2px, -2px);
}


/* ---------------------------------------------------------
   CONTENT
   --------------------------------------------------------- */

.event-feature-content {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    padding: 38px 44px;
    box-sizing: border-box;
}

.event-feature-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-shrink: 0;
    gap: 20px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--border);
}

.event-feature-date {
    color: var(--gold-dark);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .14em;
}

.event-feature-counter {
    color: var(--navy);
    font-family: "Manrope", sans-serif;
    font-size: 24px;
    font-weight: 800;
    line-height: 1;
}

    .event-feature-counter small {
        color: var(--text-muted);
        font-size: 11px;
        font-weight: 700;
    }


/* ---------------------------------------------------------
   MAIN CONTENT
   --------------------------------------------------------- */

.event-feature-main {
    display: flex;
    flex: 1;
    flex-direction: column;
    justify-content: center;
    min-height: 0;
    padding: 30px 0;
}

.event-feature-kicker {
    display: block;
    flex-shrink: 0;
    margin-bottom: 14px;
    color: var(--text-muted);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .15em;
    text-transform: uppercase;
}

.event-feature-main h3 {
    max-width: 570px;
    margin-bottom: 18px;
    color: var(--navy-dark);
    font-size: clamp(27px, 3vw, 40px);
    line-height: 1.12;
}

.event-feature-main p {
    max-width: 540px;
    margin-bottom: 24px;
    color: var(--text-soft);
    font-size: 14px;
    line-height: 1.8;
}

.event-feature-main .text-link {
    align-self: flex-start;
    flex-shrink: 0;
}


/* ---------------------------------------------------------
   CONTROLS
   --------------------------------------------------------- */

.events-slider-controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    margin-top: 22px;
}

.events-slider-progress {
    position: relative;
    width: min(100%, 420px);
    height: 2px;
    overflow: hidden;
    background: var(--border);
}

.events-slider-progress-bar {
    width: 0;
    height: 100%;
    background: var(--gold);
    transition: width .4s ease;
}

.events-slider-navigation {
    display: flex;
    align-items: center;
    gap: 12px;
}

.events-slider-dots {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-inline: 6px;
}

.events-dot {
    width: 7px;
    height: 7px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: var(--border);
    cursor: pointer;
    transition: width .3s var(--ease), background .25s ease;
}

    .events-dot:hover {
        background: var(--gold-dark);
    }

    .events-dot.is-active {
        width: 25px;
        border-radius: 10px;
        background: var(--gold);
    }


/* ---------------------------------------------------------
   NAVIGATION BUTTONS
   --------------------------------------------------------- */

.events-slider-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    color: var(--navy);
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 50%;
    font-size: 17px;
    font-weight: 700;
    cursor: pointer;
    transition: color .25s ease, background .25s ease, border-color .25s ease, transform .25s var(--ease);
}

    .events-slider-arrow:hover {
        color: var(--navy);
        background: var(--gold);
        border-color: var(--gold);
        transform: translateY(-2px);
    }



/* ---------------------------------------------------------
   EVENTS — VIEW ALL
   --------------------------------------------------------- */

.events-view-all {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin-top: 30px;
}

    .events-view-all .btn {
        min-width: 165px;
        justify-content: center;
    }


/* ---------------------------------------------------------
   EVENTS — VIEW ALL RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 640px) {

    .events-view-all {
        margin-top: 24px;
    }

        .events-view-all .btn {
            width: 100%;
            min-width: 0;
        }
}

/* ---------------------------------------------------------
   EMPTY
   --------------------------------------------------------- */

.events-empty {
    padding: 60px 40px;
    text-align: center;
    background: var(--off-white);
    border: 1px solid var(--border);
    border-radius: 14px;
}

    .events-empty h3 {
        margin-bottom: 10px;
        font-size: 25px;
    }

    .events-empty p {
        color: var(--text-soft);
    }


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 900px) {

    .event-feature {
        grid-template-columns: 1fr;
        height: auto;
        min-height: 0;
        max-height: none;
    }

    .event-feature-image {
        width: 100%;
        height: auto;
        aspect-ratio: 16 / 9;
    }

    .event-feature-content {
        width: 100%;
        height: auto;
        min-height: 390px;
        padding: 32px;
    }

    .event-feature-main h3 {
        max-width: 700px;
    }

    .events-slider-controls {
        margin-top: 20px;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 640px) {

    .event-feature-image {
        aspect-ratio: 16 / 9;
    }

    .event-feature-category {
        left: 18px;
        bottom: 17px;
    }

    .event-feature-arrow {
        right: 16px;
        bottom: 14px;
        width: 40px;
        height: 40px;
        font-size: 16px;
    }

    .event-feature-content {
        min-height: 350px;
        padding: 24px 20px;
    }

    .event-feature-top {
        padding-bottom: 15px;
    }

    .event-feature-counter {
        font-size: 20px;
    }

    .event-feature-main {
        padding: 24px 0 8px;
    }

        .event-feature-main h3 {
            font-size: 26px;
        }

        .event-feature-main p {
            font-size: 13px;
        }

    .events-slider-controls {
        gap: 15px;
    }

    .events-slider-progress {
        display: none;
    }

    .events-slider-navigation {
        width: 100%;
        justify-content: space-between;
    }

    .events-slider-dots {
        margin-inline: auto;
    }

    .events-slider-arrow {
        width: 40px;
        height: 40px;
    }
}


/* ---------------------------------------------------------
   REDUCED MOTION
   --------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {

    .events-track {
        transition: none;
    }

    .event-feature-image img {
        transition: none;
    }
}


/* =========================================================
   LATEST EVENTS / SON GELİŞMELER
   ========================================================= */

.latest-section {
    padding: 92px 0;
    background: var(--off-white);
    border-top: 1px solid var(--border);
}

.latest-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 38px;
}

    .latest-heading h2 {
        max-width: 620px;
        margin: 0;
    }

    .latest-heading > .text-link {
        margin-bottom: 7px;
    }


/* ---------------------------------------------------------
   FEATURED LATEST EVENT
   --------------------------------------------------------- */

.latest-feature {
    display: grid;
    grid-template-columns: minmax(0, .96fr) minmax(0, 1.04fr);
    min-height: 565px;
    overflow: hidden;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 14px;
    box-shadow: 0 18px 50px rgba(6, 25, 47, .07);
    transition: border-color .3s ease, transform .35s var(--ease);
}

    .latest-feature:hover {
        border-color: rgba(210, 170, 39, .38);
        transform: translateY(-2px);
    }


/* ---------------------------------------------------------
   IMAGE
   --------------------------------------------------------- */

.latest-image {
    position: relative;
    display: block;
    min-height: 565px;
    overflow: hidden;
    background: var(--surface);
}

    .latest-image::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient( 180deg, rgba(8, 31, 58, 0) 58%, rgba(8, 31, 58, .18) 100% );
        pointer-events: none;
    }

    .latest-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        transition: transform .65s var(--ease);
    }

.latest-feature:hover .latest-image img {
    transform: scale(1.025);
}


/* ---------------------------------------------------------
   IMAGE ARROW
   --------------------------------------------------------- */

.image-arrow {
    position: absolute;
    z-index: 2;
    right: 17px;
    bottom: 17px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    color: var(--navy);
    background: var(--gold);
    border-radius: 50%;
    font-size: 15px;
    font-weight: 800;
    transition: transform .3s var(--ease), background .25s ease;
}

.latest-feature:hover .image-arrow {
    background: var(--gold-light);
    transform: rotate(8deg);
}


/* ---------------------------------------------------------
   COPY
   --------------------------------------------------------- */

.latest-copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 46px 54px;
}

    .latest-copy .date {
        display: block;
        margin-bottom: 12px;
        color: var(--gold-dark);
        font-size: 10px;
        font-weight: 900;
        letter-spacing: .15em;
    }

    .latest-copy h3 {
        max-width: 560px;
        margin: 0 0 18px;
        color: var(--navy);
        font-size: clamp(28px, 2.65vw, 40px);
        line-height: 1.12;
        letter-spacing: -.035em;
    }

    .latest-copy p {
        max-width: 500px;
        margin: 0 0 22px;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 4;
        overflow: hidden;
        color: var(--text-soft);
        font-size: 13px;
        line-height: 1.72;
    }

    .latest-copy .text-link {
        align-self: flex-start;
    }


/* ---------------------------------------------------------
   EMPTY STATE
   --------------------------------------------------------- */

.latest-empty {
    padding: 45px;
    text-align: center;
    color: var(--text-muted);
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 12px;
}


/* ---------------------------------------------------------
   LATEST RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 900px) {

    .latest-feature {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .latest-image {
        min-height: 330px;
    }

    .latest-copy {
        padding: 34px 32px;
    }

        .latest-copy h3,
        .latest-copy p {
            max-width: 700px;
        }
}

/* =========================================================
   GALLERY
   ========================================================= */

.gallery-preview {
    background: var(--white);
}

.gallery-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 45px;
}

.gallery-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr;
    gap: 14px;
    height: 510px;
}

.gallery-item {
    position: relative;
    display: block;
    overflow: hidden;
    background: var(--surface);
    border-radius: var(--radius-md);
}

    .gallery-item::after {
        content: "";
        position: absolute;
        right: 18px;
        bottom: 18px;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 43px;
        height: 43px;
        color: var(--navy);
        background: var(--gold);
        border-radius: 50%;
        opacity: 0;
        transform: translateY(8px);
        transition: opacity .3s ease, transform .3s var(--ease);
    }

    .gallery-item:hover::after {
        opacity: 1;
        transform: translateY(0);
    }

    .gallery-item img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform .7s var(--ease), filter .5s ease;
    }

    .gallery-item:hover img {
        filter: brightness(.88);
        transform: scale(1.05);
    }

.gallery-item-main {
    grid-row: span 1;
}



/* =========================================================
   CONTACT
   ========================================================= */

.contact-section {
    padding: 30px 0 92px;
    background: var(--off-white);
}

.contact-card {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 50px;
    padding: 65px 75px;
    overflow: hidden;
    color: var(--white);
    background: radial-gradient( circle at 80% 20%, rgba(210, 170, 39, .14), transparent 32% ), linear-gradient( 135deg, var(--navy-dark), var(--navy) );
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
}

    .contact-card::before {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        width: 38%;
        height: 100%;
        background: linear-gradient( 135deg, transparent 48%, rgba(210, 170, 39, .08) 49%, transparent 50% );
        background-size: 24px 24px;
        opacity: .45;
    }

    .contact-card > div {
        position: relative;
        z-index: 2;
    }

    .contact-card .section-kicker {
        color: var(--gold-light);
    }

    .contact-card h2 {
        margin-bottom: 22px;
        color: var(--white);
    }

    .contact-card p {
        max-width: 620px;
        color: rgba(255, 255, 255, .67);
        font-size: 15px;
    }

    .contact-card .btn {
        position: relative;
        z-index: 2;
        flex: 0 0 auto;
    }


/* =========================================================
   FOOTER
   ========================================================= */

.site-footer {
    position: relative;
    overflow: hidden;
    color: rgba(255, 255, 255, .72);
    background: var(--navy-deep);
}

    .site-footer::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 1px;
        background: linear-gradient( 90deg, transparent, var(--gold), transparent );
        opacity: .7;
    }

    .site-footer::after {
        content: "";
        position: absolute;
        right: -150px;
        bottom: -230px;
        width: 480px;
        height: 480px;
        border: 1px solid rgba(210, 170, 39, .08);
        border-radius: 50%;
        box-shadow: 0 0 0 50px rgba(210, 170, 39, .025), 0 0 0 100px rgba(210, 170, 39, .018), 0 0 0 150px rgba(210, 170, 39, .012);
        pointer-events: none;
    }

.footer-top {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) 1fr 1fr;
    gap: 80px;
    padding-top: 80px;
    padding-bottom: 70px;
}

.footer-brand {
    max-width: 420px;
}

    .footer-brand .brand {
        margin-bottom: 24px;
    }

    .footer-brand .brand-emblem {
        width: 50px;
        height: 50px;
    }

    .footer-brand p {
        max-width: 380px;
        color: rgba(255, 255, 255, .47);
        font-size: 13px;
        line-height: 1.8;
    }

.footer-nav {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

    .footer-nav > span {
        position: relative;
        margin-bottom: 20px;
        color: var(--gold-light);
        font-size: 10px;
        font-weight: 900;
        letter-spacing: .16em;
        text-transform: uppercase;
    }

        .footer-nav > span::after {
            content: "";
            display: block;
            width: 24px;
            height: 2px;
            margin-top: 9px;
            background: var(--gold);
        }

    .footer-nav > a {
        position: relative;
        display: inline-flex;
        margin-bottom: 10px;
        color: rgba(255, 255, 255, .56);
        font-size: 12px;
        font-weight: 600;
        transition: color .25s ease, transform .25s var(--ease);
    }

        .footer-nav > a::before {
            content: "";
            align-self: center;
            width: 0;
            height: 1px;
            margin-right: 0;
            background: var(--gold);
            transition: width .25s var(--ease), margin-right .25s var(--ease);
        }

        .footer-nav > a:hover {
            color: var(--white);
            transform: translateX(2px);
        }

            .footer-nav > a:hover::before {
                width: 10px;
                margin-right: 8px;
            }

.footer-bottom {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 70px;
    border-top: 1px solid rgba(255, 255, 255, .09);
    color: rgba(255, 255, 255, .35);
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .02em;
}

    .footer-bottom span:last-child {
        color: rgba(210, 170, 39, .65);
    }


/* =========================================================
   REVEAL ANIMATION
   ========================================================= */

.reveal {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity .75s var(--ease), transform .75s var(--ease);
}

    .reveal.is-visible {
        opacity: 1;
        transform: translateY(0);
    }

/* =========================================================
   MINIMAL UI SCALE
   Daha sakin, kompakt ve %100 tarayıcı zoomunda rahat
   okunabilir bir görsel hiyerarşi.
   ========================================================= */

:root {
    --container: 1180px;
    --section-space: 72px;
    --header-height: 74px;
    --shadow-sm: 0 5px 18px rgba(13, 43, 77, .05);
    --shadow-md: 0 10px 28px rgba(13, 43, 77, .07);
    --shadow-lg: 0 18px 42px rgba(8, 31, 58, .10);
    --shadow-gold: 0 8px 20px rgba(210, 170, 39, .15);
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 14px;
    --radius-xl: 18px;
}

html {
    scroll-padding-top: 78px;
}

.container {
    width: min(calc(100% - 40px), var(--container));
}

.section-pad {
    padding-block: var(--section-space);
}

section[id] {
    scroll-margin-top: 82px;
}

h2 {
    font-size: clamp(34px, 3.2vw, 50px);
    letter-spacing: -.045em;
}

.section-kicker {
    gap: 8px;
    margin-bottom: 15px;
    font-size: 10px;
    letter-spacing: .16em;
}

    .section-kicker::before {
        width: 22px;
        height: 1px;
    }

.text-link {
    gap: 9px;
    font-size: 12px;
}

    .text-link span {
        font-size: 16px;
    }

    .text-link:hover {
        gap: 12px;
    }

/* BUTTONS */


/* =========================================================
   LATEST EVENTS SLIDER
   ========================================================= */

.latest-slider {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.latest-viewport {
    width: 100%;
    overflow: hidden;
}

.latest-track {
    display: flex;
    width: 100%;
    transition: transform .65s var(--ease);
    will-change: transform;
}

.latest-slide {
    flex: 0 0 100%;
    width: 100%;
    min-width: 100%;
}

    .latest-slide .latest-feature {
        display: grid;
        grid-template-columns: minmax(0, .98fr) minmax(0, 1.02fr);
        width: 100%;
        height: 535px;
        min-height: 535px;
        max-height: 535px;
        overflow: hidden;
        background: var(--white);
        border: 1px solid var(--border);
        border-radius: 14px;
        box-shadow: 0 18px 50px rgba(6, 25, 47, .07);
        transition: border-color .3s ease, transform .35s var(--ease);
    }

        .latest-slide .latest-feature:hover {
            border-color: rgba(210, 170, 39, .38);
            transform: translateY(-2px);
        }

    .latest-slide .latest-image {
        position: relative;
        display: block;
        width: 100%;
        height: 535px;
        min-height: 535px;
        overflow: hidden;
        background: var(--surface);
    }

        .latest-slide .latest-image::after {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient( 180deg, rgba(8, 31, 58, 0) 58%, rgba(8, 31, 58, .18) 100% );
            pointer-events: none;
        }

        .latest-slide .latest-image img {
            display: block;
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: center;
            transition: transform .65s var(--ease);
        }

    .latest-slide .latest-feature:hover .latest-image img {
        transform: scale(1.025);
    }

    .latest-slide .image-arrow {
        position: absolute;
        z-index: 2;
        right: 18px;
        bottom: 18px;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 42px;
        height: 42px;
        color: var(--navy);
        background: var(--gold);
        border-radius: 50%;
        font-size: 16px;
        font-weight: 800;
        transition: transform .3s var(--ease), background .25s ease;
    }

    .latest-slide .latest-feature:hover .image-arrow {
        background: var(--gold-light);
        transform: rotate(8deg);
    }

    .latest-slide .latest-copy {
        display: flex;
        flex-direction: column;
        justify-content: center;
        width: 100%;
        height: 535px;
        min-width: 0;
        padding: 48px 56px;
    }

        .latest-slide .latest-copy .date {
            display: block;
            margin-bottom: 14px;
            color: var(--gold-dark);
            font-size: 10px;
            font-weight: 900;
            letter-spacing: .15em;
            line-height: 1.3;
        }

        .latest-slide .latest-copy h3 {
            max-width: 560px;
            margin: 0 0 20px;
            color: var(--navy);
            font-size: clamp(28px, 2.65vw, 40px);
            line-height: 1.12;
            letter-spacing: -.035em;
        }

        .latest-slide .latest-copy p {
            max-width: 520px;
            margin: 0 0 24px;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 4;
            overflow: hidden;
            color: var(--text-soft);
            font-size: 14px;
            line-height: 1.78;
        }

        .latest-slide .latest-copy .text-link {
            align-self: flex-start;
        }

.latest-slider-controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 22px;
}

.latest-slider-dots {
    display: flex;
    align-items: center;
    gap: 7px;
}

.latest-dot {
    width: 7px;
    height: 7px;
    padding: 0;
    background: rgba(13, 43, 77, .18);
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    transition: width .3s var(--ease), background .25s ease, transform .25s ease;
}

    .latest-dot:hover {
        transform: scale(1.15);
    }

    .latest-dot.is-active {
        width: 24px;
        background: var(--gold);
        border-radius: 10px;
    }

.latest-slider-arrows {
    display: flex;
    align-items: center;
    gap: 8px;
}

.latest-slider-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    color: var(--navy);
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 50%;
    font-size: 17px;
    cursor: pointer;
    transition: color .25s ease, background .25s ease, border-color .25s ease, transform .25s var(--ease);
}

    .latest-slider-arrow:hover {
        color: var(--navy);
        background: var(--gold);
        border-color: var(--gold);
        transform: translateY(-2px);
    }

.latest-empty {
    padding: 45px;
    text-align: center;
    color: var(--text-muted);
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 12px;
}

@media (max-width: 900px) {
    .latest-slide .latest-feature {
        grid-template-columns: 1fr;
        height: auto;
        min-height: 0;
        max-height: none;
    }

    .latest-slide .latest-image {
        width: 100%;
        height: auto;
        min-height: 0;
        aspect-ratio: 16 / 9;
    }

    .latest-slide .latest-copy {
        width: 100%;
        height: auto;
        min-height: 300px;
        padding: 34px 32px;
    }

        .latest-slide .latest-copy h3,
        .latest-slide .latest-copy p {
            max-width: 700px;
        }
}

@media (max-width: 600px) {
    .latest-slider-controls {
        gap: 12px;
        margin-top: 14px;
    }

    .latest-slide .latest-image {
        height: auto;
        min-height: 0;
        aspect-ratio: 16 / 9;
    }

    .latest-slide .latest-copy {
        min-height: 250px;
        padding: 24px 21px 26px;
    }

        .latest-slide .latest-copy h3 {
            font-size: 22px;
        }

        .latest-slide .latest-copy p {
            font-size: 12px;
        }

    .latest-slider-arrow {
        width: 38px;
        height: 38px;
        font-size: 15px;
    }

    .latest-slider-dots {
        gap: 6px;
    }

    .latest-dot.is-active {
        width: 20px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .latest-track {
        transition: none;
    }

    .latest-slide .latest-image img {
        transition: none;
    }
}

/* =========================================================


/* =========================================================
   EVENTS PAGE
   ========================================================= */

.events-page {
    padding: 150px 0 120px;
    background: var(--off-white);
}

/* ---------------------------------------------------------
   PAGE HEADING
   --------------------------------------------------------- */

.events-page-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 55px;
}

    .events-page-heading > div {
        max-width: 760px;
    }

    .events-page-heading .section-kicker {
        margin-bottom: 18px;
    }

    .events-page-heading h1 {
        margin: 0;
        color: var(--navy);
        font-family: "Manrope", sans-serif;
        font-size: clamp(42px, 5vw, 68px);
        font-weight: 800;
        line-height: .98;
        letter-spacing: -.055em;
    }

        .events-page-heading h1 em {
            color: var(--gold);
            font-style: normal;
        }

    .events-page-heading p {
        max-width: 600px;
        margin-top: 22px;
        color: var(--text-soft);
        font-size: 15px;
        line-height: 1.8;
    }

/* ---------------------------------------------------------
   EVENTS GRID
   --------------------------------------------------------- */

.events-page-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
}

/* ---------------------------------------------------------
   EVENT CARD
   --------------------------------------------------------- */

.events-page-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    overflow: hidden;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 12px;
    transition: transform .35s var(--ease), border-color .3s ease, box-shadow .35s ease;
}

    .events-page-card:hover {
        transform: translateY(-6px);
        border-color: rgba(210, 170, 39, .45);
        box-shadow: var(--shadow-md);
    }

/* ---------------------------------------------------------
   EVENT IMAGE
   --------------------------------------------------------- */

.events-page-image {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: var(--surface);
}

    .events-page-image::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient( to top, rgba(6, 25, 47, .35), transparent 55% );
        pointer-events: none;
    }

    .events-page-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        transition: transform .65s var(--ease);
    }

.events-page-card:hover .events-page-image img {
    transform: scale(1.045);
}

/* ---------------------------------------------------------
   IMAGE ARROW
   --------------------------------------------------------- */

.events-page-image-arrow {
    position: absolute;
    right: 15px;
    bottom: 15px;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    color: var(--navy);
    background: var(--gold);
    border-radius: 50%;
    font-size: 17px;
    font-weight: 700;
    line-height: 1;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity .3s ease, transform .3s var(--ease), background .25s ease;
}

.events-page-card:hover .events-page-image-arrow {
    opacity: 1;
    transform: translateY(0);
}

.events-page-image-arrow:hover {
    background: var(--gold-light);
}

/* ---------------------------------------------------------
   EVENT CONTENT
   --------------------------------------------------------- */

.events-page-content {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 24px 25px 26px;
}

.events-page-date {
    display: block;
    margin-bottom: 11px;
    color: var(--gold-dark);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .14em;
    line-height: 1.4;
}

.events-page-content h2 {
    margin: 0;
    color: var(--navy);
    font-family: "Manrope", sans-serif;
    font-size: 21px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -.025em;
}

.events-page-content p {
    display: -webkit-box;
    margin-top: 13px;
    overflow: hidden;
    color: var(--text-soft);
    font-size: 13px;
    line-height: 1.7;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

/* ---------------------------------------------------------
   EVENT DETAIL LINK
   --------------------------------------------------------- */

.events-page-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: fit-content;
    margin-top: auto;
    padding-top: 20px;
    color: var(--navy);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .05em;
    text-transform: uppercase;
    transition: color .25s ease, gap .3s var(--ease);
}

    .events-page-link span {
        color: var(--gold-dark);
        font-size: 17px;
        line-height: 1;
        transition: transform .3s var(--ease);
    }

    .events-page-link:hover {
        color: var(--gold-dark);
        gap: 12px;
    }

        .events-page-link:hover span {
            transform: translateX(3px);
        }

/* ---------------------------------------------------------
   EMPTY STATE
   --------------------------------------------------------- */

.events-page-empty {
    display: flex;
    align-items: center;
    gap: 25px;
    padding: 35px;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 12px;
}

    .events-page-empty > span {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 58px;
        height: 58px;
        flex: 0 0 auto;
        color: var(--navy);
        background: var(--gold);
        border-radius: 8px;
        font-family: "Manrope", sans-serif;
        font-size: 13px;
        font-weight: 900;
    }

    .events-page-empty h2 {
        margin: 0;
        font-size: 24px;
    }

    .events-page-empty p {
        margin-top: 7px;
        color: var(--text-soft);
        font-size: 13px;
    }

/* ---------------------------------------------------------
   EVENTS PAGINATION
   --------------------------------------------------------- */

.events-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    margin-top: 45px;
    padding-top: 25px;
    border-top: 1px solid var(--border);
}

.events-pagination-info {
    color: var(--text-soft);
    font-size: 12px;
    font-weight: 600;
}

.events-pagination-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.events-pagination-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 42px;
    padding: 0 16px;
    color: var(--navy);
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 7px;
    font-size: 11px;
    font-weight: 800;
    transition: color .25s ease, background .25s ease, border-color .25s ease, transform .25s var(--ease);
}

    .events-pagination-button:hover {
        color: var(--navy);
        background: var(--gold);
        border-color: var(--gold);
        transform: translateY(-2px);
    }

    .events-pagination-button span {
        font-size: 11px;
    }

/* =========================================================
   EVENTS PAGE RESPONSIVE
   ========================================================= */

@media (max-width: 1000px) {

    .events-page {
        padding: 130px 0 90px;
    }

    .events-page-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 24px;
    }

    .events-page-heading {
        margin-bottom: 42px;
    }
}

@media (max-width: 600px) {

    .events-page {
        padding: 115px 0 70px;
    }

    .events-page-heading {
        margin-bottom: 32px;
    }

        .events-page-heading h1 {
            font-size: 42px;
        }

        .events-page-heading p {
            margin-top: 17px;
            font-size: 13px;
        }

    .events-page-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .events-page-card {
        border-radius: 10px;
    }

    .events-page-content {
        padding: 21px 21px 23px;
    }

        .events-page-content h2 {
            font-size: 20px;
        }

    .events-page-image-arrow {
        width: 34px;
        height: 34px;
        opacity: 1;
        transform: none;
        font-size: 15px;
    }

    .events-pagination {
        align-items: flex-start;
        flex-direction: column;
        gap: 15px;
    }

    .events-pagination-actions {
        width: 100%;
    }

    .events-pagination-button {
        flex: 1;
    }

    .events-page-empty {
        align-items: flex-start;
        padding: 25px;
    }
}

/* =========================================================


/* =========================================================
   EVENT DETAIL PAGE
   ========================================================= */

.event-detail-page {
    padding: 135px 0 110px;
    background: var(--off-white);
}

/* ---------------------------------------------------------
   BACK LINK
   --------------------------------------------------------- */

.event-detail-top {
    width: min(100%, 980px);
    margin: 0 auto 25px;
}

.event-detail-back {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: var(--text-soft);
    font-size: 12px;
    font-weight: 800;
    transition: color .25s ease, gap .3s var(--ease);
}

    .event-detail-back span {
        color: var(--gold-dark);
        font-size: 17px;
        line-height: 1;
    }

    .event-detail-back:hover {
        color: var(--navy);
        gap: 13px;
    }

/* ---------------------------------------------------------
   DETAIL WRAPPER
   --------------------------------------------------------- */

.event-detail {
    width: min(100%, 980px);
    margin-inline: auto;
}

/* ---------------------------------------------------------
   IMAGE
   --------------------------------------------------------- */

.event-detail-image {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: min(100%, 820px);
    height: min(760px, 72vh);
    margin: 0 auto;
    overflow: hidden;
    background: var(--surface);
    border-radius: 14px;
    box-shadow: var(--shadow-lg);
}

    .event-detail-image::after {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        background: linear-gradient( to top, rgba(6, 25, 47, .20), transparent 45% );
    }

    .event-detail-image img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: contain;
        object-position: center;
    }

/* ---------------------------------------------------------
   DETAIL INFORMATION CARD
   --------------------------------------------------------- */

.event-detail-header {
    width: min(100%, 900px);
    margin: -1px auto 0;
    padding: 48px 58px 44px;
    background: var(--white);
    border: 1px solid var(--border);
    border-top: 0;
    border-radius: 0 0 14px 14px;
}

    .event-detail-header .section-kicker {
        margin-bottom: 14px;
    }

.event-detail-date {
    display: block;
    margin-bottom: 14px;
    color: var(--gold-dark);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .15em;
    line-height: 1.4;
}

.event-detail-header h1 {
    max-width: 780px;
    color: var(--navy);
    font-size: clamp(34px, 4vw, 54px);
    line-height: 1.04;
    letter-spacing: -.045em;
}

.event-detail-intro {
    max-width: 780px;
    margin-top: 19px;
    color: var(--text-soft);
    font-size: 15px;
    line-height: 1.8;
}

/* ---------------------------------------------------------
   CONTENT
   --------------------------------------------------------- */

.event-detail-content {
    width: min(100%, 900px);
    margin: 0 auto;
    padding: 38px 58px 55px;
    color: var(--text-soft);
    background: var(--white);
    border: 1px solid var(--border);
    border-top: 0;
    border-radius: 0 0 14px 14px;
    font-size: 15px;
    line-height: 1.95;
    white-space: pre-line;
}

    .event-detail-content p {
        margin-bottom: 20px;
    }

/* ---------------------------------------------------------
   FOOTER LINK
   --------------------------------------------------------- */

.event-detail-footer {
    width: min(100%, 900px);
    margin: 26px auto 0;
    padding-inline: 3px;
}

/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 900px) {

    .event-detail-page {
        padding: 120px 0 85px;
    }

    .event-detail-top,
    .event-detail {
        width: 100%;
    }

    .event-detail-image {
        width: min(100%, 760px);
        height: min(640px, 68vh);
        aspect-ratio: auto;
    }

    .event-detail-header {
        width: 100%;
        padding: 40px 40px 38px;
    }

    .event-detail-content {
        width: 100%;
        padding: 32px 40px 45px;
    }
}

@media (max-width: 600px) {

    .event-detail-page {
        padding: 105px 0 65px;
    }

    .event-detail-top {
        margin-bottom: 20px;
    }

    .event-detail-image {
        width: 100%;
        height: min(620px, 78vh);
        aspect-ratio: auto;
        border-radius: 10px;
        box-shadow: var(--shadow-md);
    }

    .event-detail-header {
        padding: 30px 21px 28px;
        border-radius: 0;
    }

        .event-detail-header h1 {
            font-size: 31px;
            line-height: 1.08;
        }

    .event-detail-intro {
        margin-top: 15px;
        font-size: 14px;
        line-height: 1.75;
    }

    .event-detail-content {
        padding: 27px 21px 34px;
        font-size: 14px;
        line-height: 1.85;
        border-radius: 0 0 10px 10px;
    }

    .event-detail-footer {
        margin-top: 21px;
    }
}

/* =========================================================


/* =========================================================
   CONTACT SECTION / FORM
   ========================================================= */

.contact-section {
    padding: 110px 0 120px;
    background: var(--off-white);
}

.contact-card {
    display: grid;
    grid-template-columns: minmax(300px, .82fr) minmax(0, 1.18fr);
    gap: 70px;
    padding: 58px 60px 60px;
    overflow: hidden;
    background: radial-gradient( circle at 88% 10%, rgba(210, 170, 39, .08), transparent 32% ), linear-gradient( 120deg, var(--navy-deep), var(--navy) );
    border: 1px solid rgba(255, 255, 255, .07);
    border-radius: 14px;
    box-shadow: var(--shadow-lg);
}

.contact-intro {
    align-self: start;
}

    .contact-intro .section-kicker {
        margin-bottom: 18px;
    }

    .contact-intro h2 {
        margin: 0;
        color: var(--white);
        font-size: clamp(38px, 4vw, 58px);
        line-height: 1.02;
        letter-spacing: -.045em;
    }

        .contact-intro h2 em {
            color: var(--gold);
            font-style: normal;
        }

    .contact-intro > p {
        max-width: 470px;
        margin-top: 22px;
        color: rgba(255, 255, 255, .68);
        font-size: 14px;
        line-height: 1.8;
    }


/* ---------------------------------------------------------
   CONTACT INFO
   --------------------------------------------------------- */

.contact-info {
    display: grid;
    gap: 0;
    margin-top: 42px;
    border-top: 1px solid rgba(255, 255, 255, .12);
}

.contact-info-item {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    padding: 18px 0;
    border-bottom: 1px solid rgba(255, 255, 255, .12);
}

.contact-info-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    color: var(--gold);
    background: rgba(210, 170, 39, .09);
    border: 1px solid rgba(210, 170, 39, .28);
    border-radius: 8px;
    font-size: 13px;
    font-weight: 800;
}

.contact-info-copy {
    min-width: 0;
}

    .contact-info-copy small {
        display: block;
        margin-bottom: 5px;
        color: var(--gold);
        font-size: 9px;
        font-weight: 900;
        letter-spacing: .14em;
    }

    .contact-info-copy a,
    .contact-info-copy span {
        display: block;
        color: rgba(255, 255, 255, .82);
        font-size: 13px;
        line-height: 1.6;
    }

    .contact-info-copy a {
        transition: color .25s ease;
    }

        .contact-info-copy a:hover {
            color: var(--gold-light);
        }


/* ---------------------------------------------------------
   FORM
   --------------------------------------------------------- */

.contact-form {
    align-self: start;
    padding: 28px;
    background: rgba(255, 255, 255, .055);
    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 12px;
}

.contact-form-heading {
    margin-bottom: 25px;
}

    .contact-form-heading span {
        display: block;
        margin-bottom: 8px;
        color: var(--gold);
        font-size: 9px;
        font-weight: 900;
        letter-spacing: .16em;
    }

    .contact-form-heading h3 {
        margin: 0;
        color: var(--white);
        font-size: 25px;
        line-height: 1.15;
        letter-spacing: -.025em;
    }

.contact-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.contact-field {
    min-width: 0;
}

.contact-field-full {
    grid-column: 1 / -1;
}

.contact-field label {
    display: block;
    margin-bottom: 8px;
    color: rgba(255, 255, 255, .82);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .06em;
}

.contact-field input,
.contact-field textarea {
    display: block;
    width: 100%;
    color: var(--white);
    background: rgba(4, 22, 42, .58);
    border: 1px solid rgba(255, 255, 255, .15);
    border-radius: 7px;
    outline: none;
    font-family: inherit;
    font-size: 13px;
    transition: border-color .25s ease, background .25s ease, box-shadow .25s ease;
}

.contact-field input {
    height: 48px;
    padding: 0 14px;
}

.contact-field textarea {
    min-height: 130px;
    padding: 13px 14px;
    resize: vertical;
    line-height: 1.6;
}

    .contact-field input::placeholder,
    .contact-field textarea::placeholder {
        color: rgba(255, 255, 255, .38);
    }

    .contact-field input:hover,
    .contact-field textarea:hover {
        border-color: rgba(255, 255, 255, .25);
    }

    .contact-field input:focus,
    .contact-field textarea:focus {
        background: rgba(4, 22, 42, .78);
        border-color: var(--gold);
        box-shadow: 0 0 0 3px rgba(210, 170, 39, .10);
    }

.contact-field-error {
    display: block;
    margin-top: 6px;
    color: #f2c3c3;
    font-size: 10px;
    line-height: 1.4;
}

.contact-validation-summary {
    margin-bottom: 15px;
    color: #f2c3c3;
    font-size: 11px;
}

    .contact-validation-summary:empty {
        display: none;
    }


/* ---------------------------------------------------------
   FORM FOOTER
   --------------------------------------------------------- */

.contact-form-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 22px;
    padding-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, .10);
}

    .contact-form-footer > span {
        color: rgba(255, 255, 255, .42);
        font-size: 10px;
        line-height: 1.5;
    }

    .contact-form-footer .btn {
        flex: 0 0 auto;
        min-height: 48px;
        padding-inline: 21px;
    }


/* ---------------------------------------------------------
   SUCCESS MESSAGE
   --------------------------------------------------------- */

.contact-success {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: 13px;
    margin-top: -35px;
    padding: 14px 16px;
    color: var(--white);
    background: rgba(210, 170, 39, .10);
    border: 1px solid rgba(210, 170, 39, .35);
    border-radius: 8px;
}

.contact-success-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    color: var(--navy);
    background: var(--gold);
    border-radius: 50%;
    font-size: 13px;
    font-weight: 900;
}

.contact-success strong {
    display: block;
    color: var(--white);
    font-size: 12px;
}

.contact-success span:last-child {
    display: block;
    margin-top: 2px;
    color: rgba(255, 255, 255, .62);
    font-size: 10px;
}


/* ---------------------------------------------------------
   CONTACT RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 1000px) {

    .contact-card {
        grid-template-columns: 1fr;
        gap: 38px;
        padding: 45px;
    }

    .contact-intro > p {
        max-width: 650px;
    }

    .contact-info {
        margin-top: 30px;
    }

    .contact-success {
        margin-top: -15px;
    }
}

@media (max-width: 600px) {

    .contact-section {
        padding: 75px 0 80px;
    }

    .contact-card {
        gap: 30px;
        padding: 30px 20px;
        border-radius: 10px;
    }

    .contact-intro h2 {
        font-size: 37px;
    }

    .contact-intro > p {
        margin-top: 16px;
        font-size: 13px;
    }

    .contact-info {
        margin-top: 25px;
    }

    .contact-info-item {
        padding: 15px 0;
    }

    .contact-form {
        padding: 20px 16px;
        border-radius: 9px;
    }

    .contact-form-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .contact-field-full {
        grid-column: auto;
    }

    .contact-form-footer {
        align-items: stretch;
        flex-direction: column;
    }

        .contact-form-footer .btn {
            width: 100%;
            justify-content: center;
        }

    .contact-success {
        margin-top: -10px;
    }
}

/* =========================================================
   CONTACT FORM INTERACTION / ICON FIX
   ========================================================= */

.contact-form {
    position: relative;
    z-index: 5;
    pointer-events: auto;
}

.contact-form-grid {
    position: relative;
    z-index: 1;
}

.contact-field {
    position: relative;
    z-index: 1;
}

    .contact-field label,
    .contact-field input,
    .contact-field textarea {
        position: relative;
        z-index: 2;
        pointer-events: auto;
    }

    .contact-field input,
    .contact-field textarea {
        cursor: text;
        appearance: none;
        -webkit-appearance: none;
    }

        .contact-field input:disabled,
        .contact-field textarea:disabled {
            cursor: not-allowed;
        }

.contact-info {
    position: relative;
    z-index: 2;
}

.contact-info-item {
    position: relative;
    z-index: 2;
}

.contact-info-icon {
    line-height: 0;
}

    .contact-info-icon svg {
        display: block;
        width: 16px;
        height: 16px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.8px;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

.contact-info-copy a {
    position: relative;
    z-index: 3;
    pointer-events: auto;
}


/* =========================================================


/* =========================================================
   ABOUT PAGE
   ========================================================= */

.about-page {
    padding: 125px 0 105px;
    background: var(--off-white);
}

    .about-page .container {
        position: relative;
        width: min(calc(100% - 48px), var(--container));
        margin-inline: auto;
    }

/* ---------------------------------------------------------
   BACK LINK
   --------------------------------------------------------- */

.about-page-top {
    margin-bottom: 30px;
}

.about-page-back {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: var(--text-soft);
    font-size: 12px;
    font-weight: 800;
    transition: color .25s ease, gap .3s var(--ease);
}

    .about-page-back span {
        color: var(--gold-dark);
        font-size: 17px;
        line-height: 1;
    }

    .about-page-back:hover {
        color: var(--navy);
        gap: 13px;
    }

/* ---------------------------------------------------------
   PAGE HERO
   --------------------------------------------------------- */

.about-page-hero {
    display: grid;
    grid-template-columns: minmax(0, 500px) minmax(0, 1fr);
    align-items: center;
    gap: clamp(55px, 6vw, 85px);
    min-height: 510px;
    width: min(100%, 1160px);
    margin-inline: auto;
}

.about-page-visual {
    min-width: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.about-page-image {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 0 18px 18px 0;
}

.about-page-image-frame {
    position: relative;
    width: min(100%, 500px);
    aspect-ratio: 4 / 5;
    overflow: visible;
    background: var(--surface);
    border-radius: 16px;
}

    .about-page-image-frame::before {
        content: "";
        position: absolute;
        inset: 18px -18px -18px 18px;
        z-index: 0;
        border: 1px solid var(--gold);
        border-radius: 16px;
    }

    .about-page-image-frame::after {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 2;
        pointer-events: none;
        border-radius: 16px;
        background: linear-gradient(to top, rgba(8, 31, 58, .20), transparent 38%);
    }

    .about-page-image-frame img {
        position: relative;
        z-index: 1;
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        border-radius: 16px;
        box-shadow: var(--shadow-lg);
        transition: transform .7s var(--ease);
    }

.about-page-image:hover .about-page-image-frame img {
    transform: scale(1.018);
}

.about-page-heading {
    min-width: 0;
    width: 100%;
    max-width: 760px;
}

    .about-page-heading .section-kicker {
        margin-bottom: 20px;
    }

    .about-page-heading h1 {
        max-width: 760px;
        margin: 0;
        color: var(--navy);
        font-family: "Manrope", sans-serif;
        font-size: clamp(58px, 5.4vw, 88px);
        font-weight: 800;
        line-height: .91;
        letter-spacing: -.065em;
    }

        .about-page-heading h1 em {
            color: var(--gold);
            font-style: normal;
        }

.about-page-lead {
    max-width: 720px;
    margin-top: 28px;
    color: var(--text-soft);
    font-size: 16px;
    line-height: 1.85;
}

.about-page-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 29px;
}

    .about-page-tags span {
        padding: 8px 14px;
        color: var(--navy);
        background: var(--white);
        border: 1px solid var(--border);
        border-radius: 100px;
        font-size: 10px;
        font-weight: 800;
        transition: color .25s ease, background .25s ease, border-color .25s ease, transform .25s ease;
    }

        .about-page-tags span:hover {
            color: var(--white);
            background: var(--navy);
            border-color: var(--navy);
            transform: translateY(-2px);
        }

/* ---------------------------------------------------------
   BIOGRAPHY
   --------------------------------------------------------- */

.about-page-content {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    align-items: start;
    gap: 65px;
    width: min(100%, 1120px);
    margin: 92px auto 0;
    padding-top: 58px;
    border-top: 1px solid var(--border);
}

.about-page-content-label {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 420px;
}

    .about-page-content-label .section-kicker {
        margin-bottom: 0;
    }

.about-page-number {
    color: rgba(13, 43, 77, .11);
    font-family: "Manrope", sans-serif;
    font-size: 86px;
    font-weight: 800;
    line-height: .9;
    letter-spacing: -.06em;
}

.about-page-biography {
    width: 100%;
    max-width: 875px;
}

    .about-page-biography h2 {
        margin: 0 0 27px;
        color: var(--navy);
        font-size: clamp(34px, 3vw, 48px);
        line-height: 1.05;
        letter-spacing: -.045em;
    }

    .about-page-biography p,
    .about-page-biography-text {
        margin: 0;
        color: var(--text-soft);
        font-size: 15px;
        line-height: 1.95;
    }

/* ---------------------------------------------------------
   SOCIAL FOOTER CARD
   --------------------------------------------------------- */

.about-page-social {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 45px;
    width: min(100%, 1160px);
    margin: 82px auto 0;
    padding: 38px 42px;
    overflow: hidden;
    background: radial-gradient(circle at 85% 15%, rgba(210, 170, 39, .10), transparent 32%), linear-gradient(135deg, var(--navy-deep), var(--navy));
    border-radius: 12px;
    box-shadow: var(--shadow-md);
}

    .about-page-social .section-kicker {
        margin-bottom: 9px;
    }

        .about-page-social .section-kicker::before {
            background: var(--gold);
        }

    .about-page-social h2 {
        margin: 0;
        color: var(--white);
        font-size: 28px;
        line-height: 1.1;
        letter-spacing: -.035em;
    }

.about-page-social-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

    .about-page-social-links a {
        display: inline-flex;
        align-items: center;
        gap: 9px;
        min-height: 44px;
        padding: 0 16px;
        color: var(--white);
        background: rgba(255, 255, 255, .045);
        border: 1px solid rgba(255, 255, 255, .15);
        border-radius: 7px;
        font-size: 11px;
        font-weight: 800;
        transition: color .25s ease, background .25s ease, border-color .25s ease, transform .3s var(--ease);
    }

        .about-page-social-links a span {
            color: var(--gold);
            font-size: 15px;
            line-height: 1;
        }

        .about-page-social-links a:hover {
            color: var(--navy);
            background: var(--gold);
            border-color: var(--gold);
            transform: translateY(-2px);
        }

            .about-page-social-links a:hover span {
                color: var(--navy);
            }

/* ---------------------------------------------------------
   ABOUT PAGE REVEAL
   --------------------------------------------------------- */

.about-page .reveal {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .7s ease, transform .75s var(--ease);
}

    .about-page .reveal.is-visible {
        opacity: 1;
        transform: translateY(0);
    }

/* ---------------------------------------------------------
   ABOUT PAGE RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 1050px) {

    .about-page-hero {
        grid-template-columns: minmax(0, 430px) minmax(0, 1fr);
        gap: 45px;
        max-width: 940px;
    }

    .about-page-image-frame {
        width: min(100%, 430px);
    }

    .about-page-heading h1 {
        font-size: clamp(52px, 6vw, 72px);
    }

    .about-page-content {
        grid-template-columns: 155px minmax(0, 1fr);
        gap: 40px;
        width: min(100%, 900px);
    }
}

@media (max-width: 760px) {

    .about-page {
        padding: 110px 0 80px;
    }

        .about-page .container {
            width: min(calc(100% - 36px), var(--container));
        }

    .about-page-top {
        margin-bottom: 24px;
    }

    .about-page-hero {
        grid-template-columns: 1fr;
        gap: 40px;
        min-height: 0;
    }

    .about-page-visual {
        justify-content: flex-start;
    }

    .about-page-image {
        justify-content: flex-start;
        padding-right: 12px;
        padding-bottom: 12px;
    }

    .about-page-image-frame {
        width: min(100%, 500px);
    }

    .about-page-heading {
        max-width: 720px;
    }

        .about-page-heading h1 {
            font-size: clamp(48px, 11vw, 68px);
        }

    .about-page-lead {
        font-size: 14px;
        line-height: 1.8;
    }

    .about-page-content {
        grid-template-columns: 1fr;
        gap: 25px;
        margin-top: 70px;
        padding-top: 38px;
    }

    .about-page-content-label {
        min-height: 0;
    }

    .about-page-number {
        margin-top: 14px;
        font-size: 54px;
    }

    .about-page-biography h2 {
        margin-bottom: 20px;
        font-size: 34px;
    }

    .about-page-biography p,
    .about-page-biography-text {
        font-size: 14px;
        line-height: 1.85;
    }

    .about-page-social {
        align-items: flex-start;
        flex-direction: column;
        gap: 25px;
        margin-top: 60px;
        padding: 30px 24px;
    }

    .about-page-social-links {
        justify-content: flex-start;
        width: 100%;
    }
}

@media (max-width: 450px) {

    .about-page .container {
        width: min(calc(100% - 28px), var(--container));
    }

    .about-page-heading h1 {
        font-size: 43px;
    }

    .about-page-image {
        padding-right: 7px;
        padding-bottom: 7px;
    }

    .about-page-image-frame::before {
        inset: 10px -10px -10px 10px;
    }

    .about-page-tags span {
        font-size: 9px;
    }

    .about-page-social {
        padding: 26px 18px;
    }

    .about-page-social-links {
        flex-direction: column;
    }

        .about-page-social-links a {
            width: 100%;
            justify-content: center;
        }
}

/* =========================================================
/* =========================================================
   FINAL CORPORATE DESIGN
   Sade / Şık / Kurumsal
   ========================================================= */

/* ---------------------------------------------------------
   GLOBAL
   --------------------------------------------------------- */

:root {
    --navy: #0d2b4d;
    --navy-dark: #081f3a;
    --gold: #d2aa27;
    --gold-dark: #a98518;
    --gold-light: #e3c45a;
    --white: #fff;
    --off-white: #f6f7f8;
    --surface: #f1f3f5;
    --text: #172333;
    --text-soft: #5f6c7b;
    --text-muted: #7b8794;
    --border: #e1e5e9;
    --radius-sm: 4px;
    --radius-md: 6px;
    --radius-lg: 8px;
}

body {
    background: var(--white);
    color: var(--text);
}

a,
button {
    -webkit-tap-highlight-color: transparent;
}

/* ---------------------------------------------------------
   HEADER
   --------------------------------------------------------- */

.site-header,
.site-header.is-scrolled,
body:has(.hero-section) .site-header:not(.is-scrolled) {
    background: #fff !important;
    border-bottom: 1px solid var(--border) !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

    .site-header .header-inner {
        min-height: 74px;
    }

    .site-header .brand {
        gap: 11px;
        color: var(--navy);
    }

    .site-header .brand-logo {
        width: 72px;
        height: 40px;
        flex: 0 0 72px;
    }

        .site-header .brand-logo img {
            width: 72px;
            height: 40px;
            object-fit: contain;
            transform: none !important;
            filter: none !important;
        }

    .site-header .brand-copy strong {
        color: var(--navy-dark);
        font-size: 17px;
        font-weight: 800;
    }

    .site-header .brand-copy small {
        color: var(--text-soft);
        font-size: 10px;
        font-weight: 600;
    }

    .site-header .primary-nav {
        gap: 2px;
    }

        .site-header .primary-nav > a:not(.nav-social) {
            min-height: 42px;
            padding-inline: 13px;
            color: var(--navy-dark) !important;
            font-size: 14px !important;
            font-weight: 700;
            letter-spacing: .01em;
        }

            .site-header .primary-nav > a:not(.nav-social)::after {
                background: var(--gold);
            }

            .site-header .primary-nav > a:not(.nav-social):hover {
                color: var(--navy) !important;
            }

    .site-header .nav-social {
        width: 34px;
        height: 34px;
        margin-left: 7px;
        color: var(--navy);
        background: transparent;
        border: 1px solid var(--border);
        border-radius: var(--radius-sm);
    }

        .site-header .nav-social:hover {
            color: var(--navy);
            background: var(--gold);
            border-color: var(--gold);
            transform: none;
        }

/* ---------------------------------------------------------
   HERO
   --------------------------------------------------------- */

.hero-section {
    min-height: auto;
    padding: 90px 0 50px;
    background: #f4f6f8 !important;
    color: var(--text);
}

    .hero-section::before,
    .hero-section::after,
    .hero-glow,
    .hero-glow-one,
    .hero-glow-two {
        display: none !important;
    }

.hero-grid {
    grid-template-columns: minmax(0, 1fr) minmax(360px, .78fr);
    gap: clamp(52px, 7vw, 92px);
}

.hero-content {
    max-width: 640px;
}

.hero-section .eyebrow {
    margin-bottom: 18px;
    color: var(--gold-dark);
    font-size: 11px;
    font-weight: 800;
}

.hero-overline {
    margin-bottom: 10px;
    color: var(--text-soft);
    font-size: 12px;
    font-weight: 700;
}

.hero-section h1 {
    color: var(--navy-dark) !important;
    font-size: clamp(50px, 6vw, 78px);
    line-height: .98;
    letter-spacing: -.055em;
}

    .hero-section h1 em {
        color: var(--gold) !important;
    }

.hero-lead {
    max-width: 560px;
    margin-top: 24px;
    color: var(--text-soft) !important;
    font-size: 16px;
    line-height: 1.75;
}

.hero-actions {
    margin-top: 28px;
}

    .hero-actions .btn {
        min-height: 46px;
        border-radius: var(--radius-sm);
    }

        .hero-actions .btn:hover {
            transform: none;
        }

.hero-meta {
    width: min(100%, 560px);
    margin-top: 38px;
    border-top: 1px solid var(--border);
}

    .hero-meta strong {
        color: var(--navy);
    }

    .hero-meta span {
        color: var(--text-muted);
    }

.hero-portrait {
    width: min(100%, 520px);
}

.portrait-frame {
    padding: 0;
    aspect-ratio: 4 / 5;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 0;
    box-shadow: none;
}

    .portrait-frame::before,
    .portrait-frame::after,
    .hero-portrait::before,
    .hero-portrait::after {
        display: none !important;
    }

    .portrait-frame img {
        width: 100%;
        height: 100%;
        object-fit: contain !important;
        object-position: center !important;
        transform: none !important;
        border-radius: 0 !important;
    }

.portrait-badge {
    right: 0;
    bottom: -18px;
    padding: 12px 16px;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    box-shadow: none;
}

/* ---------------------------------------------------------
   SECTIONS / TYPOGRAPHY
   --------------------------------------------------------- */

.section-pad {
    padding-block: 76px;
}

.section-heading,
.latest-heading,
.gallery-head {
    margin-bottom: 36px;
}

.section-kicker {
    color: var(--gold-dark);
    font-size: 11px !important;
    font-weight: 800;
}

.section-heading > p,
.latest-heading > p {
    color: var(--text-soft);
    font-size: 15px !important;
    line-height: 1.8 !important;
}

.text-link {
    color: var(--navy);
    font-size: 14px !important;
    font-weight: 700;
}

    .text-link:hover {
        color: var(--gold-dark);
    }

/* ---------------------------------------------------------
   ABOUT
   --------------------------------------------------------- */

.about-section {
    background: var(--white);
}

.about-grid {
    gap: clamp(58px, 8vw, 110px);
}

.about-image {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 0;
    box-shadow: none;
}

    .about-image::after {
        display: none !important;
    }

    .about-image img {
        object-fit: contain !important;
        object-position: center !important;
    }

.experience-card {
    bottom: 18px;
    left: -16px;
    min-width: 150px;
    padding: 11px 14px;
    background: var(--white);
    border: 1px solid var(--border);
    border-left: 2px solid var(--gold);
    border-radius: var(--radius-sm);
    box-shadow: none;
}

.experience-number {
    color: var(--gold-dark);
    font-size: 22px;
}

.about-content {
    max-width: 620px;
}

    .about-content p,
    .about-content .lead-paragraph {
        color: var(--text-soft);
        font-size: 16px !important;
        line-height: 1.8 !important;
    }

.about-tags span {
    color: var(--navy);
    background: #fafbfc;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
}

/* ---------------------------------------------------------
   DUTIES
   --------------------------------------------------------- */

.missions-section {
    background: var(--off-white);
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}

.mission-grid {
    gap: 0;
    border-top: 1px solid var(--border);
    border-left: 1px solid var(--border);
}

.mission-card {
    min-height: 230px;
    padding: 30px;
    background: var(--white);
    border: 0;
    border-right: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    border-radius: 0;
    box-shadow: none;
}

    .mission-card:hover {
        transform: none;
        box-shadow: none;
        background: #fcfcfb;
    }

.mission-icon {
    color: var(--navy);
    background: #f6f7f8;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
}

.mission-card h3 {
    color: var(--navy-dark);
}

.mission-card p,
.mission-bottom p {
    color: var(--text-soft);
    font-size: 15px !important;
    line-height: 1.8 !important;
}

.mission-bottom img {
    object-fit: contain !important;
    object-position: center !important;
    border-radius: 0;
    box-shadow: none;
}

/* ---------------------------------------------------------
   EVENTS
   --------------------------------------------------------- */

.events-section {
    padding-block: 76px;
    background: var(--white);
}

.event-feature {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 0;
    box-shadow: none;
}

.event-feature-image,
.events-page-image {
    background: var(--surface);
}

    .event-feature-image img,
    .events-page-image img {
        object-fit: contain !important;
        object-position: center !important;
        transform: none !important;
    }

    .event-feature-image::after,
    .events-page-image::after {
        display: none !important;
    }

.event-feature-main p {
    color: var(--text-soft);
    font-size: 15px !important;
    line-height: 1.8 !important;
}

.event-feature-arrow,
.events-page-image-arrow {
    width: 34px;
    height: 34px;
    right: 14px;
    bottom: 14px;
    color: var(--navy);
    background: var(--gold);
    border-radius: var(--radius-sm);
    box-shadow: none;
}

/* ---------------------------------------------------------
   LATEST DEVELOPMENTS
   --------------------------------------------------------- */

.latest-section {
    padding: 72px 0;
    background: var(--off-white);
    border-top: 1px solid var(--border);
}

.latest-feature,
.latest-slide .latest-feature {
    min-height: 460px;
    height: 460px;
    max-height: 460px;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 0;
    box-shadow: none;
}

    .latest-feature:hover,
    .latest-slide .latest-feature:hover {
        border-color: var(--border);
        transform: none;
    }

.latest-image,
.latest-slide .latest-image {
    height: 460px;
    min-height: 460px;
    background: var(--surface);
}

    .latest-image::after,
    .latest-slide .latest-image::after {
        display: none !important;
    }

    .latest-image img,
    .latest-slide .latest-image img {
        object-fit: contain !important;
        object-position: center !important;
        transform: none !important;
        transition: none !important;
    }

.latest-copy,
.latest-slide .latest-copy {
    height: 460px;
    padding: 42px;
}

    .latest-copy h3 {
        color: var(--navy-dark);
        font-size: clamp(26px, 3vw, 38px);
    }

    .latest-copy p,
    .latest-slide .latest-copy p {
        color: var(--text-soft);
        font-size: 15px !important;
        line-height: 1.8 !important;
    }

.image-arrow {
    width: 34px;
    height: 34px;
    right: 14px;
    bottom: 14px;
    color: var(--navy);
    background: var(--gold);
    border-radius: var(--radius-sm);
}

/* ---------------------------------------------------------
   GALLERY
   --------------------------------------------------------- */

.gallery-preview {
    background: var(--white);
}

.gallery-item {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 0;
    box-shadow: none;
}

    .gallery-item::after {
        display: none !important;
    }

    .gallery-item img {
        object-fit: contain !important;
        object-position: center !important;
        transform: none !important;
    }

    .gallery-item:hover {
        transform: none;
    }

        .gallery-item:hover img {
            opacity: .9;
            transform: none !important;
        }


/* ---------------------------------------------------------
   CONTACT
   --------------------------------------------------------- */

.contact-section {
    padding: 76px 0;
    background: var(--off-white);
    border-top: 1px solid var(--border);
}

.contact-card {
    gap: 0;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 0;
    box-shadow: none;
    overflow: hidden;
}

    .contact-card::before {
        display: none !important;
    }

.contact-intro {
    background: var(--navy);
}

    .contact-intro p {
        color: rgba(255,255,255,.72);
        font-size: 15px !important;
        line-height: 1.8 !important;
    }

.contact-form {
    background: var(--white);
}

.contact-field input,
.contact-field textarea {
    border: 1px solid #d8dee4;
    border-radius: var(--radius-sm);
    box-shadow: none;
}

/* ---------------------------------------------------------
   FOOTER
   --------------------------------------------------------- */

.site-footer {
    background: var(--navy-dark);
    border-top: 0;
}

    .site-footer::after {
        display: none !important;
    }

.footer-top {
    gap: 70px;
    padding-block: 64px 48px;
}

.footer-brand p {
    color: rgba(255,255,255,.66);
    font-size: 14px !important;
    line-height: 1.8 !important;
}

.footer-nav > span {
    color: var(--gold);
}

.footer-nav > a {
    color: rgba(255,255,255,.78);
    font-size: 13px !important;
}

    .footer-nav > a:hover {
        color: var(--gold);
    }

.footer-bottom {
    color: rgba(255,255,255,.48);
}

/* ---------------------------------------------------------
   INNER PAGES
   --------------------------------------------------------- */

.about-page,
.events-page,
.event-detail-page {
    background: var(--white);
}

.about-page-image-frame,
.event-detail-image {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 0;
    box-shadow: none;
}

    .about-page-image-frame img,
    .event-detail-image img {
        object-fit: contain !important;
        object-position: center !important;
    }

.events-page-card {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 0;
    box-shadow: none !important;
}

    .events-page-card:hover {
        transform: none;
        border-color: #cfd6dd;
    }

.events-page-content h2 {
    color: var(--navy-dark);
}

.events-page-content p {
    color: var(--text-soft);
    font-size: 15px !important;
    line-height: 1.75 !important;
}

/* ---------------------------------------------------------
   BUTTONS
   --------------------------------------------------------- */

.btn {
    border-radius: var(--radius-sm);
    font-size: 13px !important;
}

    .btn:hover {
        transform: none;
    }

.btn-outline {
    color: var(--navy);
    background: transparent;
    border: 1px solid var(--navy);
}

    .btn-outline:hover {
        color: var(--white);
        background: var(--navy);
        border-color: var(--navy);
    }

/* ---------------------------------------------------------
   MOTION
   --------------------------------------------------------- */

.reveal {
    transform: none !important;
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 1024px) {
    .hero-grid {
        grid-template-columns: minmax(0, 1fr) minmax(320px, .78fr);
        gap: 48px;
    }

    .about-grid {
        gap: 54px;
    }

    .latest-feature,
    .latest-slide .latest-feature {
        height: 430px;
        min-height: 430px;
        max-height: 430px;
    }

    .latest-image,
    .latest-slide .latest-image,
    .latest-copy,
    .latest-slide .latest-copy {
        height: 430px;
        min-height: 430px;
    }
}

@media (max-width: 768px) {
    .site-header .header-inner {
        min-height: 70px;
        height: 70px;
    }

    .site-header .brand-logo {
        width: 62px;
        height: 36px;
        flex-basis: 62px;
    }

        .site-header .brand-logo img {
            width: 62px;
            height: 36px;
        }

    .site-header .brand-copy strong {
        font-size: 14px;
    }

    .site-header .brand-copy small {
        font-size: 9px;
    }

    .hero-section {
        padding: 112px 0 58px;
    }

    .hero-grid,
    .about-grid,
    .mission-bottom,
    .hero-grid {
        gap: 48px;
    }

    .hero-portrait {
        justify-self: center;
        width: min(100%, 520px);
    }

    .section-pad {
        padding-block: 58px;
    }

    .mission-grid {
        grid-template-columns: 1fr;
    }

    .mission-card {
        min-height: 0;
        padding: 26px;
    }

    .mission-bottom {
        gap: 38px;
        margin-top: 42px;
        padding-top: 38px;
    }

    .event-feature,
    .latest-feature,
    .latest-slide .latest-feature,
    .contact-card {
        grid-template-columns: 1fr;
    }

    .event-feature-image,
    .events-page-image {
        aspect-ratio: 4 / 3 !important;
        min-height: 0;
    }

        .event-feature-image img,
        .events-page-image img {
            height: 100%;
            object-fit: contain !important;
        }

    .latest-feature,
    .latest-slide .latest-feature {
        height: auto;
        min-height: 0;
        max-height: none;
    }

    .latest-image,
    .latest-slide .latest-image {
        height: auto;
        min-height: 300px;
        aspect-ratio: 4 / 3;
    }

    .latest-copy,
    .latest-slide .latest-copy {
        height: auto;
        padding: 30px;
    }


    .contact-intro,
    .contact-form {
        padding: 32px;
    }

    .footer-top {
        grid-template-columns: 1.3fr 1fr 1fr;
        gap: 36px;
    }
}

@media (max-width: 480px) {
    .site-header .header-inner {
        min-height: 66px;
        height: 66px;
        padding-inline: 12px;
    }

    .site-header .brand-logo {
        width: 55px;
        height: 33px;
        flex-basis: 55px;
    }

        .site-header .brand-logo img {
            width: 55px;
            height: 33px;
        }

    .site-header .brand-copy strong {
        font-size: 12px;
    }

    .site-header .brand-copy small {
        font-size: 8px;
    }

    .hero-section {
        padding: 98px 0 48px;
    }

        .hero-section h1 {
            font-size: 42px;
        }

    .hero-actions {
        align-items: stretch;
        flex-direction: column;
    }

        .hero-actions .btn {
            width: 100%;
        }

    .section-pad,
    .latest-section,
    .events-section,
    .contact-section {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .mission-card {
        padding: 24px;
    }


    .contact-intro,
    .contact-form {
        padding: 26px 22px;
    }

    .footer-top {
        grid-template-columns: 1fr;
        gap: 28px;
        padding: 48px 0 34px;
    }
}

/* =========================================================
   COMPATIBILITY / EXISTING MARKUP
   ========================================================= */

.badge-line {
    background: var(--gold);
}

.about-page-line {
    background: var(--gold);
}

.gallery-empty,
.events-empty {
    padding: 36px;
    color: var(--text-muted);
    text-align: center;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
}

/* Legacy event markup remains visually consistent if used. */
.events-grid {
    gap: 24px;
}

.event-card-large {
    border: 1px solid var(--border);
    border-radius: 0;
    box-shadow: none;
}

.event-body {
    padding: 22px 24px 24px;
}

    .event-body h3 {
        color: var(--navy-dark);
    }

.event-category {
    color: var(--gold-dark);
}

.event-row {
    border-bottom-color: var(--border);
}

.event-date {
    border-radius: var(--radius-sm);
}

.event-row h3 {
    color: var(--navy-dark);
}

.event-row a {
    color: var(--navy);
}
/* =========================================================
   FINAL IMAGE SYSTEM
   Görseller doğal oranında gösterilir.
   Sabit gri/görsel rezerv alanları kaldırılır.
   Hiçbir görsel kırpılmaz.
   ========================================================= */

/* Ortak görsel davranışı */
.portrait-frame,
.about-image,
.mission-bottom-image,
.event-feature-image,
.latest-image,
.gallery-item,
.events-page-image,
.about-page-image-frame,
.event-detail-image,
.gallery-card-image {
    background: transparent !important;
}

/* ---------------------------------------------------------
   HERO
   --------------------------------------------------------- */

.hero-portrait {
    height: auto !important;
    min-height: 0 !important;
}

.portrait-frame {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

    .portrait-frame::before,
    .portrait-frame::after {
        display: none !important;
    }

    .portrait-frame img {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        aspect-ratio: auto !important;
        object-fit: contain !important;
        object-position: center !important;
        border-radius: 0 !important;
        transform: none !important;
    }

.hero-portrait:hover .portrait-frame img {
    transform: none !important;
}

/* ---------------------------------------------------------
   ABOUT
   --------------------------------------------------------- */

.about-image {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

    .about-image img {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        aspect-ratio: auto !important;
        object-fit: contain !important;
        object-position: center !important;
        transform: none !important;
    }

/* ---------------------------------------------------------
   DUTIES
   --------------------------------------------------------- */

.mission-bottom-image {
    height: auto !important;
    min-height: 0 !important;
}

.mission-bottom img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    object-position: center !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* ---------------------------------------------------------
   EVENTS — ANA SAYFA
   --------------------------------------------------------- */

.event-feature {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    align-items: flex-start !important;
    overflow: visible !important;
}

.event-feature-image {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    align-self: flex-start !important;
    overflow: visible !important;
}

    .event-feature-image img {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        aspect-ratio: auto !important;
        object-fit: contain !important;
        object-position: center !important;
        transform: none !important;
    }

    .event-feature-image::after {
        display: none !important;
    }

/* ---------------------------------------------------------
   LATEST EVENTS
   --------------------------------------------------------- */

.latest-feature,
.latest-slide .latest-feature {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    align-items: flex-start !important;
    overflow: visible !important;
}

.latest-image,
.latest-slide .latest-image {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    align-self: flex-start !important;
    overflow: visible !important;
}

    .latest-image img,
    .latest-slide .latest-image img {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        aspect-ratio: auto !important;
        object-fit: contain !important;
        object-position: center !important;
        transform: none !important;
    }

    .latest-image::after,
    .latest-slide .latest-image::after {
        display: none !important;
    }

/* ---------------------------------------------------------
   GALLERY PREVIEW
   --------------------------------------------------------- */

.gallery-grid {
    height: auto !important;
    min-height: 0 !important;
}

.gallery-item {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    overflow: hidden !important;
}

    .gallery-item img {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        aspect-ratio: auto !important;
        object-fit: contain !important;
        object-position: center !important;
        transform: none !important;
    }

    .gallery-item::after {
        display: none !important;
    }

    .gallery-item:hover img {
        transform: none !important;
    }


/* ---------------------------------------------------------
   EVENTS PAGE
   --------------------------------------------------------- */

.events-page-image {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    overflow: hidden !important;
}

    .events-page-image img {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        aspect-ratio: auto !important;
        object-fit: contain !important;
        object-position: center !important;
        transform: none !important;
    }

    .events-page-image::after {
        display: none !important;
    }

/* ---------------------------------------------------------
   INNER PAGE IMAGES
   --------------------------------------------------------- */

.about-page-image-frame {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    overflow: hidden !important;
}

    .about-page-image-frame img {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        aspect-ratio: auto !important;
        object-fit: contain !important;
        object-position: center !important;
    }

.event-detail-image {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    overflow: hidden !important;
}

    .event-detail-image img {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        aspect-ratio: auto !important;
        object-fit: contain !important;
        object-position: center !important;
    }

/* ---------------------------------------------------------
   GALLERY DETAIL
   --------------------------------------------------------- */

.gallery-card-image {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    overflow: hidden !important;
}

    .gallery-card-image img {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        aspect-ratio: auto !important;
        object-fit: contain !important;
        object-position: center !important;
    }

/* ---------------------------------------------------------
   MOBILE — aynı doğal oran sistemi
   --------------------------------------------------------- */

@media (max-width: 768px) {
    .portrait-frame,
    .about-image,
    .mission-bottom-image,
    .event-feature-image,
    .latest-image,
    .gallery-item,
    .events-page-image,
    .about-page-image-frame,
    .event-detail-image,
    .gallery-card-image {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        aspect-ratio: auto !important;
    }

        .portrait-frame img,
        .about-image img,
        .mission-bottom img,
        .event-feature-image img,
        .latest-image img,
        .gallery-item img,
        .events-page-image img,
        .about-page-image-frame img,
        .event-detail-image img,
        .gallery-card-image img {
            width: 100% !important;
            height: auto !important;
            min-height: 0 !important;
            max-height: none !important;
            aspect-ratio: auto !important;
            object-fit: contain !important;
        }

    .event-feature,
    .latest-feature,
    .latest-slide .latest-feature {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }
}
/* =========================================================
   CONTACT — FINAL CORPORATE FORM
   Sol panel lacivert / sağ panel beyaz
   ========================================================= */

.contact-section {
    padding: 64px 0 72px !important;
    background: var(--off-white) !important;
    border-top: 1px solid var(--border);
}

.contact-card {
    display: grid !important;
    grid-template-columns: minmax(330px, .78fr) minmax(0, 1.22fr) !important;
    gap: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: var(--white) !important;
    border: 1px solid var(--border) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

    .contact-card > .contact-intro,
    .contact-card > .contact-form {
        position: relative;
        z-index: 1;
    }

/* Sol bilgi paneli */
.contact-intro {
    align-self: stretch !important;
    padding: 44px 40px !important;
    background: var(--navy) !important;
}

    .contact-intro .section-kicker {
        color: var(--gold) !important;
    }

    .contact-intro h2 {
        margin: 0 !important;
        color: var(--white) !important;
        font-size: clamp(34px, 3.2vw, 48px) !important;
        line-height: 1.04 !important;
        letter-spacing: -.04em !important;
    }

        .contact-intro h2 em {
            color: var(--gold) !important;
        }

    .contact-intro > p {
        max-width: 430px !important;
        margin-top: 20px !important;
        color: rgba(255,255,255,.76) !important;
        font-size: 14px !important;
        line-height: 1.75 !important;
    }

/* Sol panel iletişim bilgileri */
.contact-info {
    margin-top: 34px !important;
    border-top: 1px solid rgba(255,255,255,.12) !important;
}

.contact-info-item {
    padding: 15px 0 !important;
    gap: 13px !important;
    border-bottom: 1px solid rgba(255,255,255,.12) !important;
}

.contact-info-icon {
    width: 36px !important;
    height: 36px !important;
    flex-basis: 36px !important;
    border-radius: 4px !important;
    background: rgba(255,255,255,.04) !important;
    border-color: rgba(210,170,39,.35) !important;
}

.contact-info-copy small {
    margin-bottom: 4px !important;
    font-size: 9px !important;
}

.contact-info-copy a,
.contact-info-copy span {
    color: rgba(255,255,255,.86) !important;
    font-size: 13px !important;
}

/* Sağ form */
.contact-form {
    align-self: stretch !important;
    padding: 44px 48px !important;
    background: var(--white) !important;
    border: 0 !important;
    border-radius: 0 !important;
}

.contact-form-heading {
    margin-bottom: 26px !important;
}

    .contact-form-heading span {
        color: var(--gold-dark) !important;
        font-size: 10px !important;
    }

    .contact-form-heading h3 {
        color: var(--navy-dark) !important;
        font-size: 27px !important;
        font-weight: 800 !important;
    }

/* Alan başlıkları */
.contact-field label {
    color: var(--navy-dark) !important;
    margin-bottom: 7px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
}

/* Input ve textarea */
.contact-field input,
.contact-field textarea {
    width: 100% !important;
    color: var(--text) !important;
    background: #fff !important;
    border: 1px solid #d5dce3 !important;
    border-radius: 4px !important;
    box-shadow: none !important;
    font-size: 14px !important;
}

.contact-field input {
    height: 48px !important;
    padding: 0 14px !important;
}

.contact-field textarea {
    min-height: 132px !important;
    padding: 13px 14px !important;
}

    .contact-field input::placeholder,
    .contact-field textarea::placeholder {
        color: #9aa5b0 !important;
    }

    .contact-field input:hover,
    .contact-field textarea:hover {
        border-color: #bdc7d0 !important;
        background: #fff !important;
    }

    .contact-field input:focus,
    .contact-field textarea:focus {
        color: var(--text) !important;
        background: #fff !important;
        border-color: var(--gold) !important;
        box-shadow: 0 0 0 3px rgba(210,170,39,.10) !important;
    }

/* Hata mesajları */
.contact-field-error,
.contact-validation-summary {
    color: #b33a3a !important;
}

/* Form altı */
.contact-form-footer {
    margin-top: 22px !important;
    padding-top: 20px !important;
    border-top: 1px solid var(--border) !important;
}

    .contact-form-footer > span {
        color: var(--text-muted) !important;
        font-size: 11px !important;
    }

    .contact-form-footer .btn {
        min-height: 46px !important;
        padding-inline: 22px !important;
        border-radius: 4px !important;
    }

/* Success */
.contact-success {
    color: var(--text) !important;
    background: #fffaf0 !important;
    border: 1px solid rgba(210,170,39,.35) !important;
}

    .contact-success strong {
        color: var(--navy-dark) !important;
    }

    .contact-success span:last-child {
        color: var(--text-soft) !important;
    }

/* Tablet */
@media (max-width: 1000px) {
    .contact-card {
        grid-template-columns: 1fr !important;
    }

    .contact-intro {
        padding: 40px !important;
    }

    .contact-form {
        padding: 40px !important;
    }
}

/* Mobil */
@media (max-width: 600px) {
    .contact-section {
        padding: 50px 0 56px !important;
    }

    .contact-intro {
        padding: 32px 24px !important;
    }

        .contact-intro h2 {
            font-size: 36px !important;
        }

    .contact-form {
        padding: 30px 24px !important;
    }

    .contact-form-grid {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    .contact-field-full {
        grid-column: auto !important;
    }

    .contact-form-footer {
        align-items: flex-start !important;
        flex-direction: column !important;
    }

        .contact-form-footer .btn {
            width: 100% !important;
        }
}
/* =========================================================
   EVENTS — OPTIMUM IMAGE SYSTEM
   Sabit kart yüksekliği + kırpılmayan görsel
   ========================================================= */

/*
   Farklı oranlardaki etkinlik fotoğraflarında iki hedef aynı anda
   korunur:
   1) Slider her fotoğrafta aynı yükseklikte kalır.
   2) Fotoğrafın hiçbir bölümü kırpılmaz.

   Bunun için görsel alanı sabit, fotoğraf ise contain olarak
   kendi oranını koruyacak şekilde ortalanır.
*/

.events-slider {
    height: 520px !important;
    min-height: 520px !important;
    overflow: hidden !important;
}

.events-track {
    height: 520px !important;
    min-height: 520px !important;
    align-items: stretch !important;
}

.events-slide {
    height: 520px !important;
    min-height: 520px !important;
}

.event-feature {
    display: grid !important;
    grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr) !important;
    width: 100% !important;
    height: 520px !important;
    min-height: 520px !important;
    max-height: 520px !important;
    overflow: hidden !important;
    background: var(--white) !important;
}

/* Fotoğraf alanı artık gri bir rezerv kutusu değil. */
.event-feature-image {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;
    background: var(--white) !important;
}

    /* Fotoğraf asla kesilmez ve kendi oranını korur. */
    .event-feature-image img {
        display: block !important;
        width: auto !important;
        height: auto !important;
        max-width: 100% !important;
        max-height: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
        aspect-ratio: auto !important;
        object-fit: contain !important;
        object-position: center !important;
        transform: none !important;
    }

    /* Fotoğraf üstündeki eski karartma katmanı kaldırıldı. */
    .event-feature-image::after {
        display: none !important;
    }

.event-feature:hover .event-feature-image img {
    transform: none !important;
}

/* İçerik de aynı yükseklikte kalsın. */
.event-feature-content {
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
}

/* ---------------------------------------------------------
   TABLET
   --------------------------------------------------------- */

@media (max-width: 1000px) {
    .events-slider,
    .events-track,
    .events-slide,
    .event-feature {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    .event-feature {
        grid-template-columns: 1fr !important;
    }

    .event-feature-image {
        height: 360px !important;
        min-height: 360px !important;
        max-height: 360px !important;
    }

        .event-feature-image img {
            width: auto !important;
            height: auto !important;
            max-width: 100% !important;
            max-height: 100% !important;
        }

    .event-feature-content {
        height: auto !important;
        overflow: visible !important;
    }
}

/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media (max-width: 600px) {
    .event-feature-image {
        height: 270px !important;
        min-height: 270px !important;
        max-height: 270px !important;
    }

    .event-feature-content {
        padding: 26px 22px !important;
    }

    .event-feature-main {
        padding: 22px 0 !important;
    }

        .event-feature-main h3 {
            font-size: 27px !important;
        }
}
/* =========================================================
   SON GELİŞMELER — SABİT KART + KIRPILMAYAN GÖRSEL
   ========================================================= */

/*
   Farklı fotoğraf oranları nedeniyle kartın bir slayttan diğerine
   uzayıp kısalmasını engelliyoruz.

   Masaüstünde:
   - Kart: sabit 535px
   - Görsel alanı: sabit 535px
   - Görsel: contain + doğal oran
   - Hiçbir fotoğraf kırpılmaz.
*/

.latest-slider {
    width: 100% !important;
    overflow: hidden !important;
}

.latest-track {
    display: flex !important;
    width: 100% !important;
    align-items: stretch !important;
}

.latest-slide {
    flex: 0 0 100% !important;
    width: 100% !important;
    min-width: 100% !important;
    height: 535px !important;
}

    .latest-slide .latest-feature {
        display: grid !important;
        grid-template-columns: minmax(0, .98fr) minmax(0, 1.02fr) !important;
        width: 100% !important;
        height: 535px !important;
        min-height: 535px !important;
        max-height: 535px !important;
        overflow: hidden !important;
        align-items: stretch !important;
    }

    .latest-slide .latest-image {
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        height: 535px !important;
        min-height: 535px !important;
        max-height: 535px !important;
        overflow: hidden !important;
        background: transparent !important;
        border: 0 !important;
    }

        .latest-slide .latest-image img {
            display: block !important;
            width: auto !important;
            height: auto !important;
            max-width: 100% !important;
            max-height: 100% !important;
            min-width: 0 !important;
            min-height: 0 !important;
            aspect-ratio: auto !important;
            object-fit: contain !important;
            object-position: center !important;
            transform: none !important;
        }

    .latest-slide .latest-feature:hover .latest-image img {
        transform: none !important;
    }

    .latest-slide .latest-image::after {
        display: none !important;
    }

    /* Sağ içerik de her slaytta aynı yüksekliği korur. */
    .latest-slide .latest-copy {
        height: 535px !important;
        min-height: 535px !important;
        max-height: 535px !important;
        overflow: hidden !important;
    }

/* ---------------------------------------------------------
   TABLET
   --------------------------------------------------------- */

@media (max-width: 900px) {
    .latest-slide {
        height: auto !important;
        min-height: 0 !important;
    }

        .latest-slide .latest-feature {
            display: grid !important;
            grid-template-columns: 1fr !important;
            height: auto !important;
            min-height: 0 !important;
            max-height: none !important;
        }

        .latest-slide .latest-image {
            height: 360px !important;
            min-height: 360px !important;
            max-height: 360px !important;
        }

            .latest-slide .latest-image img {
                width: auto !important;
                height: auto !important;
                max-width: 100% !important;
                max-height: 100% !important;
            }

        .latest-slide .latest-copy {
            height: auto !important;
            min-height: 0 !important;
            max-height: none !important;
            overflow: visible !important;
        }
}

/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media (max-width: 640px) {
    .latest-slide .latest-image {
        height: 280px !important;
        min-height: 280px !important;
        max-height: 280px !important;
    }

    .latest-slide .latest-copy {
        height: auto !important;
        min-height: 0 !important;
    }
}
/* =========================================================
   GÖRSELLERDEKİ SARI DAİRE / KARE BUTONLAR
   =========================================================
   Fotoğrafların üzerindeki dekoratif sarı ok butonları kaldırıldı.
   Metin içindeki normal oklar ve slider navigasyonları korunur.
*/

/* Ana sayfa — Son Gelişmeler */
.latest-image .image-arrow,
.latest-slide .latest-image .image-arrow {
    display: none !important;
}

/* Ana sayfa — Etkinlikler */
.event-feature-image .event-feature-arrow {
    display: none !important;
}

/* Etkinlikler liste sayfası */
.events-page-image .events-page-image-arrow {
    display: none !important;
}

/* Galeri kartlarının üzerindeki sarı ok */
.gallery-item::after {
    display: none !important;
}

/* =========================================================
   MISSIONS — ÜST BOŞLUK DÜZELTMESİ
   ========================================================= */

@media (min-width: 901px) {
    .missions-section.section-pad {
        padding-top: 64px;
    }
}


/* =========================================================
   HOME — ALTERNATING SECTION SURFACES
   =========================================================
   Sıralama:
   Gri → Beyaz → Gri → Beyaz → Gri → Beyaz → Gri
   Footer marka lacivertinde kalır.
   ========================================================= */

:root {
    --section-gray: #f4f6f8;
    --section-white: #ffffff;
}

/* 01 — HERO */
.hero-section {
    background: var(--section-gray) !important;
}

/* Hero açık zemine geçtiği için açık zemindeki içerik renkleri */
.hero-section {
    color: var(--text) !important;
}

    .hero-section .eyebrow {
        color: var(--gold-dark) !important;
    }

.hero-overline {
    color: var(--text-soft) !important;
}

.hero-section h1 {
    color: var(--navy-dark) !important;
}

    .hero-section h1 em {
        color: var(--gold) !important;
    }

.hero-lead {
    color: var(--text-soft) !important;
}

.hero-meta {
    border-top-color: var(--border) !important;
}

    .hero-meta > div + div {
        border-left-color: var(--border) !important;
    }

    .hero-meta strong {
        color: var(--navy) !important;
    }

    .hero-meta span {
        color: var(--text-muted) !important;
    }

.hero-section::before,
.hero-section::after,
.hero-glow,
.hero-glow-one,
.hero-glow-two {
    display: none !important;
}

/* 02 — SON GELİŞMELER */
.latest-section {
    background: var(--section-white) !important;
    border-top: 1px solid var(--border) !important;
}

/* 03 — HAKKIMDA */
.about-section {
    background: var(--section-gray) !important;
}

/* 04 — GÖREVLER / ÇALIŞMALAR */
.missions-section {
    background: var(--section-white) !important;
    border-top-color: var(--border) !important;
    border-bottom-color: var(--border) !important;
}

/* 05 — ETKİNLİKLER */
.events-section {
    background: var(--section-gray) !important;
}

/* 06 — GALERİ */
.gallery-preview {
    background: var(--section-white) !important;
}

/* 07 — SOSYAL MEDYA */
.social-section {
    background: var(--section-gray) !important;
}

/* 08 — İLETİŞİM */
.contact-section {
    background: var(--section-white) !important;
}

/* İç kartlar yüzeyden bağımsız olarak temiz beyaz kalsın */
.latest-feature,
.event-feature,
.mission-card,
.gallery-item,
.contact-form,
.latest-empty,
.events-empty {
    background: var(--section-white);
}

/* Gri bölümlerde görsel alanları ayrı bir tona kaymasın */
.about-image,
.mission-bottom img,
.event-feature-image,
.latest-image,
.gallery-item,
.social-card {
    background: var(--section-white);
}

/* Bölümler arasında ekstra renk/ton hissi oluşturabilecek
   dekoratif border geçişlerini sabitliyoruz. */
.latest-section,
.about-section,
.missions-section,
.events-section,
.gallery-preview,
.social-section,
.contact-section {
    background-image: none !important;
}

/* Mobilde de aynı yüzey sırası korunur */
@media (max-width: 900px) {
    .hero-section,
    .latest-section,
    .about-section,
    .missions-section,
    .events-section,
    .gallery-preview,
    .social-section,
    .contact-section {
        background-image: none !important;
    }
}


/* =========================================================
   FOOTER BRAND — VISIBILITY FIX
   ========================================================= */

.site-footer .footer-brand .brand {
    color: var(--white);
}

.site-footer .footer-brand .brand-copy {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 4px;
}

    .site-footer .footer-brand .brand-copy strong {
        display: block;
        margin: 0;
        padding: 0;
        color: var(--white) !important;
        font-family: "Manrope", sans-serif;
        font-size: 19px;
        font-weight: 800;
        line-height: 1.2;
        letter-spacing: .01em;
        white-space: nowrap;
    }

    .site-footer .footer-brand .brand-copy small {
        display: block;
        margin: 0;
        padding: 0;
        color: rgba(255, 255, 255, .68) !important;
        font-size: 12px;
        font-weight: 600;
        line-height: 1.45;
        letter-spacing: .01em;
        white-space: normal;
    }

@media (max-width: 480px) {
    .site-footer .footer-brand .brand-copy strong {
        font-size: 17px;
    }

    .site-footer .footer-brand .brand-copy small {
        font-size: 11px;
    }
}


/* =========================================================
   HEADER — PREMIUM UPGRADE
   ========================================================= */

.site-header {
    box-shadow: 0 8px 28px rgba(13, 43, 77, .045);
}

.header-accent {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient( 90deg, transparent 0%, var(--gold) 18%, var(--gold-light) 50%, var(--gold) 82%, transparent 100% );
    opacity: .9;
    pointer-events: none;
}

.site-header .brand {
    gap: 13px;
}

.site-header .brand-logo {
    position: relative;
    width: 82px;
    height: 46px;
    flex: 0 0 82px;
}

    .site-header .brand-logo img {
        width: 82px;
        height: 46px;
        object-fit: contain;
    }

.site-header .brand-divider {
    width: 1px;
    height: 32px;
    flex: 0 0 1px;
    background: var(--border);
}

.site-header .brand-copy {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 3px;
}

    .site-header .brand-copy strong {
        display: block;
        color: var(--navy-dark);
        font-size: 18px;
        font-weight: 800;
        letter-spacing: .005em;
        line-height: 1.15;
        white-space: nowrap;
    }

    .site-header .brand-copy small {
        display: flex;
        align-items: center;
        gap: 6px;
        color: var(--text-muted);
        font-size: 8px;
        font-weight: 800;
        letter-spacing: .14em;
        line-height: 1;
        white-space: nowrap;
    }

        .site-header .brand-copy small i {
            display: block;
            width: 3px;
            height: 3px;
            flex: 0 0 3px;
            border-radius: 50%;
            background: var(--gold);
        }

.site-header .primary-nav {
    gap: 5px;
    padding: 5px;
    background: rgba(241, 243, 245, .62);
    border: 1px solid rgba(225, 229, 233, .85);
    border-radius: 10px;
}

    .site-header .primary-nav > a:not(.nav-social) {
        position: relative;
        min-height: 40px;
        padding: 0 16px;
        color: var(--navy-dark) !important;
        border-radius: 7px;
        font-size: 14px !important;
        font-weight: 800;
        transition: color .25s ease, background .25s ease, transform .25s var(--ease);
    }

        .site-header .primary-nav > a:not(.nav-social)::after {
            right: 16px;
            bottom: 5px;
            left: 16px;
            height: 2px;
            border-radius: 10px;
            background: var(--gold);
        }

        .site-header .primary-nav > a:not(.nav-social):hover {
            color: var(--navy-dark) !important;
            background: var(--white);
            transform: translateY(-1px);
        }

        .site-header .primary-nav > a:not(.nav-social):focus-visible {
            background: var(--white);
        }

.site-header.is-scrolled {
    box-shadow: 0 10px 30px rgba(13, 43, 77, .075);
}

    .site-header.is-scrolled .header-inner {
        min-height: 70px;
    }

@media (max-width: 900px) {
    .site-header .primary-nav {
        padding: 8px;
        background: var(--white);
        border-radius: 10px;
    }

    .site-header .brand-divider,
    .site-header .brand-copy small {
        display: none;
    }
}

@media (max-width: 768px) {
    .site-header .brand {
        gap: 10px;
    }

    .site-header .brand-logo {
        width: 62px;
        height: 36px;
        flex-basis: 62px;
    }

        .site-header .brand-logo img {
            width: 62px;
            height: 36px;
        }

    .site-header .brand-copy strong {
        font-size: 14px;
    }
}

@media (max-width: 480px) {
    .site-header .brand {
        gap: 8px;
    }

    .site-header .brand-logo {
        width: 55px;
        height: 33px;
        flex-basis: 55px;
    }

        .site-header .brand-logo img {
            width: 55px;
            height: 33px;
        }

    .site-header .brand-copy strong {
        font-size: 12px;
    }
}


/* =========================================================
   CONTACT — SUBMIT BUTTON
   Mesajı Gönder butonu lacivert
   ========================================================= */

.contact-form .btn-gold {
    color: var(--white);
    background: var(--navy);
    border-color: var(--navy);
    box-shadow: var(--shadow-md);
}

    .contact-form .btn-gold:hover {
        color: var(--white);
        background: var(--navy-dark);
        border-color: var(--navy-dark);
        box-shadow: 0 20px 40px rgba(13, 43, 77, .20);
    }

    .contact-form .btn-gold:focus-visible {
        outline-color: rgba(210, 170, 39, .55);
    }


/* =========================================================
   FINAL RESPONSIVE / MOBILE OPTIMIZATION
   ========================================================= */

/* Genel taşma kontrolü */
html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

.container {
    width: min(calc(100% - 40px), var(--container));
}

/* ---------------------------------------------------------
   HEADER — MOBILE
   --------------------------------------------------------- */

@media (max-width: 900px) {

    .site-header .header-inner {
        min-height: 70px;
        height: 70px;
        gap: 16px;
    }

    .site-header .primary-nav {
        display: none;
    }

    .site-header .nav-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 44px;
    }

    .site-header .brand {
        min-width: 0;
        gap: 9px;
    }

    .site-header .brand-copy {
        min-width: 0;
    }

        .site-header .brand-copy strong {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
}

@media (max-width: 480px) {

    .container {
        width: calc(100% - 28px);
    }

    .site-header .header-inner {
        min-height: 64px;
        height: 64px;
        padding-inline: 0;
    }

    .site-header .brand {
        gap: 7px;
        max-width: calc(100% - 54px);
    }

    .site-header .brand-logo {
        width: 52px;
        height: 31px;
        flex-basis: 52px;
    }

        .site-header .brand-logo img {
            width: 52px;
            height: 31px;
        }

    .site-header .brand-copy strong {
        font-size: 12px !important;
    }

    .site-header .nav-toggle {
        width: 40px;
        height: 40px;
        flex-basis: 40px;
    }
}

/* ---------------------------------------------------------
   GLOBAL TYPOGRAPHY / SECTIONS
   --------------------------------------------------------- */

@media (max-width: 768px) {

    h2 {
        font-size: clamp(34px, 9vw, 48px);
    }

    .section-pad {
        padding-block: 58px;
    }

    .section-heading,
    .latest-heading,
    .gallery-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 18px;
        margin-bottom: 32px;
    }

    .section-kicker {
        margin-bottom: 14px;
        font-size: 10px;
    }

    .text-link {
        font-size: 13px;
    }
}

@media (max-width: 480px) {

    h2 {
        font-size: 34px;
    }

    .section-pad,
    .latest-section,
    .events-section,
    .gallery-preview,
    .social-section,
    .contact-section {
        padding-top: 50px;
        padding-bottom: 50px;
    }
}

/* ---------------------------------------------------------
   HERO — MOBILE
   --------------------------------------------------------- */

@media (max-width: 768px) {

    .hero-section {
        min-height: auto;
        padding: 108px 0 58px;
    }

    .hero-grid {
        grid-template-columns: 1fr;
        gap: 42px;
    }

    .hero-content {
        max-width: 100%;
    }

    .hero-section h1 {
        max-width: 100%;
        font-size: clamp(43px, 12vw, 66px);
        line-height: .94;
        letter-spacing: -.055em;
    }

    .hero-lead {
        max-width: 100%;
        margin-top: 22px;
        font-size: 14px;
        line-height: 1.75;
    }

    .hero-actions {
        width: 100%;
        margin-top: 26px;
    }

        .hero-actions .btn {
            min-height: 48px;
        }

    .hero-meta {
        width: 100%;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        margin-top: 34px;
    }

        .hero-meta > div {
            padding-right: 10px;
        }

            .hero-meta > div + div {
                padding-left: 10px;
            }

    .hero-portrait {
        width: min(100%, 480px);
        justify-self: center;
    }

    .portrait-frame {
        width: 100%;
        height: auto !important;
        min-height: 0 !important;
        aspect-ratio: auto !important;
        background: transparent;
        border: 0;
    }

        .portrait-frame img {
            width: 100% !important;
            height: auto !important;
            object-fit: contain !important;
        }
}

@media (max-width: 480px) {

    .hero-section {
        padding: 96px 0 48px;
    }

    .hero-grid {
        gap: 34px;
    }

    .hero-section .eyebrow {
        margin-bottom: 14px;
        font-size: 9px;
    }

    .hero-section h1 {
        font-size: 41px;
    }

    .hero-lead {
        font-size: 13px;
    }

    .hero-meta {
        margin-top: 28px;
    }

        .hero-meta strong {
            font-size: 9px;
        }

        .hero-meta span {
            font-size: 9px;
        }
}

/* ---------------------------------------------------------
   ABOUT — MOBILE
   --------------------------------------------------------- */

@media (max-width: 900px) {

    .about-grid {
        grid-template-columns: 1fr;
        gap: 42px;
    }

    .about-visual,
    .about-content {
        max-width: 100%;
    }

    .about-image {
        width: 100%;
        max-width: 560px;
        margin-inline: auto;
    }

    .about-content {
        max-width: 100%;
    }

    .experience-card {
        left: 14px;
        bottom: 18px;
        min-width: 185px;
        padding: 16px 18px;
    }
}

@media (max-width: 480px) {

    .about-grid {
        gap: 32px;
    }

    .about-content h2 {
        margin-bottom: 20px;
    }

    .about-content p {
        font-size: 14px;
        line-height: 1.8;
    }

    .about-content .lead-paragraph {
        font-size: 17px;
    }

    .experience-card {
        left: 8px;
        bottom: 10px;
        min-width: 165px;
        padding: 13px 15px;
    }

    .experience-number {
        font-size: 25px;
    }

    .experience-card strong {
        font-size: 11px;
    }

    .experience-card span:not(.experience-number) {
        font-size: 10px;
    }
}

/* ---------------------------------------------------------
   DUTIES / MISSIONS — MOBILE
   --------------------------------------------------------- */

@media (max-width: 900px) {

    .mission-grid {
        grid-template-columns: 1fr 1fr;
        gap: 0;
    }

    .mission-card {
        min-height: 220px;
        padding: 25px 22px;
    }

    .mission-icon {
        margin-bottom: 32px;
    }

    .mission-card h3 {
        max-width: none;
        font-size: 19px;
    }

    .mission-card p {
        font-size: 13px !important;
    }

    .mission-bottom {
        grid-template-columns: 1fr;
        gap: 32px;
        margin-top: 40px;
        padding-top: 34px;
    }

        .mission-bottom img {
            width: 100%;
            height: auto !important;
            object-fit: contain !important;
        }
}

@media (max-width: 600px) {

    .mission-grid {
        grid-template-columns: 1fr;
    }

    .mission-card {
        min-height: 0;
        padding: 24px 20px;
    }

    .mission-icon {
        margin-bottom: 28px;
    }

    .mission-number {
        top: 20px;
        right: 20px;
        font-size: 32px;
    }

    .mission-bottom {
        margin-top: 32px;
        padding-top: 28px;
    }

        .mission-bottom h3 {
            font-size: 31px;
        }

        .mission-bottom p {
            font-size: 14px !important;
        }
}

/* ---------------------------------------------------------
   EVENTS SLIDER — MOBILE
   --------------------------------------------------------- */

@media (max-width: 900px) {

    .events-slider {
        width: 100%;
        height: auto !important;
        min-height: 0 !important;
        overflow: hidden;
    }

    .events-track {
        height: auto !important;
        min-height: 0 !important;
    }

    .events-slide {
        height: auto !important;
        min-height: 0 !important;
    }

    .event-feature {
        width: 100%;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        grid-template-columns: 1fr !important;
    }

    .event-feature-image {
        width: 100%;
        height: 360px !important;
        min-height: 360px !important;
        max-height: 360px !important;
        background: transparent !important;
        border: 0 !important;
    }

        .event-feature-image img {
            width: auto !important;
            height: auto !important;
            max-width: 100% !important;
            max-height: 100% !important;
            object-fit: contain !important;
        }

    .event-feature-content {
        width: 100%;
        height: auto !important;
        min-height: 0 !important;
        padding: 30px 28px !important;
        overflow: visible !important;
    }

    .event-feature-main {
        padding: 24px 0 10px;
    }

        .event-feature-main h3 {
            max-width: 100%;
            font-size: clamp(25px, 6vw, 34px);
        }

        .event-feature-main p {
            max-width: 100%;
            font-size: 13px !important;
        }

    .events-slider-controls {
        flex-wrap: wrap;
        gap: 14px;
    }

    .events-slider-progress {
        width: 100%;
        order: 2;
    }

    .events-slider-navigation {
        width: 100%;
        justify-content: space-between;
    }
}

@media (max-width: 600px) {

    .event-feature-image {
        height: 270px !important;
        min-height: 270px !important;
        max-height: 270px !important;
    }

    .event-feature-content {
        padding: 24px 20px !important;
    }

    .event-feature-top {
        gap: 10px;
        padding-bottom: 14px;
    }

    .event-feature-date {
        font-size: 9px;
        letter-spacing: .11em;
    }

    .event-feature-counter {
        font-size: 18px;
    }

    .event-feature-main {
        padding: 20px 0 6px;
    }

        .event-feature-main h3 {
            font-size: 25px;
        }

        .event-feature-main p {
            font-size: 12px !important;
            line-height: 1.75 !important;
        }

    .events-slider-progress {
        display: none;
    }

    .events-slider-arrow {
        width: 40px;
        height: 40px;
    }
}

/* ---------------------------------------------------------
   SON GELİŞMELER — MOBILE
   --------------------------------------------------------- */

@media (max-width: 900px) {

    .latest-section {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .latest-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

        .latest-heading > .text-link {
            margin-bottom: 0;
        }

    .latest-slider,
    .latest-viewport {
        width: 100%;
        overflow: hidden;
    }

    .latest-slide {
        width: 100% !important;
        min-width: 100% !important;
        height: auto !important;
    }

        .latest-slide .latest-feature {
            width: 100% !important;
            height: auto !important;
            min-height: 0 !important;
            max-height: none !important;
            grid-template-columns: 1fr !important;
        }

        .latest-slide .latest-image {
            width: 100% !important;
            height: 360px !important;
            min-height: 360px !important;
            max-height: 360px !important;
            background: transparent !important;
            border: 0 !important;
        }

            .latest-slide .latest-image img {
                width: auto !important;
                height: auto !important;
                max-width: 100% !important;
                max-height: 100% !important;
                object-fit: contain !important;
            }

        .latest-slide .latest-copy {
            width: 100% !important;
            height: auto !important;
            min-height: 0 !important;
            max-height: none !important;
            padding: 32px 28px !important;
            overflow: visible !important;
        }

            .latest-slide .latest-copy h3 {
                max-width: 100%;
                font-size: clamp(25px, 6vw, 34px);
            }

            .latest-slide .latest-copy p {
                max-width: 100%;
                font-size: 13px;
                line-height: 1.75;
            }

    .latest-slider-controls {
        gap: 12px;
    }
}

@media (max-width: 600px) {

    .latest-section {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .latest-slide .latest-image {
        height: 280px !important;
        min-height: 280px !important;
        max-height: 280px !important;
    }

    .latest-slide .latest-copy {
        padding: 24px 20px 28px !important;
    }

        .latest-slide .latest-copy h3 {
            font-size: 24px;
        }

        .latest-slide .latest-copy p {
            font-size: 12px;
        }

    .latest-slider-controls {
        margin-top: 14px;
    }

    .latest-slider-arrow {
        width: 38px;
        height: 38px;
    }
}

/* ---------------------------------------------------------
   GALLERY — MOBILE
   --------------------------------------------------------- */

@media (max-width: 900px) {

    .gallery-grid {
        grid-template-columns: 1fr 1fr;
        gap: 12px;
    }

    .gallery-item {
        min-width: 0;
        height: auto !important;
        aspect-ratio: auto !important;
    }

        .gallery-item img {
            width: 100% !important;
            height: auto !important;
            object-fit: contain !important;
        }
}

@media (max-width: 600px) {

    .gallery-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }
}


/* ---------------------------------------------------------
   CONTACT — MOBILE
   --------------------------------------------------------- */

@media (max-width: 900px) {

    .contact-card {
        grid-template-columns: 1fr !important;
        width: 100%;
    }

    .contact-intro,
    .contact-form {
        padding: 34px 30px !important;
    }

    .contact-form-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 600px) {

    .contact-section {
        padding: 50px 0 56px !important;
    }

    .contact-card {
        border-radius: 8px;
    }

    .contact-intro,
    .contact-form {
        padding: 28px 20px !important;
    }

        .contact-intro h2 {
            font-size: 34px !important;
        }

    .contact-form-grid {
        grid-template-columns: 1fr !important;
        gap: 15px !important;
    }

    .contact-field-full {
        grid-column: auto !important;
    }

    .contact-form-footer {
        align-items: stretch !important;
        flex-direction: column !important;
        gap: 15px;
    }

        .contact-form-footer .btn {
            width: 100%;
        }
}

/* ---------------------------------------------------------
   FOOTER — MOBILE
   --------------------------------------------------------- */

@media (max-width: 900px) {

    .footer-top {
        grid-template-columns: 1fr 1fr;
        gap: 42px 30px;
        padding-top: 54px;
        padding-bottom: 42px;
    }

    .footer-brand {
        max-width: 100%;
        grid-column: 1 / -1;
    }
}

@media (max-width: 600px) {

    .footer-top {
        grid-template-columns: 1fr;
        gap: 30px;
        padding-top: 46px;
        padding-bottom: 36px;
    }

    .footer-brand {
        grid-column: auto;
    }

        .footer-brand p {
            font-size: 12px !important;
        }

    .footer-bottom {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
        padding-bottom: 24px;
    }
}

/* ---------------------------------------------------------
   INNER PAGES — MOBILE SAFETY
   --------------------------------------------------------- */

@media (max-width: 768px) {

    .events-page-grid {
        grid-template-columns: 1fr !important;
        gap: 20px;
    }

    .events-page-heading {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
    }

        .events-page-heading h1 {
            font-size: clamp(42px, 11vw, 60px);
        }

    .event-detail-page {
        padding-top: 105px;
    }

    .event-detail-image {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        aspect-ratio: auto !important;
    }

        .event-detail-image img {
            width: 100% !important;
            height: auto !important;
            object-fit: contain !important;
        }

    .event-detail-header,
    .event-detail-content {
        padding-left: 22px;
        padding-right: 22px;
    }

    .gallery-card-image {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

        .gallery-card-image img {
            width: 100% !important;
            height: auto !important;
            object-fit: contain !important;
        }
}

/* ---------------------------------------------------------
   VERY SMALL SCREENS
   --------------------------------------------------------- */

@media (max-width: 360px) {

    .container {
        width: calc(100% - 22px);
    }

    .hero-section h1 {
        font-size: 36px;
    }

    .hero-meta {
        gap: 4px;
    }

        .hero-meta > div,
        .hero-meta > div + div {
            padding-left: 6px;
            padding-right: 6px;
        }

    .latest-slide .latest-copy,
    .event-feature-content {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    .contact-intro,
    .contact-form {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
}

/* =========================================================
   HEADING EMPHASIS — NAVY
   Sarı vurgulu başlık ifadeleri başlık rengine alındı.
   ========================================================= */

.hero-section h1 em,
h1 em,
h2 em,
.about-content h2 em,
.mission-bottom h3 em,
.latest-heading h2 em,
.latest-copy h3 em,
.events-heading h2 em,
.event-feature-main h3 em {
    color: var(--navy) !important;
    font-style: normal;
}

/* İletişim paneli lacivert zemin üzerinde olduğu için
   okunabilirliği korur; vurgu artık sarı değildir. */
.contact-intro h2 em {
    color: var(--white) !important;
    font-style: normal;
}


/* =========================================================
   GALLERY INDEX — PREMIUM PAGE
   ========================================================= */

.gallery-page {
    position: relative;
    padding: 142px 0 120px;
    background: radial-gradient(circle at 88% 8%, rgba(210,170,39,.08), transparent 24%), linear-gradient(180deg, var(--off-white) 0%, var(--white) 72%);
    border-top: 1px solid var(--border);
}

    .gallery-page::before {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        background: linear-gradient(90deg, transparent 0, rgba(13,43,77,.035) 50%, transparent 100%);
        opacity: .55;
    }

    .gallery-page > .container {
        position: relative;
        z-index: 1;
    }

.gallery-page-heading {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(320px, .7fr);
    align-items: end;
    gap: 70px;
    margin-bottom: 52px;
}

    .gallery-page-heading .section-kicker {
        margin-bottom: 18px;
    }

    .gallery-page-heading h1 {
        max-width: 700px;
        margin: 0;
        color: var(--navy);
        font-family: "Manrope", sans-serif;
        font-size: clamp(52px, 6vw, 82px);
        font-weight: 800;
        line-height: .94;
        letter-spacing: -.065em;
    }

        .gallery-page-heading h1 em {
            color: var(--navy) !important;
            font-style: normal;
        }

    .gallery-page-heading > p {
        max-width: 560px;
        margin: 0 0 5px auto;
        padding-left: 30px;
        color: var(--text-soft);
        font-size: 16px;
        line-height: 1.85;
        border-left: 2px solid var(--gold);
    }

.gallery-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 28px;
}

.gallery-card {
    position: relative;
    display: flex;
    min-width: 0;
    flex-direction: column;
    overflow: hidden;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 16px;
    box-shadow: 0 16px 45px rgba(6,25,47,.06);
    transition: transform .35s var(--ease), border-color .3s ease, box-shadow .35s ease;
}

    .gallery-card:hover {
        transform: translateY(-6px);
        border-color: rgba(210,170,39,.42);
        box-shadow: 0 24px 60px rgba(6,25,47,.11);
    }

.gallery-card-image {
    position: relative;
    display: block;
    width: 100%;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: hidden;
    background: var(--surface);
}

    .gallery-card-image img {
        display: block;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        object-fit: contain !important;
        object-position: center;
        transition: transform .55s var(--ease);
    }

.gallery-card:hover .gallery-card-image img {
    transform: scale(1.018);
}

.gallery-card-overlay {
    position: absolute;
    right: 18px;
    bottom: 18px;
    left: 18px;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    padding: 12px 13px 12px 16px;
    color: var(--white);
    background: rgba(6,25,47,.90);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 8px;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity .3s ease, transform .3s var(--ease);
    backdrop-filter: blur(10px);
}

.gallery-card:hover .gallery-card-overlay,
.gallery-card-image:focus-visible .gallery-card-overlay {
    opacity: 1;
    transform: translateY(0);
}

.gallery-card-overlay > span {
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .14em;
}

.gallery-card-overlay b {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    color: var(--navy);
    background: var(--gold);
    border-radius: 50%;
    font-size: 13px;
}

.gallery-card-content {
    display: flex;
    flex-direction: column;
    padding: 25px 27px 28px;
}

.gallery-card-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 14px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--border);
    color: var(--text-muted);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
}

    .gallery-card-meta span:last-child {
        color: var(--gold-dark);
    }

.gallery-card-content h2 {
    margin: 0 0 12px;
    color: var(--navy);
    font-size: clamp(24px, 2.2vw, 32px);
    line-height: 1.1;
}

    .gallery-card-content h2 a {
        transition: color .25s ease;
    }

        .gallery-card-content h2 a:hover {
            color: var(--gold-dark);
        }

.gallery-card-content p {
    max-width: 650px;
    margin-bottom: 20px;
    color: var(--text-soft);
    font-size: 13px;
    line-height: 1.78;
}

.gallery-card-content .text-link {
    align-self: flex-start;
    margin-top: auto;
}

.gallery-card-placeholder {
    display: grid;
    place-items: center;
    min-height: 280px;
    background: linear-gradient(135deg, rgba(13,43,77,.04), rgba(210,170,39,.08)), var(--off-white);
}

    .gallery-card-placeholder span {
        display: grid;
        place-items: center;
        width: 74px;
        height: 74px;
        color: var(--navy);
        border: 1px solid rgba(13,43,77,.12);
        border-radius: 50%;
        font-family: "Manrope", sans-serif;
        font-size: 20px;
        font-weight: 800;
        letter-spacing: .04em;
    }

.gallery-empty {
    position: relative;
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    align-items: center;
    gap: 55px;
    min-height: 360px;
    padding: 58px 70px;
    overflow: hidden;
    text-align: left;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 18px;
    box-shadow: 0 20px 55px rgba(6,25,47,.07);
}

    .gallery-empty::before {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        width: 42%;
        height: 100%;
        pointer-events: none;
        background: radial-gradient(circle at 70% 50%, rgba(210,170,39,.11), transparent 58%);
    }

    .gallery-empty::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 5px;
        height: 100%;
        background: var(--gold);
    }

.gallery-empty-number {
    position: relative;
    z-index: 1;
    color: rgba(13,43,77,.10);
    font-family: "Manrope", sans-serif;
    font-size: 88px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -.07em;
}

.gallery-empty > div {
    position: relative;
    z-index: 1;
}

.gallery-empty .section-kicker {
    margin-bottom: 16px;
}

.gallery-empty h2 {
    max-width: 700px;
    margin: 0 0 14px;
    font-size: clamp(38px, 4.4vw, 62px);
    line-height: .98;
}

    .gallery-empty h2 em {
        color: var(--navy) !important;
        font-style: normal;
    }

.gallery-empty p {
    max-width: 620px;
    color: var(--text-soft);
    font-size: 15px;
    line-height: 1.8;
}

/* =========================================================
   GALLERY INDEX — RESPONSIVE
   ========================================================= */

@media (max-width: 1000px) {

    .gallery-page {
        padding: 125px 0 90px;
    }

    .gallery-page-heading {
        grid-template-columns: 1fr;
        gap: 25px;
        margin-bottom: 40px;
    }

        .gallery-page-heading > p {
            margin-left: 0;
            padding-left: 22px;
        }

    .gallery-empty {
        grid-template-columns: 85px minmax(0, 1fr);
        gap: 32px;
        padding: 48px;
    }
}

@media (max-width: 700px) {

    .gallery-page {
        padding: 105px 0 65px;
    }

    .gallery-page-heading {
        gap: 18px;
        margin-bottom: 30px;
    }

        .gallery-page-heading h1 {
            font-size: clamp(42px, 12vw, 60px);
        }

        .gallery-page-heading > p {
            padding-left: 16px;
            font-size: 14px;
            line-height: 1.7;
        }

    .gallery-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .gallery-card {
        border-radius: 12px;
    }

    .gallery-card-overlay {
        right: 12px;
        bottom: 12px;
        left: 12px;
        opacity: 1;
        transform: none;
    }

    .gallery-card-content {
        padding: 21px 20px 23px;
    }

        .gallery-card-content h2 {
            font-size: 25px;
        }

    .gallery-empty {
        grid-template-columns: 1fr;
        gap: 18px;
        min-height: 0;
        padding: 40px 28px 42px;
        border-radius: 12px;
    }

    .gallery-empty-number {
        font-size: 54px;
    }

    .gallery-empty h2 {
        font-size: clamp(34px, 9vw, 48px);
    }
}

@media (max-width: 420px) {

    .gallery-page {
        padding-top: 94px;
    }

    .gallery-page-heading h1 {
        font-size: 40px;
    }

    .gallery-card-meta {
        align-items: flex-start;
        flex-direction: column;
        gap: 6px;
    }

    .gallery-card-overlay > span {
        font-size: 9px;
    }

    .gallery-empty {
        padding-inline: 22px;
    }
}


/* GALLERY NAV — ACTIVE PAGE */
.primary-nav > a.is-active {
    color: var(--navy);
    background: rgba(13,43,77,.045);
    border-radius: 7px;
}

    .primary-nav > a.is-active::after {
        transform: scaleX(1);
    }

/* =========================================================
   FINAL OVERRIDES — HERO / HEADER SOCIAL
   ========================================================= */

/* Hero: Hakkımda butonu artık lacivert */
.hero-actions .btn-gold {
    color: var(--white) !important;
    background: var(--navy) !important;
    border-color: var(--navy) !important;
    box-shadow: var(--shadow-md);
}

    .hero-actions .btn-gold:hover {
        color: var(--white) !important;
        background: var(--navy-dark) !important;
        border-color: var(--navy-dark) !important;
        box-shadow: 0 20px 40px rgba(13, 43, 77, .20);
    }

/* Hero altındaki DENİZCİLİK / TİCARET / LOJİSTİK bilgileri */
.hero-meta strong {
    color: var(--navy) !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    letter-spacing: .12em;
}

.hero-meta span {
    color: var(--text-soft) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
}

/* Topbar sosyal medya alanı */
.site-header .primary-nav .nav-social {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    margin-left: 3px;
    padding: 0;
    color: var(--navy);
    background: transparent;
    border: 1px solid var(--border);
    border-radius: 7px;
    font-size: 15px;
    line-height: 1;
    transition: color .25s ease, background .25s ease, border-color .25s ease, transform .25s var(--ease);
}

    .site-header .primary-nav .nav-social i {
        display: block;
        line-height: 1;
    }

    .site-header .primary-nav .nav-social:hover {
        color: var(--navy);
        background: var(--gold);
        border-color: var(--gold);
        transform: translateY(-1px);
    }

    /* Sosyal ikonların altındaki menü çizgisini kapat */
    .site-header .primary-nav .nav-social::after {
        display: none !important;
    }

/* Mobil menüde sosyal medya */
@media (max-width: 900px) {

    .site-header .primary-nav.is-open .nav-social,
    .site-header .primary-nav.show .nav-social {
        display: inline-flex;
    }

    .site-header .primary-nav .nav-social {
        width: 40px;
        height: 40px;
        margin: 5px 0 0;
    }
}

@media (max-width: 480px) {

    .hero-meta {
        width: 100%;
        margin-top: 30px;
    }

        .hero-meta > div {
            padding-right: 10px;
        }

            .hero-meta > div + div {
                padding-left: 10px;
            }

        .hero-meta strong {
            font-size: 10px !important;
            letter-spacing: .08em;
        }

        .hero-meta span {
            font-size: 10px !important;
        }
}

/* =========================================================
   SOCIAL MEDIA — PREMIUM SOCIAL HUB
   ========================================================= */

.social-section {
    position: relative;
    overflow: hidden;
    padding-block: 112px;
    background: radial-gradient(circle at 8% 50%, rgba(13, 43, 77, .035), transparent 34%), radial-gradient(circle at 96% 5%, rgba(210, 170, 39, .055), transparent 28%), var(--off-white);
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}

    .social-section::before {
        content: "";
        position: absolute;
        top: -260px;
        right: -190px;
        width: 620px;
        height: 620px;
        border: 1px solid rgba(210, 170, 39, .10);
        border-radius: 50%;
        box-shadow: 0 0 0 70px rgba(210, 170, 39, .022), 0 0 0 140px rgba(210, 170, 39, .014);
        pointer-events: none;
    }

    .social-section::after {
        content: "";
        position: absolute;
        left: -300px;
        bottom: -360px;
        width: 680px;
        height: 680px;
        border-radius: 50%;
        background: radial-gradient( circle, rgba(13, 43, 77, .055) 0%, rgba(13, 43, 77, 0) 68% );
        pointer-events: none;
    }

    .social-section > .container {
        position: relative;
        z-index: 1;
    }


/* =========================================================
   SOCIAL LAYOUT
   LEFT: TEXT
   RIGHT: 4 SOCIAL CARDS
   ========================================================= */

.social-layout {
    display: grid;
    grid-template-columns: minmax(330px, .72fr) minmax(600px, 1.28fr);
    align-items: center;
    gap: clamp(55px, 7vw, 105px);
}


/* =========================================================
   HEADER — LEFT COLUMN
   ========================================================= */

.social-header {
    display: block;
    margin: 0;
}

.social-header-copy {
    max-width: 560px;
}

    .social-header-copy .section-kicker {
        margin-bottom: 21px;
    }

    .social-header-copy h2 {
        max-width: 540px;
        margin: 0 0 25px;
        color: var(--navy);
        font-size: clamp(45px, 4.4vw, 66px);
        line-height: .98;
        letter-spacing: -.058em;
    }

        .social-header-copy h2 em {
            color: var(--gold);
            font-style: normal;
        }

    .social-header-copy p {
        max-width: 535px;
        color: var(--text-soft);
        font-size: 15px;
        line-height: 1.85;
    }

.social-header-note {
    max-width: 320px;
    margin-top: 42px;
    padding: 18px 0 18px 22px;
    border-left: 2px solid var(--gold);
}

    .social-header-note span,
    .social-header-note strong {
        display: block;
    }

    .social-header-note span {
        margin-bottom: 6px;
        color: var(--text-muted);
        font-size: 10px;
        font-weight: 900;
        letter-spacing: .16em;
    }

    .social-header-note strong {
        color: var(--navy);
        font-family: "Manrope", sans-serif;
        font-size: 21px;
        font-weight: 800;
        line-height: 1.25;
    }


/* =========================================================
   SOCIAL GRID — RIGHT COLUMN
   ========================================================= */

.social-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    width: 100%;
}


/* =========================================================
   SOCIAL PLATFORM CARD
   ========================================================= */

.social-platform-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 275px;
    padding: 25px 27px;
    overflow: hidden;
    isolation: isolate;
    color: var(--navy);
    background: rgba(255, 255, 255, .96);
    border: 1px solid var(--border);
    border-radius: 15px;
    box-shadow: 0 15px 38px rgba(13, 43, 77, .055);
    transition: transform .4s var(--ease), border-color .3s ease, box-shadow .4s ease, background .3s ease;
}

    .social-platform-card::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: -1;
        background: radial-gradient( circle at 100% 0%, rgba(210, 170, 39, .105), transparent 43% );
        pointer-events: none;
    }

    .social-platform-card::after {
        content: "";
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 3px;
        background: var(--gold);
        transform: scaleX(0);
        transform-origin: left;
        transition: transform .4s var(--ease);
    }

    .social-platform-card:hover {
        transform: translateY(-6px);
        border-color: rgba(210, 170, 39, .42);
        box-shadow: 0 24px 55px rgba(13, 43, 77, .11);
    }

        .social-platform-card:hover::after {
            transform: scaleX(1);
        }


/* =========================================================
   CARD TOP
   ========================================================= */

.social-card-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 36px;
}

.social-platform-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    color: var(--navy);
    background: rgba(210, 170, 39, .085);
    border: 1px solid rgba(210, 170, 39, .22);
    border-radius: 12px;
    font-size: 20px;
    transition: color .3s ease, background .3s ease, border-color .3s ease, transform .35s var(--ease);
}

.social-card-number {
    color: rgba(13, 43, 77, .19);
    font-family: "Manrope", sans-serif;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .08em;
}

.social-platform-card:hover .social-platform-icon {
    color: var(--white);
    background: var(--gold);
    border-color: var(--gold);
    transform: translateY(-2px);
}


/* =========================================================
   CARD CONTENT
   ========================================================= */

.social-platform-content {
    flex: 1;
}

.social-platform-kicker {
    display: block;
    margin-bottom: 7px;
    color: var(--gold-dark);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .17em;
    line-height: 1.3;
    text-transform: uppercase;
}

.social-platform-content h3 {
    margin: 0 0 10px;
    color: var(--navy);
    font-family: "Manrope", sans-serif;
    font-size: 26px;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -.035em;
}

.social-platform-content p {
    max-width: 410px;
    color: var(--text-soft);
    font-size: 12.5px;
    line-height: 1.72;
}


/* =========================================================
   CARD FOOTER
   ========================================================= */

.social-platform-footer {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 27px;
    padding-top: 16px;
    border-top: 1px solid var(--border);
}

    .social-platform-footer strong {
        color: var(--navy);
        font-size: 11.5px;
        font-weight: 800;
    }

    .social-platform-footer span {
        color: var(--text-muted);
        font-size: 10.5px;
        font-weight: 500;
    }

    .social-platform-footer i {
        margin-left: auto;
        color: var(--gold-dark);
        font-size: 12px;
        transition: color .25s ease, transform .3s var(--ease);
    }

.social-platform-card:hover .social-platform-footer i {
    color: var(--gold);
    transform: translate(2px, -2px);
}


/* =========================================================
   PLATFORM VARIANTS
   ========================================================= */

.social-platform-instagram .social-platform-icon,
.social-platform-facebook .social-platform-icon,
.social-platform-x .social-platform-icon,
.social-platform-linkedin .social-platform-icon {
    color: var(--navy);
}


/* =========================================================
   RESPONSIVE — TABLET
   ========================================================= */

@media (max-width: 1100px) {

    .social-layout {
        grid-template-columns: minmax(280px, .68fr) minmax(500px, 1.32fr);
        gap: 45px;
    }

    .social-header-copy h2 {
        font-size: clamp(40px, 5vw, 56px);
    }

    .social-platform-card {
        min-height: 255px;
        padding: 23px;
    }
}


/* =========================================================
   RESPONSIVE — SMALL TABLET
   ========================================================= */

@media (max-width: 900px) {

    .social-section {
        padding-block: 85px;
    }

    .social-layout {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .social-header-copy,
    .social-header-copy h2,
    .social-header-copy p {
        max-width: 720px;
    }

    .social-header-note {
        margin-top: 30px;
    }

    .social-grid {
        max-width: 760px;
    }
}


/* =========================================================
   RESPONSIVE — MOBILE
   ========================================================= */

@media (max-width: 640px) {

    .social-section {
        padding-block: 68px;
    }

    .social-layout {
        gap: 38px;
    }

    .social-header-copy h2 {
        font-size: 41px;
    }

    .social-header-copy p {
        font-size: 14px;
        line-height: 1.78;
    }

    .social-header-note {
        margin-top: 27px;
        padding-left: 17px;
    }

        .social-header-note strong {
            font-size: 19px;
        }

    .social-grid {
        grid-template-columns: 1fr 1fr;
        gap: 11px;
    }

    .social-platform-card {
        min-height: 245px;
        padding: 19px;
        border-radius: 13px;
    }

    .social-card-top {
        margin-bottom: 28px;
    }

    .social-platform-icon {
        width: 42px;
        height: 42px;
        font-size: 18px;
    }

    .social-platform-content h3 {
        font-size: 22px;
    }

    .social-platform-content p {
        font-size: 11.5px;
        line-height: 1.65;
    }

    .social-platform-footer {
        margin-top: 20px;
    }

        .social-platform-footer strong {
            font-size: 10.5px;
        }

        .social-platform-footer span {
            font-size: 9.5px;
        }
}


/* =========================================================
   RESPONSIVE — NARROW MOBILE
   ========================================================= */

@media (max-width: 470px) {

    .social-section {
        padding-block: 58px;
    }

    .social-header-copy h2 {
        font-size: 36px;
    }

    .social-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .social-platform-card {
        min-height: 230px;
    }

    .social-platform-content p {
        max-width: 440px;
        font-size: 12px;
    }

    .social-platform-footer strong {
        font-size: 11px;
    }

    .social-platform-footer span {
        font-size: 10px;
    }
}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .social-platform-card,
    .social-platform-icon,
    .social-platform-footer i {
        transition: none;
    }
}


/* =========================================================
   FINAL FIX — MOBILE NAV MENU
   ========================================================= */

@media (max-width: 900px) {

    .site-header .header-inner {
        position: relative;
    }

    .site-header .primary-nav {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        display: none;
        flex-direction: column;
        align-items: stretch;
        width: 100%;
        padding: 10px;
        background: var(--white);
        border: 1px solid var(--border);
        border-top: 0;
        border-radius: 0 0 12px 12px;
        box-shadow: 0 18px 40px rgba(13, 43, 77, .12);
        z-index: 1200;
    }

        .site-header .primary-nav.is-open {
            display: flex;
        }

        .site-header .primary-nav > a:not(.nav-social) {
            display: flex;
            align-items: center;
            width: 100%;
            min-height: 48px;
            padding: 0 16px;
            color: var(--navy-dark) !important;
            background: transparent;
            border-radius: 7px;
            font-size: 15px !important;
            font-weight: 800;
        }

            .site-header .primary-nav > a:not(.nav-social):hover {
                background: var(--surface);
                transform: none;
            }

            .site-header .primary-nav > a:not(.nav-social)::after {
                right: 16px;
                left: 16px;
                bottom: 5px;
            }

        .site-header .primary-nav .nav-social {
            width: 40px;
            height: 40px;
            margin: 5px 0 0;
        }
}

@media (max-width: 480px) {

    .site-header .primary-nav {
        width: 100%;
    }
}


/* =========================================================
   FINAL POLISH — MOBILE NAVIGATION
   ========================================================= */

@media (max-width: 900px) {

    .site-header .primary-nav {
        top: calc(100% + 1px);
        display: none;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        align-items: center;
        gap: 2px;
        padding: 8px;
        background: rgba(255, 255, 255, .98);
        border: 1px solid var(--border);
        border-top: 0;
        border-radius: 0 0 14px 14px;
        box-shadow: 0 18px 45px rgba(13, 43, 77, .14);
        -webkit-backdrop-filter: blur(12px);
        backdrop-filter: blur(12px);
    }

        .site-header .primary-nav.is-open {
            display: grid;
        }

        /* Menü linkleri tek sütun, kompakt ve dengeli */
        .site-header .primary-nav > a:not(.nav-social) {
            grid-column: 1 / -1;
            display: flex;
            align-items: center;
            min-height: 44px;
            width: 100%;
            padding: 0 14px;
            color: var(--navy-dark) !important;
            background: transparent;
            border-radius: 8px;
            font-size: 15px !important;
            font-weight: 800;
            line-height: 1.2;
        }

            .site-header .primary-nav > a:not(.nav-social):hover,
            .site-header .primary-nav > a:not(.nav-social):focus-visible {
                background: var(--surface);
                transform: none;
            }

            .site-header .primary-nav > a:not(.nav-social)::after {
                right: 14px;
                bottom: 4px;
                left: 14px;
                height: 2px;
            }

        /* Aktif sayfa */
        .site-header .primary-nav > a.is-active {
            color: var(--navy-dark) !important;
            background: rgba(13, 43, 77, .045);
        }

        /* Sosyal medya ikonları: tek yatay sıra */
        .site-header .primary-nav .nav-social {
            grid-column: auto;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            justify-self: center;
            width: 40px;
            height: 40px;
            margin: 6px 0 2px;
            padding: 0;
            color: var(--navy);
            background: var(--white);
            border: 1px solid var(--border);
            border-radius: 8px;
            font-size: 16px;
        }

            .site-header .primary-nav .nav-social:hover {
                color: var(--navy);
                background: var(--gold);
                border-color: var(--gold);
                transform: translateY(-1px);
            }

            .site-header .primary-nav .nav-social i {
                line-height: 1;
            }
}

@media (max-width: 480px) {

    .site-header .primary-nav {
        padding: 7px;
        border-radius: 0 0 12px 12px;
    }

        .site-header .primary-nav > a:not(.nav-social) {
            min-height: 42px;
            padding-inline: 12px;
            font-size: 14px !important;
        }

        .site-header .primary-nav .nav-social {
            width: 38px;
            height: 38px;
            margin-top: 5px;
            font-size: 15px;
        }
}


/* =========================================================
   GALLERY DETAIL — PREMIUM EDITORIAL
   ========================================================= */

.gallery-detail-page {
    position: relative;
    padding: 128px 0 125px;
    overflow: hidden;
    background: radial-gradient( circle at 88% 8%, rgba(210, 170, 39, .075), transparent 25% ), linear-gradient( 180deg, var(--off-white) 0%, var(--white) 48%, var(--off-white) 100% );
    border-top: 1px solid var(--border);
}

    .gallery-detail-page::before {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        background: linear-gradient( 90deg, transparent 0, rgba(13, 43, 77, .025) 50%, transparent 100% );
    }

    .gallery-detail-page > .container {
        position: relative;
        z-index: 1;
    }


/* =========================================================
   TOP
   ========================================================= */

.gallery-detail-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 58px;
}

.gallery-back {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    color: var(--navy);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .03em;
    transition: color .25s ease, gap .3s var(--ease);
}

.gallery-back-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    color: var(--navy);
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 8px;
    font-size: 11px;
    transition: color .25s ease, background .25s ease, border-color .25s ease, transform .3s var(--ease);
}

.gallery-back:hover {
    color: var(--gold-dark);
    gap: 14px;
}

    .gallery-back:hover .gallery-back-icon {
        color: var(--white);
        background: var(--gold);
        border-color: var(--gold);
        transform: translateX(-2px);
    }

.gallery-detail-label {
    color: var(--text-muted);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .16em;
    text-transform: uppercase;
}


/* =========================================================
   HEADING
   ========================================================= */

.gallery-detail-heading {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(350px, .72fr);
    align-items: end;
    gap: 80px;
    margin-bottom: 62px;
}

.gallery-detail-heading-main {
    min-width: 0;
}

    .gallery-detail-heading-main .section-kicker {
        margin-bottom: 19px;
    }

    .gallery-detail-heading-main h1 {
        max-width: 820px;
        margin: 0;
        color: var(--navy);
        font-family: "Manrope", sans-serif;
        font-size: clamp(50px, 6.5vw, 88px);
        font-weight: 800;
        line-height: .94;
        letter-spacing: -.065em;
    }


/* =========================================================
   HEADING SIDE
   ========================================================= */

.gallery-detail-heading-side {
    padding-bottom: 5px;
}

.gallery-detail-meta {
    display: flex;
    align-items: stretch;
    gap: 0;
    margin-bottom: 28px;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}

.gallery-detail-meta-item {
    flex: 1;
    min-width: 0;
    padding: 18px 22px 17px 0;
}

    .gallery-detail-meta-item + .gallery-detail-meta-item {
        padding-left: 22px;
        border-left: 1px solid var(--border);
    }

    .gallery-detail-meta-item span {
        display: block;
        margin-bottom: 7px;
        color: var(--text-muted);
        font-size: 9px;
        font-weight: 900;
        letter-spacing: .16em;
        line-height: 1.3;
    }

    .gallery-detail-meta-item strong {
        display: block;
        color: var(--navy);
        font-family: "Manrope", sans-serif;
        font-size: 16px;
        font-weight: 800;
        line-height: 1.35;
    }

        .gallery-detail-meta-item strong small {
            margin-left: 4px;
            color: var(--gold-dark);
            font-family: "DM Sans", sans-serif;
            font-size: 9px;
            font-weight: 900;
            letter-spacing: .10em;
        }

.gallery-detail-description {
    max-width: 590px;
    padding-left: 22px;
    color: var(--text-soft);
    font-size: 14px;
    line-height: 1.85;
    border-left: 2px solid var(--gold);
}


/* =========================================================
   IMAGE GRID
   3 PHOTOS PER ROW
   ========================================================= */

.gallery-detail-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: start;
    gap: 18px;
}


/* =========================================================
   IMAGE ITEM
   ========================================================= */

.gallery-detail-item {
    position: relative;
    display: block;
    min-width: 0;
    align-self: start;
    overflow: hidden;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 15px;
    box-shadow: 0 14px 38px rgba(6, 25, 47, .055);
    isolation: isolate;
    transition: transform .4s var(--ease), border-color .3s ease, box-shadow .4s ease;
}

/*
   All photos have the same column width.
   The image itself keeps its natural ratio, so there is
   no gray/empty area around portrait or landscape photos.
*/

.gallery-detail-image {
    position: relative;
    width: 100%;
    overflow: hidden;
    background: transparent;
}

    .gallery-detail-image img {
        display: block;
        width: 100%;
        height: auto;
        min-width: 0;
        max-width: 100%;
        object-fit: contain;
        object-position: center;
        background: transparent;
        transition: transform .65s var(--ease), filter .4s ease;
    }

.gallery-detail-item:hover {
    transform: translateY(-5px);
    border-color: rgba(210, 170, 39, .42);
    box-shadow: 0 25px 60px rgba(6, 25, 47, .12);
}

    .gallery-detail-item:hover .gallery-detail-image img {
        transform: scale(1.025);
    }


/* =========================================================
   NUMBER
   ========================================================= */

.gallery-detail-number {
    position: absolute;
    top: 14px;
    left: 14px;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 39px;
    height: 30px;
    padding: 0 9px;
    color: var(--white);
    background: rgba(6, 25, 47, .88);
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 7px;
    font-family: "Manrope", sans-serif;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .08em;
    backdrop-filter: blur(8px);
}


/* =========================================================
   OPEN ICON
   ========================================================= */

.gallery-detail-image-arrow {
    position: absolute;
    right: 14px;
    bottom: 14px;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    color: var(--navy);
    background: var(--gold);
    border-radius: 50%;
    font-size: 12px;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity .3s ease, transform .35s var(--ease), background .25s ease;
}

.gallery-detail-item:hover .gallery-detail-image-arrow,
.gallery-detail-item:focus-visible .gallery-detail-image-arrow {
    opacity: 1;
    transform: translateY(0);
}

.gallery-detail-item:hover .gallery-detail-image-arrow {
    background: var(--gold-light);
}


/* =========================================================
   EMPTY STATE
   ========================================================= */

.gallery-detail-empty {
    position: relative;
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    align-items: center;
    gap: 55px;
    min-height: 360px;
    padding: 58px 70px;
    overflow: hidden;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 18px;
    box-shadow: 0 20px 55px rgba(6, 25, 47, .07);
}

    .gallery-detail-empty::before {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        width: 42%;
        height: 100%;
        pointer-events: none;
        background: radial-gradient( circle at 70% 50%, rgba(210, 170, 39, .11), transparent 58% );
    }

    .gallery-detail-empty::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 5px;
        height: 100%;
        background: var(--gold);
    }

.gallery-detail-empty-number {
    position: relative;
    z-index: 1;
    color: rgba(13, 43, 77, .10);
    font-family: "Manrope", sans-serif;
    font-size: 88px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -.07em;
}

.gallery-detail-empty > div:last-child {
    position: relative;
    z-index: 1;
}

.gallery-detail-empty h2 {
    max-width: 700px;
    margin: 0 0 14px;
    font-size: clamp(38px, 4.4vw, 62px);
    line-height: .98;
}

    .gallery-detail-empty h2 em {
        color: var(--navy) !important;
        font-style: normal;
    }

.gallery-detail-empty p {
    max-width: 620px;
    margin-bottom: 25px;
    color: var(--text-soft);
    font-size: 14px;
    line-height: 1.8;
}


/* =========================================================
   RESPONSIVE — TABLET
   ========================================================= */

@media (max-width: 1000px) {

    .gallery-detail-page {
        padding: 120px 0 90px;
    }

    .gallery-detail-heading {
        grid-template-columns: 1fr;
        gap: 35px;
        margin-bottom: 45px;
    }

    .gallery-detail-heading-main h1 {
        max-width: 850px;
    }

    .gallery-detail-heading-side {
        max-width: 720px;
    }

    .gallery-detail-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .gallery-detail-empty {
        grid-template-columns: 85px minmax(0, 1fr);
        gap: 32px;
        padding: 48px;
    }
}


/* =========================================================
   RESPONSIVE — MOBILE
   ========================================================= */

@media (max-width: 700px) {

    .gallery-detail-page {
        padding: 104px 0 65px;
    }

    .gallery-detail-top {
        align-items: flex-start;
        flex-direction: column;
        gap: 17px;
        margin-bottom: 38px;
    }

    .gallery-detail-label {
        display: none;
    }

    .gallery-detail-heading {
        gap: 28px;
        margin-bottom: 35px;
    }

    .gallery-detail-heading-main h1 {
        font-size: clamp(42px, 11vw, 60px);
        line-height: .96;
    }

    .gallery-detail-meta {
        margin-bottom: 23px;
    }

    .gallery-detail-meta-item {
        padding: 15px 15px 15px 0;
    }

        .gallery-detail-meta-item + .gallery-detail-meta-item {
            padding-left: 15px;
        }

        .gallery-detail-meta-item strong {
            font-size: 14px;
        }

    .gallery-detail-description {
        padding-left: 16px;
        font-size: 13px;
        line-height: 1.75;
    }

    .gallery-detail-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .gallery-detail-item,
    .gallery-detail-item--featured {
        grid-column: 1;
        border-radius: 12px;
    }

        .gallery-detail-image,
        .gallery-detail-item--featured .gallery-detail-image {
            aspect-ratio: auto;
        }

            .gallery-detail-image img {
                height: auto;
            }

    .gallery-detail-image-arrow {
        opacity: 1;
        transform: none;
        right: 11px;
        bottom: 11px;
        width: 34px;
        height: 34px;
    }

    .gallery-detail-number {
        top: 11px;
        left: 11px;
        min-width: 36px;
        height: 28px;
    }

    .gallery-detail-empty {
        grid-template-columns: 1fr;
        gap: 18px;
        min-height: 0;
        padding: 40px 28px 42px;
        border-radius: 12px;
    }

    .gallery-detail-empty-number {
        font-size: 54px;
    }

    .gallery-detail-empty h2 {
        font-size: clamp(34px, 9vw, 48px);
    }
}


/* =========================================================
   RESPONSIVE — NARROW MOBILE
   ========================================================= */

@media (max-width: 420px) {

    .gallery-detail-page {
        padding-top: 94px;
    }

    .gallery-detail-heading-main h1 {
        font-size: 40px;
    }

    .gallery-detail-meta-item span {
        font-size: 8px;
    }

    .gallery-detail-meta-item strong {
        font-size: 13px;
    }

    .gallery-detail-description {
        font-size: 12.5px;
    }
}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .gallery-back,
    .gallery-back-icon,
    .gallery-detail-item,
    .gallery-detail-image img,
    .gallery-detail-image-arrow {
        transition: none;
    }
}


/* =========================================================
   GALLERY DETAIL — FINAL SAME SIZE GRID
   =========================================================
   Tüm galeri fotoğrafları aynı kart ölçüsünde gösterilir.
   Görsel alanı doldurur; gri/boş alan oluşmaz.
   ========================================================= */

.gallery-detail-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: start;
    gap: 18px;
}

/* Tüm kartlar aynı genişlik ve aynı görsel oranında */
.gallery-detail-item,
.gallery-detail-item--featured,
.gallery-detail-item:nth-child(2),
.gallery-detail-item:nth-child(n + 3) {
    grid-column: auto;
    width: 100%;
    min-width: 0;
}

    /* Tüm fotoğraf kutuları aynı yükseklik/oranda */
    .gallery-detail-image,
    .gallery-detail-item--featured .gallery-detail-image {
        position: relative;
        width: 100%;
        aspect-ratio: 4 / 3;
        height: auto;
        min-height: 0;
        overflow: hidden;
        background: transparent;
    }

        /* Fotoğraf kutuyu tamamen doldurur.
   Böylece contain kaynaklı gri/boş alan kalmaz. */
        .gallery-detail-image img {
            display: block;
            width: 100%;
            height: 100%;
            max-width: none;
            min-width: 100%;
            object-fit: cover;
            object-position: center;
            transition: transform .65s var(--ease), filter .4s ease;
        }

    /* Hover zoom */
    .gallery-detail-item:hover .gallery-detail-image img {
        transform: scale(1.025);
    }

/* ---------------------------------------------------------
   TABLET
   --------------------------------------------------------- */

@media (max-width: 1000px) {

    .gallery-detail-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
    }

    .gallery-detail-item,
    .gallery-detail-item--featured,
    .gallery-detail-item:nth-child(2),
    .gallery-detail-item:nth-child(n + 3) {
        grid-column: auto;
    }

        .gallery-detail-image,
        .gallery-detail-item--featured .gallery-detail-image {
            aspect-ratio: 4 / 3;
        }
}

/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media (max-width: 700px) {

    .gallery-detail-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .gallery-detail-item,
    .gallery-detail-item--featured,
    .gallery-detail-item:nth-child(2),
    .gallery-detail-item:nth-child(n + 3) {
        grid-column: auto;
    }

        .gallery-detail-image,
        .gallery-detail-item--featured .gallery-detail-image {
            aspect-ratio: 4 / 3;
        }
}

/* ---------------------------------------------------------
   NARROW MOBILE
   --------------------------------------------------------- */

@media (max-width: 420px) {

    .gallery-detail-image,
    .gallery-detail-item--featured .gallery-detail-image {
        aspect-ratio: 4 / 3;
    }
}
