/* ════════════════════════════════════════
   VARIABLES
════════════════════════════════════════ */
:root{
    --bg:      #060610;
    --bg2:     #0c0c1e;
    --bg3:     #111128;
    --text:    #eeeeff;
    --muted:   #7b789a;
    --primary: #a855f7;
    --pri-d:   #7c3aed;
    --pri-b:   #c084fc;
    --sec:     #e879f9;
    --accent:  #818cf8;
    --glass:   rgba(18,14,38,.8);
    --gborder: rgba(168,85,247,.15);
    --radius:  14px;
    --tr:      all .35s cubic-bezier(.25,.8,.25,1);
    --fh:      'Outfit', sans-serif;
    --fb:      'Space Grotesk', sans-serif;
}

/* ── Reset ── */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:hidden}
body{background:var(--bg);color:var(--text);font-family:var(--fb);line-height:1.65;overflow-x:hidden;-webkit-text-size-adjust:100%}
a{text-decoration:none;color:inherit}
ul{list-style:none}
img{display:block;width:100%;height:100%;object-fit:cover}

/* ── Shared typography ── */
.section-eyebrow{
    font-size:.62rem;font-weight:700;letter-spacing:5px;text-transform:uppercase;
    color:var(--primary);margin-bottom:12px;
}
.section-eyebrow.center{text-align:center}
.section-heading{
    font-family:var(--fh);font-size:clamp(2rem,4vw,3rem);
    font-weight:800;color:var(--text);margin-bottom:48px;line-height:1.1;
}
.section-heading em{font-style:normal;color:var(--primary)}
.section-heading.center{text-align:center}

/* ── Gradient text (skills section) ── */
.gradient-text{
    background:linear-gradient(120deg,var(--primary),var(--sec));
    -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}

/* ── Reveal animations ── */
.reveal,.reveal-up,.reveal-left,.reveal-right{
    opacity:0;will-change:opacity,transform;
    transition:opacity .6s cubic-bezier(.22,1,.36,1) var(--d,0s),
               transform .6s cubic-bezier(.22,1,.36,1) var(--d,0s);
}
.reveal-up{transform:translateY(32px)}
.reveal-left{transform:translateX(-32px)}
.reveal-right{transform:translateX(32px)}
.reveal.active,.reveal-up.active,.reveal-left.active,.reveal-right.active{
    opacity:1;transform:translate(0);will-change:auto;
}

/* ── Buttons ── */
.cta-primary{
    display:inline-flex;align-items:center;gap:10px;
    background:linear-gradient(135deg,var(--pri-d),var(--primary));
    color:#fff;font-family:var(--fh);font-weight:700;
    padding:13px 28px;border-radius:10px;border:none;cursor:pointer;
    font-size:.9rem;transition:var(--tr);
    box-shadow:0 8px 24px rgba(168,85,247,.25);
}
.cta-primary:hover{transform:translateY(-3px);box-shadow:0 14px 36px rgba(168,85,247,.4);filter:brightness(1.1)}
.cta-secondary{
    display:inline-flex;align-items:center;gap:8px;
    background:transparent;color:var(--text);
    border:1.5px solid rgba(168,85,247,.3);
    font-family:var(--fh);font-weight:700;font-size:.9rem;
    padding:13px 28px;border-radius:10px;cursor:pointer;transition:var(--tr);
}
.cta-secondary:hover{border-color:var(--primary);color:var(--primary);background:rgba(168,85,247,.06);transform:translateY(-3px)}
.btn-full{width:100%;justify-content:center}

/* ── Glass ── */
.glass{background:var(--glass);border:1px solid var(--gborder);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}

/* ════════════════════════════════════════
   NAVIGATION
════════════════════════════════════════ */
header{
    position:fixed;top:0;left:0;width:100%;z-index:1000;
    padding:20px 7%;transition:var(--tr);
}
header.scrolled{
    background:rgba(6,6,16,.95);
    backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
    padding:13px 7%;border-bottom:1px solid rgba(168,85,247,.08);
    box-shadow:0 4px 30px rgba(0,0,0,.5);
}
.navbar{display:flex;justify-content:space-between;align-items:center}
.logo{
    font-family:var(--fh);font-size:1.4rem;font-weight:800;
    color:var(--text);z-index:1001;position:relative;letter-spacing:-1px;
}
.logo-bracket{color:var(--primary)}
.nav-links{display:flex;gap:26px;align-items:center}
.nav-num{display:none}
.nav-menu-socials{display:none}
.nav-link{
    font-size:.72rem;font-weight:700;letter-spacing:.8px;text-transform:uppercase;
    color:var(--muted);transition:color .3s;position:relative;padding-bottom:4px;
}
.nav-link::after{
    content:'';position:absolute;bottom:0;left:0;width:0;height:1.5px;
    background:var(--primary);border-radius:2px;transition:width .3s ease;
}
.nav-link:hover,.nav-link.active{color:var(--text)}
.nav-link:hover::after,.nav-link.active::after{width:100%}
.nav-link--cta{
    background:linear-gradient(135deg,var(--pri-d),var(--primary));
    color:#fff!important;padding:9px 20px;border-radius:8px;
    font-weight:700;box-shadow:0 4px 18px rgba(168,85,247,.22);
    text-transform:none!important;font-size:.78rem!important;
}
.nav-link--cta::after{display:none}
.nav-link--cta:hover{transform:translateY(-2px);box-shadow:0 8px 28px rgba(168,85,247,.4)}
.hamburger{
    display:none;flex-direction:column;justify-content:center;align-items:center;
    gap:5px;cursor:pointer;z-index:1002;
    width:40px;height:40px;border-radius:9px;
    background:rgba(168,85,247,.08);border:1px solid rgba(168,85,247,.18);transition:var(--tr);
}
.hamburger span{display:block;width:17px;height:2px;background:var(--text);border-radius:2px;transition:all .32s cubic-bezier(.34,1.56,.64,1);transform-origin:center}
.hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hamburger.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.nav-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.6);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:998;opacity:0;transition:opacity .35s ease}
.nav-overlay.visible{display:block}
.nav-overlay.active{opacity:1}

