:root {
    --primary: #1e3a8a;       /* Derin Lacivert */
    --accent: #0284c7;        /* Yumuşak ve Tok Safir Mavi */
    --sky: #38bdf8;           /* Yardımcı Açık Mavi */
    --white: #ffffff;
    --light-bg: #f8fafc;
    --transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

* { margin: 0; padding: 0; box-sizing: border-box; font-family: 'Plus Jakarta Sans', sans-serif; }
html, body { height: 100%; }
body { display: flex; flex-direction: column; background: var(--white); color: var(--primary); -webkit-font-smoothing: antialiased; overflow-x: hidden; width: 100%; }

/* Fix Google Translate font break on notranslate elements */
.notranslate, .notranslate * {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
}
main { flex: 1; }
.container { max-width: 1300px; margin: 0 auto; padding: 0 25px; }

/* GLOBAL PREMIUM INPUT STYLES */
.field { margin-bottom: 20px; }
.field label { display: block; font-size: 11px; font-weight: 800; color: #94a3b8; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 8px; }
.field input, .field select, .field textarea { 
    width: 100%; padding: 15px 20px; background: #fff; border: 2px solid #f1f5f9; 
    border-radius: 15px; font-size: 14px; font-weight: 700; color: var(--primary); 
    outline: none; transition: 0.3s;
}
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--accent); background: #fff; box-shadow: 0 10px 20px rgba(2, 132, 199, 0.05); }
.field select { cursor: pointer; appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%231e3a8a'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 15px center; background-size: 18px; }

.input-row.split { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
@media (max-width: 768px) { .input-row.split { grid-template-columns: 1fr; } }




/* MODERN FLOATING NAVBAR */
header {
    position: fixed;
    width: 100%;
    top: 70px; /* Ticker'dan sonra daha aşağıda konumlandırdım */
    left: 0;
    z-index: 1000;
    transition: var(--transition);
}

header .container {
    background: rgba(240, 244, 255, 0.85);
    backdrop-filter: blur(15px);
    border: 1px solid rgba(2, 132, 199, 0.35); /* OZVA 17 Agu: beyaz sayfada ceper gorunmuyordu, tema mavisi */
    padding: 12px 30px;
    border-radius: 100px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

header.scrolled { top: 0; }
header.scrolled .container {
    border-radius: 0;
    max-width: 100%;
    background: rgba(255, 255, 255, 0.98);
    border-bottom: 1px solid #f1f5f9;
}

header.subpage-header { background: transparent; }
header.subpage-header .container { background: rgba(255, 255, 255, 0.95); }
.nav-links a.active { color: var(--accent); opacity: 1; border-bottom: 2px solid var(--accent); padding-bottom: 5px; }

.logo a { font-size: 20px; font-weight: 800; color: var(--primary); text-decoration: none; letter-spacing: -0.5px; }
.logo span { color: var(--accent); }

.nav-menu { display: flex; align-items: center; gap: 40px; }
.nav-links { display: flex; list-style: none; gap: 25px; }
.nav-links a { text-decoration: none; color: var(--primary); font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; transition: 0.3s; opacity: 0.7; }
.nav-links a:hover { color: var(--accent); opacity: 1; }

/* LANG & CURRENCY SWITCHER */
.nav-contact { display: flex; align-items: center; gap: 15px; }
.lang-switcher, .currency-switcher { position: relative; }
.lang-btn, .curr-btn { 
    display: flex; align-items: center; gap: 8px; background: rgba(2, 132, 199, 0.05); 
    padding: 8px 15px; border-radius: 50px; cursor: pointer; transition: 0.3s;
    font-size: 11px; font-weight: 800; color: var(--primary);
}
.lang-btn:hover, .curr-btn:hover { background: rgba(2, 132, 199, 0.1); }
.lang-btn i, .curr-btn i { font-size: 10px; opacity: 0.5; }

.lang-dropdown, .curr-dropdown { 
    position: absolute; top: calc(100% + 10px); right: 0; background: #fff; 
    border-radius: 15px; padding: 10px; box-shadow: 0 15px 40px rgba(0,0,0,0.1); 
    display: none; min-width: 130px; z-index: 1000; border: 1px solid rgba(0,0,0,0.05);
}
.lang-switcher:hover .lang-dropdown, .currency-switcher:hover .curr-dropdown,
.lang-switcher.active .lang-dropdown, .currency-switcher.active .curr-dropdown { display: block; }

/* Dropdown Bridge to prevent closing on mouse move */
.lang-dropdown::before, .curr-dropdown::before {
    content: '';
    position: absolute;
    top: -15px;
    left: 0;
    right: 0;
    height: 15px;
    background: transparent;
}
.lang-dropdown a, .curr-dropdown a { 
    display: flex; align-items: center; gap: 10px; padding: 8px 12px; 
    text-decoration: none; color: var(--primary); font-size: 12px; font-weight: 600;
    border-radius: 10px; transition: 0.2s;
}
.lang-dropdown a:hover, .curr-dropdown a:hover { background: var(--light-bg); color: var(--accent); }
.lang-dropdown img { width: 20px; border-radius: 2px; }

.nav-contact .phone-link {
    display: flex; align-items: center; gap: 10px; background: var(--primary);
    color: #fff; padding: 10px 25px; border-radius: 50px; text-decoration: none; font-size: 13px; font-weight: 700; transition: var(--transition);
}
.nav-contact .phone-link i { color: var(--accent); }
.nav-contact .phone-link:hover { background: var(--accent); color: var(--white); transform: translateY(-2px); box-shadow: 0 10px 20px rgba(2, 132, 199, 0.3); }

/* HERO SECTION */
.hero { min-height: 100vh; padding-top: 160px; padding-bottom: 60px; background-position: center; background-size: cover; display: flex; align-items: center; position: relative; }
.hero-overlay { position: absolute; inset: 0; background: linear-gradient(to right, rgba(2, 6, 23, 0.95) 10%, rgba(2, 6, 23, 0.4) 100%); }
.hero-content { position: relative; z-index: 100; display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 60px; align-items: center; }

.hero-text h1 { 
    font-size: 3.2rem; 
    font-weight: 800; 
    color: #fff; 
    line-height: 1.1;
}

.typewriter-container {
    display: block;
    width: 100%; 
    min-height: 1.2em;
    white-space: nowrap;
    text-align: left;
    margin: 0;
    overflow: visible;
}

#typewriter { 
    color: var(--accent);
    display: inline;
}

#typewriter::after {
    content: '|';
    margin-left: 5px;
    color: var(--accent);
    animation: typewriter-blink 0.75s step-end infinite;
}

@keyframes typewriter-blink {
    from, to { opacity: 0; }
    50% { opacity: 1; }
}

/* Subpage Hero Adjustment */
.page-hero {
    padding-top: 180px !important;
    padding-bottom: 80px !important;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.page-hero .container {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.hero-text h1 small { display: block; font-size: 1.8rem; color: rgba(255,255,255,0.7); margin-top: 5px; font-weight: 700; }
.hero-text p { font-size: 18px; margin: 20px 0 30px; color: rgba(255,255,255,0.8); max-width: 500px; }
.badge { color: var(--accent); font-weight: 800; font-size: 11px; letter-spacing: 3px; text-transform: uppercase; margin-bottom: 15px; display: block; }

/* HERO BUTTONS */
.hero-btns { display: flex; gap: 20px; margin-top: 30px; }
.btn-primary { 
    padding: 16px 35px; background: var(--primary); color: #fff; text-decoration: none; 
    border-radius: 50px; font-size: 14px; font-weight: 700; transition: var(--transition);
    box-shadow: 0 10px 25px rgba(30, 58, 138, 0.2);
}
.btn-primary:hover { background: var(--accent); transform: translateY(-3px); box-shadow: 0 15px 30px rgba(2, 132, 199, 0.3); color: #fff; }

.btn-outline { 
    padding: 16px 35px; color: #fff; text-decoration: none; 
    /* OZVA 17 Agu: hero fotografi ustunde butonlar zor gorunuyordu — blur + koyu zemin */
    background: rgba(15, 23, 42, 0.35); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
    border: 2px solid rgba(255,255,255,0.45); border-radius: 50px; font-size: 14px; font-weight: 700; transition: var(--transition);
}
.btn-outline:hover { background: #fff; color: var(--primary); border-color: #fff; transform: translateY(-3px); }
.trust-bar { 
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
    padding: 40px 0; 
    margin-top: -60px; /* Hero'nun üzerine bindirdim */
    background: #fff;
    border-radius: 30px;
    box-shadow: 0 20px 50px rgba(0,0,0,0.08);
    position: relative;
    z-index: 10;
}
.trust-item { 
    flex: 1; 
    display: flex; 
    align-items: center; 
    gap: 15px; 
    padding: 0 40px; 
    border-right: 1px solid #f1f5f9; 
}
.trust-item:last-child { border-right: none; }
.trust-item i { font-size: 28px; color: var(--accent); }
.trust-text { display: flex; flex-direction: column; }
.trust-text strong { font-size: 15px; color: var(--primary); font-weight: 800; }
.trust-text span { font-size: 12px; color: #64748b; font-weight: 600; }

@media (max-width: 992px) {
    .trust-bar { flex-direction: column; gap: 30px; margin-top: 40px; padding: 40px; border-radius: 35px; width: calc(100% - 40px); margin-left: 20px; }
    .trust-item { border-right: none; width: 100%; border-bottom: 1px solid #f1f5f9; padding: 0 0 20px; justify-content: center; text-align: center; }
    .trust-item:last-child { border-bottom: none; padding-bottom: 0; }
}

/* BOOKING PANEL */
.booking-panel { background: rgba(240, 244, 255, 0.95); backdrop-filter: blur(20px); border-radius: 30px; padding: 10px; box-shadow: 0 30px 60px rgba(0,0,0,0.08); border: 1px solid #fff; scroll-margin-top: 120px; }
.tab-header { display: flex; gap: 5px; margin-bottom: 10px; }
.tab-btn { flex: 1; background: transparent; border: none; padding: 14px; color: var(--primary); font-size: 11px; font-weight: 800; border-radius: 20px; cursor: pointer; opacity: 0.4; transition: 0.3s; }
.tab-btn.active { background: var(--primary); color: #fff; opacity: 1; }

.tab-body { padding: 25px; }
.form-title { font-size: 18px; font-weight: 800; margin-bottom: 25px; display: flex; justify-content: space-between; }
.form-title span { color: var(--accent); font-size: 12px; }

.input-row.split { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; margin-bottom: 0; }
#return-date-field { display: none; grid-column: span 2; }
#dynamic-row { grid-template-columns: 1fr 1fr; }
.input-grid { display: flex; flex-direction: column; gap: 12px; margin-bottom: 20px; position: relative; }

.field-button { 
    background: #fff; 
    border: 1px solid #e2e8f0; 
    border-radius: 15px; 
    padding: 15px 20px; 
    display: flex; 
    align-items: center; 
    gap: 15px; 
    cursor: pointer; 
    transition: 0.3s; 
    position: relative;
    user-select: none;
}
.field-button:hover { border-color: var(--accent); background: #fcfdfe; box-shadow: 0 5px 15px rgba(0,0,0,0.02); }
.field-button i { color: var(--accent); font-size: 16px; width: 20px; text-align: center; }
.field-button i.arrow { font-size: 10px; opacity: 0.3; transition: 0.3s; }
.field-button:hover i.arrow { opacity: 0.8; transform: translateY(2px); }

#pickup-time, #return-time {
    text-align: left !important;
}

.field-button input {
    text-align: left !important;
    border: none !important; 
    padding: 0 !important; 
    width: 100%; 
    font-size: 14px; 
    font-weight: 700; 
    color: var(--primary); 
    background: transparent !important;
    cursor: pointer;
    outline: none;
    pointer-events: none; /* Click passes to parent by default */
}
.field-button input.datepicker, .field-button input.timepicker { 
    pointer-events: auto; /* Date/Time pickers need to be clickable */
}
.field-button input::placeholder { color: #94a3b8; font-weight: 600; }

.field-content { flex: 1; position: relative; }

.custom-location-dropdown { 
    position: absolute; top: calc(100% + 10px); left: 0; 
    min-width: 300px; /* Genişlik yetersizliği için taban genişlik */
    background: #fff; border-radius: 20px; padding: 10px; 
    box-shadow: 0 15px 40px rgba(2, 6, 23, 0.15); border: 1px solid rgba(255, 255, 255, 0.8); 
    z-index: 9999; display: none; flex-direction: column;
    overflow: hidden;
}
@media (max-width: 768px) {
    .custom-location-dropdown { left: 0; right: 0; min-width: 100%; border-radius: 15px; }
}
.custom-location-dropdown.active { display: flex; animation: slideDown 0.3s cubic-bezier(0.165, 0.84, 0.44, 1); }

.time-scroll-dropdown { 
    max-height: 320px; 
    display: none; 
    flex-direction: row !important;
    min-width: 320px; 
    background: #fff;
    padding: 0;
    right: 0; /* Sağdaki kutu olduğu için sağa yaslıyoruz */
    left: auto;
}
.time-scroll-dropdown.active { 
    display: flex !important; 
    animation: slideDown 0.3s cubic-bezier(0.165, 0.84, 0.44, 1); 
}
.time-column {
    flex: 1;
    overflow-y: auto;
    height: 280px;
    padding: 10px 5px;
    display: flex;
    flex-direction: column;
}
.time-column:first-child { border-right: 1px solid #f1f5f9; }

.time-column-header {
    font-size: 10px;
    font-weight: 800;
    color: #94a3b8;
    text-align: center;
    padding: 8px 0;
    text-transform: uppercase;
    letter-spacing: 1px;
    background: #fff;
    position: sticky;
    top: 0;
    z-index: 10;
    border-bottom: 1px solid #f8fafc;
}

.time-unit-item {
    padding: 10px;
    text-align: center;
    border-radius: 10px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 700;
    color: var(--primary);
    transition: 0.2s;
    margin: 2px;
}
.field-button input {
    width: 100%;
    border: none;
    background: transparent;
    font-size: 1rem;
    font-weight: 600;
    color: var(--primary);
    outline: none;
    padding: 0;
    text-align: left; /* Sola hizalama */
}

.field-button input::placeholder {
    color: #94a3b8;
}
.time-unit-item:hover { background: #f8fafc; color: var(--accent); }
.time-unit-item.selected { background: var(--accent); color: #fff; }

.location-item { 
    padding: 12px 15px; border-radius: 12px; cursor: pointer; 
    font-size: 14px; font-weight: 700; color: var(--primary); transition: 0.2s;
}
.location-item:hover { background: #f8fafc; color: var(--accent); }
.location-item.selected { background: var(--primary); color: #fff; }

.passenger-dropdown-wrapper { width: 100%; }
.passenger-stepper-dropdown { 
    position: absolute; top: calc(100% + 10px); left: -60px; right: -20px; 
    background: #fff; border-radius: 20px; padding: 25px; 
    box-shadow: 0 15px 40px rgba(0,0,0,0.12); border: 1px solid rgba(0,0,0,0.05); 
    z-index: 1000; display: none; flex-direction: column; gap: 15px;
}
.passenger-stepper-dropdown.active { display: flex; animation: slideDown 0.3s ease; }

/* Clickable Date/Time Fields */
#pickup-date, #pickup-time, #return-date, #return-time { cursor: pointer; background: #fff; }
#pickup-date:hover, #pickup-time:hover, #return-date:hover, #return-time:hover { background-color: #f8fafc; border-color: var(--accent); }

/* PURE WHITE MINIMALIST FLATPICKR - NO BLUE */
.flatpickr-calendar { 
    background: #ffffff !important;
    border-radius: 20px !important;
    box-shadow: 0 15px 45px rgba(0,0,0,0.1) !important;
    border: 1px solid #f1f5f9 !important;
    width: 340px !important;
    padding: 15px !important;
}

.flatpickr-months { background: transparent !important; }
.flatpickr-month { color: #0f172a !important; fill: #0f172a !important; height: 45px !important; }
.flatpickr-current-month { font-weight: 700 !important; font-size: 14px !important; }
.flatpickr-current-month .flatpickr-monthDropdown-months { font-weight: 700 !important; }

.flatpickr-prev-month, .flatpickr-next-month { 
    top: 15px !important; 
    color: #0f172a !important; 
    fill: #0f172a !important; 
}
.flatpickr-prev-month:hover svg, .flatpickr-next-month:hover svg { fill: #0284c7 !important; }

.flatpickr-weekday { color: #94a3b8 !important; font-weight: 600 !important; font-size: 11px !important; }
.flatpickr-day { 
    border-radius: 8px !important; color: #1e293b !important; 
    height: 38px !important; line-height: 38px !important;
    transition: 0.2s;
}
.flatpickr-day.today { border: 1px solid #e2e8f0 !important; color: #0284c7 !important; }
.flatpickr-day.selected { background: #0f172a !important; color: #fff !important; border: none !important; }
.flatpickr-day:hover { background: #f1f5f9 !important; }

/* Custom Time Picker List Style */
.time-picker-wrapper { position: relative; width: 100%; }
.custom-time-dropdown { 
    position: absolute; top: calc(100% + 10px); left: 0; width: 180px; background: #fff; 
    border-radius: 20px; padding: 15px; box-shadow: 0 20px 50px rgba(0,0,0,0.15); 
    border: 1px solid rgba(0,0,0,0.05); z-index: 1000; display: none;
    grid-template-columns: 1fr 1fr; gap: 10px; height: 250px;
}
.custom-time-dropdown.active { display: grid; animation: slideDown 0.3s ease; }

.time-column { 
    overflow-y: auto; display: flex; flex-direction: column; gap: 5px; 
    padding-right: 5px; scroll-behavior: smooth;
}
.time-column::-webkit-scrollbar { width: 4px; }
.time-column::-webkit-scrollbar-thumb { background: #e2e8f0; border-radius: 10px; }

.time-item { 
    padding: 10px; text-align: center; border-radius: 10px; cursor: pointer; 
    font-size: 14px; font-weight: 700; color: var(--primary); transition: 0.2s;
}
.time-item:hover { background: #f1f5f9; color: var(--accent); }
.time-item.selected { background: var(--primary); color: #fff; }

.time-column-header { 
    position: sticky; top: 0; background: #fff; font-size: 10px; 
    font-weight: 800; color: #94a3b8; text-transform: uppercase; 
    padding-bottom: 5px; margin-bottom: 5px; text-align: center; border-bottom: 1px solid #f1f5f9;
}

/* Custom Location Dropdown Style */
.custom-select-wrapper { position: relative; width: 100%; }
#pickup-location, #destination-location, #passenger-summary { 
    background: #fff url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230284c7' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e") no-repeat right 15px center; 
    background-size: 12px; padding-right: 40px; cursor: pointer; user-select: none;
}
#pickup-time, #return-time { background: #fff; text-align: center; cursor: pointer; user-select: none; }

.custom-location-dropdown, .passenger-stepper-dropdown, .custom-time-dropdown { 
    position: absolute; top: calc(100% + 5px); left: 0; right: 0; background: #fff; 
    border-radius: 18px; padding: 10px; box-shadow: 0 15px 40px rgba(0,0,0,0.12); 
    border: 1px solid rgba(0,0,0,0.05); z-index: 9999; display: none;
    flex-direction: column; transform-origin: top;
}
.custom-time-dropdown { width: 160px; grid-template-columns: 1fr 1fr; gap: 5px; height: 200px; }
.custom-location-dropdown.active, .passenger-stepper-dropdown.active, .custom-time-dropdown.active { 
    display: flex; animation: slideDown 0.2s ease-out; 
}
.custom-time-dropdown.active { display: grid !important; }

.location-item { 
    padding: 12px 15px; border-radius: 10px; cursor: pointer; 
    font-size: 14px; font-weight: 700; color: var(--primary); transition: 0.2s;
}
.location-item:hover { background: #f8fafc; color: var(--accent); }
.location-item.selected { background: var(--primary); color: #fff; }

/* Passenger Stepper Dropdown */
.passenger-dropdown-wrapper { position: relative; }
#passenger-summary { background: #fff url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230284c7' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e") no-repeat right 15px center; background-size: 12px; padding-right: 40px; cursor: pointer; }

.passenger-stepper-dropdown { 
    position: absolute; top: calc(100% + 5px); left: 0; right: 0; background: #fff; 
    border-radius: 20px; padding: 20px; box-shadow: 0 20px 50px rgba(0,0,0,0.15); 
    border: 1px solid rgba(0,0,0,0.05); z-index: 1000; display: none;
    flex-direction: column; gap: 15px; transform-origin: top; transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    min-width: 280px; /* Minimum width to contain controls */
}

@media (max-width: 480px) {
    .passenger-stepper-dropdown { 
        position: fixed; top: auto; bottom: 0; left: 0; right: 0; 
        width: 100%; border-radius: 30px 30px 0 0; padding: 30px 25px;
        z-index: 10001;
    }
}
.passenger-stepper-dropdown.active { display: flex; animation: slideDown 0.3s ease; }

/* PREMIUM NOTIFICATION SYSTEM (TOAST) */
.toast-container {
    position: fixed;
    top: 30px;
    right: 30px;
    z-index: 10000;
    display: flex;
    flex-direction: column;
    gap: 15px;
    pointer-events: none;
}

.toast {
    background: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.4);
    box-shadow: 0 15px 45px rgba(0, 0, 0, 0.08);
    padding: 18px 25px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    gap: 15px;
    min-width: 320px;
    max-width: 450px;
    transform: translateX(120%);
    transition: 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    pointer-events: auto;
    position: relative;
    overflow: hidden;
}

.toast.active {
    transform: translateX(0);
}

.toast::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 6px;
    background: var(--accent);
}

.toast.error::before { background: #ef4444; }
.toast.success::before { background: #10b981; }

.toast-icon {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    flex-shrink: 0;
}

.toast.info .toast-icon { background: rgba(2, 132, 199, 0.1); color: var(--accent); }
.toast.error .toast-icon { background: rgba(239, 68, 68, 0.1); color: #ef4444; }
.toast.success .toast-icon { background: rgba(16, 185, 129, 0.1); color: #10b981; }

.toast-content {
    flex: 1;
}

.toast-title {
    display: block;
    font-size: 14px;
    font-weight: 800;
    color: var(--primary);
    margin-bottom: 2px;
}

.toast-message {
    font-size: 13px;
    font-weight: 600;
    color: #64748b;
    line-height: 1.4;
}

.toast-close {
    cursor: pointer;
    opacity: 0.3;
    transition: 0.3s;
    font-size: 14px;
}

.toast-close:hover { opacity: 1; }

@keyframes slideDown {
    from { opacity: 0; transform: translateY(-10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ABOUT PAGE - EXPERIENCE BADGE */
.about-experience-badge {
    position: absolute;
    bottom: -30px;
    right: -30px;
    background: var(--primary);
    color: #fff;
    padding: 40px;
    border-radius: 30px;
    box-shadow: 0 20px 40px rgba(0,0,0,0.2);
    z-index: 10;
}
.about-experience-badge .years {
    display: block;
    font-size: 3rem;
    font-weight: 800;
    line-height: 1;
}
.about-experience-badge .text {
    font-size: 0.9rem;
    font-weight: 700;
    opacity: 0.7;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.stepper { display: flex; align-items: center; justify-content: space-between; width: 100%; }
.stepper-label { font-size: 11px; font-weight: 800; color: var(--primary); text-transform: uppercase; opacity: 0.6; min-width: 80px; }
.stepper-controls { display: flex; align-items: center; gap: 15px; background: #f8fafc; padding: 5px 15px; border-radius: 50px; }
.step-btn { 
    width: 32px; height: 32px; border-radius: 50%; border: 1px solid #e2e8f0; 
    background: #fff; color: var(--primary); font-weight: 700; cursor: pointer; transition: 0.2s;
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.step-btn:hover { background: var(--primary); color: #fff; border-color: var(--primary); }
.stepper-controls input { 
    width: 30px; border: none !important; padding: 0 !important; text-align: center; 
    font-size: 16px; font-weight: 800; color: var(--primary); background: transparent;
}
.stepper-controls input::-webkit-inner-spin-button { display: none; }
.btn-search { 
    width: 100%; padding: 18px; margin-top: 10px;
    background: var(--primary); 
    color: #fff; border: none; border-radius: 15px; font-weight: 800; cursor: pointer; transition: 0.3s; 
    box-shadow: 0 10px 20px rgba(2, 6, 23, 0.2); 
    display: flex; align-items: center; justify-content: center; gap: 10px;
}
.btn-search:hover { 
    background: var(--accent); 
    color: var(--white);
    transform: translateY(-3px); 
    box-shadow: 0 15px 30px rgba(2, 132, 199, 0.4); 
}

/* SERVICES (FLIP CARDS) */
.services-grid { 
    display: grid; 
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); 
    gap: 30px; 
    margin-top: 60px; 
}
.service-card { 
    perspective: 1000px; 
    height: 400px; 
    background: transparent; 
}
.card-inner { 
    position: relative; 
    width: 100%; 
    height: 100%; 
    transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1); 
    transform-style: preserve-3d;
}
.card-inner.flipped { transform: rotateY(180deg); }

.card-front, .card-back { 
    position: absolute; inset: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; 
    border-radius: 40px; padding: 40px; display: flex; flex-direction: column; align-items: center; justify-content: center;
    box-shadow: 0 20px 50px rgba(0,0,0,0.1); background: #fff;
}
.card-front { color: var(--primary); }
.card-back { background: var(--primary); color: #fff; transform: rotateY(180deg); text-align: center; }

.icon { width: 70px; height: 70px; background: rgba(2, 132, 199, 0.05); border-radius: 20px; display: flex; align-items: center; justify-content: center; font-size: 30px; color: var(--accent); margin-bottom: 30px; }
.card-back .icon { background: rgba(255,255,255,0.1); color: var(--accent); }


/* REGION TICKER (TOP BAR) */
.region-ticker { background: #020617; padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,0.05); overflow: hidden; position: relative; z-index: 101; width: 100%; min-height: 38px; line-height: 1.5; }
.ticker-wrapper { 
    max-width: 100%; overflow: hidden; 
    mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
    -webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
}
.ticker-track { 
    display: flex; 
    width: max-content; 
    animation: scroll 25s linear infinite; 
    will-change: transform;
}
.ticker-track span { 
    color: rgba(255,255,255,0.7); font-size: 12px; font-weight: 700; 
    text-transform: uppercase; letter-spacing: 2px; white-space: nowrap;
    padding: 0 60px;
    display: flex;
    align-items: center;
    line-height: 1.5;
    position: relative;
}
.ticker-track span::after { 
    content: '•'; 
    position: absolute;
    right: -2px;
    color: var(--accent); 
    opacity: 0.3; 
}

@keyframes scroll {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}

.section-header.center { text-align: center; margin-bottom: 60px; }
.section-header.center p { margin: 15px auto; }

/* HOW IT WORKS */
.how-it-works { padding: 100px 0; background: #fff; }
.steps-container { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.step-item { flex: 1; text-align: center; }
.step-icon-wrapper { 
    width: 100px; height: 100px; background: rgba(2, 132, 199, 0.05); border-radius: 25px; 
    margin: 0 auto 25px; display: flex; align-items: center; justify-content: center;
    transition: 0.3s; position: relative;
}
.step-icon-wrapper.active { background: var(--accent); }
.step-icon { font-size: 30px; color: var(--accent); }
.step-icon-wrapper.active .step-icon { color: #fff; }
.step-item h3 { font-size: 20px; font-weight: 800; color: var(--primary); margin-bottom: 15px; }
.step-item p { font-size: 14px; color: #64748b; line-height: 1.6; max-width: 250px; margin: 0 auto; }

.step-connector { 
    flex: 1; 
    padding-top: 40px; 
    height: 60px;
    min-width: 100px;
}
.step-connector svg { width: 100%; height: 100%; }
.scroll-path { 
    stroke-dasharray: 100; 
    stroke-dashoffset: 100; 
    transition: stroke-dashoffset 1.5s ease-out; 
}
.steps-container.active .scroll-path { stroke-dashoffset: 0; }

@media (max-width: 768px) {
    .steps-container { flex-direction: column; gap: 50px; align-items: center; text-align: center; }
    .step-connector { display: none; }
}

/* WHATSAPP */
.whatsapp-btn { position: fixed; bottom: 40px; right: 40px; background: #25d366; color: #fff; padding: 15px 25px; border-radius: 50px; display: flex; align-items: center; gap: 10px; text-decoration: none; font-weight: 700; box-shadow: 0 15px 30px rgba(37,211,102,0.2); z-index: 1000; }
.wa-status { background: rgba(255,255,255,0.2); padding: 2px 8px; border-radius: 50px; font-size: 10px; }

.mobile-toggle { display: none; font-size: 20px; cursor: pointer; color: var(--primary); }

/* SECTION HEADERS */
.section-header { text-align: center; margin-bottom: 60px; }
.section-header h2 { font-size: 2.5rem; font-weight: 800; color: var(--primary); line-height: 1.2; letter-spacing: -1px; }

/* POPULAR ROUTES SECTION (MODERN ITINERARY) */
.routes { padding: 120px 0; background: #fff; }
.routes-list { display: flex; flex-direction: column; gap: 20px; margin-top: 60px; }

.route-row { 
    background: #fff; border: 1px solid #f1f5f9; border-radius: 25px; padding: 25px 40px; 
    display: flex; align-items: center; justify-content: space-between; gap: 40px;
    transition: var(--transition); box-shadow: 0 4px 20px rgba(0,0,0,0.02);
}
.route-row:hover { transform: scale(1.01); border-color: var(--accent); box-shadow: 0 15px 40px rgba(2, 132, 199, 0.08); }

.route-main { flex: 2; display: flex; align-items: center; gap: 30px; }
.route-city { display: flex; flex-direction: column; min-width: 120px; }
.route-city strong { font-size: 20px; color: var(--primary); font-weight: 800; letter-spacing: -0.5px; }
.route-city span { font-size: 11px; font-weight: 700; color: #94a3b8; text-transform: uppercase; letter-spacing: 1px; }

.route-visual { flex: 1; position: relative; height: 40px; display: flex; align-items: center; min-width: 150px; }
.route-line { width: 100%; height: 1px; background: #e2e8f0; position: relative; }
.route-line::before, .route-line::after { content: ''; position: absolute; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); top: 50%; transform: translateY(-50%); }
.route-line::after { right: 0; background: #e2e8f0; border: 1px solid var(--accent); }

.route-car { 
    position: absolute; left: 0; top: 50%; transform: translateY(-50%); 
    color: var(--accent); font-size: 16px; transition: 0.8s cubic-bezier(0.65, 0, 0.35, 1);
    opacity: 0.4;
}
.route-row:hover .route-car { left: calc(100% - 20px); opacity: 1; }

.route-info { flex: 1; display: flex; gap: 20px; }
.info-tag { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; color: #64748b; background: #f8fafc; padding: 8px 15px; border-radius: 12px; white-space: nowrap; }
.info-tag i { color: var(--accent); }

.route-action { display: flex; align-items: center; gap: 30px; }
.route-price { text-align: right; min-width: 100px; }
.route-price small { display: block; font-size: 10px; font-weight: 800; color: #94a3b8; text-transform: uppercase; margin-bottom: 2px; }
.route-price span { font-size: 22px; font-weight: 800; color: var(--primary); }

.btn-book-now { 
    padding: 15px 25px; background: var(--primary); color: #fff; text-decoration: none; 
    border-radius: 15px; font-size: 13px; font-weight: 700; display: flex; align-items: center; gap: 10px;
    transition: 0.3s;
}
.btn-book-now:hover { background: var(--accent); transform: translateX(5px); }

@media (max-width: 992px) {
    .route-row { flex-direction: column; align-items: stretch; gap: 20px; padding: 20px; }
    .route-main { 
        display: flex; flex-direction: row; align-items: center; justify-content: space-between; 
        gap: 10px; width: 100%; 
    }
    .route-city strong { font-size: 16px; }
    .route-city span { font-size: 9px; }
    .route-visual { 
        flex: 1; height: 30px; min-width: 50px; 
        display: flex; align-items: center; 
    }
    .route-line { width: 100%; height: 1px; background: #e2e8f0; }
    .route-car { font-size: 14px; top: 50%; transform: translateY(-50%) !important; left: 0; }
    .route-row:hover .route-car { left: calc(100% - 15px); }
    
    .route-info { gap: 10px; justify-content: space-between; }
    .info-tag { font-size: 11px; padding: 6px 10px; }
    
    .route-action { width: 100%; justify-content: space-between; border-top: 1px solid #f1f5f9; padding-top: 15px; margin-top: 5px; }
    .route-price span { font-size: 18px; }
}

/* NEIGHBORHOODS SECTION */
.neighborhoods { padding: 100px 0; background: #f8fafc; }
.neighborhoods-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); gap: 25px; margin-top: 50px; }

.region-card { /* OZVA 17 Agu kart: beyaz zeminde border gorunmuyordu */ border: 1px solid rgba(2, 132, 199, 0.25) !important; box-shadow: 0 6px 20px rgba(30, 58, 138, 0.08);  
    background: #fff; border: 1px solid #f1f5f9; border-radius: 20px; padding: 35px;
    display: flex; flex-direction: column; justify-content: space-between; gap: 25px;
    transition: var(--transition);
}
.region-card:hover { transform: translateY(-5px); border-color: var(--accent); box-shadow: 0 10px 30px rgba(0,0,0,0.04); }

.region-info h3 { font-size: 22px; font-weight: 800; color: var(--primary); margin-bottom: 12px; }
.region-info p { font-size: 14px; color: #64748b; line-height: 1.6; }

.region-meta { display: flex; gap: 15px; border-top: 1px solid #f1f5f9; padding-top: 20px; }
.region-meta span { font-size: 11px; font-weight: 800; color: #94a3b8; display: flex; align-items: center; gap: 6px; text-transform: uppercase; }
.region-meta i { color: var(--accent); font-size: 12px; }

.btn-read-more {
    margin-top: 15px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 20px;
    background: rgba(2, 132, 199, 0.08);
    color: var(--accent);
    border-radius: 12px;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    transition: 0.3s;
    border: 1px solid rgba(2, 132, 199, 0.1);
}
.btn-read-more:hover {
    background: var(--accent);
    color: #fff;
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(2, 132, 199, 0.2);
}
.btn-read-more i {
    font-size: 11px;
}

@media (max-width: 768px) {
    .neighborhoods-grid { grid-template-columns: 1fr; }
}

/* PREMIUM BUTTONS */
.btn-outline-premium { 
    display: inline-flex; align-items: center; gap: 12px; padding: 18px 40px; 
    border: 1px solid var(--primary); color: var(--primary); border-radius: 50px; 
    font-size: 14px; font-weight: 800; text-decoration: none; text-transform: uppercase; 
    letter-spacing: 1px; transition: 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    background: transparent;
}
.btn-outline-premium:hover { background: var(--primary); color: #fff; transform: translateY(-3px); box-shadow: 0 10px 30px rgba(30, 58, 138, 0.15); }
.btn-outline-premium i { font-size: 12px; transition: 0.3s; }
.btn-outline-premium:hover i { transform: translateX(5px); }

/* REVEAL ANIMATION */
.reveal-up { opacity: 0; transform: translateY(30px); transition: 0.8s cubic-bezier(0.165, 0.84, 0.44, 1); }
.reveal-up.active { opacity: 1; transform: translateY(0); }

/* SERVICES SECTION */
.services { padding: 100px 0; background: var(--light-bg); }
.services-grid { 
    display: grid; 
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); 
    gap: 30px; 
    margin-top: 50px; 
}

/* DESTINATIONS SECTION */
.destinations { padding: 100px 0; background: #fff; }
.dest-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); gap: 30px; }
.dest-card { background: #fff; border-radius: 40px; overflow: hidden; box-shadow: 0 15px 40px rgba(0,0,0,0.05); transition: 0.4s; }
.dest-card:hover { transform: translateY(-10px); box-shadow: 0 25px 60px rgba(0,0,0,0.1); }
.dest-img { position: relative; height: 300px; overflow: hidden; }
.dest-img img { width: 100%; height: 100%; object-fit: cover; transition: 0.5s; }
.dest-card:hover .dest-img img { transform: scale(1.1); }
.dest-location-badge { 
    position: absolute; top: 25px; left: 25px; background: #fff; color: var(--primary); 
    padding: 8px 15px; border-radius: 50px; font-size: 10px; font-weight: 800; 
    z-index: 2; box-shadow: 0 5px 15px rgba(0,0,0,0.1); 
}
.dest-info { padding: 35px; }
.dest-info h3 { font-size: 24px; font-weight: 800; margin-bottom: 15px; color: var(--primary); }
.dest-info p { font-size: 15px; color: #64748b; line-height: 1.6; }

/* FAQ SECTION */
.faq { padding: 120px 0; background: #f8fafc; }
.faq-list { max-width: 850px; margin: 60px auto 0; display: flex; flex-direction: column; gap: 20px; }

.faq-item { 
    background: #fff; 
    border-radius: 24px; 
    overflow: hidden; 
    border: 1px solid #e2e8f0;
    transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.faq-item:hover { border-color: var(--accent); box-shadow: 0 10px 30px rgba(0,0,0,0.04); }

.faq-question { 
    padding: 25px 30px; 
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
    cursor: pointer; 
    user-select: none;
}
.faq-question span { 
    font-size: 1.1rem; 
    font-weight: 700; 
    color: var(--primary); 
    transition: 0.3s;
}
.faq-question i { 
    width: 36px;
    height: 36px;
    background: #f1f5f9;
    color: var(--accent);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    transition: 0.4s;
}

.faq-answer { 
    max-height: 0; 
    overflow: hidden; 
    transition: 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    background: #fcfdfe;
}
.faq-answer-inner { padding: 0 30px 30px; }
.faq-answer p { 
    color: #64748b; 
    line-height: 1.8; 
    font-weight: 500;
    font-size: 15px;
}

/* Active State */
.faq-item.faq-open { border-color: var(--accent); background: #fff; }
.faq-item.faq-open .faq-question span { color: var(--accent); }
.faq-item.faq-open .faq-question i { 
    background: var(--accent); 
    color: #fff; 
    transform: rotate(135deg); 
}
.faq-item.faq-open .faq-answer { margin-top: 15px; }

/* FOOTER */
.footer { background: var(--primary); color: #fff; padding: 80px 0 30px; }
.footer-grid { display: grid; grid-template-columns: 1.6fr 1fr 1.3fr 1.2fr; gap: 40px; margin-bottom: 60px; }
.footer-about .logo a { color: #fff; margin-bottom: 25px; display: block; }
.footer-about p { font-size: 14px; opacity: 0.6; line-height: 1.8; }
.footer-links h4, .footer-contact h4 { font-size: 18px; margin-bottom: 25px; color: var(--accent); }
.footer-links ul, .footer-contact ul { list-style: none; }
.footer-links ul li { margin-bottom: 12px; }
.footer-links ul li a { color: #fff; opacity: 0.6; text-decoration: none; font-size: 14px; transition: 0.3s; }
.footer-links ul li a:hover { opacity: 1; color: var(--accent); padding-left: 5px; }
.footer-contact ul li { margin-bottom: 15px; font-size: 14px; opacity: 0.6; display: flex; align-items: center; gap: 12px; }
.footer-contact ul li i { color: var(--accent); }
.footer-bottom { border-top: 1px solid rgba(255,255,255,0.05); padding-top: 30px; text-align: center; }
.footer-bottom p { font-size: 12px; opacity: 0.4; }

/* PAGE SPECIFIC GRIDS */
.about-grid, .contact-grid { display: grid; gap: 80px; align-items: center; }
.about-grid { grid-template-columns: 1fr 1fr; }
.contact-grid { grid-template-columns: 1.2fr 0.8fr; align-items: start; }

@media (max-width: 992px) {
    header { top: 60px; }
    header .container { border-radius: 0; width: 100%; padding: 12px 20px; background: rgba(255, 255, 255, 0.98); border: none; border-bottom: 1px solid #f1f5f9; }
    
    .mobile-toggle { display: block; font-size: 24px; color: var(--primary); z-index: 1001; transition: 0.3s; }
    .mobile-toggle.active i::before { content: "\f00d"; } /* FontAwesome Times/X icon */

    .nav-menu { 
        position: fixed; top: 0; left: 0; width: 100%; height: 100vh; 
        background: rgba(255, 255, 255, 0.98); backdrop-filter: blur(20px);
        display: flex; flex-direction: column; align-items: center; justify-content: center;
        gap: 30px; padding: 100px 30px;
        transform: translateY(-100%); transition: 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
        opacity: 0; visibility: hidden; pointer-events: none;
    }
    .nav-menu.active { transform: translateY(0); opacity: 1; visibility: visible; pointer-events: all; }

    .nav-links { flex-direction: column; align-items: center; gap: 20px; }
    .nav-links a { font-size: 18px; opacity: 1; color: var(--primary); }
    .nav-links a.active { border-bottom: 3px solid var(--accent); padding-bottom: 8px; }

    .nav-contact { flex-direction: column; gap: 20px; width: 100%; max-width: 300px; }
    .lang-switcher, .currency-switcher { width: 100%; }
    .lang-btn, .curr-btn { justify-content: center; padding: 12px; font-size: 14px; border: 1px solid #f1f5f9; }
    .lang-dropdown, .curr-dropdown { left: 0; right: 0; top: auto; bottom: calc(100% + 10px); }

    .nav-contact .phone-link { width: 100%; justify-content: center; font-size: 15px; padding: 15px; }

    .hero { height: auto; min-height: 100vh; padding-top: 60px; padding-bottom: 80px; }
    .hero-content { grid-template-columns: 1fr; text-align: center; padding-top: 120px; gap: 40px; }
    .hero-text h1 { font-size: 2.5rem; letter-spacing: -1px; }
    .hero-text h1 small { font-size: 1.8rem; }
    .hero-text p { margin: 20px auto; font-size: 16px; }
    .typewriter-container { width: 100%; max-width: 100%; white-space: normal; height: auto; display: inline-block; }
    .hero-overlay { background: linear-gradient(to bottom, rgba(2, 6, 23, 0.95) 0%, rgba(2, 6, 23, 0.6) 100%); }

    .footer-grid { display: flex; flex-direction: column; gap: 40px; text-align: center; }
    .footer-about { order: 1; }
    .footer-contact { order: 2; margin-top: -10px; } /* İletişim, açıklamanın hemen altına */
    .footer-links { order: 3; }
    
    .footer-contact ul { display: flex; flex-direction: column; align-items: center; }
    .footer-contact ul li { justify-content: center; width: 100%; word-break: break-all; }

    /* New Pages Responsive Fixes */
    .about-grid, .contact-grid { grid-template-columns: 1fr !important; gap: 40px !important; }
    .contact-grid { text-align: center; width: 100%; overflow: hidden; }
    .contact-grid .reveal-up { width: 100%; display: block; }
    .contact-grid .reveal-up > div { width: 100%; max-width: 100%; padding: 0 !important; box-sizing: border-box; }
    
    /* Contact Info Specifics */
    .contact-grid .reveal-up > div > div { display: flex; flex-direction: column; align-items: center; width: 100%; }
    .contact-grid [style*="background: #fff; border: 1px solid"] { 
        width: 100%; max-width: 400px; margin: 0 auto; 
        flex-direction: column; text-align: center; gap: 15px !important;
        padding: 25px !important;
    }
    .contact-grid [style*="background: #f8fafc"] { 
        width: 100%; padding: 40px 25px !important; border-radius: 35px !important; 
        box-shadow: 0 15px 40px rgba(0,0,0,0.05) !important;
        box-sizing: border-box !important;
        display: block !important;
    }
    .contact-grid .field { width: 100%; margin-bottom: 20px; box-sizing: border-box; }
    .contact-grid .field input, .contact-grid .field select, .contact-grid .field textarea { 
        width: 100% !important; max-width: 100% !important; box-sizing: border-box !important;
    }
    .contact-grid .input-row.split { display: block; width: 100%; }
    .contact-grid a { word-break: break-all; font-size: 1.1rem !important; }
    
    .contact-grid form { text-align: left; width: 100%; }
    .contact-grid h2 { font-size: 1.8rem !important; margin-bottom: 30px !important; text-align: center; }
    .contact-grid .field label { font-size: 10px; margin-bottom: 6px; }
    .contact-grid .field input, .contact-grid .field select, .contact-grid .field textarea { 
        padding: 12px !important; font-size: 14px !important; border-radius: 10px !important;
    }
    .contact-grid .btn-search { padding: 16px !important; border-radius: 12px !important; font-size: 14px; }
    
    .about-story-content { padding: 0 !important; text-align: center; }
    .about-experience-badge { padding: 15px 20px !important; bottom: -10px !important; right: -10px !important; border-radius: 15px !important; }
    .about-experience-badge .years { font-size: 1.5rem !important; }
    .about-experience-badge .text { font-size: 0.6rem !important; }
}

@media (max-width: 768px) {
    .section-header h2 { font-size: 2rem; }
    .hero-text h1 { font-size: 2.2rem; }
    .booking-panel { border-radius: 20px; padding: 5px; }
    .tab-body { padding: 15px; }
    .input-row.split { grid-template-columns: 1fr; }
    .btn-search { padding: 15px; font-size: 14px; }
    .region-card { padding: 25px; }
    .time-scroll-dropdown { min-width: 280px; right: 0; left: 0; width: 100%; position: fixed; bottom: 0; top: auto; border-radius: 20px 20px 0 0; }
    .tab-btn { font-size: 10px; padding: 10px 5px; }
    .custom-location-dropdown { position: absolute; top: calc(100% + 5px); bottom: auto; left: 0; right: 0; width: 100%; border-radius: 15px; max-height: 300px; overflow-y: auto; z-index: 99999; }
}


/* SCROLL PATH ANIMATION */
.scroll-path {
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    transition: 2s ease-out;
}

/* WHATSAPP TOUR BUTTON */
.btn-whatsapp-tour {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    background: #25d366;
    color: #fff;
    padding: 16px 25px;
    border-radius: 18px;
    text-decoration: none;
    font-weight: 800;
    font-size: 0.95rem;
    margin-top: 25px;
    transition: var(--transition);
    box-shadow: 0 10px 25px rgba(37, 211, 102, 0.15);
    width: 100%;
}
.btn-whatsapp-tour:hover {
    background: #20ba5a;
    transform: translateY(-3px);
    box-shadow: 0 15px 30px rgba(37, 211, 102, 0.25);
    color: #fff;
}
.btn-whatsapp-tour i {
    font-size: 1.3rem;
}

@media (max-width: 768px) {
    .btn-whatsapp-tour {
        padding: 14px 20px;
        font-size: 0.9rem;
    }
}

/* ==========================================
   PREMIUM INVISIBLE GOOGLE TRANSLATION SYSTEM
   ========================================== */
iframe.goog-te-banner-frame, 
.goog-te-banner-frame, 
#goog-gt-tt, 
.goog-te-balloon-frame,
.goog-te-menu-value,
.goog-tooltip,
.goog-tooltip:hover {
    display: none !important;
    visibility: hidden !important;
}
body {
    top: 0 !important;
}
.skiptranslate {
    display: none !important;
}
font {
    background-color: transparent !important;
    box-shadow: none !important;
    border-bottom: none !important;
}

@keyframes forceHideWidget {
    0%, 100% {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transform: scale(0) !important;
    }
}
/* Yeni nesil yuvarlak Google Translate ikonunu gizleme */
.VIpgJd-Zvi9od-aZ2wEe-wOHMyf,
.VIpgJd-Zvi9od-aZ2wEe-wOHMyf-ti6hGc,
.VIpgJd-Zvi9od-aZ2wEe-OiiCO,
#goog-gt-tt,
.goog-te-banner-frame.skiptranslate,
.goog-te-gadget-icon,
img.goog-te-gadget-icon,
div[id^="goog-"],
body > div.skiptranslate {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    z-index: -9999 !important;
    animation: forceHideWidget 1s infinite !important;
}
iframe.skiptranslate {
    visibility: hidden !important;
    opacity: 0 !important;
    position: absolute !important;
    top: -9999px !important;
    left: -9999px !important;
    z-index: -9999 !important;
}
/* Ekstra agresif gizleme (çeviri butonları haricindeki her türlü Google div'i için) */
body > div[style*="z-index: 10000"],
body > div[style*="z-index: 2000000000"] {
    display: none !important;
}


/* ===== OZVA — kart hizalama düzeltmesi (14 Ağu 2026) =====
   Sorun: .dest-card display:block olduğu için buton, metin nerede biterse
   orada kalıyordu; açıklaması kısa olan kartta buton 55px yukarıda duruyordu.
   Grid kartları zaten eşit yüksekliğe (stretch) çekiyor, sorun kartın İÇİ.
   Çözüm: kart ve gövde dikey flex olur, buton margin-top:auto ile dibe
   yapışır. Böylece metin uzunluğu ne olursa olsun butonlar aynı hizada. */
.dest-grid > .dest-card { display: flex; flex-direction: column; height: 100%; }
.dest-card > .dest-info { display: flex; flex-direction: column; flex: 1 1 auto; }
.dest-card .btn-whatsapp-tour { margin-top: auto; }
/* Görsel her kartta aynı yükseklikte kalsın (üst kenarlar da hizalı olsun) */
.dest-card > .dest-img { flex: 0 0 auto; }


/* ===== OZVA — navbar ortalama (14 Ağu 2026) =====
   İstenen: menü öğeleri logo ile dil/para bloğu ARASINDA tam ortada dursun.
   Önce menü merkezi 680px, boşluğun gerçek merkezi 621px idi (59px sağa kaçık),
   çünkü .nav-menu içeriği kadar yer kaplıyordu.
   Çözüm: .nav-menu kalan alanı doldurur, .nav-links de o alan içinde
   flex:1 + center ile ortalanır. Sağdaki blok kendi genişliğinde sabit kalır.
   Yalnız masaüstünde: mobilde .nav-menu açılır panel olarak çalışıyor. */
@media (min-width: 992px) {
  header .container > .nav-menu { flex: 1 1 auto; }
  .nav-menu > .nav-links { flex: 1 1 auto; justify-content: center; }
  .nav-menu > .nav-contact { flex: 0 0 auto; }
  /* .nav-menu'nün 40px gap'i menüyü boşluğun 20px soluna itiyordu;
     aynı miktarda sol padding vererek görsel merkezi geri getiriyoruz. */
  .nav-menu > .nav-links { padding-left: 40px; }
}


/* ===== OZVA — mobil footer ortalama (14 Ağu 2026) =====
   Sorun: footer sütunları mobilde ortalanmış görünse de İÇERİKLERİ sola
   yapışıyordu. İki kaynak vardı:
     1) .footer-social flex ama justify-content tanımsız → ikon sola dayalı.
     2) .tursab-verification inline stilde align-items:flex-start taşıyor ve
        içindeki metin bloğunda text-align:left var → rozet sola dayalı.
   Inline stil CSS'ten daha güçlü olduğu için !important gerekiyor; yalnız
   mobil genişlikte uygulanıyor, masaüstü tasarımı olduğu gibi kalıyor. */
@media (max-width: 991px) {
  footer .footer-social { justify-content: center; }
  footer .tursab-verification { align-items: center !important; }
  footer .tursab-verification * { text-align: center !important; }
}


/* ===== OZVA (14 Ağu 2026) — mobil taşma ve dokunma hedefleri =====

   1) YATAY TAŞMA (yalnız Rusça sayfada görülüyordu, 7px):
      .hero-content bir grid; grid/flex öğelerinin varsayılan min-width:auto
      değeri, içerik uzun olduğunda kutunun küçülmesini ENGELLER. Rusça rozet
      metni ("Роскошный и Безопасный Трансфер", letter-spacing 3px) 347px
      olunca 25+25 padding ile toplam 397px oluyor ve sayfa yana kayıyordu.
      min-width:0 kuralı bu kilidi açar; metin artık sarabiliyor.

   2) DOKUNMA HEDEFLERİ: hamburger 21x30, form alanları 21px, footer
      bağlantıları 18px, sekme düğmeleri 32px yüksekliğindeydi. Parmakla
      isabetli dokunmak için önerilen alt sınır 44px. Görsel tasarımı
      bozmamak için yükseklik padding ile büyütüldü, yazı boyutu korundu. */

@media (max-width: 991px) {
  /* taşma kilidi */
  .hero-content,
  .hero-content > *,
  .hero-text { min-width: 0; }
  .hero-content .badge { max-width: 100%; overflow-wrap: anywhere; }

  /* dokunma hedefleri */
  .mobile-toggle {
    min-width: 44px; min-height: 44px;
    display: inline-flex; align-items: center; justify-content: center;
  }
  .tab-btn { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }
  .footer-links a,
  .footer-col a,
  footer nav a,
  footer li > a,
  .nav-links li > a,
  .footer-social a {
    display: inline-flex; align-items: center;
    min-height: 44px;
  }
  /* logo bağlantısı: yükseklik verilir ama görsel ölçüsü değişmez */
  .logo > a { display: inline-flex; align-items: center; min-height: 44px; }
  /* rezervasyon formundaki alanlar */
  .field-content input,
  .field-content select { min-height: 44px; }
  .booking-form input,
  .booking-form select,
  .search-box input,
  input.datepicker,
  #pickup-location, #dropoff-location, #pickup-date, #pickup-time,
  #return-date, #return-time, #passenger-summary {
    min-height: 44px;
  }
}


/* Hero arka planı — OZVA 14.08.2026
   Önceki hâli index.php icinde satir ici stildi ve 2440px genislikte
   550 KB'lik JPEG yukluyordu; mobil LCP 10,4 sn olcusunun tek buyuk
   sebebi buydu. WebP'ye cevrildi: masaustu 119 KB, mobil 69 KB.
   Satir ici stil kaldirildi, arka plan artik burada tanimli. */
.hero { background-image: url('/assets/img/hero.webp'); }
@media (max-width: 768px) {
  .hero { background-image: url('/assets/img/hero-mobil.webp'); }
}