/* =========================================================================
   ÖZÇAKIRCILAR PEYZAJ — marka uyarlaması
   Bu dosya tema CSS'inden SONRA yüklenir; tema dosyaları değiştirilmemiştir.
   ========================================================================= */

:root {
    --ozc-green: #315347;
    --ozc-dark: #10241d;
    --ozc-darker: #0d1e18;
    --ozc-accent: #fdde77;
    --ozc-leaf: #8bbf4d;
    /* Beyaz zeminde okunabilir bağlantı yeşili (beyaz üzerinde 5.2:1 kontrast) */
    --ozc-green-link: #3a7a4b;
}

/* ---------------------- 0. ÜST MENÜ HOVER RENKLERİ ---------------------- */

/* Tema menü hover/aktif rengi sarıydı; beyaz başlık zemininde okunmuyordu. */
.header .navbar-nav .nav-item a:hover,
.header .navbar-nav .nav-item a:focus,
.header .navbar-nav .active > a,
.header .navbar-nav .nav-item.dropdown:hover > .nav-link {
    color: var(--ozc-green-link) !important;
}

/* Açılır menü satırları: sarı zemin yerine yeşil zemin + beyaz yazı */
.header .navbar-nav .nav-item .dropdown-item:hover,
.header .navbar-nav .drop-down-pages .active > a,
.header .navbar-nav .drop-down-pages .active > a:hover {
    color: #fff !important;
    background-color: var(--ozc-green) !important;
}

/* Açılır menünün ucundaki üçgen de aynı renge dönsün */
.header .navbar-nav .drop-down-pages li:first-child a:hover::before,
.header .navbar-nav .drop-down-pages .active:first-child > a::before {
    border-bottom-color: var(--ozc-green) !important;
}

/* ------------------------- 1. ARKA PLAN GÖRSELLERİ ------------------------- */

.banner-con { background-image: url(../img/hero.jpg); background-position: center; }
.sub_banner .sub_banner_con { background-image: url(../img/subbanner-bg.jpg); }
.sub_banner .service_detail_banner { background-image: url(../img/servicedetail-banner.jpg); }
.our_services_section::before { background-image: url("../img/services-left.jpg"); }
.choose-con::before { background-image: url(../img/choose-bg.jpg); }
.need-con { background-image: url(../img/need-bg.jpg); }
.serviceneed-con { background-image: url(../img/serviceneed-bg.jpg); }
.servicedetailneed-con { background-image: url(../img/servicedetailneed-bg.jpg); }
.projectform-con { background-image: url(../img/projectform-bg.jpg); }
.serviceabout-con::before { background-image: url(../img/serviceabout-left.jpg); }
.space-con::before { background-image: url(../img/space-right.jpg); }
.contactform-con::before { background-image: url(../img/contact-right.jpg); }

/* ---------------------------- 2. HERO / BANNER ---------------------------- */

.home1_banner_outer { position: relative; }
.banner-con::before {
    content: "";
    position: absolute;
    left: 0; top: 0;
    width: 100%; height: 100%;
    opacity: 1;
    background: linear-gradient(100deg, rgba(13, 30, 24, .88) 0%, rgba(13, 30, 24, .72) 42%, rgba(13, 30, 24, .25) 72%, rgba(13, 30, 24, .1) 100%);
    z-index: 0;
}
.banner-con > .container { z-index: 2; }
.banner-con .banner_content { padding: 180px 120px 200px 0; }
.banner-con .banner_content h1 { font-size: 58px; line-height: 68px; }

/* Temanın imzası olan beyaz dalga ayracı (orijinalde arka plan PNG'sinin parçasıydı) */
.banner-con::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: -1px;
    height: 120px;
    z-index: 1;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1920 120' preserveAspectRatio='none'%3E%3Cpath fill='%23ffffff' d='M0 120h1920V36c-139 24-284 41-433 46-166 6-262-11-421-14-154-3-247 15-401 28C517 108 380 110 253 104 160 100 78 94 0 84z'/%3E%3C/svg%3E") no-repeat center bottom / 100% 100%;
    pointer-events: none;
}

