/* =====================================================
   THERMOMIXEVI.COM.TR
   STYLE.CSS
===================================================== */

:root{
    --primary:#087940;
    --primary-dark:#087940;
    --text:#222222;
    --text-light:#666666;
    --light:#f8f9fa;
    --white:#ffffff;
}

/* =====================================================
   GENEL
===================================================== */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    font-family:'Poppins',sans-serif;
    color:var(--text);
    background:#fff;
    overflow-x:hidden;
    line-height:1.7;
}

a{
    text-decoration:none;
}

img{
    max-width:100%;
    height:auto;
}

section{
    position:relative;
}

/* =====================================================
   NAVBAR
===================================================== */

/* =====================================================
   NAVBAR LOGO FINAL FIX
===================================================== */

.navbar {
    padding-top: 1px !important;
    padding-bottom: 1px !important;
    min-height: 110px; /* KRİTİK */
    display: flex;
    align-items: center;
}

.navbar .container,
.navbar .container-fluid {
    display: flex;
    align-items: center;
}

.navbar-brand {
    display: flex;
    align-items: center;
    padding: 0 !important;
    margin: 0;
    line-height: 1;
}
.navbar-logo{
    height:100px;
    width:auto;
    object-fit:contain;
}
.navbar-brand img {
    height: 200px !important;   /* GERÇEK ÇÖZÜM */
    max-height: 200px !important;
    width: auto;
    object-fit: contain;
    display: block;
    transition: 0.3s ease;
}

/* Hover */
.navbar-brand:hover img {
    transform: scale(1.06);
    filter: brightness(1.1);
}

/* Desktop navbar item hizalama */
.navbar-collapse {
    align-items: center;
}

/* Mobile */
@media (max-width: 768px) {
    .navbar {
        min-height: 80px;
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }

    .navbar-brand img {
        height: 150px !important;
    }
}

/* =====================================================
   BUTTONS
===================================================== */

.btn-success{
    background:var(--primary);
    border-color:var(--primary);
}

.btn-success:hover{
    background:var(--primary-dark);
    border-color:var(--primary-dark);
}

.hero-btn{
    padding:14px 35px;
    border-radius:14px;
    font-weight:600;
}

/* =====================================================
   HERO
===================================================== */

