/* ============================================================================
   TDC Classic — portage du thème Drupal 7 "tdc_theme" vers Drupal 11.
   Palette & structure fidèles à l'original.
   Palette : texte #3b3b3b ; liens #0071B3 (hover #018fe2) ;
   header #c7dce1 + inset-banner.jpg ; contenu #fff ; footer #292929 ;
   blocs sidebar #f6f6f2 ; titres Tahoma.
   ============================================================================ */

/* ------------------- Reset / base ------------------- */
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  padding: 0;
  line-height: 1.5;
  font-size: 14px;
  color: #3b3b3b;
  font-family: Georgia, "Times New Roman", Times, serif;
  background: #292929;              /* dark wrapper color showing around page */
  word-wrap: break-word;
}
img { max-width: 100%; height: auto; border: 0; vertical-align: middle; }
a { color: #0071B3; text-decoration: none; }
a:hover, a:focus { color: #018fe2; text-decoration: underline; }
a:active { color: #23aeff; }

h1, h2, h3, h4, h5, h6 {
  margin: 1.0em 0 0.5em;
  font-weight: normal;
  font-family: Tahoma, Geneva, sans-serif;
  line-height: 1.2;
  color: #222;
}
h1 { font-size: 1.9em; color: #000; }
h2 { font-size: 1.3em; }
p { margin: 0 0 1.2em; }

span.clear { display: block; clear: both; height: 0; }
.clearfix::after { content: ""; display: table; clear: both; }

/* ------------------- Page frame ------------------- */
#page-wrapper { background: #292929; }
#page {
  background: #ffffff;
  max-width: 1290px;
  margin: 0 auto;
  padding: 0;
}

/* ------------------- Header (light banner) ------------------- */
#header {
  background: #c7dce1 url("../images/inset-banner.jpg") no-repeat 100% 0;
  color: #333;
  overflow: visible;
}
#header .section { padding: 10px 15px; min-height: 152px; }

#logo { float: left; padding: 6px 10px 0 0; }
#logo img { max-height: 56px; width: auto; }

/* Site name "ThéologieduCorps" — the branding block prints the raw site name;
   we colour it via text; the 'du' in red is handled by a span if present. */
#name-and-slogan { float: left; margin: 0; padding: 0; }
#site-name {
  margin: 0;
  line-height: 1;
}
#site-name a {
  font-family: Tahoma, Geneva, sans-serif;
  font-weight: bold;
  font-size: 34px;
  color: #0b4a5a;            /* dark teal */
  text-decoration: none;
  letter-spacing: -1px;
}
#site-name a:hover { text-decoration: none; }
#site-slogan {
  font-family: Georgia, serif;
  font-style: italic;
  font-size: 13px;
  color: #6b6b6b;
  margin-top: 2px;
}

/* secondary / account menu — discreet, top-right */
#secondary-menu { position: absolute; top: 6px; right: 12px; z-index: 10; }
#secondary-menu ul { list-style: none; margin: 0; padding: 0; }
#secondary-menu li { display: inline-block; margin-left: 10px; }
#secondary-menu a { font-size: 11px; color: #5a7a82; font-family: "Helvetica Neue", Arial, sans-serif; }

/* ------------------- Main menu : barre d'onglets ------------------- */
#main-menu { background: transparent; border-bottom: none; }
#main-menu .section { padding: 0 12px; }
ul#main-menu-links {
  list-style: none;
  margin: 0;
  padding: 6px 0 0;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
ul#main-menu-links > li {
  float: left;
  margin: 0 4px 0 0;
  padding: 0;
  list-style: none;
}
ul#main-menu-links > li > a {
  display: block;
  padding: 7px 14px 6px;
  font-size: 13px;
  color: #333;
  background: #f3f3f3;
  border: 1px solid #cfcfcf;
  border-bottom: none;
  border-radius: 5px 5px 0 0;
  text-decoration: none;
}
ul#main-menu-links > li > a:hover { background: #ffffff; color: #0071B3; }
ul#main-menu-links > li.active-trail > a,
ul#main-menu-links > li > a.is-active {
  background: #ffffff;
  color: #000;
  border-color: #cfcfcf;
  position: relative;
  z-index: 2;
}
/* submenu hidden by default, revealed on hover */
ul#main-menu-links li .submenu { display: none; }

