/* Add data-services-depth to the scoped page body/main. Existing typography and navigation are inherited. */
[data-services-depth] .service-row.visual-card .card-visual {
  display:block;
  width:100%!important;
  height:auto!important;
  aspect-ratio:16/10;
  object-fit:cover;
  object-position:var(--service-photo-position,50% 50%);
  filter:var(--service-photo-grade,none);
  background:#edf1f4;
}
/* Technical diagrams, product cut-outs and the existing Mac SVG remain complete. */
[data-services-depth] .service-row.visual-card .card-visual[src$=".svg"],
[data-services-depth] .service-row.visual-card .card-visual[data-service-fit="contain"] {
  object-fit:contain!important;
  padding:12px;
  background:#fff;
  filter:none;
}
/* Remove the old inline object-fit:contain/background declarations when replacing a diagram with a raster. */
[data-services-depth] .service-row[href$="/informatique/"] {--service-photo-position:50% 57%}
[data-services-depth] .service-row[href$="/reseaux/"] {--service-photo-position:50% 63%}
[data-services-depth] .service-row[href$="/windows-en-entreprise/"] {--service-photo-position:50% 63%}
[data-services-depth] .service-row[href$="/linux/"] {--service-photo-position:50% 52%}
[data-services-depth] .service-row[href$="/infogerance/"] {--service-photo-position:50% 52%}
[data-services-depth] .service-row[href$="/systeme-impression-bureautique/"] {--service-photo-position:50% 54%}
[data-services-depth] .service-row[href$="/telephonie-ip/"] {--service-photo-position:50% 46%}
[data-services-depth] .service-row[href$="/evenementiel/"] {--service-photo-position:50% 52%}
[data-services-depth] .service-row[href$="/cablage-reseau/"] {--service-photo-position:50% 24%}
[data-services-depth] .service-row[href$="/reseaux-filaires-et-wifi/"] {--service-photo-position:50% 38%}
[data-services-depth] .service-row[href$="/antenniste-tv/"] {--service-photo-position:50% 57%}
[data-services-depth] .service-row[href$="/tv-collective-et-ecrans-connectes/"] {--service-photo-position:70% 48%}
[data-services-depth] .service-row[href$="/interphonie/"] {--service-photo-position:50% 15%}
[data-services-depth] .service-row[href$="/serrures-electroniques/"] {--service-photo-position:54% 48%}
[data-services-depth] .service-row[href$="/sonorisation-et-audiovisuel/"] {--service-photo-position:50% 46%}
[data-services-depth] .service-row[href$="/affichage-dynamique/"] {--service-photo-position:45% 50%}
[data-services-depth] .service-row[href$="/electricite-courant-faible/"] {--service-photo-position:50% 37%}
[data-services-depth] .service-row[href$="/controle-acces/"] {--service-photo-position:54% 48%}
/* The unmodified Linux detail is dark. Keep the adjustment modest and natural. */
[data-services-depth] .service-row[href$="/linux/"] {--service-photo-grade:brightness(1.07) contrast(1.02)}
/* Do not crop article diagrams or technical views like thumbnails. */
[data-services-depth] .editorial-visual--diagram img,
[data-services-depth] .services-mac-figure img,
[data-services-depth] .work-figure img[src$=".svg"] {
  object-fit:contain!important;
  filter:none;
  height:auto!important;
  max-height:none;
}
/* Optional markup for a technical portrait in the article: add service-portrait to the figure.
   Full subject retained; the page can let that figure take its natural height. */
[data-services-depth] figure.service-portrait img {
  display:block;
  width:100%;
  height:auto!important;
  max-height:none;
  aspect-ratio:auto;
  object-fit:contain!important;
  object-position:50% 50%;
}
/* Optional fallback frame for a portrait while a generated landscape is not usable.
   Set --service-frame-photo:url(...) on the frame. This repeats only blurred colour matter,
   keeping the actual photo untouched and complete. Do not use this on diagrams. */
[data-services-depth] .service-photo-frame {
  position:relative;
  display:block;
  aspect-ratio:16/10;
  overflow:hidden;
  isolation:isolate;
  background:#edf1f4;
}
[data-services-depth] .service-photo-frame::before {
  content:"";
  position:absolute;
  z-index:-1;
  inset:-28px;
  background-image:var(--service-frame-photo);
  background-position:center;
  background-size:cover;
  filter:blur(26px) saturate(.85);
  opacity:.22;
}
[data-services-depth] .service-photo-frame img {
  width:100%;height:100%!important;
  aspect-ratio:auto;
  object-fit:contain!important;
  object-position:center;
  background:transparent;
  filter:none;
}
@media(max-width:650px){
  [data-services-depth] .service-row.visual-card .card-visual {aspect-ratio:16/10}
  [data-services-depth] .service-row.visual-card .card-visual[src$=".svg"] {padding:10px}
}
/* New illustrations/expanded photographs are authored at1920×1200.
   Override old fixed heights on article openings, especially on narrow mobile screens. */
[data-services-depth] .visitor-lead img {
  display:block;
  width:100%;
  height:auto!important;
  aspect-ratio:16/10;
  object-fit:cover;
  max-height:none;
}
/* Original work figures should show their full native composition, including TV bezels. */
[data-services-depth] .work-figure img {
  height:auto!important;
  aspect-ratio:auto;
  object-fit:contain!important;
  max-height:none;
}

[data-services-depth] .service-row.visual-card .card-visual{aspect-ratio:16/10!important}
[data-services-depth] .services-topic-photo{width:100%;height:auto!important;aspect-ratio:16/10;object-fit:cover;filter:none}
[data-services-depth] .visitor-lead:has(img[src*="/services-20261020/"]) img{height:auto!important;aspect-ratio:16/10;max-height:none;object-fit:cover}
[data-services-depth] .services-mac-figure:has(img[src*="/services-20261020/"]) img{height:auto!important;max-height:none;aspect-ratio:16/10;object-fit:cover!important}
[data-services-depth] .services-depth-content{margin-block:38px 20px;min-width:0}
[data-services-depth] .services-depth-content section{border-top:1px solid #dce1e6;padding-block:28px}
[data-services-depth] .services-depth-content h2{font-size:clamp(23px,2.8vw,32px);line-height:1.3;letter-spacing:-.025em;margin:0 0 20px}
[data-services-depth] .services-depth-content p,[data-services-depth] .services-depth-content li{font-size:15px;line-height:1.9;overflow-wrap:anywhere}
[data-services-depth] .services-depth-content p{margin:0 0 18px}
[data-services-depth] .services-depth-content details{border-bottom:1px solid #dce1e6;padding-block:18px}
[data-services-depth] .services-depth-content summary{cursor:pointer;font-weight:600;font-size:16px;line-height:1.5}
[data-services-depth] .services-depth-content details p{margin-top:16px}
[data-services-depth] .services-depth-content ul{padding-inline-start:23px}
[data-services-depth] .services-depth-content [id]{scroll-margin-top:155px}
@media(max-width:650px){[data-services-depth] .services-depth-content h2{font-size:24px}[data-services-depth] .services-depth-content section{padding-block:24px}}
