@import "https://fonts.googleapis.com/css2?family=Exo+2:wght@400;700&display=swap";

* {
box-sizing: border-box
}

html {
font-size: 100%
}

body {
margin: 0;
min-height: 100svh;
overflow-x: hidden;
-webkit-text-size-adjust: 100%;
font-family: 'Exo 2', sans-serif;
background: linear-gradient(165deg, #1a1614 0%, #0d0a09 48%, #1c1311 100%);
color: #e8e3df
}

.top-band {
background: linear-gradient(135deg, #420B6A 0%, #2a0845 100%);
border-bottom: 1px solid #ff0f4d26;
box-shadow: 1px 5px 22px 0 #420b6a14;
position: relative
}

.top-band::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 2px;
background: linear-gradient(90deg, transparent 0%, #09ffe166 50%, transparent 100%);
pointer-events: none
}

.brand-row {
max-width: 1440px;
margin: 0 auto;
padding: 24px 48px;
display: flex;
align-items: center;
justify-content: center
}

.brand-lockup {
display: flex;
flex-direction: column;
align-items: center;
gap: 8px
}

.mark-hold {
background: #09ffe114;
padding: 16px;
border-radius: 14px;
border: 1px solid #09ffe133;
box-shadow: 1px 1px 5px 0 #420b6a0f inset 0 1px 0 #ffffff0d inset 0 -1px 2px #0000004d;
transition: border-color .28s ease-out, box-shadow .28s ease-out
}

.mark-hold:hover {
border-color: #09ffe159;
box-shadow: 1px 5px 22px 0 #09ffe114 inset 0 1px 0 #ffffff14 inset 0 -1px 2px #0000004d
}

.mark-hold img {
display: block;
width: 64px;
height: 64px;
object-fit: contain
}

.brand-text {
font-size: 24px;
font-weight: 700;
color: #fff;
letter-spacing: .02em;
line-height: 1.2;
text-shadow: 0 2px 12px #ff0f4d4d
}

.nav-row {
background: #0d0a0999;
border-top: 1px solid #ff0f4d14;
backdrop-filter: blur(8px)
}

.nav-inner {
max-width: 1440px;
margin: 0 auto;
padding: 0 48px;
display: flex;
align-items: center;
justify-content: center;
gap: 48px;
flex-wrap: wrap;
min-height: 68px
}

.primary-links {
display: flex;
align-items: center;
gap: 48px;
flex-wrap: wrap;
list-style: none;
margin: 0;
padding: 0
}

.primary-links li {
position: relative
}

.primary-links a {
display: block;
font-size: 14px;
font-weight: 400;
color: #e8e3df;
text-decoration: none;
padding: 24px 0;
letter-spacing: .04em;
transition: color .22s ease-out;
position: relative
}

.primary-links a::after {
content: '';
position: absolute;
bottom: 20px;
left: 0;
width: 0;
height: 2px;
background: linear-gradient(90deg, #FF0F4D 0%, #09FFE1 100%);
transition: width .35s ease-out
}

.primary-links a:hover {
color: #09FFE1
}

.primary-links a:hover::after {
width: 100%
}

.primary-links a:focus {
outline: none;
background: #09ffe11f;
color: #fff
}

.has-sub {
position: relative
}

.has-sub>a {
padding-right: 20px
}

.has-sub>a::before {
content: '';
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
width: 0;
height: 0;
border-left: 4px solid transparent;
border-right: 4px solid transparent;
border-top: 5px solid currentColor;
transition: transform .25s ease-out
}

.has-sub:hover>a::before {
transform: translateY(-50%) rotate(180deg)
}

.sub-links {
position: absolute;
top: 100%;
left: 0;
background: linear-gradient(165deg, #2a0845 0%, #1a0f2d 100%);
border: 1px solid #ff0f4d33;
border-radius: 8px;
box-shadow: 1px 12px 60px 0 #420b6a21;
list-style: none;
margin: 0;
padding: 8px 0;
min-width: 220px;
opacity: 0;
visibility: hidden;
transform: translateY(-8px);
transition: opacity .28s ease-out, transform .28s ease-out, visibility .28s ease-out;
pointer-events: none;
z-index: 100
}

.has-sub:hover .sub-links {
opacity: 1;
visibility: visible;
transform: translateY(0);
pointer-events: auto
}

.sub-links::before {
content: '';
position: absolute;
top: -16px;
left: 0;
width: 100%;
height: 16px
}

.sub-links li {
margin: 0
}

.sub-links a {
display: block;
padding: 16px 24px;
font-size: 14px;
color: #e8e3df;
text-decoration: none;
letter-spacing: .03em;
transition: background-color .2s ease-out, color .2s ease-out, padding-left .2s ease-out
}

.sub-links a::after {
display: none
}

.sub-links a:hover {
background-color: #ff0f4d1f;
color: #09FFE1;
padding-left: 32px
}

.sub-links a:focus {
background: #09ffe126;
color: #fff;
outline: none
}

@media (max-width: 768px) {
.brand-row {
padding: 16px 24px
}

.nav-inner {
padding: 0 24px;
gap: 24px
}

.primary-links {
gap: 24px
}

.mark-hold img {
width: 56px;
height: 56px
}

.brand-text {
font-size: 24px
}
}

.base-floor {
background: linear-gradient(180deg, #0d0a09 0%, #1a1614 100%);
border-top: 1px solid #ff0f4d26;
position: relative;
margin-top: 96px
}

.base-floor::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 2px;
background: linear-gradient(90deg, transparent 0%, #ff0f4d66 50%, transparent 100%);
pointer-events: none
}

.floor-grid {
max-width: 1440px;
margin: 0 auto;
padding: 96px 48px 48px;
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 48px
}

.floor-zone {
display: flex;
flex-direction: column;
gap: 24px
}

.zone-tall {
grid-row: span 2;
background: linear-gradient(165deg, #420b6a14 0%, #2a08451f 100%);
border: 1px solid #ff0f4d1a;
border-radius: 14px;
padding: 48px;
box-shadow: 1px 5px 22px 0 #420b6a14 inset 0 1px 0 #ffffff08 inset 0 -1px 2px #0003
}

.zone-mid {
background: linear-gradient(135deg, #09ffe10d 0%, #09ffe105 100%);
border: 1px solid #09ffe11f;
border-radius: 14px;
padding: 48px;
box-shadow: 1px 1px 5px 0 #420b6a0f inset 0 1px 0 #ffffff05 inset 0 -1px 2px #00000026
}

.zone-short {
background: #0d0a0980;
border: 1px solid #ff0f4d14;
border-radius: 8px;
padding: 24px;
box-shadow: 1px 1px 5px 0 #420b6a0f
}

.zone-label {
font-size: 14px;
font-weight: 700;
color: #09FFE1;
letter-spacing: .08em;
text-transform: uppercase;
line-height: 1.2;
margin: 0
}

.zone-desc {
font-size: 14px;
font-weight: 400;
color: #e8e3dfbf;
letter-spacing: .02em;
line-height: 1.65;
margin: 0
}

.zone-desc a {
color: #09FFE1;
text-decoration: underline;
text-decoration-color: #09ffe14d;
text-underline-offset: 3px;
transition: text-decoration-color .22s ease-out, color .22s ease-out
}

.zone-desc a:hover {
color: #FF0F4D;
text-decoration-color: #ff0f4d99
}

.zone-desc a:focus {
outline: none;
background: #09ffe11f;
color: #fff
}

.floor-nav {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 16px
}

.floor-nav a {
display: block;
font-size: 14px;
font-weight: 400;
color: #e8e3df;
text-decoration: none;
letter-spacing: .03em;
line-height: 1.45;
padding: 8px 0;
border-bottom: 1px solid #ff0f4d1a;
transition: color .2s ease-out, border-bottom-color .2s ease-out, padding-left .2s ease-out
}

.floor-nav a:hover {
color: #09FFE1;
border-bottom-color: #09ffe14d;
padding-left: 8px
}

.floor-nav a:focus {
outline: none;
background: #09ffe11f;
color: #fff;
border-bottom-color: transparent
}

.contact-grid {
display: flex;
flex-direction: column;
gap: 16px
}

.contact-item {
display: flex;
align-items: center;
gap: 16px
}

.contact-icon {
width: 20px;
height: 20px;
flex-shrink: 0
}

.contact-icon svg {
width: 100%;
height: 100%;
fill: #09FFE1
}

.contact-link {
font-size: 14px;
font-weight: 400;
color: #e8e3df;
text-decoration: none;
letter-spacing: .02em;
line-height: 1.45;
transition: color .22s ease-out
}

.contact-link:hover {
color: #09FFE1
}

.contact-link:focus {
outline: none;
background: #09ffe11f;
color: #fff
}

.bottom-strip {
background: #0d0a09cc;
border-top: 1px solid #ff0f4d14;
padding: 48px
}

.strip-inner {
max-width: 1440px;
margin: 0 auto;
display: flex;
flex-direction: column;
align-items: center;
gap: 24px
}

.strip-mark {
background: #420b6a26;
padding: 16px;
border-radius: 14px;
border: 1px solid #420b6a40;
box-shadow: 1px 1px 5px 0 #420b6a0f inset 0 1px 0 #ffffff08 inset 0 -1px 2px #0003
}

.strip-mark img {
display: block;
width: 48px;
height: 48px;
object-fit: contain
}

.strip-copy {
font-size: 14px;
font-weight: 400;
color: #e8e3df99;
letter-spacing: .02em;
line-height: 1.45;
text-align: center;
margin: 0
}

@media (max-width: 1280px) {
.floor-grid {
grid-template-columns: repeat(2, 1fr);
padding: 48px
}

.zone-tall {
grid-row: span 1
}
}

@media (max-width: 768px) {
.floor-grid {
grid-template-columns: 1fr;
padding: 48px 24px 24px;
gap: 24px
}

.zone-tall,
.zone-mid {
padding: 24px
}

.zone-short {
padding: 16px
}

.bottom-strip {
padding: 24px
}
}

.consent-bar {
position: fixed;
bottom: 0;
left: 0;
right: 0;
background: linear-gradient(165deg, #2a0845 0%, #1a0f2d 100%);
border-top: 1px solid #ff0f4d40;
box-shadow: 1px 12px 60px 0 #420b6a21;
padding: 24px 48px;
z-index: 8000;
display: none;
opacity: 0;
transform: translateY(100%);
transition: opacity .38s ease-out, transform .38s ease-out
}

.consent-bar.visible {
opacity: 1;
transform: translateY(0)
}

.consent-inner {
max-width: 1440px;
margin: 0 auto;
display: flex;
align-items: center;
justify-content: space-between;
gap: 48px;
flex-wrap: wrap
}

.consent-text {
flex: 1;
min-width: 280px
}

.consent-headline {
font-size: 14px;
font-weight: 700;
color: #fff;
letter-spacing: .03em;
line-height: 1.2;
margin: 0 0 8px
}

.consent-desc {
font-size: 14px;
font-weight: 400;
color: #e8e3dfd9;
letter-spacing: .02em;
line-height: 1.65;
margin: 0
}

.consent-desc a {
color: #09FFE1;
text-decoration: underline;
text-decoration-color: #09ffe14d;
text-underline-offset: 2px;
transition: text-decoration-color .2s ease-out, color .2s ease-out
}

.consent-desc a:hover {
color: #FF0F4D;
text-decoration-color: #ff0f4d99
}

.consent-desc a:focus {
outline: none;
background: #09ffe11f;
color: #fff
}

.consent-actions {
display: flex;
align-items: center;
gap: 16px
}

.btn-accept {
background: linear-gradient(135deg, #FF0F4D 0%, #c70b3c 100%);
border: 1px solid #ff0f4d66;
border-radius: 8px;
padding: 16px 48px;
font-size: 14px;
font-weight: 700;
color: #fff;
letter-spacing: .04em;
cursor: pointer;
box-shadow: 1px 5px 22px 0 #ff0f4d14;
transition: background .25s ease-out, box-shadow .25s ease-out, transform .18s ease-out
}

.btn-accept:hover {
background: linear-gradient(135deg, #c70b3c 0%, #FF0F4D 100%);
box-shadow: 1px 12px 60px 0 #ff0f4d21;
transform: translateY(-2px)
}

.btn-accept:focus {
outline: none;
background: #ff0f4d33;
box-shadow: 0 0 0 3px #09ffe14d
}

.btn-decline {
background: transparent;
border: none;
padding: 16px 24px;
font-size: 14px;
font-weight: 400;
color: #e8e3dfbf;
letter-spacing: .03em;
cursor: pointer;
text-decoration: underline;
text-decoration-color: #e8e3df4d;
text-underline-offset: 3px;
transition: color .22s ease-out, text-decoration-color .22s ease-out
}

.btn-decline:hover {
color: #09FFE1;
text-decoration-color: #09ffe180
}

.btn-decline:focus {
outline: none;
background: #09ffe11f;
color: #fff
}

.sale-opt {
display: flex;
align-items: center;
gap: 16px;
margin-top: 16px
}

.sale-check {
width: 20px;
height: 20px;
border: 2px solid #09ffe166;
border-radius: 4px;
cursor: pointer;
transition: background-color .2s ease-out, border-color .2s ease-out
}

.sale-check:hover {
border-color: #09ffe199
}

.sale-check:focus {
outline: none;
box-shadow: 0 0 0 3px #09ffe133
}

.sale-label {
font-size: 14px;
font-weight: 400;
color: #e8e3dfd9;
letter-spacing: .02em;
line-height: 1.45;
cursor: pointer
}

@media (max-width: 768px) {
.consent-bar {
padding: 16px 24px
}

.consent-inner {
gap: 24px
}

.consent-actions {
flex-direction: column;
width: 100%;
gap: 8px
}

.btn-accept,
.btn-decline {
width: 100%;
text-align: center
}
}

.policy-text {
max-width: 1440px;
margin: 0 auto;
padding: 48px 24px;
color: #e8e8e8;
background: #1b1614
}

@media (min-width: 768px) {
.policy-text {
padding: 96px 48px
}
}

.policy-text h1 {
font-size: 46px;
line-height: 1.2;
letter-spacing: -.02em;
margin: 0 0 48px;
color: #09FFE1
}

.policy-text h2 {
font-size: 33px;
line-height: 1.2;
letter-spacing: -.01em;
margin: 96px 0 24px;
color: #FF0F4D
}

.policy-text h3 {
font-size: 24px;
line-height: 1.45;
letter-spacing: 0;
margin: 48px 0 16px;
color: #09FFE1
}

.policy-text p {
font-size: 14px;
line-height: 1.65;
letter-spacing: .01em;
margin: 0 0 24px
}

.policy-text ul,
.policy-text ol {
font-size: 14px;
line-height: 1.65;
letter-spacing: .01em;
margin: 0 0 24px;
padding: 0 0 0 24px
}

.policy-text li {
margin: 0 0 8px
}

.policy-text li:last-child {
margin-bottom: 0
}

.policy-text strong,
.policy-text b {
color: #09FFE1;
font-weight: 600
}

.policy-text em,
.policy-text i {
font-style: italic;
color: #c8c8c8
}

.policy-text a {
color: #FF0F4D;
text-decoration: none;
border-bottom: 1px solid #ff0f4d4d;
transition: border-color .25s ease-out, color .25s ease-out
}

.policy-text a:hover {
color: #09FFE1;
border-bottom-color: #09ffe199
}

.policy-text div {
margin: 0 0 24px
}

.policy-text h2:first-child,
.policy-text h3:first-child {
margin-top: 0
}

@media (min-width: 768px) {
.policy-text h1 {
font-size: 62px
}

.policy-text h2 {
font-size: 46px
}

.policy-text h3 {
font-size: 33px
}

.policy-text p,
.policy-text ul,
.policy-text ol {
font-size: 14px
}

.policy-text ul,
.policy-text ol {
padding-left: 48px
}
}

@media (min-width: 1280px) {
.policy-text {
padding: 96px
}
}

.evt-dtl {
background: #1a1614;
color: #e8e6e4;
min-height: 100vh
}

.evt-dtl .title-stage {
max-width: 1440px;
margin: 0 auto;
padding: 48px 24px;
display: flex;
flex-direction: row;
align-items: center;
gap: 48px;
position: relative;
overflow: visible
}

.evt-dtl .title-stage::before {
content: '';
position: absolute;
top: 0;
right: 0;
width: 1px;
height: 120px;
background: linear-gradient(180deg, #420B6A 0%, #09FFE1 100%);
opacity: .3
}

.evt-dtl .title-stage::after {
content: '';
position: absolute;
top: 0;
right: 0;
width: 80px;
height: 1px;
background: linear-gradient(90deg, transparent 0%, #420B6A 100%);
opacity: .3
}

.evt-dtl .title-content {
flex: 1;
display: flex;
flex-direction: column;
gap: 16px
}

.evt-dtl .title-content h1 {
font-size: 46px;
line-height: 1.2;
letter-spacing: -.02em;
color: #e8e6e4;
margin: 0
}

.evt-dtl .title-action {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 16px 24px;
background: linear-gradient(135deg, #420B6A 0%, #2d0849 50%, #420B6A 100%);
border: none;
border-radius: 8px;
color: #e8e6e4;
font-size: 14px;
letter-spacing: .02em;
cursor: pointer;
text-decoration: none;
align-self: flex-start;
box-shadow: 1px 5px 22px 0 #420b6a14 1px 12px 60px 0 #420b6a21;
transition: transform .28s ease-out, box-shadow .28s ease-out;
position: relative;
overflow: hidden
}

.evt-dtl .title-action::before {
content: '→';
position: absolute;
left: -24px;
opacity: 0;
transition: left .32s ease-out, opacity .32s ease-out
}

.evt-dtl .title-action:hover {
transform: translateY(-2px);
box-shadow: 1px 12px 60px 0 #420b6a21 1px 5px 22px 0 #ff0f4d14
}

.evt-dtl .title-action:hover::before {
left: 16px;
opacity: 1
}

.evt-dtl .title-action:hover span {
transform: translateX(16px)
}

.evt-dtl .title-action span {
transition: transform .32s ease-out
}

.evt-dtl .title-visual {
width: 420px;
height: 280px;
flex-shrink: 0;
border-radius: 14px;
overflow: hidden;
position: relative;
box-shadow: 1px 1px 5px 0 #420b6a0f 1px 5px 22px 0 #420b6a14
}

.evt-dtl .title-visual img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
filter: grayscale(100%) contrast(1.3) brightness(0.9);
transition: filter .42s ease-out
}

.evt-dtl .title-visual:hover img {
filter: grayscale(80%) contrast(1.2) brightness(1)
}

.evt-dtl .meta-grid {
max-width: 1440px;
margin: 0 auto;
padding: 0 24px 96px;
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 16px;
position: relative
}

.evt-dtl .meta-grid::before {
content: '';
position: absolute;
bottom: -48px;
left: 50%;
transform: translateX(-50%);
width: 0;
height: 0;
border-style: solid;
border-width: 0 24px 24px;
border-color: transparent transparent #09FFE1;
opacity: .15
}

.evt-dtl .meta-item {
background: linear-gradient(135deg, #420b6a14 0%, #09ffe108 100%);
padding: 24px;
border-radius: 14px;
border: 1px solid #420b6a33;
display: flex;
flex-direction: column;
gap: 8px;
transition: border-color .25s ease-out, background .25s ease-out
}

.evt-dtl .meta-item:hover {
border-color: #09ffe166;
background: linear-gradient(135deg, #420b6a1f 0%, #09ffe10f 100%)
}

.evt-dtl .meta-label {
font-size: 14px;
line-height: 1.45;
color: #09FFE1;
opacity: .7;
letter-spacing: .05em;
text-transform: uppercase
}

.evt-dtl .meta-value {
font-size: 24px;
line-height: 1.2;
color: #e8e6e4;
letter-spacing: -.01em;
font-weight: 600
}

.evt-dtl .meta-note {
font-size: 14px;
line-height: 1.45;
color: #e8e6e4;
opacity: .6;
margin-top: 8px
}

.evt-dtl .meta-tag {
display: inline-block;
padding: 8px 16px;
background: #ff0f4d26;
border: 1px solid #ff0f4d4d;
border-radius: 34px;
font-size: 14px;
line-height: 1.45;
color: #FF0F4D;
letter-spacing: .02em;
align-self: flex-start
}

.evt-dtl .content-flow {
background: linear-gradient(180deg, #1a1614 0%, #221e1b 50%, #1a1614 100%);
padding: 96px 24px;
position: relative;
overflow: hidden
}

.evt-dtl .content-flow::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(45deg, transparent 0%, #420b6a08 50%, transparent 100%);
animation: fog-drift 18s ease-in-out infinite;
pointer-events: none
}

@keyframes fog-drift {

0%,
100% {
transform: translateX(-10%) translateY(0);
opacity: .4
}

50% {
transform: translateX(10%) translateY(-5%);
opacity: .6
}
}

.evt-dtl .content-wrapper {
max-width: 1440px;
margin: 0 auto;
display: grid;
grid-template-columns: 2fr 1fr;
gap: 48px;
align-items: start
}

.evt-dtl .primary-content {
display: flex;
flex-direction: column;
gap: 48px
}

.evt-dtl .text-segment {
background: #1a161499;
padding: 48px;
border-radius: 14px;
border-left: 3px solid #420B6A;
border-right: 1px solid #09ffe11a;
box-shadow: 1px 1px 5px 0 #420b6a0f 1px 5px 22px 0 #420b6a14
}

.evt-dtl .text-segment h2 {
font-size: 33px;
line-height: 1.2;
letter-spacing: -.01em;
color: #e8e6e4;
margin: 0 0 24px;
padding: 8px 16px;
background: linear-gradient(90deg, #ff0f4d26 0%, transparent 100%);
border-radius: 8px;
display: inline-block
}

.evt-dtl .text-segment h3 {
font-size: 24px;
line-height: 1.45;
letter-spacing: 0;
color: #09FFE1;
margin: 24px 0 16px
}

.evt-dtl .text-segment p {
font-size: 14px;
line-height: 1.65;
letter-spacing: .01em;
color: #e8e6e4;
margin: 0 0 16px;
opacity: .9
}

.evt-dtl .text-segment p:first-of-type {
background: #420b6a14;
padding: 16px;
border-radius: 8px;
border-left: 2px solid #420B6A
}

.evt-dtl .text-segment ul,
.evt-dtl .text-segment ol {
margin: 16px 0;
padding-left: 24px;
display: flex;
flex-direction: column;
gap: 8px
}

.evt-dtl .text-segment li {
font-size: 14px;
line-height: 1.65;
letter-spacing: .01em;
color: #e8e6e4;
opacity: .9;
padding: 8px 16px;
background: #09ffe108;
border-radius: 8px;
display: inline-block;
width: fit-content
}

.evt-dtl .text-segment strong {
color: #09FFE1;
font-weight: 600
}

.evt-dtl .text-segment dl {
margin: 24px 0;
display: grid;
grid-template-columns: auto 1fr;
gap: 16px 24px
}

.evt-dtl .text-segment dt {
font-size: 14px;
line-height: 1.45;
color: #FF0F4D;
font-weight: 600;
letter-spacing: .02em
}

.evt-dtl .text-segment dd {
font-size: 14px;
line-height: 1.65;
color: #e8e6e4;
opacity: .9;
margin: 0
}

.evt-dtl .text-segment blockquote {
margin: 24px 0;
padding: 24px;
background: linear-gradient(135deg, #ff0f4d14 0%, #420b6a14 100%);
border-left: 3px solid #FF0F4D;
border-radius: 8px;
font-size: 14px;
line-height: 1.65;
color: #e8e6e4;
font-style: italic
}

.evt-dtl .text-segment cite {
display: block;
margin-top: 16px;
font-size: 14px;
line-height: 1.45;
color: #09FFE1;
font-style: normal;
opacity: .8
}

.evt-dtl .text-segment figure {
margin: 24px 0;
padding: 24px;
background: #09ffe108;
border-radius: 14px;
border: 1px solid #09ffe11a
}

.evt-dtl .text-segment figcaption {
margin-top: 16px;
font-size: 14px;
line-height: 1.45;
color: #e8e6e4;
opacity: .7;
font-style: italic
}

.evt-dtl .text-segment details {
margin: 16px 0;
padding: 24px;
background: #420b6a0f;
border-radius: 8px;
border: 1px solid #420b6a33;
transition: background .3s ease-out
}

.evt-dtl .text-segment details[open] {
background: #420b6a1a
}

.evt-dtl .text-segment summary {
font-size: 14px;
line-height: 1.45;
color: #09FFE1;
cursor: pointer;
font-weight: 600;
letter-spacing: .02em;
list-style: none;
display: flex;
align-items: center;
gap: 8px
}

.evt-dtl .text-segment summary::before {
content: '▸';
color: #FF0F4D;
transition: transform .22s ease-out
}

.evt-dtl .text-segment details[open] summary::before {
transform: rotate(90deg)
}

.evt-dtl .text-segment summary:hover {
color: #FF0F4D
}

.evt-dtl .sidebar-content {
position: sticky;
top: 96px;
display: flex;
flex-direction: column;
gap: 24px
}

.evt-dtl .info-cluster {
background: linear-gradient(180deg, #420b6a1f 0%, #09ffe10a 100%);
padding: 24px;
border-radius: 14px;
border: 1px solid #420b6a4d;
box-shadow: 1px 1px 5px 0 #420b6a0f;
display: grid;
grid-template-columns: 1fr;
gap: 16px
}

.evt-dtl .info-pair {
padding: 16px;
background: #1a161480;
border-radius: 8px;
border-left: 2px solid #09FFE1;
transition: transform .2s ease-out, border-color .2s ease-out
}

.evt-dtl .info-pair:hover {
transform: translateX(4px);
border-left-color: #FF0F4D
}

.evt-dtl .info-key {
font-size: 14px;
line-height: 1.45;
color: #09FFE1;
opacity: .8;
letter-spacing: .03em;
margin-bottom: 8px
}

.evt-dtl .info-data {
font-size: 14px;
line-height: 1.65;
color: #e8e6e4;
letter-spacing: .01em
}

.evt-dtl .schedule-block {
background: #1a1614;
padding: 96px 24px;
position: relative
}

.evt-dtl .schedule-block::before {
content: '';
position: absolute;
top: 24px;
right: 24px;
width: 180px;
height: 1px;
background: linear-gradient(270deg, #09FFE1 0%, transparent 100%);
opacity: .2
}

.evt-dtl .schedule-block::after {
content: '';
position: absolute;
top: 24px;
right: 24px;
width: 1px;
height: 180px;
background: linear-gradient(180deg, #09FFE1 0%, transparent 100%);
opacity: .2
}

.evt-dtl .schedule-inner {
max-width: 1440px;
margin: 0 auto
}

.evt-dtl .schedule-header {
margin-bottom: 48px;
text-align: center
}

.evt-dtl .schedule-header h2 {
font-size: 46px;
line-height: 1.2;
letter-spacing: -.02em;
color: #e8e6e4;
margin: 0;
display: inline-block;
padding: 8px 24px;
background: linear-gradient(90deg, transparent 0%, #ff0f4d1f 50%, transparent 100%);
border-radius: 8px
}

.evt-dtl .schedule-stages {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 24px;
grid-auto-rows: auto
}

.evt-dtl .stage-card {
background: linear-gradient(135deg, #420b6a1a 0%, #09ffe10d 100%);
padding: 24px;
border-radius: 14px;
border: 1px solid #420b6a33;
display: flex;
flex-direction: column;
gap: 16px;
transition: transform .35s ease-out, box-shadow .35s ease-out, border-color .35s ease-out;
position: relative;
overflow: hidden
}

.evt-dtl .stage-card::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 4px;
height: 0;
background: linear-gradient(180deg, #FF0F4D 0%, #09FFE1 100%);
transition: height .4s ease-out
}

.evt-dtl .stage-card:hover {
transform: translateY(-4px);
box-shadow: 1px 5px 22px 0 #420b6a14 1px 12px 60px 0 #ff0f4d21;
border-color: #09ffe166
}

.evt-dtl .stage-card:hover::before {
height: 100%
}

.evt-dtl .stage-card:nth-child(3n+1) {
grid-column: 1
}

.evt-dtl .stage-card:nth-child(3n+2) {
grid-column: 2;
margin-top: 48px
}

.evt-dtl .stage-card:nth-child(3n) {
grid-column: 3;
margin-top: 24px
}

.evt-dtl .stage-num {
font-size: 62px;
line-height: 1;
color: #420B6A;
font-weight: 700;
opacity: .15;
letter-spacing: -.03em
}

.evt-dtl .stage-title {
font-size: 24px;
line-height: 1.2;
color: #e8e6e4;
margin: 0;
letter-spacing: -.01em
}

.evt-dtl .stage-desc {
font-size: 14px;
line-height: 1.65;
color: #e8e6e4;
opacity: .8;
margin: 0
}

.evt-dtl .stage-card ul {
margin: 0;
padding: 0;
list-style: none;
display: flex;
flex-direction: column;
gap: 8px
}

.evt-dtl .stage-card li {
font-size: 14px;
line-height: 1.45;
color: #e8e6e4;
padding: 8px 16px;
background: #09ffe10d;
border-radius: 34px;
border: 1px solid #09ffe11a;
display: inline-block;
width: fit-content;
transition: background .2s ease-out, border-color .2s ease-out
}

.evt-dtl .stage-card li:hover {
background: #09ffe11a;
border-color: #09ffe14d
}

.evt-dtl .divider-accent {
max-width: 1440px;
margin: 0 auto;
padding: 0 24px;
display: flex;
align-items: center;
justify-content: center;
gap: 24px;
position: relative
}

.evt-dtl .divider-line {
flex: 1;
height: 1px;
background: linear-gradient(90deg, transparent 0%, #420b6a4d 50%, transparent 100%)
}

.evt-dtl .divider-icon {
width: 48px;
height: 48px;
border-radius: 48px;
background: linear-gradient(135deg, #420B6A 0%, #FF0F4D 100%);
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 0 24px #09ffe14d;
animation: pulse-glow 3s ease-in-out infinite
}

@keyframes pulse-glow {

0%,
100% {
box-shadow: 0 0 24px #09ffe14d
}

50% {
box-shadow: 0 0 48px #ff0f4d66
}
}

.evt-dtl .divider-icon::before {
content: '';
width: 16px;
height: 16px;
border: 2px solid #09FFE1;
border-radius: 14px
}

@media (max-width: 1280px) {
.evt-dtl .title-stage {
flex-direction: column;
gap: 24px
}

.evt-dtl .title-visual {
width: 100%;
max-width: 600px
}

.evt-dtl .meta-grid {
grid-template-columns: repeat(3, 1fr)
}

.evt-dtl .content-wrapper {
grid-template-columns: 1fr
}

.evt-dtl .sidebar-content {
position: static;
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 24px
}

.evt-dtl .schedule-stages {
grid-template-columns: repeat(2, 1fr)
}

.evt-dtl .stage-card:nth-child(3n+1),
.evt-dtl .stage-card:nth-child(3n+2),
.evt-dtl .stage-card:nth-child(3n) {
grid-column: auto;
margin-top: 0
}

.evt-dtl .stage-card:nth-child(2n) {
margin-top: 24px
}
}

@media (max-width: 768px) {
.evt-dtl .title-stage {
padding: 24px 16px
}

.evt-dtl .title-content h1 {
font-size: 33px
}

.evt-dtl .meta-grid {
grid-template-columns: 1fr;
padding: 0 16px 48px
}

.evt-dtl .content-flow {
padding: 48px 16px
}

.evt-dtl .content-wrapper {
gap: 24px
}

.evt-dtl .text-segment {
padding: 24px
}

.evt-dtl .text-segment h2 {
font-size: 24px
}

.evt-dtl .sidebar-content {
grid-template-columns: 1fr
}

.evt-dtl .schedule-block {
padding: 48px 16px
}

.evt-dtl .schedule-header h2 {
font-size: 33px
}

.evt-dtl .schedule-stages {
grid-template-columns: 1fr
}

.evt-dtl .stage-card:nth-child(2n) {
margin-top: 0
}

.evt-dtl .stage-num {
font-size: 46px
}
}

.post-detail {
background: #1a1512;
color: #e8e6e3;
min-height: 100vh;
position: relative
}

.post-detail .title-zone {
position: relative;
padding: 96px 24px;
max-width: 1440px;
margin: 0 auto;
background: linear-gradient(to bottom, #420B6A 0%, #420b6ab3 45%, transparent 100%);
overflow: hidden
}

.post-detail .title-zone::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: radial-gradient(circle, #09ffe10a 1px, transparent 1px), radial-gradient(circle, #ff0f4d08 1px, transparent 1px);
background-size: 48px 48px, 72px 72px;
background-position: 0 0, 24px 24px;
pointer-events: none
}

.post-detail .title-content {
position: relative;
z-index: 2;
max-width: 920px;
margin: 0 auto
}

.post-detail .tag-label {
display: inline-block;
padding: 8px 24px;
background: #09ffe11f;
color: #09FFE1;
font-size: 14px;
border-radius: 34px;
margin-bottom: 24px;
letter-spacing: .05em;
border: 1px solid #09ffe133;
transition: background .28s ease-out, border-color .28s ease-out
}

.post-detail .tag-label:hover {
background: #09ffe12e;
border-color: #09ffe159
}

.post-detail .main-heading {
font-size: 62px;
line-height: 1.2;
margin: 0 0 24px;
letter-spacing: -.02em;
font-weight: 700
}

.post-detail .intro-text {
font-size: 24px;
line-height: 1.65;
color: #b8b5b2;
letter-spacing: .01em
}

.post-detail .cover-visual {
max-width: 1440px;
margin: 0 auto;
padding: 0 24px 48px;
position: relative
}

.post-detail .cover-visual img {
width: 100%;
height: 520px;
object-fit: cover;
object-position: center;
border-radius: 14px;
filter: sepia(0.15) saturate(1.1) brightness(0.95);
box-shadow: 1px 12px 60px 0 #420b6a21;
transition: filter .35s ease-out, transform .35s ease-out
}

.post-detail .cover-visual img:hover {
filter: sepia(0.08) saturate(1.15) brightness(1);
transform: translateY(-4px)
}

.post-detail .content-wrapper {
max-width: 1440px;
margin: 0 auto;
padding: 96px 24px;
display: grid;
grid-template-columns: 1fr 340px;
gap: 96px;
align-items: start
}

.post-detail .article-body {
background: #221e1b;
padding: 48px;
border-radius: 14px;
box-shadow: 1px 5px 22px 0 #420b6a14;
position: relative
}

.post-detail .article-body::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: repeating-linear-gradient(to right, transparent, transparent 2px, #420b6a08 2px, #420b6a08 3px);
pointer-events: none;
border-radius: 14px
}

.post-detail .article-body> :first-child {
margin-top: 0
}

.post-detail .article-body p {
font-size: 24px;
line-height: 1.65;
margin: 24px 0;
color: #d4d1ce;
letter-spacing: .005em
}

.post-detail .article-body p:first-of-type {
background: #09ffe10d;
padding: 24px;
border-left: 3px solid #09FFE1;
border-radius: 8px;
margin-left: -24px;
margin-right: -24px;
margin-top: 0
}

.post-detail .article-body h2 {
font-size: 46px;
line-height: 1.2;
margin: 48px 0 24px;
letter-spacing: -.015em;
position: relative;
display: inline-block
}

.post-detail .article-body h2::before {
content: '';
position: absolute;
left: -16px;
top: 8px;
width: 4px;
height: 32px;
background: linear-gradient(to bottom, #FF0F4D, #420B6A);
border-radius: 8px
}

.post-detail .article-body h3 {
font-size: 33px;
line-height: 1.45;
margin: 48px 0 16px;
letter-spacing: -.01em;
background: #ff0f4d14;
padding: 16px 24px;
border-radius: 8px;
margin-left: -24px;
margin-right: -24px
}

.post-detail .article-body h4 {
font-size: 24px;
line-height: 1.45;
margin: 24px 0 16px;
letter-spacing: 0;
color: #09FFE1
}

.post-detail .article-body em {
font-style: italic;
color: #FF0F4D;
font-weight: 500
}

.post-detail .article-body ul {
margin: 24px 0;
padding: 0;
list-style: none;
display: flex;
flex-wrap: wrap;
gap: 16px
}

.post-detail .article-body ul li {
background: #420b6a1f;
padding: 8px 24px;
border-radius: 34px;
font-size: 14px;
line-height: 1.45;
color: #b8b5b2;
border: 1px solid #420b6a40;
transition: background .22s ease-out, border-color .22s ease-out, transform .22s ease-out;
letter-spacing: .02em
}

.post-detail .article-body ul li:hover {
background: #420b6a33;
border-color: #420b6a66;
transform: translateY(-2px)
}

.post-detail .article-body details {
background: #2a2522;
border-radius: 14px;
padding: 24px;
margin: 24px 0;
border: 1px solid #09ffe126;
transition: border-color .3s ease-out
}

.post-detail .article-body details:hover {
border-color: #09ffe14d
}

.post-detail .article-body summary {
font-size: 24px;
line-height: 1.45;
cursor: pointer;
font-weight: 600;
color: #09FFE1;
letter-spacing: -.005em;
transition: color .25s ease-out
}

.post-detail .article-body summary:hover {
color: #FF0F4D
}

.post-detail .article-body details[open] summary {
margin-bottom: 16px;
padding-bottom: 16px;
border-bottom: 1px solid #09ffe133
}

.post-detail .sidebar-panel {
position: sticky;
top: 24px
}

.post-detail .reaction-module {
background: #221e1b;
padding: 48px;
border-radius: 14px;
box-shadow: 1px 5px 22px 0 #ff0f4d14;
margin-bottom: 48px;
transition: transform .32s ease-out
}

.post-detail .reaction-module:hover {
transform: translateY(-6px)
}

.post-detail .reaction-heading {
font-size: 24px;
line-height: 1.45;
margin: 0 0 24px;
color: #FF0F4D;
letter-spacing: -.005em
}

.post-detail .reaction-options {
display: flex;
flex-direction: column;
gap: 16px
}

.post-detail .reaction-options input[type="radio"] {
display: none
}

.post-detail .reaction-choice {
display: flex;
align-items: center;
gap: 16px;
padding: 16px;
background: #09ffe10d;
border: 2px solid #09ffe126;
border-radius: 14px;
cursor: pointer;
transition: all .27s ease-out
}

.post-detail .reaction-choice:hover {
background: #09ffe11a;
border-color: #09ffe14d;
transform: translateX(8px)
}

.post-detail .reaction-options input[type="radio"]:checked+.reaction-choice {
background: #09ffe12e;
border-color: #09FFE1;
box-shadow: 1px 5px 22px 0 #09ffe114
}

.post-detail .reaction-icon {
width: 48px;
height: 48px;
border-radius: 48px;
display: flex;
align-items: center;
justify-content: center;
background: #420b6a33;
font-size: 24px;
flex-shrink: 0;
transition: background .27s ease-out, transform .27s ease-out
}

.post-detail .reaction-options input[type="radio"]:checked+.reaction-choice .reaction-icon {
background: #420B6A;
transform: scale(1.15)
}

.post-detail .reaction-text {
font-size: 14px;
line-height: 1.45;
color: #d4d1ce;
letter-spacing: .01em
}

.post-detail .poll-module {
background: #2a2522;
padding: 48px;
border-radius: 14px;
box-shadow: 1px 5px 22px 0 #420b6a14
}

.post-detail .poll-heading {
font-size: 24px;
line-height: 1.45;
margin: 0 0 24px;
color: #e8e6e3;
letter-spacing: -.005em
}

.post-detail .poll-options {
display: flex;
flex-direction: column;
gap: 16px
}

.post-detail .poll-options input[type="radio"] {
display: none
}

.post-detail .poll-choice {
padding: 16px 24px;
background: #ff0f4d14;
border: 2px solid #ff0f4d33;
border-radius: 8px;
cursor: pointer;
font-size: 14px;
line-height: 1.45;
color: #d4d1ce;
transition: all .25s ease-out;
letter-spacing: .01em;
position: relative;
overflow: hidden
}

.post-detail .poll-choice::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 0;
height: 100%;
background: #ff0f4d26;
transition: width .4s ease-out;
z-index: 0
}

.post-detail .poll-choice:hover {
border-color: #ff0f4d66;
background: #ff0f4d1f
}

.post-detail .poll-choice:hover::before {
width: 100%
}

.post-detail .poll-options input[type="radio"]:checked+.poll-choice {
background: #ff0f4d33;
border-color: #FF0F4D;
color: #e8e6e3;
font-weight: 600;
box-shadow: 1px 1px 5px 0 #ff0f4d0f
}

.post-detail .poll-options input[type="radio"]:checked+.poll-choice::before {
width: 100%;
background: #ff0f4d40
}

.post-detail .poll-choice span {
position: relative;
z-index: 1
}

.post-detail .like-counter {
background: #1a1512;
padding: 48px;
border-radius: 14px;
text-align: center;
margin-top: 48px;
position: relative;
overflow: hidden
}

.post-detail .like-counter::before {
content: '';
position: absolute;
top: 50%;
left: 50%;
width: 200px;
height: 200px;
background: radial-gradient(circle, #09ffe126 0%, transparent 70%);
transform: translate(-50%, -50%);
animation: pulse-glow 4s ease-in-out infinite;
pointer-events: none
}

@keyframes pulse-glow {

0%,
100% {
transform: translate(-50%, -50%) scale(1);
opacity: .5
}

50% {
transform: translate(-50%, -50%) scale(1.3);
opacity: .8
}
}

.post-detail .like-label {
font-size: 14px;
line-height: 1.45;
color: #b8b5b2;
margin-bottom: 16px;
letter-spacing: .05em;
text-transform: uppercase;
position: relative;
z-index: 1
}

.post-detail .like-count {
font-size: 62px;
line-height: 1.2;
font-weight: 700;
color: #09FFE1;
letter-spacing: -.02em;
position: relative;
z-index: 1
}

.post-detail .split-display {
max-width: 1440px;
margin: 0 auto;
padding: 0 24px 96px;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0;
position: relative
}

.post-detail .split-display::before {
content: '';
position: absolute;
top: 0;
left: 50%;
width: 2px;
height: 100%;
background: linear-gradient(to bottom, transparent, #420B6A 20%, #FF0F4D 50%, #09FFE1 80%, transparent);
transform: translateX(-50%) skewX(-8deg)
}

.post-detail .left-zone {
padding: 48px 48px 48px 0;
background: #420b6a0d;
display: flex;
flex-direction: column;
justify-content: center;
position: relative
}

.post-detail .left-zone::before {
content: '';
position: absolute;
top: 16px;
left: 16px;
right: 48px;
bottom: 16px;
border: 2px solid #420b6a4d;
border-right: none;
border-radius: 14px 0 0 14px
}

.post-detail .zone-heading {
font-size: 33px;
line-height: 1.45;
margin: 0 0 24px;
letter-spacing: -.01em;
position: relative;
padding-left: 48px
}

.post-detail .zone-heading::before {
content: '';
position: absolute;
left: 24px;
top: 50%;
width: 8px;
height: 8px;
background: #420B6A;
border-radius: 8px;
transform: translateY(-50%);
box-shadow: 0 0 16px #420b6a99
}

.post-detail .zone-text {
font-size: 24px;
line-height: 1.65;
color: #b8b5b2;
padding-left: 48px;
letter-spacing: .005em
}

.post-detail .right-zone {
padding: 48px 0 48px 48px;
background: #09ffe108;
display: flex;
flex-direction: column;
justify-content: center;
position: relative
}

.post-detail .right-zone::before {
content: '';
position: absolute;
top: 16px;
left: 48px;
right: 16px;
bottom: 16px;
border: 2px solid #09ffe14d;
border-left: none;
border-radius: 0 14px 14px 0
}

.post-detail .right-zone .zone-heading::before {
background: #09FFE1;
box-shadow: 0 0 16px #09ffe199
}

.post-detail .curtain-group {
display: flex;
flex-direction: column;
gap: 24px;
padding-left: 48px
}

.post-detail .curtain-item {
background: #ff0f4d14;
padding: 24px;
border-radius: 8px;
border-left: 3px solid #FF0F4D;
transition: all .38s ease-out;
max-height: 80px;
overflow: hidden
}

.post-detail .curtain-item:hover {
max-height: 400px;
background: #ff0f4d26;
box-shadow: 1px 5px 22px 0 #ff0f4d14
}

.post-detail .curtain-label {
font-size: 24px;
line-height: 1.45;
font-weight: 600;
margin-bottom: 16px;
color: #FF0F4D;
letter-spacing: -.005em
}

.post-detail .curtain-content {
font-size: 14px;
line-height: 1.65;
color: #d4d1ce;
letter-spacing: .01em
}

@media (max-width: 1280px) {
.post-detail .content-wrapper {
grid-template-columns: 1fr;
gap: 48px
}

.post-detail .sidebar-panel {
position: static;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 48px
}

.post-detail .like-counter {
margin-top: 0
}

.post-detail .split-display {
grid-template-columns: 1fr
}

.post-detail .split-display::before {
display: none
}

.post-detail .left-zone,
.post-detail .right-zone {
padding: 48px
}

.post-detail .left-zone::before,
.post-detail .right-zone::before {
left: 16px;
right: 16px;
border: 2px solid #420b6a4d;
border-radius: 14px
}

.post-detail .right-zone::before {
border-color: #09ffe14d
}
}

@media (max-width: 768px) {
.post-detail .title-zone {
padding: 48px 16px
}

.post-detail .main-heading {
font-size: 46px
}

.post-detail .intro-text {
font-size: 24px
}

.post-detail .cover-visual {
padding: 0 16px 24px
}

.post-detail .cover-visual img {
height: 280px
}

.post-detail .content-wrapper {
padding: 48px 16px
}

.post-detail .article-body {
padding: 24px
}

.post-detail .article-body p:first-of-type {
margin-left: -16px;
margin-right: -16px
}

.post-detail .article-body h2 {
font-size: 33px
}

.post-detail .article-body h3 {
font-size: 24px;
margin-left: -16px;
margin-right: -16px
}

.post-detail .sidebar-panel {
grid-template-columns: 1fr;
gap: 24px
}

.post-detail .reaction-module,
.post-detail .poll-module {
padding: 24px
}

.post-detail .split-display {
padding: 0 16px 48px
}

.post-detail .left-zone,
.post-detail .right-zone {
padding: 24px
}

.post-detail .zone-heading,
.post-detail .zone-text,
.post-detail .curtain-group {
padding-left: 24px
}

.post-detail .like-count {
font-size: 46px
}
}

.reach-us {
background: #1a1512;
color: #e8e4df;
overflow-x: clip
}

.reach-us .intro-zone {
max-width: 1440px;
margin: 0 auto;
padding: 96px 24px;
display: grid;
grid-template-columns: 1fr 1.3fr;
gap: 48px;
align-items: center;
position: relative
}

.reach-us .intro-zone::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(127deg, #420B6A 0%, #1a1512 35%, #FF0F4D 68%, #1a1512 100%);
opacity: .09;
pointer-events: none;
z-index: 0
}

.reach-us .text-container {
padding: 48px 48px 48px 24px;
z-index: 1;
position: relative
}

.reach-us .img-container {
padding: 24px 96px 24px 48px;
z-index: 1;
position: relative;
overflow: hidden
}

.reach-us .main-heading {
font-size: 62px;
line-height: 1.2;
letter-spacing: -.02em;
margin: 0 0 24px;
color: #09FFE1
}

.reach-us .main-heading .accent-dash {
color: #FF0F4D
}

.reach-us .description-text {
font-size: 24px;
line-height: 1.65;
letter-spacing: .01em;
margin: 0 0 24px;
background: #420b6a1f;
padding: 24px;
border-radius: 14px;
box-shadow: 1px 5px 22px 0 #420b6a14
}

.reach-us .description-text:first-of-type {
background: #ff0f4d14;
border-left: 4px solid #FF0F4D;
box-shadow: 1px 5px 22px 0 #ff0f4d14
}

.reach-us .visual-anchor {
position: relative;
border-radius: 34px;
overflow: hidden;
animation: vertical-clip-reveal .85s ease-out forwards;
clip-path: inset(0 0 100% 0)
}

@keyframes vertical-clip-reveal {
to {
clip-path: inset(0 0 0 0)
}
}

.reach-us .featured-img {
width: 100%;
height: 520px;
object-fit: cover;
object-position: center;
display: block;
filter: sepia(0.25) hue-rotate(250deg) saturate(1.4);
transition: transform .38s ease-out, filter .29s ease-out
}

.reach-us .visual-anchor:hover .featured-img {
transform: scale(1.06);
filter: sepia(0.15) hue-rotate(250deg) saturate(1.2)
}

.reach-us .visual-anchor::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(180deg, #420b6a4d 0%, #ff0f4d26 100%);
pointer-events: none;
transition: opacity .32s ease-out
}

.reach-us .visual-anchor:hover::after {
opacity: .6
}

.reach-us .dot-pattern {
position: absolute;
bottom: 96px;
left: 24px;
display: flex;
gap: 16px;
z-index: 2
}

.reach-us .dot-item {
width: 8px;
height: 8px;
border-radius: 8px;
background: #09FFE1;
box-shadow: 0 0 16px #09ffe199;
animation: dot-pulse 2.1s ease-in-out infinite
}

.reach-us .dot-item:nth-child(2) {
animation-delay: .3s;
background: #FF0F4D;
box-shadow: 0 0 16px #ff0f4d99
}

.reach-us .dot-item:nth-child(3) {
animation-delay: .6s;
background: #420B6A;
box-shadow: 0 0 16px #420b6a99
}

@keyframes dot-pulse {

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

50% {
transform: scale(1.4);
opacity: .7
}
}

.reach-us .form-zone {
position: relative;
background: #211c19;
padding: 96px 0
}

.reach-us .form-zone::before {
content: '';
position: absolute;
top: -60px;
left: 0;
width: 100%;
height: 60px;
background: #211c19;
border-radius: 50% 50% 0 0 / 100% 100% 0 0
}

.reach-us .form-zone::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: repeating-linear-gradient(45deg, transparent, transparent 48px, #09ffe105 48px, #09ffe105 96px), repeating-linear-gradient(-45deg, transparent, transparent 48px, #ff0f4d05 48px, #ff0f4d05 96px);
pointer-events: none
}

.reach-us .form-wrapper {
max-width: 1440px;
margin: 0 auto;
padding: 0 24px;
display: grid;
grid-template-columns: 1fr 1.6fr;
gap: 96px;
position: relative;
z-index: 1
}

.reach-us .contact-info-side {
display: flex;
flex-direction: column;
gap: 48px
}

.reach-us .info-heading {
font-size: 46px;
line-height: 1.2;
letter-spacing: -.01em;
margin: 0 0 24px;
position: relative;
display: inline-block;
animation: vertical-clip-reveal .72s ease-out .15s backwards
}

.reach-us .info-heading::before {
content: '';
position: absolute;
left: -16px;
top: 0;
width: calc(100% + 32px);
height: 100%;
background: linear-gradient(90deg, #420B6A 0%, transparent 100%);
z-index: -1;
border-radius: 8px
}

.reach-us .info-intro {
font-size: 24px;
line-height: 1.65;
letter-spacing: .005em;
margin: 0 0 48px;
color: #c9c4bf
}

.reach-us .detail-cards {
display: flex;
flex-direction: column;
gap: 24px
}

.reach-us .detail-card {
background: #1a1512;
padding: 24px;
border-radius: 14px;
border: 1px solid #09ffe126;
box-shadow: 1px 5px 22px 0 #ff0f4d14;
transition: transform .27s ease-out, box-shadow .35s ease-out, border-color .23s ease-out;
position: relative;
overflow: hidden
}

.reach-us .detail-card::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent 0%, #09ffe114 50%, transparent 100%);
transition: left .45s ease-out
}

.reach-us .detail-card:hover {
transform: scale(1.03);
box-shadow: 1px 12px 60px 0 #ff0f4d21;
border-color: #09ffe166
}

.reach-us .detail-card:hover::before {
left: 100%
}

.reach-us .card-label {
font-size: 14px;
line-height: 1.45;
letter-spacing: .08em;
text-transform: uppercase;
color: #09FFE1;
margin: 0 0 8px;
display: flex;
align-items: center;
gap: 8px
}

.reach-us .card-value {
font-size: 24px;
line-height: 1.45;
letter-spacing: .01em;
margin: 0;
color: #e8e4df
}

.reach-us .card-value a {
color: inherit;
text-decoration: none;
transition: color .19s ease-out
}

.reach-us .card-value a:hover {
color: #FF0F4D
}

.reach-us .icon-marker {
width: 24px;
height: 24px;
display: inline-flex;
align-items: center;
justify-content: center;
background: #09ffe126;
border-radius: 8px;
flex-shrink: 0
}

.reach-us .icon-marker svg {
width: 14px;
height: 14px;
fill: #09FFE1
}

.reach-us .contact-form-side {
background: #1a1512;
padding: 48px;
border-radius: 34px;
box-shadow: 1px 12px 60px 0 #420b6a21;
border: 1px solid #420b6a33;
animation: vertical-clip-reveal .68s ease-out .3s backwards
}

.reach-us .form-heading {
font-size: 33px;
line-height: 1.2;
letter-spacing: -.005em;
margin: 0 0 8px;
color: #09FFE1
}

.reach-us .form-subtext {
font-size: 14px;
line-height: 1.65;
letter-spacing: .01em;
margin: 0 0 48px;
color: #a39e99
}

.reach-us .contact-form {
display: flex;
flex-direction: column;
gap: 24px
}

.reach-us .name-row {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 24px
}

.reach-us .field-group {
display: flex;
flex-direction: column;
gap: 8px
}

.reach-us .field-label {
font-size: 14px;
line-height: 1.45;
letter-spacing: .02em;
color: #c9c4bf;
margin: 0
}

.reach-us .field-label .required-mark {
color: #FF0F4D;
margin-left: 4px
}

.reach-us .field-input {
background: #211c19;
border: 1px solid #09ffe133;
border-radius: 8px;
padding: 16px;
font-size: 14px;
line-height: 1.45;
letter-spacing: .01em;
color: #e8e4df;
transition: border-color .21s ease-out, box-shadow .26s ease-out, background-color .18s ease-out;
outline: none
}

.reach-us .field-input::placeholder {
color: #6a6560;
opacity: .6;
font-style: italic
}

.reach-us .field-input:focus {
border-color: #09FFE1;
box-shadow: 0 0 0 3px #09ffe126 1px 5px 22px 0 #09ffe114;
background-color: #1a1512
}

.reach-us .field-input:hover:not(:focus) {
border-color: #09ffe159
}

.reach-us .field-select {
background: #211c19;
border: 1px solid #09ffe133;
border-radius: 8px;
padding: 16px;
font-size: 14px;
line-height: 1.45;
letter-spacing: .01em;
color: #e8e4df;
transition: border-color .21s ease-out, box-shadow .26s ease-out, background-color .18s ease-out;
outline: none;
cursor: pointer;
appearance: none;
background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L6 6L11 1' stroke='%2309FFE1' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: right 16px center;
padding-right: 48px
}

.reach-us .field-select:focus {
border-color: #09FFE1;
box-shadow: 0 0 0 3px #09ffe126 1px 5px 22px 0 #09ffe114;
background-color: #1a1512
}

.reach-us .field-select:hover:not(:focus) {
border-color: #09ffe159
}

.reach-us .field-select option {
background: #211c19;
color: #e8e4df
}

.reach-us .privacy-checkbox-wrapper {
display: flex;
align-items: flex-start;
gap: 16px;
padding: 16px;
background: #420b6a14;
border-radius: 8px;
border: 1px solid #420b6a33;
transition: border-color .23s ease-out, background-color .27s ease-out
}

.reach-us .privacy-checkbox-wrapper:hover {
border-color: #420b6a66;
background: #420b6a1f
}

.reach-us .checkbox-input {
width: 20px;
height: 20px;
margin: 0;
cursor: pointer;
accent-color: #420B6A;
flex-shrink: 0
}

.reach-us .checkbox-label {
font-size: 14px;
line-height: 1.65;
letter-spacing: .005em;
color: #c9c4bf;
margin: 0;
cursor: pointer
}

.reach-us .checkbox-label a {
color: #09FFE1;
text-decoration: none;
border-bottom: 1px solid #09ffe14d;
transition: color .17s ease-out, border-color .17s ease-out
}

.reach-us .checkbox-label a:hover {
color: #FF0F4D;
border-color: #ff0f4d80
}

.reach-us .submit-btn {
background: linear-gradient(135deg, #420B6A 0%, #FF0F4D 100%);
border: none;
border-radius: 48px;
padding: 24px 48px;
font-size: 24px;
line-height: 1.2;
letter-spacing: .01em;
color: #e8e4df;
cursor: pointer;
transition: transform .24s ease-out, box-shadow .31s ease-out;
box-shadow: 1px 5px 22px 0 #420b6a14;
position: relative;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
gap: 16px
}

.reach-us .submit-btn::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent 0%, #09ffe133 50%, transparent 100%);
transition: left .42s ease-out
}

.reach-us .submit-btn:hover {
transform: translateY(-2px) scale(1.02);
box-shadow: 1px 12px 60px 0 #ff0f4d21
}

.reach-us .submit-btn:hover::before {
left: 100%
}

.reach-us .submit-btn:active {
transform: translateY(0) scale(0.98)
}

.reach-us .btn-icon {
width: 24px;
height: 24px;
display: inline-flex;
align-items: center;
justify-content: center;
transition: transform .28s ease-out
}

.reach-us .submit-btn:hover .btn-icon {
transform: translateX(8px)
}

.reach-us .btn-icon svg {
width: 100%;
height: 100%;
fill: currentColor
}

.reach-us .metric-badges {
display: flex;
gap: 16px;
margin-top: 48px;
flex-wrap: wrap
}

.reach-us .badge-item {
display: inline-flex;
align-items: center;
gap: 8px;
background: #09ffe11a;
padding: 8px 16px;
border-radius: 34px;
border: 1px solid #09ffe140;
font-size: 14px;
line-height: 1.45;
letter-spacing: .02em;
color: #09FFE1;
box-shadow: 1px 1px 5px 0 #09ffe10f;
transition: transform .22s ease-out, box-shadow .28s ease-out
}

.reach-us .badge-item:hover {
transform: scale(1.08);
box-shadow: 1px 5px 22px 0 #09ffe114
}

.reach-us .badge-counter {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 24px;
height: 24px;
background: #420B6A;
color: #09FFE1;
border-radius: 34px;
font-size: 14px;
font-weight: 600;
padding: 0 8px
}

@media (max-width: 1280px) {
.reach-us .intro-zone {
grid-template-columns: 1fr;
gap: 48px;
padding: 48px 24px
}

.reach-us .text-container {
padding: 24px
}

.reach-us .img-container {
padding: 24px
}

.reach-us .main-heading {
font-size: 46px
}

.reach-us .description-text {
font-size: 24px
}

.reach-us .form-wrapper {
grid-template-columns: 1fr;
gap: 48px
}

.reach-us .contact-form-side {
padding: 48px 24px
}
}

@media (max-width: 768px) {
.reach-us .intro-zone {
padding: 48px 16px
}

.reach-us .text-container {
padding: 16px
}

.reach-us .img-container {
padding: 16px
}

.reach-us .main-heading {
font-size: 33px
}

.reach-us .description-text {
font-size: 14px;
padding: 16px
}

.reach-us .featured-img {
height: 320px
}

.reach-us .dot-pattern {
bottom: 48px;
left: 16px
}

.reach-us .form-zone {
padding: 48px 0
}

.reach-us .form-wrapper {
padding: 0 16px;
gap: 48px
}

.reach-us .info-heading {
font-size: 33px
}

.reach-us .info-intro {
font-size: 14px
}

.reach-us .contact-form-side {
padding: 24px 16px
}

.reach-us .form-heading {
font-size: 24px
}

.reach-us .form-subtext {
font-size: 14px;
margin-bottom: 24px
}

.reach-us .name-row {
grid-template-columns: 1fr;
gap: 16px
}

.reach-us .submit-btn {
padding: 16px 24px;
font-size: 14px
}

.reach-us .metric-badges {
margin-top: 24px
}

.reach-us .card-value {
font-size: 14px
}
}

.launch-hub {
background: linear-gradient(147deg, #1a1412 0%, #0f0d0c 34%, #1c1614 67%, #120f0e 100%);
color: #e8e4df;
overflow-x: hidden
}

.launch-hub .hero-stage {
max-width: 1440px;
margin: 0 auto;
padding: 96px 24px;
position: relative;
overflow: hidden
}

.launch-hub .hero-stage::before {
content: '';
position: absolute;
top: 48px;
right: 96px;
width: 280px;
height: 280px;
background: radial-gradient(circle, #420b6a14 0%, transparent 70%);
pointer-events: none
}

.launch-hub .hero-stage::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: radial-gradient(circle, #09ffe108 1px, transparent 1px), radial-gradient(circle, #ff0f4d08 1px, transparent 1px);
background-size: 48px 48px, 64px 64px;
background-position: 0 0, 24px 24px;
pointer-events: none
}

.launch-hub .hero-visual {
width: 100%;
height: 420px;
position: relative;
margin-bottom: 48px;
border-radius: 14px;
overflow: hidden;
animation: slideFromLeft .42s ease-out
}

@keyframes slideFromLeft {
from {
opacity: 0;
transform: translateX(-60px)
}

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

.launch-hub .hero-visual img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center
}

.launch-hub .hero-visual::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(127deg, #420b6ab3 0%, transparent 48%, #09ffe166 100%);
z-index: 1
}

.launch-hub .hero-text {
animation: slideFromLeft .38s ease-out .15s backwards
}

.launch-hub .hero-text h1 {
font-size: 62px;
line-height: 1.2;
letter-spacing: -.03em;
margin: 0 0 24px;
color: #09FFE1
}

.launch-hub .hero-text ul {
list-style: none;
padding: 0;
margin: 0 0 48px
}

.launch-hub .hero-text li {
font-size: 24px;
line-height: 1.65;
margin-bottom: 16px;
padding-left: 32px;
position: relative
}

.launch-hub .hero-text li::before {
content: '';
position: absolute;
left: 0;
top: 12px;
width: 8px;
height: 8px;
background: #FF0F4D;
border-radius: 50%;
box-shadow: 0 0 12px #ff0f4d99
}

.launch-hub .connections-wrap {
max-width: 1440px;
margin: 0 auto;
padding: 96px 24px;
background: linear-gradient(73deg, #0f0d0c 0%, #1a1412 100%);
position: relative
}

.launch-hub .connections-wrap::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 2px;
background: linear-gradient(90deg, #420B6A 0%, #420b6a00 100%)
}

.launch-hub .connections-wrap h2 {
font-size: 46px;
line-height: 1.2;
letter-spacing: -.02em;
margin: 0 0 48px;
background: linear-gradient(90deg, #09FFE1 0%, #420B6A 100%);
padding: 16px 24px;
border-radius: 8px;
display: inline-block
}

.launch-hub .link-grid {
display: grid;
grid-template-columns: 1fr;
gap: 24px
}

.launch-hub .link-card {
background: #420b6a14;
border: 1px solid #09ffe126;
border-radius: 14px;
padding: 24px;
position: relative;
transition: transform .28s ease-out, box-shadow .28s ease-out, border-color .28s ease-out;
box-shadow: 1px 1px 5px 0 #420b6a0f
}

.launch-hub .link-card::before {
content: '';
position: absolute;
top: 8px;
right: 8px;
width: 48px;
height: 48px;
border: 2px solid #ff0f4d33;
border-radius: 48px;
pointer-events: none
}

.launch-hub .link-card::after {
content: '';
position: absolute;
top: 16px;
right: 16px;
width: 32px;
height: 32px;
border: 1px solid #ff0f4d26;
border-radius: 34px;
pointer-events: none
}

.launch-hub .link-card:hover {
transform: translateY(-4px);
box-shadow: 1px 12px 60px 0 #09ffe121;
border-color: #09ffe166
}

.launch-hub .link-card h3 {
font-size: 33px;
line-height: 1.2;
letter-spacing: -.01em;
margin: 0 0 16px;
color: #09FFE1
}

.launch-hub .link-card p {
font-size: 14px;
line-height: 1.65;
margin: 0;
color: #c4bfb7
}

.launch-hub .link-card .arrow-hint {
display: inline-block;
margin-left: 8px;
color: #FF0F4D;
transition: transform .22s ease-out
}

.launch-hub .link-card:hover .arrow-hint {
transform: translateX(6px)
}

.launch-hub .entry-zone {
max-width: 1440px;
margin: 0 auto;
padding: 96px 24px;
position: relative
}

.launch-hub .entry-zone::before {
content: '';
position: absolute;
top: 0;
left: 50%;
width: 1px;
height: 100%;
background: linear-gradient(180deg, #ff0f4d33 0%, transparent 100%);
transform: translateX(-50%)
}

.launch-hub .entry-zone h2 {
font-size: 46px;
line-height: 1.2;
letter-spacing: -.02em;
margin: 0 0 48px;
text-align: center
}

.launch-hub .entry-zone h2 span {
color: #FF0F4D
}

.launch-hub .starter-flow {
display: flex;
flex-direction: column;
gap: 48px
}

.launch-hub .starter-item {
display: flex;
flex-direction: column;
gap: 24px;
animation: slideFromLeft .35s ease-out backwards
}

.launch-hub .starter-item:nth-child(2) {
animation-delay: .1s
}

.launch-hub .starter-item:nth-child(3) {
animation-delay: .2s
}

.launch-hub .starter-visual {
width: 100%;
height: 280px;
border-radius: 14px;
overflow: hidden;
position: relative;
transition: box-shadow .32s ease-out
}

.launch-hub .starter-visual:hover {
box-shadow: inset 0 0 60px #0006 1px 5px 22px 0 #ff0f4d14
}

.launch-hub .starter-visual img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
transition: transform .42s ease-out
}

.launch-hub .starter-visual:hover img {
transform: scale(1.05)
}

.launch-hub .starter-content h3 {
font-size: 33px;
line-height: 1.2;
letter-spacing: -.01em;
margin: 0 0 16px;
color: #09FFE1
}

.launch-hub .starter-content p {
font-size: 14px;
line-height: 1.65;
margin: 0 0 24px;
color: #c4bfb7;
background: #09ffe10d;
padding: 16px;
border-radius: 8px;
border-left: 3px solid #420B6A
}

.launch-hub .starter-content a {
display: inline-flex;
align-items: center;
gap: 8px;
font-size: 14px;
padding: 16px 24px;
background: #420b6a4d;
color: #09FFE1;
text-decoration: none;
border-radius: 8px;
border: 1px solid #09ffe133;
transition: background .25s ease-out, transform .25s ease-out, gap .25s ease-out
}

.launch-hub .starter-content a:hover {
background: #420b6a80;
transform: translateX(4px);
gap: 16px
}

.launch-hub .posts-display {
max-width: 1440px;
margin: 0 auto;
padding: 96px 24px;
background: linear-gradient(217deg, #1a1412 0%, #120f0e 50%, #0f0d0c 100%);
position: relative
}

.launch-hub .posts-display::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 2px;
background: linear-gradient(90deg, #09ffe100 0%, #09FFE1 50%, #09ffe100 100%)
}

.launch-hub .posts-display h2 {
font-size: 46px;
line-height: 1.2;
letter-spacing: -.02em;
margin: 0 0 48px
}

.launch-hub .post-grid {
display: grid;
grid-template-columns: 1fr;
gap: 48px
}

.launch-hub .post-entry {
background: #ff0f4d0a;
border-radius: 14px;
overflow: hidden;
border: 1px solid #420b6a4d;
transition: transform .3s ease-out, box-shadow .3s ease-out;
box-shadow: 1px 1px 5px 0 #ff0f4d0f
}

.launch-hub .post-entry:hover {
transform: translateY(-6px);
box-shadow: 1px 12px 60px 0 #420b6a21
}

.launch-hub .post-thumb {
width: 100%;
height: 240px;
position: relative;
overflow: hidden
}

.launch-hub .post-thumb img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
transition: transform .38s ease-out
}

.launch-hub .post-entry:hover .post-thumb img {
transform: scale(1.08)
}

.launch-hub .post-tag {
position: absolute;
top: 16px;
left: 16px;
background: #420b6ae6;
color: #09FFE1;
font-size: 14px;
padding: 8px 16px;
border-radius: 34px;
border: 1px solid #09ffe14d;
z-index: 2
}

.launch-hub .post-body {
padding: 24px
}

.launch-hub .post-body h3 {
font-size: 24px;
line-height: 1.45;
letter-spacing: -.01em;
margin: 0 0 16px;
color: #e8e4df
}

.launch-hub .post-body p {
font-size: 14px;
line-height: 1.65;
margin: 0 0 24px;
color: #b8b3aa
}

.launch-hub .post-meta {
display: flex;
align-items: center;
justify-content: space-between;
padding-top: 16px;
border-top: 1px solid #ff0f4d26
}

.launch-hub .post-meta a {
font-size: 14px;
color: #FF0F4D;
text-decoration: none;
transition: color .2s ease-out
}

.launch-hub .post-meta a:hover {
color: #09FFE1
}

.launch-hub .like-count {
display: flex;
align-items: center;
gap: 8px;
font-size: 14px;
color: #c4bfb7
}

.launch-hub .like-count::before {
content: '';
width: 16px;
height: 16px;
background: #FF0F4D;
clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%)
}

.launch-hub .subscribe-panel {
max-width: 1440px;
margin: 0 auto;
padding: 96px 24px;
position: relative;
background: linear-gradient(43deg, #0f0d0c 0%, #1c1614 100%)
}

.launch-hub .subscribe-panel::before {
content: '';
position: absolute;
top: 0;
right: 0;
width: 50%;
height: 100%;
background: linear-gradient(217deg, #420b6a26 0%, transparent 100%);
clip-path: polygon(20% 0, 100% 0, 100% 100%, 0 100%);
pointer-events: none
}

.launch-hub .subscribe-panel h2 {
font-size: 46px;
line-height: 1.2;
letter-spacing: -.02em;
margin: 0 0 24px;
color: #09FFE1
}

.launch-hub .subscribe-panel p {
font-size: 24px;
line-height: 1.65;
margin: 0 0 48px;
color: #c4bfb7
}

.launch-hub .subscribe-form {
display: flex;
flex-direction: column;
gap: 16px;
max-width: 560px
}

.launch-hub .subscribe-form input {
font-size: 14px;
padding: 16px 24px;
border: 1px solid #09ffe133;
border-radius: 8px;
background: #420b6a1a;
color: #e8e4df;
transition: border-color .27s ease-out, box-shadow .27s ease-out
}

.launch-hub .subscribe-form input::placeholder {
color: #8a8378;
opacity: .6;
font-style: italic
}

.launch-hub .subscribe-form input:focus {
outline: none;
border-color: #09FFE1;
box-shadow: 0 0 16px #09ffe133
}

.launch-hub .subscribe-form button {
font-size: 14px;
padding: 16px 24px;
background: linear-gradient(90deg, #420B6A 0%, #FF0F4D 100%);
color: #e8e4df;
border: none;
border-radius: 8px;
cursor: pointer;
transition: transform .24s ease-out, box-shadow .24s ease-out;
box-shadow: 1px 5px 22px 0 #420b6a14
}

.launch-hub .subscribe-form button:hover {
transform: translateY(-2px);
box-shadow: 1px 12px 60px 0 #ff0f4d21
}

.launch-hub .subscribe-form button:active {
transform: translateY(0)
}

.launch-hub .direction-map {
max-width: 1440px;
margin: 0 auto;
padding: 96px 24px;
position: relative
}

.launch-hub .direction-map h2 {
font-size: 46px;
line-height: 1.2;
letter-spacing: -.02em;
margin: 0 0 48px;
text-align: center
}

.launch-hub .direction-columns {
display: grid;
grid-template-columns: 1fr;
gap: 24px
}

.launch-hub .direction-col {
background: #09ffe10a;
border: 1px solid #ff0f4d26;
border-radius: 14px;
padding: 24px;
position: relative;
overflow: hidden
}

.launch-hub .direction-col::before {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 4px;
background: linear-gradient(90deg, #420B6A 0%, #FF0F4D 50%, #09FFE1 100%)
}

.launch-hub .direction-col h3 {
font-size: 33px;
line-height: 1.2;
letter-spacing: -.01em;
margin: 0 0 24px;
background: #420b6a33;
padding: 8px 16px;
border-radius: 8px;
display: inline-block;
color: #09FFE1
}

.launch-hub .direction-col ul {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-wrap: wrap;
gap: 8px
}

.launch-hub .direction-col li {
font-size: 14px;
background: #420b6a33;
color: #e8e4df;
padding: 8px 16px;
border-radius: 34px;
border: 1px solid #09ffe126;
transition: background .19s ease-out, transform .19s ease-out
}

.launch-hub .direction-col li:hover {
background: #420b6a66;
transform: translateY(-2px)
}

.launch-hub .metrics-showcase {
max-width: 1440px;
margin: 0 auto;
padding: 96px 24px;
background: linear-gradient(127deg, #120f0e 0%, #1a1412 100%);
position: relative
}

.launch-hub .metrics-showcase::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 2px;
background: linear-gradient(90deg, #ff0f4d00 0%, #FF0F4D 50%, #ff0f4d00 100%)
}

.launch-hub .metrics-showcase h2 {
font-size: 46px;
line-height: 1.2;
letter-spacing: -.02em;
margin: 0 0 48px;
text-align: center;
color: #FF0F4D
}

.launch-hub .funnel-visual {
max-width: 680px;
margin: 0 auto 48px;
position: relative
}

.launch-hub .funnel-stage {
background: #420b6a26;
border: 2px solid #09ffe133;
border-radius: 8px;
padding: 24px;
margin-bottom: 16px;
position: relative;
transition: transform .26s ease-out, box-shadow .26s ease-out
}

.launch-hub .funnel-stage:hover {
transform: translateX(8px);
box-shadow: 1px 5px 22px 0 #09ffe114
}

.launch-hub .funnel-stage:nth-child(1) {
width: 100%
}

.launch-hub .funnel-stage:nth-child(2) {
width: 85%;
margin-left: auto;
margin-right: auto
}

.launch-hub .funnel-stage:nth-child(3) {
width: 70%;
margin-left: auto;
margin-right: auto
}

.launch-hub .funnel-stage:nth-child(4) {
width: 55%;
margin-left: auto;
margin-right: auto;
margin-bottom: 0
}

.launch-hub .funnel-stage h3 {
font-size: 24px;
line-height: 1.45;
letter-spacing: -.01em;
margin: 0 0 8px;
color: #09FFE1
}

.launch-hub .funnel-stage p {
font-size: 14px;
line-height: 1.65;
margin: 0;
color: #c4bfb7
}

.launch-hub .stat-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 24px
}

.launch-hub .stat-box {
background: #ff0f4d14;
border: 2px solid #ff0f4d4d;
border-radius: 14px;
padding: 24px;
text-align: center;
position: relative;
overflow: hidden
}

.launch-hub .stat-box::before {
content: '';
position: absolute;
top: -50%;
left: -50%;
width: 200%;
height: 200%;
background: linear-gradient(45deg, transparent 30%, #09ffe10d 50%, transparent 70%);
animation: shimmer 3s infinite
}

@keyframes shimmer {
0% {
transform: translateX(-100%) translateY(-100%) rotate(45deg)
}

100% {
transform: translateX(100%) translateY(100%) rotate(45deg)
}
}

.launch-hub .stat-number {
font-size: 62px;
line-height: 1.2;
letter-spacing: -.03em;
margin: 0 0 8px;
color: #FF0F4D;
position: relative;
z-index: 1
}

.launch-hub .stat-label {
font-size: 14px;
line-height: 1.45;
margin: 0;
color: #e8e4df;
position: relative;
z-index: 1
}

.launch-hub .team-highlight {
max-width: 1440px;
margin: 0 auto;
padding: 96px 24px;
position: relative
}

.launch-hub .team-highlight::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 2px;
background: linear-gradient(90deg, #420B6A 0%, #420b6a00 100%)
}

.launch-hub .team-highlight h2 {
font-size: 46px;
line-height: 1.2;
letter-spacing: -.02em;
margin: 0 0 48px
}

.launch-hub .team-profiles {
display: grid;
grid-template-columns: 1fr;
gap: 48px
}

.launch-hub .profile-card {
display: flex;
flex-direction: column;
gap: 24px;
background: #420b6a0f;
border: 1px solid #09ffe126;
border-radius: 14px;
padding: 24px;
position: relative
}

.launch-hub .profile-card::before {
content: '';
position: absolute;
top: 16px;
left: 16px;
width: 80px;
height: 80px;
border: 1px solid #ff0f4d33;
border-radius: 48px;
pointer-events: none
}

.launch-hub .profile-pic {
width: 140px;
height: 140px;
border-radius: 50%;
overflow: hidden;
border: 3px solid #09ffe14d;
box-shadow: 1px 5px 22px 0 #420b6a14
}

.launch-hub .profile-pic img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: top
}

.launch-hub .profile-info h3 {
font-size: 33px;
line-height: 1.2;
letter-spacing: -.01em;
margin: 0 0 8px;
color: #09FFE1
}

.launch-hub .profile-info .role {
font-size: 14px;
color: #FF0F4D;
margin: 0 0 16px
}

.launch-hub .profile-info p {
font-size: 14px;
line-height: 1.65;
margin: 0;
color: #c4bfb7
}

@media (min-width: 768px) {
.launch-hub .hero-stage {
padding: 96px 48px
}

.launch-hub .hero-visual {
height: 520px
}

.launch-hub .link-grid {
grid-template-columns: repeat(2, 1fr);
gap: 48px
}

.launch-hub .starter-item {
flex-direction: row;
align-items: center
}

.launch-hub .starter-visual {
width: 50%;
flex-shrink: 0
}

.launch-hub .post-grid {
grid-template-columns: repeat(2, 1fr)
}

.launch-hub .direction-columns {
grid-template-columns: repeat(2, 1fr);
gap: 48px
}

.launch-hub .stat-grid {
grid-template-columns: repeat(4, 1fr)
}

.launch-hub .team-profiles {
grid-template-columns: repeat(2, 1fr)
}

.launch-hub .profile-card {
flex-direction: row;
align-items: center
}

.launch-hub .subscribe-form {
flex-direction: row
}

.launch-hub .subscribe-form input {
flex: 1
}

.launch-hub .subscribe-form button {
flex-shrink: 0
}
}

@media (min-width: 1280px) {
.launch-hub .hero-stage {
padding: 96px
}

.launch-hub .link-grid {
grid-template-columns: repeat(3, 1fr)
}

.launch-hub .starter-visual {
width: 45%
}

.launch-hub .direction-columns {
grid-template-columns: repeat(3, 1fr)
}
}

.evts-hub {
background: #1a1514;
color: #e8e6e4;
min-height: 100vh;
overflow-x: hidden
}

.evts-hub .top-banner {
max-width: 1440px;
margin: 0 auto;
padding: 96px 24px 48px;
display: grid;
grid-template-columns: 1fr 380px;
gap: 48px;
align-items: end;
position: relative
}

.evts-hub .top-banner::before {
content: '';
position: absolute;
top: -120px;
right: -80px;
width: 420px;
height: 420px;
background: radial-gradient(circle at 30% 40%, #420b6a2e, transparent 65%);
pointer-events: none;
z-index: 0
}

.evts-hub .banner-txt {
position: relative;
z-index: 1;
padding: 48px 0 24px
}

.evts-hub .banner-txt h1 {
font-size: 62px;
line-height: 1.2;
letter-spacing: -.02em;
margin: 0 0 24px;
color: #fff
}

.evts-hub .banner-txt p {
font-size: 24px;
line-height: 1.45;
letter-spacing: .01em;
color: #c9c5c2;
margin: 0;
max-width: 540px
}

.evts-hub .banner-img-frame {
position: relative;
border: 3px dashed #ff0f4d59;
border-radius: 34px;
padding: 16px;
background: linear-gradient(142deg, #420b6a14, #09ffe10d);
box-shadow: 1px 12px 60px 0 #420b6a21;
overflow: hidden
}

.evts-hub .banner-img-frame img {
width: 100%;
height: 320px;
object-fit: cover;
object-position: center;
border-radius: 14px;
display: block;
position: relative
}

.evts-hub .banner-img-frame img::after {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 50%;
background: linear-gradient(to bottom, #1a151466, transparent);
pointer-events: none
}

.evts-hub .catalog-wrap {
max-width: 1440px;
margin: 0 auto;
padding: 96px 24px
}

.evts-hub .catalog-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 48px
}

.evts-hub .evt-card {
background: linear-gradient(156deg, #420b6a17 0%, #1a151466 100%);
border-radius: 14px;
overflow: hidden;
box-shadow: 1px 5px 22px 0 #ff0f4d14;
transition: transform .38s ease-out, box-shadow .38s ease-out;
position: relative;
animation: flipReveal .45s ease-out backwards
}

.evts-hub .evt-card:nth-child(1) {
animation-delay: .12s
}

.evts-hub .evt-card:nth-child(2) {
animation-delay: .24s
}

@keyframes flipReveal {
0% {
transform: perspective(800px) rotateY(-90deg);
opacity: 0
}

100% {
transform: perspective(800px) rotateY(0deg);
opacity: 1
}
}

.evts-hub .evt-card:hover {
transform: translateY(-8px);
box-shadow: 1px 12px 60px 0 #ff0f4d21
}

.evts-hub .evt-card-img {
position: relative;
height: 280px;
overflow: hidden
}

.evts-hub .evt-card-img img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
display: block;
transition: transform .42s ease-out, filter .42s ease-out
}

.evts-hub .evt-card:hover .evt-card-img img {
transform: scale(1.08);
filter: brightness(1.12)
}

.evts-hub .evt-card-tag {
position: absolute;
top: 16px;
left: 16px;
background: #09ffe1eb;
color: #1a1514;
padding: 8px 16px;
border-radius: 8px;
font-size: 14px;
line-height: 1.2;
font-weight: 600;
letter-spacing: .02em;
z-index: 2
}

.evts-hub .evt-card-body {
padding: 24px
}

.evts-hub .evt-card-meta {
display: flex;
gap: 24px;
margin-bottom: 16px;
font-size: 14px;
line-height: 1.45;
color: #a8a3a0;
letter-spacing: .01em
}

.evts-hub .evt-card-meta span {
display: flex;
align-items: center;
gap: 8px
}

.evts-hub .evt-card-meta .ico-clock,
.evts-hub .evt-card-meta .ico-cal {
width: 16px;
height: 16px;
fill: #09FFE1
}

.evts-hub .evt-card h3 {
font-size: 33px;
line-height: 1.2;
letter-spacing: -.01em;
margin: 0 0 16px;
color: #fff
}

.evts-hub .evt-card-desc {
font-size: 14px;
line-height: 1.65;
color: #c9c5c2;
margin: 0 0 24px;
letter-spacing: .01em
}

.evts-hub .evt-card-pricing {
display: flex;
flex-direction: column;
gap: 8px;
padding: 16px;
background: #420b6a26;
border-radius: 8px;
margin-bottom: 24px;
border-left: 4px solid #FF0F4D;
box-shadow: inset 0 1px 0 #ffffff0d inset 0 -1px 0 #0000004d
}

.evts-hub .evt-card-price-main {
font-size: 33px;
line-height: 1.2;
font-weight: 700;
color: #09FFE1;
letter-spacing: -.01em
}

.evts-hub .evt-card-price-terms {
font-size: 14px;
line-height: 1.45;
color: #a8a3a0;
letter-spacing: .01em
}

.evts-hub .evt-card-price-note {
font-size: 14px;
line-height: 1.45;
color: #e8e6e4;
letter-spacing: .01em;
font-style: italic
}

.evts-hub .evt-card-btn {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 16px 24px;
background: linear-gradient(135deg, #420B6A 0%, #FF0F4D 100%);
color: #fff;
border: none;
border-radius: 8px;
font-size: 14px;
line-height: 1.2;
font-weight: 600;
letter-spacing: .02em;
cursor: pointer;
text-decoration: none;
transition: transform .28s ease-out, box-shadow .28s ease-out, gap .28s ease-out;
box-shadow: 1px 5px 22px 0 #ff0f4d14;
position: relative;
overflow: hidden
}

.evts-hub .evt-card-btn::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, #ffffff26, transparent);
transition: left .42s ease-out
}

.evts-hub .evt-card-btn:hover {
transform: translateX(4px);
gap: 16px;
box-shadow: 1px 12px 60px 0 #ff0f4d21
}

.evts-hub .evt-card-btn:hover::before {
left: 100%
}

.evts-hub .evt-card-btn .arr-right {
width: 18px;
height: 18px;
fill: currentColor;
transition: transform .28s ease-out
}

.evts-hub .evt-card-btn:hover .arr-right {
transform: translateX(4px)
}

.evts-hub .insight-zone {
max-width: 1440px;
margin: 0 auto;
padding: 48px 24px 96px;
background: linear-gradient(168deg, #09ffe10a 0%, transparent 55%);
position: relative
}

.evts-hub .insight-zone::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 2px;
background: linear-gradient(90deg, transparent, #ff0f4d4d 50%, transparent);
clip-path: polygon(0 100%, 100% 0, 100% 100%)
}

.evts-hub .insight-grid {
display: grid;
grid-template-columns: 2fr 1fr;
gap: 48px;
align-items: start
}

.evts-hub .insight-main h2 {
font-size: 46px;
line-height: 1.2;
letter-spacing: -.01em;
margin: 0 0 24px;
color: #fff;
display: inline-block;
background: linear-gradient(90deg, #420b6a40, transparent);
padding: 8px 24px 8px 0;
border-radius: 8px
}

.evts-hub .insight-main p {
font-size: 14px;
line-height: 1.65;
color: #c9c5c2;
margin: 0 0 16px;
letter-spacing: .01em
}

.evts-hub .insight-main p:first-of-type {
background: #420b6a14;
padding: 16px;
border-radius: 8px;
border-left: 3px solid #FF0F4D
}

.evts-hub .insight-sidebar {
background: #1a151499;
padding: 24px;
border-radius: 14px;
border: 1px solid #ff0f4d26;
box-shadow: 1px 5px 22px 0 #420b6a14
}

.evts-hub .insight-sidebar h3 {
font-size: 24px;
line-height: 1.2;
letter-spacing: -.01em;
margin: 0 0 24px;
color: #09FFE1
}

.evts-hub .insight-list {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
gap: 16px
}

.evts-hub .insight-list li {
display: flex;
align-items: center;
gap: 16px;
padding: 16px;
background: #420b6a1f;
border-radius: 8px;
font-size: 14px;
line-height: 1.45;
color: #e8e6e4;
letter-spacing: .01em;
transition: background .32s ease-out, transform .32s ease-out;
cursor: default;
position: relative;
overflow: hidden
}

.evts-hub .insight-list li::before {
content: '';
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 0;
background: linear-gradient(90deg, #09ffe126, transparent);
transition: width .45s ease-out
}

.evts-hub .insight-list li:hover::before {
width: 100%
}

.evts-hub .insight-list li:hover {
background: #420b6a2e;
transform: translateX(8px)
}

.evts-hub .insight-list .ico-marker {
width: 20px;
height: 20px;
fill: #FF0F4D;
flex-shrink: 0;
z-index: 1
}

.evts-hub .profile-spotlight {
max-width: 1440px;
margin: 0 auto;
padding: 96px 24px;
position: relative
}

.evts-hub .profile-spotlight::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-image: url(./picture_assets/grid-2026-07-17aa.jpg);
background-size: cover;
background-position: center;
filter: blur(24px) brightness(0.4);
z-index: 0;
pointer-events: none
}

.evts-hub .profile-content {
position: relative;
z-index: 1;
display: grid;
grid-template-columns: 280px 1fr;
gap: 48px;
align-items: center;
background: #1a1514d9;
padding: 48px;
border-radius: 14px;
backdrop-filter: blur(8px);
box-shadow: 1px 12px 60px 0 #420b6a21
}

.evts-hub .profile-img-wrap {
position: relative
}

.evts-hub .profile-img-wrap img {
width: 280px;
height: 420px;
object-fit: cover;
object-position: top;
border-radius: 48px;
display: block;
box-shadow: 1px 5px 22px 0 #ff0f4d14;
transition: transform .35s ease-out
}

.evts-hub .profile-img-wrap:hover img {
transform: scale(1.05)
}

.evts-hub .profile-txt h2 {
font-size: 46px;
line-height: 1.2;
letter-spacing: -.01em;
margin: 0 0 16px;
color: #fff
}

.evts-hub .profile-txt .role-label {
display: inline-block;
padding: 8px 16px;
background: #09ffe12e;
color: #09FFE1;
border-radius: 8px;
font-size: 14px;
line-height: 1.2;
font-weight: 600;
letter-spacing: .02em;
margin-bottom: 24px
}

.evts-hub .profile-txt p {
font-size: 14px;
line-height: 1.65;
color: #c9c5c2;
margin: 0 0 16px;
letter-spacing: .01em
}

.evts-hub .profile-txt p:last-of-type {
margin-bottom: 0
}

@media (max-width: 1280px) {
.evts-hub .top-banner {
grid-template-columns: 1fr;
gap: 48px;
padding: 48px 24px
}

.evts-hub .banner-img-frame {
max-width: 480px;
margin: 0 auto
}

.evts-hub .catalog-grid {
grid-template-columns: 1fr;
gap: 48px
}

.evts-hub .insight-grid {
grid-template-columns: 1fr;
gap: 48px
}

.evts-hub .profile-content {
grid-template-columns: 1fr;
gap: 48px;
padding: 48px 24px
}

.evts-hub .profile-img-wrap img {
width: 100%;
max-width: 320px;
height: 480px;
margin: 0 auto
}
}

@media (max-width: 768px) {
.evts-hub .top-banner {
padding: 48px 16px
}

.evts-hub .banner-txt h1 {
font-size: 46px
}

.evts-hub .banner-txt p {
font-size: 14px
}

.evts-hub .catalog-wrap {
padding: 48px 16px
}

.evts-hub .evt-card h3 {
font-size: 24px
}

.evts-hub .evt-card-price-main {
font-size: 24px
}

.evts-hub .insight-zone {
padding: 48px 16px
}

.evts-hub .insight-main h2 {
font-size: 33px
}

.evts-hub .profile-spotlight {
padding: 48px 16px
}

.evts-hub .profile-content {
padding: 24px 16px
}

.evts-hub .profile-txt h2 {
font-size: 33px
}

.evts-hub .profile-img-wrap img {
height: 400px
}
}

.post-archive {
background: #1a1612;
color: #e8e4df;
min-height: 100vh;
position: relative;
overflow-x: clip
}

.post-archive::before {
content: '';
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(147deg, #420B6A 0%, #1a1612 38%, #1a1612 62%, #FF0F4D 100%);
opacity: .15;
pointer-events: none;
z-index: 0;
animation: color-breath 18s ease-in-out infinite
}

@keyframes color-breath {

0%,
100% {
filter: saturate(1)
}

50% {
filter: saturate(0.3)
}
}

.post-archive .split-intro {
display: grid;
grid-template-columns: 1fr 1fr;
min-height: 520px;
position: relative;
z-index: 1;
margin-bottom: 96px
}

.post-archive .split-intro .left-zone {
background: linear-gradient(147deg, #420b6a47 0%, #1a1612eb 100%);
padding: 96px 48px 96px 96px;
display: flex;
flex-direction: column;
justify-content: center;
position: relative
}

.post-archive .split-intro .left-zone::after {
content: '';
position: absolute;
bottom: 48px;
right: -80px;
width: 160px;
height: 160px;
border: 2px dashed #09ffe140;
border-radius: 48px;
transform: rotate(12deg);
pointer-events: none
}

.post-archive .split-intro .right-zone {
background: linear-gradient(147deg, #ff0f4d38 0%, #1a1612e0 100%);
padding: 96px 96px 96px 48px;
display: flex;
flex-direction: column;
justify-content: center
}

.post-archive .split-intro h1 {
font-size: 62px;
line-height: 1.2;
letter-spacing: -.02em;
margin: 0 0 24px;
color: #09FFE1;
text-shadow: 0 0 24px #09ffe166
}

.post-archive .split-intro .thesis-group {
display: flex;
flex-direction: column;
gap: 16px
}

.post-archive .split-intro .thesis-item {
font-size: 24px;
line-height: 1.45;
letter-spacing: .01em;
color: #e8e4df;
padding-left: 24px;
position: relative
}

.post-archive .split-intro .thesis-item::before {
content: '';
position: absolute;
left: 0;
top: 10px;
width: 3px;
height: 20px;
background: #FF0F4D;
box-shadow: 0 0 12px #ff0f4d99
}

.post-archive .catalog-section {
max-width: 1440px;
margin: 0 auto;
padding: 0 48px 96px;
position: relative;
z-index: 1
}

.post-archive .catalog-section h2 {
font-size: 46px;
line-height: 1.2;
letter-spacing: -.01em;
margin: 0 0 48px;
color: #09FFE1;
background: linear-gradient(90deg, #420b6a66 0%, transparent 100%);
padding: 16px 24px;
border-radius: 8px;
display: inline-block
}

.post-archive .post-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 48px
}

.post-archive .post-card {
background: #1a161299;
border-radius: 14px;
overflow: hidden;
box-shadow: 1px 5px 22px 0 #420b6a14 1px 12px 60px 0 #420b6a21;
transition: transform .32s ease-out, box-shadow .38s ease-out;
position: relative
}

.post-archive .post-card::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(147deg, #420b6a26 0%, transparent 50%, #09ffe114 100%);
opacity: 0;
transition: opacity .35s ease-out;
pointer-events: none;
z-index: 1
}

.post-archive .post-card:hover {
transform: translateY(-8px);
box-shadow: 1px 5px 22px 0 #ff0f4d14 1px 12px 60px 0 #ff0f4d21
}

.post-archive .post-card:hover::before {
opacity: 1
}

.post-archive .post-card .img-wrap {
width: 100%;
height: 240px;
overflow: hidden;
position: relative
}

.post-archive .post-card .img-wrap img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
transition: transform .42s ease-out
}

.post-archive .post-card:hover .img-wrap img {
transform: scale(1.06)
}

.post-archive .post-card .card-body {
padding: 24px;
position: relative;
z-index: 2
}

.post-archive .post-card .tag-badge {
display: inline-block;
background: #420b6a99;
color: #09FFE1;
font-size: 14px;
line-height: 1.2;
letter-spacing: .03em;
padding: 8px 16px;
border-radius: 34px;
margin-bottom: 16px;
border: 1px solid #09ffe14d;
text-transform: uppercase;
font-weight: 600
}

.post-archive .post-card h3 {
font-size: 24px;
line-height: 1.45;
letter-spacing: 0;
margin: 0 0 16px;
color: #e8e4df
}

.post-archive .post-card h3 a {
color: inherit;
text-decoration: none;
transition: color .25s ease-out
}

.post-archive .post-card h3 a:hover {
color: #09FFE1
}

.post-archive .post-card .excerpt {
font-size: 14px;
line-height: 1.65;
letter-spacing: .02em;
color: #e8e4dfcc;
margin: 0 0 24px
}

.post-archive .post-card .card-footer {
display: flex;
justify-content: space-between;
align-items: center;
padding-top: 16px;
border-top: 1px solid #ff0f4d33
}

.post-archive .post-card .read-link {
font-size: 14px;
line-height: 1.2;
letter-spacing: .02em;
color: #FF0F4D;
text-decoration: none;
font-weight: 600;
display: inline-flex;
align-items: center;
gap: 8px;
transition: gap .28s ease-out, color .22s ease-out
}

.post-archive .post-card .read-link::after {
content: '→';
display: inline-block;
transition: transform .28s ease-out
}

.post-archive .post-card .read-link:hover {
gap: 16px;
color: #09FFE1
}

.post-archive .post-card .read-link:hover::after {
transform: translateX(4px)
}

.post-archive .post-card .like-counter {
display: flex;
align-items: center;
gap: 8px;
font-size: 14px;
line-height: 1.2;
letter-spacing: .02em;
color: #e8e4df99
}

.post-archive .post-card .like-counter::before {
content: '';
width: 18px;
height: 18px;
background: linear-gradient(135deg, #FF0F4D 0%, #420B6A 100%);
border-radius: 8px;
display: inline-block;
position: relative
}

.post-archive .post-card .like-counter::after {
content: '';
position: absolute;
width: 8px;
height: 8px;
background: #09FFE1;
border-radius: 34px;
margin-left: -13px;
margin-top: 5px
}

.post-archive .insight-panel {
max-width: 1440px;
margin: 96px auto 0;
padding: 0 48px 96px;
display: grid;
grid-template-columns: 2fr 1fr;
gap: 48px;
position: relative;
z-index: 1
}

.post-archive .insight-panel::before {
content: '';
position: absolute;
top: -48px;
left: 50%;
transform: translateX(-50%);
width: 90%;
height: 2px;
background: linear-gradient(90deg, transparent 0%, #ff0f4d66 50%, transparent 100%)
}

.post-archive .insight-wide {
background: #1a1612cc;
padding: 48px;
border-radius: 14px;
border: 1px solid #420b6a4d;
box-shadow: 1px 1px 5px 0 #420b6a0f 1px 5px 22px 0 #420b6a14;
position: relative
}

.post-archive .insight-wide::after {
content: '';
position: absolute;
bottom: -24px;
left: 24px;
width: 180px;
height: 180px;
border: 2px dashed #09ffe126;
border-radius: 48px;
transform: rotate(-8deg);
pointer-events: none;
z-index: -1
}

.post-archive .insight-wide h3 {
font-size: 33px;
line-height: 1.2;
letter-spacing: -.01em;
margin: 0 0 24px;
color: #e8e4df;
background: linear-gradient(90deg, #ff0f4d4d 0%, transparent 100%);
padding: 8px 16px;
border-radius: 8px;
display: inline-block
}

.post-archive .insight-wide p {
font-size: 14px;
line-height: 1.65;
letter-spacing: .01em;
color: #e8e4dfd9;
margin: 0 0 16px
}

.post-archive .insight-wide p:first-of-type {
background: #420b6a26;
padding: 16px;
border-radius: 8px;
border-left: 3px solid #420B6A
}

.post-archive .insight-narrow {
display: flex;
flex-direction: column;
gap: 24px
}

.post-archive .label-value-pair {
background: #1a1612cc;
padding: 24px;
border-radius: 14px;
border: 1px solid #ff0f4d33;
box-shadow: 1px 1px 5px 0 #ff0f4d0f;
transition: border-color .3s ease-out, box-shadow .35s ease-out
}

.post-archive .label-value-pair:hover {
border-color: #09ffe166;
box-shadow: 1px 5px 22px 0 #09ffe114
}

.post-archive .label-value-pair .pair-label {
font-size: 14px;
line-height: 1.2;
letter-spacing: .03em;
color: #e8e4df99;
text-transform: uppercase;
margin: 0 0 8px
}

.post-archive .label-value-pair .divider-line {
width: 100%;
height: 1px;
background: linear-gradient(90deg, #FF0F4D 0%, transparent 100%);
margin: 8px 0
}

.post-archive .label-value-pair .pair-value {
font-size: 24px;
line-height: 1.45;
letter-spacing: 0;
color: #09FFE1;
font-weight: 600;
margin: 0
}

.post-archive .metrics-showcase {
max-width: 1440px;
margin: 0 auto;
padding: 96px 48px;
position: relative;
z-index: 1;
background: linear-gradient(147deg, #420b6a14 0%, #1a161266 50%, #ff0f4d14 100%)
}

.post-archive .metrics-showcase::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: repeating-linear-gradient(0deg, transparent, transparent 2px, #09ffe105 2px, #09ffe105 4px);
pointer-events: none;
opacity: .3
}

.post-archive .metrics-showcase h2 {
font-size: 46px;
line-height: 1.2;
letter-spacing: -.01em;
margin: 0 0 48px;
color: #e8e4df;
text-align: center
}

.post-archive .metrics-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 24px;
position: relative
}

.post-archive .metric-box {
background: #1a1612e6;
padding: 48px 24px;
border-radius: 14px;
text-align: center;
border: 1px solid #420b6a66;
box-shadow: inset 0 2px 8px #ffffff08 inset 0 -2px 8px #0006;
position: relative;
overflow: hidden;
transition: transform .28s ease-out, border-color .35s ease-out
}

.post-archive .metric-box::before {
content: '';
position: absolute;
top: -50%;
left: -50%;
width: 200%;
height: 200%;
background: radial-gradient(circle, #09ffe126 0%, transparent 70%);
opacity: 0;
transition: opacity .4s ease-out;
pointer-events: none
}

.post-archive .metric-box:hover {
transform: translateY(-4px);
border-color: #09ffe199
}

.post-archive .metric-box:hover::before {
opacity: 1
}

.post-archive .metric-box .metric-number {
font-size: 62px;
line-height: 1.2;
letter-spacing: -.02em;
color: #FF0F4D;
margin: 0 0 16px;
font-weight: 700;
text-shadow: 0 0 20px #ff0f4d80;
position: relative;
z-index: 1
}

.post-archive .metric-box .metric-label {
font-size: 14px;
line-height: 1.45;
letter-spacing: .02em;
color: #e8e4dfb3;
margin: 0;
position: relative;
z-index: 1
}

.post-archive .resource-section {
max-width: 1440px;
margin: 0 auto;
padding: 96px 48px;
position: relative;
z-index: 1
}

.post-archive .resource-section h2 {
font-size: 46px;
line-height: 1.2;
letter-spacing: -.01em;
margin: 0 0 48px;
color: #09FFE1
}

.post-archive .resource-layout {
display: grid;
grid-template-columns: 1fr 380px;
gap: 48px
}

.post-archive .resource-main {
display: flex;
flex-direction: column;
gap: 24px
}

.post-archive .resource-item {
background: #1a161299;
padding: 24px;
border-radius: 14px;
border: 1px solid #ff0f4d33;
display: flex;
align-items: center;
gap: 24px;
transition: background .32s ease-out, border-color .28s ease-out
}

.post-archive .resource-item:hover {
background: #1a1612e6;
border-color: #09ffe166
}

.post-archive .resource-item .resource-icon {
width: 80px;
height: 80px;
background: linear-gradient(135deg, #420B6A 0%, #FF0F4D 100%);
border-radius: 14px;
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 0 20px #420b6a66
}

.post-archive .resource-item .resource-icon::before {
content: '';
width: 32px;
height: 32px;
background: #09FFE1;
border-radius: 8px;
box-shadow: 0 0 12px #09ffe199
}

.post-archive .resource-item .resource-content h4 {
font-size: 24px;
line-height: 1.2;
letter-spacing: 0;
margin: 0 0 8px;
color: #e8e4df
}

.post-archive .resource-item .resource-content p {
font-size: 14px;
line-height: 1.65;
letter-spacing: .01em;
color: #e8e4dfbf;
margin: 0
}

.post-archive .resource-sidebar {
display: flex;
flex-direction: column;
gap: 16px
}

.post-archive .sidebar-tag {
background: #420b6a4d;
color: #09FFE1;
font-size: 14px;
line-height: 1.2;
letter-spacing: .02em;
padding: 16px 24px;
border-radius: 34px;
text-align: center;
border: 1px solid #09ffe133;
transition: background .25s ease-out, border-color .3s ease-out, transform .22s ease-out;
cursor: pointer
}

.post-archive .sidebar-tag:hover {
background: #420b6a80;
border-color: #09ffe180;
transform: translateX(4px)
}

.post-archive .sidebar-tag.accent {
background: #ff0f4d4d;
color: #e8e4df;
border-color: #ff0f4d4d
}

.post-archive .sidebar-tag.accent:hover {
background: #ff0f4d80;
border-color: #ff0f4d99
}

@media (max-width: 1280px) {
.post-archive .post-grid {
grid-template-columns: repeat(2, 1fr);
gap: 24px
}

.post-archive .metrics-grid {
grid-template-columns: repeat(2, 1fr)
}

.post-archive .insight-panel {
grid-template-columns: 1fr
}

.post-archive .resource-layout {
grid-template-columns: 1fr
}

.post-archive .resource-sidebar {
flex-direction: row;
flex-wrap: wrap
}
}

@media (max-width: 768px) {
.post-archive .split-intro {
grid-template-columns: 1fr
}

.post-archive .split-intro .left-zone,
.post-archive .split-intro .right-zone {
padding: 48px 24px
}

.post-archive .split-intro h1 {
font-size: 46px
}

.post-archive .split-intro .thesis-item {
font-size: 14px
}

.post-archive .catalog-section {
padding: 0 24px 48px
}

.post-archive .post-grid {
grid-template-columns: 1fr
}

.post-archive .insight-panel {
padding: 0 24px 48px;
margin-top: 48px
}

.post-archive .insight-wide {
padding: 24px
}

.post-archive .insight-wide h3 {
font-size: 24px
}

.post-archive .metrics-showcase {
padding: 48px 24px
}

.post-archive .metrics-grid {
grid-template-columns: 1fr
}

.post-archive .resource-section {
padding: 48px 24px
}

.post-archive .resource-item {
flex-direction: column;
text-align: center
}
}

::selection {
background: #420B6A;
color: #09FFE1
}

.author-profile {
background: #1a1512;
color: #e8e4df;
min-height: 100vh
}

.author-profile .intro-wrap {
max-width: 1440px;
margin: 0 auto;
padding: 48px 24px;
display: grid;
grid-template-columns: 180px 1fr;
gap: 48px;
align-items: start;
position: relative;
overflow: hidden
}

.author-profile .intro-wrap::before {
content: '';
position: absolute;
top: -20%;
right: -10%;
width: 600px;
height: 600px;
background: radial-gradient(circle, #420b6a26 0%, transparent 70%);
border-radius: 48%;
pointer-events: none;
z-index: 0
}

.author-profile .intro-wrap::after {
content: '';
position: absolute;
bottom: -15%;
left: -8%;
width: 500px;
height: 500px;
background: radial-gradient(circle, #ff0f4d1f 0%, transparent 65%);
border-radius: 52%;
pointer-events: none;
z-index: 0
}

.author-profile .curved-accent {
position: absolute;
top: 12%;
left: 5%;
width: 280px;
height: 180px;
pointer-events: none;
z-index: 1;
opacity: .25
}

.author-profile .curved-accent svg {
width: 100%;
height: 100%
}

.author-profile .portrait-col {
position: relative;
z-index: 2
}

.author-profile .portrait-frame {
width: 180px;
height: 252px;
border-radius: 14px;
overflow: hidden;
box-shadow: 1px 5px 22px 0 #420b6a14 1px 12px 60px 0 #ff0f4d21;
opacity: 0;
animation: fadeInImage .85s ease-out .2s forwards
}

@keyframes fadeInImage {
from {
opacity: 0;
transform: translateY(16px)
}

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

.author-profile .portrait-frame img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
display: block
}

.author-profile .text-col {
position: relative;
z-index: 2
}

.author-profile .main-heading {
font-size: 62px;
line-height: 1.2;
letter-spacing: -.02em;
margin: 0 0 16px;
font-weight: 700
}

.author-profile .main-heading .accent-word {
color: #09FFE1
}

@media (max-width: 768px) {
.author-profile .intro-wrap {
grid-template-columns: 1fr;
gap: 24px;
padding: 24px 16px
}

.author-profile .portrait-frame {
width: 140px;
height: 196px;
margin: 0 auto
}

.author-profile .main-heading {
font-size: 46px;
text-align: center
}

.author-profile .curved-accent {
width: 200px;
height: 130px;
top: 8%;
left: 2%
}
}

.author-profile .content-zone {
max-width: 1440px;
margin: 0 auto;
padding: 0 24px 96px
}

.author-profile .bio-segment {
background: linear-gradient(127deg, #2a1f1a 0%, #1e1814 48%, #251a1d 100%);
border-radius: 14px;
padding: 48px;
margin-bottom: 48px;
position: relative;
overflow: hidden;
box-shadow: 1px 1px 5px 0 #420b6a0f 1px 5px 22px 0 #ff0f4d14
}

.author-profile .bio-segment::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23420B6A' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
opacity: .04;
pointer-events: none
}

.author-profile .bio-segment .section-label {
font-size: 14px;
text-transform: uppercase;
letter-spacing: .12em;
color: #FF0F4D;
margin: 0 0 24px;
font-weight: 600;
display: inline-block;
background: #ff0f4d14;
padding: 8px 16px;
border-radius: 8px
}

.author-profile .bio-segment .subheading {
font-size: 33px;
line-height: 1.45;
letter-spacing: -.01em;
margin: 0 0 24px;
font-weight: 600;
color: #e8e4df
}

.author-profile .bio-segment .opening-para {
font-size: 24px;
line-height: 1.65;
letter-spacing: .005em;
margin: 0 0 24px;
background: #09ffe10a;
padding: 24px;
border-radius: 8px;
border-left: 3px solid #09FFE1;
position: relative
}

.author-profile .bio-segment .body-para {
font-size: 24px;
line-height: 1.65;
letter-spacing: .005em;
margin: 0 0 24px;
color: #d4cfc8
}

.author-profile .bio-segment .body-para:last-child {
margin-bottom: 0
}

.author-profile .bio-segment .emphasis-dash {
color: #FF0F4D;
font-weight: 600
}

@media (max-width: 768px) {
.author-profile .content-zone {
padding: 0 16px 48px
}

.author-profile .bio-segment {
padding: 24px;
margin-bottom: 24px
}

.author-profile .bio-segment .subheading {
font-size: 24px
}

.author-profile .bio-segment .opening-para,
.author-profile .bio-segment .body-para {
font-size: 14px
}

.author-profile .bio-segment .opening-para {
padding: 16px
}
}

.author-profile .expertise-display {
background: #1e1814;
border-radius: 14px;
padding: 48px;
position: relative;
overflow: hidden;
box-shadow: 1px 5px 22px 0 #420b6a14 1px 12px 60px 0 #ff0f4d21
}

.author-profile .expertise-display::before {
content: '';
position: absolute;
top: -50%;
right: -20%;
width: 800px;
height: 800px;
background: linear-gradient(217deg, #420b6a26 0%, transparent 60%);
border-radius: 50%;
pointer-events: none;
animation: rotateGradient 18s linear infinite
}

@keyframes rotateGradient {
from {
transform: rotate(0deg)
}

to {
transform: rotate(360deg)
}
}

.author-profile .expertise-display .top-row {
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: 48px;
margin-bottom: 48px;
position: relative;
z-index: 2
}

.author-profile .expertise-display .title-side {
flex: 1
}

.author-profile .expertise-display .exp-heading {
font-size: 46px;
line-height: 1.2;
letter-spacing: -.015em;
margin: 0 0 16px;
font-weight: 700;
color: #e8e4df
}

.author-profile .expertise-display .exp-intro {
font-size: 24px;
line-height: 1.65;
letter-spacing: .005em;
margin: 0;
color: #c9c2b8
}

.author-profile .expertise-display .chart-side {
flex-shrink: 0
}

.author-profile .donut-chart {
position: relative;
width: 220px;
height: 220px
}

.author-profile .donut-chart svg {
width: 100%;
height: 100%;
transform: rotate(-90deg)
}

.author-profile .donut-chart circle {
fill: none;
stroke-width: 24;
transition: stroke-dashoffset .42s ease-out
}

.author-profile .donut-chart .chart-bg {
stroke: #420b6a26
}

.author-profile .donut-chart .chart-segment-1 {
stroke: #420B6A;
stroke-dasharray: 251.2;
stroke-dashoffset: 62.8;
stroke-linecap: round
}

.author-profile .donut-chart .chart-segment-2 {
stroke: #FF0F4D;
stroke-dasharray: 251.2;
stroke-dashoffset: 125.6;
stroke-linecap: round;
transform-origin: center;
transform: rotate(108deg)
}

.author-profile .donut-chart .chart-segment-3 {
stroke: #09FFE1;
stroke-dasharray: 251.2;
stroke-dashoffset: 188.4;
stroke-linecap: round;
transform-origin: center;
transform: rotate(216deg)
}

.author-profile .donut-chart .center-value {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center
}

.author-profile .donut-chart .center-number {
font-size: 46px;
font-weight: 700;
line-height: 1;
color: #e8e4df;
display: block;
margin-bottom: 8px
}

.author-profile .donut-chart .center-label {
font-size: 14px;
text-transform: uppercase;
letter-spacing: .08em;
color: #a89d8f;
font-weight: 600
}

.author-profile .chart-legend {
display: flex;
gap: 24px;
justify-content: center;
margin-top: 24px;
position: relative;
z-index: 2
}

.author-profile .legend-item {
display: flex;
align-items: center;
gap: 8px
}

.author-profile .legend-color {
width: 16px;
height: 16px;
border-radius: 8px;
flex-shrink: 0
}

.author-profile .legend-color.color-1 {
background: #420B6A;
box-shadow: 0 0 12px #420b6a66
}

.author-profile .legend-color.color-2 {
background: #FF0F4D;
box-shadow: 0 0 12px #ff0f4d66
}

.author-profile .legend-color.color-3 {
background: #09FFE1;
box-shadow: 0 0 12px #09ffe166
}

.author-profile .legend-text {
font-size: 14px;
color: #c9c2b8;
letter-spacing: .01em
}

@media (max-width: 1280px) {
.author-profile .expertise-display .top-row {
flex-direction: column;
align-items: center;
text-align: center
}

.author-profile .donut-chart {
width: 200px;
height: 200px
}

.author-profile .chart-legend {
flex-wrap: wrap
}
}

@media (max-width: 768px) {
.author-profile .expertise-display {
padding: 24px
}

.author-profile .expertise-display .top-row {
margin-bottom: 24px;
gap: 24px
}

.author-profile .expertise-display .exp-heading {
font-size: 33px
}

.author-profile .expertise-display .exp-intro {
font-size: 14px
}

.author-profile .donut-chart {
width: 180px;
height: 180px
}

.author-profile .donut-chart .center-number {
font-size: 33px
}

.author-profile .chart-legend {
gap: 16px
}
}

.author-profile .content-grid {
display: grid;
grid-template-columns: 2fr 1fr;
gap: 48px;
margin-bottom: 48px;
position: relative;
z-index: 2
}

.author-profile .text-block {
display: flex;
flex-direction: column;
gap: 24px
}

.author-profile .text-block .detail-para {
font-size: 24px;
line-height: 1.65;
letter-spacing: .005em;
margin: 0;
color: #d4cfc8
}

.author-profile .image-block {
position: relative
}

.author-profile .image-frame {
width: 100%;
height: 420px;
border-radius: 14px;
overflow: hidden;
box-shadow: 1px 1px 5px 0 #420b6a0f 1px 5px 22px 0 #ff0f4d14;
position: relative;
border: 3px solid transparent;
background: linear-gradient(#1e1814, #1e1814) padding-box, linear-gradient(135deg, #420B6A, #FF0F4D) border-box;
transition: transform .38s ease-out, box-shadow .38s ease-out
}

.author-profile .image-frame:hover {
transform: translateY(-8px);
box-shadow: 1px 5px 22px 0 #420b6a1f 1px 12px 60px 0 #ff0f4d2e
}

.author-profile .image-frame img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
display: block
}

@media (max-width: 1280px) {
.author-profile .content-grid {
grid-template-columns: 1fr;
gap: 24px
}

.author-profile .image-frame {
height: 320px
}
}

@media (max-width: 768px) {
.author-profile .content-grid {
margin-bottom: 24px
}

.author-profile .text-block .detail-para {
font-size: 14px
}

.author-profile .image-frame {
height: 240px
}
}

.author-profile .skill-showcase {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 24px;
margin-top: 48px;
position: relative;
z-index: 2
}

.author-profile .skill-pill {
background: linear-gradient(155deg, #420b6a1f 0%, #ff0f4d0f 100%);
border: 2px solid #420b6a33;
border-radius: 34px;
padding: 16px 24px;
font-size: 24px;
line-height: 1.45;
letter-spacing: .005em;
color: #e8e4df;
text-align: center;
font-weight: 600;
position: relative;
overflow: hidden;
transition: border-color .28s ease-out, transform .28s ease-out, background .28s ease-out
}

.author-profile .skill-pill::before {
content: '';
position: absolute;
left: -2px;
top: 50%;
width: 0;
height: 3px;
background: linear-gradient(90deg, #09FFE1, #FF0F4D);
transform: translateY(-50%);
transition: width .35s ease-out
}

.author-profile .skill-pill:hover {
border-color: #09ffe166;
transform: translateX(8px);
background: linear-gradient(155deg, #420b6a2e 0%, #ff0f4d1f 100%)
}

.author-profile .skill-pill:hover::before {
width: calc(100% + 4px)
}

@media (max-width: 1280px) {
.author-profile .skill-showcase {
grid-template-columns: repeat(2, 1fr)
}
}

@media (max-width: 768px) {
.author-profile .skill-showcase {
grid-template-columns: 1fr;
gap: 16px;
margin-top: 24px
}

.author-profile .skill-pill {
font-size: 14px;
padding: 12px 16px
}
}

.author-profile .divider-blur {
height: 1px;
background: linear-gradient(90deg, transparent 0%, #09ffe14d 50%, transparent 100%);
margin: 96px 0;
box-shadow: 0 0 24px #09ffe133 0 0 48px #ff0f4d1a;
filter: blur(1px)
}

@media (max-width: 768px) {
.author-profile .divider-blur {
margin: 48px 0
}
}

.author-profile .visual-grid {
display: grid;
grid-template-columns: 1.2fr 1fr 0.9fr;
gap: 24px;
margin-bottom: 48px;
position: relative;
z-index: 2
}

.author-profile .visual-card {
border-radius: 14px;
overflow: hidden;
box-shadow: 1px 1px 5px 0 #420b6a0f 1px 5px 22px 0 #ff0f4d14;
position: relative;
transition: transform .32s ease-out
}

.author-profile .visual-card:hover {
transform: scale(1.03)
}

.author-profile .visual-card.offset-up {
margin-top: -48px
}

.author-profile .visual-card.offset-down {
margin-top: 24px
}

.author-profile .visual-card img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
display: block
}

.author-profile .visual-card.tall {
height: 480px
}

.author-profile .visual-card.medium {
height: 360px
}

.author-profile .visual-card.short {
height: 320px
}

@media (max-width: 1280px) {
.author-profile .visual-grid {
grid-template-columns: repeat(2, 1fr)
}

.author-profile .visual-card.offset-up,
.author-profile .visual-card.offset-down {
margin-top: 0
}

.author-profile .visual-card.tall,
.author-profile .visual-card.medium,
.author-profile .visual-card.short {
height: 280px
}
}

@media (max-width: 768px) {
.author-profile .visual-grid {
grid-template-columns: 1fr;
gap: 16px;
margin-bottom: 24px
}

.author-profile .visual-card.tall,
.author-profile .visual-card.medium,
.author-profile .visual-card.short {
height: 220px
}
}

.author-profile .closing-statement {
background: linear-gradient(241deg, #2a1f1a 0%, #1e1814 55%, #251a1d 100%);
border-radius: 14px;
padding: 48px;
text-align: center;
position: relative;
overflow: hidden;
box-shadow: 1px 5px 22px 0 #420b6a14 1px 12px 60px 0 #ff0f4d21
}

.author-profile .closing-statement::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 4px;
background: linear-gradient(90deg, #420B6A 0%, #FF0F4D 50%, #09FFE1 100%)
}

.author-profile .closing-statement .final-heading {
font-size: 33px;
line-height: 1.45;
letter-spacing: -.01em;
margin: 0 0 24px;
font-weight: 600;
color: #e8e4df
}

.author-profile .closing-statement .final-para {
font-size: 24px;
line-height: 1.65;
letter-spacing: .005em;
margin: 0 auto;
max-width: 900px;
color: #d4cfc8
}

@media (max-width: 768px) {
.author-profile .closing-statement {
padding: 24px
}

.author-profile .closing-statement .final-heading {
font-size: 24px
}

.author-profile .closing-statement .final-para {
font-size: 14px
}
}

.success-page {
background: linear-gradient(158deg, #1a0f1f 0%, #0d0811 38%, #18121d 100%);
min-height: 100vh;
padding: 96px 24px;
display: flex;
align-items: center;
justify-content: center
}

.success-page .confirm-wrap {
max-width: 680px;
width: 100%;
background: #420b6a17;
border-radius: 34px;
padding: 48px;
box-shadow: 1px 5px 22px 0 #420b6a14 1px 12px 60px 0 #ff0f4d21;
border: 1px solid #09ffe11c;
text-align: center
}

.success-page .icon-confirm {
width: 96px;
height: 96px;
margin: 0 auto 48px;
background: linear-gradient(158deg, #420B6A 0%, #FF0F4D 100%);
border-radius: 48px;
display: flex;
align-items: center;
justify-content: center;
position: relative;
box-shadow: 1px 1px 5px 0 #ff0f4d0f 0 8px 28px 0 #09ffe130
}

.success-page .icon-confirm::before {
content: '';
width: 38px;
height: 22px;
border-left: 5px solid #09FFE1;
border-bottom: 5px solid #09FFE1;
transform: rotate(-45deg) translateY(-4px)
}

.success-page .status-title {
font-size: 46px;
line-height: 1.2;
letter-spacing: -.02em;
color: #09FFE1;
margin: 0 0 24px
}

.success-page .status-msg {
font-size: 24px;
line-height: 1.45;
letter-spacing: .01em;
color: #ffffffde;
margin: 0 0 48px
}

.success-page .detail-block {
background: #09ffe10d;
border-radius: 14px;
padding: 24px;
margin: 0 0 48px;
border: 1px solid #09ffe124
}

.success-page .detail-block p {
font-size: 14px;
line-height: 1.65;
letter-spacing: .02em;
color: #ffffffba;
margin: 0
}

.success-page .detail-block p strong {
color: #09FFE1;
font-weight: 600
}

.success-page .action-group {
display: flex;
gap: 16px;
justify-content: center;
flex-wrap: wrap
}

.success-page .btn-primary {
background: linear-gradient(158deg, #420B6A 0%, #FF0F4D 100%);
color: #fff;
font-size: 14px;
letter-spacing: .03em;
padding: 16px 48px;
border: none;
border-radius: 8px;
cursor: pointer;
text-decoration: none;
display: inline-flex;
align-items: center;
justify-content: center;
transition: transform .28s ease-out, box-shadow .32s ease-out;
box-shadow: 1px 1px 5px 0 #ff0f4d0f 1px 5px 22px 0 #ff0f4d14;
font-weight: 600
}

.success-page .btn-primary:hover {
transform: translateY(-2px);
box-shadow: 1px 5px 22px 0 #ff0f4d14 1px 12px 60px 0 #ff0f4d21
}

.success-page .btn-secondary {
background: transparent;
color: #09FFE1;
font-size: 14px;
letter-spacing: .03em;
padding: 16px 48px;
border: 1px solid #09ffe152;
border-radius: 8px;
cursor: pointer;
text-decoration: none;
display: inline-flex;
align-items: center;
justify-content: center;
transition: border-color .22s ease-out, background .25s ease-out;
font-weight: 600
}

.success-page .btn-secondary:hover {
border-color: #09ffe194;
background: #09ffe10f
}

@media (max-width: 768px) {
.success-page {
padding: 48px 16px
}

.success-page .confirm-wrap {
padding: 24px
}

.success-page .icon-confirm {
width: 72px;
height: 72px;
margin: 0 auto 24px
}

.success-page .icon-confirm::before {
width: 28px;
height: 16px;
border-left: 4px solid #09FFE1;
border-bottom: 4px solid #09FFE1
}

.success-page .status-title {
font-size: 33px;
margin: 0 0 16px
}

.success-page .status-msg {
font-size: 14px;
margin: 0 0 24px
}

.success-page .detail-block {
padding: 16px;
margin: 0 0 24px
}

.success-page .action-group {
flex-direction: column;
gap: 8px
}

.success-page .btn-primary,
.success-page .btn-secondary {
width: 100%;
padding: 16px 24px
}
}

.mobile-menu-toggle {
display: none;
background: transparent;
border: none;
cursor: pointer;
padding: 8px;
flex-direction: column;
gap: 5px;
position: fixed;
top: 28px;
z-index: 9001
}

.mobile-menu-toggle .menu-bar {
display: block;
width: 24px;
height: 2px;
background: #e8e3df;
border-radius: 2px
}

.mobile-menu {
display: none;
position: fixed;
inset: 0;
background: linear-gradient(165deg, #1a1614 0%, #0d0a09 100%);
z-index: 9000;
padding: 80px 24px 24px;
flex-direction: column;
gap: 24px
}

.mobile-menu.open {
display: flex
}

.mobile-menu-close {
position: absolute;
top: 24px;
right: 24px;
background: transparent;
border: none;
color: #e8e3df;
font-size: 28px;
cursor: pointer;
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center
}

.mobile-links {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 16px
}

.mobile-links a {
display: block;
font-size: 18px;
color: #e8e3df;
text-decoration: none;
padding: 12px 0;
border-bottom: 1px solid #ff0f4d1a;
transition: color .22s ease-out, padding-left .22s ease-out
}

.mobile-links a:hover {
color: #09FFE1;
padding-left: 8px
}

.mobile-links .sub-links {
list-style: none;
margin: 8px 0 0 16px;
padding: 0;
display: flex;
flex-direction: column;
gap: 8px
}

.mobile-links .sub-links a {
font-size: 14px;
color: #e8e3dfbf;
border-bottom: none;
padding: 8px 0
}

@media (max-width: 768px) {
.mobile-menu-toggle {
display: flex
}

.nav-row {
display: none
}
}