/* =========================================================
   1) VARIABLES
   ========================================================= */
:root{
  --cs-radius:28px;
  --cs-link-color:#008bff;
  --cs-border-color:#ddd;
}
@media (max-width:991.98px){
  :root{--cs-radius:20px;}
}

/* =========================================================
   2) RESET LOCAL + BASE
   ========================================================= */
#new_content *{font-size:1em!important;line-height:1.5em;}
#new_content a{color:var(--cs-link-color);}
#new_content a:hover{text-decoration:underline;}
#new_content p, #new_content ul{color:#767676;}
#new_content header{position:relative;display:block;}
#new_content #intro{margin-top:6px;}
#new_content .breadcrumb{padding:0;}
#new_content .breadcrumb p{align-items:left;justify-content:left;}
#new_content .breadcrumb a{padding:0;color:var(--cs-link-color);}

/* =========================================================
   3) TYPO TITRES
   ========================================================= */
#new_content h1{padding:0;font-size:2.2em!important;width:90%;}
#new_content h2{padding:20px 0 6px 0;font-size:2em!important;width:90%;}
#new_content h3{padding:20px 0 6px 0;font-size:1.8em!important;width:90%;}
#new_content h4{padding:20px 0 6px 0;font-size:1.5em!important;width:90%;}
#new_content h5{padding:20px 0 6px 0;font-size:1.3em!important;width:90%;}
#new_content h6{padding:20px 0 6px 0;font-size:1.15em!important;width:90%;}
@media (max-width:991.98px){
  #new_content h1{font-size:1.8em!important;}
  #new_content h2{font-size:1.6em!important;}
  #new_content h3{font-size:1.5em!important;}
  #new_content h4{font-size:1.35em!important;}
  #new_content h5{font-size:1.2em!important;}
  #new_content h6{font-size:1.1em!important;}
}

/* =========================================================
   4) STRUCTURE PAGE
   ========================================================= */
#new_content .cs-page-elements{position:relative;padding:21px;margin:116px auto 0 auto;z-index:0}
#new_content .cs-page-layout{display:flex;gap:2rem;align-items:flex-start;}
#new_content .cs-main{flex:0 0 65%;max-width:65%;padding-right:24px;}
#new_content .cs-sidebar{width:33%;}
#new_content .ancre{scroll-margin-top:100px;}
@media (min-width:768px){
  #new_content .cs-page-elements{width:calc(100% - var(--gap-carousel) * 2);}
}
@media screen and (min-width:1600px){
  #new_content .cs-page-elements{width:calc(80vw - 3 * var(--gap-carousel));}
}
@media (max-width:991.98px){
  #new_content .cs-page-elements{width:90vw;margin-top:106px;padding:0;}
  #new_content header{padding:0;}
  #new_content .cs-page-layout{flex-direction:column;}
  #new_content .cs-main,#new_content .cs-sidebar{flex:0 0 100%;max-width:100%;padding-right:0;}
  #new_content .cs-grid-2x2{gap:16px!important;}
}
@media (max-width:768px){
  #new_content .cs-sidebar{width:100%;}
}

/* =========================================================
   5) TYPO CONTENU
   ========================================================= */
#new_content .cs-main > * + *{margin-top:1.5rem;}
#new_content .cs-main p{line-height:1.6;}
#new_content .cs-media-caption{text-align:right;font-style:italic;font-size:13px!important;color:#555;opacity:.8;margin-top:.5rem;}

/* =========================================================
   6) MEDIA (IMAGES)
   ========================================================= */
#new_content .cs-media{margin:2rem 0;}
#new_content .cs-media-figure{width:100%;border-radius:var(--cs-radius);overflow:hidden;}
#new_content .cs-media-figure img{width:100%;height:auto;display:block;border-radius:var(--cs-radius);}

/* =========================================================
   7) LISTES
   ========================================================= */
#new_content ul,#new_content ol{margin-top:12px;list-style-type:none;padding-left:0;}
#new_content ul li + li,#new_content ol li + li{margin-top:.25rem;padding-left:0;}
.puceArticle{width:18px;height:18px;display:inline;position:relative;top:3px;}

/* =========================================================
   8) BLOCKQUOTE
   ========================================================= */
#new_content blockquote{margin:.2rem 0;padding:1rem 1.25rem;font-style:italic;background:rgba(61,193,255,.3);border-radius:12px;color:#008cee;border:1px solid rgba(0,140,238,0.3);text-indent:25px;position:relative;}
#new_content blockquote:before {content:'';width:24px;height:24px;position:absolute;background:url(https://centreservicesdev.fr/assets/img/icons/info_outline_24dp_008CEE.svg) no-repeat center / cover;top:16px;left:17px;}

/* =========================================================
   9) TABLEAUX
   ========================================================= */
#new_content .cs-table-wrapper{overflow-x:auto;}
#new_content table{margin:12px 0;width:100%;border-collapse:collapse;border-radius:var(--cs-radius);overflow:hidden;}
#new_content th,#new_content td{text-align:left;padding:.75rem;border:1px solid rgba(0,0,0,.08);}
#new_content tr:nth-child(even){background:rgba(0,0,0,.02);}

