/*
Theme Name: DITIB Clone
Theme URI: https://ditib.de
Author: AI Assistant
Author URI: 
Description: A 1:1 WordPress clone theme of the DITIB website (ditib.de), complete with responsive design and exact structure.
Version: 1.0.0
Text Domain: ditib-theme
*/

/* ==========================================================================
   CSS Variables for Colors & Typography
   ========================================================================== */
:root {
    --color-primary: #0c8aa4;
    /* Teal */
    --color-nav: #01576e;
    /* Darker Teal */
    --color-aktuelles: #1a4a72;
    --color-nachrichten: #3a8a9e;
    --color-positionen: #b99351;
    --color-landesverband: #9b6d45;
    --color-predigt: #6b4e31;
    --color-white: #ffffff;
    --color-text-dark: #333333;
    --color-gray-light: #f5f5f5;

    --font-primary: 'Open Sans', Arial, sans-serif;
}

/* ==========================================================================
   Base Styles / Resets
   ========================================================================== */
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    font-family: var(--font-primary);
    color: var(--color-text-dark);
    background-color: var(--color-primary);

    /* Exact Background Pattern (User Uploaded) */
    background-image: url('assets/images/background.png');
    background-position: center;
    background-size: auto;
    background-repeat: repeat;
    background-attachment: fixed;

    /* Blend Mode to perfectly colorize the pattern into Teal */
    background-blend-mode: color-burn;
    /* Works best for dark patterns on color */

    font-size: 14px;
    line-height: 1.6;
}

a {
    text-decoration: none;
    color: var(--color-primary);
    transition: all 0.3s ease;
}

a:hover {
    color: var(--color-nav);
}

ul {
    list-style: none;
}

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

/* ==========================================================================
   Layout Wrapper
   ========================================================================== */
.site-wrapper {
    max-width: 1140px;
    margin: 0 auto;
    background-color: var(--color-white);
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
}

/* ==========================================================================
   Utility Classes
   ========================================================================== */
.container {
    padding-left: 15px;
    padding-right: 15px;
}