Launch EasyDiag 3.0 Arıza Tespit Cihazı + Tablet
/* Fonts */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;600;700&family=Orbitron:wght@400;700&display=swap');
/* Combined CSS Variables */
:root {
/* Hero Section Variables (Original) - Updated Red Tones to match Launch Logo */
--primary-red-hero: #E60000; /* Launch Kırmızısı */
--secondary-red-hero: #B30000; /* Daha koyu Launch Kırmızısı */
--light-red-hero: #FF3333; /* Açık/Parlak Launch Kırmızısı */
--dark-gray-hero: #222;
--light-gray-hero: #f4f4f4;
--white-hero: #fff;
--black-hero: #000;
/* Gallery Section Variables (From Feedback) - Standardized to Hero Reds */
--primary-red: var(--primary-red-hero);
--neon-red: var(--light-red-hero);
--dark-red: var(--secondary-red-hero);
--neon-glow: 0 0 15px rgba(var(--neon-red-rgb), 0.85), 0 0 30px rgba(var(--neon-red-rgb), 0.5);
--dark-bg: transparent;
--darker-bg: transparent;
--light-text: #333333;
--gray-text: #555555;
/* Helpers for rgba - Updated to match Launch Logo Reds */
--darker-bg-rgb: 34, 40, 49;
--neon-red-rgb: 255, 51, 51; /* Corresponds to --light-red-hero (#FF3333) */
--primary-red-rgb: 230, 0, 0; /* Corresponds to --primary-red-hero (#E60000) */
}
/* Global Reset */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: 'Montserrat', sans-serif;
line-height: 1.6;
color: var(--dark-gray-hero);
overflow-x: hidden;
background-color: var(--white-hero);
}
/* --- Hero Section Styles --- */
.tech-font {
font-family: 'Orbitron', sans-serif;
}
.hero {
position: relative;
height: 100vh; /* Yükseklik 100vh olarak geri alındı */
display: flex;
align-items: center;
justify-content: center; /* Masaüstü için merkezde */
overflow: hidden;
flex-direction: column;
padding: 0 10px; /* Yatay padding'i düşürelim */
z-index: 10;
border-radius: 25px;
margin: 20px 20px; /* Yeterli margin bırakalım */
min-height: 100vh; /* Yükseklik 100vh olarak geri alındı */
border: 1px solid #ddd;
opacity: 0;
transform: translateY(40px);
transition: opacity 0.7s ease-out, transform 0.7s ease-out;
}
.hero.visible {
opacity: 1;
transform: translateY(0);
}
.hero-logo {
position: relative;
z-index: 4;
margin-bottom: 12px; /* Margin "bir tık" daha azaltıldı */
opacity: 0;
animation: fadeInLogo 1s ease forwards 0.1s;
max-width: 180px;
height: auto;
}
@keyframes fadeInLogo {
to {
opacity: 1;
}
}
.hero-content {
position: relative;
z-index: 3;
text-align: center;
padding: 10px 12px; /* İçerik padding'ini azaltalım */
color: var(--dark-gray-hero);
max-width: 1200px;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
}
.hero h1 {
font-size: 3.8rem; /* Font boyutu azaltıldı */
font-weight: 700;
margin-bottom: 3px; /* Başlık altındaki boşluğu azaltalım */
text-transform: uppercase;
letter-spacing: 3px;
color: var(--dark-gray-hero);
text-shadow: 0 0 15px rgba(var(--dark-gray-hero), 0.3), 0 0 5px rgba(var(--dark-gray-hero), 0.2);
position: relative;
display: inline-block;
padding-bottom: 8px; /* Padding "bir tık" daha azaltıldı */
padding-left: 30px;
padding-right: 30px;
}
.hero h1::before,
.hero h1::after {
content: '';
position: absolute;
width: 18px; /* Boyut azaltıldı */
height: 18px; /* Boyut azaltıldı */
border-color: var(--primary-red-hero);
border-style: solid;
opacity: 0;
animation: fadeInBrackets 0.5s ease forwards 0.8s;
}
.hero h1::before {
top: 0;
left: 0;
border-width: 4px 0 0 4px;
}
.hero h1::after {
bottom: 0;
right: 0;
border-width: 0 4px 4px 0;
}
@keyframes fadeInBrackets {
to {
opacity: 0.8;
}
}
.hero-content > * {
opacity: 0;
transform: translateY(20px);
animation: fadeInUp 0.8s ease forwards;
}
.hero-content h1 { animation-delay: 0.2s; }
.hero-content .hero-subtitle { animation-delay: 0.4s; }
.hero-content .feature-icons { animation-delay: 0.6s; }
.hero-content .cta-button { animation-delay: 0.8s; }
@keyframes fadeInUp {
to {
opacity: 1;
transform: translateY(0);
}
}
.hero-subtitle {
font-size: 1.4rem; /* Font boyutu azaltıldı */
margin-bottom: 5px; /* Alt başlık altındaki boşluğu azaltalım */
font-weight: 300;
text-shadow: 0 0 10px rgba(var(--dark-gray-hero), 0.2);
}
.feature-icons {
display: flex;
justify-content: center;
align-items: flex-start; /* Değiştirildi: center -> flex-start */
margin: 5px auto; /* İkon alanının marjinlerini azaltalım */
gap: 40px;
width: 100%;
max-width: 900px;
}
.feature-icon {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
transition: all 0.3s ease;
width: 140px;
}
.feature-icon:hover {
transform: translateY(-5px);
}
.feature-icon i {
color: var(--primary-red-hero);
font-size: 2.3rem; /* Font boyutu azaltıldı */
margin-bottom: 15px;
background-color: rgba(255, 255, 255, 0.1);
width: 70px; /* Boyut azaltıldı */
height: 70px; /* Boyut azaltıldı */
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
border: 1px solid rgba(255, 255, 255, 0.2);
transition: all 0.3s ease;
}
.feature-icon:hover i {
background-color: var(--primary-red-hero);
color: var(--white-hero);
box-shadow: 0 5px 15px rgba(230, 0, 0, 0.4);
}
.feature-icon span {
color: var(--dark-gray-hero);
font-size: 0.9rem; /* Font boyutu azaltıldı */
font-weight: 500;
text-transform: uppercase;
letter-spacing: 1px;
text-align: center;
width: 100%;
}
/* Butonları Küçültme */
.cta-button {
display: inline-block;
background: linear-gradient(45deg, var(--primary-red-hero), var(--light-red-hero));
color: var(--white-hero);
padding: 10px 20px; /* Padding daha da küçültüldü */
min-width: 180px; /* Minimum genişlik azaltıldı */
text-align: center;
font-size: 0.95rem; /* Font boyutu daha da küçültüldü */
font-weight: 600;
text-decoration: none;
border-radius: 50px;
margin-top: 15px; /* Margin "bir tık" daha azaltıldı */
transition: all 0.3s ease;
border: none;
text-transform: uppercase;
letter-spacing: 1.5px;
box-shadow: 0 4px 12px rgba(230, 0, 0, 0.4), 0 0 10px rgba(230, 0, 0, 0.2);
position: relative;
overflow: hidden;
z-index: 1;
animation: pulseGlow 2.5s infinite ease-in-out;
}
@keyframes pulseGlow {
0% { box-shadow: 0 4px 12px rgba(230, 0, 0, 0.4), 0 0 10px rgba(230, 0, 0, 0.2); }
50% { box-shadow: 0 6px 18px rgba(230, 0, 0, 0.6), 0 0 20px rgba(255, 51, 51, 0.4); }
100% { box-shadow: 0 4px 12px rgba(230, 0, 0, 0.4), 0 0 10px rgba(230, 0, 0, 0.2); }
}
.cta-button i {
margin-right: 8px;
font-size: 1rem; /* Icon boyutu küçültüldü */
}
.cta-button::before {
content: '';
position: absolute;
top: 0;
left: -75%;
width: 50%;
height: 100%;
background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 50%, rgba(255, 255, 255, 0) 100%);
transform: skewX(-25deg);
transition: left 0.6s ease;
z-index: 2;
}
.cta-button:hover::before {
left: 125%;
}
.cta-button:hover {
background: linear-gradient(45deg, var(--secondary-red-hero), var(--primary-red-hero));
color: var(--white-hero);
transform: translateY(-3px) scale(1.03);
box-shadow: 0 6px 18px rgba(230, 0, 0, 0.6);
}
.cta-buttons-container {
display: flex; /* Değiştirildi: display: none idi */
justify-content: center;
gap: 20px;
margin-top: 3px; /* Margin "bir tık" daha azaltıldı */
width: 100%;
}
/* Mobil butonları da küçültme */
.mobile-cta-container {
display: none; /* !important kaldırıldı - mobilde gösterilmesi gerektiğinde kullanılabilir */
}
/* Scroll indikatörü düzeltme */
.scroll-indicator {
position: absolute;
bottom: 10px; /* Daha da azaltıldı */
left: 50%;
transform: translateX(-50%);
color: var(--dark-gray-hero);
animation: bounce 2s infinite;
font-size: 1.5rem;
z-index: 5;
text-shadow: 0 0 10px rgba(var(--dark-gray-hero), 0.3);
}
@keyframes bounce {
0%, 20%, 50%, 80%, 100% { transform: translateY(0) translateX(-50%); }
40% { transform: translateY(-20px) translateX(-50%); }
60% { transform: translateY(-10px) translateX(-50%); }
}
/* Hero Responsive Styling */
@media (max-width: 768px) {
.hero {
justify-content: flex-start; /* Mobil için içeriği yukarıya taşı */
padding-top: 15px; /* Padding "bir tık" azaltıldı */
padding-bottom: 12px; /* Padding "bir tık" azaltıldı */
min-height: auto; /* Yüksekliği içeriğe göre ayarla */
margin-left: 2.5px;
margin-right: 2.5px;
}
.hero-logo {
margin-top: 20px; /* Sayfanın üstünden boşluk */
margin-bottom: 18px; /* Margin "bir tık" azaltıldı */
max-width: 160px;
}
.hero-content {
padding: 0 15px 10px; /* Alt padding minimuma indirildi */
margin-top: 0; /* .hero h1'deki margin-top yeterli olacak */
width: 100%; /* Tam genişlik kullan */
}
.hero h1 {
font-size: 2.4rem; /* Font boyutu "bir tık" azaltıldı */
padding-left: 20px;
padding-right: 20px;
margin-top: 0; /* Logo ile başlık arasındaki boşluğu .hero-logo margin-bottom yönetecek */
margin-bottom: 8px; /* Margin "bir tık" azaltıldı */
}
.feature-icons {
flex-direction: column; /* Alt alta sıralama */
gap: 18px; /* Gap "bir tık" azaltıldı */
margin-top: 12px; /* Margin "bir tık" azaltıldı */
margin-bottom: 12px; /* Margin "bir tık" azaltıldı */
align-items: center; /* Öğeleri ortala */
width: 100%; /* Mobil için tam genişlik */
}
.feature-icon { /* .feature-icon için mobil stiller burada tanımlanacak */
width: 100%;
max-width: 260px; /* Genişlik ayarı biraz azaltıldı */
}
.feature-icon i {
font-size: 1.9rem; /* Font boyutu "bir tık" azaltıldı */
width: 62px; /* Boyut "bir tık" azaltıldı */
height: 62px; /* Boyut "bir tık" azaltıldı */
margin-bottom: 8px; /* İkon ve metin arası boşluk azaltıldı */
}
.feature-icon span {
font-size: 0.82rem; /* Font boyutu "bir tık" azaltıldı */
}
.cta-buttons-container {
flex-direction: column; /* Butonları alt alta sırala */
align-items: center; /* Ortala */
gap: 8px; /* Gap "bir tık" azaltıldı */
width: 100%;
}
.cta-button {
width: 100%;
max-width: 260px; /* Buton genişliği azaltıldı */
margin-top: 0; /* Üstteki margin'i sıfırla, gap ile yönetilecek */
padding: 9px 16px; /* Padding "bir tık" azaltıldı */
font-size: 0.88rem; /* Font boyutu "bir tık" azaltıldı */
}
.cta-button i {
font-size: 0.9rem; /* Icon boyutu küçültüldü */
}
.scroll-indicator { bottom: 1px; } /* Scroll indikatörü en yukarı taşındı */
.hero-subtitle { font-size: 1.25rem; padding: 0 10px; } /* Font boyutu "bir tık" azaltıldı */
}
@media (max-width: 480px) {
.hero {
padding-top: 15px; /* Daha küçük mobil için üst boşluk azaltıldı */
padding-bottom: 10px; /* Genel alt boşluk azaltıldı */
margin-left: 2.5px;
margin-right: 2.5px;
}
.hero-logo {
margin-top: 15px;
margin-bottom: 15px; /* Logo ve başlık arası boşluk azaltıldı */
max-width: 140px;
}
.hero-content {
padding-bottom: 5px; /* Alt padding minimuma indirildi */
}
.hero h1 {
font-size: 2rem;
padding-left: 15px;
padding-right: 15px;
margin-bottom: 8px; /* Başlık ve alt başlık arası azaltıldı */
margin-top: 0;
}
.hero h1::before, .hero h1::after { width: 15px; height: 15px; }
.hero-subtitle { font-size: 1.1rem; margin-bottom: 15px; /* Alt başlık margin azaltıldı */ }
.scroll-indicator { bottom: 1px; font-size: 1.2rem; } /* Scroll indikatörü en yukarı taşındı */
.feature-icons { gap: 15px; } /* Daha küçük ekran için ikonlar arası boşluk daha da azaltıldı */
.feature-icon i {
font-size: 1.8rem; /* İkon boyutu daha da azaltıldı */
width: 55px; /* İkon arka plan boyutu daha da azaltıldı */
height: 55px; /* İkon arka plan boyutu daha da azaltıldı */
margin-bottom: 6px; /* İkon ve metin arası boşluk daha da azaltıldı */
}
.feature-icon span {
font-size: 0.8rem; /* Metin boyutu daha da azaltıldı */
}
.cta-button {
padding: 8px 15px; /* Padding daha da azaltıldı */
font-size: 0.85rem; /* Font boyutu daha da azaltıldı */
max-width: 240px; /* Max genişlik daha da azaltıldı */
}
.cta-button i {
font-size: 0.85rem; /* Icon boyutu daha da azaltıldı */
}
}
/* --- Gallery Section Styles --- */
.gallery-section {
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
position: relative;
overflow: hidden;
padding: 80px 20px;
border-radius: 25px;
margin: 0 20px 20px 20px;
min-height: calc(100vh - 40px);
border: 1px solid #ddd;
background-color: rgba(230, 0, 0, 0.03);
opacity: 0;
transform: translateY(40px);
transition: opacity 0.7s ease-out, transform 0.7s ease-out;
}
.gallery-section.visible {
opacity: 1;
transform: translateY(0);
}
.gallery-container {
max-width: 1150px;
width: 100%;
z-index: 5;
position: relative;
}
@keyframes pulseEffect {
0% { opacity: 0.6; transform: scale(1); }
100% { opacity: 0.9; transform: scale(1.1); }
}
@keyframes fadeIn {
from { opacity: 0; }
to { opacity: 1; }
}
@keyframes slideUp {
from { transform: translateY(20px); opacity: 0; }
to { transform: translateY(0); opacity: 1; }
}
@keyframes borderFlow {
0% { left: -100%; }
100% { left: 200%; }
}
@keyframes rotate360 {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
.pill-badge {
display: block;
width: fit-content;
margin: 0 auto 25px auto;
background-color: rgba(230, 0, 0, 0.15);
color: var(--primary-red-hero);
padding: 6px 18px;
border-radius: 20px;
font-size: 0.85rem;
font-weight: 600;
letter-spacing: 1px;
font-family: 'Montserrat', sans-serif;
border: 1px solid rgba(230, 0, 0, 0.3);
box-shadow: 0 2px 8px rgba(230, 0, 0, 0.2);
}
.gallery-header {
text-align: center;
margin-bottom: 60px;
position: relative;
}
.gallery-title {
font-family: 'Orbitron', sans-serif;
font-size: 2.5rem;
color: var(--dark-gray-hero);
margin-bottom: 25px;
text-transform: uppercase;
font-weight: 700;
letter-spacing: 1.5px;
position: relative;
display: inline-block;
padding-bottom: 12px;
}
.gallery-title .title-highlight {
color: var(--primary-red-hero);
text-shadow: 0 0 8px rgba(var(--primary-red-rgb), 0.4);
}
.gallery-title::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 75%;
height: 3px;
background: linear-gradient(to right, var(--primary-red-hero), var(--light-red-hero));
border-radius: 2px;
box-shadow: 0 2px 10px rgba(var(--primary-red-rgb), 0.5);
}
.gallery-subtitle {
color: var(--gray-text);
font-size: 1.1rem;
font-weight: 300;
letter-spacing: 0.8px;
max-width: 600px;
margin: 15px auto 0 auto;
}
.content-box {
display: flex;
flex-wrap: wrap;
align-items: flex-start;
gap: 50px;
background: rgba(var(--white-hero), 0.9);
border-radius: 25px;
padding: 50px;
position: relative;
overflow: hidden;
border: 1px solid rgba(var(--primary-red-rgb), 0.25);
box-shadow: 0 10px 35px rgba(var(--darker-bg-rgb), 0.1), 0 0 20px rgba(var(--primary-red-rgb), 0.1);
z-index: 10;
}
.content-box::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: radial-gradient(circle at 50% 0%, rgba(230, 0, 0, 0.18) 0%, transparent 70%);
z-index: -1;
}
.content-box::after {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 50%;
height: 1px;
background: linear-gradient(90deg, transparent, var(--primary-red-hero), transparent);
animation: borderFlow 4s linear infinite;
z-index: 1;
box-shadow: 0 0 5px var(--primary-red-hero);
}
.gallery-left { flex: 1; min-width: 300px; position: relative; }
.gallery-right { flex: 1; min-width: 300px; display: flex; flex-direction: column; }
.main-image-container {
position: relative;
width: 100%;
aspect-ratio: 1 / 1;
border-radius: 15px;
overflow: hidden;
background: var(--light-gray-hero);
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 20px;
box-shadow: 0 5px 15px rgba(var(--darker-bg-rgb), 0.1);
border: 1px solid #ddd;
}
.main-image {
display: block;
max-width: 90%;
max-height: 90%;
object-fit: contain;
transition: opacity 0.3s ease;
border-radius: 15px !important;
}
.viewer-360 {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--white-hero);
border-radius: 15px;
overflow: hidden;
transition: opacity 0.3s ease;
}
.viewer-360 iframe {
width: 100%;
height: 100%;
border: none;
}
.viewer-360-tag {
position: absolute;
top: 15px;
right: 15px;
background-color: rgba(230, 0, 0, 0.7);
color: var(--white-hero);
padding: 6px 12px;
border-radius: 5px;
font-size: 0.85rem;
font-weight: 600;
z-index: 10;
font-family: 'Orbitron', sans-serif;
letter-spacing: 0.5px;
box-shadow: 0 2px 5px rgba(0,0,0,0.3);
}
.thumbnails-container {
display: flex;
gap: 10px;
justify-content: center;
flex-wrap: wrap;
margin-top: 25px;
}
.thumbnail {
width: 80px;
height: 80px;
border-radius: 12px;
overflow: hidden;
cursor: pointer;
border: 1px solid #ccc;
background-color: var(--white-hero);
transition: all 0.3s ease, border-color 0.2s ease;
padding: 4px;
position: relative;
box-shadow: 0 3px 10px rgba(var(--darker-bg-rgb), 0.1);
}
.thumbnail.active {
border-color: var(--primary-red-hero);
transform: translateY(-5px) scale(1.05);
box-shadow: 0 5px 15px rgba(var(--darker-bg-rgb), 0.15), 0 0 10px rgba(var(--primary-red-rgb), 0.3);
}
.thumbnail:hover {
border-color: var(--primary-red-hero);
transform: translateY(-5px) scale(1.05);
box-shadow: 0 5px 15px rgba(var(--darker-bg-rgb), 0.15), 0 0 10px rgba(var(--primary-red-rgb), 0.3);
}
.thumbnail::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 0;
height: 2px;
background-color: var(--primary-red-hero);
transition: width 0.3s ease;
box-shadow: 0 0 5px var(--primary-red-hero);
}
.thumbnail:hover::after, .thumbnail.active::after { width: 100%; }
.thumbnail img {
width: 90%;
height: 90%;
object-fit: contain;
margin: 0 auto;
display: block;
border-radius: 8px !important;
}
.product-info-title {
color: var(--primary-red-hero);
margin-bottom: 18px;
font-size: 1.9rem;
border-bottom: 1px solid rgba(var(--primary-red-rgb), 0.4);
padding-bottom: 12px;
letter-spacing: 1px;
text-shadow: 0 0 8px rgba(var(--primary-red-rgb), 0.4);
text-align: center;
width: fit-content;
margin-left: auto;
margin-right: auto;
}
.product-description {
text-align: center;
color: var(--gray-text);
margin-bottom: 30px;
font-size: 1.1rem;
line-height: 1.75;
font-weight: 300;
}
.features-list { list-style: none; padding: 0; margin: 0; color: var(--light-text); }
.features-list li { margin-bottom: 20px; text-align: center; font-size: 1.05rem; font-weight: 400; }
.features-list i {
color: var(--primary-red-hero);
margin: 0 auto 10px auto;
width: auto;
display: block;
font-size: 1.5rem;
text-shadow: 0 0 10px rgba(var(--primary-red-rgb), 0.5);
text-align: center;
transition: color 0.3s ease, text-shadow 0.3s ease, transform 0.3s ease;
}
.features-list li:hover i { transform: scale(1.1); color: var(--light-red-hero); text-shadow: 0 0 12px rgba(var(--neon-red-rgb), 0.7); }
.loading-spinner { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 50px; height: 50px; display: none; z-index: 2; }
.loading-spinner::before {
content: '';
box-sizing: border-box;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 50%;
border: 3px solid transparent;
border-top-color: var(--primary-red-hero);
animation: spinner 0.6s linear infinite;
box-shadow: 0 0 15px var(--primary-red-hero);
}
@keyframes spinner { to {transform: rotate(360deg);} }
@media (max-width: 992px) {
.gallery-section .content-box { padding: 20px; }
.gallery-section .gallery-title { font-size: 2rem; }
}
@media (max-width: 768px) {
.gallery-section { padding: 60px 2.5px; margin-left: 2.5px; margin-right: 2.5px;}
.gallery-section .gallery-title { font-size: 1.8rem; }
.gallery-section .gallery-subtitle { font-size: 1rem; max-width: 90%; }
.gallery-section .content-box { flex-direction: column; padding: 30px; gap: 30px; }
.gallery-section .gallery-left, .gallery-section .gallery-right { min-width: 100%; padding: 20px; }
.gallery-section .thumbnail { width: 65px; height: 65px; }
.gallery-section .product-info-title { font-size: 1.6rem; }
.gallery-section .product-description { font-size: 1rem; }
.gallery-section .features-list li { font-size: 1rem; }
}
@media (max-width: 576px) {
.gallery-section { padding: 60px 2.5px; margin-left: 2.5px; margin-right: 2.5px;}
.gallery-section .gallery-title { font-size: 1.5rem; }
.gallery-section .content-box { padding: 15px; }
.gallery-section .thumbnail { width: 50px; height: 50px; }
.gallery-section .product-info-title { font-size: 1.4rem; }
.gallery-section .product-description { font-size: 0.95rem; }
.gallery-section .features-list li { font-size: 0.95rem; }
.gallery-section .gallery-right { padding: 15px; }
}
/* --- Software Showcase Section Styles --- */
.software-showcase-container {
margin: 20px;
padding: 1px;
border-radius: 25px;
opacity: 0;
transform: translateY(40px);
transition: opacity 0.7s ease-out, transform 0.7s ease-out;
overflow: hidden;
border: 1px solid #ddd;
}
.software-showcase-container.visible {
opacity: 1;
transform: translateY(0);
}
.page-title-section {
text-align: center;
padding: 50px 20px 20px;
opacity: 0;
transform: translateY(40px);
transition: opacity 0.7s ease-out, transform 0.7s ease-out;
}
.page-title-section.visible {
opacity: 1;
transform: translateY(0);
}
.page-title-section h1 {
font-family: 'Orbitron', sans-serif;
font-size: 2.8rem;
color: var(--dark-gray-hero);
margin-bottom: 25px;
text-transform: uppercase;
font-weight: 700;
letter-spacing: 1.5px;
position: relative;
display: inline-block;
padding-bottom: 12px;
}
.page-title-section h1::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 75%;
height: 3px;
background: linear-gradient(to right, var(--primary-red-hero), var(--light-red-hero));
border-radius: 2px;
box-shadow: 0 2px 10px rgba(var(--primary-red-rgb), 0.5);
}
.page-title-section p {
font-size: 1.15rem;
color: var(--gray-text);
max-width: 750px;
margin: 0 auto;
}
.software-feature-section {
display: flex;
align-items: center;
justify-content: center;
padding: 40px 40px;
position: relative;
}
.software-feature-section:not(:last-child) {
border-bottom: 1px solid #eee;
}
.feature-content-wrapper {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 50px;
align-items: center;
max-width: 1200px;
width: 100%;
opacity: 0;
transform: translateY(40px);
transition: opacity 0.7s ease-out, transform 0.7s ease-out;
}
.software-feature-section.visible .feature-content-wrapper {
opacity: 1;
transform: translateY(0);
}
.software-feature-section:nth-of-type(even) .feature-content-wrapper .feature-text {
order: 1;
padding-left: 30px;
padding-right: 0;
}
.software-feature-section:nth-of-type(even) .feature-content-wrapper .feature-image-container {
order: -1;
}
.software-feature-section:nth-of-type(odd) .feature-content-wrapper .feature-text {
padding-right: 30px;
padding-left: 0;
}
.feature-text h2 {
font-size: 2.2rem;
color: var(--dark-gray-hero);
margin-bottom: 20px;
text-shadow: none;
font-weight: 600;
letter-spacing: 1px;
}
.feature-text h2 i {
color: var(--primary-red-hero);
font-size: 2rem;
margin-right: 10px;
vertical-align: middle;
}
.feature-text p {
font-size: 1.05rem;
color: var(--gray-text);
margin-bottom: 15px;
line-height: 1.75;
}
.feature-text ul {
list-style: none;
padding-left: 0;
}
.feature-text ul li {
font-size: 0.95rem;
color: var(--gray-text);
margin-bottom: 8px;
padding-left: 25px;
position: relative;
}
.feature-text ul li::before {
content: "f058";
font-family: "Font Awesome 6 Free";
font-weight: 900;
color: var(--light-red-hero);
position: absolute;
left: 0;
top: 1px;
}
.feature-image-container {
border-radius: 12px;
overflow: hidden;
box-shadow: 0 8px 25px rgba(var(--darker-bg-rgb), 0.15), 0 0 15px rgba(var(--neon-red-rgb),0.1);
border: 1px solid #ddd;
}
.feature-image-container img {
width: 100%;
height: auto;
display: block;
aspect-ratio: 16/10;
object-fit: cover;
}
@media (max-width: 992px) {
.feature-content-wrapper,
.software-feature-section:nth-of-type(even) .feature-content-wrapper {
grid-template-columns: 1fr;
gap: 35px;
}
.software-feature-section:nth-of-type(even) .feature-content-wrapper .feature-text,
.software-feature-section:nth-of-type(odd) .feature-content-wrapper .feature-text {
order: 0;
padding-left: 0;
padding-right: 0;
text-align: center;
}
.feature-text ul {
display: inline-block;
text-align: left;
}
.feature-text h2 {
font-size: 2.2rem;
}
.feature-image-container {
margin-top: 25px;
max-width: 500px;
margin-left: auto;
margin-right: auto;
}
.page-title-section h1 { font-size: 2.5rem; }
.page-title-section p { font-size: 1.1rem; }
}
@media (max-width: 768px) {
.software-showcase-container { margin-left: 2.5px; margin-right: 2.5px; }
.software-feature-section { padding: 40px 2.5px; min-height: auto; }
.feature-text h2 { font-size: 1.9rem; }
.feature-text h2 i { font-size: 1.8rem; }
.feature-text p { font-size: 0.95rem; }
.feature-text ul li { font-size: 0.9rem; }
.page-title-section h1 { font-size: 2.2rem; }
.page-title-section p { font-size: 1rem; }
}
@media (max-width: 576px) {
.software-showcase-container { margin-left: 2.5px; margin-right: 2.5px; }
.software-feature-section { padding: 40px 2.5px; }
}
/* --- Focused Features Section Styles (Orijinal Tasarım) --- */
.focused-features-section#focused-features { /* ID ile daha spesifik hale getirildi */
min-height: auto;
display: flex;
align-items: center;
justify-content: center;
position: relative;
overflow: hidden;
padding: 70px 20px;
border-radius: 25px;
margin: 20px;
color: var(--dark-gray-hero);
border: 1px solid #ddd;
opacity: 0;
transform: translateY(40px);
transition: opacity 0.7s ease-out, transform 0.7s ease-out;
}
.focused-features-section#focused-features.visible {
opacity: 1;
transform: translateY(0);
}
.focused-features-section#focused-features::before {
content: '';
position: absolute;
top: -80px;
left: 50%;
transform: translateX(-50%);
width: 500px;
height: 300px;
background: radial-gradient(ellipse, rgba(var(--neon-red-rgb, 255, 51, 51), 0.15) 0%, transparent 70%);
filter: blur(25px);
opacity: 0.8;
z-index: 0;
animation: pulseSubtle 7s ease-in-out infinite alternate;
}
@keyframes pulseSubtle {
0% { opacity: 0.6; transform: translateX(-50%) scale(1); }
100% { opacity: 0.9; transform: translateX(-50%) scale(1.05); }
}
.focused-features-section#focused-features .focused-features-container {
max-width: 1300px;
width: 100%;
z-index: 5;
position: relative;
padding: 0 15px;
}
.focused-features-section#focused-features .focused-features-header { text-align: center; margin-bottom: 50px; position: relative; }
.focused-features-section#focused-features .focused-features-title {
font-family: 'Orbitron', sans-serif;
font-size: 2.8rem;
color: var(--dark-gray-hero);
margin-bottom: 25px;
text-transform: uppercase;
font-weight: 700;
letter-spacing: 1.5px;
position: relative;
display: inline-block;
padding-bottom: 12px;
}
.focused-features-section#focused-features .focused-features-title .title-highlight {
color: var(--primary-red-hero);
text-shadow: 0 0 8px rgba(var(--primary-red-rgb), 0.4);
}
.focused-features-section#focused-features .focused-features-title::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 75%;
height: 3px;
background: linear-gradient(to right, var(--primary-red-hero), var(--light-red-hero));
border-radius: 2px;
box-shadow: 0 2px 10px rgba(var(--primary-red-rgb), 0.5);
}
.focused-features-section#focused-features .focused-features-subtitle {
color: var(--gray-text);
font-size: 1.05rem;
font-weight: 300;
letter-spacing: 0.6px;
max-width: 750px;
margin: 15px auto 0 auto;
}
.focused-features-section#focused-features .focused-features-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
gap: 25px;
}
.focused-features-section#focused-features .focused-feature-card {
background: var(--white-hero);
border-radius: 18px;
padding: 25px 20px;
text-align: center;
border: 1px solid #ddd;
box-shadow: 0 6px 20px rgba(var(--darker-bg-rgb), 0.1), 0 0 10px rgba(var(--neon-red-rgb), 0.05);
transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
position: relative;
overflow: hidden;
display: flex;
flex-direction: column;
}
.focused-features-section#focused-features .focused-feature-card:hover {
transform: translateY(-8px);
box-shadow: 0 10px 30px rgba(var(--darker-bg-rgb), 0.15), 0 0 20px rgba(var(--neon-red-rgb), 0.15);
border-color: rgba(var(--neon-red-rgb), 0.4);
}
.focused-features-section#focused-features .focused-feature-card::before {
content: "";
position: absolute;
top: 0;
left: -80%;
width: 60%;
height: 100%;
background: linear-gradient(to right, transparent 0%, rgba(255,255,255,0.08) 50%, transparent 100%);
transform: skewX(-20deg);
transition: left 0.7s cubic-bezier(0.23, 1, 0.32, 1);
z-index: 1;
}
.focused-features-section#focused-features .focused-feature-card:hover::before { left: 120%; }
.focused-features-section#focused-features .focused-feature-card-icon { margin-bottom: 15px; z-index: 2; position: relative; }
.focused-features-section#focused-features .focused-feature-card-icon i {
font-size: 2.5rem;
color: var(--light-red-hero);
background: rgba(255, 51, 51, 0.08);
width: 70px;
height: 70px;
line-height: 70px;
border-radius: 50%;
border: 1px solid rgba(255, 51, 51, 0.3);
display: inline-block;
transition: all 0.3s ease;
text-shadow: 0 0 10px rgba(255, 51, 51, 0.6);
}
.focused-features-section#focused-features .focused-feature-card:hover .focused-feature-card-icon i {
background: var(--light-red-hero);
color: var(--white-hero);
transform: scale(1.08) rotate(5deg);
box-shadow: 0 0 20px var(--light-red-hero);
}
.focused-features-section#focused-features .focused-feature-card-title {
font-family: 'Orbitron', sans-serif;
font-size: 1.35rem;
color: var(--light-text);
margin-bottom: 10px;
font-weight: 600;
z-index: 2;
position: relative;
}
.focused-features-section#focused-features .focused-feature-card-description {
font-size: 0.85rem;
color: var(--gray-text);
line-height: 1.6;
min-height: 50px;
z-index: 2;
position: relative;
flex-grow: 1;
}
@media (max-width: 1200px) { .focused-features-section#focused-features .focused-features-grid { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); } }
@media (max-width: 992px) {
.focused-features-section#focused-features .focused-features-title { font-size: 2.2rem; }
.focused-features-section#focused-features .focused-features-grid { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 20px; }
.focused-features-section#focused-features .focused-feature-card { padding: 20px 15px; }
}
@media (max-width: 768px) {
.focused-features-section#focused-features { padding: 60px 2.5px; margin-left: 2.5px; margin-right: 2.5px;}
.focused-features-section#focused-features .focused-features-title { font-size: 2rem; }
.focused-features-section#focused-features .focused-features-subtitle { font-size: 1rem; }
.focused-features-section#focused-features .focused-features-grid { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 20px; }
.focused-features-section#focused-features .focused-feature-card-icon i { font-size: 2.2rem; width: 65px; height: 65px; line-height: 65px;}
.focused-features-section#focused-features .focused-feature-card-title { font-size: 1.25rem; }
}
@media (max-width: 576px) {
.focused-features-section#focused-features { padding: 60px 2.5px; margin-left: 2.5px; margin-right: 2.5px;}
.focused-features-section#focused-features .focused-features-grid { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.focused-features-section#focused-features .focused-features-title { font-size: 1.8rem; }
.focused-features-section#focused-features .focused-feature-card-icon i { font-size: 2rem; width: 60px; height: 60px; line-height: 60px;}
.focused-features-section#focused-features .focused-feature-card-title { font-size: 1.15rem; }
.focused-features-section#focused-features .focused-feature-card-description { font-size: 0.8rem; min-height: 40px;}
}
/* --- Teknik Özellikler (Ağaç Yapısı) Bölümü Stilleri --- */
.focused-features-section#technical-specifications-tree {
padding: 70px 20px;
margin: 20px;
border-radius: 25px;
border: 1px solid #e0e0e0;
background: linear-gradient(135deg, #f5f7fa 0%, #e0e5ec 100%);
opacity: 0;
transform: translateY(40px);
transition: opacity 0.7s ease-out, transform 0.7s ease-out;
position: relative;
overflow: hidden;
min-height: 800px;
}
.focused-features-section#technical-specifications-tree.visible {
opacity: 1;
transform: translateY(0);
}
.focused-features-section#technical-specifications-tree .feature-tree-header {
text-align: center;
margin-bottom: 70px;
position: relative;
z-index: 25;
transform: translateZ(0);
}
.focused-features-section#technical-specifications-tree .feature-tree-title {
font-family: 'Orbitron', sans-serif;
font-size: 2.8rem;
color: var(--dark-gray-hero);
margin-bottom: 15px;
text-transform: uppercase;
letter-spacing: 1px;
text-shadow: 1px 1px 2px rgba(0,0,0,0.1);
}
.focused-features-section#technical-specifications-tree .feature-tree-title .title-highlight {
color: var(--primary-red-hero);
text-shadow: 0 0 10px rgba(var(--primary-red-rgb),0.5);
}
.focused-features-section#technical-specifications-tree .feature-tree-subtitle {
font-size: 1.1rem;
color: var(--gray-text);
max-width: 650px;
margin: 0 auto;
font-weight: 300;
}
.focused-features-section#technical-specifications-tree .feature-tree-container {
position: relative;
z-index: 1;
transform: translateZ(0);
width: 100%;
max-width: 850px;
height: 760px;
margin: 120px auto 0 auto;
display: flex;
justify-content: center;
align-items: center;
}
.focused-features-section#technical-specifications-tree .feature-lines-svg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
pointer-events: none;
}
.focused-features-section#technical-specifications-tree .feature-lines-svg line {
stroke: var(--primary-red-hero);
stroke-width: 2.5px;
stroke-linecap: round;
opacity: 0;
transition: opacity 0.5s ease;
}
.focused-features-section#technical-specifications-tree.visible .feature-lines-svg line {
opacity: 0.85;
}
.focused-features-section#technical-specifications-tree .feature-gallery-centerpiece {
position: relative;
z-index: 10;
display: flex;
flex-direction: column;
align-items: center;
}
.focused-features-section#technical-specifications-tree .feature-main-image-container {
width: 320px;
height: 320px;
aspect-ratio: 1/1;
border-radius: 20px;
overflow: hidden;
background: var(--light-gray-hero);
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 20px;
box-shadow: 0 15px 35px rgba(var(--darker-bg-rgb), 0.25),
0 0 0 10px rgba(var(--white-hero),0.3);
border: 1px solid #ccc;
transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.focused-features-section#technical-specifications-tree .feature-main-image-container:hover {
transform: scale(1.08);
}
.focused-features-section#technical-specifications-tree .feature-main-image-container .main-image {
display: block;
max-width: 90%;
max-height: 90%;
object-fit: contain;
transition: opacity 0.3s ease;
border-radius: 15px !important;
}
.focused-features-section#technical-specifications-tree .feature-thumbnails-container {
display: flex;
gap: 10px;
justify-content: center;
flex-wrap: wrap;
margin-top: 10px;
}
.focused-features-section#technical-specifications-tree .feature-thumbnail {
width: 70px;
height: 70px;
border-radius: 10px;
overflow: hidden;
cursor: pointer;
border: 1px solid #ccc;
background-color: var(--white-hero);
transition: all 0.3s ease;
padding: 4px;
position: relative;
box-shadow: 0 2px 8px rgba(var(--darker-bg-rgb), 0.1);
}
.focused-features-section#technical-specifications-tree .feature-thumbnail.active {
border-color: var(--primary-red-hero);
transform: translateY(-3px) scale(1.05);
box-shadow: 0 4px 12px rgba(var(--darker-bg-rgb), 0.15), 0 0 8px rgba(var(--primary-red-rgb), 0.3);
}
.focused-features-section#technical-specifications-tree .feature-thumbnail:hover {
border-color: var(--primary-red-hero);
transform: translateY(-3px) scale(1.05);
}
.focused-features-section#technical-specifications-tree .feature-thumbnail img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
border-radius: 6px !important;
}
.focused-features-section#technical-specifications-tree .feature-branch {
position: absolute;
background: var(--white-hero);
padding: 15px 18px;
border-radius: 10px;
box-shadow: 0 5px 15px rgba(var(--darker-bg-rgb), 0.1);
border: 1px solid #d8dde4;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
gap: 8px;
min-width: 200px;
transition: all 0.35s ease-in-out;
z-index: 5;
opacity: 0;
transform-origin: center center;
}
.focused-features-section#technical-specifications-tree.visible .feature-branch {
opacity: 1;
}
.focused-features-section#technical-specifications-tree.visible .branch-1 {
animation: popInBranch 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
animation-delay: 0.27s;
}
.focused-features-section#technical-specifications-tree.visible .branch-2 {
animation: popInBranch 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
animation-delay: 0.34s;
}
.focused-features-section#technical-specifications-tree.visible .branch-3 {
animation: popInBranch 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
animation-delay: 0.41s;
}
.focused-features-section#technical-specifications-tree.visible .branch-4 {
animation: popInBranch 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
animation-delay: 0.48s;
}
.focused-features-section#technical-specifications-tree.visible .branch-5 {
animation: popInBranch 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
animation-delay: 0.55s;
}
.focused-features-section#technical-specifications-tree.visible .branch-6 {
animation: popInBranch 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
animation-delay: 0.62s;
}
.focused-features-section#technical-specifications-tree.visible .branch-7 {
animation: popInBranch 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
animation-delay: 0.69s;
}
.focused-features-section#technical-specifications-tree.visible .branch-8 {
animation: popInBranch 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
animation-delay: 0.76s;
}
.focused-features-section#technical-specifications-tree.visible .branch-9 {
animation: popInBranch 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
animation-delay: 0.83s;
}
@keyframes popInBranch {
0% { opacity: 0; transform: scale(0.5) translate(-50%, -50%); }
100% { opacity: 1; transform: scale(1) translate(-50%, -50%); }
}
.focused-features-section#technical-specifications-tree .feature-branch:hover {
transform: scale(1.1) translate(-50%, -50%);
box-shadow: 0 8px 25px rgba(var(--primary-red-rgb), 0.2);
border-color: var(--primary-red-hero);
z-index: 20;
}
.focused-features-section#technical-specifications-tree .feature-branch .icon {
margin-bottom: 5px;
}
.focused-features-section#technical-specifications-tree .feature-branch .icon i {
font-size: 1.8rem;
color: var(--primary-red-hero);
transition: transform 0.3s ease;
}
.focused-features-section#technical-specifications-tree .feature-branch:hover .icon i {
transform: scale(1.2);
}
.focused-features-section#technical-specifications-tree .feature-branch .content {
display: flex;
flex-direction: column;
align-items: center;
gap: 4px;
}
.focused-features-section#technical-specifications-tree .feature-branch .content .title {
font-size: 1rem;
font-weight: 600;
color: var(--dark-gray-hero);
}
.focused-features-section#technical-specifications-tree .feature-branch .content .value {
font-size: 0.85rem;
color: var(--gray-text);
}
.focused-features-section#technical-specifications-tree .branch-1 { top: calc(50% - 380px); left: 50%; transform: translate(-50%, -50%);}
.focused-features-section#technical-specifications-tree .branch-2 { top: calc(50% - 380px * 0.766); left: calc(50% + 380px * 0.642); transform: translate(-50%, -50%);}
.focused-features-section#technical-specifications-tree .branch-3 { top: calc(50% - 380px * 0.173); left: calc(50% + 380px * 0.984); transform: translate(-50%, -50%);}
.focused-features-section#technical-specifications-tree .branch-4 { top: calc(50% + 380px * 0.5); left: calc(50% + 380px * 0.866); transform: translate(-50%, -50%);}
.focused-features-section#technical-specifications-tree .branch-5 { top: calc(50% + 380px * 0.939); left: calc(50% + 380px * 0.342); transform: translate(-50%, -50%);}
.focused-features-section#technical-specifications-tree .branch-6 { top: calc(50% + 380px * 0.939); left: calc(50% - 380px * 0.342); transform: translate(-50%, -50%);}
.focused-features-section#technical-specifications-tree .branch-7 { top: calc(50% + 380px * 0.5); left: calc(50% - 380px * 0.866); transform: translate(-50%, -50%);}
.focused-features-section#technical-specifications-tree .branch-8 { top: calc(50% - 380px * 0.173); left: calc(50% - 380px * 0.984); transform: translate(-50%, -50%);}
.focused-features-section#technical-specifications-tree .branch-9 { top: calc(50% - 380px * 0.766); left: calc(50% - 380px * 0.642); transform: translate(-50%, -50%);}
@media (max-width: 992px) {
.focused-features-section#technical-specifications-tree .feature-lines-svg {
display: none;
}
.focused-features-section#technical-specifications-tree { min-height: auto; padding: 50px 20px; }
.focused-features-section#technical-specifications-tree .feature-tree-container {
height: auto;
flex-direction: column;
margin-top: 30px;
max-width: 500px;
}
.focused-features-section#technical-specifications-tree .feature-gallery-centerpiece { margin-bottom: 40px; }
.focused-features-section#technical-specifications-tree .feature-main-image-container { width: 200px; height: 200px; box-shadow: 0 10px 25px rgba(var(--darker-bg-rgb),0.2), 0 0 0 8px rgba(var(--white-hero),0.25); }
.focused-features-section#technical-specifications-tree .feature-thumbnail { width: 60px; height: 60px;}
.focused-features-section#technical-specifications-tree .feature-branch {
position: relative;
left: auto; top: auto;
transform: none !important;
margin: 0 0 15px 0;
width: 100%;
opacity: 1 !important;
animation-name: none !important;
animation-duration: 0s !important;
animation-timing-function: ease !important;
animation-delay: 0s !important;
animation-iteration-count: 1 !important;
animation-direction: normal !important;
animation-fill-mode: none !important;
}
.focused-features-section#technical-specifications-tree.visible .feature-branch {
animation: none !important;
opacity: 1 !important;
}
.focused-features-section#technical-specifications-tree .feature-tree-title { font-size: 2.2rem; }
.focused-features-section#technical-specifications-tree .feature-tree-subtitle { font-size: 1rem; }
}
@media (max-width: 480px) {
.focused-features-section#technical-specifications-tree { padding: 40px 2.5px; margin:15px 2.5px; }
.focused-features-section#technical-specifications-tree .feature-tree-header { margin-bottom: 40px; }
.focused-features-section#technical-specifications-tree .feature-tree-title { font-size: 1.9rem !important; }
.focused-features-section#technical-specifications-tree .feature-tree-subtitle { font-size: 0.9rem !important; }
.focused-features-section#technical-specifications-tree .feature-main-image-container { width: 160px; height: 160px; }
.focused-features-section#technical-specifications-tree .feature-thumbnail { width: 50px; height: 50px;}
.focused-features-section#technical-specifications-tree .feature-branch { padding: 10px 15px; gap: 10px; }
.focused-features-section#technical-specifications-tree .feature-branch .icon i { font-size: 1.3rem; }
.focused-features-section#technical-specifications-tree .feature-branch .content .title { font-size: 0.9rem; }
.focused-features-section#technical-specifications-tree .feature-branch .content .value { font-size: 0.8rem; }
}
/* --- Yeni Merak Edilenler (FAQ) Bölümü --- */
.faq-section {
min-height: auto;
display: flex;
align-items: center;
justify-content: center;
position: relative;
overflow: hidden;
padding: 80px 20px;
border-radius: 25px;
margin: 20px;
color: var(--dark-gray-hero);
border: 1px solid #ddd;
background-color: rgba(230, 0, 0, 0.02);
opacity: 0;
transform: translateY(40px);
transition: opacity 0.7s ease-out, transform 0.7s ease-out;
}
.faq-section.visible {
opacity: 1;
transform: translateY(0);
}
.faq-container {
max-width: 1000px;
width: 100%;
z-index: 5;
position: relative;
}
.faq-header {
text-align: center;
margin-bottom: 50px;
position: relative;
}
.faq-title {
font-family: 'Orbitron', sans-serif;
font-size: 2.8rem;
color: var(--dark-gray-hero);
margin-bottom: 25px;
text-transform: uppercase;
font-weight: 700;
letter-spacing: 1.5px;
position: relative;
display: inline-block;
padding-bottom: 12px;
}
.faq-title .title-highlight {
color: var(--primary-red-hero);
text-shadow: 0 0 8px rgba(var(--primary-red-rgb), 0.4);
}
.faq-title::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 75%;
height: 3px;
background: linear-gradient(to right, var(--primary-red-hero), var(--light-red-hero));
border-radius: 2px;
box-shadow: 0 2px 10px rgba(var(--primary-red-rgb), 0.5);
}
.faq-subtitle {
color: var(--gray-text);
font-size: 1.1rem;
font-weight: 300;
letter-spacing: 0.6px;
max-width: 750px;
margin: 15px auto 0 auto;
}
.faq-accordion {
display: flex;
flex-direction: column;
gap: 15px;
margin-top: 20px;
}
.faq-item {
border: 1px solid #e0e0e0;
border-radius: 12px;
overflow: hidden;
background-color: var(--white-hero);
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
transition: all 0.3s ease;
}
.faq-item:hover {
box-shadow: 0 6px 15px rgba(var(--primary-red-rgb), 0.1);
border-color: rgba(var(--primary-red-rgb), 0.3);
}
.faq-question {
padding: 20px;
display: flex;
justify-content: space-between;
align-items: center;
cursor: pointer;
font-weight: 600;
font-size: 1.1rem;
color: var(--dark-gray-hero);
transition: all 0.3s ease;
}
.faq-question:hover {
color: var(--primary-red-hero);
}
.faq-question i {
color: var(--primary-red-hero);
font-size: 1.2rem;
transition: transform 0.3s ease;
}
.faq-answer {
max-height: 0;
overflow: hidden;
transition: max-height 0.4s ease;
padding: 0 20px;
color: var(--gray-text);
font-size: 1rem;
line-height: 1.7;
}
.faq-item.active .faq-question {
color: var(--primary-red-hero);
border-bottom: 1px solid rgba(var(--primary-red-rgb), 0.2);
}
.faq-item.active .faq-question i {
transform: rotate(180deg);
}
.faq-item.active .faq-answer {
max-height: 500px;
padding-top: 15px;
padding-bottom: 20px;
}
.contact-info {
text-align: center;
margin-top: 50px;
padding: 25px 20px;
background: linear-gradient(135deg, rgba(var(--primary-red-rgb), 0.05), rgba(var(--primary-red-rgb), 0.1));
border-radius: 15px;
border: 1px solid rgba(var(--primary-red-rgb), 0.25);
box-shadow: 0 5px 15px rgba(var(--primary-red-rgb), 0.1);
display: flex;
flex-direction: column;
align-items: center;
gap: 15px;
}
.contact-info p {
font-size: 1.15rem;
color: var(--dark-gray-hero);
margin-bottom: 0;
}
.contact-info .contact-links {
display: flex;
gap: 15px;
flex-wrap: wrap;
justify-content: center;
}
.contact-info a {
background: var(--primary-red-hero);
color: var(--white-hero);
padding: 10px 20px;
border-radius: 25px;
text-decoration: none;
font-weight: 600;
font-size: 1rem;
transition: all 0.3s ease;
display: inline-flex;
align-items: center;
box-shadow: 0 4px 10px rgba(var(--primary-red-rgb), 0.3);
margin-left: 0;
}
.contact-info a i {
margin-right: 8px;
font-size: 1.1rem;
}
.contact-info a:hover {
background: var(--light-red-hero);
color: var(--white-hero);
transform: translateY(-3px);
box-shadow: 0 6px 15px rgba(var(--primary-red-rgb), 0.4);
}
@media (max-width: 768px) {
.faq-section {
padding: 60px 2.5px; margin-left: 2.5px; margin-right: 2.5px;
}
.faq-title {
font-size: 2rem;
}
.faq-subtitle {
font-size: 1rem;
}
.faq-question {
font-size: 1rem;
padding: 15px;
}
.faq-answer {
font-size: 0.9rem;
padding: 0 15px;
}
.faq-item.active .faq-answer {
padding-top: 10px;
padding-bottom: 15px;
}
.contact-info {
padding: 20px 15px;
gap: 12px;
}
.contact-info p {
font-size: 1rem;
}
.contact-info a {
padding: 8px 15px;
font-size: 0.9rem;
}
.contact-info a i {
font-size: 1rem;
}
}
@media (max-width: 576px) {
.faq-section { padding: 60px 2.5px; margin-left: 2.5px; margin-right: 2.5px;}
}
EASYDIAG 3.0
Yeni Nesil Profesyonel Arıza Tespit Cihazı
Kablosuz Bağlantı
Çoklu Marka Desteği
Hızlı Teşhis
Satın Al
SATIN AL
Launch EasyDiag 3.0: Teknik Özellikler
Launch EasyDiag 3.0, araç elektroniği için kapsamlı teşhis ve özel fonksiyonlar sunan Bluetooth adaptörüdür.
360°





