:root {
    --color--primary:       #8019ff;
    --color--light:         #fff;
    --color--dark:          #1e1e1e;
    --gray--900:            #483F57;
    --gray--700:            #726E79;
    --gray--500:            #c8c5ce;
    --gray--200:            #e9e7ec;

    /* Font */
    --font-size--p:         0.938vw; /* (18px * 100 / 1920) */
    --font-size--h1:        3.906vw; /* (75px * 100 / 1920) */
    --font-size--h2:        2.917vw; /* (56px * 100 / 1920) */
    --font-size--h3:        2.188vw; /* (42px * 100 / 1920) */
    --font-size--h4:        1.250vw; /* (24px * 100 / 1920) */
    --font-size--h5:        0.938vw; /* (18px * 100 / 1920) */
    --font-family--primary: 'Campton', sans-serif;
    --font-family--title:   'Tiempos', serif;
    --font-weight--default: 300;

    /* Spacing */
    --spacer--x: 4.688vw; /* (90px * 100 / 1920) */
    --spacer--y: 3.646vw; /* (70px * 100 / 1920) */

    /* Transition - Timings */
    --duration--fast:    0.15s;
    --duration--average: 0.3s;
    --duration--slow:    0.6s;

    /* Transition - Easings */
    --easing--primary:   cubic-bezier(0.22, 0.61, 0.36, 1); /* Out - Cubic */
    --easing--secondary: cubic-bezier(0, 0, 0.2, 1);        /* Linear Out - Slow In */
    --easing--tertiary:  cubic-bezier(0.39, 0.58, 0.57, 1); /* Out - Sine */

    /* Transition - Names */
    --opacity--fast:             opacity var(--duration--fast) var(--easing--primary);
    --opacity--average:          opacity var(--duration--average) var(--easing--primary);
    --opacity--slow:             opacity var(--duration--slow) var(--easing--primary);

    --color--fast:               color var(--duration--fast) var(--easing--primary);
    --color--average:            color var(--duration--average) var(--easing--primary);

    --background-color--fast:    background-color var(--duration--fast) var(--easing--primary);
    --background-color--average: background-color var(--duration--average) var(--easing--primary);

    --fill--fast:                fill var(--duration--fast) var(--easing--primary);
    --fill--average:             fill var(--duration--average) var(--easing--primary);

    --transform--fast:           transform var(--duration--fast) var(--easing--primary);
    --transform--average:        transform var(--duration--average) var(--easing--primary);
    --transform--slow:           transform var(--duration--slow) var(--easing--primary);
}

/* ==========================================================================
   Fonts
   ========================================================================== */

