/* =================================================================
   Gautier SA — style.css
   Reproduction fidèle du thème WordPress original "gautiersa"
   ================================================================= */

/* --- Reset ----------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }

html {
    font-family: sans-serif;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

body {
    margin: 0;
    background: #fff;
    color: #404040;
    font-family: sans-serif;
    font-size: 16px;
    font-size: 1rem;
    line-height: 1.5;
}

img    { height: auto; max-width: 100%; border: 0; }
figure { margin: 1em 0; }
table  { border-collapse: collapse; border-spacing: 0; margin: 0 0 1.5em; width: 100%; }
td, th { padding: 0; }

p      { margin-bottom: 1.5em; }
ul, ol { margin: 0 0 1.5em 3em; }
ul     { list-style: disc; }
ol     { list-style: decimal; }

b, strong { font-weight: bold; }

/* --- Typography ----------------------------------------------- */
h1, h2, h3, h4, h5, h6 { clear: both; }

h1 {
    font-size: 2em;
    margin: 0.5em 0;
    text-align: left;
    color: #568D31;
}

h2 {
    padding-left: 30px;
    background: linear-gradient(#f4a30d, #f4a30d) no-repeat left center / 10px 10px;
    color: #f4a30d;
    font-weight: 400;
}

h2 a         { text-decoration: none; color: #f4a30d; }
h2 a:visited { text-decoration: none; color: #f4a30d; }

/* Police cursive Satisfy (rôle : .titrepacifico dans l'original) */
.titrepacifico,
.satisfy {
    font-family: 'Satisfy', cursive;
    font-size: 2em;
    color: #f4a30d;
    font-weight: normal;
    clear: both;
    margin: 0.2em 0 0.5em;
    padding: 0;
    background: none;
}

/* --- Links ---------------------------------------------------- */
a           { color: #568D31; }
a:visited   { color: #568D31; }
a:hover, a:focus, a:active { color: #A08143; }

/* --- Layout helpers ------------------------------------------- */
.ligne {
    display: block;
    margin-left: auto;
    margin-right: auto;
    max-width: 1200px;
    width: 100%;
    text-align: left;
}

.clearfix::after, .ligne::after, .site-branding::after {
    content: "";
    display: table;
    clear: both;
}

/* ================================================================
   TOP BAR
   ================================================================ */
#site-top {
    float: left;
    text-align: center;
    color: #ffffff;
    width: 100%;
    background-color: #f4a30d;
}

#social {
    float: right;
    text-align: right;
    color: #ffffff;
}

#site-top ul  { list-style: none; margin: 0; padding: 2px 5px; float: right; }
#site-top li  { display: inline-block; float: right; }
#site-top li a { color: #ffffff; text-decoration: none; margin: 0; padding: 0; }
#site-top li span { float: right; }

.tel {
    padding-left: 22px;
    display: inline-block;
    height: 40px;
    line-height: 40px;
    font-size: 1em;
    padding-right: 10px;
}

.contact-info {
    padding-left: 22px;
    display: inline-block;
    text-decoration: none;
    height: 40px;
    line-height: 40px;
    font-size: 1em;
}

/* ================================================================
   HEADER / BRANDING
   ================================================================ */
#masthead       { width: 100%; }
.site-branding  { text-align: center; }

.custom-logo-link { display: inline-block; float: left; }
.custom-logo      { float: left; padding: 10px 0; max-height: 150px; width: auto; }

/* ================================================================
   NAVIGATION
   ================================================================ */
.main-navigation {
    margin-top: 50px;
    clear: none;
    display: block;
    float: right;
    text-align: right;
    font-size: 1.1em;
    padding: 0;
    z-index: 50;
    width: 70%;
}

.main-navigation ul,
.main-navigation li { list-style: none; margin: 0; padding: 0; }

.main-navigation ul {
    width: 100%;
    text-align: right;
    display: inline-block;
}

.main-navigation li {
    padding: 0.5% 0.5% 0.5% 0.5%;
    display: inline-block;
}

.main-navigation li a {
    text-decoration: none;
    margin: 0;
    display: inline-block;
    color: #598F34;
    text-transform: uppercase;
}

.main-navigation li a:hover,
.main-navigation li.current-menu-item > a,
.main-navigation li.current > a {
    color: #A08143;
}

.openmenuresponsive {
    display: none;
    width: 96%;
    height: 45px;
    min-height: 22px;
    color: #598F34;
    padding: 1% 2%;
    text-align: left;
    cursor: pointer;
    font-size: 28px;
    clear: both;
    margin-top: 0;
    position: relative;
    z-index: 100;
}

/* ================================================================
   SITE CONTENT
   ================================================================ */
#content    { width: 100%; float: left; }
.site-main  { text-align: center; width: 100%; }

/* ================================================================
   HOMEPAGE — HERO / SLIDER (#fond-accueil)
   ================================================================ */
#fond-accueil {
    width: 100%;
    float: left;
    position: relative;
    overflow: hidden;
    background: #000;
}

/* Slider wrapper */
.slider {
    position: relative;
    width: 100%;
    height: 85vh;
    min-height: 350px;
    overflow: hidden;
}

.slide {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    opacity: 0;
    transition: opacity 0.9s ease-in-out;
    pointer-events: none;
}

.slide.active {
    opacity: 1;
    pointer-events: auto;
}

.slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Text overlay on slider */
.hero-text-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    background-color: rgba(241, 237, 223, 0.88);
    padding: 18px 35px;
    min-width: 280px;
    max-width: 560px;
    width: 50%;
    z-index: 10;
    pointer-events: none;
}

.hero-text-overlay h2 {
    background: none;
    padding: 0;
    color: #f4a30d;
    text-transform: uppercase;
    font-size: 1.15em;
    font-weight: 700;
    letter-spacing: 0.02em;
    margin: 0 0 6px;
}

.hero-text-overlay p {
    color: #404040;
    margin: 0;
    font-size: 1em;
}

/* Slider dots */
.slider-dots {
    position: absolute;
    bottom: 12px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 20;
    display: flex;
    gap: 8px;
}

.slider-dots button {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: 2px solid #fff;
    background: transparent;
    cursor: pointer;
    padding: 0;
    transition: background 0.2s;
}

.slider-dots button.active {
    background: #fff;
}

@media (max-width: 768px) {
    .slider { height: 50vh; min-height: 250px; }
    .hero-text-overlay { width: 80%; padding: 12px 15px; }
    .hero-text-overlay h2 { font-size: 0.9em; }
}

@media (max-width: 580px) {
    .slider { height: 40vh; min-height: 200px; }
    .hero-text-overlay { width: 92%; }
}

/* ================================================================
   HOMEPAGE — CONTENU ACCUEIL
   ================================================================ */
#contenu-accueil {
    padding: 0 0 1% 0;
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
    max-width: 1200px;
    min-height: 200px;
    margin: 0 0 1% 0;
    text-align: left;
}

/* ================================================================
   HOMEPAGE — CARTOUCHES (CARDS)
   ================================================================ */
#cartouches {
    padding-bottom: 20px;
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
    max-width: 1200px;
    width: 100%;
}

