/* ═══════════════ TOKENS ═══════════════ */
:root{
  --l50:#faf8ff;--l100:#f1ecff;--l200:#e2d9ff;--l300:#c9b4fd;--l400:#b09bf5;
  --l500:#9b6fe8;--l600:#7c4fd0;--l700:#5f38b0;
  --m100:#d8f5ee;--m300:#7de8d1;--m500:#3ecfb2;--m700:#1ea88e;
  --r100:#fce7f3;--r300:#f4a8d6;--r500:#e91e8c;--r700:#bf166e;
  --yw:#f9c74f;
  --ink:#18103c;--i60:rgba(24,16,60,.6);--i30:rgba(24,16,60,.28);
  --w:#fff;
  --fh:'Outfit',sans-serif;--fs:'Lora',serif;
  --ease:cubic-bezier(.25,.46,.45,.94);--eb:cubic-bezier(.34,1.56,.64,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--fh);background:var(--l50);color:var(--ink);overflow-x:hidden}
a{text-decoration:none;color:inherit}
button{font-family:var(--fh);cursor:pointer}
img{max-width:100%;display:block}

/* ═══════════════ LAYOUT ═══════════════ */
.w{max-width:1140px;margin:0 auto;padding:0 clamp(18px,5vw,52px)}
.sec{padding:clamp(60px,9vw,108px) 0}

/* ═══════════════ TYPE ═══════════════ */
.display{font-size:clamp(2.4rem,6vw,4.8rem);font-weight:900;line-height:1.02;letter-spacing:-.04em}
.h2{font-size:clamp(1.75rem,3.4vw,2.75rem);font-weight:900;line-height:1.08;letter-spacing:-.03em}
.h3{font-size:clamp(1.05rem,1.8vw,1.3rem);font-weight:700;line-height:1.25}
.body{font-size:clamp(.9rem,1.5vw,1.02rem);line-height:1.72;color:var(--i60)}

