:root {
    --blue: #b9520a;
    --blue-d: #9a4508;
    --blue-l: #fff1de;
    --blue-ll: #f7dcc0;
    --indigo: #b9520a;
    --violet: #9a4508;
    --ink: #17181c;
    --slate: #575b62;
    --border: #e7e6e1;
    --surface: #f2f2ef;
    --white: #ffffff;
    --r-sm: 8px;
}

/* bootstrap-icons render'ı engellemeden geç yüklenir. İkonun yeri baştan ayrılır;
   font gelince içerik değişir ama kutu aynı kalır, kayma olmaz.
   :where() özgüllüğü 0 tutar, böylece bootstrap-icons kuralları her zaman kazanır. */
:where(.bi, [class^="bi-"], [class*=" bi-"])::before {
    content: "";
    display: inline-block;
    width: 1em;
    height: 1em;
    vertical-align: -.125em;
}

.site-nav {
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    z-index: 999;
    height: 68px;
    background: rgba(255, 255, 255, .88);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border-bottom: 1px solid rgba(231, 230, 225, .7);
    transition: box-shadow .3s;
}
.site-nav.scrolled { box-shadow: 0 4px 24px rgba(0, 0, 0, .07); }
.nav-inner {
    max-width: 1180px;
    height: 68px;
    margin: 0 auto;
    padding: 0 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}
