.builder-wrapper {
    max-width: 1280px;
    margin: 1.5rem auto 3rem;
    padding: 0 1.5rem;
    font-family: 'Plus Jakarta Sans', sans-serif;
    color: #2D3748;
}

.builder-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #FFFFFF;
    padding: 1.5rem 2rem;
    border-radius: 14px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.03);
    margin-bottom: 2rem;
    border: 1px solid #EDF2F7;
}

.builder-header h1 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 2.3rem;
    margin: 0;
    color: #1A202C;
}

.builder-header p {
    margin: 0.35rem 0 0;
    color: #718096;
    font-size: 1.05rem;
}

.tier-badge {
    background: #F7FAFC;
    padding: 0.6rem 1.25rem;
    border-radius: 999px;
    border: 1px solid #E2E8F0;
    font-size: 0.9rem;
    color: #2D3748;
    display: flex;
    align-items: center;
    gap: 0.6rem;
}
.tier-badge i { color: #A77B48; }

/* KEUZESCHAKELAAR TUSSEN MODEL 1 EN MODEL 2 */
.vv-mode-selector {
    margin-bottom: 2rem;
}

.vv-selector-title {
    font-size: 0.9rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #718096;
    margin-bottom: 0.75rem;
}

.vv-mode-tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
}

.vv-tab-btn {
    display: flex;
    align-items: center;
    gap: 1rem;
    background: #FFFFFF;
    border: 2px solid #E2E8F0;
    border-radius: 12px;
    padding: 1.25rem 1.5rem;
    text-align: left;
    cursor: pointer;
    transition: all 0.25s ease;
}

.vv-tab-btn:hover {
    border-color: #CBD5E0;
    background: #F8FAFC;
    transform: translateY(-2px);
}

.vv-tab-btn.active {
    border-color: #A77B48;
    background: #FFFFFF;
    box-shadow: 0 8px 20px rgba(253, 103, 33, 0.12);
}

.vv-tab-icon {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background: #EDF2F7;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.15rem;
    color: #4A5568;
    flex-shrink: 0;
    transition: all 0.25s ease;
}

.vv-tab-btn.active .vv-tab-icon {
    background: #A77B48;
    color: #FFFFFF;
}

.vv-tab-text {
    display: flex;
    flex-direction: column;
}

.vv-tab-text strong {
    font-size: 1.05rem;
    color: #1A202C;
    margin-bottom: 0.2rem;
}

.vv-tab-text small {
    font-size: 0.85rem;
    color: #718096;
}

/* MODEL 1 ASSISTENT CARD */
.ai-assistant-card {
    background: linear-gradient(135deg, #FFFFFF 0%, #F8FAFC 100%);
    border: 2px solid #A77B48;
    border-radius: 14px;
    padding: 2.25rem;
    margin-bottom: 2.5rem;
    box-shadow: 0 10px 30px rgba(253, 103, 33, 0.08);
}

.ai-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: #A77B48;
    color: #FFFFFF !important;
    font-size: 0.8rem;
    font-weight: 700;
    padding: 0.35rem 0.85rem;
    border-radius: 999px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.75rem;
}

.ai-assistant-header h2 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 2rem;
    margin: 0 0 0.5rem;
    color: #1A202C;
}

.ai-assistant-header p {
    margin: 0 0 1.5rem;
    color: #4A5568;
    font-size: 0.95rem;
    max-width: 800px;
    line-height: 1.6;
}

.ai-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
}

.ai-field-group {
    display: flex;
    flex-direction: column;
}

.ai-field-group.full-width {
    grid-column: 1 / -1;
}

.ai-field-group label {
    font-size: 0.85rem;
    font-weight: 700;
    color: #2D3748;
    margin-bottom: 0.4rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.ai-field-group label i {
    color: #A77B48;
}

.ai-field-group input,
.ai-field-group textarea,
.ai-field-group select {
    padding: 0.75rem 1rem;
    border: 1.5px solid #CBD5E0;
    border-radius: 8px;
    font-size: 1rem;
    font-family: inherit;
    background: #FFFFFF;
    transition: all 0.2s;
}

.ai-field-group input:focus,
.ai-field-group textarea:focus,
.ai-field-group select:focus {
    border-color: #A77B48;
    outline: none;
    box-shadow: 0 0 0 3px rgba(253, 103, 33, 0.15);
}

.ai-submit-wrap {
    justify-content: flex-end;
}

/* ORANJE BUTTON: ALTIJD WITTE TEKST & DONKERDER BIJ HOVER */
.btn-ai-generate,
.btn-cta-generate,
.btn-sidebar-cta,
.btn-cta-upgrade,
.vv-btn-submit-checkout {
    background: linear-gradient(135deg, #A77B48 0%, #93683B 100%) !important;
    color: #FFFFFF !important;
    border: none;
    padding: 0.85rem 1.75rem;
    border-radius: 8px;
    font-weight: 700;
    font-size: 1.05rem;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    box-shadow: 0 4px 14px rgba(253, 103, 33, 0.3);
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
    height: 50px;
    text-decoration: none;
}

.btn-ai-generate:hover,
.btn-cta-generate:hover,
.btn-sidebar-cta:hover,
.btn-cta-upgrade:hover,
.vv-btn-submit-checkout:hover {
    background: linear-gradient(135deg, #93683B 0%, #C84507 100%) !important;
    color: #FFFFFF !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 22px rgba(200, 69, 7, 0.45) !important;
}

.ai-loading {
    margin-top: 1.25rem;
    font-weight: 600;
    color: #A77B48;
    font-size: 1rem;
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

/* BUILDER GRID & EDITOR */
.builder-grid {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    gap: 2rem;
}

.editor-pane, .preview-pane {
    display: flex;
    flex-direction: column;
}

.input-card {
    background: #FFFFFF;
    padding: 1.25rem 1.5rem;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.03);
    border: 1px solid #EDF2F7;
    margin-bottom: 1.5rem;
}

.editor-title-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}

.editor-title-bar label {
    font-size: 0.85rem;
    font-weight: 700;
    color: #4A5568;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.vv-mode-pill {
    font-size: 0.75rem;
    color: #A77B48;
    background: #EBF8FF;
    padding: 0.25rem 0.65rem;
    border-radius: 999px;
    font-weight: 700;
}

.input-card input {
    width: 100%;
    padding: 0.75rem 1rem;
    border: 1px solid #CBD5E0;
    border-radius: 8px;
    font-size: 1.15rem;
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
    box-sizing: border-box;
}

.stanza-card {
    background: #FFFFFF;
    padding: 1.5rem;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.03);
    border: 1px solid #EDF2F7;
    margin-bottom: 1.5rem;
}

.stanza-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.25rem;
}

.stanza-header h3 {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 700;
    color: #2D3748;
}

.rhyme-indicator {
    background: #DEF7EC;
    color: #03543F;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0.3rem 0.75rem;
    border-radius: 999px;
}

.rhyme-indicator.indicator-2 {
    background: #E1EFFE;
    color: #1E429F;
}

.line-input-group {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.85rem;
}

.line-num {
    width: 22px;
    font-weight: 700;
    font-size: 0.85rem;
    color: #A0AEC0;
    text-align: right;
}

.poem-line {
    flex: 1;
    padding: 0.7rem 0.9rem;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.2s ease;
}

.poem-line:focus {
    border-color: #A77B48;
    outline: none;
    box-shadow: 0 0 0 3px rgba(253, 103, 33, 0.15);
}

.highlight-stanza-1 .poem-line {
    border-color: #38A169;
    background-color: #F0FFF4;
}

.highlight-stanza-2 .poem-line {
    border-color: #A77B48;
    background-color: #EBF8FF;
}

.btn-rhyme-help {
    background: #EDF2F7;
    border: none;
    border-radius: 8px;
    padding: 0.7rem 0.9rem;
    cursor: pointer;
    color: #4A5568;
    transition: background 0.2s;
}

.btn-rhyme-help:hover {
    background: #E2E8F0;
    color: #2D3748;
}

.rhyme-status-msg {
    font-size: 0.825rem;
    margin-top: 0.5rem;
    padding-left: 2rem;
}

.rhyme-match { color: #2F855A; font-weight: 600; }
.rhyme-mismatch { color: #DD6B20; font-weight: 500; }

.rhyme-suggestions-box {
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    padding: 1.25rem;
    margin-bottom: 1.5rem;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
}

.rhyme-chip {
    display: inline-block;
    background: #EDF2F7;
    border: 1px solid #CBD5E0;
    padding: 0.35rem 0.75rem;
    border-radius: 6px;
    font-size: 0.85rem;
    margin: 0.25rem 0.25rem 0 0;
    cursor: pointer;
}

.rhyme-chip:hover {
    background: #A77B48;
    color: #FFFFFF;
}

.editor-actions {
    display: flex;
    gap: 1rem;
}

.btn-primary {
    flex: 2;
    background: #A77B48;
    color: #FFFFFF !important;
    border: none;
    padding: 0.95rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 1rem;
    cursor: pointer;
    text-align: center;
    transition: background 0.2s;
}

.btn-primary:hover {
    background: #D44E0D;
    color: #FFFFFF !important;
}

.btn-secondary {
    flex: 1;
    background: #EDF2F7;
    color: #4A5568;
    border: none;
    padding: 0.95rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    cursor: pointer;
}

/* Boek & Perkament Preview */
.book-preview-card {
    background: #FAF8F5;
    border: 1px solid #E8E2D5;
    border-radius: 12px;
    padding: 3.5rem 2.5rem;
    box-shadow: inset 0 0 50px rgba(0,0,0,0.02), 0 10px 25px rgba(0,0,0,0.05);
    text-align: center;
    position: relative;
    min-height: 520px;
}

.preview-inner h2 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 2.3rem;
    font-weight: 700;
    margin: 0 0 0.5rem;
    color: #1A202C;
}

.ornament {
    font-size: 1.3rem;
    color: #A0AEC0;
    margin-bottom: 2rem;
}

.preview-stanza {
    margin-bottom: 2rem;
}

.preview-stanza p {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.15rem;
    line-height: 1.85;
    margin: 0.25rem 0;
    color: #2D3748;
}

.preview-stanza p.empty-line {
    color: #CBD5E0;
    font-style: italic;
}

.preview-footer {
    margin-top: 3rem;
    font-size: 0.85rem;
    color: #A0AEC0;
    font-style: italic;
}

.preview-actions {
    display: flex;
    gap: 1rem;
    margin-top: 1.5rem;
}

.btn-tool {
    flex: 1;
    background: #FFFFFF;
    border: 1px solid #CBD5E0;
    border-radius: 8px;
    padding: 0.85rem;
    cursor: pointer;
    font-size: 0.9rem;
    font-weight: 600;
    color: #4A5568;
    transition: all 0.2s;
}

.btn-tool:hover {
    background: #F7FAFC;
    border-color: #A77B48;
    color: #A77B48;
}

/* Social media sharing knoppen */
.btn-social-share {
    border: none;
    border-radius: 8px;
    padding: 0.6rem 1rem;
    font-size: 0.85rem;
    font-weight: 700;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: transform 0.2s, opacity 0.2s;
}

.btn-social-share:hover {
    opacity: 0.9;
    transform: translateY(-2px);
}

/* Paywall Modal */
.vers-modal-backdrop {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.65);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999999;
}

.vers-modal-content {
    background: #FFFFFF;
    width: 90%;
    max-width: 460px;
    border-radius: 14px;
    padding: 2.5rem;
    text-align: center;
    position: relative;
    box-shadow: 0 20px 40px rgba(0,0,0,0.2);
}

.modal-close {
    position: absolute;
    top: 1rem; right: 1.25rem;
    border: none; background: none;
    font-size: 1.75rem;
    cursor: pointer;
    color: #A0AEC0;
}

.modal-icon {
    font-size: 2.75rem;
    color: #A77B48;
    margin-bottom: 0.75rem;
}

.vers-modal-content h2 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 2rem;
    margin: 0 0 0.5rem;
}

.pricing-card {
    background: #F8FAFC;
    border: 1px solid #E2E8F0;
    border-radius: 10px;
    padding: 1.5rem;
    margin: 1.5rem 0;
}

.pricing-card .price {
    font-size: 2.5rem;
    font-weight: 800;
    color: #A77B48;
}

.pricing-card .period {
    color: #718096;
    font-size: 0.95rem;
}

.pricing-card .perks {
    list-style: none;
    padding: 0;
    margin: 1.25rem 0 0;
    text-align: left;
    font-size: 0.9rem;
}

.pricing-card .perks li {
    margin-bottom: 0.6rem;
    color: #4A5568;
}

.pricing-card .perks i {
    color: #38A169;
    margin-right: 0.6rem;
}

@media (max-width: 860px) {
    .vv-mode-tabs { grid-template-columns: 1fr; }
    .ai-form-grid { grid-template-columns: 1fr; }
    .builder-grid { grid-template-columns: 1fr; }
}

/* ========================================================== */
/* AFREKENPAGINA STYLING                                      */
/* ========================================================== */
.vv-checkout-styled-wrapper {
    max-width: 1280px;
    margin: 2rem auto 4rem;
}

.vv-checkout-methods-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 0.75rem;
    margin: 1.25rem 0;
}

.vv-method-chip {
    background: #FFFFFF;
    border: 1.5px solid #CBD5E0;
    border-radius: 8px;
    padding: 0.75rem 0.5rem;
    text-align: center;
    font-size: 0.85rem;
    font-weight: 700;
    color: #4A5568;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.35rem;
    transition: all 0.2s ease;
}

.vv-method-chip i {
    font-size: 1.25rem;
    color: #A77B48;
}

.vv-method-chip.active,
.vv-method-chip:hover {
    border-color: #A77B48;
    background: #F7FAFC;
    color: #1A202C;
    box-shadow: 0 4px 10px rgba(253, 103, 33, 0.08);
}

/* ========================================================== */
/* v14.0 ESTHETIEK, THEMA'S & ZEN SCHRIJFMODUS               */
/* ========================================================== */

/* Zen Modus Knop in Editor */
.btn-zen-mode {
    background: #FAF8F5;
    border: 1px solid #CBD5E0;
    color: #4A5568;
    border-radius: 999px;
    padding: 3px 12px;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    transition: all 0.2s ease;
}
.btn-zen-mode:hover {
    background: #A77B48;
    color: #FFFFFF;
    border-color: #A77B48;
}

/* Zen Schrijfmodus (Volledig Scherm zonder afleiding) */
body.vv-zen-active {
    overflow: hidden !important;
}
body.vv-zen-active .builder-header,
body.vv-zen-active .vv-mode-tabs-container,
body.vv-zen-active .ai-assistant-card,
body.vv-zen-active .preview-pane,
body.vv-zen-active .social-share-panel,
body.vv-zen-active .site-header,
body.vv-zen-active .site-footer,
body.vv-zen-active #wpadminbar {
    display: none !important;
}
body.vv-zen-active .builder-wrapper {
    max-width: 800px !important;
    margin: 2rem auto !important;
    padding: 0 1rem !important;
}
body.vv-zen-active .builder-grid {
    grid-template-columns: 1fr !important;
}
body.vv-zen-active .editor-pane {
    background: #FAF8F5;
    padding: 2.5rem;
    border-radius: 16px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.06);
    border: 1px solid #E8E2D5;
}
.btn-exit-zen {
    position: fixed;
    top: 20px;
    right: 25px;
    background: #1A202C;
    color: #FFF;
    border: none;
    border-radius: 999px;
    padding: 8px 18px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    z-index: 999999;
    box-shadow: 0 4px 14px rgba(0,0,0,0.25);
    display: none;
}
body.vv-zen-active .btn-exit-zen {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
}

/* Compact dropdown voor de prentstijlen */
.vv-prent-style-label {
    font-size: 11px;
    font-weight: 800;
    color: #64748B;
    text-transform: uppercase;
    letter-spacing: .045em;
}
.vv-prent-style-select {
    min-width: 210px;
    max-width: 100%;
    background: #FFFFFF;
    border: 1px solid #D7DEE7;
    color: #263449;
    border-radius: 9px;
    padding: 10px 38px 10px 12px;
    font: inherit;
    font-size: 13px;
    font-weight: 650;
    line-height: 1.35;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
}
.vv-prent-style-select:hover,
.vv-prent-style-select:focus {
    border-color: #8BA6C8;
    outline: none;
    box-shadow: 0 0 0 3px rgba(253, 103, 33, .10);
}
.vv-prent-style-select option {
    color: #263449;
    background: #FFFFFF;
}

/* Stijl 1: Klassiek Perkament (Standaard) */
.book-preview-card.theme-parchment {
    background: #FAF8F5 !important;
    border: 1px solid #E8E2D5 !important;
    color: #2D3748 !important;
}
.book-preview-card.theme-parchment h2 {
    color: #1A202C !important;
    font-family: 'Cormorant Garamond', Georgia, serif;
}
.book-preview-card.theme-parchment p {
    color: #2D3748 !important;
    font-family: 'Cormorant Garamond', Georgia, serif;
    line-height: 1.85;
}

/* Stijl 2: Modern Minimalistisch */
.book-preview-card.theme-minimal {
    background: #FFFFFF !important;
    border: 1.5px solid #E2E8F0 !important;
    color: #1A202C !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.04) !important;
}
.book-preview-card.theme-minimal h2 {
    color: #0F172A !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: -0.02em;
}
.book-preview-card.theme-minimal .ornament {
    color: #CBD5E0 !important;
}
.book-preview-card.theme-minimal p {
    color: #334155 !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 1.02rem !important;
    line-height: 1.8 !important;
}

/* Stijl 3: Diepe Nacht (Donker & Goud) */
.book-preview-card.theme-night {
    background: #0F172A !important;
    border: 1.5px solid #1E293B !important;
    color: #F8FAFC !important;
    box-shadow: 0 12px 35px rgba(15,23,42,0.35) !important;
}
.book-preview-card.theme-night h2 {
    color: #F1F5F9 !important;
    font-family: 'Cormorant Garamond', Georgia, serif !important;
}
.book-preview-card.theme-night .ornament {
    color: #D4AF37 !important; /* Subtiel goud */
}
.book-preview-card.theme-night p {
    color: #E2E8F0 !important;
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    line-height: 1.85 !important;
}
.book-preview-card.theme-night p.empty-line {
    color: #475569 !important;
}
.book-preview-card.theme-night .preview-footer,
.book-preview-card.theme-night .preview-date {
    color: #64748B !important;
}

/* Syllable cadans badge naast elke regel */
.syllable-tag {
    font-size: 10px;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 999px;
    background: #EDF2F7;
    color: #718096;
    margin-left: 6px;
    letter-spacing: 0.02em;
    display: inline-block;
    transition: all 0.2s ease;
}
.syllable-tag.good {
    background: #DEF7EC;
    color: #03543F;
}
.syllable-tag.warn {
    background: #FEF08A;
    color: #854D0E;
}