.hero-section{
    background:linear-gradient(
    180deg,
    #ffffff 0%,
    #f6fbf8 100%);
    padding:100px 0;
}

.hero-badge{

    display:inline-block;

    background:#e8fff1;

    color:var(--primary);

    padding:12px 24px;

    border-radius:50px;

    font-weight:600;

    margin-bottom:25px;
}

.hero-title{

    font-size:4rem;

    font-weight:800;

    line-height:1.1;

    color:var(--text);

    margin-bottom:25px;
}

.hero-title span{

    display:block;

    color:var(--primary);
}

.hero-text{

    font-size:1.15rem;

    color:var(--text-light);

    max-width:550px;

    margin-bottom:35px;
}

.hero-buttons{

    display:flex;

    gap:15px;

    flex-wrap:wrap;

    margin-bottom:40px;
}

.hero-image-wrapper{

    background:#fff;

    padding:40px;

    border-radius:35px;

    box-shadow:
    0 25px 60px rgba(0,0,0,.08);
}

.hero-img{

    max-height:650px;

    animation:float 5s ease-in-out infinite;
}

.hero-stats{

    display:flex;

    gap:20px;

    flex-wrap:wrap;
}

.stat-box{

    background:#fff;

    padding:20px 25px;

    border-radius:20px;

    box-shadow:
    0 10px 30px rgba(0,0,0,.05);

    min-width:150px;
}

.stat-box h3{

    color:var(--primary);

    font-size:2rem;

    font-weight:800;

    margin-bottom:5px;
}

.stat-box span{

    color:var(--text-light);

    font-size:.9rem;
}

@keyframes float{

    0%{
        transform:translateY(0);
    }

    50%{
        transform:translateY(-15px);
    }

    100%{
        transform:translateY(0);
    }

}

/* =====================================================
   ÖZELLİKLER
===================================================== */

.feature-card{

    background:#fff;

    padding:35px;

    border-radius:20px;

    box-shadow:
    0 10px 30px rgba(0,0,0,.08);

    height:100%;

    transition:.3s;
}

.feature-card:hover{

    transform:translateY(-8px);
}

.feature-card h4{

    font-weight:700;

    margin-bottom:15px;

    color:var(--primary);
}

.feature-card p{

    color:var(--text-light);

    margin:0;
}

/* =====================================================
   BAŞLIKLAR
===================================================== */

.section-title{

    font-size:42px;

    font-weight:700;

    margin-bottom:15px;
}

/* =====================================================
   FORM
===================================================== */

.form-control,
.form-select{

    min-height:55px;

    border-radius:12px;
}

textarea.form-control{

    min-height:120px;
}

.form-control:focus,
.form-select:focus{

    border-color:var(--primary);

    box-shadow:
    0 0 0 .25rem rgba(0,166,81,.15);
}

/* =====================================================
   FOOTER
===================================================== */

/* FOOTER */

.footer-section{

    background:#1f2937;

    color:#fff;

    padding:80px 0 30px;
}

.footer-logo{

    font-weight:800;

    margin-bottom:20px;

    color:#00A651;
}

.footer-title{

    margin-bottom:20px;

    font-weight:700;
}

.footer-text{

    color:#cbd5e1;

    line-height:1.8;
}

.footer-contact{

    list-style:none;

    padding:0;
}

.footer-contact li{

    margin-bottom:15px;

    color:#cbd5e1;
}

.footer-contact i{

    color:#00A651;

    width:25px;
}

.social-icons{

    display:flex;

    gap:15px;

    margin-top:20px;
}

.social-icons a{

    width:50px;

    height:50px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:#00A651;

    color:#fff;

    font-size:22px;

    transition:.3s;
}

.social-icons a:hover{

    transform:translateY(-5px);
}

.footer-line{

    margin:40px 0 20px;

    border-color:rgba(255,255,255,.1);
}

.footer-bottom{

    text-align:center;

    color:#94a3b8;
}

/* =====================================================
   WHATSAPP
===================================================== */

.whatsapp-float{

    position:fixed;

    right:20px;

    bottom:20px;

    z-index:9999;

    width:60px;

    height:60px;

    border-radius:50%;

    background:#25D366;

    color:#fff;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:30px;

    box-shadow:
    0 10px 25px rgba(0,0,0,.2);

    transition:.3s;
}

.whatsapp-float:hover{

    transform:scale(1.1);

    color:#fff;
}

/* =====================================================
   RESPONSIVE
===================================================== */

@media(max-width:991px){

    .hero-section{

        text-align:center;
    }

    .hero-text{

        max-width:100%;
    }

    .hero-stats{

        justify-content:center;
    }

    .hero-image-wrapper{

        margin-top:40px;
    }

}

@media(max-width:768px){

    .hero-title{

        font-size:2.6rem;
    }

    .hero-buttons{

        flex-direction:column;
    }

    .hero-btn{

        width:100%;
    }

    .hero-img{

        max-height:350px;
    }

    .section-title{

        font-size:32px;
    }

}

@media(max-width:480px){

    .hero-title{

        font-size:2rem;
    }

    .hero-badge{

        font-size:.85rem;
    }

    .stat-box{

        width:100%;
    }

}
.slider-img{

    height:650px;

    object-fit:cover;

    border-radius:30px;
}

.carousel-caption{

    background:rgba(0,0,0,.55);

    padding:20px;

    border-radius:20px;

    bottom:40px;
}

.carousel-caption h3{

    font-weight:700;
}

.carousel-indicators button{

    width:12px !important;

    height:12px !important;

    border-radius:50%;
}

@media(max-width:768px){

    .slider-img{

        height:300px;
    }

    .carousel-caption{

        position:relative;

        left:auto;

        right:auto;

        bottom:auto;

        margin-top:15px;
    }

}