/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Description:  Default GeneratePress child theme
 Author:       Tom Usborne
 Author URI:   https://tomusborne.com
 Template:     generatepress
 Version:      0.1
*/

body {
    
    font-family: var(--font-primary);
    font-size: 1rem;
	overflow-x: hidden;
	
}


h1, h2, h3, h4, h5, h6 {
    line-height: 1.2em;
    font-family: var(--font-primary);
}

.tit {
    h1 {
        font-weight: 400;
        font-size: clamp(34px, 4.7vw, 62px);
    }

    h2 {
        font-weight: 400;
        font-size: clamp(30px, 3vw, 46px);
    }

    h3 {
        font-weight: 400;
        font-size: clamp(24px, 2vw, 30px);
    }

    h4 {
        font-weight: 400;
        font-size: clamp(18px, 1.5vw, 20px);
    }
}

.subtit {
    h3 {
        font-family: var(--f-secundaria);
        font-weight: 400;
        font-size: 22px;
    }
}

.subtit-p {
    p {
        font-family: var(--f-primaria);
        font-weight: 400;
        font-size: clamp(22px, 1.8vw, 28px);
    }
}

.c-blanco {
    color: var(--c-blanco);

    a {
        color: var(--c-blanco);

        &:hover {
            color: var(--c-gris);
        }
    }
}

.c-primario {
    color: var(--c-primary);
}

.c-verde {
    color: var(--c-secondary-light) !important;
}

.c-gradient {
    background: linear-gradient(
        90deg,
        var(--c-secondary) 0%,
        var(--c-secondary-light) 30%,
        var(--c-primary-light) 65%,
        var(--c-primary) 100%
    );

    background-clip: text;
    -webkit-background-clip: text;

    color: transparent !important;
    -webkit-text-fill-color: transparent;
}


.bg-gradient {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

/* Fondo degradado */
.bg-gradient::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;


    background: linear-gradient(
        90deg,
        var(--c-secondary) 0%,
        var(--c-secondary-light) 30%,
        var(--c-primary-light) 65%,
        var(--c-primary) 100%
    ) !important;

    pointer-events: none;
}

/* Contenido por encima del degradado */
.bg-gradient > .e-con-inner {
    position: relative;
    z-index: 1;
}

.plv-list {
    list-style: none;
    counter-reset: plv-item;
    width: 100%;
    max-width: 760px;
    margin: 0;
    padding: 0;
}

.plv-list li {
    counter-increment: plv-item;

    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    align-items: start;
    gap: 18px;

    width: 100%;
    margin: 0;
    padding: 18px 0;

    border-bottom: 1px solid rgba(23, 61, 120, 0.12);
}

.plv-list li::before {
    content: counter(plv-item, decimal-leading-zero);

    display: flex;
    align-items: center;
    justify-content: center;

    width: 42px;
    height: 42px;

    color: #fff;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;

    background: linear-gradient(
        135deg,
        #70bf44 0%,
        #20a7d6 55%,
        #173d78 100%
    );

    border-radius: 12px;
    box-shadow: 0 6px 16px rgba(32, 167, 214, 0.18);
}

.plv-list__content {
    min-width: 0;
    color: var(--c-text);
    font-size: 16px;
    line-height: 1.55;
}

.plv-list__content strong {
    display: block;
    margin-bottom: 4px;
    color: var(--c-text);
    font-weight: 700;
}

.plv-list__content span {
    display: block;
}

.plv-list li:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.gradient-list {
    list-style: none;
    margin: 0;
    padding: 0;
    padding-bottom: 20px;
    padding-left: 20px;
}

.gradient-list li {
    position: relative;

    margin: 0;
    padding: 6px 0 6px 24px;

    color: var(--c-text);
    font-size: 16px;
    line-height: 1.6;
}

.gradient-list li::before {
    content: "";

    position: absolute;
    top: 15px;
    left: 0;

    width: 10px;
    height: 10px;

    background: linear-gradient(
        135deg,
        #70bf44 0%,
        #20a7d6 55%,
        #173d78 100%
    );

    border-radius: 50%;

    box-shadow: 0 3px 8px rgba(32, 167, 214, 0.22);
}

@media (max-width: 767px) {
    .plv-list li {
        grid-template-columns: 36px minmax(0, 1fr);
        gap: 14px;
        padding: 15px 0;
    }

    .plv-list li::before {
        width: 36px;
        height: 36px;
        font-size: 12px;
        border-radius: 10px;
    }

    .plv-list__content {
        padding-top: 3px;
        font-size: 15px;
    }
}


/* ----- RESPONSIVE ------ */

@media screen and (max-width:1024px) {

}

@media screen and (max-width:767px) {

}

