/**
 * WapuOS - Blocks · Content Style para Contenido
 *
 * Los bloques conservan su composición y consumen estas variables.
 * Retícula: 0.5rem; 0.25rem únicamente para microespacios.
 * Tipografía: 24 / 18 / 16 / 12.
 */

/* Productos en pestañas: composición deliberadamente minimal. */
.pt-section {
    padding: clamp(2.5rem, 6vw, 4rem) clamp(1rem, 4vw, 3rem);
    background: var(--pg-sem-surface, var(--wb-surface));
    color: var(--pg-sem-text, var(--wb-text));
    font-family: var(--pg-style-body);
}

.pt-header {
    max-width: 87.5rem;
    margin: 0 auto 1.5rem;
    text-align: left;
}

.pt-eyebrow {
    display: block;
    margin-bottom: 0.5rem;
    color: var(--pg-style-accent, currentColor);
    font-size: var(--wapu-type-small, 0.875rem);
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.pt-title {
    margin: 0;
    font-family: var(--pg-style-heading);
    font-size: var(--wapu-type-h2, 1.5rem);
    font-weight: 650;
    line-height: 1.16;
    letter-spacing: -.02em;
}

.pt-tabs {
    display: flex;
    max-width: 87.5rem;
    align-items: center;
    gap: 1.5rem;
    margin: 0 auto 2rem;
    overflow-x: auto;
    border-bottom: 1px solid var(--pg-sem-border, color-mix(in srgb,var(--wb-text) 14%,transparent));
    scrollbar-width: none;
}

.pt-tabs::-webkit-scrollbar,
.pt-grid::-webkit-scrollbar {
    display: none;
}

.pt-tab {
    position: relative;
    flex: 0 0 auto;
    padding: 0.5rem 0 0.75rem;
    border: 0;
    border-radius: 0 !important;
    background: transparent;
    color: inherit;
    font: 600 0.875rem/1.3 inherit;
    cursor: pointer;
    opacity: .52;
    transition: color .18s ease, opacity .18s ease;
}

.pt-tab::after {
    position: absolute;
    right: 0;
    bottom: -1px;
    left: 0;
    height: 0.125rem;
    background: var(--pg-style-accent, currentColor);
    content: "";
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .18s ease;
}

.pt-tab:hover {
    opacity: .8;
}

.pt-tab.is-active {
    opacity: 1;
}

.pt-tab.is-active::after {
    transform: scaleX(1);
}

.pt-panel {
    display: none;
}

.pt-panel.is-active {
    display: block;
    animation: pt-fade .2s ease;
}

@keyframes pt-fade {
    from { opacity: 0; }
    to { opacity: 1; }
}

.pt-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.5rem;
    max-width: 87.5rem;
    margin: 0 auto;
}

.pt-card {
    position: relative;
    min-width: 0;
    max-width: 100%;
}

.pt-card > .wapu-product-card {
    width: 100%;
    min-width: 0;
}

.pt-empty {
    grid-column: 1 / -1;
    padding: 3rem 1rem;
    text-align: center;
    opacity: .5;
}

@media (max-width: 68.75em) {
    .pt-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}
@container wapu-block-preview (max-width: 68.75em){
    .pt-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}


@media (max-width: 48em) {
    .pt-section {
        padding-block: 2.5rem;
    }

    .pt-header {
        margin-bottom: 1rem;
    }

    .pt-tabs {
        gap: 1.25rem;
        margin-bottom: 1.5rem;
    }

    .pt-grid {
        display: flex;
        grid-template-columns: none;
        gap: 1rem;
        padding-bottom: 1rem;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
    }

    .pt-card {
        flex: 0 0 min(76vw, 17.5rem);
        scroll-snap-align: start;
    }
}
@container wapu-block-preview (max-width: 48em){
    .pt-section {
        padding-block: 2.5rem;
    }

    .pt-header {
        margin-bottom: 1rem;
    }

    .pt-tabs {
        gap: 1.25rem;
        margin-bottom: 1.5rem;
    }

    .pt-grid {
        display: flex;
        grid-template-columns: none;
        gap: 1rem;
        padding-bottom: 1rem;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
    }

    .pt-card {
        flex: 0 0 min(76vw, 17.5rem);
        scroll-snap-align: start;
    }
}

:where(
    .ws-pc-v1,
    .ws-quote-v1,
    .ws-stats-v1,
    .ws-team-roster-v1,
    .ws-tl-v1,
    [id^="wb-visual-menu-"]
) {
    --wapu-space-0-5: 0.25rem;
    --wapu-space-1: 0.5rem;
    --wapu-space-2: 1rem;
    --wapu-space-3: 1.5rem;
    --wapu-space-4: 2rem;
    --wapu-space-5: 2.5rem;
    --wapu-space-6: 3rem;
    --wapu-space-8: 4rem;
    --wapu-content-title: 1.5rem;
    --wapu-content-subtitle: 1.125rem;
    --wapu-content-body: 1rem;
    --wapu-content-small: 0.75rem;
    box-sizing: border-box;
}

:where(
    .ws-pc-v1,
    .ws-quote-v1,
    .ws-stats-v1,
    .ws-team-roster-v1,
    .ws-tl-v1,
    [id^="wb-visual-menu-"]
) :where(*, *::before, *::after) {
    box-sizing: border-box;
}

