/* Base Theme Variables */
:root {
	--bg: #ffffff;
	--bg-alt: #f6f8fa;
	--bg-soft: #eef1f5;
	--text: #1b1f23;
	--text-soft: #4d5562;
	--primary: #0a84ff;
	--primary-accent: #4dabff;
	--border: #d0d7de;
	--radius-sm: 4px;
	--radius: 10px;
	--radius-lg: 20px;
	--shadow-sm: 0 1px 2px rgba(0,0,0,.06), 0 1px 3px rgba(0,0,0,.1);
	--shadow: 0 4px 16px -4px rgba(0,0,0,.1), 0 2px 6px -2px rgba(0,0,0,.08);
	--gradient: linear-gradient(135deg,#0a84ff,#7b5bff 60%, #ff4fa3);
	--focus: 0 0 0 3px color-mix(in srgb,var(--primary) 50%, transparent);
	--font-stack: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
	--transition: 150ms cubic-bezier(.4,0,.2,1);
	--easing-spring: cubic-bezier(.34,1.56,.64,1);
}

/* Dark mode */
body.dark {
	--bg: #0d1117;
	--bg-alt: #161b22;
	--bg-soft: #1f242c;
	--text: #e6edf3;
	--text-soft: #9ca5b1;
	--border: #30363d;
	--shadow: 0 4px 20px -4px rgba(0,0,0,.6), 0 2px 8px -2px rgba(0,0,0,.5);
	--gradient: linear-gradient(135deg,#0a84ff,#5856d6 55%, #ff375f);
}

/* Global Reset & Typography */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
	margin: 0;
	background: var(--bg);
	color: var(--text);
	font-family: var(--font-stack);
	-webkit-font-smoothing: antialiased;
	line-height: 1.5;
 	accent-color: var(--primary);
}
img { max-width: 100%; display: block; }
h1,h2,h3 { line-height: 1.2; font-weight: 600; margin: 0 0 .6em; }
p { margin: 0 0 1em; }
ul { padding-left: 1.2rem; }
ul,ol { margin: 0 0 1.25em; }
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--bg-alt); }
::-webkit-scrollbar-thumb { background: var(--border); border-radius: 20px; }
::-webkit-scrollbar-thumb:hover { background: var(--text-soft); }

/* Containers */
.container { width: min(1180px, 100% - 2rem); margin: 0 auto; }
.narrow { max-width: 820px; }

