/* Website template by freewebsitetemplates.com - Modified for OkyanusGida (Full Screen & Professional Gray Theme) */
body {
    background-color: #e2e2e2;
    width: 100%;
    margin: 0;
    padding: 0;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; /* Daha modern bir font ailesi */
}

img {
    display: block;
    border: 0;
}

/** box-shadow **/
.box {
    background-color: #e7e7e7;
    display: inline-block;
    -moz-box-shadow: 0 0 1px 3px rgba(207, 207, 207, 0.6);
    -webkit-box-shadow: 0 0 1px 3px rgba(207, 207, 207, 0.6);
    box-shadow: 0 0 1px 3px rgba(207, 207, 207, 0.6);
    zoom: 1;
}

    .box > img {
        display: block;
        position: relative;
    }

.clearfix {
    width: 100%;
    max-width: 1350px;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 0 20px;
}

    .clearfix:after {
        clear: both;
        content: "";
        display: block;
        line-height: 0;
        height: 1%;
        visibility: hidden;
    }

/*------------ Sprites ------------*/
.more, .subscribe {
    background: url(../images/interface.png) no-repeat;
}

.home, .phone, .mail, .fax, #footnote .connect a {
    background: url(../images/icons.png) no-repeat;
}

.more, .subscribe {
    background-position: -107px 0;
    color: #fff;
    display: inline-block;
    font: 12px/28px Arial, Helvetica, sans-serif;
    height: 28px;
    width: 97px;
    text-align: center;
    text-decoration: none;
    text-shadow: 1px 1px rgba(0, 0, 0, 0.3);
    text-transform: uppercase;
}

    .more:hover {
        background-position: 0 0;
    }

.frame1 {
    background: url(../images/frames.png) no-repeat -117px 0 !important;
    height: 150px;
    width: 203px;
    margin: 0 auto 15px;
    padding: 8px 7px 0;
    text-align: center;
    box-sizing: content-box !important;
}

    .frame1 .box {
        margin-top: 2px;
    }

/*------------ 🛠️ YENİ MODERN GRİ HEADER AYARLARI ------------*/
#header {
    background: #2c3136; /* Eski yeşil resim kaldırıldı, kurumsal premium koyu gri uygulandı */
    padding: 25px 0;
    width: 100%;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15); /* Sayfadan ayrışması için şık bir gölge */
    border-bottom: 3px solid #f39c12; /* B2B turuncusu ile alt çizgi çizgisi çekildi */
}

.logo {
    float: left;
    display: inline-block;
}

    /* Logonun arka planla kontrast oluşturması için hafif koruma */
    .logo img {
        filter: drop-shadow(1px 1px 2px rgba(0,0,0,0.5));
    }

.navigation {
    float: right;
    list-style: none;
    margin: 12px 0 0;
    padding: 0;
    display: flex;
    align-items: center;
}

    .navigation li {
        float: left;
        margin-left: 30px;
        position: relative;
    }

        .navigation li > a {
            color: #cbd5e1; /* Daha soft, göz yormayan modern açık gri menü yazısı */
            font: bold 14px/24px 'Segoe UI', Arial, sans-serif;
            text-decoration: none;
            text-shadow: none; /* Demode gölge kaldırıldı */
            text-transform: uppercase;
            transition: color 0.3s ease; /* Yumuşak renk geçiş efekti */
        }

            /* Fareyle menüye gelince veya aktif sayfadayken */
            .navigation li > a:hover {
                color: #ffffff;
                text-decoration: none; /* Çirkin alt çizgiler temizlendi */
            }

        /* 🚀 ÖZEL B2B BUTON TASARIMI */
        .navigation li.b2b-nav-item {
            margin-left: 40px;
        }

        .navigation li .b2b-btn {
            color: #f39c12 !important; /* Premium Canlı Turuncu */
            font-weight: bold;
            border: 2px solid #f39c12;
            padding: 8px 18px;
            border-radius: 20px; /* Modern oval buton hatları */
            text-decoration: none !important;
            text-shadow: none;
            text-transform: uppercase;
            transition: all 0.3s ease;
            display: inline-block;
        }

            /* B2B Butonuna Hover Efekti */
            .navigation li .b2b-btn:hover {
                background-color: #f39c12;
                color: #2c3136 !important; /* İçindeki yazı koyulaşır */
                box-shadow: 0 0 10px rgba(243, 156, 18, 0.4);
            }