Öne Çıkan Özellikler
Launch EasyDiag 3.0, aracınızın elektronik sistemlerine tam erişim sağlayan, profesyonel düzeyde bir arıza tespit cihazıdır. Geniş marka desteği ve kullanıcı dostu arayüzü ile öne çıkar.
- Kapsamlı Arıza Kodu Okuma/Silme
- Canlı Veri Görüntüleme (Grafiksel/Metinsel)
- Servis ve Bakım Sıfırlama İşlemleri
- Adaptasyon ve Kodlama Fonksiyonları
Launch XDiag Yazılım Arayüzü
Kapsamlı teşhis ve profesyonel bakım fonksiyonlarını kullanıcı dostu bir arayüzle keşfedin.
Kullanıcı Dostu XDiag Arayüzü
Launch XDiag yazılımı, karmaşık araç teşhis işlemlerini herkes için erişilebilir kılan, modern, sezgisel ve kullanıcı dostu bir arayüze sahiptir. Ana menü üzerinden tüm modüllere ve fonksiyonlara kolayca ulaşabilirsiniz.
- Net ve anlaşılır menü navigasyonu
- Dokunmatik ekranlar için optimize edilmiş büyük butonlar ve simgeler
- Hızlı erişim için mantıksal olarak gruplandırılmış fonksiyonlar
- Görsel ve metinsel yardım rehberleri

