/* Skydo Blog — habillage front ultra pro (hero, sommaire sticky, sliders) */

/* ===== Hero overlay (titre + pastille sur l'image) ===== */
.skydo-single-post .skydo-single-container{position:relative}
.skydo-single-post .post-hero-image{position:absolute;top:0;left:0;right:0;height:clamp(340px,46vw,520px);margin:0;z-index:0;border-radius:18px;overflow:hidden}
.skydo-single-post .post-hero-image img{width:100%;height:100%;object-fit:cover;border-radius:18px}
.skydo-single-post .post-hero{position:relative;z-index:1;min-height:clamp(340px,46vw,520px);display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;padding:clamp(20px,3vw,40px);border-radius:18px;background:linear-gradient(180deg,rgba(8,12,28,.05) 25%,rgba(8,12,28,.55) 70%,rgba(8,12,28,.9) 100%)}
.skydo-single-post .post-hero .post-cat-tag{order:2;align-self:flex-start;background:var(--skydo-cat,#E11D74);color:#fff;padding:6px 15px;border-radius:999px;font-weight:700;font-size:13px;letter-spacing:.04em;text-transform:uppercase;box-shadow:0 2px 10px rgba(0,0,0,.3);margin:0 0 12px}
.skydo-single-post .post-hero .post-title{order:3;color:#fff;margin:.1em 0 .5em;text-shadow:0 2px 16px rgba(0,0,0,.5)}
.skydo-single-post .post-hero .cat-hero-breadcrumb{order:1;margin-bottom:14px;font-size:13px}
.skydo-single-post .post-hero .cat-hero-breadcrumb a{color:rgba(255,255,255,.92);text-decoration:none}
.skydo-single-post .post-hero .cat-hero-breadcrumb .sep{color:rgba(255,255,255,.6)}
.skydo-single-post .post-hero .post-meta{order:4;color:rgba(255,255,255,.92)}
.skydo-single-post .post-hero .post-meta .name,.skydo-single-post .post-hero .post-meta .date{color:rgba(255,255,255,.92)}
.skydo-single-post .post-hero .post-share a{color:#fff;opacity:.9}

/* ===== Layout 2 colonnes avec sommaire sticky (PC) ===== */
.skydo-toc{display:none}
@media(min-width:1060px){
  .skydo-single-post .skydo-single-container.has-toc{display:grid;grid-template-columns:minmax(0,1fr) 270px;column-gap:46px;align-items:start}
  .skydo-single-post .skydo-single-container.has-toc>.post-hero,
  .skydo-single-post .skydo-single-container.has-toc>.post-hero-image{grid-column:1/-1}
  .skydo-single-post .skydo-single-container.has-toc>.post-content{grid-column:1;min-width:0}
  .skydo-single-post .skydo-single-container.has-toc>.skydo-toc{display:block;grid-column:2;position:sticky;top:90px;align-self:start;max-height:calc(100vh - 110px);overflow:auto}
}
.skydo-toc{background:#f7f8fb;border:1px solid #eceef3;border-radius:14px;padding:16px 16px}
.skydo-toc .toc-h{font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:#8a90a2;margin:0 0 10px}
.skydo-toc ul{list-style:none;margin:0;padding:0}
.skydo-toc a{display:block;padding:7px 10px;border-radius:8px;color:#46506b;text-decoration:none;font-size:14px;line-height:1.35;border-left:3px solid transparent;transition:background .12s}
.skydo-toc a:hover{background:#eef0f6}
.skydo-toc a.active{background:#fff;border-left-color:var(--skydo-cat,#E11D74);color:#111;font-weight:600}

/* ===== Blocs sliders (produits cités / articles liés) ===== */
.skydo-block{margin:52px 0 8px;clear:both}
.skydo-block-head h2{margin:0 0 16px;font-size:1.4rem;font-weight:800}
.skydo-slider{position:relative}
.skydo-slider .sld-track{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:6px 2px 18px;scrollbar-width:none;-ms-overflow-style:none}
.skydo-slider .sld-track::-webkit-scrollbar{display:none}
.skydo-slider .sld-nav{position:absolute;top:42%;transform:translateY(-50%);z-index:4;width:42px;height:42px;border-radius:50%;border:none;background:#fff;box-shadow:0 4px 16px rgba(0,0,0,.16);font-size:24px;line-height:1;color:#333;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .12s,opacity .12s}
.skydo-slider .sld-nav.prev{left:-12px}
.skydo-slider .sld-nav.next{right:-12px}
.skydo-slider .sld-nav:hover{background:var(--skydo-cat,#E11D74);color:#fff}
.sld-card{scroll-snap-align:start;flex:0 0 auto;text-decoration:none;border-radius:14px;overflow:hidden;transition:transform .15s ease,box-shadow .15s ease}
.sld-card:hover{transform:translateY(-3px);box-shadow:0 10px 26px rgba(0,0,0,.14)}

/* carte produit */
.sld-card.prod{width:210px;background:#fff;border:1px solid #eceef3;display:flex;flex-direction:column;padding:14px}
.sld-card.prod .sld-img{height:140px;display:flex;align-items:center;justify-content:center;margin-bottom:10px}
.sld-card.prod .sld-img img{max-width:100%;max-height:140px;object-fit:contain}
.sld-card.prod .sld-name{font-size:13.5px;color:#222;font-weight:600;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:36px}
.sld-card.prod .sld-price{display:block;font-weight:800;color:#111;margin:6px 0 10px;font-size:15px}
.sld-card.prod .sld-cta{margin-top:auto;text-align:center;background:var(--skydo-cat,#E11D74);color:#fff;font-weight:700;font-size:13px;padding:9px;border-radius:9px}

/* carte article */
.sld-card.art{width:280px;height:230px;position:relative;display:flex;flex-direction:column;justify-content:flex-end;padding:16px;color:#fff;box-shadow:0 6px 20px rgba(0,0,0,.12)}
.sld-card.art .art-img{position:absolute;inset:0;background-size:cover;background-position:center;z-index:0}
.sld-card.art:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,12,28,.12),rgba(8,12,28,.86));z-index:1}
.sld-card.art .art-chip,.sld-card.art .art-title{position:relative;z-index:2}
.sld-card.art .art-chip{align-self:flex-start;font-size:11px;font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:.04em;padding:4px 10px;border-radius:999px;margin-bottom:8px}
.sld-card.art .art-title{font-weight:700;font-size:15px;line-height:1.32;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* ===== Lisibilité (inspiration Clubic : sobre et aéré) ===== */
.skydo-single-post .post-content{font-size:1.05rem;line-height:1.78;color:#23262e}
.skydo-single-post .post-content h2{margin-top:1.9em;margin-bottom:.55em;line-height:1.25;letter-spacing:-.01em;scroll-margin-top:90px}
.skydo-single-post .post-content h3{margin-top:1.4em}
.skydo-single-post .post-content p{margin:0 0 1.15em}
.skydo-single-post .post-content blockquote{background:#f7f8fb;border-left:4px solid var(--skydo-cat,#E11D74);border-radius:0 10px 10px 0;padding:14px 18px;margin:1.4em 0}

/* ===== Page index blog (magazine, façon Clubic) ===== */
.skydo-cat-page .blog-cats{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 30px}
.skydo-cat-page .blog-cat{display:inline-flex;align-items:center;gap:6px;padding:9px 16px;border-radius:999px;border:1px solid #e2e5ec;background:#fff;color:#46506b;font-weight:600;font-size:14px;text-decoration:none;cursor:pointer;transition:all .12s;font-family:'Manrope',sans-serif}
.skydo-cat-page .blog-cat:hover{border-color:#cfd4df;background:#f7f8fb}
.skydo-cat-page .blog-cat.active{background:#0E1B3C;border-color:#0E1B3C;color:#fff}
.skydo-cat-page .blog-cat .count{opacity:.6;font-weight:600}

.skydo-cat-page .blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.skydo-cat-page .blog-card{display:flex;flex-direction:column;background:#fff;border:1px solid #eceef3;border-radius:16px;overflow:hidden;text-decoration:none;transition:transform .15s,box-shadow .15s}
.skydo-cat-page .blog-card:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(8,12,28,.13)}
.skydo-cat-page .blog-card-thumb{aspect-ratio:16/9;overflow:hidden;background:#0E1B3C}
.skydo-cat-page .blog-card-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.skydo-cat-page .blog-card-body{padding:15px 18px 18px;display:flex;flex-direction:column;gap:9px;flex:1}
.skydo-cat-page .blog-card .cat-tag{align-self:flex-start;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#fff;background:var(--card-cat,#2563EB);padding:4px 11px;border-radius:999px}
.skydo-cat-page .blog-card h3{font-family:'Manrope',sans-serif;font-weight:800;font-size:18px;line-height:1.26;color:#0E1B3C;margin:0;letter-spacing:-.01em}
.skydo-cat-page .blog-card .excerpt{font-size:14px;color:#5b6473;line-height:1.5;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.skydo-cat-page .blog-card .meta{font-size:12.5px;color:#8a90a2;margin-top:auto;display:flex;align-items:center;gap:8px}
.skydo-cat-page .blog-card .meta .avatar{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:#0E1B3C;color:#fff;font-size:10px;font-weight:700;margin-right:5px}

/* carte une-à-la-une : grande, horizontale */
.skydo-cat-page .blog-card.featured{grid-column:1/-1;flex-direction:row;align-items:stretch}
.skydo-cat-page .blog-card.featured .blog-card-thumb{flex:0 0 56%;aspect-ratio:auto;min-height:300px}
.skydo-cat-page .blog-card.featured .blog-card-body{flex:1;justify-content:center;padding:30px 36px;gap:12px}
.skydo-cat-page .blog-card.featured h3{font-size:27px;line-height:1.2}
.skydo-cat-page .blog-card.featured .excerpt{font-size:15.5px;-webkit-line-clamp:3}

.skydo-cat-page .blog-pagination{display:none} /* tout sur une page + filtre instantané */

@media(max-width:980px){
  .skydo-cat-page .blog-grid{grid-template-columns:repeat(2,1fr)}
  .skydo-cat-page .blog-card.featured{flex-direction:column}
  .skydo-cat-page .blog-card.featured .blog-card-thumb{flex:auto;aspect-ratio:16/9;min-height:0}
  .skydo-cat-page .blog-card.featured .blog-card-body{padding:18px}
  .skydo-cat-page .blog-card.featured h3{font-size:21px}
}
@media(max-width:600px){
  .skydo-cat-page .blog-grid{grid-template-columns:1fr;gap:18px}
}

/* ===== Hero blog repensé (mobile-first, navy premium) — scoped page blog uniquement ===== */
.page-template-page-blog .cat-hero{
  position:relative;overflow:hidden;isolation:isolate;
  background:linear-gradient(135deg,#0E1B3C 0%,#16245A 55%,#241a52 100%);
  border-radius:20px;padding:28px 22px;margin-bottom:10px;
  display:flex;flex-direction:column;gap:14px;min-height:0
}
.page-template-page-blog .cat-hero::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:radial-gradient(circle at 88% 12%,rgba(225,29,116,.5),transparent 46%),radial-gradient(circle at 6% 92%,rgba(37,99,235,.42),transparent 46%)
}
.page-template-page-blog .cat-hero-content{position:relative;z-index:2;max-width:680px;display:flex;flex-direction:column;gap:13px}
.page-template-page-blog .cat-hero-breadcrumb{font-size:13px;margin:0}
.page-template-page-blog .cat-hero-breadcrumb a,.page-template-page-blog .cat-hero-breadcrumb .current{color:rgba(255,255,255,.85);text-decoration:none}
.page-template-page-blog .cat-hero-breadcrumb .sep{color:rgba(255,255,255,.5)}
.page-template-page-blog .cat-hero h1{font-family:'Manrope',sans-serif;font-weight:800;color:#fff;font-size:clamp(28px,7vw,46px);line-height:1.08;letter-spacing:-.02em;margin:0}
.page-template-page-blog .cat-hero h1 em{font-style:normal;background:linear-gradient(90deg,#ff5fa2,#7aa2ff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.page-template-page-blog .cat-hero-desc{color:rgba(255,255,255,.82);font-size:clamp(14px,3.6vw,16px);line-height:1.6;margin:0;max-width:560px}
.page-template-page-blog .cat-hero-meta{display:flex;flex-wrap:wrap;gap:10px;margin:2px 0 0}
.page-template-page-blog .cat-hero-meta-item{display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#fff;font-size:13.5px;font-weight:600;padding:8px 14px;border-radius:999px}
.page-template-page-blog .cat-hero-meta-item strong{font-weight:800}
.page-template-page-blog .cat-hero-illustration{position:absolute;right:-12px;bottom:-24px;z-index:1;font-size:160px;color:rgba(255,255,255,.06);transform:rotate(-8deg);pointer-events:none;line-height:1}
@media(min-width:760px){
  .page-template-page-blog .cat-hero{padding:46px 52px;border-radius:24px;gap:16px}
  .page-template-page-blog .cat-hero-illustration{font-size:240px;right:34px;bottom:-36px;color:rgba(255,255,255,.08)}
}

/* ===== Largeur PC (façon Clubic : on occupe l'écran, plus de bandes vides) ===== */
.skydo-single-post .skydo-single-container{max-width:1200px}
.skydo-single-post .skydo-single-container:not(.has-toc)>.post-content{max-width:840px;margin-left:auto;margin-right:auto}
@media(min-width:1060px){
  .skydo-single-post .skydo-single-container.has-toc{grid-template-columns:minmax(0,1fr) 300px;column-gap:54px}
}

/* ===== Titres style Skydo (barre d'accent + Manrope), comme les sections "Meilleures ventes" ===== */
.skydo-single-post .post-content h2,
.skydo-single-post .skydo-block-head h2{
  font-family:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-weight:800;color:#0E1B3C;letter-spacing:-.02em;line-height:1.2;
  display:flex;align-items:center;gap:12px
}
.skydo-single-post .post-content h2::before,
.skydo-single-post .skydo-block-head h2::before{
  content:"";flex:0 0 auto;width:4px;height:1.05em;border-radius:2px;background:var(--skydo-cat,#2563EB)
}

/* ===== Fix visuel : ombre propre sur le hero (pas de double) ===== */
.skydo-single-post .post-hero-image{box-shadow:none!important}
.skydo-single-post .post-hero{box-shadow:0 14px 40px rgba(8,12,28,.16)}

/* ===== MOBILE (doit être parfait) ===== */
@media(max-width:760px){
  .skydo-single-post .post-hero-image{height:300px;border-radius:14px}
  .skydo-single-post .post-hero-image img{border-radius:14px}
  .skydo-single-post .post-hero{min-height:300px;padding:18px;border-radius:14px;background:linear-gradient(180deg,rgba(8,12,28,.08) 20%,rgba(8,12,28,.6) 65%,rgba(8,12,28,.92) 100%)}
  .skydo-single-post .post-hero .post-title{font-size:1.5rem;line-height:1.26}
  .skydo-single-post .post-hero .post-cat-tag{font-size:11px;padding:5px 12px}
  .skydo-single-post .post-hero .cat-hero-breadcrumb{display:none}
  .skydo-single-post .post-hero .post-share{display:none}
  .skydo-single-post .post-content{font-size:1.02rem;line-height:1.72}
  .skydo-slider .sld-nav{display:none}            /* sur mobile on swipe au doigt */
  .skydo-slider .sld-track{gap:14px}
  .skydo-block{margin:38px 0 6px}
  .skydo-block-head h2{font-size:1.22rem}
  .sld-card.art{width:230px;height:200px}
  .sld-card.prod{width:160px;padding:12px}
  .sld-card.prod .sld-img{height:110px}
  .sld-card.prod .sld-img img{max-height:110px}
}