/* ═══════════════════════════════════════════════
   ANORA COPILOT — Enterprise Landing Page v5
   Split CSS — landing.css
   Enhanced Neural Network + Timeline Fix + All Styles
   ═══════════════════════════════════════════════ */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}

:root{
    --bg:#000;--bg-deep:#030308;
    --bg-card:rgba(8,12,20,.65);--bg-card-hover:rgba(12,18,30,.8);
    --primary:#3bdaa6;--primary-rgb:59,218,166;
    --primary-glow:rgba(59,218,166,.12);--primary-intense:rgba(59,218,166,.25);
    --accent:#13a4ff;--accent-rgb:19,164,255;
    --accent2:#9ae8ff;--accent2-rgb:154,232,255;
    --purple:#a855f7;--gold:#fbbf24;--red:#ef4444;
    --text:#fff;--text-secondary:#e2e8f0;--text-dim:#b0bac8;--text-muted:#6b7890;
    --border:rgba(255,255,255,.06);--border-hover:rgba(255,255,255,.12);
    --border-active:rgba(59,218,166,.3);
    --radius:20px;--radius-sm:12px;--radius-xs:8px;
    --ease:cubic-bezier(.16,1,.3,1);
}

html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
body{font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','Inter','Segoe UI',sans-serif;background:var(--bg);color:var(--text);line-height:1.6;overflow-x:hidden}
::selection{background:rgba(59,218,166,.3);color:#fff}

/* ── Scrollbar — KLEYBOR Styling ── */
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:rgba(255,255,255,.02)}
::-webkit-scrollbar-thumb{background:rgba(var(--primary-rgb),.25);border-radius:4px}
::-webkit-scrollbar-thumb:hover{background:rgba(var(--primary-rgb),.4)}
html{scrollbar-color:rgba(59,218,166,.25) rgba(255,255,255,.02);scrollbar-width:thin}

/* ── Global Neural Network Background Canvas — REMOVED (replaced by nerve-strand.js) ── */

/* ── Loader ── */
.loader{position:fixed;inset:0;z-index:10000;background:var(--bg);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:24px;transition:opacity .8s var(--ease),visibility .8s}
.loader.hidden{opacity:0;visibility:hidden;pointer-events:none}
.loader-logo{width:120px;opacity:0;transform:scale(.8);animation:ldIn .6s var(--ease) .2s forwards}
.loader-bar-track{width:200px;height:2px;background:rgba(255,255,255,.06);border-radius:2px;overflow:hidden;opacity:0;animation:ldIn .4s var(--ease) .5s forwards}
.loader-bar{height:100%;width:0%;background:linear-gradient(90deg,var(--primary),var(--accent));border-radius:2px;transition:width .3s}
@keyframes ldIn{to{opacity:1;transform:scale(1)}}

/* ── Cursor glow ── */
.cursor-glow{position:fixed;width:500px;height:500px;border-radius:50%;pointer-events:none;z-index:9999;background:radial-gradient(circle,rgba(var(--primary-rgb),.04) 0%,transparent 70%);will-change:transform}

/* ── Three.js particle canvas — DISABLED (replaced by nerve-strand.js v6) ── */
#hero-canvas{display:none}

/* ── 3D Nerve Strand Canvas ── */
#nerveStrandCanvas{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1;pointer-events:none;
    -webkit-mask-image:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,1) 10%,rgba(0,0,0,1) 90%,transparent 100%);
    mask-image:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,1) 10%,rgba(0,0,0,1) 90%,transparent 100%)}

