/* ==========================================================================
   Kadence TV Landes — CSS principal
   Couleurs primaires extraites du JSON Elementor (Header #83) :
   - primary  #038CD5 (cyan vif)
   - accent   #0B1CF5 (bleu profond)
   - text     #020817 (dark slate)
   - white    #FFFFFF
   - light    #F8F9FA
   ========================================================================== */

:root {
  --tvl-primary:    #038CD5;
  --tvl-primary-2:  #0882AC;
  --tvl-accent:     #0B1CF5;
  --tvl-accent-dark: #0B1C64;
  --tvl-text:       #020817;
  --tvl-text-soft:  #4B5563;
  --tvl-border:     #E5E7EB;
  --tvl-bg-soft:    #F8F9FA;
  --tvl-bg-section: #EEF2FF;
  --tvl-white:      #FFFFFF;
  --tvl-shadow-sm:  0 1px 3px rgba(0,0,0,0.08);
  --tvl-shadow-md:  0 4px 16px rgba(0,0,0,0.10);
  --tvl-shadow-lg:  0 8px 32px rgba(0,0,0,0.15);
  --tvl-radius-sm:  6px;
  --tvl-radius-md:  10px;
  --tvl-radius-lg:  14px;
  --tvl-font:       'Inter', system-ui, -apple-system, sans-serif;
}

body {
  font-family: var(--tvl-font);
  color: var(--tvl-text);
}


/* ==========================================================================
   1. HEADER — Custom (top bar + main bar + menu + drawer mobile)
   ========================================================================== */

.skip-link {
  position: absolute;
  left: -9999px;
}
.skip-link:focus {
  left: 12px;
  top: 12px;
  z-index: 100000;
  background: #fff;
  padding: 10px 16px;
  border-radius: 6px;
}

.tvl-site-header {
  position: relative;
  z-index: 99;
}

/* Top bar : gradient bleu, date à gauche, social à droite */
.tvl-header-topbar {
  background: linear-gradient(135deg, var(--tvl-primary) 0%, var(--tvl-accent) 100%);
  color: #fff;
}
.tvl-header-topbar-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 12px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 13px;
  font-weight: 600;
}
.tvl-header-date {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: rgba(255,255,255,0.95);
}
.tvl-header-date::first-letter { text-transform: uppercase; }
.tvl-header-social {
  display: flex;
  align-items: center;
  gap: 14px;
}
.tvl-social-icon {
  color: rgba(255,255,255,0.9);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  transition: transform 0.15s, color 0.15s;
  font-size: 14px;
}
.tvl-social-icon:hover { transform: scale(1.1); color: #fff; }

/* Main bar : logo + menu + actions */
.tvl-header-main {
  background: #fff;
  box-shadow: 0 3px 16px rgba(15, 23, 62, 0.08);
  position: sticky;
  top: 0;
  z-index: 99;
}
.tvl-header-main-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 16px 24px;
  display: flex;
  align-items: center;
  gap: 32px;
}
.tvl-header-logo {
  flex-shrink: 0;
}
.tvl-header-logo img,
.tvl-header-logo .custom-logo {
  max-width: 124px;
  height: auto;
  display: block;
}
.tvl-header-logo-fallback {
  font-size: 20px;
  font-weight: 800;
  color: var(--tvl-primary);
  text-decoration: none;
}

/* Menu desktop */
.tvl-header-nav {
  flex: 1;
  display: flex;
  justify-content: center;
}
.tvl-menu {
  display: flex;
  align-items: center;
  gap: 4px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.tvl-menu li {
  position: relative;
}
.tvl-menu a {
  display: block;
  padding: 10px 14px;
  color: var(--tvl-text);
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  border-radius: var(--tvl-radius-sm);
  transition: color 0.15s, background 0.15s;
  white-space: nowrap;
}
.tvl-menu a:hover,
.tvl-menu .current-menu-item > a,
.tvl-menu .current_page_item > a {
  color: var(--tvl-primary);
}
/* Flèche pour les items avec sous-menu */
.tvl-menu .menu-item-has-children > a::after {
  content: '';
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-left: 6px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  vertical-align: middle;
  opacity: 0.6;
}
/* Sous-menus */
.tvl-menu .sub-menu {
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 220px;
  background: #fff;
  box-shadow: var(--tvl-shadow-md);
  border-radius: var(--tvl-radius-sm);
  list-style: none;
  margin: 0;
  padding: 8px 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity 0.15s, transform 0.15s, visibility 0.15s;
  z-index: 100;
}
.tvl-menu li:hover > .sub-menu,
.tvl-menu li:focus-within > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.tvl-menu .sub-menu a {
  padding: 8px 18px;
  font-size: 14px;
  border-radius: 0;
}
.tvl-menu .sub-menu a:hover {
  background: var(--tvl-bg-soft);
}
/* Sous-sous-menus (niveau 3) */
.tvl-menu .sub-menu .sub-menu {
  top: 0;
  left: 100%;
}

/* Actions header */
.tvl-header-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.tvl-search-toggle,
.tvl-bell-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: transparent;
  border: none;
  color: var(--tvl-primary);
  cursor: pointer;
  font-size: 22px;
  border-radius: var(--tvl-radius-sm);
  transition: background 0.15s, color 0.15s;
  text-decoration: none;
}
.tvl-search-toggle:hover,
.tvl-bell-link:hover {
  background: rgba(3, 140, 213, 0.08);
  color: var(--tvl-accent);
}

/* Reset renforcé : Kadence applique ses propres styles aux <button>.
   Spécificité button.classe (0,1,1) pour battre les règles Kadence sur button. */
button.tvl-search-toggle {
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  border: none;
  padding: 0;
  margin: 0;
  box-shadow: none;
  color: var(--tvl-primary);
  line-height: 1;
}
button.tvl-search-toggle:hover {
  background: rgba(3, 140, 213, 0.08);
  color: var(--tvl-accent);
}
/* Forcer la couleur de l'icône directement (au cas où Kadence override le color du bouton,
   currentColor deviendrait faux). background-color explicite = icône toujours visible. */
.tvl-search-toggle .tvl-icon-search { background-color: var(--tvl-primary); }
.tvl-search-toggle:hover .tvl-icon-search { background-color: var(--tvl-accent); }

/* Hamburger */
.tvl-burger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 40px;
  height: 40px;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 8px;
}
.tvl-burger span {
  display: block;
  height: 2px;
  width: 100%;
  background: var(--tvl-primary);
  border-radius: 2px;
  transition: transform 0.2s, opacity 0.2s;
}

/* Drawer mobile */
.tvl-mobile-drawer {
  position: fixed;
  inset: 0;
  z-index: 9998;
}
.tvl-mobile-drawer[hidden] { display: none; }
.tvl-mobile-drawer-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(2,8,23,0.6);
}
.tvl-mobile-drawer-panel {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(320px, 85vw);
  background: #fff;
  overflow-y: auto;
  padding: 0 0 24px;
  box-shadow: -4px 0 24px rgba(0,0,0,0.15);
  animation: tvl-drawer-in 0.25s ease;
}
@keyframes tvl-drawer-in {
  from { transform: translateX(100%); }
  to { transform: translateX(0); }
}
.tvl-mobile-drawer-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  border-bottom: 1px solid var(--tvl-border);
}
.tvl-mobile-drawer-title {
  font-size: 18px;
  font-weight: 800;
  color: var(--tvl-text);
}
.tvl-mobile-drawer-close,
button.tvl-mobile-drawer-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  -webkit-appearance: none;
  appearance: none;
  background: var(--tvl-primary);
  border: none;
  border-radius: var(--tvl-radius-sm);
  padding: 0;
  margin: 0;
  box-shadow: none;
  font-size: 24px;
  line-height: 1;
  color: #fff;
  cursor: pointer;
}
.tvl-mobile-menu {
  list-style: none;
  margin: 0;
  padding: 8px 0;
}
.tvl-mobile-menu li { border-bottom: 1px solid var(--tvl-bg-soft); }
.tvl-mobile-menu a {
  display: block;
  padding: 14px 24px;
  color: var(--tvl-text);
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
}
.tvl-mobile-menu a:hover { background: var(--tvl-bg-soft); color: var(--tvl-primary); }
.tvl-mobile-menu .sub-menu {
  list-style: none;
  margin: 0;
  padding: 0;
  background: var(--tvl-bg-soft);
}
.tvl-mobile-menu .sub-menu a {
  padding-left: 40px;
  font-size: 14px;
  font-weight: 500;
}
.tvl-mobile-menu .sub-menu .sub-menu a { padding-left: 56px; }

