/* =========================================================
   TÜRKİYE A TEAM — Tasarım Sistemi
   Palet:  asfalt #14161a · asfalt-2 #1b1e24 · turuncu #ff6a13
           kırmızı #c8203c · krom #9aa3af · kum #c9a876 · beyaz #eae6df
   Tipografi: Oswald (display) / Work Sans (body) / JetBrains Mono (data)
   İmza öğe: kesikli "yol çizgisi" + gerçek km işaretleri
   ========================================================= */

:root{
    --asfalt: #14161a;
    --asfalt-2: #1b1e24;
    --asfalt-3: #23272f;
    --turuncu: #ff6a13;
    --turuncu-soluk: #ff6a1322;
    --kirmizi: #c8203c;
    --krom: #9aa3af;
    --krom-soluk: #9aa3af66;
    --kum: #c9a876;
    --beyaz: #eae6df;

    --font-display: 'Oswald', sans-serif;
    --font-body: 'Work Sans', sans-serif;
    --font-mono: 'JetBrains Mono', monospace;

    --radius: 2px;
    --kenar: 1px solid #ffffff14;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
    margin:0;
    background:var(--asfalt);
    color:var(--beyaz);
    font-family:var(--font-body);
    font-size:16px;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
}
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ font-family:var(--font-display); text-transform:uppercase; letter-spacing:.02em; margin:0; }
p{ margin:0; }

:focus-visible{
    outline:2px solid var(--turuncu);
    outline-offset:3px;
}

@media (prefers-reduced-motion: reduce){
    *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}

.konteyner{ max-width:1180px; margin:0 auto; padding:0 28px; }

/* ---------- İmza öğe: kesikli yol çizgisi ---------- */
.yol-cizgisi{
    position:fixed;
    top:0; left:0; right:0;
    height:4px;
    z-index:200;
    background-image:repeating-linear-gradient(90deg, var(--turuncu) 0 34px, transparent 34px 58px);
    opacity:.9;
}

.km-isareti{
    font-family:var(--font-mono);
    font-size:.72rem;
    letter-spacing:.08em;
    color:var(--turuncu);
    display:inline-flex;
    align-items:center;
    gap:8px;
}
.km-isareti::before{
    content:'';
    width:7px; height:7px;
    background:var(--turuncu);
    border-radius:50%;
    display:inline-block;
}

/* ---------- Header ---------- */
.site-header{
    position:sticky; top:4px; z-index:100;
    background:#14161acc;
    backdrop-filter:blur(10px);
    border-bottom:var(--kenar);
}
.site-header-inner{
    max-width:1180px; margin:0 auto; padding:16px 28px;
    display:flex; align-items:center; justify-content:space-between;
}
.marka{ display:flex; align-items:center; gap:12px; }
.marka-simge{
    width:40px; height:40px;
    background:var(--turuncu);
    color:var(--asfalt);
    font-family:var(--font-display);
    font-weight:700; font-size:1.3rem;
    display:flex; align-items:center; justify-content:center;
    transform:skewX(-8deg);
    flex-shrink:0;
}
.marka-logo{
    height:44px; width:auto; max-width:120px;
    object-fit:contain;
    flex-shrink:0;
}
.marka-metin{ display:flex; flex-direction:column; line-height:1.1; }
.marka-ad{ font-family:var(--font-display); font-weight:600; font-size:1.05rem; letter-spacing:.03em; }
.marka-ad.kucuk{ font-size:1.4rem; display:block; margin-bottom:8px; }
.marka-slogan{ font-family:var(--font-mono); font-size:.62rem; color:var(--krom); letter-spacing:.1em; }

.ana-menu{ display:flex; gap:2px; }
.ana-menu a{
    font-family:var(--font-mono);
    font-size:.74rem;
    letter-spacing:.03em;
    color:var(--krom);
    padding:10px 14px;
    border-bottom:2px solid transparent;
    transition:color .15s ease, border-color .15s ease;
    white-space:nowrap;
}
.ana-menu a:hover{ color:var(--beyaz); }
.ana-menu a.aktif{ color:var(--turuncu); border-color:var(--turuncu); }

.header-sag{ display:flex; align-items:center; gap:22px; }
.header-cta{ padding:10px 20px; font-size:.72rem; flex-shrink:0; }

.menu-tetik{
    display:none;
    flex-direction:column;
    justify-content:center;
    gap:5px;
    width:38px; height:38px;
    background:none; border:var(--kenar);
    cursor:pointer;
}
.menu-tetik span{ height:2px; background:var(--beyaz); display:block; }

