/* ==========================================================================
   Pizzas Watson — Ajustes responsive globales
   ========================================================================== */

/*
 * Compensa el encabezado fijo al navegar
 * mediante enlaces internos.
 */
section[id] {
    scroll-margin-top: 110px;
}

/*
 * Evita desplazamiento horizontal accidental.
 */
html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

/*
 * Elementos multimedia adaptables.
 */
img,
svg,
video,
canvas {
    max-width: 100%;
}

/*
 * Evita que textos largos rompan componentes.
 */
h1,
h2,
h3,
p,
a,
span,
strong,
small {
    overflow-wrap: break-word;
}

/* ==========================================================================
   Tabletas
   ========================================================================== */

@media (max-width: 920px) {
    section[id] {
        scroll-margin-top: 100px;
    }

    body.pw-menu-open {
        overflow: hidden;
    }
}

/* ==========================================================================
   Teléfonos
   ========================================================================== */

@media (max-width: 560px) {
    .pw-container {
        width: min(
            100% - 24px,
            var(--pw-container)
        );
    }

    section[id] {
        scroll-margin-top: 88px;
    }

    .pw-section-heading {
        margin-bottom: 28px;
    }

    .pw-section-heading h2 {
        font-size: clamp(2rem, 10vw, 3rem);
    }
}

/* ==========================================================================
   Pantallas pequeñas
   ========================================================================== */

@media (max-width: 380px) {
    .pw-container {
        width: min(
            100% - 20px,
            var(--pw-container)
        );
    }

    .pw-eyebrow {
        font-size: 0.72rem;
    }
}