/* Encabezado compartido por los manifiestos modernos de Contenido. */
.wapu-content-heading {
    max-width: 45rem;
    margin: 0 auto var(--wapu-space-5);
    text-align: center;
}

.wapu-content-heading__eyebrow {
    display: block;
    margin-bottom: var(--wapu-space-1);
    color: currentColor;
    font-size: var(--wapu-content-small);
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.wapu-content-heading h2 {
    margin: 0;
    font-size: var(--wapu-content-title);
    line-height: 1.2;
}

.wapu-content-heading p {
    margin: var(--wapu-space-2) auto 0;
    font-size: var(--wapu-content-body);
    line-height: 1.6;
}

/* Microinteracciones compartidas. No requieren JavaScript ni afectan el editor. */
.ws-stat,
.ws-tl-milestone,
.ws-team-roster-v1__person {
    transition: translate 0.2s ease;
}

.ws-stat:hover,
.ws-tl-milestone:hover,
.ws-team-roster-v1__person:hover {
    translate: 0 -0.1875rem;
}

.ws-team-roster-v1__avatar .wapu-c-image img {
    transition: transform 0.35s ease;
}

.ws-team-roster-v1__person:hover .ws-team-roster-v1__avatar .wapu-c-image img {
    transform: scale(1.025);
}

.ws-tl-milestone:hover .ws-tl-dot {
    transform: scale(1.12);
}

.ws-tl-dot {
    transition: transform 0.2s ease;
}

/* blocks/contenido/pull-quote-v1 */
.ws-quote-v1 {
        padding: clamp(6rem, 14vw, 10rem) clamp(1.5rem, 6vw, 5rem);
        background: var(--pg-sem-surface);
        color: var(--pg-sem-text);
    }
    .ws-quote-inner {
        max-width: 55rem;
        margin: 0 auto;
    }
    .ws-quote-center { text-align: center; }
    .ws-quote-left   { text-align: left; }
    .ws-quote-center .ws-quote-inner { margin: 0 auto; }
    .ws-quote-left   .ws-quote-inner { margin: 0; }

    .ws-quote-mark {
        font-family: var(--pg-style-heading);
        font-size: clamp(4rem, 8vw, 7.5rem);
        line-height: 0.9;
        color: var(--pg-style-accent, var(--pg-sem-text-muted));
        margin-bottom: 1.5rem;
        font-style: italic;
        font-weight: 500;
    }
    .ws-quote-text {
        font-family: var(--pg-style-heading);
        font-size: var(--wapu-content-title);
        font-weight: 400;
        font-style: italic;
        line-height: 1.08;
        letter-spacing: 0;
        color: var(--pg-sem-text);
        margin: 0 0 var(--wapu-space-4);
    }
    .ws-quote-source {
        font-family: var(--pg-style-body);
        font-size: var(--wapu-content-small);
        font-weight: 600;
        letter-spacing: .24em;
        text-transform: uppercase;
        color: var(--pg-sem-text-muted);
    }
    @media (max-width: 40em) {
        .ws-quote-v1 { padding: 4.5rem 1.5rem; }
        .ws-quote-text { font-size: var(--wapu-content-title); }
        .ws-quote-mark { font-size: 4.5rem; }
    }
@container wapu-block-preview (max-width: 40em){
        .ws-quote-v1 { padding: 4.5rem 1.5rem; }
        .ws-quote-text { font-size: var(--wapu-content-title); }
        .ws-quote-mark { font-size: 4.5rem; }
    }


/* blocks/contenido/stats-v1 */
.ws-stats-v1 {
        padding: clamp(4rem, 10vw, 8rem) clamp(1.5rem, 5vw, 5rem);
        background: var(--pg-sem-surface);
        color: var(--pg-sem-text);
        font-family: var(--pg-style-body);
    }
    .ws-stats-v1 .ws-stats-eyebrow {
        display: block;
        text-align: center;
        font-size: var(--wapu-content-small);
        letter-spacing: .22em;
        text-transform: uppercase;
        color: var(--pg-style-accent);
        font-weight: 500;
        margin-bottom: 3rem;
    }
    .ws-stats-v1 .ws-stats-grid {
        display: grid;
        grid-template-columns: repeat(var(--ws-cols), 1fr);
        gap: 0;
        max-width: 75rem;
        margin: 0 auto;
    }
    .ws-stats-v1 .ws-stat {
        text-align: center;
        padding: 0 clamp(1rem, 3vw, 2.5rem);
        border-right: .5px solid var(--pg-sem-border);
    }
    .ws-stats-v1 .ws-stat:last-child { border-right: none; }
    .ws-stats-v1 .ws-stat-num {
        font-family: var(--pg-style-heading);
        font-size: clamp(3rem, 8vw, 6rem);
        font-weight: 400;
        letter-spacing: 0;
        line-height: 1;
        color: var(--pg-sem-text);
        margin-bottom: 1rem;
        display: block;
    }
    .ws-stats-v1 .ws-stat-lbl {
        font-size: var(--wapu-content-small);
        letter-spacing: .15em;
        text-transform: uppercase;
        font-weight: 500;
        color: var(--pg-sem-text-muted);
        line-height: 1.4;
    }
    .ws-stats-v1 .ws-stats-hint {
        display: block;
        text-align: center;
        font-size: var(--wapu-content-small);
        color: var(--pg-sem-text-muted);
        font-style: italic;
        margin-top: 2rem;
        opacity: .7;
    }
    @media (max-width: 40em) {
        .ws-stats-v1 .ws-stats-grid {
            grid-template-columns: none;
            grid-auto-flow: column;
            grid-auto-columns: clamp(15rem, 72vw, 18rem);
            overflow-x: auto;
            overscroll-behavior-inline: contain;
            scroll-snap-type: inline mandatory;
            scrollbar-color: var(--pg-style-accent) transparent;
            scrollbar-width: thin;
            padding-bottom: var(--wapu-space-2);
            -webkit-overflow-scrolling: touch;
        }
        .ws-stats-v1 .ws-stat {
            border-right: .5px solid var(--pg-sem-border);
            border-bottom: none;
            padding: var(--wapu-space-3);
            scroll-snap-align: center;
        }
        .ws-stats-v1 .ws-stat:last-child { border-right: none; }
        .ws-stats-v1 .ws-stat-num {
            font-size: clamp(3rem, 18vw, 4.5rem);
        }
    }
@container wapu-block-preview (max-width: 40em){
        .ws-stats-v1 .ws-stats-grid {
            grid-template-columns: none;
            grid-auto-flow: column;
            grid-auto-columns: clamp(15rem, 72vw, 18rem);
            overflow-x: auto;
            overscroll-behavior-inline: contain;
            scroll-snap-type: inline mandatory;
            scrollbar-color: var(--pg-style-accent) transparent;
            scrollbar-width: thin;
            padding-bottom: var(--wapu-space-2);
            -webkit-overflow-scrolling: touch;
        }
        .ws-stats-v1 .ws-stat {
            border-right: .5px solid var(--pg-sem-border);
            border-bottom: none;
            padding: var(--wapu-space-3);
            scroll-snap-align: center;
        }
        .ws-stats-v1 .ws-stat:last-child { border-right: none; }
        .ws-stats-v1 .ws-stat-num {
            font-size: clamp(3rem, 18vw, 4.5rem);
        }
    }

    .ws-stats-v1 .ws-stats-grid:focus-visible {
        outline: 0.125rem solid var(--pg-style-accent);
        outline-offset: 0.25rem;
    }

/* blocks/contenido/team-roster-v1 */
.ws-team-roster-v1 {
        background: var(--pg-sem-surface);
        padding: clamp(3.5rem, 7vw, 6rem) clamp(1rem, 4vw, 3rem);
        font-family: var(--pg-style-body);
        color: var(--pg-sem-text);
    }
    .ws-team-roster-v1__wrap { max-width: 80rem; margin: 0 auto; }
    .ws-team-roster-v1__head h2 {
        margin: 0;
        font-size: var(--wapu-content-title);
        line-height: 1.2;
    }
    .ws-team-roster-v1__head {
        text-align: center;
        max-width: 45rem;
        margin: 0 auto clamp(2.25rem, 5vw, 4rem);
        display: flex; flex-direction: column;
        align-items: center; gap: var(--wapu-space-1);
    }
    .ws-team-roster-v1__subtitle {
        font-family: var(--pg-style-body);
        font-size: var(--wapu-content-body); line-height: 1.6;
        color: var(--pg-sem-text-muted); margin: 0; max-width: 48ch;
    }
    .ws-team-roster-v1__grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: clamp(1.5rem, 3vw, 2.5rem);
    }
    .ws-team-roster-v1__person {
        text-align: center;
        display: flex; flex-direction: column;
        align-items: center; gap: var(--wapu-space-1);
    }
    .ws-team-roster-v1__avatar {
        width: clamp(7.5rem, 14vw, 12.5rem);
        height: clamp(7.5rem, 14vw, 12.5rem);
        border-radius: 50%;
        border: 0.1875rem solid var(--pg-style-accent);
        overflow: hidden;
        margin: 0 auto clamp(var(--wapu-space-1), 1.5vw, var(--wapu-space-2));
        position: relative;
    }
    .ws-team-roster-v1__avatar .wapu-c-image {
        width: 100%;
        height: 100%;
        aspect-ratio: 1 / 1;
        border-radius: 50%;
    }
    .ws-team-roster-v1__avatar-empty {
        background: var(--ws-empty-bg);
        color: var(--ws-empty-ink);
        display: grid; place-items: center;
        width: 100%; height: 100%;
    }
    .ws-team-roster-v1__name {
        font-family: var(--ws-fs);
        font-weight: 500;
        font-size: var(--wapu-content-subtitle);
        line-height: 1;
        margin: 0;
        color: var(--ws-name);
    }
    .ws-team-roster-v1__credit {
        font-family: var(--pg-style-body);
        font-size: var(--wapu-content-small); line-height: 1.4;
        color: var(--pg-sem-text-muted); margin: 0;
    }
    @media (max-width: 56.25em) { .ws-team-roster-v1__grid { grid-template-columns: repeat(2, 1fr); } }
