/* ---------- HERO (index.html) ---------- */
#hero{padding-top:5.5rem;padding-bottom:4rem}
.hero-grid{display:flex;gap:3rem;align-items:flex-start;justify-content:space-between;flex-wrap:wrap}
.hero-main{flex:1;min-width:300px}
.prompt-icon{font-size:1.9rem;font-weight:800;color:var(--accent);margin-bottom:1.2rem;display:flex;align-items:baseline;gap:2px}
.prompt-icon .blink{animation:blink 1.1s step-end infinite}
h1.headline{font-size:clamp(2.4rem,7vw,4.2rem);font-weight:800;line-height:1.05;letter-spacing:-1px;text-transform:uppercase;color:var(--text)}
.headline .accent{color:var(--accent)}
.subhead{font-size:clamp(1.1rem,2.5vw,1.5rem);font-weight:700;color:var(--accent);margin-top:1.1rem}
.subtitle{color:var(--muted);font-size:.95rem;margin-top:.9rem;max-width:560px}
.avatar-box{width:150px;height:150px;flex-shrink:0;border:1.5px solid var(--accent-soft);border-radius:14px;overflow:hidden;background:var(--surface);box-shadow:0 0 40px var(--accent-glow)}
.avatar-box img{width:100%;height:100%;object-fit:cover}
.hero-stats{margin-top:3rem}

/* ---------- ABOUT ---------- */
.about-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:2.6rem;align-items:start}
.about-text p{color:var(--muted);margin-bottom:1.1rem;font-size:1rem}
.about-text strong{color:var(--text)}
.radar-box{background:var(--surface);border:1.5px solid var(--border);border-radius:12px;padding:1.5rem}
.radar-box-title{font-size:.68rem;color:var(--muted);letter-spacing:2px;text-transform:uppercase;margin-bottom:.9rem;text-align:center}

/* ---------- EXPERIENCE ---------- */
.mission{margin-bottom:1.1rem}
.mission.active{border-color:var(--accent-soft)}
.mission-top{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:.5rem;margin-bottom:.9rem}
.mission-role{font-size:1.05rem;color:var(--text);font-weight:700}
.mission-org{font-size:.78rem;color:var(--accent);margin-top:.15rem}
.mission-status{font-size:.62rem;font-weight:700;letter-spacing:1.5px;padding:.25rem .6rem;border-radius:5px;border:1px solid var(--accent-soft);color:var(--accent);white-space:nowrap}
.mission-status.archived{border-color:var(--border);color:var(--muted)}
.mission ul{list-style:none;color:var(--muted);font-size:.88rem}
.mission ul li{position:relative;padding-left:1.2rem;margin-bottom:.5rem}
.mission ul li::before{content:'▹';position:absolute;left:0;color:var(--accent)}

/* ---------- SKILLS (on experience page) ---------- */
.skill-cat{margin-bottom:1.5rem}
.skill-cat-label{font-size:.7rem;color:var(--accent);letter-spacing:2px;text-transform:uppercase;font-weight:700;margin-bottom:.7rem;display:block}
.skill-tags{display:flex;flex-wrap:wrap;gap:.55rem}
.skill-tag{padding:.42rem .85rem;background:var(--surface);border:1px solid var(--border);border-radius:8px;font-size:.74rem;color:var(--text);transition:all .2s}
.skill-tag:hover{border-color:var(--accent);color:var(--accent)}

/* ---------- CERTIFICATIONS ---------- */
.certs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1rem}
.cert-card{
  background:var(--surface);border:1.5px solid var(--border);border-radius:12px;
  padding:1.2rem 1rem;text-align:center;text-decoration:none;color:var(--text);transition:all .22s;
  display:flex;flex-direction:column;align-items:center;gap:.55rem;
}
.cert-card:hover{border-color:var(--accent-soft);box-shadow:0 0 24px var(--accent-glow);transform:translateY(-3px)}
.cert-badge-img{width:52px;height:52px;object-fit:contain}
.cert-icon-fallback{width:52px;height:52px;border-radius:8px;background:var(--surface2);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--accent);font-size:.85rem}
.cert-name{font-size:.78rem;font-weight:700;line-height:1.3}
.cert-issuer{font-size:.66rem;color:var(--muted)}
a.cert-card{text-decoration:none}

