    html {
      scroll-behavior: smooth;
    }

    .rounded-arch {
      border-radius: 50% 50% 0 0 / 40% 40% 0 0;
    }

    .text-shadow {
      text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
    }

    /* Estilo del scrollbar horizontal */
    .scroll-smooth::-webkit-scrollbar {
      height: 8px;
    }

    .scroll-smooth::-webkit-scrollbar-track {
      background: rgba(11, 19, 43, 0.3);
      border-radius: 10px;
    }

    .scroll-smooth::-webkit-scrollbar-thumb {
      background: #C6A87C;
      border-radius: 10px;
      transition: background 0.3s ease;
    }

    .scroll-smooth::-webkit-scrollbar-thumb:hover {
      background: #ddb892;
    }

    /* Para Firefox */
    .scroll-smooth {
      scrollbar-color: #C6A87C rgba(11, 19, 43, 0.3);
      scrollbar-width: thin;
    }

    #pantalla-principal {
      transition: opacity 0.3s ease-in-out;
    }

    .banner{
      width: 100%;
    }

    .review-img{
      width: 100%;
      height: auto;
      display: block;
    }

    .banner-grid{
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0;
    }

    .banner-card,
    .banner-image{
      min-height: 260px;
    }

    .banner-card{
      color: #f2f2f2;
      padding: 2.5rem 2.75rem;
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 0.75rem;
      position: relative;
    }

    .banner-card h4{
      font-size: 1.5rem;
      font-weight: 600;
      margin: 0;
    }

    .banner-card p{
      margin: 0;
      font-size: 0.95rem;
      line-height: 1.5;
      color: rgba(255, 255, 255, 0.8);
    }

    .banner-image img{
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }

    .banner-card--sparkle .banner-sparkle{
      position: absolute;
      right: 1.75rem;
      bottom: 1.75rem;
      font-size: 1.5rem;
      color: rgba(255, 255, 255, 0.7);
    }

    @media (max-width: 900px){
      .banner-grid{
        grid-template-columns: 1fr;
      }

      .banner-card,
      .banner-image{
        min-height: 220px;
      }
    }