/* ==========================================================================
   Marmaray — seferleri.net güncel tema (tren / vapur / İZBAN sayfalarıyla aynı görünüm)
   template.css ve marmaray.css'ten SONRA yüklenir; bileşen kurallarını değiştirmeden
   renkleri, yazı tiplerini ve sayfa çerçevesini günceller.
   ========================================================================== */
:root{
  --ink:#0f172a;--ink-2:#334155;--muted:#5b6678;--line:#e3e8ef;--bg:#f4f6f9;--surface:#fff;
  --navy:#0a2540;--primary:#0a2540;--board:#0b1d36;--board-line:#1c3354;
  --accent:#e06b00;--amber:#e06b00;--rail:#1d4ed8;--sea:#0b8378;
  --blue:#1a4a9c;--blue-mid:#2563eb;--blue-lt:#3b82f6;--sky:#eff6ff;
  --r-lg:16px;--r-md:10px;--max:1200px;--t:.2s ease;
  --sh-sm:0 1px 2px rgb(15 23 42/.06),0 1px 3px rgb(15 23 42/.04);
  --sh-md:0 12px 32px -8px rgb(10 37 64/.18);
  --shadow-sm:var(--sh-sm);--shadow-md:var(--sh-md);
  --head:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --font:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,"SF Mono","Cascadia Mono","Segoe UI Mono",Menlo,Consolas,"Roboto Mono","Liberation Mono",monospace;
}
body{font:16px/1.6 var(--font);background:var(--bg);color:var(--ink);overflow-x:hidden}
h1,h2,h3{font-family:var(--head);letter-spacing:-.01em}
button{font-family:inherit}
:focus-visible{outline:3px solid var(--amber);outline-offset:2px;border-radius:6px}

