{"id":21,"date":"2026-08-06T23:51:32","date_gmt":"2026-08-06T23:51:32","guid":{"rendered":"https:\/\/andymargs.com\/?page_id=21"},"modified":"2026-08-06T23:51:32","modified_gmt":"2026-08-06T23:51:32","slug":"home","status":"publish","type":"page","link":"https:\/\/andymargs.com\/","title":{"rendered":"Home"},"content":{"rendered":"<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,500;1,9..144,600&family=Inter:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap\" rel=\"stylesheet\">\r\n<script type=\"application\/ld+json\">\r\n{\r\n  \"@context\": \"https:\/\/schema.org\",\r\n  \"@type\": \"Person\",\r\n  \"name\": \"Andr\u00e9s Marulanda\",\r\n  \"alternateName\": \"Andy Margs\",\r\n  \"jobTitle\": \"Media Founder & AI Builder\",\r\n  \"url\": \"https:\/\/andymargs.com\",\r\n  \"image\": \"https:\/\/andymargs.com\/wp-content\/uploads\/2026\/08\/andy-headshot-transparent.png\",\r\n  \"sameAs\": [\r\n    \"https:\/\/www.instagram.com\/andymargs\",\r\n    \"https:\/\/qpasa.com\"\r\n  ],\r\n  \"worksFor\": {\r\n    \"@type\": \"Organization\",\r\n    \"name\": \"QPASA\",\r\n    \"url\": \"https:\/\/qpasa.com\",\r\n    \"description\": \"Media network reaching 5.1M+ followers and 400M+ monthly impressions across eight platforms.\"\r\n  },\r\n  \"homeLocation\": {\r\n    \"@type\": \"Place\",\r\n    \"name\": \"Toronto, Canada\"\r\n  }\r\n}\r\n<\/script>\r\n<style>\r\n\r\n  :root{\r\n    --bg: #0a0b0d;\r\n    --bg-alt: #121317;\r\n    --bg-card: #16181c;\r\n    --ink: #f2efe8;\r\n    --ink-dim: #9b9790;\r\n    --ink-faint: #59564f;\r\n    --copper: #c98a55;\r\n    --copper-bright: #e0a06a;\r\n    --copper-dim: #5c4128;\r\n    --line: rgba(242,239,232,0.09);\r\n    --line-bright: rgba(201,138,85,0.35);\r\n    --maxw: 1180px;\r\n  }\r\n\r\n  *{ box-sizing:border-box; }\r\n  html{ scroll-behavior:smooth; }\r\n  @media (prefers-reduced-motion: reduce){\r\n    html{ scroll-behavior:auto; }\r\n    *{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; }\r\n  }\r\n\r\n  body{\r\n    margin:0;\r\n    background:var(--bg);\r\n    color:var(--ink);\r\n    font-family:'Inter', sans-serif;\r\n    -webkit-font-smoothing:antialiased;\r\n    overflow-x:hidden;\r\n  }\r\n\r\n  ::selection{ background:var(--copper); color:#0a0b0d; }\r\n\r\n  a{ color:inherit; text-decoration:none; }\r\n\r\n  :focus-visible{\r\n    outline: 1.5px solid var(--copper-bright);\r\n    outline-offset: 3px;\r\n  }\r\n\r\n  .mono{ font-family:'IBM Plex Mono', monospace; }\r\n\r\n  .wrap{\r\n    max-width:var(--maxw);\r\n    margin:0 auto;\r\n    padding:0 32px;\r\n  }\r\n\r\n  \/* faint grid texture, fixed across whole page *\/\r\n  .grid-texture{\r\n    position:fixed;\r\n    inset:0;\r\n    z-index:0;\r\n    pointer-events:none;\r\n    background-image:\r\n      linear-gradient(var(--line) 1px, transparent 1px),\r\n      linear-gradient(90deg, var(--line) 1px, transparent 1px);\r\n    background-size: 64px 64px;\r\n    opacity:0.35;\r\n    mask-image: radial-gradient(ellipse 90% 70% at 50% 0%, black 30%, transparent 85%);\r\n  }\r\n\r\n  \/* ---------- NAV ---------- *\/\r\n  .nav{\r\n    position:fixed;\r\n    top:0; left:0; right:0;\r\n    z-index:50;\r\n    background:rgba(10,11,13,0.72);\r\n    backdrop-filter: blur(10px);\r\n    -webkit-backdrop-filter: blur(10px);\r\n    border-bottom:1px solid var(--line);\r\n  }\r\n  .nav-inner{\r\n    max-width:var(--maxw);\r\n    margin:0 auto;\r\n    padding:20px 32px;\r\n    display:flex;\r\n    align-items:center;\r\n    justify-content:space-between;\r\n  }\r\n  .nav-name{\r\n    font-family:'IBM Plex Mono', monospace;\r\n    font-size:13px;\r\n    letter-spacing:0.06em;\r\n    color:var(--ink);\r\n  }\r\n  .nav-name .dot{ color:var(--copper); }\r\n  .nav-links{\r\n    display:flex;\r\n    gap:36px;\r\n    list-style:none;\r\n    margin:0; padding:0;\r\n  }\r\n  .nav-links a{\r\n    font-family:'IBM Plex Mono', monospace;\r\n    font-size:12px;\r\n    letter-spacing:0.08em;\r\n    color:var(--ink-dim);\r\n    text-transform:uppercase;\r\n    position:relative;\r\n    padding-bottom:3px;\r\n    transition:color 0.25s ease;\r\n  }\r\n  .nav-links a::after{\r\n    content:\"\";\r\n    position:absolute;\r\n    left:0; bottom:0;\r\n    width:100%; height:1px;\r\n    background:var(--copper);\r\n    transform:scaleX(0);\r\n    transform-origin:left;\r\n    transition:transform 0.3s ease;\r\n  }\r\n  .nav-links a:hover, .nav-links a:focus-visible{ color:var(--ink); }\r\n  .nav-links a:hover::after, .nav-links a:focus-visible::after{ transform:scaleX(1); }\r\n  .nav-toggle{ display:none; }\r\n\r\n  @media (max-width:720px){\r\n    .nav-links{ display:none; }\r\n  }\r\n\r\n  \/* ---------- HERO ---------- *\/\r\n  .hero{\r\n    position:relative;\r\n    z-index:1;\r\n    min-height:100svh;\r\n    display:flex;\r\n    align-items:center;\r\n    padding-top:88px;\r\n  }\r\n  .hero-inner{\r\n    max-width:var(--maxw);\r\n    margin:0 auto;\r\n    width:100%;\r\n    padding:0 32px;\r\n    display:grid;\r\n    grid-template-columns:1.05fr 0.95fr;\r\n    align-items:center;\r\n    gap:24px;\r\n  }\r\n  .hero-eyebrow{\r\n    font-family:'IBM Plex Mono', monospace;\r\n    font-size:13px;\r\n    letter-spacing:0.14em;\r\n    text-transform:uppercase;\r\n    color:var(--copper);\r\n    margin-bottom:28px;\r\n    display:flex;\r\n    align-items:center;\r\n    gap:10px;\r\n  }\r\n  .hero-eyebrow::before{\r\n    content:\"$\";\r\n    color:var(--ink-faint);\r\n  }\r\n  .hero-name{\r\n    font-family:'Fraunces', serif;\r\n    font-weight:560;\r\n    font-size:clamp(2.6rem, 6.2vw, 5.4rem);\r\n    line-height:0.98;\r\n    letter-spacing:-0.01em;\r\n    margin:0 0 20px 0;\r\n    color:var(--ink);\r\n  }\r\n  .hero-handle{\r\n    font-family:'Fraunces', serif;\r\n    font-style:italic;\r\n    font-weight:500;\r\n    font-size:clamp(1.3rem, 2.6vw, 1.9rem);\r\n    color:var(--ink-dim);\r\n    margin:0 0 40px 0;\r\n  }\r\n  .cursor{\r\n    display:inline-block;\r\n    width:0.5em;\r\n    height:1em;\r\n    background:var(--copper);\r\n    vertical-align:-0.15em;\r\n    margin-left:4px;\r\n    animation:blink 1.1s steps(1) infinite;\r\n  }\r\n  @keyframes blink{ 0%,49%{opacity:1;} 50%,100%{opacity:0;} }\r\n\r\n  .hero-scroll{\r\n    font-family:'IBM Plex Mono', monospace;\r\n    font-size:11px;\r\n    letter-spacing:0.12em;\r\n    text-transform:uppercase;\r\n    color:var(--ink-faint);\r\n    display:inline-flex;\r\n    align-items:center;\r\n    gap:10px;\r\n  }\r\n  .hero-scroll .line{\r\n    width:28px; height:1px;\r\n    background:var(--ink-faint);\r\n    animation:pulse-line 2s ease-in-out infinite;\r\n  }\r\n  @keyframes pulse-line{ 0%,100%{ transform:scaleX(1); opacity:0.5;} 50%{ transform:scaleX(1.4); opacity:1;} }\r\n\r\n  .hero-photo-wrap{\r\n    position:relative;\r\n    height:min(72svh, 640px);\r\n    display:flex;\r\n    align-items:flex-end;\r\n    justify-content:center;\r\n  }\r\n  .hero-photo-frame{\r\n    position:absolute;\r\n    inset:0;\r\n    border:1px solid var(--line);\r\n  }\r\n  .hero-photo-frame::before, .hero-photo-frame::after{\r\n    content:\"\";\r\n    position:absolute;\r\n    width:14px; height:14px;\r\n    border:1px solid var(--copper-dim);\r\n  }\r\n  .hero-photo-frame::before{ top:-1px; left:-1px; border-right:none; border-bottom:none; }\r\n  .hero-photo-frame::after{ bottom:-1px; right:-1px; border-left:none; border-top:none; }\r\n\r\n  .hero-photo{\r\n    position:relative;\r\n    height:100%;\r\n    width:100%;\r\n    display:flex;\r\n    align-items:flex-end;\r\n    justify-content:center;\r\n    overflow:hidden;\r\n  }\r\n  .hero-photo img{\r\n    height:100%;\r\n    width:auto;\r\n    max-width:100%;\r\n    object-fit:contain;\r\n    object-position:bottom;\r\n    filter:grayscale(1) contrast(1.18) brightness(0.82);\r\n  }\r\n  .hero-photo .tint{\r\n    position:absolute;\r\n    inset:0;\r\n    background:linear-gradient(180deg, rgba(201,138,85,0.16), rgba(10,11,13,0) 55%);\r\n    mix-blend-mode:color;\r\n    pointer-events:none;\r\n  }\r\n  .hero-photo .grain{\r\n    position:absolute; inset:0;\r\n    background:repeating-linear-gradient(0deg, rgba(255,255,255,0.02) 0px, transparent 1px, transparent 2px);\r\n    pointer-events:none;\r\n  }\r\n\r\n  @media (max-width:900px){\r\n    .hero-inner{ grid-template-columns:1fr; }\r\n    .hero-photo-wrap{ height:46svh; order:-1; margin-bottom:24px; }\r\n  }\r\n\r\n  \/* ---------- SECTION SHELL ---------- *\/\r\n  section.block{\r\n    position:relative;\r\n    z-index:1;\r\n    padding:120px 0;\r\n    border-top:1px solid var(--line);\r\n  }\r\n  .eyebrow{\r\n    font-family:'IBM Plex Mono', monospace;\r\n    font-size:12px;\r\n    letter-spacing:0.14em;\r\n    text-transform:uppercase;\r\n    color:var(--copper);\r\n    margin-bottom:20px;\r\n    display:flex;\r\n    align-items:center;\r\n    gap:10px;\r\n  }\r\n  .eyebrow::before{ content:\">\"; color:var(--ink-faint); }\r\n\r\n  .reveal{\r\n    opacity:0;\r\n    transform:translateY(18px);\r\n    transition:opacity 0.7s ease, transform 0.7s ease;\r\n  }\r\n  .reveal.in{ opacity:1; transform:translateY(0); }\r\n\r\n  \/* ---------- ABOUT ---------- *\/\r\n  .about-grid{\r\n    display:grid;\r\n    grid-template-columns:1.1fr 0.9fr;\r\n    gap:64px;\r\n    align-items:start;\r\n  }\r\n  .about-text p{\r\n    font-size:clamp(1.05rem, 1.6vw, 1.28rem);\r\n    line-height:1.65;\r\n    color:var(--ink-dim);\r\n    margin:0 0 26px 0;\r\n    max-width:52ch;\r\n  }\r\n  .about-text p strong{ color:var(--ink); font-weight:500; }\r\n  .about-text .location{\r\n    font-family:'IBM Plex Mono', monospace;\r\n    font-size:12.5px;\r\n    letter-spacing:0.06em;\r\n    color:var(--ink-faint);\r\n    text-transform:uppercase;\r\n    margin-top:36px;\r\n  }\r\n\r\n  .logo-panel-label{\r\n    font-family:'IBM Plex Mono', monospace;\r\n    font-size:11px;\r\n    letter-spacing:0.12em;\r\n    text-transform:uppercase;\r\n    color:var(--ink-faint);\r\n    margin-bottom:22px;\r\n  }\r\n  .logo-marquee{\r\n    position:relative;\r\n    overflow:hidden;\r\n    border-top:1px solid var(--line);\r\n    border-bottom:1px solid var(--line);\r\n    padding:28px 0;\r\n    mask-image: linear-gradient(90deg, transparent, black 12%, black 88%, transparent);\r\n  }\r\n  .logo-track{\r\n    display:flex;\r\n    gap:48px;\r\n    width:max-content;\r\n    animation:scroll-left 26s linear infinite;\r\n  }\r\n  @keyframes scroll-left{\r\n    from{ transform:translateX(0); }\r\n    to{ transform:translateX(-50%); }\r\n  }\r\n  .logo-item{\r\n    font-family:'Fraunces', serif;\r\n    font-weight:500;\r\n    font-size:19px;\r\n    color:var(--ink-faint);\r\n    white-space:nowrap;\r\n    letter-spacing:0.01em;\r\n  }\r\n\r\n  @media (max-width:900px){\r\n    .about-grid{ grid-template-columns:1fr; gap:48px; }\r\n  }\r\n\r\n  \/* ---------- WORK ---------- *\/\r\n  .work-grid{\r\n    display:grid;\r\n    grid-template-columns:1fr 1fr;\r\n    gap:1px;\r\n    background:var(--line);\r\n    border:1px solid var(--line);\r\n  }\r\n  .work-card{\r\n    background:var(--bg);\r\n    padding:44px 40px;\r\n    display:flex;\r\n    flex-direction:column;\r\n    gap:28px;\r\n  }\r\n  .work-card-head{\r\n    display:flex;\r\n    align-items:baseline;\r\n    justify-content:space-between;\r\n    gap:16px;\r\n  }\r\n  .work-name{\r\n    font-family:'Fraunces', serif;\r\n    font-weight:560;\r\n    font-size:1.65rem;\r\n    color:var(--ink);\r\n  }\r\n  .work-tag{\r\n    font-family:'IBM Plex Mono', monospace;\r\n    font-size:10.5px;\r\n    letter-spacing:0.1em;\r\n    text-transform:uppercase;\r\n    color:var(--ink-faint);\r\n    border:1px solid var(--line);\r\n    padding:4px 9px;\r\n  }\r\n  .work-tag.live{ color:var(--copper); border-color:var(--copper-dim); }\r\n\r\n  .stat-row{\r\n    display:flex;\r\n    gap:40px;\r\n    flex-wrap:wrap;\r\n  }\r\n  .stat{\r\n    display:flex;\r\n    flex-direction:column;\r\n    gap:4px;\r\n  }\r\n  .stat-num{\r\n    font-family:'Fraunces', serif;\r\n    font-weight:560;\r\n    font-size:clamp(1.9rem, 3vw, 2.6rem);\r\n    color:var(--ink);\r\n    line-height:1;\r\n    font-variant-numeric:tabular-nums;\r\n  }\r\n  .stat-num .copper-suffix{ color:var(--copper); }\r\n  .stat-label{\r\n    font-family:'IBM Plex Mono', monospace;\r\n    font-size:11px;\r\n    letter-spacing:0.08em;\r\n    text-transform:uppercase;\r\n    color:var(--ink-faint);\r\n  }\r\n\r\n  .work-desc{\r\n    font-size:0.98rem;\r\n    line-height:1.6;\r\n    color:var(--ink-dim);\r\n    margin:0;\r\n  }\r\n  .work-link{\r\n    margin-top:auto;\r\n    font-family:'IBM Plex Mono', monospace;\r\n    font-size:12.5px;\r\n    letter-spacing:0.04em;\r\n    color:var(--ink);\r\n    display:inline-flex;\r\n    align-items:center;\r\n    gap:8px;\r\n    width:fit-content;\r\n    position:relative;\r\n    padding-bottom:2px;\r\n  }\r\n  .work-link::after{\r\n    content:\"\";\r\n    position:absolute;\r\n    left:0; bottom:0;\r\n    width:100%; height:1px;\r\n    background:var(--copper);\r\n    transform:scaleX(0);\r\n    transform-origin:left;\r\n    transition:transform 0.3s ease;\r\n  }\r\n  .work-link:hover::after, .work-link:focus-visible::after{ transform:scaleX(1); }\r\n  .work-link .arrow{ transition:transform 0.3s ease; color:var(--copper); }\r\n  .work-link:hover .arrow{ transform:translateX(3px); }\r\n\r\n  .work-progress{\r\n    font-family:'IBM Plex Mono', monospace;\r\n    font-size:12.5px;\r\n    color:var(--ink-faint);\r\n  }\r\n\r\n  @media (max-width:760px){\r\n    .work-grid{ grid-template-columns:1fr; }\r\n  }\r\n\r\n\r\n  \/* ---------- CONTACT ---------- *\/\r\n  .contact-list{\r\n    display:flex;\r\n    flex-direction:column;\r\n    gap:0;\r\n    max-width:720px;\r\n  }\r\n  .contact-row{\r\n    display:flex;\r\n    align-items:baseline;\r\n    justify-content:space-between;\r\n    gap:24px;\r\n    padding:26px 0;\r\n    border-bottom:1px solid var(--line);\r\n    flex-wrap:wrap;\r\n  }\r\n  .contact-row:first-child{ border-top:1px solid var(--line); }\r\n  .contact-label{\r\n    font-family:'IBM Plex Mono', monospace;\r\n    font-size:12px;\r\n    letter-spacing:0.08em;\r\n    text-transform:uppercase;\r\n    color:var(--ink-faint);\r\n  }\r\n  .contact-value{\r\n    font-family:'Fraunces', serif;\r\n    font-size:1.25rem;\r\n    color:var(--ink);\r\n    position:relative;\r\n    padding-bottom:2px;\r\n  }\r\n  .contact-value::after{\r\n    content:\"\";\r\n    position:absolute;\r\n    left:0; bottom:0;\r\n    width:100%; height:1px;\r\n    background:var(--copper);\r\n    transform:scaleX(0);\r\n    transform-origin:left;\r\n    transition:transform 0.3s ease;\r\n  }\r\n  .contact-value:hover::after, .contact-value:focus-visible::after{ transform:scaleX(1); }\r\n\r\n  \/* ---------- FOOTER ---------- *\/\r\n  footer{\r\n    position:relative; z-index:1;\r\n    border-top:1px solid var(--line);\r\n    padding:32px 0 48px;\r\n  }\r\n  .footer-inner{\r\n    display:flex;\r\n    justify-content:space-between;\r\n    align-items:center;\r\n    flex-wrap:wrap;\r\n    gap:12px;\r\n  }\r\n  .footer-inner .mono{\r\n    font-size:11.5px;\r\n    letter-spacing:0.06em;\r\n    color:var(--ink-faint);\r\n  }\r\n\r\n  h2.section-title{\r\n    font-family:'Fraunces', serif;\r\n    font-weight:560;\r\n    font-size:clamp(1.7rem, 3vw, 2.3rem);\r\n    margin:0 0 40px 0;\r\n    color:var(--ink);\r\n  }\r\n\r\n\r\n  \/* --- layout fixes --- *\/\r\n  .about-grid > *{ min-width:0; }\r\n  .about-text{ min-width:0; }\r\n  .work-card{ min-width:0; }\r\n  .logo-marquee{ max-width:100%; }\r\n  .logo-track{ will-change:transform; }\r\n  .hero-inner > *{ min-width:0; }\r\n\r\n<\/style>\r\n\r\n\r\n<div class=\"grid-texture\" aria-hidden=\"true\"><\/div>\r\n\r\n<nav class=\"nav\">\r\n  <div class=\"nav-inner\">\r\n    <div class=\"nav-name\">ANDY<span class=\"dot\">\u00b7<\/span>MARGS<\/div>\r\n    <ul class=\"nav-links\">\r\n      <li><a href=\"#about\">About<\/a><\/li>\r\n      <li><a href=\"#work\">Work<\/a><\/li>\r\n      <li><a href=\"#contact\">Contact<\/a><\/li>\r\n    <\/ul>\r\n  <\/div>\r\n<\/nav>\r\n\r\n<!-- HERO -->\r\n<section class=\"hero\">\r\n  <div class=\"hero-inner\">\r\n    <div>\r\n      <div class=\"hero-eyebrow\">Media Founder &amp; AI Builder<\/div>\r\n      <h1 class=\"hero-name\">Andr\u00e9s<br>Marulanda<span class=\"cursor\" aria-hidden=\"true\"><\/span><\/h1>\r\n      <p class=\"hero-handle\">(\"Andy Margs\")<\/p>\r\n      <div class=\"hero-scroll\"><span class=\"line\"><\/span> Scroll<\/div>\r\n    <\/div>\r\n    <div class=\"hero-photo-wrap\">\r\n      <div class=\"hero-photo-frame\" aria-hidden=\"true\"><\/div>\r\n      <div class=\"hero-photo\">\r\n        <img fetchpriority=\"high\" decoding=\"async\" src=\"https:\/\/andymargs.com\/wp-content\/uploads\/2026\/08\/andy-headshot-transparent.png\" width=\"1122\" height=\"1402\" alt=\"Portrait of Andr\u00e9s Marulanda\">\r\n        <div class=\"tint\" aria-hidden=\"true\"><\/div>\r\n        <div class=\"grain\" aria-hidden=\"true\"><\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<!-- ABOUT -->\r\n<section class=\"block\" id=\"about\">\r\n  <div class=\"wrap\">\r\n    <div class=\"eyebrow\">About<\/div>\r\n    <div class=\"about-grid\">\r\n      <div class=\"about-text reveal\">\r\n        <p>I'm the founder of <strong>QPASA<\/strong>, a media network reaching <strong>5.1M+ followers<\/strong> and <strong>400M+ monthly impressions<\/strong> across eight platforms. I'm building <strong>VitalHacking<\/strong> next, an AI-powered longevity platform.<\/p>\r\n        <p>My background is in product design and engineering \u2014 I'm a former IBMer, with media and fintech projects that led me to found QPASA.<\/p>\r\n        <div class=\"location mono\">Based in Toronto, Canada<\/div>\r\n      <\/div>\r\n      <div class=\"reveal\">\r\n        <div class=\"logo-panel-label mono\">Background includes<\/div>\r\n        <div class=\"logo-marquee\">\r\n          <div class=\"logo-track\" id=\"logoTrack\">\r\n            <span class=\"logo-item\">IBM<\/span>\r\n            <span class=\"logo-item\">Discovery Channel<\/span>\r\n            <span class=\"logo-item\">TSN<\/span>\r\n            <span class=\"logo-item\">CTV<\/span>\r\n            <span class=\"logo-item\">Canadian Tire<\/span>\r\n            <span class=\"logo-item\">RBC<\/span>\r\n            <span class=\"logo-item\">Sun Life<\/span>\r\n            <!-- duplicate for seamless loop -->\r\n            <span class=\"logo-item\">IBM<\/span>\r\n            <span class=\"logo-item\">Discovery Channel<\/span>\r\n            <span class=\"logo-item\">TSN<\/span>\r\n            <span class=\"logo-item\">CTV<\/span>\r\n            <span class=\"logo-item\">Canadian Tire<\/span>\r\n            <span class=\"logo-item\">RBC<\/span>\r\n            <span class=\"logo-item\">Sun Life<\/span>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<!-- WORK -->\r\n<section class=\"block\" id=\"work\">\r\n  <div class=\"wrap\">\r\n    <div class=\"eyebrow\">Work<\/div>\r\n    <h2 class=\"section-title reveal\">What I've built, and what's next.<\/h2>\r\n    <div class=\"work-grid reveal\">\r\n      <div class=\"work-card\">\r\n        <div class=\"work-card-head\">\r\n          <div class=\"work-name\">QPASA<\/div>\r\n          <div class=\"work-tag live\">Live<\/div>\r\n        <\/div>\r\n        <div class=\"stat-row\">\r\n          <div class=\"stat\">\r\n            <div class=\"stat-num\" data-count=\"5.1\" data-suffix=\"M+\">0<\/div>\r\n            <div class=\"stat-label\">Followers<\/div>\r\n          <\/div>\r\n          <div class=\"stat\">\r\n            <div class=\"stat-num\" data-count=\"400\" data-suffix=\"M+\">0<\/div>\r\n            <div class=\"stat-label\">Monthly reach<\/div>\r\n          <\/div>\r\n        <\/div>\r\n        <p class=\"work-desc\">Media network across 8 platforms.<\/p>\r\n        <a class=\"work-link\" href=\"https:\/\/qpasa.com\" target=\"_blank\" rel=\"noopener\">qpasa.com <span class=\"arrow\">\u2192<\/span><\/a>\r\n      <\/div>\r\n      <div class=\"work-card\">\r\n        <div class=\"work-card-head\">\r\n          <div class=\"work-name\">VitalHacking<\/div>\r\n          <div class=\"work-tag\">In development<\/div>\r\n        <\/div>\r\n        <p class=\"work-desc\">AI-powered longevity platform \u2014 currently in development.<\/p>\r\n        <div class=\"work-progress\">$ status: building<span class=\"cursor\" aria-hidden=\"true\" style=\"height:0.9em;\"><\/span><\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<!-- CONTACT -->\r\n<section class=\"block\" id=\"contact\">\r\n  <div class=\"wrap\">\r\n    <div class=\"eyebrow\">Contact<\/div>\r\n    <h2 class=\"section-title reveal\">Get in touch.<\/h2>\r\n    <div class=\"contact-list reveal\">\r\n      <div class=\"contact-row\">\r\n        <div class=\"contact-label mono\">Business inquiries<\/div>\r\n        <a class=\"contact-value\" href=\"mailto:andy@qpasa.com\">andy@qpasa.com<\/a>\r\n      <\/div>\r\n      <div class=\"contact-row\">\r\n        <div class=\"contact-label mono\">Advertising &amp; partnerships<\/div>\r\n        <a class=\"contact-value\" href=\"https:\/\/qpasamedia.com\" target=\"_blank\" rel=\"noopener\">qpasamedia.com<\/a>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<footer>\r\n  <div class=\"wrap footer-inner\">\r\n    <div class=\"mono\">\u00a9 2026 Andr\u00e9s Marulanda<\/div>\r\n    <div class=\"mono\">Toronto, Canada<\/div>\r\n  <\/div>\r\n<\/footer>\r\n\r\n<script>\r\n  \/\/ scroll reveal\r\n  const revealEls = document.querySelectorAll('.reveal');\r\n  const io = new IntersectionObserver((entries)=>{\r\n    entries.forEach(e=>{\r\n      if(e.isIntersecting){ e.target.classList.add('in'); io.unobserve(e.target); }\r\n    });\r\n  }, { threshold:0.15 });\r\n  revealEls.forEach(el=>io.observe(el));\r\n\r\n  \/\/ animated counters\r\n  const prefersReduced = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n  const counters = document.querySelectorAll('.stat-num');\r\n  const countIO = new IntersectionObserver((entries)=>{\r\n    entries.forEach(entry=>{\r\n      if(!entry.isIntersecting) return;\r\n      const el = entry.target;\r\n      const target = parseFloat(el.dataset.count);\r\n      const suffix = el.dataset.suffix || '';\r\n      const isDecimal = el.dataset.count.includes('.');\r\n\r\n      if(prefersReduced){\r\n        el.textContent = target + suffix;\r\n        countIO.unobserve(el);\r\n        return;\r\n      }\r\n\r\n      const duration = 1400;\r\n      const start = performance.now();\r\n      function tick(now){\r\n        const p = Math.min((now - start) \/ duration, 1);\r\n        const eased = 1 - Math.pow(1 - p, 3);\r\n        const val = target * eased;\r\n        el.innerHTML = (isDecimal ? val.toFixed(1) : Math.round(val)) + '<span class=\"copper-suffix\">' + suffix + '<\/span>';\r\n        if(p < 1){ requestAnimationFrame(tick); }\r\n      }\r\n      requestAnimationFrame(tick);\r\n      countIO.unobserve(el);\r\n    });\r\n  }, { threshold:0.4 });\r\n  counters.forEach(el=>countIO.observe(el));\r\n\r\n  if(prefersReduced){\r\n    document.getElementById('logoTrack').style.animation = 'none';\r\n  }\r\n<\/script>\r\n\r\n\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-21","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.2 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Home - Andy Margs<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/andymargs.com\/?page_id=21\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Home - Andy Margs\" \/>\n<meta property=\"og:url\" content=\"https:\/\/andymargs.com\/?page_id=21\" \/>\n<meta property=\"og:site_name\" content=\"Andy Margs\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/andymargs.com\\\/?page_id=21\",\"url\":\"https:\\\/\\\/andymargs.com\\\/?page_id=21\",\"name\":\"Home - Andy Margs\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/andymargs.com\\\/#website\"},\"datePublished\":\"2026-08-06T23:51:32+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/andymargs.com\\\/?page_id=21#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/andymargs.com\\\/?page_id=21\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/andymargs.com\\\/?page_id=21#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/andymargs.com\\\/?page_id=21\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Home\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/andymargs.com\\\/#website\",\"url\":\"https:\\\/\\\/andymargs.com\\\/\",\"name\":\"Andy Margs\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/andymargs.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Home - Andy Margs","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/andymargs.com\/?page_id=21","og_locale":"en_US","og_type":"article","og_title":"Home - Andy Margs","og_url":"https:\/\/andymargs.com\/?page_id=21","og_site_name":"Andy Margs","twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/andymargs.com\/?page_id=21","url":"https:\/\/andymargs.com\/?page_id=21","name":"Home - Andy Margs","isPartOf":{"@id":"https:\/\/andymargs.com\/#website"},"datePublished":"2026-08-06T23:51:32+00:00","breadcrumb":{"@id":"https:\/\/andymargs.com\/?page_id=21#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/andymargs.com\/?page_id=21"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/andymargs.com\/?page_id=21#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/andymargs.com\/?page_id=21"},{"@type":"ListItem","position":2,"name":"Home"}]},{"@type":"WebSite","@id":"https:\/\/andymargs.com\/#website","url":"https:\/\/andymargs.com\/","name":"Andy Margs","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/andymargs.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"}]}},"_links":{"self":[{"href":"https:\/\/andymargs.com\/index.php?rest_route=\/wp\/v2\/pages\/21","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/andymargs.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/andymargs.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/andymargs.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/andymargs.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=21"}],"version-history":[{"count":1,"href":"https:\/\/andymargs.com\/index.php?rest_route=\/wp\/v2\/pages\/21\/revisions"}],"predecessor-version":[{"id":23,"href":"https:\/\/andymargs.com\/index.php?rest_route=\/wp\/v2\/pages\/21\/revisions\/23"}],"wp:attachment":[{"href":"https:\/\/andymargs.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=21"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}