/* --- Genel Değişkenler --- */
:root {
--bg-dark: #0d0e0b;
--primary-red: #ad130d;
--text-white: #ffffff;
}/* --- Seksiyon Ayarları --- */
.premium-services-section {
background-color: var(--bg-dark);
padding: 100px 0;
}.premium-services-section .container {
max-width: 1350px;
margin: 0 auto;
padding: 0 4%;
}/* --- Üst Başlık Tasarımı --- */
.premium-services-section .section-header {
display: flex;
justify-content: space-between;
align-items: flex-end;
margin-bottom: 50px;
}.premium-services-section .sub-title {
color: var(--primary-red);
font-size: 13px;
font-weight: 700;
letter-spacing: 2px;
text-transform: uppercase;
display: block;
margin-bottom: 8px;
}.premium-services-section .main-title {
color: var(--text-white);
font-size: 2.4rem;
font-weight: 800;
margin: 0;
line-height: 1.1;
letter-spacing: -1px;
}/* Tümünü Gör Butonu */
.premium-services-section .btn-outline {
display: inline-flex;
align-items: center;
gap: 8px;
color: var(--text-white);
text-decoration: none;
font-size: 15px;
font-weight: 600;
padding: 12px 24px;
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 4px;
transition: all 0.3s ease;
}.premium-services-section .btn-outline:hover {
background-color: var(--primary-red);
border-color: var(--primary-red);
}.premium-services-section .btn-outline svg {
width: 18px;
height: 18px;
transition: transform 0.3s ease;
}.premium-services-section .btn-outline:hover svg {
transform: translateX(4px);
}/* --- GRID YAPISI --- */
.premium-services-section .services-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 30px;
}/* --- KART TASARIMI (The "Wow" Factor) --- */
.service-box {
position: relative;
height: 420px; /* Gösterişli uzun kartlar */
border-radius: 8px;
overflow: hidden;
text-decoration: none;
display: flex;
flex-direction: column;
justify-content: flex-end;
group: hover;
background-color: #111;
}/* Kart Arka Plan Resmi */
.service-box .bg-img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
z-index: 1;
transition: transform 0.7s cubic-bezier(0.25, 0.8, 0.25, 1);
}/* Karartma Maskesi (Gradient) */
.service-box .overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
/* Alt tarafı kapkaranlık, üstü şeffaf yapar */
background: linear-gradient(
to top,
rgba(13, 14, 11, 0.95) 0%,
rgba(13, 14, 11, 0.7) 40%,
rgba(13, 14, 11, 0.1) 100%
);
z-index: 2;
transition: background 0.5s ease;
}/* Hover Kırmızı Alt Çizgi */
.service-box::after {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 0;
height: 4px;
background-color: var(--primary-red);
z-index: 4;
transition: width 0.5s cubic-bezier(0.25, 0.8, 0.25, 1);
}/* İçerik Konteyneri */
.service-box .content {
position: relative;
z-index: 3;
padding: 35px;
display: flex;
flex-direction: column;
}/* Şık İkon Kutusu */
.service-box .icon-wrapper {
width: 50px;
height: 50px;
background: rgba(255, 255, 255, 0.05);
backdrop-filter: blur(5px);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 25px;
transition: all 0.4s ease;
}.service-box .icon-wrapper svg {
width: 24px;
height: 24px;
color: var(--text-white);
transition: color 0.4s ease;
}/* Metinler */
.service-box h3 {
color: var(--text-white);
font-size: 24px;
font-weight: 700;
margin: 0 0 10px 0;
transition: transform 0.4s ease;
}.service-box .texttext {
max-width: 84%;
color: #a1a3a6;
font-size: 15px;
line-height: 1.4;
margin: 0;
opacity: 0; /* Başlangıçta görünmez */
max-height: 0; /* Başlangıçta yer kaplamaz */
transform: translateY(20px);
transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}/* Sağ Alttaki Ok Butonu */
.service-box .arrow-btn {
position: absolute;
bottom: 35px;
right: 35px;
width: 40px;
height: 40px;
background-color: var(--primary-red);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
opacity: 0;
transform: translateX(-20px) scale(0.8);
transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}.service-box .arrow-btn svg {
width: 20px;
height: 20px;
color: var(--text-white);
}/* --- KART HOVER EFEKTLERİ (Sihir Burada) --- */
.service-box:hover .bg-img {
transform: scale(1.1); /* Resim yakınlaşır */
}.service-box:hover .overlay {
background: linear-gradient(
to top,
rgba(13, 14, 11, 0.98) 0%,
rgba(13, 14, 11, 0.8) 60%,
rgba(13, 14, 11, 0.4) 100%
);
}.service-box:hover::after {
width: 100%; /* Kırmızı çizgi dolar */
}.service-box:hover .icon-wrapper {
background: var(--primary-red);
border-color: var(--primary-red);
transform: translateY(-5px);
}.service-box:hover .texttext {
opacity: 1;
max-height: 100px;
transform: translateY(0);
margin-top: 5px;
}.service-box:hover h3 {
transform: translateY(-5px);
}.service-box:hover .arrow-btn {
opacity: 1;
transform: translateX(0) scale(1);
}/* --- Responsive (Mobil Uyumluluk) --- */
@media (max-width: 1024px) {
.premium-services-section .services-grid {
grid-template-columns: repeat(2, 1fr);
}
}@media (max-width: 768px) {
.premium-services-section .section-header {
flex-direction: column;
align-items: flex-start;
gap: 20px;
}.premium-services-section .main-title {
font-size: 32px;
}.premium-services-section .services-grid {
grid-template-columns: 1fr;
}.service-box {
height: 380px;
}/* Mobilde hover zor olacağı için p etiketini direkt gösteriyoruz */
.service-box p {
opacity: 1;
max-height: 100px;
transform: translateY(0);
margin-top: 5px;
}
.service-box .arrow-btn {
opacity: 1;
transform: translateX(0) scale(1);
}
}/**//* --- Değişkenler (Daha önce eklediyseniz tekrar eklemeyin) --- */
:root {
--bg-dark: #0d0e0b;
--primary-red: #ad130d;
--text-white: #ffffff;
--text-muted: #a1a3a6;
--card-bg-light: #161814; /* Karanlık temada kartların ayrışması için hafif füme */
}/* --- .home-blog Seksiyon Ayarları --- */
.home-blog {
background-color: var(--bg-dark);
padding: 100px 0;
font-family: "Inter", "Segoe UI", sans-serif;
}.home-blog .container {
max-width: 1350px;
margin: 0 auto;
padding: 0 4%;
}/* --- Üst Başlık Alanı --- */
.home-blog .blog-header {
display: flex;
justify-content: space-between;
align-items: flex-end;
margin-bottom: 40px;
}.home-blog .section-title {
color: var(--text-white);
font-size: 36px;
font-weight: 700;
margin: 0;
letter-spacing: -0.5px;
}.home-blog .view-all-link {
display: flex;
align-items: center;
gap: 8px;
color: var(--text-white);
text-decoration: none;
font-size: 16px;
font-weight: 500;
transition: color 0.3s ease;
}.home-blog .view-all-link svg {
width: 20px;
height: 20px;
color: var(--primary-red);
transition: transform 0.3s ease;
}.home-blog .view-all-link:hover {
color: var(--primary-red);
}.home-blog .view-all-link:hover svg {
transform: translateX(5px);
}/* --- Grid Yapısı (4'lü Sütun) --- */
.home-blog .blog-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 25px;
}/* --- Makale Kartı Tasarımı --- */
.home-blog .blog-card {
display: flex;
flex-direction: column;
text-decoration: none;
background-color: var(--card-bg-light);
border: 1px solid rgba(255, 255, 255, 0.05);
border-radius: 4px; /* Çok hafif bir köşe yumuşatması */
overflow: hidden;
transition:
transform 0.3s ease,
box-shadow 0.3s ease,
border-color 0.3s ease;
}/* Kartın İçerik (Yazı) Kısmı */
.home-blog .blog-content {
padding: 30px;
display: flex;
flex-direction: column;
flex-grow: 1; /* Başlıklar farklı uzunlukta olsa bile resimleri en alta iter */
}/* Kategori Etiketi */
.home-blog .blog-category {
color: var(--primary-red);
font-size: 12px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 1px;
margin-bottom: 15px;
}/* Makale Başlığı */
.home-blog .blog-title {
color: var(--text-white);
font-size: 18px;
font-weight: 600;
line-height: 1.5;
margin: 0;
margin-bottom: 30px; /* Ok ve tarih ile arayı açar */
transition: color 0.3s ease;
}/* Alt Kısım (Ok ve Tarih) */
.home-blog .blog-meta {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: auto; /* Yazı kısa kalsa bile bu div'i en alta yapıştırır */
border-top: 1px solid rgba(255, 255, 255, 0.05);
padding-top: 20px;
}.home-blog .arrow-icon svg {
width: 24px;
height: 24px;
color: var(--primary-red);
transition: transform 0.3s ease;
}.home-blog .blog-date {
color: var(--text-muted);
font-size: 13px;
font-weight: 500;
}/* Kartın Resim Kısmı (En Altta) */
.home-blog .blog-image {
width: 100%;
aspect-ratio: 16 / 9; /* Geniş ve şık bir resim oranı */
overflow: hidden;
position: relative;
}.home-blog .blog-image img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.5s ease;
}/* --- Hover (Fare Üzerine Gelince) Efektleri --- */
.home-blog .blog-card:hover {
transform: translateY(-8px);
box-shadow: 0 15px 30px rgba(0, 0, 0, 0.5);
border-color: rgba(173, 19, 13, 0.3);
}.home-blog .blog-card:hover .blog-title {
color: var(--primary-red);
}.home-blog .blog-card:hover .arrow-icon svg {
transform: translateX(6px);
}.home-blog .blog-card:hover .blog-image img {
transform: scale(1.08); /* Resim hafifçe yaklaşır */
}/* --- Responsive (Mobil Uyumluluk) --- */
@media (max-width: 1200px) {
.home-blog .blog-grid {
grid-template-columns: repeat(2, 1fr); /* Tablette 2 Sütun */
}
}@media (max-width: 768px) {
.home-blog .blog-header {
flex-direction: column;
align-items: flex-start;
gap: 15px;
}.home-blog .section-title {
font-size: 28px;
}.home-blog .blog-grid {
grid-template-columns: 1fr; /* Mobilde Tek Sütun */
}.home-blog .blog-content {
padding: 25px;
}
}/**//* Genel Font Ayarı (Projenizde zaten varsa bu kısmı silebilirsiniz) */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700&display=swap");.hakkimizda {
/* İstenen gri/beyaz estetik zemin */
background-color: #f8f9fa;
font-family: "Inter", sans-serif;
padding: 100px 20px;
color: #0d0e0b; /* İstenen koyu antrasit renk */
}.hakkimizda-container {
max-width: 1280px;
margin: 0 auto;
}/* Üst Kısım Tasarımı */
.hakkimizda-top {
display: flex;
align-items: center;
justify-content: space-between;
gap: 60px;
margin-bottom: 80px;
}.hakkimizda-content {
flex: 1;
max-width: 600px;
}.hakkimizda-content h2 {
font-size: 2.4rem;
line-height: 1.3;
font-weight: 600;
margin-top: 20px;
margin-bottom: 20px;
color: #0d0e0b; /* Koyu renk başlık */
letter-spacing: -0.5px;
}.hakkimizda-content h2 b {
color: #ac130d; /* Koyu renk başlık */
font-weight: 600;
}.hakkimizda-content .textt {
margin-bottom: 40px;
line-height: 1.5;
font-weight: 400;
}/* Buton Tasarımı - İstenen #AD130D ve #0D0E0B renkleriyle */
.hakkimizda-btn {
display: inline-flex;
align-items: center;
gap: 12px;
background-color: #0d0e0b; /* Varsayılan koyu renk */
color: #ffffff;
padding: 16px 32px;
font-size: 1rem;
font-weight: 600;
text-decoration: none;
border-radius: 4px;
transition: all 0.3s ease;
}.hakkimizda-btn:hover {
background-color: #ad130d; /* Hover durumunda istenen estetik kırmızı */
transform: translateY(-2px);
box-shadow: 0 10px 20px rgba(173, 19, 13, 0.2);
}.hakkimizda-image {
flex: 1;
position: relative;
border-radius: 12px;
overflow: hidden;
box-shadow: 0 20px 40px rgba(13, 14, 11, 0.1);
}.hakkimizda-image img {
width: 100%;
height: 400px;
object-fit: cover;
display: block;
}/* Görselin üzerine hafif antrasit bir ton vererek kurumsallık katıyoruz */
.image-overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: linear-gradient(to right, rgba(13, 14, 11, 0.4), transparent);
}/* Alt Kısım - Özellikler Grid Yapısı */
.hakkimizda-features {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 30px;
}/* Estetik Beyaz Kartlar */
.feature-box {
background: #ffffff;
padding: 40px 30px;
border-radius: 12px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04); /* Çok hafif şık bir gölge */
transition: all 0.3s ease;
border-bottom: 3px solid transparent;
}.feature-box:hover {
transform: translateY(-10px);
border-bottom: 3px solid #ad130d; /* Hover'da zarif kırmızı çizgi detayı */
box-shadow: 0 15px 30px rgba(0, 0, 0, 0.08);
}.feature-icon {
width: 48px;
height: 48px;
margin-bottom: 24px;
color: #ad130d; /* İkonlar istenen kırmızı tonda */
}.feature-icon svg {
width: 100%;
height: 100%;
}.feature-box h3 {
font-size: 1.25rem;
font-weight: 600;
color: #0d0e0b;
margin-bottom: 16px;
}.feature-box p {
font-size: 0.95rem;
line-height: 1.6;
color: #555555; /* Metin okunabilirliği için yumuşak gri */
}/* Mobil ve Tablet Uyumluluğu (Responsive Design) */
@media (max-width: 1024px) {
.hakkimizda-top {
flex-direction: column;
}
.hakkimizda-image {
width: 100%;
}
.hakkimizda-features {
grid-template-columns: repeat(2, 1fr);
}
}@media (max-width: 768px) {
.hakkimizda {
padding: 60px 20px;
}
.hakkimizda-content h2 {
font-size: 1.8rem;
}
.hakkimizda-features {
grid-template-columns: 1fr;
}
}/**/.dw-faq-section {
padding: 80px 20px;
background-color: #fafafa; /* Çok açık gri, premium bir zemin */
}.dw-faq-container {
max-width: 800px;
margin: 0 auto;
}.dw-faq-header {
text-align: left;
margin-bottom: 50px;
}.dw-faq-header h3 {
color: #ad130d;
font-size: 14px;
letter-spacing: 2px;
text-transform: uppercase;
margin-top: 0px;
margin-bottom: 10px;
font-weight: 600;
}.dw-faq-header h2 {
color: #0d0e0b;
font-size: 2.2rem;
font-weight: 700;
margin-top: 0px;
}/* SSS Kutuları */
.dw-faq-item {
background-color: #ffffff;
border-radius: 10px;
margin-bottom: 15px;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);
border: 1px solid #eeeeee;
overflow: hidden;
transition: all 0.3s ease;
}/* Kutu Açıldığında veya Hover Olduğunda Çıkan Efekt */
.dw-faq-item:hover {
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.06);
}.dw-faq-item.active {
border-color: rgba(173, 19, 13, 0.3);
box-shadow: 0 10px 30px rgba(173, 19, 13, 0.08);
}/* Soru Başlığı Butonu */
.dw-faq-question {
width: 100%;
display: flex;
align-items: center;
background: transparent;
border: none;
padding: 24px 30px;
cursor: pointer;
text-align: left;
transition: all 0.3s;
}.dw-faq-number {
font-size: 1.5rem;
font-weight: 700;
color: rgba(13, 14, 11, 0.1); /* Silik siyah numara */
margin-right: 20px;
transition: color 0.3s;
}.dw-faq-item.active .dw-faq-number {
color: #ad130d; /* Açılınca numara kırmızı olur */
}.dw-faq-text {
flex: 1;
font-size: 1.1rem;
font-weight: 600;
color: #0d0e0b;
padding-right: 20px;
}/* Artı İkonu */
.dw-faq-icon {
width: 24px;
height: 24px;
color: #0d0e0b;
transition:
transform 0.4s ease,
color 0.3s;
flex-shrink: 0;
}/* Tıklandığında Artı ikonu 45 derece dönerek (X) çarpı işareti olur */
.dw-faq-item.active .dw-faq-icon {
transform: rotate(45deg);
color: #ad130d;
}/* Cevap Alanı (Başlangıçta Gizli) */
.dw-faq-answer {
max-height: 0;
overflow: hidden;
transition: max-height 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
}.dw-faq-answer-inner {
padding: 0 30px 24px 75px; /* Yazının numara ile hizalanması için soldan boşluk */
color: #636e72;
line-height: 1.7;
font-size: 0.95rem;
}/* Mobil Uyumluluk */
@media (max-width: 768px) {
.dw-faq-question {
padding: 20px;
}
.dw-faq-answer-inner {
padding: 0 20px 20px 20px;
}
.dw-faq-number {
margin-right: 15px;
font-size: 1.2rem;
}
.dw-faq-text {
font-size: 1rem;
}
}/* Başlık Tasarımı (SSS tarafıyla uyumlu görünmesi için) */
.cozum-ortaklari-header {
margin-bottom: 30px;
}
.cozum-ortaklari-header h3 {
font-size: 14px;
color: #6366f1; /* Sitenizin ana rengini buraya girebilirsiniz */
font-weight: 600;
letter-spacing: 1.5px;
text-transform: uppercase;
margin-bottom: 8px;
}
.cozum-ortaklari-header h2 {
font-size: 32px;
font-weight: 700;
color: #1f2937;
margin: 0;
}/* 2'li Grid Sistemi */
.cozum-ortaklari-liste {
display: grid;
grid-template-columns: repeat(2, 1fr); /* 2 kolon oluşturur */
gap: 20px; /* Kutular arası boşluk */
}/* Logo Kutusu Tasarımı */
.partner-item {
background-color: #ffffff;
border: 1px solid #e5e7eb;
border-radius: 12px;
padding: 20px 30px;
height: 135px; /* Tüm kutuların boyu eşit olsun diye */
display: flex;
align-items: center;
justify-content: center;
transition: all 0.3s ease;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.02);
cursor: pointer;
}/* Kutu içindeki logonun ayarları */
.partner-item img {
max-width: 100%;
max-height: 100%;
object-fit: contain; /* Logonun orantısını bozmadan sığdırır */
filter: grayscale(100%) opacity(70%); /* Başlangıçta gri ve biraz saydam */
transition: all 0.3s ease;
}/* Fareyle Üzerine Gelince (Hover Animasyonu) */
.partner-item:hover {
transform: translateY(-5px); /* Hafif yukarı kalkar */
box-shadow: 0 12px 20px rgba(0, 0, 0, 0.08); /* Gölgelenir */
border-color: #d1d5db;
}.partner-item:hover img {
filter: grayscale(0%) opacity(100%); /* Orijinal renklerine geri döner */
transform: scale(1.05); /* Logo çok hafif büyür */
}/* Mobil Cihazlar İçin Uyumluluk (Telefonlarda logolar çok küçülmesin diye) */
@media (max-width: 576px) {
.cozum-ortaklari-liste {
gap: 15px;
}
.partner-item {
height: 90px;
padding: 15px;
}
}
/**//* Footer Ana Ayarlar */
.site-footer {
background-color: #0f1010; /* İstediğin zemin rengi */
color: #ffffff;
padding-top: 80px;
border-top: 3px solid #a9140d; /* Premium Kırmızı Çizgi */
}.footer-container {
max-width: 1300px;
margin: 0 auto;
padding: 0 25px;
}.footer-main {
padding-bottom: 60px;
}.footer-container.footer-grid {
display: grid;
grid-template-columns: 1.2fr 1.2fr 1fr;
gap: 50px;
}/* 1. Sütun Tasarımı */
.footer-logo img {
height: 115px;
margin-bottom: 25px;
}.footer-description {
color: #a0a0a0;
font-size: 14px;
line-height: 1.7;
margin-bottom: 30px;
}.footer-social {
display: flex;
gap: 15px;
}.footer-social a {
width: 42px;
height: 42px;
background: #1a1b1b;
color: #ffffff;
display: flex;
align-items: center;
justify-content: center;
border-radius: 8px;
transition: all 0.3s ease;
text-decoration: none;
}.footer-social a svg {
width: 20px;
height: 20px;
fill: #ffffff;
}.footer-social a:hover {
background: #a9140d;
transform: translateY(-5px);
box-shadow: 0 5px 15px rgba(169, 20, 13, 0.4);
}/* 2. Sütun Tasarımı */
.footer-heading {
font-size: 18px;
font-weight: 700;
margin-bottom: 30px;
text-transform: uppercase;
letter-spacing: 1px;
position: relative;
}.footer-heading::after {
content: "";
position: absolute;
bottom: -8px;
left: 0;
width: 40px;
height: 2px;
background: #a9140d;
}.contact-item {
display: flex;
gap: 15px;
margin-bottom: 25px;
}.contact-icon {
color: #a9140d; /* İkonlar kırmızı */
flex-shrink: 0;
}.contact-text strong {
display: block;
font-size: 13px;
color: #ffffff;
text-transform: uppercase;
margin-bottom: 5px;
}.contact-text span,
.contact-text a {
font-size: 14px;
color: #a0a0a0;
text-decoration: none;
line-height: 1.5;
transition: color 0.3s;
}.contact-text a:hover {
color: #a9140d;
}/* 3. Sütun & Harita Tasarımı */
.map-box {
background: #1a1b1b;
padding: 8px;
border-radius: 12px;
overflow: hidden;
}.map-box iframe {
height: 220px;
border-radius: 8px;
filter: grayscale(1) invert(0.9) contrast(1.2); /* Haritayı Modern Dark yapar */
}.btn-directions {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
background: #a9140d;
color: white;
text-decoration: none;
padding: 14px;
margin-top: 10px;
border-radius: 8px;
font-size: 13px;
font-weight: 700;
text-transform: uppercase;
transition: all 0.3s ease;
}.btn-directions:hover {
background: #8e110b;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
}/* Footer Bottom Bar */
.footer-bottom {
background-color: #080808;
padding: 25px 0;
border-top: 1px solid #1a1b1b;
}.bottom-row {
display: flex;
justify-content: space-between;
align-items: center;
}.copyright {
color: #666;
font-size: 13px;
margin: 0;
}.design-by {
color: #666;
font-size: 13px;
}.highlight {
color: #a9140d;
font-weight: 700;
}/* Mobil Uyumluluk */
@media (max-width: 992px) {
.footer-container.footer-grid {
grid-template-columns: 1fr 1fr;
}
}@media (max-width: 768px) {
.footer-container.footer-grid {
grid-template-columns: 1fr;
text-align: center;
}
.footer-social {
justify-content: center;
}
.contact-item {
flex-direction: column;
align-items: center;
}
.footer-heading::after {
left: 50%;
transform: translateX(-50%);
}
.bottom-row {
flex-direction: column;
gap: 15px;
}
}/* --- MOBİL OPTİMİZASYON VE İNCE AYARLAR --- */@media (max-width: 768px) {
.footer-main{
display: none;
}.dw-faq-container{
margin-top: 40px;
}/* Genel Boşluk Ayarları */
.premium-services-section,
.home-blog,
.hakkimizda,
.dw-faq-section {
padding: 60px 20px; /* Mobilde çok geniş dikey boşlukları daralttık */
}/* 1. Hizmetler Kartları (Premium Services) */
.premium-services-section .main-title {
font-size: 1.8rem; /* Mobilde başlık biraz daha küçük */
line-height: 1.2;
}.service-box {
height: 320px; /* Mobilde kart boyu biraz küçülsün */
}.service-box .content {
padding: 20px; /* İç boşluğu daralttık */
}.service-box .icon-wrapper {
margin-bottom: 15px;
width: 45px;
height: 45px;
}/* Mobilde hover olmadığı için metni ve oku görünür yapıyoruz */
.service-box .texttext {
opacity: 0.9 !important;
max-height: 60px !important;
transform: translateY(0) !important;
font-size: 14px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}.service-box .arrow-btn {
opacity: 1 !important;
transform: scale(1) !important;
bottom: 20px;
right: 20px;
width: 35px;
height: 35px;
}/* 2. Blog Bölümü */
.home-blog .section-title {
font-size: 24px;
}.home-blog .blog-card {
margin-bottom: 10px;
}.home-blog .blog-content {
padding: 20px;
}.home-blog .blog-title {
font-size: 16px;
margin-bottom: 20px;
}/* 3. Hakkımızda Bölümü */
.hakkimizda-image img {
height: 250px; /* Mobilde devasa görsel olmasın */
}.hakkimizda-content h2 {
font-size: 1.6rem;
text-align: center;
}.hakkimizda-content .textt {
text-align: center;
font-size: 15px;
}.hakkimizda-btn {
display: flex; /* Butonu ortalamak için */
justify-content: center;
width: 100%;
box-sizing: border-box;
}.feature-box {
padding: 25px 20px;
text-align: center;
}.feature-icon {
margin: 0 auto 20px auto;
}/* 4. SSS (FAQ) Bölümü */
.dw-faq-header h2 {
font-size: 1.6rem;
}.dw-faq-number {
display: none; /* Mobilde numara çok yer kaplıyorsa gizlenebilir veya küçültülebilir */
}.dw-faq-answer-inner {
padding: 0 20px 20px 20px !important; /* Soldaki 75px boşluğu iptal ettik */
font-size: 14px;
}.dw-faq-text {
font-size: 15px;
padding-right: 10px;
}/* 5. Çözüm Ortakları */
.partner-item {
height: 80px;
padding: 10px;
}
.partner-item img {
filter: grayscale(0); /* Mobilde logolar direkt renkli görünsün (hover olmadığı için) */
max-width: 80%;
}/* 6. Footer */
.site-footer {
margin-bottom: 35px;
padding-top: 0px;
text-align: center;
}.footer-logo img {
height: 80px;
margin: 0 auto 20px auto;
}.footer-heading::after {
left: 50%;
transform: translateX(-50%);
}.contact-item {
flex-direction: column;
gap: 5px;
}.footer-social {
justify-content: center;
margin-bottom: 30px;
}.map-box iframe {
height: 180px;
}
}/* Çok Küçük Ekranlar İçin (iPhone 5/SE tarzı) */
@media (max-width: 380px) {
.premium-services-section .main-title {
font-size: 1.5rem;
}
.service-box h3 {
font-size: 18px;
}
}