﻿/* FOOTER */
.footer-site-slogan {
    font-size: 24px;
    color: #006837;
}

.footer-modern .fab {
    padding-right: 10px;
}

.footer-modern .fa-location-dot {
    padding-right: 10px;
}

.footer-modern h6 {
    font-size: 1.6rem;
    padding-left: 10px;
}

.footer-modern {
    background: transparent;
}

.footer-card {
    background: #f8f9fa;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

    .footer-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 25px rgba(0,0,0,0.15);
    }

.footer-contact-link, .footer-address-link, .footer-social-links a {
    text-decoration: none;
    color: #202556;
    transition: color 0.3s ease;
}

    .footer-contact-link i, .footer-address-link i {
        width: 20px;
        margin-right: 10px;
    }

    .footer-contact-link:hover, .footer-address-link:hover, .footer-social-links a:hover {
        color: #11904a;
    }

.hero-subtitle {
    font-size: 1rem;
    color: #11904a;
    font-weight: 600;
    letter-spacing: 1px;
}

.hero-title {
    font-size: 3rem;
    font-weight: 800;
    color: #202556;
    margin-top: 10px;
}

.uc-kutu .kutu {
    width: 12px;
    height: 12px;
    margin: 1px;
}

.uc-kutu {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.satir {
    display: flex;
}

.yesil {
    background-color: #11904a;
}

.mavi {
    background-color: #202556;
}















/*PAGE HEADING*/


/* --- Page heading (unique, non-referential) --- */
.page-heading-unique,
.page-heading-unique * {
    box-sizing: border-box;
}

.page-heading-unique {
    position: relative;
    background: linear-gradient(180deg, #ffffff 0%, #fbfcfe 100%);
    min-height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: 2.5rem 1rem;
    border-bottom: 1px solid rgba(32,37,86,0.06);
}

/* watermark block using your 3-square motif (large, subtle, behind content) */
.heading-watermark {
    position: absolute;
    right: 8%;
    top: 12%;
    z-index: 1;
    pointer-events: none;
    opacity: 0.06;
    transform: rotate(-12deg) scale(6); /* scale controls size, rotate adds uniqueness */
    filter: blur(0.5px); /* soft edge for premium look */
}

    /* a separate smaller watermark on the left for balance */
    .heading-watermark::after {
        content: "";
        position: absolute;
        left: -18rem;
        top: 8rem;
        width: 1px;
        height: 1px; /* placeholder to keep relative spacing (no visual) */
        /* we intentionally keep only the main .uc-kutu visible to avoid repeating the example */
    }

/* preserve original uc-kutu visual but allow different sizing here */
.wm-kutu .kutu {
    width: 18px; /* base unit inside the watermark; scaled by transform */
    height: 18px;
    margin: 2px;
    border-radius: 2px;
}

/* --- hero heading text (use exact style you specified) --- */
.hero-subtitle {
    font-size: 1rem;
    color: #11904a;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0 0 0.6rem 0;
    z-index: 2;
}

.hero-title {
    font-size: 3rem;
    font-weight: 800;
    color: #202556;
    margin: 0;
    line-height: 1.02;
    z-index: 2;
}

.heading-text {
    margin-top: 0.8rem;
    font-size: 1.05rem;
    color: #444;
    max-width: 900px;
    z-index: 2;
}

/* --- ensure the watermark motif shape uses your colors --- */
.kutu {
    display: inline-block;
}

.yesil {
    background-color: #11904a;
}

.mavi {
    background-color: #202556;
}

.satir {
    display: flex;
}

/* --- layout adjustments to keep heading centered and readable --- */
.heading-inner {
    position: relative;
    z-index: 2;
    max-width: 1200px;
    text-align: center;
    padding: 0 1rem;
}

/* responsive tweaks */
@media (max-width: 992px) {
    .hero-title {
        font-size: 2.2rem;
    }

    .heading-watermark {
        transform: rotate(-12deg) scale(4);
        right: 6%;
        top: 6%;
        opacity: 0.05;
    }
}

@media (max-width: 576px) {
    .hero-title {
        font-size: 1.6rem;
    }

    .hero-subtitle {
        font-size: 0.88rem;
    }

    .heading-text {
        font-size: 0.95rem;
    }

    .heading-watermark {
        transform: rotate(-12deg) scale(3.2);
        right: 4%;
        top: 4%;
        opacity: 0.045;
    }
}
