a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
    border: 0;
    font-size: 100%;
    font: inherit;
    margin: 0;
    padding: 0;
    vertical-align: baseline;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

body {
    line-height: 1;
}

ol,
ul {
    list-style: none;
}

blockquote,
q {
    quotes: none;
}

blockquote:after,
blockquote:before,
q:after,
q:before {
    content: "";
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

* {
    text-rendering: optimizeLegibility;
    font-feature-settings: "kern" 1;
    font-kerning: normal;
}

*,
:after,
:before {
    box-sizing: border-box;
}

body,
html {
    -webkit-overflow-scrolling: touch;
    font-family: sans-serif, Helvetica, Arial;
    height: 100%;
    min-height: 100%;
}

html {
    -webkit-text-size-adjust: none;
    -webkit-tap-highlight-color: transparent;
}

body {
    position: relative;
    width: 100%;
}

img {
    display: block;
    height: auto;
    max-width: 100%;
}

b,
strong {
    font-weight: var(--font-weight-bold, 700);
}

a {
    background: transparent;
    font-size: 100%;
    vertical-align: baseline;
}

input,
select {
    vertical-align: middle;
}

@font-face {
    font-display: auto;
    font-family: Campton;
    font-style: normal;
    font-weight: 700;
    src: url(../Campton-Bold.b839425e.woff) format("woff");
}

@font-face {
    font-display: auto;
    font-family: Campton;
    font-style: normal;
    font-weight: 400;
    src: url(../Campton-Book.401e5a6a.woff) format("woff");
}

@font-face {
    font-display: auto;
    font-family: Campton;
    font-style: italic;
    font-weight: 700;
    src: url(../Campton-BoldItalic.8bbe23bb.woff) format("woff");
}

@font-face {
    font-display: auto;
    font-family: Campton;
    font-style: italic;
    font-weight: 400;
    src: url(../Campton-BookItalic.964f95d3.woff) format("woff");
}

@font-face {
    font-display: auto;
    font-family: Campton;
    font-style: normal;
    font-weight: 600;
    src: url(../Campton-SemiBold.d288affa.woff) format("woff");
}

@font-face {
    font-display: auto;
    font-family: Campton;
    font-style: normal;
    font-weight: 500;
    src: url(../Campton-Medium.cd913a13.woff) format("woff");
}

@font-face {
    font-display: auto;
    font-family: Campton;
    font-style: italic;
    font-weight: 500;
    src: url(../Campton-MediumItalic.3c7527a5.woff) format("woff");
}

:root {
    --color-professor1: #1e1348;
    --color-professor2: #5c4d9b;
    --color-professor3: #e7daed;
    --color-professor4: #b2a4d2;
    --color-professor5: #5d4d9b;
    --color-lectoescriptura1: #29235c;
    --color-pink: #e74194;
    --color-red: #ff604f;
    --color-dark-orange: #f07c24;
    --color-active-orange: #fab807;
    --color-orange: #f29045;
    --color-blue: #4aadf8;
    --color-green: #44c887;
    --color-yellow: #fdb71a;
    --color-area-socials: #fbb800;
    --color-area-techno: #789fed;
    --color-area-catalan: #ff604f;
    --color-white: #fff;
    --color-dark: #000;
    --bg-section: var(--color-white);
    --bg-section-alt: #f5f7fa;
    --font-family-base: "campton", sans-serif;
    --font-size-large: 1.8rem;
    --font-size-base: 1.8rem;
    --font-size-small: 1.6rem;
    --line-height-base: 2.4rem;
    --font-weight-regular: 300;
    --font-weight-bold: 700;
    --font-weight-accent: 700;
    --z-layout: 100;
    --z-modal: 1000;
    --z-debug: 10000;
    --duration-hover: 0.3s;
    --slider-transition: 0.3s ease-in-out;
    --padding-inline: 2rem;
    --header-height: 5.8rem;
    --flow-space: 1.6rem;
}

@media (min-width: 768px) {
     :root {
        --padding-inline: max(5vw, 50vw - 48rem);
    }
}

html {
    text-rendering: optimizelegibility;
    font-size: 62.5%;
    height: 100%;
    scroll-padding-top: 15rem;
}

body {
    background: var(--color-white);
    color: var(--color-dark);
    font-family: var(--font-family-base);
    font-size: var(--font-size-base);
    height: auto;
    height: 100%;
    letter-spacing: 0.01em;
    line-height: var(--line-height-base);
    min-height: 100%;
    overflow-x: hidden;
}

body.no-scroll {
    overflow: hidden;
}

body,
main {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    width: 100%;
}

#viewport {
    z-index: 2;
}

main {
    --brand: var(--color-professor2);
    background: var(--color-white);
    left: 0;
    position: relative;
    top: 0;
    width: 100vw;
    z-index: 0;
}

main[data-page="llengua-catalana"] {
    --brand: var(--color-red);
    --brand-light: #f7bcbe;
}

main[data-page="lengua-castellana"] {
    --brand: var(--color-orange);
    --brand-light: #fbcdac;
}

main[data-page="ciencies-socials"] {
    --brand: var(--color-yellow);
    --brand-light: #ffdd7f;
}

main[data-page="tecnologia"] {
    --brand: var(--color-blue);
    --brand-light: #d8e5ff;
}

a {
    color: var(--color-blue);
    text-decoration: none;
}

a:focus-visible,
a:hover,
a[aria-current] {
    text-decoration: underline;
}

i {
    font-style: italic;
}

.h1,
.h2,
.h3,
.lead,
.pretitle,
.blue-pretitle,
.posttitle,
.product-name,
.subtitle,
.sub1,
.sub2,
.sub3 {
    font-size: var(--font-size, 4.8rem);
    font-weight: var(--font-weight, 700);
    letter-spacing: var(--letter-spacing, 0.01);
    line-height: var(--line-height, 5.2rem);
}

.h3 {
    --font-size: 3.2rem;
    --line-height: 3.2rem;
}

.sub1 {
    --font-size: 3rem;
    --line-height: 3.6rem;
    --font-weight: 500;
}

.sub2 {
    --font-size: 2.6rem;
    --line-height: 3.2rem;
}

.sub3 {
    color: var(--color-professor1);
    --font-size: 3rem;
    --line-height: 3.6rem;
    --font-weight: 500;
}

.pretitle {
    --line-height: 4rem;
    --font-weight: 500;
}

.posttitle,
.blue-pretitle {
    --font-size: 2.4rem;
    --line-height: 2.8rem;
    --font-weight: 700;
    --letter-spacing: 0.05em;
    color: var(--color-blue);
    font-style: italic;
}

.subtitle {
    --font-size: 5.2rem;
    --line-height: 5rem;
    --font-weight: 700;
    --letter-spacing: 0.01;
    color: var(--color-blue);
}

.lead {
    --font-size: 1.8rem;
    --line-height: 2.4rem;
    --font-weight: 600;
    color: white;
}

.product-name {
    --font-size: 1.6rem;
    --line-height: 3.6rem;
}

@media (min-width: 768px) {
    .h1 {
        --font-size: 11rem;
        --line-height: 10rem;
    }
    .h2 {
        --font-size: 7rem;
        --line-height: 7.2rem;
    }
    .h3 {
        --font-size: 7.2rem;
        --line-height: 7rem;
    }
    .sub1 {
        --font-size: 3.6rem;
        --line-height: 4rem;
    }
}

b,
strong {
    font-weight: var(--font-weight-bold);
}

.vertical-flow>*+* {
    margin-top: var(--flow-space, 1.6rem);
}

.sr-only {
    clip: rect(0, 0, 0, 0);
    border: 0;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

@media (max-width: 767.99px) {
    .lg {
        display: none !important;
    }
}

@media (max-width: 959.99px) {
    .xl {
        display: none !important;
    }
}

@media (max-width: 1090px) {
    .md {
        display: none !important;
    }
}

@media (min-width: 250px) {
    /* .xs {
    display: none !important;
  } */
    .sm {
        display: none !important;
    }
}

@media (min-width: 768px) {
    .xs {
        display: none !important;
    }
    .xxs {
        display: none !important;
    }
}

@media (min-width: 1090px) {
    .sm {
        display: none !important;
    }
}

:where(.row) {
    display: flex;
}

:where(.stack) {
    align-items: var(--align, center);
    display: flex;
    flex-direction: column;
    justify-content: var(--justify, flex-start);
}

body {
    background: var(--bg-section);
}

body:not([data-view="home"]) .app-footer {
    z-index: 1;
}

.btn {
    align-items: center;
    background: var(--bg, var(--color-blue));
    border: 0;
    border-radius: 9in;
    color: var(--color, var(--color-white));
    display: inline-flex;
    font-family: inherit;
    font-size: 1.6rem;
    font-weight: 600;
    gap: 0.8rem;
    height: 4.8rem;
    justify-content: center;
    line-height: 1;
    padding: 0 2.4rem;
    transition: background-color var(--duration-hover);
}

.btn:focus,
.btn:hover {
    background: var(--bg-hover, var(--color-blue));
    text-decoration: none;
}

.btn:active {
    background: var(--bg-active, var(--color-blue));
    text-decoration: none;
}

.btn-stack {
    width: 251px;
    display: flex;
}

.container {
    ----container-inline-padding: var(--container-inline-padding, 0rem);
    padding-left: calc(var(----container-inline-padding) + var(--container-left-padding, var(--container-inline-padding, 2rem)));
    padding-right: calc(var(----container-inline-padding) + var(--container-right-padding, var(--container-inline-padding, 2rem)));
}

@media (min-width: 768px) {
    .container {
        ----container-inline-padding: clamp(2rem, 2vw, calc(50vw - min(100vw, var(--container-width, 144rem)) / 2));
    }
}

.container-only {
    background: #0003;
    margin-left: auto;
    margin-right: auto;
    width: clamp(4rem, 100vw - 4rem, 144rem);
}

.container-fluid {
    --computed-width: min(100vw - var(--inline-padding, 2rem) * 2, var(--container-width, 144rem));
    --computed-inline-padding: calc(50vw - var(--computed-width) / 2);
    padding-left: var(--computed-inline-padding);
    padding-right: var(--computed-inline-padding);
}

.media {
    position: relative;
}

.media img {
    object-fit: cover;
    object-position: center;
}

.media.background {
    border-radius: 1rem 1rem 5rem 0;
    inset: 0 0 11.4rem;
    position: absolute;
    z-index: -1;
}

.media.background img {
    height: 100%;
    inset: 0;
    position: absolute;
    width: 100%;
}

.app-header {
    --nav-gap: 2.3rem;
    --nav-item-padding: 2.3rem;
    align-items: center;
    background: var(--color-professor1);
    border-radius: 1.9rem;
    display: flex;
    font-size: 1.4rem;
    height: 7.2rem;
    inset: 0.8rem 0.8rem auto;
    justify-content: space-between;
    line-height: 1;
    overflow: hidden;
    padding: 0 calc(1.9rem - var(--nav-item-padding)) 0 2.2rem;
    position: fixed;
    z-index: var(--z-layout);
}

.app-header>a {
    display: block;
}

.app-header>a>svg {
    height: 65%;
    width: 65%;
}

.app-header nav {
    display: flex;
    gap: calc(var(--nav-gap) - var(--nav-item-padding) * 2);
}

.app-header nav>a {
    align-items: center;
    border-radius: 9in;
    color: var(--color-white);
    display: flex;
    font-weight: 600;
    height: 3rem;
    justify-content: center;
    padding: 0.2rem var(--nav-item-padding) 0;
    position: relative;
    text-decoration: none;
}

.app-header nav>a[aria-current="page"] {
    background: var(--color-professor2);
    font-weight: 700;
}

.app-header nav>a[aria-current="page"]:before {
    --size: 0.6rem;
    background: var(--color-white);
    border-radius: 9in;
    content: "";
    height: var(--size);
    left: 50%;
    position: absolute;
    top: 100%;
    transform: translate(-50%, -50%);
    width: var(--size);
}

@media (min-width: 768px) {
    .app-header {
        --nav-gap: 4rem;
        --nav-item-padding: 1.7rem;
        height: 8rem;
        inset: 1.6rem 1.6rem auto;
        padding: 0 calc(3.5rem - var(--nav-item-padding)) 0 3.5rem;
    }
    .app-header>a>svg {
        height: auto;
        width: auto;
    }
    .app-header nav {
        gap: 2.2rem;
    }
    .app-header nav>a {
        max-width: 15.4rem;
    }
}

.app-footer {
    background: var(--color-professor1);
    color: var(--color-white);
    display: grid;
    gap: 4.6rem;
    padding-bottom: 4.2rem;
    padding-top: 5.4rem;
    position: relative;
}

.app-footer .footer,
.app-footer .header,
.app-footer .info,
.app-footer .wrapper {
    display: flex;
    flex-direction: column;
}

.app-footer .wrapper {
    gap: 4.6rem;
}

.app-footer .header {
    font-weight: 700;
    gap: 3rem;
}

.app-footer .info {
    font-size: 2.2rem;
    gap: 1.7rem;
    line-height: 2.6rem;
}

.app-footer .info>div {
    align-items: center;
    display: flex;
    gap: 3.2rem;
}

.app-footer .form {
    display: grid;
    font-weight: 600;
    gap: 4.6rem;
}

.app-footer .form-fields {
    display: grid;
    gap: 2rem;
}

.app-footer .form-fields+.form-fields {
    margin-top: 4.2rem;
}

.app-footer .form-title {
    font-size: 2.4rem;
    line-height: 2.4rem;
    font-weight: 400;
}

.app-footer .form-field label {
    display: none;
}

.app-footer .form-field input {
    align-items: center;
    border: 0;
    border-radius: 0.6rem;
    display: flex;
    font-family: inherit;
    height: 5.2rem;
    padding: 0 1.2rem;
    width: 100%;
}

.app-footer .checkbox input {
    display: none;
}

.app-footer .checkbox span {
    display: inline-block;
    padding-left: 2.8rem;
}

.app-footer .checkbox span:before {
    background: 50%;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='2.5' y='2.5' width='19' height='19' rx='3.5' fill='%234AADF8' stroke='%231E1348'/%3E%3C/svg%3E");
    content: "";
    display: block;
    height: 2rem;
    margin-left: -2.8rem;
    position: absolute;
    width: 2rem;
}

.app-footer .checkbox input:checked+span:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='2.5' y='2.5' width='19' height='19' rx='3.5' fill='%234AADF8' stroke='%231E1348'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='m16.288 9.293-.003-.003a.997.997 0 0 0-1.412-.003L10.99 13.17l-.875-.87a1 1 0 0 0-1.41 0l-.005.005a.995.995 0 0 0-.005 1.408c.002 0 .003.002.004.003l1.584 1.58a1 1 0 0 0 1.413-.002l4.59-4.59a1 1 0 0 0 .002-1.411Z' fill='%23fff'/%3E%3C/svg%3E");
}

.app-footer .checkbox a {
    color: inherit;
    text-decoration: underline;
}

.app-footer .form-choices {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
    grid-column: 1 / span 2;
}

.app-footer .form-footer {
    display: grid;
    gap: 1.6rem;
    margin-top: 2rem;
}

.app-footer .footer {
    align-items: center;
}

.app-footer .footer svg {
    max-width: 23.4rem;
}

.app-footer .parallax-element {
    right: -18rem;
    top: -4rem;
}

.app-footer .parallax-element>div {
    --size: 28.9rem;
    background: var(--color-professor2);
    border-radius: 9in;
    height: var(--size);
    width: var(--size);
}

@media (min-width: 768px) {
    .app-footer {
        --container-width: min(80%, 112rem);
        padding-bottom: 14rem;
        padding-top: 12rem;
    }
    .app-footer .parallax-element {
        right: -17rem;
        top: -11rem;
    }
    .app-footer .parallax-element>div {
        --size: 33.7rem;
    }
}

@media (min-width: 960px) {
    .app-footer {
        --container-width: min(80%, 112rem);
        --container-left-padding: clamp(2rem, 2vw, 15rem);
        --container-right-padding: clamp(2rem, 2vw, 15rem);
        border-top-left-radius: 30rem;
        gap: 1.6rem;
        padding-bottom: 24rem;
        padding-top: 22rem;
    }
    .app-footer .content,
    .app-footer .form {
        flex: 1 0 min(55rem, 50%);
    }
    .app-footer .wrapper {
        flex-direction: row;
        gap: 2rem;
    }
    .app-footer .form {
        gap: 1.7rem;
    }
    .app-footer .form-fields {
        grid-template-columns: repeat(2, 1fr);
    }
    .app-footer .form-title {
        grid-column: 1 / span 2;
    }
    .app-footer .form-footer {
        grid-template-columns: auto 15.7rem;
    }
    .app-footer .footer {
        align-items: start;
        grid-column: 1 / span 2;
        margin-top: 2rem;
    }
    .app-footer .footer svg {
        max-width: 41.6rem;
    }
    [data-view="home"] .app-footer:before {
        background: var(--bg-section-alt);
        content: "";
        display: block;
        inset: 0;
        position: absolute;
        z-index: -1;
    }
    .app-footer .form-choices {
        margin-bottom: 3rem;
    }
    [data-view="index"] .app-footer {
        padding-bottom: 10rem;
    }
    [data-view="index"] .app-footer .footer {
        margin-top: -2rem;
        transform: translateY(-100%);
        width: 50%;
    }
}