Özel Fonksiyonlar ve Servis İşlemleri
Yetkili servis düzeyinde birçok özel fonksiyonu XDiag yazılımı ile kolayca gerçekleştirin. Bakım ve onarım işlemlerinizi profesyonelce tamamlayın.
- Servis ve yağ sıfırlama
- Elektronik Park Freni (EPB) çektirme/bırakma
- DPF (Dizel Partikül Filtresi) rejenerasyonu
- Enjektör kodlama ve adaptasyonlar

Otomatik Araç Tanıma ve Raporlama
XDiag, VIN (Şasi Numarası) üzerinden aracınızı otomatik olarak tanır ve doğru sistemlere hızla erişmenizi sağlar. Kapsamlı teşhis raporları oluşturarak müşterilerinize veya kendi kayıtlarınıza ekleyebilirsiniz.
- Hızlı ve doğru araç tespiti
- Tam sistem tarama raporu
- PDF formatında rapor kaydetme ve paylaşma

Öne Çıkan Yetenekler
Launch EasyDiag 3.0, temel arıza tespitinden profesyonel bakım işlemlerine kadar geniş bir yelpazede size güç katar.
Hata Kodu Yönetimi
Tüm modüllerden DTC okuma, yorumlama ve silme.
Akıllı VIN Tanıma
Şase numarası ile otomatik araç tespiti.
Canlı Veri Akışı
Sensör verilerini grafiksel ve metinsel izleme.
Derinlemesine Analiz
Arızaların kök nedenine hızlı ve doğru ulaşım.
Evrensel Uyumluluk
Geniş marka/model desteği (Avrupa, Asya, Amerika).
Sezgisel Kullanım
Kolay anlaşılır arayüz ile basit operasyonlar.
Enjektör Kodlama
Yakıt enjektörlerinin hassas ayarlarını yapın.
EPB Yönetimi
Elektronik Park Freni servis modu işlemleri.
Servis Sıfırlama
Yağ ve bakım periyotlarını kolayca sıfırlayın.
DPF Rejenerasyonu
Dizel partikül filtresini temizleyerek performansı artırın.
İmmobilizer Eşleştirme
Anahtar programlama ve güvenlik fonksiyonları.
Adaptasyon & Kalibrasyon
Değişen parçaların sisteme doğru tanıtılması.
Teknik Özellikler
Launch EasyDiag 3.0 ile birlikte sunulan tabletin temel donanım özelliklerine göz atın.




