.overview-page {
      padding-top: 3rem;
    }

    .overview-page .content-block {
      margin-bottom: 0;
    }

    .overview-nav,
    .overview-metrics,
    .overview-grid,
    .support-grid,
    .identity-grid {
      display: grid;
      gap: 1rem;
    }

    .overview-nav {
      grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
      margin-bottom: 2rem;
    }

    .overview-nav a {
      display: block;
      padding: 1rem 1.1rem;
      color: var(--text);
      background: var(--surface);
      border: 1px solid var(--border);
      border-radius: var(--radius);
      box-shadow: var(--shadow-sm);
    }

    .overview-nav strong {
      display: block;
      color: var(--primary);
      font-size: 1rem;
      margin-bottom: 0.2rem;
    }

    .overview-nav span {
      display: block;
      color: var(--muted);
      font-size: 0.86rem;
      line-height: 1.55;
    }

    .overview-metrics {
      grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr));
      align-items: stretch;
      margin-bottom: 1.5rem;
    }

    .metric-card,
    .overview-panel,
    .support-card,
    .identity-card,
    .compact-card {
      background: var(--surface);
      border: 1px solid var(--border);
      border-radius: var(--radius);
      box-shadow: var(--shadow-sm);
    }

    .metric-card {
      padding: 1.1rem;
      min-height: 118px;
    }

    .metric-card strong {
      display: block;
      color: var(--accent);
      font-family: var(--font-serif);
      font-size: clamp(1.6rem, 3vw, 2.3rem);
      line-height: 1;
      margin-bottom: 0.55rem;
    }

    .metric-card span {
      display: block;
      color: var(--text);
      font-weight: 700;
      line-height: 1.35;
    }

    .metric-card small {
      display: block;
      color: var(--muted);
      font-size: 0.82rem;
      line-height: 1.5;
      margin-top: 0.2rem;
    }

    .overview-panel {
      height: 100%;
      padding: 1.15rem;
    }

    .overview-panel h3,
    .support-card h3,
    .identity-card h3,
    .compact-card h3 {
      margin: 0 0 0.55rem;
      color: var(--primary);
      font-size: 1.05rem;
    }

    .overview-panel p,
    .support-card p,
    .identity-card p,
    .compact-card p {
      margin: 0;
      color: var(--text);
      line-height: 1.65;
    }

    .overview-grid {
      grid-template-columns: minmax(0, 1.05fr) minmax(280px, 0.95fr);
      align-items: stretch;
    }

    .overview-photo-row {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 1rem;
      margin: 1rem 0 1.3rem;
    }

    .overview-photo-card {
      position: relative;
      min-height: 220px;
      margin: 0;
      overflow: hidden;
      border-radius: var(--radius);
      border: 1px solid var(--border);
      background: var(--surface);
      box-shadow: var(--shadow-sm);
    }

    .overview-photo-card img {
      display: block;
      width: 100%;
      height: 100%;
      aspect-ratio: 16 / 10;
      object-fit: cover;
    }

    .overview-section-visual {
      position: relative;
      min-height: 100%;
      margin: 0;
      overflow: hidden;
      border-radius: var(--radius);
      border: 1px solid var(--border);
      background: var(--surface);
      box-shadow: var(--shadow-sm);
    }

    .overview-section-visual img {
      display: block;
      width: 100%;
      height: 100%;
      min-height: 220px;
      aspect-ratio: 16 / 10;
      object-fit: cover;
    }

    .support-grid {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .support-card,
    .identity-card,
    .compact-card {
      height: 100%;
      padding: 1rem;
    }

    .support-card .tag,
    .identity-card .tag,
    .compact-card .tag {
      display: inline-flex;
      align-items: center;
      min-height: 24px;
      padding: 0 0.55rem;
      margin-bottom: 0.65rem;
      color: var(--accent);
      background: var(--accent-soft);
      border-radius: 999px;
      font-size: 0.78rem;
      font-weight: 700;
    }

    .identity-grid {
      grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
      align-items: start;
    }

    .identity-grid--five {
      grid-template-columns: repeat(6, minmax(0, 1fr));
    }

    .identity-grid--five .identity-card {
      grid-column: span 2;
    }

    .identity-grid--five .identity-card:nth-last-child(2) {
      grid-column: 2 / span 2;
    }

    .identity-grid--five .identity-card:last-child {
      grid-column: 4 / span 2;
    }

    .compact-list {
      list-style: none;
      padding: 0;
      margin: 0;
      display: grid;
      gap: 0.7rem;
    }

    .compact-list li {
      display: grid;
      grid-template-columns: 34px minmax(0, 1fr);
      gap: 0.75rem;
      align-items: start;
      padding: 0.9rem 1rem;
      margin: 0;
      background: var(--surface);
      border: 1px solid var(--border);
      border-left: var(--highlight-border);
      border-radius: var(--radius);
    }

    .compact-list .num {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 30px;
      height: 30px;
      color: var(--accent);
      background: var(--accent-soft);
      border-radius: 8px;
      font-weight: 700;
      line-height: 1;
    }

    .function-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 0.9rem;
    }

    .function-grid .compact-card {
      min-height: 128px;
    }

    .next-step {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 1rem;
      align-items: center;
      margin-top: 2rem;
      padding: 1.1rem 1.25rem;
      background: var(--accent-soft);
      border-left: var(--highlight-border);
      border-radius: 0 var(--radius) var(--radius) 0;
    }

    .next-step p {
      margin: 0;
      color: var(--text);
    }

    .footer-next {
      color: var(--accent);
    }

    @media (max-width: 900px) {
      .overview-metrics,
      .identity-grid,
      .support-grid,
      .function-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      .identity-grid--five {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      .identity-grid--five .identity-card,
      .identity-grid--five .identity-card:nth-last-child(2),
      .identity-grid--five .identity-card:last-child {
        grid-column: auto;
      }

      .overview-grid {
        grid-template-columns: 1fr;
      }

      .overview-photo-row {
        grid-template-columns: 1fr;
      }

    }

    @media (max-width: 560px) {
      .overview-page {
        padding-top: 2rem;
      }

      .overview-metrics,
      .identity-grid,
      .identity-grid--five,
      .support-grid,
      .function-grid,
      .next-step {
        grid-template-columns: 1fr;
      }
    }