/*------------ CONTENTS ------------*/
#contents {
    padding-bottom: 0;
    width: 100%;
}

    #contents img {
        border: 1px solid rgba(231, 231, 231, 0.8);
    }

h1 {
    color: #3d4536;
    font: bold 29px/30px "Times New Roman", Times, serif;
    margin: 0 0 12px;
    text-transform: uppercase;
}

h2 {
    color: #626262;
    font: 19px/24px "Times New Roman", Times, serif;
    letter-spacing: 2px;
    margin: 0;
    text-transform: uppercase;
}

p {
    color: #626262;
    font: 14px/24px Arial, Helvetica, sans-serif;
    margin: 0 0 24px;
}

/** Adbox **/
#adbox {
    background: url(../images/bg-adbox.png) no-repeat center bottom;
    background-size: cover;
    border-bottom: 1px solid #fff;
    padding: 30px 0;
    width: 100%;
}

    #adbox > div.clearfix {
        background-color: #e9e9e9;
        border: 1px solid #fff;
        position: relative;
        padding: 0;
    }

        #adbox > div.clearfix img {
            float: right;
            max-width: 60%;
            height: auto;
        }

    #adbox .detail {
        font-family: Times, "Times New Roman", serif;
        width: 35%;
        text-align: center;
        position: absolute;
        left: 4%;
        top: 25%;
    }

        #adbox .detail h1 {
            color: #2c3136;
            font-size: 32px;
            font-weight: normal;
            line-height: 44px;
            margin: 0 0 10px;
            text-transform: none;
        }

        #adbox .detail p {
            color: #2c3136;
            font: 24px/36px "Times New Roman", Times, serif;
            margin: 0;
        }

.highlight {
    background: #eee url(../images/bg-highlight.jpg) repeat-x left bottom;
    border-bottom: 1px solid #fff;
    padding: 40px 0;
    width: 100%;
}

    .highlight h1 {
        font-size: 32px;
        line-height: 36px;
        margin-right: 320px;
        text-transform: none;
    }

    .highlight p {
        margin-right: 320px;
    }

.testimonial {
    float: right;
    width: 280px;
    background: #fff url(../images/border.png) repeat-y left top;
    padding: 10px 0 10px 25px;
    box-sizing: border-box;
}

    .testimonial h2 {
        color: #4c5346;
        margin-bottom: 15px;
    }

    .testimonial > span {
        color: #626262;
        display: block;
        font: italic 13px/24px Arial, Helvetica, sans-serif;
        text-align: right;
        margin-top: 10px;
    }

.featured {
    padding: 50px 0;
    width: 100%;
    background-color: #e2e2e2;
}

    .featured h2 {
        color: #4e5647;
        margin-bottom: 35px;
        text-align: center;
    }

    .featured ul {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }

    .featured li {
        width: 23%;
        box-sizing: border-box;
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

        .featured li p b {
            display: block;
            text-transform: uppercase;
            margin-bottom: 5px;
            color: #2c3136;
        }

/*------------ FOOTER ------------*/
#footer {
    background: #d9d9d9 url(../images/bg-footer.png) repeat-x left top;
    border-top: 2px solid #fff;
    padding: 40px 0;
    width: 100%;
}

    #footer .clearfix {
        display: flex;
        justify-content: space-between;
    }

    #footer .section {
        width: 30%;
        border-left: 1px solid #c2c2c2;
        padding: 0 0 0 30px;
        box-sizing: border-box;
    }

        #footer .section:first-child {
            border: 0;
            padding-left: 0;
        }

        #footer .section h4 {
            color: #626262;
            font: bold 13px/24px Arial, Helvetica, sans-serif;
            margin: 0 0 15px;
            text-transform: uppercase;
        }

        #footer .section p {
            font-size: 13px;
            line-height: 22px;
        }

#footnote {
    background: url(../images/bg-footnote.jpg) repeat-x left top;
    border-top: 1px solid #fff;
    padding: 15px 0;
    width: 100%;
}

    #footnote p {
        color: #8fa081;
        font: 12px/24px Arial, Helvetica, sans-serif;
        margin: 0;
        text-align: center;
        text-transform: uppercase;
        letter-spacing: 1px;
    }