/* Ana kapsayıcı: Taşan yazıları gizler */
.meyteks-marquee-container {
width: 100%;
overflow: hidden;
background: url(".. /images/bg.webp") center;
background-size: cover !important;
padding: 50px 0; /* Üstten ve alttan boşluk */
border-top: 1px solid #f0f0f0; /* İsteğe bağlı ince çizgiler */
border-bottom: 1px solid #f0f0f0;
display: flex;
}/* Kayan içerik kutusu */
.meyteks-marquee-content {
display: flex;
white-space: nowrap;
/* Animasyon: 30 saniyede bir tur, sürekli (infinite) ve düz bir hızda (linear) döner */
animation: scrollText 30s linear infinite;
}/* Yazı tipleri ve tasarımı (Görseldeki lüks görünüm için) */
.meyteks-marquee-content span,
.meyteks-marquee-content h1 {
font-family: var(--font2);
font-size: 26px; /* Yazı boyutu */
color: #1a1a1a; /* Koyu gri/siyah yazı rengi */
text-transform: uppercase; /* Hepsini büyük harf yapar */
letter-spacing: 4px; /* Harfler arası boşluk (Zarif görünüm için önemlidir) */
padding-right: 15px;
font-weight: 300;
margin: 0px;
}/* MOUSE ÜZERİNE GELİNCE DURDURMA EFEKTİ */
.meyteks-marquee-container:hover .meyteks-marquee-content {
animation-play-state: paused;
cursor: pointer; /* Fare ikonunu el işaretine çevirir */
}/* Kaydırma Animasyonu (Keyframes) */
@keyframes scrollText {
0% {
transform: translateX(0); /* Başlangıç noktası */
}
100% {
transform: translateX(
-50%
); /* Metnin tam yarısı kadar sola kayar, kopyası olduğu için başa sarmış gibi hissettirir */
}
}/**//* Ana Taşıyıcı: 3 Sütunlu Grid Yapısı */
.meyteks-services-wrapper {
display: grid;
grid-template-columns: repeat(3, 1fr); /* 3 eşit sütun */
gap: 2px; /* Görseldeki o ince beyaz çizgi ayrımı için */
background-color: #ffffff;
width: 100%;
max-width: 100%;
height: 650px; /* Görsellerin yüksekliği, lüks görünüm için uzun tutuldu */
overflow: hidden;
}/* Her Bir Kartın Yapısı */
.meyteks-service-card {
position: relative;
display: flex;
align-items: flex-end; /* İçeriği en alta yaslar */
text-decoration: none;
overflow: hidden; /* Resim büyüdüğünde dışarı taşmasını engeller */
cursor: pointer;
}/* Arka Plan Resimleri */
.service-bg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-size: cover;
background-position: center;
z-index: 1;
/* Yumuşak bir yakınlaştırma animasyonu */
transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}/* Metinlerin Bulunduğu Kısım (Alttaki Karartma Efekti) */
.service-content {
position: relative;
z-index: 2; /* Resmin üstünde kalmasını sağlar */
width: 100%;
padding: 50px 40px 40px 40px; /* İç boşluklar */
/* Yazının okunmasını sağlayan alttan yukarı doğru siyahlık */
background: linear-gradient(
to top,
rgba(0, 0, 0, 0.85) 0%,
rgba(0, 0, 0, 0.3) 50%,
rgba(0, 0, 0, 0) 100%
);
transition: all 0.5s ease;
text-align: center;
}/* Başlık Tasarımı (Görseldeki "MADE IN ITALY" gibi) */
.service-title {
color: #ffffff;
font-size: 32px;
font-weight: 500;
margin: 0 0 15px 0;
text-transform: uppercase;
border: solid 1px #ffffff38;
padding: 12px 35px;
display: inline-block;
}/* Açıklama Metni Tasarımı */
.service-desc {
color: #f0f0f0;
font-size: 15px;
line-height: 1.5;
font-weight: 400;
margin: 0;
opacity: 0; /* Başlangıçta görünmez */
max-height: 0; /* Yükseklik kaplamasın */
transform: translateY(20px); /* 20px aşağıda beklesin */
transition: all 0.5s ease; /* Pürüzsüz animasyon */
}.meyteks-service-card:hover .service-bg {
transform: scale(1.08);
}.meyteks-service-card:hover .service-content {
background: linear-gradient(
to top,
rgba(0, 0, 0, 0.95) 0%,
rgba(0, 0, 0, 0.6) 60%,
rgba(0, 0, 0, 0) 100%
);
}.meyteks-service-card:hover .service-desc {
opacity: 1; /* Görünür olsun */
max-height: 200px; /* Yüksekliği açılsın */
transform: translateY(0); /* Normal pozisyonuna gelsin */
margin-top: 15px; /* Başlık ile arasına boşluk girsin */
}/* ========================================= */
/* MOBİL UYUM (TELEFONLAR İÇİN) */
/* ========================================= */
@media (max-width: 992px) {
.meyteks-services-wrapper {
grid-template-columns: 1fr; /* Mobilde tek sütun alt alta dizilir */
height: auto;
}
.meyteks-service-card {
height: 450px; /* Mobilde her bir resmin yüksekliği */
}
.service-content {
padding: 30px 20px;
}
.service-title {
font-size: 24px;
}
}/**//* Temel Ayarlar */
.hakkimizda {
padding: 80px 0px;
background: url("../images/bg.webp") center;
background-size: cover !important;
color: #333;
}.hakkimizda .container {
margin: 0 auto;
}/* Üst Kısım (Yazılar) */
.hakkimizda-intro {
display: flex;
justify-content: space-between;
gap: 50px;
margin-bottom: 60px;
align-items: center;
}.hakkimizda .intro-left {
flex: 1;
}.hakkimizda .intro-left .title {
color: var(--renk2);
font-size: 20px;
font-weight: 700;
margin-top: 0;
margin-bottom: 20px;
}.hakkimizda .intro-left p {
color: #4a4a4a;
line-height: 1.5;
font-size: 16px;
margin: 0;
font-weight: 500;
}.hakkimizda .intro-right {
flex: 1.2;
}.hakkimizda .intro-right h2 {
color: var(--renk2);
font-size: 32px;
line-height: 1.3;
font-weight: 700;
margin: 0;
max-width: 100%;
}/* Alt Kısım (Sayaçlar) */
.hakkimizda-stats {
display: grid;
grid-template-columns: repeat(4, 1fr);
border: 1px solid #e0e0e0;
border-radius: 0px; /* Köşeleri yuvarlatma */
overflow: hidden; /* Kenar taşmalarını engellemek için */
}.hakkimizda .stat-box {
padding: 50px 40px;
border-right: 1px solid #e0e0e0;
display: flex;
flex-direction: column;
justify-content: center;
}/* Son kutunun sağ kenarlığını kaldır */
.hakkimizda .stat-box:last-child {
border-right: none;
}.hakkimizda .stat-number {
font-size: 52px;
color: var(--renk2);
font-weight: 700;
line-height: 1;
margin-bottom: 15px;
}/* JavaScript ile eklenecek yeşil nokta stili */
.hakkimizda .stat-number .green-dot {
color: var(--renk2);
}.hakkimizda .stat-title {
color: var(--renk2);
font-size: 22px;
font-weight: 500;
margin: 0 0 15px 0;
}.hakkimizda .stat-desc {
color: #666;
font-size: 14px;
line-height: 1.5;
margin: 0;
}/* Mobil Uyumluluk (Responsive) */
@media (max-width: 900px) {
.hakkimizda-intro {
flex-direction: column;
gap: 30px;
}.hakkimizda .intro-right h2 {
font-size: 24px;
}.hakkimizda-stats {
grid-template-columns: 1fr;
}.hakkimizda .stat-box {
border-right: none;
border-bottom: 1px solid #e0e0e0;
}.hakkimizda .stat-box:last-child {
border-bottom: none;
}
}/* Ana Kapsayıcı */
.sertifikalar {
padding: 5px 0 80px;
background-color: #ffffff;
}.sertifika-slider {
width: 100%;
overflow: hidden; /* Taşan kısımları gizler */
position: relative;
}/* Kayan Şerit */
.sertifika-track {
display: flex;
width: max-content; /* Genişliği içindeki resimlere göre otomatik ayarlar */
/* 25s kayma hızıdır. Hızlandırmak için süreyi düşürebilirsiniz */
animation: süzülme 25s linear infinite;
}/* Üzerine gelince animasyonu durdurma */
.sertifika-slider:hover .sertifika-track {
animation-play-state: paused;
cursor: pointer;
}/* Her Bir Sertifika Kutusu */
.sertifika-item {
padding: 0 15px; /* 25px boşluk resmi çok ezer, 15px daha ferah bir görünüm sağlar */
width: 200px; /* Kutu genişliği */
height: 100px; /* Yüksekliği biraz artırdık ki logolar/sertifikalar rahat nefes alsın */
display: flex;
justify-content: center;
align-items: center;
flex-shrink: 0;
}.sertifika-item img {
width: 100%; /* Kutu içindeki ayrılan alanın tamamını kullanmasını sağlar */
height: 100%; /* Kutu içindeki ayrılan alanın tamamını kullanmasını sağlar */
/* EN ÖNEMLİ KOD BURASI */
object-fit: contain;
/* contain: Resmi uzatıp sünmeden (bozmadan) ve kenarlarından kırpmadan
kendisine verilen alanın (250x120) içine sığacak şekilde otomatik ölçekler. */display: block;
border-radius: 0px;/* Opsiyonel: Eğer sertifika/logoların arka planı beyazsa ve sitenizin
arka planı farklı bir renkse, beyazlıkları yok edip şeffafmış gibi gösterir */
/* mix-blend-mode: multiply; */
}/* Süzülme Animasyonu (JS içeriği ikiye katladığı için %50'ye geldiğinde başa sarar ve atlama belli olmaz) */
@keyframes süzülme {
0% {
transform: translateX(0);
}
100% {
transform: translateX(-50%);
}
}/* ========================================= */
/* MOBİL UYUM: Ekrana tam 2 resim sığdırma */
/* ========================================= */
@media (max-width: 768px) {
.sertifika-item {
/* Ekranın genişliğinin (vw) yarısı kadar alan kaplar, 2'li görünüm sağlar */
width: calc(50vw - 20px);
padding: 0 10px; /* Mobilde aradaki boşluğu hafif daraltıyoruz */
}
}.home-uretim {
display: block;
width: 100%;
height: auto;
padding-bottom: 80px;
}.section-title-bg {
width: 100%;
height: auto;
margin-bottom: 40px;
}.home-uretim .section-title {
color: var(--renk2);
font-size: 36px;
font-weight: 700;
}.btn-archive {
background-color: var(--renk2);
/* Resimdeki sağ üstteki mavi buton */
color: white;
border: none;
border-radius: 0px;
/* Buton köşe yuvarlaklığı */
padding: 0.5rem 1.5rem;
font-weight: 500;
text-decoration: none;
}.btn-archive:hover {
background-color: var(--renk2);
color: white;
opacity: 70%;
}.home-uretim .custom-card {
background-color: #f6f8f9;
/* Resimdeki kartların açık gri arkaplanı */
border: none;
border-radius: 0px;
/* Kart köşe yuvarlaklığı */
overflow: hidden;
}.home-uretim .custom-card-img {
height: 200px;
object-fit: cover;
width: 100%;
}.home-uretim .custom-card-body {
padding: 2rem 1.5rem;
/* Resimdeki geniş iç boşluklar */
}.home-uretim .card-heading {
color: var(--renk2);
/* Kart içindeki lacivert başlıklar */
font-size: 21px;
font-weight: 700;
line-height: 1.3;
margin-bottom: 1rem;
margin-top: 0px;
}.home-uretim .card-meta {
color: #6c757d;
/* Tarih/Kapasite kısmı (Gri) */
font-size: 16px;
font-weight: 700;
margin-bottom: 1.25rem;
}.home-uretim .card-desc {
color: #555;
font-size: 15px;
line-height: 1.5;
margin-bottom: 2rem;
}.home-uretim .read-more-link {
color: var(--renk2);
/* Resimdeki parlak mavi link rengi */
font-weight: 600;
font-size: 0.95rem;
text-decoration: none;
display: inline-flex;
align-items: center;
transition: opacity 0.2s;
}.home-uretim .read-more-link:hover {
color: var(--renk2);
text-decoration: underline;
}.home-uretim .read-more-link i {
font-size: 0.8rem;
margin-left: 6px;
font-weight: bold;
}.uretim-baslikk {
position: absolute;
bottom: -100px;
left: 50px;
color: #fff;
border: solid 1px #ffffff36;
padding: 15px 25px;
font-weight: 700;
background: #ffffff0f;
font-size: 20px;
}/**/.uretim-slider {
position: relative;
width: 100%;
height: 90vh;
background: #000;
overflow: hidden;
}.uretim-slider-item {
position: absolute;
inset: 0;
opacity: 0;
visibility: hidden;
transition: all 1s cubic-bezier(0.4, 0, 0.2, 1);
z-index: 1;
display: flex;
align-items: center;
}.uretim-slider-item.active {
opacity: 1;
visibility: visible;
z-index: 2;
clip-path: inset(0 0 0 0);
/* Perde efekti geçişi */
}/* Arka Plan Resimleri */
.uretim-slider-bg {
position: absolute;
inset: 0;
background-size: cover;
background-position: center;
transform: scale(1.1);
transition: transform 10s linear;
}.uretim-slider-item.active .uretim-slider-bg {
transform: scale(1);
}.uretim-slider-overlay {
position: absolute;
inset: 0;
background: linear-gradient(
90deg,
rgba(0, 0, 0, 0.9) 0%,
rgba(0, 0, 0, 0.5) 50%,
rgba(0, 0, 0, 0.2) 100%
);
opacity: 80%;
}/* İçerik Yapısı */
.uretim-slider-container {
position: relative;
z-index: 10;
width: 100%;
max-width: 1200px;
margin: 0 auto;
padding: 0 40px;
}.uretim-slider-content {
max-width: 500px;
color: #fff;
}.uretim-slider-label {
display: inline-block;
font-size: 13px;
letter-spacing: 3px;
text-transform: uppercase;
color: var(--renk2);
/* Kurumsal Altın Tonu */
margin-bottom: 15px;
opacity: 0;
transform: translateY(20px);
transition: 0.8s ease forwards 0.3s;
}.uretim-slider-title {
font-size: 40px;
font-weight: 800;
line-height: 1.1;
margin-bottom: 25px;
text-transform: uppercase;
opacity: 0;
transform: translateY(30px);
transition: 0.8s ease forwards 0.5s;
}.uretim-slider-text {
font-size: 16px;
line-height: 1.6;
color: rgba(255, 255, 255, 0.8);
margin-bottom: 40px;
opacity: 0;
transform: translateY(30px);
font-weight: 500;
transition: 0.8s ease forwards 0.7s;
}/* İstatistikler */
.uretim-slider-stats {
display: flex;
gap: 40px;
opacity: 0;
transform: translateY(30px);
transition: 0.8s ease forwards 0.9s;
}.active .uretim-slider-label,
.active .uretim-slider-title,
.active .uretim-slider-text,
.active .uretim-slider-stats {
opacity: 1;
transform: translateY(0);
}.uretim-slider-stat {
border-left: 2px solid var(--renk2);
padding-left: 15px;
}.uretim-slider-stat strong {
display: block;
font-size: 28px;
font-weight: 700;
line-height: 1;
}.uretim-slider-stat span {
font-size: 12px;
text-transform: uppercase;
letter-spacing: 1px;
color: #aaa;
}/* Navigasyon Okları */
.uretim-slider-nav {
position: absolute;
bottom: 50px;
right: 40px;
z-index: 20;
display: flex;
align-items: center;
gap: 10px;
}.uretim-slider-arrow {
background: none;
border: 1px solid rgba(255, 255, 255, 0.3);
border-radius: 50%;
width: 55px;
height: 55px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: 0.3s;
}.uretim-slider-arrow:hover {
background: var(--renk2);
border-color: var(--renk2);
}/* Mobil */
@media (max-width: 768px) {
.uretim-slider-container {
padding: 0 20px;
}.uretim-slider-stats {
flex-wrap: wrap;
gap: 20px;
}.uretim-slider-nav {
width: 100%;
right: 0;
justify-content: center;
bottom: 30px;
}
}/**//* ANA KONTEYNER (Arka Plan Resminizi Buraya Ekleyeceksiniz) */
.hero-section {
width: 100%;
height: auto;
/* DİKKAT: 'arkaplan.jpg' yazan yere kendi resminizin adını veya yolunu yazın */
background-image: url("../images/bg2.webp");
background-size: cover;
background-position: center;
background-repeat: no-repeat;
display: flex;
align-items: center;
justify-content: center;
padding: 80px 20px 150px;
}/* İçeriklerin hizalandığı ana çerçeve */
.content-wrapper {
max-width: 1200px;
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
gap: 50px;
}/* ===== SOL TARAF: KARTLAR ===== */
.cards-column {
flex: 1;
max-width: 450px;
display: flex;
flex-direction: column;
gap: 15px;
/* Kartlar arası boşluk */
}.sustainability-card {
background-color: rgba(248, 251, 249, 0.85);
/* Hafif şeffaf beyaz/yeşil */
border: 1px solid #b8cbbd;
/* Görseldeki gibi kalınca açık yeşil kenarlık */
border-radius: 0px;
/* Hafif yuvarlatılmış köşeler */
padding: 25px 30px;
backdrop-filter: blur(3px);
/* Arka planı hafif bulandırır (cam efekti) */
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
transition: transform 0.3s ease;
display: flex;
}.sustainability-card:hover {
transform: translateX(10px);
/* Üzerine gelince hafif sağa kayar */
}.card-icon {
color: #557960;
margin-right: 12px;
display: flex;
}.sustainability-card h3 {
font-weight: 700;
font-size: 16px;
color: #2b4531;
/* Koyu Orman Yeşili */
margin-bottom: 8px;
}.sustainability-card p {
font-weight: 400;
font-size: 12px;
line-height: 1.6;
color: #66736a;
}/* ===== SAĞ TARAF: TİPOGRAFİ & METİN ===== */
.text-column {
flex: 1;
max-width: 550px;
text-align: center;
}.brand-overline {
font-size: 22px;
font-style: italic;
letter-spacing: 2px;
color: #091a0c;
margin-bottom: 5px;
display: flex;
align-items: center;
justify-content: center;
gap: 15px;
}/* 'atelier' yazısının yanındaki ince çizgiler */
.brand-overline::before,
.brand-overline::after {
content: "";
display: block;
width: 30px;
height: 1px;
background-color: #333;
}.brand-title {
font-weight: 700;
font-size: 38px;
letter-spacing: 6px;
color: var(--renk2);
margin-bottom: 35px;
}.brand-subtitle {
font-weight: 600;
font-size: 15px;
color: #6a7f2d;
margin-bottom: 25px;
line-height: 1.5;
}.brand-description {
font-weight: 500;
font-size: 14px;
line-height: 1.6;
color: #091a0c;
text-align: center;
text-shadow: 0px 0px 10px #fff;
/* İki yana yaslamak isterseniz: text-align: justify; kullanabilirsiniz */
margin-bottom: 25px;
}/* Mobil ve Tablet Uyumluluğu */
@media (max-width: 992px) {
.content-wrapper {
flex-direction: column-reverse;
/* Mobilde metni üste, kartları alta alır */
gap: 60px;
}.cards-column,
.text-column {
max-width: 100%;
}.brand-title {
font-size: 28px;
letter-spacing: 4px;
}
}/**/.footer1 {
background-color: #ffffff;
padding: 60px 0 20px 0;
color: #333;
border-top: 1px solid #f2f2f2;
}.footer1-inner {
max-width: 1200px;
margin: 0 auto;
padding: 0 20px;
text-align: center;
}/* Logo Ayarları */
.main-logo-img {
height: 20px;
margin-bottom: 40px;
}/* İletişim Satırı */
.footer1-contact-row {
display: flex;
justify-content: center;
align-items: center;
gap: 20px;
margin-bottom: 15px;
}.footer1-info-item {
font-size: 24px;
font-weight: 500;
color: #091a0c;
display: flex;
align-items: center;
gap: 10px;
text-decoration: none;
}.footer1-info-item svg {
stroke: #091a0c;
width: 20px;
}.footer1-v-divider {
width: 1px;
height: 35px;
background-color: #ddd;
}.footer1-address {
font-size: 14px;
color: #888;
margin-bottom: 30px;
}/* Menü */
.footer1-nav {
border-top: 1px solid #f9f9f9;
border-bottom: 1px solid #f9f9f9;
padding: 15px 0;
margin-bottom: 40px;
}.footer1-nav a {
text-decoration: none;
color: #555;
font-size: 12px;
text-transform: uppercase;
letter-spacing: 1.5px;
margin: 0 15px;
transition: 0.3s;
}.footer1-nav a:hover {
color: var(--renk2);
}/* Aksiyon Alanı (Sosyal & Katalog) */
.footer1-actions-wrap {
display: flex;
justify-content: center;
align-items: center;
gap: 30px;
margin-bottom: 50px;
}.footer1-social {
display: flex;
gap: 15px;
}.footer1-social a {
color: #091a0c;
transition: 0.3s;
}.footer1-social li {
list-style: none;
}
.footer1-social a svg {
fill: #091a0c;
transition: 0.3s;
width: 23px;
height: 23px;
}.footer1-social a:hover {
transform: translateY(-3px);
}/* Katalog Butonu */
.footer1-catalog-btn-premium {
display: none;
align-items: center;
background-color: var(--renk2);
color: #fff;
text-decoration: none;
padding: 6px 6px 6px 20px;
border-radius: 50px;
transition: 0.3s;
}.footer1-catalog-btn-premium .btn-text {
font-size: 11px;
font-weight: 600;
letter-spacing: 1px;
margin-right: 15px;
}.footer1-catalog-btn-premium .btn-icon {
background: #fff;
color: var(--renk2);
width: 32px;
height: 32px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
}.footer1-catalog-btn-premium:hover {
background-color: #333;
}/* İş Ortakları */
.footer1-partners {
display: flex;
justify-content: center;
align-items: center;
gap: 30px;
margin-bottom: 50px;
}.partner-img {
max-height: 45px;
width: auto;
}.partner-divider {
height: 25px;
}/* Alt Bant (Copy & Credits) */
.footer1-bottom-bar {
display: flex;
justify-content: space-between;
align-items: center;
border-top: 1px solid #f2f2f2;
padding-top: 20px;
font-size: 11px;
color: #999;
}.footer1-credits {
display: flex;
align-items: center;
gap: 10px;
}.footer1-credits strong {
color: #666;
letter-spacing: 1px;
}.footer1-credits a {
display: flex;
align-items: center;
}
.footer1-credits img {
height: 15px;
width: auto;
}/* Mobil Uyumluluk */
@media (max-width: 768px) {
.footer1-bottom-bar {
flex-direction: column;
gap: 15px;
text-align: center;
}
.footer1-contact-row {
flex-direction: column;
gap: 10px;
}
.footer1-v-divider {
display: none;
}
.footer1-nav a {
display: block;
margin: 10px 0;
}
.footer1-actions-wrap {
flex-direction: column;
gap: 20px;
}.main-logo-img {
max-width: 118px;
height: auto;
margin-bottom: 20px;
}
.footer1-address {
font-size: 14px;
color: #888;
margin-bottom: 10px;
}
}.footer1-address a {
color: #091a0c;
text-decoration: none;
}.footer1-info-item:hover,
.footer1-address a:hover {
color: var(--renk2); /* Logodaki renk */
}/* ========================================= */
/* PREMIUM MOBİL TASARIM GÜNCELLEMELERİ */
/* ========================================= */@media (max-width: 768px) {
/* 1. Marquee (Kayan Yazı) - Yazı boyutunu mobilde biraz küçültelim */
.meyteks-marquee-content span,
.meyteks-marquee-content h1 {
font-size: 18px;
letter-spacing: 2px;
}/* 2. Services (Servis Kartları) */
.meyteks-services-wrapper {
grid-template-columns: 1fr;
gap: 5px; /* Kartlar arası çok ince şık bir boşluk */
}
.meyteks-service-card {
height: 380px; /* Mobilde dikeyde çok yer kaplamasın */
}
.service-title {
font-size: 20px;
padding: 8px 20px;
}
/* Mobilde hover olmadığı için açıklama metnini hafif görünür yapabiliriz
veya dokunmatik odaklı olduğu için opacity'yi 0.8 yapabiliriz */
.service-desc {
opacity: 0.9;
max-height: 100px;
transform: translateY(0);
font-size: 13px;
margin-top: 10px;
}/* 3. Hakkımızda (İstatistikler) - 1 sütun yerine 2x2 grid daha şık durur */
.hakkimizda {
padding: 50px 0;
}
.hakkimizda-stats {
grid-template-columns: 1fr 1fr; /* 2'li düzen */
}
.hakkimizda .stat-box {
padding: 30px 15px;
text-align: center;
border-right: 1px solid #e0e0e0;
border-bottom: 1px solid #e0e0e0;
}
.hakkimizda .stat-number {
font-size: 32px;
}
.hakkimizda .stat-title {
font-size: 16px;
}/* 4. Üretim Slider (Uretim Slider) */
.uretim-slider {
height: 70vh; /* Mobilde tam ekran yerine biraz daha kısa */
}
.uretim-slider-title {
font-size: 26px !important; /* Başlıklar çok taşmasın */
margin-bottom: 15px;
}
.uretim-slider-text {
font-size: 14px;
line-height: 1.4;
}
.uretim-slider-stats {
gap: 15px;
}
.uretim-slider-stat strong {
font-size: 20px;
}
.uretim-slider-nav {
bottom: 20px;
right: 50%;
transform: translateX(50%); /* Okları tam merkeze alalım */
}/* 5. Sustainability (Hero Section) */
.hero-section {
padding: 60px 15px;
}
.brand-overline {
font-size: 16px;
}
.brand-title {
font-size: 24px !important;
letter-spacing: 3px;
margin-bottom: 20px;
}
.sustainability-card {
padding: 20px;
flex-direction: column; /* İkon üste, yazı alta */
text-align: center;
}
.card-icon {
justify-content: center;
margin-bottom: 10px;
margin-right: 0;
}/* 6. Footer Modifikasyonları */
.footer1 {
padding: 40px 0 20px;
}
.footer1-info-item {
font-size: 18px; /* Telefon numarası mobilde çok devasa durmasın */
}
.footer1-nav {
display: grid;
grid-template-columns: 1fr 1fr; /* Menü yan yana 2'li dizilsin */
gap: 10px;
}
.footer1-nav a {
margin: 5px 0;
font-size: 11px;
}
.footer1-partners {
gap: 15px;
flex-wrap: wrap; /* Logolar sığmazsa alt satıra geçsin */
}
.partner-img {
max-height: 30px;
}
}/* Küçük ekranlı telefonlar (iPhone SE vb.) */
@media (max-width: 400px) {
.hakkimizda-stats {
grid-template-columns: 1fr; /* Çok küçük ekranda tekrar tek sütun */
}
.brand-title {
font-size: 20px !important;
}
.uretim-slider-title {
font-size: 22px !important;
}
}@media(max-width:1024px){
.footer1{
margin-bottom: 35px;
}
}