/******************************
*   Tipografias
******************************/
@import url('all.css');
@import url('typo.css');

:root {
    --negro: 0, 0, 0;
    --blanco: 255, 255, 255;

    --azul: 100, 188, 190;
    --azul_l: 164, 229, 230;
    --amarillo: 237, 202, 26;
    --verde: 102, 165, 82;
    --rojo: 204, 0, 3;
}


::selection {
    color: rgb(var(--blanco), 1);
    background: rgb(var(--negro), 1);
}
::-moz-selection {
    color: rgb(var(--blanco), 1);
    background: rgb(var(--negro), 1);
}
::-webkit-selection {
    color: rgb(var(--blanco), 1);
    background: rgb(var(--negro), 1);
}

/******************************
*   Reset
******************************/
*{
    border: 0px;
    margin: 0px;
    padding: 0px;
}
html {
    scroll-behavior: smooth;
    scroll-padding: 70px;
}
body {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-family: 'Gibson';
    font-weight: 300;
    font-style: normal;
    line-height: 1.4;
    font-size: 16px;
    color: rgb(var(--blanco), 1);
    background: rgb(var(--azul), 1);
}
figure {
    pointer-events: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
figure img { margin: 0 auto; }
img {
    max-width: 100%;
    height: auto;
    display: block;
}
a, a:link, a:hover, a:visited {
    color: inherit;
    text-decoration: none;
    cursor: pointer;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
ul,
ol {
    margin: 0;
    padding: 0;
    padding-inline-start: 20px;
}
li + li { margin-top: 15px; }
h1, h2, h3, h4, h5, h6 {
    margin: 0;
    font-weight: bold;
}
input,
select,
textarea {
    display: block;
    width: 100%;
    padding: 12px 16px;
    color: rgb(var(--negro), 1);
    background: rgb(var(--azul_l), 1);
    border-radius: 20px;
    -moz-appearance: none;
    -webkit-appearance: none;
}
textarea {
    width: 100%;
    max-width: 100%;
    min-width: 100%;
}
/* Change autocomplete styles in WebKit */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  -webkit-text-fill-color: ;
  -webkit-box-shadow: 0 0 0px 1000px transparent inset;
  transition: background-color 5000s ease-in-out 0s;
}
input::placeholder,
textarea::placeholder { color: rgb(var(--name), 1); }
button { background: transparent; }
input:focus,
select:focus,
textarea:focus,
button:focus { outline: none !important; }

p { margin: 0; }
p + *,
* + p,
* + ol,
* + ul { margin-top: 20px; }
ol + *,
ul + *,
* + h2,
* + h3,
* + h4,
* + h5,
* + h6 { margin-top: 40px; }

.tab {
    width: 100%;
    overflow: auto;
}
.tab table {
    width: 100%;
    min-width: 700px;
}
.tab table td {
    padding: 8px;
    position: relative;
    z-index: 1;
}
.tab table thead {
    background: rgb(var(--amarillo), 1);
    color: rgb(var(--negro), 1);
    font-weight: bold;
}
.tab table tbody tr + tr td { border-top: 1px solid rgb(var(--blanco), .4); }


/******************************
*   Loader
******************************/
.loader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
    overflow: hidden;
}
.load__bars {
    display: flex;
    width: 100%;
    height: 100%;
}
.load__bars div {
    width: 166.66%;
}
.load__bars div::before {
    content: '';
    display: flex;
    width: 100%;
    height: 100%;
    background: rgb(var(--amarillo), 1);
    -webkit-transform: scaleX(1.1);
    -moz-transform: scaleX(1.1);
    -ms-transform: scaleX(1.1);
    -o-transform: scaleX(1.1);
    transform: scaleX(1.1);
}