/* Header */
.site-header { position: sticky; top:0; backdrop-filter: blur(14px); background: color-mix(in srgb,var(--bg) 90%, transparent); border-bottom: 1px solid var(--border); z-index: 40; }
.nav-wrapper { display:flex; align-items:center; justify-content:space-between; gap:1rem; min-height:72px; }
.brand { font-weight:700; font-size:1.15rem; letter-spacing:.5px; text-decoration:none; display:inline-flex; align-items:center; gap:.55rem; position:relative; isolation:isolate; }
.brand:after { content:""; position:absolute; inset:-6px -12px; background:linear-gradient(120deg, color-mix(in srgb,var(--primary) 25%, transparent), transparent 60%); opacity:0; border-radius:40px; transition:var(--transition); z-index:-1; }
.brand:hover:after, .brand:focus-visible:after { opacity:1; }
.logo-mark { width:34px; height:34px; display:inline-flex; align-items:center; justify-content:center; font-size:1rem; font-weight:600; background:var(--gradient); color:#fff; border-radius: 12px; position:relative; box-shadow:0 4px 14px -4px rgba(0,0,0,.35), 0 2px 6px -2px rgba(0,0,0,.3); }
.logo-mark:before { content:""; position:absolute; inset:0; border-radius:inherit; background:linear-gradient(160deg,rgba(255,255,255,.35),rgba(255,255,255,.05)); mix-blend-mode:overlay; pointer-events:none; }
.brand-text { display:inline-flex; align-items:baseline; gap:.25rem; font-size:1.15rem; font-weight:600; letter-spacing:.5px; }
.brand-text span { background: var(--gradient); -webkit-background-clip:text; background-clip:text; color:transparent; }
.main-nav ul { display:flex; list-style:none; gap:1.25rem; padding:0; margin:0; }
.main-nav a { text-decoration:none; color: var(--text-soft); font-weight:500; padding:.5rem .75rem; border-radius: var(--radius-sm); position:relative; }
.main-nav a:hover, .main-nav a:focus { color: var(--text); background: var(--bg-alt); }
.header-actions { display:flex; gap:.75rem; align-items:center; }

.nav-toggle { display:none; background:none; border:none; position:relative; width:38px; height:38px; border-radius: var(--radius-sm); cursor:pointer; }
.nav-toggle span, .nav-toggle span:before, .nav-toggle span:after { position:absolute; left:9px; right:9px; height:2px; background:var(--text); content:""; transition:var(--transition); }
.nav-toggle span { top:50%; transform:translateY(-50%); }
.nav-toggle span:before { top:-8px; }
.nav-toggle span:after { top:8px; }
.nav-toggle[aria-expanded=true] span { background:transparent; }
.nav-toggle[aria-expanded=true] span:before { transform:translateY(8px) rotate(45deg); }
.nav-toggle[aria-expanded=true] span:after { transform:translateY(-8px) rotate(-45deg); }

/* Hero */
.hero { padding: clamp(4rem,10vh,8rem) 0 4.5rem; position:relative; }
.hero:before { content:""; position:absolute; inset:0; background: radial-gradient(circle at 18% 22%, color-mix(in srgb,var(--primary) 28%, transparent), transparent 70%), linear-gradient(180deg,rgba(0,0,0,.0),rgba(0,0,0,.35)); pointer-events:none; z-index:0; }
.hero-grid, .hero * { position:relative; z-index:1; }
.hero-grid { display:grid; gap:3rem; grid-template-columns: repeat(auto-fit,minmax(320px,1fr)); align-items:center; }
.hero-copy h1 { font-size: clamp(2.75rem, 6vw, 3.6rem); margin-bottom:.4rem; }
.role { font-size:1.25rem; font-weight:500; color: var(--primary); margin-top:0; }
.tagline { font-size:1.05rem; max-width:56ch; }
.hero-cta { display:flex; gap:1rem; flex-wrap:wrap; margin:1.4rem 0 1.75rem; }
.quick-stats { display:flex; gap:2rem; flex-wrap:wrap; }
.quick-stats .stat { font-size:1.75rem; font-weight:600; display:block; }
.quick-stats .label { font-size:.75rem; text-transform:uppercase; letter-spacing:.5px; color: var(--text-soft); font-weight:600; }
.hero-media { display:flex; justify-content:center; }
.headshot { width:260px; aspect-ratio:1; background: var(--gradient); border-radius: 30px; padding:6px; box-shadow: var(--shadow); position:relative; overflow:hidden; }
.headshot:before { content:""; position:absolute; inset:0; background: linear-gradient(160deg,rgba(255,255,255,.18),transparent); pointer-events:none; }
.headshot .initials { display:flex; align-items:center; justify-content:center; font-size:5rem; font-weight:600; width:100%; height:100%; background: var(--bg); color: var(--text); border-radius: 24px; }

/* Sections */
.section { padding: 4.5rem 0; position:relative; }
.section.alt { background: var(--bg-alt); }
.section-title { font-size: clamp(2rem,4.2vw,2.6rem); margin:0 0 2rem; position:relative; }
.section-title:after { content:""; position:absolute; left:0; bottom:-8px; width:64px; height:4px; border-radius:4px; background: var(--gradient); }
.lead { font-size:1.08rem; color: var(--text-soft); margin-top:-.25rem; }

/* Skills */
.skill-groups { display:grid; gap:2rem; grid-template-columns: repeat(auto-fit,minmax(240px,1fr)); }
.skill-group h3 { margin-top:0; font-size:1rem; letter-spacing:.5px; text-transform:uppercase; color: var(--text-soft); }
.pill-list { list-style:none; padding:0; margin:0; display:flex; flex-wrap:wrap; gap:.5rem; }
.pill-list li { padding:.5rem .75rem; background: var(--bg-soft); border:1px solid var(--border); border-radius: 30px; font-size:.8rem; font-weight:500; letter-spacing:.3px; }
body.dark .pill-list li { background:#262e39; }

/* Timeline */
.timeline { list-style:none; padding:0; margin:0; position:relative; display:grid; gap:2.8rem; }
.timeline:before { content:""; position:absolute; left:2px; top:6px; bottom:6px; width:2px; background: var(--border); }
.timeline-item { position:relative; padding-left:2.5rem; }
.timeline-item:before { content:""; position:absolute; left:-2px; top:6px; width:12px; height:12px; background: var(--primary); border-radius:50%; transform:translate(-50%); box-shadow:0 0 0 4px var(--bg); }
.timeline .time { font-size:.75rem; letter-spacing:.5px; text-transform:uppercase; font-weight:600; color: var(--text-soft); margin-bottom:.5rem; }
.card { background: var(--bg-soft); padding:1.25rem 1.4rem 1.4rem; border-radius: var(--radius); border:1px solid var(--border); box-shadow: var(--shadow-sm); }
body.dark .card { background:#1b222b; }
.card h3 { margin-top:0; font-size:1.1rem; }
.bullets { list-style:disc; margin:.75rem 0 0 1.2rem; padding:0; font-size:.9rem; }
.bullets li { margin-bottom:.35rem; }

/* Projects */
.projects-grid { display:grid; gap:2rem; grid-template-columns: repeat(auto-fit,minmax(300px,1fr)); }
.project-card { background: var(--bg); border:1px solid var(--border); border-radius: 18px; box-shadow: var(--shadow-sm); overflow:hidden; display:flex; flex-direction:column; position:relative; transition:var(--transition); }
body.dark .project-card { background:#12181f; }
.project-card:focus, .project-card:hover { transform:translateY(-6px); box-shadow: var(--shadow); }
.project-card:after { content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; background:radial-gradient(circle at 30% 20%, rgba(255,255,255,.35), transparent 60%); opacity:0; transition:400ms ease; mix-blend-mode:overlay; }
.project-card:hover:after, .project-card:focus:after { opacity:.65; }
.proj-media { height:150px; background: var(--gradient); position:relative; }
.proj-media.gradient { animation:gradientShift 12s linear infinite; background-size:180% 180%; }
.proj-media.gradient.alt1 { background: linear-gradient(135deg,#ff8a05,#ff4fa3); }
.proj-media.gradient.alt2 { background: linear-gradient(135deg,#06b6d4,#0a84ff); }
.proj-body { padding:1.25rem 1.25rem 1.4rem; display:flex; flex-direction:column; gap:.75rem; flex:1; }
.proj-body h3 { margin:0; font-size:1.05rem; }
.tags { list-style:none; display:flex; flex-wrap:wrap; gap:.5rem; padding:0; margin:.25rem 0 0; }
.tags li { background: var(--bg-soft); border:1px solid var(--border); padding:.35rem .6rem; font-size:.65rem; letter-spacing:.5px; text-transform:uppercase; font-weight:600; border-radius: 18px; }
.proj-links { margin-top:auto; }
.text-link { text-decoration:none; font-weight:600; color: var(--primary); position:relative; }
.text-link:after { content:""; position:absolute; left:0; bottom:-2px; width:100%; height:2px; background: currentColor; transform:scaleX(0); transform-origin:left; transition:var(--transition); }
.text-link:hover:after, .text-link:focus:after { transform:scaleX(1); }

/* Education */
.edu-certs { display:grid; gap:2rem; grid-template-columns: repeat(auto-fit,minmax(300px,1fr)); align-items:start; }
.certs { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.6rem; }
.certs li { padding:.75rem 1rem; background: var(--bg-soft); border:1px solid var(--border); border-radius: var(--radius-sm); font-size:.85rem; font-weight:500; }
body.dark .certs li { background:#1b222b; }

/* Contact */
.contact-layout { display:grid; gap:3rem; grid-template-columns: repeat(auto-fit,minmax(320px,1fr)); align-items:start; }
form#contactForm { background: var(--bg); border:1px solid var(--border); padding:1.8rem 1.6rem 2rem; border-radius: 20px; box-shadow: var(--shadow-sm); position:relative; }
body.dark form#contactForm { background:#12181f; }
.field-group { display:flex; flex-direction:column; margin-bottom:1.1rem; }
label { font-weight:500; font-size:.8rem; text-transform:uppercase; letter-spacing:.5px; margin-bottom:.35rem; color: var(--text-soft); }
input[type=text], input[type=email], textarea { font:inherit; padding:.75rem .85rem; background: var(--bg-alt); border:1px solid var(--border); border-radius: var(--radius-sm); resize:vertical; color: var(--text); }
body.dark input[type=text],body.dark input[type=email],body.dark textarea { background:#1f262f; }
input:focus, textarea:focus { outline:none; border-color: var(--primary); box-shadow: var(--focus); }
.form-status { font-size:.8rem; margin-top:.75rem; min-height:1.2em; }
.contact-aside { padding:.5rem 0; }
.social-links { list-style:none; display:flex; flex-direction:column; gap:.5rem; padding:0; margin:1rem 0 1.5rem; }
.social-links a { text-decoration:none; font-weight:500; color: var(--primary); position:relative; }
.social-links a:hover { text-decoration:underline; }
.muted { color: var(--text-soft); }
.small { font-size:.8rem; }

/* Footer */
.site-footer { border-top:1px solid var(--border); padding:2.2rem 0; background: var(--bg-alt); margin-top:3rem; }
.footer-inner { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; }
.to-top { text-decoration:none; background: var(--bg); border:1px solid var(--border); padding:.5rem .75rem; border-radius: var(--radius-sm); color: var(--text-soft); font-weight:500; }
.to-top:hover { color: var(--text); }

/* Buttons */
.primary-btn, .secondary-btn, .ghost-btn { --_pad-y:.8rem; --_pad-x:1.2rem; font:inherit; cursor:pointer; border:none; border-radius: 30px; font-weight:600; letter-spacing:.5px; position:relative; display:inline-flex; gap:.5rem; align-items:center; text-decoration:none; line-height:1; }
.primary-btn { background: var(--gradient); color:#fff; padding:var(--_pad-y) var(--_pad-x); box-shadow: var(--shadow-sm); }
.primary-btn:hover { filter:brightness(1.05); transform:translateY(-2px); box-shadow:0 8px 22px -10px rgba(0,0,0,.4); }
.primary-btn:active { transform:translateY(0); box-shadow: var(--shadow-sm); }
.secondary-btn { background: var(--bg-soft); border:1px solid var(--border); color: var(--text); padding:var(--_pad-y) var(--_pad-x); }
body.dark .secondary-btn { background:#242d37; }
.secondary-btn:hover { background: var(--bg-alt); transform:translateY(-2px); }
.secondary-btn:active { transform:translateY(0); }
.ghost-btn { background: var(--bg-alt); border:1px solid var(--border); color: var(--text); padding:.65rem .9rem; }
.ghost-btn:hover { background: var(--bg-soft); }
.primary-btn.small, .secondary-btn.small { --_pad-y:.55rem; --_pad-x:1rem; font-size:.75rem; }
.primary-btn.full { width:100%; justify-content:center; }
button:disabled { opacity:.55; cursor:not-allowed; }

/* Chat within hero */
.hero-grid { grid-template-columns: repeat(auto-fit,minmax(320px,1fr)); }
.hero-chat { display:flex; flex-direction:column; gap:1rem; }
.hero-chat .chat-window { height:560px; }
.visually-hidden { position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
/* Chat window styling */
.chat-window { width:100%; height:520px; max-width:100%; background: color-mix(in srgb,var(--bg-alt) 36%, transparent); backdrop-filter: blur(18px) saturate(150%); border:1px solid color-mix(in srgb,var(--border) 38%, transparent); border-radius: 34px; box-shadow: 0 16px 50px -20px rgba(0,0,0,.55), 0 4px 14px -4px rgba(0,0,0,.4); display:flex; flex-direction:column; overflow:hidden; position:relative; opacity:1; transform:none; pointer-events:auto; z-index:120; }
.chat-window:before { content:""; position:absolute; inset:0; background:linear-gradient(145deg,rgba(255,255,255,.06),transparent 60%); mix-blend-mode:overlay; pointer-events:none; }
body.dark .chat-window { background:#11181f; }
.chat-window.expanded { position:fixed; top:50%; left:50%; width:min(900px,90vw); height:min(640px,80vh); max-width:none; z-index:500; transform:translate(-50%,-50%); animation:chatGrow .35s ease; }
@media (max-width:900px){ .chat-window.expanded { width:94vw; height:80vh; } }
@keyframes chatGrow { from { transform:translate(-50%,-50%) scale(.92); opacity:0; } to { transform:translate(-50%,-50%) scale(1); opacity:1; } }
.chat-messages { flex:1; padding:1.2rem 1.35rem 1rem; overflow-y:auto; display:flex; flex-direction:column; gap:.9rem; font-size:.87rem; background:linear-gradient(180deg, color-mix(in srgb,var(--bg-alt) 55%, transparent) 0%, color-mix(in srgb,var(--bg) 70%, transparent) 100%); }
.bubble { max-width:70ch; padding:.8rem 1rem .9rem; border-radius: 22px; line-height:1.55; position:relative; animation:fadeIn .4s ease; font-size:.9rem; border:1px solid color-mix(in srgb,var(--border) 60%, transparent); backdrop-filter: blur(4px); }
.bubble.user { margin-left:auto; background: linear-gradient(135deg,var(--primary) -10%, var(--primary-accent) 120%); color:#fff; border-bottom-right-radius:8px; box-shadow:0 6px 16px -6px rgba(0,0,0,.45); border:none; }
.bubble.bot { background: color-mix(in srgb,var(--bg-soft) 80%, transparent); border-bottom-left-radius:8px; }
/* Enhanced Markdown inside bot messages */
.bubble.bot p { margin:.45em 0; }
.bubble.bot p:first-child { margin-top:0; }
.bubble.bot p:last-child { margin-bottom:0; }
.bubble.bot ul, .bubble.bot ol { margin:.5em 0 .6em 1.15em; padding:0; }
.bubble.bot li { margin:.25em 0; }

/* Headers */
.bubble.bot h1, .bubble.bot h2, .bubble.bot h3, 
.bubble.bot h4, .bubble.bot h5, .bubble.bot h6 {
	margin:.8em 0 .4em 0;
	font-weight:600;
	line-height:1.3;
}
.bubble.bot h1 { font-size:1.2em; }
.bubble.bot h2 { font-size:1.1em; }
.bubble.bot h3 { font-size:1.05em; }
.bubble.bot h4, .bubble.bot h5, .bubble.bot h6 { font-size:1em; }
.bubble.bot h1:first-child, .bubble.bot h2:first-child, 
.bubble.bot h3:first-child, .bubble.bot h4:first-child, 
.bubble.bot h5:first-child, .bubble.bot h6:first-child { margin-top:0; }

/* Text formatting */
.bubble.bot strong, .bubble.bot b { font-weight:600; }
.bubble.bot em, .bubble.bot i { font-style:italic; }
.bubble.bot u { text-decoration:underline; }
.bubble.bot s, .bubble.bot strike { text-decoration:line-through; }

/* Code */
.bubble.bot code { 
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; 
	font-size:.8rem; 
	background:rgba(0,0,0,.08); 
	padding:.15rem .35rem; 
	border-radius:6px; 
}
body.dark .bubble.bot code { background:rgba(255,255,255,.08); }

.bubble.bot pre { 
	background:rgba(0,0,0,.08); 
	padding:.75rem .9rem; 
	border-radius:10px; 
	overflow:auto; 
	font-size:.75rem; 
	line-height:1.4; 
	margin:.6em 0;
}
body.dark .bubble.bot pre { background:#1d252d; }
.bubble.bot pre code {
	background:transparent;
	padding:0;
	border-radius:0;
}

/* Blockquotes */
.bubble.bot blockquote {
	margin:.6em 0;
	padding-left:1rem;
	border-left:3px solid var(--primary);
	background:rgba(0,0,0,.03);
	padding:.5rem 1rem .5rem;
	border-radius:0 8px 8px 0;
	font-style:italic;
}
body.dark .bubble.bot blockquote {
	background:rgba(255,255,255,.03);
}

/* Links */
.bubble.bot a {
	color:var(--primary);
	text-decoration:none;
	border-bottom:1px solid transparent;
	transition:border-color 150ms ease;
}
.bubble.bot a:hover {
	border-bottom-color:var(--primary);
}

/* Lists */
.bubble.bot ul {
	list-style-type:disc;
}
.bubble.bot ol {
	list-style-type:decimal;
}
.bubble.bot li {
	margin:.2em 0;
}

/* Tables */
.bubble.bot table {
	border-collapse:collapse;
	width:100%;
	margin:.6em 0;
	font-size:.85em;
}
.bubble.bot th, .bubble.bot td {
	border:1px solid var(--border);
	padding:.4rem .6rem;
	text-align:left;
}
.bubble.bot th {
	background:rgba(0,0,0,.05);
	font-weight:600;
}
body.dark .bubble.bot th {
	background:rgba(255,255,255,.05);
}

/* Horizontal rule */
.bubble.bot hr {
	border:none;
	border-top:1px solid var(--border);
	margin:1em 0;
	opacity:.6;
}

/* Images */
.bubble.bot img {
	max-width:100%;
	height:auto;
	border-radius:8px;
	margin:.5em 0;
}

/* General bot bubble styling */
body.dark .bubble.bot { background: color-mix(in srgb,#1b222b 85%, transparent); }
.chat-input-row { display:flex; gap:.65rem; padding:.85rem .85rem .95rem; border-top:1px solid color-mix(in srgb,var(--border) 55%, transparent); background: linear-gradient(180deg,color-mix(in srgb,var(--bg-alt) 65%, transparent), color-mix(in srgb,var(--bg) 70%, transparent)); backdrop-filter: blur(12px); }
.chat-input-row input { flex:1; border:1px solid color-mix(in srgb,var(--border) 55%, transparent); background: color-mix(in srgb,var(--bg-alt) 75%, transparent); border-radius: 40px; padding:.85rem 1.15rem; font:inherit; font-size:.9rem; }
.chat-input-row input:focus { outline:none; border-color: var(--primary); box-shadow: var(--focus); }
.chat-hint { margin:.45rem .75rem 0; }

/* Chat expand/collapse control */
.chat-expand-exit { position:absolute; top:6px; right:8px; width:32px; height:32px; border:none; background:rgba(0,0,0,.35); color:#fff; border-radius:50%; cursor:pointer; font-size:1.1rem; line-height:1; display:none; align-items:center; justify-content:center; box-shadow:0 4px 10px -4px rgba(0,0,0,.4); }
body.dark .chat-expand-exit { background:rgba(255,255,255,.15); }
.chat-window.expanded .chat-expand-exit { display:flex; }
body:not(.dark) .chat-expand-exit:hover { background:rgba(0,0,0,.5); }
body.dark .chat-expand-exit:hover { background:rgba(255,255,255,.25); }
/* Expand (enter) button shows when not expanded */
.chat-expand-enter { position:absolute; top:6px; right:8px; width:32px; height:32px; border:none; background:rgba(0,0,0,.35); color:#fff; border-radius:50%; cursor:pointer; font-size:.9rem; line-height:1; display:flex; align-items:center; justify-content:center; box-shadow:0 4px 10px -4px rgba(0,0,0,.4); pointer-events:auto; z-index:5; }
body.dark .chat-expand-enter { background:rgba(255,255,255,.15); }
.chat-window.expanded .chat-expand-enter { display:none; }
.chat-expand-enter:hover { filter:brightness(1.1); }

/* Modal overlay for expanded chat */
.chat-overlay { position:fixed; inset:0; background:rgba(0,0,0,.45); backdrop-filter:blur(4px); z-index:200; animation:fadeOverlay .25s ease; }
@keyframes fadeOverlay { from { opacity:0; } to { opacity:1; } }

/* Legacy floating widget classes neutralized (if leftover) */
.chatbot, .chat-toggle, .chat-close, .chat-header, .chat-section { display:none !important; }

@media (max-width: 980px) {
	.hero { padding-bottom:3.5rem; }
	.hero-chat .chat-window { height:480px; }
}

@keyframes fadeIn { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:translateY(0); } }

/* Scroll reveal animation */
[data-reveal] { opacity:0; transform:translateY(28px); transition:600ms var(--easing-spring); will-change:transform,opacity; }
[data-reveal].is-visible { opacity:1; transform:none; }
[data-reveal].delay-1 { transition-delay:120ms; }
[data-reveal].delay-2 { transition-delay:220ms; }
[data-reveal].delay-3 { transition-delay:320ms; }

/* Subtle gradient drift */
@keyframes gradientShift { 0% { background-position:0% 50%; } 50% { background-position:100% 50%; } 100% { background-position:0% 50%; } }

/* Accessible motion reduction */
@media (prefers-reduced-motion: reduce) {
	.proj-media.gradient { animation:none; }
	[data-reveal] { transition: none; opacity:1 !important; transform:none !important; }
}

/* Utilities */
.gradient-text { background: var(--gradient); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hidden { display:none !important; }

/* Responsive */
@media (max-width: 880px) {
	.main-nav ul { position:fixed; inset:72px 0 auto 0; background: var(--bg); flex-direction:column; padding:1rem 1.25rem 2rem; gap:.5rem; transform:translateY(-8px); border-bottom:1px solid var(--border); box-shadow:0 8px 20px -8px rgba(0,0,0,.15); opacity:0; pointer-events:none; transition:var(--transition); }
	body.dark .main-nav ul { background:#0d1117; }
	.main-nav[data-open=true] ul { opacity:1; transform:translateY(0); pointer-events:auto; }
	.nav-toggle { display:inline-flex; align-items:center; justify-content:center; }
	.hero { padding-top: 5.5rem; }
	.quick-stats { gap:1.4rem; }
}

@media (prefers-reduced-motion: reduce) {
	* { animation-duration:1ms !important; animation-iteration-count:1 !important; transition-duration:1ms !important; scroll-behavior:auto !important; }
}

