:root{
  --bg:#05070b;--panel:rgba(11,15,24,.68);--panel2:rgba(16,21,33,.72);--line:rgba(255,255,255,.1);
  --text:#f4f7fb;--muted:#8d98aa;--cyan:#59e8ff;--violet:#9b7cff;--green:#7df2b1;
  --max:1240px;--radius:24px;--shadow:0 25px 90px rgba(0,0,0,.35)
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,sans-serif;line-height:1.6;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:70px 70px;mask-image:linear-gradient(to bottom,#000,transparent 75%);z-index:-2}
body:after{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 75% 15%,rgba(89,232,255,.08),transparent 25%),radial-gradient(circle at 15% 45%,rgba(155,124,255,.07),transparent 30%);z-index:-3}
.noise{position:fixed;inset:0;pointer-events:none;opacity:.035;z-index:100;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.cursor-glow{position:fixed;width:280px;height:280px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(89,232,255,.08),transparent 65%);transform:translate(-50%,-50%);z-index:0}
a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}.glass{background:linear-gradient(135deg,rgba(255,255,255,.065),rgba(255,255,255,.018));border:1px solid var(--line);box-shadow:var(--shadow);backdrop-filter:blur(18px)}
.nav-wrap{position:fixed;top:16px;left:0;right:0;z-index:50}.nav{max-width:calc(var(--max) - 20px);margin:auto;border-radius:18px;padding:9px 12px;display:flex;align-items:center;justify-content:space-between}
.brand{display:flex;gap:9px;align-items:center;font-family:"Space Grotesk";font-weight:700}.brand-mark{display:grid;place-items:center;width:35px;height:35px;border-radius:10px;background:linear-gradient(135deg,var(--cyan),var(--violet));color:#071018;font-size:12px}.brand-dot{color:var(--cyan)}
.nav-links{display:flex;gap:22px;color:#b7c0ce;font-size:13px}.nav-links a{transition:.25s}.nav-links a:hover{color:#fff}.mini-btn,.btn{border:1px solid var(--line);border-radius:12px;padding:9px 15px;font-weight:600;font-size:13px}.mini-btn{background:rgba(255,255,255,.06)}.menu-btn{display:none;background:none;border:0;color:white;font-size:24px}
.section{max-width:var(--max);margin:auto;padding:130px 24px 40px}.hero{min-height:100vh;padding-top:150px;display:grid;grid-template-columns:1fr 1.08fr;align-items:center;gap:45px}.eyebrow{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);padding:7px 11px;border-radius:999px;color:#c7d0dd;background:rgba(255,255,255,.03);font-size:11px}.status-dot{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 16px var(--green)}.kicker,.section-label{font-size:10px;letter-spacing:.22em;color:var(--cyan);font-weight:700}.kicker{margin-top:28px}h1,h2,h3{font-family:"Space Grotesk",sans-serif;line-height:.98;margin:0}h1{font-size:clamp(60px,8vw,118px);letter-spacing:-.065em;margin:12px 0}h1 span,.display span{color:transparent;background:linear-gradient(100deg,var(--cyan),#bdafff);-webkit-background-clip:text;background-clip:text}.hero-copy h2{font-size:clamp(24px,3vw,38px);font-weight:500}.hero-text{max-width:590px;color:#aeb8c7;font-size:17px;margin:22px 0}.cta-row{display:flex;flex-wrap:wrap;gap:10px}.btn{display:inline-flex;gap:10px;align-items:center;justify-content:center;padding:13px 17px}.btn-primary{background:linear-gradient(135deg,var(--cyan),#91b6ff);color:#071018;border-color:transparent}.btn-ghost{background:rgba(255,255,255,.035)}.hero-meta{display:flex;gap:22px;flex-wrap:wrap;margin-top:28px;color:#768194;font-size:11px}.hero-scene{height:650px;min-height:500px;position:relative;overflow:hidden;border-radius:30px}.scene-head{position:absolute;top:18px;left:20px;right:20px;z-index:3;display:flex;justify-content:space-between;font-size:10px;letter-spacing:.16em;color:#9da8ba}.live-pill{color:var(--green);border:1px solid rgba(125,242,177,.25);padding:3px 7px;border-radius:99px}.hero-scene canvas{width:100%;height:100%;display:block}.scene-hint{position:absolute;bottom:16px;left:20px;color:#687487;font-size:10px}.node-info{position:absolute;bottom:18px;right:18px;max-width:210px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:rgba(5,7,11,.72);font-size:11px;color:#9ca7b8}.node-info strong{display:block;color:#fff;margin-bottom:3px}.narrow{max-width:1080px}.split{display:grid;grid-template-columns:1fr 1.1fr;gap:80px;margin-top:35px}.display{font-size:clamp(42px,6vw,76px);letter-spacing:-.05em}.copy{color:#aab4c4;font-size:15px}.copy p{margin-top:0;margin-bottom:20px}.copy strong{color:#fff}.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:65px}.stat{padding:25px;border-radius:18px}.stat strong{display:block;font:700 34px "Space Grotesk";color:#fff}.stat span{display:block;color:#d2d8e2;font-size:12px}.stat small{color:#687487;font-size:10px}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin:22px 0 45px}.section-heading p{max-width:280px;color:#707c8f;font-size:12px}.skills-layout{display:grid;grid-template-columns:.85fr 1.3fr;gap:20px}.skill-orbit{min-height:520px;position:relative;display:grid;place-items:center;overflow:hidden;border-radius:26px}.orbit-ring{position:absolute;border:1px solid rgba(89,232,255,.18);border-radius:50%;animation:spin 18s linear infinite}.ring-one{width:280px;height:280px}.ring-two{width:410px;height:410px;border-color:rgba(155,124,255,.14);animation-duration:28s;animation-direction:reverse}.orbit-core{width:135px;height:135px;border-radius:50%;display:grid;place-items:center;text-align:center;background:radial-gradient(circle,rgba(89,232,255,.18),rgba(155,124,255,.07) 55%,transparent 70%);border:1px solid rgba(89,232,255,.3);font:700 18px "Space Grotesk";box-shadow:0 0 70px rgba(89,232,255,.12)}.orbit-core small{font:600 8px Inter;color:#8390a4;letter-spacing:.15em}.skill-groups{display:grid;grid-template-columns:1fr 1fr;gap:12px}.skill-group{padding:20px;border-radius:18px}.skill-group h3{font-size:14px;margin-bottom:14px;color:#e9edf5}.chips,.chip-wrap{display:flex;flex-wrap:wrap;gap:7px}.chip{font-size:10px;color:#b8c3d2;padding:7px 9px;border:1px solid var(--line);border-radius:8px;background:rgba(255,255,255,.025);transition:.2s}.chip:hover{color:#061015;background:var(--cyan);border-color:transparent;transform:translateY(-2px)}
.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.project-card{position:relative;min-height:480px;padding:26px;border-radius:24px;overflow:hidden;cursor:pointer;transition:transform .35s,border-color .35s}.project-card:hover{transform:translateY(-8px);border-color:rgba(89,232,255,.35)}.project-number{font:600 10px "Space Grotesk";color:#647186}.tag{display:inline-block;color:var(--cyan);font-size:9px;letter-spacing:.15em;padding:5px 7px;border:1px solid rgba(89,232,255,.2);border-radius:6px}.project-card h3{font-size:28px;margin:28px 0 10px}.project-card p{font-size:12px;color:#8e9aac}.project-tech{display:flex;flex-wrap:wrap;gap:6px;margin-top:18px}.project-tech span{font-size:9px;color:#7e8a9e;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:2px}.project-card .open{position:absolute;bottom:24px;left:26px;color:#d9e1ec;font-size:11px}.project-card .orb{position:absolute;right:-55px;bottom:-65px;width:210px;height:210px;border-radius:50%;border:1px solid rgba(89,232,255,.15);box-shadow:inset 0 0 50px rgba(89,232,255,.05),0 0 70px rgba(89,232,255,.04)}.project-card:nth-child(2) .orb{border-color:rgba(155,124,255,.17)}.project-card:nth-child(3) .orb{border-color:rgba(125,242,177,.14)}
.timeline{position:relative;margin-top:45px}.timeline-line{position:absolute;left:14px;top:0;bottom:0;width:1px;background:linear-gradient(var(--cyan),transparent)}.timeline-item{position:relative;padding-left:55px}.timeline-dot{position:absolute;left:8px;top:4px;width:13px;height:13px;border-radius:50%;background:var(--cyan);box-shadow:0 0 25px rgba(89,232,255,.55)}.timeline-date{font-size:10px;letter-spacing:.18em;color:#718096;margin-bottom:12px}.timeline-card{padding:26px;border-radius:20px}.timeline-card h3{font-size:30px;margin:12px 0}.timeline-card p{color:#909bad;font-size:13px}.timeline-projects{display:flex;gap:8px}.timeline-projects span{font-size:9px;border:1px solid var(--line);padding:5px 7px;border-radius:6px;color:#b7c2d1}
.system-flow{min-height:650px;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;border-radius:28px;overflow:hidden}.flow-node{min-width:300px;text-align:center;padding:14px 25px;border:1px solid rgba(89,232,255,.2);border-radius:14px;background:rgba(89,232,255,.035);font:600 15px "Space Grotesk";box-shadow:0 0 35px rgba(89,232,255,.04)}.flow-node small{display:block;color:#758196;font:10px Inter;margin-top:3px}.flow-arrow{color:#4e5d72;font-size:16px}.side-tech{position:absolute;padding:9px 13px;border:1px solid var(--line);border-radius:10px;color:#98a5b7;font-size:11px;background:rgba(255,255,255,.03)}.kafka{left:13%;top:35%}.redis{right:13%;top:49%}.aws{right:20%;bottom:18%}
.security-card{padding:50px;border-radius:28px;display:grid;grid-template-columns:.7fr 1.3fr;gap:60px}.security-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.security-grid div{padding:20px;border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.025)}.security-icon{display:block;font-size:22px;color:var(--cyan);margin-bottom:14px}.security-grid strong{display:block;font-size:13px}.security-grid small{display:block;color:#697689;font-size:10px;margin-top:4px}
.education-card{padding:35px;display:flex;align-items:center;gap:35px;border-radius:24px}.edu-orb{width:130px;height:130px;display:grid;place-items:center;border-radius:50%;font:700 28px "Space Grotesk";color:#081018;background:linear-gradient(135deg,var(--cyan),#b4a4ff);box-shadow:0 0 70px rgba(89,232,255,.12)}.education-card h2{font-size:42px;margin:10px 0}.education-card p{color:#8b96a8}
.contact-section{padding-bottom:100px}.contact-wrap{display:grid;grid-template-columns:1fr 1fr;gap:70px;margin-top:25px}.contact-wrap>div:first-child p{color:#7f8b9d}.contact-links{display:grid;gap:8px}.contact-link{display:grid;grid-template-columns:75px 1fr 20px;align-items:center;padding:15px 17px;border-radius:13px;font-size:11px;transition:.2s}.contact-link:hover{transform:translateX(5px);border-color:rgba(89,232,255,.25)}.contact-link span{color:#657185}.contact-link strong{font-weight:500}.contact-form{margin-top:20px;padding:24px;border-radius:20px;display:grid;grid-template-columns:1fr 1fr;gap:15px}.contact-form label{display:block;color:#7e899a;font-size:10px;margin-bottom:6px}.contact-form input,.contact-form textarea{width:100%;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:10px;color:white;padding:11px;outline:none}.contact-form input:focus,.contact-form textarea:focus{border-color:rgba(89,232,255,.45)}.full{grid-column:1/-1}.form-actions{display:flex;align-items:center;gap:15px}.form-actions span{font-size:11px;color:var(--green)}
footer{max-width:var(--max);margin:auto;padding:25px 24px 40px;display:flex;justify-content:space-between;color:#4f5c6e;font-size:10px;border-top:1px solid rgba(255,255,255,.06)}
.modal{position:fixed;inset:0;display:none;place-items:center;padding:25px;z-index:80}.modal.open{display:grid}.modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.75);backdrop-filter:blur(8px)}.modal-card{position:relative;width:min(980px,100%);max-height:90vh;overflow:auto;border-radius:25px;padding:35px}.modal-close{position:absolute;right:20px;top:16px;border:0;background:none;color:#9da8b8;font-size:30px;cursor:pointer}.modal-top{padding-right:40px}.modal-top h2{font-size:clamp(34px,5vw,62px);margin:14px 0}.modal-top p{color:#8e9aaa;max-width:800px}.modal-grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:35px;margin-top:30px;border-top:1px solid var(--line);padding-top:25px}.modal-grid h4{font-size:9px;letter-spacing:.15em;color:#657185}.modal-grid ul{margin:0;padding-left:18px;color:#8f9bad;font-size:12px}.modal-grid li{margin-bottom:8px}.modal-arch{margin-top:30px;min-height:120px;border:1px solid var(--line);border-radius:18px;display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;padding:20px}.arch-node{padding:10px 13px;border:1px solid rgba(89,232,255,.2);border-radius:9px;background:rgba(89,232,255,.03);font-size:10px;color:#aeb9c9}.arch-arrow{color:#556174}
.reveal{opacity:0;transform:translateY(20px);transition:opacity .8s,transform .8s}.reveal.visible{opacity:1;transform:none}
@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:900px){.nav-links{display:none;position:absolute;top:58px;left:10px;right:10px;padding:16px;flex-direction:column;background:rgba(5,7,11,.95);border:1px solid var(--line);border-radius:15px}.nav-links.open{display:flex}.menu-btn{display:block}.hero{grid-template-columns:1fr;padding-top:120px}.hero-scene{height:500px}.split,.skills-layout,.security-card,.contact-wrap{grid-template-columns:1fr}.project-grid{grid-template-columns:1fr 1fr}.skill-orbit{min-height:380px}.security-card{gap:35px}.contact-wrap{gap:35px}}@media(max-width:600px){.section{padding-left:16px;padding-right:16px}.hero{padding-top:110px}.hero-scene{min-height:420px;height:420px}.stat-grid,.skill-groups,.project-grid,.security-grid,.contact-form{grid-template-columns:1fr}.split{gap:30px}.section-heading{display:block}.section-heading p{margin-top:16px}.display{font-size:44px}h1{font-size:60px}.hero-meta{gap:10px}.flow-node{min-width:240px}.side-tech{display:none}.education-card{align-items:flex-start;flex-direction:column}.modal-card{padding:24px}.modal-grid{grid-template-columns:1fr}.contact-link{grid-template-columns:65px 1fr 15px}footer{flex-direction:column;gap:7px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}.cursor-glow{display:none}}

/* --------------------------------------------------------------------------
   Responsive polish
   Keeps the desktop design intact while tightening spacing and fixing the
   stacking/overflow issues on tablets and phones.
   -------------------------------------------------------------------------- */

@media (max-width: 900px) {
  .section {
    padding-top: 82px;
    padding-bottom: 28px;
  }

  .hero.section {
    min-height: auto;
    padding-top: 112px;
    padding-bottom: 46px;
  }

  .hero {
    gap: 28px;
  }

  .hero-scene {
    min-height: 440px;
    height: 440px;
  }

  .section-heading {
    margin-bottom: 28px;
  }

  .stat-grid {
    margin-top: 36px;
  }

  .skills-layout {
    gap: 16px;
  }

  .skill-orbit {
    min-height: 390px;
  }

  .project-card {
    min-height: 410px;
  }

  .timeline {
    margin-top: 30px;
  }

  .system-flow {
    min-height: 500px;
  }

  .security-card {
    padding: 34px;
  }

  .education-card {
    padding: 28px;
  }

  .contact-section {
    padding-bottom: 65px;
  }
}

@media (max-width: 600px) {
  .nav-wrap {
    top: 8px;
  }

  .nav {
    width: calc(100% - 16px);
    padding: 8px 10px;
  }

  .brand {
    min-width: 0;
    font-size: 14px;
  }

  .brand-mark {
    width: 33px;
    height: 33px;
  }

  .nav-actions {
    display: flex;
    align-items: center;
    gap: 4px;
  }

  .mini-btn {
    padding: 8px 10px;
    font-size: 12px;
  }

  .menu-btn {
    padding: 4px 5px;
    line-height: 1;
  }

  .nav-links {
    top: 54px;
    left: 0;
    right: 0;
  }

  .section,
  .section.narrow {
    width: 100%;
    padding-left: 16px;
    padding-right: 16px;
    padding-top: 66px;
    padding-bottom: 24px;
  }

  .hero.section {
    padding-top: 94px;
    padding-bottom: 34px;
    gap: 24px;
  }

  .eyebrow {
    max-width: 100%;
    font-size: 10px;
    line-height: 1.4;
  }

  .kicker {
    margin-top: 20px;
    font-size: 9px;
    line-height: 1.5;
  }

  h1 {
    font-size: clamp(46px, 15vw, 60px);
    margin: 9px 0;
  }

  .hero-copy h2 {
    font-size: 24px;
  }

  .hero-text {
    font-size: 14px;
    line-height: 1.55;
    margin: 16px 0;
  }

  .cta-row {
    gap: 8px;
  }

  .btn {
    min-height: 42px;
    padding: 11px 13px;
    font-size: 12px;
  }

  .hero-meta {
    margin-top: 20px;
    gap: 7px 14px;
    font-size: 10px;
  }

  .hero-scene {
    min-height: 330px;
    height: 330px;
    border-radius: 22px;
  }

  .scene-head {
    top: 13px;
    left: 14px;
    right: 14px;
    font-size: 8px;
  }

  .scene-hint {
    bottom: 12px;
    left: 14px;
    font-size: 8px;
  }

  .node-info {
    right: 12px;
    bottom: 12px;
    max-width: 155px;
    padding: 8px 9px;
    font-size: 9px;
  }

  .section-label {
    font-size: 9px;
    letter-spacing: .18em;
  }

  .split {
    gap: 22px;
    margin-top: 22px;
  }

  .display {
    font-size: clamp(36px, 11vw, 44px);
    line-height: 1;
  }

  .copy {
    font-size: 13px;
    line-height: 1.65;
  }

  .copy p {
    margin-bottom: 14px;
  }

  .stat-grid {
    gap: 8px;
    margin-top: 26px;
  }

  .stat {
    padding: 18px;
    border-radius: 15px;
  }

  .stat strong {
    font-size: 28px;
  }

  .section-heading {
    margin-top: 14px;
    margin-bottom: 22px;
  }

  .section-heading p {
    margin-top: 10px;
    font-size: 11px;
  }

  .skills-layout {
    gap: 10px;
  }

  .skill-orbit {
    min-height: 285px;
    border-radius: 20px;
  }

  .ring-one {
    width: 190px;
    height: 190px;
  }

  .ring-two {
    width: 270px;
    height: 270px;
  }

  .orbit-core {
    width: 100px;
    height: 100px;
    font-size: 15px;
  }

  .skill-groups {
    gap: 8px;
  }

  .skill-group {
    padding: 16px;
    border-radius: 15px;
  }

  .skill-group h3 {
    margin-bottom: 10px;
    font-size: 13px;
  }

  .chip {
    font-size: 9px;
    padding: 6px 8px;
  }

  .project-grid {
    gap: 10px;
  }

  .project-card {
    min-height: 350px;
    padding: 20px;
    border-radius: 19px;
  }

  .project-card h3 {
    font-size: 24px;
    margin: 20px 0 8px;
  }

  .project-card p {
    font-size: 11px;
    line-height: 1.55;
  }

  .project-tech {
    margin-top: 13px;
  }

  .project-card .open {
    left: 20px;
    bottom: 18px;
  }

  .project-card .orb {
    width: 160px;
    height: 160px;
    right: -55px;
    bottom: -60px;
  }

  .timeline {
    margin-top: 24px;
  }

  .timeline-item {
    padding-left: 38px;
  }

  .timeline-line {
    left: 9px;
  }

  .timeline-dot {
    left: 3px;
    width: 12px;
    height: 12px;
  }

  .timeline-date {
    margin-bottom: 9px;
    font-size: 8px;
    letter-spacing: .12em;
  }

  .timeline-card {
    padding: 20px;
    border-radius: 17px;
  }

  .timeline-card h3 {
    font-size: 24px;
    margin: 10px 0 8px;
  }

  .timeline-card p {
    font-size: 11px;
    line-height: 1.6;
  }

  .timeline-projects {
    flex-wrap: wrap;
  }

  .system-flow {
    min-height: 430px;
    padding: 28px 14px;
    gap: 3px;
    border-radius: 21px;
  }

  .flow-node {
    width: min(100%, 280px);
    min-width: 0;
    padding: 11px 14px;
    font-size: 13px;
  }

  .flow-node small {
    font-size: 9px;
  }

  .security-card {
    padding: 22px;
    border-radius: 21px;
    gap: 22px;
  }

  .security-grid {
    gap: 8px;
  }

  .security-grid div {
    padding: 16px;
  }

  .security-icon {
    margin-bottom: 9px;
  }

  .education-card {
    padding: 20px;
    gap: 18px;
    border-radius: 19px;
  }

  .edu-orb {
    width: 88px;
    height: 88px;
    flex: 0 0 88px;
    font-size: 21px;
  }

  .education-card h2 {
    font-size: 34px;
    margin: 8px 0;
  }

  .education-card p {
    margin: 0 0 7px;
    font-size: 12px;
  }

  .education-card strong {
    font-size: 12px;
  }

  .contact-section {
    padding-bottom: 46px !important;
  }

  .contact-wrap {
    gap: 22px;
    margin-top: 18px;
  }

  .contact-links {
    gap: 6px;
  }

  .contact-link {
    grid-template-columns: 58px minmax(0, 1fr) 15px;
    gap: 6px;
    padding: 12px 13px;
    font-size: 10px;
  }

  .contact-link strong {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .contact-form {
    margin-top: 14px;
    padding: 18px;
    gap: 11px;
    border-radius: 17px;
  }

  .form-actions {
    align-items: flex-start;
    flex-direction: column;
  }

  footer {
    padding: 20px 16px 28px;
    line-height: 1.5;
  }

  .modal {
    padding: 10px;
  }

  .modal-card {
    max-height: 92vh;
    padding: 20px;
    border-radius: 19px;
  }

  .modal-top {
    padding-right: 28px;
  }

  .modal-top h2 {
    font-size: 34px;
  }

  .modal-grid {
    gap: 22px;
    margin-top: 22px;
    padding-top: 18px;
  }

  .modal-arch {
    margin-top: 20px;
    padding: 14px;
  }
}

@media (max-width: 380px) {
  .mini-btn {
    display: none;
  }

  .hero.section {
    padding-top: 88px;
  }

  .section,
  .section.narrow {
    padding-left: 13px;
    padding-right: 13px;
  }

  h1 {
    font-size: 43px;
  }

  .hero-copy h2 {
    font-size: 21px;
  }

  .cta-row .btn {
    width: 100%;
  }

  .hero-scene {
    min-height: 300px;
    height: 300px;
  }

  .display {
    font-size: 34px;
  }

  .flow-node {
    width: 100%;
  }
}


/* Final responsive + education alignment polish */
.education-card { margin-top: 22px; }
.education-copy { min-width: 0; }
.education-copy h2 { max-width: 720px; }
.edu-orb { flex: 0 0 130px; }
.edu-orb svg { width: 62px; height: 62px; color: #081018; }
.edu-separator { color: #5f6c7e; padding: 0 4px; }
.achievement-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:22px; }
.achievement-card { display:grid; grid-template-columns:52px 1fr; gap:18px; padding:24px; border-radius:20px; }
.achievement-mark { display:grid; place-items:center; width:44px; height:44px; border:1px solid rgba(89,232,255,.25); border-radius:12px; color:var(--cyan); font:700 11px "Space Grotesk"; }
.achievement-card h3 { font-size:23px; margin:14px 0 8px; }
.achievement-card p { margin:0; color:#8b96a8; font-size:12px; }
@media (max-width: 900px) {
  .education-card { margin-top:18px; }
  .achievement-grid { grid-template-columns:1fr; }
}
@media (max-width: 600px) {
  .section { padding-top:58px; padding-bottom:20px; }
  .section-label { line-height:1.3; }
  .section-heading { margin-top:16px; margin-bottom:22px; }
  .split { margin-top:22px; gap:24px; }
  .stat-grid { margin-top:28px; }
  .skills-layout { gap:12px; }
  .skill-orbit { min-height:300px; }
  .project-card { min-height:360px; padding:20px; border-radius:20px; }
  .project-card h3 { font-size:24px; margin:20px 0 8px; }
  .project-card .open { left:20px; bottom:19px; }
  .timeline { margin-top:22px; }
  .timeline-item { padding-left:40px; }
  .timeline-line { left:10px; }
  .timeline-dot { left:4px; width:12px; height:12px; }
  .timeline-card { padding:20px; }
  .timeline-card h3 { font-size:25px; }
  .system-flow { min-height:390px; padding:28px 12px; }
  .security-card { padding:20px; }
  .education-card { margin-top:14px; padding:18px; gap:16px; }
  .edu-orb { width:72px; height:72px; flex-basis:72px; }
  .edu-orb svg { width:45px; height:45px; }
  .education-copy h2 { font-size:28px; line-height:1.04; margin:10px 0 8px; }
  .education-copy p { font-size:11px; line-height:1.45; margin:0 0 5px; }
  .edu-separator { display:inline; }
  .achievement-grid { margin-top:14px; gap:10px; }
  .achievement-card { grid-template-columns:1fr; gap:12px; padding:18px; border-radius:18px; }
  .achievement-mark { width:38px; height:38px; }
  .achievement-card h3 { font-size:20px; margin:12px 0 7px; }
  .achievement-card p { font-size:11px; line-height:1.55; }
  .contact-wrap { margin-top:14px; gap:18px; }
}
@media (max-width: 380px) {
  .section { padding-top:48px; padding-bottom:16px; }
  .hero.section { padding-top:86px; padding-bottom:34px; }
  .education-copy h2 { font-size:25px; }
  .achievement-card h3 { font-size:18px; }
}