/* Photos locales 2026 — chargé après la curation globale.
   Objectif : chaque page locale doit montrer un vrai repère de ville, pas une photo générique.
   Stratégie :
   - pages locales = photo identifiable de la ville / zone
   - portfolio = captures des sites livrés
   - blog = visuels éditoriaux distincts
   - pages services génériques = visuels métier sobres
   Sources temporaires : Wikimedia Commons via Special:Redirect/file.
   À terme, remplacer par fichiers locaux optimisés dans /public/uploads/lieux/.
*/

/* =========================
   HÉROS LOCAUX
   ========================= */

/* Le Mans : cathédrale Saint-Julien, repère local immédiat */
html:has(link[rel="canonical"][href$="/consultant-seo/le-mans/"]) .rb-inner-panel::before,
html:has(link[rel="canonical"][href$="/creation-site-web/le-mans/"]) .rb-inner-panel::before{
  background-image:
    linear-gradient(180deg,rgba(16,22,27,.01) 0%,rgba(16,22,27,.22) 44%,rgba(16,22,27,.84) 100%),
    url('https://commons.wikimedia.org/wiki/Special:Redirect/file/Cathedrale_de_Le_Mans_%2803%29.jpg?width=1800') !important;
  background-position:center 38% !important;
}

/* Sarthe : Château du Lude, repère départemental plus large */
html:has(link[rel="canonical"][href$="/consultant-seo/sarthe/"]) .rb-inner-panel::before{
  background-image:
    linear-gradient(180deg,rgba(16,22,27,.01) 0%,rgba(16,22,27,.22) 44%,rgba(16,22,27,.84) 100%),
    url('https://commons.wikimedia.org/wiki/Special:Redirect/file/Ch%C3%A2teau_du_Lude_%28Sarthe%29.jpg?width=1800') !important;
  background-position:center 42% !important;
}

/* Angers : château d'Angers */
html:has(link[rel="canonical"][href$="/consultant-seo/angers/"]) .rb-inner-panel::before,
html:has(link[rel="canonical"][href$="/creation-site-web/angers/"]) .rb-inner-panel::before{
  background-image:
    linear-gradient(180deg,rgba(16,22,27,.01) 0%,rgba(16,22,27,.22) 44%,rgba(16,22,27,.84) 100%),
    url('https://commons.wikimedia.org/wiki/Special:Redirect/file/Angers_Castle_R01.jpg?width=1800') !important;
  background-position:center 43% !important;
}

/* Tours : pont Wilson / Loire */
html:has(link[rel="canonical"][href$="/consultant-seo/tours/"]) .rb-inner-panel::before,
html:has(link[rel="canonical"][href$="/creation-site-web/tours/"]) .rb-inner-panel::before{
  background-image:
    linear-gradient(180deg,rgba(16,22,27,.01) 0%,rgba(16,22,27,.22) 44%,rgba(16,22,27,.84) 100%),
    url('https://commons.wikimedia.org/wiki/Special:Redirect/file/Tours_-_Pont_Wilson_-_01.jpg?width=1800') !important;
  background-position:center 48% !important;
}

/* =========================
   CARTES VISUELLES LOCALES
   On ajoute un second rappel photo dans la première grande section de contenu.
   Cela évite une page locale qui redevient texte + boîtes après le hero.
   ========================= */

html:has(link[rel="canonical"][href$="/consultant-seo/le-mans/"]) .rb-inner-content > .section-block:first-of-type::before,
html:has(link[rel="canonical"][href$="/creation-site-web/le-mans/"]) .rb-inner-content > .section-block:first-of-type::before,
html:has(link[rel="canonical"][href$="/consultant-seo/sarthe/"]) .rb-inner-content > .section-block:first-of-type::before,
html:has(link[rel="canonical"][href$="/consultant-seo/angers/"]) .rb-inner-content > .section-block:first-of-type::before,
html:has(link[rel="canonical"][href$="/creation-site-web/angers/"]) .rb-inner-content > .section-block:first-of-type::before,
html:has(link[rel="canonical"][href$="/consultant-seo/tours/"]) .rb-inner-content > .section-block:first-of-type::before,
html:has(link[rel="canonical"][href$="/creation-site-web/tours/"]) .rb-inner-content > .section-block:first-of-type::before{
  content:'';
  display:block;
  min-height:clamp(180px,28vw,340px);
  margin:calc(clamp(1.5rem,3vw,3rem) * -1) calc(clamp(1.5rem,3vw,3rem) * -1) clamp(1.6rem,3vw,2.4rem);
  background-size:cover;
  background-position:center;
  border-bottom:1px solid rgba(26,22,18,.12);
}

