/* La Bétaillère — accueil bandeau TRON v3
 * Le vrai Z24500 reste le sujet. Le décor lumineux se prolonge sous les favoris
 * puis disparaît progressivement vers le milieu de la carte.
 * Présentation uniquement : aucune logique train / trafic n'est modifiée.
 */
html[data-lb-v4-live="1"] body.lb-v3 #home .lb-home-hero {
  grid-area: hero !important;
  position: relative;
  z-index: 1;
  isolation: isolate;
  box-sizing: border-box;
  min-width: 0;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
}

html[data-lb-v4-live="1"] body.lb-v3 #home .lb-home-hero::before {
  content: "";
  position: absolute;
  z-index: 0;
  top: 0;
  left: 50%;
  width: 100vw;
  max-width: none;
  transform: translateX(-50%);
  pointer-events: none;
  background-image: url("https://vps.labetaillere.fr/assets/lb-home-neon-personalized-v1.webp");
  background-repeat: no-repeat;
  background-position: center top;
  background-size: 100% auto;
}

html[data-lb-v4-live="1"] body.lb-v3 #home .lb-home-hero::after {
  content: "";
  position: absolute;
  z-index: 1;
  left: 50%;
  width: 100vw;
  max-width: none;
  transform: translateX(-50%);
  pointer-events: none;
  background:
    linear-gradient(
      180deg,
      rgba(2, 14, 24, 0) 0%,
      rgba(2, 14, 24, 0) 68%,
      rgba(2, 14, 24, .10) 80%,
      rgba(2, 14, 24, .34) 91%,
      rgba(2, 18, 29, .72) 100%
    );
}

html[data-lb-v4-live="1"] body.lb-v3 #home .lb-home-hero__welcome {
  position: absolute !important;
  z-index: 4;
  top: 10px;
  left: 14px;
  width: auto !important;
  max-width: calc(100% - 28px);
  min-height: 0 !important;
  margin: 0 !important;
  padding: 4px 7px !important;
  border: 0 !important;
  border-radius: 999px;
  background: rgba(2, 17, 28, .34) !important;
  box-shadow: none !important;
  color: #e7fdff !important;
  font-family: "Orbitron", system-ui, sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  letter-spacing: .01em !important;
  text-align: left !important;
  text-shadow: 0 0 8px rgba(43, 228, 247, .52);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (min-width: 1025px) {
  html[data-lb-v4-live="1"] body.lb-v3.page-home #home.home-section > .home-dashboard {
    grid-template-areas:
      "hero hero"
      "favorites traffic"
      "comments quick"
      "comments punct" !important;
    grid-template-rows:
      178px
      var(--lb-home-pc-top-row, 240px)
      var(--lb-home-pc-lower-row, 180px)
      var(--lb-home-pc-lower-row, 180px) !important;
  }

  html[data-lb-v4-live="1"] body.lb-v3 #home .lb-home-hero {
    height: 178px;
    min-height: 178px;
  }

  html[data-lb-v4-live="1"] body.lb-v3 #home .lb-home-hero::before,
  html[data-lb-v4-live="1"] body.lb-v3 #home .lb-home-hero::after {
    top: 0;
    height: 278px;
  }

  html[data-lb-v4-live="1"] body.lb-v3 #home .lb-home-hero::before {
    background-position: center 22%;
  }

  html[data-lb-v4-live="1"] body.lb-v3 #home .home-card[aria-label="Mes Bétaillères favorites"] {
    position: relative;
    z-index: 3;
    margin-top: -34px !important;
    border-top-color: rgba(78,229,245,.12) !important;
    background:
      linear-gradient(
        180deg,
        rgba(3, 28, 42, .12) 0%,
        rgba(3, 25, 38, .26) 24%,
        rgba(3, 22, 34, .76) 58%,
        rgba(2, 18, 29, .97) 100%
      ) !important;
  }
}