@container wapu-block-preview (max-width: 56.25em){ .ws-team-roster-v1__grid { grid-template-columns: repeat(2, 1fr); } }

    @media (max-width: 40em) {
        .ws-team-roster-v1__grid {
            grid-template-columns: none;
            grid-auto-flow: column;
            grid-auto-columns: clamp(14.5rem, 72vw, 17.5rem);
            gap: var(--wapu-space-2);
            overflow-x: auto;
            overscroll-behavior-inline: contain;
            scroll-snap-type: inline mandatory;
            scrollbar-color: var(--pg-style-accent) transparent;
            scrollbar-width: thin;
            padding-bottom: var(--wapu-space-2);
            -webkit-overflow-scrolling: touch;
        }
        .ws-team-roster-v1__person { scroll-snap-align: center; }
    }
@container wapu-block-preview (max-width: 40em){
        .ws-team-roster-v1__grid {
            grid-template-columns: none;
            grid-auto-flow: column;
            grid-auto-columns: clamp(14.5rem, 72vw, 17.5rem);
            gap: var(--wapu-space-2);
            overflow-x: auto;
            overscroll-behavior-inline: contain;
            scroll-snap-type: inline mandatory;
            scrollbar-color: var(--pg-style-accent) transparent;
            scrollbar-width: thin;
            padding-bottom: var(--wapu-space-2);
            -webkit-overflow-scrolling: touch;
        }
        .ws-team-roster-v1__person { scroll-snap-align: center; }
    }

    .ws-team-roster-v1__grid:focus-visible {
        outline: 0.125rem solid var(--pg-style-accent);
        outline-offset: 0.25rem;
    }

