/* ==========================================================================
   SEKTÖR TEMA KATMANI — LOJİSTİK  (VEKTÖRA LOJİSTİK)
   --------------------------------------------------------------------------
   front.css'in ÜZERİNE yüklenir. front.css elde değil, burada değiştirilir;
   böylece temel tasarım sistemi (rol model) bozulmadan sektör özelleştirilir.
   Başka bir sektöre geçerken: yalnızca bu dosyadaki :root değerleri,
   .vrk- sınıfları ve marka renkleri değişir.
   ========================================================================== */

:root{
  /* --- Marka paleti (premium lojistik: derin lacivert + altın) --- */
  --primary:#0A2540;         /* ana lacivert  */
  --primary-dark:#06182C;    /* koyu lacivert */
  --secondary:#123A5E;       /* orta mavi     */
  --accent:#F5A524;          /* altın         */
  --accent-dark:#B87414;
  --accent-mid:#D98C1A;
  --accent-soft:#FFE9C2;

  /* --- Tipografi --- */
  --font-display:'Archivo','Segoe UI',Tahoma,sans-serif;
  --font:'Inter','Segoe UI',Tahoma,sans-serif;

  /* --- Yüzeyler --- */
  --ink:#0B1A2B;
  --heading:#0A2540;
  --body:#4C5C6E;
  --muted:#6B7C8F;
  --line:#E2E9F1;
  --bg:#ffffff;
  --soft:#F4F7FB;
  --soft2:#EAF0F7;

  /* --- Bar / header --- */
  --topbar-bg:#06182C;   --topbar-text:#C6D6E5;
  --header-bg:#ffffff;   --nav:#25364A;   --nav-hover:#0A2540;  --nav-active:#C97F14;

  /* --- Hero / buton --- */
  --hero-bg:#0A2540;
  --btn:#0A2540;         --btn-accent:#F5A524;

  /* --- İstatistik / footer --- */
  --stats-bg:#F4F7FB;    --stats-num:#0A2540;
  --footer-bg:#06182C;   --footer-head:#FFFFFF;  --footer-text:#A6BACD;

  --radius:18px; --radius-sm:12px;
  --shadow:0 14px 44px rgba(10,37,64,.11);
  --shadow-sm:0 6px 22px rgba(10,37,64,.08);
}

/* Başlıklar güçlü, teknik ve okunaklı */
h1,h2,h3,h4,h5{font-family:var(--font-display);color:var(--heading);letter-spacing:-.015em}
.hero h1,.page-header h1{font-weight:800;letter-spacing:-.025em}
.section-head h2{font-weight:800}
.btn{font-family:var(--font);font-weight:600;letter-spacing:.2px}
.sh-tag{font-family:var(--font-display);font-weight:700;letter-spacing:1.6px}

/* ==========================================================================
   1) HERO SLIDER — TEK GÖRSEL, TEK İNCE KATMAN
   --------------------------------------------------------------------------
   Kullanıcı şartı: "katman katman görselde olmasın". Bu yüzden kaydırıcıda
   görsel üzerinde yalnızca TEK bir okunabilirlik perdesi (scrim) kullanılır.
   Ek bir renk katmanı/gradyan yığını, vignette veya ikinci örtü YOKTUR.
   ========================================================================== */
