@font-face { font-family: "Libertinus Serif"; src: url("fonts/libertinus-serif.woff") format("woff"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: Poppins; src: url("fonts/poppins.woff") format("woff"); font-weight: 400; font-style: normal; font-display: swap; }
  /* Camunda Brand Guidelines v4.0, Enterprise (light) mode */
  :root {
    --sand: #F5F3ED;
    --white: #FFFFFF;
    --black: #1B1B1B;
    --mid-gray: #6F6F6F;
    --line: #DFDDD8;
    --orange: #FC5D0D;
    --purple: #6967FF;
    --green: #CBF05A;
  }
  * { box-sizing: border-box; }
  html, body { margin: 0; }
  body {
    background: var(--sand);
    color: var(--black);
    font-family: Poppins, system-ui, "Segoe UI", sans-serif;
    font-weight: 400;
    letter-spacing: -0.02em;
    line-height: 1.4;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    position: relative;
    overflow-x: hidden;
  }

  /* Orb (Purple, with Orange and Green glowing at the edges) rising from the bottom, grid texture on top */
  .orb {
    position: absolute; left: 0; right: 0; bottom: 0; height: 60vh; min-height: 380px;
    pointer-events: none; z-index: 0; overflow: hidden;
  }
  .orb::before {
    content: ""; position: absolute; left: 50%; bottom: -55%;
    width: min(1100px, 150vw); aspect-ratio: 1; transform: translateX(-50%);
    border-radius: 50%;
    background:
      radial-gradient(circle at 18% 40%, rgba(252,93,13,.55) 0, rgba(252,93,13,0) 38%),
      radial-gradient(circle at 82% 38%, rgba(203,240,90,.7) 0, rgba(203,240,90,0) 38%),
      radial-gradient(circle, #6967FF 0, #8785FF 55%, rgba(135,133,255,0) 72%);
    filter: blur(28px);
  }
  .orb::after {
    content: ""; position: absolute; inset: 0;
    background-image:
      repeating-linear-gradient(0deg, rgba(27,27,27,.14) 0 1px, transparent 1px 14px),
      repeating-linear-gradient(90deg, rgba(27,27,27,.14) 0 1px, transparent 1px 14px);
    -webkit-mask-image: linear-gradient(to top, #000 10%, transparent 85%);
            mask-image: linear-gradient(to top, #000 10%, transparent 85%);
  }

  header, main, footer { position: relative; z-index: 1; }
  header { padding: 24px 32px; border-bottom: 1px solid var(--line); background: var(--sand); }
  header { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
  header svg { width: auto; display: block; }
  header .epp { height: 56px; }
  .parent { display: flex; align-items: center; gap: 12px; text-decoration: none; font-size: .8rem; color: var(--mid-gray); }
  .parent svg { height: 22px; }

  main { flex: 1; width: 100%; max-width: 820px; margin: 0 auto; padding: 72px 32px 48px; }

  h1 {
    font-family: "Libertinus Serif", Georgia, serif; font-weight: 400;
    font-size: clamp(2.6rem, 8vw, 4.75rem); line-height: 1.05; letter-spacing: -0.03em;
    margin: 0 0 8px;
  }
  .lead {
    font-family: "Libertinus Serif", Georgia, serif;
    font-size: clamp(1.4rem, 3.6vw, 2rem); line-height: 1.15; letter-spacing: -0.03em;
    margin: 0 0 28px;
  }
  p { margin: 0 0 16px; max-width: 34em; color: var(--black); }

  .card {
    margin-top: 40px; background: var(--white); border: 1px solid var(--line);
    padding: 24px 28px; display: grid; grid-template-columns: 8rem 1fr; gap: 10px 16px; max-width: 34em;
  }
  .card dt { color: var(--mid-gray); font-size: .85rem; text-transform: uppercase; letter-spacing: .02em; }
  .card dd { margin: 0; }
  a { color: var(--black); text-underline-offset: 3px; }

  /* Primary button: Black fill, White text, Green square marker */
  .btn {
    display: inline-flex; align-items: center; gap: 10px; margin-top: 28px;
    background: var(--black); color: var(--white); text-decoration: none;
    padding: 14px 22px; border-radius: 2px;
  }
  .btn::before { content: ""; width: 8px; height: 8px; background: var(--green); display: block; }
  .btn:hover { background: #323232; }

  footer { padding: 24px 32px; font-size: .8rem; color: var(--black); }
  footer nav a { color: var(--black); }

  @media (max-width: 560px) {
    header, footer { padding-left: 16px; padding-right: 16px; }
    main { padding: 48px 16px 32px; }
    .card { grid-template-columns: 1fr; padding: 20px; }
  }

  /* Legal pages */
  .legal h1 { font-size: clamp(2rem, 5vw, 3rem); }
  .legal h2 { font-family: Poppins, system-ui, sans-serif; font-size: 1rem; margin: 32px 0 8px; font-weight: 400; text-transform: uppercase; letter-spacing: .02em; color: var(--mid-gray); }
  .legal p { max-width: 40em; }
  footer nav { display: flex; gap: 20px; flex-wrap: wrap; margin-top: 8px; }