/* ============================================================
   LOCADIE — MAIN.CSS
   Variables globales, reset, typographies, styles généraux
   ============================================================ */

/* ------------------------------ */
/* VARIABLES GLOBALES             */
/* ------------------------------ */
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300;400;500;600;700&display=swap');
:root {
    /* Couleurs Locadie */
    --locadie-green: #17522f;
    --locadie-green-light: #3b4f26;
    --locadie-brown: #371e0e;
    --locadie-brown-light: #593117;
    --locadie-beige: #beeed2;
    /* Typographies */
    --font-title: 'Kalam', cursive;
    --font-body: 'Playfair Display', serif;
    /* Radius */
    --radius-s: 5px;
    --radius-m: 12px;
    --radius-l: 20px;
    --radius-xl: 30px;
    /* Ombres */
    --shadow-soft: 0 1px 3px rgba(0,0,0,0.15);
    --shadow-hard: -50px -50px 0px -50px rgba(123,95,52,0.8);
    /* Tailles */
    --fs-xs: 12px;
    --fs-s: 14px;
    --fs-m: 16px;
    --fs-l: 20px;
    --fs-xl: 28px;
    --fs-xxl: 38px;
}

/* ------------------------------ */
/* RESET / NORMALIZE              */
/* ------------------------------ */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-body);
    font-size: var(--fs-m);
    line-height: 1.6;
    color: #222;
    background: #fff;
}

/* ------------------------------ */
/* TITRES                         */
/* ------------------------------ */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-title);
    color: var(--locadie-green-dark);
    margin-bottom: 0.5em;
}

h1 {
    font-size: var(--fs-xxl);
}

h2 {
    font-size: var(--fs-xl);
}

h3 {
    font-size: 25px;
}

h4 {
    font-size: 22px;
}

h5 {
    font-size: 18px;
    font-family: var(--font-body);
}

h6 {
    font-size: 16px;
    font-family: var(--font-body);
}

/* ------------------------------ */
/* PARAGRAPHES                    */
/* ------------------------------ */
p {
    margin-bottom: 1em;
    line-height: 1.6;
}

/* ------------------------------ */
/* IMAGES                         */
/* ------------------------------ */
img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* ------------------------------ */
/* LISTES                         */
/* ------------------------------ */
ul, ol {
    margin-left: 1.2em;
    margin-bottom: 1em;
}

body .hentry ul {
    padding-left: 11px;
    padding-right: 18px;
}

/* ------------------------------ */
/* LIENS                          */
/* ------------------------------ */
a {
    color: var(--locadie-green);
    text-decoration: none;
}

    a:hover {
        text-decoration: underline;
    }

/* ------------------------------ */
/* GLOBAL — IMPORTÉS DE YELLOWPENCIL */
/* ------------------------------ */

/* Titres produits en listing */
body #main .woocommerce-LoopProduct-link h2 {
    font-size: 18px;
    line-height: 1.2em;
}

/* Widgets titres */
body #secondary .widget .widget-title {
    border-color: var(--locadie-green);
    font-size: 25px;
    line-height: 1em;
}

/* Titres catégories */
body #primary .storefront-product-categories a h2 {
    font-size: 21px !important;
}

/* Section titres */
body #main .storefront-product-section .section-title {
    font-size: var(--fs-xxl);
    text-shadow: rgba(0, 0, 0, 0.3) 0px 1px 1px;
}

/* Titres pages */
body .hentry .entry-header h1 {
    font-weight: 500;
}

/* H2 / H3 / H4 dans contenu */
body #page #content .col-full #primary #main .hentry .entry-content h2 {
    font-size: 25px !important;
}

body #page #content .col-full #primary #main .hentry .entry-content h3 {
    font-size: 25px !important;
}

body #page #content .col-full #primary #main .paper .hentry .entry-content h4 span {
    font-size: 22px !important;
}

/* Images dans header */
body .hentry .entry-header img {
    max-width: 45%;
}

body .hentry .wp-post-image {
    max-width: 60%;
    max-height: 80%;
}

/* Tab description */
body #tab-description h2 {
    font-size: 21px;
}

body #tab-description h3 {
    font-weight: 500;
    text-shadow: rgba(0, 0, 0, 0.3) 0px 0px 1px;
}

body #tab-description p {
    text-shadow: none;
}

body #tab-description .entete_des {
    font-weight: 300;
    letter-spacing: 1.7px;
    font-size: 14px;
    line-height: 2.9em;
}

/* Page tag */
body.tag #main .page-header h1 {
    font-size: 29px;
}

body.tag #main .hentry .entry-content {
    padding-left: 15px;
}

/* Page category */
body.category #main .hentry img {
    max-width: 42%;
}

body.category #main .hentry .wp-post-image {
    max-width: 52%;
}

/* Single post */
body.single-post .hentry .entry-header h1 {
    text-align: left;
}

body.single-post #page #content .col-full #primary #main .paper .hentry .entry-header h1 {
    font-size: 43px !important;
}
