/* ==========================================================================
   DOSTLAR OCAKBAŞI — Basilico (home_01) teması üzerine marka özelleştirmeleri
   Bu dosya app/dist/app.css ve theme-palette.css'i EZER.
   Tema dosyasına dokunulmaz.

   Palet, işletmenin tabelasından örneklendi:
     #1a2023  antrasit  (tabelanın koyu zemini)
     #d08d4f  bakır     (harflerin yan yüzleri ve tabeladaki çubuklar)
   ========================================================================== */

/* --------------------------------------------------------------------------
   0. TÜRKÇE KARAKTER DÜZELTMESİ  (en üstte olmalı)
   Temanın başlık fontu "Audrey" Türkçe karakterleri basamıyor:
   Ç Ö Ü ç ö ü ş ğ ı ve £ glifleri BOŞ; "DOSTLAR OCAKBAŞI" -> "DOSTLAR OCAKBA I".
   Tema CSS'i 18 yerde font-family:"Audrey" diyor. Tek tek ezmek yerine
   "Audrey" adını, görsel olarak neredeyse aynı ve tam Türkçe destekli
   Marcellus dosyalarına bağlıyoruz. Böylece tema dosyasına hiç
   dokunmadan bütün başlıklar düzeliyor.
   (Gövde fontu DM Sans'ta sorun yok - latin + latin-ext subsetleri
    birbirini tamamlıyor, olduğu gibi bırakıldı.)
   -------------------------------------------------------------------------- */
@font-face {
    font-family: "Audrey";
    src: url("../font/tr/marcellus-400-latin.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Audrey";
    src: url("../font/tr/marcellus-400-latin-ext.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Audrey";
    src: url("../font/tr/marcellus-400-latin.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Audrey";
    src: url("../font/tr/marcellus-400-latin-ext.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
    --do-dark: #1a2023;
    --do-dark-2: #232a2d;
    --do-copper: #d08d4f;
    --do-copper-dark: #b3733a;
    --do-cream: #f9f1e8;
    --do-body: #666666;
    --do-line: #dedede;
}

/* --------------------------------------------------------------------------
   1. Genel — tek sayfa ankor kaydırma payı
   -------------------------------------------------------------------------- */
html {
    scroll-behavior: smooth;
}

#home,
#about,
#menu,
#gallery,
#contact {
    scroll-margin-top: 100px;
}

/* --------------------------------------------------------------------------
   2. Üst çubuk — bakır şerit
   Tema burada e-posta/adres listesi ile bir "language" etiketi bekliyor;
   biz adres + saat ve çalışan bir TR/EN değiştirici koyduk.
   -------------------------------------------------------------------------- */
.top-bar .list-info ul {
    align-items: center;
}

.top-bar ul li {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 500;
}

.top-bar ul li i {
    margin-right: 0;
    font-size: 14px;
    opacity: .8;
}

.top-bar .lang-switch {
    display: inline-flex;
    float: right;
    border: 1px solid rgba(26, 32, 35, .45);
}

.top-bar .lang-switch button {
    background: transparent;
    border: 0;
    padding: 4px 13px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.5px;
    line-height: 1.5;
    color: var(--do-dark);
    cursor: pointer;
    transition: all .25s ease;
}

.top-bar .lang-switch button + button {
    border-left: 1px solid rgba(26, 32, 35, .45);
}

.top-bar .lang-switch button:hover {
    background: rgba(26, 32, 35, .12);
}

.top-bar .lang-switch button.active {
    background: var(--do-dark);
    color: var(--do-copper);
}

/* --------------------------------------------------------------------------
   3. Logo — sarkan rozet
   Rozet yuvarlak ve içi beyaz; 100px'lik çubuğa sığdırılınca yazısı
   okunmuyordu. Çubuktan aşağı, hero'nun koyu perdesinin üstüne sarkıtıyoruz
   (tabela/rozet hissi). Kaydırınca tema çubuğu 80px'lik sabit hâle
   (.is-fixed.is-small) geçiriyor; rozet o zaman küçülüp çubuğa giriyor.
   Görsel: tools/gen_logo.py
   -------------------------------------------------------------------------- */
/* Tema .container'a overflow:hidden veriyor ve çubuğun iç satırı
   içeriği kadar (masaüstünde 46px, mobilde 0) yüksek; rozet bu kutuya
   göre konumlanırsa kırpılıyordu. Kutuyu sıfır yükseklikle çubuğun
   dikey ortasına oturtup rozeti oradan yukarı kaydırıyoruz:
   çubuk 100px -> orta 50px; top:-38px -> rozet çubuğun 12px altından başlar. */
#header_main .container {
    overflow: visible;
}

/* Tema .container'ı 1550px'e kadar açıyor; dizüstü ekranlarda (1280-1536)
   kutu tam genişliğe yayılıp logo ve hero yazısı kenardan yalnızca
   15px içeride kalıyordu. Üst şerit, menü çubuğu ve hero'ya ekranla
   büyüyen (1440px'te ~58px) bir yan boşluk veriyoruz; üçü aynı hizada kalır. */
@media (min-width: 992px) {
    .top-bar .container,
    #header_main .container,
    .mySwiper .container {
        padding-left: clamp(15px, 4vw, 72px);
        padding-right: clamp(15px, 4vw, 72px);
    }
}

.header__logo {
    position: relative;
    flex: 0 0 150px;
    align-self: center;
    height: 0;
}

.header .site-logo {
    position: absolute;
    top: -38px;
    left: 0;
    width: 150px;
    z-index: 2;
    line-height: 0;
    transition: all .4s ease;
}

.header .site-logo img {
    width: 100%;
    height: auto;
    filter: drop-shadow(0 10px 18px rgba(0, 0, 0, .45));
    transition: transform .35s ease;
}

.header .site-logo:hover img {
    transform: rotate(-3deg) scale(1.03);
}

/* sabit çubuk 80px: orta 40px, 70px'lik rozet tam içine */
#header_main.is-fixed.is-small .site-logo {
    top: -35px;
    width: 70px;
}

#header_main.is-fixed.is-small .site-logo img {
    filter: none;
}

