<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title></title>
    <meta name="description" content="" />
    <meta name="author" content="Felipe Gonzalez" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />

    <!-- Stylesheets -->
    <script type="text/javascript" nonce="31592d7d6ef74ea0969d7778dbf" src="//local.adguard.org?ts=1749479819232&amp;type=content-script&amp;dmn=poshweb-pro.web.app&amp;url=https%3A%2F%2Fposhweb-pro.web.app%2Fcss%2Fbuttons.css&amp;app=com.google.Chrome&amp;css=3&amp;js=1&amp;rel=1&amp;rji=1&amp;sbe=1&amp;stealth=1&amp;st-ua=TW96aWxsYS81LjAgKE1hY2ludG9zaDsgSW50ZWwgTWFjIE9TIFggMTBfMTVfNykgQXBwbGVXZWJLaXQvNTM3LjM2IChLSFRNTCwgbGlrZSBHZWNrbykgQ2hyb21lLzEzNy4wLjAuMCBTYWZhcmkvNTM3LjM2&amp;st-ch-brands=W3siYnJhbmQiOiJHb29nbGUgQ2hyb21lIiwidmVyc2lvbiI6IjEzNyJ9LCB7ImJyYW5kIjoiQ2hyb21pdW0iLCJ2ZXJzaW9uIjoiMTM3In0sIHsiYnJhbmQiOiJOb3RcL0EpQnJhbmQiLCJ2ZXJzaW9uIjoiMjQifV0=&amp;st-ch-mobile=ZmFsc2U=&amp;st-ch-platform=bWFjT1M=&amp;st-wrtc&amp;st-push&amp;st-loc&amp;st-java&amp;st-ref=aHR0cHM6Ly9wb3Nod2ViLXByby53ZWIuYXBwLw==&amp;st-dnt&amp;st-1pcttl=4320"></script>
