/* ============================================================
   Elementor Köprü Stili (v86)

   Amaç: Elementor widget'larının tema (Antler + custom.css) marka
   görünümüne oturması. Elementor kendi nötr varsayılanlarıyla gelir;
   bu dosya tipografi, başlık rengi ve buton stilini Siaflex markasına
   (Open Sans, #212529 gövde, #1eb390 yeşil, #fdd700 sarı CTA) çeker.

   Yalnızca .elementor kapsamında çalışır — klasik PHP sayfalarındaki
   hiçbir görünümü etkilemez.
   ============================================================ */

.elementor {
    font-family: 'Open Sans', sans-serif;
    color: #212529;
}

.elementor .elementor-heading-title {
    font-family: 'Open Sans', sans-serif;
    color: #212529;
    font-weight: 700;
    line-height: 1.25;
}

.elementor .elementor-widget-text-editor {
    font-size: 16px;
    line-height: 1.75;
    color: #4c4a47;
}

/* CTA butonları — tema .btn-default-yellow-fill karşılığı.
   v92 DÜZELTME: temanın "yellow-fill" sınıfı aslında YEŞİL (#00AB7E,
   theme.min.css) — isim yanıltıcı. Köprü CSS'i yanlışlıkla gerçek sarı
   (#fdd700) basıyordu; orijinal butonlar yeşil. Renk düzeltildi. */
.elementor .elementor-button {
    background-color: #00AB7E;
    color: #ffffff;
    border-radius: 6px;
    font-weight: 600;
    padding: 12px 26px;
    transition: background-color .25s ease, color .25s ease;
}
.elementor .elementor-button:hover,
.elementor .elementor-button:focus {
    background-color: #4c4a4a;
    color: #ffffff;
}

/* Accordion — homepage-faq görünümüne yakınlaştırma */
.elementor .elementor-accordion .elementor-tab-title {
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    color: #212529;
    background-color: #ffffff;
    border-radius: 8px;
}
.elementor .elementor-accordion .elementor-tab-title.elementor-active {
    color: #1eb390;
}
.elementor .elementor-accordion .elementor-tab-content {
    font-size: 15px;
    line-height: 1.7;
    color: #4c4a47;
}

/* Divider — servis kartlarındaki ince ayraç hissi */
.elementor .elementor-widget-divider .elementor-divider-separator {
    border-top-color: #e7eaed;
}

/* Shortcode ile gömülen tema bölümleri Elementor kolon iç
   boşluklarından etkilenmesin (bölümler kendi .container'ını basar). */
.elementor .elementor-widget-shortcode .main-container,
.elementor .elementor-widget-shortcode section {
    margin-left: 0;
    margin-right: 0;
}

/* ============================================================
   v104 — NATIVE WIDGET SADAKAT KATMANI

   Anasayfanın Hizmetlerimiz / Neden Siaflex / SSS / Harita / İletişim
   bölümleri artık shortcode değil NATIVE Elementor widget'ı (müşteri
   Elementor'dan düzenleyebilsin diye). Aşağıdaki kurallar, native
   widget'ları klasik PHP şablonlarının ÖLÇÜLMÜŞ değerlerine oturtur.

   Ölçüm kaynağı (v103 baseline, gerçek tarayıcı):
     .section-heading        → 52px / 700 / #212122
     hizmet kartı            → bg #ebeff5, radius 6px, padding 30px, gölge yok
     .exapath (koyu bölüm)   → #474d51
     SSS bölümü zemini       → #ffffff  (uydurma #f8f9fa DEĞİL)
     buton                   → #00AB7E / #fff
   ============================================================ */