@media (max-width: 991px) {
    .header__logo {
        flex-basis: 104px;
    }

    .header .site-logo {
        width: 104px;
    }
}

@media (max-width: 767px) {
    .header__logo {
        flex-basis: 92px;
    }

    .header .site-logo {
        width: 92px;
    }
}

/* --------------------------------------------------------------------------
   4. Menü çubuğu
   Tema .main-nav'ı "absolute, left:25%" konumluyor — o boşluk temanın
   logo görselinin genişliğine göre ayarlanmış. Metin logomuzla çakışıyor,
   bu yüzden menüyü akışa alıyoruz.
   -------------------------------------------------------------------------- */
@media (min-width: 992px) {
    .header.style-1 #site-header-inner .main-nav {
        position: static;
        left: auto;
        top: auto;
        -webkit-transform: none;
        transform: none;
        margin: 0 auto 0 52px;
    }
}

/* Yan panel butonu kaldırıldığı için sağdaki 84px boşluk gereksiz */
.header #site-header-inner .tf-button.header-call {
    margin-right: 0;
    margin-bottom: 0;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    height: 46px;
    line-height: 44px;
}

.header-call i {
    font-size: 12px;
}

/* tema, buton altındaki ince çizgiyi hover'da yukarı kaydırıyor;
   menü çubuğunda bu çizgi gereksiz duruyor */
.header-call::before {
    display: none;
}

/* --------------------------------------------------------------------------
   5. Hero — telefon kutusu
   Tema bu kutuya SVG bekliyor, biz FontAwesome ikonu kullandık.
   611px sabit genişlikte olduğu için tablet ve altında gizleniyor;
   aynı numara mobil sabit arama çubuğunda zaten duruyor.
   -------------------------------------------------------------------------- */
