.wp-block-post-title {
display: none;
} .arde-page {
--primary: #fa0b57;
--primary-light: #ff677e;
--bg-dark: #0a090c;
--bg-cream: #f7f0df;
--white: #fffaf8;
--cold-1: #017ffd;
--cold-2: #6596ff;
--gray-20: hsl(0, 0%, 20%);
--gray-70: hsl(0, 0%, 70%);
--gray-80: hsl(0, 0%, 80%);
--gray-90: hsl(0, 0%, 90%);
--shadow-01: 0 19px 38px rgba(0, 0, 0, 0.07), 0 15px 12px rgba(0, 0, 0, 0.05);
--shadow-02: 0 2px 2px rgba(0, 0, 0, 0.05), 0 1px 2px rgba(0, 0, 0, 0.05);
--radius: 12px;
font-family: "Raleway", sans-serif;
color: var(--bg-dark);
-webkit-font-smoothing: antialiased;
}
.arde-page *,
.arde-page *:before,
.arde-page *:after {
box-sizing: border-box;
} .arde-page .arde-header {
background-color: var(--bg-dark);
padding: 60px 24px 20px;
display: flex;
justify-content: center;
}
.arde-page .arde-header img {
height: 60px;
width: auto;
filter: invert(1) !important;
} .arde-page .arde-footer {
background-color: var(--bg-dark);
color: var(--white);
text-align: center;
padding: 40px 16px 80px;
font-family: "Raleway", sans-serif;
font-size: 0.9rem;
}
.arde-page .arde-footer p {
margin: 0;
line-height: 1.6;
}
.arde-page .arde-footer a {
color: var(--white);
text-decoration: underline;
}
.arde-page .arde-footer a:hover {
text-decoration: none;
}.arde-acaba-con-las-pieles-landing {
max-width: none !important;
width: 100% !important;
font-size: 15px;
line-height: 1.6;
overflow-x: hidden;
} .arde-acaba-con-las-pieles-landing .hero {
width: 100%;
position: relative;
background-color: var(--bg-dark);
display: grid;
grid-template-columns: 1fr;
grid-template-rows: 1fr;
justify-content: center;
align-items: center;
min-height: 100vh;
}
@media (min-width: 1000px) {
.arde-acaba-con-las-pieles-landing .hero {
padding: 20px 32px 80px;
}
}
.arde-acaba-con-las-pieles-landing .hero__content {
z-index: 1;
max-width: 1400px;
margin: 0 auto;
display: grid;
grid-template-columns: 1fr;
grid-template-rows: auto auto;
height: max-content;
padding: 64px 16px;
align-items: center;
}
@media (min-width: 800px) {
.arde-acaba-con-las-pieles-landing .hero__content {
padding: 64px 32px;
}
}
@media (min-width: 1000px) {
.arde-acaba-con-las-pieles-landing .hero__content {
padding: 60px 0 0 0;
grid-template-columns: 1fr 1fr;
grid-template-rows: auto;
grid-column-gap: 40px;
}
} .arde-acaba-con-las-pieles-landing .hero__text {
position: relative;
z-index: 1;
color: var(--white);
}
@media (min-width: 1000px) {
.arde-acaba-con-las-pieles-landing .hero__text {
grid-column: 1 / span 1;
grid-row: 1 / span 1;
}
}
.arde-acaba-con-las-pieles-landing .text-highlight {
background: linear-gradient(to bottom, transparent 5%, #00000073 5%, #00000073 95%, transparent 95%);
display: inline;
box-decoration-break: clone;
-webkit-box-decoration-break: clone;
border-radius: 2px;
padding: 0 10px;
}
.arde-acaba-con-las-pieles-landing .hero__text p .text-highlight {
background: #00000073;
padding: 4px 6px;
}
.arde-acaba-con-las-pieles-landing .hero__text h1 {
font-family: "Anton", sans-serif;
font-weight: 400;
text-transform: uppercase;
color: var(--white);
margin: 0;
font-size: 40px;
line-height: 1.2;
letter-spacing: 0.02em;
}
@media (min-width: 768px) {
.arde-acaba-con-las-pieles-landing .hero__text h1 {
font-size: 50px;
}
}
.arde-acaba-con-las-pieles-landing .hero__text p {
font-size: 1.05rem;
color: var(--white);
line-height: 1.7;
margin: 1rem 0;
} .arde-acaba-con-las-pieles-landing .hero__widget {
width: 100%;
position: relative;
}
@media (min-width: 1000px) {
.arde-acaba-con-las-pieles-landing .hero__widget {
grid-column: 2 / span 1;
grid-row: 1 / span 1;
}
}
.arde-acaba-con-las-pieles-landing .hero__widget-inner {
position: relative;
z-index: 1;
width: 100%;
background-color: var(--bg-cream);
border-radius: var(--radius);
padding: 20px;
box-shadow: var(--shadow-01);
margin-top: 32px;
}
@media (min-width: 1000px) {
.arde-acaba-con-las-pieles-landing .hero__widget-inner {
padding: 28px;
margin-top: 0;
}
} .arde-acaba-con-las-pieles-landing .progress {
padding-bottom: 16px;
border-bottom: 1px dashed var(--gray-80);
margin-bottom: 20px;
}
.arde-acaba-con-las-pieles-landing .progress p {
margin: 0;
color: var(--bg-dark);
line-height: 1.6;
}
.arde-acaba-con-las-pieles-landing .progress__count {
font-size: 1.5em;
font-weight: 700;
color: var(--primary);
}
.arde-acaba-con-las-pieles-landing .progress__bar {
width: 100%;
height: 16px;
border-radius: 16px;
background-color: var(--gray-90);
margin: 14px 0;
overflow: hidden;
box-shadow: var(--shadow-02);
}
.arde-acaba-con-las-pieles-landing .progress__bar-fill {
height: 16px;
background: linear-gradient(90deg, var(--primary-light) 0%, var(--primary) 100%);
border-radius: 16px;
transition: width 1s ease-out;
} .arde-acaba-con-las-pieles-landing .form-container {
width: 100%;
}
.arde-acaba-con-las-pieles-landing .sib-form {
padding: 0 !important;
}
.arde-acaba-con-las-pieles-landing .sib-form input[type="text"],
.arde-acaba-con-las-pieles-landing .sib-form input[type="email"],
.arde-acaba-con-las-pieles-landing .sib-form input[type="tel"] {
display: block;
width: 100%;
padding: 14px 12px;
border: 1px solid rgb(179, 179, 179);
border-radius: 8px;
background-color: #ffffff;
color: rgb(51, 51, 51);
font-family: "Raleway", sans-serif;
font-size: 0.9rem;
box-sizing: border-box;
box-shadow: 0 2px 2px rgba(0, 0, 0, 0.05), 0 1px 2px rgba(0, 0, 0, 0.05);
margin-bottom: 16px;
outline: none;
transition: border-color 0.2s;
}
.arde-acaba-con-las-pieles-landing .sib-form input[type="text"]:focus,
.arde-acaba-con-las-pieles-landing .sib-form input[type="email"]:focus,
.arde-acaba-con-las-pieles-landing .sib-form input[type="tel"]:focus {
border-color: var(--primary);
}
.arde-acaba-con-las-pieles-landing .sib-form input::placeholder {
color: #bbbbbb;
opacity: 0.6;
}
.arde-acaba-con-las-pieles-landing .sib-form input[type="submit"] {
display: block;
width: 100%;
font-family: "Anton", sans-serif;
font-size: 22px;
text-transform: uppercase;
letter-spacing: 1.5px;
padding: 14px 0;
margin-top: 18px;
background-color: #FA0B57;
color: #FFFAF8;
border: none;
border-radius: 8px;
cursor: pointer;
box-shadow: 0 2px 2px rgba(0, 0, 0, 0.05), 0 1px 2px rgba(0, 0, 0, 0.05);
transition: transform 0.15s, box-shadow 0.15s;
}
.arde-acaba-con-las-pieles-landing .sib-form input[type="submit"]:hover {
transform: scale(1.02);
box-shadow: 0 4px 12px rgba(250, 11, 87, 0.3);
}
.arde-acaba-con-las-pieles-landing .form-privacy {
display: block;
font-size: 13px;
color: #0A090C;
margin-top: 0px;
}
.arde-acaba-con-las-pieles-landing .form-privacy a {
color: #0A090C;
text-decoration: underline;
} .arde-acaba-con-las-pieles-landing .sections {
background-color: var(--bg-dark);
padding: 40px 0 24px;
}
@media (min-width: 1000px) {
.arde-acaba-con-las-pieles-landing .sections {
padding: 80px 0 60px;
}
}
.arde-acaba-con-las-pieles-landing .section-row {
width: 100%;
display: grid;
align-items: center;
padding: 12px 12px 56px;
position: relative;
}
@media (min-width: 600px) {
.arde-acaba-con-las-pieles-landing .section-row {
padding: 24px 24px 64px;
}
}
@media (min-width: 1000px) {
.arde-acaba-con-las-pieles-landing .section-row {
padding: 40px 40px 80px;
min-height: 500px;
}
}
.arde-acaba-con-las-pieles-landing .section-row__wrapper {
max-width: 1400px;
margin: 0 auto;
position: relative;
display: grid;
height: 100%;
grid-gap: 40px;
grid-template-rows: auto auto;
grid-template-columns: 1fr;
align-items: center;
}
@media (min-width: 1000px) {
.arde-acaba-con-las-pieles-landing .section-row__wrapper {
grid-template-rows: 1fr;
grid-template-columns: 1fr 1fr;
}
}
.arde-acaba-con-las-pieles-landing .section-row__image {
z-index: 0;
position: relative;
grid-column: 1;
grid-row: 1;
border-radius: 10px;
overflow: hidden;
box-shadow: var(--shadow-01);
height: 100%;
padding-top: 60%;
}
@media (min-width: 1000px) {
.arde-acaba-con-las-pieles-landing .section-row__image {
grid-column: 1;
grid-row: 1;
padding-top: 70%;
}
}
.arde-acaba-con-las-pieles-landing .section-row__image img {
display: block;
position: absolute;
top: -10%;
left: 0;
width: 100%;
height: 120%;
object-fit: cover;
will-change: transform;
}
.arde-acaba-con-las-pieles-landing .section-row--alt .section-row__image {
grid-column: 1;
grid-row: 1;
}
@media (min-width: 1000px) {
.arde-acaba-con-las-pieles-landing .section-row--alt .section-row__image {
grid-column: 2;
grid-row: 1;
}
}
.arde-acaba-con-las-pieles-landing .section-row__text {
z-index: 1;
position: relative;
display: flex;
grid-row: 2;
grid-column: 1;
}
@media (min-width: 1000px) {
.arde-acaba-con-las-pieles-landing .section-row__text {
grid-row: 1;
grid-column: 2;
}
}
.arde-acaba-con-las-pieles-landing .section-row--alt .section-row__text {
grid-row: 2;
grid-column: 1;
}
@media (min-width: 1000px) {
.arde-acaba-con-las-pieles-landing .section-row--alt .section-row__text {
grid-row: 1;
grid-column: 1;
}
}
.arde-acaba-con-las-pieles-landing .section-row__text h2 {
font-family: "Anton", sans-serif;
font-weight: 400;
text-transform: uppercase;
color: var(--white);
margin: 0;
font-size: 2rem;
line-height: 1.05;
}
@media (min-width: 400px) {
.arde-acaba-con-las-pieles-landing .section-row__text h2 { font-size: 2.4rem; }
}
@media (min-width: 600px) {
.arde-acaba-con-las-pieles-landing .section-row__text h2 { font-size: 3rem; }
}
@media (min-width: 800px) {
.arde-acaba-con-las-pieles-landing .section-row__text h2 { font-size: 3.5rem; }
}
@media (min-width: 1200px) {
.arde-acaba-con-las-pieles-landing .section-row__text h2 { font-size: 4rem; }
}
.arde-acaba-con-las-pieles-landing .section-row__text h2 span {
color: var(--white);
position: relative;
display: inline-block;
}
.arde-acaba-con-las-pieles-landing .section-row__text h2 span:before {
content: "";
display: block;
position: absolute;
top: -10%;
left: -0.25em;
width: calc(100% + 0.3em);
height: 110%;
background-color: var(--primary);
clip-path: polygon(2% 0, 25% 5%, 50% 0%, 75% 5%, 99% 2%, 100% 33%, 99% 66%, 100% 100%, 75% 95%, 50% 100%, 25% 97%, 2% 98%, 2% 66%, 1% 33%);
z-index: -1;
}
.arde-acaba-con-las-pieles-landing .section-row__text p {
font-size: 1rem;
color: var(--white);
margin: 0.8rem 0;
}
@media (min-width: 600px) {
.arde-acaba-con-las-pieles-landing .section-row__text p {
font-size: 1.15rem;
}
} .arde-acaba-con-las-pieles-landing .floating-cta {
position: fixed;
bottom: 24px;
left: 0;
right: 0;
max-width: 100vw;
display: flex;
justify-content: center;
z-index: 100;
opacity: 0;
transition: opacity 0.3s;
pointer-events: none;
}
.arde-acaba-con-las-pieles-landing .floating-cta.is-visible {
opacity: 1;
pointer-events: auto;
}
.arde-acaba-con-las-pieles-landing .cta-btn {
display: flex;
align-items: center;
gap: 12px;
text-decoration: none;
text-transform: uppercase;
font-size: 1.2rem;
letter-spacing: 0.1em;
color: var(--white);
background-color: var(--primary);
border: none;
border-radius: 8px;
padding: 12px 12px 10px;
font-family: "Anton", sans-serif;
font-weight: 400;
cursor: pointer;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25);
white-space: nowrap;
}
@media (min-width: 500px) {
.arde-acaba-con-las-pieles-landing .cta-btn {
font-size: 1.4rem;
padding: 24px 36px 20px;
}
}
.arde-acaba-con-las-pieles-landing .cta-btn:hover {
transform: scale(1.05);
}
.arde-acaba-con-las-pieles-landing .cta-btn svg {
display: block;
width: 60px;
height: 60px;
fill: var(--white);
} .arde-acaba-con-las-pieles-landing .hero__bg {
position: relative;
overflow: hidden;
border-radius: 10px 10px 0 0;
padding-top: 50%;
}
.arde-acaba-con-las-pieles-landing .hero__bg img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
} .arde-acaba-con-las-pieles-landing .scroll-indicator {
position: fixed;
bottom: 40px;
left: 50%;
transform: translateX(-50%) scale(0.5);
z-index: 10;
width: 120px;
height: 120px;
border-radius: 50%;
background: rgba(0, 0, 0, 0.7);
display: flex;
align-items: center;
justify-content: center;
padding-top: 28px;
overflow: hidden;
opacity: 0;
transition: opacity 0.3s;
pointer-events: none;
}
.arde-acaba-con-las-pieles-landing .scroll-indicator.is-visible {
opacity: 1;
}
.arde-acaba-con-las-pieles-landing .scroll-indicator svg {
max-height: 100%;
}
.arde-acaba-con-las-pieles-landing .scroll-indicator path {
stroke: var(--white);
fill: transparent;
stroke-width: 2px;
animation: arde-arrow 2s ease infinite;
}
.arde-acaba-con-las-pieles-landing .scroll-indicator .a2 {
animation-delay: -0.5s;
}
.arde-acaba-con-las-pieles-landing .scroll-indicator .a1 {
animation-delay: -1s;
}
@keyframes arde-arrow {
0% { opacity: 0; }
40% { opacity: 1; }
80% { opacity: 0; }
100% { opacity: 0; }
} @media (min-width: 1000px) {
.arde-acaba-con-las-pieles-landing .hero__bg {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
height: 100%;
z-index: 0;
overflow: hidden;
border-radius: 0;
padding-top: 0;
}
.arde-acaba-con-las-pieles-landing .hero__bg img {
object-fit: none;
width: auto;
height: max(100%, 65vw);
left: 25%;
top: 40%;
transform: translate(-40%, -40%);
}
.arde-acaba-con-las-pieles-landing .hero__bg::after {
content: "";
position: absolute;
top: 0;
right: 0;
width: 45%;
height: 100%;
background: linear-gradient(to right, transparent, var(--bg-dark) 90%);
pointer-events: none;
}
} .arde-acaba-con-las-pieles-landing .bottom-cta {
display: flex;
justify-content: center;
padding: 0 16px 40px;
background-color: var(--bg-dark);
}
.arde-acaba-con-las-pieles-landing .bottom-cta__btn {
display: flex;
align-items: center;
gap: 12px;
background: var(--primary);
color: var(--white);
border: none;
border-radius: 8px;
padding: 20px 24px;
font-family: "Anton", sans-serif;
font-size: 1.2rem;
letter-spacing: 0.1em;
text-transform: uppercase;
cursor: pointer;
text-decoration: none;
transition: background 0.2s;
width: 100%;
max-width: 500px;
justify-content: center;
}
.arde-acaba-con-las-pieles-landing .bottom-cta__btn:hover {
background: var(--primary-light);
}
.arde-acaba-con-las-pieles-landing .bottom-cta__btn svg {
width: 40px;
height: 40px;
fill: var(--white);
flex-shrink: 0;
}