@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;1,400&display=swap');

body.single .page-header { display:none !important; }
body.single { overflow-x:hidden; }

body.single #ph-single { font-family:'DM Sans',sans-serif; max-width:1200px; margin:0 auto; padding:0 32px 96px; box-sizing:border-box; width:100%; }

body.single #ph-bc { padding:24px 0 0; display:flex; align-items:center; gap:7px; font-size:12.5px; color:#bbb; flex-wrap:wrap; }
body.single #ph-bc a { color:#bbb; text-decoration:none; transition:color .18s; }
body.single #ph-bc a:hover { color:#CC0000; }
body.single #ph-bc .sep { color:#ddd; }
body.single #ph-bc .cur { color:#777; font-weight:500; }

body.single #ph-hero { margin-top:32px; display:grid; grid-template-columns:1fr 400px; gap:56px; align-items:center; padding-bottom:48px; border-bottom:1px solid #ede9e4; }
body.single .ph-cat-badge { display:inline-block; background:#CC0000; color:#fff; font-size:10px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; padding:5px 14px; border-radius:999px; text-decoration:none; margin-bottom:20px; }
body.single .ph-cat-badge:hover { opacity:.85; color:#fff; }
body.single #ph-title { font-size:clamp(24px,2.8vw,40px); font-weight:800; color:#111; line-height:1.15; letter-spacing:-.022em; margin:0 0 22px; font-family:'DM Sans',sans-serif; }

body.single #ph-meta { display:flex; align-items:center; gap:14px; font-size:13px; color:#999; flex-wrap:wrap; margin-bottom:28px; }
body.single #ph-meta span { display:flex; align-items:center; gap:5px; }
body.single #ph-meta svg { width:14px; height:14px; stroke:#bbb; fill:none; }
body.single .ph-meta-dot { width:3px; height:3px; background:#ddd; border-radius:50%; display:inline-block; }

body.single #ph-share { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
body.single #ph-share-label { font-size:10px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:#ccc; }
body.single .ph-sh { display:inline-flex !important; align-items:center !important; gap:6px !important; padding:8px 14px !important; border-radius:8px !important; font-size:12px !important; font-weight:700 !important; text-decoration:none !important; cursor:pointer !important; transition:opacity .2s,transform .15s !important; border:none !important; font-family:'DM Sans',sans-serif !important; line-height:1 !important; }
body.single .ph-sh:hover { opacity:.88 !important; transform:translateY(-1px) !important; }
body.single .ph-sh svg { width:14px !important; height:14px !important; fill:currentColor !important; flex-shrink:0 !important; }
body.single .ph-sh-fb { background:#1877F2 !important; color:#fff !important; }
body.single .ph-sh-wa { background:#25D366 !important; color:#fff !important; }
body.single .ph-sh-tw { background:#111 !important; color:#fff !important; }
body.single .ph-sh-cp { background:#f5f3f0 !important; color:#555 !important; border:1.5px solid #e8e4df !important; }
body.single .ph-sh-cp.done { background:#f0faf0 !important; color:#2e7d32 !important; }

body.single #ph-thumb { border-radius:16px; overflow:hidden; aspect-ratio:4/3; background:#f0ece8; }
body.single #ph-thumb img { width:100%; height:100%; object-fit:cover; display:block; }

body.single #ph-body { margin-top:56px;   grid-template-columns:220px 1fr; gap:64px; align-items:start; }

body.single #ph-toc-box { position:sticky; top:96px; background:#f7f5f2; border-radius:12px; padding:24px; border-left:3px solid #CC0000; max-height:600px; overflow-y:auto; }
body.single #ph-toc-box::-webkit-scrollbar { width:4px; }
body.single #ph-toc-box::-webkit-scrollbar-track { background:transparent; }
body.single #ph-toc-box::-webkit-scrollbar-thumb { background:#CC0000; border-radius:4px; }
body.single #ph-toc-title { font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:#999; margin-bottom:16px; }
body.single #ph-toc-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:2px; }
body.single #ph-toc-list li a { display:block; font-size:13px; font-weight:500; color:#666; text-decoration:none; padding:5px 8px; border-radius:6px; transition:background .15s,color .15s; line-height:1.4; }
body.single #ph-toc-list li a:hover,
body.single #ph-toc-list li a.active { background:rgba(204,0,0,.1); color:#CC0000; }
body.single #ph-toc-list li.ph-toc-h3 a { padding-left:20px; font-size:12px; }

body.single #ph-content { font-family:'Lora',Georgia,serif; font-size:17px; line-height:1.85; color:#2d2d2d; max-width:760px; }
body.single #ph-content h2 { font-family:'DM Sans',sans-serif !important; font-size:26px !important; font-weight:800 !important; color:#111 !important; margin:52px 0 18px !important; scroll-margin-top:100px; }
body.single #ph-content h2:first-child { margin-top:0 !important; }
body.single #ph-content h3 { font-family:'DM Sans',sans-serif !important; font-size:20px !important; font-weight:700 !important; color:#222 !important; margin:36px 0 14px !important; scroll-margin-top:100px; }
body.single #ph-content p { margin:0 0 22px !important; }
body.single #ph-content a { color:#CC0000 !important; text-decoration:underline; text-underline-offset:3px; }
body.single #ph-content img { max-width:100% !important; border-radius:10px !important; display:block; }
body.single #ph-content ul,
body.single #ph-content ol { margin:0 0 22px 0 !important; padding-left:24px !important; }
body.single #ph-content li { margin-bottom:8px !important; }
body.single #ph-content blockquote { border-left:4px solid #CC0000 !important; margin:32px 0 !important; padding:16px 24px !important; background:#fff5f5 !important; border-radius:0 10px 10px 0 !important; font-style:italic; color:#555 !important; }
body.single #ph-content blockquote p { margin:0 !important; }
body.single #ph-content strong { font-weight:700; color:#111; }
body.single #ph-content table { width:100%; border-collapse:collapse; margin:0 0 28px !important; font-size:15px; font-family:'DM Sans',sans-serif; display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; }
body.single #ph-content th { background:#111; color:#fff; padding:10px 14px; text-align:left; font-size:12px; font-weight:700; }
body.single #ph-content td { padding:10px 14px; border-bottom:1px solid #ede9e4; }
body.single #ph-content tr:hover td { background:#fafafa; }

body.single #ph-author { margin-top:64px; padding:32px; background:#f7f5f2; border-radius:16px; display:flex; gap:24px; align-items:flex-start; max-width:760px; }
body.single #ph-author-img { width:72px; height:72px; min-width:72px; border-radius:50%; object-fit:cover; }
body.single #ph-author-name { font-size:16px; font-weight:800; color:#111; margin:0 0 4px; font-family:'DM Sans',sans-serif; }
body.single #ph-author-role { font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:#CC0000; margin-bottom:10px; font-family:'DM Sans',sans-serif; }
body.single #ph-author-bio { font-size:14px; color:#666; line-height:1.7; margin:0; font-family:'DM Sans',sans-serif; }
body.single #ph-author-link { display:inline-flex; align-items:center; gap:5px; margin-top:12px; font-size:12px; font-weight:700; color:#CC0000; text-decoration:none; font-family:'DM Sans',sans-serif; }

body.single #ph-related { margin-top:72px; padding-top:48px; border-top:1px solid #ede9e4; }
body.single #ph-related-title { font-size:16px; font-weight:800; color:#111; margin-bottom:32px; font-family:'DM Sans',sans-serif; display:flex; align-items:center; gap:12px; }
body.single #ph-related-title::after { content:''; flex:1; height:1px; background:#ede9e4; }
body.single #ph-related-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
body.single .ph-rel-card { display:block; text-decoration:none !important; color:inherit !important; border-radius:10px; overflow:hidden; border:1.5px solid #ede9e4; transition:border-color .22s,box-shadow .22s,transform .22s; }
body.single .ph-rel-card:hover { border-color:#CC0000; box-shadow:0 8px 24px rgba(204,0,0,.09); transform:translateY(-2px); }
body.single .ph-rel-img { width:100%; aspect-ratio:16/9; object-fit:cover; display:block; }
body.single .ph-rel-body { padding:16px 18px; }
body.single .ph-rel-cat { font-size:10px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:#CC0000; margin-bottom:6px; display:block; font-family:'DM Sans',sans-serif; }
body.single .ph-rel-title { font-size:15px; font-weight:700; color:#111; line-height:1.3; margin-bottom:6px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; font-family:'DM Sans',sans-serif; }
body.single .ph-rel-card:hover .ph-rel-title { color:#CC0000; }
body.single .ph-rel-date { font-size:12px; color:#aaa; font-family:'DM Sans',sans-serif; }

@media(max-width:1024px){
    body.single #ph-hero { grid-template-columns:1fr 320px; gap:40px; }
    body.single #ph-body { grid-template-columns:180px 1fr; gap:40px; display:grid; }
}
@media(max-width:860px){
    body.single #ph-hero { grid-template-columns:1fr; }
    body.single #ph-thumb { order:-1; max-height:320px; aspect-ratio:16/9; }
    body.single #ph-body { grid-template-columns:1fr; }
    body.single #ph-toc-box { position:static; }
    body.single #ph-related-grid { grid-template-columns:1fr 1fr; }
    body.single #ph-single { padding:0 24px 64px; }
}
@media(max-width:560px){
    body.single #ph-single,
    body.single #ph-hero,
    body.single #ph-body,
    body.single #ph-author,
    body.single #ph-content { box-sizing:border-box; width:100%; max-width:100%; }
    body.single #ph-related-grid { grid-template-columns:1fr; }
    body.single #ph-author { flex-direction:column; padding:24px; }
    body.single .ph-sh span { display:none !important; }
    body.single .ph-sh { padding:8px 10px !important; }
    body.single #ph-single { padding:0 16px 48px; }
}

/* =============================================
   Affiliate-Boxen: Mobile Fix
   ============================================= */

@media (max-width: 600px) {

    body.single .wp-block-columns {
        flex-direction: column !important;
    }

    body.single .wp-block-column {
        flex-basis: 100% !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    body.single .wp-block-column figure {
        text-align: center;
        margin: 0 0 12px 0;
    }

    body.single .wp-block-column figure img {
        max-width: 160px !important;
        width: 160px !important;
        height: auto !important;
        margin: 0 auto;
    }

    body.single .wp-block-column .has-small-font-size {
        font-size: 14px !important;
        line-height: 1.6 !important;
    }

    /* Button: schöner + zentriert */
    body.single .wp-block-buttons {
        justify-content: center !important;
        margin-top: 12px !important;
    }

    body.single .wp-block-button {
        width: 100% !important;
        max-width: 280px !important;
        margin: 0 auto !important;
    }

    body.single .wp-block-button__link {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        padding: 13px 20px !important;
        border-radius: 8px !important;
        font-family: 'DM Sans', sans-serif !important;
        font-size: 15px !important;
        font-weight: 800 !important;
        letter-spacing: .03em !important;
        text-align: center !important;
        box-shadow: 0 3px 10px rgba(0,0,0,.18) !important;
        transition: opacity .2s, transform .15s !important;
    }

    body.single .wp-block-button__link:hover {
        opacity: .88 !important;
        transform: translateY(-1px) !important;
    }

    /* Amazon-spezifisch: kleines Icon davor */
    body.single .wp-block-button__link::before {
        content: '🛒';
        margin-right: 8px;
        font-size: 16px;
    }
}

/* =============================================
   Affiliate-Boxen: Desktop & Tablet
   ============================================= */

/* Gesamte Box */
body.single .wp-block-columns {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    background: #f7f5f2;
    border-radius: 12px;
    border: 1.5px solid #ede9e4;
    padding: 20px !important;
    margin: 0 0 28px !important;
    align-items: center !important;
    gap: 24px !important;
    transition: border-color .22s, box-shadow .22s;
}

body.single .wp-block-columns:hover {
    border-color: #CC0000;
    box-shadow: 0 6px 20px rgba(204,0,0,.08);
}

/* Bild-Spalte links: flex-basis beibehalten */
body.single .wp-block-column:first-child {
    flex: 0 0 33% !important;
    max-width: 33% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

body.single .wp-block-column:first-child figure,
body.single .wp-block-column:first-child figure.is-resized {
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}

/* Inline width:185px überschreiben */
body.single .wp-block-column:first-child figure img,
body.single .wp-block-column:first-child figure.is-resized img {
    width: 100% !important;
    max-width: 100% !important;
    max-height: 200px !important;
    height: auto !important;
    border-radius: 8px !important;
    object-fit: contain !important;
    display: block !important;
    margin: 0 auto !important;
}

/* Text-Spalte rechts */
body.single .wp-block-column:last-child {
    flex: 1 1 0 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 8px !important;
}

/* Produkttitel */
body.single .wp-block-column:last-child .has-small-font-size {
    font-size: 13.5px !important;
    line-height: 1.6 !important;
    color: #333 !important;
    font-family: 'DM Sans', sans-serif !important;
}

body.single .wp-block-column:last-child .has-small-font-size strong a {
    color: #111 !important;
    text-decoration: none !important;
    font-size: 14.5px !important;
    line-height: 1.4 !important;
}

body.single .wp-block-column:last-child .has-small-font-size strong a:hover {
    color: #CC0000 !important;
}

/* Bullet-Liste im Produkt */
body.single .wp-block-column:last-child .wp-block-list {
    margin: 4px 0 8px !important;
    padding-left: 18px !important;
}

body.single .wp-block-column:last-child .wp-block-list li {
    font-size: 12.5px !important;
    color: #666 !important;
    margin-bottom: 4px !important;
    font-family: 'DM Sans', sans-serif !important;
}

/* "Hier kann man es kaufen" Label */
body.single .wp-block-column:last-child p strong {
    font-size: 11px !important;
    color: #999 !important;
    text-transform: uppercase !important;
    letter-spacing: .1em !important;
    font-family: 'DM Sans', sans-serif !important;
}

/* Button Desktop */
body.single .wp-block-column:last-child .wp-block-button__link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 11px 22px !important;
    border-radius: 8px !important;
    font-family: 'DM Sans', sans-serif !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    letter-spacing: .03em !important;
    box-shadow: 0 3px 10px rgba(0,0,0,.15) !important;
    transition: opacity .2s, transform .15s !important;
    text-decoration: none !important;
}

body.single .wp-block-column:last-child .wp-block-button__link:hover {
    opacity: .88 !important;
    transform: translateY(-1px) !important;
}

body.single .wp-block-column:last-child .wp-block-button__link::before {
    content: '🛒';
    margin-right: 8px;
    font-size: 15px;
}

/* Tablet: etwas kompakter */
@media (max-width: 768px) {
    body.single .wp-block-columns {
        padding: 16px !important;
        gap: 16px !important;
    }

    body.single .wp-block-column:first-child figure img {
        max-height: 140px !important;
    }
}