/* ── Enhanced Background Depth ── */
body::before{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;
    background:
        radial-gradient(ellipse 120% 60% at 50% 0%, rgba(59,218,166,.03) 0%, transparent 50%),
        radial-gradient(ellipse 80% 80% at 20% 80%, rgba(19,164,255,.02) 0%, transparent 50%),
        radial-gradient(ellipse 80% 80% at 80% 60%, rgba(168,85,247,.02) 0%, transparent 50%),
        linear-gradient(180deg, #000 0%, #030308 30%, #050510 60%, #020208 100%)
}
body::after{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;
    background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");
    background-repeat:repeat;
    background-size:128px 128px;
    mix-blend-mode:overlay;
    opacity:0.4
}

/* ── Layout ── */
.page-content{position:relative;z-index:2}
.container{max-width:1240px;margin:0 auto;padding:0 32px}
section{position:relative;overflow:hidden}

/* ── Section Transition Dividers — REMOVED ── */

/* ═══ NAV — Apple Glass Effect ═══ */
.nav{position:fixed;top:0;left:0;right:0;z-index:1000;height:72px;display:flex;align-items:center;padding:0 32px;transition:all .5s var(--ease)}
.nav.scrolled{
    background:rgba(10,10,14,.55);
    backdrop-filter:blur(40px) saturate(200%);
    -webkit-backdrop-filter:blur(40px) saturate(200%);
    border-bottom:1px solid rgba(255,255,255,.08);
    height:64px;
    box-shadow:0 1px 30px rgba(0,0,0,.3)
}
.nav-inner{max-width:1240px;width:100%;margin:0 auto;display:flex;align-items:center;justify-content:space-between}
.nav-logo{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-decoration:none}
.nav-logo img{height:27px;transition:opacity .3s}
.nav-logo-text{font-size:9px;line-height:1;font-weight:600;letter-spacing:4.4px;color:var(--text-dim);text-transform:uppercase;transition:color .3s;margin-left:2px}
.nav.scrolled .nav-logo-text{color:var(--text-secondary)}
.nav-links{display:flex;align-items:center;gap:6px}
.nav-link{color:var(--text-dim);text-decoration:none;font-size:15px;font-weight:500;padding:8px 16px;border-radius:var(--radius-xs);transition:all .25s;letter-spacing:.2px}
.nav-link:hover{color:var(--text);background:rgba(255,255,255,.04)}
.nav-link.active{color:var(--primary);background:rgba(var(--primary-rgb),.08)}
.nav-cta{padding:9px 22px;color:#000;border:none;border-radius:var(--radius-xs);font-size:15px;font-weight:600;cursor:pointer;text-decoration:none;transition:all .3s var(--ease);letter-spacing:.3px;margin-left:8px}
.nav-cta:hover{transform:translateY(-1px);box-shadow:0 4px 20px rgba(var(--primary-rgb),.35)}
.nav-cta-login{background:var(--primary)}
.nav-cta-join{background:transparent;border:1px solid var(--primary);color:var(--primary);margin-left:4px}
.nav-cta-join:hover{background:rgba(var(--primary-rgb),.1);box-shadow:0 4px 20px rgba(var(--primary-rgb),.2)}
.nav-toggle{display:none;background:none;border:none;cursor:pointer;padding:8px;z-index:1001}
.nav-toggle span{display:block;width:24px;height:2px;background:var(--text);margin:6px 0;transition:all .3s;border-radius:2px}
.nav-toggle.active span:nth-child(1){transform:rotate(45deg) translate(5px,6px)}
.nav-toggle.active span:nth-child(2){opacity:0}
.nav-toggle.active span:nth-child(3){transform:rotate(-45deg) translate(5px,-6px)}
.nav-mobile{display:none;position:fixed;inset:0;z-index:999;background:rgba(0,0,0,.96);backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);flex-direction:column;align-items:center;justify-content:center;gap:16px;opacity:0;transition:opacity .4s}
.nav-mobile.open{display:flex;opacity:1}
.nav-mobile a{color:var(--text);text-decoration:none;font-size:20px;font-weight:500;padding:12px 32px;transition:color .2s}
.nav-mobile a:hover{color:var(--primary)}

/* ═══ HERO ═══ */
.hero{min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;text-align:center;padding:72px 0 0;position:relative}
.hero-content{position:relative;z-index:2;max-width:900px;padding:0 32px}
.hero-badge{display:inline-flex;align-items:center;gap:10px;padding:8px 20px;border-radius:100px;background:rgba(var(--primary-rgb),.06);border:1px solid rgba(var(--primary-rgb),.15);font-size:13px;font-weight:500;color:var(--primary);margin-bottom:40px;opacity:0;transform:translateY(20px);letter-spacing:.5px}
.hero-badge-dot{width:6px;height:6px;border-radius:50%;background:var(--primary);animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.5)}}
.hero h1{font-size:clamp(42px,7vw,84px);font-weight:750;line-height:1.05;letter-spacing:-2px;margin-bottom:8px;opacity:0;transform:translateY(40px)}
.gradient-text{background:linear-gradient(135deg,var(--accent2) 0%,var(--primary) 35%,var(--accent) 70%,var(--accent2) 100%);background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gShift 8s ease infinite}
@keyframes gShift{0%,100%{background-position:0% center}50%{background-position:100% center}}
.hero-subtitle{font-size:clamp(16px,2.5vw,21px);color:var(--text-secondary);font-weight:400;margin-bottom:36px;opacity:0;transform:translateY(30px);line-height:1.7;max-width:700px;margin-left:auto;margin-right:auto}
.hero-actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;opacity:0;transform:translateY(30px);padding:0;border-radius:0;background:none;backdrop-filter:none;-webkit-backdrop-filter:none;border:none}
.btn-hero-primary{padding:16px 36px;background:var(--primary);color:#000;border:none;border-radius:var(--radius-sm);font-size:16px;font-weight:650;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:10px;transition:all .35s var(--ease);letter-spacing:.3px;backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%)}
.btn-hero-primary:hover{transform:translateY(-3px);box-shadow:0 12px 40px rgba(var(--primary-rgb),.35)}
.btn-hero-primary svg{width:18px;height:18px;transition:transform .3s}
.btn-hero-primary:hover svg{transform:translateX(3px)}
.btn-hero-secondary{padding:16px 36px;background:rgba(255,255,255,.04);color:var(--text);border:1px solid var(--border-hover);border-radius:var(--radius-sm);font-size:16px;font-weight:500;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:10px;transition:all .35s var(--ease);backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%)}
.btn-hero-secondary:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2);transform:translateY(-2px)}
.btn-hero-outline{padding:16px 36px;background:rgba(0,0,0,.25);color:var(--primary);border:1px solid var(--primary);border-radius:var(--radius-sm);font-size:16px;font-weight:600;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:10px;transition:all .35s var(--ease);letter-spacing:.3px;backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%)}
.btn-hero-outline:hover{background:rgba(var(--primary-rgb),.1);transform:translateY(-2px);box-shadow:0 8px 30px rgba(var(--primary-rgb),.2)}
.hero-scroll{position:absolute;bottom:40px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;opacity:0;animation:fadeUp .6s var(--ease) 2s forwards}
.hero-scroll span{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--text-muted)}
.scroll-line{width:1px;height:40px;background:linear-gradient(to bottom,var(--primary),transparent);animation:sPulse 2s ease infinite}
@keyframes sPulse{0%,100%{opacity:.3;transform:scaleY(.6)}50%{opacity:1;transform:scaleY(1)}}
@keyframes fadeUp{from{opacity:0;transform:translate(-50%,20px)}to{opacity:1;transform:translate(-50%,0)}}

