@font-face {
    font-family: 'Plus Jakarta Sans';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url('../fonts/plus-jakarta-sans-latin.woff2') format('woff2');
}

@font-face {
    font-family: 'Plus Jakarta Sans';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/plus-jakarta-sans-latin.woff2') format('woff2');
}

@font-face {
    font-family: 'Plus Jakarta Sans';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('../fonts/plus-jakarta-sans-latin.woff2') format('woff2');
}

@font-face {
    font-family: 'Plus Jakarta Sans';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('../fonts/plus-jakarta-sans-latin.woff2') format('woff2');
}

@font-face {
    font-family: 'Plus Jakarta Sans';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('../fonts/plus-jakarta-sans-latin.woff2') format('woff2');
}

@font-face {
    font-family: 'Outfit';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url('../fonts/outfit-latin.woff2') format('woff2');
}

@font-face {
    font-family: 'Outfit';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/outfit-latin.woff2') format('woff2');
}

@font-face {
    font-family: 'Outfit';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('../fonts/outfit-latin.woff2') format('woff2');
}

@font-face {
    font-family: 'Outfit';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('../fonts/outfit-latin.woff2') format('woff2');
}

@font-face {
    font-family: 'Outfit';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('../fonts/outfit-latin.woff2') format('woff2');
}

@font-face {
    font-family: 'Cormorant Garamond';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url('../fonts/cormorant-garamond-latin.woff2') format('woff2');
}

@font-face {
    font-family: 'Cormorant Garamond';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/cormorant-garamond-latin.woff2') format('woff2');
}

@font-face {
    font-family: 'Cormorant Garamond';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('../fonts/cormorant-garamond-latin.woff2') format('woff2');
}

@font-face {
    font-family: 'Cormorant Garamond';
    font-style: italic;
    font-weight: 300;
    font-display: swap;
    src: url('../fonts/cormorant-garamond-italic-latin.woff2') format('woff2');
}

@font-face {
    font-family: 'Cormorant Garamond';
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/cormorant-garamond-italic-latin.woff2') format('woff2');
}

@font-face {
    font-family: 'JetBrains Mono';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/jetbrains-mono-latin.woff2') format('woff2');
}

@font-face {
    font-family: 'JetBrains Mono';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('../fonts/jetbrains-mono-latin.woff2') format('woff2');
}

@font-face {
    font-family: 'Velvet Signature';
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    src: url('../fonts/velvet-signature.woff2') format('truetype');
}

*,
:after,
:before {
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-pan-x: ;
    --tw-pan-y: ;
    --tw-pinch-zoom: ;
    --tw-scroll-snap-strictness: proximity;
    --tw-gradient-from-position: ;
    --tw-gradient-via-position: ;
    --tw-gradient-to-position: ;
    --tw-ordinal: ;
    --tw-slashed-zero: ;
    --tw-numeric-figure: ;
    --tw-numeric-spacing: ;
    --tw-numeric-fraction: ;
    --tw-ring-inset: ;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgba(59, 130, 246, .5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-blur: ;
    --tw-brightness: ;
    --tw-contrast: ;
    --tw-grayscale: ;
    --tw-hue-rotate: ;
    --tw-invert: ;
    --tw-saturate: ;
    --tw-sepia: ;
    --tw-drop-shadow: ;
    --tw-backdrop-blur: ;
    --tw-backdrop-brightness: ;
    --tw-backdrop-contrast: ;
    --tw-backdrop-grayscale: ;
    --tw-backdrop-hue-rotate: ;
    --tw-backdrop-invert: ;
    --tw-backdrop-opacity: ;
    --tw-backdrop-saturate: ;
    --tw-backdrop-sepia: ;
    --tw-contain-size: ;
    --tw-contain-layout: ;
    --tw-contain-paint: ;
    --tw-contain-style:
}

::backdrop {
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-pan-x: ;
    --tw-pan-y: ;
    --tw-pinch-zoom: ;
    --tw-scroll-snap-strictness: proximity;
    --tw-gradient-from-position: ;
    --tw-gradient-via-position: ;
    --tw-gradient-to-position: ;
    --tw-ordinal: ;
    --tw-slashed-zero: ;
    --tw-numeric-figure: ;
    --tw-numeric-spacing: ;
    --tw-numeric-fraction: ;
    --tw-ring-inset: ;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgba(59, 130, 246, .5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-blur: ;
    --tw-brightness: ;
    --tw-contrast: ;
    --tw-grayscale: ;
    --tw-hue-rotate: ;
    --tw-invert: ;
    --tw-saturate: ;
    --tw-sepia: ;
    --tw-drop-shadow: ;
    --tw-backdrop-blur: ;
    --tw-backdrop-brightness: ;
    --tw-backdrop-contrast: ;
    --tw-backdrop-grayscale: ;
    --tw-backdrop-hue-rotate: ;
    --tw-backdrop-invert: ;
    --tw-backdrop-opacity: ;
    --tw-backdrop-saturate: ;
    --tw-backdrop-sepia: ;
    --tw-contain-size: ;
    --tw-contain-layout: ;
    --tw-contain-paint: ;
    --tw-contain-style:
}

*,
:after,
:before {
    box-sizing: border-box;
    border: 0 solid #e5e7eb
}

:after,
:before {
    --tw-content: ""
}

:host,
html {
    line-height: 1.5;
    cursor: default;
    -webkit-text-size-adjust: 100%;
    -moz-tab-size: 4;
    -o-tab-size: 4;
    tab-size: 4;
    font-family: Plus Jakarta Sans, sans-serif;
    font-feature-settings: normal;
    font-variation-settings: normal;
    -webkit-tap-highlight-color: transparent
}

body {
    margin: 0;
    line-height: inherit
}

hr {
    height: 0;
    color: inherit;
    border-top-width: 1px
}

abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: inherit;
    font-weight: inherit
}

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

b,
strong {
    font-weight: 700
}

code,
kbd,
pre,
samp {
    font-family: JetBrains Mono, monospace;
    font-feature-settings: normal;
    font-variation-settings: normal;
    font-size: 1em
}

small {
    font-size: 80%
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse
}

button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    font-size: 100%;
    font-weight: inherit;
    line-height: inherit;
    letter-spacing: inherit;
    color: inherit;
    margin: 0;
    padding: 0
}

button,
select {
    text-transform: none
}

button,
input:where([type=button]),
input:where([type=reset]),
input:where([type=submit]) {
    -webkit-appearance: button;
    background-color: transparent;
    background-image: none
}

:-moz-focusring {
    outline: auto
}

:-moz-ui-invalid {
    box-shadow: none
}

progress {
    vertical-align: baseline
}

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
    height: auto
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

summary {
    display: list-item
}

blockquote,
dd,
dl,
figure,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
p,
pre {
    margin: 0;
    cursor: default;
}

fieldset {
    margin: 0
}

fieldset,
legend {
    padding: 0
}

menu,
ol,
ul {
    list-style: none;
    margin: 0;
    padding: 0
}

dialog {
    padding: 0
}

textarea {
    resize: vertical
}

input::-moz-placeholder,
textarea::-moz-placeholder {
    opacity: 1;
    color: #9ca3af
}

input::placeholder,
textarea::placeholder {
    opacity: 1;
    color: #9ca3af
}

[role=button],
button {
    cursor: pointer
}

:disabled {
    cursor: default
}

audio,
canvas,
embed,
iframe,
img,
object,
svg,
video {
    display: block;
    vertical-align: middle
}

img,
video {
    max-width: 100%;
    height: auto
}

[hidden]:where(:not([hidden=until-found])) {
    display: none
}

.container {
    width: 100%
}

@media (min-width:640px) {
    .container {
        max-width: 640px
    }
}

@media (min-width:768px) {
    .container {
        max-width: 768px
    }
}

@media (min-width:1024px) {
    .container {
        max-width: 1024px
    }
}

@media (min-width:1280px) {
    .container {
        max-width: 1280px
    }
}

@media (min-width:1536px) {
    .container {
        max-width: 1536px
    }
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0
}

.pointer-events-none {
    pointer-events: none
}

.visible {
    visibility: visible
}

.fixed {
    position: fixed
}

.absolute {
    position: absolute
}

.relative {
    position: relative
}

.inset-0 {
    inset: 0
}

.bottom-0 {
    bottom: 0
}

.bottom-10 {
    bottom: 2.5rem
}

.left-0 {
    left: 0
}

.left-10 {
    left: 2.5rem
}

.left-8 {
    left: 2rem
}

.right-0 {
    right: 0
}

.right-10 {
    right: 2.5rem
}

.top-0 {
    top: 0
}

.top-8 {
    top: 2rem
}

.z-0 {
    z-index: 0
}

.z-10 {
    z-index: 10
}

.z-20 {
    z-index: 20
}

.z-\[100\] {
    z-index: 100
}

.z-\[110\] {
    z-index: 110
}

.order-1 {
    order: 1
}

.order-2 {
    order: 2
}

.mx-4 {
    margin-left: 1rem;
    margin-right: 1rem
}

.mx-auto {
    margin-left: auto;
    margin-right: auto
}

.mxy-4 {
	margin: 1.4rem;
}

.mb-1 {
    margin-bottom: .25rem
}

.mb-10 {
    margin-bottom: 2.5rem
}

.mb-12 {
    margin-bottom: 3rem
}

.mb-16 {
    margin-bottom: 4rem
}

.mb-2 {
    margin-bottom: .5rem
}

.mb-20 {
    margin-bottom: 5rem
}

.mb-24 {
    margin-bottom: 6rem
}

.mb-3 {
    margin-bottom: .75rem
}

.mb-4 {
    margin-bottom: 1rem
}

.mb-6 {
    margin-bottom: 1.5rem
}

.mb-8 {
    margin-bottom: 2rem
}

.ml-6 {
    margin-left: 1.5rem
}

.mt-1 {
    margin-top: .25rem
}

.mt-10 {
    margin-top: 2.5rem
}

.mt-12 {
    margin-top: 3rem
}

.mt-16 {
    margin-top: 4rem
}

.mt-2 {
    margin-top: .5rem
}

.mt-24 {
    margin-top: 6rem
}

.mt-4 {
    margin-top: 1rem
}

.mt-5 {
	margin-top: 1.5rem;
}

.mt-8 {
    margin-top: 2rem
}

.mt-a {
    margin-top: auto
}

.block {
    display: block
}

.inline-block {
    display: inline-block
}

.flex {
    display: flex
}

.table {
    display: table
}

