/* ============================================================
   Kadence Sentin Child — Page produit (single-product)

   Stratégie : RÉUTILISER les classes de landing4.css partout où c'est
   possible (.featured, .featured-layout, .featured-eyebrow, .featured-
   title, .featured-author, .featured-pitch, .featured-price, .featured-
   actions, .book-cover, .btn .btn-primary, .btn-ghost, .auteur-banner)
   pour garantir l'identité visuelle entre la home et la fiche produit.

   Ce fichier ne porte que les ajouts spécifiques produit :
     1. Full-bleed des sections (neutralise les wrappers Kadence/WC)
     2. Décalage du contenu sous le header fixe
     3. Fil d'Ariane (breadcrumb)
     4. Description longue : corps en Montserrat (incl. italiques)
     5. Fiche technique
     6. Cross-sell
   ============================================================ */

/* ============================================================
   1. FULL-BLEED — sections fond uni edge-to-edge
   ============================================================ */
body.single-product main#main,
body.single-product main#main > article.eds-product,
body.single-product .content-area,
body.single-product .content-container,
body.single-product .site-container,
body.single-product .entry-content,
body.single-product .product-content-wrap,
body.single-product .product.type-product {
    max-width: none !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* Compense le header fixe (80px) */
body.single-product main#main { padding-top: 80px !important; }

/* Masque les éléments WC orphelins (galerie, summary, tabs, related…) */
body.single-product .product .summary,
body.single-product .product .single_add_to_cart_button,
body.single-product .woocommerce-product-gallery,
body.single-product .woocommerce-tabs,
body.single-product .related.products,
body.single-product .upsells.products,
body.single-product .product > .price,
body.single-product .product > .product_title {
    display: none !important;
}

/* ============================================================
   2. SCOPE — neutralisations légères
   ============================================================ */
.eds-product, .eds-product * { box-sizing: border-box; }
.eds-product picture, .eds-product svg { display: block; max-width: 100%; }
/* NB : on NE règle PAS .eds-product img { height: auto } — ça
   écraserait .auteur-banner-photo img { height: 100% } de
   landing4.css à spécificité égale (load order produit.css plus
   tard fait gagner cette règle), réduisant la photo à 0px. */
.eds-product a { text-decoration: none; touch-action: manipulation; }
.eds-product ul { list-style: none; padding: 0; margin: 0; }
.eds-product p { margin: 0; text-wrap: pretty; }

/* ============================================================
   3. HERO PRODUIT
   On enveloppe la section .featured (landing4.css fait tout le
   visuel : layout, ombres, eyebrow, title, author, pitch, price,
   actions). Ici on ajoute juste padding-bottom et le breadcrumb.
   ============================================================ */
.eds-product .featured {
    padding-bottom: clamp(3rem, 6vw, 5rem);
}
/* En page produit, le titre est un h1 (au lieu de h2 sur la home) :
   on rétablit la même taille que .featured-title */
.eds-product h1.featured-title {
    font-family: var(--ff-serif);
    font-size: clamp(24px, 3.5vw, 36px);
    font-weight: 600;
    line-height: 1;
    color: var(--ink);
    margin: 10px 0 4px;
    padding-bottom: 10px;
}

/* Fil d'Ariane */
.eds-prod-breadcrumb {
    font-family: var(--ff-caps);
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--text-mute, #9b8b75);
    margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
    display: flex;
    align-items: center;
    gap: 0.6em;
    flex-wrap: wrap;
}
.eds-prod-breadcrumb a { color: var(--text-soft, #7a6a55); transition: color .2s; }
.eds-prod-breadcrumb a:hover { color: var(--gold, #b8924a); }
.eds-prod-breadcrumb .eds-sep { color: var(--gold-dim, rgba(184,146,74,.45)); font-size: 10px; }
.eds-prod-breadcrumb .eds-current { color: var(--ink, #2a1a08); font-weight: 600; }

/* ============================================================
   4. DESCRIPTION LONGUE — corps en Montserrat (italiques compris)
   ============================================================ */
.eds-prod-desc {
    background: var(--cream, #f3efe6);
    padding-block: clamp(3rem, 6vw, 5rem);
}
.eds-prod-desc-inner {
    max-width: 1080px;
    margin-inline: auto;
    padding-inline: clamp(1rem, 4vw, 2rem);
}
/* Titre "Le livre" — Cormorant italic doré, contraste avec le corps sans-serif */
.eds-prod-desc-label {
    font-family: var(--ff-serif);
    font-style: italic;
    font-size: clamp(26px, 3vw, 32px);
    font-weight: 500;
    color: var(--gold, #b8924a);
    margin-bottom: 0.8em;
    display: flex;
    align-items: center;
    gap: 0.8em;
    letter-spacing: 0;
    text-transform: none;
}
.eds-prod-desc-label::after {
    content: "";
    flex: 1;
    height: 1px;
    background: linear-gradient(to right, var(--gold-dim, rgba(184,146,74,.45)), transparent);
}
/* Corps Montserrat */
.eds-prod-desc-body {
    font-family: var(--ff-caps);
    font-size: clamp(14px, 1.6vw, 16px);
    font-weight: 400;
    line-height: 1.75;
    color: var(--text, #5b5046);
}
.eds-prod-desc-body p + p { margin-top: 1em; }
/* Italiques aussi en Montserrat, MÊME font-weight que le corps. */
.eds-prod-desc-body em,
.eds-prod-desc-body i,
.eds-prod-desc-body cite {
    font-family: var(--ff-caps) !important;
    font-style: italic;
    font-weight: inherit;
}

/* Pullquote dans la description */
.eds-prod-desc-body blockquote {
    position: relative;
    font-family: var(--ff-caps);
    font-size: clamp(17px, 2.2vw, 21px);
    font-style: italic;
    line-height: 1.55;
    color: var(--ink, #2a1a08);
    padding: 1.5em 1.5em 1.5em 2em;
    margin-block: 2em;
    background: var(--cream-page, #fff9ef);
    border-radius: 6px;
    border-left: 3px solid var(--gold, #b8924a);
    font-weight: 500;
}
.eds-prod-desc-body blockquote::before {
    content: "\201C";
    position: absolute;
    top: -0.15em;
    left: 0.3em;
    font-size: 4em;
    line-height: 1;
    color: var(--gold, #b8924a);
    font-family: var(--ff-serif);
    opacity: 0.4;
}

/* ============================================================
   5. FICHE TECHNIQUE
   ============================================================ */
.eds-prod-specs {
    background: var(--cream-page, #fff9ef);
    padding-block: clamp(2rem, 4vw, 3.5rem);
    border-top: 1px solid rgba(184,146,74,0.2);
    border-bottom: 1px solid rgba(184,146,74,0.2);
}
.eds-prod-specs-inner {
    max-width: 1080px;
    margin-inline: auto;
    padding-inline: clamp(1rem, 4vw, 2rem);
}
.eds-prod-specs-label {
    font-family: var(--ff-serif);
    font-style: italic;
    font-size: clamp(26px, 3vw, 32px);
    font-weight: 500;
    color: var(--gold, #b8924a);
    margin-bottom: 0.8em;
    display: flex;
    align-items: center;
    gap: 0.8em;
}
.eds-prod-specs-label::after {
    content: "";
    flex: 1;
    height: 1px;
    background: linear-gradient(to right, var(--gold-dim, rgba(184,146,74,.45)), transparent);
}
.eds-prod-specs-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 1px;
    background: rgba(184,146,74,0.2);
    border: 1px solid rgba(184,146,74,0.2);
    border-radius: 6px;
    overflow: hidden;
}
.eds-prod-spec { background: var(--cream-page, #fff9ef); padding: 0.9em 1.1em; }
.eds-prod-spec-key {
    font-family: var(--ff-caps);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--text-mute, #9b8b75);
    margin-bottom: 0.2em;
}
.eds-prod-spec-val {
    font-family: var(--ff-serif);
    font-size: clamp(16px, 1.8vw, 19px);
    color: var(--ink, #2a1a08);
    font-weight: 500;
    font-variant-numeric: tabular-nums;
}

/* ============================================================
   6. SECTION AUTEUR — réutilise .auteur-banner + .authors-header
   de landing4.css. Padding généreux : on aère franchement.
   ============================================================ */
.eds-prod-author-section {
    padding-block: clamp(5rem, 10vw, 8rem);
}
.eds-prod-author-section .authors-header {
    margin-bottom: clamp(3rem, 6vw, 4.5rem);
}
/* Sur la fiche produit on n'a qu'UN auteur : la grille à 2 colonnes
   héritée du landing produit un blanc à droite désagréable, on
   passe en colonne unique centrée. */
.eds-prod-author-section .auteurs-grid--vE {
    max-width: 880px;
    margin-inline: auto;
}
.eds-prod-author-section .auteur-banner {
    padding-block: clamp(2rem, 4vw, 3rem) clamp(3rem, 6vw, 4.5rem);
    gap: clamp(2.5rem, 5vw, 4rem);
}
/* Forçage explicite des dimensions de la photo auteur :
   - bumpe la spécificité au-dessus de `.woocommerce img`
   - utilise des valeurs absolues plutôt que `height: 100%` qui
     dépend de la résolution du parent et donne 0px en lazy load. */
.eds-prod-author-section .auteur-banner-photo img {
    width: 250px;
    height: 250px;
    object-fit: cover;
    object-position: top center;
    display: block;
    max-width: none;
}
@media (max-width: 600px) {
    .eds-prod-author-section .auteur-banner-photo,
    .eds-prod-author-section .auteur-banner-photo img {
        width: 200px;
        height: 200px;
    }
}

/* ============================================================
   7. CROSS-SELL — "Du même auteur"
   Réutilise les classes .book-card / .book-cover / .book-stage /
   .curl / .book-eyebrow / .book-title / .book-author / .book-extrait
   / .book-price / .book-cta de landing4.css : hover (curl + EN LIRE
   PLUS), ombres, badge eyebrow avec background → tout est calé sur
   le rendu de la home.
   ============================================================ */
.eds-prod-cross {
    background: var(--cream-page, #fff9ef);
    padding-block: clamp(3rem, 6vw, 5rem);
    border-top: 1px solid rgba(184,146,74,0.2);
}
.eds-prod-cross-header {
    text-align: center;
    margin-bottom: clamp(2.5rem, 5vw, 3.5rem);
    padding-inline: clamp(1rem, 4vw, 2rem);
}
.eds-prod-cross-title {
    font-family: var(--ff-serif);
    font-size: clamp(24px, 3vw, 32px);
    font-weight: 500;
    color: var(--ink, #2a1a08);
    margin: 0;
}
.eds-prod-cross-title em { color: var(--gold, #b8924a); font-style: italic; }

.eds-cross-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(2rem, 4vw, 3rem);
    max-width: 1080px;
    margin-inline: auto;
    padding-inline: clamp(1rem, 4vw, 2rem);
}
@media (max-width: 720px) {
    .eds-cross-grid { grid-template-columns: 1fr; max-width: 320px; }
}

/* Override .book-card : sur la page produit, layout vertical
   (cover en haut, texte en bas), centré. */
.eds-cross-grid .book-card {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    text-align: center;
    grid-template-columns: none !important;
}
.eds-cross-grid .book-card .book-cover {
    width: 220px;
    max-width: 100%;
    margin-bottom: 1.25rem;
}
.eds-cross-grid .book-card-text {
    align-items: center;
    width: 100%;
    max-width: 280px;
}
.eds-cross-grid .book-card-text .book-extrait {
    border-left: none;
    padding-left: 0;
    text-align: center;
    border-top: 1px solid rgba(184,146,74,0.4);
    border-bottom: 1px solid rgba(184,146,74,0.4);
    padding-block: 0.75em;
    margin-block: 0.5em 0.75em;
    max-width: 280px;
}
/* Pas d'effet hover sur les éléments texte (titre, auteur, etc.) */
.eds-cross-grid .book-card .book-title,
.eds-cross-grid .book-card .book-title a,
.eds-cross-grid .book-card .book-extrait,
.eds-cross-grid .book-card .book-author,
.eds-cross-grid .book-card .book-eyebrow,
.eds-cross-grid .book-card .book-price {
    transition: none;
}
.eds-cross-grid .book-card .book-title a:hover { color: inherit; }

/* Bouton CTA du cross-sell : centré dans la carte verticale */
.eds-cross-grid .book-card .book-cta {
    align-self: center;
    margin-top: auto;
}

/* ============================================================
   8. HERO PRODUIT — marges typographiques (override reset WC/Kadence)
   WC + Kadence aplatissent les paragraphes dans la fiche produit
   (`p { margin: 0 }`). On restaure les marges utilisées par la landing.
   ============================================================ */
.eds-prod-hero .featured-eyebrow {
    margin-top: 0 !important;
    margin-bottom: 8px !important;
}
.eds-prod-hero .featured-title {
    margin: 10px 0 4px !important;
    padding-bottom: 10px !important;
}
.eds-prod-hero .featured-author {
    margin-top: 0 !important;
    margin-bottom: 10px !important;
    padding-bottom: 1em !important;
}
.eds-prod-hero .featured-pitch {
    margin-bottom: 1em !important;
    padding-bottom: 0 !important;
}
.eds-prod-hero .featured-pitch p {
    margin: 0 !important;
    padding: 0 !important;
}
.eds-prod-hero .featured-price {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}
.eds-prod-hero .featured-actions {
    margin-top: 25.7px !important;
    display: flex;
    align-items: center;
    gap: clamp(0.75rem, 1.5vw, 1.25rem);
    flex-wrap: wrap;
}

/* ============================================================
   9. COMPTEUR DE QUANTITÉ (hero produit)
   Architecture : chaque cellule porte sa propre border, sa bg, son
   radius — le hover gold-fill couvre les coins arrondis sans gap.
   ============================================================ */
.eds-qty-selector {
    display: inline-flex;
    align-items: stretch;
    height: 44px;
    user-select: none;
    background: transparent;
}
.eds-qty-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 100%;
    background: #fff9ef;
    border: 1.6px solid #b8924a;
    padding: 0;
    margin: 0;
    color: #8B3A2A;
    font-family: 'Montserrat', Karla, ui-sans-serif, system-ui, sans-serif;
    font-size: 18px;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    outline: none;
    opacity: 1;
    box-sizing: border-box;
    transition: background-color .3s ease-in-out, color .3s ease-in-out;
}
.eds-qty-minus { border-right: 0; border-radius: 6px 0 0 6px; }
.eds-qty-plus  { border-left:  0; border-radius: 0 6px 6px 0; }
.eds-qty-btn:focus:not(:hover):not(:disabled),
.eds-qty-btn:focus-visible:not(:hover):not(:disabled),
.eds-qty-btn:active:not(:hover):not(:disabled) {
    background: #fff9ef !important;
    color: #8B3A2A !important;
    outline: none !important;
    box-shadow: none !important;
}
.eds-qty-btn:hover:not(:disabled) {
    background: #b8924a;
    color: #fff9ef;
}
.eds-qty-btn:disabled {
    color: rgba(139,58,42,.28) !important;
    cursor: not-allowed;
    background: #fff9ef !important;
    border-color: #b8924a !important;
    opacity: 1 !important;
}
.eds-qty-value {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    height: 100%;
    padding: 0 4px;
    font-family: 'Montserrat', Karla, ui-sans-serif, system-ui, sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    color: #2a1a08;
    font-variant-numeric: tabular-nums;
    background: #fff9ef;
    border-top: 1.6px solid #b8924a;
    border-bottom: 1.6px solid #b8924a;
    border-left: 0;
    border-right: 0;
    box-sizing: border-box;
}
.eds-qty-value::before,
.eds-qty-value::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 1.6px;
    background: rgba(184,146,74,.5);
    pointer-events: none;
    transition: background-color .3s ease-in-out;
}
.eds-qty-value::before { left: 0; }
.eds-qty-value::after  { right: 0; }
.eds-qty-selector:has(.eds-qty-minus:hover) .eds-qty-value::before {
    background: #b8924a;
}
.eds-qty-selector:has(.eds-qty-plus:hover) .eds-qty-value::after {
    background: #b8924a;
}

/* ============================================================
   10. RÉDUCTION DES MOUVEMENTS
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
    .eds-product *,
    .eds-product *::before,
    .eds-product *::after,
    .eds-cross-cover-wrap,
    .eds-cross-cover-wrap .book-cover {
        transition-duration: .01ms !important;
        animation-duration:  .01ms !important;
    }
}
