/* ===========================================================================
   mk-homedark.css  -  v111  -  the homepage's light run goes BLACK

   WHY: the v108 category tiles are vivid flag green, and on #F6F7F5 they read
   as stickers on paper. The user picked black after seeing ten previews.

   WHICH BLACK: #0A0C10 - the site's OWN --ink, already used by the hero, the
   services band, /reparation and the footer. Deliberately NOT the green-tinted
   #08130D or #04180D that were also previewed: those would have made this the
   fifth distinct near-black on one page. Using --ink means this run becomes
   CONTINUOUS with the dark sections around it instead of merely similar, and
   the green stays where it belongs - on the tiles.

   THIS REVERSES A DOCUMENTED DECISION, ON PURPOSE. v71 and v91 both recorded
   the light/dark alternation as intentional and warned that flattening it would
   "trade the homepage's photographic warmth for uniformity". That reasoning no
   longer holds, and the measurement is why:
     - the page was ALREADY ~80% dark. The light run (3,523px of ~14,000) was
       the outlier, not half of a balance.
     - the warmth argument was backwards. The promo photography (kids with
       phones, the orange wall) and the product cutouts gain contrast on black;
       the photos carried the warmth, the background never did.
     - it also closes a hard light->dark seam into #services.

   SCOPE - THREE OF THE FOUR LIGHT SECTIONS, NOT ALL FOUR.
   `.sbsec` (sub-banner), `#tech` (intro + trust + promos + tiles + stats) and
   the "derniers arrivages" band are contiguous and contain the tiles, so they
   go dark together. The FOURTH light section - "Bati sur trois engagements"
   (`section.tech:has(.why)`, 833px, much further down) is LEFT LIGHT: v71
   records it as a deliberate contrast beat, and the user asked about the
   section with the tiles. It is now the page's only light band - flagged to the
   user rather than silently darkened.

   Targeted with :has() rather than nth-of-type so the selectors survive section
   reordering. :has() is already relied on elsewhere in this codebase
   (.pg-reparation .sec.paper:has(.bagrid)).

   REVERTING: delete the <link> in accueil.html. Nothing else was modified -
   no markup changed, so there is no backup to restore.
   =========================================================================== */

.sbsec,
#tech,
section.tech:has(.nrow){background:#0A0C10!important}


/* ---- 1. sub-banner tab pills ------------------------------------------------
   INVERTED, not merely recoloured. The active pill was #0A0C10 on white; on a
   #0A0C10 section that pill would vanish entirely. So active becomes WHITE on
   black and the inactive ones become glass - the same figure/ground relationship
   as before, read the other way round. */
.sbsec .sb-tab{
  background:rgba(255,255,255,.06)!important;
  border-color:rgba(255,255,255,.16)!important;
  color:rgba(255,255,255,.72)!important}
.sbsec .sb-tab:hover{background:rgba(255,255,255,.12)!important;color:#fff!important}
.sbsec .sb-tab.on,.sbsec .sb-tab[aria-selected="true"]{
  background:#fff!important;border-color:#fff!important;color:#0A0C10!important}


/* ---- 2. intro + trust bar ---------------------------------------------------
   .eyebrow2 is left ORANGE - it is --orange, which is the site's accent on every
   dark surface already, and it reads well on black. Only the neutrals move. */
#tech .intro h2{color:#fff!important}
#tech .intro p{color:#A8B0AA!important}
#tech .trust{border-bottom-color:rgba(255,255,255,.12)!important}
#tech .trust .ti b{color:#fff!important}
#tech .trust .ti span{color:#A8B0AA!important}
/* the icon plate was a light chip; it has to become glass or it is a white
   square floating on black */
#tech .trust .ti .ic{
  background:rgba(255,255,255,.06)!important;
  border:1px solid rgba(255,255,255,.14)!important;
  color:#F7A12B!important}


/* ---- 3. the tile grid -------------------------------------------------------
   The plates themselves are untouched (mk-tiles.css owns those). Only the
   caption row under each tile needs inverting.

   `.go` was `background:var(--ink)` - a black circle. On black that is an
   invisible button, so it inverts to white-on-black. The ORANGE HOVER IS KEPT:
   it is the interaction signal and it works on both. */
#tech .wanted h3{color:#fff!important}
#tech .pcard .plink b{color:#fff!important}
#tech .pcard .plink .go{background:#fff!important;color:#0A0C10!important}
#tech .pcard:hover .plink .go{background:var(--orange)!important;color:#1a1207!important}


/* ---- 4. stats ---------------------------------------------------------------
   .stat .num .suf stays --orange (already an accent, already legible). */
#tech .stats{border-top-color:rgba(255,255,255,.12)!important}
#tech .stat .num{color:#fff!important}
#tech .stat .lbl{color:#A8B0AA!important}


/* ---- 5. "Les derniers arrivages" -------------------------------------------
   The promo banners above this need NOTHING: .plabel is already #fff and .psub
   rgba(255,255,255,.94) because they sit on photographs. Verified before writing
   a rule for them - recolouring those would have been a wasted override. */
section.tech:has(.nrow) h3{color:#fff!important}
section.tech:has(.nrow) > .wrap > p,
section.tech:has(.nrow) .nhead p{color:#A8B0AA!important}

/* .seeall was --ink text on an --ink underline: doubly invisible on black */
section.tech:has(.nrow) .seeall{
  color:#fff!important;border-bottom-color:rgba(255,255,255,.45)!important}
section.tech:has(.nrow) .seeall:hover{
  color:var(--orange)!important;border-bottom-color:var(--orange)!important}

/* the cards were solid #fff - the single biggest light block in the run */
section.tech:has(.nrow) .ncard{
  background:#12151B!important;
  border-color:rgba(255,255,255,.09)!important;
  box-shadow:0 20px 38px -24px rgba(0,0,0,.95)!important}
section.tech:has(.nrow) .nname{color:#fff!important}
section.tech:has(.nrow) .nspec{color:#8b9088!important}
section.tech:has(.nrow) .nprice{color:#fff!important}
/* same inversion as .go, same reason, same orange hover kept */
section.tech:has(.nrow) .nbuy{background:#fff!important;color:#0A0C10!important}
section.tech:has(.nrow) .ncard:hover .nbuy{background:var(--orange)!important;color:#1a1207!important}
/* .nbadge is --orange on #1a1207 - an accent chip, legible on black, left alone */