.grid {
    display: grid
}

.hidden {
    display: none
}

.aspect-\[4\/5\] {
    aspect-ratio: 4/5
}

.aspect-\[8\/7\] {
    aspect-ratio: 8/7
}

.aspect-square {
    aspect-ratio: 1/1
}

.h-1 {
    height: .25rem
}

.h-1\.5 {
    height: .375rem
}

.h-12 {
    height: 3rem
}

.h-16 {
    height: 4rem
}

.h-2 {
    height: .5rem
}

.h-24 {
    height: 6rem
}

.h-3 {
    height: .75rem
}

.h-32 {
    height: 8rem
}

.h-4 {
    height: 1rem
}

.h-40 {
    height: 10rem
}

.h-48 {
    height: 12rem
}

.h-5 {
    height: 1.25rem
}

.h-64 {
    height: 16rem
}

.h-96 {
    height: 24rem
}

.h-120 {
    height: 30rem;
}

.h-\[600px\] {
    height: 600px
}

.h-\[800px\] {
    height: 800px
}

.h-full {
    height: 100%
}

.h-px {
    height: 1px
}

.min-h {
    height: 100%
}

.min-h-screen {
    min-height: 100vh
}

.w-1 {
    width: .25rem
}

.w-12 {
    width: 3rem
}

.w-16 {
    width: 4rem
}

.w-2 {
    width: .5rem
}

.w-24 {
    width: 6rem
}

.w-32 {
    width: 8rem
}

.w-4 {
    width: 1rem
}

.w-5 {
    width: 1.25rem
}

.w-64 {
  width: 16rem;
}

.w-\[320px\] {
    width: 320px
}

.w-\[600px\] {
    width: 600px
}

.w-\[800px\] {
    width: 800px
}

.w-logo {
	width: 1.5rem;
}

.w-full {
    width: 100%
}

.w-min {
    width: min-content
}

.min-w-\[820px\] {
    min-width: 820px
}

.max-w-2xl {
    max-width: 42rem
}

.max-w-3xl {
    max-width: 48rem
}

.max-w-4xl {
    max-width: 56rem
}

.max-w-5xl {
    max-width: 64rem
}

.max-w-7xl {
    max-width: 80rem
}

.max-w-md {
    max-width: 28rem
}

.max-w-xl {
    max-width: 36rem
}

.w-10 {
    width: 2.5rem;
}

.h-10 {
    height: 2.5rem;
}

.flex-shrink-0 {
    flex-shrink: 0
}

.border-collapse {
    border-collapse: collapse
}

.origin-right {
    transform-origin: right
}

.-translate-x-1\/4 {
    --tw-translate-x: -25%
}

