:root {
	/* Tipografias */
	--font-1: 'Archivo', sans-serif;
	--font-2: 'Archivo', sans-serif;

	/* Font size */
	--body-size: 16px;
	--h1-size: 2.2rem;
	--h2-size: 1.8rem;
	--h3-size: 1.15rem;
	--h4-size: 1.05rem;
	--h5-size: 1rem;
	--h6-size: 1rem;

	 /* Colores */
	--color-black: #000000;
	--color-white: #ffffff;
	--color-gray-50: #f0f2f6;
	--color-gray-100: #E2E8F4;
	--color-gray-300: #CDCDCD;
	--color-gray-900: #333333;
	--color-yellow-500: #FFCC0D;
	--color-yellow-400: #FFD94A;
	--color-yellow-300: #F7E149;
	--color-yellow: var(--color-yellow-500);
}

/* Fonts styles */

html, body {color: var(--color-gray-500); font-size: var(--body-size); font-family: var(--font-1); line-height: 1.35; }
h1, h2, h3, h4, h5, h6, p {margin: 0;}
h1, .h1 {font-size: var(--h1-size);font-family: var(--font-2);font-weight: bold;line-height: 1.2;text-transform: uppercase;}
h2, .h2 {font-size: var(--h2-size); font-family: var(--font-2);font-weight: bold;line-height: 1.3;text-transform: uppercase;}
h3, .h3 {font-size: var(--h3-size); font-family: var(--font-2);font-weight: bold;line-height: 1.3;text-transform: uppercase;}
h4, .h4 {font-size: var(--h4-size); font-family: var(--font-2);font-weight: bold;line-height: 1.3;}
h5, .h5 {font-size: var(--h5-size); font-family: var(--font-2);font-weight: bold;line-height: 1.3;}
h6, .h6 {font-size: var(--h6-size); font-family: var(--font-2);font-weight: bold;line-height: 1.3; }
p {font-size: var(--body-size);line-height: 1.4;}
@media screen and (max-width:768px) {
	:root { 
	--body-size: 15px;
	--h1-size: 1.8rem;
	--h2-size: 1.6rem;
	--h3-size: 1.1rem;
	--h4-size: 1rem;
	--h5-size: 1rem;
	--h6-size: 1rem; 
	}
}
.h2 .label {margin-top: .5rem;display: inline-flex;padding: .5rem;line-height: 1;transform: rotate(-2.4deg);}
/* Others */
space { width: 100%; height: .5rem; display: block; }
space[h="2"] { height: 1rem; }
space[h="3"] { height: 1.5rem; }
space[h="4"] { height: 2rem; }
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active { -webkit-box-shadow: 0 0 0 30px white inset !important; }
figure { margin: 0; }
.ov-hidden { overflow: hidden; }
.radius { border-radius: 50% !important; }
.radius-1 { border-radius: 1rem; }
.radius-2 { border-radius: 2rem; }
.tt-up { text-transform: uppercase; }
.ls-1 { letter-spacing: .1em; }
.ls-2 { letter-spacing: .2em; }
.lh-1 { line-height: 1; }
hr { background-color: var(--color-gray-1); opacity: 1; }
::placeholder { opacity: 0.75; font-weight: normal; }
::-webkit-scrollbar { display: none; }
.empty { display: none; }
.link { text-decoration: underline; color: inherit; }
.link:hover { cursor: pointer; text-decoration: underline; }
ul, li { margin: 0; padding: 0; list-style: none }
.bold { font-weight: bold; }
.circle { border-radius: 50% }
.ff-1 { font-family: var(--font-1); }
.ff-2 { font-family: var(--font-2); }
.disabled { pointer-events: none; }
.disabled:hover { cursor: not-allowed; }
*:focus { outline: none; }
.fz-1 { font-size: 1.1rem; }
.fz-2 { font-size: 1.1rem; }
.fz-3 { font-size: 1.25rem; }
.fz-4 { font-size: 1.4rem; }
.fz-5 { font-size: 1..75rem; }

/* Botones */
.btn {font-weight: bold;text-decoration: none;border-radius: 2rem;line-height: 1;font-size: 1rem;padding: 1rem 1.5rem;display: inline-flex;align-items: center;justify-content: center;transition: .1s ease all;user-select: none;-webkit-user-select: none;position: relative;text-align: center;overflow: hidden;font-family: var(--font-2);gap: .5rem;transition: .3s ease all;text-transform: uppercase;}
.btn:hover { cursor: pointer; }
.btn.link { padding: 0; border-radius: unset;}
.btn .icon {height: 1.25rem;}
.btn:not(.link):hover {letter-spacing: .1rem;}
/* Colors */
.c-white { color: var(--color-white) !important; }
.c-black { color: var(--color-black) !important; }
.c-yellow {color: var(--color-yellow-500) !important; }
.bg-white { background-color: var(--color-white) !important; }
.bg-black { background-color: var(--color-black) !important; }

