/* ============================================
   JOURNEYOS AI — Landing Page Styles
   ============================================ */

/* --- Navigation --- */
.landing-nav{position:fixed;top:0;left:0;right:0;z-index:var(--z-sticky);padding:var(--space-4) 0;transition:all var(--transition-base);background:transparent;}
.landing-nav.scrolled{background:rgba(11,16,32,0.9);backdrop-filter:var(--glass-blur);border-bottom:var(--border-subtle);}
.logo{display:flex;align-items:center;gap:var(--space-2);font-family:var(--font-display);font-weight:var(--font-bold);font-size:var(--text-xl);color:var(--text-primary);text-decoration:none;}
.logo-icon{font-size:var(--text-2xl);filter:drop-shadow(0 0 8px var(--accent-cyan-glow));}
.logo-badge{font-size:var(--text-xs);background:var(--gradient-cyan);color:var(--bg-primary);padding:2px 8px;border-radius:var(--radius-full);font-weight:var(--font-bold);letter-spacing:0.05em;}
.nav-links{display:flex;gap:var(--space-8);}
.nav-links a{color:var(--text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);transition:color var(--transition-fast);}
.nav-links a:hover{color:var(--text-primary);}
.nav-actions{display:flex;gap:var(--space-3);}
.mobile-menu-btn{display:none;flex-direction:column;gap:5px;background:none;border:none;padding:8px;}
.mobile-menu-btn span{width:24px;height:2px;background:var(--text-primary);transition:all var(--transition-fast);border-radius:2px;}

/* --- Hero --- */
.hero{min-height:100vh;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;padding-top:80px;}
.hero-bg{position:absolute;inset:0;z-index:0;}
.hero-gradient{position:absolute;inset:0;background:var(--gradient-hero);}
.hero-orb{position:absolute;border-radius:50%;filter:blur(80px);opacity:0.4;animation:float 8s ease-in-out infinite;}
.hero-orb-1{width:400px;height:400px;background:var(--accent-cyan);top:-100px;right:-100px;animation-delay:0s;}
.hero-orb-2{width:350px;height:350px;background:var(--accent-purple);bottom:-100px;left:-50px;animation-delay:2s;}
.hero-orb-3{width:250px;height:250px;background:var(--accent-orange);top:50%;left:60%;animation-delay:4s;opacity:0.2;}
.particles{position:absolute;inset:0;overflow:hidden;}
.particle{position:absolute;width:3px;height:3px;background:var(--accent-cyan);border-radius:50%;opacity:0;animation:particleFloat 8s linear infinite;}

.hero-content{position:relative;z-index:1;text-align:center;max-width:900px;}
.hero-badge{display:inline-flex;align-items:center;gap:var(--space-2);background:var(--bg-glass);backdrop-filter:var(--glass-blur);border:var(--border-subtle);border-radius:var(--radius-full);padding:var(--space-2) var(--space-5);font-size:var(--text-sm);color:var(--text-secondary);margin-bottom:var(--space-6);}
.pulse-dot{width:8px;height:8px;background:var(--accent-green);border-radius:50%;animation:pulse 2s ease-in-out infinite;}
.hero-title{font-size:clamp(2.5rem, 6vw, var(--text-7xl));font-weight:var(--font-extrabold);line-height:1.1;letter-spacing:-0.03em;}
.hero-subtitle{font-size:var(--text-xl);color:var(--text-secondary);max-width:650px;margin:var(--space-6) auto 0;line-height:var(--leading-relaxed);}
.hero-cta{display:flex;gap:var(--space-4);justify-content:center;margin-top:var(--space-10);}
.hero-stats{display:flex;align-items:center;justify-content:center;gap:var(--space-8);margin-top:var(--space-12);}
.stat{text-align:center;}
.stat-num{font-family:var(--font-display);font-size:var(--text-3xl);font-weight:var(--font-bold);color:var(--text-primary);display:block;}
.stat-label{font-size:var(--text-sm);color:var(--text-tertiary);margin-top:var(--space-1);}
.stat-divider{width:1px;height:40px;background:var(--bg-elevated);}
.hero-scroll-indicator{position:absolute;bottom:var(--space-8);left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:var(--space-2);color:var(--text-muted);font-size:var(--text-xs);animation:fadeIn 1s ease 1.5s forwards;opacity:0;}
.scroll-mouse{width:24px;height:38px;border:2px solid var(--text-muted);border-radius:12px;position:relative;}
.scroll-dot{width:4px;height:8px;background:var(--accent-cyan);border-radius:4px;position:absolute;top:6px;left:50%;transform:translateX(-50%);animation:fadeInDown 1.5s ease-in-out infinite;}

/* --- Sections --- */
.section{padding:var(--space-32) 0;}
.section-header{max-width:600px;margin:0 auto;}
.section-tag{text-transform:uppercase;letter-spacing:0.1em;font-size:var(--text-xs);}
.section-desc{color:var(--text-secondary);font-size:var(--text-lg);}
.mt-12{margin-top:var(--space-12);}

