/* Reset and Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    background: #000;
    color: #fff;
    line-height: 1.6;
    overflow-x: hidden;
}

/* Background Effects */
.background-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 0;
}

.background-gradient {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(29, 78, 216, 0.2), rgba(147, 51, 234, 0.2), #000);
}

/* Geometric Shapes */
.geometric-shapes {
    position: absolute;
    width: 100%;
    height: 100%;
}

.shape {
    position: absolute;
    border: 1px solid;
    transform: rotate(45deg);
}

.shape-1 {
    top: 80px;
    left: 40px;
    width: 128px;
    height: 128px;
    border-color: rgba(59, 130, 246, 0.3);
}

.shape-2 {
    top: 160px;
    left: 80px;
    width: 96px;
    height: 96px;
    border-color: rgba(147, 51, 234, 0.3);
    transform: rotate(12deg);
}

.shape-3 {
    bottom: 160px;
    left: 64px;
    width: 160px;
    height: 160px;
    border-color: rgba(6, 182, 212, 0.2);
}

.shape-4 {
    top: 128px;
    right: 80px;
    width: 112px;
    height: 112px;
    border-color: rgba(96, 165, 250, 0.3);
    transform: rotate(12deg);
}

.shape-5 {
    top: 240px;
    right: 40px;
    width: 144px;
    height: 144px;
    border-color: rgba(168, 85, 247, 0.2);
}

.shape-6 {
    bottom: 128px;
    right: 96px;
    width: 128px;
    height: 128px;
    border-color: rgba(34, 211, 238, 0.3);
    transform: rotate(12deg);
}

.dot {
    position: absolute;
    border-radius: 50%;
}

.dot-1 {
    top: 96px;
    left: 25%;
    width: 8px;
    height: 8px;
    background: #60a5fa;
}

.dot-2 {
    top: 192px;
    left: 33.333333%;
    width: 4px;
    height: 4px;
    background: #a855f7;
}

.dot-3 {
    top: 288px;
    right: 25%;
    width: 8px;
    height: 8px;
    background: #22d3ee;
}

.dot-4 {
    bottom: 192px;
    right: 33.333333%;
    width: 4px;
    height: 4px;
    background: #60a5fa;
}

/* Top Banner */
.top-banner {
    position: relative;
    z-index: 10;
    background: #dc2626;
    color: white;
    text-align: center;
    padding: 8px;
    font-size: 14px;
}

.font-bold {
    font-weight: bold;
}

.ml-4 {
    margin-left: 16px;
}

/* Container */
.container {
    position: relative;
    z-index: 10;
    max-width: 1200px;
    margin: 0 auto;
    padding: 32px 16px;
}

/* Logo Section */
.logo-section {
    text-align: center;
    margin-bottom: 32px;
}

.logo-container {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-bottom: 16px;
}