/* ========================================================== */
/* EXTRA PRENT THEMA'S (Sinterklaas, Kerst, Huwelijk, e.d.)    */
/* ========================================================== */
.book-preview-card.theme-sint {
    background: #801818 !important;
    border: 2px solid #5A0F0F !important;
    color: #FFF6E5 !important;
    box-shadow: inset 0 0 40px rgba(0, 0, 0, 0.4), 0 10px 25px rgba(128, 24, 24, 0.25) !important;
}
.book-preview-card.theme-sint h2,
.book-preview-card.theme-sint p {
    color: #FFF6E5 !important;
}
.book-preview-card.theme-sint .ornament {
    color: #F1C40F !important;
}
.book-preview-card.theme-sint .preview-footer,
.book-preview-card.theme-sint .preview-date {
    color: #ECC068 !important;
}

.book-preview-card.theme-kerst {
    background: #143526 !important;
    border: 2px solid #0D2319 !important;
    color: #F9F4E8 !important;
    box-shadow: inset 0 0 45px rgba(0, 0, 0, 0.45), 0 10px 25px rgba(20, 53, 38, 0.25) !important;
}
.book-preview-card.theme-kerst h2,
.book-preview-card.theme-kerst p {
    color: #F9F4E8 !important;
}
.book-preview-card.theme-kerst .ornament {
    color: #D4AF37 !important;
}
.book-preview-card.theme-kerst .preview-footer,
.book-preview-card.theme-kerst .preview-date {
    color: #D4AF37 !important;
}

.book-preview-card.theme-rose {
    background: #FFF7F8 !important;
    border: 1.5px solid #F5DDE2 !important;
    color: #4A3337 !important;
    box-shadow: inset 0 0 35px rgba(220, 150, 165, 0.12), 0 10px 25px rgba(200, 109, 125, 0.08) !important;
}
.book-preview-card.theme-rose h2,
.book-preview-card.theme-rose p {
    color: #4A3337 !important;
}
.book-preview-card.theme-rose .ornament {
    color: #C86D7D !important;
}
.book-preview-card.theme-rose .preview-footer,
.book-preview-card.theme-rose .preview-date {
    color: #C86D7D !important;
}

.book-preview-card.theme-sage {
    background: #F2F6F4 !important;
    border: 1.5px solid #D5E2D9 !important;
    color: #1E3329 !important;
    box-shadow: inset 0 0 35px rgba(74, 124, 89, 0.08), 0 10px 25px rgba(74, 124, 89, 0.06) !important;
}
.book-preview-card.theme-sage h2,
.book-preview-card.theme-sage p {
    color: #1E3329 !important;
}
.book-preview-card.theme-sage .ornament {
    color: #4A7C59 !important;
}
.book-preview-card.theme-sage .preview-footer,
.book-preview-card.theme-sage .preview-date {
    color: #4A7C59 !important;
}