@font-face {
    font-family: "Campton";
    src:
            url("../fonts/Campton-Bold.woff2") format("woff2"),
            url("../fonts/Campton-Bold.woff") format("woff");
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Campton";
    src:
            url("../fonts/Campton-Medium.woff2") format("woff2"),
            url("../fonts/Campton-Medium.woff") format("woff");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Campton";
    src:
            url("../fonts/Campton-Light.woff2") format("woff2"),
            url("../fonts/Campton-Light.woff") format("woff");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Tiempos";
    src:
            url("../fonts/TiemposHeadline-Medium.woff2") format("woff2"),
            url("../fonts/TiemposHeadline-Medium.woff") format("woff");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Tiempos";
    src:
            url("../fonts/TiemposHeadline-LightItalic.woff2") format("woff2"),
            url("../fonts/TiemposHeadline-LightItalic.woff") format("woff");
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6 {
    font-family: var(--font-family--title);
    font-weight: 400;
    color: var(--color--dark);
}

h1,
.h1 {
    font-size: var(--font-size--h1);
    line-height: 1.1;
    margin-bottom: 3rem;
}

h2,
.h2 {
    font-size: var(--font-size--h2);
    line-height: 1.1;
    margin-bottom: 3rem;
}

h3,
.h3 {
    font-size: var(--font-size--h3);
    line-height: 1.2;
    margin-bottom: 3rem;
}

h4,
.h4 {
    font-size: var(--font-size--h4);
    line-height: 1.3;
    margin-bottom: 2.5rem;
    font-style: italic;
}

h5,
.h5 {
    font-family: var(--font-family--primary);
    font-size: var(--font-size--h5);
    line-height: 1.4;
    margin-bottom: 1rem;
}

p {
    margin-bottom: 2.5rem;
}

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

strong {
    font-weight: 400;
    color: var(--color--dark);
}

/* ==========================================================================
   Global
   ========================================================================== */

html {
    font-size: 62.5%;
}

body {
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-family: var(--font-family--primary);
    font-size: var(--font-size--p);
    font-weight: var(--font-weight--default);
    line-height: 1.7;
    color: var(--gray--700);
    background-color: var(--color--light);
}

img {
    max-width: 100%;
}

picture img {
    width: 100%;
    height: auto;
}

::selection {
    background: var(--color--primary);
    color: var(--color--light);
    text-shadow: none;
}

svg path {
    transition: var(--fill--fast);
}

/* ==========================================================================
   Components
   ========================================================================== */
.brand {
    width: 5.427vw; /* (85px * 100 / 1920) */
    height: auto;
}

.btn {
    position: relative;
    background-image: none;
    background-color: transparent;
    border: 0 none;
    font-family: var(--font-family--primary);
    color: var(--color--dark);
    text-transform: uppercase;
    font-size: 0.677vw; /* (13px * 100 / 1920) */
    font-weight: 800;
    letter-spacing: 0.5px;
    padding: 1.7rem 0;
    display: inline-flex;
    align-items: center;
    transition: var(--transform--fast), var(--color--fast);
    cursor: pointer;
    text-decoration: none;
}

.btn:hover {
    transform: translateX(0.313vw);
    color: var(--color--primary);
}

.btn:hover::before {
    transform: scaleX(1.6) translateX(-0.156vw);
}

.btn:hover::after {
    transform: translate(calc(-50% - 0.313vw), -50%);
}

.btn::before,
.btn::after {
    content: '';
    transition: var(--transform--fast);
}

.btn::before {
    width: 0.8rem;
    height: 2px;
    margin-right: 1.3rem;
    background-color: var(--color--primary);
    transform-origin: center left;
}

.btn::after {
    width: 2.813vw; /* (54px * 100 / 1920) */
    height: 2.813vw; /* (54px * 100 / 1920) */
    border: 1px solid var(--gray--200);
    border-radius: 50%;
    position: absolute;
    left: 3px;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: -1;
}

.btn--link {
    color: var(--gray--700);
    text-decoration: none;
    position: relative;
    text-shadow:
            1px 1px var(--color--light),
            1px -1px var(--color--light),
            -1px 1px var(--color--light),
            -1px -1px var(--color--light);
}

.btn--link::after {
    content: '';
    position: absolute;
    z-index: -1;
    bottom: 0.156vw; /* (3px * 100 / 1920) */
    left: 0;
    width: 100%;
    height: 1px;
    background-color: var(--gray--700);
}

.btn--link:hover {
    color: var(--color--primary);
}

.btn--link:hover::after {
    background-color: var(--color--primary);
}

/* ==========================================================================
   App
   ========================================================================== */
.app {
    min-height: 100vh;
    display: grid;
    grid-template-areas:
    'sidebar content'
    'footer footer';
    grid-template-columns: auto 1fr;
    grid-template-rows: 1fr auto;
}

/* Title */
.app__pretitle {
    color: var(--color--primary);
    font-size: var(--font-size--p);
    font-family: var(--font-family--primary);
    text-transform: uppercase;
    font-weight: 800;
    letter-spacing: 0.078vw; /* (1.5px * 100 / 1920) */
    display: block;
    margin-bottom: 1.823vw; /* (35px * 100 / 1920) */
}

.app__title {
    margin: 8vw 0 0 0;
    width: 100%;
}

.app__title__carousel {
    position: relative;
    display: block;
    height: 8.542vw; /* (164px * 100 / 1920) */
}

.app__title__chunk {
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
}

.app__title__chunk::before,
.app__title__chunk::after {
    content: '...';
    font-style: italic;
    font-size: 3.021vw; /* (58px * 100 / 1920) */
    letter-spacing: 1px;
}

.app__title__chunk:first-child::before,
.app__title__chunk:last-child::after {
    display: none;
}

/* Sidebar */
.app__sidebar {
    grid-area: sidebar;
    position: relative;
    padding: var(--spacer--y) var(--spacer--x);
}

.app__sidebar__line {
    position: absolute;
    right: 0;
    top: 0;
}



/* Content */
.app__content {
    grid-area: content;
    padding: var(--spacer--y) calc(var(--spacer--x) * 1);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
}

.app__content .btn {
    margin-top: 1.250vw; /* (24px * 100 / 1920) */
}


/********/
:root {
    --font-size--xs: max(1.3rem,0.68vw);
    --font-size--s: max(1.5rem,0.781vw);
    --font-size--m: max(1.8rem,0.88vw);
    --font-size--l: 6.99vw;
    --font-size--xl: 9.39vw;
    --font-size--2xl: 12.51vw;
    --font-size--3xl: 16.58vw;
    --font-size--h1: 5.27vw;
    --font-size--h2: 3.96vw;
    --font-size--h3: max(2.92vw,4rem);
    --font-size--h4: 2.19vw;
    --font-size--h5: 1.67vw;
    --font-size--h6: 1.25vw;
    --font-weight--default: 400;
    --dark-blue--color: 256deg 22%;
    --dark-blue--lightness: 19%;
    --purple--color: 267deg 100%;
    --purple--lightness: 55%;
    --color--brand: hsl(var(--purple--color) var(--purple--lightness));
    --color--dark: hsl(var(--dark-blue--color) var(--dark-blue--lightness));
    --color--light: #fff;
    --spacer--primary: 10vh;
    --padding--body: 1.5625vw;
    --grid--gap: 3.125vw;
    --nav-toggle--size: max(3.8rem,2.1vw);
    --duration--fast: 0.15s;
    --duration--average: 0.25s;
    --duration--slow: 0.45s;
    --easing--primary: cubic-bezier(0,0.382,0.282,0.822);
    --opacity--fast: opacity var(--duration--fast) var(--easing--primary);
    --opacity--average: opacity var(--duration--average) var(--easing--primary);
    --opacity--slow: opacity var(--duration--slow) var(--easing--primary);
    --transform--fast: transform var(--duration--fast) var(--easing--primary);
    --transform--average: transform var(--duration--average) var(--easing--primary);
    --transform--slow: transform var(--duration--slow) var(--easing--primary);
    --color--fast: color var(--duration--fast) var(--easing--primary);
    --color--average: color var(--duration--average) var(--easing--primary);
    --fill--average: fill var(--duration--average) var(--easing--primary);
    --background-color--fast: background-color var(--duration--fast) var(--easing--primary);
    --background-color--average: background-color var(--duration--fast) var(--easing--primary);
    --border-color--average: border-color var(--duration--average) var(--easing--primary);
    --box-shadow--fast: box-shadow var(--duration--fast) var(--easing--primary);
}
body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin: 0;
    font-size: var(--font-size--m);
    font-weight: var(--font-weight--default);
    font-family: var(--font-family--primary);
    background-color: #000;
    line-height: 1.78;
    position: relative;
}

