/* Catppuccin Macchiato (dark) and Latte (light) */
[data-theme="dark"]  { --bg:#1e2030; --text:#b8c0e0; --strong:#cad3f5; --muted:#8087a2; --accent:#8aadf4; --line:#363a4f; --code:#a6da95; --code2:#f5a97f; color-scheme:dark; }
[data-theme="light"] { --bg:#eff1f5; --text:#4c4f69; --strong:#303446; --muted:#7c7f93; --accent:#1e66f5; --line:#ccd0da; --code:#40a02b; --code2:#fe640b; color-scheme:light; }

* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--text); font-family:Inter,system-ui,sans-serif; transition:background .2s,color .2s; }
.wrap { min-height:100vh; display:grid; grid-template-columns:minmax(0,5fr) minmax(0,6fr); }
.photo { position:relative; overflow:hidden; }
.photo img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:right center; display:block; }
.text { padding:clamp(32px,7vw,96px) clamp(24px,6vw,88px); display:flex; flex-direction:column; justify-content:center; max-width:720px; }
h1 { margin:0; font-size:clamp(36px,5vw,56px); font-weight:700; letter-spacing:-.025em; color:var(--strong); }
.role { margin-top:6px; color:var(--muted); font-size:16px; }
.tagline { margin:36px 0 22px; font-family:'JetBrains Mono',ui-monospace,monospace; font-size:19px; color:var(--code); }
.tagline::before { content:"$ "; color:var(--accent); }
.tagline::after { content:"_"; animation:blink 1.1s steps(1) infinite; }
@keyframes blink { 50% { opacity:0; } }
@media (prefers-reduced-motion: reduce) { .tagline::after { animation:none; } }
p { font-size:16.5px; line-height:1.7; margin:0 0 14px; }
.glass { font-family:'JetBrains Mono',ui-monospace,monospace; color:var(--code2); font-size:.93em; }
.links { display:flex; gap:22px; margin-top:22px; }
.links a { display:inline-flex; align-items:center; gap:8px; color:var(--accent); text-decoration:none; font-size:15px; border-bottom:1px solid var(--line); padding-bottom:2px; }
.links a:hover { border-color:var(--accent); }
.links svg { width:16px; height:16px; flex:none; }

.theme { position:fixed; top:16px; right:16px; font:14px Inter,system-ui,sans-serif; background:var(--bg); color:var(--muted); border:1px solid var(--line); border-radius:999px; padding:6px 12px; cursor:pointer; z-index:10; }
.theme:hover { color:var(--strong); }

@media (max-width: 760px) {
  .wrap { grid-template-columns:1fr; }
  .photo { min-height:42vh; }
}
