/*
Theme Name:     Blomig Child
Theme URI:      https://blomig.com
Description:    Child theme minimaliste – JetBrains Mono, B&W strict + header centré
Author:         Toi + Grok
Template:       generatepress
Version:        2.0
*/

@import url("https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&display=swap");

/* ====================== DESIGN SYSTEM ====================== */
:root {
    --color-bg:            #ffffff;
    --color-text:          #111111;
    --color-border:        #eeeeee;
    --color-muted:         #666666;

    /* Exergues & citations */
    --color-exergue-bg:    #E0E0E0;
    --color-exergue-text:  #333333;
    --color-exergue-border:#555555;

    /* Typographie */
    --font-mono:           "JetBrains Mono", monospace;
    --font-size-base:      17px;
    --line-height:         1.65;
}

/* ====================== BASE + COLONNE CENTRÉE ====================== */
body {
    font-family: var(--font-mono);
    font-size: var(--font-size-base);
    line-height: var(--line-height);
    color: var(--color-text);
    background: var(--color-bg);
}

/* Contenu articles + pages (colonne étroite centrée) */
.site-main,
.content-area,
.inside-article,
.entry-content,
.page .entry-content {
    max-width: 740px;
    margin-left: auto;
    margin-right: auto;
    padding: 0 20px;
    box-sizing: border-box;
}

/* ====================== HEADER CENTRÉ (même largeur que le contenu) ====================== */
.site-header .inside-header {
    max-width: 740px;
    margin-left: auto;
    margin-right: auto;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.site-header {
    border-bottom: 1px solid var(--color-border);
    padding: 40px 0 32px;
}

/* Logo */
.site-logo img,
.custom-logo {
    max-height: 48px !important;
    width: auto !important;
}

.site-title {
    font-size: 2.2rem;
    font-weight: 600;
    letter-spacing: -1px;
    margin: 0;
}

.site-description {
    font-size: 1rem;
    color: var(--color-muted);
    margin: 0;
}

/* Menu */
.main-navigation .menu {
    display: flex;
    gap: 32px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.main-navigation a {
    color: var(--color-text);
    text-decoration: none;
    font-weight: 500;
}

/* ====================== LIENS ====================== */
a {
    color: var(--color-text) !important;
    text-decoration: underline dotted var(--color-muted);
    text-underline-offset: 4px;
    text-decoration-thickness: 1px;
    transition: text-decoration 0.2s ease;
}

a:hover {
    text-decoration: underline solid var(--color-text);
    text-decoration-thickness: 2px;
}

/* ====================== COMPOSANTS LEGACY ====================== */

/* Chapeau */
.chapeau {
    font-weight: 600;
    font-size: 1.18em;
    margin-bottom: 2rem;
    color: var(--color-text);
}

/* Exergues latérales (200 px) */
span.exergue_droite,
span.exergue_gauche {
    display: block !important;
    box-sizing: border-box !important;
    width: 200px !important;
    max-width: 200px !important;
    padding: 18px !important;
    margin: 20px 15px 15px 20px !important;
    background: var(--color-exergue-bg) !important;
    border: 1px dotted var(--color-exergue-border) !important;
    color: var(--color-exergue-text) !important;
    text-align: center !important;
    line-height: 1.45 !important;
    font-size: 1.05em !important;
}

span.exergue_gauche { float: left !important; margin: 20px 20px 15px 15px !important; }
span.exergue_droite { float: right !important; margin: 20px 15px 15px 20px !important; }

/* Blocklong */
span.blocklong,
.blocklong {
    float: none !important;
    width: auto !important;
    max-width: none !important;
    margin: 25px 30px 10px 15px !important;
    padding: 18px 20px !important;
    text-align: left !important;
    border-left: 2px solid var(--color-exergue-border) !important;
    background: var(--color-exergue-bg) !important;
    color: var(--color-exergue-text) !important;
}

/* Style unifié citations / blockquote simples */
.ds-citation,
.citation,
blockquote {
    background: var(--color-exergue-bg);
    color: var(--color-exergue-text);
    border: 1px solid var(--color-exergue-border);
    padding: 24px 28px;
    margin: 2.2rem 0;
    border-radius: 4px;
    font-size: var(--font-size-base) !important;
    font-style: normal !important;
}

/* ====================== TESTIMONIAL-QUOTE (v1.9 – photo DANS le bloc gris) ====================== */
.testimonial-quote {
    background: var(--color-exergue-bg);
    border: 1px solid var(--color-exergue-border);
    border-radius: 4px;
    padding: 24px 28px;
    margin: 2.5rem 0;
    overflow: hidden;
    clear: both;
}

.testimonial-quote img {
    float: left;
    width: 90px !important;
    height: 90px !important;
    border: 2px solid #c0b6aa;
    border-radius: 50%;
    margin: 0 25px 15px 0;
    object-fit: cover;
}

.testimonial-quote .quote-container {
    margin-left: 120px;
    padding: 0;
    background: none;
    border: none;
}

.testimonial-quote .quote-container blockquote {
    margin: 0 0 15px 0;
    padding: 0;
    border: none;
    background: none;
    font-size: var(--font-size-base) !important;
    font-style: normal !important;
    color: var(--color-exergue-text);
}

.testimonial-quote .quote-container cite {
    display: block;
    text-align: right;
    color: #555;
    font-size: 0.95em;
    margin-top: 12px;
    font-style: normal !important;
}

.testimonial-quote .quote-container cite span {
    color: #F19D39;
    font-weight: 700;
    text-transform: uppercase;
}

/* Notes en marge */
.textmarge {
    color: #555555;
    font-size: 0.95em;
    line-height: 1.5;
    margin: 1.5em 0;
}

/* Nettoyage floats */
.exergue_droite + *,
.exergue_gauche + *,
.blocklong + *,
.testimonial-quote + * {
    clear: both !important;
}

/* Titres */
.entry-title,
h1, h2, h3 {
    font-family: var(--font-mono);
    font-weight: 600;
    line-height: 1.3;
}

h2 {
    margin-top: 2.8rem;
    margin-bottom: 1.4rem;
}

.entry-content p,
.entry-content li {
    margin-bottom: 1.4em;
}