/* NCCM 58.3 — App home polish: hero corto, topbar, cats, projects, finishes */

@media (max-width:760px){
  /* Top bar menos apretada */
  html body.home-page .nccm-app-topbar{
    gap:6px!important;
    padding:6px 0 8px!important;
  }
  html body.home-page .nccm-app-menu-btn,
  html body.home-page .nccm-app-bell{
    width:40px!important;
    height:40px!important;
    flex:0 0 40px!important;
  }
  html body.home-page .nccm-app-lang-toggle{
    min-width:40px!important;
    height:36px!important;
    padding:0 10px!important;
    font-size:12px!important;
    border-radius:12px!important;
    flex:0 0 auto!important;
  }
  html body.home-page .nccm-app-brand{
    gap:7px!important;
    justify-content:flex-start!important;
    max-width:calc(100vw - 168px)!important;
  }
  html body.home-page .nccm-app-brand img{
    width:40px!important;
    height:40px!important;
    flex:0 0 40px!important;
  }
  html body.home-page .nccm-app-brand b{
    font-size:12px!important;
    letter-spacing:.4px!important;
  }
  html body.home-page .nccm-app-brand small{
    font-size:10px!important;
  }
  html body.home-page .nccm-app-brand em{
    display:none!important; /* menos ruido en topbar */
  }

  /* Hero: más imagen, menos texto */
  html body.home-page .nccm-app-hero-card{
    min-height:300px!important;
  }
  html body.home-page .nccm-app-hero-shade{
    background:
      linear-gradient(0deg,rgba(8,5,3,.72) 0%,rgba(8,5,3,.28) 42%,rgba(8,5,3,.08) 70%,rgba(8,5,3,0) 100%),
      linear-gradient(90deg,rgba(8,5,3,.34),rgba(8,5,3,.08) 70%,rgba(8,5,3,0))!important;
  }
  html body.home-page .nccm-app-hero-content{
    left:16px!important;
    right:16px!important;
    bottom:20px!important;
  }
  html body.home-page .nccm-app-eyebrow{
    font-size:10px!important;
    letter-spacing:2.4px!important;
    margin-bottom:8px!important;
  }
  html body.home-page .nccm-app-hero-content h1{
    font-size:clamp(32px,9.5vw,46px)!important;
    line-height:.92!important;
    margin:0 0 8px!important;
    max-width:88%!important;
  }
  html body.home-page .nccm-app-hero-content p{
    font-size:13px!important;
    line-height:1.35!important;
    max-width:78%!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
  }

  /* Categorías: labels más legibles */
  html body.home-page .nccm-app-cats{
    gap:6px!important;
  }
  html body.home-page .nccm-app-cats a{
    font-size:9px!important;
    letter-spacing:0!important;
    line-height:1.15!important;
    text-transform:none!important;
    font-weight:900!important;
  }
  html body.home-page .nccm-app-cats span{
    height:52px!important;
    border-radius:18px!important;
    margin-bottom:6px!important;
    overflow:hidden!important;
  }
  html body.home-page .nccm-app-cats span img{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    display:block!important;
  }

  /* Proyectos: cards más fuertes */
  html body.home-page .nccm-app-card{
    flex:0 0 188px!important;
    border-radius:20px!important;
  }
  html body.home-page .nccm-app-card img{
    height:132px!important;
  }
  html body.home-page .nccm-app-card-empty{
    min-height:168px!important;
    background:
      linear-gradient(135deg,rgba(255,255,255,.07),rgba(255,255,255,.02)),
      radial-gradient(circle at 20% 20%,rgba(232,199,143,.16),transparent 48%)!important;
    border:1px dashed rgba(232,199,143,.4)!important;
    justify-content:flex-end!important;
  }
  html body.home-page .nccm-app-card-skeleton{
    flex:0 0 188px!important;
    min-height:168px!important;
    border-radius:20px!important;
    border:1px solid rgba(255,255,255,.08)!important;
    background:linear-gradient(90deg,rgba(255,255,255,.04),rgba(255,255,255,.1),rgba(255,255,255,.04))!important;
    background-size:200% 100%!important;
    animation:nccmAppHomeShimmer 1.1s ease-in-out infinite!important;
  }

  /* Acabados: más presencia (madera) */
  html body.home-page .nccm-app-finishes a{
    flex:0 0 86px!important;
    font-size:11px!important;
  }
  html body.home-page .nccm-app-finishes span{
    height:68px!important;
    border-radius:16px!important;
    background:
      linear-gradient(120deg,rgba(255,255,255,.18),transparent 36%,rgba(0,0,0,.18)),
      repeating-linear-gradient(90deg,rgba(0,0,0,.05) 0 2px,transparent 2px 5px),
      linear-gradient(145deg,var(--finish),color-mix(in srgb,var(--finish) 70%,#1a100a))!important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),0 14px 28px rgba(0,0,0,.24)!important;
  }

  /* Quote strip ya pulido en v57; refuerzo spacing */
  html body.home-page .nccm-app-quote-strip{
    margin:8px 0 18px!important;
  }
}

@keyframes nccmAppHomeShimmer{
  0%{background-position:200% 0}
  100%{background-position:-200% 0}
}

@supports not (background: color-mix(in srgb, red 50%, blue)){
  @media (max-width:760px){
    html body.home-page .nccm-app-finishes span{
      background:
        linear-gradient(120deg,rgba(255,255,255,.18),transparent 36%,rgba(0,0,0,.18)),
        linear-gradient(145deg,var(--finish),#2a1a12)!important;
    }
  }
}