/* ==========================================
   PHASE 7: CONTAINERS, RESPONSIVE, TYPOGRAPHY
   ========================================== */

.container-wide,
.container-content,
.container-text,
.container-narrow {
    width: var(--layout-inline-size);
    margin-inline: auto;
    box-sizing: border-box;
}

.container-wide { max-width: var(--container-wide); }
.container-content { max-width: var(--container-content); }
.container-text { max-width: var(--container-text); }
.container-narrow { max-width: var(--container-narrow); }

#main-content,
#main-content > main {
    min-width: 0;
    max-width: 100%;
}

.page-header-wrapper {
    width: 100%;
    box-sizing: border-box;
}

.page-header-wrapper > ul {
    width: 100%;
}

.page-header-intro {
    line-height: 1.5;
    overflow-wrap: anywhere;
}

/* Content containers: 900px */
.page-content-wrapper,
.page-boleteria-wrapper,
.page-mensajeria-wrapper,
.page-multiverso-wrapper,
.page-geografia-item-wrapper,
.page-comercial-wrapper,
.page-contacto-wrapper,
.page-info-770-wrapper,
.page-faq-wrapper,
.page-guia-wrapper,
.page-legal-wrapper,
.page-servicios-wrapper,
.page-prensa-wrapper,
.home-hero-wrapper,
.home-galeria-tags-wrapper {
    width: var(--layout-inline-size);
    max-width: var(--container-content);
    margin-inline: auto;
    box-sizing: border-box;
}

/* Text/detail containers: 800px */
.page-content-item-wrapper,
.page-tshirt-instructions,
.page-tshirt-info-legal,
.page-tshirt-products,
.page-tshirt-legal,
.page-marcas-wrapper,
.page-programacion-wrapper,
.page-agenda-detail-wrapper {
    width: var(--layout-inline-size);
    max-width: var(--container-text);
    margin-inline: auto;
    box-sizing: border-box;
}

.page-textos-wrapper {
    width: var(--layout-inline-size);
    max-width: 850px;
    margin-inline: auto;
}

.page-heros-wrapper,
.page-warning-wrapper,
.page-agenda-search-wrapper {
    width: var(--layout-inline-size);
    margin-inline: auto;
    box-sizing: border-box;
}

/* Flexible cards and detail media */
.page-content-item,
.page-boleteria-item,
.page-comercial-tarjeta,
.page-guia-item,
.page-servicios-wrapper > ul,
.page-tshirt-product,
.page-programacion-item {
    max-width: 100%;
    min-width: 0;
}

.page-content-item-wrapper img,
.page-geografia-item-wrapper img,
.page-heros-img,
.page-heros-texts,
.page-warning-img,
.page-programacion-cover img {
    max-width: 100%;
    height: auto;
}

.page-content-item-wrapper img {
    width: min(300px, 100%);
}

.page-geografia-item-wrapper img {
    width: min(600px, 100%);
}

.page-programacion-cover img {
    width: min(350px, 100%);
}

.page-content-h3,
.page-mensajeria-intro,
.page-comercial-name {
    line-height: 1.4;
}

.page-programacion-fecha,
.page-programacion-zona,
.page-programacion-text,
.page-programacion-powered,
.page-agenda-detail-subtitle,
.page-agenda-detail-abstract,
.page-agenda-detail-schedule,
.page-agenda-detail-location,
.page-agenda-detail-powered {
    line-height: 1.4;
}

/* Forms */
.page-contacto-campos input,
.page-contacto-campos textarea {
    max-width: 100%;
    line-height: 1.4;
}
.page-contacto-campos textarea {
    padding: 20px;
}

.page-contacto-terminos span {
    overflow-wrap: anywhere;
}

