:root { color-scheme: dark; --bg:#050807; --ink:#f5f8f7; --muted:#b4bfba; --green:#00efb0; }
* { box-sizing:border-box; }
body { min-width:320px; min-height:100vh; margin:0; background:radial-gradient(circle at 18% 40%,rgba(0,154,111,.2),transparent 32rem),linear-gradient(135deg,#040706,#08110e); color:var(--ink); font-family:Inter,Arial,Helvetica,sans-serif; -webkit-font-smoothing:antialiased; }
body::after { position:fixed; z-index:-1; right:-22vw; bottom:-35vw; width:65vw; height:65vw; border:1px solid rgba(0,239,176,.17); border-radius:50%; content:""; }
.about-shell { width:min(1220px,calc(100% - 48px)); margin:0 auto; padding:28px 0 60px; }
.about-nav { display:flex; align-items:center; justify-content:space-between; margin-bottom:52px; }
.about-brand { display:flex; align-items:center; gap:10px; color:var(--ink); font-size:15px; font-weight:800; letter-spacing:.2em; text-decoration:none; }
.about-brand img { width:48px; }
.about-brand strong { color:var(--green); }
.back-link { padding:11px 15px; border:1px solid rgba(255,255,255,.12); border-radius:999px; color:var(--muted); font-size:14px; text-decoration:none; transition:.2s ease; }
.back-link:hover,.back-link:focus-visible { border-color:var(--green); color:var(--ink); }
.about-hero { display:grid; grid-template-columns:minmax(350px,.82fr) minmax(0,1.18fr); align-items:center; gap:clamp(48px,8vw,110px); }
.portrait-wrap { position:relative; min-height:660px; overflow:hidden; border:1.5px solid var(--green); border-radius:26px; background:#101713; }
.portrait-wrap::after { position:absolute; inset:0; background:linear-gradient(0deg,rgba(2,8,6,.76),transparent 48%); content:""; }
.portrait-wrap img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; object-position:48% center; filter:saturate(.78) contrast(1.04); }
.portrait-label { position:absolute; z-index:1; left:30px; bottom:28px; font-size:23px; font-weight:850; letter-spacing:-.02em; }
.portrait-label small { color:var(--green); font-size:13px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.eyebrow { color:var(--green); font-size:13px; font-weight:850; letter-spacing:.16em; text-transform:uppercase; }
.about-copy h1 { max-width:740px; margin:16px 0 26px; font-size:clamp(42px,5.1vw,72px); line-height:.98; letter-spacing:-.055em; text-wrap:balance; }
.about-copy p { max-width:680px; margin:0 0 15px; color:var(--muted); font-size:18px; line-height:1.7; }
.skills { display:flex; flex-wrap:wrap; gap:9px; margin:30px 0 36px; }
.skills span { padding:9px 13px; border:1px solid rgba(0,239,176,.25); border-radius:999px; background:rgba(0,239,176,.06); color:#dffaf2; font-size:13px; font-weight:700; }
.about-actions { display:flex; flex-wrap:wrap; gap:12px; }
.about-actions a { display:inline-flex; align-items:center; justify-content:center; min-height:52px; padding:0 21px; border-radius:999px; font-size:15px; font-weight:850; text-decoration:none; transition:transform .2s ease; }
.about-actions .primary { background:var(--green); color:#02100b; }
.about-actions .primary b { margin-left:10px; }
.about-actions .secondary { border:1px solid rgba(255,255,255,.16); color:var(--ink); }
.about-actions a:hover { transform:translateY(-2px); }
@media(max-width:820px){.about-shell{width:min(680px,calc(100% - 28px));}.about-nav{margin-bottom:34px}.about-hero{grid-template-columns:1fr;gap:42px}.portrait-wrap{min-height:560px}.about-copy h1{font-size:clamp(40px,10vw,62px)}}
@media(max-width:520px){.about-shell{width:calc(100% - 22px);padding-top:18px}.about-brand span{display:none}.back-link{font-size:13px}.portrait-wrap{min-height:470px;border-radius:19px}.about-copy h1{font-size:clamp(36px,11vw,48px)}.about-copy p{font-size:16px}.about-actions{flex-direction:column}.about-actions a{width:100%}}
@media(prefers-reduced-motion:reduce){.about-actions a{transition:none}}