/* Modern Typography for Turkish Content */

/* Base font for body text - Inter for excellent readability */
body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue', Arial, sans-serif !important;
    font-weight: 400;
    line-height: 1.6;
    letter-spacing: -0.01em;
    color: #395442; /* Original brownish-green color from the site */
}

/* Headers use Playfair Display for elegance */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: 'Playfair Display', Georgia, 'Times New Roman', serif !important;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: -0.02em;
    margin-bottom: 0.5em;
    color: #395442; /* Same brownish-green color */
}

/* Match section headings with main title span color - override Bootstrap */
#la-formule h1 span {
    color: #395442 !important; /* Dark green color for "Klinik Psikolog, Psikoterapist" */
    opacity: 0.8; /* Make main title span 80% transparent */
}

#la-formule h3 {
    color: #395442 !important; /* Same dark green as "Klinik Psikolog, Psikoterapist" */
    opacity: 0.6; /* Make section headings 60% transparent */
}

h1, .h1 {
    font-weight: 700;
    font-size: 2.5em;
}

h2, .h2 {
    font-weight: 600;
    font-size: 2em;
}

h3, .h3 {
    font-weight: 600;
    font-size: 1.5em;
}

/* Improve readability for paragraphs */
p {
    margin-bottom: 1.2em;
    font-weight: 400;
}

/* Better spacing for Turkish text */
.turkish-text {
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Navigation and UI elements */
.navbar, .nav, .menu {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
    font-weight: 500;
}

/* Buttons and form elements */
button, .btn, input, textarea, select {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
    font-weight: 500;
}

/* Ensure proper font rendering on all devices */
* {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* Custom leaf-shaped bullet points for education list */
.education-list {
    list-style: none;
    padding-left: 0;
    margin: 1.5em 0;
}

.education-list li {
    position: relative;
    padding-left: 2em;
    margin-bottom: 1em;
    line-height: 1.6;
}

.education-list li::before {
    content: "🍃";
    position: absolute;
    left: 0;
    top: 0;
    font-size: 1.2em;
    color: #2d4a35; /* Darker shade of the main green color */
    opacity: 0.8;
    transform: rotate(-15deg);
}

.education-list li {
    color: #ac9377; /* Brown color to match the heading exactly */
}

.education-list li .instructor {
    display: block;
    font-size: 0.9em;
    color: #395442; /* Exact same color as Mesleki Eğitimler heading */
    font-style: italic;
    margin-top: 0.3em;
    font-weight: 500;
    opacity: 1; /* Full opacity to match heading exactly */
}

/* Hover effect for education list items */
.education-list li:hover::before {
    transform: rotate(0deg) scale(1.1);
    transition: transform 0.3s ease;
}

.education-list li {
    transition: padding-left 0.3s ease;
}

.education-list li:hover {
    padding-left: 2.2em;
}

/* Align left column content to the left within its area */

.col-md-8.col-xs-8.mobile-fullwidth {
    text-align: left; /* Align everything to the left */
    padding-left: 0; /* Remove default padding */
}

.col-md-8.col-xs-8.mobile-fullwidth h1,
.col-md-8.col-xs-8.mobile-fullwidth .text,
.col-md-8.col-xs-8.mobile-fullwidth .blog-cta {
    text-align: left; /* Keep text left-aligned */
}

/* Left align right column text */
.col-right .text {
    text-align: left !important;
}

.col-right .text p {
    text-align: left !important;
}

@media (min-width: 992px) {
    .col-md-8.col-xs-8.mobile-fullwidth {
        margin-left: -40px; /* Preserve desktop alignment */
    }

    .col-right {
        margin-left: -50px; /* Pull the right column block to the left on large screens */
    }
}

@media (max-width: 991px) {
    .col-md-8.col-xs-8.mobile-fullwidth {
        margin-left: 0;
        width: 100%;
        float: none;
        padding-right: 0;
    }

    #la-formule {
        padding: 60px 0 80px;
    }

    #la-formule .container {
        padding-left: 24px;
        padding-right: 24px;
    }

    #la-formule .row {
        display: block;
    }

    body #la-formule .col-right {
        position: static;
        width: 100%;
        padding: 0;
        margin-top: 40px;
        text-align: left;
        height: auto;
        min-height: 0;
        overflow: visible;
    }

    body #la-formule .col-right .text {
        padding: 0;
    }
}

@media (max-width: 767px) {
    body {
        overflow-x: hidden;
    }

    #la-formule h1 {
        font-size: 2.2em;
        line-height: 1.1;
    }

    #la-formule h1 span {
        display: block;
        font-size: 0.65em;
        margin-top: 0.4em;
    }

    #la-formule .text {
        margin-top: 24px;
    }

    #la-formule .blog-cta {
        margin-top: 24px;
    }

    body #la-formule .col-right {
        margin-top: 32px;
    }

    body #la-formule .col-right .hidden-xs,
    body #la-formule .col-right .hidden-sm,
    body #la-formule .col-right .hidden-md {
        display: block !important;
    }

    body #la-formule .col-right .text p {
        color: #6a8372;
        margin-bottom: 1.4em;
    }

    body #la-formule .col-right img {
        max-width: 320px;
        width: 100%;
        height: auto;
        margin: 0 auto 24px;
        display: block;
    }
}