/* --- Bölüm başlığı ve açıklaması --- */
.elementor .siaflex-el-section-title .elementor-heading-title {
    font-size: 52px;
    font-weight: 700;
    color: #212122;
    line-height: 1.2;
}
.elementor .siaflex-el-section-sub {
    font-size: 16px;
    line-height: 1.75;
    color: #4c4a47;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

/* Koyu zeminli bölümlerde (Neden Siaflex, Harita) başlık/metin beyaz */
.elementor .siaflex-el-why .siaflex-el-section-title .elementor-heading-title,
.elementor .siaflex-el-map .siaflex-el-section-title .elementor-heading-title,
.elementor .siaflex-el-why .siaflex-el-section-sub,
.elementor .siaflex-el-why .siaflex-el-section-sub p,
.elementor .siaflex-el-map .siaflex-el-section-sub,
.elementor .siaflex-el-map .siaflex-el-section-sub p {
    color: #ffffff;
}

/* --- Kart satırı: kartlar EŞİT YÜKSEKLİK --- */
.elementor .siaflex-el-card-row > .elementor-container {
    align-items: stretch;
}
.elementor .siaflex-el-card-row .elementor-column .elementor-widget-wrap {
    align-content: flex-start;
}

/* --- Hizmet kartı (ölçülen: #ebeff5 / 6px / 30px / gölge yok) ---
   NOT: padding'de !important ŞART — Elementor'un kendi
   `.elementor-element-populated{padding:10px}` kuralı seçici özgüllüğünde
   öne geçip kartı sıkışık bırakıyordu (ölçüldü: 10px). */
.elementor .siaflex-el-service-card > .elementor-element-populated {
    background-color: #ebeff5;
    border-radius: 6px;
    padding: 30px !important;
    margin: 50px 12px 0;
    box-shadow: none;
    display: flex;
    flex-direction: column;
    /* Orijinal services-grid.php kartında inline `min-height:450px` var —
       kart yüksekliği tasarımın parçası, buraya taşındı. */
    min-height: 450px;
}

/* --- Neden Siaflex kartı: koyu zemin üzerinde BEYAZ kart --- */
.elementor .siaflex-el-why-card > .elementor-element-populated {
    background-color: #ffffff;
    border-radius: 6px;
    padding: 30px !important;
    margin: 30px 12px 0;
    box-shadow: none;
    display: flex;
    flex-direction: column;
}

/* --- Kart içi tipografi (orijinal: başlık 20px bold, gövde .subtitle) --- */
.elementor .siaflex-el-card-title .elementor-heading-title {
    font-size: 20px;
    font-weight: 700;
    color: #212122;
    line-height: 1.35;
}
.elementor .siaflex-el-card-desc {
    font-size: 15px;
    line-height: 1.7;
    color: #4c4a47;
    /* Açıklama kalan boşluğu yer → buton HER kartta ALTA hizalanır */
    flex: 1 1 auto;
}
.elementor .siaflex-el-card-icon img {
    width: 50px;
    height: 50px;
    object-fit: contain;
}
.elementor .siaflex-el-why-card .siaflex-el-card-icon img {
    width: 60px;
    height: 60px;
}

/* Kart içindeki widget'lar dikey akışta sıkışmasın */
.elementor .siaflex-el-service-card .elementor-widget,
.elementor .siaflex-el-why-card .elementor-widget {
    margin-bottom: 12px;
}
.elementor .siaflex-el-service-card .elementor-widget-button {
    margin-top: auto;
    margin-bottom: 0;
}

/* --- SSS bölümü: beyaz zemin, içerik ortada ve dar (orijinal col-lg-10) --- */
.elementor .siaflex-el-faq {
    background-color: #ffffff;
}
.elementor .siaflex-el-faq-accordion {
    max-width: 980px;
    margin: 0 auto;
}
.elementor .siaflex-el-faq-accordion .elementor-accordion-item {
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    margin-bottom: 12px;
    overflow: hidden;
}
.elementor .siaflex-el-faq-accordion .elementor-tab-title {
    padding: 18px 22px;
    background-color: #f7f9fb;
    font-size: 15px;
}
/* Orijinaldeki "01. 02. …" numaralandırması (.siaflex-faq-q-num) CSS sayacıyla
   yeniden üretiliyor — numara METNE gömülmüyor ki müşteri Elementor'da soruyu
   düzenlerken numarayla uğraşmasın, sıra değişince numara kendiliğinden düzelsin. */
.elementor .siaflex-el-faq-accordion .elementor-accordion {
    counter-reset: siaflex-faq;
}
.elementor .siaflex-el-faq-accordion .elementor-tab-title .elementor-accordion-title::before {
    counter-increment: siaflex-faq;
    content: counter(siaflex-faq, decimal-leading-zero) ". ";
    color: #1eb390;
    font-weight: 700;
    margin-right: 6px;
}
.elementor .siaflex-el-faq-accordion .elementor-tab-title.elementor-active {
    background-color: #eaf7f3;
    color: #1eb390;
}
.elementor .siaflex-el-faq-accordion .elementor-tab-content {
    background-color: #ffffff;
    padding: 18px 22px 22px;
}

/* --- Harita bölümü: çekirdek shortcode'un konumlandırma bağlamı --- */
.elementor .siaflex-el-map .siaflex-map-core .position-relative {
    position: relative;
}
.elementor .siaflex-el-map .siaflex-map-core img {
    width: 100%;
    height: auto;
}

/* --- Mobil: kolonlar alt alta, kart kenar boşlukları düzelsin --- */
@media (max-width: 767px) {
    .elementor .siaflex-el-service-card > .elementor-element-populated,
    .elementor .siaflex-el-why-card > .elementor-element-populated {
        margin-left: 0;
        margin-right: 0;
    }
    .elementor .siaflex-el-section-title .elementor-heading-title {
        font-size: 32px;
    }
}
@media (min-width: 768px) and (max-width: 1024px) {
    .elementor .siaflex-el-section-title .elementor-heading-title {
        font-size: 40px;
    }
}