.-translate-x-1\/4,
.-translate-y-1\/2 {
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.-translate-y-1\/2 {
    --tw-translate-y: -50%
}

.translate-x-1\/3 {
    --tw-translate-x: 33.333333%
}

.translate-x-1\/3,
.translate-y-0 {
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.translate-y-0 {
    --tw-translate-y: 0px
}

.translate-y-1\/2 {
    --tw-translate-y: 50%
}

.translate-y-10,
.translate-y-1\/2 {
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.translate-y-10 {
    --tw-translate-y: 2.5rem
}

.translate-y-20 {
    --tw-translate-y: 5rem
}

.-skew-y-6,
.translate-y-20 {
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.-skew-y-6 {
    --tw-skew-y: -6deg
}

.scale-110 {
    --tw-scale-x: 1.1;
    --tw-scale-y: 1.1;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

@keyframes pulse {
    50% {
        opacity: .5
    }
}

.animate-pulse {
    animation: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite
}

.cursor-pointer {
    cursor: pointer
}

.resize-none {
    resize: none
}

.list-disc {
    list-style-type: disc
}

.appearance-none {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

.flex-col {
    flex-direction: column
}

.flex-wrap {
    flex-wrap: wrap
}

.items-start {
    align-items: flex-start
}

.items-end {
    align-items: flex-end
}

.items-center {
    align-items: center
}

.justify-start {
    justify-content: flex-start
}

.justify-end {
    justify-content: flex-end
}

.justify-center {
    justify-content: center
}

.justify-icenter {
    justify-items: center
}

.justify-between {
    justify-content: space-between
}

.gap-1 {
    gap: .25rem
}

.gap-10 {
    gap: 2.5rem
}

.gap-12 {
    gap: 3rem
}

.gap-16 {
    gap: 4rem
}

.gap-2 {
    gap: .5rem
}

.gap-3 {
    gap: .75rem
}

.gap-4 {
    gap: 1rem
}

.gap-6 {
    gap: 1.5rem
}

.gap-8 {
    gap: 2rem
}

.divider {
	width: 1px;
    height: 1.8rem;
	flex-shrink: 0;
    background-color: #404040;
}

.share-button {
    background-color: #171717;
    border-radius: 17px;
    padding: 7px;
}

.space-y-10>:not([hidden])~:not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: calc(2.5rem*(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(2.5rem*var(--tw-space-y-reverse))
}

.space-y-12>:not([hidden])~:not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: calc(3rem*(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(3rem*var(--tw-space-y-reverse))
}

.space-y-2>:not([hidden])~:not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: calc(.5rem*(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(.5rem*var(--tw-space-y-reverse))
}

.space-y-24>:not([hidden])~:not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: calc(6rem*(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(6rem*var(--tw-space-y-reverse))
}

.space-y-3>:not([hidden])~:not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: calc(.75rem*(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(.75rem*var(--tw-space-y-reverse))
}

.space-y-4>:not([hidden])~:not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: calc(1rem*(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(1rem*var(--tw-space-y-reverse))
}

.space-y-6>:not([hidden])~:not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: calc(1.5rem*(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(1.5rem*var(--tw-space-y-reverse))
}

.space-y-8>:not([hidden])~:not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: calc(2rem*(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(2rem*var(--tw-space-y-reverse))
}

.overflow-hidden {
    overflow: hidden
}

.overflow-x-auto {
    overflow-x: auto
}

.whitespace-nowrap {
    white-space: nowrap
}

.rounded {
    border-radius: .25rem
}

.rounded-3 {
	border-radius: .75rem;
}

.rounded-full {
    border-radius: 9999px
}

.rounded-sm {
    border-radius: .125rem
}

.border {
    border-width: 1px;
    border-radius: 24px
}

.border-box {
    border-radius: 24px
}

.border-y {
    border-top-width: 1px
}

.border-b,
.border-y {
    border-bottom-width: 1px
}

.border-l {
    border-left-width: 1px
}

.border-l-2 {
    border-left-width: 2px
}

.border-l-4 {
    border-left-width: 4px
}

.border-t {
    border-top-width: 1px
}

.border-brand-gold {
    --tw-border-opacity: 1;
    border-color: rgb(197 160 89/var(--tw-border-opacity, 1))
}

.border-brand-gold\/10 {
    border-color: rgba(197, 160, 89, .1)
}

.border-brand-gold\/20 {
    border-color: rgba(197, 160, 89, .2)
}

.border-brand-gold\/30 {
    border-color: rgba(197, 160, 89, .3)
}

.border-brand-line {
    border-color: hsla(0, 0%, 100%, .06)
}

.border-transparent {
    border-color: transparent
}

.border-white\/10 {
    border-color: hsla(0, 0%, 100%, .1)
}

.border-line-bottom {
	margin: 0 1.4rem;
	border-bottom: 1px solid #404040;
    padding-bottom: 1.5rem;
}

.border-line-bottom-full {
	width: 100%;
    border-bottom: 1px solid #404040;
    padding-bottom: 1.5rem;
}

.bg-brand-bg {
    --tw-bg-opacity: 1;
    background-color: rgb(5 5 5/var(--tw-bg-opacity, 1))
}

.bg-brand-bg\/80 {
    background-color: rgba(5, 5, 5, .8)
}

.bg-brand-bg-dim {
	background-color: rgb(24 24 24 / 80%)
}

.bg-brand-gold {
    --tw-bg-opacity: 1;
    background-color: rgb(197 160 89/var(--tw-bg-opacity, 1))
}

.bg-brand-gold\/10 {
    background-color: rgba(197, 160, 89, .1)
}

.bg-brand-gold\/30 {
    background-color: rgba(197, 160, 89, .3)
}

.bg-brand-gold\/5 {
    background-color: rgba(197, 160, 89, .05)
}

.bg-brand-gold\/\[0\.02\] {
    background-color: rgba(197, 160, 89, .02)
}

.bg-brand-gold\/\[0\.03\] {
    background-color: rgba(197, 160, 89, .03)
}

.bg-brand-line {
    background-color: hsla(0, 0%, 100%, .06)
}

.bg-transparent {
    background-color: transparent
}

.bg-white\/5 {
    background-color: hsla(0, 0%, 100%, .05)
}

.bg-white\/\[0\.01\] {
    background-color: hsla(0, 0%, 100%, .01)
}

.bg-white\/\[0\.02\] {
    background-color: hsla(0, 0%, 100%, .02)
}

.bg-\[linear-gradient\(to_right\2c \#ffffff03_1px\2c transparent_1px\)\2c linear-gradient\(to_bottom\2c \#ffffff03_1px\2c transparent_1px\)\] {
    background-image: linear-gradient(90deg, #ffffff03 1px, transparent 0), linear-gradient(180deg, #ffffff03 1px, transparent 0)
}

.bg-\[radial-gradient\(circle_at_center\2c _var\(--color-brand-gold\)_0\%\2c transparent_70\%\)\] {
    background-image: radial-gradient(circle at center, var(--color-brand-gold) 0, transparent 70%)
}

.bg-\[size\:40px_40px\] {
    background-size: 40px 40px
}

.stroke-\[1\.5\] {
    stroke-width: 1.5
}

.p-10 {
    padding: 2.5rem
}

.p-12 {
    padding: 3rem
}

.p-2 {
    padding: .5rem
}

.p-4 {
    padding: 1rem
}

.p-6 {
    padding: 1.5rem
}

.p-8 {
    padding: 2rem
}

.\!px-10 {
    padding-left: 2.5rem !important;
    padding-right: 2.5rem !important
}

.\!py-4 {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important
}

.\!py-5 {
    padding-top: 1.25rem !important;
    padding-bottom: 1.25rem !important
}

.px-0 {
    padding-left: 0;
    padding-right: 0
}

.px-12 {
    padding-left: 3rem;
    padding-right: 3rem
}

.px-2 {
    padding-left: .5rem;
    padding-right: .5rem
}

.px-4 {
    padding-left: 1rem;
    padding-right: 1rem
}

.px-6 {
    padding-left: 1.5rem;
    padding-right: 1.5rem
}

.py-0\.5 {
    padding-top: .125rem;
    padding-bottom: .125rem
}

.py-2 {
    padding-top: .5rem;
    padding-bottom: .5rem
}

.py-20 {
    padding-top: 5rem;
    padding-bottom: 5rem
}

.py-24 {
    padding-top: 6rem;
    padding-bottom: 6rem
}

.py-32 {
    padding-top: 8rem;
    padding-bottom: 8rem
}

.py-4 {
    padding-top: 1rem;
    padding-bottom: 1rem
}

.py-6 {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem
}

.py-8 {
    padding-top: 2rem;
    padding-bottom: 2rem
}

.py-img {
	padding-top: 2rem;
    padding-bottom: 2rem;
}

.pb-20 {
    padding-bottom: 5rem
}

.pb-24 {
    padding-bottom: 6rem
}

.pb-3 {
    padding-bottom: .75rem
}

.pb-4 {
    padding-bottom: 1rem
}

.pb-9 {
    padding-bottom: 3.5rem
}

.pl-4 {
    padding-left: 1rem
}

.pl-6 {
    padding-left: 1.5rem
}

.pt-10 {
    padding-top: 2.5rem
}

.pt-12 {
    padding-top: 3rem
}

.pt-32 {
    padding-top: 8rem
}

.pt-4 {
    padding-top: 1rem
}

.pt-40 {
    padding-top: 10rem
}

.pt-45 {
    padding-top: 15rem
}

.text-left {
    text-align: left
}

.text-center {
    text-align: center
}

.content-center {
	align-items: center;
}

.font-display {
    font-family: Outfit, sans-serif
}

.font-mono {
    font-family: JetBrains Mono, monospace
}

.font-serif {
    font-family: Cormorant Garamond, serif
}

.\!text-\[8px\] {
    font-size: 8px !important
}

.\!text-\[11px\] {
    font-size: 11px !important
}

.\!text-sm {
    font-size: .875rem !important;
    line-height: 1.25rem !important
}

.text-1xl {
	font-size: 1.3rem;
    line-height: 2rem;
}

.text-2xl {
    font-size: 1.5rem;
    line-height: 2rem
}

.text-3xl {
    font-size: 1.875rem;
    line-height: 2.25rem
}

.text-4xl {
    font-size: 2.25rem;
}

.text-5xl {
    font-size: 3rem;
    line-height: 1
}

.text-6xl {
    font-size: 3.75rem;
    line-height: 1
}

.text-8xl {
    font-size: 6rem;
    line-height: 1
}

.text-\[12px\] {
    font-size: 12px
}

.text-\[10px\] {
    font-size: 10px
}

.text-\[8px\] {
    font-size: 8px
}

.text-\[9px\] {
    font-size: 9px
}

.text-base {
    font-size: 1rem;
    line-height: 1.5rem
}

.text-lg {
    font-size: 1.125rem;
    line-height: 1.75rem
}

.text-sm {
    font-size: .875rem;
    line-height: 1.25rem
}

.text-xl {
    font-size: 1.25rem;
    line-height: 1.75rem
}

.text-xs {
    font-size: .75rem;
    line-height: 1rem
}

.font-bold {
    font-weight: 700
}

.font-light {
    font-weight: 300
}

.font-medium {
    font-weight: 500
}

.uppercase {
    text-transform: uppercase
}

.italic {
    font-style: italic
}

.underline {
    text-decoration: underline;
    text-decoration-color: #c5a15b;
    text-underline-offset: 6px;
}

.underline-spot {
    text-decoration-skip-ink: auto;
    text-underline-position: from-font;
    vertical-align: baseline;
    text-decoration-line: underline;
    text-decoration-color: #c5a05b;
    text-underline-offset: 2px;
    text-decoration-style: dotted;
    text-decoration-thickness: 1px;
    display: inline;
}

.spot-jumper {
    font-weight: 600;
    color: rgb(197 160 89);
    cursor: pointer;
}

.tabular-nums {
    --tw-numeric-spacing: tabular-nums;
    font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction)
}

.leading-\[0\.9\] {
    line-height: .9
}

.leading-\[1\.1\] {
    line-height: 1.1
}

.leading-none {
    line-height: 1
}

.leading-relaxed {
    line-height: 1.625
}

.leading-tight {
    line-height: 1.25
}

.tracking-\[0\.2em\] {
    letter-spacing: .2em
}

.tracking-\[0\.3em\] {
    letter-spacing: .3em
}

.tracking-\[0\.4em\] {
    letter-spacing: .4em
}

.tracking-tight {
    letter-spacing: -.025em
}

.tracking-tighter {
    letter-spacing: -.05em
}

.tracking-widest {
    letter-spacing: .1em
}

.\!text-brand-gold {
    --tw-text-opacity: 1 !important;
    color: rgb(197 160 89/var(--tw-text-opacity, 1)) !important
}

.\!text-white\/50 {
    color: hsla(0, 0%, 100%, .5) !important
}

.text-black {
    --tw-text-opacity: 1;
    color: rgb(0 0 0/var(--tw-text-opacity, 1))
}

.text-brand-bg {
    --tw-text-opacity: 1;
    color: rgb(5 5 5/var(--tw-text-opacity, 1)) !important
}

.text-brand-gold {
    --tw-text-opacity: 1;
    color: rgb(197 160 89/var(--tw-text-opacity, 1))
}

.text-brand-gold\/10 {
    color: rgba(197, 160, 89, .1)
}

.text-brand-gold\/30 {
    color: rgba(197, 160, 89, .3)
}

.text-brand-gold\/40 {
    color: rgba(197, 160, 89, .4)
}

.text-brand-gold\/50 {
    color: rgba(197, 160, 89, .5)
}

.text-brand-gold\/60 {
    color: rgba(197, 160, 89, .6)
}

.text-brand-gold\/70 {
    color: rgba(197, 160, 89, .7)
}

.text-brand-gold\/80 {
    color: rgba(197, 160, 89, .8)
}

.text-brand-ink {
    --tw-text-opacity: 1;
    color: rgb(255 255 255/var(--tw-text-opacity, 1))
}

.text-brand-notice {
    --tw-text-opacity: 1;
    color: rgb(255 182 182)
}

.text-brand-muted {
    --tw-text-opacity: 1;
    color: rgb(165 165 165/var(--tw-text-opacity, 1))
}

.text-white {
    --tw-text-opacity: 1;
    color: rgb(255 255 255/var(--tw-text-opacity, 1))
}

.antialiased {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.accent-brand-gold {
    accent-color: #c5a059
}

.opacity-0 {
    opacity: 0
}

.opacity-10 {
    opacity: .1
}

.opacity-100 {
    opacity: 1
}

.opacity-20 {
    opacity: .2
}

.opacity-50 {
    opacity: .5
}

.opacity-60 {
    opacity: .6
}

.opacity-70 {
    opacity: .7
}

.opacity-80 {
    opacity: .8
}

.outline-none {
    outline: 2px solid transparent;
    outline-offset: 2px
}

.outline {
    outline-style: solid
}

.blur-\[100px\] {
    --tw-blur: blur(100px)
}

.blur-\[100px\],
.blur-\[120px\] {
    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
}

.blur-\[120px\] {
    --tw-blur: blur(120px)
}

.filter {
    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
}

.backdrop-blur-md {
    --tw-backdrop-blur: blur(12px);
    -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
    backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)
}

.transition {
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    transition-duration: .15s
}

.transition-all {
    transition-property: all;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    transition-duration: .15s
}

.transition-colors {
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    transition-duration: .15s
}

.transition-opacity {
    transition-property: opacity;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    transition-duration: .15s
}

.transition-transform {
    transition-property: transform;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    transition-duration: .15s
}

.duration-500 {
    transition-duration: .5s
}

.duration-700 {
    transition-duration: .7s
}

.duration-\[7000ms\] {
    transition-duration: 7s
}

.ease-linear {
    transition-timing-function: linear
}

.ease-out {
    transition-timing-function: cubic-bezier(0, 0, .2, 1)
}

.selection\:bg-brand-gold ::-moz-selection {
    --tw-bg-opacity: 1;
    background-color: rgb(197 160 89/var(--tw-bg-opacity, 1))
}

.selection\:bg-brand-gold ::selection {
    --tw-bg-opacity: 1;
    background-color: rgb(197 160 89/var(--tw-bg-opacity, 1))
}

.selection\:text-brand-bg ::-moz-selection {
    --tw-text-opacity: 1;
    color: rgb(5 5 5/var(--tw-text-opacity, 1))
}

.selection\:text-brand-bg ::selection {
    --tw-text-opacity: 1;
    color: rgb(5 5 5/var(--tw-text-opacity, 1))
}

.selection\:bg-brand-gold::-moz-selection {
    --tw-bg-opacity: 1;
    background-color: rgb(197 160 89/var(--tw-bg-opacity, 1))
}

.selection\:bg-brand-gold::selection {
    --tw-bg-opacity: 1;
    background-color: rgb(197 160 89/var(--tw-bg-opacity, 1))
}

.selection\:text-brand-bg::-moz-selection {
    --tw-text-opacity: 1;
    color: rgb(5 5 5/var(--tw-text-opacity, 1))
}

.selection\:text-brand-bg::selection {
    --tw-text-opacity: 1;
    color: rgb(5 5 5/var(--tw-text-opacity, 1))
}

.empty\:hidden:empty {
    display: none
}

.hover\:border-brand-gold:hover {
    --tw-border-opacity: 1;
    border-color: rgb(197 160 89/var(--tw-border-opacity, 1))
}

.hover\:bg-brand-gold:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(197 160 89/var(--tw-bg-opacity, 1))
}

.hover\:bg-brand-gold-bright:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(249 241 209/var(--tw-bg-opacity, 1))
}

.hover\:tracking-\[0\.6em\]:hover {
    letter-spacing: .6em
}

.hover\:text-brand-bg:hover {
    --tw-text-opacity: 1;
    color: rgb(5 5 5/var(--tw-text-opacity, 1))
}

.hover\:text-brand-gold:hover {
    --tw-text-opacity: 1;
    color: rgb(197 160 89/var(--tw-text-opacity, 1))
}

.hover\:text-brand-gold-bright:hover {
    --tw-text-opacity: 1;
    color: rgb(249 241 209/var(--tw-text-opacity, 1))
}

.hover\:text-white:hover {
    --tw-text-opacity: 1;
    color: rgb(255 255 255/var(--tw-text-opacity, 1))
}

.hover\:shadow-\[0_0_50px_rgba\(197\2c 160\2c 89\2c 0\.3\)\]:hover {
    --tw-shadow: 0 0 50px rgba(197, 160, 89, .3);
    --tw-shadow-colored: 0 0 50px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.focus\:border-brand-gold:focus {
    --tw-border-opacity: 1;
    border-color: rgb(197 160 89/var(--tw-border-opacity, 1))
}

.focus\:outline-none:focus {
    outline: 2px solid transparent;
    outline-offset: 2px
}

.group\/btn:hover .group-hover\/btn\:-translate-x-1 {
    --tw-translate-x: -0.25rem
}

.group\/btn:hover .group-hover\/btn\:-translate-x-1,
.group\/btn:hover .group-hover\/btn\:translate-x-1 {
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.group\/btn:hover .group-hover\/btn\:translate-x-1 {
    --tw-translate-x: 0.25rem
}

.group:hover .group-hover\:translate-x-2 {
    --tw-translate-x: 0.5rem
}

.group:hover .group-hover\:scale-110,
.group:hover .group-hover\:translate-x-2 {
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.group:hover .group-hover\:scale-110 {
    --tw-scale-x: 1.1;
    --tw-scale-y: 1.1
}

.group:hover .group-hover\:border-brand-gold\/30 {
    border-color: rgba(197, 160, 89, .3)
}

.group:hover .group-hover\:text-brand-gold {
    --tw-text-opacity: 1;
    color: rgb(197 160 89/var(--tw-text-opacity, 1))
}

.group:hover .group-hover\:text-brand-ink {
    --tw-text-opacity: 1;
    color: rgb(255 255 255/var(--tw-text-opacity, 1))
}

.group:hover .group-hover\:opacity-100 {
    opacity: 1
}

.peer:checked~.peer-checked\:border-brand-gold {
    --tw-border-opacity: 1;
    border-color: rgb(197 160 89/var(--tw-border-opacity, 1))
}

.peer:checked~.peer-checked\:bg-brand-gold {
    --tw-bg-opacity: 1;
    background-color: rgb(197 160 89/var(--tw-bg-opacity, 1))
}

.peer:checked~.peer-checked\:opacity-100 {
    opacity: 1
}

@media (min-width:640px) {
    .sm\:grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .sm\:grid-cols-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

    .sm\:flex-row {
        flex-direction: row
    }

    .sm\:items-end {
        align-items: flex-end
    }

    .sm\:justify-between {
        justify-content: space-between
    }
}

@media (min-width:768px) {
    .md\:col-span-12 {
        grid-column: span 12/span 12
    }

    .md\:col-span-2 {
        grid-column: span 2/span 2
    }

    .md\:col-span-4 {
        grid-column: span 4/span 4
    }

    .md\:col-span-6 {
        grid-column: span 6/span 6
    }

    .md\:block {
        display: block
    }

    .md\:flex {
        display: flex
    }

    .md\:hidden {
        display: none
    }

    .md\:grid-cols-12 {
        grid-template-columns: repeat(12, minmax(0, 1fr))
    }

    .md\:grid-cols-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

    .md\:grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }

    .md\:flex-row {
        flex-direction: row
    }

    .md\:whitespace-nowrap {
        white-space: nowrap
    }

    .md\:p-10 {
        padding: 2.5rem
    }

    .md\:p-12 {
        padding: 3rem
    }

    .md\:py-8 {
        padding-top: 2rem;
        padding-bottom: 2rem
    }

    .md\:text-4xl {
        font-size: 2.25rem;
        line-height: 2.5rem
    }

    .md\:text-5xl {
        font-size: 3rem;
        line-height: 1
    }

    .md\:text-6xl {
        font-size: 3.75rem;
        line-height: 1
    }

    .md\:text-7xl {
        font-size: 4.5rem;
        line-height: 1
    }

    .px-8 {
        padding-left: 2rem;
        padding-right: 2rem
    }
}

@media (min-width:1024px) {
    .lg\:order-1 {
        order: 1
    }

    .lg\:order-2 {
        order: 2
    }

    .lg\:col-span-4 {
        grid-column: span 4/span 4
    }

    .lg\:col-span-5 {
        grid-column: span 5/span 5
    }

    .lg\:col-span-7 {
        grid-column: span 7/span 7
    }

    .lg\:col-span-8 {
        grid-column: span 8/span 8
    }

    .lg\:h-\[600px\] {
        height: 600px
    }

    .lg\:scale-125 {
        --tw-scale-x: 1.25;
        --tw-scale-y: 1.25;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
    }

    .lg\:grid-cols-12 {
        grid-template-columns: repeat(12, minmax(0, 1fr))
    }

    .lg\:grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .lg\:pl-12 {
        padding-left: 3rem
    }
}

:root {
    --color-brand-bg: #050505;
    --color-brand-ink: #FFFFFF;
    --color-brand-gold: #C5A059;
    --color-brand-gold-muted: #846A32;
    --color-brand-gold-bright: #F9F1D1;
    --color-brand-line: rgba(255, 255, 255, 0.06);
    --color-brand-muted: #717171;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    overflow-wrap: break-word;
}

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

html,
body {
    max-width: 100%;
    overflow-x: hidden;
    width: 100%;
    position: relative;
    -webkit-overflow-scrolling: touch;
}

body {
    background-color: var(--color-brand-bg);
    color: var(--color-brand-ink);
    font-family: 'Plus Jakarta Sans', sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 1.7;
    margin: 0;
    padding: 0;
    font-size: 16px;
}

html.nextstepai-scroll-locked,
body.nextstepai-scroll-locked {
    overflow: hidden;
    overscroll-behavior: none;
}

body.nextstepai-scroll-locked {
    position: fixed;
    inset: 0;
    top: var(--nextstepai-scroll-lock-top, 0px);
    width: 100%;
    padding-right: var(--nextstepai-scrollbar-compensation, 0px);
}

h1,
h2,
h3,
h4,
.font-display {
    font-family: 'Outfit', sans-serif;
}

a,
button,
input,
textarea,
select {
    transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease, transform 0.3s ease;
}

:focus-visible {
    outline: 2px solid var(--color-brand-gold);
    outline-offset: 3px;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.noise-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 9999;
    opacity: 0.03;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
}

.gold-gradient {
    background: linear-gradient(135deg,
            #846A32 0%,
            #C5A059 25%,
            #F9F1D1 50%,
            #C5A059 75%,
            #846A32 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.gold-border {
    position: relative;
    border: 1px solid transparent;
    background: linear-gradient(var(--color-brand-bg), var(--color-brand-bg)) padding-box,
        linear-gradient(135deg, #846A32, #F9F1D1, #846A32) border-box;
}

.prestige-border {
    border: 1px solid var(--color-brand-line);
    transition: border-color 0.5s ease;
}

.prestige-border:hover {
    border-color: rgba(197, 160, 89, 0.3);
}

.glass {
    background: rgba(255, 255, 255, 0.02);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}

li.flex.items-start {
    margin-top: 7px;
}

.list-svg svg {
    flex-shrink: 0;
    margin-right: 7px;
}

.checklist-svg svg {
    flex-shrink: 0;
	margin-top: 4px;
    margin-right: 7px;
}

.svg-side,
.svg-side svg {
    margin-right: 6px
}

.slide-container {
    padding: 10px 10px 10px 20px;
    background-color: #181713;
    border-radius: 32px;
    border: 1px solid #2a2922;
}

.split-list {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: repeat(3, auto);
    gap: 8px 40px;
    padding: 0;
}

.radiantlit {
    background: radial-gradient(circle at left top, rgb(247 205 125 / 28%) 0%, transparent 45%);
}

.diagnostic-brand {
    border: 1px solid rgba(197, 160, 89, .3);
    background: radial-gradient(circle at left top, rgb(247 205 125 / 28%) 0%, transparent 45%);
    box-shadow: rgb(198 160 91 / 15%) 0px 0px 20px 0px;
}

.diagnostic-brand h2 {
    font-size: clamp(1.45rem, 3vw, 1.8rem);
    margin: auto;
}

#navbar {
    border-bottom: none !important;
}

section:first-of-type {
    border-top: none !important;
    border-bottom: none !important;
}

.transmission-pulse {
    position: relative;
    height: 1px;
    width: 100%;
    background: var(--color-brand-line);
    overflow: hidden;
    margin: 2rem 0;
}

.transmission-pulse::after {
    content: '';
    position: absolute;
    top: 0;
    left: -50%;
    width: 50%;
    height: 100%;
    background: linear-gradient(90deg, transparent, var(--color-brand-gold), transparent);
    animation: transmissionFlow 1.5s infinite cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes transmissionFlow {
    0% {
        left: -50%;
    }

    100% {
        left: 100%;
    }
}

.status-stream {
    display: flex;
    justify-content: space-between;
    margin-bottom: 2rem;
}

.stream-node {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9px;
    color: var(--color-brand-muted);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    transition: all 0.5s ease;
}

.stream-node .node-dot {
    width: 4px;
    height: 4px;
    background: var(--color-brand-line);
    border-radius: 50%;
    transition: all 0.5s ease;
}

.stream-node.active {
    color: var(--color-brand-gold);
}

.stream-node.active .node-dot {
    background: var(--color-brand-gold);
    box-shadow: 0 0 10px var(--color-brand-gold);
}

.success-prestige {
    background: rgba(197, 160, 89, 0.05);
    border: 1px solid rgba(197, 160, 89, 0.2);
    padding: 3rem;
    text-align: center;
    animation: prestigeExpand 1s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes prestigeExpand {
    0% {
        opacity: 0;
        transform: scale(0.98);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

.input-error {
    border-color: #ef4444 !important;
}

.error-text {
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #ef4444;
    margin-top: 6px;
    font-weight: 600;
    display: block;
    animation: errorIn 0.3s ease;
}

.contact-check-error {
    margin-top: -0.5rem;
    padding-left: 3rem;
}

@keyframes errorIn {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.shake {
    animation: shake 0.5s cubic-bezier(.36, .07, .19, .97) both;
}

@keyframes shake {

    10%,
    90% {
        transform: translate3d(-1px, 0, 0);
    }

    20%,
    80% {
        transform: translate3d(2px, 0, 0);
    }

    30%,
    50%,
    70% {
        transform: translate3d(-4px, 0, 0);
    }

    40%,
    60% {
        transform: translate3d(4px, 0, 0);
    }
}

.contact-check-row {
    display: flex;
    align-items: flex-start;
    gap: 0.875rem;
    cursor: pointer;
    border: 1px solid var(--color-brand-line);
    border-radius: 11px;
    background: rgba(255, 255, 255, 0.01);
    padding: 1rem;
    transition: border-color 0.2s ease, background-color 0.2s ease;
}

.contact-check-row:hover {
    border-color: rgba(197, 160, 89, 0.35);
    background: rgba(197, 160, 89, 0.035);
}

.contact-check-input {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.contact-check-box {
    position: relative;
    flex: 0 0 auto;
    width: 1.125rem;
    height: 1.125rem;
    margin-top: 0.125rem;
    border: 1px solid var(--color-brand-line);
    background: rgb(54 54 54 / 90%);
    transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

.contact-check-box::after {
    content: '';
    position: absolute;
    left: 0.32rem;
    top: 0.12rem;
    width: 0.38rem;
    height: 0.68rem;
    border: solid var(--color-brand-bg);
    border-width: 0 2px 2px 0;
    opacity: 0;
    transform: rotate(45deg) scale(0.8);
    transition: opacity 0.18s ease, transform 0.18s ease;
}

.contact-check-input:checked+.contact-check-box {
    border-color: var(--color-brand-gold);
    background: var(--color-brand-gold);
    box-shadow: 0 0 18px rgba(197, 160, 89, 0.18);
}

.contact-check-input:checked+.contact-check-box::after {
    opacity: 1;
    transform: rotate(45deg) scale(1);
}

.contact-check-input:focus-visible+.contact-check-box {
    outline: 2px solid var(--color-brand-gold);
    outline-offset: 3px;
}

.contact-check-input[aria-invalid="true"]+.contact-check-box {
    border-color: #ef4444;
}

.contact-check-copy {
    display: grid;
    gap: 0.25rem;
    min-width: 0;
}

.contact-check-title {
    color: var(--color-brand-ink);
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.contact-check-note {
    color: var(--color-brand-muted);
    font-size: 0.78rem;
    font-weight: 300;
    line-height: 1.5;
}

.nextstepai-captcha-overlay {
    position: fixed;
    inset: 0;
    z-index: 200;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    background: rgba(5, 5, 5, 0.78);
    opacity: 0;
    transition: opacity 0.18s ease;
}

.nextstepai-captcha-overlay.active {
    opacity: 1;
}

.nextstepai-captcha-modal {
    position: relative;
    width: min(100%, 24rem);
    border: 1px solid rgba(197, 160, 89, 0.22);
    background: rgba(10, 10, 10, 0.96);
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.45);
    padding: 1.5rem;
}

.nextstepai-captcha-close {
    position: absolute;
    top: 0.85rem;
    right: 0.85rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border: 1px solid var(--color-brand-line);
    color: var(--color-brand-muted);
    transition: border-color 0.2s ease, color 0.2s ease;
}

.nextstepai-captcha-close:hover {
    border-color: var(--color-brand-gold);
    color: var(--color-brand-gold);
}

.nextstepai-captcha-title {
    margin-right: 2.5rem;
    color: var(--color-brand-gold);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

.nextstepai-captcha-intro {
    margin-top: 0.6rem;
    color: var(--color-brand-muted);
    font-size: 0.88rem;
    font-weight: 300;
    line-height: 1.6;
}

.nextstepai-captcha {
    margin-top: 1.25rem;
}

.nextstepai-captcha-wrap {
    position: relative;
    width: 280px;
    max-width: 100%;
    margin: 0 auto;
}

.nextstepai-captcha-stage {
    position: relative;
    width: 280px;
    height: 155px;
    max-width: 100%;
    overflow: hidden;
    border: 1px solid var(--color-brand-line);
    background: rgba(255, 255, 255, 0.02);
}

.nextstepai-captcha-canvas,
.nextstepai-captcha-piece {
    display: block;
}

.nextstepai-captcha-piece {
    position: absolute;
    left: 0;
    border: 2px solid rgba(249, 241, 209, 0.85);
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.35);
}

.nextstepai-captcha-bar {
    position: relative;
    height: 42px;
    margin-top: 0.85rem;
    overflow: hidden;
    border: 1px solid var(--color-brand-line);
    background: rgba(255, 255, 255, 0.025);
}

.nextstepai-captcha-bar::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(120deg, transparent 20%, rgb(255 255 255 / 10%), transparent 80%);
    transform: translateX(-120%);
    animation: captchaShimmer 4.0s infinite;
}

@keyframes captchaShimmer {
    to {
        transform: translateX(120%);
    }
}

.nextstepai-captcha-mask {
    position: absolute;
    inset: 0 auto 0 0;
    width: 0;
    background: rgba(197, 160, 89, 0.16);
}

.nextstepai-captcha-slider {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 100%;
    border-right: 1px solid rgba(197, 160, 89, 0.35);
    background: var(--color-brand-gold);
    color: var(--color-brand-bg);
    touch-action: none;
}

.nextstepai-captcha-text {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    color: var(--color-brand-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.72rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.nextstepai-captcha-status,
.nextstepai-captcha-timer {
    min-height: 1rem;
    margin-top: 0.55rem;
    text-align: center;
    color: var(--color-brand-muted);
    font-size: 0.75rem;
}

.nextstepai-captcha-lock-text,
.nextstepai-captcha-lock-note {
    margin: 0;
    text-align: center;
}

.nextstepai-captcha-lock-text {
    margin-top: 2.5rem;
    color: var(--color-brand-ink);
    font-size: 0.86rem;
    font-weight: 700;
}

.nextstepai-captcha-lock-note {
    margin-top: 0.5rem;
    color: var(--color-brand-muted);
    font-size: 0.78rem;
    line-height: 1.5;
}

.nextstepai-captcha-lock-button {
    margin-top: 1.25rem;
}

.nextstepai-captcha-timer {
    margin-top: 0.15rem;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.68rem;
}

.nextstepai-captcha-reload {
    display: block;
    margin: 0.85rem auto 0;
    border: 1px solid var(--color-brand-line);
    color: var(--color-brand-muted);
    padding: 0.45rem 0.75rem;
    font-size: 0.72rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    transition: border-color 0.2s ease, color 0.2s ease;
}

.nextstepai-captcha-reload:hover {
    border-color: var(--color-brand-gold);
    color: var(--color-brand-gold);
}

.micro-label {
    font-size: 13px;
    font-family: 'JetBrains Mono', monospace;
    text-transform: uppercase;
    letter-spacing: 0.3em;
    color: var(--color-brand-gold);
    font-weight: 500;
}

.cta-gold {
    background-color: var(--color-brand-gold);
    color: var(--color-brand-bg);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    font-size: 0.75rem;
    padding: 1rem 2rem;
    transition: all 0.3s ease;
    display: inline-block;
    text-decoration: none;
    border: none;
    border-radius: 24px;
    cursor: pointer;
}

.cta-orange {
    background-color: #d98c47;
}

.cta-gold:hover {
    background-color: var(--color-brand-gold-bright);
    transform: translateY(-2px) scale(1.02);
}

.cta-gold:active {
    transform: scale(0.98);
}

.cta-gold:disabled,
button:disabled {
    cursor: not-allowed;
    opacity: 0.65;
    transform: none;
}

.bento-grid {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 1rem;
}

@media (min-width: 768px) {
    .bento-grid {
        grid-template-columns: repeat(12, 1fr);
    }
}

.bento-item {
    border: 1px solid var(--color-brand-line);
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.02);
    backdrop-filter: blur(20px);
    padding: 2rem;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    position: relative;
    transition: border-color 0.5s ease;
}

.bento-suggestuib-item {
    border: 1px solid var(--color-brand-line);
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.02);
    backdrop-filter: blur(20px);
    padding: 1rem;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    position: relative;
    transition: border-color 0.5s ease;
}

.bento-item:hover,
.bento-suggestuib-item:hover {
    border-color: rgba(197, 160, 89, 0.3);
}

.bento-single-item {
    width: fit-content;
    justify-self: center;
    border: 1px solid #7b643975;
    border-radius: 32px;
    background: radial-gradient(circle at right top, rgb(196 161 91 / 48%) 0%, transparent 45% 62%);
    backdrop-filter: blur(20px);
    padding: 2rem;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    position: relative;
    transition: border-color 0.5s ease;
}

.suggestion-bubble {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid var(--color-brand-line);
    border-radius: 24px;
    color: var(--color-brand-muted);
    padding: 0.5rem 1rem;
    font-size: 13px;
    font-family: 'JetBrains Mono', monospace;
    text-align: left;
    transition: all 0.5s cubic-bezier(0.2, 1, 0.3, 1);
    cursor: pointer;
    max-width: fit-content;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.suggestion-bubble:hover {
    border-color: var(--color-brand-gold);
    color: var(--color-brand-gold);
    background: rgba(197, 160, 89, 0.05);
    transform: translateY(-2px);
}

.suggestion-bubble svg {
    margin-right: 5px;
    align-self: center;
    color: #c6a05b;
    flex-shrink: 0;
    opacity: .7;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fadeIn {
    animation: fadeIn 0.8s cubic-bezier(0.2, 1, 0.3, 1) forwards;
}

.reveal {
    opacity: 0;
    transition: all 1s cubic-bezier(0.2, 1, 0.3, 1);
}

.reveal-up {
    transform: translateY(40px);
}

.reveal-down {
    transform: translateY(-40px);
}

.reveal-left {
    transform: translateX(40px);
}

.reveal-right {
    transform: translateX(-40px);
}

.reveal-scale {
    transform: scale(0.95);
}

.reveal.active {
    opacity: 1;
    transform: translate(0, 0) scale(1);
}

.terminal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 250;
    opacity: 0;
    pointer-events: none;
    background: rgba(5, 5, 5, 0);
    backdrop-filter: blur(0);
    -webkit-backdrop-filter: blur(0);
    transition: opacity 0.45s ease, background-color 0.45s ease, backdrop-filter 0.45s ease;
}

.terminal-backdrop.active {
    opacity: 1;
    pointer-events: auto;
    background: rgba(5, 5, 5, 0.72);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

.terminal-window {
    position: fixed;
    top: 0;
    right: 0;
    height: 100vh;
    height: 100dvh;
    height: calc(var(--app-height, 1vh) * 100);
    max-height: calc(var(--app-height, 1vh) * 100);
    width: 100%;
    background-color: var(--color-brand-bg);
    border-left: 1px solid var(--color-brand-line);
    z-index: 300;
    transform: translateX(100%);
    transition: transform 0.7s cubic-bezier(0.85, 0, 0.15, 1);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    isolation: isolate;
    overscroll-behavior: none;
    touch-action: pan-y;
}

@media (min-width: 768px) {
    .terminal-window {
        width: 450px;
    }
}

.terminal-window.active {
    transform: translateX(0);
    box-shadow: -10px 0 30px rgba(0, 0, 0, 0.5);
}

.terminal-window::before {
    content: " ";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.1) 50%),
        linear-gradient(90deg, rgba(255, 0, 0, 0.03), rgba(0, 255, 0, 0.01), rgba(0, 0, 255, 0.03));
    z-index: 10;
    background-size: 100% 2px, 3px 100%;
    pointer-events: none;
    opacity: 0.5;
}

.terminal-window::after {
    content: " ";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: rgba(18, 16, 16, 0.1);
    opacity: 0;
    z-index: 10;
    pointer-events: none;
    animation: flicker 0.15s infinite;
}

.terminal-header {
    padding: 1.5rem;
    border-bottom: 1px solid var(--color-brand-line);
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: rgba(255, 255, 255, 0.01);
    position: sticky;
    top: 0;
    z-index: 30;
    flex-shrink: 0;
}

.terminal-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
    padding: 1.5rem 1.5rem 8.5rem 1.5rem;
    position: relative;
    font-family: 'JetBrains Mono', monospace;
    font-size: 16px;
    line-height: 1.7;
}

.terminal-scroll-content {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.terminal-body::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(rgba(18, 16, 16, 0) 50%,
            rgba(0, 0, 0, 0.05) 50%);
    background-size: 100% 4px;
    z-index: 10;
    pointer-events: none;
    opacity: 0.3;
}

.terminal-footer {
    position: sticky;
    bottom: 0;
    z-index: 30;
    flex-shrink: 0;
    padding-bottom: env(safe-area-inset-bottom, 0.75rem);
    background: var(--color-brand-bg);
    touch-action: none;
    overscroll-behavior: none;
}

.privacy-group {
    border: 1px solid #2a2a2a;
    border-radius: 32px;
    padding: 10px 0px 10px 21px;
    margin-top: 15px;
    font-size: 11px;
    opacity: 1;
    transition: opacity 0.3s ease, transform 0.8s ease;
}

.privacy-group svg {
    margin: 0 11px;
    flex-shrink: 0;
    outline: none;
    border: none;
    cursor: pointer;
}

.disclaimer-text {
    font-size: 11px;
    text-align: center;
    color: #626262;
    margin: 0 35px 4px 35px;
}

.terminal-actions {
    background-color: #212121;
    padding: 8px 10px 8px 20px;
    margin: -16px 20px 0 20px;
    border: none;
    border-radius: 32px;
    box-shadow: rgb(10 8 8) 0px -5px 13px 0px;
    margin-bottom: env(safe-area-inset-bottom, 0);
    touch-action: manipulation;
    overscroll-behavior: contain;
    z-index: 9999;
}

.terminal-input {
    width: 100%;
    background: transparent;
    border: none;
    outline: none;
    padding: 0;
    color: var(--color-brand-ink);
    font-family: 'JetBrains Mono', monospace;
    font-size: 15px;
}

.terminal-bubble {
    position: relative;
    margin-top: 0.5rem;
}

.terminal-bubble-user {
    background-color: #c5a059;
    color: var(--color-brand-ink);
    padding: 11px 16px;
    border-radius: 1.5rem;
    font-weight: 300;
    overflow-wrap: anywhere;
}

.terminal-bubble-ai {
    background: transparent;
    padding: 0;
    border: none;
    color: var(--color-brand-ink);
}

.terminal-msg {
    display: flex;
    flex-direction: column;
}

.terminal-msg-user {
    max-width: 85%;
    align-self: flex-end;
    align-items: flex-end;
}

.terminal-send {
    padding: 8px;
    background-color: #ffffff;
    align-self: end;
    border-radius: 24px;
    transform: rotate(90deg);
    transition: all 0.3s ease;
}

.chat-message__h1,
.chat-message__h2,
.chat-message__h3,
.chat-message__h4 {
    font-family: 'JetBrains Mono', monospace;
}

.chat-message__h1 {
    font-size: 1.95rem;
    font-weight: 600;
    margin-bottom: 25px;
}

.chat-message__h2 {
    font-size: 1.55rem;
    font-weight: 500;
    margin-top: 30px;
    margin-bottom: 15px;
}

.chat-message__h3 {
    font-size: 1.35rem;
    margin-top: 30px;
    margin-bottom: 11px;
}

.chat-message__h4 {
    font-size: 1.2rem;
    margin-top: 15px;
    margin-bottom: 8px;
}

.chat-message__list {
    margin: 0.5rem 0 1.7rem 1.3rem !important;
}

.chat-message__list--ul {
    list-style-type: disc;
}

.chat-message__list--ol {
    list-style-type: lower-alpha;
    padding-left: .6rem
}

.chat-message__link {
    position: relative;
    display: inline-flex;
    cursor: pointer;
    color: #b69553;
    font-weight: 500;
    align-items: center;
}

.chat-message__link::after {
    content: "";
    position: absolute;
    left: 1px;
    right: 1.07em;
    bottom: 0.3em;
    border-bottom: 1px dotted #9ca3af;
    pointer-events: none;
}

.chat-message__link svg {
    width: .85em;
    height: .85em;
    margin-left: 3px;
    stroke-width: .75px;
    stroke: currentColor;
    text-decoration: none;
    border: 0;
}

.chat-message__link:hover {
    color: #dfb661;
}

.chat-message__bq {
    position: relative;
    margin: 45px 0;
    border-style: dashed;
    --tw-leading: calc(.25em * 6);
    line-height: calc(.25em * 6);
    border-width: 0;
    padding-inline-start: calc(.25em * 6);
}

.chat-message__bq:after {
    content: "";
    position: absolute;
    background-color: #977c47;
    inset-inline-start: 0;
    border-radius: 2px;
    width: 4px;
    top: .2rem;
    bottom: .4rem;
}

.chat-message__sep {
    margin: 22px 0;
}

.typing-indicator {
    display: flex;
    gap: 0.25rem;
    align-items: center;
    padding: 0.5rem;
}

.typing-dot {
    width: 4px;
    height: 4px;
    background-color: var(--color-brand-gold);
    border-radius: 50%;
    animation: bounce 1.4s infinite ease-in-out both;
}

.typing-dot:nth-child(1) {
    animation-delay: -0.32s;
}

.typing-dot:nth-child(2) {
    animation-delay: -0.16s;
}

@keyframes bounce {

    0%,
    80%,
    100% {
        transform: scale(0);
    }

    40% {
        transform: scale(1.0);
    }
}

.status-indicator {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    z-index: 210;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    cursor: pointer;
    background: rgba(5, 5, 5, 0.8);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    padding: 0.6rem 1.2rem;
    border: 1px solid rgba(197, 160, 89, 0.3);
    border-radius: 24px;
    transition: all 0.5s cubic-bezier(0.2, 1, 0.3, 1), opacity 0.8s ease, transform 0.8s ease;
    box-shadow: 0 10px 40px -10px rgba(0, 0, 0, 1);
    opacity: 0;
    transform: translateY(20px);
    pointer-events: none;
}

.status-indicator.ready {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.status-indicator::before {
    content: "";
    position: absolute;
    inset: -1px;
    background: linear-gradient(135deg, transparent, rgba(197, 160, 89, 0.4), transparent);
    border-radius: 24px;
    z-index: -1;
    opacity: 0.5;
}

@media (max-width: 640px) {
    .status-indicator {
        bottom: 1rem;
        right: 1rem;
        padding: 0.5rem 1rem;
        gap: 0.5rem;
    }

    .mobile-nav-link {
        font-size: 2.5rem !important;
        line-height: 1;
        overflow-wrap: break-word;
    }

    .text-5xl {
        font-size: 2.25rem !important;
    }

    .text-6xl {
        font-size: 2.75rem !important;
    }

    .text-7xl {
        font-size: 3rem !important;
    }
}

.status-indicator:hover {
    border-color: var(--color-brand-gold);
    transform: translateY(-5px);
    background: rgba(197, 160, 89, 0.05);
}

.status-indicator:focus-visible {
    outline: 2px solid var(--color-brand-gold);
    outline-offset: 4px;
}

.status-dot {
    width: 6px;
    height: 6px;
    background-color: var(--color-brand-gold);
    border-radius: 50%;
    box-shadow: 0 0 10px var(--color-brand-gold);
}

.status-dot.active {
    animation: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite;
}

.status-dot.offline {
    background-color: #717171;
    box-shadow: none;
    animation: none;
}

@keyframes ping {

    75%,
    100% {
        transform: scale(2);
        opacity: 0;
    }
}

@keyframes flicker {
    0% {
        opacity: 0.27;
    }

    50% {
        opacity: 0.35;
    }

    100% {
        opacity: 0.22;
    }
}

::-webkit-scrollbar {
    width: 4px;
}

::-webkit-scrollbar-track {
    background: var(--color-brand-bg);
    border-radius: 11px;
}

::-webkit-scrollbar-thumb {
    background: rgba(197, 160, 89, 0.2);
    border-radius: 11px;
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(197, 160, 89, 0.4);
}

.methodology-label {
    font-size: 9px;
    font-family: 'JetBrains Mono', monospace;
    text-transform: uppercase;
    letter-spacing: 0.3em;
    color: var(--color-brand-gold);
    font-weight: 500;
    padding-top: 10px;
    padding-bottom: 8px;
}

.methodology-icon-wrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: all 0.7s cubic-bezier(0.2, 1, 0.3, 1);
    opacity: 0;
}

.methodology-icon-wrapper.active {
    opacity: 1;
    transform: translate(-50%, -85%) scale(1);
}

.methodology-icon-wrapper.hidden {
    display: none;
}

.methodology-step.active {
    background: rgba(197, 160, 89, 0.05);
    border-color: var(--color-brand-gold);
}

.glass-hover {
    transition: all 0.5s ease;
}

.glass-hover:hover {
    background: rgba(255, 255, 255, 0.03);
}

.plan-card {
    position: relative;
    overflow: hidden;
    border: 1px solid var(--color-brand-line);
    background: rgba(255, 255, 255, 0.01);
    transition: all 0.5s cubic-bezier(0.2, 1, 0.3, 1);
}

.plan-card:hover {
    border-color: var(--color-brand-gold);
    transform: translateY(-10px);
    background: rgba(255, 255, 255, 0.02);
}

.plan-card.featured {
    border-color: rgba(197, 160, 89, 0.4);
    background: rgba(197, 160, 89, 0.03);
    box-shadow: rgb(198 160 91 / 24%) 0px 0px 20px 0px;
}

.plan-badge {
    position: absolute;
    top: 0;
    right: 0;
    background: #ffce70;
    color: var(--color-brand-bg);
    padding: 0.4rem 1.2rem;
    font-size: 8px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.3em;
    border-bottom-left-radius: 24px;
}

.text-svg-inside svg {
    margin: 0 5px 0 5px;
    align-self: end;
}

.text-wrap-mode {
    text-wrap-mode: nowrap;
}

.border-bold {
    border-width: 2px;
}

.qt {
    position: relative;
    border-style: dashed;
    --tw-leading: calc(.25em * 6);
    line-height: calc(.25em * 6);
    border-width: 0;
    padding-inline-start: calc(.25em * 6);
}

.qt:after {
    content: "";
    position: absolute;
    background-color: #977c47;
    inset-inline-start: 0;
    border-radius: 2px;
    width: 4px;
    top: .25rem;
    bottom: .25rem;
}

input[type="range"] {
    --progress: 0%;
    background:
        linear-gradient(135deg,
            #846A32 0%,
            #C5A059 25%,
            #F9F1D1 50%,
            #C5A059 75%,
            #846A32 100%) left / var(--progress) 100% no-repeat,
        #d1d5db;
    border-radius: 999px;
}

.custom-range::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 18px;
    height: 18px;
    background: linear-gradient(135deg,
            #846A32 0%,
            #C5A059 25%,
            #F9F1D1 50%,
            #C5A059 75%,
            #846A32 100%);
    border-radius: 50%;
    cursor: pointer;
    border: none;
}

.custom-range::-moz-range-thumb {
    width: 18px;
    height: 18px;
    background: linear-gradient(135deg,
            #846A32 0%,
            #C5A059 25%,
            #F9F1D1 50%,
            #C5A059 75%,
            #846A32 100%);
    border: none;
    border-radius: 50%;
    cursor: pointer;
}

.question {
    padding: 20px 80px 20px 20px;
    position: relative;
    cursor: pointer;
}

.question::after {
    content: "\002B";
    font-size: 1.8rem;
    position: absolute;
    right: 20px;
    transition: 0.2s;
}

.question.active::after {
    transform: rotate(45deg);
}

.answer-container {
    max-height: 0;
    overflow: hidden;
    transition: 0.3s;
    cursor: default;
}

.answer {
    font-size: 0.95rem;
    --tw-text-opacity: 1;
    color: rgb(113 113 113 / var(--tw-text-opacity, 1));
    padding: 0 20px 20px;
    line-height: 1.5rem;
}

.answer svg {
    color: #c6a05b;
    margin-right: 5px;
    flex-shrink: 0;
}

.editorial-title {
    font-family: 'Outfit', sans-serif;
    font-size: clamp(2rem, 10vw, 6.5rem);
    font-weight: 700;
    line-height: 0.95;
    letter-spacing: -0.04em;
    text-transform: uppercase;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.creative-type {
    display: block;
    font-family: 'Velvet Signature';
    font-size: clamp(1.5rem, 8vw + 1rem, 8rem);
    font-style: italic;
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
    line-height: normal;
}

.serif-italic {
    font-family: 'Cormorant Garamond', serif;
    font-style: italic;
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
}

.architect-line {
    height: 1px;
    background: linear-gradient(90deg, var(--color-brand-gold), transparent);
    width: 100%;
}

.hero-stats-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1px;
    background: rgb(24, 24, 24);
    border: 2px solid rgb(24, 24, 24);
    border-radius: 12px;
	overflow: hidden;
}

@media (min-width: 640px) {
    .hero-stats-grid {
        grid-template-columns: repeat(4, 1fr);
    }
}

.stat-item {
    background: var(--color-brand-bg);
    padding: 1.5rem;
    margin: 1px;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.terminal-bubble-ai ul,
.terminal-bubble-ai ol {
    margin: 0.5rem 0 0.5rem 1rem;
}

.terminal-bubble-ai p {
    margin: 0 0 0.75rem;
}

.terminal-bubble-ai p:last-child {
    margin-bottom: 0;
}

.terminal-bubble-ai li {
    margin-bottom: 0.25rem;
}

.terminal-bubble-ai code {
    background: rgba(255, 255, 255, 0.1);
    padding: 0.125rem 0.25rem;
    border-radius: 3px;
    color: var(--color-brand-gold);
}

.terminal-bubble-ai pre {
    background: rgba(0, 0, 0, 0.4);
    padding: 1rem;
    margin: 0.5rem 0;
    overflow-x: auto;
    border-radius: 4px;
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.form-error-panel {
    border: 1px solid rgba(239, 68, 68, 0.35);
    background: rgba(239, 68, 68, 0.08);
    color: #fecaca;
    padding: 1rem 1.25rem;
    font-size: 0.875rem;
}

@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        animation: none !important;
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        transition-delay: 0ms !important;
    }

    .slider-content {
        animation: none;
    }
}

.tv-gate {
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 6vmin;
    text-align: center;
    background:
        radial-gradient(circle at 50% 28%, rgba(197, 160, 89, 0.10) 0%, transparent 60%),
        radial-gradient(circle at 50% 120%, #0c0c0e 0%, #050505 70%);
    color: var(--color-brand-ink, #fff);
    -webkit-font-smoothing: antialiased;
}

html.tv-mode {
    overflow: hidden;
}

html.tv-mode .tv-gate {
    display: flex;
}

html.tv-mode body>*:not(.tv-gate) {
    visibility: hidden !important;
}

.tv-gate__card {
    max-width: 62ch;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: clamp(1rem, 2.4vmin, 2rem);
    animation: tvGateIn 0.9s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.tv-gate__badge {
    font-size: clamp(0.7rem, 1.4vmin, 1rem);
    letter-spacing: 0.42em;
    text-transform: uppercase;
    color: var(--color-brand-gold, #c5a059);
    font-weight: 600;
}

.tv-gate__mark {
    width: clamp(56px, 8vmin, 96px);
    height: clamp(56px, 8vmin, 96px);
    border-radius: 999px;
    display: grid;
    place-items: center;
    color: var(--color-brand-gold, #c5a059);
    border: 1px solid rgba(197, 160, 89, 0.35);
    background: radial-gradient(circle at center, rgba(197, 160, 89, 0.14) 0%, transparent 70%);
    animation: tvGatePulse 3.2s ease-in-out infinite;
}

.tv-gate__title {
    font-size: clamp(1.6rem, 4.4vmin, 3.2rem);
    line-height: 1.1;
    font-weight: 700;
    letter-spacing: -0.01em;
    margin: 0;
}

.tv-gate__text {
    font-size: clamp(1rem, 2vmin, 1.4rem);
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.72);
    font-weight: 300;
    margin: 0;
}

.tv-gate__devices {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: clamp(0.6rem, 1.6vmin, 1.2rem);
    margin-top: 0.4rem;
}

.tv-gate__device {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    padding: 0.5em 1.1em;
    border: 1px solid var(--color-brand-line, rgba(255, 255, 255, 0.08));
    border-radius: 999px;
    font-size: clamp(0.8rem, 1.5vmin, 1.05rem);
    color: rgba(255, 255, 255, 0.82);
    background: rgba(255, 255, 255, 0.02);
}

.tv-gate__hint {
    font-size: clamp(0.75rem, 1.4vmin, 1rem);
    color: var(--color-brand-muted, #717171);
    margin: 0;
}

.tv-gate__continue {
    margin-top: 0.4rem;
    font-size: clamp(0.75rem, 1.3vmin, 0.95rem);
    color: var(--color-brand-muted, #717171);
    text-decoration: underline;
    text-underline-offset: 4px;
    background: none;
    border: 0;
    cursor: pointer;
    transition: color 0.3s ease;
}

.tv-gate__continue:hover,
.tv-gate__continue:focus-visible {
    color: var(--color-brand-gold, #c5a059);
}

@keyframes tvGateIn {
    from {
        opacity: 0;
        transform: translateY(26px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes tvGatePulse {

    0%,
    100% {
        box-shadow: 0 0 0 0 rgba(197, 160, 89, 0.22);
    }

    50% {
        box-shadow: 0 0 0 14px rgba(197, 160, 89, 0);
    }
}

html {
    scroll-behavior: smooth;
}

.reveal {
    will-change: opacity, transform;
}

.reveal.active [data-stagger]>* {
    --stagger-step: 90ms;
}

[data-stagger]>* {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity 0.7s cubic-bezier(0.2, 1, 0.3, 1),
        transform 0.7s cubic-bezier(0.2, 1, 0.3, 1);
}

.reveal.active[data-stagger]>*,
[data-stagger].is-in>* {
    opacity: 1;
    transform: translateY(0);
}

[data-stagger]>*:nth-child(1) {
    transition-delay: 0ms;
}

[data-stagger]>*:nth-child(2) {
    transition-delay: 90ms;
}

[data-stagger]>*:nth-child(3) {
    transition-delay: 180ms;
}

[data-stagger]>*:nth-child(4) {
    transition-delay: 270ms;
}

[data-stagger]>*:nth-child(5) {
    transition-delay: 360ms;
}

[data-stagger]>*:nth-child(6) {
    transition-delay: 450ms;
}

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

    .tv-gate__card {
        animation: none;
    }

    .tv-gate__mark {
        animation: none;
    }

    [data-stagger]>* {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

body.unsub-locked>nav,
body.unsub-locked>main,
body.unsub-locked>footer {
    visibility: hidden;
    opacity: 0;
}

body:not(.unsub-locked)>nav,
body:not(.unsub-locked)>main,
body:not(.unsub-locked)>footer {
    opacity: 1;
    transition: opacity 0.6s ease;
}

.unsub-noscript {
    max-width: 40rem;
    margin: 6rem auto;
    padding: 2rem;
    text-align: center;
    border: 1px solid var(--color-brand-line, rgba(255, 255, 255, 0.08));
    color: var(--color-brand-ink, #fff);
}

.unsub-noscript a {
    color: var(--color-brand-gold, #c5a059);
    text-decoration: underline;
    text-underline-offset: 4px;
}

.unsub-card {
    border: 1px solid var(--color-brand-line, rgba(255, 255, 255, 0.08));
    background:
        radial-gradient(circle at 50% 0%, rgba(197, 160, 89, 0.06) 0%, transparent 60%),
        rgba(255, 255, 255, 0.01);
    padding: clamp(2rem, 5vw, 4.5rem) clamp(1.25rem, 4vw, 3.5rem);
}

.unsub-spinner {
    width: 46px;
    height: 46px;
    margin: 0 auto;
    border: 2px solid rgba(197, 160, 89, 0.18);
    border-top-color: var(--color-brand-gold, #c5a059);
    border-radius: 999px;
    animation: unsubSpin 0.9s linear infinite;
}

@keyframes unsubSpin {
    to {
        transform: rotate(360deg);
    }
}

.unsub-check {
    display: flex;
    justify-content: center;
}

.unsub-check svg {
    overflow: visible;
}

.unsub-check__circle {
    stroke: var(--color-brand-gold, #c5a059);
    stroke-width: 2;
    stroke-dasharray: 151;
    stroke-dashoffset: 151;
    animation: unsubDrawCircle 0.85s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}

.unsub-check__mark {
    stroke: var(--color-brand-gold, #c5a059);
    stroke-width: 3.5;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 40;
    stroke-dashoffset: 40;
    animation: unsubDrawMark 0.45s cubic-bezier(0.65, 0, 0.45, 1) 0.62s forwards;
}

@keyframes unsubDrawCircle {
    to {
        stroke-dashoffset: 0;
    }
}

@keyframes unsubDrawMark {
    to {
        stroke-dashoffset: 0;
    }
}

.unsub-email-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.7em;
    margin-top: 2.25rem;
    margin-bottom: 2.25rem;
    max-width: 100%;
    padding: 0.85em 1.4em;
    border: 1px solid rgba(197, 160, 89, 0.28);
    border-radius: 999px;
    background: rgba(197, 160, 89, 0.05);
    animation: unsubChipIn 0.6s cubic-bezier(0.16, 1, 0.3, 1) 1s both;
}

.unsub-email-value {
    font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
    font-size: clamp(0.82rem, 2.6vw, 1rem);
    letter-spacing: 0.02em;
    color: var(--color-brand-ink, #fff);
    overflow-wrap: anywhere;
    word-break: break-word;
    min-width: 0;
    text-align: left;
}

@keyframes unsubChipIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .unsub-spinner {
        animation-duration: 2s;
    }

    .unsub-check__circle,
    .unsub-check__mark {
        animation: none;
        stroke-dashoffset: 0;
    }

    .unsub-email-chip {
        animation: none;
    }

    body:not(.unsub-locked)>nav,
    body:not(.unsub-locked)>main,
    body:not(.unsub-locked)>footer {
        transition: none;
    }
}

















:root {
    --color-background: #050505;
    --spacing: 0.25rem;
    --header-h: 4rem;
    --page-top-space: var(--header-h);
}

.hero-frame {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    height: clamp(480px, 66svh, 540px);
    margin-top: 90px;
    margin-bottom: -3rem;
}

.hero-foreground {
    position: relative;
    z-index: 10;
    display: flex;
    height: 100%;
    align-items: center;
    padding-top: 2.5rem;
    padding-bottom: calc(clamp(5.5rem, 13svh, 8rem) + 5rem);
}

.space_scene {
    --amber: #f28a1f;
    --cooling-ember: #fff3cc;
    --ember: #ffb23b;
    --gold: #ffcb58;
    --surface: var(--color-background);
    --ease-out: cubic-bezier(.2, .8, .2, 1);
    --glyph-ease-out: cubic-bezier(.33, 1, .68, 1);
    --glyph-reveal-delay: 1.15s;
    --glow-opacity: .8;
    --horizon-glow: #ffa73347;
    --horizon-rise: 10px;
    --sunrise-ease: cubic-bezier(.32, 0, .2, 1);
    z-index: 0;
    position: absolute;
    inset: calc(-1 * var(--horizon-rise)) 0 var(--horizon-rise);
    width: 100%;
    max-width: 1400px;
    margin-inline: auto;
    overflow: hidden;
    pointer-events: none;
    background-color: var(--surface);
}

.space_scene[data-color-scheme="dark"] {
    --amber: #ff9e43;
    --cooling-ember: #35100b;
    --ember: #ff7838;
    --gold: #ffd776;
    --surface: #050505;
    --glow-opacity: 1;
    --horizon-glow: #ff91246b;
}

.space_scene::before,
.space_scene::after {
    position: absolute;
    pointer-events: none;
    content: "";
}

.space_scene::before {
    z-index: 6;
    right: 0;
    bottom: 0;
    left: 0;
    height: 24%;
    background:
        linear-gradient(
            to bottom,
            transparent 0%,
            transparent 28%,
            color-mix(in srgb, var(--color-background) 42%, transparent) 66%,
            var(--color-background) 100%
        ),
        radial-gradient(
            ellipse 84% 115% at 50% 0%,
            transparent 0%,
            transparent 64%,
            var(--color-background) 100%
        );
}

.space_scene::after {
    z-index: 5;
    inset: 6% 16% 35%;
    background: radial-gradient(
        ellipse at 50% 45%,
        color-mix(in srgb, var(--surface) 92%, transparent) 0%,
        color-mix(in srgb, var(--surface) 78%, transparent) 42%,
        transparent 76%
    );
}

.atmosphere {
    position: absolute;
    inset: 0;
    z-index: 1;
    opacity: 0;
    background:
        radial-gradient(35% 19% at 50% 88%, #ffb94445 0%, #f57e2226 37%, #e25f260d 63%, #0000 82%),
        radial-gradient(66% 15% at 50% 102%, #ffa8351f 0%, #eb671f12 43%, #0000 78%);
    animation: atmosphere-arrive 1s var(--sunrise-ease) 80ms both;
}

.canvasLayer {
    position: absolute;
    inset: 0;
    z-index: 4;
    overflow: hidden;
    pointer-events: none;
    opacity: 0;
    animation: glyph-layer-arrive .8s var(--glyph-ease-out) var(--glyph-reveal-delay) both;
}

.canvasLayer canvas {
    display: block;
    width: 100%;
    height: 100%;
}

.sunRays {
    position: absolute;
    bottom: 8%;
    left: 50%;
    z-index: 2;
    width: min(94vw, 1420px);
    height: 39%;
    transform: translateX(-50%);
    opacity: 0;
    background: conic-gradient(
        from 250deg at 50% 100%,
        #0000 0deg,
        #fca8300d 16deg,
        #0000 27deg,
        #fa8c2814 43deg,
        #0000 58deg,
        #ffc65417 72deg,
        #0000 88deg,
        #f582250f 107deg,
        #0000 134deg,
        #faad3b0d 151deg,
        #0000 178deg
    );
    -webkit-mask-image: radial-gradient(63% 84% at 50% 100%, #000 0%, #0000009e 42%, #0000 78%);
    mask-image: radial-gradient(63% 84% at 50% 100%, #000 0%, #0000009e 42%, #0000 78%);
    animation: rays-arrive .99s var(--sunrise-ease) .16s both;
}

.horizon {
    position: absolute;
    bottom: -60%;
    left: -24%;
    right: -24%;
    z-index: 3;
    height: 76%;
    border-top: 1px solid color-mix(in srgb, var(--gold) 78%, transparent);
    border-radius: 50% 50% 0 0 / 100% 100% 0 0;
    background-color: var(--surface);
    box-shadow:
        0 -2px 12px var(--horizon-glow),
        0 -10px 36px color-mix(in srgb, var(--horizon-glow) 70%, transparent),
        0 -32px 96px color-mix(in srgb, var(--horizon-glow) 42%, transparent);
    animation: horizon-glow-arrive 1.04s var(--sunrise-ease) 60ms both;
}

[data-article-hero-backdrop-frame]:has(.space_scene) {
    margin-bottom: 0;
}

@keyframes atmosphere-arrive {
    from { opacity: 0; }
    to { opacity: var(--glow-opacity); }
}

@keyframes glyph-layer-arrive {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes rays-arrive {
    from { opacity: 0; }
    to { opacity: var(--glow-opacity); }
}

@keyframes horizon-glow-arrive {
    from {
        border-color: #0000;
        box-shadow: 0 -2px 12px #0000, 0 -10px 36px #0000, 0 -32px 96px #0000;
    }
    to {
        border-color: color-mix(in srgb, var(--gold) 78%, transparent);
        box-shadow:
            0 -2px 12px var(--horizon-glow),
            0 -10px 36px color-mix(in srgb, var(--horizon-glow) 70%, transparent),
            0 -32px 96px color-mix(in srgb, var(--horizon-glow) 42%, transparent);
    }
}

@media (max-width: 767px) {
    .space_scene::after {
        inset: 8% 2% 34%;
    }

    .horizon {
        height: 72%;
        bottom: -56%;
        left: -55%;
        right: -55%;
    }
	
	.py-img {
		padding-top: 1rem;
		padding-bottom: 2rem;
	}
	
	.article-meta {
        display: block;
    }
	
	.share-it {
    position: relative;
    display: flex;
    align-items: center;

    overflow-x: auto;
    overflow-y: hidden;

    scrollbar-width: none;
    -ms-overflow-style: none;
}
}

@media (prefers-reduced-motion: reduce) {
    .atmosphere,
    .sunRays,
    .horizon,
    .canvasLayer {
        opacity: 1;
        animation: none;
    }

    .sunRays {
        transform: translateX(-50%);
    }
}

@supports not (color: color-mix(in srgb, black 50%, white)) {
    .space_scene::before {
        background:
            linear-gradient(to bottom, transparent 0%, transparent 28%, rgba(5, 5, 5, .42) 66%, #050505 100%),
            radial-gradient(ellipse 84% 115% at 50% 0%, transparent 0%, transparent 64%, #050505 100%);
    }

    .space_scene::after {
        background: radial-gradient(ellipse at 50% 45%, rgba(5, 5, 5, .92) 0%, rgba(5, 5, 5, .78) 42%, transparent 76%);
    }
}

@media (min-width: 768px) {
    .hero-frame {
        margin-bottom: -4rem;
    }
}