/* =============================================================
   AMINATA.COM — Styles spécifiques aux pages (article, catégorie)
   Complète styles.css sans le remplacer.
   ============================================================= */

/* Liens cartes */
.card-link{display:flex;flex-direction:column;height:100%;color:inherit}
.card-h .card-link{flex-direction:row}
.card-h .card-link .card-media{width:160px;aspect-ratio:auto;flex-shrink:0}
.card-h .card-link .card-media img{height:100%}

/* Spinner / loading */
.article-loading,.empty-state{grid-column:1/-1;text-align:center;padding:60px 20px;color:var(--text-dim)}
.spinner{
  width:48px;height:48px;margin:0 auto 18px;border-radius:50%;
  border:4px solid var(--surface);border-top-color:var(--primary);
  animation:spin 1s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}
.article-error{text-align:center;padding:80px 20px;color:var(--text-soft)}
.article-error i{font-size:3rem;color:var(--primary);margin-bottom:18px;display:block}
.article-error h2{font-family:'Playfair Display',serif;font-size:1.8rem;margin-bottom:10px}
.article-error .btn{margin-top:20px}

/* ---------- ARTICLE ---------- */
.article-breadcrumb{padding:22px 0 0;font-size:.82rem;color:var(--text-dim);max-width:840px;margin:0 auto}
.article-breadcrumb a:hover{color:var(--primary)}
.article-hero{padding:24px 0 40px;max-width:840px;margin:0 auto;text-align:left}
.article-cat{display:inline-block;padding:5px 12px;border-radius:8px;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#fff;margin-bottom:18px;background:linear-gradient(135deg,var(--primary),var(--primary-2))}
.article-cat.cat-politique{background:linear-gradient(135deg,#e63946,#f77f00)}
.article-cat.cat-economie{background:linear-gradient(135deg,#06a77d,#0496ff)}
.article-cat.cat-international{background:linear-gradient(135deg,#7b2cbf,#c77dff)}
.article-cat.cat-sport{background:linear-gradient(135deg,#fb8500,#ffb703)}
.article-cat.cat-culture{background:linear-gradient(135deg,#d62828,#fcbf49)}
.article-cat.cat-regions{background:linear-gradient(135deg,#118ab2,#06d6a0)}
.article-cat.cat-societe{background:linear-gradient(135deg,#2a9d8f,#e9c46a)}
.article-cat.cat-sante{background:linear-gradient(135deg,#ef476f,#06d6a0)}
.article-cat.cat-afrique{background:linear-gradient(135deg,#7b2cbf,#5a189a)}
.article-cat.cat-interview{background:linear-gradient(135deg,#9d4edd,#c77dff)}
.article-cat.cat-justice{background:linear-gradient(135deg,#5a189a,#7b2cbf)}
.article-cat.cat-education{background:linear-gradient(135deg,#0096c7,#48cae4)}
.article-cat.cat-publireportage{background:linear-gradient(135deg,#f77f00,#fcbf49)}
.article-cat.cat-communique{background:linear-gradient(135deg,#bc4749,#a7c957)}
.article-cat.cat-opinion{background:linear-gradient(135deg,#6a4c93,#1982c4)}
.article-cat.cat-video{background:linear-gradient(135deg,#e63946,#fb5607)}
.article-cat.cat-tech{background:linear-gradient(135deg,#3a86ff,#8338ec)}

.article-title{font-family:'Playfair Display',serif;font-size:clamp(2rem,5vw,3.2rem);font-weight:900;line-height:1.12;letter-spacing:-.02em;margin-bottom:18px}
.article-lead{font-size:1.18rem;color:var(--text-soft);margin-bottom:24px;line-height:1.6}
.article-meta{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:16px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);margin-bottom:30px}
.author{display:flex;align-items:center;gap:12px}
.author-avatar{width:46px;height:46px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--primary-2));display:grid;place-items:center;color:#fff;font-weight:700}
.author-info strong{display:block;font-size:.95rem}
.author-info span{font-size:.78rem;color:var(--text-dim)}
.share-buttons{display:flex;gap:8px;margin-left:auto}
.share-buttons a{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:var(--surface);border:1px solid var(--border);color:var(--text-soft);transition:all var(--t)}
.share-buttons a:hover{color:#fff;background:linear-gradient(135deg,var(--primary),var(--primary-2));transform:translateY(-2px)}

.article-cover{border-radius:var(--radius-lg);overflow:hidden;margin-bottom:36px;aspect-ratio:16/9;position:relative;background:var(--bg-2)}
.article-cover img{width:100%;height:100%;object-fit:cover}

/* Corps article = HTML WordPress réinjecté */
.article-body{max-width:760px;margin:0 auto;font-size:1.06rem;line-height:1.85;color:var(--text-soft)}
.article-body p{margin-bottom:20px}
.article-body h2{font-family:'Playfair Display',serif;color:var(--text);font-size:1.7rem;margin:36px 0 16px;font-weight:700;line-height:1.2}
.article-body h3{font-family:'Playfair Display',serif;color:var(--text);font-size:1.4rem;margin:28px 0 12px;font-weight:700}
.article-body blockquote{margin:30px 0;padding:20px 26px;border-left:4px solid var(--primary);background:var(--surface);border-radius:0 14px 14px 0;font-style:italic;color:var(--text);font-size:1.12rem}
.article-body blockquote p{margin-bottom:0}
.article-body img{border-radius:14px;margin:24px 0;max-width:100%;height:auto}
.article-body figcaption{font-size:.8rem;color:var(--text-dim);text-align:center;margin-top:-12px;margin-bottom:24px}
.article-body a{color:var(--primary);text-decoration:underline;text-decoration-color:rgba(255,61,104,.4);text-underline-offset:3px}
.article-body a:hover{text-decoration-color:var(--primary)}
.article-body ul,.article-body ol{margin:0 0 20px 22px}
.article-body li{margin-bottom:8px}
.article-body strong,.article-body b{color:var(--text)}
.article-body .wp-caption,.article-body figure{margin:24px 0}
.article-body iframe{max-width:100%;border-radius:14px;aspect-ratio:16/9;width:100%;height:auto}
.article-body .youtube-player,.article-body .wp-block-embed{margin:24px 0}

.article-tags{display:flex;gap:10px;flex-wrap:wrap;margin:40px auto;padding-top:24px;border-top:1px solid var(--border);max-width:760px}
.article-tags a{padding:7px 14px;border-radius:999px;font-size:.82rem;background:var(--surface);border:1px solid var(--border);color:var(--text-soft);transition:all var(--t)}
.article-tags a:hover{color:#fff;background:var(--surface-2)}
.back-link{display:inline-flex;align-items:center;gap:8px;color:var(--text-soft);font-weight:600;margin:0 auto 20px;max-width:760px;transition:gap var(--t)}
.back-link:hover{color:var(--primary);gap:12px}

.related{background:rgba(255,255,255,.02);margin:0 -22px;padding-left:22px;padding-right:22px;border-radius:0}

/* ---------- CATÉGORIE (hero) ---------- */
.cat-hero{position:relative;padding:60px 0 40px;overflow:hidden;background:linear-gradient(135deg,rgba(255,61,104,.12),rgba(58,134,255,.1));border-bottom:1px solid var(--border)}
.cat-hero::before{content:"";position:absolute;top:-100px;right:-100px;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,var(--c1,#ff3d68),transparent 70%);opacity:.25;filter:blur(30px)}
.cat-hero-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--primary);margin-bottom:14px}
.cat-hero-title{font-family:'Playfair Display',serif;font-size:clamp(2.2rem,5vw,3.6rem);font-weight:900;letter-spacing:-.02em;margin-bottom:10px}
.cat-hero-count{color:var(--text-soft);font-size:1rem}
.cat-hero-count i{margin-right:6px;color:var(--primary)}
.cat-search{display:flex;align-items:center;gap:10px;padding:0 16px;border-radius:12px;background:var(--surface);border:1px solid var(--border);min-width:260px}
.cat-search i{color:var(--text-dim)}
.cat-search input{flex:1;background:transparent;border:none;color:var(--text);padding:12px 0;outline:none;font-size:.95rem}
.cat-search input::placeholder{color:var(--text-dim)}

/* ---------- Modal YouTube ---------- */
.yt-modal{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.85);backdrop-filter:blur(8px);display:grid;place-items:center;padding:20px;opacity:0;visibility:hidden;transition:opacity var(--t)}
.yt-modal.open{opacity:1;visibility:visible}
.yt-modal-inner{position:relative;width:min(960px,100%);aspect-ratio:16/9;background:#000;border-radius:16px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.6)}
.yt-frame-wrap{position:absolute;inset:0}
.yt-frame-wrap iframe{width:100%;height:100%;border:0}
.yt-close{position:absolute;top:-44px;right:0;width:40px;height:40px;border-radius:10px;background:var(--surface);border:1px solid var(--border);color:#fff;font-size:1.1rem;display:grid;place-items:center}
.yt-close:hover{background:var(--primary)}

/* play btn petit */
.play-btn.sm{width:42px;height:42px;font-size:.85rem;animation:none;opacity:0;transition:opacity var(--t)}
.video-item:hover .play-btn.sm,.video-thumb:hover .play-btn.sm{opacity:1}

/* Ticker item cliquable */
.ticker-item{display:inline-flex;align-items:center;gap:8px;color:var(--text-soft);font-weight:500;padding:0 8px;transition:color var(--t)}
.ticker-item:hover{color:#fff}
.ticker-item .tk-cat{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--primary);background:rgba(255,61,104,.12);padding:2px 8px;border-radius:6px}

/* Sticker compteur */
.sticker-count{position:relative;z-index:1;font-size:.7rem;color:var(--text-dim);margin-top:-6px}

/* ============================================================= */
/* PANNEAU PUBLICITAIRE MODERNE (vitre transparente + animations) */
/* ============================================================= */
.ad-frame.ad-modern{
  padding:32px 34px;
  border-radius:var(--radius-lg);
  background:rgba(255,255,255,.03);
  backdrop-filter:blur(18px) saturate(160%);
  -webkit-backdrop-filter:blur(18px) saturate(160%);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 18px 50px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.15);
  overflow:hidden;
  animation:adFadeIn .8s cubic-bezier(.2,.8,.2,1) both;
  transition:box-shadow .5s ease,transform .5s ease,border-color .5s ease;
}
@keyframes adFadeIn{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
.ad-frame.ad-modern:hover{
  box-shadow:0 26px 60px rgba(0,0,0,.45),0 0 0 1px rgba(255,61,104,.3);
  border-color:rgba(255,255,255,.22);
  transform:translateY(-3px);
}
/* Halo lumineux animé derrière le panneau */
.ad-glow{
  position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(circle at 12% 20%,rgba(255,61,104,.18),transparent 42%),
    radial-gradient(circle at 88% 80%,rgba(252,191,73,.16),transparent 45%);
  animation:adGlowMove 9s ease-in-out infinite alternate;
}
@keyframes adGlowMove{
  0%{transform:scale(1) translate(0,0);opacity:.6}
  100%{transform:scale(1.08) translate(-2%,2%);opacity:1}
}
.ad-frame.ad-modern .ad-content{position:relative;z-index:1;gap:26px}
/* Image pub avec badge */
.ad-img-wrap{position:relative;flex-shrink:0}
.ad-img-wrap .ad-img{
  width:130px;height:100px;object-fit:cover;border-radius:14px;
  border:1px solid rgba(255,255,255,.15);
  box-shadow:0 10px 26px rgba(0,0,0,.4);
  transition:transform .5s cubic-bezier(.2,.8,.2,1);
}
.ad-frame.ad-modern:hover .ad-img{transform:scale(1.06) rotate(-1deg)}
.ad-badge{
  position:absolute;bottom:-8px;right:-8px;z-index:2;
  display:inline-flex;align-items:center;gap:4px;
  padding:4px 10px;border-radius:999px;
  font-size:.64rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;
  color:#fff;background:linear-gradient(135deg,#06d6a0,#0496ff);
  box-shadow:0 6px 16px rgba(6,214,160,.45);
  animation:adBadgePulse 2.4s ease-in-out infinite;
}
@keyframes adBadgePulse{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
/* Texte pub */
.ad-text{flex:1;min-width:220px}
.ad-text strong{
  display:flex;align-items:center;gap:9px;
  font-size:clamp(1.2rem,2.4vw,1.5rem);font-weight:800;
  font-family:'Playfair Display',serif;color:var(--text);
  margin-bottom:6px;letter-spacing:-.01em;
}
.ad-text strong i{color:var(--gold);animation:adIconShake 3s ease-in-out infinite}
@keyframes adIconShake{0%,90%,100%{transform:rotate(0)}93%{transform:rotate(-12deg)}96%{transform:rotate(12deg)}}
.ad-text p{
  color:var(--text-soft);font-size:.95rem;line-height:1.5;margin:0 0 12px;
}
.ad-text p em{color:var(--primary);font-style:normal;font-weight:700}
.ad-stats{display:flex;gap:16px;flex-wrap:wrap}
.ad-stats span{
  display:inline-flex;align-items:center;gap:6px;
  font-size:.74rem;font-weight:600;color:var(--text-dim);
  padding:5px 11px;border-radius:999px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);
}
.ad-stats i{color:var(--accent)}
/* Bouton pub animé */
.btn-ad{
  display:inline-flex;align-items:center;gap:9px;
  padding:13px 24px;border-radius:14px;
  font-weight:700;font-size:.96rem;color:#fff;
  background:linear-gradient(135deg,var(--primary),var(--primary-2));
  box-shadow:0 12px 30px rgba(255,61,104,.45);
  transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease;
  flex-shrink:0;
  position:relative;overflow:hidden;
}
.btn-ad::before{
  content:"";position:absolute;top:0;left:-100%;width:60%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);
  transition:left .7s ease;
}
.btn-ad:hover::before{left:120%}
.btn-ad:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 16px 38px rgba(255,61,104,.6)}
/* Tag pub avec pulse */
.ad-frame.ad-modern .ad-tag{
  display:inline-flex;align-items:center;gap:6px;
  position:absolute;top:14px;right:16px;z-index:3;
  font-size:.62rem;letter-spacing:.14em;color:#fff;
  border:none;padding:5px 11px;border-radius:999px;
  text-transform:uppercase;font-weight:700;
  background:rgba(255,61,104,.85);backdrop-filter:blur(6px);
}
.ad-pulse{
  width:7px;height:7px;border-radius:50%;background:#fff;
  box-shadow:0 0 0 0 rgba(255,255,255,.8);
  animation:adDotPulse 1.6s infinite;
}
@keyframes adDotPulse{0%{box-shadow:0 0 0 0 rgba(255,255,255,.8)}70%{box-shadow:0 0 0 8px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}}
/* Responsive pub */
@media (max-width:720px){
  .ad-frame.ad-modern{padding:24px 20px}
  .ad-frame.ad-modern .ad-content{flex-direction:column;text-align:center;align-items:center;gap:18px}
  .ad-img-wrap .ad-img{width:110px;height:84px}
  .ad-text strong{justify-content:center}
  .ad-stats{justify-content:center}
  .btn-ad{width:100%;justify-content:center}
}

/* ============================================================= */
/* TABLEAU PANNEAU VIDÉOS YOUTUBE (effet vitre/miroir TRÈS transparent)*/
/* ============================================================= */
/* Section placée après le footer */
.yt-section-after-footer{
  padding:60px 0 80px;
  background:rgba(255,255,255,.02);
  border-top:1px solid var(--border);
  position:relative;
}
.yt-section-after-footer::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(circle at 20% 30%,rgba(255,61,104,.08),transparent 45%),
    radial-gradient(circle at 80% 70%,rgba(58,134,255,.10),transparent 45%);
}
.yt-panel{
  position:relative;
  padding:0;
  overflow:hidden;
  border-radius:var(--radius-lg);
  /* VRAI effet vitre TRÈS transparent : presque invisible, juste un reflet */
  background:rgba(255,255,255,.025);
  backdrop-filter:blur(10px) saturate(120%);
  -webkit-backdrop-filter:blur(10px) saturate(120%);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 16px 40px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.18);
  /* Animation d'apparition fluide */
  animation:ytPanelIn .8s cubic-bezier(.2,.8,.2,1) both;
  transition:box-shadow .5s ease,transform .5s ease;
}
@keyframes ytPanelIn{
  from{opacity:0;transform:translateY(30px) scale(.98)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
/* Reflet vitre en haut (brillance miroir animée) */
.yt-panel::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    linear-gradient(135deg,rgba(255,255,255,.1) 0%,transparent 35%),
    radial-gradient(ellipse at top left,rgba(255,255,255,.08),transparent 55%);
}
/* Lueur douce colorée derrière la vitre (animée) */
.yt-panel::after{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(circle at 15% 20%,rgba(255,61,104,.1),transparent 40%),
    radial-gradient(circle at 85% 80%,rgba(58,134,255,.12),transparent 45%);
  animation:ytGlow 8s ease-in-out infinite alternate;
}
@keyframes ytGlow{
  from{opacity:.5;transform:scale(1)}
  to{opacity:1;transform:scale(1.05)}
}
.yt-panel-header{
  position:relative;z-index:1;
  display:flex;align-items:center;justify-content:space-between;
  gap:18px;flex-wrap:wrap;
  padding:24px 28px;
  border-bottom:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
}
.yt-panel-title{display:flex;align-items:center;gap:14px}
.yt-panel-title h3{
  font-family:'Playfair Display',serif;
  font-size:clamp(1.2rem,2.2vw,1.6rem);font-weight:700;color:#fff;
  margin:0;letter-spacing:-.01em;
}
.yt-live-badge{
  display:inline-flex;align-items:center;gap:7px;
  padding:6px 13px;border-radius:999px;
  font-size:.68rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
  color:#fff;background:linear-gradient(135deg,#e91e63,#ff3d68);
  box-shadow:0 4px 14px rgba(233,30,99,.4);
}
.yt-panel-count{
  font-size:.84rem;color:var(--text-soft);font-weight:600;
  padding:7px 16px;border-radius:999px;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);
}
.yt-panel-count i{color:#ff0000;margin-right:5px}

/* Grille 6 colonnes x 2 lignes */
.yt-grid{
  position:relative;z-index:1;
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:16px;
  padding:24px 28px 28px;
}

/* Carte vidéo */
.yt-card{
  position:relative;
  border-radius:14px;
  overflow:hidden;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.1);
  cursor:pointer;
  transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s ease,border-color .4s ease,background .4s ease;
  animation:ytFadeIn .6s cubic-bezier(.2,.8,.2,1) both;
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
}
.yt-card:hover{
  transform:translateY(-8px) scale(1.02);
  box-shadow:0 24px 50px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.25);
  border-color:rgba(255,255,255,.3);
  background:rgba(255,255,255,.07);
}
@keyframes ytFadeIn{
  from{opacity:0;transform:translateY(16px) scale(.96)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
.yt-thumb{
  position:relative;aspect-ratio:16/9;overflow:hidden;background:#050818;
}
.yt-thumb img{
  width:100%;height:100%;object-fit:cover;
  transition:transform .5s ease,filter var(--t);
  filter:saturate(1.05);
}
.yt-card:hover .yt-thumb img{transform:scale(1.1);filter:saturate(1.2) brightness(.65)}
.yt-thumb::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 50%,rgba(13,17,51,.8));
  opacity:0;transition:opacity var(--t);pointer-events:none;
}
.yt-card:hover .yt-thumb::after{opacity:1}
.yt-play{
  position:absolute;top:50%;left:50%;
  width:48px;height:48px;border-radius:50%;
  transform:translate(-50%,-50%) scale(.6);
  background:linear-gradient(135deg,#ff0000,#e91e63);
  display:grid;place-items:center;
  color:#fff;font-size:1rem;
  opacity:0;transition:all var(--t);
  box-shadow:0 8px 22px rgba(255,0,0,.5);
}
.yt-card:hover .yt-play{opacity:1;transform:translate(-50%,-50%) scale(1)}
.yt-badge-yt{
  position:absolute;top:8px;left:8px;z-index:2;
  display:inline-flex;align-items:center;gap:4px;
  padding:3px 9px;border-radius:6px;
  font-size:.6rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;
  color:#fff;background:rgba(255,0,0,.92);
}
.yt-duration{
  position:absolute;bottom:8px;right:8px;z-index:2;
  padding:3px 8px;border-radius:5px;
  font-size:.66rem;font-weight:700;color:#fff;
  background:rgba(13,17,51,.88);
  backdrop-filter:blur(4px);
}
.yt-meta{padding:12px 13px 13px}
.yt-title{
  font-size:.84rem;font-weight:700;line-height:1.35;color:#fff;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden;
  text-shadow:0 1px 2px rgba(0,0,0,.3);
}
.yt-sub{
  font-size:.68rem;color:var(--text-dim);margin-top:6px;
  display:flex;align-items:center;gap:5px;font-weight:500;
}

/* Skeleton pendant chargement */
.yt-card-skeleton{grid-column:1/-1;display:grid;place-items:center;padding:60px 0;color:var(--text-dim)}
.yt-card-skeleton .spinner{border-top-color:var(--primary)}

/* Responsive grille vidéos */
@media (max-width:1100px){.yt-grid{grid-template-columns:repeat(4,1fr)}}
@media (max-width:760px){.yt-grid{grid-template-columns:repeat(3,1fr)}.yt-title{font-size:.76rem}}
@media (max-width:560px){
  .yt-grid{grid-template-columns:repeat(2,1fr);gap:11px;padding:16px}
  .yt-panel-header{padding:16px}
  .yt-play{width:40px;height:40px;font-size:.85rem}
  .article-meta{flex-direction:column;align-items:flex-start;gap:14px}
  .share-buttons{margin-left:0}
  .cat-search{width:100%}
  .section-head{flex-direction:column;align-items:stretch}
}
@media (max-width:380px){.yt-grid{grid-template-columns:1fr}}

/* ============================================================= */
/* PARTAGE : bouton sur cartes + modal réseaux sociaux          */
/* ============================================================= */
/* Bouton partage sur les cartes articles */
.card{position:relative}
.card-share-btn{
  position:absolute;top:10px;right:10px;z-index:5;
  width:36px;height:36px;border-radius:10px;
  display:grid;place-items:center;font-size:.85rem;color:#fff;
  background:rgba(10,14,39,.7);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.15);
  opacity:0;transform:scale(.6);
  transition:all var(--t);
}
.card:hover .card-share-btn,.card-share-btn:focus{opacity:1;transform:scale(1)}
.card-share-btn:hover{
  background:linear-gradient(135deg,var(--primary),var(--primary-2));
  border-color:transparent;transform:scale(1.1);
}
.card-share-btn i{transition:transform var(--t)}
.card-share-btn:hover i{transform:rotate(15deg)}
/* Sur mobile le bouton est toujours visible */
@media (max-width:760px){
  .card-share-btn{opacity:.9;transform:scale(1);width:32px;height:32px;font-size:.78rem}
}

/* Bouton "plus de partage" dans la page article */
.share-more-btn{
  width:38px;height:38px;border-radius:10px;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--primary),var(--primary-2));
  color:#fff;border:none;transition:all var(--t);
  box-shadow:0 4px 12px rgba(255,61,104,.4);
}
.share-more-btn:hover{transform:translateY(-2px) scale(1.05)}

/* Modal de partage */
.share-modal{
  position:fixed;inset:0;z-index:100;
  background:rgba(0,0,0,.75);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  display:grid;place-items:center;padding:20px;
  opacity:0;visibility:hidden;
  transition:opacity var(--t),visibility var(--t);
}
.share-modal.open{opacity:1;visibility:visible}
.share-modal-inner{
  position:relative;width:min(540px,100%);
  max-height:90vh;overflow-y:auto;
  background:rgba(15,20,56,.85);
  backdrop-filter:blur(24px) saturate(160%);
  -webkit-backdrop-filter:blur(24px) saturate(160%);
  border:1px solid rgba(255,255,255,.15);
  border-radius:24px;
  padding:28px;
  box-shadow:0 30px 80px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.1);
  transform:translateY(30px) scale(.96);
  transition:transform .4s cubic-bezier(.2,.8,.2,1);
}
.share-modal.open .share-modal-inner{transform:translateY(0) scale(1)}
.share-close{
  position:absolute;top:16px;right:16px;z-index:2;
  width:38px;height:38px;border-radius:10px;
  display:grid;place-items:center;color:#fff;font-size:1rem;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);
  transition:all var(--t);
}
.share-close:hover{background:var(--primary);border-color:transparent;transform:rotate(90deg)}

/* Aperçu de l'article (miniature + titre + description) */
.share-preview{
  display:flex;gap:14px;margin-bottom:22px;
  padding:14px;border-radius:16px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.1);
}
.share-preview img{
  width:110px;height:80px;object-fit:cover;border-radius:10px;flex-shrink:0;
  border:1px solid rgba(255,255,255,.1);
}
.share-preview-info{min-width:0;flex:1}
.share-preview-cat{
  display:inline-block;padding:2px 8px;border-radius:6px;
  font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
  color:#fff;background:linear-gradient(135deg,var(--primary),var(--primary-2));
  margin-bottom:6px;
}
.share-preview-info h3{
  font-size:.92rem;font-weight:700;line-height:1.3;color:#fff;margin:0 0 4px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.share-preview-info p{
  font-size:.74rem;color:var(--text-dim);line-height:1.4;margin:0;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}

.share-title{
  font-size:.78rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--text-soft);margin-bottom:14px;text-align:center;
}

/* Grille de boutons de partage */
.share-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:10px;
}
.share-btn{
  display:flex;flex-direction:column;align-items:center;gap:6px;
  padding:14px 8px;border-radius:14px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.1);
  color:var(--text);font-size:.74rem;font-weight:600;
  transition:all var(--t);text-align:center;cursor:pointer;
}
.share-btn i{font-size:1.3rem;transition:transform var(--t)}
.share-btn:hover{transform:translateY(-3px);background:rgba(255,255,255,.1)}
.share-btn:hover i{transform:scale(1.2)}
.sb-facebook:hover{color:#1877f2;border-color:#1877f2}
.sb-facebook i{color:#1877f2}
.sb-whatsapp:hover{color:#25d366;border-color:#25d366}
.sb-whatsapp i{color:#25d366}
.sb-twitter:hover{color:#fff;border-color:#fff}
.sb-twitter i{color:#fff}
.sb-telegram:hover{color:#0088cc;border-color:#0088cc}
.sb-telegram i{color:#0088cc}
.sb-linkedin:hover{color:#0a66c2;border-color:#0a66c2}
.sb-linkedin i{color:#0a66c2}
.sb-pinterest:hover{color:#e60023;border-color:#e60023}
.sb-pinterest i{color:#e60023}
.sb-reddit:hover{color:#ff4500;border-color:#ff4500}
.sb-reddit i{color:#ff4500}
.sb-email:hover{color:#fcbf49;border-color:#fcbf49}
.sb-email i{color:#fcbf49}
.sb-copy:hover{color:#06d6a0;border-color:#06d6a0}
.sb-copy i{color:#06d6a0}

@media (max-width:480px){
  .share-grid{grid-template-columns:repeat(2,1fr)}
  .share-modal-inner{padding:20px}
  .share-preview{flex-direction:column}
  .share-preview img{width:100%;height:160px}
}

/* Responsive */
@media (max-width:560px){
  .article-meta{flex-direction:column;align-items:flex-start;gap:14px}
  .share-buttons{margin-left:0}
  .cat-search{width:100%}
  .section-head{flex-direction:column;align-items:stretch}
}