/* ============================================================
   franco-media.com - layout A, the rail zones and the banner bands.
   TASK-N23, 05-10-2026. Rulings CT (layout A, one rail plus in-content
   bands, supersedes the three-column layout B) and CS (contain, never
   crop; the five build decisions). Design source: D03.

   The page grids are NOT redefined here: content 820 px and the 340 px
   rail are the existing .split (shared-components.css) and .asplit
   (article.css) grids, unchanged. This file styles only what the zones
   print: the banner image, the "Publicité" caption, the
   Catégories widget, the band, and the gated hub page.

   TASK-N23b, 05-10-2026 (ruling CV, Fabrice's correction): no card around a
   banner. Each banner is the bare image, edge to edge across its zone's width
   (the rail, or one band column), whole, at its natural ratio, nothing
   cropped. One small "Publicité" caption per zone sits above the banner
   stack. No carousel, no slideshow, no premium badge.

   Existing tokens only (AQ2): no hex value is written in this file.
   ============================================================ */

/* ---------- Banner (no card: ruling of 05-10-2026, TASK-N23b) ----------
   A banner is the bare image, edge to edge across its zone's width (the 340 px
   rail, or one column of the band), whole, at its natural ratio, nothing
   cropped. No background, border, padding or radius around it. */

.sigad{
  box-sizing:border-box;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:var(--space-5);
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:none;
}
/* The widget title (when someone types one) is kept for screen readers only. */
.sigad .sigad-title{ margin:0; }

/* The core Image widget writes an inline style on the img (max-width and height
   auto), so the img rules carry !important to keep the rule in force. */
.sigad.widget_media_image > a,
.sigad.widget_media_image > img{
  display:block;
  width:100%;
  margin:0;
}
.sigad.widget_media_image img{
  display:block;
  width:100% !important;
  height:auto !important;
  max-width:100% !important;
  margin:0;
  border-radius:0;
}

/* ---------- The "Publicité" caption: one per zone, above the banner stack ----------
   The marker string (FR, EN, RU) is still printed once in each banner's markup;
   only the first banner of a zone shows it, as a small discreet caption above
   the stack. In the rail it sits above the first banner; in the band it is
   lifted into the band's top strip so the three images stay level. */

.sigad .sigad-mark{
  display:none;
  font-family:var(--font-body);
  font-weight:var(--weight-bold);
  font-size:var(--size-label);
  letter-spacing:var(--ls-label);
  line-height:1;
  text-transform:uppercase;
  color:var(--os-muted);
}
.sigrail > .sigad:first-child .sigad-mark{ display:block; }
.sigband{ position:relative; padding-top:calc(var(--size-label) + var(--space-5)); }
.sigband > .sigad:first-child .sigad-mark{
  display:block;
  position:absolute;
  top:0;
  left:0;
}

/* ---------- Categories widget (the .widget card comes from shared-components.css) ---------- */

.widget.sigcats ul{ gap:0; }
.widget.sigcats li + li{ border-top:1px solid var(--os-line); }
.widget.sigcats a{
  display:flex;
  align-items:center;
  gap:var(--space-5);
  min-height:var(--tap-min);
  font-family:var(--font-body);
  font-weight:var(--weight-regular);
  font-size:var(--size-body-sm);
  line-height:1.3;
  color:var(--os-text);
}
.widget.sigcats a::before{
  content:"";
  flex:none;
  width:10px;
  height:10px;
  border-radius:50%;
  background:var(--acc);
}
.widget.sigcats a:hover{ color:var(--os-link); } /* N28 (DY4): the dot carries the accent, the hover text does not */

/* ---------- The band: three banners across the content column ---------- */

.sigband{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--card-gap);
  align-items:start;
}
/* Inside the card grid of the blog listing and the category archives the
   band spans every column, so it sits after the sixth card as a row of its own. */
.cards > .sigband{ grid-column:1 / -1; }
/* At the bottom of an article, below the advertiser card and the tags. */
.amain{ min-width:0; }
.amain > .sigband{ margin-top:var(--space-13); }

/* A narrower content column (tablet widths): as many banners per row as fit,
   never fewer than 200 px each. */
@media (max-width:1100px){
  .sigband{ grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); }
}

/* ---------- Hub and information pages (page.php) ---------- */

.sigwrap{
  max-width:var(--content-max);
  margin:0 auto;
  padding-left:var(--page-gutter);
  padding-right:var(--page-gutter);
}
.split.sigsplit-page{ margin-top:var(--space-14); }
.sigmain{ min-width:0; }
.sigpage{ min-width:0; }
.sigpage-title{
  margin:0 0 var(--space-9);
  font-family:var(--font-display);
  font-weight:var(--weight-display);
  font-size:var(--size-section-h2);
  line-height:1.15;
  color:var(--os-heading);
}
.sigpage .entry-content{ min-width:0; overflow-wrap:break-word; }
.sigpage .entry-content img,
.sigpage .entry-content iframe,
.sigpage .entry-content video,
.sigpage .entry-content embed{ max-width:100%; }

/* ---------- 768 px and below (the theme's stacking convention): content, then the rail ---------- */

@media (max-width:768px){
  .sigwrap{ padding-left:var(--page-gutter-mobile); padding-right:var(--page-gutter-mobile); }
  .split.sigsplit-page{ margin-top:var(--space-9); }
  .sigband{
    grid-template-columns:minmax(0,1fr);
    max-width:var(--banner-width);/* N29c: the 600px house width is the ceiling (was the 340px sidebar width); N28: token */
    margin-left:auto;
    margin-right:auto;
  }
  .amain > .sigband{ margin-top:var(--space-9); }
  /* stacked rail: banners keep the band's width cap and sit centred (N29c: 600px ceiling) */
  .sigrail > .sigad{ width:100%; max-width:var(--banner-width); margin-left:auto; margin-right:auto; }
}

/* ==========================================================================
TASK-N25 item 5 - Brain rulings CX and CZ1, 05-10-2026. Staging only.
(N29c, ruling DR2: the CZ1 band image cap was removed here.)
========================================================================== */

/* Rail widget list links (Articles recents, Categories): no underline. */
.sigrail .widget a,
.sigrail .widget a:hover,
.sigrail .widget a:focus{ text-decoration:none; }

/* Phones only: rail list text two points larger. */
@media (max-width: 768px) {
  .sigrail .widget a{ font-size:calc(16px + 2px); }
  .sigrail .widget.sigcats a{ font-size:calc(var(--size-body-sm) + 2px); }
}
