:root {--primary-color: #e50000;--secondary-color: #2979ff;--accent-color: #ffd700;--dark-color: #121212;--dark-color-lighter: #1a1a1a;--light-color: #f5f5f7;--gradient-primary: linear-gradient(135deg, #e50000 0%, #ff3b3b 100%);--gradient-accent: linear-gradient(135deg, #e50000 0%, #ffd700 100%);--gradient-dark: linear-gradient(135deg, #0a0a0a 0%, #1a1a1a 100%);--transition-fast: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);--font-family-primary: 'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;--box-shadow-sm: 0 4px 6px rgba(0, 0, 0, 0.1);--box-shadow-md: 0 10px 15px -3px rgba(0, 0, 0, 0.3);--box-shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, 0.3);}body {margin: 0;font-family: var(--font-family-primary);color: #fff;background: var(--dark-color);overflow-x: hidden;line-height: 1.6;font-weight: 300;width: 100%;max-width: 100vw;box-sizing: border-box;}.container, .container-fluid {padding: 0 5%;width: 100%;box-sizing: border-box;overflow-x: hidden;}.hero {min-height: 100vh;background: url('https://compeller.ai/media/page/hero_blonde.png') center/cover no-repeat;position: relative;display: flex;align-items: center;justify-content: center;text-align: center;padding: 2rem;background-attachment: fixed;}.hero::before {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: linear-gradient(rgba(0,0,0,0.4), rgba(0,0,0,0.85));z-index: 0;}.hero-content {position: relative;z-index: 1;max-width: 850px;animation: fadeIn 1.2s ease-out;}.hero h1 {font-size: clamp(3rem, 8vw, 5.5rem);font-weight: 800;margin-bottom: 1.5rem;background: var(--gradient-accent);-webkit-background-clip: text;background-clip: text;color: transparent;text-shadow: 0 2px 15px rgba(255, 215, 0, 0.15);letter-spacing: -0.02em;animation: slideInUp 0.8s ease-out;}.hero p.lead {font-size: clamp(1.2rem, 3vw, 1.6rem);line-height: 1.7;margin-bottom: 2.5rem;max-width: 800px;margin-left: auto;margin-right: auto;opacity: 0.9;animation: slideInUp 0.8s ease-out 0.2s backwards;}@keyframes fadeIn {from { opacity: 0; }to { opacity: 1; }}@keyframes slideInUp {from {opacity: 0;transform: translateY(30px);}to {opacity: 1;transform: translateY(0);}}.section {padding: 8rem 0;position: relative;overflow: hidden;}.section h2 {position: relative;display: inline-block;}.section h2::after {content: '';position: absolute;bottom: -10px;left: 0;width: 80px;height: 4px;background: var(--gradient-primary);border-radius: 2px;}.text-center h2::after {left: 50%;transform: translateX(-50%);}.features {background-color: var(--dark-color);position: relative;}.features::before {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: radial-gradient(circle at top right, rgba(229,0,0,0.05), transparent 60%);z-index: 0;}.feature-card {background: rgba(255,255,255,0.03);backdrop-filter: blur(8px);border-radius: 20px;padding: 2.8rem 2.2rem;margin-bottom: 2rem;transition: var(--transition-fast);border: 1px solid rgba(255,255,255,0.05);position: relative;height: 100%;z-index: 1;box-shadow: var(--box-shadow-md);}.feature-card:hover {transform: translateY(-5px);box-shadow: var(--box-shadow-lg);border-color: rgba(229,0,0,0.2);}.feature-icon {display: inline-flex;align-items: center;justify-content: center;width: 75px;height: 75px;border-radius: 20px;margin-bottom: 1.8rem;background: var(--gradient-primary);box-shadow: 0 8px 20px rgba(229,0,0,0.3);transform: rotate(10deg);transition: var(--transition-fast);}.feature-card:hover .feature-icon {transform: rotate(0deg);}.feature-card h3 {font-size: 1.8rem;margin-bottom: 1.2rem;font-weight: 600;letter-spacing: -0.01em;}.examples {background-color: var(--dark-color-lighter);position: relative;}.examples::before {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: radial-gradient(circle at bottom left, rgba(229,0,0,0.05), transparent 60%);z-index: 0;}.example-card {border-radius: 20px;overflow: hidden;position: relative;margin-bottom: 2rem;box-shadow: var(--box-shadow-md);transition: var(--transition-fast);cursor: pointer;z-index: 1;transform: perspective(1000px) rotateY(0deg);}.example-card:hover {transform: perspective(1000px) rotateY(3deg) translateY(-5px);box-shadow: var(--box-shadow-lg);}.video-container {width: 100%;overflow: hidden;position: relative;}.example-img {width: 100%;object-fit: cover;transition: var(--transition-fast);filter: brightness(0.9);}.example-card:hover .example-img {filter: brightness(1);transform: scale(1.05);}.example-video {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;opacity: 0;transition: opacity 0.4s ease;z-index: 1;background-color: #000;}.example-card:hover .example-video.loaded {opacity: 1;}.example-overlay {position: absolute;bottom: 0;left: 0;right: 0;padding: 2rem 1.8rem;background: linear-gradient(0deg, rgba(0,0,0,0.95) 0%, rgba(0,0,0,0) 100%);z-index: 2;transform: translateY(0);transition: var(--transition-fast);}.example-card:hover .example-overlay {transform: translateY(-5px);}.example-overlay h4 {margin-bottom: 0.7rem;font-weight: 600;font-size: 1.4rem;letter-spacing: -0.01em;}.play-indicator {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);color: white;opacity: 0.8;transition: all 0.4s ease;z-index: 2;filter: drop-shadow(0 0 12px rgba(0,0,0,0.6));background: rgba(229, 0, 0, 0.7);width: 80px;height: 80px;border-radius: 50%;display: flex;align-items: center;justify-content: center;}.example-card:hover .play-indicator:not(.loading) {opacity: 0;transform: translate(-50%, -50%) scale(1.3);}.how-it-works {background: var(--gradient-dark);position: relative;overflow-x: hidden;width: 100%;max-width: 100vw;}.how-it-works::after {content: '';position: absolute;top: 0;right: 0;width: 30%;height: 25%;background: radial-gradient(circle, rgba(229,0,0,0.07), transparent 70%);z-index: 0;}.step-wrapper {display: flex;justify-content: space-between;position: relative;z-index: 1;margin-top: 3rem;width: 100%;max-width: 100%;overflow: hidden;}.step-wrapper::before {content: '';position: absolute;top: 50%;left: 0;width: 100%;height: 3px;background: linear-gradient(to right,rgba(229,0,0,0.1) 0%,rgba(229,0,0,0.3) 50%,rgba(229,0,0,0.1) 100%);z-index: -1;border-radius: 3px;box-sizing: border-box;}.step {display: flex;flex-direction: column;align-items: center;text-align: center;position: relative;width: 22%;transition: var(--transition-fast);}.step:hover {transform: translateY(-5px);}.step-number {display: flex;align-items: center;justify-content: center;width: 70px;height: 70px;border-radius: 20px;background: var(--gradient-primary);color: white;font-weight: 700;font-size: 1.7rem;margin-bottom: 1.8rem;position: relative;z-index: 1;box-shadow: 0 10px 20px rgba(229,0,0,0.3);transition: var(--transition-fast);transform: rotate(0deg);}.step:hover .step-number {transform: rotate(10deg);box-shadow: 0 15px 25px rgba(229,0,0,0.4);}.step h3 {font-size: 1.4rem;margin-bottom: 0.9rem;font-weight: 600;color: rgba(255,255,255,0.95);}.step p {color: rgba(255,255,255,0.7);line-height: 1.6;font-size: 1.05rem;}.cta {background: var(--dark-color);position: relative;overflow: hidden;}.cta::before {content: '';position: absolute;bottom: -10%;left: -10%;width: 50%;height: 50%;background: radial-gradient(circle, rgba(229,0,0,0.08), transparent 70%);z-index: 0;}.cta::after {content: '';position: absolute;top: -10%;right: -10%;width: 50%;height: 50%;background: radial-gradient(circle, rgba(229,0,0,0.05), transparent 70%);z-index: 0;}.cta-card {background: rgba(255,255,255,0.03);backdrop-filter: blur(8px);border-radius: 30px;padding: 5rem 4rem;border: 1px solid rgba(229,0,0,0.08);position: relative;z-index: 1;box-shadow: var(--box-shadow-lg);overflow: hidden;animation: pulse 4s infinite alternate;}.no-delay {transition-delay: 0s !important;animation-delay: 0s !important;}@keyframes pulse {0% {box-shadow: var(--box-shadow-lg);border-color: rgba(229,0,0,0.08);}100% {box-shadow: 0 15px 30px rgba(229,0,0,0.15);border-color: rgba(229,0,0,0.12);}}.cta-card::before {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: linear-gradient(135deg,rgba(229,0,0,0.05) 0%,transparent 50%,rgba(255,215,0,0.02) 100%);z-index: -1;}.cta-card h2 {background: var(--gradient-accent);-webkit-background-clip: text;background-clip: text;color: transparent;margin-bottom: 1.8rem;}.btn {display: inline-flex;align-items: center;justify-content: center;padding: 0.85rem 2.2rem;border-radius: 50px;font-weight: 600;font-size: 1rem;text-transform: uppercase;letter-spacing: 1px;transition: var(--transition-fast);position: relative;z-index: 1;overflow: hidden;}.btn::before {content: '';position: absolute;top: -2px;left: -2px;right: -2px;bottom: -2px;background: var(--gradient-accent);z-index: -1;opacity: 0;transition: var(--transition-fast);border-radius: 50px;}.btn-primary {background: var(--gradient-primary);border: none;color: white;box-shadow: 0 10px 20px rgba(229,0,0,0.3);}.btn-primary:hover {transform: translateY(-3px) scale(1.03);box-shadow: 0 15px 30px rgba(229,0,0,0.4);}.btn-primary:active {transform: translateY(0) scale(0.98);}.btn-outline {background: transparent;border: 2px solid rgba(255,255,255,0.3);color: white;overflow: visible;}.btn-outline:hover {border-color: var(--primary-color);color: white;transform: translateY(-3px) scale(1.03);background: rgba(229,0,0,0.1);}.btn-outline:active {transform: translateY(0) scale(0.98);}.btn-lg {padding: 1.1rem 2.8rem;font-size: 1.1rem;font-weight: 700;}.reveal {opacity: 0;transform: translateY(20px);transition: all 0.4s cubic-bezier(0.5, 0, 0, 1);}.reveal.active {opacity: 1;transform: translateY(0);}html, body {overflow-x: hidden !important;width: 100%;position: relative;max-width: 100vw;}.row {margin-left: 0;margin-right: 0;width: 100%;box-sizing: border-box;overflow-x: hidden;}.container, .container-fluid, .section, .row {max-width: 100vw;overflow-x: hidden;box-sizing: border-box;}*::-webkit-scrollbar:horizontal {display: none !important;}html.loading {scrollbar-width: none;-ms-overflow-style: none;}html.loading::-webkit-scrollbar {display: none;}::-webkit-scrollbar {width: 12px;}::-webkit-scrollbar-track {background: var(--dark-color);}::-webkit-scrollbar-thumb {background: linear-gradient(var(--primary-color), #ff3b3b);border-radius: 6px;border: 3px solid var(--dark-color);}::-webkit-scrollbar-thumb:hover {background: linear-gradient(var(--primary-color), #ff5555);}@media (max-width: 992px) {.step-wrapper {flex-direction: column;align-items: center;}.step-wrapper::before {width: 2px;height: 100%;left: 50%;top: 0;background: linear-gradient(to bottom,rgba(229,0,0,0.1) 0%,rgba(229,0,0,0.3) 50%,rgba(229,0,0,0.1) 100%);}.step {width: 100%;margin-bottom: 3.5rem;}.cta-card {padding: 4rem 2.5rem;}.feature-card, .example-card {height: auto;}}@media (max-width: 768px) {.hero {min-height: 90vh;}.hero h1 {font-size: clamp(2.5rem, 8vw, 3.5rem);}.hero p.lead {font-size: clamp(1rem, 3vw, 1.2rem);}.section {padding: 5rem 0;}.feature-icon {width: 65px;height: 65px;}.btn-lg {padding: 0.9rem 2.2rem;font-size: 1rem;}.video-container,.example-img {height: 250px;}.example-overlay {padding: 1.5rem;}}@media (max-width: 576px) {.hero {padding: 1.5rem;}.cta-card {padding: 3rem 1.5rem;}.section h2.display-4 {font-size: 2.5rem;}.play-indicator {width: 60px;height: 60px;}}