@media (max-width: 1024px) {
  html[data-lb-v4-live="1"] body.lb-v3 #home .home-dashboard {
    overflow: visible !important;
    grid-template-areas:
      "hero hero hero"
      "favorites favorites favorites"
      "traffic quick punct"
      "voice voice voice" !important;
  }

  html[data-lb-v4-live="1"] body.lb-v3 #home .lb-home-hero {
    height: 106px !important;
    min-height: 106px !important;
    margin: 0 !important;
  }

  /* Le visuel continue réellement derrière la première moitié des favoris. */
  html[data-lb-v4-live="1"] body.lb-v3 #home .lb-home-hero::before,
  html[data-lb-v4-live="1"] body.lb-v3 #home .lb-home-hero::after {
    top: 0;
    height: 218px;
  }

  html[data-lb-v4-live="1"] body.lb-v3 #home .lb-home-hero::before {
    background-position: center top;
    background-size: 100% auto;
  }

  html[data-lb-v4-live="1"] body.lb-v3 #home .home-card[aria-label="Mes Bétaillères favorites"] {
    position: relative;
    z-index: 3;
    margin-top: -11px !important;
    border-top-color: transparent !important;
    background:
      linear-gradient(
        180deg,
        rgba(3, 31, 44, .02) 0%,
        rgba(3, 28, 42, .05) 28%,
        rgba(3, 24, 37, .14) 52%,
        rgba(2, 20, 31, .52) 76%,
        rgba(2, 17, 27, .96) 100%
      ) !important;
    box-shadow:
      0 10px 24px rgba(0,0,0,.18),
      inset 0 -1px rgba(82,230,244,.14) !important;
  }

  html[data-lb-v4-live="1"] body.lb-v3 #home .home-card[aria-label="Mes Bétaillères favorites"] > h2 {
    position: relative;
    z-index: 4;
    text-shadow:
      0 2px 6px rgba(0,0,0,.86),
      0 0 10px rgba(50,232,250,.28) !important;
  }

  html[data-lb-v4-live="1"] body.lb-v3 #home .lb-home-hero__welcome {
    top: 7px;
    left: max(9px, env(safe-area-inset-left));
    max-width: calc(100vw - 18px);
    padding: 3px 6px !important;
    background: rgba(1, 14, 25, .30) !important;
    font-size: 10px !important;
  }
}

@media (max-width: 390px) {
  html[data-lb-v4-live="1"] body.lb-v3 #home .lb-home-hero {
    height: 102px !important;
    min-height: 102px !important;
  }

  html[data-lb-v4-live="1"] body.lb-v3 #home .lb-home-hero::before,
  html[data-lb-v4-live="1"] body.lb-v3 #home .lb-home-hero::after {
    height: 210px;
  }

  html[data-lb-v4-live="1"] body.lb-v3 #home .home-card[aria-label="Mes Bétaillères favorites"] {
    margin-top: -10px !important;
  }
}

/* Favoris connectés : le décor reste visible derrière les deux trains,
   puis s'éteint progressivement vers le milieu/bas du module. */
@media (max-width: 1024px) {
  html[data-lb-v4-live="1"] body.lb-v3 #home #homeFavSlot .home-fav-row,
  html[data-lb-v4-live="1"] body.lb-v3 #home #homeFavSlot .lb4-home-fav-sheet {
    background:
      linear-gradient(
        180deg,
        rgba(2, 24, 36, .05) 0%,
        rgba(2, 22, 34, .10) 30%,
        rgba(2, 20, 31, .28) 56%,
        rgba(2, 17, 28, .74) 82%,
        rgba(2, 15, 25, .96) 100%
      ) !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.035),
      0 5px 15px rgba(0,0,0,.14) !important;
  }

  html[data-lb-v4-live="1"] body.lb-v3 #home #homeFavSlot .home-fav-row::before,
  html[data-lb-v4-live="1"] body.lb-v3 #home #homeFavSlot .lb4-home-fav-sheet::before {
    background:
      linear-gradient(
        180deg,
        rgba(50,235,250,.035),
        transparent 52%,
        rgba(1,10,18,.22)
      ) !important;
  }
}