.banner-eyebrow {
    display: inline-block;
    margin-bottom: 22px;
    padding: 9px 20px 10px;
    border-radius: 60px;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .4px;
    color: var(--ozc-accent);
    background-color: rgba(253, 222, 119, .12);
    border: 1px solid rgba(253, 222, 119, .4);
}

.banner-con .banner_content ul.banner-badges {
    margin: 38px 0 0 !important;
    padding: 0;
    display: flex !important;
    flex-wrap: wrap;
    gap: 10px 32px;
    position: relative;
    left: 0; top: 0;
}
.banner-con .banner_content ul.banner-badges li {
    margin: 0;
    display: block;
    font-size: 15px;
    font-weight: 500;
    color: #fff;
}
.banner-con .banner_content ul.banner-badges li:hover { transform: none; }
.banner-con .banner_content ul.banner-badges li i {
    width: auto; height: auto; line-height: inherit;
    font-size: 15px;
    background: none;
    border-radius: 0;
    color: var(--ozc-accent);
    margin-right: 9px;
}

.banner-con .icons { left: -120px; }
.banner-con .icons li a { color: #fff; }

/* ------------------------- 3. FONT AWESOME İKONLAR ------------------------- */

/* Tema PNG ikonlar yerine vektörel Font Awesome ikonları */
.our_services_section .box .service-icon i,
.service-con .service-box .service-icon i,
.service2-con .service-box .service-icon i,
.service3-con .service-box .service-icon i,
.contactinfo-con .contact-box .contact-icon i {
    font-size: 34px;
    color: var(--ozc-accent);
    line-height: inherit;
}
.work-con .work-box .work-icon i { font-size: 46px; color: var(--ozc-accent); line-height: inherit; }
.about-con .about_wrapper .box .icon i { font-size: 40px; color: var(--ozc-green); display: inline-block; }
.header .phone-number .header-phone i { font-size: 14px; color: #fff; line-height: 42px; }
.header .phone-number:hover .header-phone i { color: #fff; }

.our_services_section .box .service-icon,
.service-con .service-box .service-icon,
.contactinfo-con .contact-box .contact-icon { overflow: hidden; }

/* Kart metinlerini sınırla: owl eşit yükseklik kullandığı için uzun metin tüm kartları uzatır */
.our_services_section .box p,
.service-con .service-box p {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.our_services_section .box h3,
.service-con .service-box h3 { min-height: 56px; }

/* Hizmet başlıklarındaki bağlantılar */
.our_services_section .box h3 a,
.service-con .service-box h3 a,
.article-con .article-box h3 a {
    color: inherit;
    transition: color .35s ease-in-out;
}
.our_services_section .box h3 a:hover,
.service-con .service-box h3 a:hover,
.article-con .article-box h3 a:hover { color: var(--ozc-green); }

/* Tema placeholder PNG'lerinin yerine CSS çözümleri */
.navbar-nav .drop-down-pages li:first-child a::before,
.navbar-nav .drop-down-pages li:first-child a:hover::before,
.navbar-nav .drop-down-pages .active:first-child > a::before {
    background-image: none !important;
    width: 0 !important; height: 0 !important;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #fff;
    top: -10px !important;
}

/* Müşteri yorumlarındaki yıldızlar */
.testimonial-con .stars-img { margin-bottom: 22px; display: inline-block; }
.testimonial-con .stars-img i { font-size: 15px; color: #fbc729; margin: 0 2px; }

/* ---------------------------- 4. GÖRSEL ÖLÇÜLERİ ---------------------------- */

@media screen and (min-width: 1200px) {
    .about-con .about_wrapper .about-image1 img { width: 350px; }
    .about-con .about_wrapper .about-image2 img { width: 330px; }
    .about-con .about_wrapper .about-image3 img { width: 200px; }
    .aboutpage-con .about_wrapper .aboutpage-image1 img { width: 303px; }
    .aboutpage-con .about_wrapper .aboutpage-image2 img { width: 303px; }
}

.project-con .project-box .project-image img,
.projectpage-con .project-card .project-image img { width: 100%; height: auto; }

/* Bölüm alt boşlukları: orijinal temada sonraki bölüm negatif margin ile biniyordu */
.choose-con { padding: 110px 0 120px; }
.project-con { padding: 110px 0 110px; }
.section-cta { margin-top: 105px; position: relative; z-index: 2; }

.testimonial-con #thumbs .client-img img { border-radius: 100%; }

/* ---------------------------- 5. CTA BANTLARI ---------------------------- */

/* Tema .primary_btn tabanında padding tanımlamıyor; kendi kullandığımız yerlere ekliyoruz */
.footer-cta.primary_btn,
.sidebar-cta .primary_btn,
.error-con .primary_btn,
.section-cta .primary_btn,
.projectpage-con .primary_btn { padding: 18px 32px 20px; }

.cta-buttons { display: flex; flex-wrap: wrap; gap: 14px; }
.need-con .need_content .cta-buttons .primary_btn { margin-right: 0; }
.need-con .need_content .secondary_btn {
    color: #fff;
    background-color: transparent;
    border: 1px solid rgba(255, 255, 255, .55);
}
.need-con .need_content .secondary_btn i { color: #fff; }
.need-con .need_content .secondary_btn:hover {
    color: var(--ozc-dark);
    background-color: var(--ozc-accent);
    border-color: var(--ozc-accent);
}
.need-con .need_content .secondary_btn:hover i { color: var(--ozc-dark); }
.need-con .need_content h2 { margin-bottom: 36px; }

/* ------------------------- 6. HİZMET DETAY SAYFASI ------------------------- */

.servicedetail-con { padding: 110px 0 100px; }
.servicedetail-con .servicedetail_content .servicedetail-hero { margin-bottom: 38px; }
/* Hizmet görseli yatay ya da dikey olabilir; sabit orana kırpıyoruz */
.servicedetail-con .servicedetail_content .servicedetail-hero img {
    border-radius: 24px;
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 10;
    object-fit: cover;
    object-position: center 42%;
}
.servicedetail-con .servicedetail_content h2 {
    font-size: 30px;
    line-height: 40px;
    margin: 42px 0 18px;
}
.servicedetail-con .servicedetail_content p { margin-bottom: 18px; color: var(--e-global-color-text); }
.lead-text {
    padding: 24px 28px;
    border-left: 4px solid var(--ozc-green);
    border-radius: 0 14px 14px 0;
    background-color: #f5f8f6;
    font-weight: 500;
    color: #2d2d2d !important;
}

.feature-list { margin-top: 46px; }
.servicedetail-con .servicedetail_content .feature-list ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 26px;
}
.servicedetail-con .servicedetail_content .feature-list ul li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 0;
}
.servicedetail-con .servicedetail_content .feature-list ul li p {
    padding-left: 0;
    font-weight: 500;
}
.feature-list ul li i {
    position: static !important;
    flex: 0 0 24px;
    width: 24px; height: 24px;
    margin-top: 2px;
    line-height: 24px;
    text-align: center;
    font-size: 11px;
    border-radius: 100%;
    color: #fff;
    background-color: var(--ozc-green);
}

.service-faq { margin-top: 50px; }
.service-faq .qa {
    padding: 24px 26px;
    margin-bottom: 16px;
    border: 1px solid #e5e5e5;
    border-radius: 16px;
    background-color: #fff;
    transition: border-color .3s ease, box-shadow .3s ease;
}
.service-faq .qa:hover { border-color: var(--ozc-green); box-shadow: 0 6px 30px rgba(0, 0, 0, .05); }
.service-faq .qa h3 { font-size: 19px; line-height: 28px; margin-bottom: 10px; }

/* ----------------------------- 7. KENAR ÇUBUĞU ----------------------------- */

.service-sidebar { position: sticky; top: 30px; padding-left: 14px; }
.sidebar-box {
    padding: 30px 28px 32px;
    margin-bottom: 26px;
    border-radius: 20px;
    background-color: #f5f8f6;
    border: 1px solid #e7ece9;
}
.sidebar-title {
    font-size: 21px;
    line-height: 30px;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid #dde5e0;
}
.sidebar-links li + li { margin-top: 4px; }
.sidebar-links li a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 14px;
    border-radius: 12px;
    font-size: 15px;
    font-weight: 500;
    color: #3f3f3f;
    text-decoration: none;
    transition: all .3s ease-in-out;
}
.sidebar-links li a i { color: var(--ozc-green); width: 20px; text-align: center; transition: color .3s; }
.sidebar-links li a:hover { background-color: var(--ozc-green); color: #fff; text-decoration: none; }
.sidebar-links li a:hover i { color: var(--ozc-accent); }

.sidebar-cta { background-color: var(--ozc-dark); border-color: var(--ozc-dark); text-align: center; }
.sidebar-cta-icon { font-size: 40px; color: var(--ozc-accent); margin-bottom: 18px; display: inline-block; }
.sidebar-cta h3 { color: #fff; font-size: 23px; margin-bottom: 12px; }
.sidebar-cta p { color: rgba(255, 255, 255, .78); font-size: 15px; line-height: 26px; margin-bottom: 22px; }
.sidebar-cta .primary_btn {
    display: inline-block;
    color: var(--ozc-dark) !important;
    background-color: var(--ozc-accent);
    border: 1px solid var(--ozc-accent);
}
.wa-link {
    display: block;
    margin-top: 16px;
    font-size: 15px;
    font-weight: 600;
    color: #7fd38a;
}
.wa-link:hover { color: #fff; text-decoration: none; }

/* ------------------------------ 8. DEĞERLER ------------------------------ */

.values-con { padding: 110px 0 100px; background-color: #f9f9f9; }
.value-box {
    height: 100%;
    padding: 38px 30px 34px;
    border-radius: 22px;
    background-color: #fff;
    border: 1px solid #ececec;
    transition: all .4s ease-in-out;
}
.value-box:hover { border-color: var(--ozc-green); transform: translateY(-6px); box-shadow: 0 14px 44px rgba(0, 0, 0, .06); }
.value-icon {
    width: 72px; height: 72px; line-height: 72px;
    margin-bottom: 22px;
    border-radius: 100%;
    text-align: center;
    background-color: var(--ozc-green);
}
.value-icon i { font-size: 28px; color: var(--ozc-accent); }
.value-box h3 { font-size: 21px; line-height: 30px; margin-bottom: 12px; }

/* ------------------------------ 9. PROJELER ------------------------------ */

.projectpage-con { padding: 110px 0 100px; }
/* Kartlar farklı yükseklikte olabildiği için satırları esnek kılıyoruz */
.projectpage-con .all_row,
.values-con .all_row,
.blogpage-con .all_row,
.service-con .all_row { display: flex; flex-wrap: wrap; }
.projectpage-con .all_column,
.values-con .all_column,
.blogpage-con .all_column { margin-bottom: 30px; }
.project-card {
    height: 100%;
    overflow: hidden;
    border-radius: 22px;
    background-color: #fff;
    border: 1px solid #ececec;
    transition: all .4s ease-in-out;
}
.project-card:hover { border-color: var(--ozc-green); box-shadow: 0 14px 44px rgba(0, 0, 0, .07); }
.project-card .project-image { overflow: hidden; }
.project-card .project-image img { transition: transform .6s ease-in-out; display: block; }
.project-card:hover .project-image img { transform: scale(1.06); }
.project-card-body { padding: 26px 26px 30px; }
.project-cat {
    display: inline-block;
    margin-bottom: 12px;
    padding: 6px 15px 7px;
    border-radius: 60px;
    font-size: 13px;
    font-weight: 600;
    color: var(--ozc-dark);
    background-color: var(--ozc-accent);
}
.project-card h3 { font-size: 22px; line-height: 30px; margin-bottom: 8px; }
.project-place { font-size: 14px; color: #6d6c6c; margin-bottom: 14px; }
.project-place i { color: var(--ozc-green); margin-right: 7px; }

/* -------------------------------- 10. BLOG -------------------------------- */

.article-con { padding: 110px 0 110px; }
.article-con .article-box h4 a { color: inherit; transition: color .35s ease-in-out; }
.article-con .article-box h4 a:hover { color: var(--ozc-green); text-decoration: none; }
.article-cat {
    display: inline-block;
    margin-bottom: 12px;
    padding: 5px 14px 6px;
    border-radius: 60px;
    font-size: 12px;
    font-weight: 600;
    color: var(--ozc-dark);
    background-color: var(--ozc-accent);
}
/* Blog sayfasında kartlar carousel yerine ızgarada: beyaz kutu stilini .article-box üstlenir */
.blogpage-con { padding: 110px 0 100px; }
.blogpage-con .article-box,
.article-con .all_column .article-box {
    height: 100%;
    overflow: hidden;
    border-radius: 20px;
    text-align: center;
    background-color: #fff;
    border: 1px solid #ececec;
}
.article-con .article-box .image img { height: auto; }

.singleblog-con { padding: 100px 0 90px; }
.singleblog_content .post-cover { margin-bottom: 28px; }
.singleblog_content .post-cover img { border-radius: 24px; width: 100%; height: auto; }
.post-meta { margin-bottom: 26px; padding-bottom: 20px; border-bottom: 1px solid #e9e9e9; }
.post-meta span { display: inline-block; margin-right: 24px; font-size: 14px; color: #6d6c6c; }
.post-meta span i { color: var(--ozc-green); margin-right: 7px; }
.singleblog_content h2 { font-size: 30px; line-height: 40px; margin: 40px 0 16px; }
.singleblog_content p { margin-bottom: 18px; color: var(--e-global-color-text); }

/* ------------------------------ 12. İLETİŞİM ------------------------------ */

.contactinfo-con .contact-box a { display: inline-block; }
/* Select alanını diğer form alanlarıyla aynı görünüme getir */
.contactform-con .contact_content form select.form_style {
    font-size: 14px;
    line-height: 14px;
    font-weight: 400;
    height: 51px;
    width: 238px;
    padding: 10px 44px 12px 22px;
    color: #6d6c6c;
    background-color: #fff;
    border: 1px solid #fff;
    border-radius: 35px;
    outline: none;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%236d6c6c' d='M6 8 0 0h12z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 20px center;
}
.contactform-con .contact_content form select.form_style:focus { border: 1px solid var(--ozc-accent); }
.form-note { clear: both; padding-top: 18px; font-size: 13px; color: rgba(255, 255, 255, .62); margin-bottom: 0; }
.hp-field { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form-sonuc {
    margin-bottom: 24px;
    padding: 16px 22px;
    border-radius: 14px;
    font-size: 15px;
    line-height: 24px;
    font-weight: 500;
}
.form-sonuc--ok { background-color: rgba(139, 191, 77, .18); border: 1px solid #8bbf4d; color: #fff; }
.form-sonuc--hata { background-color: rgba(255, 120, 100, .15); border: 1px solid #ff8a7a; color: #fff; }
.sr-only {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.map-con iframe { width: 100%; height: 450px; display: block; }

/* ------------------------------- 13. FOOTER ------------------------------- */

/* Logo sütununun zemini sarı: metinler koyu olmalı */
.footer-con .middle_portion .logo-content .footer-about {
    margin: 0 0 24px;
    font-size: 15px;
    line-height: 27px;
    color: #10241d;
}
.footer-con .middle_portion .logo-content .footer-logo { margin-bottom: 24px; }
.footer-hours { font-size: 15px; line-height: 26px; color: rgba(255, 255, 255, .78); margin-bottom: 12px; }
.footer-hours i { color: var(--ozc-accent); margin-right: 10px; }
.footer-cta { display: inline-block; margin: 10px 0 26px; }
.service-areas {
    margin-top: 44px;
    padding-top: 34px;
    border-top: 1px solid rgba(255, 255, 255, .13);
}
.footer-con .copyright .legal {
    margin-top: 8px;
    font-size: 12px;
    line-height: 20px;
    opacity: .7;
}
.service-areas .heading { margin-bottom: 14px; }
.service-areas p { font-size: 14px; line-height: 28px; color: rgba(255, 255, 255, .6); }

/* -------------------------- 14. SABİT İLETİŞİM -------------------------- */

.float-actions {
    position: fixed;
    right: 22px;
    bottom: 100px;
    z-index: 999;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.float-btn {
    width: 54px; height: 54px; line-height: 54px;
    border-radius: 100%;
    text-align: center;
    font-size: 24px;
    color: #fff !important;
    box-shadow: 0 6px 22px rgba(0, 0, 0, .22);
    transition: transform .3s ease-in-out;
}
.float-btn:hover { transform: translateY(-4px); text-decoration: none; }
.float-wa { background-color: #25d366; }
.float-tel { background-color: var(--ozc-green); font-size: 20px; }

/* -------------------------------- 15. 404 -------------------------------- */

.error-con { padding: 120px 0 130px; }
.error-code {
    font-size: 130px;
    line-height: 130px;
    font-weight: 800;
    color: var(--ozc-green);
    opacity: .18;
    margin-bottom: 10px;
}
.error-con h2 { margin-bottom: 14px; }
.error-con p { margin-bottom: 32px; }
.justify-content-center { justify-content: center; }

/* ------------------------------ 16. RESPONSIVE ------------------------------ */

@media screen and (max-width: 1440px) {
    .banner-con .banner_content { padding: 160px 60px 180px 0; }
    .banner-con .banner_content h1 { font-size: 50px; line-height: 60px; }
}

@media screen and (max-width: 1199px) {
    .banner-con .banner_content { padding: 150px 0 170px; }
    .banner-con .banner_content h1 { font-size: 42px; line-height: 52px; }
    .service-sidebar { position: static; padding-left: 0; margin-top: 50px; }
}

@media screen and (max-width: 991px) {
    .feature-list ul { grid-template-columns: 1fr; }
    .banner-badges { gap: 10px 20px; }
}

@media screen and (max-width: 767px) {
    .banner-con .banner_content { padding: 120px 0 130px; }
    .banner-con .banner_content h1 { font-size: 34px; line-height: 44px; }
    .banner-eyebrow { font-size: 13px; }
    .servicedetail-con .servicedetail_content h2,
    .singleblog_content h2 { font-size: 25px; line-height: 34px; }
    .error-code { font-size: 90px; line-height: 90px; }
    .float-actions { right: 14px; bottom: 86px; }
    .float-btn { width: 48px; height: 48px; line-height: 48px; font-size: 21px; }
    .map-con iframe { height: 320px; }
    .cta-buttons { flex-direction: column; align-items: flex-start; }
}

@media screen and (max-width: 575px) {
    .banner-con .banner_content h1 { font-size: 29px; line-height: 39px; }
    .lead-text { padding: 18px 20px; }
    .sidebar-box { padding: 24px 20px 26px; }
}
