nginx/maintenance.html

<!doctype html>
<html lang="en-NZ">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="robots" content="noindex" />
    <title>Back soon | Goodwalk</title>
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <link
      href="https://fonts.googleapis.com/css2?family=Readex+Pro:wght@400;500&family=Unbounded:wght@700;800&display=swap"
      rel="stylesheet"
    />
    <style>
      :root {
        --green: #213021;
        --yellow: #ffd100;
        --off-white: #f8f7f2;
        --line: rgba(255, 255, 255, 0.16);
      }

      * {
        box-sizing: border-box;
      }

      html,
      body {
        margin: 0;
        min-height: 100%;
      }

      body {
        display: grid;
        place-items: center;
        padding: 24px;
        background: var(--green);
        color: var(--off-white);
        font-family: "Readex Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
        line-height: 1.6;
      }

      main {
        width: min(100%, 30rem);
        text-align: center;
      }

      .logo {
        height: 36px;
        width: auto;
        margin-bottom: 40px;
      }

      h1 {
        margin: 0 0 16px;
        font-family: "Unbounded", sans-serif;
        font-size: clamp(1.6rem, 5vw, 2.1rem);
        font-weight: 800;
        line-height: 1.1;
        letter-spacing: -0.03em;
        color: var(--off-white);
      }

      p {
        margin: 0 auto;
        max-width: 26rem;
        color: rgba(248, 247, 242, 0.82);
        font-size: 1rem;
      }

      .contact {
        margin-top: 32px;
        padding-top: 28px;
        border-top: 1px solid var(--line);
        font-size: 0.95rem;
        color: rgba(248, 247, 242, 0.7);
      }

      .contact a {
        color: var(--yellow);
        font-weight: 500;
        text-decoration: none;
        border-bottom: 1px solid rgba(255, 209, 0, 0.4);
        padding-bottom: 1px;
      }

      .contact a:hover {
        border-bottom-color: var(--yellow);
      }
    </style>
  </head>
  <body>
    <main>
      <img class="logo" src="/m/logo.png" alt="Goodwalk" width="241" height="48" />
      <h1>Back on the lead shortly</h1>
      <p>
        We’re making a few quick updates. The site will be back to normal in a moment — thanks for your patience.
      </p>
      <p class="contact">
        Need us now? Email
        <a href="mailto:info@goodwalk.co.nz">info@goodwalk.co.nz</a>
        or call <a href="tel:+64226421011">(022) 642 1011</a>.
      </p>
    </main>

    <script>
      setTimeout(function () {
        window.location.reload();
      }, 60000);
    </script>
  </body>
</html>