/* =========================================================
   AJUSTE SOLO ESCRITORIO — PORTADA
   - Video sin laterales borrosos
   - Portada más ancha, casi hasta el logo
   - Logo más grande
   - Móvil/tablet pequeña sin cambios
   ========================================================= */

@media (min-width:1100px){

  /* La portada ocupa más ancho visual */
  .hero{
    width:100%!important;
    max-width:none!important;
    min-height:720px!important;
    height:720px!important;
    aspect-ratio:auto!important;
    position:relative!important;
    overflow:hidden!important;
  }

  /* El video llena la portada de lado a lado.
     Ya no se usa contain, por lo que desaparecen los laterales borrosos. */
  .hero-bg-video{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center center!important;
    background:#0d292d!important;
  }

  /* El bloque de texto conserva buen margen y ancho,
     sin invadir la zona del logo */
  .hero .hero-content{
    left:max(4.8vw,62px)!important;
    bottom:76px!important;
    width:min(690px,52vw)!important;
    max-width:690px!important;
  }

  .hero h1{
    font-size:clamp(3.8rem,5.4vw,5.65rem)!important;
    line-height:.95!important;
  }

  .hero .hero-text{
    max-width:610px!important;
  }

  /* Logo más grande y más próximo al borde derecho */
  .bella-logo-portada{
    width:250px!important;
    top:84px!important;
    right:max(3vw,36px)!important;
    left:auto!important;
  }

  .bella-logo-portada img{
    width:100%!important;
    height:auto!important;
    object-fit:contain!important;
  }

  /* Mantener textos y controles encima del video */
  .hero .hero-content,
  .hero .bella-logo-portada,
  .hero .hero-shade,
  .hero .scroll{
    z-index:3!important;
  }
}

/* Pantallas de escritorio muy anchas */
@media (min-width:1500px){
  .hero{
    min-height:760px!important;
    height:760px!important;
  }

  .bella-logo-portada{
    width:270px!important;
    right:3.5vw!important;
  }

  .hero .hero-content{
    width:min(720px,48vw)!important;
    max-width:720px!important;
  }
}


/* AJUSTE MÓVIL/TABLET: sin línea residual del header y sin etiquetas en galería */
@media (max-width: 1100px){
  header, .site-header, .navbar, .nav, .topbar,
  header::before, header::after,
  .site-header::before, .site-header::after,
  .navbar::before, .navbar::after{
    border-bottom:0 !important;
    border-top:0 !important;
    box-shadow:none !important;
    outline:none !important;
  }

  #galeria #official-gallery-grid > .bella-space-photo > span,
  #galeria #official-gallery-grid > .official-managed-card > span,
  #galeria #official-gallery-grid .photo-label,
  #galeria .bella-space-photo .photo-label,
  #galeria .official-managed-card .photo-label{
    display:none !important;
    visibility:hidden !important;
    opacity:0 !important;
    height:0 !important;
    min-height:0 !important;
    max-height:0 !important;
    padding:0 !important;
    margin:0 !important;
    border:0 !important;
    overflow:hidden !important;
  }
}