/* Tema hero görselinin üstüne düz %70 siyah seriyor. Stok görsellerde
   sorun değildi ama işletme için üretilen karelerde ocağın közü ve
   kıvılcımlar bu perdenin altında kayboluyordu.
   Düz perdeyi yatay bir degradeye çeviriyoruz: yazının durduğu sol
   %58'lik bant aynı koyulukta kalıyor (kontrast bozulmuyor), sağ
   taraftaki ateş ise görünür oluyor. */
.mySwiper .overlay::before {
    background: linear-gradient(90deg,
            rgba(16, 20, 22, .90) 0%,
            rgba(16, 20, 22, .88) 40%,
            rgba(16, 20, 22, .72) 58%,
            rgba(16, 20, 22, .44) 80%,
            rgba(16, 20, 22, .36) 100%);
}

/* Telefonda metin tam genişliğe yayılıp görselin orta şeridi
   kırpıldığı için yatay degrade işe yaramıyor; dikey perdeye dönüyor. */
@media (max-width: 991px) {
    .mySwiper .overlay::before {
        background: linear-gradient(180deg,
                rgba(16, 20, 22, .74) 0%,
                rgba(16, 20, 22, .84) 42%,
                rgba(16, 20, 22, .88) 72%,
                rgba(16, 20, 22, .80) 100%);
    }

    /* Hero kareleri masaüstü için kurgulandı: sol üçte bir başlığa
       yer açsın diye bilerek boş. Dar ekranda "cover" görselin tam
       ortasını kırpıyor, yani o boşluğu gösteriyordu. Kırpma odağını
       ocağın / sofranın üstüne kaydırıyoruz. */
    .mySwiper .overlay img {
        object-position: 72% center;
    }
}

/* Hareketli hero: fotoğrafın üstüne oturur; karartma (::before) üstte kalır */
.mySwiper .overlay .hero-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Dar ekranda videonun sol yarısı boş karanlık; kırpma odağı konuya:
   1. slaytta ızgara ve közler, 2. slaytta tabak ve arkadaki ocak */
@media (max-width: 991px) {
    .mySwiper .overlay .hero-video-1 {
        object-position: 68% center;
    }

    .mySwiper .overlay .hero-video-2 {
        object-position: 62% center;
    }
}

/* Telefonda hero 390 × 820: tam boy "cover" videonun yalnızca dörtte
   birini gösteriyor, o da yazının ve koyu perdenin arkasında kalıyordu.
   Video üstte 400px'lik bir bant oluyor (genişliğinin ~%55'i görünür),
   perde bu bantta açılıp aşağıda koyulaşıyor; yazılar bandın altına iniyor. */
@media (max-width: 767px) {
    .mySwiper .overlay .hero-video {
        height: 400px;
    }

    .mySwiper .overlay::before {
        background: linear-gradient(180deg,
                rgba(16, 20, 22, .45) 0,
                rgba(16, 20, 22, .18) 70px,
                rgba(16, 20, 22, .22) 250px,
                rgba(16, 20, 22, .82) 370px,
                rgba(16, 20, 22, .90) 420px,
                rgba(16, 20, 22, .92) 100%);
    }

    .mySwiper .box-slider .content-box {
        padding-top: 340px;
    }
}

.mySwiper .contact-info .icon i {
    font-size: 30px;
    color: var(--do-copper);
}

/* Tema kutuyu 611px'e sabitleyip soluna 92px padding vermiş; İngiliz
   numarası (11 hane + boşluklar) 40px puntoda oraya sığmayıp iki
   satıra düşüyordu. */
.mySwiper .contact-info {
    padding-left: 56px;
}

.mySwiper .contact-info .left h4 {
    font-size: 33px;
    white-space: nowrap;
}

.mySwiper .contact-info .left h4 a {
    color: #fff;
    transition: color .3s ease;
}

.mySwiper .contact-info .left h4 a:hover {
    color: var(--do-copper);
}