/* ---------- Üst menü (ortak menu_v1.php) ---------- */
.header-menu{position:sticky;top:0;height:60px;background:#fff;border-bottom:1px solid var(--line);box-shadow:none;z-index:1000}
.headermenu-container{max-width:1200px;height:59px;margin:0 auto;padding:0 20px;display:flex;align-items:center;justify-content:space-between}
.slogo{width:200px!important;height:35px!important}
.navbar-nav{display:flex;list-style:none;gap:4px;margin:0;padding:0}
.menu-link{display:flex;align-items:center;gap:8px;padding:9px 14px;border-radius:8px;font-weight:500;font-size:17px;color:var(--ink);background:none;border:0}
.chevron-icon::after{content:"";display:flex;width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:var(--t)}
.has-submenu{position:relative}
.sub-menu{position:absolute;top:calc(100% + 2px);left:0;min-width:260px;padding:8px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--sh-md);opacity:0;visibility:hidden;transform:translateY(6px);transition:var(--t);z-index:1001}
.sub-menu ul{list-style:none;margin:0;padding:0}
.sub-menu.two-columns ul{display:grid;grid-template-columns:1fr 1fr;gap:0 8px;min-width:480px;max-height:none}
.sub-menu a{display:block;padding:10px 12px;font-size:17px;border-radius:6px;color:var(--ink)!important}
.sub-menu a:hover{background:var(--sky);color:var(--rail)!important}
.sub-menu .sub-head{padding:10px 12px 4px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#64748b;list-style:none}
.sub-menu .sub-head:not(:first-child){margin-top:4px;padding-top:12px;border-top:1px solid #eef2f6}
.sub-menu .sub-hl a{font-weight:600}
.has-submenu.open .chevron-icon::after{transform:rotate(-135deg)}
.navbar-toggler{display:none;border:0;background:none;padding:8px}
.hamburger-box{display:inline-block;width:30px;height:20px}
.hamburger-box svg{width:32px;height:25px}
@media(min-width:993px){
  .navbar{display:block;position:static;height:auto;width:auto;background:none;overflow:visible}
  .has-submenu:hover .sub-menu,.has-submenu:focus-within .sub-menu{opacity:1;visibility:visible;transform:none}
  .has-submenu:hover .menu-link{background:#f1f5f9}
  .has-submenu .sub-menu,.has-submenu .sub-menu.two-columns{left:0;right:auto} /* diğer sayfalardaki gibi sağa açılır */
}
@media(max-width:992px){
  .navbar-toggler{display:flex}
  .headermenu-container{padding:0 8px 0 16px}
  .navbar{position:fixed;top:60px;left:0;width:100%;height:0;background:#fff;overflow:hidden;transition:height .35s ease;z-index:999}
  .navbar.is-active{height:calc(100vh - 60px);overflow-y:auto;border-top:1px solid var(--line)}
  .navbar-nav{flex-direction:column;padding:4px 20px;gap:0}
  .menu-link{justify-content:space-between;width:100%;padding:16px 0;font-size:18px;border-bottom:1px solid #f1f5f9;border-radius:0}
  .sub-menu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;max-height:0;padding:0;overflow:hidden;transition:max-height .3s ease}
  .sub-menu.two-columns ul{grid-template-columns:1fr;min-width:0}
  .has-submenu.open .sub-menu{max-height:1260px;border-bottom:1px solid #f1f5f9}
}

/* ---------- Marmaray sekmeleri ---------- */
.tabs-bar{position:sticky;top:60px;z-index:900;background:#fff;border-bottom:1px solid var(--line);box-shadow:none}
.tabs-inner{max-width:var(--max);margin:0 auto;padding:0 20px;display:flex;gap:2px;overflow-x:auto;scrollbar-width:none}
a.tab-btn{flex:none;padding:13px 14px;font-size:14.5px;font-weight:600;color:var(--ink-2);border-bottom:3px solid transparent;white-space:nowrap}
a.tab-btn:hover{color:var(--rail)}
a.tab-btn[aria-current]{color:var(--accent);border-bottom-color:var(--accent)}

/* ---------- Hero (ortalanmış) ---------- */
.hero{position:relative;padding:44px 20px 56px;color:#fff;text-align:center;isolation:isolate;overflow:visible;background:
  radial-gradient(900px 420px at 85% -10%,rgb(37 99 235/.35),transparent 60%),
  radial-gradient(700px 380px at 5% 110%,rgb(245 158 11/.14),transparent 60%),
  linear-gradient(180deg,var(--navy) 0%,#0c2c4d 100%)}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.5;
  background-image:linear-gradient(rgb(255 255 255/.04) 1px,transparent 1px),linear-gradient(90deg,rgb(255 255 255/.04) 1px,transparent 1px);
  background-size:44px 44px;mask-image:radial-gradient(ellipse at center,#000 30%,transparent 75%);-webkit-mask-image:radial-gradient(ellipse at center,#000 30%,transparent 75%)}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:22px;top:auto;height:10px;z-index:-1;opacity:.35;
  background:linear-gradient(#fff,#fff) 0 0/100% 2px no-repeat,linear-gradient(#fff,#fff) 0 100%/100% 2px no-repeat,
  repeating-linear-gradient(90deg,#fff 0 3px,transparent 3px 22px) 0 50%/100% 10px no-repeat}
.hero-inner{max-width:900px;margin:0 auto}
.crumb{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-bottom:16px;font-size:13px;color:#94a3b8}
.crumb a{color:#cbd5e1}.crumb a:hover{color:#fff}
.crumb [aria-current]{color:#fff}
.hero-tag{display:inline-flex;align-items:center;gap:6px;margin:0 auto 14px;padding:4px 12px;border-radius:999px;background:rgb(245 158 11/.16);border:1px solid rgb(245 158 11/.3);color:#fbbf24;font:600 11px var(--mono);letter-spacing:.08em}
.hero h1{font-size:clamp(2rem,5vw,3rem);font-weight:600;letter-spacing:-.025em;line-height:1.12;max-width:900px;margin:0 auto 12px}
.hero h1 .hl,.hero h1 span{color:var(--amber)}
.hero-sub{max-width:720px;margin:0 auto 26px;font-size:1.08rem;line-height:1.5;color:#cbd5e1}
.hero-sub b,.hero-sub strong{color:#fff;font-weight:600}
.hero-stats{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:0 auto 26px;max-width:820px}
.hero-stat{display:flex;flex-direction:column;gap:2px;min-width:140px;padding:10px 16px;border:1px solid rgb(255 255 255/.14);border-radius:12px;background:rgb(255 255 255/.06);text-align:center}
.hero-stat-lbl{font:600 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#94a3b8}
.hero-stat-val{font:700 20px var(--mono);color:#fff;letter-spacing:.02em}
.hero-stat:first-child .hero-stat-val{color:#fbbf24}
.hero-stat-stop{font-size:12px;color:#94a3b8}

/* Hat bilgisi kartı: istatistiklerin altında yatay şerit */
.hero-card{max-width:820px;margin:0 auto 22px;padding:14px 18px;text-align:left;border:1px solid rgb(255 255 255/.14);border-radius:var(--r-lg);background:rgb(255 255 255/.06);backdrop-filter:blur(6px)}
.hero-card-label{font:600 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#94a3b8;margin-bottom:10px}
.hero-card .station-info{display:flex;flex-direction:row;flex-wrap:wrap;gap:10px 24px}
.hero-card .station-row{display:flex;align-items:flex-start;gap:8px;flex:1 1 180px}
.hero-card .station-name{color:#fff;font-weight:600;font-size:14.5px}
.hero-card .station-sub{color:#94a3b8;font-size:12.5px}
.hero-card .live{margin-top:12px;padding-top:12px}
.hero-live-m{display:none!important}

/* ---------- Süre hesaplama (hero içinde, arama kutusu görünümü) ---------- */
.search-bar-wrap{max-width:820px;margin:0 auto;padding:0;position:relative;z-index:2;background:none}
.search-bar{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px;margin:0;padding:12px;background:#fff;border:0;border-radius:var(--r-lg);box-shadow:0 24px 60px -12px rgb(0 0 0/.45);text-align:left;color:var(--ink)}
.search-field{flex:1 1 200px;display:flex;flex-direction:column;gap:4px}
.search-field label{font:600 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.search-input{height:50px;padding:0 14px;border:1.5px solid transparent;border-radius:var(--r-md);background:var(--bg);font-size:16px;color:var(--ink);outline:none;transition:var(--t)}
.search-input:focus{background:#fff;border-color:var(--amber);box-shadow:0 0 0 4px rgb(245 165 36/.18)}
.swap-btn{height:50px;width:50px;border:1.5px solid var(--line);border-radius:var(--r-md);background:#fff;color:var(--rail)}
.swap-btn:hover{background:var(--sky)}
.search-btn{display:flex;align-items:center;justify-content:center;gap:8px;height:50px;padding:0 24px;border:0;border-radius:var(--r-md);background:var(--accent);color:#fff;font:700 16px var(--head);white-space:nowrap;transition:var(--t)}
.search-btn:hover{background:#c75f00}
.search-btn svg{width:18px;height:18px}
.hesap-sonuc{color:var(--ink-2)}
.hesap-sonuc .hs-route{color:var(--ink)}
.hesap-sonuc a{color:var(--rail)}

/* ---------- Sayfa düzeni ---------- */
.page-main{max-width:var(--max);margin:12px auto 0;padding:0 20px;display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:32px;align-items:start}
.page-main>div{min-width:0}
.page-main>.sidebar{margin-top:40px}
@media(min-width:1001px){.page-main>.sidebar{align-self:stretch}}

/* Bölüm başlıkları */
.section-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin:40px 0 16px}
.section-title{display:flex;align-items:center;gap:10px;font-size:clamp(1.25rem,2.4vw,1.5rem);font-weight:700;line-height:1.25;color:var(--ink)}
.section-title::before{content:"";flex:none;width:4px;height:22px;border-radius:2px;background:var(--accent)}

/* Reklam (yer önceden ayrılır) */
.ads-wrapper{position:relative;display:block;width:calc(100% - 40px);max-width:1160px;min-height:310px;margin:28px auto 0;overflow:hidden;text-align:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg)}
.page-main .ads-wrapper,.sidebar .ads-wrapper{width:100%}
.ads-hint{display:block;padding:8px 0 4px;font:600 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.ad-sidebar{position:sticky;top:120px;min-height:600px}

/* Kartlar */
.route-card,.info-section,.feature-card,.tt-box,.faq-item,.sb-card,.sidebar-card,.table-responsive{border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-sm);background:var(--surface)}
.routes-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.route-card{transition:var(--t)}
.route-card:hover{border-color:#bcd0f7;box-shadow:var(--sh-md);transform:translateY(-2px)}
.route-link-btn{background:var(--navy);border-radius:var(--r-md)}
.route-link-btn:hover{background:var(--accent)}
.route-dot{border-color:var(--rail)}.route-dot.arr{background:var(--rail)}
.info-section{padding:20px 22px;margin-top:28px}
.info-section h2{font-family:var(--head);font-size:clamp(1.15rem,2.2vw,1.35rem);color:var(--ink)}
.info-section h2::before{background:var(--accent)}
.info-section p{font-size:15.5px;line-height:1.7;color:var(--ink-2)}
.info-section a{color:var(--rail)}
.feature-card{transition:var(--t)}
.feature-card:hover{border-color:#bcd0f7}
.feature-card .big{color:var(--navy)}

/* Tablolar */
.train-table{font-size:14.5px}
.train-table thead,.train-table thead th{background:var(--gray-50)}
.train-table th{border-bottom:1.5px solid var(--gray-200);font:600 12px var(--head);letter-spacing:.04em;text-transform:uppercase;color:var(--gray-500)}
.train-table td{border-bottom:1px solid var(--gray-100)}
.train-table tbody tr:hover{background:var(--gray-50)}
.durak-link{color:var(--rail);font-weight:600}
.durak-link:hover{text-decoration:underline}
.badge-sefer{background:var(--sky);color:var(--blue);border-radius:999px}

/* SSS — güncel .faq görünümü */
.faq-list{display:block}
.faq-item{margin-bottom:8px;overflow:hidden;transition:border-color var(--t)}
.faq-item[open]{border-color:#c7d2e0}
.faq-question{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 20px;cursor:pointer;background:none}
.faq-question:hover{background:none}
.faq-question h3{font:600 16px/1.3 var(--font);color:var(--ink)}
.faq-icon{flex:none;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--gray-100);font:600 18px/1 var(--mono);color:var(--ink-2);transition:var(--t)}
details.faq-item[open] .faq-icon{transform:none;background:var(--navy);color:#fff;font-size:0}
details.faq-item[open] .faq-icon::before{content:"−";font-size:18px}
.faq-answer,.faq-answer.open{padding:0 20px 18px;max-height:none;color:var(--muted);font-size:15px;line-height:1.65}
.faq-answer a{color:var(--rail)}

/* ---------- Kenar çubuğu ---------- */
.sidebar{display:flex;flex-direction:column;gap:18px;min-width:0}
.sb-card,.sidebar-card{overflow:hidden}
.sb-head,.sidebar-card-head{display:flex;align-items:center;gap:8px;padding:14px 18px;font:700 16px/1.3 var(--head);color:#fff;background:linear-gradient(180deg,#10284a,var(--board));border-bottom:1px solid var(--board-line)}
.sb-card .card-body{padding:8px 18px 10px;display:block}
.servis-item{display:flex;align-items:center;gap:10px;padding:12px 0;border:0;border-bottom:1px solid var(--gray-100);border-radius:0;background:none;box-shadow:none}
.servis-item:last-child{border-bottom:0}
.servis-item:hover{background:none;transform:none}
.servis-title{font-weight:700;color:var(--ink)}
.servis-desc{display:block;font-size:13px;color:var(--muted)}
.servis-arrow{margin-left:auto;color:#94a3b8}
.servis-item:hover .servis-title,.servis-item:hover .servis-arrow{color:var(--rail)}
.st-link-item{color:var(--ink-2);border-bottom:1px solid var(--gray-100)}
.st-link-item:hover{color:var(--rail)}
.tip-box{padding:14px 16px;border:1px solid #fcd9a4;border-left:5px solid var(--amber);border-radius:12px;background:#fff8ec;color:#7c4a03;font-size:14.5px}
.tip-box strong{color:#7c4a03}
.btn-map{background:var(--navy)}
.btn-map:hover{background:var(--accent)}

/* ---------- Footer (ortak footer_v1.php) ---------- */
footer{text-align:left;margin-top:72px;padding:40px 20px 24px;background:var(--navy);color:#fff;border-top:4px solid var(--amber)}
.footer-container{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:40px}
.footer-col span{position:relative;font-size:16px}
.footer-col span::after{content:"";position:absolute;left:0;bottom:-6px;width:30px;height:2px;background:var(--amber)}
.footer-col p{color:#94a3b8;font-size:14px;margin-bottom:12px}
.footer-col ul{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-direction:column;gap:10px}
.footer-col ul a{color:#94a3b8;font-size:14px}
.footer-col ul a:hover{color:#fff}
.social-links{display:flex;gap:10px}
.social-links a{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:rgb(255 255 255/.08);color:#fff}
.social-links a:hover{background:var(--accent)}
.social-links svg{fill:currentColor}
.copyright-area{max-width:1200px;margin:28px auto 0;padding-top:16px;border-top:1px solid rgb(255 255 255/.1);display:flex;justify-content:space-between;gap:8px;font-size:12px;color:#94a3b8}
.site-note{margin-top:40px}
.site-note+footer{margin-top:0}

/* ---------- Duyarlı ---------- */
@media(max-width:1000px){
  .page-main{grid-template-columns:1fr}
  .page-main>.sidebar{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:24px}
  .ad-sidebar{position:static!important;min-height:310px}
  .copyright-area{flex-direction:column;text-align:center}
}
@media(max-width:640px){
  .hero{padding:32px 16px 52px}
  .hero-stat{flex:1 1 calc(50% - 5px);min-width:0}
  .search-field{flex-basis:100%}
  .swap-btn{width:100%;height:40px}
  .search-btn{width:100%}
  .page-main{padding:0 16px}
  .page-main>.sidebar{display:flex;flex-direction:column}
  .ads-wrapper{width:calc(100% - 32px)}
  .tabs-inner{padding:0 12px}
  .faq-question{padding:14px 16px}
  .faq-answer,.faq-answer.open{padding:0 16px 14px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}