.text-landing-header {
    --nav-gap: 2.3rem;
    --nav-item-padding: 2.3rem;
    align-items: center;
    background: var(--color-professor1);
    border-radius: 1.9rem;
    color: #fff;
    display: flex;
    font-size: 1.4rem;
    height: 7.2rem;
    inset: 0.8rem 0.8rem auto;
    justify-content: space-between;
    line-height: 1;
    padding: 0 1.4rem 0 2.2rem;
    position: fixed;
    z-index: calc(var(--z-layout) + 1);
}

.text-landing-header>a {
    display: block;
    margin-right: auto;
    max-width: 10.2rem;
}

.text-landing-header>a>svg {
    height: 100%;
    width: 100%;
}

.text-landing-header nav {
    background: var(--color-professor1);
    border-radius: 1.9rem;
    display: flex;
    flex-direction: column;
    gap: 3.6rem;
    left: 0;
    padding: 4.6rem;
    position: absolute;
    right: 0;
    top: calc(100% + 0.8rem);
}

.text-landing-header nav>a {
    align-items: center;
    border-radius: 9in;
    color: var(--color-white);
    display: flex;
    font-size: 1.4rem;
    font-weight: 600;
    height: 3rem;
    justify-content: center;
    line-height: 1.8rem;
    padding: 0.2rem var(--nav-item-padding) 0;
    position: relative;
    text-align: center;
    text-decoration: none;
}


/* .text-landing-header nav > a[aria-current="page"]:before {
  --size: 0.6rem;
  background: var(--color-white);
  border-radius: 9in;
  content: "";
  height: var(--size);
  left: 50%;
  position: absolute;
  top: 100%;
  transform: translate(-50%, -50%);
  width: var(--size);
} */


/* .text-landing-header nav > a[data-key="llengua-catalana"]:before {
  background: var(--color-red);
}
.text-landing-header nav > a[data-key="lengua-castellana"]:before {
  background: var(--color-orange);
}
.text-landing-header nav > a[data-key="ciencies-socials"]:before {
  background: var(--color-yellow);
}
.text-landing-header nav > a[data-key="tecnologia"]:before {
  background: var(--color-blue);
} */


/* .text-landing-header nav > a[aria-current="page"] {
  background: var(--color-active-orange);
} */

.text-landing-header:not(.open) nav {
    display: none;
}

.text-landing-header .actives {
    margin-left: 1rem;
}

.text-landing-header .actives .nav-item {
    align-items: center;
    background: #372a69;
    border-radius: 1.5rem;
    display: none;
    font-size: 1.4rem;
    height: 4.4rem;
    justify-content: center;
    line-height: 1.6rem;
    max-width: 17rem;
    padding: 0.3rem 2rem 0;
    text-align: center;
}

[data-page="ciencies-socials"] .text-landing-header .actives .nav-item[data-key="ciencies-socials"],
[data-page="lengua-castellana"] .text-landing-header .actives .nav-item[data-key="lengua-castellana"],
[data-page="llengua-catalana"] .text-landing-header .actives .nav-item[data-key="llengua-catalana"],
[data-page="tecnologia"] .text-landing-header .actives .nav-item[data-key="tecnologia"] {
    display: flex;
}

.text-landing-header .toggler {
    all: unset;
    cursor: pointer;
    display: inline-flex;
    margin-left: 1rem;
}

.text-landing-header .toggler circle {
    fill: var(--color-professor2);
}

[data-page="llengua-catalana"] .text-landing-header .toggler circle[data-key="llengua-catalana"],
[data-page="sequencies"] .text-landing-header .toggler circle[data-key="llengua-catalana"] {
    fill: var(--color-red);
}

[data-page="lengua-castellana"] .text-landing-header .toggler circle[data-key="lengua-castellana"],
[data-page="sequencies"] .text-landing-header .toggler circle[data-key="lengua-castellana"] {
    fill: var(--color-orange);
}

[data-page="ciencies-socials"] .text-landing-header .toggler circle[data-key="ciencies-socials"],
[data-page="sequencies"] .text-landing-header .toggler circle[data-key="ciencies-socials"] {
    fill: var(--color-yellow);
}

[data-page="sequencies"] .text-landing-header .toggler circle[data-key="tecnologia"],
[data-page="tecnologia"] .text-landing-header .toggler circle[data-key="tecnologia"] {
    fill: var(--color-blue);
}

@media (min-width: 960px) {
    .text-landing-header {
        height: 8rem;
        inset: 1.6rem 1.6rem auto;
        justify-content: space-between;
        padding: 0 2.2rem 0 3.5rem;
    }
    .text-landing-header>a {
        max-width: 20.8rem;
    }
    .text-landing-header .actives,
    .text-landing-header .toggler {
        display: none;
    }
    .text-landing-header nav {
        flex-direction: row;
        gap: 3.6rem;
        margin-left: 3.6rem;
        padding: 0;
        position: static;
    }
    .text-landing-header nav>a {
        border-radius: 1.6rem;
        height: 5.2rem;
        padding: 0 0.7rem;
        text-wrap: nowrap;
        width: 6.6rem;
    }
    .text-landing-header nav>a[aria-current="page"] {
        font-weight: 700;
        width: 19rem;
    }
    .text-landing-header:not(.open) nav {
        display: flex;
    }
}

.cover {
    color: var(--color-white);
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
    justify-content: center;
    min-height: 67.2rem;
    overflow: hidden;
    padding-bottom: 3.6rem;
    padding-top: 2rem;
    position: relative;
}

.cover,
.cover .background {
    border-radius: 2.4rem;
}

.cover .head {
    --color: var(--color-white);
    --dot-color: var(--color-blue);
    inset: 0 0 auto;
    position: absolute;
}

.cover .content {
    display: grid;
    gap: 1.2rem;
}

@media (min-width: 768px) {
    .cover {
        --container-left-padding: min(10vw, 15rem);
        --container-right-padding: min(50vw, 15rem);
    }
    .cover .head {
        top: 1.2rem;
    }
    .cover .content {
        gap: 0.5rem;
    }
    .cover .h2 {
        margin-top: 2.1rem;
    }
    .cover .lead {
        width: min(100%, 46rem);
    }
}

.card {
    --border-radius: 2.2rem;
    background: var(--color-white);
    border: 1px solid rgba(0, 0, 0, 0.05);
    box-shadow: 0 0.8rem 2.5rem -1rem rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
    isolation: isolate;
}

.card,
.card .media {
    border-radius: var(--border-radius);
}

.card .media {
    margin-bottom: -4.8rem;
    overflow: hidden;
    z-index: -1;
}

.card .glyph {
    background: var(--color-white);
    border-radius: 0 0 9in 9in;
    height: 7.5rem;
    left: 2rem;
    padding: 1.7rem 0.8rem;
    position: absolute;
    top: 0;
    width: 6.4rem;
}

.card .content {
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
    padding: 2rem;
}

.card a {
    align-items: center;
    display: flex;
    font-weight: 600;
    gap: 1.3rem;
    margin-top: 1.2rem;
}

@media (min-width: 768px) {
    .card {
        align-items: center;
        flex-direction: row;
        height: min-content;
    }
    .card .media {
        height: calc(42.8rem + 4px);
        inset: -1px;
        margin-bottom: -2px;
    }
    .card .media picture img {
        height: 100%;
        width: 100%;
    }
    .card .content {
        gap: 2.7rem;
        padding: 1.4rem;
        width: 27rem;
    }
    .card .content .h2 {
        margin-left: -7.5rem;
        position: relative;
    }
}

.more-info {
    --bg: var(--color-professor1);
    --bg-hover: #6856ae;
    --bg-active: #5d4d9b;
    bottom: 2rem;
    cursor: pointer;
    font-weight: 500;
    position: fixed;
    right: 2rem;
    transition: opacity 0.2s ease-in-out;
    z-index: var(--z-layout);
}

.more-info.hidden {
    opacity: 0;
}

@media (max-width: 767px) {
    .more-info {
        padding: 0;
        width: 4.8rem;
    }
}

.floor {
    position: relative;
    z-index: 1;
}

.floor .background {
    inset: 0;
    position: absolute;
    z-index: -1;
}

.head {
    align-items: center;
    color: var(--color, var(--color-professor2));
    display: flex;
    flex-direction: column;
    gap: 1.6rem;
    justify-content: center;
    padding: 2rem;
    text-align: center;
}

.head .bullet {
    --size: 2.4rem;
    background: var(--dot-color, var(--color-professor2));
    border-radius: 9in;
    content: "";
    display: block;
    height: var(--size);
    width: var(--size);
}

.head .head__body {
    color: var(--body-color, #000);
    margin-top: -1.2rem;
    max-width: 67rem;
}

.md .annotation {
    display: inline-flex;
    position: absolute;
    left: -345px;
    bottom: -190px;
    text-align: left;
}

.md .annotation svg,
.sm .annotation svg {
    margin-right: 1.1rem;
}

.sm .annotation {
    display: flex;
    margin-top: 4rem;
    justify-content: center;
}

.product {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

.product .media {
    margin: 0 auto;
    max-width: 27rem;
    position: relative;
}

.product .media:after,
.product .media:before {
    content: "";
    display: block;
    position: absolute;
}

.product .media img {
    z-index: 4;
}

.product .media:after {
    --offset: 30%;
    background: no-repeat 50% / contain;
    bottom: 0;
    height: 140%;
    right: var(--offset);
    width: 130%;
    z-index: -2;
}

.product .media .parallax-element {
    left: 0;
    top: -40%;
    transform: scale(0.35);
    z-index: -1;
}

.product:first-child .media:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='563' height='547' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M562.403 274.498C562.403 424.997 436.505 547 281.201 547 125.898 547 0 424.997 0 274.498 0 123.999 103.838-18.63 305.065 1.995 484.651 20.403 562.403 124 562.403 274.498Z' fill='%23FF604F'/%3E%3C/svg%3E");
}

.product:nth-child(2) .media:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='566' height='497' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M177.439 458.687C36.847 395.699-34.341 252.154 16.928 137.722 68.196 23.289 246.612-37.608 387.204 25.38c140.592 62.988 232.31 184.214 143.357 360.047-76.479 124.62-212.53 136.248-353.122 73.26Z' fill='%2344C887'/%3E%3C/svg%3E");
}

.product:nth-child(3) .media:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='551' height='485' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M.095 216.493C.732 61.381 117.68-.521 282.993.158c126.393.52 268.444 97.072 267.862 238.645-.637 155.112-104.71 264.752-318.82 242.615C40.951 461.661-.542 371.604.095 216.493Z' fill='%23EB61A6'/%3E%3C/svg%3E");
}

.product:nth-child(4) .media:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='597' height='490' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M595.515 269.556c-10.06 130.093-94.675 177.548-290.784 213.43C127.658 515.384-8.753 430.205 1.307 300.112c10.06-130.093 124.386-323.09 359.9-296.988 172.708 29.362 244.368 136.339 234.308 266.432Z' fill='%23FDB71A'/%3E%3C/svg%3E");
}

.product .content {
    gap: 1rem;
}

.product .content,
.product .product-group {
    display: flex;
    flex-direction: column;
}

.product .product-group img {
    width: 4.8rem;
}

.product[data-odd] .content,
.product[data-odd] .product-group {
    align-items: flex-end;
    text-align: right;
}

.product[data-odd] .media:after {
    left: var(--offset);
    right: auto;
}

.product[data-odd] .media .parallax-element {
    left: -65%;
}

.product[data-variant="tot-tallers"]:first-child .media:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='540' height='430' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.86 23.59C10.212 10.108 21.599-.438 35.068.244L492.71 23.422c12.145.615 21.91 10.215 22.732 22.347l24.233 357.769c.971 14.346-10.803 26.321-25.163 25.591L23.383 404.188C10.376 403.527.27 392.614.608 379.595L9.861 23.59Z' fill='%23FF604F'/%3E%3C/svg%3E");
}

.product[data-variant="tot-tallers"]:nth-child(2) .media:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='530' height='503' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M529.481 52.417c.837-13.302-9.324-24.738-22.631-25.471L25.321.396C11.568-.362 0 10.586 0 24.36v402.314c0 12.207 9.163 22.469 21.292 23.847l454.632 51.631c13.641 1.549 25.799-8.638 26.661-22.339l26.896-427.396Z' fill='%2344C887'/%3E%3C/svg%3E");
}

.product[data-variant="tot-tallers"]:nth-child(3) .media:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='523' height='562' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M460.336 561.812c12.919.663 24.039-9.033 25.142-21.922l37.204-434.652c1.037-12.114-7.15-23.09-19.057-25.55L122.402.938c-13.135-2.714-25.945 5.865-28.437 19.044L1.11 510.98c-2.703 14.292 7.827 27.683 22.353 28.428l436.873 22.404Z' fill='%23FBB800'/%3E%3C/svg%3E");
}

@media (min-width: 768px) {
    .product {
        flex-direction: row;
        gap: 7.5rem;
        justify-content: flex-start;
    }
    .product .media {
        max-width: 50.6rem;
    }
    .product .media:after {
        --offset: 0;
        transform: scale(0.9);
    }
    .product .media .parallax-element {
        left: 33%;
        top: -30%;
        transform: scale(0.6);
        z-index: -1;
    }
    .product .content {
        flex: 0 0 43rem;
    }
    .product .content .h3 {
        margin-bottom: 0.4rem;
    }
    .product .media-wrapper {
        width: min(100%, 50.6rem);
    }
    .product[data-odd] {
        flex-direction: row-reverse;
    }
    .product[data-odd] .content,
    .product[data-odd] .product-group {
        align-items: flex-start;
        text-align: left;
    }
    .product[data-variant="tot-tallers"] .media:after {
        bottom: -8rem;
    }
}

.products-list {
    display: grid;
    gap: 0.8rem;
}

.products-list img {
    width: 3.4rem;
}

.products-list li {
    align-items: center;
    display: flex;
    gap: 0.9rem;
}

@media (min-width: 960px) {
    .products-list {
        background: var(--color-white);
        border-radius: 1.8rem;
        gap: 0;
        padding: 0.9rem 2rem;
        width: 26.3rem;
    }
    .products-list .product-name {
        flex-grow: 1;
        padding: 1.7rem 0;
    }
    .products-list li+li .product-name {
        border-top: 1px solid #edecf0;
    }
}

.numbered-list {
    display: grid;
    font-size: 1.6rem;
    gap: 3.2rem;
    line-height: 2.4rem;
}

.numbered-list li {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 1.4rem;
    justify-content: center;
    text-align: center;
}

.numbered-list .num {
    font-size: 4.2rem;
    font-weight: 700;
    isolation: isolate;
    line-height: 1;
    position: relative;
}

.numbered-list .num:before {
    background: no-repeat 50% / contain;
    content: "";
    display: block;
    height: 4.7rem;
    left: 50%;
    position: absolute;
    top: 0.9rem;
    transform: translateX(-50%);
    width: 5.2rem;
    z-index: -1;
}

.numbered-list li:first-child .num:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='51' height='46' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M45.938 34.75c-15.137 11.368-23.08 12.811-34.5 6.683C.015 35.305-3.026 23.181 3.1 11.765 9.224.35 24.926-3.144 36.347 2.985c11.422 6.128 20.584 21.027 9.59 31.765Z' fill='%23FDB71A'/%3E%3C/svg%3E");
}

.numbered-list li:nth-child(2) .num:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='50' height='47' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M41.301 6.703c8.741 10.17 11.687 25.405 2.222 33.54C34.06 48.375 16.287 48.17 7.545 38-1.196 27.83-2.775 15.423 6.69 7.289c9.465-8.134 25.87-10.757 34.612-.586Z' fill='%23FF604F'/%3E%3C/svg%3E");
}

.numbered-list li:nth-child(3) .num:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='48' height='46' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M48 25.017C48 37.498 32.513 46 19.932 46 7.352 46 0 33.462 0 20.983 0 8.503 11.826 0 24.407 0 36.987 0 48 12.538 48 25.017Z' fill='%23789FED'/%3E%3C/svg%3E");
}

@media (min-width: 960px) {
    .numbered-list {
        gap: 3.6rem;
    }
    .numbered-list li {
        align-items: flex-start;
        flex-direction: row;
        gap: 6rem;
        text-align: left;
    }
    .numbered-list .sub2 {
        margin-bottom: 0.6rem;
    }
    .numbered-list .num {
        font-size: 4.3rem;
    }
    .numbered-list .num:before {
        height: 6rem;
        top: 1.2rem;
        width: 6.6rem;
    }
}

