/* ==========================================   BADGE GENERATOR - BEM Component   ========================================== *//* Block: Badge Generator */.badge-generator {    /* Grid item styles handled by badge-grid */    padding: var(--space-lg);}/* Element: Upload Section */.badge-generator__upload {    text-align: center;    margin-bottom: var(--space-md);}/* Element: Upload Label (styled as button) */.badge-generator__upload-label {    cursor: pointer;    display: inline-block;    font-size: var(--text-sm);    padding: var(--space-sm) var(--space-lg);    border: 2px solid;    font-weight: 600;    backdrop-filter: blur(10px);    transition: all var(--transition-normal);    border-radius: var(--radius-md);}/* Modifier: Pink Upload */.badge-generator__upload-label--pink {    background: var(--color-primary-15);    border-color: var(--color-primary);    color: var(--color-text);}.badge-generator__upload-label--pink:hover {    background: var(--color-primary-20);    border-color: var(--color-primary);}/* Modifier: Blue Upload */.badge-generator__upload-label--blue {    background: var(--color-primary-15);    border-color: var(--color-primary);    color: var(--color-text);}.badge-generator__upload-label--blue:hover {    background: var(--color-primary-20);    border-color: var(--color-primary);}/* Element: Upload Input (hidden) */.badge-generator__upload-input {    display: none;}/* Element: Upload Hint */.badge-generator__upload-hint {    font-size: var(--text-xs);    color: var(--color-text-secondary);    margin-top: var(--space-sm);}/* Element: Canvas Container */.badge-generator__canvas-container {    background: transparent;    border-radius: var(--radius-lg);    position: relative;    aspect-ratio: 1;}/* Element: Canvas */.badge-generator__canvas {    width: 100%;    height: 100%;    display: block;}/* Element: Download Section */.badge-generator__download {    text-align: center;    margin-top: var(--space-md);}/* Element: Download Button */.badge-generator__download-btn {    font-weight: 600;    font-size: var(--text-sm);    padding: var(--space-md) var(--space-xl);    border: 2px solid;    backdrop-filter: blur(10px);    transition: all var(--transition-normal);}/* Modifier: Pink Download */.badge-generator__download-btn--pink {    background: var(--color-primary-15);    border-color: var(--color-primary);    color: var(--color-text);}.badge-generator__download-btn--pink:hover {    background: var(--color-primary-20);    border-color: var(--color-primary);}/* Modifier: Blue Download */.badge-generator__download-btn--blue {    background: var(--color-primary-15);    border-color: var(--color-primary);    color: var(--color-text);}.badge-generator__download-btn--blue:hover {    background: var(--color-primary-20);    border-color: var(--color-primary);}/* ==========================================   BUTTONS - BEM Component   Three-button design system   ========================================== *//* Block: Button Base */.button {    display: inline-block;    padding: var(--space-md) var(--space-xl);    border-radius: var(--radius-md);    font-weight: 600;    font-size: var(--text-base);    text-decoration: none;    text-align: center;    cursor: pointer;    border: none;    transition: all var(--transition-normal);    font-family: var(--font-sans);    text-transform: uppercase;}.button:hover {    transform: translateY(-2px);    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);}/* S-Tier: Enhanced Focus Indicators (WCAG AAA) */.button:focus-visible {    outline: 3px solid var(--color-secondary);    outline-offset: 3px;    box-shadow: 0 0 0 1px var(--color-background), 0 0 0 4px var(--color-secondary);}/* Modifier: Primary Button (for tickets) - White text on pink */.button--primary,.button--magenta {    background: var(--color-primary);    color: var(--color-text);    border: 2px solid var(--color-primary);    position: relative;    overflow: hidden;    box-shadow: var(--shadow-glow-subtle);    z-index: 1;}/* Disable base button ::before pseudo-element for magenta buttons */.button--primary::before,.button--magenta::before {    display: none;}.button--primary::after,.button--magenta::after {    content: '';    position: absolute;    top: 50%;    left: 50%;    width: 0;    height: 0;    border-radius: 50%;    background: rgba(255, 255, 255, 0.2);    transform: translate(-50%, -50%);    transition: width 0.4s ease, height 0.4s ease;    z-index: 0;}.button--primary:hover::after,.button--magenta:hover::after {    width: 200px;    height: 200px;}.button--primary:hover,.button--magenta:hover {    background: var(--color-secondary);    color: var(--color-text);    box-shadow: var(--shadow-glow-green), var(--shadow-md);    transform: none !important;    border-color: var(--color-secondary);}.button--primary:focus-visible,.button--magenta:focus-visible {    outline: 3px solid var(--color-secondary);    outline-offset: 3px;    box-shadow: 0 0 0 1px var(--color-background), 0 0 0 4px var(--color-secondary), var(--shadow-glow);}/* Modifier: Secondary Button (consolidated pink/blue) - Pink background with white text */.button--secondary,.button--pink,.button--blue,.button--turquoise {    background: var(--color-primary-15);    color: var(--color-text);    border: 2px solid var(--color-primary);    backdrop-filter: blur(10px);}.button--secondary:hover,.button--pink:hover,.button--blue:hover,.button--turquoise:hover {    background: var(--color-primary-20);    border-color: var(--color-primary);    transform: translateY(-2px);    box-shadow: 0 4px 12px var(--color-primary-20);}.button--secondary:focus-visible,.button--pink:focus-visible,.button--blue:focus-visible,.button--turquoise:focus-visible {    outline: 3px solid var(--color-primary);    outline-offset: 3px;    box-shadow: 0 0 0 1px var(--color-background), 0 0 0 4px var(--color-primary);}/* Modifier: Large Button */.button--large {    padding: var(--space-lg) var(--space-2xl);    font-size: var(--text-lg);}/* Modifier: Small Button */.button--small {    padding: var(--space-sm) var(--space-lg);    font-size: var(--text-sm);}/* Modifier: Outline Button */.button--outline {    background: transparent;    color: var(--color-text);    border: 2px solid var(--color-primary);}.button--outline:hover {    background: var(--color-primary-10);    border-color: var(--color-primary);}/* S-Tier: Reduced Motion Support (WCAG AAA) */@media (prefers-reduced-motion: reduce) {    .button,    .button--primary,    .button--secondary,    .button--blue,    .button--magenta,    .button--pink,    .button--outline {        transition: none;    }        .button:hover,    .button--primary:hover,    .button--secondary:hover,    .button--blue:hover,    .button--magenta:hover,    .button--pink:hover,    .button--outline:hover {        transform: none;    }        .button--primary::after,    .button--magenta::after {        transition: none;    }        .button--primary:hover::after,    .button--magenta:hover::after {        width: 0;        height: 0;    }}/* ==========================================   CARDS - BEM Component   Speaker & Artist Cards with Gradient Overlays   ========================================== *//* Block: Speaker/Artist Card */.speaker-card {    position: relative;  /* CRITICAL: Required for overlay positioning */    border-radius: var(--radius-lg);    overflow: hidden;    transition: all var(--transition-normal);}.speaker-card:hover {    transform: translateY(-4px);}/* Element: Card Overlay (The colored gradient over the image) */.speaker-card__overlay {    position: absolute;    top: 0;    left: 0;    width: 100%;    height: 100%;    z-index: 1;  /* CRITICAL: Above image (0) but below content (2) */    pointer-events: none;    border-radius: inherit;}/* Modifier: Speaker Overlay (Pink/Purple gradient) */.speaker-card__overlay--speaker {    background: linear-gradient(180deg, var(--color-primary-15) 0%, var(--color-secondary-20) 100%);}/* Modifier: Artist Overlay (Cyan/Blue gradient) */.speaker-card__overlay--artist {    background: linear-gradient(180deg, var(--color-primary-15) 0%, var(--color-secondary-20) 100%);}/* Element: Card Image Container */.speaker-card__image {    position: relative;    width: 100%;    aspect-ratio: 1;    overflow: hidden;    z-index: 0;  /* Behind overlay */}.speaker-card__image img {    width: 100%;    height: 100%;    object-fit: cover;    display: block;}/* Element: Card Content */.speaker-card__content {    padding: var(--space-lg);    position: relative;    z-index: 2;  /* CRITICAL: Above overlay (1) so text is readable */    display: flex;    flex-direction: column;    gap: var(--space-sm);    flex-grow: 1;}/* Element: Card Name */.speaker-card__name {    font-size: var(--text-lg);    font-weight: 600;    color: var(--color-text); /* White */    line-height: 1.3;    margin-bottom: var(--space-sm);}/* Element: Card Talk/Description */.speaker-card__talk {    font-size: var(--text-sm);    color: var(--color-text-secondary);    line-height: 1.5;    flex-grow: 1;}/* Element: Card Button */.speaker-card__button {    margin-top: var(--space-sm);    padding: var(--space-sm) var(--space-md);    background: transparent;    border: 1px solid var(--color-secondary);    color: var(--color-secondary);    border-radius: var(--radius-sm);    font-size: var(--text-sm);    font-weight: 500;    cursor: pointer;    transition: all var(--transition-fast);    align-self: center;}.speaker-card__button:hover {    background: var(--color-secondary);    color: white;    transform: translateX(4px);}/* ==========================================   COMPONENT HEADINGS - BEM Component   ========================================== *//* Block: Component Heading */.component-heading {    font-size: var(--text-2xl);    margin-bottom: var(--space-md);    font-weight: 700;}.component-heading--pink {    color: var(--color-primary);}.component-heading--blue {    color: var(--color-primary);}.component-heading--purple {    color: var(--color-secondary);}.component-heading--large {    font-size: var(--text-xl);}/* Block: Component Text */.component-text {    font-size: var(--text-lg);    line-height: 1.8;}.component-text--secondary {    color: var(--color-text-secondary);}/* Block: Info Cards (for partners, founders, after-party popups) */.info-card {    background: var(--color-surface);    padding: var(--space-2xl);    border-radius: var(--radius-lg);    border-width: 2px;    border-style: solid;    transition: all var(--transition-normal);    text-align: center;    position: relative;}.info-card--pink {    border-color: var(--color-primary-20);}.info-card--blue {    border-color: rgba(0, 212, 255, 0.2);}.info-card--purple {    border-color: var(--color-secondary-20);}.info-card--compact {    padding: var(--space-xl);}/* Block: Flex Center (common layout pattern) */.flex-center {    display: flex;    gap: var(--space-lg);    justify-content: center;    flex-wrap: wrap;}/* ==========================================   CONTENT SECTIONS - BEM Component   Typography and content layout patterns   ========================================== *//* Block: Mission Section (reusable content section) */.mission {    /* Base padding handled by .section */}/* Modifier: Top padding for header offset */.mission--header-offset {    padding-top: calc(80px + var(--space-3xl));}/* Element: Mission Title */.mission__title {    font-size: clamp(2.5rem, 6vw, 4rem);    margin-bottom: var(--space-2xl);    text-transform: uppercase;}/* Hero sections: Make mission__title white instead of gradient */.mission--header-offset .mission__title,.section--dark .mission__title:first-child {    color: var(--color-text);    background: none;    -webkit-background-clip: unset;    -webkit-text-fill-color: unset;    background-clip: unset;    animation: none;}/* Modifier: Responsive Mission Title - Deprecated, use base .mission__title instead */.mission__title--responsive {    /* This modifier is deprecated - base .mission__title handles responsive sizing */    font-size: clamp(2.75rem, 7vw, 5rem);    margin-bottom: var(--space-lg);}/* Element: Mission Description */.mission__description {    font-size: var(--text-xl);    margin-bottom: var(--space-xl);    line-height: 1.8;}/* Modifier: Mission Description with extra bottom margin */.mission__description--xl-margin {    margin-bottom: var(--space-xl);}/* Modifier: Large Description */.mission__description--large {    font-size: var(--text-xl);}/* Modifier: Medium Description */.mission__description--medium {    font-size: var(--text-lg);}/* Modifier: Secondary Color */.mission__description--secondary {    color: var(--color-text-secondary);    margin-bottom: var(--space-2xl);}/* Element: Mission Links Wrapper */.mission__links-wrapper {    width: 100%;    padding-inline: var(--space-md);}/* Element: Mission Links Container */.mission__links {    display: flex;    gap: var(--space-lg);    justify-content: center;    flex-wrap: wrap;}/* Modifier: Mission Links with top spacing */.mission__links--spaced {    margin-top: var(--space-xl);}/* Block: Content Container Variations */.content-container {    max-width: 1000px;    margin: 0 auto;}.content-container--narrow {    max-width: 900px;}.content-container--wide {    max-width: 1200px;}/* Block: Theme Section (for year themes) */.theme-section {    padding: var(--space-4xl) 0;    position: relative;}.theme-section__title {    font-size: clamp(2rem, 5vw, 3rem);    margin-bottom: var(--space-lg);    font-weight: 700;    background: var(--gradient-primary);    background-size: 200% 200%;    -webkit-background-clip: text;    -webkit-text-fill-color: transparent;    background-clip: text;    animation: gradientShift 10s ease infinite;}.theme-section__text {    font-size: var(--text-lg);    line-height: 1.8;    margin-bottom: var(--space-xl);}.theme-section__text--secondary {    color: var(--color-text-secondary);}.theme-section__text--last {    margin-bottom: 0;}.theme-section__text--left-aligned {    max-width: 900px;    margin-left: 0;    margin-right: auto;}.theme-section__text--right-aligned {    max-width: 900px;    margin-left: auto;    margin-right: calc(var(--space-4xl) * 2);}.theme-section__title--right-aligned {    margin-right: calc(var(--space-4xl) * 2);    margin-left: auto;}/* Block: Component Section (for event components) */.component-section {    margin-bottom: var(--space-3xl);}.component-section:last-child {    margin-bottom: 0;}.component-section__title {    font-size: clamp(1.5rem, 4vw, 2.5rem);    margin-bottom: var(--space-lg);    font-weight: 700;}.component-section__subtitle {    font-size: var(--text-xl);    color: var(--color-primary);    margin-bottom: var(--space-md);    font-weight: 600;}.component-section__text {    font-size: var(--text-lg);    line-height: 1.8;    margin-bottom: var(--space-lg);}.component-section__text--secondary {    color: var(--color-text-secondary);}.component-section__text--last {    margin-bottom: 0;}/* Block: Event Components Grid */.event-components {    /* Container for event components grid */}.event-components__grid {    display: grid;    gap: var(--space-3xl);}/* Block: Event Component Item */.event-component {    border-left: 4px solid var(--color-primary);    padding: var(--space-2xl) var(--space-2xl) var(--space-2xl) var(--space-xl);    background: rgba(21, 21, 32, 0.4);    backdrop-filter: blur(10px);    border-radius: var(--radius-md);    transition: all var(--transition-normal);    position: relative;    overflow: hidden;    margin-bottom: var(--space-lg);}/* Odd cards (1, 3, 5): border on left */.event-component:nth-child(odd) {    border-left: 4px solid var(--color-primary);    border-right: none;    padding: var(--space-2xl) var(--space-2xl) var(--space-2xl) var(--space-xl);}.event-component:nth-child(odd)::before {    content: '';    position: absolute;    top: 0;    left: 0;    width: 4px;    height: 100%;    background: var(--gradient-primary);    opacity: 0;    transition: opacity var(--transition-normal);    filter: blur(2px);}.event-component:nth-child(odd)::after {    content: '';    position: absolute;    top: 0;    left: 0;    width: 4px;    height: 100%;    background: var(--color-primary);    opacity: 1;    transition: opacity var(--transition-normal), box-shadow var(--transition-normal);    box-shadow: 0 0 12px var(--color-primary-40);}/* Even cards (2, 4, 6): border on right */.event-component:nth-child(even) {    border-left: none;    border-right: 4px solid var(--color-primary);    padding: var(--space-2xl) var(--space-xl) var(--space-2xl) var(--space-2xl);}.event-component:nth-child(even)::before {    content: '';    position: absolute;    top: 0;    right: 0;    width: 4px;    height: 100%;    background: var(--gradient-primary);    opacity: 0;    transition: opacity var(--transition-normal);    filter: blur(2px);}.event-component:nth-child(even)::after {    content: '';    position: absolute;    top: 0;    right: 0;    width: 4px;    height: 100%;    background: var(--color-primary);    opacity: 1;    transition: opacity var(--transition-normal), box-shadow var(--transition-normal);    box-shadow: 0 0 12px var(--color-primary-40);}/* Accent modifier - odd cards */.event-component--accent:nth-child(odd) {    border-left-color: var(--color-primary);}.event-component--accent:nth-child(odd)::before {    background: var(--gradient-accent);}.event-component--accent:nth-child(odd)::after {    background: var(--color-primary);    box-shadow: 0 0 12px var(--color-secondary0);}/* Accent modifier - even cards */.event-component--accent:nth-child(even) {    border-right-color: var(--color-primary);}.event-component--accent:nth-child(even)::before {    background: var(--gradient-accent);}.event-component--accent:nth-child(even)::after {    background: var(--color-primary);    box-shadow: 0 0 12px var(--color-secondary0);}/* Secondary modifier - odd cards */.event-component--secondary:nth-child(odd) {    border-left-color: var(--color-secondary);}.event-component--secondary:nth-child(odd)::before {    background: var(--gradient-secondary);}.event-component--secondary:nth-child(odd)::after {    background: var(--color-secondary);    box-shadow: 0 0 12px var(--color-secondary-40);}/* Secondary modifier - even cards */.event-component--secondary:nth-child(even) {    border-right-color: var(--color-secondary);}.event-component--secondary:nth-child(even)::before {    background: var(--gradient-secondary);}.event-component--secondary:nth-child(even)::after {    background: var(--color-secondary);    box-shadow: 0 0 12px var(--color-secondary-40);}.event-component__title {    font-size: var(--text-lg);    margin-bottom: var(--space-md);    color: var(--color-primary);    font-weight: 600;    text-transform: uppercase;    letter-spacing: 0.1em;    transition: color var(--transition-fast);    line-height: 1.3;}/* Erratic title alignment - alternating pattern */.event-component:nth-child(1) .event-component__title {    text-align: right;    padding-right: var(--space-sm);}.event-component:nth-child(2) .event-component__title {    text-align: left;    padding-left: var(--space-sm);}.event-component:nth-child(3) .event-component__title {    text-align: center;}.event-component:nth-child(4) .event-component__title {    text-align: right;    padding-right: var(--space-sm);}.event-component:nth-child(5) .event-component__title {    text-align: left;    padding-left: var(--space-sm);}.event-component:nth-child(6) .event-component__title {    text-align: center;}.event-component__title--accent {    color: var(--color-text);}.event-component__title--secondary {    color: var(--color-text);}.event-component__text {    font-size: var(--text-base);    line-height: 1.75;    color: var(--color-text-secondary);    max-width: 100%;}/* Erratic text alignment - different pattern from titles */.event-component:nth-child(1) .event-component__text {    text-align: left;}.event-component:nth-child(2) .event-component__text {    text-align: right;}.event-component:nth-child(3) .event-component__text {    text-align: left;}.event-component:nth-child(4) .event-component__text {    text-align: center;}.event-component:nth-child(5) .event-component__text {    text-align: right;}.event-component:nth-child(6) .event-component__text {    text-align: left;}/* Modifier: Mission Container Width */.mission .container--narrow {    max-width: 1000px;}.mission .container--wide {    max-width: 1200px;}/* Enhanced Visual Effects for About Page Hero */.about-hero {    position: relative;    min-height: 70vh;    display: flex;    align-items: center;    padding-bottom: var(--space-4xl);}.about-hero .morphing-blob {    width: 600px;    height: 600px;    top: 15%;    right: 10%;    opacity: 0.25;}.about-hero .gradient-mesh {    opacity: 0.5;}/* About Hero Accent Elements */.about-hero__accent {    position: absolute;    width: 300px;    height: 300px;    border-radius: 50%;    filter: blur(80px);    opacity: 0.3;    pointer-events: none;    z-index: 0;    animation: float 20s ease-in-out infinite;}.about-hero__accent--left {    background: radial-gradient(circle, var(--color-primary) 0%, transparent 70%);    top: 20%;    left: 5%;    animation-delay: 0s;}.about-hero__accent--right {    background: radial-gradient(circle, var(--color-primary) 0%, transparent 70%);    bottom: 20%;    right: 8%;    animation-delay: 2s;}/* About Hero Title Enhancement */.about-hero__title {    position: relative;    display: flex;    flex-direction: column;    gap: var(--space-md);}.about-hero__title-word {    display: block;    color: var(--color-text);    text-transform: uppercase;    position: relative;}.about-hero__title-word::after {    content: '';    position: absolute;    bottom: -8px;    left: 0;    width: 100%;    height: 3px;    background: var(--gradient-primary);    background-size: 200% 200%;    border-radius: var(--radius-full);    opacity: 0.6;    animation: gradientShift 8s ease infinite;}.about-hero__title-subtitle {    display: block;    font-size: 0.6em;    font-weight: 400;    color: var(--color-text);    letter-spacing: 0.15em;    text-transform: uppercase;    margin-top: var(--space-sm);    opacity: 0.8;}/* About Hero Lead Text */.about-hero__lead {    font-size: var(--text-xl);    font-weight: 500;    line-height: 1.9;    color: var(--color-text);    max-width: 900px;    position: relative;    z-index: 2;}#about-2024 .morphing-blob {    width: 400px;    height: 400px;    bottom: 10%;    left: 5%;}#event-components .gradient-mesh {    opacity: 0.3;}/* Responsive: About Hero */@media (max-width: 768px) {    .about-hero {        min-height: 60vh;        padding-bottom: var(--space-3xl);    }        .about-hero .morphing-blob {        width: 400px;        height: 400px;        top: 10%;        right: 5%;    }        .about-hero__accent {        width: 200px;        height: 200px;    }        .about-hero__accent--left {        top: 15%;        left: 0;    }        .about-hero__accent--right {        bottom: 15%;        right: 0;    }        .about-hero__title-subtitle {        font-size: 0.5em;    }        .about-hero__lead {        font-size: var(--text-lg);    }}/* ==========================================   EVENT INFO PAGE COMPONENTS   ========================================== *//* Block: Event Info Hero */.event-info-hero {    padding-top: calc(80px + var(--space-3xl));    padding-bottom: var(--space-3xl);    position: relative;    min-height: 45vh;    display: flex;    align-items: center;    justify-content: center;    background: transparent;    overflow: hidden;    z-index: 1;}.event-info-hero + section {    position: relative;    z-index: 2;}.event-info-hero__container {    position: relative;    z-index: 2;    text-align: center;    max-width: 800px;}.event-info-hero__title {    font-size: clamp(2.5rem, 8vw, 5.5rem);    font-weight: 800;    text-transform: uppercase;    letter-spacing: 0.02em;    margin: 0;    line-height: 1.1;    color: var(--color-text);    text-shadow: 0 2px 20px rgba(0, 0, 0, 0.5);}/* Warping Orb for Event Info */.warping-orb-event-info {    position: absolute;    top: 50%;    left: 50%;    width: 600px;    height: 600px;    transform: translate(-50%, -50%);    border-radius: 50%;    pointer-events: none;    z-index: 1;    mix-blend-mode: screen;    animation: warpOrb 12s ease-in-out infinite;    filter: blur(80px);    opacity: 0.5;    will-change: transform, filter;}.warping-orb-event-info::before {    content: '';    position: absolute;    top: 0;    left: 0;    width: 100%;    height: 100%;    background: radial-gradient(        circle at 35% 35%,        var(--color-primary) 0%,        var(--color-secondary) 40%,        var(--color-secondary) 70%,        transparent 100%    );    border-radius: 50%;    opacity: 0.8;    animation: orbGlow 8s ease-in-out infinite;    transform-origin: center center;}.warping-orb-event-info::after {    content: '';    position: absolute;    top: 15%;    right: 15%;    width: 450px;    height: 450px;    background: radial-gradient(        circle at 65% 65%,        var(--color-primary) 0%,        var(--color-secondary) 30%,        transparent 70%    );    border-radius: 50%;    opacity: 0.6;    animation: orbGlow 10s ease-in-out infinite reverse;    transform-origin: center center;}/* Block: Info Card (for Tickets, Sponsorship, etc.) */.info-card {    border-left: 4px solid var(--color-primary);    padding: var(--space-xl);    background: rgba(21, 21, 32, 0.4);    backdrop-filter: blur(10px);    border-radius: var(--radius-md);    transition: all var(--transition-normal);    position: relative;    overflow: hidden;}.info-card::before {    content: '';    position: absolute;    top: 0;    left: 0;    width: 4px;    height: 100%;    background: var(--gradient-primary);    opacity: 0;    transition: opacity var(--transition-normal);}.info-card--accent {    border-left-color: var(--color-primary);}.info-card--secondary {    border-left-color: var(--color-secondary);}/* Info card with gradient borders on both sides for Exhibitors intro */.info-card--secondary::before {    background: var(--gradient-secondary);}.info-card--secondary::after {    content: '';    position: absolute;    top: 0;    right: 0;    width: 4px;    height: 100%;    background: var(--gradient-secondary);    opacity: 1;    transition: opacity var(--transition-normal), box-shadow var(--transition-normal);    box-shadow: 0 0 12px var(--color-secondary-40);}.info-card__title {    font-size: var(--text-2xl);    margin-bottom: var(--space-lg);    color: var(--color-primary);    font-weight: 700;}.info-card--accent .info-card__title {    color: var(--color-primary);}.info-card--secondary .info-card__title {    color: var(--color-secondary);}.info-card__text {    font-size: var(--text-lg);    line-height: 1.8;    color: var(--color-text-secondary);}.info-card__text--primary {    color: var(--color-text);}.info-card__price {    color: var(--color-primary);    font-weight: 600;}.info-card--accent .info-card__price {    color: var(--color-primary);}/* Block: Exhibitor Space Card */.exhibitor-card {    background: rgba(21, 21, 32, 0.4);    backdrop-filter: blur(10px);    padding: var(--space-2xl);    border-radius: var(--radius-lg);    transition: all var(--transition-normal);    position: relative;    overflow: hidden;    border-left: 4px solid transparent;    border-right: 4px solid transparent;}/* Gradient borders on both sides - Start-up card: purple to pink */.exhibitor-card::before {    content: '';    position: absolute;    top: 0;    left: 0;    width: 4px;    height: 100%;    background: linear-gradient(180deg, var(--color-secondary) 0%, var(--color-primary) 100%);    opacity: 1;    transition: opacity var(--transition-normal), box-shadow var(--transition-normal);    box-shadow: 0 0 12px var(--color-primary-40);}.exhibitor-card::after {    content: '';    position: absolute;    top: 0;    right: 0;    width: 4px;    height: 100%;    background: linear-gradient(180deg, var(--color-secondary) 0%, var(--color-primary) 100%);    opacity: 1;    transition: opacity var(--transition-normal), box-shadow var(--transition-normal);    box-shadow: 0 0 12px var(--color-primary-40);}/* Accent modifier - gradient from purple (left) to light blue (right) */.exhibitor-card--accent::before {    background: linear-gradient(180deg, var(--color-secondary) 0%, var(--color-primary) 100%);    box-shadow: 0 0 12px var(--color-secondary-40), 0 0 12px var(--color-secondary0);}.exhibitor-card--accent::after {    background: linear-gradient(180deg, var(--color-secondary) 0%, var(--color-primary) 100%);    box-shadow: 0 0 12px var(--color-secondary-40), 0 0 12px var(--color-secondary0);}.exhibitor-card__title {    font-size: var(--text-xl);    color: var(--color-primary);    font-weight: 700;    margin-bottom: var(--space-md);    text-align: left;}.exhibitor-card--accent .exhibitor-card__title {    color: var(--color-primary);}.exhibitor-card__text {    font-size: var(--text-lg);    line-height: 1.8;    color: var(--color-text);    text-align: left;}.exhibitor-card__price {    color: var(--color-primary);    font-weight: 600;}.exhibitor-card--accent .exhibitor-card__price {    color: var(--color-primary);}.exhibitor-cards__grid {    display: grid;    gap: var(--space-2xl);}/* Block: FAQ CTA Section */.faq-cta {    padding: var(--space-4xl) 0;    text-align: center;}.faq-cta__title {    font-size: clamp(1.75rem, 4vw, 2.5rem);    font-weight: 700;    margin-bottom: var(--space-xl);}.faq-cta__button {    font-size: var(--text-lg);    padding: var(--space-lg) var(--space-2xl);    background: linear-gradient(180deg, var(--color-primary-15) 0%, var(--color-secondary-20) 100%);    border: 2px solid var(--color-primary-15);    color: var(--color-secondary);    font-weight: 600;    backdrop-filter: blur(10px);    transition: all var(--transition-normal);    border-radius: var(--radius-md);    text-decoration: none;    display: inline-block;}.faq-cta__button:hover {    transform: translateY(-2px);    box-shadow: 0 8px 24px var(--color-primary-20);    border-color: var(--color-primary-50);    background: linear-gradient(180deg, var(--color-primary-25) 0%, var(--color-secondary-20) 100%);}/* Responsive: Event Info */@media (max-width: 768px) {    .event-info-hero {        min-height: 40vh;        padding-top: calc(60px + var(--space-2xl));        padding-bottom: var(--space-2xl);    }        .warping-orb-event-info {        width: 400px;        height: 400px;    }        .warping-orb-event-info::after {        width: 300px;        height: 300px;    }        .info-card {        padding: var(--space-lg);    }            .exhibitor-card {        padding: var(--space-xl);    }        .exhibitor-card::before,    .exhibitor-card::after {        width: 3px;    }        .info-card--secondary::after {        width: 3px;    }        .exhibitor-cards__grid {        gap: var(--space-xl);    }}/* Reduced motion support */@media (prefers-reduced-motion: reduce) {    .warping-orb-event-info,    .warping-orb-event-info::before,    .warping-orb-event-info::after {        animation: none !important;    }        .event-info-hero__title {        animation: none;    }}/* ==========================================   ERRATIC TEXT ALIGNMENT MODIFIERS   Inspired by hero title styling   ========================================== *//* Modifier: Section Content Alignment - Left */.section-content--align-left .container,.section-content--align-left .container > * {    text-align: left;}.section-content--align-left .theme-section__title,.section-content--align-left .info-card__title,.section-content--align-left .event-component__title {    text-align: left;}.section-content--align-left .theme-section__text,.section-content--align-left .info-card__text,.section-content--align-left .event-component__text {    text-align: left;}/* Modifier: Section Content Alignment - Right */.section-content--align-right .container,.section-content--align-right .container > * {    text-align: right;}.section-content--align-right .theme-section__title,.section-content--align-right .info-card__title,.section-content--align-right .event-component__title {    text-align: right;}.section-content--align-right .theme-section__text,.section-content--align-right .info-card__text,.section-content--align-right .event-component__text {    text-align: right;}/* Modifier: Section Content Alignment - Center */.section-content--align-center .container,.section-content--align-center .container > * {    text-align: center;}.section-content--align-center .theme-section__title,.section-content--align-center .info-card__title,.section-content--align-center .event-component__title {    text-align: center;}.section-content--align-center .theme-section__text,.section-content--align-center .info-card__text,.section-content--align-center .event-component__text {    text-align: center;}/* Override for specific elements that should maintain their alignment */.section-content--align-left .max-w-900,.section-content--align-right .max-w-900,.section-content--align-center .max-w-900 {    margin-left: auto;    margin-right: auto;}.section-content--align-left .max-w-1000,.section-content--align-right .max-w-1000,.section-content--align-center .max-w-1000 {    margin-left: auto;    margin-right: auto;}/* Buttons maintain their natural alignment within their container */.section-content--align-left .button,.section-content--align-right .button,.section-content--align-center .button {    display: inline-block;}.section-content--align-left .mt-xl {    text-align: left;}.section-content--align-right .mt-xl {    text-align: right;}.section-content--align-center .mt-xl {    text-align: center;}/* Event Components Grid maintains its own alignment */.section-content--align-right .event-components__grid,.section-content--align-left .event-components__grid,.section-content--align-center .event-components__grid {    text-align: initial;}.section-content--align-right .event-component,.section-content--align-left .event-component,.section-content--align-center .event-component {    text-align: left;}/* Responsive: Center-align on mobile for readability */@media (max-width: 768px) {    .section-content--align-left .container,    .section-content--align-right .container,    .section-content--align-left .theme-section__title,    .section-content--align-right .theme-section__title,    .section-content--align-left .info-card__title,    .section-content--align-right .info-card__title,    .section-content--align-left .theme-section__text,    .section-content--align-right .theme-section__text,    .section-content--align-left .info-card__text,    .section-content--align-right .info-card__text {        text-align: center;    }        .section-content--align-left .mt-xl,    .section-content--align-right .mt-xl {        text-align: center;    }        /* Event components always left-align on mobile for readability */    .section-content--align-right .event-component,    .section-content--align-left .event-component,    .section-content--align-center .event-component {        text-align: left;    }}/* Responsive: Event Components */@media (max-width: 768px) {    .event-components__grid {        gap: var(--space-2xl);    }        .event-component:nth-child(odd) {        padding: var(--space-xl) var(--space-xl) var(--space-xl) var(--space-lg);        border-left-width: 3px;    }        .event-component:nth-child(even) {        padding: var(--space-xl) var(--space-lg) var(--space-xl) var(--space-xl);        border-right-width: 3px;    }        .event-component::before,    .event-component::after {        width: 3px;    }            .event-component__title {        font-size: var(--text-base);        text-align: left;        margin-bottom: var(--space-sm);        padding-right: 0;        letter-spacing: 0.08em;    }        .event-component__text {        font-size: var(--text-sm);        line-height: 1.7;    }        .about-hero .morphing-blob,    #about-2024 .morphing-blob {        width: 300px;        height: 300px;    }}/* Responsive */@media (max-width: 768px) {    .mission--header-offset {        padding-top: calc(60px + var(--space-2xl));    }        .theme-section {        padding: var(--space-3xl) 0;    }        .component-section {        margin-bottom: var(--space-2xl);    }}/* ============================================   COLOR PALETTE DEBUG SECTION   ============================================ */.debug-palette {  padding: var(--space-4xl) var(--space-md);  background: var(--color-background);  border-top: 2px solid var(--color-border);  border-bottom: 2px solid var(--color-border);}.debug-palette__container {  max-width: 1400px;  margin-inline: auto;}.debug-palette__title {  font-size: var(--text-3xl);  font-weight: 700;  margin-bottom: var(--space-2xl);  color: var(--color-text);  text-align: center;}.debug-palette__category {  margin-bottom: var(--space-3xl);}.debug-palette__category-title {  font-size: var(--text-xl);  font-weight: 600;  margin-bottom: var(--space-lg);  color: var(--color-text-secondary);  text-transform: uppercase;  letter-spacing: 0.1em;}.debug-palette__grid {  display: grid;  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));  gap: var(--space-lg);  margin-bottom: var(--space-xl);}.debug-palette__swatch {  display: flex;  flex-direction: column;  gap: var(--space-sm);}.debug-palette__color-box {  width: 100%;  height: 120px;  border-radius: var(--radius-md);  border: 2px solid var(--color-border);  background: var(--swatch-color);  position: relative;  overflow: hidden;}.debug-palette__gradient-box {  width: 100%;  height: 120px;  border-radius: var(--radius-md);  border: 2px solid var(--color-border);  background: var(--gradient-color);  position: relative;  overflow: hidden;}.debug-palette__info {  display: flex;  flex-direction: column;  gap: var(--space-xs);}.debug-palette__variable {  font-size: var(--text-sm);  font-family: 'Courier New', monospace;  color: var(--color-text-secondary);  font-weight: 600;}.debug-palette__hex {  font-size: var(--text-sm);  font-family: 'Courier New', monospace;  color: var(--color-text);  font-weight: 400;}.debug-palette__gradients {  display: flex;  flex-direction: column;  gap: var(--space-lg);}.debug-palette__gradient-item {  display: flex;  flex-direction: column;  gap: var(--space-sm);}.debug-palette__gradient-preview {  width: 100%;  height: 80px;  border-radius: var(--radius-md);  border: 2px solid var(--color-border);  background: var(--gradient-color);}@media (max-width: 768px) {  .debug-palette__grid {    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));    gap: var(--space-md);  }    .debug-palette__color-box,  .debug-palette__gradient-box {    height: 100px;  }}/* ==========================================   FAQ - BEM Component   Details/Summary based FAQ system   ========================================== *//* Block: FAQ Section */.faq {    padding-top: calc(80px + var(--space-3xl));    padding-bottom: var(--space-4xl);}.faq__container {    max-width: 900px;    margin: 0 auto;}.faq__title {    font-size: clamp(2.5rem, 6vw, 4rem);    margin-bottom: var(--space-3xl);    text-align: center;}/* Block: FAQ Category */.faq-category {    margin-bottom: var(--space-3xl);}.faq-category__title {    font-size: var(--text-xl);    color: var(--color-primary);    margin-bottom: var(--space-lg);    font-weight: 700;}/* Modifier: Primary Color Title */.faq-category__title--primary {    color: var(--color-primary);}/* Modifier: Accent Color Title */.faq-category__title--accent {    color: var(--color-text);}/* Modifier: Secondary Color Title */.faq-category__title--secondary {    color: var(--color-text);}.faq-category__items {    display: flex;    flex-direction: column;    gap: var(--space-sm);}/* Block: FAQ Item (details element) */.faq-item {    background: var(--color-surface);    border-radius: var(--radius-md);    padding: var(--space-lg);    border: 1px solid var(--color-primary-20);    transition: all var(--transition-fast);}.faq-item:hover {    border-color: var(--color-primary-20);    background: rgba(21, 21, 32, 0.8);}.faq-item[open] {    border-color: var(--color-primary);}/* Modifier: Primary Color (Pink) */.faq-item--primary {    border-color: var(--color-primary-20);}.faq-item--primary:hover {    border-color: var(--color-primary-20);}.faq-item--primary[open] {    border-color: var(--color-primary);}/* Modifier: Accent Color (Blue) */.faq-item--accent {    border-color: rgba(0, 212, 255, 0.2);}.faq-item--accent:hover {    border-color: rgba(0, 212, 255, 0.4);}.faq-item--accent[open] {    border-color: var(--color-primary);}/* Modifier: Secondary Color (Purple) */.faq-item--secondary {    border-color: var(--color-secondary-20);}.faq-item--secondary:hover {    border-color: var(--color-secondary-20);}.faq-item--secondary[open] {    border-color: var(--color-secondary);}/* Element: FAQ Summary (question) */.faq-item__question {    font-weight: 600;    cursor: pointer;    font-size: var(--text-lg);    list-style: none;    user-select: none;    text-align: left;    display: flex;    align-items: center;    justify-content: flex-start;    position: relative;    padding-right: 2em;    min-height: 1.5em;}.faq-item__question::-webkit-details-marker {    display: none;}.faq-item__question::after {    content: '+';    position: absolute;    right: 0;    font-size: 1.5em;    font-weight: 300;    color: var(--color-primary);    transition: transform var(--transition-fast);}.faq-item__question:focus-visible {    outline: 3px solid var(--color-secondary);    outline-offset: 4px;    border-radius: var(--radius-md);}.faq-item[open] .faq-item__question::after {    transform: rotate(45deg);}/* Plus icon color matches border color for each modifier */.faq-item--primary .faq-item__question::after {    color: var(--color-primary);}.faq-item--accent .faq-item__question::after {    color: var(--color-primary);}.faq-item--secondary .faq-item__question::after {    color: var(--color-secondary);}/* Element: FAQ Answer */.faq-item__answer {    margin-top: var(--space-md);    color: var(--color-text-secondary);    line-height: 1.8;}/* Responsive */@media (max-width: 768px) {    .faq {        padding-top: calc(60px + var(--space-2xl));        padding-bottom: var(--space-3xl);    }        .faq-category {        margin-bottom: var(--space-2xl);    }}/* ============================================   FEATURED PHOTO COMPONENT   Full-width hero-style photo with caption   ============================================ *//* Featured Photo Section */.featured-photo {  width: 100%;  height: 400px;  position: relative;  overflow: hidden;}/* Photo Container */.featured-photo__image {  width: 100%;  height: 100%;  background-size: cover;  background-position: center;  background-repeat: no-repeat;  filter: grayscale(20%) brightness(0.8);  opacity: 0.7;  position: relative;}/* Color overlay for blend - matches site-wide photo styling */.featured-photo__image::before {  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: var(--color-background);  opacity: 0.3;  pointer-events: none;}/* Color Overlay Variant - Less Prominent */.featured-photo--overlay .featured-photo__image {  opacity: 0.5;  filter: brightness(0.7);}.featured-photo--overlay::before {  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: var(--color-background);  opacity: 0.3;  z-index: 1;  pointer-events: none;}/* Responsive adjustments for overlay variant */@media (min-width: 1441px) {  .featured-photo--overlay {    height: 300px;  }    .featured-photo--overlay .featured-photo__image {    opacity: 0.6;    filter: brightness(0.75);  }    .featured-photo--overlay::before {    opacity: 0.4;  }}/* Photo Caption */.featured-photo__caption {  position: absolute;  bottom: 0;  left: 0;  width: 100%;  background: linear-gradient(180deg, transparent 0%, var(--color-background) 100%);  color: var(--color-text);  padding: var(--space-xl) var(--space-lg);  font-size: var(--text-lg);  font-weight: 500;  text-align: center;  letter-spacing: 0.05em;}/* Responsive - Tablet */@media (max-width: 1024px) {  .featured-photo {    height: 350px;  }    .featured-photo__caption {    font-size: var(--text-base);    padding: var(--space-lg) var(--space-md);  }}/* Responsive - Mobile */@media (max-width: 768px) {  .featured-photo {    height: 300px;  }    .featured-photo__caption {    font-size: var(--text-sm);    padding: var(--space-md) var(--space-sm);  }}/* ==========================================   FINAL UTILITIES - BEM Component   ========================================== *//* Purple variations for after-party */.component-heading--purple-large {    font-size: var(--text-xl);    color: var(--color-secondary);}.info-card--purple-compact {    background: var(--color-surface);    padding: var(--space-xl);    border-radius: var(--radius-lg);    border: 2px solid var(--color-secondary-20);}/* FAQ category title variant */.faq-category__title--purple {    font-size: var(--text-xl);    color: var(--color-text);    margin-bottom: var(--space-lg);    font-weight: 700;}/* Grid layouts */.grid-auto-fit {    display: grid;    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));    gap: var(--space-2xl);    max-width: 1200px;    margin: 0 auto;}/* Text utilities */.text-relative-z {    color: var(--color-text);    line-height: 1.8;    position: relative;    z-index: 1;}/* Margin utilities */.mb-2xl {    margin-bottom: var(--space-2xl);}.mb-3xl-center {    text-align: center;    margin-bottom: var(--space-3xl);}/* Flex utilities */.flex-center-nowrap {    display: flex;    gap: var(--space-lg);    justify-content: center;    flex-wrap: nowrap;}/* Hero title with gradient (for artists/speakers) */.hero-title--gradient {    font-size: clamp(2.5rem, 8vw, 5.5rem);    font-weight: 800;    text-transform: uppercase;    letter-spacing: 0.02em;    margin: 0;    line-height: 1.1;    background: var(--gradient-tech-art);    -webkit-background-clip: text;    -webkit-text-fill-color: transparent;    background-clip: text;    text-shadow: 0 2px 20px rgba(0, 0, 0, 0.5);}/* Hero subtitle */.hero-subtitle--accent {    color: var(--color-secondary);    font-size: var(--text-2xl);    margin-bottom: var(--space-sm);}/* Hero description */.hero-description--secondary {    color: var(--color-text-secondary);    font-size: var(--text-lg);    font-weight: 400;}/* Hero section layout */.hero-section--full {    padding-top: calc(80px + var(--space-3xl));    padding-bottom: var(--space-3xl);    position: relative;    min-height: 45vh;    display: flex;    align-items: center;    justify-content: center;    background: transparent;}/* Hero content wrapper */.hero-content--centered {    position: relative;    z-index: 2;    text-align: center;    max-width: 800px;}/* Index page specific */.index-title {    font-size: clamp(2rem, 5vw, 3.5rem);    margin-bottom: var(--space-lg);}.index-subtitle {    font-size: var(--text-xl);    margin-bottom: var(--space-2xl);    color: var(--color-text-secondary);}/* ==========================================   FOUNDER/TEAM CARD - BEM Component   ========================================== *//* Element: Founder Card Image Container */.founder-card__image-container {    position: relative;    width: 100%;    height: 420px;    overflow: hidden;}.founder-card__image-container img {    width: 100%;    height: 100%;    object-fit: cover;    display: block;    position: absolute;    top: 0;    left: 0;}/* Element: Founder Card Overlay */.founder-card__overlay {    position: absolute;    inset: 0;    background: linear-gradient(180deg, var(--color-primary-15) 0%, var(--color-secondary-20) 100%);    z-index: 1;    pointer-events: none;}/* Block: Area Card (for after-party areas) */.area-card {    border-left-width: 3px;    border-left-style: solid;    padding-left: var(--space-xl);}.area-card--pink {    border-left-color: var(--color-primary);}.area-card--blue {    border-left-color: var(--color-primary);}.area-card--purple {    border-left-color: var(--color-secondary);}.area-card__title {    font-size: var(--text-2xl);    margin-bottom: var(--space-md);    font-weight: 700;    color: var(--color-text);}.area-card__title--pink {    color: var(--color-text);}.area-card__title--blue {    color: var(--color-text);}.area-card__title--purple {    color: var(--color-text);}/* Block: Areas Grid */.areas-grid {    display: grid;    gap: var(--space-3xl);}/* Block: Closing Statement */.closing-statement {    margin-top: var(--space-3xl);    text-align: center;}.closing-statement__text {    font-size: var(--text-lg);    color: var(--color-text-secondary);    line-height: 1.8;    max-width: 800px;    margin: 0 auto;    font-weight: 600;}/* Block: Partner Pop-ups Grid */.partner-popups-grid {    display: grid;    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));    gap: var(--space-xl);    max-width: 1000px;    margin: 0 auto;}/* ==========================================   HERO SECTIONS - BEM Component   ========================================== *//* Block: Hero Base */.hero {    padding-top: calc(80px + var(--space-3xl) * 1.5);    padding-bottom: calc(var(--space-3xl) * 1.5);    position: relative;    min-height: 50vh;    display: flex;    align-items: center;    justify-content: center;}/* Modifier: Investors Hero */.hero--investors {    background: linear-gradient(180deg, #0a0a0f 0%, #151520 100%);}/* Element: Hero Glow Background */.hero__glow {    position: absolute;    inset: 0;    z-index: 0;    opacity: 0.08;}.hero__glow-left {    position: absolute;    top: 50%;    left: 30%;    width: 600px;    height: 600px;    background: radial-gradient(circle, var(--color-primary) 0%, transparent 70%);    filter: blur(120px);    transform: translate(-50%, -50%);}.hero__glow-right {    position: absolute;    top: 50%;    right: 30%;    width: 600px;    height: 600px;    background: radial-gradient(circle, var(--color-primary) 0%, transparent 70%);    filter: blur(120px);    transform: translate(50%, -50%);}/* Element: Hero Content */.hero__content {    position: relative;    z-index: 2;    text-align: center;    max-width: 900px;    margin: 0 auto;}/* Element: Hero Title */.hero__title {    font-size: clamp(3.5rem, 10vw, 8rem);    font-weight: 600;    text-transform: uppercase;    letter-spacing: 0.03em;    margin: 0;    line-height: 1.15;    color: var(--color-text);}.hero__title-line {    display: block;}.hero__title-line--top {    margin-bottom: var(--space-md);}.hero__title-line--bottom {    margin-top: var(--space-md);}.hero__title-divider {    display: inline-block;    font-size: 0.2em;    font-weight: 300;    color: var(--color-secondary);    margin: 0 var(--space-lg);    vertical-align: middle;    opacity: 0.7;}/* Element: Hero Separator Line */.hero__separator {    width: 60px;    height: 1px;    background: linear-gradient(90deg, transparent 0%, var(--color-primary) 50%, transparent 100%);    margin: var(--space-xl) auto 0;    opacity: 0.3;}/* Responsive */@media (max-width: 768px) {    .hero {        padding-top: calc(60px + var(--space-2xl));        padding-bottom: var(--space-2xl);        min-height: 40vh;    }        .hero__glow-left,    .hero__glow-right {        width: 400px;        height: 400px;    }}/* ============================================   HERO PHOTO GRID COMPONENT   Photo grid background with text carousel banner   ============================================ *//* Hero Container */.hero-photo-grid {  position: relative;  width: 100%;  height: 70vh;  min-height: 500px;  max-height: 800px;  overflow: hidden;  display: grid;  grid-template-columns: repeat(2, 1fr);  gap: 2px;  background: var(--color-background);}/* Photo Grid Items */.hero-photo-grid__item {  width: 100%;  height: 100%;  background-size: cover;  background-position: center;  background-repeat: no-repeat;  filter: grayscale(30%) brightness(0.6);  position: relative;}/* Dark overlay for better text contrast */.hero-photo-grid::before {  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: var(--color-background);  opacity: 0.4;  z-index: 1;  pointer-events: none;}/* Text Banner Container */.hero-photo-grid__banner {  position: absolute;  top: 50%;  left: -5%;  width: 110%;  transform: translateY(-50%) rotate(-2deg);  background: var(--color-background);  padding: 0;  z-index: 2;  overflow: hidden;  line-height: 0.9;  display: flex;}/* Scrolling Text Track */.hero-photo-grid__track {  display: flex;  align-items: center;  animation: scroll-text 40s linear infinite;  will-change: transform;}/* Content Groups (duplicated for seamless loop) */.hero-photo-grid__content {  display: flex;  align-items: center;  gap: var(--space-3xl);  white-space: nowrap;  flex-shrink: 0;}/* Individual Text Items */.hero-photo-grid__text {  font-size: clamp(3rem, 8vw, 6rem);  font-weight: 900;  letter-spacing: 0.05em;  text-transform: uppercase;  white-space: nowrap;  color: var(--color-text);  opacity: 0.9;  line-height: 1;  display: flex;  align-items: center;}/* Color variants for dots - Tonik Brand Colors */.hero-photo-grid__text--accent {  color: var(--color-primary);  transform: translateY(-0.08em);}.hero-photo-grid__text--pink {  color: var(--color-primary);  transform: translateY(-0.08em);}.hero-photo-grid__text--purple {  color: var(--color-secondary);  transform: translateY(-0.08em);}.hero-photo-grid__text--blue {  color: var(--color-secondary);  transform: translateY(-0.08em);}/* Scrolling Animation - moves exactly one content group width */@keyframes scroll-text {  0% {    transform: translateX(0);  }  100% {    transform: translateX(calc(-100% / 2));  }}/* Pause on hover */.hero-photo-grid__track:hover {  animation-play-state: paused;}/* Subtitle Below Banner */.hero-photo-grid__subtitle {  position: absolute;  bottom: var(--space-2xl);  left: 50%;  transform: translateX(-50%);  z-index: 2;  text-align: center;  color: var(--color-text-secondary);  font-size: var(--text-lg);  font-weight: 500;  letter-spacing: 0.05em;}/* Responsive - Tablet */@media (max-width: 1024px) {  .hero-photo-grid {    height: 60vh;    min-height: 450px;  }    .hero-photo-grid__text {    font-size: clamp(2.5rem, 7vw, 5rem);  }    .hero-photo-grid__subtitle {    font-size: var(--text-base);    bottom: var(--space-xl);  }}/* Responsive - Mobile */@media (max-width: 768px) {  .hero-photo-grid {    height: 50vh;    min-height: 400px;    grid-template-columns: 1fr;    grid-template-rows: repeat(2, 1fr);  }    .hero-photo-grid__item:nth-child(3),  .hero-photo-grid__item:nth-child(4) {    display: none;  }    .hero-photo-grid__text {    font-size: clamp(2rem, 10vw, 3.5rem);  }    .hero-photo-grid__subtitle {    font-size: var(--text-sm);    bottom: var(--space-md);  }    .hero-photo-grid__track {    animation-duration: 30s;  }}/* ============================================   HERO TWO PHOTOS COMPONENT   Side-by-side photo hero with centered title   ============================================ *//* Hero Container */.hero-two-photos {  position: relative;  width: 100%;  height: 70vh;  min-height: 500px;  max-height: 800px;  display: grid;  grid-template-columns: 1fr 1fr;  gap: 2px;  background: var(--color-background);  overflow: hidden;}/* Photo Items */.hero-two-photos__item {  width: 100%;  height: 100%;  background-size: cover;  background-position: center;  background-repeat: no-repeat;  filter: grayscale(30%) brightness(0.6);  position: relative;}/* Dark overlay for better text contrast */.hero-two-photos::before {  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: var(--color-background);  opacity: 0.4;  z-index: 1;  pointer-events: none;}/* Centered Title */.hero-two-photos__title {  position: absolute;  top: 50%;  left: 50%;  transform: translate(-50%, -50%);  z-index: 2;  font-size: clamp(4rem, 12vw, 8rem);  font-weight: 900;  letter-spacing: 0.1em;  text-transform: uppercase;  color: var(--color-text);  text-align: center;  white-space: nowrap;}/* Responsive - Tablet */@media (max-width: 1024px) {  .hero-two-photos {    height: 60vh;    min-height: 450px;  }    .hero-two-photos__title {    font-size: clamp(3rem, 10vw, 6rem);  }}/* Responsive - Mobile */@media (max-width: 768px) {  .hero-two-photos {    height: 50vh;    min-height: 400px;    grid-template-columns: 1fr;    grid-template-rows: 1fr 1fr;  }    .hero-two-photos__title {    font-size: clamp(2.5rem, 12vw, 4rem);  }}/* ============================================   HERO SECTION COMPONENT   ============================================ *//* Hero Component Variables - Centralized Configuration */:root {  /* Layout positioning */  --hero-content-top: 10px;  --hero-content-max-width: 600px;  --hero-content-max-width-md: 450px;  --hero-content-max-width-sm: 400px;    /* Title underline */  --hero-underline-width: 340px;  --hero-underline-height: 10px;  --hero-underline-pattern-size: 50px;    /* Text stretch ratio */  --hero-stretch-ratio: 1.6;    /* Warping orb sizes - scale up with viewport but stay within section bounds */  --hero-orb-size: 900px;  --hero-orb-inner-size: 700px;  --hero-orb-size-laptop: 650px;  --hero-orb-inner-size-laptop: 500px;  --hero-orb-size-lg: 1000px; /* Moderate increase for 1440px+ */  --hero-orb-inner-size-lg: 750px;  --hero-orb-size-xl: 1150px; /* Conservative increase for 1920px+ */  --hero-orb-inner-size-xl: 850px;  --hero-orb-size-xxl: 1300px; /* Max size for extra large displays */  --hero-orb-inner-size-xxl: 950px;  --hero-orb-size-mobile: 600px;  --hero-orb-inner-size-mobile: 400px;    /* Firefox-specific orb size */  --hero-orb-firefox: 1300px;    /* Mobile paddings */  --hero-mobile-padding-top: 320px;  --hero-mobile-padding-top-md: 400px;    /* Top black gradient strip */  --hero-top-strip-height: 250px;}.hero {  min-height: 100vh;  display: block;  background: transparent;  position: relative;  overflow: hidden; /* Keep contained, no scrollbars */  padding-top: 64px;  padding-bottom: var(--space-md);}/* Background Video */.hero__video {  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  object-fit: cover;  object-position: center center;  z-index: 0;  pointer-events: none;  opacity: 0.75; /* Subtle background presence */}/* Small wave at top - navbar color */.hero__top-wave {  position: absolute;  top: 0;  left: -10%;  width: 120%;  height: 150px;  background: var(--color-background);  z-index: 1;  pointer-events: none;  -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 150" preserveAspectRatio="none"><defs><filter id="blur-top"><feGaussianBlur in="SourceGraphic" stdDeviation="8" /></filter></defs><path d="M0,0 L1200,0 L1200,100 Q1050,130 900,100 T600,100 T300,100 T0,100 Z" fill="black" filter="url(%23blur-top)"/></svg>');  -webkit-mask-size: 100% 100%;  -webkit-mask-repeat: no-repeat;  mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 150" preserveAspectRatio="none"><defs><filter id="blur-top"><feGaussianBlur in="SourceGraphic" stdDeviation="8" /></filter></defs><path d="M0,0 L1200,0 L1200,100 Q1050,130 900,100 T600,100 T300,100 T0,100 Z" fill="black" filter="url(%23blur-top)"/></svg>');  mask-size: 100% 100%;  mask-repeat: no-repeat;}/* Bigger wave at bottom - navbar color, positioned to look like it extends */.hero__bottom-wave {  position: absolute;  bottom: -150px; /* Position lower to create illusion of extension */  left: -10%;  width: 120%;  height: 450px; /* Taller wave */  background: var(--color-background);  z-index: 1;  pointer-events: none;  transform: scaleX(-1);  -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 450" preserveAspectRatio="none"><defs><filter id="blur-bottom"><feGaussianBlur in="SourceGraphic" stdDeviation="8" /></filter></defs><path d="M0,450 L1200,450 L1200,100 Q1050,70 900,100 T600,100 T300,100 T0,100 Z" fill="black" filter="url(%23blur-bottom)"/></svg>');  -webkit-mask-size: 100% 100%;  -webkit-mask-repeat: no-repeat;  mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 450" preserveAspectRatio="none"><defs><filter id="blur-bottom"><feGaussianBlur in="SourceGraphic" stdDeviation="8" /></filter></defs><path d="M0,450 L1200,450 L1200,100 Q1050,70 900,100 T600,100 T300,100 T0,100 Z" fill="black" filter="url(%23blur-bottom)"/></svg>');  mask-size: 100% 100%;  mask-repeat: no-repeat;}/* Black solid box at top - page-wide background behind text/buttons */.hero__top-gradient {  position: absolute;  top: -104px;  left: -10%;  width: 120%;  height: calc(var(--hero-top-strip-height) + 64px + 180px);  background: var(--color-background);  z-index: 1;  pointer-events: none;  transform: scaleY(-1);  -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="-100 -100 1400 700" preserveAspectRatio="none"><path d="M0,0 L1200,0 L1200,370 Q1050,410 900,370 T600,370 T300,370 T0,370 Z" fill="black"/></svg>');  -webkit-mask-size: 100% 100%;  -webkit-mask-repeat: no-repeat;  mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="-100 -100 1400 700" preserveAspectRatio="none"><path d="M0,0 L1200,0 L1200,370 Q1050,410 900,370 T600,370 T300,370 T0,370 Z" fill="black"/></svg>');  mask-size: 100% 100%;  mask-repeat: no-repeat;}/* Page-wide bar at bottom - matches mission section color */.hero__bottom-bar {  position: absolute;  bottom: -200px;  left: -10%;  width: 120%;  height: calc(var(--hero-top-strip-height) / 4 + 380px);  background: var(--color-surface);  z-index: 1;  pointer-events: none;  transform: scaleY(-1);  -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="-100 -100 1400 700" preserveAspectRatio="none"><path d="M0,500 L1200,500 L1200,130 Q1050,90 900,130 T600,130 T300,130 T0,130 Z" fill="black"/></svg>');  -webkit-mask-size: 100% 100%;  -webkit-mask-repeat: no-repeat;  mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="-100 -100 1400 700" preserveAspectRatio="none"><path d="M0,500 L1200,500 L1200,130 Q1050,90 900,130 T600,130 T300,130 T0,130 Z" fill="black"/></svg>');  mask-size: 100% 100%;  mask-repeat: no-repeat;}/* Overlay waves on top of orb - 40% opacity */.hero__top-gradient-overlay {  position: absolute;  top: -104px;  left: -10%;  width: 120%;  height: calc(var(--hero-top-strip-height) + 64px + 180px);  background: var(--color-background);  z-index: 2;  pointer-events: none;  opacity: 0.4;  transform: scaleY(-1);  -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="-100 -100 1400 700" preserveAspectRatio="none"><path d="M0,0 L1200,0 L1200,370 Q1050,410 900,370 T600,370 T300,370 T0,370 Z" fill="black"/></svg>');  -webkit-mask-size: 100% 100%;  -webkit-mask-repeat: no-repeat;  mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="-100 -100 1400 700" preserveAspectRatio="none"><path d="M0,0 L1200,0 L1200,370 Q1050,410 900,370 T600,370 T300,370 T0,370 Z" fill="black"/></svg>');  mask-size: 100% 100%;  mask-repeat: no-repeat;}.hero__bottom-bar-overlay {  position: absolute;  bottom: -200px;  left: -10%;  width: 120%;  height: calc(var(--hero-top-strip-height) / 4 + 380px);  background: var(--color-surface);  z-index: 2;  pointer-events: none;  opacity: 0.4;  transform: scaleY(-1);  -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="-100 -100 1400 700" preserveAspectRatio="none"><path d="M0,500 L1200,500 L1200,130 Q1050,90 900,130 T600,130 T300,130 T0,130 Z" fill="black"/></svg>');  -webkit-mask-size: 100% 100%;  -webkit-mask-repeat: no-repeat;  mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="-100 -100 1400 700" preserveAspectRatio="none"><path d="M0,500 L1200,500 L1200,130 Q1050,90 900,130 T600,130 T300,130 T0,130 Z" fill="black"/></svg>');  mask-size: 100% 100%;  mask-repeat: no-repeat;}.hero::before {  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  /* More vibrant background gradients - colors play in background */  background: radial-gradient(circle at 25% 50%, var(--color-primary-20) 0%, transparent 60%),              radial-gradient(circle at 75% 50%, var(--color-primary-15) 0%, transparent 60%),              radial-gradient(circle at 50% 25%, var(--color-secondary-15) 0%, transparent 50%);  pointer-events: none;  z-index: 0;}.hero::after {  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: linear-gradient(180deg, transparent 0%, var(--color-background-60) 100%);  pointer-events: none;  z-index: 0;  /* Subtle darkening to ensure white text stays readable */  opacity: 0.6;}.hero__title::before {  content: '';  position: absolute;  left: 0;  top: 0;  width: 100%;  height: 100%;  background: var(--gradient-tech-art);  filter: blur(40px);  opacity: 0.15;  z-index: -1;  animation: gradientShift 8s ease infinite;  /* Subtle colored glow behind text */}/* Warping Orb Effect - Vibrant Background Colors *//* S-Tier Performance: GPU-accelerated, 60fps optimized */.warping-orb {  position: absolute;  top: 50%;  left: 50%;  width: var(--hero-orb-size);  height: var(--hero-orb-size);  transform: translate(-50%, -50%) translateZ(0);  border-radius: 50%;  pointer-events: none;  z-index: 2;  mix-blend-mode: screen;  animation: warpOrb 12s ease-in-out infinite;  /* Performance Optimized: Reduced blur from 90px to 60px for better performance */  filter: blur(60px);  opacity: 0.75;  /* Performance Optimized: Only set will-change when actually animating */  will-change: transform;  /* S-Tier: GPU acceleration for 60fps */  backface-visibility: hidden;  /* Performance Optimized: Removed perspective (expensive) */  /* perspective: 1000px; */  contain: layout style paint;  /* Firefox compatibility */  -moz-transform: translate(-50%, -50%) translateZ(0);  -moz-filter: blur(60px);  transform-origin: center center;}.warping-orb::before {  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  /* Vibrant color play - pink to purple */  background: radial-gradient(    circle at 35% 35%,    var(--color-primary) 0%,    var(--color-secondary) 40%,    var(--color-secondary) 70%,    transparent 100%  );  border-radius: 50%;  opacity: 0.85;  animation: orbGlow 8s ease-in-out infinite;  transform-origin: center center;  /* S-Tier: GPU acceleration for 60fps */  transform: translateZ(0);  will-change: transform, opacity;  backface-visibility: hidden;  contain: layout style paint;}.warping-orb::after {  content: '';  position: absolute;  top: 15%;  right: 15%;  width: var(--hero-orb-inner-size);  height: var(--hero-orb-inner-size);  /* Vibrant color play - cyan to blue */  background: radial-gradient(    circle at 65% 65%,    var(--color-primary) 0%,    var(--color-secondary) 45%,    var(--color-secondary) 75%,    transparent 100%  );  border-radius: 50%;  opacity: 0.65;  /* Performance Optimized: Reduced blur from 70px to 50px for better performance */  filter: blur(50px);  -moz-filter: blur(50px);  animation: orbShift 10s ease-in-out infinite;  transform-origin: center center;  /* S-Tier: GPU acceleration for 60fps */  transform: translateZ(0);  will-change: transform, opacity;  backface-visibility: hidden;  contain: layout style paint;}/* Firefox-specific fixes - Performance optimized */@supports (-moz-appearance: none) {  /* Allow the purple circle to extend beyond hero container */  .hero {    overflow: visible !important;  }    /* Repurpose the warping orb as a static pulsating background circle */  .warping-orb {    display: block !important;    width: var(--hero-orb-firefox) !important;    height: var(--hero-orb-firefox) !important;    filter: blur(70px) !important;    mix-blend-mode: normal !important;    background: radial-gradient(circle 650px at 50% 50%,       var(--color-secondary-20) 0%,      var(--color-secondary-20) 25%,      var(--color-secondary-20) 40%,      var(--color-secondary-20) 55%,      var(--color-secondary-20) 70%,      var(--color-secondary-10) 82%,      transparent 92%) !important;    animation: purplePulse 6s ease-in-out infinite !important;    transform-origin: center center;    z-index: 0 !important;  }    .warping-orb::before,  .warping-orb::after {    display: none;  }    /* Create Chrome-like overlapping orbs for Firefox */  .hero::before {    background:       /* Pink orb - slightly left of center */      radial-gradient(ellipse 500px 600px at 42% 50%,         var(--color-primary-20) 0%,        var(--color-primary-25) 30%,        transparent 70%),      /* Cyan orb - right side */      radial-gradient(ellipse 480px 580px at 58% 48%,         rgba(0, 212, 255, 0.35) 0%,        rgba(0, 212, 255, 0.2) 30%,        transparent 70%),      /* Purple orb - center/top for blending */      radial-gradient(ellipse 450px 550px at 50% 45%,         var(--color-secondary-15) 0%,        var(--color-secondary-15) 35%,        transparent 65%);    opacity: 1;    filter: none;    animation: firefoxOrbPulse 25s ease-in-out infinite;  }    /* Subtle overlay gradient */  .hero::after {    background: linear-gradient(180deg, transparent 0%, var(--color-background-40) 85%, var(--color-background) 100%);    opacity: 0.7;  }    /* Disable animations on title glow for Firefox */  .hero__title::before {    animation: none;    filter: none;    opacity: 0;  }    /* Mobile adjustments for Firefox */  @media (max-width: 768px) {    .hero::before {      background:         radial-gradient(ellipse 280px 360px at 42% 50%,           var(--color-primary-20) 0%,          transparent 70%),        radial-gradient(ellipse 260px 340px at 58% 48%,           rgba(0, 212, 255, 0.35) 0%,          transparent 70%),        radial-gradient(ellipse 240px 320px at 50% 45%,           var(--color-secondary-15) 0%,          transparent 65%);    }  }}/* Gentle pulsating animation for static purple circle */@keyframes purplePulse {  0%, 100% {    opacity: 1;    transform: translate(-50%, -50%) scale(1);  }  50% {    opacity: 0.7;    transform: translate(-50%, -50%) scale(1.08);  }}/* Subtle rotating pulse animation for Firefox orbs */@keyframes firefoxOrbPulse {  0% {    opacity: 1;    transform: scale(1) rotate(0deg);  }  50% {    opacity: 0.85;    transform: scale(1.03) rotate(180deg);  }  100% {    opacity: 1;    transform: scale(1) rotate(360deg);  }}/* Reduced motion preference - pause animation */@media (prefers-reduced-motion: reduce) {  .warping-orb,  .warping-orb::before,  .warping-orb::after {    animation: none !important;  }    .hero__title::before {    animation: none;  }    .hero::before {    animation: none;  }}.hero__container {  position: relative;  z-index: 2;  width: 100%;  min-height: calc(100vh - 64px);  padding: 0;}/* Laptop screens - reduce orb size */@media (max-width: 1439px) {  .warping-orb {    width: var(--hero-orb-size-laptop);    height: var(--hero-orb-size-laptop);  }    .warping-orb::after {    width: var(--hero-orb-inner-size-laptop);    height: var(--hero-orb-inner-size-laptop);  }}@media (min-width: 1440px) {  .hero__title {    font-size: clamp(3rem, 5vw, 5.5rem);  }    .warping-orb {    width: var(--hero-orb-size-lg);    height: var(--hero-orb-size-lg);  }    .warping-orb::after {    width: var(--hero-orb-inner-size-lg);    height: var(--hero-orb-inner-size-lg);  }}@media (min-width: 1920px) {  .hero__title {    font-size: clamp(3.5rem, 4vw, 5rem);  }  .warping-orb {    width: var(--hero-orb-size-xl);    height: var(--hero-orb-size-xl);  }  .warping-orb::after {    width: var(--hero-orb-inner-size-xl);    height: var(--hero-orb-inner-size-xl);  }}/* Extra large displays (2K and above) */@media (min-width: 2560px) {  .hero__title {    font-size: clamp(4rem, 4.5vw, 6rem);  }  .warping-orb {    width: var(--hero-orb-size-xxl);    height: var(--hero-orb-size-xxl);  }  .warping-orb::after {    width: var(--hero-orb-inner-size-xxl);    height: var(--hero-orb-inner-size-xxl);  }}/* Left Section - Top Left Corner */.hero__container .hero__left {  position: absolute;  bottom: var(--space-xl);  left: var(--space-xl);  display: flex;  flex-direction: column;  align-items: flex-start;  gap: 0;  max-width: var(--hero-content-max-width);  z-index: 3;}.hero__intro {  font-size: clamp(1.33rem, 2.28vw, 2.03rem);  color: var(--color-text);  margin: 0;  font-weight: 600;  letter-spacing: 0.12em;  text-transform: uppercase;  transform: translateX(var(--glitch-offset, 0));  transition: transform 0.2s ease-out;  cursor: default;  user-select: none;  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);}.hero__location {  font-size: var(--text-lg);  color: var(--color-text);  margin: 0;  text-transform: uppercase;  letter-spacing: 0.15em;  font-weight: 500;  transform: translateX(var(--glitch-offset, 0));  transition: transform 0.2s ease-out;  cursor: default;  user-select: none;  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);}.hero__date {  font-size: var(--text-lg);  color: var(--color-text-secondary);  margin: 0;  font-weight: 400;  text-transform: uppercase;  letter-spacing: 0.1em;  transform: translateX(var(--glitch-offset, 0));  transition: transform 0.2s ease-out;  cursor: default;  user-select: none;  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);}.hero__date:hover {  --glitch-offset: 2px;}.hero__title {  font-size: clamp(3.5rem, 8vw, 6.5rem);  font-weight: 800;  line-height: 0.95;  margin: 0;  margin-top: -0.5rem;  color: var(--color-text);  position: relative;  letter-spacing: -0.02em;  text-transform: uppercase;  text-shadow:     0 2px 8px rgba(0, 0, 0, 0.5),    0 0 40px rgba(0, 0, 0, 0.3);  display: flex;  flex-direction: column;  align-items: flex-start;  gap: 0;  text-align: left;}.hero__title-line {  display: block;  position: relative;  transition: transform 0.2s ease-out;  cursor: default;  transform: translateX(var(--glitch-offset, 0));  user-select: none;  white-space: nowrap;  text-align: left;}.hero__title-line:nth-child(2) {  transform: translateX(var(--glitch-offset, 0)) scaleX(var(--hero-stretch-ratio));  transform-origin: left;  position: relative;}.hero__title-underline {  display: block;  width: var(--hero-underline-width);  height: var(--hero-underline-height);  background-image: url('../../assets/images/squiggly-underline.svg');  background-repeat: repeat-x;  background-size: var(--hero-underline-pattern-size) var(--hero-underline-height);  margin-top: 5px;  transform: translateX(var(--glitch-offset, 0)) scaleX(var(--hero-stretch-ratio));  transform-origin: left;  transition: transform 0.2s ease-out;  cursor: default;  user-select: none;}.hero__title-line:hover {  --glitch-offset: 3px;}.hero__title-line:nth-child(2):hover {  transform: translateX(var(--glitch-offset, 0)) scaleX(var(--hero-stretch-ratio));}/* Right Section - Top Right Corner */.hero__container .hero__right {  position: absolute;  bottom: var(--space-xl);  right: var(--space-xl);  display: flex;  flex-direction: column;  align-items: flex-end;  gap: var(--space-md);  max-width: var(--hero-content-max-width);  z-index: 3;}.hero__tagline-wrapper {  display: flex;  flex-direction: column;  align-items: flex-end;  gap: 0;}.hero__tagline-line {  font-size: var(--text-2xl);  color: var(--color-text);  line-height: 1.6;  margin: 0;  text-align: right;  font-weight: 400;  letter-spacing: 0.01em;  transform: translateX(var(--glitch-offset, 0));  transition: transform 0.2s ease-out;  cursor: default;  user-select: none;  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);}.hero__buttons {  display: flex;  gap: var(--space-md);  flex-wrap: nowrap;  justify-content: flex-end;  width: 100%;}.hero__buttons .button {  flex: 1;}.hero__group-ticket {  display: flex;  flex-direction: column;  align-items: flex-end;  gap: var(--space-xs);  width: 100%;}.hero__group-ticket .button {  width: 100%; /* Match the full width of the two buttons above */}.hero__group-ticket-note {  font-size: var(--text-xs);  color: var(--color-text-secondary);  margin: 0;  font-style: italic;  text-align: right;}/* Breakout Game Canvas */.breakout-canvas {  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  pointer-events: auto;  z-index: 10;  /* Performance optimizations */  will-change: transform;  transform: translateZ(0); /* GPU acceleration */  backface-visibility: hidden;  image-rendering: optimizeSpeed; /* Faster rendering */}/* Responsive Design */@media (max-width: 1280px) {  .hero__container .hero__left {    bottom: var(--space-lg);    left: var(--space-lg);    max-width: var(--hero-content-max-width-md);  }  .hero__container .hero__right {    bottom: var(--space-lg);    right: var(--space-lg);    max-width: var(--hero-content-max-width-sm);  }}@media (max-width: 1024px) {  .hero__container .hero__left {    bottom: var(--space-md);    left: var(--space-md);    max-width: var(--hero-content-max-width-sm);  }  .hero__container .hero__right {    position: static;    margin: 0 auto;    align-items: center;    max-width: 100%;    padding: var(--space-xl);    padding-top: var(--hero-mobile-padding-top-md);  }    .hero__tagline-wrapper {    align-items: center;  }    .hero__tagline-line {    text-align: center;  }    .hero__buttons {    justify-content: center;  }    .hero__group-ticket {    align-items: center;  }    .hero__group-ticket-note {    text-align: center;  }}@media (max-width: 768px) {  .hero__container .hero__left {    bottom: var(--space-md);    left: var(--space-md);    max-width: calc(100% - var(--space-xl));  }    .hero__intro {    font-size: var(--text-lg);  }    .hero__title {    font-size: clamp(2.5rem, 10vw, 4rem);  }    .hero__location,  .hero__date {    font-size: var(--text-base);  }    .hero__container .hero__right {    padding: var(--space-md);    padding-top: var(--hero-mobile-padding-top);  }    .hero__tagline-line {    font-size: var(--text-lg);  }    .hero__buttons {    flex-direction: column;    width: 100%;  }    .hero__buttons .button {    width: 100%;  }    .hero__group-ticket .button {    width: 100%;  }    .warping-orb {    width: var(--hero-orb-size-mobile);    height: var(--hero-orb-size-mobile);    filter: blur(60px);  }    .warping-orb::after {    width: var(--hero-orb-inner-size-mobile);    height: var(--hero-orb-inner-size-mobile);    filter: blur(40px);  }}/* ==========================================   INVESTOR CARDS - BEM Component   ========================================== *//* Block: Investor Card */.investor-card {    padding: var(--space-xl);    border-radius: var(--radius-md);    text-align: center;    position: relative;    overflow: hidden;    border-width: 1px;    border-style: solid;    transition: all 0.3s ease;    min-height: 140px;    display: flex;    flex-direction: column;    justify-content: center;    align-items: center;}.investor-card:hover {    transform: translateY(-5px);    box-shadow: 0 10px 40px var(--color-primary-15);}/* Modifier: Pink gradient */.investor-card--pink {    background: linear-gradient(135deg, var(--color-primary-10), var(--color-primary-10));    border-color: var(--color-primary-15);}/* Modifier: Blue gradient */.investor-card--blue {    background: linear-gradient(135deg, var(--color-primary-10), var(--color-secondary-10));    border-color: rgba(0, 212, 255, 0.3);}/* Modifier: Purple gradient */.investor-card--purple {    background: linear-gradient(135deg, var(--color-secondary-10), var(--color-primary-10));    border-color: var(--color-secondary-15);}/* Element: Card glow effect */.investor-card__glow {    position: absolute;    top: -50%;    right: -50%;    width: 200%;    height: 200%;    opacity: 0;    transition: opacity 0.3s ease;    pointer-events: none;}.investor-card__glow--pink {    background: radial-gradient(circle, var(--color-primary-20) 0%, transparent 70%);}.investor-card__glow--blue {    background: radial-gradient(circle, rgba(0, 212, 255, 0.2) 0%, transparent 70%);}.investor-card__glow--purple {    background: radial-gradient(circle, var(--color-secondary-20) 0%, transparent 70%);}.investor-card:hover .investor-card__glow {    opacity: 1;}/* Element: Card title */.investor-card__title {    font-size: var(--text-xl);    font-weight: 700;    position: relative;    z-index: 1;    margin-bottom: var(--space-xs);    margin-top: 0;    color: var(--color-text);}/* Modifier: Title colors */.investor-card__title--pink {    color: var(--color-text);}.investor-card__title--blue {    color: var(--color-text);}.investor-card__title--gradient {    color: var(--color-text);    background: none;    -webkit-background-clip: unset;    -webkit-text-fill-color: unset;    background-clip: unset;}.investor-card__title--large {    font-size: var(--text-lg);}/* Element: Card description */.investor-card__description {    color: var(--color-text-secondary);    font-size: var(--text-sm);    margin-top: var(--space-xs);    margin-bottom: 0;    position: relative;    z-index: 1;}/* Block: Investor Grid */.investor-grid {    display: grid;    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));    gap: var(--space-xl);    max-width: 1200px;    margin: 0 auto;    padding: var(--space-xl) 0;}@media (max-width: 768px) {    .investor-grid {        grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));        gap: var(--space-lg);    }}@media (max-width: 480px) {    .investor-grid {        grid-template-columns: 1fr;        gap: var(--space-md);    }}/* Block: Section with background glow */.section__bg-glow {    position: absolute;    inset: 0;    background: radial-gradient(circle at 50% 50%, var(--color-primary-10) 0%, transparent 70%);    pointer-events: none;}.section__content--relative {    position: relative;    z-index: 1;}/* ============================================   NAVIGATION COMPONENT   ============================================ */.header {  position: fixed;  top: 0;  left: 0;  width: 100%;  background: var(--color-background);  z-index: var(--z-fixed);}.header::before {  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 2px;  background: linear-gradient(90deg, transparent, var(--color-primary), var(--color-secondary), var(--color-primary), transparent);  background-size: 200% 100%;  animation: gradientShift 3s ease infinite;}.nav {  display: flex;  align-items: center;  justify-content: space-between;  padding: var(--space-sm) 0;  gap: var(--space-lg);}.nav__left {  display: flex;  align-items: center;  gap: var(--space-md);  text-decoration: none;  color: var(--color-text);  transition: color 0.3s ease-out;}.nav__left:hover {  color: var(--color-secondary);}.nav__left:hover .nav__event-info {  color: var(--color-secondary);  opacity: 1;}.nav__left:hover .nav__divider {  color: var(--color-secondary);  opacity: 1;}.nav__left:hover .nav__logo-image {  filter: brightness(0) saturate(100%) invert(88%) sepia(50%) saturate(500%) hue-rotate(45deg) brightness(105%);}.nav__event-info {  display: flex;  flex-direction: column;  align-items: flex-start;  gap: 0px;  font-size: 0.65rem;  font-weight: 500;  text-transform: uppercase;  letter-spacing: 0.05em;  color: var(--color-text);  opacity: 0.8;}.nav__date {  white-space: nowrap;  line-height: 1.1;}.nav__location {  display: flex;  flex-direction: column;  gap: 0;  white-space: nowrap;  line-height: 1.1;}.nav__divider {  display: block;  width: 100%;  color: var(--color-text);  opacity: 0.6;  transition: color 0.3s ease-out, opacity 0.3s ease-out;}.nav__divider svg {  display: block;  width: 100%;  height: 6px;}.nav__logo {  display: flex;  align-items: center;  flex-shrink: 0;}.nav__logo-image {  height: 28px;  width: auto;  display: block;  filter: brightness(0) invert(1);  transition: filter 0.3s ease-out;}.nav__toggle {  display: none;  flex-direction: column;  justify-content: center;  align-items: center;  width: 48px;  height: 48px;  background: none;  border: none;  cursor: pointer;  padding: 0;  z-index: 101;  transition: all 0.3s ease;  position: relative;  margin-left: auto;}.nav__toggle:hover {  /* No background or border change on hover */}.nav__toggle:active {  transform: scale(0.95);}.hamburger-line {  width: 24px;  height: 2.5px;  background: var(--color-primary);  border-radius: 3px;  transition: all 0.35s ease;  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);  position: absolute;}/* Position each line absolutely for precise control */.hamburger-line:nth-child(1) {  top: 14px;}.hamburger-line:nth-child(2) {  top: 50%;  transform: translateY(-50%);}.hamburger-line:nth-child(3) {  bottom: 14px;}.nav__menu {  display: flex;  align-items: center;  gap: var(--space-xs);  list-style: none;  margin: 0;  padding: 0;  flex-wrap: nowrap;}.nav__menu li {  margin: 0;  padding: 0;}.nav__link {  color: var(--color-text);  font-weight: 500;  font-size: var(--text-sm);  padding: var(--space-xs) var(--space-md);  border-radius: var(--radius-md);  transition: all var(--transition-fast);  white-space: nowrap;  display: block;  position: relative;  text-transform: uppercase;}.nav__link::before {  content: '';  position: absolute;  bottom: 0;  left: 50%;  width: 0;  height: 2px;  background: linear-gradient(90deg, var(--color-primary), var(--color-secondary));  transform: translateX(-50%);  transition: width var(--transition-normal);  border-radius: var(--radius-full);}.nav__link:hover {  color: var(--color-primary);  transform: translateY(-1px);}.nav__link:hover::before {  width: 80%;}/* S-Tier: Enhanced Focus Indicators (WCAG AAA) */.nav__link:focus-visible {  outline: 3px solid var(--color-secondary);  outline-offset: 3px;  box-shadow: 0 0 0 1px var(--color-background), 0 0 0 4px var(--color-secondary);  border-radius: var(--radius-md);}.nav__link--active {  color: var(--color-primary);}.nav__link--active::before {  width: 80%;}.nav__link--cta {  background: var(--color-primary);  color: var(--color-text);  padding: var(--space-xs) var(--space-lg);  box-shadow: var(--shadow-glow-subtle);  margin-left: var(--space-sm);  font-weight: 600;  position: relative;  overflow: hidden;  z-index: 1;}.nav__link--cta::before {  display: none;}.nav__link--cta::after {  content: '';  position: absolute;  top: 50%;  left: 50%;  width: 0;  height: 0;  border-radius: 50%;  background: rgba(255, 255, 255, 0.2);  transform: translate(-50%, -50%);  transition: width 0.4s ease, height 0.4s ease;  z-index: 0;}.nav__link--cta:hover::after {  width: 200px;  height: 200px;}.nav__link--cta:hover {  background: var(--color-secondary);  color: var(--color-text);  box-shadow: var(--shadow-glow-green), var(--shadow-md);  transform: none;}.nav__link--cta:focus-visible {  outline: 3px solid var(--color-secondary);  outline-offset: 3px;  box-shadow: 0 0 0 1px var(--color-background), 0 0 0 4px var(--color-secondary), var(--shadow-glow);}/* Dropdown Navigation */.nav__item {  position: relative;}.nav__item--dropdown {  position: relative;}.nav__dropdown-toggle {  display: flex;  align-items: center;  gap: 4px;  background: none;  border: none;  cursor: pointer;  font-family: inherit;}.nav__dropdown-icon {  transition: transform var(--transition-fast);  flex-shrink: 0;}.nav__dropdown-toggle[aria-expanded="true"] .nav__dropdown-icon {  transform: rotate(180deg);}.nav__dropdown {  position: absolute;  top: calc(100% + 8px);  left: 0;  min-width: 200px;  background: var(--color-surface);  border: 1px solid var(--color-border);  border-radius: var(--radius-md);  box-shadow: var(--shadow-xl);  padding: var(--space-xs) 0;  list-style: none;  margin: 0;  opacity: 0;  visibility: hidden;  transform: translateY(-8px);  transition: opacity var(--transition-fast), transform var(--transition-fast), visibility var(--transition-fast);  z-index: 100;  backdrop-filter: blur(12px);}.nav__item--dropdown:hover .nav__dropdown,.nav__dropdown-toggle[aria-expanded="true"] + .nav__dropdown {  opacity: 1;  visibility: visible;  transform: translateY(0);}.nav__dropdown li {  margin: 0;  padding: 0;}.nav__dropdown-link {  display: block;  padding: var(--space-sm) var(--space-md);  color: var(--color-text);  font-size: var(--text-sm);  font-weight: 500;  transition: all var(--transition-fast);  white-space: nowrap;  position: relative;  text-transform: uppercase;}.nav__dropdown-link:hover {  background: var(--color-primary-05);  color: var(--color-primary);  padding-left: calc(var(--space-md) + 4px);}.nav__dropdown-link::before {  content: '';  position: absolute;  left: 0;  top: 50%;  transform: translateY(-50%);  width: 0;  height: 60%;  background: var(--color-primary);  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;  transition: width var(--transition-fast);}.nav__dropdown-link:hover::before {  width: 3px;}/* Tablet Navigation */@media (max-width: 1280px) {  .nav {    gap: var(--space-md);  }    .nav__event-info {    display: none;  }  .nav__menu {    gap: var(--space-sm);  }    .nav__link {    font-size: var(--text-xs);    padding: var(--space-xs) var(--space-sm);  }    .nav__link--cta {    padding: var(--space-xs) var(--space-md);  }}/* Mobile & Tablet Navigation */@media (max-width: 1280px) {  .nav {    padding: var(--space-md) 0;  }    .nav__logo-image {    height: 26px;  }    .nav__toggle {    display: flex;  }    .nav__menu {    position: fixed;    top: 64px;    left: 0;    width: 100%;    flex-direction: column;    background: var(--color-surface);    padding: var(--space-xl);    gap: var(--space-sm);    transform: translateX(-100%);    transition: transform var(--transition-normal);    border-bottom: 1px solid var(--color-border);    box-shadow: var(--shadow-xl);    align-items: stretch;    max-height: calc(100vh - 64px);    overflow-y: auto;  }    .nav__menu--open {    transform: translateX(0);  }    .nav__menu li {    width: 100%;  }    .nav__link {    width: 100%;    text-align: left;    padding: var(--space-md);    font-size: var(--text-base);    border-radius: var(--radius-md);  }    .nav__link--cta {    margin-left: 0;    text-align: center;    margin-top: var(--space-sm);  }    /* Premium X transformation */  .nav__toggle[aria-expanded="true"] .hamburger-line:nth-child(1) {    top: 50%;    transform: translateY(-50%) rotate(45deg);  }    .nav__toggle[aria-expanded="true"] .hamburger-line:nth-child(2) {    opacity: 0;    transform: translateY(-50%) scale(0);  }    .nav__toggle[aria-expanded="true"] .hamburger-line:nth-child(3) {    bottom: 50%;    transform: translateY(50%) rotate(-45deg);  }    /* No background or border change when open */  .nav__toggle[aria-expanded="true"] {    /* Clean look - no background or border */  }    /* Mobile dropdown styles */  .nav__item--dropdown {    width: 100%;  }    .nav__dropdown-toggle {    width: 100%;    justify-content: space-between;    padding: var(--space-md);    font-size: var(--text-base);  }    .nav__dropdown {    position: static;    transform: none;    margin: 0;    padding: 0;    background: var(--color-background);    border: none;    box-shadow: none;    max-height: 0;    overflow: hidden;    transition: max-height var(--transition-normal);  }    .nav__dropdown-toggle[aria-expanded="true"] + .nav__dropdown {    max-height: 500px;    opacity: 1;    visibility: visible;  }    .nav__dropdown-link {    padding: var(--space-sm) var(--space-lg);    font-size: var(--text-sm);  }}/* S-Tier: Reduced Motion Support (WCAG AAA) */@media (prefers-reduced-motion: reduce) {  .hamburger-line,  .nav__toggle,  .nav__link,  .nav__link--cta,  .nav__dropdown-link {    transition: none;  }    .nav__link:hover,  .nav__link--cta:hover {    transform: none;  }    .nav__link::before {    transition: none;  }    .nav__link--cta::after {    transition: none;  }    .nav__link--cta:hover::after {    width: 0;    height: 0;  }    .nav__dropdown {    transition: opacity var(--transition-fast), visibility var(--transition-fast), transform none;  }}/* ==========================================   PARTNER GRID - BEM Component Enhancement   ========================================== *//* Element: Grid Item Title */.partner-grid__item__title {    font-size: var(--text-xl);    font-weight: 700;    margin-bottom: var(--space-sm);    color: var(--color-text);}/* Element: Grid Item Text */.partner-grid__item__text {    font-size: var(--text-sm);    color: var(--color-text-secondary);    line-height: 1.6;}/* After-party specific areas */.after-party-area {    background: var(--color-surface);    padding: var(--space-xl);    border-radius: var(--radius-lg);    border-width: 2px;    border-style: solid;    transition: all var(--transition-normal);}.after-party-area--pink {    border-color: var(--color-primary-15);}.after-party-area--blue {    border-color: var(--color-primary-15);}.after-party-area--purple {    border-color: var(--color-secondary-15);}.after-party-area:hover {    transform: translateY(-2px);    border-color: var(--color-primary);}/* ============================================   PHOTO GRID COMPONENT   Flexible grid layouts for event photos   ============================================ *//* 2x2 Grid Layout */.photo-grid {  width: 100%;  display: grid;  grid-template-columns: repeat(2, 1fr);  gap: 2px;  background: var(--color-background);  position: relative;}.photo-grid__item {  width: 100%;  height: 300px;  background-size: cover;  background-position: center;  background-repeat: no-repeat;  filter: grayscale(20%) brightness(0.8);  opacity: 0.7;  position: relative;  overflow: hidden;}/* Gradient overlay for blend */.photo-grid__item::before {  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: linear-gradient(135deg, transparent 60%, var(--color-background) 100%);  opacity: 0.3;  pointer-events: none;}/* 3-Column Grid Variant */.photo-grid--three-col {  grid-template-columns: repeat(3, 1fr);}.photo-grid--three-col .photo-grid__item {  height: 250px;}/* 2-Column Grid Variant */.photo-grid--two-col {  grid-template-columns: repeat(2, 1fr);}.photo-grid--two-col .photo-grid__item {  height: 320px;}/* Tall Variant */.photo-grid--tall .photo-grid__item {  height: 450px;}/* Responsive - Tablet */@media (max-width: 1024px) {  .photo-grid__item {    height: 250px;  }    .photo-grid--three-col {    grid-template-columns: repeat(2, 1fr);  }    .photo-grid--three-col .photo-grid__item:last-child {    grid-column: span 2;  }    .photo-grid--two-col .photo-grid__item {    height: 280px;  }    .photo-grid--tall .photo-grid__item {    height: 380px;  }}/* Responsive - Mobile */@media (max-width: 768px) {  .photo-grid {    grid-template-columns: 1fr;  }    .photo-grid__item {    height: 220px;  }    .photo-grid--three-col,  .photo-grid--two-col {    grid-template-columns: 1fr;  }    .photo-grid--three-col .photo-grid__item:last-child {    grid-column: span 1;  }    .photo-grid--two-col .photo-grid__item {    height: 220px;  }    .photo-grid--tall .photo-grid__item {    height: 300px;  }}/* ============================================   PHOTO PORTRAIT COMPONENT   Tall portrait-style photo grid   ============================================ *//* Portrait Photo Grid - Displays tall photos */.photo-portrait {  width: 100%;  display: grid;  grid-template-columns: repeat(2, 1fr);  gap: 2px;  background: var(--color-background);  position: relative;}.photo-portrait__item {  width: 100%;  height: 500px;  background-size: cover;  background-position: center;  background-repeat: no-repeat;  filter: grayscale(20%) brightness(0.8);  opacity: 0.7;  position: relative;  overflow: hidden;}/* Gradient overlay for blend */.photo-portrait__item::before {  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: linear-gradient(180deg, transparent 60%, var(--color-background) 100%);  opacity: 0.3;  pointer-events: none;}/* Responsive - Tablet */@media (max-width: 1024px) {  .photo-portrait__item {    height: 400px;  }}/* Responsive - Mobile */@media (max-width: 768px) {  .photo-portrait {    grid-template-columns: 1fr;  }    .photo-portrait__item {    height: 350px;  }}/* ============================================   PHOTO STRIP COMPONENT   Visual divider showcasing event atmosphere   ============================================ *//* Photo Strip Section */.photo-strip {  width: 100%;  height: 180px;  display: flex;  overflow: hidden;  opacity: 0.6;  position: relative;}/* Individual Photo Container */.photo-strip__image {  flex: 1;  background-size: cover;  background-position: center 30%;  background-repeat: no-repeat;  filter: grayscale(20%) brightness(0.8);  position: relative;}/* Specific positioning for each photo to prioritize faces */.photo-strip__image:nth-child(1) {  background-position: 40% 35%;}.photo-strip__image:nth-child(2) {  background-position: 50% 30%;}.photo-strip__image:nth-child(3) {  background-position: 30% 40%;}.photo-strip__image:nth-child(4) {  background-position: 60% 35%;}/* Overlay to blend with design */.photo-strip::before {  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: linear-gradient(90deg,     var(--color-background) 0%,     transparent 10%,     transparent 90%,     var(--color-background) 100%);  pointer-events: none;  z-index: 1;}/* Tall variant for group photos */.photo-strip--tall {  height: 350px;}@media (max-width: 1024px) {  .photo-strip--tall {    height: 280px;  }}@media (max-width: 768px) {  .photo-strip--tall {    height: 220px;  }}/* Responsive - Tablet */@media (max-width: 1024px) {  .photo-strip {    height: 150px;  }}/* Responsive - Mobile */@media (max-width: 768px) {  .photo-strip {    height: 120px;    opacity: 0.5;  }}/* ==========================================   SCHEDULE & INFO SECTIONS - BEM Component   ========================================== *//* Block: Schedule Overview */.schedule-overview {    max-width: 600px;    margin: 0 auto;    text-align: left;}.schedule-overview__title {    color: var(--color-primary);    margin-bottom: var(--space-md);    font-size: var(--text-xl);}.schedule-overview__items {    margin-bottom: var(--space-lg);}.schedule-overview__item {    color: var(--color-text-secondary);    margin-bottom: var(--space-xs);}.schedule-overview__item:last-child {    margin-bottom: 0;}.schedule-overview__item strong {    color: var(--color-primary);}/* Block: Info Box (for tickets, exhibitors, etc.) */.info-box {    border-left-width: 3px;    border-left-style: solid;    padding-left: var(--space-xl);}.info-box--pink {    border-left-color: var(--color-primary);}.info-box--blue {    border-left-color: var(--color-primary);}.info-box--purple {    border-left-color: var(--color-secondary);}.info-box--spaced {    margin-bottom: var(--space-3xl);}.info-box__title {    font-size: var(--text-2xl);    margin-bottom: var(--space-lg);    font-weight: 700;    color: var(--color-text);}.info-box__title--pink {    color: var(--color-text);}.info-box__title--blue {    color: var(--color-text);}.info-box__title--purple {    color: var(--color-text);}.info-box__action {    margin-top: var(--space-xl);}/* Block: Exhibitor Grid */.exhibitor-grid {    display: grid;    gap: var(--space-2xl);    margin-bottom: var(--space-3xl);}/* Block: Exhibitor Card */.exhibitor-card {    padding: var(--space-2xl);    border-radius: var(--radius-lg);    border-width: 2px;    border-style: solid;}.exhibitor-card--pink {    background: var(--color-primary-05);    border-color: var(--color-primary-15);}.exhibitor-card--blue {    background: var(--color-accent-05);    border-color: var(--color-primary-15);}.exhibitor-card__title {    font-size: var(--text-xl);    margin-bottom: var(--space-md);    font-weight: 700;    color: var(--color-text);}.exhibitor-card__title--pink {    color: var(--color-text);}.exhibitor-card__title--blue {    color: var(--color-text);}.exhibitor-card__text {    font-size: var(--text-lg);    line-height: 1.8;    margin-bottom: var(--space-md);}.exhibitor-card__text:last-child {    margin-bottom: 0;}.exhibitor-card__text strong {    color: var(--color-primary);}/* Utility: Highlight text */.text-highlight--pink {    color: var(--color-primary);}/* ==========================================   SECTIONS - BEM Component   Layout containers and section wrappers   ========================================== *//* Block: Section */.section {    padding: var(--space-3xl) 0;    position: relative;}/* Modifier: Dark Section */.section--dark {    background: var(--color-background);    color: var(--color-text);}/* Modifier: Light Section */.section--light {    background: var(--color-surface);    color: var(--color-text);}/* Element: Section Container */.section__container {    max-width: 1280px;    margin: 0 auto;    padding: 0 var(--space-md);}/* Element: Section Title */.section__title {    font-size: var(--text-3xl);    font-weight: 700;    margin-bottom: var(--space-xl);    text-align: center;    text-transform: uppercase;}/* Element: Section Subtitle */.section__subtitle {    font-size: var(--text-xl);    margin-bottom: var(--space-lg);    text-align: center;    color: var(--color-text-secondary);}/* Element: Section Description */.section__description {    font-size: var(--text-base);    line-height: 1.7;    color: var(--color-text-secondary);    max-width: 700px;    margin: 0 auto;    text-align: center;}/* Modifier: Wide Description */.section__description--wide {    max-width: 900px;}/* Modifier: Left-aligned */.section__title--left,.section__subtitle--left,.section__description--left {    text-align: left;}/* Block: Speakers Section */.speakers {    /* Inherits from .section */}/* Element: Speakers Title *//* S-Tier: Consistent typographic scale - Secondary section titles use clamp(2rem, 5vw, 3rem) */.speakers__title {    font-size: clamp(2rem, 5vw, 3rem);    margin-bottom: var(--space-md);    font-weight: 700;    text-transform: uppercase;}/* Element: Speakers Description */.speakers__description {    color: var(--color-text-secondary);    font-size: var(--text-lg);}/* Note: .speakers__grid is defined in sections.css with full responsive grid layout *//* ============================================   S-TIER TYPOGRAPHIC SCALE CONSISTENCY   ============================================   Orlando Standard: Consistent typographic hierarchy across all headings      Scale Hierarchy:   - Hero/Large Titles: clamp(3rem, 8vw, 6rem) - For sponsor names, hero titles   - Main Section Titles: clamp(2.5rem, 6vw, 4rem) - For mission, tickets, primary sections   - Secondary Section Titles: clamp(2rem, 5vw, 3rem) - For speakers, subsections      Font Weight: 600-700 for headers (Orlando Standard)   ============================================ *//* Block: Sponsor Section *//* Element: Sponsor Heading *//* Orlando Standard: Main/hero scale clamp(2.5rem, 6vw, 3.75rem) *//* Element: Sponsor Name (official card) *//* Element: Sponsor Label *//* Element: Sponsor Description *//* Block: Tickets Section */.tickets {    /* Inherits from .section */}/* Element: Tickets Title *//* S-Tier: Consistent typographic scale - Main section titles use clamp(2.5rem, 6vw, 4rem) */.tickets__title {    font-size: clamp(2.5rem, 6vw, 4rem);    /* Orlando Standard: Font weights 600-700 for headers (reduced from 900) */    font-weight: 700;    margin-bottom: var(--space-xl);    color: #ffffff;}/* Element: Tickets Description */.tickets__description {    font-size: var(--text-xl);    color: #5bf590;    margin-bottom: var(--space-2xl);}/* Element: Tickets Actions */.tickets__actions {    display: flex;    gap: var(--space-lg);    justify-content: center;    flex-wrap: wrap;}/* ============================================   SECTIONS COMPONENTS   ============================================ */.mission,.mission {  background: var(--color-surface);  position: relative;  overflow: hidden;  text-align: center;}.mission .morphing-blob {  position: absolute;  width: 400px;  height: 400px;  top: 10%;  right: 5%;  z-index: 0;}.mission::before {  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: radial-gradient(circle at 20% 50%, var(--color-primary-10) 0%, transparent 50%),              radial-gradient(circle at 80% 50%, var(--color-secondary-08) 0%, transparent 50%);  pointer-events: none;}.mission::after {  content: '';  position: absolute;  top: 0;  right: 0;  width: 500px;  height: 500px;  background: var(--gradient-primary);  opacity: 0.03;  border-radius: 50%;  filter: blur(80px);  pointer-events: none;}.mission .artistic-grid {  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background-image:     linear-gradient(var(--color-primary-10) 1px, transparent 1px),    linear-gradient(90deg, var(--color-primary-10) 1px, transparent 1px);  background-size: 150px 150px;  opacity: 0.3;  pointer-events: none;  z-index: 0;  mix-blend-mode: soft-light;}.mission .container {  position: relative;  z-index: 1;}.mission__title {  /* Orlando Standard: Fluid typography with clamp() - H2 section heading */  /* Reference: Tonik Design System H2 = 48px / 3rem, Orlando recommends clamp() for responsiveness */  /* S-Tier: Consistent typographic scale - Main section titles use clamp(2.5rem, 6vw, 4rem) */  font-size: clamp(2.5rem, 6vw, 4rem);  margin-bottom: var(--space-lg);  background: var(--gradient-primary);  -webkit-background-clip: text;  -webkit-text-fill-color: transparent;  background-clip: text;  position: relative;  animation: gradientShift 10s ease infinite;  /* Orlando Standard: Font weights 600-700 for headers */  font-weight: 700;  letter-spacing: -0.02em;  /* Orlando Standard: Line-height 1.15 for headlines */  line-height: 1.15;  text-transform: uppercase;}/* Hero sections: Make mission__title white instead of gradient */.mission--header-offset .mission__title,.section--dark .mission__title:first-child {  color: var(--color-text);  background: none;  -webkit-background-clip: unset;  -webkit-text-fill-color: unset;  background-clip: unset;  animation: none;}/* S-Tier: Precise underline positioning - matches exact width of "Tonik" word */.mission__title-word {  display: inline-block;  position: relative;  /* White text, no gradient */  color: var(--color-text);}.mission__title-logo {  height: 0.78em;  width: auto;  display: inline-block;  vertical-align: baseline;  margin: 0 0.05em 0.03em 0.05em;  filter: brightness(0) saturate(100%) invert(100%);}/* Remove underline when logo is present */.mission__title-word:has(.mission__title-logo)::after {  display: none;}.mission__title-word::after {  display: none;}.mission__subtitle {  font-size: var(--text-2xl);  margin-bottom: var(--space-lg);  color: var(--color-text);  font-weight: 600;}.mission__description {  font-size: var(--text-lg);  color: var(--color-text-secondary);  max-width: 800px;  margin-bottom: var(--space-2xl);  line-height: 1.8;  font-weight: 400;}.mission__links-wrapper {  width: 100%;  padding-inline: var(--space-md);}.mission__links {  display: flex;  gap: var(--space-lg);  justify-content: center;  flex-wrap: wrap;}.mission__links .button {  position: relative;  overflow: hidden;  transform-style: preserve-3d;  transition: all var(--transition-normal);}.mission__links .button::before {  content: '';  position: absolute;  top: 50%;  left: 50%;  width: 0;  height: 0;  border-radius: 50%;  background: var(--color-primary-20);  transform: translate(-50%, -50%);  transition: width 0.6s ease, height 0.6s ease;  z-index: 0;}.mission__links .button:hover::before {  width: 300px;  height: 300px;}.mission__links .button:hover {  transform: translateY(-2px) scale(1.02);  box-shadow: 0 8px 20px var(--color-primary-20);}.speakers {  background: rgba(10, 10, 15, 0.5);  position: relative;  overflow: hidden;}.speakers .morphing-blob {  position: absolute;  width: 300px;  height: 300px;  bottom: 10%;  left: 5%;  z-index: 0;}.speakers::before {  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: radial-gradient(circle at 80% 50%, var(--color-primary-08) 0%, transparent 50%),              radial-gradient(circle at 20% 50%, var(--color-secondary-08) 0%, transparent 50%);  pointer-events: none;}.speakers::after {  content: '';  position: absolute;  bottom: 0;  left: 0;  width: 400px;  height: 400px;  background: var(--gradient-secondary);  opacity: 0.03;  border-radius: 50%;  filter: blur(80px);  pointer-events: none;}.speakers .lofi-texture {  display: none;}.speakers .container {  position: relative;  z-index: 1;  width: 90vw !important;  max-width: 90vw !important;  margin-left: auto !important;  margin-right: auto !important;  padding-left: var(--space-xl);  padding-right: var(--space-xl);}.speakers__title {  font-size: var(--text-4xl);  margin-bottom: var(--space-md);  background: var(--gradient-secondary);  background-size: 200% 200%;  -webkit-background-clip: text;  -webkit-text-fill-color: transparent;  background-clip: text;  text-align: center;  position: relative;  animation: gradientShift 10s ease infinite;  font-weight: 700;  letter-spacing: -0.02em;}.speakers__subtitle {  font-size: var(--text-xl);  color: var(--color-text-secondary);  text-align: center;  margin-bottom: var(--space-3xl);}.speakers__grid {  display: grid;  grid-template-columns: repeat(4, 1fr);  gap: var(--space-lg);  margin: 0 auto var(--space-2xl) auto;  align-items: start;  justify-items: stretch;}@media (min-width: 1600px) {  .speakers__grid {    gap: var(--space-xl);  }}@media (min-width: 1920px) {  .speakers__grid {    gap: var(--space-2xl);  }}@media (max-width: 1280px) {  .speakers__grid {    grid-template-columns: repeat(3, 1fr);  }}@media (max-width: 900px) {  .speakers__grid {    grid-template-columns: repeat(2, 1fr);  }}.speaker-card {  padding: var(--space-md);  text-align: center;  color: var(--color-text);  font-size: var(--text-base);  transition: all var(--transition-normal);  border-radius: var(--radius-md);  border: 1px solid transparent;  position: relative;  /* CRITICAL: Needed for overlay positioning */}/* Detailed Speaker Cards with Images */.speaker-card--detailed {  background: var(--color-surface);  border: 1px solid var(--color-border);  padding: 0;  overflow: hidden;  display: flex;  flex-direction: column;  height: 100%;}.speaker-card__image {  width: 100%;  aspect-ratio: 4 / 3;  background: linear-gradient(135deg, var(--color-primary-10), var(--color-primary-10));  position: relative;  overflow: hidden;}/* Removed pink circle overlay */.speaker-card__content {  padding: var(--space-lg);  display: flex;  flex-direction: column;  gap: var(--space-sm);  flex-grow: 1;}.speaker-card__name {  font-size: var(--text-lg);  font-weight: 600;  color: var(--color-text); /* White */  background-clip: text;  line-height: 1.3;}.speaker-card__talk {  font-size: var(--text-sm);  color: var(--color-text-secondary);  line-height: 1.5;  flex-grow: 1;}.speaker-card__button {  margin-top: var(--space-sm);  padding: var(--space-sm) var(--space-md);  background: transparent;  border: 1px solid var(--color-secondary);  color: var(--color-secondary);  border-radius: var(--radius-sm);  font-size: var(--text-sm);  font-weight: 500;  cursor: pointer;  transition: all var(--transition-fast);  align-self: center;}.speaker-card__button:hover {  background: var(--color-secondary);  color: white;  transform: translateX(4px);}.speaker-card--hidden {  display: none;}.speakers__grid.show-all .speaker-card--hidden {  display: block;}.speakers__note {  text-align: center;  color: var(--color-text-secondary);  padding: var(--space-2xl);}#speakers-toggle {  display: flex;  margin: 0 auto;}/* Sponsor Section - Orlando standard *//* Ensure sponsor CTAs stay consistently styled across all pages */}  }@media (max-width: 768px) {}.founders {  background: var(--color-surface);  position: relative;}.founders::before {  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: radial-gradient(circle at 50% 50%, var(--color-secondary-10) 0%, transparent 50%),              radial-gradient(circle at 30% 70%, var(--color-primary-08) 0%, transparent 50%),              radial-gradient(circle at 70% 30%, var(--color-secondary-05) 0%, transparent 50%);  pointer-events: none;}.founders__title {  font-size: var(--text-4xl);  margin-bottom: var(--space-3xl);  background: var(--gradient-primary);  background-size: 200% 200%;  -webkit-background-clip: text;  -webkit-text-fill-color: transparent;  background-clip: text;  text-align: center;  position: relative;  animation: gradientShift 10s ease infinite;  font-weight: 700;  letter-spacing: -0.02em;}.founders__grid {  display: grid;  grid-template-columns: repeat(auto-fill, minmax(220px, 280px));  gap: var(--space-xl);  max-width: 1400px;  margin: 0 auto;  justify-content: center;}/* Removed old grid-column rules for new responsive layout */@media (max-width: 900px) {  .founders__grid {    grid-template-columns: repeat(2, 1fr);    max-width: 640px;    gap: var(--space-xl);  }}@media (max-width: 640px) {  .founders__grid {    grid-template-columns: 1fr;    gap: var(--space-lg);  }}.founder-card {  background: rgba(21, 21, 32, 0.8);  backdrop-filter: blur(10px);  padding: 0;  border-radius: var(--radius-lg);  border: 2px solid var(--color-primary-15);  text-align: center;  transition: all var(--transition-normal);  position: relative;  overflow: hidden;  cursor: pointer;  width: 100%;  display: flex;  flex-direction: column;  align-items: center;  text-decoration: none;  color: inherit;}.founder-card::before {  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: linear-gradient(180deg, var(--color-primary-15) 0%, var(--color-secondary-20) 100%);  opacity: 1;  transition: opacity var(--transition-normal);  pointer-events: none;  z-index: 0;  border-radius: inherit;}.founder-card::after {  content: '';  position: absolute;  top: 50%;  left: 50%;  width: 400%;  height: 400%;  transform: translate(-50%, -50%);  background: conic-gradient(    from 0deg,    var(--color-primary-25) 0%,    var(--color-secondary-20) 12%,    var(--color-primary-15) 24%,    var(--color-secondary-12) 36%,    var(--color-primary-10) 48%,    var(--color-secondary-08) 60%,    var(--color-primary-06) 72%,    transparent 95%  );  opacity: 0;  transition: opacity var(--transition-normal);  animation: rotate 3s linear infinite;  z-index: 0;}.founder-card:hover::after {  opacity: 1;}.founder-card:hover {  border-color: var(--color-primary);  box-shadow: 0 0 25px var(--color-primary-20);  transform: translateY(-3px) scale(1.02);}.founder-card:hover::before {  opacity: 1;}.founder-card__image {  width: 100%;  height: 100%;  position: relative;  z-index: 2;  overflow: hidden;}.founder-card__image img {  width: 100%;  height: 100%;  object-fit: cover;}.founder-card__name {  font-size: var(--text-xl);  font-weight: 700;  color: var(--color-text); /* White */  position: relative;  z-index: 2;  margin-bottom: var(--space-sm);  margin-top: var(--space-lg);  padding: 0 var(--space-lg);  transition: transform var(--transition-fast);}.founder-card__role {  font-size: var(--text-sm);  color: var(--color-secondary);  font-weight: 600;  position: relative;  z-index: 2;  margin-bottom: var(--space-xs);  padding: 0 var(--space-lg);  text-transform: uppercase;  letter-spacing: 0.05em;}.founder-card__company {  font-size: var(--text-base);  color: var(--color-text-secondary);  position: relative;  z-index: 2;  margin-bottom: var(--space-md);  padding: 0 var(--space-lg);  line-height: 1.5;}.founder-card__email {  font-size: var(--text-sm);  color: var(--color-primary);  position: relative;  z-index: 2;  transition: color var(--transition-fast);  margin: 0 0 var(--space-lg) 0;  padding: 0 var(--space-lg);}.founder-card:hover .founder-card__name {  transform: scale(1.05);}.founder-card:hover .founder-card__email {  color: var(--color-primary);}@keyframes rotate {  from {    transform: rotate(0deg);  }  to {    transform: rotate(360deg);  }}.contact {  background: rgba(10, 10, 15, 0.5);  text-align: center;  position: relative;}.contact::before {  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: radial-gradient(circle at 50% 50%, var(--color-secondary-08) 0%, transparent 50%),              radial-gradient(circle at 30% 70%, var(--color-primary-06) 0%, transparent 50%);  pointer-events: none;}.contact__title {  font-size: var(--text-4xl);  margin-bottom: var(--space-2xl);  background: linear-gradient(135deg, var(--color-secondary) 0%, var(--color-secondary) 50%, var(--color-primary) 100%);  background-size: 200% 200%;  -webkit-background-clip: text;  -webkit-text-fill-color: transparent;  background-clip: text;  position: relative;  animation: gradientShift 10s ease infinite;  font-weight: 700;  letter-spacing: -0.02em;}.contact__info {  display: flex;  flex-direction: column;  align-items: center;  gap: var(--space-md);  margin-bottom: var(--space-xl);}.contact__email,.contact__phone {  font-size: var(--text-lg);  color: var(--color-text);  text-decoration: none;  transition: all var(--transition-fast);  display: inline-block;}.contact__email:hover,.contact__phone:hover {  color: var(--color-secondary);  opacity: 0.9;}.contact__address {  margin-bottom: var(--space-xl);  color: var(--color-text-secondary);  line-height: 1.8;}.contact__social {  display: flex;  gap: var(--space-lg);  justify-content: center;}.social-link {  color: var(--color-text-secondary);  text-decoration: none;  transition: all var(--transition-normal);  padding: var(--space-sm) var(--space-md);  border-radius: var(--radius-md);  font-weight: 500;}.social-link {  position: relative;  overflow: hidden;}.social-link::before {  content: '';  position: absolute;  top: 0;  left: -100%;  width: 100%;  height: 100%;  background: linear-gradient(90deg, transparent, var(--color-primary-10), transparent);  transition: left 0.5s ease;}.social-link:hover::before {  left: 100%;}.social-link:hover {  color: var(--color-secondary);  background: var(--color-surface);  transform: translateY(-2px);  box-shadow: 0 0 15px var(--color-secondary-20);}.footer {  background: linear-gradient(180deg,     rgba(10, 10, 15, 0.4) 0%,     var(--color-primary-08) 50%,    rgba(10, 10, 15, 0.6) 100%  );  backdrop-filter: blur(20px);  border-top: 1px solid var(--color-primary-15);  padding: var(--space-3xl) 0 var(--space-xl);  position: relative;  overflow: hidden;}.footer::before {  content: '';  position: absolute;  top: -50%;  left: -50%;  width: 200%;  height: 200%;  background: radial-gradient(    circle at 20% 50%,    var(--color-primary-15) 0%,    transparent 50%  ),  radial-gradient(    circle at 80% 50%,    var(--color-primary-10) 0%,    transparent 50%  );  animation: footerGlow 20s ease-in-out infinite;  pointer-events: none;  z-index: 0;}@keyframes footerGlow {  0%, 100% {    transform: translate(0, 0) scale(1);    opacity: 0.5;  }  50% {    transform: translate(10%, 5%) scale(1.1);    opacity: 0.8;  }}.footer > .container {  position: relative;  z-index: 1;}.footer__content {  display: grid;  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));  gap: var(--space-3xl);  margin-bottom: var(--space-3xl);  text-align: left;}.footer__section {  display: flex;  flex-direction: column;  gap: var(--space-md);}.footer__heading {  font-size: var(--text-xl);  font-weight: 700;  margin: 0;  background: linear-gradient(135deg, var(--color-secondary) 0%, var(--color-secondary) 50%, var(--color-primary) 100%);  background-size: 200% 200%;  -webkit-background-clip: text;  -webkit-text-fill-color: transparent;  background-clip: text;  animation: gradientShift 10s ease infinite;}.footer__heading-small {  color: var(--color-secondary);  font-size: var(--text-base);  font-weight: 600;  margin: 0;  text-transform: uppercase;  letter-spacing: 0.05em;}.footer__contact {  display: flex;  flex-direction: column;  gap: var(--space-sm);}.footer__email,.footer__phone {  font-size: var(--text-lg);  font-weight: 500;}.footer__address {  font-style: normal;  color: var(--color-text-secondary);  line-height: 1.6;}.footer__address p {  margin: 0;}.footer__address-link {  text-decoration: none;  display: block;}.footer__address-link:hover {  color: var(--color-primary);}.footer__address-link:hover p {  color: var(--color-primary);}.footer__social {  display: flex;  flex-direction: column;  gap: var(--space-sm);}.footer__copyright {  color: var(--color-text-secondary);  font-size: var(--text-sm);  margin: 0;  text-align: center;  padding-top: var(--space-xl);  border-top: 1px solid var(--color-primary-10);}.footer__link {  color: var(--color-primary);  text-decoration: none;  transition: all var(--transition-fast);}.footer__link:hover {  color: var(--color-primary);  text-decoration: underline;}/* S-Tier: Enhanced Focus Indicators (WCAG AAA) */.footer__link:focus-visible {  outline: 3px solid var(--color-secondary);  outline-offset: 3px;  box-shadow: 0 0 0 1px var(--color-background);  border-radius: var(--radius-sm);}/* Footer mobile responsive */@media (max-width: 768px) {  .footer {    padding: var(--space-2xl) 0 var(--space-lg);  }    .footer__content {    grid-template-columns: 1fr;    gap: var(--space-2xl);    text-align: center;  }    .footer__section {    align-items: center;  }    .footer__contact,  .footer__social {    align-items: center;  }}/* S-Tier: Reduced Motion Support (WCAG AAA) */@media (prefers-reduced-motion: reduce) {  .footer__link {    transition: none;  }    .footer__link:hover {    text-decoration: underline;  }    .footer::before {    animation: none;  }    .footer__heading {    animation: none;  }}@media (max-width: 768px) {  .mission__links {    grid-template-columns: 1fr;  }      .speakers__grid {    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));    gap: var(--space-md);  }    .speaker-card {    font-size: var(--text-sm);    padding: var(--space-sm);  }}@media (min-width: 1920px) {  .founders__grid {    max-width: 850px;  }    .speakers__grid {    max-width: 1400px;  }}/* ============================================   ALTERNATING SECTION BACKGROUNDS   ============================================ *//* Dark sections - semi-transparent to show body effects */.section--dark {  background: rgba(10, 10, 15, 0.6) !important;}/* Light sections - semi-transparent elevated surface */.section--light {  background: rgba(21, 21, 32, 0.7) !important;}/* Speaker Modal Styles */.modal {  position: fixed;  top: 0;  left: 0;  width: 100%;  height: 100%;  z-index: 9999;  opacity: 0;  pointer-events: none;  transition: opacity var(--transition-normal);}.modal--active {  opacity: 1;  pointer-events: all;}.modal__overlay {  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: rgba(0, 0, 0, 0.85);  backdrop-filter: blur(10px);}.modal__container {  position: absolute;  top: 50%;  left: 50%;  transform: translate(-50%, -50%);  width: 90%;  max-width: 700px;  max-height: 80vh;  background: var(--color-surface);  border: 1px solid var(--color-primary-30);  border-radius: var(--radius-lg);  padding: var(--space-2xl);  overflow-y: auto;  box-shadow: 0 20px 60px var(--color-primary-20);}.modal__close {  position: absolute;  top: var(--space-lg);  right: var(--space-lg);  background: transparent;  border: none;  color: var(--color-text);  font-size: 2rem;  line-height: 1;  cursor: pointer;  padding: 0;  width: 40px;  height: 40px;  display: flex;  align-items: center;  justify-content: center;  border-radius: var(--radius-sm);  transition: all var(--transition-fast);}.modal__close:hover {  background: var(--color-primary-10);  color: var(--color-primary);  transform: rotate(90deg);}.modal__header {  display: flex;  gap: var(--space-xl);  margin-bottom: var(--space-xl);  align-items: flex-start;}.modal__photo {  width: 120px;  height: 120px;  border-radius: var(--radius-md);  object-fit: cover;  flex-shrink: 0;  border: 2px solid var(--color-primary-30);}.modal__header-content {  flex: 1;  min-width: 0;}.modal__title {  font-size: var(--text-2xl);  margin-bottom: var(--space-xs);  background: linear-gradient(135deg, var(--color-primary), var(--color-primary));  -webkit-background-clip: text;  -webkit-text-fill-color: transparent;  background-clip: text;  padding-right: var(--space-3xl);  line-height: 1.3;}.modal__title-org {  font-size: var(--text-base);  color: var(--color-text-secondary);  margin-bottom: var(--space-sm);  line-height: 1.5;}.modal__subtitle {  font-size: var(--text-lg);  color: var(--color-secondary);  margin-bottom: 0;  font-weight: 500;  line-height: 1.5;}.modal__content {  font-size: var(--text-base);  color: var(--color-text);  line-height: 1.8;}.modal__content p {  margin-bottom: var(--space-md);}.modal__content p:last-child {  margin-bottom: 0;}.modal__talk-description {  margin-bottom: var(--space-xl);  padding-bottom: var(--space-xl);  border-bottom: 1px solid var(--color-primary-20);}.modal__talk-description p {  margin-bottom: var(--space-sm);}.modal__talk-description strong {  color: var(--color-secondary);  font-weight: 600;}.modal__bio {  margin-top: var(--space-lg);}.modal__bio p {  margin-bottom: var(--space-md);}@media (max-width: 768px) {  .modal__container {    width: 95%;    padding: var(--space-xl);    max-height: 90vh;  }  .modal__header {    flex-direction: column;    gap: var(--space-lg);    align-items: center;    text-align: center;  }  .modal__photo {    width: 100px;    height: 100px;  }  .modal__header-content {    width: 100%;  }  .modal__title {    font-size: var(--text-xl);    padding-right: var(--space-2xl);  }  .modal__title-org {    font-size: var(--text-sm);  }  .modal__subtitle {    font-size: var(--text-base);  }  .modal__close {    top: var(--space-md);    right: var(--space-md);  }}/* ============================================   TICKETS WITH PHOTOS COMPONENT   Two side-by-side photos behind centered text   ============================================ *//* Container */.tickets-with-photos {  position: relative;  width: 100%;  min-height: 600px;  display: grid;  grid-template-columns: 1fr 1fr 1fr;  background: var(--color-background);  overflow: hidden;}/* Photos - Side by Side */.tickets-with-photos__photo {  width: 100%;  height: 100%;  min-height: 600px;  background-size: cover;  background-position: center 80%;  background-repeat: no-repeat;  filter: grayscale(20%) brightness(0.8);  opacity: 0.7;  position: relative;}/* Color overlay for blend */.tickets-with-photos__photo::before {  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: var(--color-background);  opacity: 0.3;  pointer-events: none;}/* Content Overlay */.tickets-with-photos__content {  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  display: flex;  align-items: center;  justify-content: center;  z-index: 2;  padding: var(--space-4xl) 0;  text-align: center;}/* Responsive - Tablet */@media (max-width: 1024px) {  .tickets-with-photos {    min-height: 500px;  }    .tickets-with-photos__photo {    min-height: 500px;  }}/* Responsive - Mobile */@media (max-width: 768px) {  .tickets-with-photos {    grid-template-columns: 1fr;    grid-template-rows: 1fr 1fr 1fr;    min-height: 500px;  }    .tickets-with-photos__photo {    min-height: 167px;  }}/* ============================================   SPEAKER CARD BEM - Orlando Architecture   ============================================   Clean, maintainable speaker/artist card component   following BEM methodology and Orlando principles.   ============================================ *//* Block: Base card structure */.speaker-card-bem {  position: relative;  background: var(--color-primary-05);  border: 2px solid var(--color-primary-15);  border-radius: var(--radius-lg);  overflow: hidden;  transition: all var(--transition-normal);  display: flex;  flex-direction: column;  height: 100%;  padding: 0;  opacity: 1;}/* When card is a link */a.speaker-card-bem {  text-decoration: none;  color: inherit;  cursor: pointer;}a.speaker-card-bem:hover {  text-decoration: none;  color: inherit;}/* S-Tier: Enhanced Focus Indicators (WCAG AAA) */a.speaker-card-bem:focus-visible {  outline: 3px solid var(--color-secondary);  outline-offset: 3px;  box-shadow: 0 0 0 1px var(--color-background), 0 0 0 4px var(--color-secondary);  border-radius: var(--radius-lg);}/* Modifier: Speaker variant (pink/purple gradient) */.speaker-card-bem--speaker {  /* Inherits base styles */}/* Modifier: Artist variant (cyan/blue gradient) */.speaker-card-bem--artist {  background: var(--color-accent-05);  border: 2px solid var(--color-primary-15);}/* Element: Gradient overlay */.speaker-card-bem__overlay {  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  z-index: 1;  pointer-events: none;  border-radius: inherit;}/* Modifier: Speaker overlay (pink/purple gradient) */.speaker-card-bem__overlay--speaker {  background: linear-gradient(180deg, var(--color-primary-15) 0%, var(--color-secondary-20) 100%);}/* Modifier: Artist overlay (cyan/blue gradient) */.speaker-card-bem__overlay--artist {  background: linear-gradient(180deg, var(--color-primary-15) 0%, var(--color-secondary-20) 100%);}/* Element: Image container */.speaker-card-bem__image-container {  position: relative;  width: 100%;  aspect-ratio: 1 / 1;  overflow: hidden;  z-index: 0;}/* Element: Image *//* S-Tier Performance: CLS prevention with explicit dimensions */.speaker-card-bem__image {  width: 100%;  height: 100%;  object-fit: cover;  display: block;  /* Prevent layout shift - maintain aspect ratio */  aspect-ratio: 1 / 1;  /* S-Tier: GPU acceleration for smooth rendering */  transform: translateZ(0);  will-change: transform;}/* Element: Content container */.speaker-card-bem__content {  position: relative;  z-index: 2;  padding: var(--space-lg);  display: flex;  flex-direction: column;  gap: var(--space-sm);  flex-grow: 1;  background: transparent;  text-align: center;}/* Element: Label (Speaker/Artist) */.speaker-card-bem__label {  font-size: var(--text-sm);  font-weight: 600;  margin-bottom: var(--space-sm);  text-transform: uppercase;  letter-spacing: 0.05em;}/* Modifier: Speaker label */.speaker-card-bem__label--speaker {  color: var(--color-primary); /* Pink */}/* Modifier: Artist label */.speaker-card-bem__label--artist {  color: #5bf590;}/* Element: Speaker/Artist name */.speaker-card-bem__name {  font-size: var(--text-lg);  font-weight: 600;  color: var(--color-text); /* White */  line-height: 1.3;  margin: 0;  background-clip: text;}/* Element: Title/Organization */.speaker-card-bem__title {  font-size: var(--text-sm);  color: var(--color-text-secondary);  line-height: 1.4;  margin: 0;}/* Modifier: Artist name */.speaker-card-bem__name--artist {  color: var(--color-text);}/* Element: Talk/Performance description */.speaker-card-bem__talk {  font-size: var(--text-sm);  color: var(--color-text-secondary);  line-height: 1.5;  flex-grow: 1;  margin: 0;}/* Element: Action button */.speaker-card-bem__button {  margin-top: auto;  padding: var(--space-sm) var(--space-md);  background: transparent;  border: 1px solid var(--color-secondary);  color: var(--color-secondary);  border-radius: var(--radius-sm);  font-size: var(--text-sm);  font-weight: 500;  cursor: pointer;  transition: all var(--transition-fast);  align-self: center;}.speaker-card-bem__button:hover {  background: var(--color-secondary);  color: white;  transform: translateX(4px);}/* Card hover state - Removed per Orlando standards *//* S-Tier: Reduced Motion Support (WCAG AAA) */@media (prefers-reduced-motion: reduce) {  .speaker-card-bem {    transition: none;  }    .speaker-card-bem__button {    transition: none;  }    .speaker-card-bem__button:hover {    transform: none;  }}/* Responsive adjustments */@media (max-width: 768px) {  .speaker-card-bem__content {    padding: var(--space-md);  }    .speaker-card-bem__name {    font-size: var(--text-base);  }}/* ============================================   YEAR FILTER - BEM Component   Horizontal navigation bar style with dividers and arrows   ============================================ *//* Block: Year Filter Container */.year-filter {  display: flex;  justify-content: center;  align-items: stretch;  margin-bottom: var(--space-3xl);  margin-left: 0;  margin-right: 0;  background: transparent;  border: 1px solid var(--color-primary);  border-radius: var(--radius-full);  overflow: hidden;  width: 100%;  padding: 0;}/* Element: Filter Button */.year-filter__button {  flex: 1;  padding: var(--space-md) var(--space-lg);  border: none;  border-right: 1px solid var(--color-primary);  background: transparent;  color: var(--color-secondary);  font-size: var(--text-base);  font-weight: 500;  cursor: pointer;  transition: all var(--transition-fast);  font-family: var(--font-sans);  white-space: nowrap;  text-align: center;  position: relative;  display: flex;  align-items: center;  justify-content: center;  gap: var(--space-xs);}/* Remove border from last button */.year-filter__button:last-child {  border-right: none;}.year-filter__button:hover {  background: var(--color-primary-08);  color: var(--color-secondary);}/* Modifier: Active Filter Button */.year-filter__button--active {  background: var(--color-primary-15);  color: var(--color-primary);}.year-filter__button--active:hover {  background: var(--color-primary-20);  color: var(--color-primary);}/* Arrow indicator */.year-filter__button::after {  content: '→';  font-size: var(--text-base);  opacity: 0.8;  margin-left: var(--space-xs);}/* Hide arrow on last button (All) */.year-filter__button:last-child::after {  content: '';}/* Arrow color matches text color */.year-filter__button::after {  color: inherit;}/* Responsive adjustments */@media (max-width: 768px) {  .year-filter {    flex-wrap: wrap;    border-radius: var(--radius-full);    max-width: 100%;  }    .year-filter__button {    flex: 1 1 calc(50% - 1px);    border-right: 1px solid var(--color-primary);    border-bottom: 1px solid var(--color-primary);    padding: var(--space-sm) var(--space-md);    font-size: var(--text-sm);  }    .year-filter__button:nth-child(2n) {    border-right: none;  }    .year-filter__button:nth-last-child(-n+2) {    border-bottom: none;  }    .year-filter__button:last-child {    border-right: 1px solid var(--color-primary);  }}/* ============================================   ABOUT PAGE - Page-Specific Styles   Orlando BEM Architecture   ============================================ *//* ============================================   ABOUT HERO SECTION   ============================================ *//* Block: About Hero */.about-hero {  position: relative;  min-height: 70vh;  display: flex;  align-items: center;  justify-content: center;  padding-top: calc(80px + var(--space-3xl));  padding-bottom: var(--space-4xl);  overflow: hidden;  background: var(--color-background);}/* Element: About Hero Title */.about-hero__title {  font-size: clamp(3rem, 10vw, 7rem);  font-weight: 800;  text-transform: uppercase;  letter-spacing: -0.02em;  line-height: 0.95;  text-align: center;  position: relative;  z-index: 2;}/* Element: About Hero Title Word */.about-hero__title-word {  display: block;  background: linear-gradient(135deg, var(--color-primary), var(--color-secondary));  -webkit-background-clip: text;  -webkit-text-fill-color: transparent;  background-clip: text;  text-shadow: 0 4px 30px var(--color-primary-20);}/* Modifier: White Title Word */.about-hero__title-word--white {  background: none;  -webkit-background-clip: unset;  -webkit-text-fill-color: unset;  background-clip: unset;  color: var(--color-text);  text-shadow: 0 4px 30px rgba(0, 0, 0, 0.5);}/* Element: About Hero Logo */.about-hero__logo {  display: block;  width: auto;  height: clamp(3rem, 8vw, 6rem);  margin: var(--space-md) auto 0;  object-fit: contain;  filter: brightness(0) invert(1) drop-shadow(0 0 8px var(--color-primary-20));  transition: filter var(--transition-normal);}/* Element: About Hero Lead Text */.about-hero__lead {  font-size: clamp(1.125rem, 2vw, 1.375rem);  font-weight: 500;  line-height: 1.6;  color: var(--color-text);  position: relative;  z-index: 2;}/* Element: About Hero Accent Decorations */.about-hero__accent {  position: absolute;  width: 400px;  height: 400px;  border-radius: 50%;  pointer-events: none;  z-index: 1;  filter: blur(100px);  opacity: 0.4;  animation: floatAccent 8s ease-in-out infinite;}.about-hero__accent--left {  top: 10%;  left: -10%;  background: radial-gradient(circle, var(--color-primary) 0%, transparent 70%);}.about-hero__accent--right {  bottom: 10%;  right: -10%;  background: radial-gradient(circle, var(--color-primary) 0%, transparent 70%);  animation-delay: -4s;}@keyframes floatAccent {  0%, 100% {    transform: translate(0, 0) scale(1);  }  50% {    transform: translate(30px, -30px) scale(1.1);  }}/* ============================================   FOUNDERS SECTION   ============================================ *//* Block: Founders Section */.founders {  position: relative;}/* Element: Founders Title */.founders__title {  font-size: clamp(2rem, 5vw, 3.5rem);  font-weight: 800;  text-transform: uppercase;  text-align: center;  letter-spacing: -0.01em;  color: var(--color-text);  margin-bottom: var(--space-xl);}/* Element: Founders Grid */.founders__grid {  display: grid;  grid-template-columns: repeat(3, 1fr);  gap: var(--space-xl);  margin-top: var(--space-2xl);}/* Element: Mission Description Centered (Founders Section) */.mission__description--centered {  max-width: 900px;  margin-left: auto;  margin-right: auto;  text-align: center;}/* ============================================   THEME SECTIONS (Event History Years)   ============================================ *//* Block: Theme Section */.theme-section {  position: relative;  z-index: 2;}/* Element: Theme Section Title */.theme-section__title {  font-size: clamp(1.75rem, 4vw, 2.75rem);  font-weight: 800;  line-height: 1.2;  color: var(--color-text);  text-align: center;}/* Element: Theme Section Text */.theme-section__text {  font-size: clamp(1rem, 2vw, 1.25rem);  line-height: 1.7;  color: var(--color-text);  text-align: center;  max-width: 900px;  margin-left: auto;  margin-right: auto;}/* Modifier: Secondary Text (for light sections) */.theme-section__text--secondary {  color: var(--color-text-secondary);}/* Modifier: Last Text Block (removes bottom margin) */.theme-section__text--last {  margin-bottom: 0;}/* ============================================   EVENT COMPONENTS SECTION   ============================================ *//* Block: Event Components Grid */.event-components__grid {  display: grid;  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));  gap: var(--space-2xl);  margin-top: var(--space-3xl);}/* Block: Event Component Card */.event-component {  position: relative;  padding: var(--space-2xl);  background: var(--color-surface);  border-radius: var(--radius-lg);  border: 1px solid var(--color-primary-10);  transition: all var(--transition-normal);  overflow: hidden;}/* Pseudo-element: Subtle Background Glow */.event-component::before {  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: radial-gradient(    circle at top left,    var(--color-primary-05) 0%,    transparent 60%  );  pointer-events: none;  z-index: 0;  opacity: 0;  transition: opacity var(--transition-normal);}.event-component:hover::before {  opacity: 1;}.event-component:hover {  transform: translateY(-4px);  border-color: var(--color-primary-20);  box-shadow: 0 10px 30px var(--color-primary-15);}/* Modifier: Accent Variant */.event-component--accent {  border-color: var(--color-primary-10);}.event-component--accent::before {  background: radial-gradient(    circle at top left,    var(--color-primary-06) 0%,    transparent 60%  );}.event-component--accent:hover {  border-color: var(--color-primary-20);  box-shadow: 0 10px 30px var(--color-primary-15);}/* Modifier: Secondary Variant */.event-component--secondary {  border-color: var(--color-secondary-10);}.event-component--secondary::before {  background: radial-gradient(    circle at top left,    var(--color-secondary-08) 0%,    transparent 60%  );}.event-component--secondary:hover {  border-color: var(--color-secondary-20);  box-shadow: 0 10px 30px var(--color-secondary-15);}/* Element: Event Component Title */.event-component__title {  font-size: var(--text-2xl);  font-weight: 700;  margin-bottom: var(--space-md);  color: var(--color-text);  position: relative;  z-index: 1;}/* Modifier: Accent Title */.event-component__title--accent {  color: var(--color-text);}/* Modifier: Secondary Title */.event-component__title--secondary {  color: var(--color-text);}/* Element: Event Component Text */.event-component__text {  font-size: var(--text-base);  line-height: 1.7;  color: var(--color-text-secondary);  position: relative;  z-index: 1;}/* ============================================   CONTAINER MODIFIERS   ============================================ *//* Modifier: Narrow Container (for hero content) */.container--narrow {  max-width: 900px;}/* Modifier: Wide Container (for component grids) */.container--wide {  max-width: 1400px;}/* Utility: Max Width 1000 */.max-w-1000 {  max-width: 1000px;  margin-left: auto;  margin-right: auto;}/* ============================================   SECTION ALIGNMENT UTILITIES   ============================================ *//* Modifier: Right-Aligned Content */.section-content--align-right {  text-align: left;}/* Modifier: Center-Aligned Content */.section-content--align-center {  text-align: center;}/* ============================================   SPACING UTILITIES (About Page Specific)   ============================================ *//* Utility: Extra Large Bottom Margin */.mb-2xl {  margin-bottom: var(--space-2xl);}/* Utility: Extra Extra Large Bottom Margin */.mb-3xl {  margin-bottom: var(--space-3xl);}/* Utility: Extra Large Vertical Padding */.py-4xl {  padding-top: var(--space-4xl);  padding-bottom: var(--space-4xl);}/* ============================================   RESPONSIVE DESIGN - TABLET   ============================================ */@media (max-width: 1024px) {  .about-hero {    min-height: 60vh;    padding-top: calc(80px + var(--space-2xl));    padding-bottom: var(--space-3xl);  }  .about-hero__title {    font-size: clamp(2.5rem, 8vw, 5rem);  }  .founders__grid {    grid-template-columns: repeat(3, 1fr);    gap: var(--space-lg);  }  .event-components__grid {    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));    gap: var(--space-xl);  }  .py-4xl {    padding-top: var(--space-3xl);    padding-bottom: var(--space-3xl);  }}/* ============================================   RESPONSIVE DESIGN - MOBILE   ============================================ */@media (max-width: 768px) {  .about-hero {    min-height: 50vh;    padding-top: calc(80px + var(--space-xl));    padding-bottom: var(--space-2xl);  }  .about-hero__title {    font-size: clamp(2rem, 10vw, 4rem);  }  .about-hero__lead {    font-size: clamp(1rem, 2vw, 1.125rem);  }  .about-hero__accent {    width: 300px;    height: 300px;    filter: blur(80px);  }  .about-hero__logo {    height: clamp(2.5rem, 8vw, 4rem);  }  .founders__title {    font-size: clamp(1.75rem, 6vw, 2.5rem);  }  .founders__grid {    grid-template-columns: repeat(2, 1fr);    gap: var(--space-md);  }  .theme-section__title {    font-size: clamp(1.5rem, 5vw, 2rem);  }  .theme-section__text {    font-size: clamp(0.9375rem, 2vw, 1.125rem);  }  .event-components__grid {    grid-template-columns: 1fr;    gap: var(--space-lg);  }  .event-component {    padding: var(--space-xl);  }  .py-4xl {    padding-top: var(--space-2xl);    padding-bottom: var(--space-2xl);  }  .mb-2xl {    margin-bottom: var(--space-xl);  }  .mb-3xl {    margin-bottom: var(--space-2xl);  }}/* ============================================   RESPONSIVE DESIGN - SMALL MOBILE   ============================================ */@media (max-width: 480px) {  .about-hero {    padding-top: calc(80px + var(--space-lg));  }  .about-hero__title {    font-size: clamp(1.75rem, 12vw, 3rem);  }  .about-hero__logo {    height: clamp(2rem, 10vw, 3rem);  }  .founders__grid {    grid-template-columns: 1fr;  }  .event-component {    padding: var(--space-lg);  }  .event-component__title {    font-size: var(--text-xl);  }}/* ============================================   ACCESSIBILITY & REDUCED MOTION   ============================================ */@media (prefers-reduced-motion: reduce) {  .about-hero__accent {    animation: none;  }  .event-component {    transition: none;  }  .event-component::before {    transition: none;  }}/* ============================================   PRINT STYLES   ============================================ */@media print {  .about-hero__accent {    display: none;  }  .event-component {    border: 1px solid #333;    box-shadow: none;    page-break-inside: avoid;  }}/* ============================================   AFTER PARTY PAGE - Page-Specific Styles   Orlando BEM Architecture   ============================================ *//* Block: After Party Hero Container */.afterparty-hero__container {  max-width: 1000px;}/* Element: Mission Description Centered */.mission__description--centered {  max-width: 900px;  margin-left: auto;  margin-right: auto;}/* Block: Areas Grid */.areas-grid {  display: grid;  gap: var(--space-3xl);}/* Block: Partner Pop-Ups Section Container */.partner-popups__container {  max-width: 1000px;  text-align: center;}/* Block: Partner Pop-Ups Title */.partner-popups__title {  font-size: clamp(2rem, 5vw, 3rem);  margin-bottom: var(--space-3xl);  font-weight: 700;  text-transform: uppercase;}/* Note: Area cards use area-card classes from founder-card-bem.css *//* Note: Partner pop-ups use investor-card classes from investor-cards-bem.css *//* The partner-popups-grid class is also reused for consistent styling *//* ============================================   ARTISTS PAGE - Page-Specific Styles   Orlando BEM Architecture   ============================================ *//* Block: Artists Page Main */.artists-page {  margin-top: 0;}/* Block: Artists Hero Section */.hero-artists {  padding-top: calc(80px + var(--space-3xl));  padding-bottom: var(--space-3xl);  position: relative;  min-height: 45vh;  display: flex;  align-items: center;  justify-content: center;  background: transparent;  overflow: hidden;  z-index: 1;}/* Ensure next sections are above */.hero-artists + section {  position: relative;  z-index: 2;}/* Element: Artists Hero Container */.hero-artists__container {  position: relative;  z-index: 2;  text-align: center;  max-width: 800px;}/* Element: Artists Hero Title */.hero-artists__title {  font-size: clamp(2.5rem, 8vw, 5.5rem);  font-weight: 800;  text-transform: uppercase;  letter-spacing: 0.02em;  margin: 0;  line-height: 1.1;  color: var(--color-text);  background-clip: text;  text-shadow: 0 2px 20px rgba(0, 0, 0, 0.5);}/* Element: Artists Hero Subtitle Container */.hero-artists__subtitle-container {  margin-top: var(--space-xl);}/* Element: Artists Hero Subtitle */.hero-artists__subtitle {  color: var(--color-secondary);  font-size: var(--text-2xl);  margin-bottom: var(--space-sm);}/* Element: Artists Hero Date */.hero-artists__date {  color: var(--color-text-secondary);  font-size: var(--text-lg);  font-weight: 400;}/* Warping Orb - Scaled down for subpage */.warping-orb-artists {  position: absolute;  top: 50%;  left: 50%;  width: 600px;  height: 600px;  transform: translate(-50%, -50%);  border-radius: 50%;  pointer-events: none;  z-index: 1;  mix-blend-mode: screen;  animation: warpOrb 12s ease-in-out infinite;  filter: blur(80px);  opacity: 0.5;  will-change: transform, filter;}.warping-orb-artists::before {  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: radial-gradient(    circle at 35% 35%,    var(--color-primary) 0%,    var(--color-secondary) 40%,    var(--color-secondary) 70%,    transparent 100%  );  border-radius: 50%;  opacity: 0.8;  animation: orbGlow 8s ease-in-out infinite;  transform-origin: center center;}.warping-orb-artists::after {  content: '';  position: absolute;  top: 15%;  right: 15%;  width: 450px;  height: 450px;  background: radial-gradient(    circle at 65% 65%,    var(--color-primary) 0%,    var(--color-secondary) 45%,    var(--color-secondary) 75%,    transparent 100%  );  border-radius: 50%;  opacity: 0.5;  filter: blur(60px);  animation: orbShift 10s ease-in-out infinite;  transform-origin: center center;}@media (max-width: 768px) {  .hero-artists {    min-height: 40vh !important;    padding-top: var(--space-2xl) !important;    padding-bottom: var(--space-2xl) !important;  }    .warping-orb-artists {    width: 400px;    height: 400px;    filter: blur(50px);  }    .warping-orb-artists::after {    width: 300px;    height: 300px;  }}/* Firefox-specific optimizations */@supports (-moz-appearance: none) {  .hero-artists {    overflow: hidden !important;  }    .warping-orb-artists {    width: 500px !important;    height: 500px !important;    filter: blur(60px) !important;    background: radial-gradient(circle 200px at 50% 50%,             var(--color-primary-25) 0%,            var(--color-secondary-20) 45%,            transparent 70%);    opacity: 1;    animation: firefoxOrbPulseSubpage 25s ease-in-out infinite;  }    .warping-orb-artists::before,  .warping-orb-artists::after {    display: none !important;  }    .hero-artists .container {    z-index: 3 !important;  }    @media (max-width: 768px) {    .warping-orb-artists {      width: 350px !important;      height: 350px !important;      filter: blur(40px) !important;    }  }}/* Reduced motion: disable orb animations */@media (prefers-reduced-motion: reduce) {  .warping-orb-artists,  .warping-orb-artists::before,  .warping-orb-artists::after {    animation: none !important;  }}@keyframes firefoxOrbPulseSubpage {  0%, 100% {    opacity: 0.7;    transform: translate(-50%, -50%) scale(1) rotate(0deg);  }  33% {    opacity: 0.9;    transform: translate(-50%, -50%) scale(1.08) rotate(120deg);  }  66% {    opacity: 0.75;    transform: translate(-50%, -50%) scale(0.95) rotate(240deg);  }}/* Block: Previous Artists Heading */.artists-previous-heading {  text-align: center;  color: var(--color-secondary);  font-size: var(--text-3xl);  margin-bottom: var(--space-2xl);  text-transform: lowercase;}/* ============================================   BADGE PAGE - Page-Specific Styles   Orlando BEM Architecture   ============================================ *//* Block: Badge Hero Section */.badge-hero {  /* Inherits from .mission and .mission--header-offset */}/* Element: Mission Description Centered */.mission__description--centered {  max-width: 900px;  margin-left: auto;  margin-right: auto;  text-align: center;}/* Block: Badge Section */.badge-section {  padding: var(--space-4xl) 0;}/* Block: Badge Grid */.badge-grid {  display: grid;  grid-template-columns: repeat(2, 1fr);  gap: var(--space-3xl);  max-width: 1200px;  margin: 0 auto;}@media (max-width: 768px) {  .badge-grid {    grid-template-columns: 1fr;    gap: var(--space-2xl);  }}/* Note: Badge generator component styles are in badge-bem.css *//* Block: Badge Status (visual helper) */.badge-status {  max-width: 900px;  margin: 0 auto var(--space-2xl);  text-align: center;}.badge-status__text {  font-size: clamp(1.125rem, 2vw, 1.5rem);  font-weight: 600;  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary) 50%, var(--color-secondary) 100%);  -webkit-background-clip: text;  -webkit-text-fill-color: transparent;  background-clip: text;  text-shadow: 0 0 30px var(--color-primary-20);  filter: drop-shadow(0 0 20px var(--color-primary-20));  letter-spacing: 0.02em;}/* ============================================   COMPANIES PAGE - Page-Specific Styles   Orlando BEM Architecture   ============================================ *//* Block: Companies Page Main */.companies-page {  margin-top: 0;}/* Block: Companies Hero Section */.companies-hero {  /* Inherits from .mission and .mission--header-offset */}/* Modifier: Center-aligned Mission Title */.mission__title--center {  text-align: center;}/* Block: Pitch Competition Section */.pitch-competition {  /* Inherits from .theme-section */}/* Element: Pitch Competition Container */.pitch-competition__container {  max-width: 1000px;  text-align: center;  margin: 0 auto;}/* Element: Pitch Competition Card */.pitch-competition__card {  background: var(--color-surface);  padding: var(--space-3xl);  border-radius: var(--radius-lg);  border: 2px solid var(--color-primary-20);  margin-bottom: var(--space-2xl);}/* Element: Pitch Competition Message */.pitch-competition__message {  font-size: var(--text-md);  color: var(--color-text-secondary);  margin-bottom: var(--space-lg);  font-style: italic;}/* Element: Pitch Competition Title */.pitch-competition__title {  font-size: var(--text-2xl);  color: var(--color-primary);  margin-bottom: var(--space-md);  font-weight: 700;  text-transform: uppercase;}/* Element: Pitch Competition Subtitle */.pitch-competition__subtitle {  font-size: var(--text-xl);  margin-bottom: var(--space-xl);}/* Element: Pitch Competition Link Container */.pitch-competition__link-container {  margin-top: var(--space-2xl);}/* Element: Pitch Competition Link */.pitch-competition__link {  color: var(--color-primary);  text-decoration: none;  font-size: var(--text-lg);  border-bottom: 2px solid var(--color-primary);  padding-bottom: var(--space-xs);  transition: all var(--transition-normal);}.pitch-competition__link:hover {  color: var(--color-secondary);  border-bottom-color: var(--color-secondary);}/* ============================================   EVENT INFO PAGE - Page-Specific Styles   Orlando BEM Architecture   ============================================ *//* ============================================   EVENT INFO HERO SECTION   ============================================ *//* Block: Event Info Hero */.event-info-hero {  position: relative;  min-height: 45vh;  display: flex;  align-items: center;  justify-content: center;  padding-top: calc(80px + var(--space-3xl));  padding-bottom: var(--space-3xl);  overflow: hidden;  background: var(--color-background);}/* Element: Event Info Hero Container */.event-info-hero__container {  position: relative;  z-index: 2;  text-align: center;}/* Element: Event Info Hero Title */.event-info-hero__title {  font-size: clamp(2.5rem, 8vw, 5.5rem);  font-weight: 800;  text-transform: uppercase;  letter-spacing: 0.02em;  line-height: 1.1;  color: var(--color-text);  margin: 0;  text-shadow: 0 2px 20px rgba(0, 0, 0, 0.5);}/* ============================================   WARPING ORB EFFECT   ============================================ *//* Block: Warping Orb for Event Info */.warping-orb-event-info {  position: absolute;  top: 50%;  left: 50%;  width: 600px;  height: 600px;  transform: translate(-50%, -50%);  border-radius: 50%;  pointer-events: none;  z-index: 1;  mix-blend-mode: screen;  animation: warpOrb 12s ease-in-out infinite;  filter: blur(80px);  opacity: 0.5;  will-change: transform, filter;}.warping-orb-event-info::before {  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: radial-gradient(    circle at 35% 35%,    var(--color-primary) 0%,    var(--color-secondary) 40%,    var(--color-secondary) 70%,    transparent 100%  );  border-radius: 50%;  opacity: 0.8;  animation: orbGlow 8s ease-in-out infinite;  transform-origin: center center;}.warping-orb-event-info::after {  content: '';  position: absolute;  top: 15%;  right: 15%;  width: 450px;  height: 450px;  background: radial-gradient(    circle at 65% 65%,    var(--color-primary) 0%,    var(--color-secondary) 45%,    var(--color-secondary) 75%,    transparent 100%  );  border-radius: 50%;  opacity: 0.5;  filter: blur(60px);  animation: orbShift 10s ease-in-out infinite;  transform-origin: center center;}/* ============================================   INFO CARD COMPONENTS   ============================================ *//* Block: Info Card */.info-card {  position: relative;  padding: var(--space-3xl);  background: var(--color-surface);  border-radius: var(--radius-xl);  border: 1px solid var(--color-primary-10);  transition: all var(--transition-normal);  overflow: hidden;}/* Pseudo-element: Subtle Background Glow */.info-card::before {  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: radial-gradient(    circle at top right,    var(--color-primary-05) 0%,    transparent 70%  );  pointer-events: none;  z-index: 0;}/* Modifier: Accent Variant */.info-card--accent {  border-color: var(--color-primary-10);}.info-card--accent::before {  background: radial-gradient(    circle at top right,    var(--color-primary-06) 0%,    transparent 70%  );}/* Modifier: Secondary Variant */.info-card--secondary {  border-color: var(--color-secondary-10);}.info-card--secondary::before {  background: radial-gradient(    circle at top right,    var(--color-secondary-08) 0%,    transparent 70%  );}/* Element: Info Card Title */.info-card__title {  font-size: var(--text-3xl);  font-weight: 700;  color: var(--color-primary);  position: relative;  z-index: 1;  text-align: center;}/* Element: Info Card Text */.info-card__text {  font-size: var(--text-lg);  line-height: 1.8;  color: var(--color-text-secondary);  position: relative;  z-index: 1;  text-align: center;}/* Modifier: Primary Text (brighter) */.info-card__text--primary {  color: var(--color-text);}/* Element: Info Card Price Highlight */.info-card__price {  color: var(--color-secondary);  font-weight: 700;}/* ============================================   PRICING TIERS   ============================================ *//* Block: Pricing Tiers List */.pricing-tiers {  list-style: none;  margin: 0;  padding: 0;  position: relative;  z-index: 1;}/* Block: Pricing Tier Item */.pricing-tier {  display: flex;  flex-direction: column;  gap: var(--space-xs);  padding: var(--space-lg);  margin-bottom: var(--space-md);  background: rgba(255, 255, 255, 0.03);  border-left: 3px solid var(--color-primary);  border-radius: var(--radius-md);  transition: all var(--transition-normal);}.pricing-tier:hover {  background: rgba(255, 255, 255, 0.05);  border-left-color: var(--color-secondary);  transform: translateX(4px);}/* Element: Pricing Tier Name */.pricing-tier__name {  font-size: var(--text-xl);  color: var(--color-text);  font-weight: 700;}/* Element: Pricing Tier Price */.pricing-tier__price {  font-size: var(--text-2xl);  color: var(--color-secondary);  font-weight: 800;}/* Element: Pricing Tier Dates */.pricing-tier__dates {  font-size: var(--text-base);  color: var(--color-text-secondary);}/* Element: Pricing Tier Note */.pricing-tier__note {  font-size: var(--text-base);  color: var(--color-primary);  font-style: italic;  margin-top: var(--space-xs);}/* Block: Pricing Note */.pricing-note {  font-size: var(--text-base);  color: var(--color-text-secondary);  text-align: center;  position: relative;  z-index: 1;}/* Block: Pricing Deadline */.pricing-deadline {  font-size: var(--text-lg);  color: var(--color-text);  text-align: center;  padding: var(--space-lg);  background: var(--color-primary-08);  border-radius: var(--radius-md);  border: 1px solid var(--color-primary-15);  position: relative;  z-index: 1;}.pricing-deadline strong {  color: var(--color-primary);  font-weight: 700;}/* Block: Pricing Disclaimer */.pricing-disclaimer {  font-size: var(--text-sm);  color: var(--color-text-secondary);  text-align: center;  font-style: italic;  position: relative;  z-index: 1;}/* ============================================   REFUND POLICY   ============================================ *//* Block: Refund Policy */.refund-policy {  margin-top: var(--space-3xl);  padding-top: var(--space-3xl);  border-top: 1px solid var(--color-primary-10);  position: relative;  z-index: 1;}/* Element: Refund Policy Title */.refund-policy__title {  font-size: var(--text-2xl);  font-weight: 700;  color: var(--color-primary);  text-align: center;}/* Element: Refund Policy Intro */.refund-policy__intro {  font-size: var(--text-base);  color: var(--color-text);  text-align: center;}/* Element: Refund Policy List */.refund-policy__list {  list-style: none;  margin: 0;  padding: 0;}/* Element: Refund Policy Item */.refund-policy__item {  padding: var(--space-md);  margin-bottom: var(--space-sm);  background: rgba(0, 212, 255, 0.05);  border-left: 3px solid var(--color-primary);  border-radius: var(--radius-md);  font-size: var(--text-base);  color: var(--color-text-secondary);}.refund-policy__item strong {  color: var(--color-text);  font-weight: 700;  display: block;  margin-bottom: var(--space-xs);}/* Element: Refund Policy Note */.refund-policy__note {  font-size: var(--text-base);  color: var(--color-text);  text-align: center;  padding: var(--space-lg);  background: var(--color-secondary-08);  border-radius: var(--radius-md);  border: 1px solid var(--color-secondary-10);}.refund-policy__note strong {  color: var(--color-secondary);  font-weight: 700;}/* ============================================   EXHIBITOR CARDS   ============================================ *//* Block: Exhibitor Cards Grid */.exhibitor-cards__grid {  display: grid;  grid-template-columns: repeat(2, 1fr);  gap: var(--space-2xl);}/* Block: Exhibitor Card */.exhibitor-card {  position: relative;  padding: var(--space-2xl);  background: var(--color-surface);  border-radius: var(--radius-lg);  border: 1px solid var(--color-primary-10);  transition: all var(--transition-normal);  overflow: hidden;}/* Pseudo-element: Subtle Background Glow */.exhibitor-card::before {  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: radial-gradient(    circle at bottom left,    var(--color-primary-05) 0%,    transparent 60%  );  pointer-events: none;  z-index: 0;  opacity: 0;  transition: opacity var(--transition-normal);}.exhibitor-card:hover::before {  opacity: 1;}.exhibitor-card:hover {  transform: translateY(-4px);  border-color: var(--color-primary-20);  box-shadow: 0 10px 30px var(--color-primary-15);}/* Modifier: Accent Variant */.exhibitor-card--accent {  border-color: var(--color-primary-10);}.exhibitor-card--accent::before {  background: radial-gradient(    circle at bottom left,    var(--color-primary-06) 0%,    transparent 60%  );}.exhibitor-card--accent:hover {  border-color: var(--color-primary-20);  box-shadow: 0 10px 30px var(--color-primary-15);}/* Element: Exhibitor Card Title */.exhibitor-card__title {  font-size: var(--text-2xl);  font-weight: 700;  margin-bottom: var(--space-md);  color: var(--color-primary);  position: relative;  z-index: 1;}/* Element: Exhibitor Card Text */.exhibitor-card__text {  font-size: var(--text-base);  line-height: 1.7;  color: var(--color-text-secondary);  position: relative;  z-index: 1;}/* Element: Exhibitor Card Price */.exhibitor-card__price {  color: var(--color-secondary);  font-weight: 700;}/* ============================================   FAQ CTA SECTION   ============================================ *//* Block: FAQ CTA */.faq-cta {  text-align: center;  padding-top: var(--space-4xl);  padding-bottom: var(--space-4xl);}/* Element: FAQ CTA Title */.faq-cta__title {  font-size: clamp(1.75rem, 4vw, 2.75rem);  font-weight: 800;  color: var(--color-text);}/* Element: FAQ CTA Button */.faq-cta__button {  display: inline-flex;  align-items: center;  justify-content: center;  padding: var(--space-lg) var(--space-2xl);  background: var(--color-primary);  color: white;  font-weight: 600;  font-size: var(--text-lg);  text-decoration: none;  border-radius: var(--radius-md);  transition: all var(--transition-normal);  box-shadow: var(--shadow-glow-subtle);}.faq-cta__button:hover {  background: var(--color-secondary);  color: var(--color-background);  transform: translateY(-2px) scale(1.02);  box-shadow: var(--shadow-glow), var(--shadow-md);}/* ============================================   UTILITY CLASSES   ============================================ *//* Utility: Max Width 800 */.max-w-800 {  max-width: 800px;  margin-left: auto;  margin-right: auto;}/* Utility: Top Margin Extra Large */.mt-xl {  margin-top: var(--space-xl);  text-align: center;}/* Utility: Bottom Margin Large */.mb-lg {  margin-bottom: var(--space-lg);}/* ============================================   RESPONSIVE DESIGN - TABLET   ============================================ */@media (max-width: 1024px) {  .event-info-hero {    min-height: 40vh;    padding-top: calc(80px + var(--space-2xl));    padding-bottom: var(--space-2xl);  }  .event-info-hero__title {    font-size: clamp(2rem, 8vw, 4rem);  }  .info-card {    padding: var(--space-2xl);  }  .exhibitor-cards__grid {    gap: var(--space-xl);  }  .exhibitor-card {    padding: var(--space-xl);  }}/* ============================================   RESPONSIVE DESIGN - MOBILE   ============================================ */@media (max-width: 768px) {  .event-info-hero {    min-height: 35vh;    padding-top: calc(80px + var(--space-xl));    padding-bottom: var(--space-xl);  }  .event-info-hero__title {    font-size: clamp(1.75rem, 10vw, 3rem);  }  .warping-orb-event-info {    width: 400px;    height: 400px;    filter: blur(50px);  }  .warping-orb-event-info::after {    width: 300px;    height: 300px;  }  .info-card {    padding: var(--space-xl);  }  .info-card__title {    font-size: var(--text-2xl);  }  .info-card__text {    font-size: var(--text-base);  }  .exhibitor-cards__grid {    grid-template-columns: 1fr;    gap: var(--space-lg);  }  .exhibitor-card {    padding: var(--space-lg);  }  .exhibitor-card__title {    font-size: var(--text-xl);  }  .faq-cta__title {    font-size: clamp(1.5rem, 5vw, 2rem);  }  .faq-cta__button {    padding: var(--space-md) var(--space-xl);    font-size: var(--text-base);  }  .pricing-tier {    padding: var(--space-md);  }  .pricing-tier__name {    font-size: var(--text-lg);  }  .pricing-tier__price {    font-size: var(--text-xl);  }  .pricing-deadline {    font-size: var(--text-base);    padding: var(--space-md);  }  .refund-policy__title {    font-size: var(--text-xl);  }  .refund-policy__item {    padding: var(--space-sm);  }}/* ============================================   RESPONSIVE DESIGN - SMALL MOBILE   ============================================ */@media (max-width: 480px) {  .event-info-hero {    padding-top: calc(80px + var(--space-lg));  }  .event-info-hero__title {    font-size: clamp(1.5rem, 12vw, 2.5rem);  }  .info-card {    padding: var(--space-lg);  }  .exhibitor-card {    padding: var(--space-md);  }  .pricing-tier {    padding: var(--space-sm);  }  .pricing-tier__name {    font-size: var(--text-base);  }  .pricing-tier__price {    font-size: var(--text-lg);  }  .pricing-tier__dates {    font-size: var(--text-sm);  }}/* ============================================   FIREFOX OPTIMIZATIONS   ============================================ */@supports (-moz-appearance: none) {  .event-info-hero {    overflow: hidden !important;  }    .warping-orb-event-info {    width: 500px !important;    height: 500px !important;    filter: blur(60px) !important;    background: radial-gradient(circle 200px at 50% 50%,             var(--color-primary-25) 0%,            var(--color-secondary-20) 45%,            transparent 70%);    opacity: 1;    animation: firefoxOrbPulseSubpage 25s ease-in-out infinite;  }    .warping-orb-event-info::before,  .warping-orb-event-info::after {    display: none !important;  }    @media (max-width: 768px) {    .warping-orb-event-info {      width: 350px !important;      height: 350px !important;      filter: blur(40px) !important;    }  }}/* ============================================   ACCESSIBILITY & REDUCED MOTION   ============================================ */@media (prefers-reduced-motion: reduce) {  .warping-orb-event-info,  .warping-orb-event-info::before,  .warping-orb-event-info::after {    animation: none !important;  }  .info-card,  .exhibitor-card,  .faq-cta__button {    transition: none;  }}/* ============================================   PRINT STYLES   ============================================ */@media print {  .warping-orb-event-info {    display: none;  }  .info-card,  .exhibitor-card {    border: 1px solid #333;    box-shadow: none;    page-break-inside: avoid;  }  .faq-cta__button {    border: 2px solid #333;  }}/* ============================================   FOUNDERS PAGE - Page-Specific Styles   Orlando BEM Architecture   ============================================ *//* Block: Founders Hero Container */.founders-hero__container {  max-width: 1000px;}/* Element: Mission Description Centered */.mission__description--centered {  max-width: 900px;  margin-left: auto;  margin-right: auto;  text-align: center;}/* Element: Mission Description with Top Margin */.mission__description--top-margin {  margin-top: var(--space-xl);}/* Note: Founder cards now use investor-card classes from investor-cards-bem.css *//* The investor-grid class is also reused for consistent styling *//* ============================================   PARTNERS PAGE - Page-Specific Styles   Orlando BEM Architecture   ============================================ *//* Block: Partners Hero Container */.partners-hero__container {  max-width: 1000px;}/* Element: Mission Description Centered */.mission__description--centered {  max-width: 800px;  margin-left: auto;  margin-right: auto;}/* Block: Partners Benefits Grid */.partners-benefits {  display: grid;  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));  gap: var(--space-2xl);  margin-top: var(--space-3xl);}.partners-benefits__item {  padding: var(--space-xl);  background: var(--color-surface);  border-radius: var(--radius-md);  border: 1px solid rgba(255, 255, 255, 0.1);  transition: all var(--transition-fast);}.partners-benefits__item:hover {  transform: translateY(-4px);  border-color: var(--color-primary);  box-shadow: 0 8px 32px var(--color-primary-20);}.partners-benefits__title {  font-size: var(--text-xl);  font-weight: 700;  margin-bottom: var(--space-md);  color: var(--color-text);  background: var(--gradient-primary);  -webkit-background-clip: text;  -webkit-text-fill-color: transparent;  background-clip: text;}.partners-benefits__description {  color: var(--color-text-secondary);  font-size: var(--text-base);  line-height: 1.7;  margin: 0;}/* Block: Partners Grid - Enhanced styling */.partners-grid {  max-width: 1200px;  margin: 0 auto;}.partners-grid .investor-card {  min-height: 160px;}/* Block: Partners CTA */.partners-cta {  margin-top: var(--space-2xl);}@media (max-width: 768px) {  .partners-benefits {    grid-template-columns: 1fr;    gap: var(--space-xl);  }    .partners-grid .investor-card {    min-height: 140px;  }}/* ============================================   INVESTORS PAGE - Page-Specific Styles   Orlando BEM Architecture   ============================================ *//* Block: Investors Page Main */.investors-page {  margin-top: 0;}/* Block: Investors Hero Section */.hero--investors {  overflow: hidden;  position: relative;  z-index: 1;  padding-top: calc(80px + var(--space-3xl));  padding-bottom: var(--space-3xl);  min-height: 50vh;  display: flex;  align-items: center;  justify-content: center;  /* Keep hero nearly transparent so the global grid matches front page visibility */  background: rgba(10, 10, 15, 0.08) !important;}/* Boost global grid visibility on this page */.pitch-competition-page::after {  opacity: 0.92 !important;}/* Override section--dark default overlay on this hero to avoid double darkening */.hero--investors.section--dark {  background: rgba(10, 10, 15, 0.08) !important;}/* Ensure next sections are above */.hero--investors + section {  position: relative;  z-index: 2;}/* Element: Investors Hero Container */.hero--investors .container {  position: relative;  z-index: 2;  max-width: 900px;  text-align: center;}/* Element: Investors Hero Title */.hero--investors .hero__title {  font-size: clamp(3.5rem, 10vw, 8rem);  font-weight: 600;  text-transform: uppercase;  letter-spacing: 0.03em;  margin: 0;  line-height: 1.15;  color: var(--color-text);  display: flex;  flex-direction: column;  align-items: center;  justify-content: center;  gap: 0;}/* Element: Hero Title Line */.hero--investors .hero__title-line {  display: block;  width: 100%;  text-align: center;}.hero--investors .hero__title-line--first {  margin-bottom: 0;}.hero--investors .hero__title-line--last {  margin-top: 0;}/* Element: Hero Title Divider */.hero--investors .hero__title-divider {  display: block;  font-size: clamp(1rem, 2vw, 1.5rem);  font-weight: 300;  color: var(--color-secondary);  margin: var(--space-sm) 0;  opacity: 0.7;  line-height: 1;}/* Warping Orb - Scaled down for subpage (if needed in future) */.warping-orb-investors {  position: absolute;  top: 50%;  left: 50%;  width: 600px;  height: 600px;  transform: translate(-50%, -50%);  border-radius: 50%;  pointer-events: none;  z-index: 1;  mix-blend-mode: screen;  animation: warpOrb 12s ease-in-out infinite;  filter: blur(80px);  opacity: 0.5;  will-change: transform, filter;}.warping-orb-investors::before {  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: radial-gradient(    circle at 35% 35%,    var(--color-primary) 0%,    var(--color-secondary) 40%,    var(--color-secondary) 70%,    transparent 100%  );  border-radius: 50%;  opacity: 0.8;  animation: orbGlow 8s ease-in-out infinite;  transform-origin: center center;}.warping-orb-investors::after {  content: '';  position: absolute;  top: 15%;  right: 15%;  width: 450px;  height: 450px;  background: radial-gradient(    circle at 65% 65%,    var(--color-primary) 0%,    var(--color-secondary) 45%,    var(--color-secondary) 75%,    transparent 100%  );  border-radius: 50%;  opacity: 0.5;  filter: blur(60px);  animation: orbShift 10s ease-in-out infinite;  transform-origin: center center;}@keyframes warpOrb {  0%, 100% {    transform: translate(-50%, -50%) scale(1) rotate(0deg);  }  50% {    transform: translate(-50%, -50%) scale(1.1) rotate(180deg);  }}@keyframes orbGlow {  0%, 100% {    opacity: 0.8;    transform: scale(1);  }  50% {    opacity: 1;    transform: scale(1.05);  }}@keyframes orbShift {  0%, 100% {    opacity: 0.5;    transform: scale(1) rotate(0deg);  }  50% {    opacity: 0.7;    transform: scale(0.95) rotate(-180deg);  }}@keyframes float {  0% {    transform: translateY(100vh) translateX(0);    opacity: 0;  }  10% {    opacity: 0.6;  }  90% {    opacity: 0.6;  }  100% {    transform: translateY(-10vh) translateX(20px);    opacity: 0;  }}@media (max-width: 768px) {  .hero--investors {    min-height: 40vh;    padding-top: calc(80px + var(--space-2xl));    padding-bottom: var(--space-2xl);  }    .hero--investors .hero__title {    font-size: clamp(2.5rem, 12vw, 5rem);  }    .warping-orb-investors {    width: 400px;    height: 400px;    filter: blur(50px);  }    .warping-orb-investors::after {    width: 300px;    height: 300px;  }}/* Firefox-specific optimizations */@supports (-moz-appearance: none) {  .hero--investors {    overflow: hidden !important;  }    .warping-orb-investors {    display: block !important;    width: 450px !important;    height: 450px !important;    filter: blur(50px) !important;    mix-blend-mode: normal !important;    background: radial-gradient(circle 225px at 50% 50%,         var(--color-secondary-20) 0%,        var(--color-secondary-15) 25%,        var(--color-secondary-20) 40%,        var(--color-secondary-15) 55%,        var(--color-secondary-10) 70%,        var(--color-secondary-05) 82%,        transparent 92%) !important;    animation: purplePulseSubpage 6s ease-in-out infinite !important;    transform-origin: center center;    z-index: 0 !important;    opacity: 1 !important;  }    .warping-orb-investors::before,  .warping-orb-investors::after {    display: none;  }    .hero--investors::before {    content: '';    position: absolute;    top: 0;    left: 0;    width: 100%;    height: 100%;    background:         radial-gradient(circle 180px at 40% 50%,             var(--color-primary-15) 0%,            var(--color-primary-15) 30%,            transparent 70%),        radial-gradient(circle 170px at 60% 48%,             rgba(0, 212, 255, 0.28) 0%,            rgba(0, 212, 255, 0.15) 30%,            transparent 70%),        radial-gradient(circle 160px at 50% 45%,             var(--color-secondary-20) 0%,            var(--color-secondary-10) 35%,            transparent 65%);    opacity: 1;    filter: none;    animation: firefoxOrbPulseSubpage 25s ease-in-out infinite;    pointer-events: none;    z-index: 1;  }    .hero--investors::after {    content: '';    position: absolute;    top: 0;    left: 0;    width: 100%;    height: 100%;    background: linear-gradient(180deg, transparent 0%, var(--color-background-40) 85%, var(--color-background) 100%);    /* Light overlay so the body grid remains visible */    opacity: 0.08;    pointer-events: none;    z-index: 1;  }    .hero--investors .container {    z-index: 3 !important;  }    @media (max-width: 768px) {    .warping-orb-investors {      width: 350px !important;      height: 350px !important;      filter: blur(40px) !important;    }        .hero--investors::before {      background:           radial-gradient(circle 120px at 40% 50%,               var(--color-primary-25) 0%,              transparent 70%),          radial-gradient(circle 110px at 60% 48%,               rgba(0, 212, 255, 0.25) 0%,              transparent 70%),          radial-gradient(circle 100px at 50% 45%,               var(--color-secondary-20) 0%,              transparent 65%);    }  }}@keyframes purplePulseSubpage {  0%, 100% {    opacity: 0.85;    transform: translate(-50%, -50%);  }  50% {    opacity: 1;    transform: translate(-50%, -50%);  }}@keyframes firefoxOrbPulseSubpage {  0% {    opacity: 0.85;    transform: rotate(0deg);  }  50% {    opacity: 1;    transform: rotate(180deg);  }  100% {    opacity: 0.85;    transform: rotate(360deg);  }}@media (prefers-reduced-motion: reduce) {  .warping-orb-investors,  .warping-orb-investors::before,  .warping-orb-investors::after,  .particle {    animation: none !important;  }    .hero--investors::before {    animation: none !important;  }}/* Block: Section Title Modifiers */.section__title--accent {  color: var(--color-text);}.section__title--primary {  color: var(--color-primary);}/* Block: Section Title Alignment - Must match paragraph alignment */.section__title--left {  text-align: left;}.section__title--center {  text-align: center;}/* Block: Mission Description Alignment Modifiers */.mission__description--left {  text-align: left;  max-width: 800px;  margin-left: 0;  margin-right: auto;}.mission__description--centered {  text-align: center;  max-width: 800px;  margin: 0 auto;}/* Ensure titles automatically match their description alignment */.container:has(.mission__description--left) .section__title {  text-align: left;}.container:has(.mission__description--centered) .section__title {  text-align: center;}/* Block: Partners Section Modifiers */.partners--with-glow {  position: relative;  overflow: hidden;}/* Block: Investors Section Title */.investors-section__title {  color: var(--color-secondary);  font-size: var(--text-3xl);  margin-bottom: var(--space-3xl);  text-align: center;  font-weight: 700;  text-transform: uppercase;}/* Block: Pitchers Section */.pitchers-section {  padding-top: var(--space-3xl);  padding-bottom: var(--space-2xl);}/* Block: Pitch Kapping Winners Section */.pitch-winners {  padding-top: var(--space-2xl);  padding-bottom: var(--space-3xl);  position: relative;}/* Element: Pitch Winners Background Glow */.pitch-winners__bg-glow {  position: absolute;  inset: 0;  background: radial-gradient(circle at 30% 50%, var(--color-primary-08) 0%, transparent 60%);  pointer-events: none;}/* Element: Pitch Winners Title */.pitch-winners__title {  background: linear-gradient(135deg, var(--color-primary), var(--color-primary));  -webkit-background-clip: text;  -webkit-text-fill-color: transparent;  background-clip: text;  font-size: var(--text-3xl);  margin-bottom: var(--space-3xl);  text-align: center;  font-weight: 700;  text-transform: uppercase;}/* Element: Pitch Winners Grid */.pitch-winners__grid {  max-width: 1400px;  margin: 0 auto;  display: grid;  grid-template-columns: repeat(3, 1fr);  gap: var(--space-xl);  margin-bottom: var(--space-2xl);  align-items: stretch;}@media (max-width: 1200px) {  .pitch-winners__grid {    gap: var(--space-lg);  }}@media (max-width: 1024px) {  .pitch-winners__grid {    grid-template-columns: repeat(2, 1fr);  }}@media (max-width: 768px) {  .pitch-winners__grid {    grid-template-columns: 1fr;    gap: var(--space-xl);  }    .winner-card__description {    -webkit-line-clamp: 10;  }}/* Block: Winner Card */.winner-card {  padding: var(--space-2xl);  border-radius: var(--radius-lg);  position: relative;  overflow: hidden;  transition: all 0.3s ease;  display: flex;  flex-direction: column;  height: 100%;  max-height: 500px;}.winner-card:hover {  transform: translateY(-8px);  box-shadow: 0 20px 50px var(--color-primary-25);}@media (max-width: 768px) {  .winner-card {    padding: var(--space-2xl);    min-height: auto;  }}/* Modifier: Winner Card Pink */.winner-card--pink {  background: linear-gradient(135deg, var(--color-primary-15), var(--color-primary-05));  border: 2px solid var(--color-primary-20);}/* Modifier: Winner Card Blue */.winner-card--blue {  background: linear-gradient(135deg, rgba(0, 212, 255, 0.15), rgba(0, 212, 255, 0.05));  border: 2px solid rgba(0, 212, 255, 0.4);}/* Modifier: Winner Card Purple */.winner-card--purple {  background: linear-gradient(135deg, var(--color-secondary-15), var(--color-secondary-05));  border: 2px solid var(--color-secondary-20);}/* Element: Winner Card Glow */.winner-card__glow {  position: absolute;  top: -100px;  right: -100px;  width: 300px;  height: 300px;  background: radial-gradient(circle, var(--color-primary-15) 0%, transparent 70%);  pointer-events: none;}.winner-card--blue .winner-card__glow {  background: radial-gradient(circle, rgba(0, 212, 255, 0.3) 0%, transparent 70%);}.winner-card--purple .winner-card__glow {  background: radial-gradient(circle, var(--color-secondary-15) 0%, transparent 70%);}/* Element: Winner Card Badge */.winner-card__badge {  display: inline-block;  padding: var(--space-xs) var(--space-md);  border-radius: 20px;  font-size: var(--text-sm);  font-weight: 700;  margin-bottom: var(--space-md);  position: relative;  z-index: 1;}.winner-card--pink .winner-card__badge {  background: var(--color-primary);  color: var(--color-background);}.winner-card--blue .winner-card__badge {  background: var(--color-primary);  color: var(--color-background);}.winner-card--purple .winner-card__badge {  background: var(--color-secondary);  color: var(--color-background);}/* Element: Winner Card Title */.winner-card__title {  font-size: var(--text-2xl);  font-weight: 700;  margin-bottom: var(--space-md);  position: relative;  z-index: 1;  text-transform: uppercase;}.winner-card--pink .winner-card__title {  color: var(--color-primary);}.winner-card--blue .winner-card__title {  color: var(--color-primary);}.winner-card--purple .winner-card__title {  color: var(--color-secondary);}/* Element: Winner Card Divider */.winner-card__divider {  height: 3px;  width: 60px;  background: linear-gradient(90deg, var(--color-primary), transparent);  margin-bottom: var(--space-lg);}.winner-card--blue .winner-card__divider {  background: linear-gradient(90deg, var(--color-primary), transparent);}/* Element: Winner Card Content */.winner-card__content {  flex-grow: 1;  position: relative;  z-index: 1;}/* Element: Winner Card Description */.winner-card__description {  color: var(--color-text);  line-height: 1.6;  margin-top: 0;  display: -webkit-box;  -webkit-line-clamp: 6;  -webkit-box-orient: vertical;  overflow: hidden;  transition: all 0.3s ease;  flex-shrink: 1;  min-height: 0;}@media (max-width: 768px) {  .winner-card {    max-height: none;  }    .winner-card__description {    -webkit-line-clamp: 8;  }}/* Element: Winner Card Read More Button */.winner-card__read-more {  margin-top: var(--space-lg);  padding: var(--space-sm) var(--space-md);  background: transparent;  border: 2px solid currentColor;  border-radius: var(--radius-md);  color: inherit;  font-family: var(--font-sans);  font-size: var(--text-sm);  font-weight: 600;  text-transform: uppercase;  letter-spacing: 0.05em;  cursor: pointer;  transition: all var(--transition-fast);  position: relative;  z-index: 10;  align-self: flex-start;  pointer-events: auto;}.winner-card--pink .winner-card__read-more {  color: var(--color-primary);  border-color: var(--color-primary);}.winner-card--blue .winner-card__read-more {  color: var(--color-primary);  border-color: var(--color-primary);}.winner-card--purple .winner-card__read-more {  color: var(--color-secondary);  border-color: var(--color-secondary);}.winner-card__read-more:hover {  background: currentColor;  color: var(--color-background);  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);}.winner-card--pink .winner-card__read-more:hover {  background: var(--color-primary);  color: var(--color-background);  box-shadow: 0 4px 12px var(--color-primary-20);}.winner-card--blue .winner-card__read-more:hover {  background: var(--color-primary);  color: var(--color-background);  box-shadow: 0 4px 12px rgba(0, 212, 255, 0.4);}.winner-card--purple .winner-card__read-more:hover {  background: var(--color-secondary);  color: var(--color-background);  box-shadow: 0 4px 12px var(--color-secondary-20);}.winner-card__read-more:active {  transform: translateY(1px);}.winner-card__read-more:focus-visible {  outline: 3px solid currentColor;  outline-offset: 2px;}/* Block: Pitch Winners CTA */.pitch-winners__cta {  margin-top: var(--space-4xl);  text-align: center;  padding: var(--space-3xl);  background: linear-gradient(135deg, var(--color-primary-08), var(--color-primary-08));  border-radius: var(--radius-lg);  border: 1px solid var(--color-primary-20);  max-width: 800px;  margin-left: auto;  margin-right: auto;}@media (max-width: 768px) {  .pitch-winners__cta {    padding: var(--space-2xl);    margin-top: var(--space-3xl);  }}/* Element: Pitch Winners CTA Title */.pitch-winners__cta-title {  color: var(--color-text);  font-size: var(--text-xl);  margin-bottom: var(--space-md);  font-weight: 600;}/* Element: Pitch Winners CTA Description */.pitch-winners__cta-description {  color: var(--color-text-secondary);  margin-bottom: var(--space-xl);  max-width: 600px;  margin-left: auto;  margin-right: auto;}/* Responsive adjustments */@media (max-width: 1000px) {  .pitch-winners__grid {    grid-template-columns: 1fr;    gap: var(--space-2xl);  }}@media (max-width: 768px) {  .pitch-winners__title {    font-size: var(--text-2xl);    margin-bottom: var(--space-2xl);  }    .pitch-winners__cta-title {    font-size: var(--text-lg);  }}/* ============================================   SCHEDULE PAGE - Page-Specific Styles   Orlando BEM Architecture   ============================================ *//* Block: Schedule Page Main */.schedule-page {  margin-top: 0;}/* Block: Schedule Section */.schedule-section {  /* Inherits from .mission and .mission--header-offset */}/* Element: Mission Description Centered */.mission__description--centered {  max-width: 700px;  margin-left: auto;  margin-right: auto;  margin-bottom: var(--space-3xl);}/* ============================================   SPEAKERS PAGE - Page-Specific Styles   Orlando BEM Architecture   ============================================ *//* Block: Speakers Page Main */.speakers-page {  margin-top: 0;}/* Block: Speakers Hero Section */.speakers-hero {  padding-top: calc(80px + var(--space-3xl));  padding-bottom: var(--space-3xl);  position: relative;  min-height: 45vh;  display: flex;  align-items: center;  justify-content: center;  background: transparent;}/* Element: Speakers Hero Container */.speakers-hero__container {  position: relative;  z-index: 2;  text-align: center;  max-width: 800px;}/* Element: Speakers Hero Title */.speakers-hero__title {  font-size: clamp(2.5rem, 8vw, 5.5rem);  font-weight: 800;  text-transform: uppercase;  letter-spacing: 0.02em;  margin: 0;  line-height: 1.1;  color: var(--color-text);  background-clip: text;  text-shadow: 0 2px 20px rgba(0, 0, 0, 0.5);}/* Element: Speakers Hero Subtitle Container */.speakers-hero__subtitle-container {  margin-top: var(--space-xl);}/* Element: Speakers Hero Subtitle */.speakers-hero__subtitle {  color: var(--color-secondary);  font-size: var(--text-2xl);  margin-bottom: var(--space-sm);}/* Element: Speakers Hero Date */.speakers-hero__date {  color: var(--color-text-secondary);  font-size: var(--text-lg);  font-weight: 400;}/* Block: Previous Speakers Heading */.speakers-previous-heading {  text-align: center;  font-size: var(--text-3xl);  margin-bottom: var(--space-3xl);  text-transform: lowercase;  background: linear-gradient(135deg, var(--color-primary), var(--color-primary));  -webkit-background-clip: text;  -webkit-text-fill-color: transparent;  background-clip: text;}/* Element: Speakers Grid */.speakers__grid {  display: grid;  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));  gap: var(--space-xl);  margin-top: var(--space-2xl);  padding: var(--space-xl) 0;}/* Responsive Grid Adjustments */@media (max-width: 768px) {  .speakers__grid {    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));    gap: var(--space-lg);  }}@media (max-width: 480px) {  .speakers__grid {    grid-template-columns: 1fr;    gap: var(--space-md);  }}/* ============================================   HERO SECTION STYLES - Moved from inline styles   ============================================ *//* Hero section overflow control and z-index */.hero-speakers {  overflow: hidden;  position: relative;  z-index: 1;}/* Ensure next sections are above */.hero-speakers + section {  position: relative;  z-index: 2;}/* Warping Orb - Scaled down for subpage */.warping-orb-speakers {  position: absolute;  top: 50%;  left: 50%;  width: 600px;  height: 600px;  transform: translate(-50%, -50%);  border-radius: 50%;  pointer-events: none;  z-index: 1;  mix-blend-mode: screen;  animation: warpOrb 12s ease-in-out infinite;  filter: blur(80px);  opacity: 0.5;  will-change: transform, filter;}.warping-orb-speakers::before {  content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: radial-gradient(    circle at 35% 35%,    var(--color-primary) 0%,    var(--color-secondary) 40%,    var(--color-secondary) 70%,    transparent 100%  );  border-radius: 50%;  opacity: 0.8;  animation: orbGlow 8s ease-in-out infinite;  transform-origin: center center;}.warping-orb-speakers::after {  content: '';  position: absolute;  top: 15%;  right: 15%;  width: 450px;  height: 450px;  background: radial-gradient(    circle at 65% 65%,    var(--color-primary) 0%,    var(--color-secondary) 45%,    var(--color-secondary) 75%,    transparent 100%  );  border-radius: 50%;  opacity: 0.5;  filter: blur(60px);  animation: orbShift 10s ease-in-out infinite;  transform-origin: center center;}@media (max-width: 768px) {  .hero-speakers {    min-height: 40vh !important;    padding-top: var(--space-2xl) !important;    padding-bottom: var(--space-2xl) !important;  }    .warping-orb-speakers {    width: 400px;    height: 400px;    filter: blur(50px);  }    .warping-orb-speakers::after {    width: 300px;    height: 300px;  }}/* Firefox-specific optimizations */@supports (-moz-appearance: none) {  .hero-speakers {    overflow: hidden !important;  }    .warping-orb-speakers {    width: 500px !important;    height: 500px !important;    filter: blur(60px) !important;    background: radial-gradient(circle 200px at 50% 50%,             var(--color-primary-25) 0%,            var(--color-secondary-20) 45%,            transparent 70%);    opacity: 1;    animation: firefoxOrbPulseSubpage 25s ease-in-out infinite;  }    .warping-orb-speakers::before,  .warping-orb-speakers::after {    display: none !important;  }    .hero-speakers .container {    z-index: 3 !important;  }    @media (max-width: 768px) {    .warping-orb-speakers {      width: 350px !important;      height: 350px !important;      filter: blur(40px) !important;    }  }}/* Reduced motion: disable orb animations */@media (prefers-reduced-motion: reduce) {  .warping-orb-speakers,  .warping-orb-speakers::before,  .warping-orb-speakers::after {    animation: none !important;  }}@keyframes firefoxOrbPulseSubpage {  0%, 100% {    opacity: 0.7;    transform: translate(-50%, -50%) scale(1) rotate(0deg);  }  33% {    opacity: 0.9;    transform: translate(-50%, -50%) scale(1.08) rotate(120deg);  }  66% {    opacity: 0.75;    transform: translate(-50%, -50%) scale(0.95) rotate(240deg);  }}/* ============================================   SPEAKER CARD ANIMATION STATES   ============================================ *//* Card fade-in animation state */.speaker-card-bem--fade-in {  opacity: 0;  transition: opacity 0.3s ease;}.speaker-card-bem--visible {  opacity: 1;}/* ============================================   TEAM PAGE - Page-Specific Styles   Orlando BEM Architecture   ============================================ *//* Block: Team Page Main */.team-page {  margin-top: 0;}/* Block: Team Section */.team-section {  /* Inherits from .founders and .mission--header-offset */}/* Element: Mission Description Centered */.mission__description--centered {  max-width: 700px;  margin-left: auto;  margin-right: auto;}/* ============================================   EXPERIMENTAL TECH & ART EFFECTS   ============================================ *//* Enhanced Particle System */.particles {  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  overflow: hidden;  pointer-events: none;  z-index: 1;}.particle {  position: absolute;  width: 5px;  height: 5px;  background: var(--color-primary);  border-radius: 50%;  opacity: 0;  animation: floatParticle 15s infinite;  /* Performance Optimized: Removed box-shadow and blur filter for better performance */  /* box-shadow: 0 0 8px currentColor, 0 0 12px currentColor; */  /* filter: blur(0.5px); */  /* S-Tier: GPU acceleration for 60fps */  transform: translateZ(0);  /* Performance Optimized: Only set will-change when actually animating */  will-change: transform, opacity;  backface-visibility: hidden;  contain: layout style paint;}.particle:nth-child(1) {   left: 10%;   top: 20%;  animation-delay: 0s;  background: var(--color-primary);  width: 6px;  height: 6px;}.particle:nth-child(2) {   left: 20%;   top: 40%;  animation-delay: 2s;  background: var(--color-primary);  width: 5px;  height: 5px;}.particle:nth-child(3) {   left: 30%;   top: 60%;  animation-delay: 4s;  background: var(--color-secondary);  width: 7px;  height: 7px;}.particle:nth-child(4) {   left: 40%;   top: 30%;  animation-delay: 6s;  background: var(--color-secondary);  width: 5.5px;  height: 5.5px;}.particle:nth-child(5) {   left: 60%;   top: 50%;  animation-delay: 8s;  background: var(--color-primary);  width: 6.5px;  height: 6.5px;}.particle:nth-child(6) {   left: 70%;   top: 70%;  animation-delay: 10s;  background: var(--color-primary);  width: 5px;  height: 5px;}.particle:nth-child(7) {   left: 80%;   top: 25%;  animation-delay: 12s;  background: var(--color-secondary);  width: 7px;  height: 7px;}.particle:nth-child(8) {   left: 90%;   top: 45%;  animation-delay: 14s;  background: var(--color-secondary);  width: 6px;  height: 6px;}.particle:nth-child(9) {   left: 50%;   top: 10%;  animation-delay: 16s;  background: var(--color-primary);  width: 5.5px;  height: 5.5px;}.particle:nth-child(10) {   left: 15%;   top: 60%;  animation-delay: 1s;  background: var(--color-secondary);  width: 6.5px;  height: 6.5px;}.particle:nth-child(11) {   left: 25%;   top: 15%;  animation-delay: 3s;  background: var(--color-secondary);  width: 5px;  height: 5px;}.particle:nth-child(12) {   left: 35%;   top: 75%;  animation-delay: 5s;  background: var(--color-primary);  width: 7px;  height: 7px;}.particle:nth-child(13) {   left: 45%;   top: 5%;  animation-delay: 7s;  background: var(--color-primary);  width: 6px;  height: 6px;}.particle:nth-child(14) {   left: 55%;   top: 80%;  animation-delay: 9s;  background: var(--color-secondary);  width: 5.5px;  height: 5.5px;}.particle:nth-child(15) {   left: 65%;   top: 15%;  animation-delay: 11s;  background: var(--color-secondary);  width: 6.5px;  height: 6.5px;}.particle:nth-child(16) {   left: 75%;   top: 55%;  animation-delay: 13s;  background: var(--color-primary);  width: 5px;  height: 5px;}.particle:nth-child(17) {   left: 5%;   top: 35%;  animation-delay: 15s;  background: var(--color-primary);  width: 5.5px;  height: 5.5px;}.particle:nth-child(18) {   left: 85%;   top: 65%;  animation-delay: 17s;  background: var(--color-secondary);  width: 6.5px;  height: 6.5px;}.particle:nth-child(19) {   left: 12%;   top: 85%;  animation-delay: 19s;  background: var(--color-secondary);  width: 7px;  height: 7px;}.particle:nth-child(20) {   left: 95%;   top: 30%;  animation-delay: 21s;  background: var(--color-primary);  width: 5px;  height: 5px;}.particle:nth-child(21) {   left: 22%;   top: 45%;  animation-delay: 23s;  background: var(--color-primary);  width: 6px;  height: 6px;}.particle:nth-child(22) {   left: 42%;   top: 35%;  animation-delay: 25s;  background: var(--color-secondary);  width: 6.5px;  height: 6.5px;}.particle:nth-child(23) {   left: 58%;   top: 65%;  animation-delay: 27s;  background: var(--color-secondary);  width: 5.5px;  height: 5.5px;}.particle:nth-child(24) {   left: 78%;   top: 8%;  animation-delay: 29s;  background: var(--color-primary);  width: 7px;  height: 7px;}@keyframes floatParticle {  0% {    transform: translate(0, 0) translateZ(0) scale(0);    opacity: 0;  }  10% {    opacity: 0.8;    transform: translate(10px, -20px) translateZ(0) scale(1);  }  50% {    transform: translate(50px, -100px) translateZ(0) scale(1.2);    opacity: 0.6;  }  100% {    transform: translate(100px, -200px) translateZ(0) scale(0);    opacity: 0;  }}/* Glitch Text Effect */.glitch-text {  position: relative;  animation: glitchText 3s infinite;}.glitch-text::before,.glitch-text::after {  content: attr(data-text);  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;}.glitch-text::before {  left: 2px;  text-shadow: -2px 0 var(--color-primary);  clip: rect(44px, 450px, 56px, 0);  animation: glitchAnim1 5s infinite;}.glitch-text::after {  left: -2px;  text-shadow: -2px 0 var(--color-primary), 2px 2px var(--color-secondary);  clip: rect(44px, 450px, 56px, 0);  animation: glitchAnim2 3s infinite;}@keyframes glitchText {  0%, 90%, 100% {    transform: translate(0);  }  20% {    transform: translate(-1px, 1px);  }  40% {    transform: translate(-1px, -1px);  }  60% {    transform: translate(1px, 1px);  }  80% {    transform: translate(1px, -1px);  }}@keyframes glitchAnim1 {  0%, 100% {    clip: rect(44px, 450px, 56px, 0);  }  20% {    clip: rect(30px, 450px, 70px, 0);  }  40% {    clip: rect(50px, 450px, 40px, 0);  }  60% {    clip: rect(35px, 450px, 65px, 0);  }  80% {    clip: rect(45px, 450px, 55px, 0);  }}@keyframes glitchAnim2 {  0%, 100% {    clip: rect(44px, 450px, 56px, 0);  }  20% {    clip: rect(50px, 450px, 40px, 0);  }  40% {    clip: rect(30px, 450px, 70px, 0);  }  60% {    clip: rect(45px, 450px, 55px, 0);  }  80% {    clip: rect(35px, 450px, 65px, 0);  }}/* Morphing Blob */.morphing-blob {  position: absolute;  border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;  background: var(--gradient-vibrant);  opacity: 0.2;  animation: morphBlob 20s ease-in-out infinite;  filter: blur(60px);}@keyframes morphBlob {  0%, 100% {    border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;    transform: translate(0, 0) scale(1);  }  25% {    border-radius: 70% 30% 30% 70% / 70% 70% 30% 30%;    transform: translate(50px, -50px) scale(1.1);  }  50% {    border-radius: 30% 70% 50% 50% / 50% 50% 70% 30%;    transform: translate(-30px, 40px) scale(0.9);  }  75% {    border-radius: 60% 40% 60% 40% / 40% 60% 40% 60%;    transform: translate(40px, 30px) scale(1.05);  }}/* Scan Line Effect */.scan-line {  position: absolute;  width: 100%;  height: 2px;  background: linear-gradient(    90deg,    transparent,    var(--color-primary),    transparent  );  opacity: 0.3;  animation: scanLine 8s linear infinite;  z-index: 10;  pointer-events: none;}/* Holographic Effect */.holographic {  background: linear-gradient(    45deg,    var(--color-primary) 0%,    var(--color-secondary) 25%,    var(--color-primary) 50%,    var(--color-secondary) 75%,    var(--color-primary) 100%  );  background-size: 200% 200%;  animation: holographicShift 3s ease infinite;  -webkit-background-clip: text;  -webkit-text-fill-color: transparent;  background-clip: text;}@keyframes holographicShift {  0%, 100% {    background-position: 0% 50%;  }  50% {    background-position: 100% 50%;  }}/* Reduced motion */@media (prefers-reduced-motion: reduce) {  .particle,  .glitch-text,  .morphing-blob,  .scan-line {    animation: none !important;  }}/* ============================================   TECH & ART KEYFRAME ANIMATIONS   ============================================ *//* Glitch Effect *//* S-Tier Performance: GPU-accelerated transforms */@keyframes glitch {  0%, 100% {    transform: translate(0) translateZ(0);    filter: hue-rotate(0deg);  }  20% {    transform: translate(-2px, 2px) translateZ(0);    filter: hue-rotate(90deg);  }  40% {    transform: translate(-2px, -2px) translateZ(0);    filter: hue-rotate(180deg);  }  60% {    transform: translate(2px, 2px) translateZ(0);    filter: hue-rotate(270deg);  }  80% {    transform: translate(2px, -2px) translateZ(0);    filter: hue-rotate(360deg);  }}/* Glitch Text Effect - Enhanced *//* S-Tier Performance: GPU-accelerated transforms */@keyframes glitchText {  0%, 100% {    transform: translate(0) translateZ(0);    clip-path: inset(0 0 0 0);  }  20% {    transform: translate(-2px, 1px) translateZ(0);    clip-path: inset(20% 0 60% 0);  }  40% {    transform: translate(2px, -1px) translateZ(0);    clip-path: inset(10% 0 70% 0);  }  60% {    transform: translate(-1px, 2px) translateZ(0);    clip-path: inset(30% 0 50% 0);  }  80% {    transform: translate(1px, -2px) translateZ(0);    clip-path: inset(0 0 100% 0);  }}/* Glitch Shake Effect */@keyframes glitchShake {  0%, 100% {    transform: translate(0);    filter: invert(0%) brightness(1);  }  10% {    transform: translate(-3px, 2px) skewX(2deg);    filter: invert(100%) brightness(1.2);  }  20% {    transform: translate(3px, -2px) skewX(-2deg);    filter: invert(0%) brightness(1);  }  30% {    transform: translate(-2px, 3px) skewX(1deg);    filter: invert(100%) brightness(1.15);  }  40% {    transform: translate(2px, -3px) skewX(-1deg);    filter: invert(0%) brightness(1);  }  50% {    transform: translate(-1px, 1px);    filter: invert(50%) brightness(1.1);  }  60% {    transform: translate(1px, -1px);    filter: invert(0%) brightness(1);  }  70% {    transform: translate(-2px, 2px);    filter: invert(100%) brightness(1.1);  }  80% {    transform: translate(2px, -2px);    filter: invert(0%) brightness(1);  }  90% {    transform: translate(0);    filter: invert(0%) brightness(1);  }}/* Glitch Color Shift */@keyframes glitchColor {  0%, 100% {    filter: hue-rotate(0deg) brightness(1);  }  10% {    filter: hue-rotate(90deg) brightness(1.1);  }  20% {    filter: hue-rotate(180deg) brightness(0.9);  }  30% {    filter: hue-rotate(270deg) brightness(1.05);  }  40% {    filter: hue-rotate(360deg) brightness(1);  }}/* Glitch Horizontal Shift */@keyframes glitchHorizontal {  0%, 100% {    transform: translateX(0);  }  20% {    transform: translateX(-4px);  }  40% {    transform: translateX(4px);  }  60% {    transform: translateX(-2px);  }  80% {    transform: translateX(2px);  }}/* Pulse Glow */@keyframes pulseGlow {  0%, 100% {    opacity: 0.5;    transform: scale(1);  }  50% {    opacity: 1;    transform: scale(1.05);  }}/* Scan Line Effect */@keyframes scanLine {  0% {    transform: translateY(-100%);  }  100% {    transform: translateY(100vh);  }}/* Floating Particles */@keyframes float {  0%, 100% {    transform: translate(0, 0) rotate(0deg);    opacity: 0.3;  }  33% {    transform: translate(30px, -30px) rotate(120deg);    opacity: 0.6;  }  66% {    transform: translate(-20px, 20px) rotate(240deg);    opacity: 0.4;  }}/* Gradient Shift */@keyframes gradientShift {  0% {    background-position: 0% 50%;  }  50% {    background-position: 100% 50%;  }  100% {    background-position: 0% 50%;  }}/* Text Reveal */@keyframes textReveal {  0% {    clip-path: inset(0 100% 0 0);    opacity: 0;  }  100% {    clip-path: inset(0 0 0 0);    opacity: 1;  }}/* Smooth Page Load Fade In */@keyframes fadeIn {  0% {    opacity: 0;  }  100% {    opacity: 1;  }}/* Tech Grid Pattern */@keyframes gridMove {  0% {    background-position: 0 0, 0 0;  }  100% {    background-position: 200px 200px, 200px 200px;  }}/* Brush Stroke Effect */@keyframes brushStroke {  0% {    clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);  }  100% {    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);  }}/* Utility Classes */.glitch-effect {  animation: glitch 0.3s infinite;}.glitch-text-effect {  animation: glitchText 0.3s infinite;}.glitch-shake {  animation: glitchShake 0.4s;  animation-fill-mode: forwards;}.glitch-color {  animation: glitchColor 0.5s;  animation-fill-mode: forwards;}.float-animation {  animation: float 20s ease-in-out infinite;}.gradient-animate {  background-size: 200% 200%;  animation: gradientShift 5s ease infinite;}.text-reveal {  animation: textReveal 1s ease-out forwards;}/* Warping Orb Animations */@keyframes warpOrb {  0%, 100% {    transform: translate(-50%, -50%) translateZ(0) scale(1) rotate(0deg);  }  25% {    transform: translate(-48%, -52%) translateZ(0) scale(1.1) rotate(90deg);  }  50% {    transform: translate(-52%, -48%) translateZ(0) scale(0.95) rotate(180deg);  }  75% {    transform: translate(-50%, -50%) translateZ(0) scale(1.05) rotate(270deg);  }}@keyframes orbGlow {  0%, 100% {    opacity: 0.7;    transform: translateZ(0) scale(1);  }  50% {    opacity: 0.9;    transform: translateZ(0) scale(1.15);  }}@keyframes orbShift {  0%, 100% {    transform: translate(0, 0) translateZ(0) scale(1);    opacity: 0.5;  }  33% {    transform: translate(30px, -30px) translateZ(0) scale(1.1);    opacity: 0.6;  }  66% {    transform: translate(-20px, 20px) translateZ(0) scale(0.9);    opacity: 0.4;  }}/* ============================================   LOFI & PIXEL ART EFFECTS   ============================================ *//* Pixelated Gradient Mesh - REMOVED */.pixel-mesh {  display: none;}/* Hide fine textures in hero - keep only big grid */.hero .lofi-grid,.hero .pixel-mesh {  display: none;}/* Lofi Grid Pattern - REMOVED */.lofi-grid {  display: none;}/* Pixelated Gradient Blocks */.pixel-blocks {  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background-image:     linear-gradient(90deg, var(--color-primary-10) 0%, transparent 20%),    linear-gradient(180deg, var(--color-secondary-08) 0%, transparent 30%),    linear-gradient(270deg, var(--color-primary-08) 0%, transparent 25%);  background-size: 200px 200px, 300px 300px, 250px 250px;  background-position: 20% 30%, 70% 60%, 50% 80%;  opacity: 0.15;  pointer-events: none;  image-rendering: pixelated;  image-rendering: -moz-crisp-edges;  image-rendering: crisp-edges;  z-index: 1;  filter: blur(0.5px);}/* Gradient Mesh Overlay - Pink Focused */.gradient-mesh {  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background:     radial-gradient(at 20% 30%, var(--color-primary-20) 0px, transparent 50%),    radial-gradient(at 60% 70%, var(--color-secondary-15) 0px, transparent 50%),    radial-gradient(at 80% 40%, var(--color-primary-10) 0px, transparent 50%),    radial-gradient(at 40% 80%, var(--color-secondary-08) 0px, transparent 50%);  opacity: 0.5;  pointer-events: none;  z-index: 1;  mix-blend-mode: screen;}/* Pixelated Text Effect */.pixelated-text {  image-rendering: pixelated;  image-rendering: -moz-crisp-edges;  image-rendering: crisp-edges;  filter: contrast(1.1);}/* Lofi Texture Overlay - REMOVED */.lofi-texture {  display: none;}/* Artistic Grid Overlay - REMOVED */.artistic-grid {  display: none;}/* Pixelated Border Effect */.pixel-border {  border: 2px solid;  border-image: linear-gradient(135deg, var(--color-primary), var(--color-secondary), var(--color-secondary)) 1;  image-rendering: pixelated;  image-rendering: -moz-crisp-edges;  image-rendering: crisp-edges;}/* Lofi Vignette */.lofi-vignette {  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: radial-gradient(ellipse at center, transparent 0%, var(--color-background-40) 100%);  pointer-events: none;  z-index: 2;}/* Pixelated Glow */.pixel-glow {  filter: drop-shadow(0 0 8px currentColor) drop-shadow(0 0 16px currentColor);  image-rendering: pixelated;}/* ============================================   TECH & ART BACKGROUND EFFECTS   ============================================ *//* Tech Grid Background - REMOVED */.tech-grid {  display: none;}/* Scan Line Overlay - Removed for sophistication */.scan-line {  display: none;}/* Particle Field */.particles {  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  overflow: hidden;  pointer-events: none;  z-index: 1;}.particle {  position: absolute;  width: 4px;  height: 4px;  background: var(--color-primary);  border-radius: 50%;  opacity: 0;  animation: float 15s infinite;}.particle:nth-child(1) { left: 10%; animation-delay: 0s; }.particle:nth-child(2) { left: 20%; animation-delay: 2s; }.particle:nth-child(3) { left: 30%; animation-delay: 4s; }.particle:nth-child(4) { left: 40%; animation-delay: 6s; }.particle:nth-child(5) { left: 50%; animation-delay: 8s; }.particle:nth-child(6) { left: 60%; animation-delay: 10s; }.particle:nth-child(7) { left: 70%; animation-delay: 12s; }.particle:nth-child(8) { left: 80%; animation-delay: 14s; }.particle:nth-child(9) { left: 90%; animation-delay: 16s; }/* Artistic Brush Stroke */.brush-stroke {  position: absolute;  width: 100%;  height: 200px;  background: var(--gradient-vibrant);  opacity: 0.1;  clip-path: polygon(0 40%, 100% 20%, 100% 60%, 0 80%);  animation: brushStroke 2s ease-out forwards;  pointer-events: none;}/* Neon Glow Effect */.neon-glow {  text-shadow:     0 0 5px currentColor,    0 0 10px currentColor,    0 0 15px currentColor,    0 0 20px currentColor;}/* Digital Noise Overlay - REMOVED */.digital-noise {  display: none;}/* Tech Circuit Pattern - REMOVED */.circuit-pattern {  display: none;}