.logo__load {
    position: absolute;
    top: 50%;
    left: 50%;
    max-width: 250px;
    width: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

/******************************
*   General
******************************/
main {
    min-height: calc(100vh - 84px);
    position: relative;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    z-index: 10;
}
main section,
.sect__pag {
    padding: 60px 0;
    position: relative;
}

/* Head Section */
.head__sect {
    text-align: center;
    position: relative;
}
.head__sect * { line-height: 1; }
.head__sect + *,
* + .head__sect { margin-top: 60px; }
.head__sect h3 {
    font-size: 32px;
    display: inline-block;
    position: relative;
    line-height: 1;
    text-transform: uppercase;
}
.head__sect h3 span {
    display: grid;
    grid-template-columns: 1fr;
}
.head__sect h3 span::before,
.head__sect h3 span i {
    grid-area: 1 / 1 / 2 / 2;
    display: block;
    font-style: normal;
}
.head__sect h3 span::before {
    --negro: 2, 33, 57;
    content: attr(name);
    -webkit-text-stroke-width: 6px;
    -webkit-text-stroke-color: rgb(var(--negro), 1);
    color: rgb(var(--negro), 1);
}
.head__sect h3 + * { margin-top: 20px; }
.head__sect p {
    max-width: 750px;
    margin-left: auto;
    margin-right: auto;
    font-size: 18px;
    font-weight: bold;
    text-transform: uppercase;
    line-height: 1.2;
    color: rgb(var(--negro), 1);
}

#registrar .head__sect h3,
#registrar-lote .head__sect h3,
#registrar-codigo .head__sect h3  { margin-top: 20px; }
.c__back .cta__02 { gap: 10px; }
.c__back { text-align: left; }
.c__back .cta__02 div {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgb(var(--amarillo), 1);
}

/* CTA */
* + .c__cta { margin-top: 40px; }
.c__cta {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    -ms-flex-wrap: row wrap;
    flex-flow: row wrap;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 20px;
}
.cta__vert > span {
    display: flex;
    width: 100%;
    height: 0;
}
.cta {
    display: inline-flex;
    gap: 6px;
    align-items: center;
    text-align: center;
    justify-content: center;
    line-height: 1;
    padding: 12px 16px 10px;
    color: rgb(var(--blanco), 1);
    text-transform: uppercase;
    font-weight: bold;
    border-radius: 16px;
    position: relative;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
.cta__01 { background: rgb(var(--negro), .2); }
.cta__01:hover {
    color: rgb(var(--amarillo), 1) !important;
    background: rgb(var(--negro), 1);
}
.cta__02 {
    color: rgb(var(--negro), 1) !important;
    background: rgb(var(--blanco), 1);
}
.cta__03 {
    color: rgb(var(--negro), 1) !important;
    background: rgb(var(--amarillo), 1);
}
.cta__04 {
    color: rgb(var(--blanco), 1) !important;
    background: rgb(var(--rojo), 1);
}
.cta__05 {
    color: rgb(var(--negro), 1) !important;
    background: rgb(var(--amarillo), 1);
}
a.cta__06,
a.cta__06:hover {
    color: rgb(var(--negro), 1) !important;
    text-decoration: underline;
}
.cta__07 {
    color: rgb(var(--amarillo), 1) !important;
    background: rgb(var(--negro), 1);
}
.cta__08 {
    --verde: 92, 216, 0;
    background: rgb(var(--verde), 1);
}
.cta[disabled] {
    filter: grayscale(1);
    pointer-events: none;
    opacity: .2;
}

/* Master */
.cont__compo img {
    width: 100%;
    max-width: inherit;
}
.compo__empa {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    width: 100%;
}
.empa,
.empa > div { position: relative; }
.empa > div {
    padding-top: 54%;
}
.em__01 {
    grid-area: 1 / 2 / 2 / 3;
    z-index: 1;
}
.em__02 {
    grid-area: 1 / 1 / 2 / 2;
    -webkit-transform: translateX(24%);
    -moz-transform: translateX(24%);
    -ms-transform: translateX(24%);
    -o-transform: translateX(24%);
    transform: translateX(24%);
}
.em__03 {
    grid-area: 1 / 3 / 2 / 4;
    -webkit-transform: translateX(-24%);
    -moz-transform: translateX(-24%);
    -ms-transform: translateX(-24%);
    -o-transform: translateX(-24%);
    transform: translateX(-24%);
}
.c__ab {
    position: absolute;
    width: 100%;
    left: 0;
}
.bg__emp { bottom: 0; }
.f__emp {
    position: relative;
    filter: drop-shadow(0px -5px 10px rgb(var(--negro), .4));
    will-change: filter;
}
.ele__emp {
    filter: drop-shadow(0px 0px 15px rgb(var(--blanco), .9));
    will-change: filter;
}
.em__01 .ele__emp { top: 2%; }
.em__02 .ele__emp { top: 1%; }
.em__03 .ele__emp { top: 0; }
.cont__galle {
    margin-top: -8%;
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: space-between;
    filter: drop-shadow(-5px 0px 10px rgb(var(--negro), .4));
    will-change: filter;
}
.em__04 { width: 53%; }
.em__05 {
    margin-top: -2.5%;
    width: 46%;
}

/* Fil Box */
.fil__box + *,
* + .fil__box { margin-top: 60px; }
.fil__box {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    color: rgb(var(--negro), 1);
    background: rgb(var(--blanco), 1);
    border-radius: 10px;
    overflow: hidden;
    position: relative;
}
.fil__fil > .fil__01 { padding: 20px; }
.fil__fil > .fil__02 { padding: 40px 20px; }
.fil__01 {
    background: rgb(var(--amarillo), 1);
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: space-between;
    -webkit-justify-content: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between;
    flex-direction: column;
    text-align: center;
    gap: 30px;
}
.fil__01 .col__01 p:nth-child(1) {
    font-weight: bold;
    text-transform: uppercase;
    font-size: 24px;
}
.fil__01 .col__01 p:nth-child(2) { font-size: 18px; }
.fil__01 .col__02 span { display: block; }

.cantidad { font-size: 85%; }
.monto {
    font-size: 32px;
    font-weight: bold;
}
.fil__01 .col__02 .cta { min-width: 150px; }
.disclaimer { font-size: 85%; }
.disclaimer a { text-decoration: underline; }
.disclaimer__02 {
    font-weight: bold;
    font-size: 20px;
}
.cont__fil + * { margin-top: 30px; }
.cont__fil > * + * { margin-top: 12px; }
.fil__info {
    border-radius: 12px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    overflow: hidden;
    margin-right: auto;
    margin-left: auto;
    max-width: 550px;
}
.fil__info > div {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 6px;
    text-align: center;
    background: rgb(var(--negro), .1);
}
.fil__info > div:nth-child(1) { background: rgb(var(--amarillo), 1); }
.fil__info > div:nth-child(1),
.fil__info > div:nth-child(2) { font-weight: bold; }

/* Paginador */
.cont__pag ul {
    display: flex;
    justify-content: center;
    align-items: center;
    list-style: none;
}
.cont__pag ul li { margin-top: 0; }
.cont__pag ul li.arrows {
    border-radius: 50%;
    background: rgb(var(--amarillo), 1);
}
.cont__pag ul li.arrows a { color: rgb(var(--negro), 1); }
.cont__pag ul li a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 25px;
    height: 25px;
    font-weight: bold;
    color: rgb(var(--negro), .3);
}
.cont__pag ul li a:hover,
.cont__pag ul li a.active { color: rgb(var(--negro), 1); }

/* LB */
.cont__lb {
    position: fixed;
    width: 100%;
    height: 100vh;
    height: 100dvh;
    top: 0;
    left: 0;
    overflow: auto;
    overflow: scroll;
    background: rgb(var(--negro), .6);
    z-index: 1000;
}
.c__center {
    padding: 60px 15px;
    min-height: 100vh;
    min-height: 100dvh;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    flex-direction: column;
}
.box__lb {
    max-width: 450px;
    margin: 0 auto;
    position: relative;
    padding: 50px 20px;
    border-radius: 10px;
    overflow: hidden;
    text-align: center;
    z-index: 1;
}
.box__01 { background: rgb(var(--azul), 1); }
.box__01::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('../img/lineas.svg') center no-repeat;
    background-size: 150%;
    opacity: .1;
}
.box__02 { background: rgb(var(--rojo), 1); }
.btn__clos {
    position: absolute;
    top: 10px;
    right: 10px;
    background: rgb(var(--amarillo), 1);
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
    z-index: 10;
    cursor: pointer;
}
.btn__clos span {
    color: rgb(var(--negro), 1);
    font-weight: bold;
    line-height: 0;
}
.box__lb * + .head__sect { margin-top: 0; }
.box__lb .head__sect + * { margin-top: 30px; }
.box__lb .head__sect h3 { font-size: 24px; }
.box__lb .head__sect * + h3 { margin-top: 15px; }
.icon__head {
    width: 50px;
    margin-left: auto;
    margin-right: auto;
}
.box__lb::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('../img/star.svg') no-repeat, url('../img/star.svg') no-repeat;
    background-position: 10% 70%, 97% 57%;
    background-size: 30px, 50px;
    z-index: -1;
    opacity: .6;
}

/* ------ Stars ------ */
.c__stars {
    position: absolute;
    top: 10px;
    left: 10px;
    right: 10px;
    bottom: 10px;
    z-index: -1;
}
.c__stars .star {
    position: absolute;
    width: 35px;
    opacity: .7;
}
.c__stars .star figure { display: block; }
#home .c__stars { z-index: initial; }
footer .c__stars { z-index: 1; }

/* ------ Elementos ------ */
.elem {
    position: absolute;
    filter: drop-shadow(0px 0 10px rgb(var(--negro), .3));
    will-change: filter;
}

/* ------ Graf ------ */
.c__graf .ti__01 {
    width: 10%;
    min-width: 100px;
    left: -50px;
    bottom: 0%;
    -webkit-transform: rotate(-85deg);
    -moz-transform: rotate(-85deg);
    -ms-transform: rotate(-85deg);
    -o-transform: rotate(-85deg);
    transform: rotate(-85deg);
}
.c__graf .cupon {
    width: 8%;
    min-width: 60px;
}
.c__graf .cu__01 {
    bottom: 5%;
    left: 6%;
    -webkit-transform: rotate(-35deg);
    -moz-transform: rotate(-35deg);
    -ms-transform: rotate(-35deg);
    -o-transform: rotate(-35deg);
    transform: rotate(-35deg);
}
.c__graf .cu__02 {
    top: 5%;
    right: 6%;
    -webkit-transform: rotate(35deg);
    -moz-transform: rotate(35deg);
    -ms-transform: rotate(35deg);
    -o-transform: rotate(35deg);
    transform: rotate(35deg);
}
.c__graf .bi__01 {
    width: 4%;
    min-width: 40px;
    left: 8%;
    top: 3%;
    -webkit-transform: rotate(100deg);
    -moz-transform: rotate(100deg);
    -ms-transform: rotate(100deg);
    -o-transform: rotate(100deg);
    transform: rotate(100deg);
}
.c__graf .bi__02 {
    width: 5%;
    min-width: 60px;
    right: 8%;
    bottom: 6%;
    -webkit-transform: rotate(-125deg);
    -moz-transform: rotate(-125deg);
    -ms-transform: rotate(-125deg);
    -o-transform: rotate(-125deg);
    transform: rotate(-125deg);
}

