:root {
  --navy: #0A1A33;
  --navy-2: #0d203b;
  --navy-3: #112845;
  --surface: #10243d;
  --surface-2: #132b48;
  --mint: #6FAF8E;
  --lime: #A8D5A2;
  --cyan: #00D1B2;
  --blue: #2EA7FF;
  --white: #F5F7FA;
  --text: #EAF0F6;
  --muted: #94A4B7;
  --line: rgba(255,255,255,.09);
  --line-bright: rgba(168,213,162,.24);
  --glass: rgba(15,35,59,.72);
  --shadow: 0 28px 90px rgba(0,0,0,.28);
  --radius: 28px;
  --max: 1200px;
}

html[data-theme="light"] {
  --navy: #F5F7FA;
  --navy-2: #FFFFFF;
  --navy-3: #EDF2F5;
  --surface: #FFFFFF;
  --surface-2: #F2F6F8;
  --white: #0A1A33;
  --text: #17263A;
  --muted: #607185;
  --line: rgba(10,26,51,.10);
  --line-bright: rgba(0,150,135,.22);
  --glass: rgba(255,255,255,.80);
  --shadow: 0 28px 70px rgba(10,26,51,.10);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: "Poppins", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--text);
  background: var(--navy);
  line-height: 1.65;
  overflow-x: hidden;
}
body::selection { background: var(--cyan); color: #07111f; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button { font: inherit; }
.container { width: min(calc(100% - 40px), var(--max)); margin-inline: auto; }

.page-noise {
  position: fixed; inset: 0; pointer-events: none; z-index: 999;
  opacity: .025;
  background-image:
    radial-gradient(circle at 15% 25%, #fff 0 1px, transparent 1px),
    radial-gradient(circle at 85% 60%, #fff 0 1px, transparent 1px);
  background-size: 38px 38px, 54px 54px;
}
.cursor-glow {
  position: fixed; width: 380px; height: 380px; border-radius: 50%; pointer-events: none; z-index: -1;
  background: radial-gradient(circle, rgba(0,209,178,.075), transparent 65%);
  transform: translate(-50%, -50%); transition: opacity .3s ease;
}

.header {
  position: fixed; inset: 0 0 auto 0; z-index: 100;
  background: color-mix(in srgb, var(--navy) 82%, transparent);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid transparent;
  transition: border-color .25s ease, background .25s ease;
}
.header.scrolled { border-color: var(--line); }
.nav-shell { min-height: 84px; display: flex; align-items: center; gap: 26px; }
.brand { width: 215px; display: block; }
.brand img { width: 100%; height: 58px; object-fit: contain; object-position: left center; }
.nav { margin-left: auto; display: flex; gap: 28px; }
.nav a { color: var(--muted); font-size: .88rem; font-weight: 600; transition: .2s ease; }
.nav a:hover, .nav a.active { color: var(--cyan); }
.nav-cta { display: flex; align-items: center; gap: 10px; }
.theme-toggle {
  width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 13px;
  color: var(--text); background: transparent; cursor: pointer; transition: .2s ease;
}
.theme-toggle:hover { border-color: var(--line-bright); color: var(--cyan); }
.mobile-menu { display: none; }

.button {
  min-height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  padding: 0 20px; border-radius: 14px; font-size: .88rem; font-weight: 700;
  border: 1px solid transparent; transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.button:hover { transform: translateY(-2px); }
.button-small { min-height: 42px; padding-inline: 15px; }
.button-primary {
  background: linear-gradient(135deg, var(--lime), var(--cyan));
  color: #071A2D; box-shadow: 0 12px 28px rgba(0,209,178,.15);
}
.button-outline { border-color: var(--line); color: var(--text); background: rgba(255,255,255,.02); }
.button-outline:hover { border-color: var(--line-bright); color: var(--cyan); }
.button-ghost { color: var(--text); background: transparent; border-color: transparent; }
.button-ghost:hover { color: var(--cyan); }

.hero {
  min-height: 100vh; position: relative; padding: 160px 0 62px; display: flex; flex-direction: column; justify-content: center;
  background:
    linear-gradient(rgba(10,26,51,.76), rgba(10,26,51,.92)),
    radial-gradient(circle at 70% 15%, rgba(0,209,178,.15), transparent 35%);
}
html[data-theme="light"] .hero {
  background:
    linear-gradient(rgba(245,247,250,.83), rgba(245,247,250,.96)),
    radial-gradient(circle at 70% 15%, rgba(0,209,178,.11), transparent 35%);
}
.hero-orb { position: absolute; border-radius: 50%; filter: blur(80px); pointer-events: none; }
.hero-orb-a { width: 360px; height: 360px; right: -120px; top: 140px; background: rgba(46,167,255,.10); }
.hero-orb-b { width: 300px; height: 300px; left: -80px; bottom: 100px; background: rgba(168,213,162,.08); }
.hero-grid { display: grid; grid-template-columns: 1.08fr .92fr; gap: 66px; align-items: center; }
.hero-kicker {
  display: inline-flex; align-items: center; gap: 9px; padding: 8px 12px;
  border: 1px solid var(--line-bright); background: rgba(0,209,178,.055); border-radius: 999px;
  color: var(--lime); font-size: .75rem; font-weight: 700; letter-spacing: .03em;
}
.live-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 0 5px rgba(0,209,178,.10); }
.eyebrow {
  color: var(--lime); font-size: .76rem; font-weight: 700; letter-spacing: .18em; margin: 22px 0 12px;
}
.hero h1 {
  font-size: clamp(3.35rem, 7vw, 6.9rem); line-height: .95; letter-spacing: -.065em;
  margin: 0; font-weight: 600; color: var(--white);
}
.hero h1 span {
  background: linear-gradient(95deg, var(--lime), var(--cyan), var(--blue));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.hero-intro { max-width: 730px; color: var(--muted); font-size: 1.08rem; margin: 27px 0 0; }
.hero-actions { margin-top: 33px; display: flex; gap: 12px; flex-wrap: wrap; }
.hero-proof { margin-top: 50px; display: grid; grid-template-columns: 1fr 1fr 1.3fr; gap: 14px; max-width: 760px; }
.hero-proof div { padding-left: 18px; border-left: 1px solid var(--line-bright); }
.hero-proof strong { display: block; color: var(--white); font-size: 1.15rem; }
.hero-proof span { display: block; color: var(--muted); font-size: .72rem; margin-top: 2px; }

.hero-visual { position: relative; }
.logo-stage {
  width: min(100%, 470px); aspect-ratio: 1; margin-inline: auto; position: relative; display: grid; place-items: center;
}
.stage-ring { position: absolute; border: 1px solid rgba(0,209,178,.14); border-radius: 50%; }
.stage-ring-1 { inset: 8%; animation: spin 22s linear infinite; border-style: dashed; }
.stage-ring-2 { inset: 19%; border-color: rgba(168,213,162,.17); }
.stage-grid {
  position: absolute; inset: 12%; border-radius: 50%;
  background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size: 28px 28px; mask-image: radial-gradient(circle, #000 52%, transparent 78%);
}
.hero-lion { width: 62%; filter: drop-shadow(0 24px 36px rgba(0,209,178,.16)); z-index: 2; }
.floating-chip {
  position: absolute; z-index: 3; display: flex; align-items: center; gap: 8px; padding: 10px 13px;
  border: 1px solid var(--line); background: color-mix(in srgb, var(--glass) 92%, transparent);
  box-shadow: var(--shadow); border-radius: 14px; color: var(--muted); font-size: .72rem; font-weight: 600;
  backdrop-filter: blur(12px);
}
.floating-chip span { color: var(--cyan); }
.chip-a { top: 15%; right: 0; }
.chip-b { bottom: 25%; left: -2%; }
.chip-c { bottom: 6%; right: 10%; }

.hero-terminal {
  width: min(95%, 465px); margin: -55px auto 0; position: relative; z-index: 5;
  border-radius: 20px; overflow: hidden; background: #061324; border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 30px 90px rgba(0,0,0,.35);
}
.terminal-bar { height: 38px; background: #0c1c31; display: flex; align-items: center; gap: 6px; padding: 0 14px; border-bottom: 1px solid rgba(255,255,255,.06); }
.terminal-bar i { width: 8px; height: 8px; border-radius: 50%; background: rgba(168,213,162,.7); }
.terminal-bar small { margin-left: 8px; color: #667b93; font-size: .66rem; }
.terminal-body { padding: 19px 22px 21px; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-size: .73rem; }
.terminal-body p { margin: 2px 0; color: #8295aa; }
.terminal-body p span { color: var(--cyan); }
.terminal-output { color: #e7edf4 !important; margin-bottom: 10px !important; }
.terminal-success { color: #93ddb3 !important; }

.client-strip { margin-top: 86px; padding-top: 28px; border-top: 1px solid var(--line); }
.client-strip > p { margin: 0 0 20px; color: var(--muted); font-size: .69rem; text-transform: uppercase; letter-spacing: .14em; }
.client-logos { display: grid; grid-template-columns: repeat(6, 1fr); gap: 9px; }
.client-logo {
  min-height: 72px; border: 1px solid var(--line); border-radius: 15px; background: rgba(255,255,255,.025);
  display: flex; align-items: center; justify-content: center; padding: 12px; overflow: hidden;
  filter: saturate(.7); opacity: .78; transition: .2s ease;
}
.client-logo:hover { opacity: 1; filter: saturate(1); border-color: var(--line-bright); transform: translateY(-2px); }
.client-logo img { max-height: 42px; max-width: 100%; object-fit: contain; }
.client-logo span { display: none; text-align: center; color: var(--muted); font-size: .74rem; font-weight: 700; }

.section { padding: 116px 0; position: relative; }
.section-tint { background: var(--navy-2); border-block: 1px solid var(--line); }
.section-head { display: flex; justify-content: space-between; gap: 70px; align-items: end; margin-bottom: 52px; }
.section-head > div { max-width: 730px; }
.section-head .eyebrow { margin-top: 0; }
.section-head h2, .about-copy h2, .contact-copy h2 {
  margin: 0; color: var(--white); font-size: clamp(2.5rem, 4.8vw, 5.1rem);
  line-height: 1.02; letter-spacing: -.055em; font-weight: 600;
}
.section-intro { color: var(--muted); max-width: 410px; margin: 0; font-size: .95rem; }

.expertise-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.feature-card {
  min-height: 355px; padding: 32px; border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--surface); position: relative; overflow: hidden; transition: .25s ease;
}
.feature-card::before {
  content:""; position:absolute; width:180px; height:180px; border-radius:50%; right:-80px; top:-80px;
  background:rgba(0,209,178,.08); filter:blur(45px); opacity:0; transition:.25s ease;
}
.feature-card:hover { transform: translateY(-4px); border-color: var(--line-bright); box-shadow: var(--shadow); }
.feature-card:hover::before { opacity:1; }
.feature-card.featured { background: linear-gradient(145deg, var(--surface-2), var(--surface)); border-color: rgba(0,209,178,.18); }
.feature-number { position:absolute; top:25px; right:28px; color:rgba(168,213,162,.55); font-weight:700; letter-spacing:.12em; }
.feature-icon {
  width: 52px; height:52px; display:grid; place-items:center; border-radius:15px;
  background:rgba(0,209,178,.07); border:1px solid rgba(0,209,178,.16); color:var(--cyan);
  font-weight:700;
}
.feature-card h3 { margin: 26px 0 10px; font-size: 1.25rem; }
.feature-card p { color: var(--muted); margin:0; max-width:580px; }
.tag-list, .project-tags { display:flex; flex-wrap:wrap; gap:7px; margin-top:24px; }
.tag-list span, .project-tags span {
  padding:7px 10px; border:1px solid var(--line); border-radius:999px;
  color:var(--muted); font-size:.69rem; font-weight:600; background:rgba(255,255,255,.02);
}

.projects { display:grid; gap:14px; }
.project-card {
  display:grid; grid-template-columns: .42fr .58fr; border:1px solid var(--line); background:var(--surface);
  border-radius:24px; overflow:hidden; transition:.25s ease;
}
.project-card:hover { border-color:var(--line-bright); transform:translateY(-2px); box-shadow:0 20px 55px rgba(0,0,0,.12); }
.project-side { display:flex; gap:18px; align-items:center; padding:29px; border-right:1px solid var(--line); background:rgba(255,255,255,.012); }
.project-logo {
  width:86px; height:70px; flex:0 0 86px; border-radius:14px; background:#fff; display:grid; place-items:center; padding:10px; overflow:hidden;
}
.project-logo img { max-width:100%; max-height:100%; object-fit:contain; }
.project-logo span { display:none; color:#0A1A33; font-weight:800; font-size:.75rem; text-align:center; }
.project-logo.logo-gov { padding:7px; }
.project-logo.dnb-logo { background:#1732ba; }
.project-logo.greenchoice-logo { background:#fff; }
.project-period { color:var(--lime); font-size:.66rem; font-weight:700; letter-spacing:.11em; }
.project-side h3 { margin:4px 0 2px; font-size:1.06rem; line-height:1.25; }
.project-role { margin:0; color:var(--muted); font-size:.78rem; }
.project-main { padding:29px 32px; }
.project-main > p { color:var(--muted); margin:0; font-size:.91rem; }
.project-result { display:grid; grid-template-columns:82px 1fr; gap:11px; margin-top:17px; padding:14px 16px; border-left:2px solid var(--cyan); background:rgba(0,209,178,.045); border-radius:0 12px 12px 0; }
.project-result strong { color:var(--cyan); font-size:.75rem; }
.project-result span { color:var(--text); font-size:.82rem; }

.career-more { margin-top:24px; border:1px solid var(--line); border-radius:20px; background:var(--surface); overflow:hidden; }
.career-more summary {
  list-style:none; cursor:pointer; padding:20px 24px; display:flex; justify-content:space-between; align-items:center;
  font-weight:700; color:var(--text);
}
.career-more summary::-webkit-details-marker { display:none; }
.career-more summary span { color:var(--cyan); font-size:1.2rem; transition:.2s ease; }
.career-more[open] summary span { transform:rotate(45deg); }
.career-more-grid { padding:0 24px 24px; display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.career-more-grid div { padding:18px; border:1px solid var(--line); border-radius:14px; }
.career-more-grid span { color:var(--lime); font-size:.67rem; }
.career-more-grid strong { display:block; margin:4px 0 5px; }
.career-more-grid p { color:var(--muted); margin:0; font-size:.78rem; }

.stack-tabs { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:25px; }
.stack-tab {
  border:1px solid var(--line); border-radius:999px; padding:9px 14px; background:transparent; color:var(--muted);
  cursor:pointer; font-size:.76rem; font-weight:700; transition:.2s ease;
}
.stack-tab.active, .stack-tab:hover { color:#071a2d; background:linear-gradient(135deg,var(--lime),var(--cyan)); border-color:transparent; }
.stack-cloud { display:flex; flex-wrap:wrap; gap:10px; }
.stack-cloud span {
  padding:13px 16px; border:1px solid var(--line); border-radius:14px; background:var(--surface);
  color:var(--text); font-size:.81rem; font-weight:600; transition:.22s ease;
}
.stack-cloud span:hover { border-color:var(--line-bright); transform:translateY(-2px); color:var(--cyan); }
.stack-cloud span.hidden { display:none; }

.about-section { overflow:hidden; }
.about-orb {
  position:absolute; width:560px; height:560px; border-radius:50%; left:-280px; top:120px;
  background:radial-gradient(circle,rgba(0,209,178,.10),transparent 70%); filter:blur(15px); pointer-events:none;
}
.about-grid { display:grid; grid-template-columns:.78fr 1.22fr; gap:82px; align-items:center; }
.portrait-shell { position:relative; max-width:390px; margin:auto; }
.portrait-placeholder {
  aspect-ratio:4/5; border-radius:30px; border:1px solid var(--line-bright);
  background:
    linear-gradient(180deg,rgba(9,30,51,.10),rgba(8,24,43,.78)),
    radial-gradient(circle at 50% 28%,rgba(168,213,162,.15),transparent 35%),
    var(--surface);
  display:flex; flex-direction:column; align-items:center; justify-content:center; overflow:hidden; position:relative;
}
.portrait-placeholder::after {
  content:""; position:absolute; inset:auto 0 0 0; height:35%; background:linear-gradient(transparent,rgba(0,209,178,.07));
}
.portrait-placeholder img { width:62%; opacity:.92; filter:drop-shadow(0 20px 28px rgba(0,209,178,.18)); }
.portrait-placeholder span { margin-top:12px; color:var(--lime); font-size:.68rem; letter-spacing:.16em; font-weight:700; position:relative; z-index:2; }
.portrait-caption {
  position:absolute; left:24px; right:-28px; bottom:25px; z-index:4; padding:16px 18px; border-radius:16px;
  background:color-mix(in srgb,var(--glass) 94%,transparent); border:1px solid var(--line); backdrop-filter:blur(16px); box-shadow:var(--shadow);
}
.portrait-caption strong, .portrait-caption span { display:block; }
.portrait-caption strong { font-size:.88rem; }
.portrait-caption span { color:var(--muted); font-size:.72rem; margin-top:2px; }
.photo-note { max-width:390px; margin:16px auto 0; color:var(--muted); font-size:.66rem; text-align:center; }
.about-copy .eyebrow { margin-top:0; }
.about-copy h2 { font-size:clamp(2.65rem,4.6vw,4.8rem); }
.about-copy p { color:var(--muted); }
.about-copy .about-lead { color:var(--text); font-size:1.08rem; margin-top:28px; }
.about-facts { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:30px; }
.about-facts div { padding:16px; border:1px solid var(--line); border-radius:14px; background:var(--surface); }
.about-facts span { display:block; color:var(--muted); font-size:.64rem; margin-bottom:4px; }
.about-facts strong { display:block; font-size:.76rem; line-height:1.35; }

.cert-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.cert-card { border:1px solid var(--line); background:var(--surface); border-radius:20px; padding:24px; }
.cert-year { color:var(--cyan); font-size:.68rem; font-weight:700; letter-spacing:.11em; }
.cert-card h3 { margin:15px 0 8px; font-size:1rem; }
.cert-card p { margin:0; color:var(--muted); font-size:.78rem; }

.recommendations { padding-top:105px; }
.quote-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.testimonial { margin:0; padding:31px; border:1px solid var(--line); border-radius:24px; background:var(--surface); position:relative; }
.quote-mark { position:absolute; right:25px; top:16px; font-size:3.5rem; line-height:1; color:rgba(168,213,162,.18); }
.testimonial > p { margin:0; font-size:1rem; color:var(--text); max-width:90%; }
.testimonial footer { margin-top:25px; padding-top:18px; border-top:1px solid var(--line); }
.testimonial footer strong, .testimonial footer span { display:block; }
.testimonial footer span { color:var(--muted); font-size:.72rem; margin-top:3px; }

.contact-section { padding-top:55px; }
.contact-card {
  border:1px solid rgba(0,209,178,.20); border-radius:32px; padding:50px; display:grid;
  grid-template-columns:100px 1fr auto; gap:34px; align-items:center; position:relative; overflow:hidden;
  background:linear-gradient(135deg,var(--surface-2),var(--surface));
}
.contact-card::after { content:""; position:absolute; width:380px; height:380px; border-radius:50%; right:-140px; top:-170px; background:rgba(0,209,178,.09); filter:blur(65px); }
.contact-mark { width:90px; height:90px; border-radius:22px; display:grid; place-items:center; border:1px solid var(--line-bright); background:rgba(0,209,178,.05); }
.contact-mark img { width:74%; }
.contact-copy { position:relative; z-index:2; }
.contact-copy .eyebrow { margin-top:0; }
.contact-copy h2 { font-size:clamp(2rem,3.4vw,3.6rem); }
.contact-copy p:last-child { color:var(--muted); max-width:650px; }
.contact-links { display:flex; flex-direction:column; gap:9px; align-items:stretch; position:relative; z-index:2; }
.contact-links span { color:var(--muted); font-size:.66rem; text-align:center; }

.footer { padding:35px 0 42px; }
.footer-inner { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:18px; padding-top:30px; border-top:1px solid var(--line); }
.footer img { width:190px; max-height:54px; object-fit:contain; object-position:left center; }
.footer p { margin:0; color:var(--muted); font-size:.68rem; text-align:center; }
.footer a { text-align:right; color:var(--cyan); font-size:.74rem; font-weight:600; }

.reveal { opacity:0; transform:translateY(18px); transition:opacity .68s ease, transform .68s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }
.delay-1 { transition-delay:.09s; }
.delay-2 { transition-delay:.16s; }

@keyframes spin { to { transform:rotate(360deg); } }

@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior:auto !important; animation:none !important; transition:none !important; }
  .reveal { opacity:1; transform:none; }
  .cursor-glow { display:none; }
}

@media (max-width: 1020px) {
  .nav { display:none; position:absolute; top:84px; left:20px; right:20px; margin:0; padding:18px; flex-direction:column; background:var(--navy-2); border:1px solid var(--line); border-radius:18px; box-shadow:var(--shadow); }
  .nav.open { display:flex; }
  .mobile-menu { order:3; margin-left:auto; width:42px; height:42px; border:1px solid var(--line); border-radius:12px; background:transparent; display:grid; place-content:center; gap:5px; }
  .mobile-menu span { width:18px; height:2px; background:var(--text); display:block; }
  .nav-cta { order:4; }
  .hero-grid { grid-template-columns:1fr; gap:55px; }
  .hero-copy { max-width:820px; }
  .hero-visual { max-width:650px; margin-inline:auto; width:100%; }
  .client-logos { grid-template-columns:repeat(3,1fr); }
  .project-card { grid-template-columns:1fr; }
  .project-side { border-right:0; border-bottom:1px solid var(--line); }
  .cert-grid { grid-template-columns:repeat(2,1fr); }
  .about-grid { grid-template-columns:.9fr 1.1fr; gap:45px; }
  .about-facts { grid-template-columns:1fr; }
  .contact-card { grid-template-columns:90px 1fr; }
  .contact-links { grid-column:1/-1; flex-direction:row; flex-wrap:wrap; }
}

@media (max-width: 760px) {
  .container { width:min(calc(100% - 28px),var(--max)); }
  .nav-shell { min-height:74px; }
  .brand { width:170px; }
  .brand img { height:48px; }
  .nav { top:74px; }
  .nav-cta .button { display:none; }
  .hero { padding-top:125px; min-height:auto; }
  .hero h1 { font-size:clamp(3.05rem,14vw,4.7rem); }
  .hero-proof { grid-template-columns:1fr; }
  .hero-proof div { display:flex; align-items:baseline; gap:9px; }
  .hero-visual { margin-top:8px; }
  .logo-stage { width:92%; }
  .floating-chip { font-size:.62rem; }
  .hero-terminal { margin-top:-35px; }
  .client-strip { margin-top:65px; }
  .client-logos { grid-template-columns:repeat(2,1fr); }
  .section { padding:84px 0; }
  .section-head { display:block; margin-bottom:36px; }
  .section-head h2, .about-copy h2 { font-size:clamp(2.35rem,10vw,3.6rem); }
  .section-intro { margin-top:18px; }
  .expertise-grid, .quote-grid { grid-template-columns:1fr; }
  .feature-card { min-height:auto; }
  .project-side { align-items:flex-start; padding:22px; }
  .project-logo { width:70px; height:58px; flex-basis:70px; }
  .project-main { padding:22px; }
  .project-result { grid-template-columns:1fr; }
  .career-more-grid { grid-template-columns:1fr; }
  .about-grid { grid-template-columns:1fr; gap:42px; }
  .portrait-shell { max-width:320px; }
  .portrait-caption { right:12px; left:12px; }
  .cert-grid { grid-template-columns:1fr; }
  .contact-card { grid-template-columns:1fr; padding:30px 24px; }
  .contact-mark { width:72px; height:72px; }
  .contact-links { grid-column:auto; flex-direction:column; }
  .footer-inner { grid-template-columns:1fr; text-align:center; }
  .footer img { margin:auto; object-position:center; }
  .footer a { text-align:center; }
}

@media (max-width: 470px) {
  .client-logos { grid-template-columns:1fr 1fr; }
  .chip-a { top:10%; right:-8px; }
  .chip-b { left:-8px; bottom:24%; }
  .chip-c { right:0; bottom:3%; }
  .hero-terminal { width:100%; }
  .terminal-body { padding:16px; font-size:.66rem; }
}


.recruiter-snapshot {
  margin-top: 26px;
  padding: 22px 24px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: color-mix(in srgb, var(--surface) 74%, transparent);
  backdrop-filter: blur(14px);
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 22px;
  align-items: center;
}
.snapshot-label span {
  display: block;
  color: var(--lime);
  font-size: .67rem;
  font-weight: 700;
  letter-spacing: .14em;
}
.snapshot-label small {
  display: block;
  color: var(--muted);
  font-size: .65rem;
  margin-top: 5px;
  line-height: 1.45;
}
.snapshot-items {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 10px;
}
.snapshot-items div {
  min-width: 0;
  padding-left: 14px;
  border-left: 1px solid var(--line-bright);
}
.snapshot-items span {
  display: block;
  color: var(--muted);
  font-size: .61rem;
  margin-bottom: 3px;
}
.snapshot-items strong {
  display: block;
  color: var(--text);
  font-size: .72rem;
  line-height: 1.35;
}


.portrait-photo {
  aspect-ratio: 4 / 5;
  border-radius: 30px;
  border: 1px solid var(--line-bright);
  overflow: hidden;
  position: relative;
  background: var(--surface);
  box-shadow: 0 28px 70px rgba(0,0,0,.20);
}
.portrait-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 48% center;
}
.portrait-gradient {
  position: absolute;
  inset: 55% 0 0;
  background: linear-gradient(transparent, rgba(7,20,36,.82));
}
.portrait-photo > span {
  position: absolute;
  left: 22px;
  bottom: 22px;
  z-index: 2;
  color: var(--lime);
  font-size: .67rem;
  letter-spacing: .16em;
  font-weight: 700;
}

@media (max-width: 1020px) {
  .recruiter-snapshot { grid-template-columns: 1fr; }
  .snapshot-items { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 760px) {
  .recruiter-snapshot { padding: 18px; }
  .snapshot-items { grid-template-columns: 1fr 1fr; }
  .snapshot-items div { min-height: 48px; }
}
@media (max-width: 470px) {
  .snapshot-items { grid-template-columns: 1fr; }
}