@media (max-width: 1199px) {
    .mySwiper .contact-info {
        display: none;
    }
}

/* --------------------------------------------------------------------------
   5b. Hakkımızda — alt boşluk
   Tema `.about` ile `.opening`i ikili kurgulamış: `.about`un alt boşluğu
   yalnızca 74px, kalan nefesi altındaki `.opening`in 188pxlik boşluğu
   veriyordu. Açılış saatleri bölümü kaldırılınca 633px'lik fotoğrafın altı
   menü şeridinin koyu bandına fazla yaklaşıyor.
   -------------------------------------------------------------------------- */
.about {
    padding-bottom: 130px;
}

@media (max-width: 991px) {
    .about {
        padding-bottom: 80px;
    }
}

/* --------------------------------------------------------------------------
   6. Menü bölümü — iki sütun
   Tema menü listesini 569px'lik tek sütuna sıkıştırıyor; 24 kalem
   masaüstünde çok uzun bir şerit oluşturuyordu.
   -------------------------------------------------------------------------- */
@media (min-width: 992px) {

    /* grid yerine çok sütunlu metin akışı: kalemler doğal yükseklikte
       kalır, satır hizalaması yüzünden aralarında boşluk oluşmaz */
    .s-menu .flat-tabs .content-tab .menu-list {
        max-width: 1120px;
        columns: 2;
        column-gap: 60px;
    }

    .s-menu .flat-tabs .content-tab .menu-list li {
        break-inside: avoid;
        -webkit-column-break-inside: avoid;
        page-break-inside: avoid;
    }
}

.s-menu .menu-list h5 {
    align-items: baseline;
    gap: 8px;
}

.s-menu .menu-list li .name .price {
    white-space: nowrap;
}

/* Ad ile fiyatı birleştiren çift çizgi:
   tema bu çizgileri h5::before/::after ile çiziyor ve z-index:-1 veriyor.
   Ancak hiçbir üst öğe yığınlama bağlamı (stacking context) kurmadığı için
   çizgiler bölümün zemininin ARKASINA düşüyor ve hiç görünmüyordu —
   temanın kendi demosunda da yalnızca AOS animasyonu sürerken
   (geçici transform bir bağlam kurduğu için) görünüyorlar.
   Negatif z-index yerine ad/fiyat kutucuklarını çizginin üstüne alıyoruz;
   zeminleri zaten bölüm rengiyle aynı olduğu için maskeleme korunuyor. */
.s-menu .menu-list h5::before,
.s-menu .menu-list h5::after {
    z-index: 0;
}

.s-menu .menu-list h5 .txt,
.s-menu .menu-list h5 .price {
    position: relative;
    z-index: 1;
}

/* örnek menü uyarısı + sipariş butonu */
.s-menu .menu-note {
    margin-top: 54px;
    padding-top: 34px;
    border-top: 1px solid rgba(208, 141, 79, .25);
    text-align: center;
}

.s-menu .menu-note p {
    color: rgba(255, 255, 255, .68);
    font-size: 14px;
    letter-spacing: .4px;
    margin-bottom: 26px;
}

/* --------------------------------------------------------------------------
   7. Hero sayfalaması 1440px'in altında geri gelsin
   Tema, 1440px ve altındaki BÜTÜN ekranlarda .swiper-button-* ve
   .swiper-pagination öğelerini "display:none !important" ile gizliyor.
   Dizüstü ekranların çoğu bu aralıkta olduğu için hero slaytının
   sayfalama noktaları hiç görünmüyordu — masaüstünde kaydırma jesti de
   olmadığı için ikinci slayta ulaşmanın yolu kalmıyordu.
   -------------------------------------------------------------------------- */
@media (min-width: 992px) and (max-width: 1440px) {
    .mySwiper .swiper-pagination {
        display: block !important;
    }
}