html:has(link[rel="canonical"][href$="/consultant-seo/le-mans/"]) .rb-inner-content > .section-block:first-of-type::before,
html:has(link[rel="canonical"][href$="/creation-site-web/le-mans/"]) .rb-inner-content > .section-block:first-of-type::before{
  background-image:linear-gradient(180deg,rgba(16,22,27,.02),rgba(16,22,27,.32)),url('https://commons.wikimedia.org/wiki/Special:Redirect/file/Cathedrale_de_Le_Mans_%2803%29.jpg?width=1800') !important;
  background-position:center 40% !important;
}

html:has(link[rel="canonical"][href$="/consultant-seo/sarthe/"]) .rb-inner-content > .section-block:first-of-type::before{
  background-image:linear-gradient(180deg,rgba(16,22,27,.02),rgba(16,22,27,.32)),url('https://commons.wikimedia.org/wiki/Special:Redirect/file/Ch%C3%A2teau_du_Lude_%28Sarthe%29.jpg?width=1800') !important;
  background-position:center 45% !important;
}

html:has(link[rel="canonical"][href$="/consultant-seo/angers/"]) .rb-inner-content > .section-block:first-of-type::before,
html:has(link[rel="canonical"][href$="/creation-site-web/angers/"]) .rb-inner-content > .section-block:first-of-type::before{
  background-image:linear-gradient(180deg,rgba(16,22,27,.02),rgba(16,22,27,.32)),url('https://commons.wikimedia.org/wiki/Special:Redirect/file/Angers_Castle_R01.jpg?width=1800') !important;
  background-position:center 45% !important;
}

html:has(link[rel="canonical"][href$="/consultant-seo/tours/"]) .rb-inner-content > .section-block:first-of-type::before,
html:has(link[rel="canonical"][href$="/creation-site-web/tours/"]) .rb-inner-content > .section-block:first-of-type::before{
  background-image:linear-gradient(180deg,rgba(16,22,27,.02),rgba(16,22,27,.32)),url('https://commons.wikimedia.org/wiki/Special:Redirect/file/Tours_-_Pont_Wilson_-_01.jpg?width=1800') !important;
  background-position:center 50% !important;
}

/* Bande de preuves : plus propre et plus lumineuse sur les pages locales. */
html:has(link[rel="canonical"][href$="/consultant-seo/le-mans/"]) .rb-inner-proof-strip,
html:has(link[rel="canonical"][href$="/creation-site-web/le-mans/"]) .rb-inner-proof-strip,
html:has(link[rel="canonical"][href$="/consultant-seo/sarthe/"]) .rb-inner-proof-strip,
html:has(link[rel="canonical"][href$="/consultant-seo/angers/"]) .rb-inner-proof-strip,
html:has(link[rel="canonical"][href$="/creation-site-web/angers/"]) .rb-inner-proof-strip,
html:has(link[rel="canonical"][href$="/consultant-seo/tours/"]) .rb-inner-proof-strip,
html:has(link[rel="canonical"][href$="/creation-site-web/tours/"]) .rb-inner-proof-strip{
  background:rgba(255,250,242,.90) !important;
  backdrop-filter:blur(10px) !important;
}

@media(max-width:760px){
  html:has(link[rel="canonical"][href$="/consultant-seo/le-mans/"]) .rb-inner-content > .section-block:first-of-type::before,
  html:has(link[rel="canonical"][href$="/creation-site-web/le-mans/"]) .rb-inner-content > .section-block:first-of-type::before,
  html:has(link[rel="canonical"][href$="/consultant-seo/sarthe/"]) .rb-inner-content > .section-block:first-of-type::before,
  html:has(link[rel="canonical"][href$="/consultant-seo/angers/"]) .rb-inner-content > .section-block:first-of-type::before,
  html:has(link[rel="canonical"][href$="/creation-site-web/angers/"]) .rb-inner-content > .section-block:first-of-type::before,
  html:has(link[rel="canonical"][href$="/consultant-seo/tours/"]) .rb-inner-content > .section-block:first-of-type::before,
  html:has(link[rel="canonical"][href$="/creation-site-web/tours/"]) .rb-inner-content > .section-block:first-of-type::before{
    min-height:180px;
  }
}

@supports not selector(html:has(link[rel="canonical"])){
  /* Fallback : si :has() n'est pas supporté, on garde les visuels premium existants. */
}