/******************************
*   Teaser / Fin
******************************/
#teaser .wrapper { position: relative; }
#teaser .header { padding: 10px; }
#teaser .deste {
    position: absolute;
    padding: 0;
    height: 100%;
    width: 100%;
    bottom: 0;
    opacity: .2;
}
#teaser .deste figure {
    width: 100%;
    height: 100%;
}
#teaser .deste figure img {
    width: 100%;
    max-width: initial;
    height: 100%;
    object-position: center;
    object-fit: cover;
}
#teaser .bg__footer {
    bottom: 0;
    height: calc(100% + 450px);
    top: -450px;
    z-index: -1;
}


.cont__anuncio {
    padding-left: 15px;
    padding-right: 15px;
    text-align: center;
    position: relative;
    z-index: 1;
}
.cont__anuncio > div + div { margin-top: 30px; }
.an__01 {
    padding-top: 6%;
    padding-bottom: 8%;
}
.an__01 figure {
    -webkit-transform: rotate(-12deg);
    -moz-transform: rotate(-12deg);
    -ms-transform: rotate(-12deg);
    -o-transform: rotate(-12deg);
    transform: rotate(-12deg);
}
.txt__anun { width: 100%; }
.txt__anun > * {
    position: relative;
    text-transform: uppercase;
    font-weight: bold;
    display: grid;
    grid-template-columns: 1fr;
}
.txt__anun > * span {
    grid-area: 1 / 1 / 2 / 2;
    display: block;
}
.txt__anun > * span:nth-child(1) {
    --negro: 2, 33, 57;
    -webkit-text-stroke-width: 6px;
    -webkit-text-stroke-color: rgb(var(--negro), 1);
    color: rgb(var(--negro), 1);
}
.txt__anun > h2 {
    font-size: 28px;
    color: rgb(var(--amarillo), 1);
}
.txt__anun > p {
    margin-left: auto;
    margin-right: auto;
    font-size: 20px;
}