/* --------------------------------------------------------------------------
   7b. Galeri
   Temanın kendi `.gallery` bölümü 4 eşit, 558px yüksek sütundan ibaret ve
   hover'da metin kutusu bekliyor; fotoğraf yönlerine (yatay/dikey) uymuyor.
   Kendi ızgaramızı kuruyoruz: "wide" iki sütun, "tall" iki satır kaplar,
   `dense` kalan boşlukları doldurur.
   -------------------------------------------------------------------------- */
.s-gallery-do {
    padding: 127px 0 0;
}

.s-gallery-do .block-text {
    margin-bottom: 50px;
}

.g-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: 250px;
    grid-auto-flow: dense;
    gap: 12px;
}

.g-item {
    position: relative;
    display: block;
    overflow: hidden;
    background: var(--do-dark);
}

.g-item.wide {
    grid-column: span 2;
}

.g-item.tall {
    grid-row: span 2;
}

.g-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .6s ease, opacity .4s ease;
}

/* bakır çerçeve + büyüteç: tıklanabilir olduğunu belli etsin */
.g-item::after {
    content: "\f00e";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    position: absolute;
    inset: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--do-copper);
    color: var(--do-copper);
    font-size: 22px;
    opacity: 0;
    transform: scale(.94);
    transition: all .35s ease;
}

.g-item:hover img,
.g-item:focus-visible img {
    transform: scale(1.06);
    opacity: .55;
}

.g-item:hover::after,
.g-item:focus-visible::after {
    opacity: 1;
    transform: scale(1);
}

@media (max-width: 991px) {
    .s-gallery-do {
        padding-top: 80px;
    }

    .g-grid {
        grid-template-columns: repeat(2, 1fr);
        grid-auto-rows: 200px;
        gap: 8px;
    }
}

@media (max-width: 575px) {
    .g-grid {
        grid-auto-rows: 150px;
    }
}

/* --- lightbox (site.js kurar) --- */
.do-lb {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(16, 20, 22, .94);
}

.do-lb.open {
    display: flex;
}

.do-lb figure {
    margin: 0;
    max-width: calc(100vw - 140px);
    text-align: center;
}

.do-lb img {
    max-width: 100%;
    max-height: calc(100vh - 110px);
    box-shadow: 0 20px 60px rgba(0, 0, 0, .5);
}

.do-lb figcaption {
    margin-top: 14px;
    color: rgba(255, 255, 255, .8);
    font-size: 14px;
    letter-spacing: .4px;
}

.do-lb figcaption span {
    color: var(--do-copper);
    margin-right: 10px;
}

.do-lb button {
    position: absolute;
    width: 50px;
    height: 50px;
    border: 1px solid rgba(208, 141, 79, .5);
    background: rgba(16, 20, 22, .6);
    color: var(--do-copper);
    font-size: 18px;
    cursor: pointer;
    transition: all .25s ease;
}

.do-lb button:hover {
    background: var(--do-copper);
    color: var(--do-dark);
}

.do-lb .lb-close {
    top: 20px;
    right: 20px;
}

.do-lb .lb-prev,
.do-lb .lb-next {
    top: 50%;
    margin-top: -25px;
}

.do-lb .lb-prev {
    left: 20px;
}

.do-lb .lb-next {
    right: 20px;
}

@media (max-width: 767px) {
    .do-lb figure {
        max-width: calc(100vw - 20px);
    }

    /* telefonda oklar fotoğrafın üstüne biner; kaydırma jesti de var */
    .do-lb .lb-prev,
    .do-lb .lb-next {
        top: auto;
        bottom: 20px;
        margin-top: 0;
    }

    .do-lb .lb-close {
        top: 12px;
        right: 12px;
    }
}

/* --------------------------------------------------------------------------
   8. İletişim bölümü + harita
   -------------------------------------------------------------------------- */
/* Tema bu iki daireyi kare (429x429) stok görsellerle kurgulamış ve
   yüksekliği görsele bırakmış; farklı en-boy oranındaki fotoğraflarda
   daireler elipse dönüşüyor ve iki taraf birbirini tutmuyordu.
   Kutuyu kareye sabitleyip görseli kırptırıyoruz. */
