@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root {
    --bg: #09090b;
    --surface: #111115;
    --surface-2: #151419;
    --line: #302d33;
    --line-soft: #252329;
    --text: #f2edf0;
    --muted: #918b93;
    --dim: #67626a;
    --pink: #dc759d;
    --pink-deep: #2b171f;
    --red: #df5147;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    background: var(--bg);
    color: var(--text);
    font-family: 'Space Grotesk',sans-serif;
}

a {
    color: inherit;
}

.brand {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    font-weight: 700;
    letter-spacing: -.035em;
}

.brand img,.hero-cat {
    filter: brightness(0) saturate(100%) invert(63%) sepia(30%) saturate(968%) hue-rotate(290deg) brightness(95%) contrast(87%);
}

.brand img {
    width: 27px;
    height: 27px;
}

header {
    height: 64px;
    padding: 0 max(24px,5vw);
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
}

nav {
    display: flex;
    gap: 23px;
    padding: 7px 10px;
    border: 1px solid var(--line-soft);
    border-radius: 999px;
    background: var(--surface);
}

nav a,.status,.eyebrow,.hero a,.section-title>p,.player-meta,.player-info>a,.release>div>p,footer,.sponsor-label {
    font-size: 10px;
    letter-spacing: .055em;
    text-transform: lowercase;
}

nav a {
    padding: 4px 9px;
    color: var(--muted);
    text-decoration: none;
    border-radius: 999px;
    transition: .2s;
}

nav a:hover {
    color: var(--text);
    background: #1b191e;
}

.status {
    justify-self: end;
    color: var(--muted);
    display: flex;
    align-items: center;
    gap: 8px;
}

.status i {
    width: 6px;
    height: 6px;
    background: var(--pink);
    border-radius: 50%;
    box-shadow: 0 0 15px #dc759d75;
}

main>section,footer {
    margin-left: max(20px,3vw);
    margin-right: max(20px,3vw);
}

.hero {
    height: 520px;
    padding: 60px max(28px,4vw);
    display: grid;
    grid-template-columns: 1.2fr .8fr;
    align-items: center;
    gap: 6vw;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: radial-gradient(circle at 84% 50%,#2a171f 0,transparent 31%),linear-gradient(125deg,#121116,#0d0d10);
    overflow: hidden;
}

.eyebrow,.section-title>p,.release>div>p {
    color: var(--pink);
    margin: 0 0 22px;
}

.hero h1 {
    font-size: clamp(66px,8vw,122px);
    line-height: .88;
    letter-spacing: -.075em;
    font-weight: 600;
    margin: 0;
}

.hero h1 span {
    color: var(--pink);
}

.lead {
    max-width: 510px;
    margin: 27px 0;
    color: var(--muted);
    font-size: 15px;
    line-height: 1.65;
}

.hero a {
    text-underline-offset: 6px;
}

.hero-cat {
    width: min(27vw,320px);
    height: min(27vw,320px);
    object-fit: contain;
    justify-self: end;
    filter: brightness(0) saturate(100%) invert(63%) sepia(30%) saturate(968%) hue-rotate(290deg) brightness(95%) contrast(87%) drop-shadow(0 22px 45px #dc759d22);
}

.sponsors {
    height: 112px!important;
    margin-top: 18px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--surface);
    overflow: hidden;
    position: relative;
    display: flex;
    flex-direction: column;
}

.sponsor-label {
    height: 30px;
    min-height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--dim);
    border-bottom: 1px solid var(--line-soft);
}

.sponsor-track {
    height: 81px;
    min-height: 81px;
    display: flex;
    width: max-content;
    animation: move 30s linear infinite;
}

.sponsor-group {
    height: 81px;
    display: flex;
    align-items: center;
    gap: 0;
    padding: 0 34px;
    flex: none;
}

.sponsor-group img {
    display: block;
    width: auto;
    height: 46px;
    max-width: 155px;
    margin: 0;
    padding: 0;
    object-fit: contain;
    flex: none;
    filter: grayscale(1) brightness(0) invert(40%);
    opacity: 1;
}

.sponsor-group .sep {
    display: block;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #4d4951;
    flex: none;
    margin: 0 42px;
}

.sponsors:before,.sponsors:after {
    content: "";
    position: absolute;
    z-index: 2;
    top: 30px;
    bottom: 0;
    width: 7vw;
    pointer-events: none;
}

.sponsors:before {
    left: 0;
    background: linear-gradient(90deg,var(--surface),transparent);
}

.sponsors:after {
    right: 0;
    background: linear-gradient(-90deg,var(--surface),transparent);
}

@keyframes move {
    to {
        transform: translateX(-50%);
    }
}

.sponsors:hover .sponsor-track {
    animation-play-state: paused;
}

