<!DOCTYPE html>
<html>
  <head>
    <title>Robb Irrgang</title>
    <meta charset="utf-8">
    <meta property="og:title" content="Robb Irrgang">
    <meta property="og:site_name" content="Robb Irrgang">
    <meta property="og:url" content="https://irrg.org/">
    <meta property="og:description" content="I’m Robb Irrgang. I’m an engineering leader and creative technologist, solving complex problems while tinkering with creative ideas on the side.">
    <meta property="og:type" content="website">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://use.typekit.net/ray7ste.css">
    <style>
      @font-face {
        font-family: 'Logos';
        src: url(data:font/woff2;base64,d09GMgABAAAAAATcAA0AAAAACyAAAASCAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAP0ZGVE0cGhgGYACCahEICoRshSELgQwAATYCJAOBfgQgBYYbB4EsG+UJAJ4D7s4iBEJB0IkOmRjHoy/qV2I8/LMf7r73ZeKWtiiGeyIRvU8rFiKlUAqZxKGuRP1BL//lzkmN5ARVQPrNSfAGcPqbMf2WAnf3AQbUPLIAA/dEi/8/7lXNXBhO7mUN0JwvjcYCNMa25Hys2QFagQL1W+fiDdyC9RMUuaBYwJJ3GV4t4gAehID/zzd+B5z+5pR7dQSt6MQmqTw182IFVBpzOeUNcB/tJ96SNMpDAZ/Jy1NVCJdMmj6+XjEoz4pDQED2U95gEoICBUYh4B2qwCiaO0C7Rqk2ScGs1nQ7JjBJRsWtpRxaV6evXj660waBZaIGwZxIIG0RA1AsKwY0rCMTcYCbu2ZiUnJK6u7TXyKCw+XxBUKRWAIAK1uuUKrUGq1ObzCazBarze5wutwerw+QLgrfqnElwU2Ar0An8A9XALSCZkhLgZF2mW3wlPiQKAZKY0RhFh4zipbRV4TAbGiGllfQqOK8wKA5Eijk/C14rB4fCn5FWQSjgf9FBeQW8uQFuvwZHGPfXuZADo7XrMllkJOn5SIXQYpu4O05AMdnPXeDb12USdm3qdauqu2bhfs3tz0TkdTnzJKzFHHL1yEniQqkjXn5ETiumKl6MZddN3IXa/r2FJn3xLD8ERw/LsdoKHny4kXN7TIUQWkYdd5L8biLG7duhGzZ+OW9/f23g/tG9uFFynblwvvtJk4qURQpJsq2fSI8izj7duzzSHwP0R7wtM3jETzo7N7H8bhv7CXclew1eB7kuAG/gsB0/q/g4HlEOPrEsnWtLdv3W4J6B92/q5Nh6e9jpR7t9wLLIdk9/mdWXRmXNV5Yi3OZNsM+z/U4xh6cVd84vHDR2Pvb029D0ryFeXGiEkXLmv6BNS3FEmN8YE7RsHigQ9zcPVZYZv0/bqqYWt7Z3iT2T5isEXmPD0auaJpYMGVY2CUU90gC+5L3wbNliS1dDBXzbIYSNYcS/hW3l74jDFjTkH9fs9Ng7+yEdvCz6VZbU6ztDwujvl9lnZH06ywrcgA0Sk2iUp6dVwLkF0A+h8CvmvV+awDEQ+AP+Sb9ea+J223QCWrj/urlfFE6/2LKvykMxaZyCOzyu70WBbrwirFBrIXUYB8Ksx5AaSghVCaaB7WhnkOn+JF4dhdm6oEqSjYwDRA2iAZI7d5D4Y6FUFrzCyrbuaG21k7oxOnb+3WJST60GTJsmlE9unQbgxvQg0TqMagL7Es790qeBuCBIV2GkPL0GFOmxSBSmTYt+nWA23d7yLyesbKWQfLm4bMBnunQZZJ+LUbBSwJrAVYpqOJ2qwp5qhQWLdqdLeVt9a3+sYltM7u1tRdC8k4u2nKN+PQ2kvGvvtJhFKnHkEH4AN08qN80w7qRcFoKWjgRbVwwEoOzIY7ePzjYP224m8S1Ci0u0uo9N4phVCw8/KufePFETF4ttSh08/DqA+nQKV6iJMlSpEqTLkOmLDx8AkIiYhJSMnIKSipqGlo6egZGJmYWVjZ2Pn4BQSFhEXnyFShUpFiJuV6ZchUqValWo1adeg0AAAA=) format('woff2');
        font-weight: normal;
        font-style: normal;
      }

      *,
      *::before,
      *::after {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
      }

      :root {
        --font-scale: 5;
        --min-font-size: 16px;
        --max-font-size: 36px;
        --primary-color: 26, 35, 126;
        --accent-color: 92, 107, 192; 
        --background-color: 247, 245, 237;
        --dark-color: 16, 16, 16;    
        --irrgardless-color: 216, 48, 36;
        --linkedin-color: 40, 103, 178;
        --threeflow-color: 4, 184, 125;   
        --link-color: var(--dark-color);
        --heading-color: 26, 35, 126
      }

      body {
        background: rgba(var(--background-color), 1);
        font-family: kit-sans-variable, sans-serif;
        font-weight: 400;
        font-style: normal;
        font-size: clamp(
          var(--min-font-size), 
          calc(var(--font-scale) * 1vw), 
          var(--max-font-size)
        );
        line-height: 1.5;
        margin: 5vw;

        &::before {
          content: "";
          position: fixed;
          left: 5vw;
          top: 0;
          border-left: 2px dotted rgba(var(--accent-color), 0.5); 
          height: 100vh;
          pointer-events: none; 
        }
      }

      main {
        position: relative;
        text-wrap: balance;  
        border-left: 2px solid rgba(var(--accent-color), 1); 
        padding-left: 20px;
        max-width: 860px;

        &::before {
          content: "\25B6";
          font-family: 'Segoe UI Symbol', 'Arial', sans-serif; 
          font-size: inherit;
          color: rgba(var(--primary-color), 1);
          position: absolute;
          top: 0;
          left: clamp(-2px, calc(-0.1vw), -1px);
          transform: scale(0.5);
          transform-origin: center left;
        }
      }

      h1, h2, span { 
        display: inline;
        font-size: inherit; 
        line-height: inherit; 
        font-weight: inherit;
      }
  
      h1 { 
        font-family: kit-rounded-variable, sans-serif;
        font-weight: 700; 
      }

      h2 {
        color: rgba(var(--dark-color), 1); 
      }

      .no-wrap {
        white-space: nowrap;
        font-weight: 400;
      }

      a * {
        color: inherit;
      }

      a {
        color: var(--link-color);
        text-decoration-thickness: calc(0.1 * var(--font-size, 1em));
        text-underline-offset: calc(0.2 * var(--font-size, 1em));

        & .no-wrap {
          color: rgba(var(--linked-color), 1);
        }

        & .logo {
          display: inline-block;
          position: relative;
          z-index: 1;
          padding: 0.4em 0.15em 0;
          margin: 0 0.1em;
          font-family: Logos;
          font-weight: 400;
          color: rgba(var(--background-color), 1);
          background: var(--link-color);
          line-height: 0.9;
        }
      }

      .linkedin {
        --link-color: rgba(var(--linkedin-color), 1);
      }

      .threeflow {
        --link-color: rgba(var(--threeflow-color), 1);
      }

      .irrgardless {
        --link-color: rgba(var(--irrgardless-color), 1);

        & .logo {
          text-transform: uppercase;
        }
      }

      .resume {
        --link-color: rgba(var(--heading-color), 1);
      }
    </style>
  </head>
  <body>
    <main>
      <span>I’m</span> 
      <a href="resume_robb_2025.pdf" class="resume"><h1><span>Robb</span> Irrgang</h1></a>. 
      <h2>I’m an 
        <a href="https://www.linkedin.com/in/rirrg" class="linkedin">
          <span class="no-wrap">engineer<span class="logo">in</span>g</span> 
          leader and creative technologist
        </a>, 
        <a href="https://threeflow.com" class="threeflow">
          solving complex 
          <span class="no-wrap">probl<span class="logo">e</span>ms</span>
        </a> 
        while 
        <a href="https://irrgardless.com" class="irrgardless">
          tinkering with creative 
          <span class"no-wrap"><span class="logo">i</span>deas</span>
        </a> 
        on the side.
      </h2>
  </body>
</html>
