:root {
    --atom-size: 180px;
    --nucleus-size: calc(var(--atom-size) / 2);
    --electron-size: calc(var(--atom-size) / 2);
    --electron-orbit-size: calc(var(--atom-size) / 2);
    --electron-speed: 4s;
    --electron-speed-alpha: 6s;
    --electron-speed-omega: 5s;
    --type-step: 1.333;
    --p: 1rem;
    --m: calc(var(--p) / var(--type-step));
    --mm: calc(var(--m) / var(--type-step));
    --h6: calc(var(--p) * var(--type-step));
    --h5: calc(var(--h6) * var(--type-step));
    --h4: calc(var(--h5) * var(--type-step));
    --h3: calc(var(--h4) * var(--type-step));
    --h2: calc(var(--h3) * var(--type-step));
    --h1: calc(var(--h2) * var(--type-step))
}

* {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important
}

body {
    margin: 0
}

h1,
h2,
h3,
h4,
h5,
h6,
.-h1,
.-h2,
.-h3,
.-h4,
.-h5,
.-h6 {
    font-family: "boska";
    font-weight: 400;
    margin: 0
}

h1,
.-h1 {
    font-size: 7.5rem;
    line-height: .8
}

h2,
.-h2 {
    font-size: 4.2rem;
    line-height: .9
}

h3,
.-h3 {
    font-size: 3.15rem;
    line-height: .95
}

h4,
.-h4 {
    font-size: 2.4rem;
    line-height: .95
}

h5,
.-h5 {
    font-size: 1.8rem;
    line-height: 1
}

h6,
.-h6 {
    font-size: 1.35rem;
    line-height: 1
}

.-p {
    font-size: 1rem
}

.-m {
    font-size: 1rem;
    line-height: 1.333;
    color: #a689d2
}

.-mm {
    font-size: .8rem;
    color: #eadcff
}

@media only screen and (max-width: 1024px) {
    .-mm {
        font-size: 1rem
    }
}

.-up {
    text-transform: uppercase
}

a {
    text-decoration: none;
    color: #e6f3e8
}

a:visited {
    color: #e6f3e8
}

a * {
    color: #e6f3e8
}

a:hover {
    color: #e6f3e8
}

p {
    margin-top: 0;
    margin-bottom: 0
}

@media only screen and (max-width: 1920px) {
    .-w-h1 {
        font-size: 7.5rem
    }

    .-w-h2 {
        font-size: 4.2rem
    }

    .-w-h3 {
        font-size: 3.15rem
    }

    .-w-h4 {
        font-size: 2.4rem
    }

    .-w-h5 {
        font-size: 1.8rem
    }

    .-w-h6 {
        font-size: 1.35rem
    }
}

@media only screen and (max-width: 1024px) {

    h1,
    .-h1 {
        font-size: 6rem;
        line-height: .9
    }

    h2,
    .-h2 {
        font-size: 3.36rem;
        line-height: .95
    }

    h3,
    .-h3 {
        font-size: 2.52rem;
        line-height: .95
    }

    h4,
    .-h4 {
        font-size: 1.92rem;
        line-height: 1
    }

    h5,
    .-h5 {
        font-size: 1.44rem;
        line-height: 1
    }

    h6,
    .-h6 {
        font-size: 1.08rem;
        line-height: 1
    }
}

@media only screen and (max-width: 1024px) {
    .-m-h1 {
        font-size: 6rem
    }

    .-m-h2 {
        font-size: 3.36rem
    }

    .-m-h3 {
        font-size: 2.52rem
    }

    .-m-h4 {
        font-size: 1.92rem
    }

    .-m-h5 {
        font-size: 1.44rem
    }

    .-m-h6 {
        font-size: 1.08rem
    }

    .-m-p {
        font-size: 1rem
    }

    .-m-mm {
        font-size: .6rem
    }
}

*::-moz-selection {
    background-color: rgba(0, 0, 0, 0)
}

*::selection {
    background-color: rgba(0, 0, 0, 0)
}

html {
    scroll-behavior: smooth
}

html,
body {
    padding: 0;
    margin: 0;
    background: #1e1131;
    color: #e6f3e8;
    font-family: 'system-ui', sans-serif;
    font-weight: 400;
    -webkit-text-size-adjust: none;
    -moz-text-size-adjust: none;
    text-size-adjust: none
}

html.scroll-lock,
body.scroll-lock {
    overflow: hidden
}

body.-noscroll {
    overflow: hidden
}

body.-touch-block {
    touch-action: none
}

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

input,
textarea {
    font-family: "boska";
    font-weight: 400;
    font-size: 1rem;
    line-height: .8;
    background-color: rgba(0, 0, 0, 0);
    border: none;
    margin: 0;
    cursor: text
}

input:invalid,
input:-moz-submit-invalid,
input:required,
input:optional,
input:-moz-focusring,
textarea:invalid,
textarea:-moz-submit-invalid,
textarea:required,
textarea:optional,
textarea:-moz-focusring {
    outline: none;
    border: none;
    box-shadow: none
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus,
input:-internal-autofill-selected {
    background-color: var(--c-black) !important;
    background-image: none !important;
    color: var(--c-white) !important;
    -webkit-box-shadow: 0 0 0px 1000px var(--c-black) inset
}

input:-webkit-autofill {
    -webkit-text-fill-color: var(--c-white) !important
}

input:focus,
textarea:focus {
    outline: none
}

figure {
    display: block;
    margin: 0;
    padding: 0
}

button,
.button {
    font-family: 'system-ui', sans-serif;
    font-weight: 400;
    font-size: .75rem;
    line-height: 1.333;
    color: #e6f3e8;
    border: none;
    margin: 0;
    padding: 0;
    position: relative;
    background-color: rgba(0, 0, 0, 0);
    cursor: pointer;
    display: block
}

.button.-disable {
    pointer-events: none !important;
    opacity: .5
}

.xembattu {
    position: relative;
    min-height: 100vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    width: 100%
}

@media only screen and (min-width: 1024px) {
    .-w {
        max-width: 90%;
        margin: 0 auto
    }
}

.texturing {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none
}

.texturing::before {
    content: "";
    display: block;
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHgAAAB4CAYAAAA5ZDbSAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAeKADAAQAAAABAAAAeAAAAAAI4lXuAAAiS0lEQVR4Ae2dza8lSXHFbxs8Y9mDLctYthnL9oztJ8SGHSs2CCG+kUBiA0JixY7/gf+KBVvEgh071JZ3xpJldsiWQBrGeU7FL97JuHW7mRl3T/fMS+ndiIw4EZkV+VlZde+7XC6Xu09/+tN3ovV3efvttx/Bh1x6JeNeffVV8Gf08pnPfGbKD+v7cqRX2nAf+9jHkKO7oj/60Y/+KOykv3z+85/HDirx3cc//vHNv4SR0EkEnxR5mFzuXn/99cZ8/etff6NsLxXHxi7dP3z5y1/+5xLI5hJ1B3f37W9/+29Xxj4/+9nPGiflaBfKlGq2Gbq2FUbAiyrw5ptvJgBQyoxdH3er0n9KRvlPfvKTd1GptokLE/wuGtx5ycSsdKdGlQ8uqOpjnRHHB74t/+Y3v/lXi2kfJzz4xNi2sArsRxb/iHKlXCnx6SN5cE+UxUAB5wLqA9ndjP8XvvCFf1U9KmYu60ZHlY+Z7n7wgx/88RLif+/lo7EuKwivLfA2otVrsxeHMwpM2gVRk2j8xF3UWao3A930Vbf2VxctbMvKcLMLWcrvctSr7PIjeHe2lFUsrE+5BCvlbOG8pccHvrfypco4Lv+vTBtmhZzZxmDZZq/qVHJDWR0ct3wWGA1xqZFLRXFwOnpnJaOwLlSyGdSyuypD8tnLCysC/oy600xsdIxpD/QuAmWM4lLL0mYTSxW26JOmLnniAdVAIiEzjXaRXrL8Sxl80g2chtvIlYUaRdNj9WYaOG0uMX1u8mXu9SumLrn0WqOgR89046/16qMGxEcENBuBcoQUT2p5dVbnmQIXqPUYiKoeGt10BHWuWDvxfxc+Mcdf0ivdmCXBgoMiTyqd8ppZtbyYz5hIF6Pd+m2a+MY3vvE3AikxPSw2C0meDkBDy4y17XC+8tnzCVr4tM3Xvva116es8nMUXmqNkZ3S3Q9/+MNXRetPMqXMN39yTRObeexEndI+YgVOmMYGf6Y3rqbluW6Cv/vud7/75y74+LBNxrPKYB0Xqm1tEr3Z+QC44b/4xS/+S8mkdwFiIiGDSkUhdBJ0LQ8MMujlS1/60j+FfrGXu+oA7M4lo+HTt8T2o46UjVHy1q/A/rVksaFrXWGpj6k6VUyTjF7ZvOjLVzfGdkFxkb6I+rg1Wlgj8zZA/q7yS2T5oE8rO/Vy2z4y6FJUQn92yyeI/dUeoPPIg97SpVy80l0OBnWcnFminge66iA7BKLgYtqVGAy3aJss9cE3xhdbCqZclEwRiZFOybJbo0QjKNaaw2LtxtkJx8i5tdnCxjR8ZV3EKzWNwFzhah09LI7PxjCiyxdyofANj27Kpc+EfmuUilf6ACdb5Pgh/yQK1vbZqVBkASlDnhS+cXWrgVzUDcuGaQX1oyt4r7FurHXrE8Loj3tq1uXYuVpfuEXuk8pb/vpgYGluYkMnB8Jpc/IXGmkj0K0vnLESroT/5qlvXPsVpuywyaXllu/GilEiZkfOn9h64BGv2OyhF7h5MaxX5kNJ3ga1qdhkA2tcyU5xseajb3oj6NavzvAPUdZTyxEgEmVIBG8anaV1tQuVvmXF38p7V6vOo6DT8OJjRsGWTeLd9773vT/Dr84WFk/dcu+CzPWpRk1Z8rjbqAGrch+KUx1deay9ymaANr5GqmVjKfJMIOOVpCdhTx6acvApaxydowTGaHl6jzPi/UWyRlJiLfrKumJsAiTI6Vb5lai0sbofPgvm6K3YXNlPfwKs1BerzHe+852/lEz8WdIImiOybrOwoXyo3Ewe18ihxoZ/bgmlJ23YaqjLV7/61TcXAFzTGKHYi879TOMLRBkb9Xo8phA7k0MMn3eFNM1V+V2HyLes1m9fUNyPVrWf2kDC2de4/t7wae8gUHVQbotcXjXChRFOXviVqCN8drDUWZ8DRgLiLX4llxcUmWimPPSRnEOaLq8d1U4ThemtXiVHVYrtFazcHUunGSE2NXNqs93wIzPLy5ft1fDZGLWk5Ebkib7wKVp+XI42KAQ16m4dNmNWUzmPmJnqICLLht98yBfl4LfywiuZxikUstQnb6PxwbUJx593lq9IEFMXStP3fJoyasEutMRZlkSZh0cOzU1hy8SshI1pjfRDc3y2PkaeZJ1qI6g8WPjGFHNXhzLIweMv81N21TmzAy+Hvr3SCKczSVZ/XV50mpYNjI3OlDhOp/DdG1l/tAlRRWIUcEH4hrYPVSR21Wd6yTZ8gaaM/LyP9xT7IT87d8gIUAa01x+CPG9jxtSND1El56NXph6eNYe8KGnKMs+6lljx2JvGcoN8e7SGsexYT8tH4wujPDL4pIKhL5MX48UAKkMFqWTTHJFMFbURwmb6QE4A0JPXAYfuaZUopzuTOs1TOs5hedjik5GLP44NebJi3Fgv7SemOGy3ekUdKQvcrfxWv+HfNhFTysKX87Xmm1+x1vN49KIkeHSSz6XL2AQYZGk5Vc+Okdv6k0OPMjM5LXxpXFZuJGK9w76nf/BBG4MsNip5HZQvvOUVVDBQ+5OuzpEbX3ZbXuth+hllgzUdSw/liWYijx4dcuXR5U7eOGadb33rW38vXAwM27OZPHNmB+m8BF1YOU3c5BsbtmJz3QVz4WmR9Kzr4vU3bv6X6P6ii5eMHfpph8wHAXkfHrdY1AWKz9dubQprJw8earv1QV5UaeYP6fFpTAyaxMM3rZl0+st88ucBr/vABJqP6aMLXAzbc2TYKa/k/Gw45KJjrcZG9Gr6FV6KlSjnSTRxNsJu9Pj2oc4WJ1fYQzlD94jJA4vspBQ0qMtg5JXurEN2XRYGPl2lTDyp5Yp1jmArVMFoWN/DLktun+QEBzi9yrNOV4nWx32k7SqwbHiMYeorSlnQLkejZvTgK8wSNF7BlM1sMI3os7qWrX3WIb54JWaSI7c+qevJYf+tZcZ+5CuWPcdEMilXMn1S3SKeh0XZUI9cAnFIQMhDkZvSI5bS6wEbCC5URiu1zaiI5C/TAQHXsV1TXp+uZ3aceIDg6xV+dTCdzilJpjSPHnOWynKNFV7MSvn49vKVr3zlHw/xvZ58zIjdIHawPiiM/Oy5VEBT1RsLROHGs7mIM+LGFxY8ctmR0M285aNn2p6jPmYFGaZMI5i8dPW+2OX73//+nyjP2hxLD1Nb1g/e9Ri3X6lLXu69t9BAqDpIlLzz+ljJvoNaqHzOqhISYwDC1N/ZWziG4Txs7tnYZCQOp9B7g4NDPqm0U0aPlpwERvnceKH3O92VyUMZ49WDs94xinjLw7j14XI+qMtTXuTkn5SnIWiEu4dd9fayYcdFQaw0ZTMPTlQ6Pa3TC5DmiyYviPNjT5IY+KMXY4Cz57gRUEWe9LfUrb/ia6Tm1JqY9MuBytST32jcoxOobfPEkqFN3DIEIx9KWS48ctFHMdXaNtZzfGHXVFP9Ks8vDKqMWiblj9RYCfQdH6dlqFOfDMDjX/ziF6hFs1Dnf/nLXz6WvDZb4pUea9P105/+lLzstK57Pfrxj3/878L85je/kSgTeMmu+LVGgqUeypv/9a9/Lf7xb3/7W1ElyR+vQPzn2gv8tyXHx92qM1mV4XJi/U7fl5/85CeutwxqDX3885//XFn75xreeuutv5NQKdbLq2tYatsZeLm8/fvf/779S7biLRswepDxuxXbgps8/tWvfvX4Zz/7mZ6BOz169Oh/4auDZLl3fqYZI1VYX2RMD87jpCgy0cmzXhoaowAXdAjlsYc2Bl11HvRZ1oatnXziwPp25oN6UhW7Za43qXl9sMlx0KLBratgSzfv36beGH0o1RTmQg6JP7FRphs7prt8oc4Y4ZiGoZKNegp79vAiyxOEfNKcuZALO9+Nsmx9gBFVIr/xEfyU22bcWlof1wYein/TONmzL4FWsi46+iHls4JloBbtGjnOg1k0Cwpxy8GDM6ZuKxIPnzjxSpz3mueGP3bB4AwWvhh8kbd96T/MDzi6cQjM9sJ2BS+DZX4t7voaaQa17ZGfHHTwLYD0Zzs2HE/o9dpczCcrWaZ8kugkW/2yExcw7cFK1TwdrGRlZpKbup5hCoA91OIYtSkXr5SyQ3L/mTrxrN0p32abFSvNhJ0S2Pzcfs8pMc5y5Qg7USXno8FSD382pR7WN/zhlym9wFmmRM7XzNFlSVHTW2PErJQNtOEPdV+bscKPP+SiJA40jM1Doehoxi7dM/uieFcGZtEP7MWODpqNxOVL5vQB2j90b9SF5UXDI4fm5qZlYlbCxrSm8UNzfLb+1q1J7LrB4jf9WPYSvA+V10D9LYvbKeWVoPDkjTdifaypN++5rTvpuLsPptGYcj29xBqahcDnd2ZxyDGgMJmwkcy8yhxr0sMbmDFAxiaXTS9xNT1ZplIP73bAwa1G6YZJwOLlJA/DcQqddsbj4131xlXeyT16+qVsZNCtLmzqVP/5N0ZE2rEbp4xNV35SJj4TZUkGb1qbIvxaNpYJ8Pg7y3uEL1/5FZou6DKmjVMH8p4jGx5aFRcMe+gtGfegdDLwt2j68aunbAZ5daXK3nDKVJJfJfxvPL7Qz8aOWS7tNp/MiPgY9LlvLH2hGhVxk8zFQ7Ut3y5ivMCGri+6AtN5MSt5A1ed4ZAcnw9fK91/yoq4E6NbeeRnFFvTbUu/JDJwqldSxLdMmVg/lVU6K8QvBpx0nIm3A/kYGzM/BowO0WXMty3iSDN9m9dUJx+Mxqh7XhO+bRO/M3LlbwnAQsFALa8liJcCJEMPxX7SM/2VLGYT7IUhtcwMjaAzW83hMc2wc7t6E395kq1SUhyblh9j1ChsHiLI2BsfUz3yh7dAFIkV4+joyjOrZrwlV0J2ZFh3YlcGQJSG3V7L1NOVaAzwgsM/7LIVjSN1TCJm0kj+zDuwC6nCKDTf/aFy0ik5/7DGdizMxIfio8SyZ57lQfL4k04J2ZG7zyM/o2Btf/bTDQA41zSwhHLIM1DzKzsLEQQZPPTMBh2v2mALlZ6U9nxNM3XYEETn62nMxJ3l8xWfLMt+WEa4TVHjaJaLZQUbfENtvzKmcSt2ppdswxdoysgzJWPnu4+nfe+qfG6NKYdKOE6KHIqOfFOCJMFK6TPz2y1X4U5fjL9xC8cyIZ9KXU6u/SVHB47n1lzDRmMPgh2UQJPHrv1GeeiSJk68kvUnmybL39N72nkhVUAX6KLvg7bJeQdXlYueyoWU6UHU2DrkZ4RpJKwGm78Ye/XVDPk++cN362Lz0TJAQVMHL7V4NpLmMybS3dibGLvU2VEEt7ze2jSv/QqzgQArte2R3T6t0wOIkiZWfMbJefZQ0vHXnQVljZA+dMgGpOF5IE1+VEBZFxAXo3ymnFItPxnpXckynD4kZsNXkJsPSOyLW57Y4BBw7O0zMlsdVrDfuKFLXPPckZSN5LxAh5uJldy4oujP5MjAQC0fy4h9+kPalR7uQ88DTYwIpmmPksMGzBHJexlrd9sy40XnZnZrTDmZPt1G44v6htZAvSobAdQF1Nv56Vz8I1UoeohsjI9XSNpPXHw/gBjPYm2LjzJEpqx40uTPcBvmbA1ep3WfyFGM80Xxd0WZ4W5M0y/DLaQvMy9MAgeLHkawTi7S2DqxsaP6SH/wqbedPmh0HbDUm4sumzIxitsMi2gopt8lpJykws78lLFsSO6kTsy16tpUr6zbAuFTePFOOgtnn1EidMbHtz2kxgeDhvwlNpTguPMgb7/ELnyhv6faoakh6wKsCP4eeH8hdi5FpXyaZBFTEIBFu/LyzddFsA8cLGVAJW8fo7FbHhhk0A/1D5w6COPhgQPNCK7AWXaDJ5CiSrfyh7b0w79tzpaA8me/uWNeo2u+o5X+jU/b0THQb093mBnGTtp1C/uz6zTmKU+0bBezk22q0v4WpOobm9gsh/puMi0hsak1ZswiD98UVFDXHw8FFCSl/KlB6yXTOb21h41x0emUz/tk2dEgxkY+Twv/0G8K6ln4J+Sjvllo38y4owN22QbFLiwr5Eplb+ZWSYqVcAK1MEZhyvGbMuPjI3XiFSyllN96e1CY3tCVjUTYbrRmD8tyQyiDlezrYDuf9mBoTPIv6jcxj4sYPZGLTJoXaV5noNWr0fXFLmaT1aNAy+qtDBdcHxs2FFfy6HCC9bHjw7381jGPuMVz1Q4UAVcgYz7P6YmR4gAryPr7oH4FUzvpmv4qNMePf8est8WhQJw4tU3sei1jpstDJWzP9ifoFu1n2+JDLtb5rNvR0oeCr4Eiw2Bz8pw3CS47NhLUzXICcbJ01HUfnW988966WLM27GgIykuMeOSuB0rkL9pZwsO3Ge4bjONaGjHabv+xmJNOddXojFIavpzRKcBnGfCpE/9u9yN7pUcF2EScVYgKPInKHfpyfeRjY4Pe9D09OTlKkJ+zZP+zUcYo3uqynJBPfykTT2q5ZpuTWY4nX23D7nc5sKzy5tktoyvaZeiAJ6dh9HVuDs6+lq4T91QSJKj5s/VC2AgcF4IPPanR/SqdxXJVJC6o/cuXACslRX9o1mfuHUpovC56lZffy0k/8/FkPmueZWx2UUbKc9d8tYeJztM2FQu5y/JaH3EEU0U3vrHlI5/b69pfwQA9BV0ZClC7XTCynXzKps4+42QLfdOzIFDG6gQPP+O/gnFrtqs4Kf4zEV/LyYiSUjb5XKOEt7563pl9y+KExnYawWdTWcmyPsaXoynHPxQ9lLXrykfMIOhkw1/K4KH4Bpt5ZpfUoZe9EnnTJ8SOI2T7uoE7PI561/R9p4fufOUfSuGq6FtlLd3jVYCyd5/61Kf0swF5pHZZP6PwWA0TDSas7Nrf+rkB/1dNydZO9bJ+juDyuc997ncCZtJPMawK8nNBUuFDjzP/Y/zjrNaVD64D+rbkFRzqY53Kr4QPyflDJ4oeip8Ns84RjOVnKkJpfNwJKK/0WEuNYrd4pnjL9bFieamfpTB+xeq/JFdag+XfFrHdoq7X2r/8D2cB+nmNqk9XXnaZZNRrq25HajoVxrqi+fRjkwu4kgsXUwcpxsBDA5c+sD2TMZM8fCNitEfFkpj1Oqs2ILVyCQiydFfyMZ3SC3nC1I2QmzOm6hpV20xwVl70/KyL6zOmWR4cSKdEfaHIrIyPqzpQt/CBrf85p+TZOauO4fI0bq5/7XTBUrebtG61bKtyZThOAtt23JZt31BoECUnrQtGNLGZhxdWvJJlsaFqmbWlB7cCkP+EOrHZEPi2i9rIJRbe+vh4GX6GP2NI1S2LZ8VcP5TrJW88xmy1AZE3+P/xnmwWfivvesQDgYd/n3O0FI220ac8D7ClDNhtYmxFjLq8vxRmbt8lwnaj0VCMQNvLYKXkyac9su0+WnY3jhS1EXtj+O03P+OtiiwDnrLO6iQdCb3pmJ7ti6WD5UiGKdOMSF66ejPlWfyGZr/2qXKouPhMrjTr0sOGq+PkuFSgmucWZckty0EibDW6dErYbfnY26Qenr0GeWyv/dVGwSXVx8NXOZ/tVzlvnfv3NzbXOru9Mz7z1SloTGg2dvJHb3yGU0QW1j3t4V2w/tE2j6sY9TQY1LeqJ7eorV/Hk0/6Z9fHb0i6lD9wigYbU08XtpjTBsWm9OBL3Db+FkEclrSvuCWxTa1f7SfXs4dNoUOUzxXuDzQq4j3SVr6DHDrrI6hnh9x9MJKbkNhw2V1slNiASU75WTZ8VeO+XtH42NmHDt7p3eUzfcBjc2vqBGefdQuHDGodZUR9kL+fPwB3BLMCrwop9UUf2c5vp1GF6x0qedmM+zUCweGAIEpdztmoPSCNo0e2r7J3fmxKZIRvdt/ksQdD/hZNnHglY2OztNm+YI88jxpT6aLZkAB0EX2QnqOybLaLHDKZor/i2Z1HIyUGO5dfa9XUk9/oOPywLjoyHWb74plAlbJceKlcj0Wfy+89q0AtOcRI+ZWoQ9NYo3kpsXE8IGiwpl79nQTT3lVABKplkpMpPvNSKc8xpnkJV0rclLduTbfv/EfAlu861rvlF//oodTL+pf2kefDbdLRwWo/4UaNzSON7UY2sjpp8cavj8Sd8QG/3Frrn9lt0s1KxoaIDdC80K3i40LxyxpI/uEEau8Q2q/kfe9ZB+m4v4vby6P31ZqK863hYrds+ZiesYHSkOnDsjy2W4J+FCm+/owTz5fKYkfaa6ZAlWRHwodlz/WJzX39qU/SySvPn+rOl8/MKx9xAqfjV95u2Y444+mR7JW86dX3v9iDtJNDf1/4S7vu1IXoYusPifLeVK31PH/uz0E92eRd+C5uvHarWx7Ouu3v1pR+a5c96kTdRLO+9p3K0IObeyE6B3qb/0GOyrkMMG4ao8wOA2N8zA7o2Y1bP09xFOjaNVqvxsDwrHdr2orbsr4DqMaxj/VBfU/zsaFsfVyXY0TZde9ufzyrjZFkbJRnnDaIcZ2nmLTR9csmd8fSa2Se1bVsF+mfeBDfr7IcmSMI4l2pePLSMum4qMJpDfkoPHS89egLykMNcDeoy9eFqKwbI8SYZa90xiMTVZp3BbzGkzhjV2BfCfzUd75GvH0LH3/IeLCgvFLesWxT7aE+MIOXXyX7X3XTsSTJstwrLcWp382JQPzlRajRWH+jx6qwxkevR/7Mf+hLBa1EHc54A8bHFuywvxmLwrxU30L0NXOLcGOkCLMFLzZdKb88/K6lw5kxgU9KPKHWaTpeAjqPZEpJ00fy4G7J7Gh+GDxPT6IDnDmlgPSVMvGklmt9zlliAawbMwEPy2VvP9HJfNKDnQAr4d/Yd/AtAOOn/UneZcTU+EK/cbK9ATEWde0Yn9k/jIgOkw1CkB1EfSidbdSWGDtBekdZWO2WH/4HE7dCNYoILoEzXYGaP5WQOAWXNDdgto9OM+2sX8YpNx87RXRdRtSV3TYY0fyzTewX0Ek+bYwdHxOvQxullHP2a1l1KjBsshIPv9GYDfJWx4VVefD4TntkV4dKGAEG2HRV+JWV4b+Ag2tav+2RfvhpIXwYexJkya9S3B5J1+UUMPPw4KC5627Zmf2anT4Ub292oGLNbdkKjHk2UIwe6MnUKTzJtkzF0XjG1BFdYjmPtd3sFEy9y8B6DhI49Sr55k+Z1Un7v3WCicZ1XTAqav/il602P9RLbB61gnuSD3Sm3IVU/Fh67Fe+xazke+CD7U/p5l8ri7E9t6P1a0anRl1QOG1n4x5XcuM1rcYU1XL0sXEyfjQ4ZV7ZSbCS9GDMcyGS15TeejpV2qy6aalRmr4siw4ORlQJfPsvGZs/65f/V4w+PixjeYrOmS/MGZnXwWEK/ovaV/C2izzP2cGl3jyKh59huG9MBeaF+RkG1SX++rROlawkPSeE27l9GiYvfObtYMqYJkMuO1Lb13TbeTZ3TFnLIDdM4OSHcvFpGWfEqY+NmTGlw1fTGKms1+A1JXMsmuViK1ymlINPGVim9Q2jGY3NlU4DNcMwded7ZSwnzHhjlJ+V518QXP76e9K0uMGsr9Ru0XRCpTjYyErL5GwXaHlN0eKVruxKRlmmT3lrH6z9VSAsq4f8kpM2LMJFr+Tj+nv6ryPZl+77Vlyg6FWi15RiYjMPLyi+LIv1EN2mL7zuxz8Uu1oFoVLGTKKZb1mc92fsys1mt/uYGx+Gfy38BjO9jl1tF07F1pTw/jwxWYGJjYovmrrmtxorGj0DUe+iUvt6o0POYDr/hKXgHa2NlPcE2nUSs5Lrd7D3S9qccQJH/W1CxjR3fRhwPEgnkFXKNNrJS/fwMr2i4EZJCu84R2fa5GUnzPx7pz+sulXAhapHcNvxlB/XVKWUbFf0iscX+rgoY2Ojhi/JNz/RS9ElzVsP5PKlRF5UKfPsPQ7NXibYy5oe85UaY2PGwK/xuYFbgtThD9lWj8CiF14pB807PlY+XByfWaAdy/n4Qw5lF0qlwLce+4f1tWOp2JAcr3e7vmpJXI622I/Bg87lkfEXpNm+h4OejiXLXWo5lRNX+IRyRsoNubGzgjVKrYvNHT4t19sb4d+yyrO7lcwp3uhQ/tbbjJt/4QQ+uSaJE5t55LaVIu0jVuCwFVXC7kxv3YrVK8KN20Pw/HKtneEv4tkVt7MCwMvIjvKeFRmbGYFW6gKPbP/MgXWrkvOhRcHOLzB644bLzscm8WwKD3uuJetn/ilLkO0iUNhzPR5BsScxfimTJu9OOI53uf/frjEwlGk/tEEsBa4LxlV2/hTyVWXs8GSTlY5c2Mu8NkXdiQ3HrL7+vGcfHcX6MsolCjm0/cJEoyESTXzv8In/GhTv6ZHnVlCOgpMeQkVEnWL0opMcfcoOg/vP1Il/6R7DxSZLV8X1bJugutz+7la849b4sE0/ZWoibCbypnSEAtgvdzLMLBYugCo3/xkT65pPp56y26US7W8Jeu2lAjzhiN7M+oGdoUxFKyM56YzHDt2tfProkbKEjY8OK2zLy3DuH16W5aYDmAHyBfLidF2sZRl4es/YLFU8tgARLPsowEvx5S3d4uU1c3GLck3EDRVy5eEbU0sD2KRgsTONTset663z8s1uZdqfC58biZiubahhr784xWkHAqyUgTgkUUgJpo3tZPscbhWybO4CNpnqEfXsupU8deZ5YBJ6/M21efNVMyX+Nl35Spn4TJQhGbxprNf3utxAFADl+/66ycu0ziloufZpD0NeuvfrVE9lq/V7rYzdI28VSK+0vf34cJ+6j/Y1OF5RjN7lfapHoOxzSla+/hbZU8RfCnCiSls+M6eAaWAXy0mtTbaJHWKpd6IpPzZWUmYwnJcs/lIGL6qUuK5z+Kczoksb86yr9SoSuKZjQykbpdxoOW/pUR/y8rH9vd+PPKlMV3D1xif9agv4puq1MR1tb0HUESXYLiNnigiI9ErgRZWg5uNsO3XYILNNjQh0m5/ymzp47h7kS8nyp4wa47g1sdWyU1zm/kb+xh6n4H2dWU90SdFDuc0UBhl0+yE0AFLe+kvMFV9BmBdw5iuDmHp8bvRhR3+8d8bMs4KjmJFm/FLeQED8TjP5jeamrLy0/nnuDmM6VjWoQ16YZCTza2b6yPr7sHxttGPSTEXD+ZjaLK4pWHzi4UVJU5Z5cB7h0VnytdTejS6HjS8+fam8M/2U8yhRcqW0yXw+rO9yTm6FLuOWrrGx7KRfZjNk4JVXcj46LPqmMZ1LpgTtzfEhPnyd8KeKLgCH45fW5cdvYYqJqYOpl0ok9cF6Nazt5UPMSi7vYf2/EL8jKhWXd7v+d2DxRqBvNYIKGj1Vpg+/b/ni/r6lm9ajR42rqTim57wVypEmoz5Et4fqaZJXHkKeMqZceXTswLHpL2nzWC9uX4zR9PWEKaz9qow6OMkfBN/02p2PzZz1uhMYs5fLrnqr/qcpRh144bYyTwynnvyZLYPtzP+BZ6Rq81GF4RCKY2h3AD04kF0EuL/qUbK2WQyVSEoZpmnz8GVzx4vvCyuOSvmcVzHzGjzazrg5y14FfbyNyBn01iBzNMlzpcblbJA6NaZmC3WSce945SPsrnR6W2KU0WUvMJsQ2Vk+/hG2ZCTr6fBLiB/pvXeYQVvyl2Fp2i+kLkwXpbT9O3YFUqcykuuvdtZXQSr9IkcClyN9abDDj8Atu8GDAZd5ZKL+q2ldGCX0yTfWiHsMU/Wmr9eFbD93vUz/5YcyNnsJa7Tlwwiwl3qU6nquZeGNpbD9ySs/+JWtfL4Wy4FE6O3LH6xx0sZtQIInr7y/IrEIDi2rvPiH97tWEG7NChEnx6ryxNLtIkXanzQ2tqJK2NnP/wEiCqFGGHaMewAAAABJRU5ErkJggg==") repeat scroll rgba(0, 0, 0, 0);
    background-size: 4rem;
    background-position: top center;
    transform: translateZ(0)
}

.texturing .blur {
    width: 100%;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center
}

.texturing .blur::before {
    content: "";
    display: block;
    width: 220%;
    padding: 160% 0;
    border-radius: 50%;
    flex-shrink: 0;
    background-image: radial-gradient(circle at 50% 50%, #7B47C9 0%, #7A47C8 3%, #7845C4 7%, #7443BE 10%, #6F40B5 15%, #693CAB 19%, #6238A0 22%, #5A3492 24.5%, #512E84 27.8%, #472974 31%, #3D2364 34.5%, #331D53 37.8%, #291743 42%, #211336 46%, #1E1131 50%)
}

@media only screen and (min-width: 1024px) {
    .texturing .blur::before {
        width: 120%;
        padding: 60% 0
    }
}

.texturing .anchor-blur {
    position: absolute;
    z-index: 1;
    left: 0;
    width: 100%;
    height: 0;
    display: flex;
    justify-content: center;
    align-items: center
}

.texturing .anchor-blur::before {
    content: "";
    display: block;
    width: 20%;
    padding: 1% 0;
    border-radius: 50%;
    background-color: #42266c;
    box-shadow: 0 0 8rem 12rem #42266c
}

.texturing .chat-blur {
    width: 50vw;
    height: 50vw;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 100vh;
    left: 50%;
    transform: translate(-50%, -50%)
}

.texturing .chat-blur::before {
    content: "";
    display: block;
    width: 220%;
    padding: 160% 0;
    border-radius: 50%;
    flex-shrink: 0;
    background-image: radial-gradient(circle at 50% 50%, #7B47C9 0%, #7A47C8 3%, #7845C4 7%, #7443BE 10%, #6F40B5 15%, #693CAB 19%, #6238A0 22%, #5A3492 24.5%, #512E84 27.8%, #472974 31%, #3D2364 34.5%, #331D53 37.8%, #291743 42%, #211336 46%, #1E1131 50%)
}

@media only screen and (min-width: 1024px) {
    .texturing .chat-blur {
        display: none
    }
}

#anchor-target {
    position: relative
}

.breadcrumbs {
    position: absolute;
    z-index: 20;
    top: 2rem;
    left: 1.5rem;
    width: 25%
}

@media only screen and (min-width: 1024px) {
    .breadcrumbs {
        left: 17.361%
    }
}

.breadcrumbs a,
.breadcrumbs span {
    color: #a689d2;
    display: inline-block
}

.breadcrumbs a {
    display: none
}

@media only screen and (max-width: 1024px) {
    .breadcrumbs {
        text-align: center
    }

    .breadcrumbs a,
    .breadcrumbs span {
        display: none
    }

    .breadcrumbs span.-active {
        display: inline-block
    }
}

@media only screen and (min-width: 1024px) {
    .breadcrumbs span:not(.-active) {
        opacity: .6
    }

    .breadcrumbs a {
        display: inline-block;
        opacity: .6
    }

    .breadcrumbs a:hover {
        opacity: 1;
        color: #e6f3e8
    }
}

.link-animation {
    position: relative
}

.link-animation .basic {
    pointer-events: none;
    opacity: 1;
    position: relative;
    transform: translateZ(0);
    transition: transform .3s cubic-bezier(0.4, 0.1, 0, 1), opacity .3s cubic-bezier(0.4, 0.1, 0, 1)
}

.link-animation .hover {
    pointer-events: none;
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    transform: translate(0, 80%) scale(1, 0.8);
    transition: transform .6s cubic-bezier(0.23, 1, 0.32, 1), opacity .6s cubic-bezier(0.23, 1, 0.32, 1)
}

@media only screen and (min-width: 1024px) {
    .link-animation:hover .basic {
        opacity: 0;
        transform: translate(0, -20%) scale(0.9)
    }

    .link-animation:hover .hover {
        opacity: 1;
        transform: translateZ(0) scale(1, 1)
    }
}

.button {
    position: relative;
    z-index: 10;
    width: 60%;
    transform: translateZ(0) scale(1);
    transition: transform .3s cubic-bezier(0.23, 1, 0.32, 1)
}

@media only screen and (min-width: 1024px) {
    .button {
        width: initial
    }
}

.button:active {
    transform: scale(0.95);
    transition: transform 0s linear
}

.button-purple {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem .5rem;
    min-width: 9rem;
    box-sizing: content-box
}

@media only screen and (min-width: 1024px) {
    .button-purple {
        padding: 1rem
    }
}

.button-purple::before {
    content: "";
    display: block;
    position: absolute;
    top: -3px;
    left: -3px;
    width: 100%;
    height: 100%;
    padding: 2px;
    border: 1px solid #7b47c9;
    border-radius: .5rem;
    opacity: .2;
    transform: translateZ(0) scale(1, 1);
    transition: transform .3s cubic-bezier(0.4, 0.1, 0, 1), opacity .3s cubic-bezier(0.4, 0.1, 0, 1)
}

.button-purple div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10rem;
    overflow: hidden;
    transform: translateZ(0) scale(1);
    pointer-events: none;
    transition: transform .3s cubic-bezier(0.4, 0.1, 0, 1)
}

.button-purple div::before,
.button-purple div::after {
    content: "";
    display: block;
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%
}

.button-purple div::before {
    height: 100%;
    border-radius: 10rem;
    background-color: #7b47c9
}

.button-purple div::after {
    padding: 50% 0;
    border-radius: 50%;
    background-color: #1e1131;
    transform: scale(0) translateZ(0);
    transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
}

.button-purple div span {
    display: block;
    position: absolute;
    z-index: 10;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    opacity: 1;
    transition: opacity .6s cubic-bezier(0.4, 0.1, 0, 1)
}

.button-purple div span:first-child {
    width: 100%;
    height: 1px;
    background-image: linear-gradient(to right, rgba(166, 137, 210, 0) 0%, #A689D2 50%, rgba(166, 137, 210, 0) 100%)
}

.button-purple div span:last-child {
    width: 1px;
    height: 100%;
    background-image: linear-gradient(to bottom, rgba(166, 137, 210, 0) 0%, #A689D2 50%, rgba(166, 137, 210, 0) 100%)
}

.button-purple span {
    display: block;
    text-transform: uppercase
}

.button-purple .basic {
    pointer-events: none;
    opacity: 1;
    position: relative;
    transform: translateZ(0);
    transition: transform .3s cubic-bezier(0.4, 0.1, 0, 1), opacity .3s cubic-bezier(0.4, 0.1, 0, 1)
}

.button-purple .hover {
    pointer-events: none;
    opacity: 0;
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    transform: translate(0, 80%) scale(1, 0.8);
    transition: transform .6s cubic-bezier(0.23, 1, 0.32, 1), opacity .6s cubic-bezier(0.23, 1, 0.32, 1)
}

.button-purple.-hover-white div::after {
    background-color: #e6f3e8
}

.button-purple.-hover-white .hover {
    color: #1e1131
}

@media only screen and (min-width: 1024px) {
    .button-purple:hover::before {
        opacity: 0;
        transform: scale(0.95, 0.8)
    }

    .button-purple:hover div {
        transform: scale(1.05)
    }

    .button-purple:hover div::after {
        transform: scale(1.2)
    }

    .button-purple:hover div span {
        opacity: .4
    }

    .button-purple:hover .basic {
        opacity: 0;
        transform: translate(0, -20%) scale(0.9)
    }

    .button-purple:hover .hover {
        opacity: 1;
        transform: translateZ(0) scale(1, 1)
    }
}

.button-outline {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: .5rem 1rem;
    box-sizing: content-box;
    width: auto
}

.button-outline::before {
    content: "";
    display: block;
    position: absolute;
    top: -3px;
    left: -3px;
    width: 100%;
    height: 100%;
    padding: 2px;
    border: 1px solid #e6f3e8;
    border-radius: .5rem;
    opacity: .4;
    transform: translateZ(0) scale(1, 1);
    transition: transform .3s cubic-bezier(0.4, 0.1, 0, 1), opacity .3s cubic-bezier(0.4, 0.1, 0, 1)
}

.button-outline label {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    opacity: 1;
    animation-name: flyXY;
    animation-duration: 9s;
    animation-iteration-count: infinite;
    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1)
}

.button-outline label::before {
    content: "";
    display: block;
    position: absolute;
    top: -0.5rem;
    width: .125rem;
    height: .125rem;
    border-radius: 50%;
    background-color: #e6f3e8;
    box-shadow: 0 0 .5rem .25rem #e6f3e8;
    transform-origin: 1rem 1rem;
    transform: rotate(0deg) translateY(0);
    opacity: 1;
    animation-name: flyZ;
    animation-duration: 16s;
    animation-iteration-count: infinite;
    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1)
}

.button-outline div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10rem;
    transform: translateZ(0) scale(1);
    pointer-events: none;
    transition: transform .3s cubic-bezier(0.4, 0.1, 0, 1)
}

.button-outline div::before {
    content: "";
    display: block;
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%
}

.button-outline div::before {
    height: 100%;
    border-radius: 10rem;
    border: 1px solid #e6f3e8
}

.button-outline div span {
    display: block;
    position: absolute;
    z-index: 10;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    opacity: 1;
    transition: opacity .6s cubic-bezier(0.4, 0.1, 0, 1)
}

.button-outline div span:first-child {
    width: 100%;
    height: 1px;
    background-image: linear-gradient(to right, rgba(230, 243, 232, 0) 0%, #E6F3E8 50%, rgba(230, 243, 232, 0) 100%)
}

.button-outline div span:last-child {
    width: 1px;
    height: 100%;
    background-image: linear-gradient(to bottom, rgba(230, 243, 232, 0) 0%, #E6F3E8 50%, rgba(230, 243, 232, 0) 100%)
}

.button-outline span {
    display: block;
    text-transform: uppercase
}

.button-outline .basic {
    pointer-events: none;
    opacity: 1;
    position: relative;
    transform: translateZ(0);
    transition: transform .3s cubic-bezier(0.4, 0.1, 0, 1), opacity .3s cubic-bezier(0.4, 0.1, 0, 1)
}

.button-outline .hover {
    pointer-events: none;
    opacity: 0;
    position: absolute;
    text-align: center;
    left: 50%;
    top: 50%;
    width: 100%;
    transform: translate(-50%, 30%) scale(1, 0.8);
    transition: transform .6s cubic-bezier(0.23, 1, 0.32, 1), opacity .6s cubic-bezier(0.23, 1, 0.32, 1)
}

@media only screen and (min-width: 1024px) {
    .button-outline:hover::before {
        opacity: 0;
        transform: scale(0.95, 0.8)
    }

    .button-outline:hover div {
        transform: scale(1.05)
    }

    .button-outline:hover div::after {
        transform: scale(1.2)
    }

    .button-outline:hover div span {
        opacity: .4
    }

    .button-outline:hover .basic {
        opacity: 0;
        transform: translate(0, -20%) scale(0.9)
    }

    .button-outline:hover .hover {
        opacity: 1;
        transform: translate(-50%, -50%) translateZ(0) scale(1, 1)
    }
}

.tabs {
    display: flex;
    gap: .5rem;
    justify-content: center;
    align-items: center
}

.tabs .tab {
    margin-bottom: .5rem
}

.button-tab {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: .25rem .75rem;
    box-sizing: content-box
}

.button-tab::before {
    content: "";
    display: block;
    position: absolute;
    top: -3px;
    left: 8px;
    right: 8px;
    height: 100%;
    padding: 2px;
    border: 1px solid #e6f3e8;
    border-radius: .5rem;
    transform: translateZ(0) scale(1, 1);
    transition: transform .3s cubic-bezier(0.4, 0.1, 0, 1), opacity .3s cubic-bezier(0.4, 0.1, 0, 1)
}

.button-tab div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10rem;
    transform: translateZ(0) scale(1);
    pointer-events: none;
    transition: transform .3s cubic-bezier(0.4, 0.1, 0, 1)
}

.button-tab div::before {
    content: "";
    display: block;
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    height: 100%;
    border-radius: 10rem;
    border: 1px solid #e6f3e8;
    opacity: .4
}

.button-tab span {
    display: block;
    text-transform: uppercase
}

.button-tab .basic {
    pointer-events: none;
    opacity: 1;
    position: relative;
    transform: translateZ(0);
    transition: transform .3s cubic-bezier(0.4, 0.1, 0, 1), opacity .3s cubic-bezier(0.4, 0.1, 0, 1)
}

.button-tab .hover {
    pointer-events: none;
    opacity: 0;
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    transform: translate(0, 80%) scale(1, 0.8);
    transition: transform .6s cubic-bezier(0.23, 1, 0.32, 1), opacity .6s cubic-bezier(0.23, 1, 0.32, 1)
}

@media only screen and (min-width: 1024px) {
    .button-tab:hover::before {
        opacity: 0;
        transform: scale(0.95, 0.8)
    }

    .button-tab:hover div {
        transform: scale(1.05)
    }

    .button-tab:hover div::after {
        transform: scale(1.2)
    }

    .button-tab:hover div span {
        opacity: .4
    }

    .button-tab:hover .basic {
        opacity: 0;
        transform: translate(0, -20%) scale(0.9)
    }

    .button-tab:hover .hover {
        opacity: 1;
        transform: translateZ(0) scale(1, 1)
    }
}

.button-tab.-active::before {
    background-color: #1e1131
}

.button-tab.-active span {
    color: #d2a17d
}

.-a-to-top[data-scroll] {
    opacity: 0;
    transform: translate(0, 4rem);
    transition: transform 2.1s cubic-bezier(0.4, 0.1, 0, 1), opacity 2.1s cubic-bezier(0.4, 0.1, 0, 1);
    transition-delay: .15s
}

.-a-to-top.-inview[data-scroll] {
    transform: translateZ(0);
    opacity: 1
}

.-a-blur[data-scroll] {
    opacity: 0;
    transform: translateZ(0);
    filter: blur(2rem);
    transition: filter 3s cubic-bezier(0.4, 0.1, 0, 1), opacity 2.1s cubic-bezier(0.4, 0.1, 0, 1);
    transition-delay: .15s
}

.-a-blur.-inview[data-scroll] {
    filter: initial;
    opacity: 1
}

.icon img {
    height: auto
}

.icon-echinus {
    width: 4rem;
    height: 4rem;
    padding: .25rem;
    border: 1px solid rgba(210, 161, 125, .4);
    border-radius: 50%
}

@media only screen and (min-width: 1024px) {
    .icon-echinus {
        margin: .5rem;
        padding: .5rem
    }
}

.icon-echinus img {
    animation-name: leftTopIcon;
    animation-duration: 24s;
    animation-iteration-count: infinite;
    animation-timing-function: linear
}

.icon-hourglass {
    width: 3rem;
    height: 3rem;
    border: 2px solid #d2a17d;
    border-radius: 50%
}

@media only screen and (min-width: 1024px) {
    .icon-hourglass {
        border: 3px solid #d2a17d
    }
}

.icon-hypno-eye {
    width: 3rem;
    height: 3rem;
    /* border: 1px solid #d2a17d; */
    border-radius: 50%
}

.icon-sun-star {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 3rem;
    height: 3rem;
    border: 2px solid #d2a17d;
    border-radius: 50%
}

@media only screen and (min-width: 1024px) {
    .icon-sun-star {
        border: 3px solid #d2a17d
    }
}

.icon-sun-star::before {
    content: "";
    display: block;
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    border: 1px solid #d2a17d;
    border-radius: 50%
}

.icon-sun-star .star {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    animation-name: bottomRightIcon;
    animation-duration: 12s;
    animation-iteration-count: infinite;
    animation-timing-function: linear
}

.icon-sun-star .face {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto
}

.container .page .header-lights,
.tarot-chat .header-lights {
    position: absolute;
    z-index: 1;
    top: 0;
    left: -50%;
    margin-left: auto;
    margin-right: auto;
    transform: translate(0, -60%);
    width: 200%;
    pointer-events: none
}

@media only screen and (min-width: 1024px) {

    .container .page .header-lights,
    .tarot-chat .header-lights {
        width: 60%;
        left: 0;
        right: 0;
        margin-left: auto;
        margin-right: auto
    }
}

.container .page .header-lights .lights-a img,
.tarot-chat .header-lights .lights-a img {
    display: block;
    width: 100%;
    animation-name: lightsOp;
    animation-duration: 3.6s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-delay: 0
}

.container .page .header-lights .lights-a::before,
.tarot-chat .header-lights .lights-a::before {
    content: "";
    display: block;
    width: 100%;
    transform: translateY(-50%);
    animation-name: lightsOp;
    animation-duration: 3.6s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-delay: 0
}

.container .page .header-lights .lights-b,
.tarot-chat .header-lights .lights-b {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.container .page .header-lights .lights-b img,
.tarot-chat .header-lights .lights-b img {
    display: block;
    width: 100%;
    animation-name: lightsOp;
    animation-duration: 3s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-delay: 0
}

.container .page .header-lights .lights-b::before,
.tarot-chat .header-lights .lights-b::before {
    content: "";
    display: block;
    width: 100%;
    transform: translateY(-50%);
    animation-name: lightsOp;
    animation-duration: 3s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-delay: 0
}

.dynamic-stars {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    max-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center
}

.home-page {
    min-height: 600px
}

.home-page .welcome {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 80vh;
    margin-top: 10vh;
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA0gAAAMuCAYAAAAjSiOcAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAADSKADAAQAAAABAAADLgAAAADqUWvOAAA4m0lEQVR4Ae3dPYskxxkA4Jvhso6VXKJf4Gj+gDNHFzgwGAUOZLSKLWFQ5jPGDmxZDoyDlZEDZ0J2ImGDMoHAyHCKBHZozgYh2GzmOhOUq4UO3a725np6urrr4xE0up3pqnrf5+2d7eqvuXPHfwQIECBAgACBzAT6vg+ZhSQcAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgRaEOj7PgxLC7nKkQABAgSmCWynNdOKAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQKFHADeglVk3MBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQmCBwOBweTGimCQECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQWE+g7/uw3uhGJkCAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBJ4t0Pd9ePa73iFAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgACBzAVcBpZ5gYRHgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgSqEej7PlSTjEQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIEChfoO/7MCzlZyIDAgQIECDwjcD2m3/6FwECBAgQIECAAAECBAgQIECAAAECBBILOOOWGFj3BAgQmEnAGaSZIHVDgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAtcFPN73uoefCBAgQIAAAQIECBAgQIAAAQIECBCYKOBg40Q4zQgQWF/AB9j6NRABAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQGAQiN8r9ZAEAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQLVCcRLhUN1SUmIAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIEBgEHBpiO2AAAECBAgQIECAAAECBAgQIFCQgIM5BRVLqAQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgMAxAY9dPqbjPQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBCoVSBchjAsteYnLwIECBAYJ7Adt5q1CBAgQIAAAQIECBAgQIBABQKeOlZBEaXQvMDh1yEMS/MQAAgQIECAQGIBZ5ASA+fQfdd1m6fjMGF6WsO/CRAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIBAtQIpvqIgRZ/VFkBiBAgQIECAAAECBAgQIECAAAECBAgQIECAQGMCqc+kpO6/sXJJlwABAgQIECBAgACBWgVMnmqtrLxKFPD7WGLVxEyAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAg8Q8ClEM+A8TIBAtUJ+LyrrqQSIkCAwDQBfxCmuWlFgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAukFfOdeemMjECBAgAABAgQIEPhKwM63DYEAAQIECBAgQIAAAQIECBAgsJLA1dXVvZWGNuyJAg6inQhmdQItCvigaLHqciZAgAABAgQIECBAgAABAgQIJBBwoCkBqi6LF/B7UXwJJUCAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAIGxAh5JO1bKegQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgROF3D/zulmWhAgQIAAAQIECBAgQGCUgAnXKCYrESBAgAABAgQIECBAgMAYAZPMMUrWIUCAAAECBFYTGHZW7LCsxm9gAgQIECCQtUDcR9hlHaDgCBAgMLeACdLcovojME7ATsc4pznX8nk3p6a+ShcYfh9Kz0H8BAgQIECAAAECZwiYIJ2BpykBAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQINCQQn+B32VC6UiVAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIpBGID3EIaXrWKwECBAgQIECAAAECBAgQqFjAhLri4kqNAAECBAgQIECAAIHjAo8fP/7g+BreJUCAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAIFSBNw0W0qlxElgfgG///Ob6pEAAQIECBQhYCfg9DIxO91syRZDfdRoSXFjESBAgAABAgQIECCQrcDYCZJJVLYlFBgBAgQIECBAgEDuAmN3unPPY834ouFu7vFNcuYW1d8cArbLORT1QYAAAQIECGQtYIKUdXkER4AAAQIECBAgQIBAyQImXPlUL/XR/tT95yMpEgIECBAgQIDAEQE7RUdwvHXHBGnZjcDv47LeRiNAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAIAuBeOnUZRaBCIIAAQKJBVwqmhhY9wQIECBAgAABAgQIECBQh4AJdB11lAUBAgQIECBwi4AdnVtQvESAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAjMKTBcruiSxTlF9UWAwFSB7dSG2hEgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBA4X8CldOcb6oEAAQIECBAgkFzATltyYgMQIECAAAECBAgQIECAwFwCcRL7cK6+9EOAAAECBIoQePz48QdFBCpIAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIELghEC93urzxkh8JECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAII2AR8SncdUrAQIECBAgQIBAIwJxhzo0kqo0CRAgQIAAAQIECBAgULaACVzZ9RM9AQIECBAgQIAAAQJnCJgQnYGnKQECBAgQIECAAAECBAgQIECAAAECBAgQIECAAIEsBOJZv10WgQiCAAECBAgQIECAAIHzBPb7/f3zetC6NQGXgbZWcfkSIECAAAECBAgQIEAgAwGT0QyKIAQCBAgsJXA4HB4sNZZxCBAgQIBALQImTbVUUh4ECBAgcFTg32+GMCxHV/ImAQIECBAgQIBAsQLbYiMXOAECBAgQIECAAAECBAgQIECAAAECBOYQ+PKtEIZljr70QYAAgVoEnEGqpZLyIECAQIYC7sPIsChCSiLw7m/+FYYlSec6JUBgUYG7i45mMAIECBBoSqDruk1TCReW7N3XNupTWM2ES4AAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQLFCLjPrJhSCZQAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECMwmsN/v78/WmY4IECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAs0IfPTuf8OwNJNwI4luG8lTmgQIEGhOwOOXmyu5hAkQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQyFsgXta1yztC0REgkErgcDg8SNW3fgkQIECAAAECBAgQIJClQDwQcpFlYBkH5Z7AjIsjNAIECBAgQIDAWgJz7CTO0cda+RuXAAECBAgQIECgQAE7oAUWTcgECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAgRkE4vdYXczQjS4IECBAgAABAgQIECBA4DYBXx58m4rXCBAgQIAAgSwF7LhkWRZBESBAgAABAgQIECBAgAABAgQIECBA4LqAg7nXPfxEgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIEJhBwCUZMyDqggABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgEBbAh5z3la9ZUuAAAECBAgQIECAAAECBCYJ5HoA4cu3QhiWSUlpRIBAFgLbLKIQBAECBAgQIEDgBIGu6zYnrG5VAgQIECBAgAABAgQI5C/gjEv+NRIhgdYEnEFqreLyJUCAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAisLhAfqrBbPQgBECBAgAABAgQIECDQhkCuT3VrQ1+WBAgQIECAAAECRQnYeS6qXLMEq+azMOqEAAECBAgQIECAAAEC5QqYGJZbO5ETIECAAAECBAgQWFzABGJxcgMSIECAAAECBOoXsJNZf41lSIAAAQIECBAgULiAnfbCCyh8AgQIECBAgAABAgSmCZgMTXPTigABAmsJ+NxeS964BAgsJuCDbjFqAxEoViB8/V+xCQicAAECBAgQIEBgWYEP//QoDMuyoxqNwDICJkjLOBuFAAECBAjMJXB3ro70Q4AAAQLfFtjE/779qlcIECBAYG2B374Svjo4+/offU6vXYvcxjdByq0iDcbzvZdftAPZYN2lTGCqQLy8edd13adT22tHgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECDQtsDV1dW9tgVkPwj4GgbbAQECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIHCOgHsTztErp+0n738RhqWciEVKgAABAgQI5CCwzSEIMRBYUiB+waQvpl0S3FgECGQvMBw4cvAo+zIJkAABAgQIEEgpYIcopa6+CZQl4POgrHqJlgABAgQIEEggYIcoAaoumxHY7/f3m0lWogQIECBAgAABAgQIECBAgAABAgQIECBAYHUB90GsXgIBECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAukF4iWTu/SjGIEAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAgXIFwmUIw1JuBiInQKB2gW3tCcqPAIF6BDzhrp5ayoQAAQIECBAgQIAAAQIECBA4QcBBkROwrEqAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAwMwCnog2M6juCBAgQIAAAQIECKQS+NvlozAsqfof068JxBgl6xAgQODZAvFz9PLZ73qnFAFfFFtKpcR55+rq6h4GAjkLlD7B6Lpuk7Ov2AgQIJC7QPwcfTX3GMV3XKD0v+XHs/MuAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIBAeQKeiFFezURMgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIEFhDwH2pa6gbkwABAgQIECCwooAdwBXxDT2bwLAd25Zn49QRAQIEihDYFhGlIAkQKE6g67pNcUELmAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIEFhFwM2t57MzPN9QDwQIECBAgAABAgQIECBAgAABAgQIEKhKwIHjqsopGQIECBAgQKBUATtleVUu/D6EYckrKtEQIFCDgMd811BFORBYUSDuNF6uOLyhCSwm4NH1i1EbiAABAgQIEChNwJHk0io2PV61nm6nJQEC5wsMn0E+h8531AMBAgQIECBAgACBqgVamTSYIFW9GUuOAAECBAgQIECAAAECBAgQIECAwJkCV1dX987sQnMCBAgQaEiglTNsDZVUqgQIECBAgAABAgQIECAwRcAEeYqaNgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECCwhoBr4NdQNyYBAgQIECBAgAABAgQIECBAgAABAgQIECCQj4Avc8ynFiIhQIAAAQLnCGzPaawtAQIECLQr4BK6dmsvcwIECBAgQIAAAQIECBAgMErgo/cehWEZtbKVCBDITsAZpOxKIiACBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECOQq41zDHqoiJAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECWQj4jrMsyiAIAosKeIrdotwGI0CAAAECBAgQIECAAAECBAgQIECAwC0C8QzNxS0ve4kAAQIECBAgUKeAJyDVWVdZESBAgAABAgQIECBAgACB1QQcbFiN3sAECBAgQIAAgWkCduCmuWlFgACBFAI+k1Oo6pMAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIDAKAGX74xislIUiNvK5dwQH733KAzL3P3qjwABAr4HyTZAgMDiAnasFydPMmDXdZskHWfU6ZdvhTAsGYVUZChxW3m1yMAFTYBAkwJ3m8xa0gQIrCrQwo71qsAGJ9CAwHd/8GL1E/QGyihFAkkF/vzzz746wPWjn33npM8LE6SkZdE5gToFhjNAJjl11lZW1wXuvrY56Y/q9dZ+IkCAAAECBAgQIECAAAECCwm4XHchaMMQIECAAAECBAgQIJBOwMQmna2eCRAgQKBgAX8gCy6e0AkQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIFC1QDyjPfv39FQNJjkCBAjULBD/KOxqzk9uBAgQIECgdoH9fn+/9hzlR4AAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgkKmA7+fJtDDCIkCAAAECBAgQIECAAAECBNYXcOBk/RqIgAABAi0LeFply9WXOwECiwrY8V+U22AECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQLFCgxn1pxdK7Z8AidAgAABApMFtpNbakiAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIEBgXgH3tszrqTcCBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQKFYgXmJ/UWzwmQTuNoVMCiGM6QI24ul2WtYh8M8fhzAsdWQjCwIECBAgUL+A70Gqv8arZth13WbVAAxOgAABAgQIECBA4ASBuyesa1UCBAgQGCnw5OxpPEbgIMFIM6sRIECAAIEcBJxByqEKYiDwtcCTnWogBAgQIEDgXIH4N8X9Luciak+AAAECBOYSMNmbS1I/BAgQIECAAAECBAgQIECAAAECBAgQIECAQDkCh8PhQTnRipQAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAgfkE3E81n6WeCBAgQIAAAQIECBAgQIAAgcoFHEipvMDSI0CAAAECBAgQIECAAAECBAgQIECAAIECBOLR+l0BYQqRAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAIG8BTxIJO/6iI4AgQIFfvFSCMNSYOhCJkCAAAECBAiMFtiOXtOKBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAwEoCrhVfCd6wBAgQIECAAAECBAgQyFXARDHXyoiLAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBFIK/P2HIQxLyjH0TYDANAHfgzTNTSsCBDITcDN/ZgURDoFEAn7XE8HqlgABAgQIEKhbILedqBjPRd3i62aXW73X1Ugz+k+/H8KwpOldrwQIEMhHwBmkfGohkoIE7IzlX6yu6zY5RRnjeTuneGqLJbd61+abez7xM/ky9xjFR4AAAQIECBAgQIAAAQKFCQwHAB0ELKxowp1dwBmk2Ul1SIAAAQIECBAgQIAAAQIECBAgQCATgXgEfJdJKMIgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECIwVWOohAHEcj9cfWxTrESBAgAABAukEUt3/Ed4IYVjSRa5nAgQIECBAoHUBT7FrfQuQP4EEAvE7aT6do9uljjLPEas+CBAgQIAAAQIECBAgQIAAAQIECMwu4ADZ7KQ6JECAAAECBAgQIECAAAECBAgQIEAgOwFHQrMriYAIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIEGhQwL1eDRZdygQIECBAgAABAgQI5ClggpZnXURFgAABAgQIECBAgAABAgQIEHiugAM7zyWyAgECBAgQIFCrgB2hWisrLwIECBAgQIAAAQIECCQSMJFMBKtbAgQIECBAgACBNgTeeT2EYWkjW1kSIECgfoFt/SnKkACBFgWGo8COBOdZebXJsy6iIkCAAAECBAgQqFjg6Z1wE6W8Cv10bfKKTDQECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIFCMTLUS8KCFOIBAgQIPC0gHs7ntbwbwIECBAgQIAAAQIECBAg0ICAgwENFFmKBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAiULOAyr5KrJ3YCBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIDBG4HA4PBiznnUIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgMDqAsMj9Ft4jP5+v7+/OrYACBAgQIAAAQJLCNjxWULZGLUKtDJBqrV+8iJAgAABAgQIECBAgEDRAuHr/4pOQvAECFQpsK0yK0kRIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECSwm08HSjpSyNQ4AAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgcFwg3tu6O76GdwkQIECAAAECBAgQqF7AQ2+qL7EECRAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIEThL45Uv/CMNyUiMrEyBAgMBiAtvFRjIQAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIBAIwIevtFIoaVJgAABAgQIECAwTsAO8jinWtZS71oqKQ8CBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAiUJeD+trLqJVoCBAgQIEAgCtiBsRkQIECAAAECBAgQIECAAAECBAgQIECAAAEC6wjEsxQX64xsVAIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIE2hNwH1V7NZcxAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIBAVgJhH8KwZBWUYAgQKFbAZYHFlk7gBAgQIECAwCBggmQ7IECAAAECBAgQIECAAAECBAgQWERgOKvmzNoi1AYh0IzAtplMJUqAAAECBAgQIECAAAECBAgQIEDgpsAn738RhuXm61N/vrq6uje17SntnCk4Rcu6BAgQIDBFwBmkKWraECBAIDOBtScOL7zwwudLkHRdt1liHGMQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAEC5wrEpyU+PLcP7QkQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECrQvEezTCsLTuIH8CBAisJRA/g3drjW1cAgQIECBA4IaACdINED+OFgi/C2FYRjc4ccW4bV6c2MTqBAgQaFJg22TWkiZAYLJAeCPuxMVlcgeVN+y6bjMslafZRHq1nQmM2+XbTRROkgQIEDhT4O6Z7TUnQIAAAQJVCiw90d38ZGNiXeWWJCkCBAgQIECAAAECZwh8/Nf/hWE5owtNCWQl4J6YrMohGALPFXCJ3XOJrECAAAECBAgQmC4Qz0Z+Or21lgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgACBYgV+9XIIw1JsAgInQIAAgdECvgdpNJUVCRAgQIAAAQIECBAgQIAAAQIECBBILvDmKyEMS/KBDECAAAECRwWcQTrK481jAn3f+0N+DMh7BAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAwAICnpC4ALIhCBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIBAhgLuMcywKEIiQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBCoRsD9O9WUUiIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAgTEC8XKR3Zj1rEOAAAECBAgQIECAAAECBAgQIDBRwP061+F4XPfwEwECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECdz7+y+dhWFAQIECAAAECBMYIbMesZB0CBAgQaEsg3q/ysK2MZUuAAAECBAgQIECAQPMCzrA1vwkAIECAAIEbAs4g3QDxIwECBAgQIECAAAECBAgQIECAAAECFQh4nHcFRZQCAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQKAxgXhPzEVjKUuXAAECBAgQIECAAAECBAgQIECgBgEPe6mhinIgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQOBWATdU38riRQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgkFJguHzPJXwphfVNgEBuAtvcAhIPAQIECBAgQIAAAQIECBAgQIAAgVUEnB1Yhd2gBAgQIECAAAECBAgQINCygMl4y9WXOwECBAgQIEAgY4G4o7rLODyhESBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgECuAn3fh1xjExcBAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgEBTAsOlLC5naark1SVr+62upBIicJbA9qzWGhMgQIAAAQIEChfoum5TeArCJ0CAAAECBFoS+OAP/wnD0lLOciVAgAABAgTWEXAGaR13oxIgQIAAgeYFXNrW/CYAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIzCIQ71F4OEtHOiFAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgECmAr7rJdPCCIsAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIDAjALuI5oRU1cECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBBoWsAT7pouv+QJECBAgAABAgQIEHgiECdHl0/+7f8ECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgkE7Awy7S2eqZAAECBAiMEvDHeBSTlQgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAwBICLvNfQtkYBAgQIECAAAECBAgQIECAAAECBAgQyEHAEeEcqiAGAgQIECBAgAABAgQIVChgwllhUaVEgAABAgQIECBAgACBXARMOnOphDgIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBQnIBL0IormYAJECBAgAABAu0JHA6HB+1lLWMCBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAIHiBD5851EYluICFzABAgQIEFhIYLvQOIYhQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgUKpA3/fuTSm1eOImQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQCBPgb7vQ56RiYoAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBCYRSA+XOBylo50QoAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBBoSCDek7FrKF2pEiBAgAABAgQIrCXgm8bXkjcuAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBC4TcCZ/NtUvEaAAAECBAgQIECgAIG4M39RQJhCJECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAgQIECAwMwCfd+HmbvUHQECBAgQIECgDgE7SnXUURYECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgcLuA++hud/EqAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBBILtD3fUg+iAEIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgSqE/C9F9WVVEIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQGBdAQ8zWNff6AQIECBAgAABAgQIECBAgMCKAg6MrIhvaAIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQKAJgXj/xq6JRCVJgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBQv0Df97v6s5QhAQIECJwi8H8y0/k2yhUVnQAAAABJRU5ErkJggg==") no-repeat scroll rgba(0, 0, 0, 0);
    background-position: center;
    background-size: contain
}

@media only screen and (min-width: 1024px) {
    .home-page .welcome {
        margin-top: initial;
        min-height: 600px;
        height: 90vh
    }
}

.home-page .welcome__decorative-ex {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    opacity: .4;
    pointer-events: none
}

.home-page .welcome__decorative-ex .decorative-ex-line {
    position: absolute;
    background: linear-gradient(90deg, rgba(166, 137, 210, 0) 0%, rgba(166, 137, 210, 0.4) 15%, rgba(166, 137, 210, 0) 50%, rgba(166, 137, 210, 0.4) 85%, rgba(166, 137, 210, 0) 100%);
    left: 50%;
    top: 50%
}

.home-page .welcome__decorative-ex .decorative-ex-line:nth-child(1) {
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    height: 1px;
    width: 100vw
}

.home-page .welcome__decorative-ex .decorative-ex-line:nth-child(2) {
    left: 50%;
    transform: translate(-50%, -50%) rotate(30deg)
}

.home-page .welcome__decorative-ex .decorative-ex-line:nth-child(3) {
    left: 50%;
    transform: translate(-50%, -50%) rotate(-30deg)
}

.home-page .welcome__decorative-star {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 60%;
    pointer-events: none
}

@media only screen and (min-width: 1024px) {
    .home-page .welcome__decorative-star {
        height: 100%
    }
}

.home-page .welcome__decorative-star .star-wrap {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    justify-content: center;
    width: .12rem;
    height: 100%
}

.home-page .welcome__decorative-star .star-wrap.-rotate {
    opacity: .2;
    animation-name: homeStarRotate;
    animation-duration: 128s;
    animation-iteration-count: infinite;
    animation-timing-function: linear
}

.home-page .welcome__decorative-star .diamond {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    height: 100%;
    background-color: #a689d2;
    -webkit-clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
    clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%)
}

.home-page .welcome__decorative-star .diamond:last-child {
    transform: rotate(90deg)
}

.home-page .welcome__bottom-border {
    position: absolute;
    bottom: 1rem;
    width: 4rem;
    height: 40%;
    opacity: .4;
    z-index: 11;
    pointer-events: none
}

@media only screen and (min-width: 1024px) {
    .home-page .welcome__bottom-border {
        width: 12.5%
    }
}

.home-page .welcome__bottom-border.left {
    left: 2rem;
    border-bottom-left-radius: 2rem;
    border-left: 1px solid #d2a17d;
    border-bottom: 1px solid #d2a17d
}

@media only screen and (min-width: 1024px) {
    .home-page .welcome__bottom-border.left {
        left: 8.3333%
    }
}

.home-page .welcome__bottom-border.right {
    right: 2rem;
    border-bottom-right-radius: 2rem;
    border-right: 1px solid #d2a17d;
    border-bottom: 1px solid #d2a17d
}

@media only screen and (min-width: 1024px) {
    .home-page .welcome__bottom-border.right {
        right: 8.3333%
    }
}

.home-page .welcome__moons {
    position: absolute;
    top: 50%;
    left: 2rem;
    right: 2rem;
    transform: translateY(-50%);
    display: flex;
    justify-content: space-between;
    align-items: center;
    z-index: 3;
    pointer-events: none
}

@media only screen and (min-width: 1024px) {
    .home-page .welcome__moons {
        left: 8.3333%;
        right: 8.3333%
    }
}

.home-page .welcome__moons .moon {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 3rem;
    border: 1px solid rgba(210, 161, 122, .4);
    border-radius: 50%;
    overflow: hidden;
    transform: rotate(-20deg) translateZ(0)
}

@media only screen and (min-width: 1024px) {
    .home-page .welcome__moons .moon {
        width: 4rem
    }
}

.home-page .welcome__moons .moon::before {
    content: "";
    display: block;
    width: 100%;
    padding: 50% 0
}

.home-page .welcome__moons .moon:first-child {
    margin-left: -1.5rem;
    transform: rotate(-170deg) translateZ(0)
}

@media only screen and (min-width: 1024px) {
    .home-page .welcome__moons .moon:first-child {
        margin-left: -2rem
    }
}

.home-page .welcome__moons .moon:last-child {
    margin-right: -1.5rem
}

@media only screen and (min-width: 1024px) {
    .home-page .welcome__moons .moon:last-child {
        margin-right: -2rem
    }
}

.home-page .welcome__moons .moon-bg {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    height: 100%;
    background-color: #1e1131;
    animation-name: moonBg;
    animation-duration: 6s;
    animation-iteration-count: infinite;
    animation-timing-function: steps(1, end)
}

.home-page .welcome__moons .moon-side {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: 0%;
    width: 50%;
    height: 100%;
    background-color: #d2a17d;
    animation-name: moonSide;
    animation-duration: 6s;
    animation-iteration-count: infinite;
    animation-timing-function: steps(1, end)
}

.home-page .welcome__moons .moon-shade {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    background-color: #d2a17d;
    border-radius: 50%;
    animation-name: moonShade;
    animation-duration: 6s;
    animation-iteration-count: infinite;
    animation-timing-function: linear
}

.home-page .welcome__decorative-big-circle {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    max-width: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none
}

.home-page .welcome__decorative-big-circle::before {
    content: "";
    display: block;
    width: 60%;
    padding: 30% 0;
    border: 1px solid #7b47c9;
    border-radius: 50%
}

@media only screen and (min-width: 1024px) {
    .home-page .welcome__decorative-big-circle::before {
        width: 72%;
        padding: 36% 0
    }
}

.home-page .welcome__top-icons {
    position: absolute;
    z-index: 3;
    display: flex;
    justify-content: space-between;
    align-items: center;
    top: 1rem;
    left: 2rem;
    right: 2rem;
    pointer-events: none
}

@media only screen and (min-width: 1024px) {
    .home-page .welcome__top-icons {
        left: 8.3333%;
        right: 8.3333%
    }
}

.home-page .welcome__top-icons .left {
    margin: 1rem;
    opacity: 0;
    transform: scale(0.5);
    transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1), opacity .9s cubic-bezier(0.23, 1, 0.32, 1);
    transition-delay: 1.5s
}

.home-page .welcome__top-icons .left.-inview {
    opacity: 1;
    transform: scale(1)
}

.home-page .welcome__top-icons .right {
    margin: 1rem;
    opacity: 0;
    transform: scale(0.5);
    transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1), opacity .9s cubic-bezier(0.23, 1, 0.32, 1);
    transition-delay: 1.2s
}

@media only screen and (min-width: 1024px) {
    .home-page .welcome__top-icons .right {
        margin: .5rem
    }
}

.home-page .welcome__top-icons .right.-inview {
    opacity: 1;
    transform: scale(1)
}

.home-page .welcome__bottom-icons {
    position: absolute;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: space-between;
    bottom: 1rem;
    left: 2rem;
    right: 2rem;
    pointer-events: none
}

@media only screen and (min-width: 1024px) {
    .home-page .welcome__bottom-icons {
        left: 8.3333%;
        right: 8.3333%
    }
}

.home-page .welcome__bottom-icons .left {
    margin: 1rem;
    opacity: 0;
    transform: scale(0.5);
    transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1), opacity .9s cubic-bezier(0.23, 1, 0.32, 1);
    transition-delay: .6s
}

@media only screen and (min-width: 1024px) {
    .home-page .welcome__bottom-icons .left {
        margin: .5rem
    }
}

.home-page .welcome__bottom-icons .left.-inview {
    opacity: 1;
    transform: scale(1)
}

.home-page .welcome__bottom-icons .right {
    margin: 1rem;
    opacity: 0;
    transform: scale(0.5);
    transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1), opacity .9s cubic-bezier(0.23, 1, 0.32, 1);
    transition-delay: .9s
}

@media only screen and (min-width: 1024px) {
    .home-page .welcome__bottom-icons .right {
        margin: .5rem;
        border: 3px solid #d2a17d
    }
}

.home-page .welcome__bottom-icons .right.-inview {
    opacity: 1;
    transform: scale(1)
}

.home-page .welcome__lights-container {
    position: absolute;
    z-index: 3;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none
}

.home-page .welcome__lights-container::after {
    content: "";
    display: block;
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 60%;
    padding: 30% 0;
    border-radius: 50%;
    background-image: radial-gradient(circle at 50% 50%, #FFFFFF 0%, rgba(255, 255, 255, 0.98) 4%, rgba(254, 254, 254, 0.95) 8%, rgba(254, 254, 254, 0.88) 12%, rgba(253, 253, 253, 0.8) 15%, rgba(252, 252, 252, 0.71) 19%, rgba(251, 251, 251, 0.61) 22%, rgba(250, 250, 250, 0.5) 25%, rgba(249, 249, 249, 0.39) 28%, rgba(248, 248, 248, 0.29) 31%, rgba(247, 247, 247, 0.2) 35%, rgba(246, 246, 246, 0.12) 38%, rgba(246, 246, 246, 0.05) 42%, rgba(245, 245, 245, 0.02) 46%, rgba(245, 245, 245, 0) 50%)
}

@media only screen and (min-width: 1024px) {
    .home-page .welcome__lights-container::after {
        width: 24%;
        padding: 12% 0
    }
}

.home-page .welcome__lights-container .lights {
    width: 100%;
    position: relative;
    animation-name: lightsP;
    animation-duration: 9s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-delay: 0
}

@media only screen and (min-width: 1024px) {
    .home-page .welcome__lights-container .lights {
        width: 60%
    }
}

.home-page .welcome__lights-container .lights-a {
    transform: rotate(0deg);
    animation-name: rotateIt;
    animation-duration: 21s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-delay: 0
}

.home-page .welcome__lights-container .lights-a::before {
    content: "";
    display: block;
    width: 100%;
    padding-bottom: 100%;
    background: url(/TarotLove/lights-1.png.webp) no-repeat scroll rgba(0, 0, 0, 0);
    background-size: cover;
    background-position: center;
    animation-name: lightsOp;
    animation-duration: 1.8s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-delay: 0
}

.home-page .welcome__lights-container .lights-b {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform: rotate(0deg);
    animation-name: rotateIt;
    animation-duration: 33s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-direction: reverse;
    animation-delay: 0
}

.home-page .welcome__lights-container .lights-b::before {
    content: "";
    display: block;
    width: 100%;
    padding-bottom: 100%;
    background: url(/TarotLove/lights-2.png.webp) no-repeat scroll rgba(0, 0, 0, 0);
    background-size: cover;
    background-position: center;
    animation-name: lightsOp;
    animation-duration: 1.5s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-delay: 0
}

.home-page .welcome__card-loader {
    position: absolute;
    z-index: 3;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 90vw;
    height: 90vh;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 3.6s cubic-bezier(0.23, 1, 0.32, 1), opacity 2.1s ease-in;
    transform: scale(0.5);
    opacity: 0
}

.home-page .welcome__card-loader.-loaded {
    transform: scale(1);
    opacity: 1
}

.home-page .welcome__card-loader.-loaded .welcome__card-container {
    animation-name: cardRotate;
    animation-duration: 8s;
    animation-iteration-count: infinite;
    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1)
}

.home-page .welcome__card-loader.-loaded .the-card {
    animation-name: cardRotateZ;
    animation-duration: 8s;
    animation-iteration-count: infinite;
    animation-timing-function: linear
}

.home-page .welcome__card-container {
    position: absolute;
    z-index: 3;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 30%;
    min-width: 8rem;
    animation-name: cardRotate;
    animation-duration: 8s;
    animation-iteration-count: infinite;
    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1);
    perspective: 1200px
}

@media only screen and (min-width: 1024px) {
    .home-page .welcome__card-container {
        width: 11.1%;
        max-width: 8rem
    }
}

.home-page .welcome__card-container .the-card {
    position: relative;
    transform-style: preserve-3d;
    animation-name: cardRotateZ;
    animation-duration: 8s;
    animation-iteration-count: infinite;
    animation-timing-function: linear
}

.home-page .welcome__card-container .the-card *::-moz-selection {
    background-color: #a689d2
}

.home-page .welcome__card-container .the-card *::selection {
    background-color: #a689d2
}

.home-page .welcome__card-container .the-card__front {
    position: absolute;
    transform: rotateX(0) rotateY(180deg) scale(1) translateZ(0px);
    width: 100%;
    height: 100%;
    background-color: #f5f5f5;
    border-radius: .35rem;
    overflow: hidden;
    padding: 4.68% 4.68%;
    box-sizing: border-box
}

.home-page .welcome__card-container .the-card__front::after {
    content: "";
    display: block;
    position: absolute;
    top: 1.9%;
    bottom: 1.9%;
    left: 3.125%;
    right: 3.125%;
    background-image: linear-gradient(to right bottom, #D2A17D 20%, #49432E 70%, #D2A17D 100%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    padding: 1px;
    border-radius: .25rem;
    opacity: .2
}

.home-page .welcome__card-container .the-card__front video {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: .5rem;
    overflow: hidden;
    transform: translateZ(0)
}

.home-page .welcome__card-container .the-card__front .glare {
    position: absolute;
    top: -10%;
    left: -10%;
    width: 120%;
    height: 120%;
    background-image: linear-gradient(to right, rgba(245, 245, 245, 0) 0%, rgba(245, 245, 245, 0.5019607843) 50%, rgba(245, 245, 245, 0) 100%);
    animation-name: cardGlare;
    animation-duration: 8s;
    animation-delay: -6.3s;
    animation-iteration-count: infinite;
    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1)
}

.home-page .welcome__card-container .the-card__border {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #786398;
    border-radius: .35rem;
    overflow: hidden
}

.home-page .welcome__card-container .the-card__border:nth-child(2) {
    transform: rotateX(0) rotateY(0deg) scale(1) translateZ(0.1px)
}

.home-page .welcome__card-container .the-card__border:nth-child(3) {
    transform: rotateX(0) rotateY(0deg) scale(1) translateZ(1.1px)
}

.home-page .welcome__card-container .the-card__border:nth-child(4) {
    transform: rotateX(0) rotateY(0deg) scale(1) translateZ(2.1px)
}

.home-page .welcome__card-container .the-card__back {
    position: relative;
    background-color: #1e1131;
    transform: rotateX(0) rotateY(0deg) scale(1) translateZ(2.1px);
    border-radius: .35rem;
    overflow: hidden
}

.home-page .welcome__card-container .the-card__back .glare {
    position: absolute;
    top: -10%;
    left: 0%;
    width: 100%;
    height: 120%;
    background-image: linear-gradient(to right, rgba(123, 71, 201, 0) 0%, rgba(123, 71, 201, 0.5019607843) 50%, rgba(123, 71, 201, 0) 100%);
    animation-name: cardGlareBack;
    animation-duration: 8s;
    animation-delay: -6.3s;
    animation-iteration-count: infinite;
    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1)
}

.home-page .welcome__title-container {
    position: relative;
    z-index: 4;
    margin-top: auto;
    margin-bottom: 4%;
    bottom: 1rem;
    display: inline-block;
    text-align: center
}

.home-page .welcome__title-container *::-moz-selection {
    background-color: #a689d2
}

.home-page .welcome__title-container *::selection {
    background-color: #a689d2
}

.home-page .welcome__title-container .title-line:nth-child(1) {
    opacity: 0;
    transform: translate(0, 4rem) skew(0deg, 6deg) translateZ(0);
    transition-delay: .3s;
    transition: transform 1.5s cubic-bezier(0.4, 0.1, 0, 1), opacity 1.5s cubic-bezier(0.4, 0.1, 0, 1)
}

.home-page .welcome__title-container .title-line:nth-child(2) {
    opacity: 0;
    transform: translate(0, 4rem) skew(0deg, 6deg) translateZ(0);
    transition-delay: .3s;
    transition: transform 2.1s cubic-bezier(0.4, 0.1, 0, 1), opacity 2.1s cubic-bezier(0.4, 0.1, 0, 1)
}

.home-page .welcome__title-container .title-line:nth-child(3) {
    opacity: 0;
    transform: translate(0, 4rem) skew(0deg, 6deg) translateZ(0);
    transition-delay: .3s;
    transition: transform 2.7s cubic-bezier(0.4, 0.1, 0, 1), opacity 2.7s cubic-bezier(0.4, 0.1, 0, 1)
}

.home-page .welcome__title-container .bottom-arrow {
    width: 2rem;
    height: 2rem;
    margin-top: 1rem;
    margin-left: auto;
    margin-right: auto;
    opacity: 0;
    transform: translate(0, 4rem);
    transition-delay: .3s;
    transition: transform 3s cubic-bezier(0.4, 0.1, 0, 1), opacity 3s cubic-bezier(0.4, 0.1, 0, 1)
}

.home-page .welcome__title-container.-inview .title-line:nth-child(1) {
    opacity: 1;
    transform: translate(0, 0rem) skew(0deg, 0deg)
}

.home-page .welcome__title-container.-inview .title-line:nth-child(2) {
    opacity: 1;
    transform: translate(0, 0rem) skew(0deg, 0deg)
}

.home-page .welcome__title-container.-inview .title-line:nth-child(3) {
    opacity: 1;
    transform: translate(0, 0rem) skew(0deg, 0deg)
}

.home-page .welcome__title-container.-inview .bottom-arrow {
    opacity: 1;
    transform: translateZ(0)
}

.home-page .categories {
    position: relative;
    z-index: 10;
    min-height: 20rem;
    margin-top: 1rem
}

@media only screen and (min-width: 1024px) {
    .home-page .categories {
        overflow: initial;
        top: -2rem;
        width: 65.277%;
        margin-top: initial;
        margin-left: auto;
        margin-right: auto
    }
}

@media only screen and (min-width: 1920px) {
    .home-page .categories {
        width: 48.611%
    }
}

.home-page .categories__navigation {
    display: flex;
    justify-content: center;
    margin-bottom: 1rem;
    width: 80%;
    margin-left: auto;
    margin-right: auto
}

@media only screen and (min-width: 1024px) {
    .home-page .categories__navigation {
        display: none
    }
}

.home-page .categories__navigation .nav-i {
    color: #a689d2;
    opacity: .4;
    transition: opacity .6s cubic-bezier(0.23, 1, 0.32, 1);
    width: 33.333%;
    text-align: center;
    padding-top: 1rem;
    padding-bottom: 1rem;
    cursor: pointer
}

.home-page .categories__navigation .nav-i.-selected {
    opacity: 1
}

.home-page .categories__navigation .nav-i-dot {
    position: relative;
    width: .4rem;
    height: .4rem;
    padding: 1rem;
    margin: 0 .5rem;
    opacity: .4;
    transition: opacity .6s cubic-bezier(0.23, 1, 0.32, 1)
}

.home-page .categories__navigation .nav-i-dot .dot {
    position: relative;
    width: .4rem;
    height: .4rem
}

.home-page .categories__navigation .nav-i-dot .dot:before {
    position: absolute;
    left: 0;
    top: 0;
    content: "";
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: #a689d2
}

.home-page .categories__navigation .nav-i-dot.-selected {
    opacity: 1
}

.home-page .categories__list {
    position: relative
}

@media only screen and (max-width: 1024px) {
    .home-page .categories__list {
        padding: 0 18%;
        display: flex;
        justify-content: flex-start;
        align-items: center
    }
}

.home-page .categories__list .m-slider-wrap {
    -webkit-user-drag: auto;
    touch-action: none
}

@media only screen and (max-width: 1024px) {
    .home-page .categories__list .m-slider-wrap {
        display: inline-flex;
        scrollbar-width: none;
        transform: translateX(0);
        transition: transform .3s ease-out;
        will-change: transform;
        white-space: nowrap
    }
}

@media only screen and (min-width: 1024px) {
    .home-page .categories__list .m-slider-wrap {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        flex-wrap: wrap;
        width: initial;
        left: initial;
        margin-bottom: -1rem
    }
}

@media only screen and (max-width: 1024px) {
    .home-page .categories__list .m-slide {
        width: 64vw;
        display: inline-flex;
        justify-content: center;
        align-items: flex-start
    }
}

@media only screen and (min-width: 1024px) {
    .home-page .categories__list .m-slide {
        display: flex;
        justify-content: center;
        width: 33.33333%;
        margin-bottom: 1rem
    }

    .home-page .categories__list .m-slide:nth-child(2) {
        margin-top: -1rem
    }
}

@media only screen and (max-width: 1024px) {
    .home-page .categories__list .m-slide-inner {
        width: 12rem;
        transform: rotate(0deg) translateZ(0);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .home-page .categories__list .m-slide-inner.-prev {
        pointer-events: none;
        transform: rotate(-5deg) translate(0, 2rem)
    }

    .home-page .categories__list .m-slide-inner.-next {
        pointer-events: none;
        transform: rotate(5deg) translate(0, 2rem)
    }
}

@media only screen and (min-width: 1024px) {
    .home-page .categories__list .m-slide-inner {
        width: 85%;
        max-width: 13rem
    }
}

.home-page .categories__list .card-wrapper {
    position: relative;
    display: block;
    transform: translateZ(0);
    transition: transform 2.1s cubic-bezier(0.23, 1, 0.32, 1)
}

@media only screen and (max-width: 1024px) {
    .home-page .categories__list .card-wrapper {
        pointer-events: none
    }
}

.home-page .categories__list .card-wrapper *::-moz-selection {
    background-color: #a689d2
}

.home-page .categories__list .card-wrapper *::selection {
    background-color: #a689d2
}

.home-page .categories__list .card-wrapper .card-shadow {
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 2.1s cubic-bezier(0.23, 1, 0.32, 1);
    border-radius: 4rem;
    --c-shadow--rgb: 123, 71, 201;
    box-shadow: 0 1rem 2rem 0 rgba(var(--c-shadow--rgb), 1), 0 3rem 3rem 0 rgba(var(--c-shadow--rgb), 0.5)
}

.home-page .categories__list .card-wrapper .card {
    position: relative;
    background: #120b1c;
    border-radius: 3.2rem 1.6rem;
    overflow: hidden;
    transform: translateZ(0)
}

@media only screen and (min-width: 1024px) {
    .home-page .categories__list .card-wrapper .card {
        border-radius: 4rem 2rem
    }
}

.home-page .categories__list .card-wrapper .card__title-container {
    display: flex;
    justify-content: center;
    position: relative;
    padding: 1rem 0 .5rem
}

@media only screen and (min-width: 1024px) {
    .home-page .categories__list .card-wrapper .card__title-container {
        padding: 1.5rem 0 1rem
    }
}

.home-page .categories__list .card-wrapper .card__title-element {
    font-family: "boska";
    font-weight: 400;
    margin: 0;
    line-height: 1;
    position: relative;
    display: flex;
    justify-content: center;
    color: #e6f3e8;
    text-shadow: 0px 0px 1rem rgba(230, 243, 232, 0);
    transform: translateZ(0);
    transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1), text-shadow .6s cubic-bezier(0.23, 1, 0.32, 1)
}

.home-page .categories__list .card-wrapper .card__borders {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 0 1rem
}

.home-page .categories__list .card-wrapper .card__border-left {
    display: flex;
    flex: 1;
    height: 1px;
    opacity: .4;
    transition: opacity .9s cubic-bezier(0.4, 0.1, 0, 1)
}

.home-page .categories__list .card-wrapper .card__border-left svg {
    width: 100%;
    height: 100%
}

.home-page .categories__list .card-wrapper .card__border-star {
    display: flex;
    width: 1rem;
    height: 1rem;
    margin: 0rem .5rem;
    opacity: .4;
    transition: opacity .9s cubic-bezier(0.4, 0.1, 0, 1)
}

.home-page .categories__list .card-wrapper .card__border-star img {
    width: 100%;
    height: initial;
    max-width: initial
}

.home-page .categories__list .card-wrapper .card__border-right {
    display: flex;
    flex: 1;
    height: 1px;
    opacity: .4;
    transition: opacity .9s cubic-bezier(0.4, 0.1, 0, 1)
}

.home-page .categories__list .card-wrapper .card__border-right svg {
    width: 100%;
    height: 100%
}

.home-page .categories__list .card-wrapper .card__play {
    position: relative;
    margin: 2.5rem 18% 10%
}

@media only screen and (min-width: 1024px) {
    .home-page .categories__list .card-wrapper .card__play {
        margin: 1.5rem 20% 20%
    }
}

.home-page .categories__list .card-wrapper .card__play .deck-card {
    position: absolute;
    top: 0%;
    left: 0%;
    width: 100%;
    transform: translateZ(0);
    transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
}

.home-page .categories__list .card-wrapper .card__play .deck-card .shade {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transform: translateZ(0) scale(1.1);
    opacity: 0;
    transition: opacity .9s cubic-bezier(0.4, 0.1, 0, 1)
}

.home-page .categories__list .card-wrapper .card__play .deck-card:nth-child(5) {
    transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
}

.home-page .categories__list .card-wrapper .card__play .deck-card:nth-child(4) {
    transition: transform .75s cubic-bezier(0.4, 0.1, 0, 1)
}

.home-page .categories__list .card-wrapper .card__play .deck-card:nth-child(3) {
    transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1)
}

.home-page .categories__list .card-wrapper .card__play .deck-card:nth-child(2) {
    transition: transform 1.05s cubic-bezier(0.4, 0.1, 0, 1)
}

.home-page .categories__list .card-wrapper .card__play .deck-card:nth-child(1) {
    transition: transform 1.2s cubic-bezier(0.4, 0.1, 0, 1)
}

.home-page .categories__list .card-wrapper .card__play .deck-card img {
    position: relative;
    width: 100%;
    height: auto;
    display: block;
    border-radius: .35rem;
    overflow: hidden;
    transform: translateZ(0)
}

.home-page .categories__list .card-wrapper .card__play .play-card {
    position: relative;
    perspective: 600px;
    z-index: 800;
    transform: translateZ(0);
    transition: transform .9s cubic-bezier(0.23, 1, 0.32, 1)
}

.home-page .categories__list .card-wrapper .card__play .play-card .flip-card-inner {
    position: relative;
    width: 100%;
    transform-style: preserve-3d;
    transition: transform .9s cubic-bezier(0.23, 1, 0.32, 1);
    transform: rotateY(0deg) translateZ(0)
}

.home-page .categories__list .card-wrapper .card__play .play-card .flip-card-back {
    position: relative;
    width: 100%;
    border-radius: .35rem;
    overflow: hidden;
    transform: translateZ(1px)
}

.home-page .categories__list .card-wrapper .card__play .play-card .flip-card-back img {
    display: block;
    width: 100%;
    height: auto
}

.home-page .categories__list .card-wrapper .card__play .play-card .flip-card-front {
    position: absolute;
    top: .5%;
    left: .5%;
    width: 99%;
    height: 99%;
    border-radius: .35rem;
    overflow: hidden;
    transform: rotateY(180deg) translateZ(0px)
}

.home-page .categories__list .card-wrapper .card__play .play-card .flip-card-front img {
    display: block;
    width: 100%;
    height: auto;
    -o-object-fit: cover;
    object-fit: cover
}

@media only screen and (max-width: 1024px) {
    .home-page .categories__list .card-wrapper.-active {
        transform: scale(1.05);
        pointer-events: all
    }

    .home-page .categories__list .card-wrapper.-active .card-shadow {
        opacity: 1;
        transition: opacity 1.5s cubic-bezier(0.23, 1, 0.32, 1)
    }

    .home-page .categories__list .card-wrapper.-active .card__title-element {
        transform: scale(1.25);
        text-shadow: 0px 0px 1rem #e6f3e8
    }

    .home-page .categories__list .card-wrapper.-active .card__border-left {
        opacity: 1;
        transition-delay: .6s
    }

    .home-page .categories__list .card-wrapper.-active .card__border-star {
        opacity: 1;
        transition-delay: .45s
    }

    .home-page .categories__list .card-wrapper.-active .card__border-right {
        opacity: 1;
        transition-delay: .6s
    }

    .home-page .categories__list .card-wrapper.-active .card__play .deck-card:nth-child(1) {
        transform: translate(-30%, 72%) rotate(-45deg) scale(0.9);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .home-page .categories__list .card-wrapper.-active .card__play .deck-card:nth-child(2) {
        transform: translate(-15%, 66%) rotate(-25deg) scale(0.9);
        transition: transform .75s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .home-page .categories__list .card-wrapper.-active .card__play .deck-card:nth-child(3) {
        transform: translate(5%, 62%) rotate(-10deg) scale(0.9);
        transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .home-page .categories__list .card-wrapper.-active .card__play .deck-card:nth-child(4) {
        transform: translate(25%, 62%) rotate(0deg) scale(0.9);
        transition: transform 1.05s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .home-page .categories__list .card-wrapper.-active .card__play .deck-card:nth-child(5) {
        transform: translate(45%, 67%) rotate(10deg) scale(0.9);
        transition: transform 1.2s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .home-page .categories__list .card-wrapper.-active .card__play .deck-card .shade {
        opacity: 1
    }

    .home-page .categories__list .card-wrapper.-active .card__play .play-card {
        transform: translate(0, -1.5rem) rotate(5deg) rotateY(0deg) scale(1.1);
        transition: transform .9s cubic-bezier(0.5, 0, 0.5, 1)
    }

    .home-page .categories__list .card-wrapper.-active .card__play .play-card .flip-card-inner {
        transform: rotateY(180deg);
        transition: transform 1.5s cubic-bezier(0.72, 0, 0.12, 1.54)
    }
}

@media only screen and (min-width: 1024px) {
    .home-page .categories__list .card-wrapper:hover {
        transform: scale(1.05)
    }

    .home-page .categories__list .card-wrapper:hover .card-shadow {
        opacity: 1;
        transition: opacity 1.5s cubic-bezier(0.23, 1, 0.32, 1)
    }

    .home-page .categories__list .card-wrapper:hover .card__title-element {
        transform: scale(1.25);
        text-shadow: 0px 0px 1rem #e6f3e8
    }

    .home-page .categories__list .card-wrapper:hover .card__border-left {
        opacity: 1;
        transition-delay: .6s
    }

    .home-page .categories__list .card-wrapper:hover .card__border-star {
        opacity: 1;
        transition-delay: .45s
    }

    .home-page .categories__list .card-wrapper:hover .card__border-right {
        opacity: 1;
        transition-delay: .6s
    }

    .home-page .categories__list .card-wrapper:hover .card__play .deck-card:nth-child(1) {
        transform: translate(-30%, 72%) rotate(-45deg) scale(0.9);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .home-page .categories__list .card-wrapper:hover .card__play .deck-card:nth-child(2) {
        transform: translate(-15%, 66%) rotate(-25deg) scale(0.9);
        transition: transform .75s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .home-page .categories__list .card-wrapper:hover .card__play .deck-card:nth-child(3) {
        transform: translate(5%, 62%) rotate(-10deg) scale(0.9);
        transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .home-page .categories__list .card-wrapper:hover .card__play .deck-card:nth-child(4) {
        transform: translate(25%, 62%) rotate(0deg) scale(0.9);
        transition: transform 1.05s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .home-page .categories__list .card-wrapper:hover .card__play .deck-card:nth-child(5) {
        transform: translate(45%, 67%) rotate(10deg) scale(0.9);
        transition: transform 1.2s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .home-page .categories__list .card-wrapper:hover .card__play .deck-card .shade {
        opacity: 1
    }

    .home-page .categories__list .card-wrapper:hover .card__play .play-card {
        transform: translate(0, -1.5rem) rotate(5deg) rotateY(0deg) scale(1.1);
        transition: transform .9s cubic-bezier(0.5, 0, 0.5, 1)
    }

    .home-page .categories__list .card-wrapper:hover .card__play .play-card .flip-card-inner {
        transform: rotateY(180deg);
        transition: transform 1.5s cubic-bezier(0.72, 0, 0.12, 1.54)
    }
}

.home-page .categories__description {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 3rem;
    color: #a689d2;
    text-align: center
}

.home-page .categories__description p {
    margin: 0;
    max-width: 60%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 3rem
}

.home-page .about {
    position: relative;
    z-index: 10;
    margin-top: 4rem;
    margin-left: 1.5rem;
    margin-right: 1.5rem;
    text-align: center
}

.home-page .about *::-moz-selection {
    background-color: #a689d2
}

.home-page .about *::selection {
    background-color: #a689d2
}

@media only screen and (min-width: 1024px) {
    .home-page .about {
        width: 48.611%;
        margin-top: 7rem;
        margin-left: auto;
        margin-right: auto
    }
}

.home-page .about__title {
    position: relative;
    margin-bottom: 1.5rem
}

@media only screen and (min-width: 1024px) {
    .home-page .about__title {
        margin-bottom: 3rem
    }
}

.home-page .about__decorative-star {
    position: relative;
    width: 0;
    padding: 6rem 0;
    margin-top: -1rem;
    margin-bottom: -1rem;
    margin-left: auto;
    margin-right: auto;
    pointer-events: none;
    display: flex;
    justify-content: center;
    align-items: center
}

@media only screen and (min-width: 1024px) {
    .home-page .about__decorative-star {
        padding: 15.71% 0;
        margin-top: initial;
        margin-bottom: initial
    }
}

.home-page .about__decorative-star .star-wrap {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    justify-content: center;
    width: .24rem;
    height: 100%;
    animation-name: homeStarAbout;
    animation-duration: 6s;
    animation-iteration-count: infinite;
    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1)
}

.home-page .about__decorative-star .star-wrap:last-child {
    animation-delay: -3s
}

.home-page .about__decorative-star .diamond {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    height: 100%;
    background-color: #7b47c9;
    -webkit-clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
    clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%)
}

.home-page .about__decorative-star .diamond:last-child {
    transform: rotate(90deg)
}

.home-page .about__decorative-star .star-wrap:last-child {
    transform: rotate(45deg)
}

.home-page .about__description {
    position: relative;
    max-width: 32rem;
    margin-left: auto;
    margin-right: auto
}

.home-page .about__authors {
    position: relative;
    margin-top: 5rem
}

.home-page .about__authors label {
    position: absolute;
    top: 30%;
    left: 30%;
    width: 40%;
    height: 40%;
    pointer-events: none;
    opacity: 1;
    animation-name: flyXYZ;
    animation-duration: 36s;
    animation-iteration-count: infinite;
    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1)
}

.home-page .about__authors label::before {
    content: "";
    display: block;
    position: absolute;
    top: -0.5rem;
    width: .125rem;
    height: .125rem;
    border-radius: 50%;
    background-color: #e6f3e8;
    box-shadow: 0 0 .5rem .25rem #e6f3e8;
    transform-origin: 1rem 1rem;
    transform: rotate(0deg) translateY(0);
    opacity: 1;
    animation-name: flyZ;
    animation-duration: 16s;
    animation-iteration-count: infinite;
    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1)
}

.home-page .about__authors #anchor-target-2 {
    position: absolute;
    top: 50%
}

.home-page .about__authors .title {
    margin-bottom: 4rem
}

.home-page .about__authors .author-item {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1rem;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center
}

.home-page .about__authors .author-item .line {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -0.5rem;
    display: block;
    width: 40%;
    margin-left: auto;
    margin-right: auto;
    height: 1px;
    background-image: linear-gradient(to right, rgba(166, 137, 210, 0) 0%, #A689D2 50%, rgba(166, 137, 210, 0) 100%);
    opacity: .2
}

.home-page .about__authors .author-item .avatar {
    width: 22.857%;
    position: relative
}

.home-page .about__authors .author-item .avatar::before {
    content: "";
    display: block;
    position: absolute;
    top: -5%;
    left: -5%;
    width: 110%;
    height: 110%;
    border-radius: 50%;
    background-image: linear-gradient(135deg, #EEDB71 0%, #D8B43E 35%, #49432E 60%, #D8B43E 100%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    padding: 1px;
    opacity: .2
}

.home-page .about__authors .author-item .avatar::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: -10%;
    width: 120%;
    height: 1px;
    background-image: linear-gradient(90deg, #EEDB71 0%, #D8B43E 35%, #49432E 60%, #D8B43E 100%);
    opacity: .2
}

.home-page .about__authors .author-item .avatar figure {
    position: relative;
    width: 100%;
    padding: 50% 0;
    border-radius: 50%;
    overflow: hidden;
    transform: translateZ(0);
    background-color: #120b1c
}

.home-page .about__authors .author-item .avatar figure img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

@media only screen and (min-width: 1024px) {
    .home-page .about__authors .author-item .avatar figure img {
        transform: scale(1);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
    }
}

.home-page .about__authors .author-item .avatar .icon {
    position: absolute;
    top: 100%;
    left: 100%;
    padding: .5rem;
    transform: translate(-2rem, -2rem)
}

@media only screen and (min-width: 1024px) {
    .home-page .about__authors .author-item .avatar .icon {
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
    }
}

.home-page .about__authors .author-item .avatar .icon::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 1px solid #7b47c9
}

@media only screen and (min-width: 1024px) {
    .home-page .about__authors .author-item .avatar .icon::before {
        transform: scale(1);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
    }
}

.home-page .about__authors .author-item .avatar .arrow-icon {
    width: 2rem;
    margin-left: auto;
    margin-right: auto
}

@media only screen and (min-width: 1024px) {
    .home-page .about__authors .author-item .avatar .arrow-icon {
        transform: translateZ(0);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
    }
}

.home-page .about__authors .author-item .name {
    margin-left: 2rem
}

@media only screen and (min-width: 1024px) {
    .home-page .about__authors .author-item .name {
        text-shadow: 0px 0px 1rem rgba(230, 243, 232, 0);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1), text-shadow .6s cubic-bezier(0.23, 1, 0.32, 1)
    }
}

.home-page .about__authors .author-item .dec-icon {
    border: 1px solid rgba(210, 161, 125, .1254901961);
    border-radius: 50%;
    margin: 0 1rem
}

.home-page .about__authors .author-item .dec-icon img {
    width: 2rem
}

.home-page .about__authors .author-item:nth-child(2n) {
    flex-direction: row-reverse
}

.home-page .about__authors .author-item:nth-child(2n) .avatar .icon {
    position: absolute;
    top: 100%;
    left: initial;
    right: 100%;
    transform: translate(2rem, -2rem)
}

.home-page .about__authors .author-item:nth-child(2n) .name {
    margin-left: 0;
    margin-right: 2rem
}

.home-page .about__authors .author-item:last-child .line {
    display: none
}

@media only screen and (min-width: 1024px) {
    .home-page .about__authors .author-item:hover .avatar figure img {
        transform: scale(1.2)
    }

    .home-page .about__authors .author-item:hover .avatar .icon {
        transform: translate(0, -2rem)
    }

    .home-page .about__authors .author-item:hover .avatar .icon::before {
        transform: scale(0.8)
    }

    .home-page .about__authors .author-item:hover .name {
        text-shadow: 0px 0px 1rem #e6f3e8
    }
}

.home-page .about__subdescription {
    position: relative;
    width: 80%;
    max-width: 24rem;
    margin-left: auto;
    margin-right: auto
}

@media only screen and (min-width: 1024px) {
    .home-page .about__subdescription {
        width: 65.714%;
        margin-left: auto;
        margin-right: auto
    }
}

.home-page .subscribe {
    position: relative;
    z-index: 3;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 4rem;
    margin-bottom: 4rem
}

@media only screen and (min-width: 1024px) {
    .home-page .subscribe {
        margin-top: 7rem
    }

    .home-page .subscribe::before {
        content: "";
        display: block;
        position: absolute;
        z-index: 3;
        top: auto;
        right: auto;
        bottom: auto;
        left: auto;
        width: 100%;
        height: .06rem;
        background-color: #7b47c9;
        -webkit-clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
        clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%)
    }
}

.home-page .subscribe__decorative-star {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 160%;
    pointer-events: none
}

.home-page .subscribe__decorative-star .star-wrap {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    justify-content: center;
    width: .12rem;
    height: 100%
}

.home-page .subscribe__decorative-star .star-wrap.-rotate {
    opacity: .2;
    animation-name: rotateIt;
    animation-duration: 128s;
    animation-iteration-count: infinite;
    animation-timing-function: linear
}

.home-page .subscribe__decorative-star .diamond {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    height: 100%;
    background-color: #a689d2;
    -webkit-clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
    clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%)
}

.home-page .subscribe__decorative-star .diamond:last-child {
    transform: rotate(90deg)
}

.home-page .subscribe__container {
    position: relative;
    z-index: 3;
    margin-left: .5rem;
    margin-right: .5rem;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    padding-bottom: 2rem
}

@media only screen and (min-width: 1024px) {
    .home-page .subscribe__container {
        width: 48.611%;
        margin-left: auto;
        margin-right: auto;
        padding-bottom: 4rem
    }
}

.home-page .subscribe__container::before {
    content: "";
    display: block;
    position: absolute;
    z-index: 3;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    height: 100%;
    aspect-ratio: 1/1;
    background-color: #f5f5f5;
    border-radius: 50%
}

.home-page .subscribe__container::after {
    content: "";
    display: block;
    pointer-events: none;
    position: absolute;
    z-index: 3;
    top: 0;
    width: auto;
    height: auto;
    aspect-ratio: .96/1;
    bottom: 0;
    border: 1px solid #1e1131;
    border-radius: 50%
}

.home-page .subscribe__container .border {
    display: block;
    position: absolute;
    top: 6%;
    right: auto;
    bottom: auto;
    left: auto;
    z-index: 1;
    height: 88%;
    border-radius: 3rem 50% 3rem 3rem;
    opacity: .4;
    border: 1px solid #d2a17d
}

.home-page .subscribe__container .border img {
    width: auto;
    height: 100%
}

@media only screen and (min-width: 1024px) {
    .home-page .subscribe__container .border {
        top: 2%;
        height: 96%;
        border-radius: 6rem 50% 6rem 6rem
    }
}

.home-page .subscribe__container .icon-top-right {
    position: absolute;
    z-index: 4;
    top: -1.5rem;
    right: -1.5rem;
    width: 4rem;
    height: 4rem;
    border: 1px solid #d2a17d;
    border-radius: 50%
}

@media only screen and (min-width: 1024px) {
    .home-page .subscribe__container .icon-top-right {
        width: 5rem;
        height: 5rem;
        top: 0;
        right: 0
    }
}

.home-page .subscribe__container .icon-top-right img {
    transform-origin: top center;
    animation-name: feather;
    animation-duration: 9.3s;
    animation-iteration-count: infinite;
    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1)
}

.home-page .subscribe__container .icon-bottom-left {
    position: absolute;
    z-index: 4;
    bottom: -1.5rem;
    left: -0.5rem;
    width: 3rem;
    height: 3rem;
    border: 3px solid #d2a17d;
    border-radius: 50%
}

@media only screen and (min-width: 1024px) {
    .home-page .subscribe__container .icon-bottom-left {
        bottom: .5rem;
        left: .5rem;
        width: 4rem;
        height: 4rem
    }
}

.home-page .subscribe__container .icon-bottom-left::before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 10%;
    width: 80%;
    height: 1px;
    background-color: #d2a17d;
    animation-name: triangleLine;
    animation-duration: 6s;
    animation-iteration-count: infinite;
    animation-timing-function: cubic-bezier(0.4, 0.1, 0, 1)
}

.home-page .subscribe__container .icon-bottom-left img {
    position: relative
}

.home-page .subscribe__container .icon-bottom-right {
    position: absolute;
    z-index: 4;
    bottom: -0.75rem;
    right: .25rem;
    width: 1.5rem;
    height: 1.5rem;
    border: 2px solid #d2a17d;
    border-radius: 50%
}

@media only screen and (min-width: 1024px) {
    .home-page .subscribe__container .icon-bottom-right {
        bottom: 1.5rem;
        right: 1.5rem;
        width: 2rem;
        height: 2rem;
        border: 3px solid #d2a17d
    }
}

.home-page .subscribe__container .media {
    position: relative;
    z-index: 5;
    width: 42.666%;
    margin-left: auto;
    margin-right: auto;
    margin-top: .5rem;
    display: flex;
    justify-content: center;
    align-items: center
}

@media only screen and (min-width: 1024px) {
    .home-page .subscribe__container .media {
        width: 48.571%
    }
}

.home-page .subscribe__container .media-wrap {
    position: relative;
    background: #e6f3e8;
    width: 100%;
    height: 0;
    padding: 50% 0;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    transform: translateZ(0)
}

.home-page .subscribe__container .media-wrap img,
.home-page .subscribe__container .media-wrap video,
.home-page .subscribe__container .media-wrap .character {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto
}

.home-page .subscribe__container .media-wrap .character {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    transform-origin: center top;
    animation-name: swingIt;
    animation-duration: 6s;
    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1);
    animation-iteration-count: infinite;
    animation-delay: 0
}

.home-page .subscribe__container .media-wrap .character img:nth-child(1) {
    width: 50%;
    bottom: -5%;
    left: 30%;
    animation-name: rotateIt;
    animation-duration: 21s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-delay: 0
}

.home-page .subscribe__container .media-wrap .character img:nth-child(2) {
    width: 120%;
    max-width: initial;
    height: initial;
    bottom: 0
}

.home-page .subscribe__container .moon-left,
.home-page .subscribe__container .moon-right {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: -2rem;
    width: 2rem;
    aspect-ratio: 1/1
}

.home-page .subscribe__container .moon-right {
    left: auto;
    right: -2rem;
    transform: rotate(180deg)
}

.home-page .subscribe__container .success {
    position: absolute;
    z-index: 20;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    background: #e6f3e8;
    color: #120b1c;
    opacity: 0;
    transform: translate(0, 4rem);
    transition: transform 1.2s cubic-bezier(0.4, 0.1, 0, 1), opacity 1.2s cubic-bezier(0.4, 0.1, 0, 1);
    padding: 1rem 1.5rem;
    pointer-events: none;
    text-align: center;
    white-space: nowrap;
    border-radius: 1rem
}

@media only screen and (min-width: 1024px) {
    .home-page .subscribe__container .success {
        padding: 1rem 3rem
    }
}

.home-page .subscribe__container .success.-show {
    opacity: 1;
    transform: translateZ(0)
}

.home-page .subscribe__container .title {
    position: relative;
    z-index: 5;
    color: #120b1c
}

.home-page .subscribe__container .title *::-moz-selection {
    background-color: #a689d2
}

.home-page .subscribe__container .title *::selection {
    background-color: #a689d2
}

.home-page .subscribe__container .caption {
    position: relative;
    z-index: 5;
    margin-top: .5rem;
    color: #120b1c
}

.home-page .subscribe__container .input-field {
    position: relative;
    z-index: 5;
    margin-top: 1rem;
    margin-left: 2rem;
    margin-right: 2rem
}

@media only screen and (min-width: 1024px) {
    .home-page .subscribe__container .input-field {
        width: 69.696%;
        max-width: 23rem;
        margin-left: auto;
        margin-right: auto
    }
}

.home-page .subscribe__container input {
    width: 100%;
    border-radius: 0;
    border: none;
    border-bottom: 1px solid #7b47c9;
    text-align: center
}

.home-page .subscribe__container input::-moz-placeholder {
    font-family: "Boska";
    font-size: 1.35rem;
    line-height: 1.5rem;
    text-align: center;
    color: #7b47c9
}

.home-page .subscribe__container input::placeholder {
    font-family: "Boska";
    font-size: 1.35rem;
    line-height: 1.5rem;
    text-align: center;
    color: #7b47c9
}

@media only screen and (min-width: 1024px) {
    .home-page .subscribe__container input::-moz-placeholder {
        font-size: 1.8rem;
        line-height: 2rem
    }

    .home-page .subscribe__container input::placeholder {
        font-size: 1.8rem;
        line-height: 2rem
    }
}

.home-page .subscribe__container input:focus {
    color: #7b47c9
}

.home-page .subscribe__container input::-moz-selection {
    color: #f5f5f5;
    background-color: #a689d2
}

.home-page .subscribe__container input::selection {
    color: #f5f5f5;
    background-color: #a689d2
}

.home-page .subscribe__container .tooltip {
    display: block;
    position: absolute;
    z-index: 20;
    bottom: 100%;
    left: 50%;
    transform: translate(-50%, 50%);
    padding: .25rem .5rem;
    background: #1e1131;
    border-radius: .25rem;
    pointer-events: none;
    color: #e6f3e8;
    text-align: center;
    opacity: 0;
    transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1), opacity .6s cubic-bezier(0.4, 0.1, 0, 1)
}

.home-page .subscribe__container .tooltip::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -0.25rem;
    border-width: .25rem;
    border-style: solid;
    border-color: #7b47c9 rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0)
}

.home-page .subscribe__container .tooltip.-show {
    opacity: 1;
    transform: translate(-50%, 0)
}

.home-page .subscribe__container .button {
    position: relative;
    z-index: 5;
    margin-top: 1.5rem;
    margin-left: auto;
    margin-right: auto
}

@media only screen and (min-width: 1024px) {
    .home-page .subscribe__container .button {
        margin-top: 2rem
    }
}

.tarot-page {
    min-height: 600px
}

.tarot-page .welcome {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 40rem;
    max-height: 80vh
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome {
        min-height: 800px;
        height: 90vh;
        max-height: 60vw
    }
}

.tarot-page .welcome__decorative-circles {
    position: absolute;
    top: 20rem;
    right: auto;
    bottom: auto;
    left: auto;
    width: 200%;
    max-width: 72rem;
    display: flex;
    justify-content: center;
    align-items: center;
    -webkit-clip-path: polygon(-50% -50%, 150% -50%, 150% 50%, -50% 50%);
    clip-path: polygon(-50% -50%, 150% -50%, 150% 50%, -50% 50%)
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__decorative-circles {
        top: auto;
        bottom: 0;
        width: 100%;
        min-width: 1024px;
        max-width: 140vh;
        max-height: 100vw;
        -webkit-clip-path: none;
        clip-path: none
    }
}

.tarot-page .welcome__decorative-circles::before {
    content: "";
    display: block;
    position: absolute;
    top: 4rem;
    left: 0;
    right: 0;
    width: 4%;
    padding: 2% 0;
    margin-left: auto;
    margin-right: auto;
    border-radius: 50%;
    background-color: #a689d2;
    box-shadow: 0 0 4.8rem 5.4rem #a689d2;
    opacity: 0;
    transition: opacity 4.8s cubic-bezier(0.4, 0.1, 0, 1);
    transition-delay: 1.5s
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__decorative-circles::before {
        top: initial;
        bottom: 8rem;
        width: 8%;
        padding: 4% 0;
        box-shadow: 0 0 4.8rem 6.4rem #a689d2
    }
}

.tarot-page .welcome__decorative-circles::after {
    content: "";
    display: block;
    position: absolute;
    top: -3rem;
    left: 50%;
    height: 6rem;
    width: 1px;
    background-image: linear-gradient(to bottom, rgba(166, 137, 210, 0), #A689D2, rgba(166, 137, 210, 0));
    transform: translateZ(0);
    opacity: 1;
    transition: transform 3s cubic-bezier(0.4, 0.1, 0, 1), opacity 3s cubic-bezier(0.4, 0.1, 0, 1);
    will-change: transform, opacity
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__decorative-circles::after {
        top: initial;
        bottom: -3rem
    }
}

.tarot-page .welcome__decorative-circles .big {
    position: relative;
    width: 110%;
    border-radius: 50%;
    flex-shrink: 0;
    background-image: linear-gradient(90deg, rgba(166, 137, 210, 0), #A689D2, rgba(166, 137, 210, 0));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    padding: 1px;
    transform: translateZ(0);
    opacity: 1;
    transition: transform 3s cubic-bezier(0.4, 0.1, 0, 1), opacity 3s cubic-bezier(0.4, 0.1, 0, 1);
    will-change: transform, opacity
}

.tarot-page .welcome__decorative-circles .big::before {
    content: "";
    display: block;
    width: 100%;
    padding: 50% 0
}

.tarot-page .welcome__decorative-circles .small {
    content: "";
    display: block;
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 50%;
    border-radius: 50%;
    background-image: linear-gradient(90deg, rgba(166, 137, 210, 0), #A689D2, rgba(166, 137, 210, 0));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    padding: 1px;
    transform: translateZ(0);
    opacity: 1;
    transition: transform 3s cubic-bezier(0.4, 0.1, 0, 1), opacity 3s cubic-bezier(0.4, 0.1, 0, 1);
    will-change: transform, opacity
}

.tarot-page .welcome__decorative-circles .small::before {
    content: "";
    display: block;
    width: 100%;
    padding: 50% 0
}

.tarot-page .welcome__decorative-circles.-inview::before {
    opacity: 1
}

.tarot-page .welcome__decorative-circles.-ended .big,
.tarot-page .welcome__decorative-circles.-ended .small {
    transform: scale(0.5);
    opacity: 0
}

.tarot-page .welcome__decorative-circles.-ended::before {
    opacity: 0;
    transition-delay: 0
}

.tarot-page .welcome__decorative-circles.-ended::after {
    transform: translate(0, 4rem);
    opacity: 0
}

.tarot-page .welcome__dialog {
    position: relative;
    width: 100%;
    z-index: 5;
    margin-top: 10rem;
    margin-bottom: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__dialog {
        margin-top: 1rem;
        top: 32%
    }
}

.tarot-page .welcome__dialog .title-select {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 1;
    transform: translateZ(0);
    transition: transform 1.2s cubic-bezier(0.4, 0.1, 0, 1), opacity 1.2s cubic-bezier(0.4, 0.1, 0, 1);
    transition-delay: .9s
}

.tarot-page .welcome__dialog .title-select .pre {
    position: absolute;
    top: -2rem;
    right: auto;
    bottom: auto;
    left: auto;
    white-space: nowrap;
    color: #a689d2;
    opacity: 1;
    transform: translateZ(0);
    transition: transform 1.5s cubic-bezier(0.3, 0, 0.14, 1), opacity 1.2s cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .welcome__dialog .title-select .title {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    margin-bottom: .35rem;
    opacity: 1;
    transform: translateZ(0);
    transition: transform 1.5s cubic-bezier(0.3, 0, 0.14, 1), opacity 1.2s cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .welcome__dialog .title-select .title.title-left {
    right: 100%;
    margin-right: 1rem
}

.tarot-page .welcome__dialog .title-select .title.title-right {
    left: 100%;
    margin-left: 1rem
}

.tarot-page .welcome__dialog .title-select .how-many {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 2rem
}

.tarot-page .welcome__dialog .title-select .how-many::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 1px solid #d2a17d;
    border-radius: 50%
}

.tarot-page .welcome__dialog .title-select .how-many label {
    width: .2rem;
    height: .2rem;
    border-radius: 50%;
    background-color: #e6f3e8;
    position: absolute
}

.tarot-page .welcome__dialog .title-select .how-many label:nth-child(1) {
    top: -0.5rem
}

.tarot-page .welcome__dialog .title-select .how-many label:nth-child(2) {
    right: -0.5rem
}

.tarot-page .welcome__dialog .title-select .how-many label:nth-child(3) {
    bottom: -0.5rem
}

.tarot-page .welcome__dialog .title-select .how-many label:nth-child(4) {
    left: -0.5rem
}

.tarot-page .welcome__dialog .title-select .how-many span {
    flex-shrink: 0;
    display: block;
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    text-shadow: 0px 0px 1rem #e6f3e8;
    margin-bottom: .35rem;
    opacity: 0;
    transform: scale(1.5);
    transition: transform 1.2s cubic-bezier(0.23, 1, 0.32, 1), opacity 1.2s cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .welcome__dialog .title-select .how-many span.-active {
    opacity: 1;
    transform: scale(1);
    transition-delay: .3s
}

.tarot-page .welcome__dialog .title-select .how-many-left {
    text-align: center;
    white-space: nowrap;
    position: absolute;
    left: auto;
    right: auto;
    bottom: -2rem;
    display: flex;
    justify-content: center;
    align-items: center
}

.tarot-page .welcome__dialog .title-select .how-many-left span {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    opacity: 0;
    transform: scale(1.5);
    transition: transform 1.5s cubic-bezier(0.3, 0, 0.14, 1), opacity 1.5s cubic-bezier(0.3, 0, 0.14, 1)
}

.tarot-page .welcome__dialog .title-select .how-many-left span.-active {
    opacity: 1;
    transform: scale(1);
    transition-delay: .45s
}

.tarot-page .welcome__dialog .title-select.-hidden .pre {
    opacity: 0;
    transform: translate(0, -2rem)
}

.tarot-page .welcome__dialog .title-select.-hidden .title {
    opacity: 0;
    transform: translate(0, -4rem) scale(0.8)
}

.tarot-page .welcome__dialog .title-select.-ended {
    opacity: 0;
    transform: scale(0.5)
}

.tarot-page .welcome__dialog .title-revert {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    text-align: center;
    opacity: 0;
    transition: opacity 3s cubic-bezier(0.4, 0.1, 0, 1);
    transition-delay: 3s
}

.tarot-page .welcome__dialog .title-revert .escort {
    width: 100%;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 2rem
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__dialog .title-revert .escort {
        margin-bottom: 1rem
    }
}

.tarot-page .welcome__dialog .title-revert .escort div {
    width: 80%;
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    display: block;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: opacity 1.2s cubic-bezier(0.3, 0, 0.14, 1);
    transition-delay: 2.7s
}

.tarot-page .welcome__dialog .title-revert .escort div span {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    color: #e6f3e8
}

.tarot-page .welcome__dialog .title-revert .escort div span:first-child {
    opacity: 0;
    position: relative;
    filter: blur(2rem);
    transform: translateZ(0) scale(3);
    transition: transform 3s cubic-bezier(0.4, 0.1, 0, 1), opacity 3s cubic-bezier(0.4, 0.1, 0, 1), filter 3s cubic-bezier(0.4, 0.1, 0, 1);
    transition-delay: 1.2s
}

.tarot-page .welcome__dialog .title-revert .escort div span:last-child {
    display: none;
    opacity: 1;
    filter: initial;
    transform: translateZ(0) scale(1);
    transition: transform 20s cubic-bezier(0.5, 0, 0.5, 1), opacity 15s cubic-bezier(0.4, 0.1, 0, 1), filter 6s cubic-bezier(0.4, 0.1, 0, 1);
    transition-delay: 4.2s
}

.tarot-page .welcome__dialog .title-revert .escort div:first-child {
    position: relative
}

.tarot-page .welcome__dialog .title-revert .escort div:first-child span:first-child {
    transition-delay: 5.4s
}

.tarot-page .welcome__dialog .title-revert .escort div:first-child span:last-child {
    transition-delay: 2.4s
}

.tarot-page .welcome__dialog .title-revert .escort div.-active {
    opacity: 1
}

.tarot-page .welcome__dialog .title-revert .escort div.-active span:first-child {
    opacity: 1;
    transform: translateZ(0) scale(1);
    filter: blur(0)
}

.tarot-page .welcome__dialog .title-revert .escort div.-active span:last-child {
    opacity: 0;
    transform: translateZ(0) scale(24);
    filter: blur(4px)
}

.tarot-page .welcome__dialog .title-revert .escort div.-done {
    opacity: 0;
    transition: opacity .6s cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .welcome__dialog .title-revert .title {
    display: block;
    color: #a689d2;
    opacity: 0;
    transform: scale(1.5);
    transition: opacity 6s cubic-bezier(0.4, 0.1, 0, 1), transform 3s cubic-bezier(0.4, 0.1, 0, 1);
    transition-delay: 10.2s
}

.tarot-page .welcome__dialog .title-revert.-clicked .title {
    transition-delay: 4.2s
}

.tarot-page .welcome__dialog .title-revert.-show {
    opacity: 1
}

.tarot-page .welcome__dialog .title-revert.-show .title {
    opacity: 1;
    transform: translateZ(0)
}

.tarot-page .welcome__dialog .title-revert.-show .title.-hidden {
    opacity: 0;
    transform: scale(1.5);
    transition: opacity 3s cubic-bezier(0.4, 0.1, 0, 1), transform 1.5s cubic-bezier(0.4, 0.1, 0, 1);
    transition-delay: 0s
}

.tarot-page .welcome__dialog .title-revert.-show .title.-show {
    opacity: 1;
    transform: translateZ(0);
    transition: opacity 6s cubic-bezier(0.4, 0.1, 0, 1), transform 3s cubic-bezier(0.4, 0.1, 0, 1);
    transition-delay: 0s
}

.tarot-page .welcome__dialog .title-revert.-ended {
    opacity: 0;
    transform: scale(0.5);
    transition-delay: 0s
}

.tarot-page .welcome__dialog .title-reading {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    text-align: center;
    opacity: 0;
    transform: scale(0.5) translate(0, 4rem);
    transition: transform 3s cubic-bezier(0.4, 0.1, 0, 1), opacity 3s cubic-bezier(0.4, 0.1, 0, 1);
    transition-delay: 3s
}

.tarot-page .welcome__dialog .title-reading.-show {
    opacity: 1;
    transform: translateZ(0)
}

.tarot-page .welcome__dialog .title-ask {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    text-align: center;
    display: flex;
    opacity: 0;
    transform: scale(0.5) translate(0, 4rem);
    transition: transform 2.1s cubic-bezier(0.4, 0.1, 0, 1), opacity 2.1s cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .welcome__dialog .title-ask .-h2 {
    margin: 0 auto;
    max-width: 25rem
}

.tarot-page .welcome__dialog .title-ask .-h2 .gpt-icon {
    position: relative;
    display: inline-block;
    width: 6.85rem;
    top: 1rem
}

.tarot-page .welcome__dialog .title-ask.-show {
    opacity: 1;
    transform: translateZ(0) translateY(-25%) scale(1)
}

.tarot-page .welcome__lobby-list {
    position: absolute;
    z-index: 3;
    top: 20rem;
    right: auto;
    bottom: auto;
    left: auto;
    width: 200%;
    max-width: 72rem;
    -webkit-clip-path: polygon(-50% -50%, 150% -50%, 150% 50%, -50% 50%);
    clip-path: polygon(-50% -50%, 150% -50%, 150% 50%, -50% 50%);
    transform: translateZ(0);
    transition: transform 3s cubic-bezier(0.4, 0.1, 0, 1), opacity 1.2s cubic-bezier(0.23, 1, 0.32, 1)
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__lobby-list {
        --m-drag: 0;
        display: flex;
        justify-content: center;
        align-items: center
    }
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__lobby-list {
        top: auto;
        bottom: 0;
        width: 100%;
        min-width: 1024px;
        max-width: 140vh;
        max-height: 100vw;
        -webkit-clip-path: none;
        clip-path: none
    }
}

.tarot-page .welcome__lobby-list::before {
    content: "";
    display: block;
    position: relative;
    width: 110%;
    border-radius: 50%;
    padding: 55% 0;
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: center
}

.tarot-page .welcome__lobby-list *::-moz-selection {
    background-color: #a689d2
}

.tarot-page .welcome__lobby-list *::selection {
    background-color: #a689d2
}

.tarot-page .welcome__lobby-list .lobby-list-inner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    -webkit-user-drag: auto;
    touch-action: none;
    will-change: transform
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__lobby-list .lobby-list-inner {
        transform: rotate(calc(var(--m-drag) * 1deg + 0deg));
        /* transition:transform .3s ease-out; */
    }
}

.tarot-page .welcome__lobby-list .magic-dust.-fly {
    position: absolute;
    z-index: 20;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 60%;
    height: 60%;
    opacity: 1;
    border-radius: 50%;
    overflow: hidden;
    pointer-events: none
}

.tarot-page .welcome__lobby-list .card-magic-circle {
    position: absolute;
    z-index: 20;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 40%;
    padding: 20% 0;
    opacity: 1;
    pointer-events: none
}

.tarot-page .welcome__lobby-list .card-magic-circle.-hidden {
    opacity: 0;
    transition: opacity .9s cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .welcome__lobby-list .card-magic-circle .magic-parent {
    position: absolute;
    left: 0;
    top: 0;
    bottom: auto;
    width: 80%;
    height: 80%;
    animation-name: rotateIt;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    animation-direction: reverse
}

.tarot-page .welcome__lobby-list .card-magic-circle .magic-bubble {
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: #e6f3e8;
    animation-iteration-count: infinite;
    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1)
}

.tarot-page .welcome__lobby-list .card-magic-circle .magic-bubble.anim-1 {
    animation-name: magic-horisontal-11
}

.tarot-page .welcome__lobby-list .card-magic-circle .magic-bubble.anim-2 {
    animation-name: magic-horisontal-22
}

.tarot-page .welcome__lobby-list .card-magic-circle .magic-bubble.anim-3 {
    animation-name: magic-horisontal-33;
    animation-duration: 2s
}

.tarot-page .welcome__lobby-list .card-magic-circle .magic-bubble.anim-4 {
    animation-name: magic-horisontal-44
}

.tarot-page .welcome__lobby-list .card-axis {
    position: absolute;
    left: auto;
    right: auto;
    width: 8rem;
    height: 100%;
    margin-top: auto;
    margin-left: auto;
    margin-right: auto;
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    box-sizing: initial;
    pointer-events: none;
    transform: rotate(calc(180deg - -10deg * var(--c-order)));
    transition: transform calc(2.1s*(1.5 + .0375*(var(--c-count)/2 - var(--c-order)))) cubic-bezier(0.3, 0, 0.14, 1);
    will-change: transform
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__lobby-list .card-axis.-m-hidden {
        opacity: 0
    }
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__lobby-list .card-axis {
        width: 11.1%;
        max-width: 8rem;
        transform: rotate(calc(-5deg * var(--c-order)))
    }
}

.tarot-page .welcome__lobby-list .card-wrapper {
    width: 100%;
    height: 28%;
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none;
    perspective: 600px;
    transform: rotate(180deg);
    transition: transform calc(2.1s*(1.5 + .0375*(var(--c-count)/2 - var(--c-order)))) cubic-bezier(0.3, 0, 0.14, 1);
    will-change: transform
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__lobby-list .card-wrapper {
        transform: rotate(calc(-1.5deg * var(--c-order)))
    }
}

.tarot-page .welcome__lobby-list .card-wrapper .count-title {
    position: absolute;
    top: auto;
    right: auto;
    bottom: -3.2rem;
    left: auto;
    pointer-events: none;
    text-shadow: 0px 0px 1rem #e6f3e8;
    opacity: 0;
    transform: translate(0, 4rem) rotate(-180deg);
    transition: transform 1.5s cubic-bezier(0.8, 0, 0.35, 1), opacity 1.5s cubic-bezier(0.8, 0, 0.35, 1);
    will-change: transform
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__lobby-list .card-wrapper .count-title {
        top: -1rem;
        bottom: auto;
        transform: translate(0, 4rem)
    }
}

.tarot-page .welcome__lobby-list .card-wrapper .count-title.-show {
    transform: translateZ(0) rotate(-180deg);
    opacity: 1
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__lobby-list .card-wrapper .count-title.-show {
        transform: translateZ(0)
    }
}

.tarot-page .welcome__lobby-list .card-wrapper .card-name {
    white-space: nowrap;
    position: absolute;
    top: 96%;
    right: auto;
    bottom: auto;
    left: auto;
    pointer-events: none;
    text-shadow: 0px 0px 1rem #e6f3e8;
    opacity: 0;
    transform: translate(0, 4rem) rotate(-180deg);
    transition: transform 2.1s cubic-bezier(0.23, 1, 0.32, 1), opacity 2.1s cubic-bezier(0.4, 0.1, 0, 1);
    will-change: transform
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__lobby-list .card-wrapper .card-name {
        top: auto;
        bottom: 82%;
        transform: translate(0, 4rem)
    }
}

.tarot-page .welcome__lobby-list .card-wrapper .card-name.-show {
    transform: translateZ(0) rotate(-180deg);
    opacity: 1
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__lobby-list .card-wrapper .card-name.-show {
        transform: translateZ(0)
    }
}

.tarot-page .welcome__lobby-list .card-wrapper .magic-dust {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    transform: translateZ(-50px)
}

.tarot-page .welcome__lobby-list .card-wrapper .card-magic {
    pointer-events: none;
    position: absolute;
    top: -5%;
    left: -40%;
    width: 140%;
    height: 80%;
    transform-origin: center bottom;
    transform: translateZ(20px) rotate(calc(6.5deg * var(--c-order)))
}

.tarot-page .welcome__lobby-list .card-wrapper .magic-parent {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    animation-name: magic-vertical;
    animation-iteration-count: infinite;
    animation-timing-function: linear
}

.tarot-page .welcome__lobby-list .card-wrapper .magic-bubble {
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: #e6f3e8;
    animation-iteration-count: infinite;
    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1)
}

.tarot-page .welcome__lobby-list .card-wrapper .magic-bubble.anim-1 {
    animation-name: magic-horisontal-1
}

.tarot-page .welcome__lobby-list .card-wrapper .magic-bubble.anim-2 {
    animation-name: magic-horisontal-2
}

.tarot-page .welcome__lobby-list .card-wrapper .magic-bubble.anim-3 {
    animation-name: magic-horisontal-3;
    animation-duration: 2s
}

.tarot-page .welcome__lobby-list .card-wrapper .magic-bubble.anim-4 {
    animation-name: magic-horisontal-4
}

.tarot-page .welcome__lobby-list .card {
    width: 100%;
    cursor: pointer;
    pointer-events: all;
    position: relative;
    transform-style: preserve-3d;
    transform: translateZ(0);
    transition: transform .6s cubic-bezier(0.23, 1, 0.32, 1)
}

.tarot-page .welcome__lobby-list .card .flip-card-inner {
    transform-style: preserve-3d;
    position: relative;
    width: 100%;
    transform: translateZ(0)
}

.tarot-page .welcome__lobby-list .card .flip-card-back {
    position: relative;
    width: 100%;
    border-radius: .35rem;
    overflow: hidden;
    transform: translateZ(1px)
}

.tarot-page .welcome__lobby-list .card .flip-card-back::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: radial-gradient(circle at 50% 50%, rgba(199, 198, 243, 0.3), transparent) !important;
    opacity: 0;
    transform: translateZ(0);
    will-change: opacity;
    transition: all .3s cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .welcome__lobby-list .card .flip-card-back img {
    display: block;
    width: 100%
}

.tarot-page .welcome__lobby-list .card .flip-card-back .glare {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity .6s cubic-bezier(0.23, 1, 0.32, 1);
    pointer-events: none
}

.tarot-page .welcome__lobby-list .card .shade {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transform: translateZ(0.5px) scale(1.1);
    opacity: 1;
    transition: opacity .6s cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .welcome__lobby-list .card .flip-card-front {
    position: absolute;
    top: .5%;
    left: .5%;
    width: 99%;
    height: 99%;
    background-color: #f5f5f5;
    border-radius: .35rem;
    overflow: hidden;
    padding: 4.68% 4.68%;
    box-sizing: border-box;
    transform: rotateY(180deg) translateZ(0px)
}

.tarot-page .welcome__lobby-list .card .flip-card-front::after {
    content: "";
    display: block;
    position: absolute;
    top: 1.9%;
    bottom: 1.9%;
    left: 3.125%;
    right: 3.125%;
    background-image: linear-gradient(to right bottom, #D2A17D 20%, #49432E 70%, #D2A17D 100%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    padding: 1px;
    border-radius: .25rem;
    opacity: .2
}

.tarot-page .welcome__lobby-list .card .flip-card-front video {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: .5rem;
    overflow: hidden;
    transform: translateZ(0)
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__lobby-list .card:hover {
        transform: scale(1.025) translate(0, 5%)
    }

    .tarot-page .welcome__lobby-list .card:hover .flip-card-back .glare {
        opacity: .6
    }
}

.tarot-page .welcome__lobby-list .card.-selected {
    transform: scale(1) translate(0, -25%);
    transition: transform .9s cubic-bezier(0.89, -0.72, 0.65, 1);
    cursor: default
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__lobby-list .card.-selected {
        transform: scale(1) translate(0, 35%)
    }
}

.tarot-page .welcome__lobby-list .card.-selected .flip-card-back::after {
    opacity: .6
}

.tarot-page .welcome__lobby-list .card.-selected .flip-card-back .glare {
    opacity: 0
}

.tarot-page .welcome__lobby-list.-shuffling .lobby-list-inner {
    transform: rotate(calc(var(--m-drag) * 1deg + 360deg));
    transition: transform 6s cubic-bezier(0.3, 0, 0.14, 1), opacity 1.2s cubic-bezier(0.23, 1, 0.32, 1)
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__lobby-list.-shuffling .lobby-list-inner {
        transform: rotate(-360deg);
        transition: transform 6s cubic-bezier(0.3, 0, 0.14, 1)
    }
}

.tarot-page .welcome__lobby-list.-shuffling-end .lobby-list-inner {
    transition: transform 0s linear
}

.tarot-page .welcome__lobby-list.-shuffling-half .card-axis {
    transform: rotate(210deg);
    transition: transform calc(1.2s*(1.5 + .0375*(var(--c-count)/2 - var(--c-order)))) cubic-bezier(0.3, 0, 0.14, 1)
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__lobby-list.-shuffling-half .card-axis {
        transform: rotate(-60deg)
    }
}

.tarot-page .welcome__lobby-list.-choice-is-made .card-axis {
    pointer-events: none;
    transform: rotate(-180deg) translate(-400%, 0);
    transition: transform calc(.9s*(1.2 + .075*(var(--c-count)/2 - var(--c-order)))) cubic-bezier(0.5, 0, 0.5, 1);
    transition-delay: calc(.01s*(var(--c-count)/2 - var(--c-order)))
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__lobby-list.-choice-is-made .card-axis {
        transform: rotate(-135deg)
    }
}

.tarot-page .welcome__lobby-list.-choice-is-made .card {
    pointer-events: none;
    transform: translateZ(0) rotateY(75deg);
    transition: transform calc(2s*(1.2 + .075*(var(--c-count)/2 - var(--c-order)))) cubic-bezier(0.4, 0.1, 0, 1);
    transition-delay: calc(.01s*(var(--c-count)/2 - var(--c-order)))
}

.tarot-page .welcome__lobby-list.-choice-is-made .card .flip-card-back::after {
    opacity: 0;
    transition: all .9s cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .welcome__lobby-list.-choice-is-made .card .flip-card-back .glare {
    opacity: 0
}

.tarot-page .welcome__lobby-list.-choice-is-made .card .shade {
    opacity: 0
}

.tarot-page .welcome__lobby-list.-choice-is-made .card.-selected {
    transform: translateZ(0);
    transition: transform 6s cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .welcome__lobby-list.-choice-is-made .card.-selected .shade {
    opacity: 1
}

.tarot-page .welcome__lobby-list.-choice-is-made .card.-selected .flip-card-back::after {
    opacity: 0
}

.tarot-page .welcome__lobby-list.-no-card .card {
    display: none
}

.tarot-page .welcome__lobby-list.-no-card .card.-selected {
    display: block
}

.tarot-page .welcome__lobby-list.-go-fly {
    transform: translate(0, -50%);
    -webkit-clip-path: polygon(-50% -50%, 150% -50%, 150% 100%, -50% 100%);
    clip-path: polygon(-50% -50%, 150% -50%, 150% 100%, -50% 100%)
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__lobby-list.-go-fly {
        transform: translate(0, 20%);
        -webkit-clip-path: none;
        clip-path: none
    }
}

.tarot-page .welcome__lobby-list.-go-fly .lobby-list-inner {
    transform: rotate(-360deg);
    transition: transform 6s cubic-bezier(0.5, 0, 0.5, 1)
}

.tarot-page .welcome__lobby-list.-go-fly .card-axis.-selected {
    transition: transform 3s cubic-bezier(0.8, 0, 0.35, 1)
}

.tarot-page .welcome__lobby-list.-go-fly .card-axis.-selected[data-choise="1"] {
    transform: rotate(-648deg)
}

.tarot-page .welcome__lobby-list.-go-fly .card-axis.-selected[data-choise="2"] {
    transform: rotate(-576deg)
}

.tarot-page .welcome__lobby-list.-go-fly .card-axis.-selected[data-choise="3"] {
    transform: rotate(-504deg)
}

.tarot-page .welcome__lobby-list.-go-fly .card-axis.-selected[data-choise="4"] {
    transform: rotate(-432deg)
}

.tarot-page .welcome__lobby-list.-go-fly .card-axis.-selected[data-choise="5"] {
    transform: rotate(-360deg)
}

.tarot-page .welcome__lobby-list.-go-fly .card-axis.yes-no.-selected[data-choise="1"] {
    transform: rotate(-630deg)
}

.tarot-page .welcome__lobby-list.-go-fly .card-axis.yes-no.-selected[data-choise="2"] {
    transform: rotate(-450deg)
}

.tarot-page .welcome__lobby-list.-go-fly .card-axis.one.-selected[data-choise="1"] {
    transform: rotate(-540deg)
}

.tarot-page .welcome__lobby-list.-go-fly .card-axis.three.-selected[data-choise="1"] {
    transform: rotate(-600deg)
}

.tarot-page .welcome__lobby-list.-go-fly .card-axis.three.-selected[data-choise="2"] {
    transform: rotate(-480deg)
}

.tarot-page .welcome__lobby-list.-go-fly .card-axis.three.-selected[data-choise="3"] {
    transform: rotate(-360deg)
}

.tarot-page .welcome__lobby-list.-go-fly .card-wrapper {
    transform: rotate(0deg) translate(0, 20%)
}

.tarot-page .welcome__lobby-list.-go-fly .card-wrapper:not(.-selected) {
    transform: rotate(0deg) translate(0, 100%);
    transition: transform 3s cubic-bezier(0.8, 0, 0.35, 1)
}

.tarot-page .welcome__lobby-list.-go-fly .card-wrapper.-selected {
    transform: rotate(0deg) translate(0, -90%);
    transition: transform 3s cubic-bezier(0.5, 0, 0.5, 1)
}

.tarot-page .welcome__lobby-list.-go-fly .card {
    transform: translateZ(0)
}

.tarot-page .welcome__lobby-list.-go-fly .card .flip-card-back::after {
    opacity: 0
}

.tarot-page .welcome__lobby-list.-go-fly .card .flip-card-back .glare {
    opacity: 0
}

.tarot-page .welcome__lobby-list.-go-fly .card.-selected {
    transform: translateZ(0) rotate(-180deg);
    transition: transform 4.2s cubic-bezier(0.3, 0, 0.14, 1)
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__lobby-list.-go-fly .card.-selected {
        transform: translateZ(0)
    }
}

.tarot-page .welcome__lobby-list.-now-revert {
    transform: translate(0, 0%)
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__lobby-list.-now-revert {
        transform: translate(0, 0)
    }
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__lobby-list.-now-revert .lobby-list-inner {
        transform: rotate(calc(var(--m-drag) * 1deg - 360deg));
        transition: transform .3s ease-out
    }
}

.tarot-page .welcome__lobby-list.-now-revert .card-axis.-selected {
    pointer-events: all;
    transition: transform 3.3s cubic-bezier(0.3, 0, 0.14, 1)
}

.tarot-page .welcome__lobby-list.-now-revert .card-axis.-selected[data-choise="1"],
.tarot-page .welcome__lobby-list.-now-revert .card-axis.-selected[data-choise="2"],
.tarot-page .welcome__lobby-list.-now-revert .card-axis.-selected[data-choise="3"],
.tarot-page .welcome__lobby-list.-now-revert .card-axis.-selected[data-choise="4"],
.tarot-page .welcome__lobby-list.-now-revert .card-axis.-selected[data-choise="5"] {
    transform: rotate(calc(182deg + 40deg* var(--c-choise) - 120deg));
}

@media only screen and (min-width: 1024px) {

    .tarot-page .welcome__lobby-list.-now-revert .card-axis.-selected[data-choise="1"],
    .tarot-page .welcome__lobby-list.-now-revert .card-axis.-selected[data-choise="2"],
    .tarot-page .welcome__lobby-list.-now-revert .card-axis.-selected[data-choise="3"],
    .tarot-page .welcome__lobby-list.-now-revert .card-axis.-selected[data-choise="4"],
    .tarot-page .welcome__lobby-list.-now-revert .card-axis.-selected[data-choise="5"] {
        transform: rotate(calc(-720deg + 25deg * var(--c-choise) - 75deg))
    }
}

.tarot-page .welcome__lobby-list.-now-revert .card-axis.yes-no.-selected[data-choise="1"],
.tarot-page .welcome__lobby-list.-now-revert .card-axis.yes-no.-selected[data-choise="2"] {
    transform: rotate(calc(-540deg + 40deg * var(--c-choise) - 60deg))
}

@media only screen and (min-width: 1024px) {

    .tarot-page .welcome__lobby-list.-now-revert .card-axis.yes-no.-selected[data-choise="1"],
    .tarot-page .welcome__lobby-list.-now-revert .card-axis.yes-no.-selected[data-choise="2"] {
        transform: rotate(calc(-720deg + 50deg * var(--c-choise) - 75deg))
    }
}

.tarot-page .welcome__lobby-list.-now-revert .card-axis.one.-selected[data-choise="1"] {
    transform: rotate(calc(-540deg + 40deg * var(--c-choise) - 40deg))
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__lobby-list.-now-revert .card-axis.one.-selected[data-choise="1"] {
        transform: rotate(calc(-720deg + 75deg * var(--c-choise) - 75deg))
    }
}

.tarot-page .welcome__lobby-list.-now-revert .card-axis.three.-selected[data-choise="1"],
.tarot-page .welcome__lobby-list.-now-revert .card-axis.three.-selected[data-choise="2"],
.tarot-page .welcome__lobby-list.-now-revert .card-axis.three.-selected[data-choise="3"] {
    transform: rotate(calc(-540deg + 40deg * var(--c-choise) - 80deg))
}

@media only screen and (min-width: 1024px) {

    .tarot-page .welcome__lobby-list.-now-revert .card-axis.three.-selected[data-choise="1"],
    .tarot-page .welcome__lobby-list.-now-revert .card-axis.three.-selected[data-choise="2"],
    .tarot-page .welcome__lobby-list.-now-revert .card-axis.three.-selected[data-choise="3"] {
        transform: rotate(calc(-720deg + 37.5deg * var(--c-choise) - 75deg))
    }
}

.tarot-page .welcome__lobby-list.-now-revert .card-wrapper.-selected {
    transform: rotate(0deg) translate(0, 0);
    transition: transform 2.1s cubic-bezier(0.4, 0.1, 0, 1);
    transition-delay: calc(.6s + .3s*var(--c-choise))
}

.tarot-page .welcome__lobby-list.-now-revert .card.-selected {
    cursor: pointer;
    pointer-events: all;
    transform: translateZ(0) rotate(-180deg);
    transition: transform .6s cubic-bezier(0.23, 1, 0.32, 1)
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__lobby-list.-now-revert .card.-selected {
        transform: translateZ(0)
    }

    .tarot-page .welcome__lobby-list.-now-revert .card.-selected:hover {
        transform: scale(1.025) translateZ(0)
    }

    .tarot-page .welcome__lobby-list.-now-revert .card.-selected:hover .flip-card-back .glare {
        opacity: .6
    }
}

.tarot-page .welcome__lobby-list.-open .card.-selected.-open {
    z-index: 40;
    cursor: default;
    transform: scale(1.35) rotate(-180deg);
    transition: transform 3s cubic-bezier(0.5, 0, 0.5, 1)
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__lobby-list.-open .card.-selected.-open {
        transform: scale(1.35)
    }
}

.tarot-page .welcome__lobby-list.-open .card.-selected.-open .flip-card-inner {
    transform: rotateY(180deg);
    transition: transform 3s cubic-bezier(0.72, 0, 0.12, 1.54)
}

.tarot-page .welcome__lobby-list.-open .card.-selected.-open .flip-card-back::after {
    opacity: 0
}

.tarot-page .welcome__lobby-list.-open .card.-selected.-open .flip-card-back .glare {
    opacity: 0
}

.tarot-page .welcome__lobby-list.-open .card.-selected.-open .shade {
    transform: translateZ(0.5px) scale(1.4) translateY(10%);
    opacity: 0;
    transition: transform 1.2s cubic-bezier(0.5, 0, 0.5, 1), opacity 1.5s cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .welcome__lobby-list.-open .card.-selected.-done {
    transform: scale(1) rotate(-180deg);
    transition: transform 1.8s cubic-bezier(0.4, 0.1, 0, 1);
    transition-delay: .6s
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__lobby-list.-open .card.-selected.-done {
        transform: scale(1)
    }
}

.tarot-page .welcome__lobby-list.-open .card.-selected.-done .shade {
    transform: translateZ(0.5px) scale(1.1) translateY(0%);
    opacity: 1;
    transition: transform 1.8s cubic-bezier(0.4, 0.1, 0, 1), opacity 1.8s cubic-bezier(0.4, 0.1, 0, 1);
    transition-delay: .6s
}

.tarot-page .welcome__lobby-list.-go-to-place {
    pointer-events: none;
    -webkit-clip-path: none;
    clip-path: none
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__lobby-list.-go-to-place .cards-nav {
        opacity: 0;
        transform: scale(0.5);
        pointer-events: none !important
    }
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__lobby-list.-go-to-place .lobby-list-inner {
        transform: rotate(-360deg);
        transition: transform 1.2s cubic-bezier(0.5, 0, 0.5, 1)
    }
}

.tarot-page .welcome__lobby-list.-go-to-place .card-axis.-selected {
    pointer-events: cursor;
    transition: transform 6s cubic-bezier(0.3, 0, 0.14, 1)
}

.tarot-page .welcome__lobby-list.-go-to-place .card-axis.-selected.-selected[data-choise="1"],
.tarot-page .welcome__lobby-list.-go-to-place .card-axis.-selected.-selected[data-choise="2"],
.tarot-page .welcome__lobby-list.-go-to-place .card-axis.-selected.-selected[data-choise="3"],
.tarot-page .welcome__lobby-list.-go-to-place .card-axis.-selected.-selected[data-choise="4"],
.tarot-page .welcome__lobby-list.-go-to-place .card-axis.-selected.-selected[data-choise="5"] {
    transform: rotate(-720deg) translate(0%, 22.5%)
}

.tarot-page .welcome__lobby-list.-go-to-place .card-axis.-hidden {
    transform: rotate(-720deg) translate(0%, 22.5%) scale(1.5) !important;
    opacity: 0 !important;
    transition: transform 1.2s cubic-bezier(0.3, 0, 0.14, 1), opacity 1.2s cubic-bezier(0.3, 0, 0.14, 1) !important;
    pointer-events: none !important
}

.tarot-page .welcome__lobby-list.-go-to-place .card-wrapper.-selected {
    transform: rotate(0deg) translate(calc(var(--c-move-x) * -1px), calc(var(--c-move-y) * 1px))
}

.tarot-page .welcome__lobby-list.-go-to-place .card-wrapper.-selected[data-choise="1"] .card.-selected {
    transform: rotate(10deg);
    transition: transform 4.5s cubic-bezier(0.3, 0, 0.14, 1);
    transition-delay: 0s
}

.tarot-page .welcome__lobby-list.-go-to-place .card-wrapper.-selected[data-choise="2"] .card.-selected {
    transform: rotate(5deg);
    transition: transform 4.5s cubic-bezier(0.3, 0, 0.14, 1);
    transition-delay: 0s
}

.tarot-page .welcome__lobby-list.-go-to-place .card-wrapper.-selected[data-choise="3"] .card.-selected {
    transform: rotate(-7deg);
    transition: transform 4.5s cubic-bezier(0.3, 0, 0.14, 1);
    transition-delay: 0s
}

.tarot-page .welcome__lobby-list.-go-to-place .card-wrapper.-selected[data-choise="4"] .card.-selected {
    transform: rotate(-3deg);
    transition: transform 4.5s cubic-bezier(0.3, 0, 0.14, 1);
    transition-delay: 0s
}

.tarot-page .welcome__lobby-list.-go-to-place .card-wrapper.-selected[data-choise="5"] .card.-selected {
    transform: rotate(6deg);
    transition: transform 4.5s cubic-bezier(0.3, 0, 0.14, 1);
    transition-delay: 0s
}

.tarot-page .welcome__lobby-list.-go-to-place .card-wrapper .card-name {
    opacity: 0;
    transform: translate(0, 4rem)
}

.tarot-page .welcome__lobby-list.-results-time .card-axis.-selected {
    transition: transform 0s linear
}

.tarot-page .welcome__lobby-list.-results-time .card-wrapper.-selected {
    transition: transform 0s linear
}

.tarot-page .welcome__lobby-list.-results-time .card-wrapper.-selected[data-choise="1"] .card.-selected,
.tarot-page .welcome__lobby-list.-results-time .card-wrapper.-selected[data-choise="2"] .card.-selected,
.tarot-page .welcome__lobby-list.-results-time .card-wrapper.-selected[data-choise="3"] .card.-selected,
.tarot-page .welcome__lobby-list.-results-time .card-wrapper.-selected[data-choise="4"] .card.-selected,
.tarot-page .welcome__lobby-list.-results-time .card-wrapper.-selected[data-choise="5"] .card.-selected {
    transition: transform 0s linear
}

.tarot-page .welcome__lobby-list.-setup .card-axis {
    /* pointer-events:none; */
    transform: rotate(90deg) translateZ(0)
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__lobby-list.-setup .card-axis {
        transform: rotate(135deg) translateZ(0)
    }
}

.tarot-page .welcome__lobby-list.-setup .card-wrapper {
    transform: rotate(calc(180deg - 3deg * var(--c-order)))
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__lobby-list.-setup .card-wrapper {
        transform: rotate(calc(3deg * var(--c-order)))
    }
}

.tarot-page .welcome__lobby-list.-setup .card {
    pointer-events: none;
    transform: translateZ(0) rotateY(30deg)
}

.tarot-page .welcome__lobby-list.-blocked {
    cursor: progress
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__lobby-list.-blocked .cards-nav {
        opacity: 0;
        transform: scale(0.5);
        pointer-events: none !important
    }
}

.tarot-page .welcome__lobby-list.-blocked .card {
    pointer-events: none !important
}

.tarot-page .welcome__lobby-list.-hidden {
    transition: transform 3s cubic-bezier(0.4, 0.1, 0, 1), opacity 1.2s cubic-bezier(0.23, 1, 0.32, 1);
    opacity: 0
}

.tarot-page .welcome #shuffle {
    position: absolute;
    top: 16rem;
    right: auto;
    bottom: auto;
    left: auto;
    display: inline-flex;
    width: auto;
    opacity: 1;
    transform: translateZ(0);
    transition: transform 1.2s cubic-bezier(0.4, 0.1, 0, 1), opacity 1.2s cubic-bezier(0.4, 0.1, 0, 1)
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome #shuffle {
        top: 28.5%;
        right: 17.361%
    }
}

.tarot-page .welcome #shuffle.-hidden {
    pointer-events: none;
    opacity: 0;
    transform: scale(0.8) translate(0, -2rem)
}

.tarot-page .welcome__state-select {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: absolute;
    left: 50%;
    top: 10rem;
    padding: 1rem;
    transform: translate(-50%, 0%) scale(0.8);
    opacity: 0;
    pointer-events: none;
    transition: .6s cubic-bezier(0.23, 1, 0.32, 1);
    z-index: 3
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__state-select {
        top: 8rem;
        max-width: calc(100% - 2rem)
    }
}

.tarot-page .welcome__state-select .icon-sun-star {
    position: absolute;
    right: -5rem;
    bottom: 5rem
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__state-select .icon-sun-star {
        right: 1rem;
        bottom: 1rem;
        width: 2rem;
        height: 2rem
    }
}

.tarot-page .welcome__state-select .icon-echinus {
    position: absolute;
    left: -7rem;
    top: 5rem;
    width: 4rem;
    height: 4rem
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__state-select .icon-echinus {
        left: 2rem;
        top: -2.5rem;
        width: 2rem;
        height: 2rem
    }
}

.tarot-page .welcome__state-select .arrow-watch {
    --width: 0.1rem;
    --approximation: 1.0;
    --rotate: 30;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 5rem;
    height: 5rem;
    border-radius: 50%;
    background-color: rgba(30, 17, 49, .4);
    transform: rotate(calc(var(--rotate) * 1deg))
}

.tarot-page .welcome__state-select .arrow-watch>span {
    position: absolute;
    width: 100%;
    height: 50%;
    bottom: 0;
    left: 0;
    overflow: hidden;
    transform: translateY(0.5rem)
}

.tarot-page .welcome__state-select .arrow-watch>span span {
    position: absolute;
    left: calc(var(--width)*-1 - 5%);
    bottom: 0;
    width: 110%;
    height: 220%;
    border-radius: 50%;
    flex-shrink: 0;
    padding: var(--width);
    opacity: calc(.8*var(--approximation));
    background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), #ffffff, rgba(255, 255, 255, 0));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude
}

.tarot-page .welcome__state-select .arrow-watch>span span:before {
    content: "";
    display: block;
    width: 100%;
    padding: 50% 0
}

.tarot-page .welcome__state-select .arrow-watch .star {
    width: 2rem
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__state-select .arrow-watch {
        display: none
    }
}

.tarot-page .welcome__state-select .actions {
    display: flex;
    align-items: center;
    margin-top: -1rem
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__state-select .actions {
        flex-direction: column;
        margin-top: 0
    }
}

.tarot-page .welcome__state-select .actions .selecter-card-action-circle {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 185%;
    border-radius: 50%;
    flex-shrink: 0;
    padding: 1px;
    opacity: .4;
    background-image: linear-gradient(90deg, rgba(166, 137, 210, 0), #A689D2, rgba(166, 137, 210, 0));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none
}

.tarot-page .welcome__state-select .actions .selecter-card-action-circle::before {
    content: "";
    display: block;
    width: 100%;
    padding: 50% 0
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__state-select .actions .selecter-card-action-circle {
        display: none
    }
}

.tarot-page .welcome__state-select .actions .selecter-card {
    position: relative;
    box-sizing: border-box;
    padding: 2rem 1rem .5rem 1rem;
    margin-left: auto;
    margin-right: auto;
    cursor: pointer
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__state-select .actions .selecter-card {
        padding: 2rem 1rem 1.5rem 1rem;
        width: 12rem
    }
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__state-select .actions .selecter-card {
        padding: 1.5rem 0rem 1.5rem 0rem
    }
}

.tarot-page .welcome__state-select .actions .selecter-card:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    border: 1px solid #d2a17d;
    border-radius: 2rem;
    opacity: .1
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__state-select .actions .selecter-card:after {
        left: 1rem;
        right: 1rem;
        border-radius: 1.25rem
    }
}

.tarot-page .welcome__state-select .actions .selecter-card .selecter-card__decorative-circle-container {
    position: absolute;
    left: 50%;
    padding: 1px;
    bottom: -1rem;
    width: 85%;
    margin-left: -42.5%
}

.tarot-page .welcome__state-select .actions .selecter-card .selecter-card__decorative-circle-container::before {
    content: "";
    display: block;
    width: 100%;
    padding: 25% 0
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__state-select .actions .selecter-card .selecter-card__decorative-circle-container {
        width: 100%;
        margin-left: -50%
    }
}

.tarot-page .welcome__state-select .actions .selecter-card .selecter-card__decorative-circle {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    border-radius: 50%;
    flex-shrink: 0;
    padding: 1px;
    opacity: .4;
    background-image: linear-gradient(90deg, rgba(166, 137, 210, 0), #A689D2, rgba(166, 137, 210, 0));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude
}

.tarot-page .welcome__state-select .actions .selecter-card .selecter-card__decorative-circle::before {
    content: "";
    display: block;
    width: 100%;
    padding: 50% 0
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__state-select .actions .selecter-card .selecter-card__decorative-circle {
        width: 45%;
        margin-left: 27.5%;
        bottom: 0%
    }
}

.tarot-page .welcome__state-select .actions .selecter-card .selecter-card__left-decore {
    position: absolute;
    bottom: -0.5rem;
    left: .5rem;
    width: 23%;
    padding-bottom: 55%;
    border-bottom-left-radius: 1rem;
    border-left: 1px solid #d2a17d;
    border-bottom: 1px solid #d2a17d;
    pointer-events: none;
    opacity: .4
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__state-select .actions .selecter-card .selecter-card__left-decore {
        left: 2.5rem;
        width: 20%;
        padding-bottom: 25%
    }
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__state-select .actions .selecter-card .selecter-card__left-decore {
        border-bottom-left-radius: 2rem
    }
}

.tarot-page .welcome__state-select .actions .selecter-card .selecter-card__right-decore {
    position: absolute;
    bottom: -0.5rem;
    right: .5rem;
    width: 23%;
    padding-bottom: 55%;
    border-bottom-right-radius: 1rem;
    border-right: 1px solid #d2a17d;
    border-bottom: 1px solid #d2a17d;
    pointer-events: none;
    opacity: .4
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__state-select .actions .selecter-card .selecter-card__right-decore {
        right: 2.5rem;
        width: 20%;
        padding-bottom: 25%
    }
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__state-select .actions .selecter-card .selecter-card__right-decore {
        border-bottom-right-radius: 2rem
    }
}

.tarot-page .welcome__state-select .actions .selecter-card .selecter-card__center-line {
    position: absolute;
    top: 51%;
    height: 1px;
    left: -1rem;
    right: -1rem;
    background-color: #a689d2;
    -webkit-clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
    clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%)
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__state-select .actions .selecter-card .selecter-card__center-line {
        left: -2rem;
        right: -2rem
    }
}

.tarot-page .welcome__state-select .actions .selecter-card .selecter-card__r-star {
    position: absolute;
    left: 1rem;
    top: .75rem;
    transform: scale(1);
    transition: transform .9s cubic-bezier(0.5, 0, 0.5, 1)
}

.tarot-page .welcome__state-select .actions .selecter-card .selecter-card__r-star svg {
    aspect-ratio: 1/1;
    width: auto
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__state-select .actions .selecter-card .selecter-card__r-star {
        left: 3rem;
        top: .55rem
    }
}

.tarot-page .welcome__state-select .actions .selecter-card .selecter-card__l-star {
    position: absolute;
    right: 1rem;
    top: .75rem;
    transform: scale(1);
    transition: transform .9s cubic-bezier(0.5, 0, 0.5, 1)
}

.tarot-page .welcome__state-select .actions .selecter-card .selecter-card__l-star svg {
    aspect-ratio: 1/1;
    width: auto
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__state-select .actions .selecter-card .selecter-card__l-star {
        right: 3rem;
        top: .55rem
    }
}

.tarot-page .welcome__state-select .actions .selecter-card .selecter-card__title {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    font-family: "boska";
    font-weight: 400;
    padding: 0 2rem;
    box-sizing: border-box;
    text-align: center;
    display: flex;
    justify-content: center;
    transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1);
    z-index: 5;
    text-shadow: 0px 0px 1rem rgba(230, 243, 232, 0);
    transform: translate(-50%, -50%) translateZ(0);
    transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1), text-shadow .6s cubic-bezier(0.23, 1, 0.32, 1)
}

.tarot-page .welcome__state-select .actions .selecter-card .play-card {
    position: relative;
    z-index: 4
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__state-select .actions .selecter-card .play-card {
        display: flex
    }
}

.tarot-page .welcome__state-select .actions .selecter-card .play-card .card-block {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 10rem;
    height: 8rem;
    border-radius: 1rem;
    background-color: #1e1131
}

.tarot-page .welcome__state-select .actions .selecter-card .play-card .card-block img {
    width: 4rem
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__state-select .actions .selecter-card .play-card .card-block {
        width: 10.25;
        height: 5rem;
        padding: 0 .5rem
    }
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__state-select .actions .selecter-card .play-card .card-block:nth-child(1) {
        justify-content: start
    }
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__state-select .actions .selecter-card .play-card .card-block:nth-child(2) {
        justify-content: end
    }
}

.tarot-page .welcome__state-select .actions #state-default {
    position: relative;
    margin-right: 1rem;
    transform: rotate(-5deg);
    transition: 1.2s cubic-bezier(0.23, 1, 0.32, 1)
}

.tarot-page .welcome__state-select .actions #state-default .selecter-card-action-circle {
    transform: translate(-50%, -50%) scale(1.05);
    transition: .3s cubic-bezier(0.23, 1, 0.32, 1)
}

.tarot-page .welcome__state-select .actions #state-default:hover .selecter-card .selecter-card__title {
    transform: translate(-50%, -50%) scale(1.25);
    text-shadow: 0px 0px 1rem #e6f3e8
}

.tarot-page .welcome__state-select .actions #state-default:hover .selecter-card .selecter-card__l-star {
    transform: scale(2)
}

.tarot-page .welcome__state-select .actions #state-default:hover .selecter-card .selecter-card__r-star {
    transform: scale(2)
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__state-select .actions #state-default {
        margin-right: 0rem;
        transform: rotate(0deg)
    }
}

.tarot-page .welcome__state-select .actions #state-ai {
    position: relative;
    margin-left: 1rem;
    transform: rotate(5deg);
    transition: 1.2s cubic-bezier(0.23, 1, 0.32, 1)
}

.tarot-page .welcome__state-select .actions #state-ai .selecter-card-action-circle {
    transform: translate(-50%, -50%) rotate(90deg) scale(1.05);
    transition: .3s cubic-bezier(0.23, 1, 0.32, 1)
}

.tarot-page .welcome__state-select .actions #state-ai:hover .selecter-card .selecter-card__title {
    transform: translate(-50%, -50%) scale(1.25);
    text-shadow: 0px 0px 1rem #e6f3e8
}

.tarot-page .welcome__state-select .actions #state-ai:hover .selecter-card .selecter-card__l-star {
    transform: scale(2)
}

.tarot-page .welcome__state-select .actions #state-ai:hover .selecter-card .selecter-card__r-star {
    transform: scale(2)
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__state-select .actions #state-ai {
        margin-left: 0rem;
        transform: rotate(0deg)
    }
}

.tarot-page .welcome__state-select .actions .choice-hands {
    position: relative
}

.tarot-page .welcome__state-select .actions .choice-hands .choice-star-icon {
    position: absolute;
    width: 4rem;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%)
}

.tarot-page .welcome__state-select .actions .choice-hands .choice-hands-icon {
    width: 6.75rem;
    animation: rotate 60s steps(60) infinite;
    animation-delay: calc(var(--animationDelaySeconds)*-1s)
}

.tarot-page .welcome__state-select .choice {
    margin-top: 3.5rem;
    font-family: "boska";
    font-weight: 400;
    font-size: 1.35rem;
    color: #7b47c9
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__state-select .choice {
        align-self: start;
        padding-left: 3rem;
        margin-top: 2rem;
        font-size: 1.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome__state-select.-selected .actions #state-default {
        transform: rotate(-5deg) scale(0.7);
        opacity: 0
    }

    .tarot-page .welcome__state-select.-selected .actions #state-default.-select {
        transform: rotate(-3deg) scale(1.2) translateX(10%);
        opacity: 1
    }

    .tarot-page .welcome__state-select.-selected .actions #state-ai {
        transform: rotate(5deg) scale(0.7);
        opacity: 0
    }

    .tarot-page .welcome__state-select.-selected .actions #state-ai.-select {
        transform: rotate(3deg) scale(1.2) translateX(-10%);
        opacity: 1
    }
}

.tarot-page .welcome__question-form {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: absolute;
    left: 50%;
    top: 65vh;
    width: 100%;
    padding: 1rem;
    transform: translate(-50%, -50%) scale(0.8);
    opacity: 0;
    pointer-events: none;
    transition: .3s cubic-bezier(0.23, 1, 0.32, 1);
    z-index: 3
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__question-form {
        top: calc(24rem + 10vh);
        max-width: calc(100% - 2rem)
    }
}

.tarot-page .welcome__question-form .stars {
    position: absolute;
    left: 50%;
    top: 40%;
    width: 45rem;
    max-width: 80vw;
    transform: translate(-50%, -50%);
    -webkit-mask-image: url("/TarotLove/stars-mask.svg");
    mask-image: url("/TarotLove/stars-mask.svg");
    -webkit-mask-size: 200% 100%;
    mask-size: 200% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    animation: moveMaskStars 12s linear infinite
}

@keyframes moveMaskStars {

    0%,
    100% {
        -webkit-mask-position: left center;
        mask-position: left center
    }

    50% {
        -webkit-mask-position: right center;
        mask-position: right center
    }
}

.tarot-page .welcome__question-form .input-question {
    position: relative;
    border-radius: 1.6rem .6rem;
    background: rgba(18, 11, 28, .4);
    width: 100%;
    max-width: 35rem;
    height: 100px;
    align-content: center;
    text-align: center;
    text-align: -webkit-center;
}

.tarot-page .welcome__question-form .input-question .counter {
    position: absolute;
    left: 50%;
    bottom: -0.5rem;
    opacity: 0;
    transform: translate(-50%, calc(100% + 1rem));
    transition: .3s cubic-bezier(0.23, 1, 0.32, 1)
}

.tarot-page .welcome__question-form .input-question .counter.-show {
    opacity: 1;
    transform: translate(-50%, 100%)
}

.tarot-page .welcome__question-form .input-question::before {
    content: "";
    display: block;
    position: absolute;
    top: .5rem;
    left: .5rem;
    right: .5rem;
    bottom: .5rem;
    border-radius: 2rem;
    border: 1px solid #d2a17d;
    opacity: .2;
    pointer-events: none
}

.tarot-page .welcome__question-form .input-question .shadow {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 200%;
    border-radius: 50%;
    opacity: .4;
    background: #1e1131;
    filter: blur(1.4rem)
}

.tarot-page .welcome__question-form .input-question select#select-topic {
    padding: 10px;
}

.tarot-page .welcome__question-form .input-question select {
    white-space: break-spaces;
    text-wrap-style: balance;
    position: relative;
    padding: 10px 10px 10px 40px;
    text-align: center;
    color: #ceb9ed;
    width: 100%;
    font-size: 20px;
    box-sizing: border-box;
    background: #ffffff00;
    border: unset;
    height: 100px;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    text-align: center;
    text-align-last: center;
}

.tarot-page .welcome__question-form .input-question input::-moz-placeholder {
    color: #ceb9ed
}

.tarot-page .welcome__question-form .input-question input::placeholder {
    color: #ceb9ed
}

.tarot-page .welcome__question-form .input-question .tooltip {
    display: block;
    position: absolute;
    z-index: 20;
    bottom: 100%;
    left: 50%;
    transform: translate(-50%, 50%);
    padding: .25rem .5rem;
    background: #1e1131;
    border-radius: .25rem;
    pointer-events: none;
    color: #e6f3e8;
    text-align: center;
    opacity: 0;
    transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1), opacity .6s cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .welcome__question-form .input-question .tooltip::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -0.25rem;
    border-width: .25rem;
    border-style: solid;
    border-color: #7b47c9 rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0)
}

.tarot-page .welcome__question-form .input-question .tooltip.-show {
    opacity: 1;
    transform: translate(-50%, 0)
}

.tarot-page .welcome__question-form .input-question .arrow-icon {
    position: absolute;
    left: 1.5rem;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    width: 1.5rem
}

.tarot-page .welcome__question-form .input-question .decor {
    position: absolute;
    left: 50%;
    top: -0.6rem;
    transform: translate(-50%, -100%);
    pointer-events: none;
    width: 3.8rem
}

.tarot-page .welcome__question-form a {
    position: relative;
    margin-top: 3rem;
    padding: 1rem 5.8rem
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome__question-form a {
        padding: 1rem 3rem
    }
}

.tarot-page .welcome__question-form.-show {
    opacity: 1;
    pointer-events: all;
    transform: translate(-50%, -50%) scale(1)
}

.tarot-page .welcome__state-select.-show {
    opacity: 1;
    pointer-events: all;
    transform: translate(-50%, 0%) scale(1)
}

.tarot-page .welcome__loading {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 50%;
    top: calc(50% + 10vh);
    width: 70vh;
    height: 70vh;
    transform: translate(-50%, -50%) scale(0.3);
    opacity: 0;
    pointer-events: none;
    transition: 3s cubic-bezier(0.23, 1, 0.32, 1);
    z-index: 3
}

.tarot-page .welcome__loading span {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%)
}

.tarot-page .welcome__loading .atom {
    position: relative;
    width: var(--atom-size);
    height: var(--atom-size);
    animation: 24s atom infinite ease-in-out
}

.tarot-page .welcome__loading .atom::before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: var(--nucleus-size);
    height: var(--nucleus-size);
    margin-top: calc(var(--nucleus-size)/-2);
    margin-left: calc(var(--nucleus-size)/-2);
    background-image: radial-gradient(rgba(166, 137, 210, 0.3764705882) 10%, rgba(123, 71, 201, 0) 70%);
    border-radius: 50%;
    animation: 3s nucleus infinite cubic-bezier(0.65, 0, 0.35, 1)
}

.tarot-page .welcome__loading .atom>[class^=electron] {
    border-radius: 100%;
    width: 100%;
    height: var(--electron-orbit-size);
    position: absolute;
    top: 50%;
    margin-top: calc(var(--electron-orbit-size)/-2);
    animation: var(--electron-speed) electron-orbit infinite linear
}

.tarot-page .welcome__loading .atom>.electron-alpha {
    transform: rotate(60deg);
    animation: var(--electron-speed-alpha) electron-orbit infinite linear
}

.tarot-page .welcome__loading .atom>.electron-omega {
    transform: rotate(-60deg);
    animation: var(--electron-speed-omega) electron-orbit infinite linear
}

.tarot-page .welcome__loading .atom [class^=electron]::after {
    content: "";
    display: block;
    width: var(--electron-size);
    height: var(--electron-size);
    background-image: radial-gradient(#A689D2 10%, rgba(123, 71, 201, 0.2509803922) 50%, rgba(123, 71, 201, 0) 70%);
    border-radius: 50%;
    margin-top: calc(var(--electron-size)/-2);
    position: absolute;
    top: 50%;
    left: calc(var(--electron-size)/-1);
    transform: scale(1);
    animation: calc(var(--electron-speed)*2) electron infinite ease-in-out
}

.tarot-page .welcome__loading .atom .electron-alpha::after {
    animation: calc(var(--electron-speed-alpha)*2) electron infinite ease-in-out
}

.tarot-page .welcome__loading .atom .electron-omega::after {
    animation: calc(var(--electron-speed-omega)*2) electron infinite ease-in-out
}

.tarot-page .welcome__loading.-show {
    opacity: 1;
    pointer-events: all;
    transform: translate(-50%, -50%) scale(1)
}

@media only screen and (max-width: 1024px) {
    .tarot-page .welcome.-done {
        position: absolute;
        left: 0;
        right: 0
    }
}

@media only screen and (min-width: 1024px) {
    .tarot-page .welcome.-done {
        margin-bottom: clamp(-100vw, -90vh, -800px)
    }
}

.tarot-page .tarot-image {
    display: none
}

@media only screen and (min-width: 1024px) {
    .tarot-page .tarot-image {
        display: block;
        width: 8.333%;
        position: fixed;
        z-index: 3;
        left: 4.166%;
        bottom: 0;
        margin-bottom: 4.166%;
        pointer-events: none
    }

    .tarot-page .tarot-image figure {
        position: relative;
        width: 100%;
        padding: 50% 0;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: #e6f3e8;
        border-radius: 50%;
        overflow: hidden;
        transform: translate(0, 175%) scale(0.8);
        transition: transform .9s cubic-bezier(0.89, -0.72, 0.65, 1)
    }

    .tarot-page .tarot-image figure img {
        position: absolute;
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover
    }

    .tarot-page .tarot-image.-inview figure {
        transform: translateZ(0);
        transition: transform 2.1s cubic-bezier(0.4, 0.1, 0, 1);
        transition-delay: .6s
    }

    .tarot-page .tarot-image.-hidden figure,
    .tarot-page .tarot-image.-ended figure {
        transform: translate(0, 175%) scale(0.8);
        transition: transform .9s cubic-bezier(0.89, -0.72, 0.65, 1);
        transition-delay: 0s
    }
}

.tarot-page .tarot-aside-ad {
    position: relative;
    z-index: 20;
    border-radius: 1.2rem 2.5rem;
    background-image: linear-gradient(45deg, #7B47C9 0%, #1E1131 100%);
    background-size: 200%;
    animation: adBg 9s ease-in-out infinite;
    margin-left: 1.5rem;
    margin-right: 1.5rem;
    margin-top: -2.5rem;
    margin-bottom: 1rem;
    display: flex;
    justify-content: center;
    align-items: center;
    height: calc(var(--t-height)*1px + 4rem);
    opacity: 1;
    transform: translateZ(0);
    transition: transform 2.1s cubic-bezier(0.4, 0.1, 0, 1), opacity 2.1s cubic-bezier(0.4, 0.1, 0, 1), height 1.2s cubic-bezier(0.4, 0.1, 0, 1);
    will-change: height, transform, opacity
}

@media only screen and (max-width: 320px) {
    .tarot-page .tarot-aside-ad {
        margin-top: -8rem
    }
}

@media only screen and (max-width: 320px) {
    .tarot-page .tarot-aside-ad.-done {
        margin-top: 9.5rem;
        margin-bottom: -6rem
    }
}

@media only screen and (min-width: 1024px) {
    .tarot-page .tarot-aside-ad {
        margin-top: initial;
        margin-bottom: initial;
        height: 6rem;
        margin-top: initial;
        position: fixed;
        left: .694%;
        top: calc(100vh - .25rem);
        width: 31.944%;
        max-width: 23rem;
        transform: translate(0, -100%);
        margin-left: initial;
        margin-right: initial
    }

    .tarot-page .tarot-aside-ad:hover {
        height: calc(var(--t-height)*1px + 4rem)
    }

    .tarot-page .tarot-aside-ad.-hidden {
        pointer-events: none;
        opacity: 0;
        transform: translateZ(0);
        transition: transform .9s cubic-bezier(0.3, 0, 0.14, 1), opacity .9s cubic-bezier(1, 0, 0.65, 0.1);
        transition-delay: .3s
    }
}

.tarot-page .tarot-aside-ad.-ended {
    pointer-events: none;
    opacity: 0;
    transform: translateZ(0);
    transition: transform .9s cubic-bezier(0.3, 0, 0.14, 1), opacity .9s cubic-bezier(1, 0, 0.65, 0.1);
    transition-delay: .3s
}

.tarot-page .tarot-aside-ad .tarot-aside-ad-inner {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden
}

.tarot-page .tarot-aside-ad::before {
    content: "";
    display: block;
    position: absolute;
    z-index: 1;
    bottom: 0%;
    left: 0;
    width: 100%;
    height: 4rem;
    background-image: linear-gradient(to top, #7B47C9 0%, rgba(123, 71, 201, 0) 100%);
    border-radius: 0 0 1.2rem 2.5rem;
    pointer-events: none
}

.tarot-page .tarot-aside-ad::after {
    content: "";
    display: block;
    position: absolute;
    z-index: 2;
    top: .5rem;
    left: .5rem;
    right: .5rem;
    bottom: .5rem;
    border-radius: 2rem;
    border: 1px solid #e6f3e8;
    opacity: .4;
    pointer-events: none
}

.tarot-page .tarot-aside-ad>img {
    position: absolute;
    top: -0.5rem;
    right: auto;
    bottom: auto;
    left: auto;
    width: 2rem;
    animation-name: rotateIt;
    animation-duration: 21s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-delay: 0
}

.tarot-page .tarot-aside-ad .tarot-aside-ad-inner .the-ad-anchor {
    position: absolute;
    top: -12rem
}

.tarot-page .tarot-aside-ad .tarot-aside-ad-inner .the-ad {
    margin-left: 1.5rem;
    margin-right: 1.5rem;
    padding-top: 1.5rem;
    padding-bottom: 4rem
}

@media only screen and (min-width: 1024px) {
    .tarot-page .tarot-aside-ad .tarot-aside-ad-inner .the-ad {
        width: 77.27%;
        margin-left: auto;
        margin-right: auto
    }
}

.tarot-page .tarot-aside-ad .tarot-aside-ad-inner .the-ad img {
    display: initial;
    width: initial
}

.tarot-page .tarot-aside-ad .go-to-ad {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 2rem
}

@media only screen and (min-width: 1024px) {
    .tarot-page .tarot-aside-ad .go-to-ad {
        display: none
    }
}

.tarot-page .tarot-aside-ad.-done {
    display: none
}

.tarot-page .tarot-tips {
    margin: 20px;
    position: relative;
    z-index: 30;
    border-radius: 2.5rem 1.2rem;
    background-color: #120b1c;
    margin-left: 1.5rem;
    margin-right: 1.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    height: calc(var(--t-height)*1px + 4rem);
    opacity: 1;
    transform: translateZ(0);
    transition: transform 2.1s cubic-bezier(0.4, 0.1, 0, 1), opacity 2.1s cubic-bezier(0.4, 0.1, 0, 1), height 1.2s cubic-bezier(0.4, 0.1, 0, 1);
    will-change: height, transform, opacity
}

@media only screen and (min-width: 1024px) {
    .tarot-page .tarot-tips {
        background-color: rgba(18, 11, 28, .1254901961);
        backdrop-filter: blur(2rem);
        -webkit-backdrop-filter: blur(2rem);
        -moz-backdrop-filter: blur(2rem);
        height: 6rem;
        margin-top: initial;
        position: fixed;
        right: .694%;
        top: calc(100vh - .25rem);
        width: 31.944%;
        max-width: 23rem;
        transform: translate(0, -100%);
        margin-left: initial;
        margin-right: initial
    }

    .tarot-page .tarot-tips:hover {
        height: calc(var(--t-height)*1px + 4rem)
    }

    .tarot-page .tarot-tips.-hidden {
        pointer-events: none;
        opacity: 0;
        transform: translateZ(0);
        transition: transform .9s cubic-bezier(0.3, 0, 0.14, 1), opacity .9s cubic-bezier(1, 0, 0.65, 0.1);
        transition-delay: .3s
    }
}

.tarot-page .tarot-tips.-ended {
    pointer-events: none;
    opacity: 0;
    transform: translateZ(0);
    transition: transform .9s cubic-bezier(0.3, 0, 0.14, 1), opacity .9s cubic-bezier(1, 0, 0.65, 0.1);
    transition-delay: .3s
}

.tarot-page .tarot-tips .tarot-tips-inner {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden
}

.tarot-page .tarot-tips::before {
    content: "";
    display: block;
    position: absolute;
    z-index: 1;
    bottom: 0%;
    left: 0;
    width: 100%;
    height: 4rem;
    background-image: linear-gradient(to top, #120B1C 0%, rgba(18, 11, 28, 0) 100%);
    border-radius: 0 0 2.5rem 1.2rem;
    pointer-events: none
}

.tarot-page .tarot-tips::after {
    content: "";
    display: block;
    position: absolute;
    z-index: 2;
    top: .5rem;
    left: .5rem;
    right: .5rem;
    bottom: .5rem;
    border-radius: 2rem;
    border: 1px solid #d2a17d;
    opacity: .2;
    pointer-events: none
}

.tarot-page .tarot-tips img {
    position: absolute;
    top: -0.5rem;
    right: auto;
    bottom: auto;
    left: auto;
    width: 2rem;
    animation-name: rotateIt;
    animation-duration: 21s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-delay: 0
}

.tarot-page .tarot-tips .slides {
    position: absolute;
    top: 0;
    left: 0%;
    width: 100%;
    height: 100%
}

.tarot-page .tarot-tips .tip-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    opacity: 0;
    transform: translate(0, 2rem) scale(0.95);
    transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1), opacity .6s cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .tarot-tips .tip-slide.-show {
    pointer-events: all;
    opacity: 1;
    transform: translateZ(0);
    transition: transform 1.2s cubic-bezier(0.4, 0.1, 0, 1), opacity 1.2s cubic-bezier(0.4, 0.1, 0, 1);
    transition-delay: .3s
}

.tarot-page .tarot-tips .tip-slide div {
    margin-left: 1.5rem;
    margin-right: 1.5rem;
    padding-top: 1.5rem;
    padding-bottom: 4rem
}

@media only screen and (min-width: 1024px) {
    .tarot-page .tarot-tips .tip-slide div {
        width: 77.27%;
        margin-left: auto;
        margin-right: auto
    }
}

.tarot-page .tarot-tips .tip-slide .title {
    color: #e6f3e8;
    margin-bottom: .75rem;
    text-align: center;
    font-family: 'system-ui', sans-serif;
    font-weight: 400;
    line-height: 1.25
}

.tarot-page .tarot-tips .tip-slide p {
    margin-left: 1rem;
    margin-right: 1rem;
    font-family: 'system-ui', sans-serif;
    font-weight: 400;
    line-height: 1.25
}

@media only screen and (min-width: 1024px) {
    .tarot-page .tarot-tips .tip-slide p {
        width: 90%;
        margin-left: auto;
        margin-right: auto
    }
}

.tarot-page .tarot-tips footer {
    position: absolute;
    z-index: 3;
    bottom: .5rem;
    left: 0;
    right: 0;
    padding: 0 1.5rem .5rem;
    color: #e6f3e8;
    display: flex;
    justify-content: space-between
}

.tarot-page .tarot-tips footer .tips-pagination {
    opacity: .4
}

.tarot-page .tarot-tips footer button {
    display: flex;
    align-content: center;
    text-transform: uppercase
}

.tarot-page .tarot-tips footer button span {
    color: #d2a17d
}

.tarot-page .tarot-tips footer svg {
    width: 1.1rem;
    aspect-ratio: 1/1;
    margin-right: .5rem;
    stroke-width: 1.5px;
    stroke: #7b47c9;
    transform: rotate(-90deg) translateZ(0);
    stroke-dasharray: 62;
    stroke-dashoffset: 62
}

.tarot-page .tarot-tips footer svg.-stop {
    opacity: 0;
    transform: rotate(-90deg) scale(0.5);
    transition: transform .6s cubic-bezier(0.23, 1, 0.32, 1), opacity .6s cubic-bezier(0.23, 1, 0.32, 1)
}

.tarot-page .tarot-tips.-done {
    display: none
}

.tarot-page .go-to-tips {
    display: block;
    position: absolute;
    top: 5rem;
    right: 1rem;
    width: 3.5rem;
    height: 3.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid rgba(230, 243, 232, .2509803922);
    border-radius: 50%;
    box-sizing: border-box
}

@media only screen and (min-width: 1024px) {
    .tarot-page .go-to-tips {
        display: none
    }
}

.tarot-page .loading {
    position: fixed;
    z-index: 20;
    top: 1.8rem;
    right: 5rem;
    bottom: auto;
    animation-name: rotateIt;
    animation-duration: .9s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    width: 1.4rem;
    display: none
}

@media only screen and (min-width: 1024px) {
    .tarot-page .loading {
        top: 2rem;
        right: 17.361%;
        width: 1.1rem
    }
}

.tarot-page .loading svg {
    width: 100%;
    aspect-ratio: 1/1;
    fill: #e6f3e8
}

.tarot-page .loading.-show {
    display: block
}

.tarot-page .about {
    position: relative;
    z-index: 3;
    margin-top: 4rem;
    margin-left: 2rem;
    margin-right: 2rem;
    transform: translateZ(0);
    opacity: 1;
    transition: transform 1.2s cubic-bezier(0.4, 0.1, 0, 1), opacity 1.2s cubic-bezier(0.4, 0.1, 0, 1);
    will-change: transform, opacity
}

.tarot-page .about *::-moz-selection {
    background-color: #a689d2
}

.tarot-page .about *::selection {
    background-color: #a689d2
}

@media only screen and (min-width: 1024px) {
    .tarot-page .about {
        width: 31.944%;
        margin-top: 6rem;
        margin-left: auto;
        margin-right: auto
    }
}

.tarot-page .about.-hidden {
    transform: translate(0, 4rem);
    opacity: 0
}

.tarot-page .about__title {
    text-align: center;
    white-space: pre-wrap;
    margin-bottom: 2rem
}

.tarot-page .about__subtitle {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    margin-top: -1rem;
    margin-bottom: 2rem
}

.tarot-page .about__caption {
    width: 69.56%;
    margin-bottom: 1rem;
    color: #e6f3e8
}

.tarot-page .about__caption:nth-child(2n) {
    margin-left: 26.087%
}

.tarot-page .about.-done {
    margin: 0
}

.tarot-page .feel {
    margin-top: 4rem;
    position: relative;
    z-index: 3;
    transform: translateZ(0);
    opacity: 1;
    transition: transform 1.2s cubic-bezier(0.4, 0.1, 0, 1), opacity 1.2s cubic-bezier(0.4, 0.1, 0, 1);
    will-change: transform, opacity
}

.tarot-page .feel *::-moz-selection {
    background-color: #a689d2
}

.tarot-page .feel *::selection {
    background-color: #a689d2
}

.tarot-page .feel.-hidden {
    transform: translate(0, 4rem);
    opacity: 0
}

.tarot-page .feel__subtitle {
    text-align: center;
    white-space: pre-wrap;
    max-width: 60%;
    margin-left: auto;
    margin-right: auto
}

.tarot-page .feel #anchor-target {
    position: absolute;
    top: 40%;
    right: 0;
    bottom: auto;
    left: 0;
    margin-left: auto;
    margin-right: auto
}

.tarot-page .feel .grid {
    margin-top: 1.5rem;
    margin-left: .25rem;
    margin-right: .25rem;
    position: relative
}

@media only screen and (min-width: 1024px) {
    .tarot-page .feel .grid {
        width: 81.944%;
        margin-left: auto;
        margin-right: auto
    }
}

.tarot-page .feel .grid::before {
    content: "";
    display: block;
    position: absolute;
    top: -1rem;
    left: 50%;
    width: 1px;
    height: 100%;
    padding: 1rem 0;
    box-sizing: initial;
    background-image: linear-gradient(to bottom, rgba(166, 137, 210, 0) 0%, #A689D2 50%, rgba(166, 137, 210, 0) 100%)
}

.tarot-page .feel .row {
    position: relative;
    display: flex
}

.tarot-page .feel .row::before {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: 0%;
    width: 100%;
    height: 1px;
    background-image: linear-gradient(to right, rgba(166, 137, 210, 0) 0%, #A689D2 50%, rgba(166, 137, 210, 0) 100%)
}

.tarot-page .feel .row:last-child::before {
    content: none
}

.tarot-page .feel .row-item {
    width: 50%;
    padding: 1.5rem 0;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center
}

@media only screen and (min-width: 1024px) {
    .tarot-page .feel .row-item {
        padding: 3rem 0
    }
}

.tarot-page .feel .row-item p {
    color: #d2a17d;
    margin: 0 1.5rem
}

@media only screen and (min-width: 1024px) {
    .tarot-page .feel .row-item p {
        margin: 0 .5rem
    }
}

.tarot-page .feel .icon-row {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 0
}

.tarot-page .feel .icon-wrap {
    background-color: #1e1131;
    padding: .25rem;
    border-radius: 50%
}

.tarot-page .feel.-done {
    margin: 0
}

.tarot-page .results {
    display: none;
    position: relative;
    z-index: 3;
    padding-top: 8rem
}

.tarot-page .results *::-moz-selection {
    background-color: #a689d2
}

.tarot-page .results *::selection {
    background-color: #a689d2
}

@media only screen and (min-width: 1024px) {
    .tarot-page .results {
        padding-top: 13rem
    }
}

.tarot-page .results.-show {
    display: block
}

.tarot-page .results #anchor-target-new {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    pointer-events: none
}

.tarot-page .results #result-icon {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: .5rem;
    opacity: 0;
    transform: scale(0.5);
    transition: transform 2.1s cubic-bezier(0.4, 0.1, 0, 1), opacity 2.1s cubic-bezier(0.4, 0.1, 0, 1);
    transition-delay: 1.2s;
    will-change: transform, opacity
}

@media only screen and (max-width: 1024px) {
    .tarot-page .results #result-icon {
        width: 4rem;
        height: 4rem
    }
}

.tarot-page .results #result-icon.-show {
    opacity: 1;
    transform: translateZ(0);
    background-image: url(/images/xbticon.png);
    background-size: 100%;
    background-repeat: no-repeat;
}

.tarot-page .results>h2 {
    position: relative;
    text-align: center;
    opacity: 0;
    transform: translate(0, 4rem);
    transition: transform 2.1s cubic-bezier(0.4, 0.1, 0, 1), opacity 2.1s cubic-bezier(0.4, 0.1, 0, 1);
    transition-delay: 1.2s;
    will-change: transform, opacity
}

@media only screen and (min-width: 1024px) {
    .tarot-page .results>h2 {
        margin-bottom: 3rem
    }
}

.tarot-page .results>h2.-show {
    opacity: 1;
    transform: translateZ(0)
}

.tarot-page .results>h2 label {
    position: absolute;
    top: 0;
    left: 25%;
    width: 50%;
    height: 0%;
    pointer-events: none;
    opacity: 1;
    animation-name: flyXY;
    animation-duration: 18s;
    animation-iteration-count: infinite;
    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1)
}

.tarot-page .results>h2 label::before {
    content: "";
    display: block;
    position: absolute;
    top: -0.5rem;
    width: .125rem;
    height: .125rem;
    border-radius: 50%;
    background-color: #e6f3e8;
    box-shadow: 0 0 .5rem .25rem #e6f3e8;
    transform-origin: 2rem 3rem;
    transform: rotate(0deg) translateY(0);
    opacity: 1;
    animation-name: flyZ;
    animation-duration: 16s;
    animation-iteration-count: infinite;
    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1)
}

.tarot-page .results__row {
    position: relative;
    margin-left: .25rem;
    margin-right: .25rem;
    padding-top: 4rem;
    padding-bottom: 4rem;
    display: flex;
    flex-direction: column
}

@media only screen and (min-width: 1024px) {
    .tarot-page .results__row {
        width: 65.277%;
        margin-left: auto;
        margin-right: auto;
        flex-direction: initial;
        justify-content: space-between;
        align-items: flex-start
    }
}

.tarot-page .results__row .line {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    display: block;
    width: 100%;
    height: 1px;
    background-image: linear-gradient(to right, rgba(166, 137, 210, 0) 0%, #A689D2 50%, rgba(166, 137, 210, 0) 100%);
    opacity: 0;
    transform: translate(0, 4rem);
    transition: transform 2.1s cubic-bezier(0.4, 0.1, 0, 1), opacity 2.1s cubic-bezier(0.4, 0.1, 0, 1);
    transition-delay: 1.8s;
    will-change: transform, opacity
}

.tarot-page .results__row .line.-show {
    opacity: 1;
    transform: translateZ(0)
}

.tarot-page .results__row .image {
    width: 100%;
    padding: 6.5rem 0
}

@media only screen and (min-width: 1024px) {
    .tarot-page .results__row .image {
        width: 36.17%;
        padding: 10% 0
    }
}

.tarot-page .results__row .content {
    width: 100%;
    opacity: 0;
    transform: translate(0, 4rem);
    transition: transform 2.1s cubic-bezier(0.4, 0.1, 0, 1), opacity 2.1s cubic-bezier(0.4, 0.1, 0, 1);
    transition-delay: 1.5s;
    will-change: transform, opacity
}

@media only screen and (min-width: 1024px) {
    .tarot-page .results__row .content {
        width: 61.7%
    }
}

.tarot-page .results__row .content.-show {
    opacity: 1;
    transform: translateZ(0)
}

.tarot-page .results__row .title {
    text-align: center;
    margin-bottom: 1.5rem
}

@media only screen and (min-width: 1024px) {
    .tarot-page .results__row .title {
        width: 93.103%
    }
}

.tarot-page .results__row h5:first-child {
    color: #d2a17d
}

.tarot-page .results__row p {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    color: #e6f3e8
}

@media only screen and (min-width: 1024px) {
    .tarot-page .results__row p {
        width: 55.172%;
        padding-right: 3.448%
    }
}

.tarot-page .results__row.-last .line {
    display: none
}

.tarot-page .results__row.-resume {
    flex-direction: column;
    align-items: center
}

.tarot-page .results__row.-resume .icon {
    margin-bottom: 1rem
}

@media only screen and (min-width: 1024px) {
    .tarot-page .results__row.-resume .content {
        width: 100%
    }
}

@media only screen and (min-width: 1024px) {
    .tarot-page .results__row.-resume p {
        padding-right: 0
    }
}

.tarot-page .results .replay {
    position: relative;
    text-align: center;
    padding: .75rem 0 6rem;
    margin-left: auto;
    margin-right: auto
}

.tarot-page .results .replay .bg-circle {
    display: block;
    position: absolute;
    z-index: 0;
    top: 3rem;
    left: -5%;
    width: 110%;
    border-radius: 50%;
    flex-shrink: 0;
    pointer-events: none;
    opacity: .2;
    background-image: linear-gradient(90deg, rgba(166, 137, 210, 0), #A689D2, rgba(166, 137, 210, 0));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    padding: 1px
}

.tarot-page .results .replay .bg-circle::before {
    content: "";
    display: block;
    width: 100%;
    padding: 50% 0
}

.tarot-page .results .replay .dream-catch {
    width: 6.4rem;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1rem
}

.tarot-page .results .replay .button {
    display: inline-flex
}

.tarot-page .results .other-reading-title {
    text-align: center;
    margin-bottom: 2rem
}

.tarot-page .results .results-nav {
    margin-top: 1.5rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    opacity: 1;
    transform: translateZ(0);
    transition: transform 1.2s cubic-bezier(0.4, 0.1, 0, 1), opacity 1.2s cubic-bezier(0.4, 0.1, 0, 1);
    transition-delay: 0s
}

.tarot-page .results .results-nav .i {
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    pointer-events: all;
    margin-bottom: 2rem
}

.tarot-page .results .results-nav a {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center
}

.tarot-page .results .results-nav a::before {
    content: "";
    display: block;
    position: absolute;
    top: 35%;
    left: 30%;
    width: 40%;
    height: 30%;
    border-radius: 50%;
    background-color: #7b47c9;
    box-shadow: 0 0 1rem 1.5rem #7b47c9;
    opacity: 0;
    transition: opacity .9s cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .results .results-nav a .link {
    position: relative;
    text-align: center;
    white-space: nowrap
}

.tarot-page .results .results-nav a .icon {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 4rem
}

@media only screen and (min-width: 1024px) {
    .tarot-page .results .results-nav a .icon {
        width: 2.5rem
    }
}

.tarot-page .results .results-nav a .icon img {
    position: relative;
    pointer-events: none
}

.tarot-page .results .results-nav a .icon img:not(.base),
.tarot-page .results .results-nav a .icon div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

@media only screen and (min-width: 1024px) {
    .tarot-page .results .results-nav a:hover::before {
        opacity: .6
    }
}

.tarot-page .results .results-nav a.usual .icon img.base {
    animation: usualMobileA 4.8s infinite cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .results .results-nav a.usual .icon img.el {
    animation: usualMobileB 4.8s infinite cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .results .results-nav a.love .icon .tail {
    -webkit-clip-path: polygon(0% 0%, 50% 0%, 50% 100%, 0 100%);
    clip-path: polygon(0% 0%, 50% 0%, 50% 100%, 0 100%)
}

.tarot-page .results .results-nav a.love .icon .arrowhead {
    -webkit-clip-path: polygon(50% 0%, 100% 0%, 100% 100%, 50% 100%);
    clip-path: polygon(50% 0%, 100% 0%, 100% 100%, 50% 100%)
}

.tarot-page .results .results-nav a.love .icon .tail,
.tarot-page .results .results-nav a.love .icon .arrowhead {
    animation: loveMobileA 2.4s infinite cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .results .results-nav a.love .icon .tail img,
.tarot-page .results .results-nav a.love .icon .arrowhead img {
    animation: loveMobileB 2.4s infinite cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .results .results-nav a.love .icon img.base {
    animation: loveMobileC 2.4s infinite cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .results .results-nav a.love .icon img.el-b {
    animation-name: heart;
    animation-duration: 2.4s;
    animation-timing-function: cubic-bezier(0.4, 0.1, 0, 1);
    animation-iteration-count: infinite
}

.tarot-page .results .results-nav a.three .icon img.base {
    animation: threeMobileA 4.8s infinite cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .results .results-nav a.three .icon img.el-a {
    animation: threeMobileB 4.8s infinite cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .results .results-nav a.three .icon img.el-b {
    animation: threeMobileB 4.8s infinite cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .results .results-nav a.three .icon img.el-c {
    animation: threeMobileB 4.8s infinite cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .results .results-nav a.three .icon .shine {
    -webkit-clip-path: polygon(50% 0%, 100% 0%, 100% 100%, 50% 100%);
    clip-path: polygon(50% 0%, 100% 0%, 100% 100%, 50% 100%)
}

.tarot-page .results .results-nav a.three .icon .shine img {
    animation: threeMobileC 4.8s infinite cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .results .results-nav a.yesno .icon img.base {
    animation: yesnoMobileA 2.4s infinite cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .results .results-nav a.yesno .icon img.el-a {
    animation: yesnoMobileB 2.4s infinite cubic-bezier(0.72, 0, 0.12, 1.54)
}

.tarot-page .results .results-nav a.yesno .icon img.el-b {
    animation: yesnoMobileC 2.4s infinite cubic-bezier(0.72, 0, 0.12, 1.54)
}

.tarot-page .results .results-nav a.one .icon img.base {
    animation: oneMobileA 4.8s infinite cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .results .results-nav a.one .icon img.el-a {
    animation: oneMobileA 4.8s infinite cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .results .results-nav a.one .icon img.el-b {
    animation: oneMobileA 4.8s infinite cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .results .results-nav a.ai .icon img.base {
    animation: aiMobileBase 4.8s infinite cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .results .results-nav a.ai .icon img.el-a {
    animation: aiMobileA 4.8s infinite cubic-bezier(0.4, 0.1, 0, 1)
}

.tarot-page .results .results-nav a.ai .icon img.el-b {
    animation: aiMobileB 4.8s infinite cubic-bezier(0.4, 0.1, 0, 1)
}

@media only screen and (min-width: 1024px) {
    .tarot-page .results .results-nav {
        flex-wrap: nowrap
    }

    .tarot-page .results .results-nav .i {
        width: 6rem;
        margin-bottom: initial
    }

    .tarot-page .results .results-nav .i:nth-child(3):nth-last-child(3) {
        transform: translate(0, -0.25rem)
    }

    .tarot-page .results .results-nav .i:first-child {
        transform: translate(0, 1rem)
    }

    .tarot-page .results .results-nav .i:last-child {
        transform: translate(0, 1rem)
    }

    .tarot-page .results .results-nav a.usual .icon img.base {
        animation: initial;
        transform: rotate(0deg) translateZ(0);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .tarot-page .results .results-nav a.usual .icon img.el {
        animation: initial;
        transform: rotate(0deg) translateZ(0);
        transition: transform 2.4s cubic-bezier(0.5, 0, 0.2, 1.6)
    }

    .tarot-page .results .results-nav a.usual:hover .icon img.base {
        transform: rotate(-5deg) scale(0.9);
        transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .tarot-page .results .results-nav a.usual:hover .icon img.el {
        transform: rotate(360deg) scale(1.2)
    }

    .tarot-page .results .results-nav a.love .icon .tail,
    .tarot-page .results .results-nav a.love .icon .arrowhead {
        transform: rotate(0deg);
        transition: transform .6s cubic-bezier(1, 0, 0.4, 1.4)
    }

    .tarot-page .results .results-nav a.love .icon .tail img,
    .tarot-page .results .results-nav a.love .icon .arrowhead img {
        transform: translateZ(0);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .tarot-page .results .results-nav a.love .icon img.base {
        transform: translateZ(0);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .tarot-page .results .results-nav a.love .icon img.el-b {
        animation: initial
    }

    .tarot-page .results .results-nav a.love:hover .icon .tail,
    .tarot-page .results .results-nav a.love:hover .icon .arrowhead {
        transform: rotate(-15deg)
    }

    .tarot-page .results .results-nav a.love:hover .icon .tail img,
    .tarot-page .results .results-nav a.love:hover .icon .arrowhead img {
        transform: translate(5%, 0);
        transition: transform .6s cubic-bezier(0.6, -2, 0.6, 1)
    }

    .tarot-page .results .results-nav a.love:hover .icon img.base {
        transform: scale(0.9);
        transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .tarot-page .results .results-nav a.love:hover .icon img.el-b {
        animation-name: heart;
        animation-duration: 2.4s;
        animation-timing-function: cubic-bezier(0.4, 0.1, 0, 1);
        animation-iteration-count: infinite
    }

    .tarot-page .results .results-nav a.three .icon img.base {
        animation: initial;
        transform: rotate(0deg) translateZ(0);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .tarot-page .results .results-nav a.three .icon img.el-a {
        animation: initial;
        transform: translateZ(0);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .tarot-page .results .results-nav a.three .icon img.el-b {
        animation: initial;
        transform: translateZ(0);
        transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .tarot-page .results .results-nav a.three .icon img.el-c {
        animation: initial;
        transform: translateZ(0);
        transition: transform 1.2s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .tarot-page .results .results-nav a.three .icon .shine {
        -webkit-clip-path: polygon(50% 0%, 100% 0%, 100% 100%, 50% 100%);
        clip-path: polygon(50% 0%, 100% 0%, 100% 100%, 50% 100%)
    }

    .tarot-page .results .results-nav a.three .icon .shine img {
        animation: initial;
        transform: rotate(0deg) translateZ(0);
        transition: transform 3.2s cubic-bezier(0.5, 0, 0.2, 1.6)
    }

    .tarot-page .results .results-nav a.three:hover .icon img.base {
        transform: rotate(-5deg) scale(0.9);
        transition: transform 1.2s cubic-bezier(0.5, 0, 0.2, 1.6)
    }

    .tarot-page .results .results-nav a.three:hover .icon img.el-a,
    .tarot-page .results .results-nav a.three:hover .icon img.el-b,
    .tarot-page .results .results-nav a.three:hover .icon img.el-c {
        transform: scale(1.2)
    }

    .tarot-page .results .results-nav a.three:hover .icon .shine img {
        transform: rotate(360deg)
    }

    .tarot-page .results .results-nav a.yesno .icon img.base {
        animation: initial;
        transform: scale(1) translateZ(0);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .tarot-page .results .results-nav a.yesno .icon img.el-a {
        animation: initial;
        transform: rotate(0deg) translateZ(0);
        transform-origin: center 60%;
        transition: transform .6s cubic-bezier(0.72, 0, 0.12, 1.54)
    }

    .tarot-page .results .results-nav a.yesno .icon img.el-b {
        animation: initial;
        transform: rotate(0deg) translateZ(0);
        transition: transform .6s cubic-bezier(0.72, 0, 0.12, 1.54);
        transform-origin: center 60%
    }

    .tarot-page .results .results-nav a.yesno:hover .icon img.base {
        transform: scale(1.2);
        transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .tarot-page .results .results-nav a.yesno:hover .icon img.el-a {
        transform: rotate(-10deg)
    }

    .tarot-page .results .results-nav a.yesno:hover .icon img.el-b {
        transform: rotate(10deg)
    }

    .tarot-page .results .results-nav a.one .icon img.base {
        animation: initial;
        transform: rotate(0deg) translateZ(0);
        transition: transform 2.4s cubic-bezier(0.23, 1, 0.32, 1)
    }

    .tarot-page .results .results-nav a.one .icon img.el-a {
        animation: initial;
        transform: rotate(0deg) translateZ(0);
        transition: transform 2.4s cubic-bezier(0.23, 1, 0.32, 1)
    }

    .tarot-page .results .results-nav a.one .icon img.el-b {
        animation: initial;
        transform: rotate(0deg) translateZ(0);
        transition: transform 2.4s cubic-bezier(0.23, 1, 0.32, 1)
    }

    .tarot-page .results .results-nav a.one:hover .icon img.base {
        transform: rotate(-120deg) scale(1.2)
    }

    .tarot-page .results .results-nav a.one:hover .icon img.el-a {
        transform: rotate(90deg) scale(1.2)
    }

    .tarot-page .results .results-nav a.one:hover .icon img.el-b {
        transform: rotate(180deg) scale(1.2)
    }

    .tarot-page .results .results-nav a.ai .icon img.base {
        animation: initial;
        transform: rotate(0deg) translateZ(0);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .tarot-page .results .results-nav a.ai .icon img.el-a {
        animation: initial;
        transform: rotate(0deg) scale(1);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .tarot-page .results .results-nav a.ai .icon img.el-b {
        animation: initial;
        transform: rotate(0deg) scale(1);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .tarot-page .results .results-nav a.ai:hover .icon img.base {
        transform: rotate(5deg) scale(0.9);
        transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .tarot-page .results .results-nav a.ai:hover .icon img.el-a {
        transform: rotate(45deg) scale(0.95);
        transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .tarot-page .results .results-nav a.ai:hover .icon img.el-b {
        transform: rotate(360deg) scale(0.4);
        transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1)
    }
}

.about-page .blocks {
    position: relative;
    padding-top: 5rem;
    padding-bottom: 5rem
}

.about-page .blocks *::-moz-selection {
    background-color: #a689d2
}

.about-page .blocks *::selection {
    background-color: #a689d2
}

@media only screen and (min-width: 1024px) {
    .about-page .blocks {
        padding-top: 8rem;
        padding-bottom: 8rem
    }
}

.about-page .blocks #anchor-target {
    position: absolute;
    top: 50%;
    width: 100%;
    pointer-events: none
}

.about-page .blocks__block {
    position: relative;
    z-index: 3;
    margin-left: 1.5rem;
    margin-right: 1.5rem;
    padding-top: 3rem;
    padding-bottom: 1rem
}

@media only screen and (min-width: 1024px) {
    .about-page .blocks__block {
        width: 65.277%;
        margin-left: auto;
        margin-right: auto;
        padding-top: 5rem;
        padding-bottom: 4rem
    }
}

.about-page .blocks__block .line {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    display: block;
    width: 100%;
    height: 1px;
    background-image: linear-gradient(to right, rgba(166, 137, 210, 0) 0%, #A689D2 50%, rgba(166, 137, 210, 0) 100%)
}

.about-page .blocks__block .title {
    text-align: center;
    margin-bottom: 2rem
}

@media only screen and (min-width: 1024px) {
    .about-page .blocks__block .title {
        margin-bottom: 4rem
    }
}

.about-page .blocks__who .stars {
    position: absolute;
    top: 8rem;
    right: 5%;
    width: 16%;
    height: 8rem;
    pointer-events: none
}

.about-page .blocks__who .stars img {
    width: 2rem;
    position: absolute;
    animation-name: lightsOp;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite
}

.about-page .blocks__who .stars img:nth-child(1) {
    top: 0;
    right: 0;
    animation-duration: 1.5s;
    animation-delay: 0
}

.about-page .blocks__who .stars img:nth-child(2) {
    top: 40%;
    left: 0;
    animation-duration: 3s;
    animation-delay: -0.6s
}

.about-page .blocks__who .stars img:nth-child(3) {
    bottom: 0%;
    left: 50%;
    animation-duration: 1.8s;
    animation-delay: -1.2s
}

.about-page .blocks__who .subtitle {
    display: flex;
    align-items: center;
    color: #d2a17d;
    margin-left: 1.5rem
}

@media only screen and (min-width: 1024px) {
    .about-page .blocks__who .subtitle {
        margin-left: 12.767%
    }
}

.about-page .blocks__who .icon {
    border: none
}

.about-page .blocks__who .description {
    margin-left: 1.5rem;
    margin-bottom: 1.5rem;
    text-indent: 30%
}

@media only screen and (min-width: 1024px) {
    .about-page .blocks__who .description {
        width: 61.702%;
        margin-left: 12.767%
    }
}

.about-page .blocks__who .description.-m {
    color: #e6f3e8;
    width: 70%;
    text-indent: initial;
    margin-left: auto;
    margin-right: auto
}

@media only screen and (min-width: 1024px) {
    .about-page .blocks__who .description.-m {
        width: 48.936%
    }
}

.about-page .blocks__goals .title {
    margin-bottom: 1.5rem
}

.about-page .blocks__goals .icon {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 2.5rem
}

.about-page .blocks__goals .description {
    margin-left: 1.5rem;
    margin-bottom: 1.5rem
}

@media only screen and (min-width: 1024px) {
    .about-page .blocks__goals .description {
        width: 61.702%;
        margin-left: 12.767%
    }
}

.about-page .blocks__goals .description.-m {
    color: #e6f3e8;
    width: 70%;
    margin-left: auto;
    margin-right: auto
}

@media only screen and (min-width: 1024px) {
    .about-page .blocks__goals .description.-m {
        width: 48.936%
    }
}

.about-page .blocks__stand .description-block {
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
    align-items: center;
    margin-bottom: 1.5rem
}

@media only screen and (min-width: 1024px) {
    .about-page .blocks__stand .description-block {
        display: flex;
        justify-content: flex-start;
        flex-direction: initial;
        align-items: initial
    }
}

.about-page .blocks__stand .description-block .moon-wrap {
    position: relative;
    width: 25.532%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-shrink: 0;
    margin-bottom: 1.5rem
}

.about-page .blocks__stand .description-block .moon-wrap img {
    width: 2rem;
    position: absolute;
    top: auto;
    bottom: auto;
    right: 100%;
    animation-name: lightsOp;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-duration: 1.5s;
    animation-delay: 0
}

.about-page .blocks__stand .description-block .moon {
    margin-left: 1rem;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 3rem;
    border: 1px solid rgba(210, 161, 122, .4);
    border-radius: 50%;
    overflow: hidden;
    transform: rotate(-20deg) translateZ(0)
}

@media only screen and (min-width: 1024px) {
    .about-page .blocks__stand .description-block .moon {
        width: 4rem
    }
}

.about-page .blocks__stand .description-block .moon::before {
    content: "";
    display: block;
    width: 100%;
    padding: 50% 0
}

.about-page .blocks__stand .description-block .moon-bg {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    height: 100%;
    background-color: #1e1131;
    animation-name: moonBg;
    animation-duration: 6s;
    animation-iteration-count: infinite;
    animation-timing-function: steps(1, end)
}

.about-page .blocks__stand .description-block .moon-side {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: 0%;
    width: 50%;
    height: 100%;
    background-color: #d2a17d;
    animation-name: moonSide;
    animation-duration: 6s;
    animation-iteration-count: infinite;
    animation-timing-function: steps(1, end)
}

.about-page .blocks__stand .description-block .moon-shade {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    background-color: #d2a17d;
    border-radius: 50%;
    animation-name: moonShade;
    animation-duration: 6s;
    animation-iteration-count: infinite;
    animation-timing-function: linear
}

.about-page .blocks__stand .description-block .description {
    flex-shrink: 0;
    margin-left: 1.5rem;
    margin-right: 1.5rem
}

@media only screen and (min-width: 1024px) {
    .about-page .blocks__stand .description-block .description {
        width: 61.702%;
        margin-left: 0;
        margin-right: auto
    }
}

.about-page .blocks__stand .description.-m {
    color: #e6f3e8;
    width: 70%;
    text-indent: initial;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1.5rem
}

@media only screen and (min-width: 1024px) {
    .about-page .blocks__stand .description.-m {
        width: 48.936%
    }
}

.about-page .blocks__what .image {
    width: 50%;
    margin-left: auto;
    margin-right: auto
}

@media only screen and (min-width: 1024px) {
    .about-page .blocks__what .image {
        width: 36.17%;
        height: 0;
        margin-right: -10%;
        margin-left: auto
    }
}

.about-page .blocks__what .description {
    margin-left: 1.5rem;
    margin-bottom: 1.5rem
}

@media only screen and (min-width: 1024px) {
    .about-page .blocks__what .description {
        width: 61.702%;
        margin-left: 12.767%
    }
}

.about-page .blocks__what .description.-m {
    color: #e6f3e8;
    width: 70%;
    margin-left: auto;
    margin-right: auto
}

@media only screen and (min-width: 1024px) {
    .about-page .blocks__what .description.-m {
        width: 48.936%
    }
}

.about-page .blocks__authors {
    position: relative
}

.about-page .blocks__authors label {
    position: absolute;
    top: 30%;
    left: 30%;
    width: 40%;
    height: 40%;
    pointer-events: none;
    opacity: 1;
    animation-name: flyXYZ;
    animation-duration: 36s;
    animation-iteration-count: infinite;
    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1)
}

.about-page .blocks__authors label::before {
    content: "";
    display: block;
    position: absolute;
    top: -0.5rem;
    width: .125rem;
    height: .125rem;
    border-radius: 50%;
    background-color: #e6f3e8;
    box-shadow: 0 0 .5rem .25rem #e6f3e8;
    transform-origin: 1rem 1rem;
    transform: rotate(0deg) translateY(0);
    opacity: 1;
    animation-name: flyZ;
    animation-duration: 16s;
    animation-iteration-count: infinite;
    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1)
}

.about-page .blocks__authors #anchor-target-2 {
    position: absolute;
    top: 50%
}

.about-page .blocks__authors .author-item {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1rem;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center
}

.about-page .blocks__authors .author-item .line {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -0.5rem;
    display: block;
    width: 40%;
    margin-left: auto;
    margin-right: auto;
    height: 1px;
    background-image: linear-gradient(to right, rgba(166, 137, 210, 0) 0%, #A689D2 50%, rgba(166, 137, 210, 0) 100%);
    opacity: .2
}

.about-page .blocks__authors .author-item .avatar {
    width: 22.857%;
    position: relative
}

.about-page .blocks__authors .author-item .avatar::before {
    content: "";
    display: block;
    position: absolute;
    top: -5%;
    left: -5%;
    width: 110%;
    height: 110%;
    border-radius: 50%;
    background-image: linear-gradient(135deg, #EEDB71 0%, #D8B43E 35%, #49432E 60%, #D8B43E 100%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    padding: 1px;
    opacity: .2
}

.about-page .blocks__authors .author-item .avatar::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: -10%;
    width: 120%;
    height: 1px;
    background-image: linear-gradient(90deg, #EEDB71 0%, #D8B43E 35%, #49432E 60%, #D8B43E 100%);
    opacity: .2
}

.about-page .blocks__authors .author-item .avatar figure {
    position: relative;
    width: 100%;
    padding: 50% 0;
    border-radius: 50%;
    overflow: hidden;
    transform: translateZ(0);
    background-color: #120b1c
}

.about-page .blocks__authors .author-item .avatar figure img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

@media only screen and (min-width: 1024px) {
    .about-page .blocks__authors .author-item .avatar figure img {
        transform: scale(1);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
    }
}

.about-page .blocks__authors .author-item .avatar .icon {
    position: absolute;
    top: 100%;
    left: 100%;
    padding: .5rem;
    transform: translate(-2rem, -2rem)
}

@media only screen and (min-width: 1024px) {
    .about-page .blocks__authors .author-item .avatar .icon {
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
    }
}

.about-page .blocks__authors .author-item .avatar .icon::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 1px solid #7b47c9
}

@media only screen and (min-width: 1024px) {
    .about-page .blocks__authors .author-item .avatar .icon::before {
        transform: scale(1);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
    }
}

.about-page .blocks__authors .author-item .avatar .arrow-icon {
    width: 2rem;
    margin-left: auto;
    margin-right: auto
}

@media only screen and (min-width: 1024px) {
    .about-page .blocks__authors .author-item .avatar .arrow-icon {
        transform: translateZ(0);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
    }
}

.about-page .blocks__authors .author-item .name {
    margin-left: 2rem
}

@media only screen and (min-width: 1024px) {
    .about-page .blocks__authors .author-item .name {
        text-shadow: 0px 0px 1rem rgba(230, 243, 232, 0);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1), text-shadow .6s cubic-bezier(0.23, 1, 0.32, 1)
    }
}

.about-page .blocks__authors .author-item .dec-icon {
    border: 1px solid rgba(210, 161, 125, .1254901961);
    border-radius: 50%;
    margin: 0 1rem
}

.about-page .blocks__authors .author-item .dec-icon img {
    width: 2rem
}

.about-page .blocks__authors .author-item:nth-child(2n) {
    flex-direction: row-reverse
}

.about-page .blocks__authors .author-item:nth-child(2n) .avatar .icon {
    position: absolute;
    top: 100%;
    left: initial;
    right: 100%;
    transform: translate(2rem, -2rem)
}

.about-page .blocks__authors .author-item:nth-child(2n) .name {
    margin-left: 0;
    margin-right: 2rem
}

.about-page .blocks__authors .author-item:last-child .line {
    display: none
}

@media only screen and (min-width: 1024px) {
    .about-page .blocks__authors .author-item {
        width: 74.468%
    }

    .about-page .blocks__authors .author-item:hover .avatar figure img {
        transform: scale(1.2)
    }

    .about-page .blocks__authors .author-item:hover .avatar .icon {
        transform: translate(0, -2rem)
    }

    .about-page .blocks__authors .author-item:hover .avatar .icon::before {
        transform: scale(0.8)
    }

    .about-page .blocks__authors .author-item:hover .name {
        text-shadow: 0px 0px 1rem #e6f3e8
    }
}

.about-page .blocks__terms {
    text-align: center
}

.about-page .blocks__terms p {
    margin-left: auto;
    margin-right: auto
}

@media only screen and (min-width: 1024px) {
    .about-page .blocks__terms p {
        width: 50%
    }
}

.about-page .blocks__terms p a {
    color: #a689d2;
    text-decoration: underline
}

.about-page .blocks__terms p a:hover {
    text-decoration: none
}

.blog-page .list,
.article-container .list {
    position: relative;
    z-index: 3;
    margin-left: 1rem;
    margin-right: 1rem;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap
}

.blog-page .list *::-moz-selection,
.article-container .list *::-moz-selection {
    background-color: #a689d2
}

.blog-page .list *::selection,
.article-container .list *::selection {
    background-color: #a689d2
}

@media only screen and (min-width: 1024px) {

    .blog-page .list,
    .article-container .list {
        width: 81.944%;
        margin-left: auto;
        margin-right: auto
    }
}

.blog-page .list__item,
.article-container .list__item {
    width: 46%;
    display: flex
}

@media only screen and (min-width: 1024px) {

    .blog-page .list__item,
    .article-container .list__item {
        width: 49.152%
    }
}

.blog-page .list__item:nth-child(2n+1),
.article-container .list__item:nth-child(2n+1) {
    margin-bottom: 4rem
}

@media only screen and (min-width: 1024px) {

    .blog-page .list__item:nth-child(2n+1),
    .article-container .list__item:nth-child(2n+1) {
        margin-bottom: 8rem
    }
}

.blog-page .list__item:nth-child(2n),
.article-container .list__item:nth-child(2n) {
    margin-top: 4rem
}

@media only screen and (min-width: 1024px) {

    .blog-page .list__item:nth-child(2n),
    .article-container .list__item:nth-child(2n) {
        margin-top: 8rem
    }
}

.blog-page .list__item a,
.article-container .list__item a {
    display: inline-block
}

@media only screen and (min-width: 1024px) {

    .blog-page .list__item a,
    .article-container .list__item a {
        width: 79.31%;
        margin-left: auto;
        margin-right: auto
    }
}

.blog-page .list__item a .image,
.article-container .list__item a .image {
    position: relative;
    width: 100%;
    padding: 30% 0;
    margin-bottom: 1rem;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    border-radius: 50%;
    background-color: #1e1131;
    transform: rotate(calc(var(--t-rotate) * 1deg)) translateZ(0) scale(1);
    transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1)
}

.blog-page .list__item a .image figure,
.article-container .list__item a .image figure {
    position: absolute;
    width: 100%;
    padding: 50% 0
}

.blog-page .list__item a .image img,
.article-container .list__item a .image img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    opacity: 1;
    transform: rotate(calc(var(--t-rotate) * -1deg)) scale(1.2);
    transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1), opacity .9s cubic-bezier(0.4, 0.1, 0, 1)
}

.blog-page .list__item a .desc,
.article-container .list__item a .desc {
    position: relative
}

@media only screen and (min-width: 1024px) {

    .blog-page .list__item a .desc,
    .article-container .list__item a .desc {
        min-height: 12rem
    }
}

.blog-page .list__item a .desc .arrow-icon,
.article-container .list__item a .desc .arrow-icon {
    width: 2rem;
    margin-left: auto;
    margin-right: auto
}

@media only screen and (min-width: 1024px) {

    .blog-page .list__item a .desc .arrow-icon,
    .article-container .list__item a .desc .arrow-icon {
        transform: translateZ(0);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
    }
}

.blog-page .list__item a .desc h4,
.article-container .list__item a .desc h4 {
    text-align: center
}

@media only screen and (min-width: 1024px) {

    .blog-page .list__item a .desc h4,
    .article-container .list__item a .desc h4 {
        text-shadow: 0px 0px 1rem rgba(230, 243, 232, 0);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1), text-shadow .6s cubic-bezier(0.23, 1, 0.32, 1)
    }
}

.blog-page .list__item a .desc p,
.article-container .list__item a .desc p {
    margin-top: 1rem;
    color: #e6f3e8;
    width: 80%;
    margin-left: 10%
}

@media only screen and (min-width: 1024px) {

    .blog-page .list__item a .desc p,
    .article-container .list__item a .desc p {
        width: 69.565%;
        margin-left: 16.565%
    }
}

.blog-page .list__item a .desc .tags,
.article-container .list__item a .desc .tags {
    display: flex;
    justify-content: center;
    gap: .2rem;
    margin-top: 1rem
}

.blog-page .list__item a .desc .tags .tag,
.article-container .list__item a .desc .tags .tag {
    padding: .2rem .2rem;
    border: 1px solid #a689d2;
    border-radius: .2rem;
    color: #a689d2
}

@media only screen and (min-width: 1024px) {

    .blog-page .list__item a:hover .image,
    .article-container .list__item a:hover .image {
        transform: rotate(calc(var(--t-rotate) * 1deg)) translateZ(0) scale(1.1)
    }

    .blog-page .list__item a:hover .image img,
    .article-container .list__item a:hover .image img {
        opacity: .4;
        transform: rotate(calc(var(--t-rotate) * -1deg)) scale(1)
    }

    .blog-page .list__item a:hover .desc .arrow-icon,
    .article-container .list__item a:hover .desc .arrow-icon {
        transform: translate(2rem, 0)
    }

    .blog-page .list__item a:hover .desc h4,
    .article-container .list__item a:hover .desc h4 {
        text-shadow: 0px 0px 1rem #e6f3e8
    }

    .blog-page .list__item a:hover .desc span,
    .article-container .list__item a:hover .desc span {
        opacity: .4
    }
}

.article-container .list {
    display: flex;
    flex-direction: column;
    justify-content: initial;
    margin-top: 5rem
}

.article-container .list .-list-title {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 3rem
}

.article-container .list .list__item {
    width: 100%
}

.article-container .list .list__item:nth-child(2n+1) {
    margin-bottom: 2rem
}

@media only screen and (min-width: 1024px) {
    .article-container .list .list__item:nth-child(2n+1) {
        margin-bottom: 2rem
    }
}

.article-container .list .list__item:nth-child(2n) {
    margin-top: 0rem;
    margin-bottom: 2rem
}

@media only screen and (min-width: 1024px) {
    .article-container .list .list__item:nth-child(2n) {
        margin-top: 0rem;
        margin-bottom: 2rem
    }
}

.article-container .list .list__item a {
    width: 100%;
    display: flex;
    align-items: center
}

.article-container .list .list__item a .image {
    width: initial;
    min-width: 30%;
    max-width: 30%;
    padding: 10% 0
}

.article-container .list .list__item a .desc {
    flex: 1;
    min-height: initial;
    margin-left: 1rem
}

.article-container .list .list__item a .desc h4 {
    text-align: start
}

.article-container .list .list__item a .desc .tags {
    justify-content: flex-start
}

.article-container .list .list__item a .desc .arrow-icon {
    display: none
}

.blog-page .welcome {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-top: 8rem;
    padding-bottom: 5rem
}

.blog-page .welcome *::-moz-selection {
    background-color: #a689d2
}

.blog-page .welcome *::selection {
    background-color: #a689d2
}

@media only screen and (min-width: 1024px) {
    .blog-page .welcome {
        padding-top: 13rem;
        padding-bottom: 8rem
    }
}

.blog-page .welcome__circle {
    position: absolute;
    top: 0;
    width: 110%;
    border-radius: 50%;
    flex-shrink: 0;
    background-image: linear-gradient(90deg, rgba(166, 137, 210, 0), #A689D2, rgba(166, 137, 210, 0));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    padding: 1px;
    transform: translateZ(0);
    opacity: 1;
    transition: transform 3s cubic-bezier(0.4, 0.1, 0, 1), opacity 3s cubic-bezier(0.4, 0.1, 0, 1);
    will-change: transform, opacity;
    pointer-events: none
}

.blog-page .welcome__circle::before {
    content: "";
    display: block;
    width: 100%;
    padding: 50% 0
}

.blog-page .welcome p {
    position: relative;
    z-index: 3;
    text-align: center;
    max-width: 17rem;
    margin-left: auto;
    margin-right: auto
}

.blog-page .welcome .tags {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: .5rem;
    width: 81.944%;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    margin-top: 1.75rem;
    margin-bottom: 3.5rem;
    z-index: 5;
    font-size: .7rem
}

.blog-page .welcome .tags a {
    margin-bottom: .5rem
}

@media only screen and (max-width: 1024px) {
    .blog-page .welcome .tags {
        width: 100%
    }
}

.blog-page .pagination-wrapper {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center
}

.blog-page .pagination-wrapper #anchor-target {
    position: absolute;
    bottom: 100%;
    width: 100%;
    pointer-events: none
}

.article-page {
    padding-top: 94%
}

@media only screen and (min-width: 1024px) {
    .article-page {
        padding-top: 13rem
    }
}

.article-page *::-moz-selection {
    background-color: #a689d2
}

.article-page *::selection {
    background-color: #a689d2
}

.article-page .thumbnail {
    position: absolute;
    z-index: 0;
    top: 4rem;
    left: -10%;
    width: 120%
}

@media only screen and (min-width: 1024px) {
    .article-page .thumbnail {
        top: 8rem;
        left: 0;
        right: 0;
        width: 74%;
        max-width: 72rem;
        margin-left: auto;
        margin-right: auto
    }
}

.article-page .thumbnail::before {
    content: "";
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(to bottom, #1E1131 0%, rgba(30, 17, 49, 0) 72%)
}

.article-page .thumbnail::after {
    content: "";
    position: absolute;
    top: -0.5%;
    left: -10.5%;
    width: 121%;
    height: 101%;
    border-radius: 50%;
    box-shadow: inset 0 0 2rem 2.4rem #1e1131;
    transform: rotate(-10deg) translateZ(0)
}

@media only screen and (min-width: 1024px) {
    .article-page .thumbnail::after {
        top: -0.5%;
        left: -0.5%;
        width: 101%;
        box-shadow: inset 0 0 5rem 6rem #1e1131
    }
}

.article-page .thumbnail .image {
    position: relative;
    width: 100%;
    padding: 30% 0;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    border-radius: 50%;
    background-color: #1e1131;
    transform: rotate(-10deg) translateZ(0)
}

.article-page .thumbnail .image figure {
    position: absolute;
    width: 100%;
    height: 105%;
    display: flex;
    justify-content: center;
    align-items: center
}

.article-page .thumbnail .image img {
    width: auto;
    height: 100%;
    opacity: 1;
    transform: rotate(10deg)
}

.article-page .welcome {
    position: relative;
    z-index: 3;
    text-align: center;
    margin-bottom: 2rem
}

.article-page .welcome .title {
    margin-bottom: 1rem
}

.article-page .welcome .tags {
    display: flex;
    justify-content: center
}

.article-page .welcome .tags .tag {
    padding: .2rem .2rem;
    border: 1px solid #a689d2;
    border-radius: .2rem;
    color: #a689d2
}

.article-page .content {
    position: relative;
    z-index: 3;
    margin-left: .5rem;
    margin-right: .5rem
}

@media only screen and (min-width: 1024px) {
    .article-page .content {
        width: 48.611%;
        margin-left: auto;
        margin-right: auto;
        margin-top: 28%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center
    }

    .article-page .content::before {
        content: "";
        display: block;
        position: absolute;
        width: 45.71%;
        padding: 72% 0;
        right: 102%;
        pointer-events: none;
        background-image: url(/TarotLove/post-left.svg);
        background-repeat: no-repeat;
        background-position: center center
    }

    .article-page .content::after {
        content: "";
        display: block;
        position: absolute;
        width: 45.71%;
        padding: 72% 0;
        left: 102%;
        pointer-events: none;
        background-image: url(/TarotLove/post-right.svg);
        background-repeat: no-repeat;
        background-position: center center
    }

    .article-page .content.-without-borders::before {
        display: none
    }

    .article-page .content.-without-borders::after {
        display: none
    }
}

.article-page .content #anchor-target {
    position: absolute;
    top: 50%;
    width: 100%;
    pointer-events: none
}

.article-page .content__body {
    min-height: 40rem
}

.article-page .content__body>h1,
.article-page .content__body>h2,
.article-page .content__body>h3,
.article-page .content__body>h4,
.article-page .content__body>h5,
.article-page .content__body>h6 {
    line-height: 1;
    text-align: center;
    margin-top: 4.6rem;
    margin-bottom: 2.4rem
}

@media only screen and (max-width: 1024px) {
    .article-page .content__body>h1 {
        font-size: 3.36rem
    }
}

@media only screen and (max-width: 1024px) {
    .article-page .content__body>h2 {
        font-size: 2.52rem
    }
}

@media only screen and (max-width: 1024px) {
    .article-page .content__body>h3 {
        font-size: 1.92rem
    }
}

@media only screen and (max-width: 1024px) {
    .article-page .content__body>h4 {
        font-size: 1.44rem
    }
}

@media only screen and (max-width: 1024px) {
    .article-page .content__body>h5 {
        font-size: 1.08rem
    }
}

@media only screen and (max-width: 1024px) {
    .article-page .content__body>h6 {
        font-size: 1.08rem
    }
}

.article-page .content__body strong {
    color: #d2a17d
}

.article-page .content__body>p,
.article-page .content__body>ul {
    padding-left: 1rem;
    padding-right: 1rem;
    margin-bottom: 1rem
}

@media only screen and (min-width: 1024px) {

    .article-page .content__body>p,
    .article-page .content__body>ul {
        padding-left: 8.571%;
        padding-right: initial
    }
}

@media only screen and (min-width: 1024px) {
    .article-page .content__body>ol {
        padding-left: 12.57%;
        padding-right: initial
    }
}

.article-page .content__body>ul li {
    margin-left: 1rem;
    margin-bottom: .75rem
}

.article-page .content__body p img,
.article-page .content__body p video {
    width: 80%;
    height: auto;
    border-radius: 2.5rem 1.2rem;
    margin-top: 2rem;
    margin-bottom: 2rem;
    margin-left: auto;
    margin-right: auto;
    transform: translateZ(0)
}

@media only screen and (min-width: 1024px) {

    .article-page .content__body p img,
    .article-page .content__body p video {
        width: 90%;
        margin-left: initial;
        margin-right: initial
    }
}

.article-page .content__body blockquote p {
    width: 48.57%;
    margin-left: auto;
    margin-right: auto
}

.article-page .content__body blockquote img {
    border-radius: .4rem
}

.article-page .content__body .card-blog-item {
    position: relative;
    width: 50%;
    box-sizing: border-box;
    padding: 2rem 1rem .5rem 1rem;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 2rem
}

@media only screen and (min-width: 1024px) {
    .article-page .content__body .card-blog-item {
        padding: 2rem 1rem 1.5rem 1rem;
        max-width: 13rem;
        width: 33%
    }
}

.article-page .content__body .card-blog-item:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    border: 1px solid #d2a17d;
    border-radius: 2rem;
    opacity: .1
}

.article-page .content__body .card-blog-item .card-blog-item__decorative-circle-container {
    position: absolute;
    left: 50%;
    padding: 1px;
    bottom: -1rem;
    width: 85%;
    margin-left: -42.5%
}

.article-page .content__body .card-blog-item .card-blog-item__decorative-circle-container::before {
    content: "";
    display: block;
    width: 100%;
    padding: 25% 0
}

.article-page .content__body .card-blog-item .card-blog-item__decorative-circle {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    border-radius: 50%;
    flex-shrink: 0;
    padding: 1px;
    opacity: .4;
    background-image: linear-gradient(90deg, rgba(166, 137, 210, 0), #A689D2, rgba(166, 137, 210, 0));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude
}

.article-page .content__body .card-blog-item .card-blog-item__decorative-circle::before {
    content: "";
    display: block;
    width: 100%;
    padding: 50% 0
}

.article-page .content__body .card-blog-item .card-blog-item__left-decore {
    position: absolute;
    bottom: -0.5rem;
    left: .5rem;
    width: 23%;
    padding-bottom: 55%;
    border-bottom-left-radius: 1rem;
    border-left: 1px solid #d2a17d;
    border-bottom: 1px solid #d2a17d;
    pointer-events: none;
    opacity: .4
}

@media only screen and (min-width: 1024px) {
    .article-page .content__body .card-blog-item .card-blog-item__left-decore {
        border-bottom-left-radius: 2rem
    }
}

.article-page .content__body .card-blog-item .card-blog-item__right-decore {
    position: absolute;
    bottom: -0.5rem;
    right: .5rem;
    width: 23%;
    padding-bottom: 55%;
    border-bottom-right-radius: 1rem;
    border-right: 1px solid #d2a17d;
    border-bottom: 1px solid #d2a17d;
    pointer-events: none;
    opacity: .4
}

@media only screen and (min-width: 1024px) {
    .article-page .content__body .card-blog-item .card-blog-item__right-decore {
        border-bottom-right-radius: 2rem
    }
}

.article-page .content__body .card-blog-item .card-blog-item__center-line {
    position: absolute;
    top: 50%;
    height: 1px;
    left: -1rem;
    right: -1rem;
    background-color: #a689d2;
    -webkit-clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
    clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%)
}

@media only screen and (min-width: 1024px) {
    .article-page .content__body .card-blog-item .card-blog-item__center-line {
        left: -2rem;
        right: -2rem
    }
}

.article-page .content__body .card-blog-item .card-blog-item__r-star {
    position: absolute;
    left: 1rem;
    top: .75rem;
    transform: scale(1);
    transition: transform .9s cubic-bezier(0.5, 0, 0.5, 1)
}

.article-page .content__body .card-blog-item .card-blog-item__r-star svg {
    aspect-ratio: 1/1;
    width: auto
}

.article-page .content__body .card-blog-item .card-blog-item__l-star {
    position: absolute;
    right: 1rem;
    top: .75rem;
    transform: scale(1);
    transition: transform .9s cubic-bezier(0.5, 0, 0.5, 1)
}

.article-page .content__body .card-blog-item .card-blog-item__l-star svg {
    aspect-ratio: 1/1;
    width: auto
}

.article-page .content__body .card-blog-item .card-blog-item__title {
    position: relative;
    font-family: "boska";
    font-weight: 400;
    margin: 1rem 0 0;
    text-align: center;
    transform: scale(1);
    white-space: nowrap;
    display: flex;
    justify-content: center;
    transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1)
}

.article-page .content__body .card-blog-item .card-blog-item__title span {
    position: relative
}

.article-page .content__body .card-blog-item .card-blog-item__title:before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 60%;
    transform: translate(-50%, -25%);
    border-radius: 50%;
    background-color: #7b47c9;
    box-shadow: 0 0 1rem 1.5rem #7b47c9;
    opacity: 0;
    transition: opacity .9s cubic-bezier(0.4, 0.1, 0, 1)
}

.article-page .content__body .card-blog-item .play-card {
    position: relative;
    perspective: 600px;
    z-index: 800;
    transform: translateZ(0);
    transition: transform .9s cubic-bezier(0.23, 1, 0.32, 1)
}

.article-page .content__body .card-blog-item .play-card .flip-card-inner {
    position: relative;
    width: 100%;
    transform-style: preserve-3d;
    transition: transform .9s cubic-bezier(0.23, 1, 0.32, 1);
    transform: rotateY(0deg) translateZ(0)
}

.article-page .content__body .card-blog-item .play-card .flip-card-inner .flip-card-back {
    position: relative;
    width: 100%;
    border-radius: .35rem;
    overflow: hidden;
    transform: translateZ(1px)
}

.article-page .content__body .card-blog-item .play-card .flip-card-inner .flip-card-back video,
.article-page .content__body .card-blog-item .play-card .flip-card-inner .flip-card-back img {
    display: block;
    width: 100%;
    height: auto
}

.article-page .content__body .card-blog-item .play-card .flip-card-inner .flip-card-front {
    position: absolute;
    left: 1px;
    right: 1px;
    top: 1px;
    bottom: 1px;
    transform: rotateY(180deg) translateZ(0px);
    background-color: #f5f5f5;
    border-radius: .35rem;
    overflow: hidden;
    padding: 4.68% 4.68%;
    box-sizing: border-box
}

.article-page .content__body .card-blog-item .play-card .flip-card-inner .flip-card-front::after {
    content: "";
    display: block;
    position: absolute;
    top: 1.9%;
    bottom: 1.9%;
    left: 3.125%;
    right: 3.125%;
    background-image: linear-gradient(to right bottom, #D2A17D 20%, #49432E 70%, #D2A17D 100%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    padding: 1px;
    border-radius: .25rem;
    opacity: .2
}

.article-page .content__body .card-blog-item .play-card .flip-card-inner .flip-card-front video {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: .5rem;
    overflow: hidden;
    transform: translateZ(0)
}

.article-page .content__body .card-blog-item:hover .play-card,
.article-page .content__body .card-blog-item.-active .play-card {
    transform: translate(0, -0.5rem) rotate(10deg) rotateY(0deg) scale(1);
    transition: transform .9s cubic-bezier(0.5, 0, 0.5, 1)
}

.article-page .content__body .card-blog-item:hover .play-card .flip-card-inner,
.article-page .content__body .card-blog-item.-active .play-card .flip-card-inner {
    transform: rotateY(180deg);
    transition: transform 1.5s cubic-bezier(0.72, 0, 0.12, 1.54)
}

.article-page.no-image {
    padding-top: 10rem
}

@media only screen and (min-width: 1024px) {
    .article-page.no-image {
        padding-top: 13rem
    }
}

@media only screen and (min-width: 1024px) {
    .article-page.no-image .content {
        margin-top: 8rem
    }
}

.author-page {
    padding-top: 8rem
}

@media only screen and (min-width: 1024px) {
    .author-page {
        padding-top: 13rem
    }
}

.author-page .welcome {
    position: relative
}

.author-page .welcome__avatar {
    position: relative;
    z-index: 5;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: .5rem 0
}

.author-page .welcome__avatar .decorative-circle {
    position: absolute;
    width: 110%;
    border-radius: 50%;
    flex-shrink: 0;
    background-image: linear-gradient(90deg, rgba(166, 137, 210, 0), #A689D2, rgba(166, 137, 210, 0));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    padding: 1px
}

@media only screen and (min-width: 1024px) {
    .author-page .welcome__avatar .decorative-circle {
        width: 50%
    }
}

.author-page .welcome__avatar .decorative-circle::before {
    content: "";
    display: block;
    width: 100%;
    padding: 50% 0
}

.author-page .welcome__avatar .decorative-circle.top {
    bottom: 0
}

.author-page .welcome__avatar .decorative-circle.bottom {
    top: 0;
    width: 80%
}

@media only screen and (min-width: 1024px) {
    .author-page .welcome__avatar .decorative-circle.bottom {
        width: 33.333%
    }
}

.author-page .welcome__avatar .moon {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 3rem;
    border: 1px solid rgba(210, 161, 122, .4);
    border-radius: 50%;
    overflow: hidden
}

@media only screen and (min-width: 1024px) {
    .author-page .welcome__avatar .moon {
        width: 4rem
    }
}

.author-page .welcome__avatar .moon::before {
    content: "";
    display: block;
    width: 100%;
    padding: 50% 0
}

.author-page .welcome__avatar .moon.l {
    transform: rotate(-200deg) translate(40%, -40%) translateZ(0)
}

@media only screen and (min-width: 1024px) {
    .author-page .welcome__avatar .moon.l {
        transform: rotate(-200deg) translate(25%, -30%) translateZ(0)
    }
}

.author-page .welcome__avatar .moon.r {
    transform: rotate(20deg) translate(40%, 40%) translateZ(0)
}

@media only screen and (min-width: 1024px) {
    .author-page .welcome__avatar .moon.r {
        transform: rotate(20deg) translate(25%, 30%) translateZ(0)
    }
}

.author-page .welcome__avatar .moon-bg {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    height: 100%;
    background-color: #1e1131;
    animation-name: moonBg;
    animation-duration: 6s;
    animation-iteration-count: infinite;
    animation-timing-function: steps(1, end)
}

.author-page .welcome__avatar .moon-side {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: 0%;
    width: 50%;
    height: 100%;
    background-color: #d2a17d;
    animation-name: moonSide;
    animation-duration: 6s;
    animation-iteration-count: infinite;
    animation-timing-function: steps(1, end)
}

.author-page .welcome__avatar .moon-shade {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    background-color: #d2a17d;
    border-radius: 50%;
    animation-name: moonShade;
    animation-duration: 6s;
    animation-iteration-count: infinite;
    animation-timing-function: linear
}

.author-page .welcome__avatar .ava-wrap {
    width: 50%;
    margin-left: 5%;
    margin-right: 5%;
    position: relative
}

@media only screen and (min-width: 1024px) {
    .author-page .welcome__avatar .ava-wrap {
        width: 15.277%;
        min-width: 11rem
    }
}

.author-page .welcome__avatar .ava-wrap::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: -15%;
    width: 130%;
    height: 100%;
    border-radius: 50%;
    background-color: #1e1131
}

.author-page .welcome__avatar .ava-wrap div {
    position: relative;
    width: 100%;
    padding: 50% 0;
    border-radius: 50%;
    overflow: hidden
}

.author-page .welcome__avatar .ava-wrap div img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.author-page .description {
    position: relative;
    z-index: 5;
    text-align: center;
    padding-top: 1rem;
    padding-bottom: 6rem
}

.author-page .description span {
    color: #e6f3e8
}

.author-page .description h2 {
    margin-bottom: 2.4rem;
    width: 80%;
    margin-left: auto;
    margin-right: auto
}

.author-page .description p {
    color: #e6f3e8;
    max-width: 80%;
    margin-left: auto;
    margin-right: auto
}

@media only screen and (min-width: 1024px) {
    .author-page .description p {
        width: 31.944%;
        min-width: 23rem
    }
}

.author-page .description__contacts {
    margin-top: 2rem;
    display: flex;
    justify-content: center;
    align-items: center
}

.author-page .description__contacts a {
    display: inline-block;
    padding: .5rem;
    border-radius: 50%
}

.author-page .description__contacts a svg {
    width: 1.25rem;
    aspect-ratio: 1/1;
    fill: #a689d2
}

@media only screen and (min-width: 1024px) {
    .author-page .description__contacts a svg {
        transform: scale(1) translateZ(0);
        transition: transform .6s cubic-bezier(0.23, 1, 0.32, 1);
        will-change: transform
    }

    .author-page .description__contacts a:hover svg {
        transform: scale(1.5) translateZ(0)
    }
}

.author-page .recent {
    position: relative;
    z-index: 5;
    text-align: center
}

.author-page .recent .line {
    display: block;
    width: 100%;
    height: 1px;
    background-image: linear-gradient(to right, rgba(166, 137, 210, 0) 0%, #A689D2 50%, rgba(166, 137, 210, 0) 100%)
}

.author-page .recent .icon-hypno-eye {
    margin: 0 auto;
    transform: translate(0, -50%);
    border: initial;
    background-color: #1e1131
}

.author-page .recent__list .list {
    position: relative;
    z-index: 3;
    margin-top: 4rem;
    margin-left: 1rem;
    margin-right: 1rem;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap
}

.author-page .recent__list .list *::-moz-selection {
    background-color: #a689d2
}

.author-page .recent__list .list *::selection {
    background-color: #a689d2
}

@media only screen and (min-width: 1024px) {
    .author-page .recent__list .list {
        width: 81.944%;
        margin-left: auto;
        margin-right: auto
    }
}

.author-page .recent__list .list__item {
    width: 46%;
    display: flex
}

@media only screen and (min-width: 1024px) {
    .author-page .recent__list .list__item {
        width: 49.152%
    }
}

.author-page .recent__list .list__item:nth-child(2n+1) {
    margin-bottom: 4rem
}

@media only screen and (min-width: 1024px) {
    .author-page .recent__list .list__item:nth-child(2n+1) {
        margin-bottom: 8rem
    }
}

.author-page .recent__list .list__item:nth-child(2n) {
    margin-top: 4rem
}

@media only screen and (min-width: 1024px) {
    .author-page .recent__list .list__item:nth-child(2n) {
        margin-top: 8rem
    }
}

.author-page .recent__list .list__item a {
    display: inline-block
}

@media only screen and (min-width: 1024px) {
    .author-page .recent__list .list__item a {
        width: 79.31%;
        margin-left: auto;
        margin-right: auto
    }
}

.author-page .recent__list .list__item a .image {
    position: relative;
    width: 100%;
    padding: 30% 0;
    margin-bottom: 1rem;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    border-radius: 50%;
    background-color: #1e1131;
    transform: rotate(calc(var(--t-rotate) * 1deg)) translateZ(0) scale(1);
    transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1)
}

.author-page .recent__list .list__item a .image figure {
    position: absolute;
    width: 100%;
    padding: 50% 0
}

.author-page .recent__list .list__item a .image img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    opacity: 1;
    transform: rotate(calc(var(--t-rotate) * -1deg)) scale(1.2);
    transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1), opacity .9s cubic-bezier(0.4, 0.1, 0, 1)
}

.author-page .recent__list .list__item a .desc {
    position: relative
}

@media only screen and (min-width: 1024px) {
    .author-page .recent__list .list__item a .desc {
        min-height: 12rem
    }
}

.author-page .recent__list .list__item a .desc .arrow-icon {
    width: 2rem;
    margin-left: auto;
    margin-right: auto
}

@media only screen and (min-width: 1024px) {
    .author-page .recent__list .list__item a .desc .arrow-icon {
        transform: translateZ(0);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
    }
}

.author-page .recent__list .list__item a .desc h4 {
    text-align: center
}

@media only screen and (min-width: 1024px) {
    .author-page .recent__list .list__item a .desc h4 {
        text-shadow: 0px 0px 1rem rgba(230, 243, 232, 0);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1), text-shadow .6s cubic-bezier(0.23, 1, 0.32, 1)
    }
}

.author-page .recent__list .list__item a .desc span {
    display: inline-block;
    width: 100%;
    text-align: center
}

@media only screen and (min-width: 1024px) {
    .author-page .recent__list .list__item a .desc span {
        width: auto;
        margin-left: 50%;
        text-align: left;
        transform: translate(1rem, 0);
        opacity: 1;
        transition: opacity .6s cubic-bezier(0.4, 0.1, 0, 1)
    }
}

.author-page .recent__list .list__item a .desc p {
    margin-top: 1rem;
    color: #e6f3e8;
    width: 80%;
    margin-left: 10%
}

@media only screen and (min-width: 1024px) {
    .author-page .recent__list .list__item a .desc p {
        width: 69.565%;
        margin-left: 16.565%
    }
}

@media only screen and (min-width: 1024px) {
    .author-page .recent__list .list__item a:hover .image {
        transform: rotate(calc(var(--t-rotate) * 1deg)) translateZ(0) scale(1.1)
    }

    .author-page .recent__list .list__item a:hover .image img {
        opacity: .4;
        transform: rotate(calc(var(--t-rotate) * -1deg)) scale(1)
    }

    .author-page .recent__list .list__item a:hover .desc .arrow-icon {
        transform: translate(2rem, 0)
    }

    .author-page .recent__list .list__item a:hover .desc h4 {
        text-shadow: 0px 0px 1rem #e6f3e8
    }

    .author-page .recent__list .list__item a:hover .desc span {
        opacity: .4
    }
}

.author-page .recent__list .no-posts {
    margin: 6rem 0
}

@keyframes circle-loading {
    to {
        stroke-dashoffset: 0
    }
}

@keyframes heart {
    0% {
        transform: scale(1)
    }

    5% {
        transform: scale(1.2)
    }

    10% {
        transform: scale(1)
    }

    15% {
        transform: scale(1.2)
    }

    25% {
        transform: scale(1)
    }

    100% {
        transform: scale(1)
    }
}

@keyframes flyXY {
    0% {
        transform: translateX(0%)
    }

    50% {
        transform: translateX(80%)
    }

    100% {
        transform: translateX(0%)
    }
}

@keyframes flyXYZ {
    0% {
        transform: translateX(0%) rotate(0deg)
    }

    50% {
        transform: translateX(80%) rotate(180deg)
    }

    100% {
        transform: translateX(0%) rotate(360deg)
    }
}

@keyframes flyZ {
    0% {
        transform: rotate(0deg) translateY(0);
        opacity: 1
    }

    12.5% {
        opacity: .6
    }

    25% {
        transform: rotate(180deg) translateY(1rem);
        opacity: .8
    }

    37.5% {
        opacity: .4
    }

    50% {
        transform: rotate(360deg) translateY(0);
        opacity: 1
    }

    62.5% {
        opacity: .2
    }

    75% {
        transform: rotate(180deg) translateY(-1rem);
        opacity: .8
    }

    87.5% {
        opacity: .4
    }

    100% {
        transform: rotate(360deg) translateY(0);
        opacity: 1
    }
}

@keyframes cardRotateZ {
    0% {
        transform: rotateY(0deg)
    }

    50% {
        transform: rotateY(180deg)
    }

    100% {
        transform: rotateY(360deg)
    }
}

@keyframes leftTopIcon {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(360deg)
    }
}

@keyframes logoRotate {
    0% {
        transform: rotate(360deg)
    }

    100% {
        transform: rotate(0deg)
    }
}

@keyframes logoRotateReverse {
    0% {
        transform: rotate(-360deg)
    }

    100% {
        transform: rotate(0deg)
    }
}

@keyframes bottomRightIcon {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(360deg)
    }
}

@keyframes feather {

    0%,
    100% {
        transform: rotate(-15deg)
    }

    50% {
        transform: rotate(15deg)
    }
}

@keyframes triangleLine {

    0%,
    100% {
        transform-origin: center left;
        transform: scale(0, 1)
    }

    25% {
        transform-origin: center left;
        transform: scale(1, 1)
    }

    26% {
        transform-origin: center right
    }

    50% {
        transform-origin: center right;
        transform: scale(0, 1)
    }
}

@keyframes lightsP {
    0% {
        transform: scale(1)
    }

    20% {
        transform: scale(0.8)
    }

    40% {
        transform: scale(1.1)
    }

    70% {
        transform: scale(0.9)
    }

    100% {
        transform: scale(1)
    }
}

@keyframes swingIt {
    0% {
        transform: rotate(-10deg)
    }

    50% {
        transform: rotate(10deg)
    }

    100% {
        transform: rotate(-10deg)
    }
}

@keyframes rotateIt {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(360deg)
    }
}

@keyframes lightsOp {
    0% {
        opacity: .5
    }

    15% {
        opacity: .4
    }

    25% {
        opacity: .45
    }

    30% {
        opacity: .6
    }

    60% {
        opacity: .55
    }

    75% {
        opacity: .35
    }

    90% {
        opacity: .6
    }

    100% {
        opacity: .5
    }
}

@keyframes cardRotate {
    0% {
        transform: rotate(-13deg)
    }

    50% {
        transform: rotate(13deg)
    }

    100% {
        transform: rotate(-13deg)
    }
}

@keyframes hypnoStar {
    0% {
        z-index: 40;
        transform: scale(0) rotate(0deg)
    }

    40% {
        z-index: 40;
        transform: scale(1) rotate(115deg)
    }

    60% {
        z-index: 0;
        transform: scale(0.5) rotate(180deg)
    }

    100% {
        z-index: 0;
        transform: scale(0) rotate(0deg)
    }
}

@keyframes moonBg {
    0% {
        background-color: #1e1131
    }

    25% {
        background-color: #1e1131
    }

    50% {
        background-color: #d2a17d
    }

    75% {
        background-color: #d2a17d
    }

    100% {
        background-color: #1e1131
    }
}

@keyframes moonSide {
    0% {
        transform: translate(0, 0);
        background-color: #d2a17d
    }

    25% {
        transform: translate(100%, 0);
        background-color: #d2a17d
    }

    50% {
        transform: translate(0, 0);
        background-color: #1e1131
    }

    75% {
        transform: translate(100%, 0);
        background-color: #1e1131
    }

    100% {
        transform: translate(0, 0);
        background-color: #d2a17d
    }
}

@keyframes moonShade {
    0% {
        transform: scale(0, 1) translateZ(0);
        background-color: #d2a17d
    }

    25% {
        transform: scale(1, 1) translateZ(0);
        background-color: #d2a17d
    }

    49% {
        background-color: #d2a17d
    }

    50% {
        transform: scale(0, 1) translateZ(0);
        background-color: #1e1131
    }

    75% {
        transform: scale(1, 1) translateZ(0);
        background-color: #1e1131
    }

    99% {
        background-color: #1e1131
    }

    100% {
        transform: scale(0, 1) translateZ(0);
        background-color: #d2a17d
    }
}

@keyframes homeStarAbout {
    0% {
        opacity: 0;
        transform: scale(0.25)
    }

    15% {
        opacity: 1
    }

    100% {
        opacity: 0;
        transform: scale(1)
    }
}

@keyframes cardGlare {
    0% {
        transform: translate(100%, 0%) rotateZ(13deg)
    }

    50% {
        transform: translate(-100%, 0%) rotateZ(-13deg)
    }

    100% {
        transform: translate(100%, 0%) rotateZ(13deg)
    }
}

@keyframes cardGlareBack {
    0% {
        transform: translate(-100%, 0%) rotateZ(-13deg)
    }

    50% {
        transform: translate(100%, 0%) rotateZ(13deg)
    }

    100% {
        transform: translate(-100%, 0%) rotateZ(-13deg)
    }
}

@keyframes dash {
    from {
        stroke-dashoffset: 1000
    }

    to {
        stroke-dashoffset: 0
    }
}

@keyframes magic-vertical {
    0% {
        transform: translate(0%, 0)
    }

    50% {
        transform: translate(0%, -50%)
    }

    100% {
        transform: translate(0%, -100%)
    }
}

@keyframes magic-horisontal-1 {
    0% {
        transform: translate(0%, 0%) scale(0.3);
        opacity: 0
    }

    25% {
        opacity: 1
    }

    50% {
        transform: translate(2rem, 0%) scale(2);
        opacity: 0
    }

    75% {
        opacity: 1
    }

    100% {
        transform: translate(0%, 0%) scale(0);
        opacity: 0
    }
}

@keyframes magic-horisontal-2 {
    0% {
        transform: translate(1rem, 0%) scale(0.2);
        opacity: 0
    }

    10% {
        opacity: 1
    }

    20% {
        opacity: 0
    }

    30% {
        opacity: 1
    }

    40% {
        opacity: 0
    }

    50% {
        transform: translate(0%, 0%) scale(1.5);
        opacity: 1
    }

    60% {
        opacity: 0
    }

    70% {
        opacity: 1
    }

    80% {
        opacity: 0
    }

    90% {
        opacity: 1
    }

    100% {
        transform: translate(1.5rem, 0%) scale(0);
        opacity: 0
    }
}

@keyframes magic-horisontal-3 {
    0% {
        transform: translate(0.5rem, 0%) scale(0);
        opacity: 0
    }

    20% {
        opacity: 1
    }

    40% {
        opacity: 0
    }

    50% {
        transform: translate(-1.5rem, 0%) scale(1)
    }

    60% {
        opacity: 1
    }

    80% {
        opacity: 0
    }

    100% {
        transform: translate(0.5rem, 0%) scale(0)
    }
}

@keyframes magic-horisontal-4 {
    0% {
        transform: translate(0, 0%) scale(0.2);
        opacity: 0
    }

    50% {
        transform: translate(-1rem, 0%) scale(1.8);
        opacity: 1
    }

    60% {
        opacity: 0
    }

    80% {
        opacity: 1
    }

    100% {
        transform: translate(0, 0%) scale(0);
        opacity: 0
    }
}

@keyframes magic-horisontal-11 {
    0% {
        transform: translate(0%, 0%) scale(0.3);
        opacity: 0
    }

    25% {
        opacity: 1
    }

    50% {
        transform: translate(8rem, 0%) scale(2);
        opacity: 0
    }

    75% {
        opacity: 1
    }

    100% {
        transform: translate(0%, 0%) scale(0);
        opacity: 0
    }
}

@keyframes magic-horisontal-22 {
    0% {
        transform: translate(4rem, 0%) scale(0.2);
        opacity: 0
    }

    10% {
        opacity: 1
    }

    20% {
        opacity: 0
    }

    30% {
        opacity: 1
    }

    40% {
        opacity: 0
    }

    50% {
        transform: translate(0%, 0%) scale(1.5);
        opacity: 1
    }

    60% {
        opacity: 0
    }

    70% {
        opacity: 1
    }

    80% {
        opacity: 0
    }

    90% {
        opacity: 1
    }

    100% {
        transform: translate(4rem, 0%) scale(0);
        opacity: 0
    }
}

@keyframes magic-horisontal-33 {
    0% {
        transform: translate(2rem, 0%) scale(0);
        opacity: 0
    }

    20% {
        opacity: 1
    }

    40% {
        opacity: 0
    }

    50% {
        transform: translate(-6rem, 0%) scale(1)
    }

    60% {
        opacity: 1
    }

    80% {
        opacity: 0
    }

    100% {
        transform: translate(2rem, 0%) scale(0)
    }
}

@keyframes magic-horisontal-44 {
    0% {
        transform: translate(0, 0%) scale(0.2);
        opacity: 0
    }

    50% {
        transform: translate(-4rem, 0%) scale(1.8);
        opacity: 1
    }

    60% {
        opacity: 0
    }

    80% {
        opacity: 1
    }

    100% {
        transform: translate(0, 0%) scale(0);
        opacity: 0
    }
}

@keyframes magic-horisontal-scale {
    0% {
        transform: scale(0.3)
    }

    5% {
        transform: scale(1)
    }

    10% {
        transform: scale(0)
    }

    15% {
        transform: scale(0)
    }

    20% {
        transform: scale(0)
    }

    25% {
        transform: scale(1)
    }

    30% {
        transform: scale(0)
    }

    35% {
        transform: scale(1)
    }

    45% {
        transform: scale(0)
    }

    60% {
        transform: scale(1)
    }

    65% {
        transform: scale(0)
    }

    70% {
        transform: scale(1)
    }

    90% {
        transform: scale(0.5)
    }

    95% {
        transform: scale(1)
    }
}

@keyframes usualMobileA {
    0% {
        transform: rotate(0deg) translateZ(0)
    }

    25% {
        transform: rotate(-5deg) scale(0.9)
    }

    75% {
        transform: rotate(-5deg) scale(0.9)
    }

    100% {
        transform: rotate(0deg) translateZ(0)
    }
}

@keyframes usualMobileB {
    0% {
        transform: rotate(0deg) translateZ(0)
    }

    50% {
        transform: rotate(360deg) scale(1.2)
    }

    100% {
        transform: rotate(0deg) translateZ(0)
    }
}

@keyframes loveMobileA {
    0% {
        transform: rotate(0deg)
    }

    50% {
        transform: rotate(-15deg)
    }

    100% {
        transform: rotate(0deg)
    }
}

@keyframes loveMobileB {
    0% {
        transform: translateZ(0)
    }

    50% {
        transform: translate(5%, 0)
    }

    100% {
        transform: translateZ(0)
    }
}

@keyframes loveMobileC {
    0% {
        transform: translateZ(0)
    }

    50% {
        transform: scale(0.9)
    }

    100% {
        transform: translateZ(0)
    }
}

@keyframes threeMobileA {
    0% {
        transform: rotate(0deg) translateZ(0)
    }

    50% {
        transform: rotate(-10deg) scale(0.8)
    }

    100% {
        transform: rotate(0deg) translateZ(0)
    }
}

@keyframes threeMobileB {
    0% {
        transform: translateZ(0)
    }

    50% {
        transform: scale(1.5)
    }

    100% {
        transform: translateZ(0)
    }
}

@keyframes threeMobileC {
    0% {
        transform: rotate(0deg) translateZ(0)
    }

    50% {
        transform: rotate(360deg)
    }

    100% {
        transform: rotate(0deg) translateZ(0)
    }
}

@keyframes yesnoMobileA {
    0% {
        transform: scale(1) translateZ(0)
    }

    50% {
        transform: scale(1.2)
    }

    100% {
        transform: scale(1) translateZ(0)
    }
}

@keyframes yesnoMobileB {
    0% {
        transform: rotate(0deg) translateZ(0);
        transform-origin: center 60%
    }

    50% {
        transform: rotate(-10deg);
        transform-origin: center 60%
    }

    100% {
        transform: scale(1) translateZ(0);
        transform-origin: center 60%
    }
}

@keyframes yesnoMobileC {
    0% {
        transform: rotate(0deg) translateZ(0);
        transform-origin: center 60%
    }

    50% {
        transform: rotate(10deg);
        transform-origin: center 60%
    }

    100% {
        transform: rotate(0deg) translateZ(0);
        transform-origin: center 60%
    }
}

@keyframes oneMobileA {
    0% {
        transform: rotate(0deg) translateZ(0)
    }

    50% {
        transform: rotate(-120deg) scale(1.2)
    }

    100% {
        transform: rotate(0deg) translateZ(0)
    }
}

@keyframes oneMobileB {
    0% {
        transform: rotate(0deg) translateZ(0)
    }

    50% {
        transform: rotate(90deg) scale(1.2)
    }

    100% {
        transform: rotate(0deg) translateZ(0)
    }
}

@keyframes oneMobileC {
    0% {
        transform: rotate(0deg) translateZ(0)
    }

    50% {
        transform: rotate(180deg) scale(1.2)
    }

    100% {
        transform: rotate(0deg) translateZ(0)
    }
}

@keyframes aiMobileBase {

    0%,
    100% {
        transform: rotate(0deg) translateZ(0)
    }

    50% {
        transform: rotate(5deg) scale(0.9)
    }
}

@keyframes aiMobileA {

    0%,
    100% {
        transform: rotate(0deg) scale(1) translateZ(0)
    }

    50% {
        transform: rotate(45deg) scale(0.95)
    }
}

@keyframes aiMobileB {

    0%,
    100% {
        transform: rotate(0deg) scale(1) translateZ(0)
    }

    50% {
        transform: rotate(360deg) scale(0.4)
    }
}

.pagination {
    position: relative;
    z-index: 10;
    margin-top: 4rem;
    margin-left: .25rem;
    margin-right: .25rem;
    padding: 1.5rem;
    border-radius: 2.5rem 1.2rem;
    background-color: #120b1c;
    display: flex
}

@media only screen and (min-width: 1024px) {
    .pagination {
        background-color: rgba(18, 11, 28, .1254901961);
        backdrop-filter: blur(2rem);
        -webkit-backdrop-filter: blur(2rem);
        -moz-backdrop-filter: blur(2rem);
        margin-left: auto;
        margin-right: auto
    }
}

.pagination::before {
    content: "";
    display: block;
    position: absolute;
    top: .5rem;
    left: .5rem;
    right: .5rem;
    bottom: .5rem;
    border-radius: 2rem;
    border: 1px solid #d2a17d;
    opacity: .2
}

.pagination .next,
.pagination .prev {
    display: block;
    width: 2rem;
    position: relative
}

.pagination .next img,
.pagination .prev img {
    pointer-events: none
}

@media only screen and (min-width: 1024px) {

    .pagination .next img,
    .pagination .prev img {
        transform: translateZ(0);
        transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1)
    }
}

@media only screen and (min-width: 1024px) {

    .pagination .next:hover img,
    .pagination .prev:hover img {
        transform: translate(0.25rem, 0)
    }
}

.pagination .prev {
    transform: rotate(-180deg)
}

.pagination__pages {
    display: flex
}

.pagination__page-item {
    position: relative;
    padding: .5rem 1rem;
    display: flex;
    justify-content: center;
    align-items: center
}

@media only screen and (min-width: 1024px) {
    .pagination__page-item::before {
        content: "";
        display: block;
        position: absolute;
        top: auto;
        right: auto;
        bottom: auto;
        left: auto;
        width: 100%;
        padding: 50% 0;
        border-radius: 50%;
        border: 1px solid #d2a17d;
        opacity: 0;
        transform: scale(0.5);
        transition: transform .3s cubic-bezier(0.4, 0.1, 0, 1), opacity .3s cubic-bezier(0.4, 0.1, 0, 1)
    }
}

.pagination__page-item.-active {
    color: #d2a17d;
    cursor: default
}

@media only screen and (min-width: 1024px) {
    .pagination__page-item:hover:not(div)::before {
        opacity: 1;
        transform: scale(1);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1), opacity .6s cubic-bezier(0.4, 0.1, 0, 1)
    }
}

.t-grid {
    position: fixed;
    z-index: 999;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    display: flex;
    opacity: .25;
    display: none
}

.t-grid span {
    position: relative;
    display: block;
    height: 100%;
    width: 100%;
    background: #1aff00;
    padding: 0 0.6944444444%
}

.t-grid span::before {
    content: "";
    display: block;
    height: 100%;
    background: #8b12c7
}

.wp-video {
    margin: 40px auto
}

.wp-video .mejs-controls {
    display: none
}

.author {
    color: #e6f3e8;
    text-decoration: none
}

.card-blog-page {
    padding-top: 8rem
}

@media only screen and (min-width: 1024px) {
    .card-blog-page {
        padding-top: 13rem
    }
}

.card-blog-page .welcome {
    position: relative
}

.card-blog-page .welcome .welcome__title {
    position: relative;
    z-index: 5;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: .5rem 0
}

.card-blog-page .welcome .welcome__title .hypno-star {
    position: relative;
    display: flex;
    align-items: center;
    width: 3rem;
    transform: translate(40%, -40%) translateZ(0)
}

@media only screen and (min-width: 1024px) {
    .card-blog-page .welcome .welcome__title .hypno-star {
        width: 4rem;
        transform: translate(25%, -30%) translateZ(0)
    }
}

.card-blog-page .welcome .welcome__title .hypno-star::before {
    content: "";
    display: block;
    width: 100%;
    padding: 50% 0
}

.card-blog-page .welcome .welcome__title .hypno-star img {
    position: absolute;
    animation-name: hypnoStar;
    animation-duration: 6s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out
}

.card-blog-page .welcome .welcome__title .hypno-star img.a {
    animation-delay: -3.75s
}

.card-blog-page .welcome .welcome__title .hypno-star img.b {
    animation-delay: -3s
}

.card-blog-page .welcome .welcome__title .hypno-star img.c {
    animation-delay: -2.25s
}

.card-blog-page .welcome .welcome__title .hypno-star img.d {
    animation-delay: -1.5s
}

.card-blog-page .welcome .welcome__title .hypno-star img.e {
    animation-delay: -0.75s
}

.card-blog-page .welcome .welcome__title .hypno-star img.f {
    animation-delay: 0s
}

.card-blog-page .welcome .welcome__title .title-wrap {
    width: 50%;
    margin-left: 5%;
    margin-right: 5%;
    position: relative;
    text-align: center
}

.card-blog-page .tabs {
    position: relative;
    margin-top: 1.75rem;
    margin-bottom: 3.5rem;
    z-index: 5;
    font-size: .7rem
}

.card-blog-page h5.title {
    position: relative;
    z-index: 5;
    margin: 1.25rem auto .75rem;
    text-align: center
}

.card-blog-page p.-m.subtitle {
    position: relative;
    text-align: center;
    margin: 0rem auto 3rem;
    z-index: 5;
    max-width: 60%
}

.card-blog-page .separator {
    position: relative;
    display: flex;
    justify-content: center;
    z-index: 2
}

.card-blog-page .separator .clock {
    position: relative;
    width: 3rem;
    height: 3rem;
    background: #1e1131;
    border-radius: 50%
}

.card-blog-page .separator .sun-star {
    position: relative;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 3rem;
    height: 3rem;
    border: 2px solid #d2a17d;
    border-radius: 50%;
    background-color: #1e1131
}

@media only screen and (min-width: 1024px) {
    .card-blog-page .separator .sun-star {
        border: 3px solid #d2a17d
    }
}

.card-blog-page .separator .sun-star::before {
    content: "";
    display: block;
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    border: 1px solid #d2a17d;
    border-radius: 50%
}

.card-blog-page .separator .sun-star .star {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    animation-name: bottomRightIcon;
    animation-duration: 12s;
    animation-iteration-count: infinite;
    animation-timing-function: linear
}

.card-blog-page .separator .sun-star .face {
    position: absolute;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto
}

.card-blog-page .separator .echinus {
    position: relative;
    width: 3rem;
    height: 3rem;
    padding: .25rem;
    border: 1px solid rgba(210, 161, 125, .4);
    border-radius: 50%;
    background: #1e1131
}

@media only screen and (min-width: 1024px) {
    .card-blog-page .separator .echinus {
        margin: .5rem;
        padding: .5rem
    }
}

.card-blog-page .separator .echinus img {
    animation-name: leftTopIcon;
    animation-duration: 24s;
    animation-iteration-count: infinite;
    animation-timing-function: linear
}

.card-blog-page .separator .line {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #a689d2;
    -webkit-clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
    clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%)
}

.card-blog-page .card-list {
    position: relative;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: initial;
    left: initial;
    margin-bottom: -1rem;
    z-index: 10;
    max-width: 1080px;
    margin: 0 auto
}

.card-blog-page .card-list .card-list__item {
    display: flex;
    justify-content: center;
    width: 50%;
    margin-bottom: 3.5rem
}

@media only screen and (min-width: 1024px) {
    .card-blog-page .card-list .card-list__item {
        width: 33.33333%
    }
}

.card-blog-page .card-list .card-list__item .card-blog-item {
    position: relative;
    width: 75%;
    box-sizing: border-box;
    padding: 2rem 1rem .5rem 1rem
}

@media only screen and (min-width: 1024px) {
    .card-blog-page .card-list .card-list__item .card-blog-item {
        padding: 2rem 1rem 1.5rem 1rem;
        max-width: 13rem
    }
}

.card-blog-page .card-list .card-list__item .card-blog-item:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    border: 1px solid #d2a17d;
    border-radius: 2rem;
    opacity: .1
}

.card-blog-page .card-list .card-list__item .card-blog-item .card-blog-item__decorative-circle-container {
    position: absolute;
    left: 50%;
    padding: 1px;
    bottom: -1rem;
    width: 85%;
    margin-left: -42.5%
}

.card-blog-page .card-list .card-list__item .card-blog-item .card-blog-item__decorative-circle-container::before {
    content: "";
    display: block;
    width: 100%;
    padding: 25% 0
}

.card-blog-page .card-list .card-list__item .card-blog-item .card-blog-item__decorative-circle {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    border-radius: 50%;
    flex-shrink: 0;
    padding: 1px;
    opacity: .4;
    background-image: linear-gradient(90deg, rgba(166, 137, 210, 0), #A689D2, rgba(166, 137, 210, 0));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude
}

.card-blog-page .card-list .card-list__item .card-blog-item .card-blog-item__decorative-circle::before {
    content: "";
    display: block;
    width: 100%;
    padding: 50% 0
}

.card-blog-page .card-list .card-list__item .card-blog-item .card-blog-item__left-decore {
    position: absolute;
    bottom: -0.5rem;
    left: .5rem;
    width: 23%;
    padding-bottom: 55%;
    border-bottom-left-radius: 1rem;
    border-left: 1px solid #d2a17d;
    border-bottom: 1px solid #d2a17d;
    pointer-events: none;
    opacity: .4
}

@media only screen and (min-width: 1024px) {
    .card-blog-page .card-list .card-list__item .card-blog-item .card-blog-item__left-decore {
        border-bottom-left-radius: 2rem
    }
}

.card-blog-page .card-list .card-list__item .card-blog-item .card-blog-item__right-decore {
    position: absolute;
    bottom: -0.5rem;
    right: .5rem;
    width: 23%;
    padding-bottom: 55%;
    border-bottom-right-radius: 1rem;
    border-right: 1px solid #d2a17d;
    border-bottom: 1px solid #d2a17d;
    pointer-events: none;
    opacity: .4
}

@media only screen and (min-width: 1024px) {
    .card-blog-page .card-list .card-list__item .card-blog-item .card-blog-item__right-decore {
        border-bottom-right-radius: 2rem
    }
}

.card-blog-page .card-list .card-list__item .card-blog-item .card-blog-item__center-line {
    position: absolute;
    top: 50%;
    height: 1px;
    left: -1rem;
    right: -1rem;
    background-color: #a689d2;
    -webkit-clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
    clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%)
}

@media only screen and (min-width: 1024px) {
    .card-blog-page .card-list .card-list__item .card-blog-item .card-blog-item__center-line {
        left: -2rem;
        right: -2rem
    }
}

.card-blog-page .card-list .card-list__item .card-blog-item .card-blog-item__r-star {
    position: absolute;
    left: 1rem;
    top: .75rem;
    transform: scale(1);
    transition: transform .9s cubic-bezier(0.5, 0, 0.5, 1)
}

.card-blog-page .card-list .card-list__item .card-blog-item .card-blog-item__r-star svg {
    aspect-ratio: 1/1;
    width: auto
}

.card-blog-page .card-list .card-list__item .card-blog-item .card-blog-item__l-star {
    position: absolute;
    right: 1rem;
    top: .75rem;
    transform: scale(1);
    transition: transform .9s cubic-bezier(0.5, 0, 0.5, 1)
}

.card-blog-page .card-list .card-list__item .card-blog-item .card-blog-item__l-star svg {
    aspect-ratio: 1/1;
    width: auto
}

.card-blog-page .card-list .card-list__item .card-blog-item .card-blog-item__title {
    position: relative;
    font-family: "boska";
    font-weight: 400;
    margin: 1rem 0 0;
    text-align: center;
    transform: scale(1);
    white-space: nowrap;
    display: flex;
    justify-content: center;
    transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1)
}

.card-blog-page .card-list .card-list__item .card-blog-item .card-blog-item__title span {
    position: relative
}

.card-blog-page .card-list .card-list__item .card-blog-item .card-blog-item__title:before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 60%;
    transform: translate(-50%, -25%);
    border-radius: 50%;
    background-color: #7b47c9;
    box-shadow: 0 0 1rem 1.5rem #7b47c9;
    opacity: 0;
    transition: opacity .9s cubic-bezier(0.4, 0.1, 0, 1)
}

.card-blog-page .card-list .card-list__item .card-blog-item .play-card {
    position: relative;
    perspective: 600px;
    z-index: 800;
    transform: translateZ(0);
    transition: transform .9s cubic-bezier(0.23, 1, 0.32, 1)
}

.card-blog-page .card-list .card-list__item .card-blog-item .play-card .flip-card-inner {
    position: relative;
    width: 100%;
    transform-style: preserve-3d;
    transition: transform .9s cubic-bezier(0.23, 1, 0.32, 1);
    transform: rotateY(0deg) translateZ(0)
}

.card-blog-page .card-list .card-list__item .card-blog-item .play-card .flip-card-inner .flip-card-back {
    position: relative;
    width: 100%;
    border-radius: .35rem;
    overflow: hidden;
    transform: translateZ(1px)
}

.card-blog-page .card-list .card-list__item .card-blog-item .play-card .flip-card-inner .flip-card-back video,
.card-blog-page .card-list .card-list__item .card-blog-item .play-card .flip-card-inner .flip-card-back img {
    display: block;
    width: 100%;
    height: auto
}

.card-blog-page .card-list .card-list__item .card-blog-item .play-card .flip-card-inner .flip-card-front {
    position: absolute;
    left: 1px;
    right: 1px;
    top: 1px;
    bottom: 1px;
    transform: rotateY(180deg) translateZ(0px);
    background-color: #f5f5f5;
    border-radius: .35rem;
    overflow: hidden;
    padding: 4.68% 4.68%;
    box-sizing: border-box
}

.card-blog-page .card-list .card-list__item .card-blog-item .play-card .flip-card-inner .flip-card-front::after {
    content: "";
    display: block;
    position: absolute;
    top: 1.9%;
    bottom: 1.9%;
    left: 3.125%;
    right: 3.125%;
    background-image: linear-gradient(to right bottom, #D2A17D 20%, #49432E 70%, #D2A17D 100%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    padding: 1px;
    border-radius: .25rem;
    opacity: .2
}

.card-blog-page .card-list .card-list__item .card-blog-item .play-card .flip-card-inner .flip-card-front video {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: .5rem;
    overflow: hidden;
    transform: translateZ(0)
}

.card-blog-page .card-list .card-list__item .card-blog-item.-active .play-card {
    transform: translate(0, -0.5rem) rotate(10deg) rotateY(0deg) scale(1);
    transition: transform .9s cubic-bezier(0.5, 0, 0.5, 1)
}

.card-blog-page .card-list .card-list__item .card-blog-item.-active .play-card .flip-card-inner {
    transform: rotateY(180deg);
    transition: transform 1.5s cubic-bezier(0.72, 0, 0.12, 1.54)
}

@media only screen and (min-width: 1024px) {
    .card-blog-page .card-list .card-list__item .card-blog-item:hover .card-blog-item__r-star {
        transform: scale(2)
    }

    .card-blog-page .card-list .card-list__item .card-blog-item:hover .card-blog-item__l-star {
        transform: scale(2)
    }

    .card-blog-page .card-list .card-list__item .card-blog-item:hover .card-blog-item__title {
        transform: scale(1.3)
    }

    .card-blog-page .card-list .card-list__item .card-blog-item:hover .card-blog-item__title:before {
        opacity: .45
    }

    .card-blog-page .card-list .card-list__item .card-blog-item:hover .play-card {
        transform: translate(0, -0.5rem) rotate(10deg) rotateY(0deg) scale(1);
        transition: transform .9s cubic-bezier(0.5, 0, 0.5, 1)
    }

    .card-blog-page .card-list .card-list__item .card-blog-item:hover .play-card .flip-card-inner {
        transform: rotateY(180deg);
        transition: transform 1.5s cubic-bezier(0.72, 0, 0.12, 1.54)
    }
}

@media only screen and (min-width: 1024px) {
    .card-blog-page .card-list .card-list__item:nth-child(3n-1) {
        margin-top: -2rem
    }
}

.m-slide-card-meanings-row {
    width: 100%;
    display: flex;
    justify-content: center
}

@media only screen and (max-width: 1024px) {
    .m-slide-card-meanings-row {
        flex-direction: column;
        align-items: center
    }
}

.m-slide-card-meanings-row .m-slide-card-meanings:nth-child(2) {
    margin-top: 0rem !important
}

@media only screen and (max-width: 1024px) {
    .m-slide-card-meanings-row .m-slide-card-meanings:nth-child(2) {
        margin-top: 3rem !important
    }
}

@media only screen and (max-width: 1024px) {
    .m-slide-card-meanings {
        width: 64vw;
        display: inline-flex;
        justify-content: center;
        align-items: flex-start
    }
}

@media only screen and (min-width: 1024px) {
    .m-slide-card-meanings {
        display: flex;
        justify-content: center;
        width: 33.33333%;
        margin-bottom: 1rem
    }

    .m-slide-card-meanings:nth-child(2) {
        margin-top: -1rem
    }
}

.m-slide-card-meanings.-chat .m-slide-inner-card-meanings .card-meanings-wrapper {
    height: 100%
}

.m-slide-card-meanings.-chat .m-slide-inner-card-meanings .card-meanings-wrapper .card-meanings {
    display: flex;
    flex-direction: column;
    height: 100%
}

.m-slide-card-meanings.-chat .m-slide-inner-card-meanings .card-meanings-wrapper .card-meanings .card-meanings__play-wrapper {
    flex: 1;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 20%
}

@media only screen and (max-width: 1024px) {
    .m-slide-card-meanings.-chat .m-slide-inner-card-meanings .card-meanings-wrapper .card-meanings .card-meanings__play-wrapper {
        padding-bottom: 3rem;
        padding-top: 3rem
    }
}

.m-slide-card-meanings.-chat .m-slide-inner-card-meanings .card-meanings-wrapper .card-meanings .card-meanings__play-wrapper video {
    position: relative;
    top: 10%;
    width: 90%;
    mix-blend-mode: difference
}

@media only screen and (max-width: 1024px) {
    .m-slide-inner-card-meanings {
        width: 12rem;
        transform: rotate(0deg) translateZ(0);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .m-slide-inner-card-meanings.-prev {
        pointer-events: none;
        transform: rotate(-5deg) translate(0, 2rem)
    }

    .m-slide-inner-card-meanings.-next {
        pointer-events: none;
        transform: rotate(5deg) translate(0, 2rem)
    }
}

@media only screen and (min-width: 1024px) {
    .m-slide-inner-card-meanings {
        width: 85%;
        max-width: 13rem
    }
}

.card-meanings-wrapper {
    position: relative;
    display: block;
    transform: translateZ(0);
    transition: transform 2.1s cubic-bezier(0.23, 1, 0.32, 1)
}

.card-meanings-wrapper *::-moz-selection {
    background-color: #a689d2
}

.card-meanings-wrapper *::selection {
    background-color: #a689d2
}

.card-meanings-wrapper .card-shadow {
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 2.1s cubic-bezier(0.23, 1, 0.32, 1);
    border-radius: 4rem;
    --c-shadow--rgb: 123, 71, 201;
    box-shadow: 0 1rem 2rem 0 rgba(var(--c-shadow--rgb), 1), 0 3rem 3rem 0 rgba(var(--c-shadow--rgb), 0.5)
}

.card-meanings-wrapper .card-meanings {
    position: relative;
    background: #120b1c;
    border-radius: 3.2rem 1.6rem;
    transform: translateZ(0)
}

@media only screen and (min-width: 1024px) {
    .card-meanings-wrapper .card-meanings {
        border-radius: 4rem 2rem
    }
}

.card-meanings-wrapper .card-meanings__title-container {
    display: flex;
    justify-content: center;
    position: relative;
    padding: 1rem 0 .5rem
}

@media only screen and (min-width: 1024px) {
    .card-meanings-wrapper .card-meanings__title-container {
        padding: 1.5rem 0 1rem
    }
}

.card-meanings-wrapper .card-meanings__title-element {
    font-family: "boska";
    font-weight: 400;
    margin: 0;
    line-height: 1;
    position: relative;
    display: flex;
    justify-content: center;
    color: #e6f3e8;
    text-shadow: 0px 0px 1rem rgba(230, 243, 232, 0);
    transform: translateZ(0);
    transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1), text-shadow .6s cubic-bezier(0.23, 1, 0.32, 1)
}

.card-meanings-wrapper .card-meanings__borders {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 0 1rem;
    opacity: .4;
    transition: opacity .6s cubic-bezier(0.4, 0.1, 0, 1)
}

.card-meanings-wrapper .card-meanings__borders img {
    width: 3.75rem
}

.card-meanings-wrapper .card-meanings__play-wrapper {
    position: relative;
    overflow: hidden
}

.card-meanings-wrapper .card-meanings__play {
    position: relative;
    margin: 2.5rem 18% 10%
}

@media only screen and (min-width: 1024px) {
    .card-meanings-wrapper .card-meanings__play {
        margin: 1.5rem 20% 20%
    }
}

.card-meanings-wrapper .card-meanings__play .deck-card {
    position: absolute;
    top: 0%;
    left: 0%;
    width: 100%;
    transform: translateZ(0);
    transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
}

.card-meanings-wrapper .card-meanings__play .deck-card .shade {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transform: translateZ(0) scale(1.1);
    opacity: 1;
    transition: opacity .9s cubic-bezier(0.4, 0.1, 0, 1)
}

.card-meanings-wrapper .card-meanings__play .deck-card:nth-child(5) {
    transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
}

.card-meanings-wrapper .card-meanings__play .deck-card:nth-child(4) {
    transition: transform .75s cubic-bezier(0.4, 0.1, 0, 1)
}

.card-meanings-wrapper .card-meanings__play .deck-card:nth-child(3) {
    transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1)
}

.card-meanings-wrapper .card-meanings__play .deck-card:nth-child(2) {
    transition: transform 1.05s cubic-bezier(0.4, 0.1, 0, 1)
}

.card-meanings-wrapper .card-meanings__play .deck-card:nth-child(1) {
    transition: transform 1.2s cubic-bezier(0.4, 0.1, 0, 1);
    position: relative;
    width: 100%
}

.card-meanings-wrapper .card-meanings__play .deck-card:nth-child(1) .shade {
    position: relative;
    opacity: 1
}

.card-meanings-wrapper .card-meanings__play .deck-card img {
    position: relative;
    width: 100%;
    height: auto;
    display: block;
    border-radius: .35rem;
    overflow: hidden;
    transform: translateZ(0)
}

.card-meanings-wrapper.-active {
    transform: scale(1.05)
}

.card-meanings-wrapper.-active .card-shadow {
    opacity: 1;
    transition: opacity 1.5s cubic-bezier(0.23, 1, 0.32, 1)
}

.card-meanings-wrapper.-active .card-meanings__title-element {
    transform: scale(1.25);
    text-shadow: 0px 0px 1rem #e6f3e8
}

.card-meanings-wrapper.-active .card-meanings__borders {
    opacity: .6
}

.card-meanings-wrapper.-active .card-meanings__play .deck-card {
    transform-origin: center
}

.card-meanings-wrapper.-active .card-meanings__play .deck-card:nth-child(1) {
    transform: translate(-45%, 7.5%) rotate(-30deg) scale(0.9);
    transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
}

.card-meanings-wrapper.-active .card-meanings__play .deck-card:nth-child(2) {
    transform: translate(-30%, 5%) rotate(-20deg) scale(0.9);
    transition: transform .75s cubic-bezier(0.4, 0.1, 0, 1)
}

.card-meanings-wrapper.-active .card-meanings__play .deck-card:nth-child(3) {
    transform: translate(-15%, 2.5%) rotate(-10deg) scale(0.9);
    transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1)
}

.card-meanings-wrapper.-active .card-meanings__play .deck-card:nth-child(4) {
    transform: translate(0%, 0%) rotate(0deg) scale(0.9);
    transition: transform 1.05s cubic-bezier(0.4, 0.1, 0, 1)
}

.card-meanings-wrapper.-active .card-meanings__play .deck-card:nth-child(5) {
    transform: translate(15%, 0%) rotate(10deg) scale(0.9);
    transition: transform 1.2s cubic-bezier(0.4, 0.1, 0, 1)
}

.card-meanings-wrapper.-active .card-meanings__play .deck-card .shade {
    opacity: 1
}

@media only screen and (min-width: 1024px) {
    .card-meanings-wrapper:hover {
        transform: scale(1.05)
    }

    .card-meanings-wrapper:hover .card-shadow {
        opacity: 1;
        transition: opacity 1.5s cubic-bezier(0.23, 1, 0.32, 1)
    }

    .card-meanings-wrapper:hover .card-meanings__title-element {
        transform: scale(1.25);
        text-shadow: 0px 0px 1rem #e6f3e8
    }

    .card-meanings-wrapper:hover .card-meanings__borders {
        opacity: .6
    }

    .card-meanings-wrapper:hover .card-meanings__play .deck-card {
        transform-origin: center
    }

    .card-meanings-wrapper:hover .card-meanings__play .deck-card:nth-child(1) {
        transform: translate(-45%, 7.5%) rotate(-30deg) scale(0.9);
        transition: transform .6s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .card-meanings-wrapper:hover .card-meanings__play .deck-card:nth-child(2) {
        transform: translate(-30%, 5%) rotate(-20deg) scale(0.9);
        transition: transform .75s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .card-meanings-wrapper:hover .card-meanings__play .deck-card:nth-child(3) {
        transform: translate(-15%, 2.5%) rotate(-10deg) scale(0.9);
        transition: transform .9s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .card-meanings-wrapper:hover .card-meanings__play .deck-card:nth-child(4) {
        transform: translate(0%, 0%) rotate(0deg) scale(0.9);
        transition: transform 1.05s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .card-meanings-wrapper:hover .card-meanings__play .deck-card:nth-child(5) {
        transform: translate(15%, 0%) rotate(10deg) scale(0.9);
        transition: transform 1.2s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .card-meanings-wrapper:hover .card-meanings__play .deck-card .shade {
        opacity: 1
    }
}

.d-moon {
    background: #1e1131;
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    position: relative
}

.d-moon::before {
    content: "";
    background-color: #d2a17d;
    position: absolute;
    display: block;
    height: 100%;
    width: 100%;
    border-radius: 50%;
    z-index: -1
}

.d-moon:first-child {
    margin-left: -1.5rem
}

.d-moon:first-child::before {
    animation: 3.2s cresent linear infinite alternate
}

@media only screen and (min-width: 1024px) {
    .d-moon:first-child {
        margin-left: -2rem
    }
}

.d-moon:last-child {
    margin-right: -1.5rem
}

.d-moon:last-child::before {
    animation: 3.2s cresent-reverse linear infinite alternate
}

@media only screen and (min-width: 1024px) {
    .d-moon:last-child {
        margin-right: -2rem
    }
}

@media only screen and (min-width: 1024px) {
    .d-moon {
        width: 4rem;
        height: 4rem
    }
}

@keyframes adBg {
    0% {
        background-position: 0% 0%
    }

    50% {
        background-position: 100% 0%
    }

    100% {
        background-position: 0% 0%
    }
}

@keyframes cresent {
    0% {
        transform: translate(-15%, 15%) scale(0.9);
        box-shadow: none
    }

    50% {
        transform: translate(0px, 0px) scale(1.02);
        box-shadow: 0 0 10px #f9f3ef, 0 0 3rem 8px #d2a17d;
        background-color: #efdbd8
    }

    100% {
        transform: translate(15%, -15%) scale(0.9);
        box-shadow: none
    }
}

@keyframes cresent-reverse {
    0% {
        transform: translate(15%, 15%) scale(0.9);
        box-shadow: none
    }

    50% {
        transform: translate(0px, 0px) scale(1.02);
        box-shadow: 0 0 10px #f9f3ef, 0 0 3rem 8px #d2a17d;
        background-color: #efdbd8
    }

    100% {
        transform: translate(-15%, -15%) scale(0.9);
        box-shadow: none
    }
}

.result-iframe {
    position: relative;
    width: 100%;
    box-sizing: border-box;
    padding: 1rem 1rem .5rem 1rem;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 2rem;
    margin-top: 5rem;
    opacity: 0;
    transform: scale(0.95) translateY(1rem);
    transition: transform .6s cubic-bezier(0.23, 1, 0.32, 1), opacity .6s cubic-bezier(0.23, 1, 0.32, 1);
    transition-delay: 1.2s
}

.result-iframe.-show {
    opacity: 1;
    transform: translateZ(0) scale(1)
}

.result-iframe.modal {
    margin-bottom: 0rem;
    margin-top: 0rem
}

@media only screen and (min-width: 1024px) {
    .result-iframe {
        padding: 2rem 1rem 1.5rem 1rem;
        width: 65%
    }
}

.result-iframe:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    border: 1px solid #d2a17d;
    border-radius: 2rem;
    opacity: .1;
    pointer-events: none
}

.result-iframe .result-iframe__decorative-circle-container {
    position: absolute;
    left: 50%;
    padding: 1px;
    bottom: -1rem;
    width: 85%;
    margin-left: -42.5%
}

.result-iframe .result-iframe__decorative-circle-container::before {
    content: "";
    display: block;
    width: 100%;
    padding: 25% 0
}

.result-iframe .result-iframe__decorative-circle {
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 33%;
    border-radius: 50%;
    flex-shrink: 0;
    padding: 1px;
    opacity: .4;
    background-image: linear-gradient(90deg, rgba(166, 137, 210, 0), #A689D2, rgba(166, 137, 210, 0));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    transform: translateX(-50%)
}

.result-iframe .result-iframe__decorative-circle::before {
    content: "";
    display: block;
    width: 100%;
    padding: 50% 0
}

.result-iframe .result-iframe__left-decore {
    position: absolute;
    bottom: -0.5rem;
    left: .5rem;
    width: 10%;
    padding-bottom: 15%;
    border-bottom-left-radius: 1rem;
    border-left: 1px solid #d2a17d;
    border-bottom: 1px solid #d2a17d;
    pointer-events: none;
    opacity: .4
}

@media only screen and (min-width: 1024px) {
    .result-iframe .result-iframe__left-decore {
        border-bottom-left-radius: 2rem
    }
}

.result-iframe .result-iframe__right-decore {
    position: absolute;
    bottom: -0.5rem;
    right: .5rem;
    width: 10%;
    padding-bottom: 15%;
    border-bottom-right-radius: 1rem;
    border-right: 1px solid #d2a17d;
    border-bottom: 1px solid #d2a17d;
    pointer-events: none;
    opacity: .4
}

@media only screen and (min-width: 1024px) {
    .result-iframe .result-iframe__right-decore {
        border-bottom-right-radius: 2rem
    }
}

.result-iframe .result-iframe__center-line {
    position: absolute;
    top: 50%;
    height: 1px;
    left: -1rem;
    right: -1rem;
    background-color: #a689d2;
    -webkit-clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
    clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%)
}

@media only screen and (min-width: 1024px) {
    .result-iframe .result-iframe__center-line {
        left: -2rem;
        right: -2rem
    }
}

.result-iframe .result-iframe__r-star {
    position: absolute;
    left: 1rem;
    top: .75rem;
    transform: scale(1);
    transition: transform .9s cubic-bezier(0.5, 0, 0.5, 1)
}

.result-iframe .result-iframe__r-star svg {
    aspect-ratio: 1/1;
    width: auto
}

.result-iframe .result-iframe__l-star {
    position: absolute;
    right: 1rem;
    top: .75rem;
    transform: scale(1);
    transition: transform .9s cubic-bezier(0.5, 0, 0.5, 1)
}

.result-iframe .result-iframe__l-star svg {
    aspect-ratio: 1/1;
    width: auto
}

.result-iframe .iframe {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0 1rem;
    box-sizing: border-box;
    position: relative;
    width: 100%;
    min-height: 15rem;
    border: none;
    background-color: #1e1131;
    border-radius: 2rem;
    overflow: hidden
}

.modal-overlay {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 135
}

.modal-overlay:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .5);
    opacity: 0;
    transition: .6s cubic-bezier(0.23, 1, 0.32, 1)
}

.modal-overlay .modal-wrapper {
    position: relative
}

.modal-overlay .modal-wrapper .result-iframe {
    transform: translateY(1rem);
    opacity: 0;
    transition: transform 1.2s cubic-bezier(0.23, 1, 0.32, 1), opacity 1.2s cubic-bezier(0.23, 1, 0.32, 1);
    margin-top: 0
}

.modal-overlay .modal-wrapper .result-iframe .close {
    position: absolute;
    right: 0;
    top: -0.5rem;
    transform: translate(0, -100%);
    width: 1rem;
    height: 1rem;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer
}

.modal-overlay .modal-wrapper .result-iframe .close::before {
    position: absolute;
    content: "";
    display: block;
    width: 124%;
    height: 1px;
    background-color: #a689d2;
    transform: rotate(-45deg)
}

.modal-overlay .modal-wrapper .result-iframe .close::after {
    position: absolute;
    content: "";
    display: block;
    width: 124%;
    height: 1px;
    background-color: #a689d2;
    transform: rotate(45deg)
}

.modal-overlay .modal-wrapper .result-iframe .iframe {
    overflow-y: auto;
    max-height: 80vh
}

.modal-overlay.-show:before {
    opacity: 1
}

.modal-overlay.-show .modal-wrapper .result-iframe {
    opacity: 1;
    transform: translateZ(0)
}

.result-iframe.-top {
    margin-top: 0 !important
}

.share {
    position: relative;
    z-index: 10;
    margin-top: 4rem;
    margin-left: .5rem;
    margin-right: .5rem;
    padding: 1rem 0 1.5rem;
    border-radius: 2.5rem 1.2rem;
    background-color: #120b1c
}

@media only screen and (min-width: 1024px) {
    .share {
        width: 48.611%;
        margin-left: auto;
        margin-right: auto
    }
}

@media only screen and (min-width: 1440px) {
    .share {
        width: 31.944%
    }
}

.share::before {
    content: "";
    display: block;
    position: absolute;
    top: .5rem;
    left: .5rem;
    right: .5rem;
    bottom: .5rem;
    border-radius: 2rem;
    border: 1px solid #d2a17d;
    opacity: .2
}

.share .close {
    display: none
}

.share .title {
    position: relative;
    text-align: center;
    white-space: pre-wrap
}

.share .buttons {
    margin-top: 1.5rem;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start
}

.share .buttons a {
    position: relative;
    margin: 0 2.17%;
    padding: .35rem 1.25rem;
    border: 1px solid #7b47c9;
    border-radius: 4rem
}

.share .buttons a>svg {
    position: relative;
    width: 2rem;
    aspect-ratio: 1/1;
    fill: #e6f3e8;
    transform: scale(1) translateZ(0);
    transition: transform .6s cubic-bezier(0.23, 1, 0.32, 1);
    will-change: transform
}

.share .buttons a figure {
    position: absolute;
    z-index: 10;
    top: 0;
    right: 0;
    width: 1rem;
    border-radius: 50%;
    background-color: #7b47c9;
    border: 1px solid rgba(0, 0, 0, 0);
    transform: scale(1) translateZ(0);
    transition: transform .6s cubic-bezier(0.23, 1, 0.32, 1);
    will-change: transform;
    pointer-events: none
}

@media only screen and (min-width: 1024px) {
    .share .buttons a figure img {
        width: 1rem;
        height: 1rem
    }
}

@media only screen and (min-width: 1024px) {
    .share .buttons a {
        border: initial
    }

    .share .buttons a::before {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border-radius: 4rem;
        background-color: #7b47c9;
        transform: scale(0.25);
        opacity: 0;
        transition: transform .45s cubic-bezier(0.4, 0.1, 0, 1), opacity .3s cubic-bezier(0.23, 1, 0.32, 1)
    }

    .share .buttons a::after {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border: 1px solid #7b47c9;
        border-radius: 4rem;
        transform: scale(1);
        transition: transform .6s cubic-bezier(0.23, 1, 0.32, 1)
    }

    .share .buttons a:hover::before {
        transform: scale(1);
        opacity: 1;
        transition: transform .3s cubic-bezier(0.23, 1, 0.32, 1), opacity .15s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .share .buttons a:hover::after {
        transform: scale(0.75);
        transition: transform .3s cubic-bezier(0.4, 0.1, 0, 1)
    }

    .share .buttons a:hover svg {
        transform: scale(1.5) translateZ(0)
    }

    .share .buttons a:hover figure {
        border: 1px solid #1e1131;
        transform: scale(1.5) translateZ(0)
    }
}

#share-wrapper .close {
    position: absolute;
    right: 0;
    top: -0.5rem;
    transform: translate(0, -100%);
    width: 2rem;
    height: 2rem;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer
}

#share-wrapper .close::before {
    position: absolute;
    content: "";
    display: block;
    width: 124%;
    height: 1px;
    background-color: #a689d2;
    transform: rotate(-45deg)
}

#share-wrapper .close::after {
    position: absolute;
    content: "";
    display: block;
    width: 124%;
    height: 1px;
    background-color: #a689d2;
    transform: rotate(45deg)
}

.error-404 .page-content {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 80vh;
    margin-top: 10vh
}

.error-404__card {
    position: relative;
    z-index: 3;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 90vw;
    height: 50vh;
    display: flex;
    align-items: center;
    justify-content: center
}

.error-404__card-container {
    position: absolute;
    z-index: 3;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 30%;
    min-width: 8rem;
    animation-name: cardRotate;
    animation-duration: 8s;
    animation-iteration-count: infinite;
    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1);
    perspective: 1200px
}

@media only screen and (min-width: 1024px) {
    .error-404__card-container {
        width: 11.1%;
        max-width: 8rem
    }
}

.error-404__card-container .the-card {
    position: relative;
    animation-name: cardRotateZ;
    animation-duration: 8s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    transform-style: preserve-3d
}

.error-404__card-container .the-card *::-moz-selection {
    background-color: #a689d2
}

.error-404__card-container .the-card *::selection {
    background-color: #a689d2
}

.error-404__card-container .the-card__front {
    position: absolute;
    transform: rotateX(0) rotateY(180deg) scale(1) translateZ(0px);
    width: 100%;
    height: 100%;
    background-color: #f5f5f5;
    border-radius: .35rem;
    overflow: hidden;
    padding: 4.68% 4.68%;
    box-sizing: border-box
}

.error-404__card-container .the-card__front::after {
    content: "";
    display: block;
    position: absolute;
    top: 1.9%;
    bottom: 1.9%;
    left: 3.125%;
    right: 3.125%;
    background-image: linear-gradient(to right bottom, #D2A17D 20%, #49432E 70%, #D2A17D 100%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    padding: 1px;
    border-radius: .25rem;
    opacity: .2
}

.error-404__card-container .the-card__front picture {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: .5rem;
    overflow: hidden;
    transform: translateZ(0)
}

.error-404__card-container .the-card__front picture img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.error-404__card-container .the-card__front .glare {
    position: absolute;
    top: -10%;
    left: -10%;
    width: 120%;
    height: 120%;
    background-image: linear-gradient(to right, rgba(245, 245, 245, 0) 0%, rgba(245, 245, 245, 0.5019607843) 50%, rgba(245, 245, 245, 0) 100%);
    animation-name: cardGlare;
    animation-duration: 8s;
    animation-delay: -6.3s;
    animation-iteration-count: infinite;
    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1)
}

.error-404__card-container .the-card__border {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #786398;
    border-radius: .35rem;
    overflow: hidden
}

.error-404__card-container .the-card__border:nth-child(2) {
    transform: rotateX(0) rotateY(0deg) scale(1) translateZ(0.1px)
}

.error-404__card-container .the-card__border:nth-child(3) {
    transform: rotateX(0) rotateY(0deg) scale(1) translateZ(1.1px)
}

.error-404__card-container .the-card__border:nth-child(4) {
    transform: rotateX(0) rotateY(0deg) scale(1) translateZ(2.1px)
}

.error-404__card-container .the-card__back {
    position: relative;
    background-color: #1e1131;
    transform: rotateX(0) rotateY(0deg) scale(1) translateZ(2.1px);
    border-radius: .35rem;
    overflow: hidden
}

.error-404__card-container .the-card__back .glare {
    position: absolute;
    top: -10%;
    left: 0%;
    width: 100%;
    height: 120%;
    background-image: linear-gradient(to right, rgba(123, 71, 201, 0) 0%, rgba(123, 71, 201, 0.5019607843) 50%, rgba(123, 71, 201, 0) 100%);
    animation-name: cardGlareBack;
    animation-duration: 8s;
    animation-delay: -6.3s;
    animation-iteration-count: infinite;
    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1)
}

@keyframes atom {
    0% {
        transform: rotate(0deg) scale(1)
    }

    50% {
        transform: rotate(-180deg) scale(0.75)
    }

    100% {
        transform: rotate(-360deg) scale(1)
    }
}

@keyframes nucleus {
    0% {
        transform: scale(1)
    }

    25% {
        transform: scale(0.9)
    }

    50% {
        transform: scale(2)
    }

    75% {
        transform: scale(0.85)
    }

    100% {
        transform: scale(1)
    }
}

@keyframes electron {
    0% {
        left: calc(var(--electron-size)/-1);
        transform: scale(1)
    }

    12.5% {
        top: 100%;
        transform: scale(1.5)
    }

    25% {
        left: 100%;
        transform: scale(1)
    }

    37.5% {
        top: 0%;
        transform: scale(0.25)
    }

    50% {
        left: calc(var(--electron-size)/-1);
        transform: scale(1)
    }

    62.5% {
        top: 100%;
        transform: scale(1.5)
    }

    75% {
        left: 100%;
        transform: scale(1)
    }

    87.5% {
        top: 0%;
        transform: scale(0.25)
    }

    100% {
        left: calc(var(--electron-size)/-1);
        transform: scale(1)
    }
}

@keyframes rotate {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(360deg)
    }
}

.button-star {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: .5rem 1rem;
    box-sizing: content-box;
    width: auto
}

.button-star div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10rem;
    transform: translateZ(0) scale(1);
    pointer-events: none;
    transition: transform .3s cubic-bezier(0.4, 0.1, 0, 1)
}

.button-star div span {
    display: block;
    position: absolute;
    z-index: 10;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    opacity: 1;
    transition: opacity .6s cubic-bezier(0.4, 0.1, 0, 1)
}

.button-star div span:first-child {
    width: 100%;
    height: 1px;
    background-image: linear-gradient(to right, rgba(230, 243, 232, 0) 0%, #E6F3E8 50%, rgba(230, 243, 232, 0) 100%)
}

.button-star div span:last-child {
    width: 1px;
    height: 100%;
    background-image: linear-gradient(to bottom, rgba(230, 243, 232, 0) 0%, #E6F3E8 50%, rgba(230, 243, 232, 0) 100%)
}

.button-star span {
    display: block;
    text-transform: uppercase
}

.button-star .basic {
    pointer-events: none;
    opacity: 1;
    position: relative;
    transform: translateZ(0);
    transition: transform .3s cubic-bezier(0.4, 0.1, 0, 1), opacity .3s cubic-bezier(0.4, 0.1, 0, 1)
}

.button-star .hover {
    pointer-events: none;
    opacity: 0;
    position: absolute;
    text-align: center;
    left: 50%;
    top: 50%;
    width: 100%;
    transform: translate(-50%, 30%) scale(1, 0.8);
    transition: transform .6s cubic-bezier(0.23, 1, 0.32, 1), opacity .6s cubic-bezier(0.23, 1, 0.32, 1)
}

@media only screen and (min-width: 1024px) {
    .button-star:hover::before {
        opacity: 0;
        transform: scale(0.95, 0.8)
    }

    .button-star:hover div {
        transform: scale(1.05)
    }

    .button-star:hover div::after {
        transform: scale(1.2)
    }

    .button-star:hover div span {
        opacity: .4
    }

    .button-star:hover .basic {
        opacity: 0;
        transform: translate(0, -20%) scale(0.9)
    }

    .button-star:hover .hover {
        opacity: 1;
        transform: translate(-50%, -50%) translateZ(0) scale(1, 1)
    }
}

.tarot-chat {
    display: flex;
    align-items: center
}

.tarot-chat .s-chat {
    display: flex;
    align-items: stretch;
    padding: 15rem 0 3rem;
    min-height: 600px;
    height: calc(var(--vh, 1vh)*100);
    box-sizing: border-box;
    width: 100%
}

@media only screen and (max-width: 1024px) {
    .tarot-chat .s-chat {
        padding: 7rem 0 2rem;
        margin: auto;
        flex-direction: column
    }
}

.tarot-chat .s-chat .video {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 41.549%;
    margin-right: 1rem
}

@media only screen and (max-width: 1024px) {
    .tarot-chat .s-chat .video {
        width: 100%;
        margin-right: 0rem;
        justify-content: initial
    }
}

.tarot-chat .s-chat .video .video-wrap {
    position: relative;
    display: flex;
    justify-content: center;
    width: 100%;
    flex: 1;
    overflow: hidden;
    height: 65vh;
    padding-bottom: 7rem
}

@media only screen and (max-width: 1024px) {
    .tarot-chat .s-chat .video .video-wrap {
        flex: initial;
        overflow: initial;
        padding-bottom: 0rem
    }
}

.tarot-chat .s-chat .video .video-wrap video {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    mix-blend-mode: lighten
}

@media only screen and (max-width: 1024px) {
    .tarot-chat .s-chat .video .video-wrap video {
        padding-bottom: 2rem;
        max-height: 70vh;
        opacity: 1;
        transform: scale(1);
        transition: .6s cubic-bezier(0.23, 1, 0.32, 1)
    }
}

.tarot-chat .s-chat .video .video-wrap .button.button-purple {
    position: absolute;
    bottom: 0rem
}

@media only screen and (max-width: 1024px) {
    .tarot-chat .s-chat .video .video-wrap .button.button-purple {
        opacity: 1;
        transform: scale(1);
        transition-delay: .15s;
        transition: .6s cubic-bezier(0.23, 1, 0.32, 1)
    }
}

@media only screen and (min-width: 1024px) {
    .tarot-chat .s-chat .video .video-wrap .button.button-purple {
        display: none
    }
}

.tarot-chat .s-chat .video .video-wrap.-hide {
    pointer-events: none
}

.tarot-chat .s-chat .video .video-wrap.-hide video {
    transform: scale(0.9);
    opacity: 0
}

.tarot-chat .s-chat .video .video-wrap.-hide .button.button-purple {
    transform: scale(0.9);
    opacity: 0
}

.tarot-chat .s-chat .video .button.button-outline {
    margin-top: 2rem;
    padding: 1rem .5rem;
    min-width: 9rem
}

@media only screen and (max-width: 1024px) {
    .tarot-chat .s-chat .video .button.button-outline {
        display: none
    }
}

.tarot-chat .s-chat .chat-wrap {
    display: flex;
    flex-direction: column;
    width: 49.295%;
    overflow: hidden;
    position: relative;
    z-index: 2
}

@media only screen and (max-width: 1024px) {
    .tarot-chat .s-chat .chat-wrap {
        top: 9rem;
        left: 0rem;
        width: 100%;
        position: absolute;
        max-height: 62vh;
        height: 100%;
        pointer-events: none
    }
}

.tarot-chat .s-chat .chat-wrap .messages {
    position: relative;
    padding: .5rem 0;
    flex: 1;
    overflow: hidden;
    border-radius: 2.5rem;
    background-color: #120b1c
}

@media only screen and (max-width: 1024px) {
    .tarot-chat .s-chat .chat-wrap .messages {
        transform: scale(0.9);
        opacity: 0;
        transition: .6s cubic-bezier(0.23, 1, 0.32, 1);
        transition-delay: .6s;
        padding: .25rem 0;
        border-radius: initial
    }
}

.tarot-chat .s-chat .chat-wrap .messages:before {
    content: "";
    display: block;
    position: absolute;
    top: .5rem;
    left: .5rem;
    right: .5rem;
    bottom: .5rem;
    border-radius: 2rem;
    border: 1px solid #d2a17d;
    opacity: .2;
    pointer-events: none
}

@media only screen and (max-width: 1024px) {
    .tarot-chat .s-chat .chat-wrap .messages:before {
        top: .25rem;
        left: .25rem;
        right: .25rem;
        bottom: .25rem;
        border-radius: 2.5rem;
        content: none
    }
}

.tarot-chat .s-chat .chat-wrap .messages .magic-dust {
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 75%;
    height: 10rem;
    transform: translate(-50%, 0);
    pointer-events: none
}

.tarot-chat .s-chat .chat-wrap .messages .messages-scroll {
    position: relative;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    height: 100%;
    border-radius: 2rem;
    margin-left: .5rem;
    margin-right: .5rem
}

@media only screen and (max-width: 1024px) {
    .tarot-chat .s-chat .chat-wrap .messages .messages-scroll {
        border-radius: 2.5rem;
        margin-left: .25rem;
        margin-right: .25rem
    }
}

.tarot-chat .s-chat .chat-wrap .messages .messages-scroll .messages-list {
    padding: 1rem 0
}

.tarot-chat .s-chat .chat-wrap .messages .messages-scroll .messages-list.-typing {
    padding-bottom: 6rem
}

.tarot-chat .s-chat .chat-wrap .messages .message {
    position: relative;
    display: flex;
    align-items: flex-start;
    padding: .25rem;
    transform: translateY(1rem);
    opacity: 0;
    transition: .3s cubic-bezier(0.23, 1, 0.32, 1)
}

.tarot-chat .s-chat .chat-wrap .messages .message .avatar-user {
    position: relative;
    width: 6rem;
    height: 6rem;
    max-width: 6rem;
    max-height: 6rem;
    min-width: 6rem;
    min-height: 6rem
}

@media only screen and (max-width: 1024px) {
    .tarot-chat .s-chat .chat-wrap .messages .message .avatar-user {
        width: 4rem;
        height: 4rem;
        max-width: 4rem;
        max-height: 4rem;
        min-width: 4rem;
        min-height: 4rem
    }
}

.tarot-chat .s-chat .chat-wrap .messages .message .avatar-user img {
    position: relative;
    border-radius: 50%;
    top: 10%;
    left: 10%;
    width: 80%;
    height: 80%;
    -o-object-fit: contain;
    object-fit: contain
}

.tarot-chat .s-chat .chat-wrap .messages .message .avatar-user:after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 90%;
    height: 90%;
    border-radius: 50%;
    background: linear-gradient(#110a1a, #120b1a) padding-box, linear-gradient(135deg, rgb(238, 219, 113) 0%, rgb(216, 180, 62) 32%, rgb(73, 67, 46) 71%, rgb(216, 180, 62) 100%) border-box;
    border-radius: 50em;
    border: 1px solid rgba(0, 0, 0, 0);
    opacity: .2;
    transform: translate(-50%, -50%)
}

.tarot-chat .s-chat .chat-wrap .messages .message .avatar-user:before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    height: 1px;
    background: linear-gradient(135deg, rgb(238, 219, 113) 0%, rgb(216, 180, 62) 32%, rgb(73, 67, 46) 71%, rgb(216, 180, 62) 100%);
    transform: translateY(-50%);
    opacity: .2;
    z-index: 3
}

.tarot-chat .s-chat .chat-wrap .messages .message .avatar {
    position: relative;
    width: 6rem;
    height: 6rem
}

@media only screen and (max-width: 1024px) {
    .tarot-chat .s-chat .chat-wrap .messages .message .avatar {
        width: 3.2rem;
        height: 3.2rem
    }
}

.tarot-chat .s-chat .chat-wrap .messages .message .avatar:after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 90%;
    height: 90%;
    border-radius: 50%;
    background: linear-gradient(#110a1a, #120b1a) padding-box, linear-gradient(135deg, rgb(238, 219, 113) 0%, rgb(216, 180, 62) 32%, rgb(73, 67, 46) 71%, rgb(216, 180, 62) 100%) border-box;
    border-radius: 50em;
    border: 1px solid rgba(0, 0, 0, 0);
    opacity: .2;
    transform: translate(-50%, -50%)
}

.tarot-chat .s-chat .chat-wrap .messages .message .avatar:before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    height: 1px;
    background: linear-gradient(135deg, rgb(238, 219, 113) 0%, rgb(216, 180, 62) 32%, rgb(73, 67, 46) 71%, rgb(216, 180, 62) 100%);
    transform: translateY(-50%);
    opacity: .2;
    z-index: 3
}

.tarot-chat .s-chat .chat-wrap .messages .message .avatar .star {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 80%;
    height: 80%;
    border-radius: 50%;
    z-index: 2;
    transform: translate(-50%, -50%)
}

.tarot-chat .s-chat .chat-wrap .messages .message .avatar .star img {
    animation-name: logoRotate;
    animation-duration: 24s;
    animation-iteration-count: infinite;
    animation-timing-function: linear
}

.tarot-chat .s-chat .chat-wrap .messages .message .avatar>img {
    position: absolute;
    width: 50%;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 3
}

.tarot-chat .s-chat .chat-wrap .messages .message .avatar.-assistant .star {
    background-color: #120b1c
}

.tarot-chat .s-chat .chat-wrap .messages .message .avatar.-assistant .star img {
    animation-name: logoRotateReverse
}

.tarot-chat .s-chat .chat-wrap .messages .message .avatar.-user .star {
    background-color: #442474
}

.tarot-chat .s-chat .chat-wrap .messages .message .avatar.-user .star img {
    animation-name: logoRotate
}

.tarot-chat .s-chat .chat-wrap .messages .message .message-text-wrap {
    position: relative;
    max-width: 60%
}

@media only screen and (max-width: 1024px) {
    .tarot-chat .s-chat .chat-wrap .messages .message .message-text-wrap {
        max-width: 75%
    }
}

.tarot-chat .s-chat .chat-wrap .messages .message .message-text {
    position: relative;
    margin-top: .5rem;
    padding: 1rem 1.25rem;
    color: #e6f3e8;
    z-index: 2;
    transition: .6s cubic-bezier(0.23, 1, 0.32, 1)
}

.tarot-chat .s-chat .chat-wrap .messages .message .message-text * {
    font-size: .7rem
}

.tarot-chat .s-chat .chat-wrap .messages .message .message-text p,
.tarot-chat .s-chat .chat-wrap .messages .message .message-text h1,
.tarot-chat .s-chat .chat-wrap .messages .message .message-text h2,
.tarot-chat .s-chat .chat-wrap .messages .message .message-text h3,
.tarot-chat .s-chat .chat-wrap .messages .message .message-text h4,
.tarot-chat .s-chat .chat-wrap .messages .message .message-text ul,
.tarot-chat .s-chat .chat-wrap .messages .message .message-text ol {
    margin-top: .3rem;
    margin-bottom: .3rem
}

.tarot-chat .s-chat .chat-wrap .messages .message .message-text li {
    display: none
}

.tarot-chat .s-chat .chat-wrap .messages .message .message-text>*:first-child {
    margin-top: 0
}

@media only screen and (max-width: 1024px) {
    .tarot-chat .s-chat .chat-wrap .messages .message .message-text {
        padding: .5rem .5rem
    }

    .tarot-chat .s-chat .chat-wrap .messages .message .message-text * {
        font-size: .8rem
    }

    .tarot-chat .s-chat .chat-wrap .messages .message .message-text p,
    .tarot-chat .s-chat .chat-wrap .messages .message .message-text h1,
    .tarot-chat .s-chat .chat-wrap .messages .message .message-text h2,
    .tarot-chat .s-chat .chat-wrap .messages .message .message-text h3,
    .tarot-chat .s-chat .chat-wrap .messages .message .message-text h4,
    .tarot-chat .s-chat .chat-wrap .messages .message .message-text ul,
    .tarot-chat .s-chat .chat-wrap .messages .message .message-text ol {
        margin-top: .3rem;
        margin-bottom: .3rem
    }

    .tarot-chat .s-chat .chat-wrap .messages .message .message-text li {
        display: none
    }

    .tarot-chat .s-chat .chat-wrap .messages .message .message-text>*:first-child {
        margin-top: 0
    }
}

.tarot-chat .s-chat .chat-wrap .messages .message .message-text .word {
    display: inline-block;
    transition: opacity .3s cubic-bezier(0.23, 1, 0.32, 1), color .3s .15s cubic-bezier(0.23, 1, 0.32, 1), transform .3s cubic-bezier(0.23, 1, 0.32, 1)
}

.tarot-chat .s-chat .chat-wrap .messages .message.-show {
    transform: translateY(0rem);
    opacity: 1
}

.tarot-chat .s-chat .chat-wrap .messages .message.-user {
    margin-left: auto;
    flex-direction: row-reverse
}

.tarot-chat .s-chat .chat-wrap .messages .message.-user .message-text {
    border-radius: .5rem 0rem .5rem .5rem;
    margin-right: .5rem;
    background-color: #442474;
    color: #e6f3e8
}

.tarot-chat .s-chat .chat-wrap .messages .message.-assistant .message-text {
    border-radius: 0rem .5rem .5rem .5rem;
    margin-left: .5rem;
    background-color: #7b47c9;
    color: #e6f3e8
}

.tarot-chat .s-chat .chat-wrap .messages .message.-typing .message-text {
    width: 3rem;
    border-radius: 0rem .5rem .5rem .5rem;
    margin-left: .5rem;
    background-color: #7b47c9;
    padding: .5rem 1.25rem;
    font-size: .8rem;
    color: #e6f3e8
}

.tarot-chat .s-chat .chat-wrap .input {
    display: flex;
    position: relative;
    align-items: center;
    padding: 0 1rem;
    border-radius: 2.5rem 1.2rem;
    background-color: #120b1c
}

@media only screen and (max-width: 1024px) {
    .tarot-chat .s-chat .chat-wrap .input {
        transform: scale(0.9);
        opacity: 0;
        transition: .6s cubic-bezier(0.23, 1, 0.32, 1);
        transition-delay: .75s;
        border-radius: initial;
        border-top: 1px solid rgba(210, 161, 125, .1254901961)
    }
}

.tarot-chat .s-chat .chat-wrap .input:before {
    content: "";
    display: block;
    position: absolute;
    top: .5rem;
    left: .5rem;
    right: .5rem;
    bottom: .5rem;
    border-radius: 2rem;
    border: 1px solid #d2a17d;
    opacity: .2;
    pointer-events: none
}

@media only screen and (max-width: 1024px) {
    .tarot-chat .s-chat .chat-wrap .input:before {
        content: none;
        top: .25rem;
        left: .25rem;
        right: .25rem;
        bottom: .25rem;
        border-radius: 2.5rem
    }
}

.tarot-chat .s-chat .chat-wrap .input input {
    flex: 1;
    padding: 1.5rem 1.5rem 1.5rem 1rem;
    color: #a689d2;
    font-family: 'system-ui', sans-serif
}

.tarot-chat .s-chat .chat-wrap .input input::-moz-placeholder {
    color: #a689d2;
    font-family: 'system-ui', sans-serif;
    opacity: .5
}

.tarot-chat .s-chat .chat-wrap .input input::placeholder {
    color: #a689d2;
    font-family: 'system-ui', sans-serif;
    opacity: .5
}

.tarot-chat .s-chat .chat-wrap .counter-messages {
    text-align: center
}

.tarot-chat .s-chat .chat-wrap .counter {
    padding: .5rem 2rem
}

.tarot-chat .s-chat .chat-wrap.-show {
    pointer-events: all
}

.tarot-chat .s-chat .chat-wrap.-show .messages {
    opacity: 1;
    transform: scale(1)
}

.tarot-chat .s-chat .chat-wrap.-show .input {
    opacity: 1;
    transform: scale(1)
}

@media only screen and (max-width: 1024px) {
    .tarot-chat-container .tarot-aside-ad {
        margin-top: 3rem
    }
}

.tarot-chat-container .about {
    position: relative;
    z-index: 3;
    margin-top: 4rem;
    margin-left: 2rem;
    margin-right: 2rem;
    transform: translateZ(0);
    opacity: 1;
    transition: transform 1.2s cubic-bezier(0.4, 0.1, 0, 1), opacity 1.2s cubic-bezier(0.4, 0.1, 0, 1);
    will-change: transform, opacity
}

.tarot-chat-container .about *::-moz-selection {
    background-color: #a689d2
}

.tarot-chat-container .about *::selection {
    background-color: #a689d2
}

@media only screen and (min-width: 1024px) {
    .tarot-chat-container .about {
        width: 31.944%;
        margin-top: 6rem;
        margin-left: auto;
        margin-right: auto
    }
}

.tarot-chat-container .about.-hidden {
    transform: translate(0, 4rem);
    opacity: 0
}

.tarot-chat-container .about__title {
    text-align: center;
    white-space: pre-wrap;
    margin-bottom: 2rem
}

.tarot-chat-container .about__subtitle {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    margin-top: -1rem;
    margin-bottom: 2rem
}

.tarot-chat-container .about__caption {
    width: 69.56%;
    margin-bottom: 1rem;
    color: #e6f3e8
}

.tarot-chat-container .about__caption:nth-child(2n) {
    margin-left: 26.087%
}

.tarot-chat-container .about.-withad {
    margin-top: 16rem
}

@media only screen and (min-width: 1024px) {
    .tarot-chat-container .about.-withad {
        margin-top: 6rem
    }
}

.tarot-chat-container .about.-done {
    margin: 0
}

.tarot-chat-container .feel {
    margin-top: 4rem;
    position: relative;
    z-index: 3;
    transform: translateZ(0);
    opacity: 1;
    transition: transform 1.2s cubic-bezier(0.4, 0.1, 0, 1), opacity 1.2s cubic-bezier(0.4, 0.1, 0, 1);
    will-change: transform, opacity
}

.tarot-chat-container .feel *::-moz-selection {
    background-color: #a689d2
}

.tarot-chat-container .feel *::selection {
    background-color: #a689d2
}

.tarot-chat-container .feel.-hidden {
    transform: translate(0, 4rem);
    opacity: 0
}

.tarot-chat-container .feel__subtitle {
    text-align: center;
    white-space: pre-wrap;
    max-width: 60%;
    margin-left: auto;
    margin-right: auto
}

.tarot-chat-container .feel #anchor-target {
    position: absolute;
    top: 40%;
    right: 0;
    bottom: auto;
    left: 0;
    margin-left: auto;
    margin-right: auto
}

.tarot-chat-container .feel .grid {
    margin-top: 1.5rem;
    margin-left: .25rem;
    margin-right: .25rem;
    position: relative
}

@media only screen and (min-width: 1024px) {
    .tarot-chat-container .feel .grid {
        width: 81.944%;
        margin-left: auto;
        margin-right: auto
    }
}

.tarot-chat-container .feel .grid::before {
    content: "";
    display: block;
    position: absolute;
    top: -1rem;
    left: 50%;
    width: 1px;
    height: 100%;
    padding: 1rem 0;
    box-sizing: initial;
    background-image: linear-gradient(to bottom, rgba(166, 137, 210, 0) 0%, #A689D2 50%, rgba(166, 137, 210, 0) 100%)
}

.tarot-chat-container .feel .row {
    position: relative;
    display: flex
}

.tarot-chat-container .feel .row::before {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: 0%;
    width: 100%;
    height: 1px;
    background-image: linear-gradient(to right, rgba(166, 137, 210, 0) 0%, #A689D2 50%, rgba(166, 137, 210, 0) 100%)
}

.tarot-chat-container .feel .row:last-child::before {
    content: none
}

.tarot-chat-container .feel .row-item {
    width: 50%;
    padding: 1.5rem 0;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center
}

@media only screen and (min-width: 1024px) {
    .tarot-chat-container .feel .row-item {
        padding: 3rem 0
    }
}

.tarot-chat-container .feel .row-item p {
    color: #d2a17d;
    margin: 0 1.5rem
}

@media only screen and (min-width: 1024px) {
    .tarot-chat-container .feel .row-item p {
        margin: 0 .5rem
    }
}

.tarot-chat-container .feel .icon-row {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 0
}

.tarot-chat-container .feel .icon-wrap {
    background-color: #1e1131;
    padding: .25rem;
    border-radius: 50%
}

.tarot-chat-container .feel.-done {
    margin: 0
}

.infotip {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    background-color: #442474;
    color: #e6f3e8;
    cursor: pointer
}

.infotip::after {
    pointer-events: none;
    position: absolute;
    content: attr(data-tooltip);
    bottom: calc(100% + .5rem);
    left: 50%;
    right: 0;
    max-width: 12rem;
    width: -moz-max-content;
    width: max-content;
    font-size: .75rem;
    padding: .5rem .5rem;
    background-color: #442474;
    border-radius: 8px;
    color: #e6f3e8;
    opacity: 0;
    transform: translate(-50%, 1rem) scale(0.3);
    transition: .3s cubic-bezier(0.23, 1, 0.32, 1)
}

.infotip.-show::after {
    pointer-events: all;
    opacity: 1;
    transform: translate(-50%, 0rem) scale(1)
}

@keyframes flyXYOpacity {
    0% {
        transform: translate(0%, 0.5rem);
        opacity: 0
    }

    50% {
        transform: translate(50%, 0.25rem);
        opacity: 1
    }

    100% {
        transform: translate(100%, 0rem);
        opacity: 0
    }
}

.results .results__row .word {
    position: relative;
    display: inline-block;
    filter: blur(calc(var(--result-blur) * 1px));
    opacity: 0;
    transform: scale(1.5) translateY(1rem);
    transition: calc(1ms*var(--result-speed)) cubic-bezier(0.23, 1, 0.32, 1);
    transition-delay: calc(var(--word-index)/10*1ms*var(--result-delay) + .3s)
}

.results .results__row .word .char {
    position: relative;
    display: inline-block;
    opacity: 0;
    transform: scale(1.25) translate(calc(var(--char-random-value) * 1rem), 0.25rem);
    transition: calc(1ms*var(--result-speed)) cubic-bezier(0.23, 1, 0.32, 1);
    transition-delay: calc(var(--char-global-index)/10*1ms*var(--result-delay) + .15s)
}

.results .results__row .word label {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    opacity: 0;
    animation-delay: calc(1ms*(var(--last-word-global-count) - 1)*var(--result-speed)/10);
    animation-duration: calc(1ms*var(--result-speed)*var(--chars-count)/10);
    animation-iteration-count: 1;
    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1)
}

.results .results__row .word label::before {
    content: "";
    display: block;
    position: absolute;
    top: .5rem;
    width: .125rem;
    height: .125rem;
    border-radius: 50%;
    background-color: #e6f3e8;
    box-shadow: 0 0 .5rem .25rem #e6f3e8;
    transform-origin: 1rem 1rem;
    transform: rotate(0deg) translateY(0);
    opacity: 1;
    animation-name: flyZ;
    animation-duration: calc(1ms*var(--result-speed));
    animation-iteration-count: 1;
    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1)
}

.results .results__row.-show-words .word {
    display: inline-block;
    opacity: 1;
    filter: blur(0px);
    transform: scale(1) translateY(0rem)
}

.results .results__row.-show-words .word label {
    animation-name: flyXYOpacity
}

.results .results__row.-show-words .word .char {
    opacity: 1;
    transform: scale(1) translateY(0rem)
}

/*# sourceMappingURL=style.min.css.map */