.features {
    margin-top: 18px;
    padding: 72px max(28px,4vw);
    border: 1px solid var(--line);
    border-radius: 18px;
    background: radial-gradient(circle at 10% 0,#21131a 0,transparent 26%),var(--surface);
}

.section-title {
    display: grid;
    grid-template-columns: .5fr 1.5fr;
    margin-bottom: 52px;
}

.section-title h2 {
    font-size: clamp(40px,5vw,70px);
    line-height: .98;
    letter-spacing: -.055em;
    font-weight: 500;
    margin: 0;
}

.technical-copy {
    margin-left: 25%;
    padding: 32px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: var(--surface-2);
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5vw;
}

.technical-copy p {
    font-size: 14px;
    line-height: 1.75;
    color: var(--muted);
    margin: 0;
}

.technical-copy p:first-child {
    color: #b8b2b8;
}

.player {
    margin-top: 18px;
    padding: 74px max(28px,4vw);
    display: grid;
    grid-template-columns: 196px 1fr;
    gap: 6vw;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: radial-gradient(circle at 10% 50%,#281720 0,transparent 29%),linear-gradient(120deg,#111015,#0c0c0f);
}

.avatar {
    width: 196px;
    height: 196px;
    padding: 5px;
    border-radius: 50%;
    object-fit: cover;
    background: var(--surface-2);
    border: 1px solid #3a343b;
    box-shadow: 0 24px 70px #0008;
}

.player-info {
    max-width: 920px;
}

.player-info h2 {
    font-size: 48px;
    line-height: 1;
    letter-spacing: -.045em;
    font-weight: 600;
    margin: 0 0 13px;
}

.player-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin: 0 0 34px;
}

.faceit-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #151416;
    color: #aaa5aa;
    border: 1px solid #3a3032;
    border-radius: 999px;
    padding: 4px 5px 4px 11px;
    font-size: 9px;
    font-weight: 500;
}

.faceit-badge b {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: var(--red);
    color: #fff;
    font-size: 12px;
    line-height: 1;
    box-shadow: 0 0 16px #df514744;
}

.country {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--muted);
    font-size: 10px;
}

.country img {
    width: 20px;
    height: 14px;
    border-radius: 2px;
    object-fit: cover;
}

.player blockquote {
    position: relative;
    max-width: 880px;
    margin: 0 0 30px;
    padding-left: 24px;
    border-left: 2px solid var(--pink);
    font-size: clamp(27px,3.4vw,48px);
    line-height: 1.08;
    letter-spacing: -.045em;
    font-weight: 500;
}

.player-info>a {
    display: inline-block;
    color: #aaa5ab;
    text-decoration: none;
    border-bottom: 1px solid #514c53;
    padding-bottom: 3px;
}

.player-info>a:hover {
    color: var(--text);
    border-color: var(--pink);
}

