/* =====================================================================
   THEME · ART DECO — Gatsby-Eleganz, Gold auf Dunkelgrün, geometrisch
   Charakter: opulent, symmetrisch, hochkontrastreich, vintage-luxus
   ===================================================================== */

[data-theme="artdeco"] {
    --bg: #F3E9D2;           /* Elfenbein */
    --bg-alt: #E8DCC0;       /* gealtertes Elfenbein */
    --bg-card: #FBF5E3;
    --fg: #1A3B2E;           /* Dunkelgrün */
    --fg-muted: #4A5F52;
    --accent: #C9A14B;       /* Gold */
    --accent-dark: #A08232;
    --accent-contrast: #1A3B2E;
    --accent-glow: rgba(201, 161, 75, 0.22);
    --border: rgba(26, 59, 46, 0.2);

    --font-head: "Playfair Display", "Georgia", serif;
    --font-body: "Poppins", system-ui, sans-serif;
    --font-weight-head: 900;
    --font-weight-body: 400;

    --radius: 0;
    --radius-sm: 0;
    --stroke: 1px;

    --section-pad: clamp(3.5rem, 8vw, 6.5rem);
    --photo-filter: sepia(0.15) contrast(1.08) saturate(0.95);
    --shadow-card: 0 0 0 1px rgba(201, 161, 75, 0.3), 0 10px 30px rgba(26, 59, 46, 0.14);
    --shadow-lg: 0 20px 60px rgba(26, 59, 46, 0.22);

    --btn-shape: 0;
    --focus-ring: #A08232;
    --focus-ring-offset: 4px;
}

/* === Body Rauten-Pattern als zartes Background === */
[data-theme="artdeco"] body {
    background-color: var(--bg);
    background-image:
        radial-gradient(ellipse 800px 400px at 50% 0, rgba(201, 161, 75, 0.08), transparent 70%),
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='44' height='44' viewBox='0 0 44 44'><path d='M22 0 L44 22 L22 44 L0 22 Z' fill='none' stroke='%23C9A14B' stroke-width='0.5' opacity='0.18'/></svg>");
    background-size: auto, 44px 44px;
    background-position: top center, center;
    background-repeat: no-repeat, repeat;
}

/* === Typografie === */
[data-theme="artdeco"] h1,
[data-theme="artdeco"] h2,
[data-theme="artdeco"] h3 {
    font-style: italic;
    letter-spacing: -0.015em;
}
[data-theme="artdeco"] h1 {
    text-align: center;
    position: relative;
}
[data-theme="artdeco"] h1::before,
[data-theme="artdeco"] h1::after {
    content: "";
    display: block;
    width: 100px;
    height: 14px;
    margin: 1rem auto;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 14'><line x1='0' y1='7' x2='100' y2='7' stroke='%23C9A14B' stroke-width='1.5'/><circle cx='50' cy='7' r='3.5' fill='none' stroke='%23C9A14B' stroke-width='1.5'/><line x1='20' y1='3' x2='20' y2='11' stroke='%23C9A14B' stroke-width='1'/><line x1='80' y1='3' x2='80' y2='11' stroke='%23C9A14B' stroke-width='1'/></svg>");
    background-repeat: no-repeat;
    background-position: center;
}
[data-theme="artdeco"] .hero-eyebrow,
[data-theme="artdeco"] .section-eyebrow {
    color: var(--accent-dark);
    letter-spacing: 0.28em;
    font-weight: 600;
    font-style: normal;
}

/* === Cards mit Double-Border (Gold outer + Inner-Shadow) === */
[data-theme="artdeco"] .card,
[data-theme="artdeco"] .paket,
[data-theme="artdeco"] .work-card {
    background: var(--bg-card);
    border: 1px solid var(--accent);
    box-shadow:
        inset 0 0 0 1px rgba(201, 161, 75, 0.25),
        inset 0 0 0 5px var(--bg-card),
        inset 0 0 0 6px rgba(201, 161, 75, 0.6),
        0 8px 24px rgba(26, 59, 46, 0.1);
    padding: 1.8rem;
}
[data-theme="artdeco"] .card:hover,
[data-theme="artdeco"] .work-card:hover {
    transform: translateY(-3px);
    box-shadow:
        inset 0 0 0 1px rgba(201, 161, 75, 0.25),
        inset 0 0 0 5px var(--bg-card),
        inset 0 0 0 6px rgba(201, 161, 75, 0.8),
        0 14px 34px rgba(26, 59, 46, 0.18);
}

