:root {
      --color-bg: #f2f2f2;
      --color-fg: #111;
      --color-accent: #111;
      --color-btn-hover: #222;
      --color-btn-active: #333;
      --radius: 90px;
      --font-main: 'Inter', sans-serif;
    }
    html, body {
      height: 100%; margin: 0; padding: 0;
      background: var(--color-bg); color: var(--color-fg);
      font-family: var(--font-main); min-height: 100vh;
      box-sizing: border-box; scroll-behavior: smooth;
    }
    *, *::before, *::after { box-sizing: inherit; }
    body {
      display: flex; flex-direction: column; min-height: 100vh;
    }
    header {
      display: flex; align-items: flex-end; justify-content: left; margin: 20px 20px 0 20px;
    }
    main {
      flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px;
    }
    .headline {
      font-size: 2rem; text-align: center; max-width: 400px; margin: 0 auto;
      letter-spacing: -1.1px; line-height: 1.1; font-weight: 600;
    }
    .actions {
      display: flex; gap: 16px; flex-wrap: wrap; justify-content: center; width: 100%; max-width: 420px;
    }
    .btn {
      background: linear-gradient(rgb(237, 237, 237) 0%, rgb(255, 255, 255) 100%); color: #000; border: none;
      padding: 0 32px; height: 42px; min-width: 140px; font-size: 0.8rem; font-weight: 600;
      border-radius: var(--radius); cursor: pointer; text-decoration: none;
      transition: background 0.15s, color 0.15s;
      display: flex; align-items: center; justify-content: center; gap: 8px;
	  outline: 1px solid rgb(217, 217, 217);
	  box-shadow: rgba(0, 0, 0, 0.08) 0px 2px 3.6px 0px;
    }
    .btn:active { background: var(--color-btn-active); color: #fff; opacity: 0.5; }
    .btn:focus { outline: 2px solid #1112; }
    .btn:hover:not(:active) { background: var(--color-btn-hover); color: #fff; }
    .btn__icon { width: 1.2em; height: 1.2em; }

    footer {
      padding: 20px 10px 20px 10px;
      display: flex; flex-direction: column; align-items: center; gap: 10px;
      font-size: 0.8rem; margin-top: auto; border-top-right-radius: 50px; border-top-left-radius: 50px;
    }
    .footer-links {
      display: flex; flex-wrap: wrap; gap: 12px; justify-content: center;font-weight: 600;
    }
    .footer-link {
      color: #000; text-decoration: none; opacity: 0.9; font-size: 0.7rem;
      transition: opacity 0.15s;
    }
    .footer-link:hover { opacity: 0.7; text-decoration: underline; }
    .footer-copy {
      font-size: 0.7rem; opacity: 0.7; text-align: center;
    }
    @media (max-width: 600px) {
      main { gap: 20px; padding: 20px 4px 16px 4px; }
      .headline { font-size: 1.8rem; }
      .btn { height: 40px; padding: 0 24px; font-size: 0.8rem; min-width: 100px; }
      .footer-links { gap: 8px; font-size: 0.8rem; }
      .footer-copy { font-size: 0.8rem; }
    }