/* Legal copy */
.legal-text1 {
    font-size: 0.75rem;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.legal-text-title1,
.legal-text-title2 {
    line-height: 1.4;
}

.page-tshirt-legal p {
    font-size: 0.75rem;
    line-height: 1.5;
}

/* Home containers */
.home-reel-wrapper,
.home-hero-cards-wrapper,
.home-faqs-wrapper {
    width: var(--layout-inline-size);
    max-width: var(--container-wide);
    padding-inline: 0;
    margin-inline: auto;
}

.home-ads-wrapper {
    width: var(--layout-inline-size);
    max-width: 600px;
    padding-inline: 0;
    box-sizing: border-box;
}

.home-countdown-wrapper,
.home-carousel-wrapper,
.home-galeria-wrapper,
.home-strip-wrapper {
    width: 100%;
    max-width: 100vw;
    min-width: 0;
    overflow-x: hidden;
}

.home-carousel-wrapper .flickity-viewport,
.home-hero-cards-flickity .flickity-viewport,
.home-strip-wrapper .flickity-viewport {
    max-width: 100%;
}

.home-tags-wrapper,
.home-tags-boton,
.boton-corto {
    max-width: 100%;
}

/* Header and footer */
.header-wrapper,
.footer-back-wrapper,
.footer-footer-padding {
    width: var(--layout-inline-size);
    max-width: var(--container-wide);
    box-sizing: border-box;
}

.footer-pata-wrapper img {
    max-width: var(--layout-inline-size);
    height: auto;
}

.footer-footer-legales {
    line-height: 1.5;
}

/* Small phones */
@media (max-width: 480px) {
    :root {
        --layout-gutter: 16px;
        --layout-inline-size: calc(100vw - 32px);
    }

    .page-header-wrapper {
        padding-inline: var(--layout-gutter);
    }

    .page-header-wrapper > ul {
        padding-left: 16px;
    }

    .page-header-category {
        font-size: 1rem;
    }

    .page-header-title {
        font-size: 1.35rem;
        line-height: 1.2;
    }

    .page-content-item {
        width: 100%;
    }

    .page-content-item-wrapper,
    .page-geografia-item-wrapper {
        grid-template-columns: minmax(0, 1fr);
    }

    .page-content-item-wrapper img,
    .page-geografia-item-wrapper img,
    .page-heros-img,
    .page-heros-texts {
        width: 100%;
    }

    .page-heros-wrapper {
        width: var(--layout-inline-size);
        gap: 80px;
    }

    .page-heros-item,
    .page-heros-item:nth-child(odd) {
        width: 100%;
        align-items: stretch;
    }

    .page-comercial-tarjeta,
    .page-guia-item,
    .page-servicios-wrapper > ul {
        width: 100%;
    }

    .page-guia-item {
        grid-template-columns: minmax(56px, 1fr) minmax(0, 2fr);
        gap: 16px;
        padding: 16px;
    }

    .page-tshirt-purchase button {
        width: min(300px, var(--layout-inline-size));
    }

    .home-main-sections {
        width: 100%;
        max-width: 100vw;
        overflow-x: clip;
    }

    .home-reel-wrapper {
        gap: 32px;
    }

    .home-reel-video li video,
    .home-reel-texts {
        width: 80vw;
        max-width: 100%;
    }

    .home-countdown-number {
        margin-left: 10px;
        font-size: 1.8rem;
    }

    .home-countdown-label {
        font-size: 1.15rem;
    }

    .home-hero-cards-wrapper,
    .home-faqs-wrapper {
        margin-block: 0;
    }

    .home-hero-cards-column-a,
    .home-faqs-column-a {
        margin-block: 0;
    }

    .home-ads-box {
        grid-template-columns: 70px minmax(0, 1fr);
        gap: 12px;
        padding: 20px;
    }

    .home-ads-box li img {
        width: 70px;
    }

    .home-ads-texts {
        padding-left: 12px;
    }

    .home-hero-wrapper > ul {
        grid-template-columns: minmax(0, 1fr);
    }

    .home-galeria-tags-wrapper {
        width: var(--layout-inline-size);
    }

    .header-logo img {
        width: min(260px, 100%);
    }

    .header-nav {
        max-width: calc(100vw - 20px);
    }

    .footer-back-wrapper {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        padding: 10px;
    }

    .footer-back-wrapper ul {
        width: 100%;
        min-width: 0;
        padding: 10px 8px;
    }

    .footer-footer-terminos {
        padding-block: 35px;
        line-height: 1.4;
    }

    .footer-footer-legales {
        text-align: left;
    }
}

/* Mobile and tablets */
@media (min-width: 481px) and (max-width: 768px) {
    .home-hero-cards-wrapper,
    .home-faqs-wrapper {
        margin-block: 40px;
    }

    .footer-footer-legales {
        text-align: left;
    }
}

/* Tablet */
@media (min-width: 769px) and (max-width: 1024px) {
    .home-reel-wrapper {
        gap: 60px;
    }

    .home-hero-cards-columns,
    .home-faqs-columns {
        grid-template-columns: minmax(0, 300px) minmax(0, 1fr);
    }
}