/* ============================================
   ELMAS KURUYEMİŞ - HAKKIMIZDA STİLLERİ
   ============================================ */

/* About Intro */
.about-intro { background-color: var(--color-light); }
.about-intro__grid { display: grid; grid-template-columns: 1fr; gap: var(--space-2xl); align-items: center; }
.about-intro__content { order: 2; }
.about-intro__title { font-family: var(--font-primary); font-size: clamp(1.75rem, 4vw, 2.25rem); color: var(--color-dark); margin-bottom: var(--space-lg); line-height: 1.3; }
.about-intro__content p { color: var(--color-text-dark); line-height: 1.8; margin-bottom: var(--space-md); }
.about-intro__features { display: grid; grid-template-columns: 1fr; gap: var(--space-sm); margin-top: var(--space-xl); }
.about-intro__feature { display: flex; align-items: center; gap: var(--space-sm); color: var(--color-dark); font-weight: 500; }
.about-intro__feature i { color: var(--color-primary); font-size: 1.25rem; }
.about-intro__image { order: 1; position: relative; }
.about-intro__image-wrapper { background: linear-gradient(135deg, var(--color-dark) 0%, var(--color-dark-soft) 100%); border-radius: var(--radius-lg); padding: var(--space-2xl); display: flex; align-items: center; justify-content: center; aspect-ratio: 4/3; }
.about-intro__image-wrapper img { max-width: 80%; height: auto; }
.about-intro__badge { position: absolute; bottom: -20px; right: 20px; background: var(--gradient-gold); color: var(--color-dark); padding: var(--space-lg); border-radius: var(--radius-lg); text-align: center; box-shadow: var(--shadow-lg); }
.about-intro__badge-number { display: block; font-family: var(--font-primary); font-size: 2.5rem; font-weight: 700; line-height: 1; }
.about-intro__badge-text { font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; }

@media (min-width: 480px) { .about-intro__features { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 768px) { .about-intro__grid { grid-template-columns: 1fr 1fr; gap: var(--space-3xl); } .about-intro__content { order: 1; } .about-intro__image { order: 2; } }

/* Products Showcase */
.products-showcase { position: relative; overflow: hidden; }
.products-showcase__grid { display: grid; grid-template-columns: 1fr; gap: var(--space-lg); }
.showcase-card { 
    background: var(--color-dark-medium); 
    border-radius: var(--radius-lg); 
    padding: var(--space-xl); 
    text-align: center; 
    border: 1px solid var(--color-dark-light); 
    transition: all var(--transition-normal);
    /* Safari render fix */
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    /* Touch feedback */
    -webkit-tap-highlight-color: transparent;
}

/* Masaüstü hover */
@media (hover: hover) {
    .showcase-card:hover { 
        border-color: var(--color-primary); 
        transform: translateY(-5px); 
    }
    .showcase-card:hover .showcase-card__icon { 
        background: var(--gradient-gold); 
        color: var(--color-dark); 
    }
}

/* Touch active */
@media (hover: none) {
    .showcase-card:active { 
        border-color: var(--color-primary); 
        transform: scale(0.98); 
    }
}
.showcase-card__icon { width: 70px; height: 70px; display: flex; align-items: center; justify-content: center; background: rgba(201, 162, 39, 0.15); border: 2px solid var(--color-primary); border-radius: var(--radius-full); margin: 0 auto var(--space-lg); font-size: 1.75rem; color: var(--color-primary); transition: all var(--transition-fast); }
.showcase-card:hover .showcase-card__icon { background: var(--gradient-gold); color: var(--color-dark); }
.showcase-card__title { font-family: var(--font-primary); font-size: 1.25rem; color: var(--color-light); margin-bottom: var(--space-sm); }
.showcase-card__text { color: var(--color-light-soft); font-size: 0.9375rem; line-height: 1.7; margin: 0; }

@media (min-width: 480px) { .products-showcase__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 768px) { .products-showcase__grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1200px) { .products-showcase__grid { grid-template-columns: repeat(5, 1fr); } }

/* Values Section */
.values-section { background-color: var(--color-light); }
.values__grid { display: grid; grid-template-columns: 1fr; gap: var(--space-lg); }
.value-card { 
    background: var(--color-white); 
    border-radius: var(--radius-lg); 
    padding: var(--space-xl); 
    position: relative; 
    box-shadow: var(--shadow-sm); 
    transition: all var(--transition-normal); 
    overflow: hidden;
    /* Safari render fix */
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}
.value-card::before { content: ''; position: absolute; top: 0; left: 0; width: 4px; height: 100%; background: var(--gradient-gold); opacity: 0; transition: opacity var(--transition-fast); }

/* Masaüstü hover */
@media (hover: hover) {
    .value-card:hover::before { opacity: 1; }
    .value-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); }
}

/* Touch cihazlarda before her zaman görünsün */
@media (hover: none) {
    .value-card::before { opacity: 0.5; }
}
.value-card__number { font-family: var(--font-primary); font-size: 3rem; font-weight: 700; color: var(--color-primary); opacity: 0.2; line-height: 1; margin-bottom: var(--space-md); }
.value-card__title { font-family: var(--font-primary); font-size: 1.375rem; color: var(--color-dark); margin-bottom: var(--space-sm); }
.value-card__text { color: var(--color-text-dark); line-height: 1.7; margin: 0; }

@media (min-width: 480px) { .values__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1200px) { .values__grid { grid-template-columns: repeat(4, 1fr); } }

/* CTA Section */
.cta-section { background: var(--gradient-gold); position: relative; overflow: hidden; }
.cta-section::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23000000' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); }
.cta-section__content { position: relative; z-index: 1; text-align: center; }
.cta-section__title { font-family: var(--font-primary); font-size: clamp(1.75rem, 4vw, 2.5rem); color: var(--color-dark); margin-bottom: var(--space-md); }
.cta-section__text { font-size: 1.0625rem; color: var(--color-dark); opacity: 0.85; margin-bottom: var(--space-xl); max-width: 600px; margin-left: auto; margin-right: auto; }
.cta-section__buttons { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-md); }
.cta-section .btn--dark { background: var(--color-dark); border-color: var(--color-dark); }
.cta-section .btn--dark:hover { background: var(--color-dark-soft); }
@media (max-width: 479.98px) { .cta-section__buttons { flex-direction: column; align-items: center; } .cta-section__buttons .btn { width: 100%; max-width: 280px; } }