/* blocks/contenido/contenidos-faqs-v1 */
.cf-section {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(var(--wapu-space-3), 4vw, 5rem);
    padding: clamp(var(--wapu-space-5), 5vw, 5rem) clamp(var(--wapu-space-2), 4vw, var(--wapu-space-8));
    align-items: center;
    font-family: var(--pg-style-body);
    background: var(--pg-sem-surface, var(--wb-surface));
    color: var(--pg-style-primary, var(--wb-text));
    box-sizing: border-box;
}

.ws-quote-v1.is-empty {
	padding: 3rem 1.5rem;
	background: var(--pg-sem-surface);
	color: var(--pg-sem-text-muted);
	font-family: var(--pg-style-body);
	text-align: center;
}

.ws-quote-v1.is-empty p { margin: 0; }
.cf-tone-dark   { background: var(--pg-sem-surface, var(--wb-text)); color: var(--wb-surface); }

.cf-side-right { direction: rtl; }
.cf-side-right > * { direction: ltr; }

.cf-image {
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: var(--pg-style-secondary, var(--wb-surface-muted));
    border-radius: 0.125rem;
}
.cf-image img,
.cf-image-empty {
    width: 100%; height: 100%; object-fit: cover; display: block;
}
.cf-image img {
    transition: transform 0.35s ease;
}
.cf-section:hover .cf-image img {
    transform: scale(1.015);
}
.cf-image-empty {
    background: linear-gradient(135deg, color-mix(in srgb, currentColor 8%, transparent) 0%, color-mix(in srgb, currentColor 4%, transparent) 100%);
}

.cf-body {
    display: flex; flex-direction: column;
    gap: var(--wapu-space-2);
}

.cf-eyebrow {
    font-size: var(--wapu-content-small); font-weight: 600;
    letter-spacing: 0.15em; text-transform: uppercase;
    opacity: 0.7;
}

.cf-title {
    font-family: var(--pg-style-heading);
    font-size: var(--wapu-content-title);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: 0;
    margin: 0;
}

.cf-subtitle {
    font-size: var(--wapu-content-body);
    line-height: 1.55;
    margin: 0 0 var(--wapu-space-2);
    opacity: 0.75;
}

.cf-faqs {
    list-style: none;
    margin: 0;
    padding: 0;
}
.cf-faq {
    border-bottom: 1px solid var(--pg-sem-border, color-mix(in srgb,var(--wb-text) 8%,transparent));
}
.cf-faq-q {
    width: 100%;
    display: flex; justify-content: space-between; align-items: center; gap: var(--wapu-space-2);
    padding: var(--wapu-space-3) 0;
    background: transparent;
    border: 0;
    color: inherit;
    font: inherit;
    cursor: pointer;
    text-align: left;
}
.cf-faq-q-text {
    font-family: var(--pg-style-heading);
    font-size: var(--wapu-content-body);
    font-weight: 500;
    line-height: 1.3;
}
.cf-faq-q-icon {
    font-size: var(--wapu-content-subtitle);
    line-height: 1;
    opacity: 0.6;
    transition: transform 0.2s ease;
    flex-shrink: 0;
}
.cf-faq.is-open .cf-faq-q-icon {
    transform: rotate(45deg);
}
.cf-faq-a {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease, padding 0.3s ease;
    padding: 0 0 0 0;
    font-size: var(--wapu-content-body);
    line-height: 1.6;
    opacity: 0.75;
}
.cf-faq.is-open .cf-faq-a {
    max-height: 50rem;
    padding: 0 0 var(--wapu-space-3);
}
.cf-faq-a p { margin: 0 0 0.5rem; }
.cf-faq-a p:last-child { margin-bottom: 0; }

