/* L'Épice Rit Aiguines — maquette validée */

:root{
    --green:#245f3d;
    --green-dark:#183e2a;
    --cream:#f5f0e6;
    --paper:#fffdf8;
    --text:#1e271f;
    --muted:#626a62;
    --gold:#d9a45b;
    --line:#e1dacd;
    --shadow:0 14px 35px rgba(35,45,36,.11);
    --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--text);font-family:Arial,Helvetica,sans-serif}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
.site-shell{width:min(calc(100% - 40px),var(--max));margin-inline:auto}

/* Top strip */
.top-strip{background:var(--green-dark);color:#fff;font-size:12px}
.top-strip-inner{min-height:31px;display:grid;grid-template-columns:1fr 1fr auto;align-items:center;gap:20px}
.top-strip-inner>span:nth-child(2){text-align:center}
.top-strip-contact{display:flex;gap:24px}
.top-strip a{text-decoration:none;color:#fff}

/* Header */
.site-header{background:var(--paper);border-bottom:1px solid #ece5d8}
.site-header-inner{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:30px}
.brand-link{width:245px;display:block}
.brand-logo{width:100%;height:auto}
.site-nav{display:flex;align-items:center;justify-content:flex-end;gap:22px;flex-wrap:wrap}
.site-nav-link{font-size:13px;font-weight:700;text-decoration:none;padding:10px 0;border-bottom:2px solid transparent}
.site-nav-link:hover,.site-nav-link.is-active{border-color:var(--green)}
.site-nav-cta{display:inline-flex;align-items:center;justify-content:center;min-height:43px;padding:0 19px;border-radius:8px;background:var(--green);color:#fff;text-decoration:none;font-size:13px;font-weight:800}

/* Hero */
.hero-showcase{position:relative;min-height:445px;overflow:hidden}
.hero-showcase-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 54%}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(12,27,18,.82) 0%,rgba(12,27,18,.48) 34%,rgba(12,27,18,.08) 68%,rgba(12,27,18,.17) 100%)}
.hero-content{position:relative;z-index:2;min-height:445px;display:flex;align-items:center;justify-content:space-between;gap:40px;color:#fff}
.hero-copy{width:min(520px,62%)}
.eyebrow{margin:0 0 13px;color:#f4d49a;font-size:13px;font-weight:800;letter-spacing:.10em;text-transform:uppercase}
.hero-copy h1{margin:0;font-family:Georgia,"Times New Roman",serif;font-size:54px;line-height:.96;letter-spacing:-.035em}
.hero-copy h1 span{display:block;margin-top:6px;color:#f0b96b;font-style:italic}
.hero-text{margin:20px 0 0;font-size:16px;line-height:1.52}
.hero-actions{display:flex;gap:16px;margin-top:22px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:43px;padding:0 17px;border-radius:7px;text-decoration:none;font-size:13px;font-weight:800}
.btn-green{background:#2d7a47;color:#fff}
.btn-ghost{border:1px solid rgba(255,255,255,.8);color:#fff;background:rgba(0,0,0,.06)}
.btn-light{background:#fff;color:#2c342e}
.hero-signature{align-self:flex-end;margin:0 5px 43px 0;font-family:"Brush Script MT","Segoe Script",cursive;font-size:37px;line-height:1.35;text-align:right;transform:rotate(-5deg)}

/* Features */
.features-strip{background:var(--paper);border-bottom:1px solid var(--line)}
.features-grid{display:grid;grid-template-columns:repeat(6,1fr)}
.features-grid article{min-height:115px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:13px 12px;border-right:1px solid var(--line)}
.features-grid article:last-child{border-right:0}
.feature-icon{font-size:34px;line-height:1;margin-bottom:8px;filter:grayscale(1)}
.features-grid strong{font-family:Georgia,"Times New Roman",serif;font-size:14px}
.features-grid span{margin-top:4px;font-size:12px;color:#5e625e}

/* Main product grid */
.products-showcase{padding:0 0 11px;background:var(--cream)}
.products-grid{display:grid;grid-template-columns:1.55fr 1fr;gap:7px;padding-top:7px}
.large-product-card,.produce-card{position:relative;min-height:330px;overflow:hidden}
.large-product-card img,.produce-card img{width:100%;height:100%;min-height:330px;object-fit:cover}
.large-product-copy{position:absolute;left:26px;top:42px;width:255px;padding:21px 22px;background:rgba(255,253,248,.93);border-radius:5px}
.large-product-copy h2{margin:0;font-family:Georgia,"Times New Roman",serif;font-size:33px;line-height:1.04;color:#2f4a34;font-style:italic}
.large-product-copy p{font-size:13px;line-height:1.42}
.produce-card{background:#d8c99e}

/* Mini cards */
.mini-cards-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding-top:14px}
.mini-card{overflow:hidden;border-radius:7px;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.12)}
.mini-card>img{width:100%;height:110px;object-fit:cover}
.mini-card-body{min-height:84px;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:10px 15px}
.mini-card h3{margin:0 0 4px;font-family:Georgia,"Times New Roman",serif;font-size:16px}
.mini-card p{margin:0;font-size:12px;line-height:1.35}
.mini-arrow{flex:0 0 30px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#6b8678;color:#fff;font-size:18px}

/* Lake */
.lake-banner{position:relative;min-height:270px;overflow:hidden}
.lake-banner>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lake-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(16,42,29,.7),rgba(16,42,29,.06) 65%)}
.lake-content{position:relative;z-index:2;min-height:270px;display:flex;flex-direction:column;justify-content:center;color:#fff}
.lake-content h2{margin:0;font-family:Georgia,"Times New Roman",serif;font-size:38px;line-height:1.02;font-style:italic}
.lake-content h2 span{color:#efb562}
.lake-content p{width:min(430px,100%);margin:16px 0;font-size:13px;line-height:1.45}
.lake-content .btn{align-self:flex-start}

/* Footer */
.site-footer{background:var(--cream)}
.footer-main{display:grid;grid-template-columns:1.05fr 1fr 1.05fr .9fr;gap:34px;padding:31px 0 25px}
.footer-brand img{width:230px}
.footer-brand p,.footer-contact p,.footer-hours p{font-size:12px;line-height:1.5}
.footer-contact{padding-top:9px}
.footer-contact a{display:block;margin-top:11px;font-size:12px;text-decoration:none}
.footer-hours h2,.footer-social h2{margin:8px 0 9px;font-size:13px}
.footer-social{position:relative}
.social-row{display:flex;gap:13px}
.social-row a{font-size:12px}
.footer-sketch{width:145px;margin-top:12px;margin-left:auto}
.footer-bottom{background:var(--green-dark);color:#fff;font-size:10px}
.footer-bottom-inner{min-height:51px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.footer-legal{display:flex;gap:10px;flex-wrap:wrap}
.footer-legal a{text-decoration:none;color:#fff}
.footer-legal a:not(:last-child)::after{content:" | ";margin-left:10px;color:rgba(255,255,255,.5)}

/* Responsive */
@media(max-width:980px){
    .top-strip-inner{grid-template-columns:1fr auto}.top-strip-inner>span:nth-child(2){display:none}
    .site-header-inner{align-items:flex-start;flex-direction:column;padding:12px 0}
    .site-nav{gap:14px}
    .hero-content{align-items:flex-end}.hero-signature{display:none}.hero-copy{width:75%}
    .features-grid{grid-template-columns:repeat(3,1fr)}.features-grid article:nth-child(3){border-right:0}
    .products-grid{grid-template-columns:1fr}.footer-main{grid-template-columns:1fr 1fr}
}
@media(max-width:650px){
    .site-shell{width:min(calc(100% - 28px),var(--max))}
    .top-strip-inner{grid-template-columns:1fr}.top-strip-contact{display:none}
    .brand-link{width:200px}
    .site-nav{width:100%;display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
    .site-nav-link,.site-nav-cta{justify-content:center;text-align:center}
    .hero-showcase,.hero-content{min-height:520px}.hero-copy{width:100%}.hero-copy h1{font-size:43px}.hero-actions{flex-direction:column;align-items:flex-start}
    .features-grid{grid-template-columns:repeat(2,1fr)}.features-grid article{border-bottom:1px solid var(--line)}.features-grid article:nth-child(odd){border-right:1px solid var(--line)}.features-grid article:nth-child(even){border-right:0}
    .large-product-copy{position:relative;left:auto;top:auto;width:auto;margin:-55px 14px 14px}
    .mini-cards-grid{grid-template-columns:1fr}
    .footer-main{grid-template-columns:1fr}.footer-bottom-inner{align-items:flex-start;flex-direction:column;padding:14px 0}
}


/* ============================================================
   CORRECTION — AIGUINES / LAC DE SAINTE-CROIX
   Photo originale + texte et bouton superposés en HTML
   ============================================================ */

.lake-banner {
    position: relative;
    min-height: 315px;
    overflow: hidden;
    background: #234936;
}

.lake-banner-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 47%;
}

.lake-overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            90deg,
            rgba(15, 43, 29, .82) 0%,
            rgba(15, 43, 29, .62) 29%,
            rgba(15, 43, 29, .16) 65%,
            rgba(15, 43, 29, .04) 100%
        );
}

.lake-content {
    position: relative;
    z-index: 2;
    min-height: 315px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    color: #fff;
}

.lake-kicker {
    margin: 0 0 8px;
    color: rgba(255, 255, 255, .76);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.lake-content h2 {
    margin: 0;
    max-width: 520px;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(38px, 4vw, 49px);
    font-style: italic;
    line-height: 1.04;
    letter-spacing: -.025em;
}

.lake-content h2 span {
    display: block;
    margin-top: 4px;
    color: #efb562;
}

.lake-content > p:not(.lake-kicker) {
    width: min(445px, 100%);
    margin: 16px 0 19px;
    color: rgba(255, 255, 255, .94);
    font-size: 13px;
    line-height: 1.55;
}

.lake-content .btn {
    align-self: flex-start;
}

@media (max-width: 650px) {
    .lake-banner,
    .lake-content {
        min-height: 385px;
    }

    .lake-banner-img {
        object-position: 54% center;
    }

    .lake-content h2 {
        font-size: 38px;
    }
}


/* ============================================================
   BANDEAU FLASH FIN ET ADMINISTRABLE
   ============================================================ */

.flash-banner {
    position: relative;
    z-index: 90;
    min-height: 34px;
    color: #fff;
    background: #183e2a;
    transition: background-color .25s ease, color .25s ease;
}

.flash-banner[hidden] {
    display: none;
}

.flash-banner-inner {
    min-height: 34px;
    display: grid;
    grid-template-columns: 12px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
}

.flash-pulse {
    width: 8px;
    height: 8px;
    display: block;
    border-radius: 50%;
    background: #d7f1a3;
    box-shadow: 0 0 0 0 rgba(215, 241, 163, .65);
    animation: flashPulse 1.7s infinite;
}

.flash-messages {
    min-width: 0;
}

.flash-item {
    min-height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    color: inherit;
    text-align: center;
    font-size: 12px;
}

.flash-item[hidden] {
    display: none;
}

.flash-item-content {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 7px;
}

.flash-title {
    font-weight: 900;
}

.flash-message {
    font-weight: 650;
}

.flash-link {
    padding-bottom: 1px;
    border-bottom: 1px solid currentColor;
    color: inherit;
    font-weight: 850;
    text-decoration: none;
}

.flash-link:hover,
.flash-link:focus-visible {
    opacity: .82;
    outline: none;
}

.flash-close {
    position: absolute;
    top: 50%;
    right: 14px;
    width: 26px;
    height: 26px;
    display: grid;
    place-items: center;
    transform: translateY(-50%);
    padding: 0;
    border: 0;
    border-radius: 50%;
    color: inherit;
    background: transparent;
    cursor: pointer;
    font-size: 20px;
    line-height: 1;
}

.flash-close:hover,
.flash-close:focus-visible {
    background: rgba(255, 255, 255, .12);
    outline: none;
}

@keyframes flashPulse {
    0% {
        transform: scale(.88);
        box-shadow: 0 0 0 0 rgba(215, 241, 163, .62);
    }

    55% {
        transform: scale(1);
        box-shadow: 0 0 0 7px rgba(215, 241, 163, 0);
    }

    100% {
        transform: scale(.88);
        box-shadow: 0 0 0 0 rgba(215, 241, 163, 0);
    }
}

/* Header plus compact avec le vrai logo ovale. */
.site-header-inner {
    min-height: 132px;
}

.brand-link {
    width: 142px;
}

.brand-logo {
    width: 100%;
    max-height: 118px;
    object-fit: contain;
}

/* Footer plus compact. */
.footer-main {
    gap: 44px;
    padding: 28px 0 24px;
}

.footer-brand img {
    width: 138px;
    max-height: 118px;
    object-fit: contain;
}

.footer-brand p {
    margin-top: 8px;
}

.footer-sketch {
    width: 125px;
}

@media (max-width: 980px) {
    .site-header-inner {
        min-height: auto;
    }

    .brand-link {
        width: 130px;
    }
}

@media (max-width: 650px) {
    .flash-banner-inner {
        grid-template-columns: 10px minmax(0, 1fr);
        padding-right: 30px;
    }

    .flash-item {
        justify-content: flex-start;
        min-height: 40px;
        text-align: left;
    }

    .flash-item-content {
        justify-content: flex-start;
    }

    .flash-close {
        right: 6px;
    }

    .brand-link {
        width: 120px;
    }

    .brand-logo {
        max-height: 100px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .flash-pulse {
        animation: none;
    }
}