/* Tien extra prentstijlen: afgestemd op natuur, seizoenen en bijzondere momenten */
.book-preview-card.theme-ocean { background:#EAF4F8 !important; border:1px solid #C7E0EA !important; color:#183B4A !important; box-shadow:0 8px 24px rgba(31,91,112,.07) !important; }
.book-preview-card.theme-ocean h2,.book-preview-card.theme-ocean p { color:#183B4A !important; }
.book-preview-card.theme-ocean .ornament,.book-preview-card.theme-ocean .preview-footer,.book-preview-card.theme-ocean .preview-date { color:#327C96 !important; }
.book-preview-card.theme-forest { background:#EEF3E8 !important; border:1px solid #D5E1CA !important; color:#2D432D !important; box-shadow:0 8px 24px rgba(54,83,47,.06) !important; }
.book-preview-card.theme-forest h2,.book-preview-card.theme-forest p { color:#2D432D !important; }
.book-preview-card.theme-forest .ornament,.book-preview-card.theme-forest .preview-footer,.book-preview-card.theme-forest .preview-date { color:#55794A !important; }
.book-preview-card.theme-lavender { background:#F4F0FA !important; border:1px solid #E0D5F0 !important; color:#403456 !important; box-shadow:0 8px 24px rgba(104,81,145,.06) !important; }
.book-preview-card.theme-lavender h2,.book-preview-card.theme-lavender p { color:#403456 !important; }
.book-preview-card.theme-lavender .ornament,.book-preview-card.theme-lavender .preview-footer,.book-preview-card.theme-lavender .preview-date { color:#8B72B4 !important; }
.book-preview-card.theme-sunrise { background:#FFF1E5 !important; border:1px solid #F5D6BD !important; color:#5B3929 !important; box-shadow:0 8px 24px rgba(176,103,57,.06) !important; }
.book-preview-card.theme-sunrise h2,.book-preview-card.theme-sunrise p { color:#5B3929 !important; }
.book-preview-card.theme-sunrise .ornament,.book-preview-card.theme-sunrise .preview-footer,.book-preview-card.theme-sunrise .preview-date { color:#C87548 !important; }
.book-preview-card.theme-autumn { background:#F8EEE2 !important; border:1px solid #EBD5BB !important; color:#563A2B !important; box-shadow:0 8px 24px rgba(120,75,36,.06) !important; }
.book-preview-card.theme-autumn h2,.book-preview-card.theme-autumn p { color:#563A2B !important; }
.book-preview-card.theme-autumn .ornament,.book-preview-card.theme-autumn .preview-footer,.book-preview-card.theme-autumn .preview-date { color:#A95D32 !important; }
.book-preview-card.theme-sky { background:#EFF7FF !important; border:1px solid #D2E5F7 !important; color:#23415D !important; box-shadow:0 8px 24px rgba(56,111,162,.05) !important; }
.book-preview-card.theme-sky h2,.book-preview-card.theme-sky p { color:#23415D !important; }
.book-preview-card.theme-sky .ornament,.book-preview-card.theme-sky .preview-footer,.book-preview-card.theme-sky .preview-date { color:#4C8BBE !important; }
.book-preview-card.theme-midsummer { background:#FFFBE8 !important; border:1px solid #F0E4A8 !important; color:#51451D !important; box-shadow:0 8px 24px rgba(166,143,48,.05) !important; }
.book-preview-card.theme-midsummer h2,.book-preview-card.theme-midsummer p { color:#51451D !important; }
.book-preview-card.theme-midsummer .ornament,.book-preview-card.theme-midsummer .preview-footer,.book-preview-card.theme-midsummer .preview-date { color:#A58A27 !important; }
.book-preview-card.theme-valentine { background:#FFF0F3 !important; border:1px solid #F4CDD7 !important; color:#5B2939 !important; box-shadow:0 8px 24px rgba(183,74,108,.06) !important; }
.book-preview-card.theme-valentine h2,.book-preview-card.theme-valentine p { color:#5B2939 !important; }
.book-preview-card.theme-valentine .ornament,.book-preview-card.theme-valentine .preview-footer,.book-preview-card.theme-valentine .preview-date { color:#C25278 !important; }
.book-preview-card.theme-memorial { background:#F1F2F4 !important; border:1px solid #D9DDE3 !important; color:#343B46 !important; box-shadow:0 8px 24px rgba(40,48,60,.04) !important; }
.book-preview-card.theme-memorial h2,.book-preview-card.theme-memorial p { color:#343B46 !important; }
.book-preview-card.theme-memorial .ornament,.book-preview-card.theme-memorial .preview-footer,.book-preview-card.theme-memorial .preview-date { color:#77818F !important; }
.book-preview-card.theme-birthday { background:#FFF2FA !important; border:1px solid #F1D3E8 !important; color:#56304F !important; box-shadow:0 8px 24px rgba(157,79,139,.05) !important; }
.book-preview-card.theme-birthday h2,.book-preview-card.theme-birthday p { color:#56304F !important; }
.book-preview-card.theme-birthday .ornament,.book-preview-card.theme-birthday .preview-footer,.book-preview-card.theme-birthday .preview-date { color:#B35D9F !important; }

/* Landingspagina Thema Styling */
.vv-theme-landing-page {
    max-width: 1250px;
    margin: 0 auto;
    padding: 2rem 1.5rem 4rem;
    font-family: 'Plus Jakarta Sans', sans-serif;
}

.vv-landing-header {
    text-align: center;
    margin-bottom: 2.25rem;
}

.vv-landing-badge {
    display: inline-block;
    padding: 0.35rem 1.15rem;
    border-radius: 999px;
    background: #F7FAFC;
    color: var(--landing-accent, #A77B48);
    border: 1px solid #E2E8F0;
    font-size: 0.825rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.75rem;
}

.vv-landing-header h1 {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: 2.75rem;
    font-weight: 700;
    margin: 0 0 0.5rem 0;
    color: #1A202C;
}

.vv-landing-lead {
    font-size: 1.15rem;
    color: #4A5568;
    max-width: 700px;
    margin: 0 auto 1.5rem auto;
    line-height: 1.7;
}

.vv-theme-chips-bar {
    display: flex;
    gap: 8px;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    margin-top: 1rem;
}

.vv-chips-title {
    font-size: 0.9rem;
    font-weight: 700;
    color: #4A5568;
}

.vv-topic-chip {
    background: #FFFFFF;
    border: 1.5px solid #CBD5E0;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 0.875rem;
    font-weight: 600;
    color: #2D3748;
    cursor: pointer;
    transition: all 0.2s ease;
}

.vv-topic-chip:hover {
    border-color: var(--landing-accent, #A77B48);
    color: var(--landing-accent, #A77B48);
    background: #FBF4EA;
    transform: translateY(-1px);
}

.vv-landing-perks {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.75rem;
    margin-top: 3.5rem;
}

.vv-perk-card {
    background: #FFFFFF;
    border: 1.5px solid #E2E8F0;
    border-radius: 14px;
    padding: 1.75rem 2rem;
    box-shadow: 0 4px 15px rgba(0,0,0,0.03);
}

.vv-perk-card h3 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.5rem;
    margin-bottom: 0.85rem;
    color: #1A202C;
    display: flex;
    align-items: center;
    gap: 8px;
}

.vv-perk-card ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.vv-perk-card li {
    font-size: 0.95rem;
    color: #4A5568;
    margin-bottom: 0.65rem;
    display: flex;
    align-items: flex-start;
    gap: 8px;
    line-height: 1.6;
}

@media (max-width: 768px) {
    .vv-landing-perks {
        grid-template-columns: 1fr;
    }
    .vv-landing-header h1 {
        font-size: 2.2rem;
    }
}


/* Themas Overzicht Hero Styling */
@media (max-width: 768px) {
    .themas-hero-section {
        padding: 2.25rem 1.25rem 2rem !important;
    }
    .themas-hero-section h1 {
        font-size: 2.15rem !important;
    }
    .themas-feature-pills {
        grid-template-columns: 1fr !important;
    }
}

.vv-checkout-input {
    width: 100% !important;
    padding: 0.8rem 1rem !important;
    border: 1.5px solid #CBD5E0 !important;
    border-radius: 8px !important;
    font-size: 1rem !important;
    font-family: inherit !important;
    background: #FFFFFF !important;
    color: #2D3748 !important;
}
.vv-checkout-input:focus {
    border-color: #A77B48 !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(48,93,158,0.15) !important;
}

/* ==========================================================================
   VERS & VORM BUILDER - VOLLEDIGE MOBIELE VERFIJNING (max-width: 768px)
   ========================================================================== */

@media screen and (max-width: 768px) {
    .builder-wrapper {
        margin: 1rem auto 2.5rem !important;
        padding: 0 12px !important;
    }

    .builder-header {
        flex-direction: column !important;
        align-items: flex-start !important;
        padding: 1.25rem !important;
        gap: 0.75rem !important;
    }

    .builder-header h1 {
        font-size: 1.85rem !important;
    }

    .vv-mode-tabs {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
    }

    .vv-tab-btn {
        width: 100% !important;
        padding: 12px 14px !important;
        transition: transform 0.1s ease, border-color 0.2s ease !important;
    }

    .vv-tab-btn:active {
        transform: scale(0.98) !important;
    }

    .ai-assistant-card {
        padding: 1.25rem !important;
    }

    .ai-assistant-header h2 {
        font-size: 1.6rem !important;
    }

    .builder-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 1.5rem !important;
    }

    .stanza-card {
        padding: 1.25rem 1rem !important;
    }

    .line-input-group {
        gap: 6px !important;
    }

    .poem-line {
        font-size: 16px !important;
        padding: 10px 8px !important;
    }

    .syllable-margin-tag {
        font-size: 10px !important;
        padding: 2px 5px !important;
    }

    .preview-theme-selector {
        overflow-x: auto !important;
        white-space: nowrap !important;
        padding-bottom: 6px !important;
        width: 100% !important;
        scrollbar-width: none !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .preview-theme-selector::-webkit-scrollbar {
        display: none !important;
    }

    .vv-prent-style-select {
        flex: 1 1 210px;
        min-width: 0;
    }

    .editor-actions,
    .preview-actions {
        flex-direction: column !important;
        gap: 10px !important;
    }

    .social-share-buttons {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 8px !important;
    }

    .btn-social-share {
        justify-content: center !important;
        width: 100% !important;
    }

    .btn-social-share:active {
        transform: scale(0.97) !important;
    }

    .btn-ai-generate:active,
    .btn-tool:active,
    .btn-primary:active {
        transform: scale(0.98) !important;
    }

    .vers-modal-content {
        width: 95% !important;
        max-width: 95% !important;
        padding: 2rem 1.25rem !important;
        max-height: 90vh !important;
        overflow-y: auto !important;
    }
}

@media (max-width: 768px) {
    .builder-wrapper {
        padding: 0 1rem !important;
        margin: 1rem auto 2.5rem !important;
    }
    .input-card, .stanza-card, .book-preview-card {
        padding: 1.25rem 1rem !important;
    }
    .preview-stanza p {
        font-size: 0.98rem !important;
        line-height: 1.7 !important;
    }
}


/* ==========================================================================
   COMPACTE RUIMTE VOOR DICHTERS STUDIO EN THEMA ELEMENTEN OP MOBIEL (<= 768px)
   ========================================================================== */
@media screen and (max-width: 768px) {
    /* 1. Algemene wrapper & content ruimte minimaliseren */
    .site-content {
        padding: 1rem 0 2rem 0 !important;
    }

    /* 2. Studio Builder Wrapper & Headers */
    .builder-wrapper {
        margin: 0.5rem auto 1.5rem !important;
        padding: 0 10px !important;
    }

    .builder-header {
        padding: 1rem 1rem !important;
        margin-bottom: 1rem !important;
        gap: 0.5rem !important;
        border-radius: 12px !important;
    }

    .builder-header h1 {
        font-size: 1.6rem !important;
        margin-bottom: 0.15rem !important;
    }

    .builder-header p {
        font-size: 0.9rem !important;
        margin: 0 !important;
    }

    .tier-badge {
        padding: 0.4rem 0.85rem !important;
        font-size: 0.8rem !important;
    }

    /* 3. Modus Schakelaars (Model 1, 2, 3) */
    .vv-mode-tabs-container {
        margin-bottom: 1rem !important;
    }

    .vv-mode-tabs-container > div:first-child {
        margin-bottom: 6px !important;
        font-size: 11px !important;
    }

    .vv-mode-tabs {
        gap: 8px !important;
    }

    .vv-tab-btn {
        padding: 10px 12px !important;
        border-radius: 8px !important;
        gap: 10px !important;
    }

    .vv-tab-btn span[style*="width: 36px"],
    .vv-tab-icon {
        width: 32px !important;
        height: 32px !important;
        font-size: 14px !important;
    }

    .vv-tab-btn strong {
        font-size: 13px !important;
    }

    .vv-tab-btn small {
        font-size: 10px !important;
    }

    /* 4. Model 1 & 3 Assistent Kaarten */
    .ai-assistant-card {
        padding: 1rem !important;
        margin-bottom: 1rem !important;
        border-radius: 12px !important;
    }

    .ai-assistant-header {
        margin-bottom: 1rem !important;
    }

    .ai-assistant-header h2 {
        font-size: 1.4rem !important;
        margin-bottom: 0.25rem !important;
        line-height: 1.25 !important;
    }

    .ai-assistant-header p {
        font-size: 0.88rem !important;
        line-height: 1.5 !important;
        margin-bottom: 0.5rem !important;
    }

    .ai-field-group {
        margin-bottom: 0.5rem !important;
    }

    .ai-field-group label {
        font-size: 0.82rem !important;
        margin-bottom: 0.25rem !important;
    }

    .ai-field-group textarea,
    .ai-field-group input,
    .ai-field-group select {
        padding: 10px !important;
        font-size: 15px !important;
    }

    /* 5. Model 2 Werkblad, Invoervelden & Stanza Kaarten */
    .builder-grid {
        gap: 1rem !important;
    }

    .input-card {
        padding: 1rem 0.85rem !important;
        margin-bottom: 0.85rem !important;
        border-radius: 10px !important;
    }

    .stanza-card {
        padding: 1rem 0.85rem !important;
        margin-bottom: 0.85rem !important;
        border-radius: 10px !important;
    }

    .stanza-header {
        margin-bottom: 0.85rem !important;
    }

    .stanza-header h3 {
        font-size: 1.05rem !important;
    }

    .line-input-group {
        gap: 6px !important;
        margin-bottom: 0.6rem !important;
    }

    .poem-line {
        padding: 8px 10px !important;
        font-size: 15px !important;
        border-radius: 6px !important;
    }

    .btn-rhyme-help {
        padding: 8px 10px !important;
    }

    .rhyme-status-msg {
        margin-top: 0.35rem !important;
        padding-left: 0.5rem !important;
        font-size: 0.78rem !important;
    }

    .editor-actions {
        margin-top: 0.5rem !important;
        gap: 8px !important;
    }

    /* 6. Live Boek / Perkament Preview Kaart */
    .preview-pane > div:first-child {
        margin-bottom: 8px !important;
        gap: 6px !important;
    }

    .preview-theme-selector {
        padding-bottom: 4px !important;
        margin-bottom: 4px !important;
        gap: 4px !important;
    }

    .vv-prent-style-select {
        width: 100%;
        min-width: 0;
        font-size: 12px !important;
    }

    .book-preview-card {
        padding: 1.75rem 1rem 1.5rem !important;
        min-height: auto !important;
        margin-bottom: 1rem !important;
        border-radius: 12px !important;
    }

    .book-preview-card .preview-inner h2 {
        font-size: 1.65rem !important;
        margin-bottom: 0.25rem !important;
    }

    .book-preview-card .ornament {
        font-size: 1rem !important;
        margin-bottom: 1rem !important;
    }

    .preview-stanza {
        margin-bottom: 1rem !important;
    }

    .preview-stanza p {
        font-size: 0.95rem !important;
        line-height: 1.6 !important;
        margin: 0.15rem 0 !important;
    }

    .preview-footer {
        margin-top: 1.25rem !important;
        padding-top: 0.5rem !important;
    }

    .preview-actions {
        margin-top: 0.75rem !important;
        gap: 8px !important;
    }

    .social-share-panel {
        padding: 1rem !important;
        margin-top: 1rem !important;
        border-radius: 10px !important;
    }

    /* 7. Thema Overzichtspagina & Thema Hero */
    .themas-hero-section {
        padding: 1.75rem 1rem 1.5rem !important;
        margin-bottom: 1.5rem !important;
        border-radius: 14px !important;
    }

    .themas-hero-section h1 {
        font-size: 1.85rem !important;
        margin-bottom: 0.5rem !important;
        line-height: 1.2 !important;
    }

    .themas-hero-section p {
        font-size: 0.95rem !important;
        line-height: 1.6 !important;
        margin-bottom: 1.25rem !important;
    }

    .themas-feature-pills {
        gap: 8px !important;
        margin-bottom: 1.25rem !important;
    }

    .themas-feature-pills > div {
        padding: 0.75rem 0.85rem !important;
        gap: 8px !important;
        border-radius: 8px !important;
    }

    /* 8. Thema Grid en Thema Kaarten */
    .vv-themes-overview-grid {
        gap: 1rem !important;
    }

    .vv-theme-card {
        padding: 1.15rem 1rem !important;
        border-radius: 12px !important;
    }

    .vv-theme-card h2 {
        font-size: 1.35rem !important;
        margin-bottom: 0.25rem !important;
    }

    .vv-theme-card p {
        font-size: 0.88rem !important;
        line-height: 1.5 !important;
        margin-bottom: 0.85rem !important;
    }

    /* 9. Standalone Thema Landingspagina (page-thema-builder.php) */
    .vv-theme-landing-page {
        padding: 1rem 0.75rem 2rem !important;
    }

    .vv-landing-header {
        margin-bottom: 1.25rem !important;
    }

    .vv-landing-header h1 {
        font-size: 1.85rem !important;
        margin-bottom: 0.35rem !important;
        line-height: 1.2 !important;
    }

    .vv-landing-lead {
        font-size: 0.95rem !important;
        line-height: 1.6 !important;
        margin-bottom: 1rem !important;
    }

    .vv-theme-chips-bar {
        margin-top: 0.75rem !important;
        gap: 6px !important;
    }

    .vv-topic-chip {
        padding: 4px 10px !important;
        font-size: 0.8rem !important;
    }

    .vv-landing-builder-container {
        margin-top: 0.5rem !important;
    }

    .vv-theme-latest-poems {
        margin-top: 1.75rem !important;
    }

    .vv-landing-perks {
        margin-top: 1.75rem !important;
        gap: 1rem !important;
    }

    .vv-perk-card {
        padding: 1.25rem 1rem !important;
        border-radius: 10px !important;
    }

    .vv-perk-card h3 {
        font-size: 1.25rem !important;
        margin-bottom: 0.5rem !important;
    }
}


/* ==========================================================================
   VERS & VORM - EXACTE VOORPAGINA MARGES & ELEMENTEN HARMONISATIE
   ========================================================================== */

/* 1. Voorkom dubbele container-padding in de studio */
.site-main.container-studio .builder-wrapper,
.container-studio .builder-wrapper {
    margin: 0 !important;
    padding: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
}

/* 2. Studio Header & Thema Hero's gelijkstellen aan .studio-blog-header */
.builder-header,
.themas-hero-section,
.vv-landing-header {
    background: #FFFFFF !important;
    border: 1.5px solid #EDF2F7 !important;
    border-radius: 14px !important;
    box-shadow: var(--vv-shadow-card, 0 4px 15px rgba(0, 0, 0, 0.03)) !important;
    padding: 1.75rem 2.25rem !important;
    margin-bottom: 2.25rem !important;
}

/* 3. Grid-afstanden gelijkstellen aan de voorpagina (.posts-grid-2col) */
.builder-grid,
.vv-themes-overview-grid,
.vv-books-showcase-grid,
.vv-landing-perks {
    display: grid !important;
    gap: 2rem !important;
    margin-bottom: 3rem !important;
}

/* 4. Kaarten in de Studio en Thema's gelijkstellen aan .post-card-poetic */
.ai-assistant-card,
.stanza-card,
.input-card,
.book-preview-card,
.vv-theme-card,
.vv-perk-card {
    background: #FFFFFF !important;
    border: 1.5px solid var(--vv-color-border, #E2E8F0) !important;
    border-radius: 14px !important;
    padding: 1.75rem !important;
    box-shadow: var(--vv-shadow-card, 0 4px 15px rgba(0, 0, 0, 0.03)) !important;
}

.input-card {
    margin-bottom: 1.5rem !important;
}

.stanza-card {
    margin-bottom: 1.5rem !important;
}

.ai-assistant-card {
    margin-bottom: 2rem !important;
}

.book-preview-card {
    margin-bottom: 1.5rem !important;
}

.vv-theme-card {
    margin-bottom: 1.5rem !important;
}

.vv-perk-card {
    margin-bottom: 1.5rem !important;
}

.editor-pane {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important; /* Margins are cleanly handled on the cards themselves */
}

.vv-mode-tabs-container {
    margin-bottom: 2rem !important;
}

/* ==========================================================================
   MOBIELE WEERGAVE (<= 768px): Exact gelijk aan de mobiele voorpagina
   ========================================================================== */
@media screen and (max-width: 768px) {
    /* 1. Algemene site-content padding identiek aan voorpagina */
    .site-content {
        padding: 1.25rem 0 3rem 0 !important;
    }

    /* 2. Headers op mobiel (exact zoals .studio-blog-header op index.php) */
    .builder-header,
    .themas-hero-section,
    .vv-landing-header {
        flex-direction: column !important;
        align-items: flex-start !important;
        padding: 1.5rem 1.15rem !important;
        margin-bottom: 1.25rem !important;
        border-radius: 12px !important;
        gap: 1rem !important;
    }

    .themas-hero-section h1,
    .builder-header h1,
    .vv-landing-header h1 {
        font-size: 1.85rem !important;
        margin-bottom: 0.35rem !important;
        line-height: 1.25 !important;
    }

    .themas-hero-section p,
    .builder-header p,
    .vv-landing-lead {
        font-size: 1rem !important;
        line-height: 1.6 !important;
        margin: 0 !important;
    }

    /* 3. Thema features / pills compacter */
    .themas-feature-pills {
        display: flex !important;
        flex-direction: column !important;
        gap: 0.75rem !important;
        margin-bottom: 1.25rem !important;
    }

    .themas-feature-pills > div {
        padding: 0.85rem 1rem !important;
    }

    /* 4. Grids op mobiel stapelen met de voorpagina-gap (1.25rem) */
    .builder-grid,
    .vv-themes-overview-grid,
    .vv-books-showcase-grid,
    .vv-landing-perks {
        display: flex !important;
        flex-direction: column !important;
        gap: 1.25rem !important;
        margin-bottom: 2rem !important;
    }

    /* 5. Kaarten op mobiel (exacte voorpagina padding: 1.5rem 1.15rem) */
    .ai-assistant-card,
    .stanza-card,
    .input-card,
    .book-preview-card,
    .vv-theme-card,
    .vv-perk-card {
        padding: 1.5rem 1.15rem !important;
        border-radius: 12px !important;
        box-shadow: 0 3px 14px rgba(0, 0, 0, 0.04) !important;
    }

    .vv-mode-tabs-container {
        margin-bottom: 1.25rem !important;
    }

    /* 6. Thema-landingspagina container */
    .vv-theme-landing-page {
        padding: 0 !important;
    }
}


/* ==========================================================================
   BREDE TEKST INVOERVELDEN VOOR DE GEDICHTREGELS (DESKTOP & MOBIEL)
   ========================================================================== */

/* Zorg dat de regel-groep de volledige breedte benut */
.line-input-group {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    width: 100% !important;
    gap: 8px !important;
    margin-bottom: 0.75rem !important;
    box-sizing: border-box !important;
}

/* Regelnummer compact houden */
.line-num {
    flex: 0 0 20px !important;
    width: 20px !important;
    min-width: 20px !important;
    font-weight: 700 !important;
    font-size: 0.85rem !important;
    color: #A0AEC0 !important;
    text-align: right !important;
}

/* De gedichtregel input: maximaal breed over de hele rij */
.line-input-group .poem-line,
input.poem-line {
    flex: 1 1 auto !important;
    width: 100% !important;
    min-width: 0 !important;
    padding: 0.75rem 1rem !important;
    font-size: 1rem !important;
    font-family: inherit !important;
    border-radius: 8px !important;
    border: 1.5px solid #CBD5E0 !important;
    background: #FFFFFF !important;
    box-sizing: border-box !important;
    display: block !important;
}

.line-input-group.highlight-stanza-1 .poem-line {
    border-color: #38A169 !important;
    background-color: #F0FFF4 !important;
}

.line-input-group.highlight-stanza-2 .poem-line {
    border-color: #A77B48 !important;
    background-color: #EBF8FF !important;
}

/* Lettergrepen-tag compact en niet-krimpend */
.line-input-group .syllable-margin-tag {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
    font-size: 10px !important;
    padding: 2px 6px !important;
    border-radius: 999px !important;
}

/* Rijmhulp knop compact houden zodat het invoerveld breed blijft */
.line-input-group .btn-rhyme-help,
.line-input-group button.btn-rhyme-help {
    flex: 0 0 40px !important;
    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
    border-radius: 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #EDF2F7 !important;
    color: #4A5568 !important;
    border: none !important;
    cursor: pointer !important;
}

/* Titel invoerveld ook over volle breedte */
#vvPoemTitle,
.input-card input {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    font-size: 1.15rem !important;
    padding: 0.8rem 1rem !important;
}

@media screen and (max-width: 768px) {
    .line-input-group {
        gap: 6px !important;
        margin-bottom: 0.65rem !important;
    }
    
    .line-input-group .poem-line,
    input.poem-line {
        flex: 1 1 auto !important;
        width: 100% !important;
        min-width: 0 !important;
        font-size: 15px !important;
        padding: 9px 10px !important;
    }
    
    .line-input-group .btn-rhyme-help,
    .line-input-group button.btn-rhyme-help {
        flex: 0 0 38px !important;
        width: 38px !important;
        min-width: 38px !important;
        max-width: 38px !important;
        height: 38px !important;
        min-height: 38px !important;
        padding: 0 !important;
    }
    
    .line-num {
        flex: 0 0 18px !important;
        width: 18px !important;
        min-width: 18px !important;
        font-size: 0.8rem !important;
    }
}


/* ==========================================================================
   EXTRA BREDE GEDICHTREGELS INVOERVELDEN OP MOBIEL (<= 768px & <= 480px)
   ========================================================================== */
@media screen and (max-width: 768px) {
    /* Strofekaarten padding compact zodat invoervelden maximaal breed zijn */
    .stanza-card {
        padding: 1rem 0.75rem !important;
        box-sizing: border-box !important;
        width: 100% !important;
    }

    .line-input-group {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        width: 100% !important;
        gap: 5px !important;
        margin-bottom: 0.55rem !important;
    }

    /* Regelnummer minimaal en strak */
    .line-num {
        flex: 0 0 16px !important;
        width: 16px !important;
        min-width: 16px !important;
        max-width: 16px !important;
        font-size: 0.8rem !important;
        text-align: center !important;
        padding: 0 !important;
    }

    /* Maximale breedte voor de gedichtregel */
    .line-input-group .poem-line,
    input.poem-line {
        flex: 1 1 auto !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 42px !important;
        padding: 8px 10px !important;
        font-size: 15px !important;
        border-radius: 6px !important;
        box-sizing: border-box !important;
    }

    /* Compacte teller naast regel */
    .line-input-group .syllable-margin-tag {
        flex: 0 0 auto !important;
        font-size: 9px !important;
        padding: 2px 4px !important;
        white-space: nowrap !important;
    }

    /* Compacte rijmhulp knop */
    .line-input-group .btn-rhyme-help,
    .line-input-group button.btn-rhyme-help {
        flex: 0 0 34px !important;
        width: 34px !important;
        min-width: 34px !important;
        max-width: 34px !important;
        height: 34px !important;
        min-height: 34px !important;
        max-height: 34px !important;
        padding: 0 !important;
        font-size: 12px !important;
        border-radius: 6px !important;
    }
}

@media screen and (max-width: 420px) {
    .stanza-card {
        padding: 0.85rem 0.5rem !important;
    }

    .line-input-group {
        gap: 4px !important;
    }

    .line-input-group .poem-line,
    input.poem-line {
        padding: 7px 8px !important;
        font-size: 14px !important;
    }

    .line-input-group .btn-rhyme-help,
    .line-input-group button.btn-rhyme-help {
        flex: 0 0 30px !important;
        width: 30px !important;
        min-width: 30px !important;
        height: 30px !important;
        min-height: 30px !important;
    }
}


/* ==========================================================
   Vers & Vorm Builder Plugin - 35px Spacing Fix (v12.1)
   ========================================================== */
body:not(.home):not(.front-page) .builder-wrapper,
body:not(.home):not(.front-page) .container-studio,
body:not(.home):not(.front-page) .studio-blog-header,
body:not(.home):not(.front-page) .ai-assistant-card {
}

/* ==========================================================
   Versie 14.0: Definitieve harmonisatie (inclusief Rijmwoordenboek) & 35px Spacing
   ========================================================== */

/* 1. Altijd exact 35px ruimte onder de header op alle subpagina's */
body:not(.home):not(.front-page) .site-content {
}

body:not(.home):not(.front-page) main.site-main,
body:not(.home):not(.front-page) .container-studio,
body:not(.home):not(.front-page) .studio-blog-header,
body:not(.home):not(.front-page) .themas-hero-section,
body:not(.home):not(.front-page) .page-template-page-rijmwoordenboek,
body:not(.home):not(.front-page) .builder-wrapper {
}

/* 2. Voorpagina / Homepage: Naadloze aansluiting */
body.home .site-content,
body.front-page .site-content {
    padding-top: 0 !important;
}

body.home main.site-main,
body.front-page main.site-main {
    margin-top: 0 !important;
}

/* 3. Rijmwoordenboek stijlen gelijkgetrokken met de rest */
.page-template-page-rijmwoordenboek .site-main,
.page-template-page-rijmwoordenboek .container-studio {
}

/* ==========================================================
   Vers & Vorm Builder Plugin - Exacte 35px site-content rule (v15.0)
   ========================================================== */
body:not(.home):not(.front-page) .site-content {
}

body:not(.home):not(.front-page) .builder-wrapper,
body:not(.home):not(.front-page) .container-studio,
body:not(.home):not(.front-page) .studio-blog-header,
body:not(.home):not(.front-page) .themas-hero-section {
}

/* ==========================================================
   Versie 16.0: Absolute Universele 35px Spacing op alle pagina's,
   templates, plugin generatoren, rijmwoordenboek & gedichten studio
   ========================================================== */

/* 1. Wereldwijde subpagina site-content padding */
body:not(.home):not(.front-page) .site-content {
}

/* 2. Alle hoofdcontainers, main-tags, studio- en generatorkaders */
body:not(.home):not(.front-page) main.site-main,
body:not(.home):not(.front-page) .container-studio,
body:not(.home):not(.front-page) .studio-blog-header,
body:not(.home):not(.front-page) .themas-hero-section,
body:not(.home):not(.front-page) .page-template-page-rijmwoordenboek,
body:not(.home):not(.front-page) .builder-wrapper,
body:not(.home):not(.front-page) .ai-assistant-card,
body:not(.home):not(.front-page) .stanza-card,
body:not(.home):not(.front-page) .vv-theme-landing-page,
body:not(.home):not(.front-page) .single-page-container {
}

/* 3. Voorpagina / Homepage uitzondering (naadloze hero aansluiting) */
body.home .site-content,
body.front-page .site-content {
    padding-top: 0 !important;
}

body.home main.site-main,
body.front-page main.site-main,
body.home .container-studio:first-child,
body.front-page .container-studio:first-child,
body.home .site-hero-slanted,
body.front-page .site-hero-slanted {
    margin-top: 0 !important;
}

/* ==========================================================
   Versie 17.0: De Absolute & Onwrikbare 35px Standaardisatie
   Voor álle pagina's, templates, berichten, archieven, studio en plugin items.
   ========================================================== */

/* 1. Reset en forceer exact 35px bovenruimte voor alle niet-homepage content */
body:not(.home):not(.front-page) .site-content {
margin-top: 0 !important;
}

body:not(.home):not(.front-page) main.site-main,
body:not(.home):not(.front-page) .container-studio,
body:not(.home):not(.front-page) .studio-blog-header,
body:not(.home):not(.front-page) .themas-hero-section,
body:not(.home):not(.front-page) .page-template-page-rijmwoordenboek,
body:not(.home):not(.front-page) .builder-wrapper,
body:not(.home):not(.front-page) .single-page-container,
body:not(.home):not(.front-page) .vv-theme-landing-page,
body:not(.home):not(.front-page) article,
body:not(.home):not(.front-page) section,
body:not(.home):not(.front-page) .site-main > *,
body:not(.home):not(.front-page) .container-studio > * {
}

/* Neutraliseer de margin-top op het allerEERSTE element zodat het totaal exact 35px blijft vanaf het menu */
body:not(.home):not(.front-page) .site-content > *:first-child,
body:not(.home):not(.front-page) main.site-main > *:first-child,
body:not(.home):not(.front-page) .container-studio > *:first-child {
    margin-top: 0 !important;
}

/* 2. Homepage / Voorpagina: Naadloze aansluiting (0px) */
body.home .site-content,
body.front-page .site-content {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

body.home main.site-main,
body.front-page main.site-main,
body.home .container-studio:first-child,
body.front-page .container-studio:first-child,
body.home .site-hero-slanted,
body.front-page .site-hero-slanted {
    margin-top: 0 !important;
}

/* ==========================================================
   Versie 18.0: Responsieve Modernisering, Hero Overlay Banner
   en Tekst-adaptieve Mobiele Hero
   ========================================================== */

/* 1. Single Pagina Hero Banner met Overlay */
.single-hero-banner {
    position: relative;
    width: 100%;
    min-height: 380px;
    border-radius: var(--vv-card-radius, 16px);
    overflow: hidden;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: flex-end;
    margin-bottom: 2rem;
    box-shadow: var(--vv-card-shadow, 0 8px 30px rgba(0,0,0,0.06));
}

.single-hero-overlay {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.15) 0%, rgba(15, 23, 42, 0.55) 45%, rgba(15, 23, 42, 0.92) 100%);
    z-index: 1;
}

.single-hero-content {
    position: relative;
    z-index: 2;
    padding: clamp(1.5rem, 4vw, 3rem);
    width: 100%;
    color: #FFFFFF;
}

.single-hero-category-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(255, 255, 255, 0.95);
    color: #1A202C !important;
    padding: 0.35rem 0.95rem;
    border-radius: 9999px;
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 1rem;
    box-shadow: 0 4px 14px rgba(0,0,0,0.25);
}

.single-hero-category-badge a {
    color: #1A202C !important;
    text-decoration: none;
}

.single-hero-title {
    font-family: var(--vv-font-serif, 'Cormorant Garamond', Georgia, serif) !important;
    font-size: clamp(2rem, 5vw, 3.2rem) !important;
    line-height: 1.18 !important;
    color: #FFFFFF !important;
    margin: 0 0 1rem 0 !important;
    text-shadow: 0 2px 10px rgba(0,0,0,0.45);
}

.single-hero-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    font-size: 0.92rem;
    color: rgba(255, 255, 255, 0.9);
    align-items: center;
}

.single-hero-meta span, .single-hero-meta a {
    color: rgba(255, 255, 255, 0.95) !important;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

/* 2. Tekst-adaptieve Voorpagina Hero op Mobiel */
@media screen and (max-width: 768px) {
    .site-hero-slanted {
        height: auto !important;
        min-height: auto !important;
        clip-path: polygon(0 0, 100% 0, 100% calc(100% - 25px), 0 100%) !important;
    }
    
    .site-hero-slanted .hero-inner-container {
        padding-top: clamp(2.5rem, 8vw, 4.5rem) !important;
        padding-bottom: clamp(3.5rem, 10vw, 5.5rem) !important;
    }
    
    .hero-typography-block {
        max-width: 100% !important;
    }
    
    .hero-main-title {
        font-size: clamp(2.1rem, 7vw, 2.75rem) !important;
        line-height: 1.2 !important;
    }
    
    .hero-main-desc {
        font-size: 1.05rem !important;
        line-height: 1.65 !important;
    }

    /* 3. Volledig responsief raster voor alle kaarten */
    .poems-archive-grid,
    .blog-cards-grid,
    .themas-grid,
    .dichtbundels-grid {
        grid-template-columns: 1fr !important;
        gap: 1.25rem !important;
    }

    /* 4. Soepele app-achtige horizontale touch-scrol voor de subnavigatiebalk */
    .studio-subnav-items {
        display: flex !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        white-space: nowrap !important;
        padding-bottom: 6px !important;
        scrollbar-width: none !important;
    }
    
    .studio-subnav-items::-webkit-scrollbar {
        display: none !important;
    }
    
    .studio-subnav-items a {
        flex-shrink: 0 !important;
    }

    /* Single hero banner op mobiel */
    .single-hero-banner {
        min-height: 270px !important;
    }
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
    .poems-archive-grid,
    .blog-cards-grid,
    .themas-grid,
    .dichtbundels-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* ==========================================================================
   VERSIE 18.4: VOLLEDIGE AFSTANDS- EN BREEDTEHARMONISATIE
   ========================================================================== */

/* 1. EXACTE EN ONWRIKKELBARE 35PX TUSSENRUIMTE ONDER DE SUBNAVIGATIEBALK */
body:not(.home):not(.front-page) .site-content {
padding-bottom: 4rem !important;
    margin-top: 0 !important;
    width: 100% !important;
}

/* Neutraliseer alle stapelende bovenmarges op alle eerste kind-elementen */
body:not(.home):not(.front-page) .site-content > *:first-child,
body:not(.home):not(.front-page) main.site-main,
body:not(.home):not(.front-page) .container-studio,
body:not(.home):not(.front-page) .container-narrow,
body:not(.home):not(.front-page) .single-page-container,
body:not(.home):not(.front-page) .builder-wrapper,
body:not(.home):not(.front-page) .vv-theme-landing-page,
body:not(.home):not(.front-page) .themas-hero-section,
body:not(.home):not(.front-page) .studio-blog-header,
body:not(.home):not(.front-page) .author-studio-hero,
body:not(.home):not(.front-page) .vv-profile-dashboard,
body:not(.home):not(.front-page) .vv-mollie-checkout-wrapper {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

body:not(.home):not(.front-page) .site-main > *:first-child,
body:not(.home):not(.front-page) .container-studio > *:first-child,
body:not(.home):not(.front-page) .blog-studio-layout > *:first-child,
body:not(.home):not(.front-page) .vv-landing-header:first-child {
    margin-top: 0 !important;
}

/* Voorpagina / Homepage sluit naadloos aan op de schuine Hero (0px) */
body.home .site-content,
body.front-page .site-content {
    padding-top: 0 !important;
    margin-top: 0 !important;
}
body.home .site-hero-slanted,
body.front-page .site-hero-slanted {
    margin-top: 0 !important;
}

/* 2. OPHEFFEN VAN DE BREEDTE-VERSPRINGING OP THEMAPAGINA'S (PAGE-THEMA-BUILDER) */
.vv-theme-landing-page {
    max-width: var(--vv-site-max-width, 1280px) !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: var(--vv-gutter, 1.5rem) !important;
    padding-right: var(--vv-gutter, 1.5rem) !important;
    box-sizing: border-box !important;
}

.vv-landing-header,
.vv-landing-builder-container,
.vv-theme-latest-poems,
.vv-landing-perks {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}

/* Cruciaal: hef de dubbele padding en marge op van de builder binnen themalandingspagina's */
.vv-theme-landing-page .vv-landing-builder-container .builder-wrapper {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

.vv-theme-landing-page .vv-landing-builder-container .builder-container {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.vv-theme-landing-page .builder-header {
    width: 100% !important;
    box-sizing: border-box !important;
}

/* 3. STANDAARD KAART-KOP VOOR SINGLE GEDICHTEN */
.single-poem-card .post-card-thumb.single-card-thumb {
    width: 100% !important;
    height: 250px !important;
    margin: 0 !important;
    border-top-left-radius: var(--vv-card-radius, 16px) !important;
    border-top-right-radius: var(--vv-card-radius, 16px) !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    background: #EDF4FA !important;
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.single-poem-card .single-card-thumb .post-card-placeholder i {
    font-size: 3.5rem !important;
    color: #94A3B8 !important;
    opacity: 0.85 !important;
}

.single-poem-card .single-card-thumb .post-card-category {
    position: absolute !important;
    top: 18px !important;
    left: 20px !important;
    background: #FFFFFF !important;
    color: #D44E0D !important;
    font-size: 0.78rem !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    padding: 0.4rem 0.95rem !important;
    border-radius: 999px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
    text-decoration: none !important;
    z-index: 2 !important;
}

@media (max-width: 768px) {
    .single-poem-card .post-card-thumb.single-card-thumb {
        height: 180px !important;
    }
}

/* ==========================================================================
   VERSIE 18.8: OPEN HERO SECTIES ZONDER KADER / KAART EROMHEEN
   ========================================================================== */
.studio-blog-header, 
.page-hero-header, 
.themas-hero-section, 
.vv-landing-header, 
.single-page-container .single-post-header,
.vv-contact-header {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 3rem 1rem 2.5rem 1rem !important;
    margin-top: 0 !important;
    margin-bottom: 2.5rem !important;
    text-align: center !important;
    box-shadow: none !important;
    position: relative !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.studio-blog-header h1, 
.page-hero-header h1, 
.themas-hero-section h1, 
.vv-landing-header h1, 
.single-page-container .single-post-header h1,
.vv-contact-header h1 {
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    font-size: 3rem !important;
    font-weight: 700 !important;
    color: #1A202C !important;
    margin: 0.5rem 0 0.85rem 0 !important;
    line-height: 1.15 !important;
}

.studio-blog-header p, 
.page-hero-header p, 
.themas-hero-section p, 
.vv-landing-header p, 
.vv-landing-lead,
.single-page-container .single-post-header p {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 1.15rem !important;
    color: #4A5568 !important;
    max-width: 780px !important;
    margin: 0 auto !important;
    line-height: 1.65 !important;
}

@media (max-width: 768px) {
    .studio-blog-header, 
    .page-hero-header, 
    .themas-hero-section, 
    .vv-landing-header, 
    .single-page-container .single-post-header,
    .vv-contact-header {
        padding: 2rem 1rem 1.5rem 1rem !important;
        margin-bottom: 1.5rem !important;
    }
    .studio-blog-header h1, 
    .page-hero-header h1, 
    .themas-hero-section h1, 
    .vv-landing-header h1, 
    .single-page-container .single-post-header h1,
    .vv-contact-header h1 {
        font-size: 2.2rem !important;
    }
}

/* ==========================================================================
   VERSIE 18.9: UNIVERSELE BUILDER-HEADER STIJL OP ALLE SUBPAGINA'S
   (Voorpagina ongemoeid, single gedichten/posts uitgesloten)
   ========================================================================== */

body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .studio-blog-header,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .page-hero-header,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .themas-hero-section,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-landing-header,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-contact-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    background: #FFFFFF !important;
    padding: 2.25rem 2.75rem !important;
    border-radius: 14px !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03) !important;
    border: 1px solid #EDF2F7 !important;
    margin-top: 0 !important;
    margin-bottom: 2.5rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
    text-align: left !important;
}

body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .studio-blog-header h1,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .page-hero-header h1,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .themas-hero-section h1,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-landing-header h1,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-contact-header h1 {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 2.4rem !important;
    font-weight: 700 !important;
    margin: 0 !important;
    color: #1A202C !important;
    line-height: 1.2 !important;
}

body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .studio-blog-header p,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .page-hero-header p,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .themas-hero-section p,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-landing-header p,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-landing-lead,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-contact-header p {
    margin: 0.35rem 0 0 !important;
    color: #718096 !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 1.05rem !important;
    line-height: 1.5 !important;
}

@media screen and (max-width: 768px) {
    body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .studio-blog-header,
    body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .page-hero-header,
    body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .themas-hero-section,
    body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-landing-header,
    body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-contact-header {
        flex-direction: column !important;
        align-items: flex-start !important;
        padding: 1.5rem 1.25rem !important;
        margin-bottom: 1.5rem !important;
        gap: 0.75rem !important;
        border-radius: 12px !important;
    }
    body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .studio-blog-header h1,
    body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .page-hero-header h1,
    body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .themas-hero-section h1,
    body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-landing-header h1,
    body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-contact-header h1 {
        font-size: 1.75rem !important;
    }
}

/* ==========================================================================
   VERSIE 18.10: ELKE PAGINA HEADER GELIJKSTELD AAN .builder-header
   ========================================================================== */
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .studio-blog-header,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .page-hero-header,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .themas-hero-section,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-landing-header,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-contact-header,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .single-page-container .single-post-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    background: #FFFFFF !important;
    padding: 1.75rem 2.25rem !important;
    border-radius: 14px !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03) !important;
    border: 1px solid #EDF2F7 !important;
    margin-top: 0 !important;
    margin-bottom: 2rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
    text-align: left !important;
}

body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .studio-blog-header h1,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .page-hero-header h1,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .themas-hero-section h1,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-landing-header h1,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-contact-header h1,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .single-page-container .single-post-header h1 {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 2.3rem !important;
    font-weight: 700 !important;
    margin: 0 !important;
    color: #1A202C !important;
    line-height: 1.2 !important;
}

body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .studio-blog-header p,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .page-hero-header p,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .themas-hero-section p,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-landing-header p,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-landing-lead,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-contact-header p,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .single-page-container .single-post-header p {
    margin: 0.35rem 0 0 !important;
    color: #718096 !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 1.05rem !important;
    line-height: 1.5 !important;
}

@media screen and (max-width: 768px) {
    body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .studio-blog-header,
    body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .page-hero-header,
    body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .themas-hero-section,
    body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-landing-header,
    body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-contact-header,
    body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .single-page-container .single-post-header {
        flex-direction: column !important;
        align-items: flex-start !important;
        padding: 1.25rem 1rem !important;
        margin-bottom: 1.5rem !important;
        gap: 0.5rem !important;
    }
}

/* ==========================================================================
   VERSIE 18.11: VOLLEDIGE VISUELE HARMONISATIE & STUDIO POLISH
   ========================================================================== */

/* 1. Uniforme typografische hiërarchie en kaarten */
body {
    background-color: var(--vv-color-bg, #f0e4db) !important;
    color: var(--vv-color-text, #2D3748) !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    -webkit-font-smoothing: antialiased;
}

/* 2. Prachtige visuele inhoudskaarten voor overzichten, formulieren en profielen */
.content-card, .post-card-poetic, .single-post-card, .book-preview-card, .vv-perk-card, .vv-profile-dashboard, .vv-mollie-checkout-wrapper, .vv-contact-container {
    background: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 16px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03) !important;
    padding: 2.25rem !important;
    margin-bottom: 2rem !important;
    box-sizing: border-box !important;
}

/* 3. Formulieren en knoppen strak en eenduidig */
input[type="text"], input[type="email"], input[type="password"], input[type="number"], select, textarea {
    width: 100% !important;
    padding: 0.85rem 1.15rem !important;
    background: #FAF8F5 !important;
    border: 1.5px solid #E2E8F0 !important;
    border-radius: 10px !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 1rem !important;
    color: #2D3748 !important;
    transition: all 0.25s ease !important;
    box-sizing: border-box !important;
}

input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus, select:focus, textarea:focus {
    border-color: var(--vv-color-primary, #A77B48) !important;
    background: #FFFFFF !important;
    box-shadow: 0 0 0 4px rgba(253, 103, 33, 0.1) !important;
    outline: none !important;
}

/* 4. Primaire actieknoppen in warme studio-stijl */
button, .btn-primary, .hero-btn-primary, .btn-sidebar-cta, .vv-btn-submit-checkout {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.5rem !important;
    padding: 0.85rem 1.75rem !important;
    background: linear-gradient(135deg, #A77B48 0%, #D44E0D 100%) !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    font-size: 0.98rem !important;
    border-radius: 10px !important;
    border: none !important;
    cursor: pointer !important;
    box-shadow: 0 4px 15px rgba(253, 103, 33, 0.2) !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
    text-decoration: none !important;
}

button:hover, .btn-primary:hover, .hero-btn-primary:hover, .btn-sidebar-cta:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(253, 103, 33, 0.3) !important;
}

/* 5. Vlekkeloze mobiele responsiviteit */
@media screen and (max-width: 768px) {
    .content-card, .post-card-poetic, .single-post-card, .book-preview-card, .vv-perk-card, .vv-profile-dashboard {
        padding: 1.25rem !important;
        margin-bottom: 1.25rem !important;
        border-radius: 12px !important;
    }
}

/* ==========================================================================
   VERSIE 18.12: VOLLEDIGE THEMA + PLUGIN BUILDER-HEADER HARMONISATIE
   ========================================================================== */
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .studio-blog-header,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .page-hero-header,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .themas-hero-section,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-landing-header,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-contact-header,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .single-page-container .single-post-header,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .author-studio-hero,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .builder-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    background: #FFFFFF !important;
    padding: 2.25rem 2.75rem !important;
    border-radius: 14px !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03) !important;
    border: 1px solid #EDF2F7 !important;
    margin-top: 0 !important;
    margin-bottom: 2.5rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
    text-align: left !important;
}

body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .studio-blog-header h1,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .page-hero-header h1,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .themas-hero-section h1,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-landing-header h1,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-contact-header h1,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .single-page-container .single-post-header h1,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .builder-header h1 {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 2.4rem !important;
    font-weight: 700 !important;
    margin: 0 !important;
    color: #1A202C !important;
    line-height: 1.2 !important;
}

body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .studio-blog-header p,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .page-hero-header p,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .themas-hero-section p,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-landing-header p,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-landing-lead,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-contact-header p,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .single-page-container .single-post-header p,
body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .builder-header p {
    margin: 0.35rem 0 0 !important;
    color: #718096 !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 1.05rem !important;
    line-height: 1.5 !important;
}

@media screen and (max-width: 768px) {
    body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .studio-blog-header,
    body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .page-hero-header,
    body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .themas-hero-section,
    body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-landing-header,
    body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .vv-contact-header,
    body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .single-page-container .single-post-header,
    body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .author-studio-hero,
    body:not(.home):not(.front-page):not(.single):not(.single-gebruikers_gedicht) .builder-header {
        flex-direction: column !important;
        align-items: flex-start !important;
        padding: 1.5rem 1.25rem !important;
        margin-bottom: 1.5rem !important;
        gap: 0.75rem !important;
        border-radius: 12px !important;
    }
}

/* ==========================================================================
   VERSIE 19.0: VOLLEDIG VERNIEUWD A-Z ONTWERP & GEDICHTEN STUDIO REFRESH
   ========================================================================== */

:root {
    --vv-site-max-width: 1280px;
    --vv-gutter: 1.5rem;
    --vv-color-primary: #A77B48;
    --vv-color-accent: #A77B48;
    --vv-color-bg: #f0e4db;
    --vv-color-text: #2D3748;
}

body {
    background-color: var(--vv-color-bg) !important;
    color: var(--vv-color-text) !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
}

/* 1. Header & Menu Styling */
.site-header {
    background: #FFFFFF !important;
    border-bottom: 1px solid #E2E8F0 !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.02) !important;
    position: relative !important;
    z-index: 1000 !important;
}

.header-container {
    max-width: var(--vv-site-max-width);
    margin: 0 auto;
    padding: 1rem var(--vv-gutter);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.site-title a {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: 1.85rem;
    font-weight: 700;
    color: #1A202C;
    text-decoration: none;
}

.primary-navigation ul {
    display: flex;
    list-style: none;
    gap: 1.75rem;
    margin: 0;
    padding: 0;
    align-items: center;
}

.primary-navigation a {
    color: #4A5568;
    font-weight: 600;
    text-decoration: none;
    font-size: 0.98rem;
    transition: color 0.2s ease;
}

.primary-navigation a:hover {
    color: var(--vv-color-primary);
}

/* 2. Subnavigatie knoppen met icoontjes */
.studio-subnav-bar {
    background: #FAF8F5;
    border-top: 1px solid #EAE4DC;
    border-bottom: 1px solid #EAE4DC;
    padding: 0.65rem 0;
}

.studio-subnav-items {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    max-width: var(--vv-site-max-width);
    margin: 0 auto;
    padding: 0 var(--vv-gutter);
}

.studio-subnav-items a {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1.1rem;
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 999px;
    color: #2D3748;
    font-size: 0.88rem;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 2px 5px rgba(0,0,0,0.02);
    transition: all 0.2s ease;
}

.studio-subnav-items a:hover {
    background: #F7FAFC;
    border-color: var(--vv-color-primary);
    color: var(--vv-color-primary);
}

/* DUIDELIJKE EN OPMERKELIJKE DICHTERSABONNEMENT KNOP */
.subnav-highlight-prominent {
    background: linear-gradient(135deg, #A77B48 0%, #DD5212 100%) !important;
    color: #FFFFFF !important;
    border: none !important;
    box-shadow: 0 4px 15px rgba(253, 103, 33, 0.3) !important;
    margin-left: auto !important;
}

.subnav-highlight-prominent:hover {
    background: linear-gradient(135deg, #E65A1B 0%, #C4450E 100%) !important;
    color: #FFFFFF !important;
}

/* 3. Pagina Hero Sectie (Boven titel, H1, promotie tekst, knoppen max 3) */
.page-hero-section, .studio-blog-header, .themas-hero-section, .vv-landing-header, .single-post-card .single-post-header {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 2.5rem 0 1.5rem 0 !important;
    margin-top: 0 !important;
    margin-bottom: 2rem !important;
    text-align: center !important;
    box-shadow: none !important;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

.hero-kicker {
    display: inline-block;
    font-size: 0.82rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--vv-color-primary);
    background: rgba(253, 103, 33, 0.08);
    padding: 0.35rem 1rem;
    border-radius: 999px;
    margin-bottom: 0.75rem;
}

.page-hero-section h1, .studio-blog-header h1, .themas-hero-section h1, .vv-landing-header h1, .single-post-card .single-post-header h1 {
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    font-size: 3rem !important;
    font-weight: 700 !important;
    color: #1A202C !important;
    margin: 0 0 0.85rem 0 !important;
    line-height: 1.15 !important;
}

.page-hero-section p, .studio-blog-header p, .themas-hero-section p, .vv-landing-header p, .vv-landing-lead {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 1.12rem !important;
    color: #4A5568 !important;
    max-width: 720px !important;
    margin: 0 auto 1.5rem auto !important;
    line-height: 1.65 !important;
}

.hero-buttons-bar {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 1.25rem;
}

.hero-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0.75rem 1.5rem;
    border-radius: 10px;
    font-weight: 700;
    font-size: 0.95rem;
    text-decoration: none;
    transition: all 0.2s ease;
}

.hero-btn-primary {
    background: var(--vv-color-primary);
    color: #FFFFFF;
    box-shadow: 0 4px 15px rgba(48,93,158,0.25);
}

.hero-btn-primary:hover {
    background: #25497B;
    color: #FFFFFF;
}

.hero-btn-secondary {
    background: #FFFFFF;
    color: #2D3748;
    border: 1px solid #CBD5E0;
}

.hero-btn-secondary:hover {
    background: #F7FAFC;
    border-color: var(--vv-color-primary);
    color: var(--vv-color-primary);
}

/* 4. Ruimte 35px vaste container */
.site-content {
    max-width: var(--vv-site-max-width);
    margin: 0 auto;
    padding: 0 var(--vv-gutter) 4rem var(--vv-gutter);
    width: 100%;
    box-sizing: border-box;
}

/* 5. Gedichten Studio Vernieuwd Ontwerp (Strak, Moderne Tabs & Velden) */
.builder-wrapper {
    background: #FFFFFF;
    border: 1.5px solid #E2E8F0;
    border-radius: 20px;
    padding: 2.75rem;
    box-shadow: 0 12px 40px rgba(0,0,0,0.04);
    margin-bottom: 3rem;
}

.builder-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #EDF2F7;
    padding-bottom: 1.5rem;
    margin-bottom: 2rem;
}

.builder-header h1 {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: 2.5rem;
    color: #1A202C;
    margin: 0;
}

.vv-mode-tabs {
    display: flex;
    gap: 12px;
    margin-bottom: 2rem;
}

.vv-mode-tab-btn {
    flex: 1;
    padding: 1.15rem 1.5rem;
    background: #FAF8F5;
    border: 2px solid #E2E8F0;
    border-radius: 14px;
    font-weight: 700;
    color: #4A5568;
    cursor: pointer;
    text-align: left;
    transition: all 0.25s ease;
}

.vv-mode-tab-btn.active, .vv-mode-tab-btn:hover {
    background: #FFFFFF;
    border-color: var(--vv-color-primary);
    color: var(--vv-color-primary);
    box-shadow: 0 6px 20px rgba(253,103,33,0.08);
}

/* 6. 100% Responsief & 10px van randen op mobiel (GEEN OMKADERING BIJ MOBIEL) */
@media screen and (max-width: 768px) {
    body, html {
        overflow-x: hidden !important;
        max-width: 100vw !important;
    }
    
    .site-wrapper, .site-content, .header-container, .studio-subnav-items {
        padding-left: 10px !important;
        padding-right: 10px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    
    /* Geen omkadering of dikke box-shadows op mobiel om ruimte te besparen */
    .content-card, .post-card-poetic, .single-post-card, .book-preview-card, .builder-wrapper, .page-hero-section {
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
    }
    
    .page-hero-section h1 {
        font-size: 2.1rem !important;
    }
    
    .primary-navigation {
        display: none; /* Mobiel menu via toggle */
    }
}

/* ==========================================================================
   VERSIE 19.2: ULTIEME ALGEMENE HARMONISATIE (THEMA & PLUGIN COMPLEET)
   ========================================================================== */

/* 1. Voorpagina Hero: gelijke content-breedte (.container-studio), 20px radius, links uitgelijnd, 2 lichte knoppen */
.container-studio .site-hero-slanted {
    border-radius: 20px !important;
    overflow: hidden !important;
    position: relative !important;
    width: 100% !important;
    min-height: 420px !important;
    display: flex !important;
    align-items: center !important;
    background-color: #FAF8F5 !important;
    border: 1.5px solid #E2E8F0 !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.03) !important;

margin-bottom: 3rem !important;
    clip-path: none !important;
}

.site-hero-slanted .hero-inner-container {
    text-align: left !important;
    padding: 3rem 3.5rem !important;
    width: 100% !important;
}

.site-hero-slanted .hero-typography-block {
    max-width: 750px !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    text-align: left !important;
}

.site-hero-slanted .hero-main-title {
    text-align: left !important;
}

.site-hero-slanted .hero-main-desc {
    text-align: left !important;
}

.site-hero-slanted .hero-action-buttons {
    display: flex !important;
    gap: 12px !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
}

.hero-btn-light-twin {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 0.75rem 1.5rem !important;
    border-radius: 10px !important;
    font-weight: 700 !important;
    font-size: 0.95rem !important;
    text-decoration: none !important;
    background: #FFFFFF !important;
    color: #2D3748 !important;
    border: 1px solid #CBD5E0 !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important;
    transition: all 0.2s ease !important;
}

.hero-btn-light-twin:hover {
    background: #F7FAFC !important;
    border-color: var(--vv-color-primary, #A77B48) !important;
    color: var(--vv-color-primary, #A77B48) !important;
}

/* 2. Achtergrond afbeelding bovenaan de kaarten over de volledige breedte (gedichten & blogs) */
.post-card-thumb, .post-card-poetic .post-card-thumb, .blog-card .post-card-thumb {
    width: 100% !important;
    height: 220px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-top-left-radius: 16px !important;
    border-top-right-radius: 16px !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    overflow: hidden !important;
    position: relative !important;
    background-color: #EDF4FA !important;
}

.post-card-thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

/* 3. Rijmwoordenboek, Bekende Dichters & Thema's Dichtstudio Headers Vernieuwd */
.themas-hero-section, .studio-blog-header, .page-hero-header {
    background: linear-gradient(180deg, #FFFFFF 0%, #FAF8F5 100%) !important;
    border: 1.5px solid #E8E2D5 !important;
    border-radius: 20px !important;
    padding: 3.5rem 2.5rem !important;
    margin-bottom: 2.5rem !important;
    text-align: center !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.03) !important;
    position: relative !important;
}

/* 4. Mobiele geoptimaliseerde weergave: 10px van randen, geen omkadering */
@media screen and (max-width: 768px) {
    body, html {
        overflow-x: hidden !important;
        max-width: 100vw !important;
    }
    .site-wrapper, .site-content, .header-container, .studio-subnav-items, .container-studio {
        padding-left: 10px !important;
        padding-right: 10px !important;
        width: 100% !important;
        box-sizing: border-box !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
    .content-card, .post-card-poetic, .single-post-card, .book-preview-card, .builder-wrapper, .page-hero-section, .themas-hero-section, .studio-blog-header {
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
    }
}

/* ==========================================================================
   VERSIE 19.3: VOLLEDIG VERNIEUWD A-Z ONTWERP & GEDICHTEN STUDIO REFRESH
   ========================================================================== */

/* 1. Algemene Huisstijl & Warme Lichte Knoppen (GEEN DONKERE KLEUREN) */
:root {
    --vv-site-max-width: 1280px;
    --vv-gutter: 1.5rem;
    --vv-color-primary: #A77B48;
    --vv-color-accent: #A77B48;
    --vv-color-bg: #f0e4db;
    --vv-color-text: #2D3748;
}

body {
    background-color: var(--vv-color-bg) !important;
    color: var(--vv-color-text) !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Warm en lichte knoppen overal op de website */
.vv-btn-warm-light, button.btn-primary, .hero-btn-primary, .btn-sidebar-cta, .vv-btn-submit-checkout, .post-card-readmore, .btn-header-auth, .hero-action-buttons a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 0.75rem 1.6rem !important;
    background: #FFFFFF !important;
    color: #2D3748 !important;
    border: 1.5px solid #E2D9CC !important;
    border-radius: 12px !important;
    font-weight: 700 !important;
    font-size: 0.95rem !important;
    box-shadow: 0 4px 14px rgba(253, 103, 33, 0.08) !important;
    text-decoration: none !important;
    transition: all 0.25s ease !important;
    cursor: pointer !important;
}

.vv-btn-warm-light:hover, button.btn-primary:hover, .hero-btn-primary:hover, .btn-sidebar-cta:hover, .vv-btn-submit-checkout:hover, .hero-action-buttons a:hover {
    background: #FFFDF9 !important;
    border-color: #A77B48 !important;
    color: #A77B48 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(253, 103, 33, 0.16) !important;
}

/* 2. Gedichten Generator Eilandenstructuur (Achtergrond zichtbaar tussen blokken) */
.builder-wrapper {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 auto 3rem auto !important;
    max-width: var(--vv-site-max-width) !important;
}

.builder-header, 
.vv-mode-tabs-container, 
.builder-grid, 
.vv-result-actions-card {
    background: #FFFFFF !important;
    border: 1.5px solid #EAE4DC !important;
    border-radius: 20px !important;
    padding: 2.25rem !important;
    margin-bottom: 25px !important; /* Achtergrond canvas zichtbaar tussen de blokken! */
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03) !important;
    box-sizing: border-box !important;
}

.builder-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}

.vv-mode-tabs {
    display: flex !important;
    gap: 14px !important;
    flex-wrap: wrap !important;
}

.vv-mode-tab-btn {
    flex: 1 !important;
    min-width: 200px !important;
    background: #FAF8F5 !important;
    border: 2px solid #EAE4DC !important;
    border-radius: 14px !important;
    padding: 1.15rem 1.4rem !important;
    cursor: pointer !important;
    transition: all 0.25s ease !important;
    text-align: left !important;
    box-sizing: border-box !important;
}

.vv-mode-tab-btn.active, .vv-mode-tab-btn:hover {
    background: #FFFFFF !important;
    border-color: #A77B48 !important;
    box-shadow: 0 6px 20px rgba(253, 103, 33, 0.12) !important;
}

/* 3. Volle breedte achtergrondafbeelding bovenaan alle kaarten (gedichten & blogs) */
.post-card-thumb, .post-card-poetic .post-card-thumb, .blog-card .post-card-thumb {
    width: 100% !important;
    height: 220px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-top-left-radius: 16px !important;
    border-top-right-radius: 16px !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    overflow: hidden !important;
    position: relative !important;
    background-color: #EDF4FA !important;
}

.post-card-thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

/* 4. Voorpagina Hero met 20px ronde hoeken en gelijke content breedte */
.container-studio .site-hero-slanted {
    border-radius: 20px !important;
    overflow: hidden !important;
    position: relative !important;
    width: 100% !important;
    min-height: 420px !important;
    display: flex !important;
    align-items: center !important;
    background-color: #FAF8F5 !important;
    border: 1.5px solid #EAE4DC !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.03) !important;

margin-bottom: 2.5rem !important;
    clip-path: none !important;
}

/* 5. 100% Responsief & Mobiel Vrij van Kaders (< 768px) */
@media screen and (max-width: 768px) {
    body, html {
        overflow-x: hidden !important;
        max-width: 100vw !important;
    }
    
    .site-wrapper, .site-content, .header-container, .studio-subnav-items, .container-studio {
        padding-left: 10px !important;
        padding-right: 10px !important;
        width: 100% !important;
        box-sizing: border-box !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
    
    /* Geen omkadering van elementen op mobiel (bespaart kostbare ruimte) */
    .content-card, 
    .post-card-poetic, 
    .single-post-card, 
    .book-preview-card, 
    .builder-header, 
    .vv-mode-tabs-container, 
    .builder-grid, 
    .page-hero-section, 
    .themas-hero-section, 
    .author-studio-hero {
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
    }

    .studio-subnav-items {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        padding-bottom: 6px !important;
        scrollbar-width: none !important;
    }
    .studio-subnav-items::-webkit-scrollbar {
        display: none !important;
    }
    .studio-subnav-items a {
        flex-shrink: 0 !important;
    }
}



/* v19.6: zichtbare, consistente studio-knoppen in de themakleur */
.builder-wrapper {
  --vv-studio-button: var(--vv-color-primary, #A77B48);
  --vv-studio-button-hover: #D44E0D;
}
.builder-wrapper button:not(.btn-rhyme-help):not(.modal-close),
.builder-wrapper a.btn-primary,
.builder-wrapper a.btn-secondary,
.builder-wrapper a.btn-tool,
.builder-wrapper a.btn-cta-upgrade,
.builder-wrapper .hero-btn,
.builder-wrapper .btn-primary,
.builder-wrapper .btn-secondary,
.builder-wrapper .btn-tool,
.builder-wrapper .btn-ai-generate,
.builder-wrapper .btn-cta-generate,
.builder-wrapper .btn-sidebar-cta,
.builder-wrapper .btn-cta-upgrade,
.builder-wrapper .btn-social-share,
.builder-wrapper .vv-tab-btn {
  background: var(--vv-studio-button) !important;
  background-image: none !important;
  color: #fff !important;
  border: 1px solid var(--vv-studio-button) !important;
  box-sizing: border-box !important;
  min-height: 48px !important;
  height: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  padding: 12px 16px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  line-height: 1.25 !important;
  white-space: normal !important;
  text-decoration: none !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}
.builder-wrapper button:not(.btn-rhyme-help):not(.modal-close):hover,
.builder-wrapper a.btn-primary:hover,
.builder-wrapper a.btn-tool:hover,
.builder-wrapper .btn-primary:hover,
.builder-wrapper .btn-secondary:hover,
.builder-wrapper .btn-tool:hover,
.builder-wrapper .btn-ai-generate:hover,
.builder-wrapper .btn-cta-generate:hover,
.builder-wrapper .btn-sidebar-cta:hover,
.builder-wrapper .btn-cta-upgrade:hover,
.builder-wrapper .btn-social-share:hover,
.builder-wrapper .vv-tab-btn:hover {
  background: var(--vv-studio-button-hover) !important;
  background-image: none !important;
  border-color: var(--vv-studio-button-hover) !important;
  color: #fff !important;
}
/* Actieknoppen vullen de beschikbare rijbreedte en worden even hoog. */
.builder-wrapper .editor-actions,
.builder-wrapper .preview-actions,
.builder-wrapper .social-share-buttons,
.builder-wrapper .hero-buttons-bar,
.builder-wrapper .vv-mode-tabs,
.builder-wrapper .social-share-panel > div[style*="flex-direction: column"] {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  align-items: stretch !important;
  gap: 10px !important;
  width: 100% !important;
}
.builder-wrapper .editor-actions > *,
.builder-wrapper .preview-actions > *,
.builder-wrapper .social-share-buttons > *,
.builder-wrapper .hero-buttons-bar > *,
.builder-wrapper .vv-mode-tabs > * {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 48px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}
/* Rijmhulp naast een regel blijft klein, zodat er genoeg schrijfruimte overblijft. */
.builder-wrapper .line-input-group .btn-rhyme-help,
.builder-wrapper button.btn-rhyme-help {
  background: var(--vv-studio-button) !important;
  color: #fff !important;
  border-color: var(--vv-studio-button) !important;
  width: 40px !important;
  min-width: 40px !important;
  max-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 !important;
  display: inline-flex !important;
}
.builder-wrapper .modal-close { width: auto !important; min-height: 0 !important; background: transparent !important; border: 0 !important; color: inherit !important; }


/* ==========================================================
   v19.7 — warme voorpagina-stijl en consistente uitlijning
   Palet: perkament, warm wit, houtskool en oranje accent.
   ========================================================== */
.builder-wrapper {
  --vv-studio-button: #A77B48;
  --vv-studio-button-hover: #D44E0D;
  --vv-studio-paper: #FAF8F5;
  --vv-studio-page: #f0e4db;
  --vv-studio-border: #E8E2D5;
  max-width: 1180px !important;
  padding: 0 clamp(12px, 2.5vw, 28px) !important;
  color: #2D3748 !important;
}
.builder-wrapper .builder-header,
.builder-wrapper .ai-assistant-card,
.builder-wrapper .editor-card,
.builder-wrapper .preview-card,
.builder-wrapper .vv-panel,
.builder-wrapper .vv-card,
.builder-wrapper .tool-card {
  background: #FFFFFF !important;
  border-color: var(--vv-studio-border) !important;
  border-radius: 16px !important;
  box-shadow: 0 5px 18px rgba(50, 35, 24, .055) !important;
}
.builder-wrapper .builder-header {
  gap: 20px !important;
  padding: clamp(18px, 3vw, 30px) !important;
  align-items: center !important;
}
.builder-wrapper .builder-header h1,
.builder-wrapper .ai-assistant-header h2,
.builder-wrapper h2,
.builder-wrapper h3 {
  color: #1A202C !important;
}
.builder-wrapper .builder-header p,
.builder-wrapper .ai-assistant-header p {
  color: #718096 !important;
}
.builder-wrapper .tier-badge {
  background: var(--vv-studio-paper) !important;
  border-color: var(--vv-studio-border) !important;
  border-radius: 999px !important;
}
.builder-wrapper .vv-mode-tabs {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 14px !important;
}
.builder-wrapper .vv-mode-tabs > .vv-tab-btn,
.builder-wrapper .vv-tab-btn {
  position: relative !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 104px !important;
  height: 100% !important;
  padding: 16px !important;
  display: flex !important;
  justify-content: flex-start !important;
  text-align: left !important;
  color: #2D3748 !important;
  background: #FFFFFF !important;
  border: 1.5px solid var(--vv-studio-border) !important;
  border-radius: 14px !important;
  box-shadow: 0 3px 10px rgba(50,35,24,.035) !important;
}
.builder-wrapper .vv-mode-tabs > .vv-tab-btn:hover,
.builder-wrapper .vv-tab-btn:hover {
  background: #FAF8F5 !important;
  border-color: #E8B49A !important;
  transform: translateY(-1px) !important;
}
.builder-wrapper .vv-mode-tabs > .vv-tab-btn.active,
.builder-wrapper .vv-tab-btn.active {
  background: #FFF8F3 !important;
  border-color: #A77B48 !important;
  box-shadow: 0 0 0 2px rgba(253,103,33,.08) !important;
}
.builder-wrapper .vv-tab-btn > span:first-child {
  flex: 0 0 38px !important;
  width: 38px !important;
  height: 38px !important;
  border-radius: 10px !important;
  background: #FFF0E7 !important;
  color: #D44E0D !important;
}
.builder-wrapper .vv-tab-btn.active > span:first-child {
  background: #A77B48 !important;
  color: #FFFFFF !important;
}
.builder-wrapper .ai-assistant-card {
  border-width: 1px !important;
  padding: clamp(18px, 3vw, 30px) !important;
  margin-bottom: 28px !important;
}
.builder-wrapper .ai-field-group label,
.builder-wrapper label {
  color: #2D3748 !important;
  line-height: 1.45 !important;
}
.builder-wrapper input:not([type="checkbox"]):not([type="radio"]),
.builder-wrapper textarea,
.builder-wrapper select {
  box-sizing: border-box !important;
  max-width: 100% !important;
  border: 1px solid #D8CFC5 !important;
  border-radius: 9px !important;
  background: #FFFFFF !important;
  color: #2D3748 !important;
  min-height: 46px;
}
.builder-wrapper textarea { min-height: 110px; line-height: 1.65 !important; }
.builder-wrapper input:focus,
.builder-wrapper textarea:focus,
.builder-wrapper select:focus {
  border-color: #A77B48 !important;
  box-shadow: 0 0 0 3px rgba(253,103,33,.13) !important;
  outline: none !important;
}
.builder-wrapper .btn-ai-generate,
.builder-wrapper .btn-cta-generate,
.builder-wrapper .btn-sidebar-cta,
.builder-wrapper .btn-cta-upgrade,
.builder-wrapper .vv-btn-submit-checkout,
.builder-wrapper .btn-primary,
.builder-wrapper .btn-tool,
.builder-wrapper .btn-secondary,
.builder-wrapper .btn-social-share,
.builder-wrapper button[type="submit"] {
  background: #A77B48 !important;
  background-image: none !important;
  border: 1px solid #A77B48 !important;
  color: #FFFFFF !important;
  border-radius: 9px !important;
  min-height: 48px !important;
  height: auto !important;
  padding: 12px 18px !important;
  box-sizing: border-box !important;
  box-shadow: none !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  text-decoration: none !important;
}
.builder-wrapper .btn-ai-generate:hover,
.builder-wrapper .btn-cta-generate:hover,
.builder-wrapper .btn-sidebar-cta:hover,
.builder-wrapper .btn-cta-upgrade:hover,
.builder-wrapper .vv-btn-submit-checkout:hover,
.builder-wrapper .btn-primary:hover,
.builder-wrapper .btn-tool:hover,
.builder-wrapper .btn-secondary:hover,
.builder-wrapper .btn-social-share:hover,
.builder-wrapper button[type="submit"]:hover {
  background: #D44E0D !important;
  border-color: #D44E0D !important;
  color: #FFFFFF !important;
}
.builder-wrapper .editor-actions,
.builder-wrapper .preview-actions,
.builder-wrapper .social-share-buttons,
.builder-wrapper .hero-buttons-bar {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr)) !important;
  align-items: stretch !important;
  gap: 10px !important;
  width: 100% !important;
}
.builder-wrapper .editor-actions > *,
.builder-wrapper .preview-actions > *,
.builder-wrapper .social-share-buttons > *,
.builder-wrapper .hero-buttons-bar > * {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 48px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}
.builder-wrapper .btn-rhyme-help,
.builder-wrapper button.btn-rhyme-help {
  background: #FFF0E7 !important;
  border: 1px solid #E8B49A !important;
  color: #B8420D !important;
  box-shadow: none !important;
}
.builder-wrapper .btn-rhyme-help:hover,
.builder-wrapper button.btn-rhyme-help:hover {
  background: #A77B48 !important;
  border-color: #A77B48 !important;
  color: #FFFFFF !important;
}
.builder-wrapper details,
.builder-wrapper .tip-box,
.builder-wrapper .info-box {
  background: #FAF8F5 !important;
  border-color: var(--vv-studio-border) !important;
  border-radius: 10px !important;
}
.builder-wrapper summary { color: #B8420D !important; }
.builder-wrapper .vv-tab-btn strong { line-height: 1.35 !important; }
@media (max-width: 800px) {
  .builder-wrapper .vv-mode-tabs { grid-template-columns: 1fr !important; }
  .builder-wrapper .vv-mode-tabs > .vv-tab-btn { min-height: 78px !important; }
  .builder-wrapper .builder-header { align-items: flex-start !important; flex-direction: column !important; }
  .builder-wrapper .ai-form-grid { grid-template-columns: 1fr !important; }
}
@media (max-width: 520px) {
  .builder-wrapper { padding: 0 12px !important; }
  .builder-wrapper .ai-assistant-card { padding: 16px !important; }
  .builder-wrapper .editor-actions,
  .builder-wrapper .preview-actions,
  .builder-wrapper .social-share-buttons,
  .builder-wrapper .hero-buttons-bar { grid-template-columns: 1fr !important; }
}


/* v19.8 — uitlijning acties, Zen-label en lichte warme modelknoppen */
.builder-wrapper .vv-mode-tabs-container .vv-mode-tabs {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 12px !important;
}
.builder-wrapper .vv-mode-tabs-container .vv-model-choice {
  min-width: 0 !important;
  min-height: 86px !important;
  height: 100% !important;
  padding: 14px 16px !important;
  background: #FFF5EF !important;
  border: 1px solid #E8B49A !important;
  border-radius: 10px !important;
  color: #24201D !important;
  font-weight: 400 !important;
  box-shadow: none !important;
  transform: none !important;
}
.builder-wrapper .vv-mode-tabs-container .vv-model-choice:hover,
.builder-wrapper .vv-mode-tabs-container .vv-model-choice.active {
  background: #FFE8DA !important;
  border-color: #D98256 !important;
  color: #24201D !important;
  box-shadow: 0 2px 8px rgba(150, 76, 39, .08) !important;
}
.builder-wrapper .vv-mode-tabs-container .vv-model-choice strong,
.builder-wrapper .vv-mode-tabs-container .vv-model-choice small {
  color: #24201D !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
}
.builder-wrapper .vv-mode-tabs-container .vv-model-choice small {
  display: block !important;
  margin-top: 3px !important;
  font-size: 12px !important;
}
.builder-wrapper .vv-mode-tabs-container .vv-model-choice > span:first-child {
  flex: 0 0 36px !important;
  width: 36px !important; height: 36px !important;
  background: #F8D8C5 !important; color: #7B3C20 !important;
}
.builder-wrapper .vv-mode-tabs-container .vv-model-choice.active > span:first-child {
  background: #F8D8C5 !important; color: #7B3C20 !important;
}
.builder-wrapper .btn-zen-mode {
  appearance: none !important; background: transparent !important; border: 0 !important;
  border-radius: 0 !important; padding: 3px 0 !important; color: #4A403A !important;
  font-size: 12px !important; font-weight: 500 !important; box-shadow: none !important;
  display: inline-flex !important; align-items: center !important; gap: 6px !important;
  white-space: nowrap !important;
}
.builder-wrapper .btn-zen-mode:hover { background: transparent !important; color: #B8420D !important; border-color: transparent !important; }
.builder-wrapper .vv-mode-pill { display: inline-flex !important; align-items: center !important; gap: 5px !important; line-height: 1.4 !important; white-space: nowrap !important; }
.builder-wrapper .editor-pane .input-card > div:first-child { align-items: center !important; }
.builder-wrapper .btn-download-inline {
  flex: 0 0 auto !important; display: inline-flex !important; align-items: center !important;
  justify-content: center !important; gap: 6px !important; min-height: 34px !important;
  padding: 5px 10px !important; font-size: 12px !important; white-space: nowrap !important;
  background: #FFF0E7 !important; border: 1px solid #E8B49A !important;
  color: #29221E !important; font-weight: 400 !important;
}
.builder-wrapper .btn-download-inline:hover { background: #FFE1CF !important; color: #29221E !important; border-color: #D98256 !important; }
.builder-wrapper .preview-actions { display: block !important; width: 100% !important; }
.builder-wrapper .preview-actions .btn-copy-wide {
  display: flex !important; width: 100% !important; max-width: none !important;
  min-height: 48px !important; align-items: center !important; justify-content: center !important;
  gap: 8px !important; box-sizing: border-box !important;
  background: #FFF0E7 !important; border: 1px solid #E8B49A !important;
  color: #29221E !important; font-weight: 400 !important;
}
.builder-wrapper .preview-actions .btn-copy-wide:hover { background: #FFE1CF !important; border-color: #D98256 !important; color: #29221E !important; }
@media (max-width: 800px) {
  .builder-wrapper .vv-mode-tabs-container .vv-mode-tabs { grid-template-columns: 1fr !important; }
  .builder-wrapper .vv-mode-tabs-container .vv-model-choice { min-height: 72px !important; }
}

.builder-wrapper .vv-editor-tool-row { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 6px !important; }
.builder-wrapper .vv-editor-tool-row > .btn-tool { flex: 0 0 auto !important; width: auto !important; min-height: 34px !important; }


/* v19.9 — homepage-hero voor de studio en consistente werkbalk */
.builder-wrapper .vv-studio-hero {
    position: relative !important;
    width: 100% !important;
    height: 390px !important;
    min-height: 340px !important;
    margin: 0 0 30px !important;
    border-radius: 20px !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
    background: #F0E4DB !important;
    clip-path: none !important;
    -webkit-clip-path: none !important;
}
.builder-wrapper .vv-studio-hero .hero-bg-layer { position: absolute !important; inset: 0 !important; background-size: cover !important; background-position: center right !important; z-index: 1 !important; }
.builder-wrapper .vv-studio-hero::after { content: '' !important; position: absolute !important; inset: 0 !important; background: linear-gradient(90deg, rgba(240,228,219,.88) 0%, rgba(240,228,219,.56) 48%, rgba(240,228,219,.05) 100%) !important; z-index: 2 !important; pointer-events: none !important; }
.builder-wrapper .vv-studio-hero .hero-inner-container { position: relative !important; z-index: 3 !important; width: 100% !important; max-width: 1280px !important; margin: 0 auto !important; padding: 30px 36px !important; }
.builder-wrapper .vv-studio-hero .hero-typography-block { max-width: 650px !important; text-align: left !important; }
.builder-wrapper .vv-studio-hero .hero-main-title { font-family: 'Cormorant Garamond', Georgia, serif !important; font-size: clamp(36px, 4vw, 56px) !important; line-height: 1.08 !important; color: #29221E !important; margin: 0 0 12px !important; }
.builder-wrapper .vv-studio-hero .hero-main-desc { color: #4A403A !important; font-size: 17px !important; line-height: 1.65 !important; margin: 0 0 16px !important; max-width: 600px !important; }
.builder-wrapper .vv-studio-hero .hero-kicker { color: #8A4727 !important; background: rgba(255,248,242,.86) !important; }
.builder-wrapper .vv-studio-hero-credit { display: inline-flex !important; align-items: center !important; gap: 8px !important; padding: 8px 13px !important; margin: 0 0 14px !important; border: 1px solid rgba(138,71,39,.22) !important; border-radius: 999px !important; background: rgba(255,250,246,.9) !important; color: #4A3327 !important; font-size: 13px !important; font-weight: 500 !important; }
.builder-wrapper .vv-studio-hero-credit > i { color: #A95831 !important; }
.builder-wrapper .vv-studio-hero-buttons { display: flex !important; flex-wrap: wrap !important; gap: 10px !important; align-items: center !important; margin-top: 0 !important; }
.builder-wrapper .vv-studio-hero-buttons .vv-btn-warm-light { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 9px !important; min-height: 44px !important; padding: 11px 18px !important; border-radius: 10px !important; border: 1px solid #D9A98F !important; background: rgba(255,250,246,.94) !important; color: #30251F !important; text-decoration: none !important; font-size: 14px !important; font-weight: 600 !important; box-shadow: 0 3px 12px rgba(90,48,27,.08) !important; }
.builder-wrapper .vv-studio-hero-buttons .vv-btn-warm-light:hover { background: #FFE5D6 !important; border-color: #C87C52 !important; color: #30251F !important; }
.builder-wrapper .vv-editor-tool-row { display: flex !important; flex-wrap: nowrap !important; align-items: stretch !important; gap: 8px !important; width: 100% !important; }
.builder-wrapper .vv-editor-tool-row > button { flex: 1 1 0 !important; min-width: 0 !important; min-height: 36px !important; display: inline-flex !important; justify-content: center !important; align-items: center !important; gap: 6px !important; white-space: nowrap !important; }
.builder-wrapper a.btn-zen-mode { text-decoration: none !important; cursor: pointer !important; }
@media (max-width: 680px) {
  .builder-wrapper .vv-studio-hero { height: auto !important; min-height: 340px !important; }
  .builder-wrapper .vv-studio-hero .hero-inner-container { padding: 28px 20px !important; }
  .builder-wrapper .vv-studio-hero .hero-bg-layer { background-position: 65% center !important; }
  .builder-wrapper .vv-studio-hero::after { background: linear-gradient(90deg, rgba(240,228,219,.94) 0%, rgba(240,228,219,.82) 72%, rgba(240,228,219,.46) 100%) !important; }
  .builder-wrapper .vv-studio-hero-buttons { align-items: stretch !important; }
  .builder-wrapper .vv-studio-hero-buttons .vv-btn-warm-light { flex: 1 1 100% !important; }
  .builder-wrapper .vv-editor-tool-row { gap: 5px !important; }
  .builder-wrapper .vv-editor-tool-row > button { font-size: 11px !important; padding: 5px 6px !important; }
}


/* v20.0 — maximaal 35px ruimte boven pluginpagina's en templates */
body .builder-wrapper,
body .container-studio,
body .author-studio-hero,
body .vv-studio-page,
body .vv-profile-page,
body .vv-album-page,
body .vv-poem-archive-page,
body .vv-plugin-page {
}

/* v20.0 — werkbalk in twee gelijke kolommen met download over volle breedte */
.builder-wrapper .vv-editor-tool-row {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    gap: 8px !important;
    width: 100% !important;
}
.builder-wrapper .vv-editor-tool-row > #btnSpeakPoem,
.builder-wrapper .vv-editor-tool-row > #btnDichtersBlokkade {
    grid-column: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 42px !important;
    box-sizing: border-box !important;
    white-space: normal !important;
}
.builder-wrapper .vv-editor-tool-row > #btnDownloadImg {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 42px !important;
    box-sizing: border-box !important;
}

/* Zen Verlaten is uitsluitend zichtbaar zolang Zen Modus actief is. */
body:not(.vv-zen-active) .btn-exit-zen {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}
body.vv-zen-active .btn-exit-zen {
    display: inline-flex !important;
    visibility: visible !important;
    pointer-events: auto !important;
}
@media (max-width: 480px) {
    .builder-wrapper .vv-editor-tool-row { gap: 6px !important; }
    .builder-wrapper .vv-editor-tool-row > button { font-size: 12px !important; padding: 8px 6px !important; }
}

/* v20.3 — responsive breedtes afgestemd op Vers & Vorm thema v22.31 */
@media (max-width: 1023px) {
  .builder-wrapper,
  .container-studio,
  .author-studio-hero,
  .vv-studio-page,
  .vv-profile-page,
  .vv-album-page,
  .vv-poem-archive-page,
  .vv-plugin-page,
  .vv-theme-landing-page,
  .vv-landing-builder-container {
    width: 94% !important;
    max-width: 1280px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }

  .builder-wrapper {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .builder-wrapper *,
  .container-studio *,
  .vv-studio-page *,
  .vv-profile-page *,
  .vv-album-page *,
  .vv-poem-archive-page *,
  .vv-plugin-page *,
  .vv-theme-landing-page * {
    box-sizing: border-box;
    min-width: 0;
  }

  .builder-wrapper .builder-header,
  .builder-wrapper .vv-studio-hero,
  .builder-wrapper .vv-mode-selector,
  .builder-wrapper .vv-mode-tabs-container,
  .builder-wrapper .vv-result-actions-card,
  .builder-wrapper .vv-model-choice,
  .builder-wrapper .vv-perk-card,
  .builder-wrapper .vv-theme-card,
  .builder-wrapper .vv-contact-header,
  .builder-wrapper .vv-landing-header,
  .builder-wrapper .vv-mollie-checkout-wrapper,
  .vv-theme-landing-page .vv-theme-card,
  .vv-theme-landing-page .vv-perk-card,
  .vv-profile-page .card,
  .vv-album-page .card,
  .vv-poem-archive-page .card {
    max-width: 100% !important;
  }

  .builder-wrapper img,
  .builder-wrapper video,
  .builder-wrapper iframe,
  .container-studio img,
  .vv-studio-page img,
  .vv-profile-page img,
  .vv-album-page img {
    max-width: 100%;
  }
}

@media (max-width: 767px) {
  .builder-wrapper,
  .container-studio,
  .author-studio-hero,
  .vv-studio-page,
  .vv-profile-page,
  .vv-album-page,
  .vv-poem-archive-page,
  .vv-plugin-page,
  .vv-theme-landing-page,
  .vv-landing-builder-container {
    width: 94% !important;
    margin-top: 12px !important;
    margin-bottom: 24px !important;
  }

  .builder-wrapper .builder-header {
    padding: 16px !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
    border-radius: 14px !important;
  }

  .builder-wrapper .builder-header h1 {
    font-size: clamp(1.55rem, 6vw, 2rem) !important;
    line-height: 1.12 !important;
    overflow-wrap: anywhere;
  }

  .builder-wrapper .vv-studio-hero {
    border-radius: 16px !important;
  }

  .builder-wrapper .vv-studio-hero .hero-inner-container {
    padding: 24px 18px !important;
  }

  .builder-wrapper .vv-studio-hero-buttons,
  .builder-wrapper .vv-editor-tool-row {
    max-width: 100% !important;
  }

  .builder-wrapper input,
  .builder-wrapper select,
  .builder-wrapper textarea,
  .builder-wrapper button,
  .builder-wrapper .button {
    max-width: 100%;
  }

  .builder-wrapper table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
  }
}


/* v20.4: keep the whole poetry studio at 94vw on small screens.
   Use viewport width (not parent percentage) to avoid compounded/nested margins. */
@media (max-width: 1023px) {
  .builder-wrapper,
  .container-studio,
  .author-studio-hero,
  .vv-studio-page,
  .vv-profile-page,
  .vv-album-page,
  .vv-poem-archive-page,
  .vv-plugin-page,
  .vv-theme-landing-page,
  .vv-landing-builder-container {
    width: 94vw !important;
    max-width: 1280px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }
  .builder-wrapper {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .builder-wrapper > *,
  .container-studio > *,
  .vv-studio-page > *,
  .vv-plugin-page > * {
    max-width: 100%;
    box-sizing: border-box;
  }
}
@media (max-width: 767px) {
  .builder-wrapper,
  .container-studio,
  .author-studio-hero,
  .vv-studio-page,
  .vv-profile-page,
  .vv-album-page,
  .vv-poem-archive-page,
  .vv-plugin-page,
  .vv-theme-landing-page,
  .vv-landing-builder-container {
    width: 94vw !important;
    margin-top: 12px !important;
    margin-bottom: 24px !important;
  }
}


/* v20.5 — complete responsive width pass for public plugin views */
@media (max-width: 1023px) {
  body .builder-wrapper,
  body .author-studio-hero,
  body .vv-studio-page,
  body .vv-profile-page,
  body .vv-album-page,
  body .vv-poem-archive-page,
  body .vv-plugin-page,
  body .vv-theme-landing-page,
  body .vv-landing-builder-container,
  body .vv-contact-container,
  body .vv-checkout-styled-wrapper,
  body .vv-mollie-checkout-wrapper {
    width: 94vw !important;
    max-width: 94vw !important;
    min-width: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }

  /* Nested plugin sections/cards use the full 94vw parent, not a second 94%. */
  .builder-wrapper > *,
  .builder-wrapper .vv-studio-hero,
  .builder-wrapper .builder-header,
  .builder-wrapper .vv-mode-selector,
  .builder-wrapper .vv-mode-tabs-container,
  .builder-wrapper .vv-result-actions-card,
  .builder-wrapper .vv-model-choice,
  .builder-wrapper .vv-perk-card,
  .builder-wrapper .vv-theme-card,
  .builder-wrapper .vv-contact-header,
  .builder-wrapper .vv-landing-header,
  .vv-studio-page > *,
  .vv-profile-page > *,
  .vv-album-page > *,
  .vv-poem-archive-page > *,
  .vv-plugin-page > *,
  .vv-theme-landing-page > * {
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  .builder-wrapper img,
  .builder-wrapper video,
  .builder-wrapper iframe,
  .vv-studio-page img,
  .vv-profile-page img,
  .vv-album-page img,
  .vv-poem-archive-page img,
  .vv-plugin-page img,
  .vv-theme-landing-page img {
    max-width: 100% !important;
    height: auto;
  }

  .builder-wrapper .builder-grid,
  .builder-wrapper .vv-form-grid,
  .vv-profile-page .vv-form-grid,
  .vv-album-page .vv-form-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .builder-wrapper table,
  .vv-profile-page table,
  .vv-album-page table,
  .vv-poem-archive-page table {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

@media (max-width: 767px) {
  .builder-wrapper,
  .vv-studio-page,
  .vv-profile-page,
  .vv-album-page,
  .vv-poem-archive-page,
  .vv-plugin-page,
  .vv-theme-landing-page,
  .vv-contact-container,
  .vv-checkout-styled-wrapper,
  .vv-mollie-checkout-wrapper {
    width: 94vw !important;
    max-width: 94vw !important;
    margin-top: 12px !important;
    margin-bottom: 22px !important;
  }

  .builder-wrapper .builder-header,
  .builder-wrapper .vv-studio-hero,
  .builder-wrapper .vv-result-actions-card,
  .builder-wrapper .vv-model-choice,
  .builder-wrapper .vv-perk-card,
  .builder-wrapper .vv-theme-card,
  .vv-profile-page .card,
  .vv-album-page .card,
  .vv-poem-archive-page .card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  .builder-wrapper input,
  .builder-wrapper select,
  .builder-wrapper textarea,
  .builder-wrapper button,
  .builder-wrapper .button,
  .vv-plugin-page input,
  .vv-plugin-page select,
  .vv-plugin-page textarea,
  .vv-plugin-page button {
    max-width: 100%;
    box-sizing: border-box;
  }
}

/* v20.5a — generic fallback for plugin cards/sections with custom class names */
@media (max-width: 1023px) {
  .builder-wrapper [class*="card"],
  .builder-wrapper [class*="section"],
  .builder-wrapper [class*="hero"],
  .builder-wrapper [class*="grid"],
  .vv-studio-page [class*="card"],
  .vv-profile-page [class*="card"],
  .vv-album-page [class*="card"],
  .vv-poem-archive-page [class*="card"],
  .vv-plugin-page [class*="card"],
  .vv-theme-landing-page [class*="card"] {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  .builder-wrapper [class*="card"] img,
  .vv-studio-page [class*="card"] img,
  .vv-profile-page [class*="card"] img,
  .vv-album-page [class*="card"] img,
  .vv-poem-archive-page [class*="card"] img {
    max-width: 100% !important;
    height: auto;
  }
}
@media (max-width: 767px) {
  .builder-wrapper [class*="grid"],
  .vv-studio-page [class*="grid"],
  .vv-profile-page [class*="grid"],
  .vv-album-page [class*="grid"],
  .vv-poem-archive-page [class*="grid"] {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-auto-columns: minmax(0, 1fr) !important;
  }
}


/* v20.6 — ensure all front-end plugin views use a consistent 94vw rail on phones. */
@media (max-width: 767px) {
  body:not(.wp-admin) .builder-wrapper,
  body:not(.wp-admin) .container-studio,
  body:not(.wp-admin) .author-studio-hero,
  body:not(.wp-admin) .vv-studio-page,
  body:not(.wp-admin) .vv-profile-page,
  body:not(.wp-admin) .vv-album-page,
  body:not(.wp-admin) .vv-poem-archive-page,
  body:not(.wp-admin) .vv-plugin-page,
  body:not(.wp-admin) .vv-theme-landing-page,
  body:not(.wp-admin) .vv-landing-builder-container {
    width: 94vw !important;
    max-width: 94vw !important;
    min-width: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }

  /* Nested plugin containers/cards fill the 94vw rail, avoiding compounding. */
  .builder-wrapper .container,
  .builder-wrapper .container-studio,
  .vv-studio-page .container,
  .vv-profile-page .container,
  .vv-album-page .container,
  .vv-poem-archive-page .container,
  .vv-plugin-page .container,
  .vv-theme-landing-page .container,
  .builder-wrapper [class*="card"],
  .vv-studio-page [class*="card"],
  .vv-profile-page [class*="card"],
  .vv-album-page [class*="card"],
  .vv-poem-archive-page [class*="card"],
  .vv-plugin-page [class*="card"],
  .vv-theme-landing-page [class*="card"],
  .builder-wrapper [class*="section"],
  .vv-studio-page [class*="section"],
  .vv-profile-page [class*="section"],
  .vv-album-page [class*="section"],
  .vv-poem-archive-page [class*="section"],
  .vv-plugin-page [class*="section"],
  .vv-theme-landing-page [class*="section"] {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  .builder-wrapper img,
  .vv-studio-page img,
  .vv-profile-page img,
  .vv-album-page img,
  .vv-poem-archive-page img,
  .vv-plugin-page img,
  .vv-theme-landing-page img,
  .builder-wrapper iframe,
  .vv-studio-page iframe,
  .vv-profile-page iframe,
  .vv-album-page iframe,
  .vv-poem-archive-page iframe,
  .vv-plugin-page iframe,
  .vv-theme-landing-page iframe {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}


/* v20.7 — apply the mobile 94vw rail to every public plugin view. Nested content
   fills the rail at 100% to prevent repeated percentage shrinkage. */
@media (max-width: 767px) {
  body:not(.wp-admin) .builder-wrapper,
  body:not(.wp-admin) .container-studio,
  body:not(.wp-admin) .author-studio-hero,
  body:not(.wp-admin) .vv-studio-page,
  body:not(.wp-admin) .vv-profile-page,
  body:not(.wp-admin) .vv-album-page,
  body:not(.wp-admin) .vv-poem-archive-page,
  body:not(.wp-admin) .vv-plugin-page,
  body:not(.wp-admin) .vv-theme-landing-page,
  body:not(.wp-admin) .vv-landing-builder-container {
    width: 94vw !important;
    max-width: 94vw !important;
    min-width: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
  }

  .builder-wrapper > *, .container-studio > *,
  .vv-studio-page > *, .vv-profile-page > *, .vv-album-page > *,
  .vv-poem-archive-page > *, .vv-plugin-page > *, .vv-theme-landing-page > *,
  .builder-wrapper .container, .container-studio .container,
  .vv-studio-page .container, .vv-profile-page .container,
  .vv-album-page .container, .vv-poem-archive-page .container,
  .vv-plugin-page .container, .vv-theme-landing-page .container,
  .builder-wrapper [class*="card"], .builder-wrapper [class*="tile"],
  .builder-wrapper [class*="hero"], .builder-wrapper [class*="section"],
  .builder-wrapper [class*="panel"], .builder-wrapper [class*="grid"],
  .vv-studio-page [class*="card"], .vv-studio-page [class*="tile"],
  .vv-studio-page [class*="hero"], .vv-studio-page [class*="section"],
  .vv-studio-page [class*="panel"], .vv-studio-page [class*="grid"],
  .vv-profile-page [class*="card"], .vv-profile-page [class*="section"],
  .vv-album-page [class*="card"], .vv-album-page [class*="section"],
  .vv-poem-archive-page [class*="card"], .vv-poem-archive-page [class*="section"],
  .vv-plugin-page [class*="card"], .vv-plugin-page [class*="section"],
  .vv-theme-landing-page [class*="card"], .vv-theme-landing-page [class*="section"] {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }

  .builder-wrapper img, .builder-wrapper video, .builder-wrapper iframe,
  .container-studio img, .vv-studio-page img, .vv-profile-page img,
  .vv-album-page img, .vv-poem-archive-page img, .vv-plugin-page img,
  .vv-theme-landing-page img, .builder-wrapper table, .vv-studio-page table,
  .vv-profile-page table, .vv-album-page table, .vv-poem-archive-page table {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}


/* v20.8 — final mobile content rail. Exclude global theme navigation explicitly:
   .container-studio is also used inside the full-width Studio submenu. */
@media (max-width: 767px) {
  body:not(.wp-admin) :is(
    .builder-wrapper, .author-studio-hero, .vv-studio-page, .vv-profile-page,
    .vv-album-page, .vv-poem-archive-page, .vv-plugin-page,
    .vv-theme-landing-page, .vv-landing-builder-container
  ) {
    width: 94vw !important;
    max-width: 94vw !important;
    min-width: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
  }

  /* Do not narrow the global submenu when the plugin stylesheet loads later. */
  body:not(.wp-admin) .studio-subnav-bar,
  body:not(.wp-admin) .studio-subnav-bar .container-studio,
  body:not(.wp-admin) .studio-subnav-bar .studio-subnav-items {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }

  body:not(.wp-admin) :is(
    .builder-wrapper, .author-studio-hero, .vv-studio-page, .vv-profile-page,
    .vv-album-page, .vv-poem-archive-page, .vv-plugin-page,
    .vv-theme-landing-page, .vv-landing-builder-container
  ) :is(.container, .container-studio, [class*="card"], [class*="tile"],
        [class*="hero"], [class*="section"], [class*="panel"], [class*="grid"],
        [class*="archive"], [class*="profile"], [class*="album"], [class*="poem"],
        [class*="form"], [class*="content-card"]) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }

  body:not(.wp-admin) :is(
    .builder-wrapper, .author-studio-hero, .vv-studio-page, .vv-profile-page,
    .vv-album-page, .vv-poem-archive-page, .vv-plugin-page,
    .vv-theme-landing-page, .vv-landing-builder-container
  ) :is(img, video, iframe, svg, canvas, table, input, select, textarea, button) {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}


/* v20.8b — all plugin content cards occupy the full 94vw rail on phones. */
@media (max-width: 767px) {
  body:not(.wp-admin) :is(
    .builder-wrapper, .author-studio-hero, .vv-studio-page, .vv-profile-page,
    .vv-album-page, .vv-poem-archive-page, .vv-plugin-page,
    .vv-theme-landing-page, .vv-landing-builder-container
  ) :is([class*="card"], [class*="tile"], [class*="hero"], [class*="section"],
        [class*="panel"], [class*="grid"], [class*="archive"], [class*="listing"],
        [class*="profile"], [class*="album"], [class*="poem"], [class*="cta"]) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }
  body:not(.wp-admin) :is(.builder-wrapper, .vv-studio-page, .vv-profile-page,
    .vv-album-page, .vv-poem-archive-page, .vv-plugin-page) :is([class*="grid"]) {
    grid-template-columns: minmax(0, 1fr) !important;
    column-gap: 0 !important;
  }
}


/* v20.9 — plugin content uses a centered 90vw rail; site chrome stays full width. */
@media (max-width: 767px) {
  body:not(.wp-admin) :is(
    .builder-wrapper, .container-studio, .author-studio-hero, .vv-studio-page,
    .vv-profile-page, .vv-album-page, .vv-poem-archive-page, .vv-plugin-page,
    .vv-theme-landing-page, .vv-landing-builder-container,
    .vv-poem-generator, .vv-poem-editor, .vv-poem-studio, .vv-profile-studio,
    .vv-album-studio, .vv-book-studio, .vv-gedichtenstudio, .vv-studio-wrapper
  ) {
    width: 90vw !important;
    max-width: 90vw !important;
    min-width: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
  }

  /* Do not constrain the global header or navigation from plugin CSS. */
  body:not(.wp-admin) .site-header,
  body:not(.wp-admin) .site-header > *,
  body:not(.wp-admin) .site-header nav,
  body:not(.wp-admin) .primary-navigation,
  body:not(.wp-admin) .studio-subnav-bar,
  body:not(.wp-admin) .studio-subnav-bar > *,
  body:not(.wp-admin) .studio-subnav-bar .container-studio {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }

  /* Elements inside a plugin page fill its 90vw rail without stacking gutters. */
  body:not(.wp-admin) :is(
    .builder-wrapper, .author-studio-hero, .vv-studio-page, .vv-profile-page,
    .vv-album-page, .vv-poem-archive-page, .vv-plugin-page,
    .vv-theme-landing-page, .vv-landing-builder-container,
    .vv-poem-generator, .vv-poem-editor, .vv-poem-studio, .vv-profile-studio,
    .vv-album-studio, .vv-book-studio, .vv-gedichtenstudio, .vv-studio-wrapper
  ) :is(.container, .container-studio, .content-wrap, .content-inner,
        [class*="card"], [class*="tile"], [class*="hero"], [class*="section"],
        [class*="panel"], [class*="grid"], [class*="archive"], [class*="listing"],
        [class*="profile"], [class*="album"], [class*="poem"], [class*="cta"],
        [class*="form"], [class*="content-card"], .wp-block-group, .wp-block-columns) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }

  body:not(.wp-admin) :is(
    .builder-wrapper, .author-studio-hero, .vv-studio-page, .vv-profile-page,
    .vv-album-page, .vv-poem-archive-page, .vv-plugin-page,
    .vv-theme-landing-page, .vv-landing-builder-container,
    .vv-poem-generator, .vv-poem-editor, .vv-poem-studio, .vv-profile-studio,
    .vv-album-studio, .vv-book-studio, .vv-gedichtenstudio, .vv-studio-wrapper
  ) :is(img, video, iframe, svg, canvas, table, input, select, textarea, button) {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  body:not(.wp-admin) :is(.builder-wrapper, .vv-studio-page, .vv-profile-page,
    .vv-album-page, .vv-poem-archive-page, .vv-plugin-page,
    .vv-poem-generator, .vv-poem-editor, .vv-poem-studio, .vv-studio-wrapper) :is([class*="grid"]) {
    grid-template-columns: minmax(0, 1fr) !important;
    column-gap: 0 !important;
  }
}


/* v20.10 — plugin pages share the theme's 85% mobile content rail. */
@media (max-width: 767px) {
  html, body { max-width:100%; overflow-x:clip; }
  body:not(.wp-admin) .site-header,
  body:not(.wp-admin) .site-header > *,
  body:not(.wp-admin) .site-header .header-container,
  body:not(.wp-admin) .site-header .primary-navigation,
  body:not(.wp-admin) .site-header nav,
  body:not(.wp-admin) .studio-subnav-bar,
  body:not(.wp-admin) .studio-subnav-bar > *,
  body:not(.wp-admin) .studio-subnav-bar .container-studio {
    width:100% !important; max-width:none !important;
    margin-left:0 !important; margin-right:0 !important; box-sizing:border-box !important;
  }
  body:not(.wp-admin) .site-content,
  body:not(.wp-admin) .builder-wrapper,
  body:not(.wp-admin) .container-studio,
  body:not(.wp-admin) .author-studio-hero,
  body:not(.wp-admin) .vv-studio-page,
  body:not(.wp-admin) .vv-profile-page,
  body:not(.wp-admin) .vv-album-page,
  body:not(.wp-admin) .vv-poem-archive-page,
  body:not(.wp-admin) .vv-plugin-page,
  body:not(.wp-admin) .vv-theme-landing-page,
  body:not(.wp-admin) .vv-landing-builder-container {
    width:85vw !important; max-width:85vw !important; min-width:0 !important;
    margin-left:auto !important; margin-right:auto !important;
    padding-left:0 !important; padding-right:0 !important; box-sizing:border-box !important;
  }
  body:not(.wp-admin) .site-content :is(
    .builder-wrapper, .container-studio, .author-studio-hero,
    .vv-studio-page, .vv-profile-page, .vv-album-page,
    .vv-poem-archive-page, .vv-plugin-page, .vv-theme-landing-page,
    .vv-landing-builder-container, .card, .tile, .hero, .section,
    .panel, .grid, .container, [class*="card"], [class*="tile"],
    [class*="hero"], [class*="section"], [class*="panel"],
    [class*="grid"], [class*="poem"], [class*="album"],
    [class*="profile"], [class*="form"], [class*="editor"]
  ) { max-width:100% !important; min-width:0 !important; box-sizing:border-box !important; }
  body:not(.wp-admin) .site-content :is(img, video, iframe, svg, canvas, table, input, select, textarea, button) {
    max-width:100% !important; box-sizing:border-box !important;
  }
}



/* Gedichten Studio v20.11 — gelijk aan de 85%-contentrail van het thema. */
body:not(.wp-admin) :is(.site-content, #content) :is(
  .builder-wrapper, .builder-container, .container-studio, .author-studio-hero,
  .vv-studio-page, .vv-profile-page, .vv-album-page, .vv-poem-archive-page,
  .vv-plugin-page, .vv-theme-landing-page, .vv-landing-builder-container,
  .vv-poem-generator, .vv-poem-editor, .vv-poem-studio, .vv-profile-studio,
  .vv-album-studio, .vv-book-studio, .vv-gedichtenstudio, .vv-studio-wrapper,
  .vv-studio-hero, .builder-grid, .vv-mode-tabs-container
) {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
}
body:not(.wp-admin) :is(.site-content, #content) :is(
  .builder-wrapper, .vv-studio-page, .vv-profile-page, .vv-album-page,
  .vv-poem-archive-page, .vv-plugin-page, .vv-gedichtenstudio
) :is(
  [class*="card"], [class*="tile"], [class*="hero"], [class*="section"],
  [class*="panel"], [class*="grid"], [class*="archive"], [class*="listing"],
  [class*="profile"], [class*="album"], [class*="poem"], [class*="gedicht"],
  [class*="form"], [class*="editor"], [class*="studio"], [class*="content"],
  [class*="container"], [class*="wrap"], [class*="inner"]
) { max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; }


/* ==========================================================
   VERS & VORM v2.23: UNIFORME BREEDTE (1280px),
   2-KOLOMS CATEGORIE GRID, VOLLE BREEDTE AFBEELDING & GEEN MOBIELE SCHADUW
   ========================================================== */

/* 1. Breedte van alle gevraagde pagina's exact gelijk aan het menu (1280px) */
body:not(.wp-admin) .page-template-page-premium-dichters main.site-main,
body:not(.wp-admin) .page-template-page-dichtbundels-overzicht main.site-main,
body:not(.wp-admin) .page-template-page-themas-overzicht main.site-main,
body:not(.wp-admin) .page-template-page-gedichten-builder3 main.site-main,
body:not(.wp-admin) .page-template-page-dichters-profiel .container-studio,
body:not(.wp-admin) .page-template-page-dichters-profiel main.site-main,
body:not(.wp-admin) .author main.site-main,
body:not(.wp-admin) .builder-wrapper,
body:not(.wp-admin) .builder-container {
    width: 100% !important;
    max-width: 1280px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    box-sizing: border-box !important;
}

.container-studio[style*="max-width:1200px"],
.container-studio[style*="max-width: 1200px"] {
    max-width: 1280px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
}

/* 2. Gedichten categorie pagina: 2 kolommen grid */
body.category .vv-home-poems-grid,
body.tax-gedicht_thema .vv-home-poems-grid,
body.archive .vv-home-poems-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 22px !important;
}

/* 3. Afbeelding over de hele bovenkant van de kaart */
body.category .post-card-poetic,
body.tax-gedicht_thema .post-card-poetic,
body.archive .post-card-poetic,
.vv-home-poems-grid .post-card-poetic {
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    padding: 0 !important;
    border-radius: 16px !important;
}

body.category .post-card-poetic .post-card-thumb,
body.tax-gedicht_thema .post-card-poetic .post-card-thumb,
body.archive .post-card-poetic .post-card-thumb,
.vv-home-poems-grid .post-card-poetic .post-card-thumb {
    width: 100% !important;
    height: 230px !important;
    min-height: 230px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-top-left-radius: 16px !important;
    border-top-right-radius: 16px !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    overflow: hidden !important;
    background-color: #EDF4FA !important;
}

body.category .post-card-poetic .post-card-thumb img,
body.tax-gedicht_thema .post-card-poetic .post-card-thumb img,
body.archive .post-card-poetic .post-card-thumb img,
.vv-home-poems-grid .post-card-poetic .post-card-thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

/* 4 & 5. Schaduw op mobiel verwijderen van kaarten op de categoriepagina en single gedichtenpagina */
@media screen and (max-width: 768px) {
    /* Gedichten archief- en categoriekaarten mobiel zonder schaduw */
    body.category .post-card-poetic,
    body.tax-gedicht_thema .post-card-poetic,
    body.archive .post-card-poetic,
    body.category .vv-home-poems-grid .post-card-poetic,
    body.tax-gedicht_thema .vv-home-poems-grid .post-card-poetic {
        box-shadow: none !important;
        -webkit-box-shadow: none !important;
        border: 1px solid #E2E8F0 !important;
    }

    /* Single gedichtenpagina kaarten mobiel zonder schaduw */
    body.single-gebruikers_gedicht .single-poem-card,
    body.single-gebruikers_gedicht .vv-single-poem-card,
    body.single-gebruikers_gedicht .book-preview-card,
    body.single-gebruikers_gedicht .poem-rating-box,
    body.single-gebruikers_gedicht .related-poems-section .post-card-poetic,
    body.single-gebruikers_gedicht .vv-related-home-section .post-card-poetic,
    body.single-gebruikers_gedicht .sidebar-widget-card {
        box-shadow: none !important;
        -webkit-box-shadow: none !important;
        border: 1px solid #E2E8F0 !important;
    }

    /* Categorie grid schakelt op mobiel netjes over naar 1 kolom */
    body.category .vv-home-poems-grid,
    body.tax-gedicht_thema .vv-home-poems-grid,
    body.archive .vv-home-poems-grid {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 16px !important;
    }
}


/* ==========================================================================
   VERS & VORM v2.24: DEFINITIEVE BREEDTES, 2-KOLOMS GRID & GEEN MOBIELE SCHADUW
   ========================================================================== */

/* 1. Contentbreedte exact gelijk aan het menu (1280px) */
body:not(.wp-admin) .site-content,
body:not(.wp-admin) #content {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* De gevraagde pagina's: Bekende dichters, Dichtbundels, Thema's, Studio, Profiel, Dichterspagina */
body:not(.wp-admin) .page-template-page-premium-dichters main.site-main,
body:not(.wp-admin) .page-template-page-dichtbundels-overzicht main.site-main,
body:not(.wp-admin) .page-template-page-themas-overzicht main.site-main,
body:not(.wp-admin) .page-template-page-gedichten-builder3 main.site-main,
body:not(.wp-admin) .page-template-page-dichters-profiel .container-studio,
body:not(.wp-admin) .page-template-page-dichters-profiel main.site-main,
body:not(.wp-admin) .author main.site-main,
body:not(.wp-admin) .author-gedichten main.site-main,
body:not(.wp-admin) .builder-wrapper,
body:not(.wp-admin) .builder-container,
body:not(.wp-admin) .site-main.container-studio,
body:not(.wp-admin) .vv-home-hero-wrap > .container-studio {
    width: 100% !important;
    max-width: 1280px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    box-sizing: border-box !important;
}

.container-studio[style*="max-width:1200px"],
.container-studio[style*="max-width: 1200px"],
.container-studio[style*="max-width:800px"] {
    max-width: 1280px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
}

/* 2. Gedichten categorie pagina: strak 2 kolommen grid */
body.category .vv-home-poems-grid,
body.tax-gedicht_thema .vv-home-poems-grid,
body.archive .vv-home-poems-grid,
.vv-home-poems-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 24px !important;
    width: 100% !important;
}

/* 3. Afbeelding over de hele bovenkant van de kaart */
body.category .post-card-poetic,
body.tax-gedicht_thema .post-card-poetic,
body.archive .post-card-poetic,
.vv-home-poems-grid .post-card-poetic {
    display: flex !important;
    flex-direction: column !important;
    padding: 0 !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    background: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
}

body.category .post-card-poetic .post-card-thumb,
body.tax-gedicht_thema .post-card-poetic .post-card-thumb,
body.archive .post-card-poetic .post-card-thumb,
.vv-home-poems-grid .post-card-poetic .post-card-thumb {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    height: 230px !important;
    min-height: 230px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-top-left-radius: 15px !important;
    border-top-right-radius: 15px !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    overflow: hidden !important;
    background-color: #EDF4FA !important;
}

body.category .post-card-poetic .post-card-thumb a,
body.category .post-card-poetic .post-card-thumb img,
body.tax-gedicht_thema .post-card-poetic .post-card-thumb img,
body.archive .post-card-poetic .post-card-thumb img,
.vv-home-poems-grid .post-card-poetic .post-card-thumb img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

body.category .post-card-poetic .post-card-body,
body.tax-gedicht_thema .post-card-poetic .post-card-body,
body.archive .post-card-poetic .post-card-body,
.vv-home-poems-grid .post-card-poetic .post-card-body {
    padding: 22px !important;
    background: #FFFFFF !important;
}

/* 4 & 5. Schaduwen op mobiel verwijderen (Categorie & Single Gedichten) */
@media screen and (max-width: 768px) {
    /* Categorie & archief kaarten mobiel zonder schaduw */
    body.category .post-card-poetic,
    body.tax-gedicht_thema .post-card-poetic,
    body.archive .post-card-poetic,
    body.category .vv-home-poems-grid .post-card-poetic,
    body.tax-gedicht_thema .vv-home-poems-grid .post-card-poetic,
    .vv-home-poems-grid .post-card-poetic {
        box-shadow: none !important;
        -webkit-box-shadow: none !important;
        border: 1px solid #E2E8F0 !important;
    }

    /* Single gedichtenpagina kaarten mobiel zonder schaduw */
    body.single-gebruikers_gedicht .single-poem-card,
    body.single-gebruikers_gedicht .vv-single-poem-card,
    body.single-gebruikers_gedicht .book-preview-card,
    body.single-gebruikers_gedicht .poem-rating-box,
    body.single-gebruikers_gedicht .related-poems-section .post-card-poetic,
    body.single-gebruikers_gedicht .vv-related-home-section .post-card-poetic,
    body.single-gebruikers_gedicht .sidebar-widget-card,
    body.single-gebruikers_gedicht .single-post-card {
        box-shadow: none !important;
        -webkit-box-shadow: none !important;
        border: 1px solid #E2E8F0 !important;
    }

    /* Categorie grid schakelt op mobiel netjes naar 1 kolom */
    body.category .vv-home-poems-grid,
    body.tax-gedicht_thema .vv-home-poems-grid,
    body.archive .vv-home-poems-grid,
    .vv-home-poems-grid {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 16px !important;
    }
}

/* Canonical layout integration: inherit the theme's site grid, avoid nested widths. */
.site-content .builder-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
    padding-inline: 0 !important;
    box-sizing: border-box !important;
}

@media (max-width: 767px) {
    .site-content .builder-wrapper {
        width: 100% !important;
        max-width: 100% !important;
        padding-inline: 0 !important;
    }
}

/* Shared site alignment: only outer builder shells, preserve internal editor layout. */
.builder-wrapper, .vv-builder-wrapper { width:100%; max-width:1280px; box-sizing:border-box; }
.site-content .builder-wrapper, .site-content .vv-builder-wrapper { width:100%; max-width:100%; margin-inline:0; padding-inline:0; }
@media(max-width:767px){.builder-wrapper,.vv-builder-wrapper{min-width:0;}}

/* Geschreven Gedichten 3.2: warm editorial studio skin, all original controls remain. */
body:not(.wp-admin) :is(.builder-wrapper,.vv-builder-container,.studio-container) :is(.builder-panel,.studio-panel,.editor-card,.vv-builder-card){border-radius:16px;border:1px solid #e9ddcf;background-color:#fffdfa;box-shadow:0 8px 28px rgba(88,62,34,.06)}
body:not(.wp-admin) :is(.builder-wrapper,.vv-builder-container,.studio-container) :is(input,textarea,select){border-radius:10px;border-color:#dfd4c7}

/* 3.3 editorial studio finishing / functional IDs kept intact */
.builder-wrapper,.builder-container{max-width:1280px!important;width:100%!important;box-sizing:border-box!important;margin-inline:auto!important;padding-inline:15px!important}
.builder-container .vv-studio-hero{max-width:100%!important;width:100%!important;background:radial-gradient(ellipse at 86% 30%,#f0c5aa77,transparent 45%),linear-gradient(115deg,#fffaf2,#f2e3d6)!important;border:1px solid #e7d6c6!important;border-radius:22px!important;clip-path:none!important}
.builder-container .vv-studio-hero :is(h1,h2,p,.hero-main-title,.hero-main-desc){color:#302820!important;text-shadow:none!important}
.builder-grid{min-width:0!important;max-width:100%!important}
.builder-grid>*,.builder-container textarea,.builder-container input{box-sizing:border-box!important;max-width:100%}
@media(max-width:760px){.builder-wrapper,.builder-container{padding-inline:15px!important}.builder-grid{grid-template-columns:minmax(0,1fr)!important}.builder-container .vv-studio-hero{border-radius:16px!important}}

/* 3.4 coherent studio workspace, existing controls and handlers unchanged */
.builder-wrapper,.builder-container{box-sizing:border-box!important;width:100%!important;max-width:1280px!important;margin-inline:auto!important}
.builder-container :is(.builder-grid,.builder-tool-panel,.builder-main,.builder-sidebar){min-width:0!important}
.builder-container :is(.builder-panel,.builder-tool-panel,.builder-sidebar){background:#fffefa!important;border:1px solid #e9ded2!important;border-radius:17px!important;box-shadow:0 8px 26px #53371b0c!important}
.builder-container :is(input,textarea,select){box-sizing:border-box!important;max-width:100%!important}
.builder-container :is(input,textarea,select,button):focus-visible{outline:3px solid #ba8a45!important;outline-offset:2px!important}
@media(max-width:740px){.builder-container .builder-grid{grid-template-columns:minmax(0,1fr)!important}}

/* 3.5 accessible editorial studio: no tools or options are suppressed. */
body:not(.wp-admin) .builder-wrapper{width:100%!important;max-width:1280px!important;min-width:0!important;margin-inline:auto!important;box-sizing:border-box!important}
body:not(.wp-admin) .builder-wrapper :is(.builder-header,.builder-panel,.builder-tool-panel,.builder-sidebar){background:#fffdf9!important;border:1px solid #e9ded3!important;border-radius:18px!important;box-shadow:0 10px 30px rgba(77,55,31,.06)!important}
body:not(.wp-admin) .builder-wrapper :is(h1,h2,h3){color:#302820!important}
body:not(.wp-admin) .builder-wrapper :is(input,textarea,select){max-width:100%;box-sizing:border-box}
body:not(.wp-admin) .builder-wrapper :is(button,input,textarea,select):focus-visible{outline:3px solid #a57c3c!important;outline-offset:2px}
@media(max-width:767px){body:not(.wp-admin) .builder-wrapper{padding-inline:0!important}body:not(.wp-admin) .builder-wrapper .builder-header{flex-wrap:wrap;gap:14px;padding:20px!important}}

/* Gastgedicht: alleen de versregels worden vervaagd; titel, knoppen en pagina blijven helder. */
.gg-guest-poem-locked .poem-line,.gg-guest-poem-locked .preview-stanza {filter:blur(7px); user-select:none; pointer-events:none}
.gg-guest-poem-locked #vvRenderTitle,.gg-guest-poem-locked #vvPoemTitle {filter:none}
.gg-guest-reveal-backdrop{position:fixed;inset:0;z-index:2147483000;background:rgba(35,27,31,.44);display:flex;align-items:center;justify-content:center;padding:18px}
.gg-guest-reveal-dialog{background:#fffdf9;max-width:490px;width:100%;border-radius:22px;padding:36px 28px;text-align:center;box-shadow:0 24px 90px rgba(24,12,18,.22);font-family:inherit}
.gg-guest-reveal-eyebrow{font-size:12px;letter-spacing:.16em;color:#aa6070;font-weight:700}
.gg-guest-reveal-dialog h2{font-family:'Cormorant Garamond',serif;font-size:38px;line-height:1.12;margin:15px 0;color:#422f35}
.gg-guest-reveal-dialog p{line-height:1.7;color:#66585d}
.gg-guest-reveal-actions{display:grid;gap:10px;margin:24px 0 12px}
.gg-guest-reveal-actions a{display:block;padding:13px 15px;border-radius:11px;text-decoration:none;font-weight:700}
.gg-guest-reveal-primary{background:#aa6070;color:white!important}
.gg-guest-reveal-secondary{background:#f4ebeb;color:#743d4b!important}
.gg-guest-reveal-later{border:0;background:transparent;color:#725962;text-decoration:underline;cursor:pointer;padding:12px;font:inherit;font-size:13px}

.gg-guest-folder{max-width:1280px;margin:26px auto;padding:20px;border:1px solid #eadbdd;border-radius:17px;background:#fffdfa}
.gg-guest-folder h3{font-family:'Cormorant Garamond',serif;font-size:29px;margin:0 0 12px;color:#543940}
.gg-guest-folder-item{padding:14px;background:#f8f1f1;border-radius:11px;margin:9px 0;color:#543940}
.gg-guest-folder-item summary{cursor:pointer;font-weight:700}
.gg-guest-folder-text{white-space:pre-wrap;line-height:1.8;padding:15px 0}
.gg-guest-folder-item a{color:#934f60;font-weight:700}

/* Gastgedicht-popup: papierstijl, gelijk aan de GG popup-card vormgeving. */
#ggGuestRevealModal.gg-popup-layer{position:fixed;inset:0;z-index:2147483000;background:rgba(35,27,31,.44);display:flex;justify-content:center;align-items:center;padding:18px;box-sizing:border-box;overflow-y:auto}
#ggGuestRevealModal .gg-popup-card{position:relative;box-sizing:border-box;width:100%;max-width:var(--popup-width,420px);border-radius:var(--popup-radius,24px);padding:35px 34px 27px;background:#fffdf9;box-shadow:0 24px 70px rgba(45,23,29,.20);text-align:left;color:#49373b;max-height:calc(100dvh - 36px);overflow-y:auto}
#ggGuestRevealModal .gg-popup-close{position:absolute;top:14px;right:16px;width:34px;height:34px;padding:0;border:0;background:transparent;color:#755e63;font:normal 28px/1 Arial,sans-serif;cursor:pointer}
#ggGuestRevealModal .gg-popup-symbol{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;background:#f8eced;color:#aa6070;margin-bottom:17px}
#ggGuestRevealModal .gg-popup-symbol svg{width:26px;height:26px}
#ggGuestRevealModal .gg-popup-kicker{display:block;font-size:11px;font-weight:800;letter-spacing:.15em;color:#aa6070;margin-bottom:10px}
#ggGuestRevealModal .gg-popup-card h2{font-family:'Cormorant Garamond',Georgia,serif;font-size:var(--popup-title,34px);font-weight:600;line-height:1.12;color:#422f35;margin:0 0 17px;letter-spacing:normal}
#ggGuestRevealModal .gg-popup-rule{width:55px;height:2px;background:#c58d93;margin:0 0 18px}
#ggGuestRevealModal .gg-popup-body{font-size:15px;line-height:1.8;color:#68595d;white-space:pre-line;margin:0 0 23px}
#ggGuestRevealModal .gg-popup-actions{display:grid;gap:10px;margin:0 0 10px}
#ggGuestRevealModal .gg-popup-actions a{display:block;text-align:center;text-decoration:none;border-radius:12px;padding:13px 16px;font-size:14px;font-weight:700;line-height:1.4;cursor:pointer}
#ggGuestRevealModal .gg-popup-primary{background:#aa6070;color:#fff!important}
#ggGuestRevealModal .gg-popup-secondary{background:#f5ebeb;color:#743d4b!important}
#ggGuestRevealModal .gg-guest-reveal-later{display:block;width:100%;border:0;background:transparent;color:#725962;text-decoration:underline;cursor:pointer;padding:12px 3px;font-size:13px;font-family:inherit}
@media(max-width:480px){#ggGuestRevealModal .gg-popup-card{padding:28px 23px 19px}#ggGuestRevealModal .gg-popup-card h2{font-size:31px}}

/* Gastgedichten: rustige, niet-klikbare voetnoot onder de popupknoppen */
.gg-guest-reveal-dialog .gg-guest-reveal-later{display:block;text-align:center;margin:15px 0 0;padding:0;border:0;background:transparent;text-decoration:none;cursor:default;font-size:13px;color:#725962;line-height:1.5}

/* Gastgedichten: uitsluitend als rustige profielkaarten, nooit onder de Studio. */
.gg-profile-guest-folder{margin:24px 0 32px;max-width:none;width:100%;padding:clamp(18px,3vw,30px);border-radius:20px;background:#fffdfa;border:1px solid #ebdfe0;box-sizing:border-box;box-shadow:0 10px 28px rgba(75,49,53,.04)}
.gg-guest-folder-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:19px;flex-wrap:wrap}
.gg-guest-folder-head h3{margin:5px 0 6px;font-size:clamp(26px,3vw,34px);line-height:1.15}
.gg-guest-folder-head p{margin:0;color:#7b666a}
.gg-guest-folder-kicker{letter-spacing:.1em;font-size:11px;font-weight:700;color:#aa6070}
.gg-guest-folder-count{font-size:13px;border-radius:999px;padding:8px 12px;background:#f6e9eb;color:#884d5b;white-space:nowrap}
.gg-guest-folder-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.gg-profile-guest-folder .gg-guest-folder-item{margin:0;min-width:0;background:#faf4f3;border:1px solid #efdee1;border-radius:14px;padding:0;overflow:hidden}
.gg-profile-guest-folder summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px;list-style:none;cursor:pointer}
.gg-profile-guest-folder summary::-webkit-details-marker{display:none}
.gg-profile-guest-folder summary strong,.gg-profile-guest-folder summary small{display:block}
.gg-profile-guest-folder summary small{font-size:12px;color:#947b7e;margin-top:5px}
.gg-guest-folder-open{color:#a35b6c;font-size:12px;white-space:nowrap}
.gg-profile-guest-folder .gg-guest-folder-text{white-space:pre-line;background:#fffdfa;padding:22px;line-height:1.9;color:#4f3d40;border-top:1px solid #efdee1}
@media(max-width:760px){.gg-guest-folder-grid{grid-template-columns:1fr}.gg-profile-guest-folder{margin:18px 0;padding:17px}.gg-profile-guest-folder summary{padding:15px}}