/* ═══════════════════════════════════════════════════
   TPT Category Design v3 — category.css
═══════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,700;0,900;1,400&family=DM+Sans:wght@300;400;500;600&display=swap');

.tpt-cat-page *, .tpt-cat-page *::before, .tpt-cat-page *::after { box-sizing: border-box; }
.tpt-cat-page { font-family: 'DM Sans', Arial, sans-serif; color: #1e1b27; background: #f0ede8; width: 100%; }
.tpt-cat-page a { text-decoration: none; }

/* Reset uniquement les marges/paddings navigateur — PAS font-size ni font-weight
   (Astra overriderait sinon). Chaque classe déclare ses propres valeurs typographiques. */
.tpt-cat-page h1,
.tpt-cat-page h2,
.tpt-cat-page h3,
.tpt-cat-page p { margin: 0 !important; padding: 0; }

/* Force le reset complet sur les classes TPT pour battre Astra */
.tpt-subcat-name,
.tpt-card-name,
.tpt-disc-name,
.tpt-section-title,
.tpt-perso-title,
.tpt-blog-title { font-size: revert; font-weight: revert; line-height: revert; }

/* ── BREADCRUMB ── */
.tpt-bc { background: #f0ede8; padding: 12px 40px; font-size: 11px; letter-spacing: 0.1em; color: #9990a5; text-transform: uppercase; border-bottom: 1px solid #e0dbd4; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.tpt-bc a { color: #9990a5; transition: color .2s; }
.tpt-bc a:hover { color: #768471; }
.tpt-bc-sep { color: #c8c2b8; }
.tpt-bc-current { color: #768471; }

/* ── HERO ── */
.tpt-cat-hero { background: #1e1b27; position: relative; overflow: hidden; }
.tpt-cat-hero-svg { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0.06; pointer-events: none; }
.tpt-cat-hero-inner { max-width: 1280px; margin: 0 auto; display: grid; grid-template-columns: 1fr 500px; align-items: center; min-height: 420px; position: relative; z-index: 2; padding: 0 40px; }
.tpt-cat-hero-text { padding: 60px 48px 60px 0; }
.tpt-cat-tag { display: inline-flex; align-items: center; gap: 8px; border: 1px solid rgba(168,184,163,0.4); background: rgba(118,132,113,0.15); color: #a8b8a3; font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; padding: 6px 18px; border-radius: 100px; margin-bottom: 24px; }
.tpt-cat-tag-dot { width: 5px; height: 5px; border-radius: 50%; background: #a8b8a3; flex-shrink: 0; }
.tpt-cat-title { font-family: 'Playfair Display', Georgia, serif; font-size: clamp(32px, 4vw, 52px); font-weight: 900; color: #f5f2ec; line-height: 1.08; letter-spacing: -0.02em; margin: 0 0 16px; }
.tpt-cat-title em { font-style: italic; color: #a8b8a3; }
.tpt-cat-desc { font-size: 15px; color: #9990a5; line-height: 1.8; font-weight: 300; max-width: 440px; margin-bottom: 32px; }
.tpt-cat-stats { display: flex; gap: 32px; }
.tpt-cat-stat-n { font-family: 'Playfair Display', serif; font-size: 28px; font-weight: 700; color: #f5f2ec; line-height: 1; }
.tpt-cat-stat-l { font-size: 11px; color: rgba(255,255,255,0.4); letter-spacing: 0.08em; text-transform: uppercase; margin-top: 4px; }
.tpt-cat-hero-imgs { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 8px; padding: 32px 0 32px 20px; height: 420px; }
.tpt-hero-img { border-radius: 10px; overflow: hidden; }
.tpt-hero-img a { display: block; height: 100%; }
.tpt-hero-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s; }
.tpt-hero-img:hover img { transform: scale(1.04); }
.tpt-hero-img:first-child { grid-row: 1 / 3; }

/* ── SOUS-CATÉGORIES ── */
.tpt-subcats { background: #f0ede8; padding: 40px 40px 16px; }
.tpt-subcats-row { display: flex; gap: 12px; max-width: 1100px; margin: 0 auto; flex-wrap: wrap; }
.tpt-subcat { flex: 1; min-width: 160px; max-width: 280px; border-radius: 14px; overflow: hidden; position: relative; height: 140px; cursor: pointer; display: block; }
.tpt-subcat img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s; }
.tpt-subcat:hover img { transform: scale(1.05); }
.tpt-subcat-placeholder { width: 100%; height: 100%; background: #2c3a2e; }
.tpt-subcat-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(30,27,39,0.88) 0%, rgba(30,27,39,0.2) 70%, transparent 100%); display: flex; align-items: flex-end; padding: 16px; }
.tpt-subcat-name { font-family: 'Playfair Display', serif !important; font-size: 15px !important; font-weight: 700 !important; color: #f5f2ec !important; line-height: 1.25 !important; }
.tpt-subcat-count { font-size: 11px !important; color: rgba(255,255,255,0.6) !important; margin-top: 2px !important; font-weight: 400 !important; }

/* ══ BARRE RECHERCHE ══ */
.tpt-search-bar { background: #f0ede8; padding: 24px 40px 0; }
.tpt-search-inner { max-width: 1100px; margin: 0 auto; }
.tpt-search-wrap {
    position: relative;
    display: flex;
    align-items: center;
    background: #fff;
    border: 1.5px solid #ddd8d2;
    border-radius: 10px;
    transition: border-color .2s, box-shadow .2s;
    overflow: hidden;
}
.tpt-search-wrap:focus-within {
    border-color: #768471;
    box-shadow: 0 0 0 3px rgba(118,132,113,0.12);
}
.tpt-search-icon {
    position: absolute;
    left: 16px;
    color: #9990a5;
    pointer-events: none;
    flex-shrink: 0;
}
.tpt-search-input {
    width: 100%;
    border: none;
    outline: none;
    background: transparent;
    font-family: 'DM Sans', Arial, sans-serif;
    font-size: 14px;
    color: #1e1b27;
    padding: 14px 44px 14px 44px;
}
.tpt-search-input::placeholder { color: #b0aaa5; }
.tpt-search-clear {
    position: absolute;
    right: 12px;
    width: 24px; height: 24px;
    border-radius: 50%;
    background: #e8e4df;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    color: #6b6560;
    transition: background .2s;
    flex-shrink: 0;
}
.tpt-search-clear:hover { background: #ddd8d2; }
/* Animation pendant la recherche */
.tpt-searching { opacity: 0.5; pointer-events: none; transition: opacity .2s; }

/* ── BARRE FILTRES ── */
.tpt-filters-bar { background: #f0ede8; padding: 16px 40px 20px; border-bottom: 1px solid #e0dbd4; position: sticky; top: 0; z-index: 100; }
.tpt-filters-inner { max-width: 1100px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.tpt-filters-left { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.tpt-filter-label { font-size: 11px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: #9990a5; }
.tpt-filter-btn { padding: 6px 14px; border: 1.5px solid #c8c2b8; border-radius: 100px; font-size: 12px; font-weight: 500; color: #6b6560; cursor: pointer; background: transparent; font-family: 'DM Sans', Arial, sans-serif; transition: all .2s; }
.tpt-filter-btn:hover { border-color: #1e1b27; color: #1e1b27; }
.tpt-filter-btn.active { background: #1e1b27; border-color: #1e1b27; color: #fff; }
.tpt-filters-right { display: flex; align-items: center; gap: 14px; }
.tpt-results-count { font-size: 12px; color: #9990a5; }
.tpt-view-toggle { display: flex; gap: 4px; }
.tpt-view-btn { width: 30px; height: 30px; border: 1.5px solid #c8c2b8; border-radius: 6px; background: transparent; cursor: pointer; font-size: 15px; color: #6b6560; display: flex; align-items: center; justify-content: center; transition: all .2s; }
.tpt-view-btn.active { background: #1e1b27; border-color: #1e1b27; color: #fff; }

/* ── GRILLE PRODUITS ── */
.tpt-products-main { max-width: 1180px; margin: 0 auto; padding: 32px 40px 60px; }
.tpt-grid { display: grid; gap: 16px; }
.tpt-grid-4 { grid-template-columns: repeat(4, 1fr); }
.tpt-grid-3 { grid-template-columns: repeat(3, 1fr); }
.tpt-skeleton { background: linear-gradient(90deg, #e8e4df 25%, #f0ede8 50%, #e8e4df 75%); background-size: 200% 100%; border-radius: 14px; height: 300px; animation: tpt-shimmer 1.5s infinite; }
@keyframes tpt-shimmer { 0%{ background-position: 200% 0; } 100%{ background-position: -200% 0; } }
.tpt-product-card { background: #fff; border-radius: 14px; overflow: hidden; box-shadow: 0 2px 14px rgba(42,37,32,.06); cursor: pointer; transition: transform .2s, box-shadow .2s; display: flex; flex-direction: column; color: inherit; height: 100%; }
.tpt-product-card:hover { transform: translateY(-4px); box-shadow: 0 8px 28px rgba(42,37,32,.12); }
.tpt-card-img { height: 260px; overflow: hidden; position: relative; flex-shrink: 0; background: #e8e4df; }
.tpt-card-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s; }
.tpt-card-img-placeholder { width: 100%; height: 100%; background: #e8e4df; }
.tpt-product-card:hover .tpt-card-img img { transform: scale(1.05); }
.tpt-card-badge { position: absolute; top: 10px; left: 10px; font-size: 9px !important; font-weight: 700 !important; letter-spacing: 0.12em; text-transform: uppercase; padding: 4px 12px; border-radius: 100px; }
.tpt-badge-perso { background: #2c3a2e; color: #a8b8a3 !important; }
.tpt-badge-best  { background: #768471; color: #fff !important; }
.tpt-card-body { padding: 14px 16px 16px; flex: 1; display: flex; flex-direction: column; }
/* min-height sur cat pour que le body soit aligné même quand cat est vide */
.tpt-card-cat { font-size: 9px !important; letter-spacing: 0.16em !important; text-transform: uppercase !important; color: #768471 !important; font-weight: 600 !important; margin-bottom: 5px !important; font-family: 'DM Sans', Arial, sans-serif !important; min-height: 16px !important; display: block; }
.tpt-card-name { font-family: 'Playfair Display', serif !important; font-size: 14px !important; font-weight: 700 !important; color: #1e1b27 !important; line-height: 1.3 !important; flex: 1; margin-bottom: 12px !important; }
.tpt-card-footer { display: flex; align-items: center; justify-content: space-between; margin-top: auto; }
.tpt-card-price { font-family: 'Playfair Display', serif !important; font-size: 16px !important; font-weight: 700 !important; color: #1e1b27 !important; }
.tpt-card-btn { background: #1e1b27; color: #fff; border: none; padding: 7px 14px; border-radius: 6px; font-size: 11px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; font-family: 'DM Sans', Arial, sans-serif; transition: background .2s; white-space: nowrap; }
.tpt-card-btn:hover { background: #768471; }
.tpt-no-results { grid-column: 1/-1; text-align: center; color: #9990a5; padding: 48px 0; font-size: 14px; }
.tpt-pagination { display: flex; justify-content: center; gap: 6px; margin-top: 44px; flex-wrap: wrap; align-items: center; }
.tpt-page-btn { width: 36px; height: 36px; border-radius: 6px; border: 1.5px solid #c8c2b8; background: transparent; color: #6b6560; font-size: 13px; cursor: pointer; font-family: 'DM Sans', Arial, sans-serif; transition: all .2s; }
.tpt-page-btn.active { background: #1e1b27; border-color: #1e1b27; color: #fff; }
.tpt-page-btn:hover:not(.active) { border-color: #1e1b27; color: #1e1b27; }
.tpt-page-ellipsis { color: #9990a5; line-height: 36px; }

/* ── CTA PERSONNALISÉ ── */
.tpt-perso-strip { background: #2c3a2e; padding: 48px 40px; }
.tpt-perso-inner { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 40px; }
.tpt-perso-eyebrow { font-size: 10px !important; letter-spacing: 0.2em; text-transform: uppercase; color: #a8b8a3; font-weight: 500 !important; margin-bottom: 10px; }
.tpt-perso-title { font-family: 'Playfair Display', serif !important; font-size: clamp(20px, 2.5vw, 28px) !important; font-weight: 700 !important; color: #f5f2ec !important; line-height: 1.2 !important; margin-bottom: 12px; }
.tpt-perso-desc { font-size: 14px !important; color: rgba(255,255,255,0.55) !important; line-height: 1.7 !important; font-weight: 300 !important; max-width: 520px; }
.tpt-perso-product { display: flex; align-items: center; gap: 10px; margin-top: 16px; }
.tpt-perso-product img { width: 48px; height: 48px; border-radius: 8px; object-fit: cover; border: 1px solid rgba(255,255,255,0.15); }
.tpt-perso-product span { font-size: 13px; color: rgba(255,255,255,0.6); font-weight: 300; }
.tpt-perso-btn { display: inline-block; background: #768471; color: #fff !important; font-size: 12px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; padding: 16px 36px; border-radius: 4px; white-space: nowrap; transition: all .25s; border: 2px solid #768471; }
.tpt-perso-btn:hover { background: transparent; color: #f5f2ec !important; border-color: #a8b8a3; }

/* ── BLOG ── */
.tpt-blog { background: #f0ede8; padding: 64px 40px; }
.tpt-section-header { text-align: center; margin-bottom: 40px; }
.tpt-eyebrow { font-size: 11px !important; letter-spacing: 0.22em !important; text-transform: uppercase !important; color: #768471; font-weight: 500 !important; margin-bottom: 10px; font-family: 'DM Sans', Arial, sans-serif !important; }
.tpt-section-title { font-family: 'Playfair Display', serif !important; font-size: clamp(22px, 3vw, 28px) !important; font-weight: 700 !important; color: #1e1b27; line-height: 1.2 !important; }
.tpt-divider { width: 44px; height: 2px; background: #768471; margin: 10px auto 0; border-radius: 2px; }
.tpt-blog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1100px; margin: 0 auto; }
.tpt-blog-skeleton { background: linear-gradient(90deg, #e8e4df 25%, #f0ede8 50%, #e8e4df 75%); background-size: 200% 100%; border-radius: 14px; height: 320px; animation: tpt-shimmer 1.5s infinite; }
.tpt-blog-card { background: #fff; border-radius: 14px; overflow: hidden; box-shadow: 0 2px 14px rgba(42,37,32,.06); display: flex; flex-direction: column; color: inherit; transition: transform .2s, box-shadow .2s; }
.tpt-blog-card:hover { transform: translateY(-3px); box-shadow: 0 8px 24px rgba(42,37,32,.1); }
.tpt-blog-img { height: 180px; overflow: hidden; flex-shrink: 0; background: #e8e4df; }
.tpt-blog-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s; }
.tpt-blog-img-placeholder { width: 100%; height: 100%; background: #e8e4df; }
.tpt-blog-card:hover .tpt-blog-img img { transform: scale(1.04); }
.tpt-blog-body { padding: 18px 20px 20px; flex: 1; display: flex; flex-direction: column; }
.tpt-blog-tag { display: inline-block; background: rgba(118,132,113,0.12); color: #768471; font-size: 9px !important; font-weight: 700 !important; letter-spacing: 0.14em; text-transform: uppercase; padding: 3px 10px; border-radius: 100px; margin-bottom: 8px; align-self: flex-start; }
.tpt-blog-date { font-size: 11px !important; color: #9990a5; margin-bottom: 8px; font-weight: 400 !important; }
.tpt-blog-title { font-family: 'Playfair Display', serif !important; font-size: 16px !important; font-weight: 700 !important; color: #1e1b27 !important; line-height: 1.3 !important; margin-bottom: 8px; }
.tpt-blog-excerpt { font-size: 13px !important; color: #6b6560; line-height: 1.65; font-weight: 300 !important; flex: 1; margin-bottom: 14px; }
.tpt-blog-read { font-size: 11px !important; font-weight: 600 !important; letter-spacing: 0.08em; text-transform: uppercase; color: #768471; margin-top: auto; }
.tpt-blog-all-link { display: inline-block; border: 1.5px solid #c8c2b8; color: #1e1b27; font-size: 12px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; padding: 12px 32px; border-radius: 4px; transition: all .2s; }
.tpt-blog-all-link:hover { background: #1e1b27; color: #fff; border-color: #1e1b27; }

/* ── DISCIPLINES ── */
.tpt-disciplines { background: #1e1b27; padding: 56px 40px; }
.tpt-disc-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; max-width: 1100px; margin: 0 auto; }
.tpt-disc-card { border-radius: 12px; overflow: hidden; position: relative; height: 120px; cursor: pointer; display: block; }
.tpt-disc-card img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s; }
.tpt-disc-card:hover img { transform: scale(1.06); }
.tpt-disc-placeholder { width: 100%; height: 100%; background: #2c3a2e; }
.tpt-disc-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(30,27,39,0.85) 0%, transparent 65%); display: flex; align-items: flex-end; padding: 12px; }
.tpt-disc-name { font-family: 'Playfair Display', serif !important; font-size: 13px !important; font-weight: 700 !important; color: #f5f2ec !important; line-height: 1.2 !important; }

/* ══ AVIS CLIENTS (Trustindex) ══ */
.tpt-reviews-section {
    background: #1e1b27;
    padding: 64px 40px;
}
.tpt-reviews-section .tpt-section-header { margin-bottom: 40px; }
.tpt-reviews-section .tpt-eyebrow { color: #a8b8a3; }
.tpt-reviews-section .tpt-section-title { color: #f5f2ec; }
.tpt-reviews-widget {
    max-width: 1100px;
    margin: 0 auto;
}

/*
 * Trustindex injecte son widget dans .trustindex-widget.
 * On neutralise les couleurs de fond pour qu'il s'intègre
 * sur notre fond sombre #1e1b27.
 * Ajuster si le widget Trustindex a un fond blanc intégré.
 */
.tpt-reviews-widget .ti-widget,
.tpt-reviews-widget .ti-widget-container {
    background: transparent !important;
}
/* Optionnel : force les textes en clair sur fond sombre */
.tpt-reviews-widget .ti-review-body,
.tpt-reviews-widget .ti-reviewer-name {
    color: #f5f2ec !important;
}

/* ══ SURFOOTER ACF ══ */
.tpt-surfooter {
    background: #f0ede8;
    padding: 64px 40px;
    border-top: 1px solid #e0dbd4;
}
.tpt-surfooter-inner {
    max-width: 900px;
    margin: 0 auto;
    font-size: 15px;
    color: #6b6560;
    line-height: 1.85;
    font-weight: 300;
}
/* Styles typographiques du contenu WYSIWYG */
.tpt-surfooter-inner h2 { font-family: 'Playfair Display', serif; font-size: clamp(22px, 2.5vw, 28px); font-weight: 700; color: #1e1b27; margin: 0 0 16px; line-height: 1.2; }
.tpt-surfooter-inner h3 { font-family: 'Playfair Display', serif; font-size: clamp(18px, 2vw, 22px); font-weight: 700; color: #1e1b27; margin: 32px 0 12px; }
.tpt-surfooter-inner p { margin-bottom: 16px; }
.tpt-surfooter-inner a { color: #768471; text-decoration: underline; text-underline-offset: 3px; }
.tpt-surfooter-inner a:hover { color: #1e1b27; }
.tpt-surfooter-inner ul, .tpt-surfooter-inner ol { padding-left: 24px; margin-bottom: 16px; }
.tpt-surfooter-inner li { margin-bottom: 6px; }
.tpt-surfooter-inner strong { font-weight: 600; color: #1e1b27; }

/* ══ RESPONSIVE ══ */
@media (max-width: 768px) {
    .tpt-bc { padding: 10px 20px; }
    .tpt-cat-hero-inner { grid-template-columns: 1fr !important; min-height: auto; padding: 0 20px; }
    .tpt-cat-hero-imgs { display: none; }
    .tpt-cat-hero-text { padding: 40px 0; }
    .tpt-subcats { padding: 24px 20px 12px; }
    .tpt-subcat { min-width: calc(50% - 6px); max-width: none; height: 110px; }
    .tpt-search-bar { padding: 20px 20px 0; }
    .tpt-filters-bar { padding: 12px 20px 16px; position: static; }
    .tpt-filters-inner { flex-direction: column; align-items: flex-start; gap: 10px; }
    .tpt-products-main { padding: 24px 20px 48px; }

    /* Grille 2 colonnes sur mobile, image plus généreuse */
    .tpt-grid-4, .tpt-grid-3 { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .tpt-card-img { height: 220px; }

    .tpt-perso-inner { grid-template-columns: 1fr !important; gap: 24px; }
    .tpt-perso-btn { display: block; text-align: center; }
    .tpt-blog { padding: 40px 20px; }
    .tpt-blog-grid { grid-template-columns: 1fr; }
    .tpt-disciplines { padding: 40px 20px; }
    .tpt-disc-grid { grid-template-columns: repeat(2, 1fr); }
    .tpt-surfooter { padding: 40px 20px; }
}
@media (max-width: 480px) {
    /* Sur très petit écran, on garde 2 colonnes mais on réduit légèrement l'image */
    .tpt-grid-4, .tpt-grid-3 { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .tpt-card-img { height: 180px; }
    .tpt-cat-stats { gap: 20px; }
}