/* ------------------- Hero / diaporama ------------------- */
#hero { background: #c7dce1; }
#hero .section { padding: 0; }
.view-slideshow-accueil { position: relative; }
.view-slideshow-accueil .tdc-slide, .view-slideshow-accueil .views-row {
  position: relative;
}
.view-slideshow-accueil .tdc-slide .views-field-field-slideshow-image img,
.view-slideshow-accueil .views-row img {
  display: block; width: 100%; height: auto;
}
.view-slideshow-accueil .views-field-title {
  position: absolute; left: 0; bottom: 0; right: 0;
  padding: 6px 12px; background: rgba(199,220,225,.75);
  font-family: Tahoma, sans-serif; font-size: 13px;
}
.view-slideshow-accueil .views-field-title a { color: #0b4a5a; }

/* carousel (ported JS adds .tdc-carousel wrapper) */
.tdc-carousel { position: relative; overflow: hidden; width: 100%; }
.tdc-carousel-track { display: flex; transition: transform .5s ease; }
.tdc-carousel-track > * { flex: 0 0 100%; min-width: 100%; margin: 0; }

/* Progressive enhancement: before JS builds the carousel, only show the
   first slide so the hero is never a tall stack. */
.view-slideshow-accueil .views-row:not(:first-child),
.view-slideshow-accueil .tdc-slide:not(:first-child) { display: none; }
/* Once JS wraps slides in .tdc-carousel-track, reveal them all. */
.tdc-carousel-track .views-row,
.tdc-carousel-track .tdc-slide { display: block !important; }
.tdc-carousel .tdc-nav {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 40px; height: 40px; border-radius: 50%; border: none;
  background: rgba(11,74,90,.55); color: #fff; font-size: 24px; cursor: pointer; z-index: 5;
}
.tdc-carousel .tdc-prev { left: 10px; }
.tdc-carousel .tdc-next { right: 10px; }
.tdc-carousel .tdc-nav:hover { background: rgba(11,74,90,.85); }
.tdc-dots { position: absolute; bottom: 8px; left: 0; right: 0; text-align: center; z-index: 5; }
.tdc-dots .tdc-dot {
  width: 10px; height: 10px; margin: 0 3px; padding: 0; border-radius: 50%;
  border: none; background: rgba(255,255,255,.6); cursor: pointer;
}
.tdc-dots .tdc-dot.is-active { background: #0b4a5a; }

/* ------------------- Main layout : 2 colonnes ------------------- */
#main-wrapper { background: #ffffff; }
#main { padding: 15px 15px 30px; }

#main.two-columns #content { float: left; width: 72%; }
#main.two-columns #sidebar-second { float: right; width: 26%; }
#main.one-column #content { width: 100%; }
#content .section { padding: 0 10px 0 0; }

/* page title */
h1#page-title, h1.page-title, .page-title {
  font-size: 1.9em; margin: 0.2em 0 0.6em; color: #000;
  font-family: Tahoma, Geneva, sans-serif; font-weight: normal;
}

/* breadcrumb */
.breadcrumb, nav[role="navigation"].breadcrumb {
  font-size: 12px; color: #777; padding: 6px 0;
}
.breadcrumb a { color: #0071B3; }

/* ------------------- Local tasks / system tabs ------------------- */
.tabs ul.primary, ul.tabs.primary, nav.tabs ul {
  list-style: none; margin: 0 0 15px; padding: 0 0 0;
  border-bottom: 1px solid #ccc; overflow: visible;
}
ul.tabs.primary li { float: left; margin: 0 4px 0 0; }
ul.tabs.primary li a {
  display: block; padding: 4px 10px; background: #ededed;
  border: 1px solid #ccc; border-bottom: none; border-radius: 5px 5px 0 0;
  font-size: 12px; color: #000; text-decoration: none;
}
ul.tabs.primary li a.is-active { background: #fff; }

/* ============================================================================
   HOMEPAGE
   ============================================================================ */

/* --- À la une (featured) : vignette flottée à gauche, petite --- */
.view-a-la-une .alaune, .alaune {
  background-color: rgba(211, 230, 236, 0.3);
  margin: 0 0 1.5em;
  padding: 12px 14px;
  border: 1px solid #ddd;
  overflow: visible;
}
.alaune .views-field-field-slideshow-image,
.alaune .nodeimage,
.alaune .field--name-field-artimage,
.alaune img {
  float: left;
  margin: 0 15px 8px 0;
}
.alaune img { max-width: 190px; width: auto; height: auto; }
.alaune .views-field-title,
.alaune .title {
  font-family: Tahoma, Geneva, sans-serif;
  border-bottom: #ddd 2px solid;
  margin-bottom: 8px;
}
.alaune .views-field-title a,
.alaune .title a {
  color: #02576b; font-size: 23px; line-height: 1.1;
  font-weight: normal; text-decoration: none;
  font-family: Tahoma, Geneva, sans-serif;
}

/* --- Section headings on home ("Derniers articles", "Ressources", themes) --- */
.block-views h2,
.view .view-header h3,
.section-heading {
  font-family: Tahoma, Geneva, sans-serif;
  font-size: 1.15em; font-weight: bold; color: #333;
  border-bottom: 2px solid #ddd; padding-bottom: 4px; margin: 1.2em 0 0.8em;
}

/* --- "Derniers articles" / ressources : grille 3 colonnes compacte --- */
.view-tdc-blog .views-view-grid,
.view-ressources-accueil .views-view-grid,
.view-news-items .views-view-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.view-tdc-blog .views-view-grid .views-view-grid__item,
.view-ressources-accueil .views-view-grid .views-view-grid__item,
.view-news-items .views-view-grid .views-view-grid__item {
  width: auto !important; margin: 0 !important; padding: 0 !important;
}
.view-tdc-blog .views-row,
.view-ressources-accueil .views-row {
  font-size: 13px; line-height: 1.45;
}
.view-tdc-blog .views-field-title a { font-weight: bold; color: #222; font-family: Tahoma, sans-serif; }
.view-tdc-blog img, .view-ressources-accueil img { max-width: 130px; height: auto; }
.view-tdc-blog .submitted, .view-ressources-accueil .submitted,
.view-tdc-blog .views-field-created { font-size: 11px; color: #777; }

/* --- categories grid (thematic link sections) : multi-colonnes --- */
.view-categories .views-view-grid {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px 40px;
}
.view-categories .views-view-grid__item { width: auto !important; margin: 0 !important; }
.view-categories h3, .view-categories .views-field-name {
  font-family: Tahoma, sans-serif; font-weight: bold; color: #333;
  border-bottom: 2px solid #ddd; padding-bottom: 3px; margin-bottom: 6px;
}
.view-categories ul, .view-categories .item-list ul { margin: 0; padding: 0; list-style: none; }
.view-categories li { margin: 0 0 2px; }
.view-categories a { color: #0071B3; font-size: 13px; }

/* node teasers generic */
.node--view-mode-teaser { padding-bottom: 12px; margin-bottom: 12px; }
.node--view-mode-teaser h2 { font-size: 1.15em; margin: 0 0 4px; }

/* article full image floated small */
.node--type-story .field--name-field-artimage,
.node .field--name-field-artimage { float: left; margin: 0 16px 10px 0; }
.node--type-story .field--name-field-artimage img { max-width: 200px; height: auto; }

/* ============================================================================
   SIDEBAR (colonne de droite) — blocs sobres gris clair
   ============================================================================ */
#sidebar-second .section { padding: 0 0 0 10px; }
#sidebar-second .block {
  background: #f6f6f2;
  border: 1px solid #e4e4df;
  padding: 12px 14px;
  margin: 0 0 18px;
  font-size: 13px;
  line-height: 1.4;
}
#sidebar-second .block > h2,
#sidebar-second .block__title {
  margin: 0 0 0.5em; padding-bottom: 5px;
  border-bottom: 1px solid #d6d6d6;
  font-family: Tahoma, Geneva, sans-serif; font-weight: bold;
  font-size: 1.0em; color: #ab0900; text-transform: none;
}
#sidebar-second ul { margin: 0; padding: 0 0 0 1em; }
#sidebar-second img { max-width: 100%; height: auto; }

/* pull-quote (random_quote view) */
#sidebar-second .view-random-quote .tdc-quote,
.view-random-quote .tdc-quote {
  font-style: italic; text-align: right; color: #333;
  border-left: 3px solid #c7dce1; padding-left: 10px;
}
.view-random-quote .views-field-field-auteur,
.view-random-quote .tdc-quote .author { font-size: 11px; color: #777; }

/* Forum Wahou image block */
#sidebar-second .forum-wahou { background: transparent; border: none; padding: 0; text-align: center; }
#sidebar-second .forum-wahou img { max-width: 100%; }

/* RSS / abonnez-vous links */
#sidebar-second .feed-links a,
#sidebar-second .rss-links a {
  display: block; padding: 3px 0 3px 22px;
  background: url("../images/feed.svg") no-repeat 0 4px; background-size: 16px;
}

/* search box */
#sidebar-second .search-block-form .form-item,
#sidebar-second form input[type="search"],
#sidebar-second form input[type="text"] { width: 100%; max-width: 170px; }

/* book navigation keeps sober look */
#sidebar-second .book-navigation .menu { border-top: 1px solid #d6d6d6; }
#sidebar-second nav.book-navigation ul { padding-left: 1em; }

/* ============================================================================
   FOOTER (bande sombre)
   ============================================================================ */
#footer-wrapper {
  background: #292929;
  color: rgba(255,255,255,.65);
  font-size: 13px;
}
#footer-inner { max-width: 1290px; margin: 0 auto; padding: 24px 15px; }
#footer-wrapper a { color: rgba(255,255,255,.85); }
#footer-wrapper a:hover { color: #fff; }
#footer-columns { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
#footer-columns h2, #footer-columns .block__title {
  font-size: 1em; text-transform: uppercase; color: #fff;
  border-bottom: 1px solid rgba(255,255,255,.15); padding-bottom: 4px; margin: 0 0 8px;
}
#footer-columns ul { list-style: none; margin: 0; padding: 0; }
#footer-columns li a {
  display: block; padding: 6px 0; border-bottom: 1px solid rgba(255,255,255,.12);
}
#footer { margin-top: 18px; border-top: 1px solid rgba(255,255,255,.15); padding-top: 12px; }
#footer ul { list-style: none; margin: 0; padding: 0; }
#footer li { display: inline-block; margin-right: 14px; }

/* ------------------- Blocks generic ------------------- */
.block { margin-bottom: 1em; }
.region--content .block { margin-bottom: 1.2em; }

/* ------------------- Forms ------------------- */
input.form-text, input[type="text"], input[type="search"], input[type="email"],
textarea, select {
  border: 1px solid #ccc; padding: 4px; font-size: 13px; border-radius: 3px;
}
input.form-submit, button, .button {
  background: #ededed; border: 1px solid #cfcfcf; border-radius: 15px;
  padding: 4px 14px; color: #3a3a3a; cursor: pointer; font-size: 13px;
}
input.form-submit:hover, button:hover { background: #e0e0e0; }

/* ------------------- Comments ------------------- */
.comment { margin-bottom: 18px; }
.comment .comment__meta { font-size: 12px; color: #68696b; }

/* ============================================================================
   RESPONSIVE
   ============================================================================ */
@media all and (max-width: 1024px) {
  #main.two-columns #content,
  #main.two-columns #sidebar-second { float: none; width: 100%; }
  #content .section, #sidebar-second .section { padding: 0; }
  .view-tdc-blog .views-view-grid,
  .view-ressources-accueil .views-view-grid { grid-template-columns: repeat(2, 1fr); }
}
@media all and (max-width: 700px) {
  #header .section { padding: 8px 10px; }
  #site-name a { font-size: 26px; }
  ul#main-menu-links > li { float: none; margin: 0 0 3px; }
  ul#main-menu-links > li > a { border-radius: 4px; border-bottom: 1px solid #cfcfcf; }
  .view-tdc-blog .views-view-grid,
  .view-ressources-accueil .views-view-grid,
  .view-categories .views-view-grid,
  .view-news-items .views-view-grid { grid-template-columns: 1fr; }
  #footer-columns { grid-template-columns: 1fr 1fr; }
  .alaune img { max-width: 130px; }
}

/* À la Une: small floated thumbnail like D7 */
.view-id-a_la_une .alaune-thumb,
.view-id-a_la_une .views-field-field-artimage { float: left; margin: 0 1em 0.5em 0; max-width: 180px; }
.view-id-a_la_une .alaune-thumb img,
.view-id-a_la_une .views-field-field-artimage img { max-width: 180px; height: auto; }
.view-id-a_la_une .views-row { overflow: visible; }

/* ===== Fixes round 2 ===== */
/* (3) Slideshow: white background, centered slides */
#hero { background: #ffffff; }
.tdc-carousel, .view-slideshow-accueil { background: #ffffff; max-width: 760px; margin: 0 auto; }
.tdc-carousel-track > * { text-align: center; background: #ffffff; }
.view-slideshow-accueil .views-field-field-slideshow-image img,
.view-slideshow-accueil .views-row img,
.tdc-carousel-track img { margin: 0 auto; display: block; max-width: 100%; height: auto; }

/* (4) A la Une: let the body's own cover float left, constrain it */
.view-id-a_la_une .field--name-body img,
.view-id-a_la_une .views-field-body img { float: left; max-width: 170px; height: auto; margin: 0 1em 0.5em 0; }
.view-id-a_la_une .views-row { overflow: visible; }

/* (7) Social icons */
.social-links { margin: 0.3em 0 0; }
.social-ico { display: inline-block; width: 28px; height: 28px; margin-right: 8px; border-radius: 4px; text-indent: -9999px; overflow: visible; vertical-align: middle; background-size: 18px; background-repeat: no-repeat; background-position: center; }
.social-fb { background-color: #1877f2; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M22 12a10 10 0 1 0-11.6 9.9v-7H8v-2.9h2.4V9.8c0-2.4 1.4-3.7 3.6-3.7 1 0 2 .2 2 .2v2.3h-1.1c-1.1 0-1.5.7-1.5 1.4v1.7H16l-.4 2.9h-2.2v7A10 10 0 0 0 22 12z'/%3E%3C/svg%3E"); }
.social-tw { background-color: #000000; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M18.9 2H22l-7 8 8.2 12H17l-5-7-5.8 7H3l7.5-9L2.5 2H9l4.5 6.3L18.9 2z'/%3E%3C/svg%3E"); }

/* (2) Page title top-left */
.region-content .block-page-title-block { margin: 0 0 0.5em; }
.region-content .block-page-title-block h1 { text-align: left; margin: 0 0 0.3em; }

/* ===== Fixes round 3: constrain content images ===== */
/* Any image inside node content / views must never overflow its column */
.region-content img,
.node__content img,
.field--name-body img,
.views-field-body img,
.views-row img { max-width: 100%; height: auto; }
/* Article/resource listing cover images: cap to a sensible thumbnail and float */
.view-id-tdc_blog .views-field-field-artimage img,
.view-id-ressources_accueil .views-field-field-artimage img,
.view-id-tdc_blog .field--name-body img,
.node--view-mode-teaser .field--name-body img { max-width: 150px; float: left; margin: 0 1em 0.5em 0; }
.node--view-mode-teaser .views-row,
.view-content .views-row { overflow: visible; }

/* ===== Fixes round 4: hard image constraint (legacy inline D7 imgs) ===== */
/* Catch EVERY image in the main content column, including legacy absolute-URL
   body images from the old D7 site, regardless of width attributes. */
#content img,
.region-content img,
.layout-content img,
main img,
.views-row img,
.field img {
  max-width: 100% !important;
  height: auto !important;
}
/* Teaser/listing cover images: keep them as modest floated thumbnails */
.view-id-tdc_blog .views-row img,
.view-id-ressources_accueil .views-row img {
  max-width: 150px !important;
  float: left;
  margin: 0 1em 0.5em 0;
}

/* ===== Fixes round 5: inline breadcrumb with » separators ===== */
.breadcrumb__list {
  list-style: none;
  margin: 0 0 1em;
  padding: 0;
  font-size: 0.9em;
  color: #777;
}
.breadcrumb__list li,
.breadcrumb__item {
  display: inline;
  list-style: none;
}
.breadcrumb__item + .breadcrumb__item::before {
  content: " \00bb ";
  padding: 0 0.4em;
  color: #999;
}
.breadcrumb__list a { color: #0071B3; text-decoration: none; }
.breadcrumb__list a:hover { text-decoration: underline; }

/* ===== Fixes round 6: hero height to match D7 ===== */
#hero { background: #ffffff; }
#hero .section { min-height: 340px; }
.tdc-carousel, .view-slideshow-accueil { max-width: 900px; }
.tdc-carousel-track img,
.view-slideshow-accueil .views-row img { max-height: 340px; width: auto; margin: 0 auto; display: block; }
.tdc-carousel { min-height: 300px; }


/* ===== Fixes round 7 (v3) ===== */
#header { position: relative; overflow: visible; min-height: 152px; }
#main-menu { position: absolute; bottom: 0; left: 0; right: 0; z-index: 20; background: transparent; border-bottom: none; }
#main-menu .section { min-height: 0; padding: 0 12px; }
#site-name { display: none; }
/* ===== Logo/slogan stack: slogan directly under logo ===== */
#logo { float: none; display: block; padding: 6px 0 0; }
#name-and-slogan { float: none; clear: both; display: block; margin: 2px 0 0; padding: 0; }
#site-slogan { margin: 0; }


/* ===== Carousel: show full image, zero cropping (native 696x241) ===== */
.tdc-carousel { position: relative; overflow: hidden; width: 100%; min-height: 0 !important; }
.tdc-carousel-track { display: flex; align-items: flex-start; }
.tdc-carousel-track > * { flex: 0 0 100%; min-width: 100%; margin: 0; display: block; }
.view-slideshow-accueil .views-field-field-slideshow-image img,
.view-slideshow-accueil .views-row img,
.tdc-carousel-track img {
  display: block;
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
  object-fit: fill !important;
  margin: 0 !important;
}
#hero .section { min-height: 0 !important; }

/* ===== Home lower sections (categories grid + spacing) ===== */
/* (1) separate A la Une from Derniers articles */
.block-views-blocka-la-une-block-1, #block-tdc-classic-alaune { margin-bottom: 2.5em; padding-bottom: 1.5em; border-bottom: 2px solid #e2e2e2; }
#block-tdc-classic-recent-articles { margin-top: 1.5em; }
/* (2c) Categories 2-column grid, D7 style */
.tdc-cat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 40px; margin: 0 0 1.5em; }
.tdc-cat-title { font-size: 1.15em; font-weight: normal; color: #333; border-bottom: 1px solid #ccc; margin: 0.6em 0 0.4em; padding-bottom: 3px; }
.tdc-cat-title a { color: #333; text-decoration: none; }
.tdc-cat-list { list-style: none; margin: 0; padding: 0; }
.tdc-cat-list li { margin: 2px 0; }
.tdc-cat-list a { color: #0071B3; text-decoration: none; font-size: 0.95em; }
.tdc-cat-list a:hover { text-decoration: underline; }
/* (3) Ressources: 3-col with summaries */
.view-id-ressources_accueil .view-content { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 20px; }
.view-id-ressources_accueil .ressource-item .views-field-title a { color: #02576b; font-weight: bold; text-decoration: none; }
.view-id-ressources_accueil .ressource-item .views-field-body { font-size: 0.9em; color: #444; margin-top: 4px; }

/* ===== A la Une image + Ressources 3col (v2, correct markup) ===== */
/* A la Une body image: override inline width:340px */
.view-id-a_la_une .field--name-body img,
.view-id-a_la_une .views-field-body img,
#block-tdc-classic-alaune img,
.block-views-blocka-la-une-block-1 img {
  width: 150px !important; height: auto !important; max-width: 150px !important;
  float: left !important; margin: 0 14px 8px 0 !important;
}
/* Ressources 3 columns: the rows (.ressource-item) have no .view-content wrapper in stable9,
   so make their PARENT (the js-view-dom-id div) a grid via :has, plus float fallback. */
#block-tdc-classic-ressources-accueil .ressource-item,
.view-id-ressources_accueil .ressource-item {
  float: left;
  width: 31%;
  margin: 0 3% 1.5em 0;
  box-sizing: border-box;
}
#block-tdc-classic-ressources-accueil .ressource-item:nth-child(3n),
.view-id-ressources_accueil .ressource-item:nth-child(3n) { margin-right: 0; }
#block-tdc-classic-ressources-accueil .ressource-item img,
.view-id-ressources_accueil .ressource-item img { max-width: 100% !important; height: auto !important; }
/* clearfix on the view wrapper */
#block-tdc-classic-ressources-accueil .views-element-container::after,
#block-tdc-classic-ressources-accueil [class*=js-view-dom-id]::after { content: ""; display: table; clear: both; }

/* ===== Ressources image sizing (fit in 3-col cell, text visible) ===== */
#block-tdc-classic-ressources-accueil .ressource-item .views-field-body img,
.view-id-ressources_accueil .ressource-item img {
  float: left !important;
  width: 70px !important;
  max-width: 70px !important;
  height: auto !important;
  margin: 0 8px 4px 0 !important;
}
#block-tdc-classic-ressources-accueil .ressource-item .views-field-title {
  font-weight: bold; color: #02576b; margin-bottom: 4px;
}
#block-tdc-classic-ressources-accueil .ressource-item .views-field-body { font-size: 0.88em; color: #444; }
#block-tdc-classic-ressources-accueil .ressource-item { overflow: hidden; }

/* ===== List pages (ressources/categories) layout ===== */
.view-id-tdc_ressources .views-row,
.view-id-tdc_actualites .views-row,
.view-taxonomy-term .views-row,
.path-taxonomy .views-row {
  overflow: hidden;
  margin: 0 0 1.5em;
  padding: 0 0 1.2em;
  border-bottom: 1px solid #e5e5e5;
}
/* teaser body inline images: small floated thumbnail */
.view-id-tdc_ressources .field--name-body img,
.view-id-tdc_actualites .field--name-body img,
.view-taxonomy-term .field--name-body img,
.path-taxonomy .field--name-body img,
.node--view-mode-teaser .field--name-body img {
  float: left !important;
  width: 120px !important;
  max-width: 120px !important;
  height: auto !important;
  margin: 0 15px 8px 0 !important;
}
.node--view-mode-teaser h2 a,
.view-id-tdc_ressources h2 a,
.view-id-tdc_actualites h2 a { color: #02576b; text-decoration: none; font-size: 1.15em; }
.node--view-mode-teaser .field--name-body { font-size: 0.95em; color: #333; }

/* ===== BULLETPROOF teaser image constraint ===== */
/* Every image inside a views-row / article teaser is a small floated thumbnail.
   Uses the article element present in stable9 teaser markup, no reliance on field class. */
.views-row article img,
.views-row .views-field-body img,
.views-row img {
  float: left !important;
  width: 110px !important;
  max-width: 110px !important;
  height: auto !important;
  margin: 2px 14px 6px 0 !important;
}
.views-row article { overflow: hidden; display: block; }
.views-row { overflow: hidden; }

/* ===== Clean teaser cards ===== */
.tdc-teaser { overflow: hidden; margin: 0 0 1.4em; padding: 0 0 1.2em; border-bottom: 1px solid #e5e5e5; }
.tdc-teaser__thumb { float: left; margin: 2px 16px 6px 0; }
.tdc-teaser__thumb img { display: block; width: 100px !important; max-width: 100px !important; height: auto !important; border: 1px solid #ddd; }
.tdc-teaser__title { margin: 0 0 .3em; font-size: 1.15em; }
.tdc-teaser__title a { color: #02576b; text-decoration: none; }
.tdc-teaser__title a:hover { text-decoration: underline; }
.tdc-teaser__summary { margin: 0 0 .4em; color: #333; font-size: .95em; line-height: 1.5; }
.tdc-teaser__more { font-size: .9em; color: #0071B3; text-decoration: none; }
.tdc-teaser__more:hover { text-decoration: underline; }

/* ===== Article byline + tags ===== */
.tdc-byline { color: #777; font-size: 0.9em; margin: 0 0 1em; padding-bottom: 0.5em; border-bottom: 1px solid #eee; }
.tdc-byline .tdc-cat-link { color: #0071B3; text-decoration: none; font-weight: 500; }
.tdc-byline .tdc-cat-link:hover { text-decoration: underline; }
.tdc-tags { margin: 1.5em 0 0; padding-top: 0.8em; border-top: 1px solid #e5e5e5; font-size: 0.9em; }
.tdc-tags__label { color: #777; font-weight: bold; margin-right: 4px; }
.tdc-tags .tdc-tag { color: #0071B3; text-decoration: none; }
.tdc-tags .tdc-tag:hover { text-decoration: underline; }

/* ===== FINAL carousel sizing (fill content width, keep native ratio) ===== */
#hero, #hero .section { width: 100%; }
.view-slideshow-accueil, .tdc-carousel { max-width: 100% !important; width: 100% !important; margin: 0 0 1.5em !important; }
.tdc-carousel-track { width: 100%; }
.tdc-carousel-track > * { flex: 0 0 100% !important; width: 100% !important; }
.view-slideshow-accueil img, .tdc-carousel-track img {
  width: 100% !important; height: auto !important; max-width: 100% !important; max-height: none !important;
  display: block !important; margin: 0 !important; object-fit: cover !important;
}