/*
Theme Name: LPDCJ - Thème enfant
Description: Thème enfant OceanWP pour Les Petites Cuillères de Juliette.
Author: Mathilde
Template: oceanwp
Version: 1.0.0
Text Domain: lpdcj-child
*/




/* =========================================================
   POLICES LOCALES
========================================================= */

/* Goudy Bookletter 1911 */

@font-face {
    font-family: 'Goudy Bookletter';
    src: url('fonts/GoudyBookletter1911.woff2') format('woff2'),
         url('fonts/GoudyBookletter1911.woff') format('woff');
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}

/* Mr Christo */

@font-face {
    font-family: 'Mr Christo';
    src: url('fonts/MrChristo-Regular.woff2') format('woff2'),
         url('fonts/MrChristo-Regular.woff') format('woff');
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}





/* =========================================================
   BASE
========================================================= */

html,
body {
    margin: 0;
    padding: 0;
}

body {
    font-family: 'Goudy Bookletter', serif;
    font-size: 16px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Sélection de texte */

::selection {
    background: #EEA2A8;
    color: #305214;
}

/* =========================================================
   TYPOGRAPHIE GLOBALE
========================================================= */

body,
button,
input,
select,
textarea {
    font-family: 'Goudy Bookletter', serif;
}

/* Titres */

h1, h2, h3, h4, h5, h6,
.elementor-widget-heading .elementor-heading-title {
    font-family: 'Goudy Bookletter', serif;
    font-weight: 400;
    margin: 0 0 0.6em;
}

/* H1 */

h1,
.elementor-widget-heading h1.elementor-heading-title {
    font-size: 65px;
    line-height: 1.05;
}

/* H2 */

h2,
.elementor-widget-heading h2.elementor-heading-title {
    font-size: 42px;
    line-height: 1.15;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* H3 */

h3,
.elementor-widget-heading h3.elementor-heading-title {
    font-size: 24px;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* =========================================================
   CLASSE TYPO MANUSCRITE
========================================================= */

.typo-script,
.typo-script * {
    font-family: 'Mr Christo', cursive !important;
    font-weight: normal;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

/* =========================================================
   BOUTONS PRINCIPAUX
========================================================= */

button,
input[type="submit"],
.elementor .elementor-button {
    font-family: 'Goudy Bookletter', serif;
    font-size: 16px;
    text-transform: uppercase;
    background-color: #CD3D7C;
    color: #FFFFFF;
    padding: 16px 40px;
    border: 1px solid #CD3D7C;
    border-radius: 0;
    cursor: pointer;
    transition: all 0.25s ease;
}

button:hover,
input[type="submit"]:hover,
.elementor .elementor-button:hover {
    background-color: #EEA2A8;
    color: #FFFFFF;
    border-color: #FB9DA7;
}

/* Boutons secondaires */

.elementor .cta-secondaire .elementor-button {
    background: transparent;
    color: #CD3D7C;
    border: 1px solid #CD3D7C;
}

.elementor .cta-secondaire .elementor-button:hover {
    background: transparent;
    color: #FB9DA7;
    border-color: #FB9DA7;
}

/* =========================================================
   RESPONSIVE — TABLETTE
========================================================= */

@media (max-width: 1024px) {

    h1,
    .elementor-widget-heading h1.elementor-heading-title {
        font-size: 48px;
    }

    h2,
    .elementor-widget-heading h2.elementor-heading-title {
        font-size: 32px;
    }

    h3,
    .elementor-widget-heading h3.elementor-heading-title {
        font-size: 22px;
    }
}

/* =========================================================
   RESPONSIVE — MOBILE
========================================================= */

@media (max-width: 767px) {

    h1,
    .elementor-widget-heading h1.elementor-heading-title {
        font-size: 36px;
        line-height: 1.1;
    }

    h2,
    .elementor-widget-heading h2.elementor-heading-title {
        font-size: 26px;
    }

    h3,
    .elementor-widget-heading h3.elementor-heading-title {
        font-size: 20px;
    }
}