/* ================== VARIABLES GLOBALES ================== */
:root {
    --green: #2dbf62;
    --green-600: #1ea152;
    --border: #dfe7e4;
    --text: #2a2e30;
    --muted: #6d7479;
    --radius: 6px;
    --shadow: 0 2px 10px rgba(0,0,0,.06);
    --gap: 14px;
    --font: system-ui, -apple-system, "Segoe UI", Roboto, Ubuntu, Arial, sans-serif;
    --header-h: 112px;   
    --content-gap: 8px;
}

/* ================== BASE ================== */
* { box-sizing: border-box; }
body, html {
    margin: 0;
    font-family: var(--font);
    color: var(--text);
    overflow-x: hidden;
}
input, select, textarea, button {
    max-width: 100%;
    box-sizing: border-box;
}

/* ================== HEADER / OFFSET ================== */
.after-header { padding-top: calc(var(--header-h) + var(--content-gap)); }
.page-header { display:block; }
.page-header .status-bar { margin:6px 0 12px; }

/* ================== CONTAINER ================== */
.container { max-width: 1100px; margin:0 auto; padding:0 16px; }

/* ================== STATS BANNER ================== */
.stats-banner {
    background:#222 url('/images/banner-bg.jpg') center/cover no-repeat; 
    padding:22px 0; 
    color:#fff; 
}
.stats-banner__inner {
    max-width:1100px; margin:0 auto; padding:0 16px; 
    display:grid; grid-template-columns:repeat(4,1fr); gap:18px; align-items:center;
}
.stats-banner__item { display:flex; align-items:center; gap:10px; }
.stats-banner__item i { font-size:42px; color:#23b15a; }
.stats-banner__value { font-size:38px; font-weight:800; }
.stats-banner__label { font-size:14px; letter-spacing:.6px; }

/* ================== TITRE PAGE ================== */
.page-title h1 { margin:0; font-size:28px; font-weight:800; color:#212121; text-align: center; }
.page-title .strong { color:#1e1e1e; letter-spacing:.5px; }
.page-title .underline { width:140px; height:6px; background:#23b15a; margin:6px auto 16px auto; display:block; }
.status-bar { margin:8px 0 12px; text-align:center; }
.status-button {
    background:#23b15a; color:#fff; border:none; border-radius:4px;
    padding:10px 14px; font-weight:700; cursor:pointer;
}
.status-button .caret { font-weight:900; margin-left:6px; }

/* ================== FILTRES ================== */
.filters {
    border:1px solid #23b15a; padding:14px; border-radius:4px; margin-bottom:16px; 
    background-color:#fdfdfd; max-width:100%; overflow:hidden;
}
.filters form {
    display:grid; grid-template-columns:1fr; gap:10px; width:100%;
}
.filter-input, .filter-select {
    width:100%; height:46px; border-radius:6px; padding:0 14px; font-size:14px; border:1px solid #d0d0d0;
    background:#fff; display:block;
}
.submit-button {
    width:160px;          
    max-width:90%;         
    display:block;          
    margin:0 auto;         
    text-align:center;     
    height:40px;          
    font-size:14px;       
    border-radius:6px;    
    background:var(--green);
    color:#fff;
    border:none;
    font-weight:700;
    cursor:pointer;
    transition:background 0.2s ease, transform 0.1s ease;
}
.submit-button:hover { background:#1ea152; }

/* ================== PARTNER CARD ================== */
.partner-card {
    max-width:540px; margin:16px auto 24px; 
    border:1px solid var(--green); border-radius: var(--radius); background:#fff; 
    padding:18px; box-shadow: var(--shadow); overflow:hidden;
}
.partner-card.wide { max-width:980px; }
.partner-title {
    font-size:22px; font-weight:800; margin:0 0 10px; position:relative; letter-spacing:.2px;
}
.partner-title::after {
    content:""; position:absolute; left:0; bottom:-6px; width:60px; height:4px;
    background:var(--green); border-radius:3px;
}
.partner-form { margin-top:18px; }
.form-row { margin-bottom: var(--gap); }

.input, .select {
    width:100%; height:44px; padding:10px 12px; border:1px solid var(--border);
    border-radius: var(--radius); background:#fff; color:var(--text); outline:none;
    transition:border-color .15s ease, box-shadow .15s ease; appearance:none;
}
.select {
    background-image:
        linear-gradient(45deg, transparent 50%, var(--muted) 50%),
        linear-gradient(135deg, var(--muted) 50%, transparent 50%),
        linear-gradient(to right, transparent, transparent);
    background-position:
        calc(100% - 22px) 19px, calc(100% - 16px) 19px, 100% 0;
    background-size:6px 6px, 6px 6px, 2.5rem 2.5rem;
    background-repeat:no-repeat;
}
.input::placeholder { color:#9aa3a9; }
.input:focus, .select:focus { border-color:var(--green); box-shadow:0 0 0 3px rgba(45,191,98,.14); }

.btn-primary {
    width:100%; height:48px; border:none; border-radius:8px;
    background:var(--green); color:#fff; font-weight:700; font-size:16px; cursor:pointer;
    transition:background .15s ease, transform .02s ease;
}
.btn-primary:hover { background:var(--green-600); }
.btn-primary:active { transform:translateY(1px); }

/* ================== GRID RESPONSIVE ================== */
.grid-2 {
    display:grid; grid-template-columns:1fr; gap:var(--gap); width:100%;
}
.span-2 { grid-column:1 / -1; }
@media (min-width:768px){
    .grid-2 { grid-template-columns:1fr 1fr; gap:16px; }
    .span-2 { grid-column:1 / 3; }
    .input { height:46px; }
}

/* ================== VALORISATIONS ================== */
.valorisations {
    max-width: 1200px; margin:12px auto 28px; padding:0 16px; color:var(--text);
}
.valorisations h4 {
    margin:0 0 14px; font-size:22px; font-weight:800; position:relative; text-align:center;
}
.valorisations h4::after {
    content:""; position:absolute; left:50%; transform:translateX(-50%); bottom:-6px; width:60px; height:4px; 
    background:var(--green); border-radius:3px;
}
.valorisation-grid {
    display:grid; grid-template-columns:1fr; gap:18px; width:100%;
}
@media(min-width:700px){ .valorisation-grid{ grid-template-columns:1fr 1fr; } }
@media(min-width:1100px){ .valorisation-grid{ grid-template-columns:1fr 1fr 1fr 1fr; } }

.valorisation-card {
    display:block; text-decoration:none; color:inherit;
    background:#f2f4f5; border:1px solid #bfe0c6; border-radius:10px;
    padding:14px 16px; box-shadow:0 2px 8px rgba(0,0,0,.08);
    transition:transform .06s ease, box-shadow .15s ease, border-color .15s ease;
}
.valorisation-card:hover {
    transform:translateY(-1px); box-shadow:0 8px 18px rgba(0,0,0,.12); border-color:#8ecfa0;
}
.valorisation-titre { margin:0 0 10px; color:#1e8c3f; font-weight:700; line-height:1.18; font-size:16px; }
.valorisation-date, .valorisation-porteur { margin:6px 0; font-size:14px; color:#444; }
.valorisation-tags { margin:6px 0; }
.tag {
    display:inline-block; padding:6px 10px; border-radius:999px; font-weight:700; font-size:13px;
    background:#fff; border:1px solid #d9e6dc; box-shadow:0 1px 2px rgba(0,0,0,.05);
}
.tag-produit{ color:#7a1b1b; border-color:#e4c7c7; }
.tag-innovation{ color:#3d2a7a; border-color:#d6c9f1; }
.tag-autres{ color:#444; border-color:#ddd; }

/* ================== MEDIA QUERIES ================== */
@media(max-width:768px) { .filters form { grid-template-columns:1fr 1fr; gap:8px; } }
@media(max-width:576px) {
    .filters form { grid-template-columns:1fr; }
    .page-title h1 { font-size:20px; }
    .valorisations { padding:0 12px; }
    .valorisation-card { padding:12px; }
    .valorisations h4 { font-size:20px; }
}
@media(max-width:480px) {
    .partner-card { margin:12px auto 20px; padding:16px; }
    .partner-title { font-size:20px; }
    .btn-primary { height:46px; }
    .valorisation-grid { gap:12px; }
}



