<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="Biggle's Blog is closed. Thank you for your support throughout the years.">
    <meta name="robots" content="noindex,nofollow">
    <title>Biggle's Blog</title>
    <style>
      :root {
        color-scheme: light;
        --bg: oklch(96.5% 0.012 75);
        --ink: oklch(23% 0.018 68);
        --muted: oklch(45% 0.02 68);
        --line: oklch(82% 0.018 72);
        --accent: oklch(48% 0.13 158);
        --accent-soft: oklch(90% 0.045 156);
      }

      * {
        box-sizing: border-box;
      }

      html {
        min-height: 100%;
      }

      body {
        min-height: 100vh;
        margin: 0;
        display: grid;
        place-items: center;
        padding: 32px 20px;
        background:
          linear-gradient(140deg, oklch(97% 0.012 78), oklch(93% 0.018 138)),
          var(--bg);
        color: var(--ink);
        font-family: ui-serif, Georgia, Cambria, "Times New Roman", serif;
      }

      main {
        width: min(100%, 680px);
      }

      .notice {
        border-top: 1px solid var(--line);
        border-bottom: 1px solid var(--line);
        padding: clamp(34px, 8vw, 72px) 0;
      }

      h1 {
        max-width: 11ch;
        margin: 0;
        font-size: clamp(48px, 9vw, 88px);
        line-height: 0.94;
        font-weight: 500;
        letter-spacing: 0;
      }

      p {
        max-width: 54ch;
        margin: 26px 0 0;
        color: var(--muted);
        font-size: clamp(18px, 2.4vw, 22px);
        line-height: 1.55;
      }

      .signoff {
        margin-top: 38px;
        color: var(--ink);
        font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
        font-size: 14px;
        font-weight: 650;
        letter-spacing: 0.08em;
        text-transform: uppercase;
      }

      @media (max-width: 520px) {
        body {
          place-items: end start;
          padding: 28px 22px;
        }

        h1 {
          max-width: 9ch;
        }
      }
    </style>
  </head>
  <body>
    <main aria-labelledby="title">
      <section class="notice">
        <h1 id="title">Biggle's Blog is closed.</h1>
        <p>We truly appreciate all your support throughout the years.</p>
        <p class="signoff">Best wishes, Mario Binder</p>
      </section>
    </main>
  </body>
</html>