/* ---------- Hero (gösterge paneli konsepti) ---------- */
.hero{
    position:relative;
    padding:90px 0 70px;
    border-bottom:var(--kenar);
    background:
        radial-gradient(ellipse 80% 60% at 80% -10%, #ff6a1318, transparent),
        var(--asfalt);
    overflow:hidden;
}
.hero-inner{
    display:grid;
    grid-template-columns:1.15fr .85fr;
    gap:56px;
    align-items:end;
}
.hero-eyebrow{ margin-bottom:18px; }
.hero h1{
    font-size:clamp(2.6rem, 5.6vw, 4.6rem);
    line-height:.98;
    font-weight:700;
    margin-bottom:22px;
}
.hero h1 em{
    font-style:normal;
    color:var(--turuncu);
}
.hero p.aciklama{
    font-size:1.08rem;
    color:var(--krom);
    max-width:46ch;
    margin-bottom:32px;
}
.buton-grup{ display:flex; gap:14px; flex-wrap:wrap; }

.buton{
    font-family:var(--font-mono);
    font-size:.82rem;
    letter-spacing:.03em;
    padding:14px 24px;
    display:inline-flex;
    align-items:center;
    gap:10px;
    transition:transform .15s ease, background .15s ease, color .15s ease;
    border:1px solid var(--turuncu);
}
.buton-dolu{ background:var(--turuncu); color:var(--asfalt); font-weight:600; }
.buton-dolu:hover{ transform:translateY(-2px); }
.buton-cizgili{ color:var(--beyaz); border-color:var(--krom-soluk); }
.buton-cizgili:hover{ border-color:var(--turuncu); color:var(--turuncu); }

/* Gösterge paneli kutucuğu */
.gosterge-paneli{
    border:var(--kenar);
    background:var(--asfalt-2);
    padding:26px;
}
.gosterge-paneli-baslik{
    font-family:var(--font-mono);
    font-size:.7rem;
    color:var(--krom);
    letter-spacing:.1em;
    margin-bottom:18px;
    display:flex; justify-content:space-between;
    border-bottom:var(--kenar);
    padding-bottom:14px;
}
.gosterge-listesi{ display:flex; flex-direction:column; gap:16px; }
.gosterge-satir{ display:flex; justify-content:space-between; align-items:baseline; }
.gosterge-etiket{ color:var(--krom); font-size:.85rem; }
.gosterge-deger{ font-family:var(--font-mono); font-size:1.5rem; font-weight:700; color:var(--turuncu); }
.gosterge-deger small{ font-size:.75rem; color:var(--krom); font-weight:400; margin-left:4px; }

/* ---------- Bölüm başlıkları ---------- */

/* =========================================================
   FOTOĞRAF AĞIRLIKLI HERO (şıklaştırma güncellemesi)
   ========================================================= */
.hero-foto{
    position:relative;
    min-height:88vh;
    display:flex;
    align-items:flex-end;
    background-size:cover;
    background-position:center 30%;
    overflow:hidden;
    isolation:isolate;
}
.hero-foto::before{
    content:'';
    position:absolute; inset:0;
    background:
        linear-gradient(0deg, var(--asfalt) 0%, #14161a99 38%, #14161a4d 62%, #14161acc 100%),
        linear-gradient(90deg, #14161ae6 0%, #14161a33 45%, #14161a99 100%);
    z-index:1;
}
.hero-foto-icerik{
    position:relative; z-index:2;
    padding:0 28px 76px;
    max-width:1180px;
    margin:0 auto;
    width:100%;
}
.hero-foto-icerik h1{
    font-size:clamp(2.8rem, 6.4vw, 5.4rem);
    line-height:.96;
    font-weight:700;
    margin-bottom:24px;
    text-shadow:0 4px 30px #00000080;
}
.hero-foto-icerik h1 em{ font-style:normal; color:var(--turuncu); }
.hero-foto-icerik p.aciklama{
    font-size:1.14rem; color:#e2e0da; max-width:52ch; margin-bottom:34px;
    text-shadow:0 2px 14px #00000080;
}

/* Hero altında taşan istatistik şeridi */
.istatistik-ribbon{
    position:relative; z-index:3;
    max-width:1180px; margin:-64px auto 0; padding:0 28px;
}
.istatistik-ribbon-ic{
    background:var(--asfalt-2);
    border:var(--kenar);
    border-top:2px solid var(--turuncu);
    display:grid;
    grid-template-columns:repeat(4,1fr);
    box-shadow:0 30px 60px -20px #00000080;
}
.istatistik-ribbon-oge{
    padding:30px 26px;
    border-right:var(--kenar);
    text-align:left;
}
.istatistik-ribbon-oge:last-child{ border-right:none; }
.istatistik-ribbon-deger{ font-family:var(--font-mono); font-size:2.1rem; color:var(--turuncu); font-weight:700; line-height:1; }
.istatistik-ribbon-etiket{ color:var(--krom); font-size:.8rem; margin-top:8px; }

/* ---------- İkonlu ilke / özellik kartları ---------- */
.ozellik-izgara{
    display:grid; grid-template-columns:repeat(4, 1fr); gap:1px;
    background:var(--asfalt-3);
    border:var(--kenar);
}
.ozellik-kart{
    background:var(--asfalt-2);
    padding:32px 26px;
    display:flex; flex-direction:column; gap:14px;
}
.ozellik-numara{
    font-family:var(--font-mono); font-size:.78rem; color:var(--turuncu);
    display:flex; align-items:center; gap:10px;
}
.ozellik-numara::after{ content:''; flex:1; height:1px; background:var(--krom-soluk); }
.ozellik-ikon{ width:38px; height:38px; color:var(--turuncu); }
.ozellik-kart h3{ font-size:1.05rem; font-weight:600; }
.ozellik-kart p{ color:var(--krom); font-size:.88rem; }

/* ---------- Fotoğraflı iç sayfa başlığı ---------- */
.sayfa-ust-foto{
    position:relative;
    min-height:46vh;
    display:flex;
    align-items:flex-end;
    background-size:cover;
    background-position:center;
    border-bottom:2px solid var(--turuncu);
    isolation:isolate;
}
.sayfa-ust-foto::before{
    content:'';
    position:absolute; inset:0;
    background:linear-gradient(0deg, var(--asfalt) 4%, #14161a99 48%, #14161a66 100%);
    z-index:1;
}
.sayfa-ust-foto-ic{
    position:relative; z-index:2;
    max-width:1180px; margin:0 auto; width:100%;
    padding:0 28px 46px;
}
.sayfa-ust-foto-ic h1{
    font-size:clamp(2.3rem,4.8vw,3.6rem);
    margin-bottom:14px;
    text-shadow:0 4px 24px #00000090;
}
.sayfa-ust-foto-ic p{ color:#e2e0da; max-width:60ch; text-shadow:0 2px 12px #00000090; }

/* Görünüme girince yumuşak beliriş */
.belir{ opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease; }
.belir.gorunur{ opacity:1; transform:translateY(0); }

@media (max-width: 980px){
    .istatistik-ribbon-ic{ grid-template-columns:1fr 1fr; }
    .ozellik-izgara{ grid-template-columns:1fr 1fr; }
}
@media (max-width: 620px){
    .hero-foto{ min-height:74vh; }
    .istatistik-ribbon{ margin-top:-40px; }
    .istatistik-ribbon-ic{ grid-template-columns:1fr 1fr; }
    .ozellik-izgara{ grid-template-columns:1fr; }
    .sayfa-ust-foto{ min-height:34vh; }
}

.bolum{ padding:80px 0; border-bottom:var(--kenar); }
.bolum-baslik{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:24px;
    margin-bottom:44px;
    flex-wrap:wrap;
}
.bolum-baslik h2{ font-size:clamp(1.7rem,3vw,2.4rem); }
.bolum-baslik .bolum-aciklama{ color:var(--krom); max-width:44ch; }
.tum-link{ font-family:var(--font-mono); font-size:.78rem; color:var(--turuncu); white-space:nowrap; border-bottom:1px solid var(--turuncu); padding-bottom:2px; }

/* ---------- Kartlar: Rotalar / Turlar ---------- */
.kart-izgara{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.kart-izgara.iki{ grid-template-columns:repeat(2,1fr); }

.rota-kart, .tur-kart, .blog-kart{
    background:var(--asfalt-2);
    border:var(--kenar);
    display:flex;
    flex-direction:column;
    transition:border-color .15s ease, transform .15s ease;
}
.rota-kart:hover, .tur-kart:hover, .blog-kart:hover{ border-color:#ffffff2e; transform:translateY(-3px); }

.kart-gorsel{ height:190px; overflow:hidden; position:relative; }
.kart-gorsel img{ width:100%; height:100%; object-fit:cover; }
.zorluk-etiket{
    position:absolute; top:12px; right:12px;
    font-family:var(--font-mono); font-size:.68rem;
    background:#0000008c; backdrop-filter:blur(4px);
    padding:5px 10px; letter-spacing:.05em;
    border:1px solid #ffffff2e;
}
.zorluk-Kolay{ color:#7cd992; }
.zorluk-Orta{ color:var(--kum); }
.zorluk-Zor{ color:var(--kirmizi); }

.kart-govde{ padding:22px; display:flex; flex-direction:column; gap:12px; flex:1; }
.kart-govde h3{ font-size:1.2rem; font-weight:600; }
.kart-govde p{ color:var(--krom); font-size:.92rem; }

.rota-metrikler{
    display:flex; gap:18px;
    font-family:var(--font-mono); font-size:.78rem; color:var(--krom);
    padding-top:12px; margin-top:auto;
    border-top:var(--kenar);
}
.rota-metrikler b{ color:var(--beyaz); }

.dolulukçubugu-sarmal{ margin-top:auto; }
.doluluk-cubugu{ height:5px; background:var(--asfalt-3); position:relative; overflow:hidden; }
.doluluk-cubugu i{ position:absolute; inset:0; background:var(--turuncu); }
.doluluk-metin{ font-family:var(--font-mono); font-size:.7rem; color:var(--krom); margin-top:8px; display:flex; justify-content:space-between; }

/* ---------- Harita ---------- */
.harita-sarmal{
    border:var(--kenar);
    height:460px;
    background:var(--asfalt-2);
}
.harita-sarmal .leaflet-container{ background:var(--asfalt-2); }

.harita-yerlesim{ display:grid; grid-template-columns:.9fr 1.4fr; gap:26px; align-items:start; }
.rota-liste{ display:flex; flex-direction:column; gap:2px; }
.rota-liste-ogesi{
    display:block; width:100%; text-align:left;
    background:var(--asfalt-2); border:var(--kenar); border-left:3px solid transparent;
    padding:16px 18px; cursor:pointer;
    font-family:var(--font-body); color:var(--beyaz);
    transition:border-color .15s ease, background .15s ease;
}
.rota-liste-ogesi:hover, .rota-liste-ogesi.secili{ border-left-color:var(--turuncu); background:var(--asfalt-3); }
.rota-liste-ogesi .ad{ font-weight:600; display:block; margin-bottom:4px; }
.rota-liste-ogesi .detay{ font-family:var(--font-mono); font-size:.72rem; color:var(--krom); }

/* ---------- Kulüp evleri liste ---------- */
.kulup-kart{
    background:var(--asfalt-2); border:var(--kenar);
    padding:20px; display:flex; flex-direction:column; gap:10px;
}
.kulup-kart h3{ font-size:1.1rem; }
.kulup-kart .adres{ color:var(--krom); font-size:.88rem; }
.kulup-etiketler{ display:flex; gap:8px; flex-wrap:wrap; margin-top:6px; }
.kulup-etiketler span{
    font-family:var(--font-mono); font-size:.68rem;
    border:1px solid var(--krom-soluk); color:var(--krom);
    padding:4px 8px;
}
.kulup-uye{ font-family:var(--font-mono); font-size:.78rem; color:var(--turuncu); margin-top:auto; }

/* ---------- Haftalık plan ---------- */
.plan-baslik-serit{
    display:flex; justify-content:space-between; align-items:center;
    background:var(--asfalt-2); border:var(--kenar); padding:18px 24px; margin-bottom:32px;
}
.plan-hafta{ font-family:var(--font-mono); color:var(--turuncu); font-size:.9rem; }

.plan-gun{ margin-bottom:2px; }
.plan-gun-baslik{
    font-family:var(--font-display); font-size:1.1rem; letter-spacing:.03em;
    padding:14px 0 10px; border-bottom:1px solid var(--turuncu);
    display:flex; justify-content:space-between; align-items:baseline;
}
.plan-gun-baslik .tarih-mono{ font-family:var(--font-mono); font-size:.72rem; color:var(--krom); text-transform:none; }
.plan-etkinlik{
    display:grid; grid-template-columns:90px 1fr auto; gap:18px; align-items:center;
    padding:16px 4px; border-bottom:var(--kenar);
}
.plan-saat{ font-family:var(--font-mono); color:var(--turuncu); font-weight:700; }
.plan-detay .baslik{ font-weight:600; display:block; margin-bottom:3px; }
.plan-detay .yer{ color:var(--krom); font-size:.85rem; }
.plan-sorumlu{ font-family:var(--font-mono); font-size:.72rem; color:var(--krom); text-align:right; }
.plan-tip{
    display:inline-block; font-family:var(--font-mono); font-size:.62rem;
    padding:3px 8px; margin-bottom:6px; letter-spacing:.05em;
}
.plan-tip-toplanti{ background:#ff6a1322; color:var(--turuncu); }
.plan-tip-bakim{ background:#c9a87622; color:var(--kum); }
.plan-tip-suruş{ background:#c8203c22; color:var(--kirmizi); }
.plan-tip-sosyal{ background:#7cd99222; color:#7cd992; }

/* ---------- Galeri ---------- */
.galeri-izgara{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    grid-auto-rows:200px;
    gap:8px;
}
.galeri-oge{ overflow:hidden; position:relative; }
.galeri-oge img{ width:100%; height:100%; object-fit:cover; transition:transform .4s ease; }
.galeri-oge:hover img{ transform:scale(1.06); }
.galeri-oge.buyuk{ grid-column:span 2; grid-row:span 2; }

/* ---------- Blog ---------- */
.blog-meta{ font-family:var(--font-mono); font-size:.72rem; color:var(--krom); display:flex; gap:14px; }
.blog-kategori{ color:var(--turuncu); }

/* ---------- İstatistik şeridi ---------- */
.istatistik-serit{
    display:grid; grid-template-columns:repeat(4,1fr);
    border-top:var(--kenar); border-bottom:var(--kenar);
}
.istatistik-oge{
    padding:34px 28px;
    border-right:var(--kenar);
    text-align:left;
}
.istatistik-oge:last-child{ border-right:none; }
.istatistik-deger{ font-family:var(--font-mono); font-size:2.2rem; color:var(--turuncu); font-weight:700; }
.istatistik-etiket{ color:var(--krom); font-size:.82rem; margin-top:6px; }

/* ---------- Form (haftalık plan / iletişim benzeri) ---------- */
.form-satir{ display:flex; flex-direction:column; gap:8px; margin-bottom:18px; }
.form-satir label{ font-family:var(--font-mono); font-size:.75rem; color:var(--krom); }
.form-satir input, .form-satir textarea, .form-satir select{
    background:var(--asfalt-2); border:var(--kenar); color:var(--beyaz);
    padding:12px 14px; font-family:var(--font-body); font-size:.95rem;
}
.form-satir input:focus, .form-satir textarea:focus{ border-color:var(--turuncu); outline:none; }

/* ---------- Footer ---------- */
.site-footer{ padding:60px 0 0; }
.site-footer-inner{
    max-width:1180px; margin:0 auto; padding:0 28px 40px;
    display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:32px;
}
.footer-blok{ display:flex; flex-direction:column; gap:10px; }
.footer-blok p{ color:var(--krom); font-size:.88rem; max-width:32ch; }
.footer-baslik{ font-family:var(--font-mono); font-size:.72rem; color:var(--turuncu); letter-spacing:.08em; margin-bottom:4px; }
.footer-blok a{ color:var(--krom); font-size:.9rem; transition:color .15s ease; }
.footer-blok a:hover{ color:var(--beyaz); }
.footer-alt{
    border-top:var(--kenar); padding:20px 28px;
    font-family:var(--font-mono); font-size:.7rem; color:var(--krom);
    display:flex; justify-content:center;
}

/* ---------- Sayfa üst şeridi (iç sayfalar) ---------- */
.sayfa-ust{ padding:60px 0 40px; border-bottom:var(--kenar); }
.sayfa-ust h1{ font-size:clamp(2.1rem,4.4vw,3.2rem); margin-bottom:14px; }
.sayfa-ust p{ color:var(--krom); max-width:60ch; }

/* ---------- Responsive ---------- */
@media (max-width: 980px){
    .ana-menu{ display:none; }
    .menu-tetik{ display:flex; order:3; }
    .header-sag{ order:2; margin-left:auto; }
    .ana-menu.acik{
        display:flex; flex-direction:column;
        position:absolute; top:100%; left:0; right:0;
        background:var(--asfalt-2); border-bottom:var(--kenar);
        padding:8px 20px 20px;
    }
    .header-cta{ display:none; }
    .hero-inner{ grid-template-columns:1fr; }
    .kart-izgara{ grid-template-columns:1fr 1fr; }
    .istatistik-serit{ grid-template-columns:1fr 1fr; }
    .harita-yerlesim{ grid-template-columns:1fr; }
    .site-footer-inner{ grid-template-columns:1fr 1fr; }
    .galeri-izgara{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 620px){
    .kart-izgara{ grid-template-columns:1fr; }
    .istatistik-serit{ grid-template-columns:1fr 1fr; }
    .plan-etkinlik{ grid-template-columns:1fr; gap:6px; }
    .plan-sorumlu{ text-align:left; }
    .site-footer-inner{ grid-template-columns:1fr; }
    .galeri-izgara{ grid-template-columns:1fr 1fr; grid-auto-rows:150px; }
    .galeri-oge.buyuk{ grid-column:span 2; grid-row:span 1; }
}