.logo-icon {
    width: 48px;
    height: 48px;
    background: linear-gradient(135deg, #3b82f6, #8b5cf6);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.logo-icon i {
    font-size: 32px;
    color: white;
}

.logo-text {
    font-size: 48px;
    font-weight: bold;
}

.logo-prompt {
    color: white;
}

.logo-genius {
    color: #60a5fa;
}

.logo-ai {
    color: #22d3ee;
    font-size: 64px;
    margin-left: 8px;
}

.logo-subtitle {
    font-size: 14px;
    color: #d1d5db;
}

.highlight-pink {
    color: #ec4899;
    font-weight: 600;
}

/* Robot Characters */
.robot-left {
    position: absolute;
    left: 32px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
}

.robot-container {
    width: 128px;
    height: 160px;
    position: relative;
}

.robot-body {
    width: 80px;
    height: 96px;
    background: linear-gradient(to bottom, #d1d5db, #9ca3af);
    border-radius: 8px;
    margin: 0 auto;
    position: relative;
    margin-top: 32px;
}

.robot-head {
    position: absolute;
    top: -32px;
    left: 50%;
    transform: translateX(-50%);
    width: 64px;
    height: 64px;
    background: linear-gradient(to bottom, white, #e5e7eb);
    border-radius: 50%;
}

.robot-eye {
    position: absolute;
    top: 16px;
    width: 8px;
    height: 8px;
    background: #3b82f6;
    border-radius: 50%;
}

.robot-eye-left {
    left: 12px;
}

.robot-eye-right {
    right: 12px;
}

.robot-smile {
    position: absolute;
    bottom: 12px;
    left: 50%;
    transform: translateX(-50%);
    width: 24px;
    height: 12px;
    border-bottom: 2px solid #4b5563;
    border-radius: 0 0 24px 24px;
}

.robot-chest {
    position: absolute;
    top: 24px;
    left: 50%;
    transform: translateX(-50%);
    width: 32px;
    height: 32px;
    background: linear-gradient(135deg, #22d3ee, #3b82f6);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.robot-chest i {
    color: white;
    font-size: 16px;
}

.robot-arm {
    position: absolute;
    top: 16px;
    width: 48px;
    height: 16px;
    background: linear-gradient(to right, #d1d5db, #9ca3af);
    border-radius: 8px;
}

.robot-arm-left {
    left: -24px;
    transform: rotate(12deg);
}

.robot-arm-right {
    right: -24px;
    transform: rotate(-12deg);
}

.robot-headphones {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 24px;
    border: 4px solid #8b5cf6;
    border-radius: 40px 40px 0 0;
    border-bottom: none;
}

.robot-headphone {
    position: absolute;
    top: 8px;
    width: 16px;
    height: 16px;
    background: #8b5cf6;
    border-radius: 50%;
}

.robot-headphone-left {
    left: 8px;
}

.robot-headphone-right {
    right: 8px;
}

/* Robot Hand - Right Side */
.robot-right {
    position: absolute;
    right: 32px;
    top: 33.333333%;
    z-index: 5;
}

.robot-hand-container {
    width: 96px;
    height: 128px;
    position: relative;
}

.robot-hand-arm {
    width: 24px;
    height: 80px;
    background: linear-gradient(to bottom, #60a5fa, #2563eb);
    border-radius: 8px;
    margin: 0 auto;
    position: relative;
}

.robot-hand-joint {
    position: absolute;
    width: 32px;
    height: 32px;
    background: linear-gradient(135deg, #93c5fd, #3b82f6);
    border-radius: 50%;
    left: -4px;
}

.robot-hand-joint-1 {
    top: 0;
}

.robot-hand-joint-2 {
    top: 16px;
}

.robot-hand-joint-3 {
    top: 32px;
}

.robot-fingers {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 4px;
}

.robot-finger {
    background: linear-gradient(to bottom, #60a5fa, #2563eb);
    border-radius: 4px;
    width: 8px;
}

.robot-finger-1 {
    height: 24px;
}

.robot-finger-2 {
    height: 32px;
}

.robot-finger-3 {
    height: 28px;
}

.robot-finger-4 {
    height: 20px;
}

/* Main Headlines */
.main-headlines {
    text-align: center;
    max-width: 1200px;
    margin: 0 auto 48px;
}

.main-title {
    font-size: clamp(24px, 5vw, 48px);
    font-weight: bold;
    margin-bottom: 24px;
    line-height: 1.2;
}

.text-red {
    color: #ef4444;
}

.text-white {
    color: white;
}

.text-yellow {
    color: #fbbf24;
}

.text-green {
    color: #10b981;
}

.text-cyan {
    color: #22d3ee;
}

.text-purple {
    color: #a855f7;
}

.text-pink {
    color: #ec4899;
}

.text-orange {
    color: #f97316;
}

.text-gray-200 {
    color: #e5e7eb;
}

.text-gray-300 {
    color: #d1d5db;
}

.font-semibold {
    font-weight: 600;
}

.subtitle-box {
    background: linear-gradient(to right, #8b5cf6, #3b82f6);
    border-radius: 8px;
    padding: 16px;
    margin-bottom: 24px;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}

.subtitle-text {
    font-size: clamp(16px, 3vw, 24px);
    font-weight: bold;
}

.description {
    font-size: 18px;
    margin-bottom: 16px;
    color: #e5e7eb;
}

.guarantee-box {
    background: linear-gradient(to right, #fbbf24, #f59e0b);
    color: black;
    padding: 12px 24px;
    border-radius: 8px;
    display: inline-block;
    font-weight: bold;
    font-size: 20px;
    margin-bottom: 24px;
}

/* Super Dashboard */
.super-dashboard {
    position: relative;
    background: linear-gradient(to right, #8b5cf6, #3b82f6, #8b5cf6);
    border-radius: 8px;
    padding: 24px;
    margin-bottom: 32px;
    border: 2px solid #a855f7;
}

.arrow-left,
.arrow-right {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 0;
    height: 0;
}

.arrow-left {
    left: 16px;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-right: 12px solid #c4b5fd;
}

.arrow-right {
    right: 16px;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-left: 12px solid #c4b5fd;
}

.dashboard-title {
    font-size: clamp(20px, 4vw, 32px);
    font-weight: bold;
    color: white;
}

.final-description {
    font-size: 18px;
    margin-bottom: 32px;
    color: #e5e7eb;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

/* Feature Icons */
.feature-icons {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 16px;
    margin-bottom: 32px;
}

.feature-icon {
    display: flex;
    align-items: center;
    gap: 8px;
    background: rgba(31, 41, 55, 0.5);
    padding: 8px 16px;
    border-radius: 8px;
}

.feature-icon i {
    color: #a855f7;
}

.feature-icon span {
    font-size: 14px;
    font-weight: 600;
}

/* Section Styles */
.problem-section,
.before-after-section,
.ai-tools-section,
.testimonials-section,
.pricing-section,
.bonuses-section,
.guarantee-section,
.urgency-section {
    border-radius: 8px;
    padding: 32px;
    margin-bottom: 48px;
    border: 1px solid;
}

.problem-section {
    background: linear-gradient(to right, rgba(153, 27, 27, 0.3), rgba(127, 29, 29, 0.3));
    border-color: rgba(239, 68, 68, 0.3);
}

.before-after-section {
    background: linear-gradient(to right, rgba(30, 58, 138, 0.3), rgba(91, 33, 182, 0.3));
    border-color: rgba(59, 130, 246, 0.3);
}

.ai-tools-section {
    background: linear-gradient(to right, rgba(91, 33, 182, 0.3), rgba(30, 58, 138, 0.3));
    border-color: rgba(147, 51, 234, 0.3);
}

.testimonials-section {
    background: linear-gradient(to right, rgba(6, 95, 70, 0.3), rgba(30, 58, 138, 0.3));
    border-color: rgba(16, 185, 129, 0.3);
}

.pricing-section {
    background: linear-gradient(to right, rgba(146, 64, 14, 0.3), rgba(154, 52, 18, 0.3));
    border-color: rgba(245, 158, 11, 0.3);
}

.bonuses-section {
    background: linear-gradient(to right, rgba(91, 33, 182, 0.3), rgba(157, 23, 77, 0.3));
    border-color: rgba(147, 51, 234, 0.3);
}

.guarantee-section {
    background: linear-gradient(to right, rgba(6, 95, 70, 0.3), rgba(5, 150, 105, 0.3));
    border-color: rgba(16, 185, 129, 0.3);
}

.urgency-section {
    background: linear-gradient(to right, rgba(153, 27, 27, 0.3), rgba(154, 52, 18, 0.3));
    border-color: rgba(239, 68, 68, 0.3);
}

.section-title {
    font-size: clamp(24px, 4vw, 36px);
    font-weight: bold;
    text-align: center;
    margin-bottom: 24px;
}

.section-intro,
.section-description {
    font-size: 18px;
    text-align: center;
    margin-bottom: 24px;
    color: #e5e7eb;
}

/* Problem List */
.problem-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}

.problem-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.problem-item i {
    margin-top: 4px;
    flex-shrink: 0;
}

.problem-conclusion {
    text-align: center;
}

/* Comparison Grid */
.comparison-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    gap: 32px;
    margin-bottom: 32px;
}

.before-box {
    background: rgba(153, 27, 27, 0.3);
    border-radius: 8px;
    padding: 24px;
    border: 1px solid rgba(239, 68, 68, 0.3);
}

.after-box {
    background: rgba(6, 95, 70, 0.3);
    border-radius: 8px;
    padding: 24px;
    border: 1px solid rgba(16, 185, 129, 0.3);
}

.comparison-title {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.code-block {
    background: #1f2937;
    border-radius: 4px;
    padding: 16px;
    margin-bottom: 16px;
}

.code-block code {
    color: #d1d5db;
    font-size: 14px;
}

.result-text {
    font-weight: 600;
}

.comparison-conclusion {
    text-align: center;
}

/* AI Tools */
.tools-header {
    text-align: center;
    margin-bottom: 32px;
}

.tools-badge {
    display: inline-flex;
    align-items: center;
    background: linear-gradient(to right, #22d3ee, #3b82f6);
    color: white;
    padding: 12px 24px;
    border-radius: 8px;
    font-weight: bold;
    font-size: 20px;
    gap: 8px;
}

.tool-category {
    margin-bottom: 32px;
}

.category-title {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.tools-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 16px;
    margin-bottom: 16px;
}

.tool-card {
    padding: 16px;
    border-radius: 8px;
    border: 1px solid;
}

.tool-card.basic {
    background: rgba(6, 95, 70, 0.2);
    border-color: rgba(16, 185, 129, 0.3);
}

.tool-card.pro {
    background: rgba(30, 58, 138, 0.2);
    border-color: rgba(59, 130, 246, 0.3);
}

.tool-card.premium {
    background: rgba(91, 33, 182, 0.2);
    border-color: rgba(147, 51, 234, 0.3);
}

.tool-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
}

.tool-name {
    font-weight: bold;
    color: white;
    font-size: 14px;
}

.tool-description {
    font-size: 12px;
    color: #d1d5db;
    margin-bottom: 8px;
}

.tool-plan {
    font-size: 12px;
    padding: 2px 8px;
    border-radius: 4px;
    color: white;
}

.tool-plan.basic {
    background: #10b981;
}

.tool-plan.pro {
    background: #3b82f6;
}

.tool-plan.premium {
    background: #8b5cf6;
}

.more-tools {
    text-align: center;
    color: #9ca3af;
}

/* Other Categories */
.other-categories {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 24px;
}

.category-card {
    border-radius: 8px;
    padding: 24px;
    border: 1px solid;
}

.video-category {
    background: rgba(146, 64, 14, 0.2);
    border-color: rgba(245, 158, 11, 0.3);
}

.audio-category {
    background: rgba(6, 95, 70, 0.2);
    border-color: rgba(16, 185, 129, 0.3);
}

.code-category {
    background: rgba(154, 52, 18, 0.2);
    border-color: rgba(249, 115, 22, 0.3);
}

.category-card-title {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 16px;
}

.category-description {
    color: #d1d5db;
    margin-bottom: 16px;
}

.category-tools {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.tool-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.tool-item span {
    font-size: 14px;
    color: white;
}

.tool-item i {
    color: #9ca3af;
    font-size: 12px;
}

.more-text {
    font-size: 12px;
    color: #9ca3af;
}

/* Testimonials */
.testimonials-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    gap: 24px;
}

.testimonial-card {
    background: rgba(31, 41, 55, 0.5);
    border-radius: 8px;
    padding: 24px;
    border: 1px solid rgba(75, 85, 99, 0.3);
}

.testimonial-stars {
    display: flex;
    color: #fbbf24;
    margin-bottom: 16px;
}

.testimonial-quote {
    font-size: 18px;
    font-weight: bold;
    color: #22d3ee;
    margin-bottom: 8px;
}

.testimonial-content {
    color: #d1d5db;
    margin-bottom: 16px;
    font-style: italic;
}

.testimonial-author {
    text-align: right;
}

.testimonial-name {
    font-weight: bold;
    color: white;
}

.testimonial-title {
    font-size: 14px;
    color: #9ca3af;
}

/* Pricing */
.pricing-intro {
    text-align: center;
    margin-bottom: 32px;
}

.pricing-intro p {
    font-size: 18px;
    color: #e5e7eb;
    margin-bottom: 16px;
}

.pricing-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}

.stat-item {
    background: rgba(31, 41, 55, 0.5);
    border-radius: 8px;
    padding: 16px;
}

.stat-label {
    font-size: 14px;
    color: #9ca3af;
}

.stat-value {
    font-size: 20px;
    font-weight: bold;
    color: white;
}

.pricing-display {
    text-align: center;
    margin-bottom: 32px;
}

.pricing-container {
    display: inline-block;
}

.old-price {
    color: #9ca3af;
    text-decoration: line-through;
    font-size: 24px;
    margin-bottom: 8px;
}

.current-price {
    background: linear-gradient(to right, #ef4444, #dc2626);
    color: white;
    padding: 16px 32px;
    border-radius: 8px;
    font-size: 48px;
    font-weight: bold;
    margin-bottom: 16px;
}

.discount-text {
    color: #fbbf24;
    font-weight: bold;
    font-size: 20px;
}

.bonus-intro {
    text-align: center;
}

.bonus-intro p {
    font-size: 18px;
    color: #e5e7eb;
    margin-bottom: 16px;
}

/* Bonuses */
.bonuses-list {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.bonus-item {
    background: rgba(31, 41, 55, 0.5);
    border-radius: 8px;
    padding: 24px;
    border: 1px solid rgba(75, 85, 99, 0.3);
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

.bonus-badge {
    background: linear-gradient(to right, #8b5cf6, #ec4899);
    color: white;
    padding: 4px 12px;
    border-radius: 20px;
    font-weight: bold;
    font-size: 14px;
    flex-shrink: 0;
}

.bonus-content {
    flex: 1;
}

.bonus-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
}

.bonus-title {
    font-size: 20px;
    font-weight: bold;
    color: white;
}

.bonus-value {
    color: #10b981;
    font-weight: bold;
    font-size: 18px;
}

.bonus-description {
    color: #d1d5db;
}

.bonus-total {
    text-align: center;
    margin-top: 32px;
}

.bonus-summary {
    background: linear-gradient(to right, #10b981, #3b82f6);
    color: white;
    padding: 24px;
    border-radius: 8px;
    display: inline-block;
}

.bonus-summary p {
    font-size: 18px;
    font-weight: bold;
}

.investment-text {
    font-size: 20px;
    font-weight: bold;
}

.roi-text {
    font-size: 24px;
    font-weight: bold;
    color: #fbbf24;
}

/* Guarantee */
.guarantee-content {
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
}

.guarantee-intro {
    font-size: 18px;
    color: #e5e7eb;
    margin-bottom: 24px;
}

.guarantee-details {
    background: rgba(31, 41, 55, 0.5);
    border-radius: 8px;
    padding: 24px;
    margin-bottom: 24px;
}

.guarantee-subtitle {
    font-size: 20px;
    font-weight: bold;
    color: white;
    margin-bottom: 16px;
}

.guarantee-details p {
    color: #d1d5db;
    margin-bottom: 16px;
}

.guarantee-bonus {
    color: #10b981;
    font-weight: bold;
    font-size: 18px;
}

.guarantee-conclusion {
    font-size: 20px;
    font-weight: bold;
    color: #10b981;
}

/* Urgency */
.urgency-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    gap: 32px;
}

.urgency-reasons {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.urgency-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.urgency-item i {
    margin-top: 4px;
    flex-shrink: 0;
}

.urgency-title {
    font-weight: bold;
    margin-bottom: 4px;
}

.urgency-title.text-green {
    color: #10b981;
}

.urgency-item p {
    color: #d1d5db;
}

/* Countdown */
.countdown-section {
    background: linear-gradient(to right, #dc2626, #b91c1c);
    border-radius: 8px;
    padding: 32px;
    text-align: center;
    margin-bottom: 48px;
}

.countdown-title {
    font-size: 32px;
    font-weight: bold;
    color: white;
    margin-bottom: 16px;
}

.countdown-subtitle {
    font-size: 18px;
    color: white;
    margin-bottom: 24px;
}

.countdown-timer {
    display: flex;
    justify-content: center;
    gap: 16px;
    margin-bottom: 24px;
}

.time-unit {
    background: rgba(0, 0, 0, 0.5);
    border-radius: 8px;
    padding: 16px;
    min-width: 80px;
}

.time-value {
    font-size: 48px;
    font-weight: bold;
    color: white;
}

.time-label {
    font-size: 14px;
    color: #d1d5db;
}

.countdown-warning {
    color: white;
    margin-bottom: 16px;
}

.countdown-final {
    font-size: 20px;
    font-weight: bold;
    color: #fbbf24;
}

/* CTA Sections */
.final-cta {
    background: linear-gradient(to right, #10b981, #3b82f6);
    border-radius: 8px;
    padding: 32px;
    text-align: center;
    margin-bottom: 48px;
}

.cta-title {
    font-size: 48px;
    font-weight: bold;
    color: white;
    margin-bottom: 24px;
}

.cta-button {
    background: linear-gradient(to right, #fbbf24, #f59e0b);
    color: black;
    padding: 24px 48px;
    border-radius: 8px;
    font-size: 32px;
    font-weight: bold;
    border: none;
    cursor: pointer;
    margin-bottom: 24px;
    transition: all 0.3s ease;
}

.cta-button:hover {
    background: linear-gradient(to right, #f59e0b, #d97706);
    transform: scale(1.05);
}

.cta-features {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 24px;
}

.cta-feature {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: white;
}

.security-text {
    font-size: 14px;
    color: #e5e7eb;
}

/* P.S. Section */
.ps-section {
    margin-top: 48px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    color: #d1d5db;
}

.ps-section strong {
    color: white;
}

/* Final Button */
.final-button {
    text-align: center;
    margin-top: 32px;
}

.final-cta-button {
    background: linear-gradient(to right, #ef4444, #dc2626);
    color: white;
    padding: 16px 48px;
    border-radius: 8px;
    font-size: 20px;
    font-weight: bold;
    border: none;
    cursor: pointer;
    margin-bottom: 16px;
    transition: all 0.3s ease;
}

.final-cta-button:hover {
    background: linear-gradient(to right, #dc2626, #b91c1c);
    transform: scale(1.05);
}

.expiry-text {
    font-size: 14px;
    color: #9ca3af;
    font-style: italic;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .robot-left,
    .robot-right {
        display: none;
    }
    
    .container {
        padding: 16px;
    }
    
    .comparison-grid {
        grid-template-columns: 1fr;
    }
    
    .tools-grid {
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    }
}

@media (max-width: 768px) {
    .logo-text {
        font-size: 32px;
    }
    
    .logo-ai {
        font-size: 48px;
    }
    
    .main-title {
        font-size: 24px;
    }
    
    .subtitle-text {
        font-size: 18px;
    }
    
    .section-title {
        font-size: 24px;
    }
    
    .cta-title {
        font-size: 32px;
    }
    
    .cta-button {
        font-size: 24px;
        padding: 16px 32px;
    }
    
    .current-price {
        font-size: 32px;
    }
    
    .countdown-timer {
        flex-wrap: wrap;
    }
    
    .time-value {
        font-size: 32px;
    }
    
    .pricing-stats {
        grid-template-columns: 1fr;
    }
    
    .testimonials-grid {
        grid-template-columns: 1fr;
    }
    
    .urgency-grid {
        grid-template-columns: 1fr;
    }
    
    .other-categories {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .feature-icons {
        flex-direction: column;
        align-items: center;
    }
    
    .tools-grid {
        grid-template-columns: 1fr;
    }
    
    .bonus-item {
        flex-direction: column;
        text-align: center;
    }
    
    .bonus-header {
        flex-direction: column;
        gap: 8px;
    }
}
/* Call to Action Section Styles */
.cta-section {
    position: relative;
    margin: 80px 0;
    overflow: hidden;
}

.cta-container {
    position: relative;
    background: linear-gradient(135deg, #2d1b69, #1a0f3d);
    border-radius: 20px;
    padding: 60px 40px;
    border: 2px solid rgba(147, 51, 234, 0.4);
    max-width: 1000px;
    margin: 0 auto;
}

.cta-background {
    position: absolute;
    inset: 0;
    overflow: hidden;
    border-radius: 20px;
}

.cta-grid-pattern {
    position: absolute;
    inset: 0;
    background-image: 
        linear-gradient(rgba(147, 51, 234, 0.1) 1px, transparent 1px),
        linear-gradient(90deg, rgba(147, 51, 234, 0.1) 1px, transparent 1px);
    background-size: 25px 25px;
    opacity: 0.3;
}

.cta-glow-effects {
    position: absolute;
    inset: 0;
}

.cta-glow-circle {
    position: absolute;
    border-radius: 50%;
    filter: blur(60px);
    animation: pulse 4s infinite ease-in-out;
}

.cta-glow-1 {
    width: 200px;
    height: 200px;
    background: radial-gradient(circle, rgba(147, 51, 234, 0.4), transparent 70%);
    top: -100px;
    left: -100px;
}

.cta-glow-2 {
    width: 150px;
    height: 150px;
    background: radial-gradient(circle, rgba(99, 102, 241, 0.3), transparent 70%);
    top: 50%;
    right: -75px;
}

.cta-glow-3 {
    width: 180px;
    height: 180px;
    background: radial-gradient(circle, rgba(168, 85, 247, 0.3), transparent 70%);
    bottom: -90px;
    left: 40%;
}

@keyframes pulse {
    0%, 100% { transform: scale(1) rotate(0deg); opacity: 0.8; }
    50% { transform: scale(1.1) rotate(180deg); opacity: 1; }
}

.cta-content {
    position: relative;
    z-index: 2;
    text-align: center;
}

.cta-header {
    margin-bottom: 30px;
}

.cta-badge {
    background: linear-gradient(135deg, #8b5cf6, #6366f1);
    border-radius: 50px;
    padding: 12px 30px;
    display: inline-block;
    border: 2px solid #a855f7;
    box-shadow: 0 10px 30px rgba(139, 92, 246, 0.3);
}

.cta-badge-text {
    color: white;
    font-weight: 700;
    font-size: 16px;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.cta-title-section {
    margin-bottom: 40px;
}

.cta-main-title {
    font-size: clamp(28px, 5vw, 48px);
    font-weight: 900;
    color: #f3f4f6;
    margin-bottom: 20px;
    line-height: 1.2;
}

.cta-title-highlight {
    background: linear-gradient(135deg, #22d3ee, #06b6d4);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.cta-bonus-line {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: #d1d5db;
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 20px;
}

.cta-bonus-line i {
    color: #fbbf24;
    font-size: 20px;
}

.cta-description {
    margin-bottom: 40px;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.cta-description p {
    font-size: 18px;
    line-height: 1.6;
    color: #d1d5db;
    margin-bottom: 15px;
}

.highlight-text {
    color: #22d3ee;
    font-weight: 700;
}

.cta-product-showcase {
    margin: 50px 0;
}

.product-image-container {
    max-width: 600px;
    margin: 0 auto;
}

.product-image {
    width: 100%;
    height: auto;
    border-radius: 15px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}

.image-placeholder {
    background: rgba(31, 41, 55, 0.8);
    border: 2px dashed rgba(147, 51, 234, 0.5);
    border-radius: 15px;
    padding: 60px 40px;
    text-align: center;
    color: #9ca3af;
}

.image-placeholder i {
    font-size: 48px;
    color: #8b5cf6;
    margin-bottom: 20px;
    display: block;
}

.image-placeholder span {
    font-size: 18px;
    font-weight: 600;
    color: #d1d5db;
    display: block;
    margin-bottom: 10px;
}

.image-placeholder p {
    font-size: 14px;
    color: #6b7280;
}

.cta-process {
    margin: 50px 0;
    text-align: left;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.cta-process h3 {
    font-size: 24px;
    font-weight: 700;
    color: #f3f4f6;
    text-align: center;
    margin-bottom: 30px;
}

.process-steps {
    display: grid;
    gap: 15px;
    margin-bottom: 20px;
}

.step-item {
    display: flex;
    align-items: center;
    gap: 15px;
    background: rgba(31, 41, 55, 0.6);
    padding: 15px 20px;
    border-radius: 10px;
    border-left: 4px solid #8b5cf6;
}

.step-number {
    background: linear-gradient(135deg, #8b5cf6, #6366f1);
    color: white;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 16px;
    flex-shrink: 0;
}

.step-item span:last-child {
    color: #d1d5db;
    font-size: 16px;
    font-weight: 500;
}

.process-conclusion {
    text-align: center;
    font-size: 20px;
    color: #f3f4f6;
    font-weight: 700;
}

.cta-pricing {
    margin: 40px 0;
}

.pricing-text {
    font-size: clamp(18px, 3vw, 24px);
    color: #d1d5db;
    line-height: 1.5;
}

.program-name {
    color: #22d3ee;
    font-weight: 700;
    font-size: 1.1em;
}

.price-highlight {
    color: #fbbf24;
    font-weight: 900;
    font-size: 1.3em;
}

.original-price {
    color: #9ca3af;
    text-decoration: line-through;
    font-size: 0.9em;
}

.cta-button-section {
    margin: 50px 0 40px;
}

.cta-main-button {
    background: linear-gradient(135deg, #f59e0b, #d97706);
    color: #000;
    border: none;
    padding: 20px 60px;
    border-radius: 50px;
    font-size: clamp(18px, 3vw, 24px);
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 15px 40px rgba(245, 158, 11, 0.4);
    display: flex;
    align-items: center;
    gap: 15px;
    margin: 0 auto;
    border: 3px solid #fbbf24;
}

.cta-main-button:hover {
    transform: translateY(-3px);
    box-shadow: 0 20px 50px rgba(245, 158, 11, 0.6);
    background: linear-gradient(135deg, #fbbf24, #f59e0b);
}

.cta-main-button i {
    font-size: 1.2em;
}

.guarantee-text {
    margin-top: 20px;
    font-size: 14px;
    color: #9ca3af;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.payment-icons {
    display: flex;
    justify-content: center;
    gap: 15px;
    flex-wrap: wrap;
}

.payment-icon {
    width: 50px;
    height: 35px;
    background: #f3f4f6;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.payment-icon i {
    font-size: 24px;
}

.paypal i { color: #003087; }
.visa i { color: #1a1f71; }
.mastercard i { color: #eb001b; }
.amex i { color: #006fcf; }
.discover i { color: #ff6000; }

/* Responsive Design */
@media (max-width: 768px) {
    .cta-container {
        padding: 40px 20px;
        margin: 0 20px;
    }
    
    .cta-main-button {
        padding: 18px 40px;
        font-size: 18px;
    }
    
    .process-steps {
        gap: 12px;
    }
    
    .step-item {
        padding: 12px 15px;
    }
    
    .payment-icons {
        gap: 10px;
    }
    
    .payment-icon {
        width: 45px;
        height: 30px;
    }
}

@media (max-width: 480px) {
    .cta-bonus-line {
        flex-direction: column;
        gap: 5px;
        text-align: center;
    }
    
    .step-item {
        flex-direction: column;
        text-align: center;
        gap: 10px;
    }
}
/* Reset and Base Styles */
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        body {
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
            background: #000;
            color: #fff;
            line-height: 1.6;
            overflow-x: hidden;
        }

        /* Background Effects */
        .background-container {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            pointer-events: none;
            z-index: 0;
        }

        .background-gradient {
            position: absolute;
            inset: 0;
            background: linear-gradient(135deg, rgba(29, 78, 216, 0.2), rgba(147, 51, 234, 0.2), #000);
        }

        /* Geometric Shapes */
        .geometric-shapes {
            position: absolute;
            width: 100%;
            height: 100%;
        }

        .shape {
            position: absolute;
            border: 1px solid;
            transform: rotate(45deg);
        }

        .shape-1 {
            top: 80px;
            left: 40px;
            width: 128px;
            height: 128px;
            border-color: rgba(59, 130, 246, 0.3);
        }

        .shape-2 {
            top: 160px;
            left: 80px;
            width: 96px;
            height: 96px;
            border-color: rgba(147, 51, 234, 0.3);
            transform: rotate(12deg);
        }

        .shape-3 {
            bottom: 160px;
            left: 64px;
            width: 160px;
            height: 160px;
            border-color: rgba(6, 182, 212, 0.2);
        }

        .shape-4 {
            top: 128px;
            right: 80px;
            width: 112px;
            height: 112px;
            border-color: rgba(96, 165, 250, 0.3);
            transform: rotate(12deg);
        }

        .shape-5 {
            top: 240px;
            right: 40px;
            width: 144px;
            height: 144px;
            border-color: rgba(168, 85, 247, 0.2);
        }

        .shape-6 {
            bottom: 128px;
            right: 96px;
            width: 128px;
            height: 128px;
            border-color: rgba(34, 211, 238, 0.3);
            transform: rotate(12deg);
        }

        .dot {
            position: absolute;
            border-radius: 50%;
        }

        .dot-1 {
            top: 96px;
            left: 25%;
            width: 8px;
            height: 8px;
            background: #60a5fa;
        }

        .dot-2 {
            top: 192px;
            left: 33.333333%;
            width: 4px;
            height: 4px;
            background: #a855f7;
        }

        .dot-3 {
            top: 288px;
            right: 25%;
            width: 8px;
            height: 8px;
            background: #22d3ee;
        }

        .dot-4 {
            bottom: 192px;
            right: 33.333333%;
            width: 4px;
            height: 4px;
            background: #60a5fa;
        }

        /* Top Banner */
        .top-banner {
            position: relative;
            z-index: 10;
            background: #dc2626;
            color: white;
            text-align: center;
            padding: 8px;
            font-size: 14px;
        }

        .font-bold {
            font-weight: bold;
        }

        .ml-4 {
            margin-left: 16px;
        }

        /* Container */
        .container {
            position: relative;
            z-index: 10;
            max-width: 1200px;
            margin: 0 auto;
            padding: 32px 16px;
        }

        /* Logo Section */
        .logo-section {
            text-align: center;
            margin-bottom: 32px;
        }

        .logo-container {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 12px;
            margin-bottom: 16px;
        }

        .logo-icon {
            width: 48px;
            height: 48px;
            background: linear-gradient(135deg, #3b82f6, #8b5cf6);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .logo-icon i {
            font-size: 32px;
            color: white;
        }

        .logo-text {
            font-size: 48px;
            font-weight: bold;
        }

        .logo-prompt {
            color: white;
        }

        .logo-genius {
            color: #60a5fa;
        }

        .logo-ai {
            color: #22d3ee;
            font-size: 64px;
            margin-left: 8px;
        }

        .logo-subtitle {
            font-size: 14px;
            color: #d1d5db;
        }

        .highlight-pink {
            color: #ec4899;
            font-weight: 600;
        }

        /* Robot Characters */
        .robot-left {
            position: absolute;
            left: 32px;
            top: 50%;
            transform: translateY(-50%);
            z-index: 5;
        }

        .robot-container {
            width: 128px;
            height: 160px;
            position: relative;
        }

        .robot-body {
            width: 80px;
            height: 96px;
            background: linear-gradient(to bottom, #d1d5db, #9ca3af);
            border-radius: 8px;
            margin: 0 auto;
            position: relative;
            margin-top: 32px;
        }

        .robot-head {
            position: absolute;
            top: -32px;
            left: 50%;
            transform: translateX(-50%);
            width: 64px;
            height: 64px;
            background: linear-gradient(to bottom, white, #e5e7eb);
            border-radius: 50%;
        }

        .robot-eye {
            position: absolute;
            top: 16px;
            width: 8px;
            height: 8px;
            background: #3b82f6;
            border-radius: 50%;
        }

        .robot-eye-left {
            left: 12px;
        }

        .robot-eye-right {
            right: 12px;
        }

        .robot-smile {
            position: absolute;
            bottom: 12px;
            left: 50%;
            transform: translateX(-50%);
            width: 24px;
            height: 12px;
            border-bottom: 2px solid #4b5563;
            border-radius: 0 0 24px 24px;
        }

        .robot-chest {
            position: absolute;
            top: 24px;
            left: 50%;
            transform: translateX(-50%);
            width: 32px;
            height: 32px;
            background: linear-gradient(135deg, #22d3ee, #3b82f6);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .robot-chest i {
            color: white;
            font-size: 16px;
        }

        .robot-arm {
            position: absolute;
            top: 16px;
            width: 48px;
            height: 16px;
            background: linear-gradient(to right, #d1d5db, #9ca3af);
            border-radius: 8px;
        }

        .robot-arm-left {
            left: -24px;
            transform: rotate(12deg);
        }

        .robot-arm-right {
            right: -24px;
            transform: rotate(-12deg);
        }

        .robot-headphones {
            position: absolute;
            top: 0;
            left: 50%;
            transform: translateX(-50%);
            width: 80px;
            height: 24px;
            border: 4px solid #8b5cf6;
            border-radius: 40px 40px 0 0;
            border-bottom: none;
        }

        .robot-headphone {
            position: absolute;
            top: 8px;
            width: 16px;
            height: 16px;
            background: #8b5cf6;
            border-radius: 50%;
        }

        .robot-headphone-left {
            left: 8px;
        }

        .robot-headphone-right {
            right: 8px;
        }

        /* Robot Hand - Right Side */
        .robot-right {
            position: absolute;
            right: 32px;
            top: 33.333333%;
            z-index: 5;
        }

        .robot-hand-container {
            width: 96px;
            height: 128px;
            position: relative;
        }

        .robot-hand-arm {
            width: 24px;
            height: 80px;
            background: linear-gradient(to bottom, #60a5fa, #2563eb);
            border-radius: 8px;
            margin: 0 auto;
            position: relative;
        }

        .robot-hand-joint {
            position: absolute;
            width: 32px;
            height: 32px;
            background: linear-gradient(135deg, #93c5fd, #3b82f6);
            border-radius: 50%;
            left: -4px;
        }

        .robot-hand-joint-1 {
            top: 0;
        }

        .robot-hand-joint-2 {
            top: 16px;
        }

        .robot-hand-joint-3 {
            top: 32px;
        }

        .robot-fingers {
            position: absolute;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
            display: flex;
            gap: 4px;
        }

        .robot-finger {
            background: linear-gradient(to bottom, #60a5fa, #2563eb);
            border-radius: 4px;
            width: 8px;
        }

        .robot-finger-1 {
            height: 24px;
        }

        .robot-finger-2 {
            height: 32px;
        }

        .robot-finger-3 {
            height: 28px;
        }

        .robot-finger-4 {
            height: 20px;
        }

        /* Main Headlines */
        .main-headlines {
            text-align: center;
            max-width: 1200px;
            margin: 0 auto 48px;
        }

        .main-title {
            font-size: clamp(24px, 5vw, 48px);
            font-weight: bold;
            margin-bottom: 24px;
            line-height: 1.2;
        }

        .text-red {
            color: #ef4444;
        }

        .text-white {
            color: white;
        }

        .text-yellow {
            color: #fbbf24;
        }

        .text-green {
            color: #10b981;
        }

        .text-cyan {
            color: #22d3ee;
        }

        .text-purple {
            color: #a855f7;
        }

        .text-pink {
            color: #ec4899;
        }

        .text-orange {
            color: #f97316;
        }

        .text-gray-200 {
            color: #e5e7eb;
        }

        .text-gray-300 {
            color: #d1d5db;
        }

        .font-semibold {
            font-weight: 600;
        }

        .subtitle-box {
            background: linear-gradient(to right, #8b5cf6, #3b82f6);
            border-radius: 8px;
            padding: 16px;
            margin-bottom: 24px;
            max-width: 1000px;
            margin-left: auto;
            margin-right: auto;
        }

        .subtitle-text {
            font-size: clamp(16px, 3vw, 24px);
            font-weight: bold;
        }

        .description {
            font-size: 18px;
            margin-bottom: 16px;
            color: #e5e7eb;
        }

        .guarantee-box {
            background: linear-gradient(to right, #fbbf24, #f59e0b);
            color: black;
            padding: 12px 24px;
            border-radius: 8px;
            display: inline-block;
            font-weight: bold;
            font-size: 20px;
            margin-bottom: 24px;
        }

        /* Super Dashboard */
        .super-dashboard {
            position: relative;
            background: linear-gradient(to right, #8b5cf6, #3b82f6, #8b5cf6);
            border-radius: 8px;
            padding: 24px;
            margin-bottom: 32px;
            border: 2px solid #a855f7;
        }

        .arrow-left,
        .arrow-right {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            width: 0;
            height: 0;
        }

        .arrow-left {
            left: 16px;
            border-top: 8px solid transparent;
            border-bottom: 8px solid transparent;
            border-right: 12px solid #c4b5fd;
        }

        .arrow-right {
            right: 16px;
            border-top: 8px solid transparent;
            border-bottom: 8px solid transparent;
            border-left: 12px solid #c4b5fd;
        }

        .dashboard-title {
            font-size: clamp(20px, 4vw, 32px);
            font-weight: bold;
            color: white;
        }

        .final-description {
            font-size: 18px;
            margin-bottom: 32px;
            color: #e5e7eb;
            max-width: 800px;
            margin-left: auto;
            margin-right: auto;
        }

        /* Feature Icons */
        .feature-icons {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: 16px;
            margin-bottom: 32px;
        }

        .feature-icon {
            display: flex;
            align-items: center;
            gap: 8px;
            background: rgba(31, 41, 55, 0.5);
            padding: 8px 16px;
            border-radius: 8px;
        }

        .feature-icon i {
            color: #a855f7;
        }

        .feature-icon span {
            font-size: 14px;
            font-weight: 600;
        }

        /* AI Tools Section */
        .ai-tools-section {
            background: linear-gradient(to right, rgba(91, 33, 182, 0.3), rgba(30, 58, 138, 0.3));
            border-color: rgba(147, 51, 234, 0.3);
            border-radius: 8px;
            padding: 32px;
            margin-bottom: 48px;
            border: 1px solid rgba(147, 51, 234, 0.3);
        }

        .section-title {
            font-size: clamp(24px, 4vw, 36px);
            font-weight: bold;
            text-align: center;
            margin-bottom: 24px;
        }

        .tools-header {
            text-align: center;
            margin-bottom: 32px;
        }

        .tools-badge {
            display: inline-flex;
            align-items: center;
            background: linear-gradient(to right, #22d3ee, #3b82f6);
            color: white;
            padding: 12px 24px;
            border-radius: 8px;
            font-weight: bold;
            font-size: 20px;
            gap: 8px;
        }

        /* Tool Categories */
        .tool-category {
            margin-bottom: 32px;
        }

        .category-title {
            font-size: 32px;
            font-weight: bold;
            margin-bottom: 16px;
            display: flex;
            align-items: center;
            gap: 8px;
        }

        .tools-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
            gap: 16px;
            margin-bottom: 16px;
        }

        .tool-card {
            padding: 16px;
            border-radius: 8px;
            border: 1px solid;
        }

        .tool-card.basic {
            background: rgba(6, 95, 70, 0.2);
            border-color: rgba(16, 185, 129, 0.3);
        }

        .tool-card.pro {
            background: rgba(30, 58, 138, 0.2);
            border-color: rgba(59, 130, 246, 0.3);
        }

        .tool-card.premium {
            background: rgba(91, 33, 182, 0.2);
            border-color: rgba(147, 51, 234, 0.3);
        }

        .tool-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 8px;
        }

        .tool-name {
            font-weight: bold;
            color: white;
            font-size: 14px;
        }

        .tool-description {
            font-size: 12px;
            color: #d1d5db;
            margin-bottom: 8px;
        }

        .tool-plan {
            font-size: 12px;
            padding: 2px 8px;
            border-radius: 4px;
            color: white;
        }

        .tool-plan.basic {
            background: #10b981;
        }

        .tool-plan.pro {
            background: #3b82f6;
        }

        .tool-plan.premium {
            background: #8b5cf6;
        }

        .more-tools {
            text-align: center;
            color: #9ca3af;
        }

        /* Other Categories */
        .other-categories {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 24px;
        }

        .category-card {
            border-radius: 8px;
            padding: 24px;
            border: 1px solid;
        }

        .video-category {
            background: rgba(146, 64, 14, 0.2);
            border-color: rgba(245, 158, 11, 0.3);
        }

        .audio-category {
            background: rgba(6, 95, 70, 0.2);
            border-color: rgba(16, 185, 129, 0.3);
        }

        .code-category {
            background: rgba(154, 52, 18, 0.2);
            border-color: rgba(249, 115, 22, 0.3);
        }

        .category-card-title {
            font-size: 20px;
            font-weight: bold;
            margin-bottom: 16px;
        }

        .category-description {
            color: #d1d5db;
            margin-bottom: 16px;
        }

        .category-tools {
            display: flex;
            flex-direction: column;
            gap: 8px;
        }

        .tool-item {
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

        .tool-item span {
            font-size: 14px;
            color: white;
        }

        .tool-item i {
            color: #9ca3af;
            font-size: 12px;
        }

        .more-text {
            font-size: 12px;
            color: #9ca3af;
        }

        /* Personal Message Section */
        .personal-message-section {
            padding: 80px 0;
            background: linear-gradient(135deg, rgba(59, 130, 246, 0.08), rgba(147, 51, 234, 0.05));
            border-radius: 20px;
            margin-bottom: 60px;
            position: relative;
            overflow: hidden;
        }

        .personal-message-section::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 2px;
            background: linear-gradient(90deg, transparent, #6366f1, #8b5cf6, transparent);
        }

        .message-container {
            max-width: 900px;
            margin: 0 auto;
            text-align: center;
            position: relative;
        }

        .message-header {
            margin-bottom: 40px;
        }

        .message-icon {
            width: 80px;
            height: 80px;
            background: linear-gradient(135deg, #6366f1, #8b5cf6);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 20px;
            box-shadow: 0 20px 40px rgba(99, 102, 241, 0.3);
        }

        .message-icon i {
            font-size: 36px;
            color: white;
        }

        .message-greeting {
            font-size: clamp(28px, 4vw, 42px);
            font-weight: 700;
            color: #f3f4f6;
            margin-bottom: 10px;
            letter-spacing: -1px;
        }

        .message-content {
            display: flex;
            flex-direction: column;
            gap: 30px;
        }

        .message-paragraph {
            background: rgba(17, 24, 39, 0.6);
            border-radius: 15px;
            padding: 25px 30px;
            border-left: 4px solid #6366f1;
            text-align: left;
        }

        .message-paragraph p {
            font-size: 18px;
            line-height: 1.7;
            color: #d1d5db;
            margin: 0;
        }

        .highlight-tool {
            color: #60a5fa;
            font-weight: 600;
        }

        .highlight-negative {
            color: #f87171;
            font-weight: 600;
        }

        .highlight-positive {
            color: #34d399;
            font-weight: 600;
        }

        .highlight-mystery {
            color: #a78bfa;
            font-weight: 600;
        }

        .highlight-transform {
            background: linear-gradient(135deg, #10b981, #34d399);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
            font-weight: 700;
        }

        .message-climax {
            background: linear-gradient(135deg, rgba(16, 185, 129, 0.1), rgba(52, 211, 153, 0.05));
            border-radius: 15px;
            padding: 30px;
            border: 2px solid rgba(16, 185, 129, 0.3);
            text-align: center;
        }

        .climax-text {
            font-size: clamp(20px, 3vw, 28px);
            color: #f3f4f6;
            margin: 0;
            font-weight: 700;
        }

        .message-revelation {
            text-align: center;
            padding: 20px 0;
        }

        .revelation-text {
            font-size: clamp(18px, 2.5vw, 24px);
            color: #e5e7eb;
            margin: 0;
            line-height: 1.6;
        }

        .message-decoration {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 20px;
            margin-top: 40px;
        }

        .decoration-line {
            height: 2px;
            width: 100px;
            background: linear-gradient(90deg, transparent, #6366f1, transparent);
        }

        .decoration-dot {
            width: 12px;
            height: 12px;
            background: linear-gradient(135deg, #6366f1, #8b5cf6);
            border-radius: 50%;
            box-shadow: 0 0 20px rgba(99, 102, 241, 0.5);
        }

        /* Breakthrough Section */
        .breakthrough-section {
            position: relative;
            margin-bottom: 80px;
            overflow: hidden;
            border-radius: 20px;
        }

        .breakthrough-container {
            position: relative;
            background: linear-gradient(135deg, #0f1419, #1a1f36);
            padding: 60px 20px;
            border: 2px solid rgba(99, 102, 241, 0.3);
        }

        .breakthrough-bg {
            position: absolute;
            inset: 0;
            overflow: hidden;
        }

        .grid-pattern {
            position: absolute;
            inset: 0;
            background-image: 
                linear-gradient(rgba(99, 102, 241, 0.1) 1px, transparent 1px),
                linear-gradient(90deg, rgba(99, 102, 241, 0.1) 1px, transparent 1px);
            background-size: 30px 30px;
            opacity: 0.3;
        }

        .glow-effects {
            position: absolute;
            inset: 0;
        }

        .glow-circle {
            position: absolute;
            border-radius: 50%;
            filter: blur(40px);
            animation: floatGlow 8s infinite ease-in-out;
        }

        .glow-1 {
            width: 300px;
            height: 300px;
            background: radial-gradient(circle, rgba(99, 102, 241, 0.3), transparent 70%);
            top: -150px;
            left: -150px;
            animation-delay: 0s;
        }

        .glow-2 {
            width: 250px;
            height: 250px;
            background: radial-gradient(circle, rgba(168, 85, 247, 0.2), transparent 70%);
            top: 50%;
            right: -125px;
            animation-delay: -3s;
        }

        .glow-3 {
            width: 200px;
            height: 200px;
            background: radial-gradient(circle, rgba(34, 211, 238, 0.2), transparent 70%);
            bottom: -100px;
            left: 30%;
            animation-delay: -6s;
        }

        @keyframes floatGlow {
            0%, 100% { transform: translateY(0px) scale(1); }
            50% { transform: translateY(-20px) scale(1.1); }
        }

        .breakthrough-header {
            text-align: center;
            margin-bottom: 40px;
            position: relative;
            z-index: 2;
        }

        .breakthrough-title {
            font-size: clamp(24px, 4vw, 48px);
            font-weight: 900;
            margin-bottom: 20px;
            line-height: 1.2;
        }

        .breakthrough-label {
            background: linear-gradient(135deg, #22d3ee, #06b6d4);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
            display: block;
            font-size: 0.8em;
        }

        .breakthrough-main {
            color: #f3f4f6;
            display: block;
        }

        .breakthrough-subtitle {
            font-size: clamp(18px, 3vw, 32px);
            font-weight: 700;
            margin-bottom: 15px;
            line-height: 1.3;
        }

        .breakthrough-description {
            font-size: clamp(14px, 2vw, 20px);
            color: #d1d5db;
            margin-bottom: 30px;
        }

        .highlight-orange {
            color: #f97316;
            font-weight: 700;
        }

        .highlight-cyan {
            color: #22d3ee;
            font-weight: 700;
        }

        .highlight-white {
            color: #ffffff;
            font-weight: 600;
        }

        .main-promise {
            text-align: center;
            margin-bottom: 40px;
            position: relative;
            z-index: 2;
        }

        .promise-highlight {
            color: #fbbf24;
            font-size: clamp(18px, 3vw, 28px);
            font-weight: 700;
            margin-bottom: 20px;
        }

        .promise-frame {
            background: linear-gradient(135deg, #8b5cf6, #6366f1);
            border: 3px solid #a855f7;
            border-radius: 15px;
            padding: 20px 40px;
            font-size: clamp(24px, 4vw, 42px);
            font-weight: 900;
            color: white;
            text-transform: uppercase;
            letter-spacing: 1px;
            box-shadow: 0 20px 40px rgba(139, 92, 246, 0.3);
            position: relative;
            overflow: hidden;
        }

        .promise-frame::before {
            content: '';
            position: absolute;
            top: -2px;
            left: -2px;
            right: -2px;
            bottom: -2px;
            background: linear-gradient(45deg, #6366f1, #8b5cf6, #ec4899, #6366f1);
            border-radius: 15px;
            z-index: -1;
            animation: borderGlow 3s infinite linear;
        }

        @keyframes borderGlow {
            0% { transform: rotate(0deg); }
            100% { transform: rotate(360deg); }
        }

        .key-benefits {
            text-align: center;
            margin-bottom: 50px;
            position: relative;
            z-index: 2;
        }

        .benefit-text {
            font-size: clamp(16px, 2.5vw, 22px);
            color: #d1d5db;
            margin-bottom: 30px;
            line-height: 1.6;
        }

        .highlight-purple {
            background: linear-gradient(135deg, #a855f7, #8b5cf6);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
            font-weight: 700;
        }

        .highlight-red {
            color: #f87171;
            font-weight: 600;
        }

        .benefit-badges {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: 20px;
        }

        .benefit-badge {
            background: rgba(17, 24, 39, 0.8);
            border: 1px solid rgba(99, 102, 241, 0.5);
            border-radius: 25px;
            padding: 12px 24px;
            display: flex;
            align-items: center;
            gap: 8px;
            color: #d1d5db;
            font-weight: 600;
        }

        .benefit-badge i {
            color: #6366f1;
        }

        .product-showcase {
            text-align: center;
            margin-bottom: 60px;
            position: relative;
            z-index: 2;
        }

        .device-mockups {
            display: flex;
            justify-content: center;
            align-items: flex-end;
            gap: 30px;
            max-width: 800px;
            margin: 0 auto;
        }

        .device {
            border-radius: 10px;
            background: linear-gradient(135deg, #374151, #4b5563);
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
            position: relative;
        }

        .desktop {
            width: 280px;
            height: 180px;
            border-radius: 8px 8px 20px 20px;
        }

        .desktop::after {
            content: '';
            position: absolute;
            bottom: -20px;
            left: 50%;
            transform: translateX(-50%);
            width: 100px;
            height: 20px;
            background: linear-gradient(135deg, #4b5563, #374151);
            border-radius: 0 0 10px 10px;
        }

        .tablet {
            width: 200px;
            height: 140px;
            border-radius: 15px;
        }

        .mobile {
            width: 120px;
            height: 200px;
            border-radius: 20px;
        }

        .screen {
            background: linear-gradient(135deg, #0f172a, #1e293b);
            border-radius: inherit;
            padding: 15px;
            height: 100%;
            border: 2px solid #334155;
        }

        .app-interface {
            height: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 10px;
        }

        .app-logo {
            font-size: 14px;
            font-weight: 700;
            background: linear-gradient(135deg, #6366f1, #8b5cf6);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }

        .interface-elements {
            display: flex;
            gap: 8px;
            align-items: center;
        }

        .element-bar {
            height: 4px;
            background: linear-gradient(90deg, #6366f1, #8b5cf6);
            border-radius: 2px;
        }

        .element-bar:nth-child(1) { width: 30px; }
        .element-bar:nth-child(2) { width: 20px; }

        .element-circle {
            width: 8px;
            height: 8px;
            background: #22d3ee;
            border-radius: 50%;
        }

        .element-dot {
            width: 6px;
            height: 6px;
            background: #6366f1;
            border-radius: 50%;
        }

        .introduction-content {
            position: relative;
            z-index: 2;
            background: rgba(17, 24, 39, 0.6);
            border-radius: 20px;
            padding: 40px;
            border: 1px solid rgba(99, 102, 241, 0.2);
        }

        .intro-title {
            font-size: clamp(24px, 3vw, 36px);
            font-weight: 700;
            color: #f3f4f6;
            text-align: center;
            margin-bottom: 30px;
        }

        .intro-paragraphs {
            margin-bottom: 40px;
        }

        .intro-paragraph {
            font-size: 18px;
            line-height: 1.7;
            color: #d1d5db;
            margin-bottom: 20px;
        }

        .highlight-number {
            color: #fbbf24;
            font-weight: 700;
        }

        .intro-emphasis {
            font-size: 20px;
            font-weight: 700;
            color: #f3f4f6;
            text-align: center;
            margin: 30px 0;
        }

        .intro-description {
            font-size: 18px;
            line-height: 1.7;
            color: #d1d5db;
        }

        .how-it-works {
            border-top: 2px solid rgba(99, 102, 241, 0.3);
            padding-top: 40px;
        }

        .how-title {
            font-size: 24px;
            font-weight: 700;
            color: #f3f4f6;
            text-align: center;
            margin-bottom: 30px;
        }

        .steps-container {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
            gap: 20px;
            margin-bottom: 30px;
        }

        .step {
            background: rgba(31, 41, 55, 0.8);
            border-radius: 15px;
            padding: 20px;
            text-align: center;
            border: 1px solid rgba(99, 102, 241, 0.3);
        }

        .step-number {
            width: 40px;
            height: 40px;
            background: linear-gradient(135deg, #6366f1, #8b5cf6);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            font-weight: 700;
            font-size: 18px;
            margin: 0 auto 15px;
        }

        .step-content h5 {
            font-size: 16px;
            font-weight: 600;
            color: #f3f4f6;
            margin-bottom: 8px;
        }

        .step-content p {
            font-size: 14px;
            color: #9ca3af;
            line-height: 1.5;
        }

        .simplicity-statement {
            font-size: 20px;
            font-weight: 700;
            color: #f3f4f6;
            text-align: center;
            margin-bottom: 15px;
        }

        .power-statement {
            font-size: 18px;
            color: #d1d5db;
            text-align: center;
            font-style: italic;
        }

        /* Problem Section */
        .problem-section {
            background: linear-gradient(to right, rgba(153, 27, 27, 0.3), rgba(127, 29, 29, 0.3));
            border-color: rgba(239, 68, 68, 0.3);
            border-radius: 8px;
            padding: 32px;
            margin-bottom: 48px;
            border: 1px solid rgba(239, 68, 68, 0.3);
        }

        .section-intro,
        .section-description {
            font-size: 18px;
            text-align: center;
            margin-bottom: 24px;
            color: #e5e7eb;
        }

        .problem-list {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 16px;
            margin-bottom: 24px;
        }

        .problem-item {
            display: flex;
            align-items: flex-start;
            gap: 12px;
        }

        .problem-item i {
            margin-top: 4px;
            flex-shrink: 0;
        }

        .problem-conclusion {
            text-align: center;
        }

        /* Responsive Design */
        @media (max-width: 1024px) {
            .robot-left,
            .robot-right {
                display: none;
            }
            
            .container {
                padding: 16px;
            }
            
            .tools-grid {
                grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
            }
        }

        @media (max-width: 768px) {
            .logo-text {
                font-size: 32px;
            }
            
            .logo-ai {
                font-size: 48px;
            }
            
            .main-title {
                font-size: 24px;
            }
            
            .subtitle-text {
                font-size: 18px;
            }
            
            .section-title {
                font-size: 24px;
            }
            
            .other-categories {
                grid-template-columns: 1fr;
            }
        }

        @media (max-width: 480px) {
            .feature-icons {
                flex-direction: column;
                align-items: center;
            }
            
            .tools-grid {
                grid-template-columns: 1fr;
            }
        }
        * Call to Action Section Styles */
.cta-section {
    position: relative;
    margin: 80px 0;
}

.cta-container {
    position: relative;
    background: #1A0D2F;
    border-radius: 20px;
    padding: 80px 40px;
    border: 2px solid rgba(168, 85, 247, 0.4);
    overflow: hidden;
    box-shadow: 0 25px 80px rgba(0, 0, 0, 0.6);
}

.cta-background {
    position: absolute;
    inset: 0;
    overflow: hidden;
    border-radius: 20px;
}

.cta-grid-pattern {
    position: absolute;
    inset: 0;
    background-image: 
        linear-gradient(rgba(34, 211, 238, 0.1) 1px, transparent 1px),
        linear-gradient(90deg, rgba(34, 211, 238, 0.1) 1px, transparent 1px);
    background-size: 30px 30px;
    opacity: 0.4;
}

.cta-glow-effects {
    position: absolute;
    inset: 0;
}

.cta-glow-circle {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    animation: vibrantPulse 6s infinite ease-in-out;
}

.cta-glow-1 {
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(59, 130, 246, 0.3), transparent 70%);
    top: -150px;
    left: -150px;
    animation-delay: 0s;
}

.cta-glow-2 {
    width: 250px;
    height: 250px;
    background: radial-gradient(circle, rgba(147, 51, 234, 0.2), transparent 70%);
    top: 20%;
    right: -125px;
    animation-delay: -2s;
}

.cta-glow-3 {
    width: 200px;
    height: 200px;
    background: radial-gradient(circle, rgba(34, 211, 238, 0.2), transparent 70%);
    bottom: -100px;
    left: 30%;
    animation-delay: -4s;
}

.cta-glow-4 {
    width: 180px;
    height: 180px;
    background: radial-gradient(circle, rgba(168, 85, 247, 0.2), transparent 70%);
    top: 60%;
    left: -90px;
    animation-delay: -1s;
}

@keyframes vibrantPulse {
    0%, 100% { transform: scale(1) rotate(0deg); opacity: 0.6; }
    33% { transform: scale(1.2) rotate(120deg); opacity: 0.8; }
    66% { transform: scale(0.8) rotate(240deg); opacity: 1; }
}

.cta-content {
    position: relative;
    z-index: 2;
    text-align: center;
}

.cta-header {
    margin-bottom: 40px;
}

.cta-badge {
    background: linear-gradient(135deg, #8b5cf6, #6366f1);
    border-radius: 50px;
    padding: 15px 35px;
    display: inline-block;
    border: 2px solid rgba(147, 51, 234, 0.5);
    box-shadow: 0 15px 40px rgba(139, 92, 246, 0.3);
    animation: badgeGlow 3s infinite ease-in-out;
}

@keyframes badgeGlow {
    0%, 100% { box-shadow: 0 15px 40px rgba(139, 92, 246, 0.3); }
    50% { box-shadow: 0 20px 60px rgba(147, 51, 234, 0.5); }
}

.cta-badge-text {
    color: white;
    font-weight: 900;
    font-size: 18px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.cta-title-section {
    margin-bottom: 50px;
}

.cta-main-title {
    font-size: clamp(32px, 6vw, 56px);
    font-weight: 900;
    color: #ffffff;
    margin-bottom: 20px;
    line-height: 1.1;
    text-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}

.cta-title-highlight {
    background: linear-gradient(135deg, #60a5fa, #22d3ee);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: titleShimmer 3s infinite;
}

@keyframes titleShimmer {
    0%, 100% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
}

.cta-description {
    margin-bottom: 50px;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

.cta-description p {
    font-size: 20px;
    line-height: 1.7;
    color: #f3f4f6;
    margin-bottom: 20px;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.highlight-text {
    background: linear-gradient(135deg, #60a5fa, #8b5cf6);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 800;
}

.cta-product-showcase {
    margin: 60px 0;
}

.product-image-container {
    max-width: 700px;
    margin: 0 auto;
}

.product-image {
    width: 100%;
    height: auto;
    border-radius: 20px;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.4);
}

.image-placeholder {
    background: linear-gradient(135deg, rgba(17, 24, 39, 0.9), rgba(31, 41, 55, 0.8));
    border: 2px solid rgba(147, 51, 234, 0.4);
    border-radius: 20px;
    padding: 80px 40px;
    text-align: center;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(10px);
}

.placeholder-content i {
    font-size: 64px;
    background: linear-gradient(135deg, #60a5fa, #8b5cf6, #22d3ee);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 20px;
    display: block;
    animation: iconPulse 2s infinite ease-in-out;
}

@keyframes iconPulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

.placeholder-content span {
    font-size: 24px;
    font-weight: 700;
    color: #f3f4f6;
    display: block;
    margin-bottom: 10px;
}

.placeholder-content p {
    font-size: 16px;
    color: #22d3ee;
    font-weight: 600;
}

.cta-process {
    margin: 60px 0;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.cta-process h3 {
    font-size: 32px;
    font-weight: 800;
    color: #ffffff;
    text-align: center;
    margin-bottom: 40px;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.process-steps {
    display: grid;
    gap: 20px;
    margin-bottom: 30px;
}

.step-item {
    display: flex;
    align-items: center;
    gap: 20px;
    background: linear-gradient(135deg, rgba(17, 24, 39, 0.8), rgba(31, 41, 55, 0.6));
    padding: 25px 30px;
    border-radius: 15px;
    border-left: 4px solid rgba(147, 51, 234, 0.6);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(10px);
    transition: all 0.3s ease;
}

.step-item:hover {
    transform: translateX(10px);
    box-shadow: 0 15px 40px rgba(147, 51, 234, 0.2);
}

.step-number {
    background: linear-gradient(135deg, #8b5cf6, #6366f1);
    color: white;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 900;
    font-size: 20px;
    flex-shrink: 0;
    box-shadow: 0 8px 20px rgba(139, 92, 246, 0.4);
    border: 2px solid rgba(147, 51, 234, 0.3);
}

.step-content span {
    color: #f3f4f6;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.4;
}

.process-conclusion {
    text-align: center;
    font-size: 24px;
    color: #ffffff;
    font-weight: 800;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.cta-pricing {
    margin: 50px 0;
}

.pricing-text {
    font-size: clamp(20px, 4vw, 28px);
    color: #f3f4f6;
    line-height: 1.5;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.program-name {
    background: linear-gradient(135deg, #22d3ee, #fbbf24);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 900;
    font-size: 1.1em;
}

.price-highlight {
    color: #fbbf24;
    font-weight: 900;
    font-size: 1.4em;
    text-shadow: 0 4px 8px rgba(251, 191, 36, 0.3);
}

.original-price {
    color: #f87171;
    text-decoration: line-through;
    font-size: 0.8em;
}

.cta-button-section {
    margin: 60px 0 50px;
}

.cta-main-button {
    background: linear-gradient(135deg, #fbbf24, #f59e0b, #ea580c);
    color: #000;
    border: none;
    padding: 25px 80px;
    border-radius: 60px;
    font-size: clamp(20px, 4vw, 28px);
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 2px;
    cursor: pointer;
    transition: all 0.4s ease;
    box-shadow: 0 20px 60px rgba(245, 158, 11, 0.6);
    display: flex;
    align-items: center;
    gap: 20px;
    margin: 0 auto;
    border: 4px solid #ffffff;
    animation: buttonPulse 2s infinite;
}

@keyframes buttonPulse {
    0%, 100% { transform: scale(1); box-shadow: 0 20px 60px rgba(245, 158, 11, 0.6); }
    50% { transform: scale(1.05); box-shadow: 0 25px 80px rgba(245, 158, 11, 0.8); }
}

.cta-main-button:hover {
    transform: translateY(-5px) scale(1.05);
    box-shadow: 0 30px 100px rgba(245, 158, 11, 0.8);
    background: linear-gradient(135deg, #f59e0b, #fbbf24, #22d3ee);
}

.cta-main-button i {
    font-size: 1.3em;
}

.guarantee-text {
    margin-top: 25px;
    font-size: 16px;
    color: #22d3ee;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.payment-icons {
    display: flex;
    justify-content: center;
    gap: 20px;
    flex-wrap: wrap;
}

.payment-icon {
    width: 60px;
    height: 40px;
    background: #ffffff;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.payment-icon:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.2);
}

.payment-icon i {
    font-size: 28px;
}

.paypal i { color: #003087; }
.visa i { color: #1a1f71; }
.mastercard i { color: #eb001b; }
.amex i { color: #006fcf; }
.discover i { color: #ff6000; }

/* Responsive Design */
@media (max-width: 1024px) {
    .cta-container {
        padding: 60px 30px;
    }
}

@media (max-width: 768px) {
    .cta-container {
        padding: 50px 20px;
        margin: 0 20px;
    }
    
    .cta-main-button {
        padding: 20px 50px;
        font-size: 20px;
    }
    
    .process-steps {
        gap: 15px;
    }
    
    .step-item {
        padding: 20px 20px;
        flex-direction: column;
        text-align: center;
        gap: 15px;
    }
    
    .step-item:hover {
        transform: translateY(-5px);
    }
    
    .payment-icons {
        gap: 15px;
    }
    
    .payment-icon {
        width: 50px;
        height: 35px;
    }
}

@media (max-width: 480px) {
    .cta-badge {
        padding: 12px 25px;
    }
    
    .cta-badge-text {
        font-size: 14px;
    }
    
    .step-number {
        width: 40px;
        height: 40px;
        font-size: 18px;
    }
}
/* Features Section Styles */
.features-section {
    position: relative;
    margin: 0;
    padding: 0;
}

.features-container {
    position: relative;
    background: #1A0D2F;
    padding: 80px 40px;
    overflow: hidden;
    border-top: 2px solid rgba(168, 85, 247, 0.2);
}

.features-background {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.features-grid-pattern {
    position: absolute;
    inset: 0;
    background-image: 
        linear-gradient(rgba(168, 85, 247, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(168, 85, 247, 0.05) 1px, transparent 1px);
    background-size: 40px 40px;
    opacity: 0.3;
}

.features-glow-effects {
    position: absolute;
    inset: 0;
}

.features-glow-circle {
    position: absolute;
    border-radius: 50%;
    filter: blur(100px);
    animation: featuresFloat 10s infinite ease-in-out;
}

.features-glow-1 {
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(168, 85, 247, 0.1), transparent 70%);
    top: 10%;
    left: -200px;
    animation-delay: 0s;
}

.features-glow-2 {
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(59, 130, 246, 0.08), transparent 70%);
    top: 50%;
    right: -150px;
    animation-delay: -5s;
}

.features-glow-3 {
    width: 250px;
    height: 250px;
    background: radial-gradient(circle, rgba(192, 132, 252, 0.08), transparent 70%);
    bottom: 20%;
    left: 40%;
    animation-delay: -2.5s;
}

@keyframes featuresFloat {
    0%, 100% { transform: translateY(0px) scale(1); }
    50% { transform: translateY(-30px) scale(1.1); }
}

.features-content {
    position: relative;
    z-index: 2;
    max-width: 1200px;
    margin: 0 auto;
}

.features-header {
    text-align: center;
    margin-bottom: 80px;
}

.features-main-title {
    font-size: clamp(32px, 6vw, 56px);
    font-weight: 900;
    color: #E5E7EB;
    line-height: 1.2;
    text-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
    margin-bottom: 20px;
}

.features-title-highlight {
    background: linear-gradient(135deg, #A78BFA, #60A5FA);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.features-list {
    display: flex;
    flex-direction: column;
    gap: 60px;
}

.feature-item {
    background: linear-gradient(135deg, rgba(17, 24, 39, 0.6), rgba(31, 41, 55, 0.4));
    border-radius: 20px;
    padding: 40px;
    border: 1px solid rgba(168, 85, 247, 0.2);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(10px);
    transition: all 0.3s ease;
}

.feature-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 30px 80px rgba(168, 85, 247, 0.1);
    border-color: rgba(168, 85, 247, 0.4);
}

.feature-header {
    display: flex;
    align-items: flex-start;
    gap: 25px;
    margin-bottom: 30px;
}

.feature-number {
    background: linear-gradient(135deg, #A78BFA, #8B5CF6);
    color: white;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 900;
    font-size: 24px;
    flex-shrink: 0;
    box-shadow: 0 10px 30px rgba(168, 85, 247, 0.4);
    border: 2px solid rgba(192, 132, 252, 0.5);
}

.feature-title-wrapper {
    flex: 1;
}

.feature-title {
    font-size: clamp(24px, 4vw, 36px);
    font-weight: 800;
    color: #E5E7EB;
    margin-bottom: 8px;
    line-height: 1.3;
}

.feature-subtitle {
    font-size: 18px;
    color: #A78BFA;
    font-weight: 600;
    font-style: italic;
    margin: 0;
}

.feature-content {
    margin-left: 85px;
}

.feature-intro {
    font-size: 20px;
    color: #D1D5DB;
    margin-bottom: 20px;
    font-weight: 500;
}

.feature-description {
    font-size: 18px;
    color: #D1D5DB;
    margin-bottom: 30px;
    line-height: 1.6;
}

.highlight-number {
    background: linear-gradient(135deg, #A78BFA, #C084FC);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 800;
}

.highlight-text {
    background: linear-gradient(135deg, #A78BFA, #60A5FA);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
}

.highlight-multiplier {
    color: #FBBF24;
    font-weight: 900;
    font-size: 1.1em;
}

.feature-categories {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-bottom: 25px;
}

.category-item {
    background: rgba(31, 41, 55, 0.4);
    border-radius: 12px;
    padding: 20px;
    border-left: 4px solid #A78BFA;
}

.category-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
}

.category-header i {
    color: #A78BFA;
    font-size: 18px;
    width: 20px;
}

.category-name {
    font-weight: 700;
    color: #E5E7EB;
    font-size: 16px;
}

.category-tools {
    color: #D1D5DB;
    line-height: 1.5;
    margin: 0;
    margin-left: 32px;
}

.template-categories {
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin-bottom: 25px;
}

.template-category {
    background: rgba(31, 41, 55, 0.3);
    border-radius: 10px;
    padding: 15px 20px;
    border-left: 3px solid #60A5FA;
}

.template-category-name {
    color: #A78BFA;
    display: block;
    margin-bottom: 5px;
}

.template-list {
    color: #D1D5DB;
    line-height: 1.4;
}

.optimizer-features {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-bottom: 25px;
}

.optimizer-item {
    display: flex;
    align-items: center;
    gap: 20px;
    background: rgba(31, 41, 55, 0.4);
    border-radius: 12px;
    padding: 20px;
    border: 1px solid rgba(168, 85, 247, 0.2);
}

.optimizer-icon {
    width: 50px;
    height: 50px;
    background: linear-gradient(135deg, #A78BFA, #8B5CF6);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.optimizer-icon i {
    color: white;
    font-size: 20px;
}

.optimizer-content {
    color: #D1D5DB;
    font-size: 16px;
    line-height: 1.4;
}

.optimizer-content strong {
    color: #E5E7EB;
}

.plans-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
    margin-bottom: 25px;
}

.plan-item {
    border-radius: 15px;
    padding: 25px;
    text-align: center;
    border: 2px solid;
    transition: all 0.3s ease;
}

.basic-plan {
    background: rgba(16, 185, 129, 0.1);
    border-color: rgba(16, 185, 129, 0.3);
}

.pro-plan {
    background: rgba(59, 130, 246, 0.1);
    border-color: rgba(59, 130, 246, 0.3);
}

.premium-plan {
    background: rgba(168, 85, 247, 0.1);
    border-color: rgba(168, 85, 247, 0.3);
}

.plan-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
}

.plan-header {
    margin-bottom: 15px;
}

.plan-name {
    font-size: 20px;
    font-weight: 700;
    color: #E5E7EB;
    margin: 0;
}

.plan-description {
    color: #D1D5DB;
    font-size: 16px;
    line-height: 1.4;
    margin: 0;
}

.plan-number {
    font-weight: 700;
    color: #A78BFA;
}

.vault-features {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.vault-item {
    display: flex;
    align-items: center;
    gap: 20px;
    background: rgba(31, 41, 55, 0.3);
    border-radius: 12px;
    padding: 20px;
    border-left: 4px solid #A78BFA;
}

.vault-item i {
    color: #A78BFA;
    font-size: 20px;
    width: 24px;
    text-align: center;
}

.vault-item span {
    color: #D1D5DB;
    font-size: 16px;
    line-height: 1.4;
}

.vault-item strong {
    color: #E5E7EB;
}

.feature-conclusion {
    font-size: 18px;
    color: #D1D5DB;
    font-weight: 500;
    line-height: 1.6;
    font-style: italic;
    background: rgba(168, 85, 247, 0.05);
    padding: 20px;
    border-radius: 12px;
    border-left: 4px solid #A78BFA;
    margin-top: 20px;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .features-container {
        padding: 60px 30px;
    }
    
    .feature-content {
        margin-left: 0;
    }
    
    .feature-header {
        flex-direction: column;
        text-align: center;
        gap: 20px;
    }
    
    .optimizer-features {
        gap: 15px;
    }
    
    .optimizer-item {
        flex-direction: column;
        text-align: center;
        gap: 15px;
    }
}

@media (max-width: 768px) {
    .features-container {
        padding: 50px 20px;
    }
    
    .features-list {
        gap: 40px;
    }
    
    .feature-item {
        padding: 30px 20px;
    }
    
    .plans-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    
    .vault-item {
        flex-direction: column;
        text-align: center;
        gap: 15px;
    }
}

@media (max-width: 480px) {
    .feature-number {
        width: 50px;
        height: 50px;
        font-size: 20px;
    }
    
    .category-tools {
        margin-left: 0;
        margin-top: 10px;
    }
}
/* Hidden Cost Section Styles */
.hidden-cost-section {
    position: relative;
    margin: 0;
    padding: 0;
}

.hidden-cost-container {
    position: relative;
    background: #1A0D2F;
    padding: 80px 40px;
    overflow: hidden;
    border-top: 2px solid rgba(239, 68, 68, 0.3);
}

.cost-background {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.cost-grid-pattern {
    position: absolute;
    inset: 0;
    background-image: 
        linear-gradient(rgba(239, 68, 68, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(239, 68, 68, 0.05) 1px, transparent 1px);
    background-size: 35px 35px;
    opacity: 0.4;
}

.cost-glow-effects {
    position: absolute;
    inset: 0;
}

.cost-glow-circle {
    position: absolute;
    border-radius: 50%;
    filter: blur(120px);
    animation: costFloat 12s infinite ease-in-out;
}

.cost-glow-1 {
    width: 350px;
    height: 350px;
    background: radial-gradient(circle, rgba(239, 68, 68, 0.08), transparent 70%);
    top: 15%;
    left: -175px;
    animation-delay: 0s;
}

.cost-glow-2 {
    width: 280px;
    height: 280px;
    background: radial-gradient(circle, rgba(245, 101, 101, 0.06), transparent 70%);
    top: 60%;
    right: -140px;
    animation-delay: -4s;
}

.cost-glow-3 {
    width: 220px;
    height: 220px;
    background: radial-gradient(circle, rgba(220, 38, 127, 0.06), transparent 70%);
    bottom: 25%;
    left: 45%;
    animation-delay: -8s;
}

@keyframes costFloat {
    0%, 100% { transform: translateY(0px) scale(1); opacity: 0.6; }
    50% { transform: translateY(-25px) scale(1.05); opacity: 0.8; }
}

.cost-content {
    position: relative;
    z-index: 2;
    max-width: 1200px;
    margin: 0 auto;
}

.cost-header {
    text-align: center;
    margin-bottom: 80px;
}

.cost-main-title {
    font-size: clamp(36px, 6vw, 60px);
    font-weight: 900;
    color: #E5E7EB;
    line-height: 1.2;
    margin-bottom: 30px;
    text-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
}

.cost-title-highlight {
    color: #EF4444;
    font-size: 1.1em;
}

.cost-brand {
    background: linear-gradient(135deg, #A78BFA, #60A5FA);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.cost-intro {
    font-size: 22px;
    color: #D1D5DB;
    font-weight: 500;
    max-width: 800px;
    margin: 0 auto;
    line-height: 1.5;
}

.cost-breakdown {
    display: flex;
    flex-direction: column;
    gap: 40px;
    margin-bottom: 80px;
}

.cost-item {
    display: flex;
    align-items: flex-start;
    gap: 30px;
    background: linear-gradient(135deg, rgba(17, 24, 39, 0.7), rgba(31, 41, 55, 0.5));
    border-radius: 20px;
    padding: 40px;
    border-left: 5px solid;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    transition: all 0.3s ease;
}

.time-cost {
    border-left-color: #F59E0B;
}

.opportunity-cost {
    border-left-color: #EF4444;
}

.subscription-cost {
    border-left-color: #EC4899;
}

.learning-cost {
    border-left-color: #8B5CF6;
}

.cost-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.4);
}

.cost-icon {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.time-cost .cost-icon {
    background: linear-gradient(135deg, #F59E0B, #D97706);
}

.opportunity-cost .cost-icon {
    background: linear-gradient(135deg, #EF4444, #DC2626);
}

.subscription-cost .cost-icon {
    background: linear-gradient(135deg, #EC4899, #BE185D);
}

.learning-cost .cost-icon {
    background: linear-gradient(135deg, #8B5CF6, #7C3AED);
}

.cost-icon i {
    font-size: 28px;
    color: white;
}

.cost-details {
    flex: 1;
}

.cost-category {
    font-size: 28px;
    font-weight: 800;
    color: #E5E7EB;
    margin-bottom: 20px;
}

.cost-calculation {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.cost-description {
    font-size: 18px;
    color: #D1D5DB;
    line-height: 1.6;
    margin: 0;
}

.cost-number {
    color: #FBBF24;
    font-weight: 700;
}

.cost-math {
    display: flex;
    align-items: center;
    gap: 15px;
    background: rgba(31, 41, 55, 0.6);
    padding: 20px;
    border-radius: 12px;
    flex-wrap: wrap;
}

.math-item {
    background: linear-gradient(135deg, #6366F1, #8B5CF6);
    color: white;
    padding: 8px 16px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 16px;
}

.math-operator,
.math-equals {
    color: #A78BFA;
    font-size: 20px;
    font-weight: 900;
}

.cost-result {
    background: linear-gradient(135deg, #EF4444, #DC2626);
    color: white;
    padding: 10px 20px;
    border-radius: 10px;
    font-weight: 900;
    font-size: 20px;
    box-shadow: 0 5px 15px rgba(239, 68, 68, 0.3);
}

.cost-impact {
    color: #F87171;
    font-weight: 600;
    font-style: italic;
    margin: 0;
}

.opportunity-questions {
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin-bottom: 20px;
}

.opportunity-question {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    background: rgba(239, 68, 68, 0.1);
    padding: 15px 20px;
    border-radius: 10px;
    border-left: 3px solid #EF4444;
}

.opportunity-question i {
    color: #EF4444;
    margin-top: 3px;
    flex-shrink: 0;
}

.opportunity-question span {
    color: #D1D5DB;
    font-weight: 500;
    line-height: 1.4;
}

.cost-result-box {
    text-align: center;
    background: rgba(31, 41, 55, 0.6);
    padding: 20px;
    border-radius: 12px;
}

.subscription-waste {
    text-align: center;
    margin: 20px 0;
}

.waste-indicator {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: rgba(239, 68, 68, 0.1);
    color: #F87171;
    padding: 15px 25px;
    border-radius: 25px;
    font-weight: 600;
    border: 1px solid rgba(239, 68, 68, 0.3);
}

.waste-indicator i {
    color: #EF4444;
    animation: flicker 2s infinite;
}

@keyframes flicker {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

.cost-estimate,
.cost-range {
    text-align: center;
    background: rgba(31, 41, 55, 0.6);
    padding: 20px;
    border-radius: 12px;
}

.learning-limitation {
    display: flex;
    align-items: center;
    gap: 15px;
    background: rgba(245, 101, 101, 0.1);
    padding: 15px 20px;
    border-radius: 10px;
    border-left: 3px solid #F59E0B;
    margin: 15px 0;
}

.learning-limitation i {
    color: #F59E0B;
}

.learning-limitation span {
    color: #D1D5DB;
    font-weight: 500;
}

.total-cost-section {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.1), rgba(220, 38, 127, 0.05));
    border-radius: 20px;
    padding: 50px 40px;
    text-align: center;
    margin-bottom: 60px;
    border: 2px solid rgba(239, 68, 68, 0.2);
}

.total-cost-title {
    font-size: 36px;
    font-weight: 800;
    color: #E5E7EB;
    margin-bottom: 15px;
}

.total-cost-description {
    font-size: 20px;
    color: #D1D5DB;
    margin-bottom: 40px;
}

.total-cost-display {
    margin-bottom: 30px;
}

.total-amount {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    font-size: clamp(60px, 10vw, 120px);
    font-weight: 900;
    color: #EF4444;
    line-height: 1;
    text-shadow: 0 8px 16px rgba(239, 68, 68, 0.3);
}

.currency {
    font-size: 0.7em;
}

.plus {
    font-size: 0.8em;
    color: #F87171;
}

.total-period {
    font-size: 24px;
    color: #F87171;
    font-weight: 600;
    margin: 0;
}

.total-note {
    font-size: 20px;
    color: #D1D5DB;
    font-weight: 500;
}

.emotional-cost-section {
    background: rgba(31, 41, 55, 0.4);
    border-radius: 20px;
    padding: 40px;
    text-align: center;
    margin-bottom: 60px;
    border: 1px solid rgba(168, 85, 247, 0.2);
}

.emotional-cost-title {
    font-size: 28px;
    font-weight: 700;
    color: #E5E7EB;
    margin-bottom: 30px;
}

.emotional-costs {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 40px;
    flex-wrap: wrap;
}

.emotional-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
    color: #F87171;
    font-size: 18px;
    font-weight: 600;
}

.emotional-item i {
    font-size: 32px;
    color: #EF4444;
}

.solution-section {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.1), rgba(5, 150, 105, 0.05));
    border-radius: 20px;
    padding: 50px 40px;
    border: 2px solid rgba(16, 185, 129, 0.3);
}

.solution-container {
    text-align: center;
}

.solution-title {
    font-size: clamp(28px, 5vw, 42px);
    font-weight: 900;
    background: linear-gradient(135deg, #10B981, #059669);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 15px;
}

.solution-description {
    font-size: 22px;
    color: #D1D5DB;
    margin-bottom: 40px;
    font-weight: 500;
}

.solution-comparison {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 40px;
    margin-bottom: 40px;
    flex-wrap: wrap;
}

.comparison-item {
    background: rgba(31, 41, 55, 0.6);
    border-radius: 15px;
    padding: 30px;
    text-align: center;
    min-width: 200px;
    transition: all 0.3s ease;
}

.losing {
    border: 2px solid rgba(239, 68, 68, 0.4);
}

.saving {
    border: 2px solid rgba(16, 185, 129, 0.4);
}

.comparison-item:hover {
    transform: translateY(-3px);
}

.comparison-header {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 15px;
    font-weight: 600;
}

.losing .comparison-header {
    color: #F87171;
}

.saving .comparison-header {
    color: #34D399;
}

.comparison-amount {
    font-size: 36px;
    font-weight: 900;
    margin-bottom: 5px;
}

.losing .comparison-amount {
    color: #EF4444;
}

.saving .comparison-amount {
    color: #10B981;
}

.comparison-period {
    color: #9CA3AF;
    font-weight: 500;
}

.comparison-vs {
    font-size: 24px;
    font-weight: 900;
    color: #A78BFA;
    background: rgba(168, 85, 247, 0.1);
    padding: 15px 20px;
    border-radius: 10px;
}

.savings-highlight {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    background: rgba(16, 185, 129, 0.1);
    padding: 25px 30px;
    border-radius: 15px;
    border: 1px solid rgba(16, 185, 129, 0.3);
    font-size: 20px;
    color: #D1D5DB;
    font-weight: 500;
}

.savings-highlight i {
    color: #10B981;
    font-size: 24px;
}

.savings-highlight strong {
    color: #34D399;
    font-weight: 700;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .hidden-cost-container {
        padding: 60px 30px;
    }
    
    .cost-item {
        flex-direction: column;
        text-align: center;
        gap: 25px;
    }
    
    .cost-math {
        justify-content: center;
    }
}

@media (max-width: 768px) {
    .hidden-cost-container {
        padding: 50px 20px;
    }
    
    .cost-breakdown {
        gap: 30px;
    }
    
    .cost-item {
        padding: 30px 20px;
    }
    
    .solution-comparison {
        flex-direction: column;
        gap: 20px;
    }
    
    .comparison-vs {
        order: 2;
    }
    
    .emotional-costs {
        flex-direction: column;
        gap: 25px;
    }
}

@media (max-width: 480px) {
    .cost-math {
        flex-direction: column;
        gap: 10px;
        align-items: center;
    }
    
    .math-item {
        font-size: 14px;
        padding: 6px 12px;
    }
    
    .total-amount {
        font-size: 60px;
    }
}
/* Why Promptly AI Works Section Styles */
.why-works-section {
    position: relative;
    margin: 0;
    padding: 0;
}

.why-works-container {
    position: relative;
    background: #1A0D2F;
    padding: 80px 40px;
    overflow: hidden;
    border-top: 2px solid rgba(16, 185, 129, 0.3);
}

.works-background {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.works-grid-pattern {
    position: absolute;
    inset: 0;
    background-image: 
        linear-gradient(rgba(16, 185, 129, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(16, 185, 129, 0.04) 1px, transparent 1px);
    background-size: 45px 45px;
    opacity: 0.5;
}

.works-glow-effects {
    position: absolute;
    inset: 0;
}

.works-glow-circle {
    position: absolute;
    border-radius: 50%;
    filter: blur(100px);
    animation: worksFloat 15s infinite ease-in-out;
}

.works-glow-1 {
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(16, 185, 129, 0.08), transparent 70%);
    top: 10%;
    left: -200px;
    animation-delay: 0s;
}

.works-glow-2 {
    width: 320px;
    height: 320px;
    background: radial-gradient(circle, rgba(59, 130, 246, 0.06), transparent 70%);
    top: 50%;
    right: -160px;
    animation-delay: -5s;
}

.works-glow-3 {
    width: 280px;
    height: 280px;
    background: radial-gradient(circle, rgba(168, 85, 247, 0.06), transparent 70%);
    bottom: 20%;
    left: 50%;
    animation-delay: -10s;
}

@keyframes worksFloat {
    0%, 100% { transform: translateY(0px) scale(1); opacity: 0.5; }
    50% { transform: translateY(-35px) scale(1.1); opacity: 0.8; }
}

.works-content {
    position: relative;
    z-index: 2;
    max-width: 1200px;
    margin: 0 auto;
}

.works-header {
    text-align: center;
    margin-bottom: 60px;
}

.works-main-title {
    font-size: clamp(36px, 6vw, 58px);
    font-weight: 900;
    color: #E5E7EB;
    line-height: 1.2;
    text-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
}

.works-brand-highlight {
    background: linear-gradient(135deg, #A78BFA, #60A5FA);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.works-failure-highlight {
    color: #F87171;
}

.problem-statement {
    margin-bottom: 40px;
}

.problem-box {
    display: flex;
    align-items: center;
    gap: 25px;
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.1), rgba(220, 38, 127, 0.05));
    border-radius: 20px;
    padding: 30px 40px;
    border-left: 5px solid #EF4444;
    max-width: 900px;
    margin: 0 auto;
}

.problem-icon {
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, #EF4444, #DC2626);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.problem-icon i {
    color: white;
    font-size: 24px;
}

.problem-text p {
    font-size: 20px;
    color: #D1D5DB;
    margin: 0;
    line-height: 1.5;
}

.problem-highlight {
    color: #F87171;
    font-weight: 700;
}

.solution-highlight {
    background: linear-gradient(135deg, #10B981, #059669);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
}

.solution-statement {
    margin-bottom: 80px;
}

.solution-box {
    display: flex;
    align-items: center;
    gap: 25px;
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.1), rgba(5, 150, 105, 0.05));
    border-radius: 20px;
    padding: 30px 40px;
    border-left: 5px solid #10B981;
    max-width: 1000px;
    margin: 0 auto;
}

.solution-icon {
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, #10B981, #059669);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    animation: pulse 3s infinite;
}

@keyframes pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.4); }
    50% { box-shadow: 0 0 0 20px rgba(16, 185, 129, 0); }
}

.solution-icon i {
    color: white;
    font-size: 24px;
}

.solution-text p {
    font-size: 20px;
    color: #D1D5DB;
    margin: 0;
    line-height: 1.6;
}

.psychology-highlight {
    background: linear-gradient(135deg, #FBBF24, #F59E0B);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
}

.principles-intro {
    text-align: center;
    margin-bottom: 60px;
}

.principles-title {
    font-size: 28px;
    font-weight: 700;
    color: #E5E7EB;
    max-width: 800px;
    margin: 0 auto;
}

.principles-list {
    display: flex;
    flex-direction: column;
    gap: 50px;
    margin-bottom: 80px;
}

.principle-item {
    background: linear-gradient(135deg, rgba(17, 24, 39, 0.7), rgba(31, 41, 55, 0.5));
    border-radius: 20px;
    padding: 40px;
    border: 1px solid;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(10px);
    transition: all 0.3s ease;
}

.authority-principle {
    border-color: rgba(251, 191, 36, 0.3);
}

.specificity-principle {
    border-color: rgba(59, 130, 246, 0.3);
}

.context-principle {
    border-color: rgba(168, 85, 247, 0.3);
}

.output-principle {
    border-color: rgba(16, 185, 129, 0.3);
}

.quality-principle {
    border-color: rgba(236, 72, 153, 0.3);
}

.principle-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.4);
}

.principle-header {
    display: flex;
    align-items: center;
    gap: 25px;
    margin-bottom: 25px;
}

.principle-icon {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.authority-principle .principle-icon {
    background: linear-gradient(135deg, #FBBF24, #F59E0B);
}

.specificity-principle .principle-icon {
    background: linear-gradient(135deg, #3B82F6, #1D4ED8);
}

.context-principle .principle-icon {
    background: linear-gradient(135deg, #A855F7, #7C3AED);
}

.output-principle .principle-icon {
    background: linear-gradient(135deg, #10B981, #059669);
}

.quality-principle .principle-icon {
    background: linear-gradient(135deg, #EC4899, #BE185D);
}

.principle-icon i {
    font-size: 24px;
    color: white;
}

.principle-name {
    font-size: 28px;
    font-weight: 800;
    color: #E5E7EB;
    margin: 0;
}

.principle-description {
    font-size: 18px;
    color: #D1D5DB;
    line-height: 1.6;
    margin-bottom: 25px;
}

.benefit-highlight {
    background: linear-gradient(135deg, #10B981, #34D399);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
}

.emphasis-highlight {
    color: #FBBF24;
    font-weight: 800;
    font-size: 1.1em;
}

.principle-example {
    background: rgba(31, 41, 55, 0.4);
    border-radius: 12px;
    padding: 20px;
    border-left: 4px solid #FBBF24;
}

.example-label {
    color: #FBBF24;
    font-weight: 600;
    font-size: 14px;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.example-text {
    color: #E5E7EB;
    font-style: italic;
    font-size: 16px;
}

.principle-comparison {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.comparison-bad,
.comparison-good {
    padding: 20px;
    border-radius: 12px;
    border-left: 4px solid;
}

.comparison-bad {
    background: rgba(239, 68, 68, 0.1);
    border-left-color: #EF4444;
}

.comparison-good {
    background: rgba(16, 185, 129, 0.1);
    border-left-color: #10B981;
}

.comparison-label {
    font-weight: 600;
    font-size: 14px;
    margin-bottom: 8px;
}

.comparison-label.bad {
    color: #F87171;
}

.comparison-label.good {
    color: #34D399;
}

.comparison-text {
    color: #D1D5DB;
    font-size: 15px;
    line-height: 1.4;
}

.context-layers {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.context-layer {
    display: flex;
    align-items: center;
    gap: 15px;
    background: rgba(31, 41, 55, 0.4);
    padding: 15px 20px;
    border-radius: 10px;
    border-left: 3px solid #A855F7;
}

.layer-icon {
    font-size: 20px;
    width: 30px;
    text-align: center;
}

.layer-content {
    color: #D1D5DB;
    font-size: 16px;
}

.layer-content strong {
    color: #E5E7EB;
}

.output-features {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 15px;
}

.output-feature {
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(31, 41, 55, 0.4);
    padding: 15px;
    border-radius: 10px;
    border-left: 3px solid #10B981;
}

.output-feature i {
    color: #10B981;
    width: 20px;
}

.output-feature span {
    color: #D1D5DB;
    font-weight: 500;
}

.quality-checkpoints {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    flex-wrap: wrap;
}

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

.checkpoint-step {
    width: 40px;
    height: 40px;
    background: linear-gradient(135deg, #EC4899, #BE185D);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 700;
}

.checkpoint-text {
    color: #D1D5DB;
    font-size: 14px;
    font-weight: 500;
    text-align: center;
}

.checkpoint-arrow {
    color: #A78BFA;
    font-size: 20px;
    font-weight: bold;
}

.scientific-foundation {
    margin-bottom: 60px;
}

.foundation-container {
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.1), rgba(30, 58, 138, 0.05));
    border-radius: 20px;
    padding: 50px 40px;
    border: 2px solid rgba(59, 130, 246, 0.2);
    text-align: center;
}

.foundation-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    margin-bottom: 30px;
}

.foundation-icon {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #3B82F6, #1D4ED8);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 15px 40px rgba(59, 130, 246, 0.3);
}

.foundation-icon i {
    font-size: 32px;
    color: white;
}

.foundation-title {
    font-size: 32px;
    font-weight: 800;
    color: #E5E7EB;
    margin: 0;
}

.foundation-description {
    font-size: 20px;
    color: #D1D5DB;
    margin-bottom: 30px;
    line-height: 1.5;
}

.research-highlight {
    background: linear-gradient(135deg, #3B82F6, #60A5FA);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
}

.research-areas {
    display: flex;
    justify-content: center;
    gap: 40px;
    flex-wrap: wrap;
}

.research-area {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
}

.area-icon {
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, #60A5FA, #3B82F6);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 25px rgba(59, 130, 246, 0.3);
}

.area-icon i {
    font-size: 20px;
    color: white;
}

.area-name {
    color: #E5E7EB;
    font-weight: 600;
    font-size: 16px;
    text-align: center;
}

.results-statement {
    background: linear-gradient(135deg, rgba(168, 85, 247, 0.1), rgba(139, 92, 246, 0.05));
    border-radius: 20px;
    padding: 50px 40px;
    border: 2px solid rgba(168, 85, 247, 0.3);
    text-align: center;
}

.results-title {
    font-size: 36px;
    font-weight: 900;
    color: #E5E7EB;
    margin-bottom: 25px;
}

.results-description {
    font-size: 22px;
    color: #D1D5DB;
    line-height: 1.6;
    max-width: 900px;
    margin: 0 auto;
}

.universal-highlight {
    background: linear-gradient(135deg, #A78BFA, #C084FC);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .why-works-container {
        padding: 60px 30px;
    }
    
    .problem-box,
    .solution-box {
        flex-direction: column;
        text-align: center;
        gap: 20px;
    }
    
    .principle-header {
        flex-direction: column;
        text-align: center;
        gap: 20px;
    }
    
    .principle-comparison {
        grid-template-columns: 1fr;
    }
}
/* Success Formula Section Styles */
.success-formula-section {
    position: relative;
    margin: 0;
    padding: 0;
}

.formula-container {
    position: relative;
    background: #1A0D2F;
    padding: 80px 40px;
    overflow: hidden;
    border-top: 2px solid rgba(251, 191, 36, 0.3);
}

.formula-background {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.formula-grid-pattern {
    position: absolute;
    inset: 0;
    background-image: 
        linear-gradient(rgba(251, 191, 36, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(251, 191, 36, 0.04) 1px, transparent 1px);
    background-size: 40px 40px;
    opacity: 0.6;
}

.formula-glow-effects {
    position: absolute;
    inset: 0;
}

.formula-glow-circle {
    position: absolute;
    border-radius: 50%;
    filter: blur(120px);
    animation: formulaFloat 18s infinite ease-in-out;
}

.formula-glow-1 {
    width: 450px;
    height: 450px;
    background: radial-gradient(circle, rgba(251, 191, 36, 0.06), transparent 70%);
    top: 5%;
    left: -225px;
    animation-delay: 0s;
}

.formula-glow-2 {
    width: 350px;
    height: 350px;
    background: radial-gradient(circle, rgba(16, 185, 129, 0.05), transparent 70%);
    top: 40%;
    right: -175px;
    animation-delay: -6s;
}

.formula-glow-3 {
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(59, 130, 246, 0.05), transparent 70%);
    bottom: 15%;
    left: 60%;
    animation-delay: -12s;
}

@keyframes formulaFloat {
    0%, 100% { transform: translateY(0px) scale(1); opacity: 0.4; }
    50% { transform: translateY(-40px) scale(1.15); opacity: 0.7; }
}

.formula-content {
    position: relative;
    z-index: 2;
    max-width: 1200px;
    margin: 0 auto;
}

.formula-header {
    text-align: center;
    margin-bottom: 80px;
}

.formula-main-title {
    font-size: clamp(40px, 7vw, 64px);
    font-weight: 900;
    color: #E5E7EB;
    line-height: 1.1;
    margin-bottom: 30px;
    text-shadow: 0 6px 12px rgba(0, 0, 0, 0.6);
}

.formula-brand-highlight {
    background: linear-gradient(135deg, #A78BFA, #60A5FA);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.formula-success-highlight {
    background: linear-gradient(135deg, #FBBF24, #F59E0B);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: successShimmer 3s infinite;
}

@keyframes successShimmer {
    0%, 100% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
}

.formula-intro {
    font-size: 24px;
    color: #D1D5DB;
    max-width: 900px;
    margin: 0 auto;
    line-height: 1.6;
}

.process-highlight {
    background: linear-gradient(135deg, #FBBF24, #F59E0B);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
}

.process-steps {
    display: flex;
    flex-direction: column;
    gap: 60px;
    margin-bottom: 100px;
}

.step-item {
    display: flex;
    align-items: flex-start;
    gap: 40px;
    position: relative;
}

.step-visual {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
}

.step-number {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 32px;
    font-weight: 900;
    color: white;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.4);
    position: relative;
    z-index: 2;
}

.step-1 .step-number {
    background: linear-gradient(135deg, #3B82F6, #1D4ED8);
}

.step-2 .step-number {
    background: linear-gradient(135deg, #10B981, #059669);
}

.step-3 .step-number {
    background: linear-gradient(135deg, #FBBF24, #F59E0B);
}

.step-4 .step-number {
    background: linear-gradient(135deg, #8B5CF6, #7C3AED);
}

.step-connector {
    width: 4px;
    height: 120px;
    background: linear-gradient(to bottom, rgba(168, 85, 247, 0.5), rgba(168, 85, 247, 0.2));
    margin-top: 20px;
    border-radius: 2px;
}

.step-4 .step-connector {
    display: none;
}

.step-content {
    flex: 1;
    background: linear-gradient(135deg, rgba(17, 24, 39, 0.8), rgba(31, 41, 55, 0.6));
    border-radius: 20px;
    padding: 40px;
    border: 1px solid rgba(168, 85, 247, 0.2);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(10px);
    transition: all 0.3s ease;
}

.step-content:hover {
    transform: translateY(-5px);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.4);
    border-color: rgba(168, 85, 247, 0.4);
}

.step-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
    flex-wrap: wrap;
    gap: 15px;
}

.step-title {
    font-size: 28px;
    font-weight: 800;
    color: #E5E7EB;
    margin: 0;
}

.step-time {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    border-radius: 20px;
    font-weight: 600;
    font-size: 14px;
    background: rgba(31, 41, 55, 0.6);
    color: #D1D5DB;
    border: 1px solid rgba(168, 85, 247, 0.3);
}

.step-time.instant {
    background: linear-gradient(135deg, rgba(251, 191, 36, 0.2), rgba(245, 158, 11, 0.1));
    border-color: rgba(251, 191, 36, 0.4);
    color: #FBBF24;
}

.step-time.instant i {
    color: #F59E0B;
}

.step-description {
    font-size: 18px;
    color: #D1D5DB;
    line-height: 1.6;
    margin-bottom: 25px;
}

.emphasis-text {
    color: #A78BFA;
    font-weight: 600;
    font-style: italic;
}

.tool-count {
    background: linear-gradient(135deg, #10B981, #34D399);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
}

.professional-highlight {
    background: linear-gradient(135deg, #FBBF24, #F59E0B);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
}

.step-example {
    background: rgba(59, 130, 246, 0.1);
    border-radius: 12px;
    padding: 20px;
    border-left: 4px solid #3B82F6;
}

.example-label {
    color: #60A5FA;
    font-weight: 600;
    font-size: 14px;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.example-text {
    color: #E5E7EB;
    font-style: italic;
    font-size: 16px;
    line-height: 1.4;
}

.tool-suggestions {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

.suggestion-item {
    padding: 12px 20px;
    border-radius: 25px;
    background: rgba(31, 41, 55, 0.6);
    color: #D1D5DB;
    font-weight: 500;
    border: 1px solid rgba(16, 185, 129, 0.3);
    display: flex;
    align-items: center;
    gap: 8px;
}

.suggestion-item.recommended {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.2), rgba(5, 150, 105, 0.1));
    border-color: rgba(16, 185, 129, 0.5);
    color: #34D399;
}

.suggestion-item.recommended i {
    color: #FBBF24;
}

.generation-process {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    flex-wrap: wrap;
}

.process-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 18px;
    background: rgba(31, 41, 55, 0.6);
    border-radius: 10px;
    border: 1px solid rgba(251, 191, 36, 0.3);
    color: #D1D5DB;
    font-weight: 500;
}

.process-item i {
    color: #FBBF24;
}

.process-arrow {
    color: #A78BFA;
    font-size: 18px;
    font-weight: bold;
}

.refinement-options {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

.refinement-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 18px;
    background: rgba(31, 41, 55, 0.6);
    border-radius: 10px;
    border: 1px solid rgba(139, 92, 246, 0.3);
    color: #D1D5DB;
    font-weight: 500;
}

.refinement-item i {
    color: #A78BFA;
}

.time-investment {
    margin-bottom: 80px;
}

.investment-container {
    background: linear-gradient(135deg, rgba(251, 191, 36, 0.1), rgba(245, 158, 11, 0.05));
    border-radius: 25px;
    padding: 60px 40px;
    border: 3px solid rgba(251, 191, 36, 0.3);
    text-align: center;
    box-shadow: 0 30px 80px rgba(251, 191, 36, 0.1);
}

.investment-title {
    font-size: 32px;
    font-weight: 800;
    color: #E5E7EB;
    margin-bottom: 40px;
}

.investment-display {
    margin-bottom: 40px;
}

.time-amount {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 15px;
    margin-bottom: 15px;
}

.time-number {
    font-size: clamp(60px, 12vw, 120px);
    font-weight: 900;
    background: linear-gradient(135deg, #FBBF24, #F59E0B);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    line-height: 1;
}

.time-unit {
    font-size: clamp(32px, 6vw, 48px);
    font-weight: 700;
    color: #E5E7EB;
}

.time-description {
    font-size: 20px;
    color: #D1D5DB;
    font-weight: 500;
}

.investment-breakdown {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    flex-wrap: wrap;
}

.breakdown-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    background: rgba(31, 41, 55, 0.4);
    padding: 15px 20px;
    border-radius: 12px;
    border: 1px solid rgba(251, 191, 36, 0.3);
}

.breakdown-step {
    color: #FBBF24;
    font-weight: 600;
    font-size: 14px;
}

.breakdown-time {
    color: #E5E7EB;
    font-weight: 500;
}

.breakdown-plus {
    color: #A78BFA;
    font-size: 20px;
    font-weight: bold;
}

.comparison-statement {
    margin-bottom: 80px;
}

.comparison-container {
    background: rgba(17, 24, 39, 0.6);
    border-radius: 20px;
    padding: 50px 40px;
    border: 1px solid rgba(168, 85, 247, 0.2);
}

.comparison-title {
    font-size: 32px;
    font-weight: 800;
    color: #E5E7EB;
    text-align: center;
    margin-bottom: 40px;
}

.comparison-grid {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 40px;
    flex-wrap: wrap;
}

.comparison-old,
.comparison-new {
    background: rgba(31, 41, 55, 0.6);
    border-radius: 15px;
    padding: 30px;
    text-align: center;
    min-width: 200px;
    transition: all 0.3s ease;
}

.comparison-old {
    border: 2px solid rgba(239, 68, 68, 0.4);
}

.comparison-new {
    border: 2px solid rgba(16, 185, 129, 0.4);
}

.comparison-old:hover,
.comparison-new:hover {
    transform: translateY(-5px);
}

.comparison-header {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 20px;
    font-weight: 700;
    font-size: 18px;
}

.comparison-header.old {
    color: #F87171;
}

.comparison-header.new {
    color: #34D399;
}

.comparison-details {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.comparison-time,
.comparison-result,
.comparison-feeling {
    color: #D1D5DB;
    font-weight: 500;
}

.comparison-vs {
    font-size: 28px;
    font-weight: 900;
    color: #A78BFA;
    background: rgba(168, 85, 247, 0.1);
    padding: 20px 25px;
    border-radius: 15px;
    border: 2px solid rgba(168, 85, 247, 0.3);
}

.magic-statement {
    background: linear-gradient(135deg, rgba(168, 85, 247, 0.1), rgba(139, 92, 246, 0.05));
    border-radius: 25px;
    padding: 50px 40px;
    border: 2px solid rgba(168, 85, 247, 0.3);
}

.magic-container {
    display: flex;
    align-items: center;
    gap: 30px;
    max-width: 1000px;
    margin: 0 auto;
}

.magic-icon {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #A78BFA, #8B5CF6);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 15px 40px rgba(168, 85, 247, 0.4);
    animation: magicGlow 3s infinite ease-in-out;
}

@keyframes magicGlow {
    0%, 100% { box-shadow: 0 15px 40px rgba(168, 85, 247, 0.4); }
    50% { box-shadow: 0 20px 60px rgba(168, 85, 247, 0.8); }
}

.magic-icon i {
    font-size: 32px;
    color: white;
}

.magic-text {
    font-size: 22px;
    color: #D1D5DB;
    line-height: 1.6;
    margin: 0;
}

.magic-highlight {
    background: linear-gradient(135deg, #A78BFA, #C084FC);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 800;
    font-size: 1.1em;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .formula-container {
        padding: 60px 30px;
    }
    
    .step-item {
        flex-direction: column;
        text-align: center;
        gap: 25px;
    }
    
    .step-visual {
        flex-direction: row;
        gap: 20px;
        width: 100%;
        justify-content: center;
    }
    
    .step-connector {
        width: 80px;
        height: 4px;
        margin-top: 0;
    }
    
    .step-4 .step-visual {
        justify-content: center;
    }
    
    .magic-container {
        flex-direction: column;
        text-align: center;
        gap: 25px;
    }
}
/* Urgency Section Styles */
.urgency-section {
    position: relative;
    margin: 0;
    padding: 0;
}

.urgency-container {
    position: relative;
    background: #1A0D2F;
    padding: 80px 40px;
    overflow: hidden;
    border-top: 2px solid rgba(239, 68, 68, 0.4);
}

.urgency-background {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.urgency-grid-pattern {
    position: absolute;
    inset: 0;
    background-image: 
        linear-gradient(rgba(239, 68, 68, 0.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(239, 68, 68, 0.06) 1px, transparent 1px);
    background-size: 30px 30px;
    opacity: 0.7;
}

.urgency-glow-effects {
    position: absolute;
    inset: 0;
}

.urgency-glow-circle {
    position: absolute;
    border-radius: 50%;
    filter: blur(140px);
    animation: urgencyFloat 12s infinite ease-in-out;
}

.urgency-glow-1 {
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(239, 68, 68, 0.08), transparent 70%);
    top: 0%;
    left: -250px;
    animation-delay: 0s;
}

.urgency-glow-2 {
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(245, 101, 101, 0.06), transparent 70%);
    top: 40%;
    right: -200px;
    animation-delay: -4s;
}

.urgency-glow-3 {
    width: 350px;
    height: 350px;
    background: radial-gradient(circle, rgba(220, 38, 127, 0.06), transparent 70%);
    bottom: 10%;
    left: 50%;
    animation-delay: -8s;
}

@keyframes urgencyFloat {
    0%, 100% { transform: translateY(0px) scale(1); opacity: 0.3; }
    50% { transform: translateY(-50px) scale(1.2); opacity: 0.6; }
}

.urgency-content {
    position: relative;
    z-index: 2;
    max-width: 1200px;
    margin: 0 auto;
}

.urgency-header {
    text-align: center;
    margin-bottom: 60px;
}

.urgency-main-title {
    font-size: clamp(42px, 8vw, 72px);
    font-weight: 900;
    line-height: 1.1;
    text-shadow: 0 6px 12px rgba(0, 0, 0, 0.6);
}

.urgency-why {
    color: #E5E7EB;
    display: block;
}

.urgency-act-now {
    background: linear-gradient(135deg, #EF4444, #DC2626);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    display: block;
    animation: urgentPulse 2s infinite ease-in-out;
}

@keyframes urgentPulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
}

.opening-statement {
    margin-bottom: 80px;
}

.statement-container {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.1), rgba(220, 38, 127, 0.05));
    border-radius: 20px;
    padding: 40px;
    border: 2px solid rgba(239, 68, 68, 0.3);
    text-align: center;
    box-shadow: 0 20px 60px rgba(239, 68, 68, 0.1);
}

.statement-text {
    font-size: 24px;
    color: #E5E7EB;
    line-height: 1.6;
    margin: 0;
    font-weight: 500;
}

.foundation-highlight {
    background: linear-gradient(135deg, #FBBF24, #F59E0B);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
    font-size: 1.1em;
}

.ai-landscape {
    margin-bottom: 100px;
}

.landscape-title {
    font-size: 32px;
    font-weight: 800;
    color: #E5E7EB;
    text-align: center;
    margin-bottom: 60px;
}

.landscape-points {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.landscape-item {
    display: flex;
    align-items: flex-start;
    gap: 30px;
    background: linear-gradient(135deg, rgba(17, 24, 39, 0.8), rgba(31, 41, 55, 0.6));
    border-radius: 20px;
    padding: 40px;
    border: 1px solid;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    transition: all 0.3s ease;
}

.multiplying {
    border-color: rgba(59, 130, 246, 0.3);
}

.gap-widening {
    border-color: rgba(239, 68, 68, 0.3);
}

.business-adoption {
    border-color: rgba(16, 185, 129, 0.3);
}

.learning-curve {
    border-color: rgba(168, 85, 247, 0.3);
}

.landscape-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.4);
}

.landscape-icon {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.multiplying .landscape-icon {
    background: linear-gradient(135deg, #3B82F6, #1D4ED8);
}

.gap-widening .landscape-icon {
    background: linear-gradient(135deg, #EF4444, #DC2626);
}

.business-adoption .landscape-icon {
    background: linear-gradient(135deg, #10B981, #059669);
}

.learning-curve .landscape-icon {
    background: linear-gradient(135deg, #A855F7, #7C3AED);
}

.landscape-icon i {
    font-size: 28px;
    color: white;
}

.landscape-content {
    flex: 1;
}

.landscape-point-title {
    font-size: 24px;
    font-weight: 800;
    color: #E5E7EB;
    margin-bottom: 15px;
}

.landscape-description {
    font-size: 18px;
    color: #D1D5DB;
    line-height: 1.6;
    margin-bottom: 20px;
}

.trend-indicator {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 16px;
    border-radius: 20px;
    font-weight: 600;
    font-size: 14px;
}

.trend-indicator.increasing {
    background: rgba(59, 130, 246, 0.1);
    color: #60A5FA;
    border: 1px solid rgba(59, 130, 246, 0.3);
}

.gap-visual {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
}

.gap-side {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 15px 20px;
    border-radius: 10px;
    font-weight: 600;
    font-size: 14px;
}

.gap-side.advanced {
    background: rgba(16, 185, 129, 0.1);
    color: #34D399;
    border: 1px solid rgba(16, 185, 129, 0.3);
}

.gap-side.basic {
    background: rgba(239, 68, 68, 0.1);
    color: #F87171;
    border: 1px solid rgba(239, 68, 68, 0.3);
}

.gap-arrow {
    font-size: 20px;
    font-weight: bold;
}

.gap-arrow.up {
    color: #34D399;
}

.gap-arrow.down {
    color: #F87171;
}

.gap-vs {
    color: #A78BFA;
    font-weight: 700;
    font-size: 16px;
}

.requirement-badge {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: rgba(16, 185, 129, 0.1);
    color: #34D399;
    border-radius: 20px;
    font-weight: 600;
    font-size: 14px;
    border: 1px solid rgba(16, 185, 129, 0.3);
    width: fit-content;
}

.complexity-meter {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.complexity-bar {
    width: 200px;
    height: 8px;
    background: rgba(31, 41, 55, 0.6);
    border-radius: 4px;
    overflow: hidden;
}

.complexity-fill {
    width: 85%;
    height: 100%;
    background: linear-gradient(90deg, #A855F7, #EC4899);
    border-radius: 4px;
    animation: complexityGrow 3s ease-out infinite;
}

@keyframes complexityGrow {
    0% { width: 30%; }
    100% { width: 85%; }
}

.complexity-label {
    color: #A78BFA;
    font-size: 12px;
    font-weight: 500;
}

.early-adopter-section {
    margin-bottom: 100px;
}

.adopter-container {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.1), rgba(5, 150, 105, 0.05));
    border-radius: 25px;
    padding: 60px 40px;
    border: 2px solid rgba(16, 185, 129, 0.3);
    text-align: center;
}

.adopter-title {
    font-size: clamp(28px, 5vw, 42px);
    font-weight: 800;
    color: #E5E7EB;
    line-height: 1.3;
    margin-bottom: 50px;
}

.advantage-highlight {
    background: linear-gradient(135deg, #10B981, #34D399);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 900;
}

.advantages-subtitle {
    font-size: 24px;
    color: #E5E7EB;
    font-weight: 700;
    margin-bottom: 40px;
}

.advantage-items {
    display: flex;
    flex-direction: column;
    gap: 25px;
    max-width: 800px;
    margin: 0 auto;
}

.advantage-item {
    display: flex;
    align-items: center;
    gap: 20px;
    background: rgba(31, 41, 55, 0.4);
    padding: 20px 30px;
    border-radius: 15px;
    border-left: 4px solid #10B981;
    text-align: left;
    transition: all 0.3s ease;
}

.advantage-item:hover {
    transform: translateX(10px);
    background: rgba(31, 41, 55, 0.6);
}

.advantage-icon {
    width: 50px;
    height: 50px;
    background: linear-gradient(135deg, #10B981, #059669);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.advantage-icon i {
    font-size: 20px;
    color: white;
}

.advantage-text {
    font-size: 18px;
    color: #E5E7EB;
    font-weight: 500;
    line-height: 1.4;
}

.window-warning {
    margin-bottom: 80px;
}

.warning-container {
    background: linear-gradient(135deg, rgba(245, 101, 101, 0.1), rgba(239, 68, 68, 0.05));
    border-radius: 20px;
    padding: 50px 40px;
    border: 2px solid rgba(239, 68, 68, 0.3);
    text-align: center;
}

.warning-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 25px;
    margin-bottom: 40px;
}

.warning-icon {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #F59E0B, #D97706);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 15px 40px rgba(245, 158, 11, 0.4);
    animation: warningPulse 2s infinite ease-in-out;
}

@keyframes warningPulse {
    0%, 100% { box-shadow: 0 15px 40px rgba(245, 158, 11, 0.4); }
    50% { box-shadow: 0 20px 60px rgba(245, 158, 11, 0.7); }
}

.warning-icon i {
    font-size: 32px;
    color: white;
}

.warning-title {
    font-size: clamp(24px, 4vw, 36px);
    font-weight: 800;
    color: #E5E7EB;
    line-height: 1.3;
}

.warning-description {
    font-size: 20px;
    color: #D1D5DB;
    line-height: 1.6;
    margin-bottom: 40px;
}

.timeline-visual {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 60px;
    flex-wrap: wrap;
}

.timeline-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
    position: relative;
}

.timeline-dot {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: rgba(107, 114, 128, 0.5);
    border: 3px solid rgba(107, 114, 128, 0.3);
}

.timeline-dot.current {
    background: linear-gradient(135deg, #F59E0B, #D97706);
    border-color: #FBBF24;
    box-shadow: 0 0 20px rgba(245, 158, 11, 0.5);
    animation: currentPulse 2s infinite;
}

@keyframes currentPulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.2); }
}

.timeline-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    text-align: center;
}

.timeline-label {
    font-weight: 700;
    font-size: 16px;
    color: #E5E7EB;
}

.present .timeline-label {
    color: #FBBF24;
}

.timeline-description {
    font-size: 14px;
    color: #9CA3AF;
}

.present .timeline-description {
    color: #F59E0B;
}

.final-cta {
    text-align: center;
}

.opportunity-statement {
    margin-bottom: 40px;
}

.opportunity-title {
    font-size: clamp(28px, 5vw, 44px);
    font-weight: 800;
    color: #E5E7EB;
    line-height: 1.3;
}

.percentage-highlight {
    background: linear-gradient(135deg, #FBBF24, #F59E0B);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 900;
    font-size: 1.1em;
}

.urgency-climax {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.2), rgba(220, 38, 127, 0.1));
    border-radius: 20px;
    padding: 40px;
    border: 3px solid rgba(239, 68, 68, 0.4);
    margin-bottom: 40px;
    box-shadow: 0 20px 60px rgba(239, 68, 68, 0.2);
}

.climax-text {
    font-size: clamp(32px, 6vw, 52px);
    font-weight: 900;
    color: #E5E7EB;
    margin: 0;
}

.act-today-highlight {
    background: linear-gradient(135deg, #EF4444, #DC2626);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: urgentFlash 1.5s infinite ease-in-out;
}

@keyframes urgentFlash {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

.action-arrows {
    margin-top: 40px;
}

.arrow-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.action-arrow {
    font-size: 48px;
    color: #EF4444;
    font-weight: 900;
    animation: arrowBounce 2s infinite ease-in-out;
}

.action-arrow:nth-child(1) {
    animation-delay: 0s;
}

.action-arrow:nth-child(2) {
    animation-delay: 0.3s;
}

.action-arrow:nth-child(3) {
    animation-delay: 0.6s;
}

@keyframes arrowBounce {
    0%, 100% { transform: translateY(0px); opacity: 0.7; }
    50% { transform: translateY(10px); opacity: 1; }
}

/* Responsive Design */
@media (max-width: 1024px) {
    .urgency-container {
        padding: 60px 30px;
    }
    
    .landscape-item {
        flex-direction: column;
        text-align: center;
        gap: 25px;
    }
    
    .gap-visual {
        justify-content: center;
    }
    
    .timeline-visual {
        gap: 30px;
    }
}

@media (max-width: 768px) {
    .urgency-container {
        padding: 50px 20px;
    }
    
    .landscape-points {
        gap: 30px;
    }
    
    .landscape-item {
        padding: 30px 20px;
    }
    
    .adopter-container,
    .warning-container {
        padding: 40px 20px;
    }
}
/* Simple Introduction Section Styles */
.intro-section {
    position: relative;
    margin: 0;
    padding: 0;
}

.intro-container {
    position: relative;
    background: #1A0D2F;
    padding: 80px 40px;
    overflow: hidden;
    border-top: 2px solid rgba(168, 85, 247, 0.4);
}

.intro-background {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.intro-grid-pattern {
    position: absolute;
    inset: 0;
    background-image: 
        linear-gradient(rgba(168, 85, 247, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(168, 85, 247, 0.05) 1px, transparent 1px);
    background-size: 50px 50px;
    opacity: 0.4;
}

.intro-glow-effects {
    position: absolute;
    inset: 0;
}

.intro-glow-circle {
    position: absolute;
    border-radius: 50%;
    filter: blur(100px);
    animation: introFloat 8s infinite ease-in-out;
}

.intro-glow-1 {
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(168, 85, 247, 0.1), transparent 70%);
    top: 20%;
    left: -150px;
    animation-delay: 0s;
}

.intro-glow-2 {
    width: 250px;
    height: 250px;
    background: radial-gradient(circle, rgba(59, 130, 246, 0.08), transparent 70%);
    top: 30%;
    right: -125px;
    animation-delay: -4s;
}

@keyframes introFloat {
    0%, 100% { transform: translateY(0px) scale(1); }
    50% { transform: translateY(-20px) scale(1.1); }
}

.intro-content {
    position: relative;
    z-index: 2;
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
}

.intro-header {
    margin-bottom: 60px;
}

.intro-title {
    font-size: clamp(36px, 6vw, 56px);
    font-weight: 900;
    color: #E5E7EB;
    line-height: 1.2;
    margin-bottom: 20px;
    text-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
}

.intro-brand-highlight {
    background: linear-gradient(135deg, #A78BFA, #60A5FA);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.intro-subtitle {
    font-size: 20px;
    color: #D1D5DB;
    margin: 0;
    font-weight: 500;
}

.product-showcase {
    margin-bottom: 60px;
}

.software-box {
    max-width: 350px;
    margin: 0 auto;
}

.software-image {
    width: 350px;
    height: 450px;
    object-fit: contain;
    border-radius: 20px;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.4);
}

.software-placeholder {
    width: 350px;
    height: 450px;
    background: linear-gradient(135deg, rgba(17, 24, 39, 0.9), rgba(31, 41, 55, 0.8));
    border: 2px solid rgba(168, 85, 247, 0.4);
    border-radius: 20px;
    padding: 40px 30px;
    box-shadow: 0 30px 80px rgba(168, 85, 247, 0.2);
    backdrop-filter: blur(10px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
}

.placeholder-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.software-icon {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #A78BFA, #8B5CF6);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 15px 40px rgba(168, 85, 247, 0.4);
}

.software-icon i {
    font-size: 36px;
    color: white;
}

.software-title {
    font-size: 32px;
    font-weight: 900;
    background: linear-gradient(135deg, #A78BFA, #60A5FA);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin: 0;
}

.software-description {
    font-size: 18px;
    color: #D1D5DB;
    margin: 0;
    font-weight: 500;
}

.software-features {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: center;
}

.feature-tag {
    background: rgba(168, 85, 247, 0.2);
    color: #C084FC;
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 600;
    border: 1px solid rgba(168, 85, 247, 0.3);
}

.buy-now-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 30px;
}

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

.original-price {
    color: #9CA3AF;
    font-size: 16px;
    text-decoration: line-through;
}

.current-price {
    color: #FBBF24;
    font-size: 24px;
    font-weight: 800;
}

.buy-now-button {
    background: linear-gradient(135deg, #10B981, #059669);
    color: white;
    border: none;
    padding: 25px 60px;
    border-radius: 50px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 20px 60px rgba(16, 185, 129, 0.4);
    border: 3px solid #34D399;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    text-align: center;
    min-width: 300px;
    animation: buyButtonPulse 3s infinite ease-in-out;
}

@keyframes buyButtonPulse {
    0%, 100% { 
        transform: scale(1); 
        box-shadow: 0 20px 60px rgba(16, 185, 129, 0.4); 
    }
    50% { 
        transform: scale(1.02); 
        box-shadow: 0 25px 80px rgba(16, 185, 129, 0.6); 
    }
}

.buy-now-button:hover {
    transform: translateY(-3px) scale(1.05);
    box-shadow: 0 30px 100px rgba(16, 185, 129, 0.8);
    background: linear-gradient(135deg, #059669, #047857);
}

.button-icon {
    display: flex;
    align-items: center;
    gap: 12px;
}

.button-icon i {
    font-size: 20px;
}

.button-text {
    font-size: 20px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.button-subtext {
    font-size: 14px;
    font-weight: 500;
    opacity: 0.9;
}

.security-badges {
    display: flex;
    gap: 30px;
    flex-wrap: wrap;
    justify-content: center;
}

.security-item {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #9CA3AF;
    font-size: 14px;
    font-weight: 500;
}

.security-item i {
    color: #10B981;
    font-size: 16px;
}

/* Responsive Design */
@media (max-width: 768px) {
    .intro-container {
        padding: 50px 20px;
    }
    
    .software-placeholder {
        padding: 40px 20px;
    }
    
    .buy-now-button {
        padding: 20px 40px;
        min-width: 280px;
    }
    
    .button-text {
        font-size: 18px;
    }
    
    .security-badges {
        flex-direction: column;
        align-items: center;
        gap: 15px;
    }
}

@media (max-width: 480px) {
    .software-features {
        flex-direction: column;
        align-items: center;
    }
    
    .price-display {
        gap: 5px;
    }
    
    .current-price {
        font-size: 20px;
    }
    
    .buy-now-button {
        min-width: 250px;
        padding: 18px 30px;
    }
}
/* Two Paths Section Styles */
.two-paths-section {
    position: relative;
    margin: 0;
    padding: 0;
}

.paths-container {
    position: relative;
    background: #1A0D2F;
    padding: 80px 40px;
    overflow: hidden;
    border-top: 2px solid rgba(251, 191, 36, 0.4);
}

.paths-background {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.paths-grid-pattern {
    position: absolute;
    inset: 0;
    background-image: 
        linear-gradient(rgba(251, 191, 36, 0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(251, 191, 36, 0.03) 1px, transparent 1px);
    background-size: 60px 60px;
    opacity: 0.6;
}

.paths-glow-effects {
    position: absolute;
    inset: 0;
}

.paths-glow-circle {
    position: absolute;
    border-radius: 50%;
    filter: blur(120px);
    animation: pathsFloat 10s infinite ease-in-out;
}

.paths-glow-1 {
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(239, 68, 68, 0.06), transparent 70%);
    top: 20%;
    left: -200px;
    animation-delay: 0s;
}

.paths-glow-2 {
    width: 350px;
    height: 350px;
    background: radial-gradient(circle, rgba(16, 185, 129, 0.06), transparent 70%);
    top: 30%;
    right: -175px;
    animation-delay: -5s;
}

@keyframes pathsFloat {
    0%, 100% { transform: translateY(0px) scale(1); }
    50% { transform: translateY(-30px) scale(1.1); }
}

.paths-content {
    position: relative;
    z-index: 2;
    max-width: 1200px;
    margin: 0 auto;
}

.paths-header {
    text-align: center;
    margin-bottom: 80px;
}

.paths-main-title {
    font-size: clamp(40px, 7vw, 64px);
    font-weight: 900;
    color: #E5E7EB;
    line-height: 1.1;
    text-shadow: 0 6px 12px rgba(0, 0, 0, 0.6);
}

.paths-highlight {
    background: linear-gradient(135deg, #FBBF24, #F59E0B);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.paths-comparison {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 40px;
    align-items: start;
    margin-bottom: 80px;
}

.path-card {
    border-radius: 20px;
    padding: 40px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(10px);
    transition: all 0.3s ease;
}

.path-struggle {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.1), rgba(220, 38, 127, 0.05));
    border: 2px solid rgba(239, 68, 68, 0.3);
}

.path-master {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.1), rgba(5, 150, 105, 0.05));
    border: 2px solid rgba(16, 185, 129, 0.3);
}

.path-card:hover {
    transform: translateY(-5px);
}

.path-struggle:hover {
    box-shadow: 0 30px 80px rgba(239, 68, 68, 0.2);
}

.path-master:hover {
    box-shadow: 0 30px 80px rgba(16, 185, 129, 0.2);
}

.path-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-bottom: 30px;
    gap: 20px;
}

.path-icon {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.3);
}

.struggle-icon {
    background: linear-gradient(135deg, #EF4444, #DC2626);
}

.master-icon {
    background: linear-gradient(135deg, #10B981, #059669);
}

.path-icon i {
    font-size: 32px;
    color: white;
}

.path-title {
    font-size: 28px;
    font-weight: 800;
    color: #E5E7EB;
    margin: 0;
    line-height: 1.3;
}

.path-points {
    display: flex;
    flex-direction: column;
    gap: 25px;
    margin-bottom: 30px;
}

.path-point {
    display: flex;
    align-items: flex-start;
    gap: 15px;
}

.point-icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-top: 2px;
}

.point-icon.negative {
    background: linear-gradient(135deg, #F87171, #EF4444);
}

.point-icon.positive {
    background: linear-gradient(135deg, #34D399, #10B981);
}

.point-icon i {
    font-size: 16px;
    color: white;
}

.point-text {
    color: #D1D5DB;
    font-size: 16px;
    line-height: 1.5;
    margin: 0;
    font-weight: 500;
}

.path-outcome {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 20px;
    border-radius: 15px;
    font-weight: 700;
    font-size: 16px;
    text-align: center;
}

.struggle-outcome {
    background: rgba(239, 68, 68, 0.1);
    color: #F87171;
    border: 1px solid rgba(239, 68, 68, 0.3);
}

.master-outcome {
    background: rgba(16, 185, 129, 0.1);
    color: #34D399;
    border: 1px solid rgba(16, 185, 129, 0.3);
}

.path-outcome i {
    font-size: 20px;
}

.paths-divider {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 20px;
    padding: 40px 0;
}

.divider-line {
    width: 2px;
    height: 60px;
    background: linear-gradient(to bottom, transparent, rgba(168, 85, 247, 0.5), transparent);
}

.divider-text {
    background: linear-gradient(135deg, #A78BFA, #8B5CF6);
    color: white;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: 900;
    box-shadow: 0 10px 30px rgba(168, 85, 247, 0.4);
}

.choice-statement {
    text-align: center;
    margin-bottom: 80px;
}

.choice-container {
    background: rgba(17, 24, 39, 0.6);
    border-radius: 20px;
    padding: 40px;
    border: 1px solid rgba(168, 85, 247, 0.2);
    max-width: 800px;
    margin: 0 auto;
}

.choice-title {
    font-size: 36px;
    font-weight: 800;
    color: #E5E7EB;
    margin-bottom: 20px;
}

.choice-warning {
    font-size: 20px;
    color: #F59E0B;
    font-weight: 600;
    margin: 0;
    line-height: 1.5;
}

.final-options {
    margin-bottom: 60px;
}

.options-title {
    font-size: 32px;
    font-weight: 800;
    color: #E5E7EB;
    text-align: center;
    margin-bottom: 50px;
}

.options-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 40px;
    max-width: 900px;
    margin: 0 auto;
}

.option-card {
    position: relative;
    border-radius: 20px;
    padding: 40px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(10px);
    transition: all 0.3s ease;
}

.option-wait {
    background: linear-gradient(135deg, rgba(107, 114, 128, 0.1), rgba(75, 85, 99, 0.05));
    border: 2px solid rgba(107, 114, 128, 0.3);
}

.option-act {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.15), rgba(5, 150, 105, 0.08));
    border: 2px solid rgba(16, 185, 129, 0.4);
    box-shadow: 0 20px 60px rgba(16, 185, 129, 0.1);
}

.option-card:hover {
    transform: translateY(-5px);
}

.option-badge {
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    background: linear-gradient(135deg, #10B981, #059669);
    color: white;
    padding: 8px 20px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.option-number {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    font-weight: 900;
    color: white;
    margin: 0 auto 25px;
}

.option-wait .option-number {
    background: linear-gradient(135deg, #6B7280, #4B5563);
}

.option-act .option-number {
    background: linear-gradient(135deg, #10B981, #059669);
}

.option-content {
    text-align: center;
}

.option-title {
    font-size: 24px;
    font-weight: 800;
    color: #E5E7EB;
    margin-bottom: 15px;
    line-height: 1.3;
}

.option-description {
    font-size: 16px;
    color: #9CA3AF;
    margin-bottom: 20px;
    font-style: italic;
}

.option-risk,
.option-benefit {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px;
    border-radius: 10px;
    font-weight: 600;
    font-size: 14px;
    margin-bottom: 25px;
}

.option-risk {
    background: rgba(239, 68, 68, 0.1);
    color: #F87171;
    border: 1px solid rgba(239, 68, 68, 0.3);
}

.option-benefit {
    background: rgba(16, 185, 129, 0.1);
    color: #34D399;
    border: 1px solid rgba(16, 185, 129, 0.3);
}

.option-price {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    margin-bottom: 15px;
}

.future-price,
.current-price {
    font-size: 32px;
    font-weight: 900;
}

.future-price {
    color: #F87171;
}

.current-price {
    color: #34D399;
}

.price-label {
    font-size: 14px;
    color: #9CA3AF;
    font-weight: 500;
}

.coffee-comparison {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #A78BFA;
    font-size: 14px;
    font-weight: 500;
}

.coffee-comparison i {
    color: #FBBF24;
}

.action-arrow-section {
    text-align: center;
}

.arrow-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
}

.action-arrow {
    font-size: 48px;
    color: #FBBF24;
    font-weight: 900;
    animation: arrowBounce 2s infinite ease-in-out;
}

.arrow-text {
    color: #D1D5DB;
    font-size: 18px;
    font-weight: 600;
}

@keyframes arrowBounce {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(10px); }
}

/* Responsive Design */
@media (max-width: 1024px) {
    .paths-container {
        padding: 60px 30px;
    }
    
    .paths-comparison {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .paths-divider {
        order: 2;
        flex-direction: row;
        padding: 20px 0;
    }
    
    .divider-line {
        width: 60px;
        height: 2px;
    }
    
    .path-struggle {
        order: 1;
    }
    
    .path-master {
        order: 3;
    }
}

@media (max-width: 768px) {
    .paths-container {
        padding: 50px 20px;
    }
    
    .path-card {
        padding: 30px 20px;
    }
    
    .options-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .choice-container {
        padding: 30px 20px;
    }
}

@media (max-width: 480px) {
    .path-header {
        gap: 15px;
    }
    
    .path-icon {
        width: 60px;
        height: 60px;
    }
    
    .path-icon i {
        font-size: 24px;
    }
    
    .option-card {
        padding: 30px 20px;
    }
}
/* Success Community Section Styles */
.success-community-section {
    position: relative;
    margin: 0;
    padding: 0;
}

.community-container {
    position: relative;
    background: #1A0D2F;
    padding: 80px 40px;
    overflow: hidden;
    border-top: 2px solid rgba(16, 185, 129, 0.4);
}

.community-background {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.community-grid-pattern {
    position: absolute;
    inset: 0;
    background-image: 
        linear-gradient(rgba(16, 185, 129, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(16, 185, 129, 0.04) 1px, transparent 1px);
    background-size: 50px 50px;
    opacity: 0.5;
}

.community-glow-effects {
    position: absolute;
    inset: 0;
}

.community-glow-circle {
    position: absolute;
    border-radius: 50%;
    filter: blur(120px);
    animation: communityFloat 12s infinite ease-in-out;
}

.community-glow-1 {
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(16, 185, 129, 0.08), transparent 70%);
    top: 15%;
    left: -200px;
    animation-delay: 0s;
}

.community-glow-2 {
    width: 350px;
    height: 350px;
    background: radial-gradient(circle, rgba(59, 130, 246, 0.06), transparent 70%);
    top: 40%;
    right: -175px;
    animation-delay: -6s;
}

@keyframes communityFloat {
    0%, 100% { transform: translateY(0px) scale(1); }
    50% { transform: translateY(-35px) scale(1.1); }
}

.community-content {
    position: relative;
    z-index: 2;
    max-width: 1000px;
    margin: 0 auto;
}

.community-header {
    text-align: center;
    margin-bottom: 60px;
}

.community-title {
    font-size: clamp(36px, 6vw, 56px);
    font-weight: 900;
    color: #E5E7EB;
    line-height: 1.2;
    text-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
}

.success-highlight {
    background: linear-gradient(135deg, #10B981, #34D399);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.our-highlight {
    background: linear-gradient(135deg, #3B82F6, #60A5FA);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.community-benefits {
    display: flex;
    flex-direction: column;
    gap: 40px;
    margin-bottom: 80px;
}

.benefit-item {
    display: flex;
    align-items: flex-start;
    gap: 25px;
    background: linear-gradient(135deg, rgba(17, 24, 39, 0.7), rgba(31, 41, 55, 0.5));
    border-radius: 20px;
    padding: 40px;
    border-left: 5px solid;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    transition: all 0.3s ease;
}

.tool-benefit {
    border-left-color: #10B981;
}

.positioning-benefit {
    border-left-color: #3B82F6;
}

.investment-benefit {
    border-left-color: #8B5CF6;
}

.benefit-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.4);
}

.benefit-icon {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.tool-benefit .benefit-icon {
    background: linear-gradient(135deg, #10B981, #059669);
}

.positioning-benefit .benefit-icon {
    background: linear-gradient(135deg, #3B82F6, #1D4ED8);
}

.investment-benefit .benefit-icon {
    background: linear-gradient(135deg, #8B5CF6, #7C3AED);
}

.benefit-icon i {
    font-size: 24px;
    color: white;
}

.benefit-content p {
    font-size: 20px;
    color: #D1D5DB;
    line-height: 1.6;
    margin: 0;
}

.highlight-text {
    background: linear-gradient(135deg, #10B981, #34D399);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
}

.most-important {
    margin-bottom: 60px;
}

.important-container {
    background: linear-gradient(135deg, rgba(251, 191, 36, 0.1), rgba(245, 158, 11, 0.05));
    border-radius: 20px;
    padding: 50px 40px;
    border: 2px solid rgba(251, 191, 36, 0.3);
    text-align: center;
}

.important-title {
    font-size: clamp(24px, 4vw, 36px);
    font-weight: 800;
    color: #E5E7EB;
    line-height: 1.4;
    margin-bottom: 30px;
}

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

.reality-statement {
    background: linear-gradient(135deg, #EF4444, #DC2626);
    color: white;
    padding: 15px 30px;
    border-radius: 50px;
    font-size: 20px;
    font-weight: 900;
    box-shadow: 0 10px 30px rgba(239, 68, 68, 0.4);
    animation: realityPulse 2s infinite ease-in-out;
}

@keyframes realityPulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
}

.gap-warning {
    margin-bottom: 60px;
}

.warning-content {
    background: rgba(17, 24, 39, 0.6);
    border-radius: 20px;
    padding: 40px;
    border: 1px solid rgba(239, 68, 68, 0.3);
    text-align: center;
}

.warning-text {
    font-size: 22px;
    color: #D1D5DB;
    line-height: 1.6;
    margin-bottom: 40px;
}

.widening-highlight {
    color: #F87171;
    font-weight: 800;
    font-size: 1.1em;
}

.gap-visual {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 40px;
    flex-wrap: wrap;
}

.gap-side {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
    padding: 25px;
    border-radius: 15px;
    min-width: 150px;
}

.gap-side.expert {
    background: rgba(16, 185, 129, 0.1);
    border: 2px solid rgba(16, 185, 129, 0.3);
}

.gap-side.struggling {
    background: rgba(239, 68, 68, 0.1);
    border: 2px solid rgba(239, 68, 68, 0.3);
}

.gap-label {
    font-weight: 700;
    font-size: 16px;
}

.expert .gap-label {
    color: #34D399;
}

.struggling .gap-label {
    color: #F87171;
}

.gap-trend {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    font-size: 14px;
}

.gap-trend.up {
    color: #34D399;
}

.gap-trend.down {
    color: #F87171;
}

.gap-divide {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.divide-line {
    width: 2px;
    height: 40px;
    background: linear-gradient(to bottom, transparent, rgba(168, 85, 247, 0.5), transparent);
}

.divide-text {
    background: linear-gradient(135deg, #A78BFA, #8B5CF6);
    color: white;
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.winning-promise {
    text-align: center;
}

.promise-container {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.15), rgba(5, 150, 105, 0.08));
    border-radius: 25px;
    padding: 50px 40px;
    border: 3px solid rgba(16, 185, 129, 0.4);
    box-shadow: 0 20px 60px rgba(16, 185, 129, 0.1);
}

.promise-title {
    font-size: clamp(28px, 5vw, 42px);
    font-weight: 800;
    color: #E5E7EB;
    line-height: 1.3;
    margin: 0;
}

.promptly-highlight {
    background: linear-gradient(135deg, #A78BFA, #60A5FA);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.winning-highlight {
    background: linear-gradient(135deg, #10B981, #34D399);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 900;
}

/* How to Claim Access Section Styles */
.claim-access-section {
    position: relative;
    margin: 0;
    padding: 0;
}

.access-container {
    position: relative;
    background: #1A0D2F;
    padding: 80px 40px;
    overflow: hidden;
    border-top: 2px solid rgba(59, 130, 246, 0.4);
}

.access-background {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.access-grid-pattern {
    position: absolute;
    inset: 0;
    background-image: 
        linear-gradient(rgba(59, 130, 246, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(59, 130, 246, 0.04) 1px, transparent 1px);
    background-size: 45px 45px;
    opacity: 0.5;
}

.access-glow-effects {
    position: absolute;
    inset: 0;
}

.access-glow-circle {
    position: absolute;
    border-radius: 50%;
    filter: blur(100px);
    animation: accessFloat 10s infinite ease-in-out;
}

.access-glow-1 {
    width: 350px;
    height: 350px;
    background: radial-gradient(circle, rgba(59, 130, 246, 0.08), transparent 70%);
    top: 20%;
    left: -175px;
    animation-delay: 0s;
}

.access-glow-2 {
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(168, 85, 247, 0.06), transparent 70%);
    top: 50%;
    right: -150px;
    animation-delay: -5s;
}

@keyframes accessFloat {
    0%, 100% { transform: translateY(0px) scale(1); }
    50% { transform: translateY(-25px) scale(1.1); }
}

.access-content {
    position: relative;
    z-index: 2;
    max-width: 900px;
    margin: 0 auto;
}

.access-header {
    text-align: center;
    margin-bottom: 80px;
}

.access-title {
    font-size: clamp(36px, 6vw, 56px);
    font-weight: 900;
    color: #E5E7EB;
    line-height: 1.2;
    margin-bottom: 20px;
    text-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
}

.access-highlight {
    background: linear-gradient(135deg, #3B82F6, #60A5FA);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.access-subtitle {
    font-size: 22px;
    color: #D1D5DB;
    margin: 0;
    font-weight: 500;
}

.access-steps {
    display: flex;
    flex-direction: column;
    gap: 50px;
}

.access-step {
    display: flex;
    align-items: flex-start;
    gap: 30px;
}

.step-visual {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.step-number {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    font-weight: 900;
    color: white;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.4);
    position: relative;
    z-index: 2;
}

.step-1 .step-number {
    background: linear-gradient(135deg, #3B82F6, #1D4ED8);
}

.step-2 .step-number {
    background: linear-gradient(135deg, #10B981, #059669);
}

.step-3 .step-number {
    background: linear-gradient(135deg, #8B5CF6, #7C3AED);
}

.step-4 .step-number {
    background: linear-gradient(135deg, #F59E0B, #D97706);
}

.step-connector {
    width: 4px;
    height: 80px;
    background: linear-gradient(to bottom, rgba(168, 85, 247, 0.5), rgba(168, 85, 247, 0.2));
    margin-top: 20px;
    border-radius: 2px;
}

.step-4 .step-connector {
    display: none;
}

.step-content {
    flex: 1;
    background: linear-gradient(135deg, rgba(17, 24, 39, 0.7), rgba(31, 41, 55, 0.5));
    border-radius: 20px;
    padding: 40px;
    border: 1px solid rgba(59, 130, 246, 0.2);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    transition: all 0.3s ease;
}

.step-content:hover {
    transform: translateY(-5px);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.4);
    border-color: rgba(59, 130, 246, 0.4);
}

.step-title {
    font-size: 24px;
    font-weight: 800;
    color: #E5E7EB;
    margin-bottom: 20px;
    line-height: 1.3;
}

.step-icon-demo {
    display: flex;
    justify-content: center;
    margin-top: 20px;
}

.demo-button {
    display: flex;
    align-items: center;
    gap: 10px;
    background: linear-gradient(135deg, #3B82F6, #1D4ED8);
    color: white;
    padding: 12px 24px;
    border-radius: 25px;
    font-weight: 600;
    animation: buttonDemo 2s infinite ease-in-out;
}

@keyframes buttonDemo {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
}

.step-detail {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #A78BFA;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 20px;
}

.step-detail i {
    color: #FBBF24;
}

.security-indicators {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

.security-badge {
    display: flex;
    align-items: center;
    gap: 6px;
    background: rgba(16, 185, 129, 0.1);
    color: #34D399;
    padding: 8px 12px;
    border-radius: 15px;
    font-size: 12px;
    font-weight: 600;
    border: 1px solid rgba(16, 185, 129, 0.3);
}

.instant-access {
    display: flex;
    align-items: center;
    gap: 10px;
    background: rgba(139, 92, 246, 0.1);
    color: #C084FC;
    padding: 12px 16px;
    border-radius: 15px;
    font-weight: 600;
    border: 1px solid rgba(139, 92, 246, 0.3);
    width: fit-content;
}

.instant-access i {
    color: #FBBF24;
}

.transformation-demo {
    margin-top: 20px;
}

.before-after {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    flex-wrap: wrap;
}

.before,
.after {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 15px 20px;
    border-radius: 10px;
    min-width: 120px;
}

.before {
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(239, 68, 68, 0.3);
}

.after {
    background: rgba(16, 185, 129, 0.1);
    border: 1px solid rgba(16, 185, 129, 0.3);
}

.before .label {
    color: #F87171;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
}

.after .label {
    color: #34D399;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
}

.before .result {
    color: #F87171;
    font-weight: 500;
}

.after .result {
    color: #34D399;
    font-weight: 500;
}

.arrow-transform {
    color: #A78BFA;
    font-size: 24px;
    font-weight: bold;
}

/* Final Call to Action Section Styles */
.final-cta-section {
    position: relative;
    margin: 0;
    padding: 0;
}

.final-cta-container {
    position: relative;
    background: #1A0D2F;
    padding: 80px 40px;
    overflow: hidden;
    border-top: 2px solid rgba(239, 68, 68, 0.4);
}

.final-background {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.final-grid-pattern {
    position: absolute;
    inset: 0;
    background-image: 
        linear-gradient(rgba(239, 68, 68, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(239, 68, 68, 0.05) 1px, transparent 1px);
    background-size: 40px 40px;
    opacity: 0.6;
}

.final-glow-effects {
    position: absolute;
    inset: 0;
}

.final-glow-circle {
    position: absolute;
    border-radius: 50%;
    filter: blur(150px);
    animation: finalFloat 15s infinite ease-in-out;
}

.final-glow-1 {
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(239, 68, 68, 0.08), transparent 70%);
    top: 0%;
    left: -250px;
    animation-delay: 0s;
}

.final-glow-2 {
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(16, 185, 129, 0.06), transparent 70%);
    top: 30%;
    right: -200px;
    animation-delay: -5s;
}

.final-glow-3 {
    width: 350px;
    height: 350px;
    background: radial-gradient(circle, rgba(251, 191, 36, 0.06), transparent 70%);
    bottom: 10%;
    left: 40%;
    animation-delay: -10s;
}

@keyframes finalFloat {
    0%, 100% { transform: translateY(0px) scale(1); opacity: 0.4; }
    50% { transform: translateY(-40px) scale(1.15); opacity: 0.7; }
}

.final-content {
    position: relative;
    z-index: 2;
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
}

.urgency-reminder {
    margin-bottom: 50px;
}

.reminder-container {
    display: flex;
    align-items: flex-start;
    gap: 25px;
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.1), rgba(217, 119, 6, 0.05));
    border-radius: 20px;
    padding: 40px;
    border: 2px solid rgba(245, 158, 11, 0.3);
    text-align: left;
}

.reminder-icon {
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, #F59E0B, #D97706);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    animation: reminderPulse 3s infinite ease-in-out;
}

@keyframes reminderPulse {
    0%, 100% { box-shadow: 0 10px 30px rgba(245, 158, 11, 0.3); }
    50% { box-shadow: 0 15px 50px rgba(245, 158, 11, 0.6); }
}

.reminder-icon i {
    font-size: 24px;
    color: white;
}

.reminder-content {
    flex: 1;
}

.reminder-title {
    font-size: 24px;
    font-weight: 800;
    color: #FBBF24;
    margin-bottom: 15px;
}

.reminder-text {
    font-size: 18px;
    color: #D1D5DB;
    line-height: 1.6;
    margin: 0;
}

.slip-warning {
    margin-bottom: 50px;
}

.slip-title {
    font-size: clamp(28px, 5vw, 42px);
    font-weight: 800;
    color: #EF4444;
    margin: 0;
    text-shadow: 0 4px 8px rgba(239, 68, 68, 0.3);
    animation: slipWarning 2s infinite ease-in-out;
}

@keyframes slipWarning {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.8; }
}

.revolution-statement {
    margin-bottom: 60px;
}

.revolution-container {
    background: rgba(17, 24, 39, 0.6);
    border-radius: 25px;
    padding: 50px 40px;
    border: 1px solid rgba(168, 85, 247, 0.2);
}

.revolution-title {
    font-size: clamp(24px, 4vw, 36px);
    font-weight: 800;
    color: #E5E7EB;
    margin-bottom: 25px;
    line-height: 1.3;
}

.choice-final {
    border-top: 2px solid rgba(168, 85, 247, 0.3);
    padding-top: 25px;
}

.choice-text {
    font-size: clamp(20px, 3vw, 28px);
    font-weight: 700;
    color: #D1D5DB;
    margin: 0;
    line-height: 1.4;
}

.leading-highlight {
    background: linear-gradient(135deg, #10B981, #34D399);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 900;
}

.watching-highlight {
    color: #F87171;
    font-weight: 900;
}

.final-button-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 30px;
}

.countdown-urgency {
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(239, 68, 68, 0.1);
    color: #F87171;
    padding: 12px 24px;
    border-radius: 25px;
    font-weight: 700;
    font-size: 16px;
    border: 1px solid rgba(239, 68, 68, 0.3);
    animation: urgencyBlink 2s infinite ease-in-out;
}

@keyframes urgencyBlink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

.countdown-urgency i {
    color: #FBBF24;
    animation: hourglass 3s infinite ease-in-out;
}

@keyframes hourglass {
    0%, 100% { transform: rotate(0deg); }
    50% { transform: rotate(180deg); }
}

.final-cta-button {
    background: linear-gradient(135deg, #10B981, #059669);
    color: white;
    border: none;
    padding: 30px 60px;
    border-radius: 25px;
    cursor: pointer;
    transition: all 0.4s ease;
    box-shadow: 0 25px 80px rgba(16, 185, 129, 0.4);
    border: 4px solid #34D399;
    animation: finalButtonPulse 3s infinite ease-in-out;
    max-width: 500px;
    width: 100%;
}

@keyframes finalButtonPulse {
    0%, 100% { 
        transform: scale(1); 
        box-shadow: 0 25px 80px rgba(16, 185, 129, 0.4); 
    }
    50% { 
        transform: scale(1.02); 
        box-shadow: 0 30px 100px rgba(16, 185, 129, 0.7); 
    }
}

.final-cta-button:hover {
    transform: translateY(-5px) scale(1.05);
    box-shadow: 0 35px 120px rgba(16, 185, 129, 0.8);
    background: linear-gradient(135deg, #059669, #047857);
}

.button-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

.button-main {
    display: flex;
    align-items: center;
    gap: 15px;
    font-size: 22px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.button-main i {
    font-size: 24px;
}

.button-price {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

.price-today {
    font-size: 28px;
    font-weight: 900;
    color: #FBBF24;
}

.price-regular {
    font-size: 14px;
    opacity: 0.8;
    text-decoration: line-through;
}

.button-guarantee {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 600;
    opacity: 0.9;
}

.final-security {
    display: flex;
    justify-content: center;
    gap: 30px;
    flex-wrap: wrap;
}

.final-security .security-item {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #9CA3AF;
    font-size: 14px;
    font-weight: 500;
}

.final-security .security-item i {
    color: #10B981;
    font-size: 16px;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .community-container,
    .access-container,
    .final-cta-container {
        padding: 60px 30px;
    }
    
    .benefit-item,
    .reminder-container {
        flex-direction: column;
        text-align: center;
        gap: 20px;
    }
    
    .access-step {
        flex-direction: column;
        text-align: center;
        gap: 25px;
    }
    
    .step-visual {
        flex-direction: row;
        gap: 20px;
        justify-content: center;
    }
    
    .step-connector {
        width: 80px;
        height: 4px;
        margin-top: 0;
    }
    
    .gap-visual {
        flex-direction: column;
        gap: 20px;
    }
    
    .gap-divide {
        flex-direction: row;
        gap: 15px;
    }
    
    .divide-line {
        width: 40px;
        height: 2px;
    }
}

@media (max-width: 768px) {
    .community-container,
    .access-container,
    .final-cta-container {
        padding: 50px 20px;
    }
    
    .benefit-item,
    .step-content,
    .important-container,
    .promise-container,
    .revolution-container {
        padding: 30px 20px;
    }
    
    .final-cta-button {
        padding: 25px 40px;
    }
    
    .button-main {
        font-size: 18px;
    }
    
    .price-today {
        font-size: 24px;
    }
    
    .final-security {
        flex-direction: column;
        align-items: center;
        gap: 15px;
    }
}

@media (max-width: 480px) {
    .step-visual {
        flex-direction: column;
        gap: 15px;
    }
    
    .step-connector {
        width: 4px;
        height: 60px;
        margin-top: 15px;
    }
    
    .security-indicators,
    .before-after {
        flex-direction: column;
        align-items: center;
    }
    
    .final-cta-button {
        padding: 20px 30px;
    }
    
    .button-main {
        flex-direction: column;
        gap: 10px;
        text-align: center;
    }
}
/* FAQ Section Styles */
.faq-section {
    position: relative;
    margin: 0;
    padding: 0;
}

.faq-container {
    position: relative;
    background: #1A0D2F;
    padding: 80px 40px;
    overflow: hidden;
    border-top: 2px solid rgba(168, 85, 247, 0.4);
}

.faq-background {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.faq-grid-pattern {
    position: absolute;
    inset: 0;
    background-image: 
        linear-gradient(rgba(168, 85, 247, 0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(168, 85, 247, 0.03) 1px, transparent 1px);
    background-size: 60px 60px;
    opacity: 0.5;
}

.faq-glow-effects {
    position: absolute;
    inset: 0;
}

.faq-glow-circle {
    position: absolute;
    border-radius: 50%;
    filter: blur(120px);
    animation: faqFloat 14s infinite ease-in-out;
}

.faq-glow-1 {
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(168, 85, 247, 0.06), transparent 70%);
    top: 20%;
    left: -200px;
    animation-delay: 0s;
}

.faq-glow-2 {
    width: 350px;
    height: 350px;
    background: radial-gradient(circle, rgba(59, 130, 246, 0.05), transparent 70%);
    top: 60%;
    right: -175px;
    animation-delay: -7s;
}

@keyframes faqFloat {
    0%, 100% { transform: translateY(0px) scale(1); }
    50% { transform: translateY(-30px) scale(1.1); }
}

.faq-content {
    position: relative;
    z-index: 2;
    max-width: 1000px;
    margin: 0 auto;
}

.faq-header {
    text-align: center;
    margin-bottom: 80px;
}

.faq-title {
    font-size: clamp(36px, 6vw, 56px);
    font-weight: 900;
    line-height: 1.2;
    text-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
}

.common-highlight {
    color: #E5E7EB;
    display: block;
}

.concerns-highlight {
    background: linear-gradient(135deg, #A78BFA, #60A5FA);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    display: block;
}

.faq-items {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-bottom: 80px;
}

.faq-item {
    background: linear-gradient(135deg, rgba(17, 24, 39, 0.8), rgba(31, 41, 55, 0.6));
    border-radius: 20px;
    border: 1px solid rgba(168, 85, 247, 0.2);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
    transition: all 0.3s ease;
    overflow: hidden;
}

.faq-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 15px 50px rgba(168, 85, 247, 0.1);
    border-color: rgba(168, 85, 247, 0.4);
}

.faq-question {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 30px 40px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.faq-question:hover {
    background: rgba(168, 85, 247, 0.05);
}

.question-icon {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
}

.faq-item[data-category="technical"] .question-icon {
    background: linear-gradient(135deg, #10B981, #059669);
}

.faq-item[data-category="updates"] .question-icon {
    background: linear-gradient(135deg, #3B82F6, #1D4ED8);
}

.faq-item[data-category="compatibility"] .question-icon {
    background: linear-gradient(135deg, #8B5CF6, #7C3AED);
}

.faq-item[data-category="comparison"] .question-icon {
    background: linear-gradient(135deg, #F59E0B, #D97706);
}

.faq-item[data-category="customization"] .question-icon {
    background: linear-gradient(135deg, #EF4444, #DC2626);
}

.faq-item[data-category="pricing"] .question-icon {
    background: linear-gradient(135deg, #06B6D4, #0891B2);
}

.faq-item[data-category="expertise"] .question-icon {
    background: linear-gradient(135deg, #A855F7, #9333EA);
}

.question-icon i {
    font-size: 20px;
    color: white;
}

.question-text {
    flex: 1;
    font-size: 20px;
    font-weight: 700;
    color: #E5E7EB;
    margin: 0;
    line-height: 1.4;
}

.expand-icon {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #A78BFA;
    transition: transform 0.3s ease;
}

.faq-item.active .expand-icon {
    transform: rotate(180deg);
}

.faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

.faq-item.active .faq-answer {
    max-height: 500px;
}

.answer-content {
    padding: 0 40px 40px 110px;
}

.answer-content p {
    font-size: 18px;
    color: #D1D5DB;
    line-height: 1.6;
    margin-bottom: 25px;
}

.highlight-skill {
    background: linear-gradient(135deg, #10B981, #34D399);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
}

.highlight-continuous {
    background: linear-gradient(135deg, #3B82F6, #60A5FA);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
}

.highlight-number {
    background: linear-gradient(135deg, #8B5CF6, #A855F7);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
}

.highlight-optimized {
    background: linear-gradient(135deg, #F59E0B, #FBBF24);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
}

.highlight-coverage {
    background: linear-gradient(135deg, #EF4444, #F87171);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
}

.highlight-lifetime {
    background: linear-gradient(135deg, #06B6D4, #22D3EE);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
    font-size: 1.1em;
}

.highlight-discovery {
    background: linear-gradient(135deg, #A855F7, #C084FC);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
}

.answer-highlight {
    display: flex;
    align-items: center;
    gap: 10px;
    background: rgba(16, 185, 129, 0.1);
    color: #34D399;
    padding: 12px 16px;
    border-radius: 10px;
    font-weight: 600;
    border: 1px solid rgba(16, 185, 129, 0.3);
    width: fit-content;
}

.update-timeline {
    background: rgba(31, 41, 55, 0.4);
    border-radius: 12px;
    padding: 20px;
    margin-top: 15px;
}

.timeline-item {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    flex-wrap: wrap;
}

.timeline-label {
    background: rgba(59, 130, 246, 0.1);
    color: #60A5FA;
    padding: 8px 12px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    border: 1px solid rgba(59, 130, 246, 0.3);
}

.timeline-arrow {
    color: #A78BFA;
    font-weight: bold;
}

.tool-categories {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 15px;
}

.category-badge {
    background: rgba(168, 85, 247, 0.1);
    color: #C084FC;
    padding: 6px 12px;
    border-radius: 15px;
    font-size: 12px;
    font-weight: 600;
    border: 1px solid rgba(168, 85, 247, 0.3);
}

.comparison-grid {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 20px;
    align-items: center;
    margin-top: 20px;
}

.comparison-item {
    background: rgba(31, 41, 55, 0.4);
    border-radius: 12px;
    padding: 20px;
    text-align: center;
    border: 1px solid;
}

.comparison-item.generic {
    border-color: rgba(107, 114, 128, 0.3);
}

.comparison-item.specialized {
    border-color: rgba(16, 185, 129, 0.3);
}

.comparison-header {
    font-weight: 700;
    font-size: 14px;
    margin-bottom: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.generic .comparison-header {
    color: #9CA3AF;
}

.specialized .comparison-header {
    color: #34D399;
}

.comparison-points {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 13px;
    color: #D1D5DB;
}

.comparison-vs {
    color: #A78BFA;
    font-weight: 900;
    font-size: 16px;
    text-align: center;
}

.industry-examples {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 15px;
}

.industry-tag {
    background: rgba(239, 68, 68, 0.1);
    color: #F87171;
    padding: 6px 12px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
    border: 1px solid rgba(239, 68, 68, 0.3);
}

.custom-feature {
    display: flex;
    align-items: center;
    gap: 10px;
    background: rgba(31, 41, 55, 0.4);
    padding: 12px 16px;
    border-radius: 10px;
    margin-top: 15px;
    color: #A78BFA;
    font-weight: 500;
    border: 1px solid rgba(168, 85, 247, 0.3);
}

.pricing-comparison {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 20px;
    align-items: center;
    margin-top: 20px;
}

.pricing-item {
    background: rgba(31, 41, 55, 0.4);
    border-radius: 15px;
    padding: 25px 20px;
    text-align: center;
    border: 1px solid;
}

.pricing-item.subscription {
    border-color: rgba(239, 68, 68, 0.3);
}

.pricing-item.lifetime {
    border-color: rgba(6, 182, 212, 0.3);
}

.pricing-header {
    font-weight: 600;
    font-size: 14px;
    margin-bottom: 10px;
    text-transform: uppercase;
}

.subscription .pricing-header {
    color: #F87171;
}

.lifetime .pricing-header {
    color: #22D3EE;
}

.pricing-amount {
    font-size: 24px;
    font-weight: 900;
    margin-bottom: 5px;
}

.subscription .pricing-amount {
    color: #EF4444;
}

.lifetime .pricing-amount {
    color: #06B6D4;
}

.pricing-total {
    font-size: 12px;
    color: #9CA3AF;
}

.pricing-vs {
    color: #A78BFA;
    font-weight: 900;
    font-size: 16px;
    text-align: center;
}

.expert-benefits {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 20px;
}

.expert-benefits .benefit-item {
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(168, 85, 247, 0.1);
    padding: 12px 16px;
    border-radius: 10px;
    color: #C084FC;
    font-weight: 500;
    border: 1px solid rgba(168, 85, 247, 0.3);
}

.expert-benefits .benefit-item i {
    color: #A855F7;
    width: 16px;
}

.more-questions {
    text-align: center;
}

.questions-container {
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.1), rgba(30, 58, 138, 0.05));
    border-radius: 25px;
    padding: 50px 40px;
    border: 2px solid rgba(59, 130, 246, 0.2);
}

.questions-title {
    font-size: 28px;
    font-weight: 800;
    color: #E5E7EB;
    margin-bottom: 15px;
}

.questions-text {
    font-size: 18px;
    color: #D1D5DB;
    margin-bottom: 30px;
}

.contact-options {
    display: flex;
    justify-content: center;
    gap: 40px;
    flex-wrap: wrap;
}

.contact-item {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #60A5FA;
    font-weight: 600;
}

.contact-item i {
    color: #3B82F6;
    font-size: 18px;
}

/* Interactive FAQ Functionality */
.faq-item {
    cursor: pointer;
}

.faq-item.active .faq-answer {
    max-height: 1000px;
    transition: max-height 0.5s ease;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .faq-container {
        padding: 60px 30px;
    }
    
    .comparison-grid,
    .pricing-comparison {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    
    .comparison-vs,
    .pricing-vs {
        order: 2;
    }
    
    .timeline-item {
        flex-direction: column;
        gap: 10px;
    }
    
    .timeline-arrow {
        transform: rotate(90deg);
    }
}

@media (max-width: 768px) {
    .faq-container {
        padding: 50px 20px;
    }
    
    .faq-question {
        padding: 25px 20px;
        gap: 15px;
    }
    
    .answer-content {
        padding: 0 20px 30px 20px;
    }
    
    .questions-container {
        padding: 40px 20px;
    }
    
    .contact-options {
        flex-direction: column;
        gap: 20px;
    }
}

@media (max-width: 480px) {
    .question-icon {
        width: 40px;
        height: 40px;
    }
    
    .question-text {
        font-size: 18px;
    }
    
    .tool-categories,
    .industry-examples {
        flex-direction: column;
        align-items: center;
    }
}
/* P.S. Closing Section Styles */
.ps-closing-section {
    position: relative;
    margin: 0;
    padding: 0;
}

.ps-container {
    position: relative;
    background: #1A0D2F;
    padding: 80px 40px;
    overflow: hidden;
    border-top: 3px solid rgba(251, 191, 36, 0.5);
}

.ps-background {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.ps-grid-pattern {
    position: absolute;
    inset: 0;
    background-image: 
        linear-gradient(rgba(251, 191, 36, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(251, 191, 36, 0.04) 1px, transparent 1px);
    background-size: 50px 50px;
    opacity: 0.6;
}

.ps-glow-effects {
    position: absolute;
    inset: 0;
}

.ps-glow-circle {
    position: absolute;
    border-radius: 50%;
    filter: blur(150px);
    animation: psFloat 16s infinite ease-in-out;
}

.ps-glow-1 {
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(251, 191, 36, 0.08), transparent 70%);
    top: 0%;
    left: -250px;
    animation-delay: 0s;
}

.ps-glow-2 {
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(16, 185, 129, 0.06), transparent 70%);
    top: 40%;
    right: -200px;
    animation-delay: -5s;
}

.ps-glow-3 {
    width: 350px;
    height: 350px;
    background: radial-gradient(circle, rgba(168, 85, 247, 0.06), transparent 70%);
    bottom: 10%;
    left: 50%;
    animation-delay: -10s;
}

@keyframes psFloat {
    0%, 100% { transform: translateY(0px) scale(1); opacity: 0.3; }
    50% { transform: translateY(-45px) scale(1.2); opacity: 0.6; }
}

.ps-content {
    position: relative;
    z-index: 2;
    max-width: 1000px;
    margin: 0 auto;
}

/* P.S. Statement */
.ps-statement {
    margin-bottom: 80px;
}

.ps-header {
    margin-bottom: 30px;
}

.ps-title {
    font-size: 48px;
    font-weight: 900;
    background: linear-gradient(135deg, #FBBF24, #F59E0B);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin: 0;
    text-shadow: 0 4px 8px rgba(251, 191, 36, 0.3);
}

.ps-text-content {
    background: linear-gradient(135deg, rgba(17, 24, 39, 0.8), rgba(31, 41, 55, 0.6));
    border-radius: 25px;
    padding: 50px 40px;
    border: 2px solid rgba(251, 191, 36, 0.3);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
}

.ps-transparency {
    font-size: 20px;
    color: #D1D5DB;
    line-height: 1.6;
    margin-bottom: 40px;
}

.obsolete-highlight {
    color: #F87171;
    font-weight: 700;
    background: rgba(239, 68, 68, 0.1);
    padding: 2px 6px;
    border-radius: 4px;
}

.exactly-why {
    background: rgba(251, 191, 36, 0.1);
    border-radius: 20px;
    padding: 40px;
    margin-bottom: 40px;
    border: 1px solid rgba(251, 191, 36, 0.3);
}

.exactly-title {
    font-size: 28px;
    font-weight: 800;
    color: #FBBF24;
    margin-bottom: 20px;
    text-align: center;
}

.framework-text {
    font-size: 18px;
    color: #E5E7EB;
    line-height: 1.6;
    margin: 0;
    text-align: center;
}

.framework-highlight {
    background: linear-gradient(135deg, #10B981, #34D399);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
}

.insurance-statement {
    text-align: center;
}

.insurance-container {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.15), rgba(5, 150, 105, 0.08));
    border-radius: 20px;
    padding: 30px 40px;
    border: 2px solid rgba(16, 185, 129, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    flex-wrap: wrap;
}

.insurance-icon {
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, #10B981, #059669);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 30px rgba(16, 185, 129, 0.4);
}

.insurance-icon i {
    font-size: 24px;
    color: white;
}

.insurance-text {
    font-size: clamp(20px, 4vw, 32px);
    font-weight: 800;
    color: #34D399;
    margin: 0;
    text-align: center;
}

/* P.P.S. Statement */
.pps-statement {
    margin-bottom: 80px;
}

.pps-header {
    margin-bottom: 30px;
}

.pps-title {
    font-size: 48px;
    font-weight: 900;
    background: linear-gradient(135deg, #A78BFA, #8B5CF6);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin: 0;
    text-shadow: 0 4px 8px rgba(168, 85, 247, 0.3);
}

.pps-text-content {
    background: linear-gradient(135deg, rgba(17, 24, 39, 0.8), rgba(31, 41, 55, 0.6));
    border-radius: 25px;
    padding: 50px 40px;
    border: 2px solid rgba(168, 85, 247, 0.3);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
}

.fence-question {
    font-size: 20px;
    color: #D1D5DB;
    line-height: 1.6;
    margin-bottom: 40px;
    text-align: center;
}

.one-breakthrough {
    background: linear-gradient(135deg, #FBBF24, #F59E0B);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 800;
    font-size: 1.1em;
}

.breakthrough-examples {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-bottom: 40px;
}

.breakthrough-item {
    display: flex;
    align-items: center;
    gap: 15px;
    background: rgba(31, 41, 55, 0.6);
    padding: 20px 25px;
    border-radius: 15px;
    border-left: 4px solid;
    transition: all 0.3s ease;
}

.breakthrough-item:nth-child(1) {
    border-left-color: #EF4444;
}

.breakthrough-item:nth-child(2) {
    border-left-color: #10B981;
}

.breakthrough-item:nth-child(3) {
    border-left-color: #FBBF24;
}

.breakthrough-item:hover {
    transform: translateX(10px);
    background: rgba(31, 41, 55, 0.8);
}

.breakthrough-item i {
    font-size: 20px;
    width: 24px;
}

.breakthrough-item:nth-child(1) i {
    color: #EF4444;
}

.breakthrough-item:nth-child(2) i {
    color: #10B981;
}

.breakthrough-item:nth-child(3) i {
    color: #FBBF24;
}

.breakthrough-item span {
    color: #E5E7EB;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.4;
}

.dozens-promise {
    text-align: center;
    margin-bottom: 40px;
    background: rgba(168, 85, 247, 0.1);
    border-radius: 20px;
    padding: 30px;
    border: 1px solid rgba(168, 85, 247, 0.3);
}

.dozens-title {
    font-size: clamp(24px, 4vw, 36px);
    font-weight: 800;
    background: linear-gradient(135deg, #A78BFA, #C084FC);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin: 0;
    line-height: 1.3;
}

.value-proposition {
    text-align: center;
}

.once-value {
    font-size: 18px;
    color: #D1D5DB;
    margin-bottom: 25px;
    line-height: 1.6;
}

.pay-itself {
    background: linear-gradient(135deg, #10B981, #34D399);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
}

.career-statement {
    background: rgba(59, 130, 246, 0.1);
    border-radius: 15px;
    padding: 25px;
    border: 1px solid rgba(59, 130, 246, 0.3);
}

.career-text {
    font-size: clamp(20px, 3vw, 28px);
    font-weight: 800;
    color: #60A5FA;
    margin: 0;
    line-height: 1.4;
}

/* Final CTA Section */
.final-cta-section {
    text-align: center;
    margin-bottom: 60px;
}

.cta-urgency {
    margin-bottom: 30px;
}

.urgency-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: linear-gradient(135deg, #EF4444, #DC2626);
    color: white;
    padding: 12px 24px;
    border-radius: 25px;
    font-weight: 700;
    font-size: 16px;
    text-transform: uppercase;
    letter-spacing: 1px;
    box-shadow: 0 10px 30px rgba(239, 68, 68, 0.4);
    animation: urgencyPulse 2s infinite ease-in-out;
}

@keyframes urgencyPulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
}

.urgency-badge i {
    animation: clockTick 1s infinite;
}

@keyframes clockTick {
    0%, 100% { transform: rotate(0deg); }
    50% { transform: rotate(5deg); }
}

.ultimate-cta-button {
    background: linear-gradient(135deg, #10B981, #059669, #047857);
    color: white;
    border: none;
    padding: 30px 60px;
    border-radius: 25px;
    cursor: pointer;
    transition: all 0.4s ease;
    box-shadow: 0 25px 80px rgba(16, 185, 129, 0.5);
    border: 4px solid #34D399;
    display: flex;
    align-items: center;
    gap: 30px;
    margin: 0 auto 30px;
    max-width: 600px;
    animation: ultimateButtonPulse 3s infinite ease-in-out;
}

@keyframes ultimateButtonPulse {
    0%, 100% { 
        transform: scale(1); 
        box-shadow: 0 25px 80px rgba(16, 185, 129, 0.5); 
    }
    50% { 
        transform: scale(1.02); 
        box-shadow: 0 30px 100px rgba(16, 185, 129, 0.8); 
    }
}

.ultimate-cta-button:hover {
    transform: translateY(-8px) scale(1.05);
    box-shadow: 0 35px 120px rgba(16, 185, 129, 0.9);
    background: linear-gradient(135deg, #059669, #047857, #065f46);
}

.button-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.button-main-text {
    font-size: 22px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 1px;
    line-height: 1.2;
}

.button-subtext {
    font-size: 16px;
    font-weight: 700;
    color: #FBBF24;
    text-transform: uppercase;
}

.button-price-info {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.current-offer {
    font-size: 20px;
    font-weight: 900;
    color: #FBBF24;
}

.regular-pricing {
    font-size: 14px;
    opacity: 0.8;
    text-decoration: line-through;
}

.button-arrow {
    font-size: 24px;
    animation: arrowMove 2s infinite ease-in-out;
}

@keyframes arrowMove {
    0%, 100% { transform: translateX(0px); }
    50% { transform: translateX(5px); }
}

.offer-disclaimer {
    max-width: 600px;
    margin: 0 auto;
}

.disclaimer-text {
    font-size: 14px;
    color: #9CA3AF;
    line-height: 1.5;
    font-style: italic;
}

.guarantee-highlight {
    color: #34D399;
    font-weight: 700;
}

/* Final Message */
.final-message {
    text-align: center;
}

.message-container {
    background: linear-gradient(135deg, rgba(168, 85, 247, 0.1), rgba(139, 92, 246, 0.05));
    border-radius: 25px;
    padding: 50px 40px;
    border: 2px solid rgba(168, 85, 247, 0.3);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 25px;
}

.message-icon {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #EC4899, #BE185D);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 15px 40px rgba(236, 72, 153, 0.4);
    animation: heartBeat 2s infinite ease-in-out;
}

@keyframes heartBeat {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

.message-icon i {
    font-size: 32px;
    color: white;
}

.final-message-text {
    font-size: clamp(24px, 4vw, 36px);
    font-weight: 800;
    color: #E5E7EB;
    margin: 0;
    line-height: 1.4;
    text-align: center;
}

.future-self {
    background: linear-gradient(135deg, #A78BFA, #C084FC);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .ps-container {
        padding: 60px 30px;
    }
    
    .ps-text-content,
    .pps-text-content {
        padding: 40px 30px;
    }
    
    .exactly-why,
    .insurance-container {
        padding: 30px 20px;
    }
    
    .ultimate-cta-button {
        flex-direction: column;
        gap: 20px;
        text-align: center;
    }
    
    .button-arrow {
        transform: rotate(90deg);
    }
}

@media (max-width: 768px) {
    .ps-container {
        padding: 50px 20px;
    }
    
    .ps-text-content,
    .pps-text-content {
        padding: 30px 20px;
    }
    
    .ultimate-cta-button {
        padding: 25px 40px;
    }
    
    .button-main-text {
        font-size: 18px;
    }
    
    .insurance-container {
        flex-direction: column;
        gap: 15px;
    }
    
    .message-container {
        padding: 40px 20px;
    }
}

@media (max-width: 480px) {
    .ps-title,
    .pps-title {
        font-size: 36px;
    }
    
    .breakthrough-examples {
        gap: 15px;
    }
    
    .breakthrough-item {
        padding: 15px 20px;
        flex-direction: column;
        text-align: center;
        gap: 10px;
    }
    
    .ultimate-cta-button {
        padding: 20px 30px;
    }
    
    .button-price-info {
        gap: 2px;
    }
}
/* Footer Section Styles */
.site-footer {
    position: relative;
    margin-top: 0;
}

.footer-container {
    position: relative;
    background: #0F0A1A;
    padding: 60px 40px 40px;
    overflow: hidden;
    border-top: 1px solid rgba(168, 85, 247, 0.2);
}

.footer-background {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.footer-grid-pattern {
    position: absolute;
    inset: 0;
    background-image: 
        linear-gradient(rgba(168, 85, 247, 0.02) 1px, transparent 1px),
        linear-gradient(90deg, rgba(168, 85, 247, 0.02) 1px, transparent 1px);
    background-size: 80px 80px;
    opacity: 0.3;
}

.footer-glow-effects {
    position: absolute;
    inset: 0;
}

.footer-glow-circle {
    position: absolute;
    border-radius: 50%;
    filter: blur(150px);
    animation: footerFloat 20s infinite ease-in-out;
}

.footer-glow-1 {
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(168, 85, 247, 0.04), transparent 70%);
    top: 20%;
    left: -150px;
    animation-delay: 0s;
}

.footer-glow-2 {
    width: 250px;
    height: 250px;
    background: radial-gradient(circle, rgba(59, 130, 246, 0.03), transparent 70%);
    top: 40%;
    right: -125px;
    animation-delay: -10s;
}

@keyframes footerFloat {
    0%, 100% { transform: translateY(0px) scale(1); }
    50% { transform: translateY(-20px) scale(1.05); }
}

.footer-content {
    position: relative;
    z-index: 2;
    max-width: 1200px;
    margin: 0 auto;
}

/* Logo Section */
.footer-logo-section {
    text-align: center;
    margin-bottom: 50px;
    padding-bottom: 30px;
    border-bottom: 1px solid rgba(168, 85, 247, 0.1);
}

.footer-logo-container {
    display: flex;
    justify-content: center;
}

.footer-logo {
    max-height: 60px;
    width: auto;
}

.logo-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
}

.logo-icon {
    width: 50px;
    height: 50px;
    background: linear-gradient(135deg, #A78BFA, #8B5CF6);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 30px rgba(168, 85, 247, 0.3);
}

.logo-icon i {
    font-size: 24px;
    color: white;
}

.logo-text {
    display: flex;
    align-items: baseline;
    gap: 4px;
}

.logo-promptly {
    font-size: 28px;
    font-weight: 900;
    color: #E5E7EB;
    letter-spacing: 1px;
}

.logo-ai {
    font-size: 32px;
    font-weight: 900;
    background: linear-gradient(135deg, #60A5FA, #22D3EE);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Disclaimer Section */
.disclaimer-section {
    margin-bottom: 40px;
}

.disclaimer-content {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.disclaimer-block {
    background: rgba(17, 24, 39, 0.4);
    border-radius: 12px;
    padding: 25px 30px;
    border: 1px solid rgba(75, 85, 99, 0.2);
}

.disclaimer-text {
    font-size: 13px;
    line-height: 1.6;
    color: #9CA3AF;
    margin: 0;
    text-align: justify;
}

.disclaimer-text strong {
    color: #D1D5DB;
    font-weight: 700;
}

/* Footer Links */
.footer-links {
    margin-bottom: 30px;
    padding: 25px 0;
    border-top: 1px solid rgba(168, 85, 247, 0.1);
    border-bottom: 1px solid rgba(168, 85, 247, 0.1);
}

.links-container {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.footer-link {
    color: #A78BFA;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    padding: 8px 12px;
    border-radius: 6px;
    transition: all 0.3s ease;
}

.footer-link:hover {
    color: #C084FC;
    background: rgba(168, 85, 247, 0.1);
    transform: translateY(-1px);
}

.link-separator {
    color: #6B7280;
    font-weight: 300;
    margin: 0 4px;
}

/* Copyright */
.copyright-section {
    text-align: center;
}

.copyright-text {
    font-size: 14px;
    color: #6B7280;
    margin: 0;
    font-weight: 500;
    letter-spacing: 0.5px;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .footer-container {
        padding: 50px 30px 30px;
    }
    
    .disclaimer-block {
        padding: 20px 25px;
    }
}

@media (max-width: 768px) {
    .footer-container {
        padding: 40px 20px 25px;
    }
    
    .logo-placeholder {
        flex-direction: column;
        gap: 10px;
    }
    
    .logo-text {
        flex-direction: column;
        align-items: center;
        gap: 0;
    }
    
    .disclaimer-block {
        padding: 18px 20px;
    }
    
    .disclaimer-text {
        font-size: 12px;
        text-align: left;
    }
    
    .links-container {
        flex-direction: column;
        gap: 15px;
    }
    
    .link-separator {
        display: none;
    }
    
    .footer-link {
        padding: 10px 15px;
        border: 1px solid rgba(168, 85, 247, 0.2);
        border-radius: 8px;
        text-align: center;
        min-width: 140px;
    }
}

@media (max-width: 480px) {
    .footer-logo-section {
        margin-bottom: 35px;
    }
    
    .logo-promptly {
        font-size: 24px;
    }
    
    .logo-ai {
        font-size: 28px;
    }
    
    .disclaimer-content {
        gap: 20px;
    }
    
    .disclaimer-block {
        padding: 15px 18px;
    }
    
    .disclaimer-text {
        font-size: 11px;
    }
    
    .footer-links {
        margin-bottom: 25px;
        padding: 20px 0;
    }
    
    .copyright-text {
        font-size: 13px;
    }
}

/* Print Styles */
@media print {
    .footer-background,
    .footer-glow-effects {
        display: none;
    }
    
    .footer-container {
        background: white;
        color: black;
    }
    
    .disclaimer-text,
    .footer-link,
    .copyright-text {
        color: black;
    }
}
/* Simple Introduction Section Styles */
.intro-section {
    position: relative;
    margin: 0;
    padding: 0;
}

.intro-container {
    position: relative;
    background: #1A0D2F;
    padding: 80px 40px;
    overflow: hidden;
    border-top: 2px solid rgba(168, 85, 247, 0.4);
}

.intro-background {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.intro-grid-pattern {
    position: absolute;
    inset: 0;
    background-image: 
        linear-gradient(rgba(168, 85, 247, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(168, 85, 247, 0.05) 1px, transparent 1px);
    background-size: 50px 50px;
    opacity: 0.4;
}

.intro-glow-effects {
    position: absolute;
    inset: 0;
}

.intro-glow-circle {
    position: absolute;
    border-radius: 50%;
    filter: blur(100px);
    animation: introFloat 8s infinite ease-in-out;
}

.intro-glow-1 {
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(168, 85, 247, 0.1), transparent 70%);
    top: 20%;
    left: -150px;
    animation-delay: 0s;
}

.intro-glow-2 {
    width: 250px;
    height: 250px;
    background: radial-gradient(circle, rgba(59, 130, 246, 0.08), transparent 70%);
    top: 30%;
    right: -125px;
    animation-delay: -4s;
}

@keyframes introFloat {
    0%, 100% { transform: translateY(0px) scale(1); }
    50% { transform: translateY(-20px) scale(1.1); }
}

.intro-content {
    position: relative;
    z-index: 2;
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
}

.intro-header {
    margin-bottom: 60px;
}

.intro-title {
    font-size: clamp(36px, 6vw, 56px);
    font-weight: 900;
    color: #E5E7EB;
    line-height: 1.2;
    margin-bottom: 20px;
    text-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
}

.intro-brand-highlight {
    background: linear-gradient(135deg, #A78BFA, #60A5FA);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.intro-subtitle {
    font-size: 20px;
    color: #D1D5DB;
    margin: 0;
    font-weight: 500;
}

.product-showcase {
    margin-bottom: 60px;
}

.software-box {
    max-width: 350px;
    margin: 0 auto;
}

.software-image {
    width: 350px;
    height: 450px;
    object-fit: cover;
    border-radius: 20px;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.4);
}

.software-placeholder {
    width: 350px;
    height: 450px;
    background: linear-gradient(135deg, rgba(17, 24, 39, 0.9), rgba(31, 41, 55, 0.8));
    border: 2px solid rgba(168, 85, 247, 0.4);
    border-radius: 20px;
    padding: 40px 30px;
    box-shadow: 0 30px 80px rgba(168, 85, 247, 0.2);
    backdrop-filter: blur(10px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
}

.placeholder-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.software-icon {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #A78BFA, #8B5CF6);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 15px 40px rgba(168, 85, 247, 0.4);
}

.software-icon i {
    font-size: 36px;
    color: white;
}

.software-title {
    font-size: 32px;
    font-weight: 900;
    background: linear-gradient(135deg, #A78BFA, #60A5FA);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin: 0;
}

.software-description {
    font-size: 18px;
    color: #D1D5DB;
    margin: 0;
    font-weight: 500;
}

.software-features {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 20px;
}

.feature-tag {
    background: rgba(168, 85, 247, 0.2);
    color: #C084FC;
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 600;
    border: 1px solid rgba(168, 85, 247, 0.3);
}

.buy-now-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 30px;
}

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

.original-price {
    color: #9CA3AF;
    font-size: 16px;
    text-decoration: line-through;
}

.current-price {
    color: #FBBF24;
    font-size: 24px;
    font-weight: 800;
}

.buy-now-button {
    background: linear-gradient(135deg, #10B981, #059669);
    color: white;
    border: none;
    padding: 25px 60px;
    border-radius: 50px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 20px 60px rgba(16, 185, 129, 0.4);
    border: 3px solid #34D399;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    text-align: center;
    min-width: 300px;
    animation: buyButtonPulse 3s infinite ease-in-out;
}

@keyframes buyButtonPulse {
    0%, 100% { 
        transform: scale(1); 
        box-shadow: 0 20px 60px rgba(16, 185, 129, 0.4); 
    }
    50% { 
        transform: scale(1.02); 
        box-shadow: 0 25px 80px rgba(16, 185, 129, 0.6); 
    }
}

.buy-now-button:hover {
    transform: translateY(-3px) scale(1.05);
    box-shadow: 0 30px 100px rgba(16, 185, 129, 0.8);
    background: linear-gradient(135deg, #059669, #047857);
}

.button-icon {
    display: flex;
    align-items: center;
    gap: 12px;
}

.button-icon i {
    font-size: 20px;
}

.button-text {
    font-size: 20px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.button-subtext {
    font-size: 14px;
    font-weight: 500;
    opacity: 0.9;
}

.security-badges {
    display: flex;
    gap: 30px;
    flex-wrap: wrap;
    justify-content: center;
}

.security-item {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #9CA3AF;
    font-size: 14px;
    font-weight: 500;
}

.security-item i {
    color: #10B981;
    font-size: 16px;
}

/* Responsive Design */
@media (max-width: 768px) {
    .intro-container {
        padding: 50px 20px;
    }
    
    .software-placeholder {
        padding: 40px 20px;
    }
    
    .buy-now-button {
        padding: 20px 40px;
        min-width: 280px;
    }
    
    .button-text {
        font-size: 18px;
    }
    
    .security-badges {
        flex-direction: column;
        align-items: center;
        gap: 15px;
    }
}

@media (max-width: 480px) {
    .software-features {
        flex-direction: column;
        align-items: center;
    }
    
    .price-display {
        gap: 5px;
    }
    
    .current-price {
        font-size: 20px;
    }
    
    .buy-now-button {
        min-width: 250px;
        padding: 18px 30px;
    }
}
/* From Desk Section Styles */
.from-desk-section {
    position: relative;
    margin: 0;
    padding: 0;
}

.desk-container {
    position: relative;
    background: #1A0D2F;
    padding: 80px 40px;
    overflow: hidden;
    border-top: 2px solid rgba(168, 85, 247, 0.4);
}

/* Background Effects */
.desk-background {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}

.desk-grid-pattern {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: 
        linear-gradient(rgba(255,255,255,0.02) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,0.02) 1px, transparent 1px);
    background-size: 50px 50px;
    animation: gridMove 20s linear infinite;
}

.desk-glow-effects {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.desk-glow-circle {
    position: absolute;
    border-radius: 50%;
    filter: blur(60px);
    opacity: 0.3;
}

.desk-glow-1 {
    width: 200px;
    height: 200px;
    background: linear-gradient(45deg, #6366F1, #8B5CF6);
    top: 10%;
    left: 10%;
    animation: float 8s ease-in-out infinite;
}

.desk-glow-2 {
    width: 150px;
    height: 150px;
    background: linear-gradient(45deg, #EC4899, #F59E0B);
    top: 60%;
    right: 15%;
    animation: float 10s ease-in-out infinite reverse;
}

.desk-glow-3 {
    width: 180px;
    height: 180px;
    background: linear-gradient(45deg, #10B981, #06B6D4);
    bottom: 20%;
    left: 50%;
    animation: float 12s ease-in-out infinite;
}

/* Content Styles */
.desk-content {
    position: relative;
    z-index: 2;
    max-width: 1000px;
    margin: 0 auto;
}

.desk-header {
    text-align: center;
    margin-bottom: 60px;
}

.desk-title {
    font-size: clamp(42px, 7vw, 64px);
    font-weight: 900;
    margin-bottom: 20px;
    line-height: 1.1;
    text-shadow: 0 6px 12px rgba(0, 0, 0, 0.6);
}

.from-text {
    color: #3B82F6;
}

.the-text {
    color: #8B5CF6;
}

.desk-text {
    color: #EC4899;
}

.of-text {
    color: #F59E0B;
}

.desk-underline {
    width: 150px;
    height: 4px;
    background: linear-gradient(90deg, #3B82F6, #8B5CF6, #EC4899, #F59E0B);
    border-radius: 2px;
    margin: 0 auto;
}

/* Brand Badge */
.brand-badge {
    display: inline-flex;
    align-items: center;
    gap: 15px;
    background: linear-gradient(135deg, rgba(168, 85, 247, 0.15), rgba(139, 92, 246, 0.08));
    border: 2px solid rgba(168, 85, 247, 0.3);
    border-radius: 20px;
    padding: 20px 30px;
    margin-bottom: 50px;
    backdrop-filter: blur(10px);
    box-shadow: 0 10px 40px rgba(168, 85, 247, 0.2);
}

.badge-icon {
    display: flex;
    align-items: center;
    justify-content: center;
}

.icon-square {
    width: 50px;
    height: 50px;
    background: linear-gradient(135deg, #F59E0B, #D97706);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 24px;
    box-shadow: 0 8px 20px rgba(245, 158, 11, 0.4);
}

.badge-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.promptly-text {
    color: #E5E7EB;
    font-size: 24px;
    font-weight: 900;
    line-height: 1;
}

.ai-text {
    background: linear-gradient(135deg, #60A5FA, #22D3EE);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-size: 24px;
    font-weight: 900;
    line-height: 1;
}

/* Greeting */
.greeting-section {
    margin-bottom: 40px;
}

.greeting-title {
    font-size: 36px;
    font-weight: 800;
    color: #E5E7EB;
    margin: 0;
    text-align: center;
}

/* Introduction Paragraphs */
.intro-paragraphs {
    margin-bottom: 50px;
}

.intro-paragraph {
    background: linear-gradient(135deg, rgba(17, 24, 39, 0.7), rgba(31, 41, 55, 0.5));
    border-radius: 15px;
    padding: 25px 30px;
    margin-bottom: 25px;
    border-left: 4px solid rgba(168, 85, 247, 0.5);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.intro-paragraph p {
    font-size: 18px;
    line-height: 1.7;
    color: #D1D5DB;
    margin: 0;
}

/* Market Highlight */
.market-highlight {
    margin-bottom: 40px;
}

.highlight-box {
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.15), rgba(30, 58, 138, 0.08));
    border: 2px solid rgba(59, 130, 246, 0.4);
    border-radius: 20px;
    padding: 30px;
    text-align: center;
    box-shadow: 0 15px 40px rgba(59, 130, 246, 0.2);
}

.market-title {
    font-size: 28px;
    font-weight: 800;
    background: linear-gradient(135deg, #3B82F6, #60A5FA);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin: 0;
}

/* Opportunity Statement */
.opportunity-statement {
    margin-bottom: 60px;
}

.opportunity-box {
    background: linear-gradient(135deg, rgba(251, 191, 36, 0.15), rgba(217, 119, 6, 0.08));
    border: 2px solid rgba(251, 191, 36, 0.4);
    border-radius: 20px;
    padding: 35px 40px;
    text-align: center;
    box-shadow: 0 15px 40px rgba(251, 191, 36, 0.2);
}

.opportunity-title {
    font-size: 24px;
    font-weight: 800;
    color: #E5E7EB;
    margin: 0;
    line-height: 1.4;
}

/* Team Section */
.team-section {
    display: flex;
    justify-content: center;
}

.team-members {
    display: flex;
    gap: 50px;
    flex-wrap: wrap;
    justify-content: center;
}

.team-member {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.member-window {
    background: linear-gradient(135deg, rgba(17, 24, 39, 0.8), rgba(31, 41, 55, 0.6));
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
    width: 220px;
    border: 1px solid rgba(168, 85, 247, 0.3);
    backdrop-filter: blur(10px);
}

.window-header {
    background: linear-gradient(135deg, #3B82F6, #1D4ED8);
    padding: 15px 20px;
}

.window-controls {
    display: flex;
    gap: 10px;
}

.control-dot {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.control-dot.red {
    background: #EF4444;
}

.control-dot.yellow {
    background: #F59E0B;
}

.control-dot.green {
    background: #10B981;
}

.member-content {
	
	padding-left: 20px;
	padding-right: 20px;
	text-align: center;
}

.member-avatar {
    margin-bottom: 20px;
}

.avatar-circle {
    width: 90px;
    height: 90px;
    background: linear-gradient(135deg, #A78BFA, #8B5CF6);
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 36px;
    box-shadow: 0 10px 30px rgba(168, 85, 247, 0.4);
}

.member-label {
    font-size: 16px;
    color: #9CA3AF;
    font-weight: 600;
}

.member-name {
    background: linear-gradient(135deg, #3B82F6, #1D4ED8);
    color: white;
    padding: 12px 25px;
    border-radius: 25px;
    font-weight: 700;
    font-size: 16px;
    box-shadow: 0 8px 20px rgba(59, 130, 246, 0.3);
}

/* Animations */
@keyframes gridMove {
    0% { transform: translate(0, 0); }
    100% { transform: translate(50px, 50px); }
}

@keyframes float {
    0%, 100% { transform: translateY(0px) rotate(0deg); }
    50% { transform: translateY(-20px) rotate(180deg); }
}

/* Responsive */
@media (max-width: 768px) {
    .from-desk-section {
        padding: 60px 0;
    }
    
    .desk-title {
        font-size: 2.5rem;
    }
    
    .greeting-title {
        font-size: 1.5rem;
    }
    
    .intro-paragraph p {
        font-size: 1rem;
    }
    
    .team-members {
        gap: 20px;
    }
    
    .member-window {
        width: 160px;
    }
    
    .avatar-circle {
        width: 60px;
        height: 60px;
        font-size: 1.5rem;
    }
}

@media (max-width: 480px) {
    .desk-title {
        font-size: 2rem;
    }
    
    .brand-badge {
        padding: 12px 20px;
        gap: 12px;
    }
    
    .icon-square {
        width: 35px;
        height: 35px;
        font-size: 1rem;
    }
    
    .promptly-text,
    .ai-text {
        font-size: 1rem;
    }
}