/* Drasenas — reset, fixed header, footer, reveal. Shared by every page. */

    html, body {
      margin: 0;
      min-height: 100%;
      background: var(--color-paper);
      overflow-x: clip;
      -webkit-text-size-adjust: 100%;
    }

    .dz a,
    .dz button { -webkit-tap-highlight-color: rgba(61, 116, 91, .18); }

    .dz * { box-sizing: border-box; }

    .dz .motion-header {
      position: fixed;
      z-index: 60;
      top: 0;
      left: 0;
      right: 0;
      display: flex;
      align-items: center;
      min-height: var(--header-h);
      padding: 0 max(var(--pad-x), env(safe-area-inset-right)) 0 max(var(--pad-x), env(safe-area-inset-left));
      color: var(--color-ink);
      transition: color 320ms var(--ease-out);
    }

    .dz .motion-header.on-dark { color: var(--color-paper); }

    .dz #about,
    .dz #business,
    .dz #company,
    .dz #contact {
      scroll-margin-top: calc(var(--header-h) + 12px);
    }

    .dz .motion-brand {
      color: inherit;
      font-size: clamp(17px, 1.9vw, 32px);
      font-weight: 500;
      letter-spacing: .07em;
      text-decoration: none;
    }

    .dz .motion-nav {
      display: flex;
      align-items: center;
      gap: clamp(16px, 2.3vw, 40px);
      margin-left: auto;
      font-size: var(--text-label);
      font-weight: 500;
      letter-spacing: .08em;
    }

    .dz .motion-nav a { color: inherit; text-decoration: none; }

    .dz .motion-nav a:focus-visible,
    .dz a:focus-visible,
    .dz button:focus-visible {
      outline: 2px solid var(--color-green);
      outline-offset: 3px;
    }

    .dz .motion-contact {
      padding: clamp(10px, 1.1vw, 18px) clamp(16px, 1.9vw, 32px);
      border: 1px solid currentColor;
      border-radius: 999px;
      white-space: nowrap;
    }

    .dz .site-footer {
      margin: 0 var(--inset-x) 12px;
      padding: clamp(64px, 9vh, 130px) clamp(28px, 5vw, 110px) 42px;
      border-radius: 30px;
      background: var(--color-ink);
      color: var(--color-paper);
    }

    .dz .footer-statement {
      margin: 0 0 clamp(56px, 8vh, 110px);
      font-size: clamp(28px, 3.6vw, 66px);
      font-weight: 400;
      line-height: 1.2;
      letter-spacing: -.045em;
      overflow-wrap: anywhere;
    }

    .dz .footer-bottom {
      display: flex;
      flex-wrap: wrap;
      align-items: baseline;
      gap: 18px clamp(20px, 3vw, 44px);
      padding-top: 26px;
      border-top: 1px solid var(--color-rule-faint);
      font-family: var(--font-mono);
      font-size: clamp(10px, 1vw, 15px);
      letter-spacing: .12em;
    }

    .dz .footer-bottom nav {
      display: flex;
      flex-wrap: wrap;
      gap: 16px clamp(16px, 2.4vw, 34px);
    }

    .dz .footer-bottom a { color: inherit; text-decoration: none; white-space: nowrap; }

@media (hover: hover) {
      .dz .footer-bottom a:hover { color: var(--color-lime); }
}

    .dz .footer-bottom a:active { color: var(--color-lime); }

    .dz .footer-copy { margin-left: auto; color: var(--color-paper-dim); }

    /* progressive enhancement: hidden only once the script confirms it is running,
       so a JS failure never leaves the page blank */
    .dz .reveal {
      transition: opacity var(--dur-reveal) var(--ease-out), transform var(--dur-reveal) var(--ease-out);
    }

    .dz.is-js .reveal {
      opacity: 0;
      transform: translateY(28px);
    }

    .dz.is-js .reveal.is-visible {
      opacity: 1;
      transform: none;
    }

@media (max-width: 760px) {
      .dz .motion-nav a:not(.motion-contact) { display: none; }

      /* every tappable element clears 44px */
      .dz .motion-brand { padding: 9px 0; }

      .dz .motion-contact { padding: 14px 18px; }

      .dz .site-footer { margin: 0 8px 8px; padding: 56px 28px calc(24px + env(safe-area-inset-bottom)); border-radius: 22px; }

      .dz .footer-bottom { flex-direction: column; align-items: stretch; gap: 4px; font-size: 12px; }

      .dz .footer-bottom nav { flex-direction: column; gap: 0; }

      .dz .footer-bottom nav a { display: flex; align-items: center; min-height: 44px; border-bottom: 1px solid var(--color-rule-faint); }

      .dz .footer-copy { margin: 14px 0 0; }
}

@media (prefers-reduced-motion: reduce) {
      .dz .reveal {
        opacity: 1;
        transform: none;
        transition: none;
      }
}