/* ════════════════════════════════════════
   HERO
════════════════════════════════════════ */
.hero{
    min-height:100vh;display:flex;align-items:center;
    justify-content:space-between;
    padding:120px 7% 80px;gap:60px;
    position:relative;overflow:hidden;
    flex-wrap:nowrap;
}
#particles-canvas{position:absolute;inset:0;z-index:0;pointer-events:none}
.hero-noise{
    position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.03;
    background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
    background-size:200px;
}

/* Left column — always left, order:1 */
.hero-left{flex:1;max-width:560px;position:relative;z-index:1;order:1}
.hero-tag{
    display:inline-flex;align-items:center;gap:8px;
    font-size:.7rem;font-weight:600;letter-spacing:2px;text-transform:uppercase;
    color:var(--pri-b);border:1px solid rgba(168,85,247,.2);
    padding:7px 14px;border-radius:50px;background:rgba(168,85,247,.06);
    margin-bottom:22px;
}
.tag-dot{width:7px;height:7px;border-radius:50%;background:#4ade80;box-shadow:0 0 0 3px rgba(74,222,128,.2);animation:tagPulse 2s ease-in-out infinite;flex-shrink:0}
@keyframes tagPulse{0%,100%{box-shadow:0 0 0 3px rgba(74,222,128,.2)}50%{box-shadow:0 0 0 7px rgba(74,222,128,.05)}}
.hero-name{font-family:var(--fh);font-size:clamp(3rem,6vw,5.5rem);font-weight:900;line-height:.95;letter-spacing:-3px;margin-bottom:16px}
.name-line{display:block}
.name-accent{
    display:block;
    background:linear-gradient(110deg,var(--primary),var(--sec),var(--accent));
    -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.hero-role{
    display:flex;align-items:center;gap:10px;
    font-family:var(--fh);font-size:clamp(1rem,2.2vw,1.4rem);
    font-weight:600;color:var(--muted);margin-bottom:20px;
}
.role-prefix{color:var(--muted)}
.role-typed{color:var(--pri-b);font-weight:700}
.cursor-blink{animation:blink .75s step-end infinite;color:var(--primary);margin-left:1px}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}
.hero-bio{font-size:.97rem;color:var(--muted);line-height:1.85;margin-bottom:28px;font-weight:400}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:32px}
.hero-socials{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.h-social{
    width:40px;height:40px;border-radius:9px;
    border:1px solid rgba(168,85,247,.18);
    display:flex;align-items:center;justify-content:center;
    color:var(--muted);font-size:.88rem;transition:var(--tr);
    position:relative;overflow:hidden;
}
.h-social::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,var(--pri-d),var(--primary));transform:scale(0);transition:.3s cubic-bezier(.34,1.56,.64,1);border-radius:inherit;z-index:0}
.h-social i{position:relative;z-index:1}
.h-social:hover{color:#fff;border-color:var(--primary);transform:translateY(-3px)}
.h-social:hover::before{transform:scale(1)}
.social-line{width:60px;height:1px;background:linear-gradient(to right,rgba(168,85,247,.3),transparent);margin-left:4px}

/* Right column — always right, order:2, uses own fade-in (not reveal-right) */
.hero-right{
    flex:0 0 360px;
    width:360px;
    position:relative;z-index:1;
    display:flex;flex-direction:column;align-items:center;gap:20px;
    order:2;
    opacity:0;
    animation:heroRightIn .9s cubic-bezier(.22,1,.36,1) .35s forwards;
}
@keyframes heroRightIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.hero-img-frame{
    position:relative;
    width:320px;height:380px;
}
.frame-corner{
    position:absolute;width:22px;height:22px;
    border-color:var(--primary);border-style:solid;
    pointer-events:none;z-index:2;
    transition:var(--tr);
}
.fc-tl{top:0;left:0;border-width:2px 0 0 2px;border-radius:4px 0 0 0}
.fc-tr{top:0;right:0;border-width:2px 2px 0 0;border-radius:0 4px 0 0}
.fc-bl{bottom:0;left:0;border-width:0 0 2px 2px;border-radius:0 0 0 4px}
.fc-br{bottom:0;right:0;border-width:0 2px 2px 0;border-radius:0 0 4px 0}
.hero-img-frame:hover .frame-corner{width:32px;height:32px}
.frame-scan{
    position:absolute;top:0;left:0;width:100%;height:3px;
    background:linear-gradient(90deg,transparent,rgba(168,85,247,.6),transparent);
    z-index:3;animation:scanLine 3s ease-in-out infinite;
    pointer-events:none;
}
@keyframes scanLine{0%{top:0;opacity:1}90%{top:100%;opacity:.3}100%{top:100%;opacity:0}}
.hero-photo{
    width:100%;height:100%;object-fit:cover;object-position:center top;
    border-radius:10px;
    border:1px solid rgba(168,85,247,.15);
    box-shadow:0 0 50px rgba(168,85,247,.2),0 20px 60px rgba(0,0,0,.5);
    animation:imgFloat 5s ease-in-out infinite;
}
@keyframes imgFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
.img-overlay{
    position:absolute;inset:0;border-radius:10px;
    background:linear-gradient(to top,rgba(6,6,16,.4) 0%,transparent 50%);
    pointer-events:none;
}
.hero-stat-cards{display:flex;gap:10px;width:100%}
.stat-card{
    flex:1;padding:14px 10px;border-radius:10px;text-align:center;
    background:rgba(14,14,30,.9);border:1px solid rgba(168,85,247,.12);
    transition:var(--tr);
}
.stat-card:hover{border-color:var(--primary);transform:translateY(-3px);box-shadow:0 8px 24px rgba(168,85,247,.12)}
.stat-num{display:block;font-family:var(--fh);font-size:1.5rem;font-weight:800;color:var(--pri-b)}
.stat-label{font-size:.62rem;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}

/* Scroll cue */
.scroll-cue{
    position:absolute;bottom:32px;left:50%;transform:translateX(-50%);
    display:flex;flex-direction:column;align-items:center;gap:6px;z-index:1;
}
.scroll-line{width:1px;height:50px;background:linear-gradient(to bottom,var(--primary),transparent);animation:scrollDrop 2s ease-in-out infinite}
@keyframes scrollDrop{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
.scroll-cue span{font-size:.58rem;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:var(--muted)}

/* ════════════════════════════════════════
   ABOUT
════════════════════════════════════════ */
.about{padding:100px 7%;position:relative}
.about-inner{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}

/* Code card */
.av-card{
    background:#0d0d1f;border:1px solid rgba(168,85,247,.18);
    border-radius:14px;overflow:hidden;
    box-shadow:0 20px 60px rgba(0,0,0,.4);
    margin-bottom:20px;
}
.av-header{
    display:flex;align-items:center;gap:8px;
    padding:12px 18px;background:rgba(168,85,247,.05);
    border-bottom:1px solid rgba(168,85,247,.1);
}
.av-dot{width:10px;height:10px;border-radius:50%}
.av-dot.r{background:#ff5f56}
.av-dot.y{background:#ffbd2e}
.av-dot.g{background:#27c93f}
.av-file{font-size:.72rem;color:var(--muted);margin-left:6px;font-family:monospace}
.av-code{padding:20px 18px;font-family:'Courier New',monospace;font-size:.82rem;line-height:1.9}
.code-line{white-space:nowrap}
.code-line.pl{padding-left:18px}
.c-br{color:#e879f9}
.c-key{color:#a78bfa}
.c-str{color:#86efac}
.c-bool{color:#fb923c}
.c-cl{color:var(--muted)}
.av-footer{
    padding:12px 18px;background:rgba(168,85,247,.04);
    border-top:1px solid rgba(168,85,247,.08);
}
.av-status{display:flex;align-items:center;gap:8px;font-size:.72rem;color:var(--pri-b);font-weight:600}
.live-dot{width:7px;height:7px;border-radius:50%;background:#4ade80;animation:tagPulse 2s ease-in-out infinite;flex-shrink:0}

.about-counters{display:flex;gap:12px}
.ac-item{
    flex:1;padding:18px 12px;text-align:center;
    background:rgba(14,14,30,.9);border:1px solid rgba(168,85,247,.12);
    border-radius:12px;transition:var(--tr);
}
.ac-item:hover{border-color:var(--primary);transform:translateY(-3px)}
.ac-num{
    font-family:var(--fh);font-size:2.2rem;font-weight:900;
    background:linear-gradient(135deg,var(--primary),var(--sec));
    -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.ac-plus{font-size:1.4rem;font-weight:800;color:var(--primary);vertical-align:top;margin-top:4px;display:inline-block}
.ac-label{display:block;font-size:.62rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-top:3px}

/* About content */
.about-content{}
.about-p{color:var(--muted);line-height:1.9;margin-bottom:16px;font-size:.97rem}
.about-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px;margin-top:20px}
.about-tags span{
    display:flex;align-items:center;gap:6px;
    padding:8px 14px;border-radius:8px;font-size:.78rem;font-weight:500;
    background:rgba(168,85,247,.05);border:1px solid rgba(168,85,247,.12);color:var(--text);
    transition:var(--tr);
}
.about-tags span i{color:var(--primary);font-size:.72rem}
.about-tags span:hover{border-color:var(--primary);background:rgba(168,85,247,.1)}

/* ════════════════════════════════════════
   RESUME — Minimal elegant redesign
════════════════════════════════════════ */
.resume-section{
    padding:100px 7%;
    background:var(--bg);
    position:relative;overflow:hidden;
}
/* Subtle background gradient orb */
.resume-bg-orb{position:absolute;border-radius:50%;filter:blur(120px);pointer-events:none;z-index:0}
.orb1{width:600px;height:600px;top:50%;left:50%;transform:translate(-50%,-50%);
      background:rgba(124,58,237,.05);animation:none}
.orb2{display:none}

.resume-layout{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:80px;
    align-items:center;
    max-width:1060px;margin:0 auto;
    position:relative;z-index:1;
}

/* ══ LEFT — Document preview ══ */
.resume-preview-wrap{
    position:relative;
    display:flex;flex-direction:column;align-items:center;
}

/* Outer glow ring */
.resume-preview-wrap::before{
    content:'';
    position:absolute;inset:-16px;
    border-radius:24px;
    background:linear-gradient(135deg,rgba(168,85,247,.12),rgba(232,121,249,.06),transparent);
    filter:blur(20px);
    z-index:0;pointer-events:none;
}

.resume-doc{
    position:relative;z-index:1;
    width:100%;max-width:400px;
    border-radius:16px;overflow:hidden;
    border:1px solid rgba(168,85,247,.2);
    background:#0a0a1a;
    box-shadow:
        0 0 0 1px rgba(168,85,247,.06),
        0 30px 80px rgba(0,0,0,.6),
        0 0 60px rgba(168,85,247,.08);
    transition:transform .5s cubic-bezier(.22,1,.36,1), box-shadow .5s ease;
}
.resume-doc:hover{
    transform:translateY(-10px) perspective(800px) rotateX(2deg);
    box-shadow:
        0 0 0 1px rgba(168,85,247,.12),
        0 48px 100px rgba(0,0,0,.7),
        0 0 80px rgba(168,85,247,.15);
}

/* Browser-style topbar */
.resume-doc-topbar{
    display:flex;align-items:center;gap:10px;
    padding:10px 14px;
    background:rgba(255,255,255,.03);
    border-bottom:1px solid rgba(168,85,247,.08);
}
.doc-dots{display:flex;gap:5px}
.dd{width:9px;height:9px;border-radius:50%}
.dd.r{background:#ff5f56}.dd.y{background:#ffbd2e}.dd.g{background:#27c93f}
.doc-filename{
    flex:1;text-align:center;font-size:.66rem;color:var(--muted);
    font-family:monospace;display:flex;align-items:center;justify-content:center;gap:5px;
}
.doc-filename i{color:#ff5f56;font-size:.7rem}
.doc-pages{font-size:.62rem;color:rgba(255,255,255,.15)}

/* Skeleton CV body */
.resume-doc-body{
    padding:20px 18px;position:relative;overflow:hidden;
}
.cv-header-mock{display:flex;gap:12px;align-items:center;margin-bottom:14px}
.cv-avatar-mock{
    width:38px;height:38px;border-radius:50%;flex-shrink:0;
    background:linear-gradient(135deg,rgba(168,85,247,.2),rgba(232,121,249,.1));
    animation:skeletonPulse 2.2s ease-in-out infinite;
}
.cv-title-mock{flex:1;display:flex;flex-direction:column;gap:5px}
.cv-divider{height:1px;background:rgba(168,85,247,.08);margin:12px 0}
.cv-section-mock{margin-bottom:14px}
.cv-section-label{
    font-size:.5rem;font-weight:800;letter-spacing:3px;
    color:rgba(168,85,247,.35);text-transform:uppercase;margin-bottom:6px;
}
.cv-line{
    height:5px;border-radius:4px;margin-bottom:5px;
    background:rgba(255,255,255,.05);
    animation:skeletonPulse 2.2s ease-in-out infinite;
}
.cv-line.thick{height:8px}
.cv-line.thin{height:3px;opacity:.6}
.cv-line.w60{width:60%}.cv-line.w70{width:70%}.cv-line.w75{width:75%}
.cv-line.w80{width:80%}.cv-line.w85{width:85%}.cv-line.w90{width:90%}
.cv-pills-mock{display:flex;flex-wrap:wrap;gap:4px}
.cv-pills-mock span{
    height:15px;border-radius:4px;
    background:rgba(168,85,247,.07);
    border:1px solid rgba(168,85,247,.1);
    animation:skeletonPulse 2.2s ease-in-out infinite;
}
.cv-pills-mock span:nth-child(1){width:34px}
.cv-pills-mock span:nth-child(2){width:42px;animation-delay:.15s}
.cv-pills-mock span:nth-child(3){width:38px;animation-delay:.3s}
.cv-pills-mock span:nth-child(4){width:46px;animation-delay:.45s}
.cv-pills-mock span:nth-child(5){width:32px;animation-delay:.6s}
@keyframes skeletonPulse{0%,100%{opacity:.4}50%{opacity:.85}}

/* Purple scan line */
.cv-scan-line{
    position:absolute;left:0;right:0;height:1.5px;
    background:linear-gradient(90deg,transparent,rgba(168,85,247,.55),transparent);
    animation:cvScan 4.5s ease-in-out infinite;
    pointer-events:none;
    box-shadow:0 0 10px rgba(168,85,247,.35);
}
@keyframes cvScan{0%{top:0;opacity:1}88%{top:100%;opacity:.2}100%{top:100%;opacity:0}}

/* Soft glow below doc */
.resume-doc-glow{
    width:60%;height:20px;margin-top:0;
    background:radial-gradient(ellipse,rgba(168,85,247,.22),transparent 70%);
    filter:blur(10px);
    animation:glowPulse 3.5s ease-in-out infinite;
    position:relative;z-index:1;
}
@keyframes glowPulse{0%,100%{opacity:.5}50%{opacity:1}}

/* ══ RIGHT — Minimal info + actions ══ */
.resume-info{
    display:flex;flex-direction:column;
    gap:32px;
}

/* Tag line */
.resume-tagline{
    display:flex;flex-direction:column;gap:6px;
}
.resume-tagline h3{
    font-family:var(--fh);font-size:1.5rem;font-weight:800;
    color:var(--text);line-height:1.2;
}
.resume-tagline p{
    font-size:.9rem;color:var(--muted);line-height:1.7;font-weight:400;
}

/* Two big action buttons — the focus of this section */
.resume-cta-group{
    display:flex;flex-direction:column;gap:12px;
}
.resume-cta-view{
    display:flex;align-items:center;justify-content:center;gap:10px;
    padding:16px 28px;border-radius:12px;
    background:linear-gradient(135deg,var(--pri-d),var(--primary));
    color:#fff;font-family:var(--fh);font-weight:700;font-size:.95rem;
    border:none;cursor:pointer;transition:var(--tr);
    box-shadow:0 10px 32px rgba(168,85,247,.3);
    letter-spacing:.3px;
}
.resume-cta-view:hover{
    transform:translateY(-3px);
    box-shadow:0 18px 44px rgba(168,85,247,.45);
    filter:brightness(1.08);
}
.resume-cta-dl{
    display:flex;align-items:center;justify-content:center;gap:10px;
    padding:15px 28px;border-radius:12px;
    background:transparent;
    color:var(--text);font-family:var(--fh);font-weight:700;font-size:.95rem;
    border:1.5px solid rgba(168,85,247,.25);
    cursor:pointer;transition:var(--tr);letter-spacing:.3px;
}
.resume-cta-dl:hover{
    border-color:var(--primary);
    color:var(--primary);
    background:rgba(168,85,247,.06);
    transform:translateY(-3px);
}

/* Minimal divider */
.resume-divider{
    height:1px;
    background:linear-gradient(to right,rgba(168,85,247,.15),rgba(168,85,247,.03),transparent);
}

/* Two slim info lines */
.resume-meta-row{
    display:flex;flex-direction:column;gap:10px;
}
.resume-meta-item{
    display:flex;align-items:center;gap:10px;
    font-size:.82rem;color:var(--muted);font-weight:500;
}
.resume-meta-item i{
    color:rgba(168,85,247,.4);width:14px;text-align:center;font-size:.76rem;flex-shrink:0;
}
.resume-meta-item span b{color:rgba(255,255,255,.5);font-weight:600}

/* Updated badge */
.resume-updated{
    font-size:.7rem;color:rgba(255, 255, 255, 0.399);
    display:flex;align-items:center;gap:7px;
    padding-top:4px;
}
.resume-updated i{color:rgba(163, 83, 238, 0.25);font-size:.65rem}

/* ════════════════════════════════════════
   SKILLS  (KEPT FROM ORIGINAL — styles only)
════════════════════════════════════════ */
.skills-section{padding:100px 7%;background:transparent;position:relative;overflow:hidden}
.section-title{text-align:center;margin-bottom:56px}
.section-title.left-align{text-align:left;margin-bottom:32px}
.section-tag{
    display:inline-block;font-size:.62rem;font-weight:700;letter-spacing:4px;text-transform:uppercase;
    color:var(--primary);border:1px solid rgba(168,85,247,.22);padding:5px 16px;border-radius:50px;
    margin-bottom:14px;background:rgba(168,85,247,.06);
}
.section-title h2{font-size:clamp(1.8rem,4vw,2.8rem);font-weight:800;color:var(--text)}
/* Legacy eyebrow/heading — redirect to section-title style */
.section-eyebrow{display:none!important}
.section-heading{display:none!important}
.skills-bg-glow{position:absolute;width:500px;height:500px;background:radial-gradient(circle,rgba(168,85,247,.05) 0%,transparent 70%);filter:blur(80px);z-index:0;pointer-events:none;border-radius:50%}
.skills-glow-1{top:10%;left:-100px;animation:drift 15s infinite alternate ease-in-out}
.skills-glow-2{bottom:10%;right:-100px;animation:drift 20s infinite alternate-reverse ease-in-out}
@keyframes drift{from{transform:translate(0,0)}to{transform:translate(50px,100px)}}
.skill-bars-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:20px 56px;max-width:960px;margin:0 auto 64px;width:100%}
.skill-bar-item{display:flex;flex-direction:column;gap:9px}
.skill-bar-header{display:flex;align-items:center;justify-content:space-between}
.skill-bar-name{font-size:.83rem;font-weight:700;color:var(--text);display:flex;align-items:center;gap:8px}
.skill-bar-name i{color:var(--primary);font-size:.86rem;width:15px;text-align:center}
.skill-bar-pct{display:none}
.skill-bar-track{height:13px;border-radius:50px;background:rgba(168,85,247,.1);overflow:hidden;border:1px solid rgba(168,85,247,.08)}
.skill-bar-fill{height:100%;width:0%;border-radius:50px;background:linear-gradient(90deg,var(--pri-d),var(--primary),var(--sec));box-shadow:0 0 12px rgba(168,85,247,.5);transition:width 1.6s cubic-bezier(.34,1.1,.64,1);position:relative}
.skill-bar-fill::after{content:'';position:absolute;top:0;left:-60%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);animation:barShimmer 2.4s ease-in-out infinite;border-radius:50px}
@keyframes barShimmer{0%{left:-60%}60%,100%{left:120%}}
.grouped-skills-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;width:100%;max-width:1100px;margin:0 auto}
.skill-category-card{position:relative;overflow:hidden;padding:28px;border-radius:16px;background:rgba(14,14,30,.75);border:1px solid rgba(168,85,247,.12);transition:var(--tr);display:flex;flex-direction:column;gap:13px}
.skill-category-card::after{content:'';position:absolute;top:-50%;left:-60%;width:20%;height:200%;background:linear-gradient(to right,transparent,rgba(168,85,247,.08),transparent);transform:rotate(45deg);animation:scannerSweep 9s infinite linear}
@keyframes scannerSweep{0%{left:-60%}22%{left:120%}100%{left:120%}}
.skill-category-card:hover{transform:translateY(-5px);border-color:rgba(168,85,247,.32);box-shadow:0 16px 36px rgba(168,85,247,.12)}
.card-icon{width:40px;height:40px;background:rgba(168,85,247,.1);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1rem;color:var(--primary)}
.skill-category-card h3{font-size:.88rem;color:var(--text);font-weight:700}
.skill-pills{display:flex;flex-wrap:wrap;gap:6px}
.skill-pills .pill{font-size:.7rem;font-weight:500;color:var(--muted);background:rgba(255,255,255,.03);padding:4px 11px;border-radius:6px;border:1px solid rgba(255,255,255,.05);transition:var(--tr)}
.skill-pills .pill:hover{border-color:var(--primary);color:var(--pri-b);background:rgba(168,85,247,.06)}

/* ════════════════════════════════════════
   PROJECTS — Horizontal Feature Cards
════════════════════════════════════════ */
.projects{padding:100px 7%;background:var(--bg2)}
.proj-cards{display:flex;flex-direction:column;gap:20px;max-width:1100px;margin:0 auto}

/* ── Feature row card ── */
.proj-feat{
    display:grid;grid-template-columns:420px 1fr;
    border-radius:18px;overflow:hidden;
    background:var(--bg3);
    border:1px solid rgba(168,85,247,.1);
    transition:border-color .35s,box-shadow .35s,transform .3s;
    min-height:280px;
}
.proj-feat:hover{
    border-color:rgba(168,85,247,.35);
    box-shadow:0 18px 55px rgba(168,85,247,.13);
    transform:translateY(-4px);
}
/* Flip: image on right */
.proj-feat--flip{grid-template-columns:1fr 420px}
.proj-feat--flip .proj-feat-img{order:2}
.proj-feat--flip .proj-feat-info{order:1}

/* Image pane */
.proj-feat-img{
    position:relative;overflow:hidden;
    background:linear-gradient(135deg,rgba(168,85,247,.06),rgba(232,121,249,.03));
    min-height:260px;
}
.proj-feat-img img{
    width:100%;height:100%;
    object-fit:contain;   /* Full image, no cropping */
    object-position:center;
    padding:16px;
    transition:transform .5s ease;
}
.proj-feat:hover .proj-feat-img img{transform:scale(1.04)}
.proj-feat-img.no-img img{display:none}
.proj-feat-noimg{
    position:absolute;inset:0;
    display:none;align-items:center;justify-content:center;
    font-size:3rem;color:rgba(168,85,247,.12);
}
.proj-feat-img.no-img .proj-feat-noimg{display:flex}
.proj-feat-num{
    position:absolute;top:14px;left:14px;z-index:2;
    font-family:var(--fh);font-size:.7rem;font-weight:800;
    color:rgba(168,85,247,.5);background:rgba(6,6,16,.75);
    border:1px solid rgba(168,85,247,.15);
    padding:3px 9px;border-radius:6px;
    backdrop-filter:blur(6px);letter-spacing:1px;
}

/* Info pane */
.proj-feat-info{
    padding:28px 32px;
    display:flex;flex-direction:column;gap:12px;
    justify-content:center;
}
.proj-feat-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.proj-feat-cat{
    font-size:.62rem;font-weight:700;padding:3px 10px;border-radius:5px;
    background:linear-gradient(135deg,var(--pri-d),var(--primary));
    color:#fff;text-transform:uppercase;letter-spacing:.5px;
}
.proj-feat-year{
    font-size:.62rem;font-weight:600;color:var(--muted);
    border:1px solid rgba(255,255,255,.07);padding:3px 9px;border-radius:5px;
}
.proj-feat-info h3{
    font-family:var(--fh);font-size:1.25rem;font-weight:800;
    color:var(--text);line-height:1.2;
    transition:color .3s;
}
.proj-feat:hover .proj-feat-info h3{color:var(--pri-b)}
.proj-feat-info p{
    font-size:.87rem;color:var(--muted);line-height:1.75;
    /* No line-clamp — full description always visible */
}
.proj-feat-stack{display:flex;flex-wrap:wrap;gap:6px}
.proj-feat-stack span{
    font-size:.66rem;font-weight:600;padding:3px 10px;border-radius:5px;
    border:1px solid rgba(168,85,247,.15);color:var(--pri-b);background:rgba(168,85,247,.04);
}
.proj-feat-links{display:flex;gap:10px;flex-wrap:wrap;margin-top:4px}
.proj-feat-links a{
    display:inline-flex;align-items:center;gap:7px;
    font-size:.78rem;font-weight:700;
    padding:9px 18px;border-radius:8px;
    background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);
    color:var(--muted);transition:var(--tr);
}
.proj-feat-links a:hover{border-color:var(--primary);color:var(--pri-b);background:rgba(168,85,247,.07)}
.proj-feat-links a.proj-feat-live{
    background:linear-gradient(135deg,var(--pri-d),var(--primary));
    border:none;color:#fff;
    box-shadow:0 6px 18px rgba(168,85,247,.22);
}
.proj-feat-links a.proj-feat-live:hover{filter:brightness(1.1);transform:translateY(-2px);box-shadow:0 10px 26px rgba(168,85,247,.38)}

/* Coming soon row */
.proj-feat--coming{
    grid-template-columns:1fr;
    border:1px dashed rgba(168,85,247,.14);
    background:rgba(12,12,28,.45);
    min-height:100px;
}
.proj-feat--coming:hover{border-color:rgba(168,85,247,.28);transform:translateY(-3px);box-shadow:0 10px 30px rgba(168,85,247,.07)}
.proj-feat-coming-inner{
    display:flex;align-items:center;gap:20px;
    padding:28px 32px;
}
.proj-feat-coming-icon{
    width:50px;height:50px;flex-shrink:0;border-radius:13px;
    background:rgba(168,85,247,.06);border:1px solid rgba(168,85,247,.12);
    display:flex;align-items:center;justify-content:center;
    font-size:1.3rem;color:rgba(169, 85, 247, 0.664);
}
.proj-feat-coming-inner h3{font-size:.95rem;font-weight:700;color:rgba(255, 255, 255, 0.884);margin-bottom:4px}
.proj-feat-coming-inner p{font-size:.78rem;color:rgb(143, 104, 179);line-height:1.5}
.proj-coming-dots{display:flex;gap:6px;margin-left:auto;flex-shrink:0}
.proj-coming-dots span{
    width:7px;height:7px;border-radius:50%;
    background:rgba(161, 89, 228, 0.727);animation:cdot 1.5s ease-in-out infinite;
}
.proj-coming-dots span:nth-child(2){animation-delay:.2s}
.proj-coming-dots span:nth-child(3){animation-delay:.4s}
@keyframes cdot{0%,100%{opacity:.2;transform:scale(.8)}50%{opacity:.65;transform:scale(1.1)}}

/* ════════════════════════════════════════
   CONTACT
════════════════════════════════════════ */
.contact{padding:100px 7%}
.contact-inner{display:grid;grid-template-columns:1fr 1.1fr;gap:70px;align-items:start;max-width:1100px;margin:0 auto}
.contact-left .section-heading{margin-bottom:14px}
.contact-subtext{font-size:.95rem;color:var(--muted);line-height:1.85;margin-bottom:32px;font-weight:400}
.contact-items{display:flex;flex-direction:column;gap:12px}
.c-item{
    display:flex;align-items:center;gap:16px;
    padding:16px 18px;border-radius:12px;
    background:rgba(14,14,30,.8);border:1px solid rgba(168,85,247,.08);
    transition:var(--tr);
}
.c-item:hover{border-color:rgba(168,85,247,.3);transform:translateX(6px);background:rgba(168,85,247,.05)}
.c-icon{
    width:42px;height:42px;border-radius:10px;flex-shrink:0;
    background:linear-gradient(135deg,rgba(168,85,247,.2),rgba(232,121,249,.1));
    display:flex;align-items:center;justify-content:center;
    font-size:.95rem;color:var(--primary);
}
.c-detail{display:flex;flex-direction:column;gap:2px;min-width:0}
.c-label{font-size:.62rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:1px}
.c-val{font-size:.84rem;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Floating-label form */
.contact-form{
    background:var(--bg3);border:1px solid rgba(168,85,247,.12);
    border-radius:18px;padding:34px;
    box-shadow:0 20px 60px rgba(0,0,0,.35);
}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form-field{position:relative;margin-bottom:20px}
.form-field input,.form-field textarea{
    width:100%;padding:18px 16px 8px;
    background:rgba(168,85,247,.03);
    border:1.5px solid rgba(168,85,247,.1);
    border-radius:10px;color:var(--text);
    font-size:.9rem;font-family:var(--fb);font-weight:400;
    outline:none;transition:border-color .3s,box-shadow .3s;
    resize:vertical;
}
.form-field input:focus,.form-field textarea:focus{
    border-color:var(--primary);
    box-shadow:0 0 0 3px rgba(168,85,247,.1);
}
.form-field label{
    position:absolute;left:16px;top:14px;
    font-size:.82rem;font-weight:600;color:var(--muted);
    pointer-events:none;transition:all .25s ease;
    letter-spacing:.2px;
}
.form-field input:focus ~ label,
.form-field input:not(:placeholder-shown) ~ label,
.form-field textarea:focus ~ label,
.form-field textarea:not(:placeholder-shown) ~ label{
    top:6px;font-size:.62rem;color:var(--primary);letter-spacing:1px;text-transform:uppercase;
}
.form-success{display:none;color:#4ade80;font-size:.84rem;margin-top:10px;font-weight:600}
.form-success.show{display:block}

/* ════════════════════════════════════════
   FOOTER
════════════════════════════════════════ */
.footer{padding:24px 7%;border-top:1px solid rgba(255,255,255,.04)}
.footer-inner{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}
.footer-logo{font-family:var(--fh);font-size:1.2rem;font-weight:800}
.footer-copy{font-size:.78rem;color:var(--muted)}
.footer-copy span{color:var(--primary)}
.footer-links{display:flex;gap:10px}
.footer-links a{
    width:34px;height:34px;border-radius:7px;
    border:1px solid rgba(168,85,247,.1);
    display:flex;align-items:center;justify-content:center;
    color:var(--muted);font-size:.82rem;transition:var(--tr);
}
.footer-links a:hover{border-color:var(--primary);color:var(--primary);transform:translateY(-2px)}

/* Back to top */
#backToTop{
    position:fixed;bottom:28px;right:28px;
    width:44px;height:44px;
    background:linear-gradient(135deg,var(--pri-d),var(--primary));
    color:#fff;border:none;border-radius:10px;
    font-size:.85rem;display:flex;align-items:center;justify-content:center;
    cursor:pointer;opacity:0;pointer-events:none;transition:var(--tr);
    z-index:500;box-shadow:0 8px 24px rgba(168,85,247,.3);
}
#backToTop.visible{opacity:1;pointer-events:auto}
#backToTop:hover{transform:translateY(-4px) scale(1.08);box-shadow:0 16px 36px rgba(168,85,247,.45)}

/* ════════════════════════════════════════
   RESPONSIVE
════════════════════════════════════════ */
@media(max-width:1024px){
    .hero{gap:36px;padding:110px 6% 70px}
    .hero-right{flex:0 0 300px;width:300px}
    .hero-img-frame{width:270px;height:320px}
    .about-inner{gap:44px}
    .proj-feat{grid-template-columns:340px 1fr}
    .proj-feat--flip{grid-template-columns:1fr 340px}
    .contact-inner{grid-template-columns:1fr;gap:44px}
}

@media(max-width:768px){
    /* ── Performance ── */
    #particles-canvas{display:none}
    .skills-bg-glow{display:none}
    .skill-bar-fill::after{display:none}
    .skill-category-card::after{display:none}
    .glass{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(14,14,30,.97)}
    .reveal,.reveal-up,.reveal-left,.reveal-right{transition:opacity .35s ease var(--d,0s),transform .35s ease var(--d,0s)}
    .reveal-up{transform:translateY(16px)}
    .reveal-left{transform:translateX(-16px)}
    .reveal-right{transform:translateX(16px)}

    html,body{width:100%;overflow-x:hidden}
    section,header{padding-left:5%;padding-right:5%}

    /* ── Hero ── */
    .hero{flex-direction:column;text-align:center;padding:90px 5% 60px;gap:24px;height:auto;align-items:center}
    .hero-left{max-width:100%;align-items:center;display:flex;flex-direction:column}
    .hero-tag{align-self:center}
    .hero-actions{justify-content:center}
    .hero-socials{justify-content:center}
    .hero-right{order:-1;width:100%;align-items:center}
    .hero-img-frame{width:200px;height:240px}
    .scroll-cue{display:none}
    .hero-img-frame img{animation:none}

    /* FIX 1 — Stat cards become horizontal circles */
    .hero-stat-cards{
        display:flex;flex-direction:row;
        justify-content:center;gap:14px;
        width:100%;margin-top:4px;
    }
    .stat-card{
        width:90px;height:90px;
        border-radius:50%;
        display:flex;flex-direction:column;align-items:center;justify-content:center;
        padding:0;
        background:rgba(14,14,30,.9);
        border:1.5px solid rgba(168,85,247,.2);
        box-shadow:0 0 18px rgba(168,85,247,.08);
        transition:var(--tr);
        flex:none;
    }
    .stat-card:hover{
        border-color:var(--primary);
        box-shadow:0 0 28px rgba(168,85,247,.22);
        transform:translateY(-4px);
    }
    .stat-num{font-size:1.2rem;line-height:1}
    .stat-label{font-size:.48rem;letter-spacing:.4px;margin-top:3px;text-align:center;padding:0 4px}

    /* ── About ── */
    .about{padding:80px 5%}
    .about-inner{grid-template-columns:1fr;gap:32px}
    /* FIX 2 — Center left-aligned section titles on mobile */
    .section-title.left-align{text-align:center}

    /* ── Resume ── */
    .resume-section{padding:80px 5%}
    .resume-layout{grid-template-columns:1fr;gap:36px}
    .resume-doc{max-width:100%}

    /* ── Skills ── */
    .skills-section{padding:80px 5%}
    .skill-bars-grid{grid-template-columns:1fr;gap:16px}
    .grouped-skills-grid{grid-template-columns:1fr}

    /* ── Projects ── */
    .projects{padding:80px 5%}
    .proj-feat{grid-template-columns:1fr!important}
    .proj-feat--flip .proj-feat-img,.proj-feat--flip .proj-feat-info{order:unset}
    .proj-feat-img{min-height:220px}
    .proj-feat-info{padding:22px}

    /* ── Contact ── */
    .contact{padding:80px 5%}
    .contact-inner{gap:32px}
    .form-row{grid-template-columns:1fr}
    .contact-form{padding:20px}

    /* ── Footer ── */
    .footer{padding:20px 5%}
    .footer-inner{flex-direction:column;text-align:center;gap:10px}
    .footer-links{justify-content:center}
    #backToTop{display:none!important}

    /* ── Header ── */
    header{padding:14px 5%}
    header.scrolled{padding:10px 5%;backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(6,6,16,.98)}

    /* FIX 3 — New premium compact mobile nav ── */
    .hamburger{display:flex}

    /* Overlay backdrop */
    .nav-overlay{
        display:none;position:fixed;inset:0;
        background:rgba(0,0,0,.55);
        backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
        z-index:998;opacity:0;transition:opacity .4s ease;
    }
    .nav-overlay.visible{display:block}
    .nav-overlay.active{opacity:1}

    /* Panel — compact centered column, not full-height sidebar */
    .nav-links{
        position:fixed;
        top:50%;left:50%;
        transform:translate(-50%,-50%) scale(.88);
        width:min(320px,88vw);
        height:auto;
        max-height:90dvh;
        background:linear-gradient(160deg,#0f0d22 0%,#13102a 100%);
        border:1px solid rgba(168,85,247,.22);
        border-radius:20px;
        box-shadow:0 32px 80px rgba(0,0,0,.7), 0 0 0 1px rgba(168,85,247,.06), 0 0 60px rgba(168,85,247,.08);
        flex-direction:column;
        align-items:center;
        justify-content:center;
        gap:0;
        padding:28px 0 24px;
        z-index:1000;
        opacity:0;
        pointer-events:none;
        transition:transform .42s cubic-bezier(.34,1.28,.64,1), opacity .3s ease;
        overflow-y:auto;
    }
    .nav-links.open{
        transform:translate(-50%,-50%) scale(1);
        opacity:1;
        pointer-events:auto;
    }

    /* Items stagger in */
    .nav-links li{
        width:100%;
        opacity:0;
        transform:translateY(12px);
        transition:opacity .3s ease, transform .3s ease;
    }
    .nav-links.open li:nth-child(1){transition-delay:.05s}
    .nav-links.open li:nth-child(2){transition-delay:.09s}
    .nav-links.open li:nth-child(3){transition-delay:.13s}
    .nav-links.open li:nth-child(4){transition-delay:.17s}
    .nav-links.open li:nth-child(5){transition-delay:.21s}
    .nav-links.open li:nth-child(6){transition-delay:.25s}
    .nav-links.open li{opacity:1;transform:translateY(0)}

    /* Nav number — tiny label above link text */
    .nav-num{
        display:block;
        font-size:.5rem;font-weight:800;
        color:rgba(168,85,247,.3);letter-spacing:2px;
        text-transform:uppercase;line-height:1;
        margin-bottom:2px;
    }

    /* Each link — centered, compact */
    .nav-link{
        display:flex;flex-direction:column;
        align-items:center;justify-content:center;
        width:100%;padding:12px 24px;
        font-size:.78rem;font-weight:800;letter-spacing:1.5px;
        color:var(--muted);text-transform:uppercase;
        border-bottom:1px solid rgba(255,255,255,.04);
        transition:color .2s, background .2s;
        gap:1px;
    }
    .nav-link::after{display:none}
    .nav-link:hover{color:var(--pri-b);background:rgba(168,85,247,.05)}
    .nav-link.active{
        color:var(--primary);
        background:rgba(168,85,247,.07);
        position:relative;
    }
    .nav-link.active::before{
        content:'';
        position:absolute;left:0;top:50%;
        transform:translateY(-50%);
        width:3px;height:55%;
        background:linear-gradient(to bottom,var(--primary),var(--sec));
        border-radius:0 3px 3px 0;
    }

    /* CTA button inside menu */
    .nav-link--cta{
        margin:14px 20px 0;
        width:calc(100% - 40px);
        justify-content:center;flex-direction:row;gap:8px;
        border-radius:10px;
        background:linear-gradient(135deg,var(--pri-d),var(--primary));
        color:#fff!important;border:none;border-bottom:none;
        padding:12px 20px;
        text-transform:none!important;font-size:.82rem!important;
        letter-spacing:.3px;font-weight:700;
        box-shadow:0 6px 20px rgba(168,85,247,.3);
    }
    .nav-link--cta .nav-num{display:none}
    .nav-link--cta.active{background:linear-gradient(135deg,var(--pri-d),var(--primary))}
    .nav-link--cta.active::before{display:none}

    /* Socials row at bottom of menu */
    .nav-menu-socials{
        display:flex;gap:10px;
        padding:16px 20px 0;
        margin-top:14px;
        border-top:1px solid rgba(168,85,247,.08);
        width:100%;justify-content:center;
    }
    .nav-menu-socials a{
        width:34px;height:34px;border-radius:8px;
        border:1px solid rgba(168,85,247,.18);
        display:flex;align-items:center;justify-content:center;
        color:var(--muted);font-size:.82rem;
        transition:var(--tr);
    }
    .nav-menu-socials a:hover{border-color:var(--primary);color:var(--primary)}
}

@media(max-width:400px){
    .hero-name{font-size:2.5rem;letter-spacing:-2px}
    .hero-stat-cards{gap:8px}
    .stat-card{width:76px;height:76px}
    .stat-num{font-size:1rem}
    .stat-label{font-size:.42rem}
    .hero-actions{flex-direction:column;align-items:center;width:100%}
    .hero-actions a{width:100%;justify-content:center}
    header{padding:12px 4%}
    .nav-links{width:92vw}
}