/* =========================================================
   10) GRILLE 2x2
   ========================================================= */
#new_content .cs-grid-2x2{margin:20px 0;display:grid;gap:24px;grid-template-columns:repeat(2,1fr);}
#new_content .cs-grid-2x2 figure{margin:0;border-radius:var(--cs-radius);overflow:hidden;}
#new_content .cs-grid-2x2 img{width:100%;height:auto;display:block;border-radius:var(--cs-radius);}

/* =========================================================
   11) PARTAGE
   ========================================================= */
#new_content .cs-share{margin-top:40px;}
#new_content .cs-share h2{margin-bottom:16px;}
#new_content .cs-share-buttons{display:flex;gap:16px;flex-wrap:wrap;}
#new_content .cs-share-btn{display:flex;align-items:center;justify-content:center;width:52px;height:52px;background:#fff;border-radius:120px;border:1px solid #ccc;transition:transform .15s ease,box-shadow .15s ease;}
#new_content .cs-share-btn img{width:40px;height:40px;}
#new_content .cs-share-btn:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(0,0,0,.12);}
#new_content .cs-share-btn.facebook{background:#1877F2!important;border:1px solid #0f66d6;}
#new_content .cs-share-btn.facebook img{filter:brightness(0) invert(1);}
#new_content .cs-share-btn.facebook:hover{background:#0f66d6!important;}
@media (max-width:991.98px){
  #new_content .cs-share{text-align:center;}
  #new_content .cs-share-buttons{justify-content:center;}
}

/* =========================================================
   12) SIDEBAR – ARTICLES
   ========================================================= */
#new_content .cs-sidebar-articles{list-style:none;padding:0;margin:0;}
#new_content .cs-sidebar-articles li{border-bottom:1px solid var(--cs-border-color);}
#new_content .cs-sidebar-articles li:last-child{border-bottom:0!important;}
#new_content .cs-sidebar-articles li + li{margin-top:10px;}
#new_content .cs-sidebar-articles a{text-decoration:none;color:var(--cs-link-color);font-size:.95em;line-height:1.4;display:block;opacity:.85;transition:opacity .2s;padding-bottom:6px;}
#new_content .cs-sidebar-articles a:hover{text-decoration:underline;opacity:1;}

/* =========================================================
   13) SIDEBAR – BLOCS
   ========================================================= */
#new_content .cs-sidebar-block{background:rgba(0,0,0,.05);border-radius:var(--cs-radius);padding:1.5rem;margin-bottom:1.25rem;}
#new_content .cs-sidebar-block--tall{min-height:220px;border:1px solid var(--cs-border-color);background:#fff;}
#new_content .cs-sidebar-block--medium{min-height:150px;border:1px solid var(--cs-border-color);}
#new_content .cs-sidebar-block--small{min-height:100px;border:1px solid var(--cs-border-color);}
#new_content .cs-sidebar-block-title{font-weight:600;font-size:1.2em!important;margin-bottom:.5rem;}
#new_content .cs-sidebar-block-placeholder{font-size:.85rem;}

/* =========================================================
   14) QUICKLINKS
   ========================================================= */
#new_content .cs-quicklinks{margin:16px 0 24px 0;display:flex;flex-wrap:wrap;gap:12px;}
#new_content .cs-quicklinks a{padding:6px 12px;background:rgba(0,0,0,.05);border-radius:var(--cs-radius);text-decoration:none;font-size:.9em!important;border:1px solid var(--cs-border-color);color:var(--cs-link-color);}
#new_content .cs-quicklinks a:hover{background:rgba(0,0,0,.1);}

/* =========================================================
   15) SOMMAIRE
   ========================================================= */
#new_content .cs-toc{margin:10px 0 24px 0;}
#new_content .cs-toc h3{margin:0 0 12px 0;font-size:1.3em!important;}
#new_content .cs-toc ul{list-style:none;padding:0;margin:0;}
#new_content .cs-toc li + li{margin-top:6px;}
#new_content .cs-toc a{text-decoration:none;color:var(--cs-link-color);opacity:.85;transition:opacity .2s;}
#new_content .cs-toc a:hover{opacity:1;}

/* =========================================================
   16) FAQ
   ========================================================= */
#new_content .cs-faq{margin-top:40px;}
#new_content .cs-faq-item{margin-bottom:18px;margin-top:10px!important;border-radius:var(--cs-radius);background:rgba(0,0,0,.03);padding:0;overflow:hidden;border:1px solid var(--cs-border-color);}
#new_content .cs-faq-toggle{width:100%;padding:1rem 1.5rem;display:flex;justify-content:space-between;align-items:center;background:none;border:none;text-align:left;cursor:pointer;}
#new_content .cs-faq-toggle h4{margin:0;font-size:1.2em!important;padding-top:0;color:#000}
#new_content .cs-faq-icon{font-size:1.4em;font-weight:bold;margin-left:10px;}
#new_content .cs-faq-content{max-height:0;overflow:hidden;padding:0 18px;transition:max-height .35s ease,padding .35s ease;}
#new_content .cs-faq-content p{margin:14px 0;}
#new_content .cs-faq-item.open .cs-faq-content{max-height:400px;padding:0 18px 18px 18px;}