.slider .scroll-wrap {
    overflow: hidden;
}

.slider .scroller {
    overflow-x: auto;
    overflow-y: hidden;
}

.slider .slider-nav {
    --size: 5rem;
    --transition: 0.1s ease-in-out;
    background: no-repeat 50%;
    background-color: var(--color-professor1);
    border: 1px solid rgba(0, 0, 0, 0.05);
    border-radius: 9in;
    box-shadow: 0 0.8rem 2.5rem -1rem rgba(0, 0, 0, 0.15);
    display: inline-flex;
    height: var(--size);
    overflow: hidden;
    text-indent: 100%;
    transition: transform var(--transition), box-shadow var(--transition);
    width: var(--size);
}

.slider .slider-nav[data-dir="prev"] {
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15.2485 6.3517C15.4735 6.57673 15.5999 6.8819 15.5999 7.2001C15.5999 7.51829 15.4735 7.82346 15.2485 8.0485L11.2969 12.0001L15.2485 15.9517C15.4671 16.178 15.5881 16.4811 15.5853 16.7958C15.5826 17.1104 15.4564 17.4114 15.2339 17.6339C15.0114 17.8564 14.7104 17.9826 14.3958 17.9853C14.0812 17.988 13.778 17.8671 13.5517 17.6485L8.75171 12.8485C8.52675 12.6235 8.40037 12.3183 8.40037 12.0001C8.40037 11.6819 8.52675 11.3767 8.75171 11.1517L13.5517 6.3517C13.7767 6.12673 14.0819 6.00035 14.4001 6.00035C14.7183 6.00035 15.0235 6.12673 15.2485 6.3517Z' fill='white'/%3E%3C/svg%3E%0A");
}

.slider .slider-nav[data-dir="next"] {
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8.75149 17.6483C8.52653 17.4233 8.40015 17.1181 8.40015 16.7999C8.40015 16.4817 8.52653 16.1765 8.75149 15.9515L12.7031 11.9999L8.75149 8.0483C8.5329 7.82198 8.41195 7.51886 8.41468 7.20422C8.41742 6.88959 8.54362 6.58861 8.76611 6.36612C8.9886 6.14363 9.28957 6.01743 9.60421 6.01469C9.91885 6.01196 10.222 6.13291 10.4483 6.3515L15.2483 11.1515C15.4733 11.3765 15.5996 11.6817 15.5996 11.9999C15.5996 12.3181 15.4733 12.6233 15.2483 12.8483L10.4483 17.6483C10.2233 17.8733 9.91809 17.9996 9.59989 17.9996C9.28169 17.9996 8.97652 17.8733 8.75149 17.6483Z' fill='white'/%3E%3C/svg%3E%0A");
}

.slider .slider-nav:active {
    box-shadow: 0 0.4rem 2.5rem -1rem rgba(0, 0, 0, 0.15);
    transform: translateY(0.1rem);
}

.parallax-element {
    color: #f5f7fa;
    position: absolute;
    z-index: -1;
}

.parallax-element[data-shape="circle"]>[data-ref="element"] {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='499' height='499' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='249.5' cy='249.5' r='249.5' fill='%23F5F7FA'/%3E%3C/svg%3E");
    height: 49.9rem;
    width: 49.9rem;
}

.parallax-element[data-shape="cross"]>[data-ref="element"] {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='616' height='623' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M297.845 31.894a116.892 116.892 0 0 1 26.611 37.62l40.139 86.622 86.584-40.122a116.858 116.858 0 0 1 98.249 212.024l-86.584 40.122 40.138 86.62a116.859 116.859 0 0 1-18.896 129.707 116.88 116.88 0 0 1-81.978 37.987 116.858 116.858 0 0 1-84.565-31.814 116.87 116.87 0 0 1-26.61-37.619l-40.139-86.621-86.585 40.123A116.858 116.858 0 0 1 65.96 294.519l86.586-40.122-40.14-86.623a116.879 116.879 0 0 1-4.856-90.22 116.888 116.888 0 0 1 60.922-66.722 116.872 116.872 0 0 1 129.373 21.062Z' fill='%23F5F7FA'/%3E%3C/svg%3E");
    height: 62.3rem;
    width: 61.6rem;
}

.parallax-element[data-shape="morph"]>[data-ref="element"] {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='2905' height='1910' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M620.029 26.552c258.219 39.924 507.291 125.45 735.651 252.604a216.382 216.382 0 0 1 68.12 53.742 217.078 217.078 0 0 1 41.62 76.24 217.531 217.531 0 0 1 8.43 86.516 217.465 217.465 0 0 1-26.1 82.922 217.14 217.14 0 0 1-56.44 66.036 216.634 216.634 0 0 1-77.75 38.562 216.082 216.082 0 0 1-86.58 4.908 216.117 216.117 0 0 1-81.54-29.535C862.287 501.634 542.022 424.435 218.557 435.125c-56.541.558-111.042-21.073-151.858-60.271C25.883 335.655 1.987 281.998.12 225.345c-1.87-56.652 18.436-111.807 56.578-153.68C94.838 29.79 147.792 4.519 204.244 1.249A2225.487 2225.487 0 0 1 620.371 26.37M2168.9 890.996a2205.482 2205.482 0 0 1 485.78 607.574 216.42 216.42 0 0 1 28.72 81.89c3.96 28.97 2.02 58.45-5.71 86.67a217.4 217.4 0 0 1-39.23 77.57 217.508 217.508 0 0 1-66.46 56.02 217.165 217.165 0 0 1-83.03 25.5c-29.1 2.82-58.46-.28-86.31-9.11a216.206 216.206 0 0 1-75.73-42.27 216.195 216.195 0 0 1-53.02-68.64c-155-284.24-384.04-521.08-662.87-685.43-48.03-29.835-82.46-77.309-95.92-132.282-13.46-54.972-4.89-113.083 23.88-161.916 28.78-48.834 75.47-84.518 130.11-99.428 54.63-14.91 112.88-7.865 162.3 19.631a2226.39 2226.39 0 0 1 337.88 244.25' fill='%23F5F7FA'/%3E%3C/svg%3E");
    height: 191rem;
    width: 290.5rem;
}

.page-nav {
    --transition: 0.2s ease-in-out;
    --bg: var(--color-white);
    --color: var(--color-professor1);
    position: fixed;
    right: 0.8rem;
    top: 50%;
    transform: translateY(-50%);
    z-index: var(--z-layout);
}

.page-nav li {
    --bullet-width: 0.6rem;
    --bullet-height: var(--bullet-width);
    align-items: center;
    cursor: pointer;
    display: flex;
    justify-content: center;
    padding: 0.8rem;
    position: relative;
}

.page-nav li,
.page-nav li:after {
    transition: all var(--transition);
}

.page-nav li:after {
    background: var(--bg);
    border-radius: 9in;
    content: "";
    display: block;
    height: var(--bullet-height);
    width: var(--bullet-width);
}

.page-nav li span {
    align-items: center;
    background: var(--bg);
    border-radius: 0.6rem;
    color: var(--color);
    display: flex;
    font-size: 1.4rem;
    font-weight: 600;
    height: 2.7rem;
    justify-content: center;
    left: 0;
    line-height: 1;
    opacity: 0;
    padding: 0 0.8rem;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translate(-100%, -50%);
    transition: opacity var(--transition), color var(--transition), background-color var(--transition);
}

.page-nav li span.guia {
    height: 3.7rem;
}

.page-nav li.active {
    --bullet-height: 2.5rem;
}

.page-nav li.active span,
.page-nav li:hover span {
    opacity: 1;
    pointer-events: all;
}

.page-nav[data-variant="dark"] {
    --bg: var(--color-professor1);
    --color: var(--color-white);
}

.sequencia {
    display: flex;
    flex-direction: column;
    gap: 4rem;
}

.sequencia__label {
    margin: 0 auto;
    overflow-x: hidden;
    width: 29rem;
}

.sequencia__label,
.sequencia__label>div {
    align-items: center;
    border-radius: 9in;
    display: flex;
    height: 7.6rem;
    justify-content: center;
}

.sequencia__label>div {
    background: var(--brand);
    color: #fff;
    padding: 0 3.3rem;
    position: relative;
}

.sequencia__label>div:after,
.sequencia__label>div:before {
    content: "";
    display: block;
    inset: 0 -100vw;
    position: absolute;
    z-index: -1;
}

.sequencia__label>div:before {
    background: var(--brand-light);
    right: 50%;
}

.sequencia__label>div:after {
    background: #f5f7fa;
    left: 50%;
}

.sequencia[data-step="1"] .sequencia__label {
    justify-content: start;
}

.sequencia[data-step="3"] .sequencia__label {
    justify-content: end;
}

