/*
 Theme Name:   Astra Child - VitamineProfi Premium
 Theme URI:    https://vitamineprofi.de
 Description:  Child Theme fuer Astra – Premium-Supplement-Look (80–90 % Sunday-Natural-Stil)
 Author:       VitamineProfi & ChatGPT
 Template:     astra
 Version:      1.0.0
 Text Domain:  astra-child-vitamineprofi
*/

/* Grundlayout -------------------------------------------------- */
body {
    font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: #222222;
    background-color: #faf8f4;
}

/* Typografie Premium */
h1, h2, h3, h4 {
    font-family: "Playfair Display", "Georgia", serif;
    font-weight: 500;
    letter-spacing: 0.01em;
    color: #1c1a16;
}

h1 {
    font-size: clamp(2.4rem, 3vw, 3.2rem);
}

h2 {
    font-size: clamp(1.9rem, 2.5vw, 2.4rem);
}

h3 {
    font-size: clamp(1.4rem, 2vw, 1.7rem);
}

/* Links */
a {
    color: #7a5c2b;
}

a:hover,
a:focus {
    color: #b48732;
}

/* Header / Menü ------------------------------------------------ */
.main-header-bar,
.site-header {
    background-color: #fbf9f4;
    border-bottom: 1px solid #eee4d2;
}

.ast-main-header-wrap,
.main-header-bar .main-header-container {
    max-width: 1180px;
}

/* Logo + Navigation */
.main-header-bar .main-header-bar-navigation {
    font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 0.95rem;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.main-header-menu > .menu-item > a {
    padding-inline: 0.9rem;
    color: #474236;
}

.main-header-menu > .menu-item > a:hover,
.main-header-menu > .menu-item.current-menu-item > a {
    color: #b48732;
}

/* Hero / Überschriftenbereich (Seiten & Blog) ------------------ */
.entry-header {
    margin-bottom: 1.5rem;
}

.ast-single-post .entry-title,
.ast-page-title {
    margin-bottom: 0.4rem;
}

.ast-single-post .entry-meta,
.ast-page-builder-template .entry-meta {
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.11em;
    color: #9b9078;
}

/* Buttons ------------------------------------------------------ */
button,
input[type="submit"],
.ast-button,
.ast-custom-button {
    border-radius: 999px;
    border: 1px solid #d6b16a;
    background: linear-gradient(135deg, #e6c980, #cda052);
    color: #211c12;
    padding: 0.6em 1.6em;
    font-weight: 500;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

button:hover,
input[type="submit"]:hover,
.ast-button:hover,
.ast-custom-button:hover {
    border-color: #b48732;
    background: linear-gradient(135deg, #f0dba0, #d0a95d);
    color: #15110b;
}

/* Karten / Boxen ----------------------------------------------- */
.ast-article-post,
.ast-article-single,
.widget {
    background-color: #ffffff;
    border-radius: 18px;
    box-shadow: 0 12px 30px rgba(12, 6, 0, 0.05);
    border: 1px solid #f0e4cf;
}

/* Content-Bereich --------------------------------------------- */
.ast-container {
    max-width: 1180px;
}

/* Abschnittsabstände */
.entry-content > *:not(:last-child) {
    margin-bottom: 1.4em;
}

/* Listen-Style */
.entry-content ul {
    list-style-type: none;
    padding-left: 1.1em;
}

.entry-content ul li::before {
    content: "•";
    color: #cda052;
    font-weight: 700;
    margin-right: 0.45em;
}

/* Footer ------------------------------------------------------- */
.site-footer {
    background-color: #f5f0e6;
    color: #5a5243;
}

.site-footer a {
    color: #7a5c2b;
}

.site-footer a:hover {
    color: #b48732;
}

.site-primary-footer-wrap {
    border-top: 1px solid #e0d2b9;
}

/* Breadcrumbs (RankMath) -------------------------------------- */
.rank-math-breadcrumb {
    font-size: 0.85rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #a19680;
    margin-bottom: 1.1rem;
}

.rank-math-breadcrumb a {
    color: #88724b;
}

.rank-math-breadcrumb a:hover {
    color: #b48732;
}

/* Blog-Archiv-Karten ------------------------------------------ */
.blog .ast-article-post,
.archive .ast-article-post {
    padding: 1.8rem;
}

.blog .entry-title a,
.archive .entry-title a {
    color: #241f16;
}

.blog .entry-title a:hover,
.archive .entry-title a:hover {
    color: #b48732;
}

/* Mobile Optimierungen ---------------------------------------- */
@media (max-width: 921px) {
    .main-header-bar .main-header-bar-navigation {
        text-transform: none;
        letter-spacing: 0.03em;
    }

    .main-header-menu .menu-link {
        padding-top: 0.7rem;
        padding-bottom: 0.7rem;
    }

    .ast-container {
        padding-inline: 1.4rem;
    }
}

/* Kleine Helferklassen ---------------------------------------- */
.vp-section-narrow {
    max-width: 780px;
    margin-inline: auto;
}

.vp-badge-gold {
    display: inline-block;
    padding: 0.25em 0.8em;
    border-radius: 999px;
    border: 1px solid #d6b16a;
    font-size: 0.75rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #7b5b29;
    background: rgba(237, 212, 142, 0.18);
}