/* === Buttons — Gold-Lined === */
[data-theme="artdeco"] .btn-primary {
    background: var(--fg);
    color: var(--bg);
    border: 1px solid var(--accent);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-size: 0.85rem;
    padding: 1rem 2rem;
    box-shadow: inset 0 0 0 4px var(--fg), inset 0 0 0 5px var(--accent);
}
[data-theme="artdeco"] .btn-primary:hover {
    background: var(--accent);
    color: var(--fg);
    box-shadow: inset 0 0 0 4px var(--accent), inset 0 0 0 5px var(--fg);
    transform: none;
}
[data-theme="artdeco"] .btn-secondary {
    background: transparent;
    color: var(--fg);
    border: 1px solid var(--fg);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-size: 0.85rem;
}

/* === Style-Switcher auf artdeco === */
[data-theme="artdeco"] .style-switcher {
    background: var(--bg-card);
    border: 1px solid var(--accent);
    box-shadow:
        inset 0 0 0 5px var(--bg-card),
        inset 0 0 0 6px rgba(201, 161, 75, 0.6);
}
[data-theme="artdeco"] .style-nav {
    border-color: var(--accent);
    background: var(--bg-card);
}

/* === Hero bekommt zusätzlichen Sunburst === */
[data-theme="artdeco"] .hero::before {
    content: "";
    position: absolute;
    top: 70px;
    left: 50%;
    transform: translateX(-50%);
    width: 180px;
    height: 90px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180 90'><g stroke='%23C9A14B' stroke-width='1.2' fill='none' opacity='0.5'><path d='M90 85 L90 5'/><path d='M90 85 L50 10'/><path d='M90 85 L130 10'/><path d='M90 85 L20 30'/><path d='M90 85 L160 30'/><path d='M90 85 L0 55'/><path d='M90 85 L180 55'/><path d='M90 85 L10 75'/><path d='M90 85 L170 75'/></g><path d='M10 85 L170 85' stroke='%23C9A14B' stroke-width='1.5' fill='none'/></svg>");
    background-repeat: no-repeat;
    background-size: contain;
    pointer-events: none;
    z-index: 0;
    opacity: 0.7;
}
[data-theme="artdeco"] .hero > .container { position: relative; z-index: 1; }

/* === Section-Heads mit Gold-Divider === */
[data-theme="artdeco"] .section-head {
    text-align: center;
    position: relative;
}
[data-theme="artdeco"] .section-head h2 {
    display: inline-block;
}

/* === Links mit Gold-Underline === */
[data-theme="artdeco"] .work-link {
    color: var(--accent-dark);
    border-bottom: 1px solid var(--accent);
    padding-bottom: 2px;
    font-style: italic;
}
[data-theme="artdeco"] .work-link:hover {
    color: var(--fg);
    border-color: var(--fg);
}

/* === Footer = Dunkelgrün mit Gold === */
[data-theme="artdeco"] .site-footer {
    background: var(--fg);
    color: var(--bg);
}
[data-theme="artdeco"] .site-footer h2 { color: var(--accent); }
[data-theme="artdeco"] .site-footer a { color: var(--bg); }
[data-theme="artdeco"] .site-footer a:hover { color: var(--accent); }

/* === Hero-Content wird schmaler fürs Art-Deco-Gefühl === */
[data-theme="artdeco"] .hero-lead {
    font-family: var(--font-head);
    font-style: italic;
    font-weight: 400;
}

/* === Tile-Preview für Art Deco === */
.tile-preview[data-theme="artdeco"] {
    background: #F3E9D2;
    color: #1A3B2E;
    border: 1px solid #C9A14B;
    box-shadow: inset 0 0 0 3px #F3E9D2, inset 0 0 0 4px rgba(201, 161, 75, 0.6);
}
.tile-preview[data-theme="artdeco"] .tile-head { font-family: "Playfair Display", serif; font-style: italic; font-weight: 900; }
.tile-preview[data-theme="artdeco"] .tile-dot { background: #C9A14B; }