/* ===== ROTANERESI.COM — PREMIUM TRAVEL UI ===== */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700&family=DM+Serif+Display:ital@0;1&display=swap');

:root {
    --orange: #F5A623;
    --orange-hover: #E8951A;
    --orange-light: #FFF6EB;
    --orange-glow: rgba(245,166,35,0.12);
    --gold: #C4943A;
    --dark: #111111;
    --dark-800: #1D1D1D;
    --dark-700: #2A2A2A;
    --text: #222222;
    --text-2: #555555;
    --text-3: #888888;
    --text-4: #BBBBBB;
    --border: #EBEBEB;
    --border-hover: #DDDDDD;
    --bg: #FFFFFF;
    --bg-warm: #FAF8F5;
    --bg-card: #FFFFFF;
    --shadow-xs: 0 1px 2px rgba(0,0,0,0.04);
    --shadow-sm: 0 2px 8px rgba(0,0,0,0.06);
    --shadow-md: 0 4px 16px rgba(0,0,0,0.08);
    --shadow-lg: 0 8px 30px rgba(0,0,0,0.10);
    --shadow-xl: 0 16px 48px rgba(0,0,0,0.12);
    --shadow-card: 0 6px 16px rgba(0,0,0,0.08);
    --shadow-card-hover: 0 12px 32px rgba(0,0,0,0.12);
    --r: 16px;
    --r-lg: 24px;
    --r-sm: 12px;
    --r-xs: 8px;
    --ease: cubic-bezier(0.25, 0.1, 0.25, 1);
    --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
}

*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

body {
    font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    color: var(--text);
    background: var(--bg);
    line-height: 1.6;
    font-size: 15px;
}

a{color:var(--orange);text-decoration:none;transition:color .2s var(--ease)}
a:hover{color:var(--orange-hover)}
img{max-width:100%;height:auto}
.container{max-width:1180px;margin:0 auto;padding:0 24px}

/* ===== NAV — Airbnb Style ===== */
.header {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 100;
    background: rgba(255,255,255,0.96);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: 1px solid var(--border);
    transition: box-shadow .3s var(--ease);
}

.header.scrolled {
    box-shadow: 0 2px 12px rgba(0,0,0,0.06);
}

.header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 72px;
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 24px;
}

.logo {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 700;
    font-size: 1.35rem;
    color: var(--dark);
    letter-spacing: -0.3px;
}

.logo svg.logo-svg{width:240px;height:56px}
.logo span{color:var(--orange)}

.nav{display:flex;align-items:center;gap:2px}

.nav a {
    color: var(--text-2);
    font-weight: 500;
    font-size: 0.88rem;
    padding: 10px 14px;
    border-radius: 24px;
    transition: all .2s var(--ease);
    position: relative;
}

.nav a:hover { color: var(--text); background: var(--bg-warm); }

.nav a.active {
    color: var(--orange);
    font-weight: 600;
}

.nav a.active::after {
    content: '';
    position: absolute;
    bottom: 2px; left: 50%;
    transform: translateX(-50%);
    width: 5px; height: 5px;
    background: var(--orange);
    border-radius: 50%;
}

.mobile-toggle{display:none;background:none;border:none;cursor:pointer;padding:10px;border-radius:50%;transition:background .2s}
.mobile-toggle:hover{background:var(--bg-warm)}
.mobile-toggle span{display:block;width:18px;height:2px;background:var(--dark);margin:4px 0;border-radius:2px;transition:all .3s var(--ease)}

/* ===== HERO — Immersive ===== */
.hero {
    min-height: 92vh;
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
    background: var(--bg-warm);
    padding-top: 72px;
}

.hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
    width: 100%;
}

.hero-left {
    padding: 40px 0;
}

.hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--orange-light);
    padding: 6px 16px;
    border-radius: 24px;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--orange);
    margin-bottom: 28px;
    letter-spacing: 0.5px;
}

.hero h1 {
    font-family: 'DM Serif Display', serif;
    font-size: 3.8rem;
    font-weight: 400;
    line-height: 1.1;
    color: var(--dark);
    margin-bottom: 20px;
    letter-spacing: -1px;
}

.hero h1 em {
    font-style: italic;
    color: var(--orange);
}

.hero-desc {
    font-size: 1.05rem;
    color: var(--text-2);
    max-width: 440px;
    line-height: 1.7;
    margin-bottom: 36px;
}

.hero-search {
    display: flex;
    background: var(--bg);
    border-radius: var(--r);
    box-shadow: var(--shadow-md);
    overflow: hidden;
    border: 1px solid var(--border);
    max-width: 420px;
}

.hero-search input {
    flex: 1;
    padding: 16px 20px;
    border: none;
    font-size: 0.92rem;
    font-family: inherit;
    outline: none;
    background: transparent;
    color: var(--text);
}

.hero-search input::placeholder{color:var(--text-4)}

.hero-search button {
    padding: 16px 28px;
    background: var(--orange);
    color: #fff;
    border: none;
    font-size: 0.88rem;
    font-weight: 600;
    cursor: pointer;
    transition: background .2s var(--ease);
    font-family: inherit;
    white-space: nowrap;
}

