/* ── TC Agriturismo — Pages SEO filtrables ─────────────────────────── */

:root {
    --tc-agri:       #7A2035;
    --tc-agri-light: #f9f0f2;
    --tc-agri-muted: #9b4a5a;
}

.tcag-seo-wrap {
    max-width: 1200px;
    margin: 0 auto;
    padding: 32px 20px 64px;
}

/* ── En-tête ── */
.tcag-seo-header {
    margin-bottom: 28px;
}
.tcag-seo-h1 {
    font-size: clamp(1.5rem, 3vw, 2.2rem);
    font-weight: 700;
    color: var(--tc-agri);
    margin: 0 0 10px;
    line-height: 1.2;
}
.tcag-seo-intro {
    font-size: 1rem;
    color: #555;
    max-width: 720px;
}
.tcag-seo-intro p { margin: 0; }

/* ── Filtres chips (style hub v2) ── */
.tcag-seo-filters {
    background: var(--tc-cream, #f2ede4);
    border-radius: 12px;
    padding: 16px 18px;
    margin-bottom: 22px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.tcag-seo-filter-strip {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}

/* Active state sur les chips SEO */
.tcag-chip--active {
    background: var(--tc-terra, #7A2035) !important;
    border-color: var(--tc-terra, #7A2035) !important;
    color: #fff !important;
    font-weight: 600;
}

.tcag-chip-count {
    font-size: .68rem;
    opacity: .75;
    background: rgba(0,0,0,.09);
    border-radius: 10px;
    padding: 0 5px;
    margin-left: 2px;
}

.tcag-chip--active .tcag-chip-count {
    background: rgba(255,255,255,.22);
    opacity: 1;
}

/* ── Compteur ── */
.tcag-seo-count {
    font-size: 13px;
    color: #888;
    margin: 0 0 16px;
}

/* ── Grille (réutilise les cards du frontend) ── */
.tcag-seo-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 20px;
}

/* Sur les pages SEO split-view, cette grille porte aussi .tcag-split-cards
   (liste liée à la carte façon Booking/Airbnb : une card par ligne).
   agri-seo.css est enqueue après frontend.css, donc sans ce sélecteur plus
   spécifique la règle auto-fill(260px) ci-dessus gagnait la cascade et
   affichait 2 colonnes au lieu d'1. */
.tcag-seo-grid.tcag-split-cards {
    grid-template-columns: 1fr;
    gap: 24px;
}

/* ── Texte SEO bas de page ── */
.tcag-seo-bottom {
    margin-top: 52px;
    padding: 28px 32px;
    background: var(--tc-agri-light);
    border-left: 4px solid var(--tc-agri);
    border-radius: 0 8px 8px 0;
    color: #444;
    font-size: 15px;
    line-height: 1.7;
}
.tcag-seo-bottom p { margin: 0 0 1em; }
.tcag-seo-bottom p:last-child { margin-bottom: 0; }
.tcag-seo-bottom strong { color: var(--tc-agri); }

/* ── « Affiner la recherche » — carte moderne, liens en pastilles ──────────────────────────
   22/09 : remplace l'ancienne présentation (3 colonnes de liens nus, années 2000), même
   traitement que sur le hub activités (cohérence demandée par l'utilisateur sur tous les hubs). */
.tcag-seo-footer-nav {
    margin-top: 56px;
    padding: 28px 26px 30px;
    background: #fff;
    border: 1px solid #ecdfe2;
    border-radius: 22px;
    box-shadow: 0 14px 30px -24px rgba(60,20,30,.35);
}

.tcag-seo-footer-nav > p {
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--tc-agri);
    margin: 0 0 22px;
}
.tcag-seo-footer-nav > p::before {
    content: "";
    width: 8px; height: 8px;
    border-radius: 50%;
    background: var(--tc-agri);
    flex: 0 0 auto;
}

.tcag-seo-footer-cols {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 26px 32px;
    align-items: start;
}

.tcag-seo-footer-col-heading {
    display: block;
    font-size: .68rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: #a08a90;
    margin-bottom: 12px;
    padding-bottom: 0;
    border-bottom: 0;
}

.tcag-seo-footer-col ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.tcag-seo-footer-col ul li { margin: 0; }

.tcag-seo-footer-col ul li a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: .8rem;
    font-weight: 600;
    color: var(--tc-agri) !important;
    text-decoration: none;
    padding: 6px 12px;
    border-radius: 999px;
    background: var(--tc-agri-light);
    border: 1px solid transparent;
    white-space: nowrap;
    transition: background .15s, border-color .15s, color .15s, transform .15s;
}

.tcag-seo-footer-col ul li a:hover,
.tcag-seo-footer-col ul li a.is-current {
    background: var(--tc-agri) !important;
    border-color: var(--tc-agri);
    color: #fff !important;
    transform: translateY(-1px);
}

.tcag-seo-footer-col ul li a .tcag-fnav-count {
    font-size: .72rem;
    color: var(--tc-agri-muted);
    margin-left: 0;
    flex-shrink: 0;
}

.tcag-seo-footer-col ul li a:hover .tcag-fnav-count,
.tcag-seo-footer-col ul li a.is-current .tcag-fnav-count {
    color: rgba(255,255,255,.85);
}

/* ── Responsive ── */
@media (max-width: 900px) {
    .tcag-seo-footer-cols { grid-template-columns: repeat(2, 1fr); gap: 24px; }
}
@media (max-width: 580px) {
    .tcag-seo-filters { padding: 12px 14px; gap: 8px; }
    .tcag-seo-filter-strip { gap: 5px; }
    .tcag-seo-bottom { padding: 20px 18px; }
    .tcag-seo-footer-nav { padding: 22px 16px 24px; border-radius: 18px; }
    .tcag-seo-footer-cols { grid-template-columns: 1fr; gap: 24px; }
}
