/**
 * Wapu Blocks · Content Style para Contenido
 *
 * Los bloques conservan su composición y consumen estas variables.
 * Retícula: 8px; 4px únicamente para microespacios.
 * Tipografía: 24 / 18 / 16 / 12.
 */

/* Productos en pestañas: composición deliberadamente minimal. */
.pt-section {
    padding: clamp(40px, 6vw, 64px) clamp(16px, 4vw, 48px);
    background: var(--ws-surface, #fff);
    color: var(--ws-text, #1a1a1a);
    font-family: var(--ws-fb);
}

.pt-header {
    max-width: 1400px;
    margin: 0 auto 24px;
    text-align: left;
}

.pt-eyebrow {
    display: block;
    margin-bottom: 8px;
    color: var(--ws-accent, currentColor);
    font-size: var(--wapu-type-small, 14px);
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.pt-title {
    margin: 0;
    font-family: var(--ws-fh);
    font-size: var(--wapu-type-h2, 24px);
    font-weight: 650;
    line-height: 1.16;
    letter-spacing: -.02em;
}

.pt-tabs {
    display: flex;
    max-width: 1400px;
    align-items: center;
    gap: 24px;
    margin: 0 auto 32px;
    overflow-x: auto;
    border-bottom: 1px solid var(--ws-border, rgb(17 24 39 / 14%));
    scrollbar-width: none;
}

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

.pt-tab {
    position: relative;
    flex: 0 0 auto;
    padding: 8px 0 12px;
    border: 0;
    border-radius: 0 !important;
    background: transparent;
    color: inherit;
    font: 600 14px/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: 2px;
    background: var(--ws-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: 24px;
    max-width: 1400px;
    margin: 0 auto;
}

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

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

.pt-empty {
    grid-column: 1 / -1;
    padding: 48px 16px;
    text-align: center;
    opacity: .5;
}

@media (max-width: 1100px) {
    .pt-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .pt-section {
        padding-block: 40px;
    }

    .pt-header {
        margin-bottom: 16px;
    }

    .pt-tabs {
        gap: 20px;
        margin-bottom: 24px;
    }

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

    .pt-card {
        flex: 0 0 min(76vw, 280px);
        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: 4px;
    --wapu-space-1: 8px;
    --wapu-space-2: 16px;
    --wapu-space-3: 24px;
    --wapu-space-4: 32px;
    --wapu-space-5: 40px;
    --wapu-space-6: 48px;
    --wapu-space-8: 64px;
    --wapu-content-title: 24px;
    --wapu-content-subtitle: 18px;
    --wapu-content-body: 16px;
    --wapu-content-small: 12px;
    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: 720px;
    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 -3px;
}

.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(96px, 14vw, 160px) clamp(24px, 6vw, 80px);
        background: var(--ws-bg);
        color: var(--ws-t);
    }
    .ws-quote-inner {
        max-width: 880px;
        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(--ws-fh);
        font-size: clamp(64px, 8vw, 120px);
        line-height: 0.9;
        color: var(--ws-a, var(--ws-m));
        margin-bottom: 24px;
        font-style: italic;
        font-weight: 500;
    }
    .ws-quote-text {
        font-family: var(--ws-fh);
        font-size: var(--wapu-content-title);
        font-weight: 400;
        font-style: italic;
        line-height: 1.08;
        letter-spacing: 0;
        color: var(--ws-t);
        margin: 0 0 var(--wapu-space-4);
    }
    .ws-quote-source {
        font-family: var(--ws-fb);
        font-size: var(--wapu-content-small);
        font-weight: 600;
        letter-spacing: .24em;
        text-transform: uppercase;
        color: var(--ws-m);
    }
    @media (max-width: 640px) {
        .ws-quote-v1 { padding: 72px 24px; }
        .ws-quote-text { font-size: var(--wapu-content-title); }
        .ws-quote-mark { font-size: 72px; }
    }


/* blocks/contenido/stats-v1 */
.ws-stats-v1 {
        padding: clamp(64px, 10vw, 128px) clamp(24px, 5vw, 80px);
        background: var(--ws-surface);
        color: var(--ws-text);
        font-family: var(--ws-fb);
    }
    .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(--ws-accent);
        font-weight: 500;
        margin-bottom: 48px;
    }
    .ws-stats-v1 .ws-stats-grid {
        display: grid;
        grid-template-columns: repeat(var(--ws-cols), 1fr);
        gap: 0;
        max-width: 1200px;
        margin: 0 auto;
    }
    .ws-stats-v1 .ws-stat {
        text-align: center;
        padding: 0 clamp(16px, 3vw, 40px);
        border-right: .5px solid var(--ws-border);
    }
    .ws-stats-v1 .ws-stat:last-child { border-right: none; }
    .ws-stats-v1 .ws-stat-num {
        font-family: var(--ws-fh);
        font-size: clamp(48px, 8vw, 96px);
        font-weight: 400;
        letter-spacing: 0;
        line-height: 1;
        color: var(--ws-text);
        margin-bottom: 16px;
        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(--ws-muted);
        line-height: 1.4;
    }
    .ws-stats-v1 .ws-stats-hint {
        display: block;
        text-align: center;
        font-size: var(--wapu-content-small);
        color: var(--ws-muted);
        font-style: italic;
        margin-top: 32px;
        opacity: .7;
    }
    @media (max-width: 640px) {
        .ws-stats-v1 .ws-stats-grid {
            grid-template-columns: none;
            grid-auto-flow: column;
            grid-auto-columns: clamp(240px, 72vw, 288px);
            overflow-x: auto;
            overscroll-behavior-inline: contain;
            scroll-snap-type: inline mandatory;
            scrollbar-color: var(--ws-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(--ws-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(48px, 18vw, 72px);
        }
    }
    .ws-stats-v1 .ws-stats-grid:focus-visible {
        outline: 2px solid var(--ws-accent);
        outline-offset: 4px;
    }


/* blocks/contenido/team-roster-v1 */
.ws-team-roster-v1 {
        background: var(--ws-bg);
        padding: clamp(56px, 7vw, 96px) clamp(16px, 4vw, 48px);
        font-family: var(--ws-fb);
        color: var(--ws-t);
    }
    .ws-team-roster-v1__wrap { max-width: 1280px; 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: 720px;
        margin: 0 auto clamp(36px, 5vw, 64px);
        display: flex; flex-direction: column;
        align-items: center; gap: var(--wapu-space-1);
    }
    .ws-team-roster-v1__subtitle {
        font-family: var(--ws-fb);
        font-size: var(--wapu-content-body); line-height: 1.6;
        color: var(--ws-m); margin: 0; max-width: 48ch;
    }
    .ws-team-roster-v1__grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: clamp(24px, 3vw, 40px);
    }
    .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(120px, 14vw, 200px);
        height: clamp(120px, 14vw, 200px);
        border-radius: 50%;
        border: 3px solid var(--ws-a);
        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(--ws-fb);
        font-size: var(--wapu-content-small); line-height: 1.4;
        color: var(--ws-m); margin: 0;
    }
    @media (max-width: 900px) { .ws-team-roster-v1__grid { grid-template-columns: repeat(2, 1fr); } }
    @media (max-width: 640px) {
        .ws-team-roster-v1__grid {
            grid-template-columns: none;
            grid-auto-flow: column;
            grid-auto-columns: clamp(232px, 72vw, 280px);
            gap: var(--wapu-space-2);
            overflow-x: auto;
            overscroll-behavior-inline: contain;
            scroll-snap-type: inline mandatory;
            scrollbar-color: var(--ws-a) 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: 2px solid var(--ws-a);
        outline-offset: 4px;
    }


/* blocks/contenido/contenidos-faqs-v1 */
.cf-section {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(var(--wapu-space-3), 4vw, 80px);
    padding: clamp(var(--wapu-space-5), 5vw, 80px) clamp(var(--wapu-space-2), 4vw, var(--wapu-space-8));
    align-items: center;
    font-family: var(--ws-fb);
    background: var(--ws-surface, #fdfbf5);
    color: var(--ws-primary, #1a1a1a);
    box-sizing: border-box;
}

.ws-quote-v1.is-empty {
	padding: 48px 24px;
	background: var(--ws-bg);
	color: var(--ws-m);
	font-family: var(--ws-fb);
	text-align: center;
}

.ws-quote-v1.is-empty p { margin: 0; }
.cf-tone-dark   { background: var(--ws-surface, #050505); color: #fff; }

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

.cf-image {
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: var(--ws-secondary, #e5e5e5);
    border-radius: 2px;
}
.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(--ws-fh);
    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(--ws-border, rgba(0,0,0,0.08));
}
.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(--ws-fh);
    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: 800px;
    padding: 0 0 var(--wapu-space-3);
}
.cf-faq-a p { margin: 0 0 8px; }
.cf-faq-a p:last-child { margin-bottom: 0; }

@media (max-width: 900px) {
    .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:32px;
    background:var(--ws-bg);
    padding:64px 48px;
    font-family:var(--ws-fb) !important;
    color:var(--ws-t);
}
.ws-obs-v1 .ws-obs-wrap{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:var(--gap);
    align-items:center;
    max-width:1280px;
    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(--ws-fh) !important;
    font-size:var(--wapu-content-title);
    font-weight:800;
    letter-spacing: 0;
    line-height:1;
    margin:0 0 24px 0;
    color:var(--ws-t);
    text-transform:uppercase;
}
.ws-obs-v1 .ws-obs-desc{
    font-size:var(--wapu-content-body);
    line-height:1.5;
    color:var(--ws-t);
    max-width:480px;
    margin:0 0 40px 0;
    opacity:.85;
}
.ws-obs-v1 .ws-obs-cta{
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-height:40px;
    margin:0 0 32px;
    padding:0 16px;
    border-radius:999px;
    background:var(--wapu-button-bg,var(--ws-p));
    color:var(--wapu-button-text,var(--ws-bg));
    text-decoration:none;
    font-size:var(--wapu-content-small);
    font-weight:800;
}

.ws-obs-v1 .ws-obs-tabs{
    display:flex;
    flex-direction:column;
    gap:8px;
    margin-bottom:24px;
}
.ws-obs-v1 .ws-obs-tab{
    all:unset;
    cursor:pointer;
    font-family:var(--ws-fh) !important;
    font-size:var(--wapu-content-subtitle);
    font-weight:800;
    letter-spacing: 0;
    line-height:1.1;
    color:var(--ws-m);
    text-transform:uppercase;
    transition:color .2s ease;
    padding:4px 0;
}
.ws-obs-v1 .ws-obs-tab:hover,
.ws-obs-v1 .ws-obs-tab.is-active{
    color:var(--ws-t);
}

.ws-obs-v1 .ws-obs-tab-desc{
    font-size:var(--wapu-content-small);
    line-height:1.5;
    color:var(--ws-t);
    margin:0;
    max-width:480px;
    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:560px;
    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:16px;
    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,rgba(0,0,0,.08),rgba(0,0,0,.18));
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:8px;
    color:var(--ws-m);
}
.ws-obs-v1 .ws-obs-image-placeholder span{font-size:48px}
.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:64px 24px;
    color:var(--ws-m);
}
.ws-obs-v1 .ws-obs-empty p{margin:4px 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:640px){
    .ws-obs-v1.ws-obs-v1{padding:40px 24px}
    .ws-obs-v1 .ws-obs-wrap{grid-template-columns:1fr;gap:24px}
    .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(--ws-bg);
    color: var(--ws-t);
    font-family: var(--ws-fb);
    padding: clamp(48px, 6vw, 96px) clamp(24px, 4vw, 64px);
}
.ws-tl-v1 .ws-tl-inner { max-width: 1200px; margin: 0 auto; }

.ws-tl-v1 .ws-tl-header {
    text-align: center;
    max-width: 680px;
    margin: 0 auto clamp(40px, 6vw, 80px);
}
.ws-tl-v1 .ws-tl-eyebrow {
    font-size: var(--wapu-content-small);
    letter-spacing: .25em;
    text-transform: uppercase;
    color: var(--ws-a);
    font-weight: 600;
    margin-bottom: 16px;
}
.ws-tl-v1 .ws-tl-title {
    font-family: var(--ws-fh);
    font-size: var(--wapu-content-title);
    font-weight: 500;
    line-height: 1.1;
    color: var(--ws-p);
    margin: 0 0 16px;
    letter-spacing: 0;
}
.ws-tl-v1 .ws-tl-subtitle {
    font-size: var(--wapu-content-body);
    line-height: 1.6;
    color: var(--ws-m);
    margin: 0;
}

/* Track: horizontal */
.ws-tl-v1[data-layout="horizontal"] .ws-tl-track {
    position: relative;
    display: grid;
    gap: 16px;
}
.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: 8px;
    left: 5%;
    right: 5%;
    height: 1px;
    background: color-mix(in srgb, var(--ws-p) 20%, transparent);
    z-index: 0;
}

.ws-tl-v1[data-layout="horizontal"] .ws-tl-milestone {
    position: relative;
    z-index: 1;
    padding-top: 32px;
    text-align: center;
}
.ws-tl-v1[data-layout="horizontal"] .ws-tl-dot {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--ws-bg);
    border: 2px solid var(--ws-p);
    transition: all .3s ease;
}
.ws-tl-v1[data-layout="horizontal"] .ws-tl-milestone--highlighted .ws-tl-dot {
    background: var(--ws-a);
    border-color: var(--ws-a);
    box-shadow: 0 0 0 8px color-mix(in srgb, var(--ws-a) 20%, transparent);
    transform: translateX(-50%) scale(1.2);
}

/* Track: vertical */
.ws-tl-v1[data-layout="vertical"] .ws-tl-track {
    position: relative;
    max-width: 640px;
    margin: 0 auto;
    padding-left: 40px;
}
.ws-tl-v1[data-layout="vertical"] .ws-tl-line {
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 8px;
    width: 1px;
    background: color-mix(in srgb, var(--ws-p) 20%, transparent);
}
.ws-tl-v1[data-layout="vertical"] .ws-tl-milestone {
    position: relative;
    padding-bottom: 40px;
}
.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: 4px;
    left: -40px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--ws-bg);
    border: 2px solid var(--ws-p);
}
.ws-tl-v1[data-layout="vertical"] .ws-tl-milestone--highlighted .ws-tl-dot {
    background: var(--ws-a);
    border-color: var(--ws-a);
    box-shadow: 0 0 0 6px color-mix(in srgb, var(--ws-a) 20%, transparent);
}

/* Contenido del hito */
.ws-tl-v1 .ws-tl-year {
    font-family: var(--ws-fh);
    font-style: italic;
    font-size: var(--wapu-content-subtitle);
    font-weight: 500;
    color: var(--ws-p);
    line-height: 1;
    margin-bottom: 8px;
}
.ws-tl-v1 .ws-tl-milestone--highlighted .ws-tl-year {
    color: var(--ws-a);
}
.ws-tl-v1 .ws-tl-milestone-title {
    font-family: var(--ws-fb);
    font-size: var(--wapu-content-body);
    font-weight: 600;
    color: var(--ws-p);
    margin: 0 0 6px;
    letter-spacing: 0;
}
.ws-tl-v1 .ws-tl-milestone-desc {
    font-size: var(--wapu-content-small);
    line-height: 1.5;
    color: var(--ws-m);
    margin: 0;
}

/* Mobile */
@media (max-width: 640px) {
    .ws-tl-v1.ws-tl-v1 {
        padding: 48px 16px;
    }
    /* Horizontal se vuelve vertical auto en mobile */
    .ws-tl-v1[data-layout="horizontal"] .ws-tl-track {
        grid-template-columns: 1fr;
        padding-left: 40px;
        gap: 32px;
    }
    .ws-tl-v1[data-layout="horizontal"] .ws-tl-line {
        top: 8px;
        bottom: 8px;
        left: 8px;
        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: 4px;
        left: -40px;
        transform: none;
    }
    .ws-tl-v1[data-layout="horizontal"] .ws-tl-milestone--highlighted .ws-tl-dot {
        transform: none;
        box-shadow: 0 0 0 6px color-mix(in srgb, var(--ws-a) 20%, transparent);
    }
}


/* blocks/contenido/process-cards-v1 */
.ws-pc-v1{
    padding:clamp(56px, 8vw, 104px) clamp(var(--wapu-space-2), 4vw, 56px);
    background:var(--ws-sf);
    color:var(--ws-t);
    font-family:var(--ws-fb);
    box-sizing:border-box;
}
.ws-pc-v1 .ws-pc-inner{
    width:min(1180px, 100%);
    margin:0 auto;
}
.ws-pc-v1 .ws-pc-head{
    max-width:680px;
    margin:0 auto clamp(32px, 5vw, 56px);
    text-align:center;
}
.ws-pc-v1 .ws-pc-eyebrow{
    display:block;
    color:var(--ws-a);
    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(--ws-fh);
    font-size:var(--wapu-content-title);
    line-height:1.05;
    color:var(--ws-p);
    margin:0;
    text-transform:uppercase;
}
.ws-pc-v1 .ws-pc-subtitle{
    color:var(--ws-m);
    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, 48px);
    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:8px;
    background:linear-gradient(135deg, var(--ws-s), var(--ws-sfa));
    box-shadow:0 18px 42px rgba(0,0,0,.09);
}
.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(--ws-p) 45%, transparent);
    font-family:var(--ws-fh);
    font-size:clamp(44px, 7vw, 88px);
}
.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:32px;
    height:24px;
    margin-bottom:var(--wapu-space-2);
    border-radius:999px;
    background:var(--ws-p);
    color:var(--ws-sf);
    font-size:var(--wapu-content-small);
    font-weight:800;
    letter-spacing:.08em;
}
.ws-pc-v1 .ws-pc-item-title{
    font-family:var(--ws-fh);
    color:var(--ws-p);
    margin:0;
    font-size:var(--wapu-content-subtitle);
    line-height:1.18;
    text-transform:uppercase;
}
.ws-pc-v1 .ws-pc-desc{
    color:var(--ws-m);
    margin:8px 0 0;
    font-size:var(--wapu-content-body);
    line-height:1.55;
}
@media (max-width: 900px){
    .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: 640px){
    .ws-pc-v1 .ws-pc-grid{
        grid-template-columns:none;
        grid-auto-flow:column;
        grid-auto-columns:clamp(272px, 82vw, 320px);
        overflow-x:auto;
        overscroll-behavior-inline:contain;
        scroll-snap-type:inline mandatory;
        scrollbar-color:var(--ws-a) 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:2px solid var(--ws-a);
    outline-offset:4px;
}
@media (prefers-reduced-motion:reduce){
    .ws-pc-v1 .ws-pc-figure img{transition:none;}
}