/* ═══════════════ CHIPS ═══════════════ */
.chip{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:100px;font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.cv{background:var(--l200);color:var(--l700)}
.cm{background:var(--m100);color:var(--m700)}
.cr{background:var(--r100);color:var(--r700)}
.cd{background:var(--ink);color:var(--l300)}
.cy{background:#fff8e0;color:#8a6a00}

/* ═══════════════ BUTTONS ═══════════════ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 26px;border-radius:100px;border:none;font-family:var(--fh);font-weight:700;font-size:.88rem;transition:transform .22s var(--eb),box-shadow .22s var(--ease);cursor:pointer;white-space:nowrap}
.btn:hover{transform:translateY(-3px)}
.bv{background:var(--l500);color:#fff;box-shadow:0 4px 20px rgba(155,111,232,.38)}
.bv:hover{box-shadow:0 12px 36px rgba(155,111,232,.52)}
.bm{background:var(--m500);color:var(--ink);box-shadow:0 4px 20px rgba(62,207,178,.32)}
.bm:hover{box-shadow:0 12px 36px rgba(62,207,178,.45)}
.br{background:var(--r500);color:#fff;box-shadow:0 4px 20px rgba(233,30,140,.35)}
.br:hover{box-shadow:0 12px 36px rgba(233,30,140,.48)}
.bg{background:transparent;color:var(--l600);border:2px solid var(--l300)}
.bg:hover{background:var(--l100);border-color:var(--l500)}
.bw{background:#fff;color:var(--ink);box-shadow:0 4px 20px rgba(0,0,0,.12)}
.bw:hover{box-shadow:0 12px 36px rgba(0,0,0,.2)}
.btn-sm{padding:9px 20px;font-size:.8rem}
.btn-lg{padding:16px 34px;font-size:.95rem}
.btn-full{width:100%}
.btn:disabled{opacity:.55;cursor:not-allowed;transform:none}

/* ═══════════════ SCROLL REVEAL ═══════════════ */
.sr{opacity:0;transform:translateY(28px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.sr.in{opacity:1;transform:none}
.d1{transition-delay:.07s}.d2{transition-delay:.14s}.d3{transition-delay:.22s}.d4{transition-delay:.30s}.d5{transition-delay:.38s}

/* ═══════════════ NAV ═══════════════ */
.nav{position:fixed;top:0;left:0;right:0;z-index:200;padding:0 clamp(18px,5vw,52px);transition:background .3s,box-shadow .3s}
.nav.s{background:rgba(250,248,255,.92);backdrop-filter:blur(20px);box-shadow:0 1px 0 rgba(155,111,232,.1)}
.ni{max-width:1140px;margin:0 auto;height:66px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.logo{display:flex;align-items:center;gap:9px;font-weight:800;font-size:.97rem;color:var(--ink)}
.lm{width:34px;height:34px;border-radius:9px;background:linear-gradient(135deg,var(--l500),var(--m500));display:flex;align-items:center;justify-content:center;font-weight:900;font-size:.78rem;color:#fff}
.nul{display:flex;align-items:center;gap:4px;list-style:none}
.nul a{padding:7px 12px;border-radius:100px;font-size:.83rem;font-weight:500;color:var(--i60);transition:color .2s,background .2s}
.nul a:hover{color:var(--l600);background:var(--l100)}
.ne{display:flex;align-items:center;gap:10px}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:none;padding:6px}
.burger span{display:block;width:22px;height:2px;background:var(--ink);border-radius:2px;transition:.3s}
.drw{position:fixed;inset:0;z-index:199;background:linear-gradient(160deg,var(--l100),var(--l200));display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;transform:translateX(100%);transition:transform .38s var(--ease)}
.drw.open{transform:none}
.drw a{font-size:1.5rem;font-weight:800;color:var(--ink);padding:10px 28px;border-radius:14px;transition:background .2s}
.drw a:hover{background:var(--l200)}
.drx{position:absolute;top:18px;right:22px;background:none;border:none;font-size:1.3rem;color:var(--i60)}
.drbtns{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:20px}

/* ═══════════════ HERO ═══════════════ */
#hero{min-height:100svh;display:flex;align-items:center;background:linear-gradient(165deg,var(--l200) 0%,var(--l100) 48%,var(--m100) 100%);position:relative;overflow:hidden;padding-top:80px}
.orb{position:absolute;border-radius:50%;filter:blur(90px);pointer-events:none}
.o1{width:520px;height:520px;top:-120px;right:-80px;background:radial-gradient(circle,rgba(155,111,232,.3),transparent 70%)}
.o2{width:380px;height:380px;bottom:-100px;left:-60px;background:radial-gradient(circle,rgba(62,207,178,.22),transparent 70%)}
.o3{width:260px;height:260px;top:40%;right:16%;background:radial-gradient(circle,rgba(233,30,140,.13),transparent 70%)}
.hg{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,70px);align-items:center;position:relative;z-index:1;padding:clamp(36px,7vw,72px) 0}
.hbadge{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.72);backdrop-filter:blur(12px);border:1px solid var(--l300);border-radius:100px;padding:7px 15px;margin-bottom:24px;font-size:.74rem;font-weight:700;color:var(--l700);letter-spacing:.07em;text-transform:uppercase;animation:fi .55s both}
.dot{width:7px;height:7px;border-radius:50%;background:var(--m500);animation:blink 2s infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.35}}
.htitle{font-size:clamp(2.5rem,6vw,4.8rem);font-weight:900;line-height:1.0;letter-spacing:-.04em;color:var(--ink);margin-bottom:20px;animation:fi .65s .1s both}
.htitle em{font-family:var(--fs);font-style:italic;font-weight:600;color:var(--l500)}
.hsub{font-size:clamp(.88rem,1.5vw,1rem);line-height:1.75;color:var(--i60);max-width:440px;margin-bottom:14px;animation:fi .65s .18s both}
.htag{display:inline-block;font-family:var(--fs);font-style:italic;font-size:clamp(.9rem,1.4vw,1.05rem);color:var(--l600);font-weight:400;line-height:1.55;margin-bottom:30px;animation:fi .65s .25s both;max-width:430px}
.hbtns{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:40px;animation:fi .65s .32s both}
.hproof{display:flex;align-items:center;gap:14px;animation:fi .65s .4s both}
.avs{display:flex}
.avs span{width:33px;height:33px;border-radius:50%;border:2.5px solid #fff;background:linear-gradient(135deg,var(--l400),var(--m500));display:flex;align-items:center;justify-content:center;font-size:.6rem;font-weight:800;color:#fff;margin-left:-9px}
.avs span:first-child{margin-left:0}
.pt strong{display:block;font-size:.79rem;font-weight:700;color:var(--ink)}
.pt span{font-size:.72rem;color:var(--i60)}
/* hero right */
.hr{position:relative;animation:fi .75s .12s both}
.hcard{background:rgba(255,255,255,.85);backdrop-filter:blur(28px);border:1px solid rgba(255,255,255,.93);border-radius:26px;padding:clamp(22px,3vw,34px);box-shadow:0 24px 80px rgba(155,111,232,.25);animation:float 7s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-12px) rotate(.3deg)}}
.hcp{display:flex;align-items:center;gap:13px;margin-bottom:20px}
.hca{width:54px;height:54px;border-radius:50%;background:linear-gradient(135deg,var(--l500),var(--m500));display:flex;align-items:center;justify-content:center;font-size:1.1rem;font-weight:900;color:#fff;flex-shrink:0}
.hcn{font-size:.95rem;font-weight:800;color:var(--ink);display:block}
.hcr{font-size:.74rem;color:var(--i60);display:block;margin-top:2px}
.htags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:20px}
.ht{padding:5px 11px;border-radius:100px;font-size:.69rem;font-weight:700;letter-spacing:.04em}
.hta{background:var(--l200);color:var(--l700)}.htb{background:var(--m100);color:var(--m700)}.htc{background:var(--r100);color:var(--r700)}
.hq{background:var(--l100);border-radius:12px;padding:14px;font-family:var(--fs);font-style:italic;font-size:.87rem;line-height:1.62;color:var(--l700);border-left:3px solid var(--l400)}
.fc{position:absolute;background:rgba(255,255,255,.92);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.96);border-radius:14px;padding:11px 15px;box-shadow:0 8px 28px rgba(155,111,232,.15);display:flex;align-items:center;gap:10px}
.fc1{bottom:-20px;left:-26px;animation:fl2 5.5s 1.2s ease-in-out infinite}
.fc2{top:-16px;right:-16px;animation:fl2 6.5s .6s ease-in-out infinite}
@keyframes fl2{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.fci{width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:.95rem;flex-shrink:0}
.fcia{background:var(--m100)}.fcib{background:var(--r100)}
.fct strong{font-size:.77rem;font-weight:700;color:var(--ink);display:block}
.fct span{font-size:.68rem;color:var(--i60)}
@keyframes fi{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

/* ═══════════════ TICKER ═══════════════ */
.ticker{background:var(--l500);padding:13px 0;overflow:hidden}
.tt{display:flex;animation:tick 26s linear infinite;white-space:nowrap}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.ti{display:inline-flex;align-items:center;gap:12px;padding:0 24px;font-size:.75rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.82);flex-shrink:0}
.td{color:var(--m300)}

/* ═══════════════ EL PORQUÉ ═══════════════ */
#porque{background:linear-gradient(145deg,var(--m500) 0%,var(--m300) 100%);position:relative;overflow:hidden}
.pq-bg{position:absolute;inset:0;background:radial-gradient(ellipse 70% 60% at 80% 20%,rgba(255,255,255,.12),transparent),radial-gradient(ellipse 50% 50% at 20% 80%,rgba(155,111,232,.2),transparent);pointer-events:none}
.pq-header{text-align:center;margin-bottom:clamp(36px,5vw,56px);position:relative;z-index:1}
.pq-header h2{color:var(--ink);font-size:clamp(1.8rem,3.5vw,2.8rem);font-weight:900;letter-spacing:-.03em;margin-top:10px}
.pq-header p{color:rgba(24,16,60,.65);font-size:.92rem;line-height:1.65;margin-top:10px;max-width:560px;margin-left:auto;margin-right:auto}
.pq-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;position:relative;z-index:1}
.pq-card{background:rgba(255,255,255,.18);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.4);border-radius:22px;padding:clamp(22px,3vw,32px);transition:transform .3s var(--ease),background .3s,box-shadow .3s}
.pq-card:hover{transform:translateY(-6px);background:rgba(255,255,255,.28);box-shadow:0 20px 60px rgba(24,16,60,.15)}
.pq-card-big{background:rgba(155,111,232,.25);border-color:rgba(155,111,232,.4)}
.pq-ico{font-size:1.8rem;margin-bottom:12px}
.pq-label{font-size:.68rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:rgba(24,16,60,.55);margin-bottom:8px;display:block}
.pq-card h3{font-size:clamp(1rem,1.8vw,1.2rem);font-weight:800;color:var(--ink);margin-bottom:10px}
.pq-card p{font-size:.88rem;line-height:1.68;color:rgba(24,16,60,.72)}
.pq-mantra{background:var(--ink);border-radius:20px;padding:clamp(24px,3.5vw,40px);text-align:center;margin-top:20px;position:relative;z-index:1;overflow:hidden}
.pq-mantra::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 50% 0%,rgba(155,111,232,.3),transparent);pointer-events:none}
.pq-mantra p{font-family:var(--fs);font-style:italic;font-size:clamp(1.05rem,2vw,1.45rem);line-height:1.6;color:rgba(255,255,255,.9);position:relative;z-index:1;max-width:720px;margin:0 auto 20px}
.pq-mantra strong{display:block;font-family:var(--fh);font-style:normal;font-size:clamp(1.2rem,2.5vw,1.8rem);font-weight:900;color:var(--m500);letter-spacing:-.02em;position:relative;z-index:1}