/* ═══ STATS ═══ */
.stats-bar{padding:80px 0;border-bottom:none}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:32px}
.stat-item{text-align:center;opacity:0;transform:translateY(30px)}
.stat-number{font-size:clamp(32px,4vw,52px);font-weight:750;letter-spacing:-1px;line-height:1.2}
.stat-number .accent{background:linear-gradient(135deg,var(--primary),var(--accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.stat-label{font-size:13px;color:var(--text-muted);margin-top:6px;font-weight:500;letter-spacing:.5px}

/* ═══ PROBLEM / SOLUTION ═══ */
.problem-section{padding:140px 0}
.problem-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.problem-text{opacity:0;transform:translateX(-40px)}
.section-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:var(--primary);margin-bottom:16px}
.section-eyebrow::before{content:'';width:24px;height:1px;background:var(--primary)}
.problem-text h2{font-size:clamp(28px,3.5vw,46px);font-weight:700;line-height:1.15;letter-spacing:-1px;margin-bottom:20px;color:#fff}
.problem-text p{font-size:17px;color:var(--text-secondary);line-height:1.8;margin-bottom:16px}
.problem-visual{opacity:0;transform:translateX(40px)}
.pain-points{list-style:none;display:flex;flex-direction:column;gap:14px}
.pain-point{display:flex;align-items:center;gap:16px;padding:18px 24px;background:rgba(8,12,20,.45);backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);border:1px solid var(--border);border-radius:var(--radius-sm);transition:all .3s}
.pain-point:hover{border-color:var(--border-active);transform:translateX(4px)}
.pain-icon{flex-shrink:0;width:42px;height:42px;border-radius:11px;display:flex;align-items:center;justify-content:center}
.pain-icon svg{width:20px;height:20px}
.pain-point h4{font-size:15px;font-weight:600;margin-bottom:2px;color:#fff}
.pain-point p{font-size:13px;color:var(--text-dim);line-height:1.5}

/* ═══ FEATURES (Desktop Grid / Mobile Swipe) ═══ */
.features-section{padding:140px 0 80px}
.features-header{text-align:center;margin-bottom:80px;opacity:0;transform:translateY(40px)}
.features-header h2{font-size:clamp(30px,4vw,52px);font-weight:750;letter-spacing:-1.5px;line-height:1.15;margin-bottom:20px}
.features-header p{font-size:18px;color:var(--text-dim);max-width:600px;margin:0 auto;line-height:1.7}
.features-scroll-wrap{position:relative;overflow:visible;display:block;min-height:0}
.features-track{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;max-width:1240px;margin:0 auto;padding:0 32px;align-items:stretch}
.feature-card{min-width:0;height:100%;background:rgba(8,12,20,.45);backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);border:1px solid var(--border);border-radius:var(--radius);padding:40px 36px;position:relative;overflow:hidden;transition:all .4s var(--ease);cursor:default}
.feature-card::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--primary),transparent);opacity:0;transition:opacity .4s}
.feature-card::after{content:'';position:absolute;inset:0;border-radius:var(--radius);background:radial-gradient(300px circle at var(--mx,50%) var(--my,50%),rgba(var(--primary-rgb),.06),transparent);opacity:0;transition:opacity .4s;pointer-events:none}
.feature-card:hover{border-color:var(--border-hover);transform:translateY(-8px);box-shadow:0 20px 60px rgba(0,0,0,.4)}
.feature-card:hover::before{opacity:1}
.feature-card:hover::after{opacity:1}
.feature-icon-wrap{width:56px;height:56px;border-radius:14px;display:flex;align-items:center;justify-content:center;margin-bottom:24px;position:relative}
.feature-icon-wrap::after{content:'';position:absolute;inset:-4px;border-radius:18px;background:inherit;opacity:.15;filter:blur(12px)}
.feature-card h3{font-size:20px;font-weight:650;margin-bottom:12px;letter-spacing:-.3px;color:#fff}
.feature-card p{font-size:14px;color:var(--text-secondary);line-height:1.7;margin-bottom:20px}
.feature-tag{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:100px;font-size:11px;font-weight:600;letter-spacing:.5px}
.tag-live{background:rgba(var(--primary-rgb),.12);color:var(--primary)}
.tag-new{background:rgba(251,191,36,.12);color:var(--gold)}
.tag-ai{background:rgba(var(--accent-rgb),.12);color:var(--accent)}

/* ═══ SEO DATA CENTER ═══ */
.seo-section{padding:140px 0;position:relative}
.seo-section::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 600px 400px at 30% 50%,rgba(var(--primary-rgb),.04),transparent),radial-gradient(ellipse 400px 600px at 70% 50%,rgba(var(--accent-rgb),.03),transparent);pointer-events:none}
.seo-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:80px;align-items:center}
.seo-text{opacity:0;transform:translateX(-40px)}
.seo-text h2{font-size:clamp(28px,3.5vw,46px);font-weight:700;line-height:1.15;letter-spacing:-1px;margin-bottom:20px}
.seo-text p{font-size:16px;color:var(--text-secondary);line-height:1.8;margin-bottom:16px}
.seo-features-list{list-style:none;display:flex;flex-direction:column;gap:14px;margin-top:28px}
.seo-features-list li{display:flex;align-items:center;gap:12px;font-size:15px;color:var(--text-secondary)}
.seo-check{flex-shrink:0;width:22px;height:22px;border-radius:50%;background:rgba(var(--primary-rgb),.12);display:flex;align-items:center;justify-content:center;color:var(--primary)}
.seo-check svg{width:12px;height:12px}
.seo-dashboard-wrap{position:relative;opacity:0;transform:translateX(40px) perspective(1000px) rotateY(-5deg)}
.seo-3d-canvas{display:none}
.seo-dashboard{background:rgba(8,12,20,.5);backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);border:1px solid var(--border);border-radius:var(--radius);padding:32px;position:relative;overflow:hidden;z-index:1}
.seo-dashboard::before{content:'';position:absolute;top:-1px;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--primary),var(--accent),var(--primary));background-size:200% auto;animation:gShift 3s ease infinite}
.seo-dash-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px;padding-bottom:16px;border-bottom:1px solid var(--border)}
.seo-dash-title{font-size:14px;font-weight:600;color:var(--text-secondary)}
.seo-dash-live{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:600;color:var(--primary);letter-spacing:1px;text-transform:uppercase}
.seo-dash-live::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--primary);animation:pulse 2s infinite}
.seo-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:24px}
.seo-metric{background:rgba(255,255,255,.03);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--border);border-radius:var(--radius-sm);padding:16px;text-align:center}
.seo-metric-value{font-size:24px;font-weight:700;margin-bottom:4px}
.seo-metric-value.up{color:var(--primary)}.seo-metric-value.neutral{color:var(--accent)}
.seo-metric-label{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}
.seo-chart{width:100%;height:120px;margin-bottom:24px}
.seo-chart-line{fill:none;stroke:var(--primary);stroke-width:2;stroke-linecap:round;stroke-dasharray:500;stroke-dashoffset:500}
.seo-chart-line.animated{stroke-dashoffset:0;transition:stroke-dashoffset 2s var(--ease)}
.seo-chart-area{fill:url(#seoGrad);opacity:0;transition:opacity 1s .5s}
.seo-chart-area.animated{opacity:1}
.seo-alerts{display:flex;flex-direction:column;gap:10px}
.seo-alert{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:var(--radius-xs);font-size:12px;font-weight:500;opacity:0;transform:translateX(20px)}
.seo-alert.animated{opacity:1;transform:translateX(0);transition:all .5s var(--ease)}
.seo-alert-dot{flex-shrink:0;width:8px;height:8px;border-radius:50%}
.alert-success{background:rgba(var(--primary-rgb),.08);color:var(--primary)}
.alert-success .seo-alert-dot{background:var(--primary)}
.alert-warning{background:rgba(251,191,36,.08);color:var(--gold)}
.alert-warning .seo-alert-dot{background:var(--gold)}
.alert-info{background:rgba(var(--accent-rgb),.08);color:var(--accent)}
.alert-info .seo-alert-dot{background:var(--accent)}

/* ═══ WORKFLOW TIMELINE — FIXED: nodes vertically centered to cards ═══ */
.workflow-section{padding:140px 0}
.workflow-header{text-align:center;margin-bottom:80px;opacity:0;transform:translateY(40px)}
.workflow-header h2{font-size:clamp(30px,4vw,52px);font-weight:750;letter-spacing:-1.5px;line-height:1.15;margin-bottom:20px}
.workflow-header p{font-size:18px;color:var(--text-dim);max-width:550px;margin:0 auto}
.timeline{position:relative;max-width:900px;margin:0 auto}
.timeline::before{content:'';position:absolute;left:50%;transform:translateX(-50%);top:0;bottom:0;width:2px;background:var(--border);z-index:0}
.timeline-progress{position:absolute;left:50%;transform:translateX(-50%);top:0;width:2px;height:0%;background:linear-gradient(to bottom,var(--primary),var(--accent));z-index:1;pointer-events:none}
/* KEY FIX: align-items:center makes node vertically centered to card */
.timeline-step{display:grid;grid-template-columns:1fr 48px 1fr;gap:0;align-items:center;margin-bottom:80px;position:relative;opacity:0}
.timeline-step:last-child{margin-bottom:0}
.timeline-content{padding:32px 36px;background:rgba(8,12,20,.45);backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);border:1px solid var(--border);border-radius:var(--radius);transition:all .4s;position:relative;z-index:3}
.timeline-content:hover{border-color:var(--border-hover);transform:translateY(-4px)}
/* Odd steps: content LEFT, node CENTER, empty RIGHT */
.timeline-step:nth-child(odd) .timeline-content{grid-column:1;grid-row:1}
.timeline-step:nth-child(odd) .timeline-node{grid-column:2;grid-row:1}
/* Even steps: empty LEFT, node CENTER, content RIGHT */
.timeline-step:nth-child(even)::before{content:'';grid-column:1;grid-row:1}
.timeline-step:nth-child(even) .timeline-node{grid-column:2;grid-row:1}
.timeline-step:nth-child(even) .timeline-content{grid-column:3;grid-row:1}
/* Node: no margin-top, rely on align-items:center for vertical centering */
.timeline-node{justify-self:center;align-self:center;width:48px;height:48px;border-radius:50%;background:var(--bg);border:2px solid var(--border);display:flex;align-items:center;justify-content:center;z-index:4;font-weight:700;font-size:18px;color:var(--text-muted);transition:all .5s var(--ease);position:relative;flex-shrink:0}
.timeline-step.active .timeline-node{background:linear-gradient(135deg,var(--primary),var(--accent));border-color:transparent;color:#000;box-shadow:0 0 30px rgba(var(--primary-rgb),.3)}
.timeline-step-num{font-size:12px;font-weight:700;color:var(--primary);letter-spacing:2px;text-transform:uppercase;margin-bottom:8px}
.timeline-content h4{font-size:20px;font-weight:650;margin-bottom:10px;letter-spacing:-.3px;color:#fff}
.timeline-content p{font-size:14px;color:var(--text-secondary);line-height:1.7}

/* ═══ N.O.A.H ═══ */
.noah-section{padding:140px 0;text-align:center;position:relative;overflow:visible;z-index:2}
.noah-section::before{content:'';position:absolute;inset:0;background:
    radial-gradient(ellipse 800px 600px at 50% 50%,rgba(168,85,247,.06),transparent),
    radial-gradient(ellipse 600px 400px at 30% 60%,rgba(59,218,166,.04),transparent);
    pointer-events:none}
.noah-header{margin-bottom:80px;opacity:0;transform:translateY(40px)}
.noah-header h2{font-size:clamp(30px,4vw,52px);font-weight:750;letter-spacing:-1.5px;line-height:1.15;margin-bottom:20px}
.noah-header p{font-size:18px;color:var(--text-secondary);max-width:660px;margin:0 auto;line-height:1.7}
.noah-brain-wrap{position:relative;width:560px;height:560px;margin:0 auto 80px;z-index:3}
.noah-brain-inner{position:absolute;inset:0;border-radius:50%;overflow:hidden;filter:drop-shadow(0 0 40px rgba(var(--primary-rgb),.15))}
.noah-brain-inner svg{width:100%;height:100%;animation:noahSpin 60s linear infinite}
@keyframes noahSpin{to{transform:rotate(360deg)}}
.noah-label{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;z-index:2;pointer-events:none}
.noah-label h3{font-size:44px;font-weight:800;letter-spacing:4px;background:linear-gradient(135deg,var(--accent2),var(--primary),var(--accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;background-size:200% auto;animation:gShift 5s ease infinite;text-shadow:0 0 60px rgba(var(--primary-rgb),.3)}
.noah-label p{font-size:12px;letter-spacing:4px;color:var(--text-dim);text-transform:uppercase;margin-top:6px}
.noah-ring{position:absolute;inset:-30px;border-radius:50%;border:1px solid rgba(var(--primary-rgb),.12);animation:spin 40s linear infinite;box-shadow:0 0 60px rgba(var(--primary-rgb),.04)}
.noah-ring-2{inset:-65px;animation-duration:30s;animation-direction:reverse;border-color:rgba(var(--accent-rgb),.08)}
.noah-ring-3{position:absolute;inset:-100px;border-radius:50%;border:1px solid rgba(var(--primary-rgb),.05);animation:spin 50s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes noahPulse{0%,100%{filter:drop-shadow(0 0 40px rgba(var(--primary-rgb),.15))}50%{filter:drop-shadow(0 0 80px rgba(var(--primary-rgb),.3))}}
.noah-brain-inner{animation:noahPulse 4s ease infinite}
.noah-node{position:absolute;padding:10px 20px;background:rgba(8,12,20,.5);backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);border:1px solid var(--border);border-radius:100px;font-size:13px;font-weight:600;white-space:nowrap;z-index:3;opacity:0;display:flex;align-items:center;gap:8px;transition:opacity .4s var(--ease),border-color .4s var(--ease);pointer-events:none}
.noah-node svg{width:16px;height:16px;opacity:.7}
.nn1{top:-6%;left:50%;transform:translateX(-50%)}
.nn2{top:14%;right:-18%;transform:translateX(0)}
.nn3{bottom:14%;right:-18%;transform:translateX(0)}
.nn4{bottom:-6%;left:50%;transform:translateX(-50%)}
.nn5{top:14%;left:-18%;transform:translateX(0)}
.nn6{bottom:14%;left:-18%;transform:translateX(0)}
.noah-capabilities{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:960px;margin:0 auto}
.noah-cap-card{background:rgba(8,12,20,.45);backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);border:1px solid var(--border);border-radius:var(--radius-sm);padding:28px;text-align:left;opacity:0;transform:translateY(30px);transition:all .4s}
.noah-cap-card:hover{border-color:var(--border-hover)}
.noah-cap-card .cap-icon{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.noah-cap-card .cap-icon svg{width:20px;height:20px;color:var(--primary)}
.noah-cap-card h4{font-size:16px;font-weight:650;margin-bottom:8px;color:#fff}
.noah-cap-card p{font-size:13px;color:var(--text-secondary);line-height:1.7}

/* ═══ CTA ═══ */
.cta-section{padding:160px 0;text-align:center;position:relative}
.cta-section::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 600px 300px at 50% 60%,rgba(var(--primary-rgb),.06),transparent),radial-gradient(ellipse 400px 400px at 30% 40%,rgba(var(--accent-rgb),.03),transparent);pointer-events:none}
.cta-content{max-width:700px;margin:0 auto;position:relative;z-index:1;opacity:0;transform:translateY(40px)}
.cta-content h2{font-size:clamp(32px,5vw,56px);font-weight:750;letter-spacing:-1.5px;line-height:1.15;margin-bottom:20px}
.cta-content p{font-size:18px;color:var(--text-secondary);margin-bottom:40px;line-height:1.7}
.cta-buttons{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}

/* ═══ FOOTER ═══ */
.privacy-section{padding:32px 0;border-top:1px solid var(--border)}
.privacy-links{display:flex;gap:32px;justify-content:center;flex-wrap:wrap}
.privacy-links a{color:var(--text-muted);font-size:13px;text-decoration:none;transition:color .2s}
.privacy-links a:hover{color:var(--text-dim)}
footer{padding:48px 0 40px;border-top:1px solid var(--border);text-align:center}
.footer-inner{display:flex;flex-direction:column;align-items:center;gap:16px}
.footer-logo{display:flex;align-items:center;gap:12px}
.footer-logo img{height:20px;opacity:.5}
.footer-logo span{font-size:10px;letter-spacing:4px;color:var(--text-muted);text-transform:uppercase}
footer p{font-size:13px;color:var(--text-muted)}
.footer-legal-line{max-width:780px;line-height:1.7}

/* ═══ RESPONSIVE ═══ */
@media(max-width:1024px){
    .problem-grid,.seo-grid{grid-template-columns:1fr;gap:60px}
    .seo-dashboard-wrap{transform:none!important}
    .noah-brain-wrap{width:440px;height:440px}
    .noah-capabilities{grid-template-columns:1fr 1fr}
    .timeline::before,.timeline-progress{left:24px}
    .timeline-step,.timeline-step:nth-child(even){display:flex;flex-direction:row;align-items:flex-start;padding-left:0}
    .timeline-step:nth-child(odd) .timeline-content,.timeline-step:nth-child(even) .timeline-content{grid-column:unset;margin-left:24px;flex:1}
    .timeline-step:nth-child(odd)::after,.timeline-step:nth-child(even)::before{display:none}
    .timeline-node{position:absolute;left:24px;top:50%;transform:translate(-50%,-50%);flex-shrink:0;grid-column:unset}
}
@media(max-width:900px){
    .features-scroll-wrap{display:flex;align-items:center}
    .features-track{display:flex;max-width:none;margin:0;overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;padding:0 32px 20px}
    .feature-card{flex:0 0 320px;height:auto;scroll-snap-align:start}
}
@media(max-width:768px){
    .container{padding:0 20px}.nav{padding:0 20px}
    .nav-logo{gap:2px}
    .nav-logo img{height:22px}
    .nav-logo-text{font-size:7.5px;letter-spacing:3.2px;margin-left:1px}
    .nav-links{display:none}.nav-toggle{display:block}
    .stats-grid{grid-template-columns:repeat(2,1fr);gap:24px}
    .seo-metrics{grid-template-columns:repeat(2,1fr)}
    .noah-brain-wrap{width:360px;height:360px}
    .noah-node{font-size:11px;padding:8px 14px}
    .nn2,.nn3{right:-6%}.nn5,.nn6{left:-8%}
    .noah-capabilities{grid-template-columns:1fr}
    .feature-card{flex:0 0 300px;padding:32px 28px}
    .cta-section{padding:100px 0}
    .hero h1{font-size:clamp(32px,9.5vw,52px);letter-spacing:-1px;white-space:nowrap}
}
@media(max-width:480px){
    .nav-logo img{height:20px}
    .nav-logo-text{font-size:7px;letter-spacing:2.9px}
    .stats-grid{grid-template-columns:1fr 1fr}
    .seo-metrics{grid-template-columns:1fr}
    .hero-actions{flex-direction:column;align-items:center}
    .btn-hero-primary,.btn-hero-secondary,.btn-hero-outline{width:100%;justify-content:center}
    .noah-brain-wrap{width:280px;height:280px}
    .noah-node{font-size:10px;padding:6px 12px}
    .noah-label h3{font-size:28px}
    .cta-buttons{flex-direction:column;align-items:center}
    .cta-buttons a{width:100%;justify-content:center}
}
/* ── Neural BG mask — REMOVED ── */

/* ═══ DEPTH GALLERY — Pinned Atmospheric Gallery ═══ */
.showcase-section{position:relative;overflow:visible;padding:100px 0 0;background:transparent}
.showcase-section::before{content:'';position:absolute;inset:0;background:none;pointer-events:none}
.showcase-header{text-align:center;margin-bottom:40px;opacity:0;transform:translateY(40px)}
.showcase-header h2{font-size:clamp(30px,4vw,52px);font-weight:750;letter-spacing:-1.5px;line-height:1.15;margin-bottom:20px}
.showcase-header p{font-size:18px;color:var(--text-dim);max-width:600px;margin:0 auto;line-height:1.7}

/* The gallery outer wrapper — always 100vh */
.depth-gallery-wrap{position:relative;width:100vw;margin-left:calc(-50vw + 50%);height:100vh;overflow:hidden;cursor:default;background:transparent}

/* Fade masks — REMOVED (was creating visible dark bars over helix) */
.depth-gallery-wrap::before,.depth-gallery-wrap::after{display:none}

.depth-gallery-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;touch-action:none;background:transparent}

/* ── Magnetic Orb ── */
.dg-magnet-orb{position:absolute;z-index:25;pointer-events:none;display:flex;align-items:center;justify-content:center;width:120px;height:120px;right:300px;left:auto;top:50%;transform:translateY(-50%);transition:opacity .5s ease,transform .3s ease}
.dg-magnet-ring{position:absolute;inset:0;border-radius:50%;border:1.5px solid rgba(var(--primary-rgb),.55);animation:dgOrbPulse 3s ease-in-out infinite}
.dg-magnet-ring--inner{inset:14px;border-color:rgba(var(--primary-rgb),.35);animation-delay:-.8s;animation-duration:2.4s}
.dg-magnet-text{position:relative;font-size:9px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,.8);text-align:center;line-height:1.4;max-width:90px;transition:color .3s ease,transform .2s ease}
@keyframes dgOrbPulse{0%,100%{transform:scale(1);opacity:.85}50%{transform:scale(1.12);opacity:1}}

/* Locked state */
.dg-magnet-orb.dg-locked .dg-magnet-ring{border-color:rgba(var(--primary-rgb),.85);box-shadow:0 0 32px rgba(var(--primary-rgb),.25),inset 0 0 16px rgba(var(--primary-rgb),.12);animation:none}
.dg-magnet-orb.dg-locked .dg-magnet-ring--inner{border-color:rgba(var(--primary-rgb),.4)}
.dg-magnet-orb.dg-locked .dg-magnet-text{color:rgba(var(--primary-rgb),.9)}

/* Hidden when gallery not visible */
.dg-magnet-orb.dg-hidden{opacity:0;pointer-events:none}

/* Label overlay */
.depth-gallery-label{position:absolute;left:0;right:0;bottom:0;z-index:10;pointer-events:none;display:flex;justify-content:space-between;align-items:flex-end;padding:40px 48px;transition:opacity .4s ease;opacity:0}
.depth-gallery-label.visible{opacity:1}
.dg-label-left{display:flex;flex-direction:column;gap:6px}
.dg-label-index{margin:0;font-size:10px;font-weight:600;letter-spacing:3px;color:rgba(255,255,255,.5);text-transform:uppercase;font-family:'SF Mono',SFMono-Regular,Menlo,Monaco,Consolas,monospace}
.dg-label-word{margin:0;font-size:clamp(14px,1.8vw,22px);font-weight:700;color:rgba(255,255,255,.9);letter-spacing:1px;text-transform:uppercase}
.dg-label-right{text-align:right}
.dg-label-hint{margin:0;font-size:10px;font-weight:500;letter-spacing:2px;color:rgba(255,255,255,.35);text-transform:uppercase}

/* Cursor style when locked */
.depth-gallery-wrap.dg-hovering{cursor:grab}
.depth-gallery-wrap.dg-hovering:active{cursor:grabbing}

@media(max-width:768px){
    .depth-gallery-wrap::before,.depth-gallery-wrap::after{display:none}
    .depth-gallery-label{padding:24px}
    .dg-label-word{font-size:14px}
    .dg-magnet-orb{right:auto;left:50%;top:auto;bottom:28px;transform:translateX(-50%);pointer-events:auto;width:64px;height:64px}
    .dg-magnet-ring{border-width:1px}
    .dg-magnet-ring--inner{inset:8px}
    .dg-magnet-text{font-size:0;max-width:none;display:flex;align-items:center;justify-content:center}
    .dg-swipe-icon{width:22px;height:22px;opacity:.85}
    .dg-magnet-orb.dg-locked .dg-swipe-icon{stroke:rgba(var(--primary-rgb),.95)}
}
@media(max-width:480px){
    .depth-gallery-label{padding:16px}
    .dg-magnet-orb{bottom:22px;width:56px;height:56px}
    .dg-magnet-ring--inner{inset:6px}
    .dg-swipe-icon{width:20px;height:20px}
}

.no-scroll{overflow:hidden}