<script type="text/javascript" nonce="31592d7d6ef74ea0969d7778dbf" src="//local.adguard.org?ts=1749479819232&amp;name=Web%20of%20Trust&amp;name=AdGuard%20Popup%20Blocker&amp;name=AdGuard%20Extra&amp;type=user-script"></script><link rel="stylesheet" href="/css/style.css" />
    <link rel="stylesheet" href="/css/nav.css" />
    <link rel="stylesheet" href="/css/footer.css" />
    <link rel="stylesheet" href="/css/slider.css" />
    <link rel="stylesheet" href="/css/splash.css" />
    <link rel="stylesheet" href="/css/buttons.css" />
    <link rel="stylesheet" href="/css/gallery.css" />

    <!-- Favicons -->
    <link rel="icon" href="/favicon-light.svg" type="image/svg+xml" id="favicon-svg" />
    <link rel="icon" href="/favicon-light.ico" type="image/x-icon" id="favicon-ico" />
    <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />

    <!-- Web App Manifest -->
    <link rel="manifest" href="/manifest.json" />

    <!-- Theme Colors -->
    <meta name="theme-color" content="#ffffff" media="(prefers-color-scheme: light)" />
    <meta name="theme-color" content="#000000" media="(prefers-color-scheme: dark)" />
    <meta name="msapplication-navbutton-color" content="#ffffff" />

    <!-- PWA and Apple Web App -->
    <meta name="mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-title" content="Posh Web" />
    <meta name="apple-touch-fullscreen" content="yes" />

    <!-- Open Graph (Facebook & Social Sharing) -->
    <meta property="og:type" content="website" />
    <meta property="og:image" content="/og.jpg" id="ogImage" />
    <meta property="og:image:width" content="1200" />
    <meta property="og:image:height" content="630" />
    <meta property="og:title" content="Posh Web" id="ogTitle" />
    <meta property="og:description" content="Elegant and Modern Web Design" />
    <meta property="og:url" content="https://poshweb.pro/" />

    <!-- SEO and Indexing -->
    <meta name="robots" content="index, follow" />
    <link rel="canonical" href="https://poshweb.pro/" />
  </head>

  <body class="no-animation">
    <div id="splash-screen">
      <img src="/assets/pwa/posh-animation-light.svg" alt="Splash Screen" id="splash-image" />
    </div>
    <nav class="top-nav">
      <div class="navbar wrapper">
        <input type="checkbox" name="h-menu" id="h-menu" aria-label="Mobile Menu Button" />
        <label for="h-menu" class="mobile-nav-overlay"></label>
        <div class="menu">
          <span class="line line1"></span>
          <span class="line line2"></span>
          <span class="line line3"></span>
        </div>
        <a href="/" class="nav-logo" aria-label="Posh Web Logo">
          <svg viewBox="0 0 1176 283" fill="none" xmlns="http://www.w3.org/2000/svg">
            <style>
              /* Chain swinging animation */
              @keyframes swing {
                0% {
                  transform: rotate(15deg);
                }
                50% {
                  transform: rotate(-15deg);
                }
                100% {
                  transform: rotate(15deg);
                }
              }

              svg:hover .pendulum-chain {
                transform-origin: 295px 173px; /* Pivot point at the top of the chain */
                animation: swing 1.2s ease-in-out infinite alternate;
              }

              /* Hat bobbing animation */
              @keyframes bob {
                0% {
                  transform: translateY(4px);
                }
                50% {
                  transform: translateY(-4px);
                }
                100% {
                  transform: translateY(4px);
                }
              }

              svg:hover .bobbing-hat {
                animation: bob 1.5s ease-in-out infinite; /* Smooth up-and-down motion */
              }
            </style>
            <g id="poshweb-logo">
              <g id="web">
                <path
                  d="M718.472 216.943L669.632 91.975C668.522 89.2 667.258 87.0725 665.839 85.5925C664.483 84.1125 662.571 83.0333 660.104 82.355C657.638 81.615 654.246 81.0908 649.929 80.7825V74.1225H725.317V80.7825C719.397 81.2142 715.049 81.7692 712.274 82.4475C709.561 83.1258 707.988 84.2667 707.557 85.87C707.125 87.4733 707.402 89.8783 708.389 93.085L732.994 168.473H734.104L757.322 107.885L751.124 91.975C750.014 89.2 748.75 87.0725 747.332 85.5925C745.913 84.1125 743.971 83.0333 741.504 82.355C739.038 81.615 735.646 81.0908 731.329 80.7825V74.1225H806.717V80.7825C801.105 81.0292 796.881 81.5533 794.044 82.355C791.269 83.1567 789.604 84.39 789.049 86.055C788.494 87.72 788.772 90.0633 789.882 93.085L814.487 168.473L816.707 168.843L841.497 100.855C843.162 96.3533 843.748 92.8075 843.254 90.2175C842.761 87.5658 840.911 85.5308 837.704 84.1125C834.498 82.6942 829.626 81.5842 823.089 80.7825V74.1225H879.699V80.7825C874.396 81.5842 870.203 82.6325 867.119 83.9275C864.036 85.2225 861.538 87.1958 859.627 89.8475C857.777 92.4375 855.896 96.1992 853.984 101.133L808.844 216.943H799.964L763.612 124.073L727.259 216.943H718.472Z"
                  fill="#1A69AE" />
                <path d="M900.83 215V208.248L916.462 204.64V84.205L900.83 80.7825V74.1225H1012.85L1016.27 114.36H1008.68C1007.08 109.55 1005.11 104.555 1002.76 99.375C1000.42 94.195 997.677 89.2 994.532 84.39H947.912V204.548H993.422C997.431 199.183 1000.67 193.787 1003.13 188.36C1005.6 182.933 1007.94 177.538 1010.16 172.173H1019.69L1011.92 215H900.83ZM978.9 166.068C978.16 162.738 977.142 159.315 975.847 155.8C974.552 152.285 972.918 148.832 970.945 145.44H944.952V135.543H970.945C973.041 132.089 974.706 128.636 975.94 125.183C977.173 121.668 978.16 118.245 978.9 114.915H986.577V166.068H978.9Z" fill="#1A69AE" />
                <path
                  d="M1053.2 215V208.248L1068.83 204.178V84.6675L1053.2 80.7825V74.1225H1114.9C1124.15 74.1225 1131.83 74.7392 1137.93 75.9725C1144.1 77.1442 1149.25 78.9942 1153.38 81.5225C1158.13 84.5442 1161.8 88.3983 1164.39 93.085C1167.04 97.7717 1168.36 102.828 1168.36 108.255C1168.36 115.655 1165.4 121.945 1159.48 127.125C1153.56 132.243 1145.18 135.758 1134.32 137.67V138.41C1142.53 139.212 1149.71 141.37 1155.88 144.885C1162.04 148.4 1166.82 152.963 1170.21 158.575C1173.67 164.125 1175.39 170.477 1175.39 177.63C1175.39 183.242 1174.16 188.483 1171.69 193.355C1169.29 198.227 1165.99 202.235 1161.8 205.38C1157.11 208.833 1151.44 211.3 1144.78 212.78C1138.12 214.26 1129.27 215 1118.23 215H1053.2ZM1114.34 205.288C1123.41 205.288 1130.1 202.944 1134.42 198.258C1138.8 193.509 1140.98 186.109 1140.98 176.058C1140.98 165.328 1138.21 157.465 1132.66 152.47C1127.11 147.413 1118.54 144.885 1106.94 144.885H1100.28V194.373C1100.28 198.689 1101.27 201.588 1103.24 203.068C1105.28 204.548 1108.98 205.288 1114.34 205.288ZM1100.28 134.988H1102.32C1104.48 134.988 1106.33 134.957 1107.87 134.895C1109.47 134.772 1110.86 134.618 1112.03 134.433C1119.37 133.693 1125.01 131.164 1128.96 126.848C1132.91 122.469 1134.88 116.518 1134.88 108.995C1134.88 104.678 1134.2 100.948 1132.84 97.8025C1131.55 94.6575 1129.67 92.0983 1127.2 90.125C1124.55 87.9667 1121.25 86.425 1117.3 85.5C1113.36 84.5133 1108.79 84.02 1103.61 84.02H1100.28V134.988Z"
                  fill="#1A69AE" />
              </g>
              <g id="posh">
                <g id="P SHWEB">
                  <path d="M0.79834 215V208.247L16.4308 204.177V84.6675L0.79834 80.7825V74.1225H61.8483C72.825 74.1225 82.3217 75.8183 90.3383 79.21C98.355 82.6017 104.553 87.4117 108.931 93.64C113.309 99.8067 115.498 107.176 115.498 115.747C115.498 128.697 110.565 138.718 100.698 145.81C90.8317 152.902 76.8642 156.447 58.7958 156.447H47.8808V204.177L70.7283 208.247V215H0.79834ZM47.8808 146.55H49.1758C54.8492 146.55 59.69 145.933 63.6983 144.7C67.7067 143.467 71.0983 141.586 73.8733 139.057C76.7717 136.344 78.8683 133.014 80.1633 129.067C81.4583 125.059 82.1058 120.095 82.1058 114.175C82.1058 108.563 81.52 103.784 80.3483 99.8375C79.1767 95.8908 77.45 92.7767 75.1683 90.495C70.8517 86.1783 63.2667 84.02 52.4133 84.02H47.8808V146.55Z" fill="black" />
                  <path
                    d="M387.834 216.665C382.161 216.665 376.642 215.925 371.277 214.445C365.912 212.965 360.146 210.652 353.979 207.507L347.597 215H341.862L338.254 168.102L345.932 166.9C349.878 180.652 355.089 190.611 361.564 196.777C368.101 202.944 376.765 206.027 387.557 206.027C395.265 206.027 401.401 204.177 405.964 200.477C410.589 196.777 412.902 191.69 412.902 185.215C412.902 181.33 411.268 177.722 407.999 174.392C404.793 171.001 399.243 167.393 391.349 163.57L376.457 156.17C364.37 150.188 355.49 143.559 349.817 136.282C344.143 129.006 341.307 120.527 341.307 110.845C341.307 103.383 343.373 96.7542 347.504 90.9575C351.636 85.0992 357.217 80.505 364.247 77.175C371.338 73.845 379.355 72.18 388.297 72.18C400.815 72.18 411.545 75.9725 420.487 83.5575L424.834 73.845H430.939L432.697 114.36H424.649C421.628 103.938 417.188 96.1067 411.329 90.865C405.533 85.6233 398.163 83.0025 389.222 83.0025C382.932 83.0025 378.029 84.5442 374.514 87.6275C370.999 90.7108 369.242 94.9658 369.242 100.392C369.242 104.586 370.814 108.347 373.959 111.677C377.104 114.946 382.562 118.553 390.332 122.5L404.947 129.992C416.54 135.912 424.865 142.418 429.922 149.51C435.04 156.602 437.599 165.112 437.599 175.04C437.599 182.933 435.41 190.025 431.032 196.315C426.653 202.605 420.703 207.569 413.179 211.207C405.656 214.846 397.208 216.665 387.834 216.665Z"
                    fill="black" />
                  <path d="M564.259 215V208.247L579.799 204.362V84.39L564.259 80.7825V74.1225H626.789V80.7825L611.342 84.39V204.362L626.789 208.247V215H564.259ZM473.054 215V208.247L488.687 204.362V84.39L473.054 80.7825V74.1225H535.492V80.7825L520.137 84.39V204.362L535.492 208.247V215H473.054ZM502.192 145.902V135.357H598.114V145.902H502.192Z" fill="black" />
                </g>
                <path
                  id="o"
                  fill-rule="evenodd"
                  clip-rule="evenodd"
                  d="M290.716 201.362C290.806 201.112 290.894 200.862 290.982 200.611C284.984 205.244 277.463 208 269.298 208C264.443 208 259.815 207.025 255.601 205.261C255.528 205.534 255.455 205.807 255.381 206.08C253.963 211.445 251.928 216.317 249.276 220.695C246.624 225.073 243.233 228.588 239.101 231.24C234.969 233.83 229.943 235.125 224.023 235.125C218.103 235.125 213.078 233.83 208.946 231.24C204.876 228.588 201.515 225.073 198.863 220.695C196.273 216.317 194.238 211.445 192.758 206.08C191.278 200.653 190.261 195.103 189.706 189.43C189.151 183.757 188.873 178.392 188.873 173.335C188.873 168.278 189.151 162.975 189.706 157.425C189.981 154.638 190.371 151.881 190.875 149.155C178.533 146.959 167.898 143.59 159.839 139.402C158.956 141.313 158.151 143.281 157.423 145.307C154.34 154.064 152.798 163.407 152.798 173.335C152.798 183.263 154.34 192.606 157.423 201.362C160.568 210.057 165.163 217.735 171.206 224.395C177.311 231.055 184.773 236.297 193.591 240.12C202.409 243.882 212.553 245.762 224.023 245.762C235.493 245.762 245.668 243.882 254.548 240.12C263.428 236.297 270.89 231.055 276.933 224.395C283.038 217.735 287.633 210.057 290.716 201.362Z"
                  fill="black" />
              </g>
              <g id="posh-animation">
                <g id="hat" class="bobbing-hat">
                  <path id="Vector68" d="M297.495 91.1352L152.249 90.64C138.476 84.6854 138.071 121.922 152.497 134.219C185.03 161.951 272.783 153.532 298.687 134.219C314.484 122.441 312.854 85.1806 297.495 91.1352Z" fill="white" />
                  <path id="Vector 67" d="M297.98 103.123C260.17 127.719 192.953 127.719 153.044 103.123C139.39 97.1103 136.766 113.318 153.044 123C214.799 159.732 275.4 138.304 297.98 123C314.258 111.967 313.208 97.1103 297.98 103.123Z" fill="#1A69AE" />
                  <path id="Vector" d="M288.8 95.5083C288.8 95.5083 288.8 22.2899 288.8 22.018C288.8 12.0716 260.366 3.99994 225.296 3.99994C190.235 3.99994 161.8 12.0716 161.8 22.018C161.8 22.2899 161.8 95.5083 161.8 95.5083C169.873 103.298 195.223 111 225.296 111C255.37 111 280.72 103.298 288.8 95.5083Z" fill="#1A69AE" />
                </g>
                <g id="monocle">
                  <g id="chain" class="pendulum-chain">
                    <circle id="Ellipse 131" cx="298.798" cy="275" r="8" fill="#1A69AE" />
                    <rect id="Rectangle 334" x="295.798" y="173" width="6" height="102" fill="#1A69AE" />
                  </g>
                  <circle id="Ellipse 132" cx="294.798" cy="173" r="7" fill="#1A69AE" />
                  <circle id="Ellipse 133" cx="269.433" cy="172.635" r="25.3652" fill="#1A69AE" />
                </g>
              </g>
            </g>
          </svg>
        </a>
        <ul class="nav-links">
          <li>
            <a class="nav-link" href="/">
              <span>HOME</span>
            </a>
          </li>
          <li>
            <a class="nav-link" href="/services">
              <span>SERVICES</span>
            </a>
          </li>
          <li>
            <a class="nav-link" href="/portfolio">
              <span>PORTFOLIO</span>
            </a>
          </li>
          <li>
            <a class="nav-link" href="/about">
              <span>ABOUT</span>
            </a>
          </li>
        </ul>
        <a class="nav-btn" href="/contact">
          <span><img src="/assets/icons/whatsapp-blue.png" alt="contact" width="40" height="40" /></span>
        </a>
      </div>
    </nav>
    <nav class="bottom-nav">
      <ul class="nav-links">
        <li>
          <a class="nav-link" href="/">
            <img class="nav-link-icon inactive" src="/assets/icons/home.png" alt="home icon" width="35" height="35" />
            <img class="nav-link-icon active" src="/assets/icons/home-active.png" alt="active home icon" width="35" height="35" />
            <span>Home</span>
          </a>
        </li>
        <li>
          <a class="nav-link" href="/services">
            <img class="nav-link-icon inactive" src="/assets/icons/services.png" alt="dev icon" width="35" height="35" />
            <img class="nav-link-icon active" src="/assets/icons/services-active.png" alt="active dev icon" width="35" height="35" />
            <span>Services</span>
          </a>
        </li>
        <li>
          <a class="nav-link" href="/portfolio">
            <img class="nav-link-icon inactive" src="/assets/icons/portfolio.png" alt="design icon" width="35" height="35" />
            <img class="nav-link-icon active" src="/assets/icons/portfolio-active.png" alt="active design icon" width="35" height="35" />
            <span>Portfolio</span>
          </a>
        </li>
        <li>
          <a class="nav-link" href="/about">
            <img class="nav-link-icon inactive" src="/assets/icons/about.png" alt="about icon" width="35" height="35" />
            <img class="nav-link-icon active" src="/assets/icons/about-active.png" alt="active about icon" width="35" height="35" />
            <span>About</span>
          </a>
        </li>
      </ul>
    </nav>
    <main id="content"></main>
    <footer id="footer"></footer>
    <script src="/js/app.js"></script>
    <script>
      window.addEventListener("load", () => {
        document.body.classList.remove("no-animation");
      });
    </script>
    <script src="/js/animatescroll.js"></script>
    <script>
      function isAndroid() {
        return /android/i.test(navigator.userAgent) || /wv/i.test(navigator.userAgent);
      }

      document.addEventListener("DOMContentLoaded", () => {
        const splashScreen = document.getElementById("splash-screen");

        if (splashScreen && !isAndroid()) {
          splashScreen.classList.add("visible");

          window.addEventListener("load", () => {
            setTimeout(() => {
              splashScreen.classList.add("zoom");

              setTimeout(() => {
                splashScreen.classList.add("hidden");

                setTimeout(() => {
                  splashScreen.remove();
                }, 500);
              }, 0);
            }, 2000);
          });
        } else if (splashScreen) {
          splashScreen.remove();
        }
      });
    </script>
  </body>
</html>