/* TIMELINE */
.timeline-wrap-fix {
	display: flex;
	justify-content: center;
	max-width: 100%;
	overflow: visible;

	.timeline-box-fix {
		position: relative;
		width: 1200px;
		max-width: 100%;
		padding: 0;

		.timeline__vertical-fix {
			position: relative;

			.timeline__bar-bg-fix,
			.timeline__bar-fill-fix {
				position: absolute;
				left: 0;
				right: 0;
				margin: auto;
				top: 2px;
				width: 3px;
				z-index: 2;
				border-radius: 100px;
			}

			.timeline__bar-bg-fix {
				background: var(--c-primary-light);
				z-index: 2;
			}

			.timeline__bar-fill-fix {
				background: var(--c-secondary-light);
				z-index: 2;
				height: 0;
				transition: height .25s;
			}

			.timeline__big-dot-fix {
				position: absolute;
				left: 0;
				right: 0;
				margin: auto;
				width: 30px;
				height: 30px;
				background: var(--c-secondary-light);
				z-index: 2;
				border-radius: 50%;
				box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.05);
				transform: translateY(0);
				transition: box-shadow .15s, width .2s, height .2s;
				pointer-events: none;
			}

			.timeline-list-fix {
				list-style: none;
				padding: 0;
				margin: 0;

				.timeline-item-fix {
					display: flex;
					align-items: center;
					margin: 0 0 40px 0;
					position: relative;
					gap: 120px;

					&:nth-child(2n) {
						flex-direction: row-reverse;
					}

					&:last-child {
						margin-bottom: 0;
					}
				}

				.timeline__year-fix {
					height: 300px;
					width: 45%;
					display: flex;
					align-items: center;
					justify-content: center;
					font-size: clamp(20px, 4vw, 50px);
					font-weight: 700;
					line-height: 1;
					color: var(--c-primary);
					letter-spacing: -0.02em;
					opacity: 0;
					transition: opacity 3s ease-out;
				}

				.timeline__year-visible {
					opacity: 1 !important;
				}

				.timeline-item-fix.passed .timeline__year-fix,
				.timeline-item-fix.active .timeline__year-fix {
					color: var(--c-secondary-light);
				}

				.timeline__punto-fix {
					z-index: 2;
					position: absolute;
					left: 0;
					right: 0;
					/* top: 4px; */
					top: 50%;
					margin: 0 auto;
					width: 30px;
					height: 30px;
					border-radius: 50%;
					background: var(--c-primary-light);
					color: var(--c-white);
					transition: background .2s, border .15s;
					display: flex;
					align-items: center;
					justify-content: center;
					font-size: 20px;
					font-weight: 600;
				}

				.timeline-item-fix.passed .timeline__punto-fix,
				.timeline-item-fix.active .timeline__punto-fix {
					background: var(--c-secondary-light);
				}

				.timeline__card-fix {
					width: 100%;
					flex: 1;
					background: none;
					padding: 0 0 0 0;
					min-width: 200px;
					display: flex;
					flex-direction: column;
					justify-content: flex-start;
					align-items: flex-start;
					word-break: break-word;
					background-color: var(--c-white);
					padding: 40px;
					border-radius: 15px;
					box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
				}

				.timeline__tit-fix {
					font-weight: 500;
					font-size: clamp(22px, 3vw, 28px);
					color: var(--alt);
				}

				.timeline__txt-fix {
					margin-top: 7px;
				}

				/* Limpiar listas y contenido WP */
				.timeline__txt-fix ul,
				.timeline__txt-fix ol {
					padding-left: 20px;
					margin: 7px 0;

					li {
						margin-bottom: 3px;

						&:last-child {
							margin-bottom: 0;
						}

						ul {
							list-style: square;

							li {
								&::marker {
									color: var(--c-text);
								}
							}
						}
					}
				}

			}
		}

		@media screen and (max-width: 1200px) {
			.timeline__vertical-fix {
				.timeline__year-fix {
					height: 300px;
					font-size: clamp(48px, 8vw, 100px);
				}
			}
		}

		@media screen and (max-width: 767px) {
			.timeline__vertical-fix {

				.timeline__bar-bg-fix,
				.timeline__bar-fill-fix {
					margin-left: 15px;
				}

				.timeline__big-dot-fix {
					margin-left: 0;
				}

				.timeline-item-fix {
					flex-direction: column !important;
					gap: 20px !important;
					padding-left: 45px;

					.timeline__punto-fix {
						margin-left: 0;
						top: 0;
					}

					.timeline__year-fix {
						height: auto;
						width: 100%;
						font-size: clamp(20px, 10vw, 70px);
						opacity: 1;
						justify-content: flex-start;
						margin-top: -6px;
					}

					.timeline__card-fix {
						padding: 0;
						background-color: transparent;
						box-shadow: none;
					}
				}
			}
		}
	}
}