/* Code Downloader au-dessus, numéro mis en valeur */
.tutorial-page .app-card > p {
  display: block;
  margin: 0 0 3px;
  color: #8c98aa;
  font-size: 8px;
  letter-spacing: .7px;
  text-transform: none;
}

.tutorial-page .app-card > p::after {
  content: "";
}

.tutorial-page .download-code {
  display: flex;
  min-width: 0;
  padding: 2px 6px;
  margin: 0 auto 9px;
  border: 0;
  background: transparent;
  color: #cfa4f5;
  font-size: 16px;
  letter-spacing: .7px;
}

/* Boutons en vert citron atténué */
.tutorial-page .download-link,
.tutorial-page .main-nav .nav-cta {
  background: #baf72b;
  color: #07111f;
  box-shadow: none;
}

.tutorial-page .download-link:hover,
.tutorial-page .main-nav .nav-cta:hover {
  background: #ccff4d;
  color: #07111f;
}

/* Aucun accent orange sur les icônes personnalisées */
.tutorial-page .ultra strong,
.tutorial-page .black-red span {
  color: #baf72b;
}

.tutorial-page .ultra {
  background: radial-gradient(circle at 30% 70%, #506b12, #08090c);
}

/* Soulignement propre du lien Tutoriel actif */
.tutorial-page .main-nav .active-link{
  position:relative;
  text-decoration:none
}
.tutorial-page .main-nav .active-link::after{
  left:0;
  right:0;
  bottom:-9px;
  height:2px;
  background:#baf72b;
  border-radius:999px
}
@media(max-width:700px){
  .tutorial-page .main-nav .active-link::after{
    left:12px;
    right:auto;
    bottom:5px;
    width:58px
  }
}

/* Même bande lavande sur la page Tutoriel */
.tutorial-page .site-header,
.tutorial-page .site-header.scrolled{
  background:
    radial-gradient(circle at 72% 20%,rgba(142,76,255,.24),transparent 36%),
    linear-gradient(135deg,rgba(248,245,255,.98),rgba(222,209,255,.98));
  border-bottom-color:rgba(124,44,255,.25);
  box-shadow:0 8px 28px rgba(80,47,140,.13)
}
.tutorial-page .main-nav a,
.tutorial-page .main-nav .active-link{color:#6f28d8}
.tutorial-page .main-nav a:hover{color:#3d087f}

/* Même hauteur compacte sur le tutoriel */
.tutorial-page .nav-wrap{height:57px}
.tutorial-page .brand-logo{
  width:120px;
  height:42px;
  object-fit:contain
}
@media(max-width:700px){
  .tutorial-page .main-nav{top:57px}
}

.tutorial-page .nav-wrap{height:46px}
.tutorial-page .brand-logo{
  width:100px;
  height:34px
}
@media(max-width:700px){
  .tutorial-page .main-nav{top:46px}
}

.tutorial-page .main-nav a,
.tutorial-page .main-nav .active-link{
  color:#78a900;
  font-weight:800
}
.tutorial-page .main-nav a:hover{color:#567d00}

.tutorial-page .site-header,
.tutorial-page .site-header.scrolled{
  background:linear-gradient(135deg,rgba(7,13,24,.98),rgba(26,15,45,.98));
  border-bottom-color:rgba(186,255,0,.16);
  box-shadow:0 8px 26px rgba(0,0,0,.28)
}
.tutorial-page .main-nav a,
.tutorial-page .main-nav .active-link{color:#baff00}
.tutorial-page .main-nav a:hover{color:#d8ff72}

.tutorial-page .brand-logo{
  filter:none !important;
  opacity:1;
  mix-blend-mode:normal;
  background:#6511d8
}

.tutorial-page .site-header,
.tutorial-page .site-header.scrolled{
  background:
    radial-gradient(circle at 82% 18%,rgba(87,65,135,.16),transparent 34%),
    linear-gradient(135deg,#0f1627 0%,#171d30 100%)
}

.tutorial-page .site-header,
.tutorial-page .site-header.scrolled{
  background:#111827;
  border-bottom-color:rgba(255,255,255,.09);
  box-shadow:0 7px 22px rgba(0,0,0,.25)
}

.tutorial-page .site-header,
.tutorial-page .site-header.scrolled{background:#050505}
.tutorial-page .main-nav a,
.tutorial-page .main-nav .active-link{color:#baff00}
.tutorial-page .main-nav a:hover{color:#ddff7a}

.tutorial-page header.site-header,
.tutorial-page header.site-header.scrolled{background:#050505 !important}
.tutorial-page header.site-header .main-nav>a{color:#baff00 !important}
