/* ================================================================
   ESSAI DE REFONTE — VERSION MINIMALE (20/10/2026, dev uniquement)

   Hypersanté a jugé que le site « reprend les codes d'un site généré par une
   IA ». On corrige les points cités, et rien d'autre : fonds, couleurs,
   polices (Cormorant gardée, décision de Samuel le 20/10), mise en page et
   icônes restent comme sur le site en ligne.

   1. « Les sur-titres au-dessus des sections » → supprimés, ainsi que la
      pastille « Patrimoine UNESCO » (même procédé).
   2. « Les encadrés arrondis » → arrondis ramenés à 4 px.
   3. Les trois badges flottants autour de la boîte → une seule ligne fixe
      sous la boîte (prix · 60 gélules · 1 mois), voir template-home.php.
   4. L'illustration d'olives dessinée → vraie photo (template-home.php).

   Ce fichier se charge APRÈS les autres : le retirer (et rétablir les deux
   blocs de template-home.php) rend exactement le site d'avant.
================================================================ */

/* ---------- 1. SUR-TITRES ET PASTILLE : SUPPRIMÉS ---------- */

.section-label,
.hero-badge {
    display: none !important;
}

/* ---------- 2. ARRONDIS RAMENÉS À 4 PX ---------- */

[class*="card"],
[class*="box"],
[class*="btn"],
.btn-primary, .btn-secondary, .nav-cta, .btn-order,
.modal-content, .modal-submit,
.trust-item, .spec-item, .product-detail,
.faq-item, .study-card, .study-key-results,
.product-price-inline,
.product-image-container,
.form-group input, .form-group select,
input[type="text"], input[type="email"], input[type="number"], textarea, select {
    border-radius: 4px !important;
}

.cardiocret-buy-float {
    border-radius: 4px;
}
@media (max-width: 768px) {
    .cardiocret-buy-float {
        border-radius: 4px 0 0 4px;
    }
}

/* ---------- 3. UN SEUL BADGE, FIXE, SOUS LA BOÎTE ---------- */