.hero-search button:hover{background:var(--orange-hover)}

.hero-stats {
    display: flex;
    gap: 40px;
    margin-top: 44px;
    padding-top: 32px;
    border-top: 1px solid var(--border);
}

.hero-stat-num { font-size: 1.8rem; font-weight: 700; color: var(--dark); line-height: 1; }
.hero-stat-label { font-size: 0.78rem; color: var(--text-3); margin-top: 4px; font-weight: 500; letter-spacing: 0.3px; }

.hero-right {
    position: relative;
    height: 520px;
}

.hero-img-main {
    width: 100%;
    height: 100%;
    border-radius: var(--r-lg);
    background: linear-gradient(145deg, #F0E2D0, #E8D5BE, #D4B896);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 8rem;
    box-shadow: var(--shadow-lg);
    overflow: hidden;
    position: relative;
}

.hero-img-main img { width:100%; height:100%; object-fit:cover; }

.hero-float-card {
    position: absolute;
    bottom: -20px; left: -30px;
    background: var(--bg);
    border-radius: var(--r);
    padding: 18px 22px;
    box-shadow: var(--shadow-lg);
    display: flex;
    align-items: center;
    gap: 14px;
    animation: float-card 4s ease-in-out infinite;
}

@keyframes float-card {
    0%,100%{transform:translateY(0)}
    50%{transform:translateY(-8px)}
}

.hero-float-icon {
    width: 48px; height: 48px;
    background: var(--orange-light);
    border-radius: var(--r-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
}

.hero-float-text strong { display: block; font-size: 0.9rem; color: var(--dark); }
.hero-float-text span { font-size: 0.78rem; color: var(--text-3); }

/* ===== SECTION ===== */
.section { padding: 96px 0; }
.section.bg-warm { background: var(--bg-warm); }

.section-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 44px;
}

.section-header-left {}

.section-tag {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--orange);
    margin-bottom: 8px;
    display: block;
}

.section-title {
    font-family: 'DM Serif Display', serif;
    font-size: 2.2rem;
    color: var(--dark);
    line-height: 1.2;
    letter-spacing: -0.5px;
}

.section-subtitle {
    color: var(--text-3);
    font-size: 0.92rem;
    margin-top: 8px;
}

/* ===== HARITA ===== */
.harita-section { background: var(--bg-warm); padding: 96px 0; }

.harita-wrapper {
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 28px;
    align-items: start;
}

.harita-map-col,
.rotalar-map-col { display: flex; flex-direction: column; gap: 14px; }
.rotalar-map-col .turkiye-map { height: 600px; }

.turkiye-map {
    width: 100%;
    height: 520px;
    border-radius: var(--r);
    border: 1px solid var(--border);
    background: var(--bg-warm);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
    z-index: 1;
}

.turkiye-map .leaflet-container { background: #FAF8F5; font-family: inherit; }
.turkiye-map .leaflet-control-zoom a {
    background: var(--bg);
    color: var(--dark);
    border: 1px solid var(--border);
    border-radius: 6px !important;
    width: 30px; height: 30px; line-height: 28px;
}
.turkiye-map .leaflet-control-zoom a:hover { background: var(--orange-light); color: var(--orange); border-color: var(--orange); }
.turkiye-map .leaflet-control-attribution { background: rgba(255,255,255,0.8); font-size: 10px; }

/* ===== HARITA MARKER (pin + label) ===== */
.rota-marker { background: transparent !important; border: none !important; }

.rota-pin {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    width: 32px;
    height: 32px;
    color: var(--orange);
    filter: drop-shadow(0 3px 6px rgba(0,0,0,0.18));
    transition: transform .2s var(--ease-spring), color .2s var(--ease);
    cursor: pointer;
}
.rota-pin svg { width: 100%; height: 100%; display: block; }
.rota-marker:hover .rota-pin { transform: translateX(-50%) translateY(-3px) scale(1.12); color: var(--orange-hover); }
.rota-marker.active .rota-pin { transform: translateX(-50%) scale(1.18); color: var(--orange-hover); }

.rota-pin-label {
    position: absolute;
    top: 34px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--bg);
    color: var(--dark);
    font-size: 0.72rem;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 10px;
    border: 1px solid var(--border);
    white-space: nowrap;
    box-shadow: var(--shadow-xs);
    pointer-events: none;
    transition: background .2s var(--ease), color .2s var(--ease);
}
.rota-marker:hover .rota-pin-label,
.rota-marker.active .rota-pin-label {
    background: var(--orange);
    color: #fff;
    border-color: var(--orange);
}

.rota-pin-badge {
    position: absolute;
    top: -4px;
    left: calc(50% + 9px);
    background: var(--orange);
    color: #fff;
    font-size: 0.62rem;
    font-weight: 700;
    min-width: 16px;
    height: 16px;
    line-height: 16px;
    padding: 0 4px;
    border-radius: 10px;
    border: 1.5px solid #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
    text-align: center;
    pointer-events: none;
}