@media (max-width: 56.25em) {
    .cf-section {
        grid-template-columns: 1fr;
        gap: var(--wapu-space-3);
        padding: var(--wapu-space-4) var(--wapu-space-2);
    }
    .cf-image { aspect-ratio: 16 / 10; }
    .cf-title { font-size: var(--wapu-content-title); }
}
@container wapu-block-preview (max-width: 56.25em){
    .cf-section {
        grid-template-columns: 1fr;
        gap: var(--wapu-space-3);
        padding: var(--wapu-space-4) var(--wapu-space-2);
    }
    .cf-image { aspect-ratio: 16 / 10; }
    .cf-title { font-size: var(--wapu-content-title); }
}

@media (prefers-reduced-motion: reduce) {
    .cf-image img,
    .cf-faq-q-icon,
    .cf-faq-a { transition: none; }
}

/* blocks/contenido/obsessed-tabs-v1 */
.ws-obs-v1.ws-obs-v1{
    --gap:2rem;
    background:var(--pg-sem-surface);
    padding:4rem 3rem;
    font-family:var(--pg-style-body) !important;
    color:var(--pg-sem-text);
}
.ws-obs-v1 .ws-obs-wrap{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:var(--gap);
    align-items:center;
    max-width:80rem;
    margin:0 auto;
}
.ws-obs-v1[data-img-side="left"] .ws-obs-wrap{
    grid-template-areas:"media content";
}
.ws-obs-v1[data-img-side="left"] .ws-obs-media{grid-area:media}
.ws-obs-v1[data-img-side="left"] .ws-obs-content{grid-area:content}

.ws-obs-v1 .ws-obs-eyebrow{
    font-family:var(--pg-style-heading) !important;
    font-size:var(--wapu-content-title);
    font-weight:800;
    letter-spacing: 0;
    line-height:1;
    margin:0 0 1.5rem 0;
    color:var(--pg-sem-text);
    text-transform:uppercase;
}
.ws-obs-v1 .ws-obs-desc{
    font-size:var(--wapu-content-body);
    line-height:1.5;
    color:var(--pg-sem-text);
    max-width:30rem;
    margin:0 0 2.5rem 0;
    opacity:.85;
}
.ws-obs-v1 .ws-obs-cta{
    display:inline-flex;
    align-items:center;
    gap:0.5rem;
    min-height:2.5rem;
    margin:0 0 2rem;
    padding:0 1rem;
    border-radius:62.4375rem;
    background:var(--wapu-button-bg,var(--pg-style-primary));
    color:var(--wapu-button-text,var(--pg-sem-surface));
    text-decoration:none;
    font-size:var(--wapu-content-small);
    font-weight:800;
}

.ws-obs-v1 .ws-obs-tabs{
    display:flex;
    flex-direction:column;
    gap:0.5rem;
    margin-bottom:1.5rem;
}
.ws-obs-v1 .ws-obs-tab{
    all:unset;
    cursor:pointer;
    font-family:var(--pg-style-heading) !important;
    font-size:var(--wapu-content-subtitle);
    font-weight:800;
    letter-spacing: 0;
    line-height:1.1;
    color:var(--pg-sem-text-muted);
    text-transform:uppercase;
    transition:color .2s ease;
    padding:0.25rem 0;
}
.ws-obs-v1 .ws-obs-tab:hover,
.ws-obs-v1 .ws-obs-tab.is-active{
    color:var(--pg-sem-text);
}

.ws-obs-v1 .ws-obs-tab-desc{
    font-size:var(--wapu-content-small);
    line-height:1.5;
    color:var(--pg-sem-text);
    margin:0;
    max-width:30rem;
    opacity:0;
    height:0;
    overflow:hidden;
    transition:opacity .3s ease;
}
.ws-obs-v1 .ws-obs-tab-desc.is-active{
    opacity:.8;
    height:auto;
}

.ws-obs-v1 .ws-obs-media{
    position:relative;
    aspect-ratio:3/4;
    max-width:35rem;
    margin-left:auto;
    width:100%;
}
.ws-obs-v1[data-img-side="left"] .ws-obs-media{margin-left:0;margin-right:auto}

.ws-obs-v1 .ws-obs-image-wrap{
    position:absolute;
    inset:0;
    border-radius:1rem;
    overflow:hidden;
    opacity:0;
    transition:opacity .4s ease;
}
.ws-obs-v1 .ws-obs-image-wrap.is-active{
    opacity:1;
}
.ws-obs-v1 .ws-obs-image-wrap img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}
.ws-obs-v1 .ws-obs-image-placeholder{
    width:100%;
    height:100%;
    background:linear-gradient(135deg,var(--wb-text),var(--wb-text));
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:0.5rem;
    color:var(--pg-sem-text-muted);
}
.ws-obs-v1 .ws-obs-image-placeholder span{font-size:3rem}
.ws-obs-v1 .ws-obs-image-placeholder small{font-size:var(--wapu-content-small);text-transform:uppercase;letter-spacing:.1em}

