:root {
      --smns-green: #93bf1f;
      --smns-green-dark: #4f6900;
      --smns-green-soft: #f1f7df;

      --charcoal: #464645;
      --charcoal-dark: #30302f;

      --text: #242423;
      --muted: #60605e;
      --border: #d9dad4;
      --surface: #fff;
      --background: #f5f6f2;

      --page-width: 920px;
      --radius: 0.75rem;
    }

    *,
    *::before,
    *::after {
      box-sizing: border-box;
    }

    html {
      scroll-behavior: smooth;
    }

    body {
      min-width: 320px;
      margin: 0;
      color: var(--text);
      background: var(--background);
      font-family:
        "DIN Pro",
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Arial,
        sans-serif;
      font-size: 1rem;
      line-height: 1.7;
    }

    a {
      color: var(--smns-green-dark);
      text-decoration-thickness: 0.1em;
      text-underline-offset: 0.16em;
    }

    a:hover {
      color: var(--charcoal-dark);
    }

    a:focus-visible {
      outline: 3px solid var(--smns-green);
      outline-offset: 3px;
    }

    h1,
    h2,
    h3 {
      color: var(--charcoal-dark);
      line-height: 1.2;
    }

    h1 {
      max-width: 800px;
      margin: 0;
      color: #fff;
      font-size: clamp(2rem, 5vw, 3.6rem);
    }

    h2 {
      margin-top: 2.75rem;
      padding-bottom: 0.5rem;
      font-size: clamp(1.45rem, 3vw, 2rem);
      border-bottom: 3px solid var(--smns-green);
    }

    h3 {
      margin-top: 2rem;
      font-size: 1.2rem;
    }

    p,
    li {
      max-width: 75ch;
    }

    .page-shell {
      width: min(calc(100% - 2rem), var(--page-width));
      margin-inline: auto;
    }

    .skip-link {
      position: fixed;
      z-index: 1000;
      top: 1rem;
      left: 1rem;
      padding: 0.75rem 1rem;
      color: #fff;
      background: #000;
      border-radius: 0.4rem;
      transform: translateY(-200%);
    }

    .skip-link:focus {
      transform: translateY(0);
    }

    .site-header {
      background: #fff;
      border-bottom: 1px solid var(--border);
    }

    .header-inner {
      display: flex;
      min-height: 78px;
      align-items: center;
      justify-content: space-between;
      gap: 1rem;
    }

    .brand {
      color: var(--charcoal-dark);
      font-size: 1.05rem;
      font-weight: 700;
      text-decoration: none;
    }

    .hero {
      padding-block: clamp(3rem, 8vw, 5.5rem);
      color: #fff;
      background:
        radial-gradient(
          circle at 88% 30%,
          rgb(147 191 31 / 18%),
          transparent 38%
        ),
        linear-gradient(
          120deg,
          var(--charcoal-dark),
          var(--charcoal)
        );
      border-bottom: 6px solid var(--smns-green);
    }

    .hero p {
      margin: 0 0 0.7rem;
      color: var(--smns-green);
      font-size: 0.8rem;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
    }

    main {
      padding-block: 2.5rem 5rem;
    }

    .status-box,
    .contact-box,
    .notice {
      margin-block: 1.5rem;
      padding: 1.25rem 1.4rem;
      background: var(--surface);
      border: 1px solid var(--border);
      border-radius: var(--radius);
    }

    .status-box {
      border-left: 6px solid var(--smns-green);
    }

    .status-box strong {
      display: block;
      margin-bottom: 0.25rem;
      color: var(--charcoal-dark);
    }

    .notice {
      background: var(--smns-green-soft);
      border-left: 6px solid var(--smns-green-dark);
    }

    .contact-box address {
      font-style: normal;
    }

    .metadata-list {
      padding: 0;
      list-style: none;
    }

    .metadata-list li {
      padding-block: 0.5rem;
      border-bottom: 1px solid var(--border);
    }

    .metadata-list li:last-child {
      border-bottom: 0;
    }

    .site-footer {
      padding-block: 2rem;
      color: #ddd;
      background: var(--charcoal-dark);
      border-top: 6px solid var(--smns-green);
    }

    .site-footer a {
      color: #fff;
    }

    .site-footer p {
      margin: 0;
    }

    .visually-hidden {
      position: absolute !important;
      width: 1px !important;
      height: 1px !important;
      padding: 0 !important;
      margin: -1px !important;
      overflow: hidden !important;
      clip: rect(0 0 0 0) !important;
      clip-path: inset(50%) !important;
      white-space: nowrap !important;
      border: 0 !important;
    }

    @media (max-width: 600px) {
      .header-inner {
        align-items: flex-start;
        flex-direction: column;
        justify-content: center;
        padding-block: 1rem;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      html {
        scroll-behavior: auto;
      }
    }

    @media (forced-colors: active) {
      a {
        text-decoration: underline;
      }
    }

    @media print {
      .skip-link,
      .site-header,
      .site-footer {
        display: none;
      }

      body {
        color: #000;
        background: #fff;
      }

      .hero {
        padding-block: 1rem;
        color: #000;
        background: none;
        border-bottom: 2px solid #000;
      }

      .hero h1,
      .hero p {
        color: #000;
      }

      main {
        padding-block: 1rem;
      }
    }