/* Bouton chevron injecté par JS pour les sous-menus mobiles */
.tvl-mobile-menu .menu-item-has-children {
  position: relative;
}
.tvl-mobile-submenu-toggle {
  position: absolute;
  top: 0;
  right: 0;
  width: 52px;
  height: 48px;
  background: transparent;
  border: none;
  border-left: 1px solid var(--tvl-bg-soft);
  font-size: 22px;
  line-height: 1;
  color: var(--tvl-primary);
  cursor: pointer;
}


/* ==========================================================================
   1b. FOOTER — Custom (fond bleu, logo, social, 4 colonnes, copyright)
   ========================================================================== */

.tvl-site-footer {
  background: linear-gradient(135deg, var(--tvl-primary) 0%, var(--tvl-accent) 50%, var(--tvl-accent-dark, #0B1C64) 100%);
  color: rgba(255,255,255,0.85);
}
.tvl-footer-container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 24px;
  box-sizing: border-box;
}
.tvl-footer-main {
  padding: 56px 0 40px;
  display: block;
}
.tvl-footer-main .tvl-footer-container {
  display: grid;
  grid-template-columns: 1.3fr 2.7fr;
  gap: 48px;
}

/* Brand */
.tvl-footer-brand { max-width: 360px; }
.tvl-footer-logo {
  display: inline-block;
  margin-bottom: 16px;
}
.tvl-footer-logo img {
  max-width: 140px;
  height: auto;
  display: block;
}
.tvl-footer-desc {
  font-size: 14px;
  line-height: 1.6;
  color: rgba(255,255,255,0.7);
  margin: 0 0 20px;
}
.tvl-footer-social {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.tvl-footer-social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: rgba(255,255,255,0.1);
  color: #fff;
  font-size: 16px;
  transition: background 0.15s, transform 0.15s;
}
.tvl-footer-social a:hover {
  background: var(--tvl-primary);
  transform: translateY(-2px);
}

/* Colonnes */
.tvl-footer-cols {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}
.tvl-footer-col { min-width: 0; }
.tvl-footer-col-title {
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  margin: 0 0 16px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.tvl-footer-col-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.tvl-footer-col-list a {
  color: rgba(255,255,255,0.7);
  font-size: 14px;
  text-decoration: none;
  transition: color 0.15s;
}
.tvl-footer-col-list a:hover { color: #fff; }
.tvl-footer-contact li {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.tvl-footer-contact-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: rgba(255,255,255,0.45);
  font-weight: 600;
}
.tvl-footer-contact span:not(.tvl-footer-contact-label) {
  font-size: 14px;
  color: rgba(255,255,255,0.7);
}

/* Copyright */
.tvl-footer-bottom {
  border-top: 1px solid rgba(255,255,255,0.12);
  padding: 20px 0;
}
.tvl-footer-copyright {
  margin: 0;
  font-size: 13px;
  color: rgba(255,255,255,0.55);
  text-align: center;
}


/* ==========================================================================
   1c. RESPONSIVE HEADER + FOOTER
   ========================================================================== */

@media (max-width: 992px) {
  .tvl-header-nav { display: none; }
  .tvl-burger { display: flex; }
  .tvl-header-main-inner { gap: 16px; }
  .tvl-header-logo { flex: 1; }

  .tvl-footer-main .tvl-footer-container {
    grid-template-columns: 1fr;
    gap: 36px;
  }
  .tvl-footer-brand { max-width: none; }
}

@media (max-width: 768px) {
  .tvl-footer-cols { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 480px) {
  .tvl-footer-cols { grid-template-columns: 1fr; }
  .tvl-header-topbar-inner { padding: 8px 16px; }
  .tvl-header-main-inner { padding: 12px 16px; }
  .tvl-footer-container { padding: 0 16px; }
}


/* ==========================================================================
   2. SEARCH OVERLAY — Plein écran
   ========================================================================== */

.tvl-search-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-top: 12vh;
}
.tvl-search-overlay[hidden] { display: none; }

.tvl-search-overlay-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(2, 8, 23, 0.92);
  backdrop-filter: blur(8px);
}

.tvl-search-overlay-inner {
  position: relative;
  width: 100%;
  max-width: 720px;
  padding: 0 24px;
}

.tvl-search-overlay-close {
  position: absolute;
  top: -56px;
  right: 24px;
  width: 44px;
  height: 44px;
  background: transparent;
  border: 2px solid rgba(255,255,255,0.4);
  border-radius: 50%;
  color: #fff;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}
.tvl-search-overlay-close:hover {
  background: rgba(255,255,255,0.1);
  border-color: #fff;
}

.tvl-search-overlay-form {
  display: flex;
  gap: 12px;
  align-items: center;
}

.tvl-search-overlay-input {
  flex: 1;
  background: rgba(255,255,255,0.05);
  border: 2px solid rgba(255,255,255,0.3);
  border-radius: var(--tvl-radius-md);
  padding: 16px 20px;
  color: #fff;
  font-size: 18px;
  font-family: var(--tvl-font);
  font-weight: 600;
  outline: none;
  transition: border-color 0.15s;
}
.tvl-search-overlay-input::placeholder { color: rgba(255,255,255,0.6); }
.tvl-search-overlay-input:focus { border-color: var(--tvl-primary); }

.tvl-search-overlay-submit {
  width: 56px;
  height: 56px;
  background: var(--tvl-primary);
  border: none;
  border-radius: var(--tvl-radius-md);
  color: #fff;
  font-size: 20px;
  cursor: pointer;
  transition: background 0.15s;
}
.tvl-search-overlay-submit:hover { background: var(--tvl-accent); }


/* ==========================================================================
   3. ICÔNES INLINE — SVG via classes utilitaires
   ========================================================================== */

.tvl-icon-clock,
.tvl-icon-facebook,
.tvl-icon-instagram,
.tvl-icon-linkedin,
.tvl-icon-youtube,
.tvl-icon-search,
.tvl-icon-bell,
.tvl-icon-x,
.tvl-icon-threads {
  display: inline-block;
  width: 1em;
  height: 1em;
  background-color: currentColor;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: contain;
          mask-size: contain;
  vertical-align: -0.125em;
}

/* Icônes encodées en SVG inline mask (gratuit, no FontAwesome dependency) */
.tvl-icon-clock     { -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'><path d='M12 2a10 10 0 100 20 10 10 0 000-20zm0 18a8 8 0 110-16 8 8 0 010 16zm.5-13H11v6l5.25 3.15.75-1.23-4.5-2.67V7z'/></svg>"); mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'><path d='M12 2a10 10 0 100 20 10 10 0 000-20zm0 18a8 8 0 110-16 8 8 0 010 16zm.5-13H11v6l5.25 3.15.75-1.23-4.5-2.67V7z'/></svg>"); }

.tvl-icon-facebook  { -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'><path d='M22 12.07C22 6.51 17.52 2 12 2S2 6.51 2 12.07c0 5.02 3.66 9.18 8.44 9.93v-7.02H7.9v-2.91h2.54V9.85c0-2.51 1.49-3.89 3.77-3.89 1.09 0 2.24.2 2.24.2v2.47h-1.26c-1.24 0-1.63.77-1.63 1.56v1.88h2.78l-.45 2.91h-2.33V22c4.78-.75 8.44-4.91 8.44-9.93z'/></svg>"); mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'><path d='M22 12.07C22 6.51 17.52 2 12 2S2 6.51 2 12.07c0 5.02 3.66 9.18 8.44 9.93v-7.02H7.9v-2.91h2.54V9.85c0-2.51 1.49-3.89 3.77-3.89 1.09 0 2.24.2 2.24.2v2.47h-1.26c-1.24 0-1.63.77-1.63 1.56v1.88h2.78l-.45 2.91h-2.33V22c4.78-.75 8.44-4.91 8.44-9.93z'/></svg>"); }

.tvl-icon-instagram { -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'><path d='M12 2.2c3.2 0 3.6 0 4.85.07 1.17.05 1.8.25 2.22.42.56.22.96.48 1.38.9.42.42.68.82.9 1.38.17.42.37 1.05.42 2.22.06 1.26.07 1.64.07 4.84s-.01 3.58-.07 4.85c-.05 1.17-.25 1.8-.42 2.22-.22.56-.48.96-.9 1.38-.42.42-.82.68-1.38.9-.42.17-1.05.37-2.22.42-1.26.06-1.64.07-4.85.07s-3.58-.01-4.85-.07c-1.17-.05-1.8-.25-2.22-.42-.56-.22-.96-.48-1.38-.9-.42-.42-.68-.82-.9-1.38-.17-.42-.37-1.05-.42-2.22C2.21 15.6 2.2 15.2 2.2 12s.01-3.58.07-4.85c.05-1.17.25-1.8.42-2.22.22-.56.48-.96.9-1.38.42-.42.82-.68 1.38-.9.42-.17 1.05-.37 2.22-.42C8.42 2.21 8.8 2.2 12 2.2zm0 1.8c-3.16 0-3.5 0-4.74.06-1.06.05-1.64.22-2.02.37-.51.2-.87.43-1.26.82-.39.39-.62.75-.82 1.26-.15.38-.32.96-.37 2.02C2.73 9.78 2.72 10.12 2.72 13.28s.01 3.5.06 4.74c.05 1.06.22 1.64.37 2.02.2.51.43.87.82 1.26.39.39.75.62 1.26.82.38.15.96.32 2.02.37 1.24.06 1.58.06 4.74.06s3.5 0 4.74-.06c1.06-.05 1.64-.22 2.02-.37.51-.2.87-.43 1.26-.82.39-.39.62-.75.82-1.26.15-.38.32-.96.37-2.02.06-1.24.06-1.58.06-4.74s-.01-3.5-.06-4.74c-.05-1.06-.22-1.64-.37-2.02-.2-.51-.43-.87-.82-1.26-.39-.39-.75-.62-1.26-.82-.38-.15-.96-.32-2.02-.37C15.5 4 15.16 4 12 4zm0 3.06A4.94 4.94 0 1116.94 12 4.94 4.94 0 0112 7.06zm0 8.14A3.2 3.2 0 108.8 12 3.2 3.2 0 0012 15.2zm6.4-8.34a1.15 1.15 0 11-1.15-1.15 1.15 1.15 0 011.15 1.15z'/></svg>"); mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'><path d='M12 2.2c3.2 0 3.6 0 4.85.07 1.17.05 1.8.25 2.22.42.56.22.96.48 1.38.9.42.42.68.82.9 1.38.17.42.37 1.05.42 2.22.06 1.26.07 1.64.07 4.84s-.01 3.58-.07 4.85c-.05 1.17-.25 1.8-.42 2.22-.22.56-.48.96-.9 1.38-.42.42-.82.68-1.38.9-.42.17-1.05.37-2.22.42-1.26.06-1.64.07-4.85.07s-3.58-.01-4.85-.07c-1.17-.05-1.8-.25-2.22-.42-.56-.22-.96-.48-1.38-.9-.42-.42-.68-.82-.9-1.38-.17-.42-.37-1.05-.42-2.22C2.21 15.6 2.2 15.2 2.2 12s.01-3.58.07-4.85c.05-1.17.25-1.8.42-2.22.22-.56.48-.96.9-1.38.42-.42.82-.68 1.38-.9.42-.17 1.05-.37 2.22-.42C8.42 2.21 8.8 2.2 12 2.2zm0 3.06A4.94 4.94 0 1116.94 12 4.94 4.94 0 0112 7.06zm0 8.14A3.2 3.2 0 108.8 12 3.2 3.2 0 0012 15.2zm6.4-8.34a1.15 1.15 0 11-1.15-1.15 1.15 1.15 0 011.15 1.15z'/></svg>"); }

.tvl-icon-linkedin  { -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'><path d='M19 3a2 2 0 012 2v14a2 2 0 01-2 2H5a2 2 0 01-2-2V5a2 2 0 012-2h14zM8.5 18v-8h-2.5v8h2.5zM7.25 8.5a1.5 1.5 0 110-3 1.5 1.5 0 010 3zM18 18v-4.5c0-2-1-3-2.6-3-1.4 0-2 .8-2.4 1.4V10H10.5v8H13v-4.3c0-1 .2-2 1.4-2 1.2 0 1.1 1.1 1.1 2V18H18z'/></svg>"); mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'><path d='M19 3a2 2 0 012 2v14a2 2 0 01-2 2H5a2 2 0 01-2-2V5a2 2 0 012-2h14zM8.5 18v-8h-2.5v8h2.5zM7.25 8.5a1.5 1.5 0 110-3 1.5 1.5 0 010 3zM18 18v-4.5c0-2-1-3-2.6-3-1.4 0-2 .8-2.4 1.4V10H10.5v8H13v-4.3c0-1 .2-2 1.4-2 1.2 0 1.1 1.1 1.1 2V18H18z'/></svg>"); }

.tvl-icon-youtube   { -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'><path d='M23.5 6.2s-.2-1.6-.9-2.3c-.9-.9-1.9-.9-2.4-1C16.8 2.6 12 2.6 12 2.6s-4.8 0-8.2.3c-.5.1-1.5.1-2.4 1-.7.7-.9 2.3-.9 2.3S0 8.1 0 10v1.9c0 1.9.3 3.8.3 3.8s.2 1.6.9 2.3c.9.9 2.1.9 2.6 1 1.9.2 8.2.3 8.2.3s4.8 0 8.2-.3c.5-.1 1.5-.1 2.4-1 .7-.7.9-2.3.9-2.3s.3-1.9.3-3.8V10c0-1.9-.3-3.8-.3-3.8zM9.5 14V8l6.2 3-6.2 3z'/></svg>"); mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'><path d='M23.5 6.2s-.2-1.6-.9-2.3c-.9-.9-1.9-.9-2.4-1C16.8 2.6 12 2.6 12 2.6s-4.8 0-8.2.3c-.5.1-1.5.1-2.4 1-.7.7-.9 2.3-.9 2.3S0 8.1 0 10v1.9c0 1.9.3 3.8.3 3.8s.2 1.6.9 2.3c.9.9 2.1.9 2.6 1 1.9.2 8.2.3 8.2.3s4.8 0 8.2-.3c.5-.1 1.5-.1 2.4-1 .7-.7.9-2.3.9-2.3s.3-1.9.3-3.8V10c0-1.9-.3-3.8-.3-3.8zM9.5 14V8l6.2 3-6.2 3z'/></svg>"); }

.tvl-icon-search    { -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'><path d='M15.5 14h-.79l-.28-.27a6.5 6.5 0 10-.7.7l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0A4.5 4.5 0 1114 9.5 4.5 4.5 0 019.5 14z'/></svg>"); mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'><path d='M15.5 14h-.79l-.28-.27a6.5 6.5 0 10-.7.7l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0A4.5 4.5 0 1114 9.5 4.5 4.5 0 019.5 14z'/></svg>"); }

.tvl-icon-bell      { -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'><path d='M12 22a2 2 0 002-2h-4a2 2 0 002 2zm6-6V11c0-3.07-1.64-5.64-4.5-6.32V4a1.5 1.5 0 00-3 0v.68C7.63 5.36 6 7.92 6 11v5l-2 2v1h16v-1l-2-2z'/></svg>"); mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'><path d='M12 22a2 2 0 002-2h-4a2 2 0 002 2zm6-6V11c0-3.07-1.64-5.64-4.5-6.32V4a1.5 1.5 0 00-3 0v.68C7.63 5.36 6 7.92 6 11v5l-2 2v1h16v-1l-2-2z'/></svg>"); }

.tvl-icon-x         { -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'><path d='M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z'/></svg>"); mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'><path d='M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z'/></svg>"); }

.tvl-icon-threads   { -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'><path d='M17.6 11.5c-.1-.05-.16-.1-.24-.13-.13-2.4-1.46-3.77-3.7-3.79-1.34-.01-2.46.56-3.15 1.6l1.23.84c.51-.78 1.32-.94 1.91-.94.74.01 1.31.22 1.66.64.26.3.43.72.51 1.24-.66-.11-1.36-.15-2.1-.1-2.1.12-3.46 1.34-3.37 3.04.05.86.48 1.61 1.21 2.1.62.42 1.43.62 2.27.57 1.11-.06 1.99-.48 2.6-1.26.46-.59.76-1.36.88-2.32.51.31.89.71 1.1 1.2.36.83.39 2.18-.72 3.29-.97.97-2.14 1.38-3.91 1.4-1.96-.02-3.45-.65-4.42-1.86-.91-1.14-1.38-2.78-1.4-4.88.02-2.11.49-3.74 1.4-4.88.97-1.22 2.46-1.84 4.42-1.86 1.97.02 3.48.65 4.49 1.88.5.6.87 1.36 1.13 2.25l1.55-.43c-.31-1.07-.78-2.01-1.42-2.78C16.55 4.36 14.65 3.5 12.18 3.5h-.02c-2.46.02-4.36.89-5.62 2.6C5.42 7.64 4.86 9.61 4.83 12c.02 2.39.58 4.35 1.7 5.91 1.27 1.7 3.16 2.58 5.62 2.6h.02c2.17-.02 3.7-.6 4.97-1.86 1.66-1.66 1.6-3.74 1.06-5.01-.39-.91-1.14-1.65-2.18-2.14z'/></svg>"); mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'><path d='M17.6 11.5c-.1-.05-.16-.1-.24-.13-.13-2.4-1.46-3.77-3.7-3.79-1.34-.01-2.46.56-3.15 1.6l1.23.84c.51-.78 1.32-.94 1.91-.94.74.01 1.31.22 1.66.64.26.3.43.72.51 1.24-.66-.11-1.36-.15-2.1-.1-2.1.12-3.46 1.34-3.37 3.04.05.86.48 1.61 1.21 2.1.62.42 1.43.62 2.27.57 1.11-.06 1.99-.48 2.6-1.26.46-.59.76-1.36.88-2.32.51.31.89.71 1.1 1.2.36.83.39 2.18-.72 3.29-.97.97-2.14 1.38-3.91 1.4-1.96-.02-3.45-.65-4.42-1.86-.91-1.14-1.38-2.78-1.4-4.88.02-2.11.49-3.74 1.4-4.88.97-1.22 2.46-1.84 4.42-1.86 1.97.02 3.48.65 4.49 1.88.5.6.87 1.36 1.13 2.25l1.55-.43c-.31-1.07-.78-2.01-1.42-2.78C16.55 4.36 14.65 3.5 12.18 3.5h-.02c-2.46.02-4.36.89-5.62 2.6C5.42 7.64 4.86 9.61 4.83 12c.02 2.39.58 4.35 1.7 5.91 1.27 1.7 3.16 2.58 5.62 2.6h.02c2.17-.02 3.7-.6 4.97-1.86 1.66-1.66 1.6-3.74 1.06-5.01-.39-.91-1.14-1.65-2.18-2.14z'/></svg>"); }


/* ==========================================================================
   4. RESPONSIVE
   ========================================================================== */

@media (max-width: 768px) {
  .tvl-header-topbar { padding: 10px 16px; font-size: 12px; }
  .tvl-header-social { gap: 12px; }
  .tvl-social-icon { width: 22px; height: 22px; font-size: 12px; }
  .tvl-search-overlay-inner { padding: 0 16px; }
  .tvl-search-overlay-close { top: -48px; right: 16px; }
  .tvl-search-overlay-input { font-size: 16px; padding: 14px 16px; }
  .tvl-search-overlay-submit { width: 48px; height: 48px; }
}


/* ==========================================================================
   5. SINGLE POST — Article template
   ========================================================================== */

.tvl-container {
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  padding: 0 24px;
  box-sizing: border-box;
}

.tvl-single {
  background: var(--tvl-white);
}

/* 5.1 Header (catégories + titre) */
.tvl-single-header {
  padding: 40px 0 24px;
}
.tvl-single-categories {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}
.tvl-cat-pill {
  display: inline-block;
  padding: 4px 12px;
  background: var(--tvl-primary);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 4px;
  transition: background 0.15s;
}
.tvl-cat-pill:hover {
  background: var(--tvl-accent);
  color: #fff;
}
.tvl-single-title {
  font-size: clamp(28px, 4vw, 42px);
  font-weight: 800;
  line-height: 1.15;
  color: var(--tvl-text);
  margin: 0 0 8px;
}

/* 5.2 Featured image */
.tvl-single-featured {
  margin: 0 auto 32px;
  max-width: 1200px;
  padding: 0 24px;
}
.tvl-single-featured-img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--tvl-radius-md);
  box-shadow: var(--tvl-shadow-md);
}

/* 5.3 Byline */
.tvl-single-meta {
  padding: 0 0 32px;
}
.tvl-byline {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  font-size: 14px;
  color: var(--tvl-text-soft);
}
.tvl-byline-author {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: var(--tvl-text);
  transition: color 0.15s;
}
.tvl-byline-author:hover { color: var(--tvl-primary); }
.tvl-byline-avatar {
  width: 36px !important;
  height: 36px !important;
  border-radius: 50%;
  object-fit: cover;
}
.tvl-byline-name { font-weight: 600; }
.tvl-byline-sep { color: var(--tvl-border); }
.tvl-byline-date { display: inline-flex; align-items: center; gap: 6px; }
.tvl-byline-reading { font-style: italic; }

/* 5.4 Content */
.tvl-single-content {
  padding: 0 0 48px;
  font-size: 17px;
  line-height: 1.75;
  color: var(--tvl-text);
}
.tvl-single-content p { margin: 0 0 1.4em; }
.tvl-single-content h2 {
  font-size: 28px;
  font-weight: 800;
  margin: 2em 0 0.6em;
  line-height: 1.25;
}
.tvl-single-content h3 {
  font-size: 22px;
  font-weight: 700;
  margin: 1.6em 0 0.6em;
}
.tvl-single-content img {
  max-width: 100%;
  height: auto;
  border-radius: var(--tvl-radius-sm);
  margin: 1.5em 0;
}
.tvl-single-content a {
  color: var(--tvl-primary);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
.tvl-single-content blockquote {
  border-left: 4px solid var(--tvl-primary);
  padding: 12px 0 12px 24px;
  margin: 1.5em 0;
  font-style: italic;
  color: var(--tvl-text-soft);
}

/* 5.5 Divider + Terms */
.tvl-single-divider hr {
  border: none;
  border-top: 1px solid var(--tvl-border);
  margin: 0;
}
.tvl-single-terms {
  padding: 24px 0;
  font-size: 14px;
  color: var(--tvl-text-soft);
}
.tvl-terms-label { font-weight: 700; margin-right: 8px; }
.tvl-term-link {
  color: var(--tvl-primary);
  text-decoration: none;
}
.tvl-term-link:hover { text-decoration: underline; }


/* ==========================================================================
   6. SHARE BUTTONS — 13 boutons
   ========================================================================== */

.tvl-single-share {
  padding: 24px 0 40px;
}
.tvl-share-title {
  font-size: 18px;
  font-weight: 700;
  margin: 0 0 16px;
  color: var(--tvl-text);
}
.tvl-share-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.tvl-share-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--tvl-share-color, #038CD5);
  color: #fff;
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition: transform 0.15s, box-shadow 0.15s, opacity 0.15s;
  font-size: 16px;
  padding: 0;
}
.tvl-share-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.18);
}
.tvl-share-btn-icon {
  width: 18px;
  height: 18px;
  display: inline-block;
  background-color: #fff;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: contain;
          mask-size: contain;
}

/* Icônes des boutons share */
.tvl-share-icon-whatsapp  { -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M17.47 14.38c-.28-.14-1.66-.82-1.91-.91-.26-.1-.45-.14-.63.14-.19.28-.72.91-.89 1.1-.16.19-.33.21-.61.07-.28-.14-1.19-.44-2.27-1.4-.84-.75-1.4-1.67-1.57-1.95-.16-.28-.02-.43.12-.57.13-.13.28-.33.42-.49.14-.16.19-.28.28-.47.09-.19.05-.35-.02-.49-.07-.14-.63-1.51-.86-2.07-.23-.55-.46-.48-.63-.48l-.54-.01c-.19 0-.49.07-.74.35-.26.28-.97.95-.97 2.31 0 1.36.99 2.68 1.13 2.87.14.19 1.95 2.98 4.72 4.18.66.28 1.18.45 1.58.58.66.21 1.26.18 1.74.11.53-.08 1.66-.68 1.89-1.34.23-.66.23-1.22.16-1.34-.07-.12-.26-.19-.54-.33zM12 2A10 10 0 0 0 2 12c0 1.78.47 3.45 1.28 4.9L2 22l5.25-1.37A10 10 0 1 0 12 2z'/></svg>"); mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M17.47 14.38c-.28-.14-1.66-.82-1.91-.91-.26-.1-.45-.14-.63.14-.19.28-.72.91-.89 1.1-.16.19-.33.21-.61.07-.28-.14-1.19-.44-2.27-1.4-.84-.75-1.4-1.67-1.57-1.95-.16-.28-.02-.43.12-.57.13-.13.28-.33.42-.49.14-.16.19-.28.28-.47.09-.19.05-.35-.02-.49-.07-.14-.63-1.51-.86-2.07-.23-.55-.46-.48-.63-.48l-.54-.01c-.19 0-.49.07-.74.35-.26.28-.97.95-.97 2.31 0 1.36.99 2.68 1.13 2.87.14.19 1.95 2.98 4.72 4.18.66.28 1.18.45 1.58.58.66.21 1.26.18 1.74.11.53-.08 1.66-.68 1.89-1.34.23-.66.23-1.22.16-1.34-.07-.12-.26-.19-.54-.33zM12 2A10 10 0 0 0 2 12c0 1.78.47 3.45 1.28 4.9L2 22l5.25-1.37A10 10 0 1 0 12 2z'/></svg>"); }
.tvl-share-icon-facebook  { -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M22 12.07C22 6.51 17.52 2 12 2S2 6.51 2 12.07c0 5.02 3.66 9.18 8.44 9.93v-7.02H7.9v-2.91h2.54V9.85c0-2.51 1.49-3.89 3.77-3.89 1.09 0 2.24.2 2.24.2v2.47h-1.26c-1.24 0-1.63.77-1.63 1.56v1.88h2.78l-.45 2.91h-2.33V22c4.78-.75 8.44-4.91 8.44-9.93z'/></svg>"); mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M22 12.07C22 6.51 17.52 2 12 2S2 6.51 2 12.07c0 5.02 3.66 9.18 8.44 9.93v-7.02H7.9v-2.91h2.54V9.85c0-2.51 1.49-3.89 3.77-3.89 1.09 0 2.24.2 2.24.2v2.47h-1.26c-1.24 0-1.63.77-1.63 1.56v1.88h2.78l-.45 2.91h-2.33V22c4.78-.75 8.44-4.91 8.44-9.93z'/></svg>"); }
.tvl-share-icon-linkedin  { -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M19 3a2 2 0 012 2v14a2 2 0 01-2 2H5a2 2 0 01-2-2V5a2 2 0 012-2h14zM8.5 18v-8h-2.5v8h2.5zM7.25 8.5a1.5 1.5 0 110-3 1.5 1.5 0 010 3zM18 18v-4.5c0-2-1-3-2.6-3-1.4 0-2 .8-2.4 1.4V10H10.5v8H13v-4.3c0-1 .2-2 1.4-2 1.2 0 1.1 1.1 1.1 2V18H18z'/></svg>"); mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M19 3a2 2 0 012 2v14a2 2 0 01-2 2H5a2 2 0 01-2-2V5a2 2 0 012-2h14zM8.5 18v-8h-2.5v8h2.5zM7.25 8.5a1.5 1.5 0 110-3 1.5 1.5 0 010 3zM18 18v-4.5c0-2-1-3-2.6-3-1.4 0-2 .8-2.4 1.4V10H10.5v8H13v-4.3c0-1 .2-2 1.4-2 1.2 0 1.1 1.1 1.1 2V18H18z'/></svg>"); }
.tvl-share-icon-pinterest { -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M12 0A12 12 0 0 0 7.62 23.16c-.1-.93-.2-2.37.04-3.39.22-.92 1.4-5.85 1.4-5.85s-.36-.71-.36-1.77c0-1.66.96-2.9 2.16-2.9 1.02 0 1.51.77 1.51 1.69 0 1.03-.66 2.57-1 4-.28 1.21.6 2.19 1.79 2.19 2.15 0 3.8-2.27 3.8-5.54 0-2.9-2.08-4.92-5.06-4.92-3.44 0-5.46 2.58-5.46 5.25 0 1.04.4 2.16.9 2.76.1.12.11.22.08.34l-.34 1.36c-.05.22-.18.27-.41.16-1.5-.7-2.44-2.89-2.44-4.65 0-3.78 2.75-7.26 7.92-7.26 4.16 0 7.39 2.96 7.39 6.92 0 4.13-2.6 7.46-6.22 7.46-1.21 0-2.36-.63-2.75-1.38l-.75 2.85c-.27 1.05-1 2.36-1.49 3.16A12 12 0 1 0 12 0z'/></svg>"); mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M12 0A12 12 0 0 0 7.62 23.16c-.1-.93-.2-2.37.04-3.39.22-.92 1.4-5.85 1.4-5.85s-.36-.71-.36-1.77c0-1.66.96-2.9 2.16-2.9 1.02 0 1.51.77 1.51 1.69 0 1.03-.66 2.57-1 4-.28 1.21.6 2.19 1.79 2.19 2.15 0 3.8-2.27 3.8-5.54 0-2.9-2.08-4.92-5.06-4.92-3.44 0-5.46 2.58-5.46 5.25 0 1.04.4 2.16.9 2.76.1.12.11.22.08.34l-.34 1.36c-.05.22-.18.27-.41.16-1.5-.7-2.44-2.89-2.44-4.65 0-3.78 2.75-7.26 7.92-7.26 4.16 0 7.39 2.96 7.39 6.92 0 4.13-2.6 7.46-6.22 7.46-1.21 0-2.36-.63-2.75-1.38l-.75 2.85c-.27 1.05-1 2.36-1.49 3.16A12 12 0 1 0 12 0z'/></svg>"); }
.tvl-share-icon-x         { -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z'/></svg>"); mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z'/></svg>"); }
.tvl-share-icon-email     { -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M20 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z'/></svg>"); mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M20 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z'/></svg>"); }
.tvl-share-icon-threads   { -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M17.6 11.5c-.1-.05-.16-.1-.24-.13-.13-2.4-1.46-3.77-3.7-3.79-1.34-.01-2.46.56-3.15 1.6l1.23.84c.51-.78 1.32-.94 1.91-.94 0 0 .01 0 .02 0 .74.01 1.31.22 1.66.64.26.3.43.72.51 1.24-.66-.11-1.36-.15-2.1-.1-2.1.12-3.46 1.34-3.37 3.04.05.86.48 1.61 1.21 2.1.62.42 1.43.62 2.27.57 1.11-.06 1.99-.48 2.6-1.26.46-.59.76-1.36.88-2.32.51.31.89.71 1.1 1.2.36.83.39 2.18-.72 3.29-.97.97-2.14 1.38-3.91 1.4-1.96-.02-3.45-.65-4.42-1.86-.91-1.14-1.38-2.78-1.4-4.88.02-2.11.49-3.74 1.4-4.88.97-1.22 2.46-1.84 4.42-1.86 1.97.02 3.48.65 4.49 1.88.5.6.87 1.36 1.13 2.25l1.55-.43c-.31-1.07-.78-2.01-1.42-2.78C16.55 4.36 14.65 3.5 12.18 3.5h-.02c-2.46.02-4.36.89-5.62 2.6C5.42 7.64 4.86 9.61 4.83 12c.02 2.39.58 4.35 1.7 5.91 1.27 1.7 3.16 2.58 5.62 2.6h.02c2.17-.02 3.7-.6 4.97-1.86 1.66-1.66 1.6-3.74 1.06-5.01-.39-.91-1.14-1.65-2.18-2.14h-.01zm-3.83 3.97c-.93.05-1.9-.36-1.94-1.27-.04-.67.48-1.42 1.99-1.5.18-.01.35-.02.51-.02.55 0 1.06.05 1.53.16-.18 2.18-1.2 2.6-2.09 2.63z'/></svg>"); mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M17.6 11.5c-.1-.05-.16-.1-.24-.13-.13-2.4-1.46-3.77-3.7-3.79-1.34-.01-2.46.56-3.15 1.6l1.23.84c.51-.78 1.32-.94 1.91-.94 0 0 .01 0 .02 0 .74.01 1.31.22 1.66.64.26.3.43.72.51 1.24-.66-.11-1.36-.15-2.1-.1-2.1.12-3.46 1.34-3.37 3.04.05.86.48 1.61 1.21 2.1.62.42 1.43.62 2.27.57 1.11-.06 1.99-.48 2.6-1.26.46-.59.76-1.36.88-2.32.51.31.89.71 1.1 1.2.36.83.39 2.18-.72 3.29-.97.97-2.14 1.38-3.91 1.4-1.96-.02-3.45-.65-4.42-1.86-.91-1.14-1.38-2.78-1.4-4.88.02-2.11.49-3.74 1.4-4.88.97-1.22 2.46-1.84 4.42-1.86 1.97.02 3.48.65 4.49 1.88.5.6.87 1.36 1.13 2.25l1.55-.43c-.31-1.07-.78-2.01-1.42-2.78C16.55 4.36 14.65 3.5 12.18 3.5h-.02c-2.46.02-4.36.89-5.62 2.6C5.42 7.64 4.86 9.61 4.83 12c.02 2.39.58 4.35 1.7 5.91 1.27 1.7 3.16 2.58 5.62 2.6h.02c2.17-.02 3.7-.6 4.97-1.86 1.66-1.66 1.6-3.74 1.06-5.01-.39-.91-1.14-1.65-2.18-2.14h-.01zm-3.83 3.97c-.93.05-1.9-.36-1.94-1.27-.04-.67.48-1.42 1.99-1.5.18-.01.35-.02.51-.02.55 0 1.06.05 1.53.16-.18 2.18-1.2 2.6-2.09 2.63z'/></svg>"); }
.tvl-share-icon-telegram  { -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M12 0A12 12 0 1 0 24 12 12 12 0 0 0 12 0zm5.85 8.18-1.95 9.2c-.15.65-.53.81-1.07.5L11.9 15.7l-1.42 1.37c-.16.16-.29.29-.59.29l.21-2.97 5.4-4.88c.24-.21-.05-.32-.37-.12L8.46 13.6l-2.87-.9c-.62-.2-.64-.62.13-.92l11.21-4.32c.52-.18.97.13.79.92z'/></svg>"); mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M12 0A12 12 0 1 0 24 12 12 12 0 0 0 12 0zm5.85 8.18-1.95 9.2c-.15.65-.53.81-1.07.5L11.9 15.7l-1.42 1.37c-.16.16-.29.29-.59.29l.21-2.97 5.4-4.88c.24-.21-.05-.32-.37-.12L8.46 13.6l-2.87-.9c-.62-.2-.64-.62.13-.92l11.21-4.32c.52-.18.97.13.79.92z'/></svg>"); }
.tvl-share-icon-tumblr    { -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M14.563 24c-5.093 0-7.031-3.756-7.031-6.411V9.747H5.116V6.648c3.63-1.313 4.512-4.596 4.71-6.469.014-.124.125-.179.187-.179h3.495v6.097h4.781v3.65h-4.794v7.502c.012 1.013.355 2.394 2.272 2.342.063 0 .226-.005.493-.024.736-.062 1.756-.184 2.4-.456V22.4c-1.052.31-2.054.448-3.097.448z'/></svg>"); mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M14.563 24c-5.093 0-7.031-3.756-7.031-6.411V9.747H5.116V6.648c3.63-1.313 4.512-4.596 4.71-6.469.014-.124.125-.179.187-.179h3.495v6.097h4.781v3.65h-4.794v7.502c.012 1.013.355 2.394 2.272 2.342.063 0 .226-.005.493-.024.736-.062 1.756-.184 2.4-.456V22.4c-1.052.31-2.054.448-3.097.448z'/></svg>"); }
.tvl-share-icon-reddit    { -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M12 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12 12 12 0 0 0 12-12A12 12 0 0 0 12 0zm5.01 4.744c.688 0 1.25.561 1.25 1.249a1.25 1.25 0 0 1-2.498.056l-2.597-.547-.8 3.747c1.824.07 3.48.632 4.674 1.488.308-.309.73-.491 1.207-.491.968 0 1.754.786 1.754 1.754 0 .716-.435 1.333-1.01 1.614a3.111 3.111 0 0 1 .042.52c0 2.694-3.13 4.87-7.004 4.87-3.874 0-7.004-2.176-7.004-4.87 0-.183.015-.366.043-.534A1.748 1.748 0 0 1 4.028 12c0-.968.786-1.754 1.754-1.754.463 0 .898.196 1.207.49 1.207-.883 2.878-1.43 4.72-1.487l.885-4.182a.342.342 0 0 1 .14-.197.35.35 0 0 1 .238-.042l2.906.617a1.214 1.214 0 0 1 1.132-.701zM9.25 12C8.561 12 8 12.562 8 13.25c0 .687.561 1.248 1.25 1.248.687 0 1.248-.561 1.248-1.249 0-.688-.561-1.249-1.249-1.249zm5.5 0c-.687 0-1.248.561-1.248 1.25 0 .687.561 1.248 1.249 1.248.688 0 1.249-.561 1.249-1.249 0-.687-.562-1.249-1.25-1.249zm-5.466 3.99a.327.327 0 0 0-.231.094.33.33 0 0 0 0 .463c.842.842 2.484.913 2.961.913.477 0 2.105-.056 2.961-.913a.361.361 0 0 0 .029-.463.33.33 0 0 0-.464 0c-.547.533-1.684.73-2.512.73-.828 0-1.979-.196-2.512-.73a.326.326 0 0 0-.232-.095z'/></svg>"); mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M12 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12 12 12 0 0 0 12-12A12 12 0 0 0 12 0zm5.01 4.744c.688 0 1.25.561 1.25 1.249a1.25 1.25 0 0 1-2.498.056l-2.597-.547-.8 3.747c1.824.07 3.48.632 4.674 1.488.308-.309.73-.491 1.207-.491.968 0 1.754.786 1.754 1.754 0 .716-.435 1.333-1.01 1.614a3.111 3.111 0 0 1 .042.52c0 2.694-3.13 4.87-7.004 4.87-3.874 0-7.004-2.176-7.004-4.87 0-.183.015-.366.043-.534A1.748 1.748 0 0 1 4.028 12c0-.968.786-1.754 1.754-1.754.463 0 .898.196 1.207.49 1.207-.883 2.878-1.43 4.72-1.487l.885-4.182a.342.342 0 0 1 .14-.197.35.35 0 0 1 .238-.042l2.906.617a1.214 1.214 0 0 1 1.132-.701zM9.25 12C8.561 12 8 12.562 8 13.25c0 .687.561 1.248 1.25 1.248.687 0 1.248-.561 1.248-1.249 0-.688-.561-1.249-1.249-1.249zm5.5 0c-.687 0-1.248.561-1.248 1.25 0 .687.561 1.248 1.249 1.248.688 0 1.249-.561 1.249-1.249 0-.687-.562-1.249-1.25-1.249zm-5.466 3.99a.327.327 0 0 0-.231.094.33.33 0 0 0 0 .463c.842.842 2.484.913 2.961.913.477 0 2.105-.056 2.961-.913a.361.361 0 0 0 .029-.463.33.33 0 0 0-.464 0c-.547.533-1.684.73-2.512.73-.828 0-1.979-.196-2.512-.73a.326.326 0 0 0-.232-.095z'/></svg>"); }
.tvl-share-icon-instagram { -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M12 2.2c3.2 0 3.6 0 4.85.07 1.17.05 1.8.25 2.22.42.56.22.96.48 1.38.9.42.42.68.82.9 1.38.17.42.37 1.05.42 2.22.06 1.26.07 1.64.07 4.84s-.01 3.58-.07 4.85c-.05 1.17-.25 1.8-.42 2.22-.22.56-.48.96-.9 1.38-.42.42-.82.68-1.38.9-.42.17-1.05.37-2.22.42-1.26.06-1.64.07-4.85.07s-3.58-.01-4.85-.07c-1.17-.05-1.8-.25-2.22-.42-.56-.22-.96-.48-1.38-.9-.42-.42-.68-.82-.9-1.38-.17-.42-.37-1.05-.42-2.22C2.21 15.6 2.2 15.2 2.2 12s.01-3.58.07-4.85c.05-1.17.25-1.8.42-2.22.22-.56.48-.96.9-1.38.42-.42.82-.68 1.38-.9.42-.17 1.05-.37 2.22-.42C8.42 2.21 8.8 2.2 12 2.2zm0 3.06A4.94 4.94 0 1116.94 12 4.94 4.94 0 0112 7.06zm0 8.14A3.2 3.2 0 108.8 12 3.2 3.2 0 0012 15.2zm6.4-8.34a1.15 1.15 0 11-1.15-1.15 1.15 1.15 0 011.15 1.15z'/></svg>"); mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M12 2.2c3.2 0 3.6 0 4.85.07 1.17.05 1.8.25 2.22.42.56.22.96.48 1.38.9.42.42.68.82.9 1.38.17.42.37 1.05.42 2.22.06 1.26.07 1.64.07 4.84s-.01 3.58-.07 4.85c-.05 1.17-.25 1.8-.42 2.22-.22.56-.48.96-.9 1.38-.42.42-.82.68-1.38.9-.42.17-1.05.37-2.22.42-1.26.06-1.64.07-4.85.07s-3.58-.01-4.85-.07c-1.17-.05-1.8-.25-2.22-.42-.56-.22-.96-.48-1.38-.9-.42-.42-.68-.82-.9-1.38-.17-.42-.37-1.05-.42-2.22C2.21 15.6 2.2 15.2 2.2 12s.01-3.58.07-4.85c.05-1.17.25-1.8.42-2.22.22-.56.48-.96.9-1.38.42-.42.82-.68 1.38-.9.42-.17 1.05-.37 2.22-.42C8.42 2.21 8.8 2.2 12 2.2zm0 3.06A4.94 4.94 0 1116.94 12 4.94 4.94 0 0112 7.06zm0 8.14A3.2 3.2 0 108.8 12 3.2 3.2 0 0012 15.2zm6.4-8.34a1.15 1.15 0 11-1.15-1.15 1.15 1.15 0 011.15 1.15z'/></svg>"); }
.tvl-share-icon-youtube   { -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M23.5 6.2s-.2-1.6-.9-2.3c-.9-.9-1.9-.9-2.4-1C16.8 2.6 12 2.6 12 2.6s-4.8 0-8.2.3c-.5.1-1.5.1-2.4 1-.7.7-.9 2.3-.9 2.3S0 8.1 0 10v1.9c0 1.9.3 3.8.3 3.8s.2 1.6.9 2.3c.9.9 2.1.9 2.6 1 1.9.2 8.2.3 8.2.3s4.8 0 8.2-.3c.5-.1 1.5-.1 2.4-1 .7-.7.9-2.3.9-2.3s.3-1.9.3-3.8V10c0-1.9-.3-3.8-.3-3.8zM9.5 14V8l6.2 3-6.2 3z'/></svg>"); mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M23.5 6.2s-.2-1.6-.9-2.3c-.9-.9-1.9-.9-2.4-1C16.8 2.6 12 2.6 12 2.6s-4.8 0-8.2.3c-.5.1-1.5.1-2.4 1-.7.7-.9 2.3-.9 2.3S0 8.1 0 10v1.9c0 1.9.3 3.8.3 3.8s.2 1.6.9 2.3c.9.9 2.1.9 2.6 1 1.9.2 8.2.3 8.2.3s4.8 0 8.2-.3c.5-.1 1.5-.1 2.4-1 .7-.7.9-2.3.9-2.3s.3-1.9.3-3.8V10c0-1.9-.3-3.8-.3-3.8zM9.5 14V8l6.2 3-6.2 3z'/></svg>"); }
.tvl-share-icon-copy      { -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M16 1H4a2 2 0 0 0-2 2v14h2V3h12V1zm3 4H8a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h11a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2zm0 16H8V7h11v14z'/></svg>"); mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M16 1H4a2 2 0 0 0-2 2v14h2V3h12V1zm3 4H8a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h11a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2zm0 16H8V7h11v14z'/></svg>"); }

/* État "copié" */
.tvl-share-btn--copy.tvl-share-btn-copied {
  background: #10B981;
}

/* Toast notification */
.tvl-share-toast {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%) translateY(20px);
  background: var(--tvl-text);
  color: #fff;
  padding: 12px 20px;
  border-radius: var(--tvl-radius-md);
  font-size: 14px;
  font-weight: 600;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s, transform 0.2s;
  z-index: 9999;
  box-shadow: var(--tvl-shadow-lg);
}
.tvl-share-toast.tvl-share-toast--visible {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}


/* ==========================================================================
   7. AUTHOR BOX
   ========================================================================== */

.tvl-author-box {
  margin: 40px 0;
  background: var(--tvl-bg-soft);
  padding: 32px 0;
}
.tvl-author-box-inner {
  display: flex;
  gap: 24px;
  align-items: flex-start;
}
.tvl-author-box-avatar {
  width: 96px !important;
  height: 96px !important;
  border-radius: 50%;
  flex-shrink: 0;
  border: 3px solid #fff;
  box-shadow: var(--tvl-shadow-sm);
}
.tvl-author-box-content { flex: 1; }
.tvl-author-box-name {
  font-size: 20px;
  font-weight: 700;
  margin: 0 0 8px;
}
.tvl-author-box-name a {
  color: var(--tvl-text);
  text-decoration: none;
  transition: color 0.15s;
}
.tvl-author-box-name a:hover { color: var(--tvl-primary); }
.tvl-author-box-bio {
  margin: 0;
  color: var(--tvl-text-soft);
  line-height: 1.6;
  font-size: 15px;
}


/* ==========================================================================
   8. RELATED POSTS
   ========================================================================== */

.tvl-related-posts {
  padding: 48px 0;
  background: var(--tvl-white);
  border-top: 1px solid var(--tvl-border);
}
.tvl-related-posts .tvl-container {
  max-width: 1200px;
}
.tvl-related-title {
  font-size: 24px;
  font-weight: 800;
  margin: 0 0 24px;
  text-align: center;
}
.tvl-related-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}
.tvl-related-card {
  background: #fff;
  border-radius: var(--tvl-radius-md);
  overflow: hidden;
  box-shadow: var(--tvl-shadow-sm);
  transition: transform 0.2s, box-shadow 0.2s;
}
.tvl-related-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--tvl-shadow-md);
}
.tvl-related-card-link {
  display: block;
  text-decoration: none;
  color: inherit;
}
.tvl-related-card-thumb {
  position: relative;
  aspect-ratio: 3/2;
  overflow: hidden;
  background: var(--tvl-bg-soft);
}
.tvl-related-card-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s;
}
.tvl-related-card:hover .tvl-related-card-thumb img {
  transform: scale(1.05);
}
.tvl-related-card-body { padding: 16px; }
.tvl-related-card-cat {
  display: inline-block;
  background: var(--tvl-primary);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  padding: 3px 8px;
  border-radius: 3px;
  margin-bottom: 8px;
}
.tvl-related-card-title {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 12px;
  color: var(--tvl-text);
}
.tvl-related-card-meta {
  display: flex;
  gap: 8px;
  font-size: 12px;
  color: var(--tvl-text-soft);
}
.tvl-related-empty { text-align: center; color: var(--tvl-text-soft); }

@media (max-width: 992px) {
  .tvl-related-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
  .tvl-related-grid { grid-template-columns: 1fr; }
  .tvl-author-box-inner { flex-direction: column; align-items: center; text-align: center; }
  .tvl-share-btn { width: 38px; height: 38px; }
}

/* screen-reader-text utility */
.screen-reader-text {
  border: 0; clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%); height: 1px; width: 1px;
  margin: -1px; overflow: hidden; padding: 0;
  position: absolute !important; word-wrap: normal !important;
}


/* ==========================================================================
   9. ARCHIVE / SEARCH / 404 — Bannière + Grille cards + Pagination
   ========================================================================== */

.tvl-archive-container {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 24px;
  box-sizing: border-box;
}

/* 9.1 Bannière */
.tvl-archive-banner {
  position: relative;
  background: linear-gradient(135deg, var(--tvl-primary) 0%, var(--tvl-accent) 100%);
  color: #fff;
  padding: 60px 24px;
  text-align: center;
  overflow: hidden;
}
.tvl-archive-banner-overlay {
  position: absolute;
  inset: 0;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="60" height="60" viewBox="0 0 60 60"><circle cx="30" cy="30" r="1.5" fill="rgba(255,255,255,0.08)"/></svg>') repeat;
  opacity: 0.5;
  pointer-events: none;
}
.tvl-archive-banner-inner {
  position: relative;
  max-width: 800px;
  margin: 0 auto;
}
.tvl-archive-title {
  font-size: clamp(28px, 4vw, 44px);
  font-weight: 800;
  margin: 0 0 12px;
  line-height: 1.15;
  color: #fff;
}
.tvl-archive-description {
  font-size: 16px;
  color: rgba(255,255,255,0.92);
  max-width: 600px;
  margin: 12px auto 0;
  line-height: 1.5;
}

/* 9.2 Formulaire recherche inline (search.php banner) */
.tvl-search-form-inline {
  margin: 24px auto 0;
  display: flex;
  gap: 8px;
  max-width: 500px;
  align-items: center;
}
.tvl-search-form-input {
  flex: 1;
  background: rgba(255,255,255,0.95);
  border: 2px solid rgba(255,255,255,0.4);
  border-radius: var(--tvl-radius-md);
  padding: 12px 16px;
  font-size: 15px;
  font-family: var(--tvl-font);
  color: var(--tvl-text);
  outline: none;
  transition: border-color 0.15s, background 0.15s;
}
.tvl-search-form-input:focus {
  background: #fff;
  border-color: #fff;
}
.tvl-search-form-submit {
  width: 48px;
  height: 48px;
  background: #fff;
  color: var(--tvl-primary);
  border: none;
  border-radius: var(--tvl-radius-md);
  font-size: 18px;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.tvl-search-form-submit:hover {
  background: var(--tvl-text);
  color: #fff;
}

/* 9.3 Contenu archive */
.tvl-archive-content {
  padding: 48px 0 64px;
  background: var(--tvl-white);
}

.tvl-cards-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}

/* 9.4 Card standard */
.tvl-card {
  background: #fff;
  border-radius: 0; /* setting from #106 archive_cards_card_border_radius = 0 */
  overflow: hidden;
  box-shadow: var(--tvl-shadow-sm);
  transition: transform 0.2s, box-shadow 0.2s;
  display: flex;
  flex-direction: column;
}
.tvl-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--tvl-shadow-md);
}
.tvl-card-link {
  display: flex;
  flex-direction: column;
  height: 100%;
  text-decoration: none;
  color: inherit;
}
.tvl-card-thumb {
  position: relative;
  aspect-ratio: 1.32 / 1; /* setting from #106 archive_cards_item_ratio = 1.32 */
  overflow: hidden;
  background: var(--tvl-bg-soft);
}
.tvl-card-thumb img,
.tvl-card-thumb .tvl-card-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s, filter 0.3s;
}
.tvl-card:hover .tvl-card-thumb img {
  transform: scale(1.04);
  filter: brightness(0.92);
}
.tvl-card-thumb-placeholder {
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, var(--tvl-primary) 0%, var(--tvl-accent) 100%);
  opacity: 0.15;
}
.tvl-card-badge {
  position: absolute;
  top: 12px;
  left: 12px;
  background: var(--tvl-primary);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 4px 10px;
  border-radius: 3px;
  z-index: 2;
}
.tvl-card-body {
  padding: 16px;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.tvl-card-title {
  font-size: 17px;
  font-weight: 700;
  line-height: 1.3;
  margin: 0;
  color: var(--tvl-text);
}
.tvl-card-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--tvl-text-soft);
  margin-top: auto;
  flex-wrap: wrap;
}
.tvl-card-avatar {
  width: 28px !important;
  height: 28px !important;
  border-radius: 50%;
  object-fit: cover;
}
.tvl-card-author { font-weight: 600; color: var(--tvl-text); }
.tvl-card-sep { color: var(--tvl-border); }

/* Highlight terme recherché */
.tvl-highlight {
  background: rgba(3, 140, 213, 0.15);
  color: var(--tvl-primary);
  font-weight: 700;
  padding: 0 2px;
  border-radius: 2px;
}

/* 9.5 Pagination */
.tvl-pagination {
  margin-top: 48px;
  text-align: center;
}
.tvl-pagination .nav-links,
.tvl-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
}
.tvl-pagination a,
.tvl-pagination span.page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 12px;
  background: #fff;
  border: 1px solid var(--tvl-border);
  border-radius: var(--tvl-radius-sm);
  color: var(--tvl-text);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.tvl-pagination a:hover {
  background: var(--tvl-primary);
  color: #fff;
  border-color: var(--tvl-primary);
}
.tvl-pagination .current {
  background: var(--tvl-primary);
  color: #fff;
  border-color: var(--tvl-primary);
}
.tvl-pagination .dots {
  border: none;
  background: transparent;
}

/* 9.6 Empty state */
.tvl-archive-empty {
  text-align: center;
  padding: 64px 24px;
  max-width: 600px;
  margin: 0 auto;
}
.tvl-archive-empty h2 {
  font-size: 24px;
  margin: 0 0 16px;
  color: var(--tvl-text);
}
.tvl-archive-empty p {
  color: var(--tvl-text-soft);
  font-size: 16px;
  margin: 0 0 24px;
  line-height: 1.5;
}
.tvl-archive-empty-links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
  margin-top: 24px;
}


/* ==========================================================================
   10. ERROR 404
   ========================================================================== */

.tvl-error-404 {
  background: var(--tvl-white);
  padding: 60px 24px;
}
.tvl-error-container {
  max-width: 1200px;
  margin: 0 auto;
}
.tvl-error-content {
  text-align: center;
  max-width: 600px;
  margin: 0 auto 64px;
}
.tvl-error-code {
  font-size: clamp(80px, 14vw, 160px);
  font-weight: 900;
  line-height: 1;
  background: linear-gradient(135deg, var(--tvl-primary) 0%, var(--tvl-accent) 100%);
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  margin: 0 0 16px;
  letter-spacing: -0.05em;
}
.tvl-error-title {
  font-size: clamp(24px, 3.5vw, 36px);
  font-weight: 800;
  margin: 0 0 12px;
  color: var(--tvl-text);
}
.tvl-error-text {
  font-size: 16px;
  color: var(--tvl-text-soft);
  margin: 0 0 32px;
  line-height: 1.5;
}

.tvl-error-search-form {
  display: flex;
  gap: 8px;
  max-width: 500px;
  margin: 0 auto 32px;
}
.tvl-error-search-input {
  flex: 1;
  background: var(--tvl-bg-soft);
  border: 2px solid var(--tvl-border);
  border-radius: var(--tvl-radius-md);
  padding: 14px 18px;
  font-size: 15px;
  font-family: var(--tvl-font);
  color: var(--tvl-text);
  outline: none;
  transition: border-color 0.15s, background 0.15s;
}
.tvl-error-search-input:focus {
  background: #fff;
  border-color: var(--tvl-primary);
}
.tvl-error-search-submit {
  background: var(--tvl-primary);
  color: #fff;
  border: none;
  border-radius: var(--tvl-radius-md);
  padding: 0 24px;
  font-size: 15px;
  font-weight: 700;
  font-family: var(--tvl-font);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: background 0.15s;
}
.tvl-error-search-submit:hover { background: var(--tvl-accent); }

.tvl-error-or {
  color: var(--tvl-text-soft);
  font-size: 14px;
  margin: 0 0 16px;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 600;
}

.tvl-error-links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
}

.tvl-error-recent {
  margin-top: 48px;
  padding-top: 48px;
  border-top: 1px solid var(--tvl-border);
}
.tvl-error-recent-title {
  font-size: 22px;
  font-weight: 800;
  margin: 0 0 24px;
  text-align: center;
  color: var(--tvl-text);
}


/* ==========================================================================
   11. BUTTONS — Réutilisables
   ========================================================================== */

.tvl-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 24px;
  border-radius: var(--tvl-radius-md);
  font-size: 14px;
  font-weight: 700;
  font-family: var(--tvl-font);
  text-decoration: none;
  border: 2px solid transparent;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, border-color 0.15s, transform 0.15s;
  white-space: nowrap;
}
.tvl-btn-primary {
  background: var(--tvl-primary);
  color: #fff;
  border-color: var(--tvl-primary);
}
.tvl-btn-primary:hover {
  background: var(--tvl-accent);
  border-color: var(--tvl-accent);
  color: #fff;
  transform: translateY(-1px);
}
.tvl-btn-secondary {
  background: var(--tvl-white);
  color: var(--tvl-primary);
  border-color: var(--tvl-border);
}
.tvl-btn-secondary:hover {
  background: var(--tvl-bg-soft);
  border-color: var(--tvl-primary);
  color: var(--tvl-primary);
  transform: translateY(-1px);
}


/* ==========================================================================
   12. RESPONSIVE Archives / Search / 404 / Related
   ========================================================================== */

@media (max-width: 1024px) {
  .tvl-cards-grid { grid-template-columns: repeat(3, 1fr); gap: 20px; }
}
@media (max-width: 768px) {
  .tvl-cards-grid { grid-template-columns: repeat(2, 1fr); gap: 16px; }
  .tvl-archive-banner { padding: 40px 20px; }
  .tvl-archive-content { padding: 32px 0; }
  .tvl-card-title { font-size: 15px; }
  .tvl-error-404 { padding: 40px 20px; }
  .tvl-error-search-form { flex-direction: column; }
  .tvl-error-search-submit { width: 100%; padding: 14px 24px; }
}
@media (max-width: 480px) {
  .tvl-cards-grid { grid-template-columns: 1fr; }
  .tvl-archive-container { padding: 0 16px; }
}


/* ==========================================================================
   13. WRAPPERS + STATES (cleanup classes)
   ========================================================================== */

/* Main wrappers — reset minimal */
.tvl-archive,
.tvl-search-results,
.tvl-error-404 { background: var(--tvl-white); }

/* Variante bannière sur search.php (légèrement plus claire) */
.tvl-search-banner { background: linear-gradient(135deg, var(--tvl-primary) 0%, var(--tvl-primary-2) 100%); }

/* Date dans les cards (sélecteur explicite, utilisé par fournisseur RSS, plugins SEO, etc.) */
.tvl-card-date {
  color: var(--tvl-text-soft);
  font-style: normal;
}

/* Pagination wp_link_pages dans single (articles paginés) */
.tvl-page-links {
  margin: 24px 0;
  font-size: 14px;
  color: var(--tvl-text-soft);
}
.tvl-page-links a,
.tvl-page-links > span {
  display: inline-block;
  padding: 6px 12px;
  background: var(--tvl-bg-soft);
  border: 1px solid var(--tvl-border);
  border-radius: var(--tvl-radius-sm);
  text-decoration: none;
  color: var(--tvl-text);
  margin: 0 4px;
}
.tvl-page-links a:hover {
  background: var(--tvl-primary);
  color: #fff;
  border-color: var(--tvl-primary);
}

/* Section commentaires single.php */
.tvl-single-comments {
  padding: 32px 0;
  border-top: 1px solid var(--tvl-border);
  margin-top: 24px;
}
.tvl-single-comments .comments-title {
  font-size: 22px;
  font-weight: 800;
  margin: 0 0 24px;
}