:root {
    --bg: #0a0811;
    --surface: #151020;
    --surface2: #1b1428;
    --line: rgba(205,162,255,.14);
    --light: #f8f4ff;
    --muted: #a8a0b7;
    --pink: #e17dff;
    --violet: #9d53fb;
    --amber: #ffac48;
    --orange: #fc7131;
    --green: #76edb1;
    --font-title: 'Outfit',system-ui,sans-serif;
    --font-body: 'DM Sans',system-ui,sans-serif;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 105px;
}

body {
    margin: 0;
    color: var(--light);
    background: radial-gradient(ellipse 42% 560px at 95% 700px,rgba(117,41,130,.12),transparent),radial-gradient(ellipse 47% 560px at 0% 1800px,rgba(89,25,118,.1),transparent),var(--bg);
    font: 14px/1.6 var(--font-body);
    -webkit-font-smoothing: antialiased;
}

button,input,textarea,select {
    font: inherit;
}

a {
    color: inherit;
    text-decoration: none;
}

button {
    cursor: pointer;
}

button:disabled {
    opacity: .65;
    cursor: not-allowed;
}

h1,h2,h3,p {
    margin-top: 0;
}

h1,h2,h3 {
    font-family: var(--font-title);
}

h2 em,h1 em {
    font-style: normal;
    color: var(--pink);
}

::selection {
    background: var(--violet);
    color: white;
}

[hidden] {
    display: none!important;
}

img {
    max-width: 100%;
}

.defs {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
}

.icon {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    flex: none;
}

.layout {
    width: min(1512px,calc(100% - 76px));
    margin: 0 auto;
}

.skip {
    position: absolute;
    top: -70px;
    z-index: 9999;
    background: white;
    color: #0c0714;
    padding: 14px 20px;
}

.skip:focus {
    top: 0;
}

*:focus-visible {
    outline: 2px solid var(--amber);
    outline-offset: 4px;
}

