:root {
    --landing-bg: #080808;
    --landing-surface: #111111;
    --landing-surface-2: #181818;
    --landing-line: rgba(255, 255, 255, 0.11);
    --landing-text: #f4f1ec;
    --landing-muted: #aaa6a0;
    --landing-red: #d8203f;
    --landing-gold: #d5b15a;
    --landing-max: 1240px;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body.landing-page {
    margin: 0;
    overflow-x: hidden;
    background: var(--landing-bg);
    color: var(--landing-text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* The landing page is intentionally dark, regardless of the member UI theme. */
[data-theme="light"] body.landing-page {
    background: var(--landing-bg);
    color: var(--landing-text);
}

.landing-page .landing-hero h1,
.landing-page .landing-section h2,
.landing-page .landing-bento__card h3,
.landing-page .landing-event h3,
.landing-page .landing-social__copy h2,
.landing-page .landing-cta h2 {
    color: var(--landing-text);
}

.landing-page .landing-section__lead,
.landing-page .landing-bento__card p,
.landing-page .landing-about__copy > p,
.landing-page .landing-event__meta {
    color: #d2cfca;
}

.landing-page .landing-hero h1 span {
    color: transparent;
    -webkit-text-stroke-color: rgba(255, 255, 255, 0.9);
}

.landing-page a {
    color: inherit;
}

.landing-shell {
    width: min(calc(100% - 48px), var(--landing-max));
    margin-inline: auto;
}

.landing-nav {
    position: absolute;
    inset: 0 0 auto;
    z-index: 20;
    height: 92px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.landing-nav__inner {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.landing-brand {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
}

.landing-brand img {
    width: 42px;
    height: 42px;
    object-fit: contain;
}

.landing-brand__copy {
    display: grid;
    gap: 2px;
}

.landing-brand strong {
    font-size: 0.88rem;
    line-height: 1;
    letter-spacing: 0.18em;
}

.landing-brand small {
    color: rgba(255, 255, 255, 0.58);
    font-size: 0.64rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.landing-nav__links {
    display: flex;
    align-items: center;
    gap: 28px;
}

.landing-nav__links > a {
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.84rem;
    font-weight: 650;
    text-decoration: none;
}

.landing-nav__links > a:hover {
    color: #fff;
}

.landing-languages {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding-left: 22px;
    border-left: 1px solid rgba(255, 255, 255, 0.16);
}

.landing-languages a {
    padding: 6px 7px;
    color: rgba(255, 255, 255, 0.5);
    font-size: 0.7rem;
    font-weight: 800;
    text-decoration: none;
}

.landing-languages a.active {
    color: var(--landing-gold);
}

.landing-hero {
    position: relative;
    min-height: 760px;
    height: 100svh;
    max-height: 980px;
    display: flex;
    align-items: flex-end;
    overflow: hidden;
    isolation: isolate;
    background: #0a0a0a;
}

.landing-hero__media,
.landing-hero__media video,
.landing-hero__media .landing-hero__image,
.landing-hero__shade {
    position: absolute;
    inset: 0;
}

.landing-hero__media {
    z-index: -3;
}

.landing-hero__media video,
.landing-hero__media .landing-hero__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.landing-hero__shade {
    z-index: -2;
    background:
        linear-gradient(90deg, rgba(5, 5, 5, 0.94) 0%, rgba(5, 5, 5, 0.7) 42%, rgba(5, 5, 5, 0.16) 76%),
        linear-gradient(0deg, #080808 0%, transparent 38%),
        linear-gradient(180deg, rgba(0, 0, 0, 0.54) 0%, transparent 30%);
}

.landing-hero::after {
    content: "";
    position: absolute;
    right: 7vw;
    bottom: 104px;
    z-index: -1;
    width: 42vw;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(213, 177, 90, 0.65));
}

.landing-hero__content {
    width: min(calc(100% - 48px), var(--landing-max));
    margin: 0 auto;
    padding: 160px 0 116px;
}

.landing-kicker {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 24px;
    color: var(--landing-gold);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

.landing-kicker::before {
    content: "";
    width: 34px;
    height: 2px;
    background: var(--landing-red);
}

.landing-hero h1 {
    max-width: 830px;
    margin: 0;
    font-size: clamp(4rem, 8.4vw, 8.2rem);
    font-weight: 850;
    letter-spacing: -0.075em;
    line-height: 0.85;
    text-wrap: balance;
}

.landing-hero h1 span {
    display: block;
    color: transparent;
    -webkit-text-stroke: 1px rgba(255, 255, 255, 0.72);
}

.landing-hero__bottom {
    display: grid;
    grid-template-columns: minmax(300px, 540px) auto;
    align-items: end;
    gap: 64px;
    margin-top: 42px;
}

.landing-hero__intro {
    margin: 0;
    color: rgba(255, 255, 255, 0.7);
    font-size: clamp(1rem, 1.5vw, 1.18rem);
    line-height: 1.65;
}

.landing-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.landing-button {
    min-height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 0 24px;
    border: 1px solid var(--landing-line);
    border-radius: 2px;
    background: rgba(13, 13, 13, 0.38);
    color: #fff;
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-decoration: none;
    backdrop-filter: blur(12px);
    transition: background 180ms ease, border-color 180ms ease, transform 180ms ease;
}

.landing-button:hover {
    transform: translateY(-2px);
    border-color: rgba(255, 255, 255, 0.36);
    background: rgba(255, 255, 255, 0.09);
}

.landing-button--primary {
    border-color: var(--landing-red);
    background: var(--landing-red);
}

.landing-button--primary:hover {
    border-color: #ed3151;
    background: #ed3151;
}

.landing-button--text {
    min-height: auto;
    padding: 0;
    border: 0;
    background: transparent;
    backdrop-filter: none;
}

.landing-button i {
    font-size: 1.08rem;
}

.landing-hero__rail {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(8, 8, 8, 0.72);
    backdrop-filter: blur(16px);
}

.landing-hero__rail-inner {
    min-height: 74px;
    display: grid;
    grid-template-columns: repeat(3, 1fr) auto;
    align-items: center;
}

.landing-stat {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding-right: 32px;
}

.landing-stat strong {
    font-size: 1.36rem;
}

.landing-stat span {
    color: rgba(255, 255, 255, 0.48);
    font-size: 0.66rem;
    font-weight: 750;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.landing-scroll {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: rgba(255, 255, 255, 0.48);
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-decoration: none;
    text-transform: uppercase;
}

.landing-section {
    padding: 112px 0;
}

.landing-section--surface {
    background: var(--landing-surface);
}

.landing-section__head {
    display: grid;
    grid-template-columns: 0.8fr 1.2fr;
    gap: 72px;
    align-items: end;
    margin-bottom: 58px;
}

.landing-eyebrow {
    margin: 0 0 14px;
    color: var(--landing-red);
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.landing-section h2 {
    margin: 0;
    font-size: clamp(2.45rem, 5vw, 4.7rem);
    letter-spacing: -0.055em;
    line-height: 0.98;
    text-wrap: balance;
}

.landing-section__lead {
    max-width: 620px;
    margin: 0;
    color: var(--landing-muted);
    font-size: 1.05rem;
    line-height: 1.75;
}

.landing-bento {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr 0.85fr;
    grid-template-rows: repeat(2, 235px);
    gap: 12px;
}

.landing-bento__card {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    padding: 28px;
    border: 1px solid var(--landing-line);
    background: #121212;
    color: var(--landing-text);
    text-decoration: none;
    transition: border-color 180ms ease, transform 180ms ease, background 180ms ease;
}

.landing-bento__card:first-child {
    grid-row: 1 / 3;
    padding: 36px;
    background:
        radial-gradient(circle at 0 100%, rgba(216, 32, 63, 0.2), transparent 48%),
        #151515;
}

.landing-bento__card:hover {
    z-index: 2;
    border-color: rgba(213, 177, 90, 0.55);
    background-color: #191919;
    transform: translateY(-3px);
}

.landing-bento__number {
    color: rgba(255, 255, 255, 0.3);
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.16em;
}

.landing-bento__icon {
    position: absolute;
    top: 26px;
    right: 26px;
    color: var(--landing-gold);
    font-size: 1.6rem;
}

.landing-bento__card:first-child .landing-bento__icon {
    font-size: 2.1rem;
}

.landing-bento__card h3 {
    max-width: 340px;
    margin: 0 0 12px;
    font-size: clamp(1.35rem, 2.4vw, 2.2rem);
    letter-spacing: -0.035em;
}

.landing-bento__card p {
    max-width: 390px;
    margin: 0;
    color: var(--landing-muted);
    font-size: 0.88rem;
    line-height: 1.6;
}

.landing-bento__arrow {
    position: absolute;
    right: 26px;
    bottom: 24px;
    color: rgba(255, 255, 255, 0.35);
}

.landing-about {
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
    gap: 96px;
    align-items: start;
}

.landing-about__mark {
    position: sticky;
    top: 34px;
    min-height: 490px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--landing-line);
    background:
        linear-gradient(135deg, rgba(216, 32, 63, 0.16), transparent 55%),
        var(--landing-surface);
}

.landing-about__mark::before,
.landing-about__mark::after {
    content: "";
    position: absolute;
    width: 110%;
    height: 1px;
    background: rgba(213, 177, 90, 0.26);
    transform: rotate(-28deg);
}

.landing-about__mark::after {
    transform: rotate(28deg);
}

.landing-about__mark img {
    position: relative;
    z-index: 1;
    width: min(68%, 330px);
    filter: drop-shadow(0 22px 45px rgba(0, 0, 0, 0.5));
}

.landing-about__copy {
    padding-top: 8px;
}

.landing-about__copy h2 {
    margin-bottom: 34px;
}

.landing-about__copy > p {
    margin: 0 0 22px;
    color: var(--landing-muted);
    font-size: 1.05rem;
    line-height: 1.82;
}

.landing-values {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    margin: 44px 0 38px;
    border-top: 1px solid var(--landing-line);
    border-left: 1px solid var(--landing-line);
}

.landing-value {
    min-height: 96px;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 20px;
    border-right: 1px solid var(--landing-line);
    border-bottom: 1px solid var(--landing-line);
}

.landing-value i {
    color: var(--landing-gold);
    font-size: 1.3rem;
}

.landing-value span {
    font-size: 0.77rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.landing-events {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}

.landing-event {
    display: block;
    overflow: hidden;
    border: 1px solid var(--landing-line);
    background: var(--landing-bg);
    text-decoration: none;
    transition: border-color 180ms ease, transform 180ms ease;
}

.landing-event:hover {
    border-color: rgba(213, 177, 90, 0.55);
    transform: translateY(-3px);
}

.landing-event__media {
    position: relative;
    aspect-ratio: 16 / 10;
    display: grid;
    place-items: center;
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(216, 32, 63, 0.18), transparent),
        #191919;
    color: rgba(255, 255, 255, 0.22);
    font-size: 3.5rem;
}

.landing-event__media img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 350ms ease;
}

.landing-event:hover .landing-event__media img {
    transform: scale(1.035);
}

.landing-event__body {
    padding: 24px;
}

.landing-event__date {
    margin-bottom: 10px;
    color: var(--landing-red);
    font-size: 0.69rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.landing-event h3 {
    margin: 0 0 18px;
    font-size: 1.22rem;
    letter-spacing: -0.025em;
}

.landing-event__meta {
    display: flex;
    align-items: center;
    gap: 7px;
    color: var(--landing-muted);
    font-size: 0.78rem;
}

.landing-section__foot {
    display: flex;
    justify-content: flex-end;
    margin-top: 28px;
}

.landing-social { display:grid; gap:52px; }
.landing-social__copy { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:40px; }
.landing-social__copy h2 { max-width:760px; margin-bottom:18px; }
.landing-social__copy p { max-width:650px; margin:0; color:rgba(255,255,255,.88); line-height:1.7; }
.landing-social__follow { align-self:end; }
.landing-social__lanes { display:grid; gap:38px; }
.landing-feed-group { min-width:0; }
.landing-feed-group__head { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:14px; padding-bottom:12px; border-bottom:1px solid var(--landing-line); }
.landing-page .landing-feed-group__title { display:flex; align-items:center; gap:10px; margin:0; color:#fff; font-size:.76rem; font-weight:850; letter-spacing:.16em; text-transform:uppercase; }
.landing-feed-group__title i { color:var(--landing-red); font-size:1rem; }
.landing-feed-group__hint { color:rgba(255,255,255,.76); font-size:.7rem; }
.landing-feed-frame { position:relative; min-width:0; }
.landing-feed-frame::before,.landing-feed-frame::after { content:""; position:absolute; top:0; bottom:10px; z-index:3; width:72px; pointer-events:none; opacity:0; transition:opacity .2s ease; }
.landing-feed-frame::before { left:0; background:linear-gradient(90deg,rgba(17,17,17,.88),transparent); }
.landing-feed-frame::after { right:0; background:linear-gradient(-90deg,rgba(17,17,17,.88),transparent); }
.landing-feed-frame.has-left::before,.landing-feed-frame.has-right::after { opacity:1; }
.landing-feed-arrow { position:absolute; top:50%; z-index:5; width:48px; height:48px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.3); border-radius:50%; background:rgba(8,8,8,.72); color:#fff; cursor:pointer; font-size:1.2rem; backdrop-filter:blur(12px); box-shadow:0 8px 24px rgba(0,0,0,.38); transform:translateY(-60%); transition:background .18s ease,border-color .18s ease,transform .18s ease,opacity .18s ease; }
.landing-feed-arrow--prev { left:14px; }
.landing-feed-arrow--next { right:14px; }
.landing-feed-arrow:hover:not(:disabled) { background:var(--landing-red); border-color:var(--landing-red); transform:translateY(-60%) scale(1.06); }
.landing-feed-arrow:focus-visible { outline:2px solid var(--landing-gold); outline-offset:3px; }
.landing-feed-arrow:disabled { opacity:0; pointer-events:none; }
.landing-feed { min-width:0; display:flex; gap:12px; overflow-x:auto; padding:2px 2px 10px; scroll-snap-type:x mandatory; scrollbar-width:none; }
.landing-feed::-webkit-scrollbar { display:none; }
.landing-feed__item { position:relative; flex:0 0 24%; min-width:225px; aspect-ratio:1; overflow:hidden; scroll-snap-align:start; border:1px solid var(--landing-line); background:#181818; }
.landing-feed--reels .landing-feed__item { flex-basis:18%; min-width:178px; aspect-ratio:9/15; }
.landing-feed__item img { width:100%; height:100%; object-fit:cover; transition:transform .35s ease,filter .35s ease; }
.landing-feed__item:hover img { transform:scale(1.045); filter:brightness(.78); }
.landing-feed__item::before { content:""; position:absolute; inset:auto 0 0; z-index:1; height:42%; background:linear-gradient(transparent,rgba(0,0,0,.76)); opacity:.8; pointer-events:none; }
.landing-feed__badge { position:absolute; left:12px; bottom:12px; z-index:2; display:inline-flex; align-items:center; gap:7px; color:#fff; font-size:.68rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.landing-feed__badge i { width:30px; height:30px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.34); border-radius:50%; background:rgba(0,0,0,.45); font-size:1rem; backdrop-filter:blur(7px); }
.landing-feed__loading { min-height:230px; display:grid; place-items:center; width:100%; border:1px solid var(--landing-line); color:var(--landing-muted); font-size:.8rem; }

.landing-cta {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 120px 0;
    border-top: 1px solid var(--landing-line);
    background:
        radial-gradient(circle at 78% 42%, rgba(216,32,63,.42), transparent 34%),
        radial-gradient(circle at 12% 100%, rgba(213,177,90,.16), transparent 35%),
        linear-gradient(125deg,#181010 0%,#100b0c 48%,#240b12 100%);
}
.landing-cta::before { content:""; position:absolute; inset:20% -8% auto 42%; z-index:-1; height:1px; background:linear-gradient(90deg,transparent,rgba(213,177,90,.72),transparent); transform:rotate(-9deg); }
.landing-cta::after { content:"TR"; position:absolute; right:-.03em; bottom:-.3em; z-index:-1; color:rgba(255,255,255,.025); font-size:clamp(14rem,31vw,34rem); font-weight:900; letter-spacing:-.12em; line-height:1; }

.landing-cta__inner {
    display: grid;
    grid-template-columns: 1.25fr 0.75fr;
    gap: 80px;
    align-items: end;
}

.landing-cta h2 {
    max-width: 800px;
    margin: 0;
    font-size: clamp(3rem, 6vw, 6.2rem);
    letter-spacing: -0.065em;
    line-height: 0.92;
}

.landing-cta__side {
    display: grid;
    gap: 24px;
    padding: 30px;
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(255,255,255,.045);
    backdrop-filter: blur(12px);
}

.landing-cta__side p {
    margin: 0;
    color: #fff;
    line-height: 1.7;
}

.landing-page footer.footer {
    background: #0a0a0a;
    color: var(--landing-text);
    border-top-color: var(--landing-line);
}

[data-theme="light"] .landing-page footer.footer,
[data-theme="light"] .landing-page footer.footer .footer-container,
[data-theme="light"] .landing-page footer.footer .footer-bottom {
    background: #0a0a0a;
    color: #aaa6a0;
}

[data-theme="light"] .landing-page footer.footer a,
[data-theme="light"] .landing-page footer.footer .brand-text {
    color: #f4f1ec;
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}

@media (max-width: 980px) {
    .landing-nav__links > a:not(.landing-nav__account) {
        display: none;
    }

    .landing-hero__bottom,
    .landing-section__head,
    .landing-about,
    .landing-social,
    .landing-cta__inner {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .landing-hero__bottom {
        align-items: start;
    }

    .landing-bento {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: 300px repeat(2, 220px);
    }

    .landing-bento__card:first-child {
        grid-column: 1 / 3;
        grid-row: auto;
    }

    .landing-about__mark {
        position: relative;
        top: auto;
        min-height: 380px;
    }

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

@media (max-width: 680px) {
    .landing-shell,
    .landing-hero__content {
        width: min(calc(100% - 32px), var(--landing-max));
    }

    .landing-nav {
        height: 74px;
    }

    .landing-brand img {
        width: 36px;
        height: 36px;
    }

    .landing-brand__copy small,
    .landing-nav__account {
        display: none;
    }

    .landing-nav__links {
        gap: 10px;
    }

    .landing-languages {
        padding-left: 10px;
    }

    .landing-hero {
        min-height: 700px;
        height: 100svh;
    }

    .landing-hero__shade {
        background:
            linear-gradient(90deg, rgba(5, 5, 5, 0.86), rgba(5, 5, 5, 0.28)),
            linear-gradient(0deg, #080808 0%, transparent 52%),
            linear-gradient(180deg, rgba(0, 0, 0, 0.58), transparent 28%);
    }

    .landing-hero__content {
        padding: 130px 0 150px;
    }

    .landing-hero h1 {
        font-size: clamp(3.5rem, 19vw, 5.7rem);
        line-height: 0.88;
    }

    .landing-hero__bottom {
        margin-top: 30px;
    }

    .landing-actions {
        width: 100%;
    }

    .landing-actions .landing-button {
        flex: 1;
    }

    .landing-hero__rail-inner {
        grid-template-columns: repeat(3, 1fr);
        min-height: 78px;
    }

    .landing-stat {
        display: grid;
        gap: 2px;
        padding: 0;
    }

    .landing-stat strong {
        font-size: 1rem;
    }

    .landing-stat span {
        font-size: 0.53rem;
    }

    .landing-scroll {
        display: none;
    }

    .landing-section {
        padding: 78px 0;
    }

    .landing-section__head {
        margin-bottom: 36px;
    }

    .landing-bento {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: none;
    }

    .landing-bento__card,
    .landing-bento__card:first-child {
        min-height: 220px;
        grid-column: auto;
        grid-row: auto;
        padding: 26px;
    }

    .landing-about {
        gap: 48px;
    }

    .landing-about__mark {
        min-height: 310px;
    }

    .landing-values {
        grid-template-columns: 1fr;
    }

    .landing-events {
        grid-template-columns: 1fr;
    }

    .landing-social__copy { grid-template-columns:1fr; }
    .landing-social__follow { justify-self:start; }
    .landing-feed__item { flex-basis:78%; min-width:240px; }
    .landing-feed--reels .landing-feed__item { flex-basis:53%; min-width:168px; }
    .landing-feed-group__hint { display:none; }
    .landing-feed-arrow { width:44px; height:44px; }
    .landing-feed-arrow--prev { left:8px; }
    .landing-feed-arrow--next { right:8px; }
    .landing-cta__side { padding:22px; }

    .landing-cta {
        padding: 84px 0;
    }
}