/* ---------- PROJECTS ---------- */
.ops-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1rem}
.ops-card{
  background:var(--surface);border:1.5px solid var(--border);border-radius:12px;padding:1.2rem;
  text-decoration:none;color:var(--text);transition:all .2s;display:flex;flex-direction:column;gap:.5rem;
}
.ops-card:hover{border-color:var(--accent-soft);transform:translateY(-3px);box-shadow:0 0 24px var(--accent-glow)}
.ops-title{font-weight:700;font-size:.9rem}
.ops-card:hover .ops-title{color:var(--accent)}
.ops-desc{font-size:.83rem;color:var(--muted);line-height:1.6}
.ops-meta{font-size:.7rem;color:var(--muted);margin-top:auto}
.ops-meta b{color:var(--accent)}

/* ---------- HALL OF FAME (achievements) ---------- */
.hof-row{display:flex;align-items:center;gap:1rem;background:var(--surface);border:1.5px solid var(--border);border-radius:12px;padding:1.1rem 1.3rem;margin-bottom:.8rem;transition:all .2s}
.hof-row:hover{border-color:var(--accent-soft);transform:translateX(4px)}
.hof-icon{width:42px;height:42px;border-radius:10px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:1.2rem;background:var(--surface2);border:1.5px solid var(--accent-soft)}
.hof-body{flex:1;min-width:0}
.hof-title{font-weight:700;font-size:.92rem}
.hof-desc{color:var(--muted);font-size:.82rem;margin-top:.2rem}
.hof-desc a{color:var(--accent);text-decoration:underline}
.hof-tag{font-size:.62rem;font-weight:700;padding:.25rem .6rem;border-radius:6px;white-space:nowrap;letter-spacing:1px}
.tag-crit{background:rgba(255,84,112,.12);color:var(--crit)}
.tag-high{background:rgba(255,159,67,.12);color:var(--high)}
.tag-med{background:rgba(255,209,102,.12);color:var(--med)}

/* ---------- CONTACT ---------- */
.contact-card{background:var(--surface);border:1.5px solid var(--accent-soft);border-radius:16px;padding:2.4rem;text-align:center;box-shadow:0 0 50px var(--accent-glow)}
.contact-card h3{font-size:1.3rem;font-weight:800;margin-bottom:.6rem}
.contact-card p{color:var(--muted);margin-bottom:1.5rem;font-size:.9rem}
.contact-links{display:flex;gap:.8rem;flex-wrap:wrap;justify-content:center}
.clink{
  display:flex;align-items:center;gap:.55rem;padding:.7rem 1.2rem;border-radius:8px;
  background:var(--surface2);border:1px solid var(--border);text-decoration:none;color:var(--text);
  font-size:.8rem;transition:all .2s;
}
.clink:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-2px)}
.clink svg{width:15px;height:15px;fill:currentColor}

/* ---------- RESUME (print-style page) ---------- */
.resume-doc{background:var(--surface);border:1.5px solid var(--border);border-radius:12px;padding:2.4rem;max-width:820px;margin:0 auto}
.resume-doc h3{color:var(--accent);font-size:.95rem;text-transform:uppercase;letter-spacing:1.5px;margin:1.6rem 0 .8rem;padding-bottom:.4rem;border-bottom:1px solid var(--border)}
.resume-doc h3:first-child{margin-top:0}
.resume-doc p,.resume-doc li{color:var(--muted);font-size:.86rem;line-height:1.7}
.resume-doc strong{color:var(--text)}
.resume-doc ul{list-style:none;margin-top:.4rem}
.resume-doc ul li{position:relative;padding-left:1.1rem;margin-bottom:.4rem}
.resume-doc ul li::before{content:'▹';position:absolute;left:0;color:var(--accent)}
.resume-entry{margin-bottom:1.2rem}
.resume-entry:last-child{margin-bottom:0}
.resume-entry-top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.4rem}
.resume-entry-role{color:var(--text);font-weight:700;font-size:.9rem}
.resume-entry-date{color:var(--muted);font-size:.72rem}

/* ---------- BLOG placeholder ---------- */
.coming-soon{text-align:center;padding:5rem 1rem}
.coming-soon .icon{font-size:2.5rem;margin-bottom:1rem}
.coming-soon h2{margin-bottom:.6rem}
.coming-soon p{color:var(--muted);max-width:480px;margin:0 auto}

/* ---------- RESPONSIVE ---------- */
@media(max-width:820px){
  .about-grid{grid-template-columns:1fr}
  .stat-row{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:600px){
  .hero-grid{flex-direction:column-reverse}
  .avatar-box{width:110px;height:110px}
}