*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-font-smoothing:antialiased;scroll-behavior:smooth}
body{font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;background:#f4f7fb;color:#1e293b;overflow-x:hidden}
h1,h2,h3,h4{font-family:'Syne',sans-serif}
a{text-decoration:none;color:inherit}
.wrap{max-width:1160px;margin:0 auto;padding:0 24px}
img{max-width:100%;display:block}

/* Typography */
h1,h2,h3,h4{font-weight:800;letter-spacing:-.02em;color:#0f172a}
h1{font-size:3.4rem;line-height:1.08}
h2{font-size:2.4rem;line-height:1.15}
h3{font-size:1.2rem;line-height:1.4}
p,.desc{color:#64748b;font-weight:400;line-height:1.65}
.gradient-text{background:linear-gradient(135deg,#2563eb 0%,#4f46e5 50%,#7c3aed 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.section-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:100px;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;background:#eff6ff;color:#2563eb;margin-bottom:16px}
.section-badge svg{width:13px;height:13px}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 26px;border-radius:10px;font-size:.925rem;font-weight:600;cursor:pointer;border:none;transition:all .22s ease}
.btn-primary{background:#2563eb;color:#fff;box-shadow:0 1px 2px rgba(37,99,235,.3),0 4px 12px rgba(37,99,235,.15)}
.btn-primary:hover{background:#1d4ed8;transform:translateY(-1px);box-shadow:0 4px 20px rgba(37,99,235,.3)}
.btn-secondary{background:#fff;color:#1e293b;border:1.5px solid #e2e8f0}
.btn-secondary:hover{border-color:#2563eb;color:#2563eb;transform:translateY(-1px)}
.btn-pulse{animation:pulse-glow 2.5s ease-in-out infinite}
@keyframes pulse-glow{0%,100%{box-shadow:0 1px 2px rgba(37,99,235,.3),0 4px 12px rgba(37,99,235,.15)}50%{box-shadow:0 1px 2px rgba(37,99,235,.3),0 4px 28px rgba(37,99,235,.35)}}

/* Animations */
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.cf-step-indicator{display:flex;gap:8px;justify-content:center;margin-bottom:18px}
.cf-step-dot{width:8px;height:8px;border-radius:50%;background:#e2e8f0;transition:background .2s,transform .2s}
.cf-step-dot.active{background:#2563eb;transform:scale(1.15)}
.cf-step-panel{display:none}
.cf-step-panel.active{display:block;animation:cfStepIn .28s ease}
@keyframes cfStepIn{from{opacity:0;transform:translateX(10px)}to{opacity:1;transform:translateX(0)}}
@keyframes cfSpin{to{transform:rotate(360deg)}}
@keyframes fadeIn{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
.animate-on-scroll{opacity:0;transform:translateY(28px);transition:opacity .6s ease,transform .6s ease}
.animate-on-scroll.visible{opacity:1;transform:translateY(0)}

/* Navbar */
.navbar{background:rgba(255,255,255,.9);backdrop-filter:blur(12px);border-bottom:1px solid #e2e8f0;padding:0 24px;height:64px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:100}
.nav-brand{display:flex;align-items:center;gap:10px}
.nav-brand-text strong{font-size:1.1rem;font-weight:800;color:#0f172a}
.nav-brand-text span{font-size:.65rem;color:#94a3b8;font-weight:500;display:block}
.nav-links{display:flex;align-items:center;gap:28px}
.nav-links a{font-size:.875rem;font-weight:500;color:#475569;transition:color .2s}
.nav-links a:hover{color:#2563eb}
.nav-actions{display:flex;align-items:center;gap:12px}
.nav-actions a.signin{color:#64748b;font-size:.875rem;font-weight:500;padding:8px 16px;border-radius:8px;transition:color .2s}
.nav-actions a.signin:hover{color:#2563eb}
.nav-actions .btn{padding:9px 20px;font-size:.875rem}

/* Hero — full-width horizontal funnel band, copy below */
.hero{position:relative;padding:0 0 72px;overflow:hidden;background:linear-gradient(180deg,#f8faff 0%,#fff 100%)}
.hero::before{content:'';position:absolute;top:-150px;right:-150px;width:700px;height:700px;background:radial-gradient(circle,rgba(37,99,235,.06) 0%,transparent 70%);border-radius:50%;pointer-events:none}
.hero::after{content:'';position:absolute;bottom:-100px;left:-120px;width:500px;height:500px;background:radial-gradient(circle,rgba(79,70,229,.04) 0%,transparent 70%);border-radius:50%;pointer-events:none}
.hero-content-below{position:relative;z-index:1;padding:48px 24px 64px;text-align:center;max-width:800px;margin:0 auto}
.hero-badge{display:inline-block;font-size:.8rem;font-weight:600;color:#2563eb;background:#eff6ff;padding:7px 18px;border-radius:999px;margin-bottom:36px;line-height:1.4;letter-spacing:.01em;max-width:max-content}
.hero-headline{font-size:clamp(1.75rem,3.6vw,2.65rem);line-height:1.28;margin:0 auto 20px;max-width:900px;letter-spacing:-.025em;font-weight:800;color:#0f172a}
.hero-headline .hero-h1-keyword{color:#0f172a}
.hero-headline .hero-h1-brand{color:#0f172a}
.hero-hook{font-size:clamp(1.15rem,2.2vw,1.35rem);line-height:1.35;margin:0 auto 18px;max-width:640px;font-weight:700;color:#1e293b}
.hero-hook .gradient-text{font-weight:800}
.hero-lead{font-size:clamp(1.05rem,2vw,1.2rem);color:#64748b;margin:0 auto 44px;max-width:700px;line-height:1.65;font-weight:500}
.hero-buttons{display:flex;gap:14px;margin-top:8px;margin-bottom:0;flex-wrap:wrap;justify-content:center}
.hero-buttons .btn-primary{padding:13px 28px;font-size:.95rem}
.hero-buttons .btn-secondary{background:transparent;color:#64748b;border:1.5px solid #e2e8f0;font-weight:500;padding:12px 24px;box-shadow:none}
.hero-buttons .btn-secondary:hover{background:#f8fafc;color:#475569;border-color:#cbd5e1;transform:none;box-shadow:none}
.why-talentrally{padding:72px 0 80px;background:#fff;border-bottom:1px solid #f1f5f9}
.why-talentrally-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:48px 64px;align-items:start;max-width:1040px;margin:0 auto}
.why-talentrally-head h2{font-size:clamp(1.65rem,3vw,2.25rem);line-height:1.2;margin:0;color:#0f172a}
.why-talentrally-body p{font-size:1.05rem;color:#475569;line-height:1.75;margin:0}
.trust-badges{display:flex;gap:20px;flex-wrap:wrap;justify-content:center}
.trust-badges .badge{display:flex;align-items:center;gap:6px;font-size:.8rem;color:#64748b;font-weight:500}
.trust-badges .badge svg{width:15px;height:15px;flex-shrink:0}

/* ── AI SCREENING PIPELINE — JDs receive applications → AI layers screen → shortlist / reject (white-blue) ── */
.spp-band{width:100%;position:relative;overflow:hidden;border-bottom:1px solid #e7edf6;background:linear-gradient(180deg,#f5f9ff 0%,#edf3ff 55%,#f8faff 100%)}
.spp-band::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(37,99,235,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(37,99,235,.045) 1px,transparent 1px);background-size:44px 44px;pointer-events:none}
.scp-head{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;gap:8px;padding-top:18px;font-family:'Syne',sans-serif;font-size:.62rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:#3553c4}
.scp-live{width:7px;height:7px;border-radius:50%;background:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,.16);animation:scpLive 1.6s ease-in-out infinite}
@keyframes scpLive{0%,100%{opacity:.5;transform:scale(.85)}50%{opacity:1;transform:scale(1.1)}}
.scp-scene{position:relative;z-index:1;max-width:1060px;margin:0 auto;padding:18px 16px 30px;display:grid;grid-template-columns:215px minmax(0,1fr) 220px;gap:18px;align-items:start}
.scp-col-label{font-size:.56rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#94a3b8;margin-bottom:8px}
/* Left — JD cards receiving applications */
.scp-jds{display:flex;flex-direction:column;gap:10px;min-width:0}
.scp-jd{position:relative;background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:10px 12px;box-shadow:0 6px 18px -12px rgba(15,23,42,.18);transition:border-color .3s,box-shadow .3s,transform .3s}
.scp-jd.pulse{border-color:#93c5fd;box-shadow:0 12px 26px -10px rgba(37,99,235,.35);transform:translateY(-2px)}
.scp-jd-top{display:flex;align-items:center;gap:9px;min-width:0}
.scp-jd-ic{width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:.58rem;font-weight:800;color:#fff;flex-shrink:0}
.scp-jd-ic.g1{background:linear-gradient(135deg,#2563eb,#4f46e5)}
.scp-jd-ic.g2{background:linear-gradient(135deg,#0e7490,#2563eb)}
.scp-jd-ic.g4{background:linear-gradient(135deg,#4f46e5,#7c3aed)}
.scp-jd-top b{display:block;font-size:.74rem;font-weight:800;color:#1e293b;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.scp-jd-top small{display:block;font-size:.56rem;color:#94a3b8;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.scp-jd-foot{display:flex;align-items:center;justify-content:space-between;margin-top:8px;gap:6px}
.scp-jd-count{font-size:.6rem;color:#64748b;font-weight:600;white-space:nowrap}
.scp-jd-count b{color:#2563eb;font-family:'Syne',sans-serif;font-size:.74rem;font-weight:800}
.scp-jd-new{font-size:.54rem;font-weight:800;color:#15803d;background:#dcfce7;border-radius:999px;padding:2px 7px;opacity:0;transform:translateY(4px);transition:opacity .3s,transform .3s;white-space:nowrap}
.scp-jd-new.pop{opacity:1;transform:translateY(0)}
/* Center — AI screening layers */
.scp-pipe{min-width:0}
.scp-layers{position:relative;display:flex;flex-direction:column;gap:8px}
.scp-layers::before{content:'';position:absolute;left:21px;top:18px;bottom:18px;width:2px;background:linear-gradient(180deg,#bfdbfe,#c7d2fe);z-index:0}
.scp-layer{position:relative;z-index:1;display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;min-height:58px;padding:8px 168px 8px 10px;box-shadow:0 6px 18px -12px rgba(15,23,42,.16);transition:border-color .35s,box-shadow .35s;overflow:hidden}
.scp-layer.active{border-color:#60a5fa;box-shadow:0 14px 32px -12px rgba(37,99,235,.42)}
.scp-layer-num{width:22px;height:22px;border-radius:50%;background:#eff6ff;border:1.5px solid #bfdbfe;color:#2563eb;font-size:.6rem;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .3s,color .3s,border-color .3s}
.scp-layer.active .scp-layer-num{background:#2563eb;border-color:#2563eb;color:#fff}
.scp-layer.done-ok .scp-layer-num{background:#dcfce7;border-color:#86efac;color:#15803d}
.scp-layer.done-bad .scp-layer-num{background:#fee2e2;border-color:#fca5a5;color:#b91c1c}
.scp-layer-body{min-width:0}
.scp-layer-body b{display:block;font-size:.72rem;font-weight:800;color:#1e293b;line-height:1.2}
.scp-layer-status{display:block;font-size:.58rem;color:#94a3b8;font-weight:600;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .3s}
.scp-layer-status.ok{color:#15803d}
.scp-layer-status.bad{color:#b91c1c}
.scp-layer-state{position:absolute;right:10px;top:50%;width:16px;height:16px;margin-top:-8px;border-radius:50%;flex-shrink:0}
.scp-layer-state.spin{border:2px solid #bfdbfe;border-top-color:#2563eb;animation:scpSpin .7s linear infinite}
@keyframes scpSpin{to{transform:rotate(360deg)}}
.scp-layer-state.ok::after,.scp-layer-state.bad::after{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:.62rem;font-weight:800;border-radius:50%}
.scp-layer-state.ok::after{content:'✓';color:#15803d;background:#dcfce7}
.scp-layer-state.bad::after{content:'✕';color:#b91c1c;background:#fee2e2}
.scp-layer-scan{position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 30%,rgba(37,99,235,.08) 48%,rgba(37,99,235,.14) 52%,transparent 70%);transform:translateX(-110%);opacity:0}
.scp-layer.active .scp-layer-scan{opacity:1;animation:scpScan 1.1s ease-in-out infinite}
@keyframes scpScan{to{transform:translateX(110%)}}
/* Right — outcome stacks (approved top, rejected below) */
.scp-out{display:flex;flex-direction:column;gap:12px;min-width:0}
.scp-stack{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:9px 11px 11px;min-height:128px;box-shadow:0 6px 18px -12px rgba(15,23,42,.16)}
.scp-stack-sel{border-top:3px solid #22c55e}
.scp-stack-rej{border-top:3px solid #f87171}
.scp-stack-head{display:flex;align-items:center;justify-content:space-between;font-size:.58rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.scp-stack-sel .scp-stack-head{color:#15803d}
.scp-stack-rej .scp-stack-head{color:#b91c1c}
.scp-stack-head b{font-family:'Syne',sans-serif;font-size:.82rem}
.scp-stack-cards{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.scp-mini{display:flex;align-items:center;gap:7px;background:#f8fafc;border:1px solid #eef2f7;border-radius:9px;padding:5px 8px;opacity:0;transform:translateY(-6px) scale(.94);transition:opacity .4s,transform .45s cubic-bezier(.3,1.3,.4,1);min-width:0}
.scp-mini.in{opacity:1;transform:translateY(0) scale(1)}
.scp-mini-av{width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.48rem;font-weight:800;color:#fff;flex-shrink:0}
.scp-mini>div{min-width:0;flex:1}
.scp-mini b{display:block;font-size:.6rem;font-weight:800;color:#1e293b;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.scp-mini small{display:block;font-size:.5rem;color:#94a3b8;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.scp-mini-score{font-family:'Syne',sans-serif;font-size:.62rem;font-weight:800;flex-shrink:0}
.scp-stack-sel .scp-mini-score{color:#15803d}
.scp-stack-rej .scp-mini-score{color:#b91c1c}
/* Traveling candidate card */
.scp-card{position:absolute;left:0;top:0;z-index:30;width:152px;background:#fff;border:1.5px solid #93c5fd;border-radius:12px;padding:7px 9px;box-shadow:0 18px 36px -12px rgba(37,99,235,.45);opacity:0;pointer-events:none}
.scp-card.sel{border-color:#4ade80;box-shadow:0 18px 36px -12px rgba(22,163,74,.5)}
.scp-card.rej{border-color:#f87171;box-shadow:0 18px 36px -12px rgba(220,38,38,.42)}
.scp-card-head{display:flex;align-items:center;gap:7px;min-width:0}
.scp-card-av{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.5rem;font-weight:800;color:#fff;flex-shrink:0}
.scp-card-av.g1,.scp-mini-av.g1{background:linear-gradient(135deg,#2563eb,#7c3aed)}
.scp-card-av.g2,.scp-mini-av.g2{background:linear-gradient(135deg,#4f46e5,#9333ea)}
.scp-card-av.g3,.scp-mini-av.g3{background:linear-gradient(135deg,#475569,#64748b)}
.scp-card-av.g4,.scp-mini-av.g4{background:linear-gradient(135deg,#0e7490,#2563eb)}
.scp-card-head>div{min-width:0;flex:1}
.scp-card-head b{display:block;font-size:.62rem;font-weight:800;color:#1e293b;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.scp-card-head small{display:block;font-size:.5rem;color:#94a3b8;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.scp-card-score{font-family:'Syne',sans-serif;font-size:.68rem;font-weight:800;color:#2563eb;flex-shrink:0}
.scp-card.sel .scp-card-score{color:#15803d}
.scp-card.rej .scp-card-score{color:#b91c1c}
.scp-card-chips{display:flex;gap:4px;flex-wrap:wrap;margin-top:5px;min-height:0}
.scp-chip{font-size:.48rem;font-weight:800;padding:2px 6px;border-radius:999px}
.scp-chip.ok{color:#15803d;background:#dcfce7}
.scp-chip.no{color:#b91c1c;background:#fee2e2}
/* Tablet / mobile — single column, no horizontal scroll; flying card positions are computed at runtime */
@media(max-width:880px){
  .scp-scene{grid-template-columns:1fr;gap:14px;padding:14px 12px 24px}
  .scp-jds{flex-direction:row;gap:8px}
  .scp-jds .scp-col-label{display:none}
  .scp-jd{flex:1;min-width:0;padding:8px 9px}
  .scp-jd-top small{display:none}
  .scp-jd-ic{width:24px;height:24px;font-size:.5rem}
  .scp-jd-top b{font-size:.62rem}
  .scp-jd-foot{margin-top:5px}
  .scp-jd-count{font-size:.52rem}
  .scp-jd-new{display:none}
  .scp-layer{padding-right:128px;min-height:54px}
  .scp-out{flex-direction:row;gap:10px}
  .scp-stack{flex:1;min-width:0;min-height:110px}
  .scp-out .scp-col-label{display:none}
  .scp-card{width:112px}
  .scp-card-head small{display:none}
  .scp-card-chips{display:none}
}
@media(max-width:480px){
  .scp-layer{padding-right:106px}
  .scp-layer-body b{font-size:.64rem}
  .scp-layer-status{font-size:.52rem}
  .scp-card{width:96px}
  .scp-card-score{font-size:.58rem}
  .scp-stack-head{font-size:.52rem}
  .scp-mini small{display:none}
}
@media(prefers-reduced-motion:reduce){.scp-live{animation:none}.scp-layer-scan{animation:none!important;opacity:0!important}.scp-layer-state.spin{animation:none}}

/* Social proof — visible logo chips */
.social-proof{padding:48px 0;border-top:1px solid #eef2f9;border-bottom:1px solid #eef2f9;background:linear-gradient(180deg,#fafbff,#f3f6fd)}
.social-proof .inner{text-align:center}
.social-proof .inner p{display:inline-flex;align-items:center;gap:12px;font-size:.74rem;color:#64748b;text-transform:uppercase;letter-spacing:.16em;font-weight:700;margin-bottom:26px}
.social-proof .inner p::before,.social-proof .inner p::after{content:'';width:34px;height:1px;background:linear-gradient(90deg,transparent,#cbd5e1)}
.social-proof .inner p::after{background:linear-gradient(90deg,#cbd5e1,transparent)}
.logo-row{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;align-items:center}
.company-logo{display:inline-flex;align-items:center;gap:10px;color:#1e335c;font-weight:700;font-size:.92rem;opacity:1;padding:9px 18px 9px 9px;background:#fff;border:1px solid #e7edf6;border-radius:100px;box-shadow:0 8px 20px -10px rgba(30,41,59,.28),inset 0 1px 0 rgba(255,255,255,.9);transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s,border-color .3s}
.company-logo:hover{transform:translateY(-3px);border-color:#c7d7f5;box-shadow:0 18px 34px -12px rgba(37,99,235,.34)}
.cl-icon{width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.74rem;color:#fff;flex-shrink:0;box-shadow:0 3px 8px -2px rgba(30,41,59,.35)}


/* Social proof — visible logo chips */
.social-proof{padding:48px 0;border-top:1px solid #eef2f9;border-bottom:1px solid #eef2f9;background:linear-gradient(180deg,#fafbff,#f3f6fd)}
.social-proof .inner{text-align:center}
.social-proof .inner p{display:inline-flex;align-items:center;gap:12px;font-size:.74rem;color:#64748b;text-transform:uppercase;letter-spacing:.16em;font-weight:700;margin-bottom:26px}
.social-proof .inner p::before,.social-proof .inner p::after{content:'';width:34px;height:1px;background:linear-gradient(90deg,transparent,#cbd5e1)}
.social-proof .inner p::after{background:linear-gradient(90deg,#cbd5e1,transparent)}
.logo-row{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;align-items:center}
.company-logo{display:inline-flex;align-items:center;gap:10px;color:#1e335c;font-weight:700;font-size:.92rem;opacity:1;padding:9px 18px 9px 9px;background:#fff;border:1px solid #e7edf6;border-radius:100px;box-shadow:0 8px 20px -10px rgba(30,41,59,.28),inset 0 1px 0 rgba(255,255,255,.9);transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s,border-color .3s}
.company-logo:hover{transform:translateY(-3px);border-color:#c7d7f5;box-shadow:0 18px 34px -12px rgba(37,99,235,.34)}
.cl-icon{width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.74rem;color:#fff;flex-shrink:0;box-shadow:0 3px 8px -2px rgba(30,41,59,.35)}

/* Feature pillars grid */
.pillars{padding:80px 0 48px}
.section-header{text-align:center;margin-bottom:56px}
.section-header h2{margin-bottom:12px}
.section-header p{max-width:540px;margin:0 auto;font-size:1rem}
.pillars .section-header{position:sticky;top:64px;z-index:6;background:rgba(255,255,255,.72);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);padding:20px 0 16px;margin-bottom:0;box-shadow:0 1px 0 rgba(226,232,240,.6),0 8px 32px -12px rgba(15,23,42,.08)}
.pillars-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.pillar-card{border-radius:16px;border:1px solid #f1f5f9;padding:22px 20px 20px;transition:all .3s ease;background:#fff;overflow:hidden}
.pillar-card:hover{border-color:#dbeafe;box-shadow:0 12px 36px rgba(37,99,235,.08);transform:translateY(-4px)}
.pillar-card h3{font-size:.95rem;margin-bottom:12px}
.pillar-visual{height:72px;border-radius:10px;background:#f8fafc;border:1px solid #eef2f7;padding:10px 12px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.pv-bars{display:flex;flex-direction:column;gap:5px;width:100%}
.pv-bar-row{display:flex;align-items:center;gap:8px}
.pv-bar-row i{flex:1;height:5px;background:#e2e8f0;border-radius:3px;overflow:hidden;position:relative}
.pv-bar-row i::after{content:'';position:absolute;left:0;top:0;bottom:0;border-radius:3px;background:linear-gradient(90deg,#2563eb,#7c3aed);animation:pvBarFill 2.4s ease-in-out infinite}
.pv-bar-row:nth-child(1) i::after{width:88%;animation-delay:0s}
.pv-bar-row:nth-child(2) i::after{width:72%;animation-delay:.3s}
.pv-bar-row:nth-child(3) i::after{width:65%;animation-delay:.6s}
.pv-phone{position:relative;width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#dcfce7,#bbf7d0);display:flex;align-items:center;justify-content:center;animation:pvPulse 2s ease-in-out infinite}
.pv-phone::after{content:'';position:absolute;inset:8px;border-radius:50%;border:2px solid rgba(22,163,74,.25);animation:pvRing 2s ease-out infinite}
.pv-timeline{display:flex;align-items:center;gap:6px;width:100%}
.pv-timeline i{width:8px;height:8px;border-radius:50%;background:#cbd5e1;flex-shrink:0}
.pv-timeline i.on{background:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,.2);animation:pvDot 2.5s ease-in-out infinite}
.pv-timeline i:nth-child(3).on{animation-delay:.5s}
.pv-timeline i:nth-child(5).on{animation-delay:1s}
.pv-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;width:100%}
.pv-kpi{background:#fff;border-radius:6px;padding:6px 4px;text-align:center;border:1px solid #e2e8f0}
.pv-kpi b{display:block;font-size:.85rem;font-weight:800;color:#2563eb;font-family:'Syne',sans-serif}
.pv-kpi span{font-size:.55rem;color:#94a3b8;text-transform:uppercase;letter-spacing:.04em}
.pv-link{font-size:.62rem;color:#2563eb;font-weight:600;padding:6px 12px;background:#eff6ff;border-radius:6px;border:1px dashed #bfdbfe;animation:pvLinkGlow 2.2s ease-in-out infinite}
@keyframes pvBarFill{0%,100%{opacity:.7}50%{opacity:1}}
@keyframes pvPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
@keyframes pvRing{0%{transform:scale(.8);opacity:.7}100%{transform:scale(1.6);opacity:0}}
@keyframes pvDot{0%,100%{opacity:.5}50%{opacity:1}}
@keyframes pvLinkGlow{0%,100%{box-shadow:0 0 0 rgba(37,99,235,0)}50%{box-shadow:0 0 12px rgba(37,99,235,.15)}}

/* Feature blocks */
.feature-block{padding:72px 0}
.feature-block .wrap{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}
.feature-block.reverse .wrap{direction:rtl}
.feature-block.reverse .wrap>*{direction:ltr}
.feature-block.alt-bg{background:#f8fafc}
.feature-text .feature-badge{display:inline-block;padding:3px 10px;border-radius:6px;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;background:#dbeafe;color:#2563eb;margin-bottom:14px}
.feature-text .feature-badge.green{background:#dcfce7;color:#16a34a}
.feature-text .feature-badge.purple{background:#ede9fe;color:#7c3aed}
.feature-text h3{font-size:1.6rem;margin-bottom:14px}
.feature-text p{font-size:.95rem;margin-bottom:22px}
.feature-bullets{list-style:none;display:flex;flex-direction:column;gap:11px}
.feature-bullets li{display:flex;align-items:flex-start;gap:10px;font-size:.875rem;color:#475569}
.feature-bullets li svg{width:18px;height:18px;color:#2563eb;flex-shrink:0;margin-top:2px}

/* Visual stat-strip: replaces long bullet copy with compact number+icon badges */
.stat-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.stat-chip{background:#fff;border:1px solid #eef2f7;border-radius:12px;padding:14px 12px;text-align:center;box-shadow:0 6px 20px -14px rgba(15,23,42,.25);transition:transform .25s ease,box-shadow .25s ease}
.stat-chip:hover{transform:translateY(-3px);box-shadow:0 14px 28px -16px rgba(37,99,235,.28)}
.stat-chip .sc-ico{width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center;margin:0 auto 8px;background:linear-gradient(135deg,#dbeafe,#ede9fe)}
.stat-chip .sc-ico svg{width:16px;height:16px;color:#2563eb}
.stat-chip b{display:block;font-family:'Syne',sans-serif;font-size:1.05rem;font-weight:800;color:#1e293b;letter-spacing:-.01em}
.stat-chip span{display:block;font-size:.66rem;color:#94a3b8;letter-spacing:.02em;margin-top:2px;line-height:1.3}
.feature-block.alt-bg .stat-chip{background:#fff}
@media(max-width:760px){.stat-strip{grid-template-columns:repeat(3,1fr);gap:8px}.stat-chip{padding:11px 8px}.stat-chip b{font-size:.92rem}.stat-chip span{font-size:.6rem}}

/* 3D scroll-tilt depth — perspective wrapper for visual cards (GSAP-driven rotateX/Y) */
.tilt-3d-wrap{perspective:1400px}
.tilt-3d{transform-style:preserve-3d;will-change:transform;transform-origin:center center}
@media(prefers-reduced-motion:reduce){.tilt-3d{transform:none!important}}

/* Visual: job card */
.visual-job-card{max-width:380px;margin:0 auto}
.jc-header{background:linear-gradient(135deg,#2563eb,#4f46e5);border-radius:14px 14px 0 0;padding:22px 20px}
.jc-header .badge{background:rgba(255,255,255,.2);color:#fff;font-size:.68rem;font-weight:700;padding:3px 10px;border-radius:100px;display:inline-block;margin-bottom:10px}
.jc-header h4{color:#fff;font-size:1.05rem;margin-bottom:4px}
.jc-header span{color:rgba(255,255,255,.75);font-size:.78rem}
.jc-body{background:#fff;border:1px solid #e2e8f0;border-top:none;border-radius:0 0 14px 14px;padding:18px 20px}
.jc-meta{display:flex;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.jc-meta span{font-size:.72rem;color:#64748b;display:flex;align-items:center;gap:4px}
.jc-meta svg{width:13px;height:13px;color:#94a3b8}
.jc-share{background:#f8fafc;border-radius:8px;padding:10px 12px;margin-bottom:14px}
.jc-share .lbl{font-size:.65rem;font-weight:600;color:#94a3b8;text-transform:uppercase;margin-bottom:4px}
.jc-share .link{font-size:.72rem;color:#2563eb;font-weight:500;display:flex;align-items:center;gap:6px;word-break:break-all}
.jc-share svg{width:13px;height:13px;flex-shrink:0}
.jc-actions{display:flex;gap:8px}
.jc-btn{flex:1;padding:8px;border-radius:8px;font-size:.72rem;font-weight:600;text-align:center;cursor:default}
.jc-btn.primary{background:#2563eb;color:#fff}
.jc-btn.secondary{background:#f1f5f9;color:#475569}

/* Visual: AI screening */
/* AI Resume Bank → Brain → Ranked output mini pipeline */
.ai-bank-flow{display:flex;align-items:center;justify-content:center;gap:6px;max-width:420px;margin:0 auto 20px;padding:18px 8px;flex-wrap:nowrap}
.abf-bank{position:relative;width:74px;height:74px;display:flex;align-items:center;justify-content:center}
.abf-doc{position:absolute;width:42px;height:54px;border-radius:5px;background:#fff;border:1.5px solid #cbd5e1;box-shadow:0 6px 14px -8px rgba(15,23,42,.35)}
.abf-doc::before{content:'';position:absolute;left:7px;right:7px;top:11px;height:2.5px;border-radius:2px;background:#dbeafe;box-shadow:0 7px 0 #dbeafe,0 14px 0 #eef2f7,0 21px 0 #eef2f7}
.abf-doc.d1{transform:translate(-9px,-6px) rotate(-9deg);z-index:1}
.abf-doc.d2{transform:translate(-2px,-1px) rotate(-3deg);z-index:2}
.abf-doc.d3{transform:translate(5px,3px) rotate(4deg);z-index:3}
.abf-doc.d4{transform:translate(11px,7px) rotate(10deg);z-index:4;border-color:#93c5fd}
.abf-bank-label,.abf-brain-label,.abf-output-label{position:absolute;bottom:-22px;left:50%;transform:translateX(-50%);font-size:.6rem;color:#94a3b8;white-space:nowrap;font-weight:600;letter-spacing:.01em}
.abf-arrow{width:34px;height:14px;flex-shrink:0;opacity:.55}
.abf-arrow-path{stroke-dasharray:64;stroke-dashoffset:64}
.abf-brain{position:relative;width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,#2563eb,#4f46e5,#7c3aed);display:flex;align-items:center;justify-content:center;box-shadow:0 10px 28px -10px rgba(79,70,229,.55)}
.abf-brain svg{width:34px;height:34px;position:relative;z-index:2}
.abf-ring{position:absolute;inset:-6px;border-radius:50%;border:1.5px solid rgba(124,58,237,.3)}
.abf-ring.r2{inset:-13px;border-color:rgba(37,99,235,.18)}
.abf-output{position:relative;display:flex;flex-direction:column;gap:5px;width:96px}
.abf-rank{display:flex;align-items:center;gap:6px;background:#fff;border:1px solid #eef2f7;border-radius:7px;padding:5px 8px;box-shadow:0 4px 12px -8px rgba(15,23,42,.25)}
.abf-rank .dot{width:6px;height:6px;border-radius:50%;background:#16a34a;flex-shrink:0}
.abf-rank .dot.fail{background:#ef4444}
.abf-rank i{flex:1;height:4px;border-radius:3px;background:#e2e8f0;position:relative;overflow:hidden}
.abf-rank i::after{content:'';position:absolute;inset:0 auto 0 0;border-radius:3px;background:linear-gradient(90deg,#2563eb,#7c3aed)}
.abf-rank.r1 i::after{width:96%}.abf-rank.r2 i::after{width:89%}.abf-rank.r3 i::after{width:41%;background:linear-gradient(90deg,#f87171,#ef4444)}
.abf-rank b{font-size:.62rem;font-weight:800;color:#1e293b;font-family:'Syne',sans-serif}
@media(max-width:520px){.ai-bank-flow{gap:3px}.abf-arrow{width:20px}.abf-output{width:78px}}
.visual-screening{max-width:380px;margin:0 auto}
.sc-card{background:#fff;border:1px solid #e2e8f0;border-radius:14px;overflow:hidden;box-shadow:0 4px 20px rgba(0,0,0,.05)}
.sc-header{padding:16px 18px;border-bottom:1px solid #f1f5f9;display:flex;align-items:center;gap:12px}
.sc-avatar{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#7c3aed,#4f46e5);display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700;color:#fff;flex-shrink:0}
.sc-name{font-size:.85rem;font-weight:700;color:#0f172a}
.sc-role{font-size:.72rem;color:#94a3b8}
.sc-scores{padding:14px 18px;display:flex;flex-direction:column;gap:9px}
.sc-score-row{display:flex;align-items:center;gap:10px}
.sc-score-row .lbl{font-size:.72rem;color:#64748b;width:100px;flex-shrink:0}
.sc-score-row .bar{flex:1;height:6px;background:#f1f5f9;border-radius:3px;overflow:hidden}
.sc-score-row .bar .fill{height:100%;border-radius:3px}
.sc-score-row .val{font-size:.72rem;font-weight:700;color:#0f172a;width:26px;text-align:right;flex-shrink:0}
.sc-footer{padding:12px 18px;background:#f8fafc;border-top:1px solid #f1f5f9;display:flex;align-items:center;justify-content:space-between}
.sc-footer .rec{font-size:.75rem;font-weight:700;color:#16a34a;display:flex;align-items:center;gap:5px}
.sc-footer .rec svg{width:14px;height:14px}
.sc-footer .overall{font-size:1.3rem;font-weight:800;color:#2563eb}

/* Visual: Interview modes */
.visual-modes{max-width:380px;margin:0 auto;display:flex;flex-direction:column;gap:12px}
.mode-card{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:16px 18px;display:flex;align-items:center;gap:14px;box-shadow:0 2px 10px rgba(0,0,0,.04);transition:all .25s}
.mode-card:hover{border-color:#2563eb;box-shadow:0 4px 20px rgba(37,99,235,.1);transform:translateY(-1px)}
.mode-icon{width:44px;height:44px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.mode-card h4{font-size:.875rem;font-weight:700;color:#0f172a;margin-bottom:2px}
.mode-card p{font-size:.75rem;color:#94a3b8}
.mode-card .mode-badge{font-size:.62rem;font-weight:700;padding:2px 8px;border-radius:4px;margin-top:4px;display:inline-block}

/* Visual: Scheduling */
.visual-scheduling{max-width:380px;margin:0 auto}
.sched-card{background:#fff;border:1px solid #e2e8f0;border-radius:14px;overflow:hidden;box-shadow:0 4px 20px rgba(0,0,0,.05)}
.sched-top{background:linear-gradient(135deg,#0f172a,#1e293b);padding:18px 20px}
.sched-top .sched-label{font-size:.68rem;color:rgba(255,255,255,.6);text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px}
.sched-top .candidate{color:#fff;font-size:.9rem;font-weight:700}
.sched-top .role{color:rgba(255,255,255,.6);font-size:.75rem;margin-top:2px}
.sched-timeline{padding:14px 20px;display:flex;flex-direction:column;gap:10px}
.sched-step{display:flex;align-items:center;gap:12px}
.sched-step .dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.sched-step .text{font-size:.75rem;color:#475569}
.sched-step .text strong{color:#0f172a;display:block;font-size:.78rem}
.sched-confirmed{margin:0 20px 16px;background:#dcfce7;border-radius:8px;padding:10px 12px;display:flex;align-items:center;gap:8px}
.sched-confirmed svg{width:16px;height:16px;color:#16a34a;flex-shrink:0}
.sched-confirmed span{font-size:.75rem;font-weight:600;color:#16a34a}

/* Visual: Dashboard */
.visual-dashboard{max-width:440px;margin:0 auto}
.dash-card{background:#fff;border:1px solid #e2e8f0;border-radius:14px;box-shadow:0 8px 30px rgba(0,0,0,.07);overflow:hidden}
.dash-topbar{height:36px;background:#f8fafc;border-bottom:1px solid #e2e8f0;display:flex;align-items:center;gap:6px;padding:0 12px}
.dash-dot{width:8px;height:8px;border-radius:50%}
.dash-dot.r{background:#fca5a5}.dash-dot.y{background:#fde68a}.dash-dot.g{background:#86efac}
.dash-tabs{display:flex;gap:0;border-bottom:1px solid #f1f5f9;padding:0 16px}
.dash-tab{font-size:.68rem;font-weight:600;padding:8px 12px;color:#94a3b8;border-bottom:2px solid transparent;cursor:default}
.dash-tab.active{color:#2563eb;border-bottom-color:#2563eb}
.dash-body{padding:16px}
.dash-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}
.dash-kpi{background:#f8fafc;border-radius:8px;padding:10px;text-align:center}
.dash-kpi .k{font-size:1.15rem;font-weight:800;color:#2563eb}
.dash-kpi .v{font-size:.58rem;color:#94a3b8;text-transform:uppercase;letter-spacing:.04em;margin-top:1px}
.dash-applicants{display:flex;flex-direction:column;gap:6px}
.da-row{display:flex;align-items:center;gap:8px;padding:7px 9px;border-radius:7px;background:#f8fafc}
.da-av{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.6rem;font-weight:700;color:#fff;flex-shrink:0}
.da-name{flex:1;font-size:.7rem;font-weight:600;color:#0f172a}
.da-score{font-size:.68rem;font-weight:700;color:#2563eb}
.da-actions{display:flex;gap:4px}
.da-act{font-size:.58rem;font-weight:700;padding:3px 7px;border-radius:4px;cursor:default}
.da-act.approve{background:#dcfce7;color:#16a34a}
.da-act.reject{background:#fef2f2;color:#dc2626}
.da-act.video{background:#dbeafe;color:#2563eb}

/* Visual: API Integration */
.visual-api{max-width:440px;margin:0 auto}
.brand-frame{background:#fff;border-radius:16px;overflow:hidden;border:1px solid #e2e8f0;box-shadow:0 24px 60px rgba(15,23,42,.10)}
.brand-frame-bar{height:34px;background:#f8fafc;border-bottom:1px solid #e2e8f0;display:flex;align-items:center;gap:6px;padding:0 14px}
.brand-frame-bar .bf-dot{width:8px;height:8px;border-radius:50%;background:#e2e8f0}
.brand-frame-bar .bf-url{margin-left:10px;font-size:.66rem;color:#94a3b8;background:#fff;border:1px solid #e2e8f0;border-radius:5px;padding:2px 10px}
.brand-frame-body{padding:24px 22px}
.bf-row{display:flex;align-items:center;gap:10px;margin-bottom:20px}
.bf-logo{width:34px;height:34px;border-radius:9px;flex-shrink:0}
.bf-name i{display:block;height:9px;width:96px;border-radius:4px;background:#cbd5e1;margin-bottom:6px}
.bf-name i.thin{height:6px;width:64px;background:#e2e8f0;margin:0}
.bf-cta{margin-left:auto;font-size:.66rem;font-weight:700;color:#fff;border-radius:7px;padding:7px 14px}
.bf-headline i{display:block;border-radius:5px;background:#e2e8f0}
.bf-headline i:first-child{height:13px;width:78%;margin-bottom:9px}
.bf-headline i:last-child{height:13px;width:52%}
.bf-form{margin-top:20px;border:1px solid #e2e8f0;border-radius:12px;padding:16px;background:#f8fafc;display:flex;flex-direction:column;gap:10px}
.bf-field{height:11px;border-radius:5px;background:#e2e8f0;width:100%}
.bf-field.short{width:46%}
.bf-submit{align-self:flex-start;font-size:.66rem;font-weight:700;color:#fff;border-radius:7px;padding:8px 18px;margin-top:2px}
.bf-swatches{display:flex;align-items:center;gap:8px;margin-top:18px}
.bf-swatches span{font-size:.62rem;color:#94a3b8;text-transform:uppercase;letter-spacing:.06em;font-weight:700}
.bf-swatch{width:20px;height:20px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #e2e8f0;margin-left:-6px}
.bf-swatch:first-of-type{margin-left:8px}

/* Stats */
.stats{padding:64px 0;background:linear-gradient(135deg,#0f172a 0%,#1e3a5f 100%)}
.stats .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:32px}
.stat-item{text-align:center}
.stat-item .number{font-size:2.75rem;font-weight:800;background:linear-gradient(135deg,#60a5fa,#a78bfa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1.2}
.stat-item .label{font-size:.82rem;color:#94a3b8;margin-top:6px}

/* How it works — straight line, full viewport sticky panel, slow scroll */
.how-it-works{padding:72px 0 24px;background:#f8fafc}
.how-it-works-header{flex-shrink:0;margin-bottom:26px}
.how-it-works-header h2{font-size:clamp(1.5rem,3vw,2.1rem);margin-bottom:6px}
.how-it-works-header .section-badge{margin-bottom:8px}
#ai-screening{scroll-margin-top:88px}
.journey-rail{position:relative;max-width:1100px;margin:16px auto 0}
.journey-wave-wrap{position:sticky;top:64px;z-index:5;height:calc(100vh - 64px);max-height:720px;display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;background:linear-gradient(180deg,#f8fafc 0%,#f8fafc 94%,rgba(248,250,252,0) 100%);padding:32px 12px 16px;box-sizing:border-box}
.wave-rail{position:relative;width:100%;max-width:1040px;height:min(42vh,280px);min-height:200px;margin:0 auto;flex-shrink:0;overflow:visible;transition:height .5s cubic-bezier(.22,1,.36,1);--wave-node-r:22px;--wave-card-gap:14px}
.journey-rail.is-focused .wave-rail{height:min(44vh,300px)}
.wave-rail svg{position:absolute;inset:0;width:100%;height:100%;display:block;overflow:visible}
.wave-rail .wave-path{opacity:.58;filter:blur(.75px);stroke-width:3;transition:opacity .55s ease,filter .55s ease,stroke-width .55s ease}
.journey-rail.is-focused .wave-path{opacity:.95;filter:blur(.15px);stroke-width:3.5}
.wave-node{position:absolute;transform:translate(-50%,-50%);width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#2563eb,#7c3aed);color:#fff;display:flex;align-items:center;justify-content:center;font-family:'Syne',sans-serif;font-weight:800;font-size:.82rem;box-shadow:0 6px 16px rgba(79,70,229,.22);border:3px solid #f8fafc;opacity:.48;filter:blur(.75px);transition:opacity .55s ease,transform .55s cubic-bezier(.34,1.56,.64,1),box-shadow .55s ease,filter .55s ease;z-index:2;cursor:pointer}
.wave-node::after{content:'';position:absolute;left:50%;width:2px;background:linear-gradient(180deg,rgba(124,58,237,.35),rgba(37,99,235,.5));opacity:.45;filter:blur(.65px);transition:opacity .55s ease,filter .55s ease,height .55s ease;pointer-events:none;transform:translateX(-50%)}
.wave-node[data-step="1"]::after,.wave-node[data-step="3"]::after,.wave-node[data-step="5"]::after,.wave-node[data-step="7"]::after{top:100%;margin-top:0;height:var(--wave-card-gap)}
.wave-node[data-step="2"]::after,.wave-node[data-step="4"]::after,.wave-node[data-step="6"]::after{bottom:100%;margin-bottom:0;height:var(--wave-card-gap)}
.wave-node.active::after,.wave-node.peek::after{opacity:.9;filter:blur(0)}
.wave-node::before{content:'';position:absolute;inset:-8px;border-radius:50%;border:1.5px solid rgba(124,58,237,.28);opacity:0}
.wave-node.active,.wave-node.peek{opacity:1;filter:blur(0);transform:translate(-50%,-50%) scale(1.2);box-shadow:0 12px 30px rgba(79,70,229,.42)}
.wave-node.active::before,.wave-node.peek::before{opacity:1;animation:wavePulse 2.2s ease-out infinite}
@keyframes wavePulse{0%{transform:scale(.8);opacity:.6}100%{transform:scale(1.55);opacity:0}}
.jr-num{font-family:'Syne',sans-serif;font-weight:800;font-size:.62rem;letter-spacing:.12em;color:#7c3aed;white-space:nowrap}
.wave-card{position:absolute;width:108px;padding:8px 10px;background:#fff;border-radius:12px;border:1px solid #eef1f6;box-shadow:0 6px 18px rgba(15,23,42,.06);opacity:.38;pointer-events:auto;z-index:1;cursor:pointer;transition:width .55s cubic-bezier(.22,1,.36,1),opacity .55s ease,transform .55s cubic-bezier(.22,1,.36,1),box-shadow .55s ease,border-color .55s ease,filter .55s ease}
.wave-card.dimmed{opacity:.22;filter:blur(2.5px);pointer-events:none}
.wave-card h4{font-size:.76rem;font-weight:700;color:#0f172a;margin:3px 0 0;line-height:1.28;filter:blur(4px);opacity:.55;transition:filter .55s ease,opacity .55s ease,font-size .55s ease}
.wave-card p{font-size:.72rem;color:#64748b;line-height:1.48;margin-top:0;max-height:0;opacity:0;overflow:hidden;transition:max-height .5s ease,opacity .45s ease,margin-top .45s ease}
.wave-card.active,.wave-card.peek{z-index:8;width:min(260px,24vw);opacity:1;filter:blur(0);border-color:#bfdbfe;box-shadow:0 20px 48px rgba(79,70,229,.16);padding:12px 14px 14px}
.wave-card.active h4,.wave-card.peek h4{filter:blur(0);opacity:1;font-size:.92rem}
.wave-card.active p,.wave-card.peek p{max-height:120px;opacity:1;margin-top:8px}
.wave-card.wc-below{transform:translate(-50%,calc(var(--wave-node-r) + var(--wave-card-gap)))}
.wave-card.wc-above{transform:translate(-50%,calc(-100% - var(--wave-node-r) - var(--wave-card-gap)))}
.wave-card.active.wc-below,.wave-card.peek.wc-below{transform:translate(-50%,calc(var(--wave-node-r) + var(--wave-card-gap))) scale(1.02)}
.wave-card.active.wc-above,.wave-card.peek.wc-above{transform:translate(-50%,calc(-100% - var(--wave-node-r) - var(--wave-card-gap))) scale(1.02)}
.journey-detail-panel{width:100%;max-width:620px;margin:12px auto 0;flex-shrink:0;text-align:center;padding:8px 16px 0;min-height:88px}
.journey-detail-panel .jd-step{font-family:'Syne',sans-serif;font-weight:800;font-size:.66rem;letter-spacing:.13em;color:#7c3aed;text-transform:uppercase;margin-bottom:6px;opacity:0;transform:translateY(6px);transition:opacity .45s ease,transform .45s ease}
.journey-detail-panel .jd-title{font-size:1.2rem;font-weight:800;color:#0f172a;margin-bottom:8px;filter:blur(5px);opacity:.3;transition:filter .5s ease,opacity .5s ease}
.journey-detail-panel .jd-desc{font-size:.88rem;color:#64748b;line-height:1.6;filter:blur(3px);opacity:.22;transition:filter .5s ease,opacity .5s ease}
.journey-detail-panel.is-live .jd-step{opacity:1;transform:translateY(0)}
.journey-detail-panel.is-live .jd-title{filter:blur(0);opacity:1}
.journey-detail-panel.is-live .jd-desc{filter:blur(0);opacity:1}
.journey-scrub{position:relative}
.journey-trigger{height:520px}
.journey-tail{height:60vh}
.journey-list-mobile{display:none}
.step-connector{display:none}

/* Comparison */
.comparison{padding:80px 0}
.compare-wrap{display:grid;grid-template-columns:1fr auto 1fr;gap:0;max-width:820px;margin:0 auto;align-items:start}
.compare-col{padding:28px 26px;border-radius:16px}
.compare-col.old{background:#fef2f2;border:1px solid #fecaca}
.compare-col.new{background:#eff6ff;border:1px solid #bfdbfe}
.compare-col h3{font-size:1rem;margin-bottom:20px;text-align:center}
.compare-col.old h3{color:#dc2626}
.compare-col.new h3{color:#2563eb}
.compare-items{display:flex;flex-direction:column;gap:12px}
.compare-item{display:flex;align-items:flex-start;gap:8px;font-size:.82rem;color:#475569}
.compare-item svg{width:16px;height:16px;flex-shrink:0;margin-top:1px}
.compare-col.old .compare-item svg{color:#dc2626}
.compare-col.new .compare-item svg{color:#2563eb}
.vs-badge{display:flex;align-items:center;justify-content:center;align-self:center;width:46px;height:46px;border-radius:50%;background:#1e293b;color:#fff;font-weight:800;font-size:.72rem;margin:0 -12px;position:relative;z-index:1;flex-shrink:0}

/* Use cases */
.use-cases{padding:64px 0;background:#f8fafc}
/* ── Industries: liquid-glass marquee (seamless circular loop) ── */
.ind-marquee{margin-top:34px;overflow:hidden;width:100%;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%)}
.ind-track{display:flex;flex-wrap:nowrap;width:max-content;gap:16px;will-change:transform;animation:indMarquee 36s linear infinite}
.ind-marquee:hover .ind-track{animation-play-state:paused}
@keyframes indMarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.ind-pill{flex:0 0 auto;position:relative;display:inline-flex;align-items:center;gap:9px;padding:13px 26px;border-radius:100px;font-size:.92rem;font-weight:700;letter-spacing:.005em;color:#1e335c;white-space:nowrap;overflow:hidden;cursor:default;
  background:linear-gradient(135deg,rgba(255,255,255,.92) 0%,rgba(233,238,255,.72) 55%,rgba(245,243,255,.86) 100%);
  border:1px solid rgba(99,102,241,.24);
  box-shadow:0 8px 22px -8px rgba(37,99,235,.30),inset 0 1px 0 rgba(255,255,255,.95),inset 0 -7px 16px rgba(99,102,241,.10);
  -webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);
  transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
.ind-pill:hover{transform:translateY(-3px);box-shadow:0 16px 34px -10px rgba(79,70,229,.45),inset 0 1px 0 rgba(255,255,255,.95)}
.ind-pill .ind-dot{width:9px;height:9px;border-radius:50%;flex:none;box-shadow:0 0 0 3px rgba(255,255,255,.6)}
.ind-pill::before{content:'';position:absolute;top:0;left:-65%;width:45%;height:100%;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.72),transparent);transform:skewX(-16deg);
  animation:indSheen 5s ease-in-out infinite}
@keyframes indSheen{0%,58%{left:-65%}100%{left:140%}}
.ind-pill:nth-child(7n+1) .ind-dot{background:linear-gradient(135deg,#2563eb,#4f46e5)}
.ind-pill:nth-child(7n+2) .ind-dot{background:linear-gradient(135deg,#0891b2,#0ea5e9)}
.ind-pill:nth-child(7n+3) .ind-dot{background:linear-gradient(135deg,#7c3aed,#a855f7)}
.ind-pill:nth-child(7n+4) .ind-dot{background:linear-gradient(135deg,#16a34a,#10b981)}
.ind-pill:nth-child(7n+5) .ind-dot{background:linear-gradient(135deg,#d97706,#f59e0b)}
.ind-pill:nth-child(7n+6) .ind-dot{background:linear-gradient(135deg,#db2777,#f43f5e)}
.ind-pill:nth-child(7n+7) .ind-dot{background:linear-gradient(135deg,#4338ca,#6366f1)}
@media(prefers-reduced-motion:reduce){
  .ind-track{animation:none;flex-wrap:wrap;justify-content:center;width:auto}
  .ind-pill::before{animation:none;display:none}
}

/* CTA */
.cta-section{padding:80px 0;background:linear-gradient(135deg,#2563eb 0%,#4f46e5 60%,#7c3aed 100%);text-align:center;position:relative;overflow:hidden}
.cta-section::before{content:'';position:absolute;top:-120px;right:-100px;width:450px;height:450px;background:radial-gradient(circle,rgba(255,255,255,.08) 0%,transparent 70%);border-radius:50%}
.cta-section h2{color:#fff;margin-bottom:14px;position:relative;z-index:1}
.cta-section p{color:rgba(255,255,255,.8);font-size:1.05rem;margin-bottom:32px;position:relative;z-index:1}
.cta-buttons{display:flex;justify-content:center;gap:14px;margin-bottom:28px;position:relative;z-index:1;flex-wrap:wrap}
.btn-white{background:#fff;color:#2563eb;font-weight:600;padding:14px 32px;border-radius:10px;box-shadow:0 4px 16px rgba(0,0,0,.1);transition:all .25s}
.btn-white:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(0,0,0,.15)}
.btn-ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.35);padding:14px 32px;border-radius:10px;transition:all .25s;font-size:.925rem;font-weight:600}
.btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.1)}
.cta-trust{display:flex;justify-content:center;gap:28px;position:relative;z-index:1;flex-wrap:wrap}
.cta-trust span{font-size:.75rem;color:rgba(255,255,255,.75);display:flex;align-items:center;gap:6px}

/* Footer */
.footer{padding:44px 0;border-top:1px solid #e2e8f0}
.seo-footer{background:#0f172a;color:#94a3b8;padding:40px 24px 24px}
.seo-footer-grid{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:28px}
.seo-footer strong{color:#f8fafc;font-size:1rem}
.seo-footer p{font-size:.85rem;margin-top:6px}
.seo-footer-col{display:flex;flex-direction:column;gap:6px}
.seo-footer-col b{color:#e2e8f0;font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px}
.seo-footer-col a{color:#94a3b8;font-size:.85rem;text-decoration:none;transition:color .2s}
.seo-footer-col a:hover{color:#fff;text-decoration:none}
.seo-footer-bottom{max-width:1100px;margin:28px auto 0;padding-top:20px;border-top:1px solid #1e293b;display:flex;flex-wrap:wrap;gap:16px;font-size:.8rem}
.seo-footer-bottom a{color:#94a3b8;text-decoration:none}
.seo-footer-bottom a:hover{color:#fff}

/* Scroll top */
.scroll-top-btn{position:fixed;bottom:28px;right:28px;z-index:200;width:44px;height:44px;border:none;border-radius:50%;background:#2563eb;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 14px rgba(37,99,235,.35);opacity:0;visibility:hidden;transform:translateY(16px);transition:opacity .3s ease,visibility .3s ease,transform .3s ease}
.scroll-top-btn.visible{opacity:1;visibility:visible;transform:translateY(0)}
.scroll-top-btn:hover{background:#1d4ed8}
.scroll-top-btn svg{width:20px;height:20px}

/* Responsive */
@media(max-width:1024px){
  h1{font-size:2.6rem}h2{font-size:2rem}
  .wave-card.active,.wave-card.peek{width:min(240px,72vw)}
  .journey-trigger{height:460px}
  .journey-wave-wrap{height:calc(100vh - 56px);top:56px}
  .feature-block .wrap{grid-template-columns:1fr;gap:40px;text-align:center}
  .feature-block.reverse .wrap{direction:ltr}
  .feature-bullets{align-items:center}
  .stats .wrap{grid-template-columns:repeat(2,1fr);gap:24px}
  .pillars-grid{grid-template-columns:1fr 1fr}
  .compare-wrap{grid-template-columns:1fr;gap:16px}
  .vs-badge{margin:0 auto}
}
@media(max-width:768px){
  h1{font-size:2.1rem}h2{font-size:1.7rem}
  .hero{padding:0 0 48px}
  .hero-content-below{padding:36px 20px 48px}
  .hero-badge{margin-bottom:28px;font-size:.76rem;padding:6px 14px}
  .hero-headline{margin-bottom:24px}
  .hero-lead{margin-bottom:32px;font-size:1.05rem}
  .hero-buttons{flex-direction:column;width:100%;max-width:320px;margin-left:auto;margin-right:auto}
  .hero-buttons .btn{width:100%;justify-content:center}
  .why-talentrally{padding:52px 0 56px}
  .why-talentrally-grid{grid-template-columns:1fr;gap:20px}
  .stats .wrap{grid-template-columns:1fr 1fr}
  .pillars-grid{grid-template-columns:1fr}
  .nav-links{display:none}
  .nav-actions .btn.btn-primary{display:none}
  .journey-rail{max-width:100%}
  .journey-wave-wrap{display:none}
  .journey-scrub{display:none}
  .journey-list-mobile{display:block;max-width:560px;margin:0 auto;padding:0 6px}
  .journey-row{min-height:0;display:flex;flex-direction:column;justify-content:center;padding:18px 0;border-bottom:1px solid #e9eef5}
  .journey-row:last-child{border-bottom:none}
  .journey-row h4{font-size:1.05rem;font-weight:700;color:#0f172a;margin:5px 0 0}
  .journey-row .js-desc{font-size:.86rem;color:#64748b;line-height:1.6;margin-top:7px}
  .nav-actions a.signin{background:#2563eb;color:#fff;border-radius:8px;padding:8px 18px;font-weight:600}
  .seo-footer-grid{grid-template-columns:1fr 1fr}
  .dash-kpis{grid-template-columns:1fr}
}
@media(max-width:480px){
  h1{font-size:1.75rem}
  .stats .wrap{grid-template-columns:1fr;gap:16px}
  .stat-item .number{font-size:2rem}
}

/* ===== Scroll progress bar ===== */
.scroll-progress-bar{position:fixed;top:0;left:0;height:3px;width:100%;z-index:9000;background:transparent;pointer-events:none}
.scroll-progress-bar i{display:block;height:100%;width:0%;transform-origin:left;background:linear-gradient(90deg,#2563eb,#4f46e5,#7c3aed);box-shadow:0 0 12px rgba(124,58,237,.45)}

/* ===== "In plain English" story band ===== */
.story-band{position:relative;padding:96px 0 88px;background:linear-gradient(180deg,#f4f7fb 0%,#eef2fb 45%,#f4f7fb 100%);overflow:visible}
.story-band::before{content:'';position:absolute;inset:0;background:radial-gradient(640px 360px at 12% 20%,rgba(37,99,235,.07),transparent 60%),radial-gradient(560px 360px at 88% 80%,rgba(124,58,237,.07),transparent 60%);pointer-events:none}
.story-track{position:relative;margin-top:56px}
/* ── Notebook-stack scroll: each chapter pins, the next rises from below and lays on top.
   Incremental sticky offsets make each previous card's top edge peek behind the current one. ── */
.story-chapter{position:sticky;top:80px;display:grid;grid-template-columns:200px 1fr;gap:36px;align-items:center;padding:30px 30px;border-radius:22px;background:#fff;border:1px solid #e7ecf5;box-shadow:0 22px 56px -24px rgba(30,41,59,.40),0 1px 0 rgba(255,255,255,.85) inset;margin-bottom:clamp(56px,22vh,210px);transform-origin:50% 0%;will-change:transform;backface-visibility:hidden}
.story-chapter:nth-child(1){top:80px;z-index:1}
.story-chapter:nth-child(2){top:92px;z-index:2}
.story-chapter:nth-child(3){top:104px;z-index:3}
.story-chapter:nth-child(4){top:116px;z-index:4}
.story-chapter:nth-child(5){top:128px;z-index:5}
.story-chapter:nth-child(6){top:140px;z-index:6}
.story-chapter:last-child{margin-bottom:clamp(120px,42vh,380px)}
.story-chapter{transition:filter .45s ease}
.story-chapter.is-stacked{filter:brightness(.955) saturate(.94)}
.story-chapter:nth-child(even){grid-template-columns:1fr 200px}
.story-chapter:nth-child(even) .story-visual{order:2}
.story-visual{position:relative;width:200px;height:152px;border-radius:16px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#eff6ff,#f5f3ff);overflow:hidden;flex-shrink:0}
.story-visual svg{width:104px;height:104px;position:relative;z-index:2}
.story-visual .sv-orb{position:absolute;border-radius:50%;background:linear-gradient(135deg,rgba(37,99,235,.16),rgba(124,58,237,.16));filter:blur(2px)}
.story-tag{display:inline-block;font-family:'Syne',sans-serif;font-size:.66rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#7c3aed;background:#f5f3ff;border-radius:999px;padding:4px 12px;margin-bottom:10px}
.story-tag-red{color:#dc2626;background:#fef2f2}
.story-tag-blue{color:#1d4ed8;background:#eff6ff}
.story-tag-green{color:#16a34a;background:#f0fdf4}
.story-tag-indigo{color:#4338ca;background:#eef2ff}
.story-tag-purple{color:#7c3aed;background:#f5f3ff}
.story-copy h3{font-size:clamp(1.08rem,2.1vw,1.4rem);line-height:1.32;margin:0 0 8px;letter-spacing:-.01em}
.story-copy p{margin:0;color:#64748b;font-size:.96rem;line-height:1.6;max-width:52ch}
.story-band-foot{margin-top:40px;text-align:center;opacity:0;transform:translateY(20px)}
.story-band-foot p{color:#64748b;font-size:1rem;margin:0 0 18px}
.story-band-foot strong{color:#1e293b}
@media(max-width:760px){
  .story-chapter,.story-chapter:nth-child(even){grid-template-columns:1fr;text-align:center}
  .story-chapter:nth-child(even) .story-visual{order:0}
  .story-visual{margin:0 auto}
  .story-copy p{margin:0 auto}
  .story-chapter{padding:22px 20px;margin-bottom:clamp(40px,16vh,140px)}
  .story-chapter:last-child{margin-bottom:clamp(90px,34vh,300px)}
  .story-chapter:nth-child(1){top:70px}
  .story-chapter:nth-child(2){top:80px}
  .story-chapter:nth-child(3){top:90px}
  .story-chapter:nth-child(4){top:100px}
  .story-chapter:nth-child(5){top:110px}
  .story-chapter:nth-child(6){top:120px}
}
@media(prefers-reduced-motion:reduce){
  .story-chapter,.story-band-foot{opacity:1!important;transform:none!important}
  .scroll-progress-bar{display:none}
}

/* ══════════════════════════════════════════════════════════
   HORIZONTAL SCREENING CARDS  (scroll-sticky)
   Six 21st.dev card variants — each attribute activates on scroll
══════════════════════════════════════════════════════════ */
.hsc-section{position:relative;height:420vh;display:none}
.hsc-sticky{position:sticky;top:0;height:100vh;min-height:580px;overflow:hidden;background:linear-gradient(165deg,#060d1f 0%,#0b1729 55%,#060c1c 100%);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 0 10px}
.hsc-sticky::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:44px 44px;pointer-events:none;z-index:0}
.hsc-sticky::after{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:800px;height:300px;background:radial-gradient(ellipse at 50% 0%,rgba(79,70,229,.12) 0%,transparent 70%);pointer-events:none;z-index:0}
/* header */
.hsc-header{position:relative;z-index:2;text-align:center;margin-bottom:clamp(12px,1.6vh,22px);padding:0 20px}
.hsc-badge.section-badge{background:rgba(79,70,229,.18);color:#a5b4fc;border:1px solid rgba(99,102,241,.28);margin-bottom:10px}
.hsc-title{font-size:clamp(1.45rem,2.8vw,2.3rem);color:#fff;letter-spacing:-.03em;line-height:1.1;margin-bottom:5px}
.hsc-sub{font-size:.8rem;color:rgba(255,255,255,.35);max-width:440px;margin:0 auto;font-weight:400;line-height:1.5}
/* cards row */
.hsc-cards{position:relative;z-index:2;display:flex;flex-direction:row;align-items:stretch;gap:9px;padding:0 clamp(8px,1.5vw,16px)}
/* base card */
.hsc-card{position:relative;width:164px;height:260px;flex-shrink:0;border-radius:14px;background:rgba(14,22,44,.97);overflow:visible;will-change:transform;transform:scale(0.88);opacity:0.55;transition:transform 0.44s cubic-bezier(.22,.68,0,1.28),opacity 0.34s ease,box-shadow 0.32s ease}
.hsc-card.hcc-active{transform:scale(1.07);opacity:1}
.hsc-card.hcc-done{transform:scale(0.93);opacity:0.72}
.hcc-inner{position:relative;z-index:5;display:flex;flex-direction:column;align-items:center;gap:5px;padding:15px 12px 13px;width:100%;height:100%}
.hcc-step{font-family:'Syne',sans-serif;font-size:.52rem;font-weight:800;color:rgba(255,255,255,.42);letter-spacing:.14em;text-transform:uppercase}
.hcc-icon{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-bottom:1px}
.hcc-icon svg{width:20px;height:20px}
.hci-1{background:rgba(37,99,235,.32);border:1px solid rgba(99,162,250,.52)}
.hci-2{background:rgba(79,70,229,.32);border:1px solid rgba(99,102,241,.52)}
.hci-3{background:rgba(99,102,241,.32);border:1px solid rgba(129,140,248,.52)}
.hci-4{background:rgba(124,58,237,.32);border:1px solid rgba(139,92,246,.52)}
.hci-5{background:rgba(147,51,234,.32);border:1px solid rgba(167,139,250,.52)}
.hci-6{background:rgba(22,163,74,.32);border:1px solid rgba(74,222,128,.52)}
.hcc-name{font-family:'Syne',sans-serif;font-size:.73rem;font-weight:800;color:rgba(255,255,255,.65);text-align:center;line-height:1.2;letter-spacing:.005em;transition:color .3s}
.hsc-card.hcc-active .hcc-name{color:#fff}
/* scan line */
.hcc-scan{position:absolute;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,rgba(99,102,241,.82),transparent);top:28%;opacity:0;z-index:10;pointer-events:none}
.hsc-card.hcc-active .hcc-scan{opacity:1;animation:hccScan 1.9s ease-in-out infinite}
@keyframes hccScan{0%{top:15%;opacity:.5}50%{top:85%;opacity:1}100%{top:15%;opacity:.5}}
/* common tag row at bottom */
.hcc-tags{display:flex;flex-wrap:wrap;gap:3px;justify-content:center;margin-top:auto;padding-top:3px}
.hcc-tag{font-size:.45rem;font-weight:700;padding:2px 5px;border-radius:999px;background:rgba(255,255,255,.1);color:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.18)}
.hcc-tag.ok{color:#4ade80;background:rgba(74,222,128,.14);border-color:rgba(74,222,128,.38)}

/* ── DOTS variant (Resume Parse) ── */
.hcc-dots{border:1px dashed rgba(99,118,145,.6)}
.hcc-dots::before{content:'';position:absolute;top:10px;left:0;right:0;height:1px;background:rgba(99,118,145,.42);z-index:1;pointer-events:none}
.hcc-dots::after{content:'';position:absolute;bottom:10px;left:0;right:0;height:1px;background:rgba(99,118,145,.42);z-index:1;pointer-events:none}
.hcd-dot{position:absolute;width:6px;height:6px;border-radius:50%;background:#4ade80;outline:4px solid rgba(14,22,44,.97);z-index:3}
.hcd-dot.tl{top:7px;left:-3px}.hcd-dot.tr{top:7px;right:-3px}
.hcd-dot.bl{bottom:7px;left:-3px}.hcd-dot.br{bottom:7px;right:-3px}
.hcc-dots.hcc-active{border-color:rgba(96,165,250,.85);box-shadow:0 0 28px rgba(37,99,235,.48),0 0 0 1px rgba(96,165,250,.3)}
.hcc-fields{display:flex;flex-direction:column;gap:3px;width:100%;margin-top:4px}
.hcc-field{display:flex;align-items:center;gap:5px;font-size:.48rem;color:rgba(255,255,255,.52);opacity:0;transform:translateX(-5px);transition:opacity .22s,transform .22s,color .22s}
.hcf-dot{width:5px;height:5px;border-radius:50%;flex-shrink:0;background:#4ade80}
.hsc-card.hcc-active .hcc-field{opacity:1;transform:translateX(0);color:rgba(255,255,255,.88)}
.hsc-card.hcc-active .hcc-field:nth-child(1){transition-delay:.05s}
.hsc-card.hcc-active .hcc-field:nth-child(2){transition-delay:.12s}
.hsc-card.hcc-active .hcc-field:nth-child(3){transition-delay:.19s}
.hsc-card.hcc-active .hcc-field:nth-child(4){transition-delay:.26s}
.hsc-card.hcc-done .hcc-field{opacity:1;transform:translateX(0);color:rgba(255,255,255,.52);transition-delay:0s!important}

/* ── GRADIENT variant (AI Score) ── */
.hcc-grad{border:none}
.hcg-line{position:absolute;z-index:1;pointer-events:none}
.hcg-line.top{top:0;left:0;right:0;height:1.5px;background:linear-gradient(90deg,transparent,rgba(79,70,229,.65),rgba(147,51,234,.65),transparent)}
.hcg-line.bot{bottom:0;left:0;right:0;height:1.5px;background:linear-gradient(90deg,transparent,rgba(37,99,235,.65),rgba(79,70,229,.65),transparent)}
.hcg-line.lft{left:0;top:0;bottom:0;width:1.5px;background:linear-gradient(180deg,transparent,rgba(79,70,229,.58),transparent)}
.hcg-line.rgt{right:0;top:0;bottom:0;width:1.5px;background:linear-gradient(180deg,transparent,rgba(147,51,234,.58),transparent)}
.hcc-grad.hcc-active .hcg-line.top{background:linear-gradient(90deg,transparent,rgba(99,102,241,1),rgba(167,139,250,1),transparent);filter:drop-shadow(0 0 8px rgba(99,102,241,.75))}
.hcc-grad.hcc-active .hcg-line.bot{background:linear-gradient(90deg,transparent,rgba(37,99,235,1),rgba(99,102,241,1),transparent);filter:drop-shadow(0 0 7px rgba(37,99,235,.7))}
.hcc-grad.hcc-active .hcg-line.lft,.hcc-grad.hcc-active .hcg-line.rgt{filter:drop-shadow(0 0 5px rgba(99,102,241,.6))}
.hcc-score-wrap{width:100%;display:flex;flex-direction:column;gap:4px;margin-top:6px}
.hcc-score-val{font-family:'Syne',sans-serif;font-weight:900;font-size:1.8rem;color:rgba(255,255,255,.42);text-align:center;letter-spacing:-.03em;transition:color .4s;line-height:1.05}
.hsc-card.hcc-active .hcc-score-val{color:#c7d2fe}
.hcc-score-bar{height:5px;border-radius:3px;background:rgba(255,255,255,.14);overflow:hidden;margin-top:1px}
.hcc-score-fill{height:100%;width:0%;border-radius:3px;background:linear-gradient(90deg,#4f46e5,#7c3aed);transition:width 1.35s cubic-bezier(.22,.68,0,1.2)}
.hcc-score-lbl{font-size:.46rem;color:rgba(255,255,255,.48);text-align:center;font-weight:600;text-transform:uppercase;letter-spacing:.07em}

/* ── CORNERS variant (Domain Fit) ── */
.hcc-crn{border:1px dashed rgba(99,118,145,.42)}
.hc-crnel{position:absolute;width:14px;height:14px;z-index:3;pointer-events:none;border-color:rgba(255,255,255,.62)}
.hc-crnel.tl{top:-1px;left:-1px;border-top:2px solid;border-left:2px solid;border-radius:2px 0 0 0}
.hc-crnel.tr{top:-1px;right:-1px;border-top:2px solid;border-right:2px solid;border-radius:0 2px 0 0}
.hc-crnel.bl{bottom:-1px;left:-1px;border-bottom:2px solid;border-left:2px solid;border-radius:0 0 0 2px}
.hc-crnel.br{bottom:-1px;right:-1px;border-bottom:2px solid;border-right:2px solid;border-radius:0 0 2px 0}
.hcc-crn.hcc-active .hc-crnel{border-color:#818cf8;filter:drop-shadow(0 0 6px rgba(99,102,241,.85))}
.hcc-crn.hcc-done .hc-crnel{border-color:rgba(74,222,128,.65)}
.hcc-crn.hcc-active{box-shadow:0 0 32px rgba(99,102,241,.38),0 0 0 1px rgba(129,140,248,.22)}
.hcc-dtags{display:flex;flex-direction:column;gap:4px;width:100%;margin-top:5px}
.hcc-dtag{font-size:.5rem;font-weight:700;padding:3px 8px;border-radius:7px;text-align:center;opacity:0;transform:scale(.85) translateY(4px);transition:opacity .24s,transform .24s}
.hcc-dtag.ok{color:#86efac;background:rgba(74,222,128,.18);border:1px solid rgba(74,222,128,.38)}
.hcc-dtag.no{color:#fca5a5;background:rgba(248,113,113,.18);border:1px solid rgba(248,113,113,.38)}
.hsc-card.hcc-active .hcc-dtag{opacity:1;transform:scale(1) translateY(0)}
.hsc-card.hcc-active .hcc-dtag:nth-child(2){transition-delay:.1s}
.hsc-card.hcc-active .hcc-dtag:nth-child(3){transition-delay:.2s}
.hsc-card.hcc-done .hcc-dtag{opacity:.7;transform:scale(1) translateY(0);transition-delay:0s!important}

/* ── NEUBRUTALISM variant (Experience) ── */
.hcc-neu2{border:1px solid rgba(255,255,255,.62);box-shadow:4px 4px 0 rgba(255,255,255,.38)}
.hcc-neu2.hcc-active{border-color:rgba(139,92,246,.95);box-shadow:5px 5px 0 rgba(124,58,237,.72),0 0 36px rgba(124,58,237,.48)}
.hcc-neu2.hcc-done{border-color:rgba(74,222,128,.55);box-shadow:4px 4px 0 rgba(74,222,128,.42)}
.hcc-exp-wrap{width:100%;display:flex;flex-direction:column;gap:5px;margin-top:6px}
.hcc-exp-nums{display:flex;align-items:baseline;justify-content:space-between;width:100%}
.hcc-exp-val{font-family:'Syne',sans-serif;font-weight:900;font-size:1.8rem;color:rgba(255,255,255,.42);letter-spacing:-.03em;transition:color .4s;line-height:1.05}
.hsc-card.hcc-active .hcc-exp-val{color:#d8b4fe}
.hcc-exp-req{font-size:.46rem;color:rgba(255,255,255,.48);font-weight:600}
.hcc-exp-bar{height:5px;border-radius:3px;background:rgba(255,255,255,.14);overflow:hidden}
.hcc-exp-fill{height:100%;width:0%;border-radius:3px;background:linear-gradient(90deg,#7c3aed,#a855f7);transition:width 1.2s ease}

/* ── PLUS variant (Skills Match) ── */
.hcc-plus-v{border:1px dashed rgba(99,118,145,.56)}
.hc-plus-el{position:absolute;width:14px;height:14px;display:flex;align-items:center;justify-content:center;font-size:.84rem;font-weight:900;color:rgba(148,163,184,.58);line-height:1;z-index:3;pointer-events:none;transition:color .3s,filter .3s}
.hc-plus-el.tl{top:-8px;left:-8px}.hc-plus-el.tr{top:-8px;right:-8px}
.hc-plus-el.bl{bottom:-8px;left:-8px}.hc-plus-el.br{bottom:-8px;right:-8px}
.hcc-plus-v.hcc-active{box-shadow:0 0 32px rgba(147,51,234,.42),0 0 0 1px rgba(167,139,250,.2)}
.hsc-card.hcc-active .hc-plus-el{color:#c4b5fd;filter:drop-shadow(0 0 8px rgba(167,139,250,.9))}
.hsc-card.hcc-done .hc-plus-el{color:rgba(74,222,128,.7)}
.hcc-skills{display:flex;flex-direction:column;gap:3.5px;width:100%;margin-top:4px}
.hcc-skill{display:flex;align-items:center;gap:5px;font-size:.48rem;color:rgba(255,255,255,.52);opacity:0;transform:translateX(-5px);transition:opacity .22s,transform .22s}
.hcs-dot{width:5px;height:5px;border-radius:50%;flex-shrink:0}
.hcs-dot.ok{background:#4ade80}.hcs-dot.no{background:#f87171}
.hcs-st{margin-left:auto;font-weight:700;font-size:.46rem}
.hcs-st.ok{color:#4ade80}.hcs-st.no{color:#f87171}
.hsc-card.hcc-active .hcc-skill{opacity:1;transform:translateX(0);color:rgba(255,255,255,.88)}
.hsc-card.hcc-active .hcc-skill:nth-child(2){transition-delay:.09s}
.hsc-card.hcc-active .hcc-skill:nth-child(3){transition-delay:.18s}
.hsc-card.hcc-active .hcc-skill:nth-child(4){transition-delay:.27s}
.hsc-card.hcc-done .hcc-skill{opacity:1;transform:translateX(0);color:rgba(255,255,255,.52);transition-delay:0s!important}

/* ── VERDICT variant (Final Decision) ── */
.hcc-verdict-v{background:linear-gradient(165deg,rgba(22,163,74,.18) 0%,rgba(14,22,44,.97) 65%);border:1px solid rgba(34,197,94,.45)}
.hcc-verdict-v.hcc-active{border-color:rgba(34,197,94,.85);box-shadow:0 0 40px rgba(22,163,74,.5),0 0 0 1px rgba(34,197,94,.3)}
.hcc-verdict-v.hcc-done{border-color:rgba(34,197,94,.55)}
.hcc-vicon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;margin-bottom:1px}
.hcc-vicon svg{width:44px;height:44px}
.vi-check{opacity:0;transform:scale(0.25) rotate(-12deg);transition:opacity .35s .08s,transform .42s cubic-bezier(.34,1.56,.64,1) .06s}
.hsc-card.hcc-active .vi-check,.hsc-card.hcc-done .vi-check{opacity:1;transform:scale(1) rotate(0deg)}
.hcc-vrow{display:flex;align-items:center;gap:5px;width:100%;justify-content:space-between;margin-top:2px}
.hcv-name{font-size:.57rem;font-weight:700;color:rgba(255,255,255,.82)}
.hcv-score{font-family:'Syne',sans-serif;font-weight:900;font-size:.76rem;color:#4ade80;background:rgba(74,222,128,.18);border:1px solid rgba(74,222,128,.42);border-radius:6px;padding:2px 6px}
.hcv-decision{font-size:.53rem;font-weight:700;color:#86efac;width:100%;text-align:center;opacity:0;transform:translateY(5px);transition:opacity .3s .2s,transform .3s .2s}
.hsc-card.hcc-active .hcv-decision,.hsc-card.hcc-done .hcv-decision{opacity:1;transform:translateY(0)}
.hcv-meta{font-size:.44rem;color:rgba(255,255,255,.48);text-align:center;width:100%;opacity:0;transition:opacity .3s .32s}
.hsc-card.hcc-active .hcv-meta,.hsc-card.hcc-done .hcv-meta{opacity:1}
/* progress bar */
.hsc-progress{position:relative;z-index:2;display:flex;align-items:center;gap:8px;margin-top:clamp(10px,1.6vh,18px)}
.hsp-track{position:relative;width:172px;height:2px;background:rgba(255,255,255,.1);border-radius:2px;overflow:hidden}
.hsp-fill-inner{position:absolute;left:0;top:0;bottom:0;width:0%;background:linear-gradient(90deg,#4f46e5,#7c3aed);border-radius:2px;transition:width .32s ease}
.hsp-dots{display:flex;gap:6px;align-items:center}
.hsp-dot{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.16);cursor:pointer;transition:background .28s,transform .22s}
.hsp-dot.active{background:#6366f1;transform:scale(1.55)}
.hsp-dot.done{background:rgba(99,102,241,.42)}
/* responsive */
@media(max-width:1160px){.hsc-card{width:148px;height:248px}.hsc-cards{gap:7px}}
@media(max-width:920px){.hsc-section{height:360vh}.hsc-card{width:130px;height:232px}.hcc-score-val,.hcc-exp-val{font-size:1.4rem}}
@media(max-width:640px){
  .hsc-section{height:auto}
  .hsc-sticky{position:relative;top:auto;height:auto;min-height:0;padding:48px 16px 44px}
  .hsc-cards{flex-direction:column;align-items:center;width:100%;max-width:300px;margin:0 auto}
  .hsc-card{width:100%;height:auto;transform:none!important;opacity:1!important;margin-bottom:12px}
  .hsc-card.hcc-active,.hsc-card.hcc-done{transform:none!important}
  .hsc-progress{display:none}
}
@media(prefers-reduced-motion:reduce){.hcc-scan{animation:none!important}.hsc-card{transition:opacity .2s!important}}

.tin-stage{max-width:460px;margin:0 auto;background:#0b1729;border:1px solid #16233d;border-radius:18px;padding:22px 20px;box-shadow:0 24px 60px rgba(8,15,30,.28);position:relative;overflow:hidden}
.tin-stage::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:34px 34px;pointer-events:none}
.tin-search{display:flex;align-items:center;gap:9px;background:#111f38;border:1px solid #294166;border-radius:11px;padding:10px 13px;position:relative;z-index:1}
.tin-search svg{width:16px;height:16px;flex:none}
.tin-search .tin-q{font-size:.82rem;color:#cbd5e1;font-weight:600}
.tin-search .tin-caret{width:1.5px;height:15px;background:#5b8cff;animation:tinCaret 1.05s steps(1) infinite;margin-left:1px}
@keyframes tinCaret{50%{opacity:0}}
.tin-bank{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:15px;position:relative;z-index:1}
.tin-chip{background:#101d33;border:1px solid #223352;border-radius:10px;padding:9px 6px;text-align:center;transition:transform .5s cubic-bezier(.2,.7,.2,1),border-color .5s,box-shadow .5s;opacity:.55}
.tin-chip .tin-av{width:24px;height:24px;border-radius:50%;margin:0 auto 5px;font-size:.6rem;font-weight:700;color:#fff;display:flex;align-items:center;justify-content:center}
.tin-chip .tin-nm{font-size:.58rem;color:#94a3b8;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tin-chip .tin-mt{font-size:.56rem;color:#475569;margin-top:2px}
.tin-chip.match{opacity:1;border-color:#2f6df6;box-shadow:0 8px 22px rgba(47,109,246,.28);transform:translateY(-3px)}
.tin-chip.match .tin-mt{color:#34d399}
.tin-foot{display:flex;align-items:center;justify-content:space-between;margin-top:15px;position:relative;z-index:1}
.tin-foot .tin-reuse{font-size:.7rem;color:#93c5fd;font-weight:700;display:flex;align-items:center;gap:6px}
.tin-foot .tin-count{font-size:.66rem;color:#64748b}
.tin-pulse{display:inline-block;width:7px;height:7px;border-radius:50%;background:#34d399;box-shadow:0 0 0 0 rgba(52,211,153,.6);animation:tinPulse 1.8s infinite}
@keyframes tinPulse{0%{box-shadow:0 0 0 0 rgba(52,211,153,.5)}70%{box-shadow:0 0 0 7px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}

.pricing{padding:84px 0;background:#f4f7fb}
.pricing .section-header{text-align:center;margin-bottom:14px}
.pricing-note{text-align:center;color:#64748b;font-size:.9rem;margin-bottom:34px}
.pricing-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;max-width:1080px;margin:0 auto}
.price-card{background:#fff;border:1px solid #e7edf5;border-radius:16px;padding:26px 22px;display:flex;flex-direction:column;box-shadow:0 14px 36px rgba(15,23,42,.05);position:relative;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,border-color .35s}
.price-card:hover{transform:translateY(-6px);box-shadow:0 26px 60px rgba(37,99,235,.13);border-color:#c7d7f5}
.price-card.popular{border-color:#2563eb;box-shadow:0 26px 60px rgba(37,99,235,.18)}
.price-tag{position:absolute;top:-11px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,#2563eb,#4f46e5);color:#fff;font-size:.64rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:5px 12px;border-radius:100px;white-space:nowrap}
.price-card h3{font-size:1.12rem;color:#0f172a;margin-bottom:6px}
.price-card .pc-amt{font-size:1.9rem;font-weight:800;color:#1e293b;font-family:'Syne',sans-serif;line-height:1}
.price-card .pc-amt small{font-size:.8rem;font-weight:600;color:#94a3b8}
.price-card .pc-amt.custom{font-size:1.5rem}
.price-card ul{list-style:none;margin:18px 0 22px;padding:0;display:flex;flex-direction:column;gap:10px}
.price-card li{display:flex;gap:8px;align-items:flex-start;font-size:.84rem;color:#475569}
.price-card li svg{width:15px;height:15px;flex:none;margin-top:2px}
.price-card .pc-btn{margin-top:auto;display:block;text-align:center;padding:11px;border-radius:10px;font-weight:700;font-size:.86rem;text-decoration:none;transition:.2s}
.price-card .pc-btn.solid{background:linear-gradient(135deg,#2563eb,#4f46e5);color:#fff}
.price-card .pc-btn.solid:hover{filter:brightness(1.08)}
.price-card .pc-btn.ghost{background:#f1f5f9;color:#2563eb}
.price-card .pc-btn.ghost:hover{background:#e2e8f0}
.pricing-foot{text-align:center;color:#64748b;font-size:.84rem;margin-top:26px}
@media(max-width:920px){.pricing-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.pricing-grid{grid-template-columns:1fr}}

/* pricing billing-cycle toggle */

.price-toggle-wrap{text-align:center;margin:0 0 30px}
.price-toggle{display:inline-flex;gap:4px;background:#e8eef7;border-radius:999px;padding:4px}
.pt-btn{border:0;background:transparent;color:#475569;font:inherit;font-weight:600;font-size:.92rem;padding:8px 18px;border-radius:999px;cursor:pointer;display:inline-flex;align-items:center;gap:7px;transition:background .2s,color .2s,box-shadow .2s}
.pt-btn.active{background:#fff;color:#1e293b;box-shadow:0 1px 5px rgba(15,23,42,.12)}
.pt-badge{background:#16a34a;color:#fff;font-size:.66rem;font-weight:700;padding:2px 7px;border-radius:999px;letter-spacing:.02em}
.pc-cycle-note{font-size:.72rem;color:#64748b;margin-top:7px;min-height:1.05em;line-height:1.35}
.pc-cycle-note s{color:#94a3b8}