/* ═══════════════ PARA QUIÉN ═══════════════ */
#audiences{background:#fff}
.ah{text-align:center;max-width:560px;margin:0 auto clamp(36px,5vw,56px)}
.ag{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.ac{border-radius:26px;padding:clamp(24px,3.5vw,40px);position:relative;overflow:hidden;transition:transform .3s var(--ease),box-shadow .3s}
.ac:hover{transform:translateY(-6px);box-shadow:0 24px 64px rgba(155,111,232,.18)}
.acco{background:linear-gradient(148deg,var(--l200),var(--l300))}
.acpr{background:linear-gradient(148deg,var(--m100),var(--l100))}
.ae{font-size:2.4rem;margin-bottom:16px;display:block}
.ac h3{font-size:clamp(1.1rem,2vw,1.4rem);font-weight:800;color:var(--ink);margin-bottom:9px}
.ac>p{font-size:.88rem;line-height:1.65;color:var(--i60);margin-bottom:20px}
.al{list-style:none;display:flex;flex-direction:column;gap:8px;margin-bottom:24px}
.al li{display:flex;align-items:flex-start;gap:8px;font-size:.84rem;color:var(--ink);line-height:1.5}
.al li::before{content:'';display:block;width:5px;height:5px;border-radius:50%;flex-shrink:0;margin-top:7px;background:var(--l500)}
.acpr .al li::before{background:var(--m500)}
.adn{position:absolute;right:-8px;bottom:-18px;font-size:8rem;font-weight:900;opacity:.06;color:var(--ink);line-height:1;pointer-events:none;letter-spacing:-.05em}

/* ═══════════════ ABOUT ═══════════════ */
#about{background:linear-gradient(158deg,var(--l100) 0%,#fff 65%)}
.abg{display:grid;grid-template-columns:5fr 7fr;gap:clamp(36px,6vw,84px);align-items:center}
.avis{position:relative}
.afr{aspect-ratio:3/4;border-radius:34px;overflow:hidden;background:linear-gradient(148deg,var(--l400),var(--l700));display:flex;align-items:flex-end;justify-content:flex-start;padding:20px;position:relative}
.afr::after{content:'';position:absolute;bottom:0;left:0;right:0;height:35%;background:linear-gradient(to top,rgba(24,16,60,.55),transparent);pointer-events:none;border-radius:0 0 34px 34px}
.about-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 8%;border-radius:34px}
.alc{position:relative;z-index:2;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);border-radius:13px;padding:13px 17px;box-shadow:0 6px 24px rgba(0,0,0,.14)}
.alc strong{display:block;font-size:.88rem;font-weight:800;color:var(--ink)}
.alc span{font-size:.73rem;color:var(--i60)}
.abdg{position:absolute;top:-14px;right:-14px;background:var(--r500);color:#fff;border-radius:14px;padding:13px 16px;text-align:center;box-shadow:0 8px 28px rgba(233,30,140,.38);border:3px solid #fff}
.abdg strong{display:block;font-size:1.4rem;font-weight:900;line-height:1}
.abdg span{font-size:.66rem;opacity:.85;letter-spacing:.04em}
.abc h2{font-size:clamp(1.75rem,3.4vw,2.7rem);font-weight:900;line-height:1.08;letter-spacing:-.03em;margin-bottom:12px}
.abc .lead{font-size:clamp(.95rem,1.6vw,1.1rem);font-weight:500;color:var(--l600);line-height:1.62;margin-bottom:16px;font-family:var(--fs);font-style:italic}
.abc p{font-size:.9rem;line-height:1.75;color:var(--i60);margin-bottom:12px}
.sps{display:flex;flex-wrap:wrap;gap:7px;margin:18px 0 26px}
.sp{background:var(--l100);border:1px solid var(--l200);color:var(--l700);font-size:.75rem;font-weight:600;padding:5px 12px;border-radius:100px;transition:background .2s}
.sp:hover{background:var(--l200)}

/* ═══════════════ SERVICES ═══════════════ */
#services{background:var(--ink);position:relative;overflow:hidden}
.sg1{position:absolute;width:560px;height:360px;top:-120px;left:-100px;background:rgba(155,111,232,.15);border-radius:50%;filter:blur(100px);pointer-events:none}
.sg2{position:absolute;width:360px;height:360px;bottom:-80px;right:-60px;background:rgba(62,207,178,.1);border-radius:50%;filter:blur(100px);pointer-events:none}
.svch{text-align:center;max-width:560px;margin:0 auto clamp(36px,5vw,56px);position:relative;z-index:1}
.svch h2{color:#fff;margin-top:12px}
.svch p{color:rgba(255,255,255,.46);margin-top:11px;font-size:.9rem;line-height:1.65}
.svcg{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;position:relative;z-index:1}
.svc{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:clamp(20px,3vw,28px);transition:transform .3s var(--ease),background .3s,border-color .3s,box-shadow .3s}
.svc:hover{transform:translateY(-5px);background:rgba(255,255,255,.08);border-color:rgba(155,111,232,.38);box-shadow:0 18px 52px rgba(155,111,232,.18)}
.sno{font-size:.62rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.2);margin-bottom:9px}
.sic{width:46px;height:46px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:1.25rem;margin-bottom:14px}
.sica{background:rgba(155,111,232,.2)}.sicb{background:rgba(62,207,178,.2)}.sicc{background:rgba(233,30,140,.2)}
.svc h3{color:#fff;font-size:1rem;margin-bottom:8px;line-height:1.3}
.svc p{color:rgba(255,255,255,.46);font-size:.82rem;line-height:1.62;margin-bottom:14px}
.sm{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:6px;border-top:1px solid rgba(255,255,255,.07);padding-top:13px}
.sdur{font-size:.7rem;color:var(--m300);font-weight:600}
.spric{font-size:.95rem;font-weight:800;color:#fff}
.svc-cta{
  display:inline-flex;align-items:center;gap:5px;
  padding:7px 14px;border-radius:100px;
  background:rgba(155,111,232,.25);border:1px solid rgba(155,111,232,.4);
  color:var(--l300);font-size:.78rem;font-weight:700;font-family:var(--fh);
  letter-spacing:.02em;text-decoration:none;
  transition:background .2s,border-color .2s,transform .2s;
  white-space:nowrap;
}
.svc-cta:hover{background:rgba(155,111,232,.45);border-color:var(--l400);color:#fff;transform:translateY(-1px)}

/* ═══════════════ CV ATS ANALYZER ═══════════════ */
#cvanalyzer{background:linear-gradient(165deg,var(--l100) 0%,var(--l50) 60%,var(--m100) 100%);position:relative;overflow:hidden}
.ats-bg1{position:absolute;width:500px;height:500px;top:-120px;right:-80px;background:radial-gradient(circle,rgba(155,111,232,.18),transparent 70%);border-radius:50%;pointer-events:none;filter:blur(80px)}
.ats-bg2{position:absolute;width:360px;height:360px;bottom:-80px;left:-60px;background:radial-gradient(circle,rgba(62,207,178,.14),transparent 70%);border-radius:50%;pointer-events:none;filter:blur(80px)}

.ats-header{text-align:center;max-width:600px;margin:0 auto clamp(36px,5vw,56px);position:relative;z-index:1}
.ats-header h2{margin-top:12px}
.ats-header p{font-size:.92rem;line-height:1.65;color:var(--i60);margin-top:11px}
.ats-free-badge{display:inline-flex;align-items:center;gap:6px;background:linear-gradient(135deg,var(--yw),#f4a422);color:#5a3a00;padding:6px 16px;border-radius:100px;font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin-bottom:14px;box-shadow:0 4px 16px rgba(249,199,79,.4)}

.ats-wrap{display:grid;grid-template-columns:1fr 1fr;gap:24px;position:relative;z-index:1;align-items:start}

/* Input panel */
.ats-input{background:#fff;border-radius:24px;padding:clamp(22px,3vw,36px);box-shadow:0 8px 40px rgba(155,111,232,.12);border:2px solid var(--l100)}
.ats-steps{display:flex;gap:8px;margin-bottom:22px;overflow-x:auto;padding-bottom:4px}
.ats-step{display:flex;align-items:center;gap:7px;padding:8px 14px;border-radius:100px;font-size:.74rem;font-weight:700;white-space:nowrap;cursor:pointer;transition:all .2s}
.ats-step.active{background:var(--l500);color:#fff}
.ats-step:not(.active){background:var(--l100);color:var(--l600)}
.ats-step-num{width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.66rem;font-weight:900}
.ats-step.active .ats-step-num{background:rgba(255,255,255,.25);color:#fff}
.ats-step:not(.active) .ats-step-num{background:var(--l200);color:var(--l700)}

/* job field */
.ats-field{margin-bottom:14px}
.ats-field label{display:block;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--i60);margin-bottom:6px}
.ats-field input,.ats-field select,.ats-field textarea{width:100%;border:1.5px solid var(--l200);border-radius:12px;padding:11px 14px;font-family:var(--fh);font-size:.88rem;color:var(--ink);outline:none;transition:border-color .2s,box-shadow .2s;background:#fff}
.ats-field input:focus,.ats-field select:focus,.ats-field textarea:focus{border-color:var(--l500);box-shadow:0 0 0 3px rgba(155,111,232,.12)}
.ats-field textarea{resize:vertical;min-height:120px;line-height:1.6}
.ats-field select option{background:#fff}
.char-count{font-size:.7rem;color:var(--i30);text-align:right;margin-top:3px}
.upload-zone{border:2px dashed var(--l300);border-radius:14px;padding:24px;text-align:center;cursor:pointer;transition:all .2s;background:var(--l50);margin-bottom:14px}
.upload-zone:hover{border-color:var(--l500);background:var(--l100)}
.upload-zone p{font-size:.84rem;color:var(--i60);margin-top:6px}
.upload-zone strong{display:block;font-size:.9rem;color:var(--l600);margin-top:4px}
.upload-icon{font-size:2rem;margin-bottom:6px}

/* tabs cv/job */
.input-tabs{display:flex;background:var(--l100);border-radius:12px;padding:4px;margin-bottom:16px;gap:4px}
.input-tab{flex:1;padding:8px 12px;border-radius:9px;border:none;font-family:var(--fh);font-size:.82rem;font-weight:600;cursor:pointer;transition:all .2s;text-align:center;background:transparent;color:var(--i60)}
.input-tab.active{background:#fff;color:var(--l600);box-shadow:0 2px 8px rgba(155,111,232,.12)}

/* Results panel */
.ats-results{background:#fff;border-radius:24px;padding:clamp(22px,3vw,36px);box-shadow:0 8px 40px rgba(155,111,232,.12);border:2px solid var(--l100);min-height:420px;display:flex;flex-direction:column}
.ats-placeholder{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px;color:var(--i60)}
.ats-placeholder-icon{font-size:3rem;margin-bottom:14px;opacity:.5}
.ats-placeholder p{font-size:.88rem;line-height:1.65;max-width:260px}
.ats-loading{display:none;flex:1;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:16px}
.ats-loading.show{display:flex}
.spin{width:48px;height:48px;border-radius:50%;border:3px solid var(--l200);border-top-color:var(--l500);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.ats-loading p{font-size:.88rem;color:var(--i60);font-style:italic}
.ats-loading .loading-steps{display:flex;flex-direction:column;gap:6px;font-size:.78rem;color:var(--i60);margin-top:4px}
.ats-loading .ls{opacity:.4;transition:opacity .3s}
.ats-loading .ls.active{opacity:1;color:var(--l600);font-weight:600}

/* score display */
.ats-result-content{display:none}
.ats-result-content.show{display:block}
.score-hero{display:flex;align-items:center;gap:20px;margin-bottom:24px;padding:20px;background:var(--l50);border-radius:16px;border:1px solid var(--l100)}
.score-circle{position:relative;width:90px;height:90px;flex-shrink:0}
.score-circle svg{transform:rotate(-90deg);width:90px;height:90px}
.score-bg{fill:none;stroke:var(--l200);stroke-width:7}
.score-bar{fill:none;stroke-width:7;stroke-linecap:round;transition:stroke-dashoffset 1.2s var(--ease);stroke-dasharray:226;stroke-dashoffset:226}
.score-num{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:1.35rem;font-weight:900;color:var(--ink)}
.score-info h3{font-size:1.1rem;margin-bottom:4px}
.score-info p{font-size:.82rem;color:var(--i60);line-height:1.5}
.score-grade{display:inline-block;padding:4px 12px;border-radius:100px;font-size:.72rem;font-weight:800;margin-top:6px}

.res-section{margin-bottom:20px}
.res-label{font-size:.68rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--i60);margin-bottom:10px;display:flex;align-items:center;gap:6px}
.res-label::after{content:'';flex:1;height:1px;background:var(--l100)}

/* keyword pills */
.kw-grid{display:flex;flex-wrap:wrap;gap:6px}
.kw{display:flex;align-items:center;gap:5px;padding:5px 11px;border-radius:100px;font-size:.75rem;font-weight:600}
.kw-found{background:var(--m100);color:var(--m700);border:1px solid rgba(62,207,178,.3)}
.kw-missing{background:var(--r100);color:var(--r700);border:1px solid rgba(233,30,140,.2)}
.kw-neutral{background:var(--l100);color:var(--l600);border:1px solid var(--l200)}

/* section scores */
.sec-scores{display:flex;flex-direction:column;gap:8px}
.ss-item{display:flex;align-items:center;gap:10px}
.ss-name{font-size:.78rem;font-weight:600;color:var(--ink);min-width:100px;flex-shrink:0}
.ss-bar-wrap{flex:1;height:7px;background:var(--l100);border-radius:100px;overflow:hidden}
.ss-bar{height:100%;border-radius:100px;transition:width 1s var(--ease)}
.ss-pct{font-size:.72rem;font-weight:700;color:var(--i60);min-width:32px;text-align:right}

/* recommendations */
.recs{display:flex;flex-direction:column;gap:8px}
.rec{display:flex;gap:10px;background:var(--l50);border:1px solid var(--l100);border-radius:10px;padding:10px 13px}
.rec-ico{font-size:1rem;flex-shrink:0;margin-top:1px}
.rec p{font-size:.8rem;line-height:1.58;color:var(--ink)}
.rec.high{border-color:rgba(233,30,140,.2);background:var(--r100)}
.rec.med{border-color:rgba(249,199,79,.3);background:#fffbee}
.rec.low{border-color:rgba(62,207,178,.25);background:var(--m100)}

/* cta after results */
.ats-cta{margin-top:20px;padding:18px;background:linear-gradient(145deg,var(--l500),var(--l700));border-radius:16px;text-align:center;display:none}
.ats-cta.show{display:block}
.ats-cta p{color:rgba(255,255,255,.82);font-size:.82rem;margin-bottom:12px;line-height:1.55}
.ats-cta strong{display:block;font-size:1.05rem;font-weight:800;color:#fff;margin-bottom:12px}

/* disclaimer */
.ats-disclaimer{font-size:.72rem;color:var(--i30);text-align:center;margin-top:12px;position:relative;z-index:1}

/* ═══════════════ APPROACH ═══════════════ */
#approach{background:var(--l50)}
.apph{text-align:center;max-width:500px;margin:0 auto clamp(36px,5vw,56px)}














/* ═══════════════ PRICING ═══════════════ */
#pricing{background:var(--l50)}
.prh{text-align:center;max-width:520px;margin:0 auto clamp(36px,5vw,52px)}
.prg{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:start}
.prc{background:#fff;border-radius:22px;border:2px solid var(--l100);padding:clamp(20px,3vw,32px);transition:transform .3s var(--ease),border-color .3s,box-shadow .3s}
.prc:hover{transform:translateY(-5px);border-color:var(--l300);box-shadow:0 14px 44px rgba(155,111,232,.14)}
.prcf{background:linear-gradient(148deg,var(--l500),var(--l700));border-color:var(--l400);transform:scale(1.03);box-shadow:0 20px 60px rgba(155,111,232,.38)}
.prcf:hover{transform:scale(1.03) translateY(-5px)}
.pbdg{display:inline-block;background:var(--m500);color:var(--ink);font-size:.62rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;padding:4px 11px;border-radius:100px;margin-bottom:9px}
.plt{font-size:.65rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--l500);margin-bottom:7px;display:block}
.prcf .plt{color:var(--m300)}
.prcf .pnam,.prcf .pamt,.prcf .pper{color:#fff}
.pnam{font-size:1rem;font-weight:800;color:var(--ink);margin-bottom:7px}
.pdsc{font-size:.8rem;line-height:1.6;margin-bottom:16px}
.prc:not(.prcf) .pdsc{color:var(--i60)}
.prcf .pdsc{color:rgba(255,255,255,.55)}
.pamt{font-size:1.6rem;font-weight:900;color:var(--ink);letter-spacing:-.03em;margin-bottom:3px}
.pper{font-size:.72rem;color:var(--i60);margin-bottom:18px}
.pfl{list-style:none;display:flex;flex-direction:column;gap:7px;margin-bottom:24px}
.pfl li{font-size:.81rem;display:flex;gap:7px;line-height:1.4}
.pfl li::before{content:'✓';font-weight:800;flex-shrink:0}
.prc:not(.prcf) .pfl li{color:var(--ink)}.prc:not(.prcf) .pfl li::before{color:var(--m700)}
.prcf .pfl li{color:rgba(255,255,255,.78)}.prcf .pfl li::before{color:var(--m300)}
.pnote{text-align:center;margin-top:16px;font-size:.75rem;color:var(--i60)}

/* ═══════════════ CONTACT ═══════════════ */
#contact{background:var(--ink);position:relative;overflow:hidden}
.cg1{position:absolute;width:460px;height:460px;top:-130px;left:-90px;background:rgba(155,111,232,.14);border-radius:50%;filter:blur(100px);pointer-events:none}
.cg2{position:absolute;width:340px;height:340px;bottom:-80px;right:-50px;background:rgba(62,207,178,.09);border-radius:50%;filter:blur(100px);pointer-events:none}
.ctg{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,68px);align-items:start;position:relative;z-index:1}
.ctl h2{color:#fff;margin-bottom:13px}
.ctl>p{color:rgba(255,255,255,.47);font-size:.88rem;line-height:1.7;margin-bottom:30px}
.chs{display:flex;flex-direction:column;gap:10px}
.ch{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.07);border-radius:13px;padding:12px 15px;transition:background .2s,border-color .2s}
.ch:hover{background:rgba(255,255,255,.09);border-color:rgba(155,111,232,.38)}
.chi{width:37px;height:37px;border-radius:9px;background:rgba(155,111,232,.14);display:flex;align-items:center;justify-content:center;font-size:.92rem;flex-shrink:0}
.chl{font-size:.62rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.3);margin-bottom:1px}
.chv{font-size:.84rem;font-weight:500;color:#fff}
.cf{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:22px;padding:clamp(20px,3.5vw,36px)}
.cft{color:#fff;font-size:.96rem;font-weight:700;margin-bottom:18px}
.fr{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.fg{margin-bottom:10px}
.fg label{display:block;font-size:.67rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.3);margin-bottom:5px}
.fg input,.fg select,.fg textarea{width:100%;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.09);border-radius:10px;padding:10px 13px;color:#fff;font-family:var(--fh);font-size:.85rem;outline:none;transition:border-color .2s,background .2s}
.fg input:focus,.fg select:focus,.fg textarea:focus{border-color:var(--l400);background:rgba(155,111,232,.1)}
.fg input::placeholder,.fg textarea::placeholder{color:rgba(255,255,255,.22)}
.fg select option{background:#18103c}
.fg textarea{resize:vertical;min-height:84px}
.fsuc{display:none;text-align:center;padding:12px;border-radius:10px;background:rgba(62,207,178,.14);border:1px solid rgba(62,207,178,.28);color:var(--m300);font-size:.81rem;font-weight:600;margin-top:8px}

/* ═══════════════ FOOTER ═══════════════ */
footer{background:#0b0820;padding:clamp(26px,4vw,48px) 0 clamp(14px,3vw,26px)}
.fi{display:grid;grid-template-columns:1fr auto;gap:32px;align-items:start;margin-bottom:32px}
.fbr{max-width:280px}
.flogo{font-size:.97rem;font-weight:800;color:#fff;margin-bottom:7px}
.flogo span{color:var(--l400)}
.ftg{font-size:.77rem;color:rgba(255,255,255,.36);line-height:1.6}
.flg{display:grid;grid-template-columns:repeat(2,auto);gap:0 32px}
.flg h5{font-size:.63rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.26);margin-bottom:9px}
.flg ul{list-style:none;display:flex;flex-direction:column;gap:6px}
.flg a{font-size:.77rem;color:rgba(255,255,255,.4);transition:color .2s}
.flg a:hover{color:var(--l400)}

.fcp{font-size:.71rem;color:rgba(255,255,255,.26)}
.fleg{display:flex;gap:16px}
.fleg a{font-size:.71rem;color:rgba(255,255,255,.2);transition:color .2s}
.fleg a:hover{color:var(--l400)}

/* ═══════════════ RESPONSIVE ═══════════════ */

/* ── Tablet landscape 1024 ── */
@media(max-width:1080px){
  .prg{grid-template-columns:1fr 1fr}
  .prcf{transform:none}
  .prcf:hover{transform:translateY(-5px)}
  .ats-wrap{grid-template-columns:1fr}
  .ats-results{min-height:360px}
  .abg{grid-template-columns:5fr 6fr;gap:clamp(24px,4vw,56px)}
}

/* ── Tablet portrait 900 ── */
@media(max-width:900px){
  .nul{display:none}
  .ne .bv,.ne .bm{display:none}
  .burger{display:flex}
  .hg{grid-template-columns:1fr}
  .hr{display:none}
  .hg{padding:clamp(28px,5vw,56px) 0}
  .htitle{font-size:clamp(2.8rem,7vw,4.2rem)}
  .hsub{max-width:100%}
  .htag{max-width:100%}
  .abg{grid-template-columns:1fr;gap:0}
  .avis{max-width:380px;margin:0 auto 40px}
  .afr{aspect-ratio:3/4;max-height:420px}
  .about-photo{object-position:50% 6%}
  .abdg{top:-14px;right:-10px}
  .ag{grid-template-columns:1fr}
  .pq-grid{grid-template-columns:1fr 1fr}
  .ctg{grid-template-columns:1fr}
  .fi{grid-template-columns:1fr}
  
  .flg{display:none}
}

/* ── Small tablet / large mobile 768 ── */
@media(max-width:768px){
  
  
  .pq-grid{grid-template-columns:1fr}
  .svcg{grid-template-columns:1fr}
  .prg{grid-template-columns:1fr}
  .fr{grid-template-columns:1fr}
  .ats-steps{flex-wrap:wrap;gap:6px}
  .score-hero{flex-direction:row;align-items:center}
  .hg{gap:0}
}

/* ── Mobile 480 (iPhone SE, Android small) ── */
@media(max-width:480px){
  .hbadge{font-size:.68rem;padding:6px 12px}
  .hbtns{flex-direction:column;gap:10px}
  .hbtns .btn{width:100%;justify-content:center}
  .htitle{font-size:clamp(2.4rem,10vw,3.2rem)}
  .hproof{flex-wrap:wrap;gap:10px}
  
  .pq-grid{grid-template-columns:1fr}
  .score-hero{flex-direction:column;text-align:center;gap:12px}
  .score-circle{margin:0 auto}
  .afr{aspect-ratio:3/4;max-height:360px}
  .about-photo{object-position:50% 6%}
  .abdg{top:-10px;right:-8px;padding:10px 13px}
  .abdg strong{font-size:1.2rem}
  .ats-input,.ats-results{border-radius:18px}
  .pq-card{padding:20px}
  .ne{gap:6px}
  .ne .bm.btn-sm{display:flex;padding:7px 13px;font-size:.74rem}
  .ne .bv.btn-sm{display:none}
  section.sec{padding:clamp(44px,8vw,72px) 0}
}

/* ── Mobile XS 375 (iPhone 12 mini, Android small) ── */
@media(max-width:375px){
  .w{padding:0 14px}
  .htitle{font-size:2.2rem}
  .ne .bm.btn-sm{font-size:.7rem;padding:6px 11px}
  .logo{font-size:.88rem}
  .lm{width:30px;height:30px;font-size:.72rem}
  .pq-mantra p{font-size:.95rem}
  .pq-mantra strong{font-size:1.1rem}
}




/* ── APPROACH CARDS ── */
.approach-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;max-width:960px;margin:0 auto}
.apc{background:#fff;border-radius:20px;padding:28px 20px;text-align:center;border:2px solid var(--l100);transition:transform .25s,box-shadow .25s,border-color .25s;display:flex;flex-direction:column;align-items:center}
.apc:hover{transform:translateY(-6px);box-shadow:0 16px 48px rgba(155,111,232,.15);border-color:var(--l300)}
.apc-tag{display:inline-block;font-size:.64rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;padding:4px 11px;border-radius:100px;margin-bottom:14px}
.apc-tag-1{background:#d8f5ee;color:#1ea88e}
.apc-tag-2{background:#e4d9ff;color:#5f38b0}
.apc-tag-3{background:#fce7f3;color:#bf166e}
.apc-tag-4{background:#f1ecff;color:#7c4fd0}
.apc-bubble{width:72px;height:72px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:.85rem;letter-spacing:.05em;margin:0 auto 16px;border:3px solid;flex-shrink:0}
.apc-bubble-1{background:#3ecfb2;border-color:#7de8d1;color:#18103c}
.apc-bubble-2{background:#9b6fe8;border-color:#c9b4fd;color:#fff}
.apc-bubble-3{background:#e91e8c;border-color:#f4a8d6;color:#fff}
.apc-bubble-4{background:#18103c;border-color:#b09bf5;color:#c9b4fd}
.apc h4{font-size:.97rem;font-weight:800;color:#18103c;margin-bottom:8px}
.apc p{font-size:.81rem;line-height:1.62;color:rgba(24,16,60,.6)}

#efab{position:fixed;bottom:24px;right:24px;z-index:9999;width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,#9b6fe8,#3ecfb2);color:#fff;font-size:1.3rem;border:none;cursor:pointer;box-shadow:0 4px 18px rgba(155,111,232,.5);transition:transform .2s;display:none}
#efab:hover{transform:scale(1.1)}
#efab.on{background:linear-gradient(135deg,#e91e8c,#7c4fd0)}
#epanel{position:fixed;top:0;right:0;bottom:0;z-index:9998;width:290px;background:#18103c;transform:translateX(100%);transition:transform .3s;box-shadow:-4px 0 30px rgba(0,0,0,.4);display:flex;flex-direction:column;font-family:Outfit,sans-serif}
#epanel.on{transform:translateX(0)}
#ephead{background:linear-gradient(135deg,#9b6fe8,#3ecfb2);padding:16px 18px;flex-shrink:0}
#ephead h2{color:#fff;font-size:.95rem;font-weight:800;margin:0 0 3px}
#ephead p{color:rgba(255,255,255,.75);font-size:.72rem;margin:0}
#epbody{flex:1;overflow-y:auto;padding:12px}
#epfoot{padding:10px 12px;border-top:1px solid rgba(255,255,255,.08);display:flex;gap:8px;flex-shrink:0}
.ep-toggle-row{display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:12px 14px;margin-bottom:10px}
.ep-toggle-label{color:rgba(255,255,255,.85);font-size:.82rem;font-weight:600}
.ep-toggle-sub{color:rgba(255,255,255,.4);font-size:.68rem;margin-top:2px}
.sw{position:relative;width:40px;height:22px;flex-shrink:0}
.sw input{opacity:0;width:0;height:0;position:absolute}
.sw span{position:absolute;inset:0;background:rgba(255,255,255,.15);border-radius:100px;cursor:pointer;transition:background .2s}
.sw span::before{content:"";position:absolute;width:16px;height:16px;left:3px;top:3px;background:#fff;border-radius:50%;transition:transform .2s}
.sw input:checked+span{background:#9b6fe8}
.sw input:checked+span::before{transform:translateX(18px)}
.ep-section-title{font-size:.64rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.3);margin:14px 0 8px;padding-bottom:5px;border-bottom:1px solid rgba(255,255,255,.07)}
.ep-field{margin-bottom:10px}
.ep-field label{display:block;font-size:.65rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.35);margin-bottom:5px}
.ep-field input,.ep-field textarea{width:100%;background:rgba(255,255,255,.07);border:1.5px solid rgba(255,255,255,.1);border-radius:8px;padding:9px 11px;color:#fff;font-family:Outfit,sans-serif;font-size:.82rem;outline:none;resize:vertical;box-sizing:border-box}
.ep-field input:focus,.ep-field textarea:focus{border-color:#9b6fe8}
.ep-field textarea{min-height:58px}
.sec-row{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.07);border-radius:9px;padding:9px 11px;margin-bottom:6px}
.sec-row-lbl{flex:1;color:rgba(255,255,255,.78);font-size:.8rem;font-weight:600}
.sec-row-btn{width:26px;height:26px;border-radius:7px;border:none;cursor:pointer;background:rgba(255,255,255,.08);color:rgba(255,255,255,.7);font-size:.82rem;display:flex;align-items:center;justify-content:center;transition:background .15s}
.sec-row-btn:hover{background:rgba(255,255,255,.18)}
.sec-row-btn.off{background:rgba(233,30,140,.2);color:#f4a8d6}
.ep-btn{flex:1;padding:9px 6px;border-radius:100px;border:none;cursor:pointer;font-family:Outfit,sans-serif;font-weight:700;font-size:.75rem;transition:opacity .2s}
.ep-btn:hover{opacity:.85}
.ep-save{background:#3ecfb2;color:#18103c}
.ep-dl{background:#9b6fe8;color:#fff}
.ep-rst{background:rgba(255,255,255,.08);color:rgba(255,255,255,.7)}
#elock{position:fixed;bottom:24px;right:24px;z-index:9999;width:52px;height:52px;border-radius:50%;background:rgba(24,16,60,.5);color:rgba(255,255,255,.25);font-size:1.1rem;border:1px solid rgba(255,255,255,.08);cursor:pointer;backdrop-filter:blur(8px);transition:all .2s}
#elock:hover{background:rgba(155,111,232,.25);color:rgba(255,255,255,.6)}
#etoast{position:fixed;bottom:88px;right:26px;z-index:10000;background:#3ecfb2;color:#18103c;font-family:Outfit,sans-serif;font-weight:700;font-size:.8rem;padding:9px 18px;border-radius:100px;opacity:0;transform:translateY(8px);transition:opacity .25s,transform .25s;pointer-events:none}
#etoast.on{opacity:1;transform:none}
body.editing [contenteditable="true"]{outline:2px dashed rgba(155,111,232,.5);outline-offset:2px;border-radius:3px;cursor:text;min-height:1em;display:inline-block}
body.editing p[contenteditable="true"],body.editing li[contenteditable="true"]{display:block}
body.editing [contenteditable="true"]:hover{outline-color:#9b6fe8;background:rgba(155,111,232,.08)}
body.editing [contenteditable="true"]:focus{outline:2px solid #9b6fe8;background:rgba(155,111,232,.1)}
[data-sec-hide]{display:none!important}