.release {
    margin-top: 18px;
    padding: 70px max(28px,4vw);
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    gap: 8vw;
    align-items: end;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: radial-gradient(circle at 82% 100%,#2a171f 0,transparent 30%),var(--surface);
}

.release h2 {
    font-size: clamp(42px,5.6vw,78px);
    line-height: .95;
    letter-spacing: -.06em;
    font-weight: 500;
    margin: 0;
}

.release h2 span {
    color: var(--pink);
}

.release>p {
    max-width: 450px;
    margin: 0;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.7;
}

footer {
    height: 86px;
    padding: 0 max(8px,1vw);
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: var(--dim);
}

footer .brand {
    font-size: 15px;
    color: var(--text);
    text-transform: none;
}

footer p {
    margin: 0;
}

@media(max-width:800px) {
    header {
        grid-template-columns: 1fr auto;
    }

    .status {
        display: none;
    }

    nav {
        gap: 8px;
    }

    .hero {
        height: 490px;
    }

    .hero-cat {
        position: absolute;
        right: 7vw;
        width: 40vw;
        height: 40vw;
        opacity: .25;
    }

    .hero>div {
        position: relative;
        z-index: 1;
    }

    .section-title {
        grid-template-columns: 1fr;
    }

    .section-title>p {
        margin-bottom: 18px;
    }

    .technical-copy {
        margin-left: 0;
    }

    .player {
        grid-template-columns: 150px 1fr;
    }

    .avatar {
        width: 150px;
        height: 150px;
    }

    .release {
        grid-template-columns: 1fr;
        align-items: start;
    }
}

@media(max-width:520px) {
    header {
        padding: 0 20px;
    }

    .brand span {
        display: none;
    }

    nav a:nth-child(n+3) {
        display: none;
    }

    main>section,footer {
        margin-left: 12px;
        margin-right: 12px;
    }

    .hero {
        height: 440px;
        padding: 48px 22px;
    }

    .hero h1 {
        font-size: 17vw;
    }

    .hero-cat {
        width: 64vw;
        height: 64vw;
        right: -8vw;
    }

    .sponsors {
        height: 104px!important;
    }

    .sponsor-track,.sponsor-group {
        height: 73px;
    }

    .sponsor-group {
        padding: 0 24px;
    }

    .sponsor-group img {
        height: 40px;
        max-width: 130px;
    }

    .sponsor-group .sep {
        margin: 0 30px;
    }

    .features,.player,.release {
        padding: 54px 22px;
    }

    .technical-copy {
        grid-template-columns: 1fr;
        padding: 23px;
        gap: 22px;
    }

    .player {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .avatar {
        width: 112px;
        height: 112px;
    }

    .player-info h2 {
        font-size: 38px;
    }

    .player blockquote {
        padding-left: 18px;
        font-size: 27px;
    }

    .release {
        gap: 35px;
    }

    footer {
        height: auto;
        padding: 30px 10px;
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    footer .brand span {
        display: block;
    }
}

body .features {
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    gap: 8vw;
    align-items: end;
}

body .features .section-title {
    display: block;
    margin: 0;
}

body .features .section-title h2 {
    font-size: clamp(42px,5.6vw,78px);
    line-height: .95;
    letter-spacing: -.06em;
}

body .features .technical-copy {
    display: block;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
}

body .features .technical-copy p {
    font-size: 13px;
    line-height: 1.7;
    color: var(--muted);
}

body .features .technical-copy p:first-child {
    color: var(--muted);
    margin-bottom: 18px;
}

@media(max-width:800px) {
    body .features {
        grid-template-columns: 1fr;
        align-items: start;
    }

    body .features .technical-copy {
        margin-top: 35px;
    }
}

body .sponsors .sponsor-label {
    border-bottom: 0!important;
}

body footer {
    height: auto;
    min-height: 118px;
    padding-top: 27px;
    padding-bottom: 27px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    text-align: center;
}

body footer .brand {
    font-size: 17px;
}

body footer .brand img {
    width: 30px;
    height: 30px;
}

body footer>div {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: var(--dim);
}

body footer>div i {
    display: block;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: #4d4951;
}

body footer>div p {
    margin: 0;
}

@media(max-width:520px) {
    body footer {
        align-items: center!important;
        gap: 14px!important;
        text-align: center!important;
    }

    body footer .brand span {
        display: block!important;
    }

    body footer>div {
        flex-wrap: wrap;
    }
}

body main {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(0,1fr);
    column-gap: 18px;
    padding-left: max(20px,3vw);
    padding-right: max(20px,3vw);
}

body main>section {
    margin-left: 0;
    margin-right: 0;
}

body main>.hero {
    grid-column: 1/-1;
    grid-row: 1;
}

body main>.sponsors {
    grid-column: 1/-1;
    grid-row: 2;
}

body main>.features {
    grid-column: 1;
    grid-row: 3;
}

body main>.release {
    grid-column: 2;
    grid-row: 3;
}

body main>.player {
    grid-column: 1/-1;
    grid-row: 4;
}

body main>.features,body main>.release {
    min-height: 440px;
    padding: 58px max(28px,4vw);
    align-content: space-between;
}

body main>.features {
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

body main>.features .section-title {
    display: block;
    margin: 0;
}

body main>.features .section-title h2,body main>.release h2 {
    font-size: clamp(40px,4.4vw,64px);
    line-height: .96;
}

body main>.features .technical-copy {
    margin: 42px 0 0;
    display: block;
}

body main>.features .technical-copy p {
    font-size: 12px;
    line-height: 1.65;
}

body main>.features .technical-copy p:first-child {
    margin-bottom: 15px;
}

body main>.release {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: space-between;
    gap: 42px;
}

body main>.release>p {
    font-size: 12px;
    line-height: 1.65;
}

@media(max-width:900px) {
    body main {
        grid-template-columns: 1fr;
    }

    body main>.features {
        grid-column: 1;
        grid-row: 3;
    }

    body main>.release {
        grid-column: 1;
        grid-row: 4;
    }

    body main>.player {
        grid-column: 1;
        grid-row: 5;
    }

    body main>.features,body main>.release {
        min-height: 0;
    }
}

body header {
    grid-template-columns: 1fr 1fr;
}

body .header-note {
    justify-self: end;
    color: var(--dim);
    font-size: 10px;
    letter-spacing: .055em;
    text-transform: lowercase;
}

@media(max-width:520px) {
    body .header-note {
        font-size: 9px;
    }
}

body header {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.hero-actions {
    display: flex;
    align-items: center;
    gap: 22px;
}

.hero-actions a {
    font-size: 10px;
    text-decoration: none;
}

.hero-actions .primary-link {
    display: inline-flex;
    align-items: center;
    background: var(--pink);
    color: #130d10;
    border-radius: 999px;
    padding: 11px 16px;
    font-weight: 600;
}

.hero-actions a:not(.primary-link) {
    color: var(--muted);
    border-bottom: 1px solid #4a464d;
    padding-bottom: 3px;
}

body main>.download {
    grid-column: 1/-1;
    grid-row: 4;
}

body main>.player {
    grid-row: 5;
}

.download {
    margin-top: 18px;
    padding: 68px max(28px,4vw);
    display: grid;
    grid-template-columns: 1.2fr .8fr;
    gap: 8vw;
    align-items: end;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: radial-gradient(circle at 10% 100%,#341b26 0,transparent 34%),linear-gradient(120deg,#161118,#0e0e11);
}

.download>div:first-child>p {
    font-size: 10px;
    letter-spacing: .055em;
    color: var(--pink);
    margin: 0 0 20px;
}

.download h2 {
    font-size: clamp(48px,6.5vw,92px);
    line-height: .94;
    letter-spacing: -.065em;
    font-weight: 500;
    margin: 0 0 20px;
}

.download>div:first-child>span {
    font-size: 11px;
    color: var(--muted);
}

.download-side dl {
    margin: 0 0 24px;
    border-top: 1px solid var(--line);
}

.download-side dl>div {
    display: flex;
    justify-content: space-between;
    padding: 12px 0;
    border-bottom: 1px solid var(--line);
    font-size: 10px;
}

.download-side dt {
    color: var(--muted);
}

.download-side dd {
    margin: 0;
    color: #c0bbc0;
}

.download-side button {
    width: 100%;
    height: 46px;
    border: 1px solid #39353b;
    border-radius: 9px;
    background: #19171b;
    color: #69656c;
    font: 600 10px 'Space Grotesk';
    letter-spacing: .04em;
    cursor: not-allowed;
}

.download-side button i {
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #5a555c;
    margin-right: 8px;
}

@media(max-width:900px) {
    body main>.download {
        grid-column: 1;
        grid-row: 5;
    }

    body main>.player {
        grid-column: 1;
        grid-row: 6;
    }

    .download {
        grid-template-columns: 1fr;
        align-items: start;
        gap: 45px;
    }
}

@media(max-width:520px) {
    .hero-actions {
        gap: 15px;
    }

    .download {
        padding: 54px 22px;
    }

    .download h2 {
        font-size: 15vw;
    }
}

html body main>.download {
    grid-column: 1/-1!important;
    grid-row: 4!important;
}

html body main>.player {
    grid-column: 1/-1!important;
    grid-row: 5!important;
}

@media(max-width:900px) {
    html body main>.download {
        grid-column: 1!important;
        grid-row: 5!important;
    }

    html body main>.player {
        grid-column: 1!important;
        grid-row: 6!important;
    }
}

.feature-lines {
    margin-top: 40px;
    border-top: 1px solid var(--line);
}

.feature-lines>div {
    display: grid;
    grid-template-columns: .8fr 1.2fr;
    gap: 18px;
    padding: 14px 0;
    border-bottom: 1px solid var(--line);
}

.feature-lines strong {
    font-size: 12px;
    font-weight: 500;
    color: #d5cfd4;
}

.feature-lines span {
    font-size: 11px;
    color: var(--muted);
}

.technology-copy {
    margin-top: auto;
}

.technology-copy>p {
    font-size: 12px;
    line-height: 1.65;
    color: var(--muted);
    margin: 0 0 26px;
}

.tech-flow {
    display: flex;
    align-items: center;
    gap: 9px;
    flex-wrap: wrap;
}

.tech-flow span {
    font-size: 9px;
    color: #bcb6bc;
    border: 1px solid var(--line);
    border-radius: 999px;
    padding: 7px 9px;
    background: #17151a;
}

.tech-flow i {
    font-style: normal;
    color: var(--pink);
    font-size: 10px;
}

.technology-copy small {
    display: block;
    margin-top: 16px;
    color: #68636b;
    font-size: 9px;
    letter-spacing: .04em;
}

html body main>.download {
    min-height: 220px!important;
    padding: 48px max(28px,4vw)!important;
    display: grid!important;
    grid-template-columns: 1fr auto!important;
    align-items: center!important;
    gap: 40px!important;
    background: radial-gradient(circle at 12% 100%,#301923 0,transparent 38%),var(--surface)!important;
}

html body main>.download h2 {
    font-size: clamp(46px,5.5vw,76px)!important;
    margin-bottom: 12px!important;
}

html body main>.download>div:first-child>span {
    font-size: 11px!important;
    color: var(--muted)!important;
}

html body main>.download>button {
    width: 230px!important;
    height: 48px!important;
    border: 1px solid #3b363d!important;
    border-radius: 999px!important;
    background: #19171b!important;
    color: #706b72!important;
    font: 600 10px 'Space Grotesk'!important;
    letter-spacing: .04em!important;
    cursor: not-allowed!important;
}

html body main>.download>button i {
    display: inline-block!important;
    width: 6px!important;
    height: 6px!important;
    border-radius: 50%!important;
    background: #5b565d!important;
    margin-right: 8px!important;
}

@media(max-width:900px) {
    html body main>.download {
        grid-template-columns: 1fr!important;
        align-items: start!important;
    }

    html body main>.download>button {
        width: 100%!important;
    }
}

@media(max-width:520px) {
    .feature-lines>div {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .tech-flow {
        gap: 7px;
    }

    html body main>.download {
        padding: 42px 22px!important;
    }
}

html body .hero {
    height: 480px!important;
    min-height: 0!important;
    grid-template-columns: minmax(0,1.25fr) minmax(240px,.75fr)!important;
}

html body .hero>div {
    min-width: 0!important;
}

html body .hero h1 {
    font-size: clamp(58px,7.2vw,108px)!important;
    line-height: .9!important;
    letter-spacing: -.065em!important;
    white-space: normal!important;
}

html body .hero .lead {
    max-width: 560px!important;
}

html body main>.features,html body main>.release {
    min-height: 0!important;
    height: auto!important;
    padding-top: 44px!important;
    padding-bottom: 44px!important;
}

html body main>.features .feature-lines {
    margin-top: 28px!important;
}

html body main>.features .feature-lines>div {
    padding-top: 11px!important;
    padding-bottom: 11px!important;
}

html body main>.release {
    gap: 28px!important;
}

html body main>.release .technology-copy {
    margin-top: 30px!important;
}

@media(max-width:800px) {
    html body .hero {
        height: 450px!important;
        grid-template-columns: 1fr!important;
    }

    .hero-cat {
        pointer-events: none;
    }
}

@media(max-width:520px) {
    html body .hero {
        height: 410px!important;
    }

    html body .hero h1 {
        font-size: 16vw!important;
    }
}

html body main {
    column-gap: 0!important;
}

html body .hero {
    height: 430px!important;
    padding-top: 44px!important;
    padding-bottom: 44px!important;
}

html body main>.features,html body main>.release {
    margin-top: 14px!important;
    padding: 36px!important;
    min-height: 320px!important;
    background: var(--surface)!important;
    box-shadow: none!important;
}

html body main>.features {
    border-radius: 16px 0 0 16px!important;
    border-right: 0!important;
}

html body main>.release {
    border-radius: 0 16px 16px 0!important;
    background: linear-gradient(135deg,#121116,#171219)!important;
}

html body main>.features .section-title h2,html body main>.release h2 {
    font-size: clamp(36px,3.8vw,54px)!important;
    line-height: .97!important;
}

html body main>.features .section-title>p,html body main>.release>div>p {
    margin-bottom: 14px!important;
}

html body main>.features .feature-lines {
    margin-top: 23px!important;
}

html body main>.features .feature-lines>div {
    padding: 9px 0!important;
}

html body main>.features .feature-lines strong {
    font-size: 11px!important;
}

html body main>.features .feature-lines span {
    font-size: 10px!important;
}

html body main>.release {
    justify-content: flex-start!important;
}

html body main>.release .technology-copy {
    margin-top: 24px!important;
}

html body main>.release .technology-copy>p {
    margin-bottom: 18px!important;
}

html body main>.release .tech-flow span {
    padding: 6px 8px!important;
}

html body main>.download {
    min-height: 180px!important;
    padding-top: 38px!important;
    padding-bottom: 38px!important;
}

html body main>.player {
    padding-top: 58px!important;
    padding-bottom: 58px!important;
}

html body footer {
    min-height: 100px!important;
}

@media(max-width:900px) {
    html body main {
        row-gap: 0!important;
    }

    html body main>.features {
        border-radius: 16px 16px 0 0!important;
        border-right: 1px solid var(--line)!important;
        border-bottom: 0!important;
    }

    html body main>.release {
        margin-top: 0!important;
        border-radius: 0 0 16px 16px!important;
    }

    html body main>.features,html body main>.release {
        min-height: 0!important;
    }
}

@media(max-width:520px) {
    html body .hero {
        height: 390px!important;
    }

    html body main>.features,html body main>.release {
        padding: 30px 22px!important;
    }
}

html body main>.product-details {
    grid-column: 1/-1;
    grid-row: 3;
    margin-top: 14px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--surface);
    overflow: hidden;
}

.product-details .detail-column {
    padding: 30px 34px;
}

.product-details .detail-column+.detail-column {
    border-left: 1px solid var(--line);
    background: linear-gradient(135deg,transparent,#171219);
}

.product-details .detail-label {
    margin: 0 0 9px;
    color: var(--pink);
    font-size: 9px;
    letter-spacing: .06em;
}

.product-details h2 {
    margin: 0;
    font-size: clamp(25px,2.7vw,38px);
    line-height: 1;
    letter-spacing: -.045em;
    font-weight: 500;
}

.product-details .detail-intro {
    margin: 12px 0 0;
    max-width: 520px;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.6;
}

.feature-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 24px;
    margin: 20px 0 0;
    padding: 0;
    list-style: none;
    border-top: 1px solid var(--line);
}

.feature-list li {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 0;
    border-bottom: 1px solid var(--line);
    font-size: 10px;
}

.feature-list strong {
    font-weight: 500;
    color: #d6d0d5;
}

.feature-list span {
    color: var(--dim);
    text-align: right;
}

.pipeline {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 20px 0 0;
    color: #aaa3aa;
    font-size: 9px;
}

.pipeline span {
    padding: 6px 9px;
    border: 1px solid var(--line);
    border-radius: 999px;
}

.pipeline i {
    font-style: normal;
    color: var(--pink);
}

html body main>.player {
    grid-column: 1/-1!important;
    grid-row: 4!important;
}

html body main>.download {
    grid-column: 1/-1!important;
    grid-row: 5!important;
    margin-bottom: 18px;
}

@media(max-width:800px) {
    html body main>.product-details {
        grid-column: 1;
        grid-template-columns: 1fr;
    }

    .product-details .detail-column {
        padding: 28px 24px;
    }

    .product-details .detail-column+.detail-column {
        border-left: 0;
        border-top: 1px solid var(--line);
    }

    html body main>.player {
        grid-column: 1!important;
        grid-row: 4!important;
    }

    html body main>.download {
        grid-column: 1!important;
        grid-row: 5!important;
    }
}

@media(max-width:520px) {
    .feature-list {
        grid-template-columns: 1fr;
    }

    .product-details h2 {
        font-size: 30px;
    }
}

html body main {
    row-gap: 14px!important;
}

html body main>section {
    margin-top: 0!important;
    margin-bottom: 0!important;
    border-radius: 16px;
}

html body main>.hero {
    height: 420px!important;
    padding: 42px 36px!important;
}

html body main>.sponsors {
    margin: 0!important;
}

html body main>.product-details {
    margin: 0!important;
}

.product-details .detail-column {
    padding: 30px 34px;
}

html body main>.player {
    margin: 0!important;
    padding: 46px 34px!important;
}

html body main>.download {
    margin: 0 0 14px!important;
    padding: 38px 34px!important;
}

html body .hero h1 {
    font-size: clamp(52px,6.25vw,92px)!important;
    line-height: .92!important;
    letter-spacing: -.06em!important;
    max-width: 900px;
}

html body .hero .lead {
    margin-top: 20px!important;
    margin-bottom: 24px!important;
}

@media(max-width:800px) {
    html body main>.hero {
        height: 400px!important;
        padding: 36px 24px!important;
    }

    .product-details .detail-column,html body main>.player,html body main>.download {
        padding-left: 24px!important;
        padding-right: 24px!important;
    }
}

@media(max-width:520px) {
    html body main {
        row-gap: 10px!important;
    }

    html body main>section {
        border-radius: 14px;
    }

    html body main>.hero {
        height: 390px!important;
        padding: 32px 22px!important;
    }

    html body .hero h1 {
        font-size: 14vw!important;
        line-height: .94!important;
    }

    .product-details .detail-column,html body main>.player,html body main>.download {
        padding-left: 22px!important;
        padding-right: 22px!important;
    }
}

@media(min-width:1000px) {
    html body main>.hero {
        padding-top: 42px!important;
        padding-bottom: 54px!important;
    }

    html body .hero h1 {
        font-size: clamp(52px,5.35vw,82px)!important;
    }
}

html body main>.download {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: radial-gradient(circle at 78% 115%,#4a2132 0,transparent 36%),linear-gradient(120deg,#171219,#100f13 68%)!important;
}

.download-copy {
    position: relative;
    z-index: 1;
}

html body main>.download>button {
    position: relative;
    z-index: 1;
    width: auto!important;
    min-width: 190px!important;
    height: 38px!important;
    padding: 0 16px!important;
    border: 0!important;
    border-radius: 999px!important;
    background: var(--pink)!important;
    color: #130d10!important;
    font: 600 10px 'Space Grotesk'!important;
    letter-spacing: .02em!important;
    opacity: .48!important;
}

html body main>.download>button i {
    display: none!important;
}

@media(max-width:900px) {
    html body main>.download>button {
        width: 100%!important;
    }
}

.technology-article {
    padding: 30px 34px;
}

.technology-article>p {
    margin: 0;
    padding: 0 0 15px;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.68;
}

.technology-article>p+p {
    padding-top: 15px;
    border-top: 1px solid var(--line);
}

.technology-article>p strong {
    color: #d5cfd4;
    font-weight: 500;
}

.technology-path {
    display: flex;
    align-items: center;
    gap: 9px;
    flex-wrap: wrap;
    padding-top: 16px;
    border-top: 1px solid var(--line);
}

.technology-path span {
    color: #bdb6bc;
    font-size: 9px;
}

.technology-path i {
    color: #665f66;
    font-size: 8px;
    font-style: normal;
}

@media(max-width:800px) {
    .technology-article {
        padding: 26px 24px;
    }
}

@media(max-width:520px) {
    .technology-article {
        padding: 24px 22px;
    }

    .technology-path {
        gap: 7px;
    }
}

html body main>.hero {
    grid-row: 1!important;
}

html body main>.player {
    grid-column: 1/-1!important;
    grid-row: 2!important;
}

html body main>.sponsors {
    grid-column: 1/-1!important;
    grid-row: 3!important;
}

html body main>.download {
    grid-column: 1/-1!important;
    grid-row: 4!important;
    margin: 0!important;
}

html body main>.technology-details {
    grid-column: 1/-1!important;
    grid-row: 5!important;
    display: block!important;
    padding: 40px 34px!important;
    background: linear-gradient(135deg,#151116,#0f0f12)!important;
}

.technology-details .technology-heading {
    padding: 0 0 24px!important;
    border: 0!important;
    border-bottom: 1px solid var(--line)!important;
}

.technology-details .technology-heading h2 {
    font-size: clamp(34px,4vw,56px);
}

.technology-details .technology-article {
    max-width: 920px;
    padding: 26px 0 0!important;
}

.technology-details .technology-article>p {
    padding: 0!important;
    border: 0!important;
    font-size: 12px;
    line-height: 1.78;
}

.technology-details .technology-article>p+p {
    margin-top: 18px!important;
}

@media(max-width:800px) {
    html body main>.player {
        grid-column: 1!important;
    }

    html body main>.sponsors {
        grid-column: 1!important;
    }

    html body main>.download {
        grid-column: 1!important;
    }

    html body main>.technology-details {
        grid-column: 1!important;
        padding: 32px 24px!important;
    }
}

@media(max-width:520px) {
    html body main>.technology-details {
        padding: 28px 22px!important;
    }

    .technology-details .technology-article>p {
        font-size: 11px;
    }
}

html body .eyebrow, html body .detail-label, html body .sponsor-label, html body .download-copy>p {
    text-transform: uppercase!important;
    letter-spacing: .12em!important;
    font-size: 9px!important;
    font-weight: 500;
}

html body .faceit-badge {
    display: inline-grid!important;
    grid-template-columns: auto auto;
    align-items: baseline;
    gap: 6px;
    padding: 6px 9px!important;
    border: 1px solid #6f292d!important;
    border-radius: 7px!important;
    background: linear-gradient(135deg,#261518,#171316)!important;
    color: #f0d9da!important;
    box-shadow: inset 2px 0 0 var(--red),0 8px 22px #df51470c!important;
}

html body .faceit-badge small {
    color: #b8797d;
    font-size: 7px;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: .1em;
}

html body .faceit-badge b {
    display: block!important;
    width: auto!important;
    height: auto!important;
    border-radius: 0!important;
    background: none!important;
    color: #ff6c64!important;
    font-size: 13px!important;
    line-height: 1!important;
    box-shadow: none!important;
}

.download-copy>span {
    display: block;
    max-width: 560px;
    line-height: 1.6;
}

.release-facts {
    display: flex;
    gap: 0;
    margin: 22px 0 0;
}

.release-facts>div {
    min-width: 120px;
    padding: 0 22px;
    border-left: 1px solid var(--line);
}

.release-facts>div:first-child {
    padding-left: 0;
    border-left: 0;
}

.release-facts dt {
    margin: 0 0 5px;
    color: #686269;
    font-size: 8px;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.release-facts dd {
    margin: 0;
    color: #bbb4ba;
    font-size: 10px;
}

@media(max-width:620px) {
    .release-facts {
        flex-wrap: wrap;
        gap: 16px 0;
    }

    .release-facts>div {
        min-width: 50%;
        padding-left: 16px;
    }

    .release-facts>div:nth-child(odd) {
        padding-left: 0;
        border-left: 0;
    }
}

html body main>.player, html body main>.download, html body main>.technology-details {
    padding: 38px 34px!important;
}

html body main>.player h2, html body main>.download h2, html body main>.technology-details h2 {
    margin-top: 0!important;
    font-size: clamp(34px,4vw,56px)!important;
    line-height: .96!important;
    letter-spacing: -.052em!important;
    font-weight: 500!important;
}

html body main>.player .eyebrow, html body main>.download .download-copy>p, html body main>.technology-details .detail-label {
    margin-bottom: 14px!important;
}

html body .faceit-badge {
    border-radius: 999px!important;
    padding-left: 10px!important;
    padding-right: 10px!important;
}

@media(max-width:800px) {
    html body main>.player,html body main>.download,html body main>.technology-details {
        padding: 32px 24px!important;
    }
}

@media(max-width:520px) {
    html body main>.player,html body main>.download,html body main>.technology-details {
        padding: 28px 22px!important;
    }

    html body main>.player h2,html body main>.download h2,html body main>.technology-details h2 {
        font-size: 34px!important;
    }
}

html body .sponsor-track {
    will-change: transform;
}

html body .sponsor-group {
    box-sizing: border-box;
    min-width: 100vw;
    justify-content: space-between;
    column-gap: 30px;
    padding-left: 15px;
    padding-right: 15px;
}

html body .sponsor-group .sep {
    margin-left: 0;
    margin-right: 0;
}

@media(max-width:700px) {
    html body .sponsor-group {
        column-gap: 22px;
        padding-left: 11px;
        padding-right: 11px;
    }
}

html body main>.download {
    display: block!important;
    min-height: 0!important;
    background: var(--surface)!important;
}

.download-copy {
    max-width: 780px;
}

.release-text {
    margin-top: 18px;
}

.release-text p {
    margin: 0;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.72;
}

.release-text p+p {
    margin-top: 10px;
}

html body main>.download>button {
    display: inline-flex!important;
    align-items: center!important;
    justify-content: center!important;
    margin-top: 24px!important;
    min-width: 190px!important;
}

@media(max-width:900px) {
    html body main>.download>button {
        width: auto!important;
    }
}

@media(max-width:520px) {
    html body main>.download>button {
        width: 100%!important;
    }
}

html body main>.download {
    background: radial-gradient(circle at 88% 105%,#4a2132 0,transparent 38%),linear-gradient(120deg,#171217,#111014 72%)!important;
}

html body main>.download>button {
    opacity: .62!important;
}

html body main>.technology-details {
    background: linear-gradient(135deg,#141216,#0f0f12)!important;
}

html body main>.technology-details h2 span {
    color: var(--pink);
}

:root {
    --card-glow: rgba(220,117,157,.10);
    --card-glow-clear: rgba(220,117,157,0);
    --card-dark-start: #171217;
    --card-dark-end: #0f0f12;
}

html body main>.hero {
    background: radial-gradient(circle at 84% 50%,var(--card-glow) 0,var(--card-glow-clear) 38%),linear-gradient(120deg,var(--card-dark-start),var(--card-dark-end) 72%)!important;
}

html body main>.player {
    background: radial-gradient(circle at 10% 50%,var(--card-glow) 0,var(--card-glow-clear) 38%),linear-gradient(120deg,var(--card-dark-start),var(--card-dark-end) 72%)!important;
}

html body main>.download {
    background: radial-gradient(circle at 88% 105%,var(--card-glow) 0,var(--card-glow-clear) 38%),linear-gradient(120deg,var(--card-dark-start),var(--card-dark-end) 72%)!important;
}

html body main>.technology-details {
    background: radial-gradient(circle at 10% 0,var(--card-glow) 0,var(--card-glow-clear) 38%),linear-gradient(120deg,var(--card-dark-start),var(--card-dark-end) 72%)!important;
}

html body main>.technology-details h2,html body main>.technology-details h2 span {
    color: #f1edf0!important;
}

html body main>.download h2 span {
    color: var(--pink)!important;
}

html body main>.technology-details {
    border: 0!important;
    border-radius: 0!important;
    background: none!important;
    padding: 48px 4px 54px!important;
    overflow: visible!important;
}

html body main>.technology-details .technology-heading {
    max-width: 920px;
    padding: 0!important;
    border: 0!important;
}

html body main>.technology-details .technology-article {
    max-width: 920px;
    padding-top: 24px!important;
}

@media(max-width:800px) {
    html body main>.technology-details {
        padding: 40px 2px 46px!important;
    }
}

@media(max-width:520px) {
    html body main>.technology-details {
        padding: 34px 0 40px!important;
    }
}

html body main>.technology-details {
    display: grid!important;
    grid-template-columns: minmax(220px,.62fr) minmax(0,1.38fr)!important;
    gap: clamp(40px,7vw,110px)!important;
    align-items: start;
    border-top: 1px solid var(--line)!important;
    padding: 48px 4px 54px!important;
}

html body main>.technology-details .technology-heading {
    max-width: 340px!important;
}

html body main>.technology-details .technology-heading h2 {
    font-size: clamp(36px,4.3vw,58px)!important;
}

html body main>.technology-details .technology-article {
    max-width: 760px!important;
    padding: 2px 0 0!important;
}

html body main>.technology-details .technology-article>p {
    font-size: 11px;
    line-height: 1.78;
}

@media(max-width:760px) {
    html body main>.technology-details {
        grid-template-columns: 1fr!important;
        gap: 26px!important;
        padding: 38px 0 44px!important;
    }

    html body main>.technology-details .technology-heading {
        max-width: none!important;
    }

    html body main>.technology-details .technology-article {
        max-width: none!important;
    }
}

html body main>.technology-details {
    margin-left: calc(-1 * max(20px,3vw))!important;
    margin-right: calc(-1 * max(20px,3vw))!important;
    margin-bottom: 36px!important;
    padding: 58px max(20px,3vw) 64px!important;
    border-top: 0!important;
    background: linear-gradient(100deg,rgba(220,117,157,.055),rgba(220,117,157,.012) 48%,transparent 78%)!important;
}

@media(max-width:760px) {
    html body main>.technology-details {
        padding-top: 44px!important;
        padding-bottom: 48px!important;
        margin-bottom: 26px!important;
    }
}

html body main>.technology-details {
    margin: 0 0 14px!important;
    padding: 38px 34px!important;
    border: 1px solid var(--line)!important;
    border-radius: 16px!important;
    background: radial-gradient(circle at 10% 0,var(--card-glow) 0,var(--card-glow-clear) 38%),linear-gradient(120deg,var(--card-dark-start),var(--card-dark-end) 72%)!important;
    overflow: hidden!important;
}

@media(max-width:800px) {
    html body main>.technology-details {
        padding: 32px 24px!important;
    }
}

@media(max-width:520px) {
    html body main>.technology-details {
        padding: 28px 22px!important;
        border-radius: 14px!important;
    }
}

html body main>.player, html body main>.technology-details {
    background: var(--surface)!important;
}

html body main>.player blockquote {
    font-size: clamp(22px,2.6vw,36px)!important;
    line-height: 1.14!important;
    letter-spacing: -.035em!important;
    margin-bottom: 24px!important;
}

html body main>.hero h1 {
    font-weight: 500!important;
    letter-spacing: -.052em!important;
    line-height: .94!important;
}

html body .player-meta .country, html body .player-info>a {
    text-transform: none!important;
}

html body main>.technology-details {
    display: grid;
    grid-template-columns: minmax(240px,.8fr) minmax(0,1.2fr);
    background: linear-gradient(135deg,#151116,#0f0f12);
}

.technology-heading {
    padding: 34px;
    border-right: 1px solid var(--line);
}

.technology-heading h2 {
    margin: 0;
    font-size: clamp(32px,3.6vw,52px);
    line-height: .96;
    letter-spacing: -.055em;
    font-weight: 500;
}

.technology-heading h2 span {
    color: var(--pink);
}

.architecture-list {
    padding: 20px 34px;
}

.architecture-list>div {
    display: grid;
    grid-template-columns: 28px 1fr;
    gap: 12px;
    padding: 12px 0;
    border-bottom: 1px solid var(--line);
}

.architecture-list>div:last-child {
    border-bottom: 0;
}

.architecture-list b {
    padding-top: 2px;
    color: #5f5960;
    font-size: 9px;
    font-weight: 500;
}

.architecture-list p {
    display: grid;
    grid-template-columns: 150px 1fr;
    gap: 20px;
    margin: 0;
}

.architecture-list strong {
    color: #d4cfd3;
    font-size: 11px;
    font-weight: 500;
}

.architecture-list span {
    color: var(--muted);
    font-size: 10px;
    line-height: 1.55;
}

@media(max-width:800px) {
    html body main>.technology-details {
        grid-template-columns: 1fr;
    }

    .technology-heading {
        padding: 28px 24px;
        border-right: 0;
        border-bottom: 1px solid var(--line);
    }

    .architecture-list {
        padding: 12px 24px;
    }

    .architecture-list p {
        grid-template-columns: 120px 1fr;
    }
}

@media(max-width:520px) {
    .technology-heading {
        padding: 26px 22px;
    }

    .architecture-list {
        padding: 10px 22px;
    }

    .architecture-list p {
        grid-template-columns: 1fr;
        gap: 4px;
    }
}