.ws-obs-v1 .ws-obs-empty{
    text-align:center;
    padding:4rem 1.5rem;
    color:var(--pg-sem-text-muted);
}
.ws-obs-v1 .ws-obs-empty p{margin:0.25rem 0;font-size:var(--wapu-content-body)}
.ws-obs-v1 .ws-obs-empty-sub{font-size:var(--wapu-content-small);opacity:.7}

@media (max-width:40em){
    .ws-obs-v1.ws-obs-v1{padding:2.5rem 1.5rem}
    .ws-obs-v1 .ws-obs-wrap{grid-template-columns:1fr;gap:1.5rem}
    .ws-obs-v1[data-img-side="left"] .ws-obs-wrap{grid-template-areas:none}
    .ws-obs-v1 .ws-obs-media{margin:0 auto;max-width:100%}
}
@container wapu-block-preview (max-width:40em){
    .ws-obs-v1.ws-obs-v1{padding:2.5rem 1.5rem}
    .ws-obs-v1 .ws-obs-wrap{grid-template-columns:1fr;gap:1.5rem}
    .ws-obs-v1[data-img-side="left"] .ws-obs-wrap{grid-template-areas:none}
    .ws-obs-v1 .ws-obs-media{margin:0 auto;max-width:100%}
}


/* blocks/contenido/timeline-v1 */
.ws-tl-v1.ws-tl-v1 {
    background: var(--pg-sem-surface);
    color: var(--pg-sem-text);
    font-family: var(--pg-style-body);
    padding: clamp(3rem, 6vw, 6rem) clamp(1.5rem, 4vw, 4rem);
}
.ws-tl-v1 .ws-tl-inner { max-width: 75rem; margin: 0 auto; }

.ws-tl-v1 .ws-tl-header {
    text-align: center;
    max-width: 42.5rem;
    margin: 0 auto clamp(2.5rem, 6vw, 5rem);
}
.ws-tl-v1 .ws-tl-eyebrow {
    font-size: var(--wapu-content-small);
    letter-spacing: .25em;
    text-transform: uppercase;
    color: var(--pg-style-accent);
    font-weight: 600;
    margin-bottom: 1rem;
}
.ws-tl-v1 .ws-tl-title {
    font-family: var(--pg-style-heading);
    font-size: var(--wapu-content-title);
    font-weight: 500;
    line-height: 1.1;
    color: var(--pg-style-primary);
    margin: 0 0 1rem;
    letter-spacing: 0;
}
.ws-tl-v1 .ws-tl-subtitle {
    font-size: var(--wapu-content-body);
    line-height: 1.6;
    color: var(--pg-sem-text-muted);
    margin: 0;
}

/* Track: horizontal */
.ws-tl-v1[data-layout="horizontal"] .ws-tl-track {
    position: relative;
    display: grid;
    gap: 1rem;
}
.ws-tl-v1[data-layout="horizontal"] .ws-tl-track[data-count-visible] { }
.ws-tl-v1[data-layout="horizontal"][data-count="2"] .ws-tl-track { grid-template-columns: repeat(2, 1fr); }
.ws-tl-v1[data-layout="horizontal"][data-count="3"] .ws-tl-track { grid-template-columns: repeat(3, 1fr); }
.ws-tl-v1[data-layout="horizontal"][data-count="4"] .ws-tl-track { grid-template-columns: repeat(4, 1fr); }
.ws-tl-v1[data-layout="horizontal"][data-count="5"] .ws-tl-track { grid-template-columns: repeat(5, 1fr); }
.ws-tl-v1[data-layout="horizontal"][data-count="6"] .ws-tl-track { grid-template-columns: repeat(6, 1fr); }

.ws-tl-v1[data-layout="horizontal"] .ws-tl-line {
    position: absolute;
    top: 0.5rem;
    left: 5%;
    right: 5%;
    height: 1px;
    background: color-mix(in srgb, var(--pg-style-primary) 20%, transparent);
    z-index: 0;
}

.ws-tl-v1[data-layout="horizontal"] .ws-tl-milestone {
    position: relative;
    z-index: 1;
    padding-top: 2rem;
    text-align: center;
}
.ws-tl-v1[data-layout="horizontal"] .ws-tl-dot {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    background: var(--pg-sem-surface);
    border: 0.125rem solid var(--pg-style-primary);
    transition: all .3s ease;
}
.ws-tl-v1[data-layout="horizontal"] .ws-tl-milestone--highlighted .ws-tl-dot {
    background: var(--pg-style-accent);
    border-color: var(--pg-style-accent);
    box-shadow: 0 0 0 0.5rem color-mix(in srgb, var(--pg-style-accent) 20%, transparent);
    transform: translateX(-50%) scale(1.2);
}