.product-facts {
    display: inline-flex;
    align-items: baseline;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.5rem;
    margin: 1.25rem auto 0;
    padding: 0.6rem 1.1rem;
    background: #fff;
    border: 1px solid rgba(92, 107, 74, 0.2);
    border-radius: 4px;
    font-size: 0.95rem;
    color: var(--text-medium, #555);
}
.product-facts-price {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--bordeaux, #8B1139);
}
.product-facts-sep {
    color: rgba(92, 107, 74, 0.5);
}

/* ---------- 3 bis. TOUS LES TITRES EN SOURCE SERIF ----------
   Essai du 20/10 (Samuel) après Montserrat puis Helvetica : on garde une
   police à empattements comme avant, mais Source Serif (style revue
   scientifique) au lieu de Cormorant, très répandue sur les sites faits par IA.
   Reste en Cormorant : le logo seulement.
   Titre d'une seule couleur : l'effet « moitié en bordeaux » est très typique
   des sites faits par IA. */

h1, h2, h3, h4,
.hero h1,
.section-title,
.study-title,
.product-info h3,
.product-details-content h3,
.origin-content h3,
.composition-box h4,
.pro-cta h2,
.modal-header h2,
.side-cart-header h3,
.side-cart-item-name,
.contact-hero-title,
.contact-form-wrap h2,
.contact-form-wrap .form-success h4,
.contact-info-block h3,
.woocommerce-page h1, .woocommerce-page h2,
body.single-product .product-short-desc h3,
.woocommerce-tabs-wrap .woocommerce-tabs .panel h2,
.woocommerce-tabs-wrap .woocommerce-tabs .panel h3,
.cardiocret-cart-item .cart-item-name,
.cardiocret-cart-totals h2 {
    font-family: 'Source Serif 4', Georgia, serif;
    font-weight: 500;
    font-style: normal;
    letter-spacing: -0.01em;
}
/* Tailles ramenées pour garder la même mise en page qu'avec Cormorant. */
.hero h1 {
    font-size: clamp(2rem, 3.6vw, 3rem);
    line-height: 1.15;
}
.section-title {
    font-size: clamp(1.6rem, 2.6vw, 2.1rem);
    line-height: 1.2;
}

/* Mobile : les deux boutons du haut se tassaient sur trois lignes. */
@media (max-width: 768px) {
    .hero-cta-group {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
    }
    .hero-cta-group .btn-primary,
    .hero-cta-group .btn-secondary {
        justify-content: center;
        white-space: nowrap;
    }
}
.hero h1 span {
    color: inherit;
}

/* Slogan et prix aussi en Source Serif (Samuel, 20/10). */
.product-slogan,
.product-facts-price,
.price-value,
.price-inline-value,
.side-cart-total strong,
.woocommerce ul.products li.product .price,
.cardiocret-cart-item .cart-item-subtotal,
.cart-totals-row.order-total .label,
.cart-totals-row.order-total .value strong {
    font-family: 'Source Serif 4', Georgia, serif;
    font-style: normal;
}
.product-slogan {
    font-weight: 500;
}
/* Citation UNESCO : Source Serif, mais en italique comme avant. */
.unesco-quote blockquote {
    font-family: 'Source Serif 4', Georgia, serif;
    font-style: italic;
    font-weight: 400;
}

/* ---------- 3 ter. FAQ : CHAQUE QUESTION S'OUVRE SANS ÉTIRER SA VOISINE ----------
   La grille étirait toutes les cases d'une ligne à la hauteur de la plus
   haute : ouvrir une question à gauche créait un grand vide dans la case de
   droite (Samuel, 20/10). */
.faq-grid {
    align-items: start;
}

/* ---------- 4. PHOTO D'OLIVES ---------- */

/* Photo Wikimedia Commons, CC BY-SA 4.0 : le crédit doit rester affiché. */
.origin-photo {
    max-width: 480px;
    margin: 0 auto;
}
.origin-photo img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: 4px;
}
.origin-photo figcaption {
    margin-top: 0.5rem;
    font-size: 0.8rem;
    line-height: 1.4;
    color: var(--text-medium, #666);
}
.origin-photo figcaption a {
    color: inherit;
    text-decoration: underline;
}

/* ---------- 5. COULEURS DE LA BOÎTE CRÉTIOL (21/10/2026) ----------
   Hypersanté : « les couleurs devenues d'usage très commun ». On quitte la
   palette crème / bordeaux / olive pour celle de l'étiquette : fond blanc,
   rouge Crétiol (#C4103C), gris olive (#80846C). Plus de dégradés : des
   aplats (couleurs unies), comme sur la boîte. */

:root {
    --bordeaux: #C4103C;
    --bordeaux-dark: #A00D31;
    --olive: #80846C;
    --olive-light: #9A9D88;
    --cream: #FFFFFF;
    --warm-white: #FFFFFF;
}

body {
    background-color: #FFFFFF;
}
nav {
    background: rgba(255, 255, 255, 0.97) !important;
}

.hero {
    background: #FFFFFF !important;
}
.hero::before,
.product-image-container::before {
    display: none !important;
}
.unesco-quote {
    background: var(--olive) !important;
}
.product-price-inline,
.pro-cta {
    background: var(--bordeaux) !important;
}
.product-order {
    background: #FFFFFF !important;
}

/* Sur fond blanc, les cartes qui étaient crème sur blanc ont besoin d'un
   filet pour rester lisibles. */
.study-card,
.faq-item,
.composition-box {
    background: #FFFFFF;
    border: 1px solid rgba(128, 132, 108, 0.35);
}
.product-detail {
    background: transparent;
    border: 0;
}

/* ---------- 6. SOURCE DES ÉTUDES ET « RÉSULTATS CLÉS » ----------
   Plus de petites majuscules espacées au-dessus des blocs (sur-titres) :
   la source passe sous le titre (template-home.php), en écriture normale. */

.study-source {
    text-transform: none;
    letter-spacing: 0;
    font-weight: 400;
    font-size: 0.95rem;
    color: var(--text-medium);
    margin: -0.25rem 0 1rem;
}
.study-key-results-title {
    text-transform: none;
    letter-spacing: 0;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--text-dark);
}

/* ---------- 7. AVERTISSEMENT DU PIED DE PAGE : 4 PX ---------- */

.disclaimer {
    border-radius: 4px;
}

/* ---------- 8. LE FONDATEUR (21/10/2026) ----------
   Vraie photo de Robert : la preuve qu'il y a une personne derrière la marque.
   Encadré centré au fond olive (comme la citation UNESCO), photo réduite
   (Samuel, 21/10). */

.fondateur {
    padding: 4rem 2rem;
    background: #FFFFFF;
}
.fondateur-grid {
    display: grid;
    grid-template-columns: 170px 1fr;
    gap: 2.75rem;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
    padding: 2.5rem 3rem;
    background: var(--olive);
    border-radius: 4px;
}
.fondateur-photo {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 4px;
}
.fondateur-texte .section-title {
    text-align: left;
    color: #FFFFFF;
    font-size: clamp(1.4rem, 2.2vw, 1.75rem);
    margin-bottom: 0.75rem;
}
.fondateur-texte p {
    color: rgba(255, 255, 255, 0.92);
    line-height: 1.65;
    margin: 0 0 0.75rem;
}
.fondateur-texte p:last-child {
    margin-bottom: 0;
}
@media (max-width: 768px) {
    .fondateur {
        padding: 3rem 2rem;
    }
    .fondateur-grid {
        grid-template-columns: 1fr;
        gap: 1.25rem;
        padding: 1.75rem 1.5rem;
        text-align: center;
    }
    .fondateur-photo {
        max-width: 140px;
        margin: 0 auto;
    }
    .fondateur-texte .section-title {
        text-align: center;
    }
}