/* Use-case page only: keep it safe and contained */
    .uc-top{
      display:grid;
      place-items:center;
      gap:10px;
      padding: 14px 10px 6px;
    }
    .uc-title{
      font-family:var(--font-display);
      font-size: clamp(22px, 3vw, 32px);
      letter-spacing:.08em;
      margin:0;
      text-shadow:0 0 10px rgba(0,0,0,.9);
    }
    .uc-sub{
      margin:0;
      color: var(--muted);
      text-shadow:0 0 8px rgba(0,0,0,.85);
      font-size:15px;
    }

    .uc-links{
      display:flex;
      justify-content:center;
      flex-wrap:wrap;
      gap:10px;
      margin-top: 6px;
    }
    .uc-links a{
      display:inline-block;
      font-size:13px;
      letter-spacing:.06em;
      text-transform:uppercase;
      text-decoration:none;
      border-bottom: 1px solid rgba(250,230,180,.22);
      color: rgba(250,230,180,.90);
      padding: 6px 8px;
    }
    .uc-links a:hover{ border-bottom-color: rgba(250,230,180,.45); }

    .uc-grid{
      margin-top: 14px;
      display:grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
    }

    .uc-card{
      margin:0;
      border-radius: 16px;
      border: 1px solid rgba(255,255,255,.10);
      background:
        linear-gradient(180deg, rgba(255,255,255,.06), transparent 55%),
        rgba(0,0,0,.12);
      overflow:hidden;
      box-shadow: 0 14px 30px rgba(0,0,0,.45);
    }

    .uc-btn{
      appearance:none;
      border:none;
      padding:0;
      background:transparent;
      cursor:pointer;
      width:100%;
      display:block;
    }

    .uc-img{
      width:100%;
      height:auto;
      display:block;
      object-fit:cover;
    }

    .uc-cap{
      padding: 10px 12px 12px;
      text-align:center;
      font-family:var(--font-display);
      letter-spacing:.08em;
      text-transform:uppercase;
      font-size: 14px;
      color: rgba(231,226,219,.92);
      text-shadow: 0 0 8px rgba(0,0,0,.85);
      border-top: 1px solid rgba(255,255,255,.08);
      background: rgba(0,0,0,.12);
    }

    @media (max-width: 980px){
      .uc-grid{ grid-template-columns: 1fr; }
    }

    /* Viewer: make the image wide (use-case is landscape) */
    .uc-viewer .viewer-img{
      aspect-ratio: 16 / 9;
      max-height: min(70vh, 780px);
      background-size: contain;
    }