/* Track: vertical */
.ws-tl-v1[data-layout="vertical"] .ws-tl-track {
    position: relative;
    max-width: 40rem;
    margin: 0 auto;
    padding-left: 2.5rem;
}
.ws-tl-v1[data-layout="vertical"] .ws-tl-line {
    position: absolute;
    top: 0.5rem;
    bottom: 0.5rem;
    left: 0.5rem;
    width: 1px;
    background: color-mix(in srgb, var(--pg-style-primary) 20%, transparent);
}
.ws-tl-v1[data-layout="vertical"] .ws-tl-milestone {
    position: relative;
    padding-bottom: 2.5rem;
}
.ws-tl-v1[data-layout="vertical"] .ws-tl-milestone:last-child { padding-bottom: 0; }
.ws-tl-v1[data-layout="vertical"] .ws-tl-dot {
    position: absolute;
    top: 0.25rem;
    left: -2.5rem;
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    background: var(--pg-sem-surface);
    border: 0.125rem solid var(--pg-style-primary);
}
.ws-tl-v1[data-layout="vertical"] .ws-tl-milestone--highlighted .ws-tl-dot {
    background: var(--pg-style-accent);
    border-color: var(--pg-style-accent);
    box-shadow: 0 0 0 0.375rem color-mix(in srgb, var(--pg-style-accent) 20%, transparent);
}

/* Contenido del hito */
.ws-tl-v1 .ws-tl-year {
    font-family: var(--pg-style-heading);
    font-style: italic;
    font-size: var(--wapu-content-subtitle);
    font-weight: 500;
    color: var(--pg-style-primary);
    line-height: 1;
    margin-bottom: 0.5rem;
}
.ws-tl-v1 .ws-tl-milestone--highlighted .ws-tl-year {
    color: var(--pg-style-accent);
}
.ws-tl-v1 .ws-tl-milestone-title {
    font-family: var(--pg-style-body);
    font-size: var(--wapu-content-body);
    font-weight: 600;
    color: var(--pg-style-primary);
    margin: 0 0 0.375rem;
    letter-spacing: 0;
}
.ws-tl-v1 .ws-tl-milestone-desc {
    font-size: var(--wapu-content-small);
    line-height: 1.5;
    color: var(--pg-sem-text-muted);
    margin: 0;
}

/* Mobile */
@media (max-width: 40em) {
    .ws-tl-v1.ws-tl-v1 {
        padding: 3rem 1rem;
    }
    /* Horizontal se vuelve vertical auto en mobile */
    .ws-tl-v1[data-layout="horizontal"] .ws-tl-track {
        grid-template-columns: 1fr;
        padding-left: 2.5rem;
        gap: 2rem;
    }
    .ws-tl-v1[data-layout="horizontal"] .ws-tl-line {
        top: 0.5rem;
        bottom: 0.5rem;
        left: 0.5rem;
        right: auto;
        width: 1px;
        height: auto;
    }
    .ws-tl-v1[data-layout="horizontal"] .ws-tl-milestone {
        padding-top: 0;
        text-align: left;
    }
    .ws-tl-v1[data-layout="horizontal"] .ws-tl-dot {
        position: absolute;
        top: 0.25rem;
        left: -2.5rem;
        transform: none;
    }
    .ws-tl-v1[data-layout="horizontal"] .ws-tl-milestone--highlighted .ws-tl-dot {
        transform: none;
        box-shadow: 0 0 0 0.375rem color-mix(in srgb, var(--pg-style-accent) 20%, transparent);
    }
}
@container wapu-block-preview (max-width: 40em){
    .ws-tl-v1.ws-tl-v1 {
        padding: 3rem 1rem;
    }
    /* Horizontal se vuelve vertical auto en mobile */
    .ws-tl-v1[data-layout="horizontal"] .ws-tl-track {
        grid-template-columns: 1fr;
        padding-left: 2.5rem;
        gap: 2rem;
    }
    .ws-tl-v1[data-layout="horizontal"] .ws-tl-line {
        top: 0.5rem;
        bottom: 0.5rem;
        left: 0.5rem;
        right: auto;
        width: 1px;
        height: auto;
    }
    .ws-tl-v1[data-layout="horizontal"] .ws-tl-milestone {
        padding-top: 0;
        text-align: left;
    }
    .ws-tl-v1[data-layout="horizontal"] .ws-tl-dot {
        position: absolute;
        top: 0.25rem;
        left: -2.5rem;
        transform: none;
    }
    .ws-tl-v1[data-layout="horizontal"] .ws-tl-milestone--highlighted .ws-tl-dot {
        transform: none;
        box-shadow: 0 0 0 0.375rem color-mix(in srgb, var(--pg-style-accent) 20%, transparent);
    }
}


