/* =====================================================================
   PoyrazTechnology — responsive.css
   Mobil öncelikli (mobile-first). style.css içindeki taban (mobil)
   kuralların üzerine, yalnızca min-width sorgularıyla genişleme ekler.
   Kırılım noktaları:
     480px  — büyük telefon
     600px  — küçük tablet / yatay telefon
     768px  — tablet
     1024px — masaüstü (ana menü görünür, hamburger gizlenir)
     1200px — geniş masaüstü
   RTL düzeltmeleri rtl.css içindedir; burada mantıksal özellikler
   (margin-inline, inset-inline vb.) kullanıldığından çoğu kural yön
   bağımsızdır.
   ===================================================================== */

/* ------------------------------------------------------------------ */
/* ≥ 480px — büyük telefon                                            */
/* ------------------------------------------------------------------ */
@media (min-width: 480px) {
    .office-grid { grid-template-columns: repeat(2, 1fr); }

    .hero__actions .btn,
    .cta__actions .btn { inline-size: auto; }
}

/* ------------------------------------------------------------------ */
/* ≥ 600px — küçük tablet / yatay telefon                            */
/* ------------------------------------------------------------------ */
@media (min-width: 600px) {
    :root { --container-pad: 28px; }

    .product-grid { grid-template-columns: repeat(2, 1fr); }

    /* Footer: marka tüm satırı kaplar, bağlantı sütunları 2×2 dizilir */
    .site-footer__grid { grid-template-columns: repeat(2, 1fr); }
    .site-footer__brand { grid-column: 1 / -1; }

    .site-footer__bottom-inner {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
}

/* ------------------------------------------------------------------ */
/* ≥ 768px — tablet                                                  */
/* ------------------------------------------------------------------ */
@media (min-width: 768px) {
    /* İstatistikler tek satırda dört sütun */
    .stats__grid { grid-template-columns: repeat(4, 1fr); }
    .stats__grid { margin-block-start: -52px; }

    /* Bölüm başlığı: başlık solda, açıklama sağda */
    .section__head {
        flex-direction: row;
        align-items: flex-end;
        justify-content: space-between;
        gap: 32px;
        max-inline-size: none;
    }
    .section__head > div { max-inline-size: 46ch; }
    .section__text { max-inline-size: 42ch; }

    /* Ürün kartları tablette üç sütun */
    .product-grid { grid-template-columns: repeat(3, 1fr); }

    /* Ofis kartları tablette üç sütun */
    .office-grid { grid-template-columns: repeat(3, 1fr); }

    /* Fuarlar bloğu: ikon solda, içerik sağda */
    .fairs {
        flex-direction: row;
        align-items: center;
        gap: 28px;
    }
    .fairs__icon { align-self: flex-start; }

    /* İletişim çağrısı: metin solda, butonlar sağda */
    .cta__inner {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 32px;
    }
    .cta__actions { flex: none; }
}

/* ------------------------------------------------------------------ */
/* ≥ 1024px — masaüstü                                               */
/* ------------------------------------------------------------------ */
@media (min-width: 1024px) {
    /* Masaüstü ana menü görünür, mobil tetik gizlenir */
    .main-nav { display: block; }
    .site-header__quote { display: inline-flex; }
    .nav-toggle { display: none; }

    /* Hero iki sütun: metin + görsel */
    .hero { padding-block: clamp(72px, 8vw, 120px); }
    .hero__inner {
        display: grid;
        grid-template-columns: 1.05fr 0.95fr;
        align-items: center;
        gap: clamp(36px, 5vw, 72px);
    }
    .hero__content { max-inline-size: none; }
    .hero__visual { display: block; }

    /* Ürün kartları üç sütun (taban korunur, açıkça belirtilir) */
    .product-grid { grid-template-columns: repeat(3, 1fr); }

    /* Footer beş sütun: marka geniş, dört bağlantı sütunu */
    .site-footer__grid {
        grid-template-columns: 1.6fr 1fr 1fr 1fr 1.2fr;
        gap: 40px;
    }
    .site-footer__brand { grid-column: auto; }
}

/* ------------------------------------------------------------------ */
/* ≥ 1200px — geniş masaüstü                                         */
/* ------------------------------------------------------------------ */
@media (min-width: 1200px) {
    /* Beş ofis tek satırda */
    .office-grid { grid-template-columns: repeat(5, 1fr); }
}

/* =====================================================================
   PART 02 — Ana sayfa bileşenleri için kırılım noktaları (additive)
   ===================================================================== */

@media (min-width: 600px) {
    .about__points { grid-template-columns: repeat(2, 1fr); }
    .service-grid  { grid-template-columns: repeat(2, 1fr); }
    .fair-grid     { grid-template-columns: repeat(2, 1fr); }
    .sector-grid   { grid-template-columns: repeat(3, 1fr); }
    .cta__contact  { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 768px) {
    /* Hero slider okları görünür */
    .hero-slider__arrow { display: grid; }

    /* Kurumsal tanıtım iki sütun (görsel + içerik) */
    .about { grid-template-columns: 1fr 1fr; }

    /* Hizmet & fuar kartları üç sütun */
    .service-grid { grid-template-columns: repeat(3, 1fr); }
    .fair-grid    { grid-template-columns: repeat(3, 1fr); }

    /* Neden biz? — bölünmüş düzen + iki sütun liste */
    .whyus { grid-template-columns: 0.95fr 1.05fr; }
    .whyus__list { grid-template-columns: repeat(2, 1fr); column-gap: 28px; }
    .whyus__item { padding-block: 13px; }

    /* Promo bantları: içerik solda, butonlar sağda */
    .promo__inner { flex-direction: row; align-items: center; justify-content: space-between; gap: 36px; }
    .promo__content { flex: 1 1 auto; }
    .promo__actions { flex: none; flex-direction: column; align-items: stretch; min-inline-size: 260px; }

    /* Sektörler dört sütun */
    .sector-grid { grid-template-columns: repeat(4, 1fr); }

    /* İletişim çağrısı: metin solda, iletişim listesi sağda */
    .cta__inner--contact { flex-direction: row; align-items: flex-start; justify-content: space-between; }
    .cta__inner--contact .cta__text-wrap { flex: 1 1 auto; max-inline-size: 52ch; }
    .cta__inner--contact .cta__contact { flex: none; min-inline-size: 300px; }
}

@media (min-width: 1024px) {
    .about { grid-template-columns: 1.05fr 0.95fr; gap: 64px; }
    .whyus { gap: 64px; }
}

/* =====================================================================
   PART 03 — İÇ SAYFALAR: çok sütunlu grid kuralları (mobil öncelikli üzerine)
   Kontrol genişlikleri: 320 / 375 / 430 (temel tek sütun) ·
   768 / 1024 / 1366 / 1920 (artan sütunlar)
   ===================================================================== */

@media (min-width: 600px) {
    .feature-grid,
    .value-grid,
    .office-grid,
    .phub-grid,
    .shub-grid,
    .pd-feature-grid,
    .product-grid--wide { grid-template-columns: repeat(2, 1fr); }
    .notice-band { flex-direction: row; align-items: center; justify-content: space-between; }
    .notice-band .btn { align-self: center; }
}

@media (min-width: 768px) {
    .stat-grid { grid-template-columns: repeat(4, 1fr); }
    .global-customers__grid { grid-template-columns: 1fr 1fr; }
    .pd-steps { grid-template-columns: repeat(2, 1fr); }
    /* Hero görseli yalnızca geniş ekranda yan sütunda görünür */
    .page-hero--has-media .page-hero__inner { grid-template-columns: 1.25fr .9fr; align-items: center; }
    .page-hero--has-media .page-hero__media { display: block; }
}

@media (min-width: 1024px) {
    .phub-grid,
    .shub-grid,
    .value-grid,
    .product-grid--wide { grid-template-columns: repeat(3, 1fr); }
    .feature-grid { grid-template-columns: repeat(3, 1fr); }
    .about-intro__grid { grid-template-columns: 1.7fr 1fr; align-items: start; }
    .pd-columns { grid-template-columns: 1.6fr 1fr; align-items: start; }
    .office-overview__grid { grid-template-columns: 1.7fr 1fr; align-items: start; }
}

/* =====================================================================
   PART 06A — Uzun kelime / Almanca bileşik kelime taşma kontrolü
   - overflow-wrap: her dilde güvenli, yalnızca taşacak kelimeyi böler.
   - hyphens: auto: yalnızca Almanca sayfalarda (html[lang="de"]) etkin;
     tarayıcının tireleme sözlüğüyle doğru noktadan böler. TR/EN etkilenmez.
   ===================================================================== */
.hero__title,
.hero-slide__title,
.page-hero__title,
.main-nav__link,
.mobile-menu__link,
.breadcrumb__item,
.breadcrumb__link,
.breadcrumb__current,
.btn,
.contact-card__title,
.info-card__title,
.mv-card__title,
.pd-card__title,
.phub-card__title,
.product-card__title,
.service-card__title,
.shub-card__title,
.value-card__title,
.site-footer__title,
.pt-form__label,
label {
    overflow-wrap: break-word;
    word-break: normal;
}

/* Almancaya özgü tireleme — uzun bileşik kelimeler için */
html[lang="de"] .hero__title,
html[lang="de"] .hero__lead,
html[lang="de"] .hero-slide__title,
html[lang="de"] .hero-slide__desc,
html[lang="de"] .page-hero__title,
html[lang="de"] .contact-card__title,
html[lang="de"] .info-card__title,
html[lang="de"] .mv-card__title,
html[lang="de"] .pd-card__title,
html[lang="de"] .phub-card__title,
html[lang="de"] .product-card__title,
html[lang="de"] .service-card__title,
html[lang="de"] .shub-card__title,
html[lang="de"] .value-card__title,
html[lang="de"] .pt-form__label {
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    overflow-wrap: break-word;
}

/* Çok dar ekranlarda (≤375px) Almanca menü ve buton metinleri için ek güvenlik */
@media (max-width: 375px) {
    html[lang="de"] .main-nav__link,
    html[lang="de"] .mobile-menu__link,
    html[lang="de"] .btn {
        -webkit-hyphens: auto;
        hyphens: auto;
    }
}
