:root {
      --navy: #4b4c57;
      --navy-2: #13224a;
      --navy-3: #1c2d5c;
      --gold: #5662f4;
      --gold-2: #f6d27a;
      --bg: #f2f3ff;
      --ink: #0b1733;
      --ink-soft: #475067;
      --rule: #d5d7eb;
      --card: #ffffff;
    }

    * {
      box-sizing: border-box
    }

    html,
    body {
      margin: 0;
      padding: 0;
      background: var(--bg);
      color: var(--ink);
      font-family: 'Inter', system-ui, sans-serif;
      line-height: 1.8;
      -webkit-font-smoothing: antialiased
    }

    .layout a {
      color: var(--navy-2);
      text-decoration: none;
      border-bottom: 1px solid color-mix(in oklab, var(--navy-2) 25%, transparent)
    }

    .layout a:hover {
      color: var(--gold);
      border-color: var(--gold)
    }

    /* Hero */
    .privacy-hero {
      background: linear-gradient(180deg, #0b1733 0%, #13224a 100%);
      color: #fff;
      position: relative;
      overflow: hidden
    }

    .privacy-hero::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        radial-gradient(ellipse at 80% -10%, rgba(231, 184, 66, .18), transparent 55%),
        radial-gradient(ellipse at 0% 110%, rgba(231, 184, 66, .08), transparent 50%);
      pointer-events: none
    }

    .privacy-hero-inner {
      max-width: 1180px;
      margin: 0 auto;
      padding: 80px 28px 96px;
      position: relative
    }

    h1 {
      font-family: 'Playfair Display', serif;
      font-weight: 600;
      font-size: clamp(36px, 4vw, 48px);
      line-height: 1.05;
      letter-spacing: -.01em;
    }

    h1 em {
      font-style: italic;
      color: var(--gold)
    }

    /* Body layout */
    .layout {
      max-width: 1180px;
      margin: -56px auto 0;
      padding: 0 28px 80px;
      position: relative;
      grid-template-columns: 260px minmax(0, 1fr);
      gap: 56px;
      align-items: start
    }

    @media (max-width:960px) {
      .layout {
        grid-template-columns: 1fr;
        gap: 24px;
        margin-top: -40px
      }
    }

    /* Article card */
    .article-wrap {
      background: #fff;
      border: 1px solid var(--rule);
      border-radius: 12px;
      padding: 56px clamp(28px, 5vw, 72px);
      box-shadow: 0 24px 60px -30px rgba(11, 23, 51, .25)
    }

    article {
      margin: 0 auto
    }

    section {
      padding: 20px 0;
      border-top: 1px solid var(--rule)
    }

    section:first-of-type {
      border-top: none;
      padding-top: 0
    }

    section h2 {
      font-family: 'Playfair Display', serif;
      font-weight: 600;
      font-size: 24px;
      letter-spacing: -.01em;
      color: var(--navy);
      margin: 0 0 14px;
      display: flex;
      align-items: baseline;
      gap: 16px
    }

    section p {
      margin: 14px 0;
      color: var(--ink-soft);
      font-size: 15.5px
    }

    section p strong {
      color: var(--navy);
      font-weight: 600
    }

    ul.clean {
      list-style: none;
      padding: 0;
      margin: 20px 0;
      display: grid;
      gap: 8px
    }

    ul.clean li {
      padding: 12px 16px;
      background: #f4f5fd;
      border: 1px solid var(--rule);
      border-radius: 8px;
      font-size: 14px;
      color: var(--navy);
      display: flex;
      gap: 14px;
      align-items: flex-start
    }

    ul.clean li::before {
      content: "";
      display: block;
      width: 8px;
      height: 8px;
      border-radius: 2px;
      background: var(--gold);
      margin-top: 8px;
      flex: none;
      transform: rotate(45deg)
    }