/* ============================================================ PHASE 2 — MONOCHROME TOKEN OVERRIDE (April 2026) This block REPLACES the color system. Keep it at file top so it cascades above every legacy color rule. ============================================================ */ :root{--bg-1:#FFFFFF;--bg-2:#FAFAFA;--bg-3:#F5F5F5;--fg-1:#0B0E14;--fg-2:#4A5568;--fg-3:#94A3B8;--fg-inverse:#FFFFFF;--accent:#0B0E14;--accent-hover:#000000;--accent-active:#000000;--accent-tint:#F5F5F5;--accent-2:var(--accent);--accent-2-hover:var(--accent-hover);--accent-2-tint:var(--accent-tint);--venture-live:#00C851;--venture-live-tint:rgba(0,200,81,0.12);--venture-dev:#2196F3;--venture-dev-tint:rgba(33,150,243,0.12);--venture-soon:#FFA726;--venture-soon-tint:rgba(255,167,38,0.15);--success:var(--venture-live);--success-tint:var(--venture-live-tint);--warning:var(--venture-soon);--warning-tint:var(--venture-soon-tint);--error:#DC2626;--error-tint:rgba(220,38,38,0.10);--info:var(--venture-dev);--info-tint:var(--venture-dev-tint);--shadow-1:0 1px 2px rgba(11,14,20,0.06);--shadow-2:0 4px 12px rgba(11,14,20,0.08);--shadow-3:0 12px 32px rgba(11,14,20,0.12);--shadow-accent:0 8px 24px rgba(11,14,20,0.10);--shadow-lift:0 8px 24px rgba(11,14,20,0.10);--gradient-primary:var(--fg-1);--gradient-hero:var(--bg-1);--gradient-card:var(--bg-1);--border-1:#E5E5E5;--border-2:#D4D4D4;--border-3:#A8A8A8;--border-focus:var(--fg-1);} html[data-theme="dark"]{color-scheme:dark;--bg-1:#0B0E14;--bg-2:#111827;--bg-3:#1E2430;--fg-1:#F5F5F5;--fg-2:#94A3B8;--fg-3:#64748B;--fg-inverse:#0B0E14;--accent:#F5F5F5;--accent-hover:#FFFFFF;--accent-tint:rgba(255,255,255,0.08);--accent-2:var(--accent);--accent-2-hover:var(--accent-hover);--accent-2-tint:var(--accent-tint);--venture-live:#10B981;--venture-live-tint:rgba(16,185,129,0.18);--venture-dev:#60A5FA;--venture-dev-tint:rgba(96,165,250,0.18);--venture-soon:#F59E0B;--venture-soon-tint:rgba(245,158,11,0.18);--success:var(--venture-live);--success-tint:var(--venture-live-tint);--warning:var(--venture-soon);--warning-tint:var(--venture-soon-tint);--info:var(--venture-dev);--info-tint:var(--venture-dev-tint);--border-1:#2D3748;--border-2:#4A5568;--border-3:#64748B;--shadow-1:0 1px 2px rgba(0,0,0,0.5);--shadow-2:0 4px 12px rgba(0,0,0,0.6);--shadow-3:0 12px 32px rgba(0,0,0,0.8);--shadow-accent:0 0 20px rgba(255,255,255,0.06);--shadow-lift:0 12px 32px rgba(0,0,0,0.6);--gradient-primary:var(--fg-1);--gradient-hero:var(--bg-1);--gradient-card:var(--bg-2);} /* Corporate Theme - Consolidated Stylesheet * Combines all modular CSS files for the Corporate Theme into a single file for optimized loading. * This file is automatically generated from individual theme modules. */ /** * Corporate Theme - Color Palette * Modern corporate identity with accessibility-compliant contrast ratios * All colors meet WCAG 2.1 AA standards for accessibility */ :root{--color-bg-primary:#FFFFFF;--color-bg-secondary:#FAFAFA;--color-bg-tertiary:#F5F5F5;--color-text-primary:#1C1C1C;--color-text-secondary:#666666;--color-text-tertiary:#999999;--color-text-inverse:#FFFFFF;--color-accent-primary:#1664FF;--color-accent-primary-hover:#0052E6;--color-accent-primary-light:#E8F2FF;--color-accent-primary-dark:#0A4ACC;--color-accent-secondary:#6B73FF;--color-accent-secondary-hover:#5A63E6;--color-accent-secondary-light:#F0F1FF;--color-success:#00C851;--color-success-hover:#00A844;--color-success-light:#E8F8F0;--color-success-dark:#008A37;--color-warning:#FFA726;--color-warning-hover:#FF9800;--color-warning-light:#FFF8E1;--color-warning-dark:#F57C00;--color-error:#FF5252;--color-error-hover:#F44336;--color-error-light:#FFEBEE;--color-error-dark:#D32F2F;--color-info:#2196F3;--color-info-hover:#1976D2;--color-info-light:#E3F2FD;--color-info-dark:#1565C0;--color-border-primary:#E5E5E5;--color-border-secondary:#D0D0D0;--color-border-tertiary:#CCCCCC;--color-border-focus:var(--color-accent-primary);--color-shadow-light:rgba(0, 0, 0, 0.08);--color-shadow-medium:rgba(0, 0, 0, 0.12);--color-shadow-heavy:rgba(0, 0, 0, 0.16);--color-shadow-accent:rgba(22, 100, 255, 0.15);--color-overlay-light:rgba(255, 255, 255, 0.9);--color-overlay-medium:rgba(255, 255, 255, 0.95);--color-overlay-dark:rgba(0, 0, 0, 0.5);--color-overlay-backdrop:rgba(0, 0, 0, 0.3);--gradient-primary:linear-gradient(135deg, var(--color-accent-primary) 0%, var(--color-accent-secondary) 100%);--gradient-hero:linear-gradient(135deg, var(--color-bg-primary) 0%, var(--color-accent-primary-light) 50%, var(--color-bg-primary) 100%);--gradient-card:linear-gradient(145deg, var(--color-bg-primary) 0%, var(--color-bg-tertiary) 100%);--color-header-bg:rgba(255, 255, 255, 0.95);--color-header-border:var(--color-border-primary);--color-nav-link:var(--color-text-secondary);--color-nav-link-hover:var(--color-accent-primary);--color-nav-link-active:var(--color-accent-primary);--color-hero-bg:var(--gradient-hero);--color-hero-text:var(--color-text-primary);--color-hero-subtitle:var(--color-text-secondary);--color-card-bg:var(--color-bg-primary);--color-card-border:var(--color-border-primary);--color-card-shadow:var(--color-shadow-light);--color-card-hover-shadow:var(--color-shadow-medium);--color-btn-primary-bg:var(--color-accent-primary);--color-btn-primary-text:var(--color-text-inverse);--color-btn-primary-hover:var(--color-accent-primary-hover);--color-btn-secondary-bg:transparent;--color-btn-secondary-text:var(--color-accent-primary);--color-btn-secondary-border:var(--color-accent-primary);--color-btn-secondary-hover-bg:var(--color-accent-primary-light);--color-footer-bg:var(--color-bg-secondary);--color-footer-text:var(--color-text-secondary);--color-footer-border:var(--color-border-primary);--color-status-active:var(--color-success);--color-status-pending:var(--color-warning);--color-status-inactive:var(--color-text-tertiary);--color-status-development:var(--color-info);} @media (prefers-contrast:high){:root{--color-text-primary:#000000;--color-text-secondary:#333333;--color-border-primary:#999999;--color-accent-primary:#0052CC;}} @media (prefers-reduced-motion:reduce){:root{--transition-duration:0ms;}} html[data-theme="dark"]{color-scheme:dark;background-color:#0B0E14;--color-bg-primary:#0B0E14;--color-bg-secondary:#151A23;--color-bg-tertiary:#1E2430;--color-text-primary:#EEF2F6;--color-text-secondary:#94A3B8;--color-text-tertiary:#64748B;--color-text-inverse:#0B0E14;--color-accent-primary:#3B82F6;--color-accent-primary-hover:#60A5FA;--color-accent-primary-light:rgba(59, 130, 246, 0.15);--color-accent-primary-dark:#2563EB;--color-accent-secondary:#8B5CF6;--color-accent-secondary-hover:#A78BFA;--color-accent-secondary-light:rgba(139, 92, 246, 0.15);--color-success:#10B981;--color-success-hover:#34D399;--color-success-light:rgba(16, 185, 129, 0.15);--color-warning:#F59E0B;--color-warning-hover:#FBBF24;--color-warning-light:rgba(245, 158, 11, 0.15);--color-error:#EF4444;--color-error-hover:#F87171;--color-error-light:rgba(239, 68, 68, 0.15);--color-info:#3B82F6;--color-border-primary:#2D3748;--color-border-secondary:#4A5568;--color-border-tertiary:#718096;--color-border-focus:var(--color-accent-primary);--color-shadow-light:rgba(0, 0, 0, 0.4);--color-shadow-medium:rgba(0, 0, 0, 0.6);--color-shadow-heavy:rgba(0, 0, 0, 0.8);--color-shadow-accent:rgba(59, 130, 246, 0.3);--gradient-primary:linear-gradient(135deg, #3B82F6 0%, #8B5CF6 100%);--gradient-hero:linear-gradient(180deg, #0B0E14 0%, #111827 100%);--gradient-card:linear-gradient(145deg, rgba(30, 36, 48, 0.8) 0%, rgba(21, 26, 35, 0.8) 100%);--color-header-bg:rgba(11, 14, 20, 0.85);--color-btn-primary-text:#FFFFFF;} html{scroll-behavior:smooth;scroll-padding-top:6rem;} section[id]{scroll-margin-top:6rem;} html[data-theme="dark"] .lumon-card, html[data-theme="dark"] .project-card{background:var(--gradient-card);border:1px solid var(--color-border-primary);box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);} html[data-theme="dark"] .lumon-card:hover, html[data-theme="dark"] .project-card:hover{transform:translateY(-4px);border-color:var(--color-accent-primary);box-shadow:0 0 15px var(--color-shadow-accent);} .mode-icon{display:flex;align-items:center;justify-content:center;line-height:0;} .mode-icon svg{width:20px;height:20px;stroke:var(--color-nav-link);transition:transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), stroke 0.2s ease;} .dark-mode-toggle:hover .mode-icon svg{transform:rotate(15deg) scale(1.1);stroke:var(--color-accent-primary);} .dark-mode-toggle:active .mode-icon svg{transform:rotate(15deg) scale(0.95);} html[data-theme="dark"] .site-header{border-bottom:1px solid var(--color-border-primary);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);} html ::-webkit-scrollbar{width:12px;background:var(--color-bg-primary);} html ::-webkit-scrollbar-track{background:var(--color-bg-primary);} html ::-webkit-scrollbar-thumb{background-color:var(--color-border-secondary);border-radius:6px;border:3px solid var(--color-bg-primary);} html ::-webkit-scrollbar-thumb:hover{background-color:var(--color-text-tertiary);} @media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--color-bg-primary:#121212;--color-bg-secondary:#1E1E1E;--color-bg-tertiary:#252525;--color-text-primary:#ECECEC;--color-text-secondary:#B0B0B0;--color-text-tertiary:#757575;--color-text-inverse:#121212;--color-accent-primary:#4B8BFF;--color-accent-primary-hover:#7AA9FF;--color-accent-primary-light:rgba(75, 139, 255, 0.15);--color-accent-primary-dark:#1664FF;--color-accent-secondary:#8E94FF;--color-accent-secondary-hover:#AEB3FF;--color-accent-secondary-light:rgba(142, 148, 255, 0.15);--color-border-primary:#333333;--color-border-secondary:#444444;--color-shadow-light:rgba(0, 0, 0, 0.3);--color-shadow-medium:rgba(0, 0, 0, 0.45);--gradient-hero:linear-gradient(135deg, #1A1A1A 0%, #121212 100%);--gradient-card:linear-gradient(145deg, #252525 0%, #1E1E1E 100%);--color-header-bg:rgba(18, 18, 18, 0.95);--color-btn-primary-text:#000000;}} .text-primary{color:var(--color-text-primary);} .text-secondary{color:var(--color-text-secondary);} .text-tertiary{color:var(--color-text-tertiary);} .text-inverse{color:var(--color-text-inverse);} .text-accent{color:var(--color-accent-primary);} .text-success{color:var(--color-success);} .text-warning{color:var(--color-warning);} .text-error{color:var(--color-error);} .text-info{color:var(--color-info);} .bg-primary{background-color:var(--color-bg-primary);} .bg-secondary{background-color:var(--color-bg-secondary);} .bg-tertiary{background-color:var(--color-bg-tertiary);} .bg-accent{background-color:var(--color-accent-primary);} .bg-accent-light{background-color:var(--color-accent-primary-light);} .bg-success{background-color:var(--color-success);} .bg-success-light{background-color:var(--color-success-light);} .bg-warning{background-color:var(--color-warning);} .bg-warning-light{background-color:var(--color-warning-light);} .bg-error{background-color:var(--color-error);} .bg-error-light{background-color:var(--color-error-light);} .bg-info{background-color:var(--color-info);} .bg-info-light{background-color:var(--color-info-light);} .border-primary{border-color:var(--color-border-primary);} .border-secondary{border-color:var(--color-border-secondary);} .border-accent{border-color:var(--color-accent-primary);} .border-success{border-color:var(--color-success);} .border-warning{border-color:var(--color-warning);} .border-error{border-color:var(--color-error);} .border-info{border-color:var(--color-info);} /* * All color combinations in this palette have been designed to meet * WCAG 2.1 AA contrast ratio requirements:* * - Normal text:4.5:1 minimum contrast ratio * - Large text (18pt+):3:1 minimum contrast ratio * - UI components:3:1 minimum contrast ratio * * Tested combinations:* - Primary text (#1C1C1C) on white (#FFFFFF):12.6:1 ✓ * - Secondary text (#666666) on white (#FFFFFF):5.7:1 ✓ * - Primary accent (#1664FF) on white (#FFFFFF):4.5:1 ✓ * - White text (#FFFFFF) on primary accent (#1664FF):4.5:1 ✓ * - Success color (#00C851) on white (#FFFFFF):3.4:1 ✓ (large text) * - Warning color (#FFA726) on white (#FFFFFF):2.9:1 (decorative only) * - Error color (#FF5252) on white (#FFFFFF):3.8:1 ✓ (large text) */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&display=swap');:root{--font-primary:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', sans-serif;--font-secondary:'JetBrains Mono', 'SF Mono', 'Monaco', 'Inconsolata', 'Roboto Mono', 'Consolas', 'Courier New', monospace;--font-weight-light:300;--font-weight-regular:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--font-size-base:16px;--font-size-xs:0.875rem;--font-size-sm:1rem;--font-size-md:1.125rem;--font-size-lg:1.5rem;--font-size-xl:2rem;--line-height-tight:1.2;--line-height-normal:1.5;--line-height-relaxed:1.6;--line-height-loose:1.8;--letter-spacing-tight:-0.025em;--letter-spacing-normal:0;--letter-spacing-wide:0.025em;} @media (min-width:768px){:root{--font-size-xs:1rem;--font-size-sm:1.125rem;--font-size-md:1.25rem;--font-size-lg:1.75rem;--font-size-xl:2.5rem;}} html{font-size:var(--font-size-base);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;} body{font-family:var(--font-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);line-height:var(--line-height-normal);letter-spacing:var(--letter-spacing-normal);color:var(--color-text-primary, #1C1C1C);background-color:var(--color-bg-primary, #FFFFFF);transition:background-color 0.3s ease, color 0.3s ease;} h1, .heading-1{font-family:var(--font-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-xl);line-height:var(--line-height-tight);letter-spacing:var(--letter-spacing-tight);margin:0 0 1.5rem 0;} h2, .heading-2{font-family:var(--font-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-lg);line-height:var(--line-height-tight);letter-spacing:var(--letter-spacing-tight);margin:0 0 1.25rem 0;} h3, .heading-3{font-family:var(--font-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);line-height:var(--line-height-normal);letter-spacing:var(--letter-spacing-normal);margin:0 0 1rem 0;} h4, .heading-4{font-family:var(--font-primary);font-weight:var(--font-weight-medium);font-size:var(--font-size-sm);line-height:var(--line-height-normal);letter-spacing:var(--letter-spacing-normal);margin:0 0 0.75rem 0;} h5, .heading-5{font-family:var(--font-primary);font-weight:var(--font-weight-medium);font-size:var(--font-size-xs);line-height:var(--line-height-normal);letter-spacing:var(--letter-spacing-wide);text-transform:uppercase;margin:0 0 0.5rem 0;} h6, .heading-6{font-family:var(--font-primary);font-weight:var(--font-weight-medium);font-size:var(--font-size-xs);line-height:var(--line-height-normal);letter-spacing:var(--letter-spacing-normal);margin:0 0 0.5rem 0;} p, .body-text{font-family:var(--font-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);line-height:var(--line-height-relaxed);margin:0 0 1rem 0;} .body-large{font-size:var(--font-size-md);line-height:var(--line-height-relaxed);} .body-small{font-size:var(--font-size-xs);line-height:var(--line-height-normal);} .lead{font-family:var(--font-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-md);line-height:var(--line-height-relaxed);color:var(--text-secondary, #666666);margin:0 0 1.5rem 0;} code, .code-inline{font-family:var(--font-secondary);font-weight:var(--font-weight-regular);font-size:0.875em;background-color:var(--background-secondary, #F5F5F5);padding:0.125rem 0.25rem;border-radius:0.25rem;letter-spacing:var(--letter-spacing-normal);} pre, .code-block{font-family:var(--font-secondary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);line-height:var(--line-height-relaxed);background-color:var(--background-secondary, #F5F5F5);padding:1rem;border-radius:0.5rem;overflow-x:auto;margin:0 0 1rem 0;} kbd, .keyboard{font-family:var(--font-secondary);font-weight:var(--font-weight-medium);font-size:0.75em;background-color:var(--background-tertiary, #E5E5E5);border:1px solid var(--border-color, #D1D1D1);border-radius:0.25rem;padding:0.125rem 0.375rem;box-shadow:0 1px 2px rgba(0, 0, 0, 0.1);} .text-hero{font-family:var(--font-primary);font-weight:var(--font-weight-bold);font-size:clamp(2rem, 5vw, 3.5rem);line-height:var(--line-height-tight);letter-spacing:var(--letter-spacing-tight);} .text-subtitle{font-family:var(--font-primary);font-weight:var(--font-weight-medium);font-size:var(--font-size-md);line-height:var(--line-height-normal);color:var(--text-secondary, #666666);} .text-caption{font-family:var(--font-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);line-height:var(--line-height-normal);color:var(--text-secondary, #666666);} .text-overline{font-family:var(--font-primary);font-weight:var(--font-weight-medium);font-size:var(--font-size-xs);line-height:var(--line-height-normal);letter-spacing:var(--letter-spacing-wide);text-transform:uppercase;color:var(--text-secondary, #666666);} a, .link{font-family:inherit;color:var(--accent-primary, #1664FF);text-decoration:none;transition:color 0.2s ease;} a:hover, .link:hover{color:var(--accent-primary-dark, #0F4FCC);text-decoration:underline;} a:focus, .link:focus{outline:2px solid var(--accent-primary, #1664FF);outline-offset:2px;border-radius:0.125rem;} .button-text{font-family:var(--font-primary);font-weight:var(--font-weight-medium);font-size:var(--font-size-sm);line-height:var(--line-height-normal);letter-spacing:var(--letter-spacing-normal);} .button-text-large{font-size:var(--font-size-md);} .button-text-small{font-size:var(--font-size-xs);} ul, ol{font-family:var(--font-primary);font-size:var(--font-size-sm);line-height:var(--line-height-relaxed);margin:0 0 1rem 0;padding-left:1.5rem;} li{margin-bottom:0.25rem;} blockquote{font-family:var(--font-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-md);line-height:var(--line-height-relaxed);font-style:italic;color:var(--text-secondary, #666666);border-left:4px solid var(--accent-primary, #1664FF);padding-left:1rem;margin:1.5rem 0;} .font-light{font-weight:var(--font-weight-light);} .font-regular{font-weight:var(--font-weight-regular);} .font-medium{font-weight:var(--font-weight-medium);} .font-semibold{font-weight:var(--font-weight-semibold);} .font-bold{font-weight:var(--font-weight-bold);} .text-left{text-align:left;} .text-center{text-align:center;} .text-right{text-align:right;} .text-justify{text-align:justify;} .text-uppercase{text-transform:uppercase;} .text-lowercase{text-transform:lowercase;} .text-capitalize{text-transform:capitalize;} .text-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;} .text-wrap{white-space:normal;} .text-nowrap{white-space:nowrap;} @media (max-width:767px){.text-hero{font-size:clamp(1.75rem, 8vw, 2.5rem);} h1, .heading-1{font-size:1.875rem;} h2, .heading-2{font-size:1.5rem;}} @media (-webkit-min-device-pixel-ratio:2), (min-resolution:192dpi){body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}} @media print{body{font-family:'Times New Roman', serif;font-size:12pt;line-height:1.4;color:#000;} h1, h2, h3, h4, h5, h6{page-break-after:avoid;} p, li{orphans:3;widows:3;}} :root{--container-sm:540px;--container-md:720px;--container-lg:960px;--container-xl:1140px;--container-xxl:1320px;--breakpoint-sm:576px;--breakpoint-md:768px;--breakpoint-lg:992px;--breakpoint-xl:1200px;--breakpoint-xxl:1400px;--spacing-xs:0.25rem;--spacing-sm:0.5rem;--spacing-md:1rem;--spacing-lg:1.5rem;--spacing-xl:2rem;--spacing-2xl:3rem;--spacing-3xl:4rem;--spacing-4xl:6rem;--grid-columns:12;--grid-gap:1.5rem;--grid-gap-sm:1rem;} .container{width:100%;padding-right:var(--spacing-md);padding-left:var(--spacing-md);margin-right:auto;margin-left:auto;} .container-fluid{width:100%;padding-right:var(--spacing-md);padding-left:var(--spacing-md);margin-right:auto;margin-left:auto;} @media (min-width:576px){.container{max-width:var(--container-sm);}} @media (min-width:768px){.container{max-width:var(--container-md);padding-right:var(--spacing-lg);padding-left:var(--spacing-lg);} .container-fluid{padding-right:var(--spacing-lg);padding-left:var(--spacing-lg);}} @media (min-width:992px){.container{max-width:var(--container-lg);}} @media (min-width:1200px){.container{max-width:var(--container-xl);}} @media (min-width:1400px){.container{max-width:var(--container-xxl);}} .row{display:flex;flex-wrap:wrap;margin-right:calc(var(--grid-gap) * -0.5);margin-left:calc(var(--grid-gap) * -0.5);} .row-sm{margin-right:calc(var(--grid-gap-sm) * -0.5);margin-left:calc(var(--grid-gap-sm) * -0.5);} .row-sm>[class*="col-"]{padding-right:calc(var(--grid-gap-sm) * 0.5);padding-left:calc(var(--grid-gap-sm) * 0.5);} [class*="col-"]{position:relative;width:100%;padding-right:calc(var(--grid-gap) * 0.5);padding-left:calc(var(--grid-gap) * 0.5);} .col{flex:1 0 0%;} .col-auto{flex:0 0 auto;width:auto;} .col-1{flex:0 0 auto;width:8.333333%;} .col-2{flex:0 0 auto;width:16.666667%;} .col-3{flex:0 0 auto;width:25%;} .col-4{flex:0 0 auto;width:33.333333%;} .col-5{flex:0 0 auto;width:41.666667%;} .col-6{flex:0 0 auto;width:50%;} .col-7{flex:0 0 auto;width:58.333333%;} .col-8{flex:0 0 auto;width:66.666667%;} .col-9{flex:0 0 auto;width:75%;} .col-10{flex:0 0 auto;width:83.333333%;} .col-11{flex:0 0 auto;width:91.666667%;} .col-12{flex:0 0 auto;width:100%;} @media (min-width:576px){.col-sm{flex:1 0 0%;} .col-sm-auto{flex:0 0 auto;width:auto;} .col-sm-1{flex:0 0 auto;width:8.333333%;} .col-sm-2{flex:0 0 auto;width:16.666667%;} .col-sm-3{flex:0 0 auto;width:25%;} .col-sm-4{flex:0 0 auto;width:33.333333%;} .col-sm-5{flex:0 0 auto;width:41.666667%;} .col-sm-6{flex:0 0 auto;width:50%;} .col-sm-7{flex:0 0 auto;width:58.333333%;} .col-sm-8{flex:0 0 auto;width:66.666667%;} .col-sm-9{flex:0 0 auto;width:75%;} .col-sm-10{flex:0 0 auto;width:83.333333%;} .col-sm-11{flex:0 0 auto;width:91.666667%;} .col-sm-12{flex:0 0 auto;width:100%;}} @media (min-width:768px){.col-md{flex:1 0 0%;} .col-md-auto{flex:0 0 auto;width:auto;} .col-md-1{flex:0 0 auto;width:8.333333%;} .col-md-2{flex:0 0 auto;width:16.666667%;} .col-md-3{flex:0 0 auto;width:25%;} .col-md-4{flex:0 0 auto;width:33.333333%;} .col-md-5{flex:0 0 auto;width:41.666667%;} .col-md-6{flex:0 0 auto;width:50%;} .col-md-7{flex:0 0 auto;width:58.333333%;} .col-md-8{flex:0 0 auto;width:66.666667%;} .col-md-9{flex:0 0 auto;width:75%;} .col-md-10{flex:0 0 auto;width:83.333333%;} .col-md-11{flex:0 0 auto;width:91.666667%;} .col-md-12{flex:0 0 auto;width:100%;}} @media (min-width:992px){.col-lg{flex:1 0 0%;} .col-lg-auto{flex:0 0 auto;width:auto;} .col-lg-1{flex:0 0 auto;width:8.333333%;} .col-lg-2{flex:0 0 auto;width:16.666667%;} .col-lg-3{flex:0 0 auto;width:25%;} .col-lg-4{flex:0 0 auto;width:33.333333%;} .col-lg-5{flex:0 0 auto;width:41.666667%;} .col-lg-6{flex:0 0 auto;width:50%;} .col-lg-7{flex:0 0 auto;width:58.333333%;} .col-lg-8{flex:0 0 auto;width:66.666667%;} .col-lg-9{flex:0 0 auto;width:75%;} .col-lg-10{flex:0 0 auto;width:83.333333%;} .col-lg-11{flex:0 0 auto;width:91.666667%;} .col-lg-12{flex:0 0 auto;width:100%;}} @media (min-width:1200px){.col-xl{flex:1 0 0%;} .col-xl-auto{flex:0 0 auto;width:auto;} .col-xl-1{flex:0 0 auto;width:8.333333%;} .col-xl-2{flex:0 0 auto;width:16.666667%;} .col-xl-3{flex:0 0 auto;width:25%;} .col-xl-4{flex:0 0 auto;width:33.333333%;} .col-xl-5{flex:0 0 auto;width:41.666667%;} .col-xl-6{flex:0 0 auto;width:50%;} .col-xl-7{flex:0 0 auto;width:58.333333%;} .col-xl-8{flex:0 0 auto;width:66.666667%;} .col-xl-9{flex:0 0 auto;width:75%;} .col-xl-10{flex:0 0 auto;width:83.333333%;} .col-xl-11{flex:0 0 auto;width:91.666667%;} .col-xl-12{flex:0 0 auto;width:100%;}} .d-flex{display:flex !important;} .d-inline-flex{display:inline-flex !important;} .d-block{display:block !important;} .d-inline-block{display:inline-block !important;} .d-none{display:none !important;} .flex-row{flex-direction:row !important;} .flex-column{flex-direction:column !important;} .flex-row-reverse{flex-direction:row-reverse !important;} .flex-column-reverse{flex-direction:column-reverse !important;} .flex-wrap{flex-wrap:wrap !important;} .flex-nowrap{flex-wrap:nowrap !important;} .flex-wrap-reverse{flex-wrap:wrap-reverse !important;} .justify-content-start{justify-content:flex-start !important;} .justify-content-end{justify-content:flex-end !important;} .justify-content-center{justify-content:center !important;} .justify-content-between{justify-content:space-between !important;} .justify-content-around{justify-content:space-around !important;} .justify-content-evenly{justify-content:space-evenly !important;} .align-items-start{align-items:flex-start !important;} .align-items-end{align-items:flex-end !important;} .align-items-center{align-items:center !important;} .align-items-baseline{align-items:baseline !important;} .align-items-stretch{align-items:stretch !important;} .align-content-start{align-content:flex-start !important;} .align-content-end{align-content:flex-end !important;} .align-content-center{align-content:center !important;} .align-content-between{align-content:space-between !important;} .align-content-around{align-content:space-around !important;} .align-content-stretch{align-content:stretch !important;} .align-self-auto{align-self:auto !important;} .align-self-start{align-self:flex-start !important;} .align-self-end{align-self:flex-end !important;} .align-self-center{align-self:center !important;} .align-self-baseline{align-self:baseline !important;} .align-self-stretch{align-self:stretch !important;} .flex-fill{flex:1 1 auto !important;} .flex-grow-0{flex-grow:0 !important;} .flex-grow-1{flex-grow:1 !important;} .flex-shrink-0{flex-shrink:0 !important;} .flex-shrink-1{flex-shrink:1 !important;} /* ===== SPACING UTILITIES ===== */ .m-0{margin:0 !important;} .m-1{margin:var(--spacing-xs) !important;} .m-2{margin:var(--spacing-sm) !important;} .m-3{margin:var(--spacing-md) !important;} .m-4{margin:var(--spacing-lg) !important;} .m-5{margin:var(--spacing-xl) !important;} .m-6{margin:var(--spacing-2xl) !important;} .m-7{margin:var(--spacing-3xl) !important;} .m-8{margin:var(--spacing-4xl) !important;} .mt-0{margin-top:0 !important;} .mt-1{margin-top:var(--spacing-xs) !important;} .mt-2{margin-top:var(--spacing-sm) !important;} .mt-3{margin-top:var(--spacing-md) !important;} .mt-4{margin-top:var(--spacing-lg) !important;} .mt-5{margin-top:var(--spacing-xl) !important;} .mt-6{margin-top:var(--spacing-2xl) !important;} .mt-7{margin-top:var(--spacing-3xl) !important;} .mt-8{margin-top:var(--spacing-4xl) !important;} .mb-0{margin-bottom:0 !important;} .mb-1{margin-bottom:var(--spacing-xs) !important;} .mb-2{margin-bottom:var(--spacing-sm) !important;} .mb-3{margin-bottom:var(--spacing-md) !important;} .mb-4{margin-bottom:var(--spacing-lg) !important;} .mb-5{margin-bottom:var(--spacing-xl) !important;} .mb-6{margin-bottom:var(--spacing-2xl) !important;} .mb-7{margin-bottom:var(--spacing-3xl) !important;} .mb-8{margin-bottom:var(--spacing-4xl) !important;} .ml-0{margin-left:0 !important;} .ml-1{margin-left:var(--spacing-xs) !important;} .ml-2{margin-left:var(--spacing-sm) !important;} .ml-3{margin-left:var(--spacing-md) !important;} .ml-4{margin-left:var(--spacing-lg) !important;} .ml-5{margin-left:var(--spacing-xl) !important;} .ml-6{margin-left:var(--spacing-2xl) !important;} .ml-7{margin-left:var(--spacing-3xl) !important;} .ml-8{margin-left:var(--spacing-4xl) !important;} .mr-0{margin-right:0 !important;} .mr-1{margin-right:var(--spacing-xs) !important;} .mr-2{margin-right:var(--spacing-sm) !important;} .mr-3{margin-right:var(--spacing-md) !important;} .mr-4{margin-right:var(--spacing-lg) !important;} .mr-5{margin-right:var(--spacing-xl) !important;} .mr-6{margin-right:var(--spacing-2xl) !important;} .mr-7{margin-right:var(--spacing-3xl) !important;} .mr-8{margin-right:var(--spacing-4xl) !important;} .mx-0{margin-left:0 !important;margin-right:0 !important;} .mx-1{margin-left:var(--spacing-xs) !important;margin-right:var(--spacing-xs) !important;} .mx-2{margin-left:var(--spacing-sm) !important;margin-right:var(--spacing-sm) !important;} .mx-3{margin-left:var(--spacing-md) !important;margin-right:var(--spacing-md) !important;} .mx-4{margin-left:var(--spacing-lg) !important;margin-right:var(--spacing-lg) !important;} .mx-5{margin-left:var(--spacing-xl) !important;margin-right:var(--spacing-xl) !important;} .mx-6{margin-left:var(--spacing-2xl) !important;margin-right:var(--spacing-2xl) !important;} .mx-7{margin-left:var(--spacing-3xl) !important;margin-right:var(--spacing-3xl) !important;} .mx-8{margin-left:var(--spacing-4xl) !important;margin-right:var(--spacing-4xl) !important;} .mx-auto{margin-left:auto !important;margin-right:auto !important;} .my-0{margin-top:0 !important;margin-bottom:0 !important;} .my-1{margin-top:var(--spacing-xs) !important;margin-bottom:var(--spacing-xs) !important;} .my-2{margin-top:var(--spacing-sm) !important;margin-bottom:var(--spacing-sm) !important;} .my-3{margin-top:var(--spacing-md) !important;margin-bottom:var(--spacing-md) !important;} .my-4{margin-top:var(--spacing-lg) !important;margin-bottom:var(--spacing-lg) !important;} .my-5{margin-top:var(--spacing-xl) !important;margin-bottom:var(--spacing-xl) !important;} .my-6{margin-top:var(--spacing-2xl) !important;margin-bottom:var(--spacing-2xl) !important;} .my-7{margin-top:var(--spacing-3xl) !important;margin-bottom:var(--spacing-3xl) !important;} .my-8{margin-top:var(--spacing-4xl) !important;margin-bottom:var(--spacing-4xl) !important;} .p-0{padding:0 !important;} .p-1{padding:var(--spacing-xs) !important;} .p-2{padding:var(--spacing-sm) !important;} .p-3{padding:var(--spacing-md) !important;} .p-4{padding:var(--spacing-lg) !important;} .p-5{padding:var(--spacing-xl) !important;} .p-6{padding:var(--spacing-2xl) !important;} .p-7{padding:var(--spacing-3xl) !important;} .p-8{padding:var(--spacing-4xl) !important;} .pt-0{padding-top:0 !important;} .pt-1{padding-top:var(--spacing-xs) !important;} .pt-2{padding-top:var(--spacing-sm) !important;} .pt-3{padding-top:var(--spacing-md) !important;} .pt-4{padding-top:var(--spacing-lg) !important;} .pt-5{padding-top:var(--spacing-xl) !important;} .pt-6{padding-top:var(--spacing-2xl) !important;} .pt-7{padding-top:var(--spacing-3xl) !important;} .pt-8{padding-top:var(--spacing-4xl) !important;} .pb-0{padding-bottom:0 !important;} .pb-1{padding-bottom:var(--spacing-xs) !important;} .pb-2{padding-bottom:var(--spacing-sm) !important;} .pb-3{padding-bottom:var(--spacing-md) !important;} .pb-4{padding-bottom:var(--spacing-lg) !important;} .pb-5{padding-bottom:var(--spacing-xl) !important;} .pb-6{padding-bottom:var(--spacing-2xl) !important;} .pb-7{padding-bottom:var(--spacing-3xl) !important;} .pb-8{padding-bottom:var(--spacing-4xl) !important;} .pl-0{padding-left:0 !important;} .pl-1{padding-left:var(--spacing-xs) !important;} .pl-2{padding-left:var(--spacing-sm) !important;} .pl-3{padding-left:var(--spacing-md) !important;} .pl-4{padding-left:var(--spacing-lg) !important;} .pl-5{padding-left:var(--spacing-xl) !important;} .pl-6{padding-left:var(--spacing-2xl) !important;} .pl-7{padding-left:var(--spacing-3xl) !important;} .pl-8{padding-left:var(--spacing-4xl) !important;} .pr-0{padding-right:0 !important;} .pr-1{padding-right:var(--spacing-xs) !important;} .pr-2{padding-right:var(--spacing-sm) !important;} .pr-3{padding-right:var(--spacing-md) !important;} .pr-4{padding-right:var(--spacing-lg) !important;} .pr-5{padding-right:var(--spacing-xl) !important;} .pr-6{padding-right:var(--spacing-2xl) !important;} .pr-7{padding-right:var(--spacing-3xl) !important;} .pr-8{padding-right:var(--spacing-4xl) !important;} .px-0{padding-left:0 !important;padding-right:0 !important;} .px-1{padding-left:var(--spacing-xs) !important;padding-right:var(--spacing-xs) !important;} .px-2{padding-left:var(--spacing-sm) !important;padding-right:var(--spacing-sm) !important;} .px-3{padding-left:var(--spacing-md) !important;padding-right:var(--spacing-md) !important;} .px-4{padding-left:var(--spacing-lg) !important;padding-right:var(--spacing-lg) !important;} .px-5{padding-left:var(--spacing-xl) !important;padding-right:var(--spacing-xl) !important;} .px-6{padding-left:var(--spacing-2xl) !important;padding-right:var(--spacing-2xl) !important;} .px-7{padding-left:var(--spacing-3xl) !important;padding-right:var(--spacing-3xl) !important;} .px-8{padding-left:var(--spacing-4xl) !important;padding-right:var(--spacing-4xl) !important;} .py-0{padding-top:0 !important;padding-bottom:0 !important;} .py-1{padding-top:var(--spacing-xs) !important;padding-bottom:var(--spacing-xs) !important;} .py-2{padding-top:var(--spacing-sm) !important;padding-bottom:var(--spacing-sm) !important;} .py-3{padding-top:var(--spacing-md) !important;padding-bottom:var(--spacing-md) !important;} .py-4{padding-top:var(--spacing-lg) !important;padding-bottom:var(--spacing-lg) !important;} .py-5{padding-top:var(--spacing-xl) !important;padding-bottom:var(--spacing-xl) !important;} .py-6{padding-top:var(--spacing-2xl) !important;padding-bottom:var(--spacing-2xl) !important;} .py-7{padding-top:var(--spacing-3xl) !important;padding-bottom:var(--spacing-3xl) !important;} .py-8{padding-top:var(--spacing-4xl) !important;padding-bottom:var(--spacing-4xl) !important;} .text-left{text-align:left !important;} .text-right{text-align:right !important;} .text-center{text-align:center !important;} .text-justify{text-align:justify !important;} .position-static{position:static !important;} .position-relative{position:relative !important;} .position-absolute{position:absolute !important;} .position-fixed{position:fixed !important;} .position-sticky{position:sticky !important;} .w-25{width:25% !important;} .w-50{width:50% !important;} .w-75{width:75% !important;} .w-100{width:100% !important;} .w-auto{width:auto !important;} .h-25{height:25% !important;} .h-50{height:50% !important;} .h-75{height:75% !important;} .h-100{height:100% !important;} .h-auto{height:auto !important;} .mw-100{max-width:100% !important;} .mh-100{max-height:100% !important;} .min-vw-100{min-width:100vw !important;} .min-vh-100{min-height:100vh !important;} .vw-100{width:100vw !important;} .vh-100{height:100vh !important;} @media (max-width:575.98px){.d-none-xs{display:none !important;} .d-block-xs{display:block !important;} .d-flex-xs{display:flex !important;}} @media (min-width:576px) and (max-width:767.98px){.d-none-sm{display:none !important;} .d-block-sm{display:block !important;} .d-flex-sm{display:flex !important;}} @media (min-width:768px) and (max-width:991.98px){.d-none-md{display:none !important;} .d-block-md{display:block !important;} .d-flex-md{display:flex !important;}} @media (min-width:992px) and (max-width:1199.98px){.d-none-lg{display:none !important;} .d-block-lg{display:block !important;} .d-flex-lg{display:flex !important;}} @media (min-width:1200px){.d-none-xl{display:none !important;} .d-block-xl{display:block !important;} .d-flex-xl{display:flex !important;}} .section{padding:var(--spacing-4xl) 0;} .section-sm{padding:var(--spacing-2xl) 0;} .section-lg{padding:var(--spacing-4xl) 0;} @media (min-width:768px){.section{padding:var(--spacing-4xl) 0;} .section-lg{padding:6rem 0;}} .card-grid{display:grid;gap:var(--spacing-xl);grid-template-columns:1fr;} @media (min-width:768px){.card-grid-2{grid-template-columns:repeat(2, 1fr);}} @media (min-width:992px){.card-grid-3, .grid-3{grid-template-columns:repeat(3, 1fr);} .lumon-style-cards{display:grid;grid-template-columns:repeat(3, 1fr);gap:var(--spacing-xl);margin-top:var(--spacing-2xl);} @media (max-width:968px){.lumon-style-cards{grid-template-columns:1fr;gap:var(--spacing-lg);}} .card-grid-4{grid-template-columns:repeat(4, 1fr);}} .content-wrapper{max-width:65ch;margin:0 auto;} .two-column-layout{display:grid;gap:var(--spacing-xl);grid-template-columns:1fr;} @media (min-width:768px){.two-column-layout{grid-template-columns:1fr 1fr;gap:var(--spacing-2xl);}} .sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important;} .sr-only-focusable:focus{position:static !important;width:auto !important;height:auto !important;padding:inherit !important;margin:inherit !important;overflow:visible !important;clip:auto !important;white-space:normal !important;} .overflow-auto{overflow:auto !important;} .overflow-hidden{overflow:hidden !important;} .overflow-visible{overflow:visible !important;} .overflow-scroll{overflow:scroll !important;} .overflow-x-auto{overflow-x:auto !important;} .overflow-x-hidden{overflow-x:hidden !important;} .overflow-x-visible{overflow-x:visible !important;} .overflow-x-scroll{overflow-x:scroll !important;} .overflow-y-auto{overflow-y:auto !important;} .overflow-y-hidden{overflow-y:hidden !important;} .overflow-y-visible{overflow-y:visible !important;} .overflow-y-scroll{overflow-y:scroll !important;} :root{--animation-duration-fast:200ms;--animation-duration-normal:300ms;--animation-duration-slow:500ms;--ease-out-cubic:cubic-bezier(0.4, 0, 0.2, 1);--ease-in-cubic:cubic-bezier(0.4, 0, 1, 1);--ease-in-out-cubic:cubic-bezier(0.4, 0, 0.2, 1);--ease-bounce:cubic-bezier(0.68, -0.55, 0.265, 1.55);--transform-scale-hover:1.02;--transform-scale-active:0.98;--transform-translate-hover:-2px;} @keyframes headerSlideDown{from{transform:translateY(-100%);opacity:0;} to{transform:translateY(0);opacity:1;}} .site-header{animation:headerSlideDown var(--animation-duration-normal) var(--ease-out-cubic);} .nav-list a{position:relative;overflow:hidden;} .nav-list a::before{content:'';position:absolute;bottom:0;left:50%;width:0;height:2px;background:var(--color-accent-primary, #1664FF);transition:all var(--animation-duration-normal) var(--ease-out-cubic);transform:translateX(-50%);} .nav-list a:hover::before, .nav-list a:focus::before, .nav-list a.active::before{width:80%;} @keyframes themeTogglePulse{0%{box-shadow:0 0 0 0 rgba(22, 100, 255, 0.4);} 70%{box-shadow:0 0 0 10px rgba(22, 100, 255, 0);} 100%{box-shadow:0 0 0 0 rgba(22, 100, 255, 0);}} .theme-toggle-btn:active{animation:themeTogglePulse var(--animation-duration-slow) var(--ease-out-cubic);} @keyframes mobileMenuSlideDown{from{transform:translateY(-100%);opacity:0;} to{transform:translateY(0);opacity:1;}} @keyframes mobileMenuSlideUp{from{transform:translateY(0);opacity:1;} to{transform:translateY(-100%);opacity:0;}} .mobile-nav-menu.active{animation:mobileMenuSlideDown var(--animation-duration-normal) var(--ease-out-cubic);} .mobile-nav-menu.closing{animation:mobileMenuSlideUp var(--animation-duration-normal) var(--ease-out-cubic);} .mobile-nav-list a, .mobile-nav-list button{opacity:0;transform:translateX(-20px);animation:mobileMenuItemSlideIn var(--animation-duration-normal) var(--ease-out-cubic) forwards;} @keyframes mobileMenuItemSlideIn{to{opacity:1;transform:translateX(0);}} .mobile-nav-menu.active .mobile-nav-list li:nth-child(1) a, .mobile-nav-menu.active .mobile-nav-list li:nth-child(1) button{animation-delay:50ms;} .mobile-nav-menu.active .mobile-nav-list li:nth-child(2) a, .mobile-nav-menu.active .mobile-nav-list li:nth-child(2) button{animation-delay:100ms;} .mobile-nav-menu.active .mobile-nav-list li:nth-child(3) a, .mobile-nav-menu.active .mobile-nav-list li:nth-child(3) button{animation-delay:150ms;} .mobile-nav-menu.active .mobile-nav-list li:nth-child(4) a, .mobile-nav-menu.active .mobile-nav-list li:nth-child(4) button{animation-delay:200ms;} .mobile-nav-menu.active .mobile-nav-list li:nth-child(5) a, .mobile-nav-menu.active .mobile-nav-list li:nth-child(5) button{animation-delay:250ms;} .mobile-nav-toggle span{transform-origin:center;} @keyframes hamburgerToX1{0%{transform:rotate(0) translate(0, 0);} 50%{transform:rotate(0) translate(0, 6px);} 100%{transform:rotate(45deg) translate(5px, 5px);}} @keyframes hamburgerToX3{0%{transform:rotate(0) translate(0, 0);} 50%{transform:rotate(0) translate(0, -6px);} 100%{transform:rotate(-45deg) translate(7px, -6px);}} @keyframes xToHamburger1{0%{transform:rotate(45deg) translate(5px, 5px);} 50%{transform:rotate(0) translate(0, 6px);} 100%{transform:rotate(0) translate(0, 0);}} @keyframes xToHamburger3{0%{transform:rotate(-45deg) translate(7px, -6px);} 50%{transform:rotate(0) translate(0, -6px);} 100%{transform:rotate(0) translate(0, 0);}} .mobile-nav-toggle.active span:nth-child(1){animation:hamburgerToX1 var(--animation-duration-normal) var(--ease-out-cubic) forwards;} .mobile-nav-toggle.active span:nth-child(2){animation:fadeOut var(--animation-duration-fast) var(--ease-out-cubic) forwards;} .mobile-nav-toggle.active span:nth-child(3){animation:hamburgerToX3 var(--animation-duration-normal) var(--ease-out-cubic) forwards;} .mobile-nav-toggle:not(.active) span:nth-child(1){animation:xToHamburger1 var(--animation-duration-normal) var(--ease-out-cubic) forwards;} .mobile-nav-toggle:not(.active) span:nth-child(2){animation:fadeIn var(--animation-duration-fast) var(--ease-out-cubic) forwards;} .mobile-nav-toggle:not(.active) span:nth-child(3){animation:xToHamburger3 var(--animation-duration-normal) var(--ease-out-cubic) forwards;} @keyframes fadeOut{to{opacity:0;transform:scale(0);}} @keyframes fadeIn{from{opacity:0;transform:scale(0);} to{opacity:1;transform:scale(1);}} .hover-lift{transition:transform var(--animation-duration-fast) var(--ease-out-cubic), box-shadow var(--animation-duration-fast) var(--ease-out-cubic);} .hover-lift:hover{transform:translateY(var(--transform-translate-hover));box-shadow:0 4px 12px var(--color-shadow-medium, rgba(0, 0, 0, 0.12));} .hover-scale{transition:transform var(--animation-duration-fast) var(--ease-out-cubic);} .hover-scale:hover{transform:scale(var(--transform-scale-hover));} .hover-scale:active{transform:scale(var(--transform-scale-active));} .focus-glow:focus{box-shadow:0 0 0 3px rgba(22, 100, 255, 0.3);transition:box-shadow var(--animation-duration-fast) var(--ease-out-cubic);} @keyframes spin{from{transform:rotate(0deg);} to{transform:rotate(360deg);}} .spinner{animation:spin 1s linear infinite;} @keyframes pulse{0%, 100%{opacity:1;} 50%{opacity:0.5;}} .pulse{animation:pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;} @keyframes fadeIn{from{opacity:0;} to{opacity:1;}} .fade-in{animation:fadeIn var(--animation-duration-normal) var(--ease-out-cubic);} @keyframes slideUp{from{opacity:0;transform:translateY(30px);} to{opacity:1;transform:translateY(0);}} .slide-up{animation:slideUp var(--animation-duration-normal) var(--ease-out-cubic);} @keyframes slideInLeft{from{opacity:0;transform:translateX(-30px);} to{opacity:1;transform:translateX(0);}} .slide-in-left{animation:slideInLeft var(--animation-duration-normal) var(--ease-out-cubic);} @keyframes slideInRight{from{opacity:0;transform:translateX(30px);} to{opacity:1;transform:translateX(0);}} .slide-in-right{animation:slideInRight var(--animation-duration-normal) var(--ease-out-cubic);} @keyframes scaleIn{from{opacity:0;} to{opacity:1;}} .scale-in{animation:scaleIn var(--animation-duration-normal) var(--ease-out-cubic);} .stagger-1{animation-delay:100ms;} .stagger-2{animation-delay:200ms;} .stagger-3{animation-delay:300ms;} .stagger-4{animation-delay:400ms;} .stagger-5{animation-delay:500ms;} @media (prefers-reduced-motion:reduce){*, *::before, *::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important;} .hover-lift:hover, .hover-scale:hover, .hover-scale:active{transform:none;} .site-header{animation:none;} .mobile-nav-menu.active{animation:none;transform:translateY(0);opacity:1;visibility:visible;} .mobile-nav-list a, .mobile-nav-list button{animation:none;opacity:1;transform:translateX(0);}} @media (prefers-contrast:high){.nav-list a::before{background:currentColor;} .focus-glow:focus{box-shadow:0 0 0 3px currentColor;}} .animate-none{animation:none !important;} .animate-pause{animation-play-state:paused !important;} .animate-resume{animation-play-state:running !important;} .transition-none{transition:none !important;} .transition-all{transition:all var(--animation-duration-normal) var(--ease-out-cubic);} .transition-colors{transition:color var(--animation-duration-fast) var(--ease-out-cubic), background-color var(--animation-duration-fast) var(--ease-out-cubic), border-color var(--animation-duration-fast) var(--ease-out-cubic);} .transition-transform{transition:transform var(--animation-duration-fast) var(--ease-out-cubic);} .transition-opacity{transition:opacity var(--animation-duration-fast) var(--ease-out-cubic);} .duration-fast{animation-duration:var(--animation-duration-fast) !important;transition-duration:var(--animation-duration-fast) !important;} .duration-normal{animation-duration:var(--animation-duration-normal) !important;transition-duration:var(--animation-duration-normal) !important;} .duration-slow{animation-duration:var(--animation-duration-slow) !important;transition-duration:var(--animation-duration-slow) !important;} .ease-linear{animation-timing-function:linear !important;transition-timing-function:linear !important;} .ease-in{animation-timing-function:var(--ease-in-cubic) !important;transition-timing-function:var(--ease-in-cubic) !important;} .ease-out{animation-timing-function:var(--ease-out-cubic) !important;transition-timing-function:var(--ease-out-cubic) !important;} .ease-in-out{animation-timing-function:var(--ease-in-out-cubic) !important;transition-timing-function:var(--ease-in-out-cubic) !important;} .ease-bounce{animation-timing-function:var(--ease-bounce) !important;transition-timing-function:var(--ease-bounce) !important;} /* ===== ==== COMING SOON CARD EFFECTS ===== */ @keyframes frostGlassShimmer{0%{background-position:-200% 0;} 100%{background-position:200% 0;}} .theme-corporate .project-card.coming-soon .shimmer-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.4) 50%, transparent 100%);background-size:200% 100%;animation:frostGlassShimmer 3s infinite;pointer-events:none;z-index:1;} @supports (backdrop-filter:blur(10px)){.theme-corporate .project-card.coming-soon{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);} .theme-corporate .project-card.coming-soon::before{backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);} .theme-corporate .project-card.coming-soon:hover::before{backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);}} @supports not (backdrop-filter:blur(10px)){.theme-corporate .project-card.coming-soon{background:rgba(255, 255, 255, 0.9);box-shadow:0 8px 32px rgba(0, 0, 0, 0.1);} .theme-corporate .project-card.coming-soon::before{background:linear-gradient(135deg, rgba(255, 255, 255, 0.3) 0%, rgba(22, 100, 255, 0.1) 50%, rgba(255, 255, 255, 0.3) 100%);}} @keyframes glassReflection{from{transform:translateX(-100%) skewX(-15deg);opacity:0;} 50%{opacity:1;} 100%{transform:translateX(100%) skewX(-15deg);opacity:0;}} .theme-corporate .project-card.coming-soon .glass-reflection{position:absolute;top:0;left:0;width:50%;height:100%;background:linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.6) 50%, transparent 100%);animation:glassReflection 4s infinite;pointer-events:none;z-index:2;} @keyframes floatingParticles{0%{transform:translateY(0) rotate(0deg);opacity:0.3;} 50%{opacity:0.6;} 100%{transform:translateY(-20px) rotate(360deg);opacity:0.3;}} .theme-corporate .project-card.coming-soon .floating-particles{position:absolute;top:0;left:0;right:0;bottom:0;background-image:radial-gradient(circle at 20% 30%, rgba(22, 100, 255, 0.1) 2px, transparent 2px), radial-gradient(circle at 80% 70%, rgba(22, 100, 255, 0.08) 1px, transparent 1px), radial-gradient(circle at 40% 80%, rgba(22, 100, 255, 0.06) 1.5px, transparent 1.5px);background-size:80px 80px, 120px 120px, 160px 160px;animation:floatingParticles 15s linear infinite;pointer-events:none;z-index:1;opacity:0.4;} @keyframes comingSoonPulse{0%{opacity:1;transform:scale(1);box-shadow:0 0 0 0 currentColor;} 50%{opacity:0.7;transform:scale(1.1);box-shadow:0 0 0 4px transparent;} 100%{opacity:1;transform:scale(1);box-shadow:0 0 0 0 currentColor;}} .theme-corporate .project-card.coming-soon .status-indicator{animation:comingSoonPulse 2.5s infinite;} .theme-corporate .project-card.coming-soon:hover .project-description{animation:textReveal 0.5s ease-out forwards;} .theme-corporate .project-card.coming-soon:hover{animation:cardLiftGlow 0.3s ease-out forwards;} @keyframes cardLiftGlow{from{transform:translateY(0);box-shadow:0 4px 12px rgba(0, 0, 0, 0.08);} to{transform:translateY(-6px);box-shadow:0 16px 40px rgba(22, 100, 255, 0.15), 0 0 20px rgba(22, 100, 255, 0.1);}} @keyframes morphingBorder{0%{border-radius:1.25rem;} 50%{border-radius:1.5rem 1rem 1.5rem 1rem;} 100%{border-radius:1.25rem;}} .theme-corporate .project-card.coming-soon:hover{animation:morphingBorder 2s ease-in-out infinite;} @media (prefers-reduced-motion:reduce){.theme-corporate .project-card.coming-soon .shimmer-overlay, .theme-corporate .project-card.coming-soon .glass-reflection, .theme-corporate .project-card.coming-soon .floating-particles{animation:none;} .theme-corporate .project-card.coming-soon .status-indicator{animation:none;} .theme-corporate .project-card.coming-soon:hover .project-description{animation:none;filter:blur(0);opacity:1;} .theme-corporate .project-card.coming-soon:hover{animation:none;transform:none;}} @media (prefers-contrast:high){.theme-corporate .project-card.coming-soon{background:var(--color-bg-primary, #FFFFFF);border:2px solid var(--color-border-secondary, #D0D0D0);} .theme-corporate .project-card.coming-soon::before, .theme-corporate .project-card.coming-soon .shimmer-overlay, .theme-corporate .project-card.coming-soon .glass-reflection, .theme-corporate .project-card.coming-soon .floating-particles{display:none;} .theme-corporate .project-card.coming-soon .project-description{filter:none;opacity:1;}} /* ===== JAVASCRIPT-ENHANCED EFFECTS ===== */ @keyframes fadeInUp{from{opacity:0;transform:translateY(30px);} to{opacity:1;transform:translateY(0);}} .fade-in-up{opacity:0;animation:fadeInUp 0.6s ease-out forwards;} .fade-in-up.animate-in{animation-play-state:running;} .theme-corporate .project-card.coming-soon.enhanced-hover{transform:translateY(-8px) scale(1.02);box-shadow:0 20px 50px rgba(22, 100, 255, 0.2), 0 0 30px rgba(22, 100, 255, 0.1);border-color:rgba(22, 100, 255, 0.4);} .theme-corporate .project-card.coming-soon.enhanced-hover::before{opacity:0.9;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);} .theme-corporate .project-card.coming-soon.enhanced-hover .project-description{filter:blur(0);opacity:1;transform:translateY(-2px);} .theme-corporate .project-card.coming-soon.mobile-active{transform:translateY(-4px);box-shadow:0 12px 30px rgba(22, 100, 255, 0.15);border-color:rgba(22, 100, 255, 0.3);} .theme-corporate .project-card.coming-soon.keyboard-focus{outline:3px solid var(--color-accent-primary, #1664FF);outline-offset:4px;transform:translateY(-4px);box-shadow:0 12px 30px rgba(22, 100, 255, 0.15), 0 0 0 3px rgba(22, 100, 255, 0.3);} .theme-corporate .project-card.coming-soon.keyboard-focus .project-description{filter:blur(0);opacity:1;} @keyframes cardUpdate{0%{transform:scale(1);opacity:1;} 50%{transform:scale(1.05);opacity:0.8;} 100%{transform:scale(1);opacity:1;}} .theme-corporate .project-card.coming-soon.updating{animation:cardUpdate 0.5s ease-in-out;} @keyframes ripple{from{transform:scale(0);opacity:1;} to{transform:scale(1);opacity:0;}} .theme-corporate .project-card.coming-soon .shimmer-overlay{animation-play-state:paused;} .theme-corporate .project-card.coming-soon.animate-in .shimmer-overlay{animation-play-state:running;} .theme-corporate .project-card.coming-soon .glass-reflection{animation-delay:1s;} .theme-corporate .project-card.coming-soon .floating-particles{opacity:0;transition:opacity 0.5s ease;} .theme-corporate .project-card.coming-soon.animate-in .floating-particles{opacity:0.4;} .theme-corporate .project-card.coming-soon:hover .floating-particles{opacity:0.6;} .theme-corporate .project-card.coming-soon.enhanced-hover .status-indicator, .theme-corporate .project-card.coming-soon.keyboard-focus .status-indicator{animation:comingSoonPulse 1.5s infinite;transform:scale(1.1);} .theme-corporate .project-card.coming-soon.enhanced-hover .card-title, .theme-corporate .project-card.coming-soon.keyboard-focus .card-title{color:var(--color-accent-primary, #1664FF);transform:translateY(-1px);} .theme-corporate .project-card.coming-soon.enhanced-hover .card-title::after, .theme-corporate .project-card.coming-soon.keyboard-focus .card-title::after{opacity:1;width:100%;} .theme-corporate .project-card.coming-soon .card-title, .theme-corporate .project-card.coming-soon .project-description, .theme-corporate .project-card.coming-soon .status-indicator{transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);} .sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important;} @media (prefers-contrast:high){.theme-corporate .project-card.coming-soon.enhanced-hover, .theme-corporate .project-card.coming-soon.keyboard-focus{border-width:3px;border-color:var(--color-accent-primary, #1664FF);} .theme-corporate .project-card.coming-soon.enhanced-hover .project-description, .theme-corporate .project-card.coming-soon.keyboard-focus .project-description{filter:none;opacity:1;background:rgba(22, 100, 255, 0.1);padding:0.5rem;border-radius:0.25rem;}} @media (prefers-reduced-motion:reduce){.fade-in-up{animation:none;opacity:1;transform:none;} .theme-corporate .project-card.coming-soon.enhanced-hover, .theme-corporate .project-card.coming-soon.mobile-active, .theme-corporate .project-card.coming-soon.keyboard-focus{transform:none;transition:none;} .theme-corporate .project-card.coming-soon.updating{animation:none;} .theme-corporate .project-card.coming-soon .card-title, .theme-corporate .project-card.coming-soon .project-description, .theme-corporate .project-card.coming-soon .status-indicator{transition:none;}} .keyboard-navigation .theme-corporate .project-card.coming-soon:focus{outline:3px solid var(--color-accent-primary, #1664FF);outline-offset:4px;} .theme-corporate .project-card.coming-soon.enhanced-hover, .theme-corporate .project-card.coming-soon.mobile-active, .theme-corporate .project-card.coming-soon.keyboard-focus{z-index:10;position:relative;} .theme-corporate .project-card.coming-soon.enhanced-hover::after, .theme-corporate .project-card.coming-soon.keyboard-focus::after{content:'';position:absolute;top:-2px;left:-2px;right:-2px;bottom:-2px;background:linear-gradient(45deg, rgba(22, 100, 255, 0.1) 0%, rgba(107, 115, 255, 0.1) 50%, rgba(22, 100, 255, 0.1) 100%);border-radius:1.5rem;z-index:-1;opacity:0;animation:glowPulse 2s infinite;} @keyframes glowPulse{0%, 100%{opacity:0;} 50%{opacity:1;}} .site-header{position:fixed;top:0;left:0;right:0;z-index:1000;background:var(--color-header-bg, rgba(255, 255, 255, 0.95));backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--color-header-border, #E5E5E5);box-shadow:0 2px 8px var(--color-shadow-light, rgba(0, 0, 0, 0.08));transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);} .site-header.scrolled{background:var(--color-bg-primary, #FFFFFF);box-shadow:0 4px 12px var(--color-shadow-medium, rgba(0, 0, 0, 0.12));} .header-content{display:flex;align-items:center;justify-content:space-between;padding:1rem 0;min-height:4rem;} .company-name h1, .company-name .logo{font-family:var(--font-primary, 'Inter', sans-serif);font-weight:var(--font-weight-bold, 700);font-size:2rem;color:var(--color-text-primary, #1C1C1C);margin:0;letter-spacing:-0.025em;transition:color 0.2s ease;} .company-name h1:hover, .company-name .logo:hover{color:var(--color-accent-primary, #1664FF);} @media (min-width:768px){.company-name h1, .company-name .logo{font-size:2.25rem;}} nav[role="navigation"]{display:flex;align-items:center;gap:2rem;} .nav-list{display:flex;align-items:center;gap:2rem;list-style:none;margin:0;padding:0;} .nav-list li{margin:0;} .nav-list a{font-family:var(--font-primary, 'Inter', sans-serif);font-weight:var(--font-weight-medium, 500);font-size:0.9375rem;color:var(--color-nav-link, #666666);text-decoration:none;padding:0.5rem 0.75rem;border-radius:0.375rem;transition:all 0.2s cubic-bezier(0.4, 0, 0.2, 1);position:relative;} .nav-list a:hover{color:var(--color-nav-link-hover, #1664FF);background-color:var(--color-accent-primary-light, #E8F2FF);transform:translateY(-1px);} .nav-list a:focus{outline:2px solid var(--color-accent-primary, #1664FF);outline-offset:2px;color:var(--color-nav-link-active, #1664FF);} .nav-list a.active, .nav-list a[aria-current="page"]{color:var(--color-nav-link-active, #1664FF);background-color:var(--color-accent-primary-light, #E8F2FF);} .contact-footer-section{background:linear-gradient(135deg, var(--color-bg-primary) 0%, var(--color-bg-secondary) 50%, var(--color-accent-primary-light) 100%);padding:var(--spacing-3xl) 0 var(--spacing-xl) 0;border-top:1px solid rgba(22, 100, 255, 0.1);} .contact-footer-content{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-lg);max-width:800px;margin:0 auto;text-align:center;} .contact-info{text-align:center;} .contact-title{font-size:1.75rem;font-weight:600;color:var(--color-text-primary);margin-bottom:var(--spacing-md);} .contact-email{font-size:1.5rem;font-weight:600;color:var(--color-accent-primary);text-decoration:none;transition:all 0.3s ease;padding:var(--spacing-md) var(--spacing-xl);border-radius:12px;background:rgba(255, 255, 255, 0.9);display:inline-block;box-shadow:0 4px 20px rgba(22, 100, 255, 0.1);border:1px solid rgba(22, 100, 255, 0.2);} .contact-email:hover{color:var(--color-accent-primary-hover);background:rgba(255, 255, 255, 1);transform:translateY(-2px);box-shadow:0 8px 30px rgba(22, 100, 255, 0.2);} .footer-links{text-align:center;} .footer-nav{display:flex;gap:var(--spacing-xl);flex-wrap:wrap;justify-content:center;margin-bottom:var(--spacing-md);} .footer-link{color:var(--color-text-secondary);text-decoration:none;font-size:0.95rem;transition:all 0.2s ease;padding:var(--spacing-sm) var(--spacing-md);border-radius:6px;} .footer-link:hover{color:var(--color-accent-primary);background:rgba(22, 100, 255, 0.08);transform:translateY(-1px);} .copyright-section{text-align:center;border-top:1px solid rgba(22, 100, 255, 0.1);padding-top:var(--spacing-md);margin-top:var(--spacing-md);width:100%;} .copyright{font-size:0.9rem;color:var(--color-text-tertiary);margin:0;} @media (max-width:768px){.contact-title{font-size:1.5rem;} .contact-email{font-size:1.25rem;padding:var(--spacing-sm) var(--spacing-lg);} .footer-nav{gap:var(--spacing-md);flex-direction:column;} .contact-footer-section{padding:var(--spacing-2xl) 0 var(--spacing-lg) 0;}} .hero-about{margin:var(--spacing-xl) 0;max-width:800px;margin-left:auto;margin-right:auto;} .about-compact{background:rgba(255, 255, 255, 0.05);backdrop-filter:blur(10px);border:1px solid rgba(22, 100, 255, 0.1);border-radius:16px;padding:var(--spacing-xl);transition:all 0.3s ease;} .about-compact:hover{background:rgba(255, 255, 255, 0.08);border-color:rgba(22, 100, 255, 0.2);transform:translateY(-2px);} .about-intro{font-size:1.1rem;line-height:1.6;color:var(--color-text-primary);margin:0;text-align:center;} .about-intro strong{color:var(--color-accent-primary);font-weight:600;} .about-tagline{font-size:1.05rem;line-height:1.5;color:var(--color-text-secondary);margin-top:var(--spacing-md);font-style:italic;} .hero-content{gap:var(--spacing-lg);} .hero-cta{margin-top:var(--spacing-xl);} .lumon-card{background:linear-gradient(135deg, var(--color-bg-secondary) 0%, rgba(26, 100, 255, 0.02) 100%);border:2px solid var(--color-accent-primary);border-radius:8px;padding:var(--spacing-xl);margin:var(--spacing-lg) 0;box-shadow:0 4px 20px rgba(22, 100, 255, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.1);transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);position:relative;overflow:hidden;height:auto;min-height:100%;display:flex;flex-direction:column;padding-bottom:var(--spacing-2xl);} .project-card-grid{display:grid;grid-template-rows:minmax(100px, auto) auto auto;gap:0.75rem;flex:1;} .lumon-card::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg, transparent, rgba(22, 100, 255, 0.1), transparent);transition:left 0.5s ease;} .lumon-card:hover{border-color:var(--color-accent-primary-hover);box-shadow:0 8px 30px rgba(22, 100, 255, 0.2), 0 0 20px rgba(22, 100, 255, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.2);transform:translateY(-4px);} .lumon-card:hover::before{left:100%;} .clickable-card{cursor:pointer;position:relative;} .clickable-card:focus{outline:3px solid var(--color-accent-primary);outline-offset:2px;} .clickable-card .project-name{color:var(--color-accent-primary);font-weight:600;font-size:1.25rem;transition:color 0.2s ease;} .clickable-card:hover .project-name{color:var(--color-accent-primary-hover);} .clickable-card::after{content:'↗';position:absolute;top:var(--spacing-md);right:var(--spacing-md);font-size:1.2rem;color:var(--color-accent-primary);opacity:0;transition:all 0.3s ease;transform:translateY(4px);} .clickable-card:hover::after{opacity:0.6;transform:translateY(0);} .lumon-card .card-title{color:var(--color-accent-primary);font-weight:600;font-size:1.25rem;margin-bottom:var(--spacing-md);text-shadow:0 0 10px rgba(22, 100, 255, 0.3);} .lumon-card .project-description{color:var(--color-text-primary);line-height:1.6;margin-bottom:var(--spacing-lg);} .lumon-card .project-status{display:flex;align-items:center;gap:var(--spacing-sm);} .lumon-card .status-indicator{width:8px;height:8px;border-radius:50%;background:var(--color-success);box-shadow:0 0 10px rgba(0, 200, 81, 0.5);} .lumon-card .status-indicator.pending{background:var(--color-warning);box-shadow:0 0 10px rgba(255, 167, 38, 0.5);} .lumon-card .status-text{font-size:0.9rem;color:var(--color-text-secondary);font-weight:500;} .project-link-wrapper{margin-top:var(--spacing-md);text-align:center;} .project-visit-btn{display:inline-flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-lg);background:linear-gradient(135deg, var(--color-accent-primary) 0%, var(--color-accent-primary-hover) 100%);color:white;border-radius:8px;font-weight:600;font-size:0.9rem;transition:all 0.3s ease;box-shadow:0 2px 8px rgba(22, 100, 255, 0.2);position:relative;overflow:hidden;pointer-events:none;} .project-visit-btn::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);transition:left 0.5s ease;} .clickable-card:hover .project-visit-btn{transform:translateY(-2px);box-shadow:0 4px 16px rgba(22, 100, 255, 0.3);background:linear-gradient(135deg, var(--color-accent-primary-hover) 0%, var(--color-accent-primary) 100%);} .clickable-card:hover .project-visit-btn::before{left:100%;} .clickable-card:active .project-visit-btn{transform:translateY(0);box-shadow:0 2px 8px rgba(22, 100, 255, 0.2);} .lumon-card.coming-soon.blurred{opacity:0.7;filter:blur(0.5px);border-color:rgba(22, 100, 255, 0.3);} .lumon-card.coming-soon.blurred::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(45deg, rgba(255, 255, 255, 0.05) 0%, rgba(22, 100, 255, 0.02) 50%, rgba(255, 255, 255, 0.05) 100%);pointer-events:none;z-index:1;} .lumon-card.coming-soon.blurred .card-content{position:relative;z-index:0;} .lumon-card.coming-soon.blurred:hover{opacity:0.85;filter:blur(0.2px);transform:translateY(-2px);} .org-chart-container{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-lg);padding:var(--spacing-md);} .org-level-1, .org-level-2, .org-level-3{display:flex;justify-content:center;gap:var(--spacing-xl);width:100%;} .org-node{display:flex;flex-direction:column;align-items:center;padding:var(--spacing-md);border-radius:12px;background:rgba(255, 255, 255, 0.9);border:2px solid var(--color-border-primary);min-width:100px;text-align:center;transition:all 0.3s ease;position:relative;} .org-node.parent{background:linear-gradient(135deg, var(--color-accent-primary) 0%, var(--color-accent-primary-hover) 100%);color:white;border-color:var(--color-accent-primary);box-shadow:0 4px 20px rgba(22, 100, 255, 0.3);} .org-node.active{border-color:var(--color-success);background:linear-gradient(135deg, rgba(0, 200, 81, 0.1) 0%, rgba(0, 200, 81, 0.05) 100%);} .org-node.coming-soon{border-color:var(--color-warning);background:linear-gradient(135deg, rgba(255, 167, 38, 0.1) 0%, rgba(255, 167, 38, 0.05) 100%);opacity:0.7;} .org-icon{font-size:1.5rem;margin-bottom:var(--spacing-xs);} .org-name{font-weight:600;font-size:0.9rem;margin-bottom:var(--spacing-xs);} .org-node.parent .org-name{color:white;} .org-status{font-size:0.75rem;padding:2px 8px;border-radius:12px;font-weight:500;} .org-status.active{background:var(--color-success);color:white;} .org-status.coming{background:var(--color-warning);color:white;} .org-connector{width:2px;height:20px;background:linear-gradient(to bottom, var(--color-accent-primary), transparent);margin:-10px 0;} .org-node:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(22, 100, 255, 0.15);} .org-level-2::before{content:'';position:absolute;top:-10px;left:50%;transform:translateX(-50%);width:60%;height:2px;background:linear-gradient(to right, transparent, var(--color-accent-primary), transparent);} .org-level-2{position:relative;} .mobile-nav-toggle{display:none;flex-direction:column;justify-content:center;align-items:center;width:2.5rem;height:2.5rem;background:transparent;border:none;cursor:pointer;padding:0;margin-left:1rem;} .mobile-nav-toggle span{display:block;width:1.5rem;height:2px;background:var(--color-text-primary, #1C1C1C);margin:2px 0;transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);transform-origin:center;} .mobile-nav-toggle.active span:nth-child(1){transform:rotate(45deg) translate(5px, 5px);} .mobile-nav-toggle.active span:nth-child(2){opacity:0;transform:scale(0);} .mobile-nav-toggle.active span:nth-child(3){transform:rotate(-45deg) translate(7px, -6px);} .mobile-nav-toggle:focus{outline:2px solid var(--color-accent-primary, #1664FF);outline-offset:2px;border-radius:0.25rem;} .mobile-nav-menu{position:absolute;top:100%;left:0;right:0;background:var(--color-bg-primary, #FFFFFF);border-bottom:1px solid var(--color-border-primary, #E5E5E5);box-shadow:0 8px 16px var(--color-shadow-medium, rgba(0, 0, 0, 0.12));transform:translateY(-100%);opacity:0;visibility:hidden;transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);z-index:999;} .mobile-nav-menu.active{transform:translateY(0);opacity:1;visibility:visible;} .mobile-nav-list{display:flex;flex-direction:column;list-style:none;margin:0;padding:1rem 0;} .mobile-nav-list li{margin:0;} .mobile-nav-list a{display:block;font-family:var(--font-primary, 'Inter', sans-serif);font-weight:var(--font-weight-medium, 500);font-size:1rem;color:var(--color-nav-link, #666666);text-decoration:none;padding:0.75rem 1.5rem;transition:all 0.2s ease;border-left:3px solid transparent;} .mobile-nav-list a:hover{color:var(--color-nav-link-hover, #1664FF);background-color:var(--color-accent-primary-light, #E8F2FF);border-left-color:var(--color-accent-primary, #1664FF);} .mobile-nav-list a:focus{outline:2px solid var(--color-accent-primary, #1664FF);outline-offset:-2px;color:var(--color-nav-link-active, #1664FF);} .mobile-nav-list a.active, .mobile-nav-list a[aria-current="page"]{color:var(--color-nav-link-active, #1664FF);background-color:var(--color-accent-primary-light, #E8F2FF);border-left-color:var(--color-accent-primary, #1664FF);} .mobile-nav-list .dark-mode-toggle{display:flex;align-items:center;width:100%;font-family:var(--font-primary, 'Inter', sans-serif);font-weight:var(--font-weight-medium, 500);font-size:1rem;color:var(--color-nav-link, #666666);text-decoration:none;padding:0.75rem 1.5rem;transition:all 0.2s ease;border-left:3px solid transparent;background:none;border-top:none;border-right:none;border-bottom:none;cursor:pointer;text-align:left;} .mobile-nav-list .dark-mode-toggle:hover{color:var(--color-nav-link-hover, #1664FF);background-color:var(--color-accent-primary-light, #E8F2FF);border-left-color:var(--color-accent-primary, #1664FF);} .mobile-nav-list .dark-mode-toggle:focus{outline:2px solid var(--color-accent-primary, #1664FF);outline-offset:-2px;color:var(--color-nav-link-active, #1664FF);} @media (max-width:991.98px){.nav-list{display:none;} .mobile-nav-toggle{display:flex;}} @media (min-width:992px){.mobile-nav-menu{display:none;} .mobile-nav-toggle{display:none;}} .theme-corporate body{padding-top:5rem;} @media (max-width:767.98px){.theme-corporate body{padding-top:4.5rem;} .header-content{padding:0.75rem 0;min-height:3.5rem;} .company-name h1, .company-name .logo{font-size:1.75rem;}} .skip-link{position:absolute;top:-40px;left:6px;background:var(--color-accent-primary, #1664FF);color:var(--color-text-inverse, #FFFFFF);padding:8px;text-decoration:none;border-radius:0 0 4px 4px;font-weight:var(--font-weight-medium, 500);z-index:1001;transition:top 0.2s ease;} .skip-link:focus{top:0;} html{scroll-behavior:smooth;} @media (prefers-reduced-motion:reduce){.site-header, .nav-list a, .theme-toggle-btn, .mobile-nav-toggle span, .mobile-nav-menu, .mobile-nav-list a{transition:none;} html{scroll-behavior:auto;} .theme-toggle-btn:hover .theme-icon{transform:none;} .nav-list a:hover{transform:none;} .theme-toggle-btn:hover{transform:none;}} @media (prefers-contrast:high){.site-header{border-bottom-width:2px;} .nav-list a, .mobile-nav-list a{border:1px solid transparent;} .nav-list a:hover, .nav-list a:focus, .mobile-nav-list a:hover, .mobile-nav-list a:focus{border-color:currentColor;} .theme-toggle-btn{border-width:2px;}} .theme-corporate .lumon-terminal{padding-top:0;} .theme-corporate .terminal-screen{padding-top:0;} .site-header{z-index:1000;} .theme-corporate .lumon-terminal{background:none;padding:0;min-height:100vh;} .theme-corporate .terminal-screen{background:none;padding:0;border:none;box-shadow:none;min-height:100vh;} .theme-corporate .welcome-message{background:none;border:none;padding:0;margin:0;box-shadow:none;} .theme-corporate .hero{margin-top:-5rem;padding-top:7rem;} @media (max-width:767.98px){.theme-corporate .hero{margin-top:-4.5rem;padding-top:6rem;}} .hero{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--gradient-hero);overflow:hidden;padding:2rem 0;} .hero::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 30% 20%, rgba(22, 100, 255, 0.05) 0%, transparent 50%), radial-gradient(circle at 70% 80%, rgba(22, 100, 255, 0.03) 0%, transparent 50%);pointer-events:none;z-index:1;} .hero .container{position:relative;z-index:2;} .hero-content{text-align:center;max-width:800px;margin:0 auto;padding:2rem 1rem;} .hero-title{font-family:var(--font-primary, 'Inter', sans-serif);font-weight:var(--font-weight-bold, 700);font-size:clamp(2.5rem, 5vw, 4rem);line-height:1.1;color:var(--color-text-primary, #1C1C1C);margin:0 0 1.5rem 0;letter-spacing:-0.02em;position:relative;} .hero-title .typewriter{display:inline-block;opacity:0;animation:typewriterFadeIn 0.8s ease-out 0.5s forwards;} .hero-title .cursor{display:inline-block;width:3px;height:1em;background:var(--color-accent-primary, #1664FF);margin-left:2px;animation:cursorBlink 1.5s infinite;vertical-align:text-bottom;} @keyframes typewriterFadeIn{from{opacity:0;transform:translateY(20px);} to{opacity:1;transform:translateY(0);}} @keyframes cursorBlink{0%, 50%{opacity:1;} 51%, 100%{opacity:0;}} .hero-subtitle{font-family:var(--font-primary, 'Inter', sans-serif);font-weight:var(--font-weight-regular, 400);font-size:clamp(1.125rem, 2.5vw, 1.375rem);line-height:1.6;color:var(--color-text-secondary, #666666);margin:0 0 2.5rem 0;max-width:600px;margin-left:auto;margin-right:auto;opacity:0;animation:heroSubtitleSlideIn 0.8s ease-out 1s forwards;} @keyframes heroSubtitleSlideIn{from{opacity:0;transform:translateY(20px);} to{opacity:1;transform:translateY(0);}} .hero-cta{opacity:0;animation:heroCTASlideIn 0.8s ease-out 1.5s forwards;} .cta-button{display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-primary, 'Inter', sans-serif);font-weight:var(--font-weight-semibold, 600);font-size:1.125rem;color:var(--color-text-inverse, #FFFFFF);background:var(--color-accent-primary, #1664FF);text-decoration:none;padding:1rem 2.5rem;border-radius:0.75rem;border:none;cursor:pointer;transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);position:relative;overflow:hidden;box-shadow:0 4px 12px rgba(22, 100, 255, 0.3);min-width:160px;} .cta-button::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);transition:left 0.6s ease;} .cta-button:hover{background:var(--color-accent-primary-hover, #0052CC);transform:translateY(-2px);box-shadow:0 8px 20px rgba(22, 100, 255, 0.4);} .cta-button:hover::before{left:100%;} .cta-button:focus{outline:2px solid var(--color-accent-primary, #1664FF);outline-offset:4px;} .cta-button:active{transform:translateY(-1px);box-shadow:0 6px 16px rgba(22, 100, 255, 0.35);} @keyframes heroCTASlideIn{from{opacity:0;transform:translateY(20px);} to{opacity:1;transform:translateY(0);}} .hero::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background-image:radial-gradient(circle at 20% 30%, rgba(22, 100, 255, 0.1) 1px, transparent 1px), radial-gradient(circle at 80% 70%, rgba(22, 100, 255, 0.08) 1px, transparent 1px), radial-gradient(circle at 40% 80%, rgba(22, 100, 255, 0.06) 1px, transparent 1px);background-size:100px 100px, 150px 150px, 200px 200px;animation:floatingParticles 20s linear infinite;pointer-events:none;z-index:1;opacity:0.5;} @keyframes floatingParticles{0%{transform:translateY(0) rotate(0deg);} 100%{transform:translateY(-20px) rotate(360deg);}} .hero-content{opacity:0;animation:heroContentFadeIn 1s ease-out 0.2s forwards;} @keyframes heroContentFadeIn{from{opacity:0;transform:translateY(30px);} to{opacity:1;transform:translateY(0);}} .cta-button{position:relative;overflow:hidden;} .cta-button::after{content:'';position:absolute;top:50%;left:50%;width:0;height:0;background:rgba(255, 255, 255, 0.3);border-radius:50%;transform:translate(-50%, -50%);transition:width 0.6s ease, height 0.6s ease;pointer-events:none;} .cta-button:active::after{width:300px;height:300px;} @keyframes ripple{from{transform:scale(0);opacity:1;} to{transform:scale(1);opacity:0;}} .hero-visible .hero-content{animation-play-state:running;} .hero .cta-button:focus-visible{outline:3px solid rgba(22, 100, 255, 0.5);outline-offset:4px;box-shadow:0 8px 20px rgba(22, 100, 255, 0.4), 0 0 0 3px rgba(22, 100, 255, 0.3);} @media (max-width:991.98px){.hero{min-height:90vh;padding:1.5rem 0;} .hero-content{padding:1.5rem 1rem;} .hero-title{font-size:clamp(2rem, 6vw, 3rem);margin-bottom:1.25rem;} .hero-subtitle{font-size:clamp(1rem, 3vw, 1.25rem);margin-bottom:2rem;} .cta-button{font-size:1rem;padding:0.875rem 2rem;}} @media (max-width:767.98px){.hero{min-height:80vh;padding:1rem 0;} .hero-content{padding:1rem 0.75rem;} .hero-title{font-size:clamp(1.75rem, 7vw, 2.5rem);margin-bottom:1rem;} .hero-subtitle{font-size:clamp(0.9375rem, 4vw, 1.125rem);margin-bottom:1.75rem;} .cta-button{font-size:0.9375rem;padding:0.75rem 1.75rem;min-width:140px;}} @media (max-width:479.98px){.hero{min-height:70vh;} .hero-title{font-size:clamp(1.5rem, 8vw, 2rem);} .hero-subtitle{font-size:clamp(0.875rem, 4.5vw, 1rem);} .cta-button{font-size:0.875rem;padding:0.625rem 1.5rem;min-width:120px;}} @media (prefers-contrast:high){.hero{background:var(--color-bg-primary, #FFFFFF);} .hero::before, .hero::after{display:none;} .cta-button{border:2px solid var(--color-accent-primary, #1664FF);}} @media (prefers-reduced-motion:reduce){.hero-title .typewriter{animation:none;opacity:1;transform:none;} .hero-title .cursor{animation:none;opacity:1;} .hero-subtitle{animation:none;opacity:1;transform:none;} .hero-cta{animation:none;opacity:1;transform:none;} .hero::after{animation:none;} .cta-button:hover{transform:none;} .cta-button:active{transform:none;} .cta-button::before{display:none;}} .theme-corporate #about{background:var(--color-bg-secondary, #FAFAFA);position:relative;overflow:hidden;} .theme-corporate #about::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 70% 30%, rgba(22, 100, 255, 0.02) 0%, transparent 50%);pointer-events:none;z-index:1;} .theme-corporate #about .container{position:relative;z-index:2;} .theme-corporate #about .section-title{font-family:var(--font-primary, 'Inter', sans-serif);font-weight:var(--font-weight-bold, 700);font-size:clamp(2rem, 4vw, 2.75rem);line-height:1.2;color:var(--color-text-primary, #1C1C1C);text-align:center;margin:0 0 3rem 0;letter-spacing:-0.02em;position:relative;} .theme-corporate #about .section-title::after{content:'';position:absolute;bottom:-0.75rem;left:50%;transform:translateX(-50%);width:4rem;height:3px;background:linear-gradient(90deg, var(--color-accent-primary, #1664FF) 0%, var(--color-accent-secondary, #6B73FF) 100%);border-radius:2px;} .theme-corporate #about .about-content{display:grid;grid-template-columns:1fr;gap:2rem;max-width:1000px;margin:0 auto;} @media (min-width:768px){.theme-corporate #about .about-content{grid-template-columns:1fr 1fr;gap:3rem;align-items:start;}} .theme-corporate #about .card{background:var(--color-bg-primary, #FFFFFF);border:1px solid var(--color-border-primary, #E5E5E5);border-radius:1rem;box-shadow:0 4px 12px var(--color-shadow-light, rgba(0, 0, 0, 0.08));transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);position:relative;overflow:hidden;} .theme-corporate #about .card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg, var(--color-accent-primary, #1664FF) 0%, var(--color-accent-secondary, #6B73FF) 100%);} .theme-corporate #about .card:hover{transform:translateY(-4px);box-shadow:0 8px 24px var(--color-shadow-medium, rgba(0, 0, 0, 0.12));border-color:var(--color-accent-primary-light, #E8F2FF);} .theme-corporate #about .card-content{padding:2.5rem;} .theme-corporate #about .about-description{font-family:var(--font-primary, 'Inter', sans-serif);font-weight:var(--font-weight-regular, 400);font-size:1.125rem;line-height:1.7;color:var(--color-text-primary, #1C1C1C);margin:0 0 1.5rem 0;} .theme-corporate #about .about-philosophy{margin:0 0 1.5rem 0;} .theme-corporate #about .about-philosophy p{font-family:var(--font-primary, 'Inter', sans-serif);font-weight:var(--font-weight-regular, 400);font-size:1rem;line-height:1.6;color:var(--color-text-secondary, #666666);margin:0;} .theme-corporate #about .about-mission{margin:0;position:relative;padding-left:1rem;} .theme-corporate #about .about-mission::before{content:'';position:absolute;left:0;top:0.5rem;width:3px;height:calc(100% - 1rem);background:linear-gradient(180deg, var(--color-accent-primary, #1664FF) 0%, var(--color-accent-secondary, #6B73FF) 100%);border-radius:2px;} .theme-corporate #about .about-mission p{font-family:var(--font-primary, 'Inter', sans-serif);font-weight:var(--font-weight-medium, 500);font-size:1rem;line-height:1.6;color:var(--color-text-primary, #1C1C1C);margin:0;} .theme-corporate #about strong{font-weight:var(--font-weight-semibold, 600);color:var(--color-accent-primary, #1664FF);position:relative;} .theme-corporate #about strong::after{content:'';position:absolute;bottom:-2px;left:0;right:0;height:2px;background:linear-gradient(90deg, var(--color-accent-primary-light, #E8F2FF) 0%, transparent 100%);border-radius:1px;} @media (min-width:768px){.theme-corporate #about .about-content .card{grid-column:span 2;} .theme-corporate #about .card-content{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:start;} .theme-corporate #about .about-description{grid-column:span 2;font-size:1.25rem;margin-bottom:2rem;text-align:center;} .theme-corporate #about .about-philosophy{margin-bottom:0;} .theme-corporate #about .about-mission{margin-bottom:0;}} .theme-corporate #about .card-content::after{content:'';position:absolute;bottom:1rem;right:1rem;width:2rem;height:2rem;background:radial-gradient(circle, var(--color-accent-primary-light, #E8F2FF) 0%, transparent 70%);border-radius:50%;opacity:0.5;} .theme-corporate #about .card{opacity:0;transform:translateY(30px);animation:aboutCardFadeIn 0.8s ease-out 0.3s forwards;} @keyframes aboutCardFadeIn{from{opacity:0;transform:translateY(30px);} to{opacity:1;transform:translateY(0);}} @media (max-width:767.98px){.theme-corporate #about .section-title{font-size:clamp(1.75rem, 5vw, 2.25rem);margin-bottom:2rem;} .theme-corporate #about .card-content{padding:2rem 1.5rem;} .theme-corporate #about .about-description{font-size:1rem;margin-bottom:1.25rem;} .theme-corporate #about .about-philosophy p, .theme-corporate #about .about-mission p{font-size:0.9375rem;}} @media (max-width:479.98px){.theme-corporate #about .card-content{padding:1.5rem 1rem;} .theme-corporate #about .about-description{font-size:0.9375rem;} .theme-corporate #about .about-philosophy p, .theme-corporate #about .about-mission p{font-size:0.875rem;}} @media (prefers-contrast:high){.theme-corporate #about{background:var(--color-bg-primary, #FFFFFF);} .theme-corporate #about::before{display:none;} .theme-corporate #about .card{border-width:2px;} .theme-corporate #about .section-title::after{background:var(--color-accent-primary, #1664FF);}} @media (prefers-reduced-motion:reduce){.theme-corporate #about .card{animation:none;opacity:1;transform:none;} .theme-corporate #about .card:hover{transform:none;}} .theme-corporate #projects{background:var(--color-bg-primary, #FFFFFF);position:relative;overflow:hidden;} .theme-corporate #projects::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 30% 70%, rgba(22, 100, 255, 0.02) 0%, transparent 50%);pointer-events:none;z-index:1;} .theme-corporate #projects .container{position:relative;z-index:2;} .theme-corporate #projects .section-title{font-family:var(--font-primary, 'Inter', sans-serif);font-weight:var(--font-weight-bold, 700);font-size:clamp(2rem, 4vw, 2.75rem);line-height:1.2;color:var(--color-text-primary, #1C1C1C);text-align:center;margin:0 0 3rem 0;letter-spacing:-0.02em;position:relative;} .theme-corporate #projects .section-title::after{content:'';position:absolute;bottom:-0.75rem;left:50%;transform:translateX(-50%);width:4rem;height:3px;background:linear-gradient(90deg, var(--color-accent-primary, #1664FF) 0%, var(--color-accent-secondary, #6B73FF) 100%);border-radius:2px;} .theme-corporate #projects .subsection-title{font-family:var(--font-primary, 'Inter', sans-serif);font-weight:var(--font-weight-semibold, 600);font-size:clamp(1.5rem, 3vw, 1.875rem);line-height:1.3;color:var(--color-text-primary, #1C1C1C);margin:0 0 2rem 0;letter-spacing:-0.01em;position:relative;padding-left:1rem;} .theme-corporate #projects .subsection-title::before{content:'';position:absolute;left:0;top:0.5rem;width:4px;height:calc(100% - 1rem);background:linear-gradient(180deg, var(--color-accent-primary, #1664FF) 0%, var(--color-accent-secondary, #6B73FF) 100%);border-radius:2px;} .theme-corporate #projects .projects-grid{display:grid;gap:2rem;margin-bottom:4rem;} .theme-corporate #projects .projects-grid.grid-2{grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));} .theme-corporate #projects .projects-grid.grid-3{grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));} @media (min-width:768px){.theme-corporate #projects .projects-grid{gap:2.5rem;}} @media (min-width:1200px){.theme-corporate #projects .projects-grid.grid-2{grid-template-columns:repeat(2, 1fr);} .theme-corporate #projects .projects-grid.grid-3{grid-template-columns:repeat(3, 1fr);}} .theme-corporate .project-card{background:var(--color-bg-primary, #FFFFFF);border:1px solid var(--color-border-primary, #E5E5E5);border-radius:1.25rem;box-shadow:0 4px 12px var(--color-shadow-light, rgba(0, 0, 0, 0.08));transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);position:relative;height:100%;display:flex;flex-direction:column;} .theme-corporate .project-card:hover{transform:translateY(-8px);box-shadow:0 12px 32px var(--color-shadow-medium, rgba(0, 0, 0, 0.15));border-color:var(--color-accent-primary-light, #E8F2FF);} .theme-corporate .project-card:hover::before{opacity:1;transform:scale(1);} .theme-corporate .project-card .card-header{padding:2rem 2rem 1rem 2rem;position:relative;z-index:2;} .theme-corporate .project-card .card-title{font-family:var(--font-primary, 'Inter', sans-serif);font-weight:var(--font-weight-bold, 700);font-size:1.5rem;line-height:1.3;margin:0;color:var(--color-text-primary, #1C1C1C);letter-spacing:-0.01em;} .theme-corporate .project-card .card-title a{color:inherit;text-decoration:none;transition:color 0.2s ease;position:relative;} .theme-corporate .project-card .card-title a:hover{color:var(--color-accent-primary, #1664FF);} .theme-corporate .project-card .card-title a:focus{outline:2px solid var(--color-accent-primary, #1664FF);outline-offset:2px;border-radius:0.25rem;} .theme-corporate .project-card .card-content{padding:0 2rem 2rem 2rem;flex-grow:1;display:flex;flex-direction:column;justify-content:space-between;position:relative;z-index:2;} .theme-corporate .project-card .project-description{font-family:var(--font-primary, 'Inter', sans-serif);font-weight:var(--font-weight-regular, 400);font-size:1rem;line-height:1.6;color:var(--color-text-secondary, #666666);margin:0 0 1.5rem 0;flex-grow:1;} .theme-corporate .project-card .project-status{display:flex;align-items:center;gap:0.5rem;margin-top:auto;} .theme-corporate .project-card .status-indicator{width:0.75rem;height:0.75rem;border-radius:50%;display:inline-block;position:relative;} .theme-corporate .project-card .status-indicator::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;border-radius:50%;animation:statusPulse 2s infinite;} .theme-corporate .project-card .status-indicator.active{background:var(--color-success, #00C851);} .theme-corporate .project-card .status-indicator.active::after{background:var(--color-success, #00C851);} .theme-corporate .project-card .status-indicator.pending{background:var(--color-warning, #FFA726);} .theme-corporate .project-card .status-indicator.pending::after{background:var(--color-warning, #FFA726);} .theme-corporate .project-card .status-indicator.planned{background:var(--color-info, #2196F3);} .theme-corporate .project-card .status-indicator.planned::after{background:var(--color-info, #2196F3);} @keyframes statusPulse{0%{opacity:1;transform:scale(1);} 50%{opacity:0.5;transform:scale(1.2);} 100%{opacity:1;transform:scale(1);}} .theme-corporate .project-card .status-text{font-family:var(--font-primary, 'Inter', sans-serif);font-weight:var(--font-weight-medium, 500);font-size:0.875rem;color:var(--color-text-secondary, #666666);text-transform:uppercase;letter-spacing:0.05em;} .theme-corporate .project-card.active-project{position:relative;} .theme-corporate .project-card.coming-soon{position:relative;background:rgba(255, 255, 255, 0.7);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(229, 229, 229, 0.6);overflow:hidden;} .theme-corporate .project-card.coming-soon::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg, rgba(255, 255, 255, 0.1) 0%, rgba(22, 100, 255, 0.05) 50%, rgba(255, 255, 255, 0.1) 100%);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);opacity:0.6;transition:opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1);z-index:1;} .theme-corporate .project-card.coming-soon:hover::before{opacity:0.8;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);} .theme-corporate .project-card.coming-soon .card-header, .theme-corporate .project-card.coming-soon .card-content{position:relative;z-index:2;} .theme-corporate .project-card.coming-soon .project-description{filter:blur(0.5px);transition:filter 0.3s cubic-bezier(0.4, 0, 0.2, 1);opacity:0.8;} .theme-corporate .project-card.coming-soon:hover .project-description{filter:blur(0.2px);opacity:0.9;} .theme-corporate .project-card.coming-soon .card-title{color:var(--color-text-primary, #1C1C1C);opacity:0.9;position:relative;} .theme-corporate .project-card.coming-soon .card-title::after{content:'';position:absolute;bottom:-4px;left:0;right:0;height:2px;background:linear-gradient(90deg, var(--color-info, #2196F3) 0%, var(--color-warning, #FFA726) 100%);opacity:0.6;border-radius:1px;} .theme-corporate .project-card.coming-soon .project-status{position:relative;z-index:3;} .theme-corporate .project-card.coming-soon .status-text{font-weight:var(--font-weight-semibold, 600);color:var(--color-text-primary, #1C1C1C);opacity:0.9;} .theme-corporate .project-card.coming-soon::after{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.4) 50%, transparent 100%);animation:shimmer 3s infinite;z-index:1;} @keyframes shimmer{0%{left:-100%;} 100%{left:100%;}} .theme-corporate .project-card.coming-soon:hover{transform:translateY(-6px);box-shadow:0 16px 40px rgba(22, 100, 255, 0.15);border-color:rgba(22, 100, 255, 0.3);background:rgba(255, 255, 255, 0.8);} .theme-corporate .project-card.coming-soon .card-header::before{content:'';position:absolute;top:0;left:0;right:0;height:50%;background:linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, transparent 100%);pointer-events:none;z-index:1;} .theme-corporate .project-card.coming-soon{min-height:280px;} .theme-corporate .project-card.coming-soon .status-indicator.pending::after, .theme-corporate .project-card.coming-soon .status-indicator.planned::after{animation:statusPulse 2.5s infinite;} .theme-corporate .project-card.coming-soon .card-content::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background-image:radial-gradient(circle at 25% 25%, rgba(22, 100, 255, 0.03) 1px, transparent 1px), radial-gradient(circle at 75% 75%, rgba(22, 100, 255, 0.02) 1px, transparent 1px);background-size:20px 20px, 30px 30px;opacity:0.5;pointer-events:none;z-index:1;} @media (max-width:991.98px){.theme-corporate .project-card{min-height:260px;} .theme-corporate .project-card .card-header{padding:1.75rem 1.75rem 0.75rem 1.75rem;} .theme-corporate .project-card .card-content{padding:0 1.75rem 1.75rem 1.75rem;} .theme-corporate .project-card .card-title{font-size:1.375rem;} .theme-corporate .project-card .project-description{font-size:0.9375rem;}} @media (max-width:767.98px){.theme-corporate .project-card{min-height:240px;} .theme-corporate .project-card .card-header{padding:1.5rem 1.5rem 0.5rem 1.5rem;} .theme-corporate .project-card .card-content{padding:0 1.5rem 1.5rem 1.5rem;} .theme-corporate .project-card .card-title{font-size:1.25rem;} .theme-corporate .project-card .project-description{font-size:0.875rem;line-height:1.5;} .theme-corporate .project-card .status-text{font-size:0.8125rem;}} @media (max-width:479.98px){.theme-corporate .projects-grid.grid-2, .theme-corporate .projects-grid.grid-3{grid-template-columns:1fr;} .theme-corporate .project-card .card-header{padding:1rem 1rem 0.25rem 1rem;} .theme-corporate .project-card .card-content{padding:0 1rem 1rem 1rem;} .theme-corporate .project-card .card-title{font-size:1.125rem;} .theme-corporate .project-card .project-description{font-size:0.8125rem;}} @media (prefers-contrast:high){.theme-corporate .project-card{border-width:2px;} .theme-corporate .project-card:hover{border-color:var(--color-accent-primary, #1664FF);} .theme-corporate .project-card.active-project:first-child::before, .theme-corporate .project-card.active-project:last-child::before{background:var(--color-accent-primary, #1664FF);} .theme-corporate .project-card.coming-soon{background:var(--color-bg-secondary, #FAFAFA);backdrop-filter:none;}} @media (prefers-reduced-motion:reduce){.theme-corporate .project-card::after{animation:none;} .theme-corporate .project-card .status-indicator::after{animation:none;} .theme-corporate .project-card:hover{transform:none;} .theme-corporate .project-card .project-description{filter:none;transition:none;}} .theme-corporate .project-card:focus-within{outline:2px solid var(--color-accent-primary, #1664FF);outline-offset:2px;} .theme-corporate .project-card .card-title a:focus{outline:2px solid var(--color-accent-primary, #1664FF);outline-offset:2px;border-radius:0.25rem;} .theme-corporate .project-card .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;} .theme-corporate #contact{background:var(--color-bg-secondary, #FAFAFA);position:relative;overflow:hidden;} .theme-corporate #contact::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 50% 30%, rgba(22, 100, 255, 0.03) 0%, transparent 50%);pointer-events:none;z-index:1;} .theme-corporate #contact .container{position:relative;z-index:2;} .theme-corporate #contact .section-title{font-family:var(--font-primary, 'Inter', sans-serif);font-weight:var(--font-weight-bold, 700);font-size:clamp(2rem, 4vw, 2.75rem);line-height:1.2;color:var(--color-text-primary, #1C1C1C);text-align:center;margin:0 0 3rem 0;letter-spacing:-0.02em;position:relative;} .theme-corporate #contact .section-title::after{content:'';position:absolute;bottom:-0.75rem;left:50%;transform:translateX(-50%);width:4rem;height:3px;background:linear-gradient(90deg, var(--color-accent-primary, #1664FF) 0%, var(--color-accent-secondary, #6B73FF) 100%);border-radius:2px;} .theme-corporate #contact .contact-content{max-width:600px;margin:0 auto;} .theme-corporate #contact .card{background:var(--color-bg-primary, #FFFFFF);border:1px solid var(--color-border-primary, #E5E5E5);border-radius:1rem;box-shadow:0 4px 12px var(--color-shadow-light, rgba(0, 0, 0, 0.08));transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);position:relative;overflow:hidden;} .theme-corporate #contact .card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg, var(--color-accent-primary, #1664FF) 0%, var(--color-accent-secondary, #6B73FF) 100%);} .theme-corporate #contact .card:hover{transform:translateY(-4px);box-shadow:0 8px 24px var(--color-shadow-medium, rgba(0, 0, 0, 0.12));border-color:var(--color-accent-primary-light, #E8F2FF);} .theme-corporate #contact .card-content{padding:2.5rem;text-align:center;} .theme-corporate #contact .contact-intro{font-family:var(--font-primary, 'Inter', sans-serif);font-weight:var(--font-weight-medium, 500);font-size:1.25rem;line-height:1.5;color:var(--color-text-primary, #1C1C1C);margin:0 0 2rem 0;} .theme-corporate #contact .contact-details{margin:0 0 2rem 0;} .theme-corporate #contact .contact-item{margin:0 0 1rem 0;} .theme-corporate #contact .contact-label{font-family:var(--font-primary, 'Inter', sans-serif);font-weight:var(--font-weight-semibold, 600);font-size:1rem;color:var(--color-text-secondary, #666666);display:inline-block;margin-right:0.5rem;} .theme-corporate #contact .contact-link{font-family:var(--font-primary, 'Inter', sans-serif);font-weight:var(--font-weight-medium, 500);font-size:1.125rem;color:var(--color-accent-primary, #1664FF);text-decoration:none;transition:all 0.2s cubic-bezier(0.4, 0, 0.2, 1);position:relative;padding:0.5rem 1rem;border-radius:0.5rem;background:var(--color-accent-primary-light, #E8F2FF);} .theme-corporate #contact .contact-link:hover{color:var(--color-accent-primary-hover, #0052E6);background:var(--color-accent-primary, #1664FF);color:var(--color-text-inverse, #FFFFFF);transform:translateY(-2px);box-shadow:0 4px 12px rgba(22, 100, 255, 0.3);} .theme-corporate #contact .contact-link:focus{outline:2px solid var(--color-accent-primary, #1664FF);outline-offset:2px;} .theme-corporate #contact .contact-note{font-family:var(--font-primary, 'Inter', sans-serif);font-weight:var(--font-weight-regular, 400);font-size:0.9375rem;line-height:1.6;color:var(--color-text-secondary, #666666);margin:0;font-style:italic;} .theme-corporate .lumon-footer{background:var(--color-footer-bg, #FAFAFA);border-top:1px solid var(--color-footer-border, #E5E5E5);padding:2rem 0;margin-top:4rem;} .theme-corporate .lumon-footer .container{display:flex;flex-direction:column;align-items:center;gap:1rem;text-align:center;} .theme-corporate .lumon-footer .footer-text{font-family:var(--font-primary, 'Inter', sans-serif);font-weight:var(--font-weight-medium, 500);font-size:0.9375rem;color:var(--color-footer-text, #666666);margin:0;} .theme-corporate .lumon-footer .footer-accessibility{margin:0;} .theme-corporate .lumon-footer .footer-accessibility a{font-family:var(--font-primary, 'Inter', sans-serif);font-weight:var(--font-weight-regular, 400);font-size:0.875rem;color:var(--color-text-secondary, #666666);text-decoration:none;transition:color 0.2s cubic-bezier(0.4, 0, 0.2, 1);padding:0.25rem 0.5rem;border-radius:0.25rem;} .theme-corporate .lumon-footer .footer-accessibility a:hover{color:var(--color-accent-primary, #1664FF);background:var(--color-accent-primary-light, #E8F2FF);} .theme-corporate .lumon-footer .footer-accessibility a:focus{outline:2px solid var(--color-accent-primary, #1664FF);outline-offset:2px;} @media (min-width:768px){.theme-corporate .lumon-footer .container{flex-direction:row;justify-content:space-between;text-align:left;}} @media (max-width:767.98px){.theme-corporate .lumon-footer{padding:1.5rem 0;} .theme-corporate .lumon-footer .footer-text{font-size:0.875rem;} .theme-corporate .lumon-footer .footer-accessibility a{font-size:0.8125rem;}} .theme-corporate .section{padding:5rem 0;position:relative;} @media (max-width:991.98px){.theme-corporate .section{padding:4rem 0;}} @media (max-width:767.98px){.theme-corporate .section{padding:3rem 0;}} @media (max-width:479.98px){.theme-corporate .section{padding:2.5rem 0;}} .theme-corporate .container{max-width:1200px;margin:0 auto;padding:0 1.5rem;} @media (max-width:767.98px){.theme-corporate .container{padding:0 1rem;}} @media (max-width:479.98px){.theme-corporate .container{padding:0 0.75rem;}} .theme-corporate .grid{display:grid;gap:2rem;} .theme-corporate .grid-1{grid-template-columns:1fr;} .theme-corporate .grid-2{grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));} .theme-corporate .grid-3{grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));} @media (min-width:768px){.theme-corporate .grid{gap:2.5rem;}} @media (min-width:1200px){.theme-corporate .grid-2{grid-template-columns:repeat(2, 1fr);} .theme-corporate .grid-3{grid-template-columns:repeat(3, 1fr);}} body:not(.theme-corporate) .theme-corporate{display:none;} .theme-corporate .lumon-specific:not(.theme-corporate){display:none;} .sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important;} .skip-link{position:absolute;top:-40px;left:6px;background:var(--color-accent-primary, #1664FF);color:var(--color-text-inverse, #FFFFFF);padding:8px 16px;text-decoration:none;border-radius:4px;font-weight:var(--font-weight-medium, 500);z-index:10000;transform:translateY(-100%);transition:transform var(--transition-speed-fast, 150ms) var(--transition-easing-ease, ease);} .skip-link:focus{transform:translateY(0);top:6px;} .theme-corporate *:focus-visible{outline:2px solid var(--color-accent-primary, #1664FF);outline-offset:2px;border-radius:2px;} .theme-corporate *:focus{outline:none;} @media (prefers-contrast:high){.theme-corporate{--color-text-primary:#000000;--color-bg-primary:#FFFFFF;--color-accent-primary:#0000FF;--color-border-primary:#000000;} .theme-corporate .card, .theme-corporate .project-card, .theme-corporate .cta-button{border:2px solid var(--color-border-primary, #000000);}} @media (prefers-reduced-motion:reduce){.theme-corporate *, .theme-corporate *::before, .theme-corporate *::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important;} .theme-corporate .section-animate{transform:none !important;}} .theme-corporate .form-group{margin-bottom:1.5rem;} .theme-corporate .form-group label{display:block;margin-bottom:0.5rem;font-weight:var(--font-weight-medium, 500);color:var(--color-text-primary, #1C1C1C);} .theme-corporate .form-group label [aria-label="required"]{color:var(--color-error, #FF5252);font-weight:var(--font-weight-bold, 700);} .theme-corporate input:focus, .theme-corporate textarea:focus, .theme-corporate select:focus{border-color:var(--color-accent-primary, #1664FF);box-shadow:0 0 0 2px var(--color-accent-primary-light, #E8F2FF);outline:2px solid var(--color-accent-primary, #1664FF);outline-offset:2px;} .theme-corporate input:invalid, .theme-corporate textarea:invalid{border-color:var(--color-error, #FF5252);box-shadow:0 0 0 2px var(--color-error-light, #FFEBEE);} .theme-corporate .status-indicator{min-width:12px;min-height:12px;border:1px solid var(--color-border-primary, #E5E5E5);} .theme-corporate .status-indicator.active{background-color:var(--color-success, #00C851);border-color:var(--color-success-dark, #008A37);} .theme-corporate .status-indicator.pending{background-color:var(--color-warning, #FFA726);border-color:var(--color-warning-dark, #F57C00);} .theme-corporate .status-indicator.planned{background-color:var(--color-info, #2196F3);border-color:var(--color-info-dark, #1565C0);} .theme-corporate .cta-button, .theme-corporate .theme-toggle-btn, .theme-corporate .mobile-nav-toggle, .theme-corporate .copy-email-btn{min-height:44px;min-width:44px;} .theme-corporate .nav-list a, .theme-corporate .footer-link{padding:12px 8px;min-height:44px;display:flex;align-items:center;} .theme-corporate .error-message{color:var(--color-error, #FF5252);font-size:0.875rem;margin-top:0.25rem;display:block;} .theme-corporate .success-message{color:var(--color-success, #00C851);font-size:0.875rem;margin-top:0.25rem;display:block;} .theme-corporate [aria-hidden="true"]{speak:none;} .theme-corporate .logo{font-weight:var(--font-weight-bold, 700);font-size:1.5rem;color:var(--color-text-primary, #1C1C1C);text-decoration:none;display:inline-block;padding:8px 0;} .theme-corporate .logo:focus{outline:2px solid var(--color-accent-primary, #1664FF);outline-offset:2px;} .theme-corporate .hero-subtitle, .theme-corporate .section-subtitle, .theme-corporate .project-description{color:var(--color-text-secondary, #666666);} @media (max-width:768px){.theme-corporate .nav-list a, .theme-corporate .mobile-nav-list a{min-height:48px;padding:16px 12px;} .theme-corporate .cta-button{min-height:48px;padding:16px 24px;}} .theme-corporate .hero{display:flex !important;align-items:center !important;justify-content:center !important;text-align:center !important;min-height:100vh !important;} .theme-corporate .hero-content{width:100% !important;max-width:900px !important;margin:0 auto !important;text-align:center !important;} .theme-corporate .lumon-style-cards{display:grid !important;grid-template-columns:repeat(auto-fit, minmax(320px, 1fr)) !important;gap:2rem !important;margin-top:2rem !important;} @media (min-width:768px){.theme-corporate .lumon-style-cards{grid-template-columns:repeat(3, 1fr) !important;gap:2.5rem !important;}} .theme-corporate .lumon-card{display:flex !important;flex-direction:column !important;justify-content:space-between !important;max-width:100% !important;height:auto !important;min-height:380px !important;} .theme-corporate .lumon-card .card-content{flex:1 !important;display:flex !important;flex-direction:column !important;justify-content:space-between !important;} .theme-corporate .lumon-card .project-description{flex:1 !important;display:flex !important;align-items:center !important;} @media (max-width:767px){.theme-corporate .lumon-style-cards{grid-template-columns:1fr !important;gap:1.5rem !important;} .theme-corporate .lumon-card{aspect-ratio:1 / 1 !important;min-height:320px !important;}} .bento-grid-wrapper{display:grid;grid-template-columns:repeat(3, 1fr);grid-template-rows:auto auto;gap:1.5rem;margin-top:3rem;width:100%;} .bento-card{position:relative;background:rgba(255, 255, 255, 0.5);border:1px solid rgba(0, 0, 0, 0.1);border-radius:12px;padding:2rem;overflow:hidden;transition:transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.3s ease, border-color 0.3s ease;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:flex;flex-direction:column;text-decoration:none;color:inherit;} .parent-card{grid-column:1 / -1;min-height:200px;background:linear-gradient(145deg, #ffffff 0%, #f5f5f5 100%);border:1px solid rgba(0, 0, 0, 0.05);box-shadow:0 4px 20px rgba(0, 0, 0, 0.03);justify-content:center;} .parent-card .bento-content{display:flex;flex-direction:column;align-items:center;text-align:center;} .venture-card{min-height:240px;justify-content:space-between;} .bento-card:hover{transform:translateY(-4px);box-shadow:0 12px 30px -10px rgba(0, 0, 0, 0.1);} html[data-theme="dark"] .bento-card{background:rgba(18, 18, 18, 0.6);border-color:rgba(255, 255, 255, 0.08);} html[data-theme="dark"] .parent-card{background:linear-gradient(145deg, rgba(30, 36, 48, 0.7) 0%, rgba(18, 18, 18, 0.8) 100%);border:1px solid rgba(255, 255, 255, 0.1);} html[data-theme="dark"] .bento-card:hover{box-shadow:0 0 25px rgba(0, 0, 0, 0.5);border-color:rgba(255, 255, 255, 0.2);} .bento-title{font-family:var(--font-primary);font-size:1.5rem;font-weight:600;color:var(--color-text-primary);margin:1rem 0 0.5rem 0;letter-spacing:-0.01em;} .parent-card .bento-title{font-size:2rem;margin-bottom:0.5rem;} .bento-desc{font-family:var(--font-primary);font-size:0.95rem;color:var(--color-text-secondary);line-height:1.6;margin:0;} .parent-card .bento-desc{font-size:1.1rem;max-width:600px;} .bento-icon-lg{margin-bottom:1rem;color:var(--color-accent-primary);filter:drop-shadow(0 0 10px rgba(59, 130, 246, 0.3));} .bento-icon{margin-bottom:auto;padding:12px;border-radius:12px;background:rgba(0, 0, 0, 0.03);display:inline-flex;color:var(--color-text-primary);width:fit-content;} html[data-theme="dark"] .bento-icon{background:rgba(255, 255, 255, 0.05);} .card-header-row{width:100%;display:flex;justify-content:flex-end;margin-bottom:1.5rem;} .status-badge{font-size:0.7rem;font-weight:700;text-transform:uppercase;padding:0.35rem 0.85rem;border-radius:100px;display:flex;align-items:center;gap:8px;letter-spacing:0.05em;line-height:1;} .status-dot{width:6px;height:6px;border-radius:50%;background-color:currentColor;box-shadow:0 0 8px currentColor;} .status-live .status-badge{background:rgba(16, 185, 129, 0.1);color:#10B981;border:1px solid rgba(16, 185, 129, 0.2);} html[data-theme="dark"] .status-live:hover{border-color:rgba(16, 185, 129, 0.5);box-shadow:0 0 30px rgba(16, 185, 129, 0.15);} .status-live .bento-icon{color:#10B981;background:rgba(16, 185, 129, 0.1);} .status-dev .status-badge{background:rgba(139, 92, 246, 0.1);color:#8B5CF6;border:1px solid rgba(139, 92, 246, 0.2);} html[data-theme="dark"] .status-dev:hover{border-color:rgba(139, 92, 246, 0.5);box-shadow:0 0 30px rgba(139, 92, 246, 0.15);} .status-dev .bento-icon{color:#8B5CF6;background:rgba(139, 92, 246, 0.1);} .status-soon .status-badge{background:rgba(245, 158, 11, 0.1);color:#F59E0B;border:1px solid rgba(245, 158, 11, 0.2);} html[data-theme="dark"] .status-soon:hover{border-color:rgba(245, 158, 11, 0.5);box-shadow:0 0 30px rgba(245, 158, 11, 0.15);} .status-soon .bento-icon{color:#F59E0B;background:rgba(245, 158, 11, 0.1);} .card-bg-glow{position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(800px circle at top right, rgba(255, 255, 255, 0.05), transparent 40%);opacity:0;transition:opacity 0.5s ease;pointer-events:none;z-index:0;} .bento-card:hover .card-bg-glow{opacity:1;} .bento-link-hint{margin-top:1rem;font-size:0.85rem;font-weight:600;color:var(--color-accent-primary);opacity:0;transform:translateY(10px);transition:all 0.3s ease;display:inline-block;} .bento-card:hover .bento-link-hint{opacity:1;transform:translateY(0);} @media (max-width:991px){.bento-grid-wrapper{grid-template-columns:1fr;gap:1.5rem;} .parent-card{min-height:auto;padding:3rem 1.5rem;} .bento-card{padding:1.5rem;} .bento-title{font-size:1.3rem;} .bento-link-hint{opacity:1;transform:translateY(0);margin-top:0.5rem;}} /* ============================================ LETTER BREATHE LOGO — animated wordmark Each letter oscillates weight 200 ↔ 900 on a 5s loop, staggered 120ms apart so a "breath" travels across the word. Requires Inter loaded with variable weight (100..900), which the site already does via Google Fonts. ============================================ */ .lb-logo{display:inline-flex;font-family:'Inter', sans-serif;letter-spacing:-0.05em;line-height:1;} .lb-logo .ch{display:inline-block;font-weight:400;animation:lb-breathe 5s ease-in-out infinite;will-change:font-variation-settings;} .lb-logo .ch:nth-child(1){animation-delay:0s;} .lb-logo .ch:nth-child(2){animation-delay:0.12s;} .lb-logo .ch:nth-child(3){animation-delay:0.24s;} .lb-logo .ch:nth-child(4){animation-delay:0.36s;} .lb-logo .ch:nth-child(5){animation-delay:0.48s;} .lb-logo .ch:nth-child(6){animation-delay:0.60s;} .lb-logo .ch:nth-child(7){animation-delay:0.72s;} .lb-logo .ch:nth-child(8){animation-delay:0.84s;} .lb-logo .ch:nth-child(9){animation-delay:0.96s;} .lb-logo .ch:nth-child(10){animation-delay:1.08s;} @keyframes lb-breathe{0%, 100%{font-variation-settings:"wght" 200;} 50%{font-variation-settings:"wght" 900;}} @media (prefers-reduced-motion:reduce){.lb-logo .ch{animation:none;font-variation-settings:"wght" 500;}} /* ============================================================ PHASE 2 — COMPONENT LAYER (monochrome, multi-page) Overrides any legacy component styles that still reference blue/purple. Kept at file end so it wins the cascade. ============================================================ */ .site-header{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(255,255,255,0.82);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid transparent;transition:border-color 250ms var(--ease-out, cubic-bezier(0.4,0,0.2,1));} html[data-theme="dark"] .site-header{background:rgba(11,14,20,0.78);} .site-header.scrolled{border-bottom-color:var(--border-1);} .site-header .container{max-width:1280px;margin:0 auto;padding:0 1.5rem;height:68px;display:flex;align-items:center;justify-content:space-between;} .site-header .header-content{width:100%;display:flex;align-items:center;justify-content:space-between;} .site-header .logo{font-size:1.25rem;color:var(--fg-1);} .site-header .nav-list{display:flex;align-items:center;gap:2rem;list-style:none;padding:0;margin:0;} .site-header .nav-list a{color:var(--fg-1);font-weight:500;font-size:0.95rem;padding:8px 0;position:relative;text-decoration:none;} .site-header .nav-list a::after{content:'';position:absolute;left:0;right:0;bottom:2px;height:2px;background:var(--fg-1);transform:scaleX(0);transform-origin:center;transition:transform 200ms var(--ease-out, cubic-bezier(0.4,0,0.2,1));} .site-header .nav-list a:hover::after, .site-header .nav-list a.current::after, .site-header .nav-list a[aria-current="page"]::after{transform:scaleX(1);} .hero{min-height:calc(100vh - 68px);display:flex;align-items:center;padding:6rem 1.5rem;background:var(--bg-1);} .hero-title{font-size:clamp(3rem, 7vw, 5.5rem);font-weight:800;line-height:0.98;letter-spacing:-0.04em;margin:0 0 2rem;max-width:14ch;} .hero-lede, .about-intro{font-size:clamp(1.1rem, 1.6vw, 1.375rem);line-height:1.55;color:var(--fg-2);max-width:48ch;margin:0 0 3rem;} .eyebrow-pill{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;font-family:'JetBrains Mono', monospace;font-size:11px;font-weight:500;letter-spacing:0.12em;text-transform:uppercase;background:var(--bg-3);color:var(--fg-1);border:1px solid var(--border-1);margin-bottom:2rem;} .eyebrow-pill .dot{width:6px;height:6px;border-radius:50%;background:var(--venture-live);animation:ac-pulse 2s ease-in-out infinite;} @keyframes ac-pulse{0%,100%{opacity:1;transform:scale(1);} 50%{opacity:.5;transform:scale(1.3);}} .cta-button, .btn-primary{display:inline-flex;align-items:center;gap:8px;padding:14px 24px;border-radius:8px;font-weight:500;font-size:0.95rem;cursor:pointer;background:var(--fg-1);color:var(--bg-1);border:1px solid var(--fg-1);text-decoration:none;transition:all 200ms var(--ease-out, cubic-bezier(0.4,0,0.2,1));} .cta-button:hover, .btn-primary:hover{transform:translateY(-1px);box-shadow:var(--shadow-lift);text-decoration:none;} .btn-secondary{display:inline-flex;align-items:center;gap:8px;padding:14px 24px;border-radius:8px;font-weight:500;font-size:0.95rem;background:transparent;color:var(--fg-1);border:1px solid var(--border-2);text-decoration:none;transition:all 200ms var(--ease-out, cubic-bezier(0.4,0,0.2,1));} .btn-secondary:hover{border-color:var(--fg-1);background:var(--bg-3);text-decoration:none;} .stat-row{margin-top:6rem;display:grid;grid-template-columns:repeat(3, auto);gap:3rem;width:fit-content;} .stat-row .stat{border-left:1px solid var(--border-1);padding-left:1.5rem;} .stat-row .stat:first-child{border-left:0;padding-left:0;} .stat-row .big{font-size:2.75rem;font-weight:800;letter-spacing:-0.03em;line-height:1;color:var(--fg-1);} .stat-row .lbl{margin-top:8px;font-size:11px;font-weight:500;letter-spacing:0.12em;text-transform:uppercase;color:var(--fg-3);font-family:'JetBrains Mono', monospace;} .structure-section{background:var(--bg-2);border-top:1px solid var(--border-1);} .bento-grid-wrapper{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:1.6fr 1fr 1fr;grid-template-rows:minmax(220px, auto) minmax(220px, auto);gap:1rem;} .bento-card{position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:2rem;border:1px solid var(--border-1);border-radius:12px;background:var(--bg-1);text-decoration:none;color:inherit;transition:all 300ms var(--ease-out, cubic-bezier(0.4,0,0.2,1));overflow:hidden;} .bento-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lift);text-decoration:none;} .bento-card .card-bg-glow{display:none;} .bento-card .bento-icon, .bento-card .bento-icon-lg{width:44px;height:44px;border-radius:8px;background:var(--bg-3);color:var(--fg-1);display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--border-1);} .bento-card .bento-icon-lg{width:64px;height:64px;} .bento-card .bento-title{font-size:1.25rem;font-weight:700;margin:1rem 0 6px;letter-spacing:-0.02em;} .bento-card .bento-desc{color:var(--fg-2);font-size:0.92rem;line-height:1.55;margin:0;} .bento-card .bento-link-hint{margin-top:1rem;font-size:0.85rem;font-weight:500;color:var(--fg-2);display:inline-flex;align-items:center;gap:4px;} .bento-card:hover .bento-link-hint{color:var(--fg-1);} .parent-card{grid-row:1 / 3;background:var(--fg-1);color:var(--bg-1);border-color:var(--fg-1);} .parent-card .bento-icon-lg{background:rgba(255,255,255,0.08);color:var(--bg-1);border-color:rgba(255,255,255,0.15);} .parent-card .bento-title{color:var(--bg-1);font-size:1.75rem;} .parent-card .bento-desc{color:rgba(255,255,255,0.7);font-size:1rem;} .venture-card{border-top:3px solid;} .venture-card.status-live{border-top-color:var(--venture-live);} .venture-card.status-dev{border-top-color:var(--venture-dev);} .venture-card.status-soon{border-top-color:var(--venture-soon);} .venture-card.status-live .bento-icon{background:var(--venture-live-tint);color:var(--venture-live);border-color:transparent;} .venture-card.status-dev .bento-icon{background:var(--venture-dev-tint);color:var(--venture-dev);border-color:transparent;} .venture-card.status-soon .bento-icon{background:var(--venture-soon-tint);color:var(--venture-soon);border-color:transparent;} .status-badge{position:absolute;top:1rem;right:1rem;display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:999px;font-family:'JetBrains Mono', monospace;font-size:10px;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;} .status-badge.live{background:var(--venture-live-tint);color:var(--venture-live);} .status-badge.dev{background:var(--venture-dev-tint);color:var(--venture-dev);} .status-badge.soon{background:var(--venture-soon-tint);color:var(--venture-soon);} .status-badge .status-dot{width:5px;height:5px;border-radius:50%;background:currentColor;} .venture-card.bento-wide{grid-column:span 2;} @media (max-width:860px){.bento-grid-wrapper{grid-template-columns:1fr;grid-template-rows:none;} .parent-card{grid-row:auto;} .venture-card.bento-wide{grid-column:auto;}} .page-hero{padding:8rem 1.5rem 4rem;max-width:1280px;margin:0 auto;} .page-hero .overline{font-family:'JetBrains Mono', monospace;font-size:11px;font-weight:500;letter-spacing:0.12em;text-transform:uppercase;color:var(--fg-2);display:inline-block;margin-bottom:1rem;} .page-hero h1{font-size:clamp(2.5rem, 5vw, 4rem);font-weight:800;line-height:1.05;letter-spacing:-0.03em;margin:0 0 1.5rem;max-width:20ch;} .page-hero .lede{font-size:1.2rem;color:var(--fg-2);max-width:58ch;line-height:1.55;margin:0;} .values-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));gap:1.5rem;max-width:1280px;margin:0 auto;padding:0 1.5rem 8rem;} .value-card{padding:2rem;border:1px solid var(--border-1);border-radius:12px;background:var(--bg-1);} .value-card .n{font-family:'JetBrains Mono', monospace;font-size:11px;font-weight:500;letter-spacing:0.12em;color:var(--fg-3);display:block;margin-bottom:1rem;} .value-card h3{font-size:1.3rem;font-weight:700;margin:0 0 1rem;letter-spacing:-0.02em;} .value-card p{color:var(--fg-2);line-height:1.6;margin:0;} .projects-list{max-width:1280px;margin:0 auto;padding:0 1.5rem 8rem;display:grid;grid-template-columns:1fr;gap:1rem;} .project-row{display:grid;grid-template-columns:48px 1fr 120px 140px;gap:1.5rem;align-items:center;padding:2rem;border:1px solid var(--border-1);border-radius:12px;background:var(--bg-1);text-decoration:none;color:inherit;transition:all 250ms var(--ease-out, cubic-bezier(0.4,0,0.2,1));} .project-row:hover{border-color:var(--fg-1);transform:translateY(-2px);box-shadow:var(--shadow-lift);text-decoration:none;} .project-row .p-icon{width:48px;height:48px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;} .project-row.live .p-icon{background:var(--venture-live-tint);color:var(--venture-live);} .project-row.dev .p-icon{background:var(--venture-dev-tint);color:var(--venture-dev);} .project-row.soon .p-icon{background:var(--venture-soon-tint);color:var(--venture-soon);} .project-row .p-name{font-size:1.25rem;font-weight:700;letter-spacing:-0.02em;margin:0 0 4px;} .project-row .p-tag{color:var(--fg-2);font-size:0.9rem;margin:0;} .project-row .p-status{font-family:'JetBrains Mono', monospace;font-size:11px;font-weight:600;letter-spacing:0.12em;text-transform:uppercase;} .project-row.live .p-status{color:var(--venture-live);} .project-row.dev .p-status{color:var(--venture-dev);} .project-row.soon .p-status{color:var(--venture-soon);} .project-row .p-visit{font-size:0.85rem;font-weight:500;color:var(--fg-2);text-align:right;} .project-row:hover .p-visit{color:var(--fg-1);} @media (max-width:720px){.project-row{grid-template-columns:48px 1fr;grid-template-areas:"icon title" "status visit";gap:0.75rem 1rem;padding:1.5rem;} .project-row .p-icon{grid-area:icon;} .project-row .p-info{grid-area:title;} .project-row .p-status{grid-area:status;text-align:left;} .project-row .p-visit{grid-area:visit;text-align:right;}} .contact-wrap{max-width:600px;margin:0 auto;padding:0 1.5rem 8rem;} .contact-big{display:inline-block;margin:1.5rem 0;max-width:100%;font-size:clamp(1.25rem, 5.5vw, 3rem);font-weight:700;letter-spacing:-0.03em;color:var(--fg-1);overflow-wrap:anywhere;} .contact-big:hover{text-decoration:underline;text-underline-offset:8px;} .contact-footer-section{background:var(--bg-2);border-top:1px solid var(--border-1);padding:4rem 1.5rem;} .contact-footer-section .contact-email{color:var(--fg-1);font-weight:500;} .contact-footer-section .footer-link{color:var(--fg-2);} .contact-footer-section .footer-link:hover{color:var(--fg-1);} .copyright{font-family:'JetBrains Mono', monospace;font-size:11px;color:var(--fg-3);} .welcome-message::before, .welcome-message::after, .hero::before, .hero::after{display:none !important;} /* ============================================================ PHASE 2 FIX — force header padding / max-width above legacy responsive .container rules at line 1150+. ============================================================ */ body .site-header .container, body .site-header > .container{max-width:1280px !important;padding-left:1.5rem !important;padding-right:1.5rem !important;box-sizing:border-box !important;width:100%;} .site-header .header-content{padding:0 !important;min-height:unset;width:100%;} /* ============================================================ PHASE 2 FIX — dark-mode contrast + footer email pill ============================================================ */ .page-hero h1, .hero-title, .value-card h3, .bento-card .bento-title, .project-row .p-name, .contact-big{color:var(--fg-1) !important;} /* Legacy .contact-email ships with a button-pill background in dark mode that bleaches the text. Strip it so the email reads as a link. */ .contact-footer-section .contact-email, body .contact-email{background:transparent !important;padding:0 !important;border:0 !important;border-radius:0 !important;box-shadow:none !important;display:inline !important;font-size:1rem !important;color:var(--fg-1) !important;font-weight:500;text-decoration:none;transform:none !important;} .contact-footer-section .contact-email:hover, body .contact-email:hover{text-decoration:underline;text-underline-offset:4px;color:var(--fg-1) !important;} /* Slightly lift body copy contrast in dark mode — user said they want subtlety but still readable. Bump --fg-2 one step brighter. */ html[data-theme="dark"]{--fg-2:#B8C3D1;} /* ============================================================ PHASE 2 FIX — mobile rendering (header overflow + stat row) The Phase 2 .site-header .nav-list rule beats the legacy `.nav-list{display:none}` mobile media query, so on phones the desktop nav wins and squeezes the .lb-logo down to ~17px, which makes each animated <span class="ch"> wrap onto its own line. We collapse the header to a two-row stack on mobile and let the nav wrap. Backstop overflow-x:clip prevents future regressions from forcing horizontal scroll. ============================================================ */ html, body{overflow-x:clip;} @media (max-width:767.98px){.site-header .container{height:auto;padding:0.5rem 1rem;flex-direction:column;align-items:stretch;gap:0.25rem;} .site-header .header-content{flex-direction:column;align-items:center;gap:0.25rem;} .site-header .company-name{width:auto;} .site-header .lb-logo{font-size:1.1rem;} .site-header nav[role="navigation"]{width:100%;} .site-header .nav-list{width:100%;justify-content:center;gap:1rem;flex-wrap:wrap;} .site-header .nav-list a{font-size:0.85rem;} .site-header .nav-list .dark-mode-toggle{width:32px;height:32px;} /* The hamburger button has no matching .mobile-nav-menu in markup, so it would be a dead control — keep it hidden on every viewport. */ .mobile-nav-toggle{display:none !important;} /* Header is now ~2 rows tall on mobile — bump body padding so content isn't tucked under it. */ .theme-corporate body{padding-top:6.5rem;} /* Stats row was width:fit-content with three auto columns at 3rem gap — overflows 390px viewports. Switch to an even 3-column grid that respects the container. */ .stat-row{width:100%;grid-template-columns:repeat(3, 1fr);gap:1rem;margin-top:3rem;} .stat-row .stat{padding-left:1rem;} .stat-row .big{font-size:2rem;}}