/* Personalised neon banner: approved train artwork, full bleed and fading rails. */
html[data-lb-v4-live="1"] body.lb-v3 #home .lb-home-hero::before {
 background-image:url("https://vps.labetaillere.fr/assets/lb-home-neon-personalized-v1.webp");
 background-size:100% auto;
 background-position:center top;
 height:calc(100vw / 3 + 32px);
 -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 72%,transparent 100%);
 mask-image:linear-gradient(to bottom,#000 0%,#000 72%,transparent 100%);
}
html[data-lb-v4-live="1"] body.lb-v3 #home .lb-home-hero::after {background:none!important;}
html[data-lb-v4-live="1"] body.lb-v3 #home .lb-home-hero__welcome {
 top:6.5vw!important;left:calc(50% - 44.5vw)!important;
 width:32vw!important;max-width:32vw!important;padding:0!important;
 background:none!important;border-radius:0!important;
 white-space:normal!important;overflow:visible!important;
 font-weight:600!important;line-height:1.15!important;text-align:left!important;
}
#lbHomeNeonGreeting .lb-neon-hello {display:block;color:#f4fcff;font-size:clamp(11px,2.25vw,38px);font-weight:400;letter-spacing:.055em;}
#lbHomeNeonGreeting .lb-neon-pseudo {
 display:block;margin-top:.2em;white-space:nowrap;
 font-size:clamp(15px,4.25vw,76px);font-weight:600;letter-spacing:.025em;
 color:#bafaff;text-shadow:0 0 3px #53eaff,0 0 12px #00cfff,0 0 25px #009dcc;
}
@media(min-width:1025px){
 html[data-lb-v4-live="1"] body.lb-v3.page-home #home.home-section>.home-dashboard {
 grid-template-rows:clamp(240px,24vw,360px) var(--lb-home-pc-top-row,240px) var(--lb-home-pc-lower-row,180px) var(--lb-home-pc-lower-row,180px)!important;
 }
 html[data-lb-v4-live="1"] body.lb-v3 #home .lb-home-hero {height:clamp(240px,24vw,360px)!important;min-height:0!important;}
 html[data-lb-v4-live="1"] body.lb-v3 #home .home-card {position:relative;z-index:3;}
}
@media(max-width:1024px){
 html[data-lb-v4-live="1"] body.lb-v3 #home .lb-home-hero {height:clamp(100px,27vw,240px)!important;min-height:0!important;}
 html[data-lb-v4-live="1"] body.lb-v3 #home .lb-home-hero::before {height:calc(100vw / 3 + 24px)!important;}
}

/* PC: aligned panels and smaller greeting; mobile banner keeps its dimensions. */
@media (min-width:1025px) {
 html[data-lb-v4-live="1"] body.lb-v3.page-home #home.home-section>.home-dashboard {
  grid-template-rows:clamp(220px,18vw,280px) var(--lb-home-pc-top-row,240px) var(--lb-home-pc-lower-row,180px) var(--lb-home-pc-lower-row,180px)!important;
 }
 html[data-lb-v4-live="1"] body.lb-v3 #home .lb-home-hero {
  height:clamp(220px,18vw,280px)!important;
 }
 html[data-lb-v4-live="1"] body.lb-v3.page-home #home .home-card[aria-label="Mes Bétaillères favorites"] {
  margin-top:0!important;
 }
 #lbHomeNeonGreeting .lb-neon-hello {font-size:clamp(16px,1.15vw,22px);}
 #lbHomeNeonGreeting .lb-neon-pseudo {font-size:clamp(28px,2vw,38px);}
}
/* One header row: return its empty space to the chat feed. */
html[data-lb-v4-live="1"] body.lb-v3 #home .live-wall-card--home .live-wall-head {
 grid-template-rows:auto!important;
 min-height:28px!important;
 margin-bottom:0!important;
 align-items:center!important;
}
html[data-lb-v4-live="1"] body.lb-v3 #home .live-wall-card--home .live-wall-head-actions {
 grid-row:1!important;
}
html[data-lb-v4-live="1"] body.lb-v3 #home .live-wall-card--home #homeLiveWallFeed {
 margin-top:0!important;
}
html[data-lb-v4-live="1"] body.lb-v3 #home .live-wall-card--home {row-gap:3px!important;}
@media (min-width:1025px) {
 html[data-lb-v4-live="1"] body.lb-v3.page-home #home .live-wall-card--home #homeLiveWallFeed {
  flex:1 1 0!important;height:auto!important;min-height:0!important;max-height:none!important;
 }
}
@media (max-width:1024px) {
 html[data-lb-v4-live="1"] body.lb-v3 #home .live-wall-card--home #homeLiveWallFeed {
  height:auto!important;min-height:0!important;max-height:160px!important;
 }
}