/******************************
*   Home
******************************/
#home section .container {
    position: relative;
    z-index: 1;
}
/* ------ Inicio ------ */
.inicio { padding-top: 30px; }
.ele__ini {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
}
.destello__ini {
    position: absolute;
    width: 100%;
    padding-top: 100%;
    bottom: 30%;
    left: 0;
    overflow: hidden;
    opacity: .4;
}
.destello__ini figure {
    position: absolute;
    top: 0;
    left: -30%;
    right: -30%;
}
.bg__inicio {
    position: absolute;
    width: 100%;
    height: 45%;
    left: 0;
    right: 0;
    bottom: 0;
    -webkit-mask-image: url('../img/square-curv.svg');
    mask-image: url('../img/square-curv.svg');
    mask-repeat: no-repeat;
    mask-size: 100%;
    background: rgb(var(--amarillo), 1);
}
.bg__inicio::before,
.bg__inicio::after {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
.bg__inicio::before,
.bg__inicio::after { content: ''; }
.bg__inicio::before {
    background-image: url('../img/trama.webp');
    background-position: center;
    background-size: 1500px;
    mix-blend-mode: color-dodge;
}
.bg__inicio::after {
    background: url('../img/curv.svg') top no-repeat;
    background-size: 100%;
    top: -1px;
}
.cont__ini {
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px;
    position: relative;
    z-index: 1;
}
.cont__ini > * + * { margin-top: 30px; }
.cont__ini > div {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;

}
.ini__04 {
    color: rgb(var(--negro), 1);
    font-size: 11px;
    text-align: center;
}
.ini__01 figure,
.ini__02 figure { margin:  0 auto; }
.ini__01 figure {
    max-width:  400px;
    width: 70%;
}
.ini__02 figure {
    max-width:  400px;
    width: 80%;
}
.ini__03 .cont__compo {
    width: 100%;
    margin: 0 auto;
}

.inicio .cu__01 {
    width: 8%;
    min-width:  50px;
    left: 0%;
    top: 4%;
    -webkit-transform: rotate(-20deg);
    -moz-transform: rotate(-20deg);
    -ms-transform: rotate(-20deg);
    -o-transform: rotate(-20deg);
    transform: rotate(-20deg);
}
.inicio .cu__02 {
    width: 6%;
    min-width: 40px;
    right: 5%;
    top: 2%;
    -webkit-transform: rotate(35deg);
    -moz-transform: rotate(35deg);
    -ms-transform: rotate(35deg);
    -o-transform: rotate(35deg);
    transform: rotate(35deg);
}
.inicio .bi__01 {
    width: 9%;
    min-width: 40px;
    left: 5%;
    bottom: 62%;
}
.inicio .bi__02 {
    width: 9%;
    min-width: 40px;
    right: 8%;
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    transform: rotateY(180deg);
    bottom: 69%;
}
.inicio .tira__01 {
    width: 30%;
    left: 40%;
    top: 50%;
    -webkit-transform: translateX(-50%) rotate(-55deg);
    -moz-transform: translateX(-50%) rotate(-55deg);
    -ms-transform: translateX(-50%) rotate(-55deg);
    -o-transform: translateX(-50%) rotate(-55deg);
    transform: translateX(-50%) rotate(-55deg);
}

/* ------ Mecanica ------ */
.mecanica {
    margin-top: -5px;
    padding-top: 20px;
    padding-bottom: 200px;
}
.mecanica::before {
    content: '';
    position: absolute;
    height: 120px;
    width: 100%;
    top: -60px;
    background: linear-gradient(to bottom,  rgba(250,213,28,0) 0%,rgba(250,213,28,1) 50%,rgba(250,213,28,0) 100%);
    z-index: 1;
    mix-blend-mode: luminosity;
}
.mecanica .container {
    position: relative;
    z-index: 1;
}
.bg__dina {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    right: 0;
    bottom: 0;
    -webkit-mask-image: url('../img/square-curv01.svg');
    mask-image: url('../img/square-curv01.svg');
    mask-repeat: no-repeat;
    mask-position: center bottom;
    -webkit-mask-position: center bottom;
    mask-size: 100%;
    background: rgb(var(--amarillo), 1);
}
.bg__dina::before,
.bg__dina::after {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
.bg__dina::before,
.bg__dina::after { content: ''; }
.bg__dina::before {
    background-image: url('../img/trama.webp');
    background-position: center;
    background-size: 1500px;
    mix-blend-mode: color-dodge;
}
.bg__dina::after {
    background: url('../img/curv01.svg') bottom no-repeat;
    background-size: 100%;
    bottom: -1px;
    z-index: 10;
}
.mecanica .head__sect p {
    font-size: 26px;
    color: rgb(var(--blanco), 1);
    display: grid;
    grid-template-columns: 1fr;
}
.mecanica .head__sect p span {
    grid-area: 1 / 1 / 2 / 2;
    position: relative;
    display: block;
}
.mecanica .head__sect p span:nth-child(1) {
    content: attr(name);
    -webkit-text-stroke-width: 6px;
    -webkit-text-stroke-color: rgb(var(--negro), 1);
    color: rgb(var(--negro), 1);
}
.mecanica .head__sect p span i {
    color: rgb(var(--verde), 1);
    font-style: normal;
}
.fil__pasos > div + div { margin-top: 40px; }
.fil__pasos > div { margin: 0 auto; }
.paso {
    position: relative;
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
}
.paso div:nth-last-child(-n+2) + * { margin-top: 30px; }
.number {
    position: absolute;
    top: 0%;
    left: 0%;
    width: 16%;
    padding-top: 16%;
    background: rgb(var(--negro), 1);
    border-radius: 50%;
    z-index: 10;
}
.number span {
    position: absolute;
    top: 50%;
    left: 50%;
    font-size: 34px;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    line-height: 0;
}
.paso__text > * {
    position: relative;
    display: grid;
    grid-template-columns: 1fr;
}
.paso__text > * span {
    grid-area: 1 / 1 / 2 / 2;
    display: block;
}
.paso__text > * span:nth-child(1) {
    --negro: 2, 33, 57;
    content: attr(name);
    -webkit-text-stroke-width: 6px;
    -webkit-text-stroke-color: rgb(var(--negro), 1);
    color: rgb(var(--negro), 1);
}
.paso__text h4 {
    font-size: 32px;
    color: rgb(var(--azul), 1);
}
.paso__text p { font-size: 18px; }
.paso__text p::before { -webkit-text-stroke-width: 4.5px; }
.paso02 .paso__text h4 { color: rgb(var(--blanco), 1); }

.ele__mec {
    position: relative;
    margin-bottom: 60px;
    pointer-events: none;
}
.ele__mec .tira {
    position: relative;
    width: 40%;
    min-width: 350px;
    padding-top: 10%;
    margin: 0 auto;
    z-index: 10;
}
.ele__mec .tira div {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 40%;
    -webkit-transform: translate(-50%, -50%) rotate(-30deg);
    -moz-transform: translate(-50%, -50%) rotate(-30deg);
    -ms-transform: translate(-50%, -50%) rotate(-30deg);
    -o-transform: translate(-50%, -50%) rotate(-30deg);
    transform: translate(-50%, -50%) rotate(-30deg);
}
.ele__mec .cu__01 {
    width: 8%;
    min-width: 50px;
    top: 80%;
    left: 10%;
    -webkit-transform: rotate(-25deg);
    -moz-transform: rotate(-25deg);
    -ms-transform: rotate(-25deg);
    -o-transform: rotate(-25deg);
    transform: rotate(-25deg);
}
.ele__mec .bi__01 {
    width: 6%;
    min-width: 50px;
    top: 80%;
    right: 10%;
    -webkit-transform: rotate(-125deg);
    -moz-transform: rotate(-125deg);
    -ms-transform: rotate(-125deg);
    -o-transform: rotate(-125deg);
    transform: rotate(-125deg);
}


/* ------ Premios ------ */
.premios { padding: 100px 0; }
.bg__premios {
    position: absolute;
    top: -120px;
    left: 0;
    width: 100%;
    overflow: hidden;
    opacity: .15;
    z-index: -1;
}
.bg__premios figure {
    -webkit-transform: scale(2);
    -moz-transform: scale(2);
    -ms-transform: scale(2);
    -o-transform: scale(2);
    transform: scale(2);
    transform-origin: 50% 0%;
}
.bg__premios figure img {
    width: 100%;
    max-width: none;
}
.premios .contaienr {
    position: relative;
    z-index: 1;
}
.fil__premios > div + div { margin-top: 40px; }
.fil__premios > div { margin: 0 auto; }
.premio {
    position: relative;
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
}
.premio > * + * { margin-top: 30px; }
.premio__graf { position: relative; }
.premio__graf span {
    display: block;
    position: relative;
    width: 60%;
    padding-top: 60%;
    border-radius: 50%;
    --amarillo: 254, 223, 43;
    background: rgb(var(--amarillo), 1);
    margin: 0 auto;
}
.premio__graf figure {
    position: absolute;
    width: 100%;
    z-index: 1;
    bottom: -3.5%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    filter: drop-shadow(0px 0 5px rgb(var(--negro), .4));
    will-change: filter;
}
.premio__graf figure svg {
    width: 100%;
    height: 100%;
    display: flex;
}
.premio__text > * {
    position: relative;
    display: grid;
    grid-template-columns: 1fr;
}
.premio__text > * span {
    grid-area: 1 / 1 / 2 / 2;
    display: block;
}
.premio__text > * span:nth-child(1) {
    --negro: 2, 33, 57;
    -webkit-text-stroke-width: 4.5px;
    -webkit-text-stroke-color: rgb(var(--negro), 1);
    color: rgb(var(--negro), 1);
}
.premio__text p { font-size: 18px; }
.dis__prem {
    margin-right: auto;
    margin-left: auto;
    max-width: 500px;
    color: rgb(var(--negro), 1);
    text-align: center;
    font-weight: normal;
    margin-top: 40px;
}
.tex__prem {
    margin-top: 40px;
    margin-right: auto;
    margin-left: auto;
    max-width: 600px;
    text-transform: uppercase;
    font-weight: bold;
    text-align: center;
    font-size: 28px;
    color: rgb(var(--amarillo), 1);
    display: grid;
    grid-template-columns: 1fr;
}
.tex__prem span {
    position: relative;
    line-height: 1.2;
    grid-area: 1 / 1 / 2 / 2;
    display: block;
}
.tex__prem span:nth-child(1) {
    --negro: 2, 33, 57;
    -webkit-text-stroke-width: 6px;
    -webkit-text-stroke-color: rgb(var(--negro), 1);
    color: rgb(var(--negro), 1);
}
.premios .bi__01 {
    width: 10%;
    min-width: 80px;
    top: -180px;
    left: 9%;
    -webkit-transform: rotateZ(-123deg) rotateX(180deg);
    -moz-transform: rotateZ(-123deg) rotateX(180deg);
    -ms-transform: rotateZ(-123deg) rotateX(180deg);
    -o-transform: rotateZ(-123deg) rotateX(180deg);
    transform: rotateZ(-123deg) rotateX(180deg);
}
.premios .bi__02 {
    width: 3%;
    min-width: 60px;
    left: 50%;
    top: 0;
    -webkit-transform: translateX(-50%) rotate(-45deg);
    -moz-transform: translateX(-50%) rotate(-45deg);
    -ms-transform: translateX(-50%) rotate(-45deg);
    -o-transform: translateX(-50%) rotate(-45deg);
    transform: translateX(-50%) rotate(-45deg);
}
.premios .cu__01 {
    width: 8%;
    min-width: 60px;
    top: -100px;
    right: 10%;
    -webkit-transform: rotate(15deg);
    -moz-transform: rotate(15deg);
    -ms-transform: rotate(15deg);
    -o-transform: rotate(15deg);
    transform: rotate(15deg);
}
.premios .cu__02 {
    width: 8%;
    min-width: 60px;
    top: 50%;
    left: -30px;
    -webkit-transform: rotate(-25deg);
    -moz-transform: rotate(-25deg);
    -ms-transform: rotate(-25deg);
    -o-transform: rotate(-25deg);
    transform: rotate(-25deg);
}
.premios .cu__03 {
    width: 6%;
    min-width: 60px;
    bottom: 5%;
    right: 0;
    overflow: hidden;
    padding-bottom: 42px;
}
.premios .cu__03 > div {
    width: 120%;
    -webkit-transform: rotate(20deg);
    -moz-transform: rotate(20deg);
    -ms-transform: rotate(20deg);
    -o-transform: rotate(20deg);
    transform: rotate(20deg);
    transform-origin: 0 100%;
}


/******************************
*   Formularios
******************************/
.cont__form {
    margin-left: auto;
    margin-right: auto;
}
.form__large { width: 100%; }
.form__medium { max-width: 600px; }
.form__small { max-width: 400px; }
.cont__campos .campo.c__cta { padding: 0; }
.campo  { padding: 12px 0; }
.campo label {
    text-transform: uppercase;
    padding-left: 12px;
}
.cont__input { position: relative; }
.cont__input input,
.cont__input select { padding-left: 40px; }
.cont__input select { padding-right: 30px; }
.campo__cumple {
    display: flex;
    gap: 20px;
}
.campo__cumple select {
    padding-left: 35px;
    padding-right: 25px;
}
.campo__cumple > div { width: calc(33.33% - 10px); }
.icon__camp,
.icon__arr {
    position: absolute;
    top: 0;
    width: 40px;
    height: 47px;
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none;
    color: rgb(var(--negro), 1);
}
.icon__camp { left: 0; }
.icon__arr { right: 0; }
.camp__check {
    display: flex;
    -webkit-flex-flow: row wrap;
    -ms-flex-wrap: row wrap;
    flex-flow: row wrap;
    gap: 25px;
}
.camp__check > div { position: relative; }
.camp__check > div label {
    margin: 0;
    cursor: pointer;
    padding-left: 28px;
    text-transform: inherit;
    font-weight: normal;
}
.camp__check > div label a { text-decoration: underline; }
.camp__check > div label input,
.camp__check > div label i {
    position: absolute;
    width: 20px;
    height: 20px;
    background: rgb(var(--blanco), 1);
    left: 0;
    top: 0;
    margin: 0;
    padding: 0;
    border-radius: 6px;
}
.camp__check > div label i::before {
    content: '\f00c';
    font-weight: 900;
    font-family: "Font Awesome 6 Pro";
    width: 100%;
    font-size: 90%;
    display: flex;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
    -webkit-transition: all 300ms cubic-bezier(0.68, -0.1, 0.265, 1.55);
    -moz-transition: all 300ms cubic-bezier(0.68, -0.1, 0.265, 1.55);
    -ms-transition: all 300ms cubic-bezier(0.68, -0.1, 0.265, 1.55);
    -o-transition: all 300ms cubic-bezier(0.68, -0.1, 0.265, 1.55);
    transition: all 300ms cubic-bezier(0.68, -0.1, 0.265, 1.55);
}
.camp__check > div label input { background: transparent; }
.camp__check > div label input:checked + i { background: rgb(var(--negro), 1); }
.camp__check > div label input:checked + i::before {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}
.camp__error {
    display: none;
    padding-top: 4px;
    color: rgb(var(--rojo), 1);
    font-size: 16px;
    font-weight: normal;
    padding-left: 12px;
}
.camp__error * + * { margin-left: 6px; }
.forgot { text-align: center; }
.forgot a {
    --color: 0, 25, 52;
    color: rgb(var(--color), 1);
    font-weight: 500;
}
.no__account {
    margin-top: 40px;
    text-align: center;
    color: rgb(var(--negro), 1);
    font-weight: 500;
}
.no__account a { text-decoration: underline; }

/******************************
*   Perfil
******************************/
#perfil .head__sect h3 {
    display: flex;
    justify-content: center;
    gap: 16px;
}
#perfil .head__sect h3 i { position: relative; }
#perfil .head__sect h3 i::after {
    content: "\f007";
    -webkit-text-stroke-width: 6px;
    -webkit-text-stroke-color: rgb(var(--negro), 1);
    color: rgb(var(--negro), 1);
    position: absolute;
    color: red;
    top: 0;
    left: 0;
    z-index: -1;
}
.fil__perf + *,
* + .fil__perf { margin-top: 30px; }
.fil__perf {
    border-radius: 10px;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: space-between;
    -webkit-justify-content: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    flex-direction: column;
    padding: 20px;
    gap: 30px;
}
.perf__col {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    gap: 12px;
}
.perf__info > * { display: block; }
.user__name {
    font-weight: 500;
    font-size: 18px;
}
.perf__info .delete__acco { color: rgb(var(--rojo), 1); }

