404.html

<!doctype html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="theme-color" content="#10251f">
  <title>Página no encontrada · Sebastián Expósito Ruiz</title>
  <link rel="icon" href="assets/img/brand-mark.svg" type="image/svg+xml">
  <style>
    :root{--paper:#f5f5ef;--ink:#10251f;--green:#187054;--muted:#61736d}*{box-sizing:border-box}body{min-width:320px;margin:0;display:grid;min-height:100svh;place-items:center;padding:24px;background:var(--paper);color:var(--ink);font:16px/1.55 Inter,ui-sans-serif,system-ui,sans-serif}.card{max-width:620px;padding:clamp(28px,8vw,68px);border:1px solid #d9dfd9;border-radius:24px;background:#fff;box-shadow:0 18px 48px #14302614}.brand{display:flex;align-items:center;gap:9px;font-weight:800}.brand img{width:36px;height:36px}p{color:var(--muted);font-size:1.1rem}h1{margin:.5rem 0 1rem;font-size:clamp(2.6rem,9vw,5.4rem);letter-spacing:-.08em;line-height:.9}a{display:inline-flex;margin-top:12px;padding:11px 16px;border-radius:10px;background:var(--green);color:#fff;font-weight:800;text-decoration:none}a:focus-visible{outline:3px solid #7460b6;outline-offset:4px}
  </style>
</head>
<body>
  <main class="card">
    <div class="brand"><img src="assets/img/brand-mark.svg" width="36" height="36" alt=""><span>Sebi</span></div>
    <h1>404.</h1>
    <p>Esta página no existe o ha cambiado de dirección.</p>
    <a href="/">Volver al portfolio</a>
  </main>
</body>
</html>