/* --- Features Grid --- */
.features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-6);}
.feature-card{text-align:center;padding:var(--space-8) var(--space-6);}
.feature-icon{width:56px;height:56px;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;font-size:var(--text-2xl);margin:0 auto var(--space-5);}
.feature-card h4{margin-bottom:var(--space-3);}
.feature-card p{color:var(--text-secondary);font-size:var(--text-sm);line-height:var(--leading-relaxed);}

/* --- Mood Section --- */
.mood-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-3);}
.mood-btn{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);padding:var(--space-4) var(--space-5);background:var(--bg-glass);border:var(--border-subtle);border-radius:var(--radius-xl);color:var(--text-secondary);cursor:pointer;transition:all var(--transition-base);min-width:110px;}
.mood-btn:hover,.mood-btn.active{border-color:var(--mood-color);color:var(--mood-color);box-shadow:0 0 20px color-mix(in srgb, var(--mood-color) 30%, transparent);transform:translateY(-3px);}
.mood-emoji{font-size:var(--text-2xl);}
.mood-label{font-size:var(--text-xs);font-weight:var(--font-semibold);}
.mood-preview{max-width:700px;margin:var(--space-8) auto 0;}
.mood-preview-header{display:flex;align-items:center;justify-content:space-between;}
.mood-demo-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4);}
.mood-demo-card{background:var(--bg-glass);border:var(--border-subtle);border-radius:var(--radius-lg);padding:var(--space-5);text-align:center;transition:all var(--transition-base);}
.mood-demo-card span{font-size:var(--text-3xl);display:block;margin-bottom:var(--space-2);}
.mood-demo-card p{font-size:var(--text-sm);color:var(--text-secondary);}

/* --- Simulation Section --- */
.sim-metrics{display:flex;flex-direction:column;gap:var(--space-5);}
.sim-metric{display:flex;align-items:center;gap:var(--space-4);}
.sim-icon{font-size:var(--text-2xl);width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--bg-glass);border-radius:var(--radius-lg);border:var(--border-subtle);}
.sim-metric strong{font-size:var(--text-sm);color:var(--text-secondary);display:block;margin-bottom:var(--space-2);}
.sim-bar{width:200px;height:6px;background:var(--bg-elevated);border-radius:var(--radius-full);overflow:hidden;}
.sim-fill{height:100%;border-radius:var(--radius-full);transition:width 1.5s ease;}
.sim-card{text-align:center;padding:var(--space-10);}
.sim-score-ring{position:relative;width:160px;height:160px;margin:0 auto;}
.score-svg{width:100%;height:100%;}
.score-text{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.score-num{font-family:var(--font-display);font-size:var(--text-4xl);font-weight:var(--font-bold);background:var(--gradient-cyan);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.score-label{font-size:var(--text-xs);color:var(--text-tertiary);text-transform:uppercase;letter-spacing:0.1em;}
.sim-suggestions{text-align:left;}
.sim-suggestion{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--bg-glass);border-radius:var(--radius-lg);margin-bottom:var(--space-3);font-size:var(--text-sm);color:var(--text-secondary);border:var(--border-subtle);}

/* --- Collaboration --- */
.collab-features{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-6);}
.collab-card{text-align:center;padding:var(--space-8) var(--space-4);}
.collab-icon{font-size:var(--text-4xl);margin-bottom:var(--space-4);}
.collab-card h5{margin-bottom:var(--space-2);}
.collab-card p{color:var(--text-tertiary);font-size:var(--text-sm);}

/* --- CTA --- */
.cta-section{padding:var(--space-16) 0 var(--space-24);}
.cta-card{padding:var(--space-16) var(--space-8);border:var(--border-glow-cyan);position:relative;overflow:hidden;}
.cta-card::before{content:'';position:absolute;inset:0;background:var(--gradient-glow);opacity:0.3;pointer-events:none;}

/* --- Footer --- */
.landing-footer{border-top:var(--border-subtle);padding:var(--space-8) 0;}
.footer-top{flex-wrap:wrap;gap:var(--space-4);}

/* --- Responsive --- */
@media(max-width:1024px){
  .features-grid{grid-template-columns:repeat(2,1fr);}
  .collab-features{grid-template-columns:repeat(2,1fr);}
  .simulation-section .grid{grid-template-columns:1fr!important;}
}
@media(max-width:768px){
  .nav-links,.nav-actions{display:none;}
  .mobile-menu-btn{display:flex;}
  .features-grid,.mood-demo-cards{grid-template-columns:1fr;}
  .collab-features{grid-template-columns:1fr;}
  .hero-title{font-size:var(--text-4xl);}
  .hero-subtitle{font-size:var(--text-base);}
  .hero-cta{flex-direction:column;align-items:center;}
  .hero-stats{flex-direction:column;gap:var(--space-4);}
  .stat-divider{width:40px;height:1px;}
  .mood-grid{gap:var(--space-2);}
  .mood-btn{min-width:80px;padding:var(--space-3);}
}