/******************************
*   Registrar
******************************/
.cont__opt {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    max-width: 560px;
    margin-left: auto;
    margin-right: auto;
    gap: 20px;
}
.opt__regis {
    background: rgb(var(--blanco), 1);
    border-radius: 10px;
    overflow: hidden;
}
.opt__regis a { display: block; }
.opt__regis a div {
    padding: 20px;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
.opt__regis a div figure {
    width: 80%;
    margin: 0 auto;
    -webkit-transition: all 300ms cubic-bezier(0.68, -0.1, 0.265, 1.55);
    -moz-transition: all 300ms cubic-bezier(0.68, -0.1, 0.265, 1.55);
    -ms-transition: all 300ms cubic-bezier(0.68, -0.1, 0.265, 1.55);
    -o-transition: all 300ms cubic-bezier(0.68, -0.1, 0.265, 1.55);
    transition: all 300ms cubic-bezier(0.68, -0.1, 0.265, 1.55);
    filter: drop-shadow(0px 0 10px rgb(var(--negro), 0));
    will-change: filter;
}
.opt__regis a div:nth-child(2) {
    color: rgb(var(--negro), 1);
    background: rgb(var(--amarillo), 1);
    text-align: center;
    font-weight: bold;
    text-transform: uppercase;
    line-height: 1.2;
}
.regis__cont {
    max-width: 650px;
    overflow: visible;
}
.graf__regis figure {
    filter: drop-shadow(0px 0px 10px rgb(var(--negro), .2));
    will-change: filter;
}
.info__regis h4 {
    font-size: 24px;
    text-transform: uppercase;
}
.info__regis .campo { padding: 0; }
.info__regis input {
    background: rgb(var(--negro), .1);
    border-radius: 12px;
}
.info__regis .c__cta { margin-top: 20px; }

/******************************
*   Trivia
******************************/
.fil__trivia { text-align: center; }
.fil__trivia.fil__fil > .fil__02:nth-child(1) {
    padding: 30px;
    text-transform: uppercase;
}
.fil__trivia.fil__fil > .fil__02:nth-child(2) { background: rgb(var(--amarillo), 1); }
.fil__trivia.fil__fil > .fil__02 h4 { font-size: 22px; }
.pregunta {
    font-size: 22px;
    font-weight: normal;
}
.opt__ques {
    max-width: 350px;
    margin-left: auto;
    margin-right: auto;
}
.fil__ques + .fil__ques { margin-top: 15px; }
.fil__ques label {
    display: block;
    font-weight: 500;
    margin: 0;
    cursor: pointer;
}
.fil__ques label input { display: none; }
.ques__cont {
    width: 100%;
    display: flex;
    overflow: hidden;
    border-radius: 10px;
    background: rgb(var(--blanco), 1);
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
.fil__ques label:hover .ques__cont {
    --color: 220, 220, 220;
    background: rgb(var(--color), 1);
}
.ques__cont span {
    display: flex;
    align-items: center;
    padding: 20px;
}
.ques__cont span:nth-child(1) {
    width: 70px;
    font-weight: bold;
    font-size: 20px;
}
.ques__cont span:nth-child(2) { width: calc(100% - 70px); }
.fil__ques label input:checked + .ques__cont {
    --azul: 76, 164, 166;
    background: rgb(var(--azul), 1);
    color: rgb(var(--blanco), 1);
}

/******************************
*   Cobrar
******************************/
#cobrar .head__sect h3 { font-size: 52px; }
#cobrar .disclaimer {
    text-align: center;
    font-size: initial;
    color: rgb(var(--negro), 1);
    margin-left: auto;
    margin-right: auto;
    max-width: 400px;
}
#cobrar * + .disclaimer { margin-top: 60px; }
#cobrar .cta i { font-size: 24px; }

/******************************
*   Ganadores
******************************/
.reti__ganadores {
    margin-right: auto;
    margin-left: auto;
    margin-top: 60px;
    margin-bottom: 60px;
    max-width: 600px;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    -ms-flex-wrap: row wrap;
    flex-flow: row wrap;
    gap: 20px;
}
.reti__ganadores > div {
    width: calc(33.33% - 13.5px);
}
.reti__ganadores > div figure {
    overflow: hidden;
    border-radius: 50%;
    position: relative;
    padding-top: 100%;
}
.reti__ganadores > div figure img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.txt__info {
    text-align: center;
    font-weight: normal;
    text-decoration: underline;
    color: rgb(var(--negro), 1);
}

/******************************
*   Legal
******************************/
.info__legal {
    font-size: 16px;
    line-height: 1.4;
    color: rgb(var(--negro), .8);
}
.info__legal h4,
.info__legal h5 {
    color: rgb(var(--negro), .8);
    font-weight: 700;
    text-decoration: underline;
    font-style: normal;
}
.info__legal li::marker { color: rgb(var(--negro), .8); }

/******************************
*   Faqs
******************************/
.opt__info { display: none; }
.acor__opt + .acor__opt { margin-top: 10px; }
.opt__title {
    padding: 15px;
    background: rgb(var(--amarillo), 2);
    color: rgb(var(--negro), 1);
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.opt__title h4 { font-family: 'Roboto', sans-serif; }
.arrw {
    width: 20px;
    height: 20px;
    position: relative;
}
.arrw::before,
.arrw::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 2px;
    background: currentcolor;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-transition: all 300ms cubic-bezier(0.68, -0.1, 0.265, 1.55);
    -moz-transition: all 300ms cubic-bezier(0.68, -0.1, 0.265, 1.55);
    -ms-transition: all 300ms cubic-bezier(0.68, -0.1, 0.265, 1.55);
    -o-transition: all 300ms cubic-bezier(0.68, -0.1, 0.265, 1.55);
    transition: all 300ms cubic-bezier(0.68, -0.1, 0.265, 1.55);
}
.arrw::after {
    -webkit-transform: translate(-50%, -50%) rotate(90deg);
    -moz-transform: translate(-50%, -50%) rotate(90deg);
    -ms-transform: translate(-50%, -50%) rotate(90deg);
    -o-transform: translate(-50%, -50%) rotate(90deg);
    transform: translate(-50%, -50%) rotate(90deg);
}
.active .arrw::after {
    -webkit-transform: translate(-50%, -50%) rotate(0deg);
    -moz-transform: translate(-50%, -50%) rotate(0deg);
    -ms-transform: translate(-50%, -50%) rotate(0deg);
    -o-transform: translate(-50%, -50%) rotate(0deg);
    transform: translate(-50%, -50%) rotate(0deg);
}
.opt__info {
    padding: 15px;
    background: rgb(var(--blanco), .8);
    color: rgb(var(--negro), 1);
    line-height: 1.4;
}


/******************************
*   Mobile
******************************/
/* Extra Small Devices, Phones */
@media (max-width : 479px) {
}
@media (min-width : 480px) {
}
/* Small Devices, Tablets */
@media (min-width : 480px) and (max-width : 767px) {
}
@media (max-width : 679px) {
#perfil main section,
#trivia main section,
#registrar-lote main section,
#registrar-codigo main section,
#faqs main section { padding-bottom: 130px; }

.c__back .cta__02 {
    -webkit-transform: translateY(-20px);
    -moz-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    -o-transform: translateY(-20px);
    transform: translateY(-20px);
}

/* ------ Premios ------ */
.bg__premios { height: 100%; }

/*----- Fil Box -----*/
.fil__info { font-size: 12px; }
.fil__info > div:nth-child(1) {
    font-size: 18px;
    grid-area: 1 / 1 / 4 / 2;
}
.fil__info > div:nth-child(2) { grid-area: 1 / 2 / 2 / 4; }
.fil__info > div:nth-child(3) { grid-area: 2 / 2 / 3 / 3; }
.fil__info > div:nth-child(4) { grid-area: 2 / 3 / 3 / 4; }

/*----- Registrar -----*/
.fil__fil.regis__cont > .fil__02 {
    padding-top: 130px;
    margin-top: 130px;
}
.graf__regis {
    position: absolute;
    width: 160px;
    left: 50%;
    top: -90px;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
}

}
@media (min-width : 680px) {
/* Head Section */
.head__sect h3 { font-size: 42px; }
.c__back .cta__02 {
    position: absolute;
    left: 0;
    bottom: 100%;
}
.c__stars .star { width: 50px; }

/* ------ Graf ------ */
.c__graf .ti__01 {
    left: 5%;
    bottom: 20%;
}
.c__graf .cu__01 {
    bottom: 20%;
    left: 6%;
}
.c__graf .cu__02 {
    top: 20%;
    right: 6%;
}
.c__graf .bi__01 {
    left: 8%;
    top: 5%;
}
.c__graf .bi__02 {
    right: 8%;
    bottom: 12%;
}

/*----- Inicio -----*/
.ini__03 .cont__compo { width: 70%; }
.inicio .cu__01 {
    left: 10%;
    top: 5%;
}
.inicio .cu__02 {
    right: 10%;
    top: 8%;
}
.inicio .bi__01 {
    left: 5%;
    bottom: 35%;
}
.inicio .bi__02 {
    right: 8%;
    bottom: 30%;
}

/*----- Fil Box -----*/
.fil__01 {
    text-align: initial;
    flex-direction: row;
}
.fil__01 .col__top { width: 50%; }
.fil__01 .col__02 { text-align: right; }
.fil__info {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    overflow: hidden;
    margin-right: auto;
    margin-left: auto;
    max-width: 550px;
}
.fil__info > div { padding: 12px; }

/*----- Formularios -----*/
.form__large .cont__campos {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: baseline;
    -webkit-align-items: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    -webkit-flex-flow: row wrap;
    -ms-flex-wrap: row wrap;
    flex-flow: row wrap;
}
.form__large .cont__campos .campo { width: 50%; }
.campo { padding: 12px; }
.form__large .campo.c__cta,
.campo__check { width: 100% !important; }
/* .camp__check { text-align: center; } */

/*----- Perfil -----*/
.fil__perf {
    border-radius: 1000px;
    flex-direction: row;
}

/*----- Registrar -----*/
.opt__regis:hover a div figure  {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
    filter: drop-shadow(0px 0 10px rgb(var(--negro), .2));
}
.opt__regis a div:nth-child(2) br { display: none; }
.fil__regis {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 30px;
}
.fil__regis .graf__regis { width: calc(35% - 15px); }
.fil__regis .info__regis { width: calc(65% - 15px); }
.info__regis .c__cta {
    -webkit-box-pack: start;
    -webkit-justify-content: start;
    -ms-flex-pack: start;
    justify-content: start;
}


}
@media (min-width : 680px) and (max-width : 767px) {
}
/* Small Devices, Nav */
@media (max-width : 767px) {
.tab { border: 1px solid rgb(var(--blanco), .3); }
.tab > div { padding: 10px; }
.tab > div table {
    margin-right: 10px;
    display: inline-table;
}

.inicio .tira__01 { display: none; }

/*----- Teaser / Fin -----*/
.an__01 figure {
    margin: 0 auto;
    max-width: 450px;
    width: 80%;
}
.an__02 .cont__compo {
    margin: 0 auto;
    width: 80%;
}

/*----- Mecanica -----*/
.fil__pasos > div { max-width: 400px; }

/*----- Premios -----*/
.fil__premios > div { max-width: 400px; }
.fil__premios > div + div.premio03 { margin-top: 80px; }

}
/* Medium Devices to Large Devices */
@media (min-width : 768px) {
/*----- Teaser / Fin -----*/
.cont__anuncio {
    margin-right: auto;
    margin-left: auto;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    -ms-flex-wrap: row wrap;
    flex-flow: row wrap;
    gap: 40px;
    width: 90%;
}
.cont__anuncio > div {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    flex-direction: column;
}
.cont__anuncio > div + div { margin-top: 0px; }
.an__01 { width: calc(50% - 20px); }
.an__02 { width: calc(50% - 20px); }
.an__03 { width: 100%; }
.txt__anun > h2 { font-size: 36px; }
.txt__anun > p {
    width: 80%;
    font-size: 24px;
}

/*----- Inicio -----*/
.bg__inicio { height: 70%; }
.destello__ini { bottom: 0%; }
.destello__ini img { display: block; }
.cont__ini {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    -ms-flex-wrap: row wrap;
    flex-flow: row wrap;
    gap: 20px 30px;
}
.cont__ini > * + * { margin-top: 0px; }
.ini__01 { width: calc(50% - 15px); }
.ini__02 { width: calc(50% - 15px); }
.ini__03 { width: 100%; }
.ini__04 {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}
.ini__01 {
    -webkit-box-align: end;
    -webkit-align-items: end;
    -ms-flex-align: end;
    align-items: end;
}
.ini__02 {
    -webkit-box-align: start;
    -webkit-align-items: start;
    -ms-flex-align: start;
    align-items: start;
}
.ini__03 {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}
.ini__01 figure,
.ini__02 figure {
    margin: initial;
    max-width: inherit;
}
.ini__01 figure { width: 70%; }
.ini__02 figure { width: 80%; }

/*----- Mecanica -----*/
.fil__pasos {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    -ms-flex-wrap: row wrap;
    flex-flow: row wrap;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 30px;
}
.paso {
    width: calc(33.33% - 20px);
    position: relative;
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
}
.fil__pasos > div + div { margin-top: 0px; }

/*----- Premios -----*/
#home .destello { display: none; }
#home .footer { z-index: 10; }
.bg__premios {
    top: -40%;
    bottom: -500px;
}
.bg__premios figure { transform-origin: 50% 50%; }
.fil__premios {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    -ms-flex-wrap: row wrap;
    flex-flow: row wrap;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 30px;
}
.premio {
    width: calc(33.33% - 20px);
    position: relative;
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
}
.fil__premios > div + div { margin-top: 0px; }
.premios .bi__01 { top: -100px; }
.premios .cu__03 { bottom: 15%; }

}
/* Medium Devices, Desktops */
@media (min-width : 768px) and (max-width : 991px) {
}
@media (max-width : 991px) {
}
@media (min-width : 992px) {
/*----- Teaser / Fin -----*/
.cont__anuncio { width: 70%; }

/*----- Inicio -----*/
.ini__03 .cont__compo {
    max-width: 60vh;
    width: 50%;
}

/*----- Formularios -----*/
.form__large .cont__campos .campo { width: 33.33%; }

}
/* Large Devices, Wide Screens */
@media (min-width : 992px) and (max-width : 1200px) {
}
@media (max-width : 1199px) {
}
@media (min-width : 1200px) {
/*----- Inicio -----*/
.bg__premios { top: -80%; }

}
@media (min-width : 1300px) {
/*----- Inicio -----*/
.cont__ini { width: 70%; }
.destello__ini { padding-top: 65%; }


}



header ul,
footer ul,
header ol,
footer ol {
    padding-inline-start: 0;
    list-style: none;
}
header li + li,
footer li + li { margin-top: 0; }

header a,
footer a,
header a:hover,
footer a:hover { text-decoration: none; }

/******************************
*   Header
******************************/
.header {
    z-index: 300;
    position: -webkit-sticky;
    position: -moz-sticky;
    position: -o-sticky;
    position: -ms-sticky;
    position: sticky;
    top: 0px;
}
.cont__men {
    padding: 10px 5px 10px 10px;
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: space-between;
    -webkit-justify-content: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    gap: 30px;
}
.cont__men::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    background: rgb(var(--azul), .5);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}
.active .cont__men::before {
    opacity: 1;
    -webkit-box-shadow: 0 3px 10px 0 rgb(var(--negro), .05);
    box-shadow: 0 3px 10px 0 rgb(var(--negro), .05);
}
.logo {
    width: 160px;
    z-index: 1;
}
.logo a {
    display: block;
    width: 100%;
    overflow: hidden;
}
.logo span {
    position: absolute;
    visibility: hidden;
}
.cont__nav {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: flex-end;
}
.opt__men ul li { position: relative; }
.opt__men ul li .cta__06 { padding: 6px; }
.c__ses { color: rgb(var(--amarillo), 1); }
.btn__mob {
    width: 60px;
    position: relative;
    z-index: 1;
    cursor: pointer;
}
.btn__mob > div {
    width: 60px;
    height: 60px;
    -webkit-transition: all 300ms cubic-bezier(0.68, -0.1, 0.265, 1.55);
    -moz-transition: all 300ms cubic-bezier(0.68, -0.1, 0.265, 1.55);
    -ms-transition: all 300ms cubic-bezier(0.68, -0.1, 0.265, 1.55);
    -o-transition: all 300ms cubic-bezier(0.68, -0.1, 0.265, 1.55);
    transition: all 300ms cubic-bezier(0.68, -0.1, 0.265, 1.55);
}
.btn__mob > div > div { position: absolute; }
.bars {
    width: 60%;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
.btn__mob .bars span {
    display: block;
    width: 100%;
    height: 2px;
    border-radius: 10px;
    background: #ffffff;
    transition: all 300ms cubic-bezier(0.68, -0.1, 0.265, 1.55);
}
.btn__mob .bars span + span {  margin-top: 6px; }
.btn__mob.active .bars span { background: rgb(var(--negro), 1); }
.btn__mob.active .bars span:nth-child(1) {
    -webkit-transform: translate(0px, 8px) rotate(45deg);
    -moz-transform: translate(0px, 8px) rotate(45deg);
    -ms-transform: translate(0px, 8px) rotate(45deg);
    -o-transform: translate(0px, 8px) rotate(45deg);
    transform: translate(0px, 8px) rotate(45deg);
}
.btn__mob.active .bars span:nth-child(2) {
    -webkit-transform: scaleX(0);
    -moz-transform: scaleX(0);
    -ms-transform: scaleX(0);
    -o-transform: scaleX(0);
    transform: scaleX(0);
}
.btn__mob.active .bars span:nth-child(3) {
    -webkit-transform: translate(0px, -8px) rotate(-45deg);
    -moz-transform: translate(0px, -8px) rotate(-45deg);
    -ms-transform: translate(0px, -8px) rotate(-45deg);
    -o-transform: translate(0px, -8px) rotate(-45deg);
    transform: translate(0px, -8px) rotate(-45deg);
}

/******************************
*   Mobile: Header
******************************/
/* Extra Small Devices, Phones */
@media (max-width : 479px) {
}
@media (min-width : 480px) {
}
/* Small Devices, Tablets */
@media (min-width : 480px) and (max-width : 767px) {
}
/* Small Devices, Nav */
@media (max-width : 767px) {
}
/* Medium Devices to Large Devices */
@media (min-width : 768px){
}
/* Medium Devices, Desktops */
@media (min-width : 768px) and (max-width : 991px) {
}
@media (max-width : 1190px) {
.cont__men::before { opacity: 1; }
.menu {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    overflow: auto;
    display: none;
    background: rgb(var(--azul), .8);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}
.menu__center {
    width: 100%;
    padding: 60px 0;
    min-height: 100vh;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}
.center { width: 100%; }
div + .opt__men { margin-top: 40px; }
.opt__men ul {
    width: 500px;
    max-width: 90%;
    margin: 0 auto;
}
.opt__men ul li + li { margin-top: 28px; }
.c__ses::before {
    content: '';
    position: absolute;
    width: 50px;
    height: 2px;
    top: -14px;
    left: 50%;
    margin-left: -25px;
    background: rgb(var(--blanco), 1);
    border-radius: 10px;
}


}
/* Medium Devices to Large Devices */
@media (min-width : 1191px){
.cont__men { padding: 10px 20px; }
.btn__mob { display: none; }
.logo { width: 180px; }
.opt__men ul {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 20px;
}
.c__ses {
    padding-left: 20px;
    position: relative;
}
.c__ses::before {
    content: '';
    position: absolute;
    width: 2px;
    top: -4px;
    bottom: -4px;
    left: -1px;
    background: rgb(var(--blanco), 1);
    border-radius: 10px;
}
}
/* Large Devices, Wide Screens */
@media (min-width : 992px) and (max-width : 1200px) {
}
@media (min-width : 1300px) {
}



/******************************
*   Footer
******************************/
.footer {
    text-align: center;
    position: relative;
    z-index: 2;
}
.destello {
    position: absolute;
    width: 100%;
    padding-top: 100%;
    bottom: 70%;
    left: 0;
    overflow: hidden;
    opacity: .3;
}
.destello figure {
    position: absolute;
    top: 0;
    left: -30%;
    right: -30%;
}
.bg__footer {
    position: absolute;
    width: 100%;
    height: 90%;
    left: 0;
    right: 0;
    bottom: 0;
    -webkit-mask-image: url('../img/square-curv.svg');
    mask-image: url('../img/square-curv.svg');
    mask-repeat: no-repeat;
    mask-size: 100%;
    background: rgb(var(--amarillo), 1);
}
.bg__footer::before,
.bg__footer::after {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
.bg__footer::before,
.bg__footer::after { content: ''; }
.bg__footer::before {
    background-image: url('../img/trama.webp');
    background-position: center;
    background-size: 1500px;
    mix-blend-mode: color-dodge;
}
.bg__footer::after {
    background: url('../img/curv.svg') top no-repeat;
    background-size: 100%;
    top: -1px;
}
.bifo__01 {
    width: 9%;
    left: 5%;
}
.bifo__02 {
    width: 12%;
    right: 5%;
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}
.bifo__03 {
    width: 8%;
    padding-top: 8%;
    bottom: 0;
    left: 0;
}
.bifo__03 > div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.bifo__03 figure {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    transform-origin: 51% 32%;
}
.bifo__04 {
    width: 8%;
    padding-top: 8%;
    bottom: 0;
    right: 0;
}
.bifo__04 > div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    padding-right: 31%;
}
.bifo__04 figure {
    position: absolute;
    -webkit-transform: rotateX(180deg);
    -moz-transform: rotateX(180deg);
    -ms-transform: rotateX(180deg);
    -o-transform: rotateX(180deg);
    transform: rotateX(180deg);
    transform-origin: 0% 55%;
}
.foot__comp .cont__compo {
    margin: 0 auto;
    max-width: 80%;
}
.foot__comp + * { margin-top: 60px; }
.info__footer {
    position: relative;
    z-index: 1;
    padding: 0 0 60px;
}
.fil__foo + .fil__foo { margin-top: 50px; }
.legal {
    font-size: 12px;
    color: rgb(var(--negro), 1);
}

/******************************
*   Mobile:  Footer
******************************/
/* Extra Small Devices, Phones */
@media (max-width : 479px) {
}
@media (min-width : 480px) {
}
@media (min-width : 650px)  {
}
/* Small Devices, Tablets */
@media (min-width : 480px) and (max-width : 767px) {


}
/* Small Devices, Nav */
@media (max-width : 767px) {
.links ul li + li { margin-top: 20px; }

.bifo__01,
.bifo__02 { top: 10%; }

}
/* Medium Devices to Large Devices */
@media (min-width : 768px){
.destello { bottom: 50%; }
.links ul {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -webkit-flex-flow: row wrap;
    -ms-flex-wrap: row wrap;
    flex-flow: row wrap;

    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 20px;
}
}
/* Medium Devices, Desktops */
@media (min-width : 650px) and (max-width : 991px) {
}
@media (max-width : 991px) {
}
/* Medium Devices to Large Devices */
@media (min-width : 992px) {
.destello {
    padding-top: 65%;
    bottom: 40%;
}
.destello figure {
    left: -10%;
    right: -10%;
}
.bg__footer {
    height: 110%;
    top: -10%;
}
.foot__comp .cont__compo { max-width: 35%; }
}
/* Large Devices, Wide Screens */
@media (min-width : 992px) and (max-width : 1200px) {
}
@media (min-width : 1201px) {
}
@media (min-width : 2001px) {
}


@-webkit-keyframes rotating /* Safari and Chrome */ {
    from {
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@keyframes rotating {
    from {
        -ms-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to {
        -ms-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
.rotating {
    -webkit-animation: rotating 2s linear infinite;
    -moz-animation: rotating 2s linear infinite;
    -ms-animation: rotating 2s linear infinite;
    -o-animation: rotating 2s linear infinite;
    animation: rotating 2s linear infinite;
}