/* Filters */
.f-white { filter: invert(1); }

/* Icons */
.icon { aspect-ratio: 1/1; background-size: 100% 100%; height: 1rem; display: inline-block; background-position: 0% 0%; }
.icon-logo { background-image: url(../img/logo.svg); aspect-ratio: 13/3; background-size: cover; background-position: left center; }
.icon-mail { background-image: url(../img/icon_mail.svg); }
.icon-next { background-image: url(../img/icon_next.svg); }

/* Header */
header {margin: 0;height: 6rem;top: 0;left: 0;right: 0;z-index: 1;display: flex;align-items: center;color: var(--color-black);position: relative;background-color: var(--color-yellow-400);}
header .row { display: flex; align-items: center; position: relative; }
header .icon {height: 3rem;}

/* Sections */
section { padding-top: 6rem; padding-bottom: 6rem; }

/**/
.sect-1 {position: relative;padding-top: 0;background-color: var(--color-yellow-400);color: var(--color-black);text-align: center;}
.sect-1 img {width: 100%;margin-bottom: 1.5rem;}
.sect-1 .container-fluid {background-image: url(../img/s1_bg.svg);background-size: 60rem auto;background-repeat: repeat-x;background-position: center 25%;animation: s1_anim 60s linear infinite;}
@keyframes s1_anim {
    from {background-position: 0 25%; }
    to {background-position: -60rem 25%;}
}
/**/
.sect-2 {color: #000;text-align: center;}
.sect-2 img { width: 100% }
.sect-2 .col-a {text-align: right;}
.sect-2 .col-b img {width: 100%;}
.sect-2 .col-c {text-align: left;}
.sect-2 .h2 .label {background-color: var(--color-yellow-400);}
/**/
.sect-3 {background-color: var(--color-gray-50);text-align: center;padding-top: 0;padding-bottom: 0;overflow: hidden;}
.sect-3 .container { padding-top: 6rem; padding-bottom: 6rem; }
.sect-3 .container .row { position: relative; }
.sect-3 .deco { position: absolute; z-index: 0; height: 30rem; }
.sect-3 .deco-a { top: 0; left: -10rem; }
.sect-3 .deco-b { bottom: 0; right: -10rem; }
.sect-3 ul  {display: flex;flex-direction: column;gap: 1.5rem;}
.sect-3 ul li  {text-align:left;background-color: var(--color-white);padding: 1rem;display: flex;border: 2px solid var(--color-black);border-radius: 1rem;}
.sect-3 ul li .bx {display: flex;align-items: center;}
.sect-3 ul li .bx img {width: 9rem;height: 9rem;}
.sect-3 ul li .bx p {margin-top: 0.5rem;}
/**/
.sect-4 {background-color: var(--color-yellow-400);text-align: center;padding-bottom: 0;}
.sect-4 .h2 .label {background-color: var(--color-white);}
.sect-4 img { width: 100%;margin-top: 1.5rem;}

/**/

footer {background-color: var(--color-black);color: var(--color-gray-300);padding-top: 1rem;padding-bottom: 1rem;text-align: center;}

/* Not small screens */
@media screen and (min-width:768px) {
	.only-mobile { display: none !important; }
}

/* Small screens */
@media screen and (max-width:768px) {
	.only-desktop { display: none !important; }
	header {height: 4rem;}
	header .icon {height: 2.2rem;}
	.sect-1 img {padding-top: 2rem;}
	.sect-2 .col-a, .sect-2 .col-c {text-align: center;}
	.sect-2 .col-b img {margin: 1.5rem 0;}
	.sect-3 ul li {flex-direction: column; padding:.75rem}
	.sect-3 ul li .bx img {width: 6rem;height: 6rem;}
	.sect-3 ul li p {padding:.25rem .75rem .75rem}
	.sect-3 .deco-a {left: -5rem;}
	.sect-3 .deco-b {right: -5rem;}
	.sect-3 .deco {height: 20rem;}
	.sect-4 img {margin-top: 2rem;}
}

/**/ }

/* XS screens */
@media screen and (max-width:400px) { }

/* Large screens */
@media screen and (min-width:1200px) { }

/* XLarge screens */
@media screen and (min-width:1400px) { }