.location .image {
    aspect-ratio: 1 / 1;
    height: auto;
}

.location .image img {
    height: 100%;
}

.location .content .phone a {
    color: var(--do-dark);
    transition: color .3s ease;
}

.location .content .phone a:hover {
    color: var(--do-copper-dark);
}

.location .content p span {
    color: var(--do-copper-dark);
    font-weight: 600;
}

.map-wrap {
    margin-top: 70px;
    border: 8px solid #fff;
    box-shadow: 0 18px 45px rgba(26, 32, 35, .14);
    line-height: 0;
}

.map-wrap iframe {
    display: block;
    filter: grayscale(35%);
    transition: filter .4s ease;
}

.map-wrap:hover iframe {
    filter: grayscale(0);
}

/* --------------------------------------------------------------------------
   9. Alt bilgi
   -------------------------------------------------------------------------- */
.footer .widget.logo .footer-logo {
    display: inline-block;
    width: 160px;
    margin-bottom: 26px;
}

.footer .widget.logo .footer-logo img {
    width: 100%;
    height: auto;
    margin-bottom: 0;
}

.footer .widget.locations ul li p a,
.footer .widget.locations ul li:last-child p:last-child a {
    color: var(--do-copper);
    transition: opacity .3s ease;
}

.footer .widget.locations ul li p a:hover {
    opacity: .75;
}

/* --------------------------------------------------------------------------
   10. Mobilde sabit "Hemen Ara" çubuğu
   -------------------------------------------------------------------------- */
.mobile-call-bar {
    display: none;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: var(--do-dark);
    color: var(--do-copper);
    padding: 15px 12px;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: .5px;
    text-align: center;
    box-shadow: 0 -6px 20px rgba(0, 0, 0, .18);
}

.mobile-call-bar:hover,
.mobile-call-bar:focus {
    color: #fff;
}

@media (max-width: 767px) {
    .mobile-call-bar {
        display: flex;
    }

    /* sabit çubuk içeriği kapatmasın */
    .footer {
        padding-bottom: 80px;
    }

    #scroll-top {
        bottom: 80px;
    }
}

/* --------------------------------------------------------------------------
   11. Küçük ekran düzeltmeleri
   -------------------------------------------------------------------------- */

/* tema 1200px altında menü çubuğundaki butonu tamamen gizliyor;
   tablette numara hâlâ görünsün diye ikonla bırakıyoruz */
@media (min-width: 992px) and (max-width: 1199px) {
    .header #site-header-inner .tf-button.header-call {
        display: inline-flex;
        padding: 0 18px;
    }

    .header-call span {
        display: none;
    }
}

@media (max-width: 1199px) {

    /* üst çubuk tek satıra sığmıyor; iki blok da ortalansın */
    .top-bar .lang-switch {
        float: none;
        margin-top: 10px;
    }

    .top-bar .col-xl-4 {
        text-align: center;
    }
}

@media (max-width: 991px) {

    /* Telefonda menü çubuğunda logo + arama butonu + hamburger aynı
       satıra sığmıyor, numara kırpılıyordu. Tema zaten bu butonu
       1200px altında gizliyor; aynı numara alttaki sabit "Hemen Ara"
       çubuğunda ve iletişim bölümünde duruyor. */
    .header #site-header-inner .tf-button.header-call {
        display: none;
    }

    .map-wrap {
        margin-top: 40px;
    }
}

@media (max-width: 767px) {
    /* metinlerdeki <br> masaüstü satır düzeni için; telefonda
       satırı ortasından kırıp tuhaf boşluk bırakıyor */
    .mySwiper .content-box .sub-title br,
    .s-menu .block-text .text br,
    .location .content .text br {
        display: none;
    }

    .map-wrap iframe {
        height: 320px;
    }
}