.zones {
    margin: 1% 1%;
    padding: 1%;
    width: 48%;
    border: 1px solid #f4a30d;
    display: block;
    float: left;
    min-height: 440px;
}

.zones h2 {
    margin: 1% 0;
    text-align: center;
    color: #f4a30d;
    text-transform: uppercase;
    background: none;
    padding-left: 0;
    font-weight: 300;
}

.zones h2 span       { padding: 1%; background: none; }
.zones h2 span a     { color: #f4a30d; text-decoration: none; }

.zones img           { display: block; margin: 6px auto; max-height: 260px; width: 100%; object-fit: cover; }

.zones p             { text-align: center; padding-bottom: 5px; }

.zones .liens        { text-align: center; }

.zones .liens a {
    border: 1px solid #f4a30d;
    padding: 1% 30px 1% 10px;
    color: #f4a30d;
    text-decoration: none;
    background: url(/images/plus.png) no-repeat right center;
    display: inline-block;
}

.zones .liens a:hover {
    background-color: #f4a30d;
    color: #ffffff;
}

/* ================================================================
   HOMEPAGE — ZONE BAS (HISTORY)
   ================================================================ */
.zone-bas {
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
    max-width: 1200px;
    width: 100%;
    padding: 0 1%;
    clear: both;
}

.zone-bas h2 {
    background: url(/images/tiret.png) repeat-x center;
    padding: 0;
    text-align: center;
}

.zone-bas h2 span {
    color: #f4a30d;
    text-decoration: none;
    background-color: #ffffff;
    display: inline-block;
}

.zone-bas h2 span a {
    color: #f4a30d;
    text-decoration: none;
    padding: 10px 20px;
    border: 1px solid #f4a30d;
    display: inline-block;
}

.zone-bas h2 span a:hover { background-color: #f4a30d; color: #fff; }

.zone-bas .liens       { text-align: right; }
.zone-bas .liens a {
    border: 1px solid #f4a30d;
    padding: 1% 30px 1% 10px;
    color: #f4a30d;
    text-decoration: none;
    background: url(/images/plus.png) no-repeat right center;
    display: inline-block;
}
.zone-bas .liens a:hover { background-color: #f4a30d; color: #ffffff; }

#contenu {
    padding: 0 0 1% 0;
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
    max-width: 1200px;
    width: 100%;
    min-height: 200px;
    margin: 0;
    text-align: left;
}

/* ================================================================
   PAGES INTÉRIEURES
   ================================================================ */
.entry-content { text-align: left; }

.entry-content h1 { color: #568D31; }

/* Colonnes image + texte */
.col-img {
    float: left;
    width: 40%;
    margin-right: 4%;
}

.col-img img { width: 100%; display: block; }

.col-txt {
    float: left;
    width: 56%;
}

.section-clear { clear: both; margin-top: 25px; }

/* Page wrapper */
.page-wrap {
    max-width: 1200px;
    margin: 20px auto;
    padding: 0 20px 30px;
    text-align: left;
    overflow: hidden;
}

ul.liste { list-style: disc; padding-left: 20px; margin: 0 0 1em; }
ul.liste li { margin-bottom: 4px; }

/* ================================================================
   CONTACT FORM
   ================================================================ */
.wpcf7-form label,
.contact-label {
    display: block;
    margin-bottom: 4px;
    font-size: 0.9em;
}

.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form textarea,
.contact-input {
    width: 100%;
    max-width: 600px;
    border: 1px solid #ccc;
    border-radius: 3px;
    padding: 6px 8px;
    font-size: 1em;
    color: #666;
    margin-bottom: 14px;
    display: block;
}

.wpcf7-form input:focus,
.wpcf7-form textarea:focus,
.contact-input:focus { border-color: #f4a30d; outline: none; color: #111; }

.wpcf7-form textarea,
.contact-textarea { height: 160px; resize: vertical; }

.contact-submit,
.wpcf7-submit {
    background-color: #f4a30d;
    color: #fff;
    border: none;
    padding: 8px 28px;
    font-size: 1em;
    cursor: pointer;
    border-radius: 3px;
}

.contact-submit:hover,
.wpcf7-submit:hover { background-color: #d48e0b; }

.form-notice {
    padding: 10px 15px;
    margin-bottom: 16px;
    border-radius: 3px;
    font-size: 0.95em;
    max-width: 600px;
}

.form-notice.success { background: #e7f5e0; color: #3a7a1e; border: 1px solid #b2d89a; }
.form-notice.error   { background: #fdecea; color: #a31010; border: 1px solid #f5b8b8; }

.hp-field { display: none !important; }

/* ================================================================
   FOOTER
   ================================================================ */
.site-footer {
    width: 100%;
    float: left;
    background-color: #f4a30d;
    min-height: 220px;
}

.content-bottom-widgets {
    max-width: 1200px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    color: #ffffff;
    background: url(/images/fond_pied.png) no-repeat right bottom;
    min-height: 240px;
    overflow: hidden;
    padding: 20px 10px;
}

.content-bottom-widgets .widget-area {
    width: 48%;
    margin: 1% 1%;
    float: left;
}

.content-bottom-widgets .widget-area h2 {
    margin: 0;
    padding: 0;
    color: #ffffff;
    background: none;
}

.content-bottom-widgets a       { color: #ffffff; }
.content-bottom-widgets p       { margin: 0 0 4px; font-size: 0.9em; }

.content-bottom-widgets .col2   { text-align: right; }
.content-bottom-widgets .col2 ul  { margin: 0; padding: 0; list-style: none; }
.content-bottom-widgets .col2 li  { display: inline; }
.content-bottom-widgets .col2 li a { color: #ffffff; }

/* ================================================================
   RESPONSIVE
   ================================================================ */

@media only screen and (max-width: 1200px) {
    #contenu-accueil { margin: 1%; padding: 0 0 1% 0; }
    .main-navigation li { padding: 0.5%; display: inline-block; }
}

@media only screen and (max-width: 980px) {
    .main-navigation { font-size: 0.95em; width: 63%; }
    .main-navigation li { display: inline-block; position: relative; }
    .main-navigation li a { text-transform: none; }
}

@media only screen and (max-width: 768px) {
    .main-navigation {
        padding: 0;
        z-index: 50;
        width: 100%;
        text-align: center;
        margin-top: 5px;
        float: none;
        clear: both;
    }

    .main-navigation ul {
        text-align: center;
        display: none;
    }

    .main-navigation.toggled ul { display: block; }

    .main-navigation li {
        display: inline-block;
        position: relative;
        padding: 0.5%;
    }

    .custom-logo-link { float: none; display: block; text-align: center; }
    .custom-logo      { float: none; margin: 0 auto; }

    .openmenuresponsive { display: block; }

    .col-img, .col-txt { float: none; width: 100%; margin: 0 0 15px; }

    .zones {
        margin: 1%;
        padding: 1%;
        width: 98%;
        background-color: #f1eddf;
        display: block;
        float: left;
        min-height: 400px;
        height: auto;
    }

    .content-bottom-widgets .widget-area { width: 98%; margin: 1% 1%; float: left; }
    .hero-text-overlay { width: 80%; }
}

@media only screen and (max-width: 580px) {
    .hero-text-overlay { width: 92%; padding: 12px 15px; }
    .hero-text-overlay h2 { font-size: 0.95em; }
    .content-bottom-widgets .widget-area { width: 98%; }
    .main-navigation li { width: 100%; padding: 0; margin: 0; }
    .main-navigation li a { display: block; padding: 6px 0; width: 100%; }
}