.app {
 
        --color--body: rgba(218,209,255,.55);
        --color--theme: var(--color--light);
        --color--border: rgba(218,209,255,.2);
        color: var(--color--body);
        transition: var(--color--fast);
    

        padding-left: var(--padding--body);
        padding-right: var(--padding--body);
        transition: var(--opacity--average)
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    color: var(--color--theme);
    margin-top: 6.5vh;
    margin-bottom: 1.5625vw;
    font-weight: 600;
    transition: var(--color--average);
}

address {
    font-style: normal;
}

.btn-unstyled {
    cursor: pointer;
    border: none;
    background: transparent;
    padding: 0;
    font-family: var(--font-family--primary);
}

.ClipboardCopy_clipboard-copy__vP2LJ {
    border: 1px solid var(--color--border);
    border-radius: 0.4rem;
    padding: 1.15vw 1.5vw;
    color: var(--color--theme);
    font-size: var(--font-size--m);
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--border-color--average);
}

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

.ClipboardCopy_clipboard-copy__tooltip-wrap__60C_F {
    position: relative;
    margin-left: 1.042vw;
    flex-shrink: 0;
}
.h2, h2 {
    font-size: var(--font-size--h2);
    line-height: 1;
}

.h1 i, .h2 i, .h3 i, .h4 i, .h5 i, .h6 i, h1 i, h2 i, h3 i, h4 i, h5 i, h6 i {
    font-family: var(--font-family--secondary);
    font-weight: 300;
    font-style: italic;
    letter-spacing: 0;
}
.Header_app-header__Q8cTh {
    position: fixed;
    z-index: 3;
    top: 3.13vw;
    width: 100%;
    align-items: center;
    padding-left: var(--padding--body);
    padding-right: var(--padding--body);
}




.Button_btn__Y5LNn:after, .Button_btn__Y5LNn:before {
    content: "";
    transition: var(--transform--fast),var(--background-color--average),var(--opacity--average);
}
.Button_btn__Y5LNn:after {
    width: 62px;
    height: 62px;
    border: 1px solid var(--color--body);
    border-radius: 50%;
    position: absolute;
    left: 4px;
    top: 50%;
    transform: translate(-48%,-50%);
    z-index: -1;
    opacity: .35;
}