.sequencia__block {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.sequencia__block .media img {
    border-radius: 1.6rem;
}

.sequencia__block .media .video,
.sequencia__block .media .video iframe {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.sequencia__block .content {
    display: flex;
    flex-direction: column;
    gap: 1.4rem;
}

@media (min-width: 768px) {
    .sequencia {
        --container-width: min(100%, 108.2rem);
        gap: 7rem;
    }
    .sequencia__label {
        width: 49rem;
    }
    .sequencia__block {
        --media-width: 40vw;
        --content-width: 43.7rem;
        --offset-width: 0;
        display: grid;
        gap: 0;
        grid-template-columns: var(--media-width) minmax(2rem, 7rem) var(--content-width) var(--offset-width);
        place-content: center;
    }
    .sequencia__block .media {
        grid-column: 1;
        grid-row: 1;
    }
    .sequencia__block .media img {
        border-radius: 2.2rem;
    }
    .sequencia__block .content {
        grid-column: 3;
        grid-row: 1;
        padding-top: 4.3rem;
    }
    .sequencia__block:nth-child(odd) {
        grid-template-columns: var(--content-width) minmax(2rem, 7rem) var(--media-width) var(--offset-width);
    }
    .sequencia__block:nth-child(odd) .media {
        grid-column: 3;
    }
    .sequencia__block:nth-child(odd) .content {
        grid-column: 1;
    }
}

@media (min-width: 960px) {
    .sequencia__block {
        --media-width: 50.6rem;
        --content-width: 43.7rem;
        --offset-width: minmax(0, 6.9rem);
    }
}

.demos {
    --gap: 0.82rem;
    overflow-y: hidden;
}

.demos[data-variant="hibrid"] {
    --media-width: 14.3rem;
    --media-height: 17.6rem;
}

.demos[data-variant="digital"] {
    --media-width: 24.6rem;
    --media-height: 17.6rem;
}

.seq-demos[data-variant="digital"] {
    --media-width: 17.6rem;
    --media-height: 12.6rem;
}

.demos .scroll-wrap {
    margin-bottom: -2rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
}

.demos .scroller {
    display: flex;
    gap: var(--gap);
    height: calc(100% + 2rem);
    padding-bottom: 10rem;
    padding-left: 2rem;
}

.seq-demos .scroller {
    padding-bottom: 13rem;
}

.demos .demo {
    flex: 0 0 var(--media-width);
    position: relative;
}

.demos .demo:before {
    content: "";
    left: -2rem;
    position: absolute;
    scroll-snap-align: start;
}

.demos .demo:last-child {
    flex: 0 0 calc(var(--media-width) + 2rem);
    padding-right: 2rem;
}

.demos .demo img {
    border-radius: 1.2rem;
    box-shadow: 0 20px 40px -20px rgba(0, 0, 0, 0.25);
    position: relative;
    z-index: 2;
}

.seq-demos .demo img {
    box-shadow: 8px 20px 40px -26px rgba(0, 0, 0, 0.25);
}

.demos .demo a,
.demos .demo button {
    background: none;
    border: 0;
    cursor: pointer;
    display: block;
    padding: 0;
}

.demos .demo .dropdown {
    background: #fff8;
    border: 2px solid rgba(0, 0, 0, 0.05);
    border-radius: 0 0 1.1rem 1.1rem;
    border-top: 0;
    inset: 100% 0.7rem auto;
    padding: 0.5rem;
    position: absolute;
    transform: translateY(-100%);
    transition: transform 0.2s ease-in-out;
    z-index: 1;
}

.seq-demos .demo .dropdown {
    inset: 100% 1.3rem auto;
}

.seq-demos .demo:last-child .dropdown {
    top: 100%;
    bottom: auto;
    left: 1.2rem;
    right: 3rem;
}

.demos .demo .dropdown li {
    padding: 0.7rem 0.2rem;
}

.demos .demo .dropdown li+li {
    border-top: 2px solid rgba(30, 19, 72, 0.05);
}

.demos .demo .dropdown a {
    align-items: center;
    color: var(--color-professor1);
    display: flex;
    font-size: 1.4rem;
    font-weight: 700;
    justify-content: space-between;
    line-height: 1.6rem;
}

.seq-demos .demo .dropdown a {
    text-align: left;
}

.seq-demos .demo .dropdown span {
    font-size: 1.4rem;
}

.demos .demo .dropdown a:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12 21.6a9.6 9.6 0 1 0 0-19.199 9.6 9.6 0 0 0 0 19.2Zm4.448-10.448-3.6-3.6a1.2 1.2 0 0 0-1.697 1.697l1.552 1.551H8.399a1.2 1.2 0 1 0 0 2.4h4.304l-1.552 1.552a1.2 1.2 0 1 0 1.697 1.697l3.6-3.6a1.2 1.2 0 0 0 0-1.697Z' fill='%23FF604F'/%3E%3C/svg%3E");
    content: "";
    display: block;
    flex: 0 0 2.4rem;
    height: 2.4rem;
    width: 2.4rem;
}

.demos .demo .open .dropdown {
    transform: translateY(0);
}

@media (min-width: 768px) {
    .demos {
        --padding-inline: 2rem;
        padding-left: var(--padding-inline);
        padding-right: var(--padding-inline);
    }
    .demos .scroll-wrap {
        margin-bottom: 0;
        overflow-x: hidden;
        scroll-snap-type: none;
    }
    .demos .scroller {
        display: flex;
        gap: var(--gap);
        height: auto;
        padding-bottom: 0;
        padding-left: 2rem;
        padding-right: 2rem;
    }
    .demos .demo,
    .demos .demo:last-child {
        flex: 1 1 var(--media-width);
        padding-right: 0;
    }
    .seq-demos .demo .dropdown span {
        font-size: 1.8rem;
    }
    .seq-demos .demo:last-child .dropdown {
        inset: 100% 1.3rem auto;
    }
    .seq-demos[data-variant="digital"] {
        --media-width: 24.6rem;
        --media-height: 17.6rem;
    }
}

@media (min-width: 960px) {
    .demos {
        --gap: 2.2rem;
        --padding-inline: calc(50vw - 56.5rem);
    }
}

.cutom-checkbox {
    --transition: 0.15s ease-in-out;
}

.cutom-checkbox [type="checkbox"] {
    display: none;
}

.cutom-checkbox div {
    align-items: center;
    background-color: rgba(74, 173, 248, 0.3);
    border-radius: 0.6rem;
    display: flex;
    font-size: 1.4rem;
    gap: 1rem;
    height: 4rem;
    justify-content: center;
    line-height: 2.4rem;
    padding: 0 1rem 0 1.2rem;
    transition: background-color var(--transition);
    white-space: nowrap;
}

.cutom-checkbox div span {
    display: block;
    padding-top: 0.4rem;
}

.cutom-checkbox div svg {
    color: var(--color-blue);
    opacity: 0.3;
    transition: color var(--transition), opacity var(--transition);
}

.cutom-checkbox [type="checkbox"]:checked+div {
    background-color: #4aadf8;
    font-weight: 700;
}

.cutom-checkbox [type="checkbox"]:checked+div svg {
    color: #fff;
    opacity: 1;
}

.error-message,
.error-dades {
    color: red;
    font-size: 0.9em;
    display: none;
}

.home-hero-floor {
    color: var(--color-white);
    display: flex;
    flex-direction: column;
    gap: 1rem;
    isolation: isolate;
    justify-content: center;
    margin-bottom: 2.4rem;
    z-index: 5;
}

.home-hero-floor .content {
    display: grid;
    gap: 2.4rem;
    width: min(100%, 35rem);
}

.home-hero-floor .background {
    border-radius: 0;
    inset: 0;
    overflow: hidden;
}

.home-hero-floor[data-variant="text-landing-main"] .background img {
    object-position: right;
}

.home-hero-floor .scroll {
    bottom: 0;
    cursor: pointer;
    display: block;
    filter: drop-shadow(0 0 10px rgba(0, 0, 0, 0.15) #4444dd);
    left: 50%;
    position: absolute;
    transform: translate(-50%, 50%);
}

@media (min-width: 768px) {
    .home-hero-floor {
        --container-width: 114rem;
        margin: 0;
        padding-bottom: 4rem;
        padding-top: 8rem;
    }
    .home-hero-floor .content {
        width: min(100%, 79rem);
    }
    .home-hero-floor .scroll {
        bottom: 6.4rem;
    }
    .home-hero-floor[data-variant="text-landing-main"] .background img {
        object-position: top;
    }
}

.home-itineraris-floor {
    padding-top: 4rem;
    position: relative;
    z-index: 4;
    overflow: hidden;
}

.home-itineraris-floor .wrapper {
    height: 66.1rem;
    position: relative;
}

.home-itineraris-floor .content {
    left: 50%;
    margin-top: -0.7rem;
    position: absolute;
    text-align: center;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 30rem;
    z-index: 1;
}

.home-itineraris-floor .title {
    font-size: 4.8rem;
    font-weight: 700;
    line-height: 5.2rem;
    margin-bottom: 1.3rem;
}

.home-itineraris-floor .title b {
    display: block;
    font-size: 11rem;
    line-height: 10rem;
}

.home-itineraris-floor .circle svg {
    left: 50%;
    position: absolute;
    top: 0;
    transform: translateX(-50%);
}

@media (min-width: 768px) {
    .home-itineraris-floor {
        padding-top: 16rem;
    }
    .home-itineraris-floor .wrapper {
        height: 79rem;
    }
    .home-itineraris-floor .content {
        margin-top: -3rem;
        width: 36.1rem;
    }
    .home-itineraris-floor .title {
        font-size: 7rem;
        line-height: 7.2rem;
        margin-bottom: 1rem;
    }
    .home-itineraris-floor .title b {
        display: block;
        font-size: 17.8rem;
        line-height: 15.45rem;
    }
}

.home-tallers-floor {
    display: grid;
    gap: 8.9rem;
    padding-bottom: 2rem;
    padding-top: 1.4rem;
    position: relative;
    z-index: 10;
}

.home-tallers-floor:before {
    background: no-repeat 50% / contain;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='375' height='844' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M398.003 8.816c11.546.235 20.944 9.358 21.523 20.891l39.734 790.954c.668 13.294-10.531 24.132-23.796 23.028l-517.919-43.088c-12.278-1.022-21.323-11.925-20.06-24.18l77.937-756.034C-23.404 8.998-13.692.414-2.245.647l400.248 8.169Z' fill='%23F5F7FA'/%3E%3C/svg%3E");
    bottom: -6rem;
    content: "";
    display: block;
    height: 84.4rem;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    width: 37.5rem;
    z-index: -2;
}

.home-tallers-floor .content {
    --inline-padding: 0;
    display: grid;
    gap: 1rem;
    text-align: center;
}

.home-tallers-floor .content .h2 {
    --letter-spacing: 0;
}

.home-tallers-floor .content p {
    padding: 0 2rem;
}

.home-tallers-floor .tallers {
    align-content: center;
    display: grid;
    gap: 5.3rem;
    justify-content: center;
}

@media (min-width: 926px) {
    .home-tallers-floor {
        gap: 6.3rem;
        padding-top: 23.8rem;
    }
    .home-tallers-floor .content {
        --container-width: 89.8rem;
        display: grid;
        gap: 2.3rem;
        text-align: center;
    }
    .home-tallers-floor .content p {
        margin: 0 auto;
        max-width: 66.7rem;
        padding: 0;
    }
    .home-tallers-floor:before {
        background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='822' height='774' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M793.383 1.037c15.475-4.223 30.122 9.003 27.495 24.828L699.821 754.998c-1.876 11.301-12.111 19.271-23.527 18.321l-564.216-46.94a22 22 0 0 1-19.767-17.704L.42 238.562c-2.21-11.31 4.682-22.41 15.8-25.444L793.383 1.038Z' fill='%23F5F7FA'/%3E%3C/svg%3E");
        bottom: -12rem;
        height: 77.4rem;
        width: 82.2rem;
    }
    .home-tallers-floor .tallers {
        --container-width: 88.6rem;
        gap: 2.3rem;
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (min-width: 1151px) {
    .home-tallers-floor .tallers {
        --container-width: 111.1rem;
    }
}

.taller {
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.05);
    border-radius: 2.2rem;
    box-shadow: 0 2rem 30px rgba(0, 0, 0, 0.08);
    padding: 3.6rem 1rem;
    position: relative;
    text-align: center;
    width: 28rem;
}

.taller .title {
    color: var(--color);
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 2.4rem;
    margin-bottom: 0.7rem;
}

.taller p {
    font-size: 1.6rem;
    font-weight: 600;
    line-height: 2.4rem;
}

.taller:before {
    background: 50%/100% 100%;
    background-image: var(--shape);
    content: "";
    display: block;
    inset: var(--offset, -3rem);
    position: absolute;
    z-index: -1;
}

.taller[data-variant="red"] {
    --color: var(--color-red);
    --shape: url("data:image/svg+xml;charset=utf-8,%3Csvg width='340' height='211' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M217.751 11.724a22.001 22.001 0 0 1 20.725 18.587l15.057 96.564c1.93 12.379-6.852 23.868-19.303 25.254L42.533 173.48c-12.21 1.36-23.167-7.543-24.335-19.772L6.102 27.093C4.829 13.77 15.647 2.408 29.015 3.023l188.736 8.701Z' fill='%23FF604F'/%3E%3C/svg%3E");
}

.taller[data-variant="orange"] {
    --color: var(--color-orange);
    --shape: url("data:image/svg+xml;charset=utf-8,%3Csvg width='340' height='211' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath d='M273.453 72.05c11.198 1.178 19.699 10.62 19.699 21.88v78.212c0 11.691-9.143 21.339-20.817 21.968L73.556 204.817c-12.799.689-23.475-9.666-23.177-22.48l2.547-109.56c.299-12.853 11.509-22.712 24.295-21.367l196.232 20.64Z' fill='%23F29045'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h340v211H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}

.taller[data-variant="blue"] {
    --color: var(--color-blue);
    --shape: url("data:image/svg+xml;charset=utf-8,%3Csvg width='340' height='211' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M307.978 46.75c14.134-2.05 26.444 9.7 25.054 23.914l-11.765 120.252c-1.152 11.774-11.409 20.529-23.218 19.818l-194.778-11.729c-10.557-.636-19.167-8.693-20.502-19.185l-9.81-77.139c-1.515-11.904 6.79-22.826 18.665-24.548L307.978 46.75Z' fill='%234AADF8'/%3E%3C/svg%3E");
}

@media (min-width: 1151px) {
    .taller {
        --offset: -5rem;
        padding: 7.3rem 1rem 5.9rem;
        width: 35.5rem;
    }
    .taller .title {
        font-size: 2.6rem;
        line-height: 3.2rem;
        margin-bottom: 1.1rem;
    }
    .taller p {
        font-size: 1.8rem;
        font-weight: 600;
        line-height: 2.4rem;
        margin-top: 0.5rem;
    }
}

.home-features-floor {
    --height: 300vh;
    --slide1-color: var(--color-yellow);
    --slide2-color: var(--color-blue);
    --slide3-color: var(--color-green);
    --slide4-color: var(--color-red);
    --slide-transition: 0.3s ease-in-out;
    height: var(--height);
    position: relative;
    z-index: 3;
}

.home-features-floor .parallax-element {
    z-index: -1;
}

.home-features-floor .pin-space {
    height: var(--height);
    position: relative;
}

.home-features-floor .pin-element {
    display: flex;
    left: 0;
    min-height: 100vh;
    place-content: center;
    position: absolute;
}

.home-features-floor .pin-element>div {
    background: var(--bg-section);
    border-bottom-right-radius: 10rem;
    display: grid;
    grid-template-rows: min-content min-content min-content auto;
    height: 100vh;
    inset: 0;
    isolation: isolate;
    padding-top: 8rem;
    width: 100vw;
    z-index: 1;
}

.home-features-floor .pin-element .content {
    display: grid;
}

[data-view="home"] .home-features-floor .pin-element:before {
    background: var(--bg-section-alt);
    content: "";
    display: block;
    inset: 0;
    position: absolute;
    z-index: -10;
}

.home-features-floor .pin-space[data-pinned="top"] .pin-element {
    position: absolute;
    top: 0;
}

.home-features-floor .pin-space[data-pinned="center"] .pin-element {
    position: fixed;
    top: 0;
}

.home-features-floor .pin-space[data-pinned="bottom"] .pin-element {
    bottom: 0;
    position: absolute;
}

.home-features-floor .nums {
    display: grid;
    font-size: 8.6rem;
    font-weight: 700;
    gap: 1.5rem;
    line-height: 1;
    margin-bottom: 3rem;
    padding: 0 2rem;
    position: relative;
    width: 20rem;
}

.home-features-floor .nums svg {
    bottom: 0;
    position: absolute;
    right: 0;
}

.home-features-floor .num {
    color: var(--color-white);
    grid-column: 1;
    grid-row: 1;
    padding: 10rem 7rem 6rem 6rem;
    position: relative;
    z-index: 1;
}

.home-features-floor .slides {
    display: grid;
    position: relative;
}

.home-features-floor .slide {
    display: flex;
    flex: 0 0 100vw;
    flex-direction: column;
    gap: 1.5rem;
    grid-column: 1;
    grid-row: 1;
    padding: 0 2rem;
}

.home-features-floor .bullets {
    align-items: center;
    bottom: 1rem;
    display: flex;
    gap: 2rem;
    justify-content: center;
    margin-top: 2.4rem;
    padding: 2rem;
}

.home-features-floor .bullets li {
    --size: 1.8rem;
    border-radius: 9in;
    height: var(--size);
    width: var(--size);
}

.home-features-floor .bullets li:first-child {
    background: var(--slide1-color);
}

.home-features-floor .bullets li:nth-child(2) {
    background: var(--slide2-color);
}

.home-features-floor .bullets li:nth-child(3) {
    background: var(--slide3-color);
}

.home-features-floor .bullets li:nth-child(4) {
    background: var(--slide4-color);
}

.home-features-floor .num,
.home-features-floor .slide {
    opacity: 0;
    transition: opacity var(--slide-transition);
}

.home-features-floor .bullets li {
    transition: width var(--slide-transition);
}

.home-features-floor .nums {
    transition: color var(--slide-transition);
}

.home-features-floor[data-slide="1"] .num:first-child,
.home-features-floor[data-slide="1"] .slide:first-child {
    opacity: 1;
}

.home-features-floor[data-slide="1"] .bullets li:first-child {
    width: 8rem;
}

.home-features-floor[data-slide="1"] .nums {
    color: var(--slide1-color);
}

.home-features-floor[data-slide="2"] .num:nth-child(2),
.home-features-floor[data-slide="2"] .slide:nth-child(2) {
    opacity: 1;
}

.home-features-floor[data-slide="2"] .bullets li:nth-child(2) {
    width: 8rem;
}

.home-features-floor[data-slide="2"] .nums {
    color: var(--slide2-color);
}

.home-features-floor[data-slide="3"] .num:nth-child(3),
.home-features-floor[data-slide="3"] .slide:nth-child(3) {
    opacity: 1;
}

.home-features-floor[data-slide="3"] .bullets li:nth-child(3) {
    width: 8rem;
}

.home-features-floor[data-slide="3"] .nums {
    color: var(--slide3-color);
}

.home-features-floor[data-slide="4"] .num:nth-child(4),
.home-features-floor[data-slide="4"] .slide:nth-child(4) {
    opacity: 1;
}

.home-features-floor[data-slide="4"] .bullets li:nth-child(4) {
    width: 8rem;
}

.home-features-floor[data-slide="4"] .nums {
    color: var(--slide4-color);
}

.home-features-floor[data-variant="itineraris"] .nums svg {
    bottom: calc(50% - 11.5rem);
}

.home-features-floor[data-variant="tot-tallers"] .nums svg {
    bottom: calc(50% - 21rem);
    right: -22rem;
    transform: scale(0.6);
}

@media (min-width: 768px) {
    .home-features-floor .pin-element>div {
        --container-left-padding: clamp(2rem, 2vw, 17rem);
        --container-right-padding: clamp(2rem, 2vw, 17rem);
        --container-width: 103rem;
        border-bottom-right-radius: 30rem;
        grid-template-columns: 25rem auto;
        grid-template-rows: auto min-content min-content min-content min-content auto;
    }
    .home-features-floor .head {
        grid-column: 1 / span 2;
        grid-row: 1;
    }
    .home-features-floor .nums {
        align-self: center;
        font-size: 17.8rem;
        grid-column: 1;
        grid-row: 2 / span 3;
        margin-left: -10vw;
    }
    .home-features-floor .nums svg {
        bottom: -6rem;
        height: 97rem;
        right: -8rem;
        width: 136rem;
    }
    .home-features-floor .slides {
        grid-column: 2;
        grid-row: 3 / span 2;
        height: min-content;
    }
    .home-features-floor .bullets {
        grid-column: 2;
        grid-row: 2;
        height: min-content;
        justify-self: start;
        margin: 0;
    }
    .home-features-floor[data-variant="itineraris"] .nums {
        transform: translateX(10rem);
    }
    .home-features-floor[data-variant="itineraris"] .nums svg {
        bottom: calc(50% - 21rem);
    }
    .home-features-floor[data-variant="tot-tallers"] .nums {
        transform: translateX(3rem);
    }
    .home-features-floor[data-variant="tot-tallers"] .nums svg {
        bottom: calc(-50% - 10rem);
        position: absolute;
        right: -25rem;
        transform: scale(0.8);
    }
}

.home-features-floor[data-variant="index"] {
    --slide1-color: #5d4d9b;
    --slide2-color: #eb61a6;
    --slide3-color: #f29045;
    --slide4-color: #2cad6e;
}

.home-features-floor[data-variant="index"] .pin-element>div {
    background: #f5f7fa;
    border-radius: 0;
}

.home-features-floor[data-variant="index"] .slide {
    padding: 0;
}

.home-features-floor[data-variant="index"] .slide p {
    font-weight: 700;
}

.home-features-floor[data-variant="index"] .content {
    display: flex;
    flex-direction: column;
    width: calc(100vw - 4rem);
}

.home-features-floor[data-variant="index"] .nums {
    display: flex;
    height: 20rem;
    justify-content: center;
    margin-bottom: 6rem;
    padding: 10rem 0 0;
    text-align: center;
    width: calc(100vw - 4rem);
}

.home-features-floor[data-variant="index"] .nums .num {
    padding: 0;
    position: absolute;
}

.home-features-floor[data-variant="index"] .nums:before {
    background: currentColor;
    content: "";
    display: block;
    inset: -10rem 50% 8.1rem;
    position: absolute;
    transform: translate(-50%);
    width: 200vw;
}

.home-features-floor[data-variant="index"] .nums svg.xs {
    bottom: 0;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
}

@media (min-width: 768px) {
    .home-features-floor[data-variant="index"] {
        overflow: hidden;
    }
    .home-features-floor[data-variant="index"]:before {
        background: #fff;
        border-radius: 5rem 5rem 0 0;
        content: "";
        display: block;
        height: 5rem;
        inset: auto 0 0;
        position: absolute;
        z-index: 10;
    }
    .home-features-floor[data-variant="index"] .content {
        flex: 0 0 70%;
        justify-content: flex-start;
    }
    .home-features-floor[data-variant="index"] .container-fluid {
        --container-width: 112.6rem;
        align-items: center;
        display: flex;
        justify-content: center;
    }
    .home-features-floor[data-variant="index"] .nums {
        align-items: center;
        display: flex;
        height: 100%;
        justify-content: flex-end;
        margin-right: 5rem;
        padding: 2.5rem 6rem 0 0;
    }
    .home-features-floor[data-variant="index"] .nums:before {
        height: 200vh;
        inset: -50vh 0 0 0;
        transform: translate(calc(-50% - 10.8rem));
        width: 200%;
    }
    .home-features-floor[data-variant="index"] .nums svg.lg {
        height: auto;
        inset: 50% 0 auto auto;
        transform: translateY(-50%);
        width: auto;
    }
    .home-features-floor[data-variant="index"] .bullets {
        justify-content: flex-start;
        margin-bottom: 1rem;
        order: -1;
    }
}

.home-nivells-text-floor {
    background: #fff;
    display: grid;
    gap: 3rem;
    padding-bottom: 4.8rem;
    padding-top: 4.8rem;
    text-align: center;
    justify-items: center;
}

.home-nivells-text-floor .items {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
    position: relative;
}

.home-nivells-text-floor .item {
    align-items: center;
    background: #b2a4d2;
    border-radius: 9in;
    display: flex;
    flex-direction: column;
    height: 16rem;
    justify-content: center;
    padding: 0 2rem;
    gap: 0.3rem;
}

.home-nivells-text-floor .item .sub2 {
    color: #fff;
}

.home-nivells-text-floor .item .lead {
    padding: 0 2rem;
}

.home-nivells-text-floor .intro {
    display: grid;
    gap: 1rem;
}

.home-nivells-text-floor .intro .title {
    font-size: 4.8rem;
    font-weight: 700;
    line-height: 5.2rem;
    margin: 0 -0.5rem;
}

.home-nivells-text-floor .intro .lead {
    --font-weight: 400;
}

.home-nivells-text-floor .parallax1 {
    left: -4rem;
    top: -3rem;
}

.home-nivells-text-floor .parallax1>div {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='229' height='97' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect y='11' width='229' height='86' rx='43' fill='%235D4D9B'/%3E%3Ccircle cx='59' cy='11' r='11' fill='%23FDB71A'/%3E%3C/svg%3E");
    height: 9.7rem;
    width: 22.9rem;
}

.home-nivells-text-floor .parallax2>div,
.home-nivells-text-floor .parallax3>div,
.home-nivells-text-floor .parallax4>div {
    height: 2.2rem;
    width: 2.2rem;
}

.home-nivells-text-floor .parallax2 {
    right: -1rem;
    top: 50%;
    z-index: 2;
}

.home-nivells-text-floor .parallax2>div {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='22' height='22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='11' cy='11' r='11' fill='%23FF604F'/%3E%3C/svg%3E");
}

.home-nivells-text-floor .parallax3 {
    right: -3rem;
    top: calc(50% + 9rem);
}

.home-nivells-text-floor .parallax3>div {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='22' height='22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='11' cy='11' r='11' fill='%23F29045'/%3E%3C/svg%3E");
}

.home-nivells-text-floor .parallax4 {
    bottom: -1rem;
    left: -3rem;
}

.home-nivells-text-floor .parallax4>div {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='22' height='22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='11' cy='11' r='11' fill='%23789FED'/%3E%3C/svg%3E");
}

@media (min-width: 960px) {
    .home-nivells-text-floor .items {
        flex-direction: row;
    }
    .home-nivells-text-floor .item {
        max-width: 38rem;
    }
}

@media (min-width: 768px) {
    .home-nivells-text-floor {
        padding-top: 7.4rem;
        padding-bottom: 6rem;
        gap: 8rem;
    }
    .home-nivells-text-floor .intro {
        gap: 2rem;
    }
    .home-nivells-text-floor .items {
        gap: 3.1rem;
    }
    .home-nivells-text-floor .item {
        height: 17.1rem;
    }
    .home-nivells-text-floor .item .sub2 {
        font-size: 5rem;
        line-height: 5.2rem;
    }
    .home-nivells-text-floor .item .lead {
        font-size: 1.8rem;
    }
    .home-nivells-text-floor .parallax1 {
        left: -16rem;
        top: -4.5rem;
    }
    .home-nivells-text-floor .parallax1>div {
        background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='569' height='125' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='569' height='108' rx='54' fill='%235D4D9B'/%3E%3Ccircle cx='77.5' cy='107.5' r='17.5' fill='%23FDB71A'/%3E%3C/svg%3E");
        height: 12.5rem;
        width: 56.9rem;
    }
    .home-nivells-text-floor .parallax5 {
        right: -15rem;
        top: calc(50% - 3.5rem);
    }
    .home-nivells-text-floor .parallax5>div {
        background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='569' height='141' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect y='16' width='569' height='108' rx='54' fill='%23F5F7FA'/%3E%3Ccircle cx='417.5' cy='123.5' r='17.5' fill='%23F29045'/%3E%3Ccircle cx='499.5' cy='17.5' r='17.5' fill='%23FF604F'/%3E%3C/svg%3E");
        height: 14.1rem;
        width: 56.9rem;
    }
    .home-nivells-text-floor .parallax6 {
        bottom: -5rem;
        left: -65rem;
    }
    .home-nivells-text-floor .parallax6>div {
        background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='583' height='108' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='569' height='108' rx='54' fill='%23F5F7FA'/%3E%3Ccircle cx='565.5' cy='53.5' r='17.5' fill='%23789FED'/%3E%3C/svg%3E");
        height: 10.8rem;
        width: 58.3rem;
    }
}

.home-projects-floor {
    background: var(--bg-section-alt);
    display: grid;
    gap: 3rem;
    padding-bottom: 8.6rem;
    padding-top: 7.5rem;
}

.home-projects-floor .cards {
    display: flex;
    flex-direction: column;
    gap: 1.6rem;
}

@media (min-width: 768px) {
    .home-projects-floor {
        --container-inline-padding: 4rem;
        gap: 9rem;
        padding-bottom: 15rem;
        padding-top: 12rem;
        position: relative;
    }
    .home-projects-floor .cards {
        flex-direction: row;
        gap: 2.6rem;
    }
    .home-projects-floor .card:first-child {
        margin-bottom: 11rem;
    }
    .home-projects-floor .card:last-child {
        margin-top: 11rem;
    }
    .home-projects-floor:before {
        --offset: 40rem;
    }
    .home-projects-floor .cards {
        isolation: isolate;
    }
    .home-projects-floor .cards .parallax-element {
        bottom: -3rem;
        content: "";
        display: block;
        height: 86.9rem;
        left: 50%;
        margin-left: -23rem;
        position: absolute;
        width: 141.5rem;
    }
    .home-projects-floor .cards .parallax-element>div {
        background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='1415' height='869' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M419.263 253.463A2205.358 2205.358 0 0 1 1156.13 3.943a216.498 216.498 0 0 1 86.78.924 217.1 217.1 0 0 1 79.53 34.932 217.59 217.59 0 0 1 59.53 63.342 217.776 217.776 0 0 1 29.99 81.598 217.32 217.32 0 0 1-4.36 86.772 216.598 216.598 0 0 1-38.01 78.036 216.133 216.133 0 0 1-65.57 56.79 216.118 216.118 0 0 1-82.61 26.44c-320.08 48.785-620.855 183.359-870.473 389.471-44.433 34.99-100.806 51.166-157.074 45.072-56.268-6.093-107.97-33.974-144.058-77.684-36.089-43.71-53.703-99.784-49.08-156.242C5.35 576.936 31.844 524.572 74.55 487.489A2226.429 2226.429 0 0 1 419.422 253.11' fill='%234AADF8'/%3E%3C/svg%3E");
        inset: 0;
        position: absolute;
    }
    .home-projects-floor[data-variant="tot-tallers"] .cards {
        isolation: isolate;
    }
    .home-projects-floor[data-variant="tot-tallers"] .cards .parallax-element {
        bottom: -3rem;
        content: "";
        height: 65.4rem;
        left: 50%;
        margin-left: -23rem;
        width: 78.5rem;
    }
    .home-projects-floor[data-variant="tot-tallers"] .cards .parallax-element>div {
        background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='785' height='654' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M69.487 178.042a42.49 42.49 0 0 1 32.15-34.593L700.065 1.599c25.592-6.066 50.493 12.34 52.2 38.586l32.09 493.165c1.478 22.722-15.217 42.571-37.857 45.006l-699.16 75.193C19.472 656.545-3.61 632.219.843 604.551l68.643-426.509Z' fill='%23FF604F'/%3E%3C/svg%3E");
    }
    .home-projects-floor[data-variant="text-landing-main"] .cards {
        isolation: isolate;
    }
    .home-projects-floor[data-variant="text-landing-main"] .cards .parallax-element {
        bottom: 5rem;
        content: "";
        height: 98.8rem;
        left: 90%;
        margin-left: -23rem;
        width: 138.9rem;
    }
    .home-projects-floor[data-variant="text-landing-main"] .cards .parallax-element>div {
        background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='1391' height='990' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M30.25 878.939c-60.89-105.463-24.755-240.318 80.708-301.208L1059.22 30.249c105.47-60.889 240.32-24.754 301.21 80.709 60.89 105.463 24.76 240.318-80.71 301.207L331.457 959.647C225.994 1020.54 91.139 984.402 30.25 878.939Z' fill='%235D4D9B'/%3E%3C/svg%3E");
    }
    .home-projects-floor[data-variant="text-landing-main"] .card:first-child {
        margin-bottom: 0;
    }
    .home-projects-floor[data-variant="text-landing-main"] .card:last-child {
        margin-top: 0;
    }
}

.home-sequencies-floor {
    background: var(--bg-section-alt);
    display: grid;
    gap: 2.5rem;
    border-radius: 0 0 30rem 0;
    padding-bottom: 4.4rem;
    text-align: center;
}

.home-sequencies-floor:before {
    background: var(--bg-section-alt);
    border-radius: 0 0 10rem 0;
    content: "";
    display: block;
    inset: 0;
    position: absolute;
    z-index: -1;
}

.home-sequencies-floor .intro {
    display: grid;
    gap: 1rem;
}

.home-sequencies-floor .intro .title {
    font-size: 4.8rem;
    font-weight: 700;
    line-height: 5.2rem;
    margin: 0 -0.5rem;
}

.home-sequencies-floor .intro .subtitle {
    color: var(--color-lectoescriptura1);
    font-size: 3rem;
    font-weight: 400;
}

.home-sequencies-floor .intro .lead {
    --font-weight: 400;
}

.home-sequencies-floor .items {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.2rem;
    position: relative;
}

.home-sequencies-floor .item {
    align-items: center;
    background: var(--color-red);
    border-radius: 9in;
    display: flex;
    flex-direction: column;
    height: 16rem;
    justify-content: center;
    max-width: 95.6rem;
    gap: 0.3rem;
    padding: 0 2rem;
}

.home-sequencies-floor .item .sub2 {
    color: #fff;
}

.home-sequencies-floor .item .lead {
    padding: 0 2rem;
}

.home-sequencies-floor .parallax1 {
    left: -4rem;
    top: -3rem;
}

.home-sequencies-floor .parallax1>div {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='229' height='97' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect y='11' width='229' height='86' rx='43' fill='%235D4D9B'/%3E%3Ccircle cx='59' cy='11' r='11' fill='%23FDB71A'/%3E%3C/svg%3E");
    height: 9.7rem;
    width: 22.9rem;
}

.home-sequencies-floor .parallax2>div,
.home-sequencies-floor .parallax3>div,
.home-sequencies-floor .parallax4>div {
    height: 2.2rem;
    width: 2.2rem;
}

.home-sequencies-floor .parallax2 {
    right: -1rem;
    top: 50%;
    z-index: 2;
}

.home-sequencies-floor .parallax2>div {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='22' height='22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='11' cy='11' r='11' fill='%23FF604F'/%3E%3C/svg%3E");
}

.home-sequencies-floor .parallax3 {
    right: -3rem;
    top: calc(50% + 9rem);
}

.home-sequencies-floor .parallax3>div {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='22' height='22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='11' cy='11' r='11' fill='%23F29045'/%3E%3C/svg%3E");
}

.home-sequencies-floor .parallax4 {
    bottom: -1rem;
    left: -3rem;
}

.home-sequencies-floor .parallax4>div {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='22' height='22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='11' cy='11' r='11' fill='%23789FED'/%3E%3C/svg%3E");
}

@media (min-width: 960px) {
    .home-sequencies-floor .item .lead {
        padding: 0 23rem;
    }
}

@media (min-width: 768px) {
    .home-sequencies-floor {
        --container-width: 95rem;
        gap: 8.6rem;
        padding-bottom: 13.6rem;
        padding-top: 9.7rem;
    }
    .home-sequencies-floor:before {
        border-radius: 0 0 30rem 0;
    }
    .home-sequencies-floor .intro {
        gap: 2rem;
    }
    .home-sequencies-floor .items {
        gap: 3.1rem;
    }
    .home-sequencies-floor .item {
        height: 17.1rem;
        max-width: 75.6rem;
        padding: 0 2rem;
    }
    .home-sequencies-floor .item .sub2 {
        font-size: 7rem;
        line-height: 7.2rem;
    }
    .home-sequencies-floor .parallax1 {
        left: -16rem;
        top: -4.5rem;
    }
    .home-sequencies-floor .parallax1>div {
        background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='569' height='125' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='569' height='108' rx='54' fill='%235D4D9B'/%3E%3Ccircle cx='77.5' cy='107.5' r='17.5' fill='%23FDB71A'/%3E%3C/svg%3E");
        height: 12.5rem;
        width: 56.9rem;
    }
    .home-sequencies-floor .parallax5 {
        right: -15rem;
        top: calc(50% - 3.5rem);
    }
    .home-sequencies-floor .parallax5>div {
        background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='569' height='141' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect y='16' width='569' height='108' rx='54' fill='%23F5F7FA'/%3E%3Ccircle cx='417.5' cy='123.5' r='17.5' fill='%23F29045'/%3E%3Ccircle cx='499.5' cy='17.5' r='17.5' fill='%23FF604F'/%3E%3C/svg%3E");
        height: 14.1rem;
        width: 56.9rem;
    }
    .home-sequencies-floor .parallax6 {
        bottom: -5rem;
        left: -65rem;
    }
    .home-sequencies-floor .parallax6>div {
        background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='583' height='108' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='569' height='108' rx='54' fill='%23F5F7FA'/%3E%3Ccircle cx='565.5' cy='53.5' r='17.5' fill='%23789FED'/%3E%3C/svg%3E");
        height: 10.8rem;
        width: 58.3rem;
    }
}

.home-subjects-interest-floor {
    background: #f5f7fa;
    padding-bottom: 6rem;
    padding-top: 2rem;
    z-index: 0;
}

.home-subjects-interest-floor .subjects {
    display: flex;
    flex-wrap: wrap;
    gap: 4rem;
    justify-content: center;
}

.home-subjects-interest-floor .subject img {
    border-radius: 1.2rem;
    box-shadow: 0 20px 40px -20px rgba(0, 0, 0, 0.25);
    position: relative;
    z-index: 1;
}

.home-subjects-interest-floor .subject .content {
    align-items: center;
    background: #fff;
    border-radius: 0 0 1.2rem 1.2rem;
    box-shadow: 0 10px 32px -10px rgba(0, 0, 0, 0.15);
    color: #000;
    display: flex;
    justify-content: center;
    margin: 0 1.3rem;
    padding: 1.6rem 1rem 1.2rem;
    text-align: center;
}

.home-subjects-interest-floor .subject,
.home-subjects-interest-floor .subject:hover {
    text-decoration: none;
}

@media (min-width: 768px) {
    .home-subjects-interest-floor {
        --container-width: min(100%, 134rem);
        padding-bottom: 10rem;
        padding-top: 7rem;
    }
    .home-subjects-interest-floor .subject img {
        aspect-ratio: 1/1;
    }
    .home-subjects-interest-floor .subject .content {
        min-height: 9.4rem;
    }
    .home-subjects-interest-floor .parallax-element {
        bottom: -3rem;
        content: "";
        display: block;
        height: 86.9rem;
        left: 50%;
        margin-left: -23rem;
        position: absolute;
        width: 141.5rem;
    }
    .home-subjects-interest-floor .parallax-element>div {
        background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='1415' height='869' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M419.263 253.463A2205.358 2205.358 0 0 1 1156.13 3.943a216.498 216.498 0 0 1 86.78.924 217.1 217.1 0 0 1 79.53 34.932 217.59 217.59 0 0 1 59.53 63.342 217.776 217.776 0 0 1 29.99 81.598 217.32 217.32 0 0 1-4.36 86.772 216.598 216.598 0 0 1-38.01 78.036 216.133 216.133 0 0 1-65.57 56.79 216.118 216.118 0 0 1-82.61 26.44c-320.08 48.785-620.855 183.359-870.473 389.471-44.433 34.99-100.806 51.166-157.074 45.072-56.268-6.093-107.97-33.974-144.058-77.684-36.089-43.71-53.703-99.784-49.08-156.242C5.35 576.936 31.844 524.572 74.55 487.489A2226.429 2226.429 0 0 1 419.422 253.11' fill='%23fff'/%3E%3C/svg%3E");
        inset: 0;
        position: absolute;
    }
}

.page-hero-floor {
    color: var(--color-professor1);
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-bottom: 5.6rem;
    padding-top: 39rem;
    position: relative;
    overflow-x: hidden;
}

.page-hero-floor .media {
    height: 54rem;
    inset: 0 0 auto;
}

.page-hero-floor .media img {
    height: 54rem;
    left: 50%;
    max-width: none;
    object-fit: fill;
    object-position: top center;
    transform: translateX(-50%);
    width: 54rem;
}

.page-hero-floor .content {
    max-width: 80vw;
}

.page-hero-floor .h1,
.page-hero-floor .sub2 {
    margin-top: 1.2rem;
}

.page-hero-floor[data-variant="text-landing-main"] .media {
    height: 54rem;
    inset: 0 0 auto;
}

.page-hero-floor[data-variant="text-landing-main"] .media img {
    height: 44rem;
    left: 50%;
    object-fit: fill;
    object-position: top center;
    transform: translateX(-50%);
    width: 82.3rem;
}

@media (min-width: 768px) {
    .page-hero-floor {
        --container-width: 113.8rem;
        min-height: 70.6rem;
        padding-bottom: 5.6rem;
        padding-top: 18rem;
    }
    .page-hero-floor .media {
        height: 70.6rem;
    }
    .page-hero-floor .media img {
        height: 70.6rem;
        width: 144rem;
    }
    .page-hero-floor .content {
        max-width: 80vw;
        width: min(100%, 46.6rem);
    }
    .page-hero-floor .h1 {
        margin-top: 2.9rem;
    }
    .page-hero-floor .sub2 {
        margin-top: 2.8rem;
    }
}

.page-metodologia-floor {
    --item-width: 34rem;
    --item-gap: calc(47.4rem - var(--item-width));
    --item-offset: calc(100vw - var(--item-width));
    --media-width: 202rem;
    --media-height: 41rem;
    --slider-transition: 1s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    display: grid;
    grid-auto-rows: minmax(min-content, max-content);
    overflow: hidden;
}

.page-metodologia-floor .slider {
    display: flex;
    flex-direction: column;
    height: 78rem;
    padding-bottom: 3.6rem;
    padding-top: 3.6rem;
    position: relative;
}

.page-metodologia-floor .scroll-wrap {
    width: 100vw;
}

.page-metodologia-floor .scroller {
    display: flex;
    gap: var(--item-gap);
    height: calc(100% + 2rem);
    padding-bottom: 2rem;
    padding-left: calc(var(--item-offset) / 2);
    padding-right: calc(var(--item-offset) / 2);
    padding-top: calc(var(--media-height) + 5rem);
    position: relative;
    scroll-snap-type: x mandatory;
}

.page-metodologia-floor .carousel {
    height: var(--media-height);
    inset: 0 0 auto;
    overflow: hidden;
    position: absolute;
    width: calc(var(--item-width) * 3 + var(--item-gap) * 2 + var(--item-offset));
}

.page-metodologia-floor .carousel .media {
    bottom: 0;
    height: var(--media-height);
    left: 50%;
    position: absolute;
    top: 0;
    transform: translateX(-50%);
    width: var(--media-width);
}

.page-metodologia-floor .slide {
    align-items: center;
    display: grid;
    flex: 0 0 var(--item-width);
    gap: 0.6rem;
    grid-auto-rows: minmax(min-content, max-content);
    scroll-snap-align: center;
    text-align: center;
    width: min(100%, 33.5rem);
}

.page-metodologia-floor .nav {
    display: flex;
    gap: 3rem;
    justify-content: center;
}

@media (min-width: 768px) {
    .page-metodologia-floor {
        --media-width: 164.2rem;
        --media-height: 62rem;
    }
    .page-metodologia-floor [data-ref-group="badges"] {
        cursor: pointer;
    }
    .page-metodologia-floor .slider {
        height: auto;
        padding-top: 0;
        position: relative;
    }
    .page-metodologia-floor .carousel {
        width: 100%;
    }
    .page-metodologia-floor .scroller {
        display: grid;
        height: var(--media-height);
        justify-content: center;
        overflow: hidden;
        padding: 40rem 0 0;
    }
    .page-metodologia-floor .slide {
        grid-column: 1;
        grid-row: 1;
        opacity: 0;
        transition: opacity var(--slider-transition);
        width: 48.8rem;
    }
    .page-metodologia-floor .slide1-badge,
    .page-metodologia-floor .slide2-badge,
    .page-metodologia-floor .slide3-badge {
        transform: translate(var(--translate, 0, 0)) scale(0.62);
        transition: transform var(--slider-transition);
    }
    .page-metodologia-floor .circle {
        stroke-dasharray: 0, 2000;
        stroke-dashoffset: -240;
        transition: all var(--slider-transition);
    }
    .page-metodologia-floor .slide1-badge {
        --translate: 13.7rem, 14.5rem;
    }
    .page-metodologia-floor .slide2-badge {
        --translate: 31.15rem, 10.25rem;
    }
    .page-metodologia-floor .slide3-badge {
        --translate: 48rem, 14.5rem;
    }
    .page-metodologia-floor .slider[data-slide="1"] .slide:first-child {
        opacity: 1;
    }
    .page-metodologia-floor .slider[data-slide="1"] .slide1-badge {
        transform: none;
    }
    .page-metodologia-floor .slider[data-slide="1"] .slide1-badge .circle {
        stroke-dasharray: 120, 2000;
        stroke-dashoffset: -705;
    }
    .page-metodologia-floor .slider[data-slide="2"] .slide:nth-child(2) {
        opacity: 1;
    }
    .page-metodologia-floor .slider[data-slide="2"] .slide2-badge {
        transform: none;
    }
    .page-metodologia-floor .slider[data-slide="2"] .slide2-badge .circle {
        stroke-dasharray: 120, 2000;
        stroke-dashoffset: -557;
    }
    .page-metodologia-floor .slider[data-slide="3"] .slide:nth-child(3) {
        opacity: 1;
    }
    .page-metodologia-floor .slider[data-slide="3"] .slide3-badge {
        transform: none;
    }
    .page-metodologia-floor .slider[data-slide="3"] .slide3-badge .circle {
        stroke-dasharray: 120, 2000;
        stroke-dashoffset: -660;
    }
    .page-metodologia-floor .nav {
        bottom: 15rem;
        display: flex;
        gap: 3rem;
        gap: 59.4rem;
        justify-content: center;
        left: 50%;
        position: absolute;
        transform: translateX(-50%);
    }
}

.page-tallers-floor {
    --height: 100vh;
    --slide1-color: var(--color-yellow);
    --slide2-color: var(--color-blue);
    --slide3-color: var(--color-green);
    --slide4-color: var(--color-red);
    --slide-transition: 0.3s ease-in-out;
    padding-bottom: 9.1rem;
    position: relative;
    z-index: 3;
}

.page-tallers-floor .pin-space {
    position: relative;
}

.page-tallers-floor .pin-element {
    display: flex;
    left: 0;
    place-content: center;
}

.page-tallers-floor .pin-element>div {
    background: var(--bg-section);
    border-bottom-right-radius: 10rem;
    display: grid;
    grid-template-rows: min-content min-content min-content auto;
    height: 100vh;
    inset: 0;
    isolation: isolate;
    padding-top: 8rem;
    place-content: center;
    width: 100vw;
    z-index: 1;
}

.page-tallers-floor .pin-element .content {
    display: grid;
}

.page-tallers-floor .pin-space[data-pinned="top"] .pin-element {
    position: absolute;
    top: 0;
}

.page-tallers-floor .pin-space[data-pinned="center"] .pin-element {
    position: fixed;
    top: 0;
}

.page-tallers-floor .pin-space[data-pinned="bottom"] .pin-element {
    bottom: 0;
    position: absolute;
}

.page-tallers-floor .slides {
    display: grid;
    position: relative;
}

.page-tallers-floor .slide {
    flex: 0 0 100vw;
    grid-column: 1;
    grid-row: 1;
}

.page-tallers-floor .bullets {
    align-items: center;
    bottom: 1rem;
    display: flex;
    gap: 2rem;
    justify-content: center;
    margin-top: 2.4rem;
    padding: 2rem;
}

.page-tallers-floor .bullets li {
    --size: 1.8rem;
    border-radius: 9in;
    cursor: pointer;
    height: var(--size);
    width: var(--size);
}

.page-tallers-floor .bullets li:first-child {
    background: var(--color-red);
}

.page-tallers-floor .bullets li:nth-child(2) {
    background: var(--color-orange);
}

.page-tallers-floor .bullets li:nth-child(3) {
    background: var(--color-blue);
}

.page-tallers-floor .bullets li:nth-child(4) {
    background: var(--color-red);
}

.page-tallers-floor .num,
.page-tallers-floor .slide {
    opacity: 0;
    transition: opacity var(--slide-transition);
}

.page-tallers-floor .bullets li {
    transition: width var(--slide-transition);
}

.page-tallers-floor .nums {
    transition: color var(--slide-transition);
}

.page-tallers-floor[data-slide="1"] .num:first-child,
.page-tallers-floor[data-slide="1"] .slide:first-child {
    opacity: 1;
}

.page-tallers-floor[data-slide="1"] .bullets li:first-child {
    width: 8rem;
}

.page-tallers-floor[data-slide="1"] .nums {
    color: var(--slide1-color);
}

.page-tallers-floor[data-slide="2"] .num:nth-child(2),
.page-tallers-floor[data-slide="2"] .slide:nth-child(2) {
    opacity: 1;
}

.page-tallers-floor[data-slide="2"] .bullets li:nth-child(2) {
    width: 8rem;
}

.page-tallers-floor[data-slide="2"] .nums {
    color: var(--slide2-color);
}

.page-tallers-floor[data-slide="3"] .num:nth-child(3),
.page-tallers-floor[data-slide="3"] .slide:nth-child(3) {
    opacity: 1;
}

.page-tallers-floor[data-slide="3"] .bullets li:nth-child(3) {
    width: 8rem;
}

.page-tallers-floor[data-slide="3"] .nums {
    color: var(--slide3-color);
}

.page-tallers-floor .pas-a-pas {
    margin-left: auto;
    margin-right: auto;
    max-width: 22.4rem;
    position: relative;
    z-index: 2;
}

@media (min-width: 768px) {
    .page-tallers-floor .bullets {
        left: 50%;
        position: absolute;
        top: 70rem;
    }
    .page-tallers-floor .pas-a-pas {
        margin-top: 3.9rem;
        max-width: 45rem;
    }
}

@media (min-width: 960px) {
    .page-tallers-floor {
        padding-bottom: 6rem;
    }
    .page-tallers-floor .bullets {
        top: 55rem;
    }
}

.taller-slide {
    --inline-padding: 1rem;
    display: grid;
    gap: 4rem;
    padding-bottom: 3.8rem;
    padding-top: 3rem;
    position: relative;
}

.taller-slide .taller-slide-media {
    align-items: center;
    display: flex;
    justify-content: center;
    position: relative;
}

.taller-slide .taller-slide-media img {
    filter: drop-shadow(var(--media-shadow));
    max-width: 18.3rem;
}

.taller-slide .taller-slide-media:before {
    background: no-repeat 50% / contain;
    background-image: var(--shape);
    content: "";
    display: block;
    height: 28.9rem;
    left: 50%;
    position: absolute;
    top: 6.5rem;
    transform: translateX(-50%);
    width: 37.5rem;
    z-index: -1;
}

.taller-slide .taller-slide-content {
    font-size: 1.8rem;
    line-height: 2.4rem;
    text-align: center;
}

.taller-slide[data-variant="red"] {
    --media-shadow: 0 2rem 4rem rgba(255, 96, 79, 0.4);
    --shape: url("data:image/svg+xml;charset=utf-8,%3Csvg width='468' height='484' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.514 68.674c-.84-11.993 8.104-22.44 20.083-23.458l356.953-30.35c12.118-1.03 22.773 7.967 23.788 20.086l33.56 400.937c1.112 13.284-9.75 24.496-23.062 23.806l-365.89-18.97c-11.102-.575-20.03-9.343-20.806-20.433L16.514 68.674Z' fill='%23F5F7FA'/%3E%3C/svg%3E");
}

.taller-slide[data-variant="orange"] {
    --media-shadow: 0 2rem 4rem hsla(26, 87%, 75%, 0.4);
    --shape: url("data:image/svg+xml;charset=utf-8,%3Csvg width='468' height='484' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M47.683 71.38c-.358-13.562 11.526-24.213 24.968-22.378l328.254 44.822c11.143 1.522 19.345 11.202 19.014 22.444l-9.81 334.007c-.342 11.64-9.694 20.997-21.333 21.345l-308.208 9.22c-12.175.364-22.329-9.234-22.65-21.41L47.683 71.38Z' fill='%23F5F7FA'/%3E%3C/svg%3E");
}

.taller-slide[data-variant="blue"] {
    --media-shadow: 0 2rem 4rem rgba(162, 189, 243, 0.4);
    --shape: url("data:image/svg+xml;charset=utf-8,%3Csvg width='468' height='484' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M47.088 443.244c-12.628 1.368-23.787-8.21-24.349-20.899L7.921 87.5c-.493-11.147 7.437-20.899 18.451-22.688l340.301-55.27c11.803-1.918 22.977 5.944 25.158 17.702l64.533 347.846c2.335 12.589-6.531 24.505-19.261 25.885L47.088 443.244Z' fill='%23F5F7FA'/%3E%3C/svg%3E");
}

@media (min-width: 768px) {
    .taller-slide {
        --container-width: 96rem;
        grid-template-columns: repeat(2, 1fr);
    }
    .taller-slide .taller-slide-media {
        align-items: flex-start;
        justify-content: flex-end;
        padding-left: 7.8rem;
    }
    .taller-slide .taller-slide-media img {
        max-width: 28.2rem;
    }
    .taller-slide .taller-slide-media:before {
        height: 48.4rem;
        margin-left: -3rem;
        top: -11rem;
        width: 46.8rem;
    }
    .taller-slide .taller-slide-content {
        font-size: 2.4rem;
        line-height: 3.8rem;
        padding-top: 2.4rem;
        text-align: left;
    }
}

.page-materials-floor .products {
    display: grid;
    gap: 12rem;
    padding-bottom: 8rem;
    padding-top: 5rem;
    position: relative;
    z-index: 1;
    width: 100%;
    overflow-x: hidden;
}

@media (min-width: 768px) {
    .page-materials-floor {
        padding-bottom: 9.7rem;
    }
    .page-materials-floor .products {
        --container-width: 114rem;
        gap: 15.4rem;
    }
}

.page-facilitats-floor {
    z-index: 2;
}

.page-facilitats-floor .cover {
    margin-bottom: -5.2rem;
    min-height: 67rem;
    position: relative;
    z-index: 2;
}

.page-facilitats-floor .cover .products-list {
    color: var(--color-white);
    inset: auto 2rem 2.8rem;
    position: absolute;
    z-index: 1;
}

.page-facilitats-floor .content {
    --inline-padding: 1rem;
    display: grid;
    position: relative;
    z-index: 1;
}

.page-facilitats-floor .numbered-list {
    background: var(--color-white);
    border-radius: 22px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
    padding: 10.5rem 1.2rem 5.2rem;
}

.page-facilitats-floor .products-wrapper {
    display: none;
}

@media (min-width: 960px) {
    .page-facilitats-floor .cover {
        padding-bottom: 47.9rem;
        padding-top: 22.3rem;
    }
    .page-facilitats-floor .cover .lead {
        max-width: 46.7rem;
    }
    .page-facilitats-floor .cover .products-list {
        display: none;
    }
    .page-facilitats-floor .content {
        --container-width: 113rem;
        --inline-padding: 2rem;
        --border-radius: 6rem;
        display: grid;
        grid-template-columns: 380fr 173fr 576fr;
        grid-template-columns: 380fr 173fr 707fr;
        margin-top: -42.5rem;
        z-index: 3;
    }
    .page-facilitats-floor .content .products-wrapper {
        background: #0005;
        border-radius: var(--border-radius) 9in 9in var(--border-radius);
        display: block;
        grid-column: 1 / span 2;
        grid-row: 1;
        isolation: isolate;
        overflow: hidden;
        padding: 1.7rem;
        position: relative;
    }
    .page-facilitats-floor .content .numbered-list {
        border-radius: 9in var(--border-radius) var(--border-radius) 9in;
        grid-column: 2 / span 2;
        grid-row: 1;
        padding: 3.6rem 3.4rem 4.4rem calc(var(--computed-width) * 0.173 + 4rem);
    }
}

.page-demos-floor {
    padding-bottom: 11.4rem;
    padding-top: 5rem;
}

.page-demos-floor .head {
    margin-bottom: 7rem;
}

.page-demos-floor .collections {
    display: grid;
    gap: 2rem;
}

.page-demos-floor .collection {
    --item-gap: 0.8rem;
    --item-width: 14.4rem;
    display: grid;
    gap: 2rem;
    overflow: hidden;
}

.page-demos-floor .collection .h2 {
    color: var(--color-professor1);
}

.page-demos-floor .demos .scroller {
    padding-bottom: 12rem;
}

.scroller-note {
    text-align: right;
}

.page-demos-floor .demos[data-variant="hibrid"] {
    --media-width: 20.5rem;
    --media-height: 25.2rem;
}

.page-demos-floor .demos[data-variant="digital"] {
    --media-width: 22.9rem;
    --media-height: 32.1rem;
}

.page-demos-floor .collection[data-variant="red"] img {
    box-shadow: 0 20px 40px -20px rgba(255, 96, 79, 0.6);
}

.page-demos-floor .collection[data-variant="orange"] img {
    box-shadow: 0 20px 40px -20px hsla(26, 87%, 75%, 0.84);
}

.page-demos-floor .collection[data-variant="blue"] img {
    box-shadow: 0 20px 40px -20px rgba(162, 189, 243, 0.61);
}

.page-demos-floor .collection[data-variant="green"] img {
    box-shadow: 0 20px 40px -20px rgba(68, 200, 135, 0.57);
}

.page-demos-floor .collection[data-direction="even"] .h2 {
    text-align: left;
}

.page-demos-floor .collection[data-direction="odd"] .h2 {
    text-align: right;
}

.page-demos-floor .list {
    height: 200vh;
}

.page-demos-floor .list .parallax-element {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='2905' height='1910' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M620.029 26.552c258.219 39.924 507.291 125.45 735.651 252.604a216.382 216.382 0 0 1 68.12 53.742 217.078 217.078 0 0 1 41.62 76.24 217.531 217.531 0 0 1 8.43 86.516 217.465 217.465 0 0 1-26.1 82.922 217.14 217.14 0 0 1-56.44 66.036 216.634 216.634 0 0 1-77.75 38.562 216.082 216.082 0 0 1-86.58 4.908 216.117 216.117 0 0 1-81.54-29.535C862.287 501.634 542.022 424.435 218.557 435.125c-56.541.558-111.042-21.073-151.858-60.271C25.883 335.655 1.987 281.998.12 225.345c-1.87-56.652 18.436-111.807 56.578-153.68C94.838 29.79 147.792 4.519 204.244 1.249A2225.487 2225.487 0 0 1 620.371 26.37M2168.9 890.996a2205.482 2205.482 0 0 1 485.78 607.574 216.42 216.42 0 0 1 28.72 81.89c3.96 28.97 2.02 58.45-5.71 86.67a217.4 217.4 0 0 1-39.23 77.57 217.508 217.508 0 0 1-66.46 56.02 217.165 217.165 0 0 1-83.03 25.5c-29.1 2.82-58.46-.28-86.31-9.11a216.206 216.206 0 0 1-75.73-42.27 216.195 216.195 0 0 1-53.02-68.64c-155-284.24-384.04-521.08-662.87-685.43-48.03-29.835-82.46-77.309-95.92-132.282-13.46-54.972-4.89-113.083 23.88-161.916 28.78-48.834 75.47-84.518 130.11-99.428 54.63-14.91 112.88-7.865 162.3 19.631a2226.39 2226.39 0 0 1 337.88 244.25' fill='%23F5F7FA'/%3E%3C/svg%3E");
    height: 191rem;
    width: 290.5rem;
}

@media (min-width: 1034px) {
    .page-demos-floor {
        isolation: isolate;
        padding-top: 18rem;
        position: relative;
        z-index: -1;
    }
    .page-demos-floor .collection {
        --container-width: 136rem;
        --item-gap: 2.6rem;
        --item-width: 100%;
    }
    .page-demos-floor .collection .h2 {
        color: #000;
    }
    .page-demos-floor .demos {
        --padding-inline: calc(50vw - var(--container-width) / 2);
    }
    .page-demos-floor .collection[data-direction="odd"] .scroller {
        justify-content: flex-end;
    }
    .page-demos-floor .parallax-element {
        z-index: -1;
    }
    .page-demos-floor[data-variant="digital"] .collection {
        --item-width: clamp(17.6rem, 20vw, 32.1rem);
    }
}

.page-project-floor {
    --padding-inline: 1rem;
    display: grid;
    grid-template-columns: var(--padding-inline) auto var(--padding-inline);
    grid-template-rows: auto var(--overlap) auto auto;
}

.page-project-floor .cover {
    gap: 0;
    grid-column: 2;
    grid-row: 1;
    min-height: 0;
    padding: 0 1rem;
}

.page-project-floor .cover .head {
    position: relative;
}

.page-project-floor .cover .cover-content {
    padding-bottom: 2rem;
    padding-top: 14.8rem;
}

.page-project-floor .cover .cover-content .h2 {
    margin: 1.2rem 0;
}

.page-project-floor .cover .cover-content .lead {
    --font-weight: 400;
}

.page-project-floor .background {
    grid-column: 1 / span 3;
    grid-row: 1 / span 2;
    position: relative;
}

.page-project-floor .background img {
    border-radius: 2.4rem;
}

.page-project-floor .items {
    background: #fff;
    border-radius: 1.8rem;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
    display: grid;
    gap: 2.2rem;
    grid-column: 2;
    grid-row: 2 / span 2;
    padding: 4rem 1.2rem;
    text-align: center;
}

.page-project-floor .item .num {
    color: var(--color-blue);
    font-size: 4.32rem;
    font-weight: 700;
    line-height: 5.76rem;
}

.page-project-floor .item .title {
    font-size: 2.6rem;
    font-weight: 700;
    line-height: 3.2rem;
}

.page-project-floor .item p {
    font-size: 1.6rem;
    line-height: 2.4rem;
}

.page-project-floor .collection {
    display: grid;
    gap: 2.8rem;
    grid-column: 1 / span 3;
    grid-row: 4;
    padding-bottom: 0rem;
    padding-top: 2.2rem;
    justify-content: center;
}

.page-project-floor .collection .subtitle {
    margin-left: 40px;
    padding-bottom: 20px;
    margin-top: 30px;
    font-size: 3.2rem;
    font-weight: 300;
    line-height: 4.8rem;
    letter-spacing: 0.01rem;
}

.page-project-floor .collection .sub2 {
    text-align: center;
    color: var(--color-lectoescriptura1);
    font-weight: 700;
    font-size: 4.8rem;
}

@media (min-width: 768px) {
    .page-project-floor {
        --padding-inline: max(2rem, calc(50vw - 60.4rem));
        grid-template-rows: auto auto var(--overlap) auto;
        margin-top: 40px;
    }
    .page-project-floor .cover {
        padding: 0 4rem;
    }
    .page-project-floor .cover .cover-content {
        padding-bottom: 7rem;
    }
    .page-project-floor .items {
        gap: 3.4rem;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(2, 1fr);
        padding: 6.4rem 6.3rem 5.7rem;
        text-align: left;
    }
    .page-project-floor .item {
        max-width: 47.3rem;
        padding-left: 6.3rem;
        position: relative;
    }
    .page-project-floor .item .num {
        left: 0;
        position: absolute;
        top: -0.2rem;
    }
    .page-project-floor .item .title {
        margin-bottom: 0.6rem;
    }
    .page-project-floor .item:nth-child(2) {
        grid-column: 1;
        grid-row: 2;
    }
    .page-project-floor .scroller {
        padding-bottom: 12rem;
    }
    .page-project-floor .collection {
        gap: 4rem;
        padding-bottom: 2.3rem;
        padding-top: 2.3rem;
    }
    
}

.index-hero-floor {
    --media-height: 29.4rem;
    background: var(--color-professor1);
    color: #fff;
    padding-bottom: calc(var(--media-height) + 5.6rem);
    padding-top: 15rem;
}

.index-hero-floor .logo {
    left: 2.2rem;
    position: absolute;
    top: 4rem;
    width: 10.7rem;
}

.index-hero-floor .h1 {
    margin-bottom: 2rem;
    margin-top: 2.9rem;
}

.index-hero-floor .h1 b {
    color: #eb61a6;
}

.index-hero-floor .scroll {
    bottom: var(--media-height);
    left: 50%;
    position: absolute;
    transform: translate(-50%, 50%);
}

.index-hero-floor .background {
    height: var(--media-height);
    top: auto;
}

.index-hero-floor .background img {
    border-top-left-radius: 10rem;
}

@media (min-width: 768px) {
    .index-hero-floor {
        border-radius: 0 0 30rem 0;
        display: flex;
        flex-direction: column;
        justify-content: center;
        min-height: max(79rem, 100vh);
        padding-bottom: 14rem;
        padding-top: 14rem;
    }
    .index-hero-floor .logo {
        left: 4rem;
        width: 12.4rem;
    }
    .index-hero-floor .h1 {
        --font-size: 4.8rem;
        --line-height: 4.8rem;
    }
    .index-hero-floor .scroll {
        bottom: 6.5rem;
    }
    .index-hero-floor .background {
        border-radius: 0 0 30rem 0;
        height: auto;
        left: auto;
        overflow: hidden;
        top: 0;
        width: 50%;
    }
    .index-hero-floor .background img {
        border-radius: 0;
    }
    .index-hero-floor .background video {
        height: 100%;
        inset: 0;
        object-fit: cover;
        position: absolute;
        width: 100%;
        z-index: 1;
    }
    .index-hero-floor .content {
        padding-right: 10rem;
        width: 50%;
    }
}

@media (min-width: 1025px) {
    .index-hero-floor .h1 {
        --font-size: 8rem;
        --line-height: 8.2rem;
    }
    .index-hero-floor .content {
        padding-right: 13rem;
    }
}

.index-projects-floor {
    overflow: hidden;
    padding-top: 2rem;
    position: relative;
}

.index-projects-floor .parallax-element>div {
    --size: 31.4rem;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='314' height='314' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='157' cy='157' r='128.743' stroke='%231E1348' stroke-opacity='.05' stroke-width='56.513'/%3E%3C/svg%3E");
    height: var(--size);
    width: var(--size);
}

.index-projects-floor .parallax-element1 {
    right: -16rem;
    top: 16rem;
}

.index-projects-floor .parallax-element2 {
    bottom: 72rem;
    left: -15rem;
}

@media (min-width: 768px) {
    .index-projects-floor {
        padding-top: 1rem;
        position: relative;
    }
    .index-projects-floor .head {
        margin-bottom: 4rem;
        padding-top: 0;
    }
    .index-projects-floor .parallax-element>div {
        --size: 49.9rem;
        background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='499' height='499' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M449 249.5C449 359.681 359.681 449 249.5 449S50 359.681 50 249.5 139.319 50 249.5 50 449 139.319 449 249.5Z' stroke='%231E1348' stroke-opacity='.05' stroke-width='100'/%3E%3C/svg%3E");
    }
    .index-projects-floor .parallax-element1 {
        right: -25.4rem;
        top: 15rem;
    }
    .index-projects-floor .parallax-element2 {
        bottom: 72rem;
        left: calc(50% - 16rem);
    }
}

.index-project__media {
    position: relative;
}

.index-project__media .bg {
    height: 37rem;
    object-fit: cover;
}

.index-project__media .logo.xs {
    bottom: 0;
    height: 14.8rem;
    position: absolute;
    width: auto;
}

.index-project__content {
    padding: 2.2rem 2.2rem 4.6rem 1.8rem;
}

.index-project__title {
    font-size: 2.6rem;
    font-weight: 700;
    line-height: 3.4rem;
}

.index-project__body {
    font-size: 1.6rem;
    line-height: 2.4rem;
    margin-top: 1rem;
}

.index-project__body p+p {
    margin-top: 1.4rem;
}

.index-project__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
    margin-top: 1.8rem;
}

.index-project__cta {
    margin-top: 3.7rem;
}

.index-project__tag {
    align-items: center;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.05);
    border-radius: 9in;
    box-shadow: 0 0.8rem 2.5rem -1rem rgba(30, 19, 72, 0.08);
    display: inline-flex;
    font-size: 1.4rem;
    font-weight: 700;
    height: 3.2rem;
    justify-content: center;
    line-height: 2.4rem;
    padding: 0.3rem 1.3rem 0;
    white-space: nowrap;
}

.index-project__tag[data-variant="red"] {
    color: var(--color-red);
}

.index-project__tag[data-variant="orange"] {
    color: var(--color-orange);
}

.index-project__tag[data-variant="blue"] {
    color: var(--color-blue);
}

.index-project__tag[data-variant="green"] {
    color: var(--color-green);
}

:where([data-even]) .index-project__media {
    margin-right: 3.5rem;
}

:where([data-even]) .index-project__media .bg {
    border-radius: 0 9in 9in 0;
}

:where([data-even]) .index-project__media .logo.xs {
    margin-left: -5rem;
}

:where([data-odd]) .index-project__media {
    margin-left: 3.5rem;
}

:where([data-odd]) .index-project__media .bg {
    border-radius: 9in 0 0 9in;
}

:where([data-brand="blue"]) .index-project__media {
    padding-bottom: 3.7rem;
}

:where([data-brand="blue"]) .index-project__cta {
    --bg: var(--color-blue);
    --bg-hover: var(--color-blue);
    --bg-active: var(--color-blue);
}

:where([data-brand="dark-orange"]) .index-project__media {
    padding-bottom: 3.7rem;
}

:where([data-brand="dark-orange"]) .index-project__cta {
    --bg: var(--color-dark-orange);
    --bg-hover: var(--color-dark-orange);
    --bg-active: var(--color-dark-orange);
}

:where([data-brand="pink"]) .index-project__media {
    padding-bottom: 2rem;
}

:where([data-brand="pink"]) .index-project__cta {
    --bg: var(--color-pink);
    --bg-hover: var(--color-pink);
    --bg-active: var(--color-pink);
}

:where([data-brand="green"]) .index-project__media {
    padding-bottom: 3.7rem;
}

:where([data-brand="green"]) .index-project__cta {
    --bg: var(--color-green);
    --bg-hover: var(--color-green);
    --bg-active: var(--color-green);
}

@media (min-width: 768px) {
    .index-project {
        display: flex;
    }
    .index-project[data-odd] {
        flex-direction: row-reverse;
    }
    .index-project__title {
        font-size: 3.6rem;
        line-height: 4.4rem;
    }
    .index-project__body {
        font-size: 1.8rem;
        line-height: 2.4rem;
        margin-top: 2.6rem;
    }
    .index-project__tags {
        margin-top: 2.4rem;
    }
    .index-project__cta {
        margin-top: 2.8rem;
    }
    .index-project__media {
        flex: 50%;
        margin: 0;
        padding: 0;
    }
    .index-project__media .bg {
        min-height: 69rem;
        width: 100%;
    }
    .index-project__media .logo.lg {
        height: 26rem;
        max-width: none;
        position: absolute;
        width: auto;
    }
    .index-project__content {
        align-items: center;
        display: flex;
        flex: 50%;
    }
    .index-project__content>div {
        max-width: 51rem;
    }
     :where([data-even]) .index-project__media {
        margin-right: 0;
        padding-right: 3rem;
    }
     :where([data-even]) .index-project__media .bg {
        border-radius: 0 9in 9in 0;
    }
     :where([data-even]) .index-project__media .logo {
        margin-left: -5rem;
    }
     :where([data-even]) .index-project__content {
        justify-content: flex-start;
        padding-left: 5.8rem;
    }
     :where([data-odd]) .index-project__media {
        margin-left: 0;
        padding-left: 3rem;
    }
     :where([data-odd]) .index-project__media .bg {
        border-radius: 9in 0 0 9in;
    }
     :where([data-odd]) .index-project__content {
        justify-content: flex-end;
        padding-right: 5.8rem;
    }
     :where([data-brand="blue"]) .index-project__media .logo.lg {
        left: -3.5rem;
        top: 6.5rem;
    }
     :where([data-brand="dark-orange"]) .index-project__media .logo.lg {
        left: -3.5rem;
        top: 6.5rem;
    }
     :where([data-brand="pink"]) .index-project__media .logo.lg {
        right: 1.1rem;
        top: 3.8rem;
    }
     :where([data-brand="green"]) .index-project__media .logo.lg {
        right: -1rem;
        top: 11.5rem;
    }
}

.index-video-floor {
    align-items: center;
    background: #4aadf8;
    color: #fff;
    display: flex;
    flex-direction: column;
    gap: 1.4rem;
    justify-content: center;
    padding: 0 2rem 4rem;
}

.index-video-floor .head {
    --color: #fff;
    --dot-color: var(--color-professor1);
    --body-color: #fff;
}

.index-video-floor__video a {
    border-radius: 1.2rem;
    display: flex;
    overflow: hidden;
    position: relative;
}

.index-video-floor__video .video-play {
    --size: 9.8rem;
    height: var(--size);
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: var(--size);
}

.index-video-floor__video iframe {
    height: 100%;
    inset: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition: opacity 0.2s ease-in-out;
    width: 100%;
}

.index-video-floor__video .active iframe {
    opacity: 1;
    pointer-events: all;
}

@media (min-width: 768px) {
    .index-video-floor {
        gap: 3rem;
        margin-top: -9rem;
        padding: 12rem 2rem 18rem;
    }
    .index-video-floor__video {
        max-width: 113rem;
    }
    .index-video-floor__video a {
        border-radius: 2.2rem;
    }
    .index-video-floor__video .video-play {
        --size: 16rem;
    }
}

.index-testimonals-floor {
    --offset-bottom: 29rem;
    height: 80rem;
    position: relative;
}

@media (min-width: 768px) {
    .index-testimonals-floor {
        height: calc(88rem + var(--offset-bottom));
        margin-bottom: calc(var(--offset-bottom) * -1);
        padding-bottom: var(--offset-bottom);
        padding-top: 0;
    }
}

.index-testimonals-slider {
    display: grid;
    height: 100%;
    overflow: hidden;
    position: relative;
    user-select: none;
    width: 100vw;
}

.index-testimonal {
    --brand-color: var(--color-blue);
    --max-width: 50rem;
    align-items: center;
    color: #fff;
    display: flex;
    flex-direction: column;
    grid-column: 1;
    grid-row: 1;
    justify-content: flex-start;
    padding: 11rem 2rem 0;
    text-align: center;
}

.index-testimonal img {
    --size: 17.4rem;
    border: 4px solid var(--brand-color);
    border-radius: 9in;
    height: var(--size);
    pointer-events: none;
    width: var(--size);
}

.index-testimonal__title {
    font-size: 2.4rem;
    font-style: italic;
    line-height: 3.2rem;
    margin-bottom: 5.4rem;
    margin-top: 3.4rem;
    max-width: var(--max-width);
    position: relative;
}

.index-testimonal__title b {
    position: relative;
}

.index-testimonal__title b:before {
    box-shadow: 0 1rem 1.2rem -0.4rem rgba(0, 0, 0, 0.14);
    font-weight: 600;
    height: 2.2rem;
    inset: auto -0.7rem -0.1rem -1.4rem;
    z-index: -1;
}

.index-testimonal__title:after,
.index-testimonal__title b:before {
    background: var(--brand-color);
    border-radius: 9in;
    content: "";
    display: block;
    position: absolute;
}

.index-testimonal__title:after {
    --size: 2.4rem;
    bottom: -1rem;
    height: var(--size);
    left: 50%;
    transform: translate(-50%, 100%);
    width: var(--size);
}

.index-testimonal__name {
    font-size: 1.8rem;
    font-weight: 700;
    letter-spacing: 1%;
    line-height: 2.6rem;
    max-width: var(--max-width);
}

.loading .index-testimonal:not(:first-child) {
    display: none;
}

@media (min-width: 768px) {
    .index-testimonal {
        --max-width: 90rem;
        padding-top: 18rem;
    }
    .index-testimonal__title {
        font-size: 3.8rem;
        line-height: 5.2rem;
        margin-bottom: 6.3rem;
        margin-top: 3.4rem;
    }
    .index-testimonal__title b:before {
        height: 2.6rem;
        inset: auto 0.7rem -0.1rem -0.8rem;
    }
    .index-testimonal__name {
        font-size: 2.2rem;
        line-height: 2.6rem;
    }
}

.index-testimonal[data-brand="blue"] {
    --brand-color: var(--color-blue);
}

.index-testimonal[data-brand="pink"] {
    --brand-color: var(--color-pink);
}

.index-testimonal[data-brand="dark-orange"] {
    --brand-color: var(--color-dark-orange);
}

.index-testimonal[data-brand="green"] {
    --brand-color: var(--color-green);
}

.index-testimonals-nav {
    align-items: center;
    display: none;
    display: flex;
    gap: 1.6rem;
    inset: auto 0 3rem;
    justify-content: center;
    position: absolute;
}

.index-testimonals-nav__item {
    --size: 1.6rem;
    background: #fff;
    border-radius: 9in;
    cursor: pointer;
    height: var(--size);
    opacity: 0.4;
    transition: width 0.25s ease-in-out, opacity 0.25s ease-in-out;
    width: var(--size);
}

.index-testimonals-nav__item.active {
    opacity: 1;
    width: 4.4rem;
}

@media (min-width: 768px) {
    .index-testimonals-nav {
        bottom: calc(4.7rem + var(--offset-bottom));
    }
}

.page-sequencies-hero-floor {
    color: var(--color-dark);
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-bottom: 5.6rem;
    padding-top: 27rem;
    position: relative;
}

.page-sequencies-hero-floor .media {
    height: 44rem;
    inset: 0 0 auto;
    overflow-x: hidden;
}

.page-sequencies-hero-floor .media img {
    height: 44rem;
    left: 50%;
    max-width: none;
    object-fit: fill;
    object-position: top center;
    transform: translateX(-50%);
    width: 82.3rem;
}

.page-sequencies-hero-floor .content {
    max-width: 80vw;
}

.page-sequencies-hero-floor .h1,
.page-sequencies-hero-floor .sub1 {
    margin-top: 1.2rem;
}

@media (min-width: 768px) {
    .page-sequencies-hero-floor {
        --container-width: 113.8rem;
        min-height: 70.6rem;
        padding-bottom: 5.6rem;
        padding-top: 18rem;
    }
    .page-sequencies-hero-floor .media {
        height: 78.7rem;
    }
    .page-sequencies-hero-floor .media img {
        height: 78.7rem;
        width: 172rem;
    }
    .page-sequencies-hero-floor .content {
        max-width: 80vw;
        width: min(100%, 72.6rem);
    }
    .page-sequencies-hero-floor .h1 {
        margin-top: 2.9rem;
    }
    .page-sequencies-hero-floor .sub1 {
        margin-top: 1.8rem;
    }
}

.page-sequencies-metodologia-floor {
    margin-bottom: 5.6rem;
}

.page-sequencies-metodologia-floor .head {
    margin-bottom: 1rem;
}

.page-sequencies-metodologia-floor .sequencia+.sequencia {
    margin-top: 5rem;
}

@media (min-width: 768px) {
    .page-sequencies-metodologia-floor {
        margin-bottom: 19.6rem;
    }
    .page-sequencies-metodologia-floor .head {
        margin-bottom: 2.4rem;
    }
    .page-sequencies-metodologia-floor .sequencia+.sequencia {
        margin-top: 14.4rem;
    }
}

.page-sequencies-projects-floor {
    display: grid;
    padding-bottom: 4rem;
    padding-top: 4rem;
    gap: 0;
    text-align: center;
    justify-items: center;
}

.page-sequencies-demos-floor {
    text-align: center;
    padding-top: 7.9rem;
    padding-bottom: 1.1rem;
}

.page-sequencies-projects-floor .h2,
.page-sequencies-demos-floor .h2 {
    color: var(--color-professor5);
    padding-bottom: 2.7rem;
}

.page-sequencies-projects-floor .items {
    display: grid;
    gap: 1.2rem;
    position: relative;
}

.page-sequencies-projects-floor .item {
    border-radius: 9in;
    display: flex;
    flex-direction: column;
    height: 16rem;
    justify-content: center;
    max-width: 95.6rem;
    gap: 0.3rem;
    padding: 0 2rem;
}

.page-sequencies-projects-floor .item-socials {
    background: var(--color-area-socials);
}

.page-sequencies-projects-floor .item-catalan {
    background: var(--color-area-catalan);
}

.page-sequencies-projects-floor .item-castilian {
    background: var(--color-orange);
}

.page-sequencies-projects-floor .item-techno {
    background: var(--color-area-techno);
}

.page-sequencies-projects-floor .sub1 {
    padding-top: 5.2rem;
    --font-size: 1.8rem;
    --line-height: 2.4rem;
}

.page-sequencies-projects-floor .item .sub2 {
    color: #fff;
}

.page-sequencies-projects-floor.item .lead {
    padding: 0 2rem;
}

.page-sequencies-projects-floor .catalog {
    max-width: 95.6rem;
}

.page-sequencies-projects-floor .catalog .btn {
    background: var(--color-professor5);
    width: 28.1rem;
    height: 4.7rem;
    font-size: 1.8rem;
    line-height: 2.2rem;
    margin-top: 4rem;
}

@media (min-width: 960px) {
    .page-sequencies-projects-floor .item .lead {
        padding: 0 23rem;
    }
}

@media (min-width: 768px) {
    .page-sequencies-demos-floor {
        padding-top: 14rem;
        padding-bottom: 16.1rem;
    }
    .page-sequencies-projects-floor .sub1 {
        padding-top: 0;
    }
    .page-sequencies-projects-floor .items {
        gap: 3.1rem;
    }
    .page-sequencies-projects-floor .item {
        height: 17.1rem;
        max-width: 95.6rem;
        padding: 0 2rem;
    }
    .page-sequencies-projects-floor .item .sub2 {
        font-size: 7rem;
        line-height: 7.2rem;
    }
    .page-sequencies-demos-floor .sub2 {
        font-size: 5rem;
        line-height: 7.2rem;
    }
    .page-sequencies-projects-floor .catalog .btn {
        width: 50rem;
        height: 9.6rem;
        font-size: 3rem;
        line-height: 2.2rem;
        margin-top: 7rem;
    }
    .page-sequencies-projects-floor .c-techno .btn {
        margin-top: 1.6rem;
    }
}

.page-sequencies-intro-floor {
    padding-bottom: 22.4rem;
    padding-top: 20.4rem;
    text-align: center;
}

.page-sequencies-intro-floor .content {
    margin: 0 auto;
    max-width: 40rem;
}

.page-sequencies-intro-floor .h2 b {
    color: var(--color-professor2);
    display: block;
    font-size: 11rem;
    line-height: 1;
}

.page-sequencies-intro-floor .lead {
    font-weight: 400;
    margin-top: 1.2rem;
}

.page-sequencies-intro-floor [data-label] {
    --size: 13.9rem;
    height: var(--size);
    position: absolute;
    width: var(--size);
}

.page-sequencies-intro-floor [data-label]>div {
    color: var(--brand);
    font-size: 2.6rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    line-height: 3.2rem;
    position: absolute;
}

.page-sequencies-intro-floor [data-label] svg circle {
    fill: var(--brand);
}

.page-sequencies-intro-floor [data-label]:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='507' height='212' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='507' height='212' rx='100' fill='%23F5F7FA'/%3E%3C/svg%3E");
    content: "";
    display: block;
    height: 21.2rem;
    position: absolute;
    width: 50.7rem;
    z-index: -1;
}

.page-sequencies-intro-floor [data-label="1"] {
    left: 4.4rem;
    top: 3.8rem;
}

.page-sequencies-intro-floor [data-label="1"]>div {
    left: 12.3rem;
    top: 7.2rem;
}

.page-sequencies-intro-floor [data-label="1"]:before {
    left: 4.2rem;
    top: 3.7rem;
}

.page-sequencies-intro-floor [data-label="2"] {
    bottom: 5.2rem;
    right: 1.4rem;
}

.page-sequencies-intro-floor [data-label="2"]>div {
    bottom: 4.2rem;
    right: 10.2rem;
}

.page-sequencies-intro-floor [data-label="2"]:before {
    bottom: 2.8rem;
    right: 3.4rem;
}

@media (min-width: 768px) {
    .page-sequencies-projects-floor {
        padding-bottom: 5rem;
        padding-top: 21.7rem;
        gap: 6.8rem;
    }
    .page-sequencies-intro-floor {
        padding-bottom: 12.7rem;
        padding-top: 22.7rem;
    }
    .page-sequencies-intro-floor .h2 b {
        font-size: 17.8rem;
        margin-bottom: -2rem;
    }
    .page-sequencies-intro-floor .lead {
        margin-top: 2rem;
    }
    .page-sequencies-intro-floor [data-label="1"] {
        left: 4.4rem;
        top: calc(50% - 18rem);
    }
    .page-sequencies-intro-floor [data-label="2"] {
        bottom: auto;
        right: 1.4rem;
        top: calc(50% - 3rem);
    }
    .page-sequencies-intro-floor [data-label="2"]:before {
        bottom: auto;
        top: 3.8rem;
    }
}

@media (min-width: 960px) {
    .page-sequencies-intro-floor [data-label="1"] {
        left: calc(50% - 55rem);
    }
    .page-sequencies-intro-floor [data-label="2"] {
        right: calc(50% - 55rem);
    }
}

.page-sequencies-facilitats-floor {
    margin-bottom: 5rem;
    z-index: 2;
}

.page-sequencies-facilitats-floor .cover {
    justify-content: flex-end;
    margin-bottom: -5.2rem;
    min-height: 55.2rem;
    position: relative;
    z-index: 2;
}

.page-sequencies-facilitats-floor .content {
    --inline-padding: 1rem;
    display: grid;
    position: relative;
    z-index: 1;
}

.page-sequencies-facilitats-floor .numbered-list {
    background: var(--color-white);
    border-radius: 0 0 50vw 50vw;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
    padding: 10.5rem 1.2rem 40%;
}

.page-sequencies-facilitats-floor .features-list {
    background: #5c4d9b;
    border-radius: 50vw 50vw 2.2rem 2.2rem;
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
    margin-top: -30vw;
    padding: 45% 2rem 4rem;
}

.page-sequencies-facilitats-floor .features-list .h3 {
    color: var(--color-professor3);
}

.page-sequencies-facilitats-floor .features-list ul {
    display: grid;
    gap: 2.2rem;
}

.page-sequencies-facilitats-floor .features-list li {
    background: no-repeat;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11.998 21.6a9.6 9.6 0 1 0 0-19.2 9.6 9.6 0 0 0 0 19.2Zm4.449-11.152a1.2 1.2 0 0 0-1.697-1.697l-3.952 3.952-1.551-1.551a1.2 1.2 0 0 0-1.697 1.696l2.4 2.4a1.2 1.2 0 0 0 1.697 0l4.8-4.8Z' fill='%23B2A4D2'/%3E%3C/svg%3E");
    color: #fff;
    padding-left: 4.5rem;
}

@media (min-width: 960px) {
    .page-sequencies-facilitats-floor {
        margin-bottom: 18rem;
    }
    .page-sequencies-facilitats-floor .cover {
        padding-bottom: 47.9rem;
        padding-top: 22.3rem;
    }
    .page-sequencies-facilitats-floor .cover .lead {
        max-width: 46.7rem;
    }
    .page-sequencies-facilitats-floor .cover .products-list {
        display: none;
    }
    .page-sequencies-facilitats-floor .content {
        --container-width: 113rem;
        --inline-padding: 2rem;
        --border-radius: 6rem;
        display: grid;
        grid-template-columns: 380fr 173fr 576fr;
        grid-template-columns: 380fr 173fr 707fr;
        margin-top: -42.5rem;
        z-index: 3;
    }
    .page-sequencies-facilitats-floor .content .numbered-list {
        border-radius: 9in var(--border-radius) var(--border-radius) 9in;
        grid-column: 2 / span 2;
        grid-row: 1;
        padding: 3.8rem 3.4rem 4.4rem calc(var(--computed-width) * 0.173 + 4rem);
    }
    .page-sequencies-facilitats-floor .content .features-list {
        border-radius: var(--border-radius) 9in 9in var(--border-radius);
        grid-column: 1 / span 2;
        grid-row: 1;
        margin: 0;
        padding: 4.2rem 4rem 4.2rem 3.2rem;
    }
    .page-sequencies-facilitats-floor .content .features-list ul {
        gap: 1.8rem;
    }
}

.root-floor {
    background: var(--color-professor1);
    height: 100vh;
}

#loader,
.root-floor {
    align-items: center;
    display: flex;
    justify-content: center;
}

#loader {
    background: var(--clr-accent);
    inset: 0;
    opacity: 0;
    pointer-events: none;
    position: fixed;
    transition: opacity 0.3s;
    z-index: 99999;
}

#loader:before {
    animation: loader-pulse 1s linear infinite;
    background: var(--clr-dark);
    border-radius: 50%;
    content: "";
    display: flex;
    height: 3vmin;
    width: 3vmin;
}

