@font-face {
      font-family: 'Lusail';
      font-style: normal;
      font-weight: 400;
      font-display: swap;
      src: url('/assets/fonts/Lusail%20Font/WOFF/Lusail-Regular.woff2') format('woff2'),
           url('/assets/fonts/Lusail%20Font/WOFF/Lusail-Regular.woff') format('woff'),
           url('/assets/fonts/Lusail%20Font/TTF/Lusail-Regular.ttf') format('truetype');
    }
    @font-face {
      font-family: 'Lusail Light';
      font-style: normal;
      font-weight: 300;
      font-display: swap;
      src: url('/assets/fonts/Lusail%20Font/Lusail-Light.otf') format('opentype');
    }
    * { margin: 0; padding: 0; box-sizing: border-box; }
    body { font-family: 'Lusail', Arial, sans-serif; color: #1E2E40; background: #fff; }
    a { color: inherit; text-decoration: none; }

    :root {
      --color-primary: #00417B;
      --color-primary-2: #0D5A9E;
      --color-gold: #9F692A;
      --color-line: #DCE4ED;
      --container-pad: clamp(24px, 4vw, 96px);
    }

    .news-detail-main {
      width: 100%;
      max-width: 980px;
      margin: 0 auto;
      padding: 52px var(--container-pad) 70px;
    }
    .news-breadcrumb {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      color: var(--color-primary-2);
      font-size: 14px;
      margin-bottom: 22px;
    }
    .news-breadcrumb .sep { opacity: 0.5; }
    .news-title {
      font-family: 'Lusail Light', 'Lusail', sans-serif;
      font-size: clamp(30px, 4vw, 46px);
      line-height: 1.2;
      color: var(--color-primary);
      margin-bottom: 16px;
    }
    .news-date-row {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 36px;
    }
    .news-date-bar {
      width: 2px;
      height: 24px;
      background: var(--color-gold);
      flex-shrink: 0;
    }
    .news-date {
      font-size: 18px;
      color: #1F2E3D;
    }
    .news-article {
      border-top: 1px solid var(--color-line);
      padding-top: 30px;
      display: grid;
      gap: 20px;
    }
    .news-article p,
    .news-article div {
    font-size: 20px;
    line-height: 1.7;
    color: #23384D;
}
    .news-article .lead {
      font-size: 22px;
      color: #173A61;
    }
    .news-feature-image-wrap {
      margin: 0 0 36px;
    }
    .news-feature-image {
      display: block;
      width: min(100%, 760px);
      height: auto;
      margin: 0 auto;
      border-radius: 4px;
      object-fit: cover;
    }
    .news-back-link {
      margin-top: 42px;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      color: var(--color-primary);
      text-decoration: underline;
      font-size: 18px;
    }

    @media (max-width: 900px) {
      .news-article p { font-size: 18px; }
    }
    /* ── Skeleton Loading ─────────────────────────────────────────────── */
@keyframes shimmer {
    0%   { background-position: -800px 0; }
    100% { background-position:  800px 0; }
}

.skeleton {
    background: linear-gradient(90deg, #e8edf2 25%, #f5f7fa 50%, #e8edf2 75%);
    background-size: 800px 100%;
    animation: shimmer 1.5s infinite linear;
    border-radius: 4px;
    color: transparent !important;
    user-select: none;
    pointer-events: none;
}

.skeleton-title {
    height: 48px;
    width: 80%;
    margin-bottom: 16px;
    border-radius: 4px;
}

.skeleton-date {
    height: 24px;
    width: 180px;
    border-radius: 4px;
}

.skeleton-image {
    width: min(100%, 760px);
    height: 400px;
    margin: 0 auto 36px;
    display: block;
    border-radius: 4px;
    background: linear-gradient(90deg, #e8edf2 25%, #f5f7fa 50%, #e8edf2 75%);
    background-size: 800px 100%;
    animation: shimmer 1.5s infinite linear;
}

.skeleton-line {
    height: 20px;
    border-radius: 4px;
    margin-bottom: 12px;
}

.skeleton-line:nth-child(1) { width: 100%; }
.skeleton-line:nth-child(2) { width: 95%; }
.skeleton-line:nth-child(3) { width: 100%; }
.skeleton-line:nth-child(4) { width: 88%; }
.skeleton-line:nth-child(5) { width: 100%; }
.skeleton-line:nth-child(6) { width: 72%; }