.Button_btn__Y5LNn:after, .Button_btn__Y5LNn:before {
    content: "";
    transition: var(--transform--fast),var(--background-color--average),var(--opacity--average);
}
.Button_btn__Y5LNn:before {
    width: 1.2rem;
    height: 1px;
    margin-right: 1.3rem;
    background-color: var(--color--theme);
    transform-origin: center left;
}

.Button_btn__Y5LNn {
    position: relative;
    background-image: none;
    background-color: transparent;
    border: 0;
    font-family: var(--font-family--primary);
    color: var(--color--theme);
    text-transform: uppercase;
    text-decoration: none;
    font-size: var(--font-size--s);
    font-weight: 700;
    letter-spacing: 1px;
    padding: 1.7rem 0;
    display: inline-flex;
    align-items: center;
    transform: translateX(0);
    transition: var(--transform--fast),var(--color--average);
    cursor: pointer;
    white-space: nowrap;
}
.HomeContact_home-contact__email-btn__mXSWR {
    margin-top: 1.15vw;
    margin-bottom: 1.47vw;
    width: 100%;
}
.grid {
    display: flex;
    grid-gap: var(--grid--gap);
    gap: var(--grid--gap);
    grid-template-columns: repeat(10,minmax(0,1fr));
}
.formulate-form {
    padding-top: 2vw;
}
.spacing--primary {
    margin-bottom: var(--spacer--primary);
}
.spacing--primary, .spacing--primary--top {
    margin-top: var(--spacer--primary);
}
.Home3DGeometry_home-3d-geometry__utBRG {
    text-align: center;
    position: relative;
    padding: 1vh;
}
.HomeContact_home-contact__phone__kDukY {
    color: var(--color--theme);
    font-weight: 600;
    margin-bottom: 0.3125vw;
}

.HomeContact_home-contact__address__MPeQ5, .HomeContact_home-contact__phone__kDukY {
    display: block;
    text-decoration: none;
    font-size: var(--font-size--s);
}

.HomeContact_home-contact__phone__kDukY {
    margin-bottom: 5.32vw;
}
.col-start--3 {
    grid-column-start: 3;
}

.col-span--6 {
    grid-column: span 6/span 6;
}
.Home3DGeometry_home-3d-geometry__content__FPKDT {
    position: relative;
    z-index: 1;
}

.Home3DGeometry_home-3d-geometry__background__8O89n img {
    object-fit: contain;
}

img, picture, svg, video {
    display: block;
    max-width: 100%;
}

.Layout_layout__TvZFV {
    --color--body: rgba(218,209,255,.55);
    --color--theme: var(--color--light);
    --color--border: rgba(218,209,255,.2);
    color: var(--color--body);
    transition: var(--color--fast);
}

.Layout_layout__background__S_XZB, .Layout_layout__flare__3fWBB, .Layout_layout__lighting__3_06D, .Layout_layout__noise__zk9Qy {
    transition: var(--opacity--slow);
    pointer-events: none;
}
.Home3DGeometry_home-3d-geometry__background__8O89n {
    position: absolute;
    z-index: 0;
    top: 0;
    left: 0;
    width: 100%;
    margin: 0;
    height: 100%;
    transform: translateY(-7vh);
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    mix-blend-mode: exclusion;
}

.Layout_layout__lighting__3_06D {
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    position: fixed;
    z-index: 1;
    mix-blend-mode: plus-lighter;
    background-image: radial-gradient(circle at 60% 190%,rgba(0,91,255,.25) 0,transparent 70%),radial-gradient(circle at 35% -60%,rgba(0,91,255,.36) 0,transparent 90%),radial-gradient(circle at 70% 160%,rgba(255,0,98,.15) 0,transparent 85%),radial-gradient(circle at 60% 145%,rgba(255,0,98,.12) 0,transparent 100%);
}

/********/


/* Contact */
.app_content_before {
    position: relative;
}

.app_content_before::before {
    content: 'Luna';
    text-shadow:
            -1px -1px 0 var(--gray--900),
            1px -1px 0 var(--gray--900),
            -1px 1px 0 var(--gray--900),
            1px 1px 0 var(--gray--900);
    color: var(--color--light);
    opacity: 0.08;
    font-size: 15.802vw; /* (265px * 100 / 1920) */
    line-height: 0.7;
    position: absolute;
    left: -0.344vw; /* (45px * 100 / 1920) */
    bottom: 0.70vw; /* (16px * 100 / 1920) */
    z-index: -1;
    font-weight: 800;
}

.app__contact__title {
    margin: 0 0 0.938vw 0; /* (18px * 100 / 1920) */
}