.announcement {
    background: linear-gradient(90deg,#321239,#170e2a 48%,#271427);
    border-bottom: 1px solid rgba(229,156,255,.12);
    font-size: 10px;
    letter-spacing: .12em;
}

.announcement-inner {
    min-height: 36px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
}

.announcement-left,.announcement-right {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #bfb1cb;
}

.announcement-left b {
    color: #f5c5ff;
}

.glow-point {
    width: 6px;
    height: 6px;
    background: #ff994e;
    box-shadow: 0 0 0 4px rgba(255,150,73,.12),0 0 13px #fe885b;
    border-radius: 50%;
}

.announcement-sep {
    color: #a768f6;
}

.slash {
    color: #554961;
}

.announcement-right button {
    padding: 4px 9px;
    border: 0;
    background: transparent;
    color: #e8ceff;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .1em;
}

.header {
    position: sticky;
    z-index: 100;
    top: 0;
    background: rgba(12,9,21,.94);
    border-bottom: 1px solid rgba(255,255,255,.07);
    backdrop-filter: blur(26px);
}

.header-inner {
    display: flex;
    align-items: center;
    gap: 22px;
    min-height: 86px;
}

.wordmark {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.mark {
    position: relative;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1px;
    overflow: hidden;
    border-radius: 13px;
    transform: rotate(-8deg);
    border: 1px solid rgba(213,115,255,.5);
    background: linear-gradient(135deg,#4c2467,#181025 69%);
    box-shadow: 0 8px 27px rgba(164,73,244,.19);
    font: 900 22px var(--font-title);
    letter-spacing: -3px;
}

.mark span {
    display: block;
    transform: rotate(8deg);
}

.mark span:nth-child(2) {
    color: #eb91ff;
    margin-right: 3px;
}

.mark:after {
    position: absolute;
    content: '';
    width: 25px;
    height: 25px;
    background: #ef9eff;
    filter: blur(18px);
    right: -12px;
    top: -10px;
}

.wordmark-text {
    font: 900 23px/.96 var(--font-title);
    letter-spacing: -.04em;
}

.wordmark-text>span {
    color: var(--pink);
}

.wordmark-text small {
    display: block;
    margin-top: 6px;
    font: 800 8px/1 var(--font-body);
    letter-spacing: .25em;
    color: #9387a6;
}

.desktop-nav {
    display: flex;
    align-items: center;
    gap: 21px;
    margin: auto;
    min-height: 86px;
}

.nav-item {
    display: flex;
    align-items: center;
    height: 86px;
    position: relative;
    font-size: 12px;
    font-weight: 800;
    color: #aca1b5;
    white-space: nowrap;
    transition: color .2s;
}

.nav-item:hover,.nav-item.is-current {
    color: #fff;
}

.nav-item.is-current:before {
    content: '';
    height: 3px;
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    background: linear-gradient(90deg,var(--violet),var(--orange));
    border-radius: 3px 3px 0 0;
    box-shadow: 0 0 16px rgba(221,98,251,.45);
}

.header-actions {
    display: flex;
    gap: 9px;
    align-items: center;
    flex-shrink: 0;
}

.action-discord,.action-unban {
    display: flex;
    align-items: center;
    gap: 8px;
    justify-content: center;
    min-height: 43px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: rgba(89,42,117,.15);
    color: #eee6f9;
    padding: 0 13px;
    font: 800 11px var(--font-body);
    white-space: nowrap;
}

.action-discord {
    background: linear-gradient(120deg,#482267,#372046);
    border-color: rgba(221,126,255,.29);
}

.action-discord .icon {
    color: #d69aff;
}

.action-unban {
    border-color: rgba(255,162,61,.32);
    background: rgba(255,143,53,.07);
}

.action-unban .icon {
    color: var(--amber);
}

.mobile-toggle {
    display: none;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: rgba(111,61,130,.2);
    color: white;
}

.mobile-navigation {
    background: #15101f;
    padding: 12px 5vw 22px;
    box-shadow: 0 20px 45px rgba(0,0,0,.65);
    border-top: 1px solid var(--line);
}

.mobile-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 13px 7px;
    border-bottom: 1px solid rgba(255,255,255,.06);
    font-weight: 800;
}

.mobile-link.current {
    color: var(--pink);
}

.masthead {
    position: relative;
    isolation: isolate;
    min-height: 690px;
    overflow: hidden;
    border: 1px solid rgba(217,151,247,.2);
    border-radius: 17px;
    margin-top: 26px;
    background: #120d1a;
    box-shadow: 0 28px 80px rgba(0,0,0,.3);
}

.masthead-img {
    position: absolute;
    inset: 0;
    z-index: -3;
    background: url('/assets/skyline-halloween.webp') center 49% /cover no-repeat;
}

.masthead-vignette {
    position: absolute;
    inset: 0;
    z-index: -2;
    background: linear-gradient(0deg,rgba(5,5,12,.95) 0%,rgba(10,5,22,.38) 25%,rgba(9,7,20,.5) 79%,rgba(7,7,16,.3) 100%),linear-gradient(90deg,rgba(15,4,31,.23),rgba(15,4,31,.37),rgba(15,4,31,.25));
}

.moon-aura {
    position: absolute;
    z-index: -1;
    width: 440px;
    height: 440px;
    right: 10%;
    top: -80px;
    background: radial-gradient(circle,rgba(253,109,28,.15),transparent 67%);
    pointer-events: none;
}

.masthead-web {
    position: absolute;
    z-index: 0;
    width: 165px;
    height: 165px;
    opacity: .17;
    pointer-events: none;
    border-radius: 50%;
    background: repeating-conic-gradient(from 0deg,rgba(255,240,255,.6) 0 .5deg,transparent .5deg 30deg),repeating-radial-gradient(circle at 0 0,transparent 0 13px,rgba(255,235,255,.5) 14px 15px,transparent 16px 30px);
}

.web-one {
    right: 0;
    top: 0;
}

.web-two {
    left: 0;
    top: 0;
    transform: scaleX(-1);
}

.masthead-side {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 67px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    justify-content: center;
    border-right: 1px solid rgba(255,255,255,.09);
    background: linear-gradient(90deg,rgba(8,7,16,.33),transparent);
}

.masthead-side button {
    display: grid;
    place-items: center;
    width: 39px;
    height: 39px;
    border: 1px solid rgba(231,165,255,.21);
    background: rgba(26,14,44,.58);
    border-radius: 12px;
    color: #e9acff;
    transition: transform .2s,background .2s;
}

.masthead-side button:hover {
    transform: translateX(3px);
    background: #432358;
}

.rail-label {
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    font-weight: 800;
    letter-spacing: .24em;
    font-size: 9px;
    margin-bottom: 18px;
    color: #a59ba9;
}

.rail-dot {
    width: 5px;
    height: 5px;
    background: var(--amber);
    border-radius: 50%;
    margin-top: 14px;
    box-shadow: 0 0 15px var(--amber);
}

.masthead-content {
    position: relative;
    margin: auto;
    z-index: 2;
    max-width: 1020px;
    text-align: center;
    padding: 90px 48px 112px 92px;
}

.season-label {
    color: #ffb56b;
    letter-spacing: .32em;
    font-size: 10px;
    font-weight: 900;
    margin-bottom: 25px;
    text-shadow: 0 0 15px rgba(255,150,34,.4);
}

.season-label span {
    color: #e79dff;
    margin: 0 8px;
}

.masthead-brand {
    margin-bottom: 32px;
    filter: drop-shadow(0 14px 35px rgba(201,65,186,.2));
}

.hero-logo {
    display: inline-block;
    position: relative;
    font: 900 clamp(72px,9.5vw,148px)/.84 var(--font-title);
    letter-spacing: -.075em;
    font-style: italic;
    padding-right: .12em;
    background: linear-gradient(165deg,#ffe7ff 0%,#f9acff 20%,#ce6cf6 40%,#7841ba 76%,#f9a0fa 100%);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-stroke: 1px rgba(252,208,255,.5);
    text-shadow: 0 8px 80px rgba(175,68,212,.32);
}

.hero-logo span {
    background: linear-gradient(160deg,#ffde90,#ffab67 32%,#f28082 65%,#9b42b2);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}

.hero-logo i {
    position: absolute;
    right: 0;
    top: 12px;
    color: #ffe0ef;
    font: 700 14px var(--font-body);
    -webkit-text-stroke: 0;
    letter-spacing: 0;
}

.hero-subline {
    display: flex;
    gap: 20px;
    align-items: center;
    justify-content: center;
    color: #fff;
    letter-spacing: .65em;
    font: 900 clamp(14px,2.3vw,29px) var(--font-title);
    text-indent: .65em;
    text-shadow: 0 0 18px rgba(255,185,255,.5);
}

.hero-subline span {
    height: 1px;
    flex: 1;
    max-width: 95px;
    background: linear-gradient(90deg,transparent,#df98e9,transparent);
}

.masthead h1 {
    font: 900 19px var(--font-title);
    letter-spacing: .14em;
    color: #ffd8ff;
    margin-bottom: 12px;
}

.masthead-content>p {
    font-size: 14px;
    max-width: 540px;
    margin: 0 auto 27px;
    color: #e4d9e7;
    line-height: 1.85;
}

.hero-buttons {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
}

.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 54px;
    padding: 12px 22px;
    border-radius: 10px;
    border: 1px solid transparent;
    font: 900 11px var(--font-body);
    letter-spacing: .07em;
    color: #fff;
    transition: transform .19s,background .19s,box-shadow .19s;
    white-space: nowrap;
}

.button:hover {
    transform: translateY(-3px);
}

.button-primary {
    background: linear-gradient(110deg,#a855f6 0%,#bb65dc 45%,#ff923d 100%);
    border-color: rgba(255,202,128,.35);
    box-shadow: 0 15px 26px rgba(159,64,218,.18);
    color: white;
}

.button-primary:hover {
    box-shadow: 0 16px 34px rgba(228,102,191,.3);
}

.button-outline {
    background: rgba(17,11,29,.7);
    border-color: rgba(255,173,86,.57);
    box-shadow: inset 0 0 0 1px rgba(246,105,47,.12);
}

.button-outline:hover {
    background: rgba(67,33,64,.85);
}

.button .icon {
    width: 18px;
    height: 18px;
}

.hero-under {
    font-size: 9px;
    letter-spacing: .22em;
    font-weight: 900;
    color: #e0c8df;
    margin-top: 31px;
}

.season-star {
    color: #ffc079;
    font-size: 18px;
    vertical-align: middle;
    margin-right: 5px;
}

.dim {
    color: #72627a;
    padding: 0 6px;
}

.masthead-bottom {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 16px 26px 16px 90px;
    border-top: 1px solid rgba(255,255,255,.13);
    background: rgba(12,7,22,.65);
    font-size: 9px;
    letter-spacing: .15em;
}

.masthead-bottom>span:first-child {
    display: flex;
    align-items: center;
    gap: 10px;
}

.status-led {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #8a8490;
    box-shadow: 0 0 0 4px rgba(255,255,255,.06);
}

.status-led.online {
    background: var(--green);
    box-shadow: 0 0 0 4px rgba(113,233,167,.13),0 0 10px var(--green);
}

.masthead-index {
    color: #c5b8cc;
}

.masthead-index span {
    padding: 0 12px;
    color: #f3a267;
}

.status-grid {
    display: grid;
    grid-template-columns: 1.18fr 1fr 1fr;
    gap: 14px;
    margin-top: 16px;
}

.status-tile {
    display: flex;
    align-items: center;
    gap: 15px;
    min-height: 104px;
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: linear-gradient(130deg,rgba(30,21,44,.84),rgba(16,13,26,.95));
    box-shadow: 0 14px 30px rgba(0,0,0,.11);
}

.status-icon {
    width: 47px;
    height: 47px;
    border-radius: 13px;
    display: grid;
    place-items: center;
    color: #e7baff;
    background: linear-gradient(150deg,rgba(173,76,222,.25),rgba(80,37,110,.12));
    border: 1px solid rgba(202,126,249,.21);
}

.status-icon.purple {
    color: #dfb6ff;
}

.status-icon.orange {
    color: #ffb574;
    background: rgba(224,103,53,.1);
}

.status-tile>div:nth-child(2) {
    min-width: 0;
}

.status-tile small {
    display: block;
    color: #a99bb7;
    font-size: 10px;
    letter-spacing: .09em;
    font-weight: 900;
    margin-bottom: 6px;
}

.status-tile strong {
    font: 800 19px var(--font-title);
    white-space: nowrap;
}

.status-annotation {
    margin-left: auto;
    white-space: nowrap;
    font-size: 10px;
    color: #ad9eaf;
}

.tile-arrow {
    margin-left: auto;
    width: 35px;
    height: 35px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    border: 1px solid var(--line);
    background: rgba(255,255,255,.03);
    color: #e9b5ff;
}

.tile-chip {
    margin-left: auto;
    color: var(--amber);
    white-space: nowrap;
    border-radius: 999px;
    padding: 7px 9px;
    border: 1px solid rgba(240,157,79,.2);
    background: rgba(241,137,67,.07);
    font: 800 9px var(--font-body);
}

.section {
    padding-top: 100px;
    padding-bottom: 5px;
}

.section-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 31px;
}

.kicker {
    font-size: 10px;
    letter-spacing: .23em;
    font-weight: 900;
    color: #ffac69;
    margin-bottom: 12px;
}

.section-head h2 {
    font-size: clamp(30px,4.3vw,51px);
    line-height: 1.04;
    letter-spacing: -.045em;
    margin: 0;
}

.section-head>p {
    max-width: 350px;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.9;
    margin: 0;
}

.feature-grid {
    display: grid;
    grid-template-columns: 1.25fr 1fr 1fr;
    gap: 16px;
}

.feature {
    position: relative;
    overflow: hidden;
    min-height: 322px;
    padding: 24px;
    border-radius: 17px;
    border: 1px solid var(--line);
    background: linear-gradient(145deg,#3a1d48,#160f24);
    box-shadow: 0 16px 34px rgba(0,0,0,.2);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: transform .22s,border .22s;
}

.feature:hover {
    transform: translateY(-5px);
    border-color: rgba(241,176,250,.45);
}

.feature:before {
    content: '';
    position: absolute;
    inset: 0;
    opacity: .56;
    z-index: 0;
    background: radial-gradient(circle at 86% 15%,#cc66fa8c,transparent 42%),radial-gradient(circle at 0 110%,#551776,transparent 54%);
}

.feature-b:before {
    background: radial-gradient(circle at 90% 10%,#eb777b8c,transparent 49%),radial-gradient(circle at 0 115%,#773250,transparent 60%);
}

.feature-c:before {
    background: radial-gradient(circle at 90% 10%,#fba34d7f,transparent 49%),radial-gradient(circle at 0 115%,#5e2663,transparent 60%);
}

.feature:after {
    content: '✦';
    position: absolute;
    top: 35px;
    right: 26px;
    font: 900 135px/.8 var(--font-title);
    color: rgba(255,255,255,.055);
    transform: rotate(-16deg);
}

.feature>* {
    position: relative;
    z-index: 1;
}

.feature-n {
    font-weight: 900;
    font-size: 10px;
    letter-spacing: .12em;
    color: #ddcae4;
}

.feature-ico {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: rgba(255,255,255,.11);
    border: 1px solid rgba(255,255,255,.18);
    margin-bottom: 16px;
}

.feature-bottom h3 {
    font: 900 clamp(22px,2.4vw,30px)/1.1 var(--font-title);
    letter-spacing: -.035em;
    margin-bottom: 20px;
}

.feature-bottom>span:last-child {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    font-weight: 800;
    font-size: 11px;
    color: #f8deff;
}

.feature-bottom .icon {
    width: 16px;
    height: 16px;
}

.creator-grid {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 16px;
}

.creator-card {
    border-radius: 16px;
    overflow: hidden;
    background: rgba(24,17,36,.88);
    border: 1px solid var(--line);
    transition: transform .2s;
}

.creator-card:hover {
    transform: translateY(-4px);
}

.creator-cover,.creator-thumb {
    height: 170px;
    padding: 16px;
    position: relative;
    display: flex;
    justify-content: space-between;
    background: linear-gradient(135deg,#3a1e5b,#151626);
    overflow: hidden;
}

.creator-cover:after,.creator-thumb:after {
    content: '✦';
    font: 900 145px/.8 var(--font-title);
    color: rgba(255,255,255,.06);
    position: absolute;
    right: 12px;
    top: 27px;
    transform: rotate(20deg);
}

.creator-cover b {
    font: 900 98px/.9 var(--font-title);
    color: rgba(255,255,255,.08);
    align-self: center;
}

.cover-two {
    background: linear-gradient(135deg,#6a2c4b,#1e112f);
}

.cover-three {
    background: linear-gradient(135deg,#744032,#2a1338);
}

.creator-label {
    align-self: flex-start;
    background: rgba(16,9,28,.53);
    border: 1px solid rgba(255,255,255,.2);
    padding: 6px 10px;
    border-radius: 99px;
    font-size: 9px;
    letter-spacing: .08em;
    font-weight: 900;
}

.creator-info {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.creator-avatar {
    display: grid;
    place-items: center;
    flex: none;
    width: 41px;
    height: 41px;
    background: linear-gradient(145deg,#d876fe,#8642d9);
    border-radius: 12px;
    font: 900 14px var(--font-title);
}

.creator-info>div:nth-child(2) {
    flex: 1;
    min-width: 0;
}

.creator-info strong {
    display: block;
    font-size: 13px;
}

.creator-info small {
    display: block;
    color: var(--muted);
    font-size: 11px;
}

.creator-info>.icon {
    color: #ffab6e;
}

.section-actions {
    display: flex;
    justify-content: center;
    margin-top: 30px;
}

.text-link {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font: 900 10px var(--font-body);
    letter-spacing: .12em;
    color: #ffc089;
}

.text-link:hover {
    color: #fff;
}

.cta-halloween {
    margin: 0 0 104px;
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(243,152,192,.2);
    border-radius: 20px;
    background: linear-gradient(100deg,#301936 0%,#1a1129 59%,#3b1d28 100%);
    padding: 50px 65px;
    min-height: 260px;
    display: flex;
    align-items: center;
}

.cta-body {
    z-index: 1;
}

.cta-body h2 {
    font-size: clamp(30px,4vw,50px);
    letter-spacing: -.04em;
    line-height: 1.04;
    margin-bottom: 14px;
}

.cta-body p {
    color: #c9bcd2;
    margin-bottom: 24px;
}

.cta-body .hero-buttons {
    justify-content: flex-start;
}

.cta-decoration {
    position: absolute;
    right: 38px;
    top: -60px;
    font: 900 230px var(--font-title);
    letter-spacing: -.14em;
    color: rgba(253,206,255,.043);
    transform: rotate(-15deg);
}

.cta-decoration span {
    color: rgba(255,179,98,.06);
}

.subhero {
    min-height: 305px;
    margin-top: 26px;
    position: relative;
    display: flex;
    align-items: center;
    border: 1px solid rgba(210,152,237,.17);
    border-radius: 18px;
    overflow: hidden;
    background: #160e24;
}

.subhero-backdrop {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg,rgba(12,7,22,.98) 0%,rgba(22,9,30,.87) 50%,rgba(19,7,31,.53) 100%),url('/assets/skyline-halloween.webp') center 47%/cover;
}

.subhero-copy {
    position: relative;
    padding: 48px 64px;
    z-index: 2;
    max-width: 950px;
}

.subhero .kicker span {
    color: #935b9d;
    padding: 0 6px;
}

.subhero h1 {
    font-size: clamp(38px,5.2vw,75px);
    line-height: .96;
    letter-spacing: -.055em;
    margin: 12px 0 16px;
}

.subhero p {
    font-size: 14px;
    max-width: 630px;
    color: #d4c4d8;
    line-height: 1.85;
    margin: 0;
}

.hero-glyph {
    position: absolute;
    right: 65px;
    font: 900 140px var(--font-title);
    letter-spacing: -.1em;
    transform: rotate(-15deg);
    opacity: .08;
    pointer-events: none;
}

.hero-glyph span {
    color: #ffa265;
}

.columns {
    display: grid;
    gap: 17px;
}

.columns.two {
    grid-template-columns: repeat(2,1fr);
}

.columns.three {
    grid-template-columns: repeat(3,1fr);
}

.paper,.legal-box {
    border: 1px solid var(--line);
    background: linear-gradient(148deg,rgba(35,23,50,.85),rgba(17,12,28,.93));
    border-radius: 16px;
    padding: 30px;
    min-height: 225px;
}

.paper-number {
    color: #e9a5ff;
    display: inline-block;
    font-size: 10px;
    letter-spacing: .19em;
    font-weight: 900;
    margin-bottom: 35px;
}

.paper h3 {
    font-size: 24px;
    letter-spacing: -.035em;
    margin-bottom: 12px;
}

.paper p,.legal-box p {
    color: #b8adc3;
    line-height: 1.9;
    font-size: 13px;
}

.paper .button {
    margin-top: 18px;
}

.large-paper {
    min-height: 290px;
}

.faq-list {
    border: 1px solid var(--line);
    border-radius: 17px;
    overflow: hidden;
    background: #161121;
}

.faq+.faq {
    border-top: 1px solid rgba(233,178,245,.1);
}

.faq summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 19px;
    padding: 23px 28px;
}

.faq summary::-webkit-details-marker {
    display: none;
}

.faq summary span {
    font: 900 13px var(--font-title);
    color: #edaa69;
    min-width: 35px;
}

.faq summary b {
    font: 800 17px var(--font-title);
    flex: 1;
}

.faq summary .icon {
    transition: transform .2s;
}

.faq[open] summary .icon {
    transform: rotate(90deg);
}

.faq p {
    max-width: 840px;
    margin: 0 28px 24px 82px;
    color: #b8acc3;
    font-size: 13px;
    line-height: 1.85;
}

.notice-box {
    background: rgba(251,151,83,.07);
    color: #c8bad0;
    border: 1px solid rgba(251,151,83,.19);
    padding: 18px 20px;
    margin-top: 24px;
    border-radius: 12px;
    font-size: 12px;
    line-height: 1.85;
}

.notice-box strong {
    color: #ffc088;
}

.notice-box code {
    color: #e9bcff;
}

.faction-card {
    position: relative;
    border-radius: 18px;
    border: 1px solid var(--line);
    background: radial-gradient(circle at 90% 5%,rgba(163,57,210,.16),transparent 40%),#171121;
    padding: 29px;
    min-height: 310px;
    display: flex;
    flex-direction: column;
}

.faction-type {
    color: #ffaf6a;
    font-size: 10px;
    letter-spacing: .13em;
    font-weight: 900;
}

.faction-icon {
    width: 55px;
    height: 55px;
    margin: 34px 0 20px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(227,152,253,.24);
    background: rgba(115,56,147,.2);
    border-radius: 14px;
}

.faction-card h3 {
    font-size: 25px;
    letter-spacing: -.035em;
    margin-bottom: 10px;
}

.faction-card p {
    font-size: 13px;
    color: var(--muted);
    line-height: 1.8;
}

.faction-card a {
    margin-top: auto;
    display: flex;
    align-items: center;
    gap: 8px;
    color: #ffc085;
    font-weight: 900;
    font-size: 11px;
}

.faction-card a .icon {
    width: 15px;
}

.filter-row {
    display: flex;
    gap: 9px;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 22px;
}

.filter-button {
    color: #e5dceb;
    background: #21192d;
    border: 1px solid var(--line);
    font-weight: 900;
    font-size: 11px;
    border-radius: 9px;
    padding: 11px 19px;
}

.filter-button:hover,.filter-button.active {
    border-color: rgba(241,148,255,.5);
    background: linear-gradient(110deg,rgba(174,68,223,.35),rgba(250,130,61,.18));
    color: #fff;
}

.store-search {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 9px;
    background: #191323;
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 8px 13px;
    min-width: 245px;
    color: #aaa0b0;
}

.store-search input {
    width: 100%;
    background: transparent;
    border: 0;
    color: white;
    outline: none;
    font-size: 12px;
}

.store-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 16px;
}

.store-card {
    border: 1px solid var(--line);
    border-radius: 17px;
    overflow: hidden;
    background: #171121;
}

.store-visual {
    height: 185px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(140deg,#60357a,#28143c);
    overflow: hidden;
}

.store-visual>.icon {
    height: 72px;
    width: 72px;
    stroke-width: 1;
    color: #f5ceff;
    filter: drop-shadow(0 8px 18px rgba(236,124,241,.25));
    z-index: 1;
}

.store-visual:after {
    content: '';
    position: absolute;
    inset: -40px;
    background: repeating-linear-gradient(135deg,transparent 0 40px,rgba(255,255,255,.023) 41px 43px);
}

.store-visual span {
    position: absolute;
    z-index: 2;
    left: 18px;
    top: 18px;
    border: 1px solid rgba(255,255,255,.2);
    padding: 7px 10px;
    font-size: 9px;
    font-weight: 900;
    background: rgba(0,0,0,.2);
    border-radius: 99px;
}

.store-orange {
    background: linear-gradient(140deg,#ac5336,#3c1c3b);
}

.store-red {
    background: linear-gradient(140deg,#983c55,#401c35);
}

.store-body {
    padding: 25px;
}

.store-body small {
    color: #ffad77;
    font-size: 10px;
    letter-spacing: .12em;
    font-weight: 900;
}

.store-body h3 {
    margin: 10px 0;
    font-size: 23px;
    letter-spacing: -.03em;
}

.store-body p {
    color: var(--muted);
    line-height: 1.75;
    min-height: 65px;
}

.store-body .button {
    width: 100%;
    margin-top: 15px;
}

.empty-state {
    padding: 30px;
    color: var(--muted);
    text-align: center;
}

.creator-thumb {
    justify-content: center;
    align-items: center;
    font: 900 110px var(--font-title);
    color: #ffffff38;
}

.creator-placeholder {
    background: #161121;
    border: 1px solid var(--line);
    border-radius: 16px;
    overflow: hidden;
    padding-bottom: 22px;
}

.creator-placeholder h3 {
    margin: 22px 22px 4px;
    font-size: 18px;
}

.creator-placeholder p {
    color: var(--muted);
    font-size: 12px;
    margin: 0 22px;
}

.staff-grid {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 16px;
}

.staff-card {
    padding: 14px 14px 25px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #181220;
}

.staff-face {
    height: 185px;
    display: grid;
    place-items: center;
    border-radius: 11px;
    margin-bottom: 20px;
    background: linear-gradient(135deg,#56336d,#261630);
}

.staff-face span {
    display: grid;
    place-items: center;
    width: 76px;
    height: 76px;
    border-radius: 24px;
    border: 1px solid rgba(255,255,255,.3);
    background: #ffffff12;
    font: 900 32px var(--font-title);
}

.staff-2 {
    background: linear-gradient(135deg,#7c385b,#261630);
}

.staff-3 {
    background: linear-gradient(135deg,#5c386f,#392127);
}

.staff-4 {
    background: linear-gradient(135deg,#744139,#281a3b);
}

.staff-card>small {
    color: #ffb07a;
    letter-spacing: .15em;
    font-size: 10px;
    font-weight: 900;
}

.staff-card h3 {
    font-size: 21px;
    margin: 6px 0;
}

.staff-card p {
    font-size: 12px;
    color: #b4a9bf;
    line-height: 1.8;
    min-height: 43px;
}

.staff-placeholder {
    font-size: 10px;
    color: #8b8296;
    border: 1px solid var(--line);
    border-radius: 99px;
    padding: 7px 9px;
    display: inline-block;
}

.apply-layout {
    display: grid;
    grid-template-columns: minmax(0,1.5fr) minmax(265px,.68fr);
    gap: 22px;
    align-items: start;
}

.application-card {
    background: #171121;
    border: 1px solid var(--line);
    border-radius: 17px;
    padding: 35px;
}

.apply-form .form-kicker {
    color: #ffb87a;
    font-size: 10px;
    letter-spacing: .17em;
    font-weight: 900;
}

.apply-form h2 {
    font-size: clamp(27px,3.5vw,41px);
    letter-spacing: -.04em;
    line-height: 1.15;
    margin: 8px 0 10px;
}

.form-intro {
    font-size: 13px;
    color: #b8adc3;
    line-height: 1.8;
    margin-bottom: 23px;
}

.identity-row {
    padding: 14px;
    border: 1px solid rgba(193,119,245,.22);
    background: #35204244;
    color: #d4c4e3;
    border-radius: 10px;
    font-size: 12px;
    margin-bottom: 23px;
}

.identity-row button {
    color: #ffcb93;
    border: none;
    background: transparent;
    text-decoration: underline;
    cursor: pointer;
    font-weight: 900;
    padding: 0;
    margin-left: 10px;
}

.form-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 17px;
}

.form-grid label {
    display: flex;
    flex-direction: column;
    font-size: 12px;
    font-weight: 800;
    gap: 8px;
    color: #f6effb;
}

.form-grid label.full {
    grid-column: 1/-1;
}

.form-grid label span {
    color: #ffae69;
}

.form-grid label small {
    font-size: 10px;
    color: #9e91ab;
    font-weight: 500;
}

.form-grid input,.form-grid textarea {
    width: 100%;
    resize: vertical;
    min-height: 45px;
    padding: 12px 13px;
    border: 1px solid rgba(233,185,255,.15);
    outline: none;
    border-radius: 10px;
    color: #fbf6ff;
    background: #0f0b19;
    font: 500 12px var(--font-body);
}

.form-grid textarea {
    line-height: 1.7;
}

.form-grid input:focus,.form-grid textarea:focus {
    border-color: #b878ef;
    box-shadow: 0 0 0 3px #ad60dc20;
}

.form-grid input::placeholder,.form-grid textarea::placeholder {
    color: #84798e;
}

.honeypot {
    position: absolute;
    left: -99999px;
    top: -99999px;
}

.consent {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    font-size: 11px;
    color: #bbb0c6;
    line-height: 1.8;
    margin: 24px 0;
}

.consent input {
    width: 16px;
    height: 16px;
    accent-color: #b35fe9;
    margin-top: 3px;
}

.form-error {
    color: #ffc5c5;
    padding: 14px;
    background: #7c303a33;
    border: 1px solid #d964684f;
    border-radius: 9px;
    font-size: 12px;
}

.form-bottom {
    display: flex;
    justify-content: flex-end;
}

.apply-aside {
    padding: 34px;
    background: linear-gradient(140deg,rgba(61,31,73,.7),rgba(26,18,36,.95));
    border: 1px solid var(--line);
    border-radius: 17px;
}

.aside-icon {
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    border-radius: 15px;
    background: rgba(196,101,244,.19);
    color: #f0b5ff;
    border: 1px solid rgba(220,154,245,.19);
    margin-bottom: 28px;
}

.aside-icon .icon {
    width: 28px;
    height: 28px;
}

.apply-aside h3 {
    font-size: 30px;
    line-height: 1.1;
    margin-bottom: 25px;
}

.apply-aside ol {
    padding: 0;
    margin: 0;
    list-style: none;
    counter-reset: steps;
}

.apply-aside li {
    counter-increment: steps;
    position: relative;
    padding: 0 0 24px 45px;
    min-height: 60px;
}

.apply-aside li:not(:last-child):after {
    content: '';
    position: absolute;
    left: 12px;
    top: 26px;
    bottom: 4px;
    border-left: 1px dashed rgba(250,200,255,.3);
}

.apply-aside li:before {
    content: counter(steps);
    position: absolute;
    left: 0;
    top: 2px;
    width: 27px;
    height: 27px;
    display: grid;
    place-items: center;
    background: #53275c;
    border-radius: 9px;
    font: 900 11px var(--font-body);
    color: #ffbe95;
}

.apply-aside li b {
    display: block;
    font-size: 13px;
}

.apply-aside li span {
    display: block;
    color: var(--muted);
    font-size: 12px;
}

.aside-note {
    border-top: 1px solid var(--line);
    padding-top: 20px;
    color: #b8acbd;
    font-size: 11px;
    line-height: 1.8;
}

.success-state {
    padding: 40px 15px;
    text-align: center;
}

.success-state .success-ico {
    display: grid;
    place-items: center;
    width: 70px;
    height: 70px;
    margin: 0 auto 22px;
    border: 1px solid #7ceab04f;
    border-radius: 20px;
    color: #8bf3b2;
    background: #7ceab016;
}

.success-state .success-ico .icon {
    width: 34px;
    height: 34px;
}

.success-state h2 {
    font-size: 36px;
}

.success-state p {
    color: var(--muted);
}

.success-reference {
    font: 900 18px var(--font-title);
    letter-spacing: .07em;
    padding: 17px;
    background: #221931;
    border-radius: 10px;
    display: inline-block;
    color: #ffd095;
    margin: 15px auto;
}

.legal-box {
    max-width: 980px;
    min-height: 150px;
}

.legal-box h2 {
    font-size: 28px;
}

.updates-empty {
    text-align: center;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    min-height: 250px;
    background: #181221;
    border: 1px solid var(--line);
    border-radius: 16px;
}

.updates-empty .icon {
    height: 40px;
    width: 40px;
    color: #d3a5f9;
    margin-bottom: 16px;
}

.updates-empty h3 {
    margin-bottom: 8px;
    font-size: 18px;
}

.updates-empty p {
    color: var(--muted);
    max-width: 450px;
}

.footer {
    margin-top: 110px;
    background: linear-gradient(180deg,#171022,#100b17);
    border-top: 1px solid var(--line);
}

.footer-grid {
    padding-top: 65px;
    padding-bottom: 55px;
    display: grid;
    grid-template-columns: 1.8fr repeat(3,1fr);
    gap: 35px;
}

.footer-intro p {
    max-width: 300px;
    margin: 14px 0 38px;
    color: #aa9db4;
    line-height: 1.85;
    font-size: 12px;
}

.footer-logo {
    font: 900 32px var(--font-title);
    letter-spacing: -.06em;
}

.footer-logo span {
    color: #de8eff;
}

.footer-logo b {
    font: 900 9px var(--font-title);
    vertical-align: super;
    letter-spacing: 0;
    margin-left: 5px;
    color: #ffb76d;
}

.footer-footnote {
    color: #887e93;
    font-size: 10px;
}

.footer-grid h3 {
    font: 900 12px var(--font-title);
    margin: 0 0 18px;
}

.footer-grid>div:not(:first-child) a {
    display: block;
    color: #a99eb3;
    font-size: 12px;
    margin-bottom: 12px;
}

.footer-grid a:hover {
    color: #fff;
}

.footer-bottom {
    border-top: 1px solid var(--line);
    padding-top: 20px;
    padding-bottom: 20px;
    display: flex;
    justify-content: space-between;
    font-size: 9px;
    color: #7e718c;
    font-weight: 900;
    letter-spacing: .16em;
}

.toast {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 1000;
    max-width: min(420px,calc(100vw - 36px));
    padding: 15px 19px;
    background: #2e2040;
    border: 1px solid #b873d5;
    border-radius: 12px;
    color: white;
    box-shadow: 0 14px 50px rgba(0,0,0,.5);
    font-size: 12px;
    line-height: 1.7;
}

.theme-classic {
    --pink: #bf9eff;
    --orange: #9a86fe;
    --amber: #bea9fb;
}

.theme-classic .masthead-img,.theme-classic .subhero-backdrop {
    filter: hue-rotate(65deg) saturate(.65);
}

.theme-classic .announcement {
    background: #20182c;
}

@media(max-width:1330px) {
    .desktop-nav {
        gap: 13px;
    }
    .nav-item {
        font-size: 11px;
    }
    .header-inner {
        gap: 16px;
    }
    .action-unban span {
        display: none;
    }
    .action-unban {
        width: 42px;
        padding: 0;
    }
    .status-annotation,.tile-chip {
        display: none;
    }
}

@media(max-width:1100px) {
    .desktop-nav {
        display: none;
    }
    .mobile-toggle {
        display: flex;
    }
    .header-inner {
        min-height: 76px;
    }
    .masthead {
        min-height: 640px;
    }
    .status-grid {
        grid-template-columns: 1fr 1fr;
    }
    .status-grid .status-tile:last-child {
        grid-column: 1/-1;
    }
    .feature-grid {
        grid-template-columns: repeat(2,1fr);
    }
    .feature-large {
        grid-row: span 2;
    }
    .footer-grid {
        grid-template-columns: repeat(2,1fr);
    }
    .staff-grid {
        grid-template-columns: repeat(2,1fr);
    }
}

@media(max-width:740px) {
    .layout {
        width: calc(100% - 28px);
    }
    .announcement-inner {
        justify-content: center;
        min-height: 34px;
    }
    .announcement-right {
        display: none;
    }
    .announcement-left {
        font-size: 9px;
        letter-spacing: .07em;
    }
    .announcement-left .announcement-sep {
        display: none;
    }
    .header-inner {
        min-height: 72px;
        gap: 10px;
    }
    .mark {
        height: 42px;
        width: 42px;
    }
    .wordmark-text {
        font-size: 19px;
    }
    .wordmark-text small {
        font-size: 7px;
    }
    .header-actions {
        margin-left: auto;
    }
    .action-discord span {
        display: none;
    }
    .action-discord {
        width: 42px;
        padding: 0;
    }
    .action-unban {
        width: 42px;
    }
    .masthead {
        margin-top: 14px;
        min-height: 650px;
    }
    .masthead-img {
        background-position: 63% center;
    }
    .masthead-side {
        display: none;
    }
    .masthead-content {
        padding: 75px 20px 110px;
    }
    .season-label {
        font-size: 8px;
        letter-spacing: .15em;
        margin-bottom: 24px;
    }
    .season-label span {
        margin: 0 3px;
    }
    .hero-logo {
        font-size: clamp(50px,12vw,88px);
        letter-spacing: -.085em;
    }
    .hero-logo i {
        font-size: 8px;
        top: 4px;
    }
    .hero-subline {
        font-size: 15px;
        letter-spacing: .38em;
    }
    .hero-subline span {
        max-width: 33px;
    }
    .masthead h1 {
        font-size: 13px;
        letter-spacing: .1em;
    }
    .masthead-content>p {
        font-size: 12px;
        max-width: 310px;
    }
    .hero-buttons {
        flex-direction: column;
        align-items: stretch;
        max-width: 300px;
        margin: auto;
    }
    .hero-buttons .button {
        width: 100%;
    }
    .masthead-bottom {
        padding: 15px;
        font-size: 8px;
    }
    .masthead-index {
        display: none;
    }
    .status-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    .status-grid .status-tile:last-child {
        grid-column: auto;
    }
    .status-tile {
        min-height: 83px;
        padding: 16px;
    }
    .status-tile strong {
        font-size: 16px;
    }
    .section {
        padding-top: 63px;
    }
    .section-head {
        display: block;
    }
    .section-head h2 {
        font-size: 32px;
    }
    .section-head>p {
        margin-top: 14px;
        font-size: 12px;
    }
    .feature-grid,.creator-grid,.store-grid,.columns.two,.columns.three,.staff-grid,.apply-layout {
        grid-template-columns: 1fr;
    }
    .feature {
        min-height: 260px;
    }
    .feature-large {
        grid-row: auto;
    }
    .creator-cover {
        height: 150px;
    }
    .cta-halloween {
        padding: 38px 25px;
        min-height: 280px;
        margin-bottom: 50px;
    }
    .cta-decoration {
        right: 0;
        font-size: 150px;
        top: 0;
    }
    .subhero {
        min-height: 260px;
        margin-top: 14px;
    }
    .subhero-copy {
        padding: 40px 23px;
    }
    .subhero h1 {
        font-size: 40px;
    }
    .subhero p {
        font-size: 12px;
    }
    .hero-glyph {
        display: none;
    }
    .faq summary {
        padding: 18px 16px;
        gap: 10px;
    }
    .faq summary b {
        font-size: 14px;
    }
    .faq p {
        margin: 0 18px 20px 60px;
        font-size: 12px;
    }
    .store-search {
        margin-left: 0;
        flex: 1;
        min-width: 100%;
    }
    .staff-face {
        height: 150px;
    }
    .application-card,.apply-aside {
        padding: 22px;
    }
    .form-grid {
        grid-template-columns: 1fr;
    }
    .apply-form h2 {
        font-size: 30px;
    }
    .footer-grid {
        grid-template-columns: repeat(2,1fr);
        gap: 30px;
        padding-top: 45px;
    }
    .footer-intro {
        grid-column: 1/-1;
    }
    .footer-intro p {
        margin-bottom: 16px;
    }
    .footer-bottom {
        display: block;
        line-height: 2;
    }
}

@media(prefers-reduced-motion:reduce) {
    *,*:before,*:after {
        scroll-behavior: auto!important;
        animation: none!important;
        transition: none!important;
    }
}

/* Keep required markers on the same line as their field labels. */

.form-grid label {
    display: block;
}

.form-grid input,.form-grid textarea {
    display: block;
    margin-top: 8px;
}

.form-grid .honeypot {
    position: absolute;
}

/* FreeCity Teamseite – individuelles Halloween-Roster */

.fc-team-hero {
    min-height: 345px;
    isolation: isolate;
    overflow: hidden;
}

.fc-team-hero .subhero-backdrop {
    background: linear-gradient(100deg,rgba(12,5,20,.94) 4%,rgba(27,12,40,.82) 54%,rgba(29,9,35,.47)),url('/assets/skyline-halloween.webp') center 52%/cover no-repeat;
}

.fc-team-hero .subhero-copy {
    position: relative;
    z-index: 2;
}

.fc-team-hero .subhero-copy p {
    max-width: 630px;
}

.fc-team-hero-orb {
    position: absolute;
    right: 12%;
    top: -120px;
    width: 320px;
    height: 320px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: radial-gradient(circle at 43% 48%,rgba(255,157,81,.34),rgba(168,67,141,.12) 58%,transparent 70%);
    color: rgba(255,176,120,.25);
    font-size: 120px;
    filter: blur(4px);
    pointer-events: none;
    z-index: 1;
}

.fc-team-hero-monogram {
    font: 900 clamp(95px,14vw,190px)/1 var(--font-title);
    letter-spacing: -.13em;
    color: rgba(249,183,255,.15);
    position: absolute;
    right: 8%;
    bottom: 20px;
    z-index: 1;
    transform: rotate(-10deg);
    pointer-events: none;
}

.fc-team-hero-monogram span {
    font-size: .4em;
    color: rgba(255,158,74,.48);
    vertical-align: top;
    letter-spacing: 0;
    margin-left: 20px;
}

.fc-team-hero-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 25px;
}

.fc-team-hero-tags span {
    background: rgba(20,9,30,.58);
    border: 1px solid rgba(255,200,244,.2);
    border-radius: 7px;
    padding: 9px 13px;
    color: #c5b5c9;
    font-size: 9px;
    letter-spacing: .13em;
    font-weight: 900;
    backdrop-filter: blur(8px);
}

.fc-team-hero-tags b {
    color: #ffc47d;
    font-size: 12px;
    margin-right: 5px;
}

.fc-team-section {
    padding-top: 82px;
}

.fc-team-section-head {
    margin-bottom: 24px;
}

.fc-team-grid {
    display: grid;
    gap: 18px;
}

.fc-team-founders {
    grid-template-columns: repeat(2,minmax(0,1fr));
}

.fc-team-core {
    grid-template-columns: repeat(3,minmax(0,1fr));
}

.fc-person {
    --person-a: #a968d9;
    --person-b: #502574;
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-width: 0;
    border: 1px solid rgba(197,126,223,.21);
    background: #160f22;
    border-radius: 19px;
    min-height: 424px;
    display: flex;
    flex-direction: column;
    box-shadow: 0 22px 50px rgba(0,0,0,.18);
    transition: transform .25s ease,border-color .25s ease,box-shadow .25s ease;
}

.fc-person:hover {
    transform: translateY(-5px);
    border-color: rgba(239,175,252,.55);
    box-shadow: 0 28px 65px rgba(76,25,94,.32);
}

.fc-person:before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -2;
    pointer-events: none;
    background: radial-gradient(ellipse at 50% 28%,color-mix(in srgb,var(--person-a) 37%,transparent),transparent 62%),radial-gradient(circle at 110% 120%,color-mix(in srgb,var(--person-b) 40%,transparent),transparent 60%),linear-gradient(150deg,#211331,#130e1e 72%);
}

.fc-person:after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: linear-gradient(135deg,transparent 45%,rgba(255,255,255,.022) 48%,transparent 50%),repeating-linear-gradient(90deg,transparent 0 44px,rgba(255,255,255,.012) 45px,transparent 46px);
    mask-image: linear-gradient(black,transparent 75%);
}

.fc-person-founder {
    min-height: 458px;
    border-color: rgba(251,176,112,.25);
}

.fc-person-founder:hover {
    border-color: rgba(255,194,142,.6);
}

.fc-rage {
    --person-a: #de825b;
    --person-b: #9c48dd;
}

.fc-nelly {
    --person-a: #ba73cf;
    --person-b: #ee9453;
}

.fc-lena {
    --person-a: #ca669c;
    --person-b: #71368f;
}

.fc-ossi {
    --person-a: #8d66cc;
    --person-b: #d88758;
}

.fc-pablo {
    --person-a: #787ac9;
    --person-b: #824ad3;
}

.fc-person-top {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 20px 21px 0;
    flex-wrap: wrap;
}

.fc-person-index {
    font: 900 9px var(--font-body);
    letter-spacing: .17em;
    color: #bdacc5;
}

.fc-rank-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font: 900 9px var(--font-body);
    letter-spacing: .12em;
    color: #ffcf9d;
    border: 1px solid rgba(251,160,92,.32);
    background: rgba(255,145,67,.09);
    padding: 8px 10px;
    border-radius: 100px;
}

.fc-team-core .fc-rank-badge {
    color: #e2b1fc;
    background: rgba(193,106,243,.1);
    border-color: rgba(205,123,251,.31);
}

.fc-person-visual {
    position: relative;
    flex: 1;
    min-height: 195px;
    display: grid;
    place-items: center;
    padding: 10px 0 8px;
}

.fc-person-founder .fc-person-visual {
    min-height: 214px;
}

.fc-avatar-ring {
    width: 146px;
    height: 146px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255,210,236,.35);
    background: linear-gradient(145deg,rgba(255,221,244,.13),rgba(92,27,96,.24));
    box-shadow: 0 0 0 12px rgba(250,185,255,.028),0 0 0 29px rgba(247,177,246,.023),0 22px 56px rgba(0,0,0,.3),inset 0 0 40px rgba(255,191,212,.1);
    transform: rotate(-8deg);
}

.fc-avatar-ring>span {
    display: grid;
    place-items: center;
    width: 110px;
    height: 110px;
    border-radius: 50%;
    background: linear-gradient(150deg,var(--person-a),#2c1739);
    border: 1px solid rgba(255,255,255,.28);
    font: 900 66px/.8 var(--font-title);
    color: #fff1fa;
    text-shadow: 0 10px 20px rgba(0,0,0,.2);
    transform: rotate(8deg);
}

.fc-person-founder .fc-avatar-ring {
    width: 164px;
    height: 164px;
}

.fc-person-founder .fc-avatar-ring>span {
    width: 125px;
    height: 125px;
    font-size: 76px;
}

.fc-visual-label {
    position: absolute;
    right: 24px;
    bottom: 18px;
    color: rgba(255,255,255,.25);
    letter-spacing: .24em;
    font-size: 9px;
    font-weight: 900;
}

.fc-person-content {
    position: relative;
    z-index: 2;
    padding: 10px 26px 20px;
}

.fc-person-role {
    font-weight: 900;
    font-size: 10px;
    color: #ffb57d;
    letter-spacing: .19em;
    margin-bottom: 7px;
}

.fc-team-core .fc-person-role {
    color: #d9a8f9;
}

.fc-person-content h3 {
    margin: 0 0 5px;
    font: 900 clamp(29px,3.5vw,42px)/1.06 var(--font-title);
    letter-spacing: -.06em;
    color: #fff;
}

.fc-person-detail {
    color: #c7b7c9;
    font-size: 12px;
    line-height: 1.5;
    margin: 0;
}

.fc-person-bottom {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 26px;
    border-top: 1px solid rgba(255,255,255,.09);
    color: #9584a5;
    letter-spacing: .18em;
    font-size: 9px;
    font-weight: 900;
}

.fc-person-bottom span:last-child {
    font-size: 16px;
    color: #edb777;
}

.fc-team-departments {
    padding-top: 75px;
}

.fc-team-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    flex-wrap: wrap;
    margin-top: 70px;
    margin-bottom: 70px;
    padding: 30px 36px;
    border: 1px solid rgba(219,142,246,.23);
    border-radius: 18px;
    background: linear-gradient(110deg,#221230,#231425 65%,#40202d);
    box-shadow: 0 18px 44px rgba(0,0,0,.18);
}

.fc-team-cta h2 {
    font: 900 clamp(25px,3.8vw,37px)/1 var(--font-title);
    margin-bottom: 9px;
}

.fc-team-cta p {
    color: #bbaac9;
    margin: 0;
    font-size: 12px;
}

.fc-team-cta-buttons {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

@media(max-width:1100px) {
    .fc-team-core {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
    .fc-team-hero-monogram {
        right: 5%;
        font-size: 110px;
    }
}

@media(max-width:740px) {
    .fc-team-hero {
        min-height: 365px;
    }
    .fc-team-hero-tags {
        margin-top: 18px;
    }
    .fc-team-hero-tags span {
        font-size: 8px;
    }
    .fc-team-hero-monogram {
        display: none;
    }
    .fc-team-founders,.fc-team-core {
        grid-template-columns: 1fr;
    }
    .fc-team-section {
        padding-top: 55px;
    }
    .fc-person-founder,.fc-person {
        min-height: 390px;
    }
    .fc-person-visual,.fc-person-founder .fc-person-visual {
        min-height: 180px;
    }
    .fc-avatar-ring,.fc-person-founder .fc-avatar-ring {
        width: 142px;
        height: 142px;
    }
    .fc-avatar-ring>span,.fc-person-founder .fc-avatar-ring>span {
        width: 109px;
        height: 109px;
        font-size: 64px;
    }
    .fc-team-cta {
        margin-top: 55px;
        margin-bottom: 45px;
        padding: 24px;
    }
    .fc-team-cta-buttons {
        width: 100%;
    }
    .fc-team-cta-buttons .button {
        width: 100%;
    }
}

@media(prefers-reduced-motion:reduce) {
    .fc-person {
        transition: none;
    }
    .fc-person:hover {
        transform: none;
    }
}