.slider.hero-slider{height:min(660px,78vh);min-height:480px;background:#06182C}
/* Hero kapalıysa devreye giren klasik slider da TEK katmanlı perde kullanır */
.slider:not(.hero-slider){height:min(560px,72vh);background:#06182C}
.slider:not(.hero-slider) .slide-bg::after{
  background:linear-gradient(90deg,rgba(6,24,44,.86) 0%,rgba(6,24,44,.58) 55%,rgba(6,24,44,.24) 100%);
}
.slider:not(.hero-slider) .slide-box h2{font-family:var(--font-display);font-weight:800}
.slider:not(.hero-slider) .slide-btns .btn-primary{
  background:linear-gradient(135deg,#F5A524 0%,#E08C10 100%);color:#20130A;
}
.slider:not(.hero-slider) .slide-btns .btn-primary:hover{background:linear-gradient(135deg,#FFB63C 0%,#F5A524 100%);color:#20130A}
.slider:not(.hero-slider) .slide-badge{background:rgba(245,165,36,.18);border-color:rgba(245,165,36,.55);color:#FFD98A}
.hero-slider .slide-bg::after{
  content:'';
  position:absolute;inset:0;
  /* TEK katman: soldan sağa tek doğrusal perde (metin alanı koyulaşır) */
  background:linear-gradient(90deg,rgba(6,24,44,.88) 0%,rgba(6,24,44,.72) 38%,rgba(6,24,44,.34) 68%,rgba(6,24,44,.18) 100%);
}
.hero-slider .slide-bg img{object-position:center 55%}
.hero-slider .slide-content{align-items:center}
.hero-slider .hero-left{
  max-width:660px;
  color:#fff;
  text-shadow:0 1px 2px rgba(4,14,26,.35);
}
/* Slider içindeki metin rengi — zeminden bağımsız, net okunur */
.hero-slider .hero-left h1{color:#fff}
.hero-slider .hero-left h1 em{color:var(--accent);font-style:normal}
.hero-slider .hero-sub{color:#E6EEF6;max-width:560px;font-size:16.5px}
.hero-slider .hero-badge{
  background:rgba(245,165,36,.16);
  border:1px solid rgba(245,165,36,.55);
  color:#FFD98A;font-weight:600;
}
.hero-slider .hero-stats{grid-template-columns:repeat(3,minmax(0,170px));max-width:none;margin-top:38px}
.hero-slider .hero-stat{
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.22);
  border-radius:14px;padding:14px 16px;text-align:left;
  box-shadow:none;backdrop-filter:blur(3px);
}
.hero-slider .hero-stat b{color:#fff;font-size:22px;font-weight:800;font-family:var(--font-display)}
.hero-slider .hero-stat span{color:#CBDCEC;font-size:12.5px}

/* Buton kontrastı: dolu altın + dolu beyaz + şeffaf (kenarlığı açık) */
.hero-slider .hero-actions .btn{box-shadow:0 10px 26px rgba(4,14,26,.32)}
.hero-slider .hero-actions .btn-primary{
  background:linear-gradient(135deg,#F5A524 0%,#E08C10 100%);
  color:#20130A;                       /* koyu yazı -> altın zeminde okunur */
  border:1px solid rgba(255,255,255,.25);
}
.hero-slider .hero-actions .btn-primary:hover{background:linear-gradient(135deg,#FFB63C 0%,#F5A524 100%);color:#20130A}
.hero-slider .hero-actions .btn-outline{
  background:rgba(255,255,255,.96);color:#0A2540;border:1.5px solid #fff;
}
.hero-slider .hero-actions .btn-outline:hover{background:#fff;color:#06182C;border-color:#fff}

/* Mobilde metin okunabilirliği */
@media (max-width:900px){
  .slider.hero-slider{height:auto;min-height:520px}
  .hero-slider .slide-bg::after{background:linear-gradient(180deg,rgba(6,24,44,.55) 0%,rgba(6,24,44,.86) 55%,rgba(6,24,44,.94) 100%)}
  .hero-slider .slide-content{padding:54px 0}
  .hero-slider .hero-stats{grid-template-columns:repeat(3,1fr)}
  .hero-slider .hero-stat b{font-size:18px}
  .hero-slider .hero-stat span{font-size:11px}
}

/* ==========================================================================
   2) SAYFA BAŞLIĞI / KIRINTI (BREADCRUMB) KONTRASTİ
   --------------------------------------------------------------------------
   Sayfa başlığı lacivert zeminde. Kırıntı rozetleri yüksek kontrastlı ve
   sade tutulur: üst öğeler yarı saydam beyaz, içinde bulunulan (current)
   öğe altın zemin + koyu yazı. Kayan "parıltı" katmanı kaldırıldı.
   ========================================================================== */
.page-header{
  background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);
  padding:44px 0 26px;
}
.page-header::before{display:none}
.page-header::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(115deg,rgba(6,24,44,.35) 0%,rgba(6,24,44,0) 60%);
}
.page-header>.container{position:relative;z-index:2}
.page-header h1{color:#fff;margin-bottom:14px;text-shadow:0 2px 10px rgba(4,14,26,.35)}

.crumbs{position:relative;z-index:2;display:inline-flex;align-items:center;gap:7px;flex-wrap:wrap;font-size:13px;color:#C6D8E8}
.crumbs::before{display:none}
.crumbs i{font-size:10px;color:#8FA9C0}
.crumbs a{
  position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:6px;
  padding:6px 14px;border-radius:9px;font-size:13px;font-weight:600;text-decoration:none;
  color:#FFFFFF;background:rgba(255,255,255,.13);
  border:1px solid rgba(255,255,255,.32);
  box-shadow:none;transition:background .18s,border-color .18s;
}
.crumbs a::before{display:none}
.crumbs a:hover{color:#FFFFFF;background:rgba(245,165,36,.28);border-color:rgba(245,165,36,.65);transform:none;box-shadow:none}
/* İçinde bulunulan sayfa: altın zemin + koyu yazı -> maksimum okunabilirlik */
.crumbs span:last-child,.page-header .crumbs span:last-child{
  position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:6px;
  padding:6px 15px;border-radius:9px;font-size:13px;font-weight:700;
  color:#1C1206;background:#F5A524;border:1px solid #FFD166;
  box-shadow:0 4px 14px rgba(0,0,0,.22);
}
.crumbs span:last-child:hover{transform:none;box-shadow:0 4px 14px rgba(0,0,0,.22);color:#1C1206}
.crumbs a,.crumbs span,.page-header .crumbs a,.page-header .crumbs span:last-child{text-shadow:none}
.crumbs a:not(:last-child),.page-header .crumbs span:not(:last-child){text-shadow:none}

/* ==========================================================================
   3) BÖLÜM BAŞLIKLARI & ETİKETLER
   ========================================================================== */
.section-head h2{color:var(--heading)}
.sh-tag{
  background:rgba(245,165,36,.14);
  color:#A96A08;
  border:1px solid rgba(245,165,36,.35);
}
.section.gray{background:var(--soft)}
.section-head p{color:var(--muted)}

/* ==========================================================================
   4) KARTLAR
   ========================================================================== */
.exp-card,.srv-card,.blog-card,.expert-card,.tst-premium,.pro-card{
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow-sm);
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
  background:#fff;
}
.exp-card:hover,.srv-card:hover,.blog-card:hover,.expert-card:hover,.pro-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow);
  border-color:#C6D9EC;
}
.exp-media,.srv-media,.blog-media{background:var(--soft2)}
.exp-icon{
  background:linear-gradient(135deg,var(--primary) 0%,var(--secondary) 100%);
  color:#fff;
}
.exp-icon i{color:#fff}
.exp-card:hover .exp-icon,.srv-card:hover .srv-icon{background:linear-gradient(135deg,#1B4C7E 0%,#0A2540 100%)}
.exp-link,.srv-more{color:#0A2540;font-weight:700}
.exp-link:hover,.srv-more:hover{color:#C97F14}
.see-all{color:#fff !important}
.see-all:hover{color:#fff !important}
.blog-cat{background:rgba(245,165,36,.16);color:#A96A08;border:1px solid rgba(245,165,36,.35)}

.expert-info .e-title{color:#C97F14}
.expert-info .e-branch{color:var(--body)}

/* Yorum kartı */
.tst-premium{position:relative;overflow:hidden}
.tp-stars{color:#F5A524;letter-spacing:2px}
.tp-badge{background:rgba(16,185,129,.10);color:#047857;border:1px solid rgba(16,185,129,.25)}

/* ==========================================================================
   5) CTA BANDI
   ========================================================================== */
.cta-band{background:linear-gradient(120deg,var(--primary) 0%,var(--primary-dark) 100%);position:relative;overflow:hidden}
.cta-band::before{
  content:'';position:absolute;width:520px;height:520px;border-radius:50%;
  background:radial-gradient(circle,rgba(245,165,36,.16),transparent 70%);
  top:-220px;right:-140px;
}
.cta-band h2,.cta-band h3{color:#fff}
.cta-band p{color:#C6D6E5}
.cta-band .btn-ghost{background:rgba(255,255,255,.14);color:#fff;border:1.5px solid rgba(255,255,255,.42)}
.cta-band .btn-ghost:hover{background:rgba(255,255,255,.24)}
.cta-band .btn-primary{background:linear-gradient(135deg,#F5A524 0%,#E08C10 100%);color:#20130A}
.cta-band .btn-primary:hover{background:linear-gradient(135deg,#FFB63C 0%,#F5A524 100%);color:#20130A}
.cta-band-inline{margin-top:44px;border-radius:var(--radius);padding:34px 38px;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}

/* ==========================================================================
   6) LOGO ŞERİDİ & REFERANS KARTLARI
   ========================================================================== */
.logo-strip{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px}
.logo-strip a,.logo-strip span{
  background:#fff;border:1px solid var(--line);border-radius:14px;
  min-width:168px;height:74px;display:inline-flex;align-items:center;justify-content:center;
  padding:10px 18px;box-shadow:0 4px 16px rgba(10,37,64,.06);
  transition:transform .2s,box-shadow .2s,border-color .2s;
}
.logo-strip a:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#C6D9EC}
.logo-strip img{max-height:52px;width:auto;filter:grayscale(.35);opacity:.9;transition:filter .2s,opacity .2s}
.logo-strip a:hover img{filter:none;opacity:1}
.lg-name{font-family:var(--font-display);font-weight:800;font-size:15px;letter-spacing:.6px;color:var(--secondary)}

.ref-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px}
.ref-card{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  min-height:132px;padding:22px 20px;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:14px;text-align:center;
  box-shadow:var(--shadow-sm);transition:transform .2s,box-shadow .2s,border-color .2s;
}
.ref-card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#C6D9EC}
.ref-card img{max-height:56px;width:auto;object-fit:contain;filter:grayscale(.3);opacity:.92;transition:filter .2s,opacity .2s}
.ref-card:hover img{filter:none;opacity:1}
.ref-card span{font-family:var(--font-display);font-weight:700;font-size:14.5px;color:var(--secondary);letter-spacing:.3px}

/* ==========================================================================
   7) FORM & BUTON
   ========================================================================== */
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.contact-form,.appointment-card,.form-card{background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow-sm)}
input,select,textarea{font-family:inherit}
.form-msg.ok{background:#ecfdf5;color:#065f46;border-color:#a7f3d0}
.form-msg.err{background:#fef2f2;color:#b91c1c;border-color:#fecaca}
.btn-accent{background:linear-gradient(135deg,#F5A524 0%,#E08C10 100%);color:#20130A}
.btn-accent:hover{background:linear-gradient(135deg,#FFB63C 0%,#F5A524 100%);color:#20130A}
.btn-primary{background:linear-gradient(135deg,var(--primary) 0%,var(--secondary) 100%)}

/* SSS akordeon */
.faq-item{border:1px solid var(--line);border-radius:14px;background:#fff;overflow:hidden}
.faq-item.open{border-color:#C6D9EC;box-shadow:var(--shadow-sm)}
.faq-q{color:var(--heading);font-family:var(--font-display);font-weight:700}
.faq-q:hover{color:var(--primary)}
.faq-q i{color:var(--accent);transition:transform .2s}
.faq-item.open .faq-q i{transform:rotate(45deg)}

/* ==========================================================================
   8) FOOTER
   ========================================================================== */
.footer{background:var(--footer-bg);color:var(--footer-text)}
.footer h4{color:var(--footer-head);font-family:var(--font-display)}
.footer a{color:var(--footer-text)}
.footer a:hover{color:#FFD98A}
.footer-logo img{height:56px;width:auto}
.footer-bottom{border-top:1px solid rgba(255,255,255,.10)}
.social-links a:hover{background:var(--accent);color:#20130A}
.whatsapp-float{background:#25D366;color:#fff}
.whatsapp-float:hover{background:#1EB855;color:#fff}

/* ==========================================================================
   9) DİL SEÇİCİ (üst bar, koyu zemin)
   ========================================================================== */
.topbar .langsw-top .langsw-btn{
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.20);color:#fff;
}
.topbar .langsw-top .langsw-btn:hover,.topbar .langsw.open .langsw-btn{
  background:rgba(245,165,36,.20);border-color:rgba(245,165,36,.55);color:#FFD98A;
}
.langsw-menu a.langsw-item{color:#2B3A4A}
.langsw-menu a.langsw-item:hover,.langsw-menu a.langsw-item.active{background:var(--soft2);color:var(--primary)}
.langsw-menu a.langsw-item.active{box-shadow:inset 3px 0 0 var(--accent)}
.langsw-flag{border-radius:3px;box-shadow:0 0 0 1px rgba(10,37,64,.12)}

/* ==========================================================================
   10) VURGU VİZGÜELİ (hizmet bölgeleri kartlarındaki ikon)
   ========================================================================== */
.vrk-globe{position:relative}
.vrk-globe::after{
  content:'';position:absolute;right:-40px;top:-40px;width:200px;height:200px;border-radius:50%;
  background:radial-gradient(circle,rgba(245,165,36,.14),transparent 70%);pointer-events:none;
}

/* ==========================================================================
   11) RESPONSIVE
   ========================================================================== */
@media (max-width:860px){
  .hero-slider .hero-stats{grid-template-columns:repeat(3,1fr)}
  .cta-band-inline{padding:26px 22px}
  .form-row{grid-template-columns:1fr}
  .ref-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
  .logo-strip a,.logo-strip span{min-width:140px;height:62px}
}
/* ==========================================================================
   12) DIL SECICI — dishekimleri referansi ile birebir
   ========================================================================== */
.langsw .langsw-btn{
  display:inline-flex;align-items:center;gap:7px;
  background:var(--soft);border:1.5px solid var(--line);color:var(--nav);
  font:inherit;font-size:13px;font-weight:600;padding:8px 13px;border-radius:10px;
  cursor:pointer;transition:border-color .15s,color .15s,background .15s;
}
.langsw .langsw-btn:hover,.langsw.open .langsw-btn{border-color:var(--accent);color:var(--accent-dark)}
.langsw .langsw-caret{font-size:9px;opacity:.7;transition:transform .18s}
.langsw.open .langsw-caret{transform:rotate(180deg)}
.langsw .langsw-menu{
  position:absolute;top:calc(100% + 8px);right:0;min-width:180px;
  background:#fff;border:0;border-radius:12px;box-shadow:0 16px 44px rgba(10,37,64,.18);
  padding:7px;list-style:none;margin:0;opacity:0;visibility:hidden;transform:translateY(8px);
  transition:.18s;z-index:120;max-height:340px;overflow:auto;
}
.langsw.open .langsw-menu,.langsw:hover .langsw-menu,.langsw:focus-within .langsw-menu{opacity:1;visibility:visible;transform:none}
.langsw .langsw-menu a.langsw-item{
  display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:8px;
  font-size:13.5px;color:#2B3A4A;box-shadow:none;
}
.langsw .langsw-menu a.langsw-item:hover{background:rgba(245,165,36,.12);color:var(--primary)}
.langsw .langsw-menu a.langsw-item.active{background:rgba(245,165,36,.12);color:var(--accent-dark);font-weight:700}
.langsw .langsw-menu a.langsw-item.active::after{content:none;display:none}
.langsw .langsw-flag{width:22px;height:16px;object-fit:cover;border-radius:3px;display:inline-block;box-shadow:0 0 0 1px rgba(10,37,64,.12)}
/* Ust bar (koyu zemin): acik zeminli, referans gorunumlu tetikleyici */
.topbar .langsw-top .langsw-btn{
  background:rgba(255,255,255,.96);border:1.5px solid rgba(255,255,255,.35);
  color:#0A2540;padding:5px 12px;font-size:12px;border-radius:10px;
}
.topbar .langsw-top .langsw-btn:hover,.topbar .langsw-top.langsw.open .langsw-btn{
  background:#fff;border-color:var(--accent);color:#0A2540;
}
.topbar .langsw-top .langsw-caret{color:#8A6A2A;opacity:.9}
.topbar .langsw-top .langsw-menu{
  top:calc(100% + 12px);right:0;min-width:192px;padding:7px;border-radius:12px;
  box-shadow:0 20px 50px rgba(4,12,26,.45);
}
.topbar .langsw-top .langsw-menu::before{display:none}
.topbar .langsw-top .langsw-menu a.langsw-item{
  border-radius:8px;padding:8px 11px;gap:10px;font-size:13px;color:#2B3A4A;
}
.topbar .langsw-top .langsw-menu a.langsw-item:hover,
.topbar .langsw-top .langsw-menu a.langsw-item.active{background:rgba(245,165,36,.12);color:var(--primary)}
.topbar .langsw-top .langsw-menu a.langsw-item.active{box-shadow:none;font-weight:700}

/* ==========================================================================
   13) UST BAR SOSYAL IKONLARI — premium dolgu efekti
   ========================================================================== */
.topbar .tb-group a[target="_blank"]{
  position:relative;isolation:isolate;overflow:hidden;
  width:27px;height:27px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;
  color:var(--topbar-text);transition:color .28s ease,transform .3s cubic-bezier(.22,1,.36,1);
}
.topbar .tb-group a[target="_blank"] i{position:relative;z-index:1;margin:0;font-size:13px;transition:transform .3s ease}
.topbar .tb-group a[target="_blank"]::before{
  content:'';position:absolute;inset:0;z-index:0;border-radius:inherit;
  background:linear-gradient(150deg,#FFD79B 0%,#F5A524 55%,#D98C1A 100%);
  transform:scale(.2);opacity:0;
  transition:transform .38s cubic-bezier(.34,1.56,.64,1),opacity .28s ease;
}
.topbar .tb-group a[target="_blank"]:hover{color:#06182C;transform:translateY(-2px);opacity:1}
.topbar .tb-group a[target="_blank"]:hover::before{transform:scale(1);opacity:1}
.topbar .tb-group a[target="_blank"]:hover i{transform:scale(1.08)}

/* ==========================================================================
   14) LOGO BOYUTLARI (ust + alt)
   ========================================================================== */
.header .brand-logo{height:62px}
.footer .brand img{height:72px !important}
@media (max-width:860px){
  .header .brand-logo{height:52px}
  .footer .brand img{height:62px !important}
}

/* ==========================================================================
   15) FOOTER BASLIK CIZGISI + OK RENGI
   (renk = footer iletisim ikon dolgusu #E8A33D)
   ========================================================================== */
.footer h4::after{background:#E8A33D}
.footer ul a::before{color:#E8A33D}

/* ==========================================================================
   16) YUZEN TELEFON BUTONU — gorunur renk gecisi
   ========================================================================== */
.fb-call{transition:background .32s ease,color .32s ease,transform .32s ease,box-shadow .32s ease}
.fb-call i{transition:color .32s ease,transform .32s ease}
.fb-call:hover{
  background:linear-gradient(135deg,#FFC770 0%,#F5A524 60%,#E08C10 100%);
  color:#0A2540;transform:translateY(-3px) scale(1.05);
  box-shadow:0 14px 32px rgba(245,165,36,.5);
}
.fb-call:hover i{transform:rotate(-8deg) scale(1.06)}

/* ==========================================================================
   17) PREMIUM DOLGU BUTONLARI
   ========================================================================== */
.btn-cta-quote,.btn-cta-call{
  position:relative;overflow:hidden;isolation:isolate;z-index:0;
  transition:color .35s ease,transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s ease,border-color .35s ease;
}
.btn-cta-quote{
  background:rgba(255,255,255,.14);color:#fff;border:1.5px solid rgba(255,255,255,.45);
  box-shadow:0 10px 26px rgba(4,14,26,.22);
}
.btn-cta-quote::before{
  content:'';position:absolute;inset:0;z-index:-1;
  background:linear-gradient(150deg,#FFD79B 0%,#F5A524 55%,#E08C10 100%);
  transform:translateX(-101%);transition:transform .55s cubic-bezier(.22,1,.36,1);
}
.btn-cta-quote::after{
  content:'';position:absolute;top:-40%;left:-30%;width:34%;height:180%;z-index:-1;pointer-events:none;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-18deg) translateX(-40px);opacity:0;
}
.btn-cta-quote:hover{color:#20130A;border-color:#FFD166;transform:translateY(-3px);box-shadow:0 16px 36px rgba(245,165,36,.4)}
.btn-cta-quote:hover::before{transform:translateX(0)}
.btn-cta-quote:hover::after{animation:ctaShine .8s ease forwards}
.btn-cta-call{
  background:#fff;color:#0A2540;border:1.5px solid #fff;box-shadow:0 10px 26px rgba(4,14,26,.22);
}
.btn-cta-call::before{
  content:'';position:absolute;inset:0;z-index:-1;
  background:linear-gradient(150deg,#123A5E 0%,#0A2540 55%,#06182C 100%);
  transform:translateY(101%);transition:transform .55s cubic-bezier(.22,1,.36,1);
}
.btn-cta-call:hover{color:#fff;border-color:rgba(245,165,36,.6);transform:translateY(-3px);box-shadow:0 16px 36px rgba(4,14,26,.45)}
.btn-cta-call:hover::before{transform:translateY(0)}
.btn-cta-call:hover i{color:#FFD98A}
@keyframes ctaShine{0%{opacity:0;transform:skewX(-18deg) translateX(-40px)}25%{opacity:1}100%{opacity:0;transform:skewX(-18deg) translateX(420px)}}

/* Ust menu "Teklif Al" — premium dolgu */
.header-cta .btn-primary{
  position:relative;overflow:hidden;isolation:isolate;z-index:0;
  background:linear-gradient(135deg,var(--primary) 0%,var(--secondary) 100%);
  transition:color .35s ease,transform .3s ease,box-shadow .3s ease;
}
.header-cta .btn-primary::before{
  content:'';position:absolute;inset:0;z-index:-1;
  background:linear-gradient(135deg,#FFD79B 0%,#F5A524 55%,#E08C10 100%);
  transform:translateX(-101%);transition:transform .5s cubic-bezier(.22,1,.36,1);
}
.header-cta .btn-primary:hover{
  background:linear-gradient(135deg,var(--primary) 0%,var(--secondary) 100%);
  color:#0A2540;transform:translateY(-2px);
  box-shadow:0 12px 28px rgba(245,165,36,.35);
}
.header-cta .btn-primary:hover::before{transform:translateX(0)}
.header-cta .btn-primary:hover i{color:#0A2540}

/* ==========================================================================
   18) BREADCRUMB — premium dolgu / renk gecisi
   ========================================================================== */
.crumbs a{
  position:relative;overflow:hidden;isolation:isolate;
  transition:color .32s ease,border-color .32s ease,box-shadow .32s ease,transform .32s ease;
}
.crumbs a::after{
  content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;
  background:linear-gradient(150deg,#FFD79B 0%,#F5A524 60%,#E08C10 100%);
  transform:translateY(101%);transition:transform .45s cubic-bezier(.22,1,.36,1);
}
.crumbs a:hover{
  color:#1C1206 !important;background:rgba(255,255,255,.13);
  border-color:#FFD166;transform:translateY(-2px);
  box-shadow:0 10px 24px rgba(0,0,0,.25);
}
.crumbs a:hover::after{transform:translateY(0)}

/* ==========================================================================
   19) BLOG ARAMA — buyutec beyaz (koyu buton uzerinde gorunur)
   ========================================================================== */
.btn-primary{color:#fff}
.btn-primary:hover{color:#fff}
.search-form .btn-primary,.search-form .btn-primary i{color:#fff}

/* ==========================================================================
   20) BLOG DETAY ALT CTA — farkli renklerde premium dolgu
   ========================================================================== */
.bd-cta .btn{
  position:relative;overflow:hidden;isolation:isolate;z-index:0;
  transition:color .35s ease,transform .3s ease,box-shadow .3s ease,border-color .35s ease;
}
.bd-cta .btn::before{
  content:'';position:absolute;inset:0;z-index:-1;
  transform:translateY(101%);transition:transform .5s cubic-bezier(.22,1,.36,1);
}
.bd-cta .btn-primary::before{background:linear-gradient(150deg,#FFD79B 0%,#F5A524 55%,#E08C10 100%)}
.bd-cta .btn-primary:hover{
  color:#20130A !important;transform:translateY(-3px);
  box-shadow:0 14px 32px rgba(245,165,36,.4);
}
.bd-cta .btn-primary:hover::before{transform:translateY(0)}
.bd-cta .btn-primary:hover i{color:#20130A}
.bd-cta .btn-outline::before{background:linear-gradient(150deg,#123A5E 0%,#0A2540 60%,#06182C 100%)}
.bd-cta .btn-outline:hover{
  color:#fff !important;background:#fff;border-color:#0A2540;transform:translateY(-3px);
  box-shadow:0 14px 32px rgba(10,37,64,.32);
}
.bd-cta .btn-outline:hover::before{transform:translateY(0)}

/* ==========================================================================
   21) REFERANSLAR — premium tasarim
   ========================================================================== */
.ref-section{position:relative;background:
  radial-gradient(900px 420px at 85% -10%,rgba(245,165,36,.10),transparent 65%),
  radial-gradient(700px 380px at 0% 100%,rgba(10,37,64,.06),transparent 60%),
  #fff;
}
.ref-head{text-align:center;max-width:720px;margin:0 auto 44px}
.ref-head .sh-tag{display:inline-block;margin-bottom:14px}
.ref-head h2{font-size:clamp(26px,3.4vw,38px);font-weight:800;letter-spacing:-.02em;margin-bottom:14px;position:relative;display:inline-block;padding-bottom:16px}
.ref-head h2::after{content:'';position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:64px;height:4px;border-radius:4px;background:linear-gradient(90deg,#F5A524,#FFD79B)}
.ref-head p{color:var(--body);font-size:15px;line-height:1.8}

.ref-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:22px}
.ref-card{
  position:relative;isolation:isolate;overflow:hidden;
  min-height:178px;padding:26px 20px 24px;border-radius:20px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;text-align:center;
  background:linear-gradient(180deg,#fff 0%,#F7FAFD 100%);
  border:1px solid var(--line);
  box-shadow:0 8px 26px rgba(10,37,64,.07);
  transition:transform .4s cubic-bezier(.22,1,.36,1),box-shadow .4s ease,border-color .4s ease;
}
.ref-card::before{
  content:'';position:absolute;inset:0;z-index:-1;
  background:linear-gradient(155deg,#123A5E 0%,#0A2540 52%,#06182C 100%);
  transform:translateY(101%);transition:transform .55s cubic-bezier(.22,1,.36,1);
}
.ref-card::after{
  content:'';position:absolute;top:0;left:24px;right:24px;height:3px;border-radius:0 0 4px 4px;
  background:linear-gradient(90deg,#F5A524,#FFD79B);
  opacity:.55;transition:left .45s ease,right .45s ease,opacity .45s ease;
}
.ref-card:hover{transform:translateY(-7px);border-color:rgba(245,165,36,.55);box-shadow:0 24px 46px -16px rgba(10,37,64,.45)}
.ref-card:hover::before{transform:translateY(0)}
.ref-card:hover::after{left:0;right:0;opacity:1}
.ref-logo{
  position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;
  min-width:112px;min-height:64px;padding:10px 16px;border-radius:13px;background:#fff;
  box-shadow:0 6px 18px rgba(10,37,64,.10);
  transition:transform .4s cubic-bezier(.22,1,.36,1),box-shadow .4s ease;
}
.ref-card img{max-height:50px;width:auto;max-width:150px;object-fit:contain;filter:grayscale(.28);opacity:.95;transition:filter .35s ease,opacity .35s ease}
.ref-card:hover .ref-logo{transform:translateY(-2px) scale(1.05);box-shadow:0 12px 26px rgba(0,0,0,.28)}
.ref-card:hover img{filter:none;opacity:1}
.ref-name{position:relative;z-index:1;font-family:var(--font-display);font-weight:700;font-size:15px;color:var(--primary);letter-spacing:.2px;line-height:1.35;transition:color .35s ease}
.ref-card:hover .ref-name{color:#fff}
.ref-arrow{
  position:absolute;top:14px;right:14px;z-index:1;font-size:11px;
  color:var(--accent-dark);opacity:0;transform:translate(-4px,4px);
  transition:opacity .35s ease,transform .35s ease,color .35s ease;
}
.ref-card:hover .ref-arrow{opacity:1;transform:none;color:#FFD98A}

.ref-cta{margin-top:52px;border-radius:22px}

@media (max-width:640px){
  .ref-grid{grid-template-columns:1fr 1fr;gap:14px}
  .ref-card{min-height:150px;padding:20px 12px 18px}
  .ref-logo{min-width:92px;min-height:56px;padding:8px 12px}
  .ref-card img{max-height:40px;max-width:110px}
  .ref-name{font-size:13px}
}
@media (prefers-reduced-motion:reduce){
  .topbar .tb-group a[target="_blank"],
  .topbar .tb-group a[target="_blank"]::before,
  .btn-cta-quote,.btn-cta-quote::before,.btn-cta-quote::after,
  .btn-cta-call,.btn-cta-call::before,
  .header-cta .btn-primary,.header-cta .btn-primary::before,
  .crumbs a,.crumbs a::after,
  .bd-cta .btn,.bd-cta .btn::before,
  .ref-card,.ref-card::before,.ref-card::after,.ref-logo,.ref-name{
    transition:none !important;animation:none !important;
  }
}
.cta-actions{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
@media (max-width:640px){.cta-actions{width:100%;justify-content:center}.cta-actions .btn{flex:1 1 auto;justify-content:center}}

/* ==========================================================================
   HERO (canli lojistik) — premium dolgu efektleri
   Teklif Alin / Hizmetlerimiz butonlari + 3 istatistik karti
   ========================================================================== */
.hero .hero-actions .btn{
  position:relative;overflow:hidden;isolation:isolate;z-index:0;
  transition:color .35s ease,transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s ease,border-color .35s ease;
}
.hero .hero-actions .btn::before{
  content:'';position:absolute;inset:0;z-index:-2;
  transform:translateY(101%);transition:transform .55s cubic-bezier(.22,1,.36,1);
}
.hero .hero-actions .btn::after{
  content:'';position:absolute;top:-40%;left:-30%;width:34%;height:180%;z-index:-1;pointer-events:none;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-18deg) translateX(-40px);opacity:0;
}
.hero .hero-actions .btn:hover::after{animation:heroBtnShine .85s ease forwards}
@keyframes heroBtnShine{
  0%{opacity:0;transform:skewX(-18deg) translateX(-40px)}
  25%{opacity:1}
  100%{opacity:0;transform:skewX(-18deg) translateX(430px)}
}

/* Teklif Alin: altin zemin -> lacivert dolgu */
.hero .hero-actions .btn-primary{
  background:linear-gradient(135deg,#F5A524 0%,#E08C10 100%);
  color:#20130A;border:1px solid rgba(255,255,255,.25);
  box-shadow:0 10px 26px rgba(4,14,26,.32);
}
.hero .hero-actions .btn-primary::before{
  background:linear-gradient(135deg,#123A5E 0%,#0A2540 58%,#06182C 100%);
}
.hero .hero-actions .btn-primary:hover{
  color:#fff;border-color:rgba(245,165,36,.8);transform:translateY(-3px);
  box-shadow:0 16px 36px rgba(4,14,26,.5),0 0 0 3px rgba(245,165,36,.18);
}
.hero .hero-actions .btn-primary:hover::before{transform:translateY(0)}
.hero .hero-actions .btn-primary:hover i{color:#FFD98A}

/* Hizmetlerimiz: beyaz zemin -> altin dolgu */
.hero .hero-actions .btn-outline{
  background:rgba(255,255,255,.96);color:#0A2540;border:1.5px solid #fff;
  box-shadow:0 10px 26px rgba(4,14,26,.32);
}
.hero .hero-actions .btn-outline::before{
  background:linear-gradient(150deg,#FFD79B 0%,#F5A524 55%,#E08C10 100%);
}
.hero .hero-actions .btn-outline:hover{
  color:#20130A;border-color:#FFD166;transform:translateY(-3px);
  box-shadow:0 16px 36px rgba(245,165,36,.4);
}
.hero .hero-actions .btn-outline:hover::before{transform:translateY(0)}
.hero .hero-actions .btn-outline:hover i{color:#20130A}

/* Istatistik kartlari: lacivert dolgu + altin rakam */
.hero .hero-stats .hero-stat{
  position:relative;isolation:isolate;overflow:hidden;
  transition:transform .4s cubic-bezier(.22,1,.36,1),box-shadow .4s ease,border-color .4s ease;
}
.hero .hero-stats .hero-stat::before{
  content:'';position:absolute;inset:0;z-index:-1;
  background:linear-gradient(155deg,#123A5E 0%,#0A2540 52%,#06182C 100%);
  transform:translateY(101%);transition:transform .55s cubic-bezier(.22,1,.36,1);
}
.hero .hero-stats .hero-stat::after{
  content:'';position:absolute;top:0;left:20%;right:20%;height:3px;border-radius:0 0 4px 4px;
  background:linear-gradient(90deg,#F5A524,#FFD79B);opacity:0;transition:opacity .4s ease,left .4s ease,right .4s ease;
}
.hero .hero-stats .hero-stat b,
.hero .hero-stats .hero-stat span{
  position:relative;z-index:1;
  transition:color .35s ease,transform .4s cubic-bezier(.22,1,.36,1);
}
.hero .hero-stats .hero-stat:hover{
  transform:translateY(-6px);
  border-color:rgba(245,165,36,.8);
  box-shadow:0 20px 42px -14px rgba(0,0,0,.55),0 0 0 1px rgba(245,165,36,.35),0 12px 30px -8px rgba(245,165,36,.35);
}
.hero .hero-stats .hero-stat:hover::before{transform:translateY(0)}
.hero .hero-stats .hero-stat:hover::after{opacity:1;left:0;right:0}
.hero .hero-stats .hero-stat:hover b{color:#FFD98A;transform:translateY(-1px)}
.hero .hero-stats .hero-stat:hover span{color:#fff;transform:translateY(-1px)}

@media (prefers-reduced-motion:reduce){
  .hero .hero-actions .btn,
  .hero .hero-actions .btn::before,
  .hero .hero-actions .btn::after,
  .hero .hero-stats .hero-stat,
  .hero .hero-stats .hero-stat::before,
  .hero .hero-stats .hero-stat::after,
  .hero .hero-stats .hero-stat b,
  .hero .hero-stats .hero-stat span{transition:none !important;animation:none !important}
  .hero .hero-actions .btn:hover,
  .hero .hero-stats .hero-stat:hover{transform:none}
}

/* ==========================================================================
   HERO (canli lojistik) — premium dolgu efektleri
   Teklif Alin / Hizmetlerimiz butonlari + 3 istatistik karti
   ========================================================================== */
.hero-slider .hero-actions .btn{
  position:relative;overflow:hidden;isolation:isolate;z-index:0;
  transition:color .35s ease,transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s ease,border-color .35s ease;
}
.hero-slider .hero-actions .btn::before{
  content:'';position:absolute;inset:0;z-index:-2;
  transform:translateY(101%);transition:transform .55s cubic-bezier(.22,1,.36,1);
}
.hero-slider .hero-actions .btn::after{
  content:'';position:absolute;top:-40%;left:-30%;width:34%;height:180%;z-index:-1;pointer-events:none;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-18deg) translateX(-40px);opacity:0;
}
.hero-slider .hero-actions .btn:hover::after{animation:heroBtnShine .85s ease forwards}
@keyframes heroBtnShine{
  0%{opacity:0;transform:skewX(-18deg) translateX(-40px)}
  25%{opacity:1}
  100%{opacity:0;transform:skewX(-18deg) translateX(430px)}
}

/* Teklif Alin: altin zemin -> lacivert dolgu */
.hero-slider .hero-actions .btn-primary{
  background:linear-gradient(135deg,#F5A524 0%,#E08C10 100%);
  color:#20130A;border:1px solid rgba(255,255,255,.25);
  box-shadow:0 10px 26px rgba(4,14,26,.32);
}
.hero-slider .hero-actions .btn-primary::before{
  background:linear-gradient(135deg,#123A5E 0%,#0A2540 58%,#06182C 100%);
}
.hero-slider .hero-actions .btn-primary:hover{
  color:#fff;border-color:rgba(245,165,36,.8);transform:translateY(-3px);
  box-shadow:0 16px 36px rgba(4,14,26,.5),0 0 0 3px rgba(245,165,36,.18);
}
.hero-slider .hero-actions .btn-primary:hover::before{transform:translateY(0)}
.hero-slider .hero-actions .btn-primary:hover i{color:#FFD98A}

/* Hizmetlerimiz: beyaz zemin -> altin dolgu */
.hero-slider .hero-actions .btn-outline{
  background:rgba(255,255,255,.96);color:#0A2540;border:1.5px solid #fff;
  box-shadow:0 10px 26px rgba(4,14,26,.32);
}
.hero-slider .hero-actions .btn-outline::before{
  background:linear-gradient(150deg,#FFD79B 0%,#F5A524 55%,#E08C10 100%);
}
.hero-slider .hero-actions .btn-outline:hover{
  color:#20130A;border-color:#FFD166;transform:translateY(-3px);
  box-shadow:0 16px 36px rgba(245,165,36,.4);
}
.hero-slider .hero-actions .btn-outline:hover::before{transform:translateY(0)}
.hero-slider .hero-actions .btn-outline:hover i{color:#20130A}

/* Istatistik kartlari: lacivert dolgu + altin rakam */
.hero-slider .hero-stats .hero-stat{
  position:relative;isolation:isolate;overflow:hidden;
  transition:transform .4s cubic-bezier(.22,1,.36,1),box-shadow .4s ease,border-color .4s ease;
}
.hero-slider .hero-stats .hero-stat::before{
  content:'';position:absolute;inset:0;z-index:-1;
  background:linear-gradient(155deg,#123A5E 0%,#0A2540 52%,#06182C 100%);
  transform:translateY(101%);transition:transform .55s cubic-bezier(.22,1,.36,1);
}
.hero-slider .hero-stats .hero-stat::after{
  content:'';position:absolute;top:0;left:20%;right:20%;height:3px;border-radius:0 0 4px 4px;
  background:linear-gradient(90deg,#F5A524,#FFD79B);opacity:0;transition:opacity .4s ease,left .4s ease,right .4s ease;
}
.hero-slider .hero-stats .hero-stat b,
.hero-slider .hero-stats .hero-stat span{
  position:relative;z-index:1;
  transition:color .35s ease,transform .4s cubic-bezier(.22,1,.36,1);
}
.hero-slider .hero-stats .hero-stat:hover{
  transform:translateY(-6px);
  border-color:rgba(245,165,36,.8);
  box-shadow:0 20px 42px -14px rgba(0,0,0,.55),0 0 0 1px rgba(245,165,36,.35),0 12px 30px -8px rgba(245,165,36,.35);
}
.hero-slider .hero-stats .hero-stat:hover::before{transform:translateY(0)}
.hero-slider .hero-stats .hero-stat:hover::after{opacity:1;left:0;right:0}
.hero-slider .hero-stats .hero-stat:hover b{color:#FFD98A;transform:translateY(-1px)}
.hero-slider .hero-stats .hero-stat:hover span{color:#fff;transform:translateY(-1px)}

@media (prefers-reduced-motion:reduce){
  .hero-slider .hero-actions .btn,
  .hero-slider .hero-actions .btn::before,
  .hero-slider .hero-actions .btn::after,
  .hero-slider .hero-stats .hero-stat,
  .hero-slider .hero-stats .hero-stat::before,
  .hero-slider .hero-stats .hero-stat::after,
  .hero-slider .hero-stats .hero-stat b,
  .hero-slider .hero-stats .hero-stat span{transition:none !important;animation:none !important}
  .hero-slider .hero-actions .btn:hover,
  .hero-slider .hero-stats .hero-stat:hover{transform:none}
}