@keyframes loader-pulse {
    0% {
        opacity: 0;
        transform: scale(0.2);
    }
    20% {
        opacity: 1;
        transform: scale(0.6);
    }
    to {
        opacity: 0;
        transform: scale(1);
    }
}

body:not(.loaded) #loader {
    opacity: 1;
}


/*# sourceMappingURL=main.css.map */

.active-nav {
    color: orange !important;
}

.home-hero-floor p,
h1 {
    width: 100%;
}

.home-hero-floor .subtitle {
    font-weight: 400;
    color: var(--color-white);
    font-size: 4.5rem;
    padding-top: 10px;
}

.home-hero-floor .title {
    font-weight: 700;
    color: var(--color-white);
    font-size: 5.2rem;
    line-height: 5rem;
}

@media (max-width: 768px) {
    .home-hero-floor p,
    h1 {
        width: 50%;
    }
}

.home-hero-floor {
    height: 300px;
}

@media (min-width: 568px) {
    .home-hero-floor {
        height: 500px;
    }
}

@media (min-width: 768px) {
    .home-hero-floor {
        height: 100vh;
    }
}

.home-hero-floor p,
h1 {
    max-width: 523px;
}

.home-hero-floor .subtitle {
    line-height: 4rem;
}

@media (max-width: 568px) {
    .home-hero-floor .subtitle {
        line-height: 2rem;
    }
    .home-hero-floor .title {
        font-weight: 700;
        color: var(--color-white);
        font-size: 3rem;
        line-height: 2.5rem;
    }
    .home-hero-floor .subtitle {
        font-weight: 400;
        color: var(--color-white);
        font-size: 2.5rem;
        padding-top: 10px;
    }
    .home-hero-floor h1 {
        --font-size: 2.2rem;
        --line-height: 2.2rem;
    }
    .home-hero-floor p,
    h1 {
        width: 80%;
    }
}

.app-footer .logo {
    margin-top: 50px;
}

.app-footer .logo img {
    max-width: 39rem;
}