İşletim Sistemi
Android 11
İşlemci
MTK 8168 Quad Core
Ram Bellek
6GB
Depolama
128GB Dahili
Ekran
10.1 IPS
Çözünürlük
800*1280px
Kamera
20MP Ön & 5.0MP Arka + Flaş
Bağlantı
Wifi 5.0 GHz, Bluetooth 5.0
Batarya & Ekstra
3.7V 5000mAh, Micro SD, Kılıf
Merak Edilenler
Launch EasyDiag 3.0 hakkında en çok sorulan sorular ve cevapları.
Launch EasyDiag 3.0'ı satın aldığımda kutudan neler çıkacak, ekstra bir sürpriz var mı?
Launch EasyDiag 3.0 paketiniz özenle hazırlanmış olup, içerisinde şunları bulacaksınız:
- Launch EasyDiag 3.0 Ana Ünite (Bluetooth Adaptörü)
- Cihaz Aktivasyon Bilgileri (Seri Numarası ve Aktivasyon Kodu WhatsApp üzerinden iletilecektir)
- OtoEko'ya Özel Hediye: Launch 3.0 Uzatma Kablosu!
Bu sayede cihazınızı hemen kullanmaya başlayabilir ve uzatma kablosu ile daha esnek bir çalışma alanına sahip olabilirsiniz.
Launch EasyDiag 3.0 cihazı hangi araçlarla uyumludur?
Launch EasyDiag 3.0, 1996 sonrası üretilen ve OBD-II standardını destekleyen hemen hemen tüm araçlarla uyumludur. Avrupa, Asya ve Amerika menşeili 100'den fazla araç markasını destekler. Başlıca desteklenen markalar arasında Volkswagen, Audi, BMW, Mercedes, Toyota, Honda, Hyundai, Ford, Opel, Fiat, Renault ve Peugeot bulunmaktadır.
Cihazın kullanım süresi ne kadardır ve nasıl uzatılır?
Launch EasyDiag 3.0 cihazı satın aldıktan sonra bir (1) yıl boyunca online olarak kullanılabilir. Bu süre sonunda cihaz offline modda kullanılmaya devam edilebilir ancak güncellemeler ve yeni model araç desteği için yenileme yapılması gerekir. Yıllık yenileme bedeli yaklaşık 85 USD'dir ve bu ücretle cihazınızı tam kapasitesi ile kullanmaya devam edebilirsiniz.
XDiag yazılımı hangi cihazlarda çalışır?
Launch XDiag yazılımı Android işletim sistemini desteklemektedir. Optimum performans için Android 5.0 ve üzeri versiyona sahip tablet veya telefon kullanılması önerilir.
Enjektör kodlama ve adaptasyon işlemleri için ek bir yazılım gerekli mi?
Hayır, Launch EasyDiag 3.0 ile enjektör kodlama, adaptasyon ve diğer özel fonksiyonlar için ek bir yazılım gerekmez. Bu işlemler temel XDiag yazılımı içerisinde yer almaktadır. Bazı özel işlemler için markanın "Özel Fonksiyonlar" menüsüne erişim gerekebilir, bu da cihazla birlikte gelen yazılım paketi içinde mevcuttur.
Cihaz kurulumu nasıl yapılır ve aktivasyon için ne gereklidir?
Cihaz kurulumu oldukça basittir. Öncelikle mobil cihazınıza veya tabletinize XDiag yazılımını indirmeniz, ardından cihazınız ile Launch EasyDiag 3.0 arasında Bluetooth bağlantısı kurmanız yeterlidir. Aktivasyon için size özel olarak iletilecek kullanıcı bilgileri (Serial Number ve Aktivasyon Kodu) ile sisteme giriş yaparak cihazınızı kullanmaya başlayabilirsiniz. Kurulum ve aktivasyon konusunda herhangi bir sorun yaşarsanız, teknik destek ekibimiz size yardımcı olacaktır.
Cihaz Türkçe olarak kullanılabilir mi?
Evet, Launch EasyDiag 3.0 yazılımı Türkçe dil desteğine sahiptir. XDiag yazılımını kurduktan sonra Ayarlar menüsünden dil seçeneğini Türkçe olarak değiştirebilirsiniz. Böylece menüler, arıza kodları, açıklamalar ve fonksiyonlar Türkçe olarak görüntülenecektir.
Daha fazla bilgi veya teknik destek için bize ulaşın:
لم يتم طرح أي أسئلة حول هذا المنتج بعد.
كن أول من يسأل!اطرح سؤالاً
لا توجد تقييمات بعد
هل جربت هذا المنتج؟ شارك تجربتك وساعد العملاء الآخرين في اتخاذ القرار الصحيح. سيتم نشر مراجعتك بعد الموافقة.
Türkçe
English
العربية