/* ===== HARITA POPUP ===== */
.leaflet-popup-content-wrapper {
    border-radius: var(--r-sm);
    box-shadow: var(--shadow-md);
    border: 1px solid var(--border);
    padding: 0;
}
.leaflet-popup-content { margin: 12px 14px; line-height: 1.5; }
.leaflet-popup-tip { box-shadow: var(--shadow-sm); }

.rota-pop { display: flex; flex-direction: column; gap: 2px; min-width: 140px; }
.rota-pop strong { font-size: 0.95rem; color: var(--dark); }
.rota-pop span { font-size: 0.78rem; color: var(--orange); font-weight: 600; }
.rota-pop a {
    margin-top: 6px;
    font-size: 0.78rem;
    color: var(--orange);
    font-weight: 600;
    border-top: 1px solid var(--border);
    padding-top: 6px;
}
.rota-pop a:hover { color: var(--orange-hover); }

/* ===== ALTTAKI SEHIR CIP'LERI ===== */
.sehir-chip-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.sehir-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--bg);
    border: 1.5px solid var(--border);
    border-radius: 999px;
    padding: 6px 12px 6px 12px;
    font-family: inherit;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--text);
    cursor: pointer;
    transition: all .2s var(--ease);
}
.sehir-chip:hover {
    border-color: var(--orange);
    color: var(--orange);
    transform: translateY(-1px);
    box-shadow: var(--shadow-xs);
}
.sehir-chip.active {
    background: var(--orange);
    border-color: var(--orange);
    color: #fff;
}
.sehir-chip-count {
    background: var(--orange-light);
    color: var(--orange);
    font-size: 0.7rem;
    font-weight: 700;
    padding: 1px 7px;
    border-radius: 999px;
    min-width: 20px;
    text-align: center;
}
.sehir-chip.active .sehir-chip-count {
    background: rgba(255,255,255,0.25);
    color: #fff;
}

.sehir-panel {
    background: var(--bg);
    border-radius: var(--r);
    padding: 28px;
    border: 1px solid var(--border);
    position: sticky;
    top: 92px;
    max-height: 520px;
    overflow-y: auto;
}

.sehir-panel::-webkit-scrollbar{width:3px}
.sehir-panel::-webkit-scrollbar-thumb{background:var(--orange);border-radius:3px}

.sehir-panel h3 { font-family:'DM Serif Display',serif; font-size:1.3rem; color:var(--dark); }
.sehir-panel .rota-count { color:var(--orange); font-weight:600; font-size:0.82rem; margin-bottom:18px; display:block; }

.sehir-rota-list{list-style:none}
.sehir-rota-list li{border-bottom:1px solid var(--border)}
.sehir-rota-list li:last-child{border-bottom:none}

.sehir-rota-list a {
    display: block;
    padding: 14px 0 14px 18px;
    color: var(--text);
    font-weight: 600;
    font-size: 0.9rem;
    position: relative;
    transition: all .2s var(--ease);
}

.sehir-rota-list a::before {
    content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);
    width:6px;height:6px;background:var(--orange);border-radius:50%;
}

.sehir-rota-list a:hover{color:var(--orange);padding-left:24px}

.sehir-rota-list .rota-desc{font-size:0.78rem;color:var(--text-3);font-weight:400;display:block;margin-top:2px}

/* ===== CARDS — Airbnb Style ===== */
.card-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.card {
    background: var(--bg-card);
    border-radius: var(--r);
    overflow: hidden;
    transition: all .3s var(--ease);
    cursor: pointer;
    border: 1px solid transparent;
}

.card:hover {
    box-shadow: var(--shadow-card-hover);
    transform: translateY(-4px);
}

.card-img {
    width: 100%;
    height: 220px;
    background: linear-gradient(145deg, #F5EDE3, #E8D8C8);
    position: relative;
    overflow: hidden;
    border-radius: var(--r) var(--r) 0 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
}

.card-img img {
    width:100%;height:100%;object-fit:cover;
    transition: transform .5s var(--ease);
}

.card:hover .card-img img { transform: scale(1.05); }

.card-body { padding: 20px; }

.card-badge {
    display: inline-block;
    background: var(--orange-light);
    color: var(--orange);
    padding: 3px 10px;
    border-radius: 6px;
    font-size: 0.7rem;
    font-weight: 700;
    margin-bottom: 10px;
    margin-right: 4px;
    letter-spacing: 0.3px;
}

.card-title {
    font-family: 'DM Serif Display', serif;
    font-size: 1.15rem;
    color: var(--dark);
    margin-bottom: 8px;
    line-height: 1.3;
}

.card-title a{color:inherit}
.card-title a:hover{color:var(--orange)}

.card-text {
    color: var(--text-3);
    font-size: 0.85rem;
    margin-bottom: 16px;
    line-height: 1.55;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 16px;
    border-top: 1px solid var(--border);
}

.card-meta { font-size: 0.78rem; color: var(--text-4); font-weight: 500; }

/* ===== BUTTONS ===== */
.btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 24px;
    border-radius: var(--r-xs);
    font-weight: 600;
    font-size: 0.85rem;
    cursor: pointer;
    transition: all .2s var(--ease);
    border: none;
    font-family: inherit;
    text-decoration: none;
    line-height: 1.4;
}