/* =========================================================
   17) RADIUS GLOBAL (UNIFORMISÉ)
   ========================================================= */
#new_content .radius_defaut,
#new_content img,
#new_content .cs-media-figure,
#new_content .cs-sidebar-block,
#new_content .cs-grid-2x2 figure,
#new_content table,
#new_content pre{border-radius:var(--cs-radius)!important;overflow:hidden;}

/* =========================================================
   18) STICKY GROUPE SIDEBAR
   ========================================================= */
@media (min-width:992px){
  #new_content .cs-sticky-group{transition:opacity .35s ease;}
  #new_content .cs-sticky-group.is-sticky{position:fixed;top:126px;z-index:10;}
  #new_content .cs-sticky-group.is-hidden{opacity:0;pointer-events:none;}
}

/* =========================================================
   19) DERNIÈRES ACTUS – GRILLE
   ========================================================= */
#new_content .cs-articles{margin-top:40px;}
#new_content .cs-articles h2{margin-bottom:18px;}
#new_content .cs-articles-grid{display:grid;gap:20px 24px;grid-template-columns:repeat(3,minmax(0,1fr));}
@media (max-width:1199.98px){
  #new_content .cs-articles-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:767.98px){
  #new_content .cs-articles-grid{grid-template-columns:minmax(0,1fr);}
}
#new_content .cs-article-card{background:#fff;border-radius:var(--cs-radius);border:1px solid var(--cs-border-color);overflow:hidden;display:flex;flex-direction:column;height:100%;}
#new_content .cs-article-thumb{width:100%;aspect-ratio:4/3;overflow:hidden;position:relative;}
#new_content .cs-article-thumb img{width:100%;height:100%;object-fit:cover;display:block;border-radius:0!important;}
#new_content .cs-article-thumb--placeholder{background:#f2f2f2;display:flex;align-items:center;justify-content:center;color:rgba(0,0,0,.25);font-size:3rem;font-weight:300;}
#new_content .cs-article-thumb--placeholder span{display:block;line-height:1;}
#new_content .cs-article-card h3{margin:12px 14px 4px 14px;font-size:1.05em!important;}
#new_content .cs-article-card h3 a{text-decoration:none;color:var(--cs-link-color);}
#new_content .cs-article-card h3 a:hover{text-decoration:underline;}
#new_content .cs-article-meta{margin:0 14px 12px 14px;font-size:.85em;opacity:.7;}

/* =========================================================
   20) MODULE AVIS (SIDEBAR AVIS + ÉTOILES)
   ========================================================= */
#new_content #sidebar_avis{background:url('https://centreservicesdev.fr/assets/img/ciel-01.jpg') no-repeat top left / cover;color:#fff;}
#new_content #sidebar_avis p{color:#fff!important;}
#new_content #sidebar_avis #etoiles{position:relative;top:0;}
#new_content #sidebar_avis #etoiles img{display:inline;width:22px;height:22px;transition:all ease .1s;filter:brightness(0) saturate(100%) invert(85%) sepia(31%) saturate(724%) hue-rotate(347deg) brightness(105%) contrast(103%)!important;transform:scale(1.1)!important;}
#new_content #sidebar_avis .cs-sidebar-block-placeholder img{display:inline;width:55px;position:relative;top:4.3px;left:2px;}
#new_content .btn{background:#fff;padding:5px 18px;display:inline-block;border-radius:50px;color:#00a2ff;}
#new_content #etoiles .star{position:relative;top:0;animation:star-wave-top 2.5s ease-in-out infinite;}
#new_content #etoiles .star:nth-of-type(1){animation-delay:0s;}
#new_content #etoiles .star:nth-of-type(2){animation-delay:.15s;}
#new_content #etoiles .star:nth-of-type(3){animation-delay:.30s;}
#new_content #etoiles .star:nth-of-type(4){animation-delay:.45s;}
#new_content #etoiles .star:nth-of-type(5){animation-delay:.60s;}
@keyframes star-wave-top{
  0%,70%,100%{top:0;}
  40%{top:-6px;}
}

/* =========================================================
   21) ANIMATION IMAGE (OVERLAY)
   ========================================================= */
#new_content .cs-img-animation{position:relative;width:100%;}
#new_content .cs-img-animation img{display:block;width:100%;}
#new_content .cs-img-animation img:first-of-type{position:relative;z-index:1;}
#new_content .cs-img-animation img:nth-of-type(2),
#new_content .cs-img-animation img:nth-of-type(3){position:absolute;top:0;left:0;width:100%;z-index:2;}

#new_content .cs-img-animation img:nth-of-type(2){animation:slide-right-left 10s ease-in-out infinite;will-change:transform;}

/* =========================================================
   22) FOOTER
   ========================================================= */
footer{padding:21px;}