.nav-brand { display: flex; align-items: center; gap: 10px; flex-shrink: 0; text-decoration: none; }
.nav-brand-img {
    display: block;
    width: 320px;
    max-width: 54vw;
    height: 72px;
    object-fit: contain;
    border-radius: 10px;
}
.nav-links { display: flex; align-items: center; justify-content: center; flex: 1; gap: 2px; }
.nav-links a {
    padding: 6px 14px;
    border-radius: var(--r-sm);
    color: var(--slate);
    font-size: .875rem;
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
    transition: all .15s;
}
.nav-links a:hover, .nav-links a.is-active { color: var(--ink); background: var(--surface); }
.nav-actions { display: flex; align-items: center; flex-shrink: 0; gap: 8px; }
.btn-nav-phone, .btn-nav-gplay, .btn-nav-login, .btn-nav-cta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border-radius: var(--r-sm);
    font-size: .78rem;
    font-weight: 700;
    line-height: 1.6;
    text-decoration: none;
    white-space: nowrap;
}
.btn-nav-phone { color: var(--blue-d); background: var(--blue-l); border: 1px solid #f0d3b4; }
.btn-nav-phone:hover { color: var(--blue-d); background: var(--blue-ll); }
.btn-nav-gplay { padding-inline: 12px; color: #fff; background: #17181c; border: 1px solid #202127; }
.btn-nav-gplay i { font-size: 1rem; }
.btn-nav-gplay:hover { color: #fff; background: #121316; }
.btn-nav-login {
    padding-inline: 11px;
    color: #fff;
    background: var(--blue);
    border: 1px solid var(--blue);
    box-shadow: 0 1px 5px rgba(185, 82, 10, .18);
    transition: all .15s;
}
.btn-nav-login:hover { color: #fff; background: var(--blue-d); border-color: var(--blue-d); transform: translateY(-1px); box-shadow: 0 6px 18px rgba(185, 82, 10, .32); }
.btn-nav-cta {
    padding-inline: 12px;
    color: #fff;
    background: linear-gradient(135deg, var(--blue), var(--indigo));
    box-shadow: 0 2px 8px rgba(185, 82, 10, .28);
    transition: all .2s;
}
.btn-nav-cta:hover { color: #fff; transform: translateY(-1px); box-shadow: 0 6px 20px rgba(185, 82, 10, .45); }
.nav-hamburger {
    display: none;
    padding: 7px 10px;
    border: 1px solid var(--border);
    border-radius: var(--r-sm);
    color: var(--slate);
    background: none;
    cursor: pointer;
}
.nav-hamburger svg { display: block; }
.nav-hamburger .nav-hamburger-close,
.nav-hamburger[aria-expanded="true"] .nav-hamburger-open { display: none; }
.nav-hamburger[aria-expanded="true"] .nav-hamburger-close { display: block; }
.nav-mobile-menu {
    display: none;
    position: absolute;
    top: 68px;
    left: 0;
    right: 0;
    z-index: 999;
    padding: 12px 20px 20px;
    border-bottom: 1px solid var(--border);
    background: #fff;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .08);
    flex-direction: column;
    gap: 2px;
}
.nav-mobile-menu.open { display: flex; }
.nav-mobile-menu a {
    padding: 10px 12px;
    border-radius: var(--r-sm);
    color: var(--slate);
    font-size: .95rem;
    font-weight: 500;
    text-decoration: none;
    transition: all .15s;
}
.nav-mobile-menu a:hover { color: var(--ink); background: var(--surface); }
.nav-mobile-menu .mm-phone { margin-top: 8px; color: var(--blue-d) !important; background: var(--blue-l); border: 1px solid #f0d3b4; font-weight: 700; text-align: center; }
.nav-mobile-menu .mm-whatsapp { margin-top: 6px; color: #fff !important; background: #25d366; font-weight: 800; text-align: center; }
.nav-mobile-menu .mm-gplay, .nav-mobile-menu .mm-appstore { margin-top: 8px; color: #fff !important; background: #17181c; font-weight: 800; text-align: center; }
.nav-mobile-menu .mm-login, .nav-mobile-menu .mm-cta { margin-top: 8px; color: #fff !important; background: var(--blue); font-weight: 700; text-align: center; }
.nav-mobile-menu .mm-cta { margin-top: 6px; }

.site-footer {
    padding: 64px 0 0;
    background: linear-gradient(180deg, #17181c 0%, #141518 100%);
}
.footer-inner { max-width: 1180px; margin: 0 auto; padding: 0 24px; }
.footer-grid {
    display: grid;
    grid-template-columns: 2.2fr 1fr 1fr 1fr 1.15fr;
    gap: 42px;
    padding-bottom: 48px;
    border-bottom: 1px solid rgba(255, 255, 255, .12);
}
.footer-brand-logo { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.footer-logo-icon { width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; border-radius: 9px; color: #fff; background: linear-gradient(135deg, var(--blue), var(--violet)); font-size: .95rem; }
.footer-brand-name { color: #fff; font-size: 1.05rem; font-weight: 800; }
.footer-brand-name em { color: #e3a873; font-style: normal; }
.footer-desc { max-width: 230px; margin-bottom: 18px; color: #d6d4cd; font-size: .82rem; line-height: 1.7; }
.footer-trust-chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border: 1px solid rgba(255, 255, 255, .14); border-radius: 8px; color: #f7dcc0; background: rgba(255, 255, 255, .07); font-size: .7rem; }
.footer-trust-chip i { color: #e3a873; }
.footer-app-links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.footer-app-link { display: inline-flex; align-items: center; gap: 6px; padding: 7px 10px; border: 1px solid rgba(214, 212, 205, .18); border-radius: var(--r-sm); color: #e7e6e1; background: rgba(23, 24, 28, .5); font-size: .8rem; font-weight: 700; text-decoration: none; }
.footer-app-link:hover { color: #fff; background: rgba(23, 24, 28, .86); border-color: rgba(214, 212, 205, .32); }
.footer-payments { margin-top: 18px; }
.footer-payments-title { margin-bottom: 12px; color: #8d9097; font-size: .68rem; font-weight: 700; text-transform: uppercase; }
.payment-logos { display: flex; flex-wrap: wrap; gap: 10px; }
.payment-logo { min-height: 40px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 0 14px; border: 1px solid rgba(255, 255, 255, .08); border-radius: 12px; color: #e7e6e1; background: rgba(255, 255, 255, .04); font-weight: 800; white-space: nowrap; }
.payment-logo.visa-logo { color: #e3a873; letter-spacing: 1.6px; }
.payment-logo.mastercard-logo { color: #f2f2ef; }
.payment-logo.iyzico-logo { padding: 8px 12px; }
.payment-logo.iyzico-logo img { display: block; width: auto; max-width: 210px; height: 32px; }
.mastercard-mark { display: inline-flex; position: relative; width: 28px; height: 16px; }
.mastercard-mark::before, .mastercard-mark::after { content: ''; position: absolute; top: 0; width: 16px; height: 16px; border-radius: 50%; }
.mastercard-mark::before { left: 1px; background: #ef4444; }
.mastercard-mark::after { right: 1px; background: #f59e0b; opacity: .92; }
.footer-col-title { margin-bottom: 16px; color: #ebbd8f; font-size: .68rem; font-weight: 700; text-transform: uppercase; }
.footer-link { display: block; margin-bottom: 11px; color: #d6d4cd; font-size: .84rem; text-decoration: none; }
.footer-link:hover { color: #fff; }
.footer-bottom { display: flex; align-items: center; justify-content: space-between; padding: 22px 0; font-size: .78rem; }
.footer-copy-text { color: #8d9097; }

@media (max-width: 1320px) {
    .nav-inner { gap: 14px; }
    .nav-brand-img { width: 270px; max-width: 42vw; }
    .nav-links a { padding-inline: 9px; }
    .btn-nav-phone { display: none; }
}
@media (max-width: 1080px) {
    .nav-links, .nav-actions { display: none; }
    .nav-hamburger { display: block; }
}
@media (max-width: 960px) {
    .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}
@media (max-width: 768px) {
    .nav-brand-img { width: 245px; max-width: 68vw; height: 62px; }
    .footer-grid { grid-template-columns: 1fr; gap: 24px; }
}
@media (max-width: 480px) {
    .nav-brand-img { width: 215px; max-width: 66vw; height: 56px; }
    .footer-bottom { flex-direction: column; gap: 8px; text-align: center; }
}
.footer-brand-img{display:block;width:280px;max-width:100%;height:auto}

/* Üst menü: ana sayfadaki gibi sade "Giriş", koyu ana buton, sakin telefon çipi */
.btn-nav-phone { color: var(--ink); background: transparent; border: 1px solid var(--border); border-radius: 99px; }
.btn-nav-phone:hover { color: var(--ink); background: var(--surface); }
.btn-nav-login { color: var(--ink); background: transparent; border-color: transparent; border-radius: 99px; box-shadow: none; }
.btn-nav-login:hover { color: var(--blue-d); background: transparent; border-color: transparent; box-shadow: none; transform: none; text-decoration: underline; text-underline-offset: 4px; }
.btn-nav-cta { color: #fff; background: var(--ink); border-radius: 99px; box-shadow: none; }
.btn-nav-cta:hover { color: #fff; background: var(--blue); box-shadow: none; }

/* Altbilgi: ana sayfadaki gibi açık zemin (landing.css footer) */
.site-footer { background: #fff; border-top: 1px solid var(--border); }
.footer-grid { border-bottom-color: var(--border); }
.footer-brand-name { color: var(--ink); }
.footer-brand-name em { color: var(--blue); }
.footer-desc { color: var(--slate); }
.footer-trust-chip { color: var(--slate); background: var(--surface); border-color: var(--border); }
.footer-trust-chip i { color: #0d7a4f; }
.footer-app-link { color: var(--ink); background: var(--surface); border-color: var(--border); }
.footer-app-link:hover { color: var(--ink); background: #e7e6e1; border-color: #d6d4cd; }
.footer-payments-title { color: #64676e; }
.payment-logo { color: var(--ink); background: var(--surface); border-color: var(--border); }
.payment-logo.visa-logo { color: #1a1f71; }
.payment-logo.mastercard-logo { color: var(--ink); }
.footer-col-title { color: var(--blue-d); letter-spacing: .08em; }
.footer-link { color: var(--slate); }
.footer-link:hover { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
.footer-copy-text { color: #64676e; }