.btn-primary {
    background: var(--orange);
    color: #fff;
}
.btn-primary:hover{background:var(--orange-hover);color:#fff;transform:translateY(-1px);box-shadow:0 4px 12px rgba(232,115,26,0.25)}

.btn-outline {
    background: transparent;
    color: var(--dark);
    border: 1.5px solid var(--border);
}
.btn-outline:hover{border-color:var(--dark);color:var(--dark)}

.btn-dark{background:var(--dark);color:#fff}
.btn-dark:hover{background:var(--dark-700);color:#fff}

.btn-kahve{background:var(--dark-700);color:#fff}
.btn-kahve:hover{background:var(--dark-800);color:#fff}

.btn-sm{padding:8px 16px;font-size:0.8rem;border-radius:var(--r-xs)}
.btn-lg{padding:14px 32px;font-size:0.92rem;border-radius:var(--r-sm)}

/* ===== ROTA DETAY ===== */
.rota-hero {
    position: relative;
    height: 480px;
    background: var(--dark);
    overflow: hidden;
    margin-top: 72px;
}

.rota-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0.7}

.rota-hero-overlay {
    position: relative;
    z-index: 1;
    height: 100%;
    display: flex;
    align-items: flex-end;
    background: linear-gradient(to top, rgba(0,0,0,0.65), rgba(0,0,0,0.15), transparent);
}

.rota-hero-overlay .container { padding-bottom: 48px; }

.rota-hero-overlay h1 {
    font-family:'DM Serif Display',serif;
    font-size: 2.8rem;
    color: #fff;
    margin-bottom: 8px;
}

.breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.82rem;
    margin-bottom: 28px;
    color: var(--text-3);
}

.breadcrumb a{color:var(--orange);font-weight:500}

.rota-content {
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 48px;
    padding: 48px 0;
}

.rota-text h2 {
    font-family:'DM Serif Display',serif;
    color:var(--dark);
    font-size:1.5rem;
    margin:32px 0 14px;
}

.rota-text p{margin-bottom:14px;line-height:1.8;color:var(--text-2);font-size:0.95rem}

.rota-sidebar .sidebar-card {
    background:var(--bg);
    border-radius:var(--r);
    padding:24px;
    border:1px solid var(--border);
    margin-bottom:20px;
}

.sidebar-card h3 {
    font-family:'DM Serif Display',serif;
    color:var(--dark);
    font-size:1.1rem;
    margin-bottom:16px;
    padding-bottom:12px;
    border-bottom:1px solid var(--border);
}

.info-list{list-style:none}
.info-list li{padding:10px 0;border-bottom:1px solid var(--border);display:flex;align-items:flex-start;gap:10px;font-size:0.88rem;color:var(--text-2)}
.info-list li:last-child{border-bottom:none}
.info-list .info-icon{font-size:1rem;flex-shrink:0;margin-top:2px}

/* ===== BLOG ===== */
.blog-content{max-width:720px;margin:0 auto;padding:120px 24px 64px}

.blog-content .blog-header{margin-bottom:32px}

.blog-content .blog-header h1 {
    font-family:'DM Serif Display',serif;
    font-size:2.4rem;
    color:var(--dark);
    margin-bottom:18px;
    line-height:1.2;
}

.blog-meta{display:flex;align-items:center;gap:16px;color:var(--text-3);font-size:0.82rem;flex-wrap:wrap}
.blog-meta span{display:flex;align-items:center;gap:5px;font-weight:500}

.blog-body{line-height:1.85;color:var(--text-2);font-size:1rem}
.blog-body h2{font-family:'DM Serif Display',serif;color:var(--dark);font-size:1.5rem;margin:36px 0 14px}
.blog-body h3{color:var(--dark);margin:24px 0 10px;font-size:1.1rem}
.blog-body ul,.blog-body ol{margin:14px 0;padding-left:22px}
.blog-body li{margin-bottom:8px}
.blog-body p{margin-bottom:16px}

/* ===== REHBER ===== */
.rehber-slider {
    display: flex;
    gap: 20px;
    overflow-x: auto;
    padding: 16px 4px;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
}

.rehber-slider::-webkit-scrollbar{height:3px}
.rehber-slider::-webkit-scrollbar-thumb{background:var(--orange);border-radius:3px}

.rehber-card {
    min-width: 290px;
    max-width: 320px;
    background:var(--bg);
    border-radius:var(--r);
    overflow:hidden;
    border:1px solid var(--border);
    scroll-snap-align:start;
    flex-shrink:0;
    transition:all .3s var(--ease);
}

.rehber-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-card)}

.rehber-card-img{height:180px;background:linear-gradient(145deg,#F5EDE3,#E8D8C8);display:flex;align-items:center;justify-content:center;font-size:3.5rem}
.rehber-card-img img{width:100%;height:100%;object-fit:cover}

.rehber-card-body{padding:20px}
.rehber-card-body h3{font-family:'DM Serif Display',serif;color:var(--dark);margin-bottom:6px;font-size:1rem}
.rehber-card-body p{color:var(--text-3);font-size:0.82rem;margin-bottom:14px;line-height:1.5}
.rehber-price{font-weight:700;color:var(--orange);font-size:1rem}
.rehber-card-footer{display:flex;align-items:center;justify-content:space-between;margin-top:10px}

/* ===== YORUM ===== */
.yorumlar-section{margin-top:40px}

.yorum-item{background:var(--bg-warm);border-radius:var(--r-sm);padding:20px;margin-bottom:12px}
.yorum-item .yorum-header{display:flex;align-items:center;gap:12px;margin-bottom:10px}

.yorum-avatar {
    width:40px;height:40px;border-radius:50%;
    background:linear-gradient(135deg,var(--orange-light),#FFD4B2);
    display:flex;align-items:center;justify-content:center;
    color:var(--orange);font-weight:700;font-size:1rem;
}

.yorum-ad{font-weight:600;color:var(--dark);font-size:0.9rem}
.yorum-tarih{font-size:0.75rem;color:var(--text-4)}

.yorum-form{background:var(--bg-warm);border-radius:var(--r);padding:28px;margin-top:24px}
.yorum-form h3{font-family:'DM Serif Display',serif;color:var(--dark);margin-bottom:20px;font-size:1.2rem}

/* ===== FORM ===== */
.form-group{margin-bottom:16px}
.form-group label{display:block;font-weight:600;margin-bottom:6px;color:var(--text);font-size:0.82rem}

.form-control {
    width:100%;
    padding:12px 16px;
    border:1.5px solid var(--border);
    border-radius:var(--r-xs);
    font-size:0.92rem;
    font-family:inherit;
    transition:all .2s var(--ease);
    background:var(--bg);
    color:var(--text);
}

.form-control:focus{outline:none;border-color:var(--orange);box-shadow:0 0 0 3px var(--orange-glow)}
.form-control::placeholder{color:var(--text-4)}
textarea.form-control{min-height:100px;resize:vertical}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}

/* ===== NEWSLETTER ===== */
.newsletter {
    background: var(--dark);
    padding: 80px 0;
    position: relative;
    overflow: hidden;
}

.newsletter::before {
    content:'';position:absolute;
    width:500px;height:500px;
    background:radial-gradient(circle,rgba(232,115,26,0.08) 0%,transparent 70%);
    top:-200px;right:-100px;
}

.newsletter-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: center;
    position: relative;
    z-index: 1;
}

.newsletter-text h2{font-family:'DM Serif Display',serif;font-size:2rem;color:#fff;margin-bottom:10px}
.newsletter-text p{color:rgba(255,255,255,0.5);font-size:0.92rem;line-height:1.6}

.newsletter-form{display:flex;gap:0;background:rgba(255,255,255,0.08);border-radius:var(--r-sm);overflow:hidden;border:1px solid rgba(255,255,255,0.1)}
.newsletter-form input{flex:1;padding:14px 20px;border:none;font-size:0.88rem;font-family:inherit;background:transparent;color:#fff;outline:none}
.newsletter-form input::placeholder{color:rgba(255,255,255,0.35)}
.newsletter-form button{padding:14px 28px;background:var(--orange);color:#fff;border:none;font-weight:600;cursor:pointer;font-family:inherit;transition:background .2s;font-size:0.85rem}
.newsletter-form button:hover{background:var(--orange-hover)}

/* ===== FOOTER ===== */
.footer{background:var(--dark);color:rgba(255,255,255,0.5);padding:64px 0 0;border-top:1px solid rgba(255,255,255,0.06)}

.footer-grid{display:grid;grid-template-columns:1.8fr 1fr 1fr 1fr;gap:40px;margin-bottom:48px}

.footer h4{color:#fff;font-weight:600;margin-bottom:16px;font-size:0.9rem;letter-spacing:0.3px}
.footer p{font-size:0.85rem;line-height:1.6}

.footer-links{list-style:none}
.footer-links li{margin-bottom:8px}
.footer-links a{color:rgba(255,255,255,0.4);font-size:0.85rem;transition:color .2s}
.footer-links a:hover{color:var(--orange)}

.footer-bottom{border-top:1px solid rgba(255,255,255,0.06);padding:20px 0;text-align:center;font-size:0.78rem;color:rgba(255,255,255,0.25)}

/* ===== PAGE HERO ===== */
.page-hero {
    padding: 130px 0 64px;
    text-align: center;
    background: var(--bg-warm);
    border-bottom: 1px solid var(--border);
}

.page-hero h1{font-family:'DM Serif Display',serif;font-size:2.8rem;color:var(--dark);margin-bottom:10px;position:relative;z-index:2}
.page-hero p{color:var(--text-3);font-size:0.95rem;position:relative;z-index:2}

.page-hero--rotalar,
.page-hero--hakkinda,
.page-hero--rehber,
.page-hero--blog,
.page-hero--deneyimler,
.page-hero--iletisim,
.page-hero--sehir{
    position:relative;
    overflow:hidden;
    background-color:var(--bg-warm);
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
}
.page-hero--rotalar{background-image:url('../images/hero-rotalar.jpg')}
.page-hero--hakkinda{background-image:url('../images/hero-hakkinda.jpg')}
.page-hero--rehber{background-image:url('../images/hero-rehber.jpg')}
.page-hero--blog{background-image:url('../images/hero-blog.jpg')}
.page-hero--deneyimler{background-image:url('../images/hero-deneyimler.jpg')}
.page-hero--iletisim{background-image:url('../images/hero-iletisim.jpg')}
.page-hero--sehir{background-image:url('../images/hero-sehir-rotalar.jpg')}
.page-hero--rotalar::after,
.page-hero--hakkinda::after,
.page-hero--rehber::after,
.page-hero--blog::after,
.page-hero--deneyimler::after,
.page-hero--iletisim::after,
.page-hero--sehir::after{
    content:"";
    position:absolute;inset:0;
    background:
        linear-gradient(180deg,
            rgba(250,248,245,0.70) 0%,
            rgba(250,248,245,0.40) 45%,
            rgba(250,248,245,0.88) 92%,
            rgba(250,248,245,1) 100%);
    pointer-events:none;
    z-index:1;
}
.page-hero--rotalar .container,
.page-hero--hakkinda .container,
.page-hero--rehber .container,
.page-hero--blog .container,
.page-hero--deneyimler .container,
.page-hero--iletisim .container,
.page-hero--sehir .container{position:relative;z-index:2}

/* ===== ABOUT ===== */
.about-content{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}

.about-text h2{font-family:'DM Serif Display',serif;color:var(--dark);font-size:2rem;margin-bottom:18px}

.about-img{border-radius:var(--r-lg);overflow:hidden;background:linear-gradient(145deg,#F5EDE3,#E8D8C8);height:360px;display:flex;align-items:center;justify-content:center;font-size:5rem;box-shadow:var(--shadow-card)}
.about-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s var(--ease)}
.about-img:hover img{transform:scale(1.04)}

/* ===== CONTACT ===== */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px}

.contact-info-card{background:var(--bg);border-radius:var(--r);padding:32px;border:1px solid var(--border)}
.contact-info-card h3{font-family:'DM Serif Display',serif;color:var(--dark);margin-bottom:20px;font-size:1.2rem}

.contact-item{display:flex;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid var(--border)}
.contact-item:last-child{border-bottom:none}
.contact-icon{width:44px;height:44px;background:var(--orange-light);border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0}

/* ===== DENEYIM ===== */
.deneyim-hero{background:var(--dark);color:#fff;padding:140px 0 80px;text-align:center}
.deneyim-content{max-width:720px;margin:0 auto;padding:48px 24px}

/* ===== 404 ===== */
.page-404{text-align:center;padding:160px 24px 100px}
.page-404 h1{font-family:'DM Serif Display',serif;font-size:7rem;color:var(--orange);line-height:1}
.page-404 p{font-size:1.05rem;color:var(--text-3);margin-bottom:28px}

/* ===== TOAST ===== */
.toast{position:fixed;bottom:28px;right:28px;padding:14px 24px;border-radius:var(--r-xs);color:#fff;font-weight:600;font-size:0.85rem;z-index:999;transform:translateY(80px);opacity:0;transition:all .35s var(--ease)}
.toast.show{transform:translateY(0);opacity:1}
.toast.success{background:#1a7f37}
.toast.error{background:#cf222e}

/* ===== STATS ===== */
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}

.stat-card{background:var(--bg);border-radius:var(--r);padding:28px;text-align:center;border:1px solid var(--border);transition:all .25s var(--ease)}
.stat-card:hover{border-color:var(--orange);transform:translateY(-2px)}
.stat-card .stat-num{font-size:2.4rem;font-weight:700;color:var(--orange);line-height:1}
.stat-card .stat-label{color:var(--text-3);font-size:0.82rem;margin-top:6px;font-weight:500}

/* ===== LOADING ===== */
.loading{text-align:center;padding:32px;color:var(--text-4)}
.loading::after{content:'';display:inline-block;width:18px;height:18px;border:2px solid var(--border);border-top-color:var(--orange);border-radius:50%;animation:spin .7s linear infinite;margin-left:8px;vertical-align:middle}
@keyframes spin{to{transform:rotate(360deg)}}

/* ===== ADMIN ===== */
.admin-wrapper{display:grid;grid-template-columns:250px 1fr;min-height:100vh}

.admin-sidebar{background:var(--dark);padding:20px 0;color:#fff}
.admin-sidebar .admin-logo{padding:16px 20px;font-size:1.15rem;font-weight:700;border-bottom:1px solid rgba(255,255,255,0.06);margin-bottom:16px}
.admin-sidebar .admin-logo span{color:var(--orange)}

.admin-nav{list-style:none}
.admin-nav a{display:flex;align-items:center;gap:10px;padding:11px 20px;color:rgba(255,255,255,0.45);font-weight:500;font-size:0.85rem;transition:all .2s;border-left:3px solid transparent}
.admin-nav a:hover{background:rgba(255,255,255,0.04);color:rgba(255,255,255,0.8);border-left-color:rgba(232,115,26,0.3)}
.admin-nav a.active{background:rgba(232,115,26,0.06);color:var(--orange);border-left-color:var(--orange)}

.admin-content{padding:28px;background:var(--bg-warm);overflow-y:auto}

.admin-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}
.admin-header h1{font-family:'DM Serif Display',serif;color:var(--dark);font-size:1.5rem}

.admin-table{width:100%;background:var(--bg);border-radius:var(--r);overflow:hidden;border:1px solid var(--border)}
.admin-table th{background:var(--dark);color:#fff;padding:12px 16px;text-align:left;font-weight:600;font-size:0.82rem}
.admin-table td{padding:12px 16px;border-bottom:1px solid var(--border);font-size:0.85rem}
.admin-table tr:hover td{background:var(--orange-light)}

.admin-form{background:var(--bg);border-radius:var(--r);padding:28px;border:1px solid var(--border)}

.admin-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:16px;margin-bottom:28px}

.admin-login{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg-warm)}

.login-box{background:var(--bg);border-radius:var(--r-lg);padding:44px;width:100%;max-width:400px;box-shadow:var(--shadow-xl);text-align:center;border:1px solid var(--border)}
.login-box h1{font-family:'DM Serif Display',serif;color:var(--dark);margin-bottom:6px;font-size:1.7rem}
.login-box .login-subtitle{color:var(--text-4);margin-bottom:24px;font-size:0.85rem}

.alert{padding:12px 16px;border-radius:var(--r-xs);margin-bottom:14px;font-size:0.85rem;font-weight:500}
.alert-danger{background:#FEE2E2;color:#DC2626}
.alert-success{background:#D1FAE5;color:#059669}

/* ===== RESPONSIVE ===== */
@media(max-width:768px){
    .mobile-toggle{display:block}
    .nav{display:none;position:absolute;top:100%;left:0;right:0;background:rgba(255,255,255,0.98);backdrop-filter:blur(16px);flex-direction:column;padding:12px;border-bottom:1px solid var(--border)}
    .nav.open{display:flex}
    .nav a{width:100%;text-align:center;padding:12px;border-radius:var(--r-xs)}

    .hero{min-height:auto;padding:100px 0 60px}
    .hero-grid{grid-template-columns:1fr;gap:32px}
    .hero h1{font-size:2.4rem}
    .hero-right{height:300px}
    .hero-float-card{display:none}
    .hero-stats{gap:24px}
    .hero-search{max-width:100%}

    .section{padding:64px 0}
    .section-header{flex-direction:column;align-items:flex-start}
    .section-title{font-size:1.7rem}

    .card-grid{grid-template-columns:1fr}
    .harita-wrapper{grid-template-columns:1fr}
    .turkiye-map{height:360px}
    .sehir-panel{position:static;max-height:none}
    .rota-content{grid-template-columns:1fr}
    .newsletter-inner{grid-template-columns:1fr;gap:24px;text-align:center}
    .newsletter-form{flex-direction:column}
    .newsletter-form button{border-radius:0}
    .footer-grid{grid-template-columns:1fr 1fr;gap:24px}
    .about-content{grid-template-columns:1fr}
    .contact-grid{grid-template-columns:1fr}
    .form-row{grid-template-columns:1fr}
    .stats-grid{grid-template-columns:1fr 1fr}

    .page-hero{padding:100px 0 48px}
    .page-hero h1{font-size:2rem}

    .blog-content{padding:96px 20px 48px}
    .blog-content .blog-header h1{font-size:1.7rem}

    .rota-hero{height:300px;margin-top:72px}
    .rota-hero-overlay h1{font-size:1.8rem}

    .admin-wrapper{grid-template-columns:1fr}
    .admin-sidebar{position:fixed;left:-250px;top:0;bottom:0;width:250px;z-index:1000;transition:left .3s var(--ease)}
    .admin-sidebar.open{left:0}
}

@media(max-width:480px){
    .hero h1{font-size:2rem}
    .footer-grid{grid-template-columns:1fr}
    .turkiye-map{height:300px}
    .sehir-chip{font-size:0.75rem;padding:5px 10px}
    .hero-stats{flex-wrap:wrap;gap:20px}
    .stats-grid{grid-template-columns:1fr 1fr}
    .card-grid{grid-template-columns:1fr}
}

/* ===== PLACEHOLDER & MISSING CLASSES ===== */
.card-img-placeholder,
.hero-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background: linear-gradient(145deg, #F5EDE3, #E8D8C8);
}

.hero-search-icon {
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
}

.hero-search {
    position: relative;
}

.hero-search input {
    padding-left: 44px !important;
}

.footer-brand {
    font-family: 'DM Serif Display', serif;
    font-size: 1.3rem !important;
    letter-spacing: -0.3px;
}

.footer-brand span { color: var(--orange); }

.logo-svg { width: 220px; height: 52px; }

@media(min-width:769px) {
    .logo-svg { width: 240px; height: 56px; }
}

.contact-icon {
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--orange);
    letter-spacing: 0.3px;
}

/* ===== SCROLL REVEAL ANIMATIONS ===== */
.reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 0.8s var(--ease), transform 0.8s var(--ease);
}

.reveal.visible {
    opacity: 1;
    transform: translateY(0);
}

.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }

/* Hero entrance animations */
.hero-badge {
    animation: slideUp 0.7s var(--ease) 0.1s both;
}

.hero h1 {
    animation: slideUp 0.7s var(--ease) 0.2s both;
}

.hero-desc {
    animation: slideUp 0.7s var(--ease) 0.3s both;
}

.hero-search {
    animation: slideUp 0.7s var(--ease) 0.4s both;
}

.hero-stats {
    animation: slideUp 0.7s var(--ease) 0.5s both;
}

.hero-right {
    animation: slideLeft 0.9s var(--ease) 0.3s both;
}

@keyframes slideUp {
    from { opacity: 0; transform: translateY(32px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes slideLeft {
    from { opacity: 0; transform: translateX(48px); }
    to { opacity: 1; transform: translateX(0); }
}

/* Card stagger animation */
.card {
    animation: cardIn 0.6s var(--ease) both;
}

.card:nth-child(1) { animation-delay: 0.1s; }
.card:nth-child(2) { animation-delay: 0.2s; }
.card:nth-child(3) { animation-delay: 0.3s; }
.card:nth-child(4) { animation-delay: 0.4s; }
.card:nth-child(5) { animation-delay: 0.5s; }
.card:nth-child(6) { animation-delay: 0.6s; }

@keyframes cardIn {
    from { opacity: 0; transform: translateY(24px) scale(0.97); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

/* Sehir chip stagger */
.sehir-chip { animation: cardIn 0.4s var(--ease) both; }
.sehir-chip:nth-child(1) { animation-delay: 0.05s; }
.sehir-chip:nth-child(2) { animation-delay: 0.08s; }
.sehir-chip:nth-child(3) { animation-delay: 0.11s; }
.sehir-chip:nth-child(4) { animation-delay: 0.14s; }
.sehir-chip:nth-child(5) { animation-delay: 0.17s; }
.sehir-chip:nth-child(6) { animation-delay: 0.20s; }
.sehir-chip:nth-child(7) { animation-delay: 0.23s; }
.sehir-chip:nth-child(8) { animation-delay: 0.26s; }
.sehir-chip:nth-child(9) { animation-delay: 0.29s; }
.sehir-chip:nth-child(10){ animation-delay: 0.32s; }

/* Button press effect */
.btn:active {
    transform: scale(0.97);
}

/* Page hero animation */
.page-hero h1 {
    animation: slideUp 0.6s var(--ease) 0.1s both;
}

.page-hero p {
    animation: slideUp 0.6s var(--ease) 0.2s both;
}

/* Smooth link underline animation */
.nav a::before {
    content: '';
    position: absolute;
    bottom: 4px;
    left: 50%;
    width: 0;
    height: 2px;
    background: var(--orange);
    transition: all 0.3s var(--ease);
    transform: translateX(-50%);
    border-radius: 2px;
}

.nav a:hover::before {
    width: 24px;
}

.nav a.active::before {
    display: none;
}

/* Float card pulse */
.hero-float-card {
    animation: float-card 4s ease-in-out infinite, slideUp 0.8s var(--ease) 0.6s both;
}

/* Stat counter pulse on hover */
.stat-card:hover .stat-num {
    animation: pulse 0.4s var(--ease);
}

@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.1); }
    100% { transform: scale(1); }
}

/* Toast slide-in */
.toast.show {
    animation: toastIn 0.4s var(--ease-spring);
}

@keyframes toastIn {
    from { transform: translateY(80px) scale(0.9); opacity: 0; }
    to { transform: translateY(0) scale(1); opacity: 1; }
}

/* Newsletter shimmer effect */
.newsletter::after {
    content: '';
    position: absolute;
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(245,166,35,0.06) 0%, transparent 70%);
    bottom: -100px;
    left: -50px;
    animation: float-card 6s ease-in-out infinite reverse;
}

/* Sidebar card hover lift */
.sidebar-card {
    transition: all 0.3s var(--ease);
}

.sidebar-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-sm);
}

/* ===== PRELOADER ===== */
.preloader {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: var(--bg);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: opacity 0.5s var(--ease), visibility 0.5s var(--ease);
}

.preloader.hide {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.preloader-logo {
    margin-bottom: 32px;
    animation: preloaderPulse 1.5s var(--ease) infinite;
}

.preloader-logo svg {
    width: 240px;
    height: 64px;
}

.preloader-bar {
    width: 160px;
    height: 3px;
    background: var(--border);
    border-radius: 3px;
    overflow: hidden;
    position: relative;
}

.preloader-bar::after {
    content: '';
    position: absolute;
    left: -40%;
    top: 0;
    height: 100%;
    width: 40%;
    background: linear-gradient(90deg, transparent, var(--orange), transparent);
    border-radius: 3px;
    animation: preloaderSlide 1.2s var(--ease) infinite;
}

@keyframes preloaderPulse {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.02); opacity: 0.8; }
}

@keyframes preloaderSlide {
    0% { left: -40%; }
    100% { left: 100%; }
}