.app__contact__city {
    margin-top: 0;
    margin-bottom: -0.260vw; /* (5px * 100 / 1920) */
}

.app__contact__phone {
    font-size: 0.729vw; /* (14px * 100 / 1920) */
    color: var(--gray--700);
    text-decoration: none;
}

.app__contact__phone:hover {
    text-decoration: underline;
}

.app__contact__email {
    font-size: 0.781vw; /* (15px * 100 / 1920) */
    font-weight: 800;
    text-decoration: none;
    color: var(--color--dark);
    transition: var(--color--fast);
}

.app__contact__email:hover {
    color: var(--color--primary);
}

.app__contact__list {
    display: flex;
    align-items: flex-end;
}

.app__contact__list li {
    margin-right: 4.688vw; /* (90px * 100 / 1920) */
}

/* Social */
.app__social {
    display: flex;
    align-items: flex-end;
}

.app__social a {
    display: inline-block;
    padding: 0.417vw; /* (8px * 100 / 1920) */
}

.app__social a:hover svg path {
    fill: var(--color--primary);
}

.app__social svg {
    width: 1.250vw; /* (24px * 100 / 1920) */
    height: auto;
}

/* Footer */
.app__footer {
    grid-area: footer;
    overflow: hidden;
    padding: calc(var(--spacer--y) + 1.5vw) var(--spacer--x) var(--spacer--y) var(--spacer--x);
    display: flex;
    justify-content: space-between;
    padding-top: 0;
    padding-bottom: 0;
}
.app__sidebar,.app_content {
    padding-bottom: 0;
}
/* ==========================================================================
   Helper classes
   ========================================================================== */

.list-unstyled {
    padding-left: 0;
    margin: 0;
    list-style: none;
}

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

.app__content h2 {
    font-size: 1.6vw;
}


/* ==========================================================================
   Media Queries
   ========================================================================== */


    

@media (max-width: 991.98px) {
.Button_btn__Y5LNn:before {
    width: 1.2rem;
    margin-right: 1rem;
}

.Button_btn__Y5LNn:after {
    width: 44px;
    height: 44px;
    left: 5px;
}
}


@media screen and (max-width: 992px) {
    :root {
        --font-size--p:  4vw;
        --font-size--h1: 9.5vw;
        --font-size--h2: 6.917vw;
        --font-size--h3: 2.188vw;
        --font-size--h4: 6.35vw;
        --font-size--h5: 4vw;

        /* Spacing */
        --spacer--x: 7.7vw;
        --spacer--y: 5.6vw;
        --spacer--primary: 10vw;
    }

    .app__sidebar, .app__content {
        display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    }

    .app__content h2 {
        font-size: 3vw;
    }
    /* Component */
    .brand {
        width: 17vw;
    }

    /* App */
    .app {
        display: block;
    }

    .app__content {
        padding: var(--spacer--y) var(--spacer--x);
        padding-top: 0;
    }

    .app__content .btn {
        margin-left: auto;
        margin-right: auto;
       
    }

    .app__title {
        margin: 0 0 0 0;
    }

    .app__title__chunk::before,
    .app__title__chunk::after {
        font-size: 7vw;
    }

    .app__pretitle {
        margin-bottom: 4.5vw;
        font-size: 3vw;
    }

    .app__content br,
    .app__sidebar__line {
        display: none;
    }

    .app__title__carousel {
        height: 30vw;
    }

    .app__contact::before {
        font-size: 27.8vw;
        bottom: -13.333vw;
    }

    .app__contact__list {
        flex-wrap: wrap;
    }

    .app__contact__email {
        font-size: 3.8vw;
        margin-top: 4vw;
        display: block;
    }

    .app__contact__title {
        margin-bottom: 5vw;
    }

    .app__contact__phone {
        font-size: 2.8vw;
    }

    .app__social svg {
        width: 2.4rem;
        margin-top: 2rem;
    }

    .app__footer {
        display: block;
    }

    /* Button */
    .btn {
        font-size: 2.8vw;
    }

    .btn::before {
        margin-right: 0.9rem;
    }

    .btn::after {
        width: 44px;
        height: 44px;
    }
}

@media (max-width: 450px) {
    :root {
        --font-size--p:  4vw;
        --font-size--h1: 9.5vw;
        --font-size--h2: 6.917vw;
        --font-size--h3: 2.188vw;
        --font-size--h4: 6.35vw;
        --font-size--h5: 4vw;

        /* Spacing */
        --spacer--x: 7.7vw;
        --spacer--y: 5.6vw;
        --spacer--primary: 1vw;
    }
    .app__content h2 {
        font-size: 4vw;
    }
}