/* ---------------------------------------
   GLOBAL VARIABLES (RENK & TASARIM SETİ)
---------------------------------------- */
:root {

    /* Brand Colors */
    --brand-main: #06b6be;     /* CTA ve menü arka planı */
--brand-main-rgb: 6, 182, 190;

    --widget-bg: rgba(var(--brand-main-rgb), 0.85);

    --brand-dark: #141617;     /* Siyah ton */
    --brand-gray: #979797;     /* Dil pasif gri */
    --divider-gray: #d9d9d9;   /* TR | EN bölücü */
    --overlay-dark: rgba(0,0,0,0.55);

    /* Typography */
    --font-main: "Inter", "Helvetica", "Arial", sans-serif;
    --text-light: #f5f5f5;
    --text-white: #ffffff;

    /* Layout */
    --header-height: 80px;
    --menu-width: 70%;
    --menu-max-width: 480px;

        --widget-bg: rgba( var(--brand-main-rgb), 0.85 );


    /* Shadows */
    --cta-shadow: 0 8px 25px rgba(0,0,0,0.15);
}
* {
    font-family: var(--font-main);
}

/* ---------------------------------------
   GLOBAL LAYOUT
---------------------------------------- */
.container {
    width: 100%;
    max-width: 90%;
    padding: 0 20px;
    margin: 0 auto;
}

/* Header özel container genişliği */
.site-header .container {
    width: 98%;
    max-width: none;
    padding: 0;
}


/* ---------------------------------------
   HEADER
---------------------------------------- */
.site-header {
    position: fixed;
    top: 0;
    inset: 0 0 auto 0;
    height: var(--header-height);
    background: var(--text-white);
    display: flex;
    align-items: center;
    z-index: 1000;
    border-bottom: 1px solid rgba(0,0,0,0.05);
}

.header-inner {
    height: var(--header-height);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* Logo */
.logo img {
    height: 72px;
    object-fit: contain;

    /* ortalama mantığı */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate3d(-50%, -50%, 0);
}


/* ---------------------------------------
   MENU TOGGLE
---------------------------------------- */
.menu-toggle {
    display: flex;
    align-items: center;
    gap: 10px;
    background: transparent;
    border: none;
    cursor: pointer;
}

.menu-icon {
    width: 22px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.menu-icon span {
    height: 2px;
    background: var(--brand-dark);
    width: 100%;
}

.menu-label {
    font-size: 14px;
    color: var(--brand-dark);
    letter-spacing: 0.05em;
}


/* ---------------------------------------
   LANG SWITCH
---------------------------------------- */
.header-right {
    display: flex;
    align-items: center;
    gap: 14px;
}

.lang-switch {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
}

.lang {
    color: var(--brand-gray);
    cursor: pointer;
}

.lang.active {
    color: var(--brand-dark);
}

.divider {
    width: 1px;
    height: 18px;
    background: var(--divider-gray);
}


/* ---------------------------------------
   CTA BUTTON (Bilgi Talep Formu)
---------------------------------------- */
.btn-cta {
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--brand-main);
    color: var(--text-white);
    padding: 12px 20px;
    border-radius: 4px;
    font-size: 14px;
    border: 1px solid rgba(255,255,255,0.4);
    box-shadow: var(--cta-shadow);
    transition: opacity .2s ease;
}

.btn-cta img {
    width: 18px;
    height: 18px;
}

.btn-cta:hover {
    opacity: .9;
}


/* ---------------------------------------
   MOBILE MENU
---------------------------------------- */
.mobile-menu {
    position: fixed;
    top: 0;
    left: -55%;
    width: 55%;
    max-width: 520px; /* büyük ekranlarda tasarıma daha yakın */
    height: 100vh;
    background: var(--brand-main);
    padding: 40px;
    z-index: 2001; /* overlay'in üstünde */
    transition: left .45s ease;
}

.mobile-menu.active {
    left: 0;
}


/* Body scroll kilidi */
body.menu-open {
    overflow: hidden;
}

/* MENU CLOSE */
.menu-header {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

.menu-close {
    display: flex;
    align-items: center;
    gap: 10px;
    background: transparent;
    border: none;
    color: var(--text-white);
    cursor: pointer;
}

.close-icon {
    font-size: 32px;
}

.close-label {
    font-size: 16px;
}

/* MENU LINKS */
.menu-links {
    list-style: none;
    margin-top: 10px;
    padding: 0;
}

.menu-links li {
    margin-bottom: 22px;
}

.menu-links a {
    font-size: 24px;
    color: var(--text-light);
    opacity: .8;
    transition: opacity .2s;
}

/* Mobil görünüm (Ekran genişliği 768px ve altındaysa devreye girer) */
@media (max-width: 768px) {
    .menu-links a {
        font-size: 18px;
    }
}

.menu-links li.active a,
.menu-links a:hover {
    opacity: 1;
    font-weight: 600;
    color: var(--text-white);
}


/* ---------------------------------------
   FOOTER
---------------------------------------- */
.site-footer {
    background: var(--brand-dark);
    padding: 20px 0;
    margin-top: 60px;
}

.footer-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: var(--text-white);
    font-size: 14px;
}

/* LEFT SIDE */
.footer-social {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--text-white);
}

.footer-icon {
    width: 24px;
    height: 24px;
    opacity: 0.9;
}

/* RIGHT SIDE */
.footer-links {
    display: flex;
    align-items: center;
    gap: 16px;
}

.footer-links a {
    color: #ababab;
    font-size: 13px;
}

.footer-links a:hover {
    color: var(--text-white);
}

.footer-divider {
    width: 1px;
    height: 16px;
    background: #393939;
}

/* Footer Left - Contact & Social */
.footer-left {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.footer-contact {
    display: flex;
    align-items: center;
    gap: 12px;
}

.footer-contact a {
    color: var(--text-white);
    font-size: 14px;
}

.footer-contact a:hover {
    opacity: 0.8;
}

.footer-contact .footer-divider {
    color: #666;
}

.footer-social-links {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 12px;
}

.footer-social-links a {
    display: flex;
    align-items: center;
}

/* Footer Links - wrap on mobile */
@media (max-width: 768px) {
    .footer-inner {
        flex-direction: column;
        gap: 20px;
        text-align: center;
    }

    .footer-left {
        align-items: center;
    }

    .footer-links {
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px 16px;
    }
}


/* ---------------------------------------
   MENU OVERLAY (TASARIMDAKİ KAPATMA ARKASI)
---------------------------------------- */
.menu-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: var(--overlay-dark); /* rgba(0,0,0,0.55) */
    opacity: 0;
    pointer-events: none;
    transition: opacity .35s ease;
    z-index: 1500;
}

.menu-overlay.active {
    opacity: 1;
    pointer-events: auto;
}


main{
    padding-top:80px;
}