/* blocks/contenido/process-cards-v1 */
.ws-pc-v1{
    padding:clamp(3.5rem, 8vw, 6.5rem) clamp(var(--wapu-space-2), 4vw, 3.5rem);
    background:var(--pg-sem-surface);
    color:var(--pg-sem-text);
    font-family:var(--pg-style-body);
    box-sizing:border-box;
}
.ws-pc-v1 .ws-pc-inner{
    width:min(73.75rem, 100%);
    margin:0 auto;
}
.ws-pc-v1 .ws-pc-head{
    max-width:42.5rem;
    margin:0 auto clamp(2rem, 5vw, 3.5rem);
    text-align:center;
}
.ws-pc-v1 .ws-pc-eyebrow{
    display:block;
    color:var(--pg-style-accent);
    font-size:var(--wapu-content-small);
    font-weight:700;
    letter-spacing:.18em;
    text-transform:uppercase;
    margin-bottom:var(--wapu-space-1);
}
.ws-pc-v1 .ws-pc-title{
    font-family:var(--pg-style-heading);
    font-size:var(--wapu-content-title);
    line-height:1.05;
    color:var(--pg-style-primary);
    margin:0;
    text-transform:uppercase;
}
.ws-pc-v1 .ws-pc-subtitle{
    color:var(--pg-sem-text-muted);
    font-size:var(--wapu-content-body);
    line-height:1.58;
    margin:var(--wapu-space-2) auto 0;
    max-width:58ch;
}
.ws-pc-v1 .ws-pc-grid{
    display:grid;
    grid-template-columns:repeat(var(--ws-item-count), minmax(0, 1fr));
    gap:clamp(var(--wapu-space-3), 4vw, 3rem);
    align-items:start;
}
.ws-pc-v1 .ws-pc-card{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:clamp(var(--wapu-space-2), 2vw, var(--wapu-space-3));
}
.ws-pc-v1[data-layout="staggered"] .ws-pc-card:nth-child(1){padding-top:var(--wapu-space-2);transform:rotate(-2deg);}
.ws-pc-v1[data-layout="staggered"] .ws-pc-card:nth-child(2){transform:rotate(1deg);}
.ws-pc-v1[data-layout="staggered"] .ws-pc-card:nth-child(3){padding-top:var(--wapu-space-3);transform:rotate(2deg);}
.ws-pc-v1 .ws-pc-figure{
    position:relative;
    aspect-ratio:var(--ws-ratio);
    overflow:hidden;
    border-radius:0.5rem;
    background:linear-gradient(135deg, var(--pg-style-secondary), var(--pg-sem-surface-muted));
    box-shadow:0 1.125rem 2.625rem var(--wb-text);
}
.ws-pc-v1 .ws-pc-figure img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    transition:transform .35s ease;
}
.ws-pc-v1 .ws-pc-card:hover .ws-pc-figure img{transform:scale(1.025);}
.ws-pc-v1 .ws-pc-empty{
    width:100%;
    height:100%;
    display:grid;
    place-items:center;
    color:color-mix(in srgb, var(--pg-style-primary) 45%, transparent);
    font-family:var(--pg-style-heading);
    font-size:clamp(2.75rem, 7vw, 5.5rem);
}
.ws-pc-v1 .ws-pc-body{
    text-align:center;
    transform:rotate(0deg);
}
.ws-pc-v1 .ws-pc-step{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:2rem;
    height:1.5rem;
    margin-bottom:var(--wapu-space-2);
    border-radius:62.4375rem;
    background:var(--pg-style-primary);
    color:var(--pg-sem-surface);
    font-size:var(--wapu-content-small);
    font-weight:800;
    letter-spacing:.08em;
}
.ws-pc-v1 .ws-pc-item-title{
    font-family:var(--pg-style-heading);
    color:var(--pg-style-primary);
    margin:0;
    font-size:var(--wapu-content-subtitle);
    line-height:1.18;
    text-transform:uppercase;
}
.ws-pc-v1 .ws-pc-desc{
    color:var(--pg-sem-text-muted);
    margin:0.5rem 0 0;
    font-size:var(--wapu-content-body);
    line-height:1.55;
}
@media (max-width: 56.25em){
    .ws-pc-v1 .ws-pc-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap:var(--wapu-space-3);
    }
    .ws-pc-v1[data-layout="staggered"] .ws-pc-card{
        padding-top:0;
        transform:none;
    }
}
@container wapu-block-preview (max-width: 56.25em){
    .ws-pc-v1 .ws-pc-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap:var(--wapu-space-3);
    }
    .ws-pc-v1[data-layout="staggered"] .ws-pc-card{
        padding-top:0;
        transform:none;
    }
}

@media (max-width: 40em){
    .ws-pc-v1 .ws-pc-grid{
        grid-template-columns:none;
        grid-auto-flow:column;
        grid-auto-columns:clamp(17rem, 82vw, 20rem);
        overflow-x:auto;
        overscroll-behavior-inline:contain;
        scroll-snap-type:inline mandatory;
        scrollbar-color:var(--pg-style-accent) transparent;
        scrollbar-width:thin;
        padding-bottom:var(--wapu-space-2);
        -webkit-overflow-scrolling:touch;
    }
    .ws-pc-v1 .ws-pc-card{
        scroll-snap-align:start;
    }
}
@container wapu-block-preview (max-width: 40em){
    .ws-pc-v1 .ws-pc-grid{
        grid-template-columns:none;
        grid-auto-flow:column;
        grid-auto-columns:clamp(17rem, 82vw, 20rem);
        overflow-x:auto;
        overscroll-behavior-inline:contain;
        scroll-snap-type:inline mandatory;
        scrollbar-color:var(--pg-style-accent) transparent;
        scrollbar-width:thin;
        padding-bottom:var(--wapu-space-2);
        -webkit-overflow-scrolling:touch;
    }
    .ws-pc-v1 .ws-pc-card{
        scroll-snap-align:start;
    }
}

.ws-pc-v1 .ws-pc-grid:focus-visible{
    outline:0.125rem solid var(--pg-style-accent);
    outline-offset:0.25rem;
}
@media (prefers-reduced-motion:reduce){
    .ws-pc-v1 .ws-pc-figure img{transition:none;}
}
