:root {
  --bg: #0a0d12; --panel: #10151d; --panel-2: #131a23; --line: rgba(215,230,246,.12);
  --text: #f2f5f7; --muted: #98a5b4; --subtle: #687788; --mint: #8af0cb; --blue: #8bb8ff;
  --font: 'Manrope', sans-serif; --mono: 'DM Mono', monospace;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 90px; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: var(--font); line-height: 1.65; overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
::selection { background: rgba(138,240,203,.25); color: #fff; }
.ambient { position: absolute; pointer-events: none; filter: blur(90px); opacity: .15; border-radius: 50%; z-index: -1; }
.ambient-one { top: 100px; right: -120px; width: 430px; height: 430px; background: #236a72; }
.ambient-two { top: 700px; left: -240px; width: 500px; height: 500px; background: #254a86; opacity: .10; }
.site-header { width: min(1180px, calc(100% - 48px)); height: 82px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); position: relative; z-index: 10; }
.brand { display: inline-flex; align-items: center; gap: 11px; font-size: 11px; letter-spacing: .16em; font-weight: 800; }
.brand-mark { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid rgba(138,240,203,.5); color: var(--mint); border-radius: 10px; letter-spacing: -.06em; font-size: 12px; }
.nav { display: flex; align-items: center; gap: 31px; color: #a9b4c0; font-size: 12px; }
.nav a, .hero-socials a, .contact-bottom a { transition: color .2s ease; }
.nav a:hover, .hero-socials a:hover, .contact-bottom a:hover { color: var(--mint); }
.nav-contact { color: var(--text) !important; border: 1px solid var(--line); padding: 9px 13px; border-radius: 8px; }
.nav-contact span { color: var(--mint); margin-left: 8px; }
.menu-toggle { display: none; background: transparent; border: 0; padding: 8px; }
.menu-toggle span { display: block; width: 22px; height: 2px; background: var(--text); margin: 5px; }
.section-wrap { width: min(1080px, calc(100% - 48px)); margin: 0 auto; }
.hero { min-height: 650px; display: grid; grid-template-columns: 1.12fr .88fr; align-items: center; position: relative; padding-top: 45px; padding-bottom: 65px; }
.hero-copy { position: relative; z-index: 2; }
.eyebrow, .section-index, .project-kicker, .tech-line, .hero-bottom-note, .skill-label, .experience-meta, .contact-bottom, .core-label, .signal-row, .legal-caption, .ai-caption { font: 10px var(--mono); letter-spacing: .11em; }
.eyebrow { color: #b0bcc9; display: flex; align-items: center; gap: 10px; }
.status-dot, .status-pill span { display: inline-block; width: 7px; height: 7px; background: var(--mint); border-radius: 50%; box-shadow: 0 0 13px rgba(138,240,203,.65); }
.eyebrow-line { display: inline-block; width: 32px; height: 1px; background: var(--line); }
h1 { font-size: clamp(42px, 5.25vw, 68px); line-height: 1.09; letter-spacing: -.065em; margin: 27px 0 22px; font-weight: 700; }
.gradient-text { color: var(--mint); background: linear-gradient(100deg, #a2f5d5 0%, #a5d8ff 75%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.hero-intro { max-width: 500px; color: var(--muted); font-size: 14px; line-height: 1.9; margin: 0; }
.hero-actions { display: flex; gap: 12px; margin-top: 30px; flex-wrap: wrap; }
.button { display: inline-flex; align-items: center; gap: 18px; padding: 12px 16px; border-radius: 8px; font-size: 12px; font-weight: 700; transition: transform .2s ease, border-color .2s ease, background .2s ease; }
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--mint); color: #08120f; }
.button-primary:hover { background: #b5ffe4; }
.button-quiet { border: 1px solid var(--line); color: #d7e0e8; }
.button-quiet:hover { border-color: rgba(138,240,203,.5); }
.hero-socials { display: flex; gap: 22px; margin-top: 34px; color: #8794a2; font: 10px var(--mono); }
.hero-socials span { color: var(--mint); margin-left: 4px; }
.hero-visual { min-height: 440px; display: grid; place-items: center; position: relative; }
.orbit { position: absolute; border: 1px solid rgba(138,240,203,.12); border-radius: 50%; transform: rotate(-24deg); }
.orbit-a { width: 390px; height: 250px; }
.orbit-b { width: 310px; height: 390px; transform: rotate(35deg); border-color: rgba(139,184,255,.12); }
.core-card { width: 310px; position: relative; padding: 18px; background: linear-gradient(145deg, rgba(25,35,45,.96), rgba(12,17,24,.97)); border: 1px solid rgba(177,205,228,.18); border-radius: 16px; box-shadow: 0 28px 80px rgba(0,0,0,.35); transform: rotate(-2deg); }
.core-top { display: flex; gap: 5px; align-items: center; }
.mini-dot { width: 5px; height: 5px; border-radius: 50%; background: #637281; }
.core-label { color: #6e7e8f; margin-left: auto; font-size: 8px; }
.core-symbol { height: 125px; margin: 18px 0 10px; display: grid; place-items: center; background: radial-gradient(circle at 50% 50%, rgba(138,240,203,.16), transparent 58%); }
.core-symbol span { color: var(--mint); font: 72px var(--mono); text-shadow: 0 0 32px rgba(138,240,203,.2); }
.core-title { font-size: 16px; font-weight: 800; letter-spacing: -.04em; }
.core-subtitle { font-size: 10px; color: var(--muted); margin-top: 3px; }
.signal-row { display: flex; justify-content: space-between; color: #788897; font-size: 7px; margin-top: 22px; letter-spacing: .06em; }
.signal-good { color: var(--mint); }
.signal-track { height: 3px; background: #28313a; border-radius: 10px; margin-top: 8px; }
.signal-track span { display: block; width: 86%; height: 100%; background: linear-gradient(90deg, #65d9b4, #8bb8ff); border-radius: inherit; }
.float-tag { position: absolute; padding: 10px 13px; border: 1px solid rgba(180,210,230,.18); border-radius: 9px; background: rgba(17,24,33,.9); color: #dbe5ec; font-size: 10px; box-shadow: 0 15px 35px rgba(0,0,0,.25); display: flex; align-items: center; gap: 9px; animation: float 5s ease-in-out infinite; }
.tag-icon { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 6px; color: var(--mint); background: rgba(138,240,203,.1); font-weight: 800; }
.tag-java { top: 70px; left: 4px; }
.tag-cloud { right: -3px; top: 160px; animation-delay: -1.4s; }
.tag-ai { bottom: 58px; left: 20px; animation-delay: -2.8s; }
@keyframes float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
.hero-bottom-note { grid-column: 1 / -1; position: absolute; bottom: 20px; left: 0; right: 0; display: flex; align-items: center; gap: 13px; color: #627181; font-size: 8px; }
.scroll-mark { color: var(--mint); font-size: 15px; }
.note-rule { height: 1px; width: 70px; background: var(--line); }
.stats { border: 1px solid var(--line); border-radius: 13px; display: grid; grid-template-columns: repeat(4, 1fr); position: relative; background: rgba(16,21,29,.68); padding: 25px 26px 27px; gap: 20px; }
.stat { display: flex; align-items: center; gap: 13px; }
.stat strong { font-size: 30px; letter-spacing: -.07em; line-height: 1; white-space: nowrap; }
.stat strong span { color: var(--mint); font-size: 18px; }
.stat > span { font-size: 9px; color: var(--muted); line-height: 1.55; }
.stats-footnote { position: absolute; right: 15px; bottom: -23px; font-size: 8px; color: #617080; margin: 0; }
.section-block { padding-top: 125px; }
.section-heading { margin-bottom: 43px; }
.section-index { color: var(--mint); font-size: 9px; }
.section-heading h2 { font-size: clamp(29px, 3.8vw, 43px); letter-spacing: -.055em; line-height: 1.2; margin: 17px 0 0; }
.muted-heading { color: #7f8c9b; }
.about-grid { display: grid; grid-template-columns: .82fr 1.18fr; gap: 90px; }
.about-lead { font-size: 20px; line-height: 1.65; letter-spacing: -.035em; color: #e0e7ed; margin: 0; }
.about-detail p { color: var(--muted); font-size: 12px; line-height: 1.95; margin: 0 0 15px; }
.about-tags, .project-tags, .skill-chips { display: flex; flex-wrap: wrap; gap: 7px; }
.about-tags { margin-top: 22px; }
.about-tags span, .project-tags span, .skill-chips span { border: 1px solid var(--line); color: #a8b5c2; border-radius: 6px; padding: 6px 9px; font-size: 9px; }
.experience-list { border-top: 1px solid var(--line); }
.experience-item { display: grid; grid-template-columns: 190px 1fr; gap: 32px; padding: 32px 0 35px; border-bottom: 1px solid var(--line); }
.experience-meta { color: #778697; display: flex; align-items: flex-start; gap: 12px; padding-top: 7px; font-size: 9px; }
.experience-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--mint); margin-top: 4px; box-shadow: 0 0 12px rgba(138,240,203,.35); }
.experience-title-row { display: flex; align-items: center; flex-wrap: wrap; gap: 13px; }
.experience-title-row h3, .project-body h3, .education-card h3 { font-size: 18px; letter-spacing: -.04em; margin: 0; }
.company-pill { color: #91a0af; border: 1px solid var(--line); border-radius: 5px; padding: 4px 7px; font-size: 9px; }
.experience-summary { color: #d5dfe6; font-size: 12px; margin: 10px 0 13px; }
.experience-content ul { padding-left: 17px; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.9; }
.experience-content li { padding-left: 4px; margin-bottom: 4px; }
.experience-content li::marker { color: var(--mint); }
.tech-line { color: #6d7d8d; margin-top: 20px; font-size: 8px; }
.tech-line i { color: var(--mint); font-style: normal; padding: 0 4px; }
.project-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items: stretch; }
.project-card { overflow: hidden; border: 1px solid var(--line); border-radius: 13px; background: linear-gradient(145deg, rgba(18,24,33,.95), rgba(12,16,22,.96)); transition: transform .25s ease, border-color .25s ease; }
.project-card:hover { transform: translateY(-4px); border-color: rgba(138,240,203,.35); }
.project-featured { grid-row: span 2; }
.project-visual { height: 220px; position: relative; overflow: hidden; border-bottom: 1px solid var(--line); display: grid; place-items: center; }
.visual-campus { background: linear-gradient(145deg, #132b34, #10202b 58%, #10151d); }
.visual-grid { position: absolute; inset: 0; opacity: .22; background-image: linear-gradient(rgba(150,210,215,.15) 1px, transparent 1px), linear-gradient(90deg, rgba(150,210,215,.15) 1px, transparent 1px); background-size: 28px 28px; mask-image: linear-gradient(to bottom, black, transparent); }
.campus-window { position: relative; width: 65%; min-height: 135px; padding: 18px; background: rgba(7,17,23,.78); border: 1px solid rgba(138,240,203,.28); border-radius: 8px; box-shadow: 0 15px 45px rgba(0,0,0,.28); }
.campus-window > span { color: var(--mint); font: 8px var(--mono); letter-spacing: .13em; }
.campus-window strong { display: block; font-size: 24px; line-height: 1.12; letter-spacing: -.05em; margin-top: 12px; }
.window-bars { display: flex; gap: 5px; margin-top: 15px; }
.window-bars i { display: block; width: 22%; height: 3px; background: #4b9f91; border-radius: 4px; }
.window-bars i:nth-child(2) { width: 34%; background: #416e83; }
.window-bars i:nth-child(3) { width: 16%; background: #64748b; }
.visual-chip { position: absolute; right: 14px; bottom: 12px; color: var(--mint); font: 8px var(--mono); letter-spacing: .06em; }
.visual-legal { background: radial-gradient(circle at 55% 45%, #423c64, #211e35 50%, #131720); }
.legal-orbit { position: absolute; width: 170px; height: 170px; border: 1px solid rgba(207,197,255,.2); border-radius: 50%; box-shadow: 0 0 0 24px rgba(207,197,255,.025), 0 0 0 48px rgba(207,197,255,.025); }
.legal-mark { position: relative; font-size: 57px; font-weight: 800; letter-spacing: -.1em; color: #e5dfff; }
.legal-mark span { color: #b4a6ff; }
.legal-caption { position: absolute; top: 17px; left: 18px; color: #b1a7d9; font-size: 8px; }
.legal-mini-card { position: absolute; bottom: 16px; right: 16px; padding: 9px 12px; border: 1px solid rgba(221,213,255,.17); background: rgba(25,22,44,.85); border-radius: 7px; font: 7px var(--mono); color: #a89fc9; }
.legal-mini-card strong { display: block; font: 11px var(--font); color: #e4e0f4; margin-top: 3px; }
.visual-ai { background: radial-gradient(circle at center, #1d3a3d, #111d25 65%); }
.visual-market { background: radial-gradient(circle at 50% 45%, #28473f, #15251f 58%, #11171a); }
.market-window { position: relative; width: 68%; min-height: 135px; padding: 18px; background: rgba(8,19,16,.78); border: 1px solid rgba(138,240,203,.28); border-radius: 8px; box-shadow: 0 15px 45px rgba(0,0,0,.28); }
.market-window > span { color: #8af0cb; font: 8px var(--mono); letter-spacing: .08em; }
.market-window strong { display: block; margin-top: 15px; color: #e4eee8; font-size: 19px; line-height: 1.25; letter-spacing: -.05em; }
.market-status { position: absolute; right: 12px; bottom: 12px; color: #95a99d; font: 7px var(--mono); letter-spacing: .04em; }
.market-status i { display: inline-block; width: 5px; height: 5px; margin-right: 4px; border-radius: 50%; background: var(--mint); }
.visual-loan { background: radial-gradient(circle at 50% 45%, #3b3940, #222329 58%, #14161b); }
.loan-window { position: relative; width: 72%; min-height: 135px; padding: 18px; background: rgba(15,16,21,.78); border: 1px solid rgba(179,190,255,.25); border-radius: 8px; box-shadow: 0 15px 45px rgba(0,0,0,.28); }
.loan-window > span { color: #b7c1ff; font: 8px var(--mono); letter-spacing: .08em; }
.loan-window strong { display: block; margin-top: 13px; color: #e8eaff; font-size: 19px; line-height: 1.25; letter-spacing: -.05em; }
.loan-flow { display: flex; align-items: center; gap: 5px; margin-top: 14px; color: #abb3c6; font: 6px var(--mono); }
.loan-flow i { width: 14px; height: 1px; background: #858fb8; }
.loan-flow b { padding: 4px 5px; border: 1px solid rgba(179,190,255,.2); border-radius: 4px; font-weight: 400; }
.visual-city { background: radial-gradient(circle at 50% 45%, #324753, #1a2832 58%, #13191f); }
.city-window { position: relative; width: 68%; min-height: 135px; padding: 18px; background: rgba(10,18,24,.8); border: 1px solid rgba(151,207,230,.25); border-radius: 8px; box-shadow: 0 15px 45px rgba(0,0,0,.28); }
.city-window > span { color: #a4d5e8; font: 8px var(--mono); letter-spacing: .08em; }
.city-window strong { display: block; margin-top: 15px; color: #e4edf1; font-size: 19px; line-height: 1.25; letter-spacing: -.05em; }
.city-bars { display: flex; gap: 5px; margin-top: 15px; }
.city-bars i { display: block; width: 22%; height: 3px; background: #69a6b1; border-radius: 4px; }
.city-bars i:nth-child(2) { width: 34%; background: #547e96; }
.city-bars i:nth-child(3) { width: 16%; background: #71818f; }
.visual-summarizer { background: radial-gradient(circle at 50% 45%, #514044, #2b2229 58%, #171519); }
.summary-window { position: relative; width: 70%; min-height: 135px; padding: 18px; background: rgba(18,13,17,.8); border: 1px solid rgba(238,174,177,.24); border-radius: 8px; box-shadow: 0 15px 45px rgba(0,0,0,.28); }
.summary-window > span { color: #e6aeb4; font: 8px var(--mono); letter-spacing: .08em; }
.summary-window strong { display: block; margin-top: 13px; color: #f0e5e7; font-size: 19px; line-height: 1.25; letter-spacing: -.05em; }
.summary-lines { display: flex; align-items: center; gap: 5px; margin-top: 14px; }
.summary-lines i { display: block; width: 18%; height: 3px; background: #a56d7e; border-radius: 4px; }
.summary-lines i:nth-child(2) { width: 26%; background: #795b72; }
.summary-lines i:nth-child(3) { width: 13%; background: #a56d7e; }
.summary-lines b { margin-left: auto; color: #d3aab3; font: 6px var(--mono); font-weight: 400; }
.ai-center { width: 80px; height: 80px; border: 1px solid rgba(138,240,203,.45); background: rgba(7,20,23,.85); border-radius: 22px; display: grid; place-items: center; font: 20px var(--mono); color: var(--mint); position: relative; box-shadow: 0 0 40px rgba(138,240,203,.1); }
.ai-center span { position: absolute; top: 12px; right: 14px; font-size: 10px; }
.ai-node { position: absolute; padding: 8px 10px; border: 1px solid rgba(164,210,220,.18); background: rgba(13,22,29,.85); border-radius: 6px; font: 8px var(--mono); color: #b5cbd2; }
.node-one { top: 32px; left: 18%; }.node-two { bottom: 30px; left: 14%; }.node-three { top: 45px; right: 13%; }
.ai-connect { position: absolute; width: 80px; height: 1px; background: rgba(138,240,203,.4); transform-origin: left; }
.connect-one { top: 82px; left: 30%; transform: rotate(32deg); }.connect-two { bottom: 72px; left: 30%; transform: rotate(-28deg); }
.ai-caption { position: absolute; bottom: 13px; right: 15px; color: var(--mint); font-size: 8px; }
.project-body { padding: 21px 22px 23px; }
.project-kicker { color: #778a99; font-size: 8px; }
.project-title-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 9px; }
.project-body h3 { font-size: 19px; }
.arrow-link { width: 29px; height: 29px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 7px; color: var(--mint); flex-shrink: 0; }
.project-body > p { color: var(--muted); font-size: 11px; line-height: 1.85; margin: 12px 0 17px; }
.project-impact { display: flex; align-items: baseline; gap: 8px; padding: 12px 0 15px; border-top: 1px solid var(--line); margin-bottom: 14px; }
.project-impact strong { color: var(--mint); font-size: 23px; letter-spacing: -.05em; }
.project-impact span { color: #8797a5; font-size: 9px; }
.project-tags { margin-top: 16px; gap: 6px; }
.project-tags span { font-size: 8px; padding: 5px 7px; }
.project-links { display: flex; gap: 18px; margin-top: 18px; font-size: 10px; color: #c7d2dc; }
.project-links a:hover, .text-link:hover { color: var(--mint); }
.project-note { font-size: 10px !important; color: #7c8b98 !important; margin-bottom: 0 !important; }
.status-pill { display: inline-flex; align-items: center; gap: 6px; color: var(--mint); font: 8px var(--mono); border: 1px solid rgba(138,240,203,.2); padding: 5px 7px; border-radius: 5px; }
.status-pill span { width: 5px; height: 5px; }
.skills-layout { display: grid; grid-template-columns: .72fr 1.28fr; gap: 70px; }
.skill-symbol { display: grid; place-items: center; width: 48px; height: 48px; border: 1px solid rgba(138,240,203,.28); border-radius: 12px; color: var(--mint); font-size: 24px; }
.skill-intro h3 { font-size: 23px; letter-spacing: -.05em; line-height: 1.3; margin: 20px 0 12px; }
.skill-intro p { color: var(--muted); font-size: 11px; max-width: 250px; line-height: 1.9; }
.skill-groups { border-top: 1px solid var(--line); }
.skill-group { display: grid; grid-template-columns: 155px 1fr; gap: 15px; padding: 17px 0; border-bottom: 1px solid var(--line); }
.skill-label { color: #778999; font-size: 8px; padding-top: 8px; }
.skill-chips span { background: rgba(255,255,255,.018); }
.education-block { padding-bottom: 110px; }
.education-card { display: flex; align-items: center; gap: 18px; padding: 21px; border: 1px solid var(--line); border-radius: 12px; background: rgba(16,21,29,.65); }
.education-icon { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 10px; background: rgba(138,240,203,.1); border: 1px solid rgba(138,240,203,.2); color: var(--mint); font: 13px var(--mono); flex-shrink: 0; }
.education-card h3 { font-size: 13px; }
.education-card p { color: var(--muted); font-size: 10px; margin: 5px 0 0; }
.education-date { margin-left: auto; color: #8292a0; font: 9px var(--mono); white-space: nowrap; }
.problem-solving { display: flex; align-items: center; justify-content: space-between; gap: 25px; padding: 28px 0 0; margin-top: 30px; border-top: 1px solid var(--line); }
.problem-solving h3 { margin: 8px 0 4px; font-size: 20px; letter-spacing: -.04em; }
.problem-solving p { margin: 0; font-size: 11px; color: var(--muted); }
.text-link { color: var(--mint); font-size: 10px; white-space: nowrap; }
.contact-section { border-top: 1px solid var(--line); background: radial-gradient(ellipse at 50% 0%, rgba(32,85,79,.2), transparent 58%); }
.contact-inner { padding-top: 80px; }
.contact-inner h2 { font-size: clamp(32px, 4.5vw, 53px); letter-spacing: -.06em; line-height: 1.18; margin: 18px 0 18px; }
.contact-inner > p { max-width: 490px; color: var(--muted); font-size: 12px; line-height: 1.9; }
.contact-button { margin-top: 15px; }
.contact-bottom { display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; border-top: 1px solid var(--line); margin-top: 90px; padding: 22px 0 26px; color: #70808f; font-size: 8px; }
.contact-bottom div { display: flex; gap: 20px; }
.reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; }
.reveal.is-visible { opacity: 1; transform: translateY(0); }
@media (max-width: 900px) {
  .hero { grid-template-columns: 1fr .8fr; min-height: 590px; }
  .hero-visual { transform: scale(.85); }
  .stats { grid-template-columns: 1fr 1fr; }
  .about-grid { gap: 45px; }
  .experience-item { grid-template-columns: 150px 1fr; gap: 20px; }
  .skills-layout { gap: 35px; }
  .skill-group { grid-template-columns: 125px 1fr; }
}
@media (max-width: 680px) {
  .site-header { width: calc(100% - 32px); height: 70px; }
  .brand { font-size: 9px; }
  .menu-toggle { display: block; cursor: pointer; }
  .nav { display: none; position: absolute; top: 61px; left: 0; right: 0; padding: 17px; background: #10151d; border: 1px solid var(--line); border-radius: 10px; flex-direction: column; align-items: stretch; gap: 0; }
  .nav.open { display: flex; }
  .nav a { padding: 12px 8px; }
  .nav-contact { margin-top: 6px; }
  .section-wrap { width: calc(100% - 34px); }
  .hero { display: flex; flex-direction: column; align-items: stretch; padding-top: 60px; padding-bottom: 65px; }
  h1 { font-size: clamp(42px, 11vw, 60px); }
  .hero-intro { font-size: 13px; }
  .hero-visual { min-height: 360px; margin: 10px -18px 0; transform: scale(.88); }
  .core-card { width: 280px; }
  .orbit-a { width: 320px; }.orbit-b { width: 250px; height: 330px; }
  .tag-java { left: 2%; top: 50px; }.tag-cloud { right: 1%; top: 125px; }.tag-ai { left: 6%; bottom: 37px; }
  .hero-bottom-note { bottom: 16px; font-size: 7px; }
  .stats { grid-template-columns: 1fr 1fr; padding: 20px 15px; gap: 24px 10px; }
  .stat { gap: 8px; align-items: flex-start; flex-direction: column; }
  .stat strong { font-size: 28px; }
  .stat > span { font-size: 9px; }
  .section-block { padding-top: 90px; }
  .section-heading { margin-bottom: 30px; }
  .about-grid { grid-template-columns: 1fr; gap: 25px; }
  .about-lead { font-size: 18px; }
  .experience-item { grid-template-columns: 1fr; gap: 12px; padding: 25px 0; }
  .experience-meta { order: 0; }
  .experience-title-row h3 { font-size: 17px; }
  .project-grid { grid-template-columns: 1fr; }
  .project-featured { grid-row: auto; }
  .project-visual { height: 200px; }
  .skills-layout { grid-template-columns: 1fr; gap: 25px; }
  .skill-intro h3 { margin-top: 14px; }
  .skill-group { grid-template-columns: 1fr; gap: 10px; }
  .education-card { align-items: flex-start; flex-wrap: wrap; }
  .education-card > div:nth-child(2) { flex: 1; min-width: 180px; }
  .education-date { width: 100%; margin-left: 64px; }
  .problem-solving { align-items: flex-start; flex-direction: column; }
  .contact-inner { padding-top: 65px; }
  .